@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text:ital@0;1&display=swap');

@keyframes pink {
    0% {
        offset-distance: 0
    }

    to {
        offset-distance: 100%
    }
}

@keyframes blue {
    0% {
        offset-distance: 0
    }

    to {
        offset-distance: 100%
    }
}

@keyframes fadeB {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes fadeA {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes msgFade {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@font-face {
    font-family: "nm";
    src: url(../font/nm3.woff2)format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "nm";
    src: url(../font/nm4.woff2)format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "nm";
    src: url(../font/nm6.woff2)format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

* {
    margin: 0;
    padding: 0;
    font: inherit
}

html {
    -webkit-text-size-adjust: none;
    -webkit-font-smoothing: antialiased
}

li,
ul {
    list-style: none
}

button,
input,
select,
textarea {
    display: block;
    color: inherit;
    outline: 0;
    border: 0;
    background: 0 0
}

input,
select,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0
}

button:focus,
input:focus,
textarea:focus {
    outline: 0
}

button:hover,
input[type=submit]:hover {
    cursor: pointer
}

textarea {
    overflow: auto
}

label {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

a,
label,
span {
    display: block
}

a {
    color: inherit;
    text-decoration: none
}

.film-hero-img-video iframe,
img,
picture,
svg,
video {
    display: block;
    width: 100%;
    height: 100%
}

img {
    -o-object-fit: cover;
    object-fit: cover
}

:root {
    --d: 1440;
    --m: 390;
    --vw: calc(100vw/var(--d));
    --col: calc(var(--vw)*94);
    --gutter: calc(var(--vw)*24);
    --marge: calc(var(--vw)*24);
    --top: calc(var(--vw)*24);
    --bottom: calc(var(--vw)*24);
    --color-lazy: rgba(1, 7, 36, .9);
    --color-error: #FF5252;
    --color-success: #2FBD0C;
    --o2: cubic-bezier(.5, 1, .89, 1);
    --o6: cubic-bezier(.19, 1, .22, 1);
    --io2: cubic-bezier(.45, 0, .55, 1)
}

@media (max-width:800px) and (orientation:portrait) {
    :root {
        --vw: calc(100vw/var(--m));
        --col: calc(var(--vw)*54);
        --gutter: calc(var(--vw)*20);
        --marge: calc(var(--vw)*20);
        --top: calc(var(--vw)*10);
        --bottom: calc(var(--vw)*10)
    }
}

@media (min-aspect-ratio:1440/810) {
    :root {
        --vr: calc(100svh/810)
    }
}

@media (max-aspect-ratio:1440/810) {
    :root {
        --vr: 0.0694vw
    }
}

@media (max-width:800px) and (min-aspect-ratio:390/844) {
    :root {
        --vr: calc(100svh/844)
    }
}

@media (max-width:800px) and (max-aspect-ratio:390/844) {
    :root {
        --vr: 0.2564vw
    }
}

#s {
    position: absolute;
    width: 0;
    height: 0
}

body,
html {
    width: 100%;
    height: 100%
}

html {
    -webkit-tap-highlight-color: transparent;
    background: #010724
}

body {
    position: relative;
    font-family: "nm";
    color: #fff;
    overflow-y: scroll;
    overscroll-behavior-y: contain;
    overscroll-behavior-x: none
}

body.no-scroll {
    overflow: hidden
}

::-moz-selection {
    color: #010724;
    background: #fff;
    text-shadow: none
}

::selection {
    color: #010724;
    background: #fff;
    text-shadow: none
}

#_ {
    height: 100%
}

#home-calendar-list ul::-webkit-scrollbar,
body::-webkit-scrollbar {
    display: none
}

#g-cta,
#g_ {
    position: fixed;
    top: 0;
    left: 0
}

#g-cta {
    z-index: 9997;
    width: var(--marge);
    height: var(--marge);
    background: red;
    opacity: .5;
    cursor: pointer
}

#g_ {
    z-index: 9996;
    bottom: 0;
    right: 0;
    padding-left: var(--marge);
    padding-right: var(--marge);
    pointer-events: none
}

#g,
#lo,
#lo-bg {
    width: 100%;
    height: 100%
}

#g {
    display: flex;
    justify-content: space-between
}

#g::after,
#g::before {
    content: "";
    z-index: 0;
    position: absolute;
    left: 0;
    width: 100%;
    opacity: .15
}

#g::before {
    top: 0;
    height: var(--top);
    background: #00f
}

#g::after {
    bottom: 0;
    height: var(--bottom);
    background: green
}

#g_.g_o #g div,
#g_.g_o #g::after,
#g_.g_o #g::before {
    opacity: .3
}

#g div {
    position: relative;
    width: var(--col);
    height: 100%;
    background: red;
    opacity: .15
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: .9rem;
    font-weight: 500;
    line-height: 1.2;
}

@media (max-width:800px) and (orientation:portrait) {
    #g div:nth-child(n+6) {
        display: none
    }
}

#lo,
#lo-bg {
    top: 0;
    left: 0
}

#lo {
    z-index: 9995;
    position: fixed;
    overflow: hidden
}

#lo-bg {
    position: absolute;
    background: #010724;
    will-change: opacity
}

#lo-pr,
#lo-pr div {
    will-change: transform
}

#lo-pr {
    position: relative;
    height: 3px;
    width: 100%
}

#lo-pr div {
    background: #fff;
    transform: translate3d(-110%, 0, 0);
    transition: 1000ms transform
}

#ball>div,
#lo-pr div,
.i_ {
    width: 100%;
    height: 100%
}

.i_ {
    z-index: 9999;
    position: fixed;
    top: 0;
    left: 0;
    text-align: center;
    background: #fff;
    color: #000;
    font-family: Arial;
    font-size: 16px
}

.i {
    position: absolute;
    top: calc(50% - 9px);
    padding: 0 30px;
    box-sizing: border-box
}

#ball-wrap,
#grid-bg {
    position: fixed;
    z-index: 0
}

#ball-wrap,
.i {
    left: 0;
    width: 100%
}

#ball-wrap {
    top: 0;
    height: 100svh;
    background: #010724
}

#grid-bg {
    top: .5vw;
    left: 1vw;
    right: 1vw;
    height: calc(100svh - .5vw);
    background-image: url(../image/0.png);
    background-position: center;
    background-size: 4.8%;
    opacity: 0
}

@media (max-width:800px) and (orientation:portrait) {
    #grid-bg {
        top: 0;
        height: 100svh;
        background-size: 15%
    }
}

#ball {
    position: absolute;
    top: calc(50% - 45vh);
    left: calc(50% - 45vh);
    width: 90vh;
    height: 90vh;
    mix-blend-mode: overlay;
    will-change: opacity;
    opacity: 0
}

#ball>div {
    border-radius: 100%;
    background: radial-gradient(50% 50%at 50% 50%, #000aff 0, #143aff 64.5%, #ff1485 95%, #ff95c8 100%);
    filter: blur(10px);
    opacity: .5
}

@media (max-width:800px) and (orientation:portrait) {
    #ball {
        top: calc(50% - 58.5vw);
        left: calc(50% - 58.5vw);
        width: 117vw;
        height: 117vw
    }
}

#light-pink-over {
    position: absolute;
    top: calc(50% - 20vh);
    left: calc(50% + 10vh);
    width: 20vh;
    height: 20vh;
    will-change: opacity;
    opacity: 0
}

#light-pink-over>div,
#light-pink>div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-color: #ff1485;
    filter: blur(100px);
    opacity: .4
}

@media (max-width:800px) and (orientation:portrait) {
    #light-pink-over {
        top: calc(50% - 26vw);
        left: calc(50% + 13vw);
        width: 26vw;
        height: 26vw
    }
}

#light-pink {
    position: absolute;
    top: calc(50% - 35vh);
    left: calc(50% - 5vh);
    width: 50vh;
    height: 50vh;
    will-change: opacity;
    opacity: 0
}

#light-pink>div {
    opacity: .5
}

@media (max-width:800px) and (orientation:portrait) {
    #light-pink {
        top: calc(50% - 45.5vw);
        left: calc(50% - 6.5vw);
        width: 65vw;
        height: 65vw
    }

    #light-pink>div {
        opacity: .8
    }
}

#light-blue-over {
    position: absolute;
    top: calc(50% + 5vh);
    left: calc(50% - 30vh);
    width: 20vh;
    height: 20vh;
    will-change: opacity;
    opacity: 0
}

#light-blue-over>div,
#light-blue>div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-color: #000aff;
    filter: blur(100px);
    opacity: .2
}

@media (max-width:800px) and (orientation:portrait) {
    #light-blue-over {
        top: calc(50% + 6.5vw);
        left: calc(50% - 39vw);
        width: 13vw;
        height: 13vw
    }
}

#light-blue {
    position: absolute;
    top: calc(50% - 15vh);
    left: calc(50% - 50vh);
    width: 50vh;
    height: 50vh;
    will-change: opacity;
    opacity: 0
}

#light-blue>div {
    opacity: .5
}

@media (max-width:800px) and (orientation:portrait) {
    #light-blue {
        top: calc(50% - 19.5vw);
        left: calc(50% - 65vw);
        width: 65vw;
        height: 65vw
    }

    #light-blue>div {
        opacity: .6
    }
}

#light-blue,
#light-blue-over,
#light-pink,
#light-pink-over {
    offset-path: path("M394.919,277.171s-2.4,131.081-54.064,131.11-47.82-138.35-47.82-138.35c0,0-6.631-159.537,42.416-162.821,49.047-3.284,43.266,180.68,43.266,180.68,0,0-1.242,115.587,72.656,112.288,73.898-3.298,50.913-170.966,34.548-197.004-16.364-26.038-60.177-17.873-60.177-17.873,0,0-47.085,3.283-48.449-94.394s-79.196-112.285-77.829-9.723c1.367,102.561,22.315,138.365,62.208,138.342,39.893-.023,39.216-76.537,35.918-107.467-3.298-30.93-10.532-100.928,30.663-110.719,41.195-9.791,54.327,81.367,53.701,130.207-.626,48.839-1.868,164.426-49.607,166.081-47.74,1.655-50.285,125.382-49.618,148.174.667,22.791,11.164,81.392,60.202,61.828,49.037-19.564,47.666-130.265,45.671-188.871-1.996-58.606,3.806-205.126-33.486-231.153-37.292-26.026-58.885-47.177-102.028-11.337-43.142,35.84-57.465,149.806-41.734,211.66,15.731,61.854,58.315,193.695,108.662,175.759,50.346-17.936,84.994-40.748,90.181-118.893,5.187-78.146-5.357-218.145-62.253-218.112-56.896.033-53.027,150.59-53.027,150.59Z");
    animation-name: pink;
    animation-duration: 40s;
    animation-timing-function: linear;
    animation-delay: 0ms;
    animation-direction: normal;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite
}

#light-blue,
#light-blue-over {
    offset-path: path("M100.068,234.82s2.051-131.081,46.436-131.106c44.385-.025,41.093,138.354,41.093,138.354,0,0,5.71,159.538-36.426,162.818-42.136,3.28-37.185-180.683-37.185-180.683,0,0,1.057-115.586-62.428-112.294S7.833,282.87,21.894,308.909c14.061,26.039,51.699,17.878,51.699,17.878,0,0,40.45-3.279,41.63,94.398,1.18,97.678,68.047,112.291,66.864,9.73-1.182-102.561-19.182-138.366-53.454-138.347-34.272.02-33.685,76.534-30.849,107.464,2.836,30.93,9.056,100.929-26.334,110.717-35.39,9.788-46.679-81.372-46.145-130.211.534-48.839,1.591-164.426,42.605-166.077,41.013-1.651,43.19-125.378,42.615-148.17S100.928-15.102,58.801,4.458C16.674,24.017,17.861,134.719,19.58,193.325c1.719,58.606-3.254,205.126,28.786,231.155,32.04,26.029,50.592,47.182,87.653,11.346,37.061-35.837,49.356-149.801,35.836-211.657-13.52-61.855-50.115-193.7-93.366-175.767C35.239,66.334,5.475,89.143,1.025,167.288c-4.45,78.145,4.62,218.145,53.5,218.117,48.88-.028,45.544-150.585,45.544-150.585Z");
    animation-name: blue;
    animation-duration: 50s
}

#cookie,
.cta {
    display: flex;
    overflow: hidden
}

#cookie {
    position: fixed;
    z-index: 9999;
    left: calc(var(--col)*1 + var(--gutter)*1);
    right: calc(var(--col)*1 + var(--gutter)*1);
    bottom: var(--gutter);
    padding: var(--gutter);
    border-radius: calc(var(--vr)*20);
    box-sizing: border-box;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .25);
    background: rgba(1, 7, 36, .6);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    opacity: 0;
    pointer-events: none
}

@media (max-width:800px) and (orientation:portrait) {
    #cookie {
        display: block;
        left: var(--gutter);
        right: var(--gutter)
    }
}

#cookie-left {
    padding-right: calc(var(--vr)*80);
    width: calc(100% - var(--vr)*376);
    box-sizing: border-box
}

#cookie-left-title {
    font-size: calc(var(--vr)*20);
    line-height: 110%
}

#cookie-left p {
    margin-top: calc(var(--vr)*14);
    font-size: calc(var(--vr)*14);
    line-height: 120%
}

@media (max-width:800px) and (orientation:portrait) {
    #cookie-left {
        padding-right: 0;
        width: 100%
    }
}

#cookie-right {
    width: calc(var(--vr)*376);
    display: flex;
    justify-content: space-between
}

#cookie-right .cta {
    margin-top: calc(var(--vr)*40);
    width: calc(var(--vr)*178);
    box-sizing: border-box
}

@media (max-width:800px) and (orientation:portrait) {
    #cookie-right {
        display: block;
        margin-top: calc(var(--vr)*16);
        width: 100%
    }

    #cookie-right .cta {
        margin-top: 0;
        width: 100%
    }

    #cookie-right .cta:last-child {
        margin-top: var(--gutter)
    }
}

.cta {
    position: relative;
    height: calc(var(--vw)*48);
    align-items: center;
    cursor: pointer
}

#n-link a.on,
#n-r a.on,
.cta>div,
.cta>span {
    pointer-events: none
}

.cta-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transition: opacity 300ms
}

._d .cta:hover .cta-bg {
    opacity: .8
}

.cta-txt {
    position: relative;
    width: 100%;
    color: #010724;
    font-size: calc(var(--vw)*12)
}

.cta-txt>div,
.cta-txt>span,
.footer-top-r-b-newsletter-submit>span>span {
    width: 100%;
    text-align: center
}

.cta-txt>div:nth-child(1),
.cta-txt>span:nth-child(1) {
    opacity: 0
}

.cta-txt>div:nth-child(2),
.cta-txt>span:nth-child(2) {
    position: absolute;
    top: 0;
    left: 0
}

.k-o {
    opacity: 0;
    will-change: opacity
}

.k-o-0 {
    transition: opacity 1000ms var(--io2) 300ms
}

._d .z-s a:hover,
.k-o.on {
    opacity: 1
}

.l {
    width: 100%;
    height: 1px;
    overflow: hidden
}

.l div {
    width: 100%;
    height: 100%;
    background: #000;
    transform: translate3d(110%, 0, 0)
}

.link {
    position: relative;
    display: table;
    height: calc(var(--vw)*24);
    transition: opacity 200ms
}

.link .y {
    display: flex;
    pointer-events: none
}

.l div,
.link-txt {
    will-change: transform
}

.link-txt {
    margin-left: calc(var(--vw)*10);
    font-size: calc(var(--vw)*18);
    line-height: calc(var(--vw)*24)
}

.link-arrow {
    fill: #fff;
    margin-top: calc(var(--vw)*4);
    width: calc(var(--vw)*29);
    height: calc(var(--vw)*16);
    will-change: transform
}

.link-arrow-right {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate3d(120%, 0, 0)
}

.link-arrow-left {
    transition: transform 800ms var(--o6) 120ms
}

._d .link:hover .link-arrow-left,
.link-arrow-right,
.link-txt {
    transition: transform 800ms var(--o6) 0ms
}

._d .link:hover .link-arrow-left {
    transform: translate3d(-120%, 0, 0)
}

._d .link:hover .link-txt {
    transition: transform 800ms var(--o6) 0ms;
    transform: translate3d(-2.8vw, 0, 0)
}

._d .link:hover .link-arrow-right {
    transition: transform 800ms var(--o6) 120ms;
    transform: translate3d(0, 0, 0)
}

#n {
    position: fixed;
    z-index: 9994;
    top: 0;
    left: 0;
    font-size: calc(var(--vw)*12);
    line-height: 120%;
    letter-spacing: .01em;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

#n,
#n-bar,
.n-link-bg {
    width: 100%;
    pointer-events: none
}

#n-bar {
    position: relative;
    display: flex;
    justify-content: space-between
}

@media (max-width:800px) and (orientation:portrait) {
    #n-bar {
        pointer-events: none;
        display: flex;
        justify-content: center
    }
}

#n-l {
    display: flex
}

#n-link a,
#n-logo,
#n-r a {
    position: relative;
    pointer-events: all
}

#n-logo {
    margin-top: calc(var(--marge) - var(--vw)*1);
    margin-left: calc(var(--marge) - var(--vw)*1);
    /* width: calc(var(--col) + var(--gutter) + var(--vw)*-20); */
    /* aspect-ratio: 120/80; */
    width: 92px;
    fill: #fff;
    opacity: 0;
    transition: .5s all ease-in-out;
}

@media (max-width:800px) and (orientation:portrait) {
    #n-logo {
        margin-top: var(--top);
        margin-left: 0;
        /* width: calc(var(--col)*2 + var(--gutter) + var(--vw)*2) */
    }
}

#n-link {
    margin-top: calc(var(--marge) + var(--vw)*23);
    margin-left: calc(var(--col)*.5);
    display: flex
}

#n-link a,
#n-r a {
    display: flex;
    align-items: center;
    overflow: hidden
}

#n-link a {
    align-self: flex-start;
    margin-right: calc(var(--vw)*10);
    transition: opacity 600ms;
    height: calc(var(--vw)*20);
    letter-spacing: 1.2px;
}

@media (max-width:800px) and (orientation:portrait) {
    #n-link {
        display: none
    }
}

.n-link-bg {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    overflow: hidden
}

.n-link-txt {
    position: relative;
    mix-blend-mode: difference;
    pointer-events: none
}

.n-link-txt .y {
    padding-left: calc(var(--vw)*5);
    padding-right: calc(var(--vw)*5)
}

#n-r {
    margin-top: calc(var(--marge) + var(--vw)*16);
    margin-right: var(--marge);
    display: flex
}

#n-r a {
    height: calc(var(--vw)*34)
}

#n-r a:nth-child(2) {
    display: none
}

@media (max-width:800px) and (orientation:portrait) {
    #n-r {
        display: none
    }
}

.n-r-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none
}

#n-r a:nth-child(1) .n-r-bg {
    border: 1px solid #fff;
    box-sizing: border-box;
    opacity: 0;
    will-change: opacity
}

#n-r a.on:nth-child(1) .n-r-bg {
    border: 0 solid #fff;
    background: #d63eda
}

#n-r a.on:nth-child(1) .n-r-txt {
    color: #fff
}

#n-r a:nth-child(2) .n-r-bg {
    transform: translate3d(-110%, 0, 0);
    will-change: transform;
    background: #fff;
    transition: opacity 300ms
}

._d #n-r a:nth-child(2):hover .n-r-bg,
._d .footer-top-r-b-newsletter-submit:hover>span:nth-child(1) {
    opacity: .8
}

#n-r a:nth-child(2) .n-r-txt {
    color: #010724
}

#n-r a.on:nth-child(2) .n-r-bg {
    background: #d63eda
}

#n-r a.on:nth-child(2) .n-r-txt {
    color: #fff
}

.n-r-txt {
    position: relative;
    pointer-events: none
}

.n-r-txt .y {
    padding-left: calc(var(--vw)*16);
    padding-right: calc(var(--vw)*16)
}

#n-burger_ {
    display: none
}

@media (max-width:800px) and (orientation:portrait) {
    #n-burger_ {
        position: absolute;
        top: calc(var(--vw)*22);
        right: 0;
        width: calc(var(--vw)*60);
        height: calc(var(--vw)*60);
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        pointer-events: all
    }

    #n-burger {
        width: 30px;
        height: 30px;
        pointer-events: none;
        fill: #fff;
        opacity: 0
    }
}

#n-menu {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    display: none
}

@media (max-width:800px) and (orientation:portrait) {
    #n-menu {
        display: block
    }
}

#n-menu-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #020d3a;
    opacity: 0;
    will-change: opacity
}

#n-menu-link {
    position: relative;
    top: 0;
    height: 100%
}

#n-menu-link>div {
    margin-bottom: calc(var(--vr)*30);
    width: 100%
}

#n-menu-link a {
    margin-left: var(--marge);
    margin-right: var(--marge);
    padding: calc(var(--vr)*8)0
}

#n-menu-link a.on {
    opacity: .5
}

#n-menu-link .y_ {
    width: 100%
}

#n-menu-link,
#n-menu-link .y {
    display: flex;
    align-items: center
}

#n-menu-link .y {
    width: 100%;
    justify-content: space-between
}

.n-menu-link-txt {
    font-size: calc(var(--vr)*50);
    line-height: 100%
}

.n-menu-link-arrow {
    width: calc(var(--vr)*29);
    height: calc(var(--vr)*16);
    fill: #fff
}

#n-menu-bottom {
    position: absolute;
    bottom: var(--marge);
    left: var(--marge);
    right: var(--marge)
}

#n-menu-bottom a {
    position: relative;
    height: calc(var(--vr)*60);
    display: flex;
    align-items: center;
    overflow: hidden
}

#n-menu-bottom a:nth-child(2) {
    display: none
}

.n-menu-bottom-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#n-menu-bottom a:nth-child(1) .n-menu-bottom-bg {
    border: 1px solid #fff;
    box-sizing: border-box;
    opacity: 0;
    will-change: opacity
}

#n-menu-bottom a:nth-child(2) .n-menu-bottom-bg {
    background: #fff;
    transform: translate3d(0, 110%, 0);
    will-change: transform
}

.n-menu-bottom-txt {
    width: 100%;
    font-size: calc(var(--vr)*16);
    line-height: 130%;
    letter-spacing: .01em;
    text-align: center;
    pointer-events: none
}

#n-menu-bottom a:nth-child(1) .n-menu-bottom-txt {
    color: #fff
}

#n-menu-bottom a:nth-child(2) .n-menu-bottom-txt {
    color: #010724
}

.o {
    opacity: 0;
    will-change: opacity
}

.ran {
    position: relative
}

.ran>div:nth-child(1),
.ran>span:nth-child(1) {
    position: relative;
    opacity: 0
}

.ran>div:nth-child(2),
.ran>span:nth-child(2) {
    position: absolute;
    top: 0
}

#n-r-txt .ran>div:nth-child(2),
#n-r-txt .ran>span:nth-child(2) {
    left: calc(var(--vw)*16)
}

.n-link-txt .ran>div:nth-child(2),
.n-link-txt .ran>span:nth-child(2) {
    left: calc(var(--vw)*5)
}

#a {
    z-index: 9993;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none
}

#a-bg,
#a-no {
    will-change: opacity;
    opacity: 0
}

#a-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #010724
}

#a-no {
    position: relative;
    font-size: 14px;
    color: #fff
}

._sl a {
    display: inline
}

.t-l {
    font-size: calc(var(--vw)*120);
    line-height: 90%;
    font-weight: 500
}

@media (max-width:800px) and (orientation:portrait) {
    .t-l {
        font-size: calc(var(--vw)*45)
    }
}

.u-a {
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px
}

.u-a::after,
.u-a::before {
    bottom: 0;
    height: 100%;
    background: #fff
}

.u-b {
    top: 0;
    left: calc(var(--vw)*5);
    right: calc(var(--vw)*5);
    bottom: 0
}

.u-b::after,
.u-b::before {
    bottom: 0;
    height: 1px;
    /* background: #d63eda */
    background: #ffffff
}

.prompt-nav-d li,
.u_,
.z-s a {
    position: relative
}

.u {
    position: absolute;
    pointer-events: none
}

.u::after,
.u::before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    will-change: transform
}

.u-0::before {
    transform: translate3d(-102%, 0, 0);
    opacity: 0
}

._d .u_:hover .u-0::before,
.u-0::after,
.u_.on .u-0::before {
    transition: transform 1000ms var(--o6);
    transform: translate3d(102%, 0, 0);
    opacity: 1
}

._d .u_:hover .u-0::before,
.u_.on .u-0::before {
    transform: translate3d(0, 0, 0)
}

._d .u_:hover .u-0::after,
.u_.on .u-0::after {
    transition: none;
    transform: translate3d(0, 0, 0);
    opacity: 0
}

.u-1::before {
    transition: transform 1000ms var(--o6) 100ms
}

.u-1::after {
    transform: translate3d(-102%, 0, 0);
    transition: transform 1000ms var(--o6)
}

._d .u_:hover .u-1::before,
.u_.on .u-1::before {
    transform: translate3d(102%, 0, 0);
    transition: transform 1000ms var(--o6)
}

._d .u_:hover .u-1::after,
.u_.on .u-1::after {
    transform: translate3d(0, 0, 0);
    transition: transform 1000ms var(--o6) 100ms
}

.u,
.y_ {
    overflow: hidden
}

.y {
    will-change: transform;
    transform: translate3d(0, 110%, 0)
}

.z-s a {
    display: inline;
    pointer-events: all;
    opacity: .6;
    transition: opacity 200ms
}

#contact-hero .t-l {
    padding-top: calc(var(--vw)*80);
    margin-left: var(--marge);
    width: calc(var(--vw)*850)
}

@media (max-width:800px) and (orientation:portrait) {
    #contact-hero .t-l {
        padding-top: calc(var(--vw)*80);
        margin-right: var(--marge);
        width: auto
    }
}

#contact-form {
    padding-top: calc(var(--vw)*90);
    padding-bottom: calc(var(--vw)*140);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*8 + var(--gutter)*7 + var(--gutter))
}

@media (max-width:800px) and (orientation:portrait) {
    #contact-form {
        padding-top: calc(var(--vw)*50);
        padding-bottom: calc(var(--vw)*90);
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

#contact-form-select {
    margin-left: calc(var(--gutter)*.5);
    display: flex;
    line-height: calc(var(--vw)*24);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

@media (max-width:800px) and (orientation:portrait) {
    #contact-form-select {
        margin-left: 0;
        display: block;
        line-height: calc(var(--vw)*40)
    }
}

#contact-form-select-label {
    font-size: calc(var(--vw)*20);
    pointer-events: none
}

.contact-form-select-option {
    display: table;
    margin-left: calc(var(--vw)*20);
    cursor: pointer
}

.contact-form-select-option .y {
    display: flex;
    pointer-events: none
}

.contact-form-select-option-circle {
    position: relative;
    margin-top: calc(var(--vw)*2);
    width: calc(var(--vw)*18);
    height: calc(var(--vw)*18);
    border-radius: 100%;
    border: 1px solid #fff;
    background: rgba(255, 255, 255, .2)
}

.contact-form-select-option.on .contact-form-select-option-circle {
    background: #fff
}

.contact-form-select-option-txt {
    margin-left: calc(var(--vw)*10);
    font-size: calc(var(--vw)*12)
}

@media (max-width:800px) and (orientation:portrait) {
    .contact-form-select-option {
        margin-left: 0
    }

    .contact-form-select-option-circle {
        margin-top: calc(var(--vw)*10)
    }
}

#contact-details {
    padding-top: calc(var(--vw)*60)
}

#contact-details-title {
    margin-left: calc(var(--gutter)*.5);
    font-size: calc(var(--vw)*20);
    line-height: 110%
}

@media (max-width:800px) and (orientation:portrait) {
    #contact-details-title {
        margin-left: 0
    }
}

#contact-details-field_,
.film-intro-tag-ul ul {
    display: flex;
    flex-wrap: wrap
}

.contact-details-field {
    margin-top: calc(var(--vw)*20);
    margin-left: calc(var(--gutter)*.5);
    margin-right: calc(var(--gutter)*.5)
}

.contact-details-field label,
.submit-s1-form-field label {
    display: table;
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*14);
    cursor: pointer;
    letter-spacing: 1.2px;

}

.contact-details-field-input {
    margin-top: calc(var(--vw)*10);
    padding-left: calc(var(--vw)*20);
    padding-right: calc(var(--vw)*20);
    box-sizing: border-box;
    width: calc(var(--col)*8/3 + var(--gutter)*7/3 - var(--gutter)*2/3);
    height: calc(var(--vw)*48);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*48)
}

.contact-details-field-input::-moz-placeholder {
    color: rgba(255, 255, 255, .5)
}

.contact-details-field-input::placeholder {
    color: rgba(255, 255, 255, .5)
}

.contact-details-field-textarea {
    margin-top: calc(var(--vw)*10);
    padding: calc(var(--vw)*20);
    box-sizing: border-box;
    width: calc(var(--col)*8 + var(--gutter)*7);
    height: calc(var(--vw)*176);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*16);
    resize: none
}

@media (max-width:800px) and (orientation:portrait) {
    #contact-details-field_ {
        display: block
    }

    .contact-details-field {
        margin-left: 0;
        margin-right: 0
    }

    .contact-details-field-input,
    .contact-details-field-textarea {
        width: 100%
    }
}

#contact-submit {
    margin-top: calc(var(--vw)*80);
    width: 100%;
    display: flex;
    justify-content: center
}

#contact-submit .cta {
    width: calc(var(--col)*2 + var(--gutter)*1)
}

#contact-msg {
    margin-top: calc(var(--vw)*10);
    text-align: center;
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*20)
}

.film-hero {
    position: relative;
    margin: auto;
    width: calc(var(--col)*8 + var(--gutter)*9);
    overflow: hidden
}

@media (max-width:800px) and (orientation:portrait) {
    .film-hero {
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

.film-hero-img {
    position: relative;
    margin-top: calc(var(--vw)*160);
    width: 100%;
    aspect-ratio: 16/9;
    background: #000;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: none
}

@media (max-width:800px) and (orientation:portrait) {
    .film-hero-img {
        margin-top: calc(var(--vw)*160)
    }
}

.film-hero-img-cover_ {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: all;
    cursor: pointer
}

.film-hero-img-cover_.fx {
    transition: opacity 500ms;
    opacity: 0
}

.film-hero-img-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none
}

.film-hero-img-play {
    position: relative;
    top: 0;
    left: 0;
    width: calc(var(--vw)*72);
    height: calc(var(--vw)*72);
    fill: #fff;
    pointer-events: none
}

@media (max-width:800px) and (orientation:portrait) {
    .film-hero-img-play {
        width: calc(var(--vw)*60);
        height: calc(var(--vw)*60)
    }
}

.film-hero-img-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0
}

.film-hero-txt {
    margin-top: calc(var(--vw)*18);
    display: flex;
    justify-content: space-between
}

@media (max-width:800px) and (orientation:portrait) {
    .film-hero-txt {
        position: relative;
        display: block;
        margin-top: calc(var(--vw)*30)
    }
}

.film-hero-txt-left {
    width: calc(var(--col)*5 + var(--gutter)*6)
}

@media (max-width:800px) and (orientation:portrait) {
    .film-hero-txt-left {
        width: auto
    }
}

.film-hero-txt-left h1 {
    font-size: calc(var(--vw)*35);
    line-height: 100%
}

.film-hero-txt-left-author {
    margin-top: calc(var(--vw)*12);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

.film-hero-txt-right {
    display: none
}

.film-hero-txt-right-like-cta {
    margin-top: calc(var(--vw)*5);
    padding-left: calc(var(--vw)*28);
    padding-right: calc(var(--vw)*24);
    height: calc(var(--vw)*34);
    box-sizing: border-box;
    border: 1px solid #fff;
    border-radius: calc(var(--vw)*1);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

@media (max-width:800px) and (orientation:portrait) {
    .film-hero-txt-right-like-cta {
        margin-top: calc(var(--vw)*20)
    }
}

.film-hero-txt-right-like {
    display: flex;
    height: calc(var(--vw)*16);
    pointer-events: none
}

.film-hero-txt-right-like-total {
    height: calc(var(--vw)*16);
    line-height: calc(var(--vw)*16);
    font-size: calc(var(--vw)*14)
}

.film-hero-txt-right-like-icon {
    position: relative;
    margin-left: calc(var(--vw)*6);
    width: calc(var(--vw)*16);
    height: calc(var(--vw)*16);
    fill: #fff
}

.film-hero-txt-right-like-icon svg:last-child {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0
}

.film-hero-txt-right-like-cta.fx .film-hero-txt-right-like-icon svg:first-child {
    opacity: 0
}

.film-hero-txt-right-like-cta.fx .film-hero-txt-right-like-icon svg:last-child {
    opacity: 1
}

.film-intro {
    position: relative;
    margin-top: calc(var(--vw)*40);
    padding-bottom: calc(var(--vw)*150);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*8 + var(--gutter)*9)
}

@media (max-width:800px) and (orientation:portrait) {
    .film-intro {
        margin-top: calc(var(--vw)*30);
        padding-bottom: calc(var(--vw)*80);
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

.film-intro-tag_ {
    width: calc(var(--col)*5 + var(--gutter)*5);
    font-size: calc(var(--vw)*10);
    line-height: calc(var(--vw)*24)
}

.film-intro-tag {
    display: flex
}

@media (max-width:800px) and (orientation:portrait) {
    .film-intro-tag_ {
        width: 100%
    }

    .film-intro-tag:first-child {
        display: none
    }

    .film-intro-tag:last-child {
        margin-left: calc(var(--vw)*-10)
    }
}

.film-intro-tag-label {
    margin-top: calc(var(--vw)*10);
    width: calc(var(--vw)*60);
    border: 1px solid transparent;
    white-space: nowrap
}

@media (max-width:800px) and (orientation:portrait) {
    .film-intro-tag-label {
        display: none
    }
}

.film-intro-tag-ul {
    width: calc(100% - var(--vw)*60)
}

.film-intro-tag-li {
    margin-top: calc(var(--vw)*10);
    margin-left: calc(var(--vw)*10);
    padding-left: calc(var(--vw)*12);
    padding-right: calc(var(--vw)*12);
    border-radius: calc(var(--vw)*1);
    box-sizing: border-box;
    border: 1px solid #fff;
    height: -moz-min-content;
    height: min-content
}

.film-intro-tag-li-mobile {
    display: none
}

@media (max-width:800px) and (orientation:portrait) {
    .film-intro-tag-li-mobile {
        display: block
    }
}

.film-intro-txt {
    margin-top: calc(var(--vw)*60);
    display: flex;
    flex-wrap: wrap
}

@media (max-width:800px) and (orientation:portrait) {
    .film-intro-txt {
        display: block;
        margin-top: calc(var(--vw)*40)
    }
}

.film-intro-txt-left_ {
    width: calc(var(--col)*5 + var(--gutter)*5)
}

.film-intro-txt-left:not(:first-child) {
    margin-top: calc(var(--vw)*50)
}

.film-intro-txt-left p {
    margin-top: calc(var(--vw)*24);
    font-size: calc(var(--vw)*14);
    line-height: 170%
}

@media (max-width:800px) and (orientation:portrait) {
    .film-intro-txt-left_ {
        width: calc(var(--col)*5 + var(--gutter)*4)
    }

    .film-intro-txt-left:not(:first-child) {
        margin-top: calc(var(--vw)*40)
    }

    .film-intro-txt-left p {
        margin-top: calc(var(--vw)*20)
    }
}

.film-intro-txt-right {
    margin-left: calc(var(--col)*1 + var(--gutter)*2);
    width: calc(var(--col)*2 + var(--gutter)*2)
}

.film-intro-txt-right-role {
    margin-top: calc(var(--vw)*30);
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*14)
}

.film-intro-txt-right-name {
    margin-top: calc(var(--vw)*10);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

@media (max-width:800px) and (orientation:portrait) {
    .film-intro-txt-right {
        margin-top: calc(var(--vw)*40);
        margin-left: 0;
        width: 100%
    }
}

.film-more {
    position: relative;
    margin-left: calc(var(--marge)*.5);
    margin-right: calc(var(--marge)*.5)
}

@media (max-width:800px) and (orientation:portrait) {
    .film-more {
        margin-left: calc(var(--marge)*.5);
        margin-right: calc(var(--marge)*.5)
    }
}

.film-more h2 {
    font-size: calc(var(--vw)*120);
    line-height: 100%;
    font-weight: 300;
    text-align: center;
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

@media (max-width:800px) and (orientation:portrait) {
    .film-more h2 {
        font-size: calc(var(--vw)*60)
    }
}

.film-more-list {
    display: flex;
    flex-wrap: wrap
}

/* .thumbnail a:hover {
    color: #ffffff;
} */

.film-more-all,
.film-more-list .thumbnail {
    margin-left: calc(var(--marge)*.5);
    margin-right: calc(var(--marge)*.5)
}

.film-more-list .thumbnail {
    margin-top: var(--marge);
    width: calc(var(--col)*3 + var(--gutter)*2)
}

@media (max-width:800px) and (orientation:portrait) {
    .film-more-list .thumbnail {
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

.film-more-all {
    padding-top: calc(var(--vw)*44);
    padding-bottom: calc(var(--vw)*40);
    display: flex;
    justify-content: flex-end
}

@media (max-width:800px) and (orientation:portrait) {
    .film-more-all {
        padding-top: calc(var(--vw)*74);
        padding-bottom: calc(var(--vw)*60)
    }
}

#gallery-hero {
    position: relative;
    height: calc(var(--vw)*540)
}

@media (max-width:800px) and (orientation:portrait) {
    #gallery-hero {
        height: calc(var(--vw)*360)
    }
}

#gallery-hero .t-l {
    padding-top: calc(var(--vw)*180);
    margin-left: var(--marge);
    width: calc(var(--vw)*800)
}

@media (max-width:800px) and (orientation:portrait) {
    #gallery-hero .t-l {
        padding-top: calc(var(--vw)*224);
        margin-right: var(--marge);
        width: auto
    }
}

#gallery-hero-catchphrase {
    position: absolute;
    top: calc(var(--vw)*188);
    left: calc(var(--col)*6 + var(--gutter)*6);
    width: calc(var(--col)*1 + var(--gutter)*1);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

#gallery-hero-catchphrase>div {
    margin-left: auto;
    width: 100%;
    text-align: right
}

@media (max-width:800px) and (orientation:portrait) {
    #gallery-hero-catchphrase {
        top: auto;
        bottom: calc(var(--vw)*101);
        left: auto;
        right: var(--marge);
        width: calc(var(--col)*2 + var(--gutter)*1)
    }
}

#gallery-film,
#gallery-film-list .thumbnail {
    margin-left: calc(var(--marge)*.5);
    margin-right: calc(var(--marge)*.5)
}

#gallery-film {
    padding-top: calc(var(--vw)*0)
}

#gallery-film-list {
    display: flex;
    flex-wrap: wrap
}

#gallery-film-list .thumbnail {
    margin-top: var(--marge);
    width: calc(var(--col)*4 + var(--gutter)*3)
}

@media (max-width:800px) and (orientation:portrait) {
    #gallery-film-list .thumbnail {
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

.home-wrap {
    margin-left: var(--marge);
    margin-right: var(--marge)
}

.home-title {
    font-size: calc(var(--vw)*60);
    line-height: 110%;
    letter-spacing: .007em
}

@media (max-width:800px) and (orientation:portrait) {
    .home-title {
        font-size: calc(var(--vw)*40)
    }
}

#home-hero {
    position: relative;
    padding-top: calc(var(--vr)*20);
    height: 100svh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden
}

#home-hero-date {
    font-size: calc(var(--vr)*20);
    line-height: 100%
}

#home-hero-date .y,
#home-hero-mk2 .y {
    display: flex;
    justify-content: center
}

#home-hero-date-arrow {
    margin-top: calc(var(--vr)*2);
    margin-left: calc(var(--vr)*10);
    margin-right: calc(var(--vr)*10);
    width: calc(var(--vr)*31);
    height: calc(var(--vr)*16);
    fill: #fff
}

#home-hero-title {
    position: relative;
    margin-top: calc(var(--vr)*64);
    width: calc(var(--vr)*640 + 40vw);
    font-size: calc(var(--vr)*108);
    line-height: 90%;
    font-weight: 500;
    text-align: center
}

#home-hero-title>span,
#prompt-start-title>span {
    padding-left: 20vw;
    padding-right: 20vw
}

#home-hero-title>span:not(:first-child) {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%
}

/* #home-hero-title>span:nth-child(1) {
    clip-path: inset(0 80%0 0)
}

#home-hero-title>span:nth-child(2) {
    clip-path: inset(0 60%0 20%)
}

#home-hero-title>span:nth-child(3) {
    clip-path: inset(0 40%0 40%)
}

#home-hero-title>span:nth-child(4) {
    clip-path: inset(0 20%0 60%)
}

#home-hero-title>span:nth-child(5) {
    clip-path: inset(0 0 0 80%)
} */

#home-hero-title>span>span,
#home-intro-theme>div>div,
#home-prompt-title>span>span,
#prompt-start-title>span>span {
    opacity: 0
}

@media (max-width: 800px) and (orientation: portrait) {
    #home-hero-title {
        margin-top: calc(var(--vr) * 40);
        font-size: calc(var(--vr) * 55);
        width: calc(var(--vr) * 360 + 40vw);
        line-height: 40px;
    }

}

#home-hero-mk2 {
    margin-top: calc(var(--vr)*50)
}

#home-hero-mk2-txt {
    margin-right: calc(var(--vr)*6);
    font-size: calc(var(--vr)*20);
    line-height: calc(var(--vr)*28.5)
}

#home-hero-mk2-logo {
    width: calc(var(--vr)*49);
    height: calc(var(--vr)*25);
    fill: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    #home-hero-mk2 {
        margin-top: calc(var(--vr)*60)
    }
}

#home-intro {
    overflow: hidden;
    padding-top: calc(var(--vw)*160)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-intro {
        padding-top: calc(var(--vw)*20)
    }
}

#home-intro-p {
    margin-left: calc(var(--col)*1 + var(--gutter)*1 + var(--marge));
    width: calc(var(--col)*9 + var(--gutter)*8);
    font-size: calc(var(--vw)*30);
    line-height: 140%;
    font-weight: 300
}

#home-intro-p>div:last-child {
    margin-top: calc(var(--vw)*30)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-intro-p {
        margin-left: var(--marge);
        margin-right: var(--marge);
        width: auto;
        font-size: calc(var(--vw) * 18);
        margin-top: 0px;
        padding-top: 50px;
        line-height: 32px;
    }
}

#home-intro-theme {
    position: relative;
    margin-left: calc(var(--vw)*-20);
    margin-top: calc(var(--vw)*180);
    font-size: calc(var(--vw)*250);
    line-height: 100%
}

#home-intro-theme>div:not(:first-child),
#home-prompt-title>span:not(:first-child) {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%
}

#home-intro-theme>div:nth-child(1),
#home-prompt-title>span:nth-child(1) {
    clip-path: inset(0 80%0 0)
}

#home-intro-theme>div:nth-child(2),
#home-prompt-title>span:nth-child(2) {
    clip-path: inset(0 60%0 20%)
}

#home-intro-theme>div:nth-child(3),
#home-prompt-title>span:nth-child(3) {
    clip-path: inset(0 40%0 40%)
}

#home-intro-theme>div:nth-child(4),
#home-prompt-title>span:nth-child(4) {
    clip-path: inset(0 20%0 60%)
}

#home-intro-theme>div:nth-child(5),
#home-prompt-title>span:nth-child(5) {
    clip-path: inset(0 0 0 80%)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-intro-theme {
        margin-left: calc(var(--vw)*-5);
        margin-top: calc(var(--vw)*80);
        font-size: calc(var(--vw)*68)
    }
}

#home-intro-description {
    /* margin-top: calc(var(--vw)*180); */
    /* margin-left: calc(var(--col)*6 + var(--gutter)*7); */
    width: calc(var(--col)*4 + var(--gutter)*3)
}

#home-intro-description p {
    font-size: calc(var(--vw)*25);
    line-height: 170%;
    font-weight: 300;
}

#home-intro-description .link {
    margin-left: auto;
    /* margin-top: calc(var(--vw)*30) */
    color: #4b4b4b;
    text-align: center;
}

@media (max-width:800px) and (orientation:portrait) {
    #home-intro-description {
        margin-top: calc(var(--vw)*70);
        margin-left: var(--marge);
        margin-right: var(--marge);
        width: auto
    }

    #home-intro-description p {
        font-size: calc(var(--vw)*18);
        line-height: 160%
    }

    #home-intro-description .link {
        margin-top: calc(var(--vw)*40)
    }
}

#home-film {
    position: relative;
    padding-top: calc(var(--vw)*240);
    padding-bottom: calc(var(--vw)*60)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-film {
        padding-top: calc(var(--vw)*140);
        padding-bottom: calc(var(--vw)*30)
    }
}

#home-film::before {
    content: "";
    z-index: 0;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70%;
    background: linear-gradient(rgba(1, 7, 36, 0), #010724 95%)
}

#home-film .home-title {
    margin-left: var(--marge)
}

#home-film-total {
    position: absolute;
    top: calc(var(--vw)*248);
    left: calc(var(--col)*6 + var(--gutter)*7);
    font-size: calc(var(--vw)*20);
    line-height: 110%;
    width: calc(var(--col)*2 + var(--gutter)*1)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-film-total {
        position: relative;
        margin-top: calc(var(--vw)*16);
        margin-left: var(--marge);
        top: 0;
        left: 0;
        width: auto;
        font-size: calc(var(--vw)*14)
    }
}

/* #home-film .link, */
#home-film .CTA {
    position: absolute;
    top: calc(var(--vw)*280);
    right: var(--marge);
    color: #4b4b4b;
}

@media (max-width:800px) and (orientation:portrait) {

    /* #home-film .link, */
    #home-film .CTA {
        position: relative;
        margin-top: calc(var(--vw)*28);
        margin-left: auto;
        margin-right: var(--marge);
        top: 0;
        left: 0
    }
}

#home-film-list {
    position: relative;
    margin-top: calc(var(--vw)*100);
    margin-left: var(--marge);
    margin-right: var(--marge);
    height: calc(var(--vw)*900)
}

#home-film-list .thumbnail {
    position: absolute
}

#home-film-list .thumbnail:nth-child(1) {
    top: 0;
    left: 0;
    width: calc(var(--col)*6 + var(--gutter)*5)
}

#home-film-list .thumbnail:nth-child(2) {
    top: calc(var(--vw)*230);
    left: calc(var(--col)*7 + var(--gutter)*7);
    width: calc(var(--col)*4 + var(--gutter)*3)
}

#home-film-list .thumbnail:nth-child(3) {
    top: calc(var(--vw)*650);
    left: calc(var(--col)*1 + var(--gutter)*1);
    width: calc(var(--col)*3 + var(--gutter)*2)
}

#home-film-list .thumbnail:nth-child(4) {
    top: calc(var(--vw)*570);
    left: calc(var(--col)*5 + var(--gutter)*5);
    width: calc(var(--col)*5 + var(--gutter)*4)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-film-list {
        margin-top: 0;
        height: auto
    }

    #home-film-list .thumbnail {
        position: relative;
        margin-top: calc(var(--vw)*40)
    }

    #home-film-list .thumbnail:nth-child(1) {
        margin-top: calc(var(--vw)*20);
        top: 0;
        left: 0;
        width: calc(var(--col)*5 + var(--gutter)*4)
    }

    #home-film-list .thumbnail:nth-child(2) {
        margin-left: calc(var(--col)*2 + var(--gutter)*1)
    }

    #home-film-list .thumbnail:nth-child(2),
    #home-film-list .thumbnail:nth-child(3) {
        top: 0;
        left: 0;
        width: calc(var(--col)*3 + var(--gutter)*3)
    }

    #home-film-list .thumbnail:nth-child(4) {
        top: 0;
        left: 0;
        margin-left: calc(var(--col)*1);
        width: calc(var(--col)*4 + var(--gutter)*4)
    }
}

#home-submit {
    position: relative;
    height: calc(var(--vw)*900);
    display: flex;
    align-items: center;
    justify-content: center;
    display: none
}

#home-submit-bg,
#home-submit-bg-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#home-submit-bg-wrap {
    background: #010724
}

#home-submit-bg {
    opacity: .4
}

#home-submit-bg::before {
    z-index: 1;
    top: 0;
    height: 30%;
    background: linear-gradient(#010724, rgba(1, 7, 36, 0))
}

#home-prompt::before,
#home-submit-bg::after,
#home-submit-bg::before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%
}

#home-submit-bg::after {
    z-index: 1;
    bottom: 0;
    height: 30%;
    background: linear-gradient(rgba(1, 7, 36, 0), #010724)
}

#home-submit-txt {
    position: relative;
    text-align: center
}

#home-submit-txt h2 {
    font-size: calc(var(--vw)*120);
    line-height: 100%;
    font-weight: 300
}

@media (max-width:800px) and (orientation:portrait) {
    #home-submit-txt h2 {
        font-size: calc(var(--vw)*56)
    }
}

#home-submit-txt p {
    margin-top: calc(var(--vw)*100);
    font-size: calc(var(--vw)*20);
    line-height: 120%
}

@media (max-width:800px) and (orientation:portrait) {
    #home-submit-txt p {
        margin-top: calc(var(--vw)*50);
        margin-left: var(--marge);
        margin-right: var(--marge);
        width: auto
    }
}

#home-submit-txt-cta {
    padding-top: calc(var(--vw)*90);
    width: 100%;
    display: flex;
    justify-content: center
}

#home-submit-txt-cta .cta {
    width: calc(var(--col)*2 + var(--gutter)*1)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-submit-txt-cta {
        padding-top: calc(var(--vw)*50)
    }

    #home-submit-txt-cta .cta {
        width: calc(var(--col)*3 + var(--gutter)*2)
    }
}

#home-prompt {
    position: relative;
    padding-top: calc(var(--vw)*200);
    overflow: hidden
}

@media (max-width:800px) and (orientation:portrait) {
    #home-prompt {
        padding-top: calc(var(--vw)*20)
    }
}

#home-prompt::before {
    z-index: 0;
    top: 0;
    height: 100%;
    background: linear-gradient(#010724 15%, rgba(1, 7, 36, 0))
}

#home-prompt-txt {
    margin-left: var(--gutter);
    margin-right: var(--gutter);
    position: relative;
    font-size: calc(var(--vw)*24);
    line-height: calc(var(--vw)*38);
    text-align: center
}

#home-prompt-txt>div:last-child {
    margin-top: calc(var(--vw)*20)
}

#home-prompt-title {
    position: relative;
    margin-top: calc(var(--vw)*100);
    margin-bottom: calc(var(--vw) * 100);
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--vw)*640)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-prompt-title {
        width: calc(var(--vw)*360)
    }
}

#home-prompt-txt-cta {
    padding-top: calc(var(--vw)*90);
    width: 100%;
    display: flex;
    justify-content: center
}

#home-prompt-txt-cta .cta {
    width: calc(var(--col)*2 + var(--gutter)*1)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-prompt-txt-cta {
        padding-top: calc(var(--vw)*50)
    }

    #home-prompt-txt-cta .cta {
        width: calc(var(--col)*3 + var(--gutter)*2)
    }
}

#home-calendar {
    position: relative;
    padding-top: calc(var(--vw)*100)
}

#home-calendar .home-title {
    margin-left: var(--marge)
}

#home-calendar-list {
    padding-top: calc(var(--vw)*60);
    width: 100%;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

#home-calendar-list ul {
    display: flex;
    padding-right: var(--marge);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
}

.home-calendar-li {
    position: relative;
    padding: calc(var(--vw)*30);
    width: calc(var(--col)*3.7 + var(--gutter)* -1);
    height: calc(var(--vw)*425);
    margin-left: var(--gutter);
    flex: 0 0 auto;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, .5);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.home-calendar-li:nth-child(1),
.service-slider .owl-item:nth-child(1) {
    /* margin-left: calc(var(--col) + var(--marge)); */
    margin: auto;
}

.home-calendar-li:nth-child(even),
.service-slider .owl-item:nth-child(even) {
    margin-top: calc(var(--vw)*120)
}

@media (max-width:800px) and (orientation:portrait) {
    .home-calendar-li {
        width: calc(var(--col)*5 + var(--gutter)*3)
    }

    .home-calendar-li:nth-child(1) {
        margin-left: var(--marge)
    }
}

.home-calendar-li h3 {
    font-size: calc(var(--vw)*40);
    font-weight: 300;
    line-height: 90%
}

.home-calendar-li p {
    font-size: calc(var(--vw)*25);
    line-height: 110%;
    font-weight: 300;
}

#home-jury {
    padding-top: calc(var(--vw)*140);
    padding-bottom: calc(var(--vw)*140)
}

#home-jury-main {
    position: relative;
    margin-top: calc(var(--vw)*60);
    height: calc(var(--vw)*470)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-jury-main {
        height: auto
    }
}

#home-jury-main-img {
    width: 100%;
    height: 100%;
    background: var(--color-lazy);
    mix-blend-mode: screen
}

@media (max-width:800px) and (orientation:portrait) {
    #home-jury-main-img {
        height: calc(var(--vw)*470)
    }
}

#home-jury-main-txt {
    position: absolute;
    top: calc(var(--vw)*70);
    left: var(--col);
    width: calc(var(--col)*4 + var(--gutter)*4)
}

#home-jury-main-txt-catchphrase {
    font-size: calc(var(--vw)*12);
    line-height: 120%
}

#home-jury-main-txt-name {
    margin-top: calc(var(--vw)*70);
    font-size: calc(var(--vw)*35);
    line-height: 120%
}

#home-jury-main-txt-role {
    margin-top: calc(var(--vw)*4);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

#home-jury-main-txt-p {
    margin-top: calc(var(--vw)*50);
    font-size: calc(var(--vw)*16);
    line-height: 170%
}

@media (max-width:800px) and (orientation:portrait) {
    #home-jury-main-txt {
        position: relative;
        top: auto;
        left: auto;
        width: auto
    }

    #home-jury-main-txt-catchphrase {
        margin-top: calc(var(--vw)*40)
    }

    #home-jury-main-txt-name {
        margin-top: calc(var(--vw)*30);
        line-height: 90%
    }

    #home-jury-main-txt-role {
        margin-top: calc(var(--vw)*8)
    }

    #home-jury-main-txt-p {
        margin-top: calc(var(--vw)*30)
    }
}

#home-jury-other {
    margin-top: 100px;
    display: flex;
    justify-content: space-between
}

.home-jury-other-li {
    width: calc(var(--col)*3 + var(--gutter)*2)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-jury-other {
        margin-top: 0;
        display: flex;
        flex-wrap: wrap
    }

    .home-jury-other-li {
        margin-top: calc(var(--vw)*40);
        width: calc((100% - var(--gutter))*.5)
    }
}

.home-jury-other-img {
    width: 100%;
    aspect-ratio: 212/232;
    background: var(--color-lazy);
    mix-blend-mode: screen
}

.home-jury-other-name {
    margin-top: calc(var(--vw)*16);
    font-size: calc(var(--vw)*20);
    line-height: 120%
}

.home-jury-other-role {
    margin-top: calc(var(--vw)*8);
    font-size: calc(var(--vw)*10);
    line-height: 120%
}

#home-awards {
    position: relative;
    padding-top: calc(var(--vw)*160);
    box-sizing: border-box;
    height: calc(var(--vw)*1170);
    margin-left: var(--marge);
    margin-right: var(--marge);
    overflow: hidden
}

@media (max-width:800px) and (orientation:portrait) {
    #home-awards {
        margin-left: auto;
        margin-right: auto;
        height: auto
    }

    #home-awards .home-title {
        margin-left: var(--marge);
        margin-right: var(--marge);
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

#home-awards-p,
.home-awards-li {
    width: calc(var(--col)*4 + var(--gutter)*3)
}

#home-awards-p {
    margin-top: calc(var(--vw)*50);
    font-size: calc(var(--vw)*14);
    line-height: 170%
}

@media (max-width:800px) and (orientation:portrait) {
    #home-awards-p {
        margin-top: calc(var(--vw)*40);
        margin-left: var(--marge);
        margin-right: var(--marge);
        font-size: calc(var(--vw)*16);
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

.home-awards-li {
    position: absolute;
    height: calc(var(--vw)*480);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

.home-awards-li:nth-child(3) {
    top: calc(var(--vw)*350);
    left: calc(var(--col)*-.5 + var(--gutter)*-.5)
}

.home-awards-li:nth-child(1) {
    top: calc(var(--vw)*780);
    left: calc(var(--col)*2.5 + var(--gutter)*2.5)
}

.home-awards-li:nth-child(2) {
    bottom: calc(var(--vw)*150);
    left: calc(var(--col)*5.5 + var(--gutter)*5.5)
}

.home-awards-li:nth-child(4) {
    top: calc(var(--vw)*160);
    right: calc(var(--col)*-.5 + var(--gutter)*-.5)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-awards-list {
        padding-top: calc(var(--vw)*60);
        width: 100%;
        overflow: hidden
    }

    #home-awards-list ul {
        display: flex;
        padding-right: var(--marge);
        overflow-x: auto;
        -webkit-overflow-scrolling: touch
    }

    #home-awards-list ul::-webkit-scrollbar {
        display: none
    }

    .home-awards-li {
        position: relative;
        width: calc(var(--col)*4 + var(--gutter)*4);
        height: calc(var(--vw)*390);
        margin-left: var(--marge);
        flex: 0 0 auto;
        pointer-events: none
    }

    .home-awards-li:nth-child(1) {
        top: auto;
        left: auto
    }

    .home-awards-li:nth-child(2) {
        bottom: auto;
        left: auto
    }

    .home-awards-li:nth-child(3) {
        top: auto;
        left: auto
    }

    .home-awards-li:nth-child(4) {
        top: auto;
        right: auto
    }
}

.home-awards-li-icon {
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--vw)*214);
    height: calc(var(--vw)*186);
    fill: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    .home-awards-li-icon {
        width: calc(var(--vw)*214*.8);
        height: calc(var(--vw)*186*.8)
    }
}

.home-awards-li h3,
.home-awards-li p {
    margin-top: calc(var(--vw)*20);
    font-size: calc(var(--vw)*20)
}

.home-awards-li p {
    width: calc(var(--col)*2 + var(--gutter)*3);
    font-size: calc(var(--vw)*14);
    line-height: 120%;
    opacity: .7
}

@media (max-width:800px) and (orientation:portrait) {
    .home-awards-li p {
        width: calc(var(--col)*4 + var(--gutter)*2)
    }
}

#home-quote {
    position: relative;
    padding-top: calc(var(--vw)*120);
    margin-bottom: calc(var(--vw)*180);
    margin-left: calc(var(--marge) + var(--col));
    margin-right: calc(var(--marge) + var(--col));
    display: flex
}

@media (max-width:800px) and (orientation:portrait) {
    #home-quote {
        margin-left: var(--marge);
        margin-right: var(--marge);
        margin-bottom: calc(var(--vw)*100);
        flex-direction: column-reverse
    }
}

#home-quote-img {
    width: calc(var(--col)*3 + var(--gutter)*4);
    height: calc(var(--vw)*450);
    background: var(--color-lazy);
    mix-blend-mode: screen
}

@media (max-width:800px) and (orientation:portrait) {
    #home-quote-img {
        width: 100%;
        height: calc(var(--vw)*450);
        background: var(--color-lazy)
    }
}

#home-quote-txt {
    padding-top: calc(var(--vw)*30);
    margin-left: var(--col);
    width: calc(var(--col)*6 + var(--gutter)*6)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-quote-txt {
        padding-bottom: calc(var(--vw)*40);
        padding-top: 0;
        margin-left: 0;
        width: 100%
    }
}

#home-quote-txt-quote {
    font-size: calc(var(--vw)*50);
    line-height: 120%;
    font-weight: 300
}

@media (max-width:800px) and (orientation:portrait) {
    #home-quote-txt-quote {
        font-size: calc(var(--vw)*35)
    }
}

#home-quote-txt-name {
    margin-top: calc(var(--vw)*46);
    font-size: calc(var(--vw)*20);
    line-height: 120%
}

#home-quote-txt-role {
    margin-top: calc(var(--vw)*6);
    font-size: calc(var(--vw)*10);
    line-height: 120%
}

#home-quote-artefact {
    position: absolute;
    bottom: 0;
    right: var(--gutter);
    font-size: calc(var(--vw)*14);
    line-height: 170%;
    width: calc(var(--col)*4 + var(--gutter)*3)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-quote-artefact {
        padding-top: calc(var(--vw)*40);
        position: relative;
        bottom: auto;
        right: auto;
        width: 100%
    }
}

#home-support {
    position: relative;
    margin-left: calc(var(--marge) + var(--col));
    margin-right: calc(var(--marge) + var(--col));
    display: flex
}

@media (max-width:800px) and (orientation:portrait) {
    #home-support {
        margin-left: var(--marge);
        margin-right: var(--marge);
        display: block
    }
}

#home-support-title {
    width: calc(var(--col)*6 + var(--gutter)*6);
    align-items: center;
    display: flex;
}

#home-support-title h2 {
    font-size: calc(var(--vw)*60);
    line-height: 80%;
    width: calc(var(--col)*5 + var(--gutter)*5)
}

#home-support-title h2 .y_ {
    margin-top: calc(var(--vw)*-10)
}

#home-support-title h2 .y_:first-child,
.rules-s3-li h2 .y_:first-child {
    margin-top: 0
}

#home-support-title h2 .y_:last-child,
.rules-s3-li h2 .y_:last-child {
    margin-bottom: calc(var(--vw)*-10)
}

#home-support-title h2 .y_ span,
.rules-s3-li h2 .y_ span {
    padding-bottom: calc(var(--vw)*10)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-support-title {
        width: 100%
    }
}

#home-support-logo {
    width: calc(var(--col)*4 + var(--gutter)*5);
    display: flex;
    justify-content: center;
    gap: 20px;
}

#home-support-logo li {
    width: calc(var(--col)*2 + var(--gutter)*2);
    height: calc(var(--vw)*175);
    border: 1px solid rgba(255, 255, 255, .5);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
}

.home-support-logo-img {
    width: calc(var(--vw)*176)
}

@media (max-width:800px) and (orientation:portrait) {
    #home-support-logo {
        padding-top: calc(var(--vw)*20);
        width: 100%;
        display: block
    }

    #home-support-logo li {
        margin-top: calc(var(--vw)*10);
        width: 100%;
        height: calc(var(--vw)*135)
    }
}

#prompt-cover,
.p {
    top: 0;
    left: 0;
    width: 100%
}

.p {
    position: absolute;
    min-height: 100svh
}

#prompt-cover {
    position: fixed;
    z-index: 2;
    height: 100vh;
    background: #010724;
    will-change: opacity;
    opacity: 0;
    pointer-events: none
}

.prompt-final {
    display: flex;
    margin-bottom: calc(var(--vw)*180)
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-final {
        display: block
    }
}

.prompt-final-left {
    width: calc(var(--col)*7 + var(--gutter)*6)
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-final-left {
        width: 100%
    }
}

.prompt-final-left-txt {
    margin-top: calc(var(--vw)*30);
    padding: calc(var(--vw)*50) calc(var(--vw)*40);
    background: rgba(255, 255, 255, .2);
    border-radius: calc(var(--vw)*5);
    font-size: calc(var(--vw)*40);
    font-weight: 300;
    line-height: calc(var(--vw)*66)
}

.prompt-final-left-txt>span {
    display: inline;
    height: calc(var(--vw)*66);
    line-height: calc(var(--vw)*46);
    padding-left: calc(var(--vw)*10);
    padding-right: calc(var(--vw)*10);
    border-radius: calc(var(--vw)*4);
    background: #d63eda
}

.prompt-final-left-txt>span:last-child {
    white-space: nowrap
}

.prompt-final-left-txt>span.prompt-final-left-txt-first {
    display: inline;
    height: auto;
    line-height: calc(var(--vw)*66);
    padding-left: 0;
    padding-right: 0;
    border-radius: 0;
    font-weight: 400;
    background: 0 0;
    white-space: nowrap
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-final-left-txt {
        margin-top: calc(var(--vw)*24);
        padding: calc(var(--vw)*30) calc(var(--vw)*20);
        font-size: calc(var(--vw)*30)
    }

    .prompt-final-left-txt>span {
        height: calc(var(--vw)*52);
        padding-left: calc(var(--vw)*8);
        padding-right: calc(var(--vw)*8)
    }

    .prompt-final-left-txt,
    .prompt-final-left-txt>span,
    .prompt-final-left-txt>span.prompt-final-left-txt-first {
        line-height: calc(var(--vw)*52)
    }
}

.prompt-final-left-cta_ {
    margin-top: calc(var(--vw)*30);
    display: flex
}

.prompt-final-left-cta {
    width: calc(var(--col)*2 + var(--gutter)*1)
}

#prompt-final-visit,
.prompt-final-left-copied {
    display: flex;
    justify-content: center;
    pointer-events: none
}

.prompt-final-left-copied {
    margin-left: calc(var(--vw)*30);
    width: calc(var(--col)*2 + var(--gutter)*1);
    height: calc(var(--vw)*48);
    background: #fff;
    color: #010724;
    font-size: calc(var(--vw)*12);
    align-items: center;
    opacity: 0
}

.prompt-final-left-copied.fx {
    animation-name: fadeB;
    animation-duration: 0ms;
    animation-timing-function: linear;
    animation-delay: 800ms;
    animation-direction: normal;
    animation-fill-mode: forwards;
    opacity: 1
}

@media (max-width:800px) and (orientation:portrait) {

    .prompt-final-left-copied,
    .prompt-final-left-cta {
        width: calc(50% - var(--vw)*10)
    }

    .prompt-final-left-copied {
        margin-left: calc(var(--vw)*20)
    }
}

.prompt-final-right {
    margin-left: calc(var(--col)*2 + var(--gutter)*2);
    width: calc(var(--col)*3 + var(--gutter)*3)
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-final-right {
        margin-top: calc(var(--vw)*70);
        margin-left: 0;
        width: 100%
    }
}

.prompt-final-right-title {
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*17)
}

.prompt-final-right-list {
    width: calc(var(--col)*2 + var(--gutter)*2)
}

.prompt-final-right-li {
    margin-top: calc(var(--vw)*32)
}

.prompt-final-right-li-title {
    display: flex
}

.prompt-final-right-li-title-txt {
    font-size: calc(var(--vw)*10);
    line-height: calc(var(--vw)*13)
}

.prompt-final-right-li-title-line {
    margin-top: calc(var(--vw)*5);
    margin-left: calc(var(--vw)*10);
    height: 1px;
    flex-grow: 1;
    overflow: hidden
}

.prompt-final-right-li-title-line div {
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .5);
    will-change: transform;
    transform: translate3d(-110%, 0, 0)
}

.prompt-final-right-li-link {
    padding-top: calc(var(--vw)*6)
}

.prompt-final-right-li-link .link {
    margin-top: calc(var(--vw)*10);
    margin-left: calc(var(--vw)*8)
}

#prompt-final-visit {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: var(--marge);
    background: linear-gradient(rgba(1, 7, 36, 0), #010724)
}

#prompt-final-visit .cta {
    position: relative;
    width: calc(var(--col)*2 + var(--gutter));
    border: 1px solid #fff;
    pointer-events: all
}

#prompt-final-visit .cta-txt {
    color: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    #prompt-final-visit .cta {
        width: calc(var(--col)*3 + var(--gutter)*2)
    }
}

.prompt-model {
    position: fixed;
    z-index: 1;
    left: calc(50% - (660*var(--vw))*.5);
    bottom: var(--marge);
    width: calc(var(--vw)*660);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: none
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-model {
        position: relative;
        left: 0;
        bottom: 0;
        width: auto;
        padding-top: calc(var(--vw)*30);
        margin-left: calc(var(--vw)*10);
        margin-right: calc(var(--vw)*10)
    }
}

.prompt-model-label {
    margin-left: calc(var(--vw)*10);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*17);
    opacity: .5
}

.prompt-model-field {
    position: relative;
    margin-top: calc(var(--vw)*6);
    height: calc(var(--vw)*48);
    background: rgba(255, 255, 255, .2);
    border-radius: calc(var(--vw)*8);
    display: flex;
    align-items: center
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-model-field {
        padding-top: calc(var(--vw)*15);
        padding-bottom: calc(var(--vw)*15);
        height: auto;
        min-height: calc(var(--vw)*18)
    }
}

.prompt-model-field-txt {
    margin-left: calc(var(--vw)*10);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*22);
    width: calc(100% - var(--vw)*62)
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-model-field-txt {
        width: calc(100% - var(--vw)*62)
    }
}

.prompt-model-field-txt>span {
    display: inline;
    height: calc(var(--vw)*22);
    line-height: calc(var(--vw)*18);
    padding-left: calc(var(--vw)*3);
    padding-right: calc(var(--vw)*3);
    border-radius: calc(var(--vw)*4);
    background: #d63eda;
    white-space: nowrap
}

.prompt-model-field-copy {
    position: absolute;
    top: calc(50% - (42*var(--vw))*.5);
    right: calc(var(--vw)*3);
    height: calc(var(--vw)*42);
    fill: #fff;
    pointer-events: all;
    cursor: pointer;
    transition: opacity 300ms
}

._d .prompt-a:hover .prompt-a-img,
._d .prompt-model-field-copy:hover .prompt-model-field-copy-icon {
    opacity: .8
}

.prompt-model-field-copy>div,
.submit-s1-form-tag-li-icon>svg {
    pointer-events: none
}

.prompt-model-field-copy-icon {
    width: calc(var(--vw)*42);
    height: 100%
}

.prompt-model-field-copy-copied {
    position: absolute;
    top: calc(var(--vw)*1);
    right: calc(var(--vw)*1);
    width: calc(var(--vw)*158);
    bottom: calc(var(--vw)*1);
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: calc(var(--vw)*6);
    opacity: 0
}

.prompt-model-field-copy-copied.fx {
    animation-name: fadeA;
    animation-duration: 0ms;
    animation-timing-function: linear;
    animation-delay: 800ms;
    animation-direction: normal;
    animation-fill-mode: forwards;
    opacity: 1
}

.prompt-model-field-copy-copied>div {
    font-size: calc(var(--vw)*12);
    color: #010724
}

.prompt-a_ {
    margin-top: calc(var(--vw)*56);
    margin-bottom: calc(var(--vw)*120);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*8 + var(--gutter)*8);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    display: flex;
    flex-wrap: wrap;
    pointer-events: none
}

.prompt-a {
    position: relative;
    margin-top: calc(var(--vw)*24);
    margin-left: calc(var(--gutter)*.5);
    margin-right: calc(var(--gutter)*.5);
    width: calc(var(--col)*4 + var(--gutter)*3);
    aspect-ratio: 448/220;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: calc(var(--vw)*3);
    pointer-events: all
}

._d .prompt-a:hover,
._d .prompt-b-li:hover {
    cursor: pointer
}

.prompt-a-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    transition: opacity 300ms;
    opacity: 0
}

.prompt-a-title {
    position: relative;
    pointer-events: none
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-a_ {
        margin-top: calc(var(--vw)*24);
        display: block;
        width: auto
    }

    .prompt-a {
        margin-top: calc(var(--vw)*10);
        margin-left: 0;
        margin-right: 0;
        width: auto
    }
}

.prompt-b_ {
    margin-top: calc(var(--vw)*32);
    width: 100%;
    margin-bottom: calc(var(--vw)*120);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: none;
    overflow: hidden
}

.prompt-b {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    pointer-events: all
}

.prompt-b::-webkit-scrollbar {
    display: none
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-b_ {
        margin-top: calc(var(--vw)*30)
    }
}

.prompt-b-li {
    position: relative;
    margin-left: var(--gutter);
    flex: 0 0 auto;
    width: calc(var(--col)*3 + var(--gutter)*2);
    aspect-ratio: 330/400;
    display: flex;
    align-items: center;
    border-radius: calc(var(--vw)*3);
    pointer-events: all;
    overflow: hidden
}

.prompt-b-li::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: calc(var(--vw)*3);
    pointer-events: none
}

.prompt-b-li.fx::after {
    border: 2px solid #fff
}

.prompt-b-li:last-child {
    margin-right: var(--gutter)
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-b-li {
        margin-left: calc(var(--vw)*10);
        width: calc(var(--col)*4 + var(--gutter)*4);
        aspect-ratio: 300/354
    }

    .prompt-b-li:first-child {
        margin-left: var(--gutter)
    }
}

.prompt-b-li-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    transition: 300ms opacity;
    opacity: 0
}

._d .prompt-b-li:hover .prompt-b-li-img {
    opacity: .6
}

._d .footer-bottom a:hover,
._d .prompt-b-li.fx:hover .prompt-b-li-img,
._d .rules-s3-li:hover .rules-s3-li-media-play_,
.prompt-b-li.fx .prompt-b-li-img,
.prompt-nav-d-txt.fx {
    opacity: 1
}

.prompt-b-li-title {
    position: relative;
    padding-left: calc(var(--vw)*20);
    pointer-events: none
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-b-li-title {
        padding-left: calc(var(--vw)*20)
    }
}

.prompt-nav-d,
.prompt-range-choice>div {
    display: flex;
    justify-content: space-between;
    pointer-events: none
}

.prompt-nav-d-txt {
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*16);
    opacity: .5
}

.prompt-nav-d-line {
    margin-top: calc(var(--vw)*7);
    width: calc(var(--vw)*110);
    height: 1px;
    background: #fff;
    opacity: .3
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-nav-d {
        display: none
    }
}

.prompt-nav-m_ {
    pointer-events: none;
    display: none
}

.prompt-nav-m {
    position: relative;
    width: 50%;
    display: flex
}

.prompt-nav-m-txt {
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*16)
}

.prompt-nav-m-txt-0 {
    padding-left: var(--marge);
    opacity: 1
}

.prompt-nav-m-txt-1 {
    opacity: .5
}

.prompt-nav-m-line {
    margin-top: calc(var(--vw)*7);
    height: 1px;
    background: #fff;
    opacity: .3
}

.prompt-nav-m-line-0 {
    position: absolute;
    top: 0;
    left: 0;
    width: calc(var(--marge) - var(--vw)*6)
}

.prompt-nav-m-line-1,
.prompt-nav-m-line-2 {
    margin-left: calc(var(--vw)*6);
    margin-right: calc(var(--vw)*6);
    flex-grow: 1
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-nav-m_ {
        display: flex;
        padding-top: calc(var(--vw)*30)
    }
}

#prompt-progress,
.prompt-pn_ {
    position: fixed;
    bottom: 0;
    left: 0;
    pointer-events: none
}

.prompt-pn,
.prompt-pn_ {
    display: flex;
    justify-content: space-between
}

.prompt-pn_ {
    right: 0;
    padding: var(--marge);
    background: linear-gradient(rgba(1, 7, 36, 0), #010724)
}

.prompt-pn {
    width: 100%
}

.prompt-pn .cta {
    width: calc(var(--col)*2);
    pointer-events: all
}

.prompt-pn-prev {
    border: 1px solid #fff
}

.prompt-pn-prev .cta-txt {
    color: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-pn .cta {
        width: calc(50% - var(--marge)*.5)
    }
}

#prompt-progress {
    z-index: 3;
    width: 100%;
    height: 4px
}

#prompt-progress div {
    width: 100%;
    height: 100%;
    background: #d63eda;
    will-change: transform;
    transform: translate3d(-110%, 0, 0)
}

@media (max-width:800px) and (orientation:portrait) {
    #prompt-progress {
        height: 3px
    }
}

.prompt-question {
    margin-top: calc(var(--vw)*40)
}

.prompt-question-l {
    font-size: calc(var(--vw)*40);
    line-height: calc(var(--vw)*46)
}

.prompt-question-s {
    margin-top: calc(var(--vw)*12);
    font-size: calc(var(--vw)*16);
    line-height: calc(var(--vw)*20)
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-question {
        margin-top: calc(var(--vw)*30)
    }

    .prompt-question-l {
        font-size: calc(var(--vw)*28);
        line-height: calc(var(--vw)*34)
    }

    .prompt-question-s {
        margin-top: calc(var(--vw)*16);
        font-size: calc(var(--vw)*14);
        line-height: calc(var(--vw)*17)
    }
}

.prompt-range {
    margin: calc(var(--vw)*90) auto calc(var(--vw)*180);
    width: calc(var(--col)*4 + var(--gutter)*3)
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-range {
        width: calc(var(--col)*3 + var(--gutter)*4)
    }
}

.prompt-range-choice_ {
    position: relative;
    height: calc(var(--vw)*252);
    width: 100%
}

.prompt-range-choice {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    justify-content: center;
    display: none
}

.prompt-range-choice.fx {
    display: flex
}

.prompt-range-choice>div {
    height: 100%;
    border: 1px solid #fff;
    border-radius: calc(var(--vw)*1);
    align-items: center;
    justify-content: center
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-range-choice_ {
        height: calc(var(--vw)*130)
    }
}

.prompt-range-input_ {
    position: relative;
    margin-top: calc(var(--vw)*30);
    width: 100%;
    height: 3px
}

.prompt-range-input_::after {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    width: 100%;
    height: 3px;
    background: rgba(255, 255, 255, .5);
    border-radius: 3px
}

.prompt-range-input {
    width: 100%;
    height: 21px;
    cursor: pointer;
    box-shadow: 0 0 0#000, 0 0 0#000;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.prompt-range-input:focus {
    outline: 0
}

.prompt-range-input::-moz-range-thumb {
    box-shadow: 0 0 0#000, 0 0 0#000;
    border: 0;
    width: 21px;
    height: 21px;
    border-radius: 100%;
    background: #fff;
    cursor: pointer
}

.prompt-range-input::-webkit-slider-thumb {
    box-shadow: 0 0 0#000, 0 0 0#000;
    border: 0;
    width: 21px;
    height: 21px;
    border-radius: 100%;
    background: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none
}

.prompt-section {
    padding-top: calc(var(--vw)*100);
    display: none
}

@media (max-width:800px) and (orientation:portrait) {
    .prompt-section {
        padding-top: calc(var(--vw)*100)
    }
}

.prompt-title {
    font-size: calc(var(--vw)*60);
    line-height: 90%;
    font-weight: 300
}

.prompt-wrap {
    margin-left: var(--marge);
    margin-right: var(--marge)
}

#prompt-start {
    position: relative;
    height: 100svh;
    align-items: center;
    justify-content: center;
    display: flex
}

#prompt-start-title {
    position: relative;
    text-align: center;
    width: calc(var(--vr)*640 + 40vw)
}

#prompt-start-title>span:not(:first-child) {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%
}

#prompt-start-title>span:nth-child(1) {
    clip-path: inset(0 80%0 0)
}

#prompt-start-title>span:nth-child(2) {
    clip-path: inset(0 60%0 20%)
}

#prompt-start-title>span:nth-child(3) {
    clip-path: inset(0 40%0 40%)
}

#prompt-start-title>span:nth-child(4) {
    clip-path: inset(0 20%0 60%)
}

#prompt-start-title>span:nth-child(5) {
    clip-path: inset(0 0 0 80%)
}

@media (max-width:800px) and (orientation:portrait) {
    #prompt-start-title {
        width: calc(var(--vr)*360 + 40vw)
    }
}

#prompt-start-p {
    margin-left: auto;
    margin-right: auto;
    padding-top: calc(var(--vw)*120);
    text-align: center;
    max-width: calc(var(--col)*6 + var(--gutter)*5);
    font-size: calc(var(--vw)*30);
    line-height: calc(var(--vw)*35)
}

@media (max-width:800px) and (orientation:portrait) {
    #prompt-start-p {
        padding-top: calc(var(--vw)*50);
        width: calc(var(--col)*3 + var(--gutter)*4);
        font-size: calc(var(--vw)*16);
        line-height: calc(var(--vw)*19)
    }
}

#prompt-start-cta_ {
    padding-top: calc(var(--vw)*50);
    width: 100%;
    display: flex;
    justify-content: center
}

#prompt-start-cta {
    width: calc(var(--col)*2 + var(--gutter)*1)
}

#rules-hero {
    position: relative
}

#rules-hero .t-l {
    padding-top: calc(var(--vw)*180);
    margin-left: var(--marge);
    width: calc(var(--vw)*850)
}

@media (max-width:800px) and (orientation:portrait) {
    #rules-hero .t-l {
        padding-top: calc(var(--vw)*224);
        margin-right: var(--marge);
        width: auto;
        font-size: calc(var(--vw) * 40) !important;
    }
}

#rules-hero p {
    padding-top: calc(var(--vw)*80);
    margin-left: calc(var(--marge) + var(--col) + var(--gutter));
    width: calc(var(--col)*6 + var(--gutter)*5);
    font-size: calc(var(--vw)*20);
    line-height: 140%
}

@media (max-width:800px) and (orientation:portrait) {
    #rules-hero p {
        padding-top: calc(var(--vw)*50);
        margin-left: var(--marge);
        margin-right: var(--marge);
        width: auto;
        font-size: calc(var(--vw)*16)
    }
}

#rules-hero-criteria {
    position: absolute;
    top: calc(var(--vw)*336);
    left: calc(var(--col)*9 + var(--gutter)*9 + var(--marge));
    width: calc(var(--col)*2 + var(--gutter)*1)
}

@media (max-width:800px) and (orientation:portrait) {
    #rules-hero-criteria {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        margin-top: calc(var(--vw)*40);
        margin-left: var(--marge);
        margin-right: var(--marge)
    }
}

#rules-s1 {
    padding-top: calc(var(--vw)*100);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*10 + var(--gutter)*9)
}

@media (max-width:800px) and (orientation:portrait) {
    #rules-s1 {
        padding-top: calc(var(--vw)*50);
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

.rules-s1-divider {
    display: flex
}

.rules-s1-divider-number {
    width: calc(var(--vw)*24);
    font-size: calc(var(--vw)*20);
    line-height: 120%
}

.rules-s1-divider-line {
    margin-top: calc(var(--vw)*11);
    flex-grow: 1;
    height: 1px;
    overflow: hidden
}

.rules-s1-txt {
    padding-top: calc(var(--vw)*40);
    padding-bottom: calc(var(--vw)*60);
    font-size: calc(var(--vw)*50);
    line-height: 120%;
    font-weight: 300
}

@media (max-width:800px) and (orientation:portrait) {
    .rules-s1-txt {
        padding-top: calc(var(--vw)*30);
        padding-bottom: calc(var(--vw)*50);
        font-size: calc(var(--vw)*35)
    }
}

#rules-s2 {
    padding-top: calc(var(--vw)*60);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*10 + var(--gutter)*9)
}

@media (max-width:800px) and (orientation:portrait) {
    #rules-s2 {
        padding-top: calc(var(--vw)*100);
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

#rules-s2-title {
    font-size: calc(var(--vw)*50);
    line-height: 120%;
    font-weight: 300
}

#rules-s2-list,
.rules-s2-li {
    padding-top: calc(var(--vw)*40)
}

.rules-s2-li {
    position: relative;
    display: flex;
    padding-bottom: calc(var(--vw)*40)
}

@media (max-width:800px) and (orientation:portrait) {
    .rules-s2-li {
        display: block
    }
}

.rules-s2-li-line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    overflow: hidden
}

#rules-s2-line>div,
.rules-s1-divider-line>div,
.rules-s2-li-line>div {
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .5);
    transform: translate3d(-110%, 0, 0);
    will-change: transform
}

.rules-s2-li-title {
    width: calc(var(--col)*5 + var(--gutter)*4);
    font-size: calc(var(--vw)*67);
    line-height: 90%;
    font-weight: 300
}

@media (max-width:800px) and (orientation:portrait) {
    .rules-s2-li-title {
        width: 100%;
        font-size: calc(var(--vw)*50);
        line-height: 90%
    }
}

.rules-s2-li-content {
    width: calc(var(--col)*5 + var(--gutter)*5);
    font-size: calc(var(--vw)*14);
    line-height: 170%;
    display: flex
}

.rules-s2-li-content ul:first-child {
    width: calc(var(--col)*2.5 + var(--gutter)*3)
}

.rules-s2-li-content ul:last-child {
    width: calc(var(--col)*2.5 + var(--gutter)*2)
}

.rules-s2-li-content li .y {
    position: relative;
    padding-left: var(--gutter)
}

.rules-s2-li-content li .y::after {
    content: "";
    position: absolute;
    top: calc(var(--vw)*11);
    left: 0;
    width: calc(var(--vw)*3);
    height: calc(var(--vw)*3);
    background: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    .rules-s2-li-content {
        padding-top: calc(var(--vw)*30);
        font-size: calc(var(--vw)*12)
    }

    .rules-s2-li-content ul:first-child,
    .rules-s2-li-content ul:last-child {
        width: 50%
    }

    .rules-s2-li-content li .y {
        padding-left: calc(var(--vw)*12)
    }
}

#rules-s2-line {
    width: 100%;
    height: 1px;
    overflow: hidden
}

#rules-s3 {
    position: relative;
    padding-top: calc(var(--vw)*90);
    padding-bottom: calc(var(--vw)*120);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*10 + var(--gutter)*9)
}

@media (max-width:800px) and (orientation:portrait) {
    #rules-s3 {
        padding-top: calc(var(--vw)*100);
        padding-bottom: calc(var(--vw)*100);
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

#rules-s3-title,
.rules-s3-li {
    width: calc(var(--col)*4 + var(--gutter)*3)
}

#rules-s3-title {
    position: absolute;
    top: calc(var(--vw)*90);
    left: 0;
    font-size: calc(var(--vw)*35);
    line-height: 120%
}

@media (max-width:800px) and (orientation:portrait) {
    #rules-s3-title {
        position: relative;
        top: auto;
        left: auto;
        font-size: calc(var(--vw)*35);
        line-height: 120%;
        width: 100%
    }
}

.rules-s3-li {
    cursor: pointer
}

.rules-s3-li:nth-child(1) {
    margin-left: calc(var(--col)*6 + var(--gutter)*6)
}

.rules-s3-li:nth-child(2) {
    position: absolute;
    top: calc(var(--vw)*220);
    left: 0
}

.rules-s3-li:nth-child(3) {
    margin-top: calc(var(--vw)*100);
    margin-left: calc(var(--col)*5 + var(--gutter)*5)
}

.rules-s3-li:nth-child(4) {
    position: absolute;
    top: calc(var(--vw) * 800);
    left: 0
}

.rules-s3-li:nth-child(5) {
    margin-top: calc(var(--vw)*100);
    margin-left: calc(var(--col)*5 + var(--gutter)*5)
}

@media (max-width:800px) and (orientation:portrait) {
    .rules-s3-li {
        width: 100%
    }

    .rules-s3-li:nth-child(1) {
        margin-left: 0
    }

    .rules-s3-li:nth-child(1),
    .rules-s3-li:nth-child(2),
    .rules-s3-li:nth-child(3),
     .rules-s3-li:nth-child(4)
      {
        margin-top: calc(var(--vw)*40)
    }

    .rules-s3-li:nth-child(3) {
        margin-left: 0
    }

    .rules-s3-li:nth-child(2) {
        position: relative;
        top: auto;
        left: auto
    }
}

.rules-s3-li-media {
    position: relative;
    aspect-ratio: 16/9;
    background: var(--color-lazy);
    pointer-events: none
}

.rules-s3-li-media-img {
    position: relative;
    overflow: hidden;
}

.rules-s3-li-media .rules-s3-li-media-img img {
    transition: transform 1000ms var(--o6), opacity 1000ms var(--io2) 300ms;
}

.rules-s3-li:hover .rules-s3-li-media-img img {
    transform: scale(1.1);
}

.rules-s3-li-media-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    pointer-events: none
}

.rules-s3-li-media-play_ {
    position: absolute;
    top: calc(50% - (72*var(--vw))*.5);
    left: calc(50% - (72*var(--vw))*.5);
    width: calc(var(--vw)*72);
    height: calc(var(--vw)*72);
    fill: #fff;
    will-change: opacity;
    transition: opacity 500ms;
    opacity: .8
}

.rules-s3-li-media-play {
    width: 100%;
    height: 100%;
    fill: #fff
}

.rules-s3-li h2,
.rules-s3-li p {
    margin-top: calc(var(--vw)*28);
    font-size: calc(var(--vw)*30);
    line-height: 100%;
    pointer-events: none
}

.rules-s3-li h2 .y_ {
    margin-top: calc(var(--vw)*-10)
}

@media (max-width:800px) and (orientation:portrait) {
    .rules-s3-li h2 {
        margin-top: calc(var(--vw)*20)
    }
}

.rules-s3-li p {
    margin-top: calc(var(--vw)*20);
    font-size: calc(var(--vw)*14);
    line-height: 170%
}

@media (max-width:800px) and (orientation:portrait) {
    .rules-s3-li p {
        margin-top: calc(var(--vw)*16)
    }
}

#submit-s1,
.submit-hero {
    position: relative
}

.submit-hero .t-l {
    padding-top: calc(var(--vw)*180);
    margin-left: var(--marge);
    width: calc(var(--vw)*660)
}

@media (max-width:800px) and (orientation:portrait) {
    .submit-hero .t-l {
        padding-top: calc(var(--vw)*224);
        width: calc(var(--vw)*220)
    }
}

#submit-s1-hero-kit {
    position: absolute;
    bottom: calc(var(--vw)*12);
    left: calc(var(--col)*8 + var(--gutter)*8 + var(--marge));
    width: calc(var(--col)*2 + var(--gutter)*1)
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s1-hero-kit {
        position: relative;
        bottom: auto;
        left: auto;
        width: auto;
        margin-top: calc(var(--vw)*40);
        margin-left: var(--marge);
        margin-right: var(--marge)
    }
}

#submit-s1-hero-catchphrase {
    position: absolute;
    top: calc(var(--vw)*188);
    left: calc(var(--col)*4 + var(--gutter)*3);
    width: calc(var(--col)*2 + var(--gutter)*3);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

#submit-s1-hero-catchphrase>div {
    margin-left: auto;
    width: calc(var(--col)*1.5 + var(--gutter)*2);
    text-align: right
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s1-hero-catchphrase {
        top: auto;
        bottom: calc(var(--vw)*90);
        left: auto;
        right: var(--marge)
    }

    #submit-s1-hero-catchphrase,
    #submit-s1-hero-catchphrase>div {
        width: calc(var(--col)*2 + var(--gutter)*2)
    }
}

#submit-s1-content {
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*8 + var(--gutter)*7)
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s1-content {
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

#submit-s1-progress {
    margin-top: calc(var(--vw)*100);
    display: flex;
    font-size: calc(var(--vw)*24);
    line-height: 110%
}

#submit-s1-progress-line {
    margin-top: calc(var(--vw)*13);
    margin-left: calc(var(--vw)*10);
    margin-right: calc(var(--vw)*10);
    height: 1px;
    flex-grow: 1;
    overflow: hidden
}

#submit-s1-progress-line>div {
    position: relative;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .5);
    will-change: transform;
    transform: translate3d(-110%, 0, 0)
}

#submit-s1-progress-line>div::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s1-progress-line {
        margin-left: calc(var(--vw)*22);
        margin-right: 0
    }
}

#submit-s1-progress>div:last-child {
    opacity: .5
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s1-progress>div:last-child {
        display: none
    }
}

#submit-s1-form {
    padding-top: calc(var(--vw)*20)
}

.submit-s1-form-field {
    position: relative;
    padding-top: calc(var(--vw)*30)
}

.submit-s1-form-field-input {
    margin-top: calc(var(--vw)*10);
    padding-left: calc(var(--vw)*20);
    padding-right: calc(var(--vw)*20);
    box-sizing: border-box;
    width: 100%;
    height: calc(var(--vw)*48);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*48)
}

.submit-s1-form-field-input::-moz-placeholder {
    color: rgba(255, 255, 255, .5)
}

.submit-s1-form-field-input::placeholder {
    color: rgba(255, 255, 255, .5)
}

.submit-s1-form-field-textarea {
    margin-top: calc(var(--vw)*10);
    padding: calc(var(--vw)*20);
    box-sizing: border-box;
    width: 100%;
    height: calc(var(--vw)*276);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*16);
    resize: none
}

@media (max-width:800px) and (orientation:portrait) {

    .submit-s1-form-field-input,
    .submit-s1-form-field-textarea {
        width: 100%
    }
}

.submit-s1-form-field-label-wrap {
    position: relative;
    display: flex
}

.submit-s1-form-field-label-wrap label {
    margin-top: calc(var(--vw)*4)
}

.submit-s1-form-field-label-attention {
    position: relative;
    font-size: calc(var(--vw)*14);
    height: calc(var(--vw)*22);
    line-height: calc(var(--vw)*22);
    margin-left: calc(var(--vw)*8);
    padding-left: calc(var(--vw)*3);
    padding-right: calc(var(--vw)*3);
    border-radius: calc(var(--vw)*4);
    background: #d63eda
}

@media (max-width:800px) and (orientation:portrait) {
    .submit-s1-form-field-label-attention {
        font-size: calc(var(--vw)*12);
        height: calc(var(--vw)*22);
        line-height: calc(var(--vw)*22)
    }
}

.submit-s1-form-select {
    padding-top: calc(var(--vw)*30);
    width: 100%
}

.submit-s1-form-select-label,
.submit-s2-details-field label,
.submit-s2-team-field label {
    display: table;
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*14);
    cursor: pointer
}

.submit-s1-form-select-option {
    margin-top: calc(var(--vw)*10);
    padding-left: calc(var(--vw)*20);
    padding-right: calc(var(--vw)*20);
    box-sizing: border-box;
    width: 100%;
    height: calc(var(--vw)*48)
}

.submit-s1-title {
    font-size: calc(var(--vw)*30);
    line-height: 100%
}

.submit-s1-title-0 {
    padding-bottom: calc(var(--vw)*10)
}

.submit-s1-title-0,
.submit-s1-title-1 {
    padding-top: calc(var(--vw)*80)
}

.submit-s1-title-2 {
    padding-top: calc(var(--vw)*30)
}

@media (max-width:800px) and (orientation:portrait) {
    .submit-s1-title {
        font-size: calc(var(--vw)*25)
    }
}

.submit-s1-title .y_ {
    margin-top: calc(var(--vw)*-8)
}

.submit-s1-title .y_:first-child {
    margin-top: 0
}

.submit-s1-title .y_:last-child {
    margin-bottom: calc(var(--vw)*-8)
}

.submit-s1-title .y {
    padding-bottom: calc(var(--vw)*8)
}

.submit-s1-form-tag {
    padding-top: calc(var(--vw)*30)
}

.submit-s1-form-tag-label {
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*14)
}

.submit-s1-form-tag-label span {
    display: inline;
    font-weight: 600
}

@media (max-width:800px) and (orientation:portrait) {
    .submit-s1-form-tag-label {
        font-size: calc(var(--vw)*11.5)
    }
}

.submit-s1-form-tag-list {
    display: flex;
    flex-wrap: wrap
}

.submit-s1-form-tag-li {
    position: relative;
    margin-top: calc(var(--vw)*10);
    margin-right: calc(var(--vw)*10);
    padding-left: calc(var(--vw)*12);
    padding-right: calc(var(--vw)*12);
    font-size: calc(var(--vw)*10);
    line-height: calc(var(--vw)*23);
    height: calc(var(--vw)*24);
    border: 1px solid #fff;
    border-radius: calc(var(--vw)*1);
    box-sizing: border-box;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.submit-s1-form-tag-li-icon {
    position: absolute;
    top: calc(var(--vw)*6);
    right: calc(var(--vw)*6);
    width: calc(var(--vw)*10);
    height: calc(var(--vw)*10);
    fill: #fff;
    transform: rotate(45deg);
    display: none
}

.submit-s1-form-tag-li>div {
    pointer-events: none
}

.submit-s1-form-tag-li:last-child {
    padding-right: calc(var(--vw)*22);
    pointer-events: none
}

.submit-s1-form-tag-li-input::-moz-placeholder {
    color: #fff;
    opacity: .5
}

.submit-s1-form-tag-li-input::placeholder {
    color: #fff;
    opacity: .5
}

.submit-s1-form-tag-li-input {
    pointer-events: all;
    text-transform: uppercase;
    width: calc(var(--vw)*80)
}

.submit-s1-form-tag-li:last-child .submit-s1-form-tag-li-icon {
    display: block;
    transform: rotate(0);
    opacity: .5;
    transition: opacity 200ms;
    pointer-events: all;
    cursor: pointer
}

._d .submit-s1-form-tag-li:last-child .submit-s1-form-tag-li-icon:hover {
    opacity: 1
}

.submit-s1-form-tag-li.on {
    padding-right: calc(var(--vw)*28);
    background: #fff
}

.submit-s1-form-tag-li.on>div:first-child {
    color: #010724
}

.submit-s1-form-tag-li.on .submit-s1-form-tag-li-icon {
    fill: #010724;
    display: block
}

.submit-s1-form-upload {
    position: relative;
    margin-top: calc(var(--vw)*30)
}

.submit-s1-form-upload-label {
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*14)
}

.submit-s1-form-upload-area {
    margin-top: calc(var(--vw)*10);
    border: 1px dashed rgba(255, 255, 255, .5);
    display: flex;
    align-items: center;
    justify-content: center
}

.submit-s1-form-upload-area-a,
.submit-s1-form-upload-area-b {
    padding-top: calc(var(--vw)*40);
    padding-bottom: calc(var(--vw)*40)
}

.submit-s1-form-upload-area-a {
    font-size: calc(var(--vw)*14);
    line-height: 140%;
    text-align: center
}

.submit-s1-form-upload-area-a.off {
    display: none
}

._d .footer-social a:hover,
.submit-s1-form-upload-area-a-txt>div {
    opacity: .5
}

.submit-s1-form-upload-area-a-txt>div.error {
    color: var(--color-error);
    opacity: 1
}

.submit-s1-form-upload-area-a .cta {
    margin-top: calc(var(--vw)*26);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--vw)*150);
    height: calc(var(--vw)*35);
    cursor: pointer
}

.submit-s1-form-upload-area-b {
    width: calc(var(--col)*8 + var(--gutter)*5);
    display: none
}

.submit-s1-form-upload-area-b.on {
    display: flex;
    justify-content: space-between
}

.submit-s1-form-upload-area-b>div:first-child {
    display: flex;
    font-size: calc(var(--vw)*20);
    line-height: calc(var(--vw)*35)
}

.submit-s1-form-upload-area-b-check {
    margin-top: calc(var(--vw)*4);
    width: calc(var(--vw)*26);
    height: calc(var(--vw)*26);
    fill: #fff
}

.submit-s1-form-upload-area-b-name {
    margin-left: calc(var(--vw)*10);
    max-width: 70%;
    word-break: break-all
}

.submit-s1-form-upload-area-b-size {
    margin-left: calc(var(--vw)*10);
    opacity: .5
}

.submit-s1-form-upload-area-b>div:last-child .cta {
    width: calc(var(--vw)*100);
    height: calc(var(--vw)*35);
    cursor: pointer;
    border: 1px solid #fff
}

@media (max-width:800px) and (orientation:portrait) {
    .submit-s1-form-upload-area-b {
        width: calc(var(--col)*5 + var(--gutter)*2)
    }

    .submit-s1-form-upload-area-b.on {
        display: block
    }

    .submit-s1-form-upload-area-b>div:first-child {
        display: block;
        font-size: calc(var(--vw)*16);
        line-height: calc(var(--vw)*20);
        text-align: center
    }

    .submit-s1-form-upload-area-b-check {
        display: none
    }

    .submit-s1-form-upload-area-b-name {
        margin-left: 0;
        max-width: 100%
    }

    .submit-s1-form-upload-area-b-size {
        margin-top: calc(var(--vw)*20);
        margin-left: 0
    }

    .submit-s1-form-upload-area-b>div:last-child .cta {
        margin-top: calc(var(--vw)*30);
        margin-left: auto;
        margin-right: auto
    }
}

.submit-s1-form-upload-area-input {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    overflow: hidden;
    visibility: hidden
}

#submit-s1-next {
    padding-top: calc(var(--vw)*80);
    width: 100%;
    display: flex;
    justify-content: center
}

#submit-s1-next .cta {
    width: calc(var(--col)*2 + var(--gutter)*1)
}

#submit-s1-msg {
    padding-top: calc(var(--vw)*10);
    padding-bottom: calc(var(--vw)*100);
    text-align: center;
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*20)
}

#submit-s2 {
    display: none
}

#submit-s2-hero-kit {
    position: absolute;
    bottom: calc(var(--vw)*12);
    left: calc(var(--col)*8 + var(--gutter)*8 + var(--marge));
    width: calc(var(--col)*2 + var(--gutter)*1)
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-hero-kit {
        position: relative;
        bottom: auto;
        left: auto;
        width: auto;
        margin-top: calc(var(--vw)*40);
        margin-left: var(--marge);
        margin-right: var(--marge)
    }
}

#submit-s2-hero-catchphrase {
    position: absolute;
    top: calc(var(--vw)*188);
    left: calc(var(--col)*4 + var(--gutter)*3);
    width: calc(var(--col)*2 + var(--gutter)*3);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

#submit-s2-hero-catchphrase>div {
    margin-left: auto;
    width: calc(var(--col)*1.5 + var(--gutter)*2);
    text-align: right
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-hero-catchphrase {
        top: auto;
        bottom: calc(var(--vw)*90);
        left: auto;
        right: var(--marge)
    }

    #submit-s2-hero-catchphrase,
    #submit-s2-hero-catchphrase>div {
        width: calc(var(--col)*2 + var(--gutter)*2)
    }
}

#submit-s2-content {
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*8 + var(--gutter)*7 + var(--gutter))
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-content {
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

#submit-s2-progress {
    margin-top: calc(var(--vw)*100);
    margin-left: calc(var(--gutter)*.5);
    margin-right: calc(var(--gutter)*.5);
    display: flex;
    font-size: calc(var(--vw)*26);
    line-height: 110%
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-progress {
        margin-left: 0;
        margin-right: 0
    }
}

#submit-s2-progress>div:first-child {
    opacity: .5
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-progress>div:first-child {
        display: none
    }
}

#submit-s2-progress-check {
    margin-left: calc(var(--vw)*8)
}

#submit-s2-progress-check .y {
    width: calc(var(--vw)*26);
    height: calc(var(--vw)*26);
    fill: #fff;
    opacity: .5
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-progress-check {
        display: none
    }
}

#submit-s2-progress-line {
    margin-top: calc(var(--vw)*13);
    margin-left: calc(var(--vw)*10);
    margin-right: calc(var(--vw)*10);
    height: 1px;
    flex-grow: 1;
    overflow: hidden
}

#submit-s2-progress-line>div {
    position: relative;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .5);
    will-change: transform;
    transform: translate3d(-110%, 0, 0)
}

#submit-s2-progress-line>div::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    background: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-progress-line {
        margin-left: 0;
        margin-right: calc(var(--vw)*22)
    }
}

#submit-s2-details {
    padding-top: calc(var(--vw)*60)
}

#submit-s2-details-title {
    margin-left: calc(var(--gutter)*.5);
    font-size: calc(var(--vw)*20);
    line-height: 110%
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-details-title {
        margin-left: 0
    }
}

#submit-s2-details-field_ {
    display: flex;
    flex-wrap: wrap
}

.submit-s2-details-field {
    margin-top: calc(var(--vw)*20);
    margin-left: calc(var(--gutter)*.5);
    margin-right: calc(var(--gutter)*.5)
}

.submit-s2-details-field-input {
    margin-top: calc(var(--vw)*10);
    padding-left: calc(var(--vw)*20);
    padding-right: calc(var(--vw)*20);
    box-sizing: border-box;
    width: calc(var(--col)*8/3 + var(--gutter)*7/3 - var(--gutter)*2/3);
    height: calc(var(--vw)*48);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*48)
}

.submit-s2-details-field-input::-moz-placeholder {
    color: rgba(255, 255, 255, .5)
}

.submit-s2-details-field-input::placeholder {
    color: rgba(255, 255, 255, .5)
}

.submit-s2-details-field-textarea {
    margin-top: calc(var(--vw)*10);
    padding: calc(var(--vw)*20);
    box-sizing: border-box;
    width: calc(var(--col)*8 + var(--gutter)*7);
    height: calc(var(--vw)*176);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*16);
    resize: none
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-details-field_ {
        display: block
    }

    .submit-s2-details-field {
        margin-left: 0;
        margin-right: 0
    }

    .submit-s2-details-field-input,
    .submit-s2-details-field-textarea {
        width: 100%
    }
}

#submit-s2-team {
    padding-top: calc(var(--vw)*60)
}

#submit-s2-team-title {
    margin-left: calc(var(--gutter)*.5);
    font-size: calc(var(--vw)*20);
    line-height: 110%
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-team-title {
        margin-left: 0
    }
}

.submit-s2-team-field_ {
    display: flex;
    flex-wrap: wrap
}

.submit-s2-team-field {
    margin-top: calc(var(--vw)*20);
    margin-left: calc(var(--gutter)*.5);
    margin-right: calc(var(--gutter)*.5)
}

.submit-s2-team-field-input {
    margin-top: calc(var(--vw)*10);
    padding-left: calc(var(--vw)*20);
    padding-right: calc(var(--vw)*20);
    box-sizing: border-box;
    width: calc(var(--col)*8/3 + var(--gutter)*7/3 - var(--gutter)*2/3);
    height: calc(var(--vw)*48);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*48);
    border: 1px solid #fff
}

.footer-top-r-b-newsletter-field input::-moz-placeholder,
.submit-s2-team-field-input::-moz-placeholder {
    color: rgba(255, 255, 255, .5)
}

.footer-top-r-b-newsletter-field input::placeholder,
.submit-s2-team-field-input::placeholder {
    color: rgba(255, 255, 255, .5)
}

@media (max-width:800px) and (orientation:portrait) {
    .submit-s2-team-field_ {
        display: block
    }

    .submit-s2-team-field {
        margin-left: 0;
        margin-right: 0
    }

    .submit-s2-team-field-input {
        width: 100%
    }
}

.submit-s2-team-select {
    margin-top: calc(var(--vw)*20);
    margin-left: calc(var(--gutter)*.5);
    margin-right: calc(var(--gutter)*.5)
}

.submit-s2-team-select-label {
    display: table;
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*14);
    cursor: pointer
}

.submit-s2-team-select-option {
    margin-top: calc(var(--vw)*10);
    padding-left: calc(var(--vw)*20);
    padding-right: calc(var(--vw)*20);
    box-sizing: border-box;
    width: calc(var(--col)*8/3 + var(--gutter)*7/3 - var(--gutter)*2/3);
    height: calc(var(--vw)*48);
    border: 1px solid #fff
}

@media (max-width:800px) and (orientation:portrait) {
    .submit-s2-team-select {
        margin-left: 0;
        margin-right: 0
    }

    .submit-s2-team-select-option {
        width: 100%
    }
}

#submit-s2-team-add {
    margin-top: calc(var(--vw)*36);
    display: flex;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    cursor: pointer
}

#submit-s2-team-add>div,
.footer-top-r-b-newsletter-submit>span,
.footer-top-r-link a.on {
    pointer-events: none
}

.submit-s2-team-add-line {
    margin-top: calc(var(--vw)*10);
    width: calc(var(--vw)*380);
    height: 1px;
    background: rgba(255, 255, 255, .5)
}

#submit-s2-team-add-txt {
    flex-grow: 1;
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*20)
}

#submit-s2-cta,
#submit-s2-team-add-txt>div {
    display: flex;
    justify-content: center
}

.submit-s2-team-add-txt-icon {
    margin-top: calc(var(--vw)*4);
    margin-left: calc(var(--vw)*16);
    width: calc(var(--vw)*12);
    height: calc(var(--vw)*12);
    fill: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    .submit-s2-team-add-line {
        width: calc(var(--vw)*100)
    }
}

#submit-s2-cta {
    padding-top: calc(var(--vw)*80);
    width: 100%
}

#submit-s2-cta .cta {
    width: calc(var(--col)*2 + var(--gutter)*1)
}

#submit-s2-cta-return {
    border: 1px solid #fff
}

#submit-s2-cta-submit {
    margin-left: var(--gutter)
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-cta {
        padding-top: calc(var(--vw)*50)
    }

    #submit-s2-cta .cta {
        width: calc(50% - var(--gutter)*.5)
    }
}

#submit-s2-msg {
    padding-top: calc(var(--vw)*10);
    padding-bottom: calc(var(--vw)*180);
    text-align: center;
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*20)
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s2-msg {
        padding-bottom: calc(var(--vw)*100)
    }
}

#submit-s3 {
    display: none
}

#submit-s3-hero {
    padding-top: calc(var(--vw)*180);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*8 + var(--gutter)*7);
    text-align: center
}

#submit-s3-hero-headline {
    font-size: calc(var(--vw)*20);
    line-height: 120%;
    opacity: .7
}

#submit-s3-hero-title {
    padding-top: calc(var(--vw)*40);
    font-size: calc(var(--vw)*90);
    line-height: 90%;
    font-weight: 300
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s3-hero {
        width: calc(var(--col)*5 + var(--gutter)*4)
    }

    #submit-s3-hero-headline {
        margin-left: auto;
        margin-right: auto;
        font-size: calc(var(--vw)*18);
        line-height: 110%;
        width: calc(var(--vw)*250)
    }

    #submit-s3-hero-title {
        padding-top: calc(var(--vw)*30);
        font-size: calc(var(--vw)*35);
        line-height: 100%
    }
}

#submit-s3-recap {
    padding-top: calc(var(--vw)*90);
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*8 + var(--gutter)*7);
    display: flex;
    flex-wrap: wrap
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s3-recap {
        padding-top: calc(var(--vw)*60);
        flex-direction: column-reverse;
        width: calc(var(--col)*5 + var(--gutter)*4)
    }
}

#submit-s3-recap-img {
    width: calc(var(--col)*3 + var(--gutter)*3);
    background: var(--color-lazy)
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s3-recap-img {
        width: 100%;
        aspect-ratio: 16/9
    }
}

#submit-s3-recap-txt {
    padding: calc(var(--vw)*70) calc(var(--vw)*60) calc(var(--vw)*90);
    width: calc(var(--col)*5 + var(--gutter)*4);
    background: linear-gradient(40deg, rgba(20, 58, 255, .4) 40%, rgba(255, 20, 133, .4));
    box-sizing: border-box
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s3-recap-txt {
        padding: calc(var(--vw)*40) calc(var(--vw)*40) calc(var(--vw)*50)
    }
}

#submit-s3-recap-txt-title {
    font-size: calc(var(--vw)*35);
    line-height: 110%
}

@media (max-width:800px) and (orientation:portrait) {
    #submit-s3-recap-txt-title {
        font-size: calc(var(--vw)*24)
    }
}

#submit-s3-recap-txt-author {
    margin-top: calc(var(--vw)*4);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

#submit-s3-recap-txt-list {
    padding-top: calc(var(--vw)*40);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

.submit-s3-recap-txt-li {
    position: relative;
    padding-left: calc(var(--vw)*42)
}

.submit-s3-recap-txt-li:not(:first-child) {
    opacity: .5
}

.submit-s3-recap-txt-li:not(:last-child) {
    padding-bottom: calc(var(--vw)*20)
}

.submit-s3-recap-txt-li-p {
    margin-top: calc(var(--vw)*6)
}

.submit-s3-recap-txt-li-circle {
    position: absolute;
    top: calc(var(--vw)*2);
    left: 0;
    width: calc(var(--vw)*12);
    height: calc(var(--vw)*12);
    box-sizing: border-box;
    border: 1px solid #fff;
    border-radius: 100%
}

.submit-s3-recap-txt-li:first-child .submit-s3-recap-txt-li-circle::after {
    content: "";
    position: absolute;
    top: calc(var(--vw)*2);
    left: calc(var(--vw)*2);
    width: calc(var(--vw)*6);
    height: calc(var(--vw)*6);
    background: #fff;
    border-radius: 100%
}

.submit-s3-recap-txt-li-line {
    position: absolute;
    top: calc(var(--vw)*14);
    left: calc(var(--vw)*6 - .5px);
    width: 1px;
    bottom: 0;
    border-left: 1px dashed #fff
}

#submit-s3-gallery {
    padding-top: calc(var(--vw)*40);
    display: flex;
    justify-content: center
}

#submit-s3 .faq {
    padding-top: calc(var(--vw)*90)
}

#submit-cover {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #010724;
    will-change: opacity;
    opacity: 0;
    pointer-events: none
}

.condition {
    padding-top: calc(var(--vw)*40);
    margin-left: calc(var(--gutter)*.5);
    margin-right: calc(var(--gutter)*.5)
}

.condition>div {
    padding-top: calc(var(--vw)*20);
    display: flex
}

.condition-option-square {
    margin-right: calc(var(--vw)*20);
    height: calc(var(--vw)*30);
    pointer-events: all;
    cursor: pointer
}

.condition-option-square .y {
    position: relative;
    padding-top: calc(var(--vw)*6);
    padding-bottom: calc(var(--vw)*6);
    width: calc(var(--vw)*18);
    height: calc(var(--vw)*18);
    pointer-events: none
}

.condition-option-square .y div {
    position: relative;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border: 1px solid #fff;
    background: rgba(255, 255, 255, .2)
}

.condition-option-square.on .y div {
    background: #fff
}

.condition-option-txt {
    margin-top: calc(var(--vw)*7);
    width: calc(100% - var(--vw)*18 - var(--vw)*20);
    font-size: calc(var(--vw)*14);
    line-height: 120%
}

@media (max-width:800px) and (orientation:portrait) {
    .condition {
        padding-top: calc(var(--vw)*20);
        margin-left: 0;
        margin-right: 0
    }
}

.faq {
    margin-left: var(--marge);
    margin-right: var(--marge);
    display: flex;
    flex-wrap: wrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

@media (max-width:800px) and (orientation:portrait) {
    .faq {
        display: block
    }
}

.faq-main {
    width: calc(var(--col)*4 + var(--gutter)*3);
    border: 1px solid rgba(255, 255, 255, .5);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center
}

.faq-main>div {
    width: calc(var(--col)*2 + var(--gutter)*1)
}

@media (max-width:800px) and (orientation:portrait) {
    .faq-main {
        padding: calc(var(--vw)*40);
        width: 100%;
        border-bottom: none
    }

    .faq-main>div {
        width: auto
    }
}

.faq-main h2 {
    font-size: calc(var(--vw)*90);
    line-height: 100%;
    font-weight: 300
}

@media (max-width:800px) and (orientation:portrait) {
    .faq-main h2 {
        font-size: calc(var(--vw)*40)
    }
}

.faq-main p,
.faq-main-caption {
    margin-top: calc(var(--vw)*30);
    font-size: calc(var(--vw)*14);
    line-height: 170%
}

.faq-main-caption {
    margin-top: calc(var(--vw)*40);
    line-height: 110%;
    text-align: center
}

.faq-main a {
    margin-top: calc(var(--vw)*16)
}

.faq-li,
.faq-list {
    box-sizing: border-box
}

.faq-list {
    width: calc(var(--col)*8 + var(--gutter)*8);
    border-top: 1px solid rgba(255, 255, 255, .5);
    border-right: 1px solid rgba(255, 255, 255, .5)
}

.faq-li {
    border-bottom: 1px solid rgba(255, 255, 255, .5);
    cursor: pointer
}

@media (max-width:800px) and (orientation:portrait) {
    .faq-list {
        width: 100%;
        border-left: 1px solid rgba(255, 255, 255, .5)
    }
}

.faq-li-top {
    position: relative;
    height: calc(var(--vw)*84);
    display: flex;
    align-items: center;
    pointer-events: none
}

.faq-li-top h3 {
    padding-left: var(--marge);
    box-sizing: border-box;
    width: calc(var(--col)*7 + var(--gutter)*7);
    font-size: calc(var(--vw)*20);
    line-height: 110%
}

.faq-li-top-arrow {
    position: absolute;
    top: calc(50% - var(--vw)*15*.5);
    right: var(--marge);
    width: calc(var(--vw)*14);
    height: calc(var(--vw)*15);
    fill: #fff;
    will-change: transform;
    transition: transform 600ms var(--o6)
}

.faq-li.fx .faq-li-top-arrow {
    transform: rotate(180deg)
}

@media (max-width:800px) and (orientation:portrait) {
    .faq-li-top h3 {
        width: calc(var(--col)*4 + var(--gutter)*4);
        font-size: calc(var(--vw)*18)
    }
}

.faq-li-bottom {
    padding-left: var(--marge);
    box-sizing: border-box;
    width: calc(var(--col)*7 + var(--gutter)*7);
    pointer-events: none;
    overflow: hidden;
    height: 0
}

.faq-li.fx .faq-li-bottom {
    height: auto
}

.faq-li-bottom p {
    padding-bottom: calc(var(--vw)*32);
    font-size: calc(var(--vw)*16);
    line-height: 140%;
    opacity: 0;
    will-change: opacity
}

.faq-li.fx .faq-li-bottom p {
    transition: opacity 2000ms var(--o6);
    opacity: .7
}

@media (max-width:800px) and (orientation:portrait) {
    .faq-li-bottom {
        width: calc(var(--col)*4 + var(--gutter)*4)
    }
}

.footer {
    position: relative;
    padding-top: calc(var(--vw)*136);
    padding-left: var(--marge);
    padding-right: var(--marge)
}

@media (max-width:800px) and (orientation:portrait) {
    .footer {
        padding-top: calc(var(--vw)*50)
    }
}

.footer-top {
    display: flex;
    padding-bottom: calc(var(--vw)*42);
    font-size: calc(var(--vw)*12);
    line-height: 120%;
    letter-spacing: .01em;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-top {
        display: block;
        padding-bottom: 0
    }
}

.footer-top-l {
    width: calc(var(--col)*6 + var(--gutter)*6)
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-top-l {
        width: 100%
    }
}

.footer-top-l-logo,
.footer-top-r-link a {
    position: relative;
    pointer-events: all;
    display: flex
}

.footer-top-l-logo {
    margin-left: calc(var(--vw)*-1);
    width: calc(var(--col)*1.5 + var(--gutter) + var(--vw)*2);
    /* aspect-ratio: 120/120; */
    fill: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-top-l-logo {
        margin-top: var(--top);
        margin-left: auto;
        margin-right: auto;
        width: calc(var(--col)*3 + var(--gutter)*2 + var(--vw)*2)
    }
}

.footer-top-r {
    width: calc(var(--col)*6 + var(--gutter)*5)
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-top-r {
        width: 100%
    }
}

.footer-top-r-link {
    position: relative;
    margin-left: calc(var(--vw)*-5);
    z-index: 0;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    letter-spacing: 1.9px;
    line-height: 20px;
}

.footer-top-r-link a {
    align-self: flex-start;
    margin-right: calc(var(--vw)*10);
    transition: opacity 600ms;
    /* height: calc(var(--vw) * 40); */
    align-items: center;
    overflow: hidden;
    margin-bottom: 20px;
}

.footer-top-r-link-txt {
    padding-left: calc(var(--vw)*5);
    padding-right: calc(var(--vw)*5);
    mix-blend-mode: difference
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-top-r-link {
        margin-top: calc(var(--vw)*42);
        margin-left: auto;
        margin-right: auto;
        /* width: calc(var(--col)*3 + var(--gutter)*4); */
        flex-wrap: wrap;
        justify-content: center;
    }
}

.footer-top-r-b {
    display: flex;
    margin-top: calc(var(--vw)*34)
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-top-r-b {
        display: block;
        margin-top: calc(var(--vw)*48)
    }
}

.footer-top-r-b-newsletter {
    position: relative;
    width: calc(var(--col)*4 + var(--gutter)*3)
}

.footer-top-r-b-newsletter label {
    display: table
}

.footer-top-r-b-newsletter-field {
    margin-top: calc(var(--vw)*5);
    height: calc(var(--vw)*48);
    display: flex
}

.footer-top-r-b-newsletter-field input {
    padding-left: calc(var(--vw)*20);
    width: calc(var(--col)*3 + var(--gutter)*2);
    border: 1px solid #fff;
    box-sizing: border-box
}

.footer-top-r-b-newsletter-submit {
    position: relative;
    z-index: 0;
    width: calc(var(--col)*1 + var(--gutter)*1);
    overflow: hidden
}

.footer-top-r-b-newsletter-submit>span:nth-child(1) {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transition: opacity 300ms
}

.footer-top-r-b-newsletter-submit>span:last-child {
    position: relative;
    width: 100%;
    color: #010724
}

.footer-top-r-b-newsletter-submit>span>span:nth-child(1) {
    opacity: 0
}

.footer-top-r-b-newsletter-submit>span>span:nth-child(2) {
    position: absolute;
    top: 0;
    left: 0
}

.footer-top-r-b-newsletter-msg {
    position: absolute;
    bottom: calc(var(--vw)*-20);
    left: 0;
    font-size: calc(var(--vw)*12);
    line-height: calc(var(--vw)*20)
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-top-r-b-newsletter {
        width: 100%
    }

    .footer-top-r-b-newsletter label {
        display: block;
        text-align: center
    }

    .footer-top-r-b-newsletter-field input {
        width: calc(var(--col)*3 + var(--gutter)*3)
    }

    .footer-top-r-b-newsletter-submit {
        width: calc(var(--col)*2 + var(--gutter)*1)
    }
}

.footer-top-r-b-download {
    margin-left: var(--gutter);
    width: calc(var(--col)*2 + var(--gutter)*1)
}

.footer-top-r-b-download .cta {
    margin-top: calc(var(--vw)*5)
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-top-r-b-download {
        margin-top: calc(var(--vw)*20);
        margin-left: 0;
        width: 100%
    }

    .footer-top-r-b-download>div {
        text-align: center
    }
}

.footer-bottom {
    margin-top: calc(var(--vw)*42);
    padding-top: calc(var(--vw)*15);
    padding-bottom: calc(var(--vw)*13);
    font-size: calc(var(--vw)*10);
    line-height: 120%;
    display: flex;
    border-top: 1px solid rgba(255, 255, 255, .2)
}

.footer-bottom>div {
    margin-left: calc(var(--col)*3 + var(--gutter)*3);
    display: flex;
    justify-content: space-between;
    width: calc(var(--col)*9 + var(--gutter)*8)
}

.footer-bottom a {
    padding-top: calc(var(--vw)*5);
    padding-bottom: calc(var(--vw)*5);
    opacity: .7;
    transition: opacity 200ms
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-bottom {
        margin-top: calc(var(--vw)*30);
        padding-top: calc(var(--vw)*20);
        padding-bottom: calc(var(--vw)*24)
    }

    .footer-bottom a {
        padding-top: calc(var(--vw)*4);
        padding-bottom: calc(var(--vw)*4)
    }

    .footer-bottom>div {
        margin-left: 0;
        display: block;
        width: 100%
    }
}

.footer-bottom-0,
.footer-bottom-1 {
    display: flex;
    justify-content: center
}

.footer-bottom-0 a {
    margin-right: calc(var(--vw)*20)
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-bottom-0 a {
        margin-right: 0;
        padding-left: calc(var(--vw)*10);
        padding-right: calc(var(--vw)*10)
    }
}

.footer-bottom-1 {
    flex-wrap: wrap
}

.footer-bottom-1 a {
    margin-left: calc(var(--vw)*14)
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-bottom-1 {
        margin-top: calc(var(--vw)*14)
    }

    .footer-bottom-1 a {
        margin-left: 0;
        padding-left: calc(var(--vw)*10);
        padding-right: calc(var(--vw)*10)
    }
}

.footer-social {
    position: absolute;
    left: var(--marge);
    bottom: calc(var(--vw)*13);
    display: flex
}

.footer-social a {
    margin-right: calc(var(--vw)*14);
    width: calc(var(--vw)*24);
    height: calc(var(--vw)*24)
}

.footer-social svg {
    fill: #fff
}

@media (max-width:800px) and (orientation:portrait) {
    .footer-social {
        position: relative;
        margin-top: calc(var(--vw)*22);
        left: auto;
        bottom: auto;
        justify-content: center
    }

    .footer-social a {
        margin-right: 0;
        padding: calc(var(--vw) * 6);
        width: calc(var(--vw) * 40);
        height: calc(var(--vw) * 50);
        margin-bottom: 30px;

    }
}

.form-msg {
    color: var(--color-error)
}

.form-msg.success {
    animation-name: msgFade;
    animation-duration: 1000ms;
    animation-timing-function: linear;
    animation-delay: 3000ms;
    animation-direction: normal;
    animation-fill-mode: forwards;
    color: var(--color-success)
}

.form-border {
    border: 1px solid #fff
}

.form-border.error {
    border: 1px solid var(--color-error)
}

.law-hero .t-l {
    padding-top: calc(var(--vw)*180);
    margin-left: var(--marge);
    width: calc(var(--vw)*750)
}

@media (max-width:800px) and (orientation:portrait) {
    .law-hero .t-l {
        padding-top: calc(var(--vw)*224);
        margin-right: var(--marge);
        width: auto;
        font-size: calc(var(--vw) * 40) !important;
    }
}

.law {
    margin-left: auto;
    margin-right: auto;
    width: calc(var(--col)*8 + var(--gutter)*7);
    padding-bottom: calc(var(--vw) * 86);
}

.law .first {
    margin-top: calc(var(--vw)*90)
}

.law h2 {
    margin-top: calc(var(--vw)*70);
    padding-bottom: calc(var(--vw)*10);
    font-size: calc(var(--vw)*25);
    line-height: 110%
}

.law p,
.thumbnail-txt div {
    font-size: calc(var(--vw)*25);
}

.list_text li {
    margin-bottom: 20px;
    font-size: calc(var(--vw) * 25);
}

.law p {
    margin-top: calc(var(--vw)*20);
    line-height: 170%
}

.law a {
    display: inline;
    opacity: .6;
    transition: opacity 200ms
}

._d .law a:hover,
._d .thumbnail-a:hover .thumbnail-over-center-mask {
    opacity: 1
}

._d .law a,
._d .thumbnail-a .thumbnail-over-center-mask {
    opacity: 1
}

@media (max-width:800px) and (orientation:portrait) {
    .law {
        margin-left: var(--marge);
        margin-right: var(--marge);
        width: auto;
        padding-bottom: calc(var(--vw)*100)
    }

    .law .first {
        margin-top: calc(var(--vw)*70)
    }

    .law h2 {
        margin-top: calc(var(--vw)*50)
    }

    .law p {
        margin-top: calc(var(--vw)*20)
    }
}

.thumbnail {
    aspect-ratio: 16/9;
    container-type: size
}

.thumbnail a {
    position: relative;
    height: 100%
}

@media (max-width:800px) and (orientation:portrait) {
    .thumbnail {
        display: block
    }

    .thumbnail li {
        width: auto
    }
}

.thumbnail-img {
    height: 100%;
    background: var(--color-lazy);
    pointer-events: none;
    overflow: hidden
}

.thumbnail-img img {
    transition: transform 1000ms var(--o6), opacity 1000ms var(--io2) 300ms
}

._d .thumbnail a:hover .thumbnail-img img {
    transform: scale(1.04)
}



.thumbnail-txt {
    position: absolute;
    bottom: calc(var(--marge)*.7);
    left: calc(var(--marge)*.7);
    width: calc(100% - var(--col) - var(--marge)*.7);
    max-width: calc(var(--col)*3 + var(--marge)*3 - var(--marge)*.7)
}

.thumbnail-txt h3 {
    font-size: calc(var(--vw)*20);
    line-height: 110%
}

.thumbnail-txt div {
    margin-top: calc(var(--vw)*3);
    line-height: calc(var(--vw)*16)
}

@media (max-width:800px) and (orientation:portrait) {
    .thumbnail-txt {
        max-width: calc(var(--col)*3.5 + var(--marge)*3 - var(--marge)*.7)
    }
}

.thumbnail-like {
    position: absolute;
    bottom: calc(var(--marge)*.7);
    right: calc(var(--marge)*.7);
    display: flex;
    display: none
}

.thumbnail-like-heart {
    margin-top: calc(var(--vw)*-.5);
    width: calc(var(--vw)*16);
    height: calc(var(--vw)*16);
    fill: #fff
}

.thumbnail-like-total {
    margin-left: calc(var(--vw)*6);
    font-size: calc(var(--vw)*14);
    line-height: calc(var(--vw)*16)
}

.thumbnail-over {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    display: flex;
    align-items: flex-end;
    padding: 0px 20px;
}

.overlay {
    background: #00000087;
    position: absolute;
    content: "";
    inset: 0;
}

.thumbnail-over-center {
    position: relative;
    font-size: 12.8cqw;
    font-weight: 100;
    font-family: "DM Serif Text", serif;

}

.thumbnail-over-center-mask_:not(:first-child) {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%
}

.thumbnail-over-center-mask_:nth-child(1) {
    clip-path: inset(0 80%0 0)
}

.thumbnail-over-center-mask_:nth-child(2) {
    clip-path: inset(0 60%0 20%)
}

.thumbnail-over-center-mask_:nth-child(3) {
    clip-path: inset(0 40%0 40%)
}

.thumbnail-over-center-mask_:nth-child(4) {
    clip-path: inset(0 20%0 60%)
}

.thumbnail-over-center-mask_:nth-child(5) {
    clip-path: inset(0 0 0 80%)
}

.thumbnail-over-center-mask {
    transition: opacity 800ms var(--o2), transform 1200ms var(--o6);
    opacity: 0
}

/* .thumbnail-over-center-mask_:nth-child(1) .thumbnail-over-center-mask {
    transform: translate3d(-20%, 0, 0)
}

.thumbnail-over-center-mask_:nth-child(2) .thumbnail-over-center-mask {
    transform: translate3d(-10%, 0, 0)
}

.thumbnail-over-center-mask_:nth-child(4) .thumbnail-over-center-mask {
    transform: translate3d(10%, 0, 0)
}

.thumbnail-over-center-mask_:nth-child(5) .thumbnail-over-center-mask {
    transform: translate3d(20%, 0, 0)
} */

._d .thumbnail-a:hover .thumbnail-over-center-mask_:nth-child(1) .thumbnail-over-center-mask,
._d .thumbnail-a:hover .thumbnail-over-center-mask_:nth-child(2) .thumbnail-over-center-mask,
._d .thumbnail-a:hover .thumbnail-over-center-mask_:nth-child(4) .thumbnail-over-center-mask,
._d .thumbnail-a:hover .thumbnail-over-center-mask_:nth-child(5) .thumbnail-over-center-mask {
    transform: translate3d(0, 0, 0)
}


#_404 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff
}

#_404 a {
    font-size: 16px;
    color: #000
}

.CTA {
    display: flex;
    justify-content: center;
    padding-top: 50px;
}

.home-support-logo-img P {
    TEXT-ALIGN: center;
    padding: 25px;
    font-size: 18px;
    margin: 0px;
}

a:hover {
    color: #d9d9d9;
}

li.ab-icon {
    display: flex;
}

header#home-hero {
    background-image: url('../image/banner.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    color: #4b4b4b;
}

header#home-hero::before {
    position: absolute;
    content: "";
    inset: 0;
    background-color: #00000021;
}

.CTA a:hover {
    color: #4b4b4b;
}

.about-box {
    display: flex !important;
    justify-content: space-around;
    align-items: center;
    margin-top: 100px;
}


.shadow-effect {
    background: transparent;
    padding: 80px 40px;
    border-radius: 4px;
    text-align: center;
    border: 1px solid #ECECEC;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.10), 0 15px 12px rgba(0, 0, 0, 0.02);
}

#customers-testimonials .shadow-effect p {
    font-family: inherit;
    font-size: 20px;
    line-height: 1.5;
    margin: 0 0 17px 0;
    font-weight: 300;
}

.testimonial-name {
    margin: -17px auto 0;
    display: table;
    width: auto;
    background: #fdfdfd;
    padding: 9px 35px;
    border-radius: 12px;
    text-align: center;
    color: #020202;
    box-shadow: 0 9px 18px rgba(0, 0, 0, 0.12), 0 5px 7px rgba(0, 0, 0, 0.05);
}

#customers-testimonials .item {
    text-align: center;
    padding: 50px;
    margin-bottom: 40px;
    opacity: .2;
    -webkit-transform: scale3d(0.8, 0.8, 1);
    transform: scale3d(0.8, 0.8, 1);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

#customers-testimonials .owl-item.active.center .item {
    opacity: 1;
    -webkit-transform: scale3d(1.0, 1.0, 1);
    transform: scale3d(1.0, 1.0, 1);
}

.owl-carousel .owl-item img {
    transform-style: preserve-3d;
    /* max-width: 90px; */
    margin: 0 auto 17px;
}

#customers-testimonials.owl-carousel .owl-dots .owl-dot.active span,
#customers-testimonials.owl-carousel .owl-dots .owl-dot:hover span {
    background: #ffffff;
    transform: translate3d(0px, -50%, 0px) scale(0.7);
}

#customers-testimonials.owl-carousel .owl-dots {
    display: inline-block;
    width: 100%;
    text-align: center;
}

#customers-testimonials.owl-carousel .owl-dots .owl-dot {
    display: inline-block;
}

#customers-testimonials.owl-carousel .owl-dots .owl-dot span {
    background: #f8f8f8;
    display: inline-block;
    height: 20px;
    margin: 0 2px 5px;
    transform: translate3d(0px, -50%, 0px) scale(0.3);
    transform-origin: 50% 50% 0;
    transition: all 250ms ease-out 0s;
    width: 20px;
}

.owl-theme .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #fff;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 0px !important;
}

.item.ser-img {
    border: 1px solid;
    padding: 30px;
    display: flex;
    flex-direction: column;
    height: 300px;
    justify-content: center;
    margin-top: 7vw;
    align-items: center;
    border-radius: 30px 0px;
}

.item.ser-img h3 {
    font-size: 27px;
}

.owl-theme .owl-nav.disabled+.owl-dots {
    margin-top: 40px !important;
}

@media (max-width:600px) {
    div ul {
        padding: 0rem !important;
    }

    .shadow-effect {
        background: transparent;
        padding: 80px 20px;
    }

    #customers-testimonials .item {
        text-align: center;
        padding: 30px;

    }

    .about-box {
        display: flex !important;
        justify-content: space-around;
        align-items: center;
        flex-direction: column;
    }

    .item.ser-img {
        margin: 20px;
    }

    div#home-hero-mk2-txt\ text-center {
        text-align: center;

    }

    div#home-hero-date {
        margin-top: 40px;
    }

    header#home-hero {
        background-image: url(../image/mobile-bnner.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: relative;
        color: #4b4b4b;
    }

    /* .law p, .thumbnail-txt div {
    font-size: calc(var(--vw) * 20);
} */
    /* span.y_ {
    font-size: 32px;
    font-weight: 600;
} */
    .accordion-button::after,
    .accordion-button:not(.collapsed)::after {
        --bs-accordion-btn-icon-width: 1.1rem !important;
    }

    .rules-s3-li:nth-child(4) {
        position: relative;
        top: calc(var(--vw) * 0);
        left: 0;
    }

    ul {
        padding-left: 0rem;
    }

    .rules-s3-li:nth-child(5) {
        margin-top: calc(var(--vw) * 40);
        margin-left: calc(var(--col) * 0 + var(--gutter) * 0);
    }
}

li.o {
    height: 240px !important;
}

.home-support-logo-img P {
    font-size: 25px;

}

h1.t-l.t-ll.z-s {
    padding-top: calc(var(--vw) * 140);
}

.owl-stage-outer {
    margin-top: 50px;
}

.sticky-menu {
    background: #010432;
    padding: 15px 0;
}

.sticky-menu #n-logo {
    margin-top: 0;
    /* width: 12%; */
}

.sticky-menu #n-logo img {
    width: 92px;
    height: auto;
}

.sticky-menu #n-link,
.sticky-menu #n-r {
    margin-top: 0;
    align-items: center;
}

.sticky-menu #n-link a,
.sticky-menu #n-bar {
    align-items: center;
    align-self: unset;
}

.sticky-menu #n-r a {
    height: auto;
    padding: 12px 0;
}



.link-arrow {
    width: calc(var(--vw) * 15);
    font-size: 18px;
    line-height: 20px;
}

._d .link:hover .link-arrow-left {
    transform: translate3d(-195%, 0, 0);
}

/* .link-txt {
    margin-left: calc(var(--vw) * 5);
    font-size: calc(var(--vw) * 20);
    font-weight: 300;
} */

._d .link:hover .link-txt {
    transform: translate3d(-1.4vw, 0, 0);
}

.CTA {
    background: transparent;
    padding: 8px 15px;
    display: inline-flex;
    margin: auto;
    position: relative;
    margin-top: 30px;
    border: 1px solid #4b4b4b;
}

.CTA:hover {
    background-color: #ffffff;
    border-color: #ffffff;
}

.cstm_list {
    margin-top: 30px;
}

.cstm_list li {
    margin-bottom: 8px;
}

a {
    transition: .3s ease-in-out;
}


#home-intro-description .CTA,
#home-film .CTA {
    color: #ffffff;
    border-color: #ffffff;
}

#home-intro-description .link {
    color: #ffffff;
}

#n-r a:hover,
#home-intro-description .link:hover {
    background-color: #ffffff;
    color: #414141;
}

@media(max-width:800px) {
    .sticky-menu #n-logo {
        width: calc(var(--col) * 1 + var(--gutter) + var(--vw) * 2);
    }

    .sticky-menu #n-burger_ {
        top: calc(var(--vw) * -6);
    }

    div#home-hero-mk2-txt\ text-center {
        width: 85%;
        margin: auto;
        text-align: center;
    }

    section {
        overflow: hidden;
    }

    #home-intro-description .link {
        margin-top: 0;
    }

    .link-arrow {
        font-size: 10px;
        line-height: 10px;
    }

    #n-r a {
        height: calc(var(--vw) * 45);
        font-size: 9px;
    }

    .sticky-menu #n-r a {
        height: auto;
        padding: 10px 0;
    }

}

h1.t-l.T-2.z-s {
    width: 100% !important;
}

.introp-1 {
    font-size: calc(var(--vw) * 25);
    text-align: center;
    width: calc(var(--col) * 12 + var(--gutter));
    margin: auto;
    padding-top: 100px;
}

@media(max-width:767px) {

    .home-calendar-li:nth-child(even),
    .service-slider .owl-item:nth-child(even) {
        margin-top: 0;
    }

    .home-calendar-li {
        width: 100%;
        margin: 0 !important;
        height: 270px;
        padding: 25px
    }

    .home-calendar-li h3 {
        font-size: calc(var(--vw) * 25);
        font-weight: 300;
        line-height: 90%;
    }

    .home-calendar-li p {
        font-size: calc(var(--vw) * 15);
        line-height: 110%;
    }

}

.offcanvas-body,
.offcanvas-header {
    background: #020d3a;
}

.open #n-burger_ {
    opacity: 0;
}

.navbar-toggler {
    padding: 0;
    border: 0;
    box-shadow: unset !important;
}

.law-hero .t-l,
#rules-hero .t-l {
    width: 92%;
    font-size: calc(var(--vw) * 70);
    line-height: normal;
}

.list_text,
.list_text li {
    list-style: disc;
}

.list_text li {
    margin-bottom: 20px;
}

.list_text b {
    display: block;
    margin-bottom: 5px;
}

.accordion.faq-list .faq-li,
.accordion.faq-list .accordion-button {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, .5);
    border-radius: 0;
    border-left: 0;
}

.accordion.faq-list .accordion-button {
    font-size: calc(var(--vw) * 20);
    line-height: 110%;
    padding-left: var(--marge);
    height: calc(var(--vw) * 84);
    box-shadow: unset !important;
}

.accordion.faq-list .accordion-body p {
    padding-bottom: calc(var(--vw) * 32);
    font-size: calc(var(--vw) * 16);
    line-height: 140%;
    transition: opacity 2000ms var(--o6);
    opacity: .7;
    will-change: opacity;
}

.accordion.faq-list .accordion-body {
    padding-left: var(--marge);
    padding-bottom: 0;
}


.accordion-button::after,
.accordion-button:not(.collapsed)::after {
    --bs-accordion-btn-icon-width: 2rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

@media(max-width:991px) {
    #n-menu-link a {
        margin: 12px var(--marge);
    }

    .n-menu-link-txt {
        font-size: 20px;
    }

    #n-link a {
        height: calc(var(--vw) * 45);
        font-size: 9px;
        letter-spacing: 1px;
    }

}

@media (max-width: 991px) {

    .law p,
    .thumbnail-txt div {
        font-size: calc(var(--vw) * 22) !important;
    }

    .law h2 {

        font-size: calc(var(--vw) * 35);

    }

}


@media (max-width: 768px) {
    .law p {
        font-size: 17px !important;
        line-height: 170%;
    }

    ul.list_text li {
        font-size: 17px;
    }

    .accordion.faq-list .accordion-button {
        font-size: 19px;
    }

    .rules-s3-li p {
        margin-top: calc(var(--vw) * 20);
        font-size: 11px;
        line-height: 170%;
    }
}



/*start portfolio*/
.portfolio {
    padding: 80px 0;
    margin: auto;
    max-width: 1140px;
}

.portfolio p {
    color: #fff;
    margin: 20px 40px;
    letter-spacing: 1px;
    line-height: 1.5em;
}

/*start tabs*/
.portfolio input[type="radio"] {
    display: none;
}

.portfolio .tabs label {
    display: inline-block;
    color: #ffffff;
    /* text-transform: uppercase; */
    text-align: center;
    padding: 10px 18px;
    margin-bottom: 20px;
    cursor: pointer;
    font-size: calc(var(--vw)*25);
}

div#home-hero-mk2-txt\ text-center {
    font-size: calc(var(--vw) * 20);
}

.portfolio .tabs .all {
    display: none;
    transform-origin: 10% 50%;
}

.portfolio .tabs .content {
    margin-bottom: 29px;
    position: relative;
    overflow: hidden;
}

.portfolio .tabs .content img {
    /* height: 190px; */
    width: 100%;
}

.portfolio .tabs label:not(:first-of-type) {
    margin-left: -4px;
}

.portfolio input[id="all"]:checked~.content .all {
    display: block;
    animation: animateTabe 1s;
}

.portfolio input[id="CamerasLenses"]:checked~.content .CamerasLenses {
    display: block;
    animation: animateTabe 1s;
}

.portfolio input[id="Lighting"]:checked~.content .Lighting {
    display: block;
    animation: animateTabe 1s;
}

.portfolio input[id="Support"]:checked~.content .Support {
    display: block;
    animation: animateTabe 1s;
}

.portfolio input[type="radio"]:checked+label {
    background-color: transparent;
    border: 1px solid #e8ce85;
    cursor: default;
}

.portfolio .text-hd p {
    color: #fff;
    margin: 20px 10px;
    letter-spacing: 1px;
    line-height: 1.5em;
}

.text-hd {
    background: #bf8b3e2e;
    padding: 1px;
    /* margin: 0 -10px; */
}

/* .portfolio .tabs .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    background: rgba(0, 0, 0, .5);
    left: 0;
    transition: all .5s;
    transition: all .5s linear;
} */

.portfolio .tabs .all .content:hover .overlay {
    top: 0;
}

.portfolio .tabs .overlay span {
    padding: 2px 8px;
    border: 1px solid #fff;
    border-radius: 3px;
    cursor: pointer;
}

.portfolio .tabs .overlay span:hover {
    background: #5CC05C;
    border-color: #5CC05C;
}

@keyframes animateTabe {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.classic-list {
    list-style-type: none;
}