@charset "utf-8";

#mainVisual{position:relative;z-index:1;height:0;padding:0 5%/*;background-color:#0c0c0c*/}
#mainVisual:before{content:'';position:absolute;bottom:0;right:50%;transform:translate(-218px);width:calc(50% - 218px);height:100px;background-color:#fff}

/*텍스트*/
#mainVisual li{opacity:0!important;}
#mainVisual li.swiper-slide-active{opacity:1!important;}
#mainVisual .txt_area{margin-left:-150px;padding-top:200px;opacity:0;font-family:'Pretendard-Medium'}
/* #mainVisual .txt_area p{font-family:'Pretendard-Medium'} */
#mainVisual .txt_area .stit{margin-bottom:15px;font-size:20px;line-height:20px;letter-spacing:1px;color:#999;font-family:'Outfit'}
#mainVisual .txt_area .tit{margin-bottom:130px;letter-spacing:-.3px;font-size:58px;line-height:75px;color:#222;font-family:'Paperozi';font-weight:100}
#mainVisual .txt_area .tit span{display:inline-block;width:80px}
#mainVisual .txt_area .tit b:first-child{font-weight:700}
#mainVisual .txt_area .tit b:last-child{font-weight:700;color:#0c0c0c}
#mainVisual .txt_area .pager{display:inline-block;line-height:200px;font-size:200px;font-weight:100;color:rgba(255,255,255,.1);font-family:'Outfit'}

/*이미지*/
#mainVisual .slide .img{overflow:hidden;position:absolute;left:50%;top:100px;z-index:-1;transform:translateX(-218px);width:calc(50% + 328px);height:calc(100% + 300px);margin-left:150px;opacity:0}
/* #mainVisual .slide li.box01 .img{background:url('/sh_img/index/main_banner/main-01.jpg') no-repeat}
#mainVisual .slide li.box02 .img{background:url('/sh_img/index/main_banner/main-02.jpg') no-repeat}
#mainVisual .slide li.box03 .img{background:url('/sh_img/index/main_banner/main-03.jpg') no-repeat} */

/*버튼*/
#main_banner #slide_btn{opacity:0;display:flex;position:absolute;z-index:10;left:50%;bottom:0;transform:translateX(-318px);width:200px;height:200px}
#main_banner #slide_btn:before{content:'';position:absolute;left:28px;bottom:30px;z-index:-1;transform: rotate(-45deg);width:144px;height:144px;background-color:#0c0c0c}
#main_banner #slide_btn:after{content:'';position:absolute;left:50px;bottom: 2px;z-index:-1;transform:rotate(45deg);width:1px;height:150%;background-color:rgba(255,255,255,.2);}
#main_banner #slide_btn div{transition:all .3s;width:100px;height:200px;line-height:200px;text-align:center;font-size:20px;color:rgba(255,255,255,.4);cursor:pointer}

/*스크롤*/
#scroll{opacity:0;position:absolute;bottom:44px;left:5%;z-index:1;font-size:16px;line-height:20px;letter-spacing:2px;color:#222;font-family:'Outfit'}
#scroll i{position:absolute;right:-20px;font-size:15px;animation:scroll 1.2s linear infinite}
@keyframes scroll{0%{transform:translate(0, -10px);opacity:1}100%{transform:translate(0, 10px);opacity:0}}

/* 모바일 호버 X */
@media (hover: hover) {
#main_banner #slide_btn div:hover{color:#dabb78}
}

/* 반응형 [s] */
@media (max-width:1920px){
/* #mainVisual{padding:0 0 0 3%} */
#mainVisual .txt_area{padding-top:170px}
#mainVisual .txt_area .stit{margin-bottom:20px}
#mainVisual .txt_area .tit{margin-bottom:0}
#mainVisual .txt_area .tit b:last-child{display:block;}
#mainVisual .slide .img{left:54%;height:calc(100% + 365px)}
}
@media (max-width:1230px){
#mainVisual .txt_area .stit{margin-bottom:35px;font-size:18px}
#mainVisual .txt_area .tit{margin-bottom:105px;line-height:80px}
#mainVisual .txt_area .pager{font-size:170px;line-height:170px}
#scroll{bottom:38px}
}

@media (max-width:1024px){
#mainVisual{padding:0}
/* #mainVisual:before{right:auto;left:0;transform:none;z-index:10;width:85px;height:85px} */
#mainVisual .swiper-wrapper{height:480px}
#mainVisual .txt_area{padding:78px 0 0 50px}
#mainVisual .txt_area .stit{margin-bottom:25px}
#mainVisual .txt_area .tit{margin-bottom:90px;font-size:70px;line-height:70px}
#mainVisual .txt_area .pager{float:right;margin-right:50px;font-size:130px;line-height:130px;color:rgba(255,255,255,.2)}
#mainVisual .slide .img{top:0;left:0;transform:none;width:100%;height:100%;background-size:cover !important}
#main_banner #slide_btn{left:0;transform:none;width:177px;height:177px}
#main_banner #slide_btn:before{left:25px;bottom:25px;width:120px;height:120px}
#main_banner #slide_btn div{width:85px;height:177px;line-height:177px}
#scroll{display:none}
}

@media (max-width:768px){
#mainVisual:before{width:68px;height:68px}
#mainVisual .swiper-wrapper{height:400px}
#mainVisual .txt_area{padding:50px 0 0 30px}
#mainVisual .txt_area .tit{font-size:50px;line-height:50px}
#mainVisual .txt_area .tit span{width:50px}
#mainVisual .txt_area .pager{margin-right:30px}
#main_banner #slide_btn{width:135px;height:135px}
#main_banner #slide_btn:before{left:20px;bottom:20px;width:95px;height:95px}
#main_banner #slide_btn:after{left:36px}
#main_banner #slide_btn div{width:68px;height:135px;line-height:135px}
}

@media (max-width:480px){
#mainVisual:before{width:57px;height:57px}
#mainVisual .swiper-wrapper{height:370px}
#mainVisual .txt_area{padding-left:0;text-align:center}
#mainVisual .txt_area .stit{font-size:16px}
#mainVisual .txt_area .tit{margin-bottom:100px;font-size:45px;line-height:45px}
#mainVisual .txt_area .tit span{width:0}
#mainVisual .txt_area .pager{margin-right:15px;font-size:80px;line-height:80px}
#main_banner #slide_btn{width:113px;height:113px}
#main_banner #slide_btn:before{left:17px;bottom:17px;width:80px;height:80px}
#main_banner #slide_btn:after{left:29px}
#main_banner #slide_btn div{width:57px;height:113px;line-height:113px}
}

@media (max-width:380px){
#mainVisual .swiper-wrapper{height:350px}
#mainVisual .txt_area .tit{font-size:37px;line-height:37px}
}
/* 반응형 [e] */