@charset "utf-8";
.sub_visual{position: relative; margin-bottom: 180px;}
.sub_visual .sub_visual_box{position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-wrap:wrap; align-items:center; flex-direction: column;  align-content: center; justify-content: flex-end; padding-bottom: 80px;}
.sub_1 .sub_visual .sub_visual_box h3{letter-spacing: 0;}
.sub_visual .sub_visual_box h3{font-family: "Jost", sans-serif; font-size: 68px; line-height: 1.5; color: #fff; letter-spacing: -0.02em; font-weight: 600;}
.lnb_wrap {display: flex; flex-wrap:wrap; gap:20px; margin-top: 183px;}
.lnb_wrap > a {width: 40px; height: 40px; border-radius: 50%; background: #fff; display: flex; align-items:center; justify-content: center; position: relative; top: 7px;}
.lnb_wrap > a span{line-height: 0;}
.lnb_wrap > .lnb_box{position: relative; width: 180px; 	}
.lnb_wrap > .lnb_box > span{position: relative; display: block; font-family:"Wanted Sans Variable"; font-size: 20px; line-height: 1.5;  color: #fff; letter-spacing: -0.03em;  border-bottom: 1px solid rgba(255,255,255,0.6); padding-left: 8px; box-sizing: border-box; padding-bottom: 14px; cursor: pointer;}
.sub_1 .lnb_wrap > .lnb_box > span{letter-spacing: 0;}
.lnb_wrap > .lnb_box > span:after{position: absolute; content: ''; width: 11px; height: 7px; background: url(../img/sub/sub_arr.png) center no-repeat; right: 10px; top: 12px; transition:.3s;}
.lnb_wrap > .lnb_box > span.on:after{rotate: -180deg;}
.lnb_wrap > .lnb_box > .lnb{position: absolute; left: 0; top: 55px; width: 100%; display: none;}
.lnb_wrap > .lnb_box > .lnb ul{border-radius: 20px; overflow: hidden;}
.lnb_wrap > .lnb_box > .lnb ul > li > a{ font-family:"Wanted Sans Variable"; font-size: 18px; line-height: 57px; letter-spacing: -0.03em; color: #666; padding: 0 30px; border-bottom: 1px solid #ddd; transition:.3s; background: #fff;}
.lnb_wrap > .lnb_box > .lnb ul > li:hover > a{background: #103554; color: #fff; font-weight: 600;}
.lnb_wrap > .lnb_box > .lnb ul > li:last-child > a{border-bottom: 0;}

.sub_area{font-family:"Wanted Sans Variable"; margin-bottom: 193px;}
.sub_tit_box{text-align: center;}
.sub_tit_box small{display: block; font-size: 20px; line-height: 1; color: #103554; letter-spacing: 0; font-weight: 500; margin-bottom: 32px;}
.sub_tit_box h4{font-family:"Wanted Sans Variable"; font-size: 48px; line-height: 70px; letter-spacing: 0 !important; color: #111;  font-weight: 500;}
.sub_tit_box p{font-size: 20px; line-height: 40px; color: #666; letter-spacing: 0; margin-top: 15px; letter-spacing: 0;}

/* s11 */
.sub_1_1 .arti1 .cnt_box{display: flex; flex-wrap:wrap; position: relative; margin-top: 90px; margin-bottom: -450px;}
.sub_1_1 .arti1 .cnt_box:before{position: absolute; content: ''; width: 1px; height: calc(100% - 530px); background: #ddd; left: 50%; top: 0;}
.sub_1_1 .arti1 .cnt_box .box{position: relative; width: 50%; box-sizing: border-box;}
.sub_1_1 .arti1 .cnt_box .box figure{overflow: hidden; border-radius: 20px; display: inline-block; position: relative;}
.sub_1_1 .arti1 .cnt_box .box .tbx{display: flex; flex-wrap:wrap;  font-family:"Wanted Sans Variable"; padding: 23px 0 90px;}
.sub_1_1 .arti1 .cnt_box .box .tbx b{display: block;  font-size: 32px; line-height: 40px; letter-spacing: -0.02em; color: #111; font-weight: 500; margin-right: 29px;}
.sub_1_1 .arti1 .cnt_box .box .tbx p{font-size: 20px; line-height: 40px; letter-spacing: -0.02em; color: #666; width: 1%; flex:1 1 auto; }
.sub_1_1 .arti1 .cnt_box .box .tbx p span{display: block; font-size: 18px; line-height: 28px; color: #999; letter-spacing: -0.02em; margin-top: 5px;}
.sub_1_1 .arti1 .cnt_box .box:nth-child(odd):after{position: absolute; content: ''; width: 7px; height: 7px; background: #103554; border-radius: 50%; 	right: -4px; top: 147px;}
.sub_1_1 .arti1 .cnt_box .box:nth-child(odd){padding-right: 9.375%; }
.sub_1_1 .arti1 .cnt_box .box:nth-child(3),
.sub_1_1 .arti1 .cnt_box .box:nth-child(4){top:  -194px;}
.sub_1_1 .arti1 .cnt_box .box:first-child{margin-top: 0 !Important;}
.sub_1_1 .arti1 .cnt_box .box:nth-child(5){top:  -430px;}
.sub_1_1 .arti1 .cnt_box .box:nth-child(even){padding-left: 9.375%; padding-top: 230px;}
.sub_1_1 .arti2{margin-top: 66px;}
.sub_1_1 .arti2 .cnt_box {display: flex; flex-wrap:wrap; gap:45px 60px; margin-top: 77px;}
.sub_1_1 .arti2 .cnt_box .box{flex: 1 1 25%}
.sub_1_1 .arti2 .cnt_box .box strong{position: relative; font-family:"Wanted Sans Variable";  display: flex; font-size: 23px; line-height: 1; color: #333; letter-spacing: -0.03em; font-weight: 500; align-items:center; border-bottom: 1px solid #303030; padding-bottom: 16px; margin-bottom: 17px;}
.sub_1_1 .arti2 .cnt_box .box strong:after{position: absolute; content: ''; width: 15px; height: 13px; background: url(../img/sub/s11_arr.jpg) center no-repeat; right: 0; bottom: 0;}
.sub_1_1 .arti2 .cnt_box .box strong span{font-family: "Jost", sans-serif;  font-size: 32px; color: #827f71; font-weight: 500; letter-spacing: 0; width: 60px;} 
.sub_1_1 .arti2 .cnt_box .box p{font-family:"Wanted Sans Variable"; font-size: 18px; line-height: 40px; color: #666; letter-spacing: -0.03em; }

.sub_1_1 .arti2 .cnt_box_new{display: flex; flex-wrap:wrap; gap:60px; margin-top: 80px;}
.sub_1_1 .arti2 .cnt_box_new .box{border: 1px solid #ddd; ; flex:1 1 25%; border-radius: 20px; padding: 55px 40px 0; height: 300px;}
.sub_1_1 .arti2 .cnt_box_new .box .top_box{display: flex; justify-content: space-between;}
.sub_1_1 .arti2 .cnt_box_new .box .top_box small{display: block;  font-family: "Poppins", sans-serif; font-size: 18px; line-height: 1.5; letter-spacing: -0.02em; font-weight: 600;}
.sub_1_1 .arti2 .cnt_box_new .box .top_box figure{margin-right: 10px; position: relative; top: -4px;}
.sub_1_1 .arti2 .cnt_box_new .box .tbx{margin-top: -12px}
.sub_1_1 .arti2 .cnt_box_new .box .tbx strong{display: block; font-size: 32px; line-height: 1; color: #111; font-weight: 500; letter-spacing: -0.02em; margin-bottom: 20px;}
.sub_1_1 .arti2 .cnt_box_new .box .tbx p{font-size: 18px; line-height: 30px; letter-spacing: -0.02em; color: #666;}

/* s12 */
.sub_1_2 .arti1 ul{display: flex; flex-wrap:wrap; gap:60px; margin-top: 88px;}  
.sub_1_2 .arti1 ul > li{border-radius: 0 0 20px 20px; width: calc(100% / 3 - 40px);}
.sub_1_2 .arti1 ul > li figure{border-radius: 20px 20px 0 0; overflow: hidden;}
.sub_1_2 .arti1 ul > li .tbx{border: 1px solid #ddd;	 border-radius: 0 0 20px 20px; display: flex; align-items:center; height: 200px; flex-direction: column; justify-content: center; position: relative; overflow: hidden;}
.sub_1_2 .arti1 ul > li .tbx strong{font-size: 32px; line-height: 1; color: #111111; letter-spacing: -0.02em; font-weight: 600;	margin-bottom: 22px;}
.sub_1_2 .arti1 ul > li .tbx p{font-size: 20px; line-height: 1.5; color: #666; letter-spacing: -0.02em;}


.sub_1_2 .arti1 ul > li .tbx:after{ font-family: "Poppins", sans-serif; position: absolute; content: '01'; width: 163px; height: 163px; border-radius: 50%; text-align: center; font-size: 16px; letter-spacing: -0.02em; color: #fff; font-weight: 600; background: #827f71; left: 50%; 	translate:-50% 0; bottom: -138px; line-height: 30px;} 

.sub_1_2 .arti1 ul > li:nth-child(2) .tbx:after{background: #718082; content:'02'}
.sub_1_2 .arti1 ul > li:nth-child(3) .tbx:after{background: #827179; content:'03'}
.sub_1_2 .arti1 ul > li:nth-child(4) .tbx:after{background: #798271; content:'04'}
.sub_1_2 .arti1 ul > li:nth-child(5) .tbx:after{background: #717382; content:'05'}



/* s31 */
.sub_3_1 .arti1{margin-top: 100px;}
.sub_3_1 .arti1 .root_daum_roughmap{width: 100%; border-radius: 20px; overflow: hidden; border: 1px solid #ddd;}
.sub_3_1 .arti1 .root_daum_roughmap .wrap_controllers{display: none;}
.sub_3_1 .arti1 .root_daum_roughmap .wrap_map{height: 450px !important;}
.sub_3_1 .arti2 {display: flex; flex-wrap:wrap; justify-content: space-between; margin-top: 47px;}
.sub_3_1 .arti2 .box{}
.sub_3_1 .arti2 .box1{}
.sub_3_1 .arti2 .box1 ul > li{position: relative; font-size: 20px; line-height: 40px; color: #666; letter-spacing: -0.03em; display: flex;}
.sub_3_1 .arti2 .box1 ul > li span{color: #000; font-weight: 500; width: 90px;}
.sub_3_1 .arti2 .box1 ul > li p{width: calc(100% - 90px);}

.sub_3_1 .arti2 .box2{position: relative; display: flex; flex-wrap:wrap; align-items:center; margin-right: auto; margin-left: 58px; padding-left: 60px;}
.sub_3_1 .arti2 .box2:before{position: absolute; content: ''; width: 1px; height: calc(100% - 22px); background: #ddd; left: 0; top: 11px;}
.sub_3_1 .arti2 .box2 .tbx{padding-left: 20px; padding-top: 4px;}
.sub_3_1 .arti2 .box2 .tbx p{font-size: 28px; line-height: 1; color: #718082; letter-spacing: -0.03em; color: #718082; font-weight: 700;}
.sub_3_1 .arti2 .box2 .tbx p span{display: flex; font-size: 18px; line-height: 1.5; color: #666; letter-spacing: -0.03em; font-weight: 400; margin-top: 13px;}
.sub_3_1 .arti2 .box2 .tbx p span:before{content: '·'; width: 12px;}
.sub_3_1 .arti2 .box3 ol{display: flex; margin-top: 12px;}
.sub_3_1 .arti2 .box3 ol > li > a{position: relative; width: 65px; height: 61px; border: 1px solid #ddd; transition:.3s;}
.sub_3_1 .arti2 .box3 ol > li:first-child  > a:hover{background: #827f71; border: 1px solid #827f71;}
.sub_3_1 .arti2 .box3 ol > li:last-child  > a:hover{background: #718082; border: 1px solid #718082; border-left: 0;}
.sub_3_1 .arti2 .box3 ol > li:first-child > a{border-radius: 50px 0 0 50px;}
.sub_3_1 .arti2 .box3 ol > li:last-child > a{border-left: 0; border-radius: 0 50px 50px 0;}
.sub_3_1 .arti2 .box3 ol > li > a:before,
.sub_3_1 .arti2 .box3 ol > li > a:after{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/s31_icon1.png) center no-repeat; left: 0; top: 0; transition:.3s;}
.sub_3_1 .arti2 .box3 ol > li > a:after{background: url(../img/sub/s31_icon1_h.png) center no-repeat; opacity: 0; }
.sub_3_1 .arti2 .box3 ol > li:last-child > a:before{background: url(../img/sub/s31_icon2.png) center no-repeat;}
.sub_3_1 .arti2 .box3 ol > li:last-child > a:after{background: url(../img/sub/s31_icon2_h.png) center no-repeat;}
.sub_3_1 .arti2 .box3 ol > li:hover > a:before{opacity: 0;}
.sub_3_1 .arti2 .box3 ol > li:hover > a:after{opacity: 1;}

/* s41 */
.sub_4_1 .arti1{text-align: center;}
.sub_4_1 .arti1 small{display: block; font-size: 20px; line-height: 1; color: #103554; font-weight: 500; letter-spacing: 0; }
.sub_4_1 .arti1 h4{font-size: 48px; line-height: 70px; letter-spacing: 0; color: #111; margin: 32px 0 86px; font-weight: 500;}
.sub_4_1 .arti2 {margin-top: 150px;}
.sub_4_1 .arti2 ul{display: flex; flex-wrap:wrap; gap:60px;}
.sub_4_1 .arti2 ul > li{position: relative; flex: 1 1 25%; border-radius: 20px; overflow: hidden; padding: 50px 20px 0 50px; height: 310px; box-sizing: border-box;}
.sub_4_1 .arti2 ul > li > figure{position: absolute; top: 35px; right: 48px; z-index: 15;}
.sub_4_1 .arti2 ul > li:nth-child(3) > figure{top: 42px;}
.sub_4_1 .arti2 ul > li:nth-child(4) > figure{top: 45px;}
.sub_4_1 .arti2 ul > li:nth-child(5) > figure{top: 45px;}
.sub_4_1 .arti2 ul > li:nth-child(6) > figure{top:43px;}
.sub_4_1 .arti2 ul > li > figure img{position: relative; transition:.6s;}
.sub_4_1 .arti2 ul > li > figure img:last-child{position: absolute; left: 0; top: 0; opacity: 0;}
.sub_4_1 .arti2 ul > li:hover > figure img{opacity: 0;}
.sub_4_1 .arti2 ul > li:hover > figure img:last-child{opacity: 1;}
.sub_4_1 .arti2 ul > li > .hov{position: absolute; display: block; width: 163px; height: 164px; border-radius: 50%; background: #827f71; text-align: center; left: 50%; bottom: -140px; translate:-50% 0; z-index: 12; transition:.6s;}
.sub_4_1 .arti2 ul > li:nth-child(3) > .hov{background: #718082;}
.sub_4_1 .arti2 ul > li:nth-child(4) > .hov{background: #827179;}
.sub_4_1 .arti2 ul > li:nth-child(5) > .hov{background: #798271;}
.sub_4_1 .arti2 ul > li:nth-child(6) > .hov{background: #717382;}
.sub_4_1 .arti2 ul > li > .hov:after{position: absolute; content: ''; width: 100%; height: 100%; border-radius: 50%; left: 0; top: 0;  background: #827f71; left: 0; bottom: 0; z-index: -2; transition:.8s; opacity: 0;}
.sub_4_1 .arti2 ul > li:nth-child(3) > .hov:after{background: #718082;}
.sub_4_1 .arti2 ul > li:nth-child(4) > .hov:after{background: #827179;}
.sub_4_1 .arti2 ul > li:nth-child(5) > .hov:after{background: #798271;}
.sub_4_1 .arti2 ul > li:nth-child(6) > .hov:after{background: #717382;}
.sub_4_1 .arti2 ul > li:hover > .hov:after{scale:10; opacity: 1;}
.sub_4_1 .arti2 ul > li > .hov span{display: inline-block; font-family: "Poppins", sans-serif; font-size: 16px; line-height: 1.5; color: #fff; letter-spacing: -0.02em; font-weight: 600; padding-top: 0px; transition:.6s}
.sub_4_1 .arti2 ul > li:hover > .hov span{color: #827f71;}
.sub_4_1 .arti2 ul > li:nth-child(3):hover > .hov span{color: #718082;}
.sub_4_1 .arti2 ul > li:nth-child(4):hover > .hov span{color: #827179;}
.sub_4_1 .arti2 ul > li:nth-child(5):hover > .hov span{color: #798271;}
.sub_4_1 .arti2 ul > li:nth-child(6):hover > .hov span{color: #717382;}
.sub_4_1 .arti2 ul > li > .hov span:before{position: absolute; content: '';	width: 100%; height: 100%; background: #fff; border-radius: 50%; left: 0; top: 0; opacity: 0; transition:.6s; z-index: -1;}
.sub_4_1 .arti2 ul > li:hover > .hov span:before{opacity: 1; }
.sub_4_1 .arti2 ul > li.first{display: flex; align-items:center; background: url(../img/sub/s41_2.jpg) center / cover no-repeat; justify-content: center; text-align: center; padding: 0;}
.sub_4_1 .arti2 ul > li.first img{margin-bottom: 39px;}
.sub_4_1 .arti2 ul > li.first p{font-size: 20px; line-height: 1; color: #fff; letter-spacing: -0.02em; font-weight: 600; }
.sub_4_1 .arti2 ul > li:not(.first) {border: 1px solid #ddd}

.sub_4_1 .arti2 ul > li:not(.first) .tbx{position: relative; z-index: 19;}
.sub_4_1 .arti2 ul > li:not(.first) .tbx h5{font-size: 32px; line-height: 1.5; color: #111; letter-spacing: -0.02em; font-weight: 500; margin-bottom: 34px; transition:.6s;}
.sub_4_1 .arti2 ul > li:not(.first) .tbx p {font-size: 18px; line-height: 38px; color: #999; letter-spacing: -0.02em; transition:.6s;}
.sub_4_1 .arti2 ul > li:not(.first) .tbx p b{font-size: 20px; line-height: 40px; display: block; color: #666; font-weight: 400; transition:.6s;}
.sub_4_1 .arti2 ul > li:not(.first):hover .tbx > *,
.sub_4_1 .arti2 ul > li:not(.first):hover .tbx > * b{color: #fff !important;}
.sub_4_1 .arti2 ul > li:not(.first) .tbx a{display: inline-block; font-size: 18px; line-height: 1; color: #111; letter-spacing: -0.02em; font-weight: 500; margin-top: 22px; transition:.6s;}
.sub_4_1 .arti2 ul > li:not(.first) .tbx a i{position: relative; display: inline-block; vertical-align: middle; margin-left: 15px;}
.sub_4_1 .arti2 ul > li:not(.first) .tbx a i img{transition:.3s; left: 0; top: 0; position: relative;}
.sub_4_1 .arti2 ul > li:not(.first) .tbx a i img:nth-child(2){position: absolute; left: 0; top: 0;	opacity: 0;}
.sub_4_1 .arti2 ul > li:not(.first):hover {border-bottom: 1px solid #fff;}
.sub_4_1 .arti2 ul > li:not(.first):hover .tbx a i img{opacity: 0;}
.sub_4_1 .arti2 ul > li:not(.first):hover .tbx a i img:nth-child(2){opacity: 1;}
.sub_4_1 .arti2 ul > li:not(.first) .tbx a:hover i img{translate:5px -5px}

/* s42 */
.sub_4_2 .arti1{position: relative; text-align: center; padding-top: 76px; }
.sub_4_2 .arti1 .line:after{position: absolute; content: ''; width: 100%; height: 1px; background: #ddd; left:0%; top: 76px; }
.sub_4_2 .arti1 .line span{position: absolute; width: 9px; height: 9px; display: block; background: #798271; left: -4px; top: 72px; border-radius: 50%; z-index: 1;}
.sub_4_2 .arti1 .line span:last-child{background: #827179; left: auto; right: -4px; }
.sub_4_2 .arti1 > .box {position: relative; width: 510px; height: 255px; overflow: hidden; margin: 0 auto; font-size: 38px; line-height: 1; color: #000; letter-spacing: -0.02em; font-weight: 600; background: #fff; }
.sub_4_2 .arti1 > .box p{margin-top: 20px;}
.sub_4_2 .arti1 > .box:after{position: absolute; content: ''; width: 100%; height: 510px; border-radius: 50%;  border: 45px solid #f5f5f5; left: 0; bottom: 17px;}
.sub_4_2 .arti1 > .flex_box{display: flex; flex-wrap:wrap; justify-content: space-between; margin-top: -336px; padding: 0 150px;} 
.sub_4_2 .arti1 > .flex_box .box:last-child{width: 100%; padding-top: 100px;} 
.sub_4_2 .arti1 > .flex_box .box:last-child:before{position: absolute; content: ''; width: 1px; height: 145px; background: #ddd; left: 50%; top: -45px;}
.sub_4_2 .arti1 > .flex_box .box:last-child:after{position: absolute; content: '';}
.sub_4_2 .arti1 > .flex_box .box{position: relative;}
.sub_4_2 .arti1 > .flex_box .box .tbx strong{display: block; font-size: 32px; line-height: 1; color: #111; letter-spacing: -0.02em; font-weight: 500; margin: 30px 0 14px;}
.sub_4_2 .arti1 > .flex_box .box .tbx p{font-size: 20px; line-height: 40px; color: #666; letter-spacing: -0.02em; }

/* s43 */
.sub_4_3 .arti1 figure{margin-top: 90px;}
.sub_4_3 .arti2{margin-top: 188px;}
.sub_4_3 .arti2 .cnt_box > ul{display: flex; flex-wrap:wrap; background: #f2f2f2; border-radius: 20px; padding: 50px 0 60px; margin-top: 90px;}
.sub_4_3 .arti2 .cnt_box > ul > li{flex:1; padding: 0 55px; border-right: 1px solid #ddd;}
.sub_4_3 .arti2 .cnt_box > ul > li:last-child{border-right: 0;}
.sub_4_3 .arti2 .cnt_box > ul > li h4{font-size: 32px; line-height: 1; color: #718082; letter-spacing: -0.02em !important; font-weight: 400; margin-bottom: 18px;}
.sub_4_3 .arti2 .cnt_box > ul > li h4 strong{font-weight: 500; font-size: 70px;}
.sub_4_3 .arti2 .cnt_box > ul > li p{font-size: 20px; line-height: 1; color: #666; letter-spacing: 0; margin-left: 4px;}
.sub_4_3 .arti2 .cnt_box > ul > li figure{text-align: right; margin-top: 36px; margin-right: -3px;}










