@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

.is-style-icon_info {
	background: #fff4fb;
    border-color: #eea1c6;
}
.is-style-icon_info::before {
    color: #eea1c6;
    content: "";
}

.h3-cyan {
	color: var(--color_main) !important;
	border-left: none !important;
	text-align: center !important;
	font-size: 1.5em !important;
}

.wp-block-table td,th{
	border: 1px solid var(--color_border--table,#dcdcdc) !important;
}

.l-container {
	padding-left: 7px !important;
	padding-right: 7px !important;
}

.c-prNotation[data-style=small] {
	margin-bottom: 20px !important;
}

/* update-date */

.update-date {
	font-size: 0.9em;
	margin-bottom: 10px !important; 
}

.update-date::before {
    font-family: "Font Awesome 5 Free"; /* Font Awesome 6の場合は "Font Awesome 6 Free" */
    font-weight: 900; /* Solidスタイルの場合は900、Regularは400 */
    content: "\f01e";
    margin-right: 0.5em;
}

/* 目次 */

.toc-box {
	margin: 10px auto;
padding: 10px; 
	background: #fff;
    padding-top: 20px;
    padding-bottom: 20px;
	border-radius: 20px; 
}

.toc-box-ttl {
	font-weight: bold;
	text-align: center;
	margin-bottom: 15px;
    font-size: 1.1em;
	color: var(--color_main);
}

.swell-block-fullWide {
	padding: 1em 0;
}

.post_content h3:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title)) {
	border-left: solid 2px var(--color_htag);
}

.post_content h4 {
	font-size: 1em !important;
}

.post_content h2 {
  color: var(--color_main);
  text-align: center;
  font-size: 1.6em;
  position: relative;
  padding-bottom: 36px;
	margin-bottom: 30px;
}

.post_content h2::after {
  content: "";
  position: absolute;
  bottom: 4px;
  left: 50%;
  width: 140px;
  height: 12px;
  transform: translateX(-50%);
  background-color: var(--color_main);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 12'%3E%3Cpath d='M0,1 H58 M82,1 H140 M58,1 L70,11 L82,1' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 12'%3E%3Cpath d='M0,1 H58 M82,1 H140 M58,1 L70,11 L82,1' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.h3designnone {
	font-size: 1.1em !important;
	border-left: none !important;
}

.left-check-icon {
  display: flex;
  align-items: center;
  gap: 0.5em;
		padding-left: 23px !important;
}

.left-check-icon::before {
  content: "✓";
  color: #333; /* お好みの色に変更してください */
  font-weight: bold;
	  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  position: relative;
  top: 10px; /* フォントによって微調整 */
}

.rank-link {
border: 1px solid var(--color_main);
padding: 20px; 
background: #fff;
}
.cyan {
color: var(--color_main);
}

.mark_yellow {
	background: linear-gradient(transparent 64%,#fffbdd 0%);
	font-weight: bold;
}

.mark_blue {
	background: linear-gradient(transparent 64%,#dce5e9 0%);
	font-weight: bold;
}

.underline {
	text-decoration: underline !important;
}

.swell-block-fullWide__inner {
	padding: 7px; 
}

.bold {
	font-weight: bold !important;
}

.big {
	font-size: 1.3em !important;
}

.big2 {
	font-size: 1.1em !important;
}

.small {
	font-size: 0.9em;
}

.small2 {
	font-size: 0.95em;
}

.height_adjst {
	height: 120px !important; 
}

@media screen and (max-width: 768px) {
    .height_adjst {
		height: 200px !important; 
    }
}

.padding10 {
	padding: 10px !important;
}

.mark_pink {
	background: linear-gradient(transparent 60%,rgba(254,198,214,.6) 60%);
}

.mb0 { margin-bottom: 0px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb50 { margin-bottom: 50px !important; }

.mt0 { margin-top: 0px !important; }
.mt10 { margin-top: 10px !important; }
.mt20 { margin-top: 20px !important; }
.mt30 { margin-top: 30px !important; }
.mt40 { margin-top: 40px !important; }
.mt50 { margin-top: 50px !important; }

/* セクションの背景 */

.section-full-bgcol-gray {
background: #f7f7f7;
}
.section-full-bgcol-white {
background: #fff;
}
.section-full-bgcol-blue {
background: #eff5ff;
}
.section-full-bgcol-cyan {
background: #e2ecfc;
}
.section-full-headline-title {
	display: block; 
	font-size: 1.5em !important; 
	font-weight: bold !important; 
	color: var(--color_text) !important; 
	background: transparent !important;
	margin-top: 0px !important; 
}

.section-full-headline-title::before {
border-top: none !important;
border-bottom: none !important;
}

/* 星 */
.star-yellow {
	color: #fdcb6e;
}

/* jump */
.jump {
	color: #0066c0 !important;
	text-decoration: underline !important;
	cursor: pointer !important;
}

.white-section {
	background: #fff;
	border-radius: 20px;
	padding: 25px;
}

/* スマホ用（画面幅768px以下を想定） */
@media screen and (max-width: 768px) {
    .white-section {
		padding: 25px 10px;
    }
}

.white-section p {
	margin-bottom: 2em;
}

.cyan-border {
	border: 10px solid #e8f1ff !important;
}

/* タブ全体 */
.tab-switch {
	--tab-color: var(--color_htag); /* タブ色 */
	display: flex; /* 横並び */
  flex-wrap: wrap; /* 折り返し */
  margin: auto; /* 中央寄せ */
  justify-content: center; /* 中央寄せ */
  gap: 20px 8px; /* タブ間 */
	--tab-bg-color: #f4f4f4; /* タブ色 */
}
.tab-switch > label {
  flex: 1 1 auto; /* 均等幅 */
  order: -1; /* 上部 */
  position: relative; /* 擬似要素基準 */
  padding: 10px 15px;
	color: #4888cd; /* 文字色 */
  text-align: center; /* 中央揃え */
  cursor: pointer; /* ポインター */
  transition: 0.3s all; /* 滑らか */
  background: #eff5ff;
	    touch-action: manipulation; /* タップ遅延除去 */
    -webkit-tap-highlight-color: transparent;
}
.tab-switch > label:hover,
.tab-switch label:has(:checked) {
  background-color: #4888cd; 
  color: #fff; 
}
.tab-switch label:has(:checked)::before {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 10px;
  background-color: #4888cd;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.tab-switch input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}
.tab-switch > div {
  display: none;
  width: 100%;
	padding: 0;
	/* padding: 15px 0px 0px 0px; */
}
.tab-switch label:has(:checked) + div {
  display: block;
}

/* ここから下部タブ用に追加 */
.tab-switch > .tab-bottom-label {
  flex: 1 1 auto;
  order: 2; /* 一番下に配置 */
  padding: 10px 15px;
  color: #4888cd;
  text-align: center;
  cursor: pointer;
  transition: 0.3s all;
  background: #eff5ff;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.tab-switch > .tab-bottom-label:hover,
.tab-switch label:has(:checked) + div + .tab-bottom-label {
  background-color: #4888cd;
  color: #fff;
}
.tab-switch > .tab-bottom-label {
  position: relative; /* 擬似要素基準 */
}
.tab-switch label:has(:checked) + div + .tab-bottom-label::before {
  content: '';
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 10px;
  background-color: #4888cd;
  clip-path: polygon(0 100%, 100% 100%, 50% 0);
}


/* 3ラム表 */
.page-head{
  max-width:1080px;
  margin:0 auto 36px;
  text-align:center;
}
.page-head .eyebrow{
  letter-spacing:.28em;
  color:var(--ink-soft);
  margin-bottom:10px;
}
.page-head h1{
  margin:0;
  letter-spacing:.02em;
}
.page-head .bar{
  width:56px;height:3px;background:var(--ink);
  margin:16px auto 0;
}

.board{
  max-width:1080px;
  margin: 0 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
  align-items:stretch;
}

.table-card{
  overflow:hidden;
  display:flex;
  flex-direction:column;
  height:100%;
border-top: 3px solid #eff5ff;
    border-left: 3px solid #eff5ff;
    border-right: 3px solid #eff5ff;

}



.table-card .head{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px 20px;
  background:#eff5ff;
  color:#4888cd;
}

.rows{
  display:flex;
  flex-direction:row;         /* PC: 横並び */
  flex:1;
}
.row{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  flex:1;
  padding:0;
	border-bottom: 3px solid #eff5ff;
}

.row .label{
  letter-spacing:.02em;
  width:100%;
  /*background:#eff5ff;*/
  padding:16px 20px 10px;
  margin-bottom:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
	  position: relative; /* ::after の基準にする */
}
.row .label::after {
  content: "";
  position: absolute;
  bottom: 0;           /* 下線の位置。paddingの分だけ上に見えるので必要なら調整 */
  left: 50%;
  transform: translateX(-50%);
  width: 30px;          /* お好みの幅 */
  height: 1px;           /* 線の太さ */
  background: var(--color_text);      /* 線の色 */
}
.row .value{
  line-height:1.5;
  color:var(--ink);
  background:#fff;
  width:100%;
  padding:10px 20px 16px;
  height: 100px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-sizing:border-box;
}

@media (max-width:860px){
  .board{
    grid-template-columns:1fr;
    gap:20px;
  }
  .rows{
    flex-direction:column;           /* スマホ: 縦並び */
    border-left:none;
  }
  .row{
    border-right:none;
  }
  .row .value{
    height:auto;
  }
}

/* 料金カードの強調 */
.table-card.price .row .value.price-main{
  color:var(--ink);
}
.table-card.price .row .value.price-main .unit{
  color:var(--ink-soft);
  margin-left:4px;
}

.note{
  max-width:1080px;
  margin:20px auto 0;
  color:var(--ink-soft);
  text-align:center;
}

.value.good,
.value.soso,
.value.bad{
  position:relative;
}
.value.good {
	background: #f1fff2;
}

.value.soso {
	background: #fff9f0;
}


.value.bad {
	background: #fffdef;	
}







.label.good,
.label.soso,
.label.bad{
  position:relative;
}
.label.good {
	background: #f1fff2;
}
.label.good::before{
  content:"◎";
  position:absolute;
  top:20px;
  left:20px;
  transform:translate(-50%, -50%);
  color:#94e29c;
  font-size:2em;
  opacity:0.5;
}
.label.soso {
	background: #fff9f0;
}
.label.soso::before{
  content:"〇";
  position:absolute;
  top:20px;
  left:20px;
  transform:translate(-50%, -50%);
  color:#e8a33d;
  font-size:1.6em;
  opacity:0.3;
}

.label.bad {
	background: #fffdef;	
}
.label.bad::before{
  content:"△";
  position:absolute;
  top:20px;
  left:20px;
  transform:translate(-50%, -50%);
  color:#eeda2f;
  font-size:1.7em;
  opacity:0.8;
}


/* ランキングボックス */
.service-box {
position: relative;
margin: 20px auto;
background: #fff;
width: 100%;
max-width: 1000px;
padding: 10px;
border: 10px solid #e8f1ff;
	border-radius: 20px;
}

.service-box-icon {
    position: absolute;
    top: 0;
    left: 15px;
        width: 63.75px;
        height: 90px;
    z-index: 2; /* 他の要素より前面に */
}

.service-box-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 画像の比率が違う場合に枠にフィットさせる */
    display: block;
position: absolute;
top: -10px;
}

/* スマホ用（画面幅768px以下を想定） */
@media screen and (max-width: 768px) {
    .service-box-icon {
        /* width: 42.5px; */
        /* height: 60px; */
        width: 51px;
        height: 72px;
    }
    .service-box-ttl {
        margin-top: 65px !important;
    }
}

.service-box-img {
text-align: center;
	margin-bottom: 5px !important; 
}

.service-box-ttl {
font-size: 1.4em !important;
font-weight: bold;
	background: none !important;
	padding: 0px !important;
	color: #333 !important;
	border-left: none !important;
}
.service-box-ttl::before {
	border-top: none !important;
	border-bottom: none !important;
	background: none !important;
}

.service-point {
font-weight: bold;
}

.service-box-url {
font-size: 1.2em;
font-weight: bold;
}

.service-box-btn {
  display: inline-block;
font-size: 1em;
font-weight: bold;
}
.service-box-btn .jump {
  display: inline-block;
  background-color: #f7941d;
	background: linear-gradient(to bottom,#33cb9c,#2ab88a);
  color: #ffffff;
  padding: 10px 40px;
  border-radius: 50px;
  font-weight: bold;
  cursor: pointer;
  text-align: center;
  transition: opacity 0.2s ease;
color: #fff !important;
	text-decoration: none !important;
}
.service-box-btn .jump::after {
    content: "→";
    margin-left: 2px;
}
.service-box-btn .jump:hover {
  opacity: 0.85;
}

.service-box-content {
margin: 0 auto;
max-width: 800px; 
}


.textaligncenter { text-align: center; }



.reco-point {
  position: relative;
  margin: 0 auto 25px;
  padding: 25px 20px;
  border: 3px solid transparent;
  background-image:
    linear-gradient(#fff, #fff),
    linear-gradient(90deg, #d0ddf2 0%, #d0ddf2 25%, #bcd4f9 50%, #a4c8ff 74.52%, #d0ddf2 100%);
  background-origin: border-box;
  background-clip: padding-box, border-box;
}
 
  .reco-point-ttl {
    font-weight: bold;
    color: #333;
    margin-bottom: 20px;
padding-bottom: 10px;
    line-height: 1.5;
border-bottom: 1px dashed #a4c8ff !important;
  }
 
  .reco-point-item {
    position: relative;
    padding-left: 32px;
    margin-bottom: 14px;
    line-height: 1.7;
    color: #444;
border-bottom: 1px dashed #a4c8ff !important;
padding-bottom: 10px;
  }
 
  .reco-point-item:last-child {
    margin-bottom: 0;
  }
 
  /* ✓アイコン */
  .reco-point-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
  }
 
  .reco-point-item::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 6px;
    width: 12px;
    height: 8px;
    border-left: 2px solid var(--tab-color);
    border-bottom: 2px solid var(--tab-color);
    transform: rotate(-45deg);
  }

.service-box-operator-table {
text-align: center !important;
margin: 0 auto !important;
}

.service-box-operator-table tbody th {
border-top: 1px dashed #a4c8ff !important;
border-left: 1px dashed #a4c8ff !important;
border-right: 1px dashed #a4c8ff !important;
border-bottom: 1px dashed #a4c8ff !important;
background: #fff; 
width: 50%; 
}

.service-box-operator-table tbody td {
border-top: 1px dashed #a4c8ff !important;
border-left: 1px dashed #a4c8ff !important;
border-right: 1px dashed #a4c8ff !important;
border-bottom: 1px dashed #a4c8ff !important;
background: #fff; 
width: 50%; 
}

.service-box-operator-table thead th {
background: #4888cd !important;
}



.reveiw-box {
  background-color: #f7f7f7;
  padding: 16px;
  border-radius: 8px;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 16px;
  position: relative; /* review-infoの基準位置にする */
max-width: 800px;
margin: 0 auto !important;
}

.review-info {
  font-size: .8em;
  font-weight: 700;
  position: absolute;
  top: 5px;
  left: 10px;
}

.reveiw-box-left {
  width: 15%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.reveiw-box-right {
  width: 85%;
}

/* スマホでは1カラムに切り替え */
@media screen and (max-width: 767px) {
  .reveiw-box {
    flex-direction: column;
  }

  .reveiw-box-left {
    width: 100%;
  }

  .reveiw-box-right {
    width: 100%;
  }
}
.reveiw-box-icon {
margin-top: 20px !important; 
  display: flex;
  justify-content: center;
  align-items: center;
}
.reveiw-box-icon img {
  width: 60px;
  height: 60px;
  object-fit: cover;
}

.reveiw-box-image {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
margin-bottom: 10px; 
}

.reveiw-box-image-item {
  width: calc(50% - 4px);
}

@media screen and (max-width: 767px) {
  .reveiw-box-image-item {
    width: 100%;
  }
}

.reveiw-box-ttl {
margin-bottom: 0px;
font-weight: bold;
}
.reveiw-box-star {
margin-bottom: 10px;
}
.reveiw-box-name {
font-size: 0.9em;
margin-top: 5px;
}



.home-header {
text-align: center;
	margin-bottom: 20px;
}


.home-header-ttl {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
 
  /* カード画像（スマホ） */
  .card-left .card-img,
  .card-right .card-img {
    width: 100px;
    height: auto;
    display: block;
  }
  .card-left .card-img {
    transform: rotate(-8deg);
  }
  .card-right .card-img {
    transform: rotate(8deg);
  }
 
  /* 中央テキスト・hikaku画像（スマホ） */
  .center-col {
    text-align: center;
    line-height: 1.4;
  }
  .text-line {
    display: block;
font-weight: bold;
color: var(--color_main);
line-height: 1.6;
font-size: 1.1em;
  }
  .hikaku-img {
    display: block;
    width: 180px;
    height: auto;
    margin: 0 auto;
  }
  .hikaku-text {
    opacity: 0;
    font-size: 0;
    line-height: 0;
    display: block;
  }
 
  /* PC（769px以上） */
  @media (min-width: 769px) {
    .wrap {
      gap: 16px;
    }
    .card-left .card-img,
    .card-right .card-img {
      width: 120px;
    }
    .text-line {
      font-size: 1.5em;
    }
    .hikaku-img {
      width: 300px;
    }
  }




.cyan-cir {
padding: 6px 14px 7px;
width: auto;
margin: 0 auto;
max-width: unset;
text-align: center;
border-radius: 100vh;
background: linear-gradient(90deg, #86adea 0%, #1976da 100%);
color: #fff;
font-weight: bold;
}

/* PC（769px以上） */
@media (min-width: 769px) {
.cyan-cir {
max-width: 600px;
}
}




  .btn-demo {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
  }
  .sim-btn {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #00668f;
    border-radius: 12px;
    padding: 14px 24px 18px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    min-width: 140px;
    border-bottom: 3px solid #fff;
  }
  .sim-btn-text {
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    white-space: nowrap;
    line-height: 1.4;
    text-align: center;
  }
  .sim-btn-sub {
    color: rgba(255, 255, 255, 0.85);
    font-size: 11px;
    margin-bottom: 4px;
  }
  .sim-btn::after {
    content: "";
    position: absolute;
    bottom: -16px;
    left: 50%;
    transform: translateX(-50%);
    width: 32px;
    height: 16px;
    background: #00668f;
    border-radius: 0 0 100px 100px;
  }
  .sim-btn-arrow {
    position: absolute;
    bottom: -13px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    font-size: 13px;
    z-index: 1;
    line-height: 1;
  }

.btn-demo {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* PC: 4カラム */
  gap: 4px;
	max-width: 600px;
	margin: 0 auto;

}

@media (max-width: 480px) {
  .btn-demo {
    grid-template-columns: repeat(2, 1fr); /* スマホ: 2カラム */
  }
}



.decoration-btn {
    width: 222px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100vh;
    margin: 26px auto 0;
    background: linear-gradient(90deg, #66cc00 0%, #1bc3cf 100%);
    font-size: 18px;
    font-weight: 700;
    padding-right: 17px;
    color: #fff;
    position: relative;
color: #fff !important;
text-decoration: none !important;
}



.decoration-btn::before {
    background: url(https://www.shimane-catchnavi.jp/wp-content/uploads/2026/04/arrow-right.png) no-repeat center center / contain;
    content: '';
    height: 28px;
    right: 9px;
    position: absolute;
    top: 50%;
    width: 28px;
    transform: translate(0, -50%);
}

.decoration-btn-down {
    width: 222px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100vh;
    margin: 26px auto 0;
    background: linear-gradient(90deg, #66cc00 0%, #1bc3cf 100%);
    font-size: 18px;
    font-weight: 700;
    padding-right: 17px;
    color: #fff;
    position: relative;
color: #fff !important;
text-decoration: none !important;
}



.decoration-btn-down::before {
    background: url(https://www.shimane-catchnavi.jp/wp-content/uploads/2026/04/arrow-down.png) no-repeat center center / contain;
    content: '';
    height: 28px;
    right: 9px;
    position: absolute;
    top: 50%;
    width: 28px;
    transform: translate(0, -50%);
}

.decoration-btn-up {
    width: 222px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100vh;
    margin: 26px auto 0;
    background: linear-gradient(90deg, #fdc42c 0%, #fd7f53 100%);
    font-size: 18px;
    font-weight: 700;
    padding-right: 17px;
    color: #fff;
    position: relative;
color: #fff !important;
text-decoration: none !important;
}



.decoration-btn-up::before {
    background: url(https://www.shimane-catchnavi.jp/wp-content/uploads/2026/04/arrow-up.png) no-repeat center center / contain;
    content: '';
    height: 28px;
    right: 9px;
    position: absolute;
    top: 50%;
    width: 28px;
    transform: translate(0, -50%);
}

.h2-point-ttl {
    text-align: center;
    font-weight: bold;
    line-height: 1.6;
    margin-bottom: 30px;
background: none !important;
color: #00668f !important;
}

.h2-point-ttl::before {
border-top: none !important;
border-bottom: none !important;
}

.top #content {
	padding-top: 0px;
}



/* アコーディオン */

.accordion-normal {
    margin-bottom: 7px;
    background-color: #f2f2f2;
    border-radius: 8px;
    overflow: hidden;
	padding: 15px;
}
.accordion-normal-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    margin: 0;
    padding: 1em 1.2em !important;
    font-weight: 600;
    font-size: 1em !important;
    cursor: pointer;
	border-left: none !important;
    margin-bottom: 0 !important;
}
.accordion-normal-summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 10px;
    height: 10px;
    margin-left: 10px;
    border-bottom: 3px solid #c2c2c2;
    border-right: 3px solid #c2c2c2;
    content: '';
    transition: transform .3s;
    flex-shrink: 0;
}
.accordion-normal.open .accordion-normal-summary::after {
    transform: rotate(225deg);
}
.accordion-normal-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height .5s;
}
.accordion-normal-content > * {
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: .3em 2em 1.5em;
    transition: transform .5s, opacity .5s;
}
.accordion-normal.open .accordion-normal-content > * {
    transform: none;
    opacity: 1;
}

/* simple-table */

.simple-table th,td {
text-align: center;
}
.simple-table td {
	background: #fff;
}
.simple-table th {
color: white;
background: var(--color_main);
/* background: var(--color_main); */
font-weight: bold;
}
.simple-table-sticky-col {
position: sticky;
}
.simple-table-num {
position: absolute;
    top: 6px;
    left: 6px;
    background: var(--color_main);
    color: #fff;
    font-weight: bold;
    padding: 2px 6px;
    font-size: 0.8em;
    opacity: 0.9 !important;
}
.simple-table-num-one {
display: block;
    text-align: center;
    padding-top: 20px;
}
.width33 {
width: 33%;
}

.bgpink {
	background: #fff2f4 !important;
}

.textalignright {
	text-align: right;
}

.textalignleft {
	text-align: left;
}


/* ============ item-box ============ */
 
.item-box{
  max-width:760px;
  margin:0 auto 40px;
  background:var(--white);
  border:4px solid #0e357b;
  border-radius:0;
  box-shadow:0 4px 18px rgba(22,38,63,0.07);
  overflow:hidden;
}
 
/* ---- ヘッダー全体：左右2分割（PC）/ 縦積み（SP） ---- */
 
.item-box > .item-box-header-left,
.item-box > .item-box-header-right{
  /* HTML上は兄弟要素なので、共通の親グリッドで並べる */
}
 
.item-box{
  display:grid;
  grid-template-columns: 1fr;
}
 
@media (min-width:769px){
  .item-box{
    grid-template-columns: 1fr 240px;
    grid-template-areas:
      "left  right"
      "tab   tab"
      "panel panel"
      "footer footer";
  }
  .item-box-header-left{grid-area:left;}
  .item-box-header-right{grid-area:right;}
  .item-box-tab{grid-area:tab;}
  .item-box-tab-panel{grid-area:panel;}
  .item-box-footer{grid-area:footer;}
}
 
/* ============ header-left ============ */
 
.item-box-header-left{
  padding:24px 24px 20px;
  border-bottom:1px solid var(--line);
}
 
@media (min-width:769px){
  .item-box-header-left{
    border-bottom:none;
  }
}
 
.item-title{
  font-size:16px;
  line-height:1.4;
  color:var(--ink);
  margin-bottom:14px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
 
.rank-badge{
  display:inline-block;
  background:#0e357b;
  border:2px solid #0e357b;
  color:#ffffff;
  padding:3px 10px;
  font-size:14px;
  font-weight:700;
  white-space:nowrap;
}
 
.item-title .service-name{
  font-weight:700;
}
 
.item-title::before{
  content:"";
}
 
.item-box-header-image{
  border-radius:var(--radius-md);
  overflow:hidden;
  margin-bottom:16px;
  background:var(--navy-050);
  line-height:0;
}
 
.item-box-header-image img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}
 
/* サポート情報：2カラム（相談／サポート）PC2列・SP1列 */
 
.item-box-header-support{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:0 20px;
}
 
@media (max-width:520px){
  .item-box-header-support{
    grid-template-columns: 1fr;
    gap:18px 0;
  }
}
 
.support-group{
  display:flex;
  flex-direction:column;
}
 
/* ============ 共通テーブルスタイル（相談／サポート／header-right） ============ */
 
.info-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
  line-height:1.6;
}
 
.info-table th,
.info-table td{
  padding:9px 10px;
  border:1px solid var(--line);
  text-align:left;
  vertical-align:middle;
}
 
.info-table th{
  background:#e3edf9;
  color:var(--ink);
  font-weight:400;
  width:44%;
  white-space:nowrap;
}
 
.info-table td{
  background:#fff;
  color:var(--ink);
}
 
/* ============ セクションボックス（サポート体制／費用） ============ */
 
.section-box{
  border:2px solid #0e357b;
  border-radius:0;
  overflow:hidden;
}
 
.section-box-title{
  background:#0e357b;
  color:#ffffff;
  font-size:15px;
  font-weight:700;
  padding:8px 12px;
}
 
.section-box-body{
  padding:14px 12px;
  background:#0e357b;
}
 
.section-box-body.is-white{
  background:var(--white);
}
 
.speed-value{
  text-align:center;
  font-size:20px;
  font-weight:700;
  color:var(--ink);
}
 
/* ============ header-right（料金・条件パネル） ============ */
 
.item-box-header-right{
  background:var(--white);
  color:var(--ink);
  padding:20px 6px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
 
/* ============ タブ（構造変更OK） ============ */
 
.item-box-tab{
  display:flex;
  gap:10px;
  padding:14px 20px 20px;
  background:var(--white);
}
 
.item-box-tab-item{
  flex:1;
  text-align:center;
  padding:11px 0;
  font-size:13px;
  font-weight:700;
  color:#0e357b;
  background:#e3edf9;
  border-radius:99px;
  cursor:pointer;
  position:relative;
  transition:background-color .2s ease, color .2s ease;
}
 
.item-box-tab-item:hover{
  background:#d3e2f5;
}
 
.item-box-tab-item.is-active{
  background:#0e357b;
  color:#ffffff;
}
 
.item-box-tab-item.is-active:hover{
  background:#0e357b;
}
 
.item-box-tab-item.is-active::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-7px;
  transform:translateX(-50%);
  width:0;
  height:0;
  border-style:solid;
  border-width:7px 7px 0 7px;
  border-color:#0e357b transparent transparent transparent;
}
 
/* ============ タブコンテンツ ============ */
 
.item-box-tab-panel{
  display:none;
  padding:20px 24px;
  font-size:13px;
  line-height:1.8;
  color:var(--ink-soft);
  background:var(--white);
}
 
.item-box-tab-panel.is-active{
  display:block;
}
 
/* ============ フッター／CTA ============ */
 
.item-box-footer{
  padding:18px 20px 22px;
  background:var(--white);
}
 
.item-box-btn{
  display:block;
  text-align:center;
  padding:15px 0;
  border-radius:99px;
  background:#eb8900;
  color:#fff;
  font-weight:700;
  font-size:18px;
  letter-spacing:.02em;
  cursor:pointer;
  transition:transform .15s ease;
}
 
.item-box-btn:hover{
  transform:translateY(-1px);
}
 
.item-box-btn:active{
  transform:translateY(0);
}



/* ===== [pickup] ショートコード用 追記CSS ===== */
.pickup-box {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}
.pickup-box-ttl {
font-weight: bold;
    text-align: center;
    margin-bottom: 15px;
    font-size: 1.1em;
    color: var(--color_main);
	text-align: center;
}
.pickup-item {
    border: 1px solid #e8f1ff;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
    flex: 1 1 280px;
    display: flex;
    flex-direction: column;
}
/* 1位：ゴールド */
.pickup-item-rank-1 {
    background: linear-gradient(180deg, #fffbef 0%, #fff7dc 100%);
    border-color: #f1d678;
}
/* 2位：シルバー */
.pickup-item-rank-2 {
    background: linear-gradient(180deg, #fafaf9 0%, #f1f0ee 100%);
    border-color: #dcd9d3;
}
/* 3位：ブロンズ */
.pickup-item-rank-3 {
    background: linear-gradient(180deg, #fff5ec 0%, #fbe9d6 100%);
    border-color: #e6c499;
}
.pickup-item-num {
    font-size: 1.1em;
    font-weight: bold;
    margin-bottom: 4px;
}
.pickup-item-type {
    display: inline-block;
    font-size: 0.9em;
    font-weight: bold;
    padding: 2px 12px;
    border-radius: 20px;
    margin: 0 auto 8px;
}
.pickup-item-title {
    font-size: 1em;
    font-weight: bold;
    margin-bottom: 8px;
}
.pickup-item-type span {
    display: inline;
    padding: 0 2px;
}
/* 運営元のマーカー（1位：ゴールド系） */
.pickup-item-rank-1 .pickup-item-type span {
    background: linear-gradient(transparent 60%, #f7e2a0 60%);
}
/* 運営元のマーカー（2位：シルバー系） */
.pickup-item-rank-2 .pickup-item-type span {
    background: linear-gradient(transparent 60%, #e4e2de 60%);
}
/* 運営元のマーカー（3位：ブロンズ系） */
.pickup-item-rank-3 .pickup-item-type span {
    background: linear-gradient(transparent 60%, #f3d7ae 60%);
}
.pickup-item-image {
    margin-bottom: 8px;
}
.pickup-item-image img {
    max-width: 100%;
    height: auto;
}
.pickup-item-tag {
    margin-bottom: 8px;
    text-align: left;
}
.pickup-item-tag-item {
    display: block;
    font-size: 0.9em;
    padding: 2px 0;
}
.pickup-item-tag-item::before {
    content: "✓";
    color: #2ab88a;
    font-weight: bold;
    margin-right: 4px;
}
.pickup-item-comment {
    font-size: 0.9em;
    color: #555;
    margin-bottom: 5px;
    flex-grow: 1;
}
.pickup-item-btn .jump {
    display: inline-block;
    background-color: #f7941d;
    background: linear-gradient(to bottom, #33cb9c, #2ab88a);
    color: #ffffff;
    padding: 10px 40px;
    border-radius: 50px;
    font-weight: bold;
    cursor: pointer;
    text-align: center;
    transition: opacity 0.2s ease;
    color: #fff !important;
    text-decoration: none !important;
}
.pickup-item-btn .jump::after {
    content: "→";
    margin-left: 2px;
}
.pickup-item-btn .jump:hover {
  opacity: 0.85;
}

.is-style-icon_pen {
	background: #eee;
}

.box-light-blue {
background: #f7f7f7;

padding: 30px 15px 15px 15px;
margin-bottom: 15px;

}

.box-light-blue-ttl {
font-weight: bold;
margin-bottom: 30px; 
  position: relative;
  padding-left: 1.5em; /* チェックマーク分のスペースを確保 */
}

.box-light-blue-ttl::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #333; /* 好みの色に調整 */
}





/* ==========================================================
 * [table2] 縦型サービス比較表 スタイル
 * ※ retirement_agency_table2_shortcode() 内で echo していた
 *   <style> ブロックを移行したものです。
 *   style.css に追記してご利用ください。
 * ========================================================== */
.service-table-v-wrap{overflow-x:auto;max-width:100%; margin: 20px auto;}
.service-table-v{border-collapse:collapse;}
.service-table-v th,
.service-table-v td{padding:10px 14px;text-align:center;vertical-align:middle;white-space:nowrap;border:1px solid #eee;}
.service-table-v thead th{background:#e8f1ff;position:sticky;top:0;z-index:2;min-width:140px;}
.service-table-v thead th.service-table-v-corner{left:0;z-index:6;background:#e8f1ff;width:170px;min-width:170px;}
.service-table-v tbody th.service-table-v-cat{position:sticky;left:0;z-index:4;width:60px;min-width:60px;max-width:60px;background:#f7faff;text-align:center;font-weight:normal;white-space:normal;}
.service-table-v tbody th.service-table-v-sub{position:sticky;left:60px;z-index:3;width:110px;min-width:110px;max-width:110px;text-align:left;font-weight:normal;white-space:normal;}
.service-table-v tbody th.service-table-v-single{position:sticky;left:0;z-index:4;width:170px;min-width:170px;max-width:170px;text-align:left;font-weight:bold;white-space:normal;}
.service-table-v tbody tr.row-bg-white td,
.service-table-v tbody tr.row-bg-white th.service-table-v-single,
.service-table-v tbody tr.row-bg-white th.service-table-v-sub{background:#fff !important;}
.service-table-v tbody tr.row-bg-blue td,
.service-table-v tbody tr.row-bg-blue th.service-table-v-single,
.service-table-v tbody tr.row-bg-blue th.service-table-v-sub{background:#f7faff;}
.service-table-v-num{display:inline-block;background:var(--color_main);color:#fff;font-weight:bold;padding:2px 8px;font-size:0.8em;border-radius:3px;margin-bottom:4px;white-space:normal;line-height:1.3;}
.service-table-v-img-and-name{display:block;text-align:center;}
/* .service-table-v-img-and-name img{max-width:80px;height:auto;} */
.service-table-v-img-and-name .small{font-size:12px;line-height:1.4;display:block;margin-top:4px;}
.service-table-v-rating{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:6px;font-weight:bold;font-size:0.95em;white-space:nowrap;}
.service-table-v-rating img{max-width:80px;height:auto;display:inline-block;}
@media (max-width:600px){
.service-table-v th,
.service-table-v td{padding:8px 10px;}
.service-table-v thead th{min-width:110px;}
.service-table-v thead th.service-table-v-corner{width:130px;min-width:130px;}
.service-table-v tbody th.service-table-v-cat{width:44px;min-width:44px;max-width:44px;font-size:0.85em;}
.service-table-v tbody th.service-table-v-sub{left:44px;width:86px;min-width:86px;max-width:86px;font-size:0.85em;}
.service-table-v tbody th.service-table-v-single{width:130px;min-width:130px;max-width:130px;font-size:0.9em;}
/* .service-table-v-img-and-name img{max-width:50px;} */
.service-table-v-img-and-name .small{font-size:10px;}
}
.table-value.good,
.table-value.soso,
.table-value.bad{
  position:relative;
  z-index:0;
}
.table-value.good::before{
  content:"◎";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  color:#94e29c;
  font-size:2.5em;
  opacity:0.4;
  z-index:-1;
}
.table-value.soso::before{
  content:"〇";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  color:#e8a33d;
  font-size:2em;
  opacity:0.75;
  z-index:-1;
}
.table-value.bad::before{
  content:"△";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  color:#eeda2f;
  font-size:2em;
  opacity:0.75;
  z-index:-1;
}



/* ==========================================================
 * [table] / [table-cheap] 比較表 共通スタイル
 * ※ retirement_agency_table_shortcode() 内で echo していた
 *   <style> ブロックを移行したものです。
 *   style.css に追記してご利用ください。
 * ========================================================== */
.service-table-wrap{overflow-x:auto;max-width:1000px; margin: 20px auto;}
.service-table{border-collapse:collapse;width:100%;min-width:900px;}
.service-table th,
.service-table td{padding:10px;text-align:center;vertical-align:middle;white-space:normal;}
/* service-table の td 横幅を下限・上限で制御 */
.service-table td{
	min-width: 100px;
	max-width: 180px;
	box-sizing: border-box;
	word-break: break-word;
}

@media (max-width:600px){
.service-table td{
	min-width: 70px;
	max-width: 130px;
}
}

.service-table thead th{background:var(--color_main);position:sticky;top:0;z-index:2;}
.service-table tbody tr:nth-child(odd) td{background:#fff;}
.service-table tbody tr:nth-child(even) td{background:#f7faff;}
.service-table-sticky-col{position:sticky;left:0;z-index:3;min-width:120px;padding-top:32px;}
.service-table thead th.service-table-sticky-col{z-index:4;background:var(--color_main);}
.service-table tbody tr:nth-child(odd) td.service-table-sticky-col{background:#fff;}
.service-table tbody tr:nth-child(even) td.service-table-sticky-col{background:#f7faff;}
.service-table-num{position:absolute;top:6px;left:6px;background:var(--color_main);color:#fff;font-weight:bold;padding:2px 6px;font-size:0.8em;opacity:0.9 !important;}
.service-table-img-and-name{display:block;text-align:center;padding-top:20px; }
.service-table-img-and-name img{max-width:90px;height:auto;}
.service-table-img-and-name .small{font-size:12px;line-height:1.4;}
.service-table-review-col{min-width:80px;}
.service-table-type-col{min-width:100px;}
.service-table-price-col{min-width:110px;}
.service-table-speed-col{min-width:100px;}
.service-table-guarantee-col{min-width:100px;}
.service-table-consultation-col{min-width:100px;}
.service-table-contact-col{min-width:110px;}
.service-table-payment-col{min-width:150px;}


@media (max-width:600px){
.service-table{min-width:700px;}
.service-table-sticky-col{min-width:120px;padding-top:26px;padding-left:4px;padding-right:4px;}
.service-table-img-and-name img{max-width:55px;}
.service-table-img-and-name .small{font-size:10px;}
.service-table-num{font-size:0.8em;padding:1px 4px;top:4px;left:4px;opacity:0.9;}
}


.table-hidden-item{display:none;}
.table-show-all-btn{display:block;margin:20px auto;padding:15px 30px;cursor:pointer;background:#4457ba;color:#fff;border:none;width: 100%; max-width:800px;font-size:1.1em;font-weight:bold;text-decoration:underline;border-radius:50px; }
.table-show-all-btn:hover{opacity:0.9;}
.service-under-review-box{margin:20px auto;padding:15px 20px;background:#f9f9f9;}
.service-under-review-box-ttl{font-weight:bold;margin-bottom:8px;font-size:1em;color:var(--color_main);}
.service-under-review-box-content{font-size: 0.9em;}
.table-value.good,
.table-value.soso,
.table-value.bad{
  position:relative;
}
.table-value.good::before{
  content:"◎";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  color:#94e29c;
  font-size:2.5em;
  opacity:0.4;
}
.table-value.soso::before{
  content:"〇";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  color:#e8a33d;
  font-size:2em;
  opacity:0.4;
}
.table-value.bad::before{
  content:"△";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  color:#eeda2f;
  font-size:2em;
  opacity:0.75;
}