/* =========================================================
   YEON VENDOR / GALLERY SECTIONS
========================================================= */

.yeon-vendor-section {
    position: relative !important;
    padding: 76px 0 84px !important;
    overflow: hidden !important;
}

.yeon-vendor-section .vendor-inner {
    width: min(1600px, calc(100% - 56px)) !important;
    max-width: 1600px !important;
    margin: 0 auto !important;
}

.vendor-hall {background: #fffbf2 !important; }

.vendor-studio {
    background: #e3ebff !important;
}

.vendor-honeymoon {
    background: #7cbdff !important;
}

.vendor-dress,
.vendor-movie{
    background: #ffffff !important;
}

.vendor-brand {
    background: #fffbf2 !important;
}


.vendor-head {
    display: grid !important;
    grid-template-columns: 370px 1fr !important;
    gap: 36px !important;
    align-items: end !important;
    margin-bottom: 30px !important;
}

.vendor-title {
    text-align: left !important;
}

.vendor-title p {
    margin: 0 0 6px !important;
    color: #111111 !important;
    font-family: Georgia, 'Times New Roman', serif !important;
    font-size: 19px !important;
    line-height: 1.1 !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
}

.vendor-studio .vendor-title p{
    color: #111 !important;
}

.vendor-dress .vendor-title p {
    color: #9eacd6 !important;
}

.vendor-brand .vendor-title p {
    color: #dbcfb4 !important;
} 

.vendor-title h3 {
    margin: 0 !important;
    color: #111111 !important;
    font-size: 60px !important;
    line-height: 1.22 !important;
    letter-spacing: -0.015em !important;
}

#weddingdress .vendor-title h3 strong {
	color:#8b9cd7 !important;
}

.vendor-title h3 strong {
    display: block !important;
    color: #111111 !important;
    /* font-size: 65px !important; */
    line-height: 1.14 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}



.vendor-studio .vendor-title h3,
.vendor-honeymoon .vendor-title h3 {
    color: #ffffff !important;
    font-weight: 800 !important;
}

.vendor-studio .vendor-title h3 strong{
    color: #111 !important;
}

.vendor-studio .vendor-title h3 .vendor-hot-label {
    color: #aeb9df !important;
    font-family: inherit !important;
    font-weight: 800 !important;
}

.vendor-movie .vendor-title h3 strong{
    color: #aeb9df !important;
}

.vendor-brand .vendor-title h3 strong {
    color: #dbcfb4  !important;
}

.vendor-honeymoon .vendor-title h3 strong {
    color: #111111 !important;
}

.vendor-tabs {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
}

.vendor-tabs button {
    min-width: 110px !important;
    height: 45px !important;
    padding: 0 16px !important;
    border: 1px solid #dce2ee !important;
    background: #ffffff !important;
    color: #333333 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    border-radius: 0 !important;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease !important;
}

#weddinghall .vendor-tabs button {
    border: 1px solid #e5dcc8 !important;
}

.vendor-tabs button:hover {
    transform: translateY(-2px) !important;
    border-color: #aeb9df !important;
}

.vendor-tabs button.is-active {
    background: #aeb9df !important;
    border-color: #aeb9df !important;
    color: #ffffff !important;
}

#weddinghall .vendor-tabs button.is-active {
    background: #333 !important;
    border-color: #333 !important;
    color: #ffffff !important;
}

#weddinghall .vendor-tabs button:hover {
    transform: translateY(-2px) !important;
    border-color: #111 !important;
}

#best-brand .vendor-tabs button.is-active {
    background: #333 !important;
    border-color: #333 !important;
    color: #ffffff !important;
}

#best-brand .vendor-tabs button:hover {
    transform: translateY(-2px) !important;
    border-color: #111 !important;
}

.vendor-tabs-dark button.is-active {
    background: #111111 !important;
    border-color: #111111 !important;
    color: #ffffff !important;
}

.brand-tabs {
    justify-content: flex-end !important;
}

.vendor-grid {
    display: grid !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.vendor-grid-5 {
    grid-template-columns: repeat(5, 1fr) !important;
}

.vendor-grid-4 {
    grid-template-columns: repeat(4, 1fr) !important;
}

.vendor-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    /* min-height: 320px !important; */
    background: #ffffff !important;
    overflow: hidden !important;
    opacity: 1 !important;
    transform: scale(1) !important;
    transition: opacity 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease !important;
}

.vendor-card.is-hidden {
    display: none !important;
}

.vendor-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 16px 28px rgba(85, 95, 130, 0.12) !important;
}

.vendor-card img {
    position: absolute !important;
    inset: 0 0 46px 0 !important;
    width: 100% !important;
    height: calc(100% - 46px) !important;
    object-fit: cover !important;
    z-index: 1 !important;
}

.vendor-card strong {
    position: relative !important;
    z-index: 2 !important;
    height: 46px !important;
    background: #ffffff !important;
    color: #111111 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
}

.vendor-card-large {
    /* min-height: 600px !important; */
}

.vendor-brand .vendor-card {
    /* min-height: 320px !important; */
    background: #fafafa !important;
}

.vendor-brand .vendor-card img {
    object-fit: cover !important;
    /*padding: 40px 36px 60px !important;*/
    background: #fafafa !important;
}

/* 드레스 화살표 */
.vendor-arrows {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 0 !important;
    margin-top: 28px !important;
}

.vendor-arrows button {
    position: relative !important;
    width: 34px !important;
    height: 34px !important;
    border: 1px solid #b9bdc7 !important;
    background: #ffffff !important;
}

.vendor-arrows button + button {
    margin-left: -1px !important;
}

.vendor-arrows button::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 10px !important;
    height: 10px !important;
    border-top: 1px solid #777 !important;
    border-left: 1px solid #777 !important;
}

.vendor-arrows button:first-child::before {
    transform: translate(-35%, -50%) rotate(-45deg) !important;
}

.vendor-arrows button:last-child::before {
    transform: translate(-65%, -50%) rotate(135deg) !important;
}

/* 혼수 버튼 */
.honsu-benefit-btn {
    position: relative !important;
    width: 220px !important;
    height: 50px !important;
    margin: 34px auto 0 !important;
    background: #c5baa0 !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
    transition: transform 0.25s ease, background 0.25s ease !important;
}

.honsu-benefit-btn:hover {
    background: #111111 !important;
    transform: translateY(-4px) !important;
}

.honsu-benefit-btn span {
    font-size: 25px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
}

/* 등장 모션 */
.yeon-vendor-section.is-visible .vendor-card {
    animation: vendorCardUp 0.55s ease both !important;
}

.yeon-vendor-section.is-visible .vendor-card:nth-child(1) { animation-delay: 0.03s !important; }
.yeon-vendor-section.is-visible .vendor-card:nth-child(2) { animation-delay: 0.06s !important; }
.yeon-vendor-section.is-visible .vendor-card:nth-child(3) { animation-delay: 0.09s !important; }
.yeon-vendor-section.is-visible .vendor-card:nth-child(4) { animation-delay: 0.12s !important; }
.yeon-vendor-section.is-visible .vendor-card:nth-child(5) { animation-delay: 0.15s !important; }

@keyframes vendorCardUp {
    0% {
        opacity: 0;
        transform: translateY(24px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 반응형 */
@media (max-width: 1200px) {
    .vendor-head {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .vendor-tabs {
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
    }
}

@media (max-width: 900px) {
    .vendor-grid-5 {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .vendor-grid-4 {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .vendor-title h3 {
        font-size: 40px !important;
    }

    .vendor-title h3 strong {
        /* font-size: 46px !important; */
    }
}

@media (max-width: 600px) {
    .yeon-vendor-section {
        padding: 56px 0 62px !important;
    }

    .yeon-vendor-section .vendor-inner {
        width: calc(100% - 28px) !important;
    }

    .vendor-grid-5,
    .vendor-grid-4 {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .vendor-card {
        min-height: 180px !important;
    }

    .vendor-card-large {
        min-height: 300px !important;
    }

    .vendor-tabs button {
        min-width: calc(50% - 4px) !important;
        font-size: 12px !important;
    }

    .vendor-title h3 {
        font-size: 34px !important;
    }

    .vendor-title h3 strong {
        /* font-size: 38px !important; */
    }
}

/* =========================================================
   VENDOR SLIDER - 웨딩샵 / 스튜디오 / 허니문
========================================================= */

.vendor-dress .vendor-slider-wrap,
.vendor-studio .vendor-slider-wrap,
.vendor-honeymoon .vendor-slider-wrap {
    width: 100% !important;
    overflow: hidden !important;
    position: relative !important;
}

.vendor-dress .vendor-slide-track,
.vendor-studio .vendor-slide-track,
.vendor-honeymoon .vendor-slide-track {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 12px !important;
    transition: transform 0.55s cubic-bezier(.22, .8, .25, 1);
    will-change: transform !important;
}

.vendor-dress .vendor-slide-track .vendor-card,
.vendor-studio .vendor-slide-track .vendor-card,
.vendor-honeymoon .vendor-slide-track .vendor-card {
    flex: 0 0 calc((100% - 36px) / 4) !important;
    min-width: calc((100% - 36px) / 4) !important;
}

.vendor-dress .vendor-slide-track .vendor-card.is-hidden,
.vendor-studio .vendor-slide-track .vendor-card.is-hidden,
.vendor-honeymoon .vendor-slide-track .vendor-card.is-hidden {
    display: none !important;
}

/* 우측 아래 화살표 */
.vendor-dress .vendor-arrows,
.vendor-studio .vendor-arrows,
.vendor-honeymoon .vendor-arrows {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 0 !important;
    margin-top: 28px !important;
}

.vendor-dress .vendor-arrows button,
.vendor-studio .vendor-arrows button,
.vendor-honeymoon .vendor-arrows button {
    position: relative !important;
    width: 48px !important;
    height: 48px !important;
    border: 1px solid #b9bdc7 !important;
    background: #ffffff !important;
    border-radius: 0 !important;
    transition: background 0.25s ease, border-color 0.25s ease !important;
}

.vendor-dress .vendor-arrows button + button,
.vendor-studio .vendor-arrows button + button,
.vendor-honeymoon .vendor-arrows button + button {
    margin-left: -1px !important;
}

.vendor-dress .vendor-arrows button::before,
.vendor-studio .vendor-arrows button::before,
.vendor-honeymoon .vendor-arrows button::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 14px !important;
    height: 14px !important;
    border-top: 2px solid #777d8c !important;
    border-left: 2px solid #777d8c !important;
}

.vendor-dress .vendor-prev::before,
.vendor-studio .vendor-prev::before,
.vendor-honeymoon .vendor-prev::before {
    transform: translate(-35%, -50%) rotate(-45deg) !important;
}

.vendor-dress .vendor-next::before,
.vendor-studio .vendor-next::before,
.vendor-honeymoon .vendor-next::before {
    transform: translate(-65%, -50%) rotate(135deg) !important;
}

.vendor-dress .vendor-arrows button:hover,
.vendor-studio .vendor-arrows button:hover,
.vendor-honeymoon .vendor-arrows button:hover {
    background: #aeb9df !important;
    border-color: #aeb9df !important;
}

.vendor-dress .vendor-arrows button:hover::before,
.vendor-studio .vendor-arrows button:hover::before,
.vendor-honeymoon .vendor-arrows button:hover::before {
    border-color: #ffffff !important;
}

/* Keep honeymoon navigation visible even when all cards fit in one view. */
.vendor-honeymoon .vendor-arrows .swiper-button-lock {
    display: block !important;
}

/* 반응형 */
@media (max-width: 900px) {
    .vendor-dress .vendor-slide-track .vendor-card,
    .vendor-studio .vendor-slide-track .vendor-card,
    .vendor-honeymoon .vendor-slide-track .vendor-card {
        flex: 0 0 calc((100% - 12px) / 2) !important;
        min-width: calc((100% - 12px) / 2) !important;
    }
}

@media (max-width: 600px) {
    .vendor-dress .vendor-slide-track .vendor-card,
    .vendor-studio .vendor-slide-track .vendor-card,
    .vendor-honeymoon .vendor-slide-track .vendor-card {
        flex: 0 0 100% !important;
        min-width: 100% !important;
    }

    .vendor-dress .vendor-arrows,
    .vendor-studio .vendor-arrows,
    .vendor-honeymoon .vendor-arrows {
        margin-top: 18px !important;
    }
}

/* =========================================================
   YEON REAL SKETCH SECTION
========================================================= */

.yeon-sketch-section {
    position: relative !important;
    padding: 78px 0 92px !important;
    background: #ffffff !important;
    overflow: hidden !important;
    text-align: center !important;
}

.yeon-sketch-section .sketch-inner {
    position: relative !important;
    width: min(1360px, calc(100% - 40px)) !important;
    max-width: 1360px !important;
    margin: 0 auto !important;
    z-index: 2 !important;
}

.sketch-title {
    margin-bottom: 42px !important;
    text-align: center !important;
}

.sketch-title h3 {
    margin: 0 !important;
    color: #111111 !important;
    font-size: 60px !important;
    line-height: 1.22 !important;
    font-weight: 800 !important;
    letter-spacing: -0.035em !important;
}

.sketch-title h3 strong {
    display: block !important;
    color: #8b9cd7 !important;
    font-size: 70px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

.sketch-title h3 strong em {
    display: inline-block !important;
    margin-right: 8px !important;
    color: #9eacd6 !important;
    font-family: Georgia, 'Times New Roman', serif !important;
    font-size: 64px !important;
    font-weight: 400 !important;
    font-style: italic !important;
    letter-spacing: -0.08em !important;
    /*transform: translateY(6px) rotate(-5deg) !important;*/
}

.sketch-visual-wrap {
    position: relative !important;
    width: 100% !important;
    height: 600px !important;
    margin: 0 auto !important;
    overflow: visible !important;
}

.sketch-slide {
    position: absolute !important;
    inset: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(24px) scale(0.98) !important;
    transition: opacity 0.55s ease, transform 0.55s ease, visibility 0.55s ease !important;
}

.sketch-slide.is-active {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
}

.sketch-slide img {
    display: block !important;
    width: 100% !important;
    height: 560px !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: 0px !important;
}

.sketch-slide::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 0 50px 0 !important;
    background: #eef1f8 !important;
    z-index: -1 !important;
    border-radius: 4px !important;
}

/* 코딩 정보박스 */
.sketch-info-card {
    position: absolute !important;
    right: -14px !important;
    bottom: 26px !important;
    width: 455px !important;
    min-height: 104px !important;
    padding: 24px 30px !important;
    background: #dfe6f7 !important;
    border-radius: 0px !important;
    text-align: left !important;
    z-index: 10 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    transform: translateX(0) !important;
}

.sketch-info-card strong {
    display: block !important;
    color: #111111 !important;
    font-size: 25px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    letter-spacing: -0.055em !important;
}

.sketch-info-card p {
    margin: 8px 0 0 !important;
    color: #8a8a8a !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 500 !important;
    letter-spacing: -0.04em !important;
}

.sketch-info-card.is-changing {
    animation: sketchInfoChange 0.45s ease both !important;
}

@keyframes sketchInfoChange {
    0% {
        opacity: 0;
        transform: translateX(22px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* STEP */
.sketch-step-wrap {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 0 !important;
    margin-top: 18px !important;
    padding-top: 22px !important;
}

.sketch-line {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 22px !important;
    height: 1px !important;
    background: #9eacd6 !important;
    z-index: 1 !important;
}

.sketch-step {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-height: 52px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    color: #111111 !important;
    text-align: center !important;
    cursor: pointer !important;
	margin-top: 10px;
}

.sketch-step i {
    position: absolute !important;
    top: -50px !important;
    left: 50% !important;
    width: 40px !important;
    height: 40px !important;
    transform: translateX(-50%) scale(0) !important;
    border-radius: 50% !important;
    background: #9eacd6 !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 15px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    opacity: 0 !important;
    transition: opacity 0.25s ease, transform 0.25s ease !important;
}

.sketch-step i::after {
    content: '' !important;
    position: absolute !important;
    left: 50% !important;
    bottom: -6px !important;
    transform: translateX(-50%) !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 7px solid transparent !important;
    border-right: 7px solid transparent !important;
    border-top: 9px solid #9eacd6 !important;
}

.sketch-step span {
    display: block !important;
    color: #212121 !important;
    font-size: 19px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.045em !important;
    transition: color 0.25s ease !important;
}

.sketch-step.is-active i {
    opacity: 1 !important;
    transform: translateX(-50%) scale(1) !important;
    animation: sketchStepPop 0.42s cubic-bezier(.18, 1.55, .42, 1) both !important;
}

.sketch-step:hover span {
    color: #9eacd6 !important;
}

@keyframes sketchStepPop {
    0% {
        opacity: 0;
        transform: translateX(-50%) scale(0.4);
    }
    65% {
        opacity: 1;
        transform: translateX(-50%) scale(1.18);
    }
    100% {
        opacity: 1;
        transform: translateX(-50%) scale(1);
    }
}

.sketch-watermark {
    position: absolute !important;
    left: 50% !important;
    bottom: -110px !important;
    transform: translateX(-50%) !important;
    z-index: -1 !important;
    color: #f0f2f8 !important;
    font-family: Georgia, 'Times New Roman', serif !important;
    font-size: 92px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: -0.04em !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

/* 등장 모션 */
.yeon-sketch-section.is-visible .sketch-title {
    animation: sketchTitleUp 0.72s ease both !important;
}

.yeon-sketch-section.is-visible .sketch-visual-wrap {
    animation: sketchVisualUp 0.75s ease 0.12s both !important;
}

.yeon-sketch-section.is-visible .sketch-step-wrap {
    animation: sketchStepWrapUp 0.7s ease 0.22s both !important;
}

@keyframes sketchTitleUp {
    0% {
        opacity: 0;
        transform: translateY(26px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes sketchVisualUp {
    0% {
        opacity: 0;
        transform: translateY(34px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes sketchStepWrapUp {
    0% {
        opacity: 0;
        transform: translateY(22px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 반응형 */
@media (max-width: 1024px) {
    .sketch-title h3 {
        font-size: 38px !important;
    }

    .sketch-title h3 strong {
        font-size: 42px !important;
    }

    .sketch-title h3 strong em {
        font-size: 54px !important;
    }

    .sketch-info-card {
        right: 20px !important;
        width: 420px !important;
    }
}

@media (max-width: 768px) {
    .yeon-sketch-section {
        padding: 58px 0 70px !important;
    }

    .yeon-sketch-section .sketch-inner {
        width: calc(100% - 28px) !important;
    }

    .sketch-title {
        margin-bottom: 30px !important;
    }

    .sketch-title h3 {
        font-size: 30px !important;
    }

    .sketch-title h3 strong {
        font-size: 33px !important;
    }

    .sketch-title h3 strong em {
        font-size: 44px !important;
        display: block !important;
        margin: 0 auto 2px !important;
    }

    .sketch-visual-wrap {
        height: auto !important;
        padding-bottom: 0 !important;
    }

    .sketch-slide {
        position: relative !important;
        display: none !important;
        inset: auto !important;
    }

    .sketch-slide.is-active {
        display: block !important;
    }

    .sketch-slide img {
        height: 270px !important;
    }

    .sketch-info-card {
        position: relative !important;
        right: auto !important;
        bottom: auto !important;
        width: calc(100% - 24px) !important;
        min-height: auto !important;
        margin: -38px auto 0 !important;
        padding: 20px 22px !important;
        /* border-radius: 6px !important; */
    }

    .sketch-info-card strong {
        font-size: 21px !important;
    }

    .sketch-info-card p {
        font-size: 14px !important;
    }

    .sketch-step-wrap {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px 0 !important;
        margin-top: 34px !important;
        padding-top: 0 !important;
    }

    .sketch-line {
        display: none !important;
    }

    .sketch-step {
        min-height: 48px !important;
        display: flex;
        align-items: center;
    }

    .sketch-step i {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        transform: scale(0) !important;
        margin: 0 auto 8px !important;
    }

   
    .sketch-step i::after {
        display: none !important;
    }

    .sketch-step span {
        font-size: 13px !important;
    }

    .sketch-watermark {
        font-size: 48px !important;
        bottom: -54px !important;
    }

     .sketch-step.is-active i {
        
        background: #9eacd6 !important;
          transform: scale(1) !important;
    }

    .sketch-step i {
        transform: scale(1) !important;
        opacity: 1 !important;
        /* transform: translateX(-50%) scale(1) !important; */
        animation: sketchStepPop 0.42s cubic-bezier(.18, 1.55, .42, 1) both !important;
        background: #e7ebf7 !important;
        position: static !important;
}
}

@media (max-width: 480px) {
    .sketch-title h3 {
        font-size: 26px !important;
    }

    .sketch-title h3 strong {
        font-size: 29px !important;
    }

    .sketch-slide img {
        height: 230px !important;
    }

    .sketch-step-wrap {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* =========================================================
   YEON TIMING / PERK SECTION
========================================================= */

.yeon-timing-section {
    position: relative !important;
    padding: 82px 0 86px !important;
    background: linear-gradient(135deg, #a4bdff 0%, #dee7ff 100%) !important;
    overflow: hidden !important;
}

.yeon-timing-section::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        radial-gradient(circle at 20% 20%, rgba(255,255,255,0.22), transparent 30%),
        radial-gradient(circle at 80% 80%, rgba(255,255,255,0.12), transparent 34%) !important;
    pointer-events: none !important;
}

.yeon-timing-section .timing-inner {
    position: relative !important;
    z-index: 2 !important;
    width: min(1400px, calc(100% - 40px)) !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1fr 640px !important;
    gap: 70px !important;
    align-items: center !important;
}

.timing-title {
    text-align: left !important;
    opacity: 0;
    transform: translateX(-34px);
}

.timing-title p {
    margin: 0 0 12px !important;
    color: rgba(255,255,255,0.92) !important;
    font-size: 23px !important;
    line-height: 1.35 !important;
    font-weight: 400 !important;
    letter-spacing: 0.1em !important
}

.timing-title h3 {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 65px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
}


.timing-title h3 strong {
    display: block !important;
    color: #111111 !important;
    font-size: 70px !important;
    line-height: 1.18 !important;
    font-weight: 800 !important;
}

.timing-title span {
    display: block !important;
    margin-top: 22px !important;
    color: rgba(255,255,255,0.62) !important;
    font-family: Georgia, 'Times New Roman', serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.38em !important;
    line-height: 1.2 !important;
}

.timing-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.timing-grid li {
    opacity: 0;
    transform: translateY(34px);
}

.timing-card {
    width: 100% !important;
    min-height: 230px !important;
    padding: 34px 24px 30px !important;
    background: #ffffff !important;
    border-radius: 5px !important;
    text-align: center !important;
    box-shadow: 0 12px 24px rgba(75, 86, 126, 0.08) !important;
    transition: transform 0.32s ease, box-shadow 0.32s ease !important;
}

.timing-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 20px 36px rgba(75, 86, 126, 0.16) !important;
}

.timing-icon {
    height: 64px !important;
    margin-bottom: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 50px !important;
    line-height: 1 !important;
    filter: drop-shadow(0 6px 10px rgba(111, 125, 180, 0.18)) !important;
}

.timing-card strong {
    display: block !important;
    color: #111111 !important;
    font-size: clamp(20px, 2.6vw, 28px) !important;
    line-height: 1.34 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}

.timing-card p {
    margin: 4px 0 0 !important;
    color: #9eacd6 !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 600 !important;
    letter-spacing: -0.015em !important;
}

@media (max-width:1400px){
.timing-title h3 strong, .timing-title h3{font-size: 61px !important;}
}

/* 모션 */
.yeon-timing-section.is-visible .timing-title {
    animation: timingTitleIn 0.75s ease forwards !important;
}

.yeon-timing-section.is-visible .timing-grid li {
    animation: timingCardUp 0.68s ease forwards !important;
}

.yeon-timing-section.is-visible .timing-grid li:nth-child(1) {
    animation-delay: 0.1s !important;
}

.yeon-timing-section.is-visible .timing-grid li:nth-child(2) {
    animation-delay: 0.22s !important;
}

.yeon-timing-section.is-visible .timing-grid li:nth-child(3) {
    animation-delay: 0.34s !important;
}

.yeon-timing-section.is-visible .timing-grid li:nth-child(4) {
    animation-delay: 0.46s !important;
}

.yeon-timing-section.is-visible .timing-icon {
    animation: timingIconPop 0.65s cubic-bezier(.18, 1.55, .42, 1) both !important;
}

.yeon-timing-section.is-visible .timing-grid li:nth-child(1) .timing-icon {
    animation-delay: 0.36s !important;
}

.yeon-timing-section.is-visible .timing-grid li:nth-child(2) .timing-icon {
    animation-delay: 0.48s !important;
}

.yeon-timing-section.is-visible .timing-grid li:nth-child(3) .timing-icon {
    animation-delay: 0.6s !important;
}

.yeon-timing-section.is-visible .timing-grid li:nth-child(4) .timing-icon {
    animation-delay: 0.72s !important;
}

@keyframes timingTitleIn {
    0% {
        opacity: 0;
        transform: translateX(-34px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes timingCardUp {
    0% {
        opacity: 0;
        transform: translateY(34px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes timingIconPop {
    0% {
        transform: scale(0.45) rotate(-8deg);
        opacity: 0;
    }
    60% {
        transform: scale(1.18) rotate(4deg);
        opacity: 1;
    }
    100% {
        transform: scale(1) rotate(0);
        opacity: 1;
    }
}

/* 반응형 */
@media (max-width: 1024px) {
    .yeon-timing-section .timing-inner {
        grid-template-columns: 1fr !important;
        gap: 38px !important;
    }

    .timing-title {
        text-align: center !important;
    }

    .timing-title h3 {
        font-size: 44px !important;
    }

    .timing-title h3 strong {
        font-size: 48px !important;
    }

    .timing-grid {
        width: min(560px, 100%) !important;
        margin: 0 auto !important;
    }
}

@media (max-width: 768px) {
    .yeon-timing-section {
        padding: 58px 0 64px !important;
    }

    .yeon-timing-section .timing-inner {
        width: calc(100% - 28px) !important;
    }

    .timing-title p {
        font-size: 17px !important;
    }

    .timing-title h3 {
        font-size: 33px !important;
    }

    .timing-title h3 strong {
        font-size: 37px !important;
    }

    .timing-title span {
        margin-top: 16px !important;
        font-size: 11px !important;
        letter-spacing: 0.22em !important;
    }

    .timing-grid {
        gap: 12px !important;
    }

    .timing-card {
        min-height: 190px !important;
        padding: 26px 12px 24px !important;
    }

    .timing-icon {
        height: 52px !important;
        font-size: 42px !important;
    }

    .timing-card strong {
        font-size: 18px !important;
    }

    .timing-card p {
        font-size: 17px !important;
    }
}

@media (max-width: 480px) {
    .timing-grid {
        grid-template-columns: 1fr !important;
    }

    .timing-title h3 {
        font-size: 29px !important;
    }

    .timing-title h3 strong {
        font-size: 32px !important;
    }

    .timing-card {
        min-height: auto !important;
        padding: 28px 18px 26px !important;
    }
}

/* =========================================================
   YEON FAQ SECTION
========================================================= */

.yeon-faq-section {
    position: relative !important;
    padding: 82px 0 88px !important;
    background: #f5f7fb !important;
    overflow: hidden !important;
    text-align: center !important;
}

.yeon-faq-section .faq-inner {
    width: min(960px, calc(100% - 40px)) !important;
    max-width: 960px !important;
    margin: 0 auto !important;
}

.faq-title {
    margin-bottom: 42px !important;
    text-align: center !important;
}

.faq-title h3 {
    margin: 0 !important;
    color: #111111 !important;
    font-size: 60px !important;
    line-height: 1.28 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}

.faq-title h3 strong {
    display: block !important;
    color: #9eacd6 !important;
    font-size: 65px !important;
    font-weight: 800 !important;
}

.yeon-faq-list {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

.yeon-faq-list li {
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
}

.faq-question {
    position: relative !important;
    width: 100% !important;
    min-height: 58px !important;
    padding: 0 64px 0 42px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #222222 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    text-align: left !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.04em !important;
    box-shadow: 0 8px 18px rgba(83, 95, 130, 0.06) !important;
    cursor: pointer !important;
    transition: background 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease !important;
}

.faq-question span {
    flex: 0 0 auto !important;
    color: #9eacd6 !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    font-family: Georgia, 'Times New Roman', serif !important;
}

.faq-question::after {
    content: '+' !important;
    position: absolute !important;
    right: 34px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #9eacd6 !important;
    font-size: 25px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    transition: transform 0.25s ease !important;
}

.yeon-faq-list li.is-open .faq-question {
    background: #ffffff !important;
    box-shadow: 0 10px 24px rgba(83, 95, 130, 0.08) !important;
}

.yeon-faq-list li.is-open .faq-question::after {
    content: '-' !important;
    transform: translateY(-50%) rotate(180deg) !important;
}

.faq-question:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 24px rgba(83, 95, 130, 0.1) !important;
}

.faq-answer {
    display: none;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 18px 38px 4px 38px !important;
    text-align: left !important;
}

.yeon-faq-list li.is-open .faq-answer {
    display: flex;
}

.faq-answer i {
    flex: 0 0 40px !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: #8b9cd7  !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: Georgia, 'Times New Roman', serif !important;
    font-size: 16px !important;
    line-height: 0.75 !important;
    font-style: normal !important;
    letter-spacing: -0.06em !important;
}

.faq-answer p {
    margin: 6px 0 0 !important;
    color: #555555 !important;
    font-size: 18px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
    letter-spacing: -0.03em !important;
}

/* 등장 모션 */
.yeon-faq-section.is-visible .faq-title {
    animation: faqTitleUp 0.7s ease both !important;
}

.yeon-faq-section.is-visible .yeon-faq-list li {
    animation: faqItemUp 0.55s ease both !important;
}

.yeon-faq-section.is-visible .yeon-faq-list li:nth-child(1) { animation-delay: 0.05s !important; }
.yeon-faq-section.is-visible .yeon-faq-list li:nth-child(2) { animation-delay: 0.10s !important; }
.yeon-faq-section.is-visible .yeon-faq-list li:nth-child(3) { animation-delay: 0.15s !important; }
.yeon-faq-section.is-visible .yeon-faq-list li:nth-child(4) { animation-delay: 0.20s !important; }
.yeon-faq-section.is-visible .yeon-faq-list li:nth-child(5) { animation-delay: 0.25s !important; }
.yeon-faq-section.is-visible .yeon-faq-list li:nth-child(6) { animation-delay: 0.30s !important; }
.yeon-faq-section.is-visible .yeon-faq-list li:nth-child(7) { animation-delay: 0.35s !important; }
.yeon-faq-section.is-visible .yeon-faq-list li:nth-child(8) { animation-delay: 0.40s !important; }

@keyframes faqTitleUp {
    0% {
        opacity: 0;
        transform: translateY(26px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes faqItemUp {
    0% {
        opacity: 0;
        transform: translateY(22px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 반응형 */
@media (max-width: 768px) {
    .yeon-faq-section {
        padding: 58px 0 64px !important;
    }

    .yeon-faq-section .faq-inner {
        width: calc(100% - 28px) !important;
    }

    .faq-title {
        margin-bottom: 30px !important;
    }

    .faq-title h3 {
        font-size: 31px !important;
    }

    .faq-title h3 strong {
        font-size: 34px !important;
    }

    .faq-question {
        min-height: 54px !important;
        padding: 0 48px 0 24px !important;
        font-size: 16px !important;
    }

    .faq-question span {
        font-size: 21px !important;
    }

    .faq-question::after {
        right: 24px !important;
    }

    .faq-answer {
        padding: 14px 20px 4px 20px !important;
        gap: 10px !important;
    }

    .faq-answer i {
        flex-basis: 34px !important;
        width: 34px !important;
        height: 34px !important;
        font-size: 14px !important;
    }

    .faq-answer p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }
}

@media (max-width: 480px) {
    .faq-title h3 {
        font-size: 27px !important;
    }

    .faq-title h3 strong {
        font-size: 30px !important;
    }

    .faq-question {
        font-size: 15px !important;
        padding-left: 20px !important;
    }
}

/* =========================================================
   YEON LOCATION SECTION
========================================================= */

.yeon-location-section {
    position: relative !important;
    padding: 82px 0 86px !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

.yeon-location-section .location-inner {
    width: min(1040px, calc(100% - 40px)) !important;
    max-width: 1040px !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1fr 420px !important;
    gap: 72px !important;
    align-items: center !important;
}

.yeon-location-section .location-copy {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: left !important;
    box-shadow: none !important;
    opacity: 0;
    transform: translateX(-34px);
}

.location-kicker {
    margin: 0 0 12px !important;
    color: #555555 !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
    letter-spacing: -0.04em !important;
}

.yeon-location-section .location-copy h3 {
    margin: 0 !important;
    color: #111111 !important;
    font-size: 45px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: -0.065em !important;
}

.yeon-location-section .location-copy h3 strong {
    display: block !important;
    color: #9eacd6 !important;
    font-size: 47px !important;
    line-height: 1.18 !important;
    font-weight: 700 !important;
    letter-spacing: -0.07em !important;
}

.location-info-list {
    margin: 32px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 11px !important;
}

.location-info-list li {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    color: #111111 !important;
    font-size: 19px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    letter-spacing: -0.04em !important;
}

.location-info-list li b {
    color: #e9474b !important;
    font-weight: 700 !important;
}

/* 아이콘 CSS */
.loc-icon {
    position: relative !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 22px !important;
    display: inline-block !important;
    color: #9eacd6 !important;
}

.loc-date::before {
    content: '' !important;
    position: absolute !important;
    left: 2px !important;
    top: 3px !important;
    width: 16px !important;
    height: 16px !important;
    border: 2px solid #9eacd6 !important;
    border-radius: 50% !important;
}

.loc-date::after {
    content: '' !important;
    position: absolute !important;
    left: 10px !important;
    top: 7px !important;
    width: 6px !important;
    height: 7px !important;
    border-left: 2px solid #9eacd6 !important;
    border-bottom: 2px solid #9eacd6 !important;
}

.loc-pin::before {
    content: '' !important;
    position: absolute !important;
    left: 4px !important;
    top: 1px !important;
    width: 14px !important;
    height: 14px !important;
    background: #9eacd6 !important;
    border-radius: 50% 50% 50% 0 !important;
    transform: rotate(-45deg) !important;
}

.loc-pin::after {
    content: '' !important;
    position: absolute !important;
    left: 9px !important;
    top: 6px !important;
    width: 4px !important;
    height: 4px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
}

.loc-ticket::before {
    content: '' !important;
    position: absolute !important;
    left: 1px !important;
    top: 5px !important;
    width: 19px !important;
    height: 13px !important;
    border: 2px solid #9eacd6 !important;
    border-radius: 3px !important;
    transform: rotate(-22deg) !important;
}

.loc-ticket::after {
    content: '' !important;
    position: absolute !important;
    left: 8px !important;
    top: 3px !important;
    width: 2px !important;
    height: 17px !important;
    background: repeating-linear-gradient(
        to bottom,
        #9eacd6 0,
        #9eacd6 3px,
        transparent 3px,
        transparent 5px
    ) !important;
    transform: rotate(-22deg) !important;
}

.location-apply-btn {
    position: relative !important;
    width: 290px !important;
    height: 56px !important;
    margin-top: 38px !important;
    background: #9eacd6 !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 52px !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: -0.04em !important;
    overflow: hidden !important;
    transition: transform 0.25s ease, background 0.25s ease, box-shadow 0.25s ease !important;
}

.location-apply-btn span {
    font-size: 28px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    transform: translateY(-1px) !important;
}

.location-apply-btn::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -80% !important;
    width: 55% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.28), transparent) !important;
    transform: skewX(-24deg) !important;
    animation: locationBtnShine 2.8s ease-in-out infinite !important;
}

.location-apply-btn:hover {
    background: #111111 !important;
    transform: translateY(-4px) !important;
    box-shadow: 0 16px 28px rgba(83, 95, 130, 0.18) !important;
}

.yeon-location-section .location-photo {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    box-shadow: none !important;
    opacity: 0;
    transform: translateX(34px);
}

.yeon-location-section .location-photo img {
    display: block !important;
    width: 100% !important;
    height: 430px !important;
    min-height: 0 !important;
    object-fit: cover !important;
    object-position: center center !important;
}

.yeon-location-section.is-visible .location-copy {
    animation: locationCopyIn 0.72s ease forwards !important;
}

.yeon-location-section.is-visible .location-photo {
    animation: locationPhotoIn 0.72s ease 0.16s forwards !important;
}

@keyframes locationCopyIn {
    0% {
        opacity: 0;
        transform: translateX(-34px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes locationPhotoIn {
    0% {
        opacity: 0;
        transform: translateX(34px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes locationBtnShine {
    0% {
        left: -80%;
    }
    44%, 100% {
        left: 130%;
    }
}

/* 기존 map-box 숨김 */
.yeon-location-section .map-box {
    display: none !important;
}

/* 반응형 */
@media (max-width: 1024px) {
    .yeon-location-section .location-inner {
        grid-template-columns: 1fr 380px !important;
        gap: 46px !important;
    }

    .yeon-location-section .location-copy h3 {
        font-size: 39px !important;
    }

    .yeon-location-section .location-copy h3 strong {
        font-size: 41px !important;
    }

    .yeon-location-section .location-photo img {
        height: 390px !important;
    }
}

@media (max-width: 768px) {
    .yeon-location-section {
        padding: 58px 0 64px !important;
    }

    .yeon-location-section .location-inner {
        width: calc(100% - 28px) !important;
        grid-template-columns: 1fr !important;
        gap: 34px !important;
    }

    .yeon-location-section .location-copy {
        text-align: center !important;
    }

    .location-kicker {
        font-size: 15px !important;
    }

    .yeon-location-section .location-copy h3 {
        font-size: 31px !important;
    }

    .yeon-location-section .location-copy h3 strong {
        font-size: 34px !important;
    }

    .location-info-list {
        width: fit-content !important;
        max-width: 100% !important;
        margin: 26px auto 0 !important;
        gap: 10px !important;
    }

    .location-info-list li {
        font-size: 16px !important;
        text-align: left !important;
    }

    .location-apply-btn {
        width: 260px !important;
        height: 52px !important;
        margin-top: 30px !important;
        gap: 34px !important;
        font-size: 15px !important;
    }

    .yeon-location-section .location-photo img {
        height: 300px !important;
    }
}

@media (max-width: 480px) {
    .yeon-location-section .location-copy h3 {
        font-size: 27px !important;
    }

    .yeon-location-section .location-copy h3 strong {
        font-size: 30px !important;
    }

    .location-info-list li {
        font-size: 14px !important;
    }

    .location-apply-btn {
        width: 100% !important;
    }

    .yeon-location-section .location-photo img {
        height: 250px !important;
    }
}

/* =========================================================
   YEON LOCATION MAP SECTION
========================================================= */

.yeon-map-section {
    position: relative !important;
    padding: 72px 0 78px !important;
    background: #282a31 !important;
    overflow: hidden !important;
    text-align: center !important;
}

.yeon-map-section::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(158, 172, 214, 0.16), transparent 36%),
        linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0)) !important;
    pointer-events: none !important;
}

.yeon-map-section .map-inner {
    position: relative !important;
    z-index: 2 !important;
    width: min(960px, calc(100% - 40px)) !important;
    max-width: 960px !important;
    margin: 0 auto !important;
}

.map-title {
    margin-bottom: 28px !important;
    text-align: center !important;
    opacity: 0;
    transform: translateY(24px);
}

.map-title p {
    margin: 0 0 4px !important;
    color: rgba(255,255,255,0.86) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.16em !important;
}

.map-title h3 {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 70px !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
}

/* 실제 지도 영역 */
.map-box {
    position: relative !important;
    width: 100% !important;
    height: 400px !important;
    margin: 0 auto !important;
    background: #f2f2f2 !important;
    overflow: hidden !important;
    opacity: 0;
    transform: translateY(32px);
}

.map-box iframe,
.map-box #kakaoMap {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
}

/* 하단 주소 */
.map-address {
    margin-top: 22px !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 18px !important;
    opacity: 0;
    transform: translateY(20px);
}

.map-address strong {
    position: relative !important;
    display: inline-block !important;
    color: #ffffff !important;
    font-size: 25px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.01em !important;
}

.map-address strong::before {
    content: 'At.' !important;
    display: inline-block !important;
    margin-right: 5px !important;
    color: #9eacd6 !important;
    font-weight: 700 !important;
}

.map-address span {
    position: relative !important;
    display: inline-block !important;
    color: #ffffff !important;
    font-size: 21px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.04em !important;
}

.map-address span::before {
    content: '' !important;
    display: inline-block !important;
    width: 1px !important;
    height: 18px !important;
    margin-right: 18px !important;
    background: rgba(255,255,255,0.42) !important;
    vertical-align: -3px !important;
}

/* 모션 */
.yeon-map-section.is-visible .map-title {
    animation: mapTitleUp 0.7s ease forwards !important;
}

.yeon-map-section.is-visible .map-box {
    animation: mapImageUp 0.75s ease 0.14s forwards !important;
}

.root_daum_roughmap .wrap_map, #daumRoughmapContainer1783406469524, #daumRoughmapContainer1788232760159{width:100% !important; height:100% !important;}
.yeon-map-section.is-visible .map-address {
    animation: mapAddressUp 0.65s ease 0.3s forwards !important;
}

@keyframes mapTitleUp {
    0% {
        opacity: 0;
        transform: translateY(24px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes mapImageUp {
    0% {
        opacity: 0;
        transform: translateY(32px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes mapAddressUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 반응형 */
@media (max-width: 768px) {
    .yeon-map-section {
        padding: 58px 0 64px !important;
    }

    .yeon-map-section .map-inner {
        width: calc(100% - 28px) !important;
    }

    .map-title p {
        font-size: 14px !important;
    }

    .map-title h3 {
        font-size: 38px !important;
    }

    .map-box {
        height: 240px !important;
    }

    .map-address {
        flex-direction: column !important;
        gap: 4px !important;
    }

    .map-address strong,
    .map-address span {
        font-size: 17px !important;
    }

    .map-address span::before {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .map-title h3 {
        font-size: 33px !important;
    }

    .map-box {
        height: 210px !important;
    }

    .map-address strong,
    .map-address span {
        font-size: 19px !important;
    }
}

/* =========================================================
   VENDOR HALL HEAD CENTER ALIGN
   웨딩홀 섹션 제목/탭 중앙 정렬
========================================================= */

.vendor-hall .vendor-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 28px !important;
    width: 100% !important;
    margin: 0 auto 42px !important;
    text-align: center !important;
}

.vendor-hall .vendor-title {
    width: 100% !important;
    text-align: center !important;
}

.vendor-hall .vendor-title p {
	
    text-align: center !important;
}

.vendor-hall .vendor-title h3 {
	color: #dbcfb4 !important;
    text-align: center !important;
}

.vendor-hall .vendor-tabs {
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
    /* display: flex !important; */
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.vendor-hall .vendor-tabs button {
    /* min-width: 115px !important; */
    height: 40px !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* =========================================================
   그누보드 연동 업체 카드 보정
========================================================= */
.vendor-empty {
    pointer-events: none !important;
}

/* =========================================================
   게시판 연동 카드 이미지 보정
   - 게시글에 이미지가 없을 때도 카드 영역 유지
========================================================= */
.vendor-card .vendor-no-img {
    position: absolute !important;
    inset: 0 0 46px 0 !important;
    width: 100% !important;
    height: calc(100% - 46px) !important;
    background: #ffffff !important;
    z-index: 1 !important;
}

.vendor-card img {
    display: block !important;
}

/* =========================================================
   게시판 연동 업체 카드 추가 보정
   - button 카드 기본 스타일 제거
   - 전체보기/분류 클릭 시 로드된 모든 카드 필터링
   - 카드 클릭 시 상세페이지 이동 대신 팝업 노출
========================================================= */
.vendor-card {
    width: 100% !important;
    border: 1px solid #f1f1f1 !important;
    padding: 0 !important;
    margin: 0 !important;
    font: inherit !important;
    text-align: left !important;
    text-decoration: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    cursor: pointer !important;
    aspect-ratio: 3 / 2.4;
}
.vendor-slide-track .vendor-card, .vendor-studio .vendor-card, .vendor-dress .vendor-card{
    aspect-ratio: 360 /580;
}
.vendor-card:focus {
    outline: 2px solid rgba(174, 185, 223, 0.85) !important;
    outline-offset: 3px !important;
}

.vendor-card strong {
    width: 100% !important;
    text-align: center !important;
}

/* 업체 팝업 */
.vendor-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.22s ease, visibility 0.22s ease !important;
}

.vendor-modal.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.vendor-modal-bg {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.58) !important;
}

.vendor-modal-box {
    position: relative !important;
    z-index: 2 !important;
    width: min(720px, 100%) !important;
    background: #ffffff !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28) !important;
    transform: translateY(18px) scale(0.98) !important;
    transition: transform 0.24s ease !important;
    overflow: hidden !important;
}

.vendor-modal.is-open .vendor-modal-box {
    transform: translateY(0) scale(1) !important;
}

.vendor-modal-close {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    z-index: 3 !important;
    width: 38px !important;
    height: 38px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(17, 17, 17, 0.72) !important;
    color: #ffffff !important;
    font-size: 27px !important;
    line-height: 34px !important;
    text-align: center !important;
    cursor: pointer !important;
}

.vendor-modal-img-wrap {
    position: relative !important;
    width: 100% !important;
    background: #f4f6fb !important;
}

.vendor-modal-img-wrap img {
    display: block !important;
    width: 100% !important;
    max-height: 70vh !important;
    object-fit: contain !important;
    background: #f4f6fb !important;
}

.vendor-modal-img-wrap.is-empty {
    min-height: 220px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.vendor-modal-img-wrap.is-empty::before {
    content: '이미지 준비중' !important;
    color: #999999 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

.vendor-modal-box h4 {
    margin: 0 !important;
    padding: 20px 28px 24px !important;
    background: #ffffff !important;
    color: #111111 !important;
    font-size: 22px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    text-align: center !important;
    letter-spacing: -0.04em !important;
}

.vendor-modal-actions {
    display: none !important;
}

.vendor-modal.has-instagram .vendor-modal-box h4 {
    padding-bottom: 14px !important;
}

.vendor-modal.has-instagram .vendor-modal-actions {
    display: flex !important;
    justify-content: center !important;
    padding: 0 28px 24px !important;
}

.vendor-modal-instagram[hidden] {
    display: none !important;
}

.vendor-modal-instagram img {
    width: 24px !important;
    height: 24px !important;
    object-fit: contain !important;
}

/* 웨딩홀·웨딩샵 게시글 다중 이미지 팝업 갤러리 */
.vendor-modal.has-gallery .vendor-modal-box {
    width: min(980px, 100%) !important;
}

.vendor-modal-gallery-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
}

.vendor-modal.has-gallery .vendor-modal-gallery-layout {
    grid-template-columns: minmax(0, 1fr) 124px !important;
    gap: 10px !important;
    padding: 10px !important;
}

.vendor-modal-main-swiper {
    width: 100% !important;
    min-width: 0 !important;
    background: #f4f6fb !important;
}

.vendor-modal-main-swiper .swiper-slide {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 320px !important;
    background: #f4f6fb !important;
}

.vendor-modal-main-swiper .swiper-slide img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 68vh !important;
    object-fit: contain !important;
    background: #f4f6fb !important;
}

.vendor-modal-thumbs {
    display: none !important;
}

.vendor-modal.has-gallery .vendor-modal-thumbs {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    max-height: 68vh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-width: thin !important;
}

.vendor-modal-thumb {
    flex: 0 0 96px !important;
    width: 100% !important;
    height: 96px !important;
    padding: 4px !important;
    border: 1px solid #dce0e9 !important;
    background: #ffffff !important;
    cursor: pointer !important;
    opacity: 0.68 !important;
    transition: border-color 0.2s ease, opacity 0.2s ease, transform 0.2s ease !important;
}

.vendor-modal-thumb img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
    background: #f4f6fb !important;
}

.vendor-modal-thumb:hover,
.vendor-modal-thumb.is-active {
    border-color: #9aaadc !important;
    opacity: 1 !important;
}

.vendor-modal-thumb.is-active {
    box-shadow: inset 0 0 0 2px #9aaadc !important;
}

.vendor-modal-nav {
    position: absolute !important;
    top: 50% !important;
    z-index: 5 !important;
    display: none !important;
    width: 44px !important;
    height: 44px !important;
    margin-top: -22px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(17, 17, 17, 0.58) !important;
    color: #ffffff !important;
    font-size: 34px !important;
    line-height: 40px !important;
    cursor: pointer !important;
}

.vendor-modal.has-gallery .vendor-modal-nav {
    display: block !important;
}

.vendor-modal-prev { left: 14px !important; }
.vendor-modal-next { right: 14px !important; }

.vendor-modal-count {
    position: absolute !important;
    right: 14px !important;
    bottom: 12px !important;
    z-index: 5 !important;
    display: none !important;
    min-width: 54px !important;
    padding: 6px 10px !important;
    border-radius: 16px !important;
    background: rgba(17, 17, 17, 0.62) !important;
    color: #ffffff !important;
    font-size: 12px !important;
    line-height: 1 !important;
    text-align: center !important;
}

.vendor-modal.has-gallery .vendor-modal-count {
    display: block !important;
}

.vendor-modal-img-wrap.is-empty .vendor-modal-gallery-layout {
    display: none !important;
}

@media (max-width: 768px) {
    .vendor-modal.has-gallery .vendor-modal-gallery-layout {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 8px !important;
    }

    .vendor-modal-main-swiper .swiper-slide {
        min-height: 260px !important;
    }

    .vendor-modal-main-swiper .swiper-slide img {
        max-height: 62vh !important;
    }

    .vendor-modal.has-gallery .vendor-modal-thumbs {
        flex-direction: row !important;
        max-height: none !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    .vendor-modal-thumb {
        flex-basis: 74px !important;
        width: 74px !important;
        height: 64px !important;
    }

    .vendor-modal-nav {
        width: 38px !important;
        height: 38px !important;
        margin-top: -19px !important;
        font-size: 29px !important;
    }
}

.vendor-modal-instagram:hover {
    color: #ffffff !important;
    filter: brightness(1.04) !important;
    transform: translateY(-2px) !important;
}

.vendor-modal-instagram:focus-visible {
    outline: 3px solid rgba(98, 40, 215, 0.32) !important;
    outline-offset: 3px !important;
}

@media (max-width: 768px) {
    .vendor-modal {
        padding: 18px !important;
    }

    .vendor-modal-box h4 {
        padding: 17px 22px 20px !important;
        font-size: 19px !important;
    }

    .vendor-modal-close {
        width: 34px !important;
        height: 34px !important;
        font-size: 24px !important;
        line-height: 31px !important;
    }
}

/* =========================================================
   웨딩샵 세로 이미지 원본 비율 유지
========================================================= */

.vendor-dress .vendor-card {
    background: #ffffff !important;
}

.vendor-dress .vendor-card img {
    object-fit: cover !important;
    object-position: center center !important;
    background: #ffffff !important;
    padding: 0 !important;
}


/* =========================================================
   YEON FAIR INFO SECTION
   대구연웨딩박람회 안내 섹션
   JS 없이도 바로 보이게 처리한 버전
========================================================= */

.yeon-fair-info {
    position: relative !important;
    padding: 92px 0 88px !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

.yeon-fair-info .fair-info-inner {
    width: min(1200px, calc(100% - 56px)) !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1fr 445px !important;
    gap: 86px !important;
    align-items: center !important;
}

/* 중요: opacity 0 쓰지 않음 */
.fair-info-copy {
    position: relative !important;
    text-align: left !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

.fair-kicker {
    margin: 0 0 14px !important;
    color: #777777 !important;
    font-size: 20px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    letter-spacing: -0.045em !important;
}

.fair-info-copy h3 {
    margin: 0 !important;
    color: #111111 !important;
    font-size: 55px !important;
    line-height: 1.22 !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
}

.fair-info-copy h3 strong {
    display: block !important;
    margin-top: 4px !important;
    color: #29c683 !important;
    font-size: 65px !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}

.fair-info-list {
    margin: 36px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

.fair-info-list li {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    color: #212121 !important;
    font-size: 25px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
    letter-spacing: -0.03em !important;
}

.fair-info-list li b {
    display: inline-block !important;
    margin-left: 10px !important;
    color: #e9474b !important;
    font-weight: 800 !important;
}

/* 아이콘 공통 */
.fair-icon {
    position: relative !important;
    flex: 0 0 24px !important;
    width: 24px !important;
    height: 24px !important;
    display: inline-block !important;
    color: #29c683 !important;
}

/* 날짜 아이콘 */
.fair-icon-date::before {
    content: "" !important;
    position: absolute !important;
    left: 3px !important;
    top: 3px !important;
    width: 17px !important;
    height: 17px !important;
    border: 2px solid #29c683 !important;
    border-radius: 50% !important;
}

.fair-icon-date::after {
    content: "" !important;
    position: absolute !important;
    left: 11px !important;
    top: 6px !important;
    width: 6px !important;
    height: 8px !important;
    border-left: 2px solid #29c683 !important;
    border-bottom: 2px solid #29c683 !important;
}

/* 위치 아이콘 */
.fair-icon-place::before {
    content: "" !important;
    position: absolute !important;
    left: 5px !important;
    top: 2px !important;
    width: 14px !important;
    height: 14px !important;
    background: #29c683 !important;
    border-radius: 50% 50% 50% 0 !important;
    transform: rotate(-45deg) !important;
}

.fair-icon-place::after {
    content: "" !important;
    position: absolute !important;
    left: 10px !important;
    top: 7px !important;
    width: 4px !important;
    height: 4px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
}

/* 티켓 아이콘 */
.fair-icon-ticket::before {
    content: "" !important;
    position: absolute !important;
    left: 1px !important;
    top: 6px !important;
    width: 21px !important;
    height: 13px !important;
    border: 2px solid #29c683 !important;
    border-radius: 3px !important;
    transform: rotate(-25deg) !important;
}

.fair-icon-ticket::after {
    content: "" !important;
    position: absolute !important;
    left: 9px !important;
    top: 4px !important;
    width: 2px !important;
    height: 18px !important;
    background: repeating-linear-gradient(
        to bottom,
        #29c683 0,
        #29c683 3px,
        transparent 3px,
        transparent 5px
    ) !important;
    transform: rotate(-25deg) !important;
}

/* 버튼 */
.fair-info-btn {
    position: relative !important;
    width: 310px !important;
    height: 60px !important;
    margin-top: 46px !important;
    padding: 0 18px 0 32px !important;
    background: #29c683 !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: -0.03em !important;
    text-decoration: none !important;
    overflow: hidden !important;
    transition: transform 0.25s ease, background 0.25s ease, box-shadow 0.25s ease !important;
}

.fair-info-btn::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: -80% !important;
    width: 55% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.32), transparent) !important;
    transform: skewX(-24deg) !important;
    animation: fairBtnShine 2.9s ease-in-out infinite !important;
}

.fair-info-btn:hover {
    background: #111111 !important;
    transform: translateY(-4px) !important;
    box-shadow: 0 16px 30px rgba(83, 95, 130, 0.18) !important;
}

.fair-info-btn span {
    position: relative !important;
    z-index: 2 !important;
    font-size: 34px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    transform: translateY(-2px) !important;
}

/* 사진 영역 */
.fair-info-photo {
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

.fair-info-photo::before {
    content: "" !important;
    position: absolute !important;
    right: -22px !important;
    bottom: -22px !important;
    width: 100% !important;
    height: 100% !important;
    background:#2cc785 !important;
    z-index: -1 !important;
}

.fair-info-photo img {
    display: block !important;
    width: 100% !important;
    height: 540px !important;
    object-fit: cover !important;
    object-position: center center !important;
}

/* 보이면서 살짝 등장하는 효과 */
.yeon-fair-info .fair-info-copy {
    animation: fairCopySoftIn 0.72s ease both !important;
}

.yeon-fair-info .fair-info-photo {
    animation: fairPhotoSoftIn 0.72s ease 0.12s both !important;
}

.yeon-fair-info .fair-info-list li {
    animation: fairItemSoftUp 0.55s ease both !important;
}

.yeon-fair-info .fair-info-list li:nth-child(1) {
    animation-delay: 0.18s !important;
}

.yeon-fair-info .fair-info-list li:nth-child(2) {
    animation-delay: 0.28s !important;
}

.yeon-fair-info .fair-info-list li:nth-child(3) {
    animation-delay: 0.38s !important;
}

@keyframes fairCopySoftIn {
    0% {
        opacity: 0;
        transform: translateX(-24px);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fairPhotoSoftIn {
    0% {
        opacity: 0;
        transform: translateX(24px);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fairItemSoftUp {
    0% {
        opacity: 0;
        transform: translateY(14px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fairBtnShine {
    0% {
        left: -80%;
    }

    44%, 100% {
        left: 130%;
    }
}

/* 반응형 */
@media (max-width: 1024px) {
    .yeon-fair-info .fair-info-inner {
        grid-template-columns: 1fr 400px !important;
        gap: 50px !important;
    }

    .fair-info-copy h3 {
        font-size: 40px !important;
    }

    .fair-info-copy h3 strong {
        font-size: 48px !important;
    }

    .fair-info-list li {
        font-size: 19px !important;
    }

    .fair-info-photo img {
        height: 460px !important;
    }
}

@media (max-width: 768px) {
    .yeon-fair-info {
        padding: 64px 0 70px !important;
    }

    .yeon-fair-info .fair-info-inner {
        width: calc(100% - 28px) !important;
        grid-template-columns: 1fr !important;
        gap: 36px !important;
    }

    .fair-info-copy {
        text-align: center !important;
    }

    .fair-kicker {
        font-size: 16px !important;
    }

    .fair-info-copy h3 {
        font-size: 32px !important;
    }

    .fair-info-copy h3 strong {
        font-size: 38px !important;
    }

    .fair-info-list {
        width: fit-content !important;
        max-width: 100% !important;
        margin: 30px auto 0 !important;
        gap: 12px !important;
    }

    .fair-info-list li {
        align-items: flex-start !important;
        text-align: left !important;
        font-size: 16px !important;
    }

    .fair-info-list li b {
        display: block !important;
        margin: 4px 0 0 !important;
    }

    .fair-info-btn {
        width: 270px !important;
        height: 54px !important;
        margin-top: 34px !important;
        font-size: 16px !important;
    }

    .fair-info-photo::before {
        right: -12px !important;
        bottom: -12px !important;
    }

    .fair-info-photo img {
        height: 310px !important;
    }
}

@media (max-width: 480px) {
    .fair-info-copy h3 {
        font-size: 28px !important;
    }

    .fair-info-copy h3 strong {
        font-size: 33px !important;
    }

    .fair-info-btn {
        width: 100% !important;
    }

    .fair-info-photo img {
        height: 250px !important;
    }
}

.vendor-title h3 span{font-family: Georgia, 'Times New Roman', serif !important;font-weight:500;}

/* 플래너 팝업: 사진 우측 하단의 작은 인스타그램 바로가기 */
.vendor-modal.has-instagram .vendor-modal-box h4 {
    padding-bottom: 24px !important;
}

.vendor-modal.has-instagram .vendor-modal-actions {
    position: absolute !important;
    right: 22px !important;
    bottom: 22px !important;
    z-index: 4 !important;
    display: block !important;
    padding: 0 !important;
}

.vendor-modal-instagram {
    width: 42px !important;
    height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    border-radius: 10px !important;
    background: linear-gradient(135deg, #f9ce34 0%, #ee2a7b 48%, #6228d7 100%) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    transition: transform 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease !important;
}

.vendor-modal-instagram img {
    width: 25px !important;
    height: 25px !important;
    object-fit: contain !important;
    background: transparent !important;
}

.vendor-modal-instagram span {
    display: none !important;
}

.vendor-modal-instagram:hover {
    box-shadow: 0 10px 24px rgba(238, 42, 123, 0.28) !important;
}

@media (max-width: 768px) {
    .vendor-modal.has-instagram .vendor-modal-box h4 {
        padding-bottom: 20px !important;
    }

    .vendor-modal.has-instagram .vendor-modal-actions {
        right: 14px !important;
        bottom: 14px !important;
    }

    .vendor-modal-instagram {
        width: 40px !important;
        height: 40px !important;
        border-radius: 11px !important;
    }

    .vendor-modal-instagram img {
        width: 22px !important;
        height: 22px !important;
    }
}