#news_continar {
  padding: 110px 15px 40px;
  width: 1030px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap; }

.news_content {
  width: 80%; }

.news_li {
  padding-bottom: 30px; }
  .news_li li {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e4e4e4; }
    .news_li li:first-child {
      padding-top: 0; }
    .news_li li a {
      display: block; }
      .news_li li a span {
        display: inline-block; }
        .news_li li a span.date {
          color: #898989;
          font-size: 14px;
          font-size: 1.4rem;
          padding-right: 1em; }
        .news_li li a span.cat {
          background-color: #e7e6e6;
          border: 1px solid #c2c2c2;
          border-radius: 13px;
          text-align: center;
          width: 100px;
          font-size: 13px;
          font-size: 1.3rem;
          padding: 5px 0; }
        .news_li li a span.news_txt {
          font-size: 15px;
          font-size: 1.5rem;
          padding-left: 18px; }

.detai {
  padding-bottom: 200px;
  border-bottom: 2px solid #e4e4e4;
  font-size: 14px;
  font-size: 1.4rem; }
  .detai .date_cat span {
    display: inline-block; }
    .detai .date_cat span.date {
      color: #898989;
      font-size: 14px;
      font-size: 1.4rem;
      padding-right: 1em; }
    .detai .date_cat span.cat {
      background-color: #e7e6e6;
      border: 1px solid #c2c2c2;
      border-radius: 13px;
      text-align: center;
      width: 100px;
      font-size: 13px;
      font-size: 1.3rem;
      padding: 5px 0; }
  .detai .ttl {
    font-size: 22px;
    font-size: 2.2rem;
    padding-top: 30px;
    padding-bottom: 30px; }
  .detai p {
    line-height: 2;
    padding-bottom: 40px; }
  .detai a {
    color: #002c78;
    text-decoration: underline; }

.pagenavi {
  margin-top: 30px;
  position: relative;
  text-align: center;
  font-size: 15px;
  font-size: 1.5rem; }
  .pagenavi .pagenavi-prev {
    position: absolute;
    left: 0; }
  .pagenavi .pagenavi-next {
    position: absolute;
    right: 0; }

.news_side {
  margin-left: auto;
  width: 13%; }
  .news_side h4 {
    font-weight: 500;
    padding-bottom: 25px;
    line-height: 1; }
  .news_side ul {
    padding-bottom: 70px; }
    .news_side ul li {
      padding-bottom: 1em;
      transition: all .3s; }
      .news_side ul li a {
        font-size: 14px;
        font-size: 1.4rem;
        position: relative;
        padding-left: 20px; }
        .news_side ul li a:before {
          content: "";
          background: url(../images/common/arrow-blue.png) 0 0 no-repeat;
          background-size: 100% auto;
          width: 9px;
          height: 15px;
          position: absolute;
          left: 0;
          top: 50%;
          -webkit-transform: translate(0%, -50%);
          transform: translate(0%, -50%); }
      .news_side ul li:hover {
        padding-left: 5px; }

@media screen and (max-width: 750px) {
  #news_continar {
    padding: calc(85 / 750 * 100vw) calc(60 / 750 * 100vw) calc(160 / 750 * 100vw);
    width: 100%; }

  .news_content {
    width: 1000%;
    order: 2; }

  .news_li {
    padding-bottom: calc(40 / 750 * 100vw); }
    .news_li li {
      padding: calc(25 / 750 * 100vw); }
      .news_li li a span.date {
        font-size: calc(20 / 750 * 100vw); }
      .news_li li a span.cat {
        border-radius: calc(15 / 750 * 100vw);
        width: calc(130 / 750 * 100vw);
        font-size: calc(20 / 750 * 100vw);
        padding: calc(8 / 750 * 100vw) 0; }
      .news_li li a span.news_txt {
        font-size: calc(25 / 750 * 100vw);
        padding-left: 0;
        display: block;
        line-height: 1.56;
        padding-top: calc(8 / 750 * 100vw); }

  .detai {
    padding-bottom: calc(80 / 750 * 100vw);
    font-size: calc(25 / 750 * 100vw); }
    .detai .date_cat span.date {
      font-size: calc(20 / 750 * 100vw); }
    .detai .date_cat span.cat {
      border-radius: calc(15 / 750 * 100vw);
      width: calc(130 / 750 * 100vw);
      font-size: calc(20 / 750 * 100vw);
      padding: calc(8 / 750 * 100vw) 0; }
    .detai .ttl {
      font-size: calc(35 / 750 * 100vw);
      line-height: 1.5;
      padding-top: calc(30 / 750 * 100vw);
      padding-bottom: calc(50 / 750 * 100vw); }
    .detai p {
      line-height: 1.6;
      padding-bottom: calc(40 / 750 * 100vw); }

  .pagenavi {
    margin-top: calc(45 / 750 * 100vw);
    font-size: calc(23 / 750 * 100vw); }

  .news_side {
    order: 1;
    width: 100%;
    padding-bottom: calc(50 / 750 * 100vw);
    overflow: hidden; }
    .news_side:after {
      clear: both; }
    .news_side .news_side_block {
      width: calc(290 / 750 * 100vw);
      border: 1px solid #dcdcdc;
      border-radius: calc(23 / 750 * 100vw);
      float: left; }
      .news_side .news_side_block:last-of-type {
        float: right; }
    .news_side h4 {
      width: 100%;
      padding: calc(10 / 750 * 100vw) calc(30 / 750 * 100vw);
      line-height: 1;
      font-size: calc(23 / 750 * 100vw);
      position: relative; }
      .news_side h4:after {
        content: "";
        width: calc(20 / 750 * 100vw);
        height: calc(12 / 750 * 100vw);
        background: url(../images/common/arrow_down.png) 0 0 no-repeat;
        background-size: 100% auto;
        position: absolute;
        top: 50%;
        right: calc(20 / 750 * 100vw);
        -webkit-transform: translate(0%, -50%);
        transform: translate(0%, -50%); }
      .news_side h4.open:after {
        -webkit-transform: translate(0%, -50%) rotate(180deg);
        transform: translate(0%, -50%) rotate(180deg); }
    .news_side ul {
      display: none;
      padding-bottom: 0;
      padding: calc(20 / 750 * 100vw); }
      .news_side ul li {
        padding: 0.5em 0; }
        .news_side ul li a {
          font-size: calc(23 / 750 * 100vw);
          padding-left: calc(30 / 750 * 100vw); }
          .news_side ul li a:before {
            background: url(../images/common/arrow-blue.png) 0 0 no-repeat;
            width: calc(18 / 750 * 100vw);
            height: calc(30 / 750 * 100vw); }
        .news_side ul li:hover {
          padding-left: 0; } }
