@charset "UTF-8";
section {
  margin-top: 0; }

input[type="text"]:focus {
  outline: none; }

input::placeholder {
  color: #737B87;
  /* 默认的placeholder颜色 */ }

input::-webkit-input-placeholder {
  color: #737B87;
  /* Chrome, Safari, Opera */ }

input:-moz-placeholder {
  color: #737B87;
  /* Firefox 18- */
  opacity: 1;
  /* 修复老版本Firefox的不透明度问题 */ }

input::-moz-placeholder {
  color: #737B87;
  /* Firefox 19+ */
  opacity: 1;
  /* 修复新版本Firefox的不透明度问题 */ }

input:-ms-input-placeholder {
  color: #737B87;
  /* Internet Explorer, Edge */ }

.news_ttorial .banner {
  background: url(../img/newcenter/tutoral_banner_bg.webp) no-repeat center;
  height: 525px;
  width: 100%;
  background-size: cover;
  position: relative;
  z-index: 3; }
  .news_ttorial .banner h1 {
    font-family: SourceHanSansCN-Medium;
    font-size: 38px;
    color: #171A1F;
    text-align: center;
    box-sizing: border-box;
    padding-top: 172px;
    padding-bottom: 0;
    width: 100%; }
  .news_ttorial .banner .search_box {
    width: 701px;
    height: 72px;
    background: #FFFFFF;
    box-shadow: 0px 8px 25px 0px rgba(13, 10, 44, 0.06);
    border-radius: 60px;
    border: 1px solid #EFF0F6;
    margin: 40px auto 0;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-left: 35px;
    justify-content: space-between; }
    .news_ttorial .banner .search_box .left_s {
      display: flex;
      align-items: center; }
    .news_ttorial .banner .search_box .right_s {
      width: 116px;
      height: 48px;
      background: #0D0C3B;
      border-radius: 72px;
      position: relative;
      margin-right: 15px;
      text-align: center;
      line-height: 48px;
      font-weight: 600;
      font-size: 18px;
      color: #FFFFFF;
      cursor: pointer;
      z-index: 1; }
      .news_ttorial .banner .search_box .right_s::before {
        content: '';
        position: absolute;
        background: url(../img/newcenter/search_btn_bg.svg) no-repeat center;
        height: 108px;
        display: block;
        width: 200px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-size: 100% 100%;
        z-index: -1; }
    .news_ttorial .banner .search_box img {
      width: 22px;
      height: 22px; }
    .news_ttorial .banner .search_box input {
      margin-left: 10px;
      height: 65px;
      border: none !important;
      font-size: 18px;
      width: 70%;
      color: rgba(52, 64, 81, 0.69); }
  .news_ttorial .banner .classification {
    width: 100%;
    height: 147px;
    max-width: 1300px;
    box-shadow: 0px 6px 39px 0px #DEE5F8;
    border-radius: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -40px;
    z-index: -1; }
    .news_ttorial .banner .classification .illustration {
      position: absolute;
      width: 318px;
      height: 217px;
      right: -103px;
      top: -158px;
      z-index: -2; }
    .news_ttorial .banner .classification .classification_box {
      width: 100%;
      display: flex;
      align-items: center;
      position: absolute;
      left: 0;
      top: 0; }
      .news_ttorial .banner .classification .classification_box .fic_li {
        display: flex;
        align-items: center;
        justify-content: center;
        background: #FFFFFF;
        width: 25%;
        height: 147px;
        border-right: 1px solid #E2E9FF;
        cursor: pointer;
        position: relative;
        overflow: hidden; }
        .news_ttorial .banner .classification .classification_box .fic_li .li_icon {
          width: 84px;
          height: 84px; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li1 {
            background: url("../img/newcenter/li_icon1.svg") no-repeat center;
            background-size: 100% 100%; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li2 {
            background: url("../img/newcenter/li_icon2.svg") no-repeat center;
            background-size: 100% 100%; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li3 {
            background: url("../img/newcenter/li_icon3.png") no-repeat center;
            background-size: 100% 100%; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li4 {
            background: url("../img/newcenter/li_icon4.png") no-repeat center;
            background-size: 100% 100%; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li5 {
            background: url("../img/newcenter/li_icon5.svg") no-repeat center;
            background-size: 100% 100%; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li6 {
            background: url("../img/newcenter/li_icon6.svg") no-repeat center;
            background-size: 100% 100%; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li7 {
            background: url("../img/newcenter/li_icon7.png") no-repeat center;
            background-size: 100% 100%; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li8 {
            background: url("../img/newcenter/li_icon8.png") no-repeat center;
            background-size: 100% 100%; }
          .news_ttorial .banner .classification .classification_box .fic_li .li_icon.li_icon_hover {
            display: none; }
        .news_ttorial .banner .classification .classification_box .fic_li .li_tit {
          font-weight: 600;
          font-size: 18px;
          color: #171A1F;
          margin-left: 22px;
          text-align: left; }
        .news_ttorial .banner .classification .classification_box .fic_li .top_line {
          display: none;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 4px;
          background: linear-gradient(90deg, #1A73E8 0%, #1652EB 100%); }
        .news_ttorial .banner .classification .classification_box .fic_li:first-child {
          border-radius: 10px 0 0 10px; }
        .news_ttorial .banner .classification .classification_box .fic_li:last-child {
          border-right: none;
          border-radius: 0 10px 10px 0; }
        .news_ttorial .banner .classification .classification_box .fic_li:hover {
          height: 183px;
          border-radius: 10px;
          box-shadow: 0px 6px 39px 0px #DEE5F8; }
          .news_ttorial .banner .classification .classification_box .fic_li:hover .li_tit {
            color: #0D6CDD; }
          .news_ttorial .banner .classification .classification_box .fic_li:hover .li_icon {
            display: none; }
          .news_ttorial .banner .classification .classification_box .fic_li:hover .li_icon_hover {
            display: block; }
          .news_ttorial .banner .classification .classification_box .fic_li:hover .top_line {
            display: block; }
      .news_ttorial .banner .classification .classification_box:hover {
        transform: translateY(-18px); }
    .news_ttorial .banner .classification .wap_cl_fic {
      width: 95%;
      margin: 0 auto;
      display: none; }
      .news_ttorial .banner .classification .wap_cl_fic .line_wap {
        display: flex;
        align-items: center;
        justify-content: space-between; }
        .news_ttorial .banner .classification .wap_cl_fic .line_wap .card {
          width: 49%;
          height: 73px;
          background: #FFFFFF;
          box-shadow: 0 3px 19px 0 #DEE5F8;
          border-radius: 5px;
          display: flex;
          align-items: center;
          justify-content: flex-start;
          box-sizing: border-box;
          padding-left: 10px; }
          .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon {
            width: 35px;
            height: 35px; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li1 {
              background: url("../img/newcenter/li_icon1.svg") no-repeat center;
              background-size: 100% 100%; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li2 {
              background: url("../img/newcenter/li_icon2.svg") no-repeat center;
              background-size: 100% 100%; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li3 {
              background: url("../img/newcenter/li_icon3.png") no-repeat center;
              background-size: 100% 100%; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li4 {
              background: url("../img/newcenter/li_icon4.png") no-repeat center;
              background-size: 100% 100%; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li5 {
              background: url("../img/newcenter/li_icon5.svg") no-repeat center;
              background-size: 100% 100%; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li6 {
              background: url("../img/newcenter/li_icon6.svg") no-repeat center;
              background-size: 100% 100%; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li7 {
              background: url("../img/newcenter/li_icon7.png") no-repeat center;
              background-size: 100% 100%; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li8 {
              background: url("../img/newcenter/li_icon8.png") no-repeat center;
              background-size: 100% 100%; }
            .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_icon.li_icon_hover {
              display: none; }
          .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_tit {
            font-weight: 600;
            font-size: 15px;
            color: #171A1F;
            margin-left: 8px; }
        .news_ttorial .banner .classification .wap_cl_fic .line_wap:last-child {
          margin-top: 15px; }
.news_ttorial .cont_box {
  background-color: #F8F9FC;
  padding-top: 94px;
  padding-bottom: 95px; }
  .news_ttorial .cont_box .article_box {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto 0;
    background: #FFFFFF;
    box-shadow: 0px 1px 39px 0px rgba(222, 229, 248, 0.71);
    border-radius: 10px; }
    .news_ttorial .cont_box .article_box .art_box_top {
      height: 56px;
      border-bottom: 1px solid #EBEDF0;
      box-sizing: border-box;
      padding-left: 11px;
      padding-right: 19px;
      display: flex;
      align-items: center;
      justify-content: space-between; }
      .news_ttorial .cont_box .article_box .art_box_top .left_tit {
        display: flex;
        align-items: center; }
        .news_ttorial .cont_box .article_box .art_box_top .left_tit img {
          width: 20px;
          height: 20px; }
        .news_ttorial .cont_box .article_box .art_box_top .left_tit p {
          font-weight: 600;
          font-size: 16px;
          color: #171A1F;
          margin-left: 4px; }
      .news_ttorial .cont_box .article_box .art_box_top .right_more {
        display: flex;
        align-items: center; }
        .news_ttorial .cont_box .article_box .art_box_top .right_more p {
          font-weight: 400;
          font-size: 14px;
          color: #637083; }
        .news_ttorial .cont_box .article_box .art_box_top .right_more i {
          background: url(../img/newcenter/look_more.svg) no-repeat center;
          background-size: 100% 100%;
          width: 5px;
          height: 10px;
          margin-left: 9px; }
    .news_ttorial .cont_box .article_box .art_title_box {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      box-sizing: border-box;
      padding-left: 60px;
      padding-right: 20px;
      padding-top: 34px;
      padding-bottom: 10px; }
      .news_ttorial .cont_box .article_box .art_title_box .art_tit {
        width: 210px;
        font-weight: 400;
        font-size: 14px;
        color: #4F5257;
        position: relative;
        text-align: left;
        padding-left: 20px;
        margin-right: 90px;
        margin-bottom: 23px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap; }
        .news_ttorial .cont_box .article_box .art_title_box .art_tit::before {
          content: "";
          width: 4px;
          height: 4px;
          position: absolute;
          background: #4F5257;
          border-radius: 10px;
          top: 50%;
          transform: translateY(-50%);
          left: 10px; }
        .news_ttorial .cont_box .article_box .art_title_box .art_tit:nth-child(4n) {
          margin-right: 0; }
    .news_ttorial .cont_box .article_box .plate {
      margin: 25px 0;
      border-bottom: 1px dashed #EBEDF0; }
      .news_ttorial .cont_box .article_box .plate .plate_top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        box-sizing: border-box;
        padding-right: 19px;
        padding-left: 35px; }
        .news_ttorial .cont_box .article_box .plate .plate_top .plate_tit {
          font-family: SourceHanSansCN-Medium;
          font-size: 14px;
          color: #171A1F; }
        .news_ttorial .cont_box .article_box .plate .plate_top .right_more {
          display: flex;
          align-items: center; }
          .news_ttorial .cont_box .article_box .plate .plate_top .right_more p {
            font-weight: 400;
            font-size: 14px;
            color: #637083; }
          .news_ttorial .cont_box .article_box .plate .plate_top .right_more i {
            background: url(../img/newcenter/look_more.svg) no-repeat center;
            background-size: 100% 100%;
            width: 5px;
            height: 10px;
            margin-left: 9px; }
      .news_ttorial .cont_box .article_box .plate:last-child {
        border-bottom: none;
        margin-bottom: 0; }
  .news_ttorial .cont_box .must {
    margin-top: 38px; }
    .news_ttorial .cont_box .must .art_title_box {
      padding-top: 25px; }

@media (max-width: 1500px) {
  .news_ttorial .banner .classification .illustration {
    right: 0px; } }
@media (max-width: 1269px) {
  .news_ttorial .cont_box .article_box .art_title_box .art_tit:nth-child(4n) {
    margin-right: 90px; }
  .news_ttorial .cont_box .article_box .art_title_box .art_tit:nth-child(3n) {
    margin-right: 0; } }
@media (max-width: 1100px) {
  .news_ttorial .banner .classification .classification_box .fic_li .li_icon {
    width: 50px;
    height: 50px; }
  .news_ttorial .banner .classification .classification_box .fic_li .li_tit {
    font-size: 15px; } }
@media (max-width: 949px) {
  .news_ttorial .cont_box .article_box .art_title_box .art_tit:nth-child(3n) {
    margin-right: 90px; }
  .news_ttorial .cont_box .article_box .art_title_box .art_tit:nth-child(2n) {
    margin-right: 0; } }
@media (max-width: 755px) {
  .news_ttorial .banner h1 {
    font-size: 28px; }
  .news_ttorial .banner .search_box {
    width: 87%; }
    .news_ttorial .banner .search_box .right_s::before {
      display: none; } }
@media (max-width: 700px) {
  .news_ttorial .banner {
    height: 490px; }
    .news_ttorial .banner .classification {
      bottom: -28px; }
      .news_ttorial .banner .classification .classification_box {
        display: none; }
      .news_ttorial .banner .classification .illustration {
        width: 169px;
        height: 118px;
        top: -81px; }
      .news_ttorial .banner .classification .wap_cl_fic {
        display: block; } }
@media (max-width: 629px) {
  .news_ttorial .cont_box .article_box .art_title_box {
    padding-left: 20px; }
    .news_ttorial .cont_box .article_box .art_title_box .art_tit {
      width: 230px;
      margin-right: 0; }
      .news_ttorial .cont_box .article_box .art_title_box .art_tit:nth-child(3n) {
        margin-right: 0; } }
@media (max-width: 450px) {
  .news_ttorial .banner {
    height: 420px; }
    .news_ttorial .banner h1 {
      padding-top: 140px; }
    .news_ttorial .banner .search_box {
      height: 50px;
      margin-top: 17px; }
      .news_ttorial .banner .search_box input {
        height: 40px;
        font-size: 16px; }
      .news_ttorial .banner .search_box .right_s {
        width: 85px;
        height: 36px;
        line-height: 36px;
        margin-right: 8px;
        font-size: 16px; }
    .news_ttorial .banner .classification {
      bottom: -35px; }
  .news_ttorial .cont_box {
    padding-top: 85px;
    padding-bottom: 25px; } }
@media (max-width: 400px) {
  .news_ttorial .banner {
    height: 451px; }
    .news_ttorial .banner h1 {
      font-size: 28px; }
    .news_ttorial .banner .classification {
      bottom: -9px; }
      .news_ttorial .banner .classification .wap_cl_fic .line_wap .card {
        height: 80px;
        flex-direction: column;
        justify-content: center; }
        .news_ttorial .banner .classification .wap_cl_fic .line_wap .card .li_tit {
          margin-left: 0;
          margin-top: 5px; }
  .news_ttorial .cont_box {
    padding-top: 67px; }
    .news_ttorial .cont_box .must {
      margin-top: 30px; } }