@media (min-width: 2000px) { .home1 .intr p{ max-width: 100%; } } @media screen and (max-width: 1880px) { } @media screen and (max-width: 1520px) { } @media screen and (max-width: 1366px) { } @media screen and (max-width: 1250px) { /* 60px 3.125vw */ .home3 .txtb span, .home1 .intr h1 { font-size: 36px; } /* 57px 2.969vw */ .so5 .intr span, .so5 .intr b, .home3 .ev span, .home3 .ev b { font-size: 35px; } /* 48px 2.5vw */ .banner .intr h2, .t1 h2, .t2 h2 { font-size: 30px; } /* 40px 2.083vw */ .home2 .pic h3, .ab1 .intr h3 { font-size: 24px; } /* 36px 1.875vw */ .t2 h4, .re1 .txt h4, .t3 h4, .ab2 .intr h4, .ab6 .intr h4 { font-size: 22px; } /* 28px 1.458vw */ .banner .intr h4, .contact .intr h4, .pr3 .intr h4, .pr7 .intr h4, .pr12 .txt h4, .pr16 .intr h4, .pr17 .intr h4, .so6 .intr h4, .ab3 .intr h4, .ab5 .row1 h5, .home4 .intr h4, .home5 .intr h4 { font-size: 20px; } /* 26px 1.354vw */ /* 24px 1.25vw */ .pr2 .col h5, .pr14 .intr h4, .ne2 .title h5, .ab6 .intr p { font-size: 18px; } /* 22px 1.146vw */ .ab2 .intr h5, .so14 .intr h6 { font-size: 18px; } /* 20px 1.042vw */ .so8 .name p, .so8 .name i { font-size: 18px; } /* 18px 0.938vw */ .home3 .ev p, .pr2 .ev h6, .so5 .intr p, .pr3 .intr h5, .so1 .intr h6, .pr6 .intr p, .pr6 .intr span, .pr9 .name span, .so7 .intr h6, .pr13 .intr h6, .pr16 .intr h5, .so2 .intr p, .so3 .intr h6, .so4 .intr h6, .so9 .intr p, .so10 .intr h6, .so11 .pic h6, .ne1 .intr h6, .ne3 .intr p, .fixed-video .close i, .ab3 .date, .ab3 .date-btn span, .ab4 .intr p, .ab5 .row2 h5 { font-size: 16px; } /* 16px 0.833vw */ .footer .f-cont h4, .footer .f-cont p, .home5 .intr p, .header .link .li > span, .home4 .intr p, .t2 p, .home3 .t1 p, .swiper-txt span, .swiper-btns .btns span, .home1 .intr p, .home2 .intr p, .load > div p, .home3 .txtb p, .pr2 .sub span, .contact .cont1 span, .footer .f-menu p, .footer .f-ewm h6, .banner .play span, .navnew .sub span, .pr3 .intr p, .pr3 .intr h6, .pr4 .intr p, .pr7 .intr p, .more span, .more i, .more1 span, .more1 i, .more2 span, .more2 i, .more3 span, .more3 i, .so8 .work p, .pr9 .intr p, .so7 .intr p, .pr11 .intr p, .swiper-btn i, .pr12 .txt p, .pr13 .intr p, .pr14 .intr p, .pr16 .intr p, .pr17 .intr p, .so3 .intr p, .so4 .intr p, .so6 .intr p, .so10 .intr p, .so11 .intr p, .re1 .txt h6, .re1 .txt p, .ne1 .intr p, .pagelist .page a, .pagelist .page i, .navigate a, .navigate span, .ne2 .title p, .ne2 .word p, .banner .intr p, .ab1 .intr p, .ab5 .row1 h6, .ab5 .row1 p, .ab5 .row2 h6, .ab8 .txt h6, .ab8 .sub span, .co1 span, .co1 .input-sub li, .so14 .intr p, .contact .cont2 span, .pr6 .col .pic p { font-size: 14px; } /* 14px 0.729vw */ .re1 .sub p, .header .downmenu a, .look span, .look i, .pr2 .ev p, .footer .f-menu a, .footer .f-cont h6, .footer .footB p, .footer .footB a, .footer .f-ewm p, .so1 .intr p, .so7 .swiper2 .ev, .pr16 .swiper2 .ev, .so6 .swiper2 .ev, .ne1 .intr .date, .ne1 .plan p, .ne1 .plan span, .ne1 .tag span, .ne1 .txt h6, .ne2 .turnpage .turn, .ab3 .intr p, .ab5 .txt p, .ab8 .txt p, .share .intr span, .share .phone p { font-size: 12px; } .more, .more1, .more2, .more3 { width: 120px; height: 40px; } .more1 .em { width: 20px; height: 20px; } .swiper-btns .dots { width: 15px; height: 15px; } .swiper-btns .dots::before { width: 6px; height: 6px; } .swiper-btn, .swiper-btn2 { width: 30px; height: 30px; } .pagelist .page { width: 30px; height: 30px; } .ab1 .play { width: 30px; height: 30px; } .ab1 .play::after { width: 45px; height: 45px; } .ab3 .date-btn { width: 65px; height: 30px; } .so14 .cont { width: 100px; height: 35px; margin: 0 5px; } .header .link .li > img { width: 14px; margin-right: 3px; } .banner .intr h2::after, .ab2 .intr h4::after, .ab5 .row1 h6::before { width: 15px; height: 1px; } .t2 em { width: 15px; height: 1px; } .footer .f-menu em, .pr3 .intr em, .pr16 .intr em { width: 5px; height: 1px; } .re1 .sub em, .re1 .txt em, .ab5 .intr em { width: 4px; height: 4px; } .fixed-video .close { width: 30px; height: 30px; top: -10px; right: -10px; } .banner .play .img { width: 25px; height: 25px; } .banner .play .img::after { width: 40px; height: 40px; } .navnew .sub { padding: 10px 20px; } .so5 .intr p { max-width: 90%; } .pr4 .pic { width: 40px; height: 40px; } .ne1 .tag { width: 14px; height: 14px; } .pr4 .col { width: 33%; padding: 0 !important; } .ne1 .plan { width: calc(100% - 20px); } .pr9 .intr p::before { top: 8px; width: 4px; height: 4px; } .pr13 .col { width: 30%; } .pr16 .intr { width: 100%; } .so9 .col { width: 18%; } .so9-1 .col { width: 28%; } .so11 .t2 { width: 100%; text-align: center; } .so11 .row { width: 100%; margin: 1.823vw 0 0; } .so11 .col { margin: 0 0 20px !important; } .ab3 .swiper1 .swiper-slide, .ab3 .swiper2 .swiper-slide { width: 30vw !important; } .ab4 .swiper-slide { width: 25vw; } .ab7 .swiper-pagination-bullet { width: 6px; height: 6px; } .t2 h2::before { left: -10px; width: 10px; height: 10px; border-top: 1px solid #0bb798; border-left: 1px solid #0bb798; } .t2 h2::after { right: -10px; width: 10px; height: 10px; border-bottom: 1px solid #0bb798; border-right: 1px solid #0bb798; } .header { height: 60px; background: #000000; } .home .header { background: transparent; } .header .before { display: block; } .header .after { display: none; } .banner { margin: 60px 0 0; } .co1 input { height: 35px; } .btn { width: 80px; height: 35px; } .so8 .col { margin: 0 0 20px; } .contact .cont { width: 100px; height: 35px; margin: 0 5px; } .contact .cont img { width: 16px; } .pr7 .intr { width: 50%; } .home5 .swiper-slide { width: 30vw !important; } .pr12 .swiper-slide { width: 30vw !important; } .ne1 .col-r, .re1 .col-l { top: 120px; } .ab7 .pic { height: 80px; } .home5 .txt:first-child { transform: translateY(80px); } .home5 .txt:last-child { transform: translateY(-80px); } .header .logo img { width: 120px; } .home2 .pic img { width: 35px; } .home4 .pic img { width: 80px; } .so1 .icon img { width: 15px; height: 15px; } .pr9 .name { height: 35px; } .pr12 .img { width: 35px; } .pr12 .txt { width: calc(100% - 45px); } .so9 .pic img, .so2 .pic img { width: 30px; height: 30px; } .so10 .pic, .so3 .pic, .so11 .pic .img { width: 30px; } .so10 .intr, .so3 .intr, .so11 .pic h6 { width: calc(100% - 40px); } .t1 h2::before { left: -10px; width: 5px; border-top: 4px solid #0bb798; border-bottom: 4px solid #ffffff; } .home2 .intr { padding-left: 45px; } .pr3 .t2 { position: static; top: 0; margin: 40px 0 0; } .pr3 .t2 h2 { color: #000000; } .pr3 .intr { bottom: auto; width: 90%; left: 50%; top: 50%; transform: translate(-50%, -50%); } .pr3 .row { margin: 1.823vw 0 0; } .sidebar { width: 60px; } .share .ewm { width: 80px; height: 80px; } .share .ewm { left: -100px; } .share:hover .ewm { left: -90px; } .share .phone { width: 120px; } .share .phone { left: -140px; } .share:hover .phone { left: -130px; } .scrollup { width: 40px; height: 40px; right: 30px; } .ab8 .cont { width: 200px; border-radius: 5px; padding: 10px; } .ab8 .sub { width: 80px; height: 30px; } .navnew { top: 60px; } } @media screen and (max-width: 991px) { .home3 .col { flex-direction: column-reverse; } .navnew, .footer .f-menu, .header .menu { display: none; } .header .toggle { display: block; } .header .wap-sub { display: block; } .menu.on { opacity: 1; visibility: visible; } .header .link { width: 100%; padding: 0 5%; height: auto; margin: 10px 0 !important; flex-wrap: wrap; } .header .link .li { width: 100%; justify-content: flex-start; } .header .link .li > img { display: none; } .header .downmenu, .header .link:hover .downmenu { display: none; width: 100%; position: static; top: 0%; box-shadow: none; max-width: 100%; min-width: 100%; } .header .downmenu a { text-align: left; padding: 5px 15px; } .footer .f-cont { width: 65%; } .footer .f-ewm { width: 25%; } .contact { padding: 4.427vw 5%; } .header .row, .footer .row { padding: 0 5%; } .home2 .row, .home3 .row, .home4 .row { padding: 12.24vw 5%; } .home5 .row { padding: 12.24vw 5% 0; } .home6 .row { padding: 5.208vw 5%; } .pr1, .pr2, .pr6, .pr9, .pr11, .pr13, .pr14, .pr16, .pr17, .so1, .so4, .so6, .so7, .so9, .ne1, .re1, .ab1, .ab7 { padding: 6.25vw 5%; } .so3, .so10 { padding: 6.25vw 5% 4.167vw; } .ne3 { padding: 0 5% 6.25vw; } .ab3 { padding: 6.25vw 0 0 5%; } .pr4 { padding: 6.25vw 5% 4.688vw; } .ab4 .row { padding: 0 0 0 5%; } .ab5 .row1, .ab5 .row2 { padding: 0 5%; } .ne2, .co1 { padding: 100px 5% 6.25vw; } .pr7 { padding: 6.25vw 5% 3.646vw; } .so8 { padding: 6.25vw 5% 5.208vw; } .so11 { padding: 6.25vw 5% 0; } .so14 { padding: 6.25vw 5%; } .pr12 .intr { left: 5%; } .ab3 .swiper-button { right: 5%; } .ab3 .swiper2 { padding-right: 5%; } .pr12 .swiper-button { margin: 20px 0 0; } .contact .intr { width: 100%; text-align: center; margin: 0 0 1.563vw; } .contact .pic { width: 100%; } .pr2 .col-l { display: none; } .pr2 .col-r { width: 100%; } .so5 .col, .so2 .col { width: 50%; } .swiper-btns, .home1 .swiper-txt { display: none !important; } .home1 .swiper-button { position: static; left: auto; top: auto; right: auto; bottom: auto; transform: translateX(0%); } .home1 .swiper-btn { position: absolute; top: 50%; transform: translateY(-50%); z-index: 9; } .home1 .prev { left: -4.167vw; } .home1 .next { right: -4.167vw; } .home1 .swiper-btn { margin: 0; } .home3 .t1 p { width: 100%; position: static; right: 0; top: 0%; transform: translateY(0%); text-align: left; margin: 10px 0 0; } .home6 .line { width: 150px; height: 80px; padding: 10px; margin: 5px; } .so14 .prev { left: -4.167vw; } .so14 .next { right: -4.167vw; } .banner .play .img { margin-right: 15px; } .home1 .intr { padding: 0 5%; } .ab2 .col { height: 400px; } .co1 .input-sub { height: 300px; } } @media (min-width: 769px) { .pc { display: block; } .ph { display: none; } } @media screen and (max-width: 768px) { .pr6 .row .col.fore-up { width: 48%; } .so1 .intr .ev { max-height: 100%; } .pc { display: none; } .ph { display: block; } .fixed-video .video-wrap { width: 80%; } .footer .f-ewm { width: auto; } .footer .f-cont, .so1 .pic, .so1 .intr, .pr7 .intr, .pr7 .pic, .pr10 .intr, .pr10 .pic, .pr14 .pic, .pr14 .intr, .pr17 .pic, .pr17 .intr, .so7 .intr, .so7 .pic, .so6 .pic, .so6 .intr, .re1 .col-l, .re1 .col-r, .ne1 .col-l, .ne1 .col-r, .ab1 .intr, .ab1 .pic, .ab2 .col, .ab5 .row1 .pic, .ab5 .row1 .intr, .ab6 .col { width: 100%; } footer .f-cont, .pr10 .intr, .ne1 .col-l, .ab1 .intr { margin: 0 0 20px; } .home4 .ev, .pr2 .ev, .pr6 .col, .pr9 .col, .pr13 .col, .so9 .col, .so10 .col, .so4 .col, .so3 .col, .so11 .col, .ab5 .row2 .col, .home3 .ev { width: 48%; margin: 0 0 20px; } .ab2 .col { margin: 0 !important; } .pr4 .col { width: 50%; margin: 0 0 20px; } .ab7 .pic { width: 31%; margin-bottom: 20px; } .home5 .swiper-slide, .pr12 .swiper-slide, .ab3 .swiper1 .swiper-slide, .ab3 .swiper2 .swiper-slide, .ab4 .swiper-slide { width: 40% !important; } .ab3 .ev { box-shadow: 2px 2px 10px 1px rgb(0 0 0 / 11%); } .pr7 .intr, .pr14 .intr { position: static; left: 0; right: 0; top: 0%; transform: translateY(0%); margin: 0; } .pr7 .intr, .pr14 .intr, .pr17 .intr, .so7 .intr, .so6 .intr, .ab5 .row1 .intr, .ab5 .row2 .txt { padding: 15px; } .pr7 .pic, .so6 .pic, .so7 .pic { display: none; } .pr14 .intr { text-align: center; } .re1 .col-l, .ne1 .col-r { position: static; top: 0; } .re1 .col-l { display: flex; justify-content: center; flex-wrap: wrap; margin: 0 0 20px; } .re1 .sub { width: auto; margin: 0 1.042vw; } .re1 .sub em { display: none; } .banner .intr p { max-width: 100%; } .home3 .pic { width: 70%; margin: 20px auto; } .home3 .intr { width: 100%; text-align: center; display: flex; justify-content: center; flex-wrap: wrap; margin: 20px 0 0; } .home5 .swiper-button { position: static; left: 0; top: 0%; transform: translateY(0%); display: flex; margin: 20px 0 0; } .home5 .swiper-btn { margin: 0 10px 0 0; } .home5 .intr { background: transparent; } .home5 .ev .txt { transform: translateY(0px); } .home5 .ev h4 { color: #ffffff; } .home5 .ev p { color: #e9e9e9; } .home5 .ev em { height: 1px; background: rgba(255, 255, 255, 0.35); } .home2 .row, .home3 .row, .home4 .row { padding: 70px 5%; } .home5 .row { padding: 70px 5% 0; } .home6 .row { padding: 70px 5%; } .home3 .t1 p, .home4 .intr p { display: none; } .t1 { margin: 0 0 40px; text-align: center; } .home4 .more1 { margin: 20px auto 0; } .so8 .name { padding: 10px 15px; } .so8 .work { padding: 0px 15px 10px; } .so1 .icon { width: 33%; padding: 10px; margin: 0 0 10px; } /* 60px 3.125vw */ .home3 .txtb span, .home1 .intr h1 { font-size: 26px; } /* 57px 2.969vw */ .so5 .intr span, .so5 .intr b, .home3 .ev span, .home3 .ev b { font-size: 24px !important; } /* 48px 2.5vw */ .banner .intr h2, .t1 h2, .t2 h2 { font-size: 22px; } /* 40px 2.083vw */ .home2 .pic h3, .ab1 .intr h3 { font-size: 20px; } /* 36px 1.875vw */ .t2 h4, .re1 .txt h4, .t3 h4, .ab2 .intr h4, .ab6 .intr h4 { font-size: 18px; } /* 28px 1.458vw */ .banner .intr h4, .contact .intr h4, .pr3 .intr h4, .pr7 .intr h4, .pr12 .txt h4, .pr16 .intr h4, .pr17 .intr h4, .so6 .intr h4, .ab3 .intr h4, .ab5 .row1 h5, .home4 .intr h4, .home5 .intr h4 { font-size: 18px; } /* 26px 1.354vw */ /* 24px 1.25vw */ .pr2 .col h5, .pr14 .intr h4, .ne2 .title h5, .ab6 .intr p { font-size: 16px; } /* 22px 1.146vw */ .ab2 .intr h5, .so14 .intr h6 { font-size: 16px; } /* 20px 1.042vw */ .so8 .name p, .so8 .name i { font-size: 16px; } /* 18px 0.938vw */ .home3 .ev p, .pr2 .ev h6, .so5 .intr p, .pr3 .intr h5, .so1 .intr h6, .pr6 .intr p, .pr6 .intr span, .pr9 .name span, .so7 .intr h6, .pr13 .intr h6, .pr16 .intr h5, .so2 .intr p, .so3 .intr h6, .so4 .intr h6, .so9 .intr p, .so10 .intr h6, .so11 .pic h6, .ne1 .intr h6, .ne3 .intr p, .fixed-video .close i, .ab3 .date, .ab3 .date-btn span, .ab4 .intr p, .ab5 .row2 h5 { font-size: 14px; } /* 16px 0.833vw */ .footer .f-cont h4, .footer .f-cont p, .home5 .intr p, .header .link .li > span, .home4 .intr p, .t2 p, .home3 .t1 p, .swiper-txt span, .swiper-btns .btns span, .home1 .intr p, .home2 .intr p, .load > div p, .home3 .txtb p, .pr2 .sub span, .contact .cont1 span, .footer .f-menu p, .footer .f-ewm h6, .banner .play span, .navnew .sub span, .pr3 .intr p, .pr3 .intr h6, .pr4 .intr p, .pr7 .intr p, .more span, .more i, .more1 span, .more1 i, .more2 span, .more2 i, .more3 span, .more3 i, .so8 .work p, .pr9 .intr p, .so7 .intr p, .pr11 .intr p, .swiper-btn i, .pr12 .txt p, .pr13 .intr p, .pr14 .intr p, .pr16 .intr p, .pr17 .intr p, .so3 .intr p, .so4 .intr p, .so6 .intr p, .so10 .intr p, .so11 .intr p, .re1 .txt h6, .re1 .txt p, .ne1 .intr p, .pagelist .page a, .pagelist .page i, .navigate a, .navigate span, .ne2 .title p, .ne2 .word p, .banner .intr p, .ab1 .intr p, .ab5 .row1 h6, .ab5 .row1 p, .ab5 .row2 h6, .ab8 .txt h6, .ab8 .sub span, .co1 span, .co1 .input-sub li, .so14 .intr p, .contact .cont2 span, .pr6 .col .pic p { font-size: 12px; } .pr2 .ev { padding: 10px; } .pr9 .intr p { padding-left: 10px; } .so1 .intr, .pr16 .intr { padding: 15px; } .so10 .intr, .so4 .intr, .so3 .intr, .so11 .intr, .so11 .pic h6 { width: 100%; text-align: center; } .so10 .pic, .so4 .pic, .so3 .pic, .so11 .pic .img { justify-content: center; margin: 0 auto; } .so11 .pic h6 { margin: 15px 0 0; } .so5 { padding: 6.25vw 0; } .t2 { margin: 0 0 20px; } .ab1 .intr { margin-top: 20px; } .ab1 .row { flex-direction: column-reverse; } .ab2 .col:hover { width: 100%; } .re1 .col .pic, .re1 .img > div { /* display: none; */ width: 100%; } .re1 .col .intr { width: 100%; } .re1 .txt em { margin-right: 5px; } .ne2 .turnpage .turn { width: 50%; } .ne1 .col-r { padding: 15px; } .re1 .pagelist, .ne1 .pagelist, .ab4 .swiper-button { margin: 20px 0 0; } .t1 h2 { display: inline-block; } .ab3 .t2 { text-align: center; } .ab3 .swiper2 { display: none; } .ab3 .swiper-button { position: static; right: 0; top: 0%; transform: translateY(0%); justify-content: flex-start; margin: 20px 0 0; display: none; } .pr3 .intr { position: static; bottom: auto; width: 100%; left: 0%; top: 0%; transform: translate(0%, 0%); padding: 15px; background: #ffffff; } .pr3 .intr h4, .pr3 .intr h5, .pr3 .intr h6, .pr3 .intr p { color: #000; } .pr3 .intr em { background: #000; } .pr3 .swiper-btn2 { background: #dfdfdf; display: none; } .pr3 .swiper-btn2 i { color: #636363; } .pr3 .swiper-btn2:hover { background: #0bb798; } .pr3 .swiper-btn2:hover i { color: #ffffff; } .ab2 .row { flex-wrap: wrap; } .home2 .ev { margin: 0 0 40px; } .home2, .home3, .home4, .home5 { display: flex; align-items: center; justify-content: center; } .home2 .intr p { margin: 10px 0; } .pr2 .col { padding: 20px 20px 0; } .ab8 .map { height: 250px; } /* .scroll p, .scroll .mouse, .scroll .line { display: none !important; } .scroll .down { display: block !important; } .scroll { bottom: 20px; } */ } @media screen and (max-width: 480px) { .ab5 .row2 .col { width: 48% !important; } .ab6 .intr p { padding: 0 5%; } .ab4 .swiper-slide { width: 100% !important; } .home6 .line { width: 100px; height: 50px; } .contact h4 { font-size: 16px !important; padding-bottom: 10px; } .home6 .ev { animation: ani-gd 10s linear infinite; } .home6 .ev:nth-child(2n) { animation: ani-gd 10s linear reverse infinite; } .so5 .col { padding: 10px 0; } .swiper2 { margin-bottom: 15px !important; } .swiper2 .ev { padding-bottom: 15px !important; } .home5 .swiper-slide, .pr12 .swiper-slide, .ab3 .swiper1 .swiper-slide, .ab3 .swiper2 .swiper-slide { width: 80% !important; } .pr2 .ev, .pr6 .col, .pr9 .col, .pr13 .col, .so9 .col, .so10 .col, .so4 .col, .so3 .col, .so11 .col, .ab5 .row2 .col, .home3 .ev, .so5 .col, .pr4 .col, .so2 .col { width: 100%; border: none; } .pr13 .pic { justify-content: center; } .pr13 .intr { text-align: center; } .ab8 .cont { top: auto; bottom: 5.208vw; } .banner .pic img { height: 250px; object-fit: cover; } .home1 .intr .more { display: none; } }