@font-face {
	font-family: "Noto Sans";
	font-weight: normal;
	src: url("../../../fonts/NotoSans-Regular.eot");
	src: local("NotoSans-Regular"), url("../../../fonts/NotoSans-Regular.woff") format("woff");
}

@font-face {
	font-family: KostarB;
	font-weight: normal;
	src: url("../../../fonts/kostar/KostarB.eot");
	src: local("KostarB"), url("../../../fonts/kostar/KostarB.woff") format("woff");
}

* { margin: 0; padding: 0; -webkit-text-size-adjust: none; max-height: 999999px; }

body { min-width: 1250px; background-color: #0b0d12; color: #fff; }

ul, ol, li { list-style: none; }

img { border: none; }
:focus { outline: none; }

.container { position: relative; font: 22px/1.4 "Noto Sans", "Malgun Gothic", sans-serif; overflow: hidden; background-color: #000; }
.container .section-holder { position: relative; width: 1004px; margin: 0 auto; }

.header { position: relative; margin-bottom: 66px; border-bottom: 2px solid #000; background: #000 url("/static/images/starcraft/scr-playtime/bg-header.jpg") center top no-repeat; }
.header .section-holder { height: 1012px; padding-top: 428px; background: url("/static/images/starcraft/scr-playtime/logo-sc.png") center 230px no-repeat; text-align: center; }
.header .section-holder h2 { color: #8cabeb; font-family: "KostarB"; font-size: 40px; }
.header .section-holder h1 { color: #fff; font-family: "KostarB"; font-size: 72px; text-shadow: 5px 5px 20px #3f4679; }

.header .header-content-box { position: relative; text-align: center; z-index: 2; font-size: 24px; }
.header .header-content-box .tagline { margin-top: 50px; }
.header .header-content-box .period { margin-top: 30px; color: #8cabeb; }
.header .header-content-box .period .title { font-weight: bold; }
.header .header-content-box .share-buttons { margin-top: 30px; }
.header .header-content-box .share-buttons a { display: inline-block; width: 48px; height: 48px; margin: 0 5px; background: url("/static/images/starcraft/scr-playtime/button-share.png") no-repeat; vertical-align: middle; }
.header .header-content-box .share-buttons a.facebook { background-position: left top; }
.header .header-content-box .share-buttons a.twitter { background-position: right top; }
.header .header-content-box .buttonList { display: flex; -webkit-box-pack: center; justify-content: center; margin-top: 60px; }
.header .header-content-box .buttonList li { display: list-item; text-align: -webkit-match-parent; margin: 1em 0.3em; }
.header .header-content-box .buttonList li.button-winner { display: none; }

.buttonList .buttonList-default { max-width: 200px; padding: 0.6em; background: rgba(0, 0, 0, 0.6); border: 2px solid rgba(204, 255, 102, 0.4); border-radius: 6px; color: #eeffcc; display: inline-block; width: 200px; font-size: 23px; }
.buttonList .buttonList-outlined { background: linear-gradient(0deg, rgba(0, 51, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 100%), linear-gradient(0deg, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.3) 50%) !important; background-size: auto, 1px 2px; border: 1px solid rgba(0, 204, 0, 0.6); box-shadow: 0 0 20px rgba(0, 204, 0, 0.5), inset 0 0 0 1px #000, inset 0 0 0 2px rgba(0, 204, 0, 0.5); color: #eeffcc; }
.buttonList .buttonList-default:hover { background: rgba(0, 0, 0, 0.6); border-color: rgba(204, 255, 102, 0.8); box-shadow: 0 0 10px rgba(204, 255, 102, 0.4); color: #ccff66; }
.buttonList .buttonList-outlined:hover { background: rgba(0, 0, 0, 0.8); border-color: #ccff66; box-shadow: 0 0 10px #ccff66, inset 0 0 0 1px #000, inset 0 0 0 2px #ccff66; color: #ccff66; }

.header .header-content-box .direction { margin-top: 280px; }

.header .nav-wrapper { position: relative; width: 99%; line-height: 1em; text-align: center; padding: 3px 2px; border: 2px solid #331f1f; border-radius: 5px; background: rgba(0, 0, 0, 0.8); z-index: 10; }
.header .nav-wrapper .nav-inner { border: 1px solid #800000;  border-radius: 5px; }
.header .nav-wrapper .nav-inner .nav-content { width: 1020px; margin: 0 auto; }
.header .nav-wrapper .nav-inner .nav-list { display: flex; -webkit-box-pack: flex-end; justify-content: flex-end; }
.header .nav-wrapper .nav-inner .nav-list li { display: line-item; margin: 1em 0.3em;  }
.header .nav-wrapper .nav-inner .nav-list li.nav-listItem { font-size: 16px; padding: 0 1.4em; }
.header .nav-wrapper .nav-inner .nav-list li.nav-listItem a { color: #00cc00; }
.header .nav-wrapper .nav-inner .nav-list li.nav-listItem a:hover { color: #ccff66; }
.header .nav-wrapper .nav-inner .nav-list li.nav-listItem a.active { color: #ccff66; }
.header .nav-wrapper .nav-inner .nav-list li.nav-listItem .sc-logo { background: url("/static/images/starcraft/scr-playtime/icon-sc.png") no-repeat; width: 53px; height: 25px; display: inline-block; position: relative; left: -400px; }

.section-notice { width: 1024px; margin: 0px auto; }
.section-notice .section-target { text-align: center; padding-top: 50px; }
.section-notice .section-target h3 { font: 26px "KostarB"; color: #8dabeb; margin-top: 50px; }
.section-notice .section-target p { font-size: 18px; color: #b9bacc; line-height: 1.8em; }
.section-notice .section-target .target-gift { font-size: 15px; color: #b9bacc; text-align: center; height: 330px; }
.section-notice .section-target .target-gift ul { display: table; text-align: center; margin: 10px auto; }
.section-notice .section-target .target-gift li { float: left; margin: 10px 20px; }
.section-notice .section-target .target-gift li span { display: inline-block; margin-top: 260px; }
.section-notice .section-target .target-gift li.event1-first-grade { background: url("/static/images/starcraft/scr-playtime/img-gift-pckeyboard.png") center top no-repeat; width: 250px; height: 190px; }
.section-notice .section-target .target-gift li.event1-second-grade { background: url("/static/images/starcraft/scr-playtime/img-gift-keyboard.png") center center no-repeat; width: 250px; height: 190px; }
.section-notice .section-target .target-gift li.event1-third-grade { background: url("/static/images/starcraft/scr-playtime/img-gift-backpack.png") center top no-repeat; width: 250px; height: 190px; }
.section-notice .section-target .target-gift li.event2-first-grade { background: url("/static/images/starcraft/scr-playtime/img-gift-keyboard.png") center center no-repeat; width: 250px; height: 190px; }
.section-notice .section-target .target-gift li.event2-second-grade { background: url("/static/images/starcraft/scr-playtime/img-gift-backpack.png") center top no-repeat; width: 250px; height: 190px; }
.section-notice .section-target .target-gift li.event2-third-grade { background: url("/static/images/starcraft/scr-playtime/img-gift-portrait.png") center top no-repeat; width: 250px; height: 190px; }
.section-notice .section-target .gift-warning { color: #8cabea; font-size: 15px; text-align: center; margin-top: 10px; }

.section-notice .section-event { margin-top: 100px; text-align: center; }
.section-notice .section-event h4 { font: 26px "KostarB"; color: #4abf23; }
.section-notice .section-event h2 { font: 36px "KostarB"; color: #fff; line-height: 1.8em; text-shadow: 5px 5px 10px #3f4679; }
.section-notice .section-event p { font-size: 18px; color: #b9bacc; line-height: 1.4em; margin-top: 10px; }
.section-notice .section-event p a { color: #80ff66; }

.section-warning { width: 1000px; margin: 100px auto 100px; color: #b8bbcc; }
.section-warning .title { padding: 0 0 20px 20px; font: 36px "KostarB"; color: #fff; }
.section-warning ol { padding-left: 30px; padding-right: 20px; }
.section-warning ol li { margin-left: 15px; margin-bottom: 5px; list-style: decimal; word-break: keep-all; font-size: 18px; }
.section-warning ol li a { color: #80ff66; }

.section-remaster { width: 800px; margin: 0 auto 150px; text-align: center; }
.section-remaster p { font-size: 26px; }
.section-remaster a { background: url("/static/images/starcraft/scr-playtime/button-remaster.png") no-repeat; text-indent: -1000em; width: 307px; height: 64px; display: block; margin: 20px auto; }
.section-remaster a:hover { background-position: 0 -64px; }

.rules { display: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color:rgba(0, 0, 0, 0.8); z-index: 1000; }
.rules .inner-rules { position: absolute; left: 50%; top: 200px; width: 712px; height: 670px; padding: 18px; margin-left: -374px; border: 1px solid #274a75; border-radius: 2px; background-color: #0a151f; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5); }
.rules .inner-rules a.close { position: absolute; right: 15px; top: 14px; width: 28px; height: 28px; background: url("/static/images/content/invitation/button-close.png") no-repeat; }
.rules .inner-rules a.close span { display: none; }
.rules .inner-rules h3 { font-size: 24px; font-family: 'Koverwatch'; font-weight: normal; color: #88a8c5; padding: 5px 0 15px; }
.rules .inner-rules .rules-text { height: 540px; padding: 8px; background-color: #131313; border: 1px solid #172027; color: #4d6f8d; font-size: 20px; font-family: 'Noto Sans'; border-radius: 2px; line-height: 1.6; overflow: auto; }
.rules .inner-rules .close-rules { margin-top: 20px; text-align: center; }
.rules .inner-rules .close-rules a { font-size: 18px; color: #009cff; font-family: 'Noto Sans'; text-decoration: underline; }

#content { height: 1200px; margin-top: 50px; }
#content .content-box { width: 1000px; margin: 0 auto 80px; padding: 60px 0; }
#content .content-box .title { font-size: 40px; color: #fff; font-family: 'KostarB'; text-align: center; }
#content .content-box .sub-title { font-size: 24px; color: #8cabea; text-align: center; }
#content .loading { display: none; background: url("/static/images/starcraft/scr-playtime/icon-loading.gif") center center no-repeat; width: 128px; height: 15px; margin: 200px auto; }

.content-form .desc { padding: 50px 0 15px; text-align: center; color: #b7bccf; font-size: 18px; }
.content-form .error-box { display: none; width: 840px; margin: 0 auto 55px; padding: 20px 0; background-color: #f90000; border-radius: 5px; text-align: center; }
.content-form .error-box span.error-message { color: #fff; font-size: 24px; }
.content-form .success-box { width: 840px; margin: 0 auto 55px; padding: 20px 0; background-color: #009f00; border-radius: 5px; text-align: center; }
.content-form .success-box span.success-message { color: #fff; font-size: 24px; }

.content-form .form-box { width: 900px; margin: 50px auto; border: 1px solid #800000; border-radius: 8px; background-color: #0a090e; }
.content-form .form-box dl { padding: 30px 0; font-size: 24px; line-height: 55px; overflow: hidden; }
.content-form .form-box dl dt { float: left; width: 22%; padding-right: 3%; text-align: right; }
.content-form .form-box dl dd { position: relative; float: left; width: 75%; }
.content-form .form-box dl dd input { height: 40px; background-color: #fff; border: none; border-radius: 5px; text-indent: 6px; color: #000; font-size: 18px; font-family: 'Noto Sans'; line-height: 45px; }
.content-form .form-box dl dd input.field-cellphone,.content-form .form-box dl dd input.field-zipcode  { width: 200px; }
.content-form .form-box dl dd input.field-address1, .content-form .form-box dl dd input.field-address2 { width: 290px; }
.content-form .form-box dl dd .field-zipcode-button { border: 2px solid #586c31; padding: 4px 15px; color: #edffcd; font-size: 20px; border-radius: 5px; }
.content-form .form-box dl dd i { display: inline-block; color: #009f00; font-size: 30px; opacity: 0; transition:.25s ease-in-out; }
.content-form .form-box dl dd.error input { height: 41px; border: 2px solid #ff0200; }
.content-form .form-box dl dd.valid input { height: 41px; border: 2px solid #009f00; }
.content-form .form-box dl dd.valid i { opacity: 1; }
.content-form .form-box .agreement-text { width: 80%; margin: 15px auto; text-align: center; }
.content-form .form-box .agreement-text p { margin-bottom: 15px; word-break: keep-all; text-align: left; padding: 20px; color: #696f7b; font-size: 18px; background-color: #1d1e23; border-radius: 10px; }
.content-form .form-box .agreement-text label { display: inline-block; font-size: 24px; vertical-align: middle; }
.content-form .form-box .agreement-text input[type='checkbox'] { width: 24px; height: 24px; vertical-align: middle; }

.content-form .buttonList { margin-top: 60px; text-align: center; }
.content-form .buttonList a { max-width: 200px; padding: 0.6em; background: rgba(0, 0, 0, 0.6); border: 2px solid rgba(204, 255, 102, 0.4); border-radius: 6px; color: #eeffcc; display: inline-block; width: 200px; font-size: 23px; background: linear-gradient(0deg, rgba(0, 51, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 100%), linear-gradient(0deg, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.3) 50%) !important; background-size: auto, 1px 2px; border: 1px solid #ccff66; box-shadow: 0 0 10px #ccff66, inset 0 0 0 1px #000, inset 0 0 0 2px #ccff66; color: #eeffcc; }
.content-form .buttonList a.disabled { border: 1px solid rgba(0, 204, 0, 0.6); box-shadow: 0 0 20px rgba(0, 204, 0, 0.5), inset 0 0 0 1px #000, inset 0 0 0 2px rgba(0, 204, 0, 0.5); color: #aaa; cursor: not-allowed; }

.error-notice { width: 1000px; margin: 200px auto; height: 750px; text-align: center; display: block; }
.error-notice h2 { color: #8cabea; font: 40px "KostarB"; line-height: 1.2em; }
.error-notice .icon-error { margin: 100px 0 50px 0; color: #8cabea; }
.error-notice .buttonList { margin-top: 100px; }
.error-notice .go-main { margin-top: 50px; color: #80ff66; display: inline-block; }

#postal-code { top: 3700px; font-size: 14px; }