@font-face {
  font-family: "iconfont";
  src:
    url("/assets/css/font/fontIcon/iconfont.woff2?t=1765777637515") format("woff2"),
    url("/assets/css/font/fontIcon/iconfont.woff?t=1765777637515") format("woff"),
    url("/assets/css/font/fontIcon/iconfont.ttf?t=1765777637515") format("truetype");
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 0.2rem;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 768px) {
  .iconfont {
    font-size: 16px;
  }
}

@font-face {
  font-family: "Roboto-Bold";
  src: url("font/Roboto-Bold.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto-Black";
  src: url("font/Roboto-Black.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto-ExtraBold";
  src: url("font/Roboto-ExtraBold.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto-ExtraLight";
  src: url("font/Roboto-ExtraLight.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto-Light";
  src: url("font/Roboto-Light.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto-Thin";
  src: url("font/Roboto-Thin.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("font/Roboto-Regular.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto-Medium";
  src: url("font/Roboto-Medium.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto-SemiBold";
  src: url("font/Roboto-SemiBold.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("font/Roboto.ttf");
  font-display: swap;
}

html {
  font-size: calc(100vw / 24) !important;
}


@media screen and (min-width: 1920px) {
  html {
    font-size: 80px !important;
  }
}

:root {
  --mainColor: #000;
  --bg-c: #00adef;
  --bg: #f6f6f6;
  --main-font: "Roboto", system-ui, -apple-system, sans-serif;
}

body {
  font-family: var(--main-font);
  font-weight: 400;
}


body.inner {
  padding-top: 0.4rem;
}

@media screen and (max-width: 768px) {
  body.inner {}
}

.com-card {
  width: 17.5rem;
  height: 100%;
  margin: 0 auto;
}


@media screen and (max-width: 768px) {
  .com-card {
    width: 100%;
    padding: 0 20px
  }
}

@font-face {
  font-family: "Roboto";
  src: url("font/Roboto-Regular.ttf");
}

.system_com_title {
  width: 100%;
  height: auto;
  text-align: center;
  font-size: 0.45rem;
  color: #000;
}


@media screen and (max-width: 768px) {
  .system_com_title {}
}

.system_faq_box {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .system_faq_box {}
}

.system_faq_con {
  width: 100%;
  height: auto;
  margin-top: 0.4375rem;
}


@media screen and (max-width: 768px) {
  .system_faq_con {}
}

.system_faq_item {
  width: 100%;
  height: auto;
  margin-bottom: 0.15rem;
}

@media screen and (max-width: 768px) {
  .system_faq_item {}
}

.system_faq_item .tl {
  display: flex;
  align-items: center;
  cursor: pointer;
  width: 100%;
  height: 0.775rem;
  border-radius: 0.625rem;
  padding: 0 0.25rem;
  background-image: linear-gradient(320deg, #f7faff 0%, #f1f3f6 100%);
}


@media screen and (max-width: 768px) {
  .system_faq_item .tl {}
}

.system_faq_item .icon {
  display: block;
  width: 0.225rem;
  height: 0.025rem;
  border-radius: 0.0125rem;
  background-color: var(--mainColor);
  margin-right: 0.375rem;
}


@media screen and (max-width: 768px) {
  .system_faq_item .icon {}
}

.system_faq_item .icon::after {
  display: block;
  content: "";
  width: 0.225rem;
  height: 0.025rem;
  border-radius: 0.0125rem;
  transform: rotate(90deg);
  background-color: var(--mainColor);
  transition: all 0.5s;
}


@media screen and (max-width: 768px) {
  .system_faq_item .icon::after {}
}

.system_faq_item .tl .name {
  font-size: 0.225rem;
  font-weight: 700;
  flex: 1;
  color: var(--mainColor);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}


@media screen and (max-width: 768px) {
  .system_faq_item .tl .name {}
}

.system_faq_item .text {
  width: 100%;
  font-size: 0.2rem;
  display: none;
  line-height: 0.325rem;
  color: #a6adb5;
  padding: 0.25rem 0.5rem 0.375rem 0.625rem;
}


@media screen and (max-width: 768px) {
  .system_faq_item .text {}
}

.system_faq_item.active .tl {
  background-color: var(--mainColor);
  background-image: none;
  height: auto;
  padding: 0.125rem 0.25rem;
}


@media screen and (max-width: 768px) {
  .system_faq_item.active .tl {}
}

.system_faq_item.active .tl .name {
  color: #fff;
  display: inline;
}


@media screen and (max-width: 768px) {
  .system_faq_item.active .tl .name {}
}

.system_faq_item.active .icon,
.system_faq_item.active .icon::after {
  background-color: #fff;
}

@media screen and (max-width: 768px) {

  .system_faq_item.active .icon,
  .system_faq_item.active .icon::after {}
}

.system_faq_item.active .icon::after {
  transform: rotate(0);
}

@media screen and (max-width: 768px) {
  .system_faq_item.active .icon::after {}
}

.system_news_box {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .system_news_box {}
}

.system_news_con {
  width: 100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 0.4375rem;
}


@media screen and (max-width: 768px) {
  .system_news_con {}
}

.system_news_item {
  position: relative;
  border-radius: 0.075rem;
  margin: 0 0.25rem 0.25rem 0;
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.08);
}

@media screen and (max-width: 768px) {
  .system_news_item {}
}

.system_news_con_cols4 .system_news_item {
  width: calc((100% - 0.75rem) / 4);
}


@media screen and (max-width: 768px) {
  .system_news_con_cols4 .system_news_item {}
}

.system_news_con_cols3 .system_news_item {
  width: calc((100% - 0.5rem) / 3);
}

@media screen and (max-width: 768px) {
  .system_news_con_cols3 .system_news_item {}
}

.system_news_con_cols2 .system_news_item {
  width: calc((100% - 0.25rem) / 2);
}

@media screen and (max-width: 768px) {
  .system_news_con_cols2 .system_news_item {}
}

.system_news_con_cols4 .system_news_item:nth-child(4n),
.system_news_con_cols3 .system_news_item:nth-child(3n),
.system_news_con_cols2 .system_news_item:nth-child(2n) {
  margin-right: 0;
}


@media screen and (max-width: 768px) {

  .system_news_con_cols4 .system_news_item:nth-child(4n),
  .system_news_con_cols3 .system_news_item:nth-child(3n),
  .system_news_con_cols2 .system_news_item:nth-child(2n) {}
}

.system_news_item .img {
  width: 100%;
  height: 3.575rem;
  overflow: hidden;
  border-radius: 0.075rem 0.075rem 0 0;
}

@media screen and (max-width: 768px) {
  .system_news_item .img {}
}

.system_news_item .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: bottom;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .system_news_item .img img {}
}

.system_news_item:hover .img img {
  transform: scale(1.2);
}

@media screen and (max-width: 768px) {
  .system_news_item:hover .img img {}
}

.system_news_item .text {
  display: block;
  width: 100%;
  height: 3.0625rem;
  border-radius: 0 0 0.075rem 0.075rem;
  padding: 10%;
}


@media screen and (max-width: 768px) {
  .system_news_item .text {}
}

.system_news_item .text .name {
  font-size: 0.25rem;
  line-height: 0.325rem;
  margin-bottom: 0.1875rem;
  color: #000;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: all 0.3s;
  font-weight: 400;
}

@media screen and (max-width: 768px) {
  .system_news_item .text .name {
    font-size: 16px;
    line-height: 28px;
    height: 56px;
  }
}

.system_news_item .text .ls {
  font-size: 0.2rem;
  line-height: 0.3125rem;
  margin-bottom: 0.1875rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #828282;
}


@media screen and (max-width: 768px) {
  .system_news_item .text .ls {}
}

.system_news_item .bto {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  justify-content: space-between;
}

@media screen and (max-width: 768px) {
  .system_news_item .bto {}
}

.system_news_item .bto .lt {
  width: 80%;
}

@media screen and (max-width: 768px) {
  .system_news_item .bto .lt {}
}

.system_news_item .bto .time,
.system_news_item .bto .author {
  font-size: 0.1875rem;
  font-weight: 700;
  -webkit-transition: 0.5s cubic-bezier(0.37, 0, 0.63, 1);
  transition: 0.5s cubic-bezier(0.37, 0, 0.63, 1);
}


@media screen and (max-width: 768px) {

  .system_news_item .bto .time,
  .system_news_item .bto .author {}
}

.system_news_item .bto .number {
  font-size: 0.1875rem;
  color: #000;
  display: flex;
  align-items: center;
  font-weight: 600;
}


@media screen and (max-width: 768px) {
  .system_news_item .bto .number {}
}

.system_news_item .bto .number::before {
  margin-right: 0.05rem;
  transition: all 0.3s;
  font-size: 0.225rem;
  color: red;
}

@media screen and (max-width: 768px) {
  .system_news_item .bto .number::before {}
}

.system_news_item .bto .number:hover::before {
  transform: scale(1.2);
}

@media screen and (max-width: 768px) {
  .system_news_item .bto .number:hover::before {}
}

.system_news_item .bto .author {
  position: absolute;
  left: 0;
  bottom: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(0.4rem);
}

@media screen and (max-width: 768px) {
  .system_news_item .bto .author {}
}

.system_news_item:hover .author {
  transform: translateY(0);
  opacity: 1;
  overflow: visible;
}

@media screen and (max-width: 768px) {
  .system_news_item:hover .author {}
}



.system_news_item .bto .author span {
  display: inline-block;
  margin-left: 0.0625rem;
  text-decoration: underline;
}

@media screen and (max-width: 768px) {
  .system_news_item .bto .author span {}
}

.system_news_item:hover .name {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_news_item:hover .name {}
}

.system_news_categories {
  position: absolute;
  display: inline-block;
  top: 0.2125rem;
  right: 0.25rem;
  width: fit-content;
  box-shadow: 0 0 0.3125rem rgba(0, 0, 0, 0.4);
  padding: 0.05rem 0.15rem;
  background-color: #fff;
  color: #000;
  font-size: 0.2rem;
}


@media screen and (max-width: 768px) {
  .system_news_categories {}
}

.system_contact_box {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .system_contact_box {}
}

.system_contact_con {
  margin-top: 0.4375rem;
}

@media screen and (max-width: 768px) {
  .system_contact_con {}
}

.system_contact_con .top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}


@media screen and (max-width: 768px) {
  .system_contact_con .top {}
}

.system_contact_con .top li {
  position: relative;
  width: calc((100% - 0.75rem) / 3);
  height: auto;
  background-color: #f4f4f6;
  border-radius: 0.0625rem;
  display: flex;
  min-height: 3.125rem;
  flex-direction: column;
  transition: all 0.3s;
  justify-content: center;
  padding: 0.5rem 0.375rem;
  border-bottom: 0.05rem solid var(--mainColor);
}


@media screen and (max-width: 768px) {
  .system_contact_con .top li {}
}

.system_contact_con .top li .icon {
  font-size: 0.575rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mainColor);
}


@media screen and (max-width: 768px) {
  .system_contact_con .top li .icon {}
}

.system_contact_con .top li .name {
  font-size: 0.3rem;
  font-weight: 600;
  text-align: center;
  color: #000;
  margin: 0.375rem 0 0.125rem 0;
}


@media screen and (max-width: 768px) {
  .system_contact_con .top li .name {}
}

.system_contact_con .top li:hover {
  box-shadow: 0 0 0.1875rem 0 rgba(0, 0, 0, 0.3);
}

@media screen and (max-width: 768px) {
  .system_contact_con .top li:hover {}
}

.system_contact_con .top li .ls {
  font-size: 0.225rem;
  line-height: 0.325rem;
  text-align: center;
  color: #646c71;
}


@media screen and (max-width: 768px) {
  .system_contact_con .top li .ls {}
}

.system_contact_form {
  width: 100%;
  height: auto;
  padding: 1.125rem 0;
  margin-top: 1.25rem;
  background-color: #f4f4f6;
}


@media screen and (max-width: 768px) {
  .system_contact_form {}
}

.system_contact_form .title {
  font-size: 0.45rem;
  text-align: center;
  color: var(--mainColor);
  font-weight: 700;
}


@media screen and (max-width: 768px) {
  .system_contact_form .title {}
}

.system_contact_form form {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  margin-top: 0.3125rem;
}

@media screen and (max-width: 768px) {
  .system_contact_form form {}
}

.system_contact_form input {
  width: 100%;
  height: 0.6875rem;
  background-color: #fff;
  color: #192436;
  font-size: 0.2rem;
  padding: 0 0.125rem;
  outline: none;
  transition: all 0.3s;
  border-radius: 0.0625rem;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .system_contact_form input {}
}

.system_contact_form input:focus,
.system_contact_form textarea:focus {
  border: 0.0125rem solid var(--mainColor);
}

@media screen and (max-width: 768px) {

  .system_contact_form input:focus,
  .system_contact_form textarea:focus {}
}

.system_contact_form .formList {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.3125rem;
}

@media screen and (max-width: 768px) {
  .system_contact_form .formList {}
}

.system_contact_form .formList input {
  width: calc((100% - 0.25rem) / 2);
}

@media screen and (max-width: 768px) {
  .system_contact_form .formList input {}
}

.system_contact_form textarea {
  width: 100%;
  height: 4.375rem;
  transition: all 0.3s;
  font-size: 0.2rem;
  background-color: #fff;
  border-radius: 0.0625rem;
  color: #192436;
  padding: 0.125rem 0 0 0.125rem;
}


@media screen and (max-width: 768px) {
  .system_contact_form textarea {}
}

.system_contact_form button[type="submit"] {
  width: 30% !important;
  height: 0.65rem !important;
  font-size: 0.225rem !important;
  font-weight: 600 !important;
  background-color: var(--mainColor) !important;
  color: #fff !important;
  margin: 0 auto !important;
}

@media screen and (max-width: 768px) {
  .system_contact_form button[type="submit"] {}
}

.system_contact_form button {
  cursor: pointer;
}

@media screen and (max-width: 768px) {
  .system_contact_form button {}
}

.system_contact_form .com-ls24 {
  font-size: 0.225rem;
  color: #000;
}

@media screen and (max-width: 768px) {
  .system_contact_form .com-ls24 {}
}

.system_contact_form .com-ls24 a {
  text-decoration: underline;
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_contact_form .com-ls24 a {}
}

.iderContactTabs {
  background: #fff;
}


@media screen and (max-width: 768px) {
  .iderContactTabs {}
}

.iderContactTabs .about-tabs-row {
  width: 100%;
  gap: 0.2rem;
  justify-content: center;
  margin-bottom: 1.1rem;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .about-tabs-row {}
}



.iderContactTabs .contact-row {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 1.25rem 0;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact-row {
    padding: 50px 0;
  }
}

.iderContactTabs .contact-message-row {
  margin-bottom: 1.2rem;
  padding: 0 0 50px;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact-message-row {
    flex-direction: column;
    gap: 40px;
  }
}

.iderContactTabs .contact-info-row {
  margin-bottom: 0;
  background: rgba(248,249,251,1);
  align-items: flex-start;
}

@media screen and (max-width: 768px) {
  .iderContactTabs .contact-info-row {
    flex-direction: column;
  }
}

.iderContactTabs .contact-info-row .info-left{
  width: 50%;
  padding:.8125rem 1.125rem;
}

@media screen and (max-width: 768px){
  .iderContactTabs .contact-info-row .info-left{
    width: 100%;
    padding: 40px;
  }
}

.iderContactTabs .contact-info-row .info-right{
  flex:1;
  height: 100%;
}
@media screen and (max-width: 768px){
  .iderContactTabs .contact-info-row .info-right{
    flex: none;
  }
}


.iderContactTabs .contact-col {
  width: calc((100% - 0.9rem) / 2);
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact-col {
    width: 100%;
  }
}

.iderContactTabs .com_title {
  font-size: .5rem;
  font-family: Roboto-Bold;
  text-align: left;
  padding-bottom: .375rem;
  border-bottom: .025rem solid #f0f0f0;
  position: relative;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .com_title {
    font-size: 30px;
    padding-bottom: 20px;
    border-bottom-width: 3px;
  }
}

.iderContactTabs .com_title::after{
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    display: block;
    width:1.375rem;
    height: .0375rem;
    background-color: #00adef;
}

@media screen and (max-width: 768px){
  .iderContactTabs .com_title::after{
    width: 40px;
    height: 3px;
  }
}

.iderContactTabs .system_com_title{
  text-align: left;
  position: relative;
}

.iderContactTabs .system_com_title::after{
    content: '';
    display: block;
    width: .5rem;
    height: .0375rem;
    margin: .25rem 0;
    background-color: #00adef;
}

@media screen and (max-width: 768px){
  .iderContactTabs .system_com_title::after{
    width: 80px;
    height: 3px;
    margin: 20px 0;
  }
}

.iderContactTabs .contact-message-ls {
  font-size: .175rem;
  line-height: 1.7;
  color: #777;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact-message-ls {
    font-size: 14px;
  }
}



.iderContactTabs .contact_con {
  margin-top: 0;
}

@media screen and (max-width: 768px) {
  .iderContactTabs .contact_con {}
}

.iderContactTabs .contact_con .top {
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .iderContactTabs .contact_con .top {
    flex-direction: column;
  }
}

.iderContactTabs .contact_con .top li {
  width: 100%;
  padding: .375rem 0;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: .1875rem;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact_con .top li {
    padding: 25px 0;
    gap: 10px;
  }
}

.iderContactTabs .contact_con .top li:nth-child(2),.iderContactTabs .contact_con .top li:nth-child(3){
  width: 50%;
}

@media screen and (max-width: 768px){
  .iderContactTabs .contact_con .top li:nth-child(2),.iderContactTabs .contact_con .top li:nth-child(3){
    width: 100%;
  }
}

.iderContactTabs .contact_con .top li .icon {
  width:.625rem;
  height: .625rem;
  border: 1px solid #e9e9e9;
  font-size:.375rem;
  color: #111;
  display: flex;
  align-items: center;
  justify-content: center;
}

.iderContactTabs .contact_con .top li .icon i {
  font-size: inherit;
  line-height: 1;
}

.iderContactTabs .contact_con .top li .icon svg {
  width: .28rem;
  height: .28rem;
  display: block;
  fill: currentColor;
}

@media screen and (max-width: 768px) {
  .iderContactTabs .contact_con .top li .icon svg {
    width: 20px;
    height: 20px;
  }
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact_con .top li .icon {
    width: 45px;
    height: 45px;
    font-size: 20px;
  }
}

.iderContactTabs .contact_con .top li .item-text {
  flex: 1;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact_con .top li .item-text {}
}

.iderContactTabs .contact_con .top li .name {
  margin: 0;
  text-align: left;
  font-size: .175rem;
  font-weight: 400;
  color: rgba(153,153,153,1);
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact_con .top li .name {
    font-size: 14px;
  }
}

.iderContactTabs .contact_con .top li .ls {
  margin-top: 0.05rem;
  text-align: left;
  font-size: .2rem;
  line-height: 1.2;
  color: #000;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact_con .top li .ls {
    font-size: 16px;
    margin-top: 8px;
  }
}

.iderContactTabs .contact-map {
  width: 100%;
  height: 100%;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact-map {
    height: 350px;
  }
}

.iderContactTabs .contact-map iframe {
  width: 100%;
  height: 8.125rem;
  border: 0;
}


@media screen and (max-width: 768px) {
  .iderContactTabs .contact-map iframe {
    height: 350px;
  }
}

@media screen and (max-width: 640px) {
  .iderContactTabs .about-tabs-row {
    margin-bottom: 40px;
  }

  .iderContactTabs .about-tab-item {
    width: 100%;
    max-width: none;
  }

  .iderContactTabs .system_com_title {
    font-size: 32px;
  }

  .iderContactTabs .system_contact_con .top li .ls {
    font-size: 15px;
  }
}

.iderContactJobsTabs {
  padding: 0.68rem 0 0.78rem;
  background: #fff;
}


@media screen and (max-width: 768px) {
  .iderContactJobsTabs {}
}



.iderContactJobsTabs .jobs-title {
  margin: 0 0 0.5rem;
  text-align: center;
  font-size:.6rem;
  line-height: 1.1;
  color: #111;
}


@media screen and (max-width: 768px) {
  .iderContactJobsTabs .jobs-title {
    font-size: 30px;
    margin-bottom: 40px;
  }
}

.iderContactJobsTabs .jobs-table-wrap {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .jobs-table-wrap {}
}

.iderContactJobsTabs .jobs-table-header,
.iderContactJobsTabs .job-summary {
  width: 100%;
  min-height: .75rem;
}

@media screen and (max-width: 768px) {

  .iderContactJobsTabs .jobs-table-header,
  .iderContactJobsTabs .job-summary {
    min-height: 45px;
  }
}

.iderContactJobsTabs .jobs-table-header {
  background: #46549d;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .jobs-table-header {
    justify-content: space-between;
  }
}

.iderContactJobsTabs .jobs-table-header>div {
  color: #fff;
  font-size: .225rem;
  font-weight: 500;
}


@media screen and (max-width: 768px) {
  .iderContactJobsTabs .jobs-table-header>div {
    font-size: 14px;
  }

  .iderContactJobsTabs .jobs-table-header>div.col-salary{
    display: none;
  } 
}

.iderContactJobsTabs .jobs-table-header>div,
.iderContactJobsTabs .job-summary>div {
  padding: 0.18rem 0.15rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}


@media screen and (max-width: 768px) {

  .iderContactJobsTabs .jobs-table-header>div,
  .iderContactJobsTabs .job-summary>div {
    padding: 10px;
  }

  .iderContactJobsTabs .job-summary>div.col-salary{
    display: none;
  }
}

.iderContactJobsTabs .col-job {
  width: 30%;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .col-job {}
}

.iderContactJobsTabs .col-location {
  width: 24%;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .col-location {}
}

.iderContactJobsTabs .col-salary {
  width: 24%;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .col-salary {}
}

.iderContactJobsTabs .col-more {
  width: 22%;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .col-more {}
}

.iderContactJobsTabs .job-item {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-item {
    justify-content: space-between;
  }
}

.iderContactJobsTabs .job-summary {
  background: #f9f9f9;
  border-bottom: 1px dashed #f1f1f1;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-summary {}
}

.iderContactJobsTabs .job-item.has-detail .job-summary {
  cursor: pointer;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-item.has-detail .job-summary {
    justify-content: space-between;
  }
}

.iderContactJobsTabs .job-summary>div {
  font-size: 0.24rem;
  color: #222;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-summary>div {
    font-size: 12px;
  }
}

.iderContactJobsTabs .job-summary .col-more {
  font-size: 0.4rem;
  color: #888;
}


@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-summary .col-more {
    font-size:26px;
  }
}

.iderContactJobsTabs .job-summary .col-more .toggle-icon {
  display: inline-block;
  min-width: 0.22rem;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-summary .col-more .toggle-icon {}
}

.iderContactJobsTabs .job-detail {
  display: none;
  background: rgba(238,238,238,1);
  padding: 0.36rem 0.65rem 0.32rem;
  font-size: 0.2rem;
  line-height: 1.9;
  color: #333;
}


@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-detail {
    padding:20px;
    font-size: 12px;
  }
}


@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-item.open .job-detail {}
}

.iderContactJobsTabs .job-detail p {
  margin-bottom: 0.16rem;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-detail p {}
}

.iderContactJobsTabs .job-detail p:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .job-detail p:last-child {}
}

.iderContactJobsTabs .jobs-pagination {
  width: 100%;
  margin-top: 0.28rem;
}


@media screen and (max-width: 768px) {
  .iderContactJobsTabs .jobs-pagination {}
}

.iderContactJobsTabs .jobs-pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .jobs-pagination .page-numbers {}
}

.iderContactJobsTabs .jobs-pagination .page-numbers span {
  display: inline-flex;
}

@media screen and (max-width: 768px) {
  .iderContactJobsTabs .jobs-pagination .page-numbers span {}
}

.iderContactJobsTabs .jobs-pagination .page-numbers a,
.iderContactJobsTabs .jobs-pagination .page-numbers .current {
  width: 0.34rem;
  height: 0.34rem;
  border: 1px solid #e8e8e8;
  color: #999;
  font-size: 0.18rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .iderContactJobsTabs .jobs-pagination .page-numbers a,
  .iderContactJobsTabs .jobs-pagination .page-numbers .current {}
}

.iderContactJobsTabs .jobs-pagination .page-numbers .current,
.iderContactJobsTabs .jobs-pagination .page-numbers a:hover {
  color: #fff;
  background: #2f49a7;
  border-color: #2f49a7;
}

@media screen and (max-width: 768px) {

  .iderContactJobsTabs .jobs-pagination .page-numbers .current,
  .iderContactJobsTabs .jobs-pagination .page-numbers a:hover {}
}

.search_results_box{
  padding: 1rem 0 !important;
}
@media screen and (max-width: 768px){
  .search_results_box{
    padding: 50px 0 !important;
  }
}


.search_results_box .system_com_title{
  margin-bottom: .5rem;
  font-size: .3rem;
}
@media screen and (max-width: 768px){
  .search_results_box .system_com_title{
    font-size: 18px;
    margin-bottom: 20px;
  }
}


.search_results_box .iderApplicaBox5Con{
  margin-top: .25rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .25rem;
}

@media screen and (max-width: 768px){
  .search_results_box .iderApplicaBox5Con{
    grid-template-columns: 1fr;
    margin-top: 20px;
    gap: 40px;
  }
}

.search_results_box .iderApplicaBox5Con .item{
  border: .0125rem solid #ddd;
}
@media screen and (max-width: 768px){
  .search_results_box .iderApplicaBox5Con .item{
    border-width: 1px;
  }
}


.search_results_box .iderApplicaBox5Con .item .img a{
  overflow: hidden;
  height: 3.125rem;
  padding: .125rem;
  display: block;
}

@media screen and (max-width: 768px){
  .search_results_box .iderApplicaBox5Con .item .img a{
    height:230px;
    padding: 10px;
  }
}

.search_results_box .iderApplicaBox5Con .item .img img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: all .3s;
}

.search_results_box .iderApplicaBox5Con .item .text{
  padding: .25rem;
}

@media screen and (max-width: 768px){
  .search_results_box .iderApplicaBox5Con .item .text{
    padding: 10px;
  }
}

.search_results_box .iderApplicaBox5Con .item .text a{
  display: block;
  font-size: .2rem;
  line-height: .35rem;
  max-height: .7rem;
  overflow: hidden;
   display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

@media screen and (max-width: 768px){
  .search_results_box .iderApplicaBox5Con .item .text a{
    font-size: 14px;
    line-height: 28px;
    max-height: 56px;
  }
}

.system_list_box {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .system_list_box {}
}

.system_list_con {
  width: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 0.4375rem;
}


@media screen and (max-width: 768px) {
  .system_list_con {}
}

.system_list_item {
  box-shadow: 0 0 0.3125rem rgba(0, 0, 0, 0.1);
  margin: 0 0.25rem 0.25rem 0;
  border-radius: 0.0625rem;
}

@media screen and (max-width: 768px) {
  .system_list_item {}
}

.system_list_con_col4 .system_list_item {
  width: calc((100% - 0.75rem) / 4);
}


@media screen and (max-width: 768px) {
  .system_list_con_col4 .system_list_item {}
}

.system_list_con_col3 .system_list_item {
  width: calc((100% - 0.5rem) / 3);
}

@media screen and (max-width: 768px) {
  .system_list_con_col3 .system_list_item {}
}

.system_list_con_col2 .system_list_item {
  width: calc((100% - 0.25rem) / 2);
}

@media screen and (max-width: 768px) {
  .system_list_con_col2 .system_list_item {}
}

.system_list_con_col4 .system_list_item:nth-child(4n),
.system_list_con_col3 .system_list_item:nth-child(3n),
.system_list_con_col2 .system_list_item:nth-child(2n) {
  margin-right: 0;
}


@media screen and (max-width: 768px) {

  .system_list_con_col4 .system_list_item:nth-child(4n),
  .system_list_con_col3 .system_list_item:nth-child(3n),
  .system_list_con_col2 .system_list_item:nth-child(2n) {}
}

.system_list_item .img {
  width: 100%;
  height: 3.6rem;
  overflow: hidden;
  border-radius: 0.0625rem 0.0625rem 0 0;
}

@media screen and (max-width: 768px) {
  .system_list_item .img {}
}

.system_list_item .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: bottom;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .system_list_item .img img {}
}

.system_list_item:hover .img img {
  transform: scale(1.2);
}

@media screen and (max-width: 768px) {
  .system_list_item:hover .img img {}
}

.system_list_item .text {
  display: block;
  width: 100%;
  height: 2.2125rem;
  background-color: #fff;
  padding: 0.25rem 0.1875rem;
  border-radius: 0 0 0.0625rem 0.0625rem;
}


@media screen and (max-width: 768px) {
  .system_list_item .text {}
}

.system_list_item .text .name {
  font-size: 0.25rem;
  color: #000;
  font-weight: 700;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  margin-bottom: 0.125rem;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .system_list_item .text .name {}
}

.system_list_item .text .ls {
  font-size: 0.2rem;
  line-height: 0.3125rem;
  color: #a7a7a7;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 0.125rem;
}


@media screen and (max-width: 768px) {
  .system_list_item .text .ls {}
}

.system_list_item .text .mores {
  display: block;
  position: relative;
  width: 1.9375rem;
  height: 0.5rem;
  line-height: 0.5rem;
  margin: 0 auto;
  text-align: center;
  border-radius: 0.05rem;
  font-size: 0.2rem;
  color: #fff;
  font-weight: 600;
  background-color: var(--mainColor);
  z-index: 1;
}


@media screen and (max-width: 768px) {
  .system_list_item .text .mores {}
}

.system_list_item .text .mores::after {
  display: block;
  content: "";
  width: 0;
  height: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: #000;
  border-radius: 0.05rem;
  transition: all 0.3s;
  z-index: -1;
}

@media screen and (max-width: 768px) {
  .system_list_item .text .mores::after {}
}

.system_list_item:hover .mores::after {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .system_list_item:hover .mores::after {}
}

.system_list_item:hover .name {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_list_item:hover .name {}
}

.system_video_box {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .system_video_box {}
}

.system_video_con {
  width: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 0.4375rem;
}


@media screen and (max-width: 768px) {
  .system_video_con {}
}

.system_video_item {
  width: calc((100% - 0.75rem) / 4);
  height: auto;
  margin: 0 0.25rem 0.25rem 0;
  box-shadow: 0 0 0.1875rem rgba(0, 0, 0, 0.4);
  border-radius: 0.0625rem;
}

@media screen and (max-width: 768px) {
  .system_video_item {}
}

.system_list_con_col4 .system_video_item {
  width: calc((100% - 0.75rem) / 4);
}


@media screen and (max-width: 768px) {
  .system_list_con_col4 .system_video_item {}
}

.system_list_con_col3 .system_video_item {
  width: calc((100% - 0.5rem) / 3);
}

@media screen and (max-width: 768px) {
  .system_list_con_col3 .system_video_item {}
}

.system_list_con_col2 .system_video_item {
  width: calc((100% - 0.25rem) / 2);
}

@media screen and (max-width: 768px) {
  .system_list_con_col2 .system_video_item {}
}

.system_list_con_col4 .system_video_item:nth-child(4n),
.system_list_con_col3 .system_video_item:nth-child(3n),
.system_list_con_col2 .system_video_item:nth-child(2n) {
  margin-right: 0;
}


@media screen and (max-width: 768px) {

  .system_list_con_col4 .system_video_item:nth-child(4n),
  .system_list_con_col3 .system_video_item:nth-child(3n),
  .system_list_con_col2 .system_video_item:nth-child(2n) {}
}

.system_video_item .img {
  width: 100%;
  height: 3.125rem;
  overflow: hidden;
  border-radius: 0.0625rem 0.0625rem 0 0;
}

@media screen and (max-width: 768px) {
  .system_video_item .img {}
}

.system_list_con_col3 .system_video_item .img {
  height: 3.75rem;
}

@media screen and (max-width: 768px) {
  .system_list_con_col3 .system_video_item .img {}
}

.system_list_con_col2 .system_video_item .img {
  height: 4.375rem;
}

@media screen and (max-width: 768px) {
  .system_list_con_col2 .system_video_item .img {}
}

.system_video_item .img iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width: 768px) {
  .system_video_item .img iframe {}
}

.system_video_item .name {
  width: 100%;
  padding: 0.15rem 0.1875rem;
  font-size: 0.225rem;
  line-height: 0.375rem;
  color: #000;
  height: 1rem;
  text-align: center;
  font-weight: 600;
  background-color: #fff;
  border-radius: 0 0 0.0625rem 0.0625rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}


@media screen and (max-width: 768px) {
  .system_video_item .name {}
}

.system_down_box {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
  background-color: #f8f8f8;
}


@media screen and (max-width: 768px) {
  .system_down_box {}
}

.system_down_con {
  width: 100%;
  height: auto;
  margin-top: 0.4375rem;
  display: flex;
  flex-wrap: wrap;
}


@media screen and (max-width: 768px) {
  .system_down_con {}
}

.system_down_item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding-bottom: 0.1875rem;
  margin-bottom: 0.3125rem;
  border-radius: 0.0625rem;
  padding: 0 0.25rem 0.3125rem 0.25rem;
  transition: all 0.3s;
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}


@media screen and (max-width: 768px) {
  .system_down_item {}
}

.system_down_item:hover {
  border-bottom: 1px solid var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_down_item:hover {}
}

.system_down_item .lt .icon1 {
  font-size: 0.35rem;
  color: var(--mainColor);
}


@media screen and (max-width: 768px) {
  .system_down_item .lt .icon1 {}
}

.system_down_item .name {
  font-size: 0.25rem;
  font-weight: 600;
  color: #000;
  text-decoration: underline;
  margin: 0 0.1875rem 0 0.375rem;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .system_down_item .name {}
}

.system_down_item:hover .name {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_down_item:hover .name {}
}

.system_down_item .time {
  font-size: 0.2rem;
  color: #938f8d;
}


@media screen and (max-width: 768px) {
  .system_down_item .time {}
}

.system_down_item .lt {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 768px) {
  .system_down_item .lt {}
}

.system_down_item .rt {
  display: flex;
  align-items: center;
}


@media screen and (max-width: 768px) {
  .system_down_item .rt {}
}

.system_down_item .rt .size {
  font-size: 0.2rem;
  margin-right: 0.125rem;
  color: #938f8d;
}


@media screen and (max-width: 768px) {
  .system_down_item .rt .size {}
}

.system_down_item .rt .icon2 {
  font-size: 0.375rem;
  color: var(--mainColor);
}


@media screen and (max-width: 768px) {
  .system_down_item .rt .icon2 {}
}

.iderDownloadTabs {
  padding: 1.25rem 0;
  background: #fff;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs {
    padding: 50px 0;
  }
}

.iderDownloadTabs .about-tabs-row {
  width: 100%;
  gap: 0.2rem;
  margin-bottom: .75rem;
  justify-content: center;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .about-tabs-row {
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 40px;
  }
}

.iderDownloadTabs .about-tab-item {
  height:.75rem;
  line-height: 0.75rem;
  width: 4.25rem;
  text-align: center;
  font-size: .25rem;
  color: #333;
  background-color: #f3f3f3;
  transition: all 0.3s;
  display: inline-block;
  position: relative;
  z-index: 1;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .about-tab-item {
    width: 48%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
  }
}

.iderDownloadTabs .about-tab-item::before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  background: #00adef;
  transition: all .3s;
  z-index: -1;
}
.iderDownloadTabs .about-tab-item.active{
  color: #fff;
  background: #00adef;
}

.iderDownloadTabs .about-tab-item:hover {
  color: #fff;
}
.iderDownloadTabs .about-tab-item:hover::before{
  width: 100%;
}

@media screen and (max-width: 768px) {

  .iderDownloadTabs .about-tab-item.active,
  .iderDownloadTabs .about-tab-item:hover {}
}

.iderDownloadTabs .download-columns {
  width: 100%;
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .download-columns {
    flex-direction: column;
  }
}

.iderDownloadTabs .download-col {
  width: calc((100% - 0.5rem) / 2);
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .download-col {
    width: 100%;
  }
}

.iderDownloadTabs .system_down_item {
  width: 100%;
  padding: 0.14rem 0 .3125rem;
  margin: 0;
  border-bottom: 1px solid #f0f0f0;
  gap: .25rem;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .system_down_item {
    padding: 20px 0 25px;
    gap: 10px;
  }
}

.iderDownloadTabs .system_down_item .lt {
  display: block;
  width: calc(100% - 1.35rem);
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .system_down_item .lt {}
}

.iderDownloadTabs .system_down_item .time {
  font-size: .175rem;
  color: #999;
  line-height: 1.4;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .system_down_item .time {
    font-size: 14px;
  }
}

.iderDownloadTabs .system_down_item .name {
  margin: .125rem 0 0;
  text-decoration: none;
  font-size:.2rem;
  line-height: 1.32;
  color: #333;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .system_down_item .name {
    margin-top: 10px;
    font-size: 16px;
  }
}

.iderDownloadTabs .system_down_item .name:hover {
  color: #2f49a7;
  text-decoration: underline;
}


.iderDownloadTabs .system_down_item .rt {
  flex-shrink: 0;
  flex: 1;
}

@media screen and (max-width: 768px) {
  .iderDownloadTabs .system_down_item .rt {}
}

.iderDownloadTabs .download-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.25rem;
  height: .5rem;
  text-align: center;
  font-size: 0.18rem;
  color: #fff;
  background: #333;
  border-radius: .0625rem;
  transition: all 0.3s;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.iderDownloadTabs .download-btn::before{
    content: "";
    position: absolute;
    display: block;
    transition: all .3s;
    width: 100%;
    height: 0;
    border-radius: 50%;
    left: 50%;
    top: 50%;
    padding-top: 100%;
    transform: translateX(-50%) translateY(-50%) scale(.5);
    background-color: #00adef;
    opacity: 0;
    z-index: -1;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .download-btn {
    min-width: 80px;
    line-height: 40px;
    height: 40px;
    border-radius: 3px;
    font-size: 14px;
  }
}

.iderDownloadTabs .system_down_item .download-btn:hover {
  background: #00adef;
}

@media screen and (max-width: 768px) {
  .iderDownloadTabs .system_down_item:hover .download-btn {}
}

.iderDownloadTabs .system_down_item .download-btn:hover::before{
  transform:translateX(-50%) translateY(-50%) scale(1);
  width: 100%;
  opacity: 1;
}

.iderDownloadTabs .download-pagination {
  margin-top: 0.22rem;
}


@media screen and (max-width: 768px) {
  .iderDownloadTabs .download-pagination {}
}

.iderDownloadTabs .download-pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
}

@media screen and (max-width: 768px) {
  .iderDownloadTabs .download-pagination .page-numbers {}
}

.iderDownloadTabs .download-pagination .page-numbers span {
  display: inline-flex;
}

@media screen and (max-width: 768px) {
  .iderDownloadTabs .download-pagination .page-numbers span {}
}

.iderDownloadTabs .download-pagination .page-numbers a,
.iderDownloadTabs .download-pagination .page-numbers .current {
  min-width: 0.34rem;
  height: 0.34rem;
  padding: 0 0.08rem;
  border: 1px solid #ececec;
  background: #fff;
  color: #666;
  font-size: 0.18rem;
  line-height: 0.32rem;
  text-align: center;
}


@media screen and (max-width: 768px) {

  .iderDownloadTabs .download-pagination .page-numbers a,
  .iderDownloadTabs .download-pagination .page-numbers .current {}
}

.iderDownloadTabs .download-pagination .page-numbers .current {
  border-color: #2f49a7;
  background: #2f49a7;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .iderDownloadTabs .download-pagination .page-numbers .current {}
}

.system_newsDel_box {
  width: 100%;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .system_newsDel_box {}
}

.system_newsDel_box .com-card {
  display: flex;
}


@media screen and (max-width: 768px) {
  .system_newsDel_box .com-card {}
}

.system_newsDel_lt {
  width: calc((100% - 25%));
}


@media screen and (max-width: 768px) {
  .system_newsDel_lt {}
}

.system_newsDel_nav,
.system_newsDel_nav .com-card {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 768px) {

  .system_newsDel_nav,
  .system_newsDel_nav .com-card {}
}

.system_newsDel_nav a {
  font-size: 0.2rem;
  color: #000;
}


@media screen and (max-width: 768px) {
  .system_newsDel_nav a {}
}

.system_newsDel_rt {
  width: 25%;
  margin-left: 0.625rem;
}


@media screen and (max-width: 768px) {
  .system_newsDel_rt {}
}

.system_newsDel_category {
  width: fit-content;
  padding: 0.06rem 0.18rem;
  font-size: 0.18rem;
  letter-spacing: 0.02rem;
  background-color: #00adef;
  color: #fff;
  border-radius: 0.04rem;
  margin: 0 auto;
  margin-top: 0.7rem;
}


@media screen and (max-width: 768px) {
  .system_newsDel_category {
    margin-top: 28px;
    padding: 4px 12px;
    font-size: 12px;
    border-radius: 3px;
  }
}

.system_newsDel_box .system_com_title {
  font-size: 0.58rem;
  line-height: 1.24;
  font-weight: 700;
  color: #0b1733;
  text-align: left;
  margin: 0.34rem 0 0.18rem;
  padding-top: 0.4rem;
  border-top: 1px solid #101520;
}

@media screen and (max-width: 768px) {
  .system_newsDel_box .system_com_title {
    font-size: 30px;
    line-height: 1.32;
    margin: 16px 0 10px;
    padding-top: 20px;
  }
}

.system_newsDel_name {
  width: 100%;
  font-size: 0.24rem;
  color: #1d2334;
  text-align: left;
  line-height: 1.7;
  padding-bottom: 0.46rem;
  border-bottom: 1px solid #0f1422;
}


@media screen and (max-width: 768px) {
  .system_newsDel_name {
    font-size: 15px;
    line-height: 1.7;
    padding-bottom: 20px;
  }
}

.system_newsDel_link {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.16rem;
  margin: 0.24rem 0 0.48rem;
}


@media screen and (max-width: 768px) {
  .system_newsDel_link {
    margin: 15px 0 26px;
    gap: 8px;
  }
}

.system_newsDel_content {
  margin-bottom: 0.625rem;
  padding-top: 0.22rem;
}


@media screen and (max-width: 768px) {
  .system_newsDel_content {
    padding-top: 8px;
  }
}

.system_newsDel_link a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.54rem;
  height: 0.54rem;
  font-size: 0.26rem;
  margin-right: 0;
  border: 1px solid #d5d9e3;
  border-radius: 50%;
  color: #0a1733;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .system_newsDel_link a {
    width: 34px;
    height: 34px;
    font-size: 15px;
  }
}

.system_newsDel_link a:last-child {
  margin-right: 0;
}

@media screen and (max-width: 768px) {
  .system_newsDel_link a:last-child {}
}

.system_newsDel_link a i {
  display: inline-block;
  width: 100%;
  font-size: 0.26rem;
  height: 100%;
  color: currentColor;
  line-height: 0.54rem;
  text-align: center;
}
.system_newsDel_link a:hover {
  background-color: #00adef;
  border-color: #00adef;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .system_newsDel_link a i {
    font-size: 15px;
    line-height: 34px;
  }
}

.system_newsDel_content,
.system_newsDel_content p {
  font-size: 0.275rem;
  line-height: 1.88;
  color: #0d1a34;
  margin-bottom: 0.12rem;
}


@media screen and (max-width: 768px) {

  .system_newsDel_content,
  .system_newsDel_content p {
    font-size: 16px;
    line-height: 1.82;
    margin-bottom: 8px;
  }
}

.system_newsDel_bto {
  width: 100%;
  height: auto;
  padding: 0.375rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
}


@media screen and (max-width: 768px) {
  .system_newsDel_bto {}
}

.system_newsDel_bto .lt_prev,
.system_newsDel_bto .rt_next {
  display: flex;
  align-items: center;
  width: 40%;
}


@media screen and (max-width: 768px) {

  .system_newsDel_bto .lt_prev,
  .system_newsDel_bto .rt_next {}
}

.system_newsDel_bto .icon {
  font-size: 0.475rem;
  transition: all 0.3s;
  color: rgba(0, 0, 0, 0.5);
}

@media screen and (max-width: 768px) {
  .system_newsDel_bto .icon {}
}

.system_newsDel_bto .lt_prev .icon {
  margin-right: 0.25rem;
}

@media screen and (max-width: 768px) {
  .system_newsDel_bto .lt_prev .icon {}
}

.system_newsDel_bto .rt_next .icon {
  margin-left: 0.25rem;
}

@media screen and (max-width: 768px) {
  .system_newsDel_bto .rt_next .icon {}
}

.system_newsDel_bto .lt_prev:hover .ls,
.system_newsDel_bto .lt_prev:hover .icon,
.system_newsDel_bto .rt_next:hover .ls,
.system_newsDel_bto .rt_next:hover .icon,
.system_newsDel_bto .con:hover {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {

  .system_newsDel_bto .lt_prev:hover .ls,
  .system_newsDel_bto .lt_prev:hover .icon,
  .system_newsDel_bto .rt_next:hover .ls,
  .system_newsDel_bto .rt_next:hover .icon,
  .system_newsDel_bto .con:hover {}
}

.system_newsDel_bto .text .name {
  font-size: 0.2rem;
  color: #bbb;
}


@media screen and (max-width: 768px) {
  .system_newsDel_bto .text .name {}
}

.system_newsDel_bto .text .ls {
  font-size: 0.2rem;
  font-weight: 600;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 0.3rem;
  color: #333;
  margin-top: 0.05rem;
}


@media screen and (max-width: 768px) {
  .system_newsDel_bto .text .ls {}
}

.system_newsDel_bto .con {
  font-size: 0.375rem;
  color: rgba(0, 0, 0, 0.5);
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .system_newsDel_bto .con {}
}

.system_newsDel_rt .title {
  font-size: 0.45rem;
  color: #000;
  font-weight: 700;
}


@media screen and (max-width: 768px) {
  .system_newsDel_rt .title {}
}

.system_newsDel_rtItem {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .system_newsDel_rtItem {}
}

.system_newsDel_rtItem li {
  width: 100%;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #eee;
  padding: 0.25rem 0;
}

@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li {}
}

.system_newsDel_rtItem li .img {
  width: 1.25rem;
  overflow: hidden;
  height: 1.125rem;
  border-radius: 0.05rem;
  margin-right: 0.1875rem;
}

@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li .img {}
}

.system_newsDel_rtItem li:hover img {
  transform: scale(1.2);
}

@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li:hover img {}
}

.system_newsDel_rtItem li:hover .name {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li:hover .name {}
}

.system_newsDel_rtItem li .img a {
  display: flex;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li .img a {}
}

.system_newsDel_rtItem li .text {
  display: inline-block;
  flex: 1;
}

@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li .text {}
}

.system_newsDel_rtItem li .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: bottom;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li .img img {}
}

.system_newsDel_rtItem li .name {
  font-size: 0.225rem;
  line-height: 0.325rem;
  font-weight: 700;
  color: #333;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}


@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li .name {}
}

.system_newsDel_rtItem li .time {
  font-size: 0.2rem;
  color: #666;
  margin-top: 0.0625rem;
}


@media screen and (max-width: 768px) {
  .system_newsDel_rtItem li .time {}
}

.system_newsDel_form {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .system_newsDel_form {}
}

.system_newsDel_form .tl {
  font-size: 0.3rem;
  color: #333 !important;
  font-weight: 700;
  margin: 0.5rem 0 0.25rem 0;
}

@media screen and (max-width: 768px) {
  .system_newsDel_form .tl {}
}

.system_newsDel_form form {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .system_newsDel_form form {}
}

.system_newsDel_form form input {
  width: 100%;
  display: flex;
  height: 0.5875rem;
  font-size: 0.225rem !important;
  padding-left: 0.1875rem !important;
  border-radius: 0.0625rem !important;
  margin-bottom: 0.1875rem;
  color: #333 !important;
  border: 1px solid #eee !important;
}

@media screen and (max-width: 768px) {
  .system_newsDel_form form input {}
}

.system_newsDel_form form textarea {
  width: 100%;
  display: flex;
  height: 1.5rem;
  color: #333;
  font-size: 0.225rem;
  border-radius: 0.0625rem;
  border: 1px solid #eee;
  padding: 0.125rem 0 0 0.1875rem;
}

@media screen and (max-width: 768px) {
  .system_newsDel_form form textarea {}
}

.system_newsDel_form form .ls {
  font-size: 0.2rem;
  line-height: 0.3rem;
  color: #000;
  margin: 0.15rem 0 0.25rem 0;
}


@media screen and (max-width: 768px) {
  .system_newsDel_form form .ls {}
}

.system_newsDel_form form .ls a {
  text-decoration: underline !important;
}

@media screen and (max-width: 768px) {
  .system_newsDel_form form .ls a {}
}

.system_newsDel_form form button {
  width: 1.9rem !important;
  height: 0.5875rem !important;
  border-radius: 0.0625rem !important;
  font-size: 0.225rem !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  color: #fff !important;
  text-align: center;
  line-height: 0.5875rem;
  background-color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_newsDel_form form button {}
}

.system_newsDel_table {
  width: 100%;
  height: auto;
  padding-top: 0.5rem;
}


@media screen and (max-width: 768px) {
  .system_newsDel_table {}
}

.system_newsDel_table .title {
  width: 100%;
  font-size: 0.3rem;
  color: #323232;
  font-weight: 700;
  padding-bottom: 0.1875rem;
  margin-bottom: 0.25rem;
  border-bottom: 1px solid rgba(110, 110, 110, 0.2);
}

@media screen and (max-width: 768px) {
  .system_newsDel_table .title {}
}

.system_newsDel_tableCon {
  width: 100%;
  border-left: 1px solid rgba(110, 110, 110, 0.2);
  padding: 0.125rem 0;
}

@media screen and (max-width: 768px) {
  .system_newsDel_tableCon {}
}

.system_newsDel_tableCon .item {
  position: relative;
  font-size: 0.25rem;
  line-height: 0.325rem;
  cursor: pointer;
  color: #000;
  font-weight: 700;
  padding-left: 0.1875rem;
  margin-bottom: 0.375rem;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .system_newsDel_tableCon .item {}
}

.system_newsDel_content h2,
.system_newsDel_content h3 {
  font-size: 0.36rem;
  font-weight: 700;
  line-height: 1.4;
  color: #0d1a34;
  margin: 0.3rem 0 0.16rem;
}

.system_newsDel_content ol,
.system_newsDel_content ul {
  margin: 0.12rem 0 0.26rem 0.36rem;
}

.system_newsDel_content li {
  font-size: 0.275rem;
  line-height: 1.88;
  color: #0d1a34;
  margin-bottom: 0.06rem;
}


@media screen and (max-width: 768px) {

  .system_newsDel_content h2,
  .system_newsDel_content h3 {
    font-size: 21px;
    line-height: 1.4;
    margin: 16px 0 8px;
  }
}

.system_newsDel_content table {
  width: 100%;
  height: auto;
  border: 1px solid #333;
  margin: 0.125rem 0;
  overflow: auto;
}


@media screen and (max-width: 768px) {
  .system_newsDel_content table {}
}

.system_newsDel_content table td {
  border-right: 1px solid #333;
  padding: 0 0.125rem;
  font-size: 0.2rem;
  height: 0.5625rem;
  border-bottom: 1px solid #333;
}

@media screen and (max-width: 768px) {
  .system_newsDel_content table td {}
}

.system_newsDel_tableCon .item:hover,
.system_newsDel_tableCon .item.active {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {

  .system_newsDel_tableCon .item:hover,
  .system_newsDel_tableCon .item.active {}
}

.system_newsDel_tableCon .item:hover::after,
.system_newsDel_tableCon .item.active::after {
  background-color: var(--mainColor);
}

@media screen and (max-width: 768px) {

  .system_newsDel_tableCon .item:hover::after,
  .system_newsDel_tableCon .item.active::after {}
}

.system_newsDel_tableCon .item::after {
  position: absolute;
  top: 50%;
  left: -0.05rem;
  transform: translateY(-50%);
  display: flex;
  content: "";
  width: 0.1rem;
  transition: all 0.3s;
  height: 0.1rem;
  border-radius: 0.625rem;
  background-color: #000;
}

@media screen and (max-width: 768px) {
  .system_newsDel_tableCon .item::after {}
}

.system_newsDel_table.is-fixed {
  position: fixed;
  top: 0;
  max-width: 350px;
}

@media screen and (max-width: 768px) {
  .system_newsDel_table.is-fixed {}
}

.system_aggregation_box {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .system_aggregation_box {}
}

.system_aggregation_con {
  margin-top: 0.4375rem;
}


@media screen and (max-width: 768px) {
  .system_aggregation_con {}
}

.system_aggregation_item {
  width: 100%;
  height: 8.625rem;
  background-color: rgba(245, 245, 245, 1);
}


@media screen and (max-width: 768px) {
  .system_aggregation_item {}
}

.system_aggregation_item .com-card {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 768px) {
  .system_aggregation_item .com-card {}
}

.system_aggregation_item .img {
  width: 50%;
  height: auto;
  margin-right: 1.25rem;
}


@media screen and (max-width: 768px) {
  .system_aggregation_item .img {}
}

.system_aggregation_item .img img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

@media screen and (max-width: 768px) {
  .system_aggregation_item .img img {}
}

.system_aggregation_con .system_aggregation_item:nth-child(2n) {
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .system_aggregation_con .system_aggregation_item:nth-child(2n) {}
}

.system_aggregation_con .system_aggregation_item:nth-child(2n) .com-card {
  flex-direction: row-reverse;
}

@media screen and (max-width: 768px) {
  .system_aggregation_con .system_aggregation_item:nth-child(2n) .com-card {}
}

.system_aggregation_con .system_aggregation_item:nth-child(2n) .img {
  margin-left: 1.25rem;
  margin-right: 0;
}


@media screen and (max-width: 768px) {
  .system_aggregation_con .system_aggregation_item:nth-child(2n) .img {}
}

.system_aggregation_item .text {
  display: block;
  flex: 1;
}

@media screen and (max-width: 768px) {
  .system_aggregation_item .text {}
}

.system_aggregation_item .text .name {
  font-size: 0.45rem;
  color: #000;
  margin-bottom: 0.25rem;
  font-weight: 700;
}


@media screen and (max-width: 768px) {
  .system_aggregation_item .text .name {}
}

.system_aggregation_item .text .ls,
.system_aggregation_item .text .ls p {
  font-size: 0.2rem;
  color: #484848;
  line-height: 0.3125rem;
  margin-bottom: 0.1875rem;
}


@media screen and (max-width: 768px) {

  .system_aggregation_item .text .ls,
  .system_aggregation_item .text .ls p {}
}

.system_aggregation_item .mores {
  width: 2rem;
  height: 0.65rem;
  display: block;
  font-size: 0.225rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
  margin-top: 0.375rem;
  background-color: var(--mainColor);
  line-height: 0.65rem;
  border-radius: 0.0625rem;
}

@media screen and (max-width: 768px) {
  .system_aggregation_item .mores {}
}

.system_product_del_box {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .system_product_del_box {}
}

.system_product_del_box .com-card {
  display: flex;
}


@media screen and (max-width: 768px) {
  .system_product_del_box .com-card {}
}

.system_product_del_box .lt {
  width: 8.4875rem;
  height: auto;
  margin-right: 0.5625rem;
}


@media screen and (max-width: 768px) {
  .system_product_del_box .lt {}
}

.systemdetailBox1Swiper2 {
  position: relative;
  width: 100%;
  height: 6.6625rem;
  overflow: hidden;
  border: 1px solid #eee;
}

@media screen and (max-width: 768px) {
  .systemdetailBox1Swiper2 {}
}

.systemdetailBox1Swiper2 .img {
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 768px) {
  .systemdetailBox1Swiper2 .img {}
}

.systemdetailBox1Swiper2 img,
.systemdetailBox1Swiper1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: bottom;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {

  .systemdetailBox1Swiper2 img,
  .systemdetailBox1Swiper1 img {}
}

.systemdetailBox1Swiper1 {
  width: 100%;
  height: 1.225rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .systemdetailBox1Swiper1 {}
}

.systemdetailBox1Swiper1 .img {
  width: 100%;
  cursor: pointer;
  border: 1px solid #eee;
  height: 100%;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .systemdetailBox1Swiper1 .img {}
}

.systemdetailBox1-prev,
.systemdetailBox1-next {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  transform: translateY(-50%);
  z-index: 55;
  cursor: pointer;
  border-radius: 50%;
  font-size: 0.5625rem !important;
  color: #fff;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {

  .systemdetailBox1-prev,
  .systemdetailBox1-next {}
}

.systemdetailBox1-prev {
  left: 0;
}

@media screen and (max-width: 768px) {
  .systemdetailBox1-prev {}
}

.systemdetailBox1-prev:hover,
.systemdetailBox1-next:hover {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {

  .systemdetailBox1-prev:hover,
  .systemdetailBox1-next:hover {}
}

.systemdetailBox1-next {
  right: 0;
  transform: translateY(-50%) rotate(180deg);
}

@media screen and (max-width: 768px) {
  .systemdetailBox1-next {}
}

.systemdetailBox1Swiper1 .swiper-slide-thumb-active .img {
  border: 1px solid var(--mainColor);
}

@media screen and (max-width: 768px) {
  .systemdetailBox1Swiper1 .swiper-slide-thumb-active .img {}
}

.system_product_del_box .rt .ls {
  font-size: 0.225rem;
  line-height: 0.325rem;
  color: #000;
  margin: 0.1875rem 0 0.375rem 0;
}


@media screen and (max-width: 768px) {
  .system_product_del_box .rt .ls {}
}

.system_product_del_box .rt {
  flex: 1;
}


@media screen and (max-width: 768px) {
  .system_product_del_box .rt {}
}

.system_product_del_box .rt .system_com_title {
  text-align: left;
}

@media screen and (max-width: 768px) {
  .system_product_del_box .rt .system_com_title {}
}

.system_product_del_box .rt .table .tl {
  font-size: 0.2rem;
  color: #000;
  font-weight: 700;
  margin: 0.125rem 0;
}


@media screen and (max-width: 768px) {
  .system_product_del_box .rt .table .tl {}
}

.system_product_del_box .rt .table,
.system_product_del_box .rt table,
.system_product_del_box .rt table .con {
  width: 100%;
  height: auto;
  overflow: hidden;
}

@media screen and (max-width: 768px) {

  .system_product_del_box .rt .table,
  .system_product_del_box .rt table,
  .system_product_del_box .rt table .con {}
}

.system_product_del_box .rt .table td {
  font-size: 0.2rem;
  height: 0.625rem;
  border-bottom: 1px solid #eee;
  color: #000;
}


@media screen and (max-width: 768px) {
  .system_product_del_box .rt .table td {}
}

.system_product_del_box .rt .quotes {
  width: 2.6875rem;
  height: 0.5625rem;
  color: #fff;
  font-size: 0.225rem;
  cursor: pointer;
  text-align: center;
  margin-top: 0.4375rem;
  line-height: 0.5625rem;
  border-radius: 0.0625rem;
  background-color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_product_del_box .rt .quotes {}
}

.system_product_del_box2 {
  width: 100%;
  height: auto;
  padding-top: 0.25rem;
}

@media screen and (max-width: 768px) {
  .system_product_del_box2 {}
}

.system_product_del_box2 .com-card {
  display: flex;
  align-items: center;
  border-bottom: 0.0125rem solid #333;
}

@media screen and (max-width: 768px) {
  .system_product_del_box2 .com-card {}
}

.system_product_del_box2 a {
  position: relative;
  font-size: 0.225rem;
  color: #000;
  font-weight: 600;
  padding-bottom: 0.25rem;
  display: block;
  margin-right: 0.4375rem;
}


@media screen and (max-width: 768px) {
  .system_product_del_box2 a {}
}

.system_product_del_box2 a::after {
  display: block;
  content: "";
  width: 0;
  height: 0.025rem;
  position: absolute;
  left: 0;
  border-radius: 0.025rem;
  bottom: -0.0125rem;
  transition: all 0.3s;
  background-color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .system_product_del_box2 a::after {}
}

.system_product_del_box2 a:hover,
.system_product_del_box2 a.active {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {

  .system_product_del_box2 a:hover,
  .system_product_del_box2 a.active {}
}

.system_product_del_box2 a:hover::after,
.system_product_del_box2 a.active::after {
  width: 100%;
}

@media screen and (max-width: 768px) {

  .system_product_del_box2 a:hover::after,
  .system_product_del_box2 a.active::after {}
}

.system_product_del_box3 {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .system_product_del_box3 {}
}

.system_product_del_box3 .system_com_title {
  font-size: 0.375rem;
  text-align: left;
  color: #000;
  font-weight: 700;
}


@media screen and (max-width: 768px) {
  .system_product_del_box3 .system_com_title {}
}

.system_product_del_box3 .item {
  padding: 0.75rem 0;
  border-bottom: 1px solid #eee;
}


@media screen and (max-width: 768px) {
  .system_product_del_box3 .item {}
}

.system_product_del_box3Item1 .con {
  margin-top: 0.4375rem;
}


@media screen and (max-width: 768px) {
  .system_product_del_box3Item1 .con {}
}

.system_product_del_box3Item1 .con,
.system_product_del_box3Item1 .con p,
.system_product_del_box3Item2 .con,
.system_product_del_box3Item2 .con p,
.system_product_del_box3Item3 .con,
.system_product_del_box3Item3 .con p,
.system_product_del_box3Item4 .con,
.system_product_del_box3Item4 .con p,
.system_product_del_box3Item5 .con,
.system_product_del_box3Item5 .con p {
  font-size: 0.2rem;
  line-height: 0.375rem;
  color: #000;
}


@media screen and (max-width: 768px) {

  .system_product_del_box3Item1 .con,
  .system_product_del_box3Item1 .con p,
  .system_product_del_box3Item2 .con,
  .system_product_del_box3Item2 .con p,
  .system_product_del_box3Item3 .con,
  .system_product_del_box3Item3 .con p,
  .system_product_del_box3Item4 .con,
  .system_product_del_box3Item4 .con p,
  .system_product_del_box3Item5 .con,
  .system_product_del_box3Item5 .con p {}
}

.system_product_del_box2.fixed {
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  background-color: #fff;
  z-index: 333;
}

@media screen and (max-width: 768px) {
  .system_product_del_box2.fixed {}
}

.system_nav_box {
  width: 100%;
  height: auto;
  padding: 0.22rem 0;
  border-bottom: 1px solid #eceff5;
}

@media screen and (max-width: 768px) {
  .system_nav_box {
    padding: 14px 0;
  }
}

.system_nav_box .com-card {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.04rem;
}


@media screen and (max-width: 768px) {
  .system_nav_box .com-card {
    gap: 3px;
  }
}

.system_nav_box a,
.system_nav_box span {
  font-size: 0.2rem;
  color: #495268;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {

  .system_nav_box a,
  .system_nav_box span {
    font-size: 13px;
  }
}

.system_nav_box a::before {
  font-size: 0.15rem;
  transition: all 0.3s;
  margin: 0 0.0375rem;
}

@media screen and (max-width: 768px) {
  .system_nav_box a::before {}
}

.system_nav_box a.active,
.system_nav_box a:hover,
.system_nav_box span.active,
.system_nav_box span:hover {
  color: #00adef;
  font-weight: 700;
}

@media screen and (max-width: 768px) {

  .system_nav_box a.active,
  .system_nav_box a:hover,
  .system_nav_box span.active,
  .system_nav_box span:hover {}
}

.rank-math-breadcrumb p span {
  font-family: "Roboto";
  display: inline-block;
  margin: 0 2px;
}

@media screen and (max-width: 768px) {
  .rank-math-breadcrumb p span {}
}

.rank-math-breadcrumb p span.last {
  color:#fff;
}

@media screen and (max-width: 768px) {
  .rank-math-breadcrumb p span.last {}
}

.rank-math-breadcrumb p {
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .rank-math-breadcrumb p {}
}

.system_category_navigation {
  width: 100%;
  height: auto;
}


@media screen and (max-width: 768px) {
  .system_category_navigation {
  }
}

.singleNewsTabs{
  padding: 1.25rem 0;
}
@media screen and (max-width: 768px) {
  .singleNewsTabs{
    padding: 50px 0;
  }
}


.singleNewsTabs .about-tabs-row{
  display: flex;
  justify-content: center;
}

.singleNewsTabs .about-tabs-row a{
  font-size: .2rem;
  color: #fff;
  background-color: #00adef;
  transition: all 0.3s;
  display: inline-block;
  padding: .0625rem .3125rem;
  margin-bottom: .25rem;
}

@media screen and (max-width: 768px){
  .singleNewsTabs .about-tabs-row a{
    font-size: 14px;
    padding: 5px 20px;
    margin-bottom: 20px;
  }
}

/* .singleNewsTabs .system_com_title{
  border-top: .0125rem solid rgba(51,51,51,1);
  border-bottom:.0125rem solid rgba(51,51,51,1);
  padding: .375rem 0;
  margin-bottom: .375rem;
}

@media screen and (max-width: 768px){
  .singleNewsTabs .system_com_title{
    padding: 20px 0;
    border-width: 1px;
    margin-bottom: 30px;
  }
} */

.singleNewsTabs .system_com_title h2{
  font-size:.375rem;
  color: #000;
  text-align: center;
  font-family: Roboto-Bold;
  line-height: 1.4;
}
@media screen and (max-width: 768px){
  .singleNewsTabs .system_com_title h2{
    font-size: 20px;
  }
}

.singleNewsTabs .system_com_title .date{
  font-size: .2rem;
  margin-top: .125rem;
}
@media screen and (max-width: 768px){
  .singleNewsTabs .system_com_title .date{
    font-size: 14px;
    margin-top: 10px;
  }
}

.singleNewsTabs .system_com_title h3{
  margin-top: .25rem;
  font-weight: 400;
  font-size: .2rem;
  font-family: Roboto;
  text-align: center;
  border-top: .0125rem solid #ddd;
  border-bottom: .0125rem solid #ddd;
  padding: .3125rem 0;
  margin-bottom: .375rem;
}

@media screen and (max-width: 768px){
  .singleNewsTabs .system_com_title h3{
    font-size: 14px;
    margin-top: 20px;
    border-width: 1px;
    padding: 15px 0;
    margin-bottom: 25px;
  }
}

.singleNewsTabs .system_newsDel_content p{
  font-size: .2rem;
  line-height: 2;
}

@media screen and (max-width: 768px){
  .singleNewsTabs .system_newsDel_content p{
    font-size: 14px;
  }
}

.iderNewsTabs {
  padding: 1.25rem 0;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs {
    padding: 50px 0;
  }
}

.iderNewsTabs .system_category_navigation {
  height: auto;
  background: transparent;
}

@media screen and (max-width: 768px) {
  .iderNewsTabs .system_category_navigation {}
}

.iderNewsTabs .about-tabs-row {
  gap: 0.2rem;
  margin-bottom: .75rem;
  justify-content: center;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .about-tabs-row {
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 40px;
  }
}

.iderNewsTabs .about-tab-item {
  height:.75rem;
  line-height: 0.75rem;
  width: 4.25rem;
  text-align: center;
  font-size: .25rem;
  color: #333;
  background-color: #f3f3f3;
  transition: all 0.3s;
  display: inline-block;
  position: relative;
  z-index: 1;
  margin-right: 0;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .about-tab-item {
    width: 48%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
  }
}

.iderNewsTabs .about-tab-item::before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  background: #00adef;
  transition: all .3s;
  z-index: -1;
}
@media screen and (max-width: 768px){
  .iderNewsTabs .about-tab-item::before{
  }
}


.iderNewsTabs .about-tab-item.active {
  color: #fff;
  background: #00adef;
}
.iderNewsTabs .about-tab-item:hover{
  color: #fff;
}
.iderNewsTabs .about-tab-item:hover::before{
  width: 100%;
  color: #fff;
}

@media screen and (max-width: 768px) {

  .iderNewsTabs .about-tab-item.active,
  .iderNewsTabs .about-tab-item:hover {}
}

.iderNewsTabs .system_news_box {
  padding: 0;
}

@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_box {}
}

.iderNewsTabs .news-grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  flex-wrap: wrap;
  gap: 0.28rem 0.24rem;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .news-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.iderNewsTabs .system_news_item {
  display: block;
  margin: 0;
  background: #f8f8f8;
  border-radius: 0.08rem;
  overflow: hidden;
  box-shadow: none;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item {
    border-radius: 5px;
  }
}

.iderNewsTabs .system_news_item .img {
  width: 100%;
  height: 2.875rem;
  border-radius: 0;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item .img {
    height: 250px;
  }
}

.iderNewsTabs .system_news_item .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item .img img {}
}

.iderNewsTabs .system_news_item:hover .img img {
  transform: scale(1.08);
}

@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item:hover .img img {}
}

.iderNewsTabs .system_news_item .text {
  display: block;
  width: 100%;
  height: auto;
  padding: .3125rem;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item .text {
    padding: 20px;
  }
}

.iderNewsTabs .system_news_item .name {
  margin: 0;
  font-size: .225rem;
  line-height: .375rem;
  height: .75rem;
  color: rgba(17,17,17,1);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: all 0.3s;
  font-family: Roboto;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item .name {
    font-size: 16px;
    line-height: 30px;
    height: 60px;
  }
}

.iderNewsTabs .system_news_item:hover .name {
  color: #2f49a7;
}

@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item:hover .name {}
}

.iderNewsTabs .system_news_item .meta {
  margin-top:.3125rem;
  padding-top: .3125rem;
  border-top: 1px solid rgba(220,220,220,1);
  justify-content: space-between;
  align-items: center;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item .meta {
    margin-top: 25px;
    padding-top: 25px;
    font-family: Roboto;
  }
}

.iderNewsTabs .system_news_item .view-more {
  font-size: .175rem;
  line-height: 1.2;
  color: rgba(153,153,153,1);
  font-family: Roboto;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item .view-more {
    font-size: 14px;
  }
}

.iderNewsTabs .system_news_item .time {
  font-size: .175rem;
  line-height: 1.2;
  color: #b7b7b7;
}


@media screen and (max-width: 768px) {
  .iderNewsTabs .system_news_item .time {
    font-size: 14px;
  }
}

 .news-pagination {
  margin-top: 0.24rem;
}


@media screen and (max-width: 768px) {
   .news-pagination {}
}

 .news-pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
}

@media screen and (max-width: 768px) {
   .news-pagination .page-numbers {}
}

 .news-pagination .page-numbers span {
  display: inline-flex;
}

@media screen and (max-width: 768px) {
   .news-pagination .page-numbers span {}
}

 .news-pagination .page-numbers a,
 .news-pagination .page-numbers .current {
  min-width: 0.34rem;
  height: 0.34rem;
  padding: 0 0.08rem;
  border: 1px solid #ececec;
  background: #fff;
  color: #666;
  font-size: 0.18rem;
  line-height: 0.32rem;
  text-align: center;
}


@media screen and (max-width: 768px) {

   .news-pagination .page-numbers a,
   .news-pagination .page-numbers .current {}
}

.news-pagination .page-numbers .current {
  border-color: #2f49a7;
  background: #2f49a7;
  color: #fff;
}

@media screen and (max-width: 768px) {
   .news-pagination .page-numbers .current {}
}


.pagination {
  width: 100%;
  height: auto;
  margin-top: 3%;
}

@media screen and (max-width: 768px) {
  .pagination {}
}

.pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 768px) {
  .pagination .page-numbers {}
}

.pagination .page-numbers li span,
.pagination .page-numbers li a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 768px) {

  .pagination .page-numbers li span,
  .pagination .page-numbers li a {}
}

.pagination .page-numbers li {
  width: 35px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  height: 35px;
  transition: all 0.3s;
  margin-right: 8px;
  border: 1px solid var(--mainColor);
}

@media screen and (max-width: 768px) {
  .pagination .page-numbers li {}
}

.pagination .page-numbers li:last-child {
  margin-right: 0;
}

@media screen and (max-width: 768px) {
  .pagination .page-numbers li:last-child {}
}

.pagination .page-numbers li:hover {
  background-color: var(--mainColor);
  color: #fff;
}

@media screen and (max-width: 768px) {
  .pagination .page-numbers li:hover {}
}

.pagination .page-numbers .current {
  color: #fff;
  background-color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .pagination .page-numbers .current {}
}

button {
  cursor: pointer;
}

@media screen and (max-width: 420px) {
  .pagination .page-numbers li {
    margin-bottom: 4px;
  }

  .pagination .page-numbers {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}

.tranImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: bottom;
  transition: all 0.55s;
}

@media screen and (max-width: 768px) {
  .tranImg {}
}

.hoverImg:hover img {
  transform: scale(1.1);
}

@media screen and (max-width: 768px) {
  .hoverImg:hover img {}
}

.min-tl {
  font-family: Roboto-SemiBold;
  font-size: 0.3rem;
  color: var(--bg-c);
  text-align: center;
}


@media screen and (max-width: 768px) {
  .min-tl {}
}

.com-tl {
  font-family: Roboto;
  font-size: 0.6rem;
  text-align: center;
  font-weight: normal;
  color: var(--mainColor);
}


@media screen and (max-width: 768px) {
  .com-tl {}
}

.com-tl.left,
.min-tl.left {
  text-align: left;
}

@media screen and (max-width: 768px) {

  .com-tl.left,
  .min-tl.left {}
}

.com-tl.margin {
  margin: 0.375rem 0 0.125rem 0;
}


@media screen and (max-width: 768px) {
  .com-tl.margin {}
}

.com-ls30,
.com-ls30 p,
.com-ls30 div {
  font-size: 0.2rem;
  line-height: 0.375rem;
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {

  .com-ls30,
  .com-ls30 p,
  .com-ls30 div {}
}

.com-ls30.white p,
.com-ls30.white,
.com-ls30.white div {
  color: #fff;
}

@media screen and (max-width: 768px) {

  .com-ls30.white p,
  .com-ls30.white,
  .com-ls30.white div {}
}

.com-ls30.black,
.com-ls30.black p,
.com-ls30.black div {
  color: #000;
}

@media screen and (max-width: 768px) {

  .com-ls30.black,
  .com-ls30.black p,
  .com-ls30.black div {}
}

.com-ls24,
.com-ls24 p,
.com-ls24 div {
  font-size: 0.2rem;
  line-height: 0.3rem;
  color: rgba(13, 30, 54, 0.8);
}

@media screen and (max-width: 768px) {

  .com-ls24,
  .com-ls24 p,
  .com-ls24 div {}
}

.com-mores {
  cursor: pointer;
  display: flex;
  width: 2.95rem;
  height: 0.75rem;
  align-items: center;
  justify-content: center;
  text-align: center;
  transition: all 0.3s;
  background-color: var(--bg-c);
  border-radius: 0.0625rem;
  font-size: 0.2rem;
  font-family: Roboto-Medium;
  color: #ffffff;
}


@media screen and (max-width: 768px) {
  .com-mores {
    width: auto;
    height: auto;
    font-size: 16px;
  }
}

.header {
  width: 100%;
  height: 1.5rem;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99;
  background-color: rgba(255, 255, 255, 0);
  transition: all .3s;
  border-bottom: .0125rem solid rgba(255, 255, 255, 0.2);
}


@media screen and (max-width: 768px) {
  .header {}
}

.header .com-card {
  width: 94%;
}

@media screen and (max-width: 768px) {
  .header .com-card {}
}

.header .rt {
  width: fit-content;
  height: 1.5rem;
}

@media screen and (max-width: 768px) {
  .header .rt {}
}

.header.active,
.header.inner {
  height: 1rem;
  background-color: rgba(255, 255, 255, 1);
  box-shadow: 0 0.05rem 0.25rem rgba(0, 0, 0, 0.12);
}

@media screen and (max-width: 768px) {

  .header.active,
  .header.inner {}
}

.header.active .rt,
.header.inner .rt {
  height: 1rem;
}

@media screen and (max-width: 768px) {

  .header.active .rt,
  .header.inner .rt {}
}

.header .logo {
  display: flex;
  width: 2rem;
  height: auto;
  position: relative;
  transition: width 0.3s;
}

@media screen and (max-width: 768px) {
  .header .logo {}
}

.header.active .logo,
.header.inner .logo {
  /* width: 1.025rem; */
}

@media screen and (max-width: 768px) {

  .header.active .logo,
  .header.inner .logo {}
}

.header .logo .logo-default {
  display: block;
}

@media screen and (max-width: 768px) {
  .header .logo .logo-default {}
}

.header .logo .logo-active {
  display: none;
}

@media screen and (max-width: 768px) {
  .header .logo .logo-active {}
}

.header.active .logo .logo-default,
.header.inner .logo .logo-default {
  display: none;
}

@media screen and (max-width: 768px) {

  .header.active .logo .logo-default,
  .header.inner .logo .logo-default {}
}

.header.active .logo .logo-active,
.header.inner .logo .logo-active {
  display: block;
}

@media screen and (max-width: 768px) {

  .header.active .logo .logo-active,
  .header.inner .logo .logo-active {}
}

.header .logo img {
  width: 100%;
  object-fit: cover;
  height: auto;
  vertical-align: bottom;
}

@media screen and (max-width: 768px) {
  .header .logo img {}
}

.header .rt .menu-level1 {
  height: 100%;
  width: fit-content;
}

@media screen and (max-width: 768px) {
  .header .rt .menu-level1 {}
}

.menu-level1>li,
.menu-level1 {
  height: 100%;
}

@media screen and (max-width: 768px) {

  .menu-level1>li,
  .menu-level1 {}
}

.menu-level1>li>a {
  font-size: .2125rem;
  color: #ffffff;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .menu-level1>li>a {}
}

.header.active .menu-level1>li>a,
.header.inner .menu-level1>li>a {
  color: #000;
}

@media screen and (max-width: 768px) {

  .header.active .menu-level1>li>a,
  .header.inner .menu-level1>li>a {}
}

.menu-level1>li {
  position: relative;
  display: flex;
  align-items: center;
  margin-right: .5rem;
  height: 100%;
}

@media screen and (max-width: 768px) {
  .menu-level1>li {}
}

.menu-level1>li::after {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  content: "";
  width: 0;
  transition: all 0.3s;
  height: .0625rem;
  background-color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .menu-level1>li::after {}
}

.menu-level1>li:hover>a {
  color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .menu-level1>li:hover>a {}
}

.menu-level1>li:hover::after {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .menu-level1>li:hover::after {}
}

.header .rt .request {
  height: 100%;
  width: fit-content;
  padding: 0 0.225rem;
  font-size: 0.2rem;
  color: #ffffff;
  background-color: var(--bg-c);
  border-radius: 0.0625rem;
  margin: 0 0.125rem 0 0.15rem;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .header .rt .request {}
}

.header .rt .request::before {
  display: block;
  content: "";
  width: 0.1125rem;
  margin-right: 0.0875rem;
  height: 0.1125rem;
  background-color: #ffffff;
  border-radius: 50%;
}

@media screen and (max-width: 768px) {
  .header .rt .request::before {}
}

.header .rt .search {
  /* width: 1rem; */
  cursor: pointer;
  height: 100%;
  font-size: .3rem;
  color: #fff;
  margin-right: .5rem;
}

@media screen and (max-width: 768px) {
  .header .rt .search {}
}

.header.active .search,
.header.inner .search {
  color: #000;
}

@media screen and (max-width: 768px) {

  .header.active .search,
  .header.inner .search {}
}

.languageSwitching {
  cursor: pointer;
  width: fit-content;
  position: relative;
  height: 100%;
  top: -5%;
}

@media screen and (max-width: 768px) {
  .languageSwitching {}
}

.headerSwiper {
  width: 100%;
  height: auto;
  overflow: hidden;
  position: relative;
  z-index: 5;
}

@media screen and (max-width: 768px) {
  .headerSwiper {
    margin-top: 60px;
  }
}

.headerSwiper .bg {
  width: 100%;
  height: 100vh;
  object-fit: cover;
  vertical-align: bottom;
}


@media screen and (max-width: 768px) {
  .headerSwiper .bg {
    height: auto;
    /* padding: 50px 0; */
    min-height: auto;
  }
}

.headerSwiper .swiper-slide {
  position: relative;
}

@media screen and (max-width: 768px) {
  .headerSwiper .swiper-slide {}
}

.headerSwiper .text {
  width: 100%;
  height: auto;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}


@media screen and (max-width: 768px) {
  .headerSwiper .text {}
}

.headerSwiper .text .com-card {
  width: 95%;
}

@media screen and (max-width: 768px) {
  .headerSwiper .text .com-card {
    width: 100%;
    padding: 0 40px;
  }
}

.headerSwiper .text .title {
  font-family: Roboto-Bold;
  font-size:.6rem;
  line-height: 1.5;
  color: #ffffff;
  font-weight: 600;
  text-align: center;
  text-transform: uppercase;
}


@media screen and (max-width: 768px) {
  .headerSwiper .text .title {
    font-size:20px;
  }
}

.headerSwiper .text .con {
  width: 100%;
  justify-content: center;
  height: auto;
}

@media screen and (max-width: 768px) {
  .headerSwiper .text .con {}
}

.headerSwiper .text .bto {
  margin-top: 0.45rem;
}

@media screen and (max-width: 768px) {
  .headerSwiper .text .bto {}
}

.headerSwiper .text .com-mores {
  min-width: 3.125rem;
  height: .8125rem;
  line-height: .8125rem;
  border: 0.0125rem solid rgba(255, 255, 255, 0.55);
  background-color: rgba(255, 255, 255, 0.06);
  border-radius: .075rem;
  padding: 0 .375rem;
  font-size: .25rem;
  color: #ffffff;
  font-weight: 600;
  transition: all 0.3s;
  font-family: Roboto-Bold;
}

@media screen and (max-width: 768px) {
  .headerSwiper .text .com-mores {
    display: none;
    font-size: 16px;
    min-width: auto;
    height: auto;
    line-height: 1;
    padding: 10px 20px;
  }
}

.headerSwiper .text .com-mores:hover {
  background-color: var(--bg-c);
  border-color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .headerSwiper .text .com-mores:hover {}
}

.header-pagination {
  position: absolute;
  left: 50%;
  bottom: .5rem !important;
  z-index: 22;
  width: 100%;
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 768px) {
  .header-pagination {
    bottom: 20px !important;
  }
}

.header-pagination .swiper-pagination-bullet {
  width: .125rem;
  height: .125rem;
  opacity: 1;
  background-color: rgba(255, 255, 255, 1);
  border-radius: .25rem;
  transition: all 0.3s;
  display: inline-block;
}

@media screen and (max-width: 768px) {
  .header-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
  }
}

.header-pagination .swiper-pagination-bullet-active {
  width: .375rem;
  background-color: #ffffff;
}

@media screen and (max-width: 768px) {
  .header-pagination .swiper-pagination-bullet-active {
    width: 16px;
  }
}

.iderIndexBox1 {
  width: 100%;
  height: auto;
  padding: 1.875rem 0 1.875rem;
  position: relative;
  z-index: 1;
}


@media screen and (max-width: 768px) {
  .iderIndexBox1 {
    padding: 40px 0;
  }
}

/* .iderIndexBox1::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 8.4875rem;
  height: 4.7125rem;
  background:url(../images/img1.png) no-repeat;
  background-size: 100% 100%;
  z-index: -1;
  transform: rotate(180deg);
}
@media screen and (max-width: 768px){
  .iderIndexBox1::before{
    display: none;
  }
}

.iderIndexBox1::after{
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 8.4875rem;
  height: 4.7125rem;
  background:url(../images/img1.png) no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}

@media screen and (max-width: 768px){
  .iderIndexBox1::after{
    display: none;
  }
}
 */


.iderIndexBox1Con {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  gap: .875rem;
  flex-direction: row-reverse;
}


@media screen and (max-width: 768px) {
  .iderIndexBox1Con {
    flex-direction: column;
    gap: 40px;
  }
}

.iderIndexBox1Con .img {
  position: relative;
  width: 40%;
}


@media screen and (max-width: 768px) {
  .iderIndexBox1Con .img {
    width: 100%;
  }
}

.iderIndexBox1Con .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.4s;
}

@media screen and (max-width: 768px) {
  .iderIndexBox1Con .img img {}
}

.iderIndexBox1Con .img .bg-image {
  position: absolute;
  top: -0.25rem;
  right: 0;
  width: 65%;
  height: 5.5rem;
  object-fit: cover;
}


@media screen and (max-width: 768px) {
  .iderIndexBox1Con .img .bg-image {
    display: none;
  }
}

.iderIndexBox1Con .img .main-image {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 7.5rem;
  margin-top: 0.55rem;
  border-radius: 0.1rem;
  object-fit: cover;
}


@media screen and (max-width: 768px) {
  .iderIndexBox1Con .img .main-image {
    width: 100%;
    height: 350px;
    margin-top: 0;
    border-radius: 5px;
  }
}

.iderIndexBox1Con .text {
  flex: 1;
  position: relative;
}


@media screen and (max-width: 768px) {
  .iderIndexBox1Con .text {
    flex: none;
  }
}

/* .iderIndexBox1Con .text::before{
  content: "";
  position: absolute;
  top: 0;
  right: -3.75rem;
  width: 6.25rem;
  height: 3.375rem;
  background:url(../images/img2.png) no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}
@media screen and (max-width: 768px){
  .iderIndexBox1Con .text::before{
    display: none;
  }
} */

.iderIndexBox1Con .text .com-tl {
  margin: 0 0 0.3rem;
  line-height: 1.2;
  font-size: .75rem;
  font-family: Roboto-SemBold;
  color: #000;
  font-weight: 600;
}

@media screen and (max-width: 768px) {
  .iderIndexBox1Con .text .com-tl {
    font-size: 24px;
    margin-bottom: 20px;
  }
}

.iderIndexBox1Con .text .com-ls30 {
  color: #000;
  margin-bottom: 0.45rem;
  font-size: .2rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox1Con .text .com-ls30 {
    font-size: 16px;
    margin-bottom: 40px;
  }
}

.iderIndexBox1Con .text .com-ls30 p {
  margin-bottom: 0.16rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox1Con .text .com-ls30 p {
    font-size: 16px;
    line-height: 1.6;
  }
}

.iderIndexBox1Con .text .com-ls30 p:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .iderIndexBox1Con .text .com-ls30 p:last-child {}
}

.iderIndexBox1Con .text .com-mores{
  position: relative;
  font-family: Roboto;
  font-size: 16px;
  color: #000;
  border: 1px solid #000;
  background: #fff;
  padding: .1875rem .375rem;
  overflow: hidden;
  z-index: -2;
}

@media screen and (max-width: 768px) {
  .iderIndexBox1Con .text .com-mores {
    padding: 12px;
  }
}

.iderIndexBox1Con .text .com-mores:hover{
  background: #00adef;
  color: #fff;
  border-color: #00adef;
}

.iderIndexBox1Con .text .com-mores::before {
    content: "";
    position: absolute;
    display: block;
    transition: all .3s;
    width: 100%;
    height: 0;
    border-radius: 50%;
    left: 50%;
    top: 50%;
    padding-top: 100%;
    transform: translateX(-50%) translateY(-50%) scale(.5);
    background-color: #00adef;
    opacity: 0;
    z-index: -1;
}
.iderIndexBox1Con .text .com-mores:hover::before {
  transform:translateX(-50%) translateY(-50%) scale(1);
  width: 100%;
  opacity: 1;
}

@media screen and (max-width: 768px) {
  .com-mores2::before {}
}

.com-mores2::after {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s;
  content: ">";
  width: 0.4375rem;
  height: 0.4375rem;
  border-radius: 50%;
  font-family: Roboto-Light;
  font-size: 0.3rem;
  color: var(--mainColor);
  background-color: #ffffff;
  border: solid 0.0125rem var(--mainColor);
}

@media screen and (max-width: 768px) {
  .com-mores2::after {}
}

.iderIndexBox2 {
  width: 100%;
  padding: 1.125rem 0;
  background: rgba(242,245,250,1);
  position: relative;
  z-index: 1;
}


@media screen and (max-width: 768px) {
  .iderIndexBox2 {
    padding: 50px 0;
  }
}

.iderIndexBox2::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #00abef56;
  z-index: -1;
}

.iderIndexBox2Stats {
  width: 100%;
  gap: 0.2rem;
  display: flex;
  justify-content: space-between;
}


@media screen and (max-width: 768px) {
  .iderIndexBox2Stats {
    gap: 20px;
    flex-wrap: wrap;
  }
}

.iderIndexBox2Stats li {
  justify-content: center;
  text-align: center;
  background-color: transparent;
}


@media screen and (max-width: 768px) {
  .iderIndexBox2Stats li {
    width: 45%;
  }
}

.iderIndexBox2Stats li .nu {
  position: relative;
  align-items: flex-start;
  justify-content: center;
  padding-bottom: 0.25rem;
  margin-bottom: 0.2rem;
}

@media screen and (max-width: 768px) {
  .iderIndexBox2Stats li .nu {
  }
}

.iderIndexBox2Stats li .nu em{
  font-size: .2rem;
  font-family: Roboto;
  /* transform: scale(.7); */
}
@media screen and (max-width: 768px){
  .iderIndexBox2Stats li .nu em{
    font-size: 12px;
  }
}
.iderIndexBox2Stats li:nth-child(3) .nu em{
  font-style: italic;
}


.iderIndexBox2Stats li .nu::after {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  display: block;
  content: "";
  width: 0.3rem;
  height: .0125rem;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .iderIndexBox2Stats li .nu::after {
    width: 25px;
  }
}

.iderIndexBox2Stats li .counter {
  font-family: Roboto-Bold;
  font-size: .9rem;
  color: #fff;
  line-height: 1;
}


@media screen and (max-width: 768px) {
  .iderIndexBox2Stats li .counter {
    font-size: 30px;
  }
}

.iderIndexBox2Stats li em {
  font-family: Roboto;
  font-size: 0.32rem;
  color: #fff;
  margin-left: 0.06rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox2Stats li em {
    font-size: 12px;
  }
}

.iderIndexBox2Stats li .name {
  font-family: Roboto-Regular;
  font-size: 0.2rem;
  line-height: 0.3rem;
  color: #fff;
}


@media screen and (max-width: 768px) {
  .iderIndexBox2Stats li .name {
    font-size: 14px;
    line-height: 28px;
  }
}

.iderIndexBox3 {
  width: 100%;
  height: auto;
  padding:2.5rem 0;
}


@media screen and (max-width: 768px) {
  .iderIndexBox3 {
    padding: 80px 0;
  }
}

.iderIndexBox3Banner {
  position: relative;
  background-position: center;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderIndexBox3Banner {}
}


.iderIndexBox3 .img {
  display: none;
}

@media screen and (max-width: 768px) {
  .iderIndexBox3 .img {}
}

.iderIndexBox3Text {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  text-align: center;
}


@media screen and (max-width: 768px) {
  .iderIndexBox3Text {}
}

.iderIndexBox3Play {
 }

.iderIndexBox3Play a{
  display: block;
  width: 1.125rem;
  height: 1.125rem;
  margin-bottom: .25rem;
}

@media screen and (max-width: 768px) {
  .iderIndexBox3Play a{
    width: 70px;
    height: 70px;
    margin-bottom: 20px;
  }
}



.iderIndexBox3Link {
  font-family: Roboto-Semibold;
  font-size: .3rem;
  color: #fff;
  line-height: 1.2;
}


@media screen and (max-width: 768px) {
  .iderIndexBox3Link {}
}

.iderIndexBox4 {
  width: 100%;
  height: auto;
  padding: 1.25rem 0;
}


@media screen and (max-width: 768px) {
  .iderIndexBox4 {
    padding: 80px 0;
  }
}

.iderIndexBox4 .com-card{
  width: 20rem;
}
@media screen and (max-width: 768px){
  .iderIndexBox4 .com-card{
    width: 100%;
  }
}

.iderIndexBox4 .min-tl,
.iderIndexBox4 .com-tl {
  text-align: center;
}

@media screen and (max-width: 768px) {

  .iderIndexBox4 .min-tl,
  .iderIndexBox4 .com-tl {}
}

.iderIndexBox4 .min-tl{
  font-size: .2rem;
  color: #00adef;
  font-family: Roboto-Bold;
}

@media screen and (max-width: 768px){
  .iderIndexBox4 .min-tl{
    font-size: 16px;
  }
}

.iderIndexBox4 .com-tl {
  font-size: .6rem;
  color: #000;
  font-family: Roboto-Bold;
}

@media screen and (max-width: 768px) {
  .iderIndexBox4 .com-tl {
    font-size: 30px;
  }
}

.iderIndexBox4Wrap {
  width: 100%;
  margin-top: .5rem;
  position: relative;
}


@media screen and (max-width: 768px) {
  .iderIndexBox4Wrap {
    width: 90%;
    margin: 40px auto 0;
  }
}

.iderIndexBox4Swiper {
  position: relative;
}


@media screen and (max-width: 768px) {
  .iderIndexBox4Swiper {}
}

.iderIndexBox4Swiper .swiper-slide .item {
  width: 100%;
  /* background-color: #fff;
  background: #f5f5f5; */
  overflow: hidden;
  flex-direction: column;
  justify-content: flex-start;
}


@media screen and (max-width: 768px) {
  .iderIndexBox4Swiper .swiper-slide .item {
  }
}

.iderIndexBox4Swiper .swiper-slide .item .img {
  width: 100%;
  height:3.75rem;
  background-color: #fff;
  overflow: hidden;
  border: .0125rem solid #ccc;
  margin-bottom: .25rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox4Swiper .swiper-slide .item .img {
    height: 250px;
    margin-bottom: 15px;
  }
}

.iderIndexBox4Swiper .swiper-slide .item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media screen and (max-width: 768px) {
  .iderIndexBox4Swiper .swiper-slide .item img {}
}

/* .iderIndexBox4Swiper .swiper-slide .item hr{
  margin: .25rem auto;
  width: 7%;
  height: .0625rem;
  background: #00adef;
  transition: all .3s;
}

@media screen and (max-width: 768px){
  .iderIndexBox4Swiper .swiper-slide .item hr{
    height: 3px;
    margin: 20px 0;
  }
}

.iderIndexBox4Swiper .swiper-slide .item:hover hr{
  width: 100%;
} */

.iderIndexBox4Swiper .swiper-slide .item .name {
  width: 100%;
  text-align: center;
  font-family: Roboto-Regular;
  font-size: 0.2rem;
  line-height: .3rem;
  height: .3rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #000;
  margin-bottom: .25rem;
   display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  text-overflow: ellipsis;
}


@media screen and (max-width: 768px) {
  .iderIndexBox4Swiper .swiper-slide .item .name {
    font-size: 16px;
    line-height: 30px;
    height: 30px;
    margin-bottom: 10px;
  }
}

.iderIndexBox4-prev,
.iderIndexBox4-next {
  position: absolute;
  left: -0.625rem;
  width: .5rem;
  height: .5rem;
  border-top: .0375rem solid #00adef;
  border-left: .0375rem solid #00adef;
  cursor: pointer;
  transform: rotate(-45deg);
  transition: all 0.3s;
}
@media screen and (max-width: 768px){
  .iderIndexBox4-prev,
  .iderIndexBox4-next{
    width: 20px;
    height: 20px;
    left: -20px;
  }
}
.iderIndexBox4-next{
  left: auto;
  right:-0.625rem;
  transform: rotate(135deg);
}
@media screen and (max-width: 768px){
  .iderIndexBox4-next{
    right: -20px;
  }
}



@media screen and (max-width: 768px) {

  .iderIndexBox4-prev,
  .iderIndexBox4-next {}
}



.iderIndexBox4-prev:hover,
.iderIndexBox4-next:hover {
  
}

@media screen and (max-width: 768px) {

  .iderIndexBox4-prev:hover,
  .iderIndexBox4-next:hover {}
}

.iderIndexBox5 {
  width: 100%;
  padding: 1.25rem 0;
  background: #f1f1f1;
}


@media screen and (max-width: 768px) {
  .iderIndexBox5 {
    padding: 50px 0;
  }
}

.iderIndexBox5 .com-card {
}


@media screen and (max-width: 768px) {
  .iderIndexBox5 .com-card {}
}

.iderIndexBox5 .com-tl {
  text-align: center;
  font-size: .6rem;
  color: #000;
  font-family: Roboto-Bold;
}

@media screen and (max-width: 768px) {
  .iderIndexBox5 .com-tl {
    font-size: 30px;
  }
}

.iderIndexBox5List {
  width: 100%;
  margin-top: 0.55rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.24rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox5List {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 20px;
    margin-top: 40px;
  }
}

.iderIndexBox5List li {
  border-radius: 0.125rem;
  background-color: #fff;
  min-height: 5rem;
  padding: .5rem .5625rem;
  align-items: flex-start;
  flex-direction: column;
  justify-content: space-between;
}


@media screen and (max-width: 768px) {
  .iderIndexBox5List li {
    border-radius: 5px;
    min-height: auto;
    padding: 25px;
    flex-direction: column;
  }
}

.iderIndexBox5List li .top {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  gap: .25rem;
}

@media screen and (max-width: 768px) {
  .iderIndexBox5List li .top {
    gap: 20px;
  }
}

.iderIndexBox5List li .icon {
  width: .75rem;
  height: .75rem;
}

@media screen and (max-width: 768px) {
  .iderIndexBox5List li .icon {
    width: 40px;
    height: 40px;
  }
}

.iderIndexBox5List li .icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

@media screen and (max-width: 768px) {
  .iderIndexBox5List li .icon img {}
}

.iderIndexBox5List li .name {
  font-family: Roboto-Bold;
  font-size: .25rem;
  color: #00adef;
  line-height: 1.4;
  margin: 0;
}


@media screen and (max-width: 768px) {
  .iderIndexBox5List li .name {
    font-size: 18px;
  }
}

.iderIndexBox5List li .desc {
  width: 100%;
  color: #828599;
  margin: 0.26rem 0 0.34rem;
  font-size: .2rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox5List li .desc {
    font-size: 16px;
    margin: 20px 0;
    line-height: 1.4;
  }
}

.iderIndexBox5List li .com-mores2 {
  position: relative;
  font-family: Roboto-Bold;
  font-size: .2rem;
  color: #00adef;
  background:rgba(231,231,237,1);
  padding: .1875rem .5625rem;
  overflow: hidden;
  z-index: -2;
  border-radius: .0625rem;
  transition: all .3s;
}

.iderIndexBox5List li .com-mores2:hover{
  background: #00adef;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .iderIndexBox5List li .com-mores2 {
    font-size: 16px;
    padding: 8px 20px;
    border-radius: 5px;
  }
}

.iderIndexBox5List li .com-mores2::after {
  display: none;
}

.iderIndexBox5List li .com-mores2::before {
    content: "";
    position: absolute;
    display: block;
    transition: all .3s;
    width: 100%;
    height: 0;
    border-radius: 50%;
    left: 50%;
    top: 50%;
    padding-top: 100%;
    transform: translateX(-50%) translateY(-50%) scale(.5);
    background-color: #00adef;
    opacity: 0;
    z-index: -1;
}


.iderIndexBox5List li .com-mores2:hover::before{
   transform:translateX(-50%) translateY(-50%) scale(1);
    width: 100%;
    opacity: 1;
}


@media screen and (max-width: 768px) {
  .iderIndexBox5List li .com-mores2::before {}
}



.iderIndexBox6 {
  width: 100%;
  height: auto;
  padding: 1.25rem 0;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 {
    padding: 50px 0;
  }
}

.iderIndexBox6 .head {
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 .head {
    flex-direction: column;
    align-items: start;
    gap: 20px;
  }
}
.iderIndexBox6 .head-lt .min-tl{
  text-align: left;
  font-size: .2rem;
  font-family: Roboto-Bold;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 .head-lt .min-tl {
    font-size: 18px;
  }
}

.iderIndexBox6 .head-lt .com-tl {
  font-size: .6rem;
  font-family: Roboto-Bold;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 .head-lt .com-tl {
    font-size: 30px;
  }
}

.iderIndexBox6 .head-rt {
  flex-shrink: 0;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 .head-rt {}
}

.iderIndexBox6 .cate-list {
  gap: 0.34rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 .cate-list {
    gap: 20px;
  }
}

.iderIndexBox6 .cate-item {
  font-family: Roboto;
  font-size: .25rem;
  line-height: 1.3;
  color: #666;
  transition: color 0.3s;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 .cate-item {
    font-size: 16px;
  }
}

.iderIndexBox6 .cate-item:hover {
  color: #00adef;
  font-weight: 700;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 .cate-item:hover {}
}

.iderIndexBox6 ul {
  width: 100%;
  height: auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 0.45rem;
  gap: .3125rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 ul {
    grid-template-columns: 1fr;
    margin-top: 40px;
    gap: 20px;
  }
}

.iderIndexBox6 ul li {
  width: 100%;
  height: auto;
  background-color: #ffffff;
  border: 1px solid rgba(16, 55, 103, 0.1);
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 ul li {}
}

.iderIndexBox6 li .img {
  width: 100%;
  display: block;
  height: 3.0625rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 li .img {
    height: 250px;
  }
}

.iderIndexBox6 li .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 li .img img {}
}

.iderIndexBox6 li .text {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: .375rem;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 li .text {
    padding: 15px;
  }
}

.iderIndexBox6 li .text .time {
  display: block;
  align-items: center;
  justify-content: center;
  max-width: 1.875rem;
  padding:.1125rem 0;
  border-radius: .0625rem;
  background-color: #00abefad;
  font-family: Roboto-Bold;
  font-size:.175rem;
  color: #fff;
  text-align: center;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 li .text .time {
    max-width: 150px;
    padding: 9px 0;
    border-radius: 5px;
    font-size: 16px;
  }
}

.iderIndexBox6 li .text .name {
  display: block;
  font-family: Roboto-Bold;
  font-size:.225rem;
  line-height:.35rem;
  height: .7rem;
  overflow: hidden;
  color: #000;
  margin: .375rem 0;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 li .text .name {
    font-size: 18px;
    line-height: 30px;
    height: 60px;
    margin: 20px 0;
  }
}

.iderIndexBox6 li .text .com-ls24 {
  color: rgba(142,140,163,1);
  font-family: Roboto;
  font-size: .2rem;
  line-height: .35rem;
  height: 1.05rem;
  overflow: hidden;
  margin-bottom: .25rem;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 li .text .com-ls24 {
    font-size: 16px;
    line-height: 30px;
    height: 90px;
    margin-bottom: 20px;
  }
}

.iderIndexBox6 li .com-mores2 {
  position: relative;
  font-family: Roboto-Bold;
  font-size: .2rem;
  color: #00adef;
  background: rgba(231,231,237,1);
  padding: .125rem .375rem;
  overflow: hidden;
  z-index: 1;
  border-radius: .0625rem;
  display: inline-block;
  margin-top: .25rem;
  transition: all .3s;
}


@media screen and (max-width: 768px) {
  .iderIndexBox6 li .com-mores2 {
    font-size: 16px;
    padding: 12px;
    margin-top: 20px;
    border-radius: 5px;
  }
}

.iderIndexBox6 li .com-mores2::after {
  display: none;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 li .com-mores2::after {}
}

.iderIndexBox6 li .com-mores2::before {
    content: "";
    position: absolute;
    display: block;
    transition: all .3s;
    width: 100%;
    height: 0;
    border-radius: 50%;
    left: 50%;
    top: 50%;
    padding-top: 100%;
    transform: translateX(-50%) translateY(-50%) scale(.5);
    background-color: #00adef;
    opacity: 0;
    z-index: -1;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 li .com-mores2::before {}
}

.iderIndexBox6 li:hover .com-mores2::before{
  transform:translateX(-50%) translateY(-50%) scale(1);
  opacity: 1;
}


.iderIndexBox6 li:hover .com-mores2 {
  color: #fff;
  background-color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 li:hover .com-mores2 {}
}

.iderIndexBox6 li:hover .com-mores2::after {
  display: none;
}

@media screen and (max-width: 768px) {
  .iderIndexBox6 li:hover .com-mores2::after {}
}



.iderIndexBox7 {
  width: 100%;
  position: relative;
  height: auto;
  overflow: hidden;
  padding: 1.25rem 0;
}

@media screen and (max-width: 768px) {
  .iderIndexBox7 {
    padding: 50px 0;
  }
}

.iderIndexBox7 .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: bottom;
  z-index: -1;
}


@media screen and (max-width: 768px) {
  .iderIndexBox7 .bg {}
}

.iderIndexBox7 .text {}

@media screen and (max-width: 768px) {
  .iderIndexBox7 .text {}
}

.iderIndexBox7 .text .com-card {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .iderIndexBox7 .text .com-card {}
}

.iderIndexBox7 .text .tl {
  font-family: Roboto-Bold;
  font-size: .5375rem;
  font-weight: 700;
  line-height: 1.1;
  color: #ffffff;
}


@media screen and (max-width: 768px) {
  .iderIndexBox7 .text .tl {
    font-size: 20px;
  }
}

.iderIndexBox7 .text .desc {
  margin-top: 0.14rem;
  font-family: Roboto-Regular;
  font-size: .225rem;
  line-height: 1.35;
  color: #fff;
}


@media screen and (max-width: 768px) {
  .iderIndexBox7 .text .desc {
    font-size: 16px;
    margin-top: 15px;
  }
}

.iderIndexBox7 .form-wrap {
  width: 100%;
  max-width: 7.125rem;
  margin-top: .7rem;
}

.iderIndexBox7 .elementor-357 .elementor-element.elementor-element-08c622d .elementor-field-group .elementor-field:not(.elementor-select-wrapper) {
  border-radius: .075rem 0 0 .075rem !important;
  border: none;
  font-family: Roboto;
}

.iderIndexBox7 .elementor-357 .elementor-element.elementor-element-08c622d .elementor-button {
  border-radius: 0;
  font-family: Roboto-Bold;
  background-color: #00adef !important;
  font-size: .225rem;
}

.iderIndexBox7 .elementor-357 .elementor-element.elementor-element-08c622d .elementor-button:hover {
  background-color: #028ec5 !important;
}

.elementor-2052 .elementor-element.elementor-element-32eee009 .elementor-button[type="submit"]{
  background-color: #00adef !important;
}
.elementor-2052 .elementor-element.elementor-element-32eee009 .elementor-button[type="submit"]:hover{
   background-color: #028ec5 !important;
}

@media screen and (max-width: 768px) {
  .iderIndexBox7 .form-wrap {
    margin-top: 20px;
    max-width: 100%;
  }

  .iderIndexBox7 .form-wrap .elementor-form-fields-wrapper {
    flex-wrap: nowrap;
  }

  .iderIndexBox7 .elementor-357 .elementor-element.elementor-element-08c622d .elementor-field-group .elementor-field:not(.elementor-select-wrapper) {
    border-radius: 5px 0 0 5px !important;
    width: 70%;
  }

  .iderIndexBox7 .elementor-357 .elementor-element.elementor-element-08c622d .elementor-button {
    font-size: 16px;
  }
}

.iderIndexBox7 .form-wrap>* {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .iderIndexBox7 .form-wrap>* {}
}

.footer {
  width: 100%;
  height: auto;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .footer {}
}

.footer .top .lt {
  width: 5.2rem;
  margin-right: 1.2rem;
}


@media screen and (max-width: 768px) {
  .footer .top .lt {
    width: 100%;
    margin-right: 0;
  }
}

.footer .top .rt {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.45rem 0.35rem;
}


@media screen and (max-width: 768px) {
  .footer .top .rt {
    display: none;
  }
}

.footer .top {
  width: 100%;
  height: auto;
  padding: 0.95rem 0 0.7rem;
}


@media screen and (max-width: 768px) {
  .footer .top {}
}

.footer_list {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .footer_list {}
}

.footer_list .name {
  font-family: Roboto-Bold;
  font-size: .225rem;
  line-height: 1.2;
  color: var(--bg-c);
  margin-bottom: .25rem;
}

@media screen and (max-width: 768px) {
  .footer_list .name {
    font-size: 18px;
  }
}

.footer_list a,
.footer_list div {
  display: block;
  font-size: 0.2rem;
  line-height: 1.8;
  color: #8a879f;
}

@media screen and (max-width: 768px) {

  .footer_list a,
  .footer_list div {
    font-size: 14px;
  }
}

.footer_list div {
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .footer_list div {}
}

.footer_list a:hover {
  color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .footer_list a:hover {}
}

.footer .top .lt .con {
  margin-bottom: .625rem;
}


@media screen and (max-width: 768px) {
  .footer .top .lt .con {
    margin-bottom: 40px;
  }
}

.footer .top .lt .footer_list .tips {
  font-family: Roboto-SemiBold;
  font-size: .225rem;
  color: rgba(143, 140, 163, 1);
  margin-bottom: 0.15rem;
}

@media screen and (max-width: 768px) {
  .footer .top .lt .footer_list .tips {
    font-size: 18px;
    margin-bottom: 10px;
  }
}

.footer .top .lt .footer_list .phone {
  font-family: Roboto-Bold;
  font-size: .375rem;
  line-height: 1.3;
  color: #00adef;
}


@media screen and (max-width: 768px) {
  .footer .top .lt .footer_list .phone {
    font-size: 30px;
  }
}

.footer .top .lt .footer_list .emails {
  color: #00adef;
  margin-top: .125rem;
}

@media screen and (max-width: 768px) {
  .footer .top .lt .footer_list .emails {
    margin-top: 20px;
  }
}

.footer .top .lt .footer_list .adds {
  margin-top: .25rem;
  color: #8f8ca3;
  font-size: .225rem;
  line-height: 2;
  margin-top: 20px;
}

@media screen and (max-width: 768px) {
  .footer .top .lt .footer_list .adds {
    font-size: 14px;
  }
}

.footer_list .emails {
  cursor: pointer;
}

@media screen and (max-width: 768px) {
  .footer_list .emails {}
}

.footerLink {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .footerLink {}
}

.footerLink .name {
  font-family: Roboto-SemiBold;
  font-size: .25rem;
  color: #8f8ca3;
  margin-bottom: .25rem;
}

@media screen and (max-width: 768px) {
  .footerLink .name {
    font-size: 20px;
  }
}

.footerLink .con {
  gap: 0.2rem;
}

@media screen and (max-width: 768px) {
  .footerLink .con {}
}

.footerLink a {
  width: .6rem;
  height: .6rem;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .footerLink a {
    width: 40px;
    height: 40px;
  }
}



.footerLink a img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media screen and (max-width: 768px) {
  .footerLink a img {}
}

.footer .bottom {
  width: 100%;
  height: auto;
  padding: .25rem 0;
  border-top: 1px solid rgba(23, 44, 102, 0.1);
  background-color: #fff;

}

.footer .bottom .com-ls30 p {
  color: rgba(140, 137, 161, 1);

}

@media screen and (max-width: 768px) {
  .footer .bottom {
    padding: 20px 0;
  }

  .footer .bottom .flex-btn {
    flex-direction: column;
  }

  .footer .bottom .com-ls30 p {
    font-size: 14px;
    line-height: 1.6;
    text-align: center;
  }
}



.footer .bottom .com-card {
  gap: 0.3rem;
}


@media screen and (max-width: 768px) {
  .footer .bottom .com-card {
    gap: 10px;
  }
}

.iderBanner {
  position: relative;
  width: 100%;
  min-height: 4rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderBanner {
    height: 150px;
    min-height: 150px;
  }
}

/* .iderBanner::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(11, 27, 50, 0.46) 0%, rgba(11, 27, 50, 0.18) 55%, rgba(11, 27, 50, 0.35) 100%);
  z-index: 1;
} */

@media screen and (max-width: 768px) {
  .iderBanner::after {}
}

.iderBanner .bg {
  width: 100%;
  min-height: 4rem;
  height: 4rem;
  object-fit: cover;
  vertical-align: bottom;
}


@media screen and (max-width: 768px) {
  .iderBanner .bg {
    height: 100%;
    min-height: auto;
  }
}

.iderNav {
  width: 100%;
  height: auto;
  gap: .1rem;
  align-items: center;
}

@media screen and (max-width: 768px) {
  .iderNav {
    gap: 5px;
  }
}

.iderNav a,
.iderNav span {
  font-size: 0.2rem;
  color: #fff;
}

@media screen and (max-width: 768px) {

  .iderNav a,
  .iderNav span {
    font-size: 14px;
  }
}

.iderNav .com-card{
  gap:.1rem;
}
@media screen and (max-width: 768px){
  .iderNav .com-card{
    gap: 10px;
  }
}

.iderNav .separator {
  display: block;
  font-size: 0.2rem;
  color: #fff;
  margin: 0 0.05rem;
}

@media screen and (max-width: 768px) {
  .iderNav .separator {
    font-size: 16px;
    margin: 0 8px;
  }
}

.iderNav img{
  width: .2rem;
  height: .2rem;
  object-fit: contain;
  filter: invert(1);
}

@media screen and (max-width: 768px){
  .iderNav img{
    width: 16px;
    height: 16px;
  }
}

.iderNav a:hover,
.iderNav a.active {
  color: var(--bg-c);
}

@media screen and (max-width: 768px) {

  .iderNav a:hover,
  .iderNav a:hover::after,
  .iderNav a.active,
  .iderNav a.active::after {
  }
}

.iderNav a:last-child::after {
  display: none;
}

@media screen and (max-width: 768px) {
  .iderNav a:last-child::after {}
}

.iderCompanyBox1 {
  width: 100%;
  height: auto;
  padding: 1rem 0 0.625rem 0;
  border-bottom: 1px solid #d9d9d9;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox1 {
    padding: 50px 0;
  }
}

.iderCompanyBox1 .top {
  margin: 0;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox1 .top {}
}

.iderCompanyBox1 .top .img {
  position: relative;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox1 .top .img {}
}

.iderCompanyBox1 .top .img::after {
  width: 100%;
  content: "";
  display: block;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  background-color: rgba(0, 0, 0, 0.4);
}

@media screen and (max-width: 768px) {
  .iderCompanyBox1 .top .img::after {}
}

.iderCompanyBox1 .top .icon {
  width: 1rem;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: 1rem;
  z-index: 2;
  object-fit: contain;
  cursor: pointer;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox1 .top .icon {}
}

.iderCompanyBox1 .top .text {
  background: none;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox1 .top .text {}
}

.iderCompanyBox1 .iderIndexBox3Swiper {
  height: 6.375rem;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox1 .iderIndexBox3Swiper {}
}

.iderCompanyBox1 .iderIndexBox3Swiper .swiper-slide {
  height: auto;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox1 .iderIndexBox3Swiper .swiper-slide {}
}

.iderCompanyBox1 .top .com-tl {
  margin: 0 0 0.3125rem 0;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox1 .top .com-tl {
    font-size: 30px;
    margin-bottom: 20px;
  }
}

.iderCompanyProfileTabs {
  padding: 1.25rem 0;
  border-bottom: none;
}

@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs {
    padding: 50px 0;
  }
}

.iderCompanyProfileTabs .about-tabs-row {
  width: 100%;
  gap: 0.2rem;
  margin-bottom: .75rem;
  justify-content: center;
}


@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-tabs-row {
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 40px;
  }
}

.iderCompanyProfileTabs .about-tab-item {
  height:.75rem;
  line-height: 0.75rem;
  width: 4.25rem;
  text-align: center;
  font-size: .25rem;
  color: #333;
  background-color: #f3f3f3;
  transition: all 0.3s;
  display: inline-block;
  position: relative;
  z-index: 1;
}


@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-tab-item {
    width: 48%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
  }
}
.iderCompanyProfileTabs .about-tab-item::before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  background: #46549d;
  transition: all .3s;
  z-index: -1;
}


.iderCompanyProfileTabs .about-tab-item.active,
.iderCompanyProfileTabs .about-tab-item:hover {
  color: #fff;
  background: #46549d;
}

@media screen and (max-width: 768px) {

  .iderCompanyProfileTabs .about-tab-item.active,
  .iderCompanyProfileTabs .about-tab-item:hover {}
}

.iderCompanyProfileTabs .about-tab-item:hover::before{
  width: 100%;
}

.iderCompanyProfileTabs .about-content-row {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-content-row {}
}

.iderCompanyProfileTabs .about-content-row .com-tl {
  margin: 0 0 .4375rem 0;
  text-align: center;
  line-height: 1.1;
  font-weight: 600;
}


@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-content-row .com-tl {
    font-size: 30px;
    margin-bottom: 20px;
  }
}

.iderCompanyProfileTabs .about-rich-content,
.iderCompanyProfileTabs .about-rich-content p,
.iderCompanyProfileTabs .about-rich-content li {
  font-size: 0.2rem;
  line-height: 1.95;
  color: #111;
}


@media screen and (max-width: 768px) {

  .iderCompanyProfileTabs .about-rich-content,
  .iderCompanyProfileTabs .about-rich-content p,
  .iderCompanyProfileTabs .about-rich-content li {
    font-size: 16px;
  }
}

.iderCompanyProfileTabs .about-rich-content ul {
  margin-top: 0.2rem;
}

@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-rich-content ul {
    margin-top: 20px;
  }
}

.iderCompanyProfileTabs .about-rich-content strong {
  color: #111;
}

@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-rich-content strong {}
}

.iderCompanyProfileTabs .about-rich-content a {
  color: #2f49a7;
}

@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-rich-content a {}
}

.iderCompanyProfileTabs .about-image-row {
  width: 100%;
  margin-top: 0.35rem;
}


@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-image-row {}
}

.iderCompanyProfileTabs .about-image-row img {
  width: 100%;
  height: auto;
  display: block;
}

@media screen and (max-width: 768px) {
  .iderCompanyProfileTabs .about-image-row img {}
}



.iderCompanyHonorsTabs .img {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .iderCompanyHonorsTabs .img {}
}

.iderCompanyHonorsTabs .img .com-tl {
  margin: 0;
  text-align: center;
  line-height: 1.1;
  font-size: .6rem;
  margin-bottom: 40px;
  font-weight: 600;
}


@media screen and (max-width: 768px) {
  .iderCompanyHonorsTabs .img .com-tl {
    font-size: 30px;
  }
}



.iderCompanyHonorsTabs .about-honors-box .grids {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .25rem;
}

@media screen and (max-width: 768px) {
  .iderCompanyHonorsTabs .about-honors-box .grids {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.iderCompanyHonorsTabs .about-honors-box .grids .about-honors-item{
  background: rgba(245,245,245,1);
  flex: 1;
}
.iderCompanyHonorsTabs .about-honors-box .grids .about-honors-item .img{
  padding: .125rem;
  overflow: hidden;
}
@media screen and (max-width: 768px){
  .iderCompanyHonorsTabs .about-honors-box .grids .about-honors-item .img{
    padding: 10px;
  }
}

.iderCompanyHonorsTabs .about-honors-box .grids .about-honors-item .img img{
  height: 3.75rem;
  transition: all .3s;
}
@media screen and (max-width: 768px){
  .iderCompanyHonorsTabs .about-honors-box .grids .about-honors-item .img img{
    height: 300px;
  }
}

.iderCompanyHonorsTabs .about-honors-box .grids .about-honors-item .name{
  font-size: .2rem;
  line-height: .75rem;
  height: .75rem;
  overflow: hidden;
  text-align: center;
  font-weight: 400;
  color: #666;
}

@media screen and (max-width: 768px){
  .iderCompanyHonorsTabs .about-honors-box .grids .about-honors-item .name{
    font-size: 14px;
    line-height: 40px;
    height: 45px;
  }
}

.iderCompanyHonorsTabs .about-honors-pagination {
  margin-top: .3rem;
}

@media screen and (max-width: 768px){
  .iderCompanyHonorsTabs .about-honors-pagination{
    margin-top: 20px;
  }
}

.iderCompanyHonorsTabs .about-honors-pagination .page-numbers{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .08rem;
}

@media screen and (max-width: 768px){
  .iderCompanyHonorsTabs .about-honors-pagination .page-numbers{}
}

.iderCompanyHonorsTabs .about-honors-pagination .page-numbers span{
  display: inline-flex;
}

@media screen and (max-width: 768px){
  .iderCompanyHonorsTabs .about-honors-pagination .page-numbers span{}
}

.iderCompanyHonorsTabs .about-honors-pagination .page-numbers a,
.iderCompanyHonorsTabs .about-honors-pagination .page-numbers .current{
  min-width: .34rem;
  height: .34rem;
  padding: 0 .08rem;
  border: 1px solid #ececec;
  background: #fff;
  color: #666;
  font-size: .18rem;
  line-height: .32rem;
  text-align: center;
}

@media screen and (max-width: 768px){
  .iderCompanyHonorsTabs .about-honors-pagination .page-numbers a,
  .iderCompanyHonorsTabs .about-honors-pagination .page-numbers .current{}
}

.iderCompanyHonorsTabs .about-honors-pagination .page-numbers .current{
  border-color: #2f49a7;
  background: #2f49a7;
  color: #fff;
}

@media screen and (max-width: 768px){
  .iderCompanyHonorsTabs .about-honors-pagination .page-numbers .current{}
}





.iderCompanyWorkshopTabs .workshop-content-row .com-tl {
  margin: 0 0 .5rem;
  text-align: center;
  line-height: 1.1;
  font-weight: 600;
  font-size: .6rem;
}


@media screen and (max-width: 768px) {
  .iderCompanyWorkshopTabs .workshop-content-row .com-tl {
    margin-bottom: 30px;
    font-size: 30px;
  }
}

.iderCompanyWorkshopTabs .workshop-gallery {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .25rem;
}


@media screen and (max-width: 768px) {
  .iderCompanyWorkshopTabs .workshop-gallery {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.iderCompanyWorkshopTabs .workshop-gallery-item {
  width: 100%;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .iderCompanyWorkshopTabs .workshop-gallery-item {}
}

.iderCompanyWorkshopTabs .workshop-gallery-item img {
  width: 100%;
  height:2.5rem;
  object-fit: cover;
  display: block;
}


@media screen and (max-width: 768px) {
  .iderCompanyWorkshopTabs .workshop-gallery-item img {
    height: 200px;
  }
}

.iderCompanyBox2 {
  width: 100%;
  height: auto;
  padding: 0.8rem 0 1.25rem 0;
  background-color: #f6f6f6;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 {}
}

.iderCompanyBox2 .img {
  position: relative;
  width: 100%;
  height: 5.975rem;
  border-radius: 1px;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 .img {}
}

.iderCompanyBox2 .com-tl {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0.875rem;
  z-index: 2;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 .com-tl {}
}

.iderCompanyBox2 ul {
  grid-template-columns: repeat(auto-fit, minmax(5.3rem, 1fr));
  gap: 0.4125rem;
  padding: 0.3125rem 0.375rem 0.6875rem 0.375rem;
  background-color: #fff;
  box-shadow: 0px 0px 0.675rem 0.1rem rgba(101, 101, 101, 0.09);
  border-radius: 1px;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 ul {}
}

.iderCompanyBox2 ul li {
  width: 100%;
  height: 4.1rem;
  padding: 0.3125rem 0.625rem 0.125rem 0.625rem;
  border-radius: 0.125rem;
  border: solid 1px #e5e5e5;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 ul li {}
}

.iderCompanyBox2 li .icon {
  width: auto;
  display: flex;
  height: 1.0625rem;
  object-fit: contain;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 li .icon {}
}

.iderCompanyBox2 li:first-child .icon {
  width: 1.1875rem;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 li:first-child .icon {}
}

.iderCompanyBox2 li:last-child .icon {
  width: 0.8625rem;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox2 li:last-child .icon {}
}

.iderCompanyBox2 li .name {
  font-family: Roboto;
  font-size: 0.375rem;
  font-weight: normal;
  transition: all 0.3s;
  margin: 0.25rem 0 0.1875rem 0;
  color: var(--mainColor);
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 li .name {}
}

.iderCompanyBox2 li .ls {
  font-size: 0.225rem;
  line-height: 0.375rem;
  transition: all 0.3s;
  color: #000000;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox2 li .ls {}
}

.iderCompanyBox2 li:hover {
  background-color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .iderCompanyBox2 li:hover {}
}

.iderCompanyBox2 li:hover .name,
.iderCompanyBox2 li:hover .ls {
  color: #fff;
}

@media screen and (max-width: 768px) {

  .iderCompanyBox2 li:hover .name,
  .iderCompanyBox2 li:hover .ls {}
}

.iderCompanyBox2 li:hover .icon {
  filter: brightness(0) invert(1);
}

@media screen and (max-width: 768px) {
  .iderCompanyBox2 li:hover .icon {}
}

.iderCompanyBox3 {
  width: 100%;
  height: auto;
  padding: 1.375rem 0;
  background: url(../picture/ic2-1.png) center no-repeat;
  background-size: 5.7375rem auto;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox3 {}
}

.iderCompanyBox3Con {
  width: 100%;
  height: 8.25rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox3Con {}
}

.iderCompanyBox3Swiper1 {
  position: relative;
  width: 1.875rem;
  height: 100%;
  overflow: hidden;
  padding-left: 0.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper1 {}
}

.iderCompanyBox3Swiper1::before {
  display: block;
  content: "";
  height: 100%;
  width: 0.025rem;
  background: radial-gradient(circle,
      rgba(155, 155, 155, 0.5) 0%,
      transparent 100%);
}

@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper1::before {}
}

.iderCompanyBox3Swiper1 .time {
  position: relative;
  font-family: Roboto;
  cursor: pointer;
  font-size: 0.225rem;
  transition: all 0.3s;
  font-weight: normal;
  color: rgba(0, 0, 0, 0.7);
  padding-left: 0.375rem;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper1 .time {}
}

.iderCompanyBox3Swiper1 .swiper-slide::before {
  position: absolute;
  top: 0.0875rem;
  left: -0.0625rem;
  display: block;
  content: "";
  width: 0.1125rem;
  height: 0.1125rem;
  border-radius: 50%;
  background-color: #c6c6c6;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper1 .swiper-slide::before {}
}

.iderCompanyBox3Swiper1 .swiper-slide-thumb-active .time {
  color: var(--bg-c);
  transform: scale(1.2);
}

@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper1 .swiper-slide-thumb-active .time {}
}

.iderCompanyBox3Swiper2 {
  width: calc(100% - 1.875rem);
  height: 100%;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper2 {}
}

.iderCompanyBox3Swiper2 .time {
  font-family: Roboto;
  font-size: 0.6rem;
  font-weight: normal;
  color: var(--bg-c);
  width: 100%;
  padding-bottom: 0.125rem;
  position: relative;
  border-bottom: 0.0125rem solid #c6c6c6;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper2 .time {}
}

.iderCompanyBox3Swiper2 .con {
  width: 100%;
  height: 100%;
  position: relative;
  justify-content: center;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper2 .con {}
}

.iderCompanyBox3Swiper2 .con .img {
  position: absolute;
  right: 0;
  top: 0;
  width: 6.3125rem;
  height: 7.0625rem;
  z-index: 3;
  overflow: hidden;
  border-radius: 0.125rem;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper2 .con .img {}
}

.iderCompanyBox3Swiper2 .con .lt {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper2 .con .lt {}
}

.iderCompanyBox3Swiper2 .con .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.5s;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper2 .con .img img {}
}

.iderCompanyBox3Swiper2 .con .ls {
  font-size: 0.225rem;
  line-height: 0.375rem;
  color: #000000;
  width: 50%;
  margin-top: 0.1875rem;
}


@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper2 .con .ls {}
}

.iderCompanyBox3Swiper2 .time::after {
  display: block;
  content: "";
  width: 1.8375rem;
  position: absolute;
  left: 0;
  bottom: -0.025rem;
  height: 0.0375rem;
  background-color: var(--bg-c);
  border-radius: 1px;
}

@media screen and (max-width: 768px) {
  .iderCompanyBox3Swiper2 .time::after {}
}

.iderWhyBox1 {
  width: 100%;
  height: auto;
  padding: 1.5rem 0 1.125rem 0;
}


@media screen and (max-width: 768px) {
  .iderWhyBox1 {}
}

.iderWhyBox1 .com-card {
  background: url(../picture/ic2-1.png) 2% top no-repeat;
  background-size: 5.7375rem auto;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1 .com-card {}
}

.iderWhyBox1 .top {
  align-items: flex-start;
  width: 100%;
  height: auto;
  margin-bottom: 0.3125rem;
}


@media screen and (max-width: 768px) {
  .iderWhyBox1 .top {}
}

.iderWhyBox1 .top .com-tl {
  flex: 1;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1 .top .com-tl {}
}

.iderWhyBox1 .top .title {
  width: 62%;
}


@media screen and (max-width: 768px) {
  .iderWhyBox1 .top .title {}
}

.iderWhyBox1Con .lt {
  flex: 1;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .lt {}
}

.iderWhyBox1Con .imgList {
  width: 12.125rem;
  overflow: hidden;
  margin-left: 0.75rem;
  height: 7.0625rem;
  border-radius: 1px;
}


@media screen and (max-width: 768px) {
  .iderWhyBox1Con .imgList {}
}

.iderWhyBox1Con .imgList img.active {
  display: block;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .imgList img.active {}
}

.iderWhyBox1Con .imgList img {
  display: none;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .imgList img {}
}

.iderWhyBox1Con .item .name {
  font-family: Roboto;
  font-size: 0.225rem;
  font-weight: normal;
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .item .name {}
}

.iderWhyBox1Con .item .text {
  display: none;
  color: #000;
  padding: 0.1875rem 0 0 0.25rem;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .item .text {}
}

.iderWhyBox1Con .item {
  position: relative;
  margin-bottom: 0.3125rem;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .item {}
}

.iderWhyBox1Con .item .tl {
  position: relative;
  cursor: pointer;
  width: 100%;
  padding-left: 0.25rem;
  height: auto;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .item .tl {}
}

.iderWhyBox1Con .item::before {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0.0375rem;
  margin-right: 0.25rem;
  height: 0.3125rem;
  background-color: #333;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .item::before {}
}

.iderWhyBox1Con .item.active::before {
  height: 100%;
  background-color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .item.active::before {}
}

.iderWhyBox1Con .item.active .name {
  color: var(--bg-c);
  text-decoration: underline;
}

@media screen and (max-width: 768px) {
  .iderWhyBox1Con .item.active .name {}
}

.iderWhyBox2 {
  width: 100%;
  height: auto;
  padding: 0.7875rem 0 1.5rem 0;
  background-color: var(--bg);
}


@media screen and (max-width: 768px) {
  .iderWhyBox2 {}
}

.iderWhyBox2 .img {
  width: 6.6875rem;
  height: auto;
  margin-right: 0.625rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderWhyBox2 .img {}
}

.iderWhyBox2 .text {
  flex: 1;
}


@media screen and (max-width: 768px) {
  .iderWhyBox2 .text {}
}

.iderWhyBox2 .text ul {
  gap: 0.625rem 0.6875rem;
  margin-top: 0.5625rem;
  grid-template-columns: repeat(auto-fit, minmax(4.75rem, 1fr));
}


@media screen and (max-width: 768px) {
  .iderWhyBox2 .text ul {}
}

.iderWhyBox2 .text .icon {
  width: 0.6125rem;
  transition: all 0.3s;
  height: auto;
  object-fit: contain;
  display: block;
}


@media screen and (max-width: 768px) {
  .iderWhyBox2 .text .icon {}
}

.iderWhyBox2 .text .ls {
  position: relative;
  width: 100%;
  height: auto;
  margin-top: 0.1875rem;
  padding-top: 0.25rem;
  border-top: 0.0125rem solid #e8e8e8;
}

@media screen and (max-width: 768px) {
  .iderWhyBox2 .text .ls {}
}

.iderWhyBox2 .text .ls::after {
  position: absolute;
  left: 0;
  top: 0;
  content: "";
  width: 1.2625rem;
  height: 0.0125rem;
  background-color: var(--bg-c);
  border-radius: 0.0125rem;
}

@media screen and (max-width: 768px) {
  .iderWhyBox2 .text .ls::after {}
}

.iderWhyBox2 .text .name {
  font-family: Roboto;
  font-size: 0.225rem;
  font-weight: normal;
  margin-bottom: 0.0625rem;
  color: #000000;
}

@media screen and (max-width: 768px) {
  .iderWhyBox2 .text .name {}
}

.iderWhyBox2 .text li:hover .icon {
  transform: translateX(50%);
}

@media screen and (max-width: 768px) {
  .iderWhyBox2 .text li:hover .icon {}
}

.iderWhyBox3 {
  width: 100%;
  height: auto;
  padding: 0.9375rem 0;
}


@media screen and (max-width: 768px) {
  .iderWhyBox3 {}
}

.iderWhyBox3 .title {
  width: 86%;
  margin: 0 auto;
  text-align: center;
  margin-top: 0.15rem;
}


@media screen and (max-width: 768px) {
  .iderWhyBox3 .title {}
}

.iderWhyBox3Swiper {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin-top: 0.475rem;
}

@media screen and (max-width: 768px) {
  .iderWhyBox3Swiper {}
}

.iderWhyBox3Swiper .img {
  width: 100%;
  height: 4.85rem;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .iderWhyBox3Swiper .img {}
}

.iderWhyBox3-pagination {
  margin-top: 0.65rem;
}


@media screen and (max-width: 768px) {
  .iderWhyBox3-pagination {}
}

.iderWhyBox3-pagination .swiper-pagination-bullet {
  width: 0.2rem;
  height: 0.2rem;
  background-color: #e8e8e8;
  opacity: 1;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .iderWhyBox3-pagination .swiper-pagination-bullet {}
}

.iderWhyBox3-pagination .swiper-pagination-bullet-active {
  background-color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .iderWhyBox3-pagination .swiper-pagination-bullet-active {}
}

.iderWhyBox4 {
  width: 100%;
  height: auto;
  padding: 0.625rem 0 0.8125rem 0;
  background-color: var(--bg);
}


@media screen and (max-width: 768px) {
  .iderWhyBox4 {}
}

.iderWhyBox4Con {
  width: 100%;
  height: auto;
  margin-top: 0.875rem;
}


@media screen and (max-width: 768px) {
  .iderWhyBox4Con {}
}

.iderWhyBox4Con .navItem {
  width: 100%;
  height: auto;
  border-bottom: 0.0125rem solid #e8e8e8;
}

@media screen and (max-width: 768px) {
  .iderWhyBox4Con .navItem {}
}

.iderWhyBox4Con .navItem .item {
  position: relative;
  font-family: Roboto;
  font-size: 0.3rem;
  cursor: pointer;
  font-weight: normal;
  color: var(--bg-c);
  padding-bottom: 0.1875rem;
  margin-right: 0.75rem;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .iderWhyBox4Con .navItem .item {}
}

.iderWhyBox4Con .navItem .item:hover::after,
.iderWhyBox4Con .navItem .item.active::after {
  width: 100%;
}

@media screen and (max-width: 768px) {

  .iderWhyBox4Con .navItem .item:hover::after,
  .iderWhyBox4Con .navItem .item.active::after {}
}

.iderWhyBox4Con .navItem .item:last-child {
  margin-right: 0;
}

@media screen and (max-width: 768px) {
  .iderWhyBox4Con .navItem .item:last-child {}
}

.iderWhyBox4Con .navItem .item::after {
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  content: "";
  width: 0;
  transition: all 0.3s;
  height: 0.0125rem;
  background-color: var(--bg-c);
  border-radius: 1px;
}

@media screen and (max-width: 768px) {
  .iderWhyBox4Con .navItem .item::after {}
}

.iderWhyBox4Con .itemList {
  width: 100%;
  margin-top: 0.5rem;
}


@media screen and (max-width: 768px) {
  .iderWhyBox4Con .itemList {}
}

.iderWhyBox4Con .itemList .items {
  display: none;
  grid-template-columns: repeat(auto-fit, minmax(5.65rem, 1fr));
  gap: 0.3125rem 0.275rem;
}


@media screen and (max-width: 768px) {
  .iderWhyBox4Con .itemList .items {}
}

.iderWhyBox4Con .itemList .items.active {
  display: grid;
}

@media screen and (max-width: 768px) {
  .iderWhyBox4Con .itemList .items.active {}
}

.iderWhyBox4Con .itemList .img {
  height: 3.8125rem;
  overflow: hidden;
  border-radius: 0.1375rem;
}


@media screen and (max-width: 768px) {
  .iderWhyBox4Con .itemList .img {}
}

.iderWhyBox5 {
  width: 100%;
  height: auto;
  padding: 1.125rem 0;
}


@media screen and (max-width: 768px) {
  .iderWhyBox5 {}
}

.iderWhyBox5 .bg {
  width: 100%;
  height: auto;
  display: block;
  margin-top: 0.625rem;
  object-fit: cover;
}


@media screen and (max-width: 768px) {
  .iderWhyBox5 .bg {}
}

.iderBanner .text {
  width: 100%;
  height: auto;
  position: absolute;
  left: 0;
  bottom: .8rem;
  z-index: 2;
}

@media screen and (max-width: 768px) {
  .iderBanner .text {
    bottom: 10px;
  }
}

.iderBanner .text .tl {
  font-family: Roboto;
  font-size: 0.75rem;
  line-height: 0.9rem;
  color: #ffffff;
  text-align: center;
  width: min(100%, 14rem);
  margin: 0 auto;
}


@media screen and (max-width: 768px) {
  .iderBanner .text .tl {}
}

.header.inner .rt .menu-level1,
.header.inner .rt .search {
  background-color: rgba(255, 255, 255, 0.3);
}

@media screen and (max-width: 768px) {

  .header.inner .rt .menu-level1,
  .header.inner .rt .search {}
}

.header.active .rt .menu-level1,
.header.active .rt .search,
.header.active .languageSwitching,
.header.inner .languageSwitching {
  background-color: rgba(255, 255, 255, 0.28);
}

@media screen and (max-width: 768px) {

  .header.active .rt .menu-level1,
  .header.active .rt .search,
  .header.active .languageSwitching,
  .header.inner .languageSwitching {}
}

.iderServiceBox1{
  padding: 1.25rem 0;
}

@media screen and (max-width: 768px){
  .iderServiceBox1{
    padding: 50px 0;
  }
}

.iderServiceBox1 .title {
  text-align: center;
  font-size: 48px;
  font-family: Roboto;
  font-weight: 600;
}


@media screen and (max-width: 768px) {
  .iderServiceBox1 .title {
    font-size: 30px;
  }
}

.iderServiceBox1 .service-rich-content {
  margin-top: .5625rem;
  font-size: .2rem;
  line-height: 2;
  color: #000;
}


@media screen and (max-width: 768px) {
  .iderServiceBox1 .service-rich-content {
    margin-top: 30px;
    font-size: 16px;
  }
}



@media screen and (max-width: 768px) {

  .iderServiceBox1 .service-rich-content,
  .iderServiceBox1 .service-rich-content p,
  .iderServiceBox1 .service-rich-content li {}
}

.iderServiceBox1 .service-rich-content p {
  margin: 0 0 0.08rem;
}

@media screen and (max-width: 768px) {
  .iderServiceBox1 .service-rich-content p {
    font-size: 16px;
    line-height: 1.6;
  }
}

.iderServiceBox1 .service-rich-content p:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .iderServiceBox1 .service-rich-content p:last-child {}
}

.iderServiceBox2 {
  width: 100%;
  height: auto;
  padding: 0.625rem 0 1.125rem 0;
}


@media screen and (max-width: 768px) {
  .iderServiceBox2 {}
}

.iderServiceBox2Con {
  width: 100%;
  height: auto;
  margin-top: 0.5625rem;
  gap: 0.0125rem;
  grid-template-columns: repeat(auto-fit, minmax(2.4875rem, 1fr));
}


@media screen and (max-width: 768px) {
  .iderServiceBox2Con {}
}

.iderServiceBox2Con .item .icon {
  display: block;
  height: 0.6625rem;
  object-fit: contain;
  width: auto;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .iderServiceBox2Con .item .icon {}
}

.iderServiceBox2Con .item {
  width: 100%;
  height: 2.7125rem;
  background: url(../images/im3-7.png) no-repeat;
  background-size: 2.5rem auto;
  padding: 0.5rem 0.3125rem 0.25rem 0.25rem;
}

@media screen and (max-width: 375px) {
  .iderServiceBox2Con .item {
    height: auto;
    background: none !important;
    padding: 4%;
  }
}

@media screen and (max-width: 768px) {
  .iderServiceBox2Con .item {}
}

.iderServiceBox2Con .item:last-child {
  background: url(../images/im3-8.png) no-repeat;
  background-size: 2.3125rem auto;
}

@media screen and (max-width: 768px) {
  .iderServiceBox2Con .item:last-child {}
}

.iderServiceBox2Con .item:hover .icon {
  transform: translateY(-10%);
}

@media screen and (max-width: 768px) {
  .iderServiceBox2Con .item:hover .icon {}
}

.iderServiceBox2Con .item .name {
  font-size: 0.225rem;
  line-height: 0.3rem;
  color: var(--mainColor);
  margin-top: 0.375rem;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .iderServiceBox2Con .item .name {}
}

.iderServiceBox2Con .item:last-child .icon {
  height: 0.4125rem;
}

@media screen and (max-width: 768px) {
  .iderServiceBox2Con .item:last-child .icon {}
}

.iderServiceBox3 {
  width: 100%;
  height: auto;
  padding: 1.1875rem 0 1rem 0;
  background-color: var(--bg);
}


@media screen and (max-width: 768px) {
  .iderServiceBox3 {}
}

.iderServiceBox3 .img {
  width: 9.9375rem;
  height: 6.725rem;
  overflow: hidden;
  border-radius: 0.125rem;
  margin-left: 1.25rem;
}


@media screen and (max-width: 768px) {
  .iderServiceBox3 .img {}
}

.iderServiceBox3 .text {
  flex: 1;
}


@media screen and (max-width: 768px) {
  .iderServiceBox3 .text {}
}

.iderServiceBox3 .text .com-ls30 p {
  margin-bottom: 0.1875rem;
}

@media screen and (max-width: 768px) {
  .iderServiceBox3 .text .com-ls30 p {}
}

.iderServiceBox3 .text .ls {
  margin: 0.1875rem 0 0.5rem 0;
}

@media screen and (max-width: 768px) {
  .iderServiceBox3 .text .ls {}
}

.iderServiceBox4 {
  width: 100%;
  height: auto;
  margin: 1.25rem 0;
}


@media screen and (max-width: 768px) {
  .iderServiceBox4 {}
}

.iderServiceBox4 .com-card {
  position: relative;
}

@media screen and (max-width: 768px) {
  .iderServiceBox4 .com-card {}
}

.iderServiceBox4 .com-card::after {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent);
}


@media screen and (max-width: 768px) {
  .iderServiceBox4 .com-card::after {}
}

.iderServiceBox4 .com-tl,
.iderServiceBox4 .com-ls30 {
  color: #fff;
}

@media screen and (max-width: 768px) {

  .iderServiceBox4 .com-tl,
  .iderServiceBox4 .com-ls30 {}
}

.iderServiceBox4 .bg {
  width: 100%;
  height: auto;
  object-fit: cover;
  vertical-align: bottom;
}

@media screen and (max-width: 768px) {
  .iderServiceBox4 .bg {}
}

.iderServiceBox4 .text {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 2;
  top: 0.75rem;
  height: auto;
}


@media screen and (max-width: 768px) {
  .iderServiceBox4 .text {}
}

.iderServiceBox4 .com-ls30 {
  width: 54%;
  margin: 0 auto;
  text-align: center;
  margin-top: 0.0625rem;
}

@media screen and (max-width: 768px) {
  .iderServiceBox4 .com-ls30 {}
}

.iderServiceBox5 {
  width: 100%;
  height: auto;
  padding: 1rem 0;
  background-color: var(--bg);
}


@media screen and (max-width: 768px) {
  .iderServiceBox5 {}
}

.iderServiceBox5Swiper {
  width: 100%;
  height: 7.875rem;
  margin-top: 0.625rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper {}
}

.iderServiceBox5Swiper .img-side {
  width: 7.3625rem;
  height: 4.65rem;
  border-radius: 0.125rem;
  margin-left: 0.5rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .img-side {}
}

.iderServiceBox5Swiper .con {
  width: 100%;
  height: auto;
  background-color: var(--bg-c);
  box-shadow: 0px 0px 0.3375rem 0px rgba(107, 107, 107, 0.23);
  border-radius: 0.125rem;
  padding: 0.6rem;
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .con {}
}

.iderServiceBox5Swiper .con .top {
  height: 0;
  overflow: hidden;
  opacity: 0;
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .con .top {}
}

.iderServiceBox5Swiper .text-side {
  flex: 1;
  font-size: 0.225rem;
  line-height: 0.5rem;
  color: #e8e8e8;
}


@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .text-side {}
}

.iderServiceBox5Swiper .step-title .num {
  font-size: 0.2875rem;
  color: rgba(0, 0, 0, 0.7);
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .step-title .num {}
}

.iderServiceBox5Swiper .step-title .txt {
  font-family: Roboto;
  font-size: 0.3rem;
  color: #172c4e;
  opacity: 0.7;
  margin-left: 0.25rem;
}


@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .step-title .txt {}
}

.iderServiceBox5Swiper .swiper-slide-active .num,
.iderServiceBox5Swiper .swiper-slide-active .txt {
  color: #fff;
  opacity: 1;
}

@media screen and (max-width: 768px) {

  .iderServiceBox5Swiper .swiper-slide-active .num,
  .iderServiceBox5Swiper .swiper-slide-active .txt {}
}

.iderServiceBox5Swiper .swiper-slide {
  background: transparent;
  pointer-events: none;
  transition: all 0.4s ease;
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide {}
}

.iderServiceBox5Swiper .swiper-slide-active {
  pointer-events: auto;
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide-active {}
}

.iderServiceBox5Swiper .main-box {
  width: 84%;
  height: 6.9125rem;
  background: #fff;
  border-radius: 0.2rem;
  box-shadow: 0px 0px 0.3375rem 0px rgba(107, 107, 107, 0.23);
  display: flex;
  flex-direction: column;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  transform-origin: center top;
  overflow: hidden;
  margin: 0 auto;
}


@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .main-box {}
}

.iderServiceBox5Swiper .swiper-slide-active .main-box {
  background: linear-gradient(135deg, #448aff 0%, #5a9bff 100%);
  color: #fff;
  box-shadow: 0 0.25rem 0.75rem rgba(68, 138, 255, 0.35);
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide-active .main-box {}
}

.iderServiceBox5Swiper .inner-content {
  flex: 1;
  display: flex;
  padding: 0.625rem;
  gap: 0.5rem;
  opacity: 0;
  transition: opacity 0.4s ease 0.1s;
  pointer-events: none;
}


@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .inner-content {}
}

.iderServiceBox5Swiper .swiper-slide-active .inner-content {
  opacity: 1;
  pointer-events: auto;
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide-active .inner-content {}
}

.iderServiceBox5Swiper .step-title {
  height: 0.9375rem;
  display: flex;
  align-items: center;
  padding: 0 0.625rem;
  background: #fff;
  transition: all 0.4s ease;
}


@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .step-title {}
}

.iderServiceBox5Swiper .swiper-slide-active .step-title {
  background: linear-gradient(135deg, #448aff 0%, #5a9bff 100%);
  color: #fff;
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide-active .step-title {}
}

.iderServiceBox5Swiper .swiper-slide:not(.swiper-slide-active) .step-title {
  color: #888;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide:not(.swiper-slide-active) .step-title {}
}

.iderServiceBox5Swiper .swiper-slide-next .main-box {
  transform: scaleX(0.96) translateY(0);
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide-next .main-box {}
}

.iderServiceBox5Swiper .swiper-slide-next+.swiper-slide .main-box {
  transform: scaleX(0.92) translateY(0);
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide-next+.swiper-slide .main-box {}
}

.iderServiceBox5Swiper .swiper-slide-next+.swiper-slide+.swiper-slide .main-box {
  transform: scaleX(0.88) translateY(0);
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .swiper-slide-next+.swiper-slide+.swiper-slide .main-box {}
}

.iderServiceBox5Swiper .service-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:
    radial-gradient(circle at 10% 20%,
      rgba(68, 138, 255, 0.08) 0%,
      transparent 40%),
    radial-gradient(circle at 90% 80%,
      rgba(68, 138, 255, 0.06) 0%,
      transparent 40%);
  pointer-events: none;
}

@media screen and (max-width: 768px) {
  .iderServiceBox5Swiper .service-container::before {}
}

.iderServiceBox6 {
  width: 100%;
  height: auto;
  padding: 1.5rem 0;
}


@media screen and (max-width: 768px) {
  .iderServiceBox6 {}
}

.iderServiceBox6 .com-tl {
  width: 25%;
  margin-right: 130px;
}


@media screen and (max-width: 768px) {
  .iderServiceBox6 .com-tl {}
}

.iderServiceBox6 .rt {
  flex: 1;
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt {}
}

.iderServiceBox6 .rt .dot {
  width: 64px;
  height: 60px;
  background-color: #ffffff;
  cursor: pointer;
  border: solid 1px #e5e5e5;
  margin-right: 0.025rem;
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .dot {}
}

.iderServiceBox6 .rt .dot::after {
  display: block;
  content: "";
  width: 0.025rem;
  height: 0.2375rem;
  background-color: #7d7d7d;

  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .dot::after {}
}

.iderServiceBox6 .rt .dot::before {
  display: block;
  content: "";
  width: 0.025rem;
  transform: translateX(50%) rotate(90deg);
  height: 0.2375rem;
  background-color: #7d7d7d;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .dot::before {}
}

.iderServiceBox6 .rt .item {
  margin-bottom: 0.125rem;
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .item {}
}

.iderServiceBox6 .rt .name {
  font-size: 0.225rem;
  cursor: pointer;
  padding: 0.1875rem 0.375rem;
  color: #000000;
}


@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .name {}
}

.iderServiceBox6 .rt .item.active .name {
  color: var(--bg-c);
}


@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .item.active .name {}
}

.iderServiceBox6 .rt .item.active .dot::after {
  transform: translateX(50%) rotate(90deg);
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .item.active .dot::after {}
}

.iderServiceBox6 .rt .item.active .dot {
  background-color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .item.active .dot {}
}

.iderServiceBox6 .rt .item.active .items {
  border-color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .item.active .items {}
}

.iderServiceBox6 .rt .items {
  flex: 1;
  border: solid 1px #e5e5e5;
}


@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .items {}
}

.iderServiceBox6 .rt .items .text {
  width: 100%;
  display: none;
  padding: 0.125rem 0.375rem 0.375rem;
}

@media screen and (max-width: 768px) {
  .iderServiceBox6 .rt .items .text {}
}

.iderSoluDelBox1 {
  width: 100%;
  height: auto;
  padding: 1.125rem 0 0.5rem 0;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox1 {}
}

.iderSoluDelBox1 .com-card {
  padding-bottom: 1.125rem;
  border-bottom: 1px solid #e8e8e8;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox1 .com-card {}
}

.iderSoluDelBox1Con {
  width: 100%;
  height: auto;
  margin-top: 0.875rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox1Con {}
}

.iderSoluDelBox1Con .img {
  width: 8.7625rem;
  overflow: hidden;
  height: 6.3rem;
  margin-right: 0.75rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox1Con .img {}
}

.iderSoluDelBox1Con .text {
  flex: 1;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox1Con .text {}
}

.iderSoluDelBox1Con .text .tl {
  font-size: 0.3rem;
  line-height: 0.45rem;
  color: var(--mainColor);
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox1Con .text .tl {}
}

.iderSoluDelBox1Con .text .lss li {
  font-size: 0.2rem;
  line-height: 0.3rem;
  color: var(--mainColor);
  margin-top: 0.1875rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox1Con .text .lss li {}
}

.iderSoluDelBox1Con .text .lss li strong {
  font-family: Roboto-Medium;
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox1Con .text .lss li strong {}
}

.iderSoluDelBox2 {
  width: 100%;
  height: auto;
  padding: 0.5625rem 0;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox2 {}
}

.iderSoluDelBox2Con {
  width: 100%;
  height: 6.2rem;
  margin-top: 0.8125rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox2Con {}
}

.iderSoluDelBox2Con .lt {
  width: 5.75rem;
  height: 100%;
  margin-right: 0.1625rem;
  transition: all 0.3s;
  background-color: #f5f5f5;
  border-radius: 0.125rem;
  padding: 0.75rem 0.375rem 0.125rem 0.5625rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox2Con .lt {}
}

.iderSoluDelBox2Con ul {
  flex: 1;
  height: 100%;
  justify-content: space-between;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox2Con ul {}
}

.iderSoluDelBox2Con ul li {
  width: calc((100% - 0.15rem) / 2);
  height: calc((100% - 0.1125rem) / 2);
  background-color: #f5f5f5;
  border-radius: 0.125rem;
  transition: all 0.3s;
  padding: 0.5rem 0.3125rem 0.125rem 0.3625rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox2Con ul li {}
}

.iderSoluDelBox2Con ul li:hover .icon,
.iderSoluDelBox2Con .lt:hover .icon {
  transform: translateY(-10px);
}

@media screen and (max-width: 768px) {

  .iderSoluDelBox2Con ul li:hover .icon,
  .iderSoluDelBox2Con .lt:hover .icon {}
}

.iderSoluDelBox2Con .icon {
  width: 0.6375rem;
  height: 0.6375rem;
  display: block;
  object-fit: contain;
  transition: all 0.3s;
  margin-right: 0.1875rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox2Con .icon {}
}

.iderSoluDelBox2Con ul .text {
  padding-left: 0.8375rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox2Con ul .text {}
}

.iderSoluDelBox2Con .name {
  font-family: Roboto;
  font-size: 0.375rem;
  color: #000000;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox2Con .name {}
}

.iderSoluDelBox2Con .text {
  font-size: 0.225rem;
  line-height: 0.375rem;
  color: #000000;
  margin-top: 0.1875rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox2Con .text {}
}

.iderSoluDelBox3 {
  width: 100%;
  height: auto;
  padding: 0.5625rem 0 1.375rem 0;
  border-bottom: 1px solid #e5e5e5;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox3 {}
}

.iderSoluDelBox3Swiper {
  position: relative;
  width: 100%;
  height: auto;
  margin-top: 0.8125rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox3Swiper {}
}

.iderSoluDelBox3Swiper .img {
  display: block;
  width: 100%;
  height: 5.575rem;
  border-radius: 0.025rem;
  overflow: hidden;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox3Swiper .img {}
}

.iderSoluDelBox3Swiper .name {
  position: absolute;
  display: block;
  width: 100%;
  height: auto;
  left: 0;
  bottom: 0;
  font-family: Roboto;
  font-size: 0.3rem;
  color: #ffffff;
  padding: 0 0.125rem 0.25rem 0.3125rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox3Swiper .name {}
}

.iderSoluDelBox3-prev,
.iderSoluDelBox3-next {
  position: absolute;
  cursor: pointer;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
  width: 0.4375rem;
  height: 0.4375rem;
  border: solid 0.0125rem #ffffff;
  font-family: Roboto-Light;
  font-size: 0.3rem;
  border-radius: 50%;
  color: #ffffff;
}

@media screen and (max-width: 768px) {

  .iderSoluDelBox3-prev,
  .iderSoluDelBox3-next {}
}

.iderSoluDelBox3-prev {
  left: 0.1125rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox3-prev {}
}

.iderSoluDelBox3-next {
  right: 0.1125rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox3-next {}
}

.iderSoluDelBox3-prev:hover,
.iderSoluDelBox3-next:hover {
  background-color: var(--bg-c);
  border-color: var(--bg-c);
}

@media screen and (max-width: 768px) {

  .iderSoluDelBox3-prev:hover,
  .iderSoluDelBox3-next:hover {}
}

.iderSoluDelBox5 {
  width: 100%;
  height: auto;
  border-top: 1px solid #e5e5e5;
  padding: 1.1875rem 0 1.75rem 0;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox5 {}
}

.iderSoluDelBox5Swiper {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox5Swiper {}
}

.iderSoluDelBox5Swiper .con {
  width: 100%;
  height: 6.3rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox5Swiper .con {}
}

.iderSoluDelBox5Swiper .con .img {
  width: 10.0125rem;
  height: 100%;
  margin-left: 0.75rem;
  overflow: hidden;
  border-radius: 2px;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox5Swiper .con .img {}
}

.iderSoluDelBox5Swiper .con .text {
  flex: 1;
  padding-right: 0.3125rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox5Swiper .con .text {}
}

.iderSoluDelBox5Swiper .con .text .com-ls30 {
  color: #000;
  margin: 0.1875rem 0 0.3125rem 0;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox5Swiper .con .text .com-ls30 {}
}

.iderSoluDelBox5Swiper .con .text .com-mores {
  width: 2.3125rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox5Swiper .con .text .com-mores {}
}

.iderSoluDelBox5Swiper .bto {
  position: absolute;
  left: 0;
  bottom: 0.625rem;
  width: fit-content;
  height: auto;
  z-index: 2;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox5Swiper .bto {}
}

.iderSoluDelBox5-prev,
.iderSoluDelBox5-next {
  cursor: pointer;
  width: 0.4375rem;
  border-radius: 50%;
  height: 0.4375rem;
  background-color: rgba(28, 70, 148, 0.2);
  border: solid 0.0125rem #ffffff;
  font-family: Roboto-Light;
  font-size: 0.3rem;
  color: #ffffff;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {

  .iderSoluDelBox5-prev,
  .iderSoluDelBox5-next {}
}

.iderSoluDelBox5-next:hover,
.iderSoluDelBox5-prev:hover {
  background-color: var(--bg-c);
}

@media screen and (max-width: 768px) {

  .iderSoluDelBox5-next:hover,
  .iderSoluDelBox5-prev:hover {}
}

.iderSoluDelBox5-pagination {
  flex: 1;
  margin: 0 0.1875rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox5-pagination {}
}

.iderSoluDelBox6 {
  width: 100%;
  height: auto;
  padding: 1.375rem 0 1.25rem;
  background-color: var(--bg);
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox6 {}
}

.iderSoluDelBox6 ul {
  width: 100%;
  height: auto;
  margin-top: 0.875rem;
  gap: 0.4rem;
  grid-template-columns: repeat(auto-fit, minmax(5.5625rem, 1fr));
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox6 ul {}
}

.iderSoluDelBox6 ul li {
  height: 6.4rem;
  justify-content: space-between;
  width: 100%;
  background-color: #ffffff;
  border-radius: 0.125rem;
  padding: 0.625rem 0.5rem 0.375rem 0.5rem;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox6 ul li {}
}

.iderSoluDelBox6 li .icon {
  width: 0.7125rem;
  height: auto;
  object-fit: contain;
  transition: all 0.3s;
  display: block;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox6 li .icon {}
}

.iderSoluDelBox6 li .img {
  width: 0.95rem;
  height: 0.95rem;
  border-radius: 50%;
  overflow: hidden;
  margin-bottom: 0.15rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox6 li .img {}
}

.iderSoluDelBox6 li .name strong {
  color: var(--bg-c);
  display: block;
  font-size: 0.25rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox6 li .name strong {}
}

.iderSoluDelBox6 li .name {
  font-size: 0.2rem;
  color: #000000;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox6 li .name {}
}

.iderSoluDelBox6 li .com-ls30 {
  text-align: center;
  margin-top: 0.1875rem;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox6 li .com-ls30 {}
}

.iderSoluDelBox7 {
  width: 100%;
  height: auto;
  padding: 1.25rem 0 0.875rem 0;
}


@media screen and (max-width: 768px) {
  .iderSoluDelBox7 {}
}

.iderSoluDelBox7 .iderIndexBox1Con .item:hover .img {
  display: flex;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox7 .iderIndexBox1Con .item:hover .img {}
}

.iderProductBox1 {
  width: 100%;
  height: auto;
  padding: 1.25rem 0;
}


@media screen and (max-width: 768px) {
  .iderProductBox1 {
    padding: 50px 0;
  }
}

.iderProductBox1 .com-card {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .com-card {
    flex-direction: column;
  }
}

.iderProductBox1 .lt {
  width: 3.5rem;
  flex-shrink: 0;
}


@media screen and (max-width: 768px) {
  .iderProductBox1 .lt {
    width: 100%;
    margin-bottom: 20px;
  }
}

.iderProductBox1 .rt {
  flex: 1;
  width: calc(100% - 4rem);
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .rt {
    width: 100%;
  }
}

.iderProductBox1Rt {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .iderProductBox1Rt {}
}

.iderProductBox1 .rt .max-tl {
  font-size: 0.5rem;
  margin-bottom: 0.25rem;
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .rt .max-tl {
    font-size: 0.35rem;
  }
}

.iderProductBox1 .rt .com-ls30 {
  font-size: 0.175rem;
  line-height: 1.8;
  color: #666;
  margin-bottom: 0.375rem;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .rt .com-ls30 {
    font-size: 0.15rem;
  }
}

.iderProductBox1 .lt .title {
  font-family: Roboto;
  font-size: 0.3rem;
  color: #fff;
  background:var(--bg-c);
  padding: .125rem .25rem;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .lt .title {
    font-size: 20px;
    padding: 10px 25px;
  }
}

.iderProductBox1 .lt .item {
  width: 100%;
  height: auto;
  border-bottom: 1px solid #f5f5f5;
}

.iderProductBox1 .lt .menu{
  background: #eee;
}

.iderProductBox1 .lt .item .tl {
  display: flex;
  align-items: center;
  gap: 0.1rem;
  cursor: pointer;
  padding: .1875rem;
}

@media screen and (max-width: 768px){
  .iderProductBox1 .lt .item .tl {
    padding:10px 15px;
    gap: 10px;
  }
}

.iderProductBox1 .lt .item .toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.25rem;
  height: 0.25rem;
  font-size: 0.25rem;
  font-weight: bold;
  color: #7e7e7e;
  cursor: pointer;
  user-select: none;
  flex-shrink: 0;
}

@media screen and (max-width: 768px){
  .iderProductBox1 .lt .item .toggle-icon {
    width: 20px;
    height: 20px;
    font-size: 18px;
  }
}

.iderProductBox1 .lt .item .toggle-icon:hover {
  color: var(--bg-c);
}

.iderProductBox1 .lt .item .toggle-icon.hidden {
  display: none;
}

.iderProductBox1 .lt .item:first-child {
  border-top: 1px solid #ccc;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .lt .item:first-child {}
}

.iderProductBox1 .lt .item .name {
  display: block;
  font-size: 0.2rem;
  line-height: 0.3rem;
  color: #7e7e7e;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .lt .item .name {
    font-size: 16px;
    line-height: 30px;
  }
}

.iderProductBox1 .lt .item .name:hover,
.iderProductBox1 .lt .item.active .name {
  color: var(--bg-c);
}

@media screen and (max-width: 768px) {

  .iderProductBox1 .lt .item .name:hover,
  .iderProductBox1 .lt .item.active .name {}
}

.iderProductBox1 .lt .item .downs {
  display: none;
  background: #f5f5f5;
}

.iderProductBox1 .lt .item .downs .item {
  border-bottom: none;
  border-top: none;
  padding: 0.08rem 0;
  border-bottom: 1px solid #e5e5e5;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .lt .item .downs {}
}

.iderProductBox1 .lt .item .downs .item .tl{
  padding: .0625rem .1875rem;
}

@media screen and (max-width: 768px){
  .iderProductBox1 .lt .item .downs .item .tl {
    padding: 10px 15px;
  }
  .iderProductBox1 .lt .item .downs .item{
    padding: 0 10px;
  }
}


.iderProductBox1 .lt .item .downs .name {
  display: block;
  font-size: 0.18rem;
  line-height: 0.28rem;
  color: #7e7e7e;
  padding: 0.0625rem 0;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .lt .item .downs .name {
    font-size: 16px;
    line-height: 30px;
  }
}

.iderProductBox1 .lt .item .downs .name:hover,
.iderProductBox1 .lt .item .downs .item.active .name {
  text-decoration: underline;
  color: var(--bg-c);
}

.iderProductBox1 .lt .item .downList {
  padding-left: 0.1875rem;
  display: none;
  padding: 0.125rem;
}


@media screen and (max-width: 768px) {
  .iderProductBox1 .lt .item .downList {}
}

.iderProductBox1 .lt .item .downList a {
  display: block;
  width: fit-content;
  font-size: 0.2rem;
  color: #7e7e7e;
}


@media screen and (max-width: 768px) {
  .iderProductBox1 .lt .item .downList a {}
}

.iderProductBox1 .lt .item .downList a:hover {
  text-decoration: underline;
  color: var(--bg-c);
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .lt .item .downList a:hover {}
}

.iderProductBox1Rt .com-tl {
  font-size: 0.375rem;
}


@media screen and (max-width: 768px) {
  .iderProductBox1Rt .com-tl {}
}

.iderProductBox1Rt .tl {
  width: 100%;
  margin: 0.125rem 0 0.375rem 0;
}


@media screen and (max-width: 768px) {
  .iderProductBox1Rt .tl {}
}

.iderProductBox1Con {
  width: 100%;
  height: auto;
  gap: 0.1875rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

@media screen and (max-width: 768px) {
  .iderProductBox1Con {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.iderProductBox1Con .item {
}


@media screen and (max-width: 768px) {
  .iderProductBox1Con .item {
  }
}



.iderProductBox1Con .item .text {
  width: 100%;
  display: flex;
  flex-direction: column;
  transition: all 0.3s;
  justify-content: space-between;
}


@media screen and (max-width: 768px) {
  .iderProductBox1Con .item .text {
  }
}

.iderProductBox1Con .item .name {
  font-family: Roboto;
  font-size: .225rem;
  color: #000;
  line-height: .35rem;
  max-height: .35rem;
  overflow: hidden;
  -webkit-line-clamp: 1;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  font-weight: 600;
  padding: 0 .3125rem;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .iderProductBox1Con .item .name {
    font-size: 18px;
    line-height: 30px;
    max-height: 30px;
    padding: 0 10px;
  }
}

.iderProductBox1Con .item:hover .text {
  background-color: #ffffff;
}

@media screen and (max-width: 768px) {
  .iderProductBox1Con .item:hover .text {}
}

.iderProductBox1Con .item:hover .name,
.iderProductBox1Con .item:hover .com-ls30 {
  color: #00adef;
}

@media screen and (max-width: 768px) {

  .iderProductBox1Con .item:hover .name,
  .iderProductBox1Con .item:hover .com-ls30 {}
}

.iderProductBox1Con .img {
  width: 100%;
  height: 3.5rem;
  padding: 0.2rem;
  background-color: #ffffff;
  border: .0125rem solid #ddd;
  overflow: hidden;
  margin-bottom: .1875rem;
}


@media screen and (max-width: 768px) {
  .iderProductBox1Con .img {
    height: 230px;
    padding: 10px;
    border-width: 1px;
    margin-bottom: 15px;
  }
}

.iderProductBox1Con .img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: all 0.5s;
}

@media screen and (max-width: 768px) {
  .iderProductBox1Con .img img {}
}

.iderProductBox1Con .item .com-mores2 {
  padding:.25rem .375rem;
  justify-content: flex-start;
  border-top: 0.0125rem solid #eaf3ff;
  color: rgba(70,84,157,1);
  font-family: Roboto;
  font-size: 0.2rem;
  background: rgba(243,248,252,1);
  font-weight: 600;
}

@media screen and (max-width: 768px) {
  .iderProductBox1Con .item .com-mores2 {
    padding: 10px;
    font-size: 18px;
    border-top-width: 1px;
  }
}

.iderProductBox1Con .item .com-mores2::before {
  display: none;
}

@media screen and (max-width: 768px) {
  .iderProductBox1Con .item .com-mores2::before {}
}

.iderProductBox1Con .item .com-mores2::after {
  margin-left: auto;
  border-width: 0;
  background: transparent;
  width: auto;
}

@media screen and (max-width: 768px) {
  .iderProductBox1Con .item .com-mores2::after {
    font-size: 16px;
  }
}


.iderProductBox1 .pagination {
  margin-top: 0.12rem;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .pagination {}
}

.iderProductBox1 .pagination .page-numbers li {
  width: 0.36rem;
  height: 0.36rem;
  margin-right: 0.08rem;
  border-radius: 0;
  border-color: #dce8ff;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .pagination .page-numbers li {}
}

.iderProductBox1 .pagination .page-numbers li:last-child {
  margin-right: 0;
}

@media screen and (max-width: 768px) {
  .iderProductBox1 .pagination .page-numbers li:last-child {}
}

.iderProductBox1 .pagination .page-numbers li:hover,
.iderProductBox1 .pagination .page-numbers .current {
  background-color: #00adef;
  border-color: #00adef;
  color: #fff;
}

@media screen and (max-width: 768px) {

  .iderProductBox1 .pagination .page-numbers li:hover,
  .iderProductBox1 .pagination .page-numbers .current {}
}

.iderProductBox2 {
  padding: 1.125rem 0 0.75rem 0;
}


@media screen and (max-width: 768px) {
  .iderProductBox2 {}
}

.iderNav.inner {
  margin-top: 1.5rem;
}


@media screen and (max-width: 768px) {
  .iderNav.inner {}
}

.iderDetailsBox1 {
  width: 100%;
  height: auto;
  padding: .75rem 0;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 {}
}

.iderDetailsBox1 .com-card{
  gap: .25rem;
}

@media screen and (max-width: 768px){
  .iderDetailsBox1 .com-card{
    flex-direction: column;
    gap: 20px;
  }
}

.iderDetailsBox1 .lt {
  width: 50%;
  height: auto;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .lt {
    flex: none;
    width: 100%;
  }
}

.iderDetailsBox1 .rt {
  flex: 1;
  padding: 0.45rem 0.45rem 0.45rem 0.5rem;
  /* background: #f8f8f8; */
  min-height: 100%;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt {
    padding: 0;
  }
}

.detailBox1Swiper2 {
  width: 100%;
  height: 6.8rem;
  margin-bottom: 0.18rem;
  background: #fff;
  border: 0.0125rem solid #ececec;
  border-radius: 1px;
}


@media screen and (max-width: 768px) {
  .detailBox1Swiper2 {
    height: 300px;
    margin-bottom: 15px;
    border-width: 1px;
  }
}

.detailBox1Swiper2 .img {
  width: 100%;
  height: 100%;
  padding: 0.45rem;
}

@media screen and (max-width: 768px) {
  .detailBox1Swiper2 .img {
    padding: 10px;
  }
}

.detailBox1Swiper2 img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media screen and (max-width: 768px) {
  .detailBox1Swiper2 img {}
}

.iderDetailsBox1 .bto {
  width: 100%;
  background-color: transparent;
  border-radius: 1px;
  padding: 0;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox1 .bto {}
}

.detailBox1-prev,
.detailBox1-next {
  cursor: pointer;
  width: 0.45rem;
  border-radius: 0;
  height: 0.45rem;
  background-color: transparent;
  border: 0;
  font-family: Roboto-Light;
  font-size: 0.35rem;
  line-height: 1;
  color: #262626;
}

@media screen and (max-width: 768px) {

  .detailBox1-prev,
  .detailBox1-next {
    width: 30px;
    height: 30px;
    font-size: 30px;
  }
}

.detailBox1-next:hover,
.detailBox1-prev:hover {
  color: var(--bg-c);
}

@media screen and (max-width: 768px) {

  .detailBox1-next:hover,
  .detailBox1-prev:hover {}
}

.detailBox1Swiper1 {
  flex: 1;
  height: 100%;
  margin: 0 0.18rem;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .detailBox1Swiper1 {}
}

.detailBox1Swiper1 .swiper-slide {
}


@media screen and (max-width: 768px) {
  .detailBox1Swiper1 .swiper-slide {
  }
}

.detailBox1Swiper1 .img {
  cursor: pointer;
  height: .875rem;
  overflow: hidden;
  background: #fff;
  border: 0.0125rem solid #e8e8e8;
  padding: 0.08rem;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .detailBox1Swiper1 .img {
    height: 60px;
    border-width: 1px;
  }
}

.detailBox1Swiper1 .img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media screen and (max-width: 768px) {
  .detailBox1Swiper1 .img img {}
}

.detailBox1Swiper1 .swiper-slide-thumb-active .img {
  border: 1px solid #3760bd;
}

@media screen and (max-width: 768px) {
  .detailBox1Swiper1 .swiper-slide-thumb-active .img {}
}

.iderDetailsBox1 .rt .bottom .com-mores {
  width: 2.25rem;
  height: 0.62rem;
  background: #00adef;
  border-radius: 0.0625rem;
  font-size: 0.22rem;
  font-family: Roboto-SemiBold;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .bottom .com-mores {
    width: 120px;
    height: 45px;
    font-size: 14px;
    border-radius: 5px;
  }
}

.iderDetailsBox1 .rt .bottom .com-mores:hover {
  background: #028ec5;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .bottom .com-mores:hover {}
}

.iderDetailsBox1 .rt .text {
  margin-bottom: .3125rem;
  margin-top: .25rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .text {
    margin-bottom: 20px;
    font-size: 14px;
    margin-top: 10px;
  }
}

.iderDetailsBox1 .rt .text p{
  font-size: .2rem;
  line-height: 2;
}

@media screen and (max-width: 768px){
  .iderDetailsBox1 .rt .text p{
    font-size: 14px;
  }
}

.iderDetailsBox1 .rt .com-tl.left {
  margin-bottom: 0.2rem;
  padding-bottom: 0.15rem;
  border-bottom: 0.03rem solid #ddd;
  font-size: .3rem;
  font-family: Roboto-Bold;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .com-tl.left {
    font-size: 16px;
    padding-bottom: 15px;
    border-bottom-width: 2px;
  }
}

.iderDetailsBox1 .rt .meta-row {
  margin-bottom: 0.2rem;
  font-size: 0.2rem;
  color: #8d8d8d;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .meta-row {}
}

.iderDetailsBox1 .rt .meta-row .label {
  margin-right: 0.1rem;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .meta-row .label {}
}

.iderDetailsBox1 .rt .meta-row .value {
  color: #666;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .meta-row .value {}
}

.iderDetailsBox1 .rt .email-row {
  display: flex;
  align-items: center;
  margin-bottom: 0.28rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .email-row {}
}

.iderDetailsBox1 .rt .email-row .icon {
  width: 0.3rem;
  height: 0.3rem;
  margin-right: 0.12rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .email-row .icon {}
}

.iderDetailsBox1 .rt .email-row .icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .email-row .icon img {}
}

.iderDetailsBox1 .rt .email-row .mail {
  font-size: 0.28rem;
  line-height: 1.1;
  font-family: Roboto-SemiBold;
  color: #111;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .email-row .mail {}
}

.iderDetailsBox1 .rt .bottom {
  justify-content: flex-start;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox1 .rt .bottom {}
}

.iderDetailsBox22 {
  width: 100%;
  height: auto;
  padding: .625rem 0;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox22 {
    padding: 35px 0;
  }
}

.iderDetailsBox22 .com-tl{
  text-align: left;
  font-size: .375rem;
  font-family: Roboto-SemiBold;
  border-bottom: .0125rem solid #ddd;
  padding-bottom: .1875rem;
  margin-bottom: .1875rem;
}
@media screen and (max-width: 768px){
  .iderDetailsBox22 .com-tl{
    font-size: 20px;
    border-block-width: 1px;
    padding-bottom: 15px;
    margin-bottom: 15px;
  }
}
.iderDetailsBox22 .text p{
  font-size: .2rem;
  line-height: 2;
  margin-bottom: .125rem;
}

@media screen and (max-width: 768px){
  .iderDetailsBox22 .text p{
    font-size: 14px;
    margin-bottom: 10px;
  }
}

.iderDetailsBox3Item1 {
  width: 100%;
  height: auto;
  padding: 0.75rem 0 0.9rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item1 {}
}

.iderDetailsBox3Item1 .com-tl {
  font-size: .375rem;
  font-family: Roboto-SemiBold;
  border-bottom: .0125rem solid #ddd;
  padding-bottom: .1875rem;
  margin-bottom: .1875rem;
  text-align: left;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item1 .com-tl {
    font-size: 20px;
    border-block-width: 1px;
    padding-bottom: 15px;
    margin-bottom: 15px;
  }
}

.iderDetailsBox3Item1 .iderDetailsBox3Item1Swiper{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .25rem;
  margin-top: .25rem;
  margin-bottom: .625rem;
}
@media screen and (max-width: 768px){
  .iderDetailsBox3Item1 .iderDetailsBox3Item1Swiper{
    grid-template-columns:1fr;
    gap: 20px;
    margin-top: 25px;
    margin-bottom: 40px;
  }
}

.iderDetailsBox3Item1 .iderDetailsBox3Item1Swiper .swiper-slide-item .img{
  display: block;
  height: 3.125rem;
  border: .0125rem solid #ddd;
  padding: .125rem;
  overflow: hidden;
}
@media screen and (max-width: 768px){
  .iderDetailsBox3Item1 .iderDetailsBox3Item1Swiper .swiper-slide-item .img{
    height: 250px;
    border-width: 1px;
    padding: 10px;
  }
}

.iderDetailsBox3Item1 .iderDetailsBox3Item1Swiper .swiper-slide-item .img img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}



.iderDetailsBox3Item1 .iderDetailsBox3Item1Swiper .swiper-slide-item .name{
  margin-top: .1875rem;
  font-size: .2rem;
  line-height: .35rem;
  height: .35rem;
  overflow: hidden;
  text-align: center;
   display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media screen and (max-width: 768px){
  .iderDetailsBox3Item1 .iderDetailsBox3Item1Swiper .swiper-slide-item .name{
    margin-top: 15px;
    font-size: 14px;
    line-height: 25px;
    height: 25px;
  }
}


.iderDetailsBox3Item2 {
  width: 100%;
  height: auto;
  padding: 0.75rem 0;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item2 {}
}

.iderDetailsBox3Item2 ul {
  width: 100%;
  height: auto;
  margin-top: 0.5625rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item2 ul {}
}

.iderDetailsBox3Item2 ul li {
  width: 4.1625rem;
  height: 6.1rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.35rem 0.05rem rgba(101, 101, 101, 0.1);
  border-radius: 0.0125rem;
  margin: 0 0.275rem 0.25rem 0;
  padding: 0.075rem 0.125rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item2 ul li {}
}

.iderDetailsBox3Item2 li .img {
  width: 100%;
  height: 3.0875rem;
  overflow: hidden;
  border-radius: 0.0125rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item2 li .img {}
}

.iderDetailsBox3Item2 li .text {
  width: 100%;
  height: auto;
  padding: 0.1875rem 0.25rem 0.25rem;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item2 li .text {}
}

.iderDetailsBox3Item2 li .name {
  font-family: Roboto;
  font-size: 0.25rem;
  margin-bottom: 0.125rem;
  color: #272727;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item2 li .name {}
}

.iderDetailsBox3Item2 li .com-ls30 {
  color: #838383;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item2 li .com-ls30 {}
}

.iderDetailsBox3Item2 ul li:nth-child(4n) {
  margin-right: 0;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item2 ul li:nth-child(4n) {}
}

.iderDetailsBox3Item3 {
  width: 100%;
  height: auto;
  padding: 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item3 {}
}

.iderDetailsBox3Item3 .table {
  margin-top: 0.6875rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item3 .table {}
}

.iderDetailsBox3Item3 .table,
.iderDetailsBox3Item3 table {
  width: 100%;
  height: auto;
  overflow-y: auto;
}

@media screen and (max-width: 768px) {

  .iderDetailsBox3Item3 .table,
  .iderDetailsBox3Item3 table {}
}

.iderDetailsBox3Item3 table {
  border-radius: 1px;
  border: solid 1px #e5e5e5;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item3 table {}
}

.iderDetailsBox3Item3 table td {
  height: 0.75rem;
  background-color: #ffffff;
  border-bottom: solid 1px #e5e5e5;
  border-right: solid 1px #e5e5e5;
  font-size: 0.225rem;
  transition: all 0.3s;
  padding-left: 0.25rem;
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item3 table td {}
}

.iderDetailsBox3Item3 table tr:nth-child(2n) td {
  background-color: #f0f0f0;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item3 table tr:nth-child(2n) td {}
}

table tr:hover td {
  background-color: var(--bg-c) !important;
  color: #fff;
}

.iderDetailsBox3Item4 {
  width: 100%;
  height: auto;
  padding: 0.75rem 0 0.375rem 0;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item4 {}
}

.iderDetailsBox3Item4 .con {
  width: 100%;
  height: 6.65rem;
  margin-top: 0.5625rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item4 .con {}
}

.iderDetailsBox3Item4 .img {
  width: 10.1rem;
  height: 100%;
  overflow: hidden;
  box-shadow: 0px 0px 0.35rem 0.05rem rgba(101, 101, 101, 0.1);
  border-radius: 1px;
  margin-left: 0.1rem;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item4 .img {}
}

.iderDetailsBox3Item4 .text {
  flex: 1;
  height: 100%;
  padding: 0.5625rem 0.625rem 0.125rem 0.75rem;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.35rem 0.05rem rgba(101, 101, 101, 0.1);
  border-radius: 1px;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox3Item4 .text {}
}

.iderDetailsBox3Item4 .text li {
  font-size: 0.2rem;
  line-height: 0.375rem;
  color: #838383;
  padding-left: 0.3375rem;
  margin-bottom: 0.25rem;
  background: url(../images/im4-3.png) no-repeat;
  background-size: 0.225rem 0.1875rem;
  background-position-y: 0.125rem;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item4 .text li {}
}

.iderDetailsBox3Item4 .text li strong {
  color: var(--mainColor);
}

@media screen and (max-width: 768px) {
  .iderDetailsBox3Item4 .text li strong {}
}

.iderDetailsBox5 {
  width: 100%;
  height: auto;
  padding: 0.375rem 0 0.625rem 0;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox5 {}
}

.iderDetailsBox5 .vidoes {
  width: 100%;
  position: relative;
  height: auto;
  margin-top: 0.4375rem;
  overflow: hidden;
  height: auto;
  box-shadow: 0px 0px 0.35rem 0.05rem rgba(101, 101, 101, 0.1);
  border-radius: 1px;
  padding: 0.25rem;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox5 .vidoes {}
}

.iderDetailsBox5 .vidoes .icon {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 0.9875rem;
  cursor: pointer;
  height: 0.9875rem;
  object-fit: contain;
  transition: all 0.3s;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox5 .vidoes .icon {}
}

.iderSoluDelBox3.inner {
  border-bottom: none;
  padding-bottom: 0;
}

@media screen and (max-width: 768px) {
  .iderSoluDelBox3.inner {}
}

.iderDetailsBox6 {
  width: 100%;
  height: auto;
  padding: 0.625rem 0 0.875rem 0;
}


@media screen and (max-width: 768px) {
  .iderDetailsBox6 {}
}

.iderDetailsBox6 form {
  width: 100%;
  height: auto;
  margin-top: 0.5rem;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox6 form {}
}

.iderDetailsBox6 form .inputItem {
  grid-template-columns: repeat(auto-fit, minmax(5.625rem, 1fr));
  gap: 0.25rem 0.3rem;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox6 form .inputItem {}
}

.iderDetailsBox6 form input {
  width: 100% !important;
  height: 0.7rem !important;
  background-color: #f7f7f7 !important;
  border: solid 1px #e5e5e5 !important;
  font-size: 0.2rem !important;
  padding-left: 0.1875rem !important;
  color: #001421 !important;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox6 form input {}
}

.iderDetailsBox6 form textarea {
  width: 100% !important;
  height: 1.675rem !important;
  display: block !important;
  background-color: #f7f7f7 !important;
  border: solid 1px #e5e5e5 !important;
  font-size: 0.2rem !important;
  padding: 0.1875rem 0 0 0.1875rem !important;
  color: #001421 !important;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox6 form textarea {}
}

.iderDetailsBox6 form button[type="submit"] {
  display: flex !important;
  width: 2.9375rem !important;
  height: 0.75rem !important;
  cursor: pointer !important;
  background-color: var(--bg-c) !important;
  border-radius: 0.0625rem !important;
  font-size: 0.2rem !important;
  text-align: center !important;
  line-height: 0.75rem !important;
  color: #ffffff !important;
  margin: 0 auto !important;
  transition: all 0.3s !important;
  text-align: center !important;
  justify-content: center !important;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox6 form button[type="submit"] {}
}

.iderDetailsBox6 form .com-ls24 a {
  text-decoration: underline !important;
}

@media screen and (max-width: 768px) {
  .iderDetailsBox6 form .com-ls24 a {}
}

.system_more_news {
  width: 100%;
  padding-bottom: 1.25rem;
}

@media screen and (max-width: 768px) {
  .system_more_news {
    padding-bottom: 50px;
  }
}

.system_more_news_title {
  width: 100%;
  border-bottom: .0125rem solid #ddd;
  font-size: .3rem;
  line-height: 1.25;
  font-weight: 700;
  color: #000;
  padding-bottom: .25rem;
  margin-bottom: .25rem;
}

@media screen and (max-width: 768px) {
  .system_more_news_title {
    font-size: 24px;
    padding-bottom: 15px;
    margin-bottom: 15px;
  }
}

.system_more_news_list {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .375rem;
  margin-top: .375rem;
}

@media screen and (max-width: 768px) {
  .system_more_news_list {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 25px;
  }
}

.system_more_news_item {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .system_more_news_item {}
}

.system_more_news_img {
  display: block;
  width: 100%;
  height: 2.5rem;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .system_more_news_img {
    height: 250px;
  }
}

.system_more_news_list .system_more_news_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s;
}

@media screen and (max-width: 768px) {
  .system_more_news_img img {}
}

.system_more_news_item:hover .system_more_news_img img {
  transform: scale(1.04);
}

@media screen and (max-width: 768px) {
  .system_more_news_item:hover .system_more_news_img img {}
}

.system_more_news_name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  font-size: 0.2rem;
  line-height: .35rem;
  height: .7rem;
  color: #101520;
  margin-top: 0.14rem;
  font-weight: 700;
}

@media screen and (max-width: 768px) {
  .system_more_news_name {
    font-size: 14px;
    margin-top: 8px;
    line-height: 28px;
    height: 56px;
  }
}

.system_more_news_name:hover {
  color: #00adef;
}

@media screen and (max-width: 768px) {
  .system_more_news_name:hover {}
}


body .elementor-message{
  font-size: .2rem;
}

@media screen and (max-width: 768px){
  body .elementor-message{
    font-size: 14px;
  }
}

/* ========================================
   WordPress Editor Content Styles
   ======================================== */

/* Base Content Styles */
.entry-content,
.the-content,
.post-content,
.page-content {
    font-size: 16px;
    line-height: 1.8;
    color: #333;
}

/* Headings */
.entry-content h1,
.the-content h1,
.post-content h1,
.page-content h1 {
    font-size: 2.5em;
    font-weight: 700;
    line-height: 1.3;
    margin: 1.5em 0 0.8em;
    color: #1a1a1a;
}

.entry-content h2,
.the-content h2,
.post-content h2,
.page-content h2 {
    font-size: 2em;
    font-weight: 600;
    line-height: 1.4;
    margin: 1.4em 0 0.7em;
    color: #222;
    padding-bottom: 0.3em;
    border-bottom: 2px solid #eee;
}

.entry-content h3,
.the-content h3,
.post-content h3,
.page-content h3 {
    font-size: 1.6em;
    font-weight: 600;
    line-height: 1.5;
    margin: 1.3em 0 0.6em;
    color: #333;
}

.entry-content h4,
.the-content h4,
.post-content h4,
.page-content h4 {
    font-size: 1.3em;
    font-weight: 600;
    line-height: 1.5;
    margin: 1.2em 0 0.5em;
    color: #444;
}

.entry-content h5,
.the-content h5,
.post-content h5,
.page-content h5 {
    font-size: 1.1em;
    font-weight: 600;
    line-height: 1.6;
    margin: 1.1em 0 0.4em;
    color: #555;
}

.entry-content h6,
.the-content h6,
.post-content h6,
.page-content h6 {
    font-size: 0.9em;
    font-weight: 600;
    line-height: 1.6;
    margin: 1em 0 0.3em;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Paragraphs */
.entry-content p,
.the-content p,
.post-content p,
.page-content p {
    margin: 0 0 1.5em;
}

/* Links */
.entry-content a,
.the-content a,
.post-content a,
.page-content a {
    color: #6a93d4;
    text-decoration: none;
    transition: color 0.2s ease;
}

.entry-content a:hover,
.the-content a:hover,
.post-content a:hover,
.page-content a:hover {
    color: #0a2a5c;
    text-decoration: underline;
}

/* Images and Alignment */
.alignleft {
    float: left;
    margin: 0.5em 1.5em 1em 0;
}

.alignright {
    float: right;
    margin: 0.5em 0 1em 1.5em;
}

.aligncenter {
    display: block;
    margin: 1.5em auto;
    clear: both;
}

.alignnone {
    margin: 1.5em 0;
}

.wp-caption {
    max-width: 100%;
    margin: 1.5em 0;
}

.wp-caption img {
    display: block;
    margin: 0 auto;
}

.wp-caption-text {
    font-size: 0.9em;
    color: #666;
    text-align: center;
    margin-top: 0.5em;
    font-style: italic;
}

/* Image Sizes */
.entry-content img,
.the-content img,
.post-content img,
.page-content img {
    max-width: 100%;
    height: auto;
}

.size-thumbnail {
    max-width: 150px;
}

.size-medium {
    max-width: 300px;
}

.size-large {
    max-width: 1024px;
}

.size-full {
    max-width: 100%;
}

/* Lists */
.entry-content ul,
.the-content ul,
.post-content ul,
.page-content ul,
.entry-content ol,
.the-content ol,
.post-content ol,
.page-content ol {
    margin: 0 0 1.5em 1.5em;
    padding: 0;
}

.entry-content ul,
.the-content ul,
.post-content ul,
.page-content ul {
    list-style: disc;
}

.entry-content ol,
.the-content ol,
.post-content ol,
.page-content ol {
    list-style: decimal;
}

.entry-content li,
.the-content li,
.post-content li,
.page-content li {
    margin: 0.5em 0;
    padding-left: 0.3em;
}

/* Nested Lists */
.entry-content ul ul,
.the-content ul ul,
.post-content ul ul,
.page-content ul ul,
.entry-content ol ol,
.the-content ol ol,
.post-content ol ol,
.page-content ol ol,
.entry-content ul ol,
.the-content ul ol,
.post-content ul ol,
.page-content ul ol,
.entry-content ol ul,
.the-content ol ul,
.post-content ol ul,
.page-content ol ul {
    margin: 0.5em 0 0.5em 1.5em;
}

.entry-content ul ul,
.the-content ul ul,
.post-content ul ul,
.page-content ul ul {
    list-style: circle;
}

.entry-content ul ul ul,
.the-content ul ul ul,
.post-content ul ul ul,
.page-content ul ul ul {
    list-style: square;
}

/* Blockquote */
.entry-content blockquote,
.the-content blockquote,
.post-content blockquote,
.page-content blockquote {
    margin: 2em 0;
    padding: 1.5em 2em;
    border-left: 4px solid #00adef;
    background: #f9f9f9;
    font-style: italic;
}

.entry-content blockquote p,
.the-content blockquote p,
.post-content blockquote p,
.page-content blockquote p {
    margin: 0 0 1em;
}

.entry-content blockquote p:last-child,
.the-content blockquote p:last-child,
.post-content blockquote p:last-child,
.page-content blockquote p:last-child {
    margin-bottom: 0;
}

.entry-content blockquote cite,
.the-content blockquote cite,
.post-content blockquote cite,
.page-content blockquote cite {
    display: block;
    margin-top: 1em;
    font-size: 0.9em;
    font-style: normal;
    color: #666;
}

/* Code */
.entry-content code,
.the-content code,
.post-content code,
.page-content code {
    font-family: 'Courier New', Courier, monospace;
    font-size: 0.9em;
    padding: 0.2em 0.4em;
    background: #f5f5f5;
    border-radius: 3px;
}

.entry-content pre,
.the-content pre,
.post-content pre,
.page-content pre {
    margin: 1.5em 0;
    padding: 1.5em;
    background: #2d2d2d;
    color: #f8f8f2;
    overflow-x: auto;
    border-radius: 5px;
}

.entry-content pre code,
.the-content pre code,
.post-content pre code,
.page-content pre code {
    background: none;
    padding: 0;
    color: inherit;
}

/* Tables */
.entry-content table,
.the-content table,
.post-content table,
.page-content table {
    width: 100%;
    margin: 1.5em 0;
    border-collapse: collapse;
    border: 1px solid #ddd;
}

.entry-content th,
.the-content th,
.post-content th,
.page-content th,
.entry-content td,
.the-content td,
.post-content td,
.page-content td {
    padding: 0.8em 1em;
    border: 1px solid #ddd;
    text-align: left;
}

.entry-content th,
.the-content th,
.post-content th,
.page-content th {
    background: #f5f5f5;
    font-weight: 600;
}

.entry-content tr:nth-child(even),
.the-content tr:nth-child(even),
.post-content tr:nth-child(even),
.page-content tr:nth-child(even) {
    background: #fafafa;
}

/* Definition Lists */
.entry-content dl,
.the-content dl,
.post-content dl,
.page-content dl {
    margin: 1.5em 0;
}

.entry-content dt,
.the-content dt,
.post-content dt,
.page-content dt {
    font-weight: 600;
    margin-top: 1em;
}

.entry-content dd,
.the-content dd,
.post-content dd,
.page-content dd {
    margin: 0.5em 0 0 1.5em;
}

/* Horizontal Rule */
.entry-content hr,
.the-content hr,
.post-content hr,
.page-content hr {
    border: none;
    border-top: 1px solid #ddd;
    margin: 2em 0;
}

/* Text Formats */
.entry-content strong,
.the-content strong,
.post-content strong,
.page-content strong,
.entry-content b,
.the-content b,
.post-content b,
.page-content b {
    font-weight: 600;
}

.entry-content em,
.the-content em,
.post-content em,
.page-content em,
.entry-content i,
.the-content i,
.post-content i,
.page-content i {
    font-style: italic;
}

.entry-content strike,
.the-content strike,
.post-content strike,
.page-content strike,
.entry-content del,
.the-content del,
.post-content del,
.page-content del {
    text-decoration: line-through;
}

.entry-content ins,
.the-content ins,
.post-content ins,
.page-content ins {
    text-decoration: underline;
}

.entry-content sub,
.the-content sub,
.post-content sub,
.page-content sub {
    vertical-align: sub;
    font-size: smaller;
}

.entry-content sup,
.the-content sup,
.post-content sup,
.page-content sup {
    vertical-align: super;
    font-size: smaller;
}

/* Address */
.entry-content address,
.the-content address,
.post-content address,
.page-content address {
    font-style: normal;
    margin: 1.5em 0;
}

/* Gallery */
.gallery {
    margin: 1.5em 0;
}

.gallery-item {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 100%;
    margin: 0 0 1.5em;
}

.gallery-columns-2 .gallery-item {
    max-width: 50%;
}

.gallery-columns-3 .gallery-item {
    max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
    max-width: 25%;
}

.gallery-columns-5 .gallery-item {
    max-width: 20%;
}

.gallery-columns-6 .gallery-item {
    max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
    max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
    max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
    max-width: 11.11%;
}

.gallery-icon img {
    margin: 0 auto;
}

.gallery-caption {
    font-size: 0.9em;
    color: #666;
    margin-top: 0.5em;
}

/* More Link */
.more-link {
    display: inline-block;
    margin-top: 1em;
    padding: 0.5em 1.5em;
    background: #00adef;
    color: #fff;
    text-decoration: none;
    border-radius: 3px;
    transition: background 0.2s ease;
}

.more-link:hover {
    background: #0a2a5c;
    color: #fff;
    text-decoration: none;
}

/* Sticky Post */
.sticky {
    position: relative;
}

/* Password Protected */
.post-password-form {
    margin: 2em 0;
    padding: 2em;
    background: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.post-password-form label {
    display: block;
    margin-bottom: 0.5em;
}

.post-password-form input[type="password"] {
    width: 100%;
    max-width: 300px;
    padding: 0.5em;
    margin-bottom: 1em;
    border: 1px solid #ddd;
    border-radius: 3px;
}

.post-password-form input[type="submit"] {
    padding: 0.5em 1.5em;
    background: #00adef;
    color: #fff;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

/* Clearfix */
.entry-content:before,
.the-content:before,
.post-content:before,
.page-content:before,
.entry-content:after,
.the-content:after,
.post-content:after,
.page-content:after {
    content: "";
    display: table;
}

.entry-content:after,
.the-content:after,
.post-content:after,
.page-content:after {
    clear: both;
}

/* Responsive */
@media screen and (max-width: 768px) {
    .entry-content,
    .the-content,
    .post-content,
    .page-content {
        font-size: 15px;
    }
    
    .entry-content h1,
    .the-content h1,
    .post-content h1,
    .page-content h1 {
        font-size: 2em;
    }
    
    .entry-content h2,
    .the-content h2,
    .post-content h2,
    .page-content h2 {
        font-size: 1.6em;
    }
    
    .entry-content h3,
    .the-content h3,
    .post-content h3,
    .page-content h3 {
        font-size: 1.4em;
    }
    
    .alignleft,
    .alignright {
        float: none;
        margin: 1em auto;
        display: block;
    }
    
    .gallery-columns-2 .gallery-item,
    .gallery-columns-3 .gallery-item,
    .gallery-columns-4 .gallery-item,
    .gallery-columns-5 .gallery-item,
    .gallery-columns-6 .gallery-item,
    .gallery-columns-7 .gallery-item,
    .gallery-columns-8 .gallery-item,
    .gallery-columns-9 .gallery-item {
        max-width: 50%;
    }
}

@media screen and (max-width: 480px) {
    .gallery-columns-2 .gallery-item,
    .gallery-columns-3 .gallery-item,
    .gallery-columns-4 .gallery-item,
    .gallery-columns-5 .gallery-item,
    .gallery-columns-6 .gallery-item,
    .gallery-columns-7 .gallery-item,
    .gallery-columns-8 .gallery-item,
    .gallery-columns-9 .gallery-item {
        max-width: 100%;
    }
    
    .entry-content table,
    .the-content table,
    .post-content table,
    .page-content table {
        font-size: 0.9em;
    }
    
    .entry-content th,
    .the-content th,
    .post-content th,
    .page-content th,
    .entry-content td,
    .the-content td,
    .post-content td,
    .page-content td {
        padding: 0.5em;
    }
}


