@charset "utf-8";
@media screen and (min-width:769px){
    .header {
        display: none;
    }
}
.top-main {
    position: relative;
    z-index: 1;
}

/*-----------------------------------------------
 * Loading
-------------------------------------------------*/
.loading {
    background-color: var(--color-blue);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    transition: opacity 0.8s ease;
}
.loading__container {
    position: fixed;
    top: -20%;
    left: -20%;
    width: 140%;
    height: 140%;
    transform: rotate(-10deg);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.row {
    display: flex;
    white-space: nowrap;
    font-family: "Dela Gothic One", sans-serif;
    font-size: 5vw;
    line-height: 1.2;
    color: #364681;
    text-transform: uppercase;
}
@media (max-width: 768px) {
    .loading__container {
        top: -10%; 
        left: -30%;
        width: 160%;
        transform: rotate(-7deg);
    }
    .row {
        font-size: 8vh;
        margin-bottom: 5px;
    }
    .row span {
        animation-duration: 10s;
    }
}
.row span {
    display: inline-block;
    padding-right: 20px;
    animation: scroll-left 50s linear infinite;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
}
/* 偶数行は逆方向に動かす */
.row:nth-child(even) span {
    animation: scroll-right 48s linear infinite;
}
/* 左へ動くアニメーション */
@keyframes scroll-left {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); } /* 半分動けばループする */
}
/* 右へ動くアニメーション */
@keyframes scroll-right {
    from { transform: translateX(-50%); }
    to { transform: translateX(0); }
}

.loading__center {
    width: 100%;
    height: 100vh;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}
.loading__center__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}
.loading__fukidashi {
    background: url(../img/top/loading/loading_fukidashi.png) no-repeat 0 0 / contain;
    width: 100%;
    width: min(calc(56 / var(--vw-min) * 100vw), 56px);
    height: min(calc(56 / var(--vw-min) * 100vw), 56px);
    position: absolute;
    top: max(-40px, -2.99401vw);
    right: max(-50px, -3.74251vw);
}
@media screen and (max-width:768px){
    .loading__fukidashi {
        top: calc(-30 / var(--vw-min) * 100vw);
        right: calc(-50 / var(--vw-min) * 100vw);
    }
}
.loading__fukidashi:before {
    content: "";
    background: url(../img/top/loading/loading_change1.png) no-repeat 0 0 / contain;
    width: min(calc(41 / var(--vw-min) * 100vw), 41px);
    height: min(calc(23 / var(--vw-min) * 100vw), 23px);
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
body.loaded .loading__fukidashi:before {
    opacity: 0;
}
.loading__fukidashi:after {
    content: "";
    background: url(../img/top/loading/loading_change2.png) no-repeat 0 0 / contain;
    width: min(calc(16 / var(--vw-min) * 100vw), 16px);
    height: min(calc(33 / var(--vw-min) * 100vw), 33px);
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
}
body.loaded .loading__fukidashi:after {
    opacity: 1;
}
.loading__car {
    width: min(calc(140 / var(--vw-min) * 100vw), 140px);
    height: min(calc(142 / var(--vw-min) * 100vw), 142px);
    position: relative;
}
.loading__car:before {
    content: "";
    background: url(../img/top/loading/loading_img1.png) no-repeat 0 0 / contain;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    animation: swing 0.3s linear infinite;
}
@keyframes swing {
    0%   { transform: translateY(0) }
    25%  { transform: translateY(-3px) }
    50%  { transform: translateY(0) }
    75%  { transform: translateY(-1px) }
    100% { transform: translateY(0) }
}

.loading__text {
    display: flex;
    align-items: flex-end;
    margin-top: min(calc(30 / var(--vw-min) * 100vw), 30px);
    position: relative;
}
.loading__text:before {
    content: "";
    display: block;
    background: url(../img/top/loading/loading_text1.png) no-repeat 0 0 / contain;
    width: min(calc(288 / var(--vw-min) * 100vw), 288px);
    height: min(calc(46 / var(--vw-min) * 100vw), 46px);
    position: relative;
    z-index: 1;
}
.loading__text:after {
    content: "";
    background: url(../img/top/loading/loading_text2.png) no-repeat 0 0 / contain;
    width: min(calc(283 / var(--vw-min) * 100vw), 283px);
    height: min(calc(91 / var(--vw-min) * 100vw), 91px);
    margin: auto;
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
}
body.loaded .loading__text:after {
    animation: bang-in 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}
@keyframes bang-in {
    0% {
        opacity: 0;
        transform: scale(3);
        filter: blur(10px);
    }
    70% {
        opacity: 1;
        transform: scale(0.9);
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
.loading__text__dot {
    display: flex;
    align-items: center;
    width: min(calc(58 / var(--vw-min) * 100vw), 58px);
    height: min(calc(19 / var(--vw-min) * 100vw), 19px);
    margin-left: min(calc(5 / var(--vw-min) * 100vw), 5px);
}
.loading__text__dot > div {
    background: url(../img/top/loading/loading_dot.png) no-repeat 0 0 / contain;
    width: min(calc(18 / var(--vw-min) * 100vw), 18px);
    height: min(calc(19 / var(--vw-min) * 100vw), 19px);
    animation: dots-flash 0.6s infinite alternate;
}
.loading__text__dot > div:nth-child(2) {
    animation-delay: 0.2s;
}
.loading__text__dot > div:nth-child(3) {
    animation-delay: 0.4s;
}
@keyframes dots-flash {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

/*-----------------------------------------------
 * First
-------------------------------------------------*/
.fv {
    position: relative;
}
.fv:before {
    content: "";
    background: url(../img/common/deco/deco_paint2.png) no-repeat center / contain;
    width: calc(314 / var(--vw-min) * 100vw);
    height: calc(64 / var(--vw-min) * 100vw);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
.fv:after {
    content: "";
    background: var(--color-green);
    width: 100%;
    height: calc(304 / var(--vw-min) * 100vw);
    position: absolute;
    left: 0;
    bottom: calc(-80 / var(--vw-min) * 100vw);
    z-index: 0;
    transform: skewY(-8deg);
}
.fv__inner {
    display: flex;
    position: relative;
    z-index: 1;
}
.fv__left {
    width: 40%;
    position: relative;
    z-index: 1;
}
.fv__left__inner {
    width: 100%;
    height: 100%;
    padding-top: calc(64 / var(--vw-min) * 100vw);
    position: absolute;
    top: 0;
    left: 0; 
}
.fv__right {
    width: 60%;
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .fv:before {
        width: calc(484 / var(--vw-min) * 100vw);
        height: calc(99 / var(--vw-min) * 100vw);
    }
    .fv:after {
        height: calc(540 / var(--vw-min) * 100vw);
        top: calc(670 / var(--vw-min) * 100vw);
        bottom: auto;
    }
    .fv__inner {
        flex-direction: column-reverse;
    }
    .fv__left {
        width: 100%;
    }
    .fv__left__inner {
        height: auto;
        padding-top: 0;
        position: relative;
        top: auto;
        left: auto;
    }
    .fv__right {
        width: 100%;
        padding: calc(42 / var(--vw-min) * 100vw) calc(49 / var(--vw-min) * 100vw);
    }
}

/* left deco */
.fv__left__deco {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
.fv__left__deco:before {
    content: "";
    background: url(../img/common/deco/deco_dot.png) no-repeat center / contain;
    width: calc(350 / var(--vw-min) * 100vw);
    height: calc(350 / var(--vw-min) * 100vw);
    position: absolute;
    top: calc(140 / var(--vw-min) * 100vw);
    right: calc(-215 / var(--vw-min) * 100vw);
    z-index: 0;
}
.fv__left__deco:after {
    content: "";
    background: url(../img/common/deco/deco_dot.png) no-repeat center / contain;
    width: calc(350 / var(--vw-min) * 100vw);
    height: calc(350 / var(--vw-min) * 100vw);
    position: absolute;
    top: calc(402 / var(--vw-min) * 100vw);
    left: calc(-140 / var(--vw-min) * 100vw);
    z-index: 0;
}
@media screen and (max-width:768px){
    .fv__left__deco {
        overflow: hidden;
    }
}

/* head, logo */
.fv__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    position: sticky;
    top: 0;
    z-index: 1;
}
.fv__logo {
    width: calc(374 / var(--vw-min) * 100vw);
    margin: 0 auto;
}
.fv__logo img {
    width: 100%;
}
@media screen and (max-width:768px){
    .fv__head {
        position: relative;
        top: auto;
    }
    .fv__logo {
        width: calc(364 / var(--vw-min) * 100vw);
    }
}

/* onair */
.fv__onair1 {
    color: var(--color-green);
    font-size: calc(24 / var(--vw-min) * 100vw);
    line-height: 1.2;
    text-align: center;
}
.fv__onair1 .--c-pink {
    color: var(--color-pink);
}
.fv__onair2 {
    color: var(--color-blue);
    background-color: var(--color-yellow);
    border-radius: min(calc(4 / var(--vw-min) * 100vw), 4px);
    width: calc(334 / var(--vw-min) * 100vw);
    font-size: calc(24 / var(--vw-min) * 100vw);
    line-height: 1.15;
    text-align: center;
    margin-top: calc(12 / var(--vw-min) * 100vw);
    padding: 0.2em 0;
    position: relative;
}
.fv__onair2 .--c-pink {
    color: var(--color-pink);
}
.fv__onair2:before {
    content: "";
    background-color: var(--color-yellow);
    -webkit-mask: url(../img/common/deco/deco_paint1.svg) no-repeat center / contain;
    mask: url(../img/common/deco/deco_paint1.svg) no-repeat center / contain;
    width: calc(81 / var(--vw-min) * 100vw);
    height: calc(18 / var(--vw-min) * 100vw);
    position: absolute;
    bottom: calc(-16 / var(--vw-min) * 100vw);
    right: 0;
}
@media screen and (max-width:768px){
    .fv__onair1 {
        font-size: calc(34 / var(--vw-min) * 100vw);
    }
    .fv__onair2 {
        width: calc(470 / var(--vw-min) * 100vw);
        margin-top: calc(20 / var(--vw-min) * 100vw);
        font-size: calc(34 / var(--vw-min) * 100vw);
    }
}

/* nav */
.fv__nav {
    width: 100%;
    margin-top: calc(50 / var(--vw-min) * 100vw);
}
.fv__navLists {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: calc(20 / var(--vw-min) * 100vw);
    width: 100%;
    padding: 0 calc(60 / var(--vw-min) * 100vw);
}
.fv__navLists > li {
    display: inline-flex;
}
.fv__navLists a {
    color: #fff;
    font-size: calc(18 / var(--vw-min) * 100vw);
    line-height: 1;
    letter-spacing: 0;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}
.fv__navLists a:before { content: "#"; }
@media screen and (hover: hover) and (pointer: fine) {
    .fv__navLists a {
        transition: color .3s ease;
    }
    .fv__navLists a:hover {
        color: var(--color-yellow);
    }
}

/* share */
.fv__share {
    display: flex;
    align-items: center;
    width: 100%;
    margin-top: calc(40 / var(--vw-min) * 100vw);
    padding: 0 calc(60 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
    .fv__share {
        display: none;
    }
}
.fv__share > dt {
    display: inline-flex;
    align-items: center;
    font-size: min(calc(14 / var(--vw-min) * 100vw), 14px);
    line-height: 1;
    letter-spacing: 0;
    margin-right: 1em;
}
.fv__share > dt:before { content: "#"; }
.fv__shareLists {
    display: flex;
    align-items: center;
    gap: min(calc(12 / var(--vw-min) * 100vw), 12px);
}
.fv__shareLists > li {
    width: min(calc(48 / var(--vw-min) * 100vw), 48px);
    height: min(calc(48 / var(--vw-min) * 100vw), 48px);
}
.fv__shareLists > li a {
    background-color: var(--color-green);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    text-decoration: none;
}
@media screen and (hover: hover) and (pointer: fine) {
    .fv__shareLists > li a {
        transition: background-color .3s ease;
    }
    .fv__shareLists > li a:hover {
        background-color: var(--color-yellow);
    }
}
.fv__shareLists > li a:before {
    content: "";
    background-color: #fff;
    -webkit-mask: url() no-repeat center / contain;
    mask: url() no-repeat center / contain;
}
.fv__shareLists > li.is-x a:before {
    -webkit-mask-image: url(../img/common/sns/icon_x.svg);
    mask-image: url(../img/common/sns/icon_x.svg);
    width: min(calc(19 / var(--vw-min) * 100vw), 19px);
    height: min(calc(21 / var(--vw-min) * 100vw), 21px);
}
.fv__shareLists > li.is-tiktok a:before {
    -webkit-mask-image: url(../img/common/sns/icon_tiktok.svg);
    mask-image: url(../img/common/sns/icon_tiktok.svg);
    width: min(calc(22 / var(--vw-min) * 100vw), 22px);
    height: min(calc(25 / var(--vw-min) * 100vw), 25px);
}

/* pickupLists */
.fv__pickupListsWrap {
    width: 100%;
    margin-top: calc(50 / var(--vw-min) * 100vw);
    padding: 0 calc(60 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
    .fv__pickupListsWrap {
        padding: 0 calc(80 / var(--vw-min) * 100vw);
    }
}
.fv__pickupLists > li {
    width: 100%;
}
.fv__pickupLists > li > a {
    width: 100%;
}
.fv__pickupLists > li > a img {
    width: 100%;
}

/* vsListsWrap */
.fv__vsListsWrap {
    width: 92%;
    aspect-ratio: 764 / 1079;
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .fv__vsListsWrap {
        width: 100%;
    }
}
.fv__vsLists {
    width: 100%;
    height: 100%;
}
.fv__vsLists li {
    width: 100%;
    height: 100%;
}
.fv__vs {
    overflow: hidden;
    width: 100%;
    height: 100%;
}
.fv__vs img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* right deco */
.fv__right__deco{
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
.fv__right__deco:before {
    content: "";
    background: url(../img/common/deco/deco_dot.png) no-repeat center / contain;
    width: calc(350 / var(--vw-min) * 100vw);
    height: calc(350 / var(--vw-min) * 100vw);
    position: absolute;
    top: calc(12 / var(--vw-min) * 100vw);
    right: calc(-115 / var(--vw-min) * 100vw);
    z-index: 0;
}

/* scroll */
.fv__right__scrollWrap {
    width: 8%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}
.fv__right__scroll__inner {
    width: 100%;
    height: min(100vh, 100%);
    position: sticky;
    top: 0;
}
.fv__right__scroll {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    position: absolute;
    bottom: 0;
}
.fv__right__scroll > span.--text {
    display: inline-block;
    font-size: min(calc(12 / var(--vw-min) * 100vw), 12px);
    line-height: 1;
    transform: rotate(90deg);
    margin-bottom: 3.5em;
    margin-left: 0.25em;
}
.fv__right__scroll > span.--line {
    display: block;
    width: min(calc(2 / var(--vw-min) * 100vw), 2px);
    height: min(calc(100 / var(--vw-min) * 100vw), 100px);
    overflow: hidden;
    position: relative;
}
.fv__right__scroll > span.--line:before {
    content: "";
    background-color: #fff;
    width: 100%;
    height: 100%;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    animation: scrollDown 1.5s ease-in-out infinite;
}
@keyframes scrollDown {
	0%   { top: -100%; }
	70%, 100% { top: 100%; }
}

/* first animation */
.fv__vs img.is-firstVs {
    transform: scale(1.2) rotate(10deg);
	filter:brightness(250%);
	transition: all 2.5s var(--easing-outquart);
}
.fv.is-ani .fv__vs img.is-firstVs {
    transform: scale(1) rotate(0);
	filter:brightness(100%);
}
.fv__logo,
.fv__onair1,
.fv__onair2 {
    transform: translateY(100%);
	opacity: 0;
	transition: transform .6s var(--easing-first), opacity .3s ease;
}
.fv.is-ani .fv__logo { transition-delay: .4s; }
.fv.is-ani .fv__onair1 { transition-delay: .5s; }
.fv.is-ani .fv__onair2 { transition-delay: .6s; }
.fv.is-ani .fv__logo,
.fv.is-ani .fv__onair1,
.fv.is-ani .fv__onair2 {
    transform: translateY(0);
	opacity: 1;
}

/*-----------------------------------------------
 * Movie
-------------------------------------------------*/
.movie {
    padding-top: min(calc(58 / var(--vw-min) * 100vw), 58px);
    position: relative;
}
.movie__inner {
    width: 100%;
    height: calc(520 / var(--vw-min) * 100vw);
    position: relative;
}
@media screen and (max-width:768px){
    .movie {
        padding-top: calc(72 / var(--vw-min) * 100vw);
    }
    .movie__inner {
        height: calc(424 / var(--vw-min) * 100vw);
    }
}

/* link */
.movie__link {
    display: block;
    background: url(../img/common/deco/deco_icon_paint1.png) no-repeat center / contain;
    width: min(calc(179 / var(--vw-min) * 100vw), 179px);
    height: min(calc(239 / var(--vw-min) * 100vw), 239px);
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
}
@media screen and (hover: hover) and (pointer: fine) {
    .movie__link {
        transition: transform .3s var(--easing-outquart);
    }
    .movie__link:hover {
        transform: scale(1.15);
    }
}
.movie__link:before {
    content: "";
    background-color: #fff;
    -webkit-mask: url(../img/common/deco/deco_text_play.svg) no-repeat center / contain;
    mask: url(../img/common/deco/deco_text_play.svg) no-repeat center / contain;
    width: min(calc(165 / var(--vw-min) * 100vw), 165px);
    height: min(calc(165 / var(--vw-min) * 100vw), 165px);
    margin: auto;
    position: absolute;
    top: min(calc(8 / var(--vw-min) * 100vw), 8px);
    right: 0;
    left: 0;
    animation: rotate 20s ease infinite;
}
.movie__link:after {
    content: "";
    background-color: var(--color-pink);
    -webkit-mask: url(../img/common/icon/icon_play.svg) no-repeat center / contain;
    mask: url(../img/common/icon/icon_play.svg) no-repeat center / contain;
    width: min(calc(43 / var(--vw-min) * 100vw), 43px);
    height: min(calc(50 / var(--vw-min) * 100vw), 50px);
    position: absolute;
    top: min(calc(67 / var(--vw-min) * 100vw), 67px);
    left: min(calc(72 / var(--vw-min) * 100vw), 72px);
}
@media screen and (max-width:768px){
    .movie__link {
        width: calc(149 / var(--vw-min) * 100vw);
        height: calc(198 / var(--vw-min) * 100vw);
    }
    .movie__link:before {
        width: calc(137 / var(--vw-min) * 100vw);
        height: calc(137 / var(--vw-min) * 100vw);
    }
    .movie__link:after {
        width: calc(35 / var(--vw-min) * 100vw);
        height: calc(40 / var(--vw-min) * 100vw);
        top: calc(56 / var(--vw-min) * 100vw);
        left: calc(62 / var(--vw-min) * 100vw);
    }
}

/* bg */
.movie__bg {
    background-color: var(--color-yellow);
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.movie__bg__in {
    opacity: .4;
    pointer-events: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
}

/*-----------------------------------------------
 * News, SNS
-------------------------------------------------*/
.update {
    padding-top: min(calc(145 / var(--vw-min) * 100vw), 145px);
    position: relative;
}
.update:before {
    content: "";
    background: url(../img/common/deco/deco_paint3.png) no-repeat center / contain;
    width: min(calc(784 / var(--vw-min) * 100vw), 784px);
    height: min(calc(145 / var(--vw-min) * 100vw), 145px);
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
}
.update__inner {
    display: flex;
    gap: 0 min(calc(80 / var(--vw-min) * 100vw), 80px);
    width: min(calc(1000 / var(--vw-min) * 100vw), 1000px);
    margin: 0 auto;
    padding-bottom: min(calc(145 / var(--vw-min) * 100vw), 145px);
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .update {
        padding-top: calc(160 / var(--vw-min) * 100vw);
    }
    .update:before {
        width: calc(630 / var(--vw-min) * 100vw);
        height: calc(115 / var(--vw-min) * 100vw);
    }
    .update__inner {
        flex-direction: column;
        width: 100%;
        padding-bottom: calc(140 / var(--vw-min) * 100vw);
        gap: calc(80 / var(--vw-min) * 100vw) 0;
    }
}

/* news */
.news {
    width: 52%;
}
.news__title {
    display: flex;
}
.news__title--en {
    display: block;
    background: url(../img/top/title/title_news.png) no-repeat center / contain;
    width: min(calc(316 / var(--vw-min) * 100vw), 316px);
    height: min(calc(83 / var(--vw-min) * 100vw), 83px);
}
.news__title--ja {
    display: block;
    background: url(../img/top/title/title_news_sub.png) no-repeat center / contain;
    width: min(calc(114 / var(--vw-min) * 100vw), 114px);
    height: min(calc(71 / var(--vw-min) * 100vw), 71px);
    margin-left: min(calc(14 / var(--vw-min) * 100vw), 14px);
}
@media screen and (max-width:768px){
    .news {
        width: 100%;
    }
    .news__title {
        padding: 0 calc(48 / var(--vw-min) * 100vw);
    }
}

/* newsLists */
.newsListsWrap {
    margin-top: min(calc(50 / var(--vw-min) * 100vw), 50px);
}
.newsLists > li:not(:first-child) {
    margin-top: min(calc(16 / var(--vw-min) * 100vw), 16px);
}
.newsLists > li > a {
    background-color: var(--color-cream);
    border-radius: min(calc(16 / var(--vw-min) * 100vw), 16px);
    display: flex;
    align-items: center;
    height: min(calc(87 / var(--vw-min) * 100vw), 87px);
    padding: 0 min(calc(70 / var(--vw-min) * 100vw), 70px) 0 min(calc(32 / var(--vw-min) * 100vw), 32px);
    position: relative;
    text-decoration: none;
}
.newsLists > li > a:before {
    content: "";
    background-color: var(--color-blue);
    -webkit-mask: url(../img/common/icon/icon_arrow.png) no-repeat center / contain;
    mask: url(../img/common/icon/icon_arrow.png) no-repeat center / contain;
    width: min(calc(20 / var(--vw-min) * 100vw), 20px);
    height: min(calc(20 / var(--vw-min) * 100vw), 20px);
    margin: auto;
    position: absolute;
    top: 0;
    right: min(calc(30 / var(--vw-min) * 100vw), 30px);
    bottom: 0;
}
@media screen and (max-width:768px){
    .newsListsWrap {
        margin-top: calc(80 / var(--vw-min) * 100vw);
        padding: 0 calc(48 / var(--vw-min) * 100vw);
    }
    .newsLists > li:not(:first-child) {
        margin-top: calc(54 / var(--vw-min) * 100vw);
    }
    .newsLists > li > a {
        font-size: calc(26 / var(--vw-min) * 100vw);
        height: calc(137 / var(--vw-min) * 100vw);
    }
    .newsLists > li > a:before {
        width: calc(28 / var(--vw-min) * 100vw);
        height: calc(28 / var(--vw-min) * 100vw);
    }
}
@media screen and (hover: hover) and (pointer: fine) {
    .newsLists > li > a {
        transition: background-color .3s ease;
    }
    .newsLists > li > a:hover {
        background-color: var(--color-yellow);
    }
    .newsLists > li > a:before {
        transition: transform .3s ease;
    }
    .newsLists > li > a:hover:before {
        transform: translateX(20%);
    }
}

.newsLists__time {
    background-color: var(--color-green);
    border: min(calc(2 / var(--vw-min) * 100vw), 2px) solid var(--color-blue);
    border-radius: min(calc(16 / var(--vw-min) * 100vw), 16px);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(calc(136 / var(--vw-min) * 100vw), 136px);
    height: min(calc(32 / var(--vw-min) * 100vw), 32px);
    font-size: min(calc(14 / var(--vw-min) * 100vw), 14px);
    letter-spacing: 0;
    line-height: 1;
    padding: 0.5em 1em;
    position: absolute;
    top: max(-8px, -0.5988vw);
    left: max(-8px, -0.5988vw);
    z-index: 1;
}
.newsLists__title {
    color: var(--color-blue);
    font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
    letter-spacing: 0.02em;
    display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .newsLists__time {
        border-radius: calc(25 / var(--vw-min) * 100vw);
        width: calc(208 / var(--vw-min) * 100vw);
        height: calc(49 / var(--vw-min) * 100vw);
        font-size: calc(22 / var(--vw-min) * 100vw);
        top: calc(-30 / var(--vw-min) * 100vw);
        left: calc(-30 / var(--vw-min) * 100vw);
    }
    .newsLists__title {
        font-size: calc(26 / var(--vw-min) * 100vw);
        line-height: 1.5;
        -webkit-line-clamp: 2;
    }
}

.news__more {
    display: flex;
    margin-top: min(calc(30 / var(--vw-min) * 100vw), 30px);
}
.news__more > a {
    color: var(--color-green);
    display: flex;
    align-items: center;
    margin-left: auto;
    font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
    letter-spacing: 0;
    line-height: 1;
    text-decoration: none;
}
.news__more > a:after {
    content: "";
    background-color: var(--color-green);
    display: block;
    -webkit-mask: url(../img/common/icon/icon_arrow.png) no-repeat center / contain;
    mask: url(../img/common/icon/icon_arrow.png) no-repeat center / contain;
    width: min(calc(17 / var(--vw-min) * 100vw), 17px);
    height: min(calc(17 / var(--vw-min) * 100vw), 17px);
    margin-left: min(calc(8 / var(--vw-min) * 100vw), 8px);
}
@media screen and (hover: hover) and (pointer: fine) {
    .news__more > a {
        transition: color .3s ease;
    }
    .news__more > a:hover {
        color: var(--color-yellow);
    }
    .news__more > a:after {
        transition: background-color .3s ease,
                    transform .3s ease;
    }
    .news__more > a:hover:after {
        background-color: var(--color-yellow);
        transform: translateX(20%);
    }
}
@media screen and (max-width:768px){
    .news__more {
        margin-top: calc(46 / var(--vw-min) * 100vw);
        padding: 0 calc(48 / var(--vw-min) * 100vw);
    }
    .news__more > a {
        font-size: calc(26 / var(--vw-min) * 100vw);
    }
    .news__more > a:after {
        width: calc(28 / var(--vw-min) * 100vw);
        height: calc(23 / var(--vw-min) * 100vw);
    }
}

/* sns */
.sns {
    width: 48%;
}
.sns__title {
    display: flex;
}
.sns__title--en {
    display: block;
    background: url(../img/top/title/title_sns.png) no-repeat center / contain;
    width: min(calc(238 / var(--vw-min) * 100vw), 238px);
    height: min(calc(84 / var(--vw-min) * 100vw), 84px);
}
.sns__title--ja {
    display: block;
    background: url(../img/top/title/title_sns_sub.png) no-repeat center / contain;
    width: min(calc(114 / var(--vw-min) * 100vw), 114px);
    height: min(calc(71 / var(--vw-min) * 100vw), 71px);
    margin-left: min(calc(14 / var(--vw-min) * 100vw), 14px);
}
@media screen and (max-width:768px){
    .sns {
        width: 100%;
    }
    .sns__title {
        padding: 0 calc(48 / var(--vw-min) * 100vw);
    }
}

.snsLists {
    margin-top: min(calc(50 / var(--vw-min) * 100vw), 50px);
}
.snsLists > li:not(:first-child) {
    margin-top: min(calc(16 / var(--vw-min) * 100vw), 16px);
}
.snsLists > li > a {
    background-color: var(--color-green);
    border-radius: min(calc(28 / var(--vw-min) * 100vw), 28px);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: min(calc(56 / var(--vw-min) * 100vw), 56px);
    font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
    position: relative;
    text-decoration: none;
}
.snsLists > li > a:before {
    content: "";
    display: block;
    background-color: #fff;
    -webkit-mask: url() no-repeat center / contain;
    mask: url() no-repeat center / contain;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: min(calc(38 / var(--vw-min) * 100vw), 38px);
}
@media screen and (hover: hover) and (pointer: fine) {
    .snsLists > li > a {
        transition: background-color .3s ease;
    }
    .snsLists > li > a:hover {
        background-color: var(--color-yellow);
    }
}
.snsLists > li.is-x > a:before {
    -webkit-mask-image: url(../img/common/sns/icon_x.svg);
    mask-image: url(../img/common/sns/icon_x.svg);
    width: min(calc(19 / var(--vw-min) * 100vw), 19px);
    height: min(calc(19 / var(--vw-min) * 100vw), 19px);
}
.snsLists > li.is-tiktok > a:before {
    -webkit-mask-image: url(../img/common/sns/icon_tiktok.svg);
    mask-image: url(../img/common/sns/icon_tiktok.svg);
    width: min(calc(22 / var(--vw-min) * 100vw), 22px);
    height: min(calc(25 / var(--vw-min) * 100vw), 25px);
}
@media screen and (max-width:768px){
    .snsLists {
        padding: 0 calc(48 / var(--vw-min) * 100vw);
    }
    .snsLists > li:not(:first-child) {
        margin-top: calc(40 / var(--vw-min) * 100vw);
    }
    .snsLists > li > a {
        border-radius: calc(51 / var(--vw-min) * 100vw);
        height: calc(102 / var(--vw-min) * 100vw);
        font-size: calc(26 / var(--vw-min) * 100vw);
    }
    .snsLists > li.is-x > a:before {
        width: calc(38 / var(--vw-min) * 100vw);
        height: calc(38 / var(--vw-min) * 100vw);
    }
    .snsLists > li.is-tiktok > a:before {
        width: calc(44 / var(--vw-min) * 100vw);
        height: calc(51 / var(--vw-min) * 100vw);
    }
}

/*-----------------------------------------------
 * Introduction
-------------------------------------------------*/
.intro {
    background-size: min(calc(16 / var(--vw-min) * 100vw), 16px) min(calc(16 / var(--vw-min) * 100vw), 16px);
	background-position: 0 0, min(calc(8 / var(--vw-min) * 100vw), 8px) min(calc(8 / var(--vw-min) * 100vw), 8px);
	background-image:
		radial-gradient(#4ebfb6 min(calc(2 / var(--vw-min) * 100vw), 2px), transparent min(calc(2 / var(--vw-min) * 100vw), 2px)),
		radial-gradient(#4ebfb6 min(calc(2 / var(--vw-min) * 100vw), 2px), #01a497 min(calc(2 / var(--vw-min) * 100vw), 2px));
    padding: min(calc(115 / var(--vw-min) * 100vw), 115px) 0 min(calc(105 / var(--vw-min) * 100vw), 105px);
    position: relative;
}
@media screen and (max-width:768px){
    .intro {
        padding: calc(100 / var(--vw-min) * 100vw) calc(48 / var(--vw-min) * 100vw) calc(148 / var(--vw-min) * 100vw);
    }
}

/* deco */
.intro__deco {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.intro__deco:before {
    content: "";
    background: url(../img/common/deco/deco_dot2.png) no-repeat center / contain;
    width: min(calc(499 / var(--vw-min) * 100vw), 499px);
    height: min(calc(485 / var(--vw-min) * 100vw), 485px);
    position: absolute;
    top: max(-180px, -13.47305vw);
    right: max(-152px, -11.37724vw);
    z-index: 0;
}
.intro__deco:after {
    content: "";
    background: url(../img/common/deco/deco_dot2.png) no-repeat center / contain;
    width: min(calc(499 / var(--vw-min) * 100vw), 499px);
    height: min(calc(485 / var(--vw-min) * 100vw), 485px);
    position: absolute;
    bottom: 0;
    left: max(-125px, -9.35628vw);
    z-index: 0;
}

/* wave */
.intro__wave {
    width: 100%;
    height: min(calc(56 / var(--vw-min) * 100vw), 56px);
    overflow: hidden;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 0;
}
.intro__wave:before {
    content: "";
    background: url(../img/common/deco/deco_paint4.png) repeat-x center / contain;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
@media screen and (max-width:768px){
    .intro__wave:before {
        background-size: cover;
    }
}

/* inner, cont */
.intro__inner {
    width: min(calc(1238 / var(--vw-min) * 100vw), 1238px);
    margin: 0 auto;
    position: relative;
    z-index: 2;
}
.intro__inner:before {
    content: "";
    background-color: var(--color-blue);
    border-radius: min(calc(40 / var(--vw-min) * 100vw), 40px);
    width: 100%;
    height: 100%;
    position: absolute;
    top: min(calc(16 / var(--vw-min) * 100vw), 16px);
    left: min(calc(16 / var(--vw-min) * 100vw), 16px);
}
.intro__cont {
    background-color: var(--color-cream);
    border: min(calc(4 / var(--vw-min) * 100vw), 4px) solid var(--color-blue);
    border-radius: min(calc(40 / var(--vw-min) * 100vw), 40px);
    width: 100%;
    padding: min(calc(90 / var(--vw-min) * 100vw), 90px) 0;
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .intro__inner {
        width: 100%;
    }
    .intro__cont {
        border-width: calc(8 / var(--vw-min) * 100vw);
    }
    .intro__cont:before {
        background-image: url(../img/top/intro/deco_intro_left_sp.png);
        width: calc(161 / var(--vw-min) * 100vw);
        height: calc(1007 / var(--vw-min) * 100vw);
        left: calc(-45 / var(--vw-min) * 100vw);
    }
    .intro__cont:after {
        background-image: url(../img/top/intro/deco_intro_right_sp.png);
        width: calc(145 / var(--vw-min) * 100vw);
        height: calc(1040 / var(--vw-min) * 100vw);
        right: calc(-45 / var(--vw-min) * 100vw);
    }
}

/* title */
.intro__title {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.intro__title--en {
    display: block;
    background: url(../img/top/title/title_intro.png) no-repeat center / contain;
    width: min(calc(857 / var(--vw-min) * 100vw), 857px);
    height: min(calc(103 / var(--vw-min) * 100vw), 103px);
}
.intro__title--ja {
    display: block;
    background: url(../img/top/title/title_intro_sub.png) no-repeat center / contain;
    width: min(calc(193 / var(--vw-min) * 100vw), 193px);
    height: min(calc(62 / var(--vw-min) * 100vw), 62px);
    margin-top: min(calc(8 / var(--vw-min) * 100vw), 8px);
}
@media screen and (max-width:768px){
    .intro__title--en {
        background-image: url(../img/top/title/title_intro_sp.png);
        width: calc(511 / var(--vw-min) * 100vw);
        height: calc(163 / var(--vw-min) * 100vw);
    }
    .intro__title--ja {
        width: calc(235 / var(--vw-min) * 100vw);
        height: calc(78 / var(--vw-min) * 100vw);
    }
}

/* text */
.intro__textWrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--color-blue);
    margin: min(calc(50 / var(--vw-min) * 100vw), 50px) auto 0;
}
.intro__text1 {
    font-size: min(calc(40 / var(--vw-min) * 100vw), 40px);
    letter-spacing: 0.02em;
    line-height: 1.3;
    text-align: center;
}
.intro__text2 {
    font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
    letter-spacing: 0.02em;
    line-height: 2;
    text-align: center;
    margin-top: 1em;
}
.intro__text3 {
    font-size: min(calc(32 / var(--vw-min) * 100vw), 32px);
    letter-spacing: 0.02em;
    line-height: 1.3;
    text-align: center;
    margin-top: 1em;
}
@media screen and (max-width:768px){
    .intro__text1 {
        font-size: calc(42 / var(--vw-min) * 100vw);
        line-height: 1.5;
    }
    .intro__text2 {
        font-size: calc(28 / var(--vw-min) * 100vw);
        line-height: 1.5;
    }
    .intro__text3 {
        font-size: calc(36 / var(--vw-min) * 100vw);
        line-height: 1.5;
    }
}

.intro__textWrap .--c-green { color: var(--color-green); }
.intro__textWrap .--c-pink { color: var(--color-pink); }
.intro__textWrap .--c-orange { color: var(--color-orange); }
.intro__textWrap .--c-purple { color: var(--color-purple); }
.intro__textWrap .--c-yellow { color: var(--color-yellow); }

/* illust */
.intro__illustLeft {
    width: min(calc(231 / var(--vw-min) * 100vw), 231px);
    height: min(calc(628 / var(--vw-min) * 100vw), 628px);
    position: absolute;
    top: min(calc(100 / var(--vw-min) * 100vw), 100px);
    left: max(-40px, -2.99401vw);
    z-index: 2;
}
.intro__illustLeft > div {
    background: url() no-repeat center / contain;
    position: absolute;
    animation-duration: 0.7s;
    animation-timing-function: steps(2);
    animation-iteration-count: infinite;
}
@keyframes glitch-pattern-1 {
    0% { transform: translate(0, 0); }
    25% { transform: translate(2px, -1px); }
    50% { transform: translate(-2px, 1px); }
    75% { transform: translate(2px, 0) scale(1.05); }
    100% { transform: translate(0, 0); }
}
@keyframes glitch-pattern-2 {
    0% { transform: translate(0, 0) rotate(0deg); }
    33% { transform: translate(-2px, 0) rotate(1deg); }
    66% { transform: translate(2px, 0) rotate(-1deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}
.intro__illustLeft > div.--illust1 {
    background-image: url(../img/common/deco/deco_illust1.png);
    width: min(calc(84 / var(--vw-min) * 100vw), 84px);
    height: min(calc(96 / var(--vw-min) * 100vw), 96px);
    top: 0;
    left: 0;
    animation-name: glitch-pattern-1;
}
.intro__illustLeft > div.--illust2 {
    background-image: url(../img/common/deco/deco_illust2.png);
    width: min(calc(132 / var(--vw-min) * 100vw), 132px);
    height: min(calc(47 / var(--vw-min) * 100vw), 47px);
    top: min(calc(124 / var(--vw-min) * 100vw), 124px);
    right: min(calc(20 / var(--vw-min) * 100vw), 20px);
    animation-name: glitch-pattern-1;
    animation-direction: reverse;
    animation-delay: 0.1s;
}
.intro__illustLeft > div.--illust3 {
    background-image: url(../img/common/deco/deco_illust3.png);
    width: min(calc(87 / var(--vw-min) * 100vw), 87px);
    height: min(calc(129 / var(--vw-min) * 100vw), 129px);
    top: min(calc(215 / var(--vw-min) * 100vw), 215px);
    right: min(calc(34 / var(--vw-min) * 100vw), 34px);
    animation-name: glitch-pattern-1;
    animation-delay: 0.2s;
}
.intro__illustLeft > div.--illust4 {
    background-image: url(../img/common/deco/deco_illust4.png);
    width: min(calc(111 / var(--vw-min) * 100vw), 111px);
    height: min(calc(74 / var(--vw-min) * 100vw), 74px);
    bottom: min(calc(126 / var(--vw-min) * 100vw), 126px);
    left: min(calc(5 / var(--vw-min) * 100vw), 5px);
    animation-name: glitch-pattern-1;
    animation-direction: reverse;
    animation-delay: 0.1s;
}
.intro__illustLeft > div.--illust5 {
    background-image: url(../img/common/deco/deco_illust5.png);
    width: min(calc(102 / var(--vw-min) * 100vw), 102px);
    height: min(calc(79 / var(--vw-min) * 100vw), 79px);
    bottom: 0;
    right: 0;
    animation-name: glitch-pattern-1;
}
@media screen and (max-width: 768px) {
    .intro__illustLeft {
        width: calc(161 / var(--vw-min) * 100vw);
        height: calc(1007 / var(--vw-min) * 100vw);
        left: calc(-45 / var(--vw-min) * 100vw);
    }
    .intro__illustLeft > div.--illust1 {
        top: 0;
        left: calc(10 / var(--vw-min) * 100vw);
    }
    .intro__illustLeft > div.--illust2 {
        top: calc(210 / var(--vw-min) * 100vw);
        left: calc(10 / var(--vw-min) * 100vw);
        right: auto;
    }
    .intro__illustLeft > div.--illust3 {
        top: calc(240 / var(--vw-min) * 100vw);
        left: calc(10 / var(--vw-min) * 100vw);
        right: auto;
    }
    .intro__illustLeft > div.--illust4 {
        top: calc(540 / var(--vw-min) * 100vw);
        left: 0;
        bottom: auto;
        right: auto;
    }
    .intro__illustLeft > div.--illust5 {
        top: calc(870 / var(--vw-min) * 100vw);
        left: 0;
        bottom: auto;
        right: auto;
    }
}

.intro__illustRight {
    width: min(calc(217 / var(--vw-min) * 100vw), 217px);
    height: min(calc(642 / var(--vw-min) * 100vw), 642px);
    position: absolute;
    top: min(calc(100 / var(--vw-min) * 100vw), 100px);
    right: max(-40px, -2.99401vw);
    z-index: 2;
}
.intro__illustRight > div {
    background: url() no-repeat center / contain;
    position: absolute;
    animation-duration: 0.7s;
    animation-timing-function: steps(2);
    animation-iteration-count: infinite;
}
.intro__illustRight > div.--illust6 {
    background-image: url(../img/common/deco/deco_illust6.png);
    width: min(calc(110 / var(--vw-min) * 100vw), 110px);
    height: min(calc(122 / var(--vw-min) * 100vw), 122px);
    top: 0;
    right: 0;
    animation-name: glitch-pattern-1;
}
.intro__illustRight > div.--illust7 {
    background-image: url(../img/common/deco/deco_illust7.png);
    width: min(calc(107 / var(--vw-min) * 100vw), 107px);
    height: min(calc(93 / var(--vw-min) * 100vw), 93px);
    top: min(calc(141 / var(--vw-min) * 100vw), 141px);
    left: min(calc(17 / var(--vw-min) * 100vw), 17px);
    animation-name: glitch-pattern-1;
    animation-direction: reverse;
    animation-delay: 0.1s;
}
.intro__illustRight > div.--illust8 {
    background-image: url(../img/common/deco/deco_illust8.png);
    width: min(calc(95 / var(--vw-min) * 100vw), 95px);
    height: min(calc(117 / var(--vw-min) * 100vw), 117px);
    top: min(calc(248 / var(--vw-min) * 100vw), 248px);
    right: min(calc(78 / var(--vw-min) * 100vw), 78px);
    animation-name: glitch-pattern-1;
    animation-delay: 0.2s;
}
.intro__illustRight > div.--illust9 {
    background-image: url(../img/common/deco/deco_illust9.png);
    width: min(calc(109 / var(--vw-min) * 100vw), 109px);
    height: min(calc(74 / var(--vw-min) * 100vw), 74px);
    bottom: min(calc(162 / var(--vw-min) * 100vw), 162px);
    right: 0;
    animation-name: glitch-pattern-1;
    animation-direction: reverse;
    animation-delay: 0.1s;
}
.intro__illustRight > div.--illust10 {
    background-image: url(../img/common/deco/deco_illust10.png);
    width: min(calc(101 / var(--vw-min) * 100vw), 101px);
    height: min(calc(146 / var(--vw-min) * 100vw), 146px);
    bottom: 0;
    left: 0;
    animation-name: glitch-pattern-1;
}
@media screen and (max-width: 768px) {
    .intro__illustRight {
        width: calc(145 / var(--vw-min) * 100vw);
        height: 100%;
        right: calc(-45 / var(--vw-min) * 100vw);
        top: 0;
    }
    .intro__illustRight > div.--illust6 {
        top: calc(50 / var(--vw-min) * 100vw);
        right: calc(10 / var(--vw-min) * 100vw);
    }
    .intro__illustRight > div.--illust7 {
        top: calc(500 / var(--vw-min) * 100vw);
        right: calc(20 / var(--vw-min) * 100vw);
        left: auto;
    }
    .intro__illustRight > div.--illust8 {
        top: calc(260 / var(--vw-min) * 100vw);
        right: calc(50 / var(--vw-min) * 100vw);
    }
    .intro__illustRight > div.--illust9 {
        top: calc(730 / var(--vw-min) * 100vw);
        right: calc(10 / var(--vw-min) * 100vw);
        bottom: auto;
    }
    .intro__illustRight > div.--illust10 {
        top: calc(900 / var(--vw-min) * 100vw);
        right: 0;
        bottom: auto;
        left: auto;
    }
}

/*-----------------------------------------------
 * Staff&Cast
-------------------------------------------------*/
.staffcast {
    padding-top: min(calc(180 / var(--vw-min) * 100vw), 180px);
    padding-bottom: min(calc(140 / var(--vw-min) * 100vw), 140px);
    position: relative;
}
.staffcast:before {
    content: "";
    background: url(../img/top/bg/bg_building.png) repeat-x 0 0 / contain;
    width: 100%;
    height: min(calc(470 / var(--vw-min) * 100vw), 470px);
    position: absolute;
    bottom: 0;
    z-index: 0;
    animation: scroll-background 18s linear infinite;
}
@keyframes scroll-background {
    from {
        background-position: 0 0;
    }
    to {
        background-position: max(calc(-1336 / var(--vw-min) * 100vw),-1336px) 0;
    }
}
.staffcast__inner {
    width: min(calc(1000 / var(--vw-min) * 100vw), 1000px);
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .staffcast {
        padding-top: calc(130 / var(--vw-min) * 100vw);
        padding-bottom: calc(144 / var(--vw-min) * 100vw);
    }
    .staffcast:before {
        background-size: cover;
    }
    .staffcast__inner {
        width: 100%;
        padding: 0 calc(48 / var(--vw-min) * 100vw);
    }
}

/* title */
.staffcast__title {
    display: flex;
}
.staffcast__title--en {
    display: block;
    background: url(../img/top/title/title_staffcast.png) no-repeat center / contain;
    width: min(calc(720 / var(--vw-min) * 100vw), 720px);
    height: min(calc(84 / var(--vw-min) * 100vw), 84px);
}
.staffcast__title--ja {
    display: block;
    background: url(../img/top/title/title_staffcast_sub.png) no-repeat center / contain;
    width: min(calc(192 / var(--vw-min) * 100vw), 192px);
    height: min(calc(85 / var(--vw-min) * 100vw), 85px);
    margin-left: min(calc(14 / var(--vw-min) * 100vw), 14px);
}
@media screen and (max-width:768px){
    .staffcast__title {
        position: relative;
    }
    .staffcast__title--en {
        background-image: url(../img/top/title/title_staffcast_sp.png);
        width: calc(430 / var(--vw-min) * 100vw);
        height: calc(163 / var(--vw-min) * 100vw);
    }
    .staffcast__title--ja {
        position: absolute;
        bottom: 0;
        right: calc(134 / var(--vw-min) * 100vw);
    }
}

/* scCont */
.scCont {
    display: flex;
    gap: 0 min(calc(115 / var(--vw-min) * 100vw), 115px);
    margin-top: min(calc(100 / var(--vw-min) * 100vw), 100px);
}
.scCont__title {
    color: var(--color-yellow);
    font-size: min(calc(40 / var(--vw-min) * 100vw), 40px);
    letter-spacing: 0.02em;
    line-height: 1;
    width: min(calc(180 / var(--vw-min) * 100vw), 180px);
    white-space: nowrap;
    flex-shrink: 0;
}
@media screen and (max-width:768px){
    .scCont {
        flex-direction: column;
        margin-top: calc(75 / var(--vw-min) * 100vw);
    }
    .scCont:not(:first-of-type) {
        margin-top: calc(110 / var(--vw-min) * 100vw);
    }
    .scCont__title {
        width: auto;
        margin-bottom: calc(36 / var(--vw-min) * 100vw);
    }
}

/* scLists */
.scLists {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: min(calc(40 / var(--vw-min) * 100vw), 40px) 0;
    width: 100%;
}
.scLists__item.is-full {
    grid-column: 1 / -1;
}
.scLists__item > dt {
    color: var(--color-yellow);
    font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
    letter-spacing: 0.02em;
    line-height: 1;
    margin-bottom: 1em;
}
.scLists__item > dd {
    display: flex;
    gap: 0 min(calc(30 / var(--vw-min) * 100vw), 30px);
}
.scLists__item > dd.is-block {
    display: block;
}
.scLists__item > dd p {
    color: #fff;
    font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
    letter-spacing: 0.02em;
    line-height: 1;
}
.scLists__item > dd p.is-comment {
    display: flex;
    align-items: center;
    margin-top: -0.5em;
}
.scLists__item > dd p small {
    display: block;
    font-size: min(calc(14 / var(--vw-min) * 100vw), 14px);
    margin-top: 0.8em;
}
.scLists__item .commentBtn {
    background-color: var(--color-cream);
    -webkit-mask: url(../img/common/icon/icon_fukidashi_bg.png) no-repeat center / contain;
    mask: url(../img/common/icon/icon_fukidashi_bg.png) no-repeat center / contain;
    display: block;
    width: min(calc(40 / var(--vw-min) * 100vw), 40px);
    height: min(calc(40 / var(--vw-min) * 100vw), 40px);
    position: relative;
    margin-left: min(calc(12 / var(--vw-min) * 100vw), 12px);
}
@media screen and (hover: hover) and (pointer: fine) {
    .scLists__item .commentBtn {
        transition: transform .6s var(--easing-outquart);
    }
    .scLists__item .commentBtn:hover {
        transform: scale(1.15);
    }
}
.scLists__item .commentBtn[data-color-key="pink"] { background-color: var(--color-pink); }
.scLists__item .commentBtn[data-color-key="orange"] { background-color: var(--color-orange); }
.scLists__item .commentBtn[data-color-key="green"] { background-color: var(--color-green); }
.scLists__item .commentBtn[data-color-key="purple"] { background-color: var(--color-purple); }
.scLists__item .commentBtn[data-color-key="yellow"] { background-color: var(--color-yellow); }
.scLists__item .commentBtn:before {
    content: "";
    background-color: var(--color-blue);
    -webkit-mask: url(../img/common/icon/icon_fukidashi_dot.png) no-repeat center / contain;
    mask: url(../img/common/icon/icon_fukidashi_dot.png) no-repeat center / contain;
    width: min(calc(18 / var(--vw-min) * 100vw), 18px);
    height: min(calc(4 / var(--vw-min) * 100vw), 4px);
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
@media screen and (max-width:768px){
    .scLists {
        gap: calc(54 / var(--vw-min) * 100vw) 0;
    }
    .scLists__item > dt {
        font-size: calc(26 / var(--vw-min) * 100vw);
    }
    .scLists__item > dd {
        flex-direction: column;
        gap: calc(30 / var(--vw-min) * 100vw) 0;
    }
    .scLists__item > dd p {
        font-size: calc(28 / var(--vw-min) * 100vw);
    }
    .scLists__item > dd p small {
        font-size: calc(22 / var(--vw-min) * 100vw);
    }
    .scLists__item .commentBtn {
        width: calc(43 / var(--vw-min) * 100vw);
        height: calc(43 / var(--vw-min) * 100vw);
    }
    .scLists__item .commentBtn:before {
        width: calc(21 / var(--vw-min) * 100vw);
        height: calc(5 / var(--vw-min) * 100vw);
    }
}

/* road */
.staffcast__road {
    width: 100%;
    height: min(calc(100 / var(--vw-min) * 100vw), 100px);
    overflow: hidden;
    position: absolute;
    bottom: 0;
    left: 0;
}
.staffcast__road--car {
    background: url(../img/common/deco/deco_illust11.png) no-repeat center / contain;
    width: min(calc(99 / var(--vw-min) * 100vw), 99px);
    height: min(calc(65 / var(--vw-min) * 100vw), 65px);
    position: absolute;
    bottom: 0;
    animation: 
    drive 5s linear infinite,
    vibration 0.2s linear infinite;
}
@keyframes drive {
    0%   { left: max(-100px, -7.48502vw); }
    100% { left: 100%; }
}
@keyframes vibration {
    0%   { transform: translateY(0) rotate(0deg); }
    25%  { transform: translateY(-2px) rotate(-1deg); }
    50%  { transform: translateY(0) rotate(0deg); }
    75%  { transform: translateY(-1px) rotate(1deg); }
    100% { transform: translateY(0) rotate(0deg); }
}

/*-----------------------------------------------
 * Books
-------------------------------------------------*/
.books {
    background-color: var(--color-yellow);
    padding-top: min(calc(120 / var(--vw-min) * 100vw), 120px);
    padding-bottom: min(calc(80 / var(--vw-min) * 100vw), 80px);
    overflow: hidden;
    position: relative;
    padding-bottom: min(calc(80 / var(--vw-min) * 100vw), 80px);
}
.books:before {
    content: "";
    background-color: var(--color-green);
    width: 100vw;
    height: min(calc(308 / var(--vw-min) * 100vw), 308px);
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
}
.books__inner {
    position: relative;
    z-index: 2;
}
.books__head {
    width: min(calc(1000 / var(--vw-min) * 100vw), 1000px);
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .books {
        padding-top: calc(110 / var(--vw-min) * 100vw);
    }
    .books:before {
        height: calc(380 / var(--vw-min) * 100vw);
    }
    .books__head {
        width: 100%;
    }
}

/* title */
.books__title {
    display: flex;
}
.books__title--en {
    display: block;
    background: url(../img/top/title/title_books.png) no-repeat center / contain;
    width: min(calc(384 / var(--vw-min) * 100vw), 384px);
    height: min(calc(85 / var(--vw-min) * 100vw), 85px);
}
.books__title--ja {
    display: block;
    background: url(../img/top/title/title_books_sub.png) no-repeat center / contain;
    width: min(calc(104 / var(--vw-min) * 100vw), 104px);
    height: min(calc(69 / var(--vw-min) * 100vw), 69px);
    margin-left: min(calc(14 / var(--vw-min) * 100vw), 14px);
}
@media screen and (max-width:768px){
    .books__title {
        padding: 0 calc(48 / var(--vw-min) * 100vw);
    }
}

/* or */
.books__or {
    width: min(calc(425 / var(--vw-min) * 100vw), 425px);
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}
.books__or--title {
    width: 100%;
    height: min(calc(68 / var(--vw-min) * 100vw), 68px);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;
}
.books__or--title:before {
    content: "";
    border: min(calc(2 / var(--vw-min) * 100vw), 2px) solid var(--color-blue);
    border-radius: min(calc(34 / var(--vw-min) * 100vw), 34px) 0 0 min(calc(34 / var(--vw-min) * 100vw), 34px);
    background-color: var(--color-cream);
    width: calc((min(calc(1000 / var(--vw-min) * 100vw), 1000px) - min(calc(575 / var(--vw-min) * 100vw), 575px)) + ((100vw - min(calc(1000 / var(--vw-min) * 100vw), 1000px)) / 2));
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    box-sizing: border-box;
}
.books__or--title > span {
    color: var(--color-blue);
    display: block;
    font-size: min(calc(32 / var(--vw-min) * 100vw), 32px);
    letter-spacing: -.07em;
    line-height: 1;
    position: relative;
    z-index: 1;
}
.books__or--title > span small {
    font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
}
.books__or--text {
    width: calc(100% - min(calc(22 / var(--vw-min) * 100vw), 22px));
    height: min(calc(28 / var(--vw-min) * 100vw), 28px);
    display: flex;
    align-items: center;
    position: relative;
    margin-top: max(-14px, -1.0479vw);
}
.books__or--text:before {
    content: "";
    border: min(calc(2 / var(--vw-min) * 100vw), 2px) solid var(--color-blue);
    border-radius: min(calc(34 / var(--vw-min) * 100vw), 34px) 0 0 min(calc(34 / var(--vw-min) * 100vw), 34px);
    background-color: var(--color-pink);
    width: calc((min(calc(1000 / var(--vw-min) * 100vw), 1000px) - min(calc(596 / var(--vw-min) * 100vw), 596px)) + ((100vw - min(calc(1000 / var(--vw-min) * 100vw), 1000px)) / 2));
    height: 100%;
    position: absolute;
    top: 0;
    left: min(calc(22 / var(--vw-min) * 100vw), 22px);
    z-index: 0;
    box-sizing: border-box;
}
.books__or--text > span {
    color: #fff;
    display: block;
    font-size: min(calc(14 / var(--vw-min) * 100vw), 14px);
    letter-spacing: -.07em;
    line-height: 1;
    margin-left: min(calc(40 / var(--vw-min) * 100vw), 40px);
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .books__or {
        width: 100%;
        position: relative;
        top: auto;
        right: auto;
        margin-top: calc(38 / var(--vw-min) * 100vw);
        margin-left: calc(48 / var(--vw-min) * 100vw);
    }
    .books__or--title {
        justify-content: flex-start;
        height: calc(96 / var(--vw-min) * 100vw);
        padding-left: calc(48 / var(--vw-min) * 100vw);
    }
    .books__or--title:before {
        border: calc(4 / var(--vw-min) * 100vw) solid var(--color-blue);
        border-radius: calc(48 / var(--vw-min) * 100vw) 0 0 calc(48 / var(--vw-min) * 100vw);
        width: 100%;
    }
    .books__or--title > span {
        font-size: calc(42 / var(--vw-min) * 100vw);
    }
    .books__or--title > span small {
        font-size: calc(28 / var(--vw-min) * 100vw);
    }
    .books__or--text {
        width: 100%;
        height: calc(50 / var(--vw-min) * 100vw);
        margin-top: calc(-20 / var(--vw-min) * 100vw);
    }
    .books__or--text:before {
        border: calc(4 / var(--vw-min) * 100vw) solid var(--color-blue);
        border-radius: calc(25 / var(--vw-min) * 100vw) 0 0 calc(25 / var(--vw-min) * 100vw);
        width: 100%;
    }
    .books__or--text > span {
        font-size: calc(22 / var(--vw-min) * 100vw);
        left: calc(22 / var(--vw-min) * 100vw);
    }
}

/* bookListsArea */
.bookListsArea {
    width: min(calc(1000 / var(--vw-min) * 100vw), 1000px);
    margin: min(calc(50 / var(--vw-min) * 100vw), 50px) auto 0;
    position: relative;
}
.bookListsArea__text {
    background: url(../img/common/deco/deco_icon_paint2.png) no-repeat center / contain;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(calc(227 / var(--vw-min) * 100vw), 227px);
    height: min(calc(245 / var(--vw-min) * 100vw), 245px);
    position: absolute;
    top: 0;
    left: max(-120px, -8.98203vw);
}
.bookListsArea__text > span {
    font-size: min(calc(24 / var(--vw-min) * 100vw), 24px);
    line-height: 1.4;
    letter-spacing: 0.02em;
    text-align: center;
    display: block;
    position: relative;
    top: 0.6em;
    left: 0.6em;
}
@media screen and (max-width:768px){
    .bookListsArea {
        width: 100%;
    }
    .bookListsArea__text {
        width: calc(199 / var(--vw-min) * 100vw);
        height: calc(214 / var(--vw-min) * 100vw);
        left: calc(20 / var(--vw-min) * 100vw);
    }
    .bookListsArea__text > span {
        font-size: calc(26 / var(--vw-min) * 100vw);
        left: 0.4em;
    }
}

/* bookLists */
.bookListsWrap{
    padding-left: min(calc(122 / var(--vw-min) * 100vw), 122px);
    position: relative;
    z-index: 1;
}
.bookLists {
    display: flex;
    gap: 0 min(calc(20 / var(--vw-min) * 100vw), 20px);
}
.bookLists > li {
    width: min(calc(231 / var(--vw-min) * 100vw), 231px);
}
.bookLists > li a {
    display: block;
    text-decoration: none;
}
@media screen and (max-width:768px){
    .bookListsWrap{
        padding-left: calc(190 / var(--vw-min) * 100vw);
        padding-right: calc(96 / var(--vw-min) * 100vw);
    }
    .bookLists {
        gap: 0 calc(28 / var(--vw-min) * 100vw);
    }
}

.bookLists__img {
    border: min(calc(2 / var(--vw-min) * 100vw), 2px) solid var(--color-blue);
    width: 100%;
    position: relative;
}
.bookLists__img:before {
    content: "";
    background-color: var(--color-blue);
    width: 100%;
    height: 100%;
    position: absolute;
    top: min(calc(8 / var(--vw-min) * 100vw), 8px);
    left: min(calc(8 / var(--vw-min) * 100vw), 8px);
    z-index: 0;
}
.bookLists > li img {
    width: 100%;
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .bookLists__img {
        border-width: calc(4 / var(--vw-min) * 100vw);
    }
}

.bookLists__cap {
    background-color: var(--color-blue);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: min(calc(20 / var(--vw-min) * 100vw), 20px);
    width: 100%;
    height: min(calc(40 / var(--vw-min) * 100vw), 40px);
    font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
    letter-spacing: 0.02em;
    line-height: 1;
    margin-top: min(calc(20 / var(--vw-min) * 100vw), 20px);
    position: relative;
}
.bookLists__cap:before {
    content: "";
    background-color: var(--color-green);
    display: block;
    -webkit-mask: url(../img/common/icon/icon_arrow.png) no-repeat center / contain;
    mask: url(../img/common/icon/icon_arrow.png) no-repeat center / contain;
    width: min(calc(17 / var(--vw-min) * 100vw), 17px);
    height: min(calc(17 / var(--vw-min) * 100vw), 17px);
    margin: auto;
    position: absolute;
    top: 0;
    right: min(calc(16 / var(--vw-min) * 100vw), 16px);
    bottom: 0;
}
@media screen and (max-width:768px){
    .bookLists__cap {
        border-radius: calc(28 / var(--vw-min) * 100vw);
        height: calc(56 / var(--vw-min) * 100vw);
        font-size: calc(26 / var(--vw-min) * 100vw);
    }
    .bookLists__cap:before {
        width: calc(28 / var(--vw-min) * 100vw);
        height: calc(28 / var(--vw-min) * 100vw);
    }
}
@media screen and (hover: hover) and (pointer: fine) {
    .bookLists__img:before {
        transition: all .3s ease;
    }
    .bookLists > li a:hover .bookLists__img:before {
        top: 0;
        left: 0;
    }
    .bookLists__cap {
        transition: background-color .3s ease;
    }
    .bookLists > li a:hover .bookLists__cap {
        background-color: var(--color-pink);
    }
}

/* scrollbar */
@media screen and (max-width:768px){
    .bookLists__scrollbarWrap {
        padding-left: calc(190 / var(--vw-min) * 100vw);
        margin-top: calc(40 / var(--vw-min) * 100vw);
        width: 100%;
        height: calc(8 / var(--vw-min) * 100vw);
        position: relative;
    }
    .bookLists__scrollbar {
        background-color: #fff;
        border-radius: calc(4 / var(--vw-min) * 100vw) 0 0 calc(4 / var(--vw-min) * 100vw);
        width: 100%;
        height: 100%;
    }
    .bookLists__scrollbar .swiper-scrollbar-drag {
        background-color: var(--color-pink);
        border-radius: calc(4 / var(--vw-min) * 100vw);
    }
}

/* deco */
.books__deco {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
.books__deco:before {
    content: "";
    background: url(../img/common/deco/deco_dot.png) no-repeat center / contain;
    width: min(calc(416 / var(--vw-min) * 100vw), 416px);
    height: min(calc(416 / var(--vw-min) * 100vw), 416px);
    position: absolute;
    top: 0;
    right: max(-152px, -11.37724vw);
    z-index: 0;
}
.books__deco:after {
    content: "";
    background: url(../img/common/deco/deco_dot.png) no-repeat center / contain;
    width: min(calc(416 / var(--vw-min) * 100vw), 416px);
    height: min(calc(416 / var(--vw-min) * 100vw), 416px);
    position: absolute;
    bottom: min(calc(167 / var(--vw-min) * 100vw), 167px);
    left: max(-125px, -9.35628vw);
    z-index: 0;
}

/*-----------------------------------------------
 * Scroll animation
-------------------------------------------------*/
.commonTitle--en,
.commonTitle--ja {
    transform: translateY(100%);
	opacity: 0;
	transition: transform .6s var(--easing-first), opacity .3s ease;
}
.commonTitle.is-ani .commonTitle--ja { transition-delay: .1s; }
.commonTitle.is-ani .commonTitle--en,
.commonTitle.is-ani .commonTitle--ja {
    transform: translateY(0);
	opacity: 1;
}
.aniCont {
    transform: translateY(100%);
	opacity: 0;
	transition: transform .6s var(--easing-first), opacity .3s ease;
}
.aniCont.is-ani {
    transform: translateY(0);
	opacity: 1;
}
.bookLists > li > a {
    transform: translateX(50%);
	opacity: 0;
	transition: transform .6s var(--easing-first), opacity .3s ease;
}
.bookLists.is-ani > li > a {
    transition-delay: calc(var(--i) * 0.1s);
    transform: translateX(0);
	opacity: 1;
}