@charset "utf-8";

html,body{margin:0px;padding:0px;height:100%; width:100%;font-size:12px;font-family: Noto Sans KR, Arial, sans-serif;-webkit-text-size-adjust:none;-webkit-font-smoothing:antialiased;letter-spacing:-1.5px; color: #181818; }
ul,ol,li,dl,dd,dt,input,h1,h2,h3,h4,h5,h6,p,b,input,button,textarea,fieldset,legend,td,th{margin:0px;padding:0px;word-break:keep-all}
li{list-style:none}
img,a{border:0px}
a{text-decoration:none; color:#181818;}
.blind{position:absolute;top:0;left:-10000px;width:0;height:0;overflow:hidden;font-size:0;line-height:0}
caption{display:none}
button,label{cursor:pointer}
button{overflow:visible\9}	/* button fix for ie8 */
input,textarea,button,select,option{font-family: Noto Sans KR, Arial, sans-serif;}
table{width:100%;border-collapse:collapse;border-spacing:0;text-align:left; table-layout:fixed}
table th, table td{text-align:left; word-break:break-word;word-wrap:break-word;}
input::-webkit-input-placeholder{color:#929292}
input::-moz-placeholder{color:#929292}
input:-moz-placeholder{color:#929292}
input:-ms-input-placeholder{color:#929292}
textarea::-webkit-input-placeholder{color:#929292}
textarea::-moz-placeholder{color:#929292}
textarea:-moz-placeholder{color:#929292}
textarea:-ms-input-placeholder{color:#929292}
input:focus::-webkit-input-placeholder{color:transparent!important}
input:focus::-moz-placeholder{color:transparent!important}
input:focus:-moz-placeholder{color:transparent!important}
input:focus:-ms-input-placeholder{color:transparent!important}
textarea:focus::-webkit-input-placeholder{color:transparent!important}
textarea:focus::-moz-placeholder{color:transparent!important}
textarea:focus:-moz-placeholder{color:transparent!important}
textarea:focus:-ms-input-placeholder{color:transparent!important}
header, footer, section, article, aside, nav, address { display: block; margin:0; } /* ie8 */
figure { margin: 0; padding: 0; }
input:focus {outline:none;}
canvas { letter-spacing: 0px; }
.input {width: 100%; border: solid 1px #a7a7a7; border-radius: 2.6vw; font-size: 1.333rem; padding: 3.2vw 0; text-indent: 2.6vw;}

buttona:focus,
a:focus,
input:focus,
div:focus{outline: none;-webkit-tap-highlight-color:transparent;}

iframe[name='hiddenFrame'] { position: absolute; left:-1000px; top:-1000px; }

input[type='date'] { -webkit-appearance: none; }
input[type='date']::-webkit-inner-spin-button,
input[type='date']::-webkit-calendar-picker-indicator { display: none; -webkit-appearance: none; }
input[type='month'] { -webkit-appearance: none; }
input[type='month']::-webkit-inner-spin-button,
input[type='month']::-webkit-calendar-picker-indicator { display: none; -webkit-appearance: none; }

.mt0 { margin-top:0 !important; }
.mb0 { margin-bottom:0 !important; }
.mr0 { margin-right:0 !important; }
.ml0 { margin-left:0 !important; }
.m0 { margin:0 !important; }
.mt5 { margin-top:1.3vw !important; }
.mb5 { margin-bottom:1.3vw !important; }
.mr5 { margin-right:1.3vw !important; }
.ml5 { margin-left:1.3vw !important; }
.m5 { margin:1.3vw !important; }
.mr10 { margin-right:2.6vw !important; }
.ml10 { margin-left:2.6vw !important; }
.mt10 { margin-top:2.6vw !important; }
.mb10 { margin-bottom:2.6vw !important; }
.m10 { margin:2.6vw !important; }
.mr20 { margin-right:5.2vw !important; }
.ml20 { margin-left:5.2vw !important; }
.mt20 { margin-top:5.2vw !important; }
.mb20 { margin-bottom:5.2vw !important; }
.m20 {margin: 5.2vw !important;}
.mr30 { margin-right:7.8vw !important; }
.ml30 { margin-left:7.8vw !important; }
.mt30 { margin-top:7.8vw !important; }
.mb30 { margin-bottom:7.8vw !important; }
.m30 {margin: 7.8vw !important;}

.pt0 { padding-top:0 !important; }
.pb0 { padding-bottom:0 !important; }
.pl0 { padding-left:0 !important; }
.pr0 { padding-right:0 !important; }
.pd0 { padding: 0 !important;}
.pd5 { padding:1.3vw !important; }
.pt5 { padding-top:1.3vw !important; }
.pb5 { padding-bottom:1.3vw !important; }
.pl5 { padding-left:1.3vw !important; }
.pr5 { padding-right:1.3vw !important; }
.pd5 { padding:1.3vw !important; }
.pt10 { padding-top:2.6vw !important; }
.pb10 { padding-bottom:2.6vw !important; }
.pl10 { padding-left:2.6vw !important; }
.pr10 { padding-right:2.6vw !important; }
.pd10 { padding:2.6vw !important; }
.pt20 { padding-top:5.2vw !important; }
.pb20 { padding-bottom:5.2vw !important; }
.pl20 { padding-left:5.2vw !important; }
.pr20 { padding-right:5.2vw !important; }
.pd20 { padding:5.2vw !important; }
.pt30 { padding-top:7.8vw !important; }
.pb30 { padding-bottom:7.8vw !important; }
.pl30 { padding-left:7.8vw !important; }
.pr30 { padding-right:7.8vw !important; }
.pd30 { padding:7.8vw !important; }
.pt40 { padding-top:10.4vw !important; }
.pb40 { padding-bottom:10.4vw !important; }
.pb50 { padding-bottom:13vw !important; }
.pl40 { padding-left:10.4vw !important; }
.pr40 { padding-right:10.4vw !important; }
.pd40 { padding:10.4vw !important; }
.pv10 { padding-top:2.6vw !important; padding-bottom:2.6vw !important; }
.ph10 { padding-left:2.6vw !important; padding-right:2.6vw !important; }
.pv20 { padding-top:5.2vw !important; padding-bottom:5.2vw !important; }
.ph20 { padding-left:5.2vw !important; padding-right:5.2vw !important; }
.pv30 { padding-top:7.8vw !important; padding-bottom:7.8vw !important; }
.ph30 { padding-left:7.8vw !important; padding-right:7.8vw !important; }
.pv40 { padding-top:10.4vw !important; padding-bottom:10.4vw !important; }
.ph40 { padding-left:10.4vw !important; padding-right:10.4vw !important; }

.phx20 { padding-left:20px !important; padding-right:20px !important; }

.w10 { width: 10% !important; }
.w20 { width: 20% !important; }
.w30 { width: 30% !important; }
.w40 { width: 40% !important; }
.w50 { width: 50% !important; }
.w60 { width: 60% !important; }
.w70 { width: 70% !important; }
.w80 { width: 80% !important; }
.w90 { width: 90% !important; }
.w100 { width: 100% !important; }
.w33 { width: 33.3% !important; }

.vh20 { padding-top: 20vh !important; }
.vh30 { padding-top: 30vh !important; }
.vh40 { padding-top: 40vh !important; }
.vh50 { padding-top: 50vh !important; }

.font-white {color: #fff !important;}
.font-red {color: #ff0000 !important;}
.font-red2 {color: #f1424c !important;}
.font-black {color: #222 !important;}
.font-orange {color: #ff7f28 !important;}
.font-gray {color: #777 !important;}
.font-blue {color: #028dfe !important;}
.font-yellow {color: #ffc11e !important;}
.font12 {font-size: 1rem !important;}
.font13 {font-size: 1.083rem !important;}
.font14 {font-size: 1.167rem !important;}
.font15 {font-size: 1.250rem !important;}
.font16 {font-size: 1.333rem !important;}
.font18 {font-size: 1.500rem !important;}
.font20 {font-size: 1.667rem !important;}
.font22 {font-size: 1.833rem !important;}
.font25 {font-size: 2.083rem !important;}
.font30 {font-size: 2.500rem !important;}
.font-bold {font-weight: bold !important;}
.flex {display: flex; justify-content: space-between; align-content: space-between;}
.flex1 {flex: 1;}
.gap5{gap: 5px;}
.gap10{gap: 10px;}
.gap15{gap: 15px;}
.gap20{gap: 20px;}
.gap25{gap: 25px;}
.gap30{gap: 30px;}
.inline {display: inline-block;}

.txt-bold { font-weight: bold !important; }
.txt-center { text-align: center !important; }
.txt-left { text-align: left !important; }
.txt-right { text-align: right !important; }
.display-flex { display: flex !important; }
.noti-txt { color: #7b7b7b; text-align: center; }
.bottom-fixed { position: fixed; width: 100%; bottom: 0; }
.h100 { height: 100%; }
.border-none { border: 0 !important; }

.bg-red {background-color: #f1424c; color: #fff;}
.bg-blue {background-color: #090e2c; color: #fff;}
.bg-gray {background-color: #ebebeb; color: #000;}
.bg-white {background-color: #fff; color: #000;}

.red { color: #f1424c !important; }
.blue { color: #0039fc !important; }

.iframe-modal { position:fixed; top:100%; left:0; border:0; width: 100%; height: 100%; z-index: 999; transition: all 0.5s cubic-bezier(0.86, 0, 0.07, 1); -webkit-transition:  all 0.5s cubic-bezier(0.86, 0, 0.07, 1); }
.iframe-modal.open { top: 0px; }
body.modal-open { overflow: hidden !important; height: 100%; }

.btn-wrap { display: flex; justify-content: center; align-content: center; }
.btn { width: 100%; padding: 4vw 0; text-align: center; font-size: 1.333rem; font-weight: bold; display: inline-block;}
.btn.search{ width: 100%; padding: 2vw 0; margin-top:2vw; text-align: center; font-size: 1.333rem; font-weight: bold; }
.btn.round { border-radius: 2.6vw; }
.btn.round50 { border-radius: 8vw; }
.btn.red { background: #f1424c; color: #fff !important; }
.btn.navy { background: #080d2c; color: #fff !important; }
.btn.gray { background: #ededed; }
.btn.black { background: #000; color: #000; }
.btn.white { background: #fff; border: solid 1px #a7a7a7; }
.btn.gray-gradient { border-radius: 3.9vw; background-image: linear-gradient(to bottom, #fafafa, #ebebeb); }

/* checkbox */
.checkbox {width:100%;position:relative;background:none}
.checkbox .input {position:absolute;top:0;bottom:0;left:0;right:0;opacity:0;border:0;padding:0;width:100%;height:100%;z-index:1}
.checkbox .cover {position:relative;z-index:0}
.checkbox .cover > * {display:inline-block;vertical-align:middle}
.checkbox .cover .ic {width:6.2vw;height:6.2vw;margin-right:2.6vw;background-color:#fff; border-radius: 100%; border: solid 1px #979797; box-sizing: border-box; }
.checkbox .cover .txt {font-size:1.333rem;}
.checkbox.active .cover .ic { background:#ff7f28 url("/static/img/btn-checked@2x.png") center center no-repeat;background-size:100% auto; border: 0; }

/* checkbox switch */
.checkbox.switch .cover .icon { width: 19.5vw; height: 10.5vw; background: url("/static/img/toggle-off@2x.png") center center no-repeat; background-size:100% auto; }
.checkbox.switch.active .cover .icon { background: url("/static/img/toggle-on@2x.png") center center no-repeat; background-size:100% auto; }

/* radiobox */
.radiobox { display:flex; justify-content: flex-start; align-content: center; }
.radiobox .radio {position:relative; background:none;}
.radiobox .radio + .radio {margin-left:5.2vw}
.radiobox .radio .input {position:absolute;top:0;bottom:0;left:0;right:0;opacity:0;border:0;padding:0;width:100%;height:100%;z-index:1}
.radiobox .radio .cover { display:table; }
.radiobox .radio .cover > * {display:inline-block;vertical-align:middle}
.radiobox .radio .cover .ic {width:6.2vw;height:6.2vw;margin-right:2.6vw;background-color:#fff; border-radius: 100%; border: solid 1px #979797; box-sizing: border-box; }
.radiobox .radio .cover .txt {font-size:1.333rem;}
.radiobox .radio.active .cover .ic {background:url("/static/img/btn-radio-on@2x.png") center center no-repeat;background-size:100% auto; border: 0; }
.radiobox.flex-wrap { flex-wrap: wrap; }
.radiobox.flex-wrap .radio { width: 50%; }
.radiobox.flex-wrap .radio + .radio { margin-left:0; margin-bottom: 5.2vw; }

/* selectbox */
.selectbox { position: relative; }
.selectbox select { width: 100%; height: 13.4vw; border: solid 1px #a7a7a7; border-radius: 2.6vw; font-size: 1.333rem; text-indent: 3.2vw; -webkit-appearance: none; -moz-appearance: none; appearance: none; color: rgba(0, 0, 0, 1); background: #fff; }
.selectbox input[type=date] { width: 100%; height: 13.4vw; border: solid 1px #a7a7a7; border-radius: 2.6vw; font-size: 1.333rem; text-indent: 3.2vw; -webkit-appearance: none; -moz-appearance: none; appearance: none; color: rgba(0, 0, 0, 1); background: #fff; }
.selectbox::before { content: ''; position: absolute; right: 2vw; top: 3vw; width: 7vw; height: 7vw; background: url('/static/img/btn-selectbox-open@2x.png') no-repeat; background-size: 100%; }

.scroll-none { width: 100%; height: 100%; overflow: hidden; }
.pupup-wrap { display: none; }
.pupup-wrap .msg-popup { position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 99998; background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; }
.pupup-wrap .msg-popup .msg-box { position: relative; background: #fff; border-radius: 4vw; padding: 5vw; margin: 0 5vw; width: 100%; }
.pupup-wrap .msg-popup .msg-box .msg { font-size: 1.500rem; font-weight: bold; text-align: center; margin-bottom: 5vw; }
.pupup-wrap .msg-popup .msg-box .msg em { font-size: 1.833rem; font-style: normal; }
.pupup-wrap .msg-popup .msg-box .title { position: absolute; left: 2.6vw; top: 2.6vw; font-size: 1.250rem; font-weight: bold; }
.pupup-wrap .msg-popup .msg-box .btn-close { position: absolute; right: 2.6vw; top: 2.6vw; }
.pupup-wrap .msg-popup .msg-box .btn-close img { width: 7vw; }
.pupup-wrap .msg-popup .msg-box .btn-close + .msg { margin-bottom: 0; margin-top: 5vw; }

@keyframes blink-effect{
   0%{
     opacity: 0;
   }
   50%{
     opacity: 0.7;
   }
   100%{
     opacity: 0;
   }
 }

.loader-wrap {background-color: rgba(0,0,0,0.7);position: absolute;left: 0;top:0;width: 100%;height: 1000%;z-index: 99998; text-align: center;}
.loader-wrap.page {background-color: rgba(9, 14, 44, 1);}
.loader-wrap > div {position: absolute; z-index: 99999;top: 200px;width: 270px; text-align: center;margin-left: calc(50% - 135px);}
.loader-wrap > div > div {text-align: center;position: relative;}
.loader-wrap > div > div > .loader-text{background-color: rgba(0,0,0,0.7);color: white; text-align: center;padding: 10px;border-radius: 10px; margin-top: 30px;line-height: 25px; font-size: 1.25rem;}
.loader-wrap.page > div > div > .loader-text{background-color: rgba(255, 255, 255, 1);color: #000;}

.blink {
  animation: blink-effect 1.2s step-start infinite;
  /*
  animation-name: blink-effect;
  animation-duration: 1s;
  animation-iteration-count:infinite;
  animation-timing-function:step-end;
  */
}

.lds-roller {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-roller div {
  animation: lds-roller 1.78s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px;
}
.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #f1424c;
  margin: -4px 0 0 -4px;
}
.lds-roller div:nth-child(1) {
  animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
  top: 63px;
  left: 63px;
}
.lds-roller div:nth-child(2) {
  animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
  top: 68px;
  left: 56px;
}
.lds-roller div:nth-child(3) {
  animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
  top: 71px;
  left: 48px;
}
.lds-roller div:nth-child(4) {
  animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
  top: 72px;
  left: 40px;
}
.lds-roller div:nth-child(5) {
  animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
  top: 71px;
  left: 32px;
}
.lds-roller div:nth-child(6) {
  animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
  top: 68px;
  left: 24px;
}
.lds-roller div:nth-child(7) {
  animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
  top: 63px;
  left: 17px;
}
.lds-roller div:nth-child(8) {
  animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
  top: 56px;
  left: 12px;
}
@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.hand {cursor: pointer;}
