
/*/////////////////////////////////////////////////////////////////////////
default_CSS
/////////////////////////////////////////////////////////////////////////*/
@font-face {
  font-family: YuGothicM;
  src: local("Yu Gothic Medium");
}
body { font-family: Roboto, 'Helvetica Neue' ,'Terminal', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; -webkit-text-size-adjust: 100%; line-height: 1;}
body, h1, h2, h3, h4, h5, div, p, dl, dt, dd, ol, ul, li, form, table, caption, tbody, tfoot, thead, tr, th, td, article { margin:0; padding:0; font-weight: normal; font-size:100%; box-sizing: border-box;}
h1,h2,h3,h4,h5,p {background-color:rgba(255,255,255,.01);}
img,iframe { border:none;}
ol,ul { list-style:none; list-style-type: none;}
.alt{ position:absolute; top:-5000px; left:-9999px;}
.relative { position: relative;}
.hid{visibility: hidden;}
/*画像保護用*/
.cover {width:100%; height:100%;}
/*float*/
.floatL { float:left;}
.floatR { float:right;}
.clearfloat { height:1px; font-size:1%; clear:both; display:block; background: transparent;}
.clearfix:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
.clearfix { min-height:1px;}
* html .clearfix {height: 1px;
/*¥*//*/
height: auto;
overflow: hidden;
/**/
}
/*font*/
.tCenter { text-align:center !important}
.tRight { text-align:right !important}
.tLeft { text-align:left !important}
/*font-size*/
html { font-size: 62.5%;} /* = 10px */
body { font-size: 1.6rem; } /* = 16px */
h1 { font-size: 3.2rem; }
h2 { font-size: 2.3rem; }
h3 { font-size: 2.1rem; }
h4 { font-size: 2.0rem; }
p { font-size: 1.6rem; }
.f160 { font-size:160%;}
.f140 { font-size:140%;}
.f120 { font-size:120%;}
.f110 { font-size:110%;}
.f95 { font-size:95%;}
.f90 { font-size:90%;}
.f85 { line-height:normal !important; font-size:85% !important;}
.f80 { line-height:normal !important; font-size:80% !important;}
.stred{color:#e60012;}
.stye{color:#fee701;}
.stor{color:#f66808;}
.stpk{color:#e95098;}
/*link*/
a { text-decoration:none; color:#1d1d1d;}
a:hover { text-decoration:none; color:#1d1d1d;}
#menu li a,header #logo a,#bknm li a,.bn_tw a,a.btn_prev,a.btn_s,a.btn_i,#prevnext ul li a,.update li a,.bnarea ul li a,.bn_prev a,#spot a.btn,#gotop a,a.btn_df,#cts ul.bnr li a,a.btn_flw{text-decoration:none;
    -webkit-transition: 0.2s ease-in-out;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}
#menu li a:hover,header #logo a:hover,#form #agree a:hover,#msg #writeBtn a:hover,#bknm li a:hover,a.btn_i:hover,a.btn_df:hover,.bn_prev a:hover,#spot a.btn:hover,#gotop a:hover,#cts ul.bnr li a:hover,a.btn_flw:hover{text-decoration:none;
filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70;}
.no-link{ pointer-events: none; cursor: default; text-decoration:none;}


/*/////////////////////////////////////////////////////////////////////////
コンテンツ用CSS／オリジナル設定
/////////////////////////////////////////////////////////////////////////*/
html, body, div#con-body {background-color:#f9df8f; color:#1d1d1d; background: url(../img/bg.jpg?1);}
#con-body {background-color:transparent;}

/*#top header{ padding:12px 0;
background-image:linear-gradient(to bottom, rgba(254,108,1,0.3) 0%, rgba(255,166,29,0.2) 65%, rgba(255,211,78,0) 100%),linear-gradient(-140deg, rgba(254,108,1,0.3) 0%, rgba(255,166,29,0.3) 50%, rgba(255,211,78,0) 100%),url(../img/top/prebg2.jpg);
background-repeat:no-repeat,no-repeat;
background-size:100% 35%,80% 20%,cover;
background-position:0 0,right bottom,center center;
}
#top h1{width:980px; height:500px; margin:0 auto; position:relative;}
#top h1 .main1{background: url(../img/top/logo.png) no-repeat 0 0; width:532px; height:285px; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto;
animation: fadein 2.5s ease 0s 1 normal;
-webkit-animation: fadein 2.5s ease 0s 1 normal;}
#top h1 .main2{background: url(../img/top/main2.png) no-repeat 0 0; position:absolute; top:18%; right:120px; width:46px; height:255px; opacity: 0;
-webkit-animation: fadein 1.5s ease 1s 1 forwards;
  animation: fadein 1.5s ease 1s 1 forwards;}*/

#top h1{width:980px; height:645px; margin:0 auto 10px; box-shadow:0 0 24px rgba(126,29,63,0.2); position:relative;}
#top h1 .main1{background: url(../img/top/main1.jpg?1) no-repeat 0 0; width:100%; height:100%; position:absolute; top:0; left:0;
animation: fadein 2.5s ease 0s 1 normal;
-webkit-animation: fadein 2.5s ease 0s 1 normal;}
#top h1 .main2{background: url(../img/top/mainlogo.png) no-repeat 0 0; position:absolute; top:20px; left:34px; width:462px; height:248px; opacity: 0;
-webkit-animation: fadein 1.5s ease 1s 1 forwards;
  animation: fadein 1.5s ease 1s 1 forwards;}
#top h1 .main3{background: url(../img/top/main2.png) no-repeat 0 0; position:absolute; top:40px; right:37px; width:46px; height:255px; opacity: 0;
-webkit-animation: fadein 2.5s ease 1.5s 1 forwards;
  animation: fadein 2.5s ease 1.5s 1 forwards;}
#top h1 .main4{background: url(../img/top/oad.png?3) no-repeat right bottom; position:absolute; bottom:10px; right:10px; width:366px; height:67px; opacity: 0;
-webkit-animation: fadein 1s ease 2s 1 forwards;
  animation: fadein 1s ease 2s 1 forwards;}
@keyframes fadein {
    0% {opacity:0;}
    100% {opacity:1;}
}
@-webkit-keyframes fadein {
    0% {opacity:0;}
    100% {opacity:1;}
}

#next{background:url(../img/top/nextbg.jpg) no-repeat center center; background-size:cover;}
#next .inner{width:980px; position: relative; margin:0 auto; padding:2% 0 0;}

.bn_prev a{width:700px; height:100px; display:block;background:url(../img/top/bn_pre.png?2) no-repeat right center; margin:0 0 2%;}

#update {background-color:rgba(255,255,255,0.7); width:700px; height:65px; margin:0 0 3%;}
#update h2{width:15%; display: inline-block; vertical-align:top; height:65px; position: relative;}
#update h2 img{max-width:75%; height:auto; margin: auto;
position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;}
#update span.ymd{color:#f66808; font-family:"Times New Roman"; margin:0 .5em 0 0;}
#update ul {line-height:65px; height:65px; overflow: hidden; text-align:left; display: inline-block; width:80%; font-size:95%; }
#update li a{transition: 0.4s ease-in-out; }
#update li a:hover{color:#f66808;}

#next .sns{position:absolute; right:40px; top:30px; /*top:100px;*/ text-align:right;}
#next .sns a,#snsarea #sns a,#container #sns a{display:inline-block; background-color:rgba(255,255,255,0.3); width:60px; height:60px; text-align:center; position:relative; margin:0 .1em 0; border-radius:50%; transition:0.5s;}
#next .sns a:hover,#snsarea #sns a:hover,#container #sns a:hover{opacity:0.7;}
#next .sns img,#snsarea #sns img,#container #sns img{position:absolute; width:50%; margin:auto; top:0; bottom:0; right:0; left:0;}
#next .sns img.ic_line,#snsarea #sns img.ic_line,#container #sns img.ic_line{width:60% !important;}
#next .sns span{font-size:70%; line-height:0; display:block; padding:.8em .5em .5em;
text-shadow:0 0 10px rgba(255,255,255,0.9);}

#spot{width:504px; display:inline-block;}
#spot #trailer {width:504px; height:283.5px; box-shadow:0 0 24px rgba(126,29,63,0.2);}
#spot #trailer iframe {width:100%; height:283.5px;}

#newep{width:440px; height:340px; display:inline-block; vertical-align:top; position: relative; margin:0 0 0 18px;}
#newep h2{position: absolute; top:-25px; left:5px; width:110px; z-index:1;}
#newep h2 img{max-width:100%; height:auto;}
#newep .epcut{width:388px; background-color:rgba(255,255,255,0.65); box-shadow:0 0 24px rgba(126,29,63,0.2); padding:8px 8px 18px 8px; margin:0 30px 0 auto;}
#newep .epcut span{display:block; width:372px; height:228px; background:url(../img/story/ep10.jpg) no-repeat 0 0; position: relative; background-size:cover; transition:0.5s;}
#newep .epcut span:hover{opacity:0.5;}
#newep .epcut span img{position:absolute;left:0;top:0; width:100%; height:100%;}
#newep .storyline{position: absolute; bottom:0; left:0; /*background:rgba(255,126,0,0.8) url(../img/top/mg0.png) no-repeat right bottom;*/
background-image:url(../img/top/mg0.png), linear-gradient(rgba(255,126,0,0.8), rgba(255,126,0,0.8));
background-repeat:no-repeat,no-repeat;
background-size:auto,82% 80%;
background-position:right bottom,0 0;
}
#newep .storyline p {color:#fff; font-size:92%; padding:1em 0 1.8em; line-height:1.4; width:75%; margin:0 0 1em 1.2em;}
#newep .storyline img.ep1{position:absolute; top:-35px; left:15px; width:16%;}

/*cts*/
#cts{margin:4% auto 0; padding:0 0 3%;
background-image:linear-gradient(rgba(255,255,255,0.65), rgba(255,255,255,0.65));
background-repeat:no-repeat;
background-size:100% 40%;
background-position:right bottom;}
#card{display: flex; flex-flow: row wrap; width:980px; margin:0 auto;}
.l-card {position: relative;
  width:300px;
  padding:0 0 .5em;
  margin:1em 1.6em 2em 0;
  box-shadow:10px 10px 24px rgba(158,95,11,0.2);
}
.l-card h3{position: absolute; left:10px; top:-24px; z-index:1;}
.l-card.comment h3{top:170px; left:0; right:0; text-align:center;}
.l-card.comment h3 img{max-width:55%; height:auto;}
#card .news,#card .quiz{background-color:#fff;}
#card .interview,#card .fashion{background-color:#98ae23; color:#fff;}
#card .report,#card .gallery{background-color:#fe8d01; color:#fff;}
.text-content {font-size:90%; padding:1em 1.2em 2.5em; line-height:160%;}
.comment .text-content {text-align:center; border:1px solid #fff; width:50%; margin:2.5em auto 0; padding:.6em 0;}
.l-card span.upd{font-family:"Times New Roman"; padding:.5em; font-size:110%; display:inline-block; margin:-1em 0 0 .5em; position: relative; z-index:2;}
.l-card.news span.upd,.l-card.quiz span.upd{color:#f66808; background:#fff;}
.l-card.interview span.upd,.l-card.fashion span.upd{color:#fff; background:#98ae23;}
.l-card.report span.upd,.l-card.gallery span.upd{background:#fe8d01;}
/*サムネ*/
.l-thumbnail {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto;
}
.thumbnail-wrapper {height:200px; display: block; margin:0; padding:0; background-size:cover;}
.thumbnail-wrapper::after {
  transition: 0.5s;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  background:linear-gradient(-110deg, rgba(254,108,1,0.9) 0%, rgba(255,166,29,0.9) 55%, rgba(255,211,78,0.9) 100%);
  background-size:100% 100%;
  opacity: 0;
}
.thumbnail-wrapper img{
  transition: 0.5s;
  display: block;
  max-width: 100%;
}
.more-text {font-family:"Times New Roman"; letter-spacing:.2em;
  transition: 0.5s;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -80%);
  display: inline-block;
  padding: 6px 12px 8px;
  color: #fff; 
  opacity: 0;
}
.l-card:hover .thumbnail-wrapper::after {
  opacity: 0.8;
}
.l-card:hover .more-text {
  opacity: 1;
  transform: translate(-50%, -50%);
}
.news .thumbnail-wrapper{background-image: url(../img/top/thum1004.png);}
/*.news .thumbnail-wrapper{background-image: url(../img/heart/main.png);
background-repeat:no-repeat;
background-size:85%;
background-position:center center;
background-color:rgba(255,211,78,0.6);}*/
.comment .thumbnail-wrapper{background-image: url(../img/top/cmnt.jpg);}
.report .thumbnail-wrapper{background-image: url(../img/repo/vol1.jpg);}
.interview .thumbnail-wrapper{background-image: url(../img/itv/thum4.jpg);}
.quiz .thumbnail-wrapper{background-image: url(../img/top/thum_quiz.jpg);}
.fashion .thumbnail-wrapper{background-image: url(../img/fashion/vol10_s.jpg);}
.gallery .thumbnail-wrapper{background-image: url(../img/gallery/ep10/ep10_1.jpg);}
.news .thumbnail-wrapper{background-image: url(../img/repo/vol2_1.jpg);}
.report .thumbnail-wrapper {background-image:url(../img/topics/16_01.jpg);}

#cts ul.bnr{display: flex; flex-flow: row wrap; width:980px; margin:0 auto .5em;}
#cts ul.bnr li{width:300px; height:120px; margin:.5em 1.6em 0 0;}
#cts ul.bnr li a{display:block; width:100%; height:100%; background-repeat: no-repeat; background-position:center center; position: relative; box-shadow:10px 10px 24px rgba(158,95,11,0.2); background-size:cover;}
#cts ul.bnr li.bn_prv a {background-image:url(../img/top/paravi.png);}
#cts ul.bnr li.bn_free a {background-color:rgba(255,255,255,0.7); background-image:url(../img/top/free.png?1);}
#cts ul.bnr li.bn_ishop a {background-image:url(../img/top/ishop.jpg?3);}

/*sns*/
#snsarea{padding:3% 0 0; margin:0 auto;
background-image: linear-gradient(-110deg, rgba(254,108,1,0.5) 0%, rgba(255,166,29,0.5) 65%, rgba(255,211,78,0.5) 100%);}
#snsarea .inner{width:980px; margin:0 auto; display: flex; flex-flow: row wrap; position: relative;}
.shiro{position: absolute; top:-150px; right:-20px; width:110px;}
.mg1{position: absolute; top:-70px; left:50%;}
.mg2{position: absolute; bottom:-90px; left:-40px;}

#snsarea h3{position: absolute; top:-20px; left:15px; z-index:1;}
#snsarea h3 img{width:55%;}
#twTL,#insta{width:300px; height:350px; background-color:rgba(255,255,255,0.7); margin:1em 1.6em 3em 0; position: relative; z-index:1;}
#twTL .tline,#insta .tline{width:100%; margin:40px auto 0; height:313px; overflow:hidden;}

/* insta */
div.insta {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	overflow:hidden;
}
div.insta ul{margin:10px 0 0 5px;}
div.insta ul li {float:left; margin:4px 0 4px 7px; background-color:rgba(255,166,29,0.5);}
div.insta ul li a, div.insta ul li a img {
display:block; background-position:center center; background-repeat:no-repeat; width:88px; height:88px; transition:0.5s;}
div.insta ul li a {background-size:cover;}
div.insta ul li a:hover img {filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; background-color:rgba(255,166,29,0.8);}
div.insta ul li a img {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
div.insta ul li a img.icon-video {background-image:url(../img/play.png); background-size:40%;}

#rect {width:300px;margin:1.8em 1.6em 3em 0;}
#rect .ad {display:block; width:300px; height: 250px; background:#fff;}
#snsarea #sns{text-align:center; margin:0 0 1.5em;}
#snsarea #sns a{background-color:rgba(255,154,16,0.9); width:60px; height:60px; margin:0 .1em 0;}

/*footer*/
#top footer{background-color:rgba(208,89,11,0.35); text-align:center; height:90px;}
footer .share{display:inline-block; vertical-align:top; padding:35px 0 0; position: relative; z-index:10;}
footer p.copy {text-align:right; padding:1em 0; font-size:80%; color:#fff; font-family: "Times New Roman";}
#top footer p.copy {display:inline-block; width:720px; margin:0 auto; padding:40px 0 0;}
footer a,footer a:hover{color:#fff;}
/*f2*/
footer.dir2{margin:3% 0 0; position:relative; padding:2% 0 0;
background-image: linear-gradient(rgba(208,89,11,0.35), rgba(208,89,11,0.35));
background-repeat:no-repeat;
background-size:100% 65%;
background-position:right bottom;}
footer.dir2 .inner{width:980px; margin:0 auto; position:relative; height:250px; 
background:url(../img/top/mg2.png) no-repeat 0 bottom;}
footer.dir2 .share{position:absolute; top:50%; left:5%;}
#rect2 {width:300px; height: 250px; background:#fff; position:absolute; bottom:8%; right:0;}

#gotop {position: fixed; bottom:0; right:0; z-index:10;}
#gotop a {display:block; width:70px; height:70px; background-color:rgba(254,141,1,0.8);}
#gotop img{max-width:100%;}

/*------------------　2nd　------------------ */
header#dir{margin:0 0 18px;
background-image:url(../img/topline.png),linear-gradient(-140deg, rgba(254,108,1,0.3) 0%, rgba(255,166,29,0.3) 65%, rgba(255,211,78,0) 100%);
background-repeat:repeat-x,no-repeat;
background-position:center 0,right bottom 66px;
background-size:auto,80% 40%;}
header#dir #logo{width:980px; margin:0 auto; padding:25px 0 0; position: relative; }
header#dir #logo a{width:451px; height:240px; display:block; background:url(../img/logo.png) no-repeat 0 0;}
header#dir #logo img.oaday{position:absolute;right:0;bottom:8%;}

#container{background-image:linear-gradient(-140deg, rgba(254,108,1,0.8) 0%, rgba(255,166,29,0.6) 50%, rgba(255,211,78,0) 100%);
background-repeat:no-repeat;
background-position:right top 110px;
background-size:70% 25%;}
#container .heading{width:1130px; position: relative;}
#container h1{width:960px; background:url(../img/h1.jpg) no-repeat 0 0; background-size:cover; height:282px; position: relative;}
#container h1 span.ttl img{max-width:100%; height:auto; position:absolute;left:15%;top:25%;}
#container #sns{position:absolute; right:0; bottom:0; text-align:right;}
#container #sns a{width:70px; height:70px; margin:0 .15em 0;}
#container #sns p.share{width:180px; height:23px; background:url(../img/share.png) no-repeat 0 0; margin:0 1em 1em 0;}

#contents{width:980px; padding:2em 0; margin:2.5em auto 3em; background-color:rgba(255,255,255,0.7); box-shadow:0 0 40px rgba(131,51,20,0.3);}
#contents .inner{width:970px; margin:0 auto;}
#contents .inner p {padding:1em 0 .5em; line-height:1.7;}

.ph_cut {width:600px; height:400px; margin:1em auto; background-size: cover; background-repeat: no-repeat; background-position: center center; box-shadow:10px 10px 24px rgba(158,95,11,0.2);}
.ph_cut_l {width:400px; height:600px; margin:1em auto; background-size: cover; background-repeat: no-repeat; background-position: center top; box-shadow:10px 10px 24px rgba(158,95,11,0.2);}
.lazy {position:relative; display: block; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.lazy img {position:absolute;left:0;top:0; width:100%; height:100%;}
.line1 {background: linear-gradient(transparent 60%, rgba(253,214,77,0.7) 60%);}
.line2 {background: linear-gradient(transparent 60%, rgba(124,196,213,0.2) 60%);}
.ffmc{font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho ProN" , "HG明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho",serif;}
.bdr{border:2px solid #e95098; padding:.8em 0; margin:1em auto 1.5em; width:90%;}
.bdr p{padding:.5em 1.5em !important; font-size:95%;}
.bdr2{border:1px dotted rgba(65,159,182,0.6); padding:.8em 1.2em !important; margin:.5em auto 1em; width:100%; font-size:90%; border-radius:10px;}
.bdr3{padding:.8em 1.2em; box-shadow:10px 10px 24px rgba(158,95,11,0.2); margin:1em auto 1.5em; width:100%; font-size:90%; background-color:rgba(255,255,255,0.5);}
.bdr4{border:1px solid #111; padding:.8em 1.2em !important; margin:.5em auto 1em; width:100%; font-size:90%;}

/*intro*/
#intro h2{font-weight:bold; line-height:1.4; font-size:150%; padding:0 1.5em 1em;}
#intro h3{padding:0 1.5em 1em; font-size:150%; font-weight:bold; line-height:1.4;}
#intro h4{padding:1em 2em 1em; text-align:center; line-height:1.4; font-weight:bold;}
#intro .ph1 {background-image:url(../img/intro/main.jpg?1);}
#intro #contents p,#story #contents p {padding:1em 2.5em .5em; line-height:1.8;}
#intro h3.cname,#comic h3.cname{font-size:140%; padding:.3em .5em; color:#004fa3; font-weight:bold; width:100%; text-align:left; margin:-1.5em auto .3em; color:#fff;
background-image:linear-gradient(140deg, rgba(254,108,1,0.8) 0%, rgba(255,166,29,0.6) 50%, rgba(255,211,78,0) 100%);}
#intro .bdr3{width:90%; margin:2.5em auto 4em;}
#intro .bdr3 p{padding:.5em 1em !important; font-size:100%;}
#intro .bdr3:last-child{margin:0 auto 2em;}

/*news*/
#promo {width:92%; margin:.5em auto 2em;}
#promo h2{width:98%; text-align:center; margin:0 auto .8em; padding:.5em 0; font-size:140%; font-weight:bold; color:#fff; letter-spacing:.2em; background-image:linear-gradient(140deg, rgba(254,108,1,0.8) 0%, rgba(255,166,29,0.8) 50%, rgba(255,211,78,0.8) 100%);}
#promo h3{font-size:120%; padding:.6em 0 0; color:#fe8d01;}
#promo h3 a{color:#fe8d01; transition:.3s;}
#promo h3 a:hover{color:#fdd64d;}
#promo ul{margin:0 auto; width:96%;}
#promo li {padding:.3em 0; border-bottom: solid 1px rgba(158,95,11,0.2); margin:0 0 .5em;}
#promo p.txt{padding:.2em 0 !important; font-size:95%;}
#promo p.add {font-size:1.2rem !important;  border:none !important; padding:.8em .5em; margin:0 auto; width:96%;}
#promo .pdate{ padding:.1em .4em; font-size:95%; background-color:rgba(253,214,77,0.7);}
#info .emb,#emergency .emb{width:600px; height:338px; margin:1em auto .5em !important;}
#info span.date {padding:2px 3px; display:inline-block; font-size:100%; margin:0 0 .2em; font-family: "Times New Roman"; background-color:#fe8d01; color:#fff;}
#info article {margin:0 auto 3em; width:90%;}
#info article:last-child{margin:0 auto 1em;}
#info article h2{width:100％; padding:.2em .2em .4em; line-height:145%; font-weight:bold;}
#info article h3{font-size:120%; line-height:145%; color:#fe8d01; font-weight:bold; border-left:3px solid #fe8d01; padding:0 0 0 .5em; margin:.5em 0 .4em;}
#info article h4{font-size:120%; line-height:1.4; padding:.5em 0;}
#info article p {padding:1em 0;}
#info  p.bdr3,#music p.bdr3{padding:1em 1.5em !important;}

/*story*/
#story #contents,#gallery #contents,#fashion #contents{padding:2em 0 0;}
#story h2{font-weight:bold; font-size:200%; margin:0 0 0 5%; color:#fe8d01;}
#story h2 span.num,#gallery h2 span.num{font-size:200%; font-style: oblique;}
#story .mov{width:92%; margin:0 auto 1em; padding:.5em 0 1em; background-color:rgba(255,255,255,0.4); box-shadow:10px 10px 24px rgba(158,95,11,0.2);}
#story ul#movlist {margin:1.4em auto .5em; text-align:center;}
#story ul#movlist li {width:340px; margin:0 5px; background-size: cover; text-align:center; background-repeat: no-repeat; background-position:center center; position:relative; display: inline-block; transition: 0.3s; font-size:110%; line-height:135%;}
#story ul#movlist li a {width:100%; display:block; background-color:rgba(254,108,1,0.7); color:#fff; transition:0.5s; padding:.8em 0;}
#story ul#movlist li a:hover{background-color:rgba(255,166,29,0.8);}

#story #trailer{width:700px; height:393.75px; margin:.5em auto 1em;}
#story #trailer iframe{width:100%; height:393.75px;}
#story .ph_cut{margin:.5em auto 1em; width:700px; height:429px; box-shadow:none;}
#story .ph_area{margin:1.5em auto 0; text-align:center; width:96%;}
#story .ph_s{width:45%; padding:30% 0 0; background-size: cover; background-repeat: no-repeat; background-position: center center; position: relative; display:inline-block; margin:0 1.4% 0 .6%; font-size:0;}
#story .ph_s img {position:absolute;left:0;top:0; width:100%; height:100%;}
#story #contents .inner p a{ color:#fe8d01;}

#story #bknm,#gallery #bknm,#itv #bknm,#fashion #bknm{width:100%; margin:3em auto 0; padding:0 0 2%;
background-image:linear-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0.4));
background-repeat:no-repeat;
background-size:90% 95%;
background-position:right bottom;}
#story #bknm h3,#gallery #bknm h3,#fashion #bknm h3,#itv #bknm h4{margin:0 0 0 3%;}
#story #bknm h3 img,#gallery #bknm h3 img,#fashion #bknm h3 img,#itv #bknm h4 img{max-width:26%;}
#story #bknm ul,#gallery #bknm ul,#itv #bknm ul,#fashion #bknm ul{width:92%; margin:1.5em auto 0; display: flex; flex-flow: row wrap;}
#story #bknm li,#gallery #bknm li,#itv #bknm li,#fashion #bknm li{margin:0 0 25px 25px; position:relative; width:200px; height:130px;}
#story #bknm li a,#gallery #bknm li a,#itv #bknm li a,#fashion #bknm li a{display:inline-block; width:100%; height:130px; text-align:center; position:relative; overflow: hidden; box-shadow:6px 6px rgba(255,211,78,0.6); background-color:#fe8d01;}
#story #bknm li a:after,
#gallery #bknm li a:after,
#itv #bknm li a:after,
#fashion #bknm li a:after{position: absolute;content: "";display: block;width: 100%;height: 100%;top: 0;background-size: cover; background-repeat: no-repeat; background-position: center center;
   -webkit-transition: all .3s ease-out;
   -moz-transition: all .3s ease-out;
   -ms-transition: all .3s ease-out;
   transition: all .3s ease-out;}
#story #bknm li a:hover:after,
#gallery #bknm li a:hover:after,
#itv #bknm li a:hover:after,
#fashion #bknm li a:hover:after{
   -moz-transform: scale(1.2);
   -webkit-transform: scale(1.2);
   -ms-transform: scale(1.2);
   transform: scale(1.2);
}
#story #bknm li span.epn,#gallery #bknm li span.epn,#fashion #bknm li span.epn {font-family: "Times New Roman"; padding:4% 5%; font-size:100%; color:#fff; position: absolute; top:-8px; left:-8px; margin:0 auto; z-index:1; background-color:rgba(254,141,1,0.8);}
#story #bknm li span.epn strong,#gallery #bknm li span.epn strong,#itv #bknm li span.epn strong,#fashion #bknm li span.epn strong{font-size:160%;}

/*gallery*/
#gallery h2{font-weight:bold; color:#fe8d01; font-size:200%; text-align:center;position:relative; margin:0 auto 2em;}
#gallery h2:before{
content: "";
width:1px;
height:30px;
background-color:#fe8d01;
position: absolute;
left: 50%;
bottom:-40px;
}
#gallery ul#show{width:92%; margin:0 auto 1.5em; display:flex; flex-flow: row wrap;}
#gallery ul#show li{margin:6px 0 6px 12px;}
#gallery ul#show li span {background-size: cover; background-repeat: no-repeat; background-position: center top;}
#gallery ul#show li span.lazy {position:relative; display:block;}
#gallery ul#show li span a {width:210px; height:140px; display:block; transition: 0.5s;}
#gallery ul#show li span a:hover{background-color:rgba(255,166,29,0.5);}
#gallery .lbg-pics{background-color:none !important; box-shadow:none !important;}
#gallery #bknm li.bk1 a:after {background-image:url(../img/gallery/ep1/ep1_1.jpg);}
#gallery #bknm li.bk2 a:after {background-image:url(../img/gallery/ep2/ep2_1.jpg);}
#gallery #bknm li.bk3 a:after {background-image:url(../img/gallery/ep3/ep3_1.jpg);}
#gallery #bknm li.bk4 a:after {background-image:url(../img/gallery/ep4/ep4_1.jpg);}
#gallery #bknm li.bk5 a:after {background-image:url(../img/gallery/ep5/ep5_1.jpg);}
#gallery #bknm li.bk6 a:after {background-image:url(../img/gallery/ep6/ep6_1.jpg);}
#gallery #bknm li.bk7 a:after {background-image:url(../img/gallery/ep7/ep7_2.jpg);}
#gallery #bknm li.bk8 a:after {background-image:url(../img/gallery/ep8/ep8_1.jpg);}
#gallery #bknm li.bk9 a:after {background-image:url(../img/gallery/ep9/ep9_1.jpg);}
#gallery #bknm li.bk10 a:after {background-image:url(../img/gallery/ep10/ep10_1.jpg);}

/*interview*/
#itv #contents{padding:0;}
#itv #mainttl{position:relative; padding:4.5% 0 0;
background-image: linear-gradient(rgba(254,141,1,0.9), rgba(254,141,1,0.9));
/*linear-gradient(140deg, rgba(254,141,1,0.9) 0%, rgba(255,166,29,0.9) 50%, rgba(255,211,78,0.9) 100%);*/
background-repeat:no-repeat;
background-position:left top;
background-size:40% 90%;}
#itv #mainttl h2{position: absolute; left:5%; top:60%;}
#itv .mainph{width:710px; height:400px; margin:0 0 0 auto; background-size:cover; background-repeat:no-repeat; background-position: center center;}
#itv .mainph.vol1{background-image:url(../img/itv/main.jpg); background-position: center bottom -50px;}
#itv .mainph.vol2{background-image:url(../img/itv/main2.jpg); background-position: center bottom -45px;}
#itv .mainph.vol3{background-image:url(../img/itv/main3.jpg); background-position: center bottom -50px;}
#itv .mainph.vol4{background-image:url(../img/itv/main4.jpg); background-position: center top;}
#itv #bknm li.bk1 a:after{background-image:url(../img/itv/thum1.jpg);}
#itv #bknm li.bk2 a:after{background-image:url(../img/itv/thum2.jpg);}
#itv #bknm li.bk3 a:after{background-image:url(../img/itv/thum3.jpg);}
#itv #bknm li.bk4 a:after{background-image:url(../img/itv/thum4.jpg);}
#itv article{margin:0 auto 3em; width:90%;}
#itv h3{font-weight:bold; color:#fe8d01; position:relative; padding:0 0 0 4%; margin:4% 0 0;}
#itv h3:before{
content: "";
width:3%;
height:1px;
background-color:#fe8d01;
position: absolute;
left: 0px;
top: 50%;
}
#itv #bknm li a{text-align:left;}
#itv #bknm li span.name {position: absolute; bottom:0; left:0; z-index:1; width:96%; padding:4% 0 2% 4%;
background:linear-gradient(to top, rgba(255,166,29,0.9) 10%, rgba(255,166,29,0.5) 60%, rgba(255,166,29,0) 100%);}
#itv #bknm li span.name img{max-width:66%;}

/*emergency*/
/*#emergency #contents{padding:0;}*/
#emergency #container h1 span.ttl img{top:20%;}
#emergency #mainttl{padding:3%; background-color:rgba(255,255,255,0.7); width:90%; margin:0 auto;}
#emergency h2{line-height:180%; font-size:110%;}
#emergency .emb{margin:1em auto 3em !important;}
#emergency .emb iframe {width:100%; height:338px;}
#emergency h3{font-weight:bold; color:#fe8d01; position:relative; padding:0 0 0 2.5%; margin:5% 0 2%; line-height:150%; border-left:2px solid #fe8d01; font-size:140%;}

/*fashion*/
#fashion #outline {margin:3em auto 3em; position: relative; width:92%; padding:0 0 2% 4%;
background:url(../img/fashion/yano.jpg) no-repeat right 20%;
background-size:40%;
}
#fashion #outline:before{
content: "";
position: absolute;
width:95%;
height:100%;
left:0;
top:-20px;
border: solid 3px #fe8d01;
}
#fashion #outline h2{display: inline-block; margin:-40px 0 0; position: relative; z-index:11;}
#fashion #outline h3{display: inline-block; font-size:110%; margin:1.2em 0; padding:0;}
#fashion #outline h3 span{background-color:rgba(255,255,255,0.9); margin:0 0 .5em; line-height:175%; padding:.1em;}
#fashion article {margin:0 auto 3em; width:90%;}
#fashion article p{background-color:rgba(255,255,255,0.6); padding:2em !important; box-shadow:10px 10px 20px rgba(158,95,11,0.2);}
#fashion article p span.epnm{display:block; padding:0 0 !important; color:#fe8d01; font-size:140%; letter-spacing:.1em;
position: relative; text-align:center; width:40%; margin:0 auto .8em;}
#fashion article p span.epnm:before, #fashion article p span.epnm:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width:30%;
  height: 1px;
  background-color:#fe8d01;
}
#fashion article p span.epnm:before {left:0;}
#fashion article p span.epnm:after {right:0;}
#fashion article p span.brand{display:block; padding:1em !important; background-color:rgba(253,214,77,0.2);}
.collabo {margin:0 auto 5%; padding:1em; border: solid 1px #fe8d01; width:90%;}
.collabo h4 {font-weight: bold; color:#fe8d01; margin:0 0 .5em;}
.collabo h4 span{border-bottom:1px solid #fe8d01; padding:0 2em .3em 0;}

/*quiz*/
#quiz #outline {margin:1.5em 2% 4em auto; position: relative; width:93%; padding:0;
background:url(../img/heart/pre1.png) no-repeat right 0;
background-size:41%;
}
#quiz .inner{width:85%;}
#quiz #outline h2{font-size:165%; line-height:165%; letter-spacing:.05em; padding:0; font-weight:bold;}
#quiz #outline h3{display:inline-block; font-size:105%; margin:1.2em 0; padding:0;}
#quiz #outline h3 span{background-color:rgba(255,255,255,0.9); margin:0 0 .5em; line-height:175%; padding:.1em;}
#quiz #outline p{font-size:140%; line-height:150%;}
#quiz h3.que{font-weight:bold; text-align:center; font-size:160%; line-height:140%; padding:0 0 .5em;}
#quiz h3.que:first-letter {font-size:140%; line-height:1; color:#fe8d01; font-family: "游明朝" , "Yu Mincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho ProN" , "HG明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho",serif;}
#quiz span.epnum{text-align:center; padding:.5em; margin:-.8em auto 1.2em; font-size:140%; display:block; width:20%; 
background-color:#fe8d01; color:#fff;}
#quiz .qbox{border:2px solid #fe8d01; padding:0 1em .5em; margin:0 auto 2.5em; box-shadow:14px 14px rgba(158,95,11,0.15);}
#quiz h4.answer{font-weight:bold; font-size:130%; width:60%; margin:1.5em auto 0; color:#fe8d01; padding:.5em 0; border:1px solid #fe8d01; text-align:center; letter-spacing:.2em;}
ul#ans{width:60%; margin:1em auto 3em;}
ul#ans li{font-size:140%; padding:.8em .5em; font-weight:bold; line-height:130%; background-color:rgba(255,255,255,0.6); margin:0 0 .5em;}
ul#ans li span{padding:.2% 1.8%; color:#fff; margin:0 .5em 0 0; background-color:#fe8d01; display:inline-block;}
ul#pastq {margin:1.5em auto 1em; font-size:95%;}
ul#pastq li{padding:.8em; margin:1em 0 .5em; background-color:rgba(255,255,255,0.6);}
ul#pastq li span.vnm{display:block; color:#fff; padding:.2em; margin:0 0 .4em; font-size:110%; background-color:#fe8d01; width:10%; text-align:center;}
ul#pastq li span.asw{display:inline-block; background-color:#fe8d01; color:#fff; padding:.1em .2em; margin:.6em .3em 0 0;}
ul#pastq li strong.f120{color:#fe8d01; font-family: "游明朝" , "Yu Mincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho ProN" , "HG明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho",serif;}

/*comic*/
#comic h2,#comic h3{font-size:160%; padding:0; font-weight:bold; line-height:150%; width:90%; margin:0 auto;}
#comic .comic1,#comic .comic2,#comic .comic3 {width:29%; height:0; padding:41.1075% 0 0; background-image:url(../img/comic/comic1.jpg); margin:4% 1.1%; border:none; display: inline-block; vertical-align:top; position:relative;}
#comic .comic1 img,#comic .comic2 img,#comic .comic3 img{position:absolute;left:0;top:0; width:100%; height:100%;}
#comic .comic2 {background-image:url(../img/comic/comic2.jpg);}
#comic .comic3 {background-image:url(../img/comic/comic3.jpg);}
#comic .txt{width:90%; margin:0 auto;}
#comic .comiccover{margin:0 0 1em;}
#comic .comiccover span.f80{display: inline-block; margin:.6em 0;}

/*caststaff*/
#caststaff h2{margin:.5em auto 1.2em; font-weight:bold; text-align:center; letter-spacing:.3em; font-size:220%; font-family: "Times New Roman"; position:relative;}
#caststaff h2:before{
content: "";
width:1px;
height:25px;
background-color:#4f4f4f;
position: absolute;
left: 50%;
bottom:-35px;
}
#caststaff h2.staff{margin:.5em auto 1.5em;}
#caststaff h3{width:80%; margin:1.5em auto .6em; background-color:rgba(254,209,0,0.5);}
#caststaff .credit{text-align:center; width:60%; margin:0 auto 2em; font-size:120%; line-height:1.7;}
#caststaff .credit span.f80_2{line-height:1.2; font-size:80%; display:block;}
#caststaff table{width:80%; margin:0 auto 3em; font-size:145%;}
#caststaff table td{text-align:center; padding:1.2% 0; line-height:1;}
#caststaff table td.cname{text-align:left;width:46.5%; vertical-align:bottom;}
#caststaff table td.chara{text-align:right;width:46.5%; color:#f66808;}
#caststaff table td.naka{padding:0 0 3%; font-size:80%; vertical-align:bottom; line-height:0;}
#caststaff table td.maru{vertical-align:bottom;font-size:90%; padding:5px 0; font-family: Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;}

/*heart*/
#heart .inner,#emergency .inner{width:90%;}
#heart .ph1 {width:669px; height:452px; background-image:url(../img/heart/main2.png); box-shadow:none;}
#heart .map {width:600px; height:350px; background-image:url(../img/heart/ikebukuro.png); box-shadow:none;}
#heart .pre1 {width:600px; height:355px; background-image:url(../img/heart/pre1.png); box-shadow:none; margin:0 auto 4em;}
#heart .pre2 {width:550px; height:183px; background-image:url(../img/heart/pre2.jpg); box-shadow:none; margin:1.5em auto 3.5em;}
#heart h2{margin:1em 0 1.5em;}
#heart h3 {font-size:160%; margin:1em 0; font-weight:bold;}
#heart h3.correct {font-size:200%; margin:1.5em auto 1em; font-weight:bold; color:#f05713; letter-spacing:.4em; border:2px solid #f05713; padding:.3em 0; width:40%; box-shadow:4px 4px #f05713;}
#heart h4{font-size:125%; line-height:1.4; padding:.3em 0; margin:1.5em 0 .6em; font-weight:bold; color:#fe8d01; border-bottom:2px solid #fe8d01; width:35%; letter-spacing:.15em;}
#heart h4.visual{width:auto; text-align:center; border:none; font-size:140%; margin:2.5em 0 .5em;}
#heart h5.pre{font-weight:bold; font-size:110%; margin:1em 0 .5em; line-height:150%;}
#heart #contents .inner p {padding:0 0 .8em; line-height:1.8;}
#heart #contents .inner .f90{line-height:160%;}
#heart p.join{background-color:rgba(255,255,255,0.5); padding:0 1em .8em !important; box-shadow:8px 8px rgba(255,211,78,0.5); line-height:160% !important;}
#heart p.join:nth-of-type(4){margin:0 0 3em !important;}
#heart img.arw{max-height:50px; margin:1% 45% 0;}
#heart span.step{color:#fff; background-color:#fe8d01; padding:0 .5em; margin:0 0 .5em; display:inline-block; font-size:105%;}
.rules{padding:1em 1.5em 0; overflow-y: auto; height:300px; background-color:rgba(255,255,255,0.4); margin:0 0 1em;}
.rules::-webkit-scrollbar{width:3px; background:none;}
.rules::-webkit-scrollbar-thumb{background:#fe8d01;}
.rules p{padding:0 .5em 1em !important; font-size:90% !important; line-height:160% !important;}
.rules h5{font-weight:bold; font-size:100%; margin:1em 0 .8em; line-height:150%;}
.rules ul{margin:.5em 0 2em;}
.rules ul li{font-size:90%; margin:0 0 .5em 1em; text-indent: -1em; line-height:160%;}
.rules ul li:before {
    content:'・';
}

/*report*/
#report .ph_cut,#report .ph_cut_l{margin:.5em auto;}
#report article {width:96%; margin:0 0 0 3%; padding:0 1.2em 1em; }
#report article h2{padding:2% 0 2% 1em; font-weight:bold; position:relative; line-height:150%;}
#report article h2:before{
content: "";
width:4px;
height:155%;
background-color:#fe8d01;
position: absolute;
left:-1%;
top:0;
z-index:1;
}
#report article h3{color:#004fa3; text-align:center; padding:1em 1.4em 0; line-height:1.5; font-weight:bold; font-size:110%;}
#report article h3.endtx{padding:1em 1.4em 1em;}
#report article p{padding:.8em .1em; line-height:1.6;}
#report article p:first-of-type{margin:1em 0 0;}
#report article a {color:#e95098;}
#report span.date {padding:.4em 0 .4em 1.5em; display:inline-block; font-size:100%; margin:0 0 .2em; font-family: "Times New Roman";}
/*#entry article p.cap{text-align:center; margin:1.5em auto .8em; width:500px; padding:0 !important; font-size:85%;}*/
#report #bknm h3{text-align:center; letter-spacing:.1em; font-size:200%; font-family: "Times New Roman"; position:relative; font-weight:bold; padding:2% 0 0;}
#report #bknm h3:before{
content: "";
width:1px;
height:25px;
background-color:#4f4f4f;
position: absolute;
left: 50%;
bottom:-35px;
z-index:1;
}
#report #bknm ul{margin:1.8em 0 0 1em;}
#report #bknm li{width:100%; line-height: 1.4em; margin:0 0 .8em;  font-size:90%;}
#report #bknm li a {display:block; background-color:rgba(255,255,255,0.6); padding:.8em;}
#report #bknm li a span.date{padding:0 .3em 0 .2em; background-color:#fe8d01; color:#fff;}
#prevnext { width:90%; padding:0; margin:2em auto .5em;}
#prevnext ul li {text-align:center; width:50px; height:50px; font-size:2.5rem; font-weight:bold; font-family:arial black,Verdana; background-color:rgba(158,95,11,0.1); color:#fff; line-height:50px; text-align:center;}
#prevnext ul li a {color:#fff; display:block; width:50px; height:50px; background-color:rgba(255,166,29,0.8); transition:0.5s;}
#prevnext ul li a:hover{opacity:0.5;}
#prevnext ul li.prev { float:left; }
#prevnext ul li.next { float:right;}
}

/*msg*/
iframe#iframe {width:100%; border:none; padding:0; margin:0;}
#msg h2{margin:.5em auto 1em; font-weight:bold; padding:.6em 0; width:90%; color:#fff; background-color:rgba(254,108,1,0.7);}
#msg .inner ul#notice {width:90%; margin:0 auto;}
#msg .inner ul#notice li{margin:0 0 .7em 1em; font-size:95%; text-indent: -1em; line-height:1.4;}
#msg .inner ul#notice li:before {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    margin-right: 4px;
    margin-left: 4px;
    border: transparent solid 5px;
    border-left-color:#f66808;}
#msg p.att{font-size:120%; padding:.5em 0;}
#msg p.pinfo{width:90%; background-color:rgba(255,255,255,0.4); margin:1em auto 1em; padding:1em !important; font-size:90%; line-height:1.5;}
#msg p.pinfo a{text-decoration:underline;}
#msg p.bdr{border:1px solid rgba(189,226,234,0.9); padding:.8em 1em; margin:0 auto 2em; width:90%;font-size:95%;}
#msg p.fmend{width:90%; margin:0 auto 1.5em;}

/*btn*/
a.btn_df,a.btn_flw{font-size:140%; color:#fff; display:block; font-weight:bold; text-align:center; width:40%; margin:1em auto 1.5em;  letter-spacing:.05em; text-decoration: none; padding:1.5em 0; background-color:#ff9101; box-shadow:10px 10px 24px rgba(158,95,11,0.2); border:2px solid #ff9101;}
a.btn_df:hover{background:none; color:#f66808; border:2px solid #ff9101;}
a.btn_flw{width:45%; border:none; margin:1em auto .5em; border-radius:6px; padding:1em 0 1em 13%; line-height:150%; text-align:left;
background-color:rgba(85,172,238,0.8);
background:rgba(85,172,238,0.8) url(../img/ic_tw.png) no-repeat 8% center; background-size:9%;}

a.btn_s {background:#e60012; padding:.5em; color:#fff; display:block; font-weight:bold; margin:.5em auto; border-radius:30px; text-align:center; width:30%; letter-spacing:.2em; font-size:120%;} 
a.btn_i {color:#c44a8f; padding:.6em 2em; border:1px solid #c44a8f; margin:.2em 0 0; display:inline-block; font-size:110%;
text-shadow:1px 1px 0 #fff; box-shadow:2px 2px 0 #c44a8f; letter-spacing:0.05em; border-radius:4px;
background:-webkit-gradient(linear,left bottom,left center,from(rgba(196,74,143,0.1)),to(rgba(196,74,143,0)));}
#msg #writeBtn a {width:45%; padding:1em 0; margin:.5em auto 1em;}
#form #agree a:hover,#msg #writeBtn a:hover,#intro #commeBtn a:hover {color:#fff;}

a.txl{background-color:rgba(226,149,197,0.2);}

/*//////pc//////*/
@media all and (min-width: 768px) {
#top header{ padding:12px 0;
background-image:linear-gradient(-140deg, rgba(254,108,1,0.3) 0%, rgba(255,166,29,0.3) 65%, rgba(255,211,78,0) 100%), linear-gradient(to bottom, rgba(254,108,1,0.3) 0%, rgba(255,166,29,0.2) 65%, rgba(255,211,78,0) 100%);
background-repeat:no-repeat,no-repeat;
background-size:80% 30%,100% 35%;
background-position:right bottom,0 0;
}
#menu {margin:0 auto; height:90px; background-color:rgba(255,255,255,0.65);}
#menu ul {width:980px; margin:0 auto; font-size:0; background: url(../img/menu.png?2) no-repeat center center;}
#menu li {display:inline-block; text-align:center; margin:0 0 0 8px;}
#menu li a {width:100%; height:80px; display: block; text-indent: 100%; white-space: nowrap; text-decoration:none; overflow: hidden; transition:0.5s;}
#menu li.menu1{width:145px;}
#menu li.menu2{width:95px;}
#menu li.menu3{width:80px;}
#menu li.menu4{width:100px;}
#menu li.menu5{width:150px;}
#menu li.menu6{width:95px;}
#menu li.menu7{width:150px;}
#menu li.menu8{width:100px;}

.l-card h3 img{width:60%; height:auto;}

#report #entry{width:60%; display:inline-block;}
#report #bknm{width:38%; display:inline-block; vertical-align:top;}
#report .ph_cut{width:480px; height:320px;}
#report .ph_cut_l{width:320px; height:480px;}
}

/*//////smp//////*/
@media all and (max-width: 767px) {
body,p { font-size: 1.3rem;}
h1 { font-size: 2.6rem;}
h2 { font-size: 2rem; line-height:1.5em;}
h3 { font-size: 1.6rem; }
h4 { font-size: 1.4rem; }
.f90 { font-size: 1.2rem;}
.hidtxt{visibility:visible;}
.hid_sp{display:none;}
.ph_cut img,.ph_cut_l img,.ph_main img,#top header h1 img,.thumbnail-wrapper img{position:absolute;left:0;top:0; width:100%; height:100%;}

/*#top header{
background-size:100% 35%,90% 40%,cover;}
#top h1{width:100%; height:0; padding:55% 0 0; margin:0 auto;}
#top h1 .main1{width:65%; height:0; padding:34.8214285714% 0 0; background-size:cover;}
#top h1 .main2{width:6%; height:0; padding:34% 0 0; top:10%; right:5%; background-size:contain;}*/
#top h1{width:100%; height:0; padding:65.8163265306% 0 0; background-size:cover; margin:0 auto 4px;}
#top h1 .main1{background-size:cover;}
#top h1 .main2{width:48%; height:0; padding:25.7662337662% 0 0; top:3%; left:2.5%; background-size:cover;}
#top h1 .main3{width:5%; height:0; padding:27.7173913043% 0 0; top:5%; right:3%; background-size:cover;}
/*#top h1 .main4{width:60%; height:0; padding:13.2437619962% 0 0; bottom:-1%; right:0; background-size:cover;}*/
#top h1 .main4{width:50%; height:0; padding:9.153% 0 0; bottom:1%; right:1%; background-size:cover;}
#top header{padding:0 0 8px;
background-image:linear-gradient(-140deg, rgba(254,108,1,0.3) 0%, rgba(255,166,29,0.3) 65%, rgba(255,211,78,0) 100%);
background-repeat:no-repeat;
background-size:80% 50%;
background-position:right bottom;
}

#next{background-position:right top;}
#next .inner{width:100%;}
.bn_prev{width:100%; margin:0 auto 2%;}
.bn_prev a{width:100%; background-size:cover; margin:0; height:0; padding:14.5% 0 0; border:none;}
#update{width:100%; height:40px; margin:0 0 2.5%;}
#update h2{height:40px;}
#update ul{height:40px; line-height:40px;}
#update ul li{text-overflow: ellipsis;white-space: nowrap;overflow: hidden; width:99%;}

#next .sns{display:none;}
#spot{width:92%; margin:0 auto 7%; height:auto; display:block;}
#spot #trailer {width:100%; height:auto; margin:.2em auto 0; box-shadow:none;}
#spot #trailer div {width:100%; position:relative; padding:56.25% 0 0; height:0; overflow: hidden;}
#trailer iframe,.emb iframe{ position:absolute; top: 0; left:0; width:100% !important; height: 100% !important;}

#spot ul#movlist{margin:0 1% 0 0; top:2.5%; width:90%; font-size:0;}
#spot ul#movlist li{font-size:3.3vw;}

#newep{width:100%; height:auto; display:block; margin:0 auto; padding:0 0 8%;}
#newep h2{left:5%; width:24%;}
#newep .epcut{width:78%; margin:0 5% 0 auto;}
#newep .epcut span{width:100%; height:auto; padding:58% 0 0;}
#newep .storyline{
background-size:22%,82% 90%;
background-position:right bottom,0 0;
}
#newep .storyline p{margin:0 0 0 1.2em; font-size:2.8vw;}
#newep .storyline img.ep1{width:13%; top:-32%;}

#cts {margin:8% auto 0; padding:0 0 3%;
background-size:100% 40%;}
#card{width:100%;}
.l-card{width:45%; margin:0 0 7% 3.2%; padding:0 0 5%;}
.l-card h3{margin:0; top:-10%; width:90%;}
.l-card h3 img{max-width:50%;}
.l-card.news h3{top:-8.5%;}
.l-card.news h3 img{max-width:40%;}
.l-card.interview h3 img{max-width:58%;}
.text-content {font-size:2.9vw; padding:2% 1em 0; line-height:160%;}
.comment .text-content {width:65%; margin:16% auto 0; padding:.5em 0;}
.thumbnail-wrapper{height:auto; padding:60% 0 0;}
.more-text{padding:0;}

#cts ul.bnr{width:100%; margin:0 0 8%;}
#cts ul.bnr li{width:45%; height:auto; margin:0 0 3% 3.2%;}
#cts ul.bnr li a{height:0; padding:39% 0 0;}

#snsarea{text-align:center; width:100%; padding:10% 0 0;}
#snsarea .inner{width:100%;}
#snsarea h3{position: absolute; top:-5%; left:0; right:0; text-align:center; margin:0 auto;}
.shiro{top:-16%; right:10%; width:22%;}
.mg1{top:-7%; left:15%; width:22%;}
.mg2{bottom:0; left:0; width:25%;}

#twTL h3 img{max-width:28%;}
#insta h3 img{max-width:40%;}
#twTL,#insta{margin:0 auto 3em; width:75%; height:300px; height:calc(300px + 10%);
}
#twTL .tline,#insta .tline{margin:10% auto 0;}
#twTL .tline{
height:270px;
/*overflow-y: scroll;*/
overflow-scrolling: touch;
-webkit-overflow-scrolling: touch;}

div.insta ul{width:90%; margin:2% auto;}
div.insta ul li {float:left; margin:1.5%; width:30%;}
div.insta ul li a{width:100%; padding:100% 0 0; height:0; position: relative;}
div.insta ul li a img {width:100%; height:100%; position:absolute; top:0; left:0;}

#rect {margin:0 auto 3em; z-index:10;}
#top footer{background-color:rgba(208,89,11,0.35); text-align:center; height:auto; padding:5% 0;}
footer .share{display:block; padding:0;}
#top footer p.copy {width:100%; padding:2% 0;}

footer.dir2 .inner{width:100%; height:auto; text-align:center; background-size:25%}
footer p.copy{text-align:center;}
footer.dir2 .share{position:static; padding:5% 0;}
#rect2{position:static; margin:0 auto;}
#gotop {bottom: 0; right:0; width:55px; z-index:11;}
#gotop a {width:100%; display:block; font-weight:bold; padding:0; height:55px; background-color:rgba(254,141,1,0.7); transition: 0.2s ease-in-out; text-decoration:none;}

/*------------------　2nd　------------------ */
header#dir{padding:0 0 2%; margin:0;
background-position:center 0,right bottom;
background-size:100% 5px,80% 65%;}
header#dir #logo{width:100%; padding:3% 0 0;}
header#dir #logo a {width:55%; height:auto; margin:0 0 1% 1.5%; padding:29.2682926829% 0 0; background-size:cover;}
header#dir #logo img.oaday{width:35%; right:1%;}

#menu ul {width:100%; margin0 auto; display: flex; flex-flow: row wrap;}
#menu ul li {/*display:inline-block;*/ margin:4px 0 0; background-color:rgba(255,255,255,0.65); background-repeat: no-repeat; background-position: center center; background-size:auto 88%; text-align:center; 
/*width: -webkit-calc(100% / 4 - 1%) ;
width: calc(100% / 4 - 1%) ;*/
}
#menu li.menu1{background-image:url(../img/menu1.png); width:30%;}
#menu li.menu2{background-image:url(../img/menu2.png); width:18%;}
#menu li.menu3{background-image:url(../img/menu3.png); width:18%;}
#menu li.menu4{background-image:url(../img/menu4.png?1); width:18%;}
#menu li.menu5{background-image:url(../img/menu5.png); width:28%;}
#menu li.menu6{background-image:url(../img/menu6.png); width:18%;}
#menu li.menu7{background-image:url(../img/menu7.png); width:28%;}
#menu li.menu8{background-image:url(../img/menu8.png?1); width:20%;}

/*#menu li:nth-child(4){margin:0 1% 4px 0;}*/
#menu li:nth-child(5){margin:4px 0 0 6%;}
#menu li a {display: block; height:0; padding:26% 0; width:100%; text-indent: 100%; white-space: nowrap; text-decoration:none; overflow: hidden; transition:0.5s; /*background-color:rgba(20,255,255,0.65);*/}

#menu li.menu2 a,#menu li.menu3 a,#menu li.menu4 a{padding:43.5% 0;}
/*#top #menu li.menu2 a,#top #menu li.menu3 a,#top #menu li.menu4 a{padding:43.5% 0;}*/
#menu li.menu5 a,#menu li.menu7 a{padding:29.5% 0;}
#menu li.menu6 a{padding:45.5% 0;}
#menu li.menu8 a{padding:41% 0;}
#menu li a:hover{background:linear-gradient(-110deg, rgba(254,108,1,0.7) 0%, rgba(255,166,29,0.5) 55%, rgba(255,211,78,0.2) 100%);}

#container{background-position:right top 50px;}
#container .heading{width:100%;}
#container h1{width:80%; height:auto; padding:20% 0; background:url(../img/h1.jpg) no-repeat center center; background-size:cover;}
#container h1 span.ttl img{max-height:45%; left:6%;top:25%;}
#container #sns{right:1.5%; bottom:5%;}
#container #sns a{width:50px; height:50px; margin:0 1% 0;}
#container #sns p.share{width:110px; height:14px; background-size:contain; margin:0 .5em .8em 0;}

#contents{width:100%; margin:4% auto; padding:3em 0;}
#contents .inner{width:95%;}
#contents .inner p {padding:.5em 0 1em; line-height:180% !important; font-size:98%;}
#contents .inner p.f85,#contents .inner p.f80 {line-height:normal !important;}
.ph_cut {width:98%; height:0; padding:65.3% 0 0; position: relative; margin:1em auto; box-shadow:5px 5px 20px rgba(158,95,11,0.2);}
.ph_cut_l {width:60%; height:0; padding:90% 0 0; position: relative; margin:1em auto .5em; box-shadow:5px 5px 20px rgba(158,95,11,0.2);}
#bknm{width:100%; margin:2em auto 1em;}
.bdr{width:90%; padding:.4em 0;}

/*intro*/
#intro h2{font-size:3.55vw; padding:0 1em;}
#intro #contents p,#story #contents p {padding:1em 1.8em .5em;}
#intro h3{font-size:4vw; padding:.5em 1em;}
#intro h3.cname{font-size:125%;}
#intro #contents .inner p,#story #contents .inner p{font-size:98%;}
#intro .bdr3{margin:1em auto 4em;}
#intro .bdr3:last-child{margin:0 auto 1em;}

/*news*/
#promo{margin:0 auto 1.5em;}
#promo li{font-size:95%; margin:0 0 2.5%;}
#promo p.add {font-size:1rem !important; padding:.2em 0; width:92%;}
#promo .pdate{font-size:90%;}
#info article{margin:0 auto 1.8em;}
#info article:last-child{margin:0 auto .5em;}
#info article.theme{padding:1.2em 1.5em;}
#promo h2{font-size:4.2vw;}
#promo h2{font-weight:bold; padding:1% 0; margin:0 auto .5em;}
#promo h3{font-size:3.6vw; line-height:1.35;}
#info article h2{line-height:140%; padding:.2em .1em .4em; font-size:4.3vw;}
#info article h3{font-size:4vw;}
#info article h3.bd{width:100%;}
#info article p,#music article p,#person article p {padding:.5em 0; font-size:98% !important;}
.bdr2,.bdr3,.bdr4{width:100%; padding:.7em 1em !important; font-size:92% !important;}

/*story*/
#story #contents{padding:0;}
#story h2{font-size:6vw; text-align:center;}
#story .mov{width:100%; margin:0 auto 1em; padding:3% 0 0; box-shadow:none;}
#story .ph_cut {width:100%; height:0; padding:66.6% 0 0; margin:.5% auto 0;}
#story ul#movlist {width:100%; padding:0 0 2.5%;}
#story ul#movlist li{width:70%; margin:0 .5%; font-size:3.5vw;}
#story .ph_area{margin:4% auto 0; width:92%; text-align:center;}
#story .ph_s{width:90%; padding:60% 0 0; margin:0 auto;}
#story .ph_s:first-of-type{margin:0 auto 3%;}
#story #trailer,#info .emb,#emergency .emb {width:100%; position: relative; padding:56.25% 0 0; height: 0; overflow: hidden; height:auto; margin:0 auto; box-shadow:none;}
#story #trailer iframe,#info .emb iframe,#emergency .emb iframe{ position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;}

#story #bknm h3,#gallery #bknm h3,#itv #bknm h4,#fashion #bknm h3{margin:0 0 0 3%;}
#story #bknm h3 img,#gallery #bknm h3 img,#itv #bknm h4 img,#fashion #bknm h3 img{max-width:45%;}
#story #bknm li,#gallery #bknm li,#itv #bknm li,#fashion #bknm li{width:43%; height:auto; margin:0 2% 5% 4%;}
#story #bknm li a,#gallery #bknm li a,#itv #bknm li a,#fashion #bknm li a{width:100%; height:0; padding:66% 0 0;}
#story #bknm li a img,#gallery #bknm li a img,#itv #bknm li a img.cover,#fashion #bknm li a img {position:absolute;left:0;top:0; width:100%; height:100%;}
#story #bknm li span.epn,#gallery #bknm li span.epn,#fashion #bknm li span.epn{font-size:3.5vw;}

/*gallery*/
#gallery #contents{padding:4% 0 0;}
#gallery h2{font-size:6vw; margin:0 auto 35px;}
#gallery h2:before{bottom:-28px; height:25px;}
#gallery ul#show{width:95%;}
#gallery ul#show li {margin:1% 1%;
width:30%;
width: -webkit-calc(100% / 3 - 2%) ;
width: calc(100% / 3 - 2%);
}
#gallery ul#show li span a {width:100%; height:0; padding:66.5% 0 0;}

/*interview*/
#itv #mainttl{padding:0; margin:0 0 5%;}
#itv #mainttl h2{z-index:111; left:0; top:auto; bottom:4%; width:45%; background-color:rgba(254,141,1,0.9); padding:2% 2% 1%;}
#itv #mainttl h2 img{max-width:94%;}
#itv .mainph{width:100%; position:relative; height:0; padding:60% 0 0;}
#itv .mainph img{position:absolute;left:0;top:0; width:100%; height:100%;}
#itv .mainph.vol1,#itv .mainph.vol2{background-position: center center;}
#itv article .ph_cut{margin:0 auto 6%;}
#itv h3{padding:0 0 0 6%; line-height:140%; font-size:4vw;}
#itv h3:before{width:5%;}

/*emergency*/
#emergency #container h1 span.ttl img{max-height:52%; left:6%;top:22%;}
#emergency #contents{padding:4% 0 1%;}
#emergency #mainttl{width:100%; padding:4% 5%;}
#emergency h2{font-size:3.4vw;}
#emergency h3{font-size:4vw;}

/*fashion*/
#fashion .inner,#itv .inner,#gallery .inner{width:100%;}
#fashion #container h1 span.ttl img{max-width:80%; left:6%;top:25%;}
#fashion #outline{width:95%; margin:5% 0 0 5%; padding:0 0 6% 4%;
background-image:url(../img/fashion/yano.jpg),linear-gradient(rgba(255,211,78,0.5), rgba(255,211,78,0.5));
background-repeat:no-repeat,no-repeat;
background-position:right 10%,right bottom;
background-size:50%,75% 60%;}
#fashion #outline:before{border: solid 2px #fe8d01; top:-20px;}
#fashion #outline h2{margin:-8% 0 0; width:100%;}
#fashion #outline h2 img{max-width:70%;}
#fashion #outline h3{font-size:3.2vw; margin:1.5% 0; width:92%;}
#fashion article p span.epnm{width:60%; font-size:4.5vw;}
.collabo{padding:1em 1em 0;}

/*quiz*/
#quiz #contents{padding:6.5% 0;}
#quiz #outline {margin:0 1% 10% auto; position: relative; width:96%; padding:0;
background:url(../img/heart/pre1.png) no-repeat right 60%;
background-size:49%;
}
#quiz #outline h2{font-size:4.1vw;}
#quiz #outline h3{font-size:3.2vw; width:50%; margin:3% 0;}
#quiz #outline p{font-size:3.8vw;}
#quiz .inner{width:85%;}
#quiz h3.que{font-size:4vw; padding:.5em 0; line-height:140%;}
#quiz span.epnum{width:30%; font-size:4vw; margin:-.8em auto .6em; padding:.4em;}
#quiz .qbox{box-shadow:10px 10px rgba(158,95,11,0.15);}
ul#ans{width:80%; margin:1em auto 3em;}
ul#ans li{font-size:3.8vw;}
#quiz h4.answer{width:80%;}
ul#pastq li span.vnm{width:15%;}

/*comic*/
#comic h2{font-size:4.4vw; padding:0 0 5%; line-height:140%; width:94%;}
#comic h2 span.f80{display:block; font-size:70% !important;}
#comic .comic1,#comic .comic2,#comic .comic3{width:55%; height:0; padding:77.9625% 0 0; margin:0 auto 3.5em;}
#comic .txt{font-size:100% !important;}
#comic h3{font-size:140%;}

/*caststaff*/
#caststaff h2{font-size:7vw; margin:0 auto 1em;}
#caststaff h2:before{bottom:-25px; height:20px;}
#caststaff h3{margin:1.5em auto .5em; font-size:4vw;}
#caststaff table{width:100%;}
#caststaff table td{padding:.3em 0;}
#caststaff table td.cname{font-size:1.35rem; font-size:4vw; width:44%;}
#caststaff table td.chara{font-size:1.35rem; font-size:4vw; width:46%; }
#caststaff table td.naka{padding:0; font-size:1.5rem; font-size:3vw; vertical-align:middle;}
#caststaff table td.maru{line-height:0.5em; font-size:3vw; padding:1.5% 0 0;}
#caststaff .credit{width:95%; font-size:3.6vw;}

/*heart*/
#heart .inner,#emergency .inner{width:90%;}
#heart #contents .inner p{font-size:100%;}
#heart #contents .inner p.f90{font-size:90% !important;}
#heart h2{margin:0 0 4% 0;}
#heart h2 img{max-width:100%;}
#heart .ph1{width:95%; height:0; padding:64.1853512706% 0 0;}
#heart .map{width:100%; height:0; padding:59% 0 0;}
#heart .pre1{width:85%; height:0; padding:50.2916% 0 0; margin:0 auto 3em;}
#heart .pre2{width:80%; height:0; padding:26.6% 0 0; margin:1.2em auto 2.5em;}
#heart h3{font-size:4vw;}
#heart h3.correct{font-size:4.5vw; border:1px solid #f05713; width:50%; margin:5% auto 1em;}
#heart h4{font-size:4.3vw;}
#heart h4.visual{margin:1em 0 .5em; text-align:left; font-size:4.5vw;}
#heart h5.pre{font-size:3.6vw;}

#heart p.join{font-size:100%; line-height:150% !important;}
#heart img.arw{max-height:45px; margin:2% 45% 0;}

/*report*/
#report #entry{width:100%;}
#report article{padding:0 1em 1em; margin:0 auto;}
#report article p{padding:.6em 0; font-size:98% !important;}
#report article h2{font-size:130%;}
#report article h3{font-size:3.4vw; padding:1em 0 0;}
#report article h3.endtx{font-size:3.5vw; padding:1em 1em 0;}
#report article p.cap span { font-size:1.2rem;}
#report #bknm{width:90%; margin:5% auto 0; background-color:rgba(255,211,78,0.6); padding:.5em 0 .5em;}
#report #bknm h3{font-size:200%; padding:.2em .4em; margin:-.9em 0 0;}
#report #bknm h3:before{bottom:-30px;}
#report #bknm ul{margin:1.8em 0 0 0;}
#report #bknm li{width:90%; line-height: 1.4em; margin:0 auto 2%;}
#entry article p.cap{width:95%; margin:.8em auto .5em;}
#entry article p.cap span{font-size:100%;}
a.share_tw{font-size:3vw;}

/*msg*/
#msg h2{font-size:120%; padding:.5em 0;}
#prevnext ul li {font-size:100%; width:40px; height:40px; line-height:40px;}
#prevnext ul li a{width:40px; height:40px;}
#msg p.att,#person p.att{font-size:110%;}
#msg p.bdr{margin:0 auto 1em; padding:2% 0; border:none;}

a.btn_ap {margin:.5em auto 1.5em; width:62%; font-size:1.5rem; font-size:4vw;}
a.btn_s{width:50%;}
a.btn_i {margin:.5em 0 .2em; padding:.5em 2em;}
a.btn_df{width:70%; margin:1.2em auto 1.5em; padding:5% 0; font-size:4vw;}
a.btn_flw{width:64%; font-size:3.4vw; padding:4% 0 4% 16%; background-size:9%; background-position:6% center;}
}

@media all and (max-width: 320px) {
body,p { font-size: 1.3rem;}
a.btn_ap {width:70%;}
/*.bn_rp span.upd {font-size:1.4rem; width:40px; height:30px; padding:12px 0 0;}*/
}
.md-inner {box-shadow:none !important;}
.md-caption {color:#222 !important;}

.fadedown {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadedown;
 -ms-animation-name: fadedown;
 animation-name: fadedown;
 visibility: visible !important;
}
@-webkit-keyframes fadedown {
 0% { opacity: 0; -webkit-transform: translateY(10px);}
 100% { opacity: 1; -webkit-transform: translateY(0);}
}
@keyframes fadedown {
 0% { opacity: 0; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px);}
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}
}
