@charset "UTF-8";
/* ==========================================================================
   メイン
   ========================================================================== */
@media screen and (max-width: 768px) {
br
{
  display: none;
}
}
.p-mv
{
  height: auto;
  min-height: 500px;
  position: relative;
  display: flex;
  align-items: flex-start; /* 上端から配置 */
  justify-content: center; /* コンテナを中央へ */
  color: #fff;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.result-type-a .p-mv
{
  background-image: url(../img/result_type_a/type_a_main_bg.jpg);
}
.result-type-b .p-mv
{
  background-image: url(../img/result_type_b/type_b_main_bg.jpg);
}
.result-type-c .p-mv
{
  background-image: url(../img/result_type_c/type_c_main_bg.jpg);
}
.result-type-d .p-mv
{
  background-image: url(../img/result_type_d/type_d_main_bg.jpg);
}
.p-mv__container
{
  width: 100%;
  max-width: 1200px;
  height: 100%;
  position: relative;
  z-index: 1; /* 背景レイヤーより上に */
}
.p-mv__content
{
  position: relative;
  padding: 80px 5%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (min-width: 768px) {
.p-mv
{
  width: 100%;
  height: 710px;
  margin-top: 80px;
  z-index: 10;
}
.p-mv__content
{
  padding: 50px 2%;
}
}
@media screen and (min-width: 1200px) {
.p-mv__content
{
  padding: 80px 2% 50px;
}
}
.p-mv__copy
{
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-bottom: 24px;
  font-size: clamp(2rem, 0.506rem + 3.33vw, 2.8rem);
}
.p-mv__copy span
{
  display: flex;
  align-items: center;
  justify-content: center;
  /* 正方形の設定 */
  width: clamp(60px, 8vw, 100px);
  aspect-ratio: 1 / 1;
  background-color: #fff;
  color: #0168b7;
  font-weight: bold;
  font-size: clamp(4.8rem, 0.506rem + 3.33vw, 7rem);
  line-height: 1.1;
  padding-top: 0.1em;
}
.p-mv__lead
{
  font-size: clamp(1.8rem, 0.506rem + 3.33vw, 3rem);
  font-weight: bold;
  margin-bottom: 20px;
}
.p-mv__lead strong
{
  font-size: clamp(3.8rem, 0.506rem + 3.33vw, 5.5rem);
  display: inline-block;
}
@media screen and (min-width: 1200px) {
.p-mv__copy span
{
  font-size: 7rem;
}
}
.p-mv__list
{
  background-color: #fff;
  border-radius: 10px;
  padding: 10px 10px;
  margin: 20px auto;
  color: #333;
  list-style: none;
  text-align: left;
  width: 90%;
}
/* 各リスト項目の設定 */
.p-mv__list li
{
  position: relative;
  padding: 15px 30px 15px 50px;
  border-bottom: 1px solid #b2b2b2;
  font-size: 1.8rem;
  line-height: 1.6;
}
.p-mv__list li:last-child
{
  border-bottom: none;
}
/* レ点 */
.p-mv__list li::before
{
  content: "";
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-70%) rotate(45deg);
  width: 10px;
  height: 20px;
  border-right: 3px solid #006ab8;
  border-bottom: 3px solid #006ab8;
}
/* マーカーの装飾 */
.p-mv__marker
{
  font-weight: bold;
  background: linear-gradient(transparent 50%, #fff100 50%);
  display: inline-block;
  padding-bottom: 5px;
  line-height: 1;
}
@media screen and (min-width: 768px) {
.p-mv__list
{
  border-radius: 20px;
  padding: 20px 50px;
  margin: 20px auto;
  width: 80%;
}
.p-mv__list li
{
  font-size: clamp(1.8rem, 0.506rem + 3.33vw, 2.2rem);
}
}
/* はみ出すボタンの設定 */
.p-mv__button-tel
{
  position: absolute;
  bottom: 0;
  right: 0;
  transform: translate(-30%, 20%);
 width: calc(200px * 0.5);
 height: calc(200px * 0.5);
  border-radius: 50%;
  background: linear-gradient(to bottom, #fdab01, #fd7308) padding-box,  linear-gradient(to bottom, #fdf1b7, #fd7308) border-box;
  border: 4px solid transparent;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 10px 5px 10px;
  text-decoration: none;
  text-align: center;
  color: #fff;
  line-height: 1.1;
  z-index: 10;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
 font-size: calc(2.2rem * 0.6);
  font-weight: bold;
}
.p-mv__button-tel:hover
{
  filter: brightness(1.2);
}
/* 下半分に表示するアイコン画像 */
.p-mv__button-tel::after
{
  content: "";
  position: absolute;
  z-index: 11;
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%); /* 左右中央揃え */
 width: calc(53px * 0.5);
 height: calc(55px * 0.5);
  background: url(../img/btn_tel_bg.png) no-repeat center / contain;
}
.p-mv__badge
{
  display: inline-block;
  color: #fff;
 font-size: calc(3rem * 0.6);
  margin-bottom: 10px;
  line-height: 1;
}
@media screen and (min-width: 768px) {
.p-mv__button-tel
{
 width: calc(200px * 0.7);
 height: calc(200px * 0.7);
  padding: 20px 5px 10px;
 font-size: calc(2.2rem * 0.8);
  transform: translate(-5%, -5%);
}
.p-mv__button-tel::after
{
 width: calc(53px * 0.6);
 height: calc(55px * 0.6);
  bottom: 5px;
}
.p-mv__badge
{
 font-size: calc(3rem * 0.8);
  margin-bottom: 10px;
}
}
@media screen and (min-width: 1200px) {
.p-mv__button-tel
{
  width: 200px;
  height: 200px;
  padding: 40px 5px 10px;
  font-size: 2.2rem;
}
.p-mv__button-tel::after
{
  width: 53px;
  height: 55px;
  bottom: 25px;
}
.p-mv__badge
{
  font-size: 3rem;
  margin-bottom: 10px;
}
}
@media screen and (min-width: 1400px) {
.p-mv__button-tel
{
  transform: translate(50%, -50%);
}
}
/* ==========================================================================
   解決策
   ========================================================================== */
.p-solution
{
  background-color: #eff2f7;
  margin: 0;
}
.p-solution__container
{
  width: 100%;
  max-width: 940px;
  margin: 0 auto;
  padding: 40px 0 20px;
}
.p-solution__title
{
  text-align: center;
  font-size: clamp(2.1rem, 0.506rem + 3.33vw, 3rem);
  margin: 0 auto 1em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em; /* 文字と記号の間の距離 */
  position: relative;
  z-index: 2;
}
/* 左側の「/」を反転させた記号 */
.p-solution__title::before
{
  content: "/";
  display: inline-block;
  font-size: 2em;      /* 文字より少し大きく */
  transform: scaleX(-1); /* 左右反転で逆ハの字にする */
  font-weight: normal;
  color: #0167b9;
}
/* 右側の「/」記号 */
.p-solution__title::after
{
  content: "/";
  display: inline-block;
  font-size: 2em;      /* 文字より少し大きく */
  font-weight: normal;
  color: #0167b9;
}
@media (min-width: 768px) {
.p-solution__container
{
  padding: 80px 0 40px;
}
}
/* 各アイテムの並び（横並び） */
.p-solution__item
{
  flex-direction: column;
  margin-bottom: 50px;
}
.p-solution__item:last-child
{
  margin-bottom: 0;
}
.p-solution__card
{
  background: #fff;
  padding: 40px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 1; /* 画像より下に配置 */
  width: 100%;
}
.p-solution__item-image-wrapper
{
  width: 90%; /* スマホでは少し小さくして重ねを強調 */
  margin-top: -30px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 2;
}
.p-solution__item-image
{
  width: 100%;
  height: auto;
  display: block;
}
@media (min-width: 768px) {
.p-solution__item
{
  display: flex;
  align-items: center; /* 垂直方向の中央揃え */
  margin-bottom: 80px;
}
/* 奇数番目のアイテムの設定 */
.p-solution__item:nth-of-type(odd)
{
  flex-direction: row;
}
/* 2, 4番目 */
.p-solution__item:nth-of-type(even)
{
  flex-direction: row-reverse;
}
.p-solution__card
{
  flex: 1; /* 残りの幅を占有 */
  padding: 40px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  width: inherit;
}
.p-solution__item:nth-of-type(odd) .p-solution__card
{
  padding-right: 90px;
}
.p-solution__item:nth-of-type(even) .p-solution__card
{
  padding-left: 90px;
}
.p-solution__item-image-wrapper
{
  width: 40%; /* 画像の幅を調整 */
  margin-top: inherit;
  margin-left: -4%;
  z-index: 2; /* カードの上に重ねる */
}
.p-solution__item:nth-of-type(odd) .p-solution__item-image-wrapper
{
  margin-left: -4%;
  margin-right: 0;
}
.p-solution__item:nth-of-type(even) .p-solution__item-image-wrapper
{
  margin-left: 0;
  margin-right: -4%;
}
}
.p-solution__item-title
{
  font-size: clamp(2rem, 0.506rem + 3.33vw, 2.6rem);
  color: #0069b9;
  margin-bottom: 0.5em;
}
.p-solution__item-label
{
  font-size: 1.4rem;
  display: block;
  margin-bottom: 0.5em;
}
/* ==========================================================================
   メリット
   ========================================================================== */
.p-merit
{
  background-color: #eff2f7;
  margin: 0;
}
.p-merit__container
{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 0 50px;
}
@media (min-width: 768px) {
.p-merit__container
{
  padding: 40px 0 100px;
}
}
.p-merit__header
{
  text-align: center;
}
.p-merit__title
{
  display: inline-block;
  text-align: center;
  font-size: clamp(2.1rem, 0.506rem + 3.33vw, 3rem);
  margin: 0 auto 2em;
  position: relative;
  z-index: 2;
  line-height: 1.5;
  padding: 0 1.2em;
}
.p-merit__title-number
{
  color: #0167b9;
  font-size: clamp(3.6rem, 0.506rem + 3.33vw, 6rem);
  line-height: 1;
  display: inline-block;
  margin: 0 0.1em;
  vertical-align: baseline;
}
/* 左側の「/」を反転させた記号 */
.p-merit__title::before, .p-merit__title::after
{
  content: "/";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  ;
  font-size: 2em;
  font-weight: normal;
  color: #0167b9;
  vertical-align: middle;
}
.p-merit__title::before
{
  left: 0;
  transform: translateY(-50%) scaleX(-1);
}
.p-merit__title::after
{
  right: 0;
}
.p-merit__grid
{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}
@media (min-width: 768px) {
.p-merit__grid
{
  flex-direction: row;
  justify-content: center;
  gap: 30px;
  margin-top: 50px;
}
}
/* カード本体 */
.p-merit__card
{
  flex: 1; /* 均等な幅に設定 */
  background-color: #fff;
  border-radius: 10px;
  padding: 40px 40px 40px;
  position: relative;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
}
/* 数字（左上にはみ出し） */
.p-merit__card-number
{
  position: absolute;
  top: 0;
  left: 50px;
  transform: translate(-50%, -50%);
  color: #0267b7;
  font-weight: bold;
  font-size: 6.5rem;
  font-style: oblique;
  z-index: 2;
}
/* カードのタイトル（中央揃え） */
.p-merit__card-title
{
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
  line-height: 1.4;
  margin-bottom: 20px;
  color: #333;
  background-repeat: no-repeat;
  background-position: center bottom;
 padding-bottom: clamp(calc(103px * 0.6 + 10px), 10vw, calc(103px * 1 + 10px));
 background-size: auto clamp(calc(103px * 0.6), 10vw, calc(103px * 1));
}
.p-merit__card:nth-child(1) .p-merit__card-title
{
  background-image: url('../img/result_type_x_merit_bg01.png');
}
.p-merit__card:nth-child(2) .p-merit__card-title
{
  background-image: url('../img/result_type_x_merit_bg02.png');
}
.p-merit__card:nth-child(3) .p-merit__card-title
{
  background-image: url('../img/result_type_x_merit_bg03.png');
}
/* カードの説明文 */
.p-merit__card-summary
{
  font-size: 1.5rem;
  line-height: 1.6;
  color: #666;
}
/* ==========================================================================
   検索・ナビ
   ========================================================================== */
.p-search-nav
{
  background-color: #fff;
  width: 100%;
  max-width: 1200px;
  margin: 50px auto;
}
.p-search-nav__list
{
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 15px; /* 項目間の上下左右の隙間 */
}
@media (min-width: 768px) {
.p-search-nav
{
  margin: 100px auto;
}
.p-search-nav__list
{
  grid-template-columns: repeat(2, 1fr);
  gap: 30px 50px;
}
}
@media screen and (min-width: 1200px) {
.p-search-nav__list
{
  grid-template-columns: repeat(3, 1fr);
  gap: 30px 50px;
}
}
.p-search-nav__item
{
  margin: 0;
  padding: 0;
  list-style: none;
}
.p-search-nav__item a
{
  color: #fff;
  font-weight: bold;
  position: relative;
  /*border-bottom: 2px solid #ec6400;*/
  border-bottom: 2px solid #004274;
  display: block;
  padding: 1em;
  border-radius: 10px;
  background-repeat: no-repeat, no-repeat;
  background-position: left 10px center, left top;
  padding-left: 55px;
 background-size: auto clamp(calc(26px * 0.6), 10vw, calc(28px * 1)), 100% 100%;
}
@media screen and (min-width: 768px) {
.p-search-nav__item a
{
  padding-left: 60px;
  background-position: left 20px center, left top;
}
}
:root
{
 /*--nav-grad: linear-gradient(to right, #ffad01 0%, #ff7900 100%);*/
 --nav-grad: linear-gradient(to right, #0068b7 0%, #0068b7 100%);
}
.p-search-nav__item:nth-of-type(1) a
{
  background-image: url('../img/result_type_x_search_nav_item_bg01.png'), var(--nav-grad);
}
.p-search-nav__item:nth-of-type(2) a
{
  background-image: url('../img/result_type_x_search_nav_item_bg02.png'), var(--nav-grad);
}
.p-search-nav__item:nth-of-type(3) a
{
  background-image: url('../img/result_type_x_search_nav_item_bg03.png'), var(--nav-grad);
}
.p-search-nav__item:nth-of-type(4) a
{
  background-image: url('../img/result_type_x_search_nav_item_bg04.png'), var(--nav-grad);
}
.p-search-nav__item:nth-of-type(5) a
{
  background-image: url('../img/result_type_x_search_nav_item_bg05.png'), var(--nav-grad);
}
.p-search-nav__item a:hover
{
  filter: brightness(1.2);
}
.p-search-nav__item a::before
{
  content: "";
  position: absolute;
  top: 50%;
  right: 30px;
  width: 15px;
  height: 1px;
  background-color: #fff;
  transform: translateY(-50%);
}
.p-search-nav__item a::after
{
  content: "";
  position: absolute;
  top: 50%;
  right: 30px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: translateY(-50%) rotate(45deg);
}
*/
/* ==========================================================================
   取扱機材一覧
   ========================================================================== */
.p-products
{
  background-color: #eff2f7;
  margin: 0 auto 0;
}
.p-products__wrapper
{
  background-color: #0168b7;
  padding-top: 40px;
  padding-bottom: 50px;
  border-radius: 30px 30px 0 0;
}
.p-products__container
{
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}
.p-products__header
{
  margin-bottom: 40px;
  color: #fff;
}
.p-products__title
{
  font-size: clamp(2.6rem, 0.506rem + 3.33vw, 4.4rem);
  text-align: center;
  margin-bottom: 0.5em;
}
.p-products__title-en
{
  font-size: 1.4rem;
  display: block;
  margin-bottom: 0.5em;
}
.p-products__lead
{
  text-align: center;
}
@media screen and (min-width: 768px) {
.p-products
{
  margin: 0 auto 0;
}
.p-products__wrapper
{
  padding-top: 80px;
  padding-bottom: 100px;
  border-radius: 50px 50px 0 0;
}
.p-products__link
{
  margin-top: 40px;
  text-align: center;
}
}
.p-products__card
{
  display: flex;
  flex-direction: column;
  height: 100%; /* カード自体の高さを揃える */
  color: #fff;
}
.p-products__card-image
{
  text-align: center;
  margin-bottom: 5px;
}
.p-products__card-name
{
  display: flex;
  align-items: center;
  min-height: 3em;
  line-height: 1.5;
  margin-bottom: 8px;
  font-size: 14px;
}
/* ボタン本体（aタグ） */
.p-products__card-link
{
  margin: 30px auto 0;
  width: 100%;
}
.p-products__card-link a
{
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  color: #0168b7;
  text-decoration: none;
  padding: 10px 10px;
  font-weight: bold;
  font-size: 1.4rem;
  position: relative;
  transition: background-color 0.3s;
  border-radius: 5px;
  transition: filter 0.3s;
}
.p-products__card-link a:hover
{
  filter: brightness(0.9);
}
/* 矢印の「棒線」部分 */
.p-products__card-link a::before
{
  content: "";
  position: absolute;
  right: 10px;
  width: 15px;
  height: 1px;
  background-color: #0168b7;
}
/* 矢印の「先端（>）」部分 */
.p-products__card-link a::after
{
  content: "";
  position: absolute;
  right: 10px;
  width: 10px;
  height: 10px;
  border-top: 1px solid #0168b7;
  border-right: 1px solid #0168b7;
  transform: rotate(45deg);
}
/* swiper */

.p-products .swiper-slide .p-products__card {
  opacity: .7;
  transform: scale(0.8);
  transition: .7s;
}
.p-products .swiper-slide-active .p-products__card {
  opacity: 1;
  transform: scale(1);
  z-index: 2;
}
.p-products__container .swiper-button-next, .p-products__container .swiper-button-prev
{
  color: #fff;
}
 @media screen and (max-width: 767px) {
.p-products__container .swiper
{
  margin-left: 20px;
  margin-right: 20px;
}
.p-products__container .swiper-button-prev, .p-products__container .swiper-button-next
{
  width: 22px;/*基準44px*/
  height: 22px;
}
.p-products__container .swiper-button-prev
{
  left: 0px;
}
.p-products__container .swiper-button-next
{
  right: 0px; /* 親要素の右端に固定 */
}
}
@media screen and (min-width: 768px) {
.p-products__container .swiper
{
  margin-left: 30px;
  margin-right: 30px;
}
.p-products__container .swiper-button-prev, .p-products__container .swiper-button-next
{
  width: 30px;/*基準44px*/
  height: 30px;
}
.p-products__container .swiper-button-prev
{
  left: 0px;
}
.p-products__container .swiper-button-next
{
  right: 0px; /* 親要素の右端に固定 */
}
}
@media screen and (min-width: 1300px) {
.p-products__container .swiper-button-prev
{
  left: -50px; /* 親要素の左端に固定 */
}
.p-products__container .swiper-button-next
{
  right: -50px; /* 親要素の右端に固定 */
}
}
/* ==========================================================================
   関連する商品
   ========================================================================== */
.p-related-products
{
  background-color: #eff2f7;
  margin: 0x auto;
  padding-top: 50px;
  padding-bottom: 50px;
  position: relative;
}
.p-related-products::before
{
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) translateY(-100%);
  width: 0;
  height: 0;
  /* 左右を15pxずつにすることで、合計幅30px */
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  /* 三角形の高さ */
  border-bottom: 15px solid #eff2f7;
}
.p-related-products__container
{
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}
.p-related-products__container-inner
{
  display: none;      /* 基本は消しておく */
  opacity: 0;
  transform: translateY(10px); /* 少し下から浮かび上がる演出用 */
  transition: opacity 0.5s ease, transform 0.5s ease;
}
/* アクティブ状態：JavaScriptでこのクラスを付与する */
.p-related-products__container-inner.is-active
{
  display: block;
  opacity: 1;
  transform: translateY(0);
}
.p-related-products__title
{
  font-size: clamp(2.1rem, 0.506rem + 3.33vw, 3rem);
  text-align: center;
  margin-bottom: 1em;
  color: #0165ba;
}
.p-related-products__title-label
{
  font-size: 70%;
  display: block;
  font-weight: normal;
}
.p-related-products__grid
{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px 10px;
  justify-items: center;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}
@media screen and (min-width: 600px) {
.p-related-products__grid
{
  grid-template-columns: repeat(3, 1fr);
  gap: 70px 20px;
}
}
@media screen and (min-width: 768px) {
.p-related-products
{
  padding-top: 50px;
  padding-bottom: 100px;
}
.p-related-products__grid
{
  grid-template-columns: repeat(4, 1fr);
  gap: 70px 20px;
}
.p-related-products__link
{
  margin-top: 40px;
  text-align: center;
}
}
@media screen and (min-width: 1050px) {
.p-related-products__grid
{
  grid-template-columns: repeat(auto-fit, minmax(0, 224px));
  justify-content: center;
  gap: 70px 20px;
}
}
.p-related-products__card
{
  display: flex;
  flex-direction: column;
  height: 100%;
}
.p-related-products__card-image {
  margin-bottom: 5px;
}
@media screen and (min-width: 768px) {
    .p-related-products__card-image {
  margin-bottom: 10px;
}
}
.p-related-products__card-name
{
  display: flex;
  align-items: center;
  min-height: 3em;
  line-height: 1.5;
  margin-bottom: 8px;
  font-size: 1.8rem;
}
/* ボタン */
.p-related-products__card-link
{
  margin: 30px auto 0;
  width: 100%;
}
.p-related-products__card-link a
{
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #0168b7;
  color: #fff;
  text-decoration: none;
  padding: 10px 10px;
  font-weight: bold;
  font-size: 1.4rem;
  position: relative;
  transition: background-color 0.3s;
  border-radius: 5px;
  transition: filter 0.3s;
}
.p-related-products__card-link a:hover
{
  filter: brightness(0.9);
}
/* 矢印の「棒線」部分 */
.p-related-products__card-link a::before
{
  content: "";
  position: absolute;
  right: 10px;
  width: 15px;
  height: 1px;
  background-color: #fff;
}
/* 矢印の「先端（>）」部分 */
.p-related-products__card-link a::after
{
  content: "";
  position: absolute;
  right: 10px;
  width: 10px;
  height: 10px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
}
.p-related-products__postscript
{
  text-align: center;
  margin: 50px 0 0;
  font-size: clamp(1.8rem, 0.506rem + 3.33vw, 2.4rem);
}
@media screen and (min-width: 768px) {
.p-related-products__postscript
{
  margin: 80px 0 0;
}
}
/* ==========================================================================
   FAQ
   ========================================================================== */
.p-faq
{
  background-color: #eaeaea;
  margin: 0x auto;
  padding-top: 50px;
  padding-bottom: 50px;
  position: relative;
}
.p-faq__container
{
  position: relative;
  max-width: 940px;
  margin: 0 auto;
}
.p-faq__title
{
  font-size: clamp(2.6rem, 0.506rem + 3.33vw, 4.4rem);
  text-align: center;
  margin-bottom: 1em;
}
.p-faq__title-en
{
  font-size: 1.4rem;
  display: block;
  margin-bottom: 0.5em;
}
.p-faq-list {
  margin-bottom: 50px;
}
@media screen and (min-width: 768px) {
    .p-faq-list {
  margin-bottom: 100px;
}
}
.p-faq-list__item
{
  background-color: #fff;
  padding: 20px;
  margin-bottom: 30px;
}
/* 質問ボタン */
.p-faq-list__button
{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between; /* テキストとアイコンを両端 */
  padding: 10px;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font-weight: bold;
}
.p-faq-list__text
{
  flex-grow: 1;
}
.p-faq-list__answer
{
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease-out;
  visibility: hidden;
  opacity: 0;
}
/* 開いた時の状態 */
.p-faq-list__item.is-open .p-faq-list__answer
{
  grid-template-rows: 1fr; /* 中身の高さ分まで広がる */
  visibility: visible;
  opacity: 1;
  margin-top: 20px;
  border-top: 1px solid #d2d2d2;
}
/* 中身がはみ出さないように設定 */
.p-faq-list__answer-inner
{
  overflow: hidden;
}
.p-faq-list__icon
{
  display: block;
  position: relative;
  width: 12px;
  height: 12px;
  margin-left: 20px;
  flex-shrink: 0;
  border-top: 2px solid #0168b7;
  border-right: 2px solid #0168b7;
  transform: rotate(135deg);
  transition: transform 0.3s ease;
}
.p-faq-list__item.is-open .p-faq-list__icon
{
  transform: rotate(-45deg);
}
/* ラベルの共通設定 */
.p-faq-list__label
{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0; /* 円が潰れるのを防ぐ */
  width: 32px;
  height: 32px;
  border-radius: 50%;
  font-weight: bold;
  font-size: 1.6rem;
  color: #fff;
}
/* 質問(Q)側のラベル色 */
.p-faq-list__question .p-faq-list__label
{
  background-color: #0168b7;
  margin-right: 15px;
}
/* 回答(A)側のラベル色 */
.p-faq-list__answer-main .p-faq-list__label
{
  background-color: #ff9201;
  margin-right: 15px;
}
/* レイアウト微調整 */
.p-faq-list__answer-main
{
  display: flex;
  align-items: flex-start; /* ラベルとテキストを上揃えにする */
  padding: 20px 20px 20px 10px;
}
.p-faq-list__info
{
  padding: 20px;
  background-color: #eff2f7;
}
.p-faq-list__info-title
{
  border-left: 4px solid #0069b7;
  color: #0069b7;
  font-size: clamp(2rem, 0.506rem + 3.33vw, 2.4rem);
  font-weight: bold;
  padding-left: 20px;
  margin-bottom: 1em;
}
.p-faq-list__answer-main-inner p
{
  margin-bottom: 1em;
}
.p-faq-list__answer-main-inner ul
{
  margin: 0 0 1em;
}
.p-faq-list__answer-main-inner li
{
  list-style: disc;
  margin: 0 0 0 1em;
}
.p-faq-list__answer-main-inner dl
{
  margin: 0 0 1em;
}
.p-faq-list__answer-main-inner dt
{
  margin: 0 0 0.5em;
  font-weight: bold;
}
.p-faq-list__answer-main-inner dd
{
  margin: 0 0 1em;
}
.p-faq-list__answer a
{
  text-decoration: underline;
  color: #1E9FFF;
}
.p-faq-list__answer a:hover
{
  color: #64BDFF;
}
.p-faq-list__info-eyecatch-link
{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.p-faq-list__info-eyecatch-link li
{
  width: calc(50% - 10px);
  background-color: #fff;
  padding: 5px;
}
.p-faq-list__info-eyecatch-link li a
{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-decoration: none;
  color: #333;
  font-size: 14px;
  line-height: 1.4;
  text-align: left;
}
.p-faq-list__info-eyecatch-link li img
{
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
.p-faq-list__info-eyecatch-link li
{
  width: calc(25% - 15px);
  min-width: 200px;
}
}

.p-faq__useful-title
{
  font-size: clamp(2rem, 0.506rem + 3.33vw, 3.2rem);
  text-align: center;
  margin-bottom: 1em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
}
.p-faq__useful-title::before, .p-faq__useful-title::after {
   content: "";
  height: 2px;
  width: 1em;
  background-color: currentColor;
}
.p-faq__useful-list
{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.p-faq__useful-list li
{
  width: calc(50% - 10px);
  background-color: #fff;
  padding: 5px;
}
.p-faq__useful-list li a
{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-decoration: none;
  color: #333;
  font-size: 14px;
  line-height: 1.4;
  text-align: left;
}
.p-faq__useful-list li img
{
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
.p-faq__useful-list li
{
  width: calc(25% - 15px);
  min-width: 200px;
}
}




 


/* =================================================
  タブレット・PC用スタイル (768px以上)
================================================= */
@media screen and (min-width: 768px) {

}

/* =================================================
  大型PC用スタイル (1025px または 1200px以上)
================================================= */
@media screen and (min-width: 1200px) {

}