@charset="euc-k";


*, *:after, *:before { margin:0; padding:0; font-family:'Malgun Gothic'; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; word-break:keep-all;}
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}
li { list-style:none; float:left;}
a { text-decoration:none; color:#252525; text-decoration: none; outline: none;}
p { letter-spacing:-0.5px;color:#252525; }
img { border:none;  }
body { overflow-Y:scroll; position:relative;  color:#333; background-color:#feffff; }
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}


/********header********/

.header {position:relative; width:100%; height:90px; transition:all 1s;  background:rgba(255, 255, 255, 1); z-index:9997;
		 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
		 

.top {width:100%; height:90px; background:rgba(255,255,255,5); opacity:0.6;
	  position:relative;
}
.down{position:fixed; top:-100px; transform: translate(0, 100px);}


.header span { position:absolute; top:20%; right:5%; font-size:30px; cursor:pointer; display:none;}
#logo {  float:left; width:180px; position:absolute; top:0; left:10%;}
#logo img { width:100%; }


.gnb { position:absolute; top:30%; right: 0%; font-size:0.8em; width:20%; text-align:center; }
.gnb li { margin: 0 2%;  }
.gnb li img { border:1px solid #f2f2f2; }
.gnb a { color:#000; }


.lnb { overflow:hidden; }
.lnb > ul  { width:1000px; margin:0 auto; padding-left:100px; }		
.lnb > ul li { width: 20%; padding-top:45px; font-size:1.2em; font-weight:600; }
.lnb > ul > li > a{ display: block; }


.sub_lnb { background-color: #4893d3;  
position: absolute; width: 100%; left: 0; top:90px; display:none;}
.sub_lnb a{color:#fff;}


.sub_lnb div { width:1000px; margin:0 auto; padding:5px 0 0 100px;}
.sub_lnb ul { float:left; width:20%;}
.sub_lnb ul li  { float:none; font-size:0.9em; padding:2% 0;}




@media only screen and (max-width:1200px){
	.gnb, .lnb { display:none; }
	.header span { display:block; }
	#logo { top:0; left:5%;}
}
@media only screen and (max-width:480px){
	.header {  height:60px;}
	#logo {   width:80px; }
}






/**********main**********/
#main { width:100%;  overflow:hidden;  z-index:-1; }
#main img { width:100%;}
#m_main { width:100%;  overflow:hidden; display:none;}
@media only screen and (max-width:1200px){
}
@media only screen and (max-width:640px){
	#m_main { width:100%;  overflow:hidden; display:block;}
	#m_main img { width:100%;}
	#main { display:none; }
}






/*******footer*********/
#footer { overflow:hidden; background-color:#fff; color:#000;    font-size:0.8em; border-top:1px solid #eee;}


#footer > div > img { width:100%; }

#footer div { width:25%;  float:left; overflow:hidden; }
#footer div img {  width:100%; }

@media only screen and (max-width:1200px){
	#footer div { width:50%;}
}
@media only screen and (max-width:480px){
	#footer div { width:100%;  display:none;}
	#footer div:last-child { width:100%;  display:block;}
	
}







/******************************************************************************************/
/******************************************************************************************/
/******************************************************************************************/
/******************************************************************************************/



#contents{
	width:1200px; margin:0 auto; overflow:hidden;
	padding-bottom:5%;
}

.title {overflow:hidden; height:100%;
background-position: center;
    background-repeat: no-repeat;
    background-size: cover;}
.title p {color:#fff; text-align:center;  font-size:1.2em; padding:0 0 5% 0;}
.title p:first-child {  font-size:2.8em;  padding:8% 0 1% 0;}
.products_title p { color:#000;}


.summary_title { background-image:url(../company/image/company.png); }
.greeting_title { background-image:url(../company/image/company2.png); }
.vision_title { background-image:url(../company/image/company3.png); }
.business_title { background-image:url(../company/image/company4.png); }
.direction_title { background-image:url(../company/image/company5.png); }
.patent_title { background-image:url(../patent/image/patent.png); }
.facilities_title { background-image:url(../facilities/image/facilities.png); }
.products_title { background-image:url(../products/image/products.png); color:#000; }
.customer_title { background-image:url(../customer/image/customer.png); }









		
@media only screen and (max-width:1200px){
	#contents{ 	width:100%;  }
}		
@media only screen and (max-width:640px){
	.title p {	font-size:1.0em;	}
	#contents { padding: 0% 2% 5% 2%;}
}			
		




/*??¬κ°μ*/
.summary { overflow:hidden; }
.summary01 li{ text-align:center; float:none; }
.summary01 li:first-child { font-size:1.5em; font-weight:600; padding:5% 0 2% 0; }

.summary02 li{ width:33.333%; padding:5%; text-align:center; font-size:1.4em; font-weight:600;}
.summary02 li img{ width:100%;}

.summary03 >li { float:left; width:50%; padding:3%; font-size:1.4em; }
.summary03 >li img{ width:100%; }
.summary03 >li > ul > li { float:none; padding:8px 0 0 20px; text-indent:-20px;}

.summary04 li img { width:100%; padding:5% 0 0 20%; }

/*?Έ?¬λ§?*/
.greeting { padding:5% 10%;}
.greeting li { padding:1% 0; letter-spacing:-1px;}
.greeting li:first-child { font-size:1.8em; color:#39749b;}
.greeting li:nth-child(2) { font-size:2.4em;  }
.greeting li:nth-child(3) { padding-top:2%;font-size:1.2em; line-height:38px;}
.greeting li:last-child { width:100%; text-align:right; margin-top:5%;}
.greeting li img { width:40%; }

/*λΉμ */
.vision {  overflow:hidden; }
.vision div { overflow:hidden; position:relative; float:left;  }
.vision p { position:absolute;  top:50%; left:50%;  transform: translate(-50%, -50%);
	font-weight:600; font-size:1.8em;}
.vision img { width:100%; float:left; padding:5%;}

.vision ul { padding-top:10%;}
.vision ul li { float:none; }
.vision ul li:first-child { font-weight:600; font-size:1.4em;}

.vision01 { margin-left:10%; }
.vision02 { margin-left:20%; }
.vision03 { margin-left:30%; }

/*μ£Όμκ³ κ°*/
.business { margin-top:5%; }
.business li img { width:100%;}

/*μ°Ύμ?€??κΈ?*/
.map { margin-top:5%;}
.direction { float:left; width:40%; margin:5%;}
.direction ul li { float:none; margin:3% 0;}
.direction ul li img{ width:100%;}
.direction ul li span { margin-left:5%;}
.direction ul li:first-child { font-size:1.4em; font-weight:600; padding:4% 0; border-bottom:2px solid #252525;}





@media only screen and (max-width:1200px){
	.summary03 >li { font-size:1.0em;}
	.vision p {  font-size:1.6em;}
	.vision img { width:100%; float:left; padding:5%;}

	.vision ul { padding-top:10%;}
	.vision ul li:first-child { font-size:1.4em;}
	.summary04 { padding:3% 0 0 0;  }
	
}


@media only screen and (max-width:640px){
	.summary03 >li { width:100%; font-size:1.0em;}
	.summary03 >li img{ width:100%;}
	.summary04 li img { padding:0; }
	
	
	
	.greeting { padding:5% 5%;}
	.greeting li { padding:1% 0; letter-spacing:-1px;}
	.greeting li:first-child { font-size:1.2em; }
	.greeting li:nth-child(2) { font-size:1.6em;  }
	.greeting li:nth-child(3) { padding-top:2%;font-size:1.0em; line-height:24px;}
	.greeting li img { width:60%; }
	
	.direction {  width:100%; margin:0%; padding:5%;}
	.direction ul li { float:none; margin:3% 0;}
	.direction ul li img{ width:100%;}
	.direction ul li span { margin-left:5%;}
	.direction ul li:first-child { font-size:1.4em; font-weight:600; padding:4% 0; border-bottom:2px solid #252525;}

	.vision p {  font-size:1.2em;}
	.vision div { float:none; width:60%; margin-left:20%;  }
	.vision ul { text-align:center; padding-top:0%; padding-bottom:10%;}
	.vision01 { margin-left:0%; }
	.vision02 { margin-left:0%; }
	.vision03 { margin-left:0%; }
	
}


/******************************************************************************************/
/******************************************************************************************/


.products { width:1135px; margin:0 auto; padding-top:2%;}
.products > p { font-size:2.0em; font-weight:500; margin:2% 0; }
.products > p span { width:8px; height:35px; background-color:#ec9c91; display:block; float:left; margin:5px;}
.products img { width:100%;  }




.tab_menu { width:800px; margin:0 auto; padding-top:2%;}
.tab_menu button {
    border:2px solid #a7a7a7;
    float: left;
	width:31%;
	margin:1%;
	font-size:1.2em;
    cursor: pointer;
	padding: 10px 5px;
	transition: 0.3s;
}
.n_menu {  color:#a7a7a7; }
.s_menu {background-color:#a7a7a7; color:#fff;}

.tab_menu button:hover {
    background-color:#a7a7a7; color:#fff;
}




.page_tab { width:150px; margin: 0 auto;  padding:5% 0;}
.page_tab button { width:29%; padding:6% 0; margin:0 1%; 
	float:left; cursor: pointer; transition: 0.3s; 
	border:2px solid #a7a7a7;}

.n_page {  color:#a7a7a7; }
.s_page {background-color:#a7a7a7; color:#fff;}
	
.page_tab button:hover {
    background-color:#a7a7a7; color:#fff;
}





		
@media only screen and (max-width:1200px){
	.products { width:100%;}
	.tab_menu { width:100%;  }
}		
@media only screen and (max-width:640px){
	.tab_menu button { font-size:0.9em;}
	.products > p { font-size:1.6em;  }
	.products > p span { width:5px; height:25px; }
}			
		




/******************************************************************************************/
/******************************************************************************************/

.facilities_p { text-align:center; font-size:1.5em; padding:5% 0 2% 0;}
.facilities { text-align:center; font-size:1.2em;}
.facilities img { width:100%; }
.facilities01 li:nth-child(even) img { margin:0 auto;}
.facilities02 li:nth-child(odd) ul li{ width:50%;}




.patent li { width:50%; padding:5%; text-align:center; font-size:1.2em; font-weight:600;}
.patent li img { width:100%; }



@media only screen and (max-width:1200px){
	.patent li { font-size:0.9em; font-weight:500;}
}
@media only screen and (max-width:640px){
}







/******************************************************************************************/
/******************************************************************************************/
/******************************************************************************************/
/******************************************************************************************/

.overlay {
    height: 0%; width: 100%; position: fixed; z-index: 9999;
    top: 0; left: 0; background-color: rgb(0,0,0);
    background-color: rgba(72,146,210, 0.9); overflow-y: hidden;  transition: 0.5s;
}
.overlay-content {  position: relative; top: 10%; width: 1200px; text-align: center; margin:0 auto;}
.overlay a { padding: 8px; text-decoration: none; font-size: ; color: #000; display: block; transition: 0.3s;}
.overlay a:hover, .overlay a:focus { color: #f1f1f1;}
.overlay .closebtn { position: absolute; top: 0px; right:15px; font-size: 60px; padding:0 3%;}


.ov_logo { width:100%; margin:0 auto; position:relative; margin-bottom:2%;}
.mark {   }

.ov_nav {  }
.ov_nav ul li:first-child div {border:0px;}

.ov_lnb ul li { }
.ov_lnb a { }

.item_wrap {overflow:hidden; width:20%;}
.item {	font-size:1.2em;}
.item a {color:#fff; }
.item_list {}
.item_list li { float:none;}



.ov_lnb ul li a:hover,
.ov_lnb ul li a:focus {	background-color: #78a0c8;;}

.ov_gnb { display:inline-block;  }
.ov_gnb li a { display:inline-block; color:#fff; font-size:0.8em; }

@media only screen and (max-width:1200px){
	.overlay-content { width: 100%;}
}
@media only screen and (max-width:1024px){
	.open_btn  { display:block; }
	.nav { }
}
@media only screen and (max-width:640px){
	.item_wrap { width:100%; }
}





