@charset "utf-8";
/*-----------------------------------------------
 * COMMON
 * FV
 * NEWS
 * MOVIE
 * INTRODUCTION
-------------------------------------------------*/
/*-----------------------------------------------
 * LOADING [top]
-------------------------------------------------*/
html.is-fv-scroll,
body.is-fv-scroll {
	overflow: hidden;
}
@media screen and (min-width:769px){
	body.is-loading .fv__logo,
	body.is-loading .fv__onair,
	body.is-loading .fv__navWrap,
	body.is-loading .fv__bnr,
	body.is-fv-rise .fv__logo,
	body.is-fv-rise .fv__onair,
	body.is-fv-rise .fv__navWrap,
	body.is-fv-rise .fv__bnr {
		opacity: 0;
		visibility: hidden;
		transform: translateY(min(calc(28 / var(--vw-min) * 100vw), 28px));
		transition:
			opacity 0.9s var(--easing-scrani),
			transform 0.9s var(--easing-outquart),
			visibility 0s linear 0.9s;
	}
	body.is-fv-rise .fv__logo.is-fv-rise-in,
	body.is-fv-rise .fv__onair.is-fv-rise-in,
	body.is-fv-rise .fv__navWrap.is-fv-rise-in,
	body.is-fv-rise .fv__bnr.is-fv-rise-in {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		transition-delay: 0s;
	}
	body.is-fv-fadein:not(.is-fv-fadein-start) .fv__logo,
	body.is-fv-fadein:not(.is-fv-fadein-start) .fv__onair,
	body.is-fv-fadein:not(.is-fv-fadein-start) .fv__navWrap,
	body.is-fv-fadein:not(.is-fv-fadein-start) .fv__bnr {
		opacity: 0;
		visibility: hidden;
		transform: translateY(min(calc(28 / var(--vw-min) * 100vw), 28px));
	}
	body.is-fv-fadein .fv__logo,
	body.is-fv-fadein .fv__onair,
	body.is-fv-fadein .fv__navWrap,
	body.is-fv-fadein .fv__bnr {
		transition:
			opacity 0.9s var(--easing-scrani),
			transform 0.9s var(--easing-outquart),
			visibility 0s linear 0.9s;
	}
	body.is-fv-fadein-start .fv__logo,
	body.is-fv-fadein-start .fv__bnr {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		transition:
			opacity 0.9s var(--easing-scrani) 0.08s,
			transform 0.9s var(--easing-outquart) 0.08s,
			visibility 0s linear 0.08s;
	}
	body.is-fv-fadein-start .fv__onair {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		transition:
			opacity 0.9s var(--easing-scrani) 0.32s,
			transform 0.9s var(--easing-outquart) 0.32s,
			visibility 0s linear 0.32s;
	}
	body.is-fv-fadein-start .fv__navWrap {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		transition:
			opacity 0.9s var(--easing-scrani) 0.5s,
			transform 0.9s var(--easing-outquart) 0.5s,
			visibility 0s linear 0.5s;
	}
}
@media screen and (max-width:768px){
	body.is-loading .fv__logo,
	body.is-loading .fv__onair,
	body.is-loading .fv__vs,
	body.is-loading .fv__bnr,
	body.is-fv-fadein:not(.is-fv-fadein-start) .fv__logo,
	body.is-fv-fadein:not(.is-fv-fadein-start) .fv__onair,
	body.is-fv-fadein:not(.is-fv-fadein-start) .fv__vs,
	body.is-fv-fadein:not(.is-fv-fadein-start) .fv__bnr {
		opacity: 0;
		visibility: hidden;
		transform: translateY(calc(16 / var(--vw-min) * 100vw));
	}
	body.is-fv-fadein .fv__logo,
	body.is-fv-fadein .fv__onair,
	body.is-fv-fadein .fv__vs,
	body.is-fv-fadein .fv__bnr {
		transition:
			opacity 1s var(--easing-scrani),
			transform 1s var(--easing-outquart);
	}
	body.is-fv-fadein-start .fv__logo,
	body.is-fv-fadein-start .fv__bnr {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		transition-delay: 0.08s;
	}
	body.is-fv-fadein-start .fv__vs {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		transition-delay: 0.18s;
	}
	body.is-fv-fadein-start .fv__onair {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		transition-delay: 0.32s;
	}
}
@media (prefers-reduced-motion: reduce) {
	body.is-fv-rise .fv__logo,
	body.is-fv-rise .fv__onair,
	body.is-fv-rise .fv__navWrap,
	body.is-fv-rise .fv__bnr,
	body.is-fv-fadein .fv__logo,
	body.is-fv-fadein .fv__onair,
	body.is-fv-fadein .fv__navWrap,
	body.is-fv-fadein .fv__vs,
	body.is-fv-fadein .fv__bnr {
		opacity: 1;
		visibility: visible;
		transform: none;
		transition: none;
	}
}
/*-----------------------------------------------
 * COMMON
-------------------------------------------------*/
.section {
    position: relative;
}
/*-----------------------------------------------
 * FV
-------------------------------------------------*/
.fv {
    position: relative;
    padding-bottom: calc(110 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
    .fv {
        padding-bottom: calc(65 / var(--vw-min) * 100vw);
    }
}
.fv::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -3;
    background: url(../img/common/bg/fv.jpg)no-repeat center/cover;
}
@media screen and (max-width:768px){
    .fv::before {
        background-image: url(../img/common/bg/fv-s.jpg);
    }
}
.fv__stickyWrap {
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    pointer-events: none;
    z-index: 1;
    padding-bottom: calc(120 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
    .fv__stickyWrap {
        position: relative;
        top: auto;
        bottom: auto;
        order: 4;
        padding-bottom: 0;
        margin-top: calc(14 / var(--vw-min) * 100vw);
        pointer-events: auto;
    }
}
.fv__sticky {
    position: sticky;
    top: 0;
    height: min(100%, 100vh);
}
@media screen and (max-width:768px){
    .fv__sticky {
        position: static;
        height: auto;
    }
}
.fv__bnr {
    width: calc(130 / var(--vw-min) * 100vw);
    height: calc(130 / var(--vw-min) * 100vw);
    position: absolute;
    right: calc(15 / var(--vw-min) * 100vw);
    bottom: calc(15 / var(--vw-min) * 100vw);
    border-radius: 50%;
    background-color: #fff;
    pointer-events: auto;
    overflow: hidden;
}
@media screen and (max-width:768px){
    .fv__bnr {
        width: calc(335 / var(--vw-min) * 100vw);
        height: auto;
        position: relative;
        right: auto;
        bottom: auto;
        border-radius: 0;
        margin: auto;
    }
}
.fv__bnrLink {
    width: 100%;
    height: 100%;
    display: block;
}
.fv__bnrLink img {
    width: 100%;
    pointer-events: none;
    transition: transform var(--duration-hover-slow) var(--easing-hover), filter var(--duration-hover-slow) var(--easing-hover);
}
.fvWrap {
    display: flex;
}
@media screen and (max-width:768px){
    .fvWrap {
        flex-direction: column;
        align-items: center;
        padding: calc(30 / var(--vw-min) * 100vw) 0 0;
    }
}
/** left **/
.fv__l {
    width: calc(486 / var(--vw-min) * 100vw);
    position: relative;
}
@media screen and (max-width:768px){
    .fv__l {
        width: 100%;
        display: contents;
    }
}
.fv__lIn {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding: calc(122 / var(--vw-min) * 100vw) 0 calc(100 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
    .fv__lIn {
        display: contents;
        padding: 0;
    }
}
.fv__lBox {
    position: sticky;
    top: 0;
    padding-top: calc(20 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
    .fv__lBox {
        display: contents;
        padding-top: 0;
    }
}
.fv__logo {
    width: calc(366 / var(--vw-min) * 100vw);
    height: calc(158 / var(--vw-min) * 100vw);
    background: url(../img/common/logo/logo.png)no-repeat center/contain;
    margin: 0 auto;
}
@media screen and (max-width:768px){
    .fv__logo {
        width: calc(160 / var(--vw-min) * 100vw);
        height: calc(69 / var(--vw-min) * 100vw);
        order: 1;
    }
}
/**
* onair
**/
.fv__onair {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(12 / var(--vw-min) * 100vw);
    margin: calc(35 / var(--vw-min) * 100vw) auto 0; 
}
@media screen and (max-width:768px){
    .fv__onair {
        order: 3;
        gap: calc(6 / var(--vw-min) * 100vw);
        margin: calc(20 / var(--vw-min) * 100vw) auto 0;
    }
}
.fv__onair::before {
    content: "";
    width: calc(450 / var(--vw-min) * 100vw);
    height: calc(70 / var(--vw-min) * 100vw);
    display: block;
    background: url(../img/top/fv_onair.png)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .fv__onair::before {
        width: calc(335 / var(--vw-min) * 100vw);
        height: calc(53 / var(--vw-min) * 100vw);
    }
}
.fv__onair::after {
    content: "";
    width: calc(230 / var(--vw-min) * 100vw);
    height: calc(30 / var(--vw-min) * 100vw);
    display: block;
    background: url(../img/common/deco/frame4.svg)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .fv__onair::after {
        width: calc(150 / var(--vw-min) * 100vw);
        height: calc(20 / var(--vw-min) * 100vw);
    }
}
/**
* nav
**/
.fv__navWrap {
    width: 100%;
    margin-top: calc(40 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
    .fv__navWrap {
        display: none;
    }
}
@media screen and (min-width:769px){
    .fv__navWrap::after {
        content: "";
        width: calc(216 / var(--vw-min) * 100vw);
        height: calc(28 / var(--vw-min) * 100vw);
        display: block;
        background: url(../img/common/deco/frame5.svg)no-repeat center/contain;
        margin: 0 auto;
    }
    .fv__navTit {
        font-size: calc(36 / var(--vw-min) * 100vw);
        color: var(--color-pinkE1A);
        font-weight: 400;
        line-height: 1;
        text-align: center;
        text-shadow: 0 0 4px #FFF, 0 0 4px #FFF;
        margin-bottom: calc(20 / var(--vw-min) * 100vw);
    }
    .fv__navLists {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        border-top: calc(1 / var(--vw-min) * 100vw) solid var(--color-op50-blue2D9);
        margin-bottom: calc(14 / var(--vw-min) * 100vw);
    }
    .fv__navItem {
        width: calc(100% / 2);
    }
    .fv__navLink {
        font-size: calc(22 / var(--vw-min) * 100vw);
        color: var(--color-blue2D9);
        font-weight: 500;
        letter-spacing: 0;
        line-height: 1;
        position: relative;
        display: flex;
        align-items: center;
        text-shadow: 0 0 4px #FFF, 0 0 4px #FFF;
        border-bottom: calc(1 / var(--vw-min) * 100vw) solid var(--color-op50-blue2D9);
        padding: calc(7 / var(--vw-min) * 100vw) 0 calc(7 / var(--vw-min) * 100vw) calc(30 / var(--vw-min) * 100vw);
        background: rgba(255,255,255,.5);
        text-decoration: none;
    }
    .fv__navLink span {
        position: relative;
        z-index: 1;
    }
    .fv__navLink::after {
        content: "";
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        inset: 0;
        opacity: 0;
        background-color: var(--color-pinkE1A);
        transition: opacity var(--duration-hover) var(--easing-hover);
    }
    .fv__navItem:nth-child(odd) .fv__navLink {
        border-right: calc(1 / var(--vw-min) * 100vw) solid var(--color-op50-blue2D9);
    }
}
/** right **/
.fv__r {
    width: calc(100% - calc(486 / var(--vw-min) * 100vw));
}
@media screen and (max-width:768px){
    .fv__r {
        width: calc(341 / var(--vw-min) * 100vw);
        order: 2;
        margin-top: calc(23 / var(--vw-min) * 100vw);
    }
}
.fv__vs {
    width: calc(800 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
    .fv__vs {
        width: calc(335 / var(--vw-min) * 100vw);
        position: relative;
        margin: 0 auto;
        border: calc(1 / var(--vw-min) * 100vw) solid var(--color-blue2D9);
    }
    .fv__vs::before {
        content: "";
        width: calc(100% + calc(6 / var(--vw-min) * 100vw));
        height: calc(100% + calc(6 / var(--vw-min) * 100vw));
        display: block;
        position: absolute;
        top: calc(-4 / var(--vw-min) * 100vw);
        left: calc(-4 / var(--vw-min) * 100vw);
        border: calc(1 / var(--vw-min) * 100vw) solid var(--color-blue2D9);
    }
}
.fv__vsItem img {
    width: 100%;
    pointer-events: none;
}
/**
* deco
**/
.fv .deco__cloud {
    width: calc(680 / var(--vw-min) * 100vw);
    height: calc(295 / var(--vw-min) * 100vw);
    position: absolute;
    bottom: calc(-8 / var(--vw-min) * 100vw);
    right: 0;
    z-index: -1;
    overflow: hidden;
}
@media screen and (max-width:768px){
    .fv .deco__cloud {
        width: calc(191 / var(--vw-min) * 100vw);
        height: calc(152 / var(--vw-min) * 100vw);
        bottom: calc(-6 / var(--vw-min) * 100vw);
    }
}
.fv .deco__cloud::before {
    content: "";
    width: calc(939 / var(--vw-min) * 100vw);
    height: calc(295 / var(--vw-min) * 100vw);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../img/common/deco/cloud.png)no-repeat left/contain;
    transform: scale(-1,1);
}
@supports (background-image: url(../img/common/deco/cloud.webp)){
	.fv .deco__cloud::before {
		background-image: url(../img/common/deco/cloud.webp);
	}
}
@media screen and (max-width:768px){
    .fv .deco__cloud::before {
        width: calc(478 / var(--vw-min) * 100vw);
        height: calc(150 / var(--vw-min) * 100vw);
    }
}
/*-----------------------------------------------
 * NEWS
-------------------------------------------------*/
.news {
    padding: min(calc(110 / var(--vw-min) * 100vw),110px) 0 min(calc(105 / var(--vw-min) * 100vw),105px);
}
@media screen and (max-width:768px){
    .news {
        padding: calc(36 / var(--vw-min) * 100vw) 0 calc(70 / var(--vw-min) * 100vw);
    }
}
.news .linkBtn.js-scrani {
    --scrani-delay: 0.45s;
}
.news .officialBtn.js-scrani {
    --scrani-delay: 0.5s;
}
.newsWrap {
    width: min(calc(1100 / var(--vw-min) * 100vw),1100px);
    margin: 0 auto;
}
@media screen and (max-width:768px){
    .newsWrap {
        width: 100%;
        padding: 0 calc(20 / var(--vw-min) * 100vw);
    }
}
@media screen and (min-width:769px){
    .news .cont-titWrap {
        flex-direction: row;
        align-items: flex-end;
    }
}
.news .cont-tit-en::before {
    width: min(calc(232 / var(--vw-min) * 100vw),232px);
    height: min(calc(39 / var(--vw-min) * 100vw),39px);
    background: url(../img/common/tit/news.svg)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .news .cont-tit-en::before {
        width: calc(165 / var(--vw-min) * 100vw);
        height: calc(26 / var(--vw-min) * 100vw);
    }
}
.news .cont-tit-en::after {
    width: min(calc(261 / var(--vw-min) * 100vw),261px);
    height: min(calc(102 / var(--vw-min) * 100vw),102px);
    top: max(calc(-67 / var(--vw-min) * 100vw),-67px);
    left: max(calc(-60 / var(--vw-min) * 100vw),-60px);
    background: url(../img/common/tit/news-blur.svg)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .news .cont-tit-en::after {
        width: calc(165 / var(--vw-min) * 100vw);
        height: calc(57 / var(--vw-min) * 100vw);
        top: calc(-38 / var(--vw-min) * 100vw);
        left: 0;
        right: 0;
    }
}
.news .cont-tit-ja {
    flex-direction: row;
}
@media screen and (max-width:768px){
    .news .cont-tit-ja {
        flex-direction: column;
    }
}
.newsCont {
    display: flex;
    padding-top: min(calc(45 / var(--vw-min) * 100vw),45px);
}
@media screen and (max-width:768px){
    .newsCont {
        flex-direction: column;
        gap: calc(50 / var(--vw-min) * 100vw);
        padding-top: calc(30 / var(--vw-min) * 100vw);
    }
}
/**
* left
**/
.news__l {
    width: min(calc(650 / var(--vw-min) * 100vw),650px);
    min-height: min(calc(300 / var(--vw-min) * 100vw),300px);
}
@media screen and (max-width:768px){
    .news__l {
        width: 100%;
        min-height: unset;
    }
}
.news__lists {
    display: flex;
    flex-direction: column;
    gap: min(calc(22 / var(--vw-min) * 100vw),22px);
}
@media screen and (max-width:768px){
    .news__lists {
        gap: calc(16 / var(--vw-min) * 100vw);
    }
}
.news__link {
    display: flex;
    padding-bottom: min(calc(25 / var(--vw-min) * 100vw),25px);
    border-bottom: min(calc(1 / var(--vw-min) * 100vw),1px) solid var(--color-op40-blue2D9);
    text-decoration: none;
}
@media screen and (max-width:768px){
    .news__link {
        flex-direction: column;
        gap: calc(5 / var(--vw-min) * 100vw);
        padding-bottom: calc(12 / var(--vw-min) * 100vw);
        border-width: calc(1 / var(--vw-min) * 100vw);
    }
}
.news__time {
    font-size: min(calc(22 / var(--vw-min) * 100vw),22px);
    color: var(--color-blue2D9);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0em;
    flex-shrink: 0;
}
@media screen and (max-width:768px){
    .news__time {
        font-size: calc(18 / var(--vw-min) * 100vw);
        line-height: 1;
    }
}
.news__tit {
    font-size: min(calc(15 / var(--vw-min) * 100vw),15px);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.7333;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
	overflow: hidden;
}
@media screen and (max-width:768px){
    .news__tit {
        font-size: calc(12 / var(--vw-min) * 100vw);
        width: 100%;
    }
}
.news .linkBtn {
    justify-content: flex-end;
    margin-top: min(calc(40 / var(--vw-min) * 100vw),40px);
}
@media screen and (max-width:768px){
    .news .linkBtn {
        margin-top: calc(30 / var(--vw-min) * 100vw);
    }
}
/**
* right
**/
.news__r {
    width: calc(100% - min(calc(650 / var(--vw-min) * 100vw),650px));
    position: relative;
}
@media screen and (max-width:768px){
    .news__r {
        width: 100%;
    }
}
.officialBtn {
    width: min(calc(380 / var(--vw-min) * 100vw),380px);
    position: relative;
    margin-left: auto;
}
@media screen and (max-width:768px){
    .officialBtn {
        width: 100%;
    }
}
.officialBtn::before {
    content: "";
    width: min(calc(263 / var(--vw-min) * 100vw),263px);
    height: min(calc(69 / var(--vw-min) * 100vw),69px);
    display: block;
    position: absolute;
    top: max(calc(-56 / var(--vw-min) * 100vw),-56px);
    right: max(calc(-38 / var(--vw-min) * 100vw),-38px);
    background: url(../img/common/deco/followus.svg)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .officialBtn::before {
        width: calc(187 / var(--vw-min) * 100vw);
        height: calc(80 / var(--vw-min) * 100vw);
        top: calc(-55 / var(--vw-min) * 100vw);
        right: 0;
    }
}
.officialBtnLink {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border: min(calc(1 / var(--vw-min) * 100vw),1px) solid var(--color-pinkE1A);
    padding: min(calc(6 / var(--vw-min) * 100vw),6px);
    background-color: rgba(255,255,255,.3);
    text-decoration: none;
    transition: transform var(--duration-hover) var(--easing-hover-bounce), background-color var(--duration-hover) var(--easing-hover);
}
@media screen and (max-width:768px){
    .officialBtnLink {
        border-width: calc(1 / var(--vw-min) * 100vw);
        padding: calc(5 / var(--vw-min) * 100vw);
    }
}
.officialBtnLink::before,
.officialBtnLink::after {
    content: "";
    width: min(calc(50 / var(--vw-min) * 100vw),50px);
    height: min(calc(50 / var(--vw-min) * 100vw),50px);
    display: block;
    position: absolute;
    z-index: 2;
    -webkit-mask: url(../img/common/deco/frame.svg)no-repeat center/contain;
    mask: url(../img/common/deco/frame.svg)no-repeat center/contain;
    background-color: var(--color-pinkE1A);
    pointer-events: none;
}
@media screen and (max-width:768px){
    .officialBtnLink::before,
    .officialBtnLink::after {
        width: calc(50 / var(--vw-min) * 100vw);
        height: calc(50 / var(--vw-min) * 100vw);
    }
}
.officialBtnLink::before {
    top: 0;
    left: 0;
}
.officialBtnLink::after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}
.officialBtnIn {
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: min(calc(16 / var(--vw-min) * 100vw),16px);
    padding: min(calc(27 / var(--vw-min) * 100vw),27px) 0;
    background-image: var(--green-90gradient);
    overflow: hidden;
}
@media screen and (max-width:768px){
    .officialBtnIn {
        gap: calc(10 / var(--vw-min) * 100vw);
        padding: calc(21 / var(--vw-min) * 100vw) 0;
    }
}
.officialBtnIn::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset: 0;
    background: url(../img/common/deco/wave.png)no-repeat center/contain;
    opacity: .4;
}
@media screen and (max-width:768px){
    .officialBtnIn::before {
        background-size: cover;
    }
}
.officialBtn__txt {
    font-size: min(calc(48 / var(--vw-min) * 100vw),48px);
    color: #fff;
    font-weight: 400;
    line-height: 1;
}
@media screen and (max-width:768px){
    .officialBtn__txt {
        font-size: calc(40 / var(--vw-min) * 100vw);
    }
}
.officialBtnLink.--official-x .officialBtn__icon {
    width: min(calc(26 / var(--vw-min) * 100vw),26px);
    height: min(calc(27 / var(--vw-min) * 100vw),27px);
    display: block;
    -webkit-mask: url(../img/common/sns/icon_x.svg)no-repeat center/contain;
    mask: url(../img/common/sns/icon_x.svg)no-repeat center/contain;
    background-color: #fff;
    transition: transform var(--duration-hover) var(--easing-hover-bounce);
}
@media screen and (max-width:768px){
    .officialBtnLink.--official-x .officialBtn__icon {
        width: calc(26 / var(--vw-min) * 100vw);
        height: calc(27 / var(--vw-min) * 100vw);
    }
}
/**
* bg
**/
.newsBg {
    width: min(100vw,1366px);
    height: min(calc(776 / var(--vw-min) * 100vw),776px);
    position: absolute;
    top: min(calc(120 / var(--vw-min) * 100vw),120px);
    right: 0;
    left: 0;
    z-index: -3;
    margin: auto;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%);
}
#news.is-bg-loaded .newsBg {
    background: url(../img/common/bg/cloud.jpg)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .newsBg {
        width: 100%;
        height: calc(570 / var(--vw-min) * 100vw);
        top: calc(54 / var(--vw-min) * 100vw);
        -webkit-mask-image: linear-gradient(to top, transparent 0%, #000 12%, #000 88%, transparent 100%);
        mask-image: linear-gradient(to top, transparent 0%, #000 12%, #000 88%, transparent 100%);
    }
    #news.is-bg-loaded .newsBg {
        background-image: url(../img/common/bg/cloud-s.png);
    }
}
@supports (background-image: url(../img/common/bg/cloud-s.webp)){
    @media screen and (max-width:768px){
        #news.is-bg-loaded .newsBg {
            background-image: url(../img/common/bg/cloud-s.webp);
        }
    }
}
.news .deco__shine {
    width: min(calc(535 / var(--vw-min) * 100vw),535px);
    height: min(calc(1052 / var(--vw-min) * 100vw),1052px);
    display: block;
    position: absolute;
    top: max(calc(-128 / var(--vw-min) * 100vw),-128px);
    right: 0;
    z-index: -2;
    opacity: .5;
}
#news.is-bg-loaded .deco__shine {
    background: url(../img/common/deco/shine.png)no-repeat center/contain;
}
@supports (background-image: url(../img/common/deco/shine.webp)){
    #news.is-bg-loaded .deco__shine {
        background-image: url(../img/common/deco/shine.webp);
    }
}
@media screen and (max-width:768px){
    .news .deco__shine {
        width: calc(277 / var(--vw-min) * 100vw);
        height: calc(545 / var(--vw-min) * 100vw);
        top: calc(-55 / var(--vw-min) * 100vw);
    }
}
/*-----------------------------------------------
 * MOVIE
-------------------------------------------------*/
.movie {
    padding: min(calc(105 / var(--vw-min) * 100vw),105px) 0 min(calc(180 / var(--vw-min) * 100vw),180px);
}
@media screen and (max-width:768px){
    .movie {
        padding: calc(40 / var(--vw-min) * 100vw) 0 calc(80 / var(--vw-min) * 100vw);
    }
}
.movie .movieCont.js-scrani {
    --scrani-delay: 0.18s;
}
.movieWrap {
    position: relative;
    z-index: 2;
}
.movie::before {
    content: "";
    width: 100%;
    height: calc(1012 / var(--vw-min) * 100vw);
    display: block;
    position: absolute;
    top: min(calc(105 / var(--vw-min) * 100vw),105px);
    left: 0;
    z-index: 1;
    pointer-events: none;
}
#movie.is-bg-loaded::before {
    background: url(../img/common/bg/grd.png)no-repeat center/cover;
}
@supports (background-image: url(../img/common/bg/grd.webp)){
    #movie.is-bg-loaded::before {
        background-image: url(../img/common/bg/grd.webp);
    }
}
@media screen and (max-width:768px){
    .movie::before {
        width: 100%;
        height: calc(426 / var(--vw-min) * 100vw);
        top: calc(90 / var(--vw-min) * 100vw);
    }
    #movie.is-bg-loaded::before {
        background-image: url(../img/common/bg/grd-s.png);
    }
}
.movie .cont-tit-en::before {
    width: min(calc(248 / var(--vw-min) * 100vw),248px);
    height: min(calc(39 / var(--vw-min) * 100vw),39px);
    background: url(../img/common/tit/movie.svg)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .movie .cont-tit-en::before {
        width: calc(165 / var(--vw-min) * 100vw);
        height: calc(26 / var(--vw-min) * 100vw);
    }
}
.movie .cont-tit-en::after {
    width: min(calc(282 / var(--vw-min) * 100vw),282px);
    height: min(calc(99 / var(--vw-min) * 100vw),99px);
    top: max(calc(-70 / var(--vw-min) * 100vw),-70px);
    left: max(calc(-10 / var(--vw-min) * 100vw),-10px);
    background: url(../img/common/tit/movie-blur.svg)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .movie .cont-tit-en::after {
        width: calc(160 / var(--vw-min) * 100vw);
        height: calc(56 / var(--vw-min) * 100vw);
        top: calc(-40 / var(--vw-min) * 100vw);
        left: 0;
        right: 0;
        margin: auto;
    }
}
.movieCont {
    position: relative;
    margin-top: min(calc(50 / var(--vw-min) * 100vw),50px);
}
@media screen and (max-width:768px){
    .movieCont {
        margin-top: calc(30 / var(--vw-min) * 100vw);
    }
}
.movieSwiper {
    overflow: hidden;
}
.movie__item.swiper-slide {
    width: calc(100vw - min(calc(566 / var(--vw-min) * 100vw), 566px)); 
    max-width: 100vh;   
    position: relative;
    margin: 0 min(calc(30 / var(--vw-min) * 100vw),30px); 
}
@media screen and (max-width:768px){
    .movie__item.swiper-slide {
        width: calc(295 / var(--vw-min) * 100vw);
        margin: 0 calc(7 / var(--vw-min) * 100vw);
    }
}
.movie__itemIn {
    position: relative;
    display: flex;
    border: min(calc(1 / var(--vw-min) * 100vw),1px) solid var(--color-pinkE1A);
    padding: min(calc(7 / var(--vw-min) * 100vw),7px);
    background-color: rgba(255,255,255,.3);
}
@media screen and (max-width:768px){
    .movie__itemIn {
        border-width: calc(1 / var(--vw-min) * 100vw);
        padding: calc(4 / var(--vw-min) * 100vw);
    }
}
.movie__itemIn::before,
.movie__itemIn::after {
    content: "";
    width: min(calc(80 / var(--vw-min) * 100vw),80px);
    height: min(calc(80 / var(--vw-min) * 100vw),80px);
    display: block;
    position: absolute;
    z-index: 2;
    -webkit-mask: url(../img/common/deco/frame.svg)no-repeat center/contain;
    mask: url(../img/common/deco/frame.svg)no-repeat center/contain;
    background-color: var(--color-pinkE1A);
    pointer-events: none;
}
@media screen and (max-width:768px){
    .movie__itemIn::before,
    .movie__itemIn::after {
        width: calc(50 / var(--vw-min) * 100vw);
        height: calc(50 / var(--vw-min) * 100vw);
    }
}
.movie__itemIn::before {
    top: 0;
    left: 0;
}
.movie__itemIn::after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}
.movieBtn {
    width: 100%;
    padding-top: 56.2341%;
	position: relative;
    overflow: hidden;
    cursor: pointer;
}
.movieBtn::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset: 0;
    z-index: 1;
    margin: auto;
    background-image: var(--green-gradient);
    opacity: .8;
    pointer-events: none;
}
.movieBtn img {
	width:100%;
	height:100%;
    position: absolute;
    inset: 0;
	display: block;
	object-fit: cover;
	pointer-events: none;
    transition: transform var(--duration-hover-slow) var(--easing-hover), filter var(--duration-hover-slow) var(--easing-hover);
}
.movie__tit {
    font-size: min(calc(16 / var(--vw-min) * 100vw),16px);
    color: var(--color-blue2D9);
    font-weight: 500;
    line-height: 1.125;
    text-align: center;
    margin-top: min(calc(22 / var(--vw-min) * 100vw),22px);
}
@media screen and (max-width:768px){
    .movie__tit {
        font-size: calc(12 / var(--vw-min) * 100vw);
        margin-top: calc(14 / var(--vw-min) * 100vw);
    }
}
.movie__yt-play {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}
.movie__yt-play::before,
.movie__yt-play::after {
    content: "";
    width: min(calc(160 / var(--vw-min) * 100vw),160px);
    height: min(calc(160 / var(--vw-min) * 100vw),160px);
    display: block;
    position: absolute;
    inset: 0;
    margin: auto;
}
.movie__yt-play::before {
    background: url(../img/common/deco/playTxt.png)no-repeat center/contain;
    animation: 20s ani_rotate01 linear infinite;
    animation-play-state: var(--loop-ani-play, running);
}
.movie__yt-play::after {
    background: url(../img/common/deco/playArrow.png)no-repeat center/contain;
    transition: transform var(--duration-hover) var(--easing-hover-bounce);
}
@media screen and (max-width:768px){
    .movie__yt-play::before,
    .movie__yt-play::after {
        width: calc(80 / var(--vw-min) * 100vw);
        height: calc(80 / var(--vw-min) * 100vw);
    }
}
/**
* deco
**/
.movie .deco__cloud {
    width: min(calc(422 / var(--vw-min) * 100vw),422px);
    height: min(calc(295 / var(--vw-min) * 100vw),295px);
    position: absolute;
    top: max(calc(-126 / var(--vw-min) * 100vw),-126px);
    left: 0;
    overflow: hidden;
    pointer-events: none;
}
@media screen and (max-width:768px){
    .movie .deco__cloud {
        width: calc(142 / var(--vw-min) * 100vw);
        height: calc(150 / var(--vw-min) * 100vw);
        top: calc(-25 / var(--vw-min) * 100vw);
    }
}
.movie .deco__cloud::before {
    content: "";
    width: min(calc(939 / var(--vw-min) * 100vw),939px);
    height: min(calc(295 / var(--vw-min) * 100vw),295px);
    display: block;
    position: absolute;
    top: 0;
    right: 0;
}
#movie.is-bg-loaded .deco__cloud::before {
    background: url(../img/common/deco/cloud.png)no-repeat center/contain;
}
@supports (background-image: url(../img/common/deco/cloud.webp)){
	#movie.is-bg-loaded .deco__cloud::before {
		background-image: url(../img/common/deco/cloud.webp);
	}
}
@media screen and (max-width:768px){
    .movie .deco__cloud::before {
        width: calc(478 / var(--vw-min) * 100vw);
        height: calc(150 / var(--vw-min) * 100vw);
    }
}
.movieBg {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset: 0;
    z-index: 3;
    margin: auto;
    background-color: rgba(0,0,0,.4);
    transition: .3s ease;
    pointer-events: none;
}
.movie__item.swiper-slide-active .movieBg {
    opacity: 0;
}
/**
* arrow
**/
.movie__arrowWrap {
    width: calc(100vw - min(calc(566 / var(--vw-min) * 100vw), 566px)); 
    max-width: 100vh;  
    position: absolute;
    inset: 0;
    z-index: 3;
    margin: 0 auto;
}
@media screen and (max-width:768px){
    .movie__arrowWrap {
        width: calc(295 / var(--vw-min) * 100vw);
    }
}
.movie__arrowWrapIn {
    width: 100%;
    padding-top: 57%;
    position: absolute;
}
/*-----------------------------------------------
 * INTRODUCTION
-------------------------------------------------*/
.introduction {
    padding: min(calc(100 / var(--vw-min) * 100vw),100px) 0 min(calc(160 / var(--vw-min) * 100vw),160px);
}
@media screen and (max-width:768px){
    .introduction {
        padding: calc(80 / var(--vw-min) * 100vw) 0 calc(112 / var(--vw-min) * 100vw);
    }
}
.introWrap {
    position: relative;
}
.introCont {
    width: min(calc(800 / var(--vw-min) * 100vw),800px);
    position: relative;
    z-index: 4;
    border-radius: min(calc(400 / var(--vw-min) * 100vw),400px) min(calc(400 / var(--vw-min) * 100vw),400px) 0 0;
    margin: 0 auto;
    padding: min(calc(145 / var(--vw-min) * 100vw),145px) 0 min(calc(75 / var(--vw-min) * 100vw),75px);
    overflow: hidden;
}
#introduction.is-bg-loaded .introCont {
    background: url(../img/common/bg/intro.jpg)no-repeat center/cover;
}
@media screen and (max-width:768px){
    .introCont {
        width: calc(335 / var(--vw-min) * 100vw);
        border-radius: calc(400 / var(--vw-min) * 100vw) calc(400 / var(--vw-min) * 100vw) 0 0;
        padding: calc(60 / var(--vw-min) * 100vw) 0 calc(47 / var(--vw-min) * 100vw);
    }
}
.introCont::before {
    content: "";
    width: calc(100% - min(calc(12 / var(--vw-min) * 100vw),12px));
    height: calc(100% - min(calc(12 / var(--vw-min) * 100vw),12px));
    display: block;
    position: absolute;
    top: min(calc(6 / var(--vw-min) * 100vw),6px);
    left: min(calc(6 / var(--vw-min) * 100vw),6px);
    border-radius: min(calc(400 / var(--vw-min) * 100vw),400px) min(calc(400 / var(--vw-min) * 100vw),400px) 0 0;
    border: min(calc(1 / var(--vw-min) * 100vw),1px) solid var(--color-pinkE1A);
    pointer-events: none;
}
@media screen and (max-width:768px){
    .introCont::before {
        width: calc(100% - calc(8 / var(--vw-min) * 100vw));
        height: calc(100% - calc(8 / var(--vw-min) * 100vw));
        top: calc(3 / var(--vw-min) * 100vw);
        left: calc(3 / var(--vw-min) * 100vw);
        border-radius: calc(400 / var(--vw-min) * 100vw) calc(400 / var(--vw-min) * 100vw) 0 0;
        border-width: calc(1 / var(--vw-min) * 100vw);
    }
}
.introduction .cont-titWrap {
    gap: min(calc(5 / var(--vw-min) * 100vw),5px);
}
@media screen and (max-width:768px){
    .introduction .cont-titWrap {
        gap: calc(2 / var(--vw-min) * 100vw);
    }
}
.introduction .cont-titWrap::after {
    content: "";
    width: min(calc(18 / var(--vw-min) * 100vw),18px);
    height: min(calc(20 / var(--vw-min) * 100vw),20px);
    display: block;
    -webkit-mask: url(../img/common/deco/flower.svg)no-repeat center/contain;
    mask: url(../img/common/deco/flower.svg)no-repeat center/contain;
    background-image: var(--pink-gradient);
}
@media screen and (max-width:768px){
    .introduction .cont-titWrap::after {
        width: calc(14 / var(--vw-min) * 100vw);
        height: calc(15 / var(--vw-min) * 100vw);
    }
}
.introduction .cont-tit-en {
    font-size: min(calc(100 / var(--vw-min) * 100vw),100px);
    color: var(--color-op60-blue2D9);
    font-weight: 400;
    line-height: 1;
    text-align: center;
}
@media screen and (max-width:768px){
    .introduction .cont-tit-en {
        font-size: calc(50 / var(--vw-min) * 100vw);
    }
}
.intro__txtWrap {
    padding-top: min(calc(19 / var(--vw-min) * 100vw),19px);
}
@media screen and (max-width:768px){
    .intro__txtWrap {
        padding-top: calc(9 / var(--vw-min) * 100vw);
    }
}
.intro__txt {
    font-size: min(calc(18 / var(--vw-min) * 100vw),18px);
    font-weight: 500;
    line-height: 2.5556;
    letter-spacing: 1.08px;
    text-align: center;
}
@media screen and (max-width:768px){
    .intro__txt {
        font-size: calc(12 / var(--vw-min) * 100vw);
    }
}
.intro__txt.--mt {
    margin-top: min(calc(24 / var(--vw-min) * 100vw),24px);
}
@media screen and (max-width:768px){
    .intro__txt.--mt {
        margin-top: calc(20 / var(--vw-min) * 100vw);
    }
}
/**
* deco
**/
.intro__frame::before,
.intro__frame::after {
    content: "";
    width: min(calc(200 / var(--vw-min) * 100vw),200px);
    height: min(calc(248 / var(--vw-min) * 100vw),248px);
    display: block;
    position: absolute;
    bottom: min(calc(10 / var(--vw-min) * 100vw),10px);
    background-color: var(--color-op30-blue2D9);
}
#introduction.is-bg-loaded .intro__frame::before,
#introduction.is-bg-loaded .intro__frame::after {
    -webkit-mask: url(../img/common/deco/frame2.svg)no-repeat center/contain;
    mask: url(../img/common/deco/frame2.svg)no-repeat center/contain;
}
.intro__frame::before {
    left: min(calc(10 / var(--vw-min) * 100vw),10px);
    transform: scale(-1,1);
}
.intro__frame::after {
    right: min(calc(10 / var(--vw-min) * 100vw),10px);
}
@media screen and (max-width:768px){
    .intro__frame::before,
    .intro__frame::after {
        width: calc(80 / var(--vw-min) * 100vw);
        height: calc(99 / var(--vw-min) * 100vw);
        bottom: calc(6 / var(--vw-min) * 100vw);
    }
    .intro__frame::before {
        left: calc(6 / var(--vw-min) * 100vw);
    }
    .intro__frame::after {
        right: calc(6 / var(--vw-min) * 100vw);
    }
}
/**
* bg
**/
.introBgWrap {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset: 0;
    z-index: -3;
    margin: auto;
}
.introBgWrap::before {
    content: "";
    width: 100%;
    height: min(calc(410 / var(--vw-min) * 100vw),410px);
    display: block;
    position: absolute;
    top: max(calc(-270 / var(--vw-min) * 100vw),-270px);
    left: 0;
    z-index: 3;
    background-image: var(--green268-0gradient);
}
@media screen and (max-width:768px){
    .introBgWrap::before {
        height: calc(113 / var(--vw-min) * 100vw);
        top: calc(-33 / var(--vw-min) * 100vw);
    }
}
.introBgWrap::after {
    content: "";
    width: 100%;
    height: min(calc(460 / var(--vw-min) * 100vw),460px);
    display: block;
    position: absolute;
    bottom: min(calc(309 / var(--vw-min) * 100vw),309px);
    left: 0;
    z-index: 2;
    background-image: var(--green268-gradient);
}
@media screen and (max-width:768px){
    .introBgWrap::after {
        height: calc(113 / var(--vw-min) * 100vw);
        bottom: calc(203 / var(--vw-min) * 100vw);
    }
}
.introBg.--top {
    width: 100%;
    height: min(calc(768 / var(--vw-min) * 100vw),768px);
    position: absolute;
    top: max(calc(-450 / var(--vw-min) * 100vw),-450px);
    z-index: 1;
}
#introduction.is-bg-loaded .introBg.--top {
    background: url(../img/common/bg/forest.png)no-repeat center/cover;
}
@supports (background-image: url(../img/common/bg/forest.webp)){
    #introduction.is-bg-loaded .introBg.--top {
        background-image: url(../img/common/bg/forest.webp);
    }
}
@media screen and (max-width:768px){
    .introBg.--top {
        height: calc(218 / var(--vw-min) * 100vw);
        top: calc(-131 / var(--vw-min) * 100vw);
    }
}
.introBg.--top::before {
    content: "";
    width: 100%;
    height: calc(200 / var(--vw-min) * 100vw);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background-image: var(--greenB7E-gradient);
}
@media screen and (max-width:768px){
    .introBg.--top::before {
        height: calc(113 / var(--vw-min) * 100vw);
    }
}
.introBg.--bottom {
    width: 100%;
    height: min(calc(768 / var(--vw-min) * 100vw),768px);
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
}
#introduction.is-bg-loaded .introBg.--bottom {
    background: url(../img/common/bg/forest2.jpg)no-repeat center/cover;
}
@supports (background-image: url(../img/common/bg/forest2.webp)){
    #introduction.is-bg-loaded .introBg.--bottom {
        background-image: url(../img/common/bg/forest2.webp);
    }
}
@media screen and (max-width:768px){
    .introBg.--bottom {
        height: calc(316 / var(--vw-min) * 100vw);
    }
}
.introBg.--green {
    width: 100%;
    height: calc(100% - min(calc(136 / var(--vw-min) * 100vw),136px));
    display: block;
    position: absolute;
    bottom: 0;
    z-index: 1;
    background-color: var(--color-green268);
}
@media screen and (max-width:768px){
    .introBg.--green {
        height: calc(100% - calc(80 / var(--vw-min) * 100vw));
    }
}
.introBg.--introSlider {
    width: 100vw;
    height: 100%;
    position: absolute;
    inset: 0;
    padding: min(calc(150 / var(--vw-min) * 100vw),150px) 0;
}
@media screen and (max-width:768px){
    .introBg.--introSlider {
        padding: 0;
    }
}
.introBg.--introSlider::before {
    content: "";
    width: 100%;
    height: min(calc(80 / var(--vw-min) * 100vw),80px);
    display: block;
    position: sticky;
    top: 50%;
    left: 0;
    background-color: var(--color-green31A);
    animation: intro__slider 20s linear reverse infinite;
    animation-play-state: var(--loop-ani-play, running);
}
#introduction.is-bg-loaded .introBg.--introSlider::before {
    -webkit-mask: url(../img/common/deco/introSlider.svg)repeat-x left/min(calc(1347 / var(--vw-min) * 100vw),1347px) min(calc(80 / var(--vw-min) * 100vw),80px);
    mask: url(../img/common/deco/introSlider.svg)repeat-x left/min(calc(1347 / var(--vw-min) * 100vw),1347px) min(calc(80 / var(--vw-min) * 100vw),80px);
}
@media screen and (max-width:768px){
    .introBg.--introSlider::before {
        height: calc(40 / var(--vw-min) * 100vw);
        position: absolute;
        top: calc(-20 / var(--vw-min) * 100vw);
    }
    #introduction.is-bg-loaded .introBg.--introSlider::before {
        -webkit-mask-size: calc(674 / var(--vw-min) * 100vw) calc(40 / var(--vw-min) * 100vw);
        mask-size: calc(674 / var(--vw-min) * 100vw) calc(40 / var(--vw-min) * 100vw);
    }
}
@keyframes intro__slider {
	0%{
		-webkit-mask-position: 0 center;
		mask-position: 0 center;
	}
	100%{
		-webkit-mask-position:min(calc(1347 / var(--vw-min) * 100vw),1347px) center;
		mask-position:min(calc(1347 / var(--vw-min) * 100vw),1347px) center;
	}
}
@media screen and (max-width:768px){
    @keyframes intro__slider {
        0%{
            -webkit-mask-position: 0 center;
            mask-position: 0 center;
        }
        100%{
            -webkit-mask-position:calc(674 / var(--vw-min) * 100vw) center;
            mask-position:calc(674 / var(--vw-min) * 100vw) center;
        }
    }
}
/*-----------------------------------------------
 * Hover
-------------------------------------------------*/
@media (hover: hover) and (pointer: fine){
    .officialBtnLink:hover {
        transform: translateY(min(calc(-5 / var(--vw-min) * 100vw), -5px)) scale(1.04);
        background-color: rgba(255,255,255,.55);
    }
    .officialBtnLink:hover .officialBtn__icon {
        transform: scale(1.15);
    }
    .movieBtn:hover img {
        transform: scale(1.06);
        filter: brightness(1.1);
    }
    .movieBtn:hover .movie__yt-play::after {
        transform: scale(1.15);
    }
    .fv__bnrLink:hover img {
        transform: scale(1.05);
        filter: brightness(1.08);
    }
    .fv__navLink:hover::after {
        opacity: .8;
    }
}