:root {
 --color-orange:#FAA74B;
 --color-mint:#00B3AB;
 --color-brown:#594A41;
 --color-pink:#F3ACCB;
 --color-yellow:#FDD900;
 --color-white:#FFFFFF;
 --color-black:#000000;
 --font-pretendard:"Pretendard", sans-serif;
}

.font92 { --fontsize:9.2rem; font-size:var(--fontsize); }
.font70 { --fontsize:7.0rem; font-size:var(--fontsize); }
.font64 { --fontsize:6.4rem; font-size:var(--fontsize); }
.font60 { --fontsize:6.0rem; font-size:var(--fontsize); }
.font50 { --fontsize:5.0rem; font-size:var(--fontsize); }
.font44 { --fontsize:4.4rem; font-size:var(--fontsize); }
.font40 { --fontsize:4.0rem; font-size:var(--fontsize); }
.font38 { --fontsize:3.8rem; font-size:var(--fontsize); }
.font36 { --fontsize:3.6rem; font-size:var(--fontsize); }
.font34 { --fontsize:3.4rem; font-size:var(--fontsize); }
.font30 { --fontsize:3.0rem; font-size:var(--fontsize); }

* { line-height:1.3; letter-spacing:-0.01em; }

html,
body { width:100%; max-width:100%; }

hr,
figure { padding:0; margin:0; }
pre { white-space:pre-wrap; }
textarea { resize:none; }
hr { border:none; margin:0; }

#wrap { width:100%; max-width:100%; font-size:1.6rem; }

.w1720 { max-width:1720px; margin:0 auto; width:100%; height:100%; }
.w1400 { max-width:1400px; margin:0 auto; width:100%; height:100%; }
.w1320 { max-width:1320px; margin:0 auto; width:100%; height:100%; }

.dimmed { width:100vw; height:100vh; background:rgba(0, 0, 0, 0.4); z-index:3; display:none; position:fixed; top:0; left:0; right:0; bottom:0; }

.tab-contents > div { display:none; }
.tab-contents > div.on { display:block; }
.animation { transition:all 0.8s; }
.animation.down { transform:translateY(-60px);
}
.animation.up { transform:translateY(60px); }
.animation.left { transform:translateX(60px); }
.animation.right { transform:translateX(-60px); }
.animation.opacity { opacity:0; }
.animation.on.down, .animation.on.up { transform:translateY(0); }
.animation.on.left, .animation.on.right { transform:translateX(0); }
.animation.on.opacity { opacity:1; }

.more { width:180px; height:60px; background:var(--color-mint); border-radius:60px; padding:0 35px; transition:all 0.4s; display:flex; flex-direction:row; row-gap:0; column-gap:0; align-items:center; justify-content:space-between; }
.more span { color:var(--color-white); font-weight:500; }
.more img { width:15px; }
.more:hover { padding:0 25px; }

.flexBox { display:flex; }

header { width:100%; height:100px; z-index:25; position:fixed; top:0; left:0; right:0; }
header.active { background:#fff; box-shadow:0 0 5px rgba(0, 0, 0, 0.1); }
header * { transition:all 0.4s; }
header .header-box { position:relative; width:100%; height:100%; display:flex; flex-direction:row; row-gap:0; column-gap:0; align-items:center; justify-content:flex-start; }
header .logo { /* width:182px; height:40px;*/ }
header nav,
header .depth1,
header .depth1 > li { height:100%; }
header nav { margin:0 10px 0 auto; }
header nav a { display:block; color:var(--color-white); transition:all 0.6s; }
header nav .depth1 { display:flex; }
header nav .depth1 > li { position:relative; display:flex; flex-direction:row; row-gap:0; column-gap:0; align-items:center; justify-content:flex-start; }
header nav .depth1 > li > a { font-weight:500; padding:0 35px; }
header nav .depth2 { min-width:180px; opacity:0; pointer-events:none; transition-delay:0.2s; position:absolute; top:calc(100% - 20px); left:50%; transform:translateX(-50%); }
header nav .depth2::before { content:""; display:block; background:var(--color-white); box-shadow:0 2px 10px rgba(0, 0, 0, 0.1); transform:translateY(20px); transition:all 0.6s; width:100%; height:100%; position:absolute; top:0; left:50%; transform:translateX(-50%); }
header nav .depth2 > li { text-align:center; }
header nav .depth2 > li > a { color:#666; font-size:1.6rem; white-space:nowrap; padding:10px 0; opacity:0; transform:translateY(-50%); }
header nav .depth2 > li > a strong { font-weight:400; }
header nav .depth2 > li > a span { display:none }
header nav .depth2 > li:hover > a { color:var(--color-mint); }
header nav .depth2.on { padding:15px 25px 25px; opacity:1; overflow:inherit; pointer-events:inherit; transition:opacity 0.6s, top 0.4s 0.1s; }
header nav .depth2.on::before { top:0; }
header nav .depth2.on > li > a { opacity:1; transform:translateY(0); }
header nav .depth2.on > li:nth-child(1) > a { transition-delay:0.1s; }
header nav .depth2.on > li:nth-child(2) > a { transition-delay:0.2s; }
header nav .depth2.on > li:nth-child(3) > a { transition-delay:0.3s; }
header nav .depth2.on > li:nth-child(4) > a { transition-delay:0.4s; }
header nav .depth2.on > li:nth-child(5) > a { transition-delay:0.5s; }
header nav .depth2.on > li:nth-child(6) > a { transition-delay:0.6s; }
header nav .depth2.on > li:nth-child(7) > a { transition-delay:0.7s; }
header nav .depth2.on > li:nth-child(8) > a { transition-delay:0.8s; }
header nav .depth2.on > li:nth-child(9) > a { transition-delay:0.9s; }
header nav .depth2 .arrow > a::after{ content:""; display:inline-block; width:10px; height:7px; background: url("/img/svg/header_arrow.svg") no-repeat center center / contain; vertical-align:middle;	margin-left:10px; transform:translateY(-2px); transition:transform 0.4s; }
header nav .depth2 .arrow.ov > a::after{ transform:rotate(180deg); background: url("/img/svg/header_arrow_on.svg") no-repeat center center / contain; }
header nav .depth3 { transition:max-height 0.8s ease, opacity 0.5s ease; position:relative; padding-bottom:10px; }
header nav .depth3 > li > a { opacity:1; font-size:1.55rem; font-weight:400; color:#888; padding:5px 0; }
header nav .depth3 > li { opacity:1; }
header .menu-button { width:52px; height:52px; position:relative; display:flex; flex-direction:column; row-gap:5px; column-gap:0; align-items:center; justify-content:center; }
header .menu-button::before { content:""; display:block; background:url("/img/common/bg_menu.png") no-repeat center/100%; z-index:-1; width:100%; height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
header .menu-button span { display:block; width:19px; height:2px; background:var(--color-white); border-radius:0; }
header .menu-button span:nth-child(2) { display:none; }
header.menu-on .menu-button,
header.menu-on .site-map { z-index:4; }
header.menu-on .menu-button { row-gap:0; }
header.menu-on .menu-button span:nth-child(1) { transform:translate(0, 1px) rotate(-45deg); }
header.menu-on .menu-button span:nth-child(2) { display:none; }
header.menu-on .menu-button span:nth-child(3) { transform:translate(0, -1px) rotate(45deg); transition-delay:0s; }
header.color-black .logo .logo-text,
header.active .logo .logo-text { fill:var(--color-brown); }
header.color-black nav a,
header.active nav a { color:#333; }
header.color-white .symbol-orange,
header.color-white .symbol-mint { fill:var(--color-white); }

.site-map { width:100%; max-width:100%; padding:0 3%; display:none; position:absolute; top:100%; left:0; }
.site-map .inner { width:100%; background:var(--color-white); border-radius:0; padding:95px 60px 220px; transform:translateY(-20px); transition:all 0.6s; }
.site-map a { display:inline-block; transition:all 0.6s; opacity:0; }
.site-map .depth1 { display:flex; justify-content:center; text-align:center; }
.site-map .depth1 > li { position:relative; padding:0 0 10px; width:calc(100% / 5); }
.site-map .depth1 > li::before { content:""; display:block; width:1px; height:0; position:absolute; top:0; left:0; background:#dfdfdf; transition:height 0.6s; }
.site-map .depth1 > li:first-child::before { display:none;  }
.site-map .depth1 > li > a { color:#111; font-size:2.5rem; font-weight:600; transform:translateY(-40px); }
.site-map .depth2 { margin:50px 0 0; }
.site-map .depth2 > li:not(:last-child) { margin-bottom:25px; }
.site-map .depth2 > li { transform:translateY(40px); transition:all 0.6s; opacity:0;  }
.site-map .depth2 > li > a { color:#333; font-size:1.8rem; font-weight:300; }
.site-map .depth2 > li:hover > a { color:var(--color-mint); }
.site-map .depth3 { margin-top:10px; }
.site-map .depth3 > li:not(:last-child) { margin-bottom:5px; }
.site-map .depth3 > li > a { font-size:1.7rem; font-weight:400; color:#888; padding:5px 0; }
.site-map .sim { width:47%; opacity:0; transition:all 0.6s; position:absolute; top:auto; left:auto; right:53px; bottom:0; }
.site-map.on .inner { transform:translateY(0); }
.site-map.on a { opacity:1; }
.site-map.on .depth1 > li::before { height:100%; }
.site-map.on .depth1 > li > a { transform:translateY(0); }
.site-map.on .depth2 > li:nth-child(1) { transition-delay:0.16s; }
.site-map.on .depth2 > li:nth-child(2) { transition-delay:0.32s; }
.site-map.on .depth2 > li:nth-child(3) { transition-delay:0.48s; }
.site-map.on .depth2 > li:nth-child(4) { transition-delay:0.64s; }
.site-map.on .depth2 > li:nth-child(5) { transition-delay:0.8s; }
.site-map.on .depth2 > li:nth-child(6) { transition-delay:0.96s; }
.site-map.on .depth2 > li:nth-child(7) { transition-delay:1.12s; }
.site-map.on .depth2 > li:nth-child(8) { transition-delay:1.28s; }
.site-map.on .depth2 > li:nth-child(9) { transition-delay:1.34s; }
.site-map.on .depth2 > li { transform:translateY(0); opacity:1; }
.site-map.on .sim { opacity:0.1; }

.quick-box { position:fixed; right:40px; bottom:40px; z-index:2; }
.quick-box .flex-column { display:flex; flex-direction:column; row-gap:10px; column-gap:0; align-items:flex-end; justify-content:flex-end; }
.quick-box .call,
.quick-box .top-button { width:54px; height:54px; border-radius:50px; position:relative; }
.quick-box .call::before,
.quick-box .top-button::before { content:""; display:block; border-radius:50px; box-shadow:0 4px 12px rgba(0, 0, 0, 0.15); z-index:-1; width:100%; height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
.quick-box .call,
.quick-box .inner { display:flex; flex-direction:row; row-gap:0; column-gap:0; align-items:center; justify-content:flex-end; }
.quick-box .call { background:var(--color-mint); position:relative; overflow:hidden; transition:all 0.4s; }
.quick-box .inner { width:204px; column-gap:10px; position:absolute; }
.quick-box .inner dl { width:128px; opacity:0; transition:all 0.4s; }
.quick-box .inner dl * { color:var(--color-white); }
.quick-box .inner dl dt { font-size:1.5rem; font-weight:500; margin-bottom:2px; }
.quick-box .inner dl dd { font-size:1.8rem; font-weight:700; }
.quick-box .icon { display:inline-flex; align-items:center; padding-right:12px; }
.quick-box .call:hover { width:204px; }
.quick-box .call:hover dl { opacity:1; transition:all 0.4s 0.2s; }
.quick-box .top-button { transition:all 0.4s; background:var(--color-mint); display:flex; flex-direction:row; row-gap:0; column-gap:0; align-items:center; justify-content:center; }
.quick-box .top-button img { transition:all 0.4s; filter:brightness(0) invert(1); }
.fp-viewing-2 .quick-box .top-button { background:#fff; }
.fp-viewing-2 .quick-box .top-button img {filter:brightness(1) invert(0); }

footer { background:#111; padding:100px 0; }
footer .footer-box { display:flex; justify-content:space-between; }
footer .text-box p { color:#A8A4A4; font-size:1.4rem; font-weight:300; }
footer hr { width:1px; height:10px; background:rgba(255, 255, 255, 0.2); }
footer .logo { display:block; width:208px; }
footer .info div,
footer .policy-link { display:flex; flex-direction:row; row-gap:0; column-gap:15px; align-items:center; justify-content:flex-start; }
footer .info { margin:50px 0; }
footer .info dt { color:var(--color-white); font-weight:600; margin:0 0 20px; font-size:1.7rem; display:flex; flex-wrap:wrap; align-items:center; gap:5px 21px }
footer .info dt span { position:relative; display:inline-block; }
footer .info dt span:before { content:""; display:block; width:1px; height:15px; position:absolute; top:50%; left:-10px; transform:translateY(-50%); background:#fff; t}
footer .info dt span:first-child::before { display:none;  }
footer .info div { margin:15px 0 0; }
footer .policy-link { margin:0 0 15px; }
footer .policy-link a { color:var(--color-white); font-size:1.4rem; font-weight:600; }
footer .link-box { display:flex; flex-direction:flex-end; row-gap:0; column-gap:0; align-items:flex-end; justify-content:space-between; }
footer .link { display:flex; flex-direction:row; row-gap:0; column-gap:10px; align-items:center; justify-content:flex-end; }
footer .link a { width:200px; height:50px; background:rgba(255, 255, 255, 0.1); border-radius:5px; display:flex; flex-direction:row; row-gap:0; column-gap:5px; align-items:center; justify-content:center; }
footer .link a * { color:var(--color-white); }
footer .link a span { font-size:1.5rem; }
footer .family { display:flex; gap:5px; }
footer .family .f-box {  width:200px; position:relative;}
footer .family .sns { flex-shrink:0; }
footer .family * { color:var(--color-white); }
footer .family button,
footer .family button i { transition:all 0.6s; }
footer .family button { width:100%; height:55px; background:rgba(255, 255, 255, 0.1); border-radius:5px; padding:0 20px; display:flex; flex-direction:row; row-gap:0; column-gap:0; align-items:center; justify-content:space-between; }
footer .family button span { font-size:1.5rem; }
footer .family button i { font-size:1.8rem; }
footer .family .f-box ul { width:100%; background:#484848; border-radius:5px 5px 0 0; padding:15px 20px; display:none; position:absolute; top:auto; left:0; right:0; bottom:100%; }
footer .family .f-box ul li a { display:block; font-size:1.5rem; font-weight:300; line-height:1.3; padding:5px 0; }
footer .family.on button { border-radius:0 0 5px 5px; }
footer .family.on button i { transform:rotateX(180deg); }