@charset "UTF-8";
/* -----

   set module

---------------------------------------------------- */
/*-- お客様の声　ページのパーツ
---------------------------------------------------- */
@media screen and (max-width: 899px) {
  #customer_voice .content__asnav {
    display: none; } }

.voice_list {
  display: flex;
  flex-wrap: wrap; }
  @media screen and (max-width: 739px) {
    .voice_list {
      justify-content: center; } }
  .voice_list > li {
    width: calc(50% - 12px); }
    @media screen and (max-width: 739px) {
      .voice_list > li {
        max-width: 560px;
        width: 100%; } }
    .voice_list > li:nth-child(2n + 2) {
      margin-left: 24px; }
      @media screen and (max-width: 739px) {
        .voice_list > li:nth-child(2n + 2) {
          margin-left: 0; } }
    .voice_list > li:nth-child(n + 3) {
      margin-top: 30px; }
    @media screen and (max-width: 739px) {
      .voice_list > li:nth-child(n + 2) {
        margin-top: 15px; } }
  .voice_list__link {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    background: #f1f5f7;
    height: 100%;
    padding: 44px 22px 24px;
    overflow: hidden;
    transition: opacity 0.2s ease-out; }
    @media screen and (max-width: 899px) {
      .voice_list__link {
        padding: 40px 15px 20px; } }
    .voice_list__link:hover {
      opacity: 0.8; }
    .voice_list__link::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      display: block;
      width: 100%;
      border-top: solid 2px #b5b5b5; }
    .voice_list__link::after {
      content: "\f105";
      position: absolute;
      bottom: 0;
      right: 0;
      display: inline-block;
      background: linear-gradient(90deg, #ff9614 0%, #ff6f33 100%);
      width: 24px;
      height: 24px;
      padding: 6px 0 0 9px;
      font-family: "FontAwesome";
      font-weight: 900;
      color: #fff;
      font-size: 13px;
      transition: border 0.2s ease-out; }
  .voice_list__cont {
    width: calc(100% - 128px - 24px);
    margin-right: 24px; }
    @media screen and (max-width: 899px) {
      .voice_list__cont {
        width: calc(100% - 12vw - 15px);
        margin-right: 15px; } }
    @media screen and (max-width: 739px) {
      .voice_list__cont {
        width: calc(100% - 100px - 24px);
        margin-right: 24px; } }
    @media screen and (max-width: 499px) {
      .voice_list__cont {
        width: calc(100% - 80px - 15px);
        margin-right: 15px; } }
    .voice_list__cont > .ttl {
      color: #1c1f87;
      font-weight: 500;
      transition: color 0.2s ease-out;
      font-size: 15px;
      max-height: 100%;
      margin-top: -3px;
      margin-bottom: -3px;
      line-height: 1.4; }
      .link_hover:hover .voice_list__cont > .ttl {
        color: #ff9515; }
      @media screen and (max-width: 899px) {
        .voice_list__cont > .ttl {
          font-size: 14px;
          max-height: 100%;
          margin-top: -3.003px;
          margin-bottom: -3.003px;
          line-height: 1.429; } }
    .voice_list__cont > .ttl_sub {
      color: #6f6f6f;
      font-size: 14px;
      max-height: 100%;
      margin-top: 14.997px;
      margin-bottom: -3.003px;
      line-height: 1.429; }
      @media screen and (max-width: 899px) {
        .voice_list__cont > .ttl_sub {
          font-size: 13px;
          max-height: 100%;
          margin-top: 10.503px;
          margin-bottom: -3.497px;
          line-height: 1.538; } }
    .voice_list__cont > .tag {
      position: relative;
      padding: 0 0 0 22px;
      color: #333;
      font-size: 14px;
      max-height: 100%;
      margin-top: 10.997px;
      margin-bottom: -3.003px;
      line-height: 1.429; }
      @media screen and (max-width: 899px) {
        .voice_list__cont > .tag {
          padding: 0 0 0 18px;
          font-size: 13px;
          max-height: 100%;
          margin-top: 12.503px;
          margin-bottom: -3.497px;
          line-height: 1.538; } }
      .voice_list__cont > .tag::before {
        content: "\f02b";
        position: absolute;
        top: 2px;
        left: 0;
        display: inline-block;
        font-family: "FontAwesome";
        height: 13px;
        color: #ff9515;
        font-size: 13px;
        font-weight: 900;
        vertical-align: top;
        margin: 1px 2px 0px 2px; }
        @media screen and (max-width: 899px) {
          .voice_list__cont > .tag::before {
            font-size: 11px; } }
    .voice_list__cont > .category {
      display: block;
      position: absolute;
      top: 0;
      left: -10px;
      background: #5e7383;
      padding: 7px 16px 8px 24px;
      transform: skew(-30deg); }
      @media screen and (max-width: 899px) {
        .voice_list__cont > .category {
          padding: 7px 16px 7px 24px; } }
      .voice_list__cont > .category > span {
        display: block;
        color: #fff;
        font-size: 13px;
        font-feature-settings: 'palt';
        transform: skew(30deg); }
        @media screen and (max-width: 899px) {
          .voice_list__cont > .category > span {
            font-size: 12px; } }
  .voice_list__photo {
    position: relative;
    width: 128px;
    height: 128px;
    margin-top: -16px;
    border-radius: 50%;
    overflow: hidden; }
    @media screen and (max-width: 899px) {
      .voice_list__photo {
        margin-top: -1.7777vw;
        width: 12vw;
        height: 12vw; } }
    @media screen and (max-width: 739px) {
      .voice_list__photo {
        margin-top: -16px;
        width: 100px;
        height: 100px; } }
    @media screen and (max-width: 499px) {
      .voice_list__photo {
        margin-top: -5px;
        width: 80px;
        height: 80px; } }
    .voice_list__photo.img_w100 > img {
      width: 100%; }
    .voice_list__photo.img_h100 > img {
      height: 100%; }
    .voice_list__photo > img {
      position: relative;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%); }
  .voice_list__page_link {
    text-align: center;
    margin-top: 32px; }
    .voice_list__page_link > a {
      position: relative;
      display: inline-block;
      background-image: linear-gradient(90deg, #ff9614 0%, #ff6f33 100%);
      background-position: right;
      background-size: 100% auto;
      width: 100%;
      max-width: 248px;
      height: 56px;
      padding: 19px 0 18px;
      border-radius: 28px;
      text-align: center;
      color: #fff;
      font-size: 16px;
      transition: background 0.3s ease-in-out, letter-spacing 0.3s ease-in-out; }
      .voice_list__page_link > a > span {
        display: inline-block; }
        .voice_list__page_link > a > span::after {
          content: "\f105";
          position: absolute;
          right: 18px;
          top: 50%;
          display: inline-block;
          color: #fff;
          font-family: "FontAwesome";
          font-weight: 900;
          font-size: 16px;
          vertical-align: top;
          transition: color 0.2s ease-out;
          transform: translateY(-50%);
          letter-spacing: 0; }
          @media screen and (max-width: 899px) {
            .voice_list__page_link > a > span::after {
              right: 10px; } }
      .voice_list__page_link > a:hover {
        background-size: 200% auto;
        letter-spacing: 0.06em; }

.pagination {
  position: relative;
  margin-top: 54px;
  font-size: 0;
  text-align: center; }
  @media screen and (max-width: 639px) {
    .pagination {
      margin-top: 80px; } }
  .pagination__ul {
    display: inline-block; }
    .pagination__ul > li {
      display: inline-block;
      vertical-align: top; }
      .pagination__ul > li > a {
        transition: border 0.2s ease-out; }
        .pagination__ul > li > a:hover {
          border: solid 1px #ff9515; }
      .pagination__ul > li .page-numbers {
        display: block;
        width: 32px;
        text-align: center;
        padding: 8px 0;
        margin: 0 4px;
        border: solid 1px #ddd;
        border-radius: 6px;
        font-size: 14px;
        color: #333; }
        .pagination__ul > li .page-numbers.current {
          background: #e7e7e7;
          border: solid 1px #e7e7e7; }
        .pagination__ul > li .page-numbers.dots {
          border: none;
          margin: 0 -6px; }
      .pagination__ul > li .prev,
      .pagination__ul > li .next {
        width: 75px; }
        @media screen and (max-width: 639px) {
          .pagination__ul > li .prev,
          .pagination__ul > li .next {
            margin: 0;
            position: absolute;
            top: -52px; } }
        .pagination__ul > li .prev::before, .pagination__ul > li .prev::after,
        .pagination__ul > li .next::before,
        .pagination__ul > li .next::after {
          display: inline-block;
          margin-top: -3px;
          font-size: 16px; }
      @media screen and (max-width: 639px) {
        .pagination__ul > li .prev {
          left: 0; } }
      .pagination__ul > li .prev::before {
        content: "≪";
        margin-right: 4px; }
      @media screen and (max-width: 639px) {
        .pagination__ul > li .next {
          right: 0; } }
      .pagination__ul > li .next::after {
        content: "≫";
        margin-left: 4px; }
  .pagination__sp {
    display: none !important; }
    @media screen and (max-width: 639px) {
      .pagination__sp {
        position: absolute;
        top: -43px;
        left: 50%;
        display: block !important;
        transform: translateX(-50%); } }
    .pagination__sp > span {
      font-size: 15px;
      color: #333; }

/*# sourceMappingURL=common_customer_voice.css.map */