@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%;}
}
@media (min-width: 992px) {
  .stock2 li {width: 20%;}
}
@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: 40%;}
  .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: 1400px) {
  .navbar li {font-size: 14px;}
  .navbar li > a {padding: 0 20rem;} 
  .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%;}
  /* .banner .title {transform: scale(0.8) translate3d(-10%, 0, 0);} */
}
@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 {transform: scale(.9) translate3d(-5%, 0, 0);}
  .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;}
}
@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 {text-align: center; margin: 15rem;}
  .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 .en {margin-top: 0;}
  .lithium a:not(.btn) {height: 360rem;}
  /*.light a, .storage a {height: auto !important;}*/
  .idx-banner .adbox {width: 22vw;}
  .light .itembox, .storage .weui-cell {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: 40px; line-height: 20px;}
  .stock2-box1 {padding-left: 50rem; background-position: 50% 50%;}
  .stock2-box1 .itembox {margin-right: 50rem;}
  .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;}
  .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;}
  .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: 24px; height: 72px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; word-wrap: break-word;}
  .idx1 .imgbox {margin-top: -25%;}
  .idx2 dl {margin: 22% 12%;}
  .idx2 .des {line-height: 24px; height: 72px;}
  .idx3 li .icon {margin: 0 auto;}
  .idx3 .textbox {width: auto; right: 15px; top: 12%; transform: none;}
  .idx3 .imgbox {top: 47%; transform: none;}
  .idx3-box1 .imgbox {width: 90%; right: 5%; top: 53%;}
  .idx3-box2 .imgbox:nth-child(1), .idx3-box2 .imgbox:nth-child(2) {width: 90%; right: 5%;}
  .idx3-box3 .imgbox {top: 52%; width: 35%; right: 24%;}
  .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 .weui-cell {display: block;}
  .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%; white-space: nowrap;}
}