@charset "utf-8";
@import url("../../fonts/fonts.css");
@import url("contents/header.css");
@import url("contents/footer.css");
@import url("contents/anim.css");
@import url("contents/mobile-nav.css");
@import url("contents/grid.css");
@import url("contents/nice-select.css");
@import url("contents/typo.css");
@import url("contents/quicklink.css");
@import url("contents/quickmenu.css");
@import url("contents/layout-spec.css");

/* 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, 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, input, textarea, button,
article, aside, canvas, details, embed, figure, figcaption, footer, header, menu,
nav, output, ruby, section, summary, time, mark, audio, video
 {margin:0;padding:0;border:0;}
article, aside, details, figcaption, figure, footer, header, menu, nav, section {display: block;}
html {height:auto;-webkit-text-size-adjust: none;-moz-text-size-adjust: none;-ms-text-size-adjust: none; }
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content:none;}
table {border-collapse:collapse;border-spacing:0;}
a {text-decoration:none;color:inherit;}
a:hover {text-decoration:none;}
legend, caption, hr {display:none;}
th {font-weight: inherit}
em {font-style:normal;}
img {vertical-align:top;}
input {vertical-align:middle;}
p,h3,h2,h1 {letter-spacing: normal;}
input,textarea,button,select {font-family:"HDFont", sans-serif; color: #222;}
/*section {width:100%;text-align: center;}*/
body {font-family:"HDFont", sans-serif;width: 100%;height: 100%; color:#222; background-color: #fff;font-weight: 400;}
video {object-fit: fill;}


#WRAP {overflow: hidden;}


.kr_sd_400{font-family: "HDFont",sans-serif;font-weight: 400}/* r */
.kr_sd_500{font-family: "HDFont",sans-serif;font-weight: 500}/* m */
.kr_sd_700{font-family: "HDFont",sans-serif;font-weight: 700}/* b */
.en_plain_t{font-family: "HDFont",sans-serif;font-weight:400;}/* Thin */
.en_plain_l{font-family: "HDFont",sans-serif;font-weight:400;}/* Light */
.en_plain_r{font-family: "HDFont",sans-serif;font-weight:500;}/* Regular */
.en_plain_b{font-family: "HDFont",sans-serif;font-weight:700;}/* Bold */

.fclear {*zoom:1}
.fclear:after {display:block;content:"";clear:both;}
.ir_text {text-indent: -9999px;overflow: hidden;font-size: 0 ;height: 0;}
.ir_text >* {text-indent: -9999px;overflow: hidden;font-size: 0 ;height: 0;}

.ellipsis {display: inline-block; max-width:100%;
 white-space: nowrap;
 -ms-text-overflow: ellipsis;
 -o-text-overflow: ellipsis;
 text-overflow: ellipsis;
 overflow: hidden;}
.ellipsis_line{
 /* font-size, line-height, max-height,-webkit-line-clamp : 개별적용(2줄이상) */
 position: relative;
 font-size: 16px;
 transition: all 0.3s;
 white-space: normal;
 word-wrap: break-word;
 line-height: 30px;
 max-height: 60px;
 -webkit-line-clamp: 2;
 display: -webkit-box;
 -webkit-box-orient: vertical;
 overflow: hidden;
}

/* ================================ desktop css ================================== */
.container {min-height: 768px;margin:88px auto 160px;}

#MAIN_CONTAINER .section {padding:0; width:auto; margin:0; box-sizing: unset;max-width: 100%;}
#MAIN_CONTAINER.container {min-height: auto; margin:0;}


#header {color: #fff;transition: transform 0.6s;}
#header .header-container{background: #141414; }
#header #nav .gnb li a span {color:#fff;}
#header #nav .gnb li a.on span{color: #007acc}
#header #nav .gnb li a.on span:after{width: 100%;opacity: 1}
#header #nav .gnb li.on.enter a span{color: #007acc}
#header #nav .gnb li.on.enter a span:after{width: 100%;opacity: 1}
#header .gnb-sub-menus .gnb-sub-menu ul li a.on span{color: #fff}
#header .gnb-sub-menus .gnb-sub-menu ul li a.on span:after{width: 100%;opacity: 1}
#header .gnb-sub-menus-depth2 .gnb-sub-menu ul li.on span{color: #222222}
#header .gnb-sub-menus-depth2 .gnb-sub-menu ul li.on span:after{width: 100%;opacity: 1}
#header.small{transform: translate(0,-100%)}

#footer{background: #1a1a1a}
#footer .logo span {padding-top: 14%;}
#footer .footer-menu li span { color: #fff;}

/*내꺼*/
/*#header .utils .language:before{margin-top:0; left:-24px;}*/
/*#header .utils .language a.current{color: #fff;padding: 0}*/
#header .utils .language a.current:after{display: none}
/*#header .utils .menu li.language{margin: 0}*/
/*#header .utils .menu li.split{margin: 0 0 0 1.067rem }*/
/*#header .utils .menu li.search{margin-left: 1.067rem }*/

/*서버꺼*/
/*!*#header .utils .language:before{margin-top: -2px;left: -1.9rem}*!*/
/*#header .utils .language a.current{color: #fff;padding: 0}*/
/*#header .utils .language a.current:after{display: none}*/
/*!*#header .utils .menu li.language{margin: 0}*!*/
/*!*#header .utils .menu li.split{margin: 0 0 0 1.067rem }*!*/
/*!*#header .utils .menu li.search{margin-left: 1.067rem }*!*/


 /* ================================== Laptop css ================================== */
@media all and (max-width: 1280px) {
    .container {margin-top:85px;}
}


/* ================================== Tablet css ================================== */
@media all and (max-width: 1080px){
    img {max-width: 100%;}
    .container {margin:76px auto 120px;}
}

/* ================================== Mobile css ================================== */
@media all and (max-width: 766px){
    .container {margin:64px auto 60px;}

    #footer .footer-top{padding: 45px 0 20px}
    #footer .footer-menu li.split {opacity: 0;display: none;}
    #footer .footer-menu li{margin-bottom:18px; margin-right:22px;}

    #footer .sns{margin-right: 0}
    #footer .familysite .nice-select{width: 16.5rem}
}
/* ================================== Mobile css ================================== */
@media all and (max-width: 481px){
    .container {margin:62px auto 60px;}
}