@charset "UTF-8";

@font-face {
  font-family: "NEXON Gothic";
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF.eot");
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF.woff");
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF?#iefix") format('embedded-opentype'),
}

@font-face {
  font-family: "NEXON Gothic Light";
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF Light.eot");
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF Light.woff");
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF Light?#iefix") format('embedded-opentype'),
}

@font-face {
  font-family: "NEXON Gothic Bold";
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF Bold.eot");
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF Bold.woff");
  src: url("/public/common/font/nexon-lv1/NEXON Lv1 Gothic OTF Bold?#iefix") format('embedded-opentype'),
}


@font-face {
  font-family: "NEXON2 Gothic";
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic.eot");
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic.woff");
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic?#iefix") format('embedded-opentype'),
}

@font-face {
  font-family: "NEXON2 Gothic Light";
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic Light.eot");
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic ight.woff");
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic Light?#iefix") format('embedded-opentype'),
}

@font-face {
  font-family: "NEXON2 Gothic Bold";
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic Bold.eot");
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic Bold.woff");
  src: url("/public/common/font/nexon-lv2/NEXON Lv2 Gothic Bold?#iefix") format('embedded-opentype'),
}

body { font-family: NEXON Gothic, NEXON2 Gothic ;}


/* ------------------------------------------------------------------------------
 *
 *  # wevel story site common css
 *
 * ---------------------------------------------------------------------------- */
 .div-siz{
   width: 80%;
 }

 .top-space{
   padding-top: -5px;
   padding-bottom: -5px;
 }

 .table-top-interval{
   width: 25%;
 }

 .select-size{
   width: 148px;
   height: 27px;
 }


 .card-margin{
   margin-top: 20px;
 }

 #span_padding{
   padding-left: 10px;
 }

 .select-topmargin{
   margin-top: 5px;
 }



 .swal2-content{ font-size:1.8em; margin-top:10px;}



/* SNS LOGIN */
.login-sns{padding-bottom:10px;margin-top:5px;border: 1px solid #ddd; clear:both; background:#fff; text-align:center; }
.login-sns .sns-head { font-size:12px; padding:0; margin:0; padding:10px 0;text-align:center;color:#888;font-weight:normal}
.sns-icon {display:inline-block;vertical-align:middle;text-decoration:none}
.sns-icon:hover {text-decoration:none}
.sns-icon .ico {display:block;vertical-align:middle}
/*.sns-icon .txt {position:absolute;line-height:0;font-size:0;vertical-align:middle;overflow:hidden}*/
.sns-icon .txt i {font-style:normal}

#fregisterform .form_01 .reg-form {margin-bottom:20px}
#fregisterform .form_01 .reg-form .sns-wrap {margin:10px 0 0;text-align:left}
.reg-form .sns-icon {display:inline-block;vertical-align:middle;text-decoration:none;border-width:1px;border-style:solid;overflow:hidden;margin:0 1px}
.reg-form .sns-icon:hover {text-decoration:none}
.reg-form .sns-icon .ico {display:block;background:url('./img/sns_logo.png') no-repeat;vertical-align:middle;width:24px;height:24px}
.reg-form .sns-icon-not .ico {display:block;background:url('./img/sns_logo_not.png') no-repeat;vertical-align:middle}
.reg-form .sns-icon .txt {position:absolute;line-height:0;font-size:0;vertical-align:middle;overflow:hidden}
.reg-form .sns-icon .txt i {font-style:normal}

.sns-wrap-reg .sns-naver {border-color:#18a400;background:#2db400}
.sns-wrap-reg .sns-naver .ico {background-position:-29px 0; }
.sns-wrap-reg .sns-google {border-color:#ca2c19;background:#dd5443}
.sns-wrap-reg .sns-google .ico {background-position:-58px 0}
.sns-wrap-reg .sns-facebook {border-color:#2e5393;background:#3a5897}
.sns-wrap-reg .sns-facebook .ico {background-position:0 0 }

.sns-wrap-reg .sns-icon {border-color:#dcdcdc}
.sns-wrap-reg .sns-icon-not {border-color:#8b8b8b}
.sns-wrap-reg .sns-naver{border-color:#18a400}
.sns-wrap-reg .sns-naver .ico {background-position:-29px 0; }
.sns-wrap-reg .sns-google .ico {background-position:-58px 0}
.sns-wrap-reg .sns-google {border-color:#ca2c19}
.sns-wrap-reg .sns-facebook .ico {background-position:0 0 }
.sns-wrap-reg .sns-facebook {border-color:#2e5393}
.sns-wrap-reg .sns-kakao .ico {background-position:-87px 0}
.sns-wrap-reg .sns-twitter {border-color:#488FC9}
.sns-wrap-reg .sns-twitter .ico {background-position:-145px 0}
.sns-wrap-reg .sns-payco {border-color:#C44646}
.sns-wrap-reg .sns-payco .ico {background-position:-116px 0}
.sns-wrap-reg .sns-kakao {border-color:#f2df00}

/* SNS by COLOR */
.sns-wrap-over .sns-naver{background:url('../img/sns_naver_s.png') no-repeat}
.sns-wrap-over .sns-google {background:url('../img/sns_gp_s.png') no-repeat}
.sns-wrap-over .sns-facebook {background:url('../img/sns_fb_s.png') no-repeat}
.sns-wrap-over .sns-twitter {background:url('../img/sns_twitter_s.png') no-repeat}
.sns-wrap-over .sns-payco {background:url('../img/sns_payco_s.png') no-repeat}
.sns-wrap-over .sns-kakao {background:url('../img/sns_kakao_s.png') no-repeat}
.reg-form .sns-icon-not {border-color:#8b8b8b}

.social-login-loading{width:100%;height:auto;text-align:center}
.social-login-loading p{display:inline-block;margin-top:10px;padding:40px 0 0;line-height:30px}

/* �ƿ��α��� */
#sns_outlogin .sns-icon {overflow:hidden;margin:0 1px}
#sns_outlogin .sns-icon .txt {position:absolute;line-height:0;font-size:0;vertical-align:middle;overflow:hidden}
#sns_outlogin .sns-icon .ico {width:30px;height:30px}

/*�α��� */
#sns_login{border:0;}
#sns_login .sns-icon{display:block;height:40px;line-height:40px;width:100%;margin:0 0 5px;padding-left:40px;text-align:left;color:#fff;border-radius:2px}
#sns_login .sns-naver{background-color:#1fc800;background-position:5px 5px;border-bottom:1px solid #1ea505}
#sns_login .sns-kakao{background-color:#ffeb00;background-position:5px 5px;border-bottom:1px solid #e2c10a}
#sns_login .sns-kakao {color:#3c1e1e}
#sns_login .sns-facebook{background-color:#3b579d;background-position:5px 5px;border-bottom:1px solid #28458f}
#sns_login .sns-google{background-color:#db4a3a;background-position:5px 5px;border-bottom:1px solid #c03121}
#sns_login .sns-twitter{background-color:#1ea1f2;background-position:5px 5px;border-bottom:1px solid #1e82c0}
#sns_login .sns-payco{background-color:#df0b00;background-position:5px 5px;border-bottom:1px solid #9d0800}
#sns_login .txt{text-align:left;padding-left:10px;border-left:1px solid rgba(0,0,0,0.1);display:block;font-weight:bold}
#sns_login .txt:hover{background:rgba(0,0,0,0.07)}


  p.cart-p-total { margin-bottom: 0rem; }
/* 모바일 크기 일때 */
@media screen and (max-width:576px) {
  /* 스마트폰 가로 */
  .content { padding: 0.7rem 0.7rem;}
  .cartd-body-total { padding: 1rem 1rem;}

}


@media all and (min-width: 769px) and (max-width: 1024px) {
  .site-padding-set { padding-left:150px; background-color: #fff; }
}
@media all and (min-width: 1025px) {
  .site-padding-set { padding-left:200px; background-color: #fff; }
}

/* Pagination */
.pagination-mob-black {display:inline-block;padding-left:0;margin:20px 0;border-radius:4px}
.pagination-mob-black>li{display:inline }
.pagination-mob-black li.active a {color: #fff !important; background: #b2b2b2; }
.pagination-mob-black>li>a,.pagination-mob-black>li>span{position: relative; float: left; padding: 3px 7px; margin-left: -1px; line-height: 1.42857143; color: #000; font-size:11px; text-decoration: none; border:1px solid #b2b2b2; background-color: #fff;}
.pagination-mob-black>li:first-child>a,.pagination-mob-black>li:first-child>span{margin-left:0; /*border-top-left-radius:4px;border-bottom-left-radius:4px*/ }
.pagination-mob-black>li:last-child>a,.pagination-mob-black>li:last-child>span{/*border-top-right-radius:4px;border-bottom-right-radius:4px*/}
.pagination-mob-black>li>a:hover,.pagination-mob-black>li>span:hover,.pagination-mob-black>li>a:focus,.pagination-mob-black>li>span:focus{ /*color:#2a6496;background-color:#eee;border-color:#b2b2b2 */}
.pagination-mob-black>.active>a,.pagination-mob-black>.active>span,.pagination-mob-black>.active>a:hover,.pagination-mob-black>.active>span:hover,.pagination-mob-black>.active>a:focus,
.pagination-mob-black>.active>span:focus{ /*z-index:2;color:#fff;cursor:default;background-color:#428bca;border-color:#428bca */}
.pagination-mob-black>.disabled>span,.pagination-mob-black>.disabled>span:hover,.pagination-mob-black>.disabled>span:focus,.pagination-mob-black>.disabled>a,.pagination-mob-black>.disabled>a:hover,.pagination-mob-black>.disabled>a:focus{
	color: #ababab; cursor: not-allowed;}
.pagination-mob-black-lg>li>a,.pagination-mob-black-lg>li>span{padding:10px 16px;font-size:18px}
.pagination-mob-black-lg>li:first-child>a,.pagination-mob-black-lg>li:first-child>span{border-top-left-radius:6px;border-bottom-left-radius:6px}
.pagination-mob-black-lg>li:last-child>a,.pagination-mob-black-lg>li:last-child>span{border-top-right-radius:6px;border-bottom-right-radius:6px}
.pagination-mob-black-sm>li>a,.pagination-mob-black-sm>li>span{padding:5px 10px;font-size:12px}
.pagination-mob-black-sm>li:first-child>a,.pagination-mob-black-sm>li:first-child>span{border-top-left-radius:3px;border-bottom-left-radius:3px}
.pagination-mob-black-sm>li:last-child>a,.pagination-mob-black-sm>li:last-child>span{border-top-right-radius:3px;border-bottom-right-radius:3px}

/* 스토리 상단바 */
.navbar-collapse ul.pag-top li:first-child{list-style: disc;}
.navbar-collapse ul.pag-top li:first-child a{height: 100%; padding-left: 0px; padding-right: 0px;}
.navbar-collapse ul.pag-top li:first-child a:hover{color: #236ab3; background-color: #0000;}
.navbar-brand a.sid-sub-logo > .sub-logo{font-size: 12px; color: #000000; margin: 0px; line-height: 10px; padding-left: 10px; font-weight: bold;}
.navbar-brand a.sid-sub-logo > .sub-logo:hover{color: #000000; background-color: #0000;}
.navbar-brand a.sid-sub-logo{display: flex; align-items: flex-end;}
