html,
body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  min-width: 1024px;
  max-width: 1920px;
  margin: 0 auto;
  background-color: #f7f7f7;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	
}
/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
@font-face {
  font-family: 'myFont';
  font-weight: 500;
  src: url("//at.alicdn.com/wf/webfont/ADSAvCYaJFKZ/lYBtFAIfpSlR.woff2") format("woff2"), url("//at.alicdn.com/wf/webfont/ADSAvCYaJFKZ/B78Xrdfpuhq7.woff") format("woff");
  font-display: swap;
}
.margin_none {
  margin: 0 !important;
}
button {
  cursor: pointer;
}
.card {
  padding: 1.5rem 10%;
  background-color: #f7f7f7;
}
.card .card_title {
  text-align: center;
  margin-bottom: 0.75rem;
  font-weight: 600;
}
.card .card_title .tit {
  font-size: 0.375rem;
}
.card .card_title .txt {
  font-size: 0.325rem;
  color: #bebebe;
  margin-top: 0.1625rem;
}
.header {
  position: fixed;
  top: 0;
  z-index: 5;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1920px;
  height: 1.75rem;
  background-color: #003366;
  padding: 0 10%;
  box-sizing: border-box;
}
.header .logo {
  width: 9.3875rem;
  height: 0.975rem;
}
.header .phone {
  width: 4.1875rem;
  height: 0.9375rem;
}
.switch {
  width: 100%;
  height: 8.125rem;
  position: relative;
}
.switch .swi_item {
  width: 100%;
  height: 100%;
}
.switch .switch_dian {
  position: absolute;
  bottom: 0.3125rem;
  left: 50%;
  transform: translate(-50%, 0%);
  display: flex;
}
.switch .switch_dian .dian_item {
  width: 0.2rem;
  height: 0.2rem;
  border-radius: 0.1rem;
  background-color: #585858;
  margin: 0 0.1125rem;
  transition: 0.2s;
}
.switch .switch_dian .active {
  margin: 0 0.0625rem;
  width: 0.625rem;
}
.card1 .card1_msg {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.card1 .card1_msg .card1_item {
  cursor: pointer;
  text-align: center;
  border: 1px solid #f7f7f7;
  margin-bottom: 0.75rem;
  position: relative;
}
.card1 .card1_msg .card1_item .card1_img {
  width: 5.5rem;
  height: 5.5rem;
  overflow: hidden;
}
.card1 .card1_msg .card1_item .card1_img img {
  width: 100%;
  height: 100%;
  transition: 0.2s;
}
.card1 .card1_msg .card1_item .card1_cont {
  width: 5.5rem;
  height: 0.675rem;
  background-color: #f0f0f0;
  color: #252525;
  font-size: 0.225rem;
  line-height: 0.675rem;
}
.card1 .card1_msg .card1_item .act_hover {
  position: absolute;
  display: none;
  left: 1.6375rem;
  top: 1.275rem;
  color: #fff;
}
.card1 .card1_msg .card1_item .act_hover .act_cont {
  width: 2.225rem;
  height: 2.225rem;
  background-color: rgba(37, 37, 37, 0.6);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.card1 .card1_msg .card1_item .act_hover .act_cont .txt {
  font-size: 0.25rem;
}
.card1 .card1_msg .card1_item .act_hover .act_cont .btn {
  font-size: 0.175rem;
  margin-top: 0.15rem;
}
.card1 .card1_msg .card1_item:hover {
  border: 1px solid #003366;
}
.card1 .card1_msg .card1_item:hover .card1_img img {
  margin: -5% 0 0 -10%;
  width: 120%;
  height: 120%;
}
.card1 .card1_msg .card1_item:hover .card1_cont {
  background-color: #003366;
  color: #fff;
}
.card1 .card1_msg .card1_item:hover .act_hover {
  display: block;
}
.card2 {
  background: url(../img/back1.webp) 100% 100%;
}
.card2 .card2_msg {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.card2 .card2_msg .card2_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #fff;
  width: 3.125rem;
  margin-bottom: 0.6875rem;
}
.card2 .card2_msg .card2_item .card2_img {
  width: 1.375rem;
  height: 1.5875rem;
}
.card2 .card2_msg .card2_item .card2_img img {
  width: 100%;
  height: 100%;
}
.card2 .card2_msg .card2_item .tit {
  font-size: 0.225rem;
  font-weight: 700;
  margin-top: 20px;
}
.card2 .card2_msg .card2_item .txt {
  font-size: 0.15rem;
  margin-top: 0.125rem;
}
.card3 .card3_msg {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.card3 .card3_msg .card3_item {
  cursor: pointer;
  margin-bottom: 0.5rem;
}
.card3 .card3_msg .card3_item .card3_img {
  width: 4.375rem;
  height: 2.6875rem;
  position: relative;
  overflow: hidden;
}
.card3 .card3_msg .card3_item .card3_img img {
  width: 100%;
  height: 100%;
  transition: 0.2s;
}
.card3 .card3_msg .card3_item .card3_img .card3_cont {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 0.35rem;
  width: 100%;
  color: #fff;
  font-size: 0.225rem;
  text-align: center;
  line-height: 0.35rem;
  background-color: rgba(37, 37, 37, 0.75);
}
.card3 .card3_msg .card3_item:hover .card3_img img {
  margin: -10% 0 0 -10%;
  width: 120%;
  height: 120%;
}
.card3 .card3_msg .card3_item:hover .card3_cont {
  background-color: rgba(255, 147, 0, 0.75);
}
.card4 {
  background: url(../img/back2.webp) 100% 100%;
}
.card4 .card4_msg {
  display: flex;
  justify-content: space-between;
}
.card4 .card4_msg .card4_item {
  cursor: pointer;
  background: #fff;
  width: 2.6625rem;
  height: 2.7375rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.card4 .card4_msg .card4_item .card4_img {
  max-width: 0.5625rem;
  max-height: 0.5625rem;
}
.card4 .card4_msg .card4_item .card4_imgs {
  display: none;
  max-width: 0.5625rem;
  max-height: 0.5625rem;
}
.card4 .card4_msg .card4_item .card4_tit {
  font-size: 0.225rem;
  font-weight: 700;
  margin-top: 0.225rem;
}
.card4 .card4_msg .card4_item .card4_txt {
  font-size: 0.15rem;
  color: #8b8b8b;
  margin-top: 0.075rem;
}
.card4 .card4_msg .card4_item .card4_img_b {
  width: 0.8375rem;
  height: 0.2625rem;
  margin-top: 0.25rem;
}
.card4 .card4_msg .card4_item .card4_img_bs {
  display: none;
  width: 0.8375rem;
  height: 0.2625rem;
  margin-top: 0.25rem;
}
.card4 .card4_msg .card4_item:hover {
  background-color: #ff9300;
  color: #fff;
}
.card4 .card4_msg .card4_item:hover .card4_txt {
  color: #fff;
}
.card4 .card4_msg .card4_item:hover .card4_img_b {
  display: none;
}
.card4 .card4_msg .card4_item:hover .card4_img_bs {
  display: block;
}
.card4 .card4_msg .card4_item:hover .card4_img {
  display: none;
}
.card4 .card4_msg .card4_item:hover .card4_imgs {
  display: block;
}
.card5 .card5_msg {
  display: flex;
  justify-content: space-between;
}
.card5 .card5_msg .card5_item {
  cursor: pointer;
  border: 1px solid #f7f7f7;
}
.card5 .card5_msg .card5_item .card5_img {
  width: 5.625rem;
  height: 3.425rem;
}
.card5 .card5_msg .card5_item .card5_img img {
  width: 100%;
  height: 100%;
}
.card5 .card5_msg .card5_item .card5_cont {
  width: 5.625rem;
  padding: 0.3rem;
  box-sizing: border-box;
  background-color: #fff;
}
.card5 .card5_msg .card5_item .card5_cont .card5_tit {
  font-size: 0.225rem;
  font-weight: 600;
}
.card5 .card5_msg .card5_item .card5_cont .card5_txt {
  font-size: 0.175rem;
  line-height: 0.35rem;
  margin: 0.2rem 0 0.4375rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  /* 根据业务需求设置第几行显示省略号 */
  overflow: hidden;
}
.card5 .card5_msg .card5_item .card5_cont .card5_btn {
  text-align: center;
}
.card5 .card5_msg .card5_item .card5_cont .card5_btn button {
  width: 1.5625rem;
  height: 0.425rem;
  background-color: #fff;
  border: 1px solid #8b8b8b;
  font-size: 0.15rem;
}
.card5 .card5_msg .card5_item:hover {
  border: 1px solid #123262;
}
.card5 .card5_msg .card5_item:hover button {
  background-color: #123262 !important;
  color: #fff !important;
}
.foot {
  background-color: #003366;
  width: 100%;
  height: 4rem;
  padding: 0 10%;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.foot .foot_lef {
  width: 5.425rem;
  height: 1.625rem;
}
.foot .foot_lef img {
  width: 100%;
  height: 100%;
}
.foot .foot_rig {
  display: flex;
  align-items: center;
  color: #fff;
}
.foot .foot_rig .foot_rig_msg1 {
  margin-right: 0.75rem;
  font-family: 'myFont';
  font-size: 0.2rem;
}
.foot .foot_rig .foot_rig_msg1 div {
  margin: 10px 0;
}
.foot .foot_rig .foot_rig_img {
  width: 1.575rem;
  font-size: 0.2rem;
  color: #fff;
  font-weight: 600;
  text-align: center;
}
.foot .foot_rig .foot_rig_img img {
  width: 1.575rem;
  height: 1.575rem;
  margin-bottom: 0.25rem;
}
.floot {
  position: fixed;
  right: 50px;
  bottom: 2.5rem;
  z-index: 5;
  font-size: 0.2rem;
}
.floot div {
  cursor: pointer;
  background-color: #fff;
  width: 1.25rem;
  height: 1.25rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 0.0125rem;
}
.floot div .floot1_img {
  display: none;
  width: 0.625rem;
  height: 0.625rem;
}
.floot div .floot1_imgs {
  width: 0.625rem;
  height: 0.625rem;
}
.floot div:hover {
  background-color: #ff9300;
  color: #fff;
}
.floot div:hover .floot1_img {
  display: block;
}
.floot div:hover .floot1_imgs {
  display: none;
}
.floot .floot2 {
  position: relative;
}
.floot .floot2 .iphone {
  position: absolute;
  width: 1.875rem;
  height: 1.25rem;
  padding: 0 0.25rem;
  left: -2.625rem;
  top: 0;
  background-color: #fff;
  color: #000;
  border-radius: 0.0875rem;
  display: none;
  border: 1px solid #e7e8e9;
  font-size: 0.225rem;
  text-align: center;
}
.floot .floot2 .iphone span {
  display: inline-block;
  width: 100%;
  font-size: 0.15rem;
  margin: 0.25rem 0 0.125rem 0;
}
.floot .floot2 .sj {
  width: 0.125rem;
  height: 0.125rem;
  background-color: #ffffff;
  position: absolute;
  transform: rotate(45deg);
  right: -0.075rem;
  top: 0.5rem;
  border-top: 1px solid #e7e8e9;
  border-right: 1px solid #e7e8e9;
}
.floot .floot2:hover .iphone {
  display: block;
}
.popup {
  display: none;
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
}
.popup .pop_from {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 6;
  width: 60vw;
  background-color: #fff;
  border-radius: 0.125rem;
  padding: 0.5rem;
  box-sizing: border-box;
}
.popup .pop_from .pop_tit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.3rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.popup .pop_from .pop_tit img {
  width: 0.3125rem;
  height: 0.3125rem;
  cursor: pointer;
}
.popup .pop_from .pop_list .pop_item {
  margin-bottom: 0.5rem;
}
.popup .pop_from .pop_list .pop_item .pop_name {
  font-size: 0.225rem;
  margin-bottom: 0.125rem;
  opacity: 0.7;
}
.popup .pop_from .pop_list .pop_item .rules {
  position: relative;
}
.popup .pop_from .pop_list .pop_item .rules::before {
  content: "请输入姓名";
  position: absolute;
  top: 1.125rem;
  left: 0;
  color: red;
  font-size: 0.2rem;
}
.popup .pop_from .pop_list .pop_item .rules1 {
  position: relative;
}
.popup .pop_from .pop_list .pop_item .rules1::before {
  content: "请输入手机号";
  position: absolute;
  top: 1.125rem;
  left: 0;
  color: red;
  font-size: 0.2rem;
}
.popup .pop_from .pop_list .pop_item .must::after {
  content: "*";
  color: red;
  margin-left: 0.0625rem;
}
.popup .pop_from .pop_list .pop_item input {
  width: 100%;
  border: 1px solid #dfdff1;
  outline-style: none;
  padding: 10px;
  box-sizing: border-box;
  border-radius: 10px;
}
.popup .pop_from .pop_list .pop_item textarea {
  width: 100%;
  border: 1px solid #dfdff1;
  height: 2.5rem;
  padding: 10px;
  outline-style: none;
  box-sizing: border-box;
  border-radius: 10px;
  resize: none;
}
.popup .pop_from .pop_list .item_flex {
  display: flex;
  justify-content: space-between;
}
.popup .pop_from .pop_list .item_flex .pop_item {
  width: calc(50% - 0.25rem);
}
.popup .pop_from .pop_btn {
  text-align: center;
}
.popup .pop_from .pop_btn button {
  background-color: #003366;
  color: #fff;
  width: 1.875rem;
  height: 0.625rem;
  border: 0;
}
@media screen and (max-width: 1024px) {
  html {
    font-size: 42px !important;
  }
}
@media screen and (min-width: 1920px) {
  html {
    font-size: 80px !important;
  }
}