@charset "utf-8";



/********************** top *******************************/
main{}

.container{ max-width:1100px; width:92%; margin:0 auto;}
.in_container{ max-width:1000px; margin:0 auto;}

.coming_soon{ font-size: 40px; font-weight: bold; line-height: 1.5em; margin: 15vw 0;}
@media only screen and (max-width: 768px){
.coming_soon{ font-size: 26px}	
}

.top_main{ width:100%; margin-bottom: 8vw; position:relative;}
.top_main img{ width:100%;}


.top_main h2{ position:absolute; top: 5.7vw; left:6vw; width: 42vw; z-index:80; opacity:0; margin-top: 48px;}
.top_main .top_cast{ position: relative; top: -3px; right: 0; margin-left:auto; width: 53vw; z-index:70; opacity:0;}




.top_main .modal_pop{ position: absolute; width: 42vw; top: 39vw; left: 6vw; z-index: 90; opacity: 0; margin-top: 48px;}
.pop_box{ background-color: #fff; padding: 3vw 4vw 2vw; color: #000; text-align: left; border: 10px solid #284150; background-image:url(../images/foot_bg.jpg); background-repeat:no-repeat; background-size:contain; background-position:center;}
.pop_box h3{ text-align: center; font-size: 20px; font-weight: bold; line-height: 1.5em; margin-bottom: 20px;}
.pop_box .txt_box{ margin-bottom: 40px;}
.pop_box .txt_box p{ font-size: 16px; line-height: 1.9em; font-weight: 400;}
.pop_box .txt_box p span{}
.pop_box .comment_box{ border: 1px solid #1a7cad; padding: 30px; background-color:#fff; margin-bottom: 20px;}
.pop_box .comment_box h4{ font-size: 20px; line-height: 1.5em; margin-bottom: 20px;}
.pop_box .comment_box p{ font-size: 16px; line-height: 2em; font-weight: 400;}

.pop_box .cast_com{ margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #ccc;}
.pop_box .cast_com.first{ border-top: 1px solid #ccc; padding-top: 20px;}
.pop_box .cast_com dl{ float:left; width:64%; padding-right: 20px;}
.pop_box .cast_com dt{ font-size: 18px; line-height: 1.5em; font-weight: bold; margin-bottom: 16px;}
.pop_box .cast_com dt span{ display: block; font-size: 0.8em; line-height: 1em; margin-bottom: 5px;}
.pop_box .cast_com dd{}
.pop_box .cast_com dd p{ font-size: 14px; line-height: 1.5em;}
.pop_box .cast_com figure{ float:right; width:36%;}
.pop_box .cast_com figure img{ width:100%;}

.pop_box .cast_com.img_n dl{ width: 100%; float: none; padding-right: 0;}



html[lang*="ja"] .pop_box .cast_com dt:lang(ja){ display:block;}
html[lang*="ja"] .pop_box .cast_com dt:lang(en){ display:none;}

html[lang*="en"] .pop_box .cast_com dt:lang(ja){ display:none;}
html[lang*="en"] .pop_box .cast_com dt:lang(en){ display:block;}

html[lang*="zh-CN"] .pop_box .cast_com dt:lang(ja){ display:none;}
html[lang*="zh-CN"] .pop_box .cast_com dt:lang(en){ display:block;}

html[lang*="zh-TW"] .pop_box .cast_com dt:lang(ja){ display:none;}
html[lang*="zh-TW"] .pop_box .cast_com dt:lang(en){ display:block;}



.movie_wrap{ width: 100%; margin: 0 auto;}
.movie_wrap .iframe_box{ position: relative; height: 0px; width: 100%; padding-bottom: 56.25%;}
.movie_wrap .iframe_box iframe{ width: 100%; height: 100%; position: absolute; top: 0; left: 0;}



/* アニメーション */
.intro_loader{ overflow:hidden; height:100vh;}
.loader_bg{ background-color:#000; width:50%; height:100vh; position:absolute; top:0; z-index: 1000;}
.loader_bg.left{ left:0;}
.loader_bg.right{ right:0;}
.loader{background-image:url(../images/main_logo.svg);background-repeat : no-repeat; background-size:16%; background-position : 50% 50%; z-index:9999; position:absolute; top:0; left:0; width: 100%; height: 100vh; opacity:0; animation: anime_loader 0.4s;  animation-fill-mode:both;}

#news{ opacity:0;}


@keyframes anime_loader {
0%  { opacity:0;}
100%  { opacity:1;}
}
.intro_r_fo .loader{ animation-fill-mode: inherit;}

.intro00{}
.intro00 .loader_bg{ transition: 0.5s ease-out; width:0;}
.intro00 main{ left:0; transition: 0.4s ease-out; opacity:1;}

.intro01{}
.intro01 h2{ animation: anime_fade 1s; animation-delay:1s; opacity:0; animation-fill-mode: both;}
.intro01 .top_cast{ animation: anime_fade 1s; animation-delay:0.3s; opacity:0; animation-fill-mode: both;}
.intro01 #news{ animation: anime_fade 1s; animation-delay:1.7s; opacity:0; animation-fill-mode: both;}
.intro01 header.top{ animation: anime_fade 1s; animation-delay:1.7s; opacity:0; animation-fill-mode: both;}
.intro01 .modal_pop{ animation: anime_fade 1s; animation-delay:1.7s; opacity:0; animation-fill-mode: both;}
@keyframes anime_fade {
0%  { opacity:0;}
100%  { opacity:1;}
}


.intro02{}
.intro02 .top_cast,
.intro02 h2,
.intro02 header.top,
.intro02 .modal_pop,
.intro02 #news{ opacity:1;}



.in .top_main{ height: 240px; margin-bottom: 100px;}
.in .top_main h2{ width:100%; position: absolute; top: 50%; left: 50%; transform: translateX(-50%); opacity:1;}
.in .top_main h2 img{ width: auto; height: 70px !important;}

.in .top_main.tickets{ height: inherit; margin-bottom: 80px;}
.in .top_main.tickets h2{ position: relative;}


.twt_area iframe{ height:350px!important;}


.mainvisual{ display:table; overflow:hidden; width:100%;}
.mainvisual figure{  display:table-cell; line-height:0; max-height:90vh; max-width:50%; background-color:#3485c5;}
.mainvisual img{ max-height:90vh; max-width:100%; }
.mainvisual .txtarea{  width:50%; padding:3%; display:table-cell; vertical-align:middle;}

.mainvisual h2{ font-size:24px; margin-bottom:25px; font-weight:bold;}
.mainvisual h3{ font-size:18px; line-height:1em; font-weight:bold;}
.mainvisual h3:after{content:"."; font-size:0; line-height:0; border-bottom:1px solid #003366; display:block; width:36px; padding-top:15px; margin:0 auto 15px;}
.mainvisual .txt{ font-size:16px; line-height:1.6em; text-align:left;}


@keyframes anime_chika_sp {
0%  { opacity:0; /*right:5vw;*/ transform:translateX(20px); -webkit-transform:translateX(20px);}
100%  { opacity:1; /*right:9vw;*/ transform:translateX(0); -webkit-transform:translateX(0);}
}
@keyframes anime_satowa_sp {
0%  { opacity:0; /*left:-10vw;*/ transform:translateX(-20px); -webkit-transform:translateX(-20px);}
100%  { opacity:1; /*left:-14vw;*/ transform:translateX(0); -webkit-transform:translateX(0);}
}
@keyframes anime_takezou_sp {
0%  { opacity:0; /*right:-4vw;*/ transform:translateX(20px); -webkit-transform:translateX(20px);}
100%  { opacity:1; /*right:0vw;*/ transform:translateX(0); -webkit-transform:translateX(0);}
}

@media only screen and (max-width: 768px){
.loader{ background-size:40%;}

.top_main h2{ top: -23vw; width: 82%; position: inherit; margin: 0 auto; left: 0;}
.top_main .top_cast{ top: 10px; left: 5%; right: inherit; margin-left: inherit; width: 90%;}

.top_main .modal_pop{ top: 174vw; left: 4%; width: 92%; margin-top: 0;}

.pop_box{ border: 4px solid #284150; padding: 20px 12px;}
.pop_box h3{ text-align:left; font-size:17px; margin-bottom: 20px;}
.pop_box .txt_box{ margin-bottom: 24px;}
.pop_box .txt_box p{ font-size: 14px; line-height: 1.6em;}
.pop_box .comment_box{ padding: 12px; margin-bottom:12px;}
.pop_box .comment_box h4{ font-size:16px; font-weight:bold; margin-bottom:12px;}
.pop_box .comment_box p{ font-size: 14px; line-height: 1.7em;}

.pop_box .cast_com{ margin-bottom:20px; padding-bottom:12px;}
.pop_box .cast_com.first{ border-top: 1px solid #ccc; padding-top: 16px;}
.pop_box .cast_com dl{ float:none; width:100%; padding-right: 0;}
.pop_box .cast_com dt{ font-size: 16px; line-height: 1.5em; font-weight: bold; margin-bottom: 16px;}
.pop_box .cast_com dt span{ font-size: 0.7em; margin-bottom: 5px;}
.pop_box .cast_com dd{}
.pop_box .cast_com dd p{ font-size: 13px; line-height: 1.4em;}
.pop_box .cast_com figure{ float:none; width:100%;}


main{ height:100%;}
.top_main{ margin-top:0; margin-bottom: 0px;}
.top_main h1{ width: 88%; float: none; padding-left: 0; padding-top: 28px; margin: 0 auto 0;}
.top_main p.catch{ position: relative; width: 90%; float: none; right: inherit; top: inherit; margin: 62vw auto 4vw;}

.top_main .border_gear.top{ top:0;}
.top_main .main_bnr{  top:43vw;width:38vw; animation-delay:1.5s;}

.top_main .border_gear .main_bnr{ top: -4vw; left: 7vw; width: 39vw;}


.in .top_main{ margin-bottom:20px; margin-top: 42px; height: 50vw;}
.in .top_main h1{ width:76%; padding:26px 0 0; }
.in .top_main h2{ margin-top:0;}
.in .top_main h2 img{ height: 32px !important;}

.in .top_main.tickets{ margin-top: 0; margin-bottom: 60px;}
.in .top_main.tickets h2{ margin: 0;}

.in h3{ line-height:1em;}
.in h3 img{ max-height:20vw;}
.in h3.cast{ text-align:left;}




.twt_area iframe{ height:250px!important; width:94vw !important;}

.mainvisual{ display:inherit;}
.mainvisual figure{ display:inherit; max-width:100%; max-height: inherit;width:100%; margin-bottom:10px;}
.mainvisual img{ max-height: inherit; max-width:100%; }
.mainvisual .txtarea{  width:100%; padding:3%; display:inherit; }

.mainvisual h2{ font-size:20px; margin-bottom:15px; }
.mainvisual h3{ font-size:16px; line-height:1em;}
.mainvisual h3:after{content:"."; font-size:0; line-height:0; border-bottom:1px solid #003366; display:block; width:36px; padding-top:10px; margin:0 auto 10px;}
.mainvisual .txt{ font-size:14px; line-height:1.6em; text-align:left;}

}




#news{ margin-top:-12vw;  text-align:left; position:relative; padding:0 0 6vw 0; z-index: 80;}
#news .container{ display:table;}
#news .skew{}
#news h3{ margin-bottom:36px; text-align:left;}
#news h3 img{ width:auto;}
#news .block{ display:table-cell; vertical-align:top; }

#news .news_area{ padding-right:5%; width:46%;}
#news .news_area .top_a{ display:block; transition:0.2s;}
#news .news_area .top_a:hover{ background-color:rgba(255,255,255,0.1); transition:0.2s;}
#news .news_area dl{ padding: 12px; border-bottom: 1px solid #ccc;}
#news .news_area dt{ font-weight:bold; position:relative; padding-left:5.5em; font-size:18px; line-height:1.4em; margin-bottom:0; color:#fff;}
#news .news_area dt span{ display:block; width:6.4em; letter-spacing:0.02em; text-align:left; position:absolute; left:0; top:0; font-size:16px; color: #f8d71f;}
#news .news_area dd{ color: #fff; font-size: 14px; font-weight: 400; line-height: 1.5em;}
#news .news_area dl a{ color:#011a29; transition:0.3s; display:block;}
#news .news_area dd a:hover,
#news .news_area dt a:hover{ color:#1976a5; transition:0.3s;}

#news .twt_area{ width:36%;}

#news .news_more{ text-align: center; width: 100%; display: block; padding: 6px 18px; color: #fff; margin: 12px auto 0; font-size: 16px; font-weight: bold; transition: all 0.3s; border: 1px solid #fff;}


html[lang*="ja"] #news .news_area dd:lang(ja){ display:none;}
html[lang*="en"] #news .news_area dd:lang(ja){ display:none;}



@media only screen and (max-width: 768px){
#news{ display:inherit; padding:0 0 8vw 0; margin-top:0;}
#news .block{ display:inherit; width:100%;} 

#news h3{ margin-bottom:14px;}
#news h3 img{ height: 8vw !important;}

#news .news_more:before{ width: calc(100% - 80px);}

#news .news_area{ padding-right:0;}
#news .news_area dl{ padding: 12px 0;}
#news .news_area dt{ padding-left:0; font-size:16px; line-height:1.3em; margin-bottom:5px;}
#news .news_area dt span{ position:relative; margin-bottom: 4px; text-align: left;}
#news .news_area dd{ font-size:13px; line-height:1.4em;}

#news .news_more{ margin-bottom: 20px; padding: 5px 20px; font-size: 15px;}
}




.cs{ padding:100px 0 200px; width:50%;}


@media only screen and (max-width: 768px){
.cs{ padding:100px 0; width:70%;}
}

/********************** NEWS *******************************/
#news_in{ width:95%; max-width:1000px; margin:0 auto 3vw; text-align:left; position:relative; }
#news_in h3{ margin-bottom:20px}

#news_in .news_area{ width:100%; margin-bottom:100px;}
#news_in .news_area dl{ border-bottom:1px solid #ccc; padding: 16px; margin-bottom: 0;}
#news_in .news_area dt{ font-weight:bold; position:relative; padding-left:6.5em; font-size:18px; line-height:1.4em; margin-bottom:0px; color: #fff;}
#news_in .news_area dt span{ display:block; color: #f8d71f; width: 6.4em; letter-spacing: 0.02em; text-align: left; position: absolute; left: 0; top: 2px;}
#news_in .news_area dd{ color: #fff; font-size: 14px; line-height: 1.5em;}
#news_in .news_area a{ color:#1a7cad;}
#news_in .news_area a{ color:#f00; font-weight: bold; display:block; transition:0.2s;}
#news_in .news_area a:hover{ background-color:rgba(255,255,255,0.1); transition:0.2s;}

#news_in .twt_area{ border:1px solid #2cabd4; border-radius:5px;width:36%;}
#news_in .twt_area h2{ background-color:#2cabd4; color:#fff; padding:0 20px; font-size:26px;}

html[lang*="ja"] #news_in .news_area dd:lang(ja){ display:none;}
html[lang*="en"] #news_in .news_area dd:lang(ja){ display:none;}

.pagination {
	clear: both;
	padding: 20px 0;
	position: relative;
	font-size: 14px;
	line-height: 14px;
        text-align: center;
}
.pagination-box {
	display: inline-block;
}
.pagination span, .pagination a {
	display: block;
	float: left;
	margin: 2px 2px 2px 0;
	padding: 10px 15px 10px 15px;
	text-decoration: none;
	width: auto;
	color: #fff; /* 文字色 */
	background: #2cabd4; /* 背景色 */
}
.pagination a:hover{
	color: #2cabd4; /* マウスホバー時の文字色 */
	background: #fff; /* マウスホバー時の背景色 */
}
.pagination .current{
	padding: 10px 15px 10px 15px;
	/*background: #F9D635; /* 現在のページの文字色 */
	/*color: #47BEA0; /* 現在のページの背景色 */
}
@media only screen and (max-width: 413px) {
.pagination {
	font-size: 12px;
	line-height: 12px;
}
.pagination span, .pagination a {
	padding: 8px 10px 8px 10px;
}
.pagination .current{
	padding: 8px 10px 8px 10px;
}
}


@media only screen and (max-width: 768px){
#news_in{ width:100%;}
#news_in h2{ margin-bottom:5px}
#news_in .news_area{ margin-bottom:25px;}
#news_in .news_area dl{ padding: 12px 0;}
#news_in .news_area dt{ padding-left:0; font-size:16px; line-height:1.3em; margin-bottom:0;}
#news_in .news_area dt span{  width:6.4em; letter-spacing:0.02em; position:relative; left:0; top:0; font-size:16px; margin-bottom:8px;}
}

/********************** NEWS_SINGLE *******************************/
#news_in .news_single{ width:74%; float: left; margin-bottom:20px}
#news_in .news_single dl{ border-bottom:1px solid #bfa517; padding-bottom:18px; margin-bottom:15px;}
#news_in .news_single dt{ font-weight:bold; position:relative; padding-left:6.5em; font-size:18px; line-height:1.4em; color:#fff; border-bottom: 1px solid #bfa517; padding-bottom: 18px; margin-bottom: 18px;}
#news_in .news_single dt span{ display: block; color: #f8d71f; width: 6.4em; letter-spacing: 0.02em; text-align: left; position: absolute; left: 0; top: 0;}
#news_in .news_single dd{}
#news_in .news_single a{ color:#bfa517;}

#news_in .news_single p{ font-size: 15px; line-height: 1.7em; margin-bottom:1em;}
#news_in .news_single .single_bottom{ width: 100%; text-align: center; font-size: 15px;}
#news_in .news_single .single_bottom a{ margin: 0 5px; border: 1px solid #bfa517; padding: 6px 20px; transition: all 0.5s; display:inline-block}
#news_in .news_single .single_bottom a:hover{ opacity:0.8;}
#news_in .news_single .single_bottom a:nth-child(3n){ margin: 0; }

#news_in .side_bar{ width: 23%; float: right; }
#news_in .side_bar h3{ font-size: 18px; font-weight: 600; background-color: #bfa517; color: #fff; text-align: center; padding: 10px 0; margin-bottom: 14px;}
#news_in .side_bar dl{ margin-bottom: 14px; padding-bottom: 13px; border-bottom: 1px solid #bfa517;}
#news_in .side_bar dt{ color:#f8d71f; font-size: 14px; line-height: 1.3em; font-weight: bold; }
#news_in .side_bar dd{ color:#fff; font-size: 13px; line-height: 1.5em;}
#news_in .side_bar a{ color:#bfa517;}
#news_in .side_bar a.news_more{ text-align:center; display:block; border: 1px solid #bfa517; padding: 6px 0;}
#news_in .side_bar a.news_more:hover{ opacity:0.8;}


html[lang*="ja"] #news_in .news_single p span:lang(ja){ display: inline-block;}
html[lang*="ja"] #news_in .news_single p span:lang(en){ display:none;}

html[lang*="en"] #news_in .news_single p span:lang(ja){ display:none;}
html[lang*="en"] #news_in .news_single p span:lang(en){ display: inline-block;}


@media only screen and (max-width: 768px){
#news_in .news_single{ width:100%; float: none;}
#news_in .side_bar{ float:none; width:100%; margin-bottom:20px;}
#news_in .side_bar dl{ margin-bottom:10px; padding-bottom:10px;}

#news_in .news_single dl{ padding-bottom:10px; margin-bottom:10px;}
#news_in .news_single dt{ padding-left:0; font-size:16px; line-height:1.3em; margin-bottom:10px; padding-bottom: 6px;}
#news_in .news_single dt span{  width:6.4em; letter-spacing:0.02em; position:relative; left:0; top:0; font-size:16px; margin-bottom:8px;}

#news_in .news_single .single_bottom{ margin-bottom:30px;}
}


/********************** ABOUT *******************************/
#about,
#story{ margin-bottom:120px;}

#about h3,
#story h3{ width: 18%; margin: 0 auto 12px;}
#about h3 img,
#story h3 img{ width:100%;}
#about p,
#story p{ font-size: 20px; font-weight: 400; line-height: 2em; margin-bottom: 40px;}

@media only screen and (max-width: 768px){
#about{ margin-bottom:60px;}
#story{ margin-bottom:0;}

#about,
#story{ font-size:16px; font-weight:bold; line-height:1.7em;}
#about h3,
#story h3{ width: 28%; margin: 0 auto 12px 0;}
#about p, 
#story p{ font-size: 15px; line-height: 1.5em; margin-bottom: 20px; text-align: left;}
#story p.strong{ font-size:16px;}
#story p.strong span{ font-size:32px;}

#story .story_wrap .txt{ float: none;  font-size: 16px; line-height: 1.7em; width:100%; margin-bottom: 24px; padding-right: 0;}

}


/********************** CAST&STAFF *******************************/
.container.cast{ max-width:inherit;}

#cast{ padding-bottom:140px;font-size:20px; line-height:1.6em;}
#cast h3{ width: 11%; max-width: 104px; margin: 0 auto 26px;}
#cast h3 img{ width:100%;}

#cast .cast_wrap{ margin-bottom: 140px;}
#cast .cast_list{ margin-bottom: 4em;}
#cast .cast_list li,
#cast .cast_list.sub li{ display: inline-block; vertical-align: top; width: 30.1%; margin: 0 1%;}
#cast .cast_list.sub li{ width: 23%;}
#cast .cast_list li figure{ width:100%; line-height: 0; margin-bottom: 16px; padding:8px; border:1px solid #fff; position:relative;}
#cast .cast_list li figure:hover img{ transform:translateX(-50%); transition: 0.2s ease;}
#cast .cast_list li figure div{ overflow:hidden;}
#cast .cast_list li img{ width:200%; transition: 0.2s ease;}
#cast .cast_list li h4{ font-size:18px; line-height:1em; color: #fff; padding: 0.4em 0 0.6em;}
#cast .cast_list li h4 span{ display:block; color: #f8d71f; font-size:0.9em; font-weight: bold; line-height:1em; margin-bottom:0.5em;}



html[lang*="ja"] #cast .cast_list li h4:lang(ja),
html[lang*="ja"] #cast .staff_wrap p:lang(ja){ display:block;}
html[lang*="ja"] #cast .cast_list li h4:lang(en),
html[lang*="ja"] #cast .staff_wrap p:lang(en){ display:none;}

html[lang*="en"] #cast .cast_list li h4:lang(ja),
html[lang*="en"] #cast .staff_wrap p:lang(ja){ display:none;}
html[lang*="en"] #cast .cast_list li h4:lang(en),
html[lang*="en"] #cast .staff_wrap p:lang(en){ display:block;}

html[lang*="zh-CN"] #cast .cast_list li h4:lang(ja),
html[lang*="zh-CN"] #cast .staff_wrap p:lang(ja){ display:none;}
html[lang*="zh-CN"] #cast .cast_list li h4:lang(en),
html[lang*="zh-CN"] #cast .staff_wrap p:lang(en){ display:block;}
html[lang*="zh-TW"] #cast .cast_list li h4:lang(ja),
html[lang*="zh-TW"] #cast .staff_wrap p:lang(ja){ display:none;}
html[lang*="zh-TW"] #cast .cast_list li h4:lang(en),
html[lang*="zh-TW"] #cast .staff_wrap p:lang(en){ display:block;}



#cast .cast_list li.parts figure:before,
#cast .cast_list li.parts figure:after{ content:""; position:absolute; background-size:contain; background-repeat:no-repeat; width: 100%; z-index: 50;}
#cast .cast_list li.parts figure:before{ background-image:url(../images/cast_before.png); height: 30.4%; top: -12px; left: -12px;}
#cast .cast_list li.parts figure:after{ background-image:url(../images/cast_after.png); height: 23%; bottom: -13.6px; right: -16px; background-position: right;}

#cast .cast_list li.single figure img{ width:100%; transition:none;}
#cast .cast_list li.single figure:hover img{ transform:none; transition:none;}

#cast .other{ border-top: 1px solid #f8d71f; padding-top: 30px; max-width: 700px; width: 100%; margin: 0 auto;}
#cast .other p{ font-size: 16px; margin-bottom: 8px; line-height: 2em;}
#cast .other p span{ color: #f8d71f; margin-right: 1em;}

#cast .cast_list_txt{ margin-bottom:2em;}
#cast .cast_list_txt.last{ margin-bottom:100px;}
#cast .cast_list_txt dl{ display:table; width: 100%; margin: 0 auto 0.5em;}
#cast .cast_list_txt dt{ display:table-cell; text-align: right; width: 50%; font-size: 18px;padding-right: 20px;}
#cast .cast_list_txt dd{ display:table-cell; width: 50%; text-align: left;  font-size: 18px;}

#cast .staff_wrap{ margin: 0 auto 30px;}
#cast .staff_wrap p{ font-size: 16px; line-height:1.5em; margin-bottom: 8px;}
#cast .staff_wrap span{ color:#f8d71f; font-size:15px; display: inline-block; margin-right: 3px; }


#cast .cast_list.ver2 li{ width: 22%;}

#cast .sub_character{ line-height:2em;}
#cast .sub_character .sname{color: #f8d71f; font-size:0.8em;}


@media only screen and (max-width: 768px){
#cast{ padding-bottom: 20px;}
#cast h3{ width: 50%; margin: 0 auto 26px;}
#cast p{ font-size:16px;}
#cast p span{ font-size:16px;}

#cast .cast_wrap{ margin-bottom: 80px;}
#cast .cast_list{ margin-bottom: 12px;}
#cast .cast_list li{ float: none; width: 80%; margin: 0 auto 16px; margin-right: auto;}
#cast .cast_list li figure{ margin-bottom:12px;}
#cast .cast_list li figure:hover img{ transform: inherit;}
#cast .cast_list li img{ width:100%;}
#cast .cast_list li h4{ font-size:18px; font-weight:bold; padding:0.4em 0;}

#cast .cast_list.sub{ font-size:0;}
#cast .cast_list.sub li{ width:42%; display:inline-block;}
#cast .cast_list.sub li img{ width:200%;}
#cast .cast_list.sub li:nth-child(2n){ margin-left:2%;}

#cast .other{ padding-top:20px;}
#cast .other p{ font-size: 14px; margin-bottom: 16px;}

#cast .cast_list_txt{ margin-bottom:1em;}
#cast .cast_list_txt.last{ margin-bottom:100px;}
#cast .cast_list_txt dl{ display:block; margin: 0 auto; text-align:left; line-height: 1.3em;}
#cast .cast_list_txt dt{ display:inline; text-align: left; width: inherit; font-size: 14px;  padding-right:0;}
#cast .cast_list_txt dd{ display:inline; width: inherit; font-size: 14px;}

#cast .staff_wrap{}
#cast .staff_wrap p{ font-size: 14px; line-height: 1.5em; position: relative; margin-bottom: 6px;}
#cast .staff_wrap span{ font-size: 14px;}


#cast .cast_list.ver2 li{ width: 44%; margin: 0 2% 16px;}
}

/********************** SCHEDULE *******************************/

#schedule{}
#schedule .sc_block{ margin-bottom: 120px;}
#schedule .all_date{}
#schedule .all_date .strong{}

#schedule .venue{ font-size:20px; line-height:1.4em; margin-bottom:30px;}
#schedule .place{ color: #f8d71f; font-size: 42px; font-weight: bold; line-height: 1em; margin-bottom: 30px;}
#schedule .datetit{ font-size:36px; line-height:1.5em; margin-bottom:0.5em; font-weight:bold; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN",  serif; }
#schedule .datetit strong{ font-size:1.8em;}
#schedule .datetit .venue{ font-size: 1.5em;}
#schedule .map{ display:inline-block; background-color:#bfa517; color:#fff; margin-left:15px; padding:4px 0; width: 130px; transition:0.2s; font-size: 15px; position:relative; top:-3px;}
#schedule .map:hover{ background-color:#a07349; transition:0.2s;}
#schedule .bar{ margin-bottom:16px;}
#schedule .bar img{ max-width: 735px; width: 100%;}

.schedule_table { position:relative; width: 80%; margin: 0 auto 70px;}

.calendar01{ width:100%;  font-size:18px; line-height:1em; table-layout:fixed; }
.calendar01 th	{text-align: center; border: 1px solid #666; color:#fff; padding:10px 0; font-size: 16px; background-color:#000; }
.calendar01 th.wd{ width:12em; }
.calendar01 th.blue{ background-color:#0e4f7c;}
.calendar01 th.red{ background-color:#5d080b;}
.calendar01 td{ text-align: center; color:#fff; border: 1px solid #666; background-color:rgba(0,0,0,0.3); padding:15px 0; font-size: 16px;}
.calendar01 td.time{ background-color:#111; color:#fff;}
.calendar01 td:first-child	{ text-align: center;}
.calendar01.pc_only{ display:table; margin-bottom: 6px;}


html[lang*="ja"] #schedule .datetit:lang(ja){ display:block;}
html[lang*="ja"] #schedule .datetit:lang(en){ display:none;}

html[lang*="en"] #schedule .datetit:lang(ja){ display:none;}
html[lang*="en"] #schedule .datetit:lang(en){ display:block;}



html[lang*="ja"] .calendar01 tr.lang:lang(ja){ display: table-row;}
html[lang*="ja"] .calendar01 tr.lang:lang(en){ display:none;}

html[lang*="en"] .calendar01 tr.lang:lang(ja){ display:none;}
html[lang*="en"] .calendar01 tr.lang:lang(en){ display: table-row;}

@media only screen and (max-width: 768px) { 

#schedule{  margin:0 auto; padding-bottom:20px; }
#schedule .all_date{ margin-bottom:38px;}
#schedule .sc_block{ margin-bottom: 40px;}

#schedule .venue{ font-size: 12px; font-weight:bold; line-height: 1.4em; margin-bottom: 10px; text-align: left; position: relative;}
#schedule .place{ font-size: 32px; margin-bottom: 20px;}
#schedule .datetit{ font-size:20px;}
#schedule .map{ padding: 4px 15px; position: absolute; width: 20%; right: 0; top: 50%; transform: translateY(-50%); text-align:center; font-size: 12px;}

.schedule_table{ margin: 0 auto 30px; width: 100%;}

.calendar01{ border-collapse: separate; font-size: 14px;}
.calendar01 th.wd{ width:5em; }
.calendar01 th{padding:8px 0; font-size: 13px;}
.calendar01 td{ padding:5px 0; font-size:12px;}
.calendar01 td img{ max-width: 18px;}
.calendar01.sp_only{ display:table; margin-bottom: 4px;}

html[lang*="ja"] .calendar01 th:lang(ja){ display: table-cell;}
html[lang*="ja"] .calendar01 th:lang(en){ display:none;}

html[lang*="en"] .calendar01 th:lang(ja){ display:none;}
html[lang*="en"] .calendar01 th:lang(en){ display: table-cell;}
}

#tickets{ /*margin-bottom: 120px;*/ margin-bottom:0;}
#tickets p.cs{ font-size:24px;}

#tickets .price{ max-width:720px; width:100%; margin:0 auto 20px;}
#tickets .price p{ font-size: 18px; line-height: 1.5em; padding-top: 12px;}

#tickets .info_box{ text-align:left; max-width: 720px; margin: 0 auto 80px; width:100%;font-size: 16px; line-height: 1.5em; border: 1px solid #ccc; padding: 20px 20px 10px;}


#tickets dl{ display:table; width:100%; font-size:24px; font-weight:bold; text-align:left; border-bottom: 1px solid #ccc; padding: 20px 0;}
#tickets dt{ display:table-cell; vertical-align:text-top; width:40%; padding-left: 40px;}
#tickets dd{ display:table-cell; vertical-align:text-top; font-size:42px;}
#tickets dd span{ font-size: 0.4em;}

#tickets .playguide{ text-align:left; margin-bottom:80px;}
#tickets .playguide li{ position:relative; margin-bottom: 60px; padding-right: 33%;}
#tickets .playguide li h3{ font-size:28px; font-weight:bold; line-height:1.1em; margin-bottom:18px; color:#f8d71f;}
#tickets .playguide li h3 span{ font-size: 22px; color:#000;}
#tickets .playguide li .date_detail{}
#tickets .playguide li .start{ font-size:26px; line-height:1.7em; font-weight:bold; margin-bottom:25px;}
#tickets .playguide li .start strong{ font-size:2em;}
#tickets .playguide li .start span{ font-size:1.5em;}
#tickets .playguide li .end{ font-size:16px; line-height:1.5em; margin-bottom:20px;}
#tickets .playguide li .ticket_link a{ display: block; background-color: #bfa517; color: #fff; font-weight: bold; font-size: 16px; padding: 25px 0; line-height: 1em; width: 30%; position: absolute; text-align: center; top: calc(50% - 33px); right: 0;}
#tickets .playguide li .ticket_link a:hover{ opacity:0.8;}
#tickets .playguide li .ticket_link a:after{ content:"\025b6"; position: absolute; right: 10px; font-size: 10px;}

html[lang*="ja"] #tickets .playguide li .start:lang(ja){ display:block;}
html[lang*="ja"] #tickets .playguide li .start:lang(en){ display:none;}

html[lang*="en"] #tickets .playguide li .start:lang(ja){ display:none;}
html[lang*="en"] #tickets .playguide li .start:lang(en){ display:block;}

/* プレイガイド四種 */
#tickets .playguide li.four{ padding-right: 0;}
#tickets .playguide li.four h4{}
#tickets .playguide li.four .ticket_link ul{}
#tickets .playguide li.four .ticket_link li{ width: 24%; float: left; margin-right: 1.33%; margin-bottom: 0; padding-right: 0; transition: 0.2s ease;}
#tickets .playguide li.four .ticket_link li:hover{ box-shadow: 0px 4px 23px -15px; transform: translateY(-2px); transition: 0.2s ease;}
#tickets .playguide li.four .ticket_link li:nth-child(4n){ margin-right:0;}
#tickets .playguide li.four .ticket_link li a{ position: relative; top: inherit; right: inherit; width: 100%; padding: 16px 12px; transition: 0.2s ease;}
#tickets .playguide li.four .ticket_link li a:hover{ opacity:1; background-color:#d6b91b; transition: 0.2s ease;}
#tickets .playguide li.four .ticket_link li h4{ margin-bottom: 14px; font-size: 16px; font-weight: bold; line-height: 1.5em;}
#tickets .playguide li.four .ticket_link li p{ background-color: #fff; color: #000; font-size: 14px; font-weight: bold; padding: 3px 0; line-height: 1.5em; margin-bottom: 0; position:relative;}
#tickets .playguide li.four .ticket_link li p:after{ content: "\025b6"; position: absolute; right: 10px; font-size: 10px; color:#000;}
#tickets .playguide li.four .ticket_link a:after{ display:none;}

/* プレイガイド四種以上 */
#tickets .playguide li.four.plus .ticket_link{ text-align:center;}
#tickets .playguide li.four.plus .ticket_link li{ float: none; width: 32%; display: inline-block; margin: 0 0.4% 1.2%;}

/* プレイガイド四種以上 二行 */
#tickets .playguide li.four .ticket_link li.two{}
#tickets .playguide li.four .ticket_link li.two a{ padding: 20px 12px 16px;}
#tickets .playguide li.four .ticket_link li.two h4{ margin-bottom: 14px; line-height: 1.2em;}
#tickets .playguide li.four .ticket_link li.two h4 span{ font-size: 14px;}

/* 受付前 */
#tickets .playguide li.dis{ border:1px solid #ccc; font-size:0.8em; padding:20px 30px; margin-bottom:10px;}
#tickets .playguide li.dis .ticket_link a{ background-color: #eee; color: #999;}
#tickets .playguide li.dis .ticket_link a:hover{ cursor:inherit; opacity:1;}
#tickets .playguide li.dis h3,
#tickets .playguide li.dis p{ color: #999; font-size:22px; margin:0; line-height:1.5em;}
#tickets .playguide li.dis a:after{ display:none;}
#tickets .playguide li.dis .arrow{ right:30px;}

/* 受付終了 */
#tickets .playguide li.end{ border: 1px solid #555; padding: 14px 27% 10px 20px; width: 80%; margin: 20px auto 10px; background-color: rgba(0,0,0,0.3);}
#tickets .playguide li.end h3,
#tickets .playguide li.end p,
#tickets .playguide li.end p span{ font-size:18px; margin-bottom: 6px; color:#555; text-decoration: line-through;}
#tickets .playguide li.end h3 span{ font-size:14px; color:#555;}
#tickets .playguide li.end .start{ margin:0;}
#tickets .playguide li.end:after{ display:none;}
#tickets .playguide li.end .ticket_link a{ background-color: transparent; border: 1px solid #555; color:#555; right: 12px; padding: 18px; top: calc(50% - 27px);}
#tickets .playguide li.end .ticket_link a:hover{ cursor:inherit; opacity:1;}
#tickets .playguide li.end .ticket_link a:after{ display:none;}

#tickets .playguide li.end.four { padding: 14px 12px 10px 20px;}
#tickets .playguide li.end.four .ticket_link ul{ margin-top: 6px;}
#tickets .playguide li.end.four .ticket_link li:hover{ box-shadow: 0px 0 0 0; transform: translateY(0px);}
#tickets .playguide li.end.four .ticket_link li h4{ margin-bottom: 6px; font-size: 14px;}
#tickets .playguide li.end.four .ticket_link li a{ padding: 4px 8px 6px;}
#tickets .playguide li.end.four .ticket_link li a:hover{ cursor:inherit; opacity:1; background-color:transparent;}
#tickets .playguide li.end.four .ticket_link li p{ color: #555; font-size: 12px; border: 1px solid #555; padding: 2px; text-decoration: inherit; background-color: transparent;}
#tickets .playguide li.end.four .ticket_link li p:after{ display:none;}

#tickets #overseas{ padding-top: 60px; margin-top: -60px;}
#tickets .overseas{ background-color: #fff; color: #000; padding:40px 20px;}
#tickets .overseas h3{ color: #bfa517; font-size: 30px; font-weight: bold; line-height: 1.3em; margin-bottom: 24px;}
#tickets .overseas p{ font-size: 24px; font-weight: bold; line-height: 1.4em;}
#tickets .overseas a{ background-color: #bfa517; color: #fff; display: block; width: 70%; margin: 0 auto; padding: 20px 0; position: relative; transition: 0.2s ease;}
#tickets .overseas a:after{ content:"\025b6"; position: absolute; right: 10px; font-size: 10px;}
#tickets .overseas a:hover{ background-color:#d6b91b; transition: 0.2s ease;}

html[lang*="ja"] .overseas h3:lang(ja){ display: block;}
html[lang*="ja"] .overseas h3:lang(en){ display:none;}

html[lang*="en"] .overseas h3:lang(ja){ display:none;}
html[lang*="en"] .overseas h3:lang(en){ display: block;}

@media only screen and (max-width: 768px) { 
#tickets{ margin-bottom:30px;}

#tickets p.cs{ font-size:16px;}

#tickets .price{ max-width:100%; margin:0 auto 10px;}
#tickets dl{ font-size:18px; line-height:1.5em;  padding: 10px 4px; margin-bottom: 12px;}
#tickets dt{ width:7em; margin-bottom:5px; padding-left: 0; font-size: 17px;}
#tickets dd{ padding-left:0; text-align:right; font-size: 32px; line-height: 0.5em;}
#tickets dd span{}

#tickets .price p{ font-size: 14px; padding-top: 8px; text-align:left; }

#tickets .info_box{ margin-bottom:20px; font-size:14px; line-height:1.5em; padding: 12px 12px 0;}

#tickets .playguide li{ margin-bottom: 20px; padding-right: 0;}
#tickets .playguide li h3{ margin-bottom:10px; text-align:center; font-size:22px; }
#tickets .playguide li h3 span{ font-size: 13px;}
#tickets .playguide li .start{ font-size:16px; margin-bottom:6px; line-height: 1.8em;}
#tickets .playguide li .start strong{ font-size:2em;}
#tickets .playguide li .start span{ font-size:1.5em;}
#tickets .playguide li .end{ font-size:16px; line-height:1.5em; margin-bottom:20px;}
#tickets .playguide li .ticket_link a{ font-size: 14px; padding: 12px 0; line-height: 1em; width: 100%; position: relative; top: inherit; right: inherit;}
#tickets .playguide li .ticket_link a:hover{ opacity:0.8;}
#tickets .playguide li:after{ background-size:100%; bottom:-66px; left:inherit;}

/* プレイガイド四種 */
#tickets .playguide li.four .ticket_link li{width: 49%; margin-right: 2%; margin-bottom: 6px;}
#tickets .playguide li.four .ticket_link li:nth-child(2n){ margin-right:0;}
#tickets .playguide li.four .ticket_link li h4{ margin-bottom: 8px; font-size:13px;}
#tickets .playguide li.four .ticket_link li a{ padding: 10px 8px;}
#tickets .playguide li.four .ticket_link li p{ font-size: 12px; padding: 2px 0;}
#tickets .playguide li.four .ticket_link li p:after{ right: 6px; font-size: 8px;}

/* プレイガイド四種以上 */
#tickets .playguide li.four.plus .ticket_link li{ width: 48%; margin: 0 0.4% 1.8%;}

/* プレイガイド四種以上 二行 */
#tickets .playguide li.four .ticket_link li.two{ width: 76%;}
#tickets .playguide li.four .ticket_link li.two h4 span{ font-size: 12px;}


/* 受付前 */
#tickets .playguide{ margin-bottom:0; padding-bottom:20px;}
#tickets .playguide li .date_detail{ margin-bottom:0.5em;}
#tickets .playguide li.dis{ padding:10px; margin-bottom:10px;}
#tickets .playguide li.dis h3,
#tickets .playguide li.dis p{  font-size:14px; margin:0; line-height:1.5em;}
#tickets .playguide li.dis .arrow{ right:0px;}

/* 受付終了 */
#tickets .playguide li.end{ padding: 8px 12px 10px; margin: 8px auto 0; width: 100%;}
#tickets .playguide li.end h3,
#tickets .playguide li.end p,
#tickets .playguide li.end p span{ font-size:14px; margin-bottom: 5px; line-height:1.3em;}
#tickets .playguide li.end h3 span{ font-size:12px;}
#tickets .playguide li.end .start{ margin-bottom: 8px;}
#tickets .playguide li.end .ticket_link a{ right: inherit; padding: 6px; top: inherit; font-size: 12px;}

#tickets .playguide li.end.four { padding: 8px 12px 10px;}

#tickets #overseas{ padding-top: 46px; margin-top: -46px;}
#tickets .overseas{ padding: 20px 12px;}
#tickets .overseas h3{ font-size: 18px; margin-bottom:8px;}
#tickets .overseas p{ font-size: 16px;}
#tickets .overseas a{ width: 100%; padding: 8px 0; font-size: 14px;}
}



/****アフターイベント****/
.after_btn{ border: 2px solid #de2e12; background-color: #fff; display: block; width: 70%; margin: 0 auto 100px; padding: 14px 0; font-size: 20px; line-height: 1.4em; color: #de2e12; position: relative; transition:0.2s;}
.after_btn:after{ content: "\025b6"; position: absolute; right: 10px; font-size: 10px; top: calc(50% - 12px);}
.after_btn:hover{ opacity:0.8; color:#de2e12; transition:0.2s;}

.after_eve{ text-align: left; padding: 3vw 4vw 2vw; border:10px solid #1a7cad;}
.after_eve h4{ color: #1a7cad; font-size: 28px; font-weight: bold; line-height: 1.5em; text-align:center; margin-bottom: 12px;}
.after_eve .eve_box{ margin-bottom: 30px;}
.after_eve .eve_box h4{ padding-bottom: 4px; margin-bottom: 12px; color: #1a7cad; font-size: 20px; font-weight: bold; line-height: 1.5em;}
.after_eve .eve_box p{ font-size: 15px; line-height: 1.5em; padding-left: 16px;}

.after_eve .eve_box.day_cast{}
.after_eve .eve_box.day_cast h4{}
.after_eve .eve_box.day_cast p{ margin-bottom: 22px;}
.after_eve .eve_box.day_cast p strong{ font-size: 22px; display: inline-block; width: 5.4em;}
.after_eve .eve_box.day_cast p span{}
.after_eve .eve_box.day_cast p span.place{ background-color: #0e4f7c; color: #fff; display: inline-block; text-align: center; line-height: 1.5em; margin: 0 12px 6px 0 !important; padding: 2px 18px 0; position: relative; top: -2px;}
.after_eve .eve_box.day_cast p span.place.fukuoka{ background-color: #7c0e32;}
.after_eve .eve_box.day_cast p span.place.osaka{ background-color: #7c6e0e;}
.after_eve .eve_box.day_cast p span.cat{ margin-left: 16px; font-size: 21px;}
.after_eve .eve_box.day_cast p span.cast{ background-color: #eee; display: block; padding: 4px 12px;}

.after_eve .eve_box.info{}
.after_eve .eve_box.info h4{}
.after_eve .eve_box.info p{ font-size: 14px;}

.after_eve .eve_box.note{}
.after_eve .eve_box.note h4{}
.after_eve .eve_box.note p{ font-size: 14px;}

@media only screen and (max-width: 768px) {
.after_btn{ width: 100%; font-size: 16px; font-weight: bold; margin-bottom: 0;}

.after_eve{ border: 4px solid #1a7cad; padding: 20px 12px;}
.after_eve h4{ font-size: 20px;}
.after_eve .eve_box h4{ padding-bottom: 0; margin-bottom: 8px; font-size: 18px;}
.after_eve .eve_box p{ font-size: 14px; line-height: 1.4em; padding-left: 0;}

.after_eve .eve_box.day_cast p{ margin-bottom: 28px;}
.after_eve .eve_box.day_cast p strong{ font-size:18px;}
.after_eve .eve_box.day_cast p span.place{ padding: 2px 8px 0;}
.after_eve .eve_box.day_cast p span.cat{ margin-left: 0; font-size: 16px;}
.after_eve .eve_box.day_cast p span.cast{ position: relative; top: 4px;}

.after_eve .eve_box.info p{ font-size: 13px; font-weight: bold;}

.after_eve .eve_box.note p{ font-size: 13px; font-weight: bold;}
}




/********************** GOODS *******************************/
#goods{ /*width:95%; /*max-width:1000px;*/ margin:0 auto; text-align:center;}






/********************** GUIDE *******************************/
#guide{ /*width:95%; max-width:1000px;*/ margin:0 auto; text-align:center; }
#guide h2{ text-align:center;}
#guide h3{ padding:15px 0; font-weight:bold; font-size:20px; line-height:1.5em;}
#guide .guide_block{ border-bottom:1px solid #ccc; padding-bottom:10px; margin-bottom:10px;}
#guide .guide_block p{ padding-left: 14px; font-size: 15px; line-height: 1.5em; margin-bottom: 18px;}

@media only screen and (max-width: 768px) { 
#guide h3{ padding:5px 0 10px;}
#guide .guide_block{ padding-bottom:0;}
#guide .guide_block p{ padding-left: 0; font-size: 14px; margin-bottom: 12px;}
}



/********************** slick *******************************/
/*
.slick-slider{ margin:0; }

.slick-slide{padding:0;
-moz-transition: .2s; 
-webkit-transition: .2s; 
-o-transition: .2s; 
-ms-transition: .2s; 
transition: .2s;}

.slick-slide img{ 
-moz-transition: .2s; 
-webkit-transition: .2s; 
-o-transition: .2s; 
-ms-transition: .2s; 
transition: .2s;}

.slick-active{}
-moz-transition: .2s; 
-webkit-transition: .2s; 
-o-transition: .2s; 
-ms-transition: .2s; 
transition: .2s;}


.slick-dots{ bottom:30px;}
.slick-prev:before, .slick-next:before{ font-size:60px; color:#000;}
.slick-prev, .slick-next{ z-index:4;height: 60px;width: 60px;left:50%; margin-top: -30px;}
.slick-prev{ margin-left:-445px;}
.slick-next{ margin-left:385px;}
*/

/*lightbox*/

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box;}
/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{outline:none;}
   /* #cboxContent{margin-bottom:60px; overflow:visible;}*/
    #cboxContent{margin-right:60px; overflow:visible; margin-bottom:0;}
        .cboxIframe{background:#000;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#fff; position:relative; z-index:10000;}
        #cboxLoadingGraphic{background:url(../images/loading.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#fff;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
        #cboxSlideshow, #cboxClose{text-indent:-9999px; width:40px; height:100%; position:absolute; top:0;background:url(../images/controls.png) no-repeat 0 0;}
		
        #cboxClose{background-position:7px 0; right:-50px; border:0; outline:none;}
        #cboxClose:hover{background-position:-40px 0;}


@media screen and (max-width: 768px) {
#cboxContent{ margin-right:0; margin-bottom:50px;}
#cboxClose{ right:0; top:inherit; bottom:-35px; height: 22px;}
}