
/*font*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;200;300;400;500;600;700;800;900&display=swap');
 
/*color*/
:root{
    --main-color:#2C4363;
}

/*reset*/
    *{margin:0;padding:0;box-sizing:border-box}
    li{list-style:none}
    img{border:0;max-width:100%}
    html{font-size:16px}
    body, td, p, input, button, textarea, select,a{font-family:'Noto Sans KR',sans-serif;color:var(--main-color)}
    p{line-height:1.6}
    h1,h2,h3,h4,h5,h6,strong,th,b,dt,em{font-weight:600}
    em,i{font-style:normal}
    a,a:hover,a:active,a:focus{text-decoration:none}
    



/*pc*/

@media all and (min-width:1024px) {	
    .mo{display:none}   
	.container{position:relative;max-width:1250px;margin:0 auto}

	/*header*/
	#header{position:relative;z-index:100}
    #header .container{display:flex;justify-content:space-between;max-width:unset;padding:0 5%}
	.hsec1{height:100px;background:#fff;box-shadow:0 5px 10px rgba(0,0,0,0.1)}
	.hsec1 h1{float:left} 
    .hsec1 h1 a{display:flex;align-items:center;height:100px}
    .hsec1 h1 img{max-height:60px}
    
    .lnb{}
	.lnb .close{display:none}
	.lnb .lnb_d1{display:flex;position:relative;z-index:10}
	.lnb .lnb_d1 li{position:relative}	
    .lnb .lnb_d1 a{white-space:nowrap}
    .lnb .lnb_d1 li.be > a:after{display:inline-block;content:'+';margin-left:5px;font-weight:200;}
	.lnb .lnb_d1 > li > a{display:block;height:100px;line-height:100px;font-size:16px;color:var(--main-color);padding:0 25px;font-weight:500}
	.lnb .lnb_d1 > li > a:hover{color:#000}
	.lnb .lnb_d1 > li:hover > a{color:#000}
    .lnb .lnb_d1 > li:hover > ul{visibility: visible;opacity:1;transition:0.3s}
    
    .lnb .lnb_d1 ul{padding:10px 0 15px}
    .lnb .lnb_d1 ul:after{display:block;content:'';position:absolute;left:0;bottom:0;width:100%;height:8px;background:var(--main-color);border-radius:0 0 10px 0;overflow:hidden}
    
    .lnb .lnb_d2{visibility:hidden;opacity:0;position:absolute;left:0;top:95px;min-width:180px;width:100%;background:#fff;border-radius:10px 0 10px 0;box-shadow:0 0 5px rgba(0,0,0,0.1)}
	.lnb .lnb_d2 > li > a{display:block;line-height:40px;font-size:15px;padding:0 20px}
    .lnb .lnb_d2 > li.be > a:after{float:right}
	.lnb .lnb_d2 > li > a:hover{background:var(--main-color);color:#fff}
    .lnb .lnb_d2 > li:hover > a{background:var(--main-color);color:#fff}
    .lnb .lnb_d2 > li:hover > ul{visibility: visible;opacity:1;transition:0.3s}
    
    .lnb .lnb_d3{visibility:hidden;opacity:0;position:absolute;left:100%;top:-10px;width:200px;background:#fff;border-radius:10px 0 10px 0;box-shadow:0 0 5px rgba(0,0,0,0.1)}
    .lnb .lnb_d3 > li > a{display:block;line-height:40px;font-size:15px;padding:0 20px}
	.lnb .lnb_d3 > li > a:hover{background:var(--main-color);color:#fff}
    
    
		
	/*main*/
     #main{}   
    
    /*swiper*/
    .swiper-pagination-bullets{bottom:30px !important}
    .swiper-pagination-bullet{margin:0 10px !important;width:10px;height:10px;opacity:1;border:1px solid var(--main-color);background:none}
    .swiper-pagination-bullet-active{background:var(--main-color)}

    .swiper-button-next:after,
	.swiper-button-prev:after{display:none}    
    .swiper-button-next{width:60px;height:60px;background:url('../images/swiper_next.png') no-repeat center}
    .swiper-button-prev{width:60px;height:60px;background:url('../images/swiper_prev.png') no-repeat center}
    
    
	/*footer*/
    #footer{border-top:0}   
    .fsec1{padding:30px 0;text-align:center;background:#31343c;color:#fff}
    .fsec1 .companyG .name{font-size:15px}
    .fsec1 .companyG .info{font-size:12px;font-weight:300;margin:5px 0 20px 0;line-height:2}
    .fsec1 .companyG .copyright{font-size:14px}

}


/*tablet*/
@media all and (max-width:1580px) and (min-width:1301px) {
    #header .container{padding:0 3%}
 	.lnb .lnb_d1 > li > a{padding:0 15px}	
    .lnb .lnb_d1 > li:last-child > ul{left:auto;right:0}
    
}
@media all and (max-width:1300px) and (min-width:1024px) {
    #header .container{padding:0 3%}
 	.lnb .lnb_d1 > li > a{padding:0 10px}	
    .lnb .lnb_d1 > li.be > a:after{display:none}
    .lnb .lnb_d1 > li:last-child > ul{left:auto;right:0}
}


/*mobile*/
@media all and (max-width:1023px) {
    html{font-size:12px}
    
    .pc{display:none}
    .container{position:relative;margin:0 auto;padding:0 5%}
	
	/*header*/
	#header{position:fixed;left:0;top:0;width:100%;z-index:100}    
	.hsec1{height:60px;background:#fff;box-shadow:0 5px 5px rgba(0,0,0,0.1)}
    .hsec1 .container{display:flex;align-items:center;position:static;padding:0;height:100%}
	.hsec1 h1{} 
    .hsec1 h1 img{height:40px;vertical-align:top}   
	
	
	
	.lnb{position:fixed;width:65%;left:-65%;top:0;z-index:90;height:100%;background:#fff;transition:.3s;overflow:auto;padding:60px 0}
	.lnb.on {left:0;transition:.3s}
	.lnb .close{position:absolute;right:0;top:0;width:45px;height:45px;cursor:pointer}
    .lnb .close:before{display:block;content:'';position:absolute;width:26px;height:2px;left:50%;top:50%;background:#000;transform:translate(-50%,-50%) rotate(45deg)}
    .lnb .close:after{display:block;content:'';position:absolute;width:26px;height:2px;left:50%;top:50%;background:#000;transform:translate(-50%,-50%) rotate(-45deg)}
	.lnb .lnb_d1{clear:both}
	.lnb .lnb_d1 > li{border-bottom:1px solid #ddd}
	.lnb .lnb_d1 > li > a{display:block;height:45px;line-height:45px;font-size:15px;padding-left:20px}
    .lnb .lnb_d1 > li.on > a{color:#fff}
	.lnb .lnb_d1 > li.be > a{background:url('../images/ico_plus.png') no-repeat 95% center}
	.lnb .lnb_d1 > li.be.on > a{background:url('../images/ico_minus.png') no-repeat 95% center var(--main-color)}
    
	.lnb .lnb_d2{display:none;background:#f5f5f5}
	.lnb .lnb_d2{padding:10px 0}    
	.lnb .lnb_d2 > li > a{display:block;line-height:30px;font-size:14px;padding-left:30px}
    .lnb .lnb_d2 > li.be > a{background:url('../images/ico_plus.png') no-repeat 95% center}
    .lnb .lnb_d2 > li.on > a{color:var(--main-color);font-weight:600;color:var(--main-color)}
    
    .lnb .lnb_d3{display:none;background:#f5f5f5}
	.lnb .lnb_d3{padding:10px 0}    
	.lnb .lnb_d3 > li > a{display:block;line-height:28px;font-size:14px;padding-left:40px}

	.body_bg.on{position:fixed;left:0;top:0;width:100%;height:100%;background:#000;opacity:0.6;z-index:80}
    
    .hsec1 .lnb_open{position:absolute;right:0;top:0}
    .hsec1 .lnb_open img{height:60px;vertical-align:top}
    
    
    
    /*main*/
    #main{padding:60px 0 0}
    
    
    /*swiper*/
    .swiper-pagination-bullets{bottom:20px !important}
    .swiper-pagination-bullet{margin:0 6px !important;width:8px;height:8px;opacity:1;border:1px solid var(--main-color);background:none}
    .swiper-pagination-bullet-active{background:var(--main-color)}

	.swiper-button-next:after,
	.swiper-button-prev:after{display:none}    
    .swiper-button-next{display:none;width:60px;height:60px;background:url('../images/swiper_next.png') no-repeat center}
    .swiper-button-prev{display:none;width:60px;height:60px;background:url('../images/swiper_prev.png') no-repeat center}
    
    
	
	/*footer*/
    #footer{border-top:1px solid #fff}   
    .fsec1{padding:30px 0;text-align:center;background:var(--main-color);color:#fff}
    .fsec1 .companyG .name{font-size:14px}
    .fsec1 .companyG .info{font-size:11px;font-weight:300;margin:15px 0;line-height:1.6}
    .fsec1 .companyG .copyright{font-size:11px}

}
