:root {
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif,
    Montserrat;
  line-height: 1.5;
  font-weight: 400;
  color-scheme: light dark;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding: 0;
  margin: 0;
}
.scale-img img {
  transition: all 1s ease;
}

.scale-img:hover img {
  transform: scale(1.2);
}
.banner-box{
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 11.5104rem;
}
.banner-box .banner-box-title{
  position: absolute;
  color: #fff;
  width: 72.9167rem;
  max-width:72.9167rem;
  font-size: 64px;
  font-weight: bold;
  text-indent:7.5rem;
  top: 4rem;
}
.adv {
  height: 6.25rem;
  margin: 1.3021rem 0 4.6875rem 0;
}
a {
  font-weight: 500;
  color: #646cff;
  text-decoration: inherit;
}
a:hover {
  color: #535bf2;
  text-decoration: none;
}
.wrap-width {
  width: 72.9167rem;
  max-width: 72.9167rem;
  margin: 0 auto;
}
.header {
  height: 6.25rem;
}
.header .logo {
  width: 22.6042rem;
  height: 5.625rem;
}
.header .menu-box .search {
  margin-bottom: 0.8333rem;
}
.header .menu-box .search .user-icon {
  margin-left: 0.7813rem;
  cursor: pointer;
  width: 1.9271rem;
  height: 1.9271rem;
}
.header .menu-box .search-icon{
  cursor: pointer;
  width: 1.0417rem;
  height: 1.0417rem;
}
.header .menu-box .input-box {
  background-color: rgb(241, 241, 241);
  height: 1.3542rem;
  width: 16.4063rem;
  margin-right: 1.5625rem;
  padding: 0 0.5208rem;
  box-sizing: border-box;
}
.header .menu-box .input-box input {
  border: none;
  background-color: transparent;
  width: 100%;
  font-size: 12px;
}
.header .menu-box ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.header .menu-box ul li {
  margin-left: 4.4271rem;
  position: relative;
}
.header .menu-box ul li a {
  color: #111;
  font-size: 1.0417rem;
  font-weight: 600;
}
.header .menu-box ul li a:hover {
  color: #467fed;
}
.header .menu-box ul li.active a{
  color: #467fed;
}
.header .menu .children {
  display: none;
  background-color: #fff;
  position: absolute;
  top: 1.5625rem;
  z-index: 999;
  padding: 0.8208rem;
  width: 8.8917rem;
  line-height: 1.5625rem;
}
.header .menu .children a {
  font-weight: bold;
  font-size: 0.7292rem;
  color: #4c555f;
}
.header .menu-box ul li:hover .children {
  display: block;
}
.header .menu-box ul li:hover .children .item {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.swiper-container-banner {
  height: 48.1771rem;
}
.swiper-container-banner .info {
  font-weight: bold;
  font-size: 4.0625rem;
  color: #ffffff;
  line-height: 4.6875rem;
  padding-top: 5.2083rem;
  padding-left: 3.125rem;
}
.swiper-container-banner .info .small {
  font-size: 3.125rem;
  font-weight: bold;
}
.swiper-container-banner .more {
  font-weight: 500;
  font-size: .9375rem;
  color: #ffffff;
  line-height: .8333rem;
  padding-top: .7813rem;
  padding-left: 3.125rem;
}
.swiper-container-banner {
  width: 100%;
}
.swiper-container-banner .swiper-slide {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.swiper-pagination-bullet {
  background-color: rgb(210, 210, 210);
  border: #fff 0.1042rem solid;
  opacity: 1;
  box-sizing: border-box;
  width: 1.1458rem;
  height: 1.1458rem;
  margin: 0 0.625rem !important;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #467fed;
}
.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 2.0833rem !important;
}
.supplies-nav {
  font-weight: bold;
  margin-top: 3.125rem;
  margin-bottom: 1.0417rem;
}
.supplies-nav .title {
  color: #333;
  font-size: 1.25rem;
}
.supplies-nav .more {
  font-size: 0.7292rem;
  color: rgb(159, 162, 167);
}
.supplies-nav .more:hover {
  color: #467fed;
}
.supplies .supplies-desc {
  width: 15.625rem;
  position: relative;
  overflow: hidden;
  height: 19.7917rem;
}
.supplies .supplies-desc .info {
  position: absolute;
  left: 1.0417rem;
  top: 1.0417rem;
}
.supplies .supplies-desc .info .title {
  color: #fff;
  font-size: 1.25rem;
  font-weight: bold;
}
.supplies .supplies-desc .supplies-btn {
  background-color: #467fed;
  width: 6.4583rem;
  height: 2.0833rem;
  color: #fff;
  display: block;
  margin-top: 0.5208rem;
  border-radius: 0.3125rem;
  font-size: 0.8333rem;
}
.supplies .supplies-desc .supplies-btn:hover {
  background-color: #81adff;
}
.supplies .supplies-list {
  flex: 1;
  border-bottom: rgb(233, 233, 233) 0.0521rem solid;
  margin-bottom: 1.1979rem;
}
.supplies .supplies-list .item {
  width: 25%;
  border-right: rgb(233, 233, 233) 0.0521rem solid;
  border-top: rgb(233, 233, 233) 0.0521rem solid;
  box-sizing: border-box;
  height: 9.8958rem;
  position: relative;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
}
.supplies .supplies-list .item .img {
  /* position: absolute; */
  bottom: 0.5208rem;
  right: 0.5208rem;
  transition: all 1s ease;
  max-width: 7.6333rem;
}
.supplies .supplies-list .item:hover .img {
  transform: scale(1.2);
}
.supplies .supplies-list .item .title {
  font-weight: 500;
  font-size: 0.7292rem;
  color: #221815;
  /* position: absolute; */
  top: 0.7813rem;
  left: 1.5625rem;
  margin-top: 10px;
}
.supplies .supplies-list .item .title:hover {
  color: #467fed;
}
.pattime {
  background-image: url("../images/pexels-sarah-chai-7282287@2x.png");
  height: 21.875rem;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.pattime .info {
  font-weight: bold;
  font-size: 3.125rem;
  color: #ffffff;
  width: 72.9167rem;
  margin: 0 auto;
  padding-left: 9.375rem;
}
.pattime .info .icon {
  width: 4.2708rem;
  height: 4.2708rem;
  margin-left: 2.0833rem;
  cursor: pointer;
  transition: all 1s ease;
}
.pattime .info .icon:hover {
  transform: scale(1.2);
}
.toy {
  height: 37.7083rem;
  overflow: hidden;
}
.toy .big {
  width: 50rem;
  height: 37.7083rem;
  background-image: url("../images/10@2x.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  position: relative;
}
.toy .big .info {
  width: 18.0729rem;
  position: absolute;
  right: 5.2083rem;
  top: 3.6458rem;
}
.toy .big .img {
  width: 13.125rem;
  height: 13.125rem;
  position: absolute;
  bottom: 2.2917rem;
  right: 7.8125rem;
}
.toy img {
  transition: all 1s ease;
  cursor: pointer;
}
.toy img:hover {
  transform: scale(1.2);
}
.toy .big .title {
  font-weight: bold;
  font-size: 3.125rem;
  color: #457fed;
  margin-bottom: 2.0833rem;
  line-height: 4.1667rem;
  transition: all 1s ease;
}
.toy .big .title:hover{
  color: #81adff;
}
.toy .big .desc {
  font-weight: 300;
  font-size: 0.9375rem;
  color: #505050;
  line-height: 1.4583rem;
  margin-top: 1.5625rem;
}
.toy .small {
  width: 50rem;
  height: 37.7083rem;
}
.toy .small-1 {
  width: 50rem;
  height: 18.8542rem;
  background-image: url("../images/pexels-svetozar-milashevich-99573-1490908@2x.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.toy .small-2 {
  background: #457fed;
  width: 50rem;
  height: 18.8542rem;
}
.toy .small .info {
  font-weight: bold;
  font-size: 2.1875rem;
  color: #457fed;
  transition: all 1s ease;
}
.toy .small .info span{
  transition: all 1s ease;
}
.toy .small .info em{
  color: #fff;
  transition: all 1s ease;
  font-style: normal;
}
 
.toy .small .info:hover span{
  color: #81adff;
}
.toy .small .info:hover em{
  color: rgba(255, 255, 255, 0.6) !important;
}
.toy .small .info .icon {
  width: 10.4167rem;
  height: 10.4167rem;
  margin: 0 2.8646rem 0 3.125rem;
}
.news .item {
  width: 31.5%;
}
.news .item .thumb {
  height: 15.2083rem;
  margin-bottom: 0.5208rem;
  overflow: hidden;
  width: 100%;
}
.news .item .thumb img {
  width: 100%;
}
.news .item .info-box .time span {
  font-weight: 600;
  font-size: 5.1042rem;
  color: #4c555f;
  line-height: 1;
}
.news .item .info-box .time .time-btn {
  width: 7.9167rem;
  height: 2.0833rem;
  background: #457fed;
  color: #fff;
  font-weight: 500;
  font-size: 0.9375rem;
}
.news .item .info-box .time .time-btn .rili {
  width: 1.3542rem;
  height: 1.3542rem;
  margin-right: .5208rem;
}
.news .item .info-box .info {
  margin-left: 1.5625rem;
}
.news .item .info-box .info .title {
  font-weight: 500;
  font-size: 1.25rem;
  color: #4c555f;
}
.news .item .info-box .info .title:hover{
  color: #457fed;
}
.news .item .info-box .info .tag {
  font-weight: 300;
  font-size: 0.7813rem;
  color: #505050;
  line-height: 1.1458rem;
  opacity: 0.5;
  margin: 0.2604rem 0 0.5208rem 0;
}
.news .item .info-box .info .desc {
  font-weight: 300;
  font-size: 0.8333rem;
  color: #505050;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}
.news .item .info-box .info .desc a {
  font-weight: 300;
  font-size: 0.7813rem;
  color: #457fed;
}
.news-lists .news .item{
  border: #efefef 1px solid;
  padding-bottom: 1.0417rem;
}
.news-lists .news  .thumb {
  height: 11.1458rem;
  margin-bottom: 0.5208rem;
  overflow: hidden;
  width: 100%;
}
.subscribe {
  background-color: rgb(244, 244, 244);
  height: 17.7083rem;
  margin: 5.2083rem auto;
  font-weight: 500;
  font-size: 1.875rem;
  color: #4c555f;
}
.subscribe .input-box {
  margin: 3.125rem 0 0 0;
}
.subscribe .input {
  border: none;
  background-color: transparent;
  border-bottom: #ddd 0.0521rem solid;
  width: 50.5208rem;
  font-size: 0.8333rem;
}
.subscribe .input-search {
  width: 9.8438rem;
  height: 3.2292rem;
  background: #457fed;
  font-weight: 400;
  font-size: 1.25rem;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 1s ease;
}
.subscribe .input-search:hover{
  background: #81adff;
}
.contact-box {
  margin-bottom: 1.5625rem;
}
.contact-box .item {
  width: 30%;
}
.contact-box .item .title {
  font-weight: 500;
  font-size: 1.875rem;
  color: #4c555f;
  margin-bottom: 0.7813rem;
}
.contact-box .item .desc {
  font-weight: 300;
  font-size: 0.8333rem;
  color: #505050; 
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 15;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.contact-box .item .address {
  font-weight: bold;
  font-size: 0.8333rem;
  color: #4c555f;
  line-height: 1.25rem;
  margin-bottom: 0.7813rem;
}
.contact-box .item .cell {
  font-weight: 500;
  font-size: 0.8333rem;
  color: #4c555f;
  line-height: 1.875rem;
}
.contact-box .item .cell .icon {
  margin-right: 0.5208rem;
}
.contact-box .item .cell span {
  font-weight: 500;
  font-size: 1.875rem;
  color: #457fed;
}
.contact-box .item ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.contact-box .item ul li a {
  font-weight: 400;
  font-size: 0.8333rem;
  color: #4c555f;
  line-height: 1.5625rem;
  font-weight: 600;
}
.contact-box .item ul li a:hover {
  color: #457fed;
}
.copyright {
  width: 100%;
  height: 4.3333rem;
  background: #457fed;
  font-size: 0.8333rem;
  color: #ffffff;
  text-align: center;
  display: flex;
  flex-direction: column; 
  align-items: center;
  justify-content: center;
}
.copyright p{
  margin: 0;
  padding: 0;
  margin-bottom: 5px;
}
.copyright a{
  color: #ffffff;
  font-size: 0.8333rem;
  padding-left: 5px;
}
.about-box .title {
  font-weight: bold;
  font-size: 1.5625rem;
  color: #4c555f;
  margin-bottom: 1.0417rem;
  
}
.about-box .desc {
  font-weight: 300;
  font-size: 0.9375rem;
  color: #221815;
}
.about-box .info {
  margin-top: 6.25rem;
  margin-right: 2.3438rem;
  max-width: 46.875rem;
  overflow: hidden;
}

.about-box .about-img {
  margin-top: 2.3438rem;
  width: 22.9167rem;
  height: 25.9375rem;
}
.contactus .logo-box {
  margin-top: 6.25rem;
  border-bottom: #457fed 0.1563rem solid;
  margin-bottom: 1.5625rem;
  padding-bottom: 1.5625rem;
}
.contactus .logo-box .title {
  font-weight: bold;
  font-size: 1.5625rem;
  color: #4c555f;
  margin-bottom: 0.5208rem;
}
.contactus .logo-box .address {
  font-weight: 400;
  font-size: 1.5625rem;
  color: #4c555f;
  line-height: 1;
}
.contactus .qrcode-img {
  margin-right: 1.5625rem;
}
.contactus .cell {
  font-weight: 500;
  font-size: 1.25rem;
  color: #4c555f;
  margin: 0.7292rem 0;
}
.contactus .cell .icon {
  margin-right: 0.7813rem;
  max-width: 100%;
}
.contactus .cell span {
  font-weight: 500;
  font-size: 1.875rem;
  color: #457fed;
}
.product-box {
  margin-top: 1.8229rem;
}
.product-box .left-box {
  width: 18.4896rem;
}
.product-box .left-box .title {
  height: 4.3229rem;
  background: #457fed;
  font-weight: bold;
  font-size: 1.875rem;
  color: #ffffff;
  text-align: center;
  line-height: 4.3229rem;
}
.product-box .left-box .category-lists {
  background: #efefef;
  padding: 1.0417rem 0;
}
.product-box .left-box .category-lists .item {
  height: 2.2917rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0.5208rem;
  border-left: #efefef 0.7813rem solid;
}
.product-box .left-box .category-lists .item .more{
  font-size: 12px;
}
.product-box .left-box .category-lists .item.active {
  background: #e3e3e3;
  border-left: #457fed 0.7813rem solid;
}
.product-box .left-box .category-lists .item:hover{
  background: #e3e3e3;
  border-left: #457fed 0.7813rem solid;
}
.product-box .left-box .category-lists .item a {
  font-weight: 500;
  font-size: 0.9375rem;
  color: #4c555f;
  flex: 1;
}
.product-box .right-box {
  width: 54.4271rem;
}
.left-hot {
  background: #457fed;
  background-image: url("../images/pexels-barnabas-davoti-31615494-14084428@2x.png");
  width: 18.4896rem;
  height: 24.0625rem;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  margin-top: 1.5625rem;
}
.left-hot .left-hot-title {
  font-weight: bold;
  font-size: 1.0417rem !important;
  color: #ffffff;
}
.left-hot .desc {
  font-weight: 300;
  font-size: 0.7292rem;
  color: #ffffff;
  padding: 0.7813rem 1.5625rem 1.5625rem 1.5625rem;
}
.left-hot .hot-btn {
  width: 8.0208rem;
  height: 2.2396rem;
  background: #ffffff;
  border-radius: 1.0938rem;
  text-align: center;
  line-height: 2.2396rem;
  font-weight: 500;
  font-size: 0.9375rem;
  color: #457fed;
  cursor: pointer;
  margin-bottom: 3.125rem;
}
.left-hot .hot-btn:hover{
  background: #81adff;
  color: #fff;
}
.right-box .right-box-nav {
  background-color: #efefef;
  height: 4.3229rem;
  padding: 0 1.5625rem;
}
.right-box .right-box-nav .title {
  font-weight: 500;
  font-size: 1.25rem;
  color: #457fed;
  border-left: #457fed 0.625rem solid;
  padding-left: 1.0417rem;
}
.right-box .right-box-nav a {
  font-size: 0.7292rem;
  color: #545c66;
}
.right-box .right-box-nav a:hover {
  font-size: 0.7292rem;
  color: #457fed;
}
.right-box .right-box-nav .icon {
  margin-right: 0.2604rem;
}
.product-lists {
  padding: 1.5625rem 0 1.5625rem 1.5625rem;
}
.product-lists .item {
  text-align: center;
  margin-bottom: 1.5625rem;
  width: 16.4583rem;
}
.product-lists .item .thumb {
  width: 16.4583rem;
  height: 16.4583rem;
  border: 0.0521rem solid #e9e9e9;
  overflow: hidden;
  margin-bottom: 0.5208rem;
}
.product-lists .item .img {
  width: 12.4583rem; 
  /* height: 16.4583rem;  */
  height: auto;
}
.product-lists .item a {
  font-weight: 500;
  font-size: 0.7292rem;
  color: #221815;
}
.product-lists .item a:hover {
  color: #457fed;
}
.pager {
  text-align: center; 
}
.pager .active {
  background-image: linear-gradient(
    to right,
    rgb(90, 223, 241),
    rgb(103, 145, 255)
  );
}
.product-detail {
  padding: 1.5625rem 0 1.5625rem 1.5625rem;
}
.product-detail .product-detail-thumb {
  width: 29.1146rem;
  height: 29.1146rem;
  background: #ffffff;
  border: 0.0521rem solid #e9e9e9;
  cursor: pointer;
  margin-right: 2.5rem;
  overflow: hidden;
}
.product-detail .product-detail-thumb img {
  max-width: 25.0521rem;
}
.product-detail-content {
  flex: 1;
}
.product-detail-content .title {
  font-weight: bold;
  font-size: 0.9375rem;
  color: #457fed;
  border-bottom: #efefef 0.0521rem solid;
  padding-bottom: 0.7813rem;
  margin-bottom: 0.7813rem;
}
.product-tab .item {
  border-bottom: #efefef 0.0521rem solid;
}
.product-tab .item .top {
  height: 3.125rem;
  font-size: 0.9375rem;
  font-weight: 400;
  color: #202020;
}
.product-tab .item .top .more {
  font-weight: 200;
  font-size: 1.875rem;
  color: #b7b7b7;
  cursor: pointer;
}
.product-detail-content .no {
  font-weight: 600;
  font-size: 0.9375rem;
  color: #202020;
}
.product-tab .item .bottom {
  display: none;
  font-weight: 400;
  font-size: 0.9375rem;
  color: #949494;
  padding-bottom: 1.0417rem;
  padding-left: 1.0417rem;
}
.product-tab .item.active .bottom {
  display: block;
}
.news-lists{
  padding: 1.0417rem 0 1.0417rem 1.0417rem;
}
.news-detail{
  padding: 1.0417rem 1.0417rem 1.0417rem 1.0417rem;
  
}
.news-detail h2{
  text-align: center;
}
.news-detail .tag {
  font-weight: 300;
  font-size: 0.7813rem;
  color: #505050;
  line-height: 1.1458rem;
  opacity: 0.6;
  margin: 1.0417rem 0;
  text-align: center;
  background-color: #efefef;
  padding: .4167rem 0;
}
.news-detail .content {
   font-size: .8333rem;
   width: 52.0833rem;
   overflow: hidden;
}
.card {
  background-color: #f6f7f8;
  height: 300px;
  width: 23%;
  box-sizing: border-box;
  margin: 0.7813rem 0;
}
.pager .page-num{
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 32px;
  border-radius: 50%;
  color: #333;
  margin: 0 .5208rem;
  font-size: 14px;
}
.pager .page-item{
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 32px;
  border-radius: 50%;
  color: #333;
  margin: 0 .5208rem;
  font-size: 16px !important;
}
.pager .page-num.page-num-current{
  background: center center #4A54FF;
    background-image: linear-gradient(315deg, #6772FF 0, #00F9E5 100%);
    background-size: 104% 104%;
    color: #fff;
 
}