/*** base ***/
@media screen, print {
  * {
    box-sizing: border-box;
  }

  :root {
    --mesh-clr: #a2b441;
    --mshnv-clr: #ecf0c9;
    --mshnv-fntsz: 1.6rem;
    --mshnv-lnhght: 1.9;
  }

  img {
    display: block;
    height: auto;
    max-width: 100%;
  }

  .bold {
    font-weight: bold;
  }
}

/* PC */
@media (min-width: 641px) {
  :root {
    --mshnv-fntsz: 1.4rem;
  }

}

/* small PC / iPad */
@media (min-width: 768px) {
}

/* SP BP */
@media (min-width: 960px) {
}

/* large PC */
@media (min-width: 1025px) {
}

/*** base ***/


/*  reset */
@media screen, print {  
  h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    margin: 0;
    padding-left: 0;
  }

  h1::after {
    content: none;
  }

  ul {
    list-style-type: none;
  }

  figure {
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
  }

  a {
    color: #333;
  }

  a:hover {
    opacity: .8;
    text-decoration: none;
  }
}
/*  reset */


/* common */
@media screen, print {
  .clearfix::after {
    content: "";
    display: table;
    clear: both;
  }

  .icon-arrow_r {
    font-size: 65%;
    margin-left: .3rem;
    vertical-align: .2rem;
  }

  .link-int-af::after {
    content: '\e803';
    font-family: "fontello";
    font-size: 65%;
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-decoration: none;
    text-transform: none;
    line-height: 1em;
    margin-left: .4rem;
    text-indent: 0; /* reset */
    vertical-align: .2rem;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  .link-ext-af {
    /* align-items: center;
    display: flex;
    gap: .3rem; */
  }

  .link-ext-af::after {
    aspect-ratio: 1 / 1;
    background: url(../img/ic-linkext-blck.svg) no-repeat;
    background-size: contain;
    content: '';
    display: inline-block;
    height: 1.4rem;
    margin-left: .3rem;
    width: auto;
  }
}
/* common */


/* responsive */
@media screen, print {
  .img-responsive {
    display: block;
    height: auto;
    width: 100%;
  }

  .visible-tb-blck,
  .visible-tb-only-blck,
  .visible-pc-blck,
  .visible-lgpc-blck,
  .visible-gt768 {
    display: none;
  }
}

/* TAB */
@media (min-width: 421px) {
  .visible-sp-only {
    display: none;
  }

  .visible-tb-blck,
  .visible-tb-only-blck {
    display: block;
  }
}

/* PC */
@media (min-width: 641px) {
  .visible-sptb-only,
  .visible-tb-only-blck {
    display: none;
  }

  .visible-pc-blck,
  .visible-smpc-only {
    display: block;
  }
}

/* SP BP */
@media (min-width: 768px) {
  .visible-smpc-only {
    display: none;
  }

  .visible-gt768 {
    display: block;
  }
}

/* large PC */
@media (min-width: 1025px) {
  .visible-lgpc-blck {
    display: block;
  }

  .hide-lgpc-only {
    display: none;
  }
}
/* responsive */


/* contents */
@media screen, print {
  .meshnavi {
    background-color: var(--mshnv-clr);
    text-align: justify;
  }

  .meshnavi-title {
    font-size: 3rem;
    letter-spacing: .3rem;
    margin: 4rem auto 3rem;
    text-align: center;
  }

  .meshnavi-head {
    margin: 0 auto 6rem;
    width: min(90vw, 70rem);
    width: min(100%, 70rem);
  }

  .head-para {
    font-size: var(--mshnv-fntsz);
    line-height: 1.9;
    text-align: start;
  }


  #meshuPage {
    .meshnavi {
      margin-bottom: -4.8rem;
      margin-top: 4.8rem;
      padding-bottom: 4.8rem;
      padding-top: 4.8rem;
    }
  }/* #meshuPage */


  #meshnaviIndex {  
    padding-bottom: 10rem;

    .meshnavi-list {
      display: flex;
      flex-direction: column;
      gap: 6rem;
      margin-left: auto;
      margin-right: auto;
      width: min(100%, 40rem);
    }

    .meshnavi-img {
      aspect-ratio: 3 / 2;
      margin-bottom: 1rem;
    }

    .meshnavi-heading {
      font-size: 1.8rem;
      font-weight: bold;
      line-height: 1.4;
      margin-bottom: .8rem;
    }

    .meshnavi-para {
      font-size: var(--mshnv-fntsz);
      line-height: var(--mshnv-lnhght);
      margin-bottom: 2rem;
    }

    .topBtn {
      margin-bottom: 0; /* reset */
      width: 100%;
    }

    .topBtn a {
      display: block;
      font-size: 1.6rem;
    }
  }/* #meshnaviIndex */

  #meshnaviPage {
    background-color: #fff;

    /* table settting */
    .meshnavi-tableArea {
      overflow-x: auto;
      overflow-y: hidden;
      width: 100%;
    }

    .img-border {
      border: var(--mshnv-clr) solid .2rem;
      border: #ddd solid .2rem;
    }

    figcaption {
      font-size: 1.4rem;
      line-height: 1.6;
      margin-top: 1rem;
    }

    .fig-list {
      display: flex;
      flex-direction: column;

      figcaption {
        margin-top: .5rem;
      }
    }

    table {
      border-collapse: collapse;
      min-width: 100%;
    }

    tr {
      border-bottom: #333 solid .1rem;
    }

    th, td {
      font-size:var(--mshnv-fntsz);
      padding: 2rem 5rem 2rem 0;
      white-space: nowrap;
    }
    /* table settting */

    /* list setting */
    li {
      font-size: var(--mshnv-fntsz);
      line-height: var(--mshnv-lnhght);
    }

    li + li {
      margin-top: 1rem;
    }

    ol {
      list-style-type: none;
      counter-reset: meshnavi-counter;
    }

    ol li {
      counter-increment: meshnavi-counter;
    }

    ol li::before { 
      content: counter(meshnavi-counter) ". "; 
      font-weight: bold;
    }
    /* list setting */


    .meshnavi-head,
    .meshnavi-body,
    .meshnavi-links {
      margin-left: auto;
      margin-right: auto;
      width: min(calc(100vw - 4rem), 70rem);
    }


    .meshnavi-head {
      text-align: center;

      .head-img {
        aspect-ratio: 140 / 87;
        margin: 0 auto 4rem;
        object-fit: cover;
        width: min(100%, 70rem);
      }

      .head-vol {
        font-size: 1.8rem;
        font-weight: bold;
        line-height: 1;
        margin-bottom: 1rem;
      } 

      .page-title {
        font-size: 2.4rem;
        font-weight: bold;
        line-height: 1.4;
        margin-bottom: 2rem;
      }

      .head-date {
        margin-bottom: 2rem;
        text-align: start;
      }      
    }/* .meshnavi-head */


    .meshnavi-body {
      p {
        font-size: var(--mshnv-fntsz);
        line-height: var(--mshnv-lnhght);
      }

      .block-heading {
        font-size: 2rem;
        font-weight: bold;
        line-height: 1.4;
        margin-bottom: 2rem;
      }

      .meshnavi-block + .meshnavi-block {
        margin-top: 6rem;
      }

      .meshnavi-summary {
        border: var(--mesh-clr) .2rem solid;
        margin-bottom: 8rem;
        margin-top: 6rem;
        padding: 3rem 3vw;

        .summary-heading {
          font-size: 2rem;
          font-weight: bold;
          line-height: 1.4;
          margin-bottom: 2rem;
          text-align: center;
        }
      }
    }/* .meshnavi-body */
  
    .meshnavi-foot {
      p {
        font-size: var(--mshnv-fntsz);
        line-height: var(--mshnv-lnhght);
      }

      .meshnavi-links {
        margin-bottom: 8rem;

        h2 {
          font-size: var(--mshnv-fntsz);
          line-height: 1;
          margin-bottom: .5rem;
        }

        li {
          line-height: 1.6;
          padding-left: 1em;
          text-indent: -1em;
        }

        li::before {
          content: "\30FB";
        }

        .topBtn {
          margin-top: 5rem;
          width: min(100%, 38rem);
        }

        .topBtn a {
          display: block;
          font-size: 1.6rem;
        }
      }

      .meshnavi-contact {
        background-color: var(--mshnv-clr);
        padding: 5rem 1.2rem 3rem;

        h2 {
          font-size: 2rem;
          font-weight: bold;
          margin-bottom: 2rem;
          text-align: center;
        }

        p {
          margin-bottom: 3rem;
          text-align: center;
        }
      }


    }/* .meshnavi-foot */

  } /* #meshnaviPage */
}

/* TAB */
@media (min-width: 421px) {
}

/* PC */
@media (min-width: 641px) {

  .head-para {
  }

  #meshnaviIndex {
    .meshnavi-head {
      margin-bottom: 7rem;
    }

    .meshnavi-list {
      gap: 8rem;
      width: 100%;
    }

    .meshnavi-item {
      align-items: start;
      display: flex;
      flex-direction: row;
      gap: 2rem;
    }

    .meshnavi-img {
      margin-bottom: 0; /* reset */
      width: min(45%, 30rem);
    }

    .meshnavi-desc {
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }

    .meshnavi-heading {
      font-size: 1.6rem;
      margin-bottom: 0; /* reset */
    }

    .meshnavi-para  {
      /* font-size: 1.4rem; */
      margin-bottom: 0; /* reset */
    }

    .topBtn {
      margin-left: 0; /* reset */
      width: 26rem;
    }

    .topBtn a {
      font-size: 1.4rem;
    }
  }/*#meshnaviIndex*/

  #meshnaviPage {
    figcaption {
      font-size: 1.2rem;
    }

    .meshnavi-body {
      .block-heading {
        text-align: center;
      }
    }/*.meshnavi-body*/

  }/*#meshnaviPage*/
}


/* small PC / iPad */
@media (min-width: 768px) {
  .meshnavi-title {
    margin: 6rem auto 4rem;
  }

  #meshnaviIndex {

    .meshnavi-item {
    }

    .meshnavi-img {
      width: 30rem;
    }

  }/*#meshnaviIndex*/

  #meshnaviPage {
    /* list setting */
    li + li {
      margin-top: 1.5rem;
    }
    /* list setting */

    .fig-list {
      flex-direction: row;
      justify-content: space-between;

      figure {
        width: 48%;
      }
    }


    .meshnavi-head {
      margin-bottom: 8rem;

      .head-vol {
        margin-bottom: 1.5rem;
      }

      .page-title {
        font-size: 3.2rem;
      }
    }/*.meshnavi-head*/

    .meshnavi-body {
      .meshnavi-block + .meshnavi-block {
        margin-top: 8rem;  
      }

      .block-heading {
        font-size: 2.4rem;
        margin-bottom: 2.5rem;
      }

      .meshnavi-summary {
        padding: 4rem;

        .summary-heading {
          font-size: 2.4rem;
          margin-bottom: 4rem;
        }
      }

    }/*.meshnavi-body*/

    .meshnavi-foot {
      .meshnavi-links {
        .topBtn {
          margin-top: 6rem;
        }
      }

    }/*.meshnavi-foot*/


  }/*#meshnaviPage*/


}

/* SP BP */
@media (min-width: 960px) {
  .meshnavi-title {
    margin: 8rem auto 6rem;
  }


  #meshnaviIndex {
    .meshnavi-list {
      gap: 5rem;
    }

    .meshnavi-item {
      gap: 4rem;
    }
  }

}

/* large PC */
@media (min-width: 1025px) {
  #meshnaviIndex {
    .meshnavi-head {
      width: 70rem;
    }

    .meshnavi-list {
    }

    .meshnavi-img {
      width: 30rem;
    }

    .meshnavi-desc {
      height: 20rem;
    }

    .topBtn {
      margin-top: auto;
    }
  }
}

/* print */
@media print {
}