#contents {width:980px; margin:2em auto 0; padding:0 0 2em;}
#menu li {text-align:center; margin:0 .5em; width:25%;}
#menu li a {width:100%; display: block; transition:0.5s; color: #fff; font-weight: bold; background-color: #E84B4A; border-radius:10px; padding:1.5em 0; text-decoration:none; font-size:110%;}
#menu li a:hover {text-decoration:none; background-color: #0050FF;}

.f140 { font-size:140%;}
.f120 { font-size:120%;}
.f90 { font-size:90%;}
.f85 { line-height:normal !important; font-size:85% !important;}

h2#cmpcg {margin:0 auto 1em; text-align:center; font-weight: bold; background-color:#0050FF; font-size:180%; color:#fff; padding:0.8em 0; width:100%;}
#contents h3 {margin:2em auto 1em; text-align:center; font-weight: bold; font-size:140%; border-bottom:3px solid #0050FF; padding:0 0 .5em;}
#contents h4 {margin:2em auto .5em; text-align:center; font-weight: bold; font-size:140%; padding:0 0 .5em;}
#contents p {line-height:150%; padding:.5em 0;}
#contents #movie {margin:0 auto 1em; width:640px;}

#menu ul,ul#studiomc,ul#ytber,div#sample {display:flex; flex-flow:row wrap; margin:0 auto .5em; justify-content: center;}
ul#studiomc li,ul#ytber li {background-color:#fff; text-align:center; width:250px; margin:.8em; padding:0 0 1em; line-height:140%; box-shadow:2px 2px 8px rgba(167,174,185,0.2);}
ul#ytber li p {padding:0;}
ul#ytber li:last-child {background:none; box-shadow:none; text-align:left; /*background-color:#fff;*/ vertical-align:bottom; display: flex; flex-direction: column; padding:0;}
ul#ytber li:last-child p {margin-top:auto; padding:0 .2em 0; font-size:180%; font-weight:bold; letter-spacing:.08em;}
ul#studiomc li span.mcph,ul#ytber li span.ytbph {background-color:#fcc; text-align:center; margin:0 0 .8em; height:240px;}
ul#studiomc li.mc1 span.mcph {background-image: url(../img/cm/mc1.jpg);}
ul#studiomc li.mc2 span.mcph {background-image: url(../img/cm/mc2.jpg);}
ul#studiomc li.mc3 span.mcph {background-image: url(../img/cm/mc3.jpg);}
ul#ytber li.ytb1 span.ytbph {background-image: url(../img/cm/ytb1.jpg);}
ul#ytber li.ytb2 span.ytbph {background-image: url(../img/cm/ytb2.jpg);}
ul#ytber li.ytb3 span.ytbph {background-image: url(../img/cm/ytb3.jpg);}
ul#ytber li.ytb4 span.ytbph {background-image: url(../img/cm/ytb4.jpg);}
ul#ytber li.ytb5 span.ytbph {background-image: url(../img/cm/ytb6.jpg); background-position: center center !important;}

ul#ytber + p {color:#666; font-size:90%;}

div#sample .inner {width:48%; margin:1em 1%; text-align:center; padding:1.5em 0; border:1px solid #efefef; box-sizing:border-box; }
div#sample .sampleph {width:410px; margin:1em auto 0; background-color:#F4F7FB; height:231px;}
.sato {background-image: url(../img/cm/sampleph1.jpg);}
.sato2 {background-image: url(../img/cm/sampleph2.jpg);}

.cast {background-color:#f4f8fe; padding:1em; margin:1em auto;}
.cast h4 {margin:.5em auto .8em !important; color:#0050FF; background-color:rgba(255,255,255,0.8); padding:.6em 0 !important; width:85%; box-shadow:2px 2px 6px rgba(167,174,185,0.2);}

ul#studiomc li span.mcph,ul#ytber li span.ytbph,div#sample .sampleph {position:relative; display: block; background-repeat: no-repeat; background-position: center top; background-size: cover;}
ul#studiomc li span.mcph img,ul#ytber li span.ytbph img,div#sample .sampleph img {position:absolute;left:0;top:0; width:100%; height:100%;}

#contents .block {margin:1.5em auto 0;}
#contents address {font-weight:normal; font-style: normal;}
#contents address a{font-size:100%; color: #0050FF;}
#contents .block .txt {color: #dd1b1b; font-size:110%; font-weight: bold; text-align: center; padding:1em 0 0;}
#contents .block .btn a {width:440px; height:95px; margin:.5em auto; display: block; background: url(../img/waku_btn.png); white-space: nowrap; text-indent: -9999px; overflow: hidden;}
#contents .block span {display: block;}
#contents .block .bn_ap a {width: 440px; margin:1em auto 0; display: block; background-color:#fff; text-align:center; padding:1em 0; color:#0050FF; font-weight: bold; border:3px solid #0050FF; box-sizing:border-box; text-decoration:none; transition:0.5s;}
#contents .block .bn_ap a:hover{background-color:#0050FF; color:#fff;}

@media all and (min-width: 768px) {
.nobr{display: none;	}
}
@media all and (max-width: 767px) {
h2#cmpcg {font-size:5vw; margin:0 auto .5em;}
#contents {width:95%; margin:2% auto 0; padding:0;}
#menu li {text-align:center; margin:0 .5%; width:32%; width: calc(100% / 3 - 1.5%);}
#menu li a { font-size:3vw;}
#contents h3 {margin:1.5em auto .5em; font-size:4.8vw; border-bottom:2px solid #3E97FB;}
#contents p {font-size:85%;}
#contents #movie {width:100%; height:auto;}

ul#studiomc li,ul#ytber li {width:47%; margin:1% 1.5% 2.5%; font-size:90%; line-height:130%; padding:0 0 .7em;}
ul#ytber li p {padding:0 .5em; line-height:135%;}
ul#ytber li p span.f85 {line-height:100% !important;}
ul#ytber li:last-child p {font-size:160%;}
ul#studiomc li span.mcph,ul#ytber li span.ytbph {width:100%; margin:0 0 .7em; height:0; padding:100% 0 0;}

ul#ytber + p {font-size:80%; padding:0 0 1em;}

div#sample .inner {width:100%; margin:.5em 0; text-align:center; padding:1em 0; border:1px solid #efefef; box-sizing: border-box; }
div#sample .sampleph {width:90%; height:0; padding:50.7% 0 0; margin:.5em auto 0;}

.cast {padding:4% 3%; margin:1em auto;}
.cast h4 {margin:0 auto .8em !important; font-size:4.5vw !important; width:100%;}

#contents .block {margin:1em auto;}
#contents .block .txt {font-size:100%; padding:.5em 0 0;}
#contents .block .btn a {width: 90%; height: 0; padding-top: 19.43%; margin:1% auto; background-size: cover;}
#contents .block span {font-size:75% !important;}
#contents .block .bn_ap a {border:2px solid #0050FF; width: 90%;}
}