.down-language {
  transform: rotate(-180deg);
}

.up-language {
  transform: rotate(-90deg);
}

/* 尾部 */
.footer {
  width: 100%;
  background-color: #222222;
  padding: 55px;
  box-sizing: border-box;
}

.footer .footer-list {
  display: flex;
  gap: 20px;
}

.footer .footer-list .footer-item .footer-title {
  font-size: 24px;
  color: #fff;
  font-weight: 600;
}

.footer .footer-about-list {
  margin-top: 50px;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.footer .footer-about-list .footer-about-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer .footer-about-list .footer-about-item .footer-about-title {
  font-size: 20px;
  color: #fff;
  font-weight: 600;
  border-bottom: 1px solid #fff;
  margin-bottom: 15px;
}

.footer .footer-about-list .footer-about-item .footer-baout-content {
  display: block;
  color: #fff;
  padding: 5px;
  font-weight: 400;
}

.footer .footer-about-list .footer-about-item .footer-baout-content:hover {
  color: #E02783;
}

.footer-message-title {
  font-size: 16px;
  color: #fff;
  margin-top: 30px;
}

.footer-address {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer-address .footer-address-title {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.footer-address-title .footer-address-border {
  font-size: 24px;
  color: #fff;
  border-bottom: 1px solid #fff;
  padding-bottom: 5px;
}

.footer-address-title .footer-address-manager {
  font-size: 24px;
  color: #fff;
  border-bottom: 1px solid transparent;
  padding-bottom: 5px;
  margin-left: 5px;
}

.footer-address .footer-address-item {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 16px;
  color: #fff;
  margin-top: 20px;
  line-height: 24px;
}

.footer-address-item .footer-address {
  margin-top: 15px;
}

.footer-address .footer-address-item .footer-address-iconfont {
  color: #e02783;
  font-size: 20px;
  margin-right: 10px;
}

.footer-form {
  /* max-width: 800px; */
  width: 100%;
  margin: 0 auto;
}

.footer-form {
  margin-top: 15px;
}

.layui-form-item {
  margin-bottom: 25px;
}

.layui-form-label {
  font-weight: bold;
  color: #555;
}

.name-phone-row {
  display: flex;
  gap: 15px;
}

.name-phone-row .layui-form-item {
  flex: 1;
  margin-bottom: 0;
}

.layui-input,
.layui-textarea,
.layui-form-select .layui-input {
  background: #767676 !important;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 8px;
  color: #ffffff !important;
  padding: 0 15px;
}

/* 输入框聚焦状态 */
.layui-input:focus,
.layui-textarea:focus {
  background: #767676 !important;
  border-color: #4ecdc4;
  box-shadow: 0 0 10px rgba(78, 205, 196, 0.3);
  color: #ffffff !important;
}

/* 占位符颜色 */
.layui-input::placeholder,
.layui-textarea::placeholder {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* 选择框下拉菜单 */
.layui-form-select dl {
  background: #767676 !important;
  border: 1px solid #767676;
  border-radius: 8px;
}

.layui-input {
  border-color: transparent !important;
}

.layui-textarea {
  border-color: transparent !important;
}

.layui-form-select dl dd {
  color: #ffffff !important;
  background: #767676 !important;
}

.layui-form-select dl dd:hover {
  background: #000000 !important;
}

.layui-form-select dl dd.layui-this {
  background: #000000 !important;
  color: white !important;
}

/* 选择框输入区域 */
.layui-form-selected .layui-input {
  background: #000000 !important;
  color: #ffffff !important;
}

.submit-btn {
  width: 100%;
  height: 50px;
  font-size: 16px;
  border-radius: 8px;
  background: #e02783 !important;
  border: none;
}

.submit-btn:hover {
  opacity: 0.9;
  transform: translateY(-2px);
  background-color: #b5248b !important;
}

/* 自定义选择框样式 */
.layui-form-select dl {
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.layui-form-select dl dd.layui-this {
  background: #e02783 !important;
  color: white;
}

.layui-input-block {
  margin-left: 0 !important;
}


.footer-item .footer-item-img {
  width: 100%;
  margin-top: 10px;
}

.footer-item .footer-item-img img {
  width: 100%;
  height: auto;
}

.footer-item .footer-item-title {
  font-size: 24px;
  color: 24px;
  font-weight: 600;
  color: #fff;
}

.foot {
  width: 100%;
  padding: 25px 0;
  background-color: #0c0c0c;
}

.foot .foot-list {
  display: flex;
  justify-content: center;
  align-items: center;
}

.foot .foot-list .foot-item {
  padding: 8px;
  border-radius: 50%;
  background-color: #fff;
}

.foot-item+.foot-item {
  margin-left: 20px;
}

.foot .foot-list .foot-item .foot-item-iconfont {
  font-size: 23px;
  color: #2f2f2f;
}

.foot .foot-copyright {
  margin-top: 20px;
  font-size: 16px;
  color: #fff;
  width: 100%;
  text-align: center;
}


/* 头部 */
* {
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  color: #111;
}

ul li {
  list-style: none;
}

/* 头部 */
.header .top {
  background-color: #0c0c0c;
  padding: 10px 0;
}

.header .top .top-box {
  display: flex;
  justify-content: space-between;
  will-change: transform;
  animation: testAdd 20s linear infinite running;
  animation-delay: 250ms;
}

.header .top .top-box:hover {
  animation-play-state: paused;
}

.header .top .top-box .top-list {
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  white-space: nowrap;
  direction: ltr;
  color: #fff;
  font-size: 16px;
}


@keyframes testAdd {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }

  100% {
    -webkit-transform: translate(-50%);
    transform: translate(-50%)
  }
}

.header .head {
  padding: 10px 3.125em;
  background-color: #222222;
}

.header .head .head-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header .head .head-box .head-left {
  width: 10%;
}

.header .head .head-box .head-left .head-logo {
  max-width: 100%;
}

.header .head .head-box .head-left .head-logo img {
  width: 100%;
  height: auto;
}

.head .head-box .head-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-around;
}

.head .head-box .head-right .head-right-top {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.header .head .head-box .head-right .head-right-top .head-search-box .e-search-input {
  border-radius: 30px;
  background-color: #C5C5C530;
  min-height: 10px !important;
  padding: 0.5rem 1rem;
  color: #fff;
}

.head .head-search-box {
  position: relative;
}

.head .head-search-box .head-icon-search {
  position: absolute;
  top: 8px;
  right: 10px;
  cursor: pointer;
}

.head .language-fix {
  position: relative;
  cursor: pointer;
}

.head .head-select-box {
  margin-left: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.head .head-right .head-select-box .head-language {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-left: 10px;
  cursor: pointer;
}

.head .language-box {
  display: none;
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translate(-50%, 0);
  background-color: #0c0c0c;
  z-index: 2;
}

.head .language-box ul {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 20px;
}

.head .language-box ul .language-list a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  color: #fff;
}

.head .language-box ul .language-list:hover a {
  color: #e02783;
}

.head .language-box ul .language-list a img {
  margin-right: 15px;
  width: 24px;
  height: 24px;
}

.head .language-list+.language-list {
  margin-top: 10px;
}

.head .head-right .head-select-box .head-language span {
  font-size: 16px;
  color: #fff;
}

/* nav */
.head .head-right-bottom {
  margin-top: 20px;
}

.head .head-right-bottom .head-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.head .head-right-bottom .head-nav .head-nav-list {
  position: relative;
  padding: 0 10px;
}

.head .head-right-bottom .head-nav a {
  color: #fff;
  font-size: 20px;
  padding: 5px 10px;
  border-bottom: 2px solid transparent;
}


.head .head-right-bottom .head-nav a:hover {
  color: #cc3366;
  border-bottom: 3px solid #cc3366;
}

.child {
  display: none;
  position: absolute;
  top: 33px;
  left: 50%;
  transform: translate(-50%, 0);
  background-color: #0c0c0c;
  padding: 20px;
  z-index: 9999;
}

.child .child-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

.child .child-list .child-item {
  font-size: 17px;
  color: #fff;
  /* padding: 20px 0; */
}

.child-item+.child-item {
  margin-top: 20px;
}

.child .child-list .child-item a {
  font-size: 17px;
  color: #fff;
  white-space: nowrap;
}

.header .mobile-head-box {
  display: none;
}

.header .mobile-head-box .mobile-nav {
  position: absolute;
  top: 32px;
  right: -5px;
  /* transform: translate(-50%, 0); */
  background-color: #222222;
  border-radius: 3px;
  display: none;
  transition: all 0.3s ease-in-out;
  z-index: 9999;
}

.header .mobile-head-box .mobile-nav ul {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.header .mobile-head-box .mobile-nav ul li {
  padding: 10px 15px;
  border-bottom: 1px solid #fff;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}

.header .mobile-head-box .mobile-nav ul li:last-child {
  border: none;
}

.header .mobile-head-box .mobile-nav ul li a {
  font-size: 20px;
  color: #fff;
  white-space: nowrap;
}

.mobile-nav-active {
  display: block !important;
}

/* 移动端 */
@media (max-width:768px) {
  .header .top {
    display: none !important;
  }

  .header .mobile-head-box {
    display: block;
    position: relative;
  }

  .header .mobile-head-btn {
    padding: 2px 5px;
    background-color: #fff;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
  }

  .header .mobile-head-btn i {
    font-size: 20px;
  }

  .header .head-right {
    display: none !important;
  }

  .footer {
    padding: 15px;
  }

  .footer .footer-list {
    flex-wrap: wrap;
  }

  .footer .footer-list .footer-item {
    width: 100% !important;
  }
  .footer .footer-list .footer-item:first-child{
    display: none;
  }
  .footer-item .footer-item-title{
    display: none;
  }

  .foot-form-box{
    display: none;
  }

}


/* 导航栏 */

.product-child-box {
  position: fixed;
  top: 138px;
  left: 0;
  width: 100%;
  background-color: #0c0c0c;
  padding: 30px 50px;
  display: none;
  box-sizing: border-box;
  z-index: 999;
  min-height: 600px;
}

.product-child {
  width: 100%;
  display: flex;
  box-sizing: border-box;
  gap: 30px;
}

.product-child .product-child-left {
  width: 23%;
  background-color: #222222;
  border-radius: 6px;
}

.product-child .product-child-left ul {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
}

.product-child .product-child-left ul li {
  width: 100%;
}

.product-child .product-child-left ul li a {
  display: block;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px !important;
  font-size: 18px !important;
  color: #fff;
}

.product-child .product-child-left ul li a:hover {
  background-color: #e02873 !important;
  color: #fff !important;
}

.product-child .product-child-left ul li a i {
  font-size: 15px;
  color: #fff;
}

.product-child .product-child-right {
  width: 75%;
  box-sizing: border-box;
}

.product-child .product-child-right .product-child-three{
  width: 100%;
  display: none;
}
.product-child .product-child-right .product-child-three .child-three-img{
  width: 25%;
  height: 600px;
}
.product-child .product-child-right .product-child-three:first-child{
  display: block;
}

.product-child .product-child-right .product-child-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  min-width: 75%;
}

.product-child .product-child-right .product-child-list a:hover{
  border: none !important;
}

.product-child .product-child-right .product-child-list .product-child-item {
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  transition: 0.5s;
  position: relative;
  height: 290px;
  cursor: pointer;
  overflow: hidden;
}

/* .product-child .product-child-right .product-child-list .product-child-item:hover{
  transform: scale(1.1);
} */
.product-child .product-child-right .product-child-list .product-child-item:hover h1 {
  padding-top: 15px;
}

.product-child .product-child-right .product-child-list .product-child-item h1 {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  transition: 0.5s;
  color: #fff;
  font-size: 16px;
  line-height: 22px;
  background-color: rgb(0 0 0 / .47);
  padding: 5px;
  /* display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1; */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
}

@media (max-width:768px) {
  .footer .footer-about-list {
    margin-top: 30px;
  }

  .strength-two .strength-item div {
    padding: 10px 20px !important;
  }

  .header .head .head-box .head-left .head-logo img {
    width: 100%;
    height: auto;
  }
  .header .head .head-box .head-left{
    width: 30%;
  }
  .header .head{
    padding: 10px;
  }
}

/*分页*/
#pagelist {
  width: 100%;
  text-align: center;
  padding-bottom: 40px;
  padding-top: 50px;
  overflow: hidden;
  background-color: #0c0c0c;
}

#pagelist span {
  padding: 10px 15px;
  background: #dddede;
  color: #bababa;
  margin: 0 2px;
  border: 1px solid #ccc;
}

#pagelist a {
  background: #fff;
  padding: 10px 15px;
  color: #333;
  margin: 0 2px;
  border: 1px solid #eee;
  display: inline-block;
}

#pagelist .active {
  background: #e02783;
  color: #fff;
}