@charset "utf-8";
@font-face {font-family: 'SUIT';	font-weight: 300;
	src: url('/css/suit/SUIT-Light.woff2') format('woff2');
}
@font-face {	font-family: 'SUIT';	font-weight: 400;
	src: url('/css/suit/SUIT-Regular.woff2') format('woff2');
}
@font-face {font-family: 'SUIT';	font-weight: 500;
	src: url('/css/suit/SUIT-Medium.woff2') format('woff2');
}
@font-face {	font-family: 'SUIT';	font-weight: 700;
	src: url('/css/suit/SUIT-Bold.woff2') format('woff2');
}
@font-face {	font-family: 'SUIT';	font-weight: 900;
	src: url('/css/suit/SUIT-Heavy.woff2') format('woff2');
}
@font-face { font-family: 'GmarketSans'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight: 700; font-style: normal; }
@font-face { font-family: 'GmarketSans'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff'); font-weight: 500; font-style: normal; }
@font-face { font-family: 'GmarketSans'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff'); font-weight: 300; font-style: normal; }



*{margin:0; padding:0; font-family: 'GmarketSans','SUIT', sans-serif; box-sizing:border-box;word-break:break-all;}
*[onclick*="href"],*[onclick*="history"]{cursor:pointer;}
html { font-smoothing: antialiased; font-smooth:always;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
html.open{position:fixed; height:auto; }
body{color: #202020; width:100%; position: relative; letter-spacing:-0.5px; line-height: 1.5; }
img {border:0; vertical-align:baseline; max-width:100%;}
a{color: inherit; text-decoration:none; cursor:pointer;}
button{cursor:pointer; font-family: 'SUIT', sans-serif;}
h1,h2,h3,h4,h5,h6{margin:0}
li{list-style:none}
input{outline-style:none; font-family: 'SUIT', sans-serif;}
select{outline-style:none; }
label{cursor:pointer; }
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none;  margin: 0;}
ul, menu, dir{display: block; list-style-type: none; overflow:hidden; height:auto;}
.clear{clear:both}
.clear_25px{clear:both; height:25px}
.ft_right{float:right;}
.ft_left{float:left;}

#wrap{width:100%;  position:relative; margin:0 auto; max-width:720px;}
#header{background:#c02a2a; width:100%; clear:both; position:fixed; top:0; left:0; right:0; height:50px; box-shadow:0 0 5px rgba(0,0,0,0.1); z-index:50}
#logo{text-align:center; font-size:16px; line-height:0;}
#logo img{width:180px; margin-top:10px;}
.toggle{position:absolute; top:15px; left:10px; width:26px;}
.hd_sch{position:absolute; top:11px; right:10px; width:26px;}

/*sidebar*/
#sidebar { position:fixed; left:-100%; top:50px;  width: 100%;  height: 100%;  z-index: 9999; background:#f2f3f8;  transition: all 0.2s ease;  }
.page_cover {width: 100%; height: 100%; position:fixed; top: 0px; left: 0px;  z-index: 99; display: none;}
.none_cover{width:100%; height:50px; }
.black_cover{width:100%; height:100%; background:rgba(0,0,0, 0.3);}
#sidebar.open {left:0px; position:fixed; overflow-y:scroll;}
.page_cover.open {display: block;}
.sd_tab{clear:both; height:auto; overflow:hidden; }
.sd_tab li span{display:block; height:50px; line-height:52px; padding:0 10px; font-size:1.2em;  border-bottom:1px solid #ddd;  cursor:pointer;}
.sd_tab li.active span{background:#c02a2a; color:#fff;}
.sd_tab a{display:block;width:100%;}
.sd_menu li{border-bottom: 1px solid #ddd; color:#555;  text-indent:20px; transition: all 0.2s ease;}
.sd_menu li a{ height:50px; line-height:52px;  background:#fff;}
.sd_menu li a:before{content:"\2022"; padding-right:10px;}


#visual{clear: both; width:100%; margin:20px auto;}
#visual img{display:block;}
.iconbox{width:100%; margin:0 auto; padding-bottom:2%;}
[class^="iconbox"] img, [class^="iconbox"] a{display:block;}
    .iconbox li{float:left; width:32%;}
    .iconbox li:nth-child(2){margin:0 2%;}
.iconbox2{width:100%; margin:0 auto; padding-bottom:2%;}
    .iconbox2 li{float:left; width:49%;}
    .iconbox2 li:nth-child(2){margin:0 0 0 2%;}
.iconbox3{width:100%; margin:0 auto; padding-bottom:2%;}
.iconbox4{margin-left:1%; width:99%}
    .iconbox4 li{float:left; width:24%;}
    .iconbox4 li:nth-child(1){margin:0 1% 0 0;}
    .iconbox4 li:nth-child(2){margin:0 1% 0 0;}
    .iconbox4 li:nth-child(3){margin:0 1% 0 0;}
    #copy img{ width:80%; padding:2% 0%;}
#footer{clear:both; width:100%; text-align:center; padding:20px;}
#f_logo{text-align:center;}
#footer ul{max-width:500px; margin:0 auto}
#footer li{font-size:12px; color:#888; font-family: 'SUIT', sans-serif;}
.h2_title{color:#c02a2a}

/*레이어팝업*/
#layer {display:none;  position:fixed;  top:0; left:0; width:100%; height:100%; z-index:99999;}
#layer .bg {display:block; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.5; }
.pop-layer {position: absolute; top: 30%; left: 0; right:0; margin:0 auto; width: 500px; box-shadow:0 0 5px rgba(0,0,0,0.3); background:#fff; padding:20px; border-radius:10px;  z-index: 99999;} 

.menu{border-left:1px solid #ddd;}
.menu li{width:calc(100% / 6); float:left; text-align:center; height:45px; line-height:45px;  border-right:1px solid #ddd; border-bottom:1px solid #ddd; border-top:1px solid #ddd;}
.menu li a{display:block;}

#content{clear:both; padding:10px; width:100%; margin:0 auto; position:relative; overflow:hidden; height:auto;}
[class^="col"]{width:100%; clear:both; margin-top:10px; overflow:hidden; height:auto;}
.col1 table{border-collapse:collapse; width:calc(100% - 1px);}
.col1 table th{vertical-align:top; border:0;}
.col1 h2{line-height:24px; position:relative; font-size:20px; margin:0 auto 20px;}
.col1 h2 span{font-weight:350;}
.col1 h2:before{content:""; display:block; width:40px; height:3px; background:#202020; margin:0 auto 10px;}
.col1 td{border:1px solid #ddd; border-bottom:4px solid #c02a2a; vertical-align:top; text-align:center;}
.col1 a, .col1 img{display:block; width:100%}
.col2 a{display:block; float:left; line-height:0; width:50%;}
.col2 a img{width:100%;}
.col3 .tabs{border-bottom:1px solid #eee;}
.col3 .tabs li{float:left; line-height:60px; margin-left:20px; font-size:18px; font-weight:500; color:#555; cursor:pointer;}
.col3 .tabs li.active{color:#c02a2a;}
.col4{position:relative; height:400px;}
.banner{float:left; width:880px;  margin:30px 20px 20px; overflow:hidden; }
.icon_box{float:right; width:calc(100% - 920px); position:absolute; right:0;top:0; background:#fff;}
.icon_box li{float:left; width:50%; border-left:1px solid #ddd; border-bottom:1px solid #ddd;}
.icon_box li:last-child{width:100%;clear:both; border-bottom:0;}
.icon_box li a,.icon_box li img{line-height:0; display:block;}




.sub_title{border-left:10px solid #c02a2a; padding:0 0 0 10px;  font-size:24px; margin:10px 0;}

[class^="selectCSS"]::-ms-expand{display: none;}
[class^="selectCSS"]{height:40px; font-size:14px; text-align:left;  font-family: inherit; padding:0 30px 0 20px;  width:140px; margin:1px;
  background:url("/images/arrow.png") no-repeat 90% 50%;  background-color:#fff; background-size:7px;  border:1px solid #ddd; border-radius: 0px; 
  -webkit-appearance: none; -moz-appearance: none; appearance: none; color:#888;}
[class^="selectCSS"] option{color:inherit;}
#sch_box{clear:both; width:100%; margin:0 auto; background:#f2f3f8;  border:10px solid #f2f3f8;border-collapse:collapse;}
#sch_box td{padding:2px;}
#sch_box label{display:inline-block; margin:1px 5px 1px 0; height:25px; line-height:25px; }
#sch_box input[type="checkbox"]{vertical-align:baseline; margin-right:5px;}
#sch_box input[type="text"]{width:calc(100%); height:40px; border:3px solid #c02a2a; padding:5px 10px; }
#sch_box input[type="text"]::placeholder{color:#aaa; font-size:15px; }
#sch_box button{border:0; background:#c02a2a; color:#fff; width:80px; height:40px;outline:none;}
.board{clear:both; margin-top:10px;border-top:3px solid #ddd;}
.board li{clear:both; border-bottom:1px solid #ddd;}
.board li a{display:block; padding:20px 0; overflow:hidden; height:auto;}
.board li article{display:block; width:100%; height:200px; overflow:hidden; position:relative;}
.board li article img{display:block; height:100%; position:absolute; margin:0 auto; left:0; right:0; top:0; bottom:0}
.board li div{width:100%; padding:10px;}
.board li div h3{margin-top:10px; font-weight:500;}
.board li div p{margin-top:10px; font-size:15px; color:#555; font-family: 'SUIT', sans-serif; }
.keyword{ font-weight:400; font-family:'SUIT', sans-serif; font-size:14px; color:#777!important; background:#f2f3f8;border-radius:5px;}
.keyword span{display:inline-block; width:60px; background:#fff;border:1px solid #c02a2a; border-radius:5px; color:#c02a2a; text-align:center; height:30px; line-height:30px; margin-right:5px;}
.table_list{width:100%; margin:10px auto; clear:both; border-collapse:collapse; }
.table_list th{font-size:18px; padding:10px 0; border-top:3px solid #555; border-bottom:1px solid #555;}
.table_list td{border-bottom:1px solid #ddd; padding:15px 0;}
.dw_icon{text-decoration:underline; font-size:14px;}

.msds_list{width:100%; margin:10px auto; clear:both; border-collapse:collapse; }
.msds_list th{font-size:16px; padding:10px 0; border-top:3px solid #555; border-bottom:1px solid #555;  font-family:'SUIT', sans-serif; }
.msds_list td{border-bottom:1px solid #ddd; padding:15px 0;  font-family:'SUIT', sans-serif; text-align:center; color:#595959; transition:all 0.2s ease;}
.msds_list tr:hover td{background:#f2f3f8; color:#202020;}
.msds_list td b{ font-family:'SUIT', sans-serif; color:#222;}

/*하단 버튼*/
.dw_bar{clear:both; width:100%; margin-top:10px; overflow:hidden; height:auto; }
.dw_bar li{margin-left:5px; }
.dw_bar li:first-child{float:left; margin-left:0;}
.dw_bar li:nth-child(2){float:right;}
.dw_bar li:nth-child(3){float:right;}
.dw_bar li:nth-child(4){float:right;}
.dw_bar li:nth-child(5){float:right;}
.dw_bar li a{display:inline-block; padding:5px 10px; background:#fff; font-weight:500; cursor:pointer;
border:1px solid #555; color:#333;transition:all 0.2s ease; font-family: 'SUIT', sans-serif; }

/*페이징*/
.page_bar{width:100%; position:relative;  box-sizing:border-box; overflow:hidden; clear: both; margin:40px 0;  text-align: center; }
.page_bar li {display:inline-block; margin:0 1px; color:#888;}
.page_bar li:first-child,.page_bar li:last-child{color:#555;}
.page_bar li a{display:inline-block;  padding:5px 10px; border:1px solid #ccc; transition:all 0.2s ease; font-family: 'SUIT', sans-serif; }
.page_bar li.on{color:#c02a2a; font-weight:600;}

.board_view{clear:both; width:100%; border-collapse:collapse; border-top:3px solid #c02a2a;}
.board_view th{padding: 10px 0; font-size:18px;  border-bottom:1px solid #ddd;  font-weight:500;}
.board_view td{padding:20px 0; border-bottom:1px solid #ddd; font-family: 'SUIT', sans-serif; }
.board_view input{height:40px; padding:5px; border: 1px solid #ddd; width:100%; font-size:16px;}
.table_view{clear:both; width:100%; border-collapse:collapse;}
.table_view th{padding: 10px 0; border:1px solid #ddd; font-weight:600; background:#f2f3f8; font-family:'SUIT', sans-serif;}
.table_view td{padding:10px 0; border:1px solid #ddd; text-align:center;  font-family:'SUIT', sans-serif;}
.table_view input{height:40px; padding:5px; border: 1px solid #ddd; width:100%; font-size:16px;}

.msds_name{text-align:center; padding:20px 0;}
.msds_view{clear:both; margin:20px 0;border:1px solid #ddd; border-bottom:0; }
.msds_view li{ border-bottom:1px solid #ddd;}
.msds_view li p{font-family:'SUIT', sans-serif; padding:10px; font-weight:600; font-size:16px; cursor:pointer; 
background:url("/images/arrow.png") no-repeat 95% 50%;  background-color:#fff; background-size:7px;}
[id^="msds"]{padding:10px; background:#fdfdfd; border-top:1px dotted #ddd;}
.msds_view h4{color:#2e7e32; font-family:'SUIT', sans-serif; font-size:16px; }
.msds_view dl{margin:10px 0 10px; line-height:1.8}
.msds_view dl dt{font-family:'SUIT', sans-serif; font-weight:500; margin-top:10px;}
.msds_view dl dt:before{content:"\2022"; padding-right:10px; }
.msds_view dl dd{padding-left:10px; color:#656565;font-family:'SUIT', sans-serif; }



.sub_txt img{display:block; margin:50px auto;}
.sub_txt h2 {padding:20px 0; text-align:center;}
.sub_txt h2 span{color:#c02a2a;}
.sub_txt dd{padding:0 50px;}
.address{padding:10px; background:#f2f3f8; color:#555;}
.address_list li{margin:5px 0; padding:10px; border:1px solid #ddd;}
.address_list span{ display:inline-block; width:80px; text-align:center; padding:5px; background:#c02a2a; color:#fff; margin-right:10px;}
textarea.raw{font-family: 'SUIT', sans-serif; border:0; width:100%; height:500px; background:#f2f3f8; color:#555; line-height:1.8; padding:20px;}
.sitemap{border-collapse:collapse; width:100%;}
.sitemap th{vertical-align:top; border-bottom:4px solid #c02a2a; padding:10px 0 0;}
.sitemap td{text-align:right; padding:20px; background:#f2f3f8; border-right:2px solid #ddd; color:#555; vertical-align:top; font-weight:350; line-height:30px;}
.sitemap td:last-child{border-right:0;}