@charset "utf-8";

/* main-visual */
.main-visual {position: relative; width: 100%;}
.main-visual .item {position: relative; width: 100%; height: 100vh;}
.main-visual .img-box {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; transform: scale(1.1); z-index: 1;}
.main-visual .item:nth-child(1) .img-box {background-image: url('../img/main/main-visual01.jpg');}
.main-visual .item:nth-child(2) .img-box {background-image: url('../img/main/main-visual02.jpg');}
.main-visual .item:nth-child(3) .img-box {background-image: url('../img/main/main-visual03.jpg');}
.main-visual .item.slick-active .img-box {transform: scale(1); transition: all 3.5s;}
.main-visual .text-box {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 1470px; width: 100%; padding: 0 15px; z-index: 5;}
.main-visual .text-box h2 {font-family:'Poppins'; font-size: 58px; font-weight: 700; line-height: 1.51em; color: #fff; letter-spacing: -1.74px;}
.main-visual .slick-active .text-box h2 {animation: text-up 1s both 0.4s;}
@keyframes text-up {
    0% {
        filter: blur(5px);
        transform: translateY(60px);
        opacity: 0;
    }

    100% {
        filter: blur(0);
        transform: translateY(0);
        opacity: 1;
    }
}
.main-visual .controler {position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%);}
.main-visual .controler .paging ul {display: flex; align-items: center; gap: 14px;}
.main-visual .controler .paging ul li button {position: relative; display: block; width: 75px; height: 5px; background: rgba(255,255,255, 0.60); font-size: 0; border: 0;}
.main-visual .controler .paging ul li button:after {content: ''; width: 0; height: 5px; background: #F6C302; position: absolute; top: 0; left: 0; transition: all 1.5s;}
.main-visual .controler .paging ul li.slick-active button:after {width: 100%;}

.scrolldown {position:absolute; bottom:70px; right:80px; z-index:30;}
.scrolldown:before {content:''; width:96px; height:96px; background:url('../img/main/scrolldown.png') no-repeat; position:absolute; top:50%; left:50%; margin-top:-48px; margin-left:-48px; animation: scrolldown 10s linear infinite;}
@keyframes scrolldown {0% {transform:rotate(0deg);} 100% {transform:rotate(360deg);}}
.scrolldown span {display:block; width:60px; height:60px; background:#029242; border-radius:50%; overflow:hidden; position:relative;}
.scrolldown span:after {content:''; width:8px; height:36px; top:0; left:50%; margin-left:-4px; position:absolute; background:url('../img/main/scrolldown-icon.png') no-repeat; background-size:cover; animation: scrolldownIcon 1.4s linear infinite;}
@keyframes scrolldownIcon {0% {transform:translateY(-36px);} 100% {transform:translateY(100%);}}

/* section01 */
.section01 {padding:150px 0 170px;}
.section01 .col {display:flex; align-items:center;}
.section01 .img-box {width:100%; max-width:820px;}
.section01 .img-box img {border-radius:20px; position:relative; overflow:hidden;}
.section01 .txt-box {width:1%; flex:1 1 auto; padding-left:90px;}
.section01 .txt-box h3 {font-size:52px; font-family:'Poppins'; font-weight:600; line-height:1.3em; margin-bottom:40px; color:#111;}
.section01 .txt-box p {font-size:22px; line-height:1.6em; color:#333; margin-bottom:70px;}
.section01 .txt-box .more a {width:180px; line-height:58px; border:1px solid #029242; border-radius:30px; padding:0 32px; font-size:16px; font-weight:600; color:#029242; position:relative; transition:all 0.4s;}
.section01 .txt-box .more a:hover {background:#029242; color:#fff;}
.section01 .txt-box .more a:after {content:''; background-image:url('../img/main/more.svg'); width:26px; height:10px; position:absolute; top:50%; right:32px; transform: translateY(-50%); transition:all 0.4s; background-repeat:no-repeat; background-size:contain;}
.section01 .txt-box .more a:hover:after {background-image:url('../img/main/more-on.svg');}
/* section02 */
.section02 {background:url('../img/main/sec02bg.jpg'); padding:150px 0 360px; background-attachment:fixed; background-repeat:no-repeat; background-size:cover;}
.section02 .col {display:flex; justify-content:space-between;}
.section02 .tit-box {width:100%; max-width:580px; position:relative;}
.section02 .tit-box .tit {position:sticky; top:100px;}
.section02 .tit-box h3 {font-size:52px; font-weight:600; line-height:1.3em; color:#fff; font-family:'Poppins'; margin-bottom:40px;}
.section02 .tit-box p {font-size:22px; font-weight:500; line-height:1.6em; color:rgba(255,255,255,0.8); margin-bottom:36px;}
.section02 .tit-box p:last-child {margin-bottom:0;}
.section02 .txt-box {width:100%; max-width:930px;}
.section02 .wrap {display:flex; flex-wrap:wrap; margin:0 -25px;}
.section02 .wrap .row {width:50%; padding:0 25px; margin-bottom:50px;}
.section02 .wrap .row:nth-child(odd) {transform:translateY(180px);}
.section02 .wrap .inner {padding: 43px 50px 60px; border-radius:20px; background:#fff; /* display:flex; flex-wrap:wrap; */ height:100%; transition: all 0.4s;}
.section02 .wrap .inner .thumb {aspect-ratio: 340 / 297; border-radius: 20px; overflow:hidden; margin-bottom: 40px;}
.section02 .wrap .inner .thumb img {width:100%; height:100%; object-fit:cover;}
.section02 .wrap .inner .txt {width:100%;}
.section02 .wrap .inner .txt h4 {font-size:32px; font-weight:600; line-height:1.43em; letter-spacing: -0.96px; color:#111; margin-bottom:24px; transition: all 0.4s; overflow: hidden; white-space: nowrap;  text-overflow: ellipsis;}
.section02 .wrap .inner .txt p {font-size:20px; line-height:1.7em; letter-spacing: -0.6px; color:#666; transition: all 0.4s; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis;}
.section02 .wrap .inner:hover {background: #029242;}
.section02 .wrap .inner:hover .txt h4 {color: #fff;}
.section02 .wrap .inner:hover .txt p {color: #D5D5D5;}

/* section03 */
.section03 {padding:150px 0 0;}  
.section03 .tit-box {margin-bottom:100px;}
.section03 .tit-box h3 {font-size:52px; font-weight:600; color:#111; line-height:1.3em; font-family:'Poppins'; margin-bottom:40px;}
.section03 .tit-box p {font-size:22px; line-height:1.6em; color:#333;}
.section03 .col {display:flex;}
.section03 .col .row {width:20%;}
.section03 .inner {height:540px; padding:60px 20px; background-repeat:no-repeat; background-size:cover; background-position:center center; position:relative;}
.section03 .inner01 {background-image:url('../img/main/sec03-01.jpg');}
.section03 .inner02 {background-image:url('../img/main/sec03-02.jpg');}
.section03 .inner03 {background-image:url('../img/main/sec03-03.jpg');}
.section03 .inner04 {background-image:url('../img/main/sec03-04.jpg');}
.section03 .inner05 {background-image:url('../img/main/sec03-05.jpg');}
.section03 .inner .tit h4 {font-size:32px; line-height:1.4em; color:#fff; font-weight:600; transition:all 0.4s; text-align:center;}
.section03 .inner:hover .tit h4 {opacity:0;}
.section03 .inner .over {opacity:0; transition:all 0.4s; position:absolute; width:100%; height:100%; top:0; left:0; background: linear-gradient(0deg, rgba(2, 146, 66, 0.90) 0%, rgba(2, 146, 66, 0.90) 100%); overflow:hidden; display:flex; align-items:center; padding:20px 40px;}
.section03 .inner:hover .over {opacity:1;}
.section03 .inner .over span {position:absolute; top:40px; right:40px; transform:translate(-100%, 100%); opacity:0;}
.section03 .inner:hover .over span {transform:translate(0, 0); opacity:1; transition:all 0.4s 0.4s;}
.section03 .inner .icon {position:absolute; bottom:0; left:40px; transform:translateY(100%); opacity:0;}
.section03 .inner:hover .icon {transform:translateY(0); opacity:1; transition:all 0.4s 0.2s;}
.section03 .inner p {font-size:20px; line-height:1.7em; color:#fff;}
/* section04 */
.section04 {padding:150px 0 180px; background:url('../img/main/sec04bg.jpg') center bottom no-repeat; background-size:contain;}
.section04 .tit-box {margin-bottom:74px; text-align:center;}
.section04 .tit-box h3 {font-size:52px; font-weight:600; line-height:1.3em; color:#000; font-family:'Poppins'; margin-bottom:40px;}
.section04 .tit-box p {font-size:22px; line-height:1.6em; color:#333; margin-bottom:60px;}
.section04 .tit-box .more a {display:inline-block; text-align:left; width:164px; line-height:58px; border:1px solid #029242; border-radius:30px; padding:0 32px; font-size:16px; font-weight:600; color:#029242; position:relative; transition:all 0.4s;}
.section04 .tit-box .more a:hover {background:#029242; color:#fff;}
.section04 .tit-box .more a:after {content:''; background-image:url('../img/main/more.svg'); width:26px; height:10px; position:absolute; top:50%; right:32px; transform: translateY(-50%); transition:all 0.4s; background-repeat:no-repeat; background-size:contain;}
.section04 .tit-box .more a:hover:after {background-image:url('../img/main/more-on.svg');}
.section04 .col {display:flex; margin:0 -20px;}
.section04 .col .row {width:33.333333%; padding:0 20px;}
.section04 .inner {border:1px solid #ddd; background:#fff; border-radius:20px; padding:70px; text-align:center; height:100%;}
.section04 .inner .icon {margin-bottom:40px;}
.section04 .inner h5 {font-size:28px; font-weight:600; line-height:1.5em; color:#111; margin-bottom:10px;}
.section04 .inner p {font-size:20px; line-height:1.7em; color:#666;}