@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')
}

@font-face {
  font-family: 'KoreanRKT-R';
  src: url('/fonts/KoreanRKT-R.woff2') format('woff2'),
		url('/fonts/KoreanRKT-R.woff') format('woff')
}

* { margin: 0; padding: 0; box-sizing: border-box; position: relative; font-family: "Noto Sans KR", sans-serif; letter-spacing: -1px; -webkit-tap-highlight-color: transparent; }
*:focus { outline: none; }
*::selection { background-color: #666; color: #FFF; }
html, body { width: 100%; min-height: 101%; float: left; color: #FFF; background-color: #080808; font-size: 15px; }
#wrap { width: 100%; height: 100%; float: left; left: 0; }

/* 엘리먼트 초기화 */
a { text-decoration: none; color: inherit; }
img { vertical-align: bottom; }
input { border: none; font-size: 15px; letter-spacing: -0.5px; }
ul, li { list-style: none; }
button { cursor: pointer; border: none; background: none; }
table { table-layout: fixed; border-collapse: separate; border-spacing: 0; }
label { cursor: pointer; }

/* 체크박스 커스텀 */
.checkCustom { display: none; }
.checkCustomLabel > .on { display: none; }
.checkCustomLabel > .off { display: inline-block; }

.checkCustom:checked + .checkCustomLabel > .on { display: inline-block; }
.checkCustom:checked + .checkCustomLabel > .off { display: none; }

/* letter spacing 0.5 */
.lp05 { letter-spacing: -0.5px; }
.lp05 * { letter-spacing: -0.5px; }

/* commonBox */
.commonBox { width: 100%; min-width: 1400px; float: left; }
.commonBox > div { width: 1400px; margin: 0 auto; }
.commonBox > div > div { width: 100%; float: left; }

/* float */
.left { float: left; }
.right { float: right; }

/* a로케트 */
.rkt { font-family: "KoreanRKT-R", sans-serif; }
.rkt * { font-family: "KoreanRKT-R", sans-serif; }

/* loading */
#loadingWrap { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 999; display: none; }
#loadingWrap > #loading { position: absolute; width: 50px; height: 50px; left: 50%; top: 50%; margin-left: -25px; margin-top: -25px; border: 3px solid rgba(255, 255, 255, 0.3); border-radius: 50%; border-top-color: #FFC800; animation: loading 1s ease-in-out infinite; -webkit-animation: loading 1s ease-in-out infinite; }

@keyframes loading { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@-webkit-keyframes loading { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

/* loading io */
@keyframes ldio-yocf1ezyb1n {
  0% { transform: translate(-50%,-50%) rotate(0deg); }
  100% { transform: translate(-50%,-50%) rotate(360deg); }
}
.ldio-yocf1ezyb1n div { position: absolute; width: 50px; height: 50px; border: 8px solid #ffc300; border-top-color: transparent; border-radius: 50%; }
.ldio-yocf1ezyb1n div { animation: ldio-yocf1ezyb1n 1s linear infinite; top: 100px; left: 100px; }
.loadingio-spinner-rolling-ikdeuqrqlw { width: 200px; height: 200px; display: inline-block; overflow: hidden; position: absolute; top: 50%; left: 50%; margin-top: -100px; margin-left: -100px; z-index: 10; }
.ldio-yocf1ezyb1n { width: 100%; height: 100%; position: relative; transform: translateZ(0) scale(1); backface-visibility: hidden; transform-origin: 0 0; }
.ldio-yocf1ezyb1n div { box-sizing: content-box; }

/* mediaelement */
.mejs__container { width: 100% !important; height: 340px !important; float: left; }
.mejs__container > .mejs__inner { width: 100%; height: 100%; float: left; }
.mejs__container video { width: 100% !important; height: 340px !important; }
.mejs__overlay-play { width: 100% !important; height: 340px !important; }
.mejs__layer { width: 100% !important; height: 340px !important; }

/* 공용상단 */
#headerTopWrap { border-bottom: 1px solid #191919; }
#headerTopWrap > div > div { height: 145px; }

#headerTopWrap .logoWrap { height: 100%; line-height: 145px; float: left; padding-left: 80px; }
#headerTopWrap .logoWrap > a { color: #FFC800; font-size: 35px; }

#headerTopWrap .searchBoxWrap { position: absolute; width: 580px; height: 100%; float: left; padding: 45px 0; left: 50%; margin-left: -290px; top: 0; }
#headerTopWrap .searchBoxWrap > .searchBox { width: 100%; height: 100%; float: left; }
#headerTopWrap .searchBoxWrap > .searchBox > input { width: 100%; height: 100%; float: left; background-color: #080808; border: 1px solid #818181; border-radius: 50px; font-weight: 500; color: #CCC; padding: 0 74px 0 30px; }
#headerTopWrap .searchBoxWrap > .searchBox > input::placeholder { color: #444; }
#headerTopWrap .searchBoxWrap > .searchBox > .searchBtn { position: absolute; top: 0; right: 30px; font-size: 24px; cursor: pointer; color: #939393; top: 50%; margin-top: -12.5px; }

#headerTopWrap .userWrap { height: 100%; float: right; display: table; }
#headerTopWrap .userWrap > ul { height: 100%; display: table-cell; vertical-align: middle; }
#headerTopWrap .userWrap > ul > li { float: left; border-right: 1px solid #A5A5A5; }
#headerTopWrap .userWrap > ul > li:last-of-type { border-right: 0; }
#headerTopWrap .userWrap > ul > li > a { float: left; font-size: 15px; padding: 0 20px; color: #979797; }
#headerTopWrap .userWrap > ul > li > a:hover { color: #BBB; }
#headerTopWrap .userWrap > ul > li > a > i { margin-right: 10px; }

/* 공용메뉴 */
#headerMenuWrap #categoryBtn { width: 330px; height: 75px; line-height: 75px; float: left; cursor: pointer; text-align: center; border: 1px solid #2B2B2B; font-weight: bold; font-size: 18px; color: #979797; margin-top: -1px; }
#headerMenuWrap #categoryBtn > i { margin-right: 10px; }
#headerMenuWrap #categoryBtn:hover { border: 1px solid #3A3A3A; }
#headerMenuWrap #categoryBtn:hover ~ #mainCategoryWrap { display: block; }
#headerMenuWrap #categoryBtn.active { border: 1px solid #3A3A3A !important; }

#headerMenuWrap #mainCategoryWrap { position: absolute; width: 100%; height: 300px; top: 100%; left: 0; z-index: 50; border: 1px solid #000; background-color: #111; display: none; }

#headerMenuWrap #mainCategoryWrap > ul > li.title { width: 100%; float: left; font-weight: bold; border-bottom: 1px solid #555; font-size: 17px; padding: 0 0 15px 10px; }
#headerMenuWrap #mainCategoryWrap > ul > li.item { margin-top: 15px; float: left; text-align: left; padding-left: 10px; }
#headerMenuWrap #mainCategoryWrap > ul > li.item > a { font-size: 16px; font-weight: 400; color: #FFF; opacity: 0.4; }
#headerMenuWrap #mainCategoryWrap > ul > li.item > a:hover { opacity: 0.8; }

#headerMenuWrap #mainCategoryWrap > .campaignList { width: 85%; height: 100%; float: left; overflow-y: auto; padding: 20px; }
#headerMenuWrap #mainCategoryWrap > .campaignList li.item { width: 20%; }

#headerMenuWrap #mainCategoryWrap > .etcList { width: 15%; height: 100%; float: right; background-color: #1A1A1A; padding: 20px; }
#headerMenuWrap #mainCategoryWrap > .etcList li.item { width: 100%; }

#headerMenuWrap .etcMenuWrap { float: right; padding-right: 40px; }
#headerMenuWrap .etcMenuWrap > li { height: 74px; line-height: 74px; float: left; }
#headerMenuWrap .etcMenuWrap > li > a { color: #A5A5A5; font-weight: 500; font-size: 18px; float: left; width: 100%; padding: 0 50px; }
#headerMenuWrap .etcMenuWrap > li > a:hover { color: #CCC; }
#headerMenuWrap .etcMenuWrap > li > span { color: #A5A5A5; font-weight: 500; font-size: 18px; cursor: pointer; float: left; width: 100%; padding: 0 50px; }
#headerMenuWrap .etcMenuWrap > li > span:hover { color: #CCC; }
#headerMenuWrap .etcMenuWrap > li.active { border-bottom: 5px solid #FFC800; color: #FFC800 !important; }
#headerMenuWrap .etcMenuWrap > li.active > * { color: #FFC800 !important; }

/* 공용하단영역 */
#footerWrap > div > div { padding: 120px 0; }

#footerWrap .navWrap { width: 100%; float: left; text-align: center; }
#footerWrap .navWrap > li { display: inline-block; font-size: 18px; font-weight: 500; color: #555; }
#footerWrap .navWrap > li.line { width: 1px; height: 15px; background-color: #555; margin: 0 20px; }

#footerWrap .copyrightWrap { width: 100%; float: left; text-align: center; font-size: 17px; color: #555; font-weight: 500; letter-spacing: -0.5px; margin-top: 15px; }

#footerWrap .telWrap { width: 100%; float: left; text-align: center; font-size: 17px; color: #FFF; font-weight: 500; letter-spacing: -0.5px; margin-top: 12px; }

/* 플로팅메뉴 */
#floatingMenuBox { position: absolute; width: 83px; left: 50%; top: 440px; margin-left: -41.5px; transform: translateX(780px) translateY(0); z-index: 10; transition: transform 0.5s; opacity: 0; }
#floatingMenuBox > ul { width: 100%; float: left; }
#floatingMenuBox > ul > li { width: 100%; float: left; }
#floatingMenuBox > ul > li > a { width: 100%; float: left; }
#floatingMenuBox > ul > li > a > img { width: 100%; height: 100%; float: left; }

#floatingMenuBox > ul > li.basic { height: 83px; border-radius: 100%; overflow: hidden; }
#floatingMenuBox > ul > li.top { margin-top: 10px; }
#floatingMenuBox > ul > li.top > a { padding: 6px 0; text-align: center; font-weight: bold; color: #FFF; font-size: 13px; border-radius: 3px; border: 1px solid #464646; background-color: #080808; }

@media (max-width: 1800px){
	#floatingMenuBox { display: none; }
}