@charset "UTF-8";

/* common */
body.contact .wrapper {
    padding-bottom: min(69.6rem, 36.25vw);
    background: url(../../assets/images/contact/bg-contact-rms.png) no-repeat bottom center / 100%;
}

body.contact .footer-wrap {
    display: none;
}

/* contact common */
.contact-title-box .contact-title {
    padding: 0 0 min(2rem, 1.042vw);
    font-size: min(7.5rem, 3.906vw);
    line-height: min(8.4rem, 4.375vw);
    font-weight: var(--font-weight-medium);
    color: var(--black02);
}

.contact-title-box .contact-desc {
    padding: 0 0 min(4.3rem, 2.24vw);
    font-size: min(2.5rem, 1.302vw);
    line-height: min(4rem, 2.083vw);
    color: var(--black03);
}

.contact-title-box .mail-box {
    display: flex;
    align-items: end;
    gap: 0 min(4rem, 2.083vw);
    font-size: min(2rem, 1.042vw);
    line-height: min(3rem, 1.563vw);
    color: var(--black04);
}

.contact-title-box .mail-box .mail-title {
    padding: 0 0 min(4px, 0.208vw);
    font-weight: var(--font-weight-semibold);
}

.contact-title-box .mail-box .mail-link {
    display: inline-flex;
    align-items: center;
    gap: min(1rem, 0.521vw);
    border-bottom: min(1px, 0.052vw) solid var(--black04);
}

.contact-title-box .mail-box .mail-link .ico-arrow {
    width: min(1.15rem, 0.599vw);
    height: min(1.15rem, 0.599vw);
    background: var(--black04);
    mask: url(../../assets/images/contact/ico-arrow-contact@2x.png) no-repeat center center / 100%;
}

.btn-download {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: min(2px, 0.104vw) min(1rem, 0.521vw);
    min-width: min(20rem, 10.417vw);
    border: min(1px, 0.052vw) solid var(--black04);
    border-radius: min(10rem, 5.208vw);
    font-size: min(1.8rem, 0.938vw);
    line-height: min(2.88rem, 1.5vw);
    color: var(--black04);
    font-weight: var(--font-weight-bold);
    box-sizing: border-box;
}

.btn-download span {
    padding: 0 min(2.5rem, 1.302vw) 0 0;
    background: url(../../assets/images/contact/ico-down@2x.png) no-repeat right center / min(1.5rem, 0.781vw);
}

/* joinus */
.joinus-wrap {
    padding: 0 0 min(20rem, 10.417vw);
}

.join-content-box {
    display: flex;
    gap: 0 min(4.8rem, 2.5vw);
    padding: min(10.6rem, 5.521vw) 0 0;
}

.join-content-box .join-content-item {
    width: 25%;
}

.join-content-box .join-content-item .join-title {
    margin: 0 0 min(3.8rem, 1.979vw);
    padding: 0 0 min(9px, 0.469vw);
    border-bottom: min(1px, 0.052vw) solid var(--black02);
    font-size: min(3rem, 1.563vw);
    line-height: min(4.5rem, 2.344vw);
    font-weight: var(--font-weight-bold);
    color: var(--black02);
}

.join-content-box .join-content-item .join-list {
    display: flex;
    flex-wrap: wrap;
    gap: min(5rem, 2.604vw) 0;
}

.join-content-box .join-content-item .join-list li {
    width: 100%;
}

.join-content-box .join-content-item .join-list li .txt01 {
    font-size: min(2rem, 1.042vw);
    line-height: min(3rem, 1.563vw);
    font-weight: var(--font-weight-semibold);
    color: var(--black04);
}

.join-content-box .join-content-item .join-list li .txt02 {
    padding: min(9px, 0.469vw) 0 0;
    font-size: min(1.8rem, 0.938vw);
    line-height: min(2.88rem, 1.5vw);
    color: var(--black02);
}

.join-content-box .join-content-item .join-list li .txt02 span {
    display: block;
}

.join-content-box .join-content-item .join-list li .txt02 span + span {
    padding: min(5px, 0.26vw) 0 0;
}

.join-content-box .join-content-item .join-download {
    padding: min(6rem, 3.125vw) 0 0;
}

@media (min-width: 1025px) {
    .join-content-box .join-content-item:nth-child(1) {
        width: 50%;
    }

    .join-content-box .join-content-item:nth-child(1) .join-list li {
        width: 50%;
    }

    .join-content-box .join-content-item:nth-child(3) .join-download {
        padding: min(6.6rem, 3.438vw) 0 0;
    }   
}

/* contactus */
.contact-content-wrap {
    display: flex;
    justify-content: space-between;
    padding: min(8rem, 4.167vw) 0 0;
}

.contact-content-box {
    width: 44.39%;
}

.contact-content-item.mobile {
    display: none;
}

.contact-content-item:not(.pc) {
    cursor: pointer;
}

.contact-content-item + .contact-content-item {
    position: relative;
    margin: min(3rem, 1.563vw) 0 0;
    padding: min(3rem, 1.563vw) 0 0;
}

.contact-content-item + .contact-content-item:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: min(4rem, 2.083vw);
    height: min(2px, 0.104vw);
    background: var(--color18);
}

.contact-content-item .company-logo {
    background: var(--color17);
}

.contact-content-item.on .company-logo {
    background: var(--color09);
}

.contact-content-item.giftbar.on .company-logo {
    background: var(--black02);
}

.contact-content-item.rms .company-logo {
    width: min(6.7rem, 3.49vw);
    height: min(2.7rem, 1.406vw);
    mask: url(../../assets/images/contact/img-logo-rms@2x.png) no-repeat center center / 100%;
}

.contact-content-item.rmsp .company-logo {
    width: min(7.4rem, 3.854vw);
    height: min(2.6rem, 1.354vw);
    mask: url(../../assets/images/contact/img-logo-rmsp@2x.png) no-repeat center center / 100%;
}

.contact-content-item.giftbar .company-logo {
    width: min(10.6rem, 5.521vw);
    height: min(8.1rem, 4.219vw);
    mask: url(../../assets/images/contact/img-logo-giftbar@2x.png) no-repeat center center / 100%;
}

.contact-content-item .company-info .company-name {
    display: flex;
    align-items: center;
    gap: 0 min(8px, 0.417vw);
    padding: min(1.4rem, 0.729vw) 0 0;
    font-size: min(2.5rem, 1.302vw);
    line-height: 1;
    font-weight: var(--font-weight-bold);
    color: var(--color17);
}

.contact-content-item.on .company-info .company-name {
    color: var(--black02);
}

.contact-content-item .company-info .company-name .ico-location {
    display: block;
    width: min(1.6rem, 0.833vw);
    height: min(2.4rem, 1.25vw);
    background: var(--color17);
    mask: url(../../assets/images/contact/ico-pin@2x.png) no-repeat center center / 100%;
}

.contact-content-item.on .company-info .company-name .ico-location {
    background: var(--black04);
}

.contact-content-item .address-info {
    padding: min(2rem, 1.042vw) 0 0;
    font-size: min(1.8rem, 0.938vw);
    line-height: min(2.88rem, 1.5vw);
    color: var(--color17);
}

.contact-content-item.on .address-info {
    color: var(--black04);
}

.contact-content-item .address-info .contact-info {
    display: inline-flex;
    align-items: center;
    gap: 0 min(1.5rem, 0.781vw);
}

.contact-content-item .tab-box {
    padding: min(2rem, 1.042vw) 0 0;
}

.contact-content-item .tab-box .tab-list {
    display: flex;
    gap: 0 min(3rem, 1.563vw);
    align-items: center;
}

.contact-content-item .tab-box .tab-list .tab-item .btn-tab {
    padding: 0;
    border: none;
    border-bottom: min(3px, 0.156vw) solid transparent;
    background: transparent;
    cursor: pointer;
    font-size: min(2rem, 1.042vw);
    line-height: min(3rem, 1.563vw);
    font-weight: var(--font-weight-semibold);
    color: var(--color17);
}

.contact-content-item.on .tab-box .tab-list .tab-item.active .btn-tab {
    border-color: var(--black04);
    color: var(--black04);
}

.contact-content-item .tab-content .tab-panel {
    display: none;
}

.contact-content-item .tab-content .tab-panel.active {
    display: block;
}

.kakao-map-box {
    width: 50.46%;
}

.kakao-map-box > div {
    width: 100% !important;
}

#kakao-map {
    border-radius: min(1rem, 0.521vw);
    overflow: hidden;
}

@media (max-width: 1024.98px) {
    /* contact common */
    body.contact .wrapper {
        padding: min(5rem, 11.364vw) 2.8rem min(25.13rem, 57.114vw);
    }

    .contact-title-box .contact-title {
        padding: 0 0 min(1.7rem, 3.864vw);
        font-size: min(4.5rem, 10.227vw);
        line-height: 1;
    }

    .contact-title-box .contact-desc {
        padding: 0 0 min(5rem, 11.364vw);
        font-size: min(2rem, 4.545vw);
        line-height: min(3rem, 6.818vw);
    }

    .contact-title-box .mail-box {
        flex-direction: column;
        align-items: start;
        gap: min(10rem, 22.727vw) 0;
    }

    .contact-title-box .mail-box .mail-title {
        padding: 0 0 min(1.4rem, 3.182vw);
        font-size: min(1.6rem, 3.636vw);
        line-height: min(1.8rem, 4.091vw);
    }

    .contact-title-box .mail-box .mail-link {
        gap: 0 min(1rem, 2.273vw);
        font-size: min(1.8rem, 4.091vw);
        line-height: min(2.5rem, 5.682vw); /* 글자와 라인 사이 간격 조정을 위해 실제 수치보다 축소하여 적용 */
    }

    .contact-title-box .mail-box .mail-link .ico-arrow {
        width: min(1rem, 2.273vw);
        height: min(1rem, 2.273vw);
    }

    .btn-download {
        padding: min(2px, 0.455vw) min(3.1rem, 7.045vw);
        min-width: min(20rem, 45.455vw);
        font-size: min(1.8rem, 4.091vw);
        line-height: min(2.7rem, 6.136vw);
    }

    .btn-download span {
        padding: 0 min(2.4rem, 5.455vw) 0 0;
        background-size: min(1.4rem, 3.182vw);
    }

    /* joinus */
    .joinus-wrap {
        padding: 0 0 min(21.482rem, 48.823vw);
    }

    .join-content-box {
        flex-direction: column;
        gap: min(10rem, 22.727vw) 0;
        padding: min(10rem, 22.727vw) 0 0;
    }

    .join-content-box .join-content-item {
        width: 100%;
    }

    .join-content-box .join-content-item .join-title {
        margin: 0 0 min(3.8rem, 8.636vw);
        padding: 0 0 min(9px, 2.045vw);
        font-size: min(2.8rem, 6.364vw);
        line-height: min(4.2rem, 9.545vw);
    }

    .join-content-box .join-content-item .join-list {
        gap: min(3.9rem, 8.864vw) 0;
    }

    .join-content-box .join-content-item .join-list li .txt01 {
        font-size: min(2rem, 4.545vw);
        line-height: min(3rem, 6.818vw);
    }

    .join-content-box .join-content-item .join-list li .txt02 {
        padding: min(1.3rem, 2.955vw) 0 0;
        font-size: min(1.8rem, 4.091vw);
        line-height: min(2.88rem, 6.545vw);
    }

    .join-content-box .join-content-item .join-list li .txt02 span + span {
        padding: min(4px, 0.909vw) 0 0;
    }

    .join-content-box .join-content-item .join-download {
        padding: min(4rem, 9.091vw) 0 0;
    }

    /* contactus */
    .contact-content-wrap {
        flex-direction: column-reverse;
        gap: min(5rem, 11.364vw) 0;
        padding: 0;
    }

    .contact-content-box {
        width: 100%;
    }

    .contact-content-item.mobile {
        display: block;
    }

    .contact-content-item.pc {
        display: none;
    }

    .contact-content-item.pc + .mobile {
        margin: 0;
        padding: 0;
    }

    .contact-content-item.pc + .mobile:before {
        display: none;
    }

    .contact-content-item + .contact-content-item {
        margin: min(5rem, 11.364vw) 0 0;
        padding: min(5rem, 11.364vw) 0 0;
    }

    .contact-content-item + .contact-content-item:before {
        width: min(4rem, 9.091vw);
        height: min(2px, 0.455vw);
        background: var(--color17);
    }

    .contact-content-item.rms .company-logo {
        width: min(6.7rem, 15.227vw);
        height: min(2.624rem, 5.964vw);
    }

    .contact-content-item.rms .company-info .company-name {
        padding: min(1.4rem, 3.182vw) 0 0;
    }

    .contact-content-item.rmsp .company-logo {
        width: min(7.4rem, 16.818vw);
        height: min(2.554rem, 5.805vw);
    }

    .contact-content-item.giftbar .company-logo {
        width: min(10.6rem, 24.091vw);
        height: min(8.1rem, 18.409vw);
    }    

    .contact-content-item .company-info .company-name {
        gap: 0 min(7.5px, 1.705vw);
        font-size: min(2.6rem, 5.909vw);
        line-height: min(3.64rem, 8.273vw);
    }

    .contact-content-item.rms .company-info .company-name {
        padding: min(1.4rem, 3.182vw) 0 0;
    }

    .contact-content-item.rmsp .company-info .company-name {
        padding: min(2rem, 4.545vw) 0 0;
    }

    .contact-content-item.giftbar .company-info .company-name {
        padding: min(4px, 0.909vw) 0 0;
    }

    .contact-content-item .company-info .company-name .ico-location {
        width: min(1.6rem, 3.636vw);
        height: min(2.4rem, 5.455vw);
    }

    .contact-content-item .company-info .branch-name {
        font-size: min(2rem, 4.545vw);
        line-height: min(3rem, 6.818vw);
        font-weight: var(--font-weight-semibold);
        color: var(--color17);
    }

    .contact-content-item.on .company-info .branch-name {
        color: var(--black02);
    }

    .contact-content-item .address-info {
        font-size: min(1.8rem, 4.091vw);
        line-height: min(2.88rem, 6.545vw);
    }

    .contact-content-item .address-info .contact-info {
        flex-wrap: wrap;
        gap: 0 min(1rem, 2.273vw);
    }

    .kakao-map-box {
        margin: min(5rem, 11.364vw) 0 0;
        width: 100%;
    }

    .kakao-map-box > div {
        height: 30rem !important;
    }
}