@charset "utf-8";
  :root {
  --border-radius: 0.25em;
  --border-width: 2px;
  --border-color: #fff;
  --background-color: #1c1c1c;
  --animation-duration: 500ms;
  --animation-durationB: 300ms;
  --blur: 20px;
}
   
 .main_wrap{
		width:98%;
		margin:0 auto;
		position:relative;
		max-width:1500px;
 		padding:0 10px;
		 
	
}


  
  /*mainimg slider/*/

  #mainimgContent{
	
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
	min-height:780px;
	background:#fff;
	 
}

 
   
   


#mainimgContent_in{
	
	margin: 0px 0;
    position: absolute;
 	width:100%;
	height:100%;
	overflow: hidden;
}


.mainContainer{
	
	padding-top:0px;
	position:relative;
	width:100%;
 	margin:0 auto;
	background:#000;
 	
}
.mainContainer_in{
	width:100%;
	overflow:hidden;
	
}

	 
  

/**/

.main h2{
	
 	font-size:70px;
	letter-spacing:-3px;
	font-weight:500;
	line-height:1.1;
	word-break:keep-all;
	margin-bottom:10px;
	 
	 
	

}
 
.main h2 strong{ font-weight:800; }

.main h3{
 	font-size:220%;
	letter-spacing:-2px;
	font-weight:500;
	line-height:1.1;
	word-break:keep-all;
	margin-bottom:10px;
	padding-top:10px;
}
.main h3 strong{font-weight:700;}
.main h4{
	 
	font-size:180%;
	letter-spacing:-1px;
	font-weight:600;
	line-height:1.1;
	word-break:keep-all;
	margin-bottom:10px;
	padding-top:10px;
}
 
  @media(max-width:1400px){
	 .main_wrap{
			width:98%;
	 }

  }
 
 @media(max-width:1000px){
	
	

	  #mainimgContent{
		min-height:600px;
	  }
	.main h2{
		font-size:40px;
		letter-spacing:-1px;
	}
	.main h3{
		font-size:200%;
	}
	.main h4{
		font-size:180%;
	}

	 
}

 @media(max-width:780px){
	.main h2{
		font-size:35px;
		letter-spacing:0px;
	}
	.main span.ttile{
		font-size:17px;

	}
	.main h3{
		font-size:170%;
	}
	.main h4{
		font-size:160%;
	}

 
}

@media(max-width:640px){
	.main h3{
		font-size:160%;
	}
	.main h4{
		font-size:150%;
	}
 
	
}

@media(max-width:420px){
	.main h3{
		font-size:130%;
		letter-spacing:0;
	}
	.main h4{
		font-size:120%;
	}
 
	
}

/*link button*/

 .btn_link{
	display:block;
	margin:10px auto ;
	position:relative;
	width:140px;
	text-align:	 left;
	border: 2px solid #ccc;
	border-radius:30px;
	padding:7px 7px 5px 20px;
	color:#ccc;
	font-size:13px;
	line-height:1;
	 
}
 .btn_link i{
	 font-size:21px;
	 font-weight:300;
	line-height:1.2;
	vertical-align:middle;
	margin-left:5px;
	margin-top:-2px;
}

.btn_link:hover{
	background: var(--t_majorcolorSkyblueB);
	border: 2px solid var(--t_majorcolorSkyblueB);
	color:#fff;
}
 
  /**/

  /*icon_arrow*/

   a.morelinkbox{
		display:inline-block;
		background:var(--color-black-400);
		min-width:150px;
		line-height:1.1;
		padding:10px 20px;
		margin:0;
		position:relative;
		border-radius:30px;
		color:#fff;
		text-align:left;
  }
   a.morelinkbox:hover{color:#fff;background:var(--color-black-300);}
  a.morelinkbox span.icon_arrow{
	display:inline-block;
	margin-left:40px;
	
	vertical-align:middle;
     cursor: pointer; 
	  width: 15px;
	  height: 15px;
	  border:0px;
	  border-top: 2px solid #fff;
	  border-left: 2px solid #fff; 
	  background:none;
	  opacity:1;
      outline: none;
	  z-index:3;
	  transform: rotate(135deg);
	  transition: var(--animation-durationB) ease-out;
  }
   a.morelinkbox:hover span.icon_arrow{
		margin-left:45px;
		 transition: var(--animation-durationB) ease-out;
   }

     a.morelinkbox span.icon_arrow::after{
	  content: "";
	  display: block;
	  width: 2px;
	  height: 34px;
	  background-color: #fff;
	  transform: rotate(-45deg) translate(11px, 4px);
	  left: 0;
	  top: 0;
}
/**/

 


 .ttitinfo{text-align:left;padding:30px  0px 30px 0;margin:0;max-width:800px;}
 .ttitinfo span.stxt{display:block;margin-bottom:5px;padding:0;margin:0}
 .ttitinfo h3 span{display:inline-block;}
 
  .ttitinfo .txt_dec{
	font-size:150%; 
	letter-spacing:-1px;
 }
@media(max-width:1000px){
	.ttitinfo .txt_dec{
		font-size:120%; 
		letter-spacing:0px;
	 }
}
@media(max-width:780px){
	.ttitinfo .txt_dec{
		font-size:110%; 
 	 }
}
 
 

/*businessarea */
.businessarea{
 	padding:120px 0 160px 0;
	margin-top:0px;
	overflow:hidden;
	background: url(/image/back_business.jpg) no-repeat center 0;
	background-size:cover;
	position:relative;
	
}
.businessarea .ttitinfo{
	color:#fff;
	position:absolute;
	left:2%;
	max-width:450px;
	z-index:1;

 }

.businessarea .ttitinfo h3 span{
	font-weight:400;
	font-size:140%;
	letter-spacing:-2px;
}
.businessarea .ttitinfo .txt_dec{
	opacity:.7;
}
.businessarea .main_product{
	padding-left:2%;
	z-index:2;

}
.businessarea .main_product .probox{
	padding-left:500px;
 }





.businessarea .main_product .pro_box{
	 
	 
	 margin:10px;
	 box-sizing: border-box;
  display: grid;
  place-items: center;
  grid-flow: row;
  position: relative;
  text-transform: uppercase;
  padding: 1em;
  
 
  overflow: hidden;
  border-radius: 0.25em;
  box-shadow: var(--shadow-normal);
 
}

.businessarea .main_product .pro_box:before{
position: absolute;
  content: "";
  background-color: var(--border-color);
  height: 160%;
  width: 30%;
  transform: rotate(45deg);
  transform-origin: center;
  transition: var(--animation-duration) ease-out;
  border-radius: inherit;
  z-index: -1;
  filter: blur(var(--blur));
 
}

.businessarea .main_product .pro_box:after {
  position: absolute;
  content: "";
  inset: var(--border-width);
  background:linear-gradient(45deg, rgba(119,122,127,1), rgba(85,90,96,1)); 
  border-radius: inherit;
  z-index: -1;
 
}
.businessarea .main_product .pro_box:hover:after {
	background:#272872;
	
}

.businessarea .main_product .pro_box:hover:before {
 width: hypot(110%, 110%);
}


.businessarea .main_product .pro_box .txtarea{
	color:#fff;
	 font-size: 20px;
	 text-align:center;
	 padding:20px 0;
	 
	
}
 @media(max-width:1000px){
	.businessarea{
		padding:0px 0 30px 0;
	}
	.businessarea .ttitinfo{
		max-width:96%;
		position:relative;
		
	}
	.businessarea .ttitinfo h3 span{
		font-size:120%;
	}
	.businessarea .main_product .probox{
		padding-left:0px;
		padding-top:40px;
		 
	}
	.businessarea .main_product .pro_box{
		 
	}
	
	.businessarea .main_product .pro_box .txtarea{
		font-size: 110%;
	}
 }


  
/*주요실적*/
.workarea{
	position:relative;
	background: #fff;
	padding-top:40px;
	padding-bottom:80px;
	 
}

.workarea .ttitinfo h3 span{
	 display:block;
}
.workarea .ttitinfo h3 span strong{
	color: var(--t_majorcolor);
}

.workarea .morelinkarea{
	position:absolute;
	right:10px;
	top:30px;
 }
 
 
 
  

.worklist{
	position:relative;
	margin-top:0px;
	padding-bottom:50px;
}
.worklist:after{
	 clear:both;
	display:block;
	content:'';
	position:relative;
}
.worklist .workbox{
	width:33.333%;
	 min-width: 400px;
	float:left;
	position:relative;
}
.worklist .workbox a{
	display:block;
	margin:0 auto;
	position:relative;
	width:95%;  
	padding:0px;
	overflow:hidden;

	 
}
.worklist .workbox .imgarea{
	z-index:1;
	border-radius:10px;
	overflow:hidden;
}
.worklist .workbox .imgarea img{
		
	width:100%;
	-webkit-transition:all 0.8s;
	-moz-transition:all 0.8s;
	-o-transition:all 0.8s;
	-ms-transition:all 0.8s;
	transition:all 0.8s; 
}
.worklist .workbox:hover .imgarea img{
	-webkit-transform:scale(1.2); 
	-moz-transform:scale(1.2); 
	transform:scale(1.2);
} 
.worklist .workbox  strong{
	display:block;
	z-index:2;
	background:#fff;
	text-align:center;
	padding:10px 0;
	position:relative;
	font-size:120%;
	 
}

/**/
 

.simplebar-wrapper {
  overflow: hidden;
  width: inherit;
  height: inherit;
  max-width: inherit;
  max-height: inherit;
  position:relative;
  
   
}

.simplebar-mask {
  direction: inherit;
  position: absolute;
  overflow: hidden;
  padding: 0;
  margin: 0;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: auto !important;
  height: auto !important;
  z-index: 0;
    
}

 
 
 

.simplebar-content:before,
.simplebar-content:after {
  content: ' ';
  display: table;
}

 

.simplebar-track {
  z-index: 1;
  position: absolute;
  right: 0;
  bottom: 0;
 
  overflow: hidden;
  background: #f7f7f7;;
}

 

.simplebar-scrollbar {
  position: absolute;
  left: 0;
  right: 0;
  min-height: 10px;
   
  
}

.simplebar-scrollbar:before {
  position: absolute;
  content: '';
  background:var(--t_majorcolor);
  border-radius: 7px;
  left: 2px;
  right: 2px;
  opacity: 0;
  transition: opacity 0.2s 0.5s linear;
}

.simplebar-scrollbar.simplebar-visible:before {
  opacity: 0.5;
  transition-delay: 0s;
  transition-duration: 0s;
}

.simplebar-track.simplebar-vertical {
  top: 0;
  width: 11px;
}

.simplebar-scrollbar:before {
  top: 2px;
  bottom: 2px;
  left: 2px;
  right: 2px;
}

.simplebar-track.simplebar-horizontal {
  left: 0;
  height: 11px;
}

 
 
 /**/
.simplebar-content {display: flex;} 

.simplebar-scrollbar::before {
	opacity: 1 !important;
	 
}


@media(max-width:1000px){

	.workarea{
		padding-top:20px; 
		 

	}
.workarea .ttitinfo{
	display:inline-block;
	padding-inline:0 30px;
	padding-bottom:10px;

}
	.workarea .morelinkarea{
		position:relative;
		display:inline-block;
		right:auto;
		top:auto;
	 }


	.worklist{
		 
		margin-top:30px;
		
	}
	.worklist .workbox{
		 width:20%;
		 min-width: 300px;

	}
	.worklist .workbox  strong{
		font-size:110%;
	}

}


/*aboutus*/
.aboutarea{
	position:relative;
	 background: url(/image/back_about.jpg) no-repeat right 0;
	background-size:cover;
	padding-top:120px;
	padding-bottom:30px;
	min-height:600px;
}

.aboutarea .ttitinfo h3 span{
	 display:block;
	 color: #fff;
}
.aboutarea .ttitinfo h3 span strong{
	 
}

.aboutarea .morelinkarea .morelinkarea_box{
	 margin-bottom:10px;
	  width:500px;
	  padding:5px 10px;
	  border-radius:5px;
 }
.aboutarea .morelinkarea .morelinkarea_box.about_link{
	background:#002872;
}
.aboutarea .morelinkarea .morelinkarea_box.inq_link{
	background: #a40202;
}
 .aboutarea .morelinkarea .morelinkarea_box  a.morelinkbox{
	display:block;
	display:flex;
	padding:10px 10px;
	 align-items: center;
	 flex-wrap: wrap;
	 border-radius:5px;
	 background:none;
	 
 }
 .aboutarea .morelinkarea .morelinkarea_box  a.morelinkbox .quik_icon{
	width:50px;
  }
  .aboutarea .morelinkarea .morelinkarea_box  a.morelinkbox .tit{
	width:100px;
	font-weight:600;
	font-size:110%;
  }
 .aboutarea .morelinkarea .morelinkarea_box  a.morelinkbox .tit_des{
	width:250px;
	padding-inline:10px;
	font-size:90%;
	opacity:.7;
	position:relative;
  }
   .aboutarea .morelinkarea .morelinkarea_box  a.morelinkbox .tit_des:before{
		content:'';
		display:block;
		position:absolute;
		left:0;
		top:0;
		width:1px;
		height:100%;
		background:#fff;
   }
  
@media(max-width:640px){
   .aboutarea{
	padding-top:20px;
	 background: url(/image/back_about_M.jpg) no-repeat right bottom;
	background-size:cover;
	min-height:400px;
 
}

   .aboutarea .morelinkarea .morelinkarea_box{
		width:250px;
   }
   .aboutarea .morelinkarea .morelinkarea_box  a.morelinkbox .tit_des{
		display:none;
   }
 }