@charset "utf-8";

@import url('reset.css');
@import url('fonts.css');

/* html{ overflow: hidden; height: 100%; } 
body{ overflow: auto; height: 100%; } */


/* common */
.inner-wrap {position:relative;  max-width:1180px; margin:0 auto;}

/* ---- head-util ---- */
.headUtil {position:relative; z-index:50; background:#222;}
.headUtil .inner-wrap {display:flex; justify-content: flex-end; height:50px;}/*0423yu*/

.social_info {position:absolute; top:0; left:0; bottom:0; display:flex; align-items:center;}
.social_info .btn_sns {display:none;}
.sns_wrap {display:block;}
.sns_wrap>a {display:inline-block; min-height:17px; margin-right:3px; opacity:.6; font-size:0; text-indent:-9999px; overflow:hidden;}
.sns_wrap>a.btn_fb {width:20px; background:url('/images/common/ico_fb.png') no-repeat center; background-size:8px auto;}
.sns_wrap>a.btn_tw {width:34px; background:url('/images/common/ico_tw.png') no-repeat center; background-size:16px auto;}
.sns_wrap>a.btn_gp {width:34px; background:url('/images/common/ico_gp.png') no-repeat center; background-size:15px auto;}
.sns_wrap>a:hover {opacity:1;}

.login_wrap {height:50px; display:flex; align-items:center;}/*0423yu*/
.login_wrap .btn_login {position:relative; display:block; padding:0 20px 0 34px; font-size:1.3rem; color:rgba(216, 216, 216, 1);}/*0423yu*/
.login_wrap .btn_login::after {content:''; position:absolute; top:-3px; left:0; width:24px; height:18px; background:url('/images/common/ico_login.png') no-repeat 0 center; background-size:24px auto; opacity:.43;}

/* .login_wrap .login_user {display:none;} */
.login_wrap .login_user>em {position:relative; padding-left:24px; font-size:1.3rem; color:rgba(216, 216, 216, 1);}
.login_wrap .login_user>em::after {content:''; position:absolute; top:0; left:0; width:20px; height:18px; background:url('/images/common/ico_user.png') no-repeat 0 center; background-size:16px auto; opacity:.43;}
.login_wrap .login_user>em>a {color:inherit; font-size:inherit;}

.login_wrap .login_user a.logout {position:relative; padding:0 10px 0 23px; font-size:1.3rem; color:rgba(216, 216, 216, 1);}/*0423yu*/
.login_wrap .login_user a.logout::after {content:''; position:absolute; top:3px; left:11px; bottom:3px; width:1px; background:rgba(255, 255, 255, .25);}

.lang_wrap {display:flex; align-items:center; margin-left:10px;}/*0423yu*/
.lang_wrap>a {padding:0 23px; vertical-align:middle; line-height:4.2; font-size:1.2rem; color:rgba(255, 255, 255, 0.44); background:rgba(255,192,0,.22);}
.lang_wrap>a:hover {color:rgba(255, 255, 255, 1);}
.lang_wrap>a.active {color:rgba(34, 34, 34, .63); background:rgba(255,192,0,1);}

.headUtil .btn_nav {display:none; top:12px;}


/* ---- header ---- */
#header {z-index:50; position:absolute; top:50px; left:0; right:0;}
#header h1 {position:absolute; top:-10px; left:0; width:200px; height:44px;  background:url('/images/common/logo_w.png') no-repeat; background-size:auto 43px;}/*0604 HEE*/
/* background:url('/images/common/logo_w.png') no-repeat; */
#header h1>a {display:block; width:100%; height:100%; text-indent:-99999px; font-size:0; overflow:hidden; }

#nav>ul {display:flex; justify-content:flex-end; margin-top:40px; margin-right:52px;}
#nav>ul>li {position:relative;}
#nav>ul>li::after {content:''; position:absolute; top:-40px; left:0; right:0; height:3px; background:transparent;
  -webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;}
#nav>ul>li:hover::after {background:#fe9043;}
#nav .dep {position:relative; margin:0 24px; padding-bottom:40px; cursor:pointer;}
#nav .dep>em {display:block; padding-right:18px; font-size:1.5rem; color:#fff;}
#nav .dep>.btn_arr {position:absolute; top:4px; right:0; width:10px; height:7px; font-size:0; text-indent:-9999px; background:url('/images/common/ico_nav_dw.png') no-repeat; opacity:.5;}
#nav .dep>.btn_arr.active{transform:rotate(0.5turn); 
  -webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;}

#nav .submenu {display:none; position:absolute; top:55px; left:0; width:220px; padding:10px 20px 22px 20px; background:#e25945; border-radius:0 0 8px 8px;}
#nav .submenu li {border-bottom:1px solid rgba(255,255,255,.2);}
#nav .submenu li:last-child {border-bottom:none;}
#nav .submenu li>a {display:block; padding:14px 0; font-size:1.2rem; color:#fff;}
#nav .submenu li>a:hover {color:#000;}

.btn_nav {z-index:50; position:absolute; top:-8px; right:0;}
.btn_nav .icon {position:relative; display:block; width:28px; height:28px; cursor:pointer;}
.btn_nav .icon>span {position:absolute; right:0; display:block; width:28px; height:3px; background:#fff; transition: all .3s;}
.btn_nav .icon>span:nth-child(1) {top:4px;}
.btn_nav .icon>span:nth-child(2) {top:12px;}
.btn_nav .icon>span:nth-child(3) {top:20px;}
.btn_nav.active span:nth-child(1) {transform:rotate(45deg); top:12px;}
.btn_nav.active span:nth-child(2) {opacity:0; visibility:hidden;}
.btn_nav.active span:nth-child(3) {transform:rotate(-45deg); top:12px;}

.allMenu {display:none; z-index:51; position:fixed; top:145px; left:50%; margin-left:-590px; padding:8px 0 27px 0; background:#e25945; box-sizing:border-box;}
.allMenu .inner {height:100%; overflow:hidden;}
.allMenu .allMenu-list {display:flex; min-width:1180px;}
.allMenu .allMenu-list>li {width:20%; padding:0 15px; box-sizing:border-box;}
.allMenu .dep {position:relative; border-bottom:1px solid rgba(255,255,255,.5);}
.allMenu .dep>em {display:block; padding:13px 0; margin-bottom:5px; color:#fff; font-family:'NSM'; font-size:1.6rem;}
.allMenu .dep>.btn_arr {display:none;}

.allMenu .submenu li {border-bottom:1px solid rgba(255,255,255,.2);}
.allMenu .submenu li:last-child {border-bottom:none;}
.allMenu .submenu a {display:block; padding:14px 0; color:#fff; font-size:12px;}
.allMenu .submenu a:hover {color:#000;}

.dimd {position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0, 0, 0, 0);}

.ex-hidden {overflow:hidden !important; touch-action:none;}

 /* ---- footer ----  */
#footer {padding:54px 0; text-align:center; background:#35353b;}
#footer em {display:inline-block; width:86px; height:44px; margin-bottom:33px; opacity:.5;}
#footer .social {margin-bottom:50px;}
#footer .social>a {display:inline-block; width:39px; height:39px; margin:0 6px; text-indent:-9999px; overflow:hidden; border-radius:100%;}
#footer .social>a.btn_fb {background:#e25945 url('/images/common/ico_fb.png') no-repeat center; background-size:8px auto;}
#footer .social>a.btn_tw {background:#e25945 url('/images/common/ico_tw.png') no-repeat center; background-size:16px auto;}
#footer .social>a.btn_gp {background:#e25945 url('/images/common/ico_gp.png') no-repeat center; background-size:15px auto;}
#footer .copyright {color:#ccccce; font-family:'NSL'; font-size:1.2rem; letter-spacing:.2rem; text-transform:uppercase;}

.pg_top {position:fixed; right:10px; bottom:10px; width:45px; height:45px; text-align:-9999px; z-index:999;}

/* sticky */
#header.sticky {position:fixed; top:0; left:0; right:0; height:50px; z-index:100; background:#222;}
#header.sticky>.inner-wrap {z-index:200; padding:0; height:100%;}
#header.sticky h1 {top:0; height:100%; width:61px; background-position:0 center; background-size:61px auto;;}
#header.sticky #nav>ul {margin-top:0;}
#header.sticky #nav .dep {padding:18px 0;}
#header.sticky #nav .dep>.btn_arr {top:21px;}
#header.sticky #nav .submenu {top:50px;}
#header.sticky .btn_nav {top:11px; right:12px;}
#header.sticky .dimd {display:none;}

.allMenu.sticky {display:none; z-index:51; position:fixed; top:50px; left:0; width:100%; right:0; margin:0; padding:8px 0 27px 0; background:#e25945;}
.allMenu.sticky .allMenu-list {max-width:1180px; margin:0 auto;}


@media only screen and (min-width: 1180px){
  /* .type_b #header.sticky {display:none;} */
  
}
@media only screen and (max-width: 1180px){
  .headUtil>.inner-wrap {margin:0 0 0 20px;}
  #header>.inner-wrap {margin:0 20px;}

  #header.sticky h1 {left:20px;}
  #header.sticky>.inner-wrap {margin:0;}
}

@media only screen and (max-width: 1024px){
  #header h1 {top:29px;}
  .login_wrap .btn_login::after {opacity:1;}

  #nav>ul {display:none;}
  
  .btn_nav {top:28px;}

  .allMenu {left:0; bottom:0; width:100%; right:0; margin:0; padding:0;}
  .allMenu .allMenu-list {display:block; min-width:auto;}
  .allMenu .allMenu-list>li {position:relative; width:100%; padding:0;}
  .allMenu .allMenu-list>li::after {content:''; position:absolute; bottom:0; left:0; right:0; border-bottom:1px solid rgba(255,255,255,.3);}
  .allMenu .dep {position:relative; padding-left:18px; box-sizing:border-box;}
  .allMenu .dep>.btn_arr {display:block; position:absolute; top:0; right:0; display:block; width:42px; height:47px; text-indent:-99999px; overflow:hidden; background:url('/images/common/ico_nav_dw.png') no-repeat center;}
  .allMenu .dep>.btn_arr.active {transform:rotate(0.5turn); 
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    -ms-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;}

  .allMenu .submenu {display:none; background:rgba(0,0,0,.2);}
  .allMenu .submenu li {border-bottom:1px solid rgba(255,255,255,.3);}
  .allMenu .submenu li:last-child {border-bottom:1px solid rgba(255,255,255,.3);}
  .allMenu .submenu a {padding:14px 12px 14px 42px;}
}
@media only screen and (max-width: 767px){

  .headUtil>.inner-wrap {margin:0 40px 0 8px;}/*0423yu*/

  /* headUtil */
  .social_info {position:static;}/*0423yu*/
  .social_info .btn_sns {position:relative; display:block; width:40px; height:50px; text-indent:-99999px; font-size:0; overflow:hidden; background:url('/images/common/ico_sns.png') no-repeat center; background-size:17px;}
  .social_info .btn_sns::after,
  .social_info .btn_sns::before {opacity:0; content:''; position:absolute; left:10px; width:20px; height:2px; background:#fff; transition: all .3s;}
 
  .social_info .btn_sns::after {top:17px;}
  .social_info .btn_sns::before {top:29px;}

  .social_info .btn_sns.active { background:none;}
  .social_info .btn_sns.active::after {opacity:1; display:block; top:25px; transform:rotate(45deg);}
  .social_info .btn_sns.active::before {opacity:1; display:block; top:25px; transform:rotate(-45deg);}

  .sns_wrap {display:none; position:fixed; top:50px; left:0; right:0;padding:22px 0; text-align:center; background:#e25945;}
  .sns_wrap.active {display:block;}
  .sns_wrap>a {display:inline-block; height:30px; margin:0 11px; opacity:1;}
  .sns_wrap>a.btn_fb {background-size:13px auto;}
  .sns_wrap>a.btn_tw {background-size:27px auto;}
  .sns_wrap>a.btn_gp {background-size:25px auto;}

  .login_wrap {right:80px;}/*0423yu*/
  .login_wrap .btn_login {width:40px; height:50px; padding:0; text-indent:-99999px; font-size:0; overflow:hidden;}
  .login_wrap .btn_login::after {top:16px; left:8px;}

  /* 0420yu*/
  .login_wrap .login_user>em {display:none;}
  .login_wrap .login_user a.logout {display:block;width:40px; height:50px; padding:0; text-indent:-99999px; font-size:0; overflow:hidden; background:url('/images/common/ico_user.png') no-repeat center; background-size:17px auto;}
  .login_wrap .login_user a.logout::after {display:none;}
  /* //0420yu*/
  
  .lang_wrap {display:block; text-align:center; margin-left:0;}/*0423yu*/
  .lang_wrap>a {display:block; width:40px; padding:0; color:#fff; background:transparent;}
  .lang_wrap .kor {display:none;}

  /* header */
  #header>.inner-wrap {margin:0;}
  #header h1 {top:-37px; left:8px; width:140px; height:31px; background-size:auto 31px;}/*0604 HEE*/
  
  .btn_nav {top:-50px; right:0; width:40px; height:50px;}
  .btn_nav .icon {position:absolute; top:15px; left:10px; width:20px; height:20px;}
  .btn_nav .icon>span {width:20px; height:2px;}
  .btn_nav .icon>span:nth-child(1) {top:2px;}
  .btn_nav .icon>span:nth-child(2) {top:8px;}
  .btn_nav .icon>span:nth-child(3) {top:14px;}

  .btn_nav.active span:nth-child(1) {top:10px;}
  .btn_nav.active span:nth-child(3) {top:10px;}

  .allMenu {top:50px;}
  .allMenu .dep>em {font-size:1.5rem;}

  #header.sticky h1 {left:10px;}
  #header.sticky .btn_nav {top:0; right:0;}
  
  .pg_top {right:5px; bottom:5px; width:30px; height:30px;}

  #footer {padding:40px 0;}
  #footer em {width:71px; height:auto; margin-bottom:20px;}
  #footer .social {margin-bottom:30px;}
  #footer .social>a {width:34px; height:34px; margin:0 3px;}
  #footer .social>a.btn_fb {background-size:6px auto;}
  #footer .social>a.btn_tw {background-size:12px auto;}
  #footer .social>a.btn_gp {background-size:12px auto;}
  #footer .copyright {font-size:1.0rem; letter-spacing:.1rem}
} 

/* 로그인 팝업 */
#pop_login {display:none; z-index:300; position:absolute; top:100px; left:50%; margin-left:-156px; width:312px; padding:45px 23px; background:#fff; border:1px solid #d4d4d4;}
#pop_login .btn_colse {position:absolute; top:15px; right:13px; width:21px; height:21px; text-indent:-99999px; font-size:0; overflow:hidden; background:url('/images/common/btn_close.png') no-repeat;}
#pop_login .logo {text-align:center;}
#pop_login .logo>img {height:45px; max-width:210px;}/*0604 HEE*/
#pop_login strong {display:block; padding:24px 0 15px 0; text-align:center; color:#444; font-family:'NSM'; font-size:22px;}
#pop_login ul {border:1px solid #d4d4d4;}
#pop_login ul>li {border-bottom:1px solid #d4d4d4;}
#pop_login ul>li:last-child {border-bottom:none;}
#pop_login ul label {display:none;}
#pop_login ul input {width:100%; height:43px; color:#333; font-size:1.7rem; text-indent:10px;}
#pop_login .btn_log {display:block; width:100%; height:44px; line-height:2.8; text-align:center; color:#fff; font-size:1.6rem; border-radius:22px; background:#d6303a;}

#pop_login .check_tx {position:relative; padding:20px 0; cursor:pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
#pop_login .check_tx label {padding-left:33px; color:#444; font-size:1.2rem;}
#pop_login .check_tx input {position:absolute; opacity:0; cursor:pointer;}
#pop_login .check_tx .checkmark {position:absolute; top:50%; left:0; top:50%; margin-top:-10px; height:24px; width:24px; background:#fff url('/images/common/ico_check_gray.png') no-repeat center; border-radius:50%; border:1px solid #b3b3b3;}
#pop_login .check_tx input:checked ~ .checkmark {background:#fff url('/images/common/ico_check_red.png') no-repeat center; border-color:#d83842;}

@media only screen and (max-width: 767px){
  #pop_login {top:65px; left:50%; margin-left:-128px; width:210px; padding:45px 23px; background:#fff; border:1px solid #d4d4d4;}
}

/*0604 개별 로그인*/
.backAll {background:url(/images/main/img_visual_a01.jpg); background-size:cover; background-attachment:fixed;}
.backAll #pop_login {display:block; top:50%; margin-top:-195px; border-radius:20px;}
/*0604 등록일 추가*/
input.dtpw {width:150px; float:left;}