@import url(http://fonts.googleapis.com/earlyaccess/notosanssc.css);
@import url(http://fonts.googleapis.com/earlyaccess/notosanstc.css);
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP|Noto+Serif+JP");

html {
    font-size: 10px;
}
body {
    font-family: 'Noto Sans JP','sans-serif','Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Meiryo', 'メイリオ';
    min-width: 1200px;
    font-size: 10px;
    -webkit-text-size-adjust: 100%;
}
.sp{
    display: none;
}
.sp_img{
    display: none;
}
.lazyload{
    opacity: 0;
}
.lazyloaded{
    opacity: 1;
    transition: all 0.5s;
}
body.scroll_lock{
    overflow: hidden;
}
html.lity-active body{
    overflow: hidden;
}

/*hover_actions*/
a{
    transition: 0.3s;
}
a:hover{
    opacity: 0.5;
}
button{
    cursor: pointer;
    transition: 0.3s;
}
button:hover{
    opacity: 0.5;
}

.character_box a{
    position: relative;
    top: 0;
    transition: 0.2s;
    transform: rotate(-45deg);
    display: inline-block;

}
.character_box a .character_name{
    position: absolute;
    left: -185px;
    right: 0;
    top: auto;
    bottom: 15px;
    margin: auto;
    transform: rotate(45deg);
    width: 100%;
    text-align: center;
}
.chara_thm{
    height: 244px;
    width: 244px;
}

.character_box a:hover{
    opacity: 1;
}
.character_box a.active{
    top: -8px;
}

/**/
.news_list::-webkit-scrollbar{
    width: 4px;
    border-radius: 10px;
}

.news_list::-webkit-scrollbar-track{
    background: #fff3f3;
    border: none;
    box-shadow: inset 0 0 2px #fff; 
    border-radius: 10px;
}
.news_list::-webkit-scrollbar-thumb{
    background: #ffe3e3;
    box-shadow: none;
    border-radius: 10px;
}


@media screen and (max-width:640px) {
    .pc{
        display: none;
    }
    .sp{
        display: block;
    }
    .sp_img{
        display: inline-block;
    }

    .news_list::-webkit-scrollbar{
        width: 8px;
        border-radius: 10px;
    }

    .news_list::-webkit-scrollbar-track{
        background: #fff3f3;
        border: none;
        box-shadow: inset 0 0 2px #fff; 
        border-radius: 10px;
    }
    .news_list::-webkit-scrollbar-thumb{
        background: #ffe3e3;
        box-shadow: none;
        border-radius: 10px;
    }
    
    .character_box a .character_name{
    position: absolute;
    left: -228px;
    right: 0;
    top: auto;
    bottom: 14px;
    margin: auto;
    transform: rotate(45deg);
    width: 100%;
    text-align: center;
}

}


/*ツイッタ*/
iframe#twitter-widget-0{
    width: 100% !important;
}
iframe#twitter-widget-1{
    width: 100% !important;
}
.twitter_bg{
    border-radius:10px;
    box-shadow:none;
    border:1px solid #fee7ee;
    padding: 20px 14px;
    background:rgba(255,255,255,0.95);
    box-sizing: border-box;
    width: 290px;
}

img{
    vertical-align: bottom;
}


#loader-bg {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 110;
    background-image: url(../img/bg_load.jpg);
    background-repeat: repeat;
}

#loader {
    position: fixed;
    top: 49%;
    left: 0%;
    height: 30px;
    width: 100%;
    z-index: 120;
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-width: 700px;
}

#loader .rt {
    position: fixed;
    top: 0;
    right: 0;
}

#loader .lb {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 30;
}



.loadanime {
    animation: loadanime 0.5s forwards;
    transform: rotateY(90deg);
}

@keyframes loadanime {
    0% { transform: rotateY(90deg); }
    100% { transform: rotateY(0deg); }
}

.load07 {
    animation: load07 0.8s forwards;
    transform: rotateY(90deg);
}

@keyframes load07 {
    0% { transform: rotateY(90deg); }
    60% { transform: rotateY(0deg); }
    61% { transform: rotate(0deg); }
    100% { transform: rotate(-19deg); }
}

.load02 {animation-delay: 0.05s;}
.load03 {animation-delay: 0.1s;}
.load04 {animation-delay: 0.15s;}
.load05 {animation-delay: 0.2s;}
.load06 {animation-delay: 0.25s;}
.load07 {animation-delay: 0.3s;}
.load08 {animation-delay: 0.35s;}
.load09 {animation-delay: 0.4s;}
.load10 {animation-delay: 0.45s;}
.load11 {animation-delay: 0.6s;}

.kv {
    position: relative;
    height: 1058px;
    background-image: url(../img/bg.jpg);
}

.outer {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.kv .lb img{
    width: 100%;
}


.kv .rt {
    position: absolute;
    top: 0;
    right: 0;
}

.kv .lb {
    position: absolute;
    bottom: -6px;
    left: 0;
    z-index: 30;
}

.kv .mv {
    position: absolute;
    top: 25px;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 40;
    width: 907px;
    text-align: center;
}

.animeka_area{
    top: 170px;
    position: absolute;
    left: 40px;
    z-index: 40;
    width: 374px;
}
.kv .news {
    top: 309px;
    position: absolute;
    left: 40px;
    z-index: 40;
    width: 374px;
}

.lity-close {
	display: none;
}

.movie_close{
    display: block;
    margin: auto;
    background: url(../img/btn_close.png) no-repeat center;
    width: 46px;
    height: 46px;
    border: none;
    position: absolute;
    right: 0%;
    top: 0px;
}

.play_movie {
	position: relative;
	width: 650px;
	padding-top: 50px;
}

.news-detail .play_movie {
	margin: 0 auto;
	padding-bottom: 50px;
}

.play_movie_inner {
  position:relative;
  width:100%;
  padding-top:56.25%;
}

.play_movie_inner iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

.lity-wrap {
	background-color: rgba(255,255,255,0.7);
}

.fv_pv {
	width: 290px;
	margin-bottom: 30px;
}

.fv_pv img {
	width: 100%;
	border-radius: 10px;
	border: 1px solid #fee9ef;
}

.animeka02{
    padding-top: 15px;
}

.row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.special {
	text-align: center;
	z-index: 50;
	position: absolute;
	top: 1020px;
	width: 100%;
}

.special .box {
	width: 1000px;
    margin: 0 auto;
}

.special .banner {
	width: 50%;
}

.special .bnr01,.special .bnr02 {
	position: relative;
	width: 100%;
	margin: 0 auto;
}

.special .bnr01 img,.special .bnr02 img {
	width: 100%;
}

.special .bnr01-anime {
  animation: show 10s infinite;
  -webkit-animation: show 10s infinite;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.special .bnr01 div:nth-of-type(2) {
	animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.special .bnr01 div:nth-of-type(3) {
	animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.special .bnr01 div:nth-of-type(4) {
	animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}


@keyframes show {
  0% {
	opacity: 0; }
  5% {
	opacity: 1; }
  25% {
	opacity: 1; }
  30% {
	opacity: 0; }
}
@-webkit-keyframes show {
  0% {
	opacity: 0; }
  5% {
	opacity: 1; }
  20% {
	opacity: 1; }
  30% {
	opacity: 0; }
}


.box_title{
    padding-bottom: 10px;
}
.news_title{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 290px;
}
.news_list_link{
    color: #000;
    text-decoration: none;
    position: relative;
    font-size: 1.4rem;
    padding: 0 15px 0 0;
}
.news_list_link:after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 10px;
    border-color: transparent transparent transparent #000000;
    position: absolute;
    right:0;
    top:2px;
    bottom: 0;
    margin: auto;
}


.news_list_area{
    width: 290px;
    background:rgba(255,255,255,0.95);
    border: 1px solid #fee9ef;
    border-radius: 10px;
    padding: 20px 14px;
    box-sizing: border-box;
    height: 150px;
}
.news_list{
    overflow-y: scroll;
    padding-right: 10px;
    height: 100%;
}
.news_list li{
    font-size: 1.2rem;
    padding: 10px;
    box-sizing: border-box;
    border-top: 1px solid #fee9ef;
}
.news_list li:first-child{
    border-top: none;
}

.news_list li a{
    text-decoration: none;
    color: #231815;
    line-height: 1.5rem;
}
.news_list li a .date{
    color: #db6260;
    font-size: 1.0rem;
}
.twitter_area{
    padding-top: 30px;
}

.kv .inner {
    width: 1200px;
    height: 1058px;
    margin: 0 auto;
    position: relative;
}
.menu {
    padding: 0;
    margin: 0 auto;
    width: 58px;
    height: 56px;
    position: fixed;
    top:50%;
    left:20px;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 1920px auto;
    z-index: 200;
    opacity: 0;
}

.share {
    z-index: 200;
    opacity: 0;
    transition: 0.3s;
    pointer-events: none;
}

.inner {
    width: 1200px;
    margin: 0 auto;
}

body.is-fixed .menu,body.is-fixed .share {
    opacity: 1;
    transition: all 300ms 0s ease;
    pointer-events: none;
}

.chara0 {
    position: absolute;
    top:322px;
    right: 206px;
    z-index: 29;
}
.chara1 {
    position: absolute;
    top:77px;
    right: -224px;
    z-index: 25;
}
.chara2 {
    position: absolute;
    top:159px;
    right: 417px;
    z-index: 26;
}
.chara3 {
    position: absolute;
    top:484px;
    right: 424px;
    z-index: 27;
}
.chara4 {
    position: absolute;
    top:477px;
    left: 432px;
    z-index: 28;
}
/*pc_menubtn*/
.menu_btn_area{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    position: fixed;
    justify-content: space-between;
    z-index: 80;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    max-width: 1200px;
    padding: 0 50px;
    box-sizing: border-box;
    pointer-events: none;
}

.menu_btn{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    align-items: center;
    pointer-events: none;
}
.sns_btn{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    align-items: center;
    pointer-events: none;
}
.is-fixed .sns_btn,.is-fixed .menu_btn{
    pointer-events: auto;
}


.sns_btn .menu_sns{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    flex-direction: column;
    width: 42px;
}
.sns_btn .menu_sns li{
    margin-bottom: 9px;
    border: 3px solid #fff;
    border-radius: 2px;
}
/*pc_random_voice_area*/
.random_voice_area{
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(230,88,84,0.9);
    width: 100%;
    height: 100%;
    z-index: 100;
    transition: 0.3s;
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    align-items: center;
    transition: 0.3s;
}
.random_voice_area.active{
    opacity: 0;
    pointer-events: none;
}

.random_voice_box{
    background: #fff;
    box-sizing: border-box;
    padding: 18px 20px;
    width: 1120px;
    height: 640px;
    margin: auto;
    border-radius: 10px;
    overflow: hidden;
}
.random_voice_box_outer{
    width: 1120px;
    margin: auto;
    position: relative;
    z-index: 110;
}

.random_voice_close{
    position: absolute;
    right: 0;
    top: -50px;
    margin: auto;
}

.random_voice_box_inner{
    height: 100%;
    background: url(../img/chara_detail_edge_lb.png) no-repeat left bottom,url(../img/chara_detail_edge_rt.png) no-repeat right top #fff;
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.random_voice_left{
    width: 600px;
    margin-right: 300px;
}
.random_voice_right{
    pointer-events: none;
}
.random_voice_right.random_chara01{
    position: absolute;
    top:95px;
    right: -370px;
}
.random_voice_right.random_chara01 img{
    width: 80%;
}
.random_voice_right.random_chara02{
    position: absolute;
    top:95px;
    right: -50px;
}

.random_voice_right.random_chara03{
    position: absolute;
    top:95px;
    right: -38px;
}
.random_voice_right.random_chara03 img{
    width: 100%;
}

.random_voice_right.random_chara04{
    position: absolute;
    top:95px;
    right: -84px;
}
.random_voice_right.random_chara04 img{
    width: 100%;
    transform: rotate(-10deg);
}


.random_voice_text{
    height: 183px;
    width: 100%;
    color: #000;
    background: #e7605d;
    border-radius: 10px;
    color: #fff;
    font-size: 2.2rem;
    text-align: center;
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.5;
    position: relative;
    box-sizing: border-box;
    padding: 0 20px;
}
.random_voice_text:before{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7.5px 0 7.5px 16px;
    border-color: transparent transparent transparent #e7605d;
    content: "";
    position: absolute;
    right: -16px;
    top: 0;
    bottom: 0;
    margin: auto;
}

.random_voice_btn{
    text-align: center;
    padding: 70px 0 50px;
}
.random_voice_syurui{
    text-align: center;
    font-size: 1.9rem;
    line-height: 1.7em;

}


/*pc_menu*/
.menu_bg{
    position: fixed;
    left: 0;
    top: 0;
    background: none;
    width: 100%;
    height: 150%;
    z-index: 500;
    transition: 0.3s;
    pointer-events: none;
}
.menu_bg.active{
    pointer-events: auto;
    background: rgba(230,88,84,0.9);
}

.menu_frame {
	height: 100vh;
}

.menu_outer {
    height: 100%;
    position: absolute;
    transition: 0.3s;
    left: -800px;
    top: 0;
}

.menu_outer .inner {
	position: relative;
	width: auto;
}

.menu_bg.active .menu_outer{
    left: 0;
}
.menu_area{
    background: #fff;
    width: 430px;
    height: 100vh;
    transition: 0.3s;
    box-sizing: border-box;
    position: relative;
}

 .menu_inside {
    padding: 30px 50px;
    background: #fff;
}

.menu_logo{
    margin-bottom: 70px;
}
.menu_logo img{
    width: 100%;
    height: auto;
}

 .menu_list li{
    margin-bottom: 50px;
    text-align: center;
}
.menu_list li img.menu01{
    width: 60px;
    height: auto;
}
.menu_list li img.menu02{
    width: 145px;
    height: auto;
}
.menu_list li img.menu03{
    width: 120px;
    height: auto;
}
.menu_list li img.menu04{
    width: 110px;
    height: auto;
}
.menu_list li img.menu05{
    width: 65px;
    height: auto;
}
.menu_list li img.menu06{
    width: 160px;
    height: auto;
}
.menu_list li img.menu07{
    width: 57px;
    height: auto;
}

.menu_list li img.menu08{
    width: 66px;
    height: auto;
}

.menu_list li img.menu09{
    width: 80px;
    height: auto;
}

.menu_list li img.menu10{
    width: 90px;
    height: auto;
}

.menu_close{
    height: 72px;
	box-sizing: border-box;
	position: absolute;
	top: 0;
	bottom: 0;
	right: -110px;
	margin: auto;
}

 .menu_area .menu_sns{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    justify-content: space-between;
    width: 130px;
    margin: auto;
}
 .menu_sns img{
    width: 36px;
    height: auto;
}



/*pc_content*/


.itimatu_bg{
    background-image: url(../img/yellow_bg.jpg);
    border-bottom: 2px solid #e7605d;
}
.itimatu_bg02{
    background-image: url(../img/pink_bg.jpg);
    border-bottom: 2px solid #e7605d;
}
.white_bg{
    border-bottom: 2px solid #e7605d;
}
.ribbon{
    position: relative;
}
.ribbon:after{
    position: absolute;
    bottom:-25px;
    left: 0;
    right: 0;
    margin: auto;
    content: "";
    width: 84px;
    height: 47px;
    background: url(../img/icon_ribbon.png) no-repeat;
    z-index: 1;
}
.content_box{
    width: 1200px;
    margin: 0 auto;
    padding-bottom: 120px;
}
.staffcast_bg{
    background-image: url(../img/edge.png),url(../img/edge2.png);
	background-repeat: no-repeat,no-repeat;
	background-position: right -1px bottom 30px,left -1px bottom 30px;
}

.flex_style{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    justify-content: center;
}

.title_box{
    text-align: center;
    padding-top: 70px;
    padding-bottom: 90px;
}

/* title animation */

.title_base {
    position: relative;
    height: 42px;
    z-index: 2;
}

.title_img {
    z-index: 10;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.rotate {
    animation: headline 0.5s forwards;
    animation-delay: 0.8s;
}

@keyframes headline {
    0% {transform: rotate(0deg); }
    100%{transform: rotate(-19deg); }
}

.title_base img {
    z-index: 3;
}

.title_bg {
    width: 42px;
    height: 42px;
    background-color: #ff8700;
    position: absolute;
    bottom: 0;
    left: 555px;
    z-index: 1;
}

.staff_title .title_bg { left: 183px;}
.cast_title .title_bg { left: 206px;}
.cast_title .rotate { animation-delay: 1.3s; }
#character .title_bg { left: 438px;}
#story .title_bg { left: 485px;}
#books .title_bg { left: 580px;}
#onair .title_bg { left: 586px;}
#package .title_bg { left: 580px;}

.special {
	text-align: center;
	z-index: 50;
	position: absolute;
	top: 1020px;
	width: 100%;
}

#introduction {
	padding-top: 300px;
}

.introduction_list{
    text-align: center;
}
.introduction_list li{
    padding-top: 30px;
    text-align: center;
}
.introduction_list li img.sp{
    display: inline-block;
}

.introduction_list li:first-child{
    padding-top: 0;
}

.staff_cast_list li{
    padding: 50px 0 27px 0;
    background: url(../img/staff_cast_icon.png) no-repeat center 0px;
}
.staff_cast_list li:first-child{
    padding: 0 0 27px 0;
    background: none;
}
.content_left{
    width: 500px;
}
.content_right{
    width: 500px;
}
.staff_cast01{
    font-size: 1.6rem;
    text-align: center;
    padding-bottom: 10px;
}
.staff_cast02{
    font-size: 2.2rem;
    color: #ff8700;
    text-align: center;
    line-height: 1.2;
}
.staff_cast02 span{
    font-size: 1.2rem;
    line-height: 1.2;
}
.comment_btn{
    text-align: center;
    display: block;
    padding-top: 15px;
}
.comment_btn img{
    width: 114px;
    height: auto;
}
/*pc cast comment modal*/
.commnet_modal{
    border: #fff5f8 2px solid;
    width: 1120px;
    position: relative;
    background: #fff;
    border: 2px solid #db5e5a;
    border-radius: 10px;
}
.commnet_modal_box{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 55px 60px;
    box-sizing: border-box;
}
.comment_left{
    width: 354px;
    margin-right: 50px;
}
.comment_left img{
        width: 100%;
        height: auto;
    }

.comment_right{
    width: 590px;
}

.comment_modal_close{
    display: block;
    margin: auto;
    background: url(../img/chara_detail_close.png) no-repeat center;
    width: 107px;
    height: 16px;
    border: none;
    padding: 15px 0;
}
.comment_right_name{
    border-bottom: 3px solid #db5e5a;
    padding-bottom: 30px;
    margin-bottom: 30px;
}
.comment_right_name01{
    text-align: center;
    font-size: 2.0rem;
    font-weight: bold;
}
.comment_right_name02{
    font-size: 2.0rem;
    color: #db5e5a;
    padding-left: 24px;
    font-weight: bold;
}
.comment_right_name03{
    font-size: 2.6rem;
    color: #db5e5a;
    font-weight: bold;
}
.comment_right_text01{
    font-size: 1.6rem;
    line-height: 1.8;
    height: 370px;
}
.comment_right_text02{
    padding-top: 40px;
    font-size: 1.6rem;
    line-height: 1.8;
}
.comment_modal_close_box{
    padding-top: 0;
    height: 30px;
}

/*character*/
.lity{
    background: none;
}
.lity-content:after{
    box-shadow: none;

}
.lity-close{
    display: none;
}

.character_area{
    background: url(../img/charactermoyou_bg.png) no-repeat 140px 100px;
}

.character_box{
    display: -webkit-box; 
    display: -moz-box;    /*Firefox21*/
    display: -ms-flexbox; /*IE10*/
    display: -webkit-flex; /*PC-Safari,iOS8.4*/
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    width: 800px;
    margin: auto;
}
.character_box li{
    padding: 20px
}

.character_box li {
    margin-top: -60px;
}

.lity-wrap{
}
.character_modal{
    border: #fff5f8 2px solid;
    height: 633px;
    width: 1120px;
    position: relative;
    background: url(../img/chara_detail_edge_lb.png) no-repeat left 5px bottom 5px,url(../img/chara_detail_edge_rt.png) no-repeat right 5px top 5px #fff;
	border-radius: 10px;
}
.character_modal_box{
    display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.chara_text{
    width: 560px;
    font-size: 1.8rem;
    position: absolute;
    left: 508px;
    top: 284px;
    line-height: 1.6;
}
.chara_area{
    position: absolute;
    left: 93px;
    bottom: -37px;
}
.chara_name{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    width: 360px;
    position: absolute;
    left: 508px;
    height: 109px;
    bottom: 0;
    top: -180px;
    margin: auto;
}
.chara_name_inner{
    padding-bottom: 16px;
}
.chara_close{
    display: block;
    margin: auto;
    background: url(../img/chara_detail_close.png) no-repeat center;
    width: 107px;
    height: 16px;
    border: none;
    position: absolute;
    left: 708px;
    bottom: 45px;
    padding: 15px 0;
}

/* onair */
#onair {
	text-align: center;
}

#onair p {
	text-align: center;
	font-size: 1.9rem;
	padding: 10px;
}

#onair .headline {
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 3.5rem;
	padding-bottom: 40px;
}

#onair .small {
	font-size: 1.5rem;
	line-height: 3rem;
}

#onair .btn_more {
	margin-top: 40px;
}

#onair .accent {
    color: #e7605d;
    font-weight: bold;
	font-size: 1.8rem;
}

#onair .headline .accent {
	font-size: 2.4rem;
}

.flex_style{
	display: -webkit-box; 
	display: -moz-box;	/*Firefox21*/
	display: -ms-flexbox; /*IE10*/
	display: -webkit-flex; /*PC-Safari,iOS8.4*/
	display: flex;
	justify-content: center;
}

#onair .onair_list li{
	padding: 0 0 27px 0;
	font-size: 1.6rem;
	text-align: center;
	line-height: 1.2;
}

#onair .onair_list li:first-child{
	padding: 0 0 27px 0;
	background: none;
}

#onair .onair_list li p {
	font-size: 1.6rem;
	line-height: 2.5rem;
}

#onair .title_box {
    padding: 50px 0 60px 0;
}

.btn_more {
	margin: 0 auto;
	text-align: center;
	width: 200px;
}

.btn_more img {
	width: 100%;
}


/* story */

#story .capture {
	border: 10px solid #fff;
}

#story .inner {
	width: 580px;
	margin: 0 auto;
	padding: 0 0 30px 0;
	text-align: center;
}

#story .inner img {
	width:  100%;
    height: 100%;
}

#story .subtitle {
	font-weight: bold;
	font-size: 20px;
	color: #e7605d;
	padding: 30px 0 20px 0;
	border-bottom: 2px solid #e7605d;
	text-align: center;
	font-size: 2rem;
}

#story p {
	font-size: 1.5rem;
	padding: 20px 0;
	line-height: 2.5rem;
	text-align: left;
}


#story .btn_more {
	margin-top: 50px;
}


/* song */

#song .headline,#song .headline2 {
    font-size: 2.4rem;
    margin-bottom: 40px;
}

#song .headline2 {
	margin-top: 60px;
}

#song .inner {
    width: 70%;
    margin: 0 auto;
    text-align: center;
}

.song_area {
    display: flex;
    align-items: center;
    background-color: #fff;
}

.song_area .image {
    width: 50%;
    margin: 0 auto;
}

.song_area .image img {
    width: 100%;
}

.song_area .text {
    width: 50%;
    margin: 0 auto;
    padding: 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
     -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
        box-sizing: border-box;
    font-size: 1.6rem;
}

.song_area .title {
    font-size: 2rem;
    padding-bottom: 30px;
    line-height: 3rem;
}

.song_area .detail {
    line-height: 30px;
}

.song_area .detail {
    font-size: 1.4rem;
    line-height: 2rem;
}

.song_area .comment {
    display: flex;
    margin-top: 25px;
    background: url(../img/staff_cast_icon.png) no-repeat center 0px;
    padding-top: 35px;
}

.song_area .comment p {
    color: #ff8700;
}

.song_area .comment .left, .song_area .comment .right ,.song_area .comment .center {
    width: 50%;
    text-align: center;
}

.song_area .center {
    margin: auto;
}
.song_disc{
    margin-top: 30px;
}


/* package */

#package .headline,#package .headline2 {
    font-size: 2.4rem;
    margin-bottom: 40px;
}

#package .headline2 {
	margin-top: 60px;
}

#package .inner {
    width: 70%;
    margin: 0 auto;
    text-align: center;
}

.package_area {
    display: flex;
    align-items: center;
    background-color: #fff;
}

.package_area .image {
    width: 50%;
    margin: 0 auto;
}

.package_area .image img {
    width: 100%;
}

.package_area .text {
    width: 50%;
    margin: 0 auto;
    padding: 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
     -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
        box-sizing: border-box;
    font-size: 1.6rem;
}

.package_area .title {
    font-size: 2rem;
    padding-bottom: 30px;
    line-height: 3rem;
}

.package_area .detail {
    line-height: 30px;
    font-size: 1.4rem;
    line-height: 2rem;
}


/*books*/
.books_area{
    text-align: center;
}
.books_text01{
    font-size: 2.0rem;
    padding-bottom: 20px;
}
.books_text02{
    font-size: 2.4rem;
    padding-bottom: 65px;
}
.books_text03{
    font-size: 2.4rem;
    padding-top: 65px;
}
.books_img{
    width: 900px;
    display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0 auto 0;
}

.books_img a {
	margin-bottom: 30px;
}

.books_img img{
    width: 251px;
    height: 357px;
}

/*pc_footer*/
footer{
    background-image: url(../img/yellow_bg.jpg);
    padding-top: 60px;
    padding-bottom: 100px;
}

.footer_banner_list{
    width: 740px;
    margin: 0 auto;
    display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
    justify-content: center;
}
.pagetop{
    padding-top: 60px;
    text-align: center;
}
.copylight{
    text-align: center;
    padding-top: 50px;
    font-size: 1.2rem;
}

/*notfound*/
.notfound {
	text-align: center;
	font-size: 14px;
	line-height: 35px;
}

.notfound .btn_more {
	margin-top: 50px;
}


@media screen and (max-width:640px) {
    /*sp_common*/
    body{
        max-width:640px;
        min-width: 640px;
    }
    #loader{
        min-width: 100%;
    }
    .kv{
        height: auto;
    }

    .kv .inner{
        width: 100%;
        height: 1144px;
    }
    .kv .mv{
        position: absolute;
        top: 40px;
        left: 0;
        right: 0;
        margin: auto;
        width: 100%;
    }
    .animeka_area {
        top: auto;
        bottom: 0;
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        z-index: 40;
        width: 100%;
    }
    .content_box{
        width: 100%;
    }
    .character_box{
        width: 100%;
        box-sizing: border-box;

        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
        margin: auto;
    }


    .twitter_bg{
        width: 100%;
    }

    .news_title{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }
    .news_list_link{
        color: #000;
        text-decoration: none;
        position: relative;
        font-size: 2.2rem;
        padding: 0 30px 0 0;
    }
    .news_list_link:after{
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10px 0 10px 15px;
        border-color: transparent transparent transparent #000000;
        position: absolute;
        right:0;
        top:2px;
        bottom: 0;
        margin: auto;
    }


    .news_list li a{
        font-size: 2.4rem;
        line-height: 3rem;
    }
    .news_area_sp{
        padding: 40px 30px 75px;
    }
    .news_list li a .date{
        font-size: 2.0rem;
    }

    .news_list_area{
        width: 100%;
        
         height: 200px;
        /* height: 380px;*/
       
    }
    .twitter_area{
        padding-top: 40px;
    }
	
	
	.fv_pv {
    	width: 90%;
		margin: 30px auto 0 auto;
	}

	.play_movie {
		width: 560px;
	}
	
    /*mv_chara*/
    .chara0 {
        position: absolute;
        top: 430px;
        right: 117px;
        width: 58%;
        height: auto;
    }
    .chara1 {
        position: absolute;
        top: 155px;
        right: -212px;
        width: 117%;
        height: auto;
    }
    .chara2 {
        position: absolute;
        top: 216px;
        right: 276px;
        z-index: 26;
        width: 89%;
        height: auto;
    }
    .chara3 {
        position: absolute;
        top: 555px;
        right: 316px;
        z-index: 27;
        width: 52%;
        height: auto;
    }
    .chara4 {
        position: absolute;
        top: 594px;
        left: 105px;
        z-index: 28;
        width: 89%;
        height: auto;
    }

    /*sp_menubtn*/
    .menu_btn_area{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        position: fixed;
        justify-content: space-between;
        z-index: 80;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        width: 100%;
        pointer-events: none;
    }

    .menu_btn{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        align-items: center;
        pointer-events: auto;
        padding-bottom: 0;
        margin-left: 0;
        pointer-events: none;
    }
    .menu_btn a{
        pointer-events: auto;
    }
    .menu_btn_area{
        position: fixed;
        bottom: 50px;
        right: 0;
        top: auto;
        height: 60px;
    }
    .sns_btn{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        align-items: center;
        pointer-events: auto;
        padding-bottom: 0px;
        pointer-events: none;
    }
    .sns_btn .menu_sns{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        flex-direction: initial;
        width: auto;
        height: 100%;
        align-items: center;
        pointer-events: none;

    }
    .sns_btn .menu_sns li{
        margin-bottom: 0;
        margin-left: 15px;
        border: 3px solid #fff;
        border-radius: 2px;
        pointer-events: auto;
    }

    /*sp_random_voice_area*/
    .random_voice_area{
        position: fixed;
        left: 0;
        top: 0;
        background: rgba(230,88,84,0.9);
        width: 100%;
        height: 100%;
        z-index: 100;
        transition: 0.3s;
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        align-items: center;
    }
    .random_voice_area.active{
        opacity: 0;
        pointer-events: none;
    }

    .random_voice_box{
        background: #fff;
        box-sizing: border-box;
        padding: 18px 20px;
        width: 600px;
        height: 90vh;
        max-height: 960px;
        margin:60px auto auto auto;
        border-radius: 10px;
        overflow: hidden;
    }
    .random_voice_box_outer{
        width: 600px;
        margin: auto;
        position: relative;
    }

    .random_voice_close{
        position: absolute;
        right: 10px;
        top: 16px;
        margin: auto;
    }
    .random_voice_box_inner{
        height: 100%;
        background: url(../img/chara_detail_edge_lb.png) no-repeat left bottom #fff;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        position: relative;
    }
    .random_voice_left{
        width: 100%;
        margin-right: 0;
    }
    .random_voice_right{
        width: 100%;
        pointer-events: none;
        padding-top: 50px;
    }
    .random_voice_right.random_chara01{
        position: relative;
        top:0;
        right: 0;
    }
    .random_voice_right.random_chara01 img{
        width: 100%;
    }
    .random_voice_right.random_chara02{
        position: relative;
        top:0;
        right: 0;
    }
    .random_voice_right.random_chara02 img{
        width: 100%;
    }

    .random_voice_right.random_chara03{
        position: relative;
        top:0;
        right: -131px;
    }
    .random_voice_right.random_chara03 img{
        width: 63%;
    }
    .random_voice_right.random_chara04{
        position: relative;
        top:0;
        right: 73px;
    }
    .random_voice_right.random_chara04 img{
        width: 100%;
    }

    .random_voice_text{
        height: 183px;
        width: 100%;
        color: #000;
        background: #e7605d;
        border-radius: 10px;
        color: #fff;
        font-size: 2.4rem;
        text-align: center;
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1.5;
        position: relative;
    }
    .random_voice_text:before{
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 16px 8px 0 8px;
        border-color: #e7605d transparent transparent transparent;
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: auto;
        bottom: -15px;
        margin: auto;
    }

    .random_voice_btn{
        text-align: center;
        padding: 70px 0 50px;
    }
    .random_voice_syurui{
        text-align: center;
        font-size: 2.2rem;
        line-height: 1.7em;

    }

    /*sp_menu*/
    .menu_bg{
        position: fixed;
        left: 0;
        top: 0;
        background: none;
        width: 100%;
        height: 150%;
        z-index: 500;
        transition: 0.3s;
        pointer-events: none;
    }
    .menu_bg.active{
        pointer-events: auto;
        background: rgba(230,88,84,0.9);
    }

    .menu_outer{
        height: 100%;
        position: absolute;
        transition: 0.3s;
        left: -800px;
        top: 0;
    }
    .menu_bg.active .menu_outer{
        left: 0;
    }
    .menu_area{
        background: #fff;
        width: 530px;
        height: 100vh;
        transition: 0.3s;
        padding: 60px 50px;
        box-sizing: border-box;
        position: relative;

    }
    .menu_logo{
        margin-bottom: 70px;
    }
    .menu_logo img{
        width: 100%;
        height: auto;
    }
    .menu_list li{
        margin-bottom: 50px;
        text-align: center;
    }
    .menu_list li img.menu01{
        width: auto;
        height: auto;
    }
    .menu_list li img.menu02{
        width: auto;
        height: auto;
    }
    .menu_list li img.menu03{
        width: auto;
        height: auto;
    }
    .menu_list li img.menu04{
        width: auto;
        height: auto;
    }
    .menu_list li img.menu05{
        width: auto;
        height: auto;
    }
    .menu_list li img.menu06{
        width: auto;
        height: auto;
    }
    .menu_list li img.menu07{
        width: auto;
        height: auto;
    }
    .menu_list li img.menu08{
        width: auto;
        height: auto;
    }
	.menu_list li img.menu09{
        width: auto;
        height: auto;
    }
	.menu_list li img.menu10{
        width: auto;
        height: auto;
    }
	
    .menu_close{
        height: 72px;
        box-sizing: border-box;
        position: absolute;
        top: 0;
        bottom: 0;
        right: -92px;
        margin: auto;
    }
    .menu_area .menu_sns {
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        justify-content: space-between;
        width: 210px;
        margin: auto;
    }
     .menu_area .menu_sns img {
        width: auto;
        height: auto;
    }

	.special {
		position: static;
		
	}
	
	.special .bnr01, .special .bnr02 {
		width: 96%;
	}
	
	.special .bnr02 {
		margin: -10px auto 50px auto;
	}
	
	.special .box {
		width: 100%;
		margin: 0 auto;
	}

	.special .banner {
		width: 100%;
	}

	.btn_more {
		width: 60%;
	}
	
	#introduction {
		padding-top: 0;
	}

    /**/
    .introduction_list li{
        padding-top: 60px;
        text-align: center;
    }

    /*sp_caststaff*/


    .flex_style{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .staffcast_bg{
        background: none;  
    }
    .content_left{
        width: 100%;
    }
    .content_right{
        width: 100%;
    }

    .staff_cast01{
        font-size: 2.6rem;
        text-align: center;
        padding-bottom: 20px;
    }
    .staff_cast02{
        font-size: 3.6rem;
        color: #ff8700;
        text-align: center;
        line-height:  4.5rem;
    }
    .staff_cast02 span{
        font-size: 2.0rem;
        line-height:  4.5rem;
    }

    /*sp cast comment modal*/
    .comment_btn{
        text-align: center;
        display: block;
        padding-top: 0;
    }
    .comment_btn a{
        display: inline-block;
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .comment_btn img{
        width: auto;
        height: auto;
    }
    .cast_comment_area{
        padding: 20px;
    }
    .commnet_modal{
        border: #fff5f8 2px solid;
        width: 100%;
        position: relative;
        background: #fff;
        border: 2px solid #db5e5a;
        border-radius: 10px;
    }
    .commnet_modal_box{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        justify-content: center;
        flex-wrap: wrap;
        padding: 55px 60px;
        box-sizing: border-box;
    }
    .comment_left{
        width: 100%;
        height: auto;
        min-height: 503px;
        margin-right: 0;
        margin-bottom: 30px;
    }
    
    
    .comment_right{
        width: 100%;
    }

    .comment_modal_close{
        display: block;
        margin: auto;
        background: url(../img/chara_detail_close.png) no-repeat center;
        width: 107px;
        height: 16px;
        border: none;
    }
    .comment_right_name{
        border-bottom: 3px solid #db5e5a;
        padding-bottom: 30px;
        margin-bottom: 30px;
    }
    .comment_right_name01{
        text-align: center;
        font-size: 2.6rem;
        font-weight: bold;
    }
    .comment_right_name02{
        font-size: 2.6rem;
        color: #db5e5a;
        padding-left: 24px;
        font-weight: bold;
    }
    .comment_right_name03{
        font-size: 3.6rem;
        color: #db5e5a;
        font-weight: bold;
    }
    .comment_right_text01{
        font-size: 2.6rem;
        line-height: 1.8;
        height: auto;
    }
    .comment_right_text02{
        padding-top: 40px;
        font-size: 2.6rem;
        line-height: 1.8;
    }
    .comment_modal_close_box{
        padding-top: 80px;
    }

    /*sp_character*/
    .character_area{
        background: none;
    }
    .character_box li{
        margin-top: 80px;
        padding: 0 0 80px;
        width: 100%;
        text-align: center;
        background: url(../img/sp/sp_character_bg.png) no-repeat -30px 30px;
        background-size: 117% auto;
    }

    /*sp_charamodal*/
    .lity-container{
        overflow-y: scroll;
    }
    .lity-wrap{
        top: 0;
    }
    .character_modal{
        border: #fff5f8 2px solid;
        height: auto;
        width: auto;
        position: relative;
        background: #fff;
        box-sizing: border-box;
        padding: 0 0 60px;
        margin: 20px;
        background: #fff;

    }
    .character_modal_box{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        box-sizing: border-box;
        padding: 20px;
    }
    .chara_thm{
        width: auto;
        height: auto;
    }
    .chara_text{
        width: 560px;
        font-size: 1.8rem;
    }
    .chara_area{
        position: relative;
        left: 0;
        bottom: 0;
        width: 100%;
        text-align: center;
        padding: 150px 0 0;
        background:url(../img/chara_detail_edge_rt.png) no-repeat right top;
    }
    .chara_name{
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        flex-flow: column nowrap;
        justify-content: center;
        flex-wrap: wrap;
        width: 100%;
        position: relative;
        height: auto;
        left: 0;
        top: 0;
        background: url(../img/chara_detail_edge_lb.png) no-repeat left bottom;
        padding-bottom: 80px;
        box-sizing: border-box;
        margin-top: 40px;
    }
    .chara_name_inner{
        padding-bottom: 16px;
        text-align: center;
    }
    .chara_text{
        position: relative;
        font-size: 2.4rem;
        left: 0;
        top: 0;
        line-height: 1.6;
        width: 100%;
        margin-top: 70px;
    }
    .chara_close{
        display: block;
        margin: auto;
        background: url(../img/chara_detail_close.png) no-repeat center;
        width: 150px;
        height: 30px;
        background-size: 100% auto;
        border: none;
        position: relative;
        left: 0;
        bottom: 0;
        padding: 15px 0;
    }

	/* on air */
	
	#onair p {
		padding: 20px 0;
	}
    #onair .accent{
        font-size: 24px;
    }
	
	#onair .headline {
		line-height: 4.5rem;
	}
	
	#onair .onair_list li p {
		line-height: 40px;
        font-size: 24px;
	}

	#onair .small {
		font-size: 20px;
		line-height: 2rem;
	}

	#onair h3 img {
		width: 260px;
	}
    
    /**/
    #story .subtitle{
      font-size: 28px;
    }
    #story p{
            font-size: 24px;
        line-height: 24px;
    }
    
    /* song */

    #song .headline {
        font-size: 2.8rem;
        margin-bottom: 50px;
        line-height: 4rem;
    }

    #song .inner {
        width: 90%;
    }

    .song_area {
        flex-wrap: wrap;
    }

    .song_area .image {
        width: 100%;
    }

    .song_area .text {
        width: 90%;
        font-size: 1.6rem;
        padding: 40px 20px 30px 20px;
    }

    .song_area .title {
        font-size: 2.4rem;
        padding-bottom: 30px;
        line-height: 3rem;
    }

    .song_area .detail {
        line-height: 30px;
    }

    .song_area .detail {
        font-size: 2.2rem;
        line-height: 3rem;
    }
    
    .song_area .comment p {
        font-size: 2.2rem;
    }
    
    /* package */

    #package .headline {
        font-size: 2.8rem;
        margin-bottom: 50px;
        line-height: 4rem;
    }

    #package .inner {
        width: 90%;
    }

    .package_area {
        flex-wrap: wrap;
    }

    .package_area .image {
        width: 100%;
    }

    .package_area .text {
        width: 90%;
        font-size: 1.6rem;
        padding: 40px 20px 30px 20px;
    }

    .package_area .title {
        font-size: 2.4rem;
        padding-bottom: 30px;
        line-height: 3rem;
    }

    .package_area .detail {
        line-height: 30px;
    }

    .package_area .detail {
        font-size: 2.2rem;
        line-height: 3rem;
    }
    
    .package_area .comment p {
        font-size: 2.2rem;
    }

    /*sp_books*/
    .books_img{
        width: 100%;
        display: -webkit-box;   display: -moz-box;    /*Firefox21*/  display: -ms-flexbox; /*IE10*/  display: -webkit-flex; /*PC-Safari,iOS8.4*/  display: flex;
        justify-content: center;
        flex-wrap: wrap;
        margin: 0 auto;
        text-align: center;
    }
    .books_img a{
        margin-bottom: 50px;
        display: inline-block;
    }
    .books_img img{
        margin-top: 60px;
        width: auto;
        height: auto;
        display: inline-block;
    }
    .books_img img:first-child{
        margin-top: 0;
    }
    .books_text01{
        font-size: 2.4rem;
        padding-bottom: 20px;
    }
    .books_text02{
        font-size: 2.8rem;
        padding-bottom: 65px;
    }
    .books_text03{
        font-size: 2.8rem;
        padding-top: 15px;
    }

    /*sp_footer*/
    footer{
        padding-bottom: 160px;
    }
    .footer_banner_list{
        width: 100%;
        flex-wrap: wrap;
        justify-content: center;
        box-sizing: border-box;
        padding: 0 30px;
    }
    .footer_banner_list li{
        margin-top: 60px;
        width: 100%;
    }
    .footer_banner_list li:first-child{
        margin-top: 30px;
    }

    .footer_banner_list li img{
        width: 100%;
    }
    .copylight{
        font-size: 16px;
    }
	
	.menu_sns img {
		width: 48px;
		height: auto;
	}
    
    /*notfound*/
    .notfound {
        text-align: center;
        font-size: 22px;
        line-height: 35px;
    }

    .notfound .btn_more {
        margin-top: 50px;
    }

}