@charset "UTF-8";

@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-Thin.woff') format('woff');
  font-weight: 100;
}
@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-ExtraLight.woff') format('woff');
  font-weight: 200;
}
@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-Light.woff') format('woff');
  font-weight: 300;
}
@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-Regular.woff') format('woff');
  font-weight: 400;
}
@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-Medium.woff') format('woff');
  font-weight: 500;
}
@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-SemiBold.woff') format('woff');
  font-weight: 600;
}
@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-Bold.woff') format('woff');
  font-weight: 700;
}
@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-ExtraBold.woff') format('woff');
  font-weight: 800;
}
@font-face {
  font-family: Pretendard;
  src: url('fonts/Pretendard-Black.woff') format('woff');
  font-weight: 900;
}

* {border: 0px; margin:0; padding:0; box-sizing:border-box;}
html, body {height:100%; overscroll-behavior: contain;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big,
cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol,
ul, li, fieldset, form, label, legend, table, thead, tbody, tfoot,  tr, th, td, select, option, textarea, button {margin:0; padding:0; border:0; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; background:transparent; font-family: 'Pretendard', sans-serif;}
img, input.image, input.btn, fieldset,iframe {border:0 none;}
img, fieldset {border:none;}
textarea {resize:none;}
textarea:active,
textarea:hover,
textarea:focus {outline:none;}
legend {position:absolute; top:0; left:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}
address {font-style:normal;}
table {border-collapse:collapse; border-spacing: 0px;}
a {text-decoration: none; cursor:pointer!important;}
a:active, a:hover {text-decoration:none!important;}
a {-webkit-transform:translateZ(0); transform:translateZ(0); box-shadow:0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility:hidden; backface-visibility:hidden; -moz-osx-font-smoothing:grayscale; -webkit-transition-duration:0.3s; transition-duration:0.3s; -webkit-transition-property:color, background-color; transition-property:color, background-color;}
ul, li {list-style:none; margin:0; padding:0;}
caption { position:absolute; top:0; left:0; line-height:0; width:0; height:0; overflow:hidden; visibility:hidden;}
pre {line-height:20px;}
h1, h2, h3, h4, h5, h6, form, input, ul, ol, li, dl, dt, dd, p {margin:0; padding:0; font-family: 'Pretendard', sans-serif;}
ul {margin:0; padding:0;}
li {list-style:none;}
input[type=text]::-ms-clear {display:none;}
input[type=text]:focus {outline:0px;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px white inset;}

.dp-inline {display:inline}
.dp-block {display:block}
.dp-block-import {display:block !important}
.dp-n {display:none !important}
.dp-ib {display:inline-block}
.dp-table {display:table!important;}
.dp-tc {display:table-cell}
.dp-none {display:none;}

.ov-auto {overflow:auto;}
.ov-hidden {overflow:hidden;}
.fl-left {float:left;}
.fl-right {float:right;}
.ml-7 {margin-left:7px;}

.w-9p {width:9%!important;}
.w-10p {width:10%!important;}
.w-13p {width:13%!important;}
.w-15p {width:15%!important;}
.w-20p {width:20%!important;}
.w-30p {width:30%!important;}
.w-40p {width:40%!important;}
.w-49p {width:49%!important;}
.w-50p {width:50%!important;}
.w-60p {width:60%!important;}
.w-70p {width:70%!important;}
.w-78p {width:78%!important;}
.w-80p {width:80%!important;}
.w-83p {width:83%!important;}
.w-85p {width:85%!important;}
.w-90p {width:90%!important;}
.w-100p {width:100%!important;}

.h-80 {height:80px!important;}
.h-100 {height:100px!important;}
.h-110 {height:110px!important;}
.h-120 {height:120px!important;}
.h-160 {height:160px!important;}
.h-190 {height:190px!important;}
.h-200 {height:200px!important;}
.h-250 {height:250px!important;}
.h-260 {height:260px!important;}
.h-540 {height:540px!important;}
.h-690 {height:690px!important;}
.h-710 {height:710px!important;}
.h-730 {height:730px!important;}
.h-100p {height:100%;}
.not-height {height:auto!important;}

.w-basic {width:150px!important;}
.w-long {width:200px!important;}
.w-date {width:120px!important; text-align:center;}
.w-day {width:70px!important; text-align:center;}

.w-150 {width:150px!important;}
.w-250 {width:250px!important;}
.w-330 {width:330px!important;}
.w-400 {width:400px!important;}

.mtd-5 {margin-top:5px;}
.mtd-10 {margin-top:10px;}
.mtd-15 {margin-top:15px;}
.mtd-20 {margin-top:20px;}
.mtd-30 {margin-top:30px;}
.mtd-40 {margin-top:40px;}
.pmt-5 {padding-top:5px;}
.mtd-clear-b20 {margin:0 0 20px 0!important;}
.mts-10 {margin:10px 0;}
.mts-20 {margin:20px 0;}
.height-auto100 {height:calc(100% - 90px)!important;}
.height-auto200 {height:calc(100% - 180px)!important;}

body.login {background:#052f50 url('../images/content/login-bg.png') no-repeat 50% 50%;}
body.login .login-wrap {width:100%; position:absolute; top:0; bottom:0; height:100%; display:table; vertical-align:middle;}
body.login .login-wrap .ct-login {position:relative; width:100%; height:100%; display:table-cell; vertical-align:middle;}
body.login .login-content {width:1220px; height:400px; margin:45px auto 0; position:relative;}
body.login .login-content:after {display:block; clear:both; content:'';}
body.login .login-content .logo {position:absolute; top:-120px; left:0; z-index:30;}
body.login .login-content .logo img {display:block; height:50px; margin-bottom:10px;}
body.login .login-content .logo h4 {display:block; font-size:15pt; font-weight:600; letter-spacing:-1px; color:#fff; text-shadow:1px 2px 2px #000, 1px 2px 5px #000, 0 0 5px #fff, 0 0 15px #fff; margin-top:7px;}
body.login .login-section {position:relative; width:450px; padding:70px 0;}
body.login .login-section .user-form {position:relative; height:60px; line-height:60px; margin:10px 0;}
body.login .login-section .user-form:after {display:block; clear:both; content:'';}
body.login .login-section .user-form span.user-title {position:relative; float:left; width:80px; display:block; text-align:center; text-indent:-9999px;}
body.login .login-section .user-form span.user-title.id:before {content:''; width:30px; height:30px; background:url('../images/content/id-icon.svg') no-repeat 50% 50%; background-size:contain; position:absolute; left:50%; top:50%; margin-top:-15px; margin-left:-15px;}
body.login .login-section .user-form span.user-title.pw:before {content:''; width:30px; height:30px; background:url('../images/content/pw-icon.svg') no-repeat 50% 50%; background-size:contain; position:absolute; left:50%; top:50%; margin-top:-15px; margin-left:-15px;}
body.login .login-section .user-form input {float:right; width:calc(100% - 80px); height:60px; background:transparent; color:#fff; font-size:12pt; font-weight:600; }
body.login .login-section .user-form input::placeholder {color:#a6b5c1; font-weight:500; text-transform:uppercase; letter-spacing:0px;}
body.login .login-section .user-form input:-ms-input-placeholder {color:#a6b5c1; font-weight:500; text-transform:uppercase; letter-spacing:0px;}
body.login .i-effect {width:100%; position:absolute; bottom:0; border-bottom:1px solid #677f91;}
body.login .login-section .user-form input:-webkit-autofill {-webkit-background-clip: text!important; -webkit-box-shadow:none!important; -webkit-text-fill-color: #fff;}
body.login .login-section .effect-input ~ .focus-border:after {content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 3px; background-color: #01e7eb; transition: 0.3s;}
body.login .login-section .effect-input:focus ~ .focus-border:before,
body.login .login-section .effect-input:focus ~ .focus-border:after {width: 100%; transition: 0.3s;}
body.login .login-section a.login-btn {margin-top:25px; height:50px; line-height:45px; text-align: center; color: #fff; background:linear-gradient(#4386bf, #2f65d3); font-size: 13pt; font-weight:600; letter-spacing:-1px; text-transform:uppercase; display: block; border-radius: 10px; transition: all 0.2s ease-in-out; position: relative; overflow: hidden; box-shadow: 0 1px 2px rgba(0,0,0,1);  transition: all 0.3s ease-in-out; opacity:0.4;}
body.login .login-section a.login-btn:before {content: ""; background-color: rgba(255,255,255,0.2); height: 100%; width:100px; display: block; position: absolute; top: 0; left: -150px; transform: skewX(-45deg) translateX(0); transition: none;}
body.login .login-section a.login-btn:hover {background:linear-gradient(#2f65d3, #4386bf); color: #fff; border-bottom: 4px solid darken(#2194E0, 10%);}
body.login .login-section a.login-btn:hover:before {transform: skewX(-45deg) translateX(650px); opacity:0.1; transition: all 0.4s ease-in-out;}
body.login .login-menu {position:relative; margin:20px 0 0;}
body.login .login-menu a {position:relative; display:inline-block; text-shadow:1px 1px 1px #000; color:#ccd5db; font-size:11pt; padding-left:22px;}
body.login .login-menu a.reset {position:relative; display:inline-block; opacity:0.7; transition: 0.2s;}
body.login .login-menu a.reset:hover {opacity:1.0;}
body.login .login-menu a.reset:before {content:''; position:absolute; width:16px; height:16px; top:3px; left:0; background:url('../images/content/reset.svg') no-repeat 50% 50%; background-size:contain;}
body.login .login-menu .sidemenu {position:absolute; right:0; top:0;}
body.login .login-menu .sidemenu a {position:relative; display:inline-block; opacity:0.7; transition: 0.2s;}
body.login .login-menu .sidemenu a:nth-child(1):before {content:''; position:absolute; width:16px; height:16px; top:2px; left:0; background:url('../images/content/add-user.png') no-repeat 50% 50%; background-size:contain;}
body.login .login-menu .sidemenu a:nth-child(2) {margin-left:15px;}
body.login .login-menu .sidemenu a:nth-child(2):before {content:''; position:absolute; width:16px; height:16px; top:2px; left:0; background:url('../images/content/key.png') no-repeat 50% 50%; background-size:contain;}
body.login .login-menu .sidemenu a:nth-child(2):after {content:''; position:absolute; width:1px; height:14px; top:3px; left:-10px; background:#888;}
body.login .login-menu .sidemenu a:hover {opacity:1.0;}

span.flight-motion {position:absolute; top:-120px; right:50px; -webkit-animation: flightMotion01 2000ms infinite linear; -ms-animation: flightMotion01 2000ms infinite linear; animation: flightMotion01 2000ms infinite linear; z-index:20;}
span.light-motion {position:absolute; top:-131px; left:calc(-50% + 160px); z-index:0; overflow:hidden; -webkit-animation: lightMotion01 2000ms infinite linear; -ms-animation: lightMotion01 2000ms infinite linear; animation: lightMotion01 2000ms infinite linear;}
span.light-motion img {width:100%;}

.modal {display:none; position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,0.5); z-index:50;}
.modal .modal-container {display:table; vertical-align:middle; width:100%; height:100%;}
.modal .modal-container .modal-section {display:table-cell; vertical-align:middle; text-align:center;}
.modal .modal-container .modal-section .modal-wrap {position:relative; background:#fff; margin:0 auto; box-shadow:1px 1px 10px #000;}
.modal .modal-container .modal-section .modal-header {position:relative; width:100%; height:50px; line-height:50px; background:#004989; padding:0 20px;}
.modal .modal-container .modal-section .modal-content {position:relative; padding:25px 30px;}
.modal .modal-container .modal-section .modal-content:after {display:block; clear:both; content:'';}

.input-effect {margin:10px 0 20px; position: relative; z-index:0;}
.input-effect select {width:100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; height:40px; border:0px; display:block; background:#fff url('../images/content/select-bg.png') no-repeat; background-position: right 7px top 18px; color:#666; border-bottom:1px solid #ccc; padding:0; text-align:center; font-size:11pt; font-weight:400; letter-spacing:-1px; vertical-align:middle; color:#888;}
.input-effect select::-ms-expand {display: none;}
.effect-text {width:100%; border: 0; padding: 4px 0 6px; border-bottom: 1px solid #ccc; background-color: transparent;}
.effect-text ~ .focus-border {position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background-color: #3399FF; transition: 0.4s;}
.effect-text:focus ~ .focus-border, .has-content.effect-text ~ .focus-border{width: 100%; transition: 0.4s;}
.effect-text ~ label {position: absolute; left: 0; top: -2px; color: #888; font-size:11pt; transition: 0.3s; z-index: -1; letter-spacing: -1px;}
.effect-text:focus ~ label, .has-content.effect-text ~ label{top: -15px; font-size: 12px; color: #3399FF; transition: 0.3s;}

html.fp-enabled,
.fp-enabled body {margin: 0; padding: 0; overflow:hidden;}
.fp-section {position: relative; box-sizing: border-box;}
.fp-section.fp-table,
.fp-slide.fp-table {display:table; table-layout:fixed; width: 100%;}
.fp-tableCell {display:table-cell; vertical-align: middle; width: 100%;}
.fp-auto-height.fp-section,
.fp-auto-height .fp-tableCell {height: auto !important;}
.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-tableCell {height: auto !important;}

.video-wrapper {display:none; height: 100%; overflow: hidden; position: absolute; width: 100%; top:0; left:0;}
.video-wrapper .incheon-video,
.video-wrapper .daegu-video {position: absolute; height:100%; width: 100%; min-height: 100%;}
.video-wrapper .incheon-video video,
.video-wrapper .daegu-video video {position: absolute; height: auto; width: 100%; min-height: 100%; z-index:30; top:-60px; object-fit:cover;}
.video-wrapper .incheon-video video,
.video-wrapper .daegu-video video {position:fixed; left:-1px; bottom:0; min-width:100%; min-height:100%; width:auto; height:auto; z-index:10; background-size: cover;}
.video-bg {background:url('../images/main-bg.png') no-repeat 50% 50%; background-attachment: fixed; background-size:cover; position: absolute; top:0; height:100%; width: 100%; min-height: 100%; z-index:0;}
#bg-back {display:none; position:absolute; width:100%; height:100%; top:0; background:rgba(0,0,0,0.2); z-index:10; transition: 0.3s;}

.first-video {height: 100%; overflow: hidden; position: absolute; width: 100%; top:0; left:0;}
.first-video .incheon-video {position: absolute; height:100%; width: 100%; min-height: 100%;}
.first-video .incheon-video video {position: absolute; height: auto; width: 100%; min-height: 100%; z-index:30; top:-60px; object-fit:cover;}

.countdown {position:absolute; right:115px; top:65px; z-index:50; font-size:16pt; font-weight:900; color:#fff;}
.countdown-main {position:absolute; right:115px; top:65px; z-index:50; font-size:16pt; font-weight:900; color:#fff;}

.jst-hours {display:none;}
.jst-minutes, .jst-seconds {display:inline-block; font-weight:900; text-shadow:1px 1px 5px #000;}
.incheon-close,
.incheon-close2,
.daegu-close {position:absolute; width:50px; height:50px; display:block; right:50px; top:50px; text-indent:-9999px; z-index:50; border-radius:50%; border:1px solid #fff;}
.incheon-close:before,
.incheon-close2:before,
.daegu-close:before {content:''; position:absolute; top:0;left:0; width:50px; height:50px; border-radius:50%; background:rgba(255,255,255,0.3);}
.incheon-close span,
.incheon-close2 span,
.daegu-close span {position:absolute; display:block; left:50%; top:50%; margin-left:-15px; margin-top:-15px; width:30px; height:30px; background:url('../images/close-layer.svg') no-repeat 50% 50%; background-size:contain; text-indent:-9999px; overflow:hidden; transition: 0.3s;}
.incheon-close:hover span,
.incheon-close2:hover span,
.daegu-close:hover span {transform:rotate(90deg);}

.map-button {position:absolute; z-index:20; top:50%; left:50%; width:120px; height:120px; transition: 0.4s; cursor:pointer; border-radius:50%;}
.map-button .txt {position:relative; width:120px; height:120px; z-index:10; transition: 0.4s;}
.map-button .txt img {display:block; border-radius:50%;}
/*.map-button .txt h3 {display:flex; height:100%; font-size:12pt; font-weight:800; align-items:center; justify-content:center; letter-spacing:-1px; transition: 0.2s;}
.map-button span.circle01 {position:absolute; background:#1fb6b8; left:-5px; top:-5px; width:70px; height:70px; border-radius:50%; z-index:-1; display:block; text-indent:-9999px; -webkit-animation: circleSpread01 800ms infinite linear; animation: circleSpread01 800ms infinite linear;}
.map-button span.circle02 {position:absolute; background:#edc311; left:-5px; top:-5px; width:70px; height:70px; border-radius:50%; z-index:-1; display:block; text-indent:-9999px; -webkit-animation: circleSpread01 1600ms infinite linear; animation: circleSpread01 1600ms infinite linear;}*/
.incheon {margin-left:-340px; margin-top:-354px;}
.incheon .txt {background:url('../images/in-off.png') no-repeat 50% 50%; border-radius:50%;}
.incheon:hover .txt {background:url('../images/in-on.png') no-repeat 50% 50%; border-radius:50%;}

.daegu {margin-left:25px; margin-top:33px;}
.daegu .txt {background:url('../images/dae-off.png') no-repeat 50% 50%; border-radius:50%;}
.daegu:hover .txt {background:url('../images/dae-on.png') no-repeat 50% 50%; border-radius:50%;}



#btnPlayDaegu, #btnPlayIncheon {border:none; border-radius:50%; transition:0.3s; /*background:rgba(255,255,255,0.5);*/ animation: glow 1s infinite; transition:0.5s;}
#btnPlayDaegu:hover, #btnPlayIncheon:hover {transform: scale(1.2); animation:initial;}
#btnPlayDaegu:hover h3, #btnPlayIncheon:hover h3 {font-size:90%;}

.footer {height:80px; background:#111c26;}
.footer .logo {position:absolute; top:25px; left:50px; cursor:default;}
.footer .logo .logo-img {width:120px; height:30px; background:url('../images/kgfc-logo.svg') no-repeat 50% 50%; background-size:contain;}
.footer .foot-menu {position:absolute; right:50px; top:28px;}
.footer .foot-menu span {display:inline-block; font-size:12pt; font-weight:500; color:#6c7279;}
.footer .foot-menu span strong {position:relative; display:inline-block; color:#fff; font-weight:500; padding-right:15px;}
.footer .foot-menu span strong:after {content:''; position:absolute; right:0px; top:0; width:1px; height:12px; background:#}


@keyframes glow{
  0% {box-shadow: 5px 5px 20px rgb(93, 52, 168),-5px -5px 20px rgb(93, 52, 168);}  
  50% {box-shadow: 5px 5px 20px rgb(81, 224, 210),-5px -5px 20px rgb(81, 224, 210);}
  100% {box-shadow: 5px 5px 20px rgb(93, 52, 168),-5px -5px 20px rgb(93, 52, 168);}
}

@-webkit-keyframes flightMotion01 {
	0% {top:-120px;}
	50% {top:-110px;}
	100% {top:-120px;} 
}

@-webkit-keyframes lightMotion01 {
	0% {opacity:0.8;}
	50% {opacity:0.3;}
	100% {opacity:0.8;} 
}

@-webkit-keyframes circleSpread01 {
	0% {-webkit-transform: scale(0.1); transform: scale(0.8); opacity: 0.1;}
	50% {opacity: 0.4;}
	100% {-webkit-transform: scale(1); transform: scale(1.4); opacity: 0;}
}

@-webkit-keyframes circleSpread02 {
	0% {-webkit-transform: scale(0.1); transform: scale(0.7); opacity: 0.1;}
	50% {opacity: 0.4;}
	100% {-webkit-transform: scale(1); transform: scale(1.1); opacity: 0;}
}