#header {background: #fff; z-index: 999; box-shadow: 0 3px 6px rgba(138,138,138,0.16);}
#header .inner {padding: 2.2rem 0; max-width: 142rem; margin: 0 auto;}
#header .logo {}
#header .txt {padding: 1.1rem 2.8rem; background: #65A1D8; border-radius: 2.2rem; margin: 0 13rem 0 3rem;}
#header .gnb {}
#header .gnb li {width: 14.4rem;}
#header .gnb li a {display: block; text-align: center;}
#header .login {color: #72787F; margin-left: 1.4rem; margin-left: auto;}
#header .login img {margin-left: 0.4rem;}

@media all and (max-width: 880px){
    #header {}
    #header .inner {padding: 1.9rem 2.4rem;}
    #header .logo {width: 20rem;}
    #header .logo img {width: 100%; display: block;}
    #header .txt {}
    #header .gnb {display: none;}
    #header .gnb li {}
    #header .gnb li a {}
    #header .login {font-size: 1.4rem;}
    #header .login img {width: 2.6rem;}
}

#footer {background: #012044;}
#footer .inner {max-width: 164rem; padding: 13rem 0 9.5rem;}
#footer .inner .info {color: #4A637E; line-height: 2.6rem}
#footer .inner .info i {font-style: normal;}
#footer .inner .copy {margin-left: 7.6rem; color: #4A637E;}
#footer .inner .ftLogo {margin-left: auto;}
#footer .inner .ftLogo img {width: 22.6rem;}

@media all and (max-width: 880px){
    #footer {}
    #footer .inner {overflow: hidden; padding: 4.8rem 0 6.4rem; flex-direction: column; align-items: baseline; max-width: 87.7%; margin: 0 auto;}
    #footer .inner .info {font-size: 1.4rem;}
    #footer .inner .info i {display: none;}
    #footer .inner .copy {margin: 0; font-size: 1.4rem; margin: 1.6rem 0 3.6rem;}
    #footer .inner .ftLogo {margin: 0}
}

#float {right: 6rem; z-index: 999}
#float .folatPc {}
#float .folatPc .box {background: #fff; padding: 2.4rem 1.6rem 3.3rem; border-radius: 2rem; box-shadow: 0 3px 6px rgba(0,0,0,0.16);}
#float .folatPc .list {gap: 1.8rem; padding: 0 1.9rem;}
#float .folatPc .list li {}
#float .folatPc .call {font-size: 2.1rem; font-weight: 800; padding-top: 2.4rem; margin-top: 2.4rem; border-top: 1px solid #C9CDD2;}
#float .folatPc .call a {gap: 1.2rem; line-height: 2.3rem}
#float .folatPc .box2 {border-radius: 2rem; padding: 2rem 0; margin-top: 1.6rem; box-shadow: 0 3px 6px rgba(0,0,0,0.16);}
#float .folatPc .box2.naver {background: #00C300; color: #fff;}
#float .folatPc .box2.kakao {background: #FAE100}
#float .folatPc .box2 a {gap: 0.4rem;}

@media all and (max-width: 880px){
    #wrap {overflow: hidden;}

    #float {right: 2.5rem; top: auto; transform: none; bottom: 7%}
    #float .folatMo {}
    #float .folatMo .lst1 {display: none;}
    #float .folatMo .lst2 {margin-top: 0.8rem;}
    #float .folatMo li {}
    #float .folatMo li + li {margin-top: 0.8rem;}
    #float .folatMo li img {width: 4.4rem; filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16))}
}

/** applyBar *****************/
#applyBar {position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); width: 134rem; padding: 3rem 0; border-radius: 3rem 3rem 0 0; background: #003067; display: flex; justify-content: center; align-items: center; z-index: 99; transition: transform .35s ease; transform: translate(-50%, 100%);}
#applyBar .barBtn {font-size: 1.6rem; font-weight: bold; background: #003067; color: #fff; display: flex; align-items: center; position: absolute; bottom: 100%; padding: 1.1rem 3.4rem; gap: 1rem; border-radius: 2rem 2rem 0 0; cursor: pointer}
#applyBar .barBtn img {transition: 0.3s;}
#applyBar .logo {margin-right: 3rem;}
#applyBar .logo img {max-width: 21rem;}
#applyBar .formWrap {margin-right: 6rem; display: flex; gap: 1rem;}
#applyBar .formWrap .inputArea {display: flex; flex-wrap: wrap; gap: 1rem; width: min-content;}
#applyBar .formWrap .inputArea .list {display: flex; gap: 1rem;}
#applyBar .formWrap .inputArea .list li {width: 17rem;}
#applyBar .formWrap .inputArea .list input {display: block; width: 100%; height: auto; padding: 1rem; box-sizing: border-box; font-size: 1.4rem; border: none; background: #fff; border-radius: 5px; font-family: inherit;}
#applyBar .formWrap .inputArea .list input:focus {outline: none; border: 0 !important; box-shadow: none;}
#applyBar .formWrap .inputArea .list select {display: block; width: 100%; height: auto; padding: 1rem; box-sizing: border-box; font-size: 1.4rem !important; border: none; border-radius: 5px; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: #fff url('../img/apply_ic_slide.svg') right 10% center no-repeat; font-family: inherit;}
#applyBar .formWrap .inputArea .list select:focus {outline: none; border: 0 !important; box-shadow: none;}
#applyBar .formWrap .inputArea .list li:last-child {width: 20rem;}
#applyBar .formWrap .inputArea .check {display: flex; align-items: center; color: #fff;}
#applyBar .formWrap .inputArea .check input {background: #fff; border: none; width: 1.5rem; height: 1.5rem; margin-top: -0.3rem; margin-right: 0.6rem;}
#applyBar .formWrap .inputArea .check a {margin-left: 0.6rem; color: #fff;}
#applyBar .formWrap .applyBtn {flex-shrink: 0; width: 10rem; display: flex; align-items: center; justify-content: center; background: #fff; height: 6.8rem; border-radius: 5px; color: #003067; font-family: inherit; font-weight: bold;}
#applyBar .formWrap .applyBtn i {display: none; font-style: normal;}
#applyBar .callWrap {color: #fff;}
#applyBar .callWrap .txt {margin-bottom: 0.3rem;}
#applyBar .callWrap .tit {}

#applyBar.active .barBtn img {transform: rotate(180deg);}

#applyBar.open {transform: translate(-50%, 0);}

@media all and (max-width: 880px) {
    #applyBar {width: 100%; padding: 3rem 2rem 2.5rem 2rem; box-sizing: border-box; border-radius: 0; z-index: 99999;}
    #applyBar .formWrap {flex-wrap: wrap; gap: 2rem; margin-right: 0;}
    #applyBar .formWrap .inputArea {width: 100%; flex-wrap: wrap; row-gap: 1.6rem;}
    #applyBar .formWrap .inputArea .list {flex-wrap: wrap; gap: 0.8rem; margin-bottom: 0;}
    #applyBar .formWrap .inputArea .list li {width: 100%;}
    #applyBar .formWrap .inputArea .list li:last-child {width: 100%;}
    #applyBar .formWrap .inputArea .list input {font-size: 1.6rem;}
    #applyBar .formWrap .inputArea .list select {font-size: 1.6rem !important; background-position: right 5% center;}
    #applyBar .formWrap .inputArea .check {font-size: 1.8rem;}
    #applyBar .formWrap .inputArea .check input {width: 1.4rem; height: 1.4rem; margin-right: 0.4rem;}
    #applyBar .formWrap .inputArea .check label {font-size: 1.1rem}
    #applyBar .formWrap .inputArea .check a {font-size: 1.1rem; margin-left: 0.2rem;}
    #applyBar .formWrap .applyBtn {width: auto; height: auto; font-size: 1.4rem; padding: 0.6rem 2.3rem; border-radius: 23px; position: absolute; font-weight: 800; bottom: -0.7rem; right: 0;}
    #applyBar .formWrap .applyBtn i {display: inline;}
}

#s1 {}
#s1 .vdArea {width: 100%; height: 100vh}
#s1 .vdArea div {width: 100%; height: 100%}
#s1 .vdArea video {width: 100%; height: 100%; object-fit: cover;}
#s1 .txtArea {z-index: 1; background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4990371148459384) 52%, rgba(255,255,255,0.969625350140056) 100%);}
#s1 .txtArea .txt {padding: 44.6rem 0 13.6rem;}
#s1 .txtArea .txt .tit {padding-bottom: 2.6rem;}
#s1 .txtArea .txt .wrt {letter-spacing: 1.3rem;}

@media all and (max-width: 880px){
    #s1 {}
    #s1 .vdArea {}
    #s1 .vdArea div {}
    #s1 .vdArea video {}
    #s1 .txtArea {}
    #s1 .txtArea .txt {padding: 47rem 0 14rem; align-items: baseline; padding-left: 2.4rem;}
    #s1 .txtArea .txt .tit {font-size: 4rem; line-height: 5.2rem; padding-bottom: 2.8rem;}
    #s1 .txtArea .txt .wrt {font-size: 1rem; letter-spacing: 0.3rem;}
}

#s2 {overflow: hidden;}
#s2 .inner {padding-top: 33.5rem; max-width: 136rem;}
#s2 .titArea {}
#s2 .titArea .num {gap: 3.8rem; justify-content: space-between;}
#s2 .titArea .num img {}
#s2 .titArea .num .line {width: 60rem; height: 1px; background: #C9CDD2;}
#s2 .titArea .txt {}
#s2 .titArea .txt .subt {}
#s2 .titArea .txt .tit {padding: 4.5rem 0 1.2rem;}
#s2 .titArea .txt .wrt {}
#s2 .lstArea {padding-top: 15rem;}
#s2 .lstArea li {flex: 1;}
#s2 .lstArea li img {}
#s2 .lstArea li .txt {padding-top: 2.2rem; line-height: 3rem;}
#s2 .lstArea li+li::before {content: ''; display: block; position: absolute; width: 1px; height: 50%; top: 50%; transform: translateY(-50%); background: #C9CDD2; left: 0}
#s2 .prg {padding-top: 8rem;}

@media all and (max-width: 880px){
    #s2 {}
    #s2 .inner {padding-top: 11.8rem;}
    #s2 .titArea {}
    #s2 .titArea .num {flex-direction: column; gap: 2.4rem;}
    #s2 .titArea .num img {width: 23rem;}
    #s2 .titArea .num .line {width: 1px; height: 6.4rem;}
    #s2 .titArea .txt {position: relative; text-align: center; margin-top: 7rem;}
    #s2 .titArea .txt .subt {font-size: 2.8rem; line-height: 3.8rem;}
    #s2 .titArea .txt .tit {font-size: 4rem; padding: 2rem 0 1.8rem; line-height: 5rem;}
    #s2 .titArea .txt .wrt {font-size: 2rem;}

    #s2 .slideArea {width: 30rem; margin: 0 auto; margin-top: 7rem;}
    #s2 .s2_swiper {overflow: hidden; padding: 1rem 1rem 4rem;}
    #s2 .s2_swiper .img {box-shadow: 0 3px 6px rgba(0,0,0,0.16); border-radius: 2rem; overflow: hidden;}
    #s2 .s2_swiper .s2_bar {}

    #s2 .prg {font-size: 2rem; padding-top: 6.4rem; line-height: 3rem;}
}

.comsubt {padding: 1rem 3rem; display: inline-block; background: #65A1D8; border-radius: 2rem 0 2rem 0; letter-spacing: 0.4rem; text-transform: uppercase;}

#s3 {}
#s3 .inner {padding-top: 35rem; max-width: 136rem;}
#s3 .titArea {}
#s3 .titArea .subt {}
#s3 .titArea .wrt {padding: 4rem 0 1.6rem;}
#s3 .titArea .tit {}
#s3 .imgArea {margin-top: 3.6rem;}
#s3 .btnArea {gap: 7.2rem 0; margin-top: 3.4rem;}
#s3 .btnArea li {gap: 8rem; width: 33.333%; align-items: flex-start; padding-left: 4.4rem;}
#s3 .btnArea li .name {gap: 1.2rem; padding-top: 1rem;}
#s3 .btnArea li .name .n1 {}
#s3 .btnArea li .name .n2 {}
#s3 .btnArea li .btn {gap: 1rem; cursor: pointer}
#s3 .btnArea li .btn img {width: 4.4rem; transition: 0.4s;}
#s3 .btnArea li .btn span {color: #C9CDD2}
#s3 .btnArea li.line {border-left: 1px solid #C9CDD2;}
#s3 .btnArea li .btn:hover img {transform: rotate(180deg);}

#s3 .mdArea {z-index: 9999; display: none}
#s3 .mdArea .mdBg {background: rgba(0,0,0,0.6); height: 100%;}
#s3 .mdArea .mbBox {max-width: 80%; width: 100%; display: none}
#s3 .mdArea .mbBox .closeBtn {position: absolute; top: 8rem; right: 8rem; cursor: pointer}

@media all and (max-width: 880px){
    .comsubt {font-size: 1.6rem; padding: 0.8rem 2.5rem; letter-spacing: 0.3rem;}

    #s3 {}
    #s3 .inner {padding-top: 14rem;}
    #s3 .titArea {}
    #s3 .titArea .subt {}
    #s3 .titArea .wrt {font-size: 2rem; text-align: center; line-height: 3rem; padding: 4.3rem 0 1.8rem;}
    #s3 .titArea .tit {font-size: 4rem; text-align: center; line-height: 4.8rem;}
    #s3 .imgArea {margin-top: 1.8rem;}
    #s3 .btnArea {max-width: 87.7%; margin: 0 auto; margin-top: 0.6rem; gap: 0;}
    #s3 .btnArea li {width: 100%; padding: 0; padding-bottom: 3.6rem; flex-direction: column; gap: 1.8rem;}
    #s3 .btnArea li .name {}
    #s3 .btnArea li .name .n1 {font-size: 2.8rem;}
    #s3 .btnArea li .name .n2 {font-size: 1.8rem;}
    #s3 .btnArea li .wrt {line-height: 2.6rem;}
    #s3 .btnArea li .btn {position: absolute; gap: 0.6rem; right: 0; bottom: 40%;}
    #s3 .btnArea li .btn img {}
    #s3 .btnArea li .btn span {}
    #s3 .btnArea li.line {border: 0;}
    #s3 .btnArea li + li {border-top: 1px solid #C9CDD2 !important; padding-top: 3.6rem}

    #s3 .mdArea .mbBox {max-width: 90%; max-height: 80vh; overflow-y: auto;}
    #s3 .mdArea .mbBox .closeBtn {width: 2rem; height: 2rem; top: 2rem; right: 2rem;}
}

#s4 {}
#s4 .pcCont {}
#s4 .pcCont .inner {max-width: 148rem; padding-top: 30rem;}
#s4 .pcCont .inner li {align-items: flex-end;}
#s4 .pcCont .inner li + li {margin-top: 11rem;}
#s4 .pcCont .inner li .imgArea {width: 65rem; border-radius: 8rem 0 8rem 0; overflow: hidden;}
#s4 .pcCont .inner li .txtArea {padding-bottom: 6.2rem; padding-left: 5.4rem; flex: 1;}
#s4 .pcCont .inner li .txtArea .subt {padding-bottom: 1.4rem;}
#s4 .pcCont .inner li .txtArea .tit {line-height: 4.3rem;}
#s4 .pcCont .inner li .txtArea .line {width: 13.8rem; height: 2px; background: #C9CDD2; margin: 3.6rem 0 2rem;}
#s4 .pcCont .inner li .txtArea .wrt {line-height: 2.6rem;}
#s4 .pcCont .inner li:nth-child(2) .txtArea {padding-left: 15rem;}

@media all and (max-width: 880px){
    #s4 .moCont {margin-top: 14rem;}
    #s4 .moCont .img {box-shadow: 0 3px 6px rgba(0,0,0,0.06);}
    #s4 .moCont .s4_swiper {overflow: hidden;}
    #s4 .moCont .s4_pg {bottom: 7%;}
    #s4 .moCont .swiper-pagination-bullet {width: 5px; height: 5px;}
    #s4 .moCont .swiper-pagination-bullet-active {background: #003067;}
}

#s5 {overflow: hidden;}
#s5 .inner {max-width: 164rem; margin-left: auto; justify-content: space-between; padding: 39rem 0 27rem;}
#s5 .txtArea {min-width: 44rem; padding: 7.8rem 0; border-top: 4px solid #003067; border-bottom: 4px solid #C9CDD2;}
#s5 .txtArea .subt {padding-bottom: 3.8rem;}
#s5 .txtArea .tit {line-height: 6.4rem;}
#s5 .txtArea .wrt {margin-top: auto; line-height: 3rem;}
#s5 .slideArea {width: 107.3rem;}
#s5 .slideArea .s5_swiper {overflow: hidden;}
#s5 .slideArea .swiper-slide {}

@media all and (max-width: 880px){
    #s5 {}
    #s5 .inner {flex-direction: column; padding: 12.6rem 0;}
    #s5 .txtArea {width: 87.7%; margin: 0 auto; min-width: auto; padding: 4.7rem 0 6rem; border-bottom: 0;}
    #s5 .txtArea .subt {font-size: 1.4rem; padding: 0}
    #s5 .txtArea .tit {font-size: 3.2rem; line-height: 4.4rem; padding: 3rem 0 4.5rem;}
    #s5 .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s5 .slideArea {width: 100%; padding-left: 2.4rem;}
    #s5 .slideArea .s5_swiper {}
    #s5 .slideArea .swiper-slide {}
}

#s6 {background: #F6F7F9; overflow: hidden;}
#s6 .inner {max-width: 152.4rem; padding: 17.6rem 0 17.2rem;}
#s6 .titArea {margin-bottom: 6.2rem;}
#s6 .titArea .subt {padding-bottom: 2.4rem;}
#s6 .titArea .tit {}
#s6 .boxArea {background: #fff; padding: 7rem 8.3rem; border-radius: 6rem; box-shadow: 0 0.2rem 1rem rgba(0,0,0,0.1); gap: 7.4rem;}
#s6 .boxArea .imgArea {min-width: 73.5rem;}
#s6 .boxArea .txtArea {width: 44.8rem;}
#s6 .boxArea .txtArea .tit {gap: 1.2rem;}
#s6 .boxArea .txtArea .tit img {}
#s6 .boxArea .txtArea .tit .txt {line-height: 1.4;}
#s6 .boxArea .txtArea .wrt {padding: 2.4rem 0 3.2rem;}
#s6 .boxArea .txtArea .btn {margin-bottom: 3rem; display: inline-block;}
#s6 .boxArea .txtArea .s6_swiper {overflow: hidden; padding-bottom: 2.5rem;}

@media all and (max-width: 880px){
    #s6 {}
    #s6 .inner {padding: 10.6rem 0 9.6rem;}
    #s6 .titArea {margin-bottom: 4.6rem;}
    #s6 .titArea .subt {font-size: 1.8rem; padding-bottom: 2.8rem;}
    #s6 .titArea .tit {font-size: 3.2rem;}
    #s6 .boxArea {max-width: 87.7%; margin: 0 auto; padding: 5.2rem 2.6rem 6.4rem; flex-direction: column; gap: 1.2rem;}
    #s6 .boxArea .imgArea {min-width: auto; width: 100%;}
    #s6 .boxArea .txtArea {width: 100%;}
    #s6 .boxArea .txtArea .tit {}
    #s6 .boxArea .txtArea .tit img {}
    #s6 .boxArea .txtArea .tit .txt {font-size: 1.6rem;}
    #s6 .boxArea .txtArea .tit .txt span {font-size: 1.4rem;}
    #s6 .boxArea .txtArea .wrt {padding: 3.6rem 0 5rem;}
    #s6 .boxArea .txtArea .btn {display: flex; justify-content: center;}
    #s6 .boxArea .txtArea .btn img {width: 17.6rem;}
    #s6 .boxArea .txtArea .s6_swiper {padding: 0}
}

#s7 {overflow: hidden;}
#s7 .inner {background: #012044; padding: 22rem 0 29rem;}
#s7 .titArea {margin-bottom: 8rem;}
#s7 .titArea .subt {}
#s7 .titArea .tit {padding: 3.6rem 0 3.2rem;}
#s7 .titArea .wrt {}
#s7 .imgArea {}
#s7 .imgArea .txtBox {padding: 3rem 4rem; background: rgba(255,255,255,0.74); border-radius: 2.4rem; line-height: 3.1rem; top: 30%; right: 23%;}
#s7 .imgArea .txtBox img {left: -2rem; top: -2rem;}
#s7 .prgTxt {padding: 8rem 0 11rem; line-height: 5rem;}
#s7 .lstArea {justify-content: center;}
#s7 .lstArea li {padding: 0 8rem;}
#s7 .lstArea li + li::before {content: ''; display: block; position: absolute; width: 1px; height: 80%; background: #fff; left: 0; top: 50%; transform: translateY(-50%);}
#s7 .lstArea li .lstTit {padding-bottom: 2.4rem;}
#s7 .lstArea li .lstWrt {line-height: 2.8rem;}

@media all and (max-width: 880px){
    #s7 {}
    #s7 .inner {padding: 13.4rem 0 9.5rem;}
    #s7 .titArea {text-align: center; margin-bottom: 4.5rem;}
    #s7 .titArea .subt {}
    #s7 .titArea .tit {font-size: 4.8rem; padding: 3rem 0; line-height: 6.4rem;}
    #s7 .titArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s7 .imgArea {}
    #s7 .imgArea .txtBox {font-size: 1.4rem; line-height: 2.2rem; padding: 2.2rem 1.4rem 2.2rem 2.5rem; top: auto; bottom: 10%; right: 5%;}
    #s7 .imgArea .txtBox img {width: 4.2rem; left: -1rem; top: -1rem;}
    #s7 .prgTxt {font-size: 2.2rem; line-height: 3.2rem; padding: 3.6rem 0 0;}
    #s7 .lstArea {display: none}
    #s7 .s7_swiper {max-width: 80%; margin: 0 auto; overflow: hidden; padding-bottom: 4rem;}
    #s7 .s7_swiper .swiper-pagination-bullet {background: #3774AC;}
    #s7 .s7_swiper .swiper-pagination-bullet-active {background: #fff;}

}

#s8 {}
#s8 .cont {transition: 0.4s;}
#s8 .cont .inner {padding: 21rem 0; max-width: 136rem;}
#s8 .cont .txtArea {transition: 1s; left: -5rem; opacity: 0}
#s8 .cont .txtArea .subt {}
#s8 .cont .txtArea .tit {padding: 1.8rem 0 4rem;}
#s8 .cont .txtArea .wrt {line-height: 2.8rem; margin-bottom: 10rem;}
#s8 .cont .txtArea .lst {gap: 1.6rem;}
#s8 .cont .txtArea .lst li {width: 17rem;}

#s8 .cont1 {background: url('../img/s8_img_1.jpg') center/cover;}
#s8 .cont2 {background: url('../img/s8_img_2.jpg') center/cover; position: absolute; width: 100%; top: 0; opacity: 0;}
#s8 .cont3 {background: url('../img/s8_img_3.jpg') center/cover; position: absolute; width: 100%; top: 0; opacity: 0;}
#s8 .cont4 {background: url('../img/s8_img_4.jpg') center/cover; position: absolute; width: 100%; top: 0; opacity: 0;}

#s8 .cont.act {opacity: 1;}
#s8 .cont.act .txtArea {left: 0; opacity: 1;}

#s8 .slcArea {padding: 7.7rem 4.5rem; background: rgba(184,235,255,0.53); border-radius: 4rem; position: absolute; right: 28rem; top: 50%; transform: translateY(-50%);}
#s8 .slcArea li {color: #C9CDD2; font-size: 1.8rem; width: 20rem; text-align: right; cursor: pointer;}
#s8 .slcArea li + li {margin-top: 5.4rem;}
#s8 .slcArea li.on {font-size: 2.4rem; font-weight: 800; color: #fff;}

@media all and (max-width: 880px){
    #s8 {}
    #s8 .cont {min-height: 77.2rem;}
    #s8 .cont .inner {padding: 20rem 0 6rem;}
    #s8 .cont .txtArea {max-width: 87.7%; margin: 0 auto;}
    #s8 .cont .txtArea .subt {font-size: 2rem;}
    #s8 .cont .txtArea .tit {font-size: 3.6rem; line-height: 5rem; padding: 2rem 0 2.8rem;}
    #s8 .cont .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem; margin: 2.8rem 0 3.2rem;}
    #s8 .cont .txtArea .lst {flex-wrap: wrap; gap: 1rem;}
    #s8 .cont .txtArea .lst li {width: 10.7rem;}

    #s8 .cont1 {background: url('../img/s8_img_1_mo.jpg') center/cover;}
    #s8 .cont2 {background: url('../img/s8_img_2_mo.jpg') center/cover;}
    #s8 .cont3 {background: url('../img/s8_img_3_mo.jpg') center/cover;}
    #s8 .cont4 {background: url('../img/s8_img_4_mo.jpg') center/cover;}

    #s8 .slcArea {background: none; padding: 0; top: 5.6rem; left: 50%; transform: translateX(-50%); right: 0; display: flex; gap: 1.4rem; flex-wrap: wrap; width: 87.7%;}
    #s8 .slcArea li {width: calc((100% - 1.4rem) / 2); font-size: 1.6rem; text-align: center; padding: 0.9rem 0; border: 1px solid #fff; border-radius: 1.8rem}
    #s8 .slcArea li + li {margin: 0;}
    #s8 .slcArea li.on {font-size: 1.6rem; background: rgba(184,235,255,0.4); border: 1px solid rgba(184,235,255,0.4);}
}

#s9 {background: #012044;}
#s9 .inner {padding: 50rem 0 37rem;}
#s9 .lstArea {}
#s9 .lstArea::before {content: ''; display: block; position: absolute; width: 17%; height: 1px; background: #fff; left: 0; top: 50%}
#s9 .lstArea::after {content: ''; display: block; position: absolute; width: 16.6%; height: 1px; background: #fff; right: 0; top: 50%}
#s9 .lstArea li {width: 44.5rem; height: 44.5rem; border-radius: 50%; border: 1px solid transparent; justify-content: center; position: relative; display: flex; align-items: center; flex-direction: column;}
#s9 .lstArea li .tit {padding: 4rem 0 2.8rem}
#s9 .lstArea li .wrt {line-height: 2.6rem;}
#s9 .lstArea li .circle-border {position: absolute; width: 101%; height: 101%; top: 0; left: 0; transform: rotate(-90deg);}
#s9 .lstArea li .circle-border circle {fill: none; stroke: white; stroke-width: 1; stroke-dasharray: 1382; stroke-dashoffset: 1382; transition: stroke-dashoffset 1.5s linear;}
#s9 .lstArea li.act .circle-border circle {stroke-dashoffset: 0;}
#s9 .lstArea li:nth-child(1) {right: -3rem}
#s9 .lstArea li:nth-child(3) {left: -3rem;}


@media all and (max-width: 880px){
    #s9 {}
    #s9 .inner {padding: 8rem 0 11rem;}
    #s9 .lstArea {display: none;}
    #s9 .s9_swiper {max-width: 87.7%; margin: 0 auto; overflow: hidden; padding-bottom: 4rem;}
    #s9 .s9_swiper .s9_pg {bottom: 0}
    #s9 .s9_swiper .swiper-pagination-bullet {background: #3774AC;}
    #s9 .s9_swiper .swiper-pagination-bullet-active {background: #fff;}
}

#s10 {background: #F6F7F9;}
#s10 .inner {max-width: 125rem; padding: 28.8rem 0;}
#s10 .titArea {margin-bottom: 9rem;}
#s10 .titArea .subt {}
#s10 .titArea .tit {padding: 3.2rem 0;}
#s10 .titArea .wrt {line-height: 3.2rem;}
#s10 .s10_swiper {overflow: hidden;}
#s10 .s10_swiper .cont {}
#s10 .s10_swiper .cont .mImg {}
#s10 .s10_swiper .cont .lock {height: 50%; justify-content: center; gap: 1rem; background: rgba(1, 32, 68, 0.9);}
#s10 .s10_swiper .cont .lock .lImg {}
#s10 .s10_swiper .txt {margin-top: 1.4rem;}
#s10 .s10_swiper .txt .tit {padding-bottom: 1.4rem; margin-bottom: 0.8rem; border-bottom: 1px solid #A4AAB1;}
#s10 .s10_swiper .txt .wrt {line-height: 2.6rem;}
#s10 .s10_prev,
#s10 .s10_next {top: 57.7%;}
#s10 .s10_prev::after,
#s10 .s10_next::after {color: #000; font-weight: 800;}
#s10 .s10_prev {left: -10rem;}
#s10 .s10_next {right: -10rem;}

@media all and (max-width: 880px){
    #s10 {}
    #s10 .inner {padding: 11rem 0; max-width: 87.7%; margin: 0 auto;}
    #s10 .titArea {text-align: center;}
    #s10 .titArea .subt {font-size: 2rem; line-height: 3rem;}
    #s10 .titArea .tit {font-size: 4.8rem; line-height: 6.4rem; padding: 2.4rem 0;}
    #s10 .titArea .wrt {font-size: 1.5rem; line-height: 2.6rem;}
    #s10 .s10_swiper {}
    #s10 .s10_swiper .cont {}
    #s10 .s10_swiper .cont .mImg {}
    #s10 .s10_swiper .cont .lock {}
    #s10 .s10_swiper .cont .lock .lImg {}
    #s10 .s10_swiper .txt {}
    #s10 .s10_swiper .txt .tit {font-size: 1.8rem; padding-bottom: 0.8rem; margin-bottom: 0.8rem;}
    #s10 .s10_swiper .txt .wrt {font-size: 1.4rem; line-height: 2.4rem;}
    #s10 .s10_prev,
    #s10 .s10_next {top: 43%; width: 4.8rem; height: 4.8rem; border: 2px solid #C9CDD2; border-radius: 50%;}
    #s10 .s10_prev::after,
    #s10 .s10_next::after {font-size: 1.6rem;}
    #s10 .s10_prev {left: 35%;}
    #s10 .s10_next {right: 35%;}
}

#s11 {}
#s11 .inner {padding-top: 24rem;}
#s11 .titArea {margin-bottom: 8rem;}
#s11 .titArea .subt {}
#s11 .titArea .tit {padding: 4.5rem 0 3.2rem;}
#s11 .titArea .wrt {}
#s11 .imgArea {}

@media all and (max-width: 880px){
    #s11 {}
    #s11 .inner {padding-top: 9rem;}
    #s11 .titArea {text-align: center; margin-bottom: 4.4rem;}
    #s11 .titArea .subt {}
    #s11 .titArea .tit {font-size: 4.8rem; line-height: 6.4rem; padding: 3rem 0;}
    #s11 .titArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s11 .imgArea {}
}

#s12 {overflow: hidden;}
#s12 .inner {max-width: 164rem; margin-left: auto; justify-content: space-between; padding-top: 28.4rem;}
#s12 .txtArea {z-index: 1}
#s12 .txtArea .tit {line-height: 6.4rem;}
#s12 .txtArea .wrt {margin: 5rem 0 7rem; line-height: 2.8rem;}
#s12 .txtArea .lst {}
#s12 .txtArea .lst::before {content: ''; display: block; position: absolute; width: 1px; height: 90%; background: #65A1D8; left: 1rem; top: 50%; transform: translateY(-50%);}
#s12 .txtArea .lst li {padding-left: 4rem;}
#s12 .txtArea .lst li::before {content: ''; display: block; position: absolute; width: 1.3rem; height: 1.3rem; border-radius: 50%; background: #3774AC; left: 0.5rem; top: 50%; transform: translateY(-50%);}
#s12 .txtArea .lst li + li {margin-top: 4.5rem;}
#s12 .imgArea {width: 95.4rem; z-index: 1}
#s12 .bgImg {left: 22%; bottom: 10%;}

@media all and (max-width: 880px){
    #s12 {}
    #s12 .inner {flex-direction: column; align-items: center; padding-top: 16.7rem;}
    #s12 .txtArea {text-align: center; max-width: 87.7%; margin: 0 auto;}
    #s12 .txtArea .tit {font-size: 3.2rem; line-height: 4.4rem;}
    #s12 .txtArea .wrt {font-size: 1.5rem; line-height: 2.6rem;}
    #s12 .txtArea .lst {}
    #s12 .txtArea .lst li {}
    #s12 .txtArea .lst li + li {}
    #s12 .s12_swiper {overflow: hidden; padding-bottom: 4rem; width: 100%;}
    #s12 .s12_swiper .s12_pg {bottom: 0}
    #s12 .s12_swiper .swiper-pagination-bullet {background: #C9CDD2;}
    #s12 .s12_swiper .swiper-pagination-bullet-active {background: #003067;}
    #s12 .bgImg {width: 17rem; top: 8%; bottom: auto; left: auto; right: 7%;}
    #s12 .bgImg img {width: 100%; display: block;}
}

#s13 {padding: 37.5rem 0 9.5rem;}
#s13::before {content: ''; display: block; position: absolute; width: 84.6rem; height: 57rem; background: #EEF0F3; bottom: 0; left: 0;}
#s13 .inner {max-width: 168rem; margin-left: auto;}
#s13 .titArea {margin-bottom: 9.5rem;}
#s13 .titArea .subt {padding-bottom: 3rem;}
#s13 .titArea .tit {}
#s13 .tabArea {}
#s13 .tabLst {top: 4.3rem; left: 44.4%; z-index: 99;}
#s13 .tabLst li {cursor: pointer;}
#s13 .tabLst li.on {color: #003067; font-weight: 800;}
#s13 .tabLst li + li {padding-left: 2rem; margin-left: 2rem; border-left: 1px solid #C9CDD2}
#s13 .tabCont {opacity: 0;}
#s13 .tabCont .imgArea {max-width: 65rem;}
#s13 .tabCont .imgArea .img {overflow: hidden;}
#s13 .tabCont .imgArea .img img {transform: scale(1.1); transition: 1.2s;}
#s13 .tabCont .imgArea .symImg {bottom: 3.4rem; left: 78%;}
#s13 .tabCont .txtArea {padding-left: 9.6rem; flex: 1; padding-top: 14.5rem;}
#s13 .tabCont .txtArea .tit {padding-bottom: 3.2rem;}
#s13 .tabCont .txtArea .wrt {line-height: 2.8rem;}
#s13 .tabCont .txtArea .prg {font-size: 9.9rem; color: #EEF0F3; text-transform: uppercase; margin-top: 12rem; padding-left: 5.8rem;}

#s13 .tabCont1 {opacity: 0;}
#s13 .tabCont2 {opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
#s13 .tabCont3 {opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; left: 0;}

#s13 .tabCont.act {opacity: 1;}
#s13 .tabCont.act .imgArea .img img {transform: scale(1);}

@media all and (max-width: 880px){
    #s13 {padding: 8.6rem 0 10.7rem; overflow: hidden;}
    #s13::before {width: 100%; height: 18.5rem; left: 0; bottom: 0;}
    #s13 .inner {}
    #s13 .titArea {margin-bottom: 3.2rem;}
    #s13 .titArea .subt {font-size: 2rem; padding-bottom: 2.4rem;}
    #s13 .titArea .tit {font-size: 4.8rem; line-height: 6.4rem;}
    #s13 .tabArea {}
    #s13 .tabLst {position: relative; top: auto; left: auto; font-size: 1.6rem; justify-content: center; margin-bottom: 6.5rem;}
    #s13 .tabLst li {}
    #s13 .tabLst li.on {}
    #s13 .tabLst li + li {}
    #s13 .tabCont {}
    #s13 .tabCont .cont {flex-direction: column-reverse; gap: 3.4rem; max-width: 87.7%; margin: 0 auto;}
    #s13 .tabCont .imgArea {}
    #s13 .tabCont .imgArea .symImg {left: auto; width: 8.4rem; right: 0; top: -4rem;}
    #s13 .tabCont .txtArea {padding: 0;}
    #s13 .tabCont .txtArea .tit {font-size: 3rem; padding-bottom: 2.2rem;}
    #s13 .tabCont .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s13 .tabCont .txtArea .prg {display: none;}

    #s13 .tabCont2 {top: 18%;}
    #s13 .tabCont3 {top: 18%;}
}

#s14 {}
#s14 .inner {padding: 28.4rem 0 22rem;}
#s14 .titArea {margin-bottom: 9.7rem;}
#s14 .titArea .subt {padding-bottom: 3rem;}
#s14 .titArea .tit {line-height: 6.4rem;}
#s14 .lstArea {}
#s14 .lstArea li {width: 45rem;}
#s14 .lstArea li img {}
#s14 .lstArea li .tit {padding: 2.8rem 0 1.8rem;}
#s14 .lstArea li .wrt {line-height: 2.6rem; padding-bottom: 0.3rem;}
#s14 .lstArea li + li::before {content: ''; display: block; position: absolute; width: 1px; height: 30%; background: #3774AC; left: 0; bottom: 0;}

@media all and (max-width: 880px){
    #s14 {}
    #s14 .inner {padding: 9rem 0; max-width: 87.7%; margin: 0 auto}
    #s14 .titArea {text-align: center; margin-bottom: 5.7rem;}
    #s14 .titArea .subt {font-size: 1.8rem; padding-bottom: 2.6rem;}
    #s14 .titArea .subt span {font-size: 1.8rem;}
    #s14 .titArea .tit {font-size: 3.2rem; line-height: 4.4rem;}
    #s14 .lstArea {display: none}
    #s14 .s14_swiper {overflow: hidden; padding-bottom: 4rem; width: 100%;}
    #s14 .s14_swiper .s14_pg {bottom: 0}
    #s14 .s14_swiper .swiper-pagination-bullet {background: #C9CDD2;}
    #s14 .s14_swiper .swiper-pagination-bullet-active {background: #003067;}
}

#s15 {background: #F6F7F9;}
#s15 .inner {max-width: 125rem; padding: 20rem 0;}
#s15 .titArea {margin-bottom: 9rem;}
#s15 .titArea .subt {}
#s15 .titArea .tit {padding: 3.2rem 0;}
#s15 .titArea .wrt {line-height: 3.2rem;}
#s15 .s15_swiper {overflow: hidden;}
#s15 .s15_swiper .cont {}
#s15 .s15_swiper .cont .mImg {}
#s15 .s15_swiper .cont .lock {height: 50%; justify-content: center; gap: 1rem; background: rgba(1, 32, 68, 0.9);}
#s15 .s15_swiper .cont .lock .lImg {}
#s15 .s15_swiper .txt {margin-top: 1.4rem;}
#s15 .s15_swiper .txt .tit {padding-bottom: 1.4rem; margin-bottom: 0.8rem; border-bottom: 1px solid #A4AAB1;}
#s15 .s15_swiper .txt .wrt {line-height: 2.6rem;}
#s15 .s15_prev,
#s15 .s15_next {top: 58.7%;}
#s15 .s15_prev::after,
#s15 .s15_next::after {color: #000; font-weight: 800;}
#s15 .s15_prev {left: -10rem;}
#s15 .s15_next {right: -10rem;}

@media all and (max-width: 880px){
    #s15 {}
    #s15 .inner {padding: 11rem 0; max-width: 87.7%; margin: 0 auto;}
    #s15 .titArea {text-align: center;}
    #s15 .titArea .subt {font-size: 2rem; line-height: 3rem;}
    #s15 .titArea .tit {font-size: 4.8rem; line-height: 6.4rem; padding: 2.4rem 0;}
    #s15 .titArea .wrt {font-size: 1.5rem; line-height: 2.6rem;}
    #s15 .s15_swiper {}
    #s15 .s15_swiper .cont {}
    #s15 .s15_swiper .cont .mImg {}
    #s15 .s15_swiper .cont .lock {}
    #s15 .s15_swiper .cont .lock .lImg {}
    #s15 .s15_swiper .txt {}
    #s15 .s15_swiper .txt .tit {font-size: 1.8rem; padding-bottom: 0.8rem; margin-bottom: 0.8rem;}
    #s15 .s15_swiper .txt .wrt {font-size: 1.4rem; line-height: 2.4rem;}
    #s15 .s15_prev,
    #s15 .s15_next {top: 43%; width: 4.8rem; height: 4.8rem; border: 2px solid #C9CDD2; border-radius: 50%;}
    #s15 .s15_prev::after,
    #s15 .s15_next::after {font-size: 1.6rem;}
    #s15 .s15_prev {left: 35%;}
    #s15 .s15_next {right: 35%;}
}

#s16 {overflow: hidden;}
#s16 .inner {}
#s16 .titArea {width: 50%; background: url('../img/s16_bg.jpg') center/cover; padding: 20.5rem 0; justify-content: center; text-align: center;}
#s16 .titArea .subt {display: inline-block; padding-bottom: 1.7rem;}
#s16 .titArea .tit {width: 44rem; line-height: 6.8rem; padding: 3.6rem 0; border: 1px solid #92D8FE; border-right: 0; border-left: 0;}
#s16 .lstArea {width: 50%; display: flex; flex-direction: column;}
#s16 .lstArea li {align-items: center; gap: 4.5rem; flex: 1;}
#s16 .lstArea li .img {width: 31.8rem; max-width: 34%; height: 100%;}
#s16 .lstArea li .img img {height: 100%; object-fit: cover;}
#s16 .lstArea li .txt {width: 37rem;}
#s16 .lstArea li .txt .tit {padding-bottom: 1.4rem; margin-bottom: 1.8rem; border-bottom: 1px solid #C9CDD2;}
#s16 .lstArea li .txt .tit .tx {}
#s16 .lstArea li .txt .tit .nm {}
#s16 .lstArea li .wrt {line-height: 2.8rem;}

#s16 .lstArea li:nth-child(1),
#s16 .lstArea li:nth-child(3) {background: #F1FBFF;}

@media all and (max-width: 880px){
    #s16 {}
    #s16 .inner {flex-direction: column;}
    #s16 .titArea {width: 100%; padding: 8.4rem 0;}
    #s16 .titArea .subt {font-size: 1.4rem;}
    #s16 .titArea .tit {font-size: 3.2rem; line-height: 4.4rem; padding: 3rem 0; max-width: 75%; margin: 0 auto;}
    #s16 .titArea .s16_pg {bottom: 4%; display: flex; gap: 1rem;}
    #s16 .titArea .s16_pg .swiper-pagination-bullet {background: #3774AC;}
    #s16 .titArea .s16_pg .swiper-pagination-bullet-active {background: #fff;}
    #s16 .lstArea {display: none;}
    #s16 .s16_swiper {overflow: hidden; width: 100%;}
}

#s17 {}
#s17 .inner {max-width: 136rem; padding-top: 29rem;}
#s17 .titArea {margin-bottom: 13rem;}
#s17 .titArea .tit {padding-bottom: 3.5rem;}
#s17 .titArea .tit .ico {top: -3rem;}
#s17 .titArea .subt {}
#s17 .contArea {}
#s17 .contArea .lstArea {}
#s17 .contArea .lstArea li {gap: 2.8rem; cursor: pointer; opacity: 0.4; transition: 0.6s}
#s17 .contArea .lstArea li.on {opacity: 1;}
#s17 .contArea .lstArea li + li {margin-top: 9.6rem;}
#s17 .contArea .lstArea li .ic {}
#s17 .contArea .lstArea li .txt {}
#s17 .contArea .lstArea li .txt .tit {margin-bottom: 2.4rem;}
#s17 .contArea .lstArea li .txt .wrt {line-height: 3.1rem;}
#s17 .contArea .lstArea li .img {}
#s17 .contArea .imgArea {width: 62.2rem; height: 38.6rem; transition: 0.6s}
#s17 .contArea .imgArea.aa {background: url('../img/s17_img_1.png') center/contain;}
#s17 .contArea .imgArea.bb {background: url('../img/s17_img_2.png') center/contain;}

@media all and (max-width: 880px){
    #s17 {}
    #s17 .inner {max-width: 87.7%; margin: 0 auto; padding-top: 10rem;}
    #s17 .titArea {margin-bottom: 6rem;}
    #s17 .titArea .tit {font-size: 5.7rem; padding-right: 3rem; padding-bottom: 3.2rem;}
    #s17 .titArea .tit .ico {width: 3.5rem; top: -2rem;}
    #s17 .titArea .subt {font-size: 2.8rem; line-height: 4.2rem;}
    #s17 .contArea {}
    #s17 .contArea .lstArea {}
    #s17 .contArea .lstArea li {flex-direction: column; opacity: 1 !important; gap: 0; align-items: baseline;}
    #s17 .contArea .lstArea li + li {margin-top: 6rem;}
    #s17 .contArea .lstArea li .ic {position: absolute; right: 1rem; top: -1rem; width: 8rem;}
    #s17 .contArea .lstArea li .txt {margin-bottom: 3.2rem;}
    #s17 .contArea .lstArea li .txt .tit {font-size: 2.2rem; margin-bottom: 2rem; line-height: 3.2rem;}
    #s17 .contArea .lstArea li .txt .wrt {font-size: 1.4rem; line-height: 2.2rem;}
    #s17 .contArea .lstArea li .img {}
    #s17 .contArea .imgArea {}
}

#s18 {padding: 34rem 0 20rem;}
#s18 .titArea {border-bottom: 1px solid #003067; padding-bottom: 4.4rem; margin-bottom: 9rem;}
#s18 .titArea .inner {max-width: 136rem;}
#s18 .titArea .left {line-height: 7rem;}
#s18 .titArea .left img {display: block; margin-bottom: 3rem;}
#s18 .titArea .right {}
#s18 .flowArea {}
#s18 .scrollArea + .scrollArea {margin-top: 4rem;}
#s18 .scrollArea {overflow: hidden; position: relative; width: 100%; height: 21.4rem;}
#s18 .scrollLst {display: flex; gap: 2.7rem; position: absolute; white-space: nowrap; left: 0;}
#s18 .scrollLst li {flex: 0 0 auto; max-width: 40rem;}

@media all and (max-width: 880px){
    #s18 {padding: 20rem 0 12rem;}
    #s18 .titArea {padding-bottom: 4.8rem; margin-bottom: 6rem;}
    #s18 .titArea .inner {justify-content: center;}
    #s18 .titArea .left {text-align: center; display: flex; flex-direction: column; align-items: center; font-size: 3.2rem; line-height: 4.4rem;}
    #s18 .titArea .left img {}
    #s18 .titArea .right {}
    #s18 .flowArea {}
    #s18 .scrollArea {height: 12rem;}
    #s18 .scrollArea + .scrollArea {margin-top: 1.4rem;}
    #s18 .scrollLst {gap: 1.2rem;}
    #s18 .scrollLst li {max-width: 22rem;}
}

#s19 {overflow: hidden;}
#s19 .imgArea {}
#s19 .txtArea {}
#s19 .txtArea .tit {line-height: 7rem;}
#s19 .txtArea .wrt {line-height: 3.2rem; margin: 5.2rem 0 3.2rem;}
#s19 .txtArea .prg {}
#s19 .symArea {bottom: -18%; right: 8%; max-width: 58.5rem;}

@media all and (max-width: 880px){
    #s19 {}
    #s19 .imgArea {}
    #s19 .txtArea {}
    #s19 .txtArea .tit {font-size: 3.2rem; font-weight: bold; line-height: 4.4rem;}
    #s19 .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem; margin: 3.2rem 0 2.8rem;}
    #s19 .txtArea .prg {font-size: 1.6rem; line-height: 2.6rem}
    #s19 .symArea {max-width: 24.7rem; bottom: 7%; right: -4%;}
}

#s20 {}
#s20 .btnArea {max-width: 136rem; gap: 2rem; padding: 26rem 0 20rem;}
#s20 .btnArea li {border-radius: 2rem; padding: 3.2rem 3.4rem; width: 100%;}
#s20 .btnArea li.naver {background: #00C300}
#s20 .btnArea li.kakao {background: #371D1E;}
#s20 .btnArea li a {gap: 2.8rem;}
#s20 .btnArea li a .ic {width: 10.4rem;}
#s20 .btnArea li a .txt {}
#s20 .btnArea li a .txt .subt {padding-bottom: 1rem;}
#s20 .btnArea li a .txt .tit {}
#s20 .btnArea li a .more {margin-left: auto; padding-right: 2rem; transition: 0.4s;}
#s20 .btnArea li:hover a .more {padding-right: 0;}

#s20 .infoArea {padding-left: 46.8%; padding-bottom: 6.1rem}
#s20 .infoArea .subt {}
#s20 .infoArea .tit {padding: 2rem 0 5rem;}
#s20 .infoArea .place {padding-bottom: 1.2rem}
#s20 .infoArea .num {padding-bottom: 4rem;}
#s20 .infoArea .time {width: 67.4rem; border-top: 1px solid #C9CDD2; padding-top: 2rem; gap: 1.4rem 4.8rem;}
#s20 .infoArea .time li {width: calc((100% - 4.8rem) / 2); display: flex;}
#s20 .infoArea .time li span {width: 7.3rem; margin-right: 2rem;}
#s20 .infoArea .time li span i {font-style: normal;}
#s20 .infoArea .prg {margin-top: 2.2rem;}

#s20 .infoArea .bgImg {right: 0; top: 2%;}

#s20 .infoArea .mapArea {right: 57%; top: -2rem}
#s20 .infoArea .mapArea .mapBox {width: 67.4rem; height: 55rem;}
.root_daum_roughmap .wrap_controllers {display: none}

@media all and (max-width: 880px){
    #s20 {overflow: hidden;}
    #s20::before {content: ''; display: block; position: absolute; width: 100%; height: 4.5rem; background: #012044; bottom: 0;}
    #s20 .inner {max-width: 87.7%;}
    #s20 .btnArea {flex-direction: column; padding: 5.8rem 0 12rem;}
    #s20 .btnArea li {padding: 1.6rem;}
    #s20 .btnArea li.naver {}
    #s20 .btnArea li.kakao {}
    #s20 .btnArea li a {gap: 1.6rem;}
    #s20 .btnArea li a .ic {width: 5.6rem;}
    #s20 .btnArea li a .txt {}
    #s20 .btnArea li a .txt .subt {font-size: 1.2rem; padding-bottom: 0.6rem;}
    #s20 .btnArea li a .txt .tit {font-size: 1.8rem;}
    #s20 .btnArea li a .more {font-size: 1.2rem; padding: 0}

    #s20 .infoArea {padding: 0; padding-bottom: 23.6rem;}
    #s20 .infoArea .subt {font-size: 1.8rem;}
    #s20 .infoArea .tit {font-size: 3.1rem; padding: 1.2rem 0 2.4rem;}
    #s20 .infoArea .place {font-size: 1.8rem; padding-bottom: 0.8rem;}
    #s20 .infoArea .num {font-size: 3.2rem; padding-bottom: 3.2rem;}
    #s20 .infoArea .time {flex-direction: column; gap: 1.2rem;}
    #s20 .infoArea .time li {font-size: 1.8rem; width: 100%;}
    #s20 .infoArea .time li span {}
    #s20 .infoArea .time li span i {}
    #s20 .infoArea .prg {font-size: 1.4rem; margin-top: 1.6rem;}

    #s20 .infoArea .bgImg {display: none;}

    #s20 .infoArea .mapArea {left: 50%; transform: translateX(-50%); top: auto; bottom: 0; width: 100%;}
    #s20 .infoArea .mapArea .mapBox {width: 100%; height: 20rem;}
}























.