
@media (min-width: 768px) {
  .idx1 .imgbox {position: absolute; width: 78.6%; right: -11.3%; top: 50%; transform: translate3d(0, -50%, 0);}
  .idx2 .swiper-pagination {opacity: 0;}
  .lithium .weui-cell__hd {width: 30%;}
  .group1 .weui-cell__hd, .group1 .weui-cell__ft {width: 36%;}
  .group1 .itembox:nth-child(2) {margin-top: 85rem; margin-bottom: 85rem;}
  .duty1 .weui-cell__hd {width: 50%; padding-right: 9%;}
  .contact .col-sm-5 {width: 37%;}         
  .contact .col-sm-2 {width: 26%;} 
  /*.contact dd .f46 {font-size: 28rem !important; line-height: 1.1;} */
}
@media (min-width: 992px) {
  .stock2 li {width: 20%;}
  .group4 dt p:first-child {height: 50rem;} 
}
@media (min-width: 768px) and (max-width: 1199px) {
  .idx1 .textbox {width: 55%; margin-left: -11%;}
  .idx1 .textbox .f46 {font-size: 40rem; white-space: nowrap;}
}
@media (min-width: 1200px) {
  html {font-size: calc(100vw / 1920);}
  a:not(.btn):hover {color: #d60b1c;}
  .btn:hover::before {-webkit-animation: sxxs1 1s 1s linear infinite; -moz-animation: sxxs1 1s 1s linear infinite;}
  .btn:hover::after {-webkit-animation: sxxs1 1s 0.2s linear infinite; -moz-animation: sxxs1 1s 0.2s linear infinite;}
  .navbar li.on > a, .navbar li.act > a {color: #d60b1c !important;}
  .swiper-button-next:not(.swiper-button-disabled):hover, .swiper-button-prev:not(.swiper-button-disabled):hover {border-color: #d60b1c;}
  .swiper-button-next:not(.swiper-button-disabled):hover::before, .swiper-button-prev:not(.swiper-button-disabled):hover::before {transform: scale(1);}
  .swiper-button-next:not(.swiper-button-disabled):hover::after, .swiper-button-prev:not(.swiper-button-disabled):hover::after {color: #fff;}
  .pagination .btn-prev:hover::before, .pagination .btn-first:hover::before, .pagination .btn-last:hover::before,
  .pagination .btn-next:hover::after, .pagination .btn-first:hover::after, .pagination .btn-last:hover::after {border-color: #d60b1c;}
  .idx1 .textbox {width: 60%; margin-left: -19%;}
  .idx4 .itembox:hover::before {transform: scale(1);}
  .idx4 .itembox:hover .imgwrap {top: 0; opacity: 1;}
  .idx4 .itembox:hover span, .idx4 .itembox:hover .title {color: #fff;}
  .idx4 .itembox:hover .des {opacity: 1; margin-top: 25rem; height: 56rem;}
  .stock2 li:hover a, .stock2 li:hover p {top: -15px;}
  .duty2 {background-attachment: fixed;}
  .culture1 .itembox:hover h3, .culture1 .itembox:hover p {top: -10rem;}
  .culture1 .itembox:hover .abs {transform: translateY(-40%) scale(1.08);}
  .group5 li:hover p {color: #d60b1c;}
  .download .weui-cell__ft:hover::before {transform: scale(1);}
  .download .weui-cell__ft:hover path {fill: #fff;}
}
@media (min-width: 1200px) and (max-width: 1300px) {
  .idx3 li {width: 360rem;}  
}
@media (min-width: 1200px) and (max-width: 1400px) {
  .container-fluid {padding-left: 3.5%; padding-right: 3.5%;}    
  .navbar li {font-size: 12px;}
  .navbar li > a {padding: 0 22rem;}    
  .f14 {font-size: 12px;}
  .f16 {font-size: 14px;}
}
@media (min-width: 1600px) {
  .navbar-left li > a {padding-left: 30rem; padding-right: 30rem;}
  .navbar-right li > a {padding-left: 20rem; padding-right: 20rem;}
}
@media (max-width: 1620px) {
  .idx-banner .swiper-pagination {left: 70rem !important;}
  .idx4 .itembox .container {padding-left: 6%;}
}
@media (max-width: 1400px) {
  /*.idx3-box1 .imgbox {width: 37%;}*/
  .idx3-box2 .imgbox:nth-child(1) {right: -2%; width: 73%;}
  .idx3-box2 .imgbox:nth-child(2) {right: 3%; width: 60%;}
  .idx3-box3 .imgbox {right: 8%; width: 20%;}
  .idx4 .itembox .container {padding-left: 10%;}
  .network li a {height: 180rem;}
  .network .info .col-md-3 {width: 35%;}
  .network .info .col-md-6 {width: 30%;}
  .banner .title {bottom: 20rem;}
  .banner .en {margin-top: 0; font-size: 100rem;}
  .culture .itembox {height: 480rem;}
  .coop .types {padding: 0 140rem; text-align: left;}
  .coop .types span {margin: 10rem;}
}
@media (max-width: 1199px) {
  .container {width: 75%;}
  .header .navbar-right {margin-right: 85rem;}
  .header .btn {margin-right: 85rem;}
  .navbar li > a {font-size: 16px;}
  .navbar-left {position: fixed; z-index: 1001; top: 0; right: 0; bottom: 0; padding-top: 74rem; width: 60%; overflow-y: auto; background: #fff; display: block !important; opacity: 0; transform: translateX(100%); transition: all .5s;}
  .navbar-left li {display: block; text-align: left;}
  .navbar-left li > a::after {position: absolute; display: block; content: ''; right: 30rem; top: 50%; width: 8px; height: 8px; border-top: 1px solid #333; border-right: 1px solid #333; transform: rotate(45deg) translateY(-50%);}
  .navbar-left li i {display: none !important;}
  .navbar-left .dropmenu {position: static;}
  .navbar-left .dropmenu > div {margin: 0 30rem; padding-left: 60rem; padding-right: 60rem; text-align: left; background: #f7f7f7; border-radius: 0;}
  .navbar-left .dropmenu {font-size: 14px;}
  .navbar-left.on {opacity: 1; transform: translateX(0);}
  .idx-banner .swiper-pagination {left: 160rem !important;}
  .idx2 dl {margin: 25% 18%;}
  .idx3-box3 .imgbox {right: 15%; width: 24%;}
  .idx4 .itembox .container {padding-left: 18%;}
  .banner .title {bottom: 75rem;}
  .submenu .btn {margin-left: 15rem; margin-right: 15rem; padding-left: 10rem; padding-right: 10rem;}
  .idx3 .swiper-container, .idx4 .swiper-container {pointer-events: none;}
  .spro-logo li {margin: 24rem;}
  .spro-logo, .spro-contact {padding-top: 20rem; padding-bottom: 20rem;}
  .spro-contact li {margin: 10rem 30rem;}
}
@media (min-width: 1024px) and (max-width: 1199px) {
  .lithium a {height: 280rem;}
  /*.light a, .storage a {height: 350rem;}*/
  .light .itembox, .storage .weui-cell {height: 350rem;}
  .culture .col-xs-12:nth-child(1) .imgbox {height: 574rem;}
  .culture .col-xs-12:nth-child(2) .imgbox {height: 278rem;}
  .culture .textbox {padding: 20rem 32rem;}
  .news3 li .itembox {height: 431rem;}
  .news3 li .imgbox {height: 200rem;}
  /*.contact dd .f46 {font-size: 40rem;}*/
}
@media (max-width: 1100px) {
  /*.banner .title {transform: scale(.8) translate3d(-10%, 0, 0);}*/
  .submenu .btn {margin-left: 10rem; margin-right: 10rem;}
  .spro-banner li {margin-left: 30rem; margin-right: 30rem;}
  .spro-left {position: static !important; width: 100% !important; float: none;}
  .spro-wrap .light-detail {width: 100%; float: none; padding: 0;}
  .spro-left h3 {position: relative;}
  .spro-left h3::before, .spro-left h3::after {position: absolute; top: 50%; display: block; content: ''; width: 20rem; height: 2rem; background: #999;}
  .spro-left h3::before {right: 0; transform: translateY(-50%);}
  .spro-left h3::after {opacity: 1; right: 1rem; transform: rotate(90deg) translateY(-50%); transition: opacity .3s;}
  .spro-left h3.on::after {opacity: 0;}
  .spro-left ul {display: none;}
  .spro-left .level3 > li > a::before, .spro-left .level4 > li > a::before {top: 22rem;}
  .spro-logo li, .spro-contact li {margin-left: 10rem; margin-right: 10rem;}
}
@media (max-width: 767px) {
  .f14 {font-size: 12px;}
  .f16 {font-size: 14px;}
  .f18 {font-size: 15px;}
  .f20 {font-size: 16px;}
  .f22 {font-size: 17px;}
  .f24 {font-size: 18px;}
  .f26 {font-size: 19px;}
  .f28 {font-size: 20px;}
  .container-fluid {padding-left: 15px; padding-right: 15px;}
  .idx-banner .current .mouse {width: 16rem; height: 24rem;}
  .idx1 .imgbox {width: 120%; margin-left: -10%;}
  .idx3-zoom .bd {width: 88%;}
  .network .info {display: block;}
  .network .info > div {width: 100% !important; text-align: center; margin: 15rem;}
  .network .qrcode {margin: 6rem auto;}
  .news .content {margin-left: -10rem; margin-right: -10rem;}
  .news3 li .line2 {line-height: 40rem; height: 80rem;}
  .news3 li .line3 {line-height: 40rem;}
  .news3 li:hover .line3 {height: 120rem;}
  .ndetail .article {padding-left: 30rem; padding-right: 30rem;}
  /*.banner .title {bottom: 35rem; white-space: nowrap; transform: scale(0.6) translate3d(-20%, 0, 0);}*/
  .banner .title {white-space: nowrap; transform: scale(.8) translate3d(-10%, 0, 0);}
  .banner .title .en {margin-top: 0;}
  .lithium a:not(.btn) {height: 360rem;}
   .idx-banner .adbox {width: 22vw;}
  .light .itembox, .storage .weui-cell {height: auto !important;}
  /*.light a, .storage a {height: auto !important;}*/
  .light .textbox {position: static;}
  .storage .weui-cell {display: block;}
  .storage .weui-cell__hd {margin-bottom: 50rem; padding-left: 20rem; width: 100% !important; text-align: center;}
  .group1 .weui-cell {display: block;}
  .group1 .img {margin-left: 0;}
  .group1 .itembox {display: block; margin-top: 40rem; width: 50%; float: left;}
  .group1 .itembox .gray333 {height: 80px; line-height: 20px;}
  .stock2-box1 {height: auto; padding-left: 30rem; padding-bottom: 30rem; background-position: 0 0;}
  .stock2-box1 .itembox {margin-right: 0; margin-top: 40rem;}
  .energy1 .weui-cell__hd .itembox {margin-top: 0;}
  .energy1 .itembox .red {height: 54px;}
  .duty1 .weui-cell {display: block;}
  .duty1 h3 {margin-top: 50rem;}
  .duty4-box1, .duty4-box2 {width: 100%; margin: 0;}
  /*.duty4-box2::before {left: 0;}*/
  .contact .col-xs-12 {margin-bottom: 40rem;}
  .contact .col-xs-12:last-child img {margin-top: 40rem; margin-bottom: 40rem;}
  .contact dd {height: auto !important; padding-bottom: 40rem;}
  .contact dd p.line2 {height: auto; line-height: initial;}
  /*.contact dd .f46 {font-size: 40rem; line-height: 1.1;}*/
  .coop .types {padding: 0;}
  .network li a {height: auto; padding: 30rem;}
  .group5 ul {max-height: 480rem;}
  .light-detail ul > li, .light-detail h3, .light-detail ol, .download li {height: auto !important;}
  .light-detail .itembox {padding: 40rem;}
  .light-detail img {margin-bottom: 40rem;}
  .spro-banner {height: 600rem; line-height: 1.2;}
  .spro-wrap > .row {margin-left: 0; margin-right: 0;}
}  
@media (max-width: 639px) {
  .f120 {font-size: 90rem;}
  .container {width: 95%;}
  .navbar-right li > a {font-size: 14px;}
  .footer .col-xs-12:nth-child(2) {text-align: left;}
  .copyright {padding-top: 10rem; padding-bottom: 10rem;}
  .copyright .col-xs-12 {text-align: center;}
  .idx1 .textbox p {line-height: 22px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 7; word-wrap: break-word;}
  .idx1 .imgbox {margin-top: -40%;}
  .idx2 dl {margin: 22% 12%;}
  .idx3 li .icon {margin: 0 auto;}
  .idx3 .textbox {width: auto; right: 15px; top: 12%; transform: none;}
  .idx3 .imgbox {top: 53%; transform: none;}
  .idx3-box1 .imgbox {width: 90%; right: 5%; top: 63%;}
  .idx3-box2 .imgbox:nth-child(1), .idx3-box2 .imgbox:nth-child(2) {width: 90%; right: 5%;}
  .idx3-box3 .imgbox {top: 66%; width: 24%; right: 16%;}
  .idx4 .itembox .container {padding-left: 33%;}
  .idx4 .title, .idx4 .des {width: 96%;}
  .coop ul {padding: 0;}
  #txtAddress {height: 108rem;}
  .coop .types {text-align: left;}
  .group3-hd {position: relative;}
  .group3-hd .weui-cell {display: block;}
  .group3 .imgbox {position: absolute; left: 0; top: 0; right: 0; bottom: 0; height: auto;}
  .idx-banner .adbox {width: 35vw;}
  .spro-banner li {margin-top: 10rem; margin-bottom: 10rem; width: 35%; text-align: center;}
}
@media (max-width: 414px) {
  .idx3 ul {display: flex;}
  .idx3 li {margin: 5rem; padding: 10rem; width: 33.33333%; display: flex; align-items: center;}
  .idx3 li br {display: none;}
  .idx3 li .tleft {text-align: center; line-height: 1.2;}
}

