@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);

@font-face {
  font-family: 'Noto Sans KR';
  font-weight: 400;
  src: url('/fonts/notosanskr-regular.woff2') format('woff2'),
		url('/fonts/notosanskr-regular.woff') format('woff')
}

@font-face {
  font-family: 'Noto Sans KR';
  font-weight: 500;
  src: url('/fonts/notosanskr-medium.woff2') format('woff2'),
		url('/fonts/notosanskr-medium.woff') format('woff')
}

@font-face {
  font-family: 'Noto Sans KR';
  font-weight: 700;
  src: url('/fonts/notosanskr-bold.woff2') format('woff2'),
		url('/fonts/notosanskr-bold.woff') format('woff')
}

* { margin: 0; padding: 0; box-sizing: border-box; position: relative; }
html, body { width: 100%; height: 100%; float: left; background-color: #FFF; font-family: "Noto Sans KR", sans-serif; }
body{ -ms-user-select: none; -moz-user-select: -moz-none; -webkit-user-select: none; -khtml-user-select: none; user-select:none; }

img { vertical-align: bottom; }
textarea { font-family: "Noto Sans KR", sans-serif; }
input, select { border: 0; -webkit-border-radius: 0; font-family: "Noto Sans KR", sans-serif; }
input:focus, select:focus, button:focus, textarea:focus { outline: none; }
input[type="file"] { display: none; }
button { border: 0; background-color: none; cursor: pointer; font-family: "Noto Sans KR", sans-serif; }
a { color: initial; text-decoration: none; }
ul, li { list-style: none; }
table { border-spacing: 0; table-layout: fixed; }
option { font-weight: 300; }
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#loadingWrap { width: 100%; height: 100%; left: 0; top: 0; z-index: 9999; background-color: rgba(0, 0, 0, 0.15); position: fixed; display: none; }
#loadingWrap > svg { position: absolute; top: 50%; left: 50%; margin-top: -25px; margin-left: -25px; }

#pageWrap { width: 100%; float: left; }

.section { width: 100%; float: left; overflow: hidden; }
.section > div { width: 100%; margin: 0 auto; }
.section > div > form { width: 100%; float: left; }
.section img { vertical-align: bottom; }

.section .bgImgWrap { position: absolute; width: 2000px; margin-left: -1000px; left: 50%; text-align: center; }
.section .bgImgWrap > img { width: 100%; }

.section .conImgWrap { width: 100%; float: left; text-align: center; z-index: 1; }

.section .conVidWrap { text-align: center; z-index: 1; margin: 0 auto; }
.section .conVidWrap iframe { border: 0; vertical-align: bottom; }

.section .conTimerWrap { width: 100%; float: left; z-index: 1; background-color: #000; }
.section .conTimerWrap > ul { width: 100%; margin: 0 auto; text-align: center; padding: 30px; }
.section .conTimerWrap > ul > li { display: inline-block; font-size: 21px; color: #FFF; font-weight: bold; }
.section .conTimerWrap > ul > li.point { color: #FFFF33; }

.section .conListWrap { width: 1200px; margin: 0 auto; z-index: 1; background-color: #000; }
.section .conListWrap > div { width: 100%; float: left; text-align: center; padding: 30px; }
.section .conListWrap > div > .titWrap { width: 100%; float: left; color: #FFF; font-size: 21px; font-weight: bold; margin-bottom: 30px; }
.section .conListWrap > div > .titWrap > .point { color: #FFFF33; }
.section .conListWrap > div > .itemListWrap { width: 100%; float: left; }
.section .conListWrap > div > .itemListWrap > div { width: 100%; float: left; }
.section .conListWrap > div > .itemListWrap > div > ul { width: 100%; float: left; }
.section .conListWrap > div > .itemListWrap > div > ul > li { width: 25%; height: 40px; line-height: 40px; float: left; font-size: 14px; text-align: center; margin-bottom: 1px; }

.section .conListWrap > div > .itemListWrap > .header > ul > li { background-color: #EEE; color: #333; font-weight: bold; }
.section .conListWrap > div > .itemListWrap > .itemList { height: 204px; overflow: hidden; }
.section .conListWrap > div > .itemListWrap > .itemList > ul > li { background-color: #FFF; color: #333; }

.section .conMapWrap { width: 100%; float: left; text-align: center; z-index: 1; }
.section .conMapWrap > div { margin: 0 auto; }
.section .conMapWrap > div > * { width: 100%; float: left; height: 100%; border: 0; }

.section .conTxtWrap { width: 100%; float: left; z-index: 1; }
.section .conTxtWrap > div { margin: 0 auto; }

.formWrap .conWrap { margin: 0 auto; z-index: 1; }
.formWrap .conWrap > ul { width: 100%; float: left; }
.formWrap .conWrap > ul > li { width: 100%; float: left; display: table; }

.formWrap .conWrap > ul > li > div { display: table-cell; vertical-align: middle; text-align: left; }
.formWrap .conWrap > ul > li > .label { width: 25%; font-weight: 500; }
.formWrap .conWrap > ul > li > .label > .importantIcon { font-size: 16px; color: #DC3333; position: absolute; }
.formWrap .conWrap > ul > li > .value { width: 75%; }

.formWrap .conWrap > ul > .tit { text-align: center; margin-bottom: 30px; }

.formWrap .conWrap > ul > .privacy .privacyConBox { width: 100%; float: left; border: 1px solid #EEE; font-size: 13px; color: #666; height: 150px; padding: 5px 10px; overflow-y: auto; font-weight: 300; background-color: #FFF; }
.formWrap .conWrap > ul > .privacy .privacyCheckBox { width: 100%; float: left; padding: 3px 5px; }
.formWrap .conWrap > ul > .privacy .privacyCheckBox > input { vertical-align: middle; }
.formWrap .conWrap > ul > .privacy .privacyCheckBox > label { cursor: pointer; font-size: 14px; font-weight: 500; }

.formWrap .conWrap > ul > .btn { text-align: center; margin-top: 80px; }

.formWrap .conWrap > ul > .basic { margin-bottom: 10px; }

.formWrap .conWrap input.formTxtBox { width: 100%; float: left; border: 1px solid #EEE; font-size: 16px; font-weight: 300; color: #333; height: 43px; padding: 0 10px; }
.formWrap .conWrap select.formTxtBox { width: 100%; float: left; border: 1px solid #EEE; font-size: 16px; font-weight: 300; color: #333; height: 43px; padding: 0 5px; }
.formWrap .conWrap textarea.formTxtBox { width: 100%; float: left; border: 1px solid #EEE; font-size: 16px; font-weight: 300; color: #333; height: 150px; padding: 5px 10px; resize: none; }


.common_popup { width:100%; height:100%; position:fixed; left:0; top:0; z-index:10; display:none; }
.common_popup > div { position:fixed; left:0; top:0; }
.common_popup > .cont { background-color:white; z-index:2; left:50%; top:50%; transform: translate(-50%, -50%); }

.common_popup > .cont .pop_tit { width:100%; float:left; border-bottom: 1px solid #ccc; }
.common_popup > .cont .pop_close_btn { display:inline-block; position:absolute; top:13px; right:23px; width:44px; height:44px; line-height:44px; border:1px solid #ccc; border-radius:50%; text-align:center; cursor:pointer; }
.common_popup > .cont .pop_tit > ul { width:100%; float:left; }
.common_popup > .cont .pop_tit > ul > li { width:auto; float:left; line-height:70px; }
.common_popup > .cont .pop_tit .main_tit { padding:0 10px; font-size:25px; font-weight: bold; }
.common_popup > .cont .pop_tit .sub_tit { padding-right:5px; }

.common_popup > .cont .popup_contBox { width:100%; float:left; padding:25px 30px; overflow:auto; }

.common_popup > .back { width:100%; height:100%; background-color:rgba(0,0,0,0.7); z-index:1; }

/* 200312 PC 바로가기 메뉴 */
#pcQuickMenuWrap { position: absolute; z-index: 2; left: 50%; top: 50%; min-width: 150px; opacity: 0; }
#pcQuickMenuWrap > ul { border: 1px solid #000; }
#pcQuickMenuWrap > ul > li { text-align: center; border-bottom: 1px solid #000; background-color: #FFF; }
#pcQuickMenuWrap > ul > li:last-of-type { border-bottom: 0; }

#pcQuickMenuWrap > ul > li > a { text-align: center; font-size: 15px; font-weight: bold; display: block; }
#pcQuickMenuWrap > ul > li > a > i { margin-right: 7px; }
#pcQuickMenuWrap > ul > li > a > img { vertical-align: bottom; }

#pcQuickMenuWrap > ul > li.basic > a { padding: 15px 0; }

#pcQuickMenuWrap > ul > li.goToTop { font-size: 15px; font-weight: bold; color: #FFF; background-color: #000; padding: 10px 0; cursor: pointer; }

#shareFormWrap { width: 100%; height: 100%; position: fixed; left: 0; top: 0; background-color: rgba(0, 0, 0, 0.7); z-index: 50; display: none; }
#shareFormBox { width: 500px; float: left; background-color: #FFF; top: 50%; margin-top: -182.5px; left: 50%; margin-left: -250px; }

#shareFormBox > .conWrap { width: 100%; float: left; }
#shareFormBox > .conWrap > .iconListWrap { width: 100%; float: left; padding: 15px; padding-top: 40px; }
#shareFormBox > .conWrap > .iconListWrap > ul { width: 100%; float: left; text-align: center; margin-bottom: 25px; }
#shareFormBox > .conWrap > .iconListWrap > ul > li { width: 30%; display: inline-block; }
#shareFormBox > .conWrap > .iconListWrap > ul > li > a { width: 100%; float: left; }
#shareFormBox > .conWrap > .iconListWrap > ul > li > a > img { border-radius: 100%; }
#shareFormBox > .conWrap > .iconListWrap > ul > li > a > span { font-size: 14px; font-weight: 500; color: #333; letter-spacing: -0.5px; }

#shareFormBox > .conWrap > .urlCopyWrap { width: 100%; float: left; padding: 15px; padding-top: 0; }
#shareFormBox > .conWrap > .urlCopyWrap > input { width: 68%; float: left; border-radius: 3px; border: 1px solid #EEE; height: 35px; font-size: 13px; color: #333; font-weight: 300; padding: 10px; }
#shareFormBox > .conWrap > .urlCopyWrap > button { width: 30%; float: left; margin-left: 2%; border-radius: 3px; height: 35px; font-size: 13px; color: #FFF; font-weight: 300; background-color: #4F267F; letter-spacing: -0.5px; }

#shareFormBox > .closeWrap { width: 100%; float: left; border-top: 1px solid #D7D7D7; cursor: pointer; }
#shareFormBox > .closeWrap > span { width: 100%; float: left; text-align: center; font-size: 14px; font-weight: 300; color: #666; letter-spacing: -0.5px; padding: 15px 0; }