@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700');

/*********************************************
note : reset
*********************************************/
#header-wrapper {position:relative;width:100%;font-family:'Noto Sans KR',sans-serif;letter-spacing:-.05em}
#header-wrapper,#header-wrapper a {color:#878787;text-decoration:none;letter-spacing:0;}
#header-wrapper button {cursor:pointer}
#user-gnb,
#nav-header,
#user-nav {z-index:99;position:relative;display:table;width:100%}
#header-wrapper .no-bullet {margin-bottom:0}

/*********************************************
note : 최상단영역
*********************************************/
/* 기본 */
#user-gnb {background-color:rgba(0,0,0,.03)}
#user-gnb::before {content:'';position:absolute;left:0;right:0;bottom:0;}
/*#user-gnb::before {content:'';position:absolute;bottom:0;border-bottom:1px solid rgba(0,0,0,.12)}*/
#user-gnb > [class*="user-"] {overflow:hidden;height:30px;padding-top:.3rem;font-size:12px;font-weight:400;}

/* 최종편집 */
#user-gnb > .user-intro {float:left}
#user-gnb > .user-intro::before {content:'UPDATE : ';font-weight:500;color:#0068b1;}

/* 로그인/회원가입 */
#user-gnb > .user-logbox {float:right;margin-right:-.75rem}
#user-gnb > .user-logbox > li {float:left}
#user-gnb > .user-logbox > li::before {content:'|';color:rgba(0,0,0,.2)}
#user-gnb > .user-logbox > li:first-child::before {display:none}
#user-gnb > .user-logbox > li > a {padding:0 .62rem}

/*********************************************
note : 로고영역
*********************************************/
/* 기본 */
#nav-header > [class*="user-"] {display:table-cell;height:120px;vertical-align:middle}
#nav-header {margin: .625em 0 1rem;}

/* 기본 */
#nav-header > .user-banner {width:300px}

/* 지역 타이틀 */
#nav-header .user-logo {left: 50%; transform: translateX(-50%);}
#nav-header .user-logo {position:absolute;top:0}
#nav-header .user-logo > a,.user-logo > i {float:left}
#nav-header .user-logo > i {overflow:hidden;height:40px;margin: 3.125rem 0 0 .625rem;padding:0 .625rem;border-radius:0 5px;background-color:#0839a5;font-style:normal;line-height:38px;cursor:default}
#nav-header .user-logo > i > a,.user-logo > i > a:hover {color:#fff;font-size:26px;font-weight:500;letter-spacing:-0.08em;text-decoration:none}

@-webkit-keyframes blinker {from {opacity: 1.0;} to {opacity: 0.0;}}
@keyframes blinker {from {opacity: 1.0;} to {opacity: 0.0;}}
#nav-header .user-logo .blink{padding:0 .256rem;color:#fff;text-decoration: blink;animation-name: blinker;animation-duration: 0.8s;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-direction: alternate;-webkit-animation-name: blinker;-webkit-animation-duration: 0.8s;-webkit-animation-iteration-count:infinite;-webkit-animation-timing-function:ease-in-out;-webkit-animation-direction: alternate;}
#nav-header .user-logo .blinkbox {overflow:hidden;margin: 3.125rem 0 0 .625rem;padding:0 .625rem;font-size: 22px;font-weight:bold;border-radius:0 5px;background-color:#c21a1a;line-height:38px;}
#nav-header .user-logo .blinkbox i {color:#Fff;vertical-align:-10%;}

/*********************************************
note : 메뉴영역
*********************************************/

/* 기본 */
#user-nav {letter-spacing: -0.08em;border-bottom: 2px solid #000; border-top: 4px double rgba(68, 67, 67, 0.2);}
#user-nav::before {content:'';z-index:-1;position:absolute;left:0;bottom:0;border-bottom:1px solid rgba(0,0,0,.12)}
#user-nav::after {content:'';z-index:-1;position:absolute;left:0;bottom:-42px;border-bottom:1px solid rgba(0,0,0,.12)}
#user-nav > [class*="user-"] {float:left;height:44px;font-size:1.125rem;font-weight:500;line-height:1}
#user-nav .article-menu {display:none}

/* 전체 */
#user-nav > .user-allbtn {float:left;position:relative;z-index:2;height:44px;padding-right:1rem;font-size:1.1rem;font-weight:700;letter-spacing:-0.05em;color:#000;cursor:pointer}
#user-nav > .user-allbtn::after {content:'';position:absolute;z-index:1;top:1rem;bottom:1rem;right:0;width:0;line-height:3;border-left:1px solid #000;}


/* 메뉴바 - 1차섹션 */
#user-nav > .user-menu > .secline {display:inline-block}
#user-nav > .user-menu > .secline > a {display:inline-block;position:relative;padding:0 1rem;line-height:2.4;letter-spacing: -0.1em;font-weight:700;color:#000;text-decoration:none;-moz-transition:all .25s;transition:all .25s}
#user-nav > .user-menu > .secline > a.a-hover {color:#0068b1;}
#user-nav > .user-menu > .secline > a.a-hover::before {border-top-color:#e6336e}
#user-nav > .user-menu > .secline:last-child > a {color:#0068b1;}
#user-nav > .user-menu > .secline ul {display:none;position:absolute;z-index:998;left:0;top:100%}
#user-nav > .user-menu > .secline ul li.sub {float:left;font-size:.9rem;line-height:1;letter-spacing:-0.05em}
#user-nav > .user-menu > .secline ul li.sub a {display:inline-block;padding:.9rem .625rem;font-weight:400;color:#888}
#user-nav > .user-menu > .secline ul li.sub a:hover {color:#333}
#user-nav span{padding-left:0.5rem;font-family:'Noto Sans KR',sans-serif;}


/* 메뉴바 - 2차섹션(가로) */
#user-nav.horizon > .user-menu > .secline > ul {visibility:hidden;overflow:hidden;z-index:9;position:absolute;top:100%;height:42px}
#user-nav.horizon > .user-menu > .secline > ul > .sub {float:left;font-size:.938rem;line-height:1.2em;letter-spacing:0}
#user-nav.horizon > .user-menu > .secline > ul > .sub::before {content:'|';color:rgba(255,255,255,.08)}
#user-nav.horizon > .user-menu > .secline > ul > .sub:first-child::before {display:none}
#user-nav.horizon > .user-menu > .secline > ul > .sub > a {display:inline-block;padding:.75rem 1rem;font-weight:400;color:rgba(255,255,255,.74)}
#user-nav.horizon > .user-menu > .secline > ul > .sub > a.a-sub-hover,
#user-nav.horizon > .user-menu > .secline > ul > .sub > a:hover {color:rgba(255,255,255,.9)}

/* 메뉴바 - 2차섹션(세로) */
#user-nav.vertical > .user-menu > .secline > ul {visibility:hidden;overflow:hidden;display:none;z-index:9;position:absolute;top:98.5%;width:160px;border:1px solid rgba(0,0,0,.12);background-color:#fff}
#user-nav.vertical > .user-menu > .secline > ul > .sub {border-top:1px solid rgba(0,0,0,.06);font-size:.938rem;line-height:1.2em;letter-spacing:0}
#user-nav.vertical > .user-menu > .secline > ul > .sub:first-child {border-top:none}
#user-nav.vertical > .user-menu > .secline > ul > .sub > a {display:inline-block;;width:100%;padding:.75rem 1rem;font-weight:400;color:rgba(0,0,0,.5)}
#user-nav.vertical > .user-menu > .secline > ul > .sub > a.a-sub-hover,
#user-nav.vertical > .user-menu > .secline > ul > .sub > a:hover {color:#fff}

/* 메뉴바 - 가로옵션:기본사이즈(서브) */
#user-nav.horizon.basic-mode {margin-left:auto;margin-right:auto;padding:0}
#user-nav.horizon.basic-mode > .user-menu > .secline > ul {left:0}

/* 메뉴바 - 가로옵션:전체사이트(서브) */
#user-nav.horizon.full-mode::before,
#user-nav.horizon.full-mode::after,
#user-nav.horizon.full-mode > .user-menu > .secline > ul {left:0;width:100%}
#user-nav.horizon.full-mode > .user-menu > .secline > ul::before {content:'';float:left;height:1px}

/* 메뉴바 - 세로옵션:기본사이즈(서브) */
#user-nav.vertical.basic-mode {margin-left:auto;margin-right:auto;padding:0}
#user-nav.vertical.basic-mode > .user-menu > .secline > ul {left:0}
#user-nav.vertical.basic-mode > .user-menu > .secline > ul > .sub {clear:both}

/* 메뉴바 - 세로옵션:전체사이트(서브) */
#user-nav.vertical.full-mode::before,
#user-nav.vertical.full-mode::after {left:0;width:100%}
#user-nav.vertical.full-mode > .user-menu > .secline > ul {height:300px}
#user-nav.vertical.full-mode > .user-menu > .secline > ul > .sub {float:left;width:50%}
#user-nav.vertical.full-mode .article-menu {display:block;position:absolute;left:320px;right:0;top:1.25rem;bottom:1.25rem;padding:0 1.25rem;border-left:1px solid rgba(0,0,0,.08)}

/* 메뉴바 - 수동서브메뉴 */
.sub-menu {padding: 0 calc((100% - 1280px) / 2);height:55px;}
.sub-menu .user-logbox,.sub-menu .user-logbox li {float:left;}
.sub-menu .user-logbox li {position:relative;padding: .875rem;font-size: .875rem;line-height:1;letter-spacing:-0.05em;}
.sub-menu .user-logbox li:last-child {padding-right:0}
.sub-menu .user-logbox li::before {content:'';position:absolute;left:0;top: 0.875rem;bottom: 0.875rem;border-left:1px solid rgba(0,0,0,.2);}
.sub-menu .user-logbox li:first-child::before {display:none}
.sub-menu .user-logbox li a {color:rgba(0,0,0,.5)}
.sub-menu .user-logbox li a:hover {color:rgba(0,0,0,.9)}

/* 서브 - 배너 */
#user-nav .banner {position:absolute;right:150px;bottom:-38px;}

/* 검색 */
#user-nav > .user-search-form {float:right;padding-top:10px}
#user-nav > .user-search-form input,#user-nav > .user-search-form button {float:left;margin:0;padding:0;height:29px}
#user-nav > .user-search-form input {width:200px;padding:.5rem;border:1px solid rgba(0,0,0,.12);border-radius:29px;font-size:14px;font-weight:300}
#user-nav > .user-search-form button {padding:0 .625rem;font-family:'Noto Sans KR',sans-serif;font-weight:400;letter-spacing:-.05em;-webkit-transition:all .3s;transition:all .3s}
#user-nav > .user-search-form button:hover {-webkit-transition:all .3s;transition:all .3s}

/*********************************************
Note : SNS
*********************************************/
#user-nav .sns-btn {position:absolute;right:36px;bottom:12px;}
#user-nav .sns-btn ul li {float:left;font-size:13px;padding:0 7px;}
#user-nav .sns-btn ul li a {overflow:hidden;display:block;height:20px;background:url('/image/icon_basic.png') no-repeat;text-indent:-5000px}
#user-nav .sns-btn ul li a.sns_fac,.sns-btn ul li a.sns_fac:hover {width:9px;background-position:0 -50px}
#user-nav .sns-btn ul li a.sns_twi,.sns-btn ul li a.sns_twi:hover {width:20px;background-position:-60px -48px}
#user-nav .sns-btn ul li a.sns_talk,.sns-btn ul li a.sns_talk:hover {width:20px;background-position:-120px -50px}
#user-nav .sns-btn ul li a.sns_story,.sns-btn ul li a.sns_story:hover {width:11px;background-position:-180px -50px}
#user-nav .sns-btn ul li a.sns_rss,.sns-btn ul li a.sns_rss:hover {width:18px;background-position:-240px -50px}

/*********************************************
Note : search
*********************************************/
#user-nav .search {position:absolute;right:0;bottom:10px;padding-left:10px;border-left:1px solid #ddd}
#user-nav .search a {overflow:hidden;display:block;width:22px;height:22px;background:url('/image/icon_basic.png') no-repeat -240px -100px;text-indent:-5000px}
#user-nav .search a.search-close {background-position:-240px -150px}
#user-nav .top-search {position:absolute;display:none;width:240px;height:35px;background-color:#fff;border:1px solid #bbb;right:30px;bottom:-5px;padding-left:10px;z-index:77}
#user-nav .top-search input {float:left;width:190px;height:33px;font-size:0.813rem;border:0;letter-spacing:-0.03em}
#user-nav .top-search input.inptxt {color:#aaa}
#user-nav .top-search input:focus::-webkit-input-placeholder {color:transparent; }
#user-nav .top-search button {overflow:hidden;float:left;width:20px;height:34px;margin-left:5px;background:url('/image/icon_basic.png') no-repeat -240px -93px;text-indent:-5000px}