@charset "UTF-8";
/*診断チャート*/
.flow-box {
    border: 2px solid #f5f5f5;
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 12px;
    font-size: 13px;
    background-color: #f7f7f7;
    line-height: 1.6;
}
.flow-question {
  font-weight: bold;
  margin-bottom: 8px;
}
.flow-answer {
  margin-left: 12px;
}
.flow-arrow {
  text-align: center;
  font-size: 15px;
  color: #d3d3d3;
}

/*赤文字*/
.red {
  color: #ff0000;
  font-weight: bold;
}

/*QA*/
.question2::before {
    color: #000;
}

/* ｈ３左右に三角形をつける */
.tryanglebox {
    margin: 0 auto 2em; /* 外側の余白（上下と中央配置） */
    padding: 2em; /* 内側余白 */
    position: relative; /* 相対位置指定 */
    text-align: center;
}

.tryanglebox:before {
    border-bottom: 30px solid transparent; /* 上側に透明の三角形 */
    border-left: 30px solid #000000; /* 左側の三角形（色は#c6d4c6） */
    content: ''; /* 擬似要素にコンテンツなし */
    display: block; /* ブロック要素として表示 */
    position: absolute; /* 絶対位置指定 */
    left: 0px; /* 左から0px */
}

.tryanglebox:after {
    border-left: 30px solid transparent; /* 右側に透明の三角形 */
    border-bottom: 30px solid #000000; /* 下側の三角形（色は#c6d4c6） */
    content: ''; /* 擬似要素にコンテンツなし */
    display: block; /* ブロック要素として表示 */
    position: absolute; /* 絶対位置指定 */
    bottom: 0px; /* 下から0px */
    right: 0px; /* 右から0px */
}

/* pタグの余白 */
.tryanglebox p {
    margin: 0;
}


.soft-container {
  background: #ffffff;          
  border: 1.5px solid #c0c0c0; /* 枠線 */
  border-radius: 16px;          /* 角丸 */
  padding: 24px 30px;           /* 内側の余白しっかり */
  box-shadow: 0 4px 12px rgba(211, 225, 245, 0.4); /* ふんわり柔らかい影 */
  font-family: "Yu Gothic", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  color: #333;                  /* 文字は読みやすい濃さ */
  max-width: 900px;
  margin: 30px auto;
  line-height: 1.7;
}

/*スマホ横ずれ禁止*/
body {
  margin: 0;
}

body * {
  box-sizing : border-box;
}    

/*スマホのヘッダー見切れ防止*/
.img-header {
  width: 100%;
  height: auto;
  max-width: 100%;
  display: block;
}

/*H1表示されないので表示*/
.logo-horizon .logotext {
  display: block; /* または inline, inline-block など明示的に */
}

/*文字サイズ デスクトップ（1024px以上)*/
@media (min-width: 1024px){
    h1 {
    font-size: 15px;
    }
   .headerimg-title {
    font-size: 20px;
  }
  .headerimg-desc {
      font-size: 15px;
  }
    .voice_body .voice_inner {
       font-size: 15px;
}
}    

/*文字サイズ タブレット (768px〜1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
  h1 {
    font-size: 14px;
    }
   .headerimg-title {
    font-size: 17px;
  }
  .headerimg-desc {
      font-size: 14px;
  }
    .voice_body .voice_inner {
       font-size: 13px;
}
  }

/*文字サイズ スマホ (0〜767px)*/
@media (max-width: 767px) {
  h1 {
    font-size: 12px;
  }
  .headerimg-title {
    font-size: 14px;
  }
   .headerimg-desc {
      font-size: 12px;
  }
  .voice_body .voice_inner {
       font-size: 12px;
}
}

/* スマホ（～430px）でメニュー表示 */
@media (max-width: 430px) {
  div#spmenu {
    display: block;
  }
}

/* タブレット（431px～1024px）でメニュー表示 */
@media (min-width: 431px) and (max-width: 1024px) {
  div#spmenu {
    display: block;
  }
}

/* PC（1025px～）でメニュー非表示 */
@media (min-width: 1025px) {
  div#spmenu {
    display: none;
  }
}

/*囲みボックス内行間*/
ul:not([id]):not([class]), ol:not([id]):not([class]) {
    line-height: 1.7;
}


/*サイトマップメニュー*/
.menubox > .title i.subtitle {
    display: block;
    margin-left: 0;
}

/*サイトマップ真ん中*/
.footer-menu_ul {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 1em 4em;
    text-align: center;
}
@media (min-width: 1025px) {
  #footer-menu {
    display: flex;
    justify-content: center;
    width: 100%;
  }

  .footer-menu_ul {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;   /* 縦方向中央揃え（オプション） */
    padding: 0;
    margin: 0 auto;
    list-style: none;
    text-align: center;
  }

  .footer-menu_ul li {
    margin: 0 10px;
  }
}

/*スマホ時だけテーブルの文字左寄り*/
@media screen and (max-width: 768px) {
  .table-wrap td,
  .table-wrap th {
    text-align: left !important;
  }
}

/*シミの種類の表スマホ時見やすく*/
.table-wrap td p {
  margin: 0;
}
.table-wrap td, .table-wrap th {
  padding: 4px 8px;
}
@media screen and (max-width: 768px) {
  .table-wrap td p {
    margin: 0;
    line-height: 1.4;
  }
}

/*検索バナー見切れ予防*/
#searchresult .article-thumb img {
    width: 100%;
    /* aspect-ratio: 3 / 2; */
    /* object-fit: cover; */
    height: auto;
    object-fit: contain;
    display: block;
}

/*スマホ時だけサイトマップの本文隠す*/
@media screen and (max-width: 767px) {
  body[data-page="sitemap"] main {
    display: none;
  }
}

/*左角三角のグレーの枠改行点ありの行間と文字ちいさく*/
.cbox-simple04 {
    margin: 15px auto 2rem;
    line-height: 2.7rem;
    position: relative;
    z-index: 0;
    padding: 20px;
    background-color: #fff;
    border: 2px solid #dadada;
    font-size: small;
}

/*内部リンクボタン*/
.button-wrapper {
  text-align: center; /* 中央配置 */
  margin: 2em 0;
}

.smart-button {
  display: inline-block;
  padding: 14px 36px;
  font-size: 1.3rem; /* 少し大きめの文字 */
  color: #000;
  background-color: #fff;
  border: 2.5px solid #000;
  border-radius: 0;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease,
    transform 0.1s ease;
}

.smart-button:hover,
.smart-button:focus {
  background-color: #000;
  color: #fff;
  border-color: #fff;
}

.smart-button:active {
  transform: scale(0.96); /* 押し込まれたように */
}

/*こんな方におすすめ文字小さめ*/
.cbox-simple06 {
    margin: 15px auto 2rem;
    line-height: 1.8rem;
    position: relative;
    z-index: 0;
    padding: 21px;
    background-color: #fff;
    border: 1px solid #c1c1c1;
    z-index: 0;
    font-size: small;
}

/*グレーボックスの文字小さめ*/
.nmlbox, .graybg {
    padding: 1.5em;
    margin-top: 1em;
    margin-bottom: 1em;
    clear: both;
    overflow: hidden;
    font-size: small;
}

/* 汎用：スマホ時はmainに下余白 */
@media screen and (max-width: 767px) {
  main {
    padding-bottom: 50px;
  }
}

/* サイトマップ専用：スマホ時だけ本文を非表示にし、余白を詰める */
@media screen and (max-width: 767px) {
  body[data-page*="sitemap"] main {
    padding-bottom: 0 !important;
  }

  body[data-page*="sitemap"] .sitemaps_ul {
    display: none;
  }
 
   body[data-page*="sitemap"] #main-footer {
    padding-top: 10px; /*フッターとくっついて見えるから少し開ける*/
  }
}

/*リンクの色*/
a {
  color: #375881; /* 深めの青 */
  font-weight: 900; /* 少し太めにして視認性UP */
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.2s ease;
}

a:hover {
  color:#4b78af; /* ホバー時にやや明るく */
}


.list-like .item {
  margin-bottom: 1em;
  padding-left: 1.2em;
  position: relative;
}

.list-like .item::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0.1em;
  color: #555;
  font-weight: bold;
}