@charset "UTF-8";
/* ===============================================
#擬似要素中央配置 mixin
=============================================== */
/* ===============================================
# navigation
=============================================== */
:root {
    --header_bg_color: rgb(0, 0, 0,40%);
    --mobile_bg_color:#000;
    --bg_color: #000;
    --link_color: #fff;
    --txt_color: #fff;
    --txt_sub: #CCCCCC;
    --key_color: #F16C04;
    --key_color_dark: #E46603;
    --ac_color: #E10101;
    --ob_lighten: #aa866a;
    --ob_darken: #383635;
    --button-color:#000;
    --button-text-color:#fff;
    --flex-gap:30px;
    --font-noto:"YuGothic","Yu Gothic","Hiragino Sans", sans-serif;
    --font-serif:"Noto Serif JP", sans-serif;
    --main_padding:20px;
    --caution:#E10101;
}

/* ===============================================
# SNSカラー
=============================================== */

.popup{position: fixed;width: 100%;height: 100lvh;top: 0;left: 0;background: #000000da;z-index: 10000;opacity: 0;}
.intro_on .popup{opacity: 1;transition:.6s;transition-delay: 1.2s;}
.intro_on .popup.del{pointer-events: none;opacity: 0;visibility: hidden;transition:.4s;}
.popup .img{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: min(1200px,96%);}
.popup .img img{max-height: 90vh;object-fit: contain;}
.popup .close{position: absolute;top: 0;right: 0;width: max(50px,5vw);cursor: pointer;}
.popup{}


.container {padding-top: 100px;}

.h_outer {margin-bottom: 40px;}

.sec_h {display: inline-block;position: relative;color: var(--txt_color);font-size: min(8vw, 74px);line-height: 1.2em;letter-spacing: 2px;font-weight: bold;padding-bottom: 20px;}
.sec_h:after {position: absolute;content: "";width: 54px;height: 10px;bottom: 0;left: 0px;background: url(../images/heading_parts.svg) no-repeat center;background-size: contain;}

.sec_h_sub {text-align: center;font-size: 32px;line-height: 1.4em;color: var(--txt_sub);font-weight: normal;margin-bottom: 80px;}
.sec_h_sub span {display: inline-block;position: relative;padding: 0 70px;}
.sec_h_sub span:before {position: absolute;content: "";background: url(../images/sub_heading_parts.svg) no-repeat center;background-size: contain;width: 52px;height: 16px;top: 50%;transform: translateY(-50%);left: 0;}
.sec_h_sub span:after {position: absolute;content: "";background: url(../images/sub_heading_parts.svg) no-repeat center;background-size: contain;width: 52px;height: 16px;top: 50%;transform: translateY(-50%) scale(-1, 1);right: 0;}

@media screen and (max-width: 768px) {.sec_h {font-size: 11vw;}.sec_h_sub {margin-bottom: 50px;}}
.body_top .header__title {transform: translateY(-103%);transition: 0.3s;}
.body_top .header__title.active {transform: translateY(0);transition: 0.3s;}
@media screen and (max-width: 768px) {.body_top .header__title {transform: translateY(0);}}

.body_in .h_outer {text-align: center;}
.body_in .sec_h:after {left: 50%;transform: translateX(-50%);}

/* loading animation
------------------------------------------------------------------------------------------*/
.loading {position: fixed;top: 50%;left: 0;transform: translateY(-50%);width: 100%;height: 110lvh;z-index: 10000;background-color: #000;}
.loading .bg_texture {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #000;opacity: 0.25;}
.loading .bg_texture img {--loading_bg_anim_time: 1s;--loading_anim_page_num: 6;position: absolute;top: 0;left: 0;width: 100%;height: 100%;-o-object-fit: cover;object-fit: cover;}
.loading .bg_texture img:nth-of-type(1) {-webkit-animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;-webkit-animation-timing-function: steps(3, jump-none); animation-timing-function: steps(3, jump-none);}
.loading .bg_texture img:nth-of-type(2) {-webkit-animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;-webkit-animation-timing-function: steps(3, jump-none); animation-timing-function: steps(3, jump-none);-webkit-animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 1);animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 1);}
.loading .bg_texture img:nth-of-type(3) {-webkit-animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;-webkit-animation-timing-function: steps(3, jump-none); animation-timing-function: steps(3, jump-none);-webkit-animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 2);animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 2);}
.loading .bg_texture img:nth-of-type(4) {-webkit-animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;-webkit-animation-timing-function: steps(3, jump-none); animation-timing-function: steps(3, jump-none);-webkit-animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 3);animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 3);transform: scale(-1, -1);}
.loading .bg_texture img:nth-of-type(5) {-webkit-animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;-webkit-animation-timing-function: steps(3, jump-none); animation-timing-function: steps(3, jump-none);-webkit-animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 4);animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 4);transform: scale(-1, -1);}
.loading .bg_texture img:nth-of-type(6) {-webkit-animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;animation: loading_bg_in_out var(--loading_bg_anim_time) infinite;-webkit-animation-timing-function: steps(3, jump-none); animation-timing-function: steps(3, jump-none);-webkit-animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 5);animation-delay: calc(var(--loading_bg_anim_time) / var(--loading_anim_page_num) * 5);transform: scale(-1, -1);}

.loading .logo {position: absolute;top: 50%;left: 50%;width: min(500px, 60%);height: auto;transform: translate(-50%, -50%);opacity: 1;}
.loading .logo img {display: block;width: 100%;height: auto;}
.loading.off {-webkit-animation: loading_fade_out 0.8s ease forwards;animation: loading_fade_out 0.8s ease forwards;-webkit-animation-delay: 0.4s;animation-delay: 0.4s;}
.loading.off .bg_texture {-webkit-animation: loading_bg_fade 0.2s ease forwards;animation: loading_bg_fade 0.2s ease forwards;}

@-webkit-keyframes loading_bg_in_out {0% {  opacity: 0;}40% {  opacity: 0;}50% {  opacity: 1;}60% {  opacity: 0;}100% {  opacity: 0;}}

@keyframes loading_bg_in_out {0% {  opacity: 0;}40% {  opacity: 0;}50% {  opacity: 1;}60% {  opacity: 0;}100% {  opacity: 0;}}
@-webkit-keyframes loading_bg_fade {0% {  opacity: 0.25;}100% {  opacity: 1;}}
@keyframes loading_bg_fade {0% {  opacity: 0.25;}100% {  opacity: 1;}}
@-webkit-keyframes loading_fade_out {0% {  opacity: 1;}100% {  opacity: 0;  visibility: hidden;}}
@keyframes loading_fade_out {0% {  opacity: 1;}100% {  opacity: 0;  visibility: hidden;}}
/* animation: fv_fade_out 0.4s ease forwards; */
.fix_bg {position: fixed;width: 100%;height: 100vh;height: 100dvh;top: 0;left: 0;z-index: 1;opacity: 0.4;pointer-events: none;}
.fix_bg .bg img {width: 100%;-o-object-fit: cover;   object-fit: cover;height: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.fix_bg video {width: 100%;-o-object-fit: cover;   object-fit: cover;height: 100%;}
.fix_bg .bg_text {position: absolute;width: 6vw;top: 50%;transform: translateY(-50%);}
.fix_bg .bg_text.text01 {left: 0;}
.fix_bg .bg_text.text02 {right: 0;}

main {z-index: 2;position: relative;}
.news-wrap li {  border-bottom: 1px solid #fff;}
.news-wrap .link_arrow {right: 20px;position: absolute;background: url(../images/icon_next.svg) no-repeat center;background-size: contain;width: 10px;height: 16px;top: 50%;transform: translateY(-50%);}
.news-wrap .news_link {display: block;width: 100%;align-items: center;color: #fff;padding: 20px 0 20px 10px;position: relative;z-index: 1;transition: 0.3s;}
.news-wrap .news_link.disactive {pointer-events: none !important;}
.news-wrap .news_link:before {content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: -1;background: var(--ob_darken);transform-origin: 100% 50%;transform: scaleX(0);transition: transform ease 0.3s;}
.news-wrap .news_link:hover {opacity: 1;color: #fff;}
.news-wrap .news_link:hover::before {transform-origin: 0% 50%;transform: scale(1);}
.news-wrap .news_link:hover .link_arrow:before {border-color: #fff;}
.news-wrap .news_link:hover .link_arrow:after {background: #fff;}
.news-wrap .news_link:hover .date {color: #fff;}
.news-wrap .date {width: 100%;position: relative;margin-bottom: 0.4em;color: var(--key_color);display: flex;align-items: center;}
.news-wrap .date span {display: block;font-weight: bold;}
.news-wrap .date span.month {line-height: 1em;}
.news-wrap .text {width: 100%;padding-right: 70px;font-size: 14px;line-height: 1.6em;}
.news-wrap ul {margin-bottom: 30px;}
.news-wrap .button {margin-left: 1px;margin-right: auto;max-width: 300px;}
.news-wrap .button a:before {background: url(../images/icon_arrow.svg) no-repeat center;background-size: contain;}
.news-wrap .news_button {max-width: 140px;margin: 0 auto;width: 100%;}
.news-wrap .news_button a {font-size: 12px;line-height: 1.4em;color: var(--key_color);border: 1px solid var(--key_color);display: block;padding: 0.6em 1em;text-align: center;border-radius: 40px;transition: 0.2s;}
.news-wrap .news_button a:hover {background: var(--key_color);color: #fff;transition: 0.2s;opacity: 1;}

.single article {margin-bottom: 60px;}
.single .day {font-size: 14px;font-weight: bold;margin-bottom: 0.5em;color: var(--key_color);}
.single .title {font-size: 24px;font-weight: bold;line-height: 1.5em;padding-bottom: 1em;margin-bottom: 1em;border-bottom: 1px solid #ccc;}
.single .txt_box a {color: #fff;text-decoration: underline;}
.single h2 {font-size: 18px;line-height: 1.4em;font-weight: bold;border-left: 5px solid var(--key_color);padding: 0.4em 0.6em 0.3em;margin-bottom: 0.6em;}
.single blockquote {padding: 30px;background: var(--ob_darken);border-radius: 10px;margin-bottom: 2em;}
.single p {font-size: 16px;line-height: 1.8em;margin-bottom: 1.5em;}
.single .button {margin: 0 auto;}

@media screen and (max-width: 768px) {
    .news-wrap .link_arrow {right: 0px;}
    .news-wrap .text {padding-right: 40px;}
    .news-wrap .news_link:hover .link_arrow {right: -10px;}
    .news-wrap .button {margin: 0 auto;max-width: inherit;}
    .news-wrap .button a {padding: 16px;}
    .single .title {font-size: 18px;}
    .single h2 {font-size: 16px;border-width: 3px;}
    .single blockquote {padding: 20px;}
    .single p {font-size: 13px;}}
/* ================================= FV =================================== */
#fv .bg_txt {position: absolute;top: 0;z-index: 1;width: 100%;}
#fv .bg_txt .txt img {display: block;}
#fv .bg_txt .txt.txt02 {margin-top: -0.7%;opacity: 0.7;}
#fv .top_inner {display: flex;width: 88%;margin: 0 auto;position: relative;z-index: 2;}
#fv .top_inner .text_block {width: 38vw;position: absolute;padding-top: 140px;}
#fv .top_inner .text_block.fixed {position: fixed;top: 0;}
#fv .top_inner .text_block.btm {position: absolute;bottom: 0;top: inherit;}
#fv .top_inner .text_block .block_inner {width: 94%;margin: 0 auto;}
#fv .top_inner .text_block .logo {margin: 0 auto 14%;width: 92%;}
#fv .top_inner .text_block .date_block {margin: 0 auto 10%;width: 100%;}
#fv .top_inner .text_block .date_block .date {width: 80%;margin: 0 auto;}
#fv .top_inner .text_block .date_block .date:not(:last-of-type) {margin: 0 auto 7%;}
#fv .top_inner .text_block .bnr_block{width: 88%;margin: 0 auto;}
#fv .top_inner .text_block .bnr_block:not(:last-of-type){margin-bottom: 2vw;}
#fv .top_inner .text_block{}
#fv .top_inner .img_block {width: 55%;position: relative;margin-right: 0;margin-left: auto;}
#fv .top_inner .img_block .kv_txt {width: 6%;position: absolute;bottom: 0;right: -10%;}
#fv .button {max-width: 100%;}
#fv .button_wrap .button:not(:last-of-type) {margin-bottom: 2.2%;}
#fv .fv_box {position: absolute;width: 100%;height: 100vh;top: 0;max-height: 50%;z-index: 2;pointer-events: none;}
#fv .fv_box .kv_txt {width: 4%;bottom: 4%;right: 0;position: absolute;}
#fv .fv_box .kv_txt img {max-height: 60vh;}

@media screen and (max-width: 768px) {
    #fv .bg_txt {top: 60px;}
    #fv .top_inner {flex-direction: column-reverse;}
    #fv .top_inner .text_block {position: relative;width: 100%;padding-top: 0;margin-top: 3vw;z-index: 3;}
    #fv .top_inner .text_block .block_inner {width: 100%;}
    #fv .top_inner .text_block .logo {width: 80%;margin: 0 auto 6%;}
    #fv .top_inner .text_block .date {margin: 0 auto 10%;}
    #fv .top_inner .img_block {width: 100%;}
    #fv .fv_box {z-index: 1;}
    #fv .fv_box .kv_txt {bottom: inherit;top: 80vw;width: 9%;}}
/* ================================= FV =================================== */
/* ================================= ニュース =================================== */
.section_outer_news {display: flex;width: min(92%, 1400px);margin: 0 auto 100px;gap: 4%;padding-top: 100px;}
.section_outer_news .section_wrap {width: 48%;}
.section_outer_news #news {border-left: 1px solid #fff;padding-left: 2%;}

.x_box {width: 100%;height: 400px;}

@media screen and (max-width: 768px) {
    .section_outer_news {display: block;margin: 0 auto 60px;}
    .section_outer_news .section_wrap {width: 100%;}}
/* ================================= ニュース =================================== */
/* ================================= TOPキャスト =================================== */
.cast_wrap ul {display: flex;justify-content: center;}
.cast_wrap ul:not(:last-of-type) {margin-bottom: 20px;}
.cast_wrap ul.row-2 {flex-wrap: wrap;max-width: 700px;margin: 0 auto 14px;}
.cast_wrap ul.row-2 li {margin: 0 1.6% 1.4%;}
.cast_wrap li {margin: 0 1.6%;}
.cast_wrap li dl {display: flex;align-items: center;font-size: 18px;line-height: 1.6em;}
.cast_wrap li dl dt {color: var(--key_color);font-size: 14px;margin-right: 8px;}
.cast_wrap li dl dd {font-weight: bold;}
.cast_wrap li.main dl dd {font-size: 20px;}
.cast_wrap li.main dl dd .small {font-size: 14px;}

#cast {margin-bottom: 140px;padding-top: 100px;}
#cast .content_wrap:not(:last-of-type) {margin-bottom: 50px;}
#cast .h_outer {margin-bottom: 24px;}
#cast .button {max-width: 300px;}

@media screen and (max-width: 768px) {
    .cast_wrap ul {flex-wrap: wrap;}
    .cast_wrap ul.row-2 {margin: 0 auto 30px;}
    .cast_wrap li {margin: 0 4% 4%;}
    .cast_wrap li dl dt {font-size: 12px;}
    .cast_wrap li.main {margin: 0;}
    #cast {width: 96%;margin: 0 auto 80px;}
    #cast .button {max-width: inherit;width: 92%;}}
/* ================================= TOPキャスト =================================== */
/* ================================= TOPムービー =================================== */
#movie {overflow: hidden;}
#movie .movie_block {position: relative;max-width: 1000px;margin: 0 auto;}
#movie .movie_block .play-button {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
#movie .movie_block .video-block {position: relative;aspect-ratio: 16/9;overflow: hidden;background: #000;}
#movie .movie_block .video-block img {position: absolute;display: block;top: 50%;left: 50%;transform: translate(-50%, -50%) scale(1);width: 100%;height: 100%;-o-object-fit: cover;   object-fit: cover;transition: 0.2s;opacity: 0.8;}
#movie .movie_block a:hover {opacity: 1;}
#movie .movie_block a:hover .video-block img {transform: translate(-50%, -50%) scale(1.1);transition: 0.2s;opacity: 1;}
#movie .sec-inner {max-width: 1400px;}

/* ================================= TOPムービー =================================== */
/* ================================= 下層 =================================== */
.body_in .container {padding-bottom: 50px;padding-top: 150px;}
.body_in .h_outer {position: relative;margin-bottom: 80px;}
.body_in .h_outer .slider-box {top: 50%;transform: translateY(-50%);z-index: 0;}
.body_in .h_outer .page_title {z-index: 2;position: relative;}
.body_in .content_wrap:not(:last-of-type) {margin-bottom: 100px;}
.body_in .sec-inner {padding-bottom: 10px;}
.body_in .section_wrap {overflow: hidden;}

.page_title {position: relative;}
.page_title img {-o-object-fit: contain;   object-fit: contain;height: 100%;width: 100%;max-height: 154px;-webkit-animation: scaleVertical 0.4s both;        animation: scaleVertical 0.4s both;-webkit-animation-delay: 0.3s;        animation-delay: 0.3s;}
.page_title:before {position: absolute;content: attr(data-title) "";font-weight: bold;font-size: 14px;left: 50%;transform: translateX(-50%);bottom: -24px;-webkit-animation: showOut 0.4s both;        animation: showOut 0.4s both;-webkit-animation-delay: 0.4s;        animation-delay: 0.4s;}

@-webkit-keyframes scaleVertical {0% {  transform: scale(1, 0);}100% {  transform: scale(1, 1);}}

@keyframes scaleVertical {0% {  transform: scale(1, 0);}100% {  transform: scale(1, 1);}}
@-webkit-keyframes showOut {0% {  opacity: 0;}100% {  opacity: 1;}}
@keyframes showOut {0% {  opacity: 0;}100% {  opacity: 1;}}
@-webkit-keyframes fadeup {0% {  transform: translateY(5%);  opacity: 0;  filter: blur(10px);}100% {  transform: translateY(0);  opacity: 1;  filter: blur(0);}}
@keyframes fadeup {0% {  transform: translateY(5%);  opacity: 0;  filter: blur(10px);}100% {  transform: translateY(0);  opacity: 1;  filter: blur(0);}}
@-webkit-keyframes fadeupSp {0% {  transform: translateY(5%);  opacity: 0;}100% {  transform: translateY(0);  opacity: 1;}}
@keyframes fadeupSp {0% {  transform: translateY(5%);  opacity: 0;}100% {  transform: translateY(0);  opacity: 1;}}
@-webkit-keyframes fadeScale {0% {  opacity: 0;  transform: translateY(2%);}100% {  opacity: 1;  transform: translateY(0);}}
@keyframes fadeScale {0% {  opacity: 0;  transform: translateY(2%);}100% {  opacity: 1;  transform: translateY(0);}}
.js-play.fadeInBottom {-webkit-animation: fadeup 0.6s both ease-in-out;        animation: fadeup 0.6s both ease-in-out;}
.js-play.fadeScale {-webkit-animation: fadeScale 0.6s both ease-in-out;        animation: fadeScale 0.6s both ease-in-out;}

@media screen and (max-width: 768px) {
    .body_in .h_outer {margin-bottom: 60px;}
    .page_title img {max-height: 90px;}}
.intro_text {text-align: center;letter-spacing: 0.2em;line-height: 2.6em;font-weight: bold;margin-bottom: 180px;padding-top: 60px;font-family: var(--font-noto);color: #000;}
.intro_text .line {display: inline-block;background: var(--key_color);font-size: 24px;line-height: 1.2em;padding: 0.1em 0.3em;margin-bottom: 1.3em;font-weight: bold;font-family: "YuGothic", "Yu Gothic", "Hiragino Sans";}
.intro_text .line:last-of-type {margin-bottom: 80px;}
.intro_text .catch {width: min(100%, 878px);margin: 0 auto;}

@media screen and (max-width: 768px) {
    .intro_text {font-size: 14px;text-align: left;width: 94%;margin: 0 auto 60px;padding-top: 20px;}
    .intro_text .line {font-size: 18px;}
    .intro_text .line:last-of-type {margin-bottom: 40px;}}
.story_wrap {background: var(--ob_lighten);padding: 80px 0;text-align: center;position: relative;}
.story_wrap:before {position: absolute;content: "";background: url(../images/story_cross.svg) no-repeat center;background-size: cover;top: 50%;left: 50%;transform: translate(-50%, -50%) scale(0);width: 100%;height: 100%;}
.story_wrap .sub_title {font-size: 80px;font-weight: bold;line-height: 1.1em;position: relative;padding-top: 82px;margin-bottom: 52px;color: var(--key_color);}
.story_wrap .sub_title:before {position: absolute;content: "";background: url(../images/story_subtitle.svg) no-repeat center;background-size: contain;width: 20px;height: 82px;left: 50%;transform: translateX(-50%);top: 0;}
.story_wrap .text_block {position: relative;}
.story_wrap .text_block p {line-height: 2em;letter-spacing: 0.1em;}
.story_wrap .text_block p.catch {font-size: 30px;font-weight: bold;}
.story_wrap .text_block p:not(:last-of-type) {margin-bottom: 2em;}
.story_wrap.js-play {transition: 0.3s;}
.story_wrap.js-play:before {transform: translate(-50%, -50%) scale(1);transition: 0.4s;}

@media screen and (max-width: 768px) {
    .story_wrap {padding: 50px 0;}
    .story_wrap .sub_title {font-size: 40px;}
    .story_wrap .text_block {font-size: 14px;text-align: left;width: 92%;margin: 0 auto;}
    .story_wrap .text_block p.catch {font-size: 20px;}}
.section_title {margin: 0 auto 50px;}
.section_title span {display: inline-block;width: 100%;color: #fff;font-size: 60px;line-height: 1.1em;font-weight: bold;text-align: center;padding: 10px;position: relative;}
.section_title.js-play {-webkit-animation: wideOut 0.4s both;animation: wideOut 0.4s both;}

@-webkit-keyframes wideOut {0% {  opacity: 0;  transform: scale(0, 1);}100% {  opacity: 1;  transform: scale(1, 1);}}

@keyframes wideOut {0% {  opacity: 0;  transform: scale(0, 1);}100% {  opacity: 1;  transform: scale(1, 1);}}
@media screen and (max-width: 768px) {.section_title span {font-size: 30px;line-height: 1.3em;padding: 5px;}}
.cs {color: var(--key_color);font-size: 40px;font-weight: bold;text-align: center;margin-bottom: 100px;padding-top: 50px;}

/* ================================= キャスト =================================== */
.cast:not(:last-of-type) {margin-bottom: 120px;}
.cast .tit{    text-align: center;margin-bottom: 1em;font-size: 20px;line-height: 1.2em;font-weight: bold;}
.cast .list_01 {margin-bottom: 70px;display: flex;justify-content: center;}
.cast .list_01.text{flex-direction: column;align-items: center;}
.cast .list_01.text li{}
.cast .list_01.text li .actname{font-size: 18px;}
.cast .list_01.text li:not(:last-of-type){margin-bottom: 1.5%;}
.cast .list_01 li {width: 24%;margin: 0 1%;text-align: center;}
.cast .list_01 li a {color: #fff;}
.cast .list_01 li figure {line-height: 0;margin-bottom: 20px;overflow: hidden;}
.cast .list_01 li .name_wrap {display: flex;justify-content: center;align-items: center;width: 130%;transform: translateX(-11%);}
.cast .list_01 li .castname {display: inline-block;line-height: 1.4em;margin-right: 1em;    font-size: min(1vw,16px);position: relative;}
.cast .list_01 li .castname .label{background: #fff;padding: 0.3em 0.4em 0.24em;color: #000;}
.cast .list_01 li .castname .add{display: block;color: var(--key_color);font-size: .9em;position: absolute;left: 50%;transform: translateX(-50%);top: 2.2em;white-space: nowrap;}
.cast .list_01 li .castname .add.rev{transform: translateX(-50%)scale(-1,1);}
.cast .list_01 li .castname .add img{width:min(4.2vw, 67px);}
.cast .list_01 li .actname {font-size: min(1.4vw,20px);line-height: 1em;font-weight: bold;}
.cast .list_01 li .actname span {display: block;font-size: 12px;font-weight: 400;line-height: 3em;color: #fff;margin-top: 0.4em;}
.cast .list_01 li:nth-child(4n) {margin-right: 0;}
.cast .list_01.twin {position: relative;padding-bottom: 140px;}
.cast .list_01.twin .twin_box {position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);}
.cast .list_01.twin .badge_wrap {display: flex;justify-content: center;margin-bottom: 14px;}
.cast .list_01.twin .badge_wrap .badge {background: var(--key_color);width: 10px;height: 10px;margin: 0 5px;border-radius: 10px;}
.cast .other {font-size: 16px;line-height: 2em;margin-bottom: 6em;}
.cast .list_02 {font-family: var(--font-noto);width: 100%;}
.cast .list_02 li {font-size: 18px;line-height: 1.5em;margin-bottom: 30px;display: flex;align-items: center;justify-content: center;}
.cast .list_02 li.togashi {margin-bottom: 40px;}
.cast .list_02 li.togashi .staffname {font-size: 30px;line-height: 1.5em;}
.cast .list_02 li.togashi .staffname span {font-size: 0.6em;}
.cast .list_02 li .rolename {color: #000;background: var(--key_color);display: inline-block;padding: 0.2em 0.5em 0.15em;font-size: 12px;line-height: 1.5em;margin-right: 1em;text-align: center;font-weight: bold;}
.cast .list_02 li .staffname {font-weight: bold;}
.cast .list_02 li .staffname .logo {display: inline-block;width: 180px;}
.cast .list_02.flex {display: flex;flex-wrap: wrap;justify-content: center;}
.cast .list_02.flex li:not(:last-of-type) {margin-right: 40px;}
.cast .list_02.flex li.lastsingle {width: 100%;}
.cast .list_02:not(:last-of-type) { /*border-bottom: 1px solid var(--ob_lighten);*/padding-bottom: 20px;}
.cast .ensemble {display: flex;justify-content: center;flex-wrap: wrap;width: 100%;}
.cast .ensemble li {font-weight: bold;letter-spacing: 0.1em;width: 100%;text-align: center;}
.cast .ensemble li dl {display: flex;align-items: center;justify-content: center;}
.cast .ensemble li dl.column {flex-direction: column;}
.cast .ensemble li dt {background: #fff;color: #000;display: inline-block;padding: 0.3em 0.4em 0.2em;margin-right: 30px;}
.cast .ensemble li dd {display: flex;align-items: center;}
.cast .ensemble li .column dt{margin-bottom: 20px;}
.cast .ensemble li .column dd{flex-direction: column;}
.cast .ensemble li dd .in_list {display: inline-block;}
.cast .ensemble li dd .in_list .add{color: var(--key_color);font-size: .8em;letter-spacing: initial;}
.cast .ensemble li dd .in_list:not(:last-of-type) {margin-right: 20px;}
.cast .ensemble li .column dd .in_list:not(:last-of-type){margin-right: initial;margin-bottom: 10px;}
.cast .ensemble li .column dd .in_list{width: 100%;}
.cast .other_box {text-align: center;font-weight: bold;}
.cast .other_box p {font-size: 22px;line-height: 1.6em;margin-bottom: 0.8em;font-weight: bold;}
.cast .other_box ul li .castname {color: var(--key_color);margin-bottom: 0.6em;}
.cast .other_box ul li .actname {font-size: 20px;line-height: 1em;font-weight: bold;}
.cast .other_box ul li .actname span {display: block;font-size: 12px;font-weight: 400;line-height: 3em;color: #fff;margin-top: 0.4em;}
.cast .card_wrap .card_block {position: relative;transform-style: preserve-3d;aspect-ratio: 400/520;-webkit-animation: animation-cardImage 7s both infinite linear;        animation: animation-cardImage 7s both infinite linear;}
.cast .card_wrap .card {position: absolute;width: 100%;height: 100%;text-align: center;-webkit-backface-visibility: hidden;backface-visibility: hidden;}
.cast .card_wrap .card_back {transform: rotateY(180deg);}
#in_cast .sec-inner {max-width: 1400px;}

@-webkit-keyframes animation-cardImage {0% {  transform: rotateY(0deg);}5% {  transform: rotateY(180deg);}50% {  transform: rotateY(180deg);}55% {  transform: rotateY(0deg);}100% {  transform: rotateY(0deg);}}

@keyframes animation-cardImage {0% {  transform: rotateY(0deg);}5% {  transform: rotateY(180deg);}50% {  transform: rotateY(180deg);}55% {  transform: rotateY(0deg);}100% {  transform: rotateY(0deg);}}
@media screen and (max-width: 768px) {
    .cast .list_01.text li:not(:last-of-type){margin-bottom: 5%;}
    .cast .list_01 {flex-wrap: wrap;margin-bottom: 40px;}
    .cast .list_01 li {width: 70%;margin-bottom: 30px;}
    .cast .list_01 li:nth-of-type(even) {margin-right: 0;}
    .cast .list_01 li .name_wrap {flex-direction: column;}
    .cast .list_01 li .castname {margin-bottom: 0.6em;margin-right: 0;font-size: 16px;}
    .cast .list_01 li .castname .add{top: initial;margin-top: .58em;position: relative;}
    .cast .list_01 li .castname .add img{width: 64px;margin: 0 auto;}
    .cast .list_01 li .actname {font-size: 20px;}
    .cast .list_01.twin {padding-bottom: 105px;}
    .cast .list_01.row-2 {margin-bottom: 0;}
    .cast .list_02 li {display: block;font-size: 15px;line-height: 1.5em;}
    .cast .list_02 li.togashi .staffname {font-size: 24px;}
    .cast .list_02 li.togashi span {display: block;line-height: 1.5em;}
    .cast .list_02 li.nelke {width: 100%;}
    .cast .list_02 li .rolename {margin-bottom: 0.4em;}
    .cast .list_02 li .staffname .logo {width: min(49%, 200px);}
    .cast .list_02.lead li {font-size: 16px;}
    .cast .list_02.flex {justify-content: left;}
    .cast .ensemble {width: 100%;font-size: 4vw;margin: 0 auto 40px;flex-direction: column;}
    .cast .ensemble li {margin: 0 auto;width: 92%;font-size: 16px;}
    .cast .ensemble li dl {flex-direction: column;}
    .cast .ensemble li dt {margin-right: 0;margin-bottom: 0.8em;}
    .cast .ensemble li dd {flex-direction: column;}
    .cast .ensemble li dd .in_list{text-align: left;}
    .cast .ensemble li dd .in_list:not(:last-of-type) {margin-right: inherit;margin-bottom: 0.4em;}
    .cast .other_box p {font-size: 18px;line-height: 1.6em;}
    .cast .other_box ul li {font-size: 16px;line-height: 1.4em;}
}
.modal_box {position: fixed;width: 100%;height: 100vh;top: 0;right: 0;z-index: 1000;overflow: hidden;display: block;opacity: 0;visibility: hidden;cursor: pointer;background-position: center;pointer-events: none;transition: 0.4s;}
.modal_box .modal_inner {position: relative;width: 100%;height: 100%;display: flex;align-items: center;}
.modal_box .modal_inner .img-wrap {position: relative;width: 57vh;padding-top: 5vh;}
.modal_box .modal_inner .img-wrap figure {overflow: hidden;width: 100%;height: 100%;position: relative;border-radius: 0;}
.modal_box .modal_inner .logo-wrap {width: calc((100% - 60vh) / 2);}
.modal_box .modal_inner .logo-wrap figure {margin: 0 auto;width: 60%;transform: translateY(-40%);transition: 0.3s;opacity: 0;}
.modal_box .modal_inner .txt-wrap {width: calc((100% - 60vh) / 2);transform: translateY(40%);transition: 0.3s;opacity: 0;}
.modal_box .modal_inner .txt-wrap .name_block {width: min(80%, 340px);margin: 0 auto;color: #fff;position: relative;text-align: left;display: flex;flex-direction: column;align-items: baseline;}
.modal_box .modal_inner .txt-wrap .name_block .name {font-size: min(24px,2vw);margin-bottom: 4px;display: inline-block;background: var(--key_color);color: #000;padding: 0.3em 0.6em 0.2em;font-weight: bold;}
.modal_box .modal_inner .txt-wrap .name_block .add{display: block;font-size: 16px;color: var(--key_color);margin-top: .2em;font-weight: bold;margin-bottom: .5em;}
.modal_box .modal_inner .txt-wrap .name_block .add.rev{transform: scale(-1,1);}
.modal_box .modal_inner .txt-wrap .name_block .add img{width: min(8vw,100px);}
.modal_box .modal_inner .txt-wrap .name_block .actname {font-size: min(50px,4vw);margin-bottom: 30px;font-weight: bold;background: #000;color: #fff;display: inline-block;padding: 0.2em 0.4em;}
.modal_box .modal_inner .txt-wrap .name_block .furigana {font-size: min(14px,1vw);line-height: 1em;}
.modal_box .modal_inner .txt-wrap .name_block .modal_frame {position: absolute;pointer-events: none;}
.modal_box .modal_inner .txt-wrap .name_block .modal_frame span {left: 0;}
.modal_box .bg_txt {position: absolute;top: 50%;transform: translate(-50%, -50%);z-index: -1;width: 92%;left: 50%;}
.modal_box:before {content: "";position: fixed;background: #000;opacity: 0.8;background-size: cover;width: 100%;height: 100vh;top: 0;left: 0;z-index: -1;}

.modal_box.active {opacity: 1;visibility: visible;right: 0;pointer-events: all;transition: 0.4s;}
.modal_box.active .img-wrap {-webkit-animation-name: scaleOut;        animation-name: scaleOut;-webkit-animation-duration: 0.4s;        animation-duration: 0.4s;-webkit-animation-delay: 0s;        animation-delay: 0s;-webkit-animation-fill-mode: backwards;        animation-fill-mode: backwards;-webkit-animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);        animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);position: relative;overflow-y: hidden;}
.modal_box.active .logo-wrap figure {transform: translateY(0%);transition: 0.5s;opacity: 1;}
.modal_box.active .txt-wrap {transform: translateY(0%);transition: 0.5s;opacity: 1;}
@-webkit-keyframes scaleOut {from {  transform: scale(1, 0);  opacity: 0;}to {  transform: scale(1, 1);  opacity: 1;}}
@keyframes scaleOut {from {  transform: scale(1, 0);  opacity: 0;}to {  transform: scale(1, 1);  opacity: 1;}}
.modal_box .close {cursor: pointer;position: absolute;top: 80px;right: 20px;width: min(4.6vw, 66px);}
.modal_box .close span {position: relative;width: 100%;height: 4vw;display: block;}

@media screen and (max-width: 768px) {
    .modal_box {display: flex;align-items: center;}
    .modal_box .close {width: min(9vw,40px);top: 2vw;right: 0;}
    .modal_box .modal_inner {display: block;width: 92%;margin: 0 auto;height: auto;}
    .modal_box .modal_inner .img-wrap {width: 100%;margin: 0 auto;max-width: 40vh;padding-top: 2vh;}
    .modal_box .modal_inner .logo-wrap {display: none;}
    .modal_box .modal_inner .txt-wrap {width: 100%;max-width: 400px;margin: 0 auto;}
    .modal_box .modal_inner .txt-wrap .name_block {width: 100%;max-width: calc(100% - 50px);margin-left: 0;}
    .modal_box .modal_inner .txt-wrap .name_block .name {font-size: min(20px,6.5vw);}
    .modal_box .modal_inner .txt-wrap .name_block .actname {font-size: min(30px,10vw);margin-bottom: 0;}
    .modal_box .modal_inner .txt-wrap .name_block .furigana {font-size: min(14px,4vw);line-height: 1em;}
    .modal_box .modal_inner .txt-wrap .name_block .add{margin-top: 0.1em;}
    .modal_box .modal_inner .txt-wrap .name_block .add img{width: 90px;}
}
/* ================================= キャスト =================================== */
/* ================================= スケジュール =================================== */
.sch_block {background: #fff;display: flex;align-items: center;justify-content: center;font-size: 50px;font-weight: bold;height: 500px;color: var(--ob_lighten);}
@media screen and (max-width: 768px) {
    .sch_block {height: 300px;font-size: 30px;}
}

.schedule_wrap .schedule {text-align: center;}
.schedule_wrap .schedule .tit {font-size: 30px;line-height: 1em;letter-spacing: 0.1em;font-weight: bold;margin-bottom: 1em;}
@media screen and (max-width: 768px) {
    .schedule_wrap .schedule .tit {font-size: 22px;}
}  
    .schedule_wrap .schedule .text {font-size: 16px;font-weight: bold;font-family: var(--font-noto);margin-bottom: 2em;line-height: 2em;letter-spacing: 0.05em;}
@media screen and (max-width: 768px) {
    .schedule_wrap .schedule .text {font-size: 15px;line-height: 2.1em;letter-spacing: inherit;}
}
.schedule_wrap .schedule .text a {color: #fff;text-decoration: underline;font-weight: normal;padding-left: 0;margin-bottom: 0.6em;display: inline-block;font-size: 1.2em;}
@media screen and (max-width: 768px) {
    .schedule_wrap .schedule .text a {display: block;padding-left: inherit;font-size: 1.2em;}
}
.schedule_wrap .schedule .text strong {font-size: 2em;}
.schedule_wrap .schedule:not(:last-of-type) {margin-bottom: 80px;}

.caution_wrap {margin-bottom: 50px;}

.red-note {position: relative;font-weight: bold;padding: 25px 20px 25px 20px;text-align: center;color: var(--caution);background: #000;font-size: 14px;line-height: 1.6em;border: 1px solid var(--caution);}
.red-note a {color: var(--caution);}

.ticket_price_box .h_box {width: 100%;background: var(--ob_lighten);padding: 14px 10px 10px;text-align: center;}
.ticket_price_box .h_box h3 {font-weight: bold;font-size: clamp(18px, 3vw, 22px);line-height: 1.2em;}
.ticket_price_box .price_list {display: flex;width: 100%;flex-direction: column;color: #fff;}
.ticket_price_box .price_list .price_box .price_inner {text-align: left;margin-bottom: 0em;display: flex;justify-content: space-between;background: var(--key_color);padding: 30px 28px;}
.ticket_price_box .price_list .price_box .price_inner p {display: inline-block;}
.ticket_price_box .price_list .price_box .price_inner .title {font-weight: bold;font-size: clamp(18px, 3vw, 24px);}
.ticket_price_box .price_list .price_box .price_inner .title_s {font-size: clamp(14px, 2vw, 18px);}
.ticket_price_box .price_list .price_box .price_inner .price {font-weight: bold;font-size: clamp(18px, 3vw, 26px);text-align: left;}
.ticket_price_box .price_list .price_box .price_inner .price span {font-size: 0.5em;}
.ticket_price_box .price_list .price_box .price_inner .price_s {font-size: clamp(16px, 2vw, 20px);}
.ticket_price_box .price_list .price_box .price_inner .price:nth-of-type(1) {font-size: clamp(16px, 3vw, 26px);}
.ticket_price_box .price_list .price_box .price_inner .price:nth-of-type(2) {line-height: 1.1em;}
.ticket_price_box .price_list .price_box:not(:last-of-type) {margin-bottom: 10px;}

.ticket_block {font-weight: normal;margin-bottom: 80px;font-family: var(--font-noto);font-size: 16px;line-height: 1.7em;}
.ticket_block .period {padding: 0 0 0.75em;font-weight: bold;font-size: 20px;color: var(--key_color);}
.ticket_block .border-box {border: 1px solid #E7E7E7;padding: 20px;border-radius: 10px;}
.ticket_block .link_underline {text-decoration: underline;color: var(--key_color);}
.ticket_block .tk_head {font-size: 24px;font-weight: bold;line-height: 1.4em;margin-bottom: 30px;position: relative;padding-left: 34px;}
.ticket_block .tk_head:before {position: absolute;content: "";background: url(../images/tk_head_ob.svg) no-repeat center;background-size: contain;width: 24px;height: 24px;top: 48%;transform: translateY(-50%);left: 0;}
.ticket_block .tk_st_txt {display: flex;margin-bottom: 0.3em;background: #000;color: #fff;border-radius: 10px;font-size: 30px;line-height: 1em;text-align: center;padding: 30px;align-items: baseline;justify-content: center;font-weight: bold;}
.ticket_block .tk_st_txt .big {font-size: 1.3em;line-height: 1em;display: inline-block;margin: 0 10px;transform: translateY(2px);letter-spacing: 2px;}
.ticket_block .tk_st_txt .moreless {font-size: 0.5em;}
.ticket_block .tk_st_txt .period {font-size: 20px;line-height: 1.2em;}
.ticket_block .tk_list li {margin-bottom: 30px;}
.ticket_block .tk_list dl {font-size: clamp(16px, 1.7vw, 28px);display: flex;align-items: flex-start;background: #fff;border: 1px solid #000;border-radius: 10px;padding: clamp(18px, 1.7vw, 25px) clamp(14px, 1.4vw, 20px);line-height: 1em;justify-content: space-between;}
.ticket_block .tk_list dl span {font-size: clamp(10px, 0.9vw, 14px);}
.ticket_block .tk_list dd span {font-size: clamp(10px, 0.9vw, 14px);line-height: 0.8em;}
.ticket_block .note_box .block:not(:last-of-type) {margin-bottom: 1em;}
.ticket_block .tk_box {background: #000;padding: 44px 40px;border-radius: 10px;color: #fff;border: 4px solid var(--key_color);}
.ticket_block .tk_box:not(:last-of-type) {margin-bottom: 2em;}
.ticket_block .tk_box .tit {font-size: 20px;line-height: 1.2em;font-weight: bold;color: #fff;margin-bottom: 1em;position: relative;padding-left: 24px;}
.ticket_block .tk_box .tit:before {position: absolute;content: "";background: var(--key_color);width: 14px;height: 14px;border-radius: 50%;top: 50%;transform: translateY(-50%);left: 0;}
.ticket_block .tk_box .in_txt {font-size: 16px;line-height: 1.7em;font-weight: bold;line-height: 2em;}
.ticket_block .tk_box .in_txt .label {font-size: 16px;font-weight: 500;line-height: 1.5em;display: inline-block;margin-bottom: 0.5em;background: var(--key_color);color: #fff;padding: 0.2em 0.4em;}
.ticket_block .tk_box .in_txt strong {font-size: 1.5em;}
.ticket_block .tk_box .in_txt p {font-size: 14px;line-height: 1.6em;}
.ticket_block .tk_box .in_txt .period {font-size: 20px;line-height: 1.6em;}
.ticket_block .tk_box.disactive {filter: grayscale(1);position: relative;overflow: hidden;opacity: .8;}
.ticket_block .tk_box.disactive:before {position: absolute;content: "";background: #000;width: calc(100% + 8px);height:calc(100% + 8px);top: 50%;left: 50%;transform: translate(-50%, -50%);opacity: 0.5;z-index: 3;}
.ticket_block .text-list {font-size: 14px;line-height: 1.7em;}
.ticket_block.tk_type.ippan .box02 .button span {display: inline-block;line-height: 1.5em;font-size: 0.8em;margin-bottom: 0;}
.ticket_block.tk_type .tk_head {margin-bottom: 0.8em;}
.ticket_block .text_link {color: var(--key_color);text-decoration: underline;}
.ticket_block .button {max-width: inherit;}
.ticket_block .button a:before {background: url(../images/icon_arrow.svg) no-repeat center;background-size: contain;}
.ticket_block .big {font-size: 1.2em;line-height: 1.7em;}

@media screen and (max-width: 768px) {
    .caution_wrap {  margin-bottom: 10px;}
    .red-note {  padding: 18px;}
    .ticket_price_box {  flex-direction: column;  padding: calc(var(--main_padding) / 1.5) 0;  border: none;}
    .ticket_price_box .price_list {  width: 100%;}
    .ticket_price_box .price_list .price_box {  flex-direction: column;  align-items: center;  width: 100%;}
    .ticket_price_box .price_list .price_box .price_inner {  margin-bottom: 0;  align-items: center;  padding: 20px 14px;}
    .ticket_price_box .price_list .price_box .price {  margin-right: 0;  margin-bottom: 0em;}
    .ticket_price_box .price_list .price_box .price:nth-of-type(2) {  margin-top: 0.4em;}
    .ticket_price_box .price_list .price_box .notes {  font-size: 12px;  line-height: 1.8em;}
    .ticket_block {  margin-bottom: 50px;}
    .ticket_block .tk_head {  font-size: 22px;  line-height: 1.4em;}
    .ticket_block .tk_st_txt {  display: block;  font-size: 20px;  padding: 20px;}
    .ticket_block .tk_st_txt .txt_head {  display: block;  margin-bottom: 0.3em;}
    .ticket_block .tk_st_txt .txt_head .big {  font-size: 1.3em;  line-height: 1em;  display: inline-block;  margin: 0 4px;  transform: translateY(2px);  letter-spacing: 2px;}
    .ticket_block .tk_list dl {  display: block;  font-size: 20px;  padding: 20px 15px;}
    .ticket_block .tk_list dt {  margin-bottom: 0.3em;}
    .ticket_block .tk_box {  padding: 20px;  border-width: 2px;}
    .ticket_block .tk_box .tit {  font-size: 16px;  line-height: 1.5em;}
    .ticket_block .tk_box .in_txt {  font-size: 13px;}
    .ticket_block .tk_box .in_txt span {  font-size: 14px;}
    .ticket_block .tk_box .border-box .in_txt {  font-size: 16px;}
    .ticket_block.tk_type.ippan .box02 .button span {  display: block;}
    .ticket_block.bottom_box {  font-size: 13px;}
    .ticket_block .big {  font-size: 1.08em;  line-height: 1.7em;}
    .ticket_block .tk_box .border-box .in_txt {  font-size: 16px;}
    .ticket_block .button-green a {  padding: 20px 10px;}
    .ticket_block .button.page_link a {  padding: 20px;  font-size: 22px;}
    .ticket_block.ippan .period {  padding: 0 0 0.5em;  font-weight: bold;  font-size: 18px;}
}
.dl_img {max-width: 800px;margin: 0 auto 2em;}

#other {width: 100%;}
#other .other_img {position: relative;width: 100%;height: 100vh;}
#other .other_img img {position: absolute;width: 92%;height: 100%;-o-object-fit: contain;   object-fit: contain;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width: 1920px;}

@media screen and (max-width: 768px) {#other .other_img img {  width: 100%;}}
@media screen and (max-width: 768px) {#schedule .sec_h {  font-size: 8.6vw;}}





/* ================================= GOODS =================================== */
#goods{}
#goods .goods_wrap{margin-bottom: 60px;}
#goods .figure_box {margin-bottom: 30px;border-radius: 10px;border: 2px solid rgba(0, 0, 0, 0.3607843137);}
#goods .figure_box .swiper-container {border-radius: 10px;}
#goods .figure_box .pagination_box {position: relative;bottom: -28px;}
#goods .figure_box .pagination_box .swiper-pagination {bottom: 0;left: 50%;transform: translateX(-50%);width: 100%;}
#goods .figure_box .pagination_box .swiper-pagination-bullet {margin: 0 3px;background: #fff;opacity: 0.3;}
#goods .figure_box .pagination_box .swiper-pagination-bullet-active {background: var(--key_color);opacity: 1;}
#goods figure {margin: 0;}
#goods figure img {display: block;line-height: 0;border-radius: 10px;}
#goods .btn_wrap {margin-bottom: 60px;}
#goods .button-green a {text-align: center;padding: 20px 40px;}

#goods .button-green a:hover {opacity: 0.8;}
#goods .g_tit {font-size: 20px;line-height: 1.6em;margin-bottom: 10px;}
#goods .txt_box {font-size: 16px;line-height: 1.8em;}
#goods .txt_box p:not(:last-of-type) {margin-bottom: 1em;}
#goods .button {max-width: initial;}
#goods .button a:before {background: url(../images/icon_arrow.svg) no-repeat center;background-size: contain;}
#goods .modal-box .modal-inner .modal-content {margin: 3vh auto 0;}
#goods .modal-box .modal-inner .modal-content .inner-scroll {max-height: calc(70vh - 40px);}
#goods .modal-box .modal-inner .modal-content a {word-break: break-all;}

#twohean{max-width: 800px;margin: 0 auto;}

.cs {padding-top: 98.8%;position: relative;background: #ccc;margin-bottom: 15px;}
.cs figcaption {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);font-weight: bold;color: #fff;font-size: 20px;width: 100%;text-align: center;}

@media only screen and (max-width: 1000px) {
#goods .flex-box.center .box03 {width: 47%;}
}
@media only screen and (max-width: 768px) {
#goods .flex-box .box03 {width: 100%;}
#goods .btn_wrap .flex-box {--flex-gap:10px;}
#goods .good_wrap .flex-box {--flex-gap:50px;}
}
  /* ================================= GOODS =================================== */
  /********************** GUIDE *******************************/
.guide {text-align: left;}
.guide .guide_pages_link {width: 100%;height: auto;margin-bottom: 30px;display: flex;justify-content: space-between;}
.guide .guide_pages_link a {display: block;width: 32%;border: 1px solid var(--key_color);text-align: center;font-size: clamp(14px, 3vw, 18px);color: #fff;line-height: 1.2em;white-space: nowrap;font-weight: bold;padding: 1.2em 0.8em;transition: 0.2s;}
.guide .guide_pages_link a:hover {background-color: var(--key_color);}
.guide .guide_pages_link a.now {background-color: var(--key_color);}
.guide .block .stit {font-size: 24px;line-height: 1.7em;font-weight: bold;text-align: center;margin-bottom: 1em;}
.guide .block .sstit {font-size: 24px;line-height: 1.5em;border-left: 5px solid var(--key_color);padding: 0.25em 0 0.25em 1em;margin-bottom: 1.5em;font-weight: bold;}

.guide h4 {background-color: var(--key_color);margin-bottom: 0.5em;display: inline-block;padding: 0.1em 0.3em 0;}
.guide .block {margin-bottom: 70px;}
.guide .block p {font-size: 16px;line-height: 1.8em;margin-bottom: 1.5em;}
.guide .block a {text-decoration: underline;color: var(--key_color);}
.guide .block.first {border-bottom: 1px solid #ccc;padding-bottom: 40px;margin-bottom: 40px;}
.guide figure img {max-width: 100%;height: auto;margin-bottom: 2em;}
.guide .outer_block figure img {margin-bottom: 1em;}
.guide ul {margin-bottom: 1em;}
.guide ul li {position: relative;padding-left: 1.2em;margin-bottom: 0.2em;font-size: 16px;line-height: 1.8em;}
.guide ul li:before {position: absolute;display: block;content: "・";left: 0;top: 0;}
.guide ul.kome li::before {content: "※";}
.guide .st {font-weight: bold;}
.guide strong {font-weight: bold;font-size: 1.2em;}

@media only screen and (max-width: 768px) {
.guide {font-size: 14px;line-height: 1.7em;}
.guide .block {margin-bottom: 40px;}
.guide .block p {font-size: 14px;}
.guide ul li {font-size: 14px;}
.guide .block .stit {font-size: 18px;}
.guide .block .sstit {font-size: 18px;border-left: 2px solid var(--key_color);margin-bottom: 1em;}
}
.outer_block {border: 1px solid #666;padding: 5%;}
.outer_block .block_head {background: var(--key_color);color: #fff;font-weight: bold;text-align: center;font-size: 28px;margin-bottom: 1.4em;padding: 15px 15px 13px;line-height: 1.4em;}
.outer_block .sstit {background: inherit;color: #fff;margin-bottom: 1em;}
.outer_block .bg_box {background: #fff;padding: max(24px, 3.5%) max(20px, 3%) max(20px, 3%);border-radius: 10px;color: #000;}
.outer_block .bg_box .bg_box_head {text-align: center;font-weight: bold;margin-bottom: 1em;font-size: 26px;background: inherit;color: var(--key_color);padding: 0;display: block;}

.outer_block .bg_box .block {margin-bottom: 0;}
.outer_block .block {margin-bottom: 40px;}
.outer_block .block .button-green a {color: #fff;text-decoration: none;text-align: center;font-size: 20px;}
.outer_block .block .button-green a:hover {opacity: 0.8;}
.outer_block .block a {word-break: break-all;}
.outer_block .block .button {max-width: 100%;}
.outer_block .block .button a {color: #fff;text-decoration: none;text-align: center;}
.outer_block .block .button a:before {background: url(../images/icon_arrow.svg) no-repeat center;background-size: contain;}

.outer_block:not(:last-of-type) {margin-bottom: 50px;}
.outer_block .block h5 span {background: var(--key_color);color: #fff;display: inline-block;padding: 0.3em 0.4em 0.2em;margin-bottom: 0.5em;}
.outer_block .block hr {border-bottom: 1px dashed rgba(255, 255, 255, 0.3019607843);margin: 3em 0;}
.b_block .outer_block {margin-bottom: 20px;}
.b_block:not(:last-of-type) {margin-bottom: 60px;}

@media screen and (max-width: 768px) {
.outer_block .block_head {font-size: 20px;}
.outer_block .bg_box .bg_box_head {font-size: 18px;}
.outer_block .block .button-green a {font-size: 16px;}
.outer_block .block .button a {font-size: 14px;padding: 1em;}
.b_block .outer_block {margin-bottom: 12px;}
}
.dl_img {max-width: 800px;margin: 0 auto 2em;}
#other {width: 100%;}
#other .other_img {position: relative;width: 100%;height: 100vh;}
#other .other_img img {position: absolute;width: 92%;height: 100%;-o-object-fit: contain;    object-fit: contain;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width: 1920px;}

@media screen and (max-width: 768px) {
#other .other_img img {width: 100%;}
}



/* ===============================================
# TOPアニメーション
=============================================== */
.certain {background: #000;position: fixed;width: 100%;height: 100vh;z-index: 9999;overflow: hidden;pointer-events: none;}
.certain .box-wrap-outer {transform: rotate(45deg) scale(2);transform-origin: center;position: absolute;top: 50%;left: 50%;}
.certain .box-wrap {display: flex;flex-wrap: wrap;position: absolute;width: 100vw;height: 100vw;top: 50%;left: 50%;transform: translate(-50%, -50%);transform-origin: center;}
.certain .box04 {background: #000;width: 50vw;height: 50vw;}
.certain .box04:nth-of-type(1) {-webkit-animation: moveT 0.4s ease-in-out both;animation: moveT 0.4s ease-in-out both;-webkit-animation-delay: 0.6s;animation-delay: 0.6s;}
.certain .box04:nth-of-type(2) {-webkit-animation: moveR 0.4s ease-in-out both;animation: moveR 0.4s ease-in-out both;-webkit-animation-delay: 0.6s;animation-delay: 0.6s;}
.certain .box04:nth-of-type(3) {-webkit-animation: moveL 0.4s ease-in-out both;animation: moveL 0.4s ease-in-out both;-webkit-animation-delay: 0.6s;animation-delay: 0.6s;}
.certain .box04:nth-of-type(4) {-webkit-animation: moveB 0.4s ease-in-out both;animation: moveB 0.4s ease-in-out both;-webkit-animation-delay: 0.6s;animation-delay: 0.6s;}
.certain .bg {width: 100%;height: 100%;position: absolute;content: "";opacity: 0.2;background: #000;}
.certain .bg video {width: 100%;-o-object-fit: cover;   object-fit: cover;height: 100%;}
.certain .line-bg {position: absolute;width: 100%;height: 100%;background: #000;top: 0;left: 0;-webkit-animation: delete 0.5s both;        animation: delete 0.5s both;-webkit-animation-delay: 0.4s;        animation-delay: 0.4s;}
.certain .line {position: absolute;width: 100%;height: 100%;top: 0;left: 0;transform: rotate(45deg);-webkit-animation: delete 0.5s both;        animation: delete 0.5s both;-webkit-animation-delay: 0.6s;        animation-delay: 0.6s;}
.certain .line:before {position: absolute;content: "";background: #fff;width: 200vw;height: 1px;top: 50%;left: 50%;transform: translate(-50%, -50%);-webkit-animation: box-open_wide 1s both;        animation: box-open_wide 1s both;-webkit-animation-delay: 0.2s;        animation-delay: 0.2s;}
.certain .line:after {position: absolute;content: "";background: #fff;width: 200vw;height: 1px;top: 50%;left: 50%;transform: translate(-50%, -50%) rotate(90deg);-webkit-animation: box-open_wide 1s both;        animation: box-open_wide 1s both;-webkit-animation-delay: 0.2s;        animation-delay: 0.2s;}
.certain.off {opacity: 0;z-index: -1;transition: 0.4s;}

@-webkit-keyframes box-open_bottom {0% {  -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);          clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}

@keyframes box-open_bottom {0% {  -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);          clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
@-webkit-keyframes box-open_top {0% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);          clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
@keyframes box-open_top {0% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);          clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
@-webkit-keyframes box-open_wide {0% {  -webkit-clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);          clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
@keyframes box-open_wide {0% {  -webkit-clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);          clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
@-webkit-keyframes delete {0% {  opacity: 1;}100% {  opacity: 0;}}
@keyframes delete {0% {  opacity: 1;}100% {  opacity: 0;}}
@-webkit-keyframes moveT {0% {  transform: translate(0, 0);}100% {  transform: translate(-100%, -100%);}}
@keyframes moveT {0% {  transform: translate(0, 0);}100% {  transform: translate(-100%, -100%);}}
@-webkit-keyframes moveR {0% {  transform: translate(0, 0);}100% {  transform: translate(100%, -100%);}}
@keyframes moveR {0% {  transform: translate(0, 0);}100% {  transform: translate(100%, -100%);}}
@-webkit-keyframes moveB {0% {  transform: translate(0, 0);}100% {  transform: translate(100%, 100%);}}
@keyframes moveB {0% {  transform: translate(0, 0);}100% {  transform: translate(100%, 100%);}}
@-webkit-keyframes moveL {0% {  transform: translate(0, 0);}100% {  transform: translate(-100%, 100%);}}
@keyframes moveL {0% {  transform: translate(0, 0);}100% {  transform: translate(-100%, 100%);}}
#bgvid {position: fixed;bottom: 0;left: 0;width: 100%;z-index: 0;mix-blend-mode: screen;opacity: 1;pointer-events: none;}

#fv .top_inner .text_block {transform: scale(1.2);transition: 0.5s;opacity: 0;}
#fv .top_inner .img_block {transform: scale(1.2);transition: 0.5s;opacity: 0;}

.fix_bg .bg_text.text01 {transform: translateY(100%);}
.fix_bg .bg_text.text02 {transform: translateY(-150%);}

.intro_on #fv .bg_txt .txt01 {transform: translateX(0%);transition: 0.5s;}
.intro_on #fv .bg_txt .txt02 {transform: translateX(0%);transition: 0.5s;}
.intro_on #fv .top_inner .text_block {transform: scale(1);transition: 0.7s;transition-delay: 0.3s;opacity: 1;}
.intro_on #fv .top_inner .img_block {transform: scale(1);transition: 0.7s;transition-delay: 0.3s;opacity: 1;}
.intro_on .fix_bg .bg_text.text01 {transform: translateY(-50%);transition: 0.5s;transition-delay: 0.4s;}
.intro_on .fix_bg .bg_text.text02 {transform: translateY(-50%);transition: 0.5s;transition-delay: 0.4s;}
/*# sourceMappingURL=style.css.map */