
/**** sub visual ****/
.sub_visual {height: 100vh; max-height: 91.2rem; overflow: hidden;}
.sub_visual .visual_inner {width: 100%; height: 100%;  -webkit-transition: transform 1s ease-out;  -moz-transition: transform 1s ease-out;  -ms-transition: transform 1s ease-out; -o-transition: transform 1s ease-out;  transition: transform 1s ease-out; transform: scale(1.1);}
.sub_visual .visual_inner .title {width: 100%}
.sub_visual .visual_inner .down_title {bottom: 4.7rem; width: 100%}
.sub_visual .visual_inner .down_title .txt {text-transform: uppercase; margin-bottom: 5.6rem; letter-spacing: 6px;}
.sub_visual .visual_inner .down_title .down_icon {animation: down3 0.6s linear infinite alternate}

.sub_visual .visual_inner.on {transform: scale(1);}

@keyframes down3 {
    0% {bottom: 0;}
    100% {bottom: 1.2rem;}
}

.sub_visual .visual_1 {background: url('../img/sub1/visual.jpg'); background-size: cover; background-position: center}
.sub_visual .visual_2 {background: url('../img/sub2/visual.jpg'); background-size: cover; background-position: center}
.sub_visual .visual_3 {background: url('../img/sub3/visual.jpg'); background-size: cover; background-position: center}
.sub_visual .visual_4 {background: url('../img/sub4/visual.jpg'); background-size: cover; background-position: center}
.sub_visual .visual_5 {background: url('../img/sub5/visual.jpg'); background-size: cover; background-position: center}
.sub_visual .visual_6 {background: url('../img/sign/visual.jpg'); background-size: cover; background-position: center}

.sub_visual .visual_3 {color: #262829}
.sub_visual .visual_3 .down_icon {filter: brightness(0);}
.sub_visual .visual_4 {color: #262829}

@media all and (max-width: 800px){
    .sub_visual {max-height: 88rem;}
    .sub_visual .visual_inner .title .tit {line-height: 7rem;  padding: 0.8rem 0;}
    .sub_visual .visual_inner .title .subt {font-size: 2rem}

    .sub_visual .visual_inner .title > img {max-width: 9rem}

    .sub_visual .visual_1 {background: url('../img/sub1/visual_mo.jpg'); background-size: cover; background-position: center}
    .sub_visual .visual_2 {background: url('../img/sub2/visual_mo.jpg'); background-size: cover; background-position: center}
    .sub_visual .visual_3 {background: url('../img/sub3/visual_mo.jpg'); background-size: cover; background-position: center}
    .sub_visual .visual_4 {background: url('../img/sub4/visual_mo.jpg'); background-size: cover; background-position: center}
    .sub_visual .visual_5 {background: url('../img/sub5/visual_mo.jpg'); background-size: cover; background-position: center}
    .sub_visual .visual_6 {background: url('../img/sign/visual_mo.jpg'); background-size: cover; background-position: center}
}

/******************** components  ********************/

/**** component-1  ****/
.cpt_1 {}
.cpt_1 .txt_area {padding: 22.4rem 0 25rem;}
.cpt_1 .txt_area .num {padding-bottom: 3.2rem;}
.cpt_1 .txt_area .tit {}
.cpt_1 .txt_area .subt {padding: 3.2rem 0 8rem;}
.cpt_1 .txt_area .wrt {}

.cpt_1_2 {}
.cpt_1_2 .txt_area {padding: 19rem 0 22rem;}
.cpt_1_2 .txt_area .tit {padding-top: 3.2rem}
.cpt_1_2 .txt_area .subt {padding: 3.2rem 0 8rem;}
.cpt_1_2 .txt_area .wrt {}

#sub5 .cpt_1_2.plus {background: url('../img/sub5/banner2.jpg'); background-size: cover; background-position: center}

.sub2_cpt_1 {background: url('../img/sub2/sub2_cpt_1_bg.jpg'); background-size: cover; background-position: center}
.sub3_cpt_1 {background: url('../img/sub3/sub3_cpt_1_bg.jpg'); background-size: cover; background-position: center}
.sub4_cpt_1 {background: url('../img/sub4/sub4_cpt_1_bg.jpg'); background-size: cover; background-position: center}

@media all and (max-width: 800px){
    .cpt_1 .txt_area {padding: 14.2rem 0}
    .cpt_1 .txt_area .tit {font-size: 5.6rem; font-weight: bold}
    .cpt_1 .txt_area .subt {padding: 1.6rem 0 5.6rem; font-size: 2rem}

    .cpt_1_2 .txt_area {padding: 7.6rem 0 9.6rem;}
    .cpt_1_2 .txt_area .tit {font-size: 4.8rem}
    .cpt_1_2 .txt_area .subt {padding: 1.6rem 0 5.6rem; font-size: 2rem}

    .sub2_cpt_1 {background: url('../img/sub2/sub2_cpt_1_bg_mo.jpg'); background-size: cover; background-position: center}
    .sub3_cpt_1 {background: url('../img/sub3/sub3_cpt_1_bg_mo.jpg'); background-size: cover; background-position: center}
    .sub4_cpt_1 {background: url('../img/sub4/sub4_cpt_1_bg_mo.jpg'); background-size: cover; background-position: center}
}

/**** component-2 ****/
.cpt_2 {}
.cpt_2 .txt_area {padding: 40rem 0}
.cpt_2 .txt_area .tit {padding-bottom: 2.4rem}
.cpt_2 .txt_area .subt {}

#sub2 .cpt_2 {background: url('../img/sub2/banner.jpg'); background-size: cover; background-position: center}
#sub3 .cpt_2 {background: url('../img/sub3/banner.jpg'); background-size: cover; background-position: center}
#sub4 .cpt_2 {background: url('../img/sub4/banner.jpg'); background-size: cover; background-position: center}
#sub5 .cpt_2 {background: url('../img/sub5/banner.jpg'); background-size: cover; background-position: center}

@media all and (max-width: 800px){
    .cpt_2 .txt_area {padding: 16rem 0;}
    .cpt_2 .txt_area .tit {font-size: 2rem}

    #sub4 .cpt_2 {background: url('../img/sub4/banner_mo.jpg'); background-size: cover; background-position: center}
    #sub5 .cpt_2 {background: url('../img/sub5/banner_mo.jpg'); background-size: cover; background-position: center}
}

/**** component-3 ****/
.cpt_3 {}
.cpt_3 .cpt_3_inner {width: 100%; max-width: 1584px; padding: 18.5rem 0 19rem;}
.cpt_3 .box {}
.cpt_3 .box .point {margin-bottom: 4rem;}
.cpt_3 .box .tit {padding-bottom: 2.4rem; margin-bottom: 2.4rem; border-bottom: 1px solid #7B7E80;}
.cpt_3 .box .subt {margin-bottom: 6.4rem;}
.cpt_3 .box .img {margin-top: 4.6rem}

#sub3 .cpt_3 {background: rgba(214,207,197,0.36)}

@media all and (max-width: 800px){
    .cpt_3 .cpt_3_inner {padding: 8.8rem 0; flex-direction: column; width: 83.5%; margin: 0 auto; gap: 8.8rem;}
    .cpt_3 .box .point {margin-bottom: 2rem}
}

/**** component-4 ****/
.cpt_4 .cpt_4_inner {padding: 21.3rem 0 20rem; width: 100%; max-width: 117.6rem;}
.cpt_4 .title {margin-bottom: 4.8rem;}
.cpt_4 .list li:nth-child(2n) {top: 4.8rem}
.cpt_4 .list li .img {max-width: 37.6rem}
.cpt_4 .list li .tit {padding: 1.6rem 0 0.8rem;}
.cpt_4 .list li .subt {padding-bottom: 2.4rem;}

.cpt_4_2 .cpt_4_inner {padding: 21.3rem 0 17.8rem; width: 100%; max-width: 158.4rem;}
.cpt_4_2 .title {margin-bottom: 4.8rem;}
.cpt_4_2 .list li:nth-child(2n) {top: 4.8rem}
.cpt_4_2 .list li .img {max-width: 37.6rem}
.cpt_4_2 .list li .tit {padding: 1.6rem 0 0.8rem;}
.cpt_4_2 .list li .subt {padding-bottom: 2.4rem;}

#sub4 .cpt_4_inner {padding-bottom: 24.8rem}

@media all and (max-width: 800px){
    .cpt_4 .cpt_4_inner {padding: 8.8rem 0; width: 83.5%; margin: 0 auto}
    .cpt_4 .list {flex-direction: column; gap: 6rem}
    .cpt_4 .list li:nth-child(2n) {top: 0}
    .cpt_4 .list li .img {max-width: 100%}

    .cpt_4_2 .cpt_4_inner {width: 83.5%; margin: 0 auto; padding: 7rem 0 8.8rem}
    .cpt_4_2 .list {flex-direction: column; gap: 6rem}
    .cpt_4_2 .list li:nth-child(2n) {top: 0}
    .cpt_4_2 .list li .img {max-width: 100%}
    .cpt_4_2 .list li .tit {padding: 1.6rem 0 2.4rem;}
    .cpt_4_2 .list li .subt {padding-bottom: 0.8rem}

    #sub4 .cpt_4_inner {padding-bottom: 8.8rem}
}

/**** component-5 ****/
.cpt_5 {}
.cpt_5 .txt_area {padding: 7.2rem 0;}

@media all and (max-width: 800px){
    .cpt_5 .txt_area .tit {padding-bottom: 2.4rem; font-size: 2.6rem;}
}

/**** component-6 ****/
.cpt_6 {}
.cpt_6 .cpt_6_inner {}
.cpt_6 .box {width: 50%;}
.cpt_6 .box1 {}
.cpt_6 .box2 {}
.cpt_6 .box2 .txt_area {height: 100%; max-width: 58.4rem;}
.cpt_6 .box2 .txt_area .tit {padding-bottom: 6.4rem; margin-bottom: 4.5rem; border-bottom: 1px solid #AFB1B5;}
.cpt_6 .box2 .txt_area .subt {gap: 1.2rem}

#sub2 .cpt_6 .box2 {background: url('../img/sub2/txt_bg.jpg'); background-size: cover; background-position: center;}
#sub3 .cpt_6 .box2 {}
#sub4 .cpt_6 .box2 {}
#sub5 .cpt_6 .box2 {background: url('../img/sub5/txt_bg.jpg'); background-size: cover; background-position: center;}

#sub3 .cpt_6_inner {flex-direction: row-reverse;}
#sub4 .cpt_6_inner {flex-direction: row-reverse;}

@media all and (max-width: 800px){
    .cpt_6 .cpt_6_inner {flex-direction: column;}
    .cpt_6 .box {width: 100%;}
    .cpt_6 .box2 .txt_area {padding: 6.2rem 0; width: 83.5%;}
    .cpt_6 .box2 .txt_area .tit {padding-bottom: 1.8rem; margin-bottom: 2.1rem; font-size: 3.2rem;}

    #sub3 .cpt_6 .box2 .txt_area .tit {padding-bottom: 4rem; margin-bottom: 4rem}
    #sub4 .cpt_6 .box2 .txt_area {padding: 9.4rem 0}
    #sub5 .cpt_6 .cpt_6_inner {flex-direction: column-reverse;}
    #sub5 .cpt_6 .box2 .txt_area .tit {padding-bottom: 4rem; margin-bottom: 4rem}

    #sub3 .cpt_6_inner {flex-direction: column;}
    #sub4 .cpt_6_inner {flex-direction: column;}

}

/**** component-7 ****/
.cpt_7 {}
.cpt_7 .cpt_7_inner {padding: 13.4rem 0}
.cpt_7 .cpt_7_inner .mark {width: 16.4rem; filter: brightness(100);}
.cpt_7 .cpt_7_inner .tit {padding: 3.2rem 0 1.2rem}
.cpt_7 .cpt_7_inner .subt {padding-bottom: 3.2rem; letter-spacing: 0.64px;}
.cpt_7 .cpt_7_inner .down {width: 1.3rem;}

#sub3 .cpt_7 {background: url('../img/sub3/banner3.jpg'); background-size: cover; background-position: center;}

@media all and (max-width: 800px){
    .cpt_7 .cpt_7_inner .tit {padding: 4.2rem 0 1.2rem;}
}

/**** component-8 ****/
.cpt_8 .box {width: 50%;}
.cpt_8 .box1 {padding: 12.4rem 0 14rem 19.8rem}
.cpt_8 .box1 .txt_area .tit {margin: 4rem 0}
.cpt_8 .box1 .txt_area .wrt {line-height: 2.6rem}
.cpt_8 .box1 .down {width: 1.3rem;}

.cpt_8_2 .box {width: 50%;}
.cpt_8_2 .box1 {padding: 18.8rem 0 9.8rem 7.4rem}
.cpt_8_2 .box1 .txt_area .tit {margin-bottom: 8.8rem}
.cpt_8_2 .box1 .txt_area .wrt {line-height: 3.2rem}
.cpt_8_2 .box1 .down {width: 1.3rem;}

@media all and (max-width: 800px){
    .cpt_8 .cpt_8_inner {flex-direction: column-reverse;}
    .cpt_8 .box {width: 100%}
    .cpt_8 .box1 {padding: 2.8rem 0 5rem; width: 83.5%; margin: 0 auto; gap: 5.3rem;}

    .cpt_8_2 .cpt_8_inner {flex-direction: column;}
    .cpt_8_2 .box {width: 100%}
    .cpt_8_2 .box1 {padding: 2.8rem 0 5rem; width: 83.5%; margin: 0 auto; gap: 5.3rem;}
}

/**** component-9 ****/
.cpt_9 .box {width: 50%;}
.cpt_9 .box2 {padding: 12.4rem 0 10.7rem 7.4rem;}
.cpt_9 .box2 .txt_area .tit {margin: 4rem 0 8.8rem}
.cpt_9 .box2 .txt_area .list {width: 100%; max-width: 72rem;}
.cpt_9 .box2 .txt_area .list li + li {padding-top: 3.2rem; margin-top: 3.2rem; border-top: 1px solid #AFB1B5;}
.cpt_9 .box2 .txt_area .list li span {width: 5rem; margin-right: 2.4rem}
.cpt_9 .box2 .down {width: 1.3rem;}

.cpt_9_2 {overflow: hidden;}
.cpt_9_2 .box {width: 50%;}
.cpt_9_2 .box2 {padding: 18.8rem 0 7.3rem 19.8rem;}
.cpt_9_2 .box2 .txt_area .tit {margin: 4rem 0 6.4rem}
.cpt_9_2 .box2 .txt_area .list {width: 100%; max-width: 61.6rem;}
.cpt_9_2 .box2 .txt_area .list li {border-bottom: 1px solid #AFB1B5; height: 12.4rem}
.cpt_9_2 .box2 .txt_area .list li .point {min-width: 16rem; margin-right: 1.6rem}
.cpt_9_2 .box2 .txt_area .list li .wrt {line-height: 2.6rem}
.cpt_9_2 .box2 .down {width: 1.3rem;}

.cpt_9_3 {overflow: hidden;}
.cpt_9_3 .box {width: 50%;}
.cpt_9_3 .box2 {padding: 12.4rem 0 9.8rem 19.8rem;}
.cpt_9_3 .box2 .txt_area .tit {margin: 4rem 0 8.8rem}
.cpt_9_3 .box2 .txt_area .list {width: 100%; max-width: 61.6rem;}
.cpt_9_3 .box2 .txt_area .list li + li {padding-top: 3.2rem; margin-top: 3.2rem; border-top: 1px solid #AFB1B5;}
.cpt_9_3 .box2 .txt_area .list li span {width: 5.7rem; margin-right: 3rem}
.cpt_9_3 .box2 .down {width: 1.3rem;}

.cpt_9.plus .box2 .txt_area .tit {margin: 4rem 0 3.2rem}
.cpt_9.plus .box2 .txt_area .wrt {margin-bottom: 4rem}

#sub3 .cpt_9 .box2 .txt_area .list li span {width: 9rem}
#sub3 .cpt_9_sub3 .cpt_9_inner {flex-direction:row-reverse;}
#sub3 .cpt_9_sub3 .box2 {padding: 12.4rem 0 10.7rem 12.4rem;}
#sub3 .cpt_9_sub3 .box2 .txt_area .list li span {width: 11rem }
#sub4 .cpt_9_3 .box2 .txt_area .list {max-width: 70rem;}
#sub4 .cpt_9_3 .box2 .txt_area .list li span {width: 10rem}

@media all and (max-width: 800px){
    .cpt_9 .cpt_9_inner {flex-direction: column;}
    .cpt_9 .box {width: 100%;}
    .cpt_9 .box2 {padding: 2.8rem 0 5rem; width: 83.5%; margin: 0 auto; gap: 5.3rem;}
    .cpt_9 .box2 .txt_area .list {font-size: 1.7rem;}
    .cpt_9 .box2 .txt_area .list li span {display: block; font-size: 2rem}

    .cpt_9_2 .cpt_9_inner {flex-direction: column-reverse;}
    .cpt_9_2 .box {width: 100%;}
    .cpt_9_2 .box2 {padding: 2.8rem 0 8.8rem; width: 83.5%; margin: 0 auto; gap: 5.3rem;}
    .cpt_9_2 .box2 .txt_area .list li {flex-direction: column; align-items: baseline; gap: 1.7rem; padding: 1.6rem 0; height: auto;}

    .cpt_9_3 .cpt_9_inner {flex-direction: column-reverse;}
    .cpt_9_3 .box {width: 100%;}
    .cpt_9_3 .box2 {padding: 2.8rem 0 8.8rem; gap: 5.3rem; width: 83.5%; margin: 0 auto;}
    .cpt_9_3 .box2 .txt_area .list li span {display: block; padding-bottom: 0.7rem}

    #sub4 .cpt_9 .box2 .txt_area .list {font-size: 2rem}
    #sub3 .cpt_9 .box2 .txt_area .list li:nth-child(3) {flex-direction: column; align-items: baseline;}
    #sub3 .cpt_9_sub3 .cpt_9_inner {flex-direction: column;}
    #sub3 .cpt_9_sub3 .box2 {padding: 2.8rem 0 5rem;}

}

/**** component-10 ****/
.cpt_10 {}
.cpt_10 .txt_area {padding: 43.2rem 0;}
.cpt_10 .txt_area .tit {margin-bottom: 0.8rem;}
.cpt_10 .txt_area .subt {}

#sub2 .cpt_10 {background: url('../img/sub2/bg_img.jpg'); background-size: cover; background-position: center;}
#sub3 .cpt_10 {background: url('../img/sub3/bg_img.jpg'); background-size: cover; background-position: center;}
#sub4 .cpt_10 {background: url('../img/sub4/bg_img.jpg'); background-size: cover; background-position: center;}
#sub5 .cpt_10 {background: url('../img/sub5/bg_img.jpg'); background-size: cover; background-position: center;}

@media all and (max-width: 800px){
    .cpt_10 .txt_area {padding: 32rem 0}
    .cpt_10 .txt_area .tit {margin-bottom: 1.6rem; line-height: 4.4rem; font-size: 3.2rem;}

    #sub2 .cpt_10 {background: url('../img/sub2/bg_img_mo.jpg'); background-size: cover; background-position: center;}
    #sub3 .cpt_10 {background: url('../img/sub3/bg_img_mo.jpg'); background-size: cover; background-position: center;}
    #sub4 .cpt_10 {background: url('../img/sub4/bg_img_mo.jpg'); background-size: cover; background-position: center;}
}

/**** component-11 ****/
.cpt_11 {}
.cpt_11 .cpt_11_inner {width: 100%; max-width: 158.4rem; padding: 26.4rem 0 25rem}
.cpt_11 .box {max-width: 74.4rem;}
.cpt_11 .box .title {align-items: flex-end; margin-bottom: 4rem;}
.cpt_11 .box .list {margin-top: 4rem}
.cpt_11 .box .list li {height: 9.2rem}
.cpt_11 .box .list li + li {border-top: 1px solid #AFB1B5;}
.cpt_11 .box .list li .tit {width: 11rem; margin-right: 2.8rem;}

#sub5 .cpt_11 .cpt_11_inner {border-bottom: 1px solid #AFB1B5}
#sub5 .cpt_11 .box .list li .tit {width: 17.6rem; margin-right: 3.2rem}

#sub3 .cpt_11 .box .list li .tit {width: 16rem;}
#sub4 .cpt_11 .box .list li .tit {width: 13rem;}

@media all and (max-width: 800px){
    .cpt_11 .cpt_11_inner {padding: 8rem 0 9.7rem; flex-direction: column; width: 83.5%; margin: 0 auto; gap: 5.6rem;}
    .cpt_11 .box .title {flex-direction: column; align-items: baseline; gap: 0.8rem;  margin-bottom: 1.6rem;}
    .cpt_11 .box .list {margin-top: 0.8rem;}
    .cpt_11 .box .list li {flex-direction: column; align-items: baseline; gap: 0.8rem; height: auto; padding: 2.4rem 0;}
    .cpt_11 .box .list li .wrt {font-size: 1.4rem}

    #sub5 .cpt_11 .box .list li .tit {width: 100%}
}

/**** component-12 ****/
.cpt_12 {}
.cpt_12 .cpt_12_inner {}
.cpt_12 .box {width: 50%;}
.cpt_12 .box1 {}
.cpt_12 .box2 {padding: 12.4rem 0 12.4rem 7.2rem}
.cpt_12 .box2 .txt_area {width: 100%; max-width: 61.6rem;}
.cpt_12 .box2 .txt_area .subt {letter-spacing: 5.12px;}
.cpt_12 .box2 .txt_area .tit {padding: 2.9rem 0 8.8rem}
.cpt_12 .box2 .txt_area .list {}
.cpt_12 .box2 .txt_area .list li + li {padding-top: 3.2rem; margin-top: 3.2rem; border-top: 1px solid #AFB1B5; }
.cpt_12 .box2 .txt_area .list li .left {width: 14.4rem; margin-right: 1.6rem}
.cpt_12 .box2 .txt_area .list li .left div + div {padding-top: 1.2rem}
.cpt_12 .box2 .txt_area .list li .right {line-height: 2.6rem}
.cpt_12 .box2 .down {width: 1.3rem;}


#sub5 .cpt_12 .box2 .txt_area .list li .left {width: 19rem; margin-right: 5.6rem;}

@media all and (max-width: 800px){
    .cpt_12 .cpt_12_inner {flex-direction: column;}
    .cpt_12 .box1 {width: 100%}
    .cpt_12 .box2 {padding: 2.8rem 0 7.2rem; width: 83.5%; margin: 0 auto; gap: 5.3rem}
    .cpt_12 .box2 .txt_area .tit {padding: 2.4rem 0;}
    .cpt_12 .box2 .txt_area .list li {flex-direction: column; gap: 0.8rem}
    .cpt_12 .box2 .txt_area .list li .left div + div {padding-top: 0.8rem;}

    #sub5 .cpt_12 .box2 .txt_area .list li .left {display: flex; justify-content: space-between; width: 100%; align-items: flex-end;}
    #sub5 .cpt_12 .box2 .txt_area .list li .left div {padding: 0}
}



/******************** sub contents  ********************/

/**** sub1-section-1 ****/
.sub1_sec1 {}
.sub1_sec1 .txt_area {padding: 20rem 0 17rem}
.sub1_sec1 .txt_area .txt {}
.sub1_sec1 .txt_area .tit {padding-top: 6.4rem; text-transform: uppercase;}
.sub1_sec1 .txt_area .tit::before {content: ''; display: block; position: absolute; left: 50%; height: 4rem; width: 1px; background: #AFB1B5; top: 2.4rem;}
.sub1_sec1 .txt_area .subt {padding-bottom: 6.4rem}
.sub1_sec1 .txt_area .wrt {}

@media all and (max-width: 800px){
    .sub1_sec1 .txt_area {width: 83.5%; margin: 0 auto; padding: 7.6rem 0 9.6em;}
    .sub1_sec1 .txt_area .tit {font-size: 5.6rem; padding-bottom: 2.4rem;}
}

/**** sub1-section-2 ****/
.sub1_sec2 {}
.sub1_sec2::before {content: ''; display: block; position: absolute; width: 100%; height: 60%; background: #EEF0F3; bottom: 0}
.sub1_sec2 .inner {width: 100%; max-width: 158.4rem; padding-bottom: 16.8rem;}
.sub1_sec2 .inner .txt {margin-top: 7.2rem;}

@media all and (max-width: 800px){
    .sub1_sec2 .inner {padding-bottom: 7.2rem;}
}

/**** sub1-section-3 ****/
.sub1_sec3 {margin-top: 20rem}
.sub1_sec3 .inner {width: 100%; max-width: 158.4rem; padding: 16.8rem 0 32rem}
.sub1_sec3 .txt_area {}
.sub1_sec3 .txt_area .mark {}
.sub1_sec3 .txt_area .tit {margin: 4.8rem 0 1.6rem;}
.sub1_sec3 .txt_area .subt {padding: 0.8rem 3.2rem; background: #E97B84}
.sub1_sec3 .txt_area .down {margin-top: 5.6rem;}

.sub1_sec3 .cont_area {margin: 13.2rem 0 40rem;}
.sub1_sec3 .top_area {gap: 7rem; margin-bottom: 18rem;}
.sub1_sec3 .top_area .img {}
.sub1_sec3 .top_area .txt {padding-bottom: 2rem;}
.sub1_sec3 .top_area .txt .subt {}
.sub1_sec3 .top_area .txt .tit {margin: 3.2rem 0 6.2rem;}
.sub1_sec3 .top_area .txt .wrt {line-height: 3.4rem;}

.sub1_sec3 .bot_area {justify-content: flex-end; gap: 22rem;}
.sub1_sec3 .bot_area .txt {}
.sub1_sec3 .bot_area .tit {}
.sub1_sec3 .bot_area .subt {padding: 4.2rem 0 5.5rem;}
.sub1_sec3 .bot_area .subt .name {padding-right: 2rem}
.sub1_sec3 .bot_area .subt .prg {padding-left: 2rem; border-left: 1px solid #72787F}
.sub1_sec3 .bot_area .hst {gap: 5.5rem; line-height: 3.1rem;}


@media all and (max-width: 800px){
    .sub1_sec3 {margin-top: 10rem}
    .sub1_sec3 .inner {padding: 7.2rem 0 8.8rem; width: 83.5%; margin: 0 auto}
    .sub1_sec3 .txt_area .mark {width: 28%}

    .sub1_sec3 .cont_area {margin: 13.2rem 0 20rem;}

    .sub1_sec3 .top_area {flex-direction: column;}
    .sub1_sec3 .top_area .txt {width: 84%; margin: 0 auto;}
    .sub1_sec3 .top_area .txt .tit {font-size: 3.2rem;}
    .sub1_sec3 .top_area .txt .wrt {font-size: 1.8rem; line-height: 2.8rem;}

    .sub1_sec3 .bot_area {flex-direction: column-reverse; gap: 15rem;}
    .sub1_sec3 .bot_area .txt {width: 84%; margin: 0 auto;}
    .sub1_sec3 .bot_area .tit {font-size: 3.2rem;}
    .sub1_sec3 .bot_area .subt .name {font-size: 3.2rem;}
    .sub1_sec3 .bot_area .subt .prg {font-size: 1.8rem;}
    .sub1_sec3 .bot_area .hst {flex-direction: column; font-size: 1.8rem; gap: 0;}
}

/**** sub1-section-4 ****/
.sub1_sec4 {height: 100vh}
.sub1_sec4 ul {background: url('../img/sub1/list_bg.jpg'); background-size: cover; background-position: center; height: 100%;}

.sub1_sec4 ul li {width: 25%; transition: 0.2s}
.sub1_sec4 ul li .butt {padding: 0.9rem 0; width: 18.4rem; border: 1px solid #fff}
.sub1_sec4 ul li .tit {padding-top: 1.6rem}
.sub1_sec4 ul li .wrt {line-height: 2.6rem; display: none;}
.sub1_sec4 ul li .wrt span {width: 0.9rem; padding: 2.4rem 0}

.sub1_sec4 ul li.active .butt {color: #535658; background: #fff;}
.sub1_sec4 ul li.active .tit {font-weight: 500;}

/**** sub2-section-1 ****/
.sub2_sec1 {}
.sub2_sec1 .inner {}
.sub2_sec1 .inner .box {width: 50%}
.sub2_sec1 .inner .box1 {padding: 18.4rem 0 14rem 20rem}
.sub2_sec1 .inner .box1 .tit {padding-bottom: 25.4rem}
.sub2_sec1 .inner .box2 {}

@media all and (max-width: 800px){
    .sub2_sec1 .inner {flex-direction: column;}
    .sub2_sec1 .inner .box {width: 100%}
    .sub2_sec1 .inner .box1 {padding: 4.6rem 3.2rem;}
    .sub2_sec1 .inner .box1 .tit {padding-bottom: 2.2rem; font-size: 3.2rem;}

}

/**** sub2-section-2 ****/
.swiper_sub2 {overflow: hidden;}
.swiper_sub2 .swiper-button-prev {color: #262829; background: url('../img/sub4/slide_prev.png') no-repeat; background-size: contain; top: 55%; left: 7%;}
.swiper_sub2 .swiper-button-next {color: #262829; background: url('../img/sub4/slide_next.png') no-repeat; background-size: contain; top: 55%; left: 42%; right: auto}
.swiper_sub2 .swiper-button-prev::after {display: none}
.swiper_sub2 .swiper-button-next::after {display: none}

@media all and (max-width: 800px){
    .swiper_sub2 .swiper-button-prev {display: none}
    .swiper_sub2 .swiper-button-next {display: none}
}

/**** sub2-section-3 ****/
.sub2_sec3 {}
.sub2_sec3 .sub2_sec3_inner {}
.sub2_sec3 .box {}
.sub2_sec3 .box1 {width: 60%; padding: 16rem 0 0 19.8rem}
.sub2_sec3 .box1 .txt_box {width: 100%; max-width: 75rem;}
.sub2_sec3 .box1 .txt_box + .txt_box {margin-top: 8rem}
.sub2_sec3 .box1 .txt_box .title {align-items: flex-end; padding-bottom: 2.4rem; margin-bottom: 2.4rem; border-bottom: 1px solid #AFB1B5;}
.sub2_sec3 .box1 .txt_box .title .tit {}
.sub2_sec3 .box1 .txt_box .title .subt {}
.sub2_sec3 .box2 {width: 40%}

@media all and (max-width: 800px){
    .sub2_sec3 .sub2_sec3_inner {flex-direction: column-reverse;}
    .sub2_sec3 .box1 {width: 83.5%; margin: 0 auto; padding: 4rem 0 8.8rem;}
    .sub2_sec3 .box2 {width: 100%}

}

#sub3 .line {background: #DEDEDE; height: 1px; width: 100%; max-width: 80%; margin: 0 auto;}
#sub4 .line {background: #DEDEDE; height: 1px; width: 100%; max-width: 80%; margin: 0 auto;}

/**** sub3-section-1 ****/
.sub3_sec1 {background: url('../img/sub3/case_bg.jpg'); background-size: cover; background-position: center;}
.sub3_sec1 .sub3_sec1_inner {width: 100%; max-width: 131.2rem; padding: 16rem 0 18rem}
.sub3_sec1 .txt_area {margin-bottom: 2.4rem}
.sub3_sec1 .txt_area .mark {width: 16.4rem;}
.sub3_sec1 .txt_area .tit {padding: 1.6rem 0}
.sub3_sec1 .txt_area .subt {}
.sub3_sec1 .img_area {}
.sub3_sec1 .img_area .txt {margin-bottom: 2.4rem}
.sub3_sec1 .img_area .box {}
.sub3_sec1 .img_area .box .img {}
.sub3_sec1 .img_area .wrt {margin-top: 4rem}

@media all and (max-width: 800px){
    .sub3_sec1 .sub3_sec1_inner {padding: 8.8rem 0 11.6rem}
    .sub3_sec1 .txt_area {margin-bottom: 7.2rem}
    .sub3_sec1 .txt_area .tit {padding: 4.8rem 0 2.4rem; font-size: 3.2rem; line-height: 4.4rem}
    .sub3_sec1 .txt_area .subt {font-size: 1.4rem}
    .sub3_sec1 .img_area {width: 83.5%; margin: 0 auto; text-align: center;}
    .sub3_sec1 .img_area .box {flex-direction: column; gap: 1.2rem}
}

/**** sub3-section-2 ****/
.sub3_sec2 {background: #FBFBFA}
.sub3_sec2 .sub3_sec2_inner {width: 100%; max-width: 158.4rem; padding: 10.4rem 0}
.sub3_sec2 .img_area {}
.sub3_sec2 .img_area .box {}
.sub3_sec2 .img_area .box .txt {margin-bottom: 3.2rem}
.sub3_sec2 .img_area .box .img {gap: 2.4rem}
.sub3_sec2 .wrt {margin-top: 7.2rem;}

@media all and (max-width: 800px){
    .sub3_sec2 .sub3_sec2_inner {padding: 8rem 0; width: 83.5%; margin: 0 auto;}
    .sub3_sec2 .img_area {flex-direction: column; gap: 8rem}
    .sub3_sec2 .img_area .box .txt {margin-bottom: 1.8rem;}
    .sub3_sec2 .img_area .box .img {flex-direction: column;}
    .sub3_sec2 .wrt {margin-top: 1.6rem}
}

/**** sub3-section-2 ****/
.sub3_sec3 {background: url('../img/sub3/banner2.jpg'); background-size: cover; background-position: center;}
.sub3_sec3 .txt_area {padding: 34.2rem 0 35.5rem; align-items: flex-end; padding-right: 16.8%;}

@media all and (max-width: 800px){
    .sub3_sec3 .txt_area {padding: 34.7rem 0; align-items: center; gap: 1rem}
    .sub3_sec3 .txt_area .tit {font-size: 3.2rem}
    .sub3_sec3 .txt_area .subt {text-align: center}
}

/**** sub3-section-4 ****/
.sub3_sec4.swiper_sub3 {overflow: hidden;}
.sub3_sec4.swiper_sub3 .swiper-button-prev {color: #262829; background: url('../img/sub4/slide_prev.png') no-repeat; background-size: contain; top: 55%; left: 7%;}
.sub3_sec4.swiper_sub3 .swiper-button-next {color: #262829; background: url('../img/sub4/slide_next.png') no-repeat; background-size: contain; top: 55%; left: 42%; right: auto}
.sub3_sec4.swiper_sub3 .swiper-button-prev::after {display: none}
.sub3_sec4.swiper_sub3 .swiper-button-next::after {display: none}

@media all and (max-width: 800px){
    .sub3_sec4.swiper_sub3 .swiper-button-prev {display: none}
    .sub3_sec4.swiper_sub3 .swiper-button-next {display: none}
}

/**** sub4-section-1 ****/
.sub4_sec1.swiper_sub4 {overflow: hidden;}
.sub4_sec1.swiper_sub4 .swiper-button-prev {color: #262829; background: url('../img/sub4/slide_prev.png') no-repeat; background-size: contain; top: 55%; left: 7%;}
.sub4_sec1.swiper_sub4 .swiper-button-next {color: #262829; background: url('../img/sub4/slide_next.png') no-repeat; background-size: contain; top: 55%; left: 42%; right: auto}
.sub4_sec1.swiper_sub4 .swiper-button-prev::after {display: none}
.sub4_sec1.swiper_sub4 .swiper-button-next::after {display: none}

@media all and (max-width: 800px){
    .sub4_sec1.swiper_sub4 .swiper-button-prev {display: none}
    .sub4_sec1.swiper_sub4 .swiper-button-next {display: none}
}


/**** sub5-category ****/
#sub3 {position: relative;}
#sub3 .cate {position: sticky;}
#sub3 .cate_inner {border-bottom: 1px solid #AFB1B5}
#sub3 .cate_inner li {color: #7B7E80; min-width: 14rem; position: relative;}
#sub3 .cate_inner li a {padding: 2.4rem 0; display: block; text-align: center; line-height: 1.2;}
#sub3 .cate_inner li.on {color: #D2B692; font-weight: 500}
#sub3 .cate_inner li.on::before {content: ''; display: block; position: absolute; bottom: -2px; width: 100%; height: 3px; background: #D2B692}

@media all and (max-width: 800px){
    #sub3 .cate_inner {font-size: 2.2rem}
    #sub3 .cate_inner li {width: 100%}
}

/**** sub5-category ****/
#sub2 {position: relative;}
#sub2 .cate {position: sticky;}
#sub2 .cate_inner {border-bottom: 1px solid #AFB1B5}
#sub2 .cate_inner li {color: #7B7E80; min-width: 14rem; position: relative;}
#sub2 .cate_inner li a {padding: 2.4rem 0; display: block; text-align: center; line-height: 1.2;}
#sub2 .cate_inner li.on {color: #FE9992; font-weight: 500}
#sub2 .cate_inner li.on::before {content: ''; display: block; position: absolute; bottom: -2px; width: 100%; height: 3px; background: #FE9992}

@media all and (max-width: 800px){
    #sub2 .cate_inner {font-size: 2.2rem}
    #sub2 .cate_inner li {width: 100%}
}

/**** sign_up ****/
#sign {}
#sign .sign_inner {padding: 16rem 0 30rem}
#sign .sign_inner .mark {max-width: 16.4rem}
#sign .sign_inner .tit {margin-top: 5.6rem}
#sign .sign_inner .wrt {margin: 1.6rem 0 5.6rem}
#sign .sign_inner .login_icon {max-width: 51rem}

@media all and (max-width: 800px){

}
