@import url("https://p.typekit.net/p.css?s=1&k=gxs4rxw&ht=tk&f=137.138.139.140.169.170.171.172.173.174.175.176.5474.5475.25136.25137.2005.2006.2009.2010.9938.9939.39002.39004.16353.37461.37466.37467.17398.17399.17400.17401.22618.22619.37478.37479.37484.37485.37509.37510.37511.37512.37513.37514.37515.37516.37517.37518.37519.37520.37521.37522.37523.37524.37525.37526&a=272690494&app=typekit&e=css");
@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/846224/00000000000000007735e602/31/l?subset_id=2&fvd=n9&v=3") format("woff2"),
        url("https://use.typekit.net/af/846224/00000000000000007735e602/31/d?subset_id=2&fvd=n9&v=3") format("woff"),
        url("https://use.typekit.net/af/846224/00000000000000007735e602/31/a?subset_id=2&fvd=n9&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 900;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/a7a503/00000000000000007758cf7c/31/l?subset_id=2&fvd=i9&v=3") format("woff2"),
        url("https://use.typekit.net/af/a7a503/00000000000000007758cf7c/31/d?subset_id=2&fvd=i9&v=3") format("woff"),
        url("https://use.typekit.net/af/a7a503/00000000000000007758cf7c/31/a?subset_id=2&fvd=i9&v=3") format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 900;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/5be242/00000000000000007735e603/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3")
            format("woff2"),
        url("https://use.typekit.net/af/5be242/00000000000000007735e603/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3")
            format("woff"),
        url("https://use.typekit.net/af/5be242/00000000000000007735e603/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3")
            format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 700;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/38ea3a/00000000000000007758cf7d/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3")
            format("woff2"),
        url("https://use.typekit.net/af/38ea3a/00000000000000007758cf7d/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3")
            format("woff"),
        url("https://use.typekit.net/af/38ea3a/00000000000000007758cf7d/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3")
            format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 700;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/99d25e/00000000000000007735e611/31/l?subset_id=2&fvd=n8&v=3") format("woff2"),
        url("https://use.typekit.net/af/99d25e/00000000000000007735e611/31/d?subset_id=2&fvd=n8&v=3") format("woff"),
        url("https://use.typekit.net/af/99d25e/00000000000000007735e611/31/a?subset_id=2&fvd=n8&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 800;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/57ba91/00000000000000007758cf8c/31/l?subset_id=2&fvd=i8&v=3") format("woff2"),
        url("https://use.typekit.net/af/57ba91/00000000000000007758cf8c/31/d?subset_id=2&fvd=i8&v=3") format("woff"),
        url("https://use.typekit.net/af/57ba91/00000000000000007758cf8c/31/a?subset_id=2&fvd=i8&v=3") format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 800;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/4b22bb/00000000000000007735e601/31/l?subset_id=2&fvd=n1&v=3") format("woff2"),
        url("https://use.typekit.net/af/4b22bb/00000000000000007735e601/31/d?subset_id=2&fvd=n1&v=3") format("woff"),
        url("https://use.typekit.net/af/4b22bb/00000000000000007735e601/31/a?subset_id=2&fvd=n1&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 100;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/da27c4/00000000000000007758cf8d/31/l?subset_id=2&fvd=i1&v=3") format("woff2"),
        url("https://use.typekit.net/af/da27c4/00000000000000007758cf8d/31/d?subset_id=2&fvd=i1&v=3") format("woff"),
        url("https://use.typekit.net/af/da27c4/00000000000000007758cf8d/31/a?subset_id=2&fvd=i1&v=3") format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 100;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/e37e5a/00000000000000007735e60d/31/l?subset_id=2&fvd=n6&v=3") format("woff2"),
        url("https://use.typekit.net/af/e37e5a/00000000000000007735e60d/31/d?subset_id=2&fvd=n6&v=3") format("woff"),
        url("https://use.typekit.net/af/e37e5a/00000000000000007735e60d/31/a?subset_id=2&fvd=n6&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 600;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/0bd0af/00000000000000007758cf8e/31/l?subset_id=2&fvd=i6&v=3") format("woff2"),
        url("https://use.typekit.net/af/0bd0af/00000000000000007758cf8e/31/d?subset_id=2&fvd=i6&v=3") format("woff"),
        url("https://use.typekit.net/af/0bd0af/00000000000000007758cf8e/31/a?subset_id=2&fvd=i6&v=3") format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 600;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/d7ff92/00000000000000007735e609/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3")
            format("woff2"),
        url("https://use.typekit.net/af/d7ff92/00000000000000007735e609/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3")
            format("woff"),
        url("https://use.typekit.net/af/d7ff92/00000000000000007735e609/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3")
            format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 400;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/6eb0e3/00000000000000007758cf8f/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3")
            format("woff2"),
        url("https://use.typekit.net/af/6eb0e3/00000000000000007758cf8f/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3")
            format("woff"),
        url("https://use.typekit.net/af/6eb0e3/00000000000000007758cf8f/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3")
            format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 400;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/3888dc/00000000000000007735e606/31/l?subset_id=2&fvd=n3&v=3") format("woff2"),
        url("https://use.typekit.net/af/3888dc/00000000000000007735e606/31/d?subset_id=2&fvd=n3&v=3") format("woff"),
        url("https://use.typekit.net/af/3888dc/00000000000000007735e606/31/a?subset_id=2&fvd=n3&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 300;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/0b8052/00000000000000007758cf90/31/l?subset_id=2&fvd=i3&v=3") format("woff2"),
        url("https://use.typekit.net/af/0b8052/00000000000000007758cf90/31/d?subset_id=2&fvd=i3&v=3") format("woff"),
        url("https://use.typekit.net/af/0b8052/00000000000000007758cf90/31/a?subset_id=2&fvd=i3&v=3") format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 300;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/26f7ec/00000000000000007735e605/31/l?subset_id=2&fvd=n5&v=3") format("woff2"),
        url("https://use.typekit.net/af/26f7ec/00000000000000007735e605/31/d?subset_id=2&fvd=n5&v=3") format("woff"),
        url("https://use.typekit.net/af/26f7ec/00000000000000007735e605/31/a?subset_id=2&fvd=n5&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 500;
    font-stretch: normal;
}

@font-face {
    font-family: "proxima-nova";
    src:
        url("https://use.typekit.net/af/c7cac4/00000000000000007735e60e/31/l?subset_id=2&fvd=i5&v=3") format("woff2"),
        url("https://use.typekit.net/af/c7cac4/00000000000000007735e60e/31/d?subset_id=2&fvd=i5&v=3") format("woff"),
        url("https://use.typekit.net/af/c7cac4/00000000000000007735e60e/31/a?subset_id=2&fvd=i5&v=3") format("opentype");
    font-display: auto;
    font-style: italic;
    font-weight: 500;
    font-stretch: normal;
}

:root {
    --size-10: 0.5208vw;
    --size-11: 0.5729vw;
    --size-12: 0.625vw;
    --size-13: 0.6771vw;
    --size-14: 0.7292vw;
    --size-15: 0.7812vw;
    --size-16: 0.8333vw;
    --size-17: 0.8854vw;
    --size-18: 0.9375vw;
    --size-19: 0.9896vw;
    --size-20: 1.0417vw;
    --size-21: 1.0938vw;
    --size-22: 1.1458vw;
    --size-23: 1.1979vw;
    --size-24: 1.25vw;
    --size-25: 1.3021vw;
    --size-26: 1.3542vw;
    --size-27: 1.4062vw;
    --size-28: 1.4583vw;
    --size-29: 1.5104vw;
    --size-30: 1.5625vw;
    --size-31: 1.6146vw;
    --size-32: 1.6667vw;
    --size-33: 1.7188vw;
    --size-34: 1.7708vw;
    --size-35: 1.8229vw;
    --size-36: 1.875vw;
    --size-37: 1.9271vw;
    --size-38: 1.9792vw;
    --size-39: 2.0312vw;
    --size-40: 2.0833vw;
    --size-41: 2.1354vw;
    --size-42: 2.1875vw;
    --size-43: 2.2396vw;
    --size-44: 2.2917vw;
    --size-45: 2.3438vw;
    --size-46: 2.3958vw;
    --size-47: 2.4479vw;
    --size-48: 2.5vw;
    --size-49: 2.5521vw;
    --size-50: 2.6042vw;
    --size-51: 2.6562vw;
    --size-52: 2.7083vw;
    --size-53: 2.7604vw;
    --size-54: 2.8125vw;
    --size-55: 2.8646vw;
    --size-56: 2.9167vw;
    --size-57: 2.9688vw;
    --size-58: 3.0208vw;
    --size-59: 3.0729vw;
    --size-60: 3.125vw;
    --size-61: 3.1771vw;
    --size-62: 3.2292vw;
    --size-63: 3.2812vw;
    --size-64: 3.3333vw;
    --size-65: 3.3854vw;
    --size-66: 3.4375vw;
    --size-67: 3.4896vw;
    --size-68: 3.5417vw;
    --size-69: 3.5938vw;
    --size-70: 3.6458vw;
    --size-78: 4.0625vw;
    --size-71: 3.6979vw;
    --size-72: 3.75vw;
    --size-73: 3.8021vw;
    --size-74: 3.8542vw;
    --size-75: 3.9062vw;
    --size-76: 3.9583vw;
    --size-77: 4.0104vw;
    --size-78: 4.0625vw;
    --size-79: 4.1146vw;
    --size-80: 4.1667vw;
    --size-81: 4.2188vw;
    --size-82: 4.2708vw;
    --size-83: 4.3229vw;
    --size-84: 4.375vw;
    --size-85: 4.4271vw;
    --size-86: 4.4792vw;
    --size-87: 4.5312vw;
    --size-88: 4.5833vw;
    --size-89: 4.6354vw;
    --size-90: 4.6875vw;
    --size-91: 4.7396vw;
    --size-92: 4.7917vw;
    --size-93: 4.8438vw;
    --size-94: 4.8958vw;
    --size-95: 4.9479vw;
    --size-96: 5vw;
    --size-97: 5.0521vw;
    --size-98: 5.1042vw;
    --size-99: 5.1562vw;
    --size-100: 5.2083vw;
}

* {
    padding: 0;
    margin: 0;
    box-sizing: unset;
}

ul,
ol {
    list-style: none;
}

a {
    text-decoration: none;
    color: inherit;
}
section {
    overflow: hidden;
    width: 100%;
}

.main::after {
    width: 1vw;
    height: 0vw;
    position: absolute;
    top: 0;
    pointer-events: none;
    opacity: 0;
    pointer-events: none;
    /*     content:url(/images/con1_10.png) url(/images/con1_11.png) url(/images/con1_12.png)
    url(/images/con6_08.png) url(/images/con6_09.png)  url(/images/con6_10.png) url(/images/con6_11.png) url(/images/con6_12.png)
    url(/images/con7_02.png) url(/images/con7_03.png) url(/images/con7_04.png)  url(/images/con7_05.png); */
}
.clearfix::after,
.clearfix::before {
    display: block;
    clear: both;
    content: "";
}

@keyframes marqueeY {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(100%);
    }
}

@keyframes marquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}
@keyframes marquee2 {
    from {
        transform: translateX(-50%);
    }
    to {
        transform: translateX(0);
    }
}
@keyframes slick-circle {
    0% {
        left: 0;
    }
    100% {
        left: 99%;
    }
}
@keyframes soul_out {
    0% {
        opacity: 0.7;
    }
    100% {
        opacity: 0;
        transform: translateY(-50%);
    }
}
@keyframes ddm3 {
    0% {
        transform: scale(1);
    }
    50% {
        transform: rotate(-8deg);
    }
    65% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes ddm4 {
    0% {
        transform: scale(1);
    }
    25% {
        transform: rotate(-2deg);
    }
    50% {
        transform: scale(1.05);
    }
    75% {
        transform: rotate(2deg);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes rotate_image1 {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes ani_scale {
    0% {
        transform: scale(1);
    }
    50% {
        transform: matrix(1.1, 0.01, 0.01, 1.2, 0, 0);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes zoom {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.02);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes blk {
    0% {
        opacity: 0;
    }
    30% {
        opacity: 0;
    }
    31% {
        opacity: 1;
    }
    99% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes blk2 {
    0% {
        opacity: 0;
    }
    49% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    99% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes blk3 {
    0% {
        opacity: 1;
    }
    24% {
        opacity: 1;
    }
    25% {
        opacity: 0;
    }
    99% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes rotate_image {
    100% {
        transform: rotate(360deg);
    }
}
@keyframes scaleOpa {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}

@keyframes scaleOpa2 {
    0% {
        transform: scale(1);
        opacity: 0;
    }
    20% {
        opacity: 0.4;
    }
    100% {
        transform: scale(1.2);
        opacity: 0;
    }
}
@keyframes ball {
    0% {
        bottom: 0px;
    }
    100% {
        bottom: 20px;
    }
}
@keyframes ddm {
    0% {
        transform: scale(1);
    }
    50% {
        transform: matrix(1.05, 0.01, 0.01, 1.05, 0, -30);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes ddm_m {
    0% {
        transform: scale(1);
    }
    50% {
        transform: matrix(1.05, 0.01, 0.01, 1.05, 0, -15);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes ddm_m2 {
    0% {
        transform: scale(1);
    }
    50% {
        transform: matrix(1.15, 0.01, 0.01, 1.15, 0, 30);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes zoom2 {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes rotate_imageY {
    0% {
        transform: rotateY(0);
    }
    100% {
        transform: rotateY(360deg);
    }
}

@keyframes ddm2 {
    0% {
        transform: scale(1);
    }
    50% {
        transform: translateY(20px);
    }
    75% {
        transform: scale(1.02);
        transform: translateY(10px);
    }
    100% {
        transform: scale(1);
        transform: translateY(0px);
    }
}
@keyframes ddm2X {
    0% {
        transform: scale(1);
    }
    50% {
        transform: translateX(-100%);
    }
    100% {
        transform: scale(1.02);
    }
}
@keyframes ddm2Xhalf {
    0% {
        transform: scale(1);
    }
    50% {
        transform: translateX(-50%);
    }
    100% {
        transform: scale(1.02);
    }
}

@keyframes scaleOpa3 {
    100% {
        transform: scale(1.3);
        opacity: 0;
    }
}
@keyframes uitLineMove {
    0% {
        stroke-dashoffset: 300.292;
    }
    100% {
        stroke-dashoffset: 110;
    }
}

@keyframes hand {
    0% {
        transform: translateY(-0.5%);
    }

    25% {
        transform: translateY(1%);
    }

    50% {
        transform: translate(0.5%, -1%);
    }

    75% {
        transform: translate(1%, 0.5%);
    }

    100% {
        transform: translate(1%, -1%);
    }
}

@keyframes hand2 {
    0% {
        transform: translateY(2%);
    }

    25% {
        transform: translateY(-1%);
    }

    50% {
        transform: translate(-1%, 2%);
    }

    75% {
        transform: translate(2%, 1%);
    }

    100% {
        transform: translateY(2%);
    }
}
@keyframes bg-position {
    0% {
        background-position: bottom;
    }
    25% {
        background-position: center;
    }
    50% {
        background-position: inherit;
    }
    75% {
        background-position: center;
    }
    100% {
        background-position: bottom;
    }
}
@keyframes smoke {
    0% {
        transform: translate(0, 30%) rotate(0);
        opacity: 0.2;
    }
    25% {
        transform: translate(calc(random() * 100vw), 100vh) rotate(50deg) translateX(10px);
        opacity: 1;
    }
    50% {
        transform: translate(calc(random() * 100vw), 100vh) rotate(50deg) translateX(50px);
        opacity: 1;
    }
    75% {
        transform: translate(calc(random() * 100vw), 100vh) rotate(50deg) translateX(50px);
        opacity: 1;
    }
    100% {
        transform: translate(calc(random() * 100vw), 200vh) rotate(0) translateX(70px);
        opacity: 0.2;
    }
}

@keyframes light {
    0%,
    31%,
    34%,
    39%,
    42%,
    47% {
        opacity: 0;
    }
    5%,
    30%,
    35%,
    38%,
    43%,
    46% {
        opacity: 0.4;
    }
    50%,
    55%,
    60%,
    67%,
    51%,
    54%,
    68%,
    100% {
        opacity: 1;
    }
    70% {
        opacity: 0.2;
    }
}
@keyframes marqueeX {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-100%);
    }
}
@keyframes marqueeX_r {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(100%);
    }
}
@keyframes marqueeY {
    from {
        transform: translateY(0);
    }
    to {
        transform: translateY(-100%);
    }
}
@keyframes marqueeY_r {
    from {
        transform: translateY(0);
    }
    to {
        transform: translateY(100%);
    }
}
@keyframes fall {
    0% {
        top: -0%;
        opacity: 1;
        transform: rotateX(0deg) rotateY(0deg) (0deg);
        transform-origin: center center;
    }
    100% {
        transform: rotateX(240deg) rotateY(400deg) rotateZ(310deg);
        transform-origin: center center;
        top: 100%;
        opacity: 0;
    }
}
@keyframes fall2 {
    0% {
        top: -0%;
        opacity: 1;
        transform: rotateX(0deg) rotateY(0deg) (0deg);
        transform-origin: center center;
    }
    100% {
        transform: rotateX(-240deg) rotateY(-400deg) rotateZ(-310deg);
        transform-origin: center center;
        top: 100%;
        opacity: 0;
    }
}
@keyframes backgroundchange {
    0% {
        background: url(/images/con11_07.png) no-repeat center / contain;
    }

    25% {
        background: url(/images/con11_08.png) no-repeat center / contain;
    }

    50% {
        background: url(/images/con11_09.png) no-repeat center / contain;
    }

    75% {
        background: url(/images/con11_10.png) no-repeat center / contain;
    }

    100% {
        background: url(/images/con11_07.png) no-repeat center / contain;
    }
}
@keyframes opa {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes backgroundchange_2 {
    0% {
        background: url(/images/con08_07.png) no-repeat center / contain;
    }

    20% {
        background: url(/images/con08_08.png) no-repeat center / contain;
    }

    40% {
        background: url(/images/con08_09.png) no-repeat center / contain;
    }

    60% {
        background: url(/images/con08_10.png) no-repeat center / contain;
    }

    80% {
        background: url(/images/con08_11.png) no-repeat center / contain;
    }
    100% {
        background: url(/images/con08_07.png) no-repeat center / contain;
    }
}
@keyframes rotateAnimation {
    0% {
        transform: rotate(-1deg);
    }
    40% {
        transform: rotate(1deg);
    }
    60% {
        transform: rotate(2deg);
    }
    80% {
        transform: rotate(-1deg);
    }
    100% {
        transform: rotate(1deg);
    }
}
@keyframes shakeAndFall {
    0% {
        transform: translate(0, -50%) rotate(0);
        opacity: 0;
    }
}

section {
    font-family: "Pretendard Variable";
    font-weight: 300;
    /* font-size: var(--size-18); */
    /* letter-spacing: -0.02em; */
}
.swiper-button-disabled {
    opacity: 0.3;
}
/* 마커디자인 */
.map_marker {
    position: relative;
    display: inline-block;
}

/* 말풍선 텍스트 박스 */
.map_marker_text {
    background: #be0211;
    border: 1px solid #fff;
    padding: 9px 19px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 500;
    color: #fff;
    white-space: nowrap;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
}

/* 말풍선 꼬리 (삼각형 테두리) */
.map_marker_tail {
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #fff;
}

/* 말풍선 꼬리 내부 (흰색 채우기) */
.map_marker_tail::after {
    content: "";
    position: absolute;
    top: -9px;
    left: -7px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid #be0211;
}
/* ------------------------- 퍼블시작 ------------------------- */
/* ------------------------- vw rem 연동 ------------------------- */

html {
    font-size: 0.5208333333vw;
}

::selection {
    background-color: #d51200;
    color: #fff;
}

body {
    font-size: 1.8rem;
    min-height: 0vw;
    letter-spacing: -0.04em;
    line-height: 1.4;
}

/* header */
#header {
    position: fixed;
    z-index: 1000;
}

/* font */
[font-family="proxima"] {
    font-family: "proxima-nova", sans-serif;
}

[font-family="proxima-kr"] {
    font-family: "proxima-nova-hangeul", sans-serif;
}

/* ------------------------- main start ------------------------- */
section.main {
    display: flex;
    flex-direction: column;
    height: 92.5rem;
    border-bottom: 0.1rem solid #000;
    box-sizing: border-box;
    padding-top: var(--headerH);
}

/* main text */
.main_text-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-top: 8rem;
    color: #fff;
    gap: 3rem;
    z-index: 3;
}

.main_01 {
    opacity: 0;
    transform: translateY(-100%);
}

/* main-video */
.main_video-wrap {
    inset: 0 0 0 0;
    z-index: -1;

    video {
        filter: brightness(0.3);
    }
}

/* main marquee */
.main_marquee {
    margin-top: 13rem;
}
.main_marquee img {
    flex-shrink: 0;
    width: 278.7rem;
    animation: marqueeX 14s linear infinite;
}

/* main dish */
.main_dish-rotate {
    bottom: -20rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
}

.main_04 {
    bottom: 0;
    left: 50%;
    width: 170rem;
    transform: translateX(-50%);
    z-index: -1;
}

/* main dish > smoke */
.main_smoke {
    bottom: 0;
    width: 77.9rem;
    animation: smoke 4s infinite linear;
}

.main_smoke:nth-child(3) {
    left: 0%;
}

.main_smoke:nth-child(4) {
    left: 100%;
}

/* main end */
/* ------------------------- con01 start ------------------------- */
strong {
    font-weight: 800;
}
.con01 {
    height: 91rem;
    overflow: hidden;
    padding-bottom: 6rem;
    z-index: 100;
}

/* con01_text */
.con01_text-wrap {
    text-align: center;
    line-height: 1.5;
    font-weight: 500;
    color: #fff;
    margin-top: -2rem;
    z-index: 2;
}
.con01_text-1 {
    margin-bottom: 4.8rem;
}
.con01_text-2 {
    margin-bottom: 2.4rem;
}
.con01_text-3 {
    margin-bottom: 2.4rem;
}

/* con01-bg */

.con01_content {
    top: 0;
    left: 0;
    height: 100%;

    .bg-black {
        display: block;
        width: 100%;
        height: 100%;
        background-color: #000;
    }
}

.con01_content .content_left,
.con01_content .content_right {
    flex: 1 1 0;
    height: 100%;
    overflow: hidden;
}

.con01 .bg-grid {
    width: 96rem;
}

.con01 .text-left {
    bottom: 25.4rem;
    left: 13rem;
}
.con01 .text-right {
    bottom: 25.4rem;
    right: 13rem;
}

.con01_marquee {
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    padding: 2.4rem 0;
    background-color: #000;
    z-index: 2;
}

.con01_marquee img {
    flex-shrink: 0;
    animation: marqueeX 20s infinite linear;
}

.con01_dish {
    bottom: -4rem;
    left: 50%;
    transform: translate(-50%);
}

.con01_dish .img-box {
    width: 74.2rem;
    height: 58.7rem;
    background-size: 100%;
    background-repeat: no-repeat;
    transition: all 0.5s;
}

.con01_dish .img-box[img-index="0"] {
    background-image: url(/images/con01_07.png);
}

.con01_dish .img-box[img-index="1"] {
    background-image: url(/images/con01_11.png);
}

.con01_dish .img-box[img-index="2"] {
    background-image: url(/images/con01_12.png);
}

.con01_dish .img-box[img-index="3"] {
    background-image: url(/images/con01_13.png);
}

.con01_dish .img-box[img-index="4"] {
    background-image: url(/images/con01_14.png);
}

/* con01 btn */
.con01_btn {
    bottom: 12rem;
    left: 50%;
    transform: translate(-50%);
    z-index: 3;
    background-color: #fff;
    border: 0.1rem solid #391c00;
    width: 25.2rem;
    height: 6.1rem;
    border-radius: 99rem;
    transition: background-color 0.3s;

    .btn-text {
        z-index: 2;
        transition: filter 0.3s;
    }

    &:hover {
        background-color: #ed1500;
        .btn-text {
            filter: invert(1);
        }
    }
}

/* -------------------- con02 -------------------- */
.con02 {
    height: 190.5rem;
    overflow: hidden;
    padding-top: 5%;
}

/* con02 bg */
.con02-bg {
    top: 0;
    left: 0;
}

/* con02 top */
.con02_top {
    height: 95rem;
    z-index: 2;
}

.con02_top .text-wrap {
    display: block;
    left: 50%;
    z-index: 2;
    margin-top: 8rem;
}

.con02_btn-wrap {
    gap: 0.6rem;
    margin-top: 4.2rem;
}

.con02_btn {
    position: relative;
    width: 26.2rem;
    height: 26.2rem;
    background-repeat: no-repeat;
    background-size: 100%;
    overflow: hidden;
    border-radius: 5rem;
    background-color: #fff;
    border: 0.1rem solid #000;
    transition: background-color 0.3s;

    .btn-text {
        transition: all 0.3s;
    }

    .btn_h-img {
        margin-top: 16rem;
        transform: translateY(100%);
        transition: all 0.3s;
    }

    &.hover {
        background-color: #d51300;

        .btn-text {
            transform: translateY(-5rem);
            filter: invert(1);
        }

        .btn_h-img {
            transform: translateY(0);
        }
    }
}

.con02_top-text {
    margin-top: 6rem;

    font-weight: 500;
    line-height: 1.5;
}

.con02_01 {
    left: 0;
    top: -10rem;
}

.con02_02 {
    left: 10rem;
    top: 43rem;
    z-index: 2;
}
.con02_03 {
    left: 0;
    top: -32.1rem;
    z-index: 3;
}
.con02_ex {
    top: -22rem;
    right: -18rem;
}

.con02_marquee {
    margin-top: 98rem;

    img {
        animation: marqueeX 24s infinite linear;
    }
}

.con02_bottom {
    z-index: 2;
    margin-top: 16rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: calc(100% - 95rem);
}

.con02_bottom-text-wrap {
    /* width: 100%; */
    display: flex;
    align-items: center;
    flex-direction: column;
    z-index: 10;
}

.con02_11 {
    text-align: center;
    margin-bottom: 3rem;
}
.con02_bottom-text-wrap .bottom-text {
    text-align: center;
    line-height: 1.5;
    font-weight: 500;

    &.pc-mobile {
        display: block;
    }
}

/* con02 dish */
.con02_12 {
    bottom: -7rem;
    z-index: 2;
}

/* con02 sticker */
.con02_13 {
    left: 120rem;
    top: 24rem;
    z-index: 3;
}

/* con02 sticker fire */
.con02_14 {
    top: 12rem;
    left: 17rem;
}

/* con02 bottom bg */
.con02_05 {
    bottom: -45%;
}

/* ------------------ con03 start ------------------ */
.con03 {
    height: 91.5rem;
    background-color: #d61301;
}

/* con03 bg */
.con03_01 {
    top: 9rem;
}

/* con03 text */
.con03-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 10;
    margin: 4rem 0 0;
}

.con03_02 {
    margin-bottom: 18rem;
}

/* con03 title */
.con03_03 {
    margin-bottom: 2rem;
}
.con03_text {
    bottom: 2rem;
    color: #fff;
    z-index: 3;
}

/* sales wrap */
.con03_sales-wrap {
    margin-bottom: 2rem;
}

/* sales counter */
.con03 .con03_counter {
    font-size: 10.8rem;
    font-weight: 800;
    color: #fff;
    margin-left: 1.6rem;
    text-align: right;
}

/* currency */
.con03_04 {
    align-self: end;
    margin-bottom: 2rem;
}

.con03_dish-wrap {
    z-index: 3;
}

/* con03 smoke */
.con03_smoke {
    animation: smoke 4s infinite linear;
    pointer-events: none;
}

/* con03 store swiper */
.con03_swiper {
    top: 65rem;
    left: 0;
    right: 0;
    z-index: 2;
}

.con03_swiper .swiper-slide {
    width: fit-content;
}

.con03_slide-text-wrap {
    inset: 0 0 0 0;
    box-sizing: border-box;
    text-align: center;
    font-weight: 700;
}

.con03_slide-text-top {
    height: 6.8rem;
    font-weight: 600;
}

.con03_slide-text-bottom {
    height: 11rem;
    font-size: 3.8rem;
}

/* -------------------- con04 start --------------------- */

.con04_01-wrap {
    margin: 7rem 0 2.4rem;
}
.con04_04 {
    margin: 1rem 0 2.4rem;
}
.con04_text01 {
    font-weight: 500;
}

.con04_07 {
    top: 5rem;
    right: 6rem;
}
.con04_gsap {
    margin-top: 5rem;
}

.con04 .gsap-slide {
    overflow: hidden;
}

.con04_gsap .text-wrap {
    margin-top: 2rem;
    left: 50%;
}

.con04_slide-text {
    margin: 2.4rem 0;
    font-weight: 500;
    line-height: 1.5;
}

.con04_btn {
    box-sizing: border-box;
    width: 54.2rem;
    height: 6.8rem;
    background-color: #fff;
    color: #000;
    border-radius: 9.9rem;
    border: 0.1rem solid #000;
    transition: all 0.3s;
    gap: 3.2rem;
    text-align: center;
    font-weight: 500;

    .con04_09 {
        opacity: 0;
        visibility: hidden;
        transition: inherit;
    }
}

.con04_btn.hover {
    background-color: #d51300;
    color: #fff;

    .con04_09 {
        opacity: 1;
        visibility: visible;
    }
}

.con04_btn:not(:last-child) {
    margin-bottom: 1.2rem;
}
.con04_btn:last-child {
    white-space: nowrap;
    gap: 0.8rem;
}

/* con04 slide 2 */
.con04_dish .img-box {
    width: 67.5rem;
    height: 54.3rem;
    background-repeat: no-repeat;
    background-size: 100%;
    transition: background 0.3s;
}

.con04_dish .img-box[img-index="0"] {
    background-image: url(/images/con04_22\(쭈꾸미\).png);
}
.con04_dish .img-box[img-index="1"] {
    background-image: url(/images/con04_23\(묵은지\).png);
}
.con04_dish .img-box[img-index="2"] {
    background-image: url(/images/con04_24\(마라\).png);
}
.con04_dish .img-box[img-index="3"] {
    background-image: url(/images/con04_25\(안동찜닭\).png);
}
.con04_dish .img-box[img-index="4"] {
    background-image: url(/images/con04_26\(우삼겹\).png);
}
.con04_dish .img-box[img-index="5"] {
    background-image: url(/images/con04_27\(로제\).png);
}

.con04_13 {
    top: 3.6rem;
    z-index: 2;
    margin-left: 10rem;
}

.con04_14 {
    top: 50%;
    right: 4rem;
    transform: translateY(-50%);
}

/* con04 menu name */
.con04_dish .img-box.menu-name {
    top: 40rem;
    left: 44rem;
    width: 14.3rem;
    height: 14.3rem;
}

.con04_dish .img-box.menu-name[img-index="0"] {
    background-image: url(/images/con04_16.png);
}
.con04_dish .img-box.menu-name[img-index="1"] {
    background-image: url(/images/con04_17.png);
}
.con04_dish .img-box.menu-name[img-index="2"] {
    background-image: url(/images/con04_18.png);
}
.con04_dish .img-box.menu-name[img-index="3"] {
    background-image: url(/images/con04_19.png);
}
.con04_dish .img-box.menu-name[img-index="4"] {
    background-image: url(/images/con04_20.png);
}
.con04_dish .img-box.menu-name[img-index="5"] {
    background-image: url(/images/con04_21c.png);
}

.con04_slide02-text-wrap {
    box-sizing: border-box;
    display: flex;
    inset: 0 0 0 0;
    padding: 25rem 18rem 10rem 18rem;
    flex-direction: column;
    gap: 5.2rem;

    color: #fff;

    font-weight: 500;
    line-height: 1.4;

    .slide-text02 {
        align-self: flex-end;
        margin-top: auto;
    }
}

.con04_28 {
    top: 0;
    left: 0;
}

/* con04 slide3 marquee */
.con04_36 {
    bottom: 4rem;
    left: 0;
    width: 84.9rem;
    height: 11rem;
    overflow: hidden;
    border-radius: 0 0 0 2.4rem;

    img {
        padding-left: 4rem;
        animation: marqueeX 20s infinite linear;
    }
}

.gsap-slide:nth-child(3) {
    overflow: visible;
}

.con04 .swiper-container {
    left: -50%;
    width: 100%;
    overflow: hidden;
}

.con04_swiper {
    width: 74.1rem;
    height: 65.2rem;
    float: right;
    overflow: visible;
}

.con04_swiper-name {
    top: 16rem;
    right: 2rem;
}

.con04_slide03-text-wrap {
    left: 50%;
    color: #fff;
    width: 50%;
    flex-direction: column;
    text-align: center;
    gap: 2.4rem;

    line-height: 1.5;
}

.con04_32-wrap {
    div:not(:last-child) {
        margin-right: -2rem;
    }

    .con04_32 {
        z-index: 3;
    }
    .con04_33 {
        z-index: 2;
    }
    .con04_34 {
        z-index: 1;
    }
}

.con04_29 {
    top: 4rem;
    right: 51rem;
}

/* --------------- con05 start -------------- */

.con05 {
    background-color: #000;
    padding: 7rem 0 6.4rem;
    color: #fff;

    font-weight: 500;
    line-height: 1.5;
}

.con05_01 {
    margin: 2rem 0;
}

.con05_box-wrap {
    gap: 0.2rem;
    margin-top: 6.4rem;
}

.con05 .text-wrap {
    inset: 0 0 0 0;
    box-sizing: border-box;
    text-align: center;
    gap: 3.6rem;
}

.con05 .box {
    color: #000;
    background-color: #fff;
    transition:
        color 0.3s,
        background-color 0.3s,
        border-radius 0.3s;
    overflow: hidden;
}
.con05 .box .box-bg {
    line-height: 0;
    opacity: 0;
    transition: opacity 0.3s;
}

.con05 .text-wrap img {
    filter: invert(0);
    transition: filter 0.3s;
}

.con05 .box.hover {
    background-color: #000;
    color: #fff;
    border-radius: 10rem;
    .box-bg {
        opacity: 1;
    }
    .text-wrap img {
        filter: invert(1);
    }
}

.con05_09 {
    background-color: #ff1700;
    padding: 2.4rem 0;
    bottom: 0;

    img {
        animation: marqueeX 20s infinite linear;
    }
}

/* ----------------- con06 start ------------------ */
.con06 {
    height: 84.5rem;
    color: #fff;
}

.con06_bg {
    top: 0;
    left: 0;
}
.con06-wrap {
    z-index: 10;
    margin-top: 14rem;
}

.con06_01 {
    margin-bottom: 3rem;
}

.con06_text01 {
    text-align: center;
    margin-bottom: 6rem;

    line-height: 1.5;
    font-weight: 500;
}

.con06_03 {
    bottom: 0.8rem;
    z-index: 2;

    img {
        animation: marqueeX 20s infinite linear;
    }
}

.con06_bg-fire {
    top: 0;
    left: 0;
    width: 100%;
    mix-blend-mode: screen;
    opacity: 0.7;
}

/* ------------------- con 07 --------------- */
.con07-wrap {
    display: flex;
}

.con07 .con07_text-wrap {
    text-align: center;

    line-height: 1.5;
    font-weight: 500;
    width: 48.1rem;
    height: 76.8rem;
}

.con07_01 {
    z-index: -1;
}

.con07_pot-wrap {
    margin-bottom: 2rem;
}

.con07_02 {
    margin-bottom: 1.2rem;
}

.con07_03 {
    margin-bottom: 3rem;
}

.con07_text {
    margin-bottom: 10rem;
}

.con07_swiper {
    width: calc(100% - 48.2rem);
    margin-left: -0.1rem;
}

.con07_swiper-btns {
    gap: 1.8rem;
    line-height: 0;
    .line {
        width: 2px;
        height: 100%;
        background-color: #000;
    }
    div {
        cursor: pointer;
    }
}

.con07 .swiper-slide {
    width: fit-content;
    padding: 0 4.2rem;
    box-sizing: border-box;
    border: 0.1rem solid #000;
    border-left-width: 0px;

    &:nth-child(1) {
        border-left-width: 0.1rem;
    }
}

.con07 .swiper-slide .con07_06 {
    width: 39.6rem;
    height: 47.9rem;
    img {
        width: 100% !important;
        height: 100% !important;
    }
}

.con07 .swiper-slide .text-wrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 1.6rem;
    margin-top: 3rem;
}

.con07 .swiper-slide .name {
    width: 100%;
    max-width: 39.6rem;
    font-size: 2.4rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.con07 .swiper-slide .desc {
    width: 100%;
    max-width: 39.6rem;
    font-size: 1.3rem;
    font-weight: 500;
    height: 8rem;
    overflow-y: auto;
}
/* -------------------- con08 ------------------ */

.con08_02 {
    width: 100%;
    height: 50rem;
    overflow: hidden;

    img {
        width: 100% !important;
    }
}

.con08-wrap {
    gap: 2.4rem;
    z-index: 1;
}

/* ---------------- con09 -------------------- */

.con09 {
    height: 104.4rem;
}
.con09-bg {
    top: 0;
    left: 0;
}
.con09_01 {
    top: 49rem;
}

.con09-wrap {
    z-index: 10;
    margin-top: 11.4rem;
}

.con09_02 {
    margin-bottom: 1.2rem;
}
.con09_03 {
    margin-bottom: 2.4rem;
}

.con09_text01 {
    font-weight: 500;
    margin-bottom: 2.4rem;
}

.con09_05 {
    top: 50rem;
    pointer-events: none;
}

.con09_06 {
    bottom: 6rem;
    right: 55rem;
    z-index: 15;
}

.con09_swiper {
    z-index: 5;
    inset: 45rem 0 auto 0;
}

.con09_swiper .swiper-slide {
    width: fit-content;
}

.con09_07 {
    margin-top: 2.4rem;
}
.con09_marquee {
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    padding: 2.4rem 0;
    background-color: #000;
    z-index: 2;

    img {
        animation: marqueeX_r 20s infinite linear;
    }
}

/* --------------------- con10 ------------------ */
.con1011 {
    overflow: hidden;
}
.con10 {
    height: 100rem;
    overflow: initial;
    z-index: 1;
}
.con10-bg {
    top: -29rem;
    left: 0;
}

.con10-wrap {
    z-index: 10;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: -1.2rem;
    mask-image: url(/images/con10_02.png);
    mask-size: 192rem;
    mask-position: 0 -29rem;
    mask-repeat: no-repeat;
}

.con10_01 {
    margin-bottom: 5rem;
}

.con10_04 {
    right: 0;
    top: 24rem;
    z-index: 3;
}

.con10_05 {
    margin-bottom: 2.4rem;
}
.con10_text01 {
    margin-bottom: 4.8rem;
    color: #fff;

    font-weight: 500;
}

.con10_06-wrap {
    margin-left: 2rem;
}
.con10_06 {
    margin-right: 1.2rem;
}
.con10_07 {
    z-index: 2;
}
.con10_08 {
    margin-left: -1.2rem;
}
.con10_11 {
    left: 0;
    top: 32rem;
}

.con10_09 {
    top: 16rem;
    left: 35rem;
    z-index: 2;
}

.con10_10 {
    top: 24rem;
    right: 35rem;
}

/* ---------------------- con11 -------------------- */

.con11 {
    height: 112rem;
    overflow: initial;
    --card-gap: 2rem;
}

.con11 .con11-wrap {
    gap: 4rem;
}
.con11_10 {
    top: 21.4rem;
}
.con11_13 {
    top: -50%;
    right: 0;

    img {
        animation: marqueeY 20s infinite linear;
    }
}

.con11_pot-wrap {
    width: fit-content;
    align-items: center;
    margin-bottom: 2.4rem;
    > div {
        width: fit-content;
    }
}

.con11 .title-wrap {
    width: fit-content;
    margin: 0 auto;
}
.con11 .card-container {
    height: fit-content;
    gap: var(--card-gap);
}
.con11 .con11_39-wrap {
    gap: var(--card-gap);
}

.con11 .con11_0411-wrap {
    gap: var(--card-gap);
}

.con11 .con11_04-text-wrap {
    top: 26rem;
}
.con11 .con11_04-text {
    background-color: #fff;
    width: 12rem;
    height: 12rem;
    border-radius: 99rem;
    box-sizing: border-box;
    border: 0.1rem solid #190c00;
}

.con11 .con11_04-text.active {
    background-color: #fff5ad;
}

.con11_06 {
    margin-right: -1.6rem;
}

.con11_08 {
    margin-left: -1.6rem;
}

.con11_12 {
    top: 26.6rem;
    left: 14.4rem;
}

/* ---------------- con12 start ---------------- */

.con12 {
    height: 95rem;
}

.con12 .con12_bg {
    top: 0;
    left: 0;
    right: 0;
}

.con12 .con12-wrap {
    z-index: 1;
    margin-top: 12.8rem;
}

.con12_text01 {
    color: #fff;
    text-align: center;
    margin: 1.8rem 0 5.2rem;

    font-weight: 500;
    line-height: 1.4;
}

.con12 .con12-center {
    width: 146rem;
    margin: 0 auto;
}

.con12 .con12_counter-2-wrap {
    bottom: 1rem;
    left: 0;
}

.con12 .con12_02 {
    bottom: -5rem;
}

.con12 .con12_counter-1-wrap {
    left: 0;
    top: 14rem;
    color: #fff5ac;
}

.con12 .con12_04 {
    top: 13.9rem;
}

.con12 .con12_07 {
    right: 0;
}

.con12_counter-1,
.con12_counter-2 {
    font-size: 8rem;
    line-height: 1;
    font-weight: 800;
}

.con12_counter-2-wrap {
    > .flex {
        align-items: end;
        gap: 0.8rem;
    }
}

.con12_divider {
    border: 0px solid #000;
    border-top-width: 0.1rem;
    border-bottom-width: 0.1rem;
    padding: 1rem 0;
    box-sizing: border-box;
    overflow: hidden;
}

/* --------------------- con13 --------------------- */

.con13-wrap {
    max-width: 148.5rem;
    margin: 0 auto;
    padding: 6.4rem 0 14rem;
    z-index: 2;
    background-color: #fff;
    overflow: hidden;
}

.con13_02 {
    top: 0;
    right: 0;
    z-index: 3;
    pointer-events: none;
}

.con13 .con13-title-wrap {
    margin-left: 21.6rem;
}

.con13_pot {
    margin-bottom: 2rem;
}

.con13_01 {
    justify-content: start;
    margin-bottom: 2.4rem;
}

.con13_03 {
    justify-content: end;
    margin-bottom: 3.6rem;
    margin-right: 4rem;
}

/* con13 arcodian */
.con13 .con13_arcodian {
    margin-bottom: 5.2rem;
    height: 41.4rem;
}
.con13 .arcodian_item {
    background-color: #ffffdd;
    align-items: center;
    height: 7.9rem;
    border: 0px solid #000;
    border-top-width: 0.1rem;
    transition: all 0.3s;

    &:nth-child(4) {
        border-bottom-width: 0.1rem;
    }

    /* when arccodian active */
    &.active {
        background-color: #be0211;
        height: 17.2rem;
        .con13_08h,
        .con13_09h,
        .con13_10h,
        .con13_11h {
            opacity: 1;
            visibility: visible;
            height: 6.3rem;
            top: -1.6rem;
        }
        .con13_08,
        .con13_09,
        .con13_10,
        .con13_11 {
            opacity: 0;
        }
        .con13_04,
        .con13_05,
        .con13_06,
        .con13_07 {
            opacity: 1;
        }
    }
}

/* arcodian numb */
.con13_04,
.con13_05,
.con13_06,
.con13_07 {
    opacity: 0;
    margin-left: -1rem;
    width: 12.8rem;
    justify-content: start;
    transition: all 0.3s;
}

.con13 .arcodian_item-text {
    margin-left: 2.4rem;
}

/* active text */
.con13_08h,
.con13_09h,
.con13_10h,
.con13_11h {
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
    height: 0;
    overflow: hidden;
    transition:
        height 0.6s 0.2s,
        opacity 0.3s,
        visibility 0.3s;
}

.con13_12-wrap {
    margin-left: 14rem;
}
.con13_12 {
    justify-content: start;
    margin-bottom: 2.4rem;
}

.con13-text01 {
    line-height: 1.5;
}
.con13_bg {
    top: 0;
    left: 0;
}
.con13_bg2 {
    top: 0;
    right: 0;
}

/* ------------------ con14 ------------------ */
.con14 {
    background-color: #999;
    height: 84.5rem;
    padding-bottom: 6.2rem;
    --mainImgTop: 35rem;
    --con14Gap: 21rem;
}
.con14_03 {
    top: 5.6rem;
    left: 50%;
    transform: translate(-50%);
    z-index: 2;
}

.con14_04-text {
    margin: 2rem 0 0;
    color: #fff;
}
.con14-wrap {
    height: 100%;
}

.con14_left,
.con14_right {
    flex: 1 1 0;
    height: 100%;
    z-index: 1;
    overflow: hidden;
}

/* left */
.con14_01 {
    left: 0;
    top: 8rem;
}
.con14_left .text-wrap {
    top: 23rem;
    left: var(--con14Gap);
    color: #fff;
    gap: 2.4rem;
}
.con14_left .con14_text {
    opacity: 0.3;
    transition: opacity 0.3s;
}
.con14_left .con14_text.active {
    opacity: 1;
}
.con14_left .con14_text.prev {
    opacity: 0.4;
}
.con14_left .con14_text.next {
    opacity: 0.4;
}

.con14_04 {
    top: var(--mainImgTop);
    right: -30rem;
    margin-top: 0.5rem;
    img {
        width: 60rem !important;
    }
}

.con14_left-counter {
    left: var(--con14Gap);
    bottom: 8rem;
    color: #d4d4d4;

    /* left counter */
    p {
        font-size: 8rem;
        line-height: 1.2;
    }
}

/* right */
.con14_02 {
    right: 0;
    top: 8rem;
}
.con14_05 {
    top: var(--mainImgTop);
    left: -38rem;
}
.con14_08 {
    justify-content: end;
}

.con14_right-counter {
    right: 12.5rem;
    bottom: 8rem;
    color: #fbf8ac;

    /* right counter */
    p {
        font-size: 8rem;
        line-height: 1.2;
    }
}

/* bg */
.con14_bg01,
.con14_bg02 {
    top: 0;
    left: 0;
    z-index: -1;
}

/* con15 */
.con15 {
    margin-top: 4rem;
}
.con15-wrap {
    background-color: #000;
    max-width: 170.8rem;
    width: 100%;
    margin: 0 auto;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    border: 0px solid #000;
    border-left-width: 0.1rem;
    border-right-width: 0.1rem;
    padding-bottom: 4rem;
}

/* con15 swiper */
.con15_swiper {
    pointer-events: none;
    top: 62.3rem;
    left: -10rem;
    z-index: 1;
    overflow-y: visible;
    padding: 5rem 0;
    width: calc(100% + 10rem);
}

.con15 .con15_slide {
    display: flex;
    flex-direction: column;
    width: 40rem;
    height: 32rem;
    color: #fff;
    text-align: center;
    border-radius: 5rem;
    overflow: hidden;
    box-sizing: border-box;
    border: 0.1rem solid #000;
    transition:
        z-index 0.5s 0.2s,
        transform 0.5s 0.2s;

    &.swiper-slide-next {
        transform: rotate(-5deg);
        z-index: 2;
        transition:
            z-index 0.5s 1s,
            transform 0.5s 1s;

        .slide_top {
            background: #d61301;
            transition: all 0.5s 1s;
        }
    }
}

.con15_slide .slide_top {
    background: #000;
    height: 11.4rem;
    transition: all 0.5s;
    width: 100%;
}

.con15_slide .slide_bottom {
    flex: 1 1 0;
    width: 100%;
    background-color: #fff;
    color: #000;
    font-weight: 500;
    line-height: 1.4;

    .slide-text {
        padding: 0 1.6rem;
    }
}

.con15_02 {
    margin: -1.2rem 0 8rem;
}
.con15_03 {
    margin-bottom: 2.4rem;
}

.con15_text01 {
    color: #fff;
    text-align: center;
    line-height: 1.4;
    margin-bottom: 4.8rem;
}

.con15_07 {
    left: 50%;
    bottom: -25%;
    z-index: 1;
    transform: translateX(-50%);
}

.con15_map {
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.con15_bottom {
    margin-top: 72.4rem;
    z-index: 3;
}
.con15_01 {
    left: 4.2rem;
    top: 50%;
    transform: translate(0, -50%);
}
.con15_17 {
    right: 4.2rem;
    top: 50%;
    transform: translate(0, -50%);
}
.con15_text02 {
    z-index: 3;
    text-align: center;
    margin-top: 0.8rem;
}

/* ----------------------- con16 --------------------- */
.con16 {
    align-items: center;
    height: 100.5rem;
}

.con16-wrap {
    z-index: 1;
    padding-top: 13rem;
    overflow: hidden;
    max-width: 170.8rem;
}

.con16_02 {
    margin-bottom: 2.4rem;
}
.con16_text01 {
    margin-bottom: 5.2rem;
    color: #fff;
}

.con16_06 {
    margin: 3.2rem 0 1.2rem;
}
.con16_07 {
    margin-top: 8.2rem;
    padding: 3.4rem 0;
    background-color: #000;

    img {
        animation: marqueeX_r 20s infinite linear;
    }
}

/* ---------------------- con17 ------------------------ */
.con17 {
    padding-bottom: 5rem;
}
/* --------- system ---------- */
.con17_system-wrap {
    padding: 11.2rem 0 5rem;
    z-index: 10;
}
.con17_01 {
    margin-bottom: 1.6rem;
}

.con17 .con17_text-system {
    margin-bottom: 4.2rem;
    text-align: center;
}
.con17 .process {
    flex-wrap: wrap;
    max-width: 140rem;
    margin: 0 auto;
    justify-content: space-between;
    gap: 2.4rem 0;
    margin-bottom: 4rem;

    > div:nth-child(1) {
        z-index: 10;
    }
    > div:nth-child(2) {
        z-index: 9;
    }
    > div:nth-child(3) {
        z-index: 8;
    }
    > div:nth-child(4) {
        z-index: 7;
    }
    > div:nth-child(5) {
        z-index: 6;
    }
    > div:nth-child(6) {
        z-index: 5;
    }
    > div:nth-child(7) {
        z-index: 4;
    }
    > div:nth-child(8) {
        z-index: 3;
    }
}

.con17 .process .arrow_r {
    right: -4.5rem;
    z-index: 1;
}

/* -------- brand ---------- */
.con17_brand-wrap {
    height: 94.3rem;
}
.con17 .brand-con {
    z-index: 3;
    padding-top: 7rem;
}
.con17_16 {
    margin-bottom: 1.8rem;
}
.con17_brand-text {
    margin-bottom: 1.8rem;
}
.con17 .price-info {
    max-width: 100rem;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1.8rem 0;
    margin: 0 auto 1.8rem;
}
.con17_12 {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}
.con17_27 {
    margin-left: -1.2rem;
}
.con17_14 {
    right: -40rem;
}
.con17_15 {
    left: -40rem;
}
.con17 .sticker {
    right: 3rem;
    bottom: -1.4rem;
    z-index: 2;
}

.con17_17,
.con17_18,
.con17_19 {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

    .line {
        display: block;
        position: absolute;
        width: 10rem;
        height: 0.6rem;
        background-color: #d51300;
        margin-top: 6rem;
        z-index: 1;
    }
}

.con17_13 {
    bottom: 3.6rem;
}

/* ------- store --------- */
.con17_store-wrap {
    padding-top: 8rem;
    z-index: 2;
}
.con17 .store-text {
    text-align: center;
    margin: 2.4rem 0 4rem;
}

.con17 #map-wrap {
    max-width: 140rem;
    width: 100%;
    min-height: 59.2rem;
    border-radius: 5rem;
    margin: 0 auto;
    background-color: #fff;
}

.con17 #map div > div > div div > img {
    object-fit: contain !important;
}

/* con17 bg */
.con17_bg {
    top: 0;
    left: 0;
    z-index: 1;
}

/* ------------- con18 ------------- */
/* con17 swiper */
.con18_swiper {
    background-color: #d61301;
    color: #fff;
    padding: 2.4rem 0;
    border-top-width: 0.1rem;
    border-bottom-width: 0.1rem;
}
.con18_slide {
    position: relative;
    padding: 0 2.4rem;
    width: fit-content;
    border: 0px solid #000;

    &::before {
        content: "";
        display: block;
        position: absolute;
        width: 0.3rem;
        height: 0.3rem;
        background-color: #fff;
        border-radius: 9rem;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
    }
}

.con18_slide .grand-open {
    margin-left: 0.4rem;
}
.blind {
    position: absolute;
    width: 0.1rem;
    height: 0.1rem;
    clip: rect(0 0 0 0);
    overflow: hidden;
}

.con18-wrap {
    height: 76.5rem;
    z-index: 10;
}

/* bg */
.con18_bg {
    top: 7.3rem;
    left: 0;
}
.con18_bg02 {
    top: -3rem;
    right: -2rem;
    z-index: 2;
}
.con18_bg03 {
    left: calc(74.2rem / -2);
    z-index: 2;
}
.con18_marquee {
    bottom: 6.2rem;
    z-index: 1;

    img {
        animation: marqueeX_r 20s infinite linear;
    }
}

/* left */
.con18_left {
    top: 14rem;
    left: 39rem;
    z-index: 2;
}

.con18_left .inner {
    padding: 0 2.4rem 2.8rem;
    gap: 2.8rem;
}
.con18_text {
    color: #fff;
    line-height: 1.4;
}

/* form */
.con18 .form {
    background-color: #fff;
    top: 5.2rem;
    right: 37.4rem;
    z-index: 1;
    border-radius: 5rem;
    padding: 11rem 7rem;
    border: 0.1rem solid #000;
}
.con18 .form_margin {
    padding: 0 1rem;
    gap: 1rem;
}

.con18_04 {
    justify-content: start;
    padding-top: 2rem;
}

.con18 .per_Infor_policy {
    margin-left: auto;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 0.4rem;
    text-decoration-thickness: 0.2rem;
}
.form_check_wrap {
    height: 5.2rem;
    gap: 2.4rem;
}
.form_margin_Agree_input {
    padding: 1.6rem 0;
}
.form_submit_div {
    cursor: pointer;
}

/* input custom */
.form_margin_input::after {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    bottom: -0.4rem;
    width: 45.2rem;
    height: 0.1rem;
    background-color: #000;
    z-index: 1;
}
input {
    margin: 0;
    padding: 0;
    border: none;
}

.con18 input::placeholder {
    color: transparent;
}

/* input text */
.con18 input[type="text"] {
    width: 30rem;
    height: 5.2rem;

    padding: 0.8rem;
    box-sizing: border-box;
}
.con18 input[type="text"]:focus {
    outline: none;
}

/* radio */
.con18 input[type="radio"] {
    appearance: none;
    border-radius: 9rem;
    box-sizing: border-box;
    width: 2rem;
    height: 2rem;
    border: 0.2rem solid #000;
    cursor: pointer;
}
.con18 input[type="radio"]:checked {
    border: 0.1rem solid #000;
    outline: 0.1rem solid #fff;
    outline-offset: -0.2rem;
    background-color: #be0211;
}

/* checkbox */
.con18 input[type="checkbox"] {
    width: 2rem;
    height: 2rem;
}
.con18 input[type="checkbox"]:checked {
    appearance: none;
    background-color: #be0211;
    border: 0.1rem solid #000;
    outline: 0.1rem solid #fff;
    outline-offset: -0.2rem;
    cursor: pointer;
    box-sizing: border-box;
    border-radius: 0.2rem;
}

.con18 .checkbox-wrap {
    cursor: pointer;
}

.con18 .form_agree {
    margin-left: 0.4rem;
}

#footer {
    z-index: 1999;
}
#header {
    z-index: 2000;
}

/* 맵시작 */

.map_mid {
    /* width: fit-content; */
    width: 100%;

    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.map {
    background-color: #fff;
    width: 73.021vw;
    height: 30.42vw;
    z-index: 1;
    overflow: hidden;
    border-radius: 2vw;
    border: 0.1vw solid #222;
}

.mid_map_search {
    background: white;
    overflow: hidden;
    z-index: 2;
    width: 18.54vw;
    height: 28.91vw;
    left: 0.87vw;
    border-radius: 1.6vw;
    border: 0.1vw solid #222;
}

.con18_02 {
    align-items: center;
}

.mid_map_search_mid {
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    box-sizing: border-box;

    padding: 1.3vw 1.56vw 0;
}

.map_search_icon {
    width: 1.04vw;

    right: 2.5vw;

    filter: invert(1);

    img {
        width: 100% !important;
    }
}

.mid_map_search_mid input {
    appearance: none;
    border: none;
    outline: none;
    width: 100%;
    height: 3.13vw;
    padding-left: 1.3vw;
    font-size: 0.8vw;
    border-radius: 50vw;
    color: #444;

    border: 0.1vw solid #000;
}

.mid_map_search_mid input::placeholder {
    color: #666;
}

.mid_map_search_bottom {
    overflow-y: scroll;
    overflow-x: hidden;
    height: 23vw;
    width: 99.5%;
}

.mid_map_search_bottom::-webkit-scrollbar {
    width: 0vw;
    height: 0vw;
}

.mid_map_search_item {
    margin: 0% 7%;
    border-bottom: 1px solid #9b9b9b;
    padding: 7% 0;
    font-size: 1vw;
    cursor: pointer;
    pointer-events: all;
}

.infor_div {
    opacity: 0;
    pointer-events: none;
    display: none !important;
}

.mid_map_search_item_title {
    font-size: 0.9vw;
    font-weight: 500;
}

.mid_map_search_item_addres {
    margin-top: 4%;
    margin-bottom: 1%;
    font-size: 0.7vw;
}

.mid_map_search_item_tel {
    font-size: 0.7vw;
}

.map_icon {
    width: 1.4583vw;
    right: 8%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.map_plus {
    width: 1.7vw;
    filter: invert(1);
    top: 1.3vw;
    right: 0vw;
    transition: 0.4s;
}

.map_plus img {
    width: 100% !important;
}

.map_plus:hover {
    transform: rotate(180deg);
}

/*popup*/
.fixed_popup {
    position: fixed;

    width: 100vw;
    height: 100vh;

    top: 0;

    background: #00000099;
    z-index: 999999999999;

    display: flex;
    justify-content: center;
    align-items: center;
}

div.popup {
    width: 47%;
    height: 19vw;
    /* border: 1px solid black; */
    background-color: #fff;
    box-sizing: border-box;
    gap: 3vw;
    justify-content: space-between;
    border-radius: 0.3vw;
    overflow: hidden;

    display: flex;
}

.popup_top {
    font-size: 1.5vw;
    width: 88%;
    padding-bottom: 3%;
    text-align: center;
    border-bottom: 1px solid #0000002e;
}

.popup > p:nth-child(2) {
    font-size: 1.3vw;
    width: 88%;
    margin-top: 5%;
    padding-bottom: 2%;
    text-align: left;
}

.popup > p:nth-child(4) {
    font-size: 0.9vw;
    width: 88%;
    margin-top: 1%;
}

.popup > p:nth-child(5) {
    left: 42%;
    width: 58%;
    padding-right: 8%;
    height: 12vw;
    top: 43%;
    box-sizing: border-box;
    font-size: 0.9vw;
    overflow-y: scroll;
}

.popup_right_1st {
    color: #e3c179;
    width: 78%;
    margin-bottom: 1%;
    text-align: left;
    justify-content: flex-start;
    align-items: flex-start;
    font-size: 1.2vw;
    margin-top: -6%;
}

.popup_right > div > div:nth-child(2) {
    width: 65%;
    font-weight: 400;
    font-size: 0.85vw;
    color: #333;
}

.popup_right > div {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    color: #000;
    margin-top: 3.5%;
}

.popup_right_left_txt {
    width: 18%;
    font-weight: 600 !important;
    font-size: 0.85vw !important;
    color: #000;
    position: relative;
    margin-right: 3.7%;
}

.popup_right_left_txt::after {
    content: "";
    position: absolute;
    right: 0;
    top: 31%;

    width: 1px;
    height: 50%;
    background: #c3c3c3;
}

.popup_right {
    width: 46%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    color: #000;
    margin-top: -4%;
}

.popup_img img {
    width: 100%;
}

.fixed_popup_con {
    width: 62%;
    height: 49%;
    background-color: #000;
    top: 31%;
    left: 20%;
    border-radius: 1vw;
}

.popup_img {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 0;
    height: 100%;
    overflow: hidden;
}

.popup_img img {
    width: 108%;
}

.popup_top_absol {
    width: 12.4369%;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 12%;
    left: 10%;
}

.popup_top_absol_2nd {
    width: 96.6687%;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 21%;
    left: 1.5%;
}

.popup_img_con {
    position: static !important;
    overflow: hidden;
}

.popup_right_6th_left {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    right: 3%;
    bottom: 6%;
}

.popup_right_6th_left::after {
    content: "";
    width: 0%;
    height: 0.02vw;

    position: absolute;
    bottom: -0.2vw;
    left: 0;

    background: #000;
    transition: width 0.3s;
}

.popup_img_con {
    overflow: hidden;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup_img_con img {
    height: 100%;
    object-fit: cover;
}

.popup_top_absol {
    width: 12.4369%;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 18%;
    left: 52.5%;
}

.popup_right_2nd {
    font-weight: 500;
    width: 100%;
    font-size: 1.36vw;
    padding-bottom: 4%;
    box-sizing: border-box;
    font-family: "pretendard variable";
}

.popup img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.popup_close {
    width: 2vw;
    height: 2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 5%;
    right: 2%;
    cursor: pointer;
    border-radius: 50%;
    transition: transform 0.3s ease-in-out;
}

.popup_close .absol {
    width: 60%;
    height: 2px;
    background-color: #000;
}

.popup_close .absol:nth-child(1) {
    transform: rotate(45deg);
}

.popup_close .absol:nth-child(2) {
    transform: rotate(-45deg);
}

div.popup_logo {
    width: 17.156%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1vw;
}

@media screen and (min-width: 600px) {
    .popup_close:hover {
        transform: rotate(180deg);
    }

    .popup_right_6th_left:hover::after {
        width: 100%;
    }
}

/* 로딩 */
.loading-overlay {
    position: fixed; /* 화면 전체를 덮도록 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* 반투명 검은색 배경 */
    z-index: 9999; /* 다른 요소들보다 위에 표시 */
    display: flex;
    justify-content: center;
    align-items: center;
}

.loading-spinner {
    width: 50px;
    height: 50px;
    border: 5px solid #f3f3f3; /* 회색 테두리 */
    border-top: 5px solid #ec471a; /* 브랜드 메인색상 */
    border-radius: 50%;
    animation: spin 1s linear infinite; /* 회전 애니메이션 */
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
