/* PR表記 */

.pr_box {
  font-weight: 400;
  font-size: 0.7em;
  background-color: #f0f0f0;
  padding: 1em;
  margin-bottom: 2em;
}

/* 記事タイトル */

#center .title_area h1 {
  margin-bottom: 20px;
  font-size: 30px;
  line-height: 1.5;
  font-weight: 700;
  font-family: "Yu Mincho","游明朝体","YuMincho","Noto Serif JP","serif";
  text-align: left;
  margin-top: 0;
}

/* 投稿日 */

#center .detail .date {
  display: inline-block;
  margin-right: 20px;
  text-align: left;
  font-size: 13px;
  font-weight: 400;
}

/* 執筆者 */

.writer {
  text-align: right;
  font-size: 13px;
  margin-bottom: 10px;
  font-weight: 400;
}

/* リード文 */

.title_area .lead {
  text-align: left;
  margin-top: 10px;
  font-weight: 400;
}

.title_area p a {
  background: linear-gradient(transparent 95%, #ccc 0%);
}

/* おすすめ */

.suggest {
  background-color: #f8e3e5;
  margin-top: 20px;
  padding: 10px 10px 20px 10px;
}

.suggest p {
  color: #e16b79;
  font-weight: 700;
  text-align: center;
}

.suggest ul {
  position: relative;
  list-style-type: none;
}

.suggest li {
  position: relative;
  text-align: left;
  padding-left: 38px;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
}

.suggest li::after {
  content: "";
  display: block;
  position: absolute;
  top: .5em;
  left: 1.2em;
  width: 10px;
  height: 5px;
  border-left: 2px solid #e16b79;
  border-bottom: 2px solid #e16b79;
  transform: rotate(-45deg);
}

/*----------------- 
       本文
---------------------
*/

/*-----
みだし
-----
*/

.section_title {
  font-size: 25px;
  font-weight: 700;
  margin-top: 60px;
  padding: 5px 5px 5px 30px;
  position: relative;
}

.section_title:before {
  background-color: #ef858c;
  border-radius: 5px;
  content: "";
  position: absolute;
  top: 0;
  left: 3px;
  width: 8px;
  height: 95%;
}

.section_title:after {
  background-color: #f3cbd0;
  border-radius: 5px;
  content: "";
  position: absolute;
  top: 0;
  left: 15px;
  width: 8px;
  height: 95%;
}

/*-----
テキスト、テキストリンク
-----
*/

p.lead {
  font-weight: 400;
  text-align: left;
  margin: 10px 0px;
}

/* 引用 */

.small {
  font-size: 13px;
}

.quote {
  font-size: 10px;
  text-align: right;
  margin-top: 5px;
  font-weight: normal;
}

/* よくある質問 */

.summary {
  border: #fff2a9 solid 15px;
  margin-top: 50px;
}

.question {
  background-color: #fff2a9;
  height: 50px;
  text-align: center;
  font-weight: 700;
  line-height: 35px;
  font-size: 23px;
}

.summary dl dt {
  background-color: #ceeff5;
  font-weight: 700;
  padding: 0 0.2em 0 2em;
  line-height: 30px;
  margin: 15px 10px;
  font-size: 15px;
}

.summary dl dt p {
  padding: 5px;
}

.summary dl dd {
  margin: 10px 10px 20px 45px;
  font-size: 15px;
  font-weight: normal;
}

.summary dl dd ul {
  list-style-type: disc;
  padding-left: 20px;
  font-size: 13px;
}

.summary dt::before {
  font-size: 1.5em;
  color: #53bbcc;
  float: left;
  margin: -.1em .4em 0 -1em;
  content: "Q";
}

.summary dd::before {
  margin: 0 .5em 0 -1.6em;
  padding: 10px 0 0 10px;
  content: "A";
  border-radius: .2em;
  font-size: 1.5em;
  color: #e16a78;
  font-weight: 700;
}

.stripe_summary {
  position: relative;
}

.stripe_summary:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 107%;
  height: 12px;
  margin-top: -25px;
  margin-left: -15px;
  background: repeating-linear-gradient(-45deg,#fff2a9,#fff2a9 5px,white 5px,white 10px);
}



/* マーカー */

.markerBlue {
  background: linear-gradient(transparent 50%, #53bbcc 100% );
}

.markerOrange {
  background: linear-gradient(transparent 50%, #fcc778 100% );
}

.markerdeepBlue {
  background: linear-gradient(transparent 50%, #d4eaff 0% );
}

.markerYellow {
  background: linear-gradient(transparent 50%, #fdffa6 0%);
}

/* ブルー付箋 */

.box23_blue {
  display: block;
  padding: 5px 20px;
  border-left: solid 5px #53bbcc;
  box-shadow: 3px 1px 4px rgb(0 0 0 / 20%);
  font-weight: 700;
  margin-top: 3em;
}

.box23_pink {
  display: block;
  padding: 5px 20px;
  border-left: solid 5px #f09080;
  box-shadow: 3px 1px 4px rgb(0 0 0 / 20%);
  font-weight: 700;
  margin-top: 3em;
}

.box23_green {
  display: block;
  padding: 5px 20px;
  border-left: solid 5px #9aba02;
  box-shadow: 3px 1px 4px rgb(0 0 0 / 20%);
  font-weight: 700;
  margin-top: 3em;
}

.box23_yellow {
  display: block;
  padding: 5px 20px;
  border-left: solid 5px #f0bd26;
  box-shadow: 3px 1px 4px rgb(0 0 0 / 20%);
  font-weight: 700;
  margin-top: 3em;
}


/* group2微調整 */

.group2 ul li img {
  margin: 2em auto 0;
  display: block;
}

.group2 .none a {
  background: none;
}

.hokanohito_box ul li img {
  margin: 0;
}

/* この記事を読んだ人におすすめ */

.recommend_box {
  background: #fff;
  box-shadow: 1px 1px 8px -5px #53bbcc;
  margin-top: 3em;
}

.recommend_box p {
  text-align: center;
  padding-top: 1.5em;
  font-size: 1.2em;
}

.recommend_box ul {
  padding: 1.5em;
  font-size: 0.9em;
}

.recommend_box ul li {
  padding: 1em 0em 1em;
  box-shadow: 0 2px 3px rgb(83 187 204 / 20%);
  margin-top: 0.5em;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.recommend_box ul li img {
  width: 25%;
  float: left;
  padding-left: 0.5em;
}

.recommend_box ul li span {
  padding: 1.7em 1em;
  display: flex;
}

.recommend_box ul li::after {
  background: #ceeff5;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}

.recommend_box ul li:hover::after {
  transform: scale(1, 1);
}

/* ＼他の人はこんな記事も読んでいます／ */

.hokanohito_box {
  background: #fff;
  box-shadow: 1px 1px 8px -5px #000;
  margin: 3em 0;
}

.hokanohito_box p {
  padding: 1em 0 0 1em;
  font-size: 0.8em;
}

.hokanohito_box ul {
  padding: 0em .5em .5em .5em;
  font-size: 0.9em;
}

.hokanohito_box ul li {
  margin-top: 0.5em;
  padding: .5em;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.hokanohito_box img {
  width: 25%;
  float: left;
  box-shadow: 0 2px 3px rgb(0 0 0 / 20%);
}

.hokanohito_box span {
  padding: 1.7em 1em;
  display: flex;
}

.hokanohito_box ul li::after {
  background: #fcf0b1;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}

.hokanohito_box ul li:hover::after {
  transform: scale(1, 1);
}

.hokanohito_box .markergray {
  background: linear-gradient(transparent 0%, #e3e1e1 100%);
  padding: 0;
  display: inline;
}

/* ブルー点線ボックス */

.blue_dashed_box {
  border: 2px dashed #53bbcc;
  padding: 1em;
  margin: 2em 0;
}

.blue_dashed_box h4 {
  color: #53bbcc;
  margin-bottom: .5em;
}

.blue_dashed_box h3 {
  color: #53bbcc;
  margin-bottom: .5em;
}

.blue_dashed_box p {
  font-weight: 400;
}

.blue_dashed_box ul.skyblue_box2 {
  font-weight: 400;
  background-color: #f0fdff;
  font-size: .8em;
  list-style: none;
  padding: .5em 1em 1em;
  margin: 1em 0;
}

.blue_dashed_box ul.skyblue_box2 li {
  padding: 5px;
  border-bottom: dashed 1px #53bbcc;
}

.blue_dashed_box ul.skyblue_box2 li span {
  color: #53bbcc;
  font-weight: 700;
}

.skyblue_box {
  background-color: #f0fdff;
  padding: 1em;
  margin-top: 1em;
  font-size: .8em;
}

.skyblue_box_title {
  color: #53bbcc;
}

/* ピンク点線ボックス */

.pink_dashed_box {
  border: 2px dashed #f09080;
  padding: 1em;
  margin: 2em 0;
}

.pink_dashed_box h4 {
  color: #f09080;
  margin-bottom: .5em;
}

.pink_dashed_box p {
  font-weight: 400;
}

.pink_dashed_box ul.pink_box2 {
  font-weight: 400;
  background-color: #fff0ed;
  font-size: .8em;
  list-style: none;
  padding: .5em 1em 1em;
  margin: 1em 0;
}

.pink_dashed_box ul.pink_box2 li {
  padding: 5px;
  border-bottom: dashed 1px #f09080;
}

.pink_dashed_box ul.pink_box2 li span {
  color: #f09080;
  font-weight: 700;
}

.pink_box {
  background-color: #fff0ed;
  padding: 1em;
  margin-top: 1em;
  font-size: .8em;
}

.pink_box_title {
  color: #f09080;
}

/* グリーン点線ボックス */

.green_dashed_box {
  border: 2px dashed #9aba02;
  padding: 1em;
  margin: 2em 0;
}

.green_dashed_box h4 {
  color: #9aba02;
  margin-bottom: .5em;
}

.green_dashed_box p {
  font-weight: 400;
}

.green_dashed_box ul.green_box2 {
  font-weight: 400;
  background-color: #f9ffde;
  font-size: .8em;
  list-style: none;
  padding: .5em 1em 1em;
  margin: 1em 0;
}

.green_dashed_box ul.green_box2 li {
  padding: 5px;
  border-bottom: dashed 1px #9aba02;
}

.green_dashed_box ul.green_box2 li span {
  color: #9aba02;
  font-weight: 700;
}

.green_box {
  background-color: #f9ffde;
  padding: 1em;
  margin-top: 1em;
  font-size: .8em;
}

.green_box_title {
  color: #9aba02;
}

/* イエロー点線ボックス */

.yellow_dashed_box {
  border: 2px dashed #f0bd26;
  padding: 1em;
  margin: 2em 0;
}

.yellow_dashed_box h4 {
  color: #f0bd26;
  margin-bottom: .5em;
}

.yellow_dashed_box p {
  font-weight: 400;
}

.yellow_dashed_box ul.yellow_box2 {
  font-weight: 400;
  background-color: #fff9e8;
  font-size: .8em;
  list-style: none;
  padding: .5em 1em 1em;
  margin: 1em 0;
}

.yellow_dashed_box ul.yellow_box2 li {
  padding: 5px;
  border-bottom: dashed 1px #f0bd26;
}

.yellow_dashed_box ul.yellow_box2 li span {
  color: #f0bd26;
  font-weight: 700;
}

.yellow_dashed_box .yellow_box {
  background-color: #fff9e8;
  padding: 1em;
  margin-top: 1em;
  font-size: .8em;
}

.yellow_dashed_box .yellow_box_title {
  color: #f0bd26;
}

/* 目次 */

.read-more-2 {
  position: relative;
  margin: 3em 0;
}

.read-more-2 .toc-002 .toc-002_box {
  display: -webkit-box;
  position: relative;
  margin-bottom: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  /* 開く前に見せたい行数を指定 */
}

.read-more-2:has(:checked) .toc-002 .toc-002_box {
  display: block;
}

.read-more-2 .toc-002 .toc-002_box::after {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 60px;
  background: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 0, hsla(0, 0%, 100%, .9) 50%, hsla(0, 0%, 100%, .9) 0, #fff);
  content: "";
}

.read-more-2:has(:checked) .toc-002 .toc-002_box::after {
  content: none;
}

.read-more-2 label {
  display: flex;
  align-items: center;
  gap: 0 4px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  color: #53bbcc;
  font-size: .8em;
}

.read-more-2 label:hover {
  color: #c7511f;
  text-decoration: underline;
  cursor: pointer;
}

.read-more-2:has(:checked) label {
  display: none;
}

.read-more-2 label::after {
  display: inline-block;
  width: 10px;
  height: 5px;
  background-color: #b6bdc3;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: "";
}

.read-more-2 input {
  display: none;
}

.toc-002 {
  margin-bottom: 30px;
  border-radius: 3px;
  background-color: #fbfbfb;
}

.toc-002 div {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 10px 0;
  background-color: #53bbcc;
  color: #fff;
  font-weight: 600;
  font-size: 1.1em;
}

.toc-002 div::before {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 5px;
  background-image: url("data:image / svg+xml,%3Csvg xmlns='http: /  / www.w3.org / 2000 / svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 4H21V6H8V4ZM3 3.5H6V6.5H3V3.5ZM3 10.5H6V13.5H3V10.5ZM3 17.5H6V20.5H3V17.5ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z' fill='%23fff'%3E%3C / path%3E%3C / svg%3E");
  content: "";
}

.toc-002 ol {
  list-style-type: decimal;
  margin: 0;
  overflow: hidden;
}

.toc-002 > ol {
  padding: 1em 1em 1em 3em;
}

.toc-002 ol ol {
  margin-top: 5px;
  list-style: none;
}

.toc-002 li {
  padding: 5px 0;
  font-weight: 600;
}

.toc-002 ol ol li {
  font-weight: 500;
  font-size: .9em;
}

.toc-002 a {
  color: #333;
  text-decoration: none;
}

.group1 table {
  border-right: 1px solid #ccc;
}

.group1 th {
  color: #000;
  text-align: center;
  width: 25%;
  background-color: #53bbcc;
  font-size: 12px;
  padding: 10px;
  font-weight: 400;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.group1 td {
  font-size: 12px;
  padding: 3px;
  border-collapse: collapse;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  text-align: center;
}

@media only screen and (max-width: 1279px) {
  #center .area {
    width: 100%;
  }

  .stripe_summary:after {
    width: 105.5%;
  }
}

@media screen and (max-width: 767px) {
  main #center .title_area h1 {
    font-size: 25px;
  }

  main .title_area p.writer {
    line-height: 1.2;
  }

  .section_title {
    font-size: 23px;
  }

  h2 {
    font-size: 20px;
  }

  .suggest li {
    font-size: 14px;
  }

  main .title_area p {
    line-height: 1.5;
  }

  .stripe_summary:after {
    width: 108.5%;
  }

  .recommend_box ul li span {
    padding: 1em;
    font-size: 0.8em;
  }

  .hokanohito_box span {
    padding: 1em;
    font-size: 0.9em;
  }
}

/* スライダー */

.slick-dotted.slick-slider {
  width: 300px;
  margin: 0 auto 30px;
}

.content_wrap .slider_img img {
  margin: 10px auto;
  display: block;
  width: 300px;
}

.attention {
  font-weight: 400;
  margin: 1em auto 3em;
  font-size: 0.9em;
  background-color: #fff;
  padding: 20px;
  border: 5px dotted #ccc;
}

.suggest5 {
  background-color: #f4ffff;
  padding: 5px 0 5px;
}

.suggest5 ul {
  list-style: none;
  font-size: 12px;
  margin: 0;
}

.suggest5 li {
  position: relative;
  text-align: left;
  font-weight: 100;
  font-size: 14px;
  padding: 0px 15px 10px;
}

/*div.group1 img,
div.group3 img,
div.group4 img {
 max-height:480px;
 margin: 0px auto 0px;
 display: block;
}
*/

div.group1 img,
div.group2 img,
div.group3 img,
div.group4 img,
div.group5 img {
  max-height: 480px;
  margin: 0 auto;
  display: block;
}

.container tr:nth-of-type(odd) {
  background: #fafafa;
}

th {
  color: #fff;
  background-color: #4a86e8;
  font-size: 12px;
  padding: 3px;
  text-align: center;
  font-weight: 400;
}


.group2 ul {
  list-style: none;
}


h3 {
  margin: 1.5em 0 1em;
  font-size: 16px;
}

.table-ul {
  list-style: none;
  /* 大枠のulは・を消す */
  padding: 0;
  width: 95%;
  margin: 20px auto;
}

.table-ul > li {
  border-top: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-left: 1px solid #ccc;
  padding: 0px 0px 10px;
  font-weight: 100;
}

.table-ul > li:last-child {
  border-bottom: 1px solid #ccc;
  /* 見出し下にボーダー */
}

.table-ul > li > strong {
  display: block;
  font-weight: bold;
  padding: 10px 0px 10px 10px;
  border-bottom: 1px solid #ccc;
  /* 見出し下にボーダー */
  background-color: #e6f6f6;
  font-size: 12px;
}

/* 内側のulは通常の・を表示 */

.table-ul ul {
  margin-top: 8px;
  padding-left: 20px;
  padding-right: 10px;
  /*list-style: disc;*/
  font-size: 12px;
}

.custom-table-ul {
  font-size: 12px;
  width: 95%;
  list-style: none;
  margin: auto;
  padding: 0;
  border: 1px solid #ccc;
  /* 外枠（上下左右） */
  border-bottom: none;
  /* 行ごとに下線で調整するので不要 */
}

.custom-table-ul li {
  display: flex;
  justify-content: flex-start;
  padding: 0;
  border-bottom: 1px solid #ccc;
  font-weight: 100;
}

.custom-table-ul li .col-left {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 8px;
  border-right: 1px solid #ccc;
  /* 左と右の区切り線 */
  box-sizing: border-box;
}

.custom-table-ul li .col-right {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 8px;
  box-sizing: border-box;
  /* 右端には border-right を付けない（ul の外枠を使う） */
}

.custom-table-ul .table-header .col-left,
.custom-table-ul .table-header .col-right {
  background: #e6f6f6;
  font-weight: bold;
}

/* 20251023 */

ul.inside_list {
  list-style: inside;
}

.table-ul > li > b {
  display: block;
  font-weight: bold;
  padding: 10px 0px 10px 10px;
  border-bottom: 1px solid #ccc;
  background-color: #e6f6f6;
  font-size: 12px;
}

div.group3 ul.table-ul ul {
  margin-top: 8px;
  padding-left: 20px;
  padding-right: 10px;
  list-style: none;
  font-size: 12px;
}

.box_white_s {
  box-shadow: 1px 1px 8px -5px #000;
  margin: 10px 0 10px;
  padding: 10px 10px;
}

/* 追加分 */

.list-3 {
  list-style-type: none;
  font-size:15px;
}

.list-3 li {
  align-items: center;
  padding: 1.0em;
  border-bottom: 1px solid #e1f0ff;
}

.list-3 li::before {
  display: inline-block;
  width: 10px;
  height: 5px;
  border-bottom: 2px solid #2589d0;
  border-left: 2px solid #2589d0;
  transform: rotate(-45deg) translateY(-1.5px);
  content: "";
}

.checklist {
  width: 100%;
  background-color: #f4ffff;
  border: 3px solid #e1f0ff;
  min-width: 335px;
  margin: 50px auto 0px;
  padding: 5px 15px 20px;
}

/* 口コミ */

.balloon1 {
  font-weight: normal;
  position: relative;
  margin: 1.5em 0;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  font-size: 15px;
  background: #fff;
  border: solid 3px #ececec;
  box-sizing: border-box;
  border-radius: 20px;
}

.balloon1:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #fff;
  z-index: 2;
}

.balloon1:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #ececec;
  z-index: 1;
}

.table-list {
  margin: 0 auto 0;
  padding: 0;
  list-style: none;
  display: table;
  border-collapse: collapse;
  width: 96%;
}

.table-list>li {
  display: table-row;
}

.table-list>li>ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: contents;
}

.table-list>li>ul>li {
  font-size: 12px;
  display: table-cell;
  border: 1px solid #ccc;
  padding: 4px 8px;
  vertical-align: middle;
}

.table-list .thead>ul>li {
  font-weight: bold;
  text-align: center;
}

.table-list .tbody>ul>li {
  text-align: center;
}

.table-list .tbody>ul>li:first-child,
              .table-list .tbody>ul>li:nth-child(2),
              .table-list .tbody>ul>li:nth-child(3) {
  text-align: center;
}

ul.m_color li {
  background-color: #53bbcc;
  color: #fff;
}

.container li.tbody:nth-of-type(odd) {
  background: #fafafa;
}

/* UL/LIの中の表 ここから */

.ring-diagnosis-table {
  list-style: none !important;
  margin: 20px 0 !important;
  padding: 0 !important;
  border: 1px solid #ccc;
  width: 100%;
  box-sizing: border-box;
}

.ring-diagnosis-table>li {
  font-size: small;
  list-style: none !important;
  margin: 0 !important;
  padding: 12px 15px !important;
  border: none;
  border-bottom: 1px solid #ccc;
  box-sizing: border-box;
}

.ring-diagnosis-table>li::before,
              .ring-diagnosis-table>li::after {
  content: none !important;
  display: none !important;
}

.ring-diagnosis-table>li:last-child {
  border-bottom: none;
}

.ring-diagnosis-table__head {
  font-weight: bold;
  background: #e6f6f6;
}

.ring-diagnosis-table__row {
  background: #fff;
}

.ring-diagnosis-table__row a {
  text-decoration: underline 1px solid #cfcfcf;
  font-weight: 100;
  display: block;
}

/* UL/LIの中の表 ここまで */


.content_wrap .summary a {
  text-decoration: underline 1px solid #cfcfcf;
}