@charset "UTF-8";
.kv-curve { position: relative; z-index: 3; }

.iphone .page-top .bg .img { background-attachment: unset; }

.page-top { height: 100vh; position: relative; }

.page-top .container { padding: 0 23.5vw 0 9.8vw; }

.page-top .front { overflow: hidden; }

.page-top .front, .page-top .back { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; }

.page-top .front .inner, .page-top .back .inner { position: absolute; top: 0; left: 0; width: 100%; height: 100vh; }

.page-top .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.page-top .bg:after { position: absolute; left: 0; right: 0; bottom: 0; opacity: 0.25; background-image: linear-gradient(to top, #000000, rgba(0, 0, 0, 0)); height: 200px; content: ''; }

.page-top .bg .img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: 50% 50% no-repeat; background-size: cover; background-attachment: fixed; }

.page-top .bg .img .over { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; }

.page-top .bg .img .over.yellow { background-color: #EB912A; }

.page-top .bg .img .over.green { background-color: #88AD3E; }

.page-top .bg .img .over.blue { background-color: #4292B8; }

.page-top .bg .img:after { background: rgba(0, 0, 0, 0.1); position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; }

.page-top .title { position: absolute; top: 50%; transform: translateY(-50%); position: fixed; left: 0; right: 0; color: #fff; padding: 200px 0; }

.page-top .title h1 { font-size: 24px; margin-bottom: 12px; font-weight: 500; }

.page-top .title p { font-size: 60px; line-height: 1.54; letter-spacing: -0.06em; }

.page-top .page-top-footer { right: 55px; bottom: 45px; }

.page-top .back .title { color: #000; }

.page-top .back .page-top-footer .btn-down { background-image: url(/images/ico/arrow-down.svg); }

.page-top.linear .bg .img { background-attachment: scroll; }

.page-top .page-top-breadcrumb { color: #fff; opacity: 1; transition: none; }

.page-top .page-top-breadcrumb a { color: #fff; }

.page-top .page-top-breadcrumb a.active { color: #fff; }

.page-top .page-top-breadcrumb .split { color: #fff; }

.scrolldown { display: none; width: 2px; height: 120px; background-color: rgba(255, 255, 255, 0.1); text-indent: -999em; overflow: hidden; position: absolute; left: 50%; margin-left: -1px; bottom: 0; }

.scrolldown:after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 50px; background: #fff; }

/* 키비 인모션 */
#header, .page-top, .page-top-breadcrumb { opacity: 0; transition: opacity 1.5s; }

.inMotion #header, .inMotion .page-top, .inMotion .page-top-breadcrumb { opacity: 1; }

@keyframes scrolldown { 0% { top: -50px; }
  80%, 100% { top: 100%; } }

.en .page-top .title p { letter-spacing: -0.025em; line-height: 1.4; }

.cn .page-top .title p { letter-spacing: -0.02em; line-height: 1.54; }

@media screen and (max-width: 1200px) { .page-top .title { padding: 180px 0; }
  .page-top .title h1 { font-size: 22px; margin-bottom: 24px; }
  .page-top .title p { font-size: 52px; }
  .page-top .page-top-footer { right: 55px; bottom: 45px; } }

@media screen and (max-width: 1023px) { .page-top .container { padding: 0 23.8vw 0 8.4vw; }
  /* .scrolldown { display:block; } */
  .page-top .title { padding: 160px 0; }
  .page-top .title h1 { font-size: 20px; margin-bottom: 20px; line-height: 34px; letter-spacing: -0.03em; }
  .page-top .title p { font-size: 36px; }
  .page-top .page-top-footer { right: 40px; bottom: 40px; }
  .page-top .page-top-footer .breadcrumb { display: none; } }

@media screen and (max-width: 767px) { .page-top .container { padding: 0 13.5vw 0 9.8vw; }
  .page-top .title { padding: 140px 0; }
  .page-top .title h1 { font-size: 18px; margin-bottom: 18px; }
  .page-top .title p { font-size: 28px; }
  .page-top .page-top-footer { right: 30px; bottom: 30px; } }

/*# sourceMappingURL=page-top.css.map */