@charset "utf-8";
 
   
 .main_wrap{
		width:98%;
		margin:0 auto;
		position:relative;
		max-width:1500px;
		min-width:1500px;
		padding:0 10px;
		 
	
}

    
 .wide_wrap{
 		width:100%;
		margin:0 auto;
		position:relative;
		padding:0 0;
 }
  
  /*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:250%;
	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;
}
 
  /**/


 .ttitinfo{text-align:left;padding:80px 10px 40px 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:110%; 
	letter-spacing:-1px;
 }



/*@media(max-width:1000px){
   .ttitinfo{padding-top:50px}

 }

 @media(max-width:640px){
 .ttitinfo .txt_dec{
	font-size:110%;
  } 
}*/
 

/*businessarea link*/
.businessarea{
	
	clear:both;
	background:#f7f7f7;
	padding:30px 0 30px 0;
	margin-top:0px;
	overflow:hidden;
	background-size:cover;
	position:relative;
	
}
.businessarea  .ttitinfo span.stxt{
	color:var(--t_majorcolor);
}



.accordion{ 
  max-width: 100%;
  height: 500px;
  display: flex;
  overflow: hidden;
  margin: 0px auto 80px auto;
}

.tab{
 display:inline-block;
  position: relative;
  width: 25%;
  margin:2px;
  height: inherit;
  padding: 0px;
  color: #FFF;
  cursor: pointer;
  transition: width .8s ease;
    z-index:1;
}
.businessA{
		background: url(../image/business01.jpg) no-repeat center center;
		background-size:cover;
}
.businessB{
		background: url(../image/business02.jpg) no-repeat center center;
		background-size:cover;
}
.businessC{
		background: url(../image/business03.jpg) no-repeat center center;
		background-size:cover;
}
.businessD{
		background: url(../image/business04.jpg) no-repeat center center;
		background-size:cover;
}
.businessE{
		background: url(../image/business05.jpg) no-repeat center center;
		background-size:cover;
}

.infobox{
 position: absolute;
  z-index: 2;
  top: 0;
  left:0;
  width:100%;
  height:100%;  
  background: rgba(0,0,0,.1);
  
}

.infobox h4{
	font-size:140%; 
	text-align:center;
	position:absolute;
	bottom:10%;
	width:100%;
	left:0;

	

}

.infobox .busstxt{
  display:none;
  transition: all .8s ease;
  margin: 20px auto; 
  position:relative;
  opacity: 0;
   width:350px;
 
   
}

.infobox .btn_link{
	display:none;
}

/* --- Hover Effects --- */


.tab:hover{
  width: 50%;


}

.tab:hover .infobox{
  transition: all .8s ease;
   padding-top:15%;
    background: rgba(0,0,0,.3);
		-webkit-backdrop-filter: blur(7px);
		backdrop-filter: blur(7px);
}

.tab:hover .infobox h4{
	 
	margin-top:0;

	position:relative;
	bottom:auto; 
	 font-size:170%; 
	
}


.tab:hover .infobox .busstxt{
	display:block;
	opacity: 1;
	 transition: all .8s ease;
	 max-width:350px;
	 font-size:90%;
	 letter-spacing:-1px;
	 text-align:center;
	
	  
}

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

.tab:hover .infobox .btn_link:hover{
	background: var(--t_majorcolorSkyblueB);
	border: 2px solid var(--t_majorcolorSkyblueB);
}
 

 /*실적*/
 .workarea{
 	padding:30px 0 80px 0;
	margin-top:0px;
	overflow:hidden;
	background: url(../image/back_work.jpg) no-repeat center 0;
	background-size:cover;
	background-color:#030f1d;
	position:relative;
	
}
.workarea  .ttitinfo span.stxt{
	color:#6085b3;
}
.workarea  .ttitinfo h3{
	color:#fff;
}

.workarea  .photogalllery{
	padding-left:60px;
}

.workarea .gallbox{
	position:relative;
	width:400px;
	height: 450px;
	margin:10px;
	
	padding:0px 0 30px 0;
	 
	transform-style: preserve-3d;
    transition: 0.25s ease;
}



.workarea .gallbox .parttxt{
	color:#fff;
	padding:10px;
	text-align:left;
	opacity:.8;
	font-size:80%;
}
.workarea .gallbox .parttxt.partA{
	background:#043a79;
}
.workarea .gallbox .parttxt.partB{
	background:#043a79;
}

.workarea .gallbox .parttxt.partC{
	background:#043a79;
}

.workarea .gallbox .parttxt.partD{
	background:#043a79;
}

.workarea .gallbox .parttxt.partE{
	background:#043a79;
}



.workarea .gallbox .txtarea p{
	color:#fff;
	text-align:center;
	padding:5px;
	margin-top:20px;
	font-size:120%;
}
.workarea .gallbox .txtarea .btn_link{
	display:none;
	margin:0px auto;
	padding:5px 7px 3px 20px;

}


.workarea .gallbox .cardbox{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background:#101c2a;
	border:1px solid rgba(255,255,255,.2);
	border-radius:10px;
	overflow:hidden;
	background-position: center center;
	backface-visibility: hidden;
	transition: transform 0.5s ease-in-out;
}
.workarea .gallbox.cardOn .card_back.cardbox{
		border:1px solid rgba(255,255,255,1);
	background:#fff;
}
 

.workarea .gallbox .card_back{
		transform: rotateY(180deg);
}
.workarea .gallbox.cardOn .card_front{
	transform: rotateY(-180deg);
}
.workarea .gallbox.cardOn .card_back{
	transform: rotateY(0deg);
}
.workarea .gallbox.cardOn .card_back .txtarea .btn_link{
	display:block;
}
.workarea .gallbox.cardOn .card_back .txtarea p{
	color:#333;
	margin-top:5px;
}



 /*회사소개*/
 .aboutara{
 	padding:30px 0 370px 0;
	margin-top:0px;
	overflow:hidden;
	background: url(../image/back_about.jpg) no-repeat center 0;
	background-size:cover;
	background-color:#445570;
	position:relative;
	
}
.aboutara  .ttitinfo{text-align:center;margin:0 auto;max-width:1000px;}
.aboutara  .ttitinfo span.stxt{
	color:#86f5ff;
}
.aboutara  .ttitinfo h3{
	color:#fff;
	letter-spacing:-1px;

}
.aboutara  .ttitinfo .txt_dec{
	color:#fff;
	margin-top:20px;
	opacity:.8;
}
.aboutara .aboutlink .btn_link{
	margin:0px auto;
	color:#fff;
	font-size:100%;
		-webkit-backdrop-filter: blur(15px);
		backdrop-filter: blur(15px);
		background:rgba(255,255,255,.1);
			
}
.aboutara .aboutlink .btn_link:hover{
	background:rgba(0,0,0,.9);
}