@charset "UTF-8";


.page_frame {
    width:100%; line-height:28px; word-break: keep-all; word-wrap: break-word;
    font-size: min( calc(10 / 500 * 100vw ), 10px);
}


.page_frame .scroll_txt {
    font-size: 14px; color: #ff0000; font-weight: 400; line-height: 1.4; margin-bottom: 1em;
    text-align: center; display: none;
}


/* p101 -----------------------------------------------------------------------*/
.p101 .p_sec1 {
    display: flex; gap: 8em; align-items: center; justify-content: space-between;
}
.p101 .p_sec1 .text_box {flex: 1;}
.p101 .p_sec1 .text_box .p_title {font-size: max(25px, 3.5em); font-weight: bold; color: #fe2d06; margin-bottom: 0.6em; line-height: 1.3;}
.p101 .p_sec1 .text_box .text_wrap p {color: #434343; font-size: max(14px, 1.8em); line-height: 1.5; font-weight: 400;}
.p101 .p_sec1 .text_box .text_wrap > p:not(:last-child) {margin-bottom: 1.5em;}
.p101 .p_sec1 .text_box .text_wrap h3 {
    font-size: max(15px, 1.8em); line-height: 1.2; color: #000; font-weight: bold;
}

@media (1131px <= width <= 1430px) {
    .p101 .p_sec1 .text_box .p_title br {display: none;}
    .p101 .p_sec1 .text_box .text_wrap p br {display: none;}
    .p101 .p_sec1 .img {width: 50%;}
    .p101 .p_sec1 .img img {width: 100%;}
}

@media (max-width: 1430px) {
    .p101 .p_sec1 {gap: 6em;}
}

@media (max-width: 1130px) {
    .p101 .p_sec1 {flex-direction: column;}
    .p101 .p_sec1 .text_box {width: 100%; max-width: 750px;}
    .p101 .p_sec1 .text_box .text_wrap h3 {text-align: right;}
}

@media (max-width: 768px) {
    .p101 .p_sec1 .text_box .p_title {text-align: center;}
    .p101 .p_sec1 .text_box .text_wrap {text-align: center;}
    .p101 .p_sec1 .text_box .text_wrap h3 {text-align: center;}

    .p101 .p_sec1 .text_box .text_wrap p br {display: none;}
}

/* p101 끝 -----------------------------------------------------------------------*/


/* p102 -----------------------------------------------------------------------*/

.p102 .p_sec1 > h5 {
    font-size: max(14px, 1.8em); color: #434343; line-height: 1.4;
    font-weight: 400; text-align: center;
}

.p102 .p_sec1 .itemBox {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 4.5em;
    grid-auto-rows: minmax(39.3em, auto); margin: 3em 0 10.6em;
}
.p102 .p_sec1 .itemBox > li {
    overflow: hidden; border-radius: 2em;
    background: #ffa08f; padding: 3em 15px 10px;
    text-align: center; display: flex; flex-direction: column;
    align-items: center; color: #fff;
}
.p102 .p_sec1 .itemBox > li img {font-size: 1em; width: 11.1em;}
.p102 .p_sec1 .itemBox > li h4 {
    font-size: max(18px, 2.5em); font-weight: bold; line-height: 1.2; margin: 1em auto 0.5em;
    color: inherit;
}
.p102 .p_sec1 .itemBox > li p {font-size: max(14px, 1.8em); font-weight: 400; line-height: 1.4; color: inherit;}

.p102 .p_sec1 .table_box {border: 2px solid #cd3d23; border-left: none; border-right: none;}
.p102 .p_sec1 .table_box table tr td {
    font-size: max(14px, 1.8em); color: #000; font-weight: 400;
    text-align: center; background: #fff; padding: 1em 10px;
    border-bottom: 1px solid #b2b2b2;
}
.p102 .p_sec1 .table_box table tr td:first-child {
    background: #f7f7f7; font-weight: bold;
    border-right: 1px solid #cd3d23;
}

.p102 .p_sec1 .table_box table tr td br {display: none;}

@media (max-width: 1430px) {
    .p102 .p_sec1 .itemBox > li p br {display: none;}
}

@media (max-width: 991px) {
    .p102 .p_sec1 .itemBox {display: grid; grid-template-columns: repeat(2, 1fr); justify-items: center;}
    .p102 .p_sec1 .itemBox > li:last-child {grid-column: 1/3;}
    .p102 .p_sec1 .itemBox > li {width: 100%; max-width: 440px;}
}


@media (max-width: 768px) {
    .p102 .p_sec1 .itemBox {display: grid; grid-template-columns: repeat(1, 1fr); gap: 5em; justify-items: center;}
    .p102 .p_sec1 .itemBox > li:last-child {grid-column: unset;}
    .p102 .p_sec1 .itemBox > li {width: 100%; max-width: 100%;}

    .p102 .p_sec1 .table_box table tr td br {display: block;}
}

/* p102 끝-----------------------------------------------------------------------*/

/* p103  -----------------------------------------------------------------------*/

.p103 .p_sec1 > h3 {
    font-size: max(18px, 2.5em); color: #000; line-height: 1.3;
    font-weight: bold; text-align: center; position: relative;
    padding: 0 1.5em; width: 100%; max-width: 1097px; margin: 0 auto;
}
.p103 .p_sec1 > h3::before, .p103 .p_sec1 > h3::after {
    position: absolute; top: -0.45em; color: #fe2d06;
    font-size: 2.5em; height: 0.6em;
}
.p103 .p_sec1 > h3::before {
    content:'“'; left: 0;
}
.p103 .p_sec1 > h3::after {
    content:'”'; right: 0;
}

.p103 .p_sec1 .itemBox {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 5em;
    grid-auto-rows: minmax(35.4em, auto); margin: 6.5em 0 5em;
}
.p103 .p_sec1 .itemBox > li {
    overflow: hidden; border-radius: 2em;
    background: #ffa08f; padding: 6em 15px 10px;
    text-align: center; display: flex; flex-direction: column;
    align-items: center; color: #fff;
}
.p103 .p_sec1 .itemBox > li img {font-size: 1em; width: 11.1em;}
.p103 .p_sec1 .itemBox > li h4 {
    font-size: max(18px, 2.5em); font-weight: bold; line-height: 1.2; margin: 1em auto 0.5em;
    color: inherit;
}
.p103 .p_sec1 .itemBox > li p {font-size: max(14px, 1.8em); font-weight: 400; line-height: 1.4; color: inherit;}

@media (max-width: 1430px) {
    .p103 .p_sec1 .itemBox > li p br {display: none;}
}

@media (max-width: 1200px) {
    .p103 .p_sec1 .itemBox {display: grid; grid-template-columns: repeat(2, 1fr); justify-items: center;}
    .p103 .p_sec1 .itemBox > li {width: 100%;}
}

@media (max-width: 768px) {
    .p103 .p_sec1 .itemBox {
        display: grid; grid-template-columns: repeat(1, 1fr); 
        gap: 5em; justify-items: center; grid-auto-rows: minmax(32em, auto);
    }
}


/* p103 끝-----------------------------------------------------------------------*/

/* 그룹2번 페이지 공통  -----------------------------------------------------------------------*/

.page_gr_2 .p_title2 {
    font-size: max(18px, 2.5em); color: #000; line-height: 1.2;
    text-align: center; font-weight: bold; margin-bottom: 1em;
}
.page_gr_2 .p_title3 {
    font-size: max(14px, 1.8em); color: #434343; line-height: 1.4;
    text-align: center;
}

/* sec_t1 */
.page_gr_2 .sec_t1 .itemBox {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 7em;
}

.page_gr_2 .sec_t1 .itemBox > li {
    border-radius: 3em; border: 1px solid #dd452d;
    padding: 4.2em 2em 3.5em; 
    display: flex; flex-direction: column; align-items: center;
}
.page_gr_2 .sec_t1 .itemBox > li > h1 {
    border-radius: 2em; background: #db3920;
    width: 100%; max-width: 29em; text-align: center;
    padding: 1.3em 10px; margin-bottom: 2.5em;
    color: #fff;
}
.page_gr_2 .sec_t1 .itemBox > li > h1 span {font-size: max(18px, 2.5em); font-weight: bold; line-height: 1.2;}
.page_gr_2 .sec_t1 .itemBox > li > h5 {
    font-size: max(14px, 1.8em); color: #000;
    font-weight: bold; line-height: 1.4;
}
.page_gr_2 .sec_t1 .itemBox > li > .txt_box {
    margin-top: 2em;
    display: flex; text-align: center; align-items: center; 
}
.page_gr_2 .sec_t1 .itemBox > li > .txt_box p {
    font-size: max(14px, 1.8em); color: #434343;
    line-height: 1.6; font-weight: 400;
}

@media (992px <= width <= 1430px) {
    .page_gr_2 .sec_t1 .itemBox > li > h5 br {display: none;}
}

@media (max-width: 1430px) {
    .page_gr_2 .sec_t1 .itemBox {gap: 3em;}
    .page_gr_2 .sec_t1 .itemBox > li > .txt_box p br {display: none;} 
}

@media (max-width: 991px) {
    .page_gr_2 .sec_t1 .itemBox {
        grid-template-columns: repeat(1, 1fr);
    }
    
}


/* sec_t2 */
.page_gr_2 .sec_t2 .itemBox {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 4.5em; margin-top: 5em;
}

@media (max-width: 991px) {
    .page_gr_2 .sec_t2 .itemBox {display: grid; grid-template-columns: repeat(2, 1fr); justify-items: center;}
}

@media (max-width: 768px) {
    .page_gr_2 .sec_t2 .itemBox {display: grid; grid-template-columns: repeat(1, 1fr); gap: 3.5em; justify-items: center;}
}


/* 그룹2번 페이지 공통 끝 -----------------------------------------------------------------------*/

/* p201 -----------------------------------------------------------------------*/

.p201 .p_sec1 {margin-bottom: 8em;}
.p201 .p_sec1 .itemBox {grid-auto-rows: minmax(54em, auto);}
.p201 .p_sec1 .itemBox > li > h5 {
    display: flex; text-align: center;
    align-items: center; min-height: 3.333em;
}
.p201 .p_sec1 .itemBox > li > .txt_box {min-height: 30em;}

.p201 .p_sec2 .itemBox > li {
    overflow: hidden; border-radius: 2em; background: #eee;
    text-align: center;
}
.p201 .p_sec2 .itemBox > li .img {
    overflow: hidden; border-radius: 2em;
}
.p201 .p_sec2 .itemBox > li > h5 {
    font-size: max(14px, 1.8em); color: #000; line-height: 1.2;
    line-height: 1.2; margin: 0.8em auto;
}



@media (max-width: 991px) {
    .p201 .sec_t1 .itemBox {grid-auto-rows: minmax(37em, auto);}
    .p201 .sec_t1 .itemBox > li > .txt_box {min-height: auto;}
}


/* p201 끝-----------------------------------------------------------------------*/

/* p202 -----------------------------------------------------------------------*/

.p202 .p_sec1 {margin-bottom: 8em;}
.p202 .p_sec1 .itemBox {grid-auto-rows: minmax(24.7em, auto); text-align: center;}
.p202 .p_sec2 .itemBox {margin-top: 0;}

@media (max-width: 991px) {
    /* .p201 .sec_t1 .itemBox {grid-auto-rows: minmax(37em, auto);} */
}


/* p202 끝-----------------------------------------------------------------------*/

/* p203 -----------------------------------------------------------------------*/

.p203 .p_sec1 .itemBox {gap: 3.5em 4.5em;}

@media (min-width: 992px) {
    .p203 .p_sec1 .itemBox > li:nth-child(3) {grid-row: 1/3; grid-column: 3;}
    .p203 .p_sec1 .itemBox > :is(li:nth-child(4), li:nth-child(5)) {grid-row: 2;}
}


@media (max-width: 991px) {
    .p203 .p_sec1 .itemBox {grid-template-columns: repeat(2, 1fr); gap: 3.5em;}
    .p203 .p_sec1 .itemBox > li:nth-child(3) {grid-row: 1/3; grid-column: 2;}
}

@media (max-width: 768px) {
    .p203 .p_sec1 .itemBox {gap: 2em;}
}

/* p203 끝-----------------------------------------------------------------------*/

/* p204 -----------------------------------------------------------------------*/

.p204 .p_sec1 .itemBox {gap: 3.5em 4.5em;}

@media (max-width: 991px) {
    .p204 .p_sec1 .itemBox {grid-template-columns: repeat(2, 1fr); gap: 3.5em;}
    .p204 .p_sec1 .itemBox > li:first-child {grid-column: 1/3; grid-row: 1; width: 46.4%;}
}

/* p204 끝-----------------------------------------------------------------------*/


/* p205 -----------------------------------------------------------------------*/

.p205 .p_sec1 .itemBox {gap: 4em 4.5em; display: flex; flex-wrap: wrap;}

@media (min-width: 992px) {
    .p205 .p_sec1 .itemBox > li {width: calc(100% / 2 - 23px);}
    .p205 .p_sec1 .itemBox > li:not(:first-child, :nth-child(2)){
        width: calc(100% / 3 - 30px);
    }
    .p205 .p_sec1 .itemBox > li img {width: 100%;}
}

@media (max-width: 991px) {
    .p205 .sec_t2 .itemBox {display: grid; grid-template-columns: repeat(2, 1fr); gap: 3.5em;}
    .p205 .p_sec1 .itemBox > li:first-child {grid-column: 1/3; grid-row: 1;}
    .p205 .p_sec1 .itemBox > li:nth-child(2) {grid-column: 1/3; grid-row: 2;}
}


/* p205 끝-----------------------------------------------------------------------*/


/* p206 -----------------------------------------------------------------------*/

@media (max-width: 768px) {
    /* .p206 .sec_t2 .itemBox {grid-template-columns: repeat(2, 1fr); gap: 3.5em;} */
}


/* p206 끝-----------------------------------------------------------------------*/


/* p207 -----------------------------------------------------------------------*/

.p207 .sec_t2 .itemBox {display: flex; gap: 3.5em;}

@media (max-width: 991px) {
    .p207 .sec_t2 .itemBox {flex-direction: column; align-items: center;}
    .p207 .sec_t2 .itemBox > li {width: 100%; max-width: 780px;}
    .p207 .sec_t2 .itemBox > li img {width: 100%; display: block; margin: 0 auto;}
}


/* p207 끝-----------------------------------------------------------------------*/


/* p208 -----------------------------------------------------------------------*/

@media (max-width: 991px) {
    .p208 .p_sec1 .itemBox > li:last-child {grid-column: 1/3; width: 46.7%; max-width: 100%;}
    .p208 .p_sec1 .itemBox > li {width: 100%; max-width: 440px;}
}


@media (max-width: 768px) {
    .p208 .p_sec1 .itemBox {grid-template-columns: repeat(1, 1fr);}
    .p208 .p_sec1 .itemBox > li:last-child {grid-column: unset; width: 100%;}
    .p208 .p_sec1 .itemBox > li {width: 100%; max-width: 100%;}
    .p208 .p_sec1 .itemBox > li img {display: block; margin: 0 auto;}
}

/* p208 끝-----------------------------------------------------------------------*/

/* p209 -----------------------------------------------------------------------*/

@media (max-width: 991px) {
    .p209 .p_sec1 .itemBox > li:last-child {grid-column: 1/3; width: 46.7%; max-width: 100%;}
    .p209 .p_sec1 .itemBox > li {width: 100%; max-width: 440px;}
}


@media (max-width: 680px) {
    .p209 .p_sec1 .itemBox {grid-template-columns: repeat(1, 1fr);}
    .p209 .p_sec1 .itemBox > li:last-child {grid-column: unset; width: 100%;}
    .p209 .p_sec1 .itemBox > li {width: 100%; max-width: 100%;}
    .p209 .p_sec1 .itemBox > li img {display: block; margin: 0 auto;}
}

/* p209 끝-----------------------------------------------------------------------*/

/* p210 -----------------------------------------------------------------------*/

@media (max-width: 991px) {
    .p210 .p_sec1 .itemBox > li:last-child {grid-column: 1/3; width: 46.7%; max-width: 100%;}
    .p210 .p_sec1 .itemBox > li {width: 100%; max-width: 440px;}
}


@media (max-width: 680px) {
    .p210 .p_sec1 .itemBox {grid-template-columns: repeat(1, 1fr);}
    .p210 .p_sec1 .itemBox > li:last-child {grid-column: unset; width: 100%;}
    .p210 .p_sec1 .itemBox > li {width: 100%; max-width: 100%;}
    .p210 .p_sec1 .itemBox > li img {display: block; margin: 0 auto;}
}

/* p210 끝-----------------------------------------------------------------------*/


/* 그룹3번 페이지 공통  -----------------------------------------------------------------------*/

.page_gr_3 .p_title2 {
    font-size: max(16px, 2.3em); color: #434343; line-height: 1.3;
    font-weight: bold;
}
.page_gr_3 .p_title3 {
    font-size: max(14px, 1.8em); color: #434343; line-height: 1.4;
    text-align: center; 
}
.page_gr_3 .text1 {
    font-size: max(14px, 1.8em); color: #434343; line-height: 1.4;
    font-weight: 400;
}

/* sec_t1 */
.page_gr_3 .sec_t1 .itemBox {
    display: flex; align-items: center; gap: 8em;
    margin-top: 4.5em; justify-content: center;
}
.page_gr_3 .sec_t1 .itemBox .list {margin-top: 1.8em;}
.page_gr_3 .sec_t1 .itemBox .list > li {padding-left: 1em; position: relative;}
.page_gr_3 .sec_t1 .itemBox .list > li > div {display: flex; align-items: center; gap: 1em;}
.page_gr_3 .sec_t1 .itemBox .list > li h5 {min-width: 6.9444em; line-height: 1.2;}
.page_gr_3 .sec_t1 .itemBox .list > li:not(:last-child) {margin-bottom: 0.4em;}
.page_gr_3 .sec_t1 .itemBox .list > li span {position: absolute; top: 50%; transform: translateY(-50%);}
.page_gr_3 .sec_t1 .itemBox .list > li span::before {
    content:''; position: absolute; top: 50%; left: -1em;
    transform: translateY(-50%); background: #bd1207;
    width: 0.3333em; height: 0.3333em;
}

@media (max-width: 1430px) {
    .page_gr_3 .sec_t1 .itemBox {gap: 4em;}
    .page_gr_3 .sec_t1 .itemBox .list > li:not(:last-child) {margin-bottom: 0.6em;}
}

@media (max-width: 991px) {
    .page_gr_3 .sec_t1 .itemBox {flex-direction: column;}
}

@media (max-width: 580px) {
    .page_gr_3 .sec_t1 .itemBox .list > li > span {top: 24%;}
    .page_gr_3 .sec_t1 .itemBox .list > li > div {align-items: start; gap: unset; flex-direction: column;}
}


/* sec_t2 */
.page_gr_3 .sec_t2 {margin-top: 9em;}
.page_gr_3 .sec_t2 .itemBox {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 4em; margin-top: 3em;
}

@media (max-width: 991px) {
    .page_gr_3 .sec_t2 .itemBox {grid-template-columns: repeat(2, 1fr); justify-items: center;}
    .page_gr_3 .sec_t2 .itemBox > li:last-child {grid-column: 1/3; width: 46.7%; max-width: 100%;}
    .page_gr_3 .sec_t2 .itemBox > li {width: 100%; max-width: 440px;}
}

@media (max-width: 768px) {
    .page_gr_3 .sec_t2 .itemBox {grid-template-columns: repeat(1, 1fr); gap: 3.5em;}
    .page_gr_3 .sec_t2 .itemBox > li:last-child {grid-column: unset; width: 100%;}
    .page_gr_3 .sec_t2 .itemBox > li {width: 100%; max-width: 100%;}
    .page_gr_3 .sec_t2 .itemBox > li img {display: block; margin: 0 auto;}
}

/* 그룹3번 페이지 공통 끝 -----------------------------------------------------------------------*/

/* p301 -----------------------------------------------------------------------*/

@media (max-width: 1250px) {
    .p301 > h3 br {display: none;}   
}

/* p301 끝-----------------------------------------------------------------------*/

/* p302 -----------------------------------------------------------------------*/

.p302 .sec_t1 .itemBox .list > li h5 {position: relative;}
.p302 .sec_t1 .itemBox .list > li:not(:last-child) {margin-bottom: 1em;}
.p302 .sec_t1 .itemBox .list > li > div {align-items: start; gap: unset; flex-direction: column;}

.p302 .sec_t2 .itemBox > li .txt {margin-top: 1.5em;}
.p302 .sec_t2 .itemBox > li h5 {font-weight: bold; margin-bottom: 0.4em;}

@media (max-width: 1430px) {
    .p302 .sec_t2 .itemBox > li .txt p br {display: none;}
}

@media (max-width: 768px) {
    .p302 .sec_t2 .itemBox {gap: 7em;}
}

@media (max-width: 680px) {
    .p302 .sec_t1 .itemBox .text_box {width: 100%; max-width: 577px; margin: 0 auto;}
    .p302 .sec_t1 .itemBox .list > li > div br {display: none;}
}

/* p302 끝-----------------------------------------------------------------------*/


/* p303 -----------------------------------------------------------------------*/

.p303 .sec_t1 .itemBox .list > li h5 {position: relative;}
.p303 .sec_t1 .itemBox .list > li:not(:last-child) {margin-bottom: 1em;}
.p303 .sec_t1 .itemBox .list > li > div {align-items: start; gap: unset; flex-direction: column;}

@media (max-width: 991px) {
    .p303 .sec_t2 .itemBox > li:last-child {grid-column: unset; width: 100%;}
    .p303 .sec_t2 .itemBox > li {width: 100%; max-width: 100%;}
}

/* p302 끝-----------------------------------------------------------------------*/