@import url('https://fonts.googleapis.com/css?family=Nanum+Myeongjo:400,700,800|Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean');

* { margin: 0; border: none; padding: 0; box-sizing: border-box; }

:root { width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; }
body { width: 100%; min-height: 100%; }

a { text-decoration: none; color: inherit; }
button:not(:disabled) { cursor: pointer; }
a, button, input, textarea, select { font-size: inherit; font-family: inherit; font-weight: inherit; outline: none; background-color: rgba(0,0,0,0); }
li { list-style-type: none; }


.container { display: block; width: 100%; font-size: 0; }
.noto-kr { font-family: 'Noto Sans KR', Roboto, sans-serif; }
.nanum-mj { font-family: 'Nanum Myeongjo', sans-serif; }

.flex { display: -webkit-box; display: -ms-flexbox; display: flex; }
.flex-row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }
.flex-column { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
.flex-row-reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
.flex-column-reverse { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }
.justify-start { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
.justify-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.justify-end { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }
.align-start { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
.align-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.align-ends { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
.flex-no-shrink { -ms-flex-negative: 0; flex-shrink: 0; }
.flex-no-grow { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }

.symbol-container { position: relative; }
.symbol-container .symbol-inversed, .symbol-container .symbol-normal { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; transition: opacity 600ms; max-width: 100%; max-height: 100%; }
.symbol-container.symbol-container-normal .symbol-inversed,
.symbol-container.symbol-container-inversed .symbol-normal { opacity: 0; }
.symbol-container.symbol-container-normal .symbol-normal,
.symbol-container.symbol-container-inversed .symbol-inversed { z-index: 1; }

.form-item-container { position: relative; width: 100%; border-bottom: solid 1px #ddd; }
.form-item-container.no-border { border-bottom: none; }
.form-item-container .form-item-wrapper { width: 100%; border-bottom: solid 1px #ddd; position: relative; }
.form-item-container .form-item-label { display: block; font-size: 10px; font-weight: 500; letter-spacing: .15px; color: #545a5d; }
.form-item-container .form-item { width: 100%; min-height: 32px; margin-top: 2px; font-size: 15px; font-weight: 300; letter-spacing: .4px; color: #151515; }
.form-item-container textarea.form-item { width: 100%; min-height: 200px; border: solid 1px #ddd; padding: 4px 7px; font-size: 15px; font-weight: 300; line-height: 1.6; letter-spacing: .4px; resize: none; margin-top: 2px; }
.form-item-container .form-item::placeholder { color: #ddd; }
.form-item-container .form-item:disabled { pointer-events: none; touch-action: none; background-color: #eee; color: #545a5d; padding: 0 12px; }

@keyframes expand {
    from { width: 0%; }
    to { width: 100%; }
}

.form-item-container .form-border { width: 100%; height: 1px; position: absolute; top: 100%; left: 0; background-color: #151515; opacity: 0.2; transition: opacity 300ms ease; }
.form-item-container .form-item:focus + .form-border { width: 100%; opacity: 1; animation: expand 600ms ease 1; }
.form-item-container .form-icon-button { position: absolute; right: 5px; bottom: 5px; width: 21px; height: 21px; }
.form-item-container .form-item-button { width: 240px; height: 32px; border: solid 1px #9aa2a5; color: #545a5d; font-size: 13px; margin-top: 8px; max-width: 100%; }
.form-action-button { width: 48px; height: 27px; border-radius: 13.5px; background-color: #aaa; font-size: 12px; font-weight: 500; letter-spacing: .4px; color: #fff; margin-left: 6px; margin-bottom: 1px; }
.form-item-container .form-item-warning { color: #e66b6b; margin-left: 6px; }
.form-item-container .form-item-warning.safe { color: #329cff; }

.form-checkbox-container { font-size: 0; }
.form-checkbox-container .form-checkbox { display: none; }
.form-checkbox-container .form-checkbox + .form-checkbox-label { display: inline-block; font-size: 13px; font-weight: 300; letter-spacing: .35px; color: #151515; vertical-align: middle; cursor: pointer; }
.form-checkbox-container .form-checkbox + .form-checkbox-label::before { content: ''; display: inline-block; vertical-align: middle; width: 20px; height: 20px; background-image: url(/data/skin/front/luxe/assets/images/symbols/checkbox-unchecked.png); background-size: contain; background-position: center center; background-repeat: no-repeat; margin-right: 8px; }
.form-checkbox-container .form-checkbox:checked + .form-checkbox-label::before { background-image: url(/data/skin/front/luxe/assets/images/symbols/checkbox-checked.png); }
.form-checkbox-container .form-checkbox:disabled + .form-checkbox-label { pointer-events: none; touch-action: none; }

.form-radio-container { width: 100%; }
.form-radio-container .form-radio-title { display: block; font-size: 10px; font-weight: 500; letter-spacing: .15px; color: #545a5d; }
.form-radio-container .form-radio-wrapper { width: 100%; font-size: 0; margin-top: 8px; }
.form-radio-container .form-radio-item { display: inline-block; }
.form-radio-container .form-radio { display: none; }
.form-radio-container .form-radio-label { font-size: 15px; font-weight: 300; letter-spacing: .4px; color: #151515; cursor: pointer; }
.form-radio-container .form-radio-label span.form-radio-replacer { width: 20px; height: 20px; border-radius: 50%; background-color: #ddd; position: relative; margin-right: 8px; display: inline-block; vertical-align: middle; }
.form-radio-container .form-radio:checked + .form-radio-label span.form-radio-replacer::after { content: ''; display: block; width: 12px; height: 12px; border-radius: 50%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; background-color: #545a5d; }

.form-note-container { width: 100%; padding: 8px; background-color: #fafafa; }
.form-note-container .form-note { width: 100%; font-size: 12px; line-height: 2; letter-spacing: .4px; color: #aaa; }

.form-submit { width: 240px; height: 50px; max-width: 100%; background-color: #545a5d; font-size: 15px; color: #fff; }
.form-submit:disabled { pointer-events: none; touch-action: none; background-color: #eee; color: #ccc; }

.share-button { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background-color: #545a5d; position: relative; }
.share-button img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 24px; height: 24px; }