#contents {
    position: relative;
    width: 100%;
}

.localNav_area {
    width: 100%;
    z-index: 2;
    color: #333;
    border-bottom: 1px solid #ddd;
    background-color: rgba( 243, 243, 243, 0.9);
		-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}
.localNav {
    width: 980px;
    margin: 0 auto;
    height: 40px;
}
.localNav > p {
    padding: 0 15px;
    border-left: 1px solid #ddd;
}
.localNav_area .sp_home {
    width: 15px;
    padding-top: 13px;
}
.localNav_area .sp_home img{width:100%;}

.localNav > p {
    height: 40px;
    border-right: 1px solid #ddd;
}

.localNav .localNav_1 {
    display: block;
    border-left: 0px;
}

.localNav > p {
    padding: 0 15px;
}
.localNav > p > span {
    padding: 11px 0 8px;
}
.localNav > p, .localNav > p > span, .menuLink {
    float: left;
}
.menuLink {
    position: relative;
    border-right: 1px solid #ddd;
    vertical-align: top;
    z-index: 1030;
}
.menuLink > a {
    padding: 10px 15px 8px;
    font-size: 13px;
    letter-spacing: 0px;
    display: block;
    font-weight: bold;
    margin-top: 1px;
    height: 40px;
    white-space: nowrap;
}
.menuLink .menu {
    display: none;
    position: absolute;
    top: 40px;
    left: 0px;
    padding: 0px;
    border: 1px solid #ccc;
    background: #fff;
    max-height: 350px;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 1030;
}

.menuLink .menu li a {
    padding: 8px 15px;
    font-size: 13px;
    letter-spacing: 0px;
    position: relative;
    display: block;
    white-space: nowrap;
    background: #fff;
    line-height: 1.2;
    z-index: 1030;
}
.menuLink .menu a:hover, .menuLink .menu li.hover a:hover {color:#fff; text-decoration:none; background:#2475d0;}

.menuLink .menu li.on a {color:#fff; text-decoration:none; background:#2475d0;}
.sp_img {
    display: inline-block;
    padding-left: 10px;
    vertical-align: middle;
}
.sp_img img {
    width: 10px;
    vertical-align: middle;
}
.localNav > p {
    height: 40px;
    border-right: 1px solid #ddd;
}
.wap_pro_class{background:url(../images/bg_pro_class.jpg); overflow:hidden; padding-bottom:30px;}

#content_area {
    width: 1199px;
    margin: 0 auto;
    padding-bottom: 80px;
    position: relative;
    padding-top: 41px; 
}
.h3_area {
    height: 113px;
    border-bottom: 1px solid #bebebe;
}
.sub_visual2 {
    height: 113px;
    background: url(../images/bg_pro_tit.png) no-repeat;
	width:1199px; height:82px;
}
#content_area .tit {
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 0px;
	    font-size: 34px;
    padding-top: 33px;
	
	    font-weight: bold;
    margin: 0;
    color: #000;
    line-height: 1.2;
}
#content_area h3 {
    letter-spacing: -0.05em;
}

.product_posco {
    position: relative;
    margin-top: 30px;
}

.product_posco ul {
    width: 100%;
    position: relative;
    overflow: hidden;
		-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}

.product_posco > ul > li {
    background-size: 0% !important;
    float: left;
    width: 32%;
    margin-right: 2%;
    margin-bottom: 20px;

    position: relative;
    height: 183px;
    border: 1px solid #e5e5e5;
}
.product_posco > ul > li:hover {
    background-size: cover !important;
}

.product_posco .pr01 a, .product_posco .pr02 a, .product_posco .pr03 a, .product_posco .pr04 a, .product_posco .pr05 a, .product_posco .pr06 a, .product_posco .pr07 a, .product_posco .pr08 a, .product_posco .pr09 a, .product_posco .pr10 a, .product_posco .pr11 a, .product_posco .pr12 a {
    display: block;
    height: 183px;
    position: relative;
    letter-spacing: 0;
}
.product_posco > ul > li:hover a {
    text-decoration: none !important;
}
.product_posco li a .pr_tit {
    font-family: 'Malgun Gothic';
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 4px;
    padding: 20px 0 0px 20px;
}
.product_posco li a:hover div {
    color: #fff;
    width: 59%;
    overflow: hidden;
    padding-left: 20px;
    font-size: 13px;
    line-height: 1.3;
}
.product_posco li a .pr_tit {
    font-family: 'Malgun Gothic';
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 4px;
    padding: 20px 0 0px 20px;
}

.product_posco li a .cont {
    width: 59%;
    overflow: hidden;
    padding-left: 20px;
    font-size: 13px;
    line-height: 1.3;
}
.product_posco li a:hover .cont {
    color: #fff;
}
.product_posco li a:hover img {
    display: none;
}
.product_posco li a:hover img {
    display: none;
}
#content_area img {
    /*width: auto;
    padding-top: 0;
    position: absolute;
    right: 0px;
    bottom: 25px;*/
}
#content_area .sp_img img {width:15px;vertical-align:middle;}
#content_area p.img img {width:auto; vertical-align:middle;}
#content_area .tabCont img{position:relative; bottom:auto; padding:10px;}


#content_area .proclass{}
#content_area .proclass li{float:left; width:23%; margin-right:2.666%; background:#fff;}
#content_area .proclass li:nth-child(1){width:48.66%; margin-right:2.666%;}
#content_area .proclass li:nth-child(2){width:48.66%; margin-right:0;}
#content_area .proclass li:nth-child(n+3){ margin-top:30px;}
#content_area .proclass li:nth-child(6),
#content_area .proclass li:nth-child(10),
#content_area .proclass li:nth-child(14),
#content_area .proclass li:nth-child(18),
#content_area .proclass li:nth-child(22){margin-right:0;}

#content_area .proclass li a{ color:#000;}
#content_area .proclass li a .pic{width:100%; min-height:170px; overflow:hidden;}
#content_area .proclass li a .pic img{width:100%; height:auto; position:relative;}
#content_area .proclass li a h2{margin:0 10px; font-size:22px; }
#content_area .proclass li a p{line-height:30px; height:60px; font-size:15px; overflow:hidden; padding:0 10px; color:#8f8f8f;}

#content_area .proclass li:nth-child(-n+2) a .pic{width:40%; min-height:170px; overflow:hidden; float:right;}
#content_area .proclass li:nth-child(-n+2) a h2{width:50%; margin:0 10px;}
#content_area .proclass li:nth-child(-n+2) a p{width:50%;line-height:30px; height:90px; overflow:hidden; padding:0 10px;}
#content_area .proclass li a p.more{background:#3254ad; border-radius:5px; width:83px; height:35px; color:#fff; margin:10px 10px 0;}
#content_area .proclass li a p.more2{padding:0; height:38px; width:100%; clear:both; text-align:right; margin-top:15px;}
#content_area .proclass li a p.more2 img{}
#content_area .proclass li:nth-child(n+3) a p.more{display:none;}



.product_posco li a .btn-view img {
    display: block;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 1;
}
.product_posco li a img {
    bottom: 25px;
}



@media (max-width: 980px){
	#content_area {
		width: 100%;
		margin: 0 auto;
		padding-bottom: 80px;
		position: relative;
		padding-top: 41px;
	}
	
	.product_posco > ul > li {
		background-size: 0% !important;
		width: 98%;
		margin-right: 2%;
		margin-bottom: 20px;
	
		position: relative;
		height: 183px;
		border: 1px solid #e5e5e5;
	}
	.product_posco > ul > li:hover {
		background-size: cover !important;
	}
	
	.product_posco .pr01 a, .product_posco .pr02 a, .product_posco .pr03 a, .product_posco .pr04 a, .product_posco .pr05 a, .product_posco .pr06 a, .product_posco .pr07 a, .product_posco .pr08 a, .product_posco .pr09 a, .product_posco .pr10 a, .product_posco .pr11 a, .product_posco .pr12 a {
		display: block;
		height: 183px;
		position: relative;
		letter-spacing: 0;
	}
	.product_posco > ul > li:hover a {
		text-decoration: none !important;
	}
	.product_posco li a .pr_tit {
		font-family: 'Malgun Gothic';
		font-weight: 600;
		font-size: 20px;
		margin-bottom: 4px;
		padding: 20px 0 0px 20px;
	}
	.product_posco li a:hover div {
		color: #fff;
		width: 59%;
		overflow: hidden;
		padding-left: 20px;
		font-size: 13px;
		line-height: 1.3;
	}
	.product_posco li a .pr_tit {
		font-family: 'Malgun Gothic';
		font-weight: 600;
		font-size: 20px;
		margin-bottom: 4px;
		padding: 20px 0 0px 20px;
	}
	
	.product_posco li a .cont {
		width: 59%;
		overflow: hidden;
		padding-left: 20px;
		font-size: 13px;
		line-height: 1.3;
	}
	.product_posco li a:hover .cont {
		color: #fff;
	}
	.product_posco li a:hover img {
		display: none;
	}
	.product_posco li a:hover img {
		display: none;
	}
	#content_area img {
		width: auto;
		padding-top: 0;
		position: absolute;
		right: 0px;
		bottom: 25px;
	}
	.product_posco li a .btn-view img {
		display: block;
		position: absolute;
		right: 0px;
		top: 0px;
		z-index: 1;
	}
	.product_posco li a img {
		bottom: 25px;
	}


#content_area .proclass{}
#content_area .proclass li{float:left; width:48%; margin-right:4%; background:#fff;}
#content_area .proclass li:nth-child(5){margin-right:4%;}
#content_area .proclass li:nth-child(2n){margin-right:0;}
#content_area .proclass li:nth-child(n+3){ margin-top:20px;}
#content_area .proclass li a .pic{width:100%; min-height:170px; overflow:hidden; float:none; width:100%;}
#content_area .proclass li a .pic img{width:100%; height:auto; position:relative;}
#content_area .proclass li a h2{margin:0 10px; width:100%;}
#content_area .proclass li a p{line-height:30px; height:90px; overflow:hidden; padding:0 10px; width:100%;}
#content_area .proclass li:nth-child(-n+2) a .pic{width:100%;}
#content_area .proclass li:nth-child(-n+2) a h2{width:100%;}
#content_area .proclass li:nth-child(-n+2) a p{width:100%; height:99px;}
#content_area .proclass li:nth-child(1){width:48%; margin-right:4%;}
#content_area .proclass li:nth-child(2){width:48%; margin-right:0;}
}


.article-content img{max-width:100%;}

.pro_sTxt {
    margin-top: 20px;
    padding-top: 10px;
}
.tit4 {
    padding-left: 18px;
    font-weight: bold;
    font-size: 16px;
    color: #0552a9;
    line-height: 1.4;
    background: url(../images/blt_circle.png) no-repeat left 5px;
}
.tab_area {
    position: relative;
}
.mt-15 {
    margin-top: 15px !important;
}
.tab_con {
    width: 100%;
    border-left: 1px solid #d6d6d6;
    overflow: hidden;
}
.tab_con li {
    width: 20%;
    float: left;
}

.tab_con li.on a, .tab_con li a:hover {
    color: #fff;
    border-top: 1px solid #2475d0;
    border-bottom: 1px solid #2475d0;
    background: #2475d0;
}
.tab_con li.on a {
    color: #fff;
    border: 1px solid #2475d0;
    background: #2475d0;
    text-decoration: underline;
}
.tab_con li a {
    display: block;
    font-weight: bold;
    font-size: 14px;
    height: 30px;
    margin-top: -1px;
    margin-left: -1px;
    padding: 8px 0 0;
    text-align: center;
    border: 1px solid #d6d6d6;
    background: #fff;
}


.pro_gray_box {
    padding: 0 20px 30px;
    min-height: 159px;
}
.pro_gray_box {
    position: relative;
    margin-top: 30px;
    padding: 0 10px 20px;
    border: 1px solid #d5d5d5;
    background: #f9f9f9;
}
