@charset "utf-8";.container{ width: 90%;max-width: 1200px;margin: 0 auto;}

.in_wrap{ line-height: 1.5em;}

.lead_head{ padding:0 0 3vw 0;padding: 100px 0 50px;position: relative;z-index: 5;}
.lead_head h1{ width:40%;margin: 0 auto 30px;}
.lead_head h1 img{ width:100%;}
.lead_head .lead{ font-weight: bold;margin-bottom: 1.5em;line-height: 1.7em;}
.lead_head .notice{ border: 2px solid #c00;padding: 20px;color: #c00;font-weight: bold;}  

article.in,
section.in{ background-color: #fff1f5;padding: 8vw 0;position: relative;overflow: hidden;}
article.in:before,
section.in:before{ content: "";display: block;width: 140px;height: 16px;background-image: url("../images/tw_icon.png");background-size: 100%;position: absolute;top: -6px;left: 50%;transform: translate(-50%,0);z-index: 2;}
article.in .container,
section.in .container{ position: relative;z-index: 5;word-break: break-all;}

.anime_bg:after{ display: block;content: "";position: absolute;top: 0px;left: 50%;animation: r1 60s linear infinite;background-image: url("../images/txt_bg.svg");background-size: contain;width: 94vw;height: 94vw; background-repeat: no-repeat; background-position: center;}

.btn_01{width: 45%;color: var(--keyc) !important;border: 2px solid var(--keyc);letter-spacing: 0.05em;line-height: 1.5em;padding: 18px 0;border-radius: 50px;position: relative;transition: 0.2s ease;display: block !important;text-align: center;margin: 0 auto 20px;font-weight: bold;text-decoration: none !important;margin-top: 40px;}
.btn_01:after{ border: 1px solid;border-color: transparent var(--keyc) var(--keyc) transparent;content: "";position: absolute;top: calc(50% - 4px);right: 1em;width: 5px;height: 5px;transform: rotate(-45deg);transition: 0.2s ease;}
.btn_01:hover{ opacity:0.8;;}
.btn_01:hover:after{right: 0.8em;transition: 0.2s ease;}

.btn_01.back{background-color: var(--keyc);color: #fff !important;}

.stit{ font-family: var(--font2);font-size: 36px;line-height: 1.5em;color: var(--keyc);letter-spacing: 0.1em; margin-bottom: 1em;}

.stit.jp{ letter-spacing: 0; font-size: 30px;}

@media only screen and (max-width: 768px){
    .lead_head{padding: 50px 0 20px;}
	.lead_head h1{ width: 100%;}
	.lead_head h1 img{width: 70%;}
    .lead_head .lead{ text-align: left;margin-bottom: 10px;}
    .lead_head .notice{ text-align: left;}
	
	article.in,
	section.in{ padding: 60px 0;}

	.stit{ font-size: 30px;}
	.btn_01{font-size: 14px;padding: 12px;min-width: inherit;width: 94%;margin-top: 20px;}
	
}




/********************** NEWS *******************************/
#news{ margin-bottom: 12vw;}
#news .stit{ margin-bottom: 0;}
.news_list{ }
.news_list ul{}

.news_list .news_date{ color: var(--keyc);}
.news_list li{ text-align: left;border-bottom: 1px dashed #b2b2b2;font-weight: bold;}
.news_list li a{ display: block;color: var(--keyc2);padding: 16px 0;}
.news_list li a:hover{ background-color: rgba(0,0,0,0.04);}
.news_list li span{ color: #a49d89;display: block;letter-spacing: 0.1em;margin-bottom: 2px;}

@media only screen and (max-width: 768px){
.news_list li a{ font-size: 14px;line-height: 1.5em;}
}

/* SINGLE PARTS */
.single{text-align:left;overflow:hidden;position:relative;opacity:1;padding: 0 0 40px;color: var(--keyc2);}
.single .tit{text-align: left;font-size: 20px;font-weight: bold;line-height: 1.4em;margin-bottom: 50px;opacity:1;}
.single .date{font-size: 16px;font-weight: bold;letter-spacing: 0.1em;line-height: 1.5em;margin-bottom: 8px;color: #a49d89;}
.single .date span{ display: inline-block;font-size: 10px;line-height: 1em;vertical-align: middle;padding: 3px 10px;margin-right: 4px;position: relative;top: -2px;}
.single .date span:first-child{ margin-left: 8px;margin-right: 0px;}
.single .date span.new{ background-color:#709ac1;color:#fff;}
.single .date span.tag{ background-color:var(--keyc2);color:#fff;}
.single .date span.postpone{ background-color:#fff;color:var(--keyc2);border:1px solid var(--keyc2);}
.single .date span.cancell{ background-color:var(--keyc2);color:#fff;}
.single .date span.tag a{ color:#fff;}
.single .date span.tag a:hover{ color: #7d7d7d;}

.single .txt_box{word-break: break-all;margin-bottom: 40px;}
.single .txt_box p{ font-size: 16px;line-height: 1.7em;margin-bottom: 1.5em;}
.single .txt_box .catch{ font-size: 18px;font-weight: bold;line-height: 1.5em;margin-bottom: 30px;}
.single .txt_box a{ color:#7d7d7d;text-decoration:underline;display: inline-block;margin-bottom:12px;}
.single .txt_box a:hover{ color:#ccc;}
.single .txt_box img{ max-width:100%;width:auto;height:auto;display: block;margin-bottom:24px;}

.single .txt_box h1,
.single .txt_box h2,
.single .txt_box h3,
.single .txt_box h4,
.single .txt_box h5{ font-weight: bold;line-height: 1.4em;margin-bottom: 12px;letter-spacing: 0;}
.single .txt_box h1{ font-size: 26px;}
.single .txt_box h2{ font-size: 24px;}
.single .txt_box h3{ font-size: 22px;}
.single .txt_box h4{ font-size: 20px;}
.single .txt_box h5{ font-size: 18px;}

.single .txt_box hr{ margin: 3em 0;height: 1px;background-color: #ccc;border: none;}

.single blockquote{  border:1px solid #ccc;padding: 3%;}

.single_bottom{ width: 100%;text-align: center;position: relative;}
.single_bottom a{margin: 0 5px;color: var(--keyc2);font-family:  var(--font2);letter-spacing: 0.1em;}
.single_bottom a:hover{ opacity:0.8;}
.single_bottom .prev-link,
.single_bottom .next-link{ font-size: 20px;position: absolute;top: 50%;left: 50%;}
.single_bottom .prev-link:after,
.single_bottom .next-link:after{ content:"";position: absolute;background-size: 10px;background-repeat: no-repeat;width: 10px;height:14px;top: 5px;transition: 0.2s ease;}
.single_bottom .prev-link{ transform: translate(-150px,-50%);}
.single_bottom .next-link{ transform: translate(100px,-50%);}
.single_bottom .prev-link:after{ background-image: url("../images/a_prev.png");left: -20px;}
.single_bottom .next-link:after{ background-image: url("../images/a_next.png");right: -16px;}
.single_bottom .prev-link:hover:after{ left: -24px;transition: 0.2s ease;}
.single_bottom .next-link:hover:after{ right: -20px;transition: 0.2s ease;}
.single_bottom .back_btn{font-size: 14px;display: block;background-color: #900;color: #fff;text-align: center;border-radius: 5px;padding: 0.7em 0;margin: 0;}
.single_bottom .back_btn:before{ content:"";position: absolute;background-image: url("../images/a_back.png");background-size: 14px;width: 14px;height:12px;top: 11px;left: 18px;}

.news_single .anime_bg{ opacity: 0.3;}

@media only screen and (max-width: 768px){
.single{padding: 0 0 8px;}
.single .tit{font-size: 16px;margin-bottom: 20px;}
.single .date{}
.single .txt_box{padding-bottom: 0;margin-bottom: 20px;}
.single .txt_box p{font-size: 16px;line-height: 1.6em;margin-bottom: 1.2em;}
.single .txt_box .catch{ font-size: 16px;line-height: 1.5em;}
.single .txt_box a{ font-size: 16px;}

.single .txt_box h1,
.single .txt_box h2,
.single .txt_box h3,
.single .txt_box h4,
.single .txt_box h5{ margin-bottom: 6px;}
.single .txt_box h1{ font-size: 24px;}
.single .txt_box h2{ font-size: 22px;}
.single .txt_box h3{ font-size: 20px;}
.single .txt_box h4{ font-size: 18px;}
.single .txt_box h5{ font-size: 16px;}

.single .txt_box hr{ margin: 2em 0;}

.single_bottom{margin-top: 0;}
.single_bottom .prev-link,
.single_bottom .next-link{ font-size: 14px;}
.single_bottom .prev-link{ transform: translate(-120px,-50%);}
.single_bottom .next-link{ transform: translate(80px,-50%);}
.single_bottom .prev-link:after, 
.single_bottom .next-link:after{ background-size: 8px;width: 8px;height: 12px;}
}


.paging{ text-align: right;}
.pagination {clear: both;padding: 20px 0;position: relative;font-size: 14px;line-height: 14px;text-align: center;display: inline-block;}
.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: var(--keyc);/* 文字色 */background: transparent;/* 背景色 */border: 1px solid var(--keyc);}
.pagination a:hover{color: #fff;background: var(--keyc);}
.pagination .current{padding: 10px 15px 10px 15px;background: var(--keyc);color: #fff;}

@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;}
}

/********************** SCHEDULE *******************************/
#schedule{ margin-bottom: 8vw;}
.schedule .date_txt{font-size: 26px;line-height: 1.7em;margin-bottom: 30px;}
.schedule .date_txt span{font-size: 1.7em;line-height: 1.5em;margin-bottom: 12px;}
.schedule .catch{ display: inline-block;background-color: #fff;font-size: 16px;font-weight: bold;line-height: 1.5em;padding: 25px 50px;border-radius: 5px;margin-bottom: 30px;width: 100%;}
.schedule .cast_part{ text-align: left;line-height: 1.7em;}
.schedule .cast_part h3{ font-weight: bold;line-height: 1.7em;margin-bottom: 1em;}
.schedule .cast_part p:last-of-type{ margin-bottom: 0;}

.demo01{width:100%;font-size:18px;line-height:1em;margin-bottom: 0;overflow: hidden;border-radius: 10px;border-spacing: 0;color: var(--keyc2);background-image: url("../images/sche_bg.png");border-collapse: collapse;margin-bottom: 20px;}

.demo01 tr{}
.demo01 tr:last-child td{ border-bottom-width: 0;}

.demo01 .sat{ background-color:rgba(30,175,230,0.15);}
.demo01 .sun{ background-color:rgba(230,80,135,0.15);}

.demo01 th{text-align: center;width: 3%;font-size: 14px;font-weight: 600;line-height:2em;padding: 10px 0;border-top-width: 0;border-color: #ccc;}
.demo01 td{text-align: center;padding:2% 2%;font-size:16px;line-height:1.5em;border-color: #ccc;}

.demo01 th.date{width: 20%;border-left-width: 0;}
.demo01 th.time{ width: 20%; }
.demo01 th.cast{ border-right-width: 0; width: 80%;}

.demo01 td.date{font-size: 20px;font-weight: bold;border-left-width: 0;}
.demo01 td.date span{ font-size: 0.7em;margin-left: 0.5em;}
.demo01 td.time{ font-size:20px;}
.demo01 td.cast{ text-align: left;}


.schedule .notice{ text-align: left;}
.schedule .notice h3{ font-weight: bold;border-bottom: 1px dashed #aaa;padding-bottom: 1em;margin-bottom: 1em;}
.schedule .notice ul{ margin-bottom:40px;}
.schedule .notice li{position: relative;padding-left: 1.5em;margin-bottom: 0.5em;}
.schedule .notice li:before{ content: "※";position: absolute;left: 0;top: 0;}
.schedule .note{text-align: left; margin: 0 0 2em; font-size: 14px; line-height: 1.7em;}
.schedule .container2{ width: 90%; margin: 0 auto; max-width: 1200px;}

@media only screen and (max-width: 768px){
	.schedule .notice{ text-align: left;width: 94%;margin: 0 auto;}	
	.schedule .notice h3{ padding-bottom: 0.5em;margin-bottom: 0.5em;}
	
    .schedule .container{ width: 100%;}
	
	.schedule .note{ font-size: 13px; line-height: 1.5em;}
	
    .schedule .date_txt{font-size:18px;line-height: 1.5em;margin-bottom: 20px;} 
    .schedule .catch{ padding: 10px;font-size: 14px;width: 94%;text-align: center;margin-bottom: 15px;}
    .demo01{ border-radius: 5px; margin-bottom: 10px;}
    
    .demo01 th{ font-size: 13px;line-height: 1.4em; padding: 2%;}
    .demo01 td{ font-size: 14px;line-height: 1.4em;}
    .demo01 td.date{ font-size: 16px;}
    .demo01 td.date span{ margin-left: 0;}
    .demo01 td.time{ font-size: 16px;}    
    .demo01 td.time p{ display: block;padding: 0;}
    .demo01 td.time .block{ position: inherit;transform: none;display: block;margin: 5px auto 0 auto;height: 5px;width: 50%;}
    
    .demo01 td.cast{ width: 36%;text-align: left;padding: 10px 3%;}
    .demo01 td.time .commentary{ margin-top: 5px;}
}

/********************** tokuten *******************************/
.tokuten{ text-align: left; border: 5px solid var(--keyc); padding: 3% 5%;}
.tokuten .sstit{ text-align: center; margin-bottom: 1em; color: var(--keyc); font-weight: bold; font-size: 20px; line-height: 1.5em;}
.tokuten .ssstit{  color: var(--keyc);  border-bottom: 1px solid var(--keyc); padding-bottom: 0.5em; margin-bottom: 0.5em; font-weight: bold; margin-top: 1.5em;}

/********************** TICKETS *******************************/
#tickets{ margin-bottom: 3vw;}
.price{margin:0 auto 80px;}
.price .price_list{ width: 100%;margin-bottom: 30px; display: flex; align-items: center; background-color: #f7f7f7;}
.price .price_list:first-of-type{ }
.price .price_list .price_l{ text-align: center;font-size: 20px;line-height: 1.5em; width: 40%;}
.price .price_list .price_l h2{ font-weight: bold;}
.price .price_list .price_l span{ display: block;font-size: 0.7em;line-height: 1.5em;}
.price .price_list .price_r{ width: 60%; background-color: #fff;border-bottom: 1px solid #e1e1e1; padding-left: 5%;}

.price .block{width: 100%;display: flex;align-items: center;padding: 30px 0 ;font-weight: bold;}
.price .block .left{ width: 60%;font-size: 24px;line-height: 1.5em;text-align: left;}
.price .block .left span{ font-size: 0.8em;}
.price .block .right{width: 40%;text-align: right;font-size: 26px;line-height: 1.5em;}
.price .block .right span{ font-size: 0.6em;line-height: 1.5em;}

.ticket_link{ text-align: center;color: #fff;padding: 1% 5%;margin-bottom: 15px;font-size: 18px;line-height: 1.5em;font-weight: 600; border-bottom: 1px solid #fff;}
.ticket_link.first{ border-top:1px solid #fff;}
.ticket_link .ticket_l{ text-align: center;line-height: 1.7em; width: 100%;}
.ticket_link .ticket_l strong{ font-size: 18px;line-height: 1.7em;display: block;color: #fff; font-weight: 600;}
.ticket_link .ticket_r{ width:33%;max-width: 400px;}
.ticket_link .ticket_r a{ display: block;text-align: center;padding: 1.5em 0;text-decoration: none;background-color: var(--keyc);color:#fff;font-size: 18px;font-weight: bold;display: block;border-radius: 10px;}

.ticket_link.cs{ background-color: transparent;border: 1px solid #ccc;color: #ccc;font-size: 20px;}
.ticket_link.cs .ticket_l { color: #999;}
.ticket_link.cs .ticket_l strong{ color: #999;}
.ticket_link.cs a{ background-color: #ccc;color: #999; }
.ticket_link.cs a{pointer-events: none;}

.ticket_list .note{ text-align: left; font-size: 14px; line-height: 1.7em; margin: 0 0 4em;}

.ticket_list .lead{ background-color: var(--keyc); margin-bottom: 20px; padding: 3%; color: #fff; font-size: 18px; line-height: 1.7em; position: relative;}
.ticket_list .lead .linkbtn{ margin-bottom: 20px;}
.ticket_list .lead .linkbtn a{ background-color: #fff; display: block;  width: 100%; text-align: center; margin: 0 auto;border-radius: 10px; padding:3% 0; font-size: 20px; line-height: 1.5em; margin-bottom: 10px;}
/*
.ticket_list .lead:after{ content: ""; display: block;width: 0; height: 0; border-left: 24px solid transparent; border-right: 24px solid transparent; border-top: 24px solid var(--keyc);
position: absolute; top: 100%; left:50%; transform: translate(-50%,0%);}*/


.ticket_link.end{ filter: grayscale(1) brightness(0.5);pointer-events: none;}

@media only screen and (max-width: 768px){
    .price{ margin: 30px auto 40px;}
    .price .price_list{ display: inherit;margin-bottom: 10px; background-color: inherit;}
    .price .price_list .price_l{width: 100%;font-size: 18px;padding: 0.5em 0; border-bottom: 1px solid #e1e1e1;}
    .price .price_list .price_r{width: 100%;}    
    .price .block{ padding: 20px 0;}
    .price .block .left{ font-size: 18px;}
    .price .block .right{ font-size: 18px; }
	
	.t_buy{ padding: 10px;}
	.playguide .stit{ font-size: 19px;margin:0.2em 0 0.5em 0;}
	.playguide dl{ display: inherit;width: 100%;margin-bottom:10px;font-weight:bold;}
	.playguide dt{width: 100%;display: inherit;padding: 10px;margin-bottom: 0;}
	.playguide dd{width: 100%;padding:10px;margin-bottom: 10px;}
	
	.ticket_list .stit{ font-size: 22px;}
	.ticket_link{ font-size: 16px;margin-bottom: 15px;padding: 10px 0;display: inherit;}
	.ticket_link .ticket_l{ }
	.ticket_link .ticket_l strong{ font-size: 18px;}
	.ticket_link .ticket_r{ width: 100%;max-width: initial;}
	.ticket_link .ticket_r a{ padding: 1em 0;margin-top: 15px;}
    
    .ticket_link.end{ font-size: 16px;}
    
    .ticket_list .lead{ padding: 5%;}
    .ticket_list .lead .linkbtn a{ padding: 3% 0; font-size: 18px;}
}


/********************** CAST *******************************/
.cast{}
.cast .block{ margin-bottom: 2em;font-size: 24px;line-height: 2em;font-weight: bold;}
.cast .block h2{ font-weight: bold;}
.cast .spring h2{ color: var(--keyc);}
.cast .summer h2{ color: #fabe00;}
.cast .autumn h2{ color: #f0824b;}
.cast .winter h2{ color: #1eafe6;}
.cast .block.creator{ font-size: 24px;}

@media only screen and (max-width: 768px){
.cast .block{ margin-bottom: 2em;font-size: 18px;line-height: 2em;}
    .cast .block.creator{ font-size: 15px;}

}




/********************** GUIDE *******************************/
.guide{}
.guide .g_list{ text-align: left;}
.guide .g_list > li{ margin-bottom: 20px;background-color: rgba(255,255,255,0.6);padding: 60px 40px;}
.guide .g_list > li .stit{font-size: 20px;font-weight: 800;line-height: 1.4em;margin-bottom: 1.5em;}
.guide .g_list > li .stit span{ font-size: 0.8em;line-height: 1.5em;}
.guide .g_list > li p{}
.guide .g_list > li p:last-child{ margin:0;}
.guide .g_list > li a{ text-decoration: underline;}
.guide .g_list > li ul{ list-style: disc;padding-left: 24px;margin-bottom: 1.5em;}
.guide .g_list > li ul li{ margin-bottom: 0.5em;}

.red_btn{ background-color: #c00;color: #fff;text-decoration: none !important;display: block;text-align: center;width: 60%;margin: 0 auto;padding: 20px 0;font-size: 16px;line-height: 1.5em;}
.red_btn:hover{ color:#fff;opacity: 0.8;}

@media only screen and (max-width: 768px){
	.guide .g_list > li{ padding: 20px;margin-bottom: 8px;}
	.guide .g_list > li .stit{ font-size: 16px;line-height: 1.4em;margin-bottom: 0.7em;}
	.guide .g_list > li p{ font-size: 14px;line-height: 1.5em;}
	.guide .g_list > li ul{ padding-left: 20px;}
	.guide .g_list > li ul li{ font-size: 14px;line-height: 1.5em;}

	.red_btn{ width: 100%;font-size: 14px;line-height: 1.4;padding: 14px 0;}
}



/********************** GOODS *******************************/
.goodsbtn { overflow: inherit;}
.goodsbtn a{ display: block;border: 3px solid var(--keyc);line-height: 1em;color:var(--keyc);width: 100%;max-width: 800px;margin: 0 auto;padding: 3em 0;border-radius: 100vw;transition: 0.5s;}
.goodsbtn a span{ display: block;font-size: 2.5em;line-height: 1em;margin-top: 0.5em;}
.goodsbtn a:hover{ transform: scale(1.05);}

@media only screen and (max-width: 768px){
    .goodsbtn a{ border-radius: 10px;padding: 1.5em 0;line-height: 1.5em;}
    .goodsbtn a span{ font-size: 1.5em;line-height: 1em;margin-top: 0.5em;}
}


.goods_list .chui{  margin-bottom: 30px;text-align: left;}

.goods_list dl{ background-color: #fff;display: inline-flex;justify-content: center;align-items: center;padding: 1em 3em;font-size: 20px;font-weight: bold;line-height: 1.5em;margin-bottom: 30px;}
.goods_list dt{ padding-right: 1.5em;}
.goods_list dd{ text-align: left;border-left: 1px solid #ccc;padding-left: 1.5em;line-height: 1.7em;}
.goods_list dd span{ display: block;font-size: 0.7em;line-height: 1.5em;}

.goods_list .list{ position: relative;display: flex;flex-wrap: wrap;margin-bottom: 30px;}
.goods_list .list li{ width: 32.66%;background-color: #fff;text-align: left;margin-bottom: 20px;margin-right: 1%;}
.goods_list .list li:nth-child(3n){margin-right: 0;}
.goods_list .list li:before {content: "";background: linear-gradient(90deg,rgba(230,80,135,1) 0%, rgba(230,80,135,1) 25%, rgba(250,190,0,1) 25%, rgba(250,190,0,1) 50%, rgba(240,130,75,1) 50%, rgba(240,130,75,1) 75%, rgba(30,175,230,1) 75%, rgba(30,175,230,1) 100%);display: block;width: 100%;height: 6px;}
.goods_list .list li .goods_block{ padding: 20px;}

.goods_list .list li h2{ font-weight: bold;font-size: 20px;line-height: 1.5em;display: flex;align-items: center;margin-bottom: 0.8em;}
.goods_list .list li h2 .limit{ background-color: #c00;color: #fff;display: inline-block;padding:5px 10px;font-size: 0.5em;line-height: 1em;margin-left: 10px;}
.goods_list .list li .price{ font-weight: bold;}
.goods_list .list li .txt { font-size: 14px;line-height: 1.7em;}
.goods_list .list li .txt p:last-of-type{ margin: 0;}
.goods_list .list li .txts{ display: block;font-size: 11px;line-height: 1.7em;}

.goods_list .linkshop a{ display: block;background-color: #fff;border: 5px solid var(--keyc);border-radius: 100vw;padding: 2em 0;font-size: 30px;font-weight: bold;}

@media only screen and (max-width: 768px){
    .goods_list dl{ padding: 10px;display: inherit;font-size: 16px;line-height: 1.5em;margin-bottom: 20px;}
    .goods_list dt{ padding: 0;border-bottom: 1px solid #ccc;padding-bottom: 5px ;margin-bottom: 5px;}
    .goods_list dd{ border: none;padding: 0;}
    
    .goods_list .list li .goods_block{ padding: 15px;}
    .goods_list .list{ display: inherit;}
    .goods_list .list li{ width: 100%;margin-bottom: 10px;}
    .goods_list .list li h2{ flex-wrap: wrap;font-size: 18px;line-height: 1.5em;margin-bottom: 0.5em;}
    .goods_list .list li .price{ margin-bottom: 0.5em;}
    .goods_list .linkshop a{ padding: 1em 0;border-radius: 10px;font-size: 18px;line-height: 1.5em;border-width: 2px;}
    
}


/* アニメーション */
.loader_bg{ background-color:#fff;width:100%;height:100vh;position:absolute;top:0;left:0;z-index: 1000;}
.loader{background-image:url(../images/logo.svg);background-repeat : no-repeat;background-size:16%;background-position : 50% 46%;z-index:10000;position:absolute;top:0;left:0;width: 100%;height: 100vh;opacity:0;animation: anime_loader 0.8s;animation-fill-mode:both;}


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

/* 00 */
.intro00 .mainimg .maintxt h1{ top: 5vw;}
.intro00 .mainimg .maintxt p{ top: -5vw;}
.intro00 .mainimg:after{ transform: scale(1.2);}


main{}
main img{ width: 100%;}
.mainimg{ position: relative;width: 100%;min-height: 90svh;}
/*
.mainimg:before{ content: '';display: block;position: absolute;bottom: 0;left: 50%;width: 20%;height: 100%; background-image: url("../images/circle_bg.png");background-repeat: no-repeat;background-size: 100%;background-position: center bottom;z-index: 2;transform: translate(-50%,0);}
*/
.mainimg .maintxt{ position: absolute;z-index: 10;width:60%;top: 55%;left: 50%;transform: translate(-50%,-50%);min-width: 900px;}
.mainimg .maintxt h1{ margin:0 auto 2.5vw;position: relative;top: 0;transition: 2s; width: 80%; max-width: 1100px;}
.mainimg .maintxt p{ width: 60%;margin: 0 auto 1.5vw;position: relative;top: 0;transition: 2s; max-width: 800px;}
.mainimg .line{ overflow:hidden;width:2px;height:8vw;display:block;position:absolute;z-index:20;bottom:-6vw;left:50%;}
.mainimg .line span{  display:block;background:var(--keyc2);position:absolute;bottom:0;left:0;height:8vw;width:2px;transition: all 400ms ease 0s;-webkit-transition: all 400ms ease 0s;-webkit-animation: scrollarrow 2s infinite;animation: scrollarrow 2s infinite;}
@keyframes scrollarrow {
	0% {transform: translate(0, -8vw);}
	100% {transform: translate(0, 8vw);}
}

@media only screen and (max-width: 768px){
    .mainimg{ height:92vh;}
    .mainimg:before{ width: 30%;}
    .mainimg .maintxt{ min-width: inherit;width: 92%;}
    .mainimg .maintxt h1{ margin-bottom: 6vw;}
    .mainimg .maintxt p{ width: 85%;margin: 0 auto 6vw;}
  
}


.about{   background-image: url("../images/about_bg1.png"),url("../images/about_bg2.png");background-position: 2vw 2vw,68vw 2vw,2vw bottom,68vw bottom;background-repeat: no-repeat;background-size: 30%;padding: 7vw 0 7vw;position: relative;width: 100%;margin: 0 auto;}
.about_block{ padding: 3vw 0 0;font-size: 3vw;line-height: 1.5em;letter-spacing: 0.05em;}
.about_block .txt{ margin-bottom: 5vw;line-height: 2em;}
.about_block .catchend{ font-size: 36px;line-height: 1.5em;margin: 0;display: inline-block;}

.about_block .txt01{ margin-bottom: 1em;font-weight: bold; color:var(--keyc);}
.about_block .txt02{margin-bottom: 0.8em;font-size:1.7vw;line-height: 2.5em;}

.about_block .kv{ display: flex;line-height: 0;flex-wrap: wrap;justify-content: space-between;width: 98%;margin: 0 auto;padding-top: 1.5vw;}
.about_block .kv div{ width: 33.33%;}
/*
.about_block .kv div:nth-of-type(5){ width: 50%;}
*/

.about_special{ width: 100%;overflow: hidden;margin-top: -9vw;}
.about_special:before,
.about_special:after{content: "";display: block;border-style: solid;}
.about_special:before{ border-width: 0 0 15vw 100vw;border-color: transparent transparent #f0f3f6 transparent ;}
.about_special:after{ border-width:  0 0 15vw 100vw;border-color: transparent transparent  transparent #f0f3f6 ;}

.about_special .sp_content{ background-color: #f0f3f6;padding: 0 0 3vw;text-align: left;}

.about_special .sp_tit{ background-image: url("../images/top_about_titbg.png");background-repeat: no-repeat;background-size: 100%;background-position: center;padding:3% 5% ;position: relative;font-size: 2.5vw;line-height: 1.4em;font-weight: bold;display: flex;align-items: center;text-align: left;}
.about_special .sp_tit:before{ content: "";display: block;width:6vw;height: 6vw;background-image: url("../images/film_icon.png");background-size: contain;background-repeat: no-repeat;margin-right: 2vw;background-position: center;}
.about_special .sp_tit .sp_tit1{ display: block;}
.about_special .sp_tit .sp_tit1 img{ width: 20%;}
.about_special .sp_tit .sp_tit1 .txtl{ font-size: 1.3em;}

.about_special .sp_block{font-size: 18px;line-height: 1.7em;padding-bottom: 3.5vw;}
.about_special .sp_block:last-of-type{ padding-bottom: 0;}
.about_special .sp_block p:last-of-type{ margin-bottom: 0;}
.about_special .sp_container{ width: 90%;margin: 0 auto;}

.about_special .sp_flyer { display: flex;flex-wrap: wrap;padding: 15px 0 0;}
.about_special .flyertit{ text-align: center;font-weight: bold;margin-top: 1.5em;}
.about_special .sp_flyer .flyer_blk{ width: 50%;color: #fff;font-weight: bold;padding: 2%;}
.about_special .sp_flyer .spring{ background-color:var(--keyc);}
.about_special .sp_flyer .summer{ background-color: #fabe00;}
.about_special .sp_flyer .autumn{ background-color: #f0824b;}
.about_special .sp_flyer .winter{ background-color: #1eafe6;}

.about_special .sp_flyer .flyer_blk h4{ font-weight: bold;line-height: 1.5em;}

.about_special .sp_flyer ul{ display: flex;justify-content: space-between;}
.about_special .sp_flyer li{ font-size: 14px;line-height: 1.5em;width: 49%;}
.about_special .sp_flyer figure{ padding: 10px 0;line-height: 0;}

.about_special .movie{ text-align: center;}
.about_special .movie_logo{ width: 40%;margin: 0 auto 30px;}

.about .btn_01{ margin-top: -10vw;margin-bottom:8vw;background-color: #fff;font-size: 20px;}

.about .line{ overflow:hidden;width:2px;height:8vw;display:block;position:absolute;z-index:20;top:-3vw;left:50%;}
.about .line span{  display:block;background:var(--keyc2);position:absolute;bottom:0;left:0;height:8vw;width:2px;transition: all 400ms ease 0s;-webkit-transition: all 400ms ease 0s;-webkit-animation: scrollarrow 2s infinite;animation: scrollarrow 2s infinite;}



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


@media only screen and (max-width: 768px){
	.about{ background-image: url("../images/about_bg1_sp.png"),url("../images/about_bg2_sp.png"),url("../images/about_bg2_sp.png"),url("../images/about_bg1_sp.png");background-position: left 10px,right 10px,left bottom,right bottom;padding:14vw 0 0vw; margin-bottom: 30px;}    
	.about .txt{ font-size: 14px;line-height: 1.5em;text-align: left;}
	.about .catchend{ font-size: 20px;}
	.about.container{ margin-bottom: 10px;}
	
	.about_block{ padding: 8vw 0;}
    .about_special .sp_content{  padding-bottom: 20px;}

	.about_block .txt01{ margin:0 auto 1em;font-size: 6vw; line-height: 1.7em; width: 90%;}
	.about_block .txt02{ width: 90%; margin:0 auto 2em;font-size:4vw; line-height: 1.7em; text-align: left;}
	
	
    .about_block .kv{ flex-wrap: wrap;padding-top: 0;width: 100%;}
    .about_block .kv div{ width: 50%;margin-bottom: 0px;}
	.about_block .kv div:nth-of-type(2n){ margin-top: 0;}
    .about_special .sp_tit{ font-size: 18px;line-height: 1.5em;align-items: flex-start;padding: 3%;}
    .about_special .sp_tit:before{ width: 18%;height:10vw;background-position: top;margin-right: 4vw;}
    .about_special .sp_tit .sp_tit1 .txtl{ font-size: 1em;}
    .about_special .sp_tit .sp_tit1 img{ width: 60%;margin-bottom: 0;}
    .about_special .sp_block{ font-size: 16px;line-height: 1.5em;padding-bottom: 20px;}
    .about_special .sp_container{ width: 94%;}
    
    .about_special .sp_flyer{ padding: 10px 0;}
    .about_special .sp_flyer .flyer_blk{ width: 100%;padding:10px;margin-bottom: 5px;}
    .about_special .sp_flyer figure{ padding: 5px 0;}
    .about_special .sp_flyer li{ font-size: 12px;}
    
    .about .line{height:18vw;top:-4vw;}
    .about .line span{ height:18vw }
    
    .about .btn_01{ font-size: 18px;}
    
    
.about_special .movie{ text-align: left;}
.about_special .movie_logo{ width: 80%;margin: 0 auto 20px;}

@keyframes scrollarrow {
	0% {transform: translate(0, -18vw);}
	100% {transform: translate(0, 18vw);}
}      
}

.flex_box{ display:flex;justify-content: space-between;}

@keyframes r1 {
  0%   { transform:translate(-50%,-50%) rotate(0deg); }
  100% { transform:translate(-50%,-50%) rotate(360deg); }
}


.fc_link{; padding: 8vw 0 12vw; background-color: rgba(240,140,170,0.15)}
.fc_link .container{ display: flex; justify-content: space-between; align-items: center;}
.fc_link .left{ width:40%; text-align: center;}
.fc_link .left img{ width: 50%;}
.fc_link .right{ width: 60%;}
.fc_link .right .stit{     font-size: min(3.5vw, 50px); line-height: 1.2em; margin-bottom: 0.5em;}
.fc_link .tourokubtn{ width:100%; margin: 2em auto 0; border: 1px solid var(--keyc); padding: 4px;border-radius: 10px; }
.fc_link .tourokubtn a{ display: block; background-color: var(--keyc); color:#fff; font-size: 24px; line-height: 1em; padding: 1.2em 0; font-weight: bold; border-radius: 10px; }


@media only screen and (max-width: 768px){
	.fc_link{; padding: 30px 0 40px;}
	.fc_link .container{ display: inherit;  }
	.fc_link .left{ width:100%; text-align: center; margin-bottom: 30px;}
	.fc_link .left img{ width: 50%;}
	.fc_link .right{ width: 100%;}
	
	.fc_link .right{  text-align: left;}
	.fc_link .right .stit{ font-size: 6vw; line-height: 1.4em; margin-bottom: 0.5em; text-align: center;}

	.fc_link .tourokubtn{  margin: 10px auto;}    
	.fc_link .tourokubtn a{ font-size: 18px; line-height: 1em; padding: 1em 0; text-align: center;}
}
