/*-------------------------------- 메인 공통 */
.main .tit_box { margin-bottom:6.25rem; color:#fff; text-align: center; } 
.main .tit_box h2 { font-family:var(--prostoOne); font-size: 4.375rem; color: #FFF; color:#fff; } 
.main .tit_box p.lg { margin-top:1.25rem; font-size: 2.125rem; line-height: 130%; letter-spacing: -1.36px; word-break: keep-all; } 
.main .tit_box p.sm { margin-top:2.875rem; font-size: 1.125rem; font-weight: 300; line-height: 160%; color:#C4C4C4; letter-spacing: -0.72px; } 


.main .tit_box2 { display: flex; align-items: center; justify-content: space-between; margin-bottom:2.5rem; } 
.main .tit_box2 h2 { font-size: 3.125rem; font-weight: 700; color: #000; } 

@media screen and (max-width:640px) { 
 .main .tit_box { margin-bottom:4rem; } 
 .main .tit_box h2,
 .main .tit_box2 h2 { font-size: 2.5rem; line-height: 1.4; } 
 .main .tit_box p.lg { font-size: 1.6rem; } 
 .main .tit_box p.sm { word-break: keep-all; } 
 .main .tit_box p.sm br { display: none; } 

 .main .tit_box2 { gap:1.875rem; flex-direction: column; } 
}

.main > section { padding:6.25rem 0; } 

@media screen and (max-width:1024px) { 
 .main > section { padding:4rem 0; } 
}

.btn_wrap { display: flex; align-items: center; justify-content: center; margin-bottom:36px;; } 
.btn_wrap.end { justify-content: flex-end; } 
.btn_more { display: flex; gap:1.25rem; align-items: center; padding:0 1.875rem; 
border: 1px solid #ddd; height:3.875rem; background: #FFF; border-radius: 60px; } 
.btn_more::after { display: block; width:1.5rem; height:1rem; background: url("../../images/main/ico_more.svg"); background-size: cover; content: ""; } 
.btn_more.black { border-color: #00236D; background-color: #00236D; color:#fff; } 
.btn_more.black::after { background: url("../../images/main/ico_more_white.svg"); } 


@media screen and (max-width:640px) { 
 .sec_supplier ul.supplier_list { gap:1rem; grid-template-columns: repeat(2,1fr) } 
 .sec_supplier ul li { padding-top:100%; } 
 .sec_supplier ul li a br { display: none; } 
}




/*-------------------------------- 메인섹션 > 비주얼 */ 
.sec_visual { padding:0 !important; overflow: hidden; position: relative; height:100vh; min-height:37.5rem; background-size: cover; } 
.sec_visual .visual_slider { position: absolute; top:0; left:0; width:100%; height:100%; } 
.sec_visual .visual_slider .swiper-slide { position: relative; background-repeat: no-repeat; background-size: cover; } 
.sec_visual .visual_slider .swiper-slide::before { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: top center; background-size: cover; content: ""; } 

.sec_visual .visual_slider .swiper-slide.swiper-slide-active::before { animation:bgZoom 2s ease-in-out forwards; } 
.sec_visual .visual_slider .swiper-slide.slide01::before { background-image:url('../../images/main/bg_visual01.png') } 
.sec_visual .visual_slider .swiper-slide.slide02::before { background-image:url('../../images/main/bg_visual02.png') } 
.sec_visual .visual_slider .swiper-slide.slide03::before { background-image:url('../../images/main/bg_visual03.png') } 
.sec_visual .visual_slider .visual-pagination { display: flex; gap:0.625rem; align-items: center; justify-content: center; bottom:3.375rem; } 
.sec_visual .visual_slider .visual-pagination span { margin:0 !important; width:3.25rem; height:0.4375rem; background-color: #fff; border-radius: 90px; opacity: 0.5; } 
.sec_visual .visual_slider .visual-pagination span.swiper-pagination-bullet-active { opacity: 1; } 

.sec_visual .inner { display: flex; gap:3.75rem; align-items: center; justify-content: center; flex-direction: column; height:100%; } 
.sec_visual .text_box { position: relative; z-index: 2; } 
.sec_visual .text_box span { display: block; } 
.sec_visual .text_box .text1 { font-size:3.25rem; font-weight: 700; line-height: 1.5; color:#fff; text-align: center; letter-spacing: -1px; animation: text 2s forwards; opacity: 1.0; } 
.sec_visual .text_box .text1:lang(en) {text-align: left;}
/* .sec_visual .text_box .text2 { font-family: var(--prostoOne); font-size: 2.25rem; line-height: 1.5; color: #fff; text-align: center; letter-spacing: 2.025rem; word-break: keep-all; animation: fadeIn 1s 2s forwards; opacity: 0; } */

@media screen and (max-width:640px) { 
 .sec_visual { height:76svh; min-height:auto; } 
 .sec_visual .text_box .text1 { font-size:2rem; } 
}

@keyframes bgZoom { 
 0% { 
 transform: scale(1.1); 
}
 100% { 
 transform: scale(1); 
}
}

/* @keyframes text { 
 0% { 
 margin-bottom: -2.5rem; 
 color: black; 
}
 30% { 
 margin-bottom: -2.5rem; 
 letter-spacing: 1.5625rem; 
}
 85% { 
 margin-bottom: -2.5rem; 
 letter-spacing: 0.5rem; 
}
 100% { 
 margin-bottom: 1.25rem; 
}
}

@keyframes fadeIn { 
 0% { 
 opacity: 0; 
}
 100% { 
 opacity: 0.7; 
}
}*/


/*-------------------------------- 메인섹션 > 공급업체 */ 
.sec_supplier { position: relative; background: #080C34 url("../../images/main/symbol.png") no-repeat bottom right; } 
.sec_supplier ul.supplier_list { display: grid; gap:1.5rem; color:#fff; grid-template-columns: repeat(5,1fr); } 
.sec_supplier ul li { padding-top:70%; border: 1px solid rgba(255, 255, 255, 0.30); box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.25); position: relative; background: radial-gradient(109.23% 109.23% at 12.97% 8.44%, rgba(255, 255, 255, 0.15) 5.3%, rgba(217, 217, 217, 0.00) 93.51%); transition: all 0.3s; border-radius: 30px; backdrop-filter: blur(3.5px); transform: translateZ(0); } 
.sec_supplier ul li:hover { box-shadow: 0 18px 28px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.55) inset; transform: translateY(-0.375rem) scale(1.02); } 

.sec_supplier ul li a { padding:30px; position: absolute; top:0; left:0; width:100%; height:100%; font-family: var(--montserrat); font-size: 1.125rem; font-weight: 700; 
line-height: 150%; color: #FFF; white-space: normal; word-break: break-word; overflow-wrap: break-word; } 
.sec_supplier ul li a:after { display: flex; align-items: center; justify-content: center; position: absolute; right:1.625rem; bottom:1.625rem; width:2.3125rem; height:2.3125rem; background-color:#009D85; transition: transform .35s, box-shadow .35s, background-color .35s; content: url("../../images/main/ico_arrow.svg"); border-radius: 100%; } 
.sec_supplier ul li:hover a::after { box-shadow: 0 8px 16px rgba(0,0,0,1), 0 0 0 6px rgba(0,157,133,0.3); background-color:#00b49d; transform: scale(1.08) translate(-0.125rem,-0.125rem); } 


@media screen and (max-width:1280px) { 
 .sec_supplier ul li { padding-top:100%; } 
}
@media screen and (max-width:1024px) { 
 .sec_supplier ul.supplier_list { grid-template-columns: repeat(3,1fr); } 
 .sec_supplier ul li { padding-top:70%; } 
}

@media screen and (max-width:640px) { 
 .sec_supplier ul.supplier_list { gap:1rem; grid-template-columns: repeat(2,1fr) } 
 .sec_supplier ul li { padding-top:100%; } 
 .sec_supplier ul li a br { display: none; } 
}


/*-------------------------------- 메인섹션 > 상품 */ 
.sec_product { background-color: #00236D; } 
.sec_product .product_slide { padding-top:4.375rem; } 
.sec_product .product_slide .nav { display:flex; gap:1.5rem; position:absolute; top:0; right:0; z-index:5; } 
.sec_product .nav-btn { width:2.75rem; height:2.75rem; background:#fff; background-repeat: no-repeat; background-position: center center; cursor:pointer; border-radius:100%; } 
.sec_product .btn-prev { background-image: url("../../images/main/ico_prev.svg"); } 
.sec_product .btn-next { background-image: url("../../images/main/ico_next.svg"); } 

.sec_product .swiper-slide { height:auto; } 
.sec_product .swiper-slide .card { display:flex; flex-direction:column; overflow:hidden; height:100%; background:#0F0F0F; color:#fff; border-radius:60px; } 
.sec_product .swiper-slide .card .card_img { position:relative; background:#fff; aspect-ratio: 16/10; } 
.sec_product .swiper-slide .card .card_img img { position:absolute; width:100%; height:100%; inset:0; object-fit:contain; } 
.sec_product .swiper-slide .card .card_body { display:flex; gap:1rem; flex:1; flex-direction:column; padding: 1.5rem 1.5rem 4rem; border-top-left-radius: 0; border-top-right-radius: 0; background: #0F0F0F; color: #FFF; } 
.sec_product .swiper-slide .card .card_body .tit { font-size: 1.375rem; line-height: 140%; 
letter-spacing: -0.88px; } 
.sec_product .swiper-slide .card .card_body .desc { line-height: 130%; letter-spacing: -0.64px; } 




/*-------------------------------- 메인섹션 > 주요고객사 */ 
.sec_customer { background-color: #F2F2F2; } 
.sec_customer article { margin-top:5rem; } 
.sec_customer article h3 { margin-bottom:1.875rem; font-size: 2.125rem; font-weight: 700; } 
.sec_customer article:first-of-type { margin-top:0; } 

.sec_customer .network_list { display: grid; gap:1.25rem; grid-template-columns: repeat(4,1fr); } 
.sec_customer .network_list li { display: flex; align-items: center; justify-content: center; padding:1.5rem; border:1px solid #ddd; height:6.25rem; background-color: #fff; } 
.sec_customer .network_list li img { max-width: 100%; } 


@media screen and (max-width:768px) { 
 .sec_customer .network_list { gap:1rem; grid-template-columns: repeat(2,1fr); } 
}




/*-------------------------------- 섹션04 notice */ 
.sec_notice { background-color: #0F0F0F; } 
.sec_notice .inner { padding-right:7.5rem; padding-left:7.5rem; } 
.sec_notice ul li { border-bottom:1px solid rgba(255, 255, 255, 0.20); } 
.sec_notice ul li a { display: flex; gap: 1.25rem; justify-content: space-between; padding:2.5rem 0; color:#fff; } 
.sec_notice ul li a .tit { flex: 1; overflow: hidden; font-size: 1.375rem; letter-spacing: -0.66px; white-space: nowrap; text-overflow: ellipsis; } 
.sec_notice ul li a:hover .tit { text-decoration: underline; } 
.sec_notice ul li a .date { letter-spacing: -0.48px; } 
.sec_notice .btn_more2 { display: flex; justify-content: center; margin-top:8.75rem; } 
.sec_notice .btn_more2 a { display: flex; gap:1rem; align-items: center; justify-content: center; padding:2.25rem 3.125rem; background: #D9D9D9; font-family: var(--prostoOne); font-size: 1.25rem; border-radius: 3.4375rem; } 
.sec_notice .btn_more2 a:hover { background: #e7e7e7; } 


@media screen and (max-width:1024px) { 
 .sec_notice .inner { padding-right:16px; padding-left:16px; } 
}


@media screen and (max-width:640px) { 
 .sec_notice .btn_more2 { margin-top:4rem; } 
}