@charset "utf-8";

#s_visu {width:100%; height:450px; background-repeat:no-repeat; background-position:center center; background-size:cover; display:table}
#s_visu > div {display:table-cell; text-align:center; vertical-align:middle; color:#fff;}
#s_visu h2 {font-size:2.7em; font-weight:bold; margin-bottom:10px;}
#s_visu p {font-size:1em; opacity:0.9em; font-weight:200;}

.s_visu1 {background-image:url(/images/sub/s_visual1.jpg)}

@media screen and (max-width:1024px){
	#s_visu {height:350px;}
}

@media screen and (max-width:767px){
	#s_visu h2 {font-size:2.5em; margin-bottom:1%}
}

@media screen and (max-width:500px){
	#s_visu {height:250px;}
}




/* sub_top */
.sub_top {position:relative;width:100%; margin:0 auto; background:#fff; box-sizing:border-box; border-bottom:1px solid #e2e2e2; z-index:0;}
.sub_top .sub_top_in {width:100%; max-width:1280px; margin:0 auto; position:relative; z-index:50;}
.snb:after { content:"."; display:block; height:0; clear:both; visibility:hidden;}
.snb>div { float:left; position:relative;}
.snb .home>a { display:block; width:60px; height:60px; text-align:center; font-size:0; background:#074372 url("/images/sub/ico_home.png") no-repeat center; border-right:1px solid #e2e2e2}
.snb>.depth1_area, .snb>.depth2_area { width:250px;}
.snb>.depth1_area, .snb>.depth2_area  a {color:#074372; }
.snb .open_depth { display:block; position:relative; height:60px; line-height: 60px; padding:0 20px; border-right:1px solid #e2e2e2; color:#4b4b4b; font-size:1em; white-space:nowrap;}
.snb .open_depth:after { content:"\e874"; display:inline-block; position:absolute; top:0; right:14px; font-family:'Linearicons-Free'; font-size:10px; line-height:60px; color:#000;}
.snb .open_depth.on:after { content:"\e873"; top:0;}
.snb .smenu { display:none; position:absolute; top:60px; left:0; width:100%;}
.snb .smenu>li>a { display:block; padding:12px 5px 13px 20px; border:1px solid #ccc; border-top:none; background-color:#f4f4f4; color:#555; font-size:14px;}
.snb .smenu>li>a:hover { background-color:#fff; color:#222;}

@media screen and (max-width:1199px){
	.sub_top {width:100%;}
}

@media screen and (max-width:767px){
/* sub_top */
	.sub_top { height:46px;}
	.snb { padding-left:45px;}
	.snb .home { position:absolute; top:0; left:0; z-index:10;}
	.snb .home>a { width:45px; height:45px; background-size:100% auto}
	.snb .home>a:before { font-size:13px; line-height:13px;}
	.snb>.depth1_area, .snb>.depth2_area { width:50%;}
	.snb .open_depth { height:45px; line-height: 45px; padding:0px 12px 0px 12px; font-size:1em; overflow:hidden; text-overflow:ellipsis; }
	.snb .open_depth:after { /*top:13px;*/ right:6px; font-size:9px; line-height:45px;}
	.snb .open_depth.on:after { top:12px;}
	.snb .smenu { top:45px;}
	.snb .smenu>li>a { padding:7px 5px 8px 7px; font-size:12px;}

}


#subContent {width:100%; margin:80px 0;}
#subTitle {font-size:2.4em; color:#222; font-weight:bold; text-align:center; margin-bottom:60px;}

@media screen and (max-width:1024px){
	#subContent {margin:7% 0}
	#subTitle {margin-bottom:5%}
}

@media screen and (max-width:767px){
	#subTitle {font-size:2.2em;}
}



/*������*/
.tabmenu1 { overflow: hidden; text-align: center; margin: 0 auto 50px; }
.tabmenu1 li { width: 180px; display: inline-block; *zoom:1; *display: inline; }
.tabmenu1 li a { display: block; line-height: 3.5em; border:1px solid #ddd; font-size: 1.05em; color:#555; }
.tabmenu1 li a:hover { color:#074372;  }
.tabmenu1 li.on a { background:#074372; color:#fff; }

@media screen and (max-width:976px) {

.tabmenu1 { margin: 7% auto 0; }
.tabmenu1 li { width: 24%; margin-bottom: 3px; }

}

@media screen and (max-width:568px) {

.tabmenu1 li { padding: 0; }

}


.tabmenu2 { margin: 0 auto 30px; max-width: 1280px; width: 98%; }
.tabmenu2 li { width: 156px; display: inline-block; *zoom:1; *display: inline; margin-bottom: 0.2%; }
.tabmenu2 li a { display: block; line-height: 3.5em; border:1px solid #ddd; font-size: 1em; color:#555; text-align: center; }
.tabmenu2 li a:hover { color:#074372;  }
.tabmenu2 li.on a { background:#074372; color:#fff; }

.tabmenu2_2 li {width:250px;}

.tabmenu2 li.wide { width: 200px; }

@media screen and (max-width:976px) {

.tabmenu2 { }
.tabmenu2 li { width: 24%; margin-bottom: 3px; }

.tabmenu2_2 li {width:32.5%}

}

@media screen and (max-width:568px) {

.tabmenu2 li { padding: 0; }

}

@media screen and (max-width:408px) {
	.tabmenu2 li a { font-size: 0.86em; }
}

/* ������ �ν��� ���� �κ� */
/* #page01 .tabmenu2  a.menu1,
#page02 .tabmenu2  a.menu2,
#page03 .tabmenu2  a.menu3,
#page04 .tabmenu2  a.menu4,
#page05 .tabmenu2  a.menu5,
#page06 .tabmenu2  a.menu6,
#page07 .tabmenu2  a.menu7,
#page08 .tabmenu2  a.menu8,
#page09 .tabmenu2  a.menu9,
#page10 .tabmenu2  a.menu10,
#page11 .tabmenu2  a.menu11 { background:#25aae1; color:#fff; }


#page01 .tabmenu1  a.menu1,
#page02 .tabmenu1  a.menu2,
#page03 .tabmenu1  a.menu3,
#page04 .tabmenu1  a.menu4,
#page05 .tabmenu1  a.menu5,
#page06 .tabmenu1  a.menu6,
#page07 .tabmenu1  a.menu7,
#page08 .tabmenu1  a.menu8,
#page09 .tabmenu1  a.menu9,
#page10 .tabmenu1  a.menu10,
#page11 .tabmenu1  a.menu11 { background:#074372; color:#fff; }*/


a.prod-active{background-color: #25aae1; color: #fff !important;}


/*��ǰ�Ұ� ��ü����Ʈ*/
.product_list ul { width: 100%; height: auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
.product_list ul li { width: 31%; margin-bottom: 3%;  }
.product_list ul li a img { width: 100%; border: 1px solid #ddd; }

.product_list ul.product_list2 { justify-content: flex-start; }
.product_list ul.product_list2 li { margin-right: 3.5%; }
.product_list ul.product_list2 li:last-child { margin-right: 0; }
.product_list ul.product_list2 li:nth-child(3) { margin-right: 0; }
.product_list ul.product_list2 li:nth-child(6) { margin-right: 0; }
.product_list ul.product_list2 li:nth-child(9) { margin-right: 0; }
.product_list ul.product_list2 li a img { border: 1px solid #ddd; }

.product_tit { font-size: 1.55em; font-weight: 600; color: #074372; }

@media screen and (max-width:976px) {
	.product_list ul { margin-top: 6%; }
	.product_list ul.product_list2 { margin-top: 0; }
}
@media screen and (max-width:767px) {
	.product_list ul li { width: 49%; margin-bottom: 3%; }
	.product_list ul.product_list2 li { width: 49%; margin-bottom: 3%; margin-right: 0; }
	.product_list ul.product_list2 { justify-content: space-between; }
}