@charset "utf-8";
/*main vs*/
.main-visual {position:relative; width:100%; height:100vh; overflow:hidden;}
.main-visual .swiper-button-next, .main-visual .swiper-button-prev{color:#ffffff66;}
.main-visual .main-visual-slider {width:100%; height:100%;}
.main-visual .swiper-slide{position:relative;}
.main-visual .swiper-slide:after{display:block; clear:both; content:""; width:100%; height:100%; background:#26262682; position:absolute; top:0; left:0; z-index:1}
.main-visual .visual-list {position:relative; width:100%; height:100%;}
.main-visual .visual-list img,
.main-visual .visual-list .video-wrap iframe {/* width:100%; *//* height:100%; *//* object-fit:cover; */}
.main-visual .visual-list.m2{background:url(/img/main/main_vs02.png) no-repeat center center / cover;}
/* 텍스트 오버레이 */
.main-visual .visual-text {position:absolute; /* top:50%; *//* left:50%; *//* transform:translate(-50%, -50%); */ color:#fff; text-align:center; z-index:2; top:50%; margin-top:-92px; padding:0 10px; width:100%;}
.main-visual .swiper-slide-active .visual-text{animation:mv-up 2.2s ease-in-out}
.main-visual .visual-text .sub-txt {font-size:18px; margin-bottom:15px; font-weight:500;}
.main-visual .visual-text .main-txt {font-size:36px; font-weight:700; margin-bottom:20px; background:url(/img/main/main_text_mo.png) no-repeat; font-size:0px; height:79px; background-size:contain; background-position:center;}
.main-visual .visual-text .desc {font-size:16px; line-height:1.6; font-weight:500; display:none;}
.main-visual-slider iframe{position:absolute; top:50%; left:50%; z-index:1; width:387vw; height:106vw; min-width:100%; min-height:100%; transform:translate(-50%, -50%); pointer-events:none;}
.main-visual .scroll{position:absolute; bottom:35px; z-index:10; display:flex; flex-direction:column; align-items:center; gap:3px; color:#fff; font-weight:500; left:50%; margin-left:-35px; transition:transform .2s ease, background-color .2s ease, border-color .2s ease, opacity .2s; animation:mv-bounce 2.2s ease-in-out infinite;}
@keyframes mv-bounce{0%, 100% { transform:translateY(0);} 50% {transform:translateY(-15px);}}
@keyframes mv-up{0% { opacity:0; transform:translateY(-15px);} 100%{opacity:1; transform:translateY(0px);}}
/* 반응형 */
@media (min-width:768px) {
.main-visual .visual-text .main-txt {/* font-size:48px; */background:url(/img/main/main_text.png) no-repeat; background-position:center; margin-bottom:43px;}
.main-visual .visual-text .desc {font-size:20px; display:block; position:relative; padding-top:40px;}
.main-visual .visual-text .desc:after{display:block; clear:both; content:""; width:56px; height:1.5px; background:#ffffff82; position:absolute; top:0; left:50%; margin-left:-28px;}
.main-visual .visual-text{transform:scale(0.8); margin-top:-165px;}
.main-visual .visual-text .sub-txt{font-size:30px; margin-bottom:20px;}
}
@media (min-width:1200px) {
.main-visual .visual-text .main-txt {/* font-size:60px; */}
.main-visual .visual-text .desc { font-size:20px;}
.main-visual-slider iframe{position:absolute; top:50%; left:50%; z-index:1; width:177vw; height:57vw; min-width:100%; min-height:100%; transform:translate(-50%, -50%); pointer-events:none;}
.main-visual .visual-text{transform:scale(1); margin-top:-129px;}
.main-visual .swiper-button-next{right:100px;}
.main-visual .swiper-button-prev{left:100px;}
.main-visual .scroll{bottom:80px;}
}
/*bs*/
/* wrapper */
.main-business {background:#f6f7f8;}
.main-business .pdinner {padding-top:60px; padding-bottom:60px;}
.main-business .main-business-inner {width:min(1200px, 92%); margin:0 auto;}
.main-business .main-business-head {position:relative; margin-bottom:24px;}
.main-business .main-business-title {font-size:32px; font-weight:800; letter-spacing:-0.02em; color:#151861;}
.main-business .main-business-sub {margin-top:5px; color:#484848; font-weight:700;}
/* nav */
.main-business .main-business-nav {display:flex; gap:12px; margin-top:20px;}
.main-business .main-business-prev,
.main-business .main-business-next {width:44px; height:44px; border-radius:50%; background:#f1f1f1; border:0; cursor:pointer; position:relative;}
.main-business .main-business-prev::before,
.main-business .main-business-next::before {content:""; position:absolute; inset:0; margin:auto; width:10px; height:10px; border-top:2px solid #888; border-right:2px solid #888; transform:rotate(225deg); left:2px;}
.main-business .main-business-next::before {transform:rotate(45deg); left:unset; left:-4px;}
/* slider items */
.main-business .main-business-slider {overflow:hidden;}
.main-business .swiper-slide {height:auto;}
.main-business .main-business-item {display:block; position:relative; overflow:hidden;}
.main-business .main-business-item img {width:100%; height:clamp(200px, 35vw, 320px); object-fit:cover; display:block; transform:scale(1); transition:transform .5s ease;}
.main-business .main-business-item::after {content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0, 0, 0, 0) 55%, rgb(0 0 0 / 68%) 100%); transition:opacity .35s ease; opacity:.9;}
.main-business .main-business-item:hover img {transform:scale(1.05);}
.main-business .main-business-item-txt {position:absolute; left:0px; bottom:14px; z-index:2; color:#fff; display:flex; align-items:flex-end; gap:10px; /* text-shadow:0 2px 6px rgba(0,0,0,.35); */ width:100%; padding-left:20px;}
.main-business .main-business-item-txt .ko {font-size:20px; font-weight:700; margin-right:10px;}
.main-business .main-business-item-txt .en {font-size:15px; font-weight:500;}
/* breakpoints */
@media (min-width:768px) {
.main-business {}
.main-business .main-business-title {font-size:40px;}
.main-business .main-business-item img {height:300px;}
}
@media (min-width:1200px) {
.main-business {
padding-bottom: 100px;
}
.main-business .pdinner{/* display:flex; */flex-wrap:wrap;padding-top:80px;padding-bottom:80px;max-width: 1500px;}
.main-business .main-business-title{font-size:45px;}
.main-business .main-business-sub{font-size:20px;}
.main-business .main-business-head {/* display:grid; */grid-template-columns:360px 1fr;align-items:end;column-gap:32px;width:368px;width: 100%;text-align: center;margin-bottom: 50px;}
.main-business .main-business-slider{width:calc(100% - 368px);width: 100%;}
.main-business .main-business-nav {margin-top:28px;display: none;}
.main-business .main-business-prev, .main-business .main-business-next{width:50px; height:50px;}
.main-business .main-business-item img{height:330px;}
.main-business .main-business-item-txt{display:flex; justify-content:space-between; padding-left:25px; padding-right:25px; padding-bottom:14px;}
.main-business .main-business-item-txt .ko{font-size:24px;}
.main-business .main-business-item-txt .en{font-size:16px; padding-bottom:2px;}
}
@media (min-width:1800px) {
.main-business {
padding-bottom: 0px;
/* padding-top: 30px; */
}
.main-business .main-business-head{
padding-top: 50px;
}
}
.main-stock {background:#151861;color:#fff;width:100%;padding:20px 3%;/* margin:0 0 40px; */}
.main-stock .main-stock-inner{
max-width: 1500px;
margin: 0 auto;
}
.main-stock .main-stock-wrap {display:flex; align-items:flex-start; justify-content:space-between; gap:9px; min-height:64px; flex-direction:column;}
/* left:title */
.main-stock-left { margin-bottom:7px;
border-bottom:1px solid #f6f6f669;
width:100%;
padding-bottom:15px;}
.main-stock .main-stock-title {font-size:18px; font-weight:800; letter-spacing:-0.02em; margin:0;}
.main-stock .main-stock-title .en {font-size:16px; font-weight:600; color:#C9C9C9; margin-left:10px;}
/* center:market/index */
.main-stock .main-stock-center {display:flex;align-items:center;gap:14px;}
.main-stock .main-stock-market {color:#C9C9C9;font-weight:500;}
.main-stock .main-stock-index {font-size:22px;font-weight:700;color:#E22835;}
/* right:company */
.main-stock .main-stock-right { display:flex; align-items:center; gap:14px; }
.main-stock .main-stock-name {color:#C9C9C9;font-weight:500;}
.main-stock .main-stock-price {font-size:22px;font-weight:800;}
/* badge (up/down) */
.main-stock .badge {display:inline-flex; gap:6px; padding:2px 8px 1px; border-radius:999px; font-size:13px; font-weight:800; background:#fff; color:#222; align-items:center;}
.main-stock .main-stock-change--up,
.main-stock .main-stock-delta--up {background:#fff;color:#E22835;}
.main-stock .main-stock-change--down,
.main-stock .main-stock-delta--down {background:#fff;color:#151861;}
/* 반응형 */
@media (min-width:768px) {
.main-stock .main-stock-wrap {min-height:72px;gap:24px;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between; align-items:center; height:100%;}
.main-stock .main-stock-index,
.main-stock .main-stock-price { font-size:28px; }
.main-stock .main-stock-center {}
}
@media (min-width:1200px) {
.main-stock {height:100px;padding:0 40px;/* margin:0 0 60px; */position: absolute;bottom: 0;left: 0;}
.main-stock .main-stock-inner{
padding: 0 20px;
padding-top: 17px;
}
.main-stock .main-stock-title {font-size:24px;}
.main-stock-left {width:40%; border:0px; padding:0px; margin:0px;}
.main-stock .main-stock-index,
.main-stock .main-stock-price {font-size:27px;margin-left:20px;}
.main-stock .main-stock-center {font-size:17px;}
.main-stock .badge {font-size:17px;padding:2px 12px 1px;}
.main-stock .badge i {font-size:0.85em;}
}
/*news*/
/* section */
.main-news .pdinner {padding-top:60px; padding-bottom:60px;}
.main-news .pdinner {}
.main-news .main-news-wrap {/* display:grid; */ gap:32px;}
/* left */
.main-news .main-news-list {background:#F5F6F8; padding:26px; /* border-radius:8px; */margin-bottom:30px;}
.main-news .main-news-title {font-size:28px; font-weight:800; color:#0d1a5f; margin:0; font-size:32px; font-weight:800; letter-spacing:-0.02em; color:#151861;}
.main-news .main-news-sub {/* margin:10px 0 20px; */color:#555; font-weight:600; color:#484848; font-weight:700; margin-top:5px; margin-bottom:20px;}
.main-news .main-news-more {display:inline-block; padding:8px 18px; background:#0d1a5f; color:#fff; font-weight:500; border-radius:20px; font-size:14px; transition:background .3s;}
.main-news .main-news-more:hover {background:#182673;}
.main-news .main-news-links {margin-top:20px; border-top:1px solid #D5D5D5; padding-top:20px;}
.main-news .main-news-links li {display:flex; padding:8px 0; font-size:15px; align-items:center; justify-content:space-between;}
.main-news .main-news-links a {color:#222; font-weight:600; margin-right:8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:calc(100% - 70px); display:block; /* width:100px; */}
.main-news .main-news-links .date {color:#BCBCBC; font-size:14px; width:60px; font-weight:500;}
/* right */
.main-news .main-news-thumbs {display:grid; gap:20px;}
.main-news .main-news-item a {display:block; color:#222;}
.main-news .main-news-item img {width:100%; /* border-radius:6px; */ margin-bottom:12px; aspect-ratio:16/9; object-fit:cover;}
.main-news .main-news-item .tit {font-size:16px; font-weight:700; margin-bottom:4px;}
.main-news .main-news-item .date {font-size:14px; color:#BCBCBC; font-weight:500;}
/* 반응형 */
@media (min-width:768px){
.main-news .main-news-wrap {grid-template-columns:1fr 1fr;}
.main-news .main-news-thumbs {grid-template-columns:1fr 1fr;}
}
@media (min-width: 1200px){
.main-news .pdinner {padding-top:80px;padding-bottom:80px;max-width: 1500px;}
.main-news .main-news-title {font-size:45px;}
.main-news .main-news-sub{font-size:20px;}
.main-news .main-news-wrap{display:flex; gap:50px;}
.main-news .main-news-list{width:calc(50% - 25px); padding:40px; margin-bottom:0px;}
.main-news .main-news-thumbs{width:calc(50% - 25px); gap:33px;}
.main-news .main-news-links a{font-size:20px; width:calc(100% - 80px);}
.main-news .main-news-links .date{font-size:15px; width:75px;}
.main-news .main-news-item .tit{font-size:20px;}
.main-news .main-news-item .date{font-size:15px;}
.main-news-head{position:relative;}
.main-news .main-news-more{font-size:17px; width:140px; height:45px; line-height:45px; padding:0px; border-radius:50px; text-align:center; position:absolute; bottom:0; right:0;}
.main-news .main-news-links{margin-top:38px; padding-top:30px;}
.main-news .main-news-links li{padding:10px 0;}
}
@media (min-width: 1200px){
.main-news .main-news-wrap{
padding-top: 100px;
}
}
/**/
/* section */
.main-cta {position:relative; overflow:hidden; /* background:#1F2033 url(/img/main/main_bottom_bg.png); */background-repeat:no-repeat;}
.main-cta .pdinner {width:min(1200px, 92%); margin:0 auto;}
.main-cta .main-cta-bg {position:absolute; inset:0; z-index:0; /* background:linear-gradient(rgba(13,26,95,.85), rgba(13,26,95,.85)), url(/img/main/main_bottom_bg.png) center/cover no-repeat; */ background-color:#1F2033; background-image:url(/img/main/main_bottom_bg.png);}
/* list */
.main-cta .main-cta-list {position:relative; z-index:1; display:grid; gap:1px; /* 경계선 효과 */ background:rgba(255,255,255,.12); /* 그리드 사이 라인 *//* padding:24px 0; */}
/* item */
.main-cta .main-cta-item {border-bottom:1px solid #ffffff40; background:#15186142;}
.main-cta .main-cta-item:last-child{border:none;}
.main-cta .main-cta-link {display:grid; grid-template-columns:1fr 44px; align-items:center; gap:14px; padding:22px 20px; color:#fff; transition:background .25s ease, transform .2s ease;}
.main-cta .main-cta-link:hover {transform:translateY(-1px);}
.main-cta .main-cta-icon svg {width:32px; height:32px; fill:#ffffff;}
.main-cta .main-cta-text .tit {font-weight:800; font-size:18px; margin:0 0 6px;}
.main-cta .main-cta-text .desc {margin:0; opacity:.9; font-size:14px; line-height:1.5; font-weight:500;}
@media (min-width:768px) {
.main-cta .main-cta-item{border:0px;}
}
/* dividers (세로 라인) — 데스크톱에서만 */
@media (min-width:1200px) {
.main-cta .main-cta-list {grid-template-columns:repeat(4, 1fr); /* padding:36px 0; */}
.main-cta .main-cta-item {position:relative; height:180px; border-right:1px solid #ffffff54; background:none;}
.main-cta .main-cta-item:not(:last-child)::after {/* content:""; *//* position:absolute; */ top:16%; bottom:16%; right:0; width:1px; background:rgba(255,255,255,.18);}
.main-cta .main-cta-link {grid-template-columns:1fr 52px; padding:56px 47px;}
.main-cta .main-cta-link:hover{background:#1518616b;}
.main-cta .main-cta-icon svg {width:36px; height:36px;}
.main-cta .main-cta-text .tit {font-size:24px;}
.main-cta .main-cta-text .desc {font-size:17px;}
}
/* tablet (2x2) */
@media (min-width:768px) and (max-width:1199.98px) {
.main-cta .main-cta-list {grid-template-columns:repeat(2, 1fr);}
}
/* mobile (1열) */
@media (max-width:767.98px) {
.main-cta .main-cta-text .tit {font-size:17px;}
.main-cta .main-cta-text .desc {font-size:13px;}
}
/*하단 메뉴*/
.footer-menu {background:#12153a; padding:50px 0; color:#fff;}
.footer-menu .pdinner {/* width:min(1200px,92%); *//* margin:0 auto; */max-width: 1500px;}
.footer-menu .footer-menu-list {display:grid; grid-template-columns:repeat(2,1fr); gap:30px;}
.footer-menu strong {display:block; font-weight:700; font-size:16px; margin-bottom:12px; color:#fff;}
.footer-menu ul li ul li {margin-bottom:8px;}
.footer-menu ul li a {color:#bbb; font-size:14px; font-weight:500;}
.footer-menu ul li a:hover {color:#fff;}
.footer-menu ul li a[target='_blank']{padding-right:19px; position:relative;}
.footer-menu ul li a[target='_blank']:after {display:inline-block; content:""; width:15px; height:15px; background-image:url("data:image/svg+xml; utf8,"); background-repeat:no-repeat; background-size:contain; background-position:center; top:1px; right:0px; position:absolute; opacity:0.8;}
/* 반응형 */
@media(min-width:768px){
.footer-menu .footer-menu-list {grid-template-columns:repeat(4,1fr);}
}
@media(min-width:1200px){
.footer-menu .footer-menu-list {grid-template-columns:repeat(7,1fr);}
.footer-menu strong{font-size:18px;}
.footer-menu ul li a{font-size:16px;}
}
/*풀페이지로 수정*/
body.mainWrap:not(.fp-viewing-main):not(.fp-responsive) #header,
body.mainWrap:not(.fp-viewing-main):not(.fp-responsive) #header .bg {background:rgba(0,0,0,0.8); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);}
@media(min-width:1200px){
body:not(.fp-responsive) .main-business > .pdinner,
body:not(.fp-responsive) .main-news .pdinner {padding-bottom:0;}
}
/*Contact Us 추가*/
.contact-btn {position:absolute; right:min(5vw, 60px); bottom:min(5vw, 60px); display:inline-flex; align-items:center; justify-content:center; width:min(20vw, 120px); height:min(20vw, 120px); border-radius:8px; background:var(--col01); background:linear-gradient(90deg, var(--col01) 0%, var(--col02) 100%); color:#fff; text-align:center; z-index:99; transition:0.3s;}
.contact-btn:hover {transform:translateY(-10px);}
.contact-btn em {font-weight:600; font-size:0.8em;}
.contact-btn em:before {display:block;content:"";width:24px;height:24px; margin:0 auto 5px; background-image:url("data:image/svg+xml;utf8,");background-repeat:no-repeat;background-size:contain;background-position:center;}
@media(min-width:768px){
.contact-btn em {font-size:1em;}
}
.main-visual-slider .swiper-slide-active{z-index: 100;}