@charset "UTF-8";
/* Scss Document */
/* Scss Document */
.infoLayout {
  display: flex;
  align-items: flex-start;
  gap: 40px;
  max-width: 1440px;
  margin: 86px auto 0;
  padding: 0 40px;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Meiryo UI", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif; }

@media (max-width: 1000px) {
  .infoLayout {
    gap: 25px; } }

@media (max-width: 700px) {
  .infoLayout {
    flex-direction: column;
    gap: 50px;
    margin-top: 55px;
    padding: 0 20px; } }

.info {
  flex: 1;
  min-width: 0; }
  .info__upper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 28px; }
  .info__title {
    padding-left: 13px;
    border-left: 4px solid #004ca1;
    font-size: 1.25rem;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Meiryo UI", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif;
    font-weight: 700;
    line-height: 1.3; }
  .info__count {
    flex-shrink: 0;
    font-size: 1rem;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Meiryo UI", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif; }
  .info__list {
    margin: 0;
    padding: 0;
    border: 1px solid #DDD;
    list-style: none; }
  .info__item {
    margin: 0;
    padding: 0; }
    .info__item:not(:first-child) {
      border-top: 1px solid #DDD; }
    .info__item--anchor {
      display: flex;
      align-items: center;
      gap: 38px;
      position: relative;
      min-height: 78px;
      padding: 22px 58px 22px 40px;
      box-sizing: border-box;
      color: #000;
      transition: background-color 0.3s ease; }
      .info__item--anchor:link, .info__item--anchor:visited {
        color: #000; }
      .info__item--anchor::after {
        content: '';
        position: absolute;
        top: 50%;
        right: 24px;
        width: 6px;
        height: 6px;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        transform: translateY(-50%) rotate(45deg); }
      .info__item--anchor:hover, .info__item--anchor:focus-visible {
        background-color: #f2f7fb;
        text-decoration: none; }
        .info__item--anchor:hover .info__item--title, .info__item--anchor:focus-visible .info__item--title {
          text-decoration: underline;
          text-underline-offset: 4px; }
    .info__item--date {
      flex: 0 0 95px;
      font-size: 1rem;
      font-weight: 700;
      white-space: nowrap; }
    .info__item--category {
      flex: 0 0 150px;
      padding: 4px 0;
      border-radius: 20px;
      background-color: #dae0eb;
      font-size: 0.875rem;
      font-weight: 500;
      text-align: center;
      line-height: 1.5; }
    .info__item--yard {
      color: #004ca1;
      background-color: #d0ecfc; }
    .info__item--eco {
      color: #444;
      background-color: #dff1df; }
    .info__item--title {
      flex: 1;
      min-width: 0;
      font-size: 1.125rem;
      font-weight: 500;
      line-height: 1.7;
      overflow-wrap: anywhere; }

@media (max-width: 1200px) {
  .info__item--anchor {
    display: grid;
    grid-template-columns: 105px 150px 1fr;
    gap: 12px 20px;
    padding-left: 25px; } }

@media (max-width: 1000px) {
  .info__item--anchor {
    grid-template-columns: 100px 150px;
    padding: 20px 40px 20px 20px; }
  .info__item--title {
    grid-column: 1 / -1; } }

@media (max-width: 700px) {
  .info {
    width: 100%; }
    .info__upper {
      margin-bottom: 22px; }
    .info__title {
      font-size: 1.0625rem; }
    .info__count {
      font-size: 0.875rem; }
    .info__item--title {
      font-size: 1rem; }
    .info__item--date {
      font-size: 0.875rem; } }

.pagination {
  margin-top: 38px;
  font-family: "Barlow", sans-serif; }
  .pagination__list {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
    list-style: none; }
    .pagination__list a,
    .pagination__list span {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 30px;
      height: 30px;
      box-sizing: border-box;
      border-radius: 50%;
      color: #004ca1;
      font-size: 1.125rem; }
    .pagination__list a:hover,
    .pagination__list a:focus-visible {
      background-color: #f2f7fb;
      text-decoration: none; }
  .pagination__list .pagination__current {
    color: #FFF;
    background-color: #004ca1; }
  .pagination__arrow {
    position: relative; }
    .pagination__arrow::before {
      content: '';
      width: 5px;
      height: 5px;
      border-top: 1px solid currentColor;
      border-left: 1px solid currentColor;
      transform: rotate(-45deg); }
    .pagination__arrow--next::before {
      transform: rotate(135deg); }

.infoSidebar {
  flex: 0 0 300px; }
  .infoSidebar__box {
    padding: 32px 20px 40px;
    background-color: #f2f7fb; }
    .infoSidebar__box + .infoSidebar__box {
      margin-top: 40px; }
  .infoSidebar__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 12px 22px;
    color: #004ca1;
    font-size: 1.25rem;
    font-family: "Barlow", sans-serif;
    font-weight: 700; }
    .infoSidebar__title img {
      object-fit: contain; }
  .infoSidebar__list {
    margin: 0;
    padding: 0;
    list-style: none; }
  .infoSidebar__anchor {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 52px;
    padding: 10px 20px;
    box-sizing: border-box;
    border-radius: 4px;
    background-color: #FFF;
    font-size: 1rem;
    font-weight: 500;
    transition: background-color 0.3s ease; }
    .infoSidebar__anchor:link, .infoSidebar__anchor:visited {
      color: #000; }
    .infoSidebar__anchor:hover, .infoSidebar__anchor:focus-visible {
      background-color: #d0ecfc;
      text-decoration: none; }
    .infoSidebar__anchor[aria-current] {
      color: #FFF;
      background-color: #004ca1; }
      .infoSidebar__anchor[aria-current] .infoSidebar__count {
        color: #FFF;
        background-color: #00a8e0; }
  .infoSidebar__count {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: #004ca1;
    background-color: #f2f7fb;
    font-size: 1rem;
    font-family: "Barlow", sans-serif; }
  .infoSidebar__select {
    width: 100%;
    min-height: 50px;
    padding: 10px 16px;
    border: 1px solid #BBB;
    border-radius: 0;
    box-sizing: border-box;
    color: #000;
    background-color: #FFF;
    font-size: 1rem;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Meiryo UI", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif;
    cursor: pointer; }

@media (max-width: 1000px) {
  .infoSidebar {
    flex-basis: 260px; }
    .infoSidebar__anchor {
      padding-right: 12px;
      padding-left: 12px;
      font-size: 0.875rem; } }

@media (max-width: 700px) {
  .infoSidebar {
    width: 100%;
    flex-basis: auto; }
    .infoSidebar__box + .infoSidebar__box {
      margin-top: 25px; } }

.infoDetail {
  flex: 1;
  min-width: 0; }
  .infoDetail__header {
    padding-bottom: 24px;
    border-bottom: 1px solid #DDD; }
  .infoDetail__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 46px;
    min-height: 30px; }
  .infoDetail__date {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.5; }
  .infoDetail__category {
    width: 150px;
    padding: 4px 0;
    border-radius: 20px;
    color: #004ca1;
    background-color: #d0ecfc;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.5;
    text-align: center; }
  .infoDetail__title {
    margin-top: 24px;
    font-size: 1.875rem;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Meiryo UI", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif;
    font-weight: 500;
    line-height: 1.5;
    overflow-wrap: anywhere; }
  .infoDetail .system-free {
    height: auto;
    margin-top: 30px;
    overflow: auto;
    color: #000;
    background-color: #FFF;
    font-size: 1.125rem;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Meiryo UI", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif;
    font-weight: 500;
    line-height: 2;
    overflow-wrap: anywhere; }
    .infoDetail .system-free p,
    .infoDetail .system-free li,
    .infoDetail .system-free dt,
    .infoDetail .system-free dd,
    .infoDetail .system-free th,
    .infoDetail .system-free td,
    .infoDetail .system-free figcaption,
    .infoDetail .system-free blockquote {
      color: inherit;
      font-size: inherit;
      font-family: inherit;
      line-height: inherit; }
    .infoDetail .system-free p,
    .infoDetail .system-free ul,
    .infoDetail .system-free ol,
    .infoDetail .system-free dl,
    .infoDetail .system-free figure,
    .infoDetail .system-free table,
    .infoDetail .system-free blockquote {
      margin: 0 0 1.5em; }
    .infoDetail .system-free > :last-child {
      margin-bottom: 0; }
    .infoDetail .system-free ul,
    .infoDetail .system-free ol {
      padding-left: 1.5em; }
    .infoDetail .system-free figure,
    .infoDetail .system-free blockquote {
      margin-right: 0;
      margin-left: 0; }
    .infoDetail .system-free h3,
    .infoDetail .system-free h4,
    .infoDetail .system-free h5,
    .infoDetail .system-free h6 {
      margin: 1.5em 0 0.75em;
      font-family: inherit;
      font-weight: 700;
      line-height: 1.6; }
    .infoDetail .system-free h3 {
      font-size: 1.5rem; }
    .infoDetail .system-free h4,
    .infoDetail .system-free h5,
    .infoDetail .system-free h6 {
      font-size: 1.25rem; }
    .infoDetail .system-free a {
      text-decoration: underline;
      text-underline-offset: 3px; }
      .infoDetail .system-free a:link, .infoDetail .system-free a:visited {
        color: #004ca1; }
      .infoDetail .system-free a:hover, .infoDetail .system-free a:focus-visible {
        color: #00aaa5; }
    .infoDetail .system-free img,
    .infoDetail .system-free video,
    .infoDetail .system-free iframe {
      max-width: 100%; }
    .infoDetail .system-free img,
    .infoDetail .system-free video {
      height: auto; }
    .infoDetail .system-free table {
      width: 100%;
      border-collapse: collapse; }
    .infoDetail .system-free th,
    .infoDetail .system-free td {
      padding: 12px;
      border: 1px solid #DDD;
      text-align: left; }
    .infoDetail .system-free th {
      background-color: #f2f7fb; }
    .infoDetail .system-free hr {
      margin: 2em 0;
      border-top-color: #DDD; }
  .infoDetail__nav {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    margin-top: 80px; }
  .infoDetail__nav--previous, .infoDetail__nav--back, .infoDetail__nav--next {
    display: flex;
    align-items: center;
    min-height: 32px;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.6;
    text-decoration: none; }
    .infoDetail__nav--previous:link, .infoDetail__nav--previous:visited, .infoDetail__nav--back:link, .infoDetail__nav--back:visited, .infoDetail__nav--next:link, .infoDetail__nav--next:visited {
      color: #000; }
    .infoDetail__nav--previous:hover, .infoDetail__nav--previous:focus-visible, .infoDetail__nav--back:hover, .infoDetail__nav--back:focus-visible, .infoDetail__nav--next:hover, .infoDetail__nav--next:focus-visible {
      color: #004ca1;
      text-decoration: underline;
      text-underline-offset: 4px; }
  .infoDetail__nav--previous {
    justify-self: start; }
  .infoDetail__nav--back {
    justify-self: center; }
  .infoDetail__nav--next {
    justify-self: end; }

@media (max-width: 700px) {
  .infoDetail {
    width: 100%; }
    .infoDetail__meta {
      column-gap: 25px; }
    .infoDetail__date {
      font-size: 0.875rem; }
    .infoDetail__title {
      margin-top: 20px;
      font-size: 1.5rem; }
    .infoDetail .system-free {
      font-size: 1rem; }
    .infoDetail__nav {
      gap: 8px;
      margin-top: 55px; }
    .infoDetail__nav--previous, .infoDetail__nav--back, .infoDetail__nav--next {
      font-size: 0.8125rem; } }

@media (max-width: 380px) {
  .infoDetail__nav {
    grid-template-columns: 1fr 1fr; }
  .infoDetail__nav--back {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: 10px; } }

.infoMain--detail .breadcrumb {
  margin-top: 130px; }

.infoMain--detail .breadcrumb__list {
  flex-wrap: wrap; }

@media (max-width: 700px) {
  .infoMain--detail .breadcrumb {
    margin-top: 75px; } }

@media (prefers-reduced-motion: reduce) {
  .innerPage {
    animation: none; }
    .innerPage *,
    .innerPage *::before,
    .innerPage *::after {
      animation: none;
      transition: none;
      scroll-behavior: auto; } }