/* ================================= Episode CSS
================================= */

.unit { text-align:center; padding: 0 10px;}
.unit:not(:last-child) { margin-bottom:20px;}
.unit h2, .unit dl dt, .unit h3 { font-family:Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;}
.unit h2, .unit h3, .unit dl dt, .unit dl dd, .unit p { line-height:1.6;}
.unit h2::after { content:""; display:block; height:2px; background-image: -webkit-gradient(linear, left top, right top, from(hsla(0,0%,100%,0)), color-stop(0.25, hsla(0,0%,100%,1)), color-stop(0.75, hsla(0,0%,100%,1)), to(hsla(0,0%,100%,0))); background-image: -webkit-linear-gradient(left, hsla(0,0%,100%,0), hsla(0,0%,100%,1) 25%, hsla(0,0%,100%,1) 75%, hsla(0,0%,100%,0)); background-image: linear-gradient(to right, hsla(0,0%,100%,0), hsla(0,0%,100%,1) 50%, hsla(0,0%,100%,1) 75%, hsla(0,0%,100%,0)); margin-bottom:1em;}
.unit h2 > span { display:block; padding-bottom:0.25em;}
.unit h2 { color:#b2e6f0; font-size:112.5%;}
.unit h3 { color:#b2e6f0; margin-bottom:0.75em; font-size:87.5%;}
.unit dl dt { font-weight:bold; color:#5ed6fc;}
.unit dl dd:not(:last-child) { margin-bottom:1em;}
.unit p { text-align:left; font-size:83%;}
.unit p:not(:last-child) { margin-bottom:1.5em;}

@media all and (min-width: 768px) {
.unit:not(:last-child) { margin-bottom:30px;}
.unit h2 { font-size:125%;}
.unit h3 { font-size:100%;}
.unit dl dt, .unit dl dd, .unit p { font-size:87.5%;}
}


/*	tab menu
============================== */

.menu-tab { margin-bottom:20px;}

.menu-tab nav ul { list-style-type:none; display:table; width:100%;}
.menu-tab nav ul li { width:20%; display:table-cell; position: relative; z-index: 10;}
.menu-tab nav ul li a { margin-right: 4px;}
.menu-tab nav ul li a:hover { opacity: .95;}

/*
.menu-tab nav ul li:nth-child(5n-4) a { margin-right:4px;}
.menu-tab nav ul li:nth-child(5n-3) a { margin-left:1px; margin-right:3px;}
.menu-tab nav ul li:nth-child(5n-2) a { margin-left:2px; margin-right:2px;}
.menu-tab nav ul li:nth-child(5n-1) a { margin-left:3px; margin-right:1px;}
.menu-tab nav ul li:nth-child(5n) a { margin-left:4px;}
*/

.menu-tab nav ul li a, .menu-tab nav ul li a > span { display:block;}
.menu-tab nav ul li a { text-decoration:none; background-color:hsla(0,0%,100%,0.5); border-top:2px solid transparent; border-bottom:2px solid transparent;}
.epi01 .menu-tab nav ul .mepi01 a, .epi02 .menu-tab nav ul .mepi02 a, .epi03 .menu-tab nav ul .mepi03 a, .epi04 .menu-tab nav ul .mepi04 a, .epi05 .menu-tab nav ul .mepi05 a { background-color:hsla(0,0%,100%,1); cursor: default; pointer-events: none;}
.menu-tab nav ul li a > span { font-family:Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; text-align:center; color: #000; background-color:#e5b36d; padding:0.5em 0; line-height:1.5; letter-spacing:0.2em; padding-left:0.2em; font-size:87.5%; display:block; position: relative; z-index: 1000;}
.menu-tab nav ul li a > span span { font-weight:bold; font-size:112.5%;}
.menu-tab nav ul .nolink a { opacity:0.25; cursor:default;}


@media all and (min-width: 768px) {
.menu-tab { margin-bottom:30px;}
.menu-tab nav ul li a > span { font-size:100%;}
}

/*	carousel
============================== */

.carousel { position:relative; margin-bottom: 30px;}
.carousel .outer { height:115px; position:relative; margin:0 30px; overflow:hidden;}
.carousel .outer ul { position:absolute; display:table; -webkit-transform: translateZ(0);}
.carousel .outer .inner li { display:table-cell; padding-right: 6px;}
.carousel .outer .inner li span, .carousel .outer .inner li span img { width:204px; height:115px; display:block;}
.carousel .outer .inner li span { text-decoration:none; background-color:hsla(0,0%,100%,0.5);}
.carousel .outer .inner li span { position:relative; background-position:left top; background-size:cover;}

@media all and (min-width: 375px) {
.carousel .outer { height:136px;}
.carousel .outer .inner li span, .carousel .outer .inner li span img { width:242px; height:136px;}
}

@media all and (min-width: 768px) {
.carousel .outer { height:236px;}
.carousel .outer .inner li span, .carousel .outer .inner li span img { width:420px; height:236px;}
}

/*	disc
============================== */
.carousel ul.ctrl-disc { text-align:center; height:34px; /* background-color:hsla(0,0%,100%,0.5); */}
.carousel ul.ctrl-disc li { display:inline-block; width:24px; padding-top:9px;}
.carousel ul.ctrl-disc li a { display:inline-block; text-decoration:none; width:16px; height:16px; background-color:hsla(0,0%,100%,0.6); border-radius:8px; text-indent:110%;white-space:nowrap;overflow:hidden;}
.carousel ul.ctrl-disc li a.now { background-color:#006a6a;}

/*	arrow
============================== */
.carousel ul.ctrl-arrow li { position:absolute; top:40px; /* top:50%; margin-top:-17px; */}
.carousel ul.ctrl-arrow li.ctrl-lef { left:0;}
.carousel ul.ctrl-arrow li.ctrl-rig { right:0;}
.carousel ul.ctrl-arrow li a { display:block; width:24px; height:34px; background-image:url(../img/arrow40.svg); background-repeat:no-repeat; background-size:136px 34px; text-indent:110%;white-space:nowrap;overflow:hidden; background-color:#eaeab8;}
.carousel ul.ctrl-arrow li.ctrl-lef a { background-position:-5px 0;}
.carousel ul.ctrl-arrow li.ctrl-rig a { background-position:-39px 0;}
.carousel ul.ctrl-arrow li.ctrl-lef a:hover { background-position:-73px 0;}
.carousel ul.ctrl-arrow li.ctrl-rig a:hover { background-position:-107px 0;}

@media all and (min-width: 375px) {
.carousel ul.ctrl-arrow li { top:51px;}
}

@media all and (min-width: 768px) {
.carousel ul.ctrl-arrow li { top:101px;}
}
