@charset "utf-8";

.sub_wrap{margin-bottom: 210px;}
/* subVisual */
.sub_visual_wrap{position: relative; height: 550px;}
.sub_visual_wrap figure {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.sub_visual_wrap figure img{width: 100%; height: 100%; object-fit:cover; }
.sub_visual_wrap figure img:last-child{display: none;}

.sub_visual_wrap .wrap2{height: 100%; position: relative;}
.sub_visual_wrap .tbx{display: flex; align-items:center; justify-content: center; width: 100%; height: 100%; position: relative; z-index: 10;}
.sub_visual_wrap .tbx .sv_tit{font-size: 60px; line-height: 1; color: #fff; letter-spacing: -0.02em; font-weight: 700;  padding-top: 40px;}
.sub_visual_wrap .lnb_wrap{position: absolute; left: 20px; bottom: 0; width: 100%; z-index: 10; width: calc(100% - 40px);}
.sub_visual_wrap .lnb_wrap ul{display: flex; flex-wrap:wrap; }
.sub_visual_wrap .lnb_wrap ul > li{flex:1; border-top: 2px solid #283891; border-right: 1px solid rgba(255,255,255,0.2);}
.sub_visual_wrap .lnb_wrap ul > li:last-child{border-right: 0;}
.sub_visual_wrap .lnb_wrap ul > li > a{display: flex; justify-content: center; align-items:center; font-size: 20px; line-height: 1.5; color: #fff; font-weight: 700; background: rgba(0,0,0,0.5); height: 70px; transition:.3s;}
.sub_visual_wrap .lnb_wrap ul > li.current > a,
.sub_visual_wrap .lnb_wrap ul > li:hover > a{background: #283891;}
.sub_tit{margin-top: 126px; margin-bottom: 128px;}
.sub_tit h2{position: relative; font-size: 50px; line-height: 1; color: #000; font-weight: 700; letter-spacing: -0.02em !important; padding-top: 38px; text-align: center;}
.sub_tit h2:before{position: absolute; content: ''; width: 40px; height: 4px; background: #283891; left: 50%; top: 0; margin-left: -20px;}

/* s11 */
.s1_1 .arti1_wrap{background: url(../img/sub/s11_1.jpg) center / cover no-repeat; height: 600px; background-attachment: fixed;}

.s1_1 .arti1 {display: flex; align-items:center; height: 100%;}
.s1_1 .arti1 .box{position: relative; width: 550px; height: 400px; color: #fff; padding: 73px 60px;  z-index: 10;}
.s1_1 .arti1 .box:before{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/s11_2.jpg) center  no-repeat;  opacity: 0.8; left: 0; top: 0; z-index: -1;} 

.s1_1 .arti1 .box small{display: block; font-family: "Poppins", sans-serif; font-size: 30px; line-height: 1.5; letter-spacing: -0.02em; font-weight: 700; }
.s1_1 .arti1 .box strong{display: block; font-size: 50px; line-height: 1; letter-spacing: -0.02em; font-weight: 700; margin: 10px 0 33px;}
.s1_1 .arti1 .box p{font-size: 20px; line-height: 34px; letter-spacing: -0.02em;}
.s1_1 .arti2{margin-top: 130px;}
.s1_1 .arti2 .box{align-items:center; margin-bottom: 130px; position: relative;}
.s1_1 .arti2 .box:last-child{margin-bottom: 0;}
.s1_1 .arti2 .box .lbx{width: 46.96%; box-sizing: border-box; padding-bottom: 10px; height: 100%;}
.s1_1 .arti2 .box .lbx .tbx{}
.s1_1 .arti2 .box .lbx small{display: block; font-family: "Poppins", sans-serif; font-size: 25px; line-height: 1; color: #283891; letter-spacing: -0.02em; font-weight: 700;}
.s1_1 .arti2 .box .lbx b{display: block; font-size: 50px; line-height: 1.5; color: #000; letter-spacing: -0.02em; font-weight: 700; margin: 22px 0 15px;}
.s1_1 .arti2 .box .lbx p{font-size: 20px; line-height: 34px; letter-spacing: -0.02em; color: #666; }
.s1_1 .arti2 .box .lbx strong{display: block; text-align: right; position: absolute; right: 45px; bottom: -153px;}
.s1_1 .arti2 .box .lbx strong span{font-family: 'Noto Sans KR'; font-size: 20px; line-height: 1; color: #666; letter-spacing: -0.02em; font-weight: 500;}
.s1_1 .arti2 .box .lbx strong p{font-size: 35px; line-height: 1; letter-spacing: -0.02em; color: #000; font-weight: 700; display: inline-block; margin-left: 20px;}
.s1_1 .arti2 .box .rbx{width: 1%; flex:1 1 auto}
.s1_1 .arti2 .box:nth-child(even){flex-direction: row-reverse;}
.s1_1 .arti2 .box:nth-child(even) .lbx{padding-left: 120px; align-self:flex-start; padding-top: 60px;}

/* s12 */
.s1_2 .arti1{margin-top: -54px;}
.s1_2 .arti1 .box{position: relative; width: 696px; height: 613px; margin: 0 auto;}
.s1_2 .arti1 .box img{position: absolute; left: 50%; top: 50%; translate:-50% -50%;   image-rendering: -moz-crisp-edges; /* firefox */
  image-rendering: -o-crisp-edges; /* opera */
  image-rendering: -webkit-optimize-contrast; /* chrome(비표준) */
  image-rendering: crisp-edges;}
.s1_2 .arti1 .box img:last-child{margin-left: -28px;}
.s1_2 .arti1 .box img:nth-child(2){animation: 10s ease 0s infinite normal none running; animation-name:roll; animation-timing-function : linear;}
.s1_2 .arti1 .box img:nth-child(1){z-index: 10;}

@keyframes roll {0% {rotate:0} 100% {rotate:360deg} }
.s1_2 .arti2_wrap{background: url(../img/sub/s12_4.jpg) center / cover no-repeat; height: 700px; margin-top: 137px; background-attachment: fixed;}
.s1_2 .arti2{height: 100%;}
.s1_2 .arti2 ul{height: 100%; align-items:center;}
.s1_2 .arti2 ul > li{flex:1; text-align: center; border-right: 1px solid rgba(255,255,255,0.2); height: 100%; display: flex; align-items:center; flex-direction: column; justify-content: center; padding-bottom: 28px;} 
.s1_2 .arti2 ul > li:first-child{border-left: 1px solid rgba(255,255,255,0.2);	}
.s1_2 .arti2 ul > li figure{}
.s1_2 .arti2 ul > li .tbx{color: #fff;}
.s1_2 .arti2 ul > li .tbx strong{display: block; font-size: 35px; line-height: 1; font-weight: 700; letter-spacing: -0.02em; margin: 19px 0 18px;}
.s1_2 .arti2 ul > li .tbx p{font-size: 22px; line-height: 1.5; letter-spacing: -0.02em; 	}
.s1_2 .arti3{margin-top: 150px; text-align: center;}

/* s13 */
.s1_3 .arti1{height: 420px; margin-top: -60px; background: url(../img/sub/s31_his-img.jpg) center / cover no-repeat;}
.s1_3 .arti1 .tbx{color: #fff; padding: 70px 50px;}
.s1_3 .arti1 .tbx p{font-size: 32px; line-height: 1.5; letter-spacing: -0.02em; font-weight: 600; margin-bottom: 10px;}
.s1_3 .arti1 .tbx b{display: block; font-size: 60px; line-height: 1; letter-spacing: -0.02em; font-weight: 700; margin-left: -4px;}
.s1_3 .arti2{position: relative; padding-top: 75px; padding-bottom: 210px;}
.s1_3 .arti2:after{position: absolute; content: ''; width: 1px; height: 100%; background: #ddd; left: 50%; top: 0;}
.s1_3 .arti2 .box{display: flex; flex-wrap:wrap; margin-bottom: 40px;}
.s1_3 .arti2 .box:last-child{margin-bottom: 0;}
.s1_3 .arti2 .box > *{width: 50%; box-sizing: border-box;}
.s1_3 .arti2 .box > b{position: relative; font-family: "Poppins", sans-serif; text-align: right; font-size: 50px; line-height: 1; color: #283891; letter-spacing: -0.02em; font-weight: 700; padding-right: 50px;} 
.s1_3 .arti2 .box > b:after{position: absolute; content: ''; width: 10px; height: 10px; background: url(../img/sub/s13_3.jpg) center no-repeat; right: -6px; top: 16px; z-index: 1;}
.s1_3 .arti2 .box > .tbx{padding-left: 50px; align-self:center; margin-top: 7px;}
.s1_3 .arti2 .box > .tbx ul > li{font-size: 20px; line-height: 1.5; color: #666; letter-spacing: -0.02em;  display: flex; flex-wrap:wrap; margin-bottom: 15px;	}
.s1_3 .arti2 .box > .tbx ul > li span{font-family: "Poppins", sans-serif; color: #283891; font-weight: 700; width: 40px;}
.s1_3 .arti2 .box > .tbx ul > li box{width: calc(100% - 40px); -ms-word-break: break-all; word-break: break-all; }
/* s14 */
.s1_4 {margin-top: -57px;}
.s1_4 article{border-top: 2px solid #000; margin-bottom: 100px;}
.s1_4 article:last-child{margin-bottom: 0;}
.s1_4 article .tit_box{padding-top: 61px;}
.s1_4 article .tit_box .lbx{width: 38.25%;}
.s1_4 article .tit_box .lbx p{font-size: 45px; line-height: 1.2; font-weight: 700; letter-spacing: -0.02em; margin-left: -2px; margin-bottom: 10px;}
.s1_4 article .tit_box .lbx span{display: block; font-size: 20px; line-height: 1.5; letter-spacing: -0.02em; color: rgba(0,0,0,0.5); font-weight: 700;}
.s1_4 article .tit_box .rbx{width: 1%; flex:1 1 auto} 
.s1_4 article .tit_box .rbx ul > li{font-size: 20px; line-height: 34px; letter-spacing: -0.02em; color: #666; gap:27px; margin-bottom: 3px;}
.s1_4 article .tit_box .rbx ul > li p{display: flex; flex-wrap:wrap; gap:15px}
.s1_4 article .tit_box .rbx ul > li p span{font-weight: 700; color: #000;}
.s1_4 article > .box{gap:40px; margin-top: 37px;}
.s1_4 article > .box > *{flex:1 ;}
.s1_4 article > .box > * iframe{width: 100%; height: 400px;}
.s1_4 article > .box > * .root_daum_roughmap{width: 100%; }
.s1_4 article > .box > * .root_daum_roughmap .wrap_map{height: 400px;}
.root_daum_roughmap .wrap_controllers{display: none;}

/* s21 */
.s2_1{margin-top: -26px;}
.s2_1 article:not(.arti1){margin-top: 128px;}
.s2_1 .tit_h4{font-size: 45px; line-height: 1.5; color: #000; letter-spacing: -0.02em !important; font-weight: 700; border-bottom: 2px solid #000; padding-bottom: 24px; margin-bottom: 32px;}
.s2_1 .arti1 p {font-size: 18px; line-height: 32px; color: #666; letter-spacing: -0.02em; }
.s2_1 .arti1 ul{gap:13px; margin-top: 43px;}
.s2_1 .arti1 ul > li{flex: 1 1 20%; background: #f3f8fc; display: flex; align-items:center;	padding: 15px 10px;}
.s2_1 .arti1 ul > li span{width: 40px; height: 40px; border-radius: 5px; background: #283891; font-size: 16px; text-align: center; line-height: 40px; letter-spacing: -0.02em; color: #fff; font-weight: 600;} 
.s2_1 .arti1 ul > li p{width: 1%; flex:1 1 auto; font-size: 18px; line-height: 1.5; color: #000; letter-spacing: -0.02em; font-weight: 600; margin-left: 18px;}
.s2_1 .arti2 .arti2_cnt{padding-right: 50px; padding-top: 18px;}
.s2_1 .arti2 .arti2_cnt > .box{flex:1;}
.s2_1 .arti2 .arti2_cnt > .box1{z-index:50}
.s2_1 .arti2 .arti2_cnt > .box2{z-index:40}
.s2_1 .arti2 .arti2_cnt > .box3{z-index:30}
.s2_1 .arti2 .arti2_cnt > .box4{z-index:20}
.s2_1 .arti2 .arti2_cnt > .box5{z-index:10}
.s2_1 .arti2 .arti2_cnt > .box .tit_box{position: relative; display: flex; align-items:center; height: 70px; font-size: 22px; line-height: 1.5; color: #fff; letter-spacing: -0.02em; font-weight: 700; padding-left: 80px; z-index: 5;}
.s2_1 .arti2 .arti2_cnt > .box .tit_box:after{position: absolute; content: ''; width: 43px; height: 70px; background: url(../img/sub/s21_1.png) center no-repeat; right: -43px; top: 0; z-index: 15;}
.s2_1 .arti2 .arti2_cnt > .box2 .tit_box:after{background: url(../img/sub/s21_2.png) center no-repeat; }
.s2_1 .arti2 .arti2_cnt > .box3 .tit_box:after{background: url(../img/sub/s21_3.png) center no-repeat; }
.s2_1 .arti2 .arti2_cnt > .box4 .tit_box:after{background: url(../img/sub/s21_4.png) center no-repeat; }
.s2_1 .arti2 .arti2_cnt > .box5 .tit_box:after{background: url(../img/sub/s21_5.png) center no-repeat; }
.s2_1 .arti2 .arti2_cnt > .box1 .tit_box{background: #3ec4c5; padding-left: 68px;} 
.s2_1 .arti2 .arti2_cnt > .box1 .tit_box:before{position: absolute; content: ''; width: 100%; height: 50%; background: #38b0b1;	left: 0; bottom: 0; z-index: -1;}
.s2_1 .arti2 .arti2_cnt > .box2 .tit_box{background: #2c94e2;}
.s2_1 .arti2 .arti2_cnt > .box3 .tit_box{background: #396cbf; padding-left: 97px;}
.s2_1 .arti2 .arti2_cnt > .box4 .tit_box{background: #285291;padding-left: 93px;}
.s2_1 .arti2 .arti2_cnt > .box5 .tit_box{background: #283891;}
.s2_1 .arti2 .arti2_cnt > .box .list-box{position: relative; padding: 32px 15px 32px 28px; border-right: 1px solid #ddd; height: 175px;}
.s2_1 .arti2 .arti2_cnt > .box .list-box:after{position: absolute; content: ''; width: 7px; height: 7px; background: #285291; border-radius: 50%; right: -4px; bottom: 0px;}
.s2_1 .arti2 .arti2_cnt > .box1 .list-box:after{background: #3ec4c5}
.s2_1 .arti2 .arti2_cnt > .box2 .list-box:after{background: #2c94e2}
.s2_1 .arti2 .arti2_cnt > .box3 .list-box:after{background: #396cbf}
.s2_1 .arti2 .arti2_cnt > .box4 .list-box:after{background: #285291}
.s2_1 .arti2 .arti2_cnt > .box5 .list-box:after{background: #283891}


.s2_1 .arti2 .arti2_cnt > .box .list-box ul > li{display: flex; flex-wrap:wrap; font-size: 18px; line-height: 32px; color: #666; letter-spacing: -0.02em;}
.s2_1 .arti2 .arti2_cnt > .box .list-box ul > li span{width: 17px;}
.s2_1 .arti2 .arti2_cnt > .box .list-box ul > li ol {width: 100%;}
.s2_1 .arti2 .arti2_cnt > .box .list-box ul > li ol > li{display: flex; flex-wrap:wrap; margin-left: 7px;}
.s2_1 .arti2 .arti2_cnt > .box .list-box ul > li ol > li > span{width: 11px;}
.s2_1 article.arti3{background: #f3f8fc; gap:75px; padding: 58px 0 52px; justify-content: center; align-items: center; margin-top: 77px; border-radius: 5px;} 
.s2_1 article.arti3 .lbx{padding-left: 42px;}
.s2_1 article.arti4{margin-top: 120px;}
.s2_1 .arti4 ul{text-align: center; gap:45px 56px; justify-content: space-between; margin-top: 60px;}
.s2_1 .arti4 ul > li figure{border: 10px solid #fff; border-radius: 50%; box-shadow:0px 0px 20px rgba(0,0,0,0.1)}
.s2_1 .arti4 ul > li figcaption{font-size: 20px; line-height: 32px; color: #000; letter-spacing: -0.02em; font-weight: 600; margin-top: 17px;}

/* s22 */
.s2_2 article.arti3{justify-content: space-between; padding: 58px 70px 44px; gap:10px} 
.s2_2 article.arti3 .lbx {padding-left: 95px;}
.s2_2 article.arti4 .arti4_cnt{text-align: center; justify-content: space-between; margin-top: 49px;}
.s2_2 article.arti4 .arti4_cnt .box{width: auto; }
.s2_2 article.arti4 .arti4_cnt .box figure{border: 10px solid #fff; box-shadow:0px 0px 20px rgba(0,0,0,0.1)}
.s2_2 article.arti4 .arti4_cnt figcaption{font-size: 20px; line-height: 32px; color: #000; letter-spacing: -0.02em; font-weight: 600; margin-top: 17px;}
.s2_2 article.arti4 .arti4_cnt .box2{width: 56.59%; padding: 0 58px; height: 100%; }
.s2_2 article.arti4 .arti4_cnt .box2 ul{margin-top: 10px; gap:30px 53px;}

/* s23 */
.s2_3 article.arti3 .rbx{padding-left: 20px;}
.s2_3 article.arti4 ul > li.no-radius figure{border-radius: 0px;}

/* s24 */
.s2_4 article.arti3 {gap: 50px;}
.s2_4 article.arti3 .lbx{padding-left: 30px}

/* s25 */
.s2_5 article.arti2{margin-top: 118px;}
.s2_5 .arti4 ul > li figcaption span{display: block; font-size: 16px; line-height: 1.5; color: #777; letter-spacing: -0.02em !important; margin-top: 5px; font-weight: 400;}