@charset "UTF-8";
  #aff-contents .p-page-header {
    max-width: 960px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 0 auto -80px; 
  }
  #aff-contents .p-page-header__item {
    width: 115px;
    margin-right: 12px;
  }
  #aff-contents .p-page-header__item:last-child {
    width: 170px;
  }
  @media screen and (max-width: 768px) {
    #aff-contents .p-page-header {
      max-width: 100%;
      margin: 0 auto -20px; 
    }
    #aff-contents .p-page-header__item {
      width: 12%;
      margin-right: 3%;
    }
    #aff-contents .p-page-header__item:last-child {
      width: 17.7%;
    }
  }

  #aff-contents .p-page-ttl {
      margin: 0 auto 60px;
    width: 960px;
    text-align: center; }
  #aff-contents .p-page-ttl__series {
/*      margin: 0 auto; */
      margin: 0 auto 50px;
    width: 10.8%;
    text-align: center; }
  #aff-contents .p-page-ttl__visual {
    margin: 0 auto 70px;
/*    width: 100%; */
    width: 77.08%; 
    }
   #aff-contents .p-page-ttl__main {
    margin: 0 auto 60px;
      width: 70.7%; }
  #aff-contents .p-page-ttl__lead {
    margin: 60px auto 50px;
    width: 825px;
    text-align: center; }
  #aff-contents .p-page-ttl__lead p.memo {
    margin: 30px auto 0;
    padding: 0 0 0 1em;
    width: 740px;
    font-size: 1.125rem; /* 18pt */
    line-height: 1.61; /* 29pt */
    text-indent: -1em;
      text-align: justify;
      word-break: break-all;
  }
  #aff-contents .p-page-ttl__txt {
      font-weight: bold;
      font-size: 1.125em; }
  @media screen and (max-width: 768px) {
    #aff-contents .p-page-ttl {
        margin-bottom: 20px;
          width: 100%;
    } 
    #aff-contents .p-page-ttl__series {
    /*      margin: 0 auto; */
      margin: 0 auto 20px;
    }
    #aff-contents .p-page-ttl__visual, 
    #aff-contents .p-page-ttl__main {
    margin: 0 auto 30px;}
      #aff-contents .p-page-ttl__lead {
        margin: 30px auto 20px;
        width: 90.2%;
    }
    #aff-contents .p-page-ttl__lead p.memo {
      margin: 30px auto 0;
      padding: 0 0 0 1em;
      width: 100%;
      font-size: 0.65rem;
    }
    #aff-contents .p-page-ttl__txt {
        font-size: 0.8125em;
    }
  }

    /* 今週の見どころ */
  #aff-contents .p-intro {
      margin: 0 auto 40px;
      width: 100%;
  }
  #aff-contents .p-intro .check-point {
  background-size: auto auto;
  background-color: rgba(255, 255, 255, 1);
  background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(215, 237, 225, 1) 5px, rgba(215, 237, 225, 1) 7px );
  position: relative;
  margin: 100px 0;
  padding: 50px 0;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    flex-direction: column;
    z-index: 1;
  }
  #aff-contents .p-intro .check-point::before{
    position: absolute;
    top: -27px;
    background: url(/j/pr/aff/2308/img/table_border.png) 0 0 no-repeat;
    background-size: contain;
    content: '';
    width: 100%;
    height: 54px;
  }
  #aff-contents .p-intro .check-point::after{
    position: absolute;
    bottom: -27px;
    background: url(/j/pr/aff/2308/img/table_border.png) 0 0 no-repeat;
    background-size: contain;
    content: '';
    width: 100%;
    height: 54px;
  }

    #aff-contents .p-intro .point {
      margin: -80px auto 30px;
      width: 29.4%;
      z-index: 5;
    }
    #aff-contents .p-intro ul {
      margin: 0 auto;
      text-align: left;
  }
    #aff-contents .p-intro li {
      font-size: 1.3125rem;
      line-height: 2.2;
/*      line-height: 1.8; */
      padding-left: 1em;
      list-style: none;
  }
    #aff-contents .p-intro li a {
      position: relative;
      padding-right: 10px;
      text-decoration: underline;
  }
    #aff-contents .p-intro li a:before {
      content: '>';
      /* width: 6px;
      height: 6px; */
      left: -1em;
      /* top: calc(50% - 3px); */
      position: absolute;
      text-decoration: none;
  }
@media screen and (max-width: 768px) {
  #aff-contents .p-intro .check-point::before,
  #aff-contents .p-intro .check-point::after{
    background-size: cover;
  }

  #aff-contents .p-intro .point {
      margin: -40px auto 20px;
    }
  #aff-contents .p-intro ul {
      width: 90%;
  }
  #aff-contents .p-intro li {
      font-size: 1.125rem;
      line-height: 1.85;
  }
}

  /* 見どころ詳細 */
    #aff-contents .p-point__content {
      margin: 0 auto 40px;
      width: 100%;
  }
    #aff-contents #Point01, 
    #aff-contents #Point02, 
    #aff-contents #Point03, 
    #aff-contents #Point04, 
    #aff-contents #Point05 {
      margin-bottom: 100px;
  }
    #aff-contents .p-point__content h2.ttl {
      margin-bottom: 40px;
      padding: 0;
      border: none;
      position: relative;
      background: none;
      text-align: left;
  }
    @media screen and (max-width: 768px) {
      #aff-contents #Point01, 
      #aff-contents #Point02, 
      #aff-contents #Point03, 
      #aff-contents #Point04, 
      #aff-contents #Point05 {
        margin-bottom: 50px;
      }
      #aff-contents .p-point__content h2.ttl {
        margin-bottom: 25px;
      }
    }
  #aff-contents .p-point__content .box-large {
    margin: 0 auto 40px;
    width: 100%;
  }
  #aff-contents .p-point__content .box-medium {
    margin: 0 auto 80px;
    width: 740px;
    text-align: justify;
    word-break: break-all;
  }
  #aff-contents .p-point__content .text-box p a {
    color: #AA8546;
    background: none;
  }
  #aff-contents .p-point__content picture +p {
    margin-top: 15px;
  }
  @media screen and (max-width: 768px) {
    #aff-contents .p-point__content .box-large {
      margin: 0 auto 20px;
      width: 100%;
    }
    #aff-contents .p-point__content .box-medium {
      margin: 0 auto 40px;
      width: 90%;
    }
    #aff-contents .p-point__content picture {
      margin: 0 auto;
      width: 100%;
    }
    #aff-contents .p-point__content picture +p {
      margin-top: 3%;
    }
    #aff-contents p { font-size: 1.125rem; }
  }

    #aff-contents .p-point__content .supervision {
      margin-bottom: 90px;
      width: 100%;
      display: flex;
      justify-content: flex-end;
      align-items: center;
      flex-direction: row;
      position: relative;
    }
    #aff-contents .p-point__content.method .supervision {
      margin-bottom: 120px;
      width: 100%;
    }
    #aff-contents .p-point__content .supervision .ph-box {
      width: 200px;
      position: absolute;
      left: 0;
      z-index: 30;
    }

    #aff-contents .p-point__content .supervision {
      position:relative;
      z-index: 20;
    }
    #aff-contents .p-point__content .supervision .text-box {
      width: calc(100% - 100px);
      padding: 20px 0 20px 130px;
      background-color: #d7ede2;
      position:relative;
    }
    #aff-contents .p-point__content .supervision .text-box::after {
      position: absolute;
      width: 100%;
      height: 100%;
      content: '';
      background-size: auto auto;
      background-color: rgba(255, 255, 255, 1);
      background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(255, 240, 0, 1) 5px, rgba(255, 240, 0, 1) 7px );
      right: -10px;
      bottom: -10px;
      z-index: -1;
    }

    #aff-contents .p-point__content.situation .supervision .text-box {
      padding: 20px;
      width: 100%;
    }

    #aff-contents .p-point__content .supervision .text-box p.post {
      margin-top: 20px;
      font-size: 1.125rem; /* 18pt */
      line-height: 1.61; /* 29pt */
    }

    #aff-contents .p-point__content .graph h3 {
      margin: 0 0 0.5em;
      font-size: 1.5rem; /* 24pt */
      line-height: 3; /* 72pt */
      font-weight: 700;
      text-align: center;
      border: none;
    }
    @media screen and (max-width: 768px) {
      #aff-contents .p-point__content .supervision {
        margin-bottom: 50px;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        position: relative;
      }
      #aff-contents .p-point__content.method .supervision {
        margin-top: 120px;
        margin-bottom: 50px;
      }
      #aff-contents .p-point__content .supervision .ph-box {
        margin: 0 auto;
        width: 40%;
        position: relative;
        left: auto;
        top: auto;
      }
      #aff-contents .p-point__content .supervision .text-box {
        margin-top: -50px;
        padding: 60px 15px 15px;
        width: 100%;
      }
      #aff-contents .p-point__content .supervision .text-box.noph {
        margin-top: 0;
      }
      #aff-contents .p-point__content.situation .supervision .text-box {
        padding: 15px;
        width: 100%;
      }
      #aff-contents .p-point__content .supervision .text-box picture {
        display: block;
      }
      #aff-contents #Point01 .supervision .text-box picture {
        margin-right: 44.3%;
        width: 55.7%;
      }
      #aff-contents #Point04 .supervision .text-box picture {
        margin-right: 58.5%;
        width: 41.5%;
      }
      #aff-contents #Point05 .supervision .text-box picture {
        margin-right: 58%;
        width: 42%;
      }
      #aff-contents .p-point__content .supervision .text-box p.post {
        margin-top: 10px;
        font-size: 0.875rem;
      }

      #aff-contents .p-point__content .graph h3 {
        font-size: 1.125rem;
      }
    }

  /* === point - Base === */
    #aff-contents .p-point__content .ph-box p.cap {
      margin: 10px 0 0;
      padding: 0;
      font-size: 1.125rem; /* 18pt */
      line-height: 1.33; /* 24pt */
      font-weight: 700;
      color: #61b98b;
    }
    #aff-contents .p-point__content .text-box p {
      margin: 0;
      padding: 0;
      font-size: 1.125rem; /* 18pt */
      line-height: 1.61; /* 29pt */
      text-align: justify;
      word-break: break-all;
    }
    #aff-contents .p-point__content .text-box p.note {
      margin: 0.5em 0 0;
      font-size: 0.75rem; /* 12pt */
    }
    #aff-contents .p-point__content .ph-small {
      margin-bottom: 40px;
      width: 100%;
      position: relative;
    }
/*
    @media screen and (max-width: 768px) {
      #aff-contents .p-point__content .ph-box p.cap,
      #aff-contents .p-point__content .text-box p {
        font-size: 1.125rem;;
      }
    }
*/

    /* Point01 */
    #aff-contents .p-point__content.situation h2.ttl {
      width: 80.2%;
    }

    /* Point02 */
    #aff-contents .p-point__content.quiz h2.ttl {
      width: 77.6%;
    }
    #aff-contents .p-point__content .picture-book {
      width: 100%;
      aspect-ratio: 960 / 2670;
      margin-bottom: 80px;
      position: relative;
    }
    #aff-contents .p-point__content .picture-book .card {
      position: absolute;
    }
    #aff-contents .p-point__content .picture-book .fish-a {
      width: 56.77%;
      left: 0;
      top: 0;
    }
    #aff-contents .p-point__content .picture-book .fish-b {
      width: 56.77%;
      right: 0;
      top: 17%;
    }
    #aff-contents .p-point__content .picture-book .fish-c {
      width: 59.06%;
      left: 0;
      top: 24%;
    }
    #aff-contents .p-point__content .picture-book .fish-d {
      width: 61.87%;
      right: 0;
      top: 44%;
    }
    #aff-contents .p-point__content .picture-book .fish-e {
      width: 67.81%;
      left: 0;
      top: 53%;
    }
    #aff-contents .p-point__content .picture-book .fish-f {
      width: 71.9%;
      right: 0;
      top: 79%;
    }
    #aff-contents .p-point__content .picture-book .reference {
      position: absolute;
      left: 0;
      bottom: 30px;
      font-size: 0.875rem;
    }

    @media screen and (max-width: 768px) {
      #aff-contents .p-point__content .picture-book {
        width: 100%;
        aspect-ratio: auto;
        height: auto;
        margin-bottom: 50px;
      }
      #aff-contents .p-point__content .picture-book .card {
        position: relative;
      }
      #aff-contents .p-point__content .picture-book .fish-a,
      #aff-contents .p-point__content .picture-book .fish-b,
      #aff-contents .p-point__content .picture-book .fish-c,
      #aff-contents .p-point__content .picture-book .fish-d,
      #aff-contents .p-point__content .picture-book .fish-e,
      #aff-contents .p-point__content .picture-book .fish-f {
        margin: 0 auto 1em;
        right: auto;
        top: auto;
        bottom: auto;
        left: auto;
      }
      #aff-contents .p-point__content .picture-book .fish-a {
        width: 73.8%; /* x1.3 */
      }
      #aff-contents .p-point__content .picture-book .fish-b {
        width: 73.8%;
      }
      #aff-contents .p-point__content .picture-book .fish-c {
        width: 76.77%;
      }
      #aff-contents .p-point__content .picture-book .fish-d {
        width: 80.43%;
      }
      #aff-contents .p-point__content .picture-book .fish-e {
        width: 81.15%;
      }
      #aff-contents .p-point__content .picture-book .fish-f {
        width: 93.56%;
      }
      #aff-contents .p-point__content .picture-book .reference {
        font-size: 0.65rem;
      }
    }

    #aff-contents .p-point__content.quiz .color {}
    #aff-contents .p-point__content.quiz .color h2.ttl {
      margin: 0 0 30px;
      width: 100%;
    }
    #aff-contents .p-point__content.quiz .color .inner {
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      flex-direction: row;
    }
    #aff-contents .p-point__content.quiz .color .text-box {
      width: 60.81%;
    }
    #aff-contents .p-point__content.quiz .color .ph-box {
      width: 33.78%;
    }
    #aff-contents .p-point__content.quiz .color p.authority {
      margin-top: 1em;
    }
    #aff-contents .p-point__content.quiz .color p.authority a {
      color: #1a90c3;
      word-break: break-all;
    }
    @media screen and (max-width: 768px) {
      #aff-contents .p-point__content.quiz .color h2.ttl {
        margin: 0 auto 20px;
      }
      #aff-contents .p-point__content.quiz .color .inner {
        justify-content: center;
        align-items: flex-start;
        flex-direction: column;
      }
      #aff-contents .p-point__content.quiz .color .text-box {
        margin-bottom: 1em;
        width: 100%;
      }
      #aff-contents .p-point__content.quiz .color .ph-box {
        width: 100%;
      }
    }

    /* Point03 */
    #aff-contents .p-point__content.measure h2.ttl {
      width: 79.7%;
    }
    #aff-contents .p-point__content.measure .inner {
      margin-top: 60px;
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      flex-direction: row;
    }
    #aff-contents .p-point__content.measure .ph-box {
      width: 47.3%;
    }
    #aff-contents .p-point__content.measure .text-box {
      width: 50%;
    }
    #aff-contents .p-point__content.measure p.cap a {
      color: #1a90c3;
      word-break: break-all;
    }
    #aff-contents .p-point__content p.answer {
      font-size: 1.5rem; /* 24pt */
      line-height: 2; /* 32pt */
      letter-spacing: normal;
    }
    #aff-contents .p-point__content p.answer span {
      font-weight: 700;
      color: #AA8246;
    }
    @media screen and (max-width: 768px) {
      #aff-contents .p-point__content.measure .inner {
        justify-content: center;
        align-items: flex-start;
        flex-direction: column;
      }
      #aff-contents .p-point__content.measure .ph-box {
        margin: 0 auto 1em;
        width: 70%;
      }
      #aff-contents .p-point__content.measure .text-box {
        width: 100%;
      }
      #aff-contents .p-point__content p.answer {
        font-size: 1rem;
      }
    }

    /* Point04, 05 */
    #aff-contents .p-point__content.situation .category00,
    #aff-contents .p-point__content.method .category01,
    #aff-contents .p-point__content.method .category02 {
      margin: 0 auto;
      width: 740px;
    }
    #aff-contents .p-point__content.situation .category00 {
      margin-bottom: 40px;
    }
    #aff-contents .p-point__content.method h2.ttl {
      margin: 40px auto 30px;
    }
    #aff-contents .p-point__content.method .category01 + h2.ttl {
      width: 44.69%;
    }
    #aff-contents .p-point__content.method .category02 + h2.ttl {
      width: 90.4%;
    }
    #aff-contents .p-point__content.method .cooperative {
      margin-bottom: 80px;
      font-size: 1.375rem; /* 22pt */
      font-weight: 700;
      color: #61b98b;
      text-align: center;
    }

    #aff-contents .p-point__content.method h3 {
      margin-bottom: 20px;
      font-size: 1.5rem; /* 24pt */
      line-height: 1.6;
      font-weight: 700;
      color: #61b98b;
      border: none;
      background: none;
    }

    #aff-contents .p-point__content .ph-small .text-box {
      margin: 0;
      border: 5px solid #fff;
      background-color: #61b98b;
      position: absolute;
    }
    #aff-contents .p-point__content .ph-small .text-box p {
      margin: 0;
      padding: 0.6em;
      font-size: 1.125rem; /* 18pt */
      line-height: 1.33; /* 24pt */
      color: #fff;
      font-weight: 700;
    }
    @media screen and (max-width: 768px) {
      #aff-contents .p-point__content.situation .category00,
      #aff-contents .p-point__content.method .category01,
      #aff-contents .p-point__content.method .category02 {
        width: 100%;
      }
      #aff-contents .p-point__content.situation .category00 {
        margin-bottom: 20px;
      }
      #aff-contents .p-point__content.method h3 {
        margin-bottom: 10px;
      }
      #aff-contents .p-point__content .ph-small .text-box {
        margin: 0;
        border: none;
        background-color: transparent;
        position: relative;
      }
      #aff-contents .p-point__content .ph-small .text-box p {
        padding: 0;
/*        font-size: 0.875rem; */
        color: #61b98b;
      }
    }
    
  /* === point4 - method === */
  #aff-contents .p-point__content.method .box-large {
    margin-bottom: 80px;
  }
    #aff-contents .p-point__content.method .inner {
    width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-direction: row;
    }
    #aff-contents .p-point__content.method .ph-small.ph01 {
      width: 56.45%;
      position: relative;
    }
    #aff-contents .p-point__content.method .ph-small.ph02 {
      width: 31.25%;
      position: relative;
    }

    #aff-contents .p-point__content.method .ph-small.ph01 .ph-box {
      width: 100%;
    }
    #aff-contents .p-point__content.method .ph-small.ph02 .ph-box {
      width: 100%;
    }
    #aff-contents .p-point__content.method .ph-small.ph01 .text-box {
      width: 53%;
      right: -10%;
      bottom: -40px;
    }
    #aff-contents .p-point__content.method .ph-small.ph02 .text-box {
      width: 120%;
      right: 18%;
      top: -40px;
    }

    #aff-contents .p-point__content.method .ph-small.ph03 .ph-box,
    #aff-contents .p-point__content.method .ph-small.ph04 .ph-box {
      margin: 0;
      width: 73.2%;
    }
    #aff-contents .p-point__content.method .ph-small.ph04 .ph-box {
      margin-left: 26.8%;
    }
    #aff-contents .p-point__content.method .ph-small.ph03 .text-box {
      width: 35%;
      right: 0;
      top: 5px;
    }
    #aff-contents .p-point__content.method .ph-small.ph04 .text-box {
      width: 62%;
      left: 0;
      top: 10px;
    }
    @media screen and (max-width: 768px) {
    #aff-contents .p-point__content.method .box-large {
      margin: 0 auto 40px;
      width: 90%;
    }
    #aff-contents .p-point__content.method .inner {
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-direction: column;
    }

      #aff-contents .p-point__content.method .ph-small.ph01,
      #aff-contents .p-point__content.method .ph-small.ph02 {
        width: 100%;
      }
      #aff-contents .p-point__content.method .ph-small.ph01 .ph-box,
      #aff-contents .p-point__content.method .ph-small.ph03 .ph-box,
      #aff-contents .p-point__content.method .ph-small.ph04 .ph-box {
        margin: 0 0 1em;
        width: 100%;
      }
      #aff-contents .p-point__content.method .ph-small.ph02 .ph-box {
        margin: 0 auto 1em;
        width: 70%;
      }
      #aff-contents .p-point__content.method .ph-small.ph01 .text-box,
      #aff-contents .p-point__content.method .ph-small.ph02 .text-box,
      #aff-contents .p-point__content.method .ph-small.ph03 .text-box,
      #aff-contents .p-point__content.method .ph-small.ph04 .text-box {
      width: 100%;
      right: auto;
      top: auto;
      bottom: auto;
      left: auto;
      }
    }

    /* === point5 - method === */
    #aff-contents .p-point__content.method .ph-small.ph10 {
      width: 100%;
      padding: 0 0 30px;
    }
    #aff-contents .p-point__content.method .ph-small.ph10 .ph-box {
      margin: 0;
      width: 100%;
    }
    #aff-contents .p-point__content.method .ph-small.ph10 .text-box {
      width: 32%;
      right: 8%;
      bottom: -30px;
    }

    #aff-contents .p-point__content.method .ph-small.ph05 .ph-box,
    #aff-contents .p-point__content.method .ph-small.ph06 .ph-box {
      margin: 0;
      width: 73.2%;
    }
    #aff-contents .p-point__content.method .ph-small.ph06 .ph-box {
      margin-left: 26.8%;
    }
    #aff-contents .p-point__content.method .ph-small.ph05 .text-box {
      width: 28%;
      right: 5%;
      top: 30px;
    }
    #aff-contents .p-point__content.method .ph-small.ph06 .text-box {
      width: 43%;
      left: 0;
      top: 30px;
    }
    @media screen and (max-width: 768px) {
      #aff-contents .p-point__content.method .ph-small.ph10 {
        padding: 0;
      }
      #aff-contents .p-point__content.method .ph-small.ph10 .ph-box, 
      #aff-contents .p-point__content.method .ph-small.ph05 .ph-box,
      #aff-contents .p-point__content.method .ph-small.ph06 .ph-box {
        margin: 0 0 1em;
        width: 100%;
      }
      #aff-contents .p-point__content.method .ph-small.ph10 .text-box,
      #aff-contents .p-point__content.method .ph-small.ph05 .text-box,
      #aff-contents .p-point__content.method .ph-small.ph06 .text-box {
      width: 100%;
      right: auto;
      top: auto;
      bottom: auto;
      left: auto;
      }
    }