@charset "utf-8";
/* CSS Document */

h2.tuyomi{
  font-size: 20px;
  display: block;
  width: fit-content;
  padding: 2px 24px;
  color: #fff;
  background-color: #000;
  margin: 40px auto 10px;
	font-weight: bold;
}


/* 6つの強み */
 .btseaWrap{
      max-width:920px;margin:0 auto;padding:24px 16px;
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,
      "Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic","Meiryo",Arial,sans-serif;
      color:#111;line-height:1.8;
    }
    .btseaList{display:grid;gap:14px;}

    /* 罫線(右・下)と背景の間に「余白」を作るため、
       外側: 罫線用ラッパー / 内側: 背景のボックス に分けます */
    .btseaItem{
      border-right:1px solid #111;
      border-bottom:1px solid #111;
      padding-right:10px;  /* ←右の罫線までの余白 */
      padding-bottom:10px; /* ←下の罫線までの余白 */
      background:transparent;
    }
    .btseaItemInner{
      background:#fff;
      padding:14px 18px;
    }

    .btseaItemText{margin:0;font-size:18px;font-weight:bold;letter-spacing:.01em;}
    .btseaEmRed{font-size:18px;font-weight:bold;color:#e60012;}

    .btseaBottom{margin-top:22px;text-align:center;}
    .btseaBottomLead{margin:22px 0 10px;font-size:20px;font-weight:700;}

    /* 2行になっても各行に黄色ラインが入るマーカー */
    .btseaMarker{
      display:inline;
      padding:0 .25em;
      line-height:1.9;
      font-size:18px;
      font-weight:800;
      background:linear-gradient(transparent 62%, #ffe94a 62%);
      -webkit-box-decoration-break:clone;
      box-decoration-break:clone;
    }

    @media (max-width:600px){
      .btseaItem{padding-right:8px;padding-bottom:8px;}
      .btseaItemInner{padding:12px 14px;}
      .btseaItemText{font-size:18px;}
      .btseaBottomLead{font-size:18px;}
      .btseaMarker{font-size:16px;}
    }

/* =========================
   lead01 - Responsive text
   ========================= */

.lead01{
  /* base */
  font-size: clamp(0.8rem, 0.9vw + 0.7rem, 1.15rem); /* 端末幅に応じて可変 */
  line-height: 1.6;
  letter-spacing: 0.02em;
  margin: 0 auto;
  color: #222;
		font-weight: bold;

  /* 文章が長いので読みやすさ優先 */
  max-width: 68ch;             /* 1行を長くしすぎない */
  padding: 0.6em 0.9em;
  border-left: 4px solid rgba(0,0,0,.12);
  background: #fff;
  border-radius: 10px;

  /* 改行や長い単語対策 */
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
	text-align: justify;
}

/* brが多いので、狭い画面では間延びしすぎないようにする */
@media (max-width: 480px){
  .lead01{
    line-height: 1.9;
    padding: 0.7em 0.85em;
    border-left-width: 3px;
    max-width: 100%;
  }
}

/* タブレット */
@media (min-width: 481px) and (max-width: 1024px){
  .lead01{
    line-height: 1.85;
    padding: 0.85em 1.0em;
  }
}

/* PC */
@media (min-width: 1025px){
  .lead01{
    line-height: 1.8;
    padding: 0.9em 1.2em;
  }
}


  /* ===== wrapper ===== */
    .hs3Wrap {
      max-width: 920px;
      margin: 0 auto;
      padding: 24px 16px;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP",
        "Yu Gothic", "Meiryo", Arial, sans-serif;
      color: #123;
      line-height: 1.75;
			font-weight: bold;
    }

    /* ===== top title ===== */
    .hs3Title {
  font-size: 20px;
  display: block;
  width: fit-content;
  padding: 2px 24px;
  color: #fff;
  background-color: #000;
  margin: 40px auto 10px;
			font-weight: bold;
    }
    .hs3TitleRow {
      text-align: center;
      margin-bottom: 26px;
    }

    /* ===== cards grid ===== */
    .hs3Grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
    }

    .hs3Card {
      position: relative;
      background: #4b9bd3;
      border-radius: 10px;
      padding: 30px 18px 18px;
      box-shadow: 0 6px 0 rgba(0,0,0,.15);
      min-height: 210px;
    }

    /* number circle */
    .hs3Num {
      position: absolute;
      top: -18px;
      left: 18px;
      width: 46px;
      height: 46px;
      border-radius: 999px;
      background: #fff;
      border: 3px solid #4b9bd3;
      display: grid;
      place-items: center;
      	font-weight: bold;
      color: #4b9bd3;
      font-size: 18px;
      box-shadow: 0 2px 0 rgba(0,0,0,.10);
    }

    /* inner label */
    .hs3Label {
      display: inline-block;
      color: #fff;
      font-weight: 800;
      font-size: 18px;
      padding: 6px 16px;
      border: 1px solid rgba(255,255,255,.95);
      background: rgba(0,0,0,.05);
      border-radius: 2px;
      margin: 6px auto 12px;
    }
    .hs3LabelRow {
      text-align: center;
    }

    .hs3Text {
      margin: 0;
      color: rgba(255,255,255,.95);
      font-size: 16px;
		text-align: justify;
    }


h4.form_come{font-size: 12px;line-height: 20px;font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";}

    /* ===== responsive ===== */
    @media (max-width: 820px) {
      .hs3Grid { grid-template-columns: 1fr; }
      .hs3Card { min-height: auto; }
      .hs3Num { left: 14px; }
    }

    @media (max-width: 420px) {
      .hs3Title { font-size: 14px; padding: 9px 14px; }
      .hs3Label { font-size: 15px; padding: 9px 14px; }
      .hs3Text  { font-size: 13px; }
    }

.magazine_link{
	width: 100%;
	max-width: 920px;
	text-align: center;
	margin: 0 auto;
}

.bana_box img{
	width: 100%;
	height: auto;
	  transition: opacity .2s ease;
}

.bana_box:hover img{
	opacity: .65; 
}


@media (max-width: 620px) {
	.line_bana{margin-top: -40px;margin-bottom: 40px!important}

	.top_margin{margin-top: 40px;margin-bottom: -2px;}
	.feature_summary img{width: 15%!important; height: auto!important}
}