
/*
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(//fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(//fonts.googleapis.com/earlyaccess/notosanssc.css);
*/
/*  한국어 */
:lang(ko) {
  /*font-family: 'Noto Sans KR', sans-serif; font-weight: normal;*/
}
/* 일본어 */
:lang(ja) {
  /*font-family: 'Noto Sans JP', sans-serif; font-weight: normal;*/
}
/* 중국어 (간체) */
:lang(zh-Hans) {
  /*font-family: 'Noto Sans SC', sans-serif; font-weight: normal;*/
}
/*
<div lang="ko"> ... 한국어 콘텐츠</div>
<div lang="ja"> ... 일본어 콘텐츠</div>
<div lang="zh-Hans"> ... 중국어 간체 콘텐츠</div>
*/

/* fix bootstrap */
a, button, input, label, select, textarea {
	-webkit-transition: none !important;
	transition: none !important;
}
a:focus, button:focus, input:focus, label:focus, select:focus, textarea:focus {
	outline: none !important;
	-webkit-box-shadow: none !important;
	box-shadow: none !important;
}
select {
	-moz-appearance: none;
	-webkit-appearance: none;
	-webkit-border-radius: 0px;
	line-height: 20px!important;
	background-image: url(./images/ddown.svg?3) !important;
	background-repeat: no-repeat !important;
	background-position: right center !important;
}select[multiple] {
	background-image: none!important;
}select::-ms-expand {
    display: none !important;
}a.btn:not([href]):not([tabindex]), a.btn:not([href]):not([tabindex]):focus, a.btn:not([href]):not([tabindex]):hover {
    color: initial;
}

.btn {
    padding: 0.6rem 1.5rem;
    font-size: 0.8rem;
}
.btn.btn-xs {
    padding: 0.3rem 0.8rem;
    font-size: 0.65rem;
}
.btn.btn-sm {
    padding: 0.4rem 1rem;
    font-size: 0.7rem;
}
.btn.btn-lg {
    padding: 0.8rem 1.8rem;
    font-size: 0.9rem;
}
.btn.btn-pop {
	border-bottom: 2px solid rgba(100,100,100,0.4);
	box-shadow: none !important;
}

/* Tablet and bigger */
.grid-divider {
    position: relative;
    padding: 0;
}
.grid-divider>.divider {
    position: static;
    margin: 10px;
}
.grid-divider>.divider:nth-child(n+2):before {
    content: "";
    border-top: 1px solid black;
    border-bottom: 1px solid #f5f5f5;
    border-top: 1px solid rgba(0,0,0,0.5);
    border-bottom: 1px solid rgba(255,255,255,0.5);
    position: absolute;
    left: 15px;
    right: 15px;
    opacity: 0.2;
}
@media ( min-width: 768px ) {
	.grid-divider>.divider {
	    margin: 0;
	}
    .grid-divider>.divider:nth-child(n+2):before {
        /*border-left: 1px solid black;*/
        border-left: 1px solid #999999;
        /*border-right: 1px solid #f5f5f5;*/
	    left: auto;
	    right: auto;
	    top: 0;
	    bottom: 0;
    }
    .col-padding {
        padding: 0 15px;
    }
}

/* fix mdboostrap */
.navbar {
	min-height: 60px;
	border-bottom: 1px solid rgba(22,22,22,0.2);
}.navbar .navbar-brand {
	display: flex;
    align-items: center;
	padding: 5px 0;
}.navbar .navbar-brand img {
	height: 100%;
}.navbar .dropdown-menu {
	border: 1px solid rgba(22,22,22,0.2);
}.navbar .mega-dropdown .dropdown-menu.mega-menu .container{
    border: 1px solid rgba(22,22,22,0.2);
    border-top: 0;
}.navbar .dropdown-menu a {
	padding: 0.4rem 1rem;
    font-size: 0.8rem;
    font-weight: initial;
    color: initial;
}.navbar .mega-dropdown .dropdown-menu.mega-menu {
	background: transparent !important;
	padding: 0 !important;
}
@media (max-width: 992px){
	.navbar.fixed-top {
		top: constant(safe-area-inset-top);
		top: env(safe-area-inset-top);
	    position: fixed;
	}
}
@media (max-width: 769px){ /* navbar-expand-md : min-width: 769px */
	.navbar {
		-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) !important;
	    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) !important;
		border: 0;
	}
	.navbar .dropdown-menu {
		position: relative !important;
	    width: auto !important;
	}.navbar .mega-dropdown .dropdown-menu.mega-menu {
	    border: 2px solid rgba(22,22,22,0.2);
		position: relative !important;
	}.navbar .mega-dropdown .dropdown-menu.mega-menu .container {
		border: 0;
	}
}
.jarallax {
    min-height: auto;
}

.notch-size {
	background: white;
	height: constant(safe-area-inset-top);
	height: env(safe-area-inset-top);
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9999;
}
main {
	margin-top: constant(safe-area-inset-top);
	margin-top: env(safe-area-inset-top);
}


* { font-family: 'Noto Sans KR', sans-serif; }
*:focus { outline: none; }
body {
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 12px;
	padding-top: 60px;
	background-color: #f0f0f0;
}
i.dollars,i.wons { font-style: normal; }
.dollars:before { content:'$'; }
.wons:before { content:'₩'; }
.price {
	font-size: 1.7rem;
}
ul.item {
	display: inline-table;;
	padding: 0;
	border-radius: 3px;
	color: white;
	font-size: 0.9rem;
    font-weight: 200;
	line-height: 14px;
	margin: 0;
}ul.item > li {
	display: table-cell;
	text-align: center;
	padding: 5px 7px  !important;
}ul.item > li:first-child {
	font-size: 100%;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
	background: rgba(0,0,0,0.3);
}
.small, small {
	font-size: 90%;
    font-weight: inherit!important;
}
@media (max-width: 767px) {

}

.ellipsis {
    white-space:nowrap;
    text-overflow:ellipsis;     /* IE, Safari */
    -o-text-overflow:ellipsis;      /* Opera under 10.7 */
    overflow:hidden;            /* "overflow" value must be different from "visible" */ 
    -moz-binding: url('ellipsis.xml#ellipsis');
}
.ellipsis-5 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    line-height: 1.2em;
    height: 9.6em;
    margin-bottom: 5px;
}


/* nform */
.nform.form-control {
	position: relative;
    border: 3px solid #e0e0e0!important;
	padding: 0px 10px!important;
	background-color: #f9f9f9!important;
    display: block!important;
	line-height: 40px;
	height: 50px!important;
	-webkit-box-sizing: border-box!important;
    -moz-box-sizing: border-box!important;
    box-sizing: border-box!important;
    margin-bottom: 0.6rem!important;
    color: #777;
    border-radius: 0px;
	-moz-appearance: none;
	-webkit-appearance: none;
	-webkit-border-radius: 0px;
	font-weight: 400;
}.nform.form-control.entered {
    border: 3px solid #75a5f1!important;
	background-color: #f0f0f0!important;
	color: black;
}.nform.form-control.focus {
    border: 3px solid #98bcf3!important;
	background-color: #ffffff!important;
    box-shadow: none!important;
}

label.nform.form-control {
    line-height: 44px;
    font-weight: 300;
    margin-top: 0px;
    display: block;
    cursor: pointer;
}@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	label.nform.form-control { line-height: 40px; }
	.nform.form-control input[type=radio], .nform.form-control input[type=checkbox] { vertical-align: middle; }
}label.nform.form-control:first-child {
    margin-top: .2rem;
}input[type=file].nform.form-control {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	opacity: 0;
	cursor: pointer;
	border: 0 !important;
}label[type=file] {
	background-color:#e0e0e0;
	margin: 2px;
	width: 46px;
	height: 46px;
	padding: 0 !important;
	line-height: 46px !important;
	cursor: pointer;
	position: relative;
}label[type=file] > img {
	position: absolute;
    top: 0px;
    left: 0px;
	width: 46px;
	height: 46px;
}.nform.form-control input[type=radio],
 .nform.form-control input[type=checkbox] {
    position: relative;
	left: 0; 
	visibility: visible; 
    font-size: 1rem;
    width: 1rem;
    height: 1rem;
    opacity: 1;
}select.nform.form-control option {
	background-color: #f9f9f9!important;
}select.nform{
	-moz-appearance: none;
	-webkit-appearance: none;
	-webkit-border-radius: 0px;
	background-image: url(../images/ddown.svg?3) !important;
	background-repeat: no-repeat !important;
	background-position: right center !important;
	line-height: 20px!important;
}select.nform::-ms-expand {
    display: none !important;
}
.nform ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #999;
    opacity: 1; /* Firefox */
}.nform :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #999;
}.nform ::-ms-input-placeholder { /* Microsoft Edge */
    color: #999;
}
.nform [type='number'] {
  -moz-appearance: textfield !important;
}
.nform ::-webkit-outer-spin-button,
.nform ::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0;
}

/* IE10+ */
.nform ::-ms-clear {
	display: none !important;
}

/* Chrome */
.nform ::-webkit-search-decoration,
.nform ::-webkit-search-cancel-button,
.nform ::-webkit-search-results-button,
.nform ::-webkit-search-results-decoration { 
	display: none !important; 
}


/* INPUT TITLE */
.input-title { 
    position: relative;
}.input-title label { 
    line-height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    padding-left: 15px;
    font-weight: 400;
    color: #777;
    cursor: text;
    pointer-events: none;
}.input-title input.nform { 
	text-align: right;
}.input-title select.nform, .input-title select.nform option { 
	direction: rtl;
	padding-right: 25px !important;
}.input-title select.nform option { 
	direction: ltr;
}.input-title select.nform.nonearrow{
	background-image: none !important;
	padding-right: 15px !important;
}

@media (max-width: 769px){
	.input-title label, .input-title select.nform, .input-title select.nform option { 
		letter-spacing: -1px;
	}
}

/* aspect rato box */
.naspectbox {
	position: relative;
	background-position: 50% 50%;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
	height: 0;
	display: block;
}.naspectbox > img{
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
}.naspectbox > .content{
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    overflow: hidden;
}
.naspectbox-rato-24by9, .naspectbox-rato-8by3 {
	padding-top: 37.5%;
}
.naspectbox-rato-21by9, .naspectbox-rato-7by3 {
	padding-top: 42.857143%;
}
.naspectbox-rato-16by9 {
	padding-top: 56.25%;
}
.naspectbox-rato-10by6 {
	padding-top: 60%;
}
.naspectbox-rato-14by9 {
	padding-top: 64%;
}
.naspectbox-rato-18by27 {
	padding-top: 66%;
}
.naspectbox-rato-4by3 {
	padding-top: 75%;
}
.naspectbox-rato-1by1 {
  padding-top: 100%;
}
.naspectbox-portrait {
	position: relative;
	background-position: 50% 50%;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
	height: 0;
	display: block;
}.naspectbox-portrait > img{
	position: absolute;
	left: 50%;
	transform: translate(-50%, -100%);
	-webkit-transform: translate(-50%, -100%);
	-moz-transform: translate(-50%, -100%);
	-ms-transform: translate(-50%, -100%);
    height: 100%;
    width: auto;
    max-width: none;
}.naspectbox-portrait > .content{
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    overflow: hidden;
}
.naspectbox-portrait.naspectbox-rato-24by9, .naspectbox-portrait.naspectbox-rato-8by3 {
	padding-top: 266%;
}
.naspectbox-portrait.naspectbox-rato-21by9, .naspectbox-portrait.naspectbox-rato-7by3 {
	padding-top: 233%;
}
.naspectbox-portrait.naspectbox-rato-16by9 {
	padding-top: 177%;
}
.naspectbox-portrait.naspectbox-rato-10by6 {
	padding-top: 166%;
}
.naspectbox-portrait.naspectbox-rato-14by9 {
	padding-top: 155%;
}
.naspectbox-portrait.naspectbox-rato-18by27 {
	padding-top: 150%;
}
.naspectbox-portrait.naspectbox-rato-4by3 {
	padding-top: 130%;
}

.swiper-rounded {
	position: relative !important;
	z-index: 1 !important;
	overflow: hidden !important;
	border-radius: 0.25rem !important;
}

/* oAUTH */
.authhelp {
	padding-top: 0.5rem;
	font-size: 12px;
	width: 100%;
}.authhelp button {
	border:0;
	padding:0;
	margin:0;
	cursor:pointer;
	background: transparent;
	background-color: transparent;
}
button.oauth {
	border:0;
	padding:0;
	margin:0;
	display:inline-block;
	position: relative;
	width:33.333%;
	height:40px;
	text-align: left;
	overflow: hidden;
	border-radius: 3px;
	cursor:pointer;
	color: white;
	font-size: 11px;
}button.oauth > div.oauth_icon {
	position: absolute;
	z-index: 2;
    width: 100%;
    height: 100%;
	top: 0;
    left: 0;
}button.oauth > div.oauth_icon > img {
	width: 40px;
	height: 40px;
}button.oauth > div.oauth_text {
	width: 100%;
    height: 100%;
	padding-left: 40px;
	line-height: 40px;
	text-align:center;
}button.oauth_kakao {
	background-color: #f3e02d;	
}button.oauth_naver {
	background-color: #04dc30;	
}button.oauth_facebook {
	background-color: #4a67ab;	
}