/************************************************************************ * HTML_RESET * ************************************************************************/ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,button,input{ vertical-align:top; word-break:break-all; } body{font-size:12px ! important;font-weight:normal;color:#242424;position:relative;font-family:'Noto Sans KR' !important;} h1,h2,h3,h4,h5,h6{font-weight:bold;margin:0} ol,ul,li{list-style:none;} table{max-width:100%;border-collapse:collapse;border-spacing:0;} form,fieldset,iframe{display:block;border:0;} img,button{border:0 none;vertical-align:middle;} i,em,address{font-style:normal;} label,button{cursor:pointer;} caption,legend{display:none;} input,textarea,select{margin:0;padding:0;vertical-align:middle;outline:none;} textarea{border:1px solid #666;resize:none;} button{overflow:visible;margin:0;padding:0;border:0 none;background:none;font-size:0;vertical-align:top;cursor:pointer;display:block;} button::-moz-focus-inner{border:0;padding:0;} table tr td{font-size:12px ! important;} a{color:#000;text-decoration:none;word-break:break-all;} a:link,a:visited,a:hover,a:active,a:focus{text-decoration:none;} *::-moz-selection{background-color:#000000;color:#ffffff;} *::selection{background-color:#d0d6dd;color:#000000;} /* */ .m_line{border-left:#C3C3C3 1px solid;border-right:#C3C3C3 1px solid;} .l_line{background:#FFFFFF url(/img/main/l_bg.gif);width:50;} .r_line{background:#EEEEEE;border-right:#C3C3C3 1px solid;width:3} .copy{padding:22 0 0 0;height:168} .left_line{border-left:#E6E6E6 1px solid;border-right:#E6E6E6 1px solid;} /*Ʈ */ .product {font-size:9pt;} .product_b {color:#9C845A;font-weight:bold;font-size:9pt;letter-spacing:-1} .green{color:#7C9000;} .orange{color:#D57300;} .orange_b{color:#D57300;font-weight:bold;} .red{color:#D46E78} .red_b{color:#D46E78;font-weight:bold;} .gray{color:#9C815B;} .gray_b{color:#9C815B;font-weight:bold;} .blue {color:#319FD7;} .blue_b {color:#319FD7;font-weight:bold;} /*center */ .center{border-top:#D9D9D9 1px solid;border-bottom:#D9D9D9 1px solid;padding:7 0 4 0} /*Խ*/ .bbs_t01 {color:#FFFFFF;background:#C73A00 url(/img/bbs/bbs_bar.gif) no-repeat right top;} .bbs_t02 {color:#FFFFFF;background:#C73A00} .bbs_m01 {background:#FFFFFF;padding:4 4 2 4;text-align:center} .bbs_m02 {background:#F0F0F0;padding:4 4 2 4;text-align:center} /*̼ Խ*/ .my_tl {color:#FFFFFF;background:#7C9000 url(../../img/myshop/tit_l.gif) no-repeat left top;} .my_tr {color:#FFFFFF;background:#7C9000 url(../../img/myshop/tit_r.gif) no-repeat right top;} /*Խ Ʈ*/ .list_o {color:#1BA2CA;text-decoration:none;font-weight:bold} .list A { color: #666666; font-style: normal; font-weight: bold; font-family: "ü", "ü"; font-size: 10px; line-height: normal; font-variant: normal; } .list A:link {color: #626262 ; } .list A:visited {color: #626262 ;} .list A:active {color: #626262 ;} .list A:hover {color:#1BA2CA;} P{margin-top:3px;margin-bottom:3px;} /*----- Cart , Order ---*/ Td.LineC3C3C3B{border-bottom:solid 1 #C3C3C3;} Td.LineC3C3C3RB{border-right:solid 1 #C3C3C3; border-bottom:solid 1 #C3C3C3} .Red01 {font-size:12px;color:#DA0C00;} .Red02 {font-size:11px;color:#F55A51;letter-spacing:-1px;} .TbLine{background-color:#DBDBDB;} /* ⺻ */ /*.bg_foot { height:200px; margin:-200px 0 0 0} */ /* Խ */ .bbs_list th { border-top:1px solid #CDBD72; background:#DCD3A4; } .bbs_foot { border-top:1px solid #CDBD72; } .bbs_foot .search select { background:#F7F4E8; } .bbs_foot .search input { border:1px solid #CDBD72; background:#F7F4E8; } .bor_none { border:none; border:0; } .bbs_view { border-top:1px solid #CDBD72; } .bbs_view td.tit_subject { background:#DCD3A4; } .bbs_view td.tit_id { border-color:#CDBD72; background:#DCD3A4; } .bbs_view td.view_id { border-color:#DED3A2; } .bbs_view td.tit_date { border-color:#CDBD72; background:#DCD3A4; } .bbs_view td.view_date { border-color:#DED3A2; } .bbs_view td.tit_read { border-color:#CDBD72; background:#DCD3A4; } .bbs_view td.view_read { border-color:#DED3A2; } .bbs_write { border-top:1px solid #CDBD72; } .bbs_write td.tit { background:#DCD3A4; border-bottom:1px solid #CDBD72; } .bbs_write td.inputbox { border-bottom:1px solid #DED3A2; } .bbs_write td.inputbox input.style1 { border:1px solid #BFCABD; } .bbs_write td.inputbox input.style2 { border:1px solid #BFCABD; } .editor_area { border:1px solid #A4A4A4; } .subject { font-family: "", ""; font-weight: bold; color: #FFFFFF; } /*float해제*/ .main_con{zoom:1;} .main_con:after{content:"";clear:both;display:block;} /*150415추가*/ ul.main_con{width:998px;height:33px;margin:10px 0;padding:10px 0 0 120px;background:url(/images/main/images/mainconbg.jpg) no-repeat 0 0;} .main_con li{float:left;list-style:none;margin:0;padding:0 185px 0 0;} .main_con li.last{float:left;list-style:none;margin:0;padding:0;} /******2021.02.13***********/ /* ================================================================================================= Top Navi ================================================================================================= */ .wrap{float:left;width:100%;text-align:center} .area{margin:0px auto;width:1000px;text-align:center;float:left;padding:0px;} .area h1{float:left;width:273px} .area h1 img{width:273px;height:106px;} #gnb{float:right;height:42px; width:720px; margin:35px 0 0 0;padding:11px 9px 0 0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb > ul{position:relative; text-align: center; width:96%; margin:0; padding:0; font-family:'Noto Sans KR' !important; margin-left:30px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb > ul > li{float:left; margin:0; padding:0; width:20%; text-align:center; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb > ul > li > a{display:block; position:relative; height:50px; padding:0; -webkit-transition:all 400ms;-moz-transition:all 400ms;-o-transition:all 400ms;-ms-transition:all 400ms;transition:all 400ms; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb > ul > li > a:hover, #gnb > ul > li.on > a{position:relative; } #gnb > ul > li > a font {font-size:14px;font-family:'Noto Sans KR'; font-weight:400 !important;} #gnb > ul > li span:before{height:0; position: absolute; width:100%; left:0; bottom:23px; z-index:1; content:''; transition:all ease 0.3;border-radius:8px 8px 0 0;} #gnb > ul > li.on span:before{height:33px;} #gnb > ul > li > a > span{display:block; height:33px; line-height:23px; font-size:14px; color:#fff; font-weight:500; letter-spacing:-0.5px;} #gnb > ul > li > a:hover > span,#gnb > ul > li.on > a > span{color:#f6fdb7;} #gnb > ul > li .gnb-2dep{display:none; position:absolute; top:27px; left:0px; width:auto; height:35px;padding:0;text-align: center;background-color:#fafafa; border:1px solid #0a397d;border-radius: 8px;box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; z-index:9999999999999999;} #gnb > ul > li .gnb-2dep li{float:left; margin:0; padding:0; line-height:32px;} #gnb > ul > li .gnb-2dep li a{display:block; padding:0 7px; color:#676767; text-align:left;letter-spacing:-0.55px; font-weight:400; font-size:12px ! important} #gnb > ul > li .gnb-2dep li a:hover{color:#0a397d;} #gnb > ul > li.on span font{position:relative; z-index:222;} #gnb > ul > li.gnb1 .gnb-2dep{ width:40%; left:0%;} #gnb > ul > li.gnb2 .gnb-2dep{ width:46%; left:16%;} #gnb > ul > li.gnb3 .gnb-2dep{ width:18%; left:42%;} #gnb > ul > li.gnb4 .gnb-2dep{ width:12%; left:50%;} #gnb > ul > li.gnb5 .gnb-2dep{ width:50%; left:51%;} #gnb > ul > li.gnb6 .gnb-2dep{ width:18%; left:80%;} #gnb_m{float:left;height:42px; width:920px; margin:35px 0 0 0;padding:11px 9px 0 0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb_m > ul{position:relative; text-align: center; width:96%; margin:0; padding:0; font-family:'Noto Sans KR' !important; margin-left:30px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb_m > ul > li{float:left; margin:0; padding:0; width:20%; text-align:center; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb_m > ul > li > a{display:block; position:relative; height:50px; padding:0; -webkit-transition:all 400ms;-moz-transition:all 400ms;-o-transition:all 400ms;-ms-transition:all 400ms;transition:all 400ms; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb_m > ul > li > a:hover, #gnb > ul > li.on > a{position:relative; } #gnb_m > ul > li > a font {font-size:14px;font-family:'Noto Sans KR'; font-weight:400 !important;} #gnb_m > ul > li span:before{height:0; position: absolute; width:100%; left:0; bottom:23px; z-index:1; content:''; transition:all ease 0.3;border-radius:8px 8px 0 0;} #gnb_m > ul > li.on span:before{height:33px;} #gnb_m > ul > li > a > span{display:block; height:33px; line-height:23px; font-size:14px; color:#fff; font-weight:500; letter-spacing:-0.5px;} #gnb_m > ul > li > a:hover > span,#gnb > ul > li.on > a > span{color:#f6fdb7;} #gnb_m > ul > li .gnb-2dep{display:none; position:absolute; top:27px; left:0px; width:auto; height:35px;padding:0;text-align: center;background-color:#fafafa; border:1px solid #0a397d;border-radius: 8px;box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; z-index:9999999999999999;} #gnb_m > ul > li .gnb-2dep li{float:left; margin:0; padding:0; line-height:32px;} #gnb_m > ul > li .gnb-2dep li a{display:block; padding:0 7px; color:#676767; letter-spacing:-0.55px; font-weight:400; font-size:12px ! important} #gnb_m > ul > li .gnb-2dep li a:hover{color:#0a397d;} #gnb_m > ul > li.on span font{position:relative; z-index:222;} #gnb_m > ul > li.gnb1 .gnb-2dep{ width:40%; left:0%;} #gnb_m > ul > li.gnb2 .gnb-2dep{ width:46%; left:16%;} #gnb_m > ul > li.gnb3 .gnb-2dep{ width:18%; left:42%;} #gnb_m > ul > li.gnb4 .gnb-2dep{ width:12%; left:50%;} #gnb_m > ul > li.gnb5 .gnb-2dep{ width:50%; left:51%;} #gnb_m > ul > li.gnb6 .gnb-2dep{ width:18%; left:80%;} #gnb_green{float:right;height:42px; width:720px; margin:35px 0 0 0;padding:11px 9px 0 0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb_green > ul{position:relative; text-align: center; width:96%; margin:0; padding:0; font-family:'Noto Sans KR' !important; margin-left:30px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb_green > ul > li{float:left; margin:0; padding:0; width:48%; text-align:center; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb_green > ul > li > a{display:block; position:relative; height:50px; padding:0; -webkit-transition:all 400ms;-moz-transition:all 400ms;-o-transition:all 400ms;-ms-transition:all 400ms;transition:all 400ms; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;} #gnb_green > ul > li > a:hover, #gnb_green > ul > li.on > a{position:relative; } #gnb_green > ul > li > a font {font-size:14px;font-family:'Noto Sans KR'; font-weight:400 !important;} #gnb_green > ul > li span:before{height:0; position: absolute; width:100%; left:0; bottom:23px; z-index:1; content:''; transition:all ease 0.3;border-radius:8px 8px 0 0;} #gnb_green > ul > li.on span:before{height:33px;} #gnb_green > ul > li > a > span{display:block; height:33px; line-height:23px; font-size:14px; color:#fff; font-weight:500; letter-spacing:-0.5px;} #gnb_green > ul > li > a:hover > span,#gnb_green > ul > li.on > a > span{color:#f6fdb7;} #gnb_green > ul > li .gnb-2dep{display:none; position:absolute; top:27px; left:0px; width:auto; height:35px;padding:0;text-align: center;background-color:#fafafa; border:1px solid #5ac128;border-radius: 8px;box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; z-index:9999999999999999;} #gnb_green > ul > li .gnb-2dep li{float:left; margin:0; padding:0; line-height:32px;} #gnb_green > ul > li .gnb-2dep li a{display:block; padding:0 7px; color:#676767; text-align:left;letter-spacing:-0.55px; font-weight:400; font-size:12px ! important} #gnb_green > ul > li .gnb-2dep li a:hover{color:#5ac128;} #gnb_green > ul > li.on span font{position:relative; z-index:222;} #gnb_green > ul > li.gnb1 .gnb-2dep{ width:40%; left:0%;} #gnb_green > ul > li.gnb2 .gnb-2dep{ width:43%; left:50%;} #gnb_green > ul > li.gnb3 .gnb-2dep{ width:18%; left:42%;} #gnb_green > ul > li.gnb4 .gnb-2dep{ width:12%; left:50%;} #gnb_green > ul > li.gnb5 .gnb-2dep{ width:50%; left:51%;} #gnb_green > ul > li.gnb6 .gnb-2dep{ width:18%; left:80%;} td strong{font-size:12px; ! important} /* Slideshow container */ .slideshow-container { max-width: 919px; position: relative; margin: auto; } .slideshow-container img{919px;} /* Next & previous buttons */ .prev, .next { cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -22px; color: white; font-weight: bold; font-size: 35px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; background:rgba(0,0,0,0.3); } /* Position the "next button" to the right */ .next { right: 0; border-radius: 3px 0 0 3px; } /* On hover, add a black background color with a little bit see-through */ .prev:hover, .next:hover { background-color: rgba(0,0,0,0.8); } /* Caption text */ .text { padding: 12px 12px; position: absolute; top: 35px; right:30px; width: 56%; text-align: right; z-index:2222; background:rgba(0,0,0,0.5); } .text p{padding:10px 0;letter-spacing:-0.05em;line-height:30px} .tit{font-size:35px;color:#fff;width:100%;font-weight:300} .tit span{font-size:50px;color:#48cced;width:100%;font-weight:600} .auth{font-size:25px;color:#fff;width:100%;font-weight:300;padding-top:30px} .auth2{font-size:35px;color:#ffaf04;width:100%;font-weight:300} .auth2 span{font-weight:600} /* Number text (1/3 etc) */ .numbertext { color: #f2f2f2; font-size: 18px; padding: 8px 12px; position: absolute; top: 0; background:rgba(0,0,0,0.3);display:none } /* The dots/bullets/indicators */ .dot { cursor: pointer; height: 14px; width: 14px; margin: 0 2px; background-color: #000; border-radius: 50%; border:0px solid #000; display: inline-block; transition: background-color 0.6s ease; } .dotbox{ position:absolute; bottom:40px; z-index:99999;left:48%} .active, .dot:hover { background-color: #ffdb4c; } /* Fading animation */ .fade { -webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1.5s; } @-webkit-keyframes fade { from {opacity: .4} to {opacity: 1} } @keyframes fade { from {opacity: .4} to {opacity: 1} } /* On smaller screens, decrease text size */ @media only screen and (max-width: 300px) { .prev, .next,.text {font-size: 11px} } /***/ .n_category{float:left;width:100%;} .n_category div{float:left;width:25%;} .n_category .ca_h3{background:#333;color:#fff;font-weight:600;font-size:25px;text-align:center;padding:14px 0;letter-spacing:-0.05em} .n_category .ca_h3_2{background:#555;color:#fff;font-weight:600;font-size:25px;text-align:center;padding:14px 0;letter-spacing:-0.05em} .n_ca01{background:#f37a2d;padding-bottom:20px} .n_ca02{background:#79bf5b;padding-bottom:20px} .n_ca03{background:#5fbaba;padding-bottom:20px} .n_ca04{background:#2c91a8;padding-bottom:20px} .n_cate_menu{float:left;width:84%;padding:10px 20px;height:450px;} .n_cate_menu li{width:100%;padding:5px 0;border-bottom:1px dashed #fff;color:#fff;font-size:14px;letter-spacing:-0.05em} .n_cate_menu li a{color:#fff;font-size:14px;letter-spacing:-0.05em} .n_left_menu{float:left;width:82%;margin:20px 30px} .n_left_menu ul{float:left;width:100%;} .n_left_menu li{width:100%;padding:5px 0;border-bottom:1px dashed #ddd;color:#555;font-size:14px;letter-spacing:-0.05em} .n_left_menu li a{color:#555;font-size:14px;letter-spacing:-0.05em;} .n_left_menu li a:hover{color:#000;font-size:14px;letter-spacing:-0.05em;text-decoration:none}