/* Photo-led first viewport, based on the supplied Gwangpyeong reference. */
header.nav{
  position:fixed;inset:0 0 auto;width:100%;z-index:50;
  transition:background-color .22s,border-color .22s,box-shadow .22s;
}
.nav .wrap{height:88px}
.nav .brand,.nav .cl-menu a{transition:color .22s}
html.js:not(.gp-scrolled) header.nav{
  background:linear-gradient(180deg,rgba(9,21,26,.38),rgba(9,21,26,.08));
  border-bottom-color:rgba(255,255,255,.2);box-shadow:none;
}
html.js:not(.gp-scrolled) .nav .brand,
html.js:not(.gp-scrolled) .nav .cl-menu a{color:#fff}
html.js:not(.gp-scrolled) .nav .cl-menu a:hover{color:#e1c697}
html.js:not(.gp-scrolled) .nav .cl-menu{border-color:rgba(255,255,255,.17)}
html.js:not(.gp-scrolled) .nav .cta{
  background:#084d5c;color:#fff;border-color:rgba(255,255,255,.24);
}
html.js:not(.gp-scrolled) .nav .cta:hover{background:#fff;color:#084d5c;border-color:#fff}
html.gp-scrolled header.nav{background:#fff;box-shadow:0 2px 16px rgba(11,34,39,.06)}
.hero{
  position:relative;isolation:isolate;display:grid;align-items:center;
  min-height:100vh;min-height:100svh;padding:168px 0 112px;
  background:#273330;overflow:hidden;
}
.hero .hero-visual{
  position:absolute;inset:0;z-index:0;width:100%;max-width:none;
  height:100%;padding:0;margin:0;justify-self:stretch;
}
.hero .hero-visual::before{display:none}
.hero .hero-photo{
  position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;
  aspect-ratio:auto;object-fit:cover;object-position:center 48%;
  background:#273330;border:0;transform:none;
}
.hero::after{
  content:'';display:block;position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(8,20,26,.83) 0%,rgba(8,20,26,.72) 31%,rgba(8,20,26,.3) 63%,rgba(8,20,26,.08) 100%),linear-gradient(0deg,rgba(8,20,26,.24),transparent 38%);
}
.hero .wrap{
  position:relative;z-index:2;display:block;width:100%;max-width:1280px;
  padding:0 48px;color:#fff;
}
.hero .hero-copy{max-width:720px;padding:0}
.hero .hero-copy::before{display:none}
.hero .en{
  display:flex;align-items:center;gap:18px;font-family:'NanumSquareNeo',system-ui,sans-serif;
  font-size:14px;font-weight:500;line-height:1.6;letter-spacing:.12em;
  color:#e9e7e1;text-shadow:0 1px 12px rgba(0,0,0,.12);text-wrap:wrap;
}
.hero .en::after{content:'';display:block;width:72px;height:1px;background:rgba(255,255,255,.58)}
.hero h1{
  max-width:15em;margin-top:23px;font-family:'NanumSquareNeo',system-ui,sans-serif;
  font-size:clamp(34px,3.3vw,50px);font-weight:800;line-height:1.48;letter-spacing:-.06em;
  color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.12);text-wrap:pretty;word-break:keep-all;
}
.hero p{
  max-width:39em;margin-top:25px;font-size:15px;line-height:1.95;letter-spacing:-.025em;
  color:#e9e9e5;opacity:1;text-shadow:0 1px 8px rgba(0,0,0,.25);white-space:pre-line;
}
.hero .cl-float{margin-top:32px}
.hero .cl-float a{
  min-width:154px;min-height:46px;gap:46px;padding:11px 22px;border:1px solid #fff;
  border-radius:100px;background:#fff;color:#153740;font-size:13px;font-weight:700;
}
.hero .cl-float a::after{width:24px;height:7px}
.hero .cl-float a:hover{background:#084d5c;border-color:#084d5c;color:#fff}
/* Decorative baseline only; no inactive slide controls. */
.hero::before{
  content:'';position:absolute;z-index:2;bottom:30px;left:50%;width:40px;height:2px;
  transform:translateX(-50%);background:rgba(255,255,255,.7);pointer-events:none;
}
@media(min-width:1600px){
  .hero h1{font-size:52px}.hero .hero-copy{max-width:750px}
}
@media(max-width:1100px){
  .hero{padding-top:154px;padding-bottom:96px}
  .hero .wrap{padding-inline:36px}.hero .hero-copy{max-width:650px}
  .hero h1{font-size:40px;max-width:15em}.hero p{font-size:14px}
}
@media(max-width:900px){
  .nav .wrap{height:80px}
  .hero{padding-top:148px;padding-bottom:96px}
  .hero .hero-copy{max-width:610px}.hero h1{font-size:38px;max-width:15em}
  .hero .hero-photo{object-position:60% center}
  .hero::after{background:linear-gradient(90deg,rgba(8,20,26,.78),rgba(8,20,26,.55) 60%,rgba(8,20,26,.24)),linear-gradient(0deg,rgba(8,20,26,.16),transparent 45%)}
}
@media(max-width:680px){
  .nav .wrap{height:auto;min-height:106px}
  .hero{min-height:100vh;min-height:100svh;padding:162px 0 82px}
  .hero .wrap{padding:0 24px}.hero .hero-copy{max-width:none}
  .hero .en{font-size:12px;letter-spacing:.08em;gap:14px}.hero .en::after{width:40px}
  .hero h1{font-size:clamp(29px,7.4vw,38px);line-height:1.55;letter-spacing:-.06em;margin-top:22px;max-width:15em}
  .hero p{font-size:13px;line-height:1.95;margin-top:23px;max-width:32em;white-space:normal}
  .hero .hero-photo{object-position:54% center}
  .hero::after{background:linear-gradient(90deg,rgba(8,20,26,.72),rgba(8,20,26,.42)),linear-gradient(0deg,rgba(8,20,26,.42),rgba(8,20,26,.06) 65%)}
  .hero .cl-float{margin-top:28px}.hero .cl-float a{min-width:140px;min-height:45px;padding:10px 20px;font-size:12px}
  .hero::before{bottom:24px;width:32px}
}
@media(max-width:360px){
  .hero .wrap{padding-inline:18px}.hero{padding-top:150px;padding-bottom:72px}
  .hero h1{font-size:27px}.hero p{font-size:12px}
}
@media(max-height:560px) and (min-width:681px){
  .hero{padding-top:130px;padding-bottom:72px}.hero h1{font-size:34px;max-width:20em}
  .hero p{white-space:normal;max-width:46em}.hero .cl-float{margin-top:24px}
}