#header {background: rgba(51,56,60,0.5); z-index: 9999}
#header .inner {width: 100%; max-width: 150.2rem; padding: 1.3rem 0;}
#header .logo {width: 26.6rem;}
#header .gnb {gap: 6.4rem;}
#header .gnb li {}
#header .gnb li a {display: block;}

#header.act {background: rgba(255,255,255,0.5);}
#header.act .gnb {color: #000}

@media all and (max-width:880px){
    #header {}
    #header .inner {padding: 1.2rem 0; justify-content: center;}
    #header .logo {width: 16.6rem;}
    #header .logo img {display: block; width: 100%}
    #header .gnb {display: none}
    #header .gnb li {}
    #header .gnb li a {}
}

.modal_wrap {position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 99999999999; display: none}
.modal_bg {width: 100%; height: 100%; background: rgba(0,0,0,0.5);}
.modal_box {position: absolute; width: 30%; background: #fff; top: 50%; left: 50%; transform: translate(-50%,-50%); padding: 1rem}
.modal_box img {width: 100%;}

@media all and (max-width: 768px){
    .modal_box {width: 90%;}
}

#footer {background: #002A54;}
#footer .inner {max-width: 144rem; color: #7B96B2; padding: 8.8rem 0;}
#footer .ftit {margin-bottom: 1.5rem;}
#footer .ftxt {font-size: 1.2rem; line-height: 2.2rem;}
#footer .ftxt + .ftxt {padding-top: 0.9rem;}

@media all and (max-width:880px){
    #footer {}
    #footer .inner {max-width: 88%; margin: 0 auto; padding: 7.4rem 0 5.8rem;}
    #footer .ftit {}
    #footer .ftxt {}
    #footer .ftxt + .ftxt {}
}

#float {position: fixed; z-index: 999; right: 4.5rem; top: 50%; transform: translateY(-50%);}
#float .lst {}
#float .lst li {}
#float .lst li + li {margin-top: 0.8rem;}
#float .lst li a {display: grid; place-items: center; width: 6.5rem; height: 6.5rem; border-radius: 50%; background: rgba(238, 240, 243, 0.5); transition: 0.2s;}
#float .lst li a img {width: 2.6rem; height: 2.6rem; transition: 0.2s;}
#float .lst li a .off {}
#float .lst li a .on {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0;}
#float .lst li a:hover {background: #fff; box-shadow: 0 0 0.6rem rgba(0,0,0,0.16);}
#float .lst li a:hover .off {opacity: 0;}
#float .lst li a:hover .on {opacity: 1;}
#float .mlst {display: none;}

@media all and (max-width:880px){
    #float {right: 2.4rem; bottom: 3.6rem; transform: none; top: auto;}
    #float .lst {display: none;}
    #float .lst li {}
    #float .lst li + li {}
    #float .lst li a {width: 5.6rem;height: 5.6rem; background: #fff; box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16);}
    #float .lst li a:hover {background: #fff; box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16);}
    #float .lst li a img {}
    #float .lst li a .off {}
    #float .lst li a .on {}
    #float .lst li a:hover {}
    #float .lst li a:hover .off {}
    #float .lst li a:hover .on {}
    #float .mlst {display: block; margin-top: 0.8rem;}
    #float .mlst li {}
    #float .mlst li + li {margin-top: 0.8rem;}
    #float .mlst li a {box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16); display: block; border-radius: 50%}
    #float .mlst li a.open img {transition: 0.2s;}
    #float .mlst li a.open img.act {transform: rotate(90deg);}
}


#applyBar {position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); width: 134rem; padding: 3rem 0; border-radius: 3rem 3rem 0 0; background: #0088C8; 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: #0088C8; 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: #0088C8; 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;}
}

#main {overflow: hidden;}

@media all and (max-width:880px){
    #main {}
}

#s1 {}
#s1 .vdArea {height: 100vh; overflow: hidden; width: 100%;}
#s1 .vdArea video {width: 100%; height: 100%; object-fit: cover;}
#s1 .txtArea {display: none}
#s1 .txtArea .subt {}
#s1 .txtArea .tit {}

@media all and (max-width:880px){
    #s1 {}
    #s1 .vdArea {}
    #s1 .vdArea video {}
    #s1 .txtArea {max-width: 88.37%; bottom: 10rem; width: 100%; color: #fff; text-shadow: 0 0 1rem rgba(0,0,0,0.16);}
    #s1 .txtArea .subt {padding-bottom: 1.8rem; letter-spacing: 0.25rem;}
    #s1 .txtArea .tit {line-height: 4.8rem;}
}

#s2 {z-index: 1}
#s2 .inner {max-width: 177.4rem; padding-top: 26rem;}
#s2 .txtArea {margin-bottom: 7rem;}
#s2 .txtArea .subt {}
#s2 .txtArea .tit {padding: 1.8rem 0 3.4rem; font-size: 5.2rem;}
#s2 .txtArea .wrt {line-height: 2.8rem;}
#s2 .imgArea {overflow: hidden;}
#s2 .imgArea .img {}
#s2 .imgArea .txt {display: flex; flex-direction: column; align-items: center;}
#s2 .imgArea .txt .t1 {}
#s2 .imgArea .txt .t1::before {content: '+'; position: absolute; display: block; font-size: 5.2rem; font-weight: bold; color: #B9E0FF; left: 100%; bottom: 60%;}
#s2 .imgArea .txt .t2 {padding: 2rem 0 0.4rem;}
#s2 .imgArea .txt .t3 {}

@media all and (max-width:880px){
    #s2 {}
    #s2 .inner {padding-top: 10rem;}
    #s2 .txtArea {margin-bottom: 4.8rem;}
    #s2 .txtArea .subt {font-size: 4rem;}
    #s2 .txtArea .tit {font-size: 3.6rem; padding: 1.8rem 0 2.8rem; line-height: 4.8rem;}
    #s2 .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s2 .imgArea {}
    #s2 .imgArea .img {}
    #s2 .imgArea .txt {}
    #s2 .imgArea .txt .t1 {font-size: 6rem;}
    #s2 .imgArea .txt .t1::before {font-size: 4rem;}
    #s2 .imgArea .txt .t2 {font-size: 2rem;}
    #s2 .imgArea .txt .t3 {font-size: 1.2rem;}
}

#s3 {}
#s3::before {content: ''; display: block; position: absolute; width: 100%; height: calc(100% + 22rem); left: 0; bottom: 0; background: #F6F7F9; background: linear-gradient(180deg,rgba(246, 247, 249, 1) 30%, rgba(218, 219, 222, 1) 100%);}
#s3 .inner {padding-top: 15.6rem;}
#s3 .title {margin-bottom: 8rem;}
#s3 .title i {font-weight: 600; display: inline-block;}
#s3 .title i::before {content: ''; display: block; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #000; bottom: 100%; left: 42%;}
#s3 .title b {font-weight: 600; color: #0088C8;}
#s3 .cont {}
#s3 .cont .box {flex: 1}
#s3 .cont .box .doc {}
#s3 .cont .box .txt {}
#s3 .cont .box .txt img {cursor: pointer;}
#s3 .cont .box .txt .t1 {padding: 1.2rem 0 0.6rem;}
#s3 .cont .box .txt .t2 {padding: 0.8rem 1.2rem; background: #fff; border-radius: 1.8rem; color: #002A54; font-weight: bold;}
#s3 .cont .box .txt .t3 {line-height: 2.2rem; margin: 1.2rem 0;}

#s3 .cont .boxA {text-align: right;}
#s3 .cont .boxA .doc {right: -20.8rem;}
#s3 .cont .boxA .txt {right: 27%; bottom: 38%;}
#s3 .cont .boxB {z-index: 1}
#s3 .cont .boxB .doc {left: 70%; transform: translateX(-50%);}
#s3 .cont .boxB .txt {left: 29%; bottom: 59%;}
#s3 .cont .boxC {}
#s3 .cont .boxC .doc {left: 30%; transform: translateX(-50%);}
#s3 .cont .boxC .txt {left: 48%; bottom: 63%;}

#s3 .modal {display: none; z-index: 99999}
#s3 .modal .bg {background: rgba(0, 0, 0, 0.4);}
#s3 .modal .box {width: 100%; max-width: 128rem; transform: translate(-50%, -50%) scale(0.8); transition: 0.4s; opacity: 0; display: none;}
#s3 .modal .box.act {transform: translate(-50%, -50%) scale(1); opacity: 1;}
#s3 .modal .box .img {filter: drop-shadow(0.2rem 0.5rem 1.5rem rgba(0,0,0,0.1));}
#s3 .modal .box .closeBtn {top: 4.6rem; right: 5.4rem; cursor: pointer;}

@media all and (max-width:880px){
    #s3 {}
    #s3::before {display: none;}
    #s3 .inner {padding-top: 6.4rem; background: #F6F7F9}
    #s3 .title {font-size: 3.2rem; line-height: 4.4rem; margin-bottom: 0;}
    #s3 .title i {}
    #s3 .title b {}
    #s3 .lst {}
    #s3 .lst .box {}
    #s3 .lst .box .txt {position: absolute;}
    #s3 .lst .box .txt .t1 {line-height: 2.2rem;}
    #s3 .lst .box .txt .t2 {padding: 1rem 0 1.4rem;}
    #s3 .lst .box .txt .t3 {line-height: 2.2rem;}
    #s3 .lst .box .txt .btn {}
    #s3 .lst .box .doc {width: 25rem;}

    #s3 .lst .boxA {padding-top: 2.6rem; display: flex; justify-content: flex-end;}
    #s3 .lst .boxA::before {content: ''; display: block; position: absolute; width: 14.5rem; height: 13rem; background: url('../img/s3_sym_2.png') center/contain no-repeat; left: 34%; top: 6%;}
    #s3 .lst .boxA .doc {}
    #s3 .lst .boxA .txt {left: 2.4rem; top: 20%;}
    #s3 .lst .boxA .txt .btn {margin: 1.8rem 0 0 0;}

    #s3 .lst .boxB {background: #0088C8; padding-top: 5.2rem;}
    #s3 .lst .boxB::before {content: ''; display: block; position: absolute; width: 14.5rem; height: 13rem; background: url('../img/s3_sym_3.png') center/contain no-repeat; left: 34%; top: 6%;}
    #s3 .lst .boxB .doc {}
    #s3 .lst .boxB .txt {left: 18rem; top: 9rem;}
    #s3 .lst .boxB .txt .btn {margin: 3.2rem 0 0 3rem;}

    #s3 .lst .boxC {padding-top: 2.6rem; display: flex; justify-content: flex-end;}
    #s3 .lst .boxC::before {content: ''; display: block; position: absolute; width: 14.5rem; height: 13rem; background: url('../img/s3_sym_2.png') center/contain no-repeat; left: 34%; top: 6%;}
    #s3 .lst .boxC .doc {}
    #s3 .lst .boxC .txt {left: 2.4rem; top: 16%;}
    #s3 .lst .boxC .txt .btn {margin: 1.8rem 0 0 0;}

    #s3 .modal {}
    #s3 .modal .bg {}
    #s3 .modal .box {max-width: 100%; width: 90%; height: 80vh; overflow-y: auto; border-radius: 3rem;}
    #s3 .modal .box.act {}
    #s3 .modal .box .img {}
    #s3 .modal .box .closeBtn {width: 2.4rem; top: 3rem; right: 3rem;}
}

#s4 {}
#s4 .inner {padding: 20rem 0 23rem;}
#s4 .titArea {margin-bottom: 7rem;}
#s4 .titArea .subt {color: #C9CDD2}
#s4 .titArea .tit {padding: 2.8rem 0;}
#s4 .titArea .wrt {}
#s4 .tabLst {gap: 6.4rem; margin-bottom: 8rem;}
#s4 .tabLst li {cursor: pointer}
#s4 .tabLst li.on {color: #002A54; font-weight: 600}
#s4 .tabLst li.on::before {content: ''; display: block; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #0088C8; left: -0.9rem; top: -0.6rem;}
#s4 .s4_swiper {overflow: hidden;}
#s4 .s4_swiper .slide {gap: 8.3rem; align-items: center;}
#s4 .s4_swiper .slide .imgArea {}
#s4 .s4_swiper .slide .txtArea {}
#s4 .s4_swiper .slide .txtArea .tit {margin-bottom: 2.4rem;}
#s4 .s4_swiper .slide .txtArea .wrt {line-height: 2.8rem; font-size: 1.9rem}
#s4 .s4_swiper .s4_prev::after,
#s4 .s4_swiper .s4_next::after {display: none}
#s4 .s4_swiper .s4_prev,
#s4 .s4_swiper .s4_next {width: 1.3rem; height: 2.5rem;}
#s4 .s4_swiper .s4_prev {background: url('../img/s4_prev.png') no-repeat center/contain; left: 13%;}
#s4 .s4_swiper .s4_next {background: url('../img/s4_next.png') no-repeat center/contain; right: 13%;}

@media all and (max-width:880px){
    #s4 {}
    #s4 .inner {padding: 9rem 0; max-width: var(--innerMo); margin: 0 auto;}
    #s4 .titArea {margin-bottom: 2.8rem;}
    #s4 .titArea .subt {font-size: 1.4rem;}
    #s4 .titArea .tit {font-size: 3.2rem; padding: 2.2rem 0 1.6rem; line-height: 4.4rem;}
    #s4 .titArea .wrt {font-size: 1.6rem;}
    #s4 .tabLst {gap: 1rem; flex-wrap: wrap; font-size: 1.6rem; margin-bottom: 3.8rem;}
    #s4 .tabLst li {width: calc((100% - 2rem) / 3); text-align: center; padding: 0.6rem 0; border: 1px solid #C9CDD2; border-radius: 1.8rem;}
    #s4 .tabLst li.on {background: #002A54; color: #fff;}
    #s4 .tabLst li.on::before {display: none;}
    #s4 .s4_swiper {}
    #s4 .s4_swiper .slide {flex-direction: column; gap: 2.2rem; align-items: flex-start;}
    #s4 .s4_swiper .slide .imgArea {}
    #s4 .s4_swiper .slide .txtArea {}
    #s4 .s4_swiper .slide .txtArea .tit {font-size: 2.4rem;}
    #s4 .s4_swiper .slide .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s4 .s4_swiper .s4_prev,
    #s4 .s4_swiper .s4_next {display: none;}
}

#s5 {background: #222527;}
#s5 .inner {padding-top: 18.5rem;}
#s5 .titArea {margin-bottom: 7rem;}
#s5 .titArea .out {bottom: 0;}
#s5 .titArea .subt {margin-bottom: 4.6rem; background: #71A0D5; padding: 0.8rem 1.8rem;}
#s5 .titArea .subt span {z-index: 1;}
#s5 .titArea .subt img {right: 15%; top: 50%;}
#s5 .titArea .tit {padding: 6rem 0 8.2rem;}
#s5 .cont {align-items: center;}
#s5 .cont .imgArea {width: 50%;}
#s5 .cont .txtArea {width: 50%; padding-left: 6rem;}
#s5 .cont .txtArea .tit {padding-bottom: 1.4rem;}
#s5 .cont .txtArea .subt {margin-bottom: 6.2rem; color: #A4AAB1;}
#s5 .cont .txtArea .lst {max-width: 62.6rem;}
#s5 .cont .txtArea .lst li {display: flex; align-items: center;}
#s5 .cont .txtArea .lst li + li {padding-top: 3.2rem; margin-top: 3.2rem; border-top: 1px solid #C9CDD2;}
#s5 .cont .txtArea .lst li .ltit {align-items: center; gap: 2rem; min-width: 28.3rem;}
#s5 .cont .txtArea .lst li .ltit .num {}
#s5 .cont .txtArea .lst li .lwrt {line-height: 2.6rem;}

@media all and (max-width:880px){
    #s5 {}
    #s5 .inner {padding-top: 9rem;}
    #s5 .titArea {margin-bottom: 5rem;}
    #s5 .titArea .out {width: 31.5rem; bottom: 37%;}
    #s5 .titArea .subt {font-size: 1.8rem; margin: 0}
    #s5 .titArea .subt img {top: 30%;}
    #s5 .titArea .tit {font-size: 4.8rem; line-height: 6rem; text-align: center; padding: 6rem 0 0 0;}
    #s5 .cont {flex-direction: column; gap: 2.8rem;}
    #s5 .cont .imgArea {width: 100%;}
    #s5 .cont .txtArea {width: 88%; margin: 0 auto; padding: 0;}
    #s5 .cont .txtArea .tit {font-size: 2.8rem; line-height: 4rem;}
    #s5 .cont .txtArea .subt {font-size: 1.6rem; line-height: 2.6rem;}
    #s5 .cont .txtArea .lst {}
    #s5 .cont .txtArea .lst li {flex-direction: column; align-items: flex-start; gap: 1.4rem;}
    #s5 .cont .txtArea .lst li + li {padding-top: 2.6rem; margin-top: 2.6rem;}
    #s5 .cont .txtArea .lst li .ltit {flex-direction: row-reverse; justify-content: space-between; min-width: 100%;}
    #s5 .cont .txtArea .lst li .ltit .num {}
    #s5 .cont .txtArea .lst li .lwrt {}
}

#s6 {background: #222527;}
#s6 .inner {max-width: 130.8rem; padding: 27.5rem 0 21rem;}
#s6 .titArea {}
#s6 .titArea .tit {color: #72787F; line-height: 6rem; margin-bottom: 2.6rem;}
#s6 .titArea .tit span {}
#s6 .titArea .wrt {color: #A4AAB1; line-height: 2.9rem;}
#s6 .titArea .tab {margin: 3.6rem 0 4rem; gap: 3rem;}
#s6 .titArea .tab li {padding: 0.8rem 2rem; border: 1px solid #C9CDD2; border-radius: 2.6rem; min-width: 15rem; text-align: center; cursor: pointer; transition: 0.2s;}
#s6 .titArea .tab li.on {background: #0088C8; border: 1px solid #0088C8;}
#s6 .tabArea {touch-action: pan-y;}
#s6 .tabBox {background: #33383C; padding: 7rem 12rem; opacity: 0; transition: 0.2s;}
#s6 .tabBox.on {opacity: 1;}
#s6 .tabBox.boxAb {position: absolute; width: 100%; bottom: 0;}
#s6 .tabBox .tit {padding-bottom: 1.7rem;}
#s6 .tabBox .wrt {line-height: 2.6rem;}
#s6 .tabBox .img {width: 45.6rem; position: absolute; bottom: 11.5rem; right: 8rem;}

@media all and (max-width:880px){
    #s6 {}
    #s6 .inner {padding: 14rem 0 9.5rem; max-width: 88%;}
    #s6 .titArea {}
    #s6 .titArea .tit {font-size: 3.2rem; line-height: 4.4rem; margin-bottom: 2rem;}
    #s6 .titArea .tit span {}
    #s6 .titArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s6 .titArea .tab {font-size: 1.6rem; gap: 1rem; margin: 3.2rem 0 0 0;}
    #s6 .titArea .tab li {min-width: 11rem; padding: 0.7rem 0;}
    #s6 .titArea .tab li.on {}
    #s6 .tabArea {margin-top: 27rem;}
    #s6 .tabBox {padding: 4rem 2.3rem;}
    #s6 .tabBox.on {}
    #s6 .tabBox .tit {font-size: 2.4rem;}
    #s6 .tabBox .wrt {}
    #s6 .tabBox .img {width: 29rem; bottom: 94%; right: auto; left: 50%; transform: translateX(-50%);}
}

#s7 {}
#s7 .inner {max-width: 136.4rem; padding-top: 17rem;}
#s7 .titArea {margin-bottom: 5rem;}
#s7 .titArea .tit {line-height: 6rem; padding-bottom: 3rem;}
#s7 .titArea .wrt {line-height: 2.8rem;}
#s7 .imgArea {}
#s7 .lstArea {margin-top: 4.5rem;}
#s7 .lstArea li {width: calc(100% / 3); padding-left: 2.4rem; border-left: 2px solid #0088C8;}
#s7 .lstArea li .tit {padding-bottom: 1.6rem;}
#s7 .lstArea li .wrt {}

@media all and (max-width:880px){
    #s7 {}
    #s7 .inner {padding-top: 9.3rem; max-width: 88%;}
    #s7 .titArea {text-align: left; margin-bottom: 3.8rem;}
    #s7 .titArea .tit {font-size: 3.6rem; line-height: 4.8rem;}
    #s7 .titArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s7 .imgArea {}
    #s7 .lstArea {margin-top: 2rem; flex-direction: column; gap: 2rem;}
    #s7 .lstArea li {width: 100%; padding: 0.6rem 2rem;}
    #s7 .lstArea li .tit {padding-bottom: 1.2rem;}
    #s7 .lstArea li .wrt {font-size: 1.6rem;}
}

#s8 {}
#s8 .inner {max-width: 131rem; padding: 23rem 0;}
#s8 .titArea {margin-bottom: 6rem;}
#s8 .titArea .tit {padding-bottom: 1.8rem;}
#s8 .titArea .wrt {}
#s8 .lstArea {gap: 3.4rem;}
#s8 .lstArea li {width: calc((100% - 10.2rem) / 4); background: #F2FAFF; padding: 0 2.4rem 4rem;}
#s8 .lstArea li:nth-child(even) {top: 4.5rem;}
#s8 .lstArea li .img {}
#s8 .lstArea li .txt {text-align: center;}
#s8 .lstArea li .txt .tit {padding: 2rem 0;}
#s8 .lstArea li .txt .wrt {line-height: 2.6rem;}

@media all and (max-width:880px){
    #s8 {}
    #s8 .inner {padding: 10rem 0 8.5rem; max-width: 88%;}
    #s8 .titArea {text-align: center; margin-bottom: 2.5rem;}
    #s8 .titArea .tit {font-size: 3.2rem; line-height: 4.4rem;}
    #s8 .titArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s8 .lstArea {flex-direction: column; gap: 1.6rem;}
    #s8 .lstArea li {width: 100%; padding: 1.2rem 0; flex-direction: row; gap: 2rem;}
    #s8 .lstArea li:nth-child(even) {top: auto}
    #s8 .lstArea li .img {width: 14rem;}
    #s8 .lstArea li .txt {text-align: left;}
    #s8 .lstArea li .txt .tit {font-size: 1.8rem; padding: 0 0 1.4rem 0}
    #s8 .lstArea li .txt .wrt {font-size: 1.4rem; line-height: 2.2rem;}
}

#s9 {background: #F6F7F9}
#s9 .inner {padding-top: 14rem;}
#s9 .titArea {margin-bottom: 9rem;}
#s9 .titArea .tit {line-height: 6rem; padding-bottom: 3rem;}
#s9 .titArea .wrt {line-height: 2.8rem;}
#s9 .lstArea {justify-content: center; gap: 12rem;}
#s9 .lstArea li {width: 21rem; text-align: center;}
#s9 .lstArea li img {width: 16rem;}
#s9 .lstArea li .tit {padding: 2.8rem 0 1.7rem;}
#s9 .lstArea li .wrt {line-height: 2.8rem;}

@media all and (max-width:880px){
    #s9 {}
    #s9 .inner {padding-top: 11rem;}
    #s9 .titArea {}
    #s9 .titArea .tit {font-size: 3.6rem; line-height: 4.8rem; padding-bottom: 2.5rem;}
    #s9 .titArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s9 .lstArea {gap: 4.4rem; flex-wrap: wrap; max-width: 85%; margin: 0 auto;}
    #s9 .lstArea li {width: calc((100% - 4.4rem) / 2);}
    #s9 .lstArea li img {width: 14rem;}
    #s9 .lstArea li .tit {padding: 1.8rem 0 1rem;}
    #s9 .lstArea li .wrt {font-size: 1.6rem; line-height: 2.6rem;}
}

#s10 {background: #F6F7F9}
#s10 .inner {max-width: 150.4rem; padding: 20rem 0 22rem;}
#s10 .cont {background: #FFFFFF; border-radius: 3rem; overflow: hidden; align-items: center; gap: 12.5rem;}
#s10 .cont .imgArea {}
#s10 .cont .imgArea .txt {}
#s10 .cont .imgArea .txt .tit {padding-bottom: 2.6rem;}
#s10 .cont .imgArea .txt .wrt {line-height: 2.8rem;}
#s10 .cont .lstArea {}
#s10 .cont .lstArea ul {}
#s10 .cont .lstArea ul li {gap: 1rem;}
#s10 .cont .lstArea ul li + li {padding-top: 1.8rem; margin-top: 1.8rem; border-top: 1px solid #C9CDD2;}
#s10 .cont .lstArea ul li img {}
#s10 .cont .lstArea ul li .txt {font-size: 1.8rem;}

@media all and (max-width:880px){
    #s10 {}
    #s10 .inner {padding: 11rem 0 8rem; max-width: 88%;}
    #s10 .cont {flex-direction: column; gap: 4.2rem;}
    #s10 .cont .imgArea {}
    #s10 .cont .imgArea .txt {}
    #s10 .cont .imgArea .txt .tit {font-size: 3.2rem; line-height: 4.4rem; padding-bottom: 1.8rem;}
    #s10 .cont .imgArea .txt .wrt {font-size: 1.6rem; line-height: 2.6rem;}
    #s10 .cont .lstArea {width: 85%; padding-bottom: 5rem;}
    #s10 .cont .lstArea ul {}
    #s10 .cont .lstArea ul li {gap: 1.2rem;}
    #s10 .cont .lstArea ul li img {}
    #s10 .cont .lstArea ul li .txt {line-height: 2.8rem;}
}

#s11 {}
#s11 .topArea {background: url('../img/s11_top_bg.jpg') center/cover; padding: 3.8rem 0;}
#s11 .topArea .txt {max-width: 110rem; margin: 0 auto; align-items: center;}
#s11 .topArea .txt span.t1 {margin-right: 5rem;}
#s11 .topArea .txt span.t2 {margin-left: auto;}
#s11 .topArea .txt span.line {width: 10rem; background: #fff; height: 2px;}
#s11 .cont {padding-top: 20rem;}
#s11 .cont::before {content: ''; display: block; position: absolute; width: 45.2rem; height: 45.2rem; background: url('../img/s11_sym.png') center/contain no-repeat; top: 5.4rem; right: 4.8rem;}
#s11 .cont .inner {max-width: 127rem; padding-bottom: 12rem;}
#s11 .cont .inner .line {position: absolute; width: 100%; height: 100%;}
#s11 .cont .inner .line::before {content: ''; display: block; position: absolute; width: 1px; height: 100%; top: 0; left: 50%; background: #B9E0FF}
#s11 .cont .inner .line span {display: inline-block; position: absolute; width: 2.1rem; height: 2.1rem; background: url('../img/s11_ico.svg') center/contain no-repeat; left: calc(50% - 1rem);}
#s11 .cont .inner .line span:nth-child(1) {top: 0;}
#s11 .cont .inner .line span:nth-child(2) {top: 30%;}
#s11 .cont .inner .line span:nth-child(3) {top: 60%;}
#s11 .cont .lst {}
#s11 .cont .lst li {justify-content: space-between;}
#s11 .cont .lst li.lst01 {}
#s11 .cont .lst li.lst02 {margin-top: -3.8rem;}
#s11 .cont .lst li.lst03 {margin-top: 15.5rem;}
#s11 .cont .lst li + li {}
#s11 .cont .lst li .left {width: 100%; max-width: 53.6rem;}
#s11 .cont .lst li .right {width: 100%; max-width: 53.6rem;}
#s11 .cont .lst li .titArea {}
#s11 .cont .lst li .titArea .subt {padding-bottom: 0.8rem;}
#s11 .cont .lst li .titArea .tit {}
#s11 .cont .lst li .imgArea {}
#s11 .cont .lst li .txtArea {}
#s11 .cont .lst li .txtArea .tit {line-height: 4rem; padding-bottom: 2rem;}
#s11 .cont .lst li .txtArea .wrt {line-height: 2.6rem;}

@media all and (max-width:880px){
    #s11 {}
    #s11 .topArea {background: url('../img/s11_top_bg_mo.jpg') center/cover; padding: 4.4rem 0;}
    #s11 .topArea .txt {flex-direction: column; font-size: 2.4rem; gap: 1.2rem;}
    #s11 .topArea .txt span.t1 {margin-right: 0;}
    #s11 .topArea .txt span.t2 {margin-left: 0;}
    #s11 .topArea .txt span.line {width: 2px; height: 3.3rem;}
    #s11 .cont {padding-top: 8rem;}
    #s11 .cont::before {width: 21rem; height: 21.4rem; right: 0; top: 3rem;}
    #s11 .cont .inner {max-width: 88%; padding-bottom: 9rem;}
    #s11 .cont .inner .line {display: none;}
    #s11 .cont .lst {}
    #s11 .cont .lst li {flex-direction: column;}
    #s11 .cont .lst li.lst01 {}
    #s11 .cont .lst li.lst02 {margin-top: 4.4rem;}
    #s11 .cont .lst li.lst03 {margin-top: 7.4rem; flex-direction: column-reverse;}
    #s11 .cont .lst li + li {}
    #s11 .cont .lst li .left {}
    #s11 .cont .lst li .right {}
    #s11 .cont .lst li .titArea {}
    #s11 .cont .lst li .titArea .subt {font-size: 2.8rem;}
    #s11 .cont .lst li .titArea .tit {font-size: 4.2rem; line-height: 5.4rem;}
    #s11 .cont .lst li .imgArea {}
    #s11 .cont .lst li .txtArea {margin-top: 2.8rem;}
    #s11 .cont .lst li .txtArea .tit {font-size: 2.4rem; line-height: 3.6rem; padding-bottom: 1.8rem;}
    #s11 .cont .lst li .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem;}
}

#s12 {padding: 20rem 0 19rem; background: url('../img/s12_bg.jpg') no-repeat center/cover; overflow: hidden;}
#s12 .line {background: #FFFFFF; height: 15.5rem; width: 1px; position: absolute; left: 50%; top: 0;}
#s12 .txtArea {}
#s12 .txtArea .title {line-height: 6.2rem;}
#s12 .txtArea .title span {color: #B9E0FF;}

@media all and (max-width:880px){
    #s12 {padding: 16.5rem 0 15.5rem; background: url('../img/s12_bg_mo.jpg') no-repeat center/cover;}
    #s12 .line {height: 12.5rem;}
    #s12 .txtArea {}
    #s12 .txtArea .subt {padding-bottom: 2.6rem;}
    #s12 .txtArea .subt span {color: #B9E0FF;}
    #s12 .txtArea .tit {line-height: 4.8rem;}
}

#s13 {}
#s13::before {content: ''; display: block; position: absolute; width: 100%; bottom: 0; background: #002A54; height: 31rem;}
#s13 .inner {max-width: 144rem; padding-top: 8.4rem;}
#s13 .titArea {margin-bottom: 7rem;}
#s13 .titArea .logo {margin-bottom: 5rem;}
#s13 .titArea .txt {}
#s13 .titArea .txt b {font-weight: 700}
#s13 .infoArea {display: flex; padding-bottom: 4.6rem;}
#s13 .infoArea .title {margin-bottom: 3.2rem;}
#s13 .infoArea .title div {background: #002A54; width: 13.4rem; height: 4.5rem; gap: 1rem; justify-content: center;}
#s13 .infoArea .title div img {}
#s13 .infoArea .time {width: 65%;}
#s13 .infoArea .time .lstWrap {gap: 5.2rem;}
#s13 .infoArea .time .lst {}
#s13 .infoArea .time .lst li + li {margin-top: 1.6rem;}
#s13 .infoArea .time .lst li .ltit {width: 7.2rem; margin-right: 3.2rem;}
#s13 .infoArea .time .lst li .lwrt {}
#s13 .infoArea .time .twrt {font-size: 1.6rem; margin-top: 2rem; gap: 4rem;}
#s13 .infoArea .loca {width: 35%; border-left: 1px solid #707070;}
#s13 .infoArea .loca .ltxt {}
#s13 .infoArea .loca .ltxt .t1 {}
#s13 .infoArea .loca .ltxt .t2 {padding: 0.6rem 0 1.4rem;}
#s13 .infoArea .loca .ltxt .t3 {}
#s13 .botArea {gap: 4rem;}
#s13 .mapArea {width: 85rem; flex-shrink: 0;}
#s13 .mapArea .root_daum_roughmap .wrap_controllers {display: none}
#s13 .mapArea .root_daum_roughmap .cont {display: none}
#s13 .parkArea {background: #fff; box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.25);}
#s13 .parkArea .ptitle {background: #0088C8; text-align: center; padding: 1.4rem 0;}
#s13 .parkArea .pcont {padding: 1.5rem 4.2rem 0}
#s13 .parkArea .pcont .ptit {margin-bottom: 1.5rem; gap: 0.8rem;}
#s13 .parkArea .pcont .ptit .tit {}
#s13 .parkArea .pcont .ptit .subt {font-size: 1.4rem; color: #fff; font-weight: bold; background: #000000; padding: 0.6rem 1.3rem; display: inline-block;}
#s13 .parkArea .pcont .pimg {}
#s13 .lnkArea {margin-top: 4.8rem; gap: 2.3rem;}
#s13 .lnkArea li {width: 100%}
#s13 .lnkArea li a {gap: 0.8rem; padding: 2.2rem; background: #fff;}
#s13 .lnkArea li a.map {background: #B9E0FF;}

@media all and (max-width:880px){
    #s13 {}
    #s13::before {height: 43%;}
    #s13 .inner {max-width: 88%;}
    #s13 .titArea {margin-bottom: 6.5rem;}
    #s13 .titArea .logo {width: 27rem; margin-bottom: 3rem;}
    #s13 .titArea .txt {font-size: 2rem; line-height: 2.8rem;}
    #s13 .infoArea {flex-direction: column;}
    #s13 .infoArea .title {margin-bottom: 2.6rem;}
    #s13 .infoArea .title div {height: 4rem;}
    #s13 .infoArea .title div img {}
    #s13 .infoArea .time {width: 100%;}
    #s13 .infoArea .time .lstWrap {flex-direction: column; gap: 2rem;}
    #s13 .infoArea .time .lst {}
    #s13 .infoArea .time .lst li {}
    #s13 .infoArea .time .lst li .ltit {}
    #s13 .infoArea .time .lst li .lwrt {}
    #s13 .infoArea .time .twrt {font-size: 1.4rem; gap: 2rem}
    #s13 .infoArea .loca {width: 100%; border: 0; padding-top: 3.6rem; margin-top: 3.6rem; border-top: 1px solid #707070;}
    #s13 .infoArea .loca .ltxt {}
    #s13 .infoArea .loca .ltxt .t1 {font-size: 2rem;}
    #s13 .infoArea .loca .ltxt .t2 {font-size: 1.8em;}
    #s13 .infoArea .loca .ltxt .t3 {}
    #s13 .botArea {flex-direction: column; gap: 3.2rem;}
    #s13 .mapArea {width: 100%}
    #s13 .parkArea {}
    #s13 .parkArea .ptitle {font-size: 1.8rem; padding: 1.2rem 0;}
    #s13 .parkArea .pcont {padding: 1.4rem 2.4rem 2rem;}
    #s13 .parkArea .pcont .ptit {}
    #s13 .parkArea .pcont .ptit .tit {font-size: 1.7rem;}
    #s13 .parkArea .pcont .ptit .subt {font-size: 1.2rem; padding: 0.3rem 0.8rem;}
    #s13 .parkArea .pcont .pimg {}
    #s13 .lnkArea {flex-direction: column; gap: 1.2rem;}
    #s13 .lnkArea li {}
    #s13 .lnkArea li a {padding: 2rem 0;}
    #s13 .lnkArea li a.map {}
}

























..