/* 공통 css */
/* 이미지 깨짐현상 해결 */
img{
    backface-visibility: hidden;
    /* transform: skew(-0.1deg); */
    transform: translateZ(0);
    -webkit-font-smoothing: antialiased;
    /* -webkit-font-smooting:subpixel-antialiased; */
}
/* p{
    backface-visibility: hidden;
    transform: translateZ(0);
    -webkit-font-smoothing: antialiased;
    transform: skew(-0.1deg);
} */
.br-10{border-radius: 10px;}
/* .contents .content_inner {padding-top:6.2rem;} */
.scroll-wrapper { position: fixed; top: 0; left: 0;}
.scroll-wrapper:after { content: ''; position: absolute; top: 0; left: 0; height: 100vh; }
.scroll-wrapper .video_wrap { position: absolute; top: 0; left: 0; height: 100vh; z-index: 1; object-fit: cover;}
.scroll-wrapper .video_wrap img { min-width:100vw;min-height: 100vh;}
.scroll-wrapper .video_wrap:after { content: ""; position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,0.5);}
.scroll-wrapper > ul { position: relative; list-style: none; display: flex; padding: 0; margin: 0; z-index: 1; }
.scroll-wrapper > ul > li { position: relative; display: flex; box-sizing: border-box; height:calc(100vh - 121px);  margin-top: 71px; border:none; overflow: hidden;}
.scroll-wrapper > ul > li {min-width: 1440px;max-width: 1920px; width: 100vw;}
.scroll-wrapper > ul > li:first-child{min-width: 100vw !important;}
.scroll-wrapper > ul > li:last-child{min-width: 100vw !important;}

/* 일부 min-width 제어 */
.scroll-wrapper > ul > li.blockchain_sixth_li{min-width: 1550px;}
.scroll-wrapper > ul > li.blockchain_tote_li4 { min-width:2300px !important;}
.matbong .scroll-wrapper > ul > li.rental_li4{min-width: 3500px !important;}
.matbong .scroll-wrapper > ul > li.rental_li4 .bg_inner_3{max-width: 3500px;justify-content: start;}
.about_second_li{width: 200vw !important;max-width: 7000px !important;min-width: 5540px !important;}
.about_second_li .bg_inner{width: 200vw !important;max-width: 7000px !important;min-width: 5540px !important;}
.buliding_second_li{width: 200vw !important;max-width: 3600px !important;min-width: 2700px !important;}
.buliding_second_li .bg_inner_1{width: 200vw !important;max-width: 3600px !important;min-width: 2700px !important;}
.processor .rental_li2{min-width: 1617px;}
.processor .rental_li3{min-width: 1567px;}
.relax_maysin .service_li3 {min-width: 1900px;}
.relax_maysin .service_li3 .bg_inner_2{min-width: 1833px;}
.sales_service .service_li6 {min-width: 2400px;}
.beam_bunny .service_li2{min-width: 2250px !important;}
.bisium_program .service_li3{min-width: 3500px;}
/* 일부 min-width 제어 */

.scroll-wrapper > ul > li.center { }
.visual { display: flex; background: transparent; justify-content: center;}
.scroll-wrapper > ul > li .txt_obj { transform: translateY(100%); opacity: 0; transition: opacity 1.2s, transform 1.2s; color: #fff;}
.scroll-wrapper.start ul li .txt_obj { transform: translateY(0); opacity: 1;}
.scroll-wrapper > ul > li .txt_obj .line01 { font-size: 15px; font-weight: bold;}
.scroll-wrapper > ul > li .txt_obj .line02 { margin-top: 16px; font-size: 37px; font-weight: bold; line-height: 1.3; letter-spacing: -0.05rem; white-space: nowrap;}
.scroll-wrapper > ul > li .txt_obj .line03 { font-weight: 400; margin-top: 0; font-size: 20px; line-height: 35px;}
.scroll-wrapper > ul > li .txt_obj .line04 { font-weight: 400; margin-top: 2rem; font-size: 20px; line-height: 35px; }
.scroll-wrapper > ul > li .txt_obj .line05 { font-weight: 400; margin-top: 2rem; font-size: 20px; line-height: 35px;}
.scroll-wrapper > ul > li img { vertical-align: top;}
.scroll-wrapper > ul > li.visual.business_visual .txt_obj { text-align: center; margin-right:0; }

.white_li { justify-content: center; background-color: #fff !important;}
.white_li .txt_obj p { color:#000;}
.white_li .txt_obj .line01 { font-size: 25px !important; font-weight: bold; color:#1428A0}
.white_li .txt_obj .line02 { margin-top: 16px; font-size: 46px !important; font-weight: bold; line-height: 1.3; letter-spacing: -0.05rem; padding:0 0 20px;}
.white_li .border_txt { display: inline-block; border:1px solid #000;  border-radius: 20px; font-size:27px; font-weight: bold; line-height: 30px; padding:5px 15px; color:#000;}
.white_li .boxes { display: flex;}

.bg_inner {  display: flex; align-items: center; justify-content: center; width: 90vw; transform: scale(0.8);}
.bg_inner_1 {  display: flex;  justify-content: center; min-width: 90vw; max-width: 1440px; align-items: center; transform: scale(0.8); }
.bg_inner_2 {  display: flex;  justify-content: center; min-width: 90vw; max-width: 1440px; align-items: center; transform: scale(0.8); }
.bg_inner_3 {  display: flex;  justify-content: center; min-width: 90vw; max-width: 1440px; align-items: center; transform: scale(0.8); }

.first_li { width:100vw;}
.first_li .bg_inner { width:100vw; transform: scale(0.8);}
.first_li .bg_inner_1 { width:100vw; transform: scale(0.8);}
.first_li .bg_inner_2 { width:100vw; transform: scale(0.8);}
.first_li .bg_inner_3 { width:100vw; transform: scale(0.8);}

.last_li .bg_inner { width:100vw; transform: scale(0.8);}
.last_li .bg_inner { width:100vw; transform: scale(0.8);}
.last_li .bg_inner_1 { width:100vw; transform: scale(0.8);}
.last_li .bg_inner_2 { width:100vw; transform: scale(0.8);}
.last_li .bg_inner_3 { width:100vw; transform: scale(0.8);}

.z-index { z-index: -1;}
.z-index2 { z-index: -2;}

.mr-50 { margin-right:-50px}
.mr-100 { margin-right:-100px}
.mr-150 { margin-right:-150px}
.mr-200 { margin-right:-200px}
.mr-250 { margin-right:-250px}
.mr-300 { margin-right:-300px}
.mr-350 { margin-right:-350px}
.mr-400 { margin-right:-400px}

.boxes_1 { display: flex; flex-direction: column; justify-content: center;}
.boxes_2 { display: flex; justify-content: center; align-items: center;}
.txt_box1 { display:flex; flex-direction: column; justify-content:flex-start; margin-top:50px; padding-right:64px;}
.rental_box { display: flex; flex-direction: column; padding: 190px 0 0; justify-content: center;}
.rental_box2 { display: flex; padding: 250px 0 0; align-items: center;}

/* 이미지 css */
.imgboxes { width: 100%; height: 100%; align-items: center; justify-content: center; display: flex; flex-direction: column;}
.imgboxes .boxes_chil { width: 100%; height: 100%; align-items: center; justify-content: center;}
.imgboxes .boxes_chil .img_parent { width: 80%; height: 80%; display: flex; justify-content: center; align-items: center; flex-direction: column; }    
.imgboxes .boxes_chil .img { height: 100%;}    


/* 스크롤 모션효과 */
.contents.business .scroll-container { min-height: 100vh;}
.contents.business .scroll-container .bizMotion { transform: translate3d(7rem,0,0); opacity: 0; transition: all 0.75s ease-in-out;}
.contents.business .scroll-container .bizMotion.btm { transform: translate3d(0,10rem,0);}
.contents.business .scroll-container .bizMotion.action { transform: translate3d(0,0,0); opacity: 1;}

.scroll-container ul {transition: 0.2s;}


.how_to_use_txt{min-width: 460px;}/*맛봉 - 사용법 및 주의사항*/


/* 전체화면일때 */
@media screen and (min-height: 1079px) {
    .mr-50 { margin-right:0 !important;}
    .mr-100 { margin-right:0 !important;}
    .mr-150 { margin-right:0 !important;}
    .mr-200 { margin-right:0 !important;}
    .mr-250 { margin-right:0 !important;}
    .mr-300 { margin-right:0 !important;}
    .mr-350 { margin-right:0 !important;}
    .mr-400 { margin-right:0 !important;}
    .beam_bunny .service_li2{min-width: 2700px !important;}
}
@media screen and (max-width: 1600px) {
    /* .scroll-wrapper > ul > li.last_li { width:100vw !important} */
    /* .scroll-wrapper > ul > li:after { width: 100% !important; height:100% !important;} */
    /* .scroll-wrapper > ul > li.white_li { width:150vw;} */
    .mr-50 { margin-right:calc(-50px / 3)}
    .mr-100 { margin-right:calc(-100px / 3)}
    .mr-150 { margin-right:calc(-150px / 3)}
    .mr-200 { margin-right:calc(-200px / 3)}
    .mr-250 { margin-right:calc(-250px / 3)}
    .mr-300 { margin-right:calc(-300px / 3)}
    .mr-350 { margin-right:calc(-350px / 3)}
    .mr-400 { margin-right:calc(-400px / 3)}
}

@media screen and (max-width: 1200px) {
    /* .scroll-wrapper .video_wrap img { height:100vh;} */
    /* .scroll-wrapper > ul > li:nth-child(1) { width:100vw;} */
    li.box_txt_li p.txt_p2{ font-size: 15px !important; line-height: 19px !important; }
    li.box_txt_li p.txt_p1 { font-size: 30px !important; }
    li.box_txt_li span { font-size:25px !important; }
    .img_parent {  width: 80% !important; }
    /* br { display: none;} */
    .box_txt_li { margin: 0 25px !important;}
}

@media screen and (max-width: 1000px) {
    /* .scroll-wrapper > ul > li.white_li { width:200vw !important;} */
    /* .scroll-wrapper > ul > li:nth-child(1) { width:100vw;} */
}

@media only screen and (max-width: 768px) {
    /* 공통 */
    /* .scroll-wrapper > ul > li.white_li { width:100vw !important;} */
    /* .scroll-wrapper > ul > li { width:100vw !important} */
    li.box_txt_li p.txt_p2{ font-size: 15px; line-height: 19px; margin:0; }
    li.box_txt_li p.txt_p1 { font-size: 30px; }
    li.box_txt_li span { font-size:25px; }
    .img_parent { width: 80%; }
    .box_txt_li { display: flex; flex-direction: column; width:80% !important; margin: 25px 0 0 !important;}
    .boxes ul { flex-direction: column; align-items: center !important;}
    .boxes ul li~li { margin:50px 0 0 !important;}
    .boxes_1 { align-items: center;}
    .boxes_2 { flex-direction: column; align-items: center !important;}
    .boxes_2 ul { margin:20px 0 0 !important; }
    .scroll-wrapper { position: static;}
    .scroll-wrapper > ul { display: block;}
    /* .scroll-wrapper > ul > li {display: block; height: auto; margin-top:0; padding:100px 0;} */
    .scroll-wrapper .video_wrap {position: fixed; top: 0; left: 0;  }    
    /* .scroll-wrapper > ul > li.visual { width: auto; height: calc(100vh - 8rem); } */
    .contents.business .scroll-container .bizMotion { transform: translate3d(0,15rem,0); opacity: 0; transition: all .75s ease-in-out;}

    .img { transform: translate(0px) !important; width:100% !important; height:100% !important;}
    /* .scroll-wrapper > ul > li.visual { display: flex !important; height:100vh !important} */
    /* .scroll-wrapper > ul > li.franchise { display: flex !important; height:100vh !important}     */
    .white_li .boxes { flex-direction: column;}
    
    
    
}
@media only screen and (max-width: 500px) {
    .scroll-wrapper > ul > li {min-width: 320px !important;max-width: 100vw !important; width: 100vw !important;}
    .bg_inner_2{max-width: 100vw !important;}
}