* {
  box-sizing: border-box; }

.container {
  padding: 0 8.33333vw;
  padding-bottom: 5.20833vw;
  position: relative;
  min-height: 29.01041vw; }
  @media screen and (max-width: 750px) {
    .container {
      min-height: 112vw;
      padding: 0;
      padding-bottom: 0; } }
  .container .bg {
    position: absolute;
    left: 50%;
    width: 63.74999vw;
    margin-left: -31.87499vw;
    top: -3.28125vw;
    z-index: -1; }
    @media screen and (max-width: 750px) {
      .container .bg {
        top: -6.13333vw;
        left: 50%;
        transform: translateX(-50%);
        width: 89.33333vw;
        margin-left: 0; } }
  .container .selectRow {
    margin-bottom: 2.08333vw; }
    @media screen and (max-width: 750px) {
      .container .selectRow {
        margin-bottom: 4vw; } }
    .container .selectRow .selectBox {
      width: 16.66666vw;
      height: 3.125vw;
      display: flex;
      flex-direction: row;
      align-items: center;
      position: relative;
      background-color: #fff;
      padding-left: 1.04166vw; }
      @media screen and (max-width: 750px) {
        .container .selectRow .selectBox {
          width: 89.33333vw;
          height: 10.66666vw;
          margin: 0 auto;
          padding: 0 4vw; } }
      .container .selectRow .selectBox .icon {
        width: 1.04166vw;
        height: 1.04166vw;
        margin-right: 0.41666vw; }
        @media screen and (max-width: 750px) {
          .container .selectRow .selectBox .icon {
            width: 3.73333vw;
            height: 3.73333vw;
            margin-right: 2.66666vw; } }
      .container .selectRow .selectBox .arr {
        position: absolute;
        right: 1.04166vw;
        width: 0.83333vw;
        height: 0.83333vw; }
        @media screen and (max-width: 750px) {
          .container .selectRow .selectBox .arr {
            top: 50%;
            right: 4vw;
            transform: translateY(-50%);
            width: 2.13333vw;
            height: 2.13333vw; } }
  .container .listBox {
    overflow: hidden;
    height: auto; }
    @media screen and (max-width: 750px) {
      .container .listBox {
        width: 89.33333vw;
        margin: 0 auto; } }
    .container .listBox .part {
      float: left;
      margin-right: 2.60416vw;
      margin-bottom: 2.60416vw;
      width: 25.5vw;
      height: 11.14583vw;
      display: flex;
      flex-direction: column;
      padding-left: 1.5625vw;
      padding-top: 2.08333vw;
      background-color: #fff; }
      @media screen and (max-width: 750px) {
        .container .listBox .part {
          float: initial;
          width: 100%;
          height: auto;
          padding: 5.33333vw 4vw;
          margin-bottom: 4vw; }
          .container .listBox .part:last-child {
            margin-bottom: 0; } }
      .container .listBox .part:nth-child(3n) {
        margin-right: 0; }
      .container .listBox .part h2 {
        margin-bottom: 1.04166vw; }
        @media screen and (max-width: 750px) {
          .container .listBox .part h2 {
            margin-bottom: 4vw; } }
      .container .listBox .part .row {
        display: flex;
        flex-direction: row;
        align-items: center;
        margin-bottom: 0.83333vw; }
        @media screen and (max-width: 750px) {
          .container .listBox .part .row {
            margin-bottom: 4vw; } }
        .container .listBox .part .row .icon {
          width: 0.83333vw;
          height: 0.83333vw;
          margin-right: 0.52083vw; }
          @media screen and (max-width: 750px) {
            .container .listBox .part .row .icon {
              width: 3.2vw;
              height: 3.2vw;
              margin-right: 1.33333vw; } }

.loadMore {
  margin: 0 auto;
  width: 10.41666vw;
  height: 3.33333vw;
  background: linear-gradient(90deg, #19b7ff 0%, #0097e0 100%);
  color: #fff;
  font-size: 0.83333vw;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 3vw; }
  @media screen and (min-width: 750px) {
    .loadMore:hover .arr {
      margin-left: 1.5625vw; } }
  @media screen and (max-width: 750px) {
    .loadMore {
      width: 26.66666vw;
      height: 8.53333vw;
      font-size: 2.93333vw;
      line-height: 8.53333vw;
      margin: 10.66666vw auto 13.33333vw; } }
  .loadMore .arr {
    display: block;
    width: 0.83333vw;
    height: 0.83333vw;
    margin-left: 1.04166vw;
    transition: all 0.2s linear; }
    @media screen and (max-width: 750px) {
      .loadMore .arr {
        width: 2.66666vw;
        height: 2.66666vw;
        margin-left: 1.33333vw; } }

.hasDrop {
  cursor: pointer; }
  .hasDrop ul {
    width: 100%;
    height: auto;
    position: absolute;
    left: 0;
    top: 3.20833vw;
    z-index: 3;
    background-color: #fff;
    box-shadow: 10px 10px 10px #ddd;
    max-height: 12.5vw;
    overflow-y: auto;
    display: none; }
    @media screen and (max-width: 750px) {
      .hasDrop ul {
        top: 10.66666vw;
        max-height: 21.5vw; } }
    .hasDrop ul li {
      width: 100%;
      height: 2.08333vw;
      line-height: 2.08333vw;
      padding-left: 1.04166vw;
      cursor: pointer; }
      @media screen and (max-width: 750px) {
        .hasDrop ul li {
          height: 8vw;
          line-height: 8vw;
          padding-left: 2vw; } }
      .hasDrop ul li:hover {
        font-weight: bold; }