@charset "UTF-8";
/* メインイメージ
---------------------------------------------------------------------*/
#mainImg { width: 100%; height: 0; margin: 0 auto; position: relative; }
#mainImg #imgInner { width: 100%; margin: auto; padding-left: 10px; padding-right: 10px; }
@media only screen and (max-width: 1024px) { #mainImg #imgInner { display: none; } }
#mainImg #boxWrap { position: absolute; top: 110px; left: 40px; z-index: 2; }
#mainImg #boxWrap.right { left: inherit; right: 60px; }
#mainImg #boxWrap #titleBox { background: rgba(0, 0, 0, 0.8); margin: 0 auto 5px; padding: 20px 30px; color: #FFF; }
#mainImg #boxWrap #titleBox h1 { font-size: 1.3em; font-weight: bold; }
#mainImg #boxWrap #titleBox h1 + p { font-size: 1em; }
#mainImg #boxWrap #titleBox .country { border-top: 1px solid #999; margin-top: 1em; padding-top: 1em; }
#mainImg #boxWrap #titleBox .country figure { margin: 4px 1em 0 0; }
#mainImg #boxWrap #titleBox .country figure img + img { margin-left: 1em; }
#mainImg #boxWrap #titleBox .country section { width: auto; }
#mainImg #boxWrap #titleBox .country section h2 { font-weight: bold; font-size: 0.95em; }
#mainImg #boxWrap #titleBox .country section p { font-size: 0.8em; }
#mainImg #boxWrap #titleBox hr { border-top-color: #fff; }
#mainImg #boxWrap p:last-child { font-size: 0.85em; }
#mainImg #boxWrap p:last-child a { color: #FFF; text-decoration: underline; }
#mainImg #boxWrap p:last-child a:hover { text-decoration: none; }

/* topTitle
---------------------------------------------------------------------*/
#program { display: flex; justify-content: space-between; }
#program #topTitle { margin-bottom: 2em; }
#program #topTitle h1 { font-size: 1.7em; font-weight: bold; }
@media only screen and (max-width: 768px) { #program #topTitle h1 { font-size: 1.4em; } }
@media only screen and (max-width: 576px) { #program #topTitle h1 { font-size: 1.1em; } }
#program #topTitle h1 + p { font-size: 1.1em; }
@media only screen and (max-width: 576px) { #program #topTitle h1 + p { font-size: 1em; } }
#program #topTitle .help { margin-top: 1em; }
.country { margin-top: 2em; margin-bottom: 1em; display: flex; flex-wrap: nowrap; }
.country figure { margin-right: 1em; }
.country figure img { min-width: 60px; border: 1px solid #dddddd; }
.country figure img + img { margin-left: 1em; }
.country section { width: auto; }
.country section h2 { font-weight: bold; font-size: 0.95em; }
.country section p { font-size: 0.8em; }
#program .help p { background: #fff; font-weight: bold; font-size: 0.8em; border: 1px solid #999; padding: 0.5em 1em; display: inline-block; }

#program .youtube { position: relative; height: 0; padding-bottom: calc(9 / 16 * 100%); overflow: hidden; margin-bottom: 2em; }
#program .youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

#program h3.subTitle01, #program h3.subTitle02 { margin-top: 40px; margin-bottom: 20px; }
#program .langMark { border: 1px solid #e4007f; border-radius: 4px; background: #FFF; display: inline-block; color: #e4007f; padding: 0.25em 0.5em; font-size: 0.85em; font-weight: bold; margin-top: 10px; }

#program #slider { margin: 0 auto 4em; }
#program #slider .bx-wrapper { margin-bottom: 5px; }
#program #slider .bx-wrapper .bx-viewport { margin: 0; }
#program #slider ul.bxslider li img { margin: 0 auto; }
#program #slider ul#bx-pager { display: flex; justify-content: center; margin: auto; padding: 0; }
#program #slider ul#bx-pager li { padding: 0; }
#program #slider ul#bx-pager li + li { margin-left: 5px; }
#program #slider ul#bx-pager a { padding-bottom: 10px; }
#program #slider ul#bx-pager a img { opacity: 0.5; -ms-filter: alpha(opacity=50); filter: alpha(opacity=50); -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; }
#program #slider ul#bx-pager a:hover img, #program #slider ul#bx-pager a.active img { opacity: 1; -ms-filter: alpha(opacity=100); filter: alpha(opacity=100); }
#program .imgOne { text-align: center; margin-bottom: 2em; }

/* pWrap
---------------------------------------------------------------------*/
#program .pWrap { box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1); background: #FFF; margin-top: 2em; padding: 2em; }
@media only screen and (max-width: 576px) { #program .pWrap { padding: 1.5em 1em; } }
#program .pWrap h1 { font-size: 1.6em; font-weight: bold; }
@media only screen and (max-width: 768px) { #program .pWrap h1 { font-size: 1.3em; } }
@media only screen and (max-width: 576px) { #program .pWrap h1 { font-size: 1.1em; } }

/* staff
---------------------------------------------------------------------*/
#program .staff { border-top: 3px double #999; border-bottom: 3px double #999; padding: 1em 0; margin: 2em 0; }
#program .staff p { font-size: 0.9em; }

/* sec01
---------------------------------------------------------------------*/
#program .sec01, #program .longStory { margin-top: 2em; }
#program .sec01 p, #program .longStory p { font-weight: bold; }

/* sec02
---------------------------------------------------------------------*/
#program .sec02 { margin-top: 1em; border-top: 1px solid #CCC; padding-top: 1em; }
#program .sec02 figure figcaption { font-size: 0.8em; margin-top: 10px; }

/* profile
---------------------------------------------------------------------*/
#program .secProfile { margin-top: 3em; }
#program .secProfile figure img { display: block; margin: 0 auto; }

/* sec03
---------------------------------------------------------------------*/
#program dl.sec03 dt { clear: left; float: left; width: 11em; padding: 0.4em 0; }
#program dl.sec03 dd { margin-left: 0; padding: 0.4em 0 0.4em 11em; border-bottom: 1px solid #CCC; }

/* sec04 
---------------------------------------------------------------------*/
#program .sec04, #program .secGroup { margin: 3em 0; background: #ede9de; position: relative; padding: 2em; -webkit-box-sizing: border-box; box-sizing: border-box; }
@incluce xs { #program .sec04, #program .secGroup { padding: 1em 1.5em; } }
#program .sec04::before, #program .sec04::after, #program .secGroup::before, #program .secGroup::after { position: absolute; content: ''; width: 20px; height: 50px; -webkit-box-sizing: border-box; box-sizing: border-box; }
#program .sec04::before, #program .secGroup::before { top: 0; left: 0; border-top: 3px solid #b8a67a; border-left: 3px solid #b8a67a; }
#program .sec04::after, #program .secGroup::after { bottom: 0; right: 0; border-bottom: 3px solid #b8a67a; border-right: 3px solid #b8a67a; }
#program .sec04 h3, #program .secGroup h3 { font-size: 1em; margin-bottom: 0.3em; color: #333; font-weight: bold; }

/* sec05 物語
---------------------------------------------------------------------*/
#program .sec05, #program .sec05W, #program .secStory { position: relative; margin-top: 3em; margin-bottom: 3em; padding: 2em; border: solid 1px #999; }
@media only screen and (max-width: 576px) { #program .sec05, #program .sec05W, #program .secStory { padding: 2em 1.5em; } }
#program .sec05 .box-title, #program .sec05W .box-title, #program .secStory .box-title { position: absolute; display: inline-block; top: -0.5em; left: 1em; padding: 0 1em; line-height: 1; background: #F4F3F1; color: #333; font-weight: bold; }
#program .sec05 p, #program .sec05W p, #program .secStory p { margin: 0; padding: 0; }

#program .sec05W .box-title { background: #fff; }

/* sec06
---------------------------------------------------------------------*/
#program .sec06 { position: relative; padding: 1em 2em; margin: 0; top: 0; background: #ede9de; }
#program .sec06::before, #program .sec06::after { position: absolute; top: 0; content: ''; width: 10px; height: 100%; display: inline-block; box-sizing: border-box; }
#program .sec06::before { border-left: dotted 3px #b8a67a; border-top: dotted 3px #b8a67a; border-bottom: dotted 3px #b8a67a; left: 0; }
#program .sec06::after { border-top: dotted 3px #b8a67a; border-right: dotted 3px #b8a67a; border-bottom: dotted 3px #b8a67a; right: 0; }
#program .sec06 h3 { color: #333; font-weight: bold; font-size: 1em; border-bottom: 1px solid #b8a67a; padding-bottom: 0.5em; margin-bottom: 0.5em; }
#program .sec06 p { font-size: 0.9em; }

#program ul.dateTime { font-weight: bold; }
#program ul.dateTime li { margin-left: 1.5em; text-indent: -1.5em; }
#program ul.dateTime li::before { content: "■"; margin-right: 0.5em; color: #FF8082; }

#program [class$="col"] h3 ~ p { font-weight: bold; }

/* クレジット
---------------------------------------------------------------------*/
#program .credit { border-top: 1px dotted #333; margin-top: 40px; padding-top: 10px; position: relative; }
#program .credit dl dt { clear: left; float: left; width: 5em; padding: 0; }
#program .credit dl dd { margin-left: 0; padding: 0 0 0 5em; }
#program .credit dl.w8 dt { width: 8em; }
#program .credit dl.w8 dd { padding: 0 0 0 8em; }
@media only screen and (max-width: 768px) { #program .credit p + p { margin-top: 1em; } }
#program .credit img { vertical-align: middle; }