.subVisual {z-index: 1}
.subVisual .imgArea {overflow: hidden;}
.subVisual .txtArea {}
.subVisual .txtArea .tit {}
.subVisual .txtArea .wrt {line-height: 3rem; padding-top: 3rem;}
.subVisual .subMenu {}
.subVisual .menuGnb {}
.subVisual .menuGnb li {}
.subVisual .menuGnb .home {margin-right: 4rem;}
.subVisual .menuGnb .home img {}
.subVisual .menuGnb .menuLst {padding: 2rem 2.8rem 2rem 4rem; min-width: 26.2rem;}
.subVisual .menuGnb .menuLst::before {content: ''; display: block; position: absolute; left: 0; height: 30%; background: #fff; top: 50%; transform: translateY(-50%); width: 1px;}
.subVisual .menuGnb .menuLst .tit {}
.subVisual .menuGnb .menuLst .tit span {}
.subVisual .menuGnb .menuLst .tit .arr {}
.subVisual .menuGnb .menuLst .menuLnb {top: 100%; background: #53A74A; padding: 2.8rem 0; display: none}
.subVisual .menuGnb .menuLst .menuLnb li + li {margin-top: 2.5rem;}
.subVisual .menuGnb .menuLst .menuLnb li a {display: block; padding-left: 3rem;}

.subVisual .menuGnb .menuLst .tit:hover {font-weight: 800}
.subVisual .menuGnb .menuLst .menuLnb li a:hover {font-weight: 800}

.subVisual .imgArea img {transform: scale(1.03); transition: 2s;}
.subVisual .imgArea.on img {transform: scale(1);}
.subVisual .txtArea {opacity: 0; transition: 2s;}
.subVisual .txtArea.on {opacity: 1;}

#sub {padding: 13rem 0; min-height: 100vh}
#sub.const1 {padding-bottom: 0}
#sub.const2 {padding-bottom: 0}
#sub.const3 {padding-bottom: 0}
#sub.const4 {padding-bottom: 0}

.subTitle {color: #333; margin-bottom: 10rem; opacity: 0}
.subTitle .tit {}
.subTitle .wrt {margin-top: 2.9rem; line-height: 3rem;}

@media all and (max-width: 920px){
    .subVisual .txtArea {max-width: 87.5%;}
    .subVisual .subMenu {max-width: 87.5%; margin: 0 auto}
    .subVisual .menuGnb .menuLst {min-width: 20rem; padding: 2rem 3rem;}
    .subVisual .menuGnb .menuLst:nth-child(3) {min-width: 25rem}
    .subVisual .menuGnb .menuLst .tit {display: flex; gap: 4rem}
    .subVisual .menuGnb .menuLst .tit .arr {width: 1.5rem;}

    #sub {padding: 8rem 0; min-height: auto}
    #sub.about {padding-bottom: 0}

    .subTitle {margin-bottom: 5rem;}
    .subTitle .wrt {margin-top: 2rem}
}

/*******회사소개 - 신화하이테크******/
.about {}
.about .s1 {}
.about .s1 .inner {padding-bottom: 13rem;}
.about .s1 .wrtBox {background: url('../img/sub/ab_img_1.jpg') no-repeat center/cover; padding: 11rem 0;}
.about .s1 .wrtBox .mainTxt {padding: 0 4.8% 0 36.36%; opacity: 0}
.about .s1 .wrtBox .mainTxt .tit {line-height: 4.5rem; padding-bottom: 4rem;}
.about .s1 .wrtBox .mainTxt .wrt {line-height: 3rem;}
.about .s1 .wrtBox .mainTxt .wrt + .wrt {padding-top: 2.5rem;}
.about .s1 .wrtBox .subTxt {line-height: 4.5rem; width: 36.5rem; height: 37.7rem; padding: 5.2rem 0 0 3.7rem; background: #2D7A5C; left: 3.4%; bottom: -31%;}
.about .s1 .wrtBox .subTxt .bgImg {width: 73.42%;}

.about .s1 .wrtBox .subTxt {opacity: 0; bottom: -40%; transition: 1s;}
.about .s1 .wrtBox .subTxt.on {opacity: 1; bottom: -31%;}

.about .s1 .historyArea {padding-top: 25.7rem; position: relative;}
.about .s1 .historyArea::before {content: ''; position: absolute; display: block; width: 1px; height: 96%; background: #DDDDDD; left: calc(50% - 1px); top: 0}
.about .s1 .historyLst {position: relative;}
.about .s1 .historyLst + .historyLst {margin-top: 10.3rem;}
.about .s1 .historyLst::before {content: ''; display: block; position: absolute; width: 1.5rem; height: 1.5rem; background: #2D7A5C; border-radius: 100%; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.about .s1 .historyLst .tit {width: 50%}
.about .s1 .historyLst .wrt {width: 50%}
.about .s1 .historyLst .wrt li {}
.about .s1 .historyLst .wrt li + li {margin-top: 3.5rem;}
.about .s1 .historyLst .wrt li span {}
.about .s1 .historyLst .wrt li i {line-height: 3rem;}
.about .s1 .historyLst.oddLst {}
.about .s1 .historyLst.oddLst .tit {padding-right: 11rem;}
.about .s1 .historyLst.oddLst .wrt {padding-left: 11rem}
.about .s1 .historyLst.oddLst .wrt span {padding-right: 5.2rem;}
.about .s1 .historyLst.evenLst {}
.about .s1 .historyLst.evenLst .tit {padding-left: 11rem;}
.about .s1 .historyLst.evenLst .wrt {padding-right: 11rem;}
.about .s1 .historyLst.evenLst .wrt li {justify-content: flex-end;}
.about .s1 .historyLst.evenLst .wrt span {padding-left: 5.2rem;}

.about .s1 .historyLst {top: 4rem; opacity: 0; transition: 1s;}
.about .s1 .historyLst.on {top: 0; opacity: 1;}

@media all and (max-width: 920px){
    .about .s1 .inner {max-width: 90%; padding-bottom: 8rem;}
    .about .s1 .wrtBox {background: none; padding: 0}
    .about .s1 .wrtBox .mainTxt {background: url('../img/sub/ab_img_1.jpg') no-repeat center/cover; padding: 6.2rem 3.7rem;}
    .about .s1 .wrtBox .mainTxt .tit {padding-bottom: 3rem;}
    .about .s1 .wrtBox .mainTxt .wrt + .wrt {padding-top: 1.8rem;}
    .about .s1 .wrtBox .subTxt {position: relative; width: 100%; left: 0; bottom: 0; padding: 4rem; height: 30rem; font-size: 3.5rem; line-height: 4.5rem;}
    .about .s1 .wrtBox .subTxt .bgImg {width: 48%;}

    .about .s1 .historyArea {padding-top: 10rem}
    .about .s1 .historyArea::before {height: 100%}
    .about .s1 .historyLst {align-items: start;}
    .about .s1 .historyLst + .historyLst {margin-top: 9rem;}
    .about .s1 .historyLst .tit {top: -1rem;}
    .about .s1 .historyLst .wrt li {flex-direction: column; align-items: baseline; gap: 0.6rem;}
    .about .s1 .historyLst.oddLst .tit {padding-right: 6rem}
    .about .s1 .historyLst.oddLst .wrt {padding-left: 2.6rem;}
    .about .s1 .historyLst.evenLst .tit {padding-left: 6rem}
    .about .s1 .historyLst.evenLst .wrt {padding-right: 2.6rem}
    .about .s1 .historyLst.evenLst .wrt li {flex-direction: column-reverse; align-items: end;}
}

.about .s2 {background: #F7F7F7}
.about .s2 .inner {padding: 13rem 0;}
.about .s2 .title {margin-bottom: 5rem;}
.about .s2 .abS2Swiper {overflow: hidden;}
.about .s2 .ab_s2_prev,
.about .s2 .ab_s2_next {width: 7.5rem; height: 7.5rem;}
.about .s2 .ab_s2_prev::after,
.about .s2 .ab_s2_next::after {display: none;}
.about .s2 .ab_s2_prev {background: url('../img/sub/ab_s2_prev.png') center/contain; left: -10%; top: 54%;}
.about .s2 .ab_s2_next {background: url('../img/sub/ab_s2_next.png') center/contain; right: -10%; top: 54%;}
.about .s2 .patentModal {z-index: 99999; display: none}
.about .s2 .modalBg {background: rgba(0,0,0,0.4);}
.about .s2 .patentBox {}

@media all and (max-width: 920px){
    .about .s2 .inner {padding: 8rem 0;}
    .about .s2 .abS2Swiper {max-width: 72.8%; margin: 0 auto}
    .about .s2 .ab_s2_prev,
    .about .s2 .ab_s2_next {width: 4.8rem; height: 4.8rem; top: 60%}
    .about .s2 .ab_s2_prev {left: 3%;}
    .about .s2 .ab_s2_next {right: 3%;}
}

.about .s3 {}
.about .s3 .inner {padding: 16rem 0 11.6rem;}
.about .s3 .title {margin-bottom: 6rem;}
.about .s3 .title .tit {padding-bottom: 1.4rem;}
.about .s3 .title .wrt {}
.about .s3 .lstArea {gap: 1rem 2rem;}
.about .s3 .lstArea li {width: calc((100% - 6rem) / 4);}

.about .s3 .lstArea li {opacity: 0; top: 4rem; transition: 1s;}
.about .s3 .lstArea li.on {opacity: 1; top: 0}

@media all and (max-width: 920px){
    .about .s3 .inner {padding: 10rem 0;}
    .about .s3 .title .tit {font-size: 4rem; padding-bottom: 1.6rem;}
    .about .s3 .lstArea {gap: 1.4rem 1.75rem; max-width: 90%; margin: 0 auto}
    .about .s3 .lstArea li {width: calc((100% - 1.75rem) / 2); border: 1px solid #eee;}
}

.about .s4 {}
.about .s4 .inner {}
.about .s4 .title {margin-bottom: 9rem;}
.about .s4 .tabLst {}
.about .s4 .tabLst li {width: 44rem; padding: 2.5rem 0; border-bottom: 2px solid #53A74A;}
.about .s4 .tabLst li:hover {background: #78b671; color: #fff; font-weight: bold}
.about .s4 .tabLst li.on {background: #53A74A; color: #fff; font-weight: bold}
.about .s4 .tabBox {display: none;}
.about .s4 .tabBox.on {display: block}
.about .s4 .infoBox {background: #2D7A5C; padding: 7rem 8rem 8rem; top: -12rem; z-index: 99}
.about .s4 .infoBox .inner {}
.about .s4 .infoBox .infoArea {width: 46.5%}
.about .s4 .infoBox .infoTit {margin-bottom: 4.7rem;}
.about .s4 .infoBox .lst {gap: 2.8rem 0; justify-content: space-between;}
.about .s4 .infoBox .lst li {}
.about .s4 .infoBox .lst li .ico {margin-right: 0.5rem; width: 1.8rem;}
.about .s4 .infoBox .lst li .tit {margin-right: 1.2rem;}
.about .s4 .infoBox .lst li .wrt {}
.about .s4 .infoBox .linkArea {gap: 2rem;}
.about .s4 .infoBox .linkArea a {width: 23rem; height: 15.6rem; background: rgba(255,255,255,0.2); padding: 3rem; line-height: 3rem; transition: 0.4s;}
.about .s4 .infoBox .linkArea a::before {content: ''; display: block; position: absolute; width: 3rem; height: 3rem; background: url('../img/sub/ab_btn_ico.svg') no-repeat center/contain; right: 2.7rem; bottom: 2.1rem;}
.about .s4 .infoBox .linkArea a:hover {background: rgba(255,255,255,0.4);}

#map {width: 100%; height: 55rem}
#map2 {width: 100%; height: 55rem}
#map3 {width: 100%; height: 55rem}

@media all and (max-width: 920px){
    .about .s4 .title {margin-bottom: 4.7rem;}
    .about .s4 .infoBox {padding: 4rem 3rem; top: 0}
    .about .s4 .infoBox .infoArea {width: auto}
    .about .s4 .infoBox .infoTit {margin-bottom: 2.4rem;}
    .about .s4 .infoBox .lst {gap: 2rem; flex-direction: column;}
    .about .s4 .infoBox .lst li {flex-direction: column;}
    .about .s4 .infoBox .lst li .wrt {padding-left: 2.2rem;}
    .about .s4 .infoBox .linkArea {flex-direction: column; gap: 1rem;}
    .about .s4 .infoBox .linkArea a {width: 21.3rem; height: 14.4rem;}

    #map {width: 100%; height: 40rem}
    #map2 {width: 100%; height: 40rem}
    #map3 {width: 100%; height: 40rem}
}
/*******회사소개 - 신화하이테크******/

/*******시공소개 - 공통******/
.const {}
.const .title {}
.const .title .tit {padding-right: 4rem; opacity: 0;}
.const .title .line {height: 1px; background: #C7C7C7}

.const .title .line {transition: 2s; flex-grow: 0;}
.const .title .line.on {flex-grow: 2;}

@media all and (max-width: 920px){
    .const .title {max-width: 90%; margin: 0 auto;}
    .const .title .tit {padding-right: 1.8rem;}
}

.const .s1 {}
/* .const .s1 .inner {padding: 14rem 0 9rem; background: url('../img/sub/const_s1_bg.png') no-repeat; background-position: right bottom;} */
.const .s1 .inner {padding: 14rem 0 9rem;}
.const .s1 .cont {background: #F4F4F4; border-radius: 5px; padding: 3rem 4rem 3rem 9.2rem; gap: 7.8rem;}
.const .s1 .cont + .cont {margin-top: 7.2rem;}
.const .s1 .cont .txtArea {flex-grow: 1; padding-top: 4.5rem;}
.const .s1 .cont .txtArea .tit {padding-bottom: 3rem; color: #53A74A}
.const .s1 .cont .txtArea .wrt {line-height: 4rem;}
.const .s1 .cont .txtArea .wrt i {color: #23562B; font-weight: 600}
.const .s1 .cont .imgArea {min-width: 54rem; top: -6.5rem;}

.const .s1 .cont .imgArea {opacity: 0; top: -5rem; transition: 1s;}
.const .s1 .cont .imgArea.trgOn {opacity: 1; top: -6.5rem}

@media all and (max-width: 920px){
    .const .s1 .inner {margin: 0 auto; padding: 3rem 3rem 10rem; background-size: 50%;}
    .const .s1 .cont {padding: 0 0 4.8rem; flex-direction: column-reverse; gap: 4.2rem;}
    .const .s1 .cont + .cont {margin-top: 4rem}
    .const .s1 .cont .imgArea {top: 0}
    .const .s1 .cont .txtArea {padding: 0; padding: 0 3.5rem;}
    .const .s1 .cont .txtArea .tit {padding-bottom: 2rem;}

    .const .s1 .cont .imgArea.trgOn {top: 0}
}

.const .s2 {}
.const .s2 .inner {padding: 13rem 0 16rem; background: url('../img/sub/const_s2_bg.jpg') no-repeat center/cover;}
.const .s2 .cont1 {}
.const .s2 .cont2 {margin-top: 12rem}

.const .s2 .title {margin-bottom: 6rem;}
.const .s2 .constS2Swiper {max-width: 124.8rem; margin: 0 auto; overflow: hidden;}
.const .s2 .constS2Swiper .slide {gap: 8.2rem;}
.const .s2 .constS2Swiper .imgArea {max-width: 69.2rem;}
.const .s2 .constS2Swiper .txtArea {}
.const .s2 .constS2Swiper .txtArea .num {margin-bottom: 5rem;}
.const .s2 .constS2Swiper .txtArea .num::before {content: ''; display: block; position: absolute; width: 100%; height: 2px; background: #fff; top: 105%;}
.const .s2 .constS2Swiper .txtArea .tit {}
.const .s2 .const_s2_prev,
.const .s2 .const_s2_next {width: 5.5rem; height: 5.5rem;}
.const .s2 .const_s2_prev::after,
.const .s2 .const_s2_next::after {display: none;}
.const .s2 .const_s2_prev {background: url('../img/sub/ab_s2_prev.png') center/contain; left: 8%; top: 57%;}
.const .s2 .const_s2_next {background: url('../img/sub/ab_s2_next.png') center/contain; right: 8%; top: 57%;}

.const .s2 .constS2Swiper2 {max-width: 124.8rem; margin: 0 auto; overflow: hidden;}
.const .s2 .constS2Swiper2 .slide {gap: 8.2rem;}
.const .s2 .constS2Swiper2 .imgArea {max-width: 69.2rem;}
.const .s2 .constS2Swiper2 .txtArea {}
.const .s2 .constS2Swiper2 .txtArea .num {margin-bottom: 5rem;}
.const .s2 .constS2Swiper2 .txtArea .num::before {content: ''; display: block; position: absolute; width: 100%; height: 2px; background: #fff; top: 105%;}
.const .s2 .constS2Swiper2 .txtArea .tit {}
.const .s2 .const_s2_prev2,
.const .s2 .const_s2_next2 {width: 5.5rem; height: 5.5rem;}
.const .s2 .const_s2_prev2::after,
.const .s2 .const_s2_next2::after {display: none;}
.const .s2 .const_s2_prev2 {background: url('../img/sub/ab_s2_prev.png') center/contain; left: 8%; top: 57%;}
.const .s2 .const_s2_next2 {background: url('../img/sub/ab_s2_next.png') center/contain; right: 8%; top: 57%;}

@media all and (max-width: 920px){
    .const .s2 .inner {padding: 8rem 0 11rem;}
    .const .s2 .cont1 {}
    .const .s2 .cont2 {margin-top: 10rem}

    .const .s2 .title {margin-bottom: 3rem;}
    .const .s2 .constS2Swiper {max-width: 68.75%; margin: 0 auto;}
    .const .s2 .constS2Swiper .slide {flex-direction: column; align-items: baseline; gap: 3rem}
    .const .s2 .constS2Swiper .txtArea {display: flex; align-items: center; gap: 2rem}
    .const .s2 .constS2Swiper .txtArea .num {margin-bottom: 0; padding-left: 1.5rem;}
    .const .s2 .constS2Swiper .txtArea .num::before {width: 1px; height: 60%; top: 50%; transform: translateY(-50%); left: 0;}
    .const .s2 .const_s2_prev,
    .const .s2 .const_s2_next {width: 4rem; height: 4rem; top: 52%;}
    .const .s2 .const_s2_prev {left: 5%}
    .const .s2 .const_s2_next {right: 5%}

    .const .s2 .constS2Swiper2 {max-width: 68.75%; margin: 0 auto;}
    .const .s2 .constS2Swiper2 .slide {flex-direction: column; align-items: baseline; gap: 3rem}
    .const .s2 .constS2Swiper2 .txtArea {display: flex; align-items: center; gap: 2rem}
    .const .s2 .constS2Swiper2 .txtArea .num {margin-bottom: 0; padding-left: 1.5rem;}
    .const .s2 .constS2Swiper2 .txtArea .num::before {width: 1px; height: 60%; top: 50%; transform: translateY(-50%); left: 0;}
    .const .s2 .const_s2_prev2,
    .const .s2 .const_s2_next2 {width: 4rem; height: 4rem; top: 52%;}
    .const .s2 .const_s2_prev2 {left: 5%}
    .const .s2 .const_s2_next2 {right: 5%}
}
/*******시공소개 - 공통******/

/*******시공소개 - AMIP 공법******/
.const1 .s3 {}
.const1 .s3 .inner {padding: 13rem 3rem;}
.const1 .s3 .title {margin-bottom: 8rem}
.const1 .s3 .ulCont {gap: 6rem;}
.const1 .s3 .ulCont > li {}
.const1 .s3 .ulCont > li::before {content: ''; display: block; position: absolute; width: 100%; height: 100%; border: 5px solid transparent; border-radius: 5px; background: transparent; padding: 1rem 1rem 0; top: -2.4rem; left: 50%; transform: translateX(-50%); box-sizing: content-box; transition: 1s;}
.const1 .s3 .ulCont > li .imgArea {}
.const1 .s3 .ulCont > li .ulContTit {padding: 2rem 4rem; background: #A9A9A9;}
.const1 .s3 .ulCont > li .ulContLst {padding: 5.3rem 3.8rem;}
.const1 .s3 .ulCont > li .ulContLst li {gap: 5px}
.const1 .s3 .ulCont > li .ulContLst li + li {margin-top: 1.9rem;}
.const1 .s3 .ulCont > li .ulContLst li .ico {}

.const1 .s3 .ulCont > li.on .ulContTit {background: #53A74A}
.const1 .s3 .ulCont > li.on::before {background: #F5F5F5; border: 5px solid #23562B; padding: 2.4rem 2.4rem 0;}

@media all and (max-width: 920px){
    .const1 .s3 .inner {padding: 8rem 0; max-width: 90%; margin: 0 auto;}
    .const1 .s3 .title {font-size: 4rem; margin-bottom: 4rem;}
    .const1 .s3 .ulCont {padding: 0 1rem; gap: 3rem;}
    .const1 .s3 .ulCont > li .ulContLst li {align-items: flex-start;}
    .const1 .s3 .ulCont > li.on::before {top: -1.8rem; border: 3px solid #23562B; padding: 1.4rem 1.4rem 0;}
    .const1 .s3 .ulCont > li .imgArea {}
    .const1 .s3 .ulCont > li .ulContTit {padding: 1.2rem 1.4rem; font-size: 2.7rem;}
    .const1 .s3 .ulCont > li .ulContLst {padding: 2rem 1rem; font-size: 2rem;}
    .const1 .s3 .ulCont > li .ulContLst li .ico {width: 2rem; margin-top: 0.4rem;}
}

.const1 .s4 {background: #F7F7F7;}
.const1 .s4 .inner {padding: 13rem 0;}
.const1 .s4 .title {margin-bottom: 5.4rem;}
.const1 .s4 .contArea {padding: 7rem 7.6rem; background: #fff; border-radius: 35px;}
.const1 .s4 .contBox {}
.const1 .s4 .contBox + .contBox {margin-top: 6rem;}
.const1 .s4 .contBox .contTit {margin-bottom: 4rem;}
.const1 .s4 .contBox .contLst {gap: 2.8rem;}
.const1 .s4 .contBox .contLst img {width: calc((100% - 5.6rem) / 3);}

@media all and (max-width: 920px){
    .const1 .s4 .inner {max-width: 90%; margin: 0 auto; padding: 8rem 0 9.5rem;}
    .const1 .s4 .title {font-size: 4rem; margin-bottom: 5rem;}
    .const1 .s4 .contArea {padding: 6rem 3rem; border-radius: 20px;}
    .const1 .s4 .contBox .contTit {line-height: 3.8rem; margin-bottom: 2.5rem; font-size: 2.4rem;}
    .const1 .s4 .contBox .contLst {flex-direction: column; gap: 2rem;}
    .const1 .s4 .contBox .contLst img {width: 100%}
}
/*******시공소개 1 - AMIP 공법******/

/*******시공소개 2 - TPSM&TEAM 공법******/
.const2 .s2 .inner {padding: 13rem 0;}
.const2 .s2 .lst {gap: 5.8rem;}
.const2 .s2 .lst li {}
.const2 .s2 .lst li .tit {margin-bottom: 5rem;}
.const2 .s2 .lst li .imgArea {width: 100%}
.const2 .s2 .lst li .imgArea video {width: 100%; height: 100%;}

@media all and (max-width: 920px){
    .const2 .s2 .inner {padding: 9rem 0;}
    .const2 .s2 .lst {flex-direction: column; max-width: 90%; margin: 0 auto;}
    .const2 .s2 .lst li .tit {font-size: 4rem; margin-bottom: 3.5rem;}
}

.const2 .s3 {background: #F7F7F7}
.const2 .s3 .inner {padding: 13rem 0;}
.const2 .s3 .title {margin-bottom: 6rem;}
.const2 .s3 .contBox {padding: 7rem 7.2rem 8.5rem; border-radius: 35px}
.const2 .s3 .contBox + .contBox {margin-top: 2.5rem;}
.const2 .s3 .contBox .contTit {margin-bottom: 2.9rem;}
.const2 .s3 .contBox .contTxt {margin-bottom: 4.9rem; gap: 6.5rem;}
.const2 .s3 .contBox .contTxt .txtLst {gap: 5px; color: #333}
.const2 .s3 .contBox .imgArea {}

@media all and (max-width: 920px){
    .const2 .s3 .inner {padding: 8rem 0;}
    .const2 .s3 .title {font-size: 4rem; margin-bottom: 5rem;}
    .const2 .s3 .contBox {max-width: 90%; margin: 0 auto; padding: 6rem 3rem; border-radius: 20px;}
    .const2 .s3 .contBox + .contBox {margin-top: 3rem;}
    .const2 .s3 .contBox .contTit {margin-bottom: 2.5rem;}
    .const2 .s3 .contBox .contTxt {flex-direction: column; gap: 1rem; margin-bottom: 6rem;}
    .const2 .s3 .contBox .contTxt .txtLst {font-size: 2.2rem}
    .const2 .s3 .contBox .contTxt .txtLst img {width: 2.4rem;}
}
/*******시공소개 - TPSM&TEAM 공법******/

/*******시공소개 3 - PS BEAM 공법******/
.const3 .s3 {}
.const3 .s3 .inner {padding: 13rem 3rem;}
.const3 .s3 .title {margin-bottom: 8rem}
.const3 .s3 .ulCont {gap: 6rem;}
.const3 .s3 .ulCont > li {}
.const3 .s3 .ulCont > li::before {content: ''; display: block; position: absolute; width: 100%; height: 100%; border: 5px solid transparent; border-radius: 5px; background: transparent; padding: 1rem 1rem 0; top: -2.4rem; left: 50%; transform: translateX(-50%); box-sizing: content-box; transition: 1s;}
.const3 .s3 .ulCont > li .imgArea {}
.const3 .s3 .ulCont > li .ulContTit {padding: 2rem 4rem; background: #A9A9A9;}
.const3 .s3 .ulCont > li .ulContLst {padding: 5.3rem 3.8rem;}
.const3 .s3 .ulCont > li .ulContLst li {gap: 5px}
.const3 .s3 .ulCont > li .ulContLst li + li {margin-top: 1.9rem;}
.const3 .s3 .ulCont > li .ulContLst li .ico {}

.const3 .s3 .ulCont > li.on .ulContTit {background: #53A74A}
.const3 .s3 .ulCont > li.on::before {background: #F5F5F5; border: 5px solid #23562B; padding: 2.4rem 2.4rem 0;}

@media all and (max-width: 920px){
    .const3 .s3 .inner {padding: 8rem 0; max-width: 90%; margin: 0 auto;}
    .const3 .s3 .title {font-size: 4rem; margin-bottom: 4rem;}
    .const3 .s3 .ulCont {padding: 0 1rem; gap: 3rem;}
    .const3 .s3 .ulCont > li .ulContLst li {align-items: flex-start;}
    .const3 .s3 .ulCont > li.on::before {top: -1.8rem; border: 3px solid #23562B; padding: 1.4rem 1.4rem 0;}
    .const3 .s3 .ulCont > li .imgArea {}
    .const3 .s3 .ulCont > li .ulContTit {padding: 1.2rem 1.4rem; font-size: 2.5rem; min-height: 52px}
    .const3 .s3 .ulCont > li .ulContLst {padding: 2rem 1rem; font-size: 2rem;}
    .const3 .s3 .ulCont > li .ulContLst li .ico {width: 2rem; margin-top: 0.4rem;}
}

.const3 .s4 {background: #F7F7F7}
.const3 .s4 .inner {padding: 13rem 0;}
.const3 .s4 .title {margin-bottom: 6rem;}
.const3 .s4 .contBox {padding: 7rem 7.2rem 8.5rem; border-radius: 35px}
.const3 .s4 .contBox + .contBox {margin-top: 2.5rem;}
.const3 .s4 .contBox .contTit {margin-bottom: 2.9rem;}
.const3 .s4 .contBox .contTxt {margin-bottom: 9rem; gap: 6.5rem;}
.const3 .s4 .contBox .contTxt .txtLst {gap: 5px; color: #333333}
.const3 .s4 .contBox .contTxt .txtLst2 {}
.const3 .s4 .contBox .contTxt .txtLst2 b {color: #23562B}
.const3 .s4 .contBox .contImg {gap: 4.7rem;}
.const3 .s4 .contBox .compWrap {gap: 4rem;}
.const3 .s4 .contBox .component {}
.const3 .s4 .contBox .component .tit {margin-bottom: 1.5rem;}
.const3 .s4 .contBox .component .imgArea {}
.const3 .s4 .contBox .component .absTxt {background: rgba(35,86,43,0.7); padding: 3rem 4.5rem; border-radius: 35px; top: 3.5rem; left: 3rem; line-height: 3rem;}

@media all and (max-width: 920px){
    .const3 .s4 .inner {max-width: 90%; margin: 0 auto; padding: 8rem 0 9.5rem;}
    .const3 .s4 .title {font-size: 4rem; margin-bottom: 5rem;}
    .const3 .s4 .contBox {padding: 6rem 3rem; border-radius: 20px;}
    .const3 .s4 .contBox .contTit {margin-bottom: 2.5rem;}
    .const3 .s4 .contBox .contTxt {flex-direction: column; gap: 1rem; margin-bottom: 6rem;}
    .const3 .s4 .contBox .contTxt .txtLst img {width: 2.4rem;}
    .const3 .s4 .contBox .contTxt .txtLst2.etc2 {flex-direction: column; align-items: baseline; gap: 3px;}
    .const3 .s4 .contBox .contTxt .txtLst2.etc2 b {padding-left: 3rem;}
    .const3 .s4 .contBox .contImg {flex-direction: column;}
    .const3 .s4 .contBox .component .absTxt {border-radius: 20px; padding: 3rem;}
}
/*******시공소개 - PS BEAM 공법******/

/*******시공소개 4 - URF 공법******/
.const4 .s3 {background: #F7F7F7;}
.const4 .s3 .inner {padding: 13rem 0;}
.const4 .s3 .title {margin-bottom: 7.8rem;}
.const4 .s3 .contArea {padding: 5.2rem 7rem 7.2rem; background: #fff; border-radius: 35px; gap: 8rem 4rem;}
.const4 .s3 .contBox {width: calc((100% - 4rem) / 2);}
.const4 .s3 .contBox .contTit {margin-bottom: 2.9rem; }
.const4 .s3 .contBox .contImg {}

@media all and (max-width: 920px){
    .const4 .s3 .inner {max-width: 90%; margin: 0 auto; padding: 8rem 0 9.5rem;}
    .const4 .s3 .title {font-size: 4rem; margin-bottom: 5rem;}
    .const4 .s3 .contArea {padding: 6rem 3rem; gap: 6rem}
    .const4 .s3 .contBox {width: 100%;}
    .const4 .s3 .contBox .contTit {margin-bottom: 2.2rem; font-size: 2.5rem;}
}
/*******시공소개 - URF 공법******/

/*******시공소개 5 - CCM 공법******/
.const5 .s3 {background: #F7F7F7;}
.const5 .s3 .inner {padding: 13rem 0;}
.const5 .s3 .title {margin-bottom: 5.4rem;}
.const5 .s3 .contArea {padding: 7rem 7.6rem; background: #fff; border-radius: 35px;}
.const5 .s3 .contBox {}
.const5 .s3 .contBox + .contBox {margin-top: 6rem;}
.const5 .s3 .contBox .contTit {margin-bottom: 4rem;}
.const5 .s3 .contBox .contLst {gap: 2.8rem;}
.const5 .s3 .contBox .contLst img {width: calc((100% - 5.6rem) / 3);}

@media all and (max-width: 920px){
    .const5 .s3 .inner {max-width: 90%; margin: 0 auto; padding: 8rem 0 9.5rem;}
    .const5 .s3 .title {font-size: 4rem; margin-bottom: 5rem;}
    .const5 .s3 .contArea {padding: 6rem 3rem; border-radius: 20px;}
    .const5 .s3 .contBox .contTit {line-height: 3.8rem; margin-bottom: 2.5rem; font-size: 2.4rem;}
    .const5 .s3 .contBox .contLst {flex-direction: column; gap: 2rem;}
    .const5 .s3 .contBox .contLst img {width: 100%}
}
/*******시공소개 - CCM 공법******/


/*******시공성과 - 대표 시공 성과 사례******/
.result1 {}
.result1 .inner {padding-top: 2rem;}
.result1 .resultLstArea {gap: 8rem;}
.result1 .resultLst {width: calc((100% - 8rem) / 2); opacity: 0}
.result1 .resultLst .tit {color: #333; padding: 2rem 0; letter-spacing: -0.1rem; position: relative;}
.result1 .resultLst .tit::before {content: ''; display: block; position: absolute; width: 4.5rem; height: 4px; background: #53A74A; top: 0; left: 0;}
.result1 .resultLst .wrt {color: #707070; line-height: 3.5rem; margin-bottom: 4.3rem; letter-spacing: 0;}
.result1 .resultLst .lst {background: #F8F8F8; padding: 5rem; margin-top: auto;}
.result1 .resultLst .lst li {}
.result1 .resultLst .lst li {color: #666666; display: flex}
.result1 .resultLst .lst li + li {margin-top: 3.8rem;}
.result1 .resultLst .lst li span {min-width: 12rem; color: #333333}
.result1 .resultTable {border: 2px solid #000000; border-right: 0; border-left: 0; margin-top: 10rem;}
.result1 .resultTable thead {border-bottom: 1px solid #999999;}
.result1 .resultTable thead tr {}
.result1 .resultTable thead th {padding: 2.7rem 0; font-weight: bold}
.result1 .resultTable thead th:last-child {border-left: 1px dotted #999999}
.result1 .resultTable tbody {}
.result1 .resultTable tbody tr {border-top: 1px dotted #999999}
.result1 .resultTable tbody td {color: #666666; padding: 2.5rem 0}
.result1 .resultTable tbody td:last-child {border-left: 1px dotted #999999}

@media all and (max-width: 920px){
    .result1 .inner {padding: 0; max-width: 90%; margin: 0 auto;}
    .result1 .resultLstArea {gap: 5rem;}
    .result1 .resultLst {width: 100%}
    .result1 .resultLst .tit {font-size: 2.7rem}
    .result1 .resultLst .wrt {margin-bottom: 2rem; line-height: 3rem;}
}
/*******시공성과 - 대표 시공 성과 사례******/

/*******시공성과 - 시공실적******/
.perform {}
.perform + .perform {margin-top: 10rem;}
.performTitle {margin-bottom: 6rem; color: #333333; gap: 3.8rem; opacity: 0}
.performTitle .line {height: 2px; background: #23562B; flex-grow: 1;}
.performTitle span {color: #53A74A}
.performWrap {opacity: 0}
.performTable {border: 2px solid #000000; border-right: 0; border-left: 0; opa}
.performTable thead {background: #EEEEEE;}
.performTable thead tr {}
.performTable thead th {padding: 2.6rem 0; font-weight: bold; border-right: 1px dotted #999999; border-bottom: 1px solid #999999;}
.performTable thead th.border0 {border-right: 0;}
.performTable thead th:last-child {border-right: 0}
.performTable tbody {}
.performTable tbody tr {}
.performTable tbody td {padding: 2.5rem 0; color: #666666; line-height: 3rem; border-right: 1px dotted #999999; border-top: 1px dotted #999999;}
.performTable tbody td.border0 {border-right: 0;}
.performTable tbody td.etc {padding: 1rem 0;}
.performTable tbody td:last-child {border-right: 0}

@media all and (max-width: 920px){
    .result2 .inner {max-width: 95%; margin: 0 auto;}
    .performTitle {font-size: 3.5rem; margin-bottom: 4rem;}
    .performWrap {padding-bottom: 10px; overflow-x: scroll;}
    .performTable {min-width: 500px;}
    .performTable thead {font-size: 1.5rem;}
    .performTable tbody {font-size: 1.4rem;}
}
/*******시공성과 - 시공실적******/

/*******고객지원 - 상담 신청하기******/
.consult .formCont {max-width: 61rem; padding-top: 2rem;}
.consult .formCont .formLst {gap: 6rem 4.7rem}
.consult .formCont .formLst li {width: calc((100% - 4.7rem) / 2); border-bottom: 1px solid #566869; padding-bottom: 1.5rem;}
.consult .formCont .formLst li label {min-width: 10.5rem; min-width: 10.5rem;}
.consult .formCont .formLst li input {width: 100%; box-shadow: none; border: 0}
.consult .formCont .formCheck {gap: 3rem; padding: 6rem 0;}
.consult .formCont .formCheck li {color: #666666}
.consult .formCont .formCheck li input {display: none;}
.consult .formCont .formCheck li input + label {padding-left: 2.8rem; background: url('../img/main/s4_check_off.png') no-repeat; background-size: 2.4rem 2.4rem; background-position: left center;}
.consult .formCont .formCheck li input:checked + label {background: url('../img/main/s4_check_on.png') no-repeat; background-size: 2.4rem 2.4rem; background-position: left center;}
.consult .formCont .formTxt {}
.consult .formCont .formTxt .tit {padding-bottom: 2.2rem;}
.consult .formCont .formTxt textarea {box-shadow: none; border-radius: 5px; border: 1px solid #666666; width: 100%; height: 24rem}
.consult .formCont .formTxt textarea::placeholder {font-family: "Pretendard", sans-serif;}
.consult .formCont .submitBtn {background: #0F6641; padding: 2rem 0; margin-top: 4rem;}

@media all and (max-width: 920px){
    .consult .formCont {max-width: 90%; margin: 0 auto; padding: 0}
    .consult .formCont .formCheck {gap: 1.4rem; justify-content: space-between;}
}
/*******고객지원 - 상담 신청하기******/

/*******게시판 - 시공현황 & 공지사항 & 문의게시판******/
.board {}
.board .inner {}

.board .topArea {margin-bottom: 2.6rem}
.board .topArea .count {color: #8E8E8E}
.board .topArea .right {gap: 2rem;}
.board .topArea .search {}
.board .topArea .search .iptArea {background: #EEEEEE; border-radius: 100px; padding: 1rem 3rem;}
.board .topArea .search .iptArea input {box-shadow: none; border-radius: 0; border: 0; width: 22.9rem; background: transparent;}
.board .topArea .search .iptArea input:focus {outline: none; border: 0 !important;}
.board .topArea .search .iptArea button {}
.board .topArea .writeBtn {}

.board .boardTable {border-top: 2px solid #000000;}
.board .boardTable thead {}
.board .boardTable thead tr {border-bottom: 1px solid #999999;}
.board .boardTable thead th {font-weight: bold; padding: 2rem 0;}
.board .boardTable tbody {}
.board .boardTable tbody tr {border-bottom: 1px solid #CCCCCC}
.board .boardTable tbody tr.noticeTr {background: #f2f2f2}
.board .boardTable tbody td {text-align: center;}
.board .boardTable tbody td.subj {text-align: left}
.board .boardTable tbody td.subj:hover {font-weight: 500}
.board .boardTable tbody td.subj a {display: block; padding: 2.5rem 0}

.board .boardView {}

.board .viewTop {}
.board .viewTop .title {}
.board .viewTop .viewOpt {padding: 3.1rem 0 3.5rem; border-bottom: 2px solid #000000;}
.board .viewTop .viewOpt .infoArea {gap: 4rem;}
.board .viewTop .viewOpt .infoArea div {color: #626262}
.board .viewTop .viewOpt .btnArea {gap: 2rem;}
.board .viewTop .viewOpt .btnArea a {max-width: 3rem}
.board .viewTop .viewOpt .btnArea a img {display: block; width: 100%}

.board .viewCont {padding: 6rem 0; color: #666666; border-bottom: 1px solid #666666; line-height: 2.8rem;}

.board .file {margin-top: 4rem;}
.board .file li {display: flex; align-items: center; height: 6rem; background: #F5F6F7; border-top: 1px solid #ccc;}
.board .file li:last-child {border-bottom: 1px solid #ccc;}
.board .file li p:first-child {margin: 0 20px; color: #353535; font-weight: 700;}
.board .file li p:last-child {position: relative; padding-left: 4.2rem;}
.board .file li p:last-child::before {content: ''; position: absolute; top: 0; left: 0; width: 2.2rem; height: 2rem; background: url('../img/sub/ico_file2.png') 0 0 / cover;}
.board .file li p a {color: #797979; font-weight: 500;}
.board .prevNxt_list {margin-top: 1.5rem; border-top: 1px solid #353535; border-bottom: 1px solid #ddd;}
.board .prevNxt_list li {position: relative; display: flex; align-items: center; height: 6rem;}
.board .prevNxt_list li+li {border-top: 1px solid #ddd;}
.board .prevNxt_list span {height: 100%}
.board .prevNxt_list span:first-child {position: relative; width: 15rem; text-align: center; line-height: 6rem; padding-left: 2.55rem; background: #F5F6F7; color: #353535; font-weight: 700;}
.board .prevNxt_list span:first-child::before {content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: 3.1rem; width: 1rem; height: 0.5rem; background: url('../img/sub/ico_up.png') 0 0 / cover;}
.board .prevNxt_list span.next_list::before {transform: translateY(-50%) rotate(180deg);}
.board .prevNxt_list li a {padding-left: 3rem; font-size: 1.6rem;}
.board .prevNxt_list li .date {position: absolute; top: 50%; transform: translateY(-50%); right: 0; font-size: 1.4rem; color: #555; height: auto}

@media all and (max-width: 920px){
    .board .inner {max-width: 90%; margin: 0 auto}
    .board .topArea {align-items: center; margin-bottom: 1.5rem;}
    .board .topArea .right {gap: 1rem;}
    .board .topArea .search .iptArea {padding: 0.5rem 1.8rem}
    .board .topArea .search .iptArea input {height: 25px}
    .board .topArea .search .iptArea button {}
    .board .topArea .search .iptArea button img {width: 4rem}
    .board .topArea .writeBtn {}
    .board .topArea .writeBtn img {width: 4rem;}
    .board .viewTop .viewOpt .infoArea {gap: 2rem;}

    #bo_vc {margin-top: 2rem !important}
    #bo_vc article {margin: 8px 0 !important}
    #bo_vc .cmt_contents {padding: 10px 0 !important}
    .bo_vc_w .btn_submit {height: 30px}
}
/*******게시판 - 시공현황 & 공지사항 & 문의게시판******/

/*******게시판 - 시공&건축 정보******/
.gallery {}
.gallery .cateArea {margin-bottom: 6rem;}
.gallery .cateArea ul {position: relative;}
.gallery .cateArea ul::before {content: ''; display: block; position: absolute; width: 100%; height: 2px; background: #53A74A; bottom: 0; left: 0}
.gallery .cateArea ul li {flex-grow: 1; color: #666666;}
.gallery .cateArea ul li a {display: block; padding: 2.5rem 0;}
.gallery .cateArea ul li.on a {color: #fff; font-weight: bold; background: #53A74A;}
.gallery .cateArea ul li:hover a {color: #fff; font-weight: bold; background: #53A74A;}

.gallery .galArea {gap: 10rem 4rem;}
.gallery .galArea li {width: calc((100% - 4rem) / 2);}
.gallery .galArea li .imgArea {overflow: hidden;}
.gallery .galArea li .imgArea img {transition: 0.4s;}
.gallery .galArea li .imgArea:hover img {transform: scale(1.1);}
.gallery .galArea li .txtArea {margin-top: 3.3rem;}
.gallery .galArea li .txtArea .tit {padding-bottom: 2.4rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #333;}
.gallery .galArea li .txtArea .wrt {text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; color: #666; line-height: 2.8rem;}

@media all and (max-width: 920px){
    .gallery .cateArea ul li a {padding: 1.8rem 0}
    .gallery .btnArea .writeBtn img {width: 4rem}
    .gallery .galArea {gap: 6rem}
    .gallery .galArea li {width: 100%}
    .gallery .galArea li .txtArea .tit {padding-bottom: 1rem}
}
/*******게시판 - 시공&건축 정보******/


.pg_wrap {float: none; margin-top: 13rem; width: 100%;}
.pg_wrap:after {display: none}
.pg_wrap .pg {display: flex; align-items: center; justify-content: center; gap: 0.8rem}
.pg_wrap .pg .pg_page {width: 4rem; height: 4rem; font-size: 1.8rem; line-height: 4rem; font-weight: 400; color: #666666; background: transparent; border: 1px solid #CCCCCC; border-radius: 5px; transition: 0.1s;}
.pg_wrap .pg .pg_page:hover {background: #53A74A; color: #fff; border: 0}
.pg_wrap .pg .pg_page.pg_start {border: 1px solid #ccc; border-radius: 5px; background: url('../img/sub/icon_arrow_double_pagination_1.png') no-repeat center/contain}
.pg_wrap .pg .pg_page.pg_prev {border: 1px solid #ccc; border-radius: 5px; background: url('../img/sub/icon_arrow_pagination_1.png') no-repeat center/contain;}
.pg_wrap .pg .pg_page.pg_next {border: 1px solid #ccc; border-radius: 5px; background: url('../img/sub/icon_arrow_pagination_2.png') no-repeat center/contain;}
.pg_wrap .pg .pg_page.pg_end {border: 1px solid #ccc; border-radius: 5px; background: url('../img/sub/icon_arrow_double_pagination_2.png') no-repeat center/contain}
.pg_wrap .pg .pg_current {width: 4rem; height: 4rem; line-height: 4rem; background: #53A74A; border: 0; border-radius: 5px; font-size: 1.8rem;}















.