@charset "utf-8";

.sub-visual{position: relative; height: 650px;}
.sub-visual > img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit:cover;}
.sub-visual > p{position: relative; z-index: 10; width: 100%; height: 100%; display: flex;align-items:center; justify-content: center; text-align: center; font-family: 'GMarketSans'; font-size: 68px; line-height: 1; letter-spacing: -0.04em; color: #fff; font-weight: 500; padding-top: 50px;}
.lnb{margin-top: -80px; position: relative; z-index: 100; margin-bottom: 140px;} 
.lnb .dep3{display: none;}
.lnb > ul{display: flex; border-radius: 20px 20px 0 0; overflow: hidden;} 
.lnb > ul > li{flex:1; position: relative; }
.lnb > ul > li:not(:last-child):after{position: absolute; content: ''; width: 1px; height: 20px; background: #cacaca; right: 0; top: 50%; margin-top: -10px;}	
.lnb > ul > li.current:after{display: none;}
.lnb > ul > li:hover:after{display: none;}
.lnb > ul > li > a{position: relative; display: flex; align-items:center; justify-content: center; height: 80px; background: #f4f2f1; font-size: 20px; line-height: 1.5; letter-spacing: -0.03em; font-weight: 500; transition:.3s;}
.lnb > ul > li > a b{font-weight: 500; display: inline-block; margin-right: 5px;}
.lnb > ul > li:hover > a,
.lnb > ul > li.current > a{background: #114e4e; color: #fff;}
.sub-tit h3{position: relative; text-align: center; font-size: 62px; line-height: 1; letter-spacing: -0.04em; color: #111; font-weight: 700; padding-top: 38px;}
.sub-tit h3 b{font-weight: 700;}
.sub-tit h3:before{position: absolute; content: ''; width: 40px; height: 12px; background: #dadada; border-radius: 20px;	left: calc(50% - 12px); top: 0; }
.sub-tit h3:after{position: absolute; content: ''; width: 12px; height: 12px; box-sizing: border-box; border-radius: 50%; border: 4px solid #114e4e; left: calc(50% - 28px); top: 0;}
.sub-tit p{text-align: center; font-size: 22px; line-height: 38px; letter-spacing: -0.03em; color: #666; margin-top: 27px;}
.dep3-wrap{margin-top: 81px; margin-bottom: 80px;}
.dep3-wrap > ul{display: flex; gap:12px;}
.dep3-wrap > ul > li{flex:1;}
.dep3-wrap > ul > li > a{display: flex; align-items:center; justify-content: center; height: 64px; box-sizing: border-box; border: 1px solid #ddd; border-radius: 10px; font-size: 18px; letter-spacing: -0.02em; color: #666; transition:.3s;}
.dep3-wrap > ul > li.current > a,
.dep3-wrap > ul > li:hover > a{background: rgba(17,78,78,0.07); color: #114e4e; font-weight: 700; border: 1px solid #588383;}

/* 공통 */
.s1-block1{display: flex; flex-wrap:wrap;gap:20px}
.s1-block1 > .box{position: relative; background: #f8f8f8; border-radius: 10px;	 padding: 40px 45px; display: flex; flex-direction: column; flex:1 1 40%; height: 260px;}
.s1-block1 > .box .tbx{display: flex; flex-direction: column; gap:5px; padding-right: 60px;} 
.s1-block1 > .box .tbx b{font-size: 30px; line-height: 1.5; letter-spacing: -0.03em; color: #111; font-weight: 600;}
.s1-block1 > .box .tbx p{font-size: 16px; line-height: 1.5; letter-spacing: -0.03em; color: #666;} 
.s1-block1 > .box i{position: absolute; right: 40px; bottom: 40px;	display: flex; width: 70px; height: 70px; align-items: center; justify-content: center; margin-left: auto;}
.s1-block1 > .last{background: url(../img/sub/s12-1-bg.jpg) center / cover no-repeat; padding: 0; display: flex; align-items:center; justify-content: center; }
.s1-block1 > .last i{position: static; width: auto; height: auto; margin-left: 0px;}
.s1-block2 iframe{max-width:1020px; height: 575px; width: 100%; margin: 0 auto; border-radius:20px;}
.product-arti1{margin-top: 90px; display: flex; flex-direction: column; gap:100px;}
.product-arti1 .flex{display: flex; flex-wrap:wrap; align-items:center; gap:120px;}
.product-arti1 .flex > *{flex: 1 1 30%; box-sizing: border-box;}
.product-arti1 .flex > .lbx{padding-left: 80px;}
.product-arti1 .flex > .lbx .tbx{display: flex; flex-direction: column; 	}
.product-arti1 .flex > .lbx .tbx small{position: relative; font-size: 22px; line-height: 1; letter-spacing: -0.03em; color: #114e4e; font-weight: 700; padding-bottom: 38px; margin-bottom: 31px;}
.product-arti1 .flex > .lbx .tbx small:before{position: absolute; content: ''; width: 26px; height: 1px; background: #114e4e; left: 0; bottom: 0;}
.product-arti1 .flex > .lbx .tbx b{font-size: 50px; line-height: 64px; letter-spacing: -0.03em; color: #111; font-weight: 600; }
.product-arti1 .flex > .lbx .tbx p{font-size: 20px; line-height: 32px; letter-spacing: -0.03em; color: #666; margin-top: 15px;}
.product-arti1 .flex > .rbx figure{width: 100%; height: 480px; border-radius: 20px; background: #f8f8f8; display: flex; align-items:Center; justify-content: center;}
.product-arti1 .flex:nth-child(even){flex-direction: row-reverse;}
.product-arti1 .flex:nth-child(even) > .lbx{padding-left: 50px;}
.product-arti2{background: #f8f8f8; padding: 160px 0 180px; margin-top: 180px;}
.product-arti2 ul{display: flex; flex-wrap:wrap; gap:20px; justify-content: center;}
.product-arti2 ul > li{flex:1; max-width:272px;}
.product-arti2 ul > li > a{border-radius: 10px; padding: 23px 19px 19px; background: #fff; border: 1px solid #fff; transition:.3s;}  
.product-arti2 ul > li > a figure{overflow: hidden; }
.product-arti2 ul > li > a .tbx{display: flex; height: 50px; background: #d0d0d0; border-radius: 5px; justify-content: space-between; align-items:center; padding: 0 30px 0 27px; margin-top: 8px; transition:.3s;}
.product-arti2 ul > li > a .tbx p{font-size: 16px; line-height: 1.5; letter-spacing: 0; font-weight: 600; color: #fff;}
.product-arti2 ul > li > a .tbx i{line-height: 0;}
.product-arti2 ul > li > a:hover{border: 1px solid #114e4e;
	.tbx{background: #114e4e;}
}

/* s11 공통 */
.s11 .arti2{background: #f8f8f8; padding: 160px 0 180px; margin-top: 180px;}
.s11 .arti2 .wrap2{display: flex; gap:120px;}
.s11 .arti2 .wrap2 > *{flex:1 1 40%;}
.s11 .arti2 .wrap2 > .lbx figure{display: flex; justify-content: center; align-items: center; background: #fff; border-radius: 20px; height: 840px;}
.s11 .arti2 .wrap2 > .rbx{padding-top: 10px;}
.s11 .arti2 .wrap2 > .rbx small{display: block; font-size: 22px; line-height: 1; letter-spacing: -0.03em; color: #114e4e; font-weight: 600;}
.s11 .arti2 .wrap2 > .rbx h4{font-size: 56px; line-height: 1; letter-spacing: -0.03em; color: #111; font-weight: 600; margin: 10px 0 32px;}
.s11 .arti2 .wrap2 > .rbx ul{border: 1px solid #ddd; border-radius: 20px; overflow: hidden; margin-bottom: 30px;}
.s11 .arti2 .wrap2 > .rbx ul > li{display: flex;  align-items: stretch; height: 61px; }
.s11 .arti2 .wrap2 > .rbx ul > li span{display: flex;align-items:center; justify-content: center;  width: 142px; background: #114e4e; font-size: 15px; line-height: 1.5; letter-spacing: -0.03em; color: #fff; font-weight: 500; border-bottom: 1px solid rgba(255,255,255,0.2);}
.s11 .arti2 .wrap2 > .rbx ul > li p{display: flex;align-items:center;    flex:1; font-size: 15px; line-height: 1.5; letter-spacing: -0.03em; color: #666; border-bottom: 1px solid #dddddd; padding: 0 20px;}
.s11 .arti2 .wrap2 > .rbx ul > li:last-child > *{border-bottom: none;}
.s11 .arti3{background: url(../img/sub/s11-bottom-bg.jpg) center bottom no-repeat; padding: 160px 0 180px; text-align: center;}

/* s12 */
.s12 .arti1{margin-top: 95px;}
.s2{margin-bottom: 180px;}

/* s31 */
.s31{margin-bottom: 180px;}
.s31 .arti1{margin-top: 90px;}
.s31 .arti1 iframe{width: 100%; height: 460px; border-radius: 20px;}
.s31 .arti2{display: flex; justify-content: space-between; margin-top: 20px;}
.s31 .arti2 ul > li{display: flex; font-size: 22px; line-height: 42px; letter-spacing: -0.03em; color: #666;}
.s31 .arti2 ul > li span{color: #111; font-weight: 600; width: 130px; box-sizing: border-box; padding-left: 10px;}
.s31 .arti2 ul > li p{flex:1; }
.s31 .arti2 ol{display: flex; gap:10px; padding-top: 12px;}
.s31 .arti2 ol > li > a{display: flex; align-items:center; justify-content: center; gap:40px; width: 160px; height: 55px; border-radius: 10px; font-family: "Wanted Sans"; font-size: 18px; line-height: 1; letter-spacing: -0.03em;	color: #fff; background: #111; transition:.3s;}
.s31 .arti2 ol > li:hover > a{opacity: 0.8;}
.s31 .arti2 ol > li:nth-child(2) > a{background: #114e4e;}
.s31 .arti2 ol > li > a i{line-height: 0;}

/* s41 */
.s41 .arti1{text-align: center; display: flex; flex-direction: column; margin-top: 75px;}
.s41 .arti1 b{font-size: 36px; line-height: 1.5; letter-spacing: -0.03em; font-weight: 600; color: #114e4e; font-weight: 600; margin-bottom: 25px;}
.s41 .arti1 .p-box {display: flex; flex-direction: column; gap:32px}
.s41 .arti1 .p-box p{font-size: 20px; line-height: 32px; letter-spacing: -0.03em; 	color: #666;	}
.s41 .arti1 .sign{display: flex;justify-content: center; align-items: flex-end; margin-top: 50px;}
.s41 .arti1 .sign p{font-size: 28px; line-height: 1; letter-spacing: -0.03em; color: #333; font-weight: 600; margin-right: 18px;}
.s41 .arti1 .sign p b{font-size: 22px; font-weight: 700; color: #999; margin-right: 9px;}
.s41 .arti1 .sign i{position: relative; top: -7px;}
.s41 .arti2{width: 100%; height: 540px; background: url(../img/sub/s41-2.jpg) center / cover no-repeat; margin-top: 105px;}

/* s42 */
.s42 .arti1 { margin-top: 80px;}
.s42 .arti1 .lbx{position: sticky; top: 100px; width: 50.48%; box-sizing: border-box; text-align: right; padding-right: 111px;; padding-bottom: 100px;}
.s42 .arti1 .lbx .tbx{display: flex; flex-direction: column; }
.s42 .arti1 .lbx .tbx small{font-family: 'GMarketSans'; font-size: 30px; line-height: 1.5; letter-spacing: -0.03em; color: #114e4e; font-weight: 600; margin-bottom: 19px;}
.s42 .arti1 .lbx .tbx big{font-family: 'GMarketSans'; font-size: 100px; line-height: 1; color: #ebebeb; font-weight: 700; margin-bottom: 42px; letter-spacing: -0.03em;}
.s42 .arti1 .rbx {position: relative;  box-sizing: border-box; display: flex; flex-direction: column; margin-left: 50.48%; padding-left: 132px; width: 49.52%; margin-top: -606px;}
.s42 .arti1 .rbx:before{position: absolute; content: ''; width: 1px; height: calc(100% - 16px); background: #114e4e; left: 0; top: 16px;}
.s42 .arti1 .rbx .box{padding-bottom: 86px;}
.s42 .arti1 .rbx .box:last-child{padding-bottom: 170px;}
.s42 .arti1 .rbx .box b{display: block; font-size: 46px; line-height: 1; letter-spacing: -0.03em; color: #114e4e; font-weight: 700; margin-bottom: 35px; position: relative; }
.s42 .arti1 .rbx .box b:after{position: absolute; content: ''; width: 18px; height: 18px; background: url(../img/sub/his-dot.jpg) center no-repeat; left: -141px; top: 16px;}
.s42 .arti1 .rbx .box ul > li{position: relative; font-size: 18px; line-height: 32px; letter-spacing: -0.03em; color: #666; padding-left: 8px;}
.s42 .arti1 .rbx .box ul > li:before{position: absolute; content: '·'; left: 0; top: 0;}



.bo-wrap{margin-top: 90px; margin-bottom: 180px;}