.section {
  padding: 6.0416666667vw 0 7.8645833333vw; }
  .section .joke {
    width: 72.9166666667vw;
    margin: auto; }
    .section .joke .item {
      display: flex;
      width: 100%;
      margin-bottom: 3.8020833333vw; }
      .section .joke .item .item_text {
        width: 51%;
        padding-left: 3.90625vw;
        display: flex;
        flex-direction: column;
        justify-content: center;
        background: #F5F5F5;
        transition: 0.6s; }
        .section .joke .item .item_text h5 {
          font-size: 1.6666666667vw;
          font-weight: bold;
          color: #324299;
          line-height: 1;
          padding-bottom: 1.09375vw;
          border-bottom: 1px solid #CCCCCC;
          margin-bottom: 0.9375vw;
          transition: 0.6s; }
        .section .joke .item .item_text p {
          font-size: 0.8333333333vw;
          font-weight: 400;
          color: #333333;
          line-height: 1.6666666667vw;
          width: 28.6458333333vw;
          transition: 0.6s; }
        .section .joke .item .item_text:hover {
          background: #324299; }
          .section .joke .item .item_text:hover h5, .section .joke .item .item_text:hover p {
            color: #FFFFFF; }
      .section .joke .item .item_img {
        width: 51%;
        overflow: hidden; }
        .section .joke .item .item_img img {
          display: block;
          width: 100%;
          transition: 3s; }
        .section .joke .item .item_img:hover img {
          transform: scale(1.1); }
    .section .joke .item:nth-last-child(1) {
      margin-bottom: 0; }
    .section .joke .item:nth-child(2n) {
      flex-direction: row-reverse; }

/*# sourceMappingURL=field.css.map */
@media screen and (max-width: 1024px) {
  .section .joke {
    width: 90%;
  }
  .section .joke .item .item_text h5 {
    font-size: 24px;
  }
  .section .joke .item .item_text {
    padding: 0 30px;
  }
}
@media screen and (max-width: 768px) {
  .section .joke .item,.section .joke .item:nth-child(2n) {
    flex-direction: column-reverse;
  }
  .section .joke .item .item_text,.section .joke .item .item_img {
    width: 100%;
  }
  .section .joke .item .item_text h5 {
    font-size: 18px;
  }
  .section .joke .item .item_text {
    padding: 30px 20px;
  }
  .section .joke .item {
    margin-bottom: 30px;
  }
}
