section {
    overflow: hidden;
    width: 100%;
}

.main::after {
    width: 1vw;
    height: 0vw;
    position: absolute;
    top: 0;
    pointer-events: none;
    opacity: 0;
    pointer-events: none;
}
.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 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.webp) no-repeat center / contain;
    }

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

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

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

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

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

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

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

    80% {
        background: url(/images/con08_11.webp) no-repeat center / contain;
    }
    100% {
        background: url(/images/con08_07.webp) 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;
    }
}

.animate-blk {
    animation: blk 1s infinite ease-in-out;
}
.scaleOpa {
    animation: scaleOpa infinite 2s;
}
.scaleOpa2 {
    animation: scaleOpa2 infinite 2s;
}
.light {
    animation: light infinite 5s;
}
.rotate_img {
    animation: rotate_image 10s infinite linear;
}
.image_sd {
    animation: marqueeX 20s infinite linear;
}
.image_sd_r {
    animation: marqueeX_r 20s infinite linear;
}
.slide_y {
    animation: marqueeY 20s infinite linear;
}
.slide_y_r {
    animation: marqueeY_r 20s infinite linear;
}

/* ------------------------- 퍼블시작 ------------------------- */

body {
    font-family: var(--font-family);
    font-size: var(--bodyXS);
    min-height: 0vw;
    letter-spacing: -0.05em;
    line-height: 1.5;
    font-weight: 500;

    overflow-x: hidden;
}

.yellow {
    color: #fce969;
}
.primary {
    color: var(--primary);
}
.beige {
    color: #eebb84;
}
.smoke {
    animation: smoke 5s infinite;
    top: -25%;
}
/* ------------------------- main start ------------------------- */
.main {
    padding-top: var(--headerH);

    height: 100%;

    color: #fff;
    background-color: #000;
}

.main .pagination_wrap {
    width: 30rem;
    height: 7rem;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.65);
    border-radius: 3rem 3rem 0 0;
    z-index: 2;
    font-size: 2.5rem;
}
.main .swiper-pagination {
    position: static;
    width: fit-content;
}
.main .swiper-pagination-bullet {
    background-color: #fff;
    opacity: 1;
    border-radius: 99px;
    transition: all 0.3s;
    width: 1.2rem;
    height: 1.2rem;
    margin: 0 !important;
    will-change: width;
}
.main .swiper-pagination-bullet-active {
    background-color: #cd0138;
    width: 2.8rem;
}
.main .swiper-slide {
    width: 100%;
    height: 89rem;
    overflow: hidden;
    flex-shrink: 0;
}

/* slide 1 */
.main .swiper-slide.s1 {
    background: url(/images/main_05.webp) no-repeat center/cover;

    .left {
        top: 21.4rem;
        left: 24.4rem;
    }
    .s1__text-01 {
        font-size: var(--titleL);
        font-weight: 800;
    }
    .s1__text-02 {
        font-size: var(--bodyL);
    }

    .main_02 {
        left: 100rem;
        bottom: 0;
    }
    .main_03 {
        top: 43.7rem;
        left: 154rem;
    }
    .main_04 {
        top: 24rem;
        left: 73rem;
    }
}

.main .swiper-slide.s2 {
    background: url(/images/main_09.webp) no-repeat center/cover;

    .text-wrap {
        top: 13.8rem;
        font-size: var(--bodyL);
    }
    .main_fire {
        inset: 0 0 0 0;
        mix-blend-mode: screen;
        opacity: 0.7;
    }
    .main_08 {
        bottom: 0;
    }

    .main_07 {
        bottom: -50%;
    }
}

.main .swiper-slide.s3 {
    background: #290009;

    .main_10 {
        top: 21.4rem;
        left: 24.4rem;
    }
    .main_11 {
        bottom: -20rem;
    }
    .main_12 {
        bottom: 15rem;
    }
    .main_13 {
        bottom: -26rem;
        left: 38rem;
    }
    .main_14 {
        bottom: 0;

        img {
            animation: marqueeX 10s infinite linear;
        }
    }
    .main_15 {
        right: 0;
    }
    .main_16 {
        top: 12rem;
    }
    .s3__text {
        top: 56rem;
        right: 20rem;
        font-size: var(--bodyL);
        line-height: 1.8;
    }
}

.main .swiper-slide.s4 {
    background: url(/images/main_21.webp) no-repeat center/cover;

    .s4__text {
        top: 13rem;
    }
    .s4__text .head {
        font-size: var(--titleL);
        font-weight: 800;
    }
    .s4__text .body {
        font-size: var(--bodyL);
    }

    .main_20 {
        bottom: -13rem;
    }
    .main_18 {
        left: 9.5rem;
        top: 25rem;
    }
    .main_19 {
        right: 9.5rem;
        top: 16rem;
    }
}

.main .swiper-slide.s5 {
    background: url(/images/main_30.webp) no-repeat center/cover;

    .s5__text {
        width: 103.2rem;
        height: 61.8rem;
        background-color: #cd0138;
        border-radius: 50%;

        font-size: var(--bodyL);
    }

    /* text-bubble */
    .main_25 {
        top: 52rem;
        left: 39rem;
    }
    .main_26 {
        top: 26rem;
        left: 30rem;
    }
    .main_27 {
        top: 63rem;
        left: 20rem;
    }

    .main_28 {
        left: 13rem;
    }
    .main_29 {
        right: 13rem;
    }
    .main_22 {
        right: 9rem;
        bottom: -38rem;
    }
}

.main .swiper-slide.s6 {
    background: url(/images/main_35.webp) no-repeat center/cover;

    .s6__text {
        font-size: var(--bodyL);
    }
}

/* ---------------------con01-------------------------- */
.con01 {
    background: url(/images/con01_07.webp) no-repeat center/cover;
    color: #fff;
    padding: 13.3rem 0 27.3rem;
}

.con01_06.left {
    top: 0;
    left: 3rem;
}
.con01_06.right {
    top: 0;
    right: 3rem;
}

.con01__head {
    font-size: var(--titleM);
}

.con01__body {
    font-size: var(--bodyS);
    padding: 6.4rem 22rem;
    background-color: #000;
    border-radius: 2.4rem;
}

.con01__body .subhead {
    font-size: var(--headS);
}

.con01_05 {
    bottom: -4.7rem;
}
.con01-1 {
    overflow: visible;
}
.con01_bubble {
    font-size: var(--subhead);
    color: #000;
    right: 44rem;
}

.con01_ct {
    font-size: 27rem;
    bottom: 0;
    letter-spacing: 0;
    color: #eebb84;
    mix-blend-mode: soft-light;
}

/* ----------------------con02--------------------- */
.con02 {
    height: 90rem;
}

/* left */
.con02 .left {
    background: url(/images/con02_01.webp) no-repeat center/cover;
    color: #fff;
    flex: 1 1 0;
    max-width: 50%;

    .con02_left_text {
        top: 20rem;
        left: 20rem;
        width: fit-content;
    }

    .head {
        font-size: var(--titleL);
    }

    .body {
        font-size: var(--bodyL);
    }

    .con02_02 {
        bottom: -30rem;
        left: 20rem;
    }
}

/* right */
.con02 .right {
    flex: 1 1 0;
    background: url(/images/con02_12.webp) no-repeat center/cover;
    max-width: 50%;

    .head {
        font-size: var(--headM);
    }

    .body {
        font-size: calc(var(--bodyM) - 0.1rem);
    }

    .con02_swiper {
        padding: 16rem 0 11rem 12rem;
        user-select: none;
    }

    .swiper-slide {
        width: fit-content;
        align-items: start;
        transition: filter 0.3s;
    }
    .swiper-slide-prev {
        filter: blur(4px) opacity(0);
        transition: filter 0.3s;
    }

    .swiper-slide .card_img {
        width: 100%;
    }

    .card__text {
        padding: 0 0 0 1.2rem;
        box-sizing: border-box;
    }

    .card_numb {
        top: 28rem;
        right: 3rem;
    }
    .swiper-btns {
        bottom: 0rem;
    }
    .con02_swiper-left {
        transform: scaleX(-1);
    }
}

/* -------------------------con03----------------------------- */

.con03 {
    background: url(/images/con03_07.webp) no-repeat center/cover;
    padding-top: 12.6rem;
}

.con03__head {
    max-width: 168rem;
}

.con03__head .lines {
    flex: 1 1 0;
    height: 12px;
    border: 1px solid black;
    border-left-width: 0px;
    border-right-width: 0px;
}

.con03__head .head {
    font-size: var(--titleL);
}

.con03 .body {
    font-size: var(--bodyM);
}

.con03 .card video {
    width: 36.2rem;
    max-height: 52rem;
    overflow: hidden;
    border-radius: 3rem;
}

.con03 .card {
    filter: brightness(0.3) grayscale(1);

    transition: filter 0.3s;

    &.active {
        filter: brightness(1) grayscale(0);
    }

    .card_title {
        top: -5rem;
        left: 11.4rem;
        opacity: 0;
        transform: translateY(100%);

        transition:
            transform 0.3s,
            opacity 0.3s;
    }

    &.active .card_title {
        transform: translateY(0%);
        opacity: 1;
    }

    .card_text {
        font-size: var(--titleM);
        color: rgba(255, 255, 255, 0.8);
        font-weight: 700;
        transition:
            transform 0.3s,
            opacity 0.3s;
    }

    &.active .card_text {
        transform: translateY(0%);
        opacity: 0;
    }
}

.con03 .con03_mq {
    padding: 5.5rem 0;
    width: 100% !important;
    overflow: hidden;
    background: url(/images/con03_08.webp) no-repeat center / cover;

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

.con03_06 {
    bottom: -44.5rem;
}
.con03_06-t {
    top: 25rem;
    color: #fff;
    font-size: 8.5rem;
}

.con03-1 {
    height: 47.5rem;
}

.con03_10 {
    filter: brightness(0.3);
}

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

.con04 {
    background: url(/images/con04_06.webp) no-repeat center/cover;
    padding: 13rem 0 20rem;
    color: #fff;
}

.con04__head .head {
    font-size: var(--titleM);
}

.con04__head .body {
    font-size: var(--bodyM);
}

.con04_05_01 {
    top: 15.6rem;
    right: 1.2rem;
}

.con04 .b1 {
    width: 28.6rem;
    height: 28.6rem;
    top: 16rem;
    left: 14rem;
}
.con04 .b2 {
    width: 28.6rem;
    height: 28.6rem;
    top: 16rem;
    right: 11rem;
}
.con04 .bubble {
    transition: color 0.3s;
    .con04_01 {
        opacity: 0;
        transition: all 0.3s;
    }
    .con04_02 {
        transition: all 0.3s;
    }

    &.active {
        color: #eebb84;
        .con04_01 {
            opacity: 1;
        }
        .con04_02 {
            opacity: 0;
        }
    }
}

.con04 .bubble-text {
    font-size: 5.6rem;
    white-space: nowrap;
}

.con04 .card {
    overflow: hidden;
}

/* ---------------------con05------------------------ */
.con05 {
    background: url(/images/con05_05.webp) no-repeat center/cover;
    padding: 10rem 0 17.5rem;
}

.con05__head .title {
    font-size: 4.2rem;
}

.con05__head .head {
    font-size: var(--titleM);
}

.con05__head .body {
    font-size: var(--bodyM);
}

.con05_swiper {
    padding: 2rem 0;
    user-select: none;
}
.con05 .swiper-slide {
    background: url(/images/con05_02.webp) no-repeat center/cover;
    width: 68.7rem;
    height: 42.8rem;
    color: #fff;
    border-radius: 2.4rem;
    outline: 1px solid transparent;

    transition:
        background 0.3s,
        border-radius 0.5s,
        outline-offset 0.3s,
        outline 0.3s;
    transition-delay: 0.4s;
}
.con05 .slide__head {
    font-size: 3.8rem;
}
.con05 .body__subhead {
    font-size: var(--headS);
}
.con05 .body__desc {
    font-size: var(--bodyM);
}

.con05 .swiper-slide-active {
    outline: 1px solid #000;
    outline-offset: 1.2rem;

    transition:
        background 0.3s,
        border-radius 0.5s,
        outline-offset 0.3s,
        outline 0.3s;
    transition-delay: 0.4s;
}
.con05_06 {
    top: 0;
}
.con05 .swiper-btns {
    top: 22rem;
    left: 48.8rem;
    gap: 82rem;
    z-index: 2;

    .left {
        transform: scaleX(-1);
        pointer-events: all;
    }
    .right {
        pointer-events: all;
    }
}
.con05_03 {
    bottom: -33%;
}

/* ---------------------con06------------------------- */
.con06 {
    background: url(/images/con06_11.webp) no-repeat center/cover;
    color: #fff;
    padding: 19rem 0 0;
}
.con06 {
    .bubble {
        position: relative;
        .absol_cover {
            background: radial-gradient(rgba(104, 35, 1, 0.2), #682301);
            border-radius: 50%;
        }
        > img {
            position: relative;
            z-index: 1;
        }
    }
}
.con06__head .head {
    font-size: var(--titleM);
}

.con06__head .body {
    font-size: var(--bodyM);
}

.con06_07 {
    margin: -1.6rem auto 0 !important;
}
.con06 .swiper-slide {
    width: fit-content;
    height: fit-content;
    max-width: 30rem;
    overflow: hidden;
    border-radius: 2.4rem;
}
.con06_swiper-1 {
    left: 6rem;
    top: 0px;
}
.con06_swiper-2 {
    right: 6rem;
    top: 0px;
}
.con06_08 {
    top: 72rem;
    left: 118rem;
}
.con06_09 {
    top: 78rem;
    left: 64rem;
}
.con06_10 {
    top: 68rem;
    left: 70rem;
}

/* ----------------------con07------------------------- */
.con07 {
    background: url(/images/con07_05.webp) no-repeat center/cover;
    padding: 13rem 0 15rem;
    color: #fff;
}

.con07__head .head {
    border-top: 1px solid #826547;
    border-bottom: 1px solid #826547;
}
.con07__head .h_box {
    width: 18rem;
    height: 18rem;
    border-left: 1px solid #826547;
    font-size: var(--titleM);

    &:last-of-type {
        border-right: 1px solid #826547;
    }
}
.con07__head .body {
    font-size: var(--bodyM);
}

.con07 .swiper-slide {
    img {
        transform: scale(0.6);
        filter: blur(4px);
        transition:
            filter 0.3s,
            transform 0.3s;
    }
}
.con07 .swiper-slide-active {
    z-index: 2;

    img {
        transform: scale(1);
        filter: blur(0);
        transition:
            filter 0.3s,
            transform 0.3s;
    }
}

.con07 .swiper-bullet-wrap {
    font-size: 3.8rem;

    .line {
        width: 2.8rem;
        height: 0.6rem;
        background-color: #e3b27e;
    }
}

.con07_03 {
    top: 18.5rem;
    left: 127rem;
}
.con07_04 {
    top: 37rem;
    left: 39rem;
}

/* --------------------con08------------------------ */
.con08 {
    background: url(/images/con08_03.webp) no-repeat center/cover;
    padding: 16rem 0 6rem;
}
.con08__head .head {
    font-size: var(--titleM);
}
.con08__head .body {
    font-size: var(--bodyM);
}
.con08_swiper {
    padding: 0 2.8rem;
    box-sizing: border-box;
}
.con08 .swiper-slide {
    width: 35rem;
    height: 20rem;
    font-size: 2.5rem;
    color: #fff;
    background-color: #271608;
    border-radius: 3rem;
}

.con08_02 {
    bottom: 6rem;
    left: 50%;
    transform: translateX(-50%);
}

/* ---------map------------ */

.con08 .map-wrap {
    width: 73.021vw;
    height: 30.42vw;
    margin: 0 auto !important;
    overflow: hidden;
    border-radius: 2vw;
}

.con08 #map {
    border-color: var(--secondary);
}
.con08 .mid_map_search_bottom {
    height: 100%;
    width: 100%;
    box-sizing: border-box;
}
.con08 .mid_map_search {
    width: 18.54vw;
    height: 100%;
    left: 0;
    top: 0;
    border: none;
    border-right: 1px solid var(--secondary);
    border-radius: 0;
}
.con08 .mid_map_search_mid {
    display: none;
}
.con08 .mid_map_search_item {
    margin: 0;
    border-bottom: 1px solid #e4d4d5;
    padding: 7% 64px;
    font-size: 1vw;
    cursor: pointer;
    pointer-events: all;
}
.con08 .map_plus {
    display: none;
}

/* -------------------con09-------------------- */
.con09 {
    background: url(/images/con09_03.webp) no-repeat center/cover;
    color: #fff;
    height: 100vh;
}

.con09__left {
    padding: 21rem 0 0 24rem;
}

.con09 .left__head {
    font-size: var(--subhead);
}

.con09 .left__title {
    font-size: var(--titleM);
}

.con09 .left__body {
    font-size: var(--bodyM);
}

.con09 .left_call {
    background: #ed4f01;
    border-radius: 999px;
    width: 40rem;
    height: 8.5rem;
    font-size: 4.7rem;
}

.con09__right {
    top: 0;
    bottom: 0;
    right: 6rem;
    background-color: #fff;
    color: #000;
}

/* form */
.con09 .form {
    padding: 0 11rem;
}

.con09 .form__item {
    height: 8rem;
    font-size: var(--bodyM);
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.con09 input {
    width: 31.2rem;
}

.con09 input[type="text"] {
    height: 72%;
    border-radius: 1rem;
    &:focus {
        background-color: #eaeaea;
    }
}

.con09 .item__name {
    font-family: "Paperlogy";
    display: flex;

    &::before {
        content: "*";
        color: #ed4f01;
        display: inline-flex;
        align-self: center;
        margin-right: 0.6rem;
        line-height: 0;
        font-family: "SfHambakneun";
    }
}

.con09 .form_check_name {
    color: #000;

    pointer-events: none;
}

.con09 .checkbox {
    appearance: none;
    border: none;
    stroke: none;
    outline: none;
    background-color: #eaeaea;
    width: 15rem;
    height: 4.2rem;
    border-radius: 1rem;

    &:checked {
        border: none;
        stroke: none;
        outline: none;
        background-color: #000;

        + label {
            color: #fff;
        }
    }
}

/* select */
.con09 select {
    width: 15rem;
    height: 4.2rem;
    font-weight: inherit;
    font-family: inherit;
    font-size: inherit;
    border: none;
    stroke: none;
    appearance: none;
    background-color: #eaeaea;
    border-radius: 1rem;
    box-sizing: border-box;
    padding: 0 3rem 0 2rem;
    cursor: pointer;
    text-overflow: ellipsis;

    &:focus {
        border: none;
        outline: none;
    }
}

.con09 .chevron_size,
.con09 .chevron_si {
    top: 50%;
    left: 11.7rem;
    translate: 0 -50%;
}
.con09 .chevron_store,
.con09 .chevron_gu {
    top: 50%;
    right: 0.8rem;
    translate: 0 -50%;
}

/* agree */
.con09 .footeer_agree_checkbox_01 {
    width: 2rem;
    height: 2rem;
    border-radius: 0;

    &:checked {
        outline: var(--stroke-width) solid #fff !important;
    }
}
.con09 .form_submit_div {
    background-color: var(--tertiary);
    padding: 1.2rem 0;
    font-size: var(--bodyL);
    border-radius: 1rem;
    box-sizing: border-box;
    margin-top: 2.4rem !important;
}

.con09_04 {
    bottom: -23rem;
    left: 41rem;
    z-index: 1;
}