@import url("https://fonts.googleapis.com/css?family=Black+Han+Sans&display=swap&subset=korean");
@import url(https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css);
@import url(https://fonts.cdnfonts.com/css/poppins);
@font-face {
font-family: 'KBO-Dia-Gothic_bold';
src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/KBO-Dia-Gothic_bold.woff) format('woff');
font-weight: 700;
font-style: normal;
}
html,
body {
overflow-x: hidden;
width: 100%;
}
body {
font-family: "Poppins", "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important;
}
.ast-container *:not(i) {
font-family: "Poppins", "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important;
}
.bh {
font-family: 'Black Han Sans', sans-serif !important;
}
.bh * {
font-family: 'Black Han Sans', sans-serif !important;
}
.dia:not(i) {
font-family: 'KBO-Dia-Gothic_bold', sans-serif !important;
}
.dia *:not(i) {
font-family: 'KBO-Dia-Gothic_bold', sans-serif !important;
}
.ast-container .dia {
font-family: 'KBO-Dia-Gothic_bold', sans-serif !important;
}
.ast-container .dia * {
font-family: 'KBO-Dia-Gothic_bold', sans-serif !important;
}
*:focus,
*:focus-visible {
outline: none !important;
}
::-moz-selection {
background: #ff5722;
color: #fff;
}
::selection {
background: #ff5722;
color: #fff;
}
.fmc {
color: #ff5722 !important;
}
#content .ast-container {
display: flex;
flex-direction: column;
padding: 0;
max-width: unset;
}
.display_pc {
display: block;
}
.display_mo {
display: none;
}
ul {
list-style: none;
margin: 0;
padding: 0;
} .m-circle {
pointer-events: none;
position: fixed;
padding: 0.3rem;
background-color: #ff5722;
border-radius: 50%;
-webkit-transition: opacity 0.4s ease, -webkit-transform 0.3s ease;
transition: opacity 0.4s ease, -webkit-transform 0.3s ease;
-o-transition: transform 0.3s ease, opacity 0.4s ease;
transition: transform 0.3s ease, opacity 0.4s ease;
transition: transform 0.3s ease, opacity 0.4s ease, -webkit-transform 0.3s ease;
z-index: 99999;
}
.m-circle.pointer {
-webkit-transform: translate(-50%, -50%) scale(8);
-ms-transform: translate(-50%, -50%) scale(8);
transform: translate(-50%, -50%) scale(8);
opacity: .1;
}
.page-id-956 .m-circle {
background-color: #5411a8;
}
header#masthead {
height: 80px;
display: flex;
align-items: center;
transition: all .3s ease;
}
header#masthead>div {
width: 100%;
}
header#masthead #main_header {
position: fixed;
width: 100%;
top: 0;
transition: all .3s ease;
}
header#masthead.Fixed #main_header {
background-color: #000;
}
#logo h1 a span {
font-size: 50px;
color: #ff5722;
}
.container_mouse {
text-align: center;
color: rgba(122, 122, 124, 0.918);
text-transform: uppercase;
padding-top: 0;
cursor: pointer;
font-size: 14px;
position: absolute;
left: 50%;
bottom: 30px;
z-index: 5;
transform: translateX(-50%);
opacity: 0;
animation: fadeIn .4s ease forwards 6.5s;
}
.container_mouse .mouse-btn {
margin: 10px auto;
width: 28px;
height: 50px;
border: 1px solid rgba(122, 122, 124, 0.918);
border-radius: 30px;
display: flex;
}
.container_mouse .mouse-btn .mouse-scroll {
display: block;
width: 8px;
height: 8px;
background: linear-gradient(170deg, rgba(122, 122, 124, 0.918), rgb(123, 124, 124));
border-radius: 50%;
margin: auto;
animation: scrolling 1s linear infinite;
}
.center-con {
display: flex;
align-items: center;
justify-content: center;
margin-left: 10px;
cursor: pointer;
}
.center-con .round {
width: 40px;
height: 40px;
}
.center-con .cta {
width: 100%;
position: absolute;
}
.center-con .cta .arrow {
left: 17%;
}
.center-con .arrow {
position: absolute;
bottom: 0;
margin-left: 0px;
width: 17px;
height: 17px;
background-size: contain;
top: 12px;
}
.center-con .segunda {
margin-left: 11px;
}
.center-con .next {
background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiI+PHN0eWxlPi5zdDB7ZmlsbDojZmZmfTwvc3R5bGU+PHBhdGggY2xhc3M9InN0MCIgZD0iTTMxOS4xIDIxN2MyMC4yIDIwLjIgMTkuOSA1My4yLS42IDczLjdzLTUzLjUgMjAuOC03My43LjZsLTE5MC0xOTBjLTIwLjEtMjAuMi0xOS44LTUzLjIuNy03My43UzEwOSA2LjggMTI5LjEgMjdsMTkwIDE5MHoiLz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMzE5LjEgMjkwLjVjMjAuMi0yMC4yIDE5LjktNTMuMi0uNi03My43cy01My41LTIwLjgtNzMuNy0uNmwtMTkwIDE5MGMtMjAuMiAyMC4yLTE5LjkgNTMuMi42IDczLjdzNTMuNSAyMC44IDczLjcuNmwxOTAtMTkweiIvPjwvc3ZnPg==);
}
@keyframes bounceAlpha {
0% {
opacity: 1;
transform: translateX(0px) scale(1);
}
25% {
opacity: 0;
transform: translateX(10px) scale(0.9);
}
26% {
opacity: 0;
transform: translateX(-10px) scale(0.9);
}
55% {
opacity: 1;
transform: translateX(0px) scale(1);
}
}
.center-con .bounceAlpha {
animation-name: bounceAlpha;
animation-duration: 1.4s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.center-con .arrow.primera.bounceAlpha {
animation-name: bounceAlpha;
animation-duration: 1.4s;
animation-delay: 0.2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.center-con .round:hover .arrow {
animation-name: bounceAlpha;
animation-duration: 1.4s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.center-con .round:hover .arrow.primera {
animation-name: bounceAlpha;
animation-duration: 1.4s;
animation-delay: 0.2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.infolink_button_box .elementor-button {
width: 100%;
}
#map {
height: 400px;
border-radius: 20px;
}
@keyframes scrolling {
0% {
opacity: 0;
transform: translateY(-13px);
}
100% {
opacity: 1;
transform: translateY(10px);
}
}
@keyframes fadeIn {
to {
opacity: 1;
}
}
@media screen and (max-width:767px) {
.display_pc {
display: none;
}
.display_mo {
display: block;
}
.ast-separate-container #content .ast-container {
padding: 0;
}
.m-circle {
display: none;
}
header#masthead {
height: 70px;
}
.hfe-nav-menu__breakpoint-mobile .hfe-active-menu.hfe-active-menu-full-width+.hfe-nav-menu__layout-horizontal,
.hfe-nav-menu__breakpoint-mobile .hfe-active-menu.hfe-active-menu-full-width+.hfe-nav-menu__layout-vertical {
position: fixed;
top: 0;
left: 0 !important;
width: 100% !important;
height: 100%;
align-items: center;
transition: opacity .3s ease;
}
.hfe-nav-menu__breakpoint-mobile .hfe-layout-horizontal .hfe-nav-menu__toggle,
.hfe-nav-menu__breakpoint-mobile .hfe-layout-vertical .hfe-nav-menu__toggle {
z-index: 999999;
}
nav.hfe-nav-menu__layout-horizontal.hfe-nav-menu__submenu-arrow.hfe-dropdown ul li a {
text-align: center;
display: block;
}
#map {
height: 300px;
}
}#intro_loading {
position: fixed;
z-index: 9999999999999;
background-color: #000;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center; overflow: hidden;
}
#logo_svg {
max-width: 500px;
z-index: 1; }
#logo_svg > path {
stroke: #fff;
stroke-width: 1px;
fill: transparent;
}
#logo_svg > path:nth-child(1) {
stroke-dasharray: 1450.579345703125px;
stroke-dashoffset: 1450.579345703125px;
animation: logo_intro 1.5s ease-in-out forwards, logo_fill 0.5s ease-in forwards .7s;
}
#logo_svg > path:nth-child(2) {
stroke-dasharray: 1065.846923828125px;
stroke-dashoffset: 1065.846923828125px;
animation: logo_intro 1.5s ease-in-out forwards .3s, logo_fill 0.8s ease-in forwards 1s;
}
#logo_svg > path:nth-child(3) {
stroke-dasharray: 891.1275634765625px;
stroke-dashoffset: 891.1275634765625px;
animation: logo_intro 1.5s ease-in-out forwards .6s, logo_fill 0.8s ease-in forwards 1.3s;
}
#logo_svg > path:nth-child(4) {
stroke-dasharray: 495.7514343261719px;
stroke-dashoffset: 495.7514343261719px;
animation: logo_intro 1.5s ease-in-out forwards .9s, logo_fill 0.8s ease-in forwards 1.6s;
}
#logo_svg > path:nth-child(5) {
stroke: #ff5722;
stroke-dasharray: 154.6368408203125px;
stroke-dashoffset: 154.6368408203125px;
animation: logo_intro 1.5s ease-in-out forwards 1.2s, logo_fill_2 0.8s ease-in forwards 1.9s;
}
#intro_loading:after {
position: absolute;
left: 0;
top: -50%;
content: "";
width: 100%;
height: 50%;
background-color: #000;
animation: logo_back_up .5s linear forwards 3.3s;
z-index: 2;
}
#intro_loading:before {
position: absolute;
right: 0;
bottom: -50%;
content: "";
width: 100%;
height: 50%;
background-color: #000;
animation: logo_back_bottom .5s linear forwards 3.3s;
z-index: 2;
}
@keyframes logo_intro {
to {
stroke-dashoffset: 0%;
}
}
@keyframes logo_fill {
to {
fill: white;
}
}
@keyframes logo_fill_2 {
to {
fill: #ff5722;
}
}
@keyframes logo_back_up {
to{
top: 0;
}
}
@keyframes logo_back_bottom {
to{
bottom: 0;
}
}
@keyframes logo_fade_zoom_out{
to{
transform: scale(0);
}
}
@keyframes logo_bg_fade_zoom_out{
to{
border-radius: 100%;
transform: scale(0);
}
}
@media screen and (max-width:767px) {
#intro_loading {
padding: 0 30px;
}
}