/* ====== 使用中のCSSのみ ====== */

/* 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;
}

/* 執筆者 */
.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,
.content_wrap a {
  background: linear-gradient(transparent 95%, #ccc 0%);
}
p.lead {
  font-weight: 400;
  text-align: left;
  margin: 10px 0;
}
p.lead span.atc {
  color: #53BBCC;
  font-weight: bolder;
}

/* 強調用 */
.lead span.bbold {
  color: #53BBCC;
  font-weight: 700;
  display: block;
}

/* 強調用2 */
.lead span.bbold2 {
  padding-top: 10px;
  color: #53BBCC;
  font-weight: 700;
  display: block;
}


/* 引用 */
.quote {
  font-size: 10px;
  text-align: right;
  margin-top: 5px;
  font-weight: normal;
}

/* マーカー */
.markerYellow {
  background: linear-gradient(transparent 50%, #fdffa6 0%);
}

/* セクション見出し */
.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%;
}

/* 見出し青枠 */
.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;
}

/* 目次 */
.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 {padding: 1em 1em 1em 3em;}
.toc-002 ol {list-style-type: decimal; margin: 0; overflow: hidden;}
.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;}

/* 画像共通 */
div.group1 img,
div.group2 img,
div.group3 img,
div.group4 img,
div.group5 img,
div.group6 img {
  max-height: 480px;
  margin: 0 auto 0;
  display: block;
  text-align: center;
}

/* suggest */
.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);
}

/* suggest4 */
.suggest4 {
  background-color:#F7FEFF;
  margin-top:20px;
  padding:1em;
  color:#000;
}
.suggest4 ul {
  list-style:none;
  margin:0;
  padding-left:0;
}
.suggest4 li {
  position:relative;
  text-align:left;
  padding-left:1.2em;
  font-weight:400;
  font-size:16px;
  line-height:1.8;
  margin-top:10px;
}
.suggest4 li::before {
  content:'・';
  position:absolute;
  left:0;
  top:0;
  pointer-events:none;
}

/* 他の人はこんな記事も読んでいます */
.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:0 .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;
}

/* よくある質問 */
.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 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);
}
.summary ul {
  list-style: disc;
  font-size: 0.9em;
  margin: 1em 0 0 1.5em;
}
.summary span {font-weight: 700;}

/* group6 h3 */
.group6 h3 {
  padding: .5em;
  line-height: 1.4;
  border-top: dotted 1px gray;
  border-bottom: dotted 1px gray;
  background: #FFFFF4;
  margin: 2em 0 0.5em;
  font-size: 16px;
}

/* おすすめ記事 */
.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 0;
  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);}


/*修正調整用*/
.group6 h3{
margin:0px 0px 20px 0px;
}
.group6 p.lead a{
*display:none;
padding:100px 0px 10px;
}
ul.group6link li {
padding:10px 0px 20px;
font-weight: normal;
}

#center .detail .date {
    display: inline-block;
    margin-right: 20px;
    text-align: left;
    font-size: 13px;
    font-weight: 400;
}

/* レスポンシブ */
@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:.8em;}
  .hokanohito_box span {padding:1em;font-size:.9em;}
}