.text-box h1{color:#333;font-size:4rem;font-weight:700;}
.text-box h2{color:#333;font-size:3.25rem;font-weight:700;}
.text-box h4{color:#333;font-size:1.875rem;font-weight:700;}
.text-box p{color:#727272;font-size:1.125rem;margin-bottom:0;}

.text-box.white h2{color:#fff;}
.text-box.white h4{color:#fff;}
.text-box.white p{color:#fff;}

.bg-image{background-position: center;background-repeat: no-repeat;background-size: cover;}

.sec-title h2{font-size:3.25rem;color:#333;font-weight:800;}
.sec-title.white h2{color:white;}
.sec-title h2 span{font-weight:300;}


body .swiper-button-next{margin-top:0;background-image: none;z-index:10;right: 20px;border: 1px solid #fff;border-radius: 200px;width: 50px;height: 50px;display: flex;align-items: center;justify-content: center;font-size: 20px;color: #fff;top: 50%;transform: translateY(-50%);transition:0.3s;}
body .swiper-button-prev{margin-top:0;background-image: none;z-index:10;left: 20px;border: 1px solid #fff;border-radius: 200px;width: 50px;height: 50px;display: flex;align-items: center;justify-content: center;font-size: 20px;color: #fff;top: 50%;transform: translateY(-50%);transition:0.3s;}
body .swiper-button-next:hover{color:#d81823;border-color:#d81823;}
body .swiper-button-prev:hover{color:#d81823;border-color:#d81823;}

body .swiper-pagination-bullet{width:10px;height:10px;margin:0 4px;}
body .swiper-pagination-bullet-active{background: #000;}
#sec01_page {position: absolute;bottom: 30px;left: 50%;transform: translateX(-50%);}
#sec02_page {position: absolute;bottom:20px;left: 50%;transform: translateX(-50%);}

.mobile{display:none;}

.border-radius{border-radius: 20px;overflow: hidden;}

/***************** sec01 *****************/
#section1 {padding:0; position: relative;width:100%;height:100%;overflow: hidden;}

#sec01_sli{height:100%;width:100%;margin: 0 auto;overflow: inherit;}
#sec01 .sec01_sli{height:100%; background-position:70% 50%; background-size:cover; background-repeat:no-repeat;display:flex; justify-content:center; align-items:center; }

.sec01_sli{width:100%;height:850px;}
.sec01_sli .image {position: absolute;top: 50%;left: 50%;z-index: -1;transform: translate(-50%,-50%);width: 100%;height:100%;overflow: hidden;display:flex;align-items:center;justify-content:center;}
.sec01_sli .image img{position: absolute;top: 50%;left: 50%;width: 100%;height: 100%;object-fit: cover;transform: translate(-50%, -50%);}

.sec01_sli .text-box{width: 100%;text-align:left;position: relative;height: 100%;display: flex;justify-content: center;flex-flow: column;z-index: 2;}
.sec01_sli .text-box h2{font-weight:800;}
.sec01_sli .text-box h5{font-weight:500;}


#sec01 #swiper-controls {position: absolute;bottom:50px;right:0;width:100%;z-index: 2;}
#sec01 .swiper-controls-btn {width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;}


#sec01 .sec01_nav {width:60px;height:60px;background:rgba(0,0,0,0.8);color:#fff;font-size:30px;cursor:pointer;position: absolute;top:50%;transform: translateY(-50%); z-index:1;display: flex;align-items: center;justify-content: center;-webkit-transition: all 0.4s;-moz-transition: all 0.4s;-ms-transition: all 0.4s;-o-transition: all 0.4s;transition: all 0.4s;}
#sec01 .sec01_nav:hover{background:rgba(255,255,255,0.8);color:#000; }

.sec01-bg {position: absolute;top: 0;left: 0;width: 100%;height: 100%;font-weight: 700;font-size:15rem;opacity: 0.1;display: flex;align-items: flex-start;justify-content: space-between;flex-flow: column;}
.sec01-bg .zigzag-container {display: flex;width: 100%;height:100%;}
.sec01-bg .text {color:#ddd; /* Fallback */text-transform: uppercase;-webkit-text-fill-color:#242578;-webkit-text-stroke-width:2px;-webkit-text-stroke-color:#ddd;letter-spacing: 30px;}
/*.sec01-bg .text.mirrored {transform: scale(-1, 1);-webkit-transform: scale(-1, 1);}*/

.sec01-bg .text.right {align-self: flex-end;}


/***************** sec02 *****************/
#section2{padding-bottom:0;position: relative;}
#section2::after{content:'';height:20%;width:100%;position: absolute;bottom:0;left: 0;background:#242578;}

.sec02-top-wrap{width: 100%;display: grid;grid-template-columns: repeat(4, 1fr);gap:40px;}
.sec02-top-wrap .sec02-top .image{display:flex;align-items:center;justify-content:center;border-radius: 8px;overflow: hidden;}
.sec02-top-wrap .sec02-top:nth-child(even){margin-top:10rem;}

#sec02_sli{height:100%;max-height:700px;border-radius: 20px;overflow: hidden;}
#sec02_sli .image img{width:100%;height: auto;object-fit: cover;}

/***************** sec03 *****************/
#section3{background:#242578;position: relative;}
#section3 .container{z-index: 1;}

.sec03-pt-wrap{width: 100%;display: grid;grid-template-columns: repeat(3, 1fr);gap:40px;}


/***************** sec04 *****************/
.wrapper {display: flex;flex-direction: column;gap: var(--gap);margin: auto;max-width: 100vw;}

.scroller {width: 100%;max-width: 1000px;position: relative;height: 1em;overflow: hidden;font-size:2.65em;text-align: center;margin: 60px auto;}
.scroller:before {content: '[';position: absolute;top: -12px;left: 0;color: #fff;font-size: 40px;font-weight: 600;animation: scroller2 3s infinite;}
.scroller:after {content: ']';position: absolute;top: -12px;right: 0;color: #fff;font-size: 40px;font-weight: 600;animation: scroller2 3s infinite;}
@keyframes scroller { 0% {transform: translateY(0);} 20% {transform: translateY(-1em);} 40% {transform: translateY(-2em);} 60% {transform: translateY(-3em);} 80% {transform: translateY(-4em);} 100% {transform: translateY(-5em);} }
@keyframes scroller2 {10%{color:#fff;}50%{color:#de1e25;}100%{color:#fff;}}

:root {--color-text: navy;--color-bg: papayawhip;--color-bg-accent: #ecdcc0;--size: clamp(40rem, 4rem + 75vmin, 70rem);--gap: 20px;--duration:50s;--scroll-start: 0;--scroll-end: calc(-100% - var(--gap)); }
.marquee {height:600px;display: flex;overflow: hidden;user-select: none;gap: var(--gap);position: relative;}
.marquee::before, .marquee::after {content: "";position: absolute;top: 0;width: 10%;height: 100%;z-index: 2;pointer-events: none;}
.marquee::before {left: 0;background: linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));}
.marquee::after {right: 0;background: linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));}
.marquee__group {flex-shrink: 0;display: flex;align-items: center;justify-content: space-around;gap: var(--gap);min-width: 100%;animation: scroll-x var(--duration) linear infinite;}
.marquee .sec04-img {background:#fff;display: grid;transition:0.3s;place-items: center;width: var(--size);aspect-ratio: 16/9;padding:0;}
.marquee .sec04-img img{opacity:1;}

@keyframes scroll-x { from {transform: translateX(var(--scroll-start));} to {transform: translateX(var(--scroll-end));} }
@keyframes scroll-y { from {transform: translateY(var(--scroll-start));} to {transform: translateY(var(--scroll-end));}}
@keyframes fade { to {opacity: 0;visibility: hidden;} }
@media (prefers-color-scheme: dark) {  :root {--color-text: papayawhip;--color-bg: navy;--color-bg-accent: #2626a0;}  }
@media (prefers-reduced-motion: reduce) {  .marquee__group {animation-play-state: paused;}  }

@media screen and (max-width: 1024px) {
    .marquee {height:auto;}

}

@media screen and (max-width:768px) {
    :root{--size:clamp(30rem, 3rem + 65vmin, 55rem); --duration:30s;}
}

@media screen and (max-width:480px) {
    .marquee::before, .marquee::after{display:none;}
    :root{ --size: clamp(25rem, 2.5rem + 55vmin, 45rem);--duration:25s;}
}


/***************** sec05 *****************/
#section5{background:rgb(231 234 244);}

.sec05-pt-wrap{width: 100%;display: grid;grid-template-columns: repeat(3, 1fr);gap:40px;padding:0 0 20px;}
.sec05-pt{padding:2rem;background:#fff;border-radius:20px;position: relative;overflow: hidden;}
.sec05-pt::after {content: '';position: absolute;background-image: url('../img/main/sec05-bg.png');background-size: contain;background-repeat: no-repeat;background-position: bottom right;width: 50%;height: 100%;right: 0;bottom: 0;opacity: 0.2;}

.sec05-pt a{background:#32b44a !important;}
.sec05-pt a:hover{}

.sec05-pt:hover{}
.sec05-pt:hover h4{color:#d81823;}

.drop-shadow-xl {filter: drop-shadow(0 20px 13px rgba(0, 0, 0, .03)) drop-shadow(0 8px 5px rgba(0, 0, 0, .08));}


/***************** responsive *****************/



@media screen and (max-width: 1200px) {
    /* 일반 */
    .text-box h1 { font-size: 3.5rem; }
    .text-box h2 { font-size: 3rem; }

    .sec-title{margin-bottom:5rem !important;}
    .sec-title h2 { font-size: 3.25rem; }

    /* 섹션 01 */
    .sec01-bg { font-size: 12rem; }
    .sec01-bg .text { letter-spacing: 20px; }


    /* 섹션 02 */
    .sec02-top-wrap .sec02-top:nth-child(even) { margin-top: 8rem; }

    /* 섹션 03 */



    /* 섹션 04 */
    .sec05-pt-wrap { gap: 30px; }
}

@media screen and (max-width: 1024px) {
    /* 일반 */
    .text-box h1 { font-size: 3rem; }
    .text-box h2 { font-size: 2.5rem; }
    .text-box h4 { font-size: 1.75rem; }
    .text-box p { font-size: 1rem; }

    .sec-title{margin-bottom:4rem !important;}
    .sec-title h2 { font-size: 2.5rem; }

    /* 섹션 01 */
    .sec01-bg { font-size: 10rem; }

    /* 섹션 02 */
    .sec02-top-wrap { grid-template-columns: repeat(2, 1fr); gap: 30px; }
    .sec02-top-wrap .sec02-top:nth-child(even) { margin-top: 6rem; }
    .sec02-top-wrap .sec02-top:nth-child(3) { margin-top:-6rem; }
    .sec02-top-wrap .sec02-top:nth-child(4) { margin-top:0; }
    #sec02_sli {max-height:600px;}

    /* 섹션 03 */
    .sec03-pt-wrap{gap:20px;}

    /* 섹션 04 */
    .sec05-pt-wrap {grid-template-columns: repeat(2, 1fr);}
    .sec05-pt { padding: 1.5rem; }
}

@media screen and (max-width: 768px) {
    /* 일반 */
    .desktop{display:none;}
    .mobile{display:block;}

    body .swiper-button-next{width:30px;height:30px;font-size:18px;right:10px;}
    body .swiper-button-prev{width:30px;height:30px;font-size:18px;left:10px;}


    .text-box h1 { font-size: 2.5rem; margin-bottom: 1rem !important;}
    .text-box h2 { font-size: 2.25rem; }
    .text-box h4 { font-size: 1.5rem; }

    .sec-title{margin-bottom:3rem !important;}
    .sec-title h2 { font-size: 2.25rem; }

    /* 섹션 01 */
    .sec01_sli{height:500px;}

    .sec01_sli .text-box { text-align: center; height:50%; }

    .sec01-bg { font-size: 8rem; }
    .sec01-bg .text { letter-spacing: 15px; }

    #sec01_page { bottom: 20px; }

    /* 섹션 02 */
    #sec02_sli {max-height:500px;}
    .sec02-top-wrap { gap: 20px; }
    #sec02_page { bottom:10px; }


    /* 섹션 03 */
    .sec03-pt-wrap{grid-template-columns: repeat(2, 1fr);gap:12px;}

    /* 섹션 04 */
    .sec05-pt-wrap { grid-template-columns: 1fr; }
    .sec05-pt{filter:none;}
}

@media (max-width: 480px) {
    /* 일반 */
    .text-box h1 { font-size: 2rem; }
    .text-box h2 { font-size: 1.5rem; }
    .text-box h4 { font-size: 1.25rem; }
    .text-box p { font-size: 0.9rem; }

    .sec-title{margin-bottom:2.5rem !important;}
    .sec-title h2 { font-size: 1.5rem; }

    /* 섹션 01 */
    #section1 { height: 40vh; }
    .sec01-bg { font-size: 6rem; }
    .sec01-bg .text { letter-spacing: 10px; }
    #sec01 .sec01_nav { width: 40px; height: 40px; font-size: 20px; }

    /* 섹션 02 */
    #sec02_sli {max-height:400px;}
    .sec02-top-wrap { grid-template-columns: repeat(2, 1fr); gap:10px; }
    .sec02-top-wrap .sec02-top:nth-child(even) { margin-top:0; }
    .sec02-top-wrap .sec02-top:nth-child(3) { margin-top:0; }


    /* 섹션 03 */
   .sec03-pt{border-radius:10px;}

}

@media (max-width: 430px) {
    /* 일반 */
    .text-box h1 { font-size: 1.8rem; }
    .text-box h2 { font-size: 1.4rem; }
    .text-box h4 { font-size: 1.1rem; }
    .text-box p { font-size: 0.85rem; }

    .sec-title { margin-bottom: 2rem !important; }
    .sec-title h2 { font-size: 1.4rem; }

    /* 섹션 01 */
    #section1 { height: 35vh; }
    .sec01-bg { font-size: 5rem; }
    .sec01-bg .text { letter-spacing: 8px; }


    /* 섹션 02 */
    #sec02_sli { max-height: 350px; }

    /* 섹션 03 */

}