.btn{display:inline-block;width:185px;height:52px;font-size:17px;font-weight:500;line-height:50px;text-align:center;color:#fff;border:1px solid #fff;border-radius:25px;vertical-align:middle;box-sizing:border-box;transition:all .2s;}
 .btn:hover{color:#1a1a1a;background-color:#fff;}
  .fadein_left{position:relative;left:0;transform:translateX(-80px);opacity:0;transition:all 1.5s ease-in-out;}
 .fadein_right{position:relative;right:0;transform:translateX(80px);opacity:0;transition:all 1.5s ease-in-out;}
 .docSlider-current .fadein_left{transform:translateX(0);opacity:1;}
 .docSlider-current .fadein_right{transform:translateX(0);opacity:1;}
  .main{cursor:url(/images/www/main/cursor.png?build_20250630154435001) 20 20,auto;}
 .main .docSlider{color:#fff;background-color:#1a1a1a;}
 .main .docSlider-page{display:flex;align-items:center;justify-content:center;}
 .main .docSlider-pager{display:none;}
  .main_vis{position:relative;background:url(/images/www/main/main_bg_top.jpg?build_20250630154435001) no-repeat top center/cover;}
 .main_vis .inner{margin-top:100px;}
 .main_vis .swiper_slogan{float:left;width:430px;margin-top:184px;}
 .main_vis .swiper_slogan .tit{position:relative;top:0;left:0;font-size:60px;font-weight:700;line-height:1.2;animation:fade-out-right .5s both;}
 .main_vis .swiper_slogan .sub{position:relative;font-size:23px;font-weight:500;line-height:1.35;margin-top:52px;animation:fade-out-left .5s both;}
 .main_vis .swiper_slogan .swiper-slide-active .tit{animation:fade-in-down 1.5s both;}
 .main_vis .swiper_slogan .swiper-slide-active .sub{animation:fade-in-left 1.5s both .5s;}
 @keyframes fade-in-down{ 0%{top:-160px;left:0;opacity:0;}
 100%{top:0;left:0;opacity:1;}
 }
 @keyframes fade-out-right{ 0%{top:0;left:0;opacity:1;}
 100%{top:0;left:160px;opacity:0;}
 }
 @keyframes fade-in-left{ 0%{top:0;left:-160px;opacity:0;}
 100%{top:0;left:0;opacity:1;}
 }
 @keyframes fade-out-left{ 0%{top:0;left:0;opacity:1;}
 100%{top:0;left:-160px;opacity:0;}
 }
 .main_vis .swiper_vis{top:-36px;float:left;width:calc(100% - 736px);padding-top:36px;box-sizing:border-box;margin-left:150px;transition:all .2s;}
 .main_vis .swiper_vis .swiper-slide{position:relative;top:0;transition:top .4s;}
 .main_vis .swiper_vis .swiper-slide:hover{top:-36px;}
 .main_vis .swiper_vis .swiper-slide:hover .img img{transform:scale(1.1);}
 .main_vis .swiper_vis .img{width:100%;height:502px;border-radius:32px;overflow:hidden;}
 .main_vis .swiper_vis .img img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
 .main_vis .swiper_vis .sum .tag{display:block;font-size:16px;font-weight:600;color:#ff5925;margin-top:24px;}
 .main_vis .swiper_vis .sum .tit{display:block;font-size:18px;font-weight:600;color:#fff;margin-top:10px;word-break:break-all;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
 .main_vis .swiper_vis .sum .sub{display:block;font-size:15px;font-weight:500;color:#888;margin-top:10px;}
 .main_vis .control_box{display:flex;align-items:center;justify-content:center;margin-top:55px;}
 .main_vis .control_box button{width:40px;height:40px;border:1px solid #fff;border-radius:100%;background-color:transparent;background-image:url(/images/www/main/sp_main.png?build_20250630154435001);background-repeat:no-repeat;box-sizing:border-box;text-indent:-9999px;transition:bacground-color .2s;}
 .main_vis .control_box button.btn_prev{background-position:-308px -14px;margin-left:30px;}
 .main_vis .control_box button.btn_next{background-position:-356px -14px;margin-left:10px;}
 .main_vis .control_box button:hover{background-color:#fff;}
 .main_vis .control_box button.btn_prev:hover{background-position:-410px -14px;}
 .main_vis .control_box button.btn_next:hover{background-position:-458px -14px;}
 .main_vis .control_box .page_num{display:flex;align-items:center;}
 .main_vis .control_box .page_num .current, .main_vis .control_box .page_num .total{display:inline-block;width:22px;font-size:17px;font-weight:600;text-align:center;}
 .main_vis .control_box .vis_bar{display:inline-block;width:180px;height:2px;margin:0 18px;}
 .main_vis .control_box .vis_bar span{display:none;cursor:default;margin:0;}
 .main_vis .control_box .vis_bar span.swiper-pagination-bullet-active{position:relative;display:block;width:100%;height:100%;border-radius:0;background-color:#fff;}
 .main_vis .control_box .vis_bar span.swiper-pagination-bullet-active::before{position:absolute;top:0;left:0;content:'';display:block;width:0;height:2px;background-color:#ff5925;animation:progress-line 5s ease-in-out 0s 1 forwards;}
 .main_vis .control_box .vis_bar span.swiper-pagination-bullet-active::after{position:absolute;top:50%;left:0;transform:translateY(-50%);content:'';display:block;width:8px;height:8px;border-radius:100%;background-color:#ff5925;animation:progress-circle 5s ease-in-out 0s 1 forwards;}
 @keyframes progress-line{ 0%{width:0;}
 100%{width:100%;}
 }
 @keyframes progress-circle{ 0%{left:0;}
 100%{left:99%;}
 }
  .main_reason{overflow:hidden;}
 .main_reason::before{position:absolute;top:340px;transform:translateY(40px);right:-16px;content:'YUBI SERVICE';display:block;font-size:180px;font-weight:800;color:#fff;opacity:0;transition:all .5s ease-in-out .5s;}
 .main_reason.docSlider-current::before{transform:translateY(0);opacity:.06;}
 .main_reason .txt .tit{font-size:32px;}
 .main_reason .txt .sub{font-size:45px;line-height:1.3;margin-top:15px; font-weight: 300;}
 .main_reason .txt .sub b{display:block;font-size:55px;font-weight:700;}
 .main_reason .list{display:flex;align-items:flex-end;justify-content:space-between;margin-top:56px;}
 .main_reason .list li{position:relative;width:30%;min-height:352px;border:1px solid transparent;border-radius:24px;padding:150px 40px 47px;box-sizing:border-box;overflow:hidden;margin-top:64px;transition:all .4s;}
 .main_reason .list li::before{position:absolute;top:0;left:0;content:'';display:block;width:100%;height:100%;background-repeat:no-repeat;background-position:top center;background-size:cover;z-index:0;}
 .main_reason .list li::after{position:absolute;top:0;left:0;content:'';display:block;width:100%;height:100%;background:linear-gradient(180deg, rgba(102,102,102,.46) 0%, rgba(0,0,0,.8) 100%);z-index:1;}
 .main_reason .list li.list_01::before{background-image:url(/images/www/main/reason_01.jpg?build_20250630154435001);}
 .main_reason .list li.list_02::before{background-image:url(/images/www/main/reason_02.jpg?build_20250630154435001);}
 .main_reason .list li.list_03::before{background-image:url(/images/www/main/reason_03.jpg?build_20250630154435001);}
 .main_reason .list li:hover{min-height:416px;background-image:linear-gradient(#1a1a1a, #1a1a1a), linear-gradient(180deg, #fff 0%, #ff5925 100%);background-origin:border-box;background-clip:content-box, border-box;padding-top:214px;margin-top:0;}
 .main_reason .list li span{position:relative;display:block;z-index:2;}
 .main_reason .list li span.tit{font-size:27px;font-weight:700;}
 .main_reason .list li span.sub{font-size:17px;line-height:1.4;margin-top:35px;}
  .main_photo .inner{position:relative;width:90%;padding:0;margin:0 5%;}
 .main_photo .tab{display:flex;width:780px;margin:0 auto;}
 .main_photo .tab::before{position:absolute;top:0;left:50%;transform:translateX(-50%);content:'';display:block;width:770px;height:56px;border-radius:30px;background-color:#fff;z-index:-1;}
 .main_photo .tab_box{width:25%;}
 .main_photo .tab_box:first-child .tab_tit a{border-radius:28px 0 0 28px;}
 .main_photo .tab_box:last-child .tab_tit a{border-radius:0 28px 28px 0;}
 .main_photo .tab_box.on .tab_tit a{color:#fff;border-radius:28px;background-color:#ff5925;}
 .main_photo .tab_tit a{display:block;height:56px;font-size:17px;line-height:56px;text-align:center;background-color:#fff;}
 .main_photo .tab_tit a span{position:absolute;top:-9999em;left:0;user-select:none;font-size:1rem;}
 .main_photo .tab_cnt{position:absolute;top:120px;left:50%;transform:translateX(-50%);width:1500px;}
 .main_photo .txt{float:left;width:475px;}
 .main_photo .txt .tit{font-size:55px;font-weight:700;margin-top:22px;}
 .main_photo .txt .sub{font-size:35px;font-weight:300;letter-spacing:-.5px;line-height:1.3;margin-top:58px;}
 .main_photo .txt .sub b{display:block;font-weight:600;color:#ff5925;}
 .main_photo .txt .exp{font-size:30px;font-weight:500;line-height:1.4;color:#999998;margin-top:22px;}
 .main_photo .txt .btn{margin-top:58px;}
 .main_photo .tab_box:nth-child(even) .img li{width:62%;}
 .main_photo .tab_box:nth-child(even) .img li + li{width:calc((38% - 25px));}
 .main_photo .img{float:left;width:calc(100% - 570px);max-width:930px;margin-left:95px;}
 .main_photo .img li{float:left;width:50%;overflow:hidden;}
 .main_photo .img li + li{width:calc(50% - 25px);margin-left:25px;}
 .main_photo .img li img{transform:scale(1);display:block;transition:transform .5s;}
 .main_photo .img li img:hover{transform:scale(1.05);}
 .main_photo .img li span{display:block;width:100%;border-radius:24px;overflow:hidden;}
 .main_photo .img li span + span{margin-top:25px;}
 .main_photo .img_chromakey li:nth-child(1) span:first-child, .main_photo .img_photocar li:nth-child(1) span:first-child{margin-left:auto;}
 .main_photo .img_dual li:nth-child(1) img{margin-top:36px;}
 .main_photo .img_photocar li:nth-child(2) span{margin-top:168px;}
 .main_photo .fade_effect{position:relative;left:0;transform:translateX(-80px);opacity:0;transition:all 1.5s ease-in-out;}
 .main_photo .fade_effect.on{transform:translateX(0);opacity:1;}
 /*.main_photo .tab_box .txt, .main_photo .tab_box .img{position:relative;left:0;transform:translateX(-80px);opacity:0;transition:all .5s ease-in-out .5s;}
 .main_photo .tab_box.on .txt, .main_photo .tab_box.on .img{transform:translateX(0);opacity:1;}
*/  .main_news{overflow-x:hidden;}
 .main_news::before{position:absolute;bottom:44px;left:0;content:'YUBI News';display:block;font-size:180px;font-weight:800;line-height:.7;color:#fff;transform:translateX(-40px);opacity:0;transition:all .5s ease-in-out .5s;}
 .main_news.docSlider-current::before{transform:translateX(0);opacity:.1;}
 .main_news h2.tit{font-size:35px;font-weight:300;line-height:1.2;}
 .main_news h2.tit b{font-weight:600;}
 .main_news .swiper{margin-top:36px;overflow:inherit;}
 .main_news .swiper-slide{width:350px;}
 .main_news .swiper-slide span{display:block;}
 .main_news .swiper-slide .img{width:100%;height:230px;border-radius:24px;overflow:hidden;}
 .main_news .swiper-slide .img img{transform:scale(1);width:100%;height:100%;object-fit:cover;transition:transform .5s;}
 .main_news .swiper-slide .img img:hover{transform:scale(1.05);}
 .main_news .swiper-slide .tit{height:50px;font-size:18px;font-weight:500;line-height:1.38;color:#fff;margin-top:35px;word-break:keep-all;white-space:normal;text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
 .main_news .swiper-slide .sub{font-size:16px;font-weight:300;line-height:1.56;color:#777;margin-top:15px;}
 .main_news .btn{position:relative;display:block;margin:70px auto 0;}
  .main_hope{display:block !important;}
 .main_hope .hope{background:url(/images/www/main/main_bg_bot.jpg?build_20250630154435001) no-repeat top center/cover;padding-top:200px;padding-bottom:475px;box-sizing:border-box;}
 .main_hope .hope .tit{font-size:45px;font-weight:500;line-height:1.2;}
 .main_hope .hope .sub{font-size:31px;font-weight:500;margin-top:10px;opacity:.5;}
 .main_hope .hope .btn_box{margin-top:70px;}
 .main_hope .hope .btn_box .btn{margin-right:15px;}
 .main_hope .hope .btn_box .btn:hover{color:#fff;border-color:#101010;background-color:#1a1a1a;}
 .main_hope .hope .btn_box .btn_blog, .main_hope .hope .btn_box .btn_insta, .main_hope .hope .btn_box .btn_youtube{display:inline-block;width:52px;height:52px;border:1px solid #fff;border-radius:100%;background-image:url(/images/www/main/sp_main.png?build_20250630154435001);background-repeat:no-repeat;vertical-align:middle;text-indent:-9999px;margin-right:5px;transition:all .2s;}
 .main_hope .hope .btn_box .btn_blog:hover, .main_hope .hope .btn_box .btn_insta:hover, .main_hope .hope .btn_box .btn_youtube:hover{border-color:#1a1a1a;background-color:#1a1a1a;}
 .main_hope .hope .btn_box .btn_blog{background-position:-511px -6px;}
 .main_hope .hope .btn_box .btn_insta{background-position:-578px -7.5px;}
 .main_hope .hope .btn_box .btn_youtube{background-position:-643px -7px;}
 @media screen and (max-width:1650px){ .main_photo .tab_cnt{width:100%;}
 }
 @media screen and (max-width:1500px){ .main_vis .swiper_vis{width:calc(95% - 586px);margin-left:5%;}
 }