@charset "utf-8";

* {
	box-sizing: border-box;
	word-break: break-word;
	word-break: keep-all;
}


/*----범용 시작-----------------------------------------------------------------------------------*/

#wrap   {
    position: relative;
    width:100%;
	height:auto;
	margin:0 auto;
}
.in-width {
	width: 100%;
	max-width: 1002px;
	margin: 0 auto;
}
.desktop-hidden {
	display: none;
}
#global {background: #ffffff; position:fixed; z-index:999999;width:100%; }	  /*상단글로발메뉴및로고*/	
#global .global-wrap {
	display: flex;
	display: -webkit-flex;
	align-items: center;
	-webkit-align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	
	position: relative;
	padding: 20px 10px;
}
#global-right {
	display: flex;
	display: -webkit-flex;
	align-items: center;
	-webkit-align-items: center;
}
#global #toplogo {position: relative;}
#global #toplogo li a {
	display: block;
}
#global #toplogo li img {
	width: 100%;
}
#topquick {
	display: flex;
	display: -webkit-flex;
	align-items: center;
	-webkit-align-items: center;
	position: relative;
}
#global #topquick li {
	padding: 0 5px;
}
#topquick li .btn {
	font-size: .9em;
	color: #fff;
	padding: 4px 12px;
}
.btn.no1 {
	background-color: #0d9991;
}
.btn.no2 {
	background-color: #4a4a4a;
}
#topquick li img {
	vertical-align: middle;
}
#topquick li .txt {
	color: #000;
	padding: 0 3px;
	vertical-align: middle;
}
#menu-icon {
	z-index: 9999;
	position: relative;
	width: 32px;
	cursor: pointer;
}
#menu-icon li {
	width: 100%;
	height: 2px;
	margin: 4px 0;
	background-color: #4cdbe5;
	transition: transform,opacity .3s, .3s;
}
#global #menu-icon li.no1 {
	transform-origin: 0 50%;
}
#global.mobile-open #menu-icon li.no1 {
	transform: translate(0px, -4.5px) rotate(45deg);
}
#global.mobile-open #menu-icon li.no2 {
	opacity: 0;
}
#global #menu-icon li.no3 {
	transform-origin: 100% 50%;
}
#global.mobile-open #menu-icon li.no3 {
	transform: translate(-9px, -16.5px) rotate(-45deg);
}
#header {position: relative; width:100%; FILTER: alpha(opacity=100); opacity: 1.0; -khtml-opacity: 1.0; -moz-opacity: 1.0  }                  /*상단메뉴들어가는부분*/



#mainbg {
	position:relative;
	width:100%;
	padding: 20px;
	border-top: #e9e9e9 0px solid; background:#ffffff;}                                 /*메인레이아웃*/
#mainbg-wrap {
	padding: 0 20px;
}	
#mainbg #left{position: relative;}                                                 /*메인의 좌측*/  
#mainbg #left li {}
#mainbg #left2{position: relative;}                                                 /*메인의 좌측*/  
#mainbg #left2 li{}


/* #mainbg2 {position:relative; width:100%; TOP:145px; height:295px;}                                 메인레이아웃
#mainbg2 #left{position:absolute;top:0px;left:50%;margin-left:-501px; width:240px; height:229px; background: url(../images/main/main_01-01.jpg);background-position:top center;}                                                 메인의 좌측  
#mainbg2 #left li{float:left;margin-right:0px; padding-left:15px;padding-top:15px;padding-right:15px;}
#mainbg2 #left2{position:absolute;top:0px;left:50%;margin-left:-247px; width:240px; height:229px; background: url(../images/main/main_01-02.jpg);background-position:top center;}                                           메인의 좌측  
#mainbg2 #left2 li{float:left;margin-right:0px;padding-left:15px;padding-top:15px;padding-right:15px;}
#mainbg2 #left3{position:absolute;top:0px;left:50%;margin-left:7px; width:240px; height:229px; background: url(../images/main/main_01-03.jpg);background-position:top center;}                                                 메인의 좌측  
#mainbg2 #left3 li{float:left;margin-right:0px;padding-left:15px;padding-top:15px;padding-right:15px;}
#mainbg2 #left4{position:absolute;top:0px;left:50%;margin-left:261px; width:240px; height:229px; background: url(../images/main/main_01-04.jpg);background-position:top center;}                                           메인의 좌측  
#mainbg2 #left4 li{float:left;margin-right:0px;padding-left:15px;padding-top:15px;padding-right:15px;} */

/* 메인 신규 css적용시작*/
#newmainbg2 {background: #eaeced; }
#newmainbg2-wrap {
	display: flex;
	display: -webkit-flex;
	justify-content: space-between;
	flex-wrap: wrap;
   	-webkit-flex-wrap: wrap;
	-webkit-justify-content: space-between;
	
	padding-left: 20px;
	padding-right: 20px;
}
#newmainbg2-wrap .newpart1 {
	position: relative;
	width: 33.3%;
	padding-bottom: 66px;
}
#newmainbg2-wrap .image-area {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
}
#newmainbg2-wrap .mainhead5,
#newmainbg2-wrap .mainhead6 {
	padding: 20px 20px;
}
#newmainbg2-wrap .btn-area {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 20px;
	text-align: center;
}
#newmainbg2-wrap  .view-btn {
	font-size: 1.1em;
	color: #fff;
	position: relative;
	padding: 5px 20px;
	background-color: rgba(22, 33, 38, .8);
}

/* 메인 신규 작업 기업소개 부분 시작*/
#newmainbg3,
#newmainbg5 {
	padding: 00px 0;
}

#newmainbg3 {
	border-top: #d8dbdf 1px solid;
	padding-top: 20px;
	background: #eaeced;
	display: flex;
	display: -webkit-flex;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
}
#newmainbg3-wrap,
#newmainbg5-wrap {
	display: flex;
	display: -webkit-flex;
	flex-wrap: wrap;
   	-webkit-flex-wrap: wrap;;
	width: 100%;
}
#newmainbg3-wrap .newpart2,
#newmainbg5-wrap .newpart2 {
	display: flex;
	display: -webkit-flex;
	position: relative;
	width: 100%;
}
#newmainbg3-wrap .image-area,
#newmainbg5-wrap .image-area {
	height: 100%;
	border-bottom: 0px solid #bcbcbc;
}
#newmainbg3-wrap .image,
#newmainbg5-wrap .image {
	background-size: contain;
}

#newmainbg3-wrap h1,
#newmainbg5-wrap h1 {
	font-size: 2.0em;
    font-weight: 600;
    color: #333333;
    line-height: 1em;
}
#newmainbg3-wrap p,
#newmainbg5-wrap p {
	padding: 10px 0;
}
#newmainbg3-wrap .btn-area,
#newmainbg5-wrap .btn-area {
	position: absolute;
	bottom: 0;
	width: 100%;
}
#newmainbg3-wrap .btn,
#newmainbg5-wrap .btn {
	display: block;
	color: #fff;
	width: 100%;
	max-width: 100px;
	text-align: center;
	background-color: #162126;
}


#newinfo {
	display: flex;
	display: -webkit-flex;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	background-color: #eaeced;
	border-bottom: #d8dbdf 1px solid;
	padding-bottom: 30px;
	padding-top: 20px;
}

#newinfoproduct {
	display: flex;
	display: -webkit-flex;
	flex-wrap: wrap;
   	-webkit-flex-wrap: wrap;;
	width: 100%;
	
}

#newinfoproduct a {
	display:  inline-block;
	width: 25%;
	height:217px;
}

#newinfoproduct .image-area {
	height: 100%;
	border-bottom: 0px solid #bcbcbc;
	
}

#newinfoproduct a img {
	height: 100%;	
}
/* 메인 신규 작업 기업소개 부분 끝*/
/* 메인 신규 css적용 끝*/



#mainbg2 {}
#mainbg2-wrap {
	display: flex;
	display: -webkit-flex;
	justify-content: space-between;
	flex-wrap: wrap;
   	-webkit-flex-wrap: wrap;
	-webkit-justify-content: space-between;
	
	padding: 20px;
}
#mainbg2-wrap .part {
	position: relative;
	width: 30%;
	padding-bottom: 64px;
}
#mainbg2-wrap .image-area {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
}
#mainbg2-wrap .mainhead5,
#mainbg2-wrap .mainhead6 {
	padding: 20px 20px;
}
#mainbg2-wrap .btn-area {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 20px;
	text-align: center;
}
#mainbg2-wrap  .view-btn {
	font-size: 1.1em;
	color: #fff;
	position: relative;
	padding: 5px 20px;
	background-color: rgba(22, 33, 38, .8);
}


/* #mainbg3 {position:relative; width:100%; TOP:145px; height:250px;BORDER-top: #d8dbdf 1px solid;BORDER-bottom: #d8dbdf 1px solid; background: #eaeced;}                                 메인레이아웃
#mainbg3 #left{position:absolute;top:50px;left:50%;margin-left:-501px;}                                                 메인의 좌측  
#mainbg3 #left li{float:left;margin-right:0px;}
#mainbg3 #left2{position:absolute;top:50px;left:50%;margin-left:5px;}                                                 메인의 좌측  
#mainbg3 #left2 li{float:left;margin-right:0px;} */

#mainbg3,
#mainbg5 {
	padding: 40px 0;
}
#mainbg3 {
	border-top: #d8dbdf 1px solid;
	border-bottom: #d8dbdf 1px solid;
	background: #eaeced;
}
#mainbg3-wrap,
#mainbg5-wrap {
	display: flex;
	display: -webkit-flex;
	flex-wrap: wrap;
   	-webkit-flex-wrap: wrap;
   	justify-content: space-between;
	-webkit-justify-content: space-between;
	padding: 20px;
}
#mainbg3-wrap .part,
#mainbg5-wrap .part {
	display: flex;
	display: -webkit-flex;
	position: relative;
	width: 50%;
}
#mainbg3-wrap .image-area,
#mainbg5-wrap .image-area {
	width: 40%;
	padding-top: 31%;
}
#mainbg3-wrap .image,
#mainbg5-wrap .image {
	background-size: contain;
}
#mainbg3-wrap .info-area,
#mainbg5-wrap .info-area {
	position: relative;
	padding: 0 20px
}
#mainbg3-wrap h1,
#mainbg5-wrap h1 {
	font-size: 2.0em;
    font-weight: 600;
    color: #333333;
    line-height: 1em;
}
#mainbg3-wrap p,
#mainbg5-wrap p {
	padding: 10px 0;
}
#mainbg3-wrap .btn-area,
#mainbg5-wrap .btn-area {
	position: absolute;
	bottom: 0;
	width: 100%;
}
#mainbg3-wrap .btn,
#mainbg5-wrap .btn {
	display: block;
	color: #fff;
	width: 100%;
	max-width: 100px;
	text-align: center;
	background-color: #162126;
}



/* #mainbg5 {position:relative; width:100%; TOP:145px; height:230px;BORDER-top: #d8dbdf 0px solid; background:;}                                 메인레이아웃
#mainbg5 #left{position:absolute;top:50px;left:50%;margin-left:-501px;}                                                 메인의 좌측  
#mainbg5 #left li{float:left;margin-right:0px;}
#mainbg5 #left2{position:absolute;top:35px;left:50%;margin-left:5px;}                                                 메인의 좌측  
#mainbg5 #left2 li{float:left;margin-right:0px;} */

/* #mainbg4 {position:relative; width:100%; TOP:145px; background:#FFFFFF; height:200px; BORDER-top: #e9e9e9 0px solid; }                                 메인레이아웃
#mainbg4 #left{position:absolute;top:45px;left:50%;margin-left:-501px;}                                                 메인의 좌측  
#mainbg4 #left li{float:left;margin-right:0px;}
#mainbg4 #left2{position:absolute;top:140px;left:50%;margin-left:-501px;}                                                 메인의 좌측  
#mainbg4 #left2 li{float:left;margin-right:0px;}
#mainbg4 #right{position:absolute;top:35px;left:50%;margin-left:-170px; }                                 메인의 우측
#mainbg4 #right li{float:left;margin-right:0px;}
#mainbg4 #right2{position:absolute;top:130px;right:50%;margin-right:-530px;}                                                 메인의 좌측  
#mainbg4 #right2 li{float:left;margin-right:0px;} */

#mainbg4-wrap {
	display: flex;
	display: -webkit-flex;
	padding: 40px 0px;
}
#mainbg4-wrap h1 {
    font-size: 30px;
    font-weight: 500;
    color: #333333;
    line-height: 1.8;
    border-top: 3px solid #666666;
    padding-top: 10px;

}
#mainbg4-wrap p {
	line-height: 1.4em;
	padding-bottom: 10px;
}
#mainbg4-wrap .left {
}
#mainbg4-wrap .right {
	position: relative;
	flex: 1;
	font-size: 1.2em;
	padding: 0 40px;
}
#mainbg4-wrap .right1 {
	position: relative;
	flex: 1;
	font-size: 1.2em;
	padding: 0 40px;
	width: 236px;
}


/* #mainbg6 {position:relative; width:100%; TOP:145px; background:#eaeced; height:90px; BORDER-top: #d8dbdf 1px solid;BORDER-bottom: #d8dbdf 1px solid; }                                 메인레이아웃
#mainbg6 #center {width:100%; text-align: center;margin-top:25px;}                                                 메인의 좌측  
#mainbg6 #center li{float:center;margin-right:0px;} */

#mainbg6 {
	padding: 20px 0;
	border-top: 1px solid #d8dbdf;
	border-bottom: 1px solid #d8dbdf;
	background-color: #eaeced;
}
#mainbg6-wrap ul {
	text-align: center;
}
#mainbg6-wrap ul li {
	display: inline-block;
	padding: 0 20px;
}
#mainbg6-wrap ul li img {
	vertical-align: middle;
}
#mainbg6-wrap ul li span {
	font-weight: 600;
	padding: 0 10px;
}



#container-flex {
	display: flex;
	display: -webkit-flex;
	
	width: 100%;
	max-width: 1002px;
	margin:0 auto;
}
#left-nav {
	width: 240px;
	padding-top: 20px;
	margin-right: 40px; 
}
#left-nav h1 {
	font-size: 1.2em;
	color: #fff;
	padding: 10px;
	text-align: center;
	background-color: #e9550d;
	margin-bottom: 2px;
}
#left-nav .category-area {}
#left-nav .category {
	margin-bottom: 2px;
	background-color: #ddd;
}

#left-nav .category-area li:first-child .title {}
#left-nav .category-area li:nth-child(1).title {}
#left-nav .category-area li:nth-child(2).title {}
#left-nav .category-area li:nth-child(3).title {}
#left-nav .category.hidden {
	display: none;
}

#left-nav .category .title {
	width: 100%;
	line-height: 1.2em;
	cursor: pointer;
}
#left-nav .category .title.pad {
	padding: 10px;
}
#left-nav .category .title a {
	display: block;
	padding: 10px;
}
#left-nav .sub-category {
	display: none;
	border: 1px solid #999;
}
#left-nav .category.on .sub-category {
	display: block;
}
#left-nav .category.active .title,
#left-nav .category.active .title a {
	color: #fff;
	background-color: #008992;
}

#left-nav .category.ctg1 .title {
	background-color: #bcd18a;
}
#left-nav .category.ctg2 .title {
	background-color: #e5b68d;
}
#left-nav .category.ctg3 .title {
	background-color: #e3b8d6;
}

#left-nav .category.ctg1.active .title {
	background-color: #89b520;
}
#left-nav .category.ctg2.active .title {
	background-color: #de6d09;
}
#left-nav .category.ctg3.active .title {
	background-color: #c13999;
}

#left-nav .sub-category li {
	font-size: .8em;
	padding: 10px;
	line-height: 1.2em;
	cursor: pointer;
	border-bottom: 1px solid #999;
	background-color: #fff;
}
#left-nav .sub-category li:last-child {
	border-bottom: none;
}
#left-nav .sub-category li:hover a {
	color: #ff0000;
}
#left-nav .sub-category li.on a {
	font-size: 1.1em;
	color: #008992;
}

#subbg {position:relative; width: 100%;}                                                    /*서브레이아웃*/
#subcon{margin:0 auto; width: 100%; overflow:hidden; z-index:999;}
#subcon #right{}                                                                             /*서브우측*/
#subcon #right li{padding: 0px;}
#subcon #right li.subleft{font-size: 20px;font-weight: bold;color: #333333; margin-top:20px; padding: 0 0px;}                          /*서브타이틀*/
#subcon #right li.subright{text-align:right; margin-top:-25px; }                                                      /*서브네비게이션*/
#subcon #right li.main{margin-top:20px;margin-bottom:30px;font-size: 14px;font-weight:400; line-height:2.0; color:#606060;  padding-top:20px;BORDER-top: #979797 1px dashed; }               /*서브내용*/





#submenu {display: inline-block; position:relative; width:100%; background:#506182;}  
#submenu #left {
	display: flex;
	display: -webkit-flex;
	align-items: center;
	-webkit-align-items: center;
	position: relative;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-left:-10px;
}  
#submenu #left li {
	position: relative;
	padding: 0 14px;
	line-height: 1em;
	border-right: 1px solid #c1c1c0;
}
#submenu #left li:first-child::after {
	content: '>';
	font-weight: 900;
	color: #fff;
	opacity: 0.4;
	position: absolute;
	top: 50%;
	right: -5px;
	margin-top: -.5em;
}
#submenu #left li:first-child,
#submenu #left li:last-child {
	border-right: none;
}
          
#submenu #left li a {
	font-weight: 600;
	color: #c1c1c0;
}


#submenu2 { display: inline-block; relative; width:100%; padding-top: 20px;  background:#ffffff;  BORDER-top: #e9e9e9 0px solid;}  
#submenu2 #left{position: relative; width: 100%; max-width: 1002px;	margin: 0 auto; padding: 0 0px;}                                   
#submenu2 #left li{float:left;margin-right:0px; }




#lineh {padding: 0px; width: 100%; background: #E0E0E0;	height: 1px; }                                                /*라인*/


#footer {position:relative;	background:#ffffff; padding: 0px; width:100%;}  /*하단*/
#footer .center {
	width:100%;
	padding: 10px;
	text-align: center;
	background:#0d9991;
}            
#footer .center li {
	display: inline-block;
	padding: 0 10px;
	line-height: 1em;
	border-right: 1px solid #ffffff;
}
#footer .center li:last-child {
	border-right: none;
}
#footer .center li a {
	color: #ffffff;
}

#footer .info-area {
	display: flex;
	display: -webkit-flex;
	padding: 20px;
}
#footer .logo {
	position: relative;
}
#footer .info {
	font-size: .9em;
	padding: 0 20px;
}
#footer #admin{position:absolute;top:80px;right:50%;margin-right:-501px;}
#footer #admin li{float:left;margin-left:0px;}


	
/*----index_main 효과--------------------------------------------------------------------*/	

.image-area {
	position: relative;
	width: 100%;
}
.image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#mainflash {                    /*index_main의 헤드라인 이미지*/
    POSITION: relative;		
	width: 100%;
	/* background: url();
	background-position: top center;		 */
	padding-top: 135px;			
	text-align: center;	
}		






/*----sub페이지 효과--------------------------------------------------------------------*/	
	
#subflash {                    /*sub페이지 헤드라인 이미지*/
		position:relative;			
		width: 100%;
		padding-top: 135px;
		text-align:center;
}
#subflash-image {
	position: relative;
	height: 248px;	       /*sub이미지 높이에 맞게*/	
	background-size: cover;
	background-position: bottom center;
	background-repeat: no-repeat;
}
#subflash .title-area {
	z-index: 1;
	color: #fff;
	position: absolute;
	top: 50%;
	left: 50%;
    white-space: normal;
	text-align: right;
	transform: translate(-50%,-50%);
}
#subflash .title-area1 {
	z-index: 1;
	color: #000000;
	position: absolute;
	top: 50%;
	left: 50%;
    white-space: normal;
	text-align: right;
	transform: translate(-50%,-50%);
}
#subflash .title {
	display: inline-block;
	width: 100%;
	max-width: 500px;
	padding: 20px 30px;
	text-align: left;
}
#subflash .title h1 {
	font-size: 3.4em;
	line-height: 1em;
}
#subflash .title h2 {
	font-size: 2em;
	line-height: 1em;
}
#subflash .title p {
	font-size: 1.1em;
	line-height: 1em;
	padding-top: 20px;
}
#overview-list {}
#subcon #right #overview-list li {
	display: flex;
	display: -webkit-flex;
	align-items: center;
	-webkit-align-items: center;
	margin: 0;
	padding: 10px 0;
}
#overview-list li .key {
	flex: 0 0 130px;
	color: #fff;
	padding: 5px 10px;
	border-radius: 3px;
	background-color: #506182;
}
#overview-list li .key.stretch {
	align-self: stretch;
}
#overview-list li .value {
	flex: 1;
	padding: 0 10px;
}
#smalloutline.certificaion {
	margin-bottom: 20px;
}
/*----서브메뉴 마우스오버스 효과시작------------------------------------------------------------*/

.leftm ul {list-style: none;}

.leftm li {
		 margin-bottom:2px;
		 margin-left:2px;
		 text-indent:0px;		
		 text-align:center;
		 vertical-align:middle;
		 display:inline-block;
		 font-size:13px;
		 color:#4b4b4b;		
		 padding:10px;
		 border-color:#c2c2c2;
		 BACKGROUND-COLOR: #c2c2c2;
		 border-width:0px;
		 border-style:solid;
		 line-height:20px;

		}

.leftm li.on b,.leftm li:hover b {
         text-indent:0px;		
		 text-align:center;
		 vertical-align:middle;
		 display:inline-block;
		 font-size:13px;
		 color:#c2c8d4;		 
		 margin:-10px;
		 padding-left:10px;
		 padding-right:10px;
		 border-color:#243963;
		 BACKGROUND-COLOR: #243963;
		 border-width:0px;
		 border-style:solid;
       }
.leftm li.title {	
	BACKGROUND-COLOR:#506182;
	COLOR:#ffffff;
	
	}


.leftm2 ul {list-style: none;}

.leftm2 li {
		 text-align:center;
		 display:inline-block;
		 font-size:13px;
		 color:#4b4b4b;	
		}

.leftm2 li.on b,.leftm2 li:hover b {
         	
		 text-align:center;		
		 display:inline-block;
		 font-size:13px;
		 color:#ff7e00;		
		 
       }


/*----모바일컨텐츠여백------------------------------------------------------------*/
@media screen and (max-width:1002px){
#subcon #right{padding-left:15px; padding-right:15px;} 
#submenu2 { padding-left:15px; padding-right:15px;}  
#mainbg-wrap {	padding: 0 0px;}	
}

@media screen and (max-width:800px) {
    #left-nav {
    	display: none;
    }
	#global .global-wrap {
		padding: 10px;
	}
	.desktop-hidden {
		display: block;
	}
	.mobile-hidden {
		display: none;
	}
	#global-right {
		padding-right: 10px
	}
	#toplogo {
		width: 100px;
	}
	#topquick {
		padding: 0 10px;
	}
	#topquick img {
		width: 100%;
	}
	#subcon #right{
		padding-left:15px;
		padding-right:15px;
	}
	#mainbg2-wrap .part {
		width: 48%;
		margin-bottom: 24px;
	}
	
	#mainbg6-wrap ul {
		text-align: left;
	}
	#mainbg6-wrap ul li {
		display: block;
		width: 100%;
		max-width: 218px;
		margin: 5px auto;
	}
	#mainbg4-wrap {
		flex-direction: column;
		-webkit-flex-direction: column;
	}
	#mainbg4-wrap .right {
		flex: 0 1 auto;
		padding: 20px 0;
	}
	#footer .center li {
		display: block;
		padding: 5px;
		border: none;
	}
	#footer .logo {
		padding-bottom: 20px;
		text-align: center;
	}
	#footer .info-area {
		flex-direction: column;
		-webkit-flex-direction: column;
		text-align: center;
	}
	
	#subflash {
	    padding-top: 56px;
	}
	#subflash .title h1 {
		font-size: 2.4em;
		line-height: 1em;
	}
	#subflash .title h2 {
		font-size: 1.1em;
	}
	#subflash .title p {
		font-size: .9em;
		padding-top: 10px;
	}
	#submenu #left {
		display: none;
	}
	#subcon #right #overview-list li {
		flex-direction: column;
		-webkit-flex-direction: column;
		align-items: stretch;
		-webkit-align-items: stretch;
	}
	#overview-list li .key {
		flex: auto;
	}
	#overview-list li .value {
		padding: 10px;
	}
	#newinfoproduct a {
	display:  inline-block;
	width: 50%;
	height:217px;
}
}



@media screen and (max-width:600px) {
   
	#mainbg3-wrap .part,
	#mainbg5-wrap .part {
		align-items: center;
		-webkit-align-items: center;
		flex-direction: column;
		-webkit-flex-direction: column;
		width: 100%;
		max-width: 400px;
		margin: 0 auto 60px;
		padding: 20px 0;
		text-align: center;
	}
	#mainbg3-wrap .info-area,
	#mainbg5-wrap .info-area {
		width: 100%;
		padding: 0 0 30px;
	}
	#mainbg3-wrap .image-area,
	#mainbg5-wrap .image-area {
		width: 190px;
		margin-bottom: 20px;
		padding-top: 148px;
	}
	#mainbg3-wrap .btn,
	#mainbg5-wrap .btn {
		margin: 0 auto;
	}
	#newmainbg2-wrap .newpart1 {
	position: relative;
	width: 100%;
	padding-bottom: 66px;
}
#newmainbg2 {background: #ffffff; margin-top:20px; margin-bottom:20px;}
	
}


@media screen and (max-width:480px) {
	#mainbg2-wrap .part {
		width: 100%;
	}
	#mainbg2-wrap .view-btn {top:16px;}
    #mainbg4-wrap {
	display: flex;
	display: -webkit-flex;
	padding: 20px 10px;
	}
	#mainbg4-wrap .right {
	position: relative;
	flex: 1;
	font-size: 1.0em;
	padding:10px;
	}
	#mainbg4-wrap .left {
	text-align:center;
	}
	#mainbg4-wrap h1 {
    font-size: 20px;
    font-weight: 500;
    color: #333333;
    line-height: 1.2;
    border-top: 0px solid #666666;
    padding-top: 0px;
	padding-left:10px;
	}
   #mainbg3-wrap .part,
   #mainbg5-wrap .part {
		margin: 0 auto 0px;
		padding: 5px ;
		padding-BOTTOM: 10px ;
		text-align: center;
		
	}
	#mainbg3-wrap,
	#mainbg5-wrap {
	padding: 0px;
	}
	#mainbg3-wrap .image-area,
	#mainbg5-wrap .image-area {
		width: 190px;
		margin-bottom: 10px;
		padding-top: 148px;
	}
	#mainbg6 {
	padding: 5px 0;	
	}
	#footer .center li {
	display: inline-block;	
	border-right: 1px solid #c1c1c0;
	}
	#mainbg,
	#mainbg2,
	#newmainbg-wrap3,
	#newinfoproduct {
	padding: 20px;
	padding-top:0px;
	padding-bottom:0px;
	text-align:center;
	}
	#subflash-image {	
	height: 150px;	       /*sub이미지 높이에 맞게*/	
	
	}
	
	#newinfoproduct a {
	display:  inline-block;
	width: 100%;
	height:217px;
}




}

/*----서브컨텐츠------------------------------------------------------------*/


#box_a{
		height:auto; width:35%; float:left;  
		}
#box_b{
		height:auto; width:5%; float:left;
		}
#box_c{
		height:auto; width:100%; float:right;
		}
#box_d{
		height:auto; width:100%; float:LEFT; display: block;
		}
/*----서브컨텐츠반응형------------------------------------------------------------*/
@media screen and (max-width:1002px){
#box_a {float:none; width:auto;}
#box_b {float:none; width:auto;}
#box_c {float:none; clear:both; width:auto;}
#box_d {float:none; clear:both; width:auto;}

  }

@media screen and (max-width:800px){
	#mainflash {
		padding-top: 57.52px;
	}
	#box_a {float:none; width:auto;}
}







/*----서브 사업분야 컨텐츠반응형------------------------------------------------------------*/



#box_sub02_01{ 
		height:auto; width:48%; float:left;  
		}
#box_sub02_02{
		height:auto; width:4%; float:left;
		}
#box_sub02_03{
		height:auto; width:48%; float:right;
		}
#box_sub02_01title{ 
		height:auto; width:48%; float:left; 
		text-align: center;
		}


@media screen and (max-width:1002px){
#box_sub02_01 {float:none; width:auto;}
#box_sub02_02 {float:none; width:auto;}
#box_sub02_03 {float:none; clear:both; width:auto;}
  }

@media screen and (max-width:800px){
#box_sub02_01 {float:none; width:auto;}
  }





#sub02-table-wrap {
	overflow-x: auto;
}



/*----테이블반응형------------------------------------------------------------*/



.test { text-align: center; }
.test td.test01{ width:23%; }
.test td.test05{ width:2.5%; }


@media screen and (max-width: 800px){

.test { text-align: center; }
.test td.test01{ display:block; width:100%; }
.test td.test05{ display:none; width:95%; }




}