@charset "utf-8";

@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css");

* {margin: 0; padding: 0; box-sizing: border-box; }
html {scroll-behavior: smooth; }
body {font-family: "Pretendard", sans-serif; color: #111; line-height: 1.5; background: #fff; font-weight: 400; }
a {text-decoration: none; color: inherit; }
img {max-width: 100%; display: block; }
button, input, textarea {font-family: "Pretendard", sans-serif; }
.inner {width: 1180px; max-width: calc(100% - 40px); margin: 0 auto; }
.section {padding: 110px 0; }
.sec-label {font-size: 13px; font-weight: 700; color: #00a8e8; letter-spacing: 0.06em; margin-bottom: 12px; }
.sec-title {font-size: 38px; line-height: 1.25; color: #0b2f63; font-weight: 700; letter-spacing: -0.045em; }
.sec-desc {margin-top: 20px; font-size: 17px; color: #555; line-height: 1.8; font-weight: 400; }

/* Header */
.header {position: absolute; top: 0; left: 0; z-index: 100; width: 100%; height: 76px; color: #fff; }
.header .inner {height: 100%; display: flex; align-items: center; justify-content: space-between; }
.logo {display: flex; align-items: center; gap: 8px; font-size: 26px; font-weight: 700; letter-spacing: -0.03em; }
.logo-mark {width: 22px; height: 22px; border-radius: 50%; background: #fff; position: relative; flex-shrink: 0; }
.logo-mark::after {content: ""; position: absolute; width: 8px; height: 12px; border-radius: 8px 8px 8px 0; background: #123e73; left: 7px; top: 5px; transform: rotate(-25deg); }
.nav {height: 100%; display: flex; align-items: center; font-size: 15px; font-weight: 600; }
.gnb {height: 100%; display: flex; align-items: center; gap: 46px; list-style: none; }
.gnb > li {position: relative; height: 100%; display: flex; align-items: center; }
.gnb > li > a {height: 100%; display: flex; align-items: center; color: #fff; transition: color 0.2s ease; }
.gnb > li:hover > a {color: #00c9f0; }
.depth2 {position: absolute; top: 76px; left: 50%; transform: translateX(-50%) translateY(10px); min-width: 150px; padding: 12px 0; background: rgba(255,255,255,0.96); border-radius: 4px; box-shadow: 0 12px 28px rgba(0,0,0,0.18); list-style: none; opacity: 0; visibility: hidden; transition: all 0.25s ease; }
.depth2 li a {display: block; padding: 10px 18px; color: #163761; font-size: 14px; font-weight: 600; white-space: nowrap; transition: background 0.2s ease, color 0.2s ease; }
.depth2 li a:hover {background: #f1f6fb; color: #00a8e8; }
.depth2.product-depth {min-width: 310px; }
.depth2.product-depth li a {padding: 9px 20px; font-size: 14px; }
.contact-quick {display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 32px; }
.contact-card {padding: 20px 22px; border: 1px solid #e2e8f0; background: #fff; border-radius: 6px; box-shadow: 0 8px 20px rgba(15,35,60,0.06); }
.contact-card strong {display: block; margin-bottom: 7px; color: #0b2f63; font-size: 15px; font-weight: 700; }
.contact-card span, .contact-card a {display: block; color: #333; font-size: 16px; font-weight: 500; line-height: 1.5; }
.contact-card a:hover {color: #00a8e8; }
.gnb > li:hover .depth2 {opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }

/* Language */
.lang {position: relative; z-index: 20; }
.lang-current {min-width: 62px; height: 30px; padding: 0 10px; border: 1px solid rgba(255,255,255,0.5); border-radius: 3px; background: transparent; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; }
.lang-current span {margin-left: 4px; font-size: 10px; }
.lang-list {display: none; position: absolute; top: 38px; right: 0; width: 72px; padding: 6px 0; border-radius: 4px; background: #fff; box-shadow: 0 8px 20px rgba(0,0,0,0.18); list-style: none; }
.lang-list li a {display: block; padding: 8px 12px; color: #12345c; font-size: 13px; font-weight: 600; }
.lang-list li a:hover {background: #f1f5f9; color: #00a8e8; }
.lang.active .lang-list {display: block; }

/* Hero */
.hero {height: 100vh; min-height: 720px; color: #fff; position: relative; overflow: hidden; background: #061f3d url("img/main_bg.jpg") center/cover no-repeat; }
.hero-video {position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; filter: contrast(1.08) saturate(1.08) brightness(1.03); transform: scale(1.01); }
.hero::before {content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(rgba(6,41,80,0.48), rgba(4,30,57,0.55)); pointer-events: none; }
.hero .inner {position: relative; z-index: 2; height: 100%; display: flex; align-items: center; }
.hero-text {max-width: 760px; padding-top: 50px; }
.hero .inner {height: 100%; display: flex; align-items: center; }
.hero-text {max-width: 760px; padding-top: 50px; }
.hero-label {font-size: 17px; font-weight: 700; color: rgba(255,255,255,0.8); letter-spacing: 0.14em; margin-bottom: 20px; }
.hero h1 {font-size: 70px; line-height: 1.12; letter-spacing: -0.06em; font-weight: 700; }
.hero p {margin-top: 30px; font-size: 19px; color: rgba(255,255,255,0.86); line-height: 1.75; font-weight: 400; }
.btn {display: inline-flex; align-items: center; justify-content: center; min-width: 152px; height: 48px; margin-top: 36px; background: #00b6df; color: #fff; border-radius: 2px; font-size: 15px; font-weight: 700; transition: background 0.2s ease, transform 0.2s ease; }
.btn:hover {background: #00a3c9; transform: translateY(-2px); }

/* Floating Contact Button */
.chat-btn {position: fixed; right: 38px; bottom: 38px; z-index: 50; display: flex; align-items: center; gap: 9px; background: #fff; color: #163761; border-radius: 50px; padding: 13px 20px; box-shadow: 0 8px 24px rgba(0,0,0,0.18); font-size: 14px; font-weight: 700; }

/* About */
.about-wrap {display: grid; grid-template-columns: 1fr 500px; align-items: center; gap: 70px; }
.about-photo {height: 310px; border-radius: 6px; overflow: hidden; box-shadow: 0 18px 35px rgba(0,0,0,0.15); background: url("/img/about.jpg") center/cover no-repeat; }
.about-badges {display: flex; gap: 12px; margin-top: 30px; flex-wrap: wrap; }
.badge {display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 20px; border: 1px solid #e4e9ef; border-radius: 4px; font-size: 15px; color: #193b65; font-weight: 600; background: #fff; }
.badge span {display: inline-flex; align-items: center; justify-content: center; font-size: 18px; }

/* Business */
.business {background: #f4f6f8; text-align: center; }
.business .sec-desc {max-width: 660px; margin-left: auto; margin-right: auto; }
.business-cards {display: flex; gap: 18px; margin-top: 52px; height: 480px; width: 100%; }
.business-card {flex: 1 1 0; min-width: 0; height: 100%; border-radius: 8px; overflow: hidden; position: relative; text-align: center; color: #fff; background-position: center; background-size: cover; background-repeat: no-repeat; box-shadow: 0 18px 35px rgba(15,35,60,0.14); transition: flex 0.45s ease, box-shadow 0.45s ease; cursor: pointer; }
.business-card:nth-child(1) {background-image: url("/img/business01.jpg"); }
.business-card:nth-child(2) {background-image: url("/img/business02.jpg"); }
.business-card:nth-child(3) {background-image: url("/img/business03.jpg"); }
.business-card::before {content: ""; position: absolute; inset: 0; background: rgba(8,20,36,0.55); transition: background 0.45s ease; z-index: 1; }
.business-card-content {position: absolute; left: 50%; top: 50%; z-index: 2; width: 100%; padding: 0 28px; text-align: center; transform: translate(-50%, -50%); transition: all 0.45s ease; }
.business-card small {display: block; font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.95); margin-bottom: 12px; opacity: 0; transform: translateY(10px); transition: all 0.35s ease; }
.business-card h3 {font-size: 28px; line-height: 1.25; font-weight: 700; letter-spacing: -0.045em; white-space: nowrap; transition: font-size 0.45s ease; }
.business-card p {margin-top: 14px; font-size: 16px; color: rgba(255,255,255,0.9); font-weight: 400; opacity: 0; transform: translateY(10px); transition: all 0.35s ease; }
.business-cards.is-active .business-card {flex: 0.82; }
.business-cards.is-active .business-card.active {flex: 1.85; box-shadow: 0 24px 45px rgba(15,35,60,0.22); }
.business-cards.is-active .business-card.active::before {background: rgba(8,20,36,0.25); }
.business-cards.is-active .business-card.active small {opacity: 1; transform: translateY(0); }
.business-cards.is-active .business-card.active p {opacity: 1; transform: translateY(0); }
.business-cards.is-active .business-card.active h3 {font-size: 36px; }

/* Products */
.products {text-align: center; }
.product-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 46px; }
.product-card {height: 300px; border-radius: 5px; overflow: hidden; position: relative; background: linear-gradient(135deg, #17396d, #5a77a1); color: #fff; text-align: left; padding: 26px; box-shadow: 0 12px 24px rgba(15,35,60,0.12); transition: transform 0.35s ease, box-shadow 0.35s ease, background 0.35s ease; cursor: pointer; }
.product-card::before {content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255,255,255,0.12), rgba(255,255,255,0)); opacity: 0; transition: opacity 0.35s ease; z-index: 1; }
.product-card::after {content: ""; position: absolute; top: -40%; left: -80%; width: 60%; height: 180%; background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.18), rgba(255,255,255,0)); transform: rotate(18deg); transition: left 0.6s ease; z-index: 2; pointer-events: none; }
.product-card h3 {position: relative; z-index: 3; font-size: 22px; line-height: 1.15; font-weight: 700; text-transform: uppercase; letter-spacing: -0.03em; }
.product-card h3::after {content: ""; display: block; width: 0; height: 2px; margin-top: 12px; background: #00c9f0; transition: width 0.35s ease; }
.product-card p {position: relative; z-index: 3; margin-top: 9px; font-size: 15px; color: rgba(255,255,255,0.85); font-weight: 400; }
.product-card img {position: absolute; right: 10px; bottom: 0; z-index: 2; max-height: 220px; object-fit: contain; transition: transform 0.45s ease; }
.product-card:hover {transform: translateY(-8px); box-shadow: 0 22px 38px rgba(15,35,60,0.22); background: linear-gradient(135deg, #1d477e, #6685ad); }
.product-card:hover::before {opacity: 1; }
.product-card:hover::after {left: 120%; }
.product-card:hover h3::after {width: 34px; }
.product-card:hover img {transform: scale(1.07) translateY(-4px); }

/* Technology */
.tech {color: #fff; background: url("/img/tech_bg.jpg") center/cover no-repeat; }
.tech-wrap {display: grid; grid-template-columns: 1fr 560px; gap: 70px; align-items: center; }
.tech .sec-title {color: #fff; }
.tech .sec-desc {color: rgba(255,255,255,0.78); }
.tech-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.tech-item {min-height: 140px; padding: 28px; border-radius: 5px; background: rgba(255,255,255,0.13); backdrop-filter: blur(4px); }
.tech-item .num {font-size: 19px; color: rgba(255,255,255,0.55); font-weight: 600; }
.tech-item h3 {margin-top: 5px; font-size: 27px; font-weight: 700; letter-spacing: -0.045em; }
.tech-item p {margin-top: 9px; font-size: 15px; color: rgba(255,255,255,0.72); font-weight: 400; }

/* Partners */
.partners {text-align: center; background: #f6f7f9; }
.partner-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; max-width: 940px; margin: 48px auto 0; }
.partner-logo {height: 74px; border-radius: 6px; background: #fff; border: 1px solid #edf0f3; display: flex; align-items: center; justify-content: center; padding: 15px; font-size: 18px; font-weight: 700; color: #1b4e85; }
.partner-logo:nth-child(4) {color: #58a044; }
.partner-logo:nth-child(8) {color: #b51f24; }

/* Contact */
#contact {position: relative; padding: 110px 0; background: #071b35; overflow: hidden; }
#contact::before {content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,27,53,0.78) 0%, rgba(7,27,53,0.55) 42%, rgba(7,27,53,0.18) 100%), url("/img/contact_bg.jpg") center/cover no-repeat; z-index: 0; }
#contact::after {content: ""; position: absolute; inset: 0; background: rgba(3,15,30,0.12); z-index: 1; pointer-events: none; }
.contact-bg-wrap {position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 520px; gap: 70px; align-items: center; min-height: 620px; }
.contact-copy {color: #fff; max-width: 560px; }
.contact-copy .sec-label {color: #38c7ff; margin-bottom: 16px; }
.contact-copy h2 {font-size: 58px; line-height: 1.12; font-weight: 800; letter-spacing: -0.06em; }
.contact-copy p {margin-top: 24px; font-size: 18px; line-height: 1.85; color: rgba(255,255,255,0.82); font-weight: 400; }
.contact-direct {margin-top: 42px; display: grid; gap: 16px; }
.contact-direct-row {display: flex; align-items: center; gap: 18px; padding: 0 0 15px; border-bottom: 1px solid rgba(255,255,255,0.22); }
.contact-direct-row strong {width: 86px; flex-shrink: 0; font-size: 14px; color: rgba(255,255,255,0.62); font-weight: 700; }
.contact-direct-row span, .contact-direct-row a {font-size: 18px; color: #fff; font-weight: 600; line-height: 1.5; }
.contact-direct-row a:hover {color: #38c7ff; }
.contact-form-card {background: rgba(255,255,255,0.96); border-radius: 18px; padding: 38px; box-shadow: 0 24px 60px rgba(0,0,0,0.26); backdrop-filter: blur(8px); }
.contact-form-card h3 {font-size: 32px; color: #0b2f63; font-weight: 800; letter-spacing: -0.045em; }
.contact-form-card p {margin-top: 10px; margin-bottom: 26px; font-size: 15px; color: #666; line-height: 1.7; }
.contact-form-row {margin-bottom: 16px; }
.contact-form-row label {display: block; margin-bottom: 8px; font-size: 14px; color: #222; font-weight: 700; }
.contact-form-row input, .contact-form-row textarea {width: 100%; height: 50px; border: 1px solid #dce3eb; border-radius: 10px; background: #fff; padding: 0 15px; font-size: 15px; color: #111; outline: none; transition: border-color 0.2s ease, box-shadow 0.2s ease; }
.contact-form-row textarea {height: 150px; padding: 15px; resize: none; line-height: 1.7; }
.contact-form-row input:focus, .contact-form-row textarea:focus {border-color: #0d3470; box-shadow: 0 0 0 4px rgba(13,52,112,0.08); }
.contact-submit-btn {width: 100%; height: 56px; margin-top: 6px; border: 0; border-radius: 10px; background: #0d3470; color: #fff; font-size: 17px; font-weight: 800; cursor: pointer; transition: background 0.2s ease, transform 0.2s ease; }
.contact-submit-btn:hover {background: #092a5a; transform: translateY(-2px); }

/* Footer */
.footer {background: #111b29; color: rgba(255,255,255,0.65); padding: 58px 0 42px;  }
.footer .logo {color: #fff; margin-bottom: 18px; }
.footer-info {font-size: 13px; line-height: 1.9; font-weight: 300; }
.copy {margin-top: 35px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,0.08); text-align: center; font-size: 12px; color: rgba(255,255,255,0.35); font-weight: 300; }
.partners {padding: 110px 0; background: #fff; }
.partners .sec-label {text-align: center; }
.partners .sec-title {text-align: center; }
.partners .sec-desc {max-width: 680px; margin: 20px auto 0; text-align: center; }
.partner-wall {margin-top: 52px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.partner-item {height: 110px; background: #fff; border: 1px solid #e8edf3; border-radius: 14px; display: flex; align-items: center; justify-content: center; padding: 12px 18px; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; box-shadow: 0 8px 24px rgba(15,35,60,0.04); }
.partner-item img {max-width: 100%; max-height: 68px; width: auto; height: auto; object-fit: contain; filter: none; opacity: 1; transition: transform 0.25s ease; }
.partner-item:hover {transform: translateY(-4px); border-color: #d7e4f2; box-shadow: 0 18px 35px rgba(15,35,60,0.10); }
.partner-item:hover img {transform: scale(1.03); }

#contact {padding: 110px 0; background: linear-gradient(180deg, #f7f9fc 0%, #eef3f8 100%); }
.contact-section {display: grid; grid-template-columns: 420px 1fr; gap: 32px; align-items: start; }
.contact-form-wrap {background: #fff; border-radius: 20px; padding: 40px; box-shadow: 0 18px 40px rgba(15,35,60,0.08); border: 1px solid #e7edf4; align-self: start; }

.contact-mini {margin-top: 34px; display: flex; flex-direction: column; gap: 0; border-top: 1px solid rgba(255,255,255,0.16); }
.contact-mini-item {display: flex; align-items: flex-start; gap: 18px; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,0.16); }
.contact-mini-item strong {display: block; min-width: 82px; margin: 0; font-size: 14px; color: rgba(255,255,255,0.72); font-weight: 600; line-height: 1.6; }
.contact-value {flex: 1; font-size: 18px; color: #fff; font-weight: 600; line-height: 1.6; word-break: keep-all; }
.contact-value a {color: #fff; }
.contact-value a:hover {text-decoration: underline; }

.contact-note {margin-top: 22px; font-size: 14px; color: rgba(255,255,255,0.70); line-height: 1.7; }
.contact-side {background: linear-gradient(135deg, #0d3470, #123f86); color: #fff; border-radius: 20px; padding: 42px; box-shadow: 0 18px 40px rgba(13,52,112,0.18); }
.contact-side .sec-label {color: rgba(255,255,255,0.7); margin-bottom: 14px; }
.contact-side h2 {font-size: 42px; line-height: 1.25; font-weight: 700; letter-spacing: -0.045em; }
.contact-side p {margin-top: 22px; font-size: 17px; line-height: 1.8; color: rgba(255,255,255,0.82); }
.contact-mini {margin-top: 34px; display: flex; flex-direction: column; gap: 14px; }
.contact-mini-item {padding: 18px 20px; border-radius: 12px; background: rgba(255,255,255,0.09); border: 1px solid rgba(255,255,255,0.12); }
.contact-mini-item strong {display: block; margin-bottom: 6px; font-size: 14px; color: rgba(255,255,255,0.72); font-weight: 600; }
.contact-mini-item span, .contact-mini-item a {font-size: 18px; color: #fff; font-weight: 600; line-height: 1.5; }
.contact-mini-item a:hover {text-decoration: underline; }
.contact-note {margin-top: 24px; font-size: 14px; color: rgba(255,255,255,0.68); line-height: 1.7; }

.contact-form-wrap {background: #fff; border-radius: 20px; padding: 40px; box-shadow: 0 18px 40px rgba(15,35,60,0.08); border: 1px solid #e7edf4; }
.contact-form-head {margin-bottom: 26px; }
.contact-form-head h3 {font-size: 30px; color: #0b2f63; font-weight: 700; letter-spacing: -0.04em; }
.contact-form-head p {margin-top: 10px; font-size: 16px; color: #667085; line-height: 1.7; }
.form-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.form-row {margin-bottom: 16px; }
.form-row.full {grid-column: 1 / -1; }
.form-row label {display: block; margin-bottom: 8px; font-size: 15px; color: #1f2937; font-weight: 600; }
.form-row input, .form-row textarea {width: 100%; border: 1px solid #d9e2ec; border-radius: 10px; background: #fff; height: 52px; padding: 0 16px; font-size: 15px; color: #111; outline: none; transition: border-color 0.2s ease, box-shadow 0.2s ease; }
.form-row textarea {height: 170px; padding: 16px; resize: none; line-height: 1.7; }
.form-row input:focus, .form-row textarea:focus {border-color: #0d3470; box-shadow: 0 0 0 4px rgba(13,52,112,0.08); }
.submit-btn {width: 100%; height: 58px; border: 0; border-radius: 12px; background: #0d3470; color: #fff; font-size: 18px; font-weight: 700; cursor: pointer; transition: background 0.2s ease, transform 0.2s ease; }
.submit-btn:hover {background: #0a2b5d; transform: translateY(-2px); }

.kocean-sub{width:100%; overflow:hidden; color:#111; font-family:'Pretendard','Noto Sans KR',sans-serif;}
.kocean-inner{width:min(1280px,calc(100% - 80px)); margin:0 auto;}
.kocean-sub-visual{position:relative; min-height:380px; padding:130px 0 64px; display:flex; align-items:flex-start; color:#fff; background-size:cover; background-position:center; overflow:hidden;}
.kocean-sub-visual:before{content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,24,50,.72),rgba(0,67,116,.38),rgba(0,0,0,.18));}
.kocean-sub-visual .kocean-inner{position:relative; z-index:2;}
.kocean-sub-eyebrow{margin:0 0 16px; font-size:16px; font-weight:500; opacity:.9;}
.kocean-sub-visual h2{margin:0; padding-bottom:22px; font-size:54px; line-height:1.05; font-weight:500; letter-spacing:-.04em; border-bottom:1px solid rgba(255,255,255,.45);}
.kocean-sub-desc{margin:18px 0 30px; font-size:20px; line-height:1.5; font-weight:400; opacity:.95;}
.kocean-sub-tab{display:flex; flex-wrap:wrap; gap:10px; margin:0; padding:0; list-style:none;}
.kocean-sub-tab li a{display:block; min-width:94px; padding:11px 20px; border-radius:999px; background:rgba(255,255,255,.22); color:#fff; font-size:14px; text-align:center; text-decoration:none; backdrop-filter:blur(8px); transition:.25s;}
.kocean-sub-tab li.active a{background:#003b7a; color:#fff;}
.kocean-sub-tab li a:hover{background:#003b7a;}
.kocean-about-sec{padding:95px 0 100px; background:#fff;}
.kocean-sec-head{margin-bottom:70px;}
.kocean-sec-head span{display:block; margin-bottom:12px; color:#1677d2; font-size:14px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;}
.kocean-sec-head h3{margin:0; font-size:30px; font-weight:700; letter-spacing:-.04em;}
.kocean-about-intro{display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;}
.kocean-about-kicker{margin:0 0 18px; color:#1677d2; font-size:15px; font-weight:800; letter-spacing:.08em;}
.kocean-about-text h4{margin:0 0 32px; font-size:42px; line-height:1.24; font-weight:800; letter-spacing:-.055em;}
.kocean-about-text p{margin:0 0 16px; color:#5c6670; font-size:16px; line-height:1.85; word-break:keep-all;}
.kocean-about-photo{position:relative; border-radius:16px; overflow:hidden; box-shadow:0 24px 70px rgba(0,33,80,.16);}
.kocean-about-photo:after{content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.35); border-radius:16px; pointer-events:none;}
.kocean-about-photo img{display:block; width:100%; height:430px; object-fit:cover;}
.kocean-info-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:0 40px; margin-top:95px; border-top:1px solid #e8edf3;}
.kocean-info-item{display:grid; grid-template-columns:150px 1fr; align-items:center; min-height:74px; border-bottom:1px solid #e8edf3;}
.kocean-info-item span{position:relative; padding-left:24px; color:#1677d2; font-size:14px; font-weight:800;}
.kocean-info-item span:before{content:""; position:absolute; left:0; top:50%; width:8px; height:8px; margin-top:-4px; border-radius:50%; background:#1677d2;}
.kocean-info-item strong{color:#333; font-size:15px; font-weight:500;}
.kocean-merit-sec{position:relative; min-height:650px; padding:115px 0 70px; color:#fff; background-size:cover; background-position:center; overflow:hidden;}
.kocean-about-merit{background-image:url("/img/about_merit_bg.jpg");}
.kocean-merit-dim{position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,30,60,.25),rgba(0,20,40,.74));}
.kocean-merit-sec .kocean-inner{position:relative; z-index:2;}
.kocean-merit-title span{display:block; margin-bottom:14px; color:#6bd3ff; font-size:14px; font-weight:800; letter-spacing:.08em;}
.kocean-merit-title h3{margin:0; font-size:42px; line-height:1.25; font-weight:800; letter-spacing:-.055em;}
.kocean-merit-list{display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:115px;}
.kocean-merit-card{min-height:220px; padding:30px 28px; border:1px solid rgba(255,255,255,.35); border-radius:14px; background:rgba(255,255,255,.13); backdrop-filter:blur(12px); box-shadow:0 18px 45px rgba(0,0,0,.14);}
.kocean-merit-card em{display:inline-flex; align-items:center; height:28px; padding:0 14px; border-radius:999px; background:rgba(255,255,255,.72); color:#003b7a; font-size:11px; font-style:normal; font-weight:800;}
.kocean-merit-card h4{margin:28px 0 28px; font-size:21px; line-height:1.35; font-weight:800; letter-spacing:-.04em;}
.kocean-merit-card p{margin:0; color:rgba(255,255,255,.86); font-size:15px; line-height:1.75; word-break:keep-all;}

.kocean-location-sec{padding:95px 0 110px; background:#fff;}
.kocean-location-wrap{position:relative;}
.kocean-map-box{position:relative; min-height:520px; border-radius:18px; overflow:hidden; background:#eef3f8; box-shadow:0 24px 70px rgba(0,33,80,.10);}
.kocean-map-box iframe{display:block; width:100%; height:520px; border:0;}
.kocean-map-card{position:absolute; left:0; top:0; bottom:auto; width:325px; min-height:178px; padding:34px 34px 30px; background:#0d5ead; color:#fff; box-shadow:0 18px 40px rgba(0,39,90,.22); z-index:3; border-radius:18px 0 14px 0; display:flex; flex-direction:column; justify-content:center;}
.kocean-map-card span{display:block; margin-bottom:15px; font-size:13px; line-height:1; font-weight:700; opacity:.9;}
.kocean-map-card h4{margin:0 0 10px; font-size:30px; line-height:1.28; font-weight:800; letter-spacing:-.055em;}
.kocean-map-card p{margin:0; font-size:15px; line-height:1.4; color:rgba(255,255,255,.78); font-weight:600;}
.kocean-location-info{display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:34px; border-top:1px solid #e8edf3; border-bottom:1px solid #e8edf3;}
.kocean-location-item{position:relative; min-height:86px; padding:24px 24px 22px 48px; border-right:1px solid #e8edf3;}
.kocean-location-item:last-child{border-right:0;}
.kocean-location-item:before{content:""; position:absolute; left:24px; top:31px; width:8px; height:8px; border-radius:50%; background:#1677d2;}
.kocean-location-item span{display:block; margin-bottom:8px; color:#1677d2; font-size:14px; font-weight:800;}
.kocean-location-item strong{display:block; color:#333; font-size:15px; line-height:1.6; font-weight:600; word-break:keep-all;}
.kocean-location-item a:hover{color:#1677d2;}
.kocean-map-btns{display:flex; justify-content:center; gap:10px; margin-top:34px;}
.kocean-map-btns a{display:inline-flex; align-items:center; justify-content:center; min-width:150px; height:46px; padding:0 22px; border-radius:999px; background:#0d3470; color:#fff; font-size:14px; font-weight:800; transition:.25s;}
.kocean-map-btns a:hover{background:#1677d2; transform:translateY(-2px);}
.kocean-location-panel{display:grid; grid-template-columns:1.25fr 1fr auto; align-items:center; gap:42px; margin-top:34px; padding:34px 38px; border:1px solid #e3eaf2; border-radius:18px; background:#fff; box-shadow:0 18px 50px rgba(15,35,60,.06);}
.kocean-location-main{position:relative; padding-left:24px;}
.kocean-location-main:before{content:""; position:absolute; left:0; top:4px; width:4px; height:72px; border-radius:99px; background:#1677d2;}
.kocean-location-main span{display:block; margin-bottom:10px; color:#1677d2; font-size:13px; font-weight:800; letter-spacing:.08em;}
.kocean-location-main h4{margin:0; color:#111; font-size:22px; line-height:1.45; font-weight:800; letter-spacing:-.04em; word-break:keep-all;}
.kocean-location-main p{margin:10px 0 0; color:#7b8794; font-size:14px; font-weight:500;}
.kocean-location-contact{display:grid; gap:14px;}
.kocean-location-contact dl{display:grid; grid-template-columns:82px 1fr; align-items:center; margin:0;}
.kocean-location-contact dt{color:#7b8794; font-size:14px; font-weight:700;}
.kocean-location-contact dd{margin:0; color:#222; font-size:16px; font-weight:700;}
.kocean-location-contact a:hover{color:#1677d2;}
.kocean-location-links{display:flex; flex-direction:column; gap:10px;}
.kocean-location-links a{display:inline-flex; align-items:center; justify-content:center; min-width:120px; height:44px; padding:0 20px; border-radius:8px; background:#0d3470; color:#fff; font-size:14px; font-weight:800; transition:.25s;}
.kocean-location-links a:hover{background:#1677d2; transform:translateY(-2px);}