@import url('/resources/css/font.css'); /* 폰트임 */
@import url('/resources/css/loading.css');

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,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
   margin: 0;
   padding: 0;
   border: 0;
   line-height: 155%;
   letter-spacing: normal;
} /* delete vertical-align,font:inherit; */
body,
html {
   width: 100%;
   font-size: 15px;
   color: #666;
   font-family: 'Noto Sans SC','Noto Sans KR', sans-serif;
}
* {
   font-family: 'Noto Sans SC','Noto Sans KR', sans-serif;
}
ol,
ul,
li {
   list-style: none;
}
blockquote,
q {
   quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
   content: '';
   content: none;
}
table {
   border-collapse: separate;
   border-spacing: 0;
   font-size: 15px;
}
table caption {
   overflow: hidden;
   font-size: 0;
   line-height: 0;
   font-size: 15px;
}
tbody,
tfoot,
thead,
tr,
th,
td {
   margin: 0;
   line-height: 155%;
   letter-spacing: normal;
}
dt {
   display: block;
}
hr {
   display: none;
}
a {
   cursor: pointer;
   text-decoration: none;
   color: #666;
}
address {
   font-style: normal;
}
input,
select,
img {
   vertical-align: middle;
}

input[type='text'] {
   border-radius: 0;
} /* ios 둥근라인 없애기*/
input:focus,
textarea:focus,
button:focus {
   outline: none;
} /* 크롬에서 커서 클릭시 파란색 테두리 제외*/
input[type='image'] {
   border-radius: 0;
}
input[type='button'],
input[type='submit'] {
   border-radius: 0;
   -webkit-border-radius: 0;
   -webkit-appearance: none;
}
button {
   border: none;
   background: none;
}

.input_search {
   border: 0;
   background: none;
   height: 20px;
   width: 155px;
   font-size: 14px;
   color: #666;
   font-family: 'Noto Sans KR', sans-serif;
}

* {
   word-break: keep-all;
}

/* Web Content Accessibility TTS(Text To Speech) Code */
.blind {
   position: absolute;
   top: 0px;
   left: 0px;
   overflow: hidden;
   display: inline-block !important;
   width: 1px !important;
   height: 1px !important;
   margin: 0 !important;
   font-size: 0 !important;
   line-height: 0 !important;
}

span,
p {
   line-height: inherit;
   letter-spacing: inherit;
}

/* 바로가기 */
#accessibilityMenu {
   position: absolute;
   overflow: hidden;
   visibility: hidden;
   font-size: 0;
   line-height: 0;
}

/* Common */

/* 레이아웃 */
#wrap {
   position: relative;
   width: 100%;
   height: 100%;
   min-width: 1200px;
}

#header {
   position: absolute;
   z-index: 1050;
   width: 100%;
   clear: both;
   background: linear-gradient(#fce93c, #ffb443);
}
#header.fixed {
   position: fixed;
   background: linear-gradient(#fce93c, #ffb443);
   top: 0;
}
#header.fixed .header_in h1 {
   padding: 25px 0;
   display: none;
}
#header.fixed .header_in h1.fixed_tit {
   padding: 25px 0;
   display: block;
   z-index: 1050;
}
#header.fixed .header_in h1.fixed_tit img {
   width: 300px;
   z-index: 1050;
}
#header.fixed #menu .gnbDiv .gnbWrap .gnb ul li a.oneDep {
   display: block;
   position: relative;
   color: #222;
   font-weight: 500;
   text-decoration: none !important;
   transition: all 0.3s;
}
#header.fixed .header_in ul.lan li:before {
   position: absolute;
   content: '';
   width: 5px;
   height: 5px;
   top: 13px;
   left: -13px;
   background: rgba(0, 0, 0, 0.3);
   border-radius: 5px;
}
#header.fixed .header_in ul.lan li:first-child {
   margin: 0 0 0 0;
}
#header.fixed .header_in ul.lan li a {
   color: #999;
   transition: all 0.3s;
}
#header.fixed .header_in ul.lan li.on a {
   color: #000;
   transition: all 0.3s;
}

#header .header_in {
   position: relative;
   overflow: hidden;
   margin: 0 auto;
   width: 94%;
}
#header .header_in.menu_o {
}
#header .header_in h1 {
   position: relative;
   float: left;
   padding: 25px 0;
   z-index: 1050;
   display: block;
}
#header .header_in .fixed_tit {
   display: none;
}
#header .header_in ul.lan {
   float: right;
   position: relative;
   overflow: hidden;
   margin: 37px 0 0 0;
   z-index: 1050;
}
#header .header_in ul.lan li {
   position: relative;
   float: left;
   margin: 0 0 0 20px;
}
#header .header_in ul.lan li:before {
   position: absolute;
   content: '';
   width: 5px;
   height: 5px;
   top: 13px;
   left: -13px;
   background: rgba(255, 255, 255, 0.3);
   border-radius: 5px;
}
#header .header_in ul.lan li:first-child {
   margin: 0 0 0 0;
}
#header .header_in ul.lan li a {
   display: block;
   font-family: 'Montserrat', sans-serif;
   font-weight: 700;
   text-align: center;
   color: rgba(255, 255, 255, 0.8);
   font-size: 13px;
   line-height: 30px;
}
#header .header_in ul.lan li.on a {
   color: #000;
}

#header .header_in.menu_o ul.lan {
}
#header .header_in.menu_o ul.lan li:before {
   position: absolute;
   content: '';
   width: 5px;
   height: 5px;
   top: 13px;
   left: -13px;
   background: rgba(0, 0, 0, 0.3);
   border-radius: 5px;
}
#header .header_in.menu_o ul.lan li:first-child {
   margin: 0 0 0 0;
}
#header .header_in.menu_o ul.lan li a {
   color: #999;
}
#header .header_in.menu_o ul.lan li.on a {
   color: #000;
}

/* TOP 메뉴 */
#menu {
   position: absolute;
   width: 100%;
   top: 0;
   height: 70px;
   z-index: 1030;
   transition: all 0.3s;
}
.gnbDiv {
   width: 100%;
   height: 70px;
   overflow: hidden;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 10000;
   transition: all 0.5s;
}
.gnbDiv.menu_o {
   height: 330px;
   background: #fff;
   border-bottom: 0px solid #ddd;
   transition: all 0.5s;
}
/* .gnbDiv .gnbWrap {position:absolute; top:35px; margin: 0 auto; overflow: hidden; position: relative; width:1170px; z-index: 10000;}  */
.gnbDiv .gnbWrap {
   position: absolute;
   top: 35px;
   margin: 0 auto;
   overflow: hidden;
   position: relative;
   width: 1264px;
   z-index: 10000;
}
/* .gnbDiv .gnbWrap .gnb {width:970px; z-index:10000; height:295px; float:left;  margin:0 0 0 150px;} */
.gnbDiv .gnbWrap .gnb {
   width: 1238px;
   z-index: 10000;
   height: 295px;
   float: left;
   margin: 0 0 0 150px;
}
.gnbDiv .gnbWrap .gnb .oneDep {
   line-height: 100%;
   font-size: 18px;
   padding-top: 9px;
   height: 55px;
   /* letter-spacing: -0.8px; */
   margin-left: 20px;
   text-align: center;
}
.gnbDiv .gnbWrap .gnb ul {
   overflow: hidden;
   width: 100%;
   height: 295px;
}
.gnbDiv .gnbWrap .gnb ul li {
   width: auto;
   height: 330px;
   padding: 0 0;
   position: relative;
   float: left;
   text-align: center;
   line-height: 100%;
}

.gnbDiv .gnbWrap .gnb ul li.one {
   width: 150px;
}
.gnbDiv .gnbWrap .gnb ul li.two {
   width: 170px;
}
.gnbDiv .gnbWrap .gnb ul li.three {
   width: 130px;
}
.gnbDiv .gnbWrap .gnb ul li.four {
   width: 130px;
}
.gnbDiv .gnbWrap .gnb ul li.five {
   width: 130px;
}
.gnbDiv .gnbWrap .gnb ul li.six {
   width: 130px;
}
.gnbDiv .gnbWrap .gnb ul li.seven {
   width: 130px;
}
.gnbDiv .gnbWrap .gnb ul li.eight {
   width: 130px;
}
.gnbDiv .gnbWrap .gnb ul li.nine {
   width: 130px;
}
.gnbDiv .gnbWrap .gnb ul li.ten {
   width: 130px;
}
.gnbDiv .gnbWrap .gnb ul li.eleven {
   width: 130px;
}

.gnbDiv .gnbWrap .gnb ul li a.oneDep {
   display: block;
   position: relative;
   color: #000;
   font-weight: 500;
   text-decoration: none !important;
   transition: all 0.3s;
}
.gnbDiv.menu_o .gnbWrap .gnb ul li a.oneDep {
   color: #222;
}
.gnbDiv .gnbWrap .gnb ul li.on a.oneDep {
   color: #000 !important;
   text-decoration: none;
   transition: all 0.3s;
}
.gnbDiv .gnbWrap .gnb ul li a.oneDep:after {
   position: absolute;
   bottom: 0;
   display: block;
   content: '';
   overflow: hidden;
   width: 0;
   height: 3px;
   background: #db680b;
   transition: all 0.3s;
}
.gnbDiv .gnbWrap .gnb ul li.on a.oneDep:after {
   width: 100%;
   transition: all 0.3s;
}

.gnbDiv .gnbWrap .twoDep {
   display: block;
   text-align: center;
   padding-top: 0;
   box-sizing: border-box;
   position: relative;
   visibility: visible;
   height: 260px;
   padding-top: 15px;
   margin-left: 20px;
}
.gnbDiv .gnbWrap li.on .twoDep {
}
.gnbDiv .gnbWrap li.on .twoDep a.off:hover {
   color: #fff;
   vertical-align: top;
   transition: all 0.3s;
}
.gnbDiv .gnbWrap li .twoDep a.on {
   color: #fff;
   vertical-align: top;
   transition: all 0.3s;
}
.gnbDiv .gnbWrap li .twoDep a {
   position: relative;
   display: inline-block;
   line-height: 100%;
   color: rgba(255, 255, 255, 0.6);
   /* letter-spacing: -0.6pt; */
   font-size: 15px;
   padding: 5px 0;
   margin-bottom: 4px;
   text-align: center;
}
.gnbDiv .gnbWrap li .twoDep a:after {
   position: absolute;
   bottom: 0px;
   display: block;
   content: '';
   overflow: hidden;
   width: 0;
   height: 1px;
   background: #fff;
   transition: all 0.3s;
}
.gnbDiv .gnbWrap li .twoDep a:hover:after {
   width: 100%;
   transition: all 0.3s;
}
.disB {
   display: block;
}
.gnbDiv .gnbWrap li.one .twoDep {
   box-sizing: border-box;
}
.twoDbg {
   display: ;
   position: absolute;
   top: 98px;
   left: 0;
   height: 260px;
   width: 100%;
   z-index: 1030;
   line-height: 100%;
   border-top: 1px solid #ddd;
   background: #db680b;
}

/* 하단 */
#footer {
   position: relative;
   width: 100%;
   margin: 0 auto;
   clear: both;
   overflow: hidden;
   z-index: 120;
   background: url("/resources/img/main/catalog_bg.png?ver=2") no-repeat 100% 100%;
   background-color: #f9f9f9;
}
#footer .copymenu_in {
   width: 100%;
   background-color: #f9f9f9;
   border-top: 1px solid #ebebeb;
   border-bottom: 1px solid #ebebeb;
}
.copymenu {
   position: relative;
   width: 1180px;
   margin: 0 auto;
}
.copymenu li {
   float: left;
   display: block;
   font-size: 15px;
   font-weight: 500;
   color: #fff;
   padding: 20px 15px;
   background: url('/resources/img/common/copymenu_line.gif') 0 24px no-repeat;
   /* letter-spacing: -0.5px; */
}
.copymenu li:first-child {
   background: none;
   padding: 20px 15px 20px 5px;
}
.copymenu li:last-child {
   padding: 20px 0 20px 15px;
}
.copymenu li.pd_space a {
   background: none !important;
   padding: 20px 0 20px 570px;
   font-weight: 700;
   /* letter-spacing: -0.5px; */
   color: #e60012;
}
.copymenu li.pd_space a:hover {
   background: none !important;
   color: #e60012;
}
.copymenu li a {
   color: #3e3e3e;
}
.copymenu li a:hover {
   color: #3e3e3e;
}
.copymenu:after {
   content: '';
   display: block;
   clear: both;
}
.copymenu .return-top {
   position: absolute;
   right: 0;
   top: 0;
   height: 50px;
}
.copymenu .return-top a {
   display: block;
   height: 50px;
}

#footer .copy_in {
   position: relative;
   width: 1180px;
   margin: 0 auto;
   padding: 30px 0 100px;
}
.copy_in p.copy_txt {
   font-family: 'Montserrat', sans-serif;
   font-size: 14px;
   letter-spacing: 0px;
   color: #3e3e3e;
   line-height: 28px;
   font-weight: 400;
   margin: 0 0 0 5px;
}
.copy_in p.copy_txt span.privacy a {
   font-family: 'Noto Sans SC', sans-serif;
   color: #fff;
   font-size: 12px;
   text-decoration: underline;
   /* letter-spacing: -0.2px; */
   margin-left: 21px;
}
.copy_in p.footer_logo {
   position: absolute;
   right: 0px;
   top: 30px;
}
.copy_in p.footer_banner {
   position: absolute;
   right: 0px;
   top: 95px;
}

.copy_in_area {
   width: 100%;
   margin: 0 0 0 5px;
}
.copy_in_area:after {
   content: '';
   display: block;
   clear: both;
}
.copy_in_area dl {
   float: left;
   overflow: hidden;
}
.copy_in_area dl:first-child {
   border-left: none;
   box-sizing: border-box;
}
.copy_in_area dl.sec01 {
   width: 750px;
}
.copy_in_area dl.sec02 {
   width: 750px;
   display: flex;
   justify-content: flex-end;
}
.copy_in_area dl.sec03 {
   width: 620px;
   display: flex;
   justify-content: flex-end;
   margin-top: 20px;
}
.copy_in_area dt {
   width: 100%;
   font-size: 20px;
   color: #222;
   line-height: 30px;
   font-weight: 800;
}
.copy_in_area dd {
   width: 100%;
   padding: 5px 0 0;
   font-size: 15px;
   /* letter-spacing: -0.2px; */
   color: #3e3e3e;
   line-height: 18px;
   font-weight: 300;
}
.copy_in_area dd.chain {
   display: inline-block;
   width: 360px;
}
.copy_in_area dd span {
   font-weight: 400;
   color: #3e3e3e;
}

.copy_in select.foot_select {
   position: absolute;
   right: 10px;
   top: 30px;
   box-sizing: border-box;
   width: 190px;
   height: 36px;
   padding: 0 0 0 3px;
   margin: 0;
   font-size: 14px;
   color: #666;
   border: 1px solid #c0c0c0;
   border-radius: 4px;
   -webkit-border-radius: 0;
   vertical-align: middle;
   -webkit-appearance: none;
}
.copy_in p.down_btn a {
   display: block;
   margin-top: 5px;
   width: 190px;
   height: 35px;
   text-align: center;
   font-weight: 500;
   font-size: 14px;
   color: #fff;
   background: #1f3069;
   line-height: 34px;
   font-weight: 500;
   /* letter-spacing: -0.5px; */
   transition: all 0.3s ease;
}
.copy_in p.down_btn a:hover {
   background: #0e1d4f;
   transition: all 0.3s ease;
}

/* 퀵메뉴 */
.quickBanner {
   position: fixed;
   top: 38%;
   right: 30px;
   z-index: 9999999;
   transition: all 0.3s ease-out;
}
.quickBanner ul {
   width: 80px;
}
.quickBanner ul li {
   display: block;
   box-sizing: border-box;
   overflow: hidden;
   margin-bottom: 4px;
   border: 1px solid #ccc;
   border-radius: 11px;
}
.quickBanner ul li.last {
   margin-bottom: 0;
}

/* .quickBanner .topBtn {margin:0 auto 0 auto; display:block; text-align:Center; width:100px; height:80px; box-sizing:border-box; } */

.topBtn {
   position: fixed;
   right: 50px;
   bottom: 50px;
   z-index: 2;
}

/* 게시판 페이징 */
.page_num {
   position: relative;
   width: 100%;
   text-align: center;
   padding: 15px 0 0 0;
}
.page_num ul.pagination {
   display: inline-block;
   padding: 0;
   margin: 0;
}
.page_num ul.pagination li {
   display: inline;
}
.page_num ul.pagination li a {
   color: #888;
   font-size: 13px;
   float: left;
   padding: 6px 12px;
   text-decoration: none;
   border: 1px solid #ddd;
   margin: 0 1px;
}
.page_num ul.pagination li a.active {
   background: #555;
   color: #fff;
   border: 1px solid #555;
}

/** 에러페이지 **/
#error {
   position: absolute;
   border: 1px solid #ddd;
   width: 500px;
   padding: 200px 50px 50px 50px;
   text-align: center;
   background: url('//img/warning_icon.gif') center 50px no-repeat;
   left: 50%;
   margin-left: -300px;
   top: 49%;
   margin-top: -203px;
   box-shadow: 0px 5px 0 #f6f6f6;
} /*  -moz-transform:translateY(-49%); -ms-transform:translateY(-49%); -webkit-transform:translateY(-49%); transform:translateY(-49%); */
#error h1 {
   color: #333;
   margin: 0;
   /* letter-spacing: -0.5pt; */
}
#error h1 span {
   color: #cc141d;
}
#error div {
   color: #666;
   font-size: 18px;
   /* letter-spacing: -0.5pt; */
   margin-top: 30px;
   padding-top: 30px;
   line-height: 150%;
   border-top: 1px dashed #ccc;
}

/*탑 버튼*/
div.topBtn {
   position: fixed;
   right: 30px;
   bottom: 30px;
   z-index: 999999;
}
div.topBtn #scroll {
   display: block;
   background: url('/resources/img/common/top.png') center no-repeat, #005a51;
   border-radius: 60px;
   width: 60px;
   height: 60px;
   box-shadow: 5px 5px 20px rgb(0, 0, 0, 0.2);
}

/*******************************************************************************
	@media 1579px~
*******************************************************************************/
@media all and (max-width: 1580px) {
   .gnbDiv .gnbWrap .gnb {
      width: 880px;
      z-index: 10000;
      height: 295px;
      float: right;
      margin: 0 10px 0 0;
   }

   .gnbDiv .gnbWrap .gnb ul li.one {
      width: 100px;
   }
   .gnbDiv .gnbWrap .gnb ul li.two {
      width: 140px;
   }
   .gnbDiv .gnbWrap .gnb ul li.three {
      width: 100px;
   }
   .gnbDiv .gnbWrap .gnb ul li.four {
      width: 100px;
   }
   .gnbDiv .gnbWrap .gnb ul li.five {
      width: 100px;
   }
   .gnbDiv .gnbWrap .gnb ul li.six {
      width: 80px;
   }
   .gnbDiv .gnbWrap .gnb ul li.seven {
      width: 100px;
   }
   .gnbDiv .gnbWrap .gnb ul li.eight {
      width: 100px;
   }
   .gnbDiv .gnbWrap .gnb ul li.nine {
      width: 100px;
   }
   .gnbDiv .gnbWrap .gnb ul li.ten {
      width: 100px;
   }
   .gnbDiv .gnbWrap .gnb ul li.eleven {
      width: 100px;
   }
}

/*******************************************************************************
	@media 1379px~
*******************************************************************************/
@media all and (max-width: 1380px) {
   #header.fixed .header_in h1.fixed_tit {
      padding: 35px 0;
      display: block;
      z-index: 1050;
   }
   #header.fixed .header_in h1.fixed_tit img {
      width: 260px;
      z-index: 1050;
   }

   #header .header_in h1 {
      position: relative;
      float: left;
      padding: 35px 0;
      z-index: 1050;
      display: block;
   }
   #header .header_in h1 img {
      width: 260px;
   }
   #header .header_in ul.lan {
      float: right;
      position: relative;
      overflow: hidden;
      margin: 10px 0 0 0;
      z-index: 1050;
   }

   .quickBanner {
      display: none;
   }
   .quickBanner ul {
      display: none;
   }
}
