@charset "utf-8";

@font-face {
  font-family: 'FontAwesome';
  src: url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0');
  src: url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

.sub_wrap{
	width:98%;
	margin:0 auto;
	padding:0px;
	max-width:1500px;

}

.sub_wrap_wide{
	width:100%;
	margin:0 auto;
	padding:0px;
 

}

.mobileon{display:none;}
.mobiletit {display:none;}

 
 /*////////////////////////////////////////////////////////////////////sub 공통/////////////////////////////////////////////////*/



.mbA{margin-bottom:50px;}

h2{
	color:#fff;
	font-size:60px;
	font-weight:700; 
	line-height:1;
	letter-spacing:-2px; 
	display:block;
	text-align:left;
 	
}

h3{
	color:#333;
	 
	font-size:45px;
	padding:0px 0 0px 0;
	margin-bottom:0px;
	margin-top:0px;
	font-weight:600;
	line-height:1.2;
	letter-spacing:-2px;
	z-index:1;
	position:relative;

}
h3.title {text-align:center;padding-bottom:10px; padding-top:20px; }
h3.title span{display:block;font-size:70%;} 

  
h4{
 	letter-spacing:-1px; 
	font-size:30px;
	line-height:1.3;
	font-weight:600;
	margin-bottom:10px;
	position:relative;

}
h4.title:after{
		 display:inline-block;
		 content:'';
		 position:relative;
		 width:140px;
		 height:7px;
		 margin-left:5px;
		 background: url(../image/bar.png) no-repeat center 0;
		 
	  
	}
 
h4.title span{font-size:70%;vertical-align:middle;}
 h4 strong{
	
	font-size:130%;
	font-weight:800;
 }

 
h5{
	 
	font-size:22px;
	line-height:1.3;
	padding-left:0px;
	margin-bottom:10px;
	margin-top:0;
	font-weight:500;


}
h5.title { color:var(--t_majorcolorPurple);padding-left:30px;}
h5.titleB {font-size:300%;color:#21698d;letter-spacing:-1px;}
h5 span{
	display:block;
	color:#ff0000;

}
 
.headtxtA{font-size:48px;line-height:1.1;font-weight:600; }
.headtxtB{font-size:35px;line-height:1.3;font-weight:500; }
.headtxtBB{font-size:30px;line-height:1.3;font-weight:500; }

.headtxtB strong{font-weight:700;}

.headtxtC{font-size:28px;line-height:1.5; }
.headtxtCC{font-size:25px;line-height:1.5; }
.headtxtD{font-size:20px;line-height:1.5;font-weight:500;}
.headtxtDD{font-size:18px;line-height:1.3;font-weight:500;}

.titltT{display:block;font-size:35px;line-height:1.3;font-weight:900; margin-bottom:20px;}
   
.center{text-align:center;}
.right{text-align:right;}
.left{text-align:left;}

.not_tA{font-size:80%; opacity:.8;}
.mLA{margin-left:30px;}

ul.ulli {padding-left:10px;margin-left:0;}
ul.ulli > li{
	 position:relative;
	padding-left:35px;
	padding-bottom:0px;
	line-height:1.5;
	margin-bottom:5px;
}
ul.ulli > li:before{
	position:absolute;
	display:block;
	content:'';
	width:4px;
	height:4px;
	top:13px;
	left:13px;
	background:#555;
}
ul.ulli.ulliA > li:before{
	top:20px;

 }

 ul.ulli > li span{
	font-size:90%;
	opacity:.8;
 }
@media all and  (max-width:800px){
	ul.ulli > li:before{
		 
		top:9px;
		 
	}

	ul.ulli.ulliA > li:before{
		top:15px; 
	 }

}

@media all and  (max-width:640px){
	 
}



ul.ulli > li strong{
	 display:block;
	 font-size:19px;
	color:#000;
}
ul.ulliB {
	margin:10px 0 10px 0px;
}
ul.ulliB >  li{
	 position:relative;
	padding-left:20px;
	padding-bottom:0px;
	 
}
ul.ulliB > li:before{
	position:absolute;
	display:block;
	content:'';
	width:0px;
	height:1px;
	top:11px;
	left:10px;
	background:#333;
}
 

ul.ulliC {
	margin:0px 0 0px 0px;
}
ul.ulliC >  li{
	 position:relative;
	padding-left:10px;
	padding-bottom:0px;
	font-size:85%;
}
ul.ulliC > li:before{
	position:absolute;
	display:block;
	content:'';
	width:5px;
	height:1px;
	top:11px;
	left:10px;
	background:none;
}
/**/
ol.olli {
	margin-left:30px;
}
ol.olli > li{
	 
	 position:relative;
	padding-left:15px;
	padding-bottom:0px;
	line-height:1.5;
	margin-bottom:5px;
}


/**/


/*layout*/
 .Toptxtbox{
	padding-top:130px;	 
	width:100%; 
	position:relative; 
	margin-bottom:30px;
	 
 }
  .Toptxtbox .subtop_loc{
	font-size:120%;
	font-weight:600;
	margin-bottom:20px;
	color: var(--t_majorcolorSkyblueB);
  }
  .Toptxtbox .subtop_majortxt span{
	display:block;

  }



#TopContainer{
	padding-top:0px;
	overflow:hidden;
	width:100%; 
	position:relative; 
	height:500px;
}


 
.Topcurtain  .curtain {
  position: absolute;
  width: calc(50% - 750px);
  height: 100%;
  top: 0;
  background-color: #fff;
  z-index:3;
}
.Topcurtain .left {
  left: 0;
}
.Topcurtain .right {
  right: 0;
}
.Topcurtain p {
  position: absolute;
  top: 60%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  padding: 0 20px;
  font-size: 2rem;
  letter-spacing: -0.02em;
  line-height: 1.375;
  font-weight: 500;
  color: #000;
  text-align: center;
  opacity: 0;
  word-break: keep-all;
  word-wrap: break-word;
}
/*.Topcurtain .topbg {
   transform: translate(-50%, 0) scale(1.3);
  z-index: 10;
}*/
 


#topfiximg{position:absolute; width:100%;height:100%;background-size:100%;}

@media all and  (max-width:1980px){
	#topfiximg{background-size:cover;}
}
.aboutus{background: url(../image/about/topimg.jpg)  no-repeat center center; }
.about_his{background: url(../image/about/topimg02.jpg)  no-repeat center center; }
.about_loc{background: url(../image/about/topimg03.jpg)  no-repeat center center; }

.business{background: url(../image/business/topimg.jpg)  no-repeat center center;}
.businessB{background: url(../image/business/topimg02.jpg)  no-repeat center center;}
.businessC{background: url(../image/business/topimg03.jpg)  no-repeat center center;}
.businessD{background: url(../image/business/topimg04.jpg)  no-repeat center center;}
.businessE{background: url(../image/business/topimg05.jpg)  no-repeat center center;}


.work{background: url(../image/work/topimg.jpg)  no-repeat center center;}
 .customer{background: url(../image/customer/topimg.jpg)  no-repeat center center;}




    
 .topTXTarea{
	margin: 0px auto 0 auto;
	position:relative;
	padding-top:200px;
	
	 
  
}
.topTXTarea h2{
	text-align:center;
	
}

.topTXTarea .top_loc{
	margin: 0px auto 0 auto;
	position:relative;
	margin-top:20px;
	text-align:center;

	
	 
}  
.topTXTarea .top_loc span{
	 position:relative;
	color:#fff;
	display:inline-block;
 	padding-left:25px;
	font-size:80%;
	opacity:.8;
}
.topTXTarea .top_loc span a{
	color:#fff;
}
 




.topTXTarea .top_loc span:after{
		display:block;
		position:absolute;
		content:'\f105';
		font-family: 'FontAwesome';
		width:20px;
		height:20x;		
		color:#fff;
		top:0;
		left:0;
	}
.topTXTarea .top_loc span.homelink:after{
		content:'';
	}
.topTXTarea .top_loc span.homelink{
		margin-left:0px;
		padding-left:0px;
	}
.topTXTarea .top_loc span a{
		display:block;
		position:relative;
		

	}
 	
 

 
/**/
 
 /*//////////sUBMENU/////////////*/ 

.submenu{
	
	position:relative;
	margin:-100px auto 0 auto;	 
	padding:0px 0;
	top:0; 
	text-align:center;
	width:100%;
	 
 	 
 }
.submenu.submenu_work{
		margin:0 auto 0 auto;	 
		text-align:left;
}



/* .submenu:before{
	content:'';
	display:block;
	position:relative;
	width:100%;
	height:1px;
	background: rgba(255,255,255,.2);
 }
*/
 .submenu .homearea{
	display:none;
	left:0;
	top:0;
	width:100px;
	height:43px; 
	vertical-align:top;
	background:#ed1f24;
	border-radius: 20px 0 0 20px;
 }
 .submenu .homearea a{
	display:block;
	width:100%;
	height:100%;
	background: url(../image/icon_home.png) no-repeat center center;
 }
 
.submenu .submenu_box{
	margin : 0 auto 0 auto; 	
	position:relative;
	padding: 0px; 
	display:inline-block; 
}
 


.submenu .submenu_box ul{
	position:relative;
	margin:0 0 0 0;
	display:inline-block;
	text-align:left;
	font-size:0;
	width:100%;
	padding:15px  ;
	border-radius:5px; 
	 
	vertical-align:top;

	 
		-webkit-backdrop-filter: blur(15px);
		backdrop-filter: blur(15px);
		background:rgba(255,255,255,.1);
			
	

	 
}
.submenu.submenu_work .submenu_box ul{
	-webkit-backdrop-filter: blur(0);
		backdrop-filter: blur(0);
}


.submenu .submenu_box ul li{
	display:inline-block;
	position:relative;
 	margin-right:0px;
	z-index:2; 
 	padding:0px 0;  
	border-left:0; 	 
	vertical-align:middle;
	text-align:left;

  
}
.submenu .submenu_box ul.colfour li{
	 
}


 
.submenu .submenu_box ul li a{
	display:block;
	position:relative;
	font-size:19px;
	letter-spacing:0px;
	display: block;
	padding:7px 30px;
	text-align:center;
	font-weight:400;
	color:#fff;
	 
	
}
.submenu.submenu_work .submenu_box ul li a{
	color:#333;
}
 .submenu .submenu_box ul li a.engfont{letter-spacing:0px;}

.submenu .submenu_box ul li a:hover{
	opacity:1;
}
 

.submenu .submenu_box ul li.subOn a{
	color:#fff;
	font-weight:500;
	background: var(--t_majorcolorSkyblueB);
	border-radius:5px; 
 
	 
	
}
/* .submenu .submenu_box ul li.subOn a:after{
	content:'';
	display:block;
	position:absolute; 
	bottom:0px;	
	left:0;
	height: 3px; 
	width: 100%; 
	background:#ff0000;


}*/

/*/////////////////*/


 
/*/////////BODY CONTNETS////////*/
  
#sub_contents{
 
	background: #fff;
	width:100%;
	color:#333;
	margin:0;
	letter-spacing:-1px;
	font-weight:500;
	padding:30px 0px 50px 0px; 
	position:relative; 
	font-size:18px; 
	line-height:1.8;
	min-height: 500px;
	z-index:1;
	

}

#sub_contents.fixed{
	padding-top:80px;
}
.graybg,
#sub_contents.graybg{
		background: #f7f7f7;
		padding-bottom:0;
}
.whitebg{
	background: #fff;
}

 
.contents_wrap{
	
}

/* 박스 테두리*/
.box_txt{
	background:#f7f7f7;
	padding:30px;
}

/**/ 

 .keyword_t{
	margin-bottom:40px;
 	letter-spacing:-2px;
}
 
.keyword_t  strong{
	 font-weight:600;
	line-height:1.3;
	color: var(--t_majorcolor);
}
.keyword_t  span{
 	display:inline-block;
}

 
/**/ 
.max_widthA{
	max-width:800px;
	margin:0 auto;
}

.max_widthB{
	max-width:1100px;
	margin:50px auto 70px auto;
}
.max_widthB .txtA{
	margin-bottom:30px;
}
.max_widthB .txtB{
	margin-bottom:30px;
}


.max_widthB span{display:inline-block;}

 


 /*#################  이미지 + 텍스트 #################*/


.txt_img_box{
	margin-top:30px;
	 
}
.txt_img_box:after{
	clear:both;
	display:block;
	content:' ';
	position:relative;
	height:30px;
	
}
.txt_img_box .imgarea{
	width:50%;
	vertical-align:top;
	text-align:left;
	
}
.txt_img_box.imgLeft .imgarea{
	float:left;
}
.txt_img_box.imgRight .imgarea{
	float:right;
}
.txt_img_box .imgarea img{
	/*border: 1px solid #ccc;*/
	/*box-shadow:-10px 30px 30px rgba(0,0,0,0.2);*/
}

.inqarea .txt_img_box .imgarea{
	border-radius:20px;
}

.txt_img_box .textarea{
	width:50%;
	vertical-align:top;
	padding:30px;
}

.txt_img_box.imgLeft .textarea{
	float:right;
}
.txt_img_box.imgRight .textarea{

	float:left;
}
.txt_img_box .textarea p{
	margin-bottom:30px;
	line-height:1.6;
	 
}



	/**/
	.txt_img_box .textarea.business_con{
		padding-top:50px; 
		
		font-weight:400;
	}
 



.txt_img_box .textarea .numtxt{
	display:inline-block;
	margin-right:10px;
	font-size:150px;
	font-weight:700;
	color:#d3d3d2;
	vertical-align:top;
	line-height:1;
}

.txt_img_box .textarea .txt_info{
	 display:inline-block;
	 width:80%;
	 vertical-align:top;
}
.txt_img_box .textarea .txt_info strong{
	display:block;
	color:#f07905;
	margin-bottom:20px;
}

.txt_img_box .textarea .txt_info .txt_dec{
	 
}


/*이미지 리스트*/

.img_list{
	position:relative;
	margin: 30px 0;
	
 
}
.img_list ul{
	text-align:center;
}
.img_list ul li{
	display:inline-block;
	vertical-align:top;
	margin:10px;
}
.img_list ul li img{position:relative;width:100%;max-width:100%;}
.img_list ul li span{
	display:block;
	font-size:120%;
}

.img_list.colFour ul li {
	width:24%;
	margin:3px;

	
}
.img_list.coltwo ul li{
	width:47%;
	margin:1%;
}
.img_list.img_listB{
	margin:0;
}
.img_listB ul li{
	overflow:hidden;
	border-radius:30px 0;
}


/* DT DD*/

dl.dldtA{
	position:relative;
	margin-bottom:30px;
	 border-bottom: 1px solid #ccc;
}
dl.dldtA dt{
	font-size:130%;
	font-weight:500;
	padding-top:3px; 
	padding-bottom:3px; 
	margin-bottom:0px;
	position:relative;
	padding-left:35px;
	
}
 


dl.dldtA dt span.num_box{
	position:absolute;
	display:block;
	vertical-align:top;
	margin-right:10px;
	top:5px;
	left:0;
	width:30px;
	height:30px;
	color:#989797;
	font-size:70%;
	line-height:30px;
	background:#fff;
	text-align:center;
	border-radius:100% 100%;
}
dl.dldtA dd{
 	 margin-bottom:10px;
	 
}
dl.numdt dd{
 	 padding-left:40px;
	 
}

 

  
  /*////////////////////////////////////////////////////////////////////회사소개////////////////////*/

.greetingarea{
	position:relative;
	margin:0 auto;  
	padding: 70px 0;
	width:100%;

}
.greetingarea:after{

	clear:both;
	display:block;
	content:'';
	position:relative;
	height:40px;
}
 
.greetingarea  p{
	padding-bottom:30px;
}
.greetingarea .gree_left{
	float:left;
	width:40%;
	padding-right:50px;
	color: var(--t_majorcolor);
}
.greetingarea .gree_right{
	float:right;
	width:60%;
}

 
 

 /*회사연혁*/

.historyarea{
	position:relative;
	text-align:left;
	
	margin:0 auto;
	
}
.historyarea{
	position:relative;
	margin:0 auto;  
	padding: 70px 0;
	width:100%;

}
.historyarea .his_left{
	display:inline-block;
	width:40%;
	position:relative;	
	color: var(--t_majorcolor);
	vertical-align:top;
}
.historyarea .his_right{
	display:inline-block;
	width:58%;
	position:relative;
	vertical-align:top;
}

.historyarea .his_block{
	position:relative;
	 
}
.historyarea .his_block .his_year{
	position:absolute;
	top:0;
	left:0;
	 
}
.historyarea .his_block .his_date{
		position:relative;
		padding-left:150px;
		min-height:100px;
		font-size:120%;
}
.historyarea .his_block .his_date span{
	display:block;
	opacity:.7;
	font-size:90%;
}

/*오시는길*/
.locationarea{
	margin-top:30px;
}
.locationarea h4{
	padding-bottom:10px;
	border-bottom: 2px solid #333;
	margin-bottom:40px;
}
.locationarea .loc_box{
	margin-bottom:50px;
}
.locationarea .loc_box .addressinfo span{
	margin-right:20px;
	font-size:85%; 
	 font-weight:400;  
	display:inline-block;
	position:relative;
	margin-bottom:0px;
	padding-left:40px;
 	 
}
 
.locationarea .loc_box .addressinfo span:last-child{
	
	margin-right:0px;
}
  
.locationarea .loc_box .addressinfo span:before{
	display: block;
 	content:' ';
 	width:1px;
 	height:10px;
 	background:rgba(0,0,0,.2);
 	position:absolute;
 	top:8px;
	left:32px;
	padding-left:0;
 }
 
.locationarea .loc_box .addressinfo  span strong{
 	position:absolute;
	top:0;
	left:0;
	font-weight:500; 
	margin-right:0px; 
	left:0; 
	color:#000;
	 
}

.locationarea .loc_box .mapimg{
	margin-top:30px;
	margin-bottom:30px;
	 
}

/*business*/
.businessarea_box{
	position:relative;
	margin:0 auto;  
	padding: 40px 0;
	width:100%;

}
.businessarea_box:after{

	clear:both;
	display:block;
	content:'';
	position:relative;
	margin-top:20px;
	height:2px;

	width:100%;
	background: rgba(0,0,0,.2);
	/*background:linear-gradient(45deg, rgba(15,63,172,.5), rgba(28,134,189,.5));*/
}
.businessarea_box:last-child:after{height:0px;}
 
.businessarea_box  p{
	padding-bottom:20px;
}
.businessarea_box .business_left{
	display:inline-block;
	width:300px; 
	color: var(--t_majorcolor);
	vertical-align:top;
}
.businessarea_box .business_right{
	display:inline-block;
	width:calc(100% - 310px);
	vertical-align:top;
}

.businessarea_box  .flowbox{
	background:#f7f7f7;
	padding: 20px 10px;
	text-align:center;
	margin-bottom:20px;
	border-radius:20px;
}