@charset "utf-8";

.main { width: 100%; height: auto; background: url('/resources/img/main/main_vis_bg.jpg') no-repeat center top/contain; }

.main .main-cont-wrap { padding-top: 200px; overflow-y: hidden; }

.main h2 { margin-bottom: 64px; }
.main h2 p { font: 700 48px/100% var(--font-family); }
.main h2 p + p { margin-top: 12px; }
.main h2 p .tit-pt { color: var(--sub-key-color); position: relative; }
.main h2 p .tit-pt::before { content: ''; width: 76px; height: 40px; background: url('/resources/img/main/main_ico_tit.png') no-repeat center/contain; position: absolute; left: calc(50% - 38px); top: -40px; }

@media screen and (max-width:1440px){
    .main .main-cont-wrap { padding-top: 180px; }
    .main h2 p { font-size: 44px; }
    .main h2 p .tit-pt::before { width: 68px; left: calc(50% - 34px); }
}
@media screen and (max-width:1280px){
    .main .main-cont-wrap { padding-top: 120px; }
    .main h2 p { font-size: 38px; }
    .main h2 p + p { margin-top: 10px; }
}
@media screen and (max-width:1024px){
    .main h2 { margin-bottom: 48px; }
    .main h2 p { font-size: 32px; }
    .main h2 p .tit-pt::before { width: 60px; left: calc(50% - 30px); top: -35px; }
}
@media screen and (max-width:768px){
    .main h2 p { font-size: 30px; }
    .main h2 p .tit-pt::before { width: 52px; left: calc(50% - 26px); top: -32px; }
}
@media screen and (max-width:640px){
    .main h2 { margin-bottom: 32px; }
    .main h2 p { font-size: 26px; }
}
@media screen and (max-width:480px){
    .main h2 { margin-bottom: 24px; }
    .main h2 p { font-size: 24px; }
    .main h2 p .tit-pt::before { width: 42px; left: calc(50% - 21px); }
}


/* main-sec1 S */
.main .main-sec1 .sec-cont { display: grid; grid-template-columns: 39.5% 60.5%; gap: 40px; }
.main .main-sec1 .last-plant-box .img-box { width: 100%; height: 0; padding-bottom: 75.75%; border-radius: 30px; margin-bottom: 24px; overflow: hidden; position: relative; box-shadow: var(--sha); }
.main .main-sec1 .last-plant-box .img-box > img { width: 100%; height: 100%; object-fit: cover; position: absolute; }
.main .main-sec1 .last-plant-box .name-box { padding-left: 52px; position: relative; }
.main .main-sec1 .last-plant-box .name-box::before { content: ''; width: 36px; height: 36px; background: url('/resources/img/main/main_ico_pwst.png') no-repeat center/contain; position: absolute; left: 0; top: 0; }
.main .main-sec1 .last-plant-box .name { font: 700 32px/100% var(--font-family); margin-bottom: 16px; } 
.main .main-sec1 .last-plant-box .address > span { font: 500 20px/100% var(--font-family); color: var(--sub-black); }
.main .main-sec1 .last-plant-box .address > span:last-child { display: inline-block; color: var(--main-black); padding-left: 16px; margin-left: 16px; position: relative; }
.main .main-sec1 .last-plant-box .address > span:last-child::before { content: ''; width: 1px; height: 18px; background-color: var(--gray-lite); position: absolute; left: 0; top: 1px; }
.main .main-sec1 .right-cont ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px;  }
.main .main-sec1 .right-cont .quick-box { width: 100%; height: 240px; padding: 48px; border-radius: 30px; background-color: #F6F7F9; position: relative; }
.main .main-sec1 .right-cont li:last-child .quick-box { background-color: transparent; }
.main .main-sec1 .right-cont .quick-box .tit { font: 700 24px/100% var(--font-family); color: var(--key-color); margin-bottom: 18px; }
.main .main-sec1 .right-cont .quick-box .txt > span { display: block; font: 500 20px/140% var(--font-family); }
.main .main-sec1 .right-cont .quick-box .img-box { position: absolute; }
.main .main-sec1 .right-cont li:nth-child(1) .quick-box .img-box { width: 106px; right: 42px; bottom: 38px; }
.main .main-sec1 .right-cont li:nth-child(2) .quick-box .img-box { width: 116px; right: 31px; bottom: 42px; }
.main .main-sec1 .right-cont li:nth-child(3) .quick-box .img-box { width: 124px; right: 36px; bottom: 40px; }
.main .main-sec1 .right-cont li:last-child .quick-box .txt { margin-bottom: 34px; }
.main .main-sec1 .right-cont .quick-box .quick-btn-wrap { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.main .main-sec1 .right-cont .quick-box .quick-btn-wrap > a { display: block; width: 100%; border-radius: 12px; background-color: var(--sub-key-color); color: #fff; padding: 0 24px; font: 600 18px/56px var(--font-family); position: relative; transition: all 0.2s ease;  }
.main .main-sec1 .right-cont .quick-box .quick-btn-wrap > a:first-child { background-color: var(--point-color); }
.main .main-sec1 .right-cont .quick-box .quick-btn-wrap > a::after { content: ''; width: 17px; height: 17px; background: url('/resources/img/common/cmn_ico_outlink.svg') no-repeat center/contain; position: absolute; right: 24px; top: calc(50% - 9px); } 

@media screen and (max-width:1440px){
    .main .main-sec1 .sec-cont { grid-template-columns: 30% calc(70% - 40px); }
    .main .main-sec1 .last-plant-box .name { font-size: 28px; }
    .main .main-sec1 .last-plant-box .address > span { display: block; }
    .main .main-sec1 .last-plant-box .address > span:last-child { display: block; padding-left: 0; margin-left: 0; margin-top: 8px; }
    .main .main-sec1 .last-plant-box .address > span:last-child::before { display: none; }
    .main .main-sec1 .right-cont ul { gap: 20px; }
    .main .main-sec1 .right-cont .quick-box { height: 220px; padding: 40px; }
    .main .main-sec1 .right-cont .quick-box .tit { font-size: 22px; margin-bottom: 16px; }
    .main .main-sec1 .right-cont .quick-box .txt > span { font-size: 18px; }
    .main .main-sec1 .right-cont li:nth-child(1) .quick-box .img-box { width: 92px; right: 42px; bottom: 38px; }
    .main .main-sec1 .right-cont li:nth-child(2) .quick-box .img-box { width: 100px; right: 31px; bottom: 42px; }
    .main .main-sec1 .right-cont li:nth-child(3) .quick-box .img-box { width: 110px; right: 36px; bottom: 40px; }
    .main .main-sec1 .right-cont li:last-child .quick-box { padding: 40px 30px; }
}
@media screen and (max-width:1280px){
    .main .main-sec1 .sec-cont { grid-template-columns: 40% auto; }
    .main .main-sec1 .right-cont ul { gap: 16px; }
    .main .main-sec1 .right-cont .quick-box { height: 200px; padding: 36px; border-radius: 24px; }
    .main .main-sec1 .right-cont .quick-box .tit { font-size: 21px; margin-bottom: 20px; }
    .main .main-sec1 .right-cont .quick-box .txt { display: none; }
    .main .main-sec1 .right-cont li:nth-child(1) .quick-box .img-box { width: 88px; right: 42px; bottom: 38px; }
    .main .main-sec1 .right-cont li:nth-child(2) .quick-box .img-box { width: 92px; right: 31px; bottom: 42px; }
    .main .main-sec1 .right-cont li:nth-child(3) .quick-box .img-box { width: 98px; right: 36px; bottom: 40px; }
    .main .main-sec1 .right-cont li:last-child .quick-box { padding: 36px 20px; }
    .main .main-sec1 .right-cont .quick-box .quick-btn-wrap { grid-template-columns: auto; }
    .main .main-sec1 .right-cont .quick-box .quick-btn-wrap > a { font-size: 17px; line-height: 48px; }
}
@media screen and (max-width:960px){
    .main .main-sec1 .sec-cont { display: block; }
    .main .main-sec1 .sec-cont .last-plant-box { display: grid; grid-template-columns: 380px auto; align-items: end; gap: 16px; }
    .main .main-sec1 .sec-cont .last-plant-box .lst-plant-swiper { width: 100%; }
    .main .main-sec1 .last-plant-box .name-box { padding-left: 32px; }
    .main .main-sec1 .last-plant-box .name-box::before { width: 24px; height: 24px; }
    .main .main-sec1 .last-plant-box .img-box { margin-bottom: 0; }

    .main .main-sec1 .sec-cont .right-cont { margin-top: 24px; }
    .main .main-sec1 .right-cont ul { grid-template-columns: repeat(3, 1fr); }
    .main .main-sec1 .right-cont ul li:last-child { display: none; }
    .main .main-sec1 .right-cont .quick-box { height: 100%; padding: 24px; }
    .main .main-sec1 .right-cont .quick-box .tit { font-size: 19px; margin-bottom: 16px; }
    .main .main-sec1 .right-cont .quick-box .img-box { margin: 0 0 0 auto; position: static; }
    .main .main-sec1 .right-cont li:nth-child(1) .quick-box .img-box { width: 77px; }
    .main .main-sec1 .right-cont li:nth-child(3) .quick-box .img-box { width: 90px; }
}
@media screen and (max-width:768px){
    .main .main-sec1 .sec-cont .last-plant-box { display: block; }
    .main .main-sec1 .sec-cont .last-plant-box .lst-plant-swiper { margin-bottom: 12px; }
    .main .main-sec1 .last-plant-box .img-box { padding-bottom: 62%; border-radius: 24px; }
    .main .main-sec1 .last-plant-box .name { font-size: 24px; }
    .main .main-sec1 .last-plant-box .address > span { font-size: 18px; }
    .main .main-sec1 .right-cont ul { gap: 12px; }
}
@media screen and (max-width:640px){
    .main .main-sec1 .last-plant-box .name { font-size: 21px; }
    .main .main-sec1 .last-plant-box .address > span { font-size: 16px; }
    .main .main-sec1 .right-cont .quick-box { display: flex; flex-direction: column; justify-content: space-between; }
    .main .main-sec1 .right-cont .quick-box .tit { font-size: 17px; }
    .main .main-sec1 .right-cont li:nth-child(1) .quick-box .img-box { width: 62px; }
    .main .main-sec1 .right-cont li:nth-child(2) .quick-box .img-box { width: 79px; }
    .main .main-sec1 .right-cont li:nth-child(3) .quick-box .img-box { width: 71px; }
}
@media screen and (max-width:480px){
    .main .main-sec1 .right-cont ul { grid-template-columns: repeat(2, 1fr); }
    .main .main-sec1 .right-cont ul li:nth-child(3) { display: none; }
}
/* main-sec1 E */



/* main-sec2 S */
.main .main-sec2 { margin-top: 280px; }
.main .sel-reason { padding-bottom: 100px; background: url('/resources/img/main/main_img_feat_sha.jpg') no-repeat center bottom/100% auto; }
.main .sel-reason > ul { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; }
.main .sel-reason li { width: 15%; max-height: 520px; margin-right: 20px; transition: all 0.85s ease; overflow: hidden; perspective: 480px; }
.main .sel-reason li.mouse-on { width: 55%; max-width: 710px; perspective: none; }
.main .sel-reason li:last-child { margin-right: 0; }

.main .sel-reason li.left .cont-box { transform-origin: left center; transform: rotateY(5deg); }
.main .sel-reason li.right .cont-box { transform-origin: right center; transform: rotateY(-5deg); }
.main .sel-reason .cont-box { height: 100%; padding: 100px 24px 64px; background-color: #F6F7F9; color: #fff; border-radius: 30px; position: relative; }

.main .sel-reason .cont-box::before { content: ''; width: 120px; height: 100px; background: url('/resources/img/main/main_ico_quotes.png') no-repeat center/contain; opacity: 0.1; position: absolute; top: 40px; left: 40px; display: none; }
.main .sel-reason .cont-box::after { content: ''; width: 120px; height: 100px; background: url('/resources/img/main/main_ico_quotes.png') no-repeat center/contain; opacity: 0.1; position: absolute; bottom: 40px; right: 40px; transform: rotate(180deg); display: none; }
.main .sel-reason .cont-box .sel-tit { font: 700 24px/125% var(--font-family); color: var(--main-black); margin-bottom: 12px; }
.main .sel-reason .cont-box .sel-sub-exp { width: 100%; height: 80px; overflow: hidden; position: relative; display: none; }
.main .sel-reason .cont-box .sel-sub-exp > span { display: block; font: 500 20px/140% var(--font-family); position: relative; left: -100%; transition: all 0.5s ease; }
.main .sel-reason .cont-box .sel-number { font: 500 126px/100% 'Pretendard'; opacity: 0.6; position: absolute; bottom: -20px; }
.main .sel-reason .cont-box .img-box { height: 255px; text-align: right; position: relative; z-index: 3; overflow: hidden; display: none;  }
.main .sel-reason li:nth-child(1) .cont-box .img-box > img { width: 240px; position: absolute; bottom: -100%; right: 0; }
.main .sel-reason li:nth-child(2) .cont-box .img-box > img { width: 240px; position: absolute; bottom: -100%; right: 0; }
.main .sel-reason li:nth-child(3) .cont-box .img-box > img { width: 250px; position: absolute; bottom: -100%; right: 0; }
.main .sel-reason li:nth-child(4) .cont-box .img-box > img { width: 245px; position: absolute; bottom: -100%; right: 0; }

.main .sel-reason li.mouse-on .cont-box { padding: 90px 64px 64px; background-color: var(--sub-key-color); }
.main .sel-reason li.mouse-on .cont-box::before { display: block; }
.main .sel-reason li.mouse-on .cont-box::after { display: block; }
.main .sel-reason li.mouse-on .cont-box .sel-tit { font: 700 32px/125% var(--font-family); color: #fff; }
.main .sel-reason li.mouse-on .cont-box .sel-sub-exp { display: block; }
.main .sel-reason li.mouse-on .cont-box .sel-sub-exp > span { animation: txtSlow 1s ease 0.6s 1 normal forwards; }
.main .sel-reason li.mouse-on .cont-box .img-box { display: block; }
.main .sel-reason li.mouse-on .cont-box .img-box > img { animation: imgSlow 1s ease 0.4s 1 normal forwards; }

@keyframes txtSlow {
    0% { left: -100%; }
    100% { left: 0; }
}
@keyframes imgSlow {
    0% { bottom: -100%; }
    68% { bottom: 7%; } 
    100% { bottom: 0; } 
}

@media screen and (max-width:1440px){
    .main .main-sec2 { margin-top: 240px; }
    .main .sel-reason { padding-bottom: 70px; }
}
@media screen and (max-width:1280px){
    .main .main-sec2 { margin-top: 190px; }
    .main .sel-reason li { margin-right: 10px; }
    .main .sel-reason .cont-box  { padding: 60px 18px 40px 30px; }
    .main .sel-reason .cont-box .sel-tit { font-size: 22px; position: relative; z-index: 1; }
    .main .sel-reason .cont-box .sel-sub-exp > span { font-size: 19px; }
    .main .sel-reason .cont-box .img-box { height: 225px; margin-top: -20px; }
    .main .sel-reason li:nth-child(1) .cont-box .img-box > img { width: 200px; }
    .main .sel-reason li:nth-child(2) .cont-box .img-box > img { width: 200px; }
    .main .sel-reason li:nth-child(3) .cont-box .img-box > img { width: 210px; }
    .main .sel-reason li:nth-child(4) .cont-box .img-box > img { width: 205px; }
    .main .sel-reason .cont-box .sel-number { font: 500 84px / 100% 'Pretendard'; }
    .main .sel-reason li.mouse-on .cont-box { padding: 80px 50px 50px; }
    .main .sel-reason li.mouse-on .cont-box .sel-tit { font-size: 28px; } 
}
@media screen and (max-width:960px){
    .main .main-sec2 { margin-top: 160px; }
    .main .sel-reason > ul { flex-direction: column; flex-wrap: nowrap; align-items: stretch; }
    .main .sel-reason li { width: 100%; height: 135px; perspective: inherit; margin-bottom: 10px; }
    .main .sel-reason li:last-child { margin-bottom: 0; }
    .main .sel-reason .cont-box .sel-number { bottom: auto; top: 30px; right: 60px; }

    .main .sel-reason li.mouse-on { width: 100%; max-width: 100%; height: 445px; perspective: inherit; margin-bottom: 10px; }
}
@media screen and (max-width:768px){
    .main .sel-reason { padding-bottom: 0; background: transparent; }
    .main .sel-reason li.mouse-on  { height: 400px; }
    .main .sel-reason li.mouse-on .cont-box { padding: 80px 40px 40px; }
    .main .sel-reason li.mouse-on .cont-box .sel-tit { font-size: 24px; }
    .main .sel-reason .cont-box { padding: 52px 18px 40px 30px; }
    .main .sel-reason .cont-box .sel-sub-exp > span { font-size: 17px; }
    .main .sel-reason .cont-box::before { width: 80px; top: 20px; left: 20px; }
    .main .sel-reason .cont-box::after { width: 80px; bottom: 20px; right: 20px; }
    .main .sel-reason .cont-box .img-box { height: 180px; margin-top: -5px; }
    .main .sel-reason li:nth-child(1) .cont-box .img-box > img { width: 170px; }
    .main .sel-reason li:nth-child(2) .cont-box .img-box > img { width: 163px; }
    .main .sel-reason li:nth-child(3) .cont-box .img-box > img { width: 180px; }
    .main .sel-reason li:nth-child(4) .cont-box .img-box > img { width: 175px; }
}
@media screen and (max-width:640px){
    .main .sel-reason .cont-box { border-radius: 20px; }
    .main .sel-reason .cont-box .sel-tit { font-size: 19px; }
    .main .sel-reason li.mouse-on .cont-box .sel-tit { font-size: 22px; }
}
@media screen and (max-width:500px){

    .main .sel-reason .cont-box { padding: 40px 30px; }
    .main .sel-reason .cont-box::before { width: 60px; top: 0; left: 17px; }
    .main .sel-reason .cont-box::after { width: 60px; bottom: 0; right: 17px; }
    .main .sel-reason .cont-box .sel-sub-exp { height: 96px; }
    .main .sel-reason .cont-box .sel-sub-exp > span { display: inline; display: inline; font-size: 16px; }
    .main .sel-reason .cont-box .sel-number { font-size: 48px; top: 22px; right: 30px; opacity: 0.3; }
    .main .sel-reason .cont-box .img-box { height: 150px; }
    .main .sel-reason li:nth-child(1) .cont-box .img-box > img { width: 140px; }
    .main .sel-reason li:nth-child(2) .cont-box .img-box > img { width: 135px; }
    .main .sel-reason li:nth-child(3) .cont-box .img-box > img { width: 140px; }
    .main .sel-reason li:nth-child(4) .cont-box .img-box > img { width: 145px; }

    .main .sel-reason li.mouse-on { height: 380px; }
    .main .sel-reason li.mouse-on .cont-box { padding: 48px 24px 24px; }
}
/* main-sec2 E */


/* main-sec3 S */
.main .main-sec3 { margin-top: 240px; }
.main .main-sec3 h2 { margin-bottom: 4px; }
.main .main-sec3 h2 p .tit-pt::before { display: none; }
.main .main-sec3 .sec-cont { display: grid; grid-template-columns: 305px auto; gap: 80px; align-items: end; }
.main .main-sec3 .partners-wrap ul { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(4, 80px); gap: 16px; }
.main .main-sec3 .partners-wrap ul .logo-box { width: 100%; height: 100%; border-radius: 20px; background-color: rgba(209, 228, 249, 0.12); }

@media screen and (max-width:1440px){
    .main .main-sec3  { margin-top: 190px; }
    .main .main-sec3 h2 { margin-bottom: 40px; }
    .main .main-sec3 .sec-cont { grid-template-columns: 23% calc(77% - 80px); }
    .main .main-sec3 .partners-wrap ul { grid-template-rows: repeat(4, 1fr); }
}
@media screen and (max-width:1280px){
    .main .main-sec3 { margin-top: 140px; }
    .main .main-sec3 .sec-cont { grid-template-columns: auto; }
    .main .main-sec3 .sec-cont .left-cont { max-width: 200px; position: absolute; right: 0; top: -19%; }
    .main .main-sec3 .partners-wrap ul { gap: 12px; }
    .main .main-sec3 .partners-wrap ul .empty { display: none; }
    .main .main-sec3 .partners-wrap ul .logo-box { border-radius: 16px; }
}
@media screen and (max-width:1024px){
    .main .main-sec3 .sec-cont .left-cont { max-width: 170px; top: -14%; }
}
@media screen and (max-width:768px){
    .main .main-sec3 .sec-cont .left-cont { max-width: 152px; top: -13%; }
    .main .main-sec3 .partners-wrap ul { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(5, 1fr); }
}
@media screen and (max-width:480px){
    .main .main-sec3 { margin-top: 100px; }
    .main .main-sec3 h2 { margin-top: 60px; margin-bottom: 60px; }
    .main .main-sec3 .sec-cont .left-cont { width: 120px; top: -1%; } 
    .main .main-sec3 .partners-wrap ul { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .main .main-sec3 .partners-wrap ul .logo-box { border-radius: 12px; }
}
/* main-sec3 E */


/* main-sec4 S */
.main .main-sec4 { margin-top: 240px; padding-bottom: 200px; }
.main .main-sec4 .sec-cont { display: grid; grid-template-columns: 64.73% 35.27%; gap: 32px; }

.main .main-sec4 .bd-tap-menu { position: relative; }
.main .main-sec4 .bd-tap-menu ul { display: flex; gap: 16px; }
.main .main-sec4 .bd-tap-menu ul a { display: block; padding-bottom: 16px; font: 400 24px/100% var(--font-family); color: var(--sub-black); }
.main .main-sec4 .bd-tap-menu li.on a { font-weight: 600; color: var(--sub-key-color); border-bottom: 3px solid var(--sub-key-color); } 
.main .main-sec4 .bd-href-wrap { width: 32px; position: absolute; right: 0; top: 0; }
.main .main-sec4 .bd-href-wrap > a { display: block; width: 32px; height: 32px; border-radius: 50%; font-size: 0; text-indent: -9999px; background: var(--sub-key-color) url('/resources/img/common/cmn_ico_outlink.svg') no-repeat center/17px 17px; position: absolute; }
.main .main-sec4 .bd-href-wrap > a.on { z-index: 10; }
.main .main-sec4 .bd-wrap { width: 100%; margin-top: 30px; position: relative; }
.main .main-sec4 .bd-wrap > .bd1 { min-height: 360px; background-color: #fff; position: relative; z-index: -1; }
.main .main-sec4 .bd-wrap > .bd2 { width: 100%; height: 100%; position: absolute; top: 0; background-color: #fff; z-index: -1; opacity: 0; }
.main .main-sec4 .bd-wrap > .bd1.active { z-index: 3; }
.main .main-sec4 .bd-wrap > .bd2.active { opacity: 0; animation: bdFadeIn 0.25s ease-in 0s 1 normal forwards; z-index: 5; }
.main .main-sec4 #notice { display: flex; flex-direction: column; gap: 12px; }
.main .main-sec4 #notice .txt_box { display: flex; justify-content: space-between; align-items: center; width: 100%; border-radius: 20px; padding: 40px 32px; border: 1px solid var(--border-color); transition: all 0.2s ease; }
.main .main-sec4 #notice .txt_box .tit { max-width: calc(100% - 132px); height: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 600 22px/40px var(--font-family); }
.main .main-sec4 #notice .txt_box .date { font: 400 18px/40px var(--font-family); color: var(--gray-deep); }
.main .main-sec4 #news { width: 100%; }
.main .main-sec4 #news .img { width: 100%; height: 0; padding-bottom: 84%; border-radius: 20px; overflow: hidden; margin-bottom: 12px; position: relative; }
.main .main-sec4 #news .img > img { width: 100%; height: 100%; object-fit: cover; position: absolute; }
.main .main-sec4 #news .tit { max-width: calc(100% - 12px); word-break: break-all; font: 600 20px/125% var(--font-family); } 
.main .main-sec4 #news .date { margin-top: 24px; font: 300 18px/100% var(--font-family); color: var(--gray-deep); }

@keyframes bdFadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

.main .main-sec4 .sec-cont .right-cont .event-thumb { width: 100%; aspect-ratio: 127/74; }
.main .main-sec4 .sec-cont .right-cont .event-thumb .img-box { width: 100%; height: 100%; border-radius: 30px; overflow: hidden; }
.main .main-sec4 .sec-cont .right-cont .event-thumb .img > img { width: 100%; height: 100%; object-fit: cover; }
.main .main-sec4 .sec-cont .right-cont .customer-box { display: flex; justify-content: space-between; margin-top: 12px; border-radius: 20px; background-color: #F5FAFF; padding: 32px 40px; }
.main .main-sec4 .sec-cont .right-cont .customer-box .tit { font: 600 20px/140% var(--font-family); margin-bottom: 16px; }
.main .main-sec4 .sec-cont .right-cont .customer-box .txt p { display: flex; justify-content: space-between; width: 160px; font: 400 18px/100% var(--font-family); letter-spacing: -0.36px; }
.main .main-sec4 .sec-cont .right-cont .customer-box .txt p + p { margin-top: 8px; }
.main .main-sec4 .sec-cont .right-cont .customer-box .txt p .bold { font-weight: 600; }
.main .main-sec4 .sec-cont .right-cont .customer-box a { display:  flex; flex-direction: column; align-items: center; gap: 24px; }
.main .main-sec4 .sec-cont .right-cont .customer-box .ico-box { width: 36px; height: 36px; }
.main .main-sec4 .sec-cont .right-cont .customer-box a .txt { font: 500 18px/24px var(--font-family); letter-spacing: -0.36px; color: var(--sub-black); } 

.main .main-sec4 .sec-cont .right-cont .event-swiper { width: 100%; aspect-ratio: 127 / 74; }
.main .main-sec4 .sec-cont .right-cont .swiper-controler { display: flex; gap: 12px; position: absolute; left: 40px; bottom: 40px; z-index: 10; }
.main .main-sec4 .sec-cont .right-cont .swiper-pagination-bullet { width: 10px; height: 10px; background-color: #fff; opacity: 0.5; }
.main .main-sec4 .sec-cont .right-cont .swiper-pagination-bullet-active { background-color: #fff; opacity: 1; }

.main .main-sec4 .warning-pop-wrap { width: 100%; height: 100vh; background-color: rgba(0,0,0,0.65); position: fixed; left: 0; top: 0; z-index: 400; display: none; }
.main .main-sec4 .warning-pop-wrap.active { display: block; }
.main .main-sec4 .warning-pop-wrap .warning-box { width: 96%; max-width: 560px; background-color: #fff; border-radius: 30px; padding: 56px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.main .main-sec4 .warning-pop-wrap .warning-box .btn-cls-box { display: block; width: 32px; height: 32px; position: absolute; right: 56px; top: 56px; }
.main .main-sec4 .warning-pop-wrap .warning-box .btn-cls-box > span { display: block; width: 100%; height: 2px; background-color: var(--gray-deep); position: absolute; left: 0; top: calc(50% - 1px); }
.main .main-sec4 .warning-pop-wrap .warning-box .btn-cls-box > span:nth-child(1) { transform: rotate(45deg); }
.main .main-sec4 .warning-pop-wrap .warning-box .btn-cls-box > span:nth-child(2) { transform: rotate(-45deg); }
.main .main-sec4 .warning-pop-wrap .warning-box .tit { font: 700 32px/100% var(--font-family); padding-bottom: 20px; border-bottom: 1px solid var(--sub-black); margin-bottom: 32px; }
.main .main-sec4 .warning-pop-wrap .warning-box .txt > span { display: block; font: 400 20px/140% var(--font-family); }
.main .main-sec4 .warning-pop-wrap .warning-box .btn-wrap { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; max-width: 412px; margin: 80px auto 0; }
.main .main-sec4 .warning-pop-wrap .warning-box .btn-wrap > a { display: block; width: 100%; padding: 20px 24px; border-radius: 12px; background-color: var(--point-color); color: #fff; font: 600 18px/100% var(--font-family); position: relative; }
.main .main-sec4 .warning-pop-wrap .warning-box .btn-wrap > a:last-child { background-color: var(--sub-key-color); }
.main .main-sec4 .warning-pop-wrap .warning-box .btn-wrap > a::after { content: ''; display: block; width: 17px; height: 17px; background: url('/resources/img/common/cmn_ico_outlink.svg') no-repeat center/contain; position: absolute; right: 24px; top: calc(50% - 9px); }

@media screen and (max-width:1440px){
    .main .main-sec4 .sec-cont { grid-template-columns: 62% calc(38% - 32px); }
    .main .main-sec4 #notice .txt_box .tit { height: 32px; font-size: 20px; line-height: 32px; }
    .main .main-sec4 #notice .txt_box .date { font-size: 17px; line-height: 32px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box { flex-wrap: wrap; justify-content: space-evenly; gap: 22px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box > .time { width: 100%; }
    .main .main-sec4 .sec-cont .right-cont .customer-box > .time .txt { display: flex; gap: 12px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .txt p { width: auto; gap: 4px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .txt p + p { margin-top: 0; }
    .main .main-sec4 .sec-cont .right-cont .customer-box a { gap: 8px; }
}
@media screen and (max-width:1280px){
    .main .main-sec4 { margin-top: 180px; }
    .main .main-sec4 .sec-cont { display: block; }
    .main .main-sec4 .bd-wrap > .bd2 { height: auto; }
    .main .main-sec4 #news li { padding-bottom: 32px; }
    .main .main-sec4 #news .date { margin-top: 8px; }
    .main .main-sec4 .sec-cont .right-cont { display: grid; grid-template-columns: 40% calc(60% - 24px); gap: 24px; margin-top: 24px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box { flex-wrap: nowrap; justify-content: space-between; align-items: center; margin-top: 0; }
    .main .main-sec4 .sec-cont .right-cont .customer-box > .time { width: auto; }
    .main .main-sec4 .sec-cont .right-cont .customer-box > .time .txt { display: block; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .txt p { width: 160px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .txt p + p { margin-top: 8px; }
}
@media screen and (max-width:1024px){
    .main .main-sec4 { margin-top: 160px; }
    .main .main-sec4 .bd-tap-menu ul a { font-size: 22px; }
    .main .main-sec4 .bd-wrap > .bd2 { height: 100%; }
    .main .main-sec4 #news .tit { font-size: 19px; }
    .main .main-sec4 #news .date { font-size: 17px; }
    .main .main-sec4 .sec-cont .right-cont { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .main .main-sec4 .sec-cont .right-cont .event-thumb .img-box { border-radius: 24px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box { flex-wrap: wrap; justify-content: space-evenly; padding: 32px 28px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box > .time { display: flex; justify-content: space-between; width: 100%; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .tit { font-size: 19px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .txt p { width: 140px; font-size: 17px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .ico-box { width: 28px; height: 28px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box a .txt { font-size: 17px; }
}
@media screen and (max-width:768px){
    .main .main-sec4 .bd-tap-menu ul a { font-size: 20px; padding-bottom: 12px; }
    .main .main-sec4 #notice .txt_box .tit { max-width: calc(100% - 110px); font-size: 19px; line-height: 24px; height: 24px; }
    .main .main-sec4 #notice .txt_box .date { font-size: 16px; line-height: 24px; }
    .main .main-sec4 #news { grid-template-columns: repeat(2, 1fr); }
    .main .main-sec4 #news .tit { font-size: 18px; }
    .main .main-sec4 #news .date { font-size: 16px; }
    .main .main-sec4 .sec-cont .right-cont { grid-template-columns: 60% calc(40% - 12px); }
    .main .main-sec4 .sec-cont .right-cont .customer-box { justify-content: flex-start; padding: 24px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box > .time { flex-direction: column; }
    .main .main-sec4 .sec-cont .right-cont .customer-box a { flex-direction: row; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .ico-box { width: 24px; height: 24px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .inquiry { display: none;  }
}
@media screen and (max-width:640px){
    .main .main-sec4 { overflow-x: hidden; }
    .main .main-sec4 .bd-tap-menu ul a { font-size: 19px; }
    .main .main-sec4 #notice .txt_box { padding: 32px 24px; }
    .main .main-sec4 #notice .txt_box .tit { max-width: calc(100% - 100px); font-size: 18px; }
    .main .main-sec4 #notice .txt_box .date { font-size: 14px; }
    .main .main-sec4 #news .img { padding-bottom: 72%; }
    .main .main-sec4 #news .date { font-size: 15px; }
    .main .main-sec4 .sec-cont .right-cont { display: block; }
    .main .main-sec4 .sec-cont .right-cont .event-swiper { max-width: 380px; overflow: visible; aspect-ratio: unset; }
    .main .main-sec4 .sec-cont .right-cont .event-thumb .img-box { border-radius: 20px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box { flex-wrap: nowrap; justify-content: space-evenly; gap: 16px; margin-top: 12px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box > .time { width: 35%; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .inquiry { display: block; }
    .main .main-sec4 .sec-cont .right-cont .customer-box a { flex-direction: column; }

    .main .main-sec4 .warning-pop-wrap .warning-box { padding: 40px; }
    .main .main-sec4 .warning-pop-wrap .warning-box .btn-cls-box { right: 40px; top: 34px; }
    .main .main-sec4 .warning-pop-wrap .warning-box .tit { font-size: 24px; padding-bottom: 30px; }
    .main .main-sec4 .warning-pop-wrap .warning-box .txt > span { font-size: 19px; }
    .main .main-sec4 .warning-pop-wrap .warning-box .btn-wrap > a { font-size: 17px; }
}
@media screen and (max-width:480px){
    .main .main-sec4 { margin-top: 110px; }
    .main .main-sec4 .sec-cont .left-cont { padding-top: 20px; }
    .main .main-sec4 #notice .txt_box { flex-direction: column; align-items: flex-start; padding: 28px 24px; }
    .main .main-sec4 #notice .txt_box .tit { width: 100%; max-width: unset; height: 48px; font-size: 17px; white-space: inherit; word-break: break-all; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
    .main .main-sec4 #notice .txt_box .date { line-height: 100%; margin-top: 6px; }
    .main .main-sec4 #news { grid-template-columns: repeat(1, 1fr); }
    .main .main-sec4 .bd-wrap { margin-top: 20px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box { flex-wrap: wrap; gap: 36px; padding: 40px 30px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box > .time { flex-direction: row; width: 100%; }
    .main .main-sec4 .sec-cont .right-cont .customer-box .txt p { width: 130px; font-size: 16px; }
    .main .main-sec4 .sec-cont .right-cont .customer-box a .txt { font-size: 16px; }

    .main .main-sec4 .warning-pop-wrap .warning-box { padding: 40px 30px; margin-bottom: 24px; }
    .main .main-sec4 .warning-pop-wrap .warning-box .txt > span { display: inline; }
    .main .main-sec4 .warning-pop-wrap .warning-box .btn-wrap { grid-template-columns: auto; margin-top: 60px; }
}



/* [필수] 인덱스 팝업 */
.divpop { position: fixed; background: #fff; border: 1px solid #eee; z-index: 9999; }
.divpop .close_box { padding: 5px; color: #000; border-top: 1px solid #eee; }
.divpop .close_box label { font-size: 12px; }
.divpop .close_box .close { float: right; padding-top: 3px; cursor: pointer; font-size: 14px; color: #999; }
@media screen and (max-width: 1200px){ 
    .divpop { left: 0px !important;} 
}
@media screen and (max-width: 768px){ 
    .divpop { width: 100% !important; height: auto !important; top: 0px !important; left: 0px !important; } 
}


/* 호버모음 */
@media (hover: hover) {
    .main .main-sec1 .right-cont .quick-box .quick-btn-wrap > a:hover { transform: translate(2px, 2px); }
    .main .main-sec1 .right-cont .quick-box:hover .img-box { animation: shaking 0.5s linear 0s 1 normal backwards; }
    .main .main-sec4 #notice .txt_box:hover { background-color: rgba(209, 228, 249, 0.08); }
}

@keyframes shaking {
    0% { transform: rotate(0); }
    25% { transform: rotate(-4deg);  }
    50% { transform: rotate(4deg); }
    75% { transform: rotate(-4deg); }
    100% { transform: rotate(4deg); }
}