@charset "UTF-8";

/*================================================
 *  クリニック向けソリューション202011　CSS設定
 ================================================*/

/*----- キャンペーンバナー -----*/

.bnr_cam {
	bottom: 280px;
}

.bnr_cam a:hover img {
	opacity: 1;
}

/*----- キャンペーンバナーここまで -----*/
/*  s1000 mk*/

.pos-new-product-container {
	max-width: 800px;
	margin: 40px auto;
	padding: 25px 30px 30px;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	box-shadow: 0 5px 20px rgba(24, 128, 58, 0.1);
	background: #ffffff;
	overflow: hidden;
	position: relative;
  }
  
  .pos-new-product-container::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(to right, #2080ce, #2080ce);
  }
  
  .pos-new-product-title {
	text-align: center;
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 25px;
	color: #333;
	position: relative;
	padding-bottom: 10px;
	letter-spacing: 1px;
  }
  /*
  .pos-new-product-title::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 50px;
	height: 2px;
	background: #2080ce;
  }
  */
  .pos-new-product-content {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 40px;
	position: relative;
  }
  .pos-new-product-image {
	flex: 1;
	max-width: 50%;
	display: flex;
	justify-content: center;
	position: relative;
  }
  
  .pos-new-product-image::after {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	width: 80%;
	height: 10px;
	transform: translateX(-50%);
	background: radial-gradient(ellipse at center, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 70%);
	border-radius: 50%;
  }
  
  .pos-new-product-image img {
	max-width: 100%;
	height: auto;
	max-height: 1000px;
	object-fit: contain;
	margin: auto;
	transition: transform 0.4s ease;
  }
  
  .pos-new-product-container:hover .pos-new-product-image img {
	transform: translateY(-5px);
  }
  
  .pos-new-product-info {
	flex: 1;
	max-width: 50%;
	padding: 0 0 0 10px;
	text-align: left;
  }
  
  .pos-new-product-feature {
	display: inline-block;
	background: #f8f9fa;
	border-left: 3px solid #18803a;
	padding: 8px 12px;
	margin-bottom: 15px;
	font-size: 15px;
	color: #444;
	border-radius: 0 4px 4px 0;
  }
  
  .pos-new-product-name {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 20px;
	color: #2080ce;
	line-height: 1.2;
  }
  
  .pos-new-product-price-container {
	margin-top: 15px;
  }
  
  .pos-new-product-price-label {
	font-size: 14px;
	color: #666;
	margin-bottom: 5px;
  }
  
  .pos-new-product-price {
	font-size: 28px;
	color: #e74c3c;
	font-weight: bold;
	display: inline-block;
	padding: 0 0 4px 0;
  }
  
  .pos-new-product-price-tax {
	font-size: 14px;
	color: #666;
	margin-left: 5px;
  }
  
  .pos-new-product-badge {
	position: absolute;
	top: 15px;
	left: -12px;
	background: linear-gradient(135deg, #e74c3c, #c0392b);
	color: white;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 18px 8px 20px;
	box-shadow: 0 2px 5px rgba(0,0,0,0.15);
	z-index: 2;
	letter-spacing: 1px;
	clip-path: polygon(0 0, 100% 0, 100% 70%, 85% 100%, 0 100%, 0% 50%);
  }
  
  .pos-new-product-badge::after {
	content: "";
	position: absolute;
	bottom: -8px;
	left: 0;
	width: 12px;
	height: 8px;
	background: #8e2c24;
	clip-path: polygon(0 0, 100% 0, 100% 100%);
  }
  
  .pos-new-product-button {
	display: inline-block;
	margin-top: 20px;
	padding: 10px 24px;
	background: #2080ce;
	color: white;
	border-radius: 4px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	transition: background-color 0.3s ease;

}
  
  .pos-new-product-button:hover {
	background-color: #25a04d;
  }

.bpRe-btn {
  display: block;
  width: 90%;
  max-width: 480px;
  margin: 0 auto 0;
  padding: 0 16px;
  border-radius: 64px;
  color: #fff !important;
  line-height: 64px;
  font-size: 18px;
  font-weight: bold;
  text-decoration: none;
  background: #32B5A3;
  transition: 0.2s;
}

.bpRe-btn:hover {
    background: var(--main-teal);
    transition: 0.2s;
}

  /* レスポンシブ対応 */
  @media (max-width: 768px) {
.bpRe-btn {
  padding: 5px 16px;
  line-height: 1.4;
}


.pos-new-product-content {
	  flex-direction: column;
	  gap: 20px;
	}
  
	.pos-new-product-image,
	.pos-new-product-info {
	  max-width: 100%;
	}
	
	.pos-new-product-badge {
	  top: 10px;
	  left: -8px;
	}
  }
/*s1000 mk  */
/*----- サイドメニュー -----*/

.side_nav {
	display: none;
	flex-flow: column;
	gap: 20px;
	position: fixed;
	right: 20px;
	top: 30%;
	z-index: 3;
}

.side_nav a {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	color: #3A60BA;
	font-weight: bold;
	text-decoration: none;
	white-space: nowrap;
	position: relative;
	opacity: 0.5;
	transition: 0.3s;
}

.side_nav a:hover {
	color: #3A60BA;
	opacity: 1;
	transform: scale(1.2, 1.2);
	margin: 0 18px 0 0;
}

.side_nav a::after {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 2px solid #3A60BA;
}

.side_nav a:hover::after {
	background: #3A60BA;
}

.side_nav a.active {
    color: #3A60BA;
    opacity: 1;
    transform: scale(1.2, 1.2);
    margin: 0 18px 0 0;
}
.side_nav a.active::after {
	background: #3A60BA;
}


/*----- サイドメニューここまで -----*/

.link_mt60{    padding-top: 30px;
    margin-top: -30px;
    /* margin-bottom: 70px; */
}

.full-width a {
	transition: 0.3s;
}

.full-width a:hover {
	opacity: 0.3;
}

.pagetop {
	bottom: 250px;
}

.inner {
	padding: 60px 30px !important;
}


.inner-mini {
	padding: 30px 30px !important;
}

h2 {
	color:var(--dark-teal);
	font-weight: 800;
}

h2 span {
	font-weight: 400;
	font-size: 60%;
}

h3 {
	font-size: 2rem;
	color: #484848;
	font-weight: bold;
	line-height: 1.5;
}

.green {
	color: #007b00 !important;
	font-weight: 800 !important;
}

.small {
	font-size: 1.4rem;
}

.link {
	color: #005d96;
	font-size: 15px;
	border: 1px solid #005d96;
	border-radius: 30px;
	display: inherit;
	padding: 10px;
	margin: 0 auto;
	width: 100%;
	max-width: 460px;
}

.link a {
	color: #005d96;
}

.link:hover {
	opacity: 0.7;
	background: #eafbff;
}

.link_small {
	max-width: 300px;
}

.btm_btn03 {
	display: block;
	text-align: center;
	width: 100%;
	padding: 2rem 0;
	position: relative;
	z-index: 1;
	background-color: #fff;
	border: 1px solid #176D92;
}

.btm_btn03 a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-indent: -999px;
	z-index: 2;
	/* 必要であればリンク要素の重なりのベース順序指定 */
}

.line {
	width: 100%;
	height: 1px;
	border: none;
	background: #acb3cb;
	margin: 0 0 20px 0;
}

/*inputを非表示にする*/
.input {
	position: absolute;
	opacity: 0;
}

.after_logo:after {
	/* content: url(/product/business/images/jtfs_logo.svg);
   display: inline-block;
   vertical-align: middle;
   margin-left: 1.0rem;
   max-width: 70px; */
	content: "";
	display: inline-block;
	width: 80px;
	height: 20px;
	vertical-align: middle;
	background: url(/product/business/images/jtfs_logo.svg);
	background-size: 80px 20px;
	margin-left: 10px;
}

.btn-02 a {
	display: block;
	width: 100%;
	margin: 4% auto 2%;
	padding: 1.5vh 2vw;
	font-size: 1em;
	color: #2f2f2f;
	border: 2px solid #2f2f2f;
	text-align: center;
}

.btn-02 a:hover {
	transition: 0.3s;
	color: #fff;
	background: rgba(87, 201, 191, 0.5);
	border: 2px solid #fff;
}

.after_logo:after {
	/* content: url(/product/business/images/jtfs_logo.svg);
   display: inline-block;
   vertical-align: middle;
   margin-left: 1.0rem;
   max-width: 70px; */
	content: "";
	display: inline-block;
	width: 80px;
	height: 20px;
	vertical-align: middle;
	background: url(/product/business/images/jtfs_logo.svg);
	background-size: 80px 20px;
	margin-left: 10px;
}

/*その他
 ---------------------------------------------------------------------------*/
.u-mb-20 {
	margin: 0 0 20px 0;
}

.pa_sm {
	padding: 1% 1% !important;
}

.pa_sl {
	padding: 1% 3% !important;
}

.pa_2_1 {
	padding: 20px 0;
}

.bg_g1 {
	background: #6aa3e3;
	background: linear-gradient(180deg, #6aa3e3 0%, #6bb8c8 100%);

}

.bg_blue {
	background: #0f2f53;
	background: linear-gradient(180deg, #e8f5ff 0%, #e2f6ff 100%);
}
.bg_g2 {
	background: var(--bg-green);
}

.bg_g3 {
	background: #FBFBFB;
}

.bg_g4 {
	background: #f7f7f7;
}

.bg_w {
	background: #FFF !important;
}

.text_w {
	color: #fff !important;
}

.content2_3 {
    background: #fafafa;
    padding-bottom: 10px;
}

.text_b {
	font-size: 25px;
	color: #3A60BA;
	font-weight: 700;
}

.text_b2 {
	color:  #00857b;
	font-weight: 900;
}

.kaichu {
	position: relative;
}

.kaichu .kaichu_icon {
	content: "";
	position: absolute;
	top: 5px;
	display: flex;
	right: 10px;
	width: 3vw !important;
	max-width: 170px;
	min-width: 100px !important;
}

.price {
	margin-top: 6px;
	display: flex;
	font-size: 3rem;
	color: #a81128 !important;
	font-weight: 600;
	justify-content: center;
	align-items: baseline;
	margin-bottom: 15px;
}

.inner2{padding: 30px 30px;}

#jmups {
	display: none;
}

	.pconly_res{
		display:block;
	}
	.sponly_res{
		display:none;
	}

@media screen and (max-width:767px) {
	.pconly_res{
		display:none !important;
	}
	.sponly_res{
		display:block !important;
	}
}

/*================================================
  section hero
  ================================================*/
/*  */


/* --------------------------------------------------
   1. CORE VARIABLES - easily change theme colors
   --------------------------------------------------*/
   :root {
	--main-teal: #33b5a3;
	--dark-teal: #00857b;
	--bg-green:#f6fbfb;
	--light-teal: #e4f7f5;
	--badge-size: 100px;
	--spacing-sm: 10px;
	--spacing-md: 20px;
	--spacing-lg: 30px;
	--spacing-xl: 50px;
	--border-radius: 4px;
  }
  
  /* --------------------------------------------------
	 2. HERO BOX STRUCTURE - better responsiveness
	 --------------------------------------------------*/
  .hero-box {
	background: #fff;
	overflow: hidden;
	position: relative;
	width: 100%;
	background-image:url("/product/business/images/clinic_img/clinic_bk2.png");
	/* background-color:rgb(248, 255, 254); */
  background-size: cover;
  background-position: bottom;
  }
  
  .hero-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 30px 30px 0px;
	min-height: 450px;
	position: relative;
  }
  
  /* --------------------------------------------------
	 3. LEFT COLUMN - cleaner badge positioning
	 --------------------------------------------------*/
  .hero-left {
	flex: 1 1 50%;
	max-width: 50%;
	display: flex;
	flex-direction: column;
	position: relative;
	z-index: 2;
  }
  
  .hero_textbox{
	/* ↓padding-left で空きを作っていたのを削除 */
	padding-left: 0;
	/* ↓横並びレイアウトに変更 */
	display: flex;
	align-items: flex-start;       /* バッジの上端とテキストの上端をそろえる */
	gap: 20px;                     /* 左右の余白（お好みで） */
  }
  
  .hero_heading{
	display: flex;
	flex-direction: column;
  }
  
  /* Badge styling - consistent positioning */
  .badge {
	width: var(--badge-size);
	height: var(--badge-size);
	background: var(--main-teal);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	font: 700 18px/1.4 "Noto Sans JP", sans-serif;
	border-radius: var(--border-radius);
	box-shadow: 0 2px 8px rgba(0,0,0,.15);
	position: static;              /* もしくは entirely 削除 */
	flex: 0 0 var(--badge-size);   /* 固定サイズで縮ませない */
	margin: 0;                     /* ずれ防止 */
	text-align: center;
	
  }
  
  /* Title elements - improved styling */
  .sub {
	font-size: 18px;
	font-weight: 600;
	color: var(--main-teal);
	margin: 0 0 8px;
	position: relative;
	display: inline-block;
	padding-bottom: 4px;
  }
  
  .sub::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 3px;
	background: var(--main-teal);
	border-radius: 1.5px;
  }
  
  .title {
	font-size: 62px;
	font-weight: 900;
	line-height: 1.1;
	margin: 0 0 30px;
  }
  
  /* Features list - better spacing and alignment */
  .features {
	display: flex;
	gap: 30px;
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
  }
  
  .features li {
	position: relative;
	padding-left: 34px;
	font: 500 16px/1.3 "Noto Sans JP", sans-serif;
	white-space: nowrap;
	display: flex;
	align-items: center;
  }
  
  .features li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 26px;
	height: 26px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect width='24' height='24' rx='4' fill='%2333b5a3'/><path d='M9 16.17 4.83 12 3.41 13.41 9 19 21 7 19.59 5.59z' fill='white'/></svg>") center/contain no-repeat;
	box-shadow: 0 2px 4px rgba(0,0,0,.1);
  }
  
  /* --------------------------------------------------
	 4. STAFF & MEDALS SECTION - improved layout
	 --------------------------------------------------*/
  .medals-staff-container {
	display: flex;
	gap: 50px;
	align-items: self-end;
	max-width: 100%;
  }
  
  .staff-image {
	width: 260px;
	max-width: 100%;
	border-radius: var(--border-radius);
	filter: drop-shadow(0 4px 8px rgba(0,0,0,.1));
  }
  
  .medals {
	display: flex;
	gap: 10px;
  }
  
  .medal {
	width: 100px;
	filter: drop-shadow(0 4px 8px rgba(0,0,0,.15));
  }
  
  .medal img {
	width: 100%;
	object-fit: contain;
  }
  
  /* ─────────── メダル＋バナーの縦並びラッパー ─────────── */
  .medals-group{
	display: flex;
	flex-direction: column;   /* メダル→バナー の縦並び */
	align-items: center;      /* 横中央寄せ */
  }
  
  /* ─────────── バナーの基準幅（PC：120×2＋gap20＝260px） ─────────── */
  .medal-banner{
	display: block;
	margin-top: 10px;         /* メダルとの間隔 */
	width: calc(300px + 20px);/* → = 260px  */
	margin-bottom: 20px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, .15);
  }
  .medal-banner img{
	width: 100%;              /* ラッパー幅いっぱいで縮小表示 */
	height: auto;
  }
  
  /* --------------------------------------------------
	 5. RIGHT COLUMN - better image positioning
	 --------------------------------------------------*/
  .hero-right {
	flex: 1 1 50%;
	max-width: 50%;
	display: flex;
	justify-content: flex-end;
	align-self: flex-end;
  }
  
  .register {
	width: 420px;
	max-width: 100%;
	align-self: flex-end;
	margin-right: 20px;
	filter: drop-shadow(0 5px 15px rgba(0,0,0,.1));
	padding-bottom: 30px;
  }
  
  /* --------------------------------------------------
	 6. PRICE STRIP - improved layout and alignment
	 --------------------------------------------------*/
  .hero-price {
	background: var(--main-teal);
	color: #fff;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 80px;
	padding: 25px 20px;
	position: relative;
  }
  
  /* Set contents styling - better borders and spacing */
  .set-contents {
	display: flex;
	width: 420px;
	max-width: 100%;
	border: 4px solid #fff;
	border-radius: 10px;
	box-shadow: 0 4px 8px rgba(0,0,0,.15);
	overflow: hidden;
  }
  
  .set-label {
	flex: 0 0 160px;
	background: #fff;
	color: var(--main-teal);
	font: 700 18px/1 "Noto Sans JP", sans-serif;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 18px 10px;
	border-right: 2px solid var(--main-teal);
  }
  
  .set-items {
	flex: 1;
	padding: 0;
	margin: 0;
	list-style: none;
  }
  
  .set-items li {
	background: var(--main-teal);
	color: #fff;
	font: 500 14px/1.2 "Noto Sans JP", sans-serif;
	text-align: center;
	padding: 7px 0;
  }
  
  .set-items li+li {
	border-top: 1px solid rgba(255,255,255,0.35);
  }
  
  /* Price value styling - improved alignment */
  .price-value {
	text-align: center;
	min-width: 260px;
  }
  
  .price-label {
	position: relative;
	font: 700 20px/1 "Noto Sans JP", sans-serif;
	letter-spacing: .08em;
	width: max-content;
	margin: 0 auto 30px;
  }
  
  .price-label::before,
  .price-label::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 130px;
	height: 1px;
	background: rgba(255,255,255,.6);
  }
  
  .price-label::before {
	right: 100%;
	margin-right: 12px;
  }
  
  .price-label::after {
	left: 100%;
	margin-left: 12px;
  }
  
  .price-num {
	display: inline-flex;
	align-items: flex-end;
	gap: 8px;
  }
  
  .price-num .num {
	font-size: 56px;
	font-weight: 900;
	letter-spacing: -1px;
  }
  
  .price-num .yen {
	font-size: 40px;
	font-weight: 800;
	position: relative;
  }
  
  .price-num .tax-note {
	position: absolute;
	left: 0;
	bottom: 100%;
	margin-bottom: 4px;
	font-size: 14px;
	font-weight: 300;
  }
  

/* cashless */


.slider_box {
	margin: 0 0 30px;
}
.swiper-area2{
	position: relative;   /* 矢印の基準点 */
  }
  

.swiper-container2{
	position: relative;   /* 矢印の基準点に必須 */
	overflow: hidden;     /* はみ出したスライドを隠す */
	width: 100%;
  }
  .swiper-container2 .swiper-wrapper2{
	width: 100%;
  }
  
  .swiper-container2 .swiper-button-prev,
  .swiper-container2 .swiper-button-next{
	position:absolute;    /* 本来のデフォルト */
	top:50%;
	transform:translateY(-50%);
  }

.swiper-slide2 {
	width: var(--swiper-slide-size, auto); /* ← Swiper の計算値を優先させる */
	height: auto;
	display: flex;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	font-size: 1.6rem;
	text-align: center;
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 5px;
	padding: 10px;
}

.swiper-slide2 img {
	width: 130px;
	height: 80px;
	object-fit: contain;
}

.swiper-wrapper2 {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;                 /* Core flexbox implementation */
	transition-property: transform;
	box-sizing: content-box;
  }
  
  .swiper-slide2 {
	flex-shrink: 0;                /* ← 幅固定 */
	width: auto;                   /* Swiper が inline-style で width を上書き */
  }
/* ul を div に替えた場合は不要だが、念のためリセット */
.swiper-container2 ul       { margin:0; padding:0; list-style:none; }

.swiper-container2 .swiper-slide2 {
  text-align:center;
  /* Swiper が inline-style で width を付けるので
     display:block のままで OK */
}

/* 共通設定 ------------------------------------------------ */
.swiper-button-prev2,
.swiper-button-next2{
  position: absolute;
  top: 50%;
  width: 44px; height: 44px;
  margin-top: -22px;      /* 垂直中央 */
  z-index: 10;
  cursor: pointer;
  background: rgba(0,0,0,.4);
  border-radius: 50%;
  transition: background .3s;
}
.swiper-button-prev2:hover,
.swiper-button-next2:hover{
  background: rgba(0,0,0,.6);
}

/* 左右位置 ------------------------------------------------ */
.swiper-button-prev2 { left:  -14px; } /* 44px+20px */
.swiper-button-next2 { right: -14px; }

/* アイコン（Font Awesome を使う場合）-------------------- */
.swiper-button-prev2::before,
.swiper-button-next2::before{
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 18px;
  color:#fff;
  line-height:44px;
  text-align:center;
    display: block;
}
.swiper-button-prev2::before{content: "\f053";} /* &lt; */
.swiper-button-next2::before{content: "\f054";} /* &gt; */

.pconly3{display: block;}
.sponly3{display: none;}

  /* --------------------------------------------------
	 7. RESPONSIVE BREAKPOINTS - smoother transitions
	 --------------------------------------------------*/
  @media (max-width: 1200px) {
	.hero-inner {
	  padding: 60px 20px 0px;
	}
	
	.title {
	  font-size: 54px;
	}
	
	.register {
	  width: 380px;
	}
  }
  
  @media (max-width: 1024px) {
	.hero-inner {
	  padding: 40px 20px 20px;
	  min-height: 400px;
	}
	
	
	.title {
	  font-size: 46px;
	}
	
	.register {
	  width: 340px;
	}
	
	.features {
	  flex-wrap: wrap;
	}
	
	.hero-price {
	  flex-direction: column;
		  gap: 0px;
		  padding: 20px 15px;
	}
  
	.hero-price .price-value {
	  order: -1; /* Move to the top */
	  transform: scale(0.8);
	}
	
	
	.set-contents {
	  width: 400px;
	  margin-top: 10px
	}
  }
  
  @media (max-width: 900px) {
	.hero-left, .hero-right {
	  max-width: 100%;
	}
	.hero-left {
	  flex: 1 1 70%;
	}
	
	.badge {
	  width: 90px;
	  height: 90px;
	  font-size: 16px;
	}
	
	.title {
	  font-size: 42px;
	}
	
	.medals-staff-container {
	  gap: 30px;
	}
	
	.staff-image {
	  width: 220px;
	}
	
	.medal {
	  width: 100px;
	}
	.medal-banner{ width: calc(200px + 20px); }  /* 100×2＋gap20 */
  }
  
@media (max-width: 767px) {

	:root {
		--badge-size: 70px;   /* ← 好きな値にするだけ */
	  }

	.pconly3{display:none;}
.sponly3{display:block;}
  /* Main hero container layout */
  .hero-inner {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 18px;
    row-gap: 5px;
  }
  
  /* Full width elements (first and second rows) */
  .hero_textbox,
  .features {
    flex: 1 1 100%;
  }
  
  /* Features section styling */
  .features {
    flex-wrap: wrap;
    justify-content: center;
    padding: 0 10px;
    box-sizing: border-box;
    flex-direction: row;
    gap: 10px 20px;
    margin: 0 auto 10px;
    max-width: 100%;
  }
  
  .features li {
    white-space: normal;
    padding-left: 26px;
  }
  
  .features li::before {
    width: 20px;
    height: 20px;
  }
  
  .hero_textbox,
  .features {
    flex: 1 1 100%;
  }
  
  /* Hero left section (display as contents to allow children to be positioned independently) */
  .hero-left {
    display: contents;
    flex: 1 1 auto;
    max-width: 100%;
    text-align: center;
    align-items: center;
  }
  
  /* Hero right section (register image) */
  .hero-right {
    order: 1;
	flex: 0 0 100%;
	max-width: 50%;
	justify-content: center;
  }
  
  .register {
    margin: 0;
    width: 100%;
	padding-bottom: 0px;

    /* max-width: 200px; */
  }
  
  /* MODIFIED: Medals and staff container */
  .medals-staff-container {
    order: 2;
    /* flex: 0 0 45%; */
    max-width: 45%;
    justify-content: flex-start;
    margin-bottom: 0;
    flex-direction: column;
    gap: 10px;
  }
  
  /* Staff image hidden on mobile */
  .staff-image {
    display: none;
  }
  
  /* Medals group styling */
  .medals-group {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .hero-inner::after {
    content: "";
    display: block;
    width: 100%;
    order: 3;
    height: 0; /* Zero height, just for forcing banner to new row */
  }
  
  /* Medals vertical layout */
  .medal-banner {
    width: 100%;
    max-width: 330px; /* Increased from 180px */
    margin: 0px auto 0; /* Add more top margin and center horizontally */
    order: 4; /* Ensure it comes after both columns */
    align-self: center; /* Center horizontally */
  }
  
  .medals {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
  }

  /* Keep existing medal styles */
  .medal {
    width: 80px; /* Slightly reduced from 90px */
  }
  
  .medal-banner-container {
    order: 3;
    flex: 1 1 100%; 
    display: flex;
    justify-content: center;
    margin-top: 15px;
  }
  
  /* Hero textbox styling */
  .hero_textbox {
    align-items: anchor-center;
    justify-content: center;
    gap: 15px;
    padding-left: 0px;
    margin-bottom: 10px;
    width: 100%;
  }
  
  /* Badge styling */
  .badge {
	width: 60px;     /* ← 好みの幅に変更 */
    /* 高さをそのままにするなら変更不要。
       縦横比を保ちたいなら height も同じ 60px に。 */
    height: 80px;    /* 例：少し細長い長方形にする場合 */
    font-size: 12px; /* 文字も気持ち小さくすると収まりが良い */
    left: -40px;
  }
  
  /* Text styling */
  .sub,
  .title {
    text-align: left;
  }
  
  .sub {
    margin-bottom: 8px;
  }
  
  .sub::after {
    width: 100%;
  }
  
  .title {
    font-size: 40px;
    margin: 0;
    text-align: left;
  }
  
  /* Set contents */
  .set-contents {
    width: 95%;
    max-width: 360px;
    transform: scale(0.8);
  }
  
  .set-label {
    flex: 0 0 120px;
    font-size: 16px;
  }
  
  /* Price label styling */
  .price-label::before,
  .price-label::after {
    width: 80px;
  }
  
  /* Swiper navigation buttons */
  .swiper-button-prev2,
  .swiper-button-next2 {
    width: 36px;
    height: 36px;
    margin-top: -18px;
  }
  
  .swiper-button-prev2::before,
  .swiper-button-next2::before {
    font-size: 14px;
    line-height: 36px;
  }
}
  
  @media (max-width: 480px) {
	.hero-inner {
	  padding: 20px 15px 30px;
	}
	
	.badge {
	  width: 80px;
	  height: 70px;
	  font-size: 14px;
	}
	
	.title {
	  font-size: 36px;
	}
	
	.sub {
	  font-size: 16px;
	}
	
	.features li {
	  font-size: 14px;
	}
	
	.staff-image {
	  width: 200px;
	}
	
	.medal {
	  width: 70px;
	}
	
	.set-label {
	  flex: 0 0 100px;
	  font-size: 14px;
	}
	
	.set-items li {
	  font-size: 12px;
	  padding: 6px 0;
	}
	
	.price-num .num {
	  font-size: 46px;
	}
	
	.price-num .yen {
	  font-size: 32px;
	}
	
	.price-num .tax-note {
	  font-size: 12px;
	}
  }
  /*  */


/* .hero_box {
	width: 100%;
	background: url(/product/business/images/clinic_img/hero_img.png) no-repeat 25%;
	background-size: contain;
	padding: 0;
} */

.hero_box>section {
	height: 300px;
	position: relative;
}

.hero_box>section>div {
	position: absolute;
	top: 30px;
	right: 50px;
}

.hero_box>section>div img {
	width: 100%;
	max-width: 400px;
}

.hero_box>section>div h1 {
	color: #3a60ba;
	font-size: 5rem;
	text-align: center;
	line-height: 1.1;
	position: relative;
	margin-top: 70px;
	padding-left: 20px;
}

.hero_box>section>div h1 span {
	color: #000;
	font-size: 2rem;
	text-shadow: 0 1px 4px rgba(255, 255, 255, 100%);
}

.hero_box>section>div h1::before {
	content: "選ばれる";
	width: 70px;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1.4rem;
	font-weight: bold;
	border-radius: 35px;
	background: #3a60ba;
	position: absolute;
	top: 30px;
	left: -50px;
}

.hero_box>section>div h1::after {
	content: '';
	background: #3a60ba;
	width: 20px;
	height: 25px;
	clip-path: polygon(0 0, 0 100%, 100% 50%);
	transform: rotate(45deg);
	position: absolute;
	top: 75px;
	left: 0;
}

.hero_box>section>ul {
	width: 100%;
	max-width: 500px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 30px;
	background: rgba(244, 244, 244, 0.72);
	border-radius: 5px;
	position: absolute;
	bottom: 30px;
	right: 0px;
	padding: 15px 20px;
}

.hero_box>section>ul li {
	color: #164b88;
	font-weight: bold;
	font-size: 15px;

}


.banner_box {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 30px;
	padding: 30px;
}

.banner_box img {
	width: 100%;
	max-width: 400px;
	filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 20%));
}

.banner_box2 {
	display: flex;
    justify-content: space-around;
	flex-wrap: wrap;
	/* gap: 30px; */
	padding: 15px 0 15px 0;
}

.banner_box2 img {
	width: 100%;
	max-width: 350px;
	filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 20%));
}

.banner_box2 img:nth-child(1) {
margin-right: 20px;
}

#breadcrumbs {
	border-top: 1px solid #e8e8e8;
	border-bottom: 1px solid #e8e8e8;
}

#breadcrumbs .breadcrumbs {
	padding: 15px 10px;
}

#breadcrumbs .breadcrumbs a {
	color: #3A60BA;
}

p.price span {
	font-size: 70%;
	vertical-align: bottom;
	display: contents;
}

#intro_set .setbox .title {
	background: #0f7d9f !important;
	font-size: 16px !important;
	text-align: center !important;
	display: block !important;
	padding: 8px !important;
	color: #fff !important;
	font-weight: 600 !important;
}

#intro_set .setbox ul {
	counter-reset: number 0;
}

#intro_set .setbox ul li {
	font-weight: 500;
	line-height: 25px;
	margin: 0 0 10px 3.4rem;
}

#intro_set .setbox ul li:first-child {
	margin-top: 10px;
}

#intro_set .setbox ul li::before {
	counter-increment: number 1;
	content: counter(number);
	color: #fff !important;
	font-weight: 600;
	background: #0f7d9f !important;
	padding: 5px 10px;
	margin: 0 5px 0 -3.4rem;
}

/* hikaku - 色修正版 */
#hikaku {
	background-color: #fff; /* ベース背景色 */
	padding: 0;
	overflow: hidden;
  }
  
  .register-comparison-container {
	position: relative;
	width: 100%;
	padding-bottom: 10px;
  }
  
  .register-comparison-title-container {
	width: 100%;
	text-align: center;
	margin-bottom: 0px;
	position: relative;
	/* z-index: 10; */
  }
  
  .register-comparison-title {
	color: #00857b; /* テーマ色の緑 */
	font-size: 28px;
	font-weight: 800;
	margin: 0;
	padding: 30px 0 10px;
	text-align: center;
  }
  
  .register-comparison-content {
	display: flex;
	position: relative;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
  }
  
  /* 左右のカラム */
  .register-comparison-col {
	width: 50%;
	position: relative;
	padding: 0 15px 10px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
  }
  
  /* 左右の背景 */
  .register-comparison-col.left {
	background-color: #e6fbfa; /* 左側の薄い青緑色 */
	padding: 0 15px 10px 80px;
  }
  
  .register-comparison-col.right {
	background-color: #e6e6e6; /* 右側の薄いグレー - 修正 */
	padding: 0  80px 10px 15px;
  }
  
  /* タイトルコンテナ */
  .title-container {
	width: 100%;
	text-align: center;
    margin: 15px 0;
  }
  
  /* ボタンスタイル */
  .register-comparison-system-title {
	background: #33b5a3; /* 左側の青緑色ボタン */
	color: #fff;
	padding: 10px 40px;
	border-radius: 30px;
	display: inline-block;
	font-size: 18px;
	font-weight: 600;
	min-width: 180px;
	text-align: center;
  }
  
  .register-system-title-right {
	background: #4d4d4d; /* 右側の濃いグレーボタン */
  }
  
  /* イラスト部分 */
  .register-comparison-icon-container {
	height: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 15px;
	width: 100%;
  }
  
  .register-comparison-icon-container img {
	/* max-width: 150px; */
	height: auto;
  }
  
  /* 白いカード箱 */
  .register-comparison-box {
	background-color: #fff;
	border-radius: 8px;
	padding: 5px;
	margin: 0 auto;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	width: 100%;
    max-width: 410px;
  }
  
  /* 特徴リスト */
  .register-comparison-features {
	list-style: none;
	padding: 20px;
	margin: 0;
  }
  
  .feature-item {
	position: relative;
	margin-bottom: 20px;
	padding-left: 18px; /* チェックマークのスペース */
	text-align: left;
  }
  
  .feature-item:last-child {
	margin-bottom: 0;
  }
  
  .check-mark {
	position: absolute;
	left: 0;
	top: 2px;
	color: #33b5a3; /* 左側のチェックマーク色 */
	font-size: 15px;
  }
  
  .register-comparison-col.right .check-mark {
	color: #4d4d4d; /* 右側のチェックマーク色 - 修正 */
  }
  
  .feature-title {
	display: block;
	color: #00857b; /* 左側の特徴タイトル色 */
    font-weight: 800;
	font-size: 15px;
	margin-bottom: 5px;
  }
  
  .register-comparison-col.right .feature-title {
	color: #4d4d4d; /* 右側の特徴タイトル色 - 修正 */
  }
  
  .feature-desc {
	margin: 0;
	padding: 0;
	color: #333;
	font-size: 14px;
	line-height: 1.5;
  }
  
  .price-highlight {
	color: #ff5353; /* 金額の赤色 */
	font-weight: 700;
  }
  
  /* レスポンシブ対応 */
  @media (max-width: 767px) {
	.register-comparison-content {
	  flex-direction: column;
	}

	 /* 左右の背景 */
	 .register-comparison-col.left {
		background-color: #e6fbfa; /* 左側の薄い青緑色 */
		padding: 0 15px 10px 15px;
	  }
	  
	  .register-comparison-col.right {
		background-color: #e6e6e6; /* 右側の薄いグレー - 修正 */
		padding: 0  15px 10px 15px;
	  }
	
	.register-comparison-col {
	  width: 100%;
	  padding: 20px 15px;
	}
	
	.register-comparison-title {
	  font-size: 22px;
	  padding: 30px 15px 10px;
	}
	
	.register-comparison-system-title {
	  padding: 10px 30px;
	  font-size: 16px;
	  margin-bottom: 15px;
	}
	
	.register-comparison-icon-container {
	  height: 120px;
	  margin-bottom: 30px;
	}
	
	.feature-title {
	  font-size: 16px;
	}
	
	.feature-desc {
	  font-size: 13px;
	}
	
	.register-comparison-box {
	  /* max-width: 100%; */
	  width: 90%;
	}
  }
/* hikaku */


/*  */

		/*  */
/* 適切に調剤を差別化するデザイン */
#gyosyu {
	padding: 20px 0;
	background: var(--bg-green);
  }
  
  .inner2 {
	padding: 15px 20px;
	max-width: 1100px;
  }
  
  #gyosyu h2 {
	margin-bottom: 20px;
	font-size: 26px;
  }
  
  .gyosyu_container {
	display: flex;
	justify-content: center;
	gap: 15px;
	flex-wrap: nowrap;
  }
  
  /* 医療機関カード */
  /* 通常のカード（クリックできないカード）のスタイルを調整 */
  .gyosyu_inner {
	width: 18%;
	min-width: 150px;
	background: white;
	border-radius: 8px;
	/* box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); */
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 190px;
	cursor: default; /* 通常のカードはカーソルをデフォルトに */
	position: relative; /* ラベルを配置するための位置指定 */
  }
  
  /* 通常カードの画像部分 */
  .gyosyu_inner img {
	width: 100%;
	height: 140px;
	object-fit: cover;
	border-bottom: 1px solid #f0f0f0; /* 薄い境界線 */
  }
  
  /* 通常カードのテキスト部分 */
  .gyosyu_inner p {
	padding: 5px;
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	color:var(--dark-teal);
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1.3;
	flex-grow: 1;
	background: #fff; /* 非常に薄いグレー背景 */
  }
  
  /* 調剤薬局カード  */
  
  .pharmacy_card {
	  padding-top: 10px;
	width: 18%;
	min-width: 150px;
	height: 179px;
	display: flex;
	flex-direction: column;
	background: linear-gradient(135deg, #06a3da, #0056a4); /* グラデーション背景 */
	border-radius: 12px; /* より丸みを持たせる */
	box-shadow: 0 4px 12px rgba(0, 100, 180, 0.4);
	overflow: hidden;
	text-decoration: none;
	transition: all 0.3s ease;
	position: relative;
	border: none;
	transform: scale(1.05); /* 少し大きく表示 */
	margin: auto 0;
  }
  
  .pharmacy_card:hover {
	transform: scale(1.08) translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 100, 180, 0.5);
  }
  
  .pharmacy_card:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 100%);
	pointer-events: none;
  }
  
  .pharmacy_image {
	height: 120px;
	overflow: hidden;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
  }
  
  .pharmacy_image img {
	width: 80%;
	height: auto;
	object-fit: contain;
	border-radius: 6px;
	filter: brightness(1.05) contrast(1.05);
	transition: transform 0.3s ease;
  }
  
  .pharmacy_card:hover .pharmacy_image img {
	transform: scale(1.05);
  }
  
  
  
  .pharmacy_content {
	padding: 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex-grow: 1;
	background: transparent;
	position: relative;
	text-align: center;
  }
  
  .pharmacy_content p {
	/* margin: 0 0 5px 0; */
	font-size: 15px;
	font-weight: 700;
	color: white;
	text-align: center;
	line-height: 1.3;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  }
  
  /* CTAボタンスタイル */
  .pharmacy_content::after {
	content: "詳しく見る >";
	display: inline-block;
	margin-top: 5px;
	padding: 4px 12px;
	background: white;
	color: #0056a4;
	border-radius: 20px;
	font-size: 11px;
	font-weight: bold;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
	transition: all 0.2s ease;
  }
  
  .pharmacy_card:hover .pharmacy_content::after {
	padding: 4px 15px;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
  }
  
  /* アイコンは不要になったので削除 */
  .pharmacy_content i {
	display: none;
  }
  
  /* レスポンシブ対応 */
  @media screen and (max-width: 1000px) {
	  .gyosyu_container {
	  flex-wrap: wrap;
	}
	
	.gyosyu_inner {
	  width: 23%;
	  margin-bottom: 15px;
	}
	
	.pharmacy_card {
	  width: 50%; /* 幅を80%に設定 */
	  margin: 15px auto; /* 上下マージンを追加し、左右を自動でセンタリング */
	  flex-direction: row; /* 横並びレイアウト */
	  align-items: center; /* 垂直方向の中央揃え */
	  height: auto;
	  min-height: 120px; /* 最小高さを設定 */
	  padding: 10px 15px; /* 内側の余白調整 */
	}
  
	.pharmacy_image {
	  width: 30%; /* 画像エリアの幅 */
	  height: auto;
	  padding: 0;
	  margin-right: 15px; /* テキストとの間隔 */
	  flex-shrink: 0; /* 画像エリアが縮まないように */
	}
  
	.pharmacy_image img {
	  width: 100%;
	  height: auto;
	  max-height: 90px;
	  object-fit: contain;
	}
  
	.pharmacy_content {
	  width: 70%; /* テキストエリアの幅 */
	  text-align: left; /* テキストを左揃えに */
	  padding: 0;
	  align-items: flex-start; /* 左揃えのため */
	}
  
	.pharmacy_content p {
	  margin-bottom: 5px;
	  text-align: left;
	}
  
	/* CTAボタンスタイルの調整 */
	.pharmacy_content::after {
	  margin-top: 5px;
	  align-self: flex-start; /* 左揃えに */
	}
  }
  
  @media screen and (max-width: 767px) {
	  .gyosyu_container {
	  gap: 10px;
	}
	
	.gyosyu_inner {
	  width: 46%;
	  height: 160px;
	}
  
	.gyosyu_inner img {
	  height: 110px;
  }
	
	/* 767px以下でも調剤カードは横幅80%を維持 */
	.pharmacy_card {
	  width: 80%;
	  /* margin: 15px auto; */
	}
  
	/* 非常に小さい画面向け */
	@media screen and (max-width: 480px) {
	  .pharmacy_card {
		width: 90%; /* より小さい画面では幅を広げる */
		flex-direction: column; /* 縦並びに戻す */
		padding: 10px;
	  }
  
	  .pharmacy_image {
		width: 60%;
		margin: 0 auto 10px auto;
	  }
  
	  .pharmacy_content {
		width: 100%;
		text-align: center;
		align-items: center;
	  }
  
	  .pharmacy_content p {
		text-align: center;
	  }
  
	  .pharmacy_content::after {
		align-self: center;
	  }
	}
  }
  
#gyosyu .gyosyu_box {
	display: flex;
	margin-top: 20px;
	justify-content: space-around;
}


#gyosyu .gyosyu_box .gyosyu_inner {
	width: calc(90%/4);
	text-align: center;
	font-weight: 500;
	
	
}


#gyosyu .gyosyu_box .gyosyu_inner p {
	font-size: 1.7rem; /* 既存のフォントサイズ */
    line-height: 1.3; /* 既存の行間 */
    height: 5rem; /* 2行分の高さ (line-height * 2) */
    display: flex;
    align-items: center; /* 縦中央揃え */
    justify-content: center; /* 水平中央揃え */
    text-align: center; /* テキスト中央揃え */
    overflow: hidden; /* 内容が多すぎる場合に隠す */
}

#gyosyu .gyosyu_box .gyosyu_inner img {
	width: 100%;
	margin-bottom: 0px;
border-radius: 20px;
height: 130px;
object-fit: cover;
}

.pharmacy_link_wrap{margin: auto;
display: flex;
width: 100%;}

.pharmacy_link {
	width:auto;
	margin: auto;
    margin-bottom: 30px;
	margin-top: 10px;
	display: inline-block; /* コンテンツ幅に合わせる */
    justify-content: center;
    align-items: center;
    background: #f4f8fc; /* 背景色 */
	border: 1.5px solid #005d96;
    padding: 5px;
    border-radius: 8px; /* 少し丸み */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 影 */
    transition: transform 0.3s, box-shadow 0.3s;
}

.pharmacy_link:hover {
    transform: translateY(-5px); /* ホバー時の浮き上がり */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); /* ホバー時の影 */
}

.pharmacy_inner {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #073298; /* テキストの色 */
}

.pharmacy_inner img {
    max-width: 150px;
    margin-right: 20px;
    border-radius: 8px; /* 画像の丸み */
}

.pharmacy_text {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.pharmacy_text p {
    font-size: 2rem;
    margin: 0;
	font-weight: 900;
}

i{	font-style: normal!important;}
.pharmacy_text span {
    font-size: 2rem;
    color: #073298; /* 矢印の色 */
	color: #073298;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;

}
/*  */

#okomari .okomari_box {
	display: flex;
	margin-top: 20px;
	justify-content: space-around;
}

#okomari .okomari_box .okomari_inner {
	width: calc(90%/4);
	text-align: center;
	font-weight: 500;
}

#okomari .okomari_box .okomari_inner p {
	font-size: 1.5rem;
	line-height: 1.5;
}

#okomari .okomari_box .okomari_inner img {
	width: 60%;
	margin-bottom: 5px;
}

#semiself {
	margin: auto;
}

#semiself .slick-next {
	right: 0px !important;
	z-index: 2;
}

#semiself .slick-prev {
	left: 0px !important;
	z-index: 2;
}

#semiself .semiselfbox {
	margin-top: 10px;
}

#semiself .semiselfbox ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
	max-width: 770px;
	margin: 0 auto;
}

#semiself .semiselfbox ul li {
	width: calc(75%/6);
}


#bcpos h3 {
	color: #ffffff;
	background: #525859;
	font-weight: 600;
	/* margin-bottom: 20px; */
	padding: 8px 0;
}

#bcpos h4 {
	font-size: 2rem;
}

#bcpos .col-6 {
	margin-bottom: 20px;
}

#bcpos .col-6 img {
	margin-top: 10px;
	padding: 0 10%;
	max-height: 200px;
	width: auto;
}

.bcpos_box {
	display: grid;
	justify-content: center;
	justify-items: center;
	grid-template-columns: repeat(auto-fit, minmax(300px, 460px));
	gap: 30px;
}

.bcpos_box img {
	width: 100%;
	max-width: 400px;
	object-fit: contain;
}

#option .option_box {
	align-items: unset;
	justify-content: space-between;
}

#option .col-3 {
	display: flex;
	width: calc(97%/3) !important;
	flex-direction: column;
	border: 1px solid #ccc;
	padding: 20px;
}

#option .col-3 .imgbox {
	margin: 0 auto;
}

#option .col-3 .imgbox img {
	width: auto;
	height: 160px;
	object-fit: contain;
	display: block;
	margin: 0 0 10px;
}

#option .col-3 p {
	font-size: 15px;
	letter-spacing: -0.7px;
}

#option .col-3 .option_textbox {
	display: flex;
	flex-direction: column;
	height: 105px;
}

#option .col-3 .option_textbox h3 {
	display: flex;
	flex-direction: column;
	font-size: 18px !important;
}

#option .col-3 .option_textbox h4 {
	font-size: 18px;
}

#option .col-3 .option_textbox .price {
	font-size: 20px;
}

#option2 .option_box {
	align-items: unset;
	justify-content: space-between;
}

#option2 .col-3 {
	display: flex;
	width: 98% !important;
	flex-direction: column;
	padding: 15px 5px;
	margin: auto;
}

#option2 .col-3 .imgbox {
	margin: 0 auto;
}

#option2 .col-3 .imgbox img {
	max-height: 160px;
	width: auto;
	display: block;
	flex-direction: column;
}

#option2 .col-3 p {
	font-size: 15px;
	letter-spacing: -0.7px;
}

#option2 .col-3 .option_textbox {
	display: flex;
	flex-direction: column;
}

#option2 .col-3 .option_textbox h3 {
	display: flex;
	flex-direction: column;
	font-size: 18px !important;
}

#option2 .col-3 .option_textbox h4 {
	font-size: 18px;
}

#option2 .col-3 .option_textbox .price {
	font-size: 20px;
}

#set h3 {
	background: #2b6fa0;
	color: #fff;
	font-weight: 400;
	width: 100%;
	padding: 5px 0;
	font-size: 2rem;
	display: flex;
	justify-content: center;
	margin-bottom: 0px;
}

#set h3 span {
	font-size: 16px;
	color: #fff;
	padding-left: 20px;
	margin: auto 0;
}

#set h4 {
	color: #2b6fa0;
	font-size: 2.4rem;
	line-height: 1.5;
}

#set .col-6 {
	background: #fff;
	width: calc(98%/2);
	justify-content: space-between;
	padding: 10px;
}

#set .cost {
	margin-top: 6px;
	text-align: right;
	display: flex;
	font-size: 3rem;
	color: #cc0000;
	font-weight: 600;
	justify-content: flex-end;
	margin-bottom: 15px;
}

#set .cost span {
	font-size: 15px;
	color: #cc0000;
	margin: auto 0;
}

#set a {
	text-decoration: none;
}

#op_kessai {
	border: 1px solid #ccc;
	padding: 30px 20px;
	min-height: 300px;
}

#op_kessai .rc {
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

table {
	width: 100%;
	background: #fff;
	text-align: center;
	margin: 0 auto;
}

table th {
	width: 100%;
}

table td {
	line-height: 1.5;
	border: solid 1px #ccc;
	padding: 5px;
}

table td:first-child {
	/* background: #f2f2f2; */
}

.cashless_icon {
	display: flex;
	justify-content: center;
	gap: 30px;
	margin: 0 0 30px;
}

.cashlessbox {
	background-color: rgba(255, 255, 255, 0.7);
	display: flex;
}

.cashlessbox div {
	width: calc(99%/3);
}

.cashlessbox div img {
	width: 100%;
}

.apply {
	height: 100px;
}

.resecon-list li {
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-left: 30px !important;
	font-weight: 600;
}

table.spec {
	width: 100%;
	font-size: 1.4rem;
}

table.spec tr {
	border-top: 1px solid #dedede;
}

table.spec tr:last-child {
	border-bottom: 1px solid #dedede;
}

table.spec th {
	background: #f2f2f2;
	width: 30%;
	border-top: 1px solid #dedede;
	padding: 0;
	font-weight: 700;
	padding: 7px 0;
}

table.spec td {
	padding: 10px;
}

.point {
	text-align: center;
	justify-content: space-around;
}

.point img {
	height: 180px;
	object-fit: contain;
}

.point div div {
	width: 100%;
	max-width: 400px;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 500;
	background: #4e789b;
	border-radius: 3px;
	padding: 13px 0;
	margin: 10px 0 0;
}

.check_box li {
	font-size: 1.4rem;
	text-align: left;
	line-height: 1.5;
	text-indent: -2.8rem;
	border-bottom: 1px dashed #6E82DA;
	padding: 10px 0 10px 3rem;
}

.check_box li::before {
	content: "";
	font-family: "Font Awesome 5 Free";
	content: "";
	font-weight: 600;
	margin-right: 10px;
	font-size: 18px;
	color: #6E82DA;
}

.purchase_box {
	border: 1px solid #e6e6e6;
	margin: 0 auto;
	display: block;
}

.purchase_box .purchace_imagebox {
	border-bottom: 1px dotted #e6e6e6;
	padding: 0px 0;
	width: 100%;
}

.purchase_box .purchace_imagebox img {
	max-width: 300px;
}

.purchase_box .purchace_list ul li {
	text-align: center;
	margin: 20px;
}

.purchase_box .purchace_list ul li p {
	font-size: 18px;
	color: #fff;
	width: 240px;
}

.purchase_box .purchace_list ul li a {
	background: #45654e;
	padding: 7px 25px;
	display: inline-flex;
	border-radius: 20px;
	margin: auto;
}

.purchase_box .purchace_list ul li a i {
	padding: 7px;
	color: #fff;
}

.purchase_box .purchace_list ul li a:hover {
	opacity: 0.8;
}

.bcposlf_info {
	border: 1px solid #ccc;
	border-radius: 5px;
	background-color: #fff;
	padding: 1rem;
	text-align: center;
	display: flex;
	justify-content: center;
}

.bcposlf_info01 {
	align-self: center;
}

.bcposlf_info02 {
	align-self: center;
	text-align: left;
	margin-left: 1.5rem;
}

.bcposlf_info02 p {
	font-size: 1.2rem;
}

.bcposlf_info02 span {
	font-size: 1rem;
	color: #666;
}

.purchase {
	padding-bottom: 30px;
}

.purchase h3 {
	line-height: 35px;
}

.purchase .purchace_box {
	display: flex;
	margin: 30px 0 20px;
}

.purchase .purchace_inner {
	display: flex;
	margin: auto;
	width: calc(98%/2);
	border: 1px solid #d1d1d1;
	border-radius: 8px;
	justify-content: space-between;
	margin-bottom: 10px;
	align-items: center;
	text-align: center;
}

.purchase .purchace_inner img {
	width: 30%;
}

.purchase .purchace_inner p {
	font-size: 20px;
	display: flex;
	width: 40%;
	font-weight: 500;
	margin: auto 0;
	padding: 15px 0;
	justify-content: center;
}

.purchase .purchace_inner a {
	display: flex;
	justify-content: center;
}

.purchase .purchace_inner i {
	margin-left: 20px;
	display: flex;
	align-items: center;
}

.purchase .otoiawase a {
	color: #4182b2;
	text-decoration: underline;
	padding: 0 5px;
}

.caption a:before {
	content: "\f1c1";
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	color: #b35151;
	font-size: 1.1em;
	font-weight: normal;
	margin-right: 5px;
}

.renkei_jisseki_box {
	height: 180px;
	overflow-y: scroll;
	resize: vertical;
}

.renkei_jisseki {
	text-align: left;
}

.renkei_jisseki tr:nth-of-type(1) td {
	text-align: center;
	background: #e9ecef;
}

.renkei_jisseki tr td:nth-of-type(1),
.renkei_jisseki tr td:nth-of-type(2) {
	width: 40%;
}

.renkei_jisseki td {
	border: solid 1px #ccc;
	padding: 10px;
}

.renkei_jisseki td:first-child {
	background: #fff;
}

.renkei_jisseki .title2 {
	background: gray !important;
}

.renkei_jisseki .caption:hover .caption_child {
	display: inline;
}

.renkei_jisseki .caption_child:after {
	border-right: 12px solid rgba(200, 230, 255, 0.5);
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	left: -12px;
	top: 30%;
	content: "";
	position: absolute;
}

.clinic_semiself td {
	width: calc(100%/3);
	padding: 8px;
}

.clinic_semiself td:first-child {
	background: #fff;
}

.clinic_semiself a {
	color: #296fb2;
	text-decoration: underline;
}

.mb60 {
	margin-bottom: 60px;
}


.swiper-slide {
	width: calc(100%/5);
	display: block;
	font-size: 1.6rem;
	text-align: center;
	background: none;
	border-radius: 5px;
	border: none;
	padding: 10px;
}

.swiper-slide img {
	width: 200px;
	height: 120px;
	object-fit: cover;
}

.swiper-button-prev,
.swiper-button-next,
.swiper-pagination {
	display: none;
}

.img_semiself {
	max-width: 330px;
}

.seav_box {
	border: 1px solid #ccc;
	background: #fff;
	padding: 30px;
}

.seav_box_inner {
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	flex-wrap: wrap;
	margin: 0 auto;
}

.seav_box_inner p.seav_box_title {
	color: #032570;
	font-size: 1.6rem;
	font-weight: bold;
}

.seav_box_inner a,
.seav_box_inner p {
	font-size: 1.4rem;
}

.seav_box_inner img {
	max-width: 160px;
}

.turiset_box {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: baseline;
}

.turiset_box img {
	max-width: 300px;
	margin: 0 auto;
}

.turiset_box ul li {
	font-size: 1.6rem;
	line-height: 1.8;
}

.turiset_text {
	color: #0956be;
	font-weight: bold;
	text-align: center;
	background: #ebf4f7;
	padding: 5px 10px;
	margin: 0 0 10px;
}

.turiset_text span {
	color: #111;
	font-size: 1.1rem;
	font-weight: normal;
	margin: 0 0 0 10px;
}

.posset_box {
	margin: 0 0 10px;
}

.posset_box:last-of-type {
	margin: 0;
}

.posset_title h2 {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 10px;
	color: #2080ce;
	line-height: 1.2;
}

.posset_box .icon_box {
	display: flex;
	align-items: center;
	position: relative;
	margin: 10px 0 10px;
}

.posset_box .icon_box>div {
	width: 80px;
	height: 80px;
	display: flex;
	flex-flow: column;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 2px solid #2b6fa0;
	border-radius: 40px;
	box-shadow: 0 2px 3px 0 rgb(0, 0, 0, 30%);
	position: absolute;
	right: 20%;
}

.posset_box .icon_box h2 {
	margin: 0;
}

.posset_box .icon_box>div img {
	width: 100%;
	max-width: 50px;
	position: absolute;
	top: -13px;
}

.posset_box .icon_box>div p {
	color: #2b6fa0;
	font-size: 2rem;
	font-weight: bold;
	line-height: 0.8;
	margin: 25px 0 0;
}

.posset_box .icon_box>div p span {
	color: #111;
	font-size: 1.1rem;
	font-weight: normal;
}

.posset_box p {
	line-height: 1.5;
}


.price_box {
	display: flex;
}

.set {
    vertical-align: middle;
    display: flex;
    align-items: center;
	/* border: 1px solid rgb(235, 235, 235); */
}

.set div:nth-child(1)  {
    /* width: 32%; */
	height: 100%;
    background: #f2f2f2;
	vertical-align: middle;
	display: flex;
	align-items: center;
justify-content: center;
    margin: 0; /* 不要な余白をなくす */
}

.set ul {
    width: 68%;
	height: 100%;
    padding: 10px 0 10px 20px ;
    margin: 0; /* ulの余白をなくす */
    list-style-position: inside; /* liのリストアイコンをUL内に収める */
	line-height: 17px;
}

.set li {
    list-style: disc;
    text-align: left; /* 左揃え */
    margin-left: 1em; /* liのアイコンとテキストを適切に配置 */
}

.set div:nth-child(1) {
    font-weight: bold;
    /* margin: 0 0 10px; */
}

.set p:nth-child(2) {
    width: fit-content;
    background: #f2f2f2;
    padding: 10px;
    margin: 0 auto 30px;
}
/*  */
.set-box {
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px;
  }
  
  .set-box-banner {
	background: #D64550;
	border-radius: 10px;
	padding: 20px;
	text-align: center;
	color: #fff;
	position: relative;
	width: fit-content;
    margin: auto;
  }
  
  .set-box-banner-arrow {
	content: "";
	width: 30px;
	height: 45px;
	background: #D64550;
	clip-path: polygon(0 0, 0% 100%, 100% 50%);
	transform: rotate(90deg);
	position: absolute;
	bottom: -30px;
	left: 50%;
	transform: translateX(-50%) rotate(90deg);
  }
  
  .set-box-banner-title {
	font-size: 2rem;
	font-weight: bold;
  }
  
  .set-box-banner-note {
	font-size: 1.4rem;
  }
  
  .set-box-content {
	display: flex;
	/* display: grid;
	grid-template-columns: 1fr 300px; */
	gap: 30px;
	background: #fff;
	border: 5px solid #D64550;
	border-radius: 10px;
	padding: 20px 30px;
	align-items: center;
  }
  
  .set-box-description {
	/* grid-column: 1 / 2; */
  }
  
  .set-box-title {
	font-size: 3rem;
	margin-bottom: 10px;
	color: #000!important;
	font-size: 2rem!important;
  }
  
  .set-box-text {
	font-size: 1.2rem;
	margin-bottom: 20px;

  }
  
  .set-box-price-wrapper {
	display: flex;
	gap: 30px;
  }
  
  .price-strikethrough {
	font-size: 2rem;
	font-weight: bold;
	text-decoration: line-through;
	color: #0A5F75;
  }
  
  .price-highlight {
    font-size: 1.6rem;
    font-weight: 800;
	color: #D64550;
  }
  
  .set-box-details {
	/* grid-column: 1 / 2; */
  }
  
  .set-box-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 30px;
  }
  
  .set-box-table th, .set-box-table td {
	padding: 10px;
	border: 1px solid #ccc;
	font-size: 1.2rem;
  }
  
  .set-box-table th {
	width: 20%;
	background: #ddddde;
  }
  
  .set-box-table .table-content {
	width: 45%;
	background: #f5f5f5;
  }
  
  .btn-red-frame {
	display: block;
	text-align: center;
	padding: 10px 20px;
	background: #D64550;
	color: #fff;
	border-radius: 5px;
	text-decoration: none;
  }
  
  .set-box-image img {
	max-height: 150px;
	object-fit: contain;
  }
/*  */
/* 
.price2 p:nth-child(1) {
	font-weight: bold;
	margin: 0 0 10px;
} */

.price2 {
	font-size: 3rem!important;
	color: #e74c3c!important;
	font-weight: bold;
	text-align: center;
	margin-bottom: 2rem;
}
.price2 span{font-size: 50%;
color: #333;}

.price3 {
	font-size: 2.5rem!important;
	color: #a81128!important;
	font-weight: bold;
	text-align: center;
	/* margin: 0 0 10px; */
}
.price3 span{font-size: 50%;
	color: #333!important;
padding-left: 10px;}

.t-title{background: rgb(225 236 245);}

.content2{background: #f2f2f2;
padding-bottom: 10px;
margin-bottom: 10px;}
.content2_2{background: #f2f2f2;
	padding-bottom: 10px;
}

.content> div>div{background:#fff!important;
    /* padding: 0 15px ; */
}

.posset_box>p span {
	font-size: 1.4rem;
}

.posset_box .posset {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	margin: 0 auto 10px;
}

.posset_box .posset>div {
	display: flex;
	flex-flow: column;
	align-items: center;
}

.posset_box .posset>div p {
	font-size: 1.2rem;
	margin: 0 0 10px;
}

.posset_box .posset>div p span {
	font-size: 1.4rem;
	font-weight: bold;
}

.posset img {
	width: 100%;
	max-width: 210px;
	object-fit: contain;
	padding: 10px 0;
	margin: auto 0 0;
}

.posset_box .set-feature>div:nth-of-type(1) {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-items: center;
	gap: 30px;
	margin: 0px 0 20px;;
}

.posset_box .set-feature>div:nth-of-type(1)>div{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background-color: #fff;
	border: 1px solid #ccc;
	padding: 10px;
	height: 50px;
	width: 100%;

	max-width: 400px;
	/* min-width: 390px; */

}

.posset_box .set-feature>div:nth-of-type(1)>div:nth-of-type(1) img {
	width: 100%;
	max-width: 100px;
	min-width: 100px;
}

.posset_box .set-feature>div:nth-of-type(1)>div:nth-of-type(1) p {
	font-size: 1.2rem;
	text-align: left;
}

.posset_box .set-feature>div:nth-of-type(1)>div:nth-of-type(2) p {
	color: #0956be;
	font-size: 1.6rem;
	font-weight: bold;
	/* background: #fff; */
	padding: 5px 10px;
	/* margin: 0 0 10px; */
}

.posset_box .content>div:nth-of-type(1)>div:nth-of-type(2) p:nth-of-type(2) {
	margin: 0;
}

.posset_box .content>div:nth-of-type(1)>div:nth-of-type(2) p span {
	color: #000;
	font-size: 1.1rem;
	margin: 0 0 0 10px;
}

.posset_box .content>div:nth-of-type(2)>p:nth-of-type(1),
.posset_box .content>div:nth-of-type(2)>p:nth-of-type(3) {
	font-weight: bold;
	margin: 0 0 10px;
}

.posset_box .content>div:nth-of-type(2)>p:nth-of-type(2) {
	width: fit-content;
	background: #f2f2f2;
	padding: 10px;
	margin: 0 auto 30px;
}

.posset_box .content>div:nth-of-type(2)>ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 5px;
	margin: 0 0 10px;
}

.posset_box .content>div:nth-of-type(2)>ul li {
	text-align: center;
	list-style: none;
	background: #f2f2f2;
	padding: 10px;
}

.posset_box .content div:nth-of-type(2)>div {
	width: 100%;
	max-width: 700px;
	overflow-x: scroll;
	margin: 0 auto 10px;
}

.posset_box .content div:nth-of-type(2)>div>table {
	width: 700px;
	background: none;
}

.posset_box .content div:nth-of-type(2)>div>table td {
	width: calc(100%/3);
	border: none;
	border-bottom: solid 1px #ccc;
}

.posset_box .content div:nth-of-type(2)>div>table td:first-child {
	background: none;
}

.turisenkinashi_box {
	border: 1px solid #ccc;
	padding: 30px 20px;
	margin: 0 0 30px;
}

.turisenkinashi_box h3 {
	margin: 0 0 10px;
}

#pos_lineup>div {
	background: #fff;
	border: 1px solid #ccc !important;
}

.bg {
	border: none !important;
}

.counter {
	border: 1px solid #ccc;
	padding: 20px;
}

.thanks_intro_box>img {
	width: 100%;
	max-width: 350px;
	display: block;
	margin: 0 auto 30px;
}

.campaign_box {
	max-width: 750px;
	display: grid;
	align-items: center;
	grid-template-columns: 210px 1fr;
	gap: 30px;
	background: #fff;
	border: 2px solid #00863C;
	padding: 20px;
	margin: 0 auto;
}

.campaign_box>div img {
	width: 100%;
	max-width: 210px;
}

.campaign_box>div p {
	margin: 0 0 20px;
}

.campaign_box>div p span {
	color: #a81128;
	font-size: 2rem;
	font-weight: bold;
}

.campaign_box>div a {
	max-width: 250px;
	color: #fff;
	background: #00863C;
	border: 0;
}

.campaign_box>div a:hover {
	border-bottom: 0;
}

.movie_box {
	max-width: 500px;
	background: #cecece;
	padding: 20px;
	margin: 0 auto 50px;
}

.movie_box a {
	width: 100%;
	display: block;
	position: relative;
	transition: .3s;
}

.movie_box a::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 50%);
	margin: -25px 0 0 -25px;
}

.movie_box a::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	border-top: 10px solid transparent;
	border-left: 16px solid rgba(255, 255, 255, 100);
	border-bottom: 10px solid transparent;
	margin: -10px 0 0 -6px;
}

.movie_box a video {
	width: 100%;
}

.title_sub {
	color: var(--dark-teal);
	font-size: 2rem;
	text-align: center;
	margin: 0 0 10px;
}

.link_text {
	color: #296fb2;
}

/*  */

.typebutton {
	text-align: center;
	margin-top: 10px;
	width: 100%;
	margin-bottom: 30px;
}

/* .title {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 20px;
} */

.type_buttons_wrap {
	display: flex;
	justify-content: center;
}

.button {
	width: calc(100%/4);
	padding: 10px 20px 10px 20px;
	background-color: #2aa6a0;
	color: white;
	text-align: center;
	margin: 0 5px;
	border-radius: 5px;
	transition: background-color 0.3s ease;
	font-size: 17px;
	font-weight: 500;
	text-decoration: none;
	position: relative;
	box-shadow: 3px 3px 0px rgb(0 0 0 / 13%);
display: grid;
	
}

.button {
	background-color: var(--dark-teal);
}
.button img{
margin: auto;
width: 40px;
margin-bottom: 4px;
}

.button span {
	display: block;
	font-size: 70%;
	margin-bottom: 10px;
	transition: background-color 0.3s ease;
}


.button::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 8px solid white;
	margin: 10px auto 0;
	transition: background-color 0.3s ease;
}

.button:hover {
	background-color: #6ec1d1;
    opacity: 0.8 !important;
    color: #d2e7ff !important;
}

.buttonhover::after {
	border-top: 8px solid #00748d;
}

.spacer{height: 60px;
	margin-top: -60px;}

/*  */
.flex {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
;
}
.flex div {
    width: calc(100% / 2);
}

a.btn_blue {
    width: 100%;
    max-width: 400px;
    min-height: 45px;
    display: flex
;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    background: #0c5f96;
    border-radius: 30px;
    border-bottom: 0;
    padding: 10px;
    margin: 0 auto;
}

.case .flex img {
  width: 300px;
  height: 275px;
  max-height: 386px;
  object-fit: cover;
}
.case h2 img {
  vertical-align: bottom;
  margin-right: 5px;
}
.case .case_box {
  border: 1px solid #ddd;
  margin-bottom: 20px;
  background: #fff;
}
.case .case_text {
  width: 100%;
}
.case .case_ttl {
  background-color: #e8e8e8;
  width: 100%;
  padding: 10px 10px 13px 20px;
  text-align: left;
}
.case .case_ttl h3 {
  font-size: 16px;
  margin-bottom: 10px;
}
.case .case_ttl p {
  font-size: 14px;
  color: #999999;
}
.case .case_cate {
  padding: 15px 0 15px 20px;
  background-color: #fff;
  width:100%;
  text-align: left;
}
.case .case_cate p {
  line-height: 2.0;
}
.case .case_cate p:first-child {
  margin-bottom: 15px;
}
.case .case_cate span {
  background-color: #ECF3F5;
  padding: 5px;
  margin-right: 5px;
}

.case_text>a{ margin:0 0 20px 20px!important;
  max-width: 250px!important;
}


.set_box>div:nth-of-type(1) {
  width: fit-content;
  display: flex;
  flex-flow: column;
  align-items: center;
  background: #D64550;
  border-radius: 10px;
  position: relative;
  top: 10px;
  z-index: 2;
  padding: 20px;
  margin: 0 auto;
}

.set_box>div:nth-of-type(1)::after {
  content: "";
  width: 30px;
  height: 45px;
  background: #D64550;
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
  transform: rotate(90deg);
  position: absolute;
  bottom: -30px;
}

.set_box>div:nth-of-type(1) p:nth-of-type(1) {
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}

.set_box>div:nth-of-type(1) p:nth-of-type(2) {
  color: #fff;
  font-size: 1.4rem;
}

.set_box>div:nth-of-type(n+2) {
  display: grid;
  grid-template-columns: 1fr 300px;
  grid-template-rows: max-content 1fr;
  gap: 30px;
  background: #fff;
  border: 5px solid #D64550;
  border-radius: 10px;
  filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 30%));
  position: relative;
  z-index: 1;
  padding: 30px 30px 30px 40px;
  margin: 0 auto 60px;
  width:100%;
}

/*----- slickスライダー -----*/

.slick_box p {
	margin: 0 0 10px;
}

.slick_box .slick-slide img {
	margin: 0 auto;
}

.slick_box>div>div>div {
	width: 100%;
	height: auto;
	transform: scale(0.7);
	transition: 0.5s;
}

.slick_box>div>div>div.slick-center {
	transform: scale(1);
}

.slick-prev,
.slick_box .slick-prev {
	left: 0 !important;
	z-index: 2;
}

.slick-next,
.slick_box .slick-next {
	right: 0 !important;
	z-index: 2;
}

/*----- slickスライダーここまで-----*/


.mid-g {
	width: 100%;
	max-width: 200px;
	background: #fff;
	padding: 20px;
}

.text_small {
	font-size: 1.2rem;
}

.printonly {
	display: none;
}


/*----- 外部読み込みページ -----*/

.jyunkanshiki_box {
	background: #fff;
	border: 1px solid #ccc;
	padding: 20px;
}

.jyunkanshiki_box>p {
	font-size: 1.8rem;
	font-weight: bold;
	text-align: left;
	margin: 0 0 20px;
}

.jyunkanshiki_box>div {
	gap: 30px 0;
	text-align: left;
}

.jyunkanshiki_box img {
	max-width: 300px;
}

/*----- 外部読み込みページ ここまで -----*/



  .bpRe-priceBox {
	background-color: var(--dark-teal);
	padding: 50px 0 40px; /* 上下のパディングを削減 */
	position: relative;
  }
  .bpRe-priceBox::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: linear-gradient(90deg, var(--main-teal), #4ecdc4, var(--main-teal));
  }
  
/* 料金プラン */
.bpRe-price {
	position: relative;
	overflow-x: hidden;
	width: 100%;
	max-width: 1100px;
	margin: 0 auto;
	padding: 0;
	border: 0;
/*	background: #d7e2f5;*/
}
.bpRe-price-inner {
  width: 95%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  text-align: center;
}
.bpRe-price-inner .section-headline {
	color: #fff;
	margin-bottom: 20px;
}
.bpRe-price-inner .section-headline + p{
	color: #fff;
	font-weight:bold;
	margin-bottom: 40px;
}
.bpRe-price-list {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: flex-start;
	position: relative;
	z-index: 2;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: left;
	gap:3rem;
}
.bpRe-price-list h3 {
	margin: 0;
	padding: 8px 0 16px;
	line-height: 1;
	font-size: 21px;
	color: #122d54;
	position:relative;
}
.bpRe-price-list li {
	align-self: stretch;
	/*width: 32%;*/
	flex:1;
	margin: 0;
	padding: 24px;
	border-radius: 8px;
	background: #fff;
	box-shadow: inset 0 2px 4px 0 #000000 16%;
	box-sizing: border-box;
	text-align:center;
	display: flex;
	flex-direction: column;
}
.bpRe-price-list li:nth-child(1) h3 {
  color: #519dd6;
}
.bpRe-price-list h3 small {
	display: block;
	margin: 0;
	padding: 8px 0 0;
	line-height: 1;
	font-family: 'Roboto', sans-serif;
	font-size: 12px;
	font-weight: normal;
	text-transform: uppercase;
}
.bpRe-price-list h3 + p {
	margin: 0;
	padding: 0 0 16px;
	border-bottom: #666666 1px solid;
	line-height: 1.4;
	font-size: 14px;
	flex-grow:1;
}
.bpRe-price-label {
	display: block;
	margin: 18px 0 8px;
	padding: 0;
	line-height: 1;
	font-size: 16px;
	text-align:center;
}
.bpRe-price-label img {
  max-width: 100%;
}
.bcpos-re img {
	width: auto;
	height: auto;
	max-height: 440px;
	margin: auto;
}
.bpRe-price-spec {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	margin: 0;
	padding: 0;
	line-height: 1;
}
.bpRe-price-spec dt {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: stretch;
  width: 50%;
  margin: 0;
  padding: 16px 0 16px 8em;
  border-top: #666666 1px solid;
  color: #aaaaaa;
  font-size: 13px;
  text-align:left;
}
.bpRe-price-spec dd {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	align-self: stretch;
	width: 50%;
	margin: 0;
	padding: 16px 0 16px 2em;
	border-top: #666666 1px solid;
	color: #aaaaaa;
	font-size: 16px;
	text-align: right;
}
.bpRe-price-spec dd b {
  font-family: 'Roboto', sans-serif;
  font-size: 20px;
}
.bpRe-price-spec dd svg {
  position: relative;
	top: 0;
  width: auto;
  height: 18px;
  margin-right: 2px;
}
.bpRe-price-spec dd .sizeAdjust {
	font-size: 20px;
}
.bpRe-price-spec dd .meritAdjust {
	font-size: 20px;
	font-weight: bold;
}
.bpRe-price-list li:nth-child(1) h3 {
	color: #14ae5c;
}
.bpRe-price-list li:nth-child(2) h3 img {
  margin-left: 8px;
  position:absolute;
}
.bpRe-price-list li:nth-child(1) .bpRe-price-spec dd b,
.bpRe-price-list li:nth-child(1) .bpRe-price-spec dd .meritAdjust,
.bpRe-price-list li:nth-child(1) .bpRe-price-spec dd b,
.bpRe-price-list li:nth-child(1) .bpRe-price-spec dd .meritAdjust {
	color: #14ae5c;
}
.bpRe-price-list li:nth-child(2) .bpRe-price-spec dd b,
.bpRe-price-list li:nth-child(2) .bpRe-price-spec dd .meritAdjust,
.bpRe-price-list li:nth-child(2) .bpRe-price-spec dd b,
.bpRe-price-list li:nth-child(2) .bpRe-price-spec dd .meritAdjust {
  color: #14ae5c;
}

@media (max-width: 1023px) {
.bpRe-price-spec dt {
  padding: 16px 0 16px 2em;
}
.bpRe-price-spec dd {
	padding: 16px 0 16px 2em;
}
}
@media (max-width: 767px) {
.bpRe-priceBox{
	padding:0;
}
.bpRe-price-inner .section-headline + p{
	margin-bottom:2rem;
}
.bpRe-price {
    position: relative;
    overflow-x: hidden;
    width: 100%;
    margin: 40px 0;
    padding: 0;
    border: 0;
    background-size: 90px auto;
	}
	.bpRe-price-inner {
    width: 90%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 0;
    border: 0;
    text-align: center;
	}
	.section-headline {
    margin: 0;
    padding: 0 0 16px;
    font-size: 20px;
    font-weight: bold;
	}
	.bpRe-price-list {
    display: flex;
    flex-flow: column wrap;
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
    z-index: 3;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: left;
	}
	.bpRe-price-list li {
    align-self: stretch;
    width: 100%;
    margin: 12px 0 0;
    padding: 24px;
    border-radius: 8px;
    box-sizing: border-box;
	}
	.bpRe-price-list h3 {
    margin: 0;
    padding: 8px 0 16px;
    line-height: 1;
    font-size: 21px;
	}
	.bpRe-price-list h3 + p {
    margin: 0;
    padding: 0 0 16px;
    line-height: 1.4;
    font-size: 14px;
	}
	.bpRe-price-label {
    display: block;
    margin: 16px 0 8px;
    padding: 0;
    line-height: 1;
    font-size: 16px;
	}
	.bcpos-re img {
    width: auto;
    height: auto;
	}
	.bpRe-price-spec {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    padding: 0;
    line-height: 1;
	}
	.bpRe-price-spec dt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-self: stretch;
    width: 10em;
    margin: 0;
    padding: 16px 0;
    font-size: 13px;
	}
	.bpRe-price-spec dd {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    align-self: stretch;
    width: calc(100% - 8.15em);
    margin: 0;
    padding: 16px 0;
    font-size: 16px;
    text-align: right;
	}
	.bpRe-price-spec dt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-self: stretch;
    width: 10em;
    margin: 0;
    padding: 16px 0;
    font-size: 13px;
	}
	.bpRe-price-inner .section-headline {
		margin-bottom: 0;
	}
}

/* オプション */
.bpRe-plan-option {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 2;
  width: 100%;
  margin: 56px 0 0;
  padding: 24px 40px;
  box-sizing: border-box;
  background-image: url(https://www.busicom.co.jp/product/bcpos/images/index/bg-option01.png), url(https://www.busicom.co.jp/product/bcpos/images/index/bg-option02.png);
  background-repeat: no-repeat, no-repeat;
  background-position: 0 0, right 0;
  background-size: 5px 100%, 5px 100%;
  /* backdrop-filter: blur(40px); */
}
.bpRe-plan-option h3 {
	align-self: stretch;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	width: 176px;
	margin: 0 24px 0 0;
	padding: 0 24px 0 0;
	border-right: #dcdcdc 1px solid;
	text-align: left;
	box-sizing: border-box;
	color:#3D5A80;
}
.bpRe-plan-option h3 small {
	display: block;
	position: relative;
	top: inherit;
	padding: 0;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	font-weight: normal;
}
.bpRe-plan-option ul {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
  width: calc(100% - 224px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.bpRe-plan-option li {
	width: 100%;
	margin: 0;
	padding: 0;
	border-radius: 0;
	text-align: left;
	box-sizing: border-box;
	background: none;
	display: flex;
	justify-content: center;
	align-items: center;
	gap:4rem;
}
.bpRe-plan-option figure {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: flex-end;
	width: 100%;
	max-width: 252px;
	margin: 0;
	padding: 0;
}
.bpRe-plan-option figure > img {
  display: block;
}
.bpRe-plan-option img {
  width: 100%;
  height: auto;
  max-height: 440px;
  margin: auto;
}
.bpRe-plan-option-text {
	margin: 0;
	padding: 16px 0 0;
}
.bpRe-plan-option-text h4 {
	margin: 0;
	padding: 0 0 8px;
	line-height: 1;
	font-size: 18px;
}
.bpRe-plan-option-text p {
	margin: 0;
	padding: 0;
	line-height: 1.4;
	font-size: 14px;
}
.bpRe-plan-option-text a {
	color: #5788E5;
}

@media (max-width: 768px) {
	.bpRe-plan-option {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
    z-index: 2;
    width: 100%;
    margin: 24px 0 0;
    padding: 0;
    box-sizing: border-box;
		background-image: none;
	}
	.bpRe-plan-option h3 {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
    box-sizing: border-box;
	}
	.bpRe-plan-option h3 small {
    display: block;
    position: relative;
    top: 0.65em;
    padding: 0 0 0 8px;
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    font-weight: normal;
	}
	.bpRe-plan-option ul {
    display: flex;
    flex-flow: column wrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
	}
	.bpRe-price .bpRe-plan-option li {
    width: 100%;
    margin: 16px 0 0;
    padding: 24px;
    border-radius: 8px;
    text-align: left;
    box-sizing: border-box;
    background: #fff;
	}
	.bpRe-plan-option figure {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
    margin: 0;
    padding: 0;
	}
	.bpRe-plan-option-text {
    margin: 0;
    padding: 16px 0 0;
	}
	.bpRe-plan-option-text h4 {
    margin: 0;
    padding: 0 0 8px;
    line-height: 1;
    font-size: 17px;
	}
	.bpRe-plan-option-text p {
    margin: 0;
    padding: 0;
    line-height: 1.4;
    font-size: 14px;
	}

}

.support_btm {
	text-align: center;
	position: relative
}
.support_layout {
	align-items: flex-start
}

.support_layout img {
	max-width: 110px;
}

.support_layout h3 {
	font-size: 2.0rem;
	font-weight: 500;
	margin-top: 1.0rem;
	margin-bottom: 1.4rem;
	color: #00857b;
}

.support_layout span {
	font-size: 1.2rem;
	color: #666;
	display: block;
}







/*メールフォーム*/

.form_title h2 {
	width: fit-content;
	display: flex;
	align-items: baseline;
	text-align: center;
	line-height: 1.5;
	position: relative;
	margin: 0 auto 20px;
}

.form_box {
	display: flex;
	flex-flow: column;
	justify-content: center;
	background: #fff;
	border: 1px solid #ccc;
	padding: 40px;
	margin: 0 auto;
}

.form_box h4 {
	text-align: center;
	line-height: 1.5;
	margin: 0 0 10px;
}

.form_box h4+div {
	color: #ff0000;
	text-align: center;
	margin: 0 0 30px;
}

.form_box a {
	color: #296fb2;
	transition: 0.3s;
}

.form_box a:hover {
	opacity: 0.3;
}

.form_box table {
	margin: 0 0 30px;
}

.form_box table tr th,
.form_box table tr td {
	width: auto;
	text-align: left;
	font-weight: normal;
	border: none;
	padding: 20px 0;
}
.form_box table tr th{
	line-height:1.7;
}
.form_box table tr th span {
	color: #fff;
	background: #3A60BA;
	border-radius: 5px;
	padding: 5px;
	margin: 0 5px 0 0;
}

.form_box label {
	line-height: 1.5;
}

.form_box input[type="text"],
.form_box input[type="email"],
.form_box input[type="tel"],
.form_box textarea,
.form_box select {
	width: 100%;
}

.form_box input.short {
	max-width: 200px;
}

.form_box input,
.form_box textarea,
.form_box select {
	background: #f9f9f9;
	border: 1px solid #ececec;
	border-radius: 5px;
	resize: vertical;
	padding: 10px;
}

.form_box>p.front {
	text-align: center;
	margin: 0 0 30px;
}

.form_box>p input {
	width: 100%;
	max-width: 300px;
	display: block;
	color: #005d96;
	font-size: 1.6rem;
	font-weight: bold;
	border: 1px solid #005d96;
	border-radius: 30px;
	cursor: pointer;
	padding: 10px;
	margin: 0 auto;
	transition: 0.3s;
}

.form_box>p input.back {
	color: #fff;
	background: #999;
	border: none;
}

.form_box>p input:hover {
	opacity: 0.3;
}

.form_box .columns {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
}

.form_box table.kakunin_table tr th,
.form_box table.kakunin_table tr td {
	border: 1px solid #ccc;
	padding: 20px;
}

.form_box table.kakunin_table tr th {
	display: table-cell;
	font-weight: bold;
	background: #eee;
}

.form_box table.kakunin_table+p {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 30px;
}

.form_header {
	background: #fff;
	padding: 10px 30px;
}

.form_header img {
	width: 100%;
	max-width: 120px;
}

/*メールフォームここまで*/

/* 2408追加 */


/* download */

#download{
padding: 20px 0 ;	
background: var(--bg-green);
}
.dltitle{    background: #f1f1f1;
    width: 100%;
    padding: 10px;
    color: #1d314d;
    font-size: 17px;}

#select{margin-bottom: 60px;}
.mr20{margin-right: 30px;}
.tblue{color:rgb(18, 57, 141);
	background: rgb(238, 243, 245);
	padding: 10px 0;
}

.form-title{
	background: #4a4c55;
	color:#fff;
/* width: 90%; */
margin: auto;
padding: 5px 10px;
}
.tblue_sub{
	color:#ca0505;
	font-size: 19px!important;
	margin-bottom: 5px;
	font-weight:900;
}
.dl_hero {    padding-top: 20px;
    padding-bottom: 20px;
    background: #eeeff4;
    color: #3b4047;
	font-weight:700;
}
.dl_hero h1{font-size: 20px;}

.selectbox{justify-content: center;
display: flex;}

.selectbox h3{font-size: 27px;
	font-weight:800;
	/* color: #000; */
}

.selectbox p{font-size: 14px;
	font-weight:500;
	/* color: #000; */
}

.selectbox img{
	width: 50%;
	/* border: 1px solid rgb(224, 224, 224); */
	box-shadow: 3px 3px 6px 1px rgb(201 204 207 / 80%);
}


.dl_formbox{background-color: #f1f1f4;}

.catalog_info{
margin-top: 20px;	
padding-top: 20px;
	border-top:1px solid gray ;}

	.catalog_info li{line-height: 28px;}
	.catalog_info li:nth-child(1){font-size: 20px;
	font-weight:600}


/*form_box2  */
.form_box2{display: flex;
    flex-flow: column;
    justify-content: center;
    /* background: #fff; */
    /* border: 1px solid #ccc; */
    padding: 20px 40px 40px 40px;
    margin: 0 auto;}

.form_box2 table{background: none;}	

.form_box2 tr{display: grid;}

.form_box2 h4 {
	text-align: center;
	line-height: 1.5;
	margin: 0 0 10px;
}

.form_box2 h4+div {
	color: #ff0000;
	text-align: center;
	margin: 0 0 30px;
}

.form_box2 a {
	color: #296fb2;
	transition: 0.3s;
}

.form_box2 a:hover {
	opacity: 0.3;
}

.form_box2 table {
	margin: 0 0 10px;
}

.form_box2 table tr th{
	width: auto;
	text-align: left;
	font-weight: normal;
	border: none;
    padding: 5px 0 10px;
}

.form_box2 table tr td {
	width: auto;
	text-align: left;
	font-weight: normal;
	border: none;
    padding: 5px 0 10px;
}

.form_box2 table tr th span {
	color: #fff;
	background: #3A60BA;
	border-radius: 5px;
	padding: 5px;
	margin: 0 5px 0 0;
}

.form_box2 label {
	line-height: 1.8;
	display: block;
}

.form_box2 input[type="text"],
.form_box2 input[type="email"],
.form_box2 input[type="tel"],
.form_box2 textarea,
.form_box2 select {
	width: 100%;
}

.form_box2 .short {
	max-width: 200px;
}

.form_box2 input,
.form_box2 textarea,
.form_box2 select {
	background: #ffffff;
	border: 1px solid #d4d4d4;
	border-radius: 5px;
	resize: vertical;
	padding: 10px;
}

.form_box2>p.front {
	text-align: center;
	margin: 0 0 30px;
}

.form_box2>p input {
	width: 100%;
	max-width: 300px;
	display: block;
	color: #ffffff;
	background-color: #005d96;
	font-size: 1.6rem;
	font-weight: bold;
	border: 1px solid #005d96;
	border-radius: 30px;
	cursor: pointer;
	padding: 5px;
	margin: 0 auto;
	transition: 0.3s;
	font-family: YakuHanJP, 'Noto Sans JP', 'noto-fallback', 'rome_num', sans-serif;
}


.form_box2>p input.back {
	color: #fff;
	background: #999;
	border: none;
}

.form_box2>p input:hover {
	opacity: 0.3;
}

.form_box2 .columns {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
}

.form_box2 table.kakunin_table tr th,
.form_box2 table.kakunin_table tr td {
	border: 1px solid #ccc;
	padding: 20px;
}

.form_box2 table.kakunin_table tr th {
	display: table-cell;
	font-weight: bold;
	background: #eee;
}

.form_box2 table.kakunin_table+p {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 30px;
}


/*  */
.card1 {
	padding: 12px 0;
	margin-bottom: 10px;
	background: #eaf4f2
}

.card2 {
	padding: 12px 0;
	margin-bottom: 10px;
	background: #ecedf0
}

.card {
	display: flex;
justify-content: space-between;
	/* flex-flow: column; */
	flex: 1;
	position: relative;
}

.card_box {
	width: 46%;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.card_box p{
margin-top: 10px;
font-weight: 600;
font-size: 16px;
}

.card_box p::after {
    font-family: "Font Awesome 5 Free";
    content: "\f1c1";
    font-weight: 900;
    margin: 0 0 0 10px;
	color:  #005d96;
}

.card_box2 {
	display: table-cell;
	height: 100%;
	min-height: 320px
}

.fee {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center
}

.fee div {
	margin-top: 10px;
	margin-bottom: 8px;
	padding: 8px 0;
	color: #fff;
	font-weight: 500;
	width: calc(85%/2)
}

.fee div:first-child {
	margin-right: 10px;
	background: #4CBFC6
}

.pconly2{display: table-cell;}
/* 2408追加 */



@media print {
	form#mail_form dl {
		overflow: visible !important;
	}

	form#mail_form p#form_submit {
		display: flex;
	}

	.printonly {
		display: block;
	}

	.printno {
		display: none;
	}

	.swiper-wrapper {
		flex-wrap: wrap;
	}

	.swiper-slide {
		width: calc(100%/4) !important;
		padding: 0 5px;
		text-align: center;
		font-size: 1.6rem;
		background: none;
		border-radius: 5px;
		border: none;
		padding: 10px;
		display: block;
	}

	.swiper-button-prev,
	.swiper-button-next,
	.swiper-pagination {
		display: none;
	}
}


/* 追記*/
/* 特徴セクションのメインコンテナ */
.features-main-container {
	background-color: #f6fbfb;
	padding: 60px 0;
  }
  
  .features-main-title {
	text-align: center;
	font-size: 32px;
	font-weight: 800;
	color: var(--dark-teal);
	margin-bottom: 15px;
	position: relative;
  }
/*   
  .features-main-title::after {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
	width: 80px;
	height: 3px;
	background: var(--main-teal);
  } */
  
  .clinic-subtitle {
	font-size: 18px;
	color: #333;
	margin-bottom: 10px;
	font-weight: 500;
  }
  
  .features-main-description {
	text-align: center;
	max-width: 800px;
	margin: 20px auto 20px auto;
	font-size: 16px;
	line-height: 1.6;
	color: #444;
  }
  
  /* 個別の特徴セクション */
  .feature-section {
	background: white;
	border-radius: 10px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
	padding: 30px 40px 40px 40px;
	margin-bottom: 40px;
	position: relative;
	overflow: hidden;
  }
  
  .feature-section:last-child {
	margin-bottom: 0;
  }
  
  /* 番号ラベル - ピリオド付き数字に変更 */
  .feature-number {
	position: absolute;
	top: 0;
	left: 0;
	width: 60px;
	height: 60px;
	background: var(--main-teal);
	color: white;
	font-size: 26px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 0 0 10px 0;
	z-index: 1;
	font-family: 'Arial', sans-serif; /* 数字のフォントをはっきりさせる */
  }
  
  /* 特徴のヘッダー */
  .feature-header {
	margin-left: 80px;
	margin-bottom: 30px;
  }
  
  .feature-title {
    display: block;
    font-weight: 800;
    font-size: 15px;
    margin-bottom: 5px;
	color: var(--dark-teal);
  }

    
  .feature-title2 {
	font-size: 30px;
	font-weight: 700;
	color: var(--dark-teal);
	margin-bottom: 15px;
  }
  
  .feature-description {
	font-size: 16px;
	line-height: 1.6;
	color: #555;
  }
  
  /* 特徴のコンテンツエリア */
  .feature-content {
	margin-top: 20px;
  }
  
  /* リストスタイル */
  .feature-list {
	list-style: none;
	padding: 0;
	margin: 20px 0;
  }
  
  .feature-list li {
	position: relative;
	padding-left: 30px;
	margin-bottom: 12px;
	font-size: 16px;
	line-height: 1.5;
  }
  
  .feature-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 6px;
	width: 20px;
	height: 20px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect width='24' height='24' rx='4' fill='%2333b5a3'/><path d='M9 16.17 4.83 12 3.41 13.41 9 19 21 7 19.59 5.59z' fill='white'/></svg>") center/contain no-repeat;
  }
  
  /* 画像コンテナ */
  .feature-image-container {
	margin: 30px 0;
	text-align: center;
	display: flex;
	justify-content: center;
  }
  
  .feature-image {
	max-width: 100%;
	border: 1px solid #eee;
	border-radius: 8px;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  }
  
  /* 特徴フッター */
  .feature-footer {
	margin-top: 30px;
	text-align: center;
  }
  
  .feature-link {
	display: inline-block;
	color: #005d96;
	font-size: 16px;
	border: 1px solid #005d96;
	border-radius: 30px;
	padding: 10px 30px;
	text-decoration: none;
	transition: all 0.3s ease;
  }
  
  .feature-link:hover {
	background: #eafbff;
	transform: translateY(-2px);
  }
  
  /* キャンペーンバナーエリア */
  .feature-campaign {
	margin-top: 30px;
  }
  
  /* レスポンシブ対応 */
  @media (max-width: 767px) {
	.features-main-container {
	  padding: 40px 0;
	}
	
	.features-main-title {
	  font-size: 24px;
	}
	
	.feature-section {
	  padding: 30px 20px;
	  margin-bottom: 30px;
	}
	
	.feature-number {
	  width: 50px;
	  height: 50px;
	  font-size: 22px;
	}
	
	.feature-header {
	  margin-left: 60px;
	  margin-bottom: 20px;
	}
	
	.feature-title {
	  font-size: 20px;
	}
	
	.feature-description,
	.feature-list li {
	  font-size: 15px;
	}
  }
/*  */
/* セットリストのレイアウト改善 */
.set-content-wrapper {
	display: flex;
	border: 1px solid #ddd;
	border-radius: 6px;
	overflow: hidden;
	margin-top: 15px;
  }
  
  .set-header {
	background: #0f7d9f;
	color: white;
	font-weight: 600;
	padding: 15px;
	min-width: 120px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
  }
  
  .set-content-list {
	padding: 10px 0px 10px 10px !important;
	margin: 0;
	list-style: none;
	flex: 1;
	background: #f9f9f9;
  }
  
  .set-content-list li {
	position: relative;
	padding-left: 18px;
	margin-bottom: 5px;
	line-height: 1.4;
	text-align: left;
  }
  
  .set-content-list li:last-child {
	margin-bottom: 0;
  }
  
  /* POSレジアイコンスタイル */
  .set-content-list li::before {
	content: "■";
	position: absolute;
	left: 0;
	top: 0;
	color: #0f7d9f;
	font-weight: bold;
	font-size: 12px;
  }
  
  
  /* オリジナルのリストスタイルを非表示 */
  .clinic-product-card ul {
	list-style: none !important;
  }
  
  .clinic-product-card ul li {
	list-style-type: none !important;
  }
  
  /* サイズ表のスタイル */
  .spec-table {
	width: 100%;
	margin-top: 15px;
	border-collapse: collapse;
	font-size: 14px;
  }
  
  .spec-table th, .spec-table td {
	border: 1px solid #ddd;
	padding: 6px 10px;
	text-align: left;
	text-wrap-mode: nowrap;
  }
  
  .spec-table th {
	background-color: #f2f2f2;
	font-weight: 600;
	width: 33%;
  }
  
  .spec-table tr:first-child th {
	background-color: #e0e0e0;
	font-weight: 700;
  }
  
  /* クリニック概要セクションのレイアウト改善 */
  .clinic-intro-section {
	background-color: #f8fbfc;
	border-radius: 10px;
	padding: 25px;
	margin-bottom: 20px;
	border: 1px solid #e8eef2;
  }
  
  .clinic-intro-content {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
  }
  
  .clinic-intro-image {
	flex: 0 0 40%;
	text-align: center;
	padding-right: 20px;
  }
  
  .clinic-intro-text {
	flex: 0 0 60%;
	text-align: left;
  }
  
  .clinic-section-title {
	color: var(--dark-teal);
	font-weight: 800;
	font-size: 22px;
	text-align: left;
	margin-bottom: 20px;
  }
  
  .clinic-intro-description {
	line-height: 1.6;
	/* margin-bottom: 20px; */
	text-align: left;
  }
  
  .clinic-set-content {
	/* margin-bottom: 20px; */
  }
  
  
  /* お申込みボタンスタイル */
  .clinic-cta-button {
	background: #32B5A3;
	display: inline-block;
	color: white;
	margin: 0 auto;
	font-size: 16px;
	font-weight: 600;
	padding: 10px 25px; /* パディングを削減 */
	border-radius: 30px;
	text-decoration: none;
	transition: var(--transition);
	min-width: 220px; /* 幅を削減 */
}
 

 
  .clinic-cta-button:hover {
	background: #00857b;
	transform: translateY(-3px);
	box-shadow: 0 6px 12px rgba(15, 125, 159, 0.4);
  }
  
  .clinic-cta-arrow {
	display: inline-block;
	margin-left: 10px;
  }
  
  @media (max-width: 767px) {
	.clinic-intro-image, 
	.clinic-intro-text {
	  flex: 0 0 100%;
	  padding-right: 0;
	}
	
	.clinic-intro-image {
	  margin-bottom: 20px;
	}
	
	.set-content-wrapper {
	  flex-direction: column;
	}
	
	.set-header {
	  width: 100%;
	  padding: 10px;
	}
  }
  
  .set-content-list {
	padding: 12px 15px;
	margin: 0;
	list-style: none;
	background: #f9f9f9;
  }
  
  .set-content-list li {
	position: relative;
	/* padding-left: 28px; */
	margin-bottom: 10px;
	line-height: 1.5;
	font-size: 13px;
	font-weight: 500;
	color: #333;
  }
  
  .set-content-list li:last-child {
	margin-bottom: 0;
  }
  
  /* POSレジらしいアイコンを表示 */
  .set-content-list li::before {
	content: "■";
	position: absolute;
	left: 0;
	top: 0;
	color: #bbbbbb;
	font-weight: bold;
	font-size: 14px;
  }
  
  .set-header {
	background: #f1f1f1;
	color: #333;
	font-weight: 600;
	padding: 8px 15px;
	/* border-bottom: 1px solid #ddd; */
  }
  
  /* 製品カード内の画像サイズ調整 */
  .clinic-product-card img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto 15px;
	max-height: 200px;
	object-fit: contain;
  }
  
  .clinic-product-card {
	flex: 0 0 48%;
	background-color: white;
	border-radius: 10px;
	box-shadow: 0 3px 8px rgba(0,0,0,0.08);
	padding: 20px;
	border: 1px solid #eaeaea;
	display: flex;
	flex-direction: column;
  }
  
  /* セットボックスのレイアウト修正 */
  .posset_box {
	margin-top: 15px;
	width: 100%;
  }
  
  .posset_box .col-12.set {
	display: block;
	width: 100%;
  }
  
  /* クリニックセミセルフレジセクションのスタイル */
  .clinic-intro-section {
	background-color: #f8fbfc;
	border-radius: 10px;
	padding: 25px;
	margin-bottom: 40px;
	border: 1px solid #e8eef2;
  }
  
  .clinic-lineup-heading {
	color:#2b5fa3;
	font-weight: 800;
	font-size: 28px;
	text-align: center;
	margin-bottom: 30px;
	position: relative;
	padding-bottom: 15px;
  }
  
  .clinic-lineup-heading::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 80px;
	height: 4px;
	background-color: #2b5fa3;
	border-radius: 2px;
  }
  
  .clinic-lineup-container {
	margin-bottom: 40px;
  }
  
  .clinic-product-card {
	flex: 0 0 48%;
	background-color: white;
	border-radius: 10px;
	box-shadow: 0 3px 8px rgba(0,0,0,0.08);
	padding: 20px;
	border: 1px solid #eaeaea;
  }
  
  .clinic-product-title {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 20px;
	color: #2080ce;
	line-height: 1.2;
  }
  
  .clinic-action-button {
	display: inline-block;
	background: #2080ce;
	color: white;
	font-size: 22px;
	font-weight: bold;
	padding: 25px 30px;
	border-radius: 8px;
	text-decoration: none;
	box-shadow: 0 4px 8px rgba(0,0,0,0.15);
	transition: all 0.3s ease;
	text-align: center;
	width: 100%;
	}
  
  .clinic-action-button:hover {
	background: #1a6caf;
	transform: translateY(-3px);
	box-shadow: 0 6px 12px rgba(0,0,0,0.2);
  }
  
  .clinic-action-button.primary {
	background: #D64550;
	box-shadow: 0 4px 12px rgba(214, 69, 80, 0.3);
  }
  
  .clinic-action-button.primary:hover {
	background: #c03844;
  }
  
  .clinic-button-arrow {
	display: inline-block;
	margin-left: 10px;
  }
  
  .clinic-section-title {
	color:#0f7d9f;
	font-weight: 800;
	font-size: 22px;
	text-align: left;
	margin-bottom: 20px;
  }
  
  .clinic-intro-text {
	text-align: left;
	line-height: 1.6;
	margin-bottom: 20px;
  }
  
  .clinic-set-content {
	/* border: 1px solid #ddd; */
	border-radius: 8px;
	overflow: hidden;
  }
  
  .clinic-set-title {
	background: #0f7d9f;
	color: white;
	padding: 10px;
	font-weight: 600;
	text-align: center;
  }
  
  .clinic-set-list {
	padding: 10px 20px;
	margin: 0;
	list-style: none;
  }
  
  .clinic-set-list li {
	position: relative;
	padding-left: 18px;
	margin-bottom: 5px;
	line-height: 1.4;
  }
  
  .clinic-set-list li:last-child {
	margin-bottom: 0;
  }
  
  /* POSレジアイコンスタイル */
  .clinic-set-list li::before {
	content: "■";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--dark-teal);
	font-weight: bold;
	font-size: 12px;
  }
  
  
  
  
  .clinic-product-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: space-between;
  }
  
  /* レスポンシブ対応 */
  @media (max-width: 767px) {
	.clinic-product-grid {
	  flex-direction: column;
	}
	
	.clinic-product-card {
	  flex: 0 0 100%;
	  margin-bottom: 20px;
	}
	
	.clinic-lineup-heading {
	  font-size: 22px;
	}
  }

  /*  */
/* 余白を削減した導入事例セクションのCSS */
:root {
	--main-teal: #33b5a3;
	--dark-teal: #00857b;
	--darker-teal: #00706a;
	--light-teal: #e4f7f5;
	--clinic-color: #00a6c2;
	--animal-hospital: #ff6b6b;
	--dental: #e58c4e;
	--hospital: #5d6bb4;
	--border-radius: 10px;
	--shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
	--transition: all 0.3s ease;
  }
  
  /* 導入事例セクション背景 - 縦パディング削減 */
  .case-studies-bg {
	background-color: var(--dark-teal);
	padding: 50px 0 40px; /* 上下のパディングを削減 */
	color: white;
	position: relative;
  }
  
  /* デコレーション要素を追加 */
  .case-studies-bg::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: linear-gradient(90deg, var(--main-teal), #4ecdc4, var(--main-teal));
  }
  
  /* セクションヘッダー - マージン削減 */
  .case-studies-header {
	text-align: center;
	margin-bottom: 35px; /* マージンを削減 */
  }
  
  .case-studies-header h2 {
	/* font-size: 48px; */
	font-weight: 800;
	color: white;
	margin-bottom: 12px; /* マージンを削減 */
	position: relative;
	display: inline-block;
	letter-spacing: 1px;
  }
  
  
  .case-studies-header p {
	font-size: 18px;
	color: rgba(255, 255, 255, 0.9);
	max-width: 700px;
	margin: 0 auto;
  }
  
  /* 導入事例グリッド - 間隔削減 */
  .case-studies-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 25px; /* 間隔を削減 */
	margin: 0 auto 40px; /* 下部マージンを削減 */
	max-width: 1000px;
  }
  
  /* 導入事例カード */
  .case-card {
	background-color: white;
	border-radius: var(--border-radius);
	overflow: hidden;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
	transition: var(--transition);
	height: 100%;
	text-decoration: none;
	color: inherit;
	display: block;
	position: relative;
	max-width: 100%;
  }
  
  .case-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.25);
  }
  
  .case-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
  }
  
  /* カード画像エリア - 高さ調整 */
  .case-card-image {
	position: relative;
	height: 200px; /* 高さを減らす */
	overflow: hidden;
  }
  
  .case-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: var(--transition);
  }
  
  .case-card:hover .case-card-image img {
	transform: scale(1.05);
  }
  
  /* カテゴリラベル */
  .case-category {
	position: absolute;
	top: 15px;
	left: 15px;
	font-size: 14px;
	font-weight: 700;
	padding: 8px 16px;
	border-radius: 30px;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
	z-index: 1;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: white;
  }
  
  /* カテゴリ別のカラー */
  .case-category.clinic {
	background-color: var(--clinic-color);
  }
  
  .case-category.animal-hospital {
	background-color: var(--animal-hospital);
  }
  
  .case-category.dental {
	background-color: var(--dental);
  }
  
  .case-category.hospital {
	background-color: var(--hospital);
  }
  
  /* カードコンテンツエリア - パディング削減 */
  .case-card-content {
	padding: 20px; /* パディングを削減 */
	display: flex;
	flex-direction: column;
	flex-grow: 1;
  }
  
  .case-card-client {
	display: flex;
	align-items: center;
	margin-bottom: 8px; /* マージンを削減 */
  }
  
  .client-name {
	font-size: 15px;
	font-weight: 600;
	color: #555;
  }
  
  .client-location {
	font-size: 13px;
	color: #777;
	margin-left: 12px;
	padding-left: 12px;
	border-left: 1px solid #ddd;
  }
  
  .case-card-title {
	font-size: 20px;
	font-weight: 700;
	color: #333;
	line-height: 1.3; /* 行間を狭く */
	margin-bottom: 12px; /* マージンを削減 */
	min-height: auto;
  }
  
  /* 導入ポイント - 間隔削減 */
  .case-card-points {
	margin-bottom: 15px; /* マージンを削減 */
  }
  
  .case-point {
	display: flex;
	margin-bottom: 6px; /* マージンを削減 */
  }
  
  .case-point:last-child {
	margin-bottom: 0;
  }
  
  .case-point-icon {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	background-color: var(--light-teal);
	color: var(--dark-teal);
	font-size: 12px;
	font-weight: 700;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 10px;
  }
  
  .case-point-text {
	font-size: 15px;
	line-height: 1.4; /* 行間を狭く */
	color: #555;
  }
  
  /* カードCTAエリア */
  .case-card-cta {
	margin-top: auto;
	text-align: center;
  }
  
  .view-details {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--main-teal);
	font-size: 16px;
	font-weight: 600;
	padding: 6px 0; /* パディングを削減 */
	transition: var(--transition);
  }
  
  .arrow-icon {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-top: 2.5px solid var(--main-teal);
	border-right: 2.5px solid var(--main-teal);
	transform: rotate(45deg);
	margin-left: 10px;
	transition: var(--transition);
  }
  
  .case-card:hover .arrow-icon {
	transform: rotate(45deg) translate(2px, -2px);
  }
  
  .case-card:hover .view-details {
	color: var(--darker-teal);
  }
  
  /* カードにホバーカーテン効果を追加 */
  .case-card::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.1);
	opacity: 0;
	transition: var(--transition);
	pointer-events: none;
  }
  
  .case-card:hover::after {
	opacity: 1;
  }
  
  /* ギャラリーセクション - パディング削減 */
  .case-gallery-section {
	background-color: white;
	border-radius: var(--border-radius);
	padding: 25px; /* パディングを削減 */
	box-shadow: var(--shadow);
	text-align: center;
  }
  
  /* ギャラリーヘッダー - パディング削減 */
  .gallery-header {
	margin-bottom: 20px; /* マージンを削減 */
	position: relative;
	background: #f7f7f7;
	border-radius: 8px;
	padding: 18px 0; /* パディングを削減 */
	box-shadow: inset 0 0 15px rgba(0, 0, 0, 0.03);
  }
  
  /* 英語サブタイトル */
  .gallery-subtitle {
	display: block;
	font-size: 11px;
	letter-spacing: 3px;
	color: var(--dark-teal);
	font-weight: 600;
	margin-bottom: 3px; /* マージンを削減 */
	opacity: 0.8;
  }
  
  .gallery-header h3 {
	font-size: 24px;
	font-weight: 800;
	color: var(--dark-teal);
	margin-bottom: 8px; /* マージンを削減 */
	position: relative;
	display: inline-block;
  }
  
  .gallery-header p {
	font-size: 15px;
	color: #666;
	max-width: 600px;
	margin: 0 auto;
	line-height: 1.4; /* 行間を狭く */
  }
  
  /* ギャラリーグリッド - 間隔と余白削減 */
  .case-gallery-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 12px; /* 間隔を削減 */
	margin-bottom: 20px; /* マージンを削減 */
  }
  
  .gallery-item {
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
	transition: var(--transition);
  }
  
  .gallery-item:hover {
	transform: translateY(-3px);
	box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
  }
  
  .gallery-link {
	display: block;
	height: 110px; /* 高さを削減 */
  }
  
  .gallery-link img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: var(--transition);
  }
  
  .gallery-item:hover img {
	transform: scale(1.08);
  }
  
  /* ギャラリーボタン - マージン削減 */
  .case-gallery-actions {
	margin-top: 18px; /* マージンを削減 */
	text-align: center;
  }
  
  .gallery-button {
	display: inline-block;
	background-color: var(--main-teal);
	color: white;
	font-size: 16px;
	font-weight: 600;
	padding: 10px 25px; /* パディングを削減 */
	border-radius: 30px;
	text-decoration: none;
	transition: var(--transition);
	min-width: 220px; /* 幅を削減 */
  }
  
  .gallery-button:hover {
	background-color: var(--darker-teal);
	transform: translateY(-2px);
	box-shadow: 0 5px 12px rgba(0, 0, 0, 0.1);
	opacity: 1;
  }
  
  /* クリック可能カードのフォーカススタイル */
  .case-card:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(51, 181, 163, 0.4), var(--shadow);
  }
  
  /* レスポンシブ対応 */
  @media screen and (max-width: 1100px) {
	.case-gallery-grid {
	  grid-template-columns: repeat(3, 1fr);
	}
  }
  
  @media screen and (max-width: 900px) {
	.case-studies-grid {
	  grid-template-columns: 1fr;
	  max-width: 550px; /* 1カラム時のカード幅を制限 */
	}
	
	.case-card-image {
	  height: 200px; /* 画像サイズを調整 */
	}
	
	.case-studies-header h2 {
	  font-size: 40px;
	}
  }
  
  @media screen and (max-width: 767px) {
	.case-studies-bg {
	  padding: 10px 10px;
	}
	
	.case-studies-header h2 {
	  font-size: 32px;
	}
	
	.case-studies-header p {
	  font-size: 16px;
	}
	
	.case-card-image {
	  height: 180px; /* スマホではさらにコンパクトに */
	}
	
	.case-card-content {
	  padding: 15px; /* パディングをさらに削減 */
	}
	
	.case-gallery-grid {
	  grid-template-columns: repeat(2, 1fr);
	  gap: 8px; /* 間隔をさらに削減 */
	}
	
	.gallery-link {
	  height: 90px; /* さらに高さを削減 */
	}
	
	.gallery-header {
	  padding: 15px 0; /* パディングをさらに削減 */
	}
	
	.gallery-header h3 {
	  font-size: 20px;
	}
	
	.gallery-header p {
	  font-size: 14px;
	}
	
	.gallery-button {
	  width: 100%;
	  max-width: 280px;
	}
  }
  
  /* 印刷時の対応 */
  @media print {
	.case-studies-bg {
	  background-color: white !important;
	  color: black !important;
	}
	
	.case-studies-header h2,
	.case-studies-header p {
	  color: black !important;
	}
	
	.case-studies-header h2:after {
	  background-color: #ccc !important;
	}
  }
  /*  */
  /* サポートセクションのスタイリング */
  
  .text-center {
	text-align: center;
  }
  
  .mb-30 {
	margin-bottom: 30px;
  }
  
  .mb-40 {
	margin-bottom: 40px;
  }
  
  /* 2カラムのコンテナ */
  .support-two-column-container {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
  }
  
  /* サポートカード */
  .support-card {
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
	overflow: hidden;
	height: 100%;
	display: flex;
	flex-direction: column;
  }
  
  .support-card.full-width {
	grid-column: span 2;
	width: 100%;
  }
  
  /* カードヘッダー */
  .support-card-header {
	background-color: var(--dark-teal, #00857b);
	padding: 15px 20px;
	color: white;
  }
  
  .support-card-title {
	font-size: 18px;
	font-weight: 600;
	margin: 0;
	line-height: 1.4;
	text-align: center;
	color: white;
  }
  
  /* カードボディ */
  .support-card-body {
	padding: 25px 20px;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
  }
  
  /* 縦並びコンテナ（ソフトウェアサポート用） */
  .support-vertical-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
  }
  
  .support-content {
	width: 100%;
	max-width: 700px;
	/* margin-bottom: 20px; */
  }
  
  .support-card-text {
	font-size: 15px;
	line-height: 1.6;
	color: #333;
	margin-bottom: 5px;
	/* margin-bottom: 20px; */
  }
  
  /* 画像コンテナと画像 */
  .support-image-container {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 10px;
	max-width: 100%;
  }
  
  .support-image-container.centered-image {
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
  }
  
  /* 2カラム部分の画像を幅いっぱいに */
  .support-image-container.full-width-img {
	padding: 0;
	margin-top: auto;
	width: 100%;
  }
  
  .support-image {
	max-width: 100%;
	height: auto;
	object-fit: contain;
  }
  
  /* 2カラム部分の画像の高さを揃える */
  .support-image.fixed-height {
	max-height: 192px; /* 両方の画像に適した高さに設定 */
	width: 100%;
	object-fit: contain;
  }
  
  /* 有料サポート表示のコンテナ */
  .premium-support-container {
	display: flex;
	justify-content: center;
	/* margin-bottom: 30px; */
	width: 80%;
  }
  
  /* 有料サポート表示（ライトスタイル - 青文字淡い背景） */
  .premium-support.light-style {
	display: flex;
	align-items: center;
	background: #f0f7ff;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	overflow: hidden;
	min-width: 500px;
	border: 1px solid #e0ecff;
  
  }
  
  .premium-support.light-style .premium-support-label {
	background-color: #e0ecff;
	color: #2859aa;
	font-weight: 700;
	padding: 12px 20px;
	font-size: 16px;
	letter-spacing: 0.5px;
  }
  
  .premium-support.light-style .premium-support-hours {
	color: #2859aa;
	padding: 12px 20px;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.5px;
  }
  
  /* 2カラム部分の画像を垂直中央揃えに */
  .support-image-container.vertical-center {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 180px; /* カード内での画像エリアの高さを設定 */
  }
  
  /* レスポンシブ対応の部分に追加 */
  @media (max-width: 767px) {
	.support-image-container.vertical-center {
	  height: 180px;
	}
  }
  
  /* レスポンシブ対応 */
  @media (max-width: 991px) {
	.premium-support.light-style {
	  width: 80%;
	  max-width: 360px;
	  flex-direction: column;
	}
	
	.premium-support-label,
	.premium-support-hours {
	  width: 100%;
	  text-align: center;
	  padding: 12px 15px;
	}
  }
  
  @media (max-width: 767px) {
	.support-two-column-container {
	  grid-template-columns: 1fr;
	  gap: 20px;
	}
	
	.support-card-title {
	  font-size: 16px;
	}
	
	.support-card-body {
	  padding: 20px 15px;
	}
	
	.section-title {
	  font-size: 24px;
	}
	
	.premium-support.light-style {
	  width: 100%;
	  min-width: unset;
	}
	
	/* モバイルでの画像高さ調整 */
	.support-image.fixed-height {
	  max-height: 160px;
	}
  }

  @media screen and (max-width: 1024px) {

	.clinic-product-card{
		flex: 0 0 80%;
		margin: auto;
	}

	/*  */
	.pconly2{display: none;}
	.set ul {width: 100%;}
	.set li {font-size: 12px;}

	.set {
		/* height: 100%;  */
	}
	
	.set div:nth-child(1) {
		/* width: 100%; */
		/* padding: 10px 0; */
		height: auto;
	}
	
	.set div:nth-child(2) {
		width: 100%;
	}
	
	
	
	
	thead tr {
		display: none;
	}
	
	.t-title {
		margin-bottom: 10px;
		border-bottom: 2px solid #ccc;
	}
	
	.t-title td {
	
		position: relative;
	}
	
	.t-title td::before {
		content: attr(data-label);
		position: absolute;
		left: 10px;
		top: 50%;
		transform: translateY(-50%);
		font-weight: bold;
		color: #333;
	}
	
	
	/*  */
	
		
		/*----- サイドメニュー -----*/
	
		.side_nav {
			display: none !important;
		}
	
		/*----- サイドメニューここまで -----*/
	
		#breadcrumbs {
			display: none;
		}
	
		table td {
			font-size: 1.2rem;
		}
	
		.posset_box .content div:nth-of-type(2)>div>table td {
			font-size: 1.4rem;
		}
	
		.swiper-wrapper {
			flex-wrap: nowrap;
			margin: 0 0 30px;
		}
	
		.swiper-slide {
			width: auto;
			background: none;
			border: none;
			display: block;
		}
	
		.swiper-slide p {
			font-size: 14px;
			margin-bottom: 5px;
		}
	
		.swiper-button-prev,
		.swiper-button-next,
		.swiper-pagination {
			display: block;
		}
	
		.swiper-button-prev,
		.swiper-button-next {
			margin-top: -36px;
		}
	
		.turiset_box ul li {
			font-size: 1.4rem;
		}
	
	}



	@media screen and (max-width: 767px) {
	.set-box-content {display: block;}
	.set-box-image img {
		max-height: 130px;
		margin-bottom: 10px;
		object-fit: contain;
	}
		.banner_box2 {
			justify-content: center;
			padding: 10px 0 10px 0;
		}
		
		.banner_box2 img:nth-child(1) {
			margin-bottom: 5px;
				margin-right: 0px;
			
		}
		/*----- キャンペーンバナー -----*/
	
		.bnr_cam {
			bottom: 65px;
		}
	
		/*----- キャンペーンバナーここまで -----*/
	
		.pagetop {
			bottom: 90px;
		}
	
		.hero_box>section {
			display: flex;
			justify-content: center;
			height: 410px;
		}
	
		.hero_box>section>div {
			right: auto;
			padding: 0 20px;
		}
	
		.hero_box>section>div img {
			margin: 0 0 50px;
		}
	
		.hero_box>section>div h1 {
			font-size: 4.6rem;
			text-align: left;
			padding-left: 0px;
		}
	
		.hero_box>section>div h1::before {
			width: 110px;
			height: 40px;
			font-size: 1.6rem;
			border-radius: 10px;
			top: -30px;
			left: 0;
		}
	
		.hero_box>section>div h1::after {
			transform: rotate(65deg);
			top: -3px;
			left: 20px;
		}
	
		.hero_box>section>ul {
			display: none;
		}
	
		.banner_box {
			padding: 30px 20px;
		}
	
		.inner {
			padding: 60px 20px !important;
		}
	
		.rr {
			display: flex;
			flex-direction: column-reverse;
			flex-wrap: wrap;
		}
	
		h2 {
			font-size: 25px;
		}
	
		.single-item {
			width: 95%;
			margin: auto;
			padding: 5px 10px;
		}
	
		.link {
			font-size: 12px;
		}
	
		.sp_imgs {
			max-width: 300px;
			display: flex;
			flex-direction: column;
			margin: 0 auto;
		}
	
		table {
			max-width: 400px;
		}
	
		.posset_box .content div:nth-of-type(2)>div>table {
			max-width: 700px;
		}
	
		.posset_box .content div:nth-of-type(2)>div>table td {
			display: table-cell;
		}
	
		table.spec tr {
			border: none;
		}
	
		table.spec th {
			background: #f2f2f2;
			width: 100%;
			display: block;
		}
		.t-title {
			padding-top: 0px;
		}
	
		.spec {
			padding-top: 8px !important;
			display: grid
	;
		}
	
		.spec>td:nth-child(1){ background: #f2f2f2;}
	
	
		th,
		td {
			display: block;
			width: 100%;
		}
	
		.clinic_semiself td {
			width: 100%;
		}
	
		.clinic_semiself tr:last-of-type td:nth-of-type(n+2) {
			display: none;
		}
	
		.hero_box {
			width: 100%;
			height: 400px;
			background-position: center bottom;
			background-size: auto 200px;
			margin-bottom: 300px;
		}
	
	/* hikaku */
	.register-comparison-container {
		display: block;
	  }
	
	  .register-comparison-bg-left,
	  .register-comparison-bg-right {
		width: 100%;
		position: absolute;
		height: auto;
		min-height: unset;
	  }
	  
	  .register-comparison-content {
		display: flex;
		flex-direction: column;
	  }
	
	  .register-comparison-title-section {
		position: relative;
		z-index: 1;
	  }
	
	  .register-comparison-comparison-section {
		position: relative;
		z-index: 1;
	  }
	  
	  .register-comparison-bg-left {
		height: calc(50% + var(--title-height, 200px)); /* タイトル部分の高さを含める */
		top: 0;
	  }
	  
	  .register-comparison-bg-right {
		height: calc(52% - var(--title-height, 200px)); /* タイトル部分の高さを差し引く */
		bottom: 0;
		top: auto;
	  }
	  
	  .register-comparison-wrap {
		flex-direction: column;
		align-items: center;
	  }
	  
	  .register-comparison-column {
		width: 100%;
		margin-bottom: 0px;
	  }
	  .register-comparison-system-title {
	
		margin-top: 20px;
	  }
	  .register-comparison-question-image {
		position: relative;
		left: auto;
		top: auto;
		transform: none;
		margin: 20px auto;
	  }
	  
	  .register-comparison-features ul {
	 width: 100%;
	  }
	
	  .register-comparison-features li {
		margin-left: 0px;
	  }
	
	  .register-comparison-features p {
		margin-left: 0px;
	  }
	  
	  .register-comparison-title {
		width: 90%;
		font-size: 2rem;
		margin: 0 auto;
	
	  }
	/* hikaku */
	
	
	
	
	/*  */
	.inner2 {
		padding: 30px 10px;
	}
	#gyosyu .gyosyu_box{
		display: flex;
		flex-wrap: wrap;
	}
		#gyosyu .gyosyu_box .gyosyu_inner {
			width: calc(90%/2);
			text-align: center;
			font-weight: 500;
		}
	
		#gyosyu .gyosyu_box .gyosyu_inner p {
			font-size: 1.7rem;
		}
	
	
		.pharmacy_link {
			/* width: 100%; */
	
		}
	
		.pharmacy_text p {
			font-size: 1.5rem;
	
		}
		
		/*  */
		#okomari .okomari_box {
			display: flex;
			flex-wrap: wrap;
		}
	
		#okomari .okomari_box .okomari_inner {
			width: calc(100%/2);
			text-align: center;
			margin: auto;
			font-weight: 500;
		}
	
		#okomari .okomari_box .okomari_inner p {
			font-size: 1.4rem;
			letter-spacing: -1px;
		}
	
		#okomari .okomari_box .okomari_inner img {
			max-width: 100px;
			margin-top: 10px;
		}
	
		.semiselfbox ul {
			justify-content: space-evenly !important;
		}
	
		.semiselfbox ul li {
			margin-top: 10px;
			width: calc(76%/3) !important;
		}
	
		.point div {
			width: 100%;
		}
	
		#set .col-6 {
			width: 98%;
			margin: auto;
			margin-bottom: 10px;
		}
	
		.renkei_jisseki td:first-child {
			background: #eaeaea;
		}
	
		.purchace_imagebox {
			border-right: none;
			padding: 0 20px;
		}
	
		.hero_box>section>div:nth-of-type(2) {
			display: none;
		}
	
		.g_checklist ul {
			margin-left: 0.5rem;
			margin-top: 1rem;
		}
	
		.g_checklist ul li {
			padding-bottom: 5px;
			line-height: 2rem;
			text-indent: -2.4rem;
			padding-left: 2rem;
		}
	
		#option .option_box {
			align-items: unset;
			justify-content: space-between;
			display: block;
		}
	
		#option .col-3 {
			width: 95% !important;
			margin: auto;
			margin-bottom: 10px;
		}
	
		#option .col-3 .option_textbox {
			height: auto;
		}
	
		#option .col-3 .option_textbox h3 {
			display: flex;
			flex-direction: column;
			font-size: 18px !important;
			height: auto;
		}
	
		#option .col-3 p {
			padding: 0 5%;
			margin-top: 5px;
		}
	
		.renkei_jisseki td:first-child {
			background: #eaeaea;
		}
	
		.renkei_jisseki tr td:nth-of-type(1),
		.renkei_jisseki tr td:nth-of-type(2),
		.renkei_jisseki tr td:nth-of-type(3) {
			display: table-cell;
			font-size: 1.1rem;
			padding: 10px 5px;
		}
	
		.renkei_jisseki tr td:nth-of-type(-n+2) {
			width: 39%;
		}
	
		#semiself .slick-next {
			right: 0px !important;
		}
	
		#semiself .slick-prev {
			left: 0px !important;
		}
	
		#op_kessai {
			padding: 20px;
		}
	
		.seav_box {
			padding: 20px;
		}
	
		.check_box {
			margin: 0 auto 20px;
		}
	
		.point div div {
			margin: 10px auto 0;
		}
	
		.turiset_text {
			max-width: 400px;
			margin: 0 auto 10px;
		}
	
		.turiset_text span {
			display: block;
			margin: 0;
		}
	
		.ctext_sp_ltext {
			text-align: left;
		}
	
		.posset_box .posset {
			grid-template-columns: repeat(1, 1fr);
		}
	
		.posset_box .icon_box>div {
			top: 60px;
			right: 0;
			z-index: 2;
		}
	
		.posset_box .posset>div img {
			max-width: 300px;
		}
	
		.posset_box .content>div:nth-of-type(1),
		.posset_box .content>div:nth-of-type(2)>ul {
			grid-template-columns: repeat(1, 1fr);
		}
	
		.campaign_box {
			max-width: 500px;
			grid-template-columns: 1fr;
		}
	
		/*  */
			
	
		.case {
	
		}
	
	  
		.case h2 img {
		  vertical-align: bottom;
		  margin-right: 5px;
		}
		.case>a>div  {
		  border: 1px solid #ddd;
		  margin-bottom: 20px;
		  display: flex;
		  flex-direction: column;
		  width: 90%;
		  margin: auto;
		}
	
		.case_box {
		  margin-bottom: 60px;
		  display: flex;
		  flex-direction: column;
		}
		 .case_box :last-child{margin-bottom: 0px;}
	
	  
		.case .flex img {
		  width: 100%;
		  height: 370px;
		  max-height: 386px;
		  object-fit: cover;
	  }
		.case .case_text {
		  width: 100%;
		}
		.case .case_ttl {
	
		  width: 100%;
		  padding: 10px 10px 13px 20px;
		}
		.case .case_ttl h3 {
		  font-size: 16px;
		  margin-bottom: 10px;
		}
		.case .case_ttl p {
		  font-size: 14px;
		  color: #999999;
		}
		.case .case_cate {
		  padding: 15px 0 15px 20px;
		  background-color: #fff;
		}
		.case .case_cate p {
		  line-height: 2.0;
		}
		.case .case_cate p:first-child {
		  margin-bottom: 15px;
		}
		.case .case_cate span {
		  background-color: #ECF3F5;
		  padding: 5px;
		  margin-right: 5px;
		}
	  
	
	
		/*----- slickスライダー -----*/
	
		.slick_box {
			max-width: 500px;
			margin: 0 auto 30px;
		}
	
		.slick_box>div>div>div {
			transform: scale(1);
		}
	
		/*  */
	
		.type_buttons_wrap{display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		padding:  0 10px;
		gap: 10px;
	}
		.button {
			width: calc(95%/2);	
			margin: 0px;
			line-height: 20px;
			font-size: 16px;
			padding: 5px 10px 10px 5px;
		}
	
		/*----- /slickスライダ-----*/
	
		/*メールフォーム*/
	
		/*メールフォーム*/
	
		.form_title h2 {
			font-size: 2.4rem;
			align-items: flex-end;
		}
	
		.form_box {
			padding: 20px 20px 40px;
		}
	
		.form_box table {
			max-width: 100%;
		}
	
		.form_box table td {
			font-size: 1.4rem;
		}
	
		.form_box table tr th {
			padding: 20px 0 0;
		}
	
		.form_box input.short {
			max-width: 100%;
		}
	
		/* form2 */
		.form_box2 {
			padding: 20px 20px 40px;
		}
	
		.form_box2 table {
			max-width: 100%;
		}
	
		.form_box2 table td {
			font-size: 1.4rem;
		}
	
		.form_box2 table tr th {
			padding: 15px 0 5px;
		}
	
		.form_box2 input.short {
			max-width: 100%;
		}
	
		/*メールフォームここまで*/
	
		.form_box table tr {
			display: flex;
			flex-flow: column;
		}
	
		/*メールフォームここまで*/
	
	
	
	
	}
	/* ==== 横長バナー – light ==== */
.pharmacy_banner{
	/* レイアウト */
	display:flex;
	align-items:center;
	width:100%;
	max-width:960px;
	height:150px;                 /* ← ご要望の縦幅 */
	margin:20px auto;
	padding:0 20px;
	gap:24px;
  
	/* “さり気ない”ビジュアル */
	background:#f4f8fc;           /* .pharmacy_link と同じ淡色背景 :contentReference[oaicite:0]{index=0} */
	border:1px solid #005d96;     /* 同系色の細枠線 :contentReference[oaicite:1]{index=1} */
	border-radius:8px;
	box-shadow:0 2px 6px rgba(0,0,0,.08); /* 影を弱めに */
  
	/* アニメーション */
	transition:transform .3s, box-shadow .3s;
	text-decoration:none;
	color:#073298;
  }
  .pharmacy_banner:hover{
	transform:translateY(-3px);
	box-shadow:0 4px 12px rgba(0,0,0,.12);
  }
  
  /* 画像まわり — 高さ150 px内でバランス調整 */
  .pharmacy_banner-img{
	flex:0 0 200px;               /* お好みで幅調整 */
	max-height:90%;
  }
  .pharmacy_banner-img img{
	width:100%;
	height:auto;
	border-radius:6px;
  }
  
  /* テキスト＋矢印 */
  .pharmacy_banner-text{
	flex:1;
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:15px;
  }
  .pharmacy_banner-text p{
	font-size:1.8rem;             /* 小さめに */
	font-weight:700;
	margin:0;
  }
  .pharmacy_banner .arrow{
	font-size:2.2rem;
	font-family:'Font Awesome 5 Free',sans-serif;
	font-weight:900;
  }
  
  /* モバイル：縦並びに切替え */
  @media(max-width:768px){
	.pharmacy_banner{
	  flex-direction:column;
	  height:auto;                /* 自動伸縮 */
	  padding:15px;
	}
	.pharmacy_banner-img{
	  width:60%;
	}
	.pharmacy_banner-text{
	  padding-top:10px;
	}
	.pharmacy_banner-text p{
	  font-size:1.6rem;
	}
	.pharmacy_banner .arrow{
	  font-size:2rem;
	}
  }
  

    /* FAQセクションのスタイリング */
	#faq {
		background: linear-gradient(135deg, #f8fffe 0%, #e8f8f5 100%);
		padding: 40px 0;
		/* margin: 30px 0; */
	}

	.faq-container {
		max-width: 900px;
		margin: 0 auto;
		padding: 0 20px;
	}

	.faq-title {
		text-align: center;
		font-size: 28px;
		font-weight: 800;
		color: #00857b;
		margin-bottom: 10px;
		position: relative;
	}

	.faq-subtitle {
		text-align: center;
		font-size: 15px;
		color: #666;
		margin-bottom: 30px;
		line-height: 1.5;
	}

	.faq-list {
		display: flex;
		flex-direction: column;
		gap: 12px;
	}

	.faq-item {
		background: white;
		border-radius: 12px;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
		overflow: hidden;
		transition: all 0.3s ease;
		border: 1px solid rgba(0, 133, 123, 0.1);
	}

	.faq-item:hover {
		box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
		transform: translateY(-2px);
	}

	.faq-item[open] {
		box-shadow: 0 8px 25px rgba(51, 181, 163, 0.15);
		border-color: rgba(51, 181, 163, 0.3);
	}

	.faq-summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 16px 20px;
		font-size: 15px;
		font-weight: 600;
		color: #333;
		cursor: pointer;
		list-style: none;
		position: relative;
		transition: all 0.3s ease;
		background: linear-gradient(to right, transparent, rgba(51, 181, 163, 0.02));
	}

	.faq-summary::-webkit-details-marker {
		display: none;
	}

	.faq-summary::marker {
		content: none;
	}


	.faq-icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 28px;
		height: 28px;
		background: linear-gradient(135deg, #33b5a3, #00857b);
		border-radius: 50%;
		color: white;
		font-size: 13px;
		font-weight: bold;
		margin-right: 14px;
		flex-shrink: 0;
		position: relative;
	}

	.faq-icon::before {
		content: "Q";
		font-family: 'Arial', sans-serif;
	}

	.faq-question {
		flex: 1;
		line-height: 1.4;
		padding-right: 14px;
	}

	.faq-toggle {
		width: 22px;
		height: 22px;
		border-radius: 50%;
		background: #f0f7ff;
		border: 2px solid #33b5a3;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s ease;
		flex-shrink: 0;
		position: relative;
	}

	.faq-toggle::before,
	.faq-toggle::after {
		content: "";
		position: absolute;
		background: #33b5a3;
		transition: all 0.3s ease;
	}

	.faq-toggle::before {
		width: 10px;
		height: 2px;
	}

	.faq-toggle::after {
		width: 2px;
		height: 10px;
	}

	.faq-item[open] .faq-toggle {
		background: #33b5a3;
		transform: rotate(0deg);
	}

	.faq-item[open] .faq-toggle::before,
	.faq-item[open] .faq-toggle::after {
		background: white;
	}

	.faq-item[open] .faq-toggle::after {
		opacity: 0;
	}

	.faq-answer {
		padding: 0 20px 18px 60px;
		font-size: 14px;
		line-height: 1.6;
		color: #555;
		animation: fadeInDown 0.3s ease;
		border-top: 1px solid rgba(51, 181, 163, 0.1);
		margin-top: -1px;
		background: rgba(248, 255, 254, 0.3);
	}

	.faq-answer p {
		margin: 12px 0 0 0;
		position: relative;
		padding-left: 32px;
	}

	.faq-answer p::before {
		content: "A";
		position: absolute;
		left: 0;
		top: 5px;
		width: 20px;
		height: 20px;
		background: linear-gradient(135deg, #ff6b6b, #e74c3c);
		color: white;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 10px;
		font-weight: bold;
	}

	@keyframes fadeInDown {
		from {
			opacity: 0;
			transform: translateY(-10px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	/* ハイライト効果 */
	.faq-item[open] .faq-summary {
		background: linear-gradient(to right, rgba(51, 181, 163, 0.08), rgba(51, 181, 163, 0.12));
		color: #00857b;
	}

	.faq-item[open] .faq-icon {
		transform: scale(1.1);
		box-shadow: 0 4px 12px rgba(51, 181, 163, 0.3);
	}

	/* レスポンシブ対応 */
	@media (max-width: 768px) {
		#faq {
			padding: 30px 0;
		}

		.faq-container {
			padding: 0 15px;
		}

		.faq-title {
			font-size: 24px;
		}

		.faq-summary {
			padding: 14px 16px;
			font-size: 14px;
		}

		.faq-icon {
			width: 26px;
			height: 26px;
			margin-right: 12px;
			font-size: 12px;
		}

		.faq-answer {
			padding: 0 16px 16px 54px;
			font-size: 13px;
		}

		.faq-question {
			padding-right: 10px;
		}
	}

	@media (max-width: 480px) {
		.faq-summary {
			flex-direction: column;
			align-items: flex-start;
			gap: 12px;
		}

		.faq-question {
			padding-right: 0;
		}

		.faq-toggle {
			align-self: flex-end;
			margin-top: -32px;
		}

		.faq-answer {
			padding-left: 20px;
		}
	}

	/* アクセシビリティ */
	.faq-summary:focus {
		outline: 2px solid #33b5a3;
		outline-offset: 2px;
	}

	/* 追加効果: 開閉アニメーション */
	.faq-item {
		transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	}

	.faq-item[open] {
		background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(248, 255, 254, 0.8));
	}