@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');
* {box-sizing:  border-box;}


.img_box {text-align: center; vertical-align: middle; }
.img_box_l {text-align: left; vertical-align: middle;}
.img_box img, .img_box_l img {max-width: 100%; height: auto; vertical-align: middle;}


.center, .center th{text-align: center !important;}
.left {text-align: left !important;}
.fl_w {width: 100%;}
.fl_w .fl_l {float: left; width: 50%;}
.fl_w .fl_r {float: right; width: 50%;}
.fl_w:after{display: block; content: ""; clear: both;}

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


/*인사말*/
#abright .tx0-1 span {display: block; color: #2eaa33; font-size: 15px;}
#abright .tx0-1 span strong {color: #f00708; font-weight: 600;}
.sign {text-align: right; margin: 40px auto 0;}
.sign span{ font-family: 'Nanum Pen Script', cursive; font-size: 28px; padding-left: 7px; letter-spacing: 3px;}



/*제품소개*/
.dep2 {width: 100%; padding: 0; margin: 0 auto 40px;}
.dep2 ul {width: 100%; }
.dep2 li {display: inline-block; width: 24%;}
.dep2 li a {display: block; background-color: #E8E8E8; transition: all 0.3s; margin-bottom: 5px; 
    letter-spacing: -0.3px; color: #666; padding: 5px; font-weight: 600; text-align: center;}
.dep2 li a:hover {color: #229b3d;}
.dep2 .active a {background-color: #229b3d; color: #fff !important;}
.dep2 .active a:hover {background-color: #229b3d; color: #fff;}
.product {width: 100%; font-size: 13px;}
.product h3 {font-size: 16px; font-weight: bold;color: #163583; margin: 0 auto 10px; font-weight: bold;}
.product h3 span {font-size: 13px; color: #333;}
.product h4 {font-size: 14px; font-weight: bold; margin: 0 auto 10px; color:#163583; }
.product .fl_w2 .fl_l {width: 42%;}
.product .fl_w2 .fl_r {width: 57%;}
.fl_w1 .p_txt_li, .fl_w1 .p_btn {padding-left: 5px;}
.fl_w1 .img_box_l {margin: 0 auto 5px;}
.fl_w1 .p_txt_li {margin:0 auto 5px; }
.fl_w1 .p_btn a {margin-bottom: 5px;}
.p_wrap {margin: 0 auto 50px;}
/* 제품소개_표 */
.tbl_type3,.tbl_type3 th,.tbl_type3 td{border:0}
.tbl_type3{width:100%; font-size:13px; border-collapse:collapse; border-top:2px solid #163583;}
.tbl_type3 caption{display:none;}
.tbl_type3 th{padding:7px 7px; background-color:#f5f5f5; text-align:center; color:#666666;border:1px solid #d7d7d7; }
.tbl_type3 td{padding:7px 7px; text-align:center;border:1px solid #d7d7d7;}
/*동영상 보기 버튼*/
.p_btn a {display: inline-block; padding: 5px 15px; border: 1px solid #478ccd; color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#7aafe4+1,1e5799+100 */
background: #7aafe4; /* Old browsers */
background: -moz-linear-gradient(left,  #7aafe4 1%, #478ccd 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #7aafe4 1%,#478ccd 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #7aafe4 1%,#478ccd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7aafe4', endColorstr='#478ccd',GradientType=1 ); /* IE6-9 */
}
.p_btn a:hover {background:#229b3d; border: 1px solid #229b3d;}
.p_video {margin: 20px auto 10px;}
.h3-btn, .p_img {margin: 0 auto 10px; vertical-align: middle;}
.h3-btn h3{display: inline-block; float: left; margin: 0; }
.h3-btn .p_btnwrap {display: inline-block; float: right; text-align: right;}
.h3-btn:after{display: block; content: ""; clear: both;}
.p_img img {width: 100%; height: auto;}
.p_page a { display: inline-block; vertical-align: middle; padding: 0px 10px 2px;
    text-align: center; line-height: 18px; border: #ccc 1px solid;}
.p_page .on {border: #5a5a5a 1px solid; background: #707070; color: #fff;}


#s_navi #sub_customer {margin-bottom: 20px;}
.sub_link { clear: both;}
.sub_link ul {width: 100%;}
.sub_link ul li {margin: 0 auto 10px; width: 100%;}
.sub_link ul li a {width: 100%; display: block; padding: 10px; letter-spacing: -0.5px; transition: all .3s;}
.sub_link ul li:first-child { background:#2cabe0; }
.sub_link ul li:nth-child(2) { background:#1a4b28; }
.sub_link ul li:last-child { background:#f0b000; }
.sub_link ul li a h4 {color: #fff; font-weight: 600; font-size: 14px; letter-spacing: -1px;}
.sub_link ul li a p {font-size: 11px; line-height: 1.5em; color: #fefefe}
.sub_link ul li a:hover {background: #666;  transition: all .3s;}

/*반응형코드*/
@media all and (max-width:991px) {

}

@media all and (max-width:768px) {
	.dep2 li {width: 49%;}
.product .img_box_l {text-align: center;}
.p_wrap {margin: 0 auto 40px;}
.product .fl_w2 .fl_l {width: 100%; margin: 0 auto 20px;}
.product .fl_w2 .fl_r {width: 100%;}
.product .fl_w1 .fl_l {width: 100%; margin: 0 auto 40px;}
.product .fl_w1 .fl_r {width: 100%;}
.pc_view {display: none;}
}