@charset "utf-8";

/* font-family */
@font-face {
	font-family: 'noto-thin';
	font-weight: normal;
	font-style: normal;
	src: url('../font/eot/NotoSansKR-Thin-Hestia.eot');
	src: local('※'), url('../font/eot/NotoSansKR-Thin-Hestia.eot?#iefix') format('embedded-opentype'),
	url('../font/woff/NotoSansKR-Thin-Hestia.woff') format('woff'),
	url('../font/otf/NotoSansKR-Thin-Hestia.otf') format('truetype');
}
@font-face {
	font-family: 'noto-light';
	font-weight: normal;
	font-style: normal;
	src: url('../font/eot/NotoSansKR-Light-Hestia.eot');
	src: local('※'), url('../font/eot/NotoSansKR-Light-Hestia.eot?#iefix') format('embedded-opentype'),
	url('../font/woff/NotoSansKR-Light-Hestia.woff') format('woff'),
	url('../font/otf/NotoSansKR-Light-Hestia.otf') format('truetype');
}
@font-face {
	font-family: 'noto-demilight';
	font-weight: normal;
	font-style: normal;
	src: url('../font/eot/NotoSansKR-DemiLight-Hestia.eot');
	src: local('※'), url('../font/eot/NotoSansKR-DemiLight-Hestia.eot?#iefix') format('embedded-opentype'),
	url('../font/woff/NotoSansKR-DemiLight-Hestia.woff') format('woff'),
	url('../font/otf/NotoSansKR-DemiLight-Hestia.otf') format('truetype');
}
@font-face {
	font-family: 'noto-regular';
	font-weight: normal;
	font-style: normal;
	src: url('../font/eot/NotoSansKR-Regular-Hestia.eot');
	src: local('※'), url('../font/eot/NotoSansKR-Regular-Hestia.eot?#iefix') format('embedded-opentype'),
	url('../font/woff/NotoSansKR-Regular-Hestia.woff') format('woff'),
	url('../font/otf/NotoSansKR-Regular-Hestia.otf') format('truetype');
}
@font-face {
	font-family: 'noto-medium';
	font-weight: normal;
	font-style: normal;
	src: url('../font/eot/NotoSansKR-Medium-Hestia.eot');
	src: local('※'), url('../font/eot/NotoSansKR-Medium-Hestia.eot?#iefix') format('embedded-opentype'),
	url('../font/woff/NotoSansKR-Medium-Hestia.woff') format('woff'),
	url('../font/otf/NotoSansKR-Medium-Hestia.otf') format('truetype');
}
@font-face {
	font-family: 'noto-bold';
	font-weight: normal;
	font-style: normal;
	src: url('../font/eot/NotoSansKR-Bold-Hestia.eot');
	src: local('※'), url('../font/eot/NotoSansKR-Bold-Hestia.eot?#iefix') format('embedded-opentype'),
	url('../font/woff/NotoSansKR-Bold-Hestia.woff') format('woff'),
	url('../font/otf/NotoSansKR-Bold-Hestia.otf') format('truetype');
}
@font-face {
	font-family: 'noto-black';
	font-weight: normal;
	font-style: normal;
	src: url('../font/eot/NotoSansKR-Black-Hestia.eot');
	src: local('※'), url('../font/eot/NotoSansKR-Black-Hestia.eot?#iefix') format('embedded-opentype'),
	url('../font/woff/NotoSansKR-Black-Hestia.woff') format('woff'),
	url('../font/otf/NotoSansKR-Black-Hestia.otf') format('truetype');
}

/*------------------------------------
    Common
------------------------------------*/
b,h1,h2,h3,h4,h5,h6,th,dt, strong {
	font-family:'noto-medium', dotum, Arial, sans-serif;
    box-sizing: border-box;
}
body,p,div,ul,li,dl,dd,ol,fieldset,textarea,input,select,table,td,address,cite,a,em,span {
	font-family:'noto-light', dotum, Arial, sans-serif;
    box-sizing: border-box;
}
.ir {position:absolute; left:-9999px; top:-9999px; font-size:0; line-height:0; height:0; overflow:hidden;}
.is_pc, .is_tablet, .is_mobile {display: none;}
.Desktop .is_pc, .Tablet .is_tablet, .Mobile .is_mobile {display: block;}

/*------------------------------------
    layout
------------------------------------*/
#header {width: 100%;position: absolute;top:0;left:0;z-index: 30;background-color: #fff;}
#header .inner {width: 1200px;margin: 0 auto;position: relative;}
#header .inner:after {content: "";display: block;clear: both;}
#header .top {border-bottom:1px solid #d4d4d4;}
#header .top .btn_direct {float: left;}
#header .top .btn_direct li {float: left;border-right: 1px solid #d4d4d4;}
#header .top .btn_direct li:first-child {border-left: 1px solid #d4d4d4;}
#header .top .btn_direct a, #header .top .user_area a {padding: 0 20px;display: block;line-height: 39px;color: #333;font-size:15px;}
#header .top .btn_direct li span {display: inline-block;padding-right: 18px;background: url('../../images/ico/ico_direct_arrow.png') 100% 50% no-repeat;}



#header .top .user_area {float: right;}
#header .top .user_area li {float: left;border-right: 1px solid #d4d4d4;}
#header .top .user_area li:first-child {border-left: 1px solid #d4d4d4;}
#header .top .user_area li span {padding-left: 25px;display: inline-block;background-repeat: no-repeat;background-position: 0 50%;}
#header .top .user_area li a.btn_login span {background-image: url('../../images/ico/ico_login.png');}
#header .top .user_area li a.btn_joinus span {background-image: url('../../images/ico/ico_joinus.png');}

#header .header_bg.active {border-bottom: 1px solid #d4d4d4;}
#header .header_bg .inner {padding-left: 370px;}
#header .header_bg .logo {position: absolute;top:20px;left:0;font-size:0;}
#header .header_bg .logo a {height: 100%;display: inline-block;}
#header .header_bg .logo img {height: 100%;}
#header .header_bg .gnb_bg {height: 91px;border-bottom: 1px solid #d4d4d4;}
#header .header_bg #btn_gnb {display: none;}
#header .gnb_list_wrap .top_btn {display: none;}

#menuUItop {}
#menuUItop .top_k2wiz_GNB {}
#menuUItop .top_k2wiz_GNB:after {content: "";display: block;clear: both;}
#menuUItop .li_1 {float: left;text-align: center;position: relative;}
#menuUItop .a_1 {padding: 31px 0;font-size:18px;color: #3b3c40;font-family:'noto-medium', dotum, Arial, sans-serif;line-height: 30px;display: inline-block;}
#menuUItop .div_2 {width: 100%;position: absolute;top:91px;left:0;display: none;border-right: 1px solid #d6d6d6;}
#menuUItop .li_1:first-child .div_2 {border-left: 1px solid #d6d6d6;}
#menuUItop .li_2 {position: relative;}
#menuUItop .a_2 {padding: 15px 0;display: block;font-size:16px;color: #5f6468;line-height: 22px;}
#menuUItop .li_2.active .a_2, #menuUItop .li_2:hover .a_2 {background-color: #5f6468;color: #fff;font-family:'noto-medium', dotum, Arial, sans-serif;}
#menuUItop .div_3 {width: 101%;padding: 0 10px;margin-left: 1px;position: absolute;top:0;left:100%;background-color: #5f6468;display: none;z-index: 10;}
#menuUItop .li_3 {padding: 10px 0;border-top: 1px solid #7f8386;text-align: left;}
#menuUItop .li_3:first-child {border-top: none;}
#menuUItop .a_3 {padding-right: 10px;font-size:14px;color: #ddd;display: block;}
#menuUItop .li_3.active .a_3, #menuUItop .a_3:hover {color: #fefefe;font-family:'noto-medium', dotum, Arial, sans-serif;background: url('../../images/ico/ico_gnb_dep3_right.png') 100% 50% no-repeat;}

#mainContainer, #subContainer {position: relative;z-index: 10;}

#footer {position: relative;z-index: 20;background-color: #373a3d;}
#footer .inner {width: 1200px;margin: 0 auto;position: relative;}
#footer .top {border-bottom:1px solid #666;background-color: #313437;}
#footer .top .btn_fot_select {display: none;}
#footer .link_area {overflow: hidden;}
#footer .link_area li {width: 16.66%;padding: 15px 10px;float: left;text-align: center;border-right:1px solid #666;display: table;}
#footer .link_area li:first-child {border-left:1px solid #666;}
#footer .link_area li a {font-size:14px;color: #fefefe;display: table-cell;vertical-align: middle;}
#footer .fot_cont {padding: 35px 0 35px;}
#footer .fot_cont > .inner {padding-left: 230px;padding-bottom: 50px;}
#footer .fot_logo {height: 55px;position: absolute;top:-10px;left:0;}
#footer .fot_logo a {height: 100%;display: inline-block;}
#footer .fot_logo img {height: 100%;}
#footer address, #footer p.copy {font-size:14px;color: #ccc;}
#footer address .c_white, #footer p.copy .c_white {color: #fff;}
#footer .fot_menu {overflow: hidden;position: absolute;top:0;right:0;}
#footer .fot_menu li {float: left;position: relative;}
#footer .fot_menu li:before {content: "";display: inline-block;width: 1px;height: 16px;margin: 0 10px;background-color: #777;vertical-align: text-bottom;}
#footer .fot_menu li:first-child:before {display: none;}
#footer .fot_menu li a {font-size:14px;color: #fefefe;display: inline-block;line-height: 22px;}
#footer .fot_menu li a:hover, #footer .fot_menu li a:active {color: #cbcbf9;}
#footer .fm_select {min-width: 165px;position: absolute;bottom:0;right:0;}
#footer .fm_select .view {width: 100%;padding: 10px;font-size:16px;color: #bcbcbc;line-height: 18px;background-color: #1b1e21;border: 1px solid #0b0c0e;text-align: left;}
#footer .fm_select .view span {display: block;background: url('../../images/ico/ico_fm_plus.png') 100% 50% no-repeat;}
#footer .fm_select.active .view span {background-image: url('../../images/ico/ico_fm_minus.png');}
#footer .fm_select.active .list {display: block;}
#footer .fm_select .list {width: 100%;padding: 15px;position: absolute;bottom:40px;left:0;background-color: #474a4c;display: none;}
#footer .fm_select .list li {margin-top: 5px;}
#footer .fm_select .list li:first-child {margin-top: 0;}
#footer .fm_select .list li a {font-size:14px;color: #bcbcbc;line-height: 18px;}
#footer .fm_select .list li a:hover {color: #fff;}

/* tablet */
@media screen and (max-width: 1200px) {
	/*------------------------------------
	    layout
	------------------------------------*/
	#header {position: relative;}
	#header .inner {width: auto;}
	#header .top {display: none;}

	#header .header_bg .inner {padding-left: 0;}
	#header .header_bg .logo {padding: 12px 0 0 25px;position: relative;top:0;}
	#header .header_bg .gnb_bg {height: 70px;border-bottom: none;}
	#header .header_bg.active .gnb_bg {width: 100%;height: 100%;position: fixed;top:0;left:0;background-color: #fff;overflow-y: auto;}
	#header .header_bg #btn_gnb {width: 60px;height: 70px;display: block;background:url('../../images/ico/ico_gnb_open.png') 50% no-repeat;background-size: 20px auto;position: absolute;top:0;right:0;}
	#header .header_bg.active #btn_gnb {background-image: url('../../images/ico/ico_gnb_close.png');}
	#header .gnb_list_wrap {width: 100%;position: absolute;top:70px;left:0;display: none;}
	#header .header_bg.active .gnb_list_wrap {display: block;}
	#header .gnb_list_wrap .top_btn {overflow: hidden;display: block;}
	#header .gnb_list_wrap .top_btn a {width: 33.33%;padding: 15px 0;display: inline-block;text-align: center;float: left;font-size:14px;color: #fff;}
	#header .gnb_list_wrap .top_btn a span {display: inline-block;line-height: 20px;}
	#header .gnb_list_wrap .top_btn a.purple_1 {background-color: #6c6cb7;}
	#header .gnb_list_wrap .top_btn a.purple_2 {background-color: #515198;}

	#menuUItop {}
	#menuUItop .li_1 {float: none;text-align: left;border-bottom:1px solid #d4d4d4;}
	#menuUItop .a_1 {display: block;padding: 25px 40px 25px 20px;font-size:18px;color: #333;line-height: 20px;position: relative;font-family:'noto-light', dotum, Arial, sans-serif;}
	#menuUItop .li_1.dep .a_1:after {content: "";display: block;width: 15px;height: 100%;background: url('../../images/ico/ico_gnb_dep1_down.png') 100% 50% no-repeat;background-size: 15px auto;position: absolute;top:0;right:20px;}
	#menuUItop .li_1.active .a_1 {font-family:'noto-medium', dotum, Arial, sans-serif;color: #60609f;}
	#menuUItop .li_1.active .a_1:after {background-image: url('../../images/ico/ico_gnb_dep1_up.png');}
	#menuUItop .div_2 {position: relative;top:0;display: none;background-color: #f8f8f8;border-top: 1px solid #d4d4d4;border-right: none;}
	#menuUItop .li_1:first-child .div_2 {border-left: none;}
	#menuUItop .li_1.active .div_2 {display: block;}
	#menuUItop .li_2 {border-top: 1px solid #dbdbdb;}
	#menuUItop .li_2:first-child {border-top:none;}
	#menuUItop .a_2 {padding: 15px 40px 15px 20px;font-size:14px;color: #333;line-height: 20px;position: relative;}
	#menuUItop .li_2.dep .a_2:after {content: "";display: block;width: 15px;height: 100%;background: url('../../images/ico/ico_gnb_dep2_down.png') 100% 50% no-repeat;background-size: 15px auto;position: absolute;top:0;right:20px;}
	#menuUItop .li_2.active .a_2:after {background-image: url('../../images/ico/ico_gnb_dep2_up.png');}
	#menuUItop .li_2.active .a_2, #menuUItop .li_2:hover .a_2 {background-color: transparent;color: #333;font-family:'noto-light', dotum, Arial, sans-serif;}
	#menuUItop .div_3 {width: auto;padding: 15px 25px;margin-left: 0;position: relative;left:0;background-color: transparent;display: none;border-top: 1px solid #dbdbdb;}
	#menuUItop .li_2.active .div_3 {display: block;}
	#menuUItop .li_3 {margin-top: 15px;padding: 0;border-top: none;}
	#menuUItop .li_3:first-child {margin-top: 0;}
	#menuUItop .a_3 {padding-right: 0;font-size:13px;color: #777;}
	#menuUItop .li_3.active .a_3, #menuUItop .a_3:hover {color: #777;font-family:'noto-light', dotum, Arial, sans-serif;background: none;}

	#footer {}
	#footer .inner {width: auto;}
	#footer .link_area {padding: 0 20px;overflow: hidden;}
	#footer .link_area li {padding: 10px;}
	#footer .fot_cont {padding: 20px;}
	#footer .fot_cont > .inner {padding-left: 0;}
	#footer .fot_cont .fot_top {margin-bottom: 20px;overflow: hidden;}
	#footer .fot_logo {margin-top: 0;position: relative;top:0;float: left;}
	#footer address, #footer p.copy {font-size:14px;color: #ccc;}
	#footer .fot_menu {margin-left: 30px;margin-top: 12px;position: relative;top:0;float: left;}

	#footer .fm_select {position: absolute;bottom:inherit;top:0;right:0;}
}

/* Mobile */
@media screen and (max-width: 768px) {
	/*------------------------------------
	    layout
	------------------------------------*/
	#header .header_bg .logo {padding: 7px 0 0 10px;}
	#header .header_bg .logo a {height: 40px;}
	#header .header_bg .gnb_bg {height: 55px;}
	#header .header_bg #btn_gnb {width: 50px;height: 55px;}
	#header .gnb_list_wrap {top:55px;}

	#footer .top {padding: 15px 10px;background-color: #ececec;}
	#footer .top .btn_fot_select {height: 32px;padding: 0 15px;display: block;line-height: 32px;background-color: #6f6fb9;font-size:12px;color: #fff;position: relative;border: 1px solid #e0e0e0;}
	#footer .top .btn_fot_select:after {content: "";display: block;width: 9px;height: 5px;margin-top: -2px;background: url( '../../images/ico/ico_fot_select_down.png' ) 0 0 no-repeat;position: absolute;top:50%;right:15px;background-size: 9px auto;}
	#footer .top.active .btn_fot_select:after {background-image: url('../../images/ico/ico_fot_select_up.png');}
	#footer .link_area {width: 100%;position: absolute;bottom:30px;left:0;border:1px solid #e0e0e0;display: none;}
	#footer .top.active .link_area {display: block;}
	#footer .link_area {padding: 20px 15px;background-color: #fff;}
	#footer .link_area li {width: auto;margin-top: 8px;padding: 0;float: none;text-align: left;border-right:none;display: block;}
	#footer .link_area li:first-child {border-left:none;margin-top: 0;}
	#footer .link_area li a {font-size:12px;color: #333;display: inline-block;}

	#footer .fot_cont {padding: 15px 10px;}
	#footer .fot_cont .fot_top {margin-bottom: 10px;}
	#footer .fot_logo {height: 30px;float: none;}
	#footer address, #footer p.copy {font-size:11px;}
	#footer .fot_menu {margin-left: 0;margin-top: 10px;float: none;}
	#footer .fot_menu li:before {height: 10px;}
	#footer .fot_menu li a {font-size:11px;line-height: 16px;}

	#footer .fm_select {min-width: 130px;}
	#footer .fm_select .view {padding: 6px 10px;font-size:13px;line-height: 16px;}
	#footer .fm_select .view span {background-size: 10px auto;}
	#footer .fm_select .list {padding: 10px;bottom:30px;}
	#footer .fm_select .list li a {font-size:11px;line-height: 16px;}
}


/* ==========================================================================
        share  CSS
========================================================================== */

#share {
  position: relative;
  float:right;
  margin-right:5px;
}

#share .btnShare {
  width: 50px;
  height: 50px;
  background: #f8f9fa url(../../images/common/share.jpg) no-repeat center center;
  border: 1px solid #e1e4e7;
  text-indent: -9999px;
}

#share .box-share {
  opacity:0; 
  overflow:hidden; 
  max-height:0px; 
  position:absolute; 
  top:50px; 
  width:50px; 
  border:1px solid #c7c7c7; 
  background:#fff; 
  transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1);
}

#share .box-share.on{
  opacity:1; 
  max-height:1000px; 
  transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1); 
  transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1);
  padding-top:5px;
}
#share .box-share .box-copy button{
  text-indent: -9999px;
  display: inline-block;
  width: 38px;
  height: 38px;
  margin: 6px 6px 6px 6px;
}

#share .box-share .copy{
  background: url(../../images/common/ic-copy.png) no-repeat center;
}

#share .box-share .close{
  width:100%;
  height:55px;
  text-indent:-9999px;
  background: url(../../images/common/btn-gnb-close.png) no-repeat center center;
}