
/* -------------------------------- */
* {

}

body {
    min-width: 360px;
}

.gap-240 {
    gap: 240px;
}

.inner {
    width: 100%;
    position: relative;
}

.inner-lg {
    max-width: 1200px;
    width: calc(100% - 64px);
    padding: 0 32px;
    margin: 0 auto;

}

.content_text.black {
    color: #000;
}

.content_text.orange {
    color: #FF5800;
}

.white {
    color: #FFF !important;
}

/* sect1 */
.sect1 {
    background: url(/resources/images/goodDelivery/sect1/1.png) no-repeat center / cover fixed;
}

.sect1 .inner {
    height: 100vh;
    z-index: 1;
}

.sect1 .content_text {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.sect1 .content_text {
    max-width: 429px;
    /*width: calc(100% - 48px);*/
    color: #fff;
    font-family: 'Pretendard Variable', sans-serif;
    /* padding-left: clamp(16px, 15vw, 18rem); */
    padding: 0 24px 0 clamp(24px, 15vw, 18rem);
}

.sect1 .content_text span {
    font-weight: 700;
}

.sect1 .content_text .h1 {
    padding: 2rem 0 3rem;
}

.sect1 .content_text p {
    line-height: 2rem;
    color: #fff;
    font-weight: 600;
}


/* sect2 */
.sect2 .inner-lg {
    padding-top: 15rem;
    padding-bottom: 15rem;
}

.sect_title {
    font: 600 2.125rem/123% 'SUIT Variable', 'Pretendard Variable';
    letter-spacing: -0.68px;
}

.sect_title + .explanation {
    padding-top: 3.5rem;
    font: 400 1.25rem/190% 'Pretendard Variable';
    letter-spacing: -0.4px;
}


/* sect3 */
.sect3 {
    background: url(/resources/images/goodDelivery/sect3/1.png) no-repeat fixed center;
    background-size: cover;
}

.sect3 .inner-lg {
    /*height: 100vh;*/
    /*max-height: 854px;*/
}

.sect3 .inner > .content_text {
    margin-top: 11.3rem;
}

.sect3 .content_text > .content_text {
    max-width: 430px;
    width: 100%;
    position: absolute;
    right: 52px;
    padding-bottom: 11.25rem;
}

.office_title {
    font: 600 1.625rem/130% 'SUIT Variable';
}

.office_title + .office_info {
    padding-top: 2rem;
    font: 900 6.25rem/128% 'SUIT Variable';
    word-break: break-word;
}

.sub_title {
    font: 800 2.125rem/124% 'SUIT Variable';
    letter-spacing: -0.68px;
}

.sub_title + .sub_info {
    padding-top: 2.5rem;
    font: 400 1.125rem/189% 'Pretendard Variable';
    letter-spacing: -0.36px;
}

/* sect5 */
.sect4 .inner-lg {
    padding: 15rem 0;
}

.sect4 img {
    margin-top: 10rem;
}

/* sect5 */
.sect5 {

}


.sect5 .fir_article .inner-lg {
    padding-top: 11.25rem;
    padding-bottom: 7.5rem;
}

.sect5 .fir_article .sect_title + .explanation {
    max-width: 996px;
    width: 100%;
    margin: 0 auto;
}

.sect5 .sec_article {
    background-color: #FFF9EE;
}

.sect5 .sec_article .inner-lg {

    padding-top: 11.25rem;
    padding-bottom: 11.25rem;
}

.sect5 .sec_article .inner-lg img {
    width: 100%;
}

/* sect6 */
.sect6 .inner-lg {
    padding-top: 15rem;
    padding-bottom: 15rem;
}

.sect6 .sect_title + .explanation {
    max-width: 996px;
    margin: 0 auto;
}

/*sect7*/
.sect7 .fir_article {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), url(/resources/images/goodDelivery/sect7/4.png) no-repeat fixed center;
    background-size: cover;
}

.sect7 .fir_article .inner-lg {

    padding-bottom: 11.25rem;
}

.sect7 .fir_article .inner > .content_text {
    margin-top: 11.3rem;
}

.sect7 .content_text > .content_text {
    max-width: 430px;
    width: 100%;
    position: absolute;
    right: 35px;
    padding-bottom: 11.25rem;
}

.sect7 .sec_article {
    padding-top: 15rem;
    padding-bottom: 15rem;

}

.research .sect_title {
    gap: 2rem;
}

.research .sect_title:after {
    content: "";
    display: block;
    flex: 1 0 0;
    height: 0.5px;
    background-color: #ccc;
}

.research .explanation > span {
    font: 500 1.5rem/133% 'Pretendard Variable';
}

.research .explanation ul {
    margin-top: 2.5rem;
    counter-reset: circle-counter;
    gap: 1rem;
}

.research .explanation li {
    counter-increment: circle-counter;
    gap: 1.125rem;
    display: flex;
    align-items: flex-start;
    font: 400 1.25rem/190% 'Pretendard Variable';
}

.research .explanation li::before {
    content: counter(circle-counter);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 29px;
    height: 29px;
    border: 1px solid #CCC;
    background-color: #F4F4F4;
    border-radius: 50em;
    font-size: 1rem;
    font-family: 'Pretendard Variable', sans-serif;
    flex: 0 0 30px;
    margin-top: 4px;
}

/* sect8 */
.sect8 {
    background-color: #FAFAFA;
}

.sect8 .inner-lg {
    padding-top: 15rem;
    padding-bottom: 15rem;
}

/* sect9 */
.sect9 {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), url(/resources/images/goodDelivery/sect9/1.png) no-repeat fixed center;
    background-size: cover;
}

/*.sect9 .inner-lg {*/
/*    height: 100vh;*/
/*    max-height: 940px;*/
/*}*/

.sect9 .inner > .content_text {
    margin-top: 11.25rem;
}

.sect9 .content_text .sub_title {
    line-height: 130%;
}

.sect9 .content_text > .content_text {
    max-width: 430px;
    width: 100%;
    position: absolute;
    right: 27px;
    /*bottom: 0px;*/
    padding-bottom: 11.25rem;
}

/*sect10*/
.sect10 {
    padding-top: 11.25rem;
    padding-bottom: 11.25rem;
}

.sect10 .sect_title + .explanation, .sect12 .info_img {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    width: calc(100% - 3rem);
}

.keyword_list {
    display: flex;
    align-items: flex-start;
    padding: 0 1.5rem;
    gap: 3rem;
    justify-content: center;
    flex-wrap: wrap;
}

.keyword_list li {
    flex: 1 0 352px;
    max-width: 485px;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.keyword_list .round_info {
    width: 100%;
    aspect-ratio: 1/1;
    background: #F6F6F6 url(/resources/images/goodDelivery/sect10/1.png) no-repeat center / contain;
    mix-blend-mode: multiply;
    border-radius: 50em;
    overflow: hidden;
}

.keyword_list .round_info .keyword {
    font: 700 2.375rem/137% 'SUIT Variable';
    letter-spacing: -0.76px
}

.keyword_list .round_info .ko_keyword {
    font: 300 1.125rem/189% 'Pretendard Variable';
    letter-spacing: -0.36px
}

.keyword_list .round_info + p {
    color: #333;
    font: 400 1.25rem/190% 'Pretendard Variable';
    letter-spacing: -0.025px;
    padding: 0 1.25rem;
    text-align: center;
}

/*sect11*/
.sect11 > .inner-lg {
    padding-top: 11.25rem;
    padding-bottom: 11.25rem;
}

.sect11 .color_list {
    padding: 2.5rem 0;
    font: 400 1.125rem/188% 'SUIT Variable'
}

.sect11 > div:nth-of-type(2) {
    background-color: #F3F3F3;
}

.sect11 > div:nth-of-type(3) {
    background-color: #222222;
    color: #fff;
}

.sect11 > div:nth-of-type(4) {
    background-color: #FFCF00;
}

.sect11 > div:nth-of-type(5) {
    background-color: #FF9F0A;
    padding: 2.5rem 0 0 0;
}

.mockup_img {
    gap: 5rem;
    padding-top: 10.6rem;
    padding-bottom: 14.94rem;
}

.sect11 img {
    margin: 10.37rem auto 15rem;
    max-width: 880px;
    width: 100%;
    /*box-shadow: -150px 50px 250px 0px rgba(0, 0, 0, 0.08);*/
    filter: drop-shadow(-150px 50px 250px rgba(0, 0, 0, 0.08));
    will-change: filter;
}

/*sect12 */
.sect12 .inner-lg {
    padding-top: 15rem;
    padding-bottom: 15rem;
}

.img_list {
    max-width: 996px;
    width: calc(100% - 2rem);
    margin: 0 auto;
    padding: 0 1rem;
    display: flex;
    flex-direction: column;
    gap: 3.5rem;

}


.img_list:nth-of-type(2) {

    margin-top: 7.5rem;
}

.img_list:nth-of-type(3) {
    margin: 3.5rem auto;
}

.img_list img {
    height: 140px;
}

.sect12 .info_img {
    margin-top: 11.25rem;
}

.sect12 .keyword_list {
    gap: 6.25rem;
    max-width: 996px;
    width: calc(100% - 2rem);
    margin: 11.25rem auto 0;
    flex-wrap: wrap;
}

.sect12 .keyword_list li {
    flex: 1 1 200px
}

.sect12 .keyword_list img {
    width: 100%;
}

.swiper-slide {
    min-width: 960px;
}

/*sect13*/
.sect13 {
    background-color: #FF9F0A;
}

.sect13 .sect_title + .explanation {
    max-width: 486px;
}

.sect13 .inner-lg, .sect14 > .inner-lg {
    padding-top: 15rem;
}

.sect13 .content_text > img {
    width: 64px;
    margin-bottom: 5rem;
}

.sect13 .content_text + img {
    max-width: 740px;
    width: 100%;
    margin-top: 7.5rem;
}

/*sect14*/
.sect14 > .inner-lg {
    padding: 15rem 0 0 0;
}

.sect14 .fir_article {

}

.sect14 .content_text {
    margin-top: 3rem
}

.content_text.v2 {
    max-width: 486px;
}


.content_text.v2 .sect_title + .explanation {
    color: #333;
    padding-top: 2.5rem;
    letter-spacing: -0.4px;
}

.sect14 .fir_article .content_text + img {
    max-width: 786px;
    width: 100%;
    position: sticky;
    margin-left: -72px;
    filter: drop-shadow(40px 40px 100px rgba(0, 0, 0, 0.08));
    will-change: filter;
}

.round_bg > .inner-lg {
    padding-top: 19.5rem;
    padding-bottom: 15rem;
}

.round_bg:before {
    content: "";
    width: 100%;
    display: block;
    height: 100%;
    border-radius: 60rem;
    background: linear-gradient(180deg, #F6F6F6 0%, #FFF 100%);
    position: absolute;
    top: -229px;
    z-index: -1;
}

.sect14 .sec_article .content_text {
    margin-right: 4.37rem;
    margin-bottom: 6rem
}

.sect14 .sec_article img {
    max-width: 376px;
    width: 100%;
    filter: drop-shadow(40px 40px 100px rgba(0, 0, 0, 0.08));
    will-change: filter;
}

.sect14 .sec_article .posi-relative {
    margin-top: 17.5rem;
}

.sect14 .sec_article .posi-relative:last-of-type .txt_badge {
    top: 0;
}

.sect14 .sec_article .posi-relative:last-of-type img {
    margin-top: 9.25rem;
}

.sect14 .sec_article .posi-relative img {
    max-width: 680px;
    width: 100%;

    filter: drop-shadow(40px 40px 100px rgba(0, 0, 0, 0.08));
    will-change: filter;
}

.sect14 .sec_article .txt_badge {
    position: absolute;
    top: -31px;
}

.sect14 .sec_article .txt_badge > span {
    font: 600 1.25rem/190% 'Pretendard Variable';
    text-decoration: underline;
    letter-spacing: -0.4px;
}

.sect14 .sec_article .txt_badge > .d-flex {
    gap: 1rem
}

/*sect15*/
.sect15 {
    background: #152031 url(/resources/images/goodDelivery/sect15/1.png) no-repeat center top 42%
}

.sect15 .inner-lg {
    padding-top: 15rem;
}

.sect15 img {
    margin-top: 11.25rem;
    max-width: 400px;
}

/*sect16 */
.sect16 .fir_article {
    gap: 13rem;
    margin-bottom: 17.5rem;
}

.sect16 .inner-lg {
    padding-top: 15rem;
    padding-bottom: 15rem;
}

.fir_article img {
    max-width: 376px;
    filter: drop-shadow(40px 40px 100px rgba(0, 0, 0, 0.08));
    will-change: filter;
}

.fir_article + img {
    max-width: 1072px;
    width: 100%;
    filter: drop-shadow(40px 40px 100px rgba(0, 0, 0, 0.08));
    will-change: filter;
}

/* sect17 */
.sect17 {

    background: #FFA92C url(/resources/images/goodDelivery/sect17/1.png) no-repeat bottom right / contain;

}

.sect17 .inner-lg {
    height: 1336px;
    padding-top: 15rem;
    padding-bottom: 15rem;
}

/*sect18 */
.sect18 {
    padding-top: 62.5%;
    background: #FAFAFA url(/resources/images/goodDelivery/sect18/1.png) no-repeat center / contain;

}

/*360, 720, 1080, 1440 */
@media screen and (max-width: 1240px) {
    .sect14 .fir_article .content_text + img {
        margin-left: 0;
        margin-top: 100px;
    }

    .sect17 {
        background-size: 100%;
    }

    .sect17 .inner-lg {
        height: 100vh


    }
}

@media screen and (max-width: 1080px) {
}

@media screen and (max-width: 768px) {
    html {
        font-size: 13px!important;
    }
    .office_title + .office_info {
        font-size: 46px;
        padding-right: 22px;
    }

    .sect1 {
        position: relative;
        background-color: #FF9401;
        background-position: bottom -45px center
    }


    .sect1 .content_text {
        padding: 0 32px;
    }

    .sect1 .content_text span, .sect1 .content_text p, .sect1 .content_text h1 {
        text-shadow: 1px 1px 20px rgba(0, 0, 0, 0.16);
    }



    .sect1, .sect3, .sect7, .sect9, .sect7 .fir_article {
        background-attachment: unset;
    }


    .sect3 .content_text > .content_text, .sect7 .content_text > .content_text, .sect9 .content_text > .content_text {
        padding: 0 32px 0;
        width: calc(100% - 96px);
        left: 32px;
        /*bottom: 351px;*/
    }

    .sect2 .inner-lg,.sect4 .inner-lg, .sect6 .inner-lg, .sect10, .sect11 > .inner-lg, .round_bg > .inner-lg ,.sect7 .sec_article,.sect8 .inner-lg{
        padding-top: 120px;
        padding-bottom: 120px;
    }
    .sect5 .fir_article .inner-lg{
        padding-top: 0;
    }
    .sect11 > .inner-lg, .sect12 .inner-lg, .sect16 .inner-lg {
        padding-top: 120px;
        padding-bottom: 100px;
    }

    .sect13 .inner-lg, .sect14 > .inner-lg, .sect15 .inner-lg {
        padding: 120px 0 0 0;
    }

    .sect13 .content_text + img {

        margin-top: 100px;
    }

    .sect5 .sec_article .inner-lg {
        padding-top: 97px;
        padding-bottom: 97px;
    }


    .sect4 img, .sect12 .info_img, .sect15 img {
        margin-top: 100px;
    }

    .sect14 .sec_article .posi-relative {
        margin-top: 120px;
    }

    .gap-240, .sect16 .fir_article {
        gap: 100px !important;
    }

    .sect7 .fir_article, .sect9 ,.sect3{
        padding-bottom: 120px;
    }

    .sect11 .color_list {
        padding: 16px 0;
    }

    .sect11 > div:nth-of-type(5) {
        padding-top: 16px
    }

    .img_list img {
        height: auto;
    }

    .swiper-slide {
        min-width: 510px;
    }

    .sect13 .content_text > img {
        width: 56px;
    }

    .sect14 .fir_article .content_text + img {
        padding: 0 16px;
        width: calc(100% - 32px);
    }

    .sect14 .sec_article img, .sect14 .sec_article .posi-relative img {
        padding: 0 16px;
        width: calc(100% - 32px);
    }

    .sect14 .sec_article > .content_text + img, .sect15 img, .fir_article img {
        max-width: 200px;
    }
    .sect14 .content_text,.sect14 .sec_article .content_text{
        margin-top: 0;
    }
    .sect15 img {
        margin-top: 60px;
    }

    .sect16 .fir_article {
        margin-bottom: 100px;
    }

    .sect17 {
        background-size: 120%;
        background-position: right -37px bottom 40px;
    }

    .sect17 .inner-lg {
        padding-top: 120px;
        padding-bottom: 120px;
        height: calc(100vh - 267px);
    }

}

@media screen and (max-width: 550px) {
    .sect15 {
        background: #152031 url(/resources/images/goodDelivery/sect15/1.png) no-repeat center top 65%;
        background-size: 140%;
    }
}