@charset "utf-8";

#mainVisual{overflow:hidden;position:relative}
#mainVisual .pl{white-space:pre-line}

#mainVisual .top{display: flex; justify-content: space-between;align-items: flex-end; margin-bottom: 35px;}
#mainVisual .top p{font-size: 16px; font-weight: 400; }
#mainVisual .top p:last-child{text-align: right; list-style: 1.5;}

#mainVisual .main_menu{position:absolute;bottom:0;z-index:3;width:100%;height:110px;background-color:rgba(0, 0, 0, 0.4);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(8px)}
#mainVisual .main_menu .main_tab{width:100%;max-width:1500px;margin:0 auto}
#mainVisual .main_menu .main_tab ul{display:grid;grid-template-columns:repeat(4, 1fr)}
#mainVisual .main_menu .main_tab ul li{transition:all 0.3s}
#mainVisual .main_menu .main_tab ul li a{display:flex;padding:36px;color:#fff;font-size:18px;font-weight:600;justify-content:space-between;align-items:center}
#mainVisual .main_menu .main_tab ul li a .left{display:flex;align-items:center;gap:30px}
#mainVisual .main_menu .main_tab ul li a .right svg{width:20px;transition:all 0.2s}


/* 스와이퍼 */
#mainVisual .main_slide{width:100%;height:100vh; position: relative;}
#mainVisual .main_txt{letter-spacing: -.5px; color: #fff; width: 100%; text-align: center; position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); }
#mainVisual .main_txt h1{margin-top: 13px; font-size: 75px;font-weight: 800; }
#mainVisual .main_txt p{font-size: 26px;margin-top: 15px; margin-bottom: 47px;}
#mainVisual .main_txt a{ color: #fff;font-size: 15px;background-color: #fff3; border: 1px solid #fff;--tw-backdrop-blur: blur(4px);padding: 15px 24px; border-radius: 100px;    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);}
#mainVisual .main_txt i{margin-left: 6px;}

#mainVisual .main_slide ul{height:100%}
#mainVisual .main_slide ul li{width:100%;height:100%;background:no-repeat;background-size:cover}
#mainVisual .main_slide ul li.bg01{background-image:url('./main01.jpg')}
#mainVisual .main_slide ul li.bg02{background-image:url('./main03.jpg')}
#mainVisual .main_slide ul li.bg03{background-image:url('./main02.jpg')}
#mainVisual .main_banner video {width: 100%;filter: brightness(0.5);object-fit: cover;height: 100vh;}


#mainVisual .main_slide ul{height:100%}
#mainVisual .main_slide ul li{width:100%;height:100%;background:no-repeat;background-size:cover}

#mainVisual .main_banner video {width: 100%;filter: brightness(0.5);object-fit: cover;height: 100vh;}

.swiper-pagination-bullet{height: 11px; width: 11px;}
.swiper-button-next{right: 3% !important;}
.swiper-button-prev{left: 3% !important;}

.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
bottom: 15px;    
}
#sh_container .swiper-pagination-bullet{
    background: #fff !important;
}
.swiper-pagination-bullet-active{
    background: #44ae35 !important;
}

/* 반응형 [s] */
@media(hover:hover){
#mainVisual .main_txt .txt_box .left .more_btn:hover{color:#fff;background:var(--primary)}
#mainVisual .main_menu .main_tab ul li:hover{background:var(--primary)}
#mainVisual .main_menu .main_tab ul li:hover a .right svg{transform:rotate(90deg)}
}
@media (max-width:1024px){
#mainVisual .main_slide{height:780px}
#mainVisual .main_txt{width:95%;font-size:40px}
#mainVisual .main_txt .txt_box .left{line-height:1em;}
#mainVisual .sub_txt{margin:0; font-size:28px;}
#mainVisual .main_txt .txt_box .left:after{width:250px}
#mainVisual .main_txt .txt_box .right .more_btn{width:160px;font-size:14px;line-height:55px}
#mainVisual .main_txt .bot_txt{margin-top:15px}
#mainVisual .main_menu .main_tab ul li a{justify-content:center;padding:40px;font-size:16px}
#mainVisual .main_menu .main_tab ul li a .left{gap:10px}
#mainVisual .main_menu .main_tab ul li a .left img{width:30%}
#mainVisual .main_menu .main_tab ul li a .right svg{width:18px}
#mainVisual .main_banner video {width: 100%;filter: brightness(0.5);object-fit: cover;height:780px;}
}
@media (max-width:768px){  
#mainVisual .main_slide{height:580px}

#mainVisual .main_txt h1{font-size: 23px;}
#mainVisual .main_txt p{font-size: 12px;margin-top: 7px;margin-bottom: 12px;}
#mainVisual .main_txt a{font-size: 11px;padding: 8px 12px;}
#mainVisual .main_txt > img{width: 28%;}

#mainVisual .main_txt .txt_box{flex-direction:column;align-items:center;line-height:1.5}
#mainVisual .main_txt .txt_box .right{display:flex;flex-direction:column;align-items:center}
#mainVisual .main_txt .txt_box .right .more_btn{ width:200px;font-size:14px;line-height:48px}
#mainVisual .main_txt .txt_box .left:after{display:none} 
#mainVisual .main_txt .txt_box .left .more_btn{margin-top:26px;}
#mainVisual .main_txt .bot_txt{font-size:15px;word-break:keep-all}
#mainVisual .main_txt .bot_txt:after{display:none}
#mainVisual .pl{white-space:normal;text-align:center}
#mainVisual .main_menu .main_tab ul li a{padding:40px 5px;font-size:15px}
#mainVisual .main_menu .main_tab ul li a .left img{width:29%}
#mainVisual .main_banner video {width: 100%;filter: brightness(0.5);object-fit: cover;height:580px;}
#mainVisual .main_txt .main_img{width: 65%;}
#mainVisual .top{display: none;} 
#mainVisual .main_slide ul li.bg01{background-position: center 37%;    background-size: 275% auto;}

.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom: 20px;}
.swiper-pagination-bullet{width: 8px; height: 8px;}
}


@media (max-width:540px){
#mainVisual .main_slide{height:450px}
#mainVisual .main_menu{display:none}
#mainVisual .main_txt{font-size:24px}
#mainVisual .sub_txt{margin-top:5px; font-size:18px; word-break:keep-all;}
#mainVisual .main_txt .txt_box .right .more_btn{width:160px;font-size:13px;line-height:34px}
#mainVisual .main_txt .txt_box .left .more_btn{margin-top:30px; width:130px; line-height:35px; font-size:12px; gap:5px;}
#mainVisual .main_txt .bot_txt{margin-top:10px; padding:0px 20px;font-size:12px} 
#mainVisual .main_txt .bot_txt:after{left:22px}
#mainVisual .main_banner video {width: 100%;filter: brightness(0.5);object-fit: cover;height:450px;}
}
@media (max-width:480px){
#mainVisual .main_banner video {width: 100%;filter: brightness(0.5);object-fit: cover;height:450px;}
}
@media (max-width:380px){
#mainVisual .main_slide{height:375px}
#mainVisual .main_txt{font-size:20px}
#mainVisual .sub_txt{font-size:16px;}
#mainVisual .main_txt .bot_txt{padding:0px 10px;}
#mainVisual .main_txt .bot_txt:after{left:14px}
}
/* 반응형 [e] */

