.subslider-container {
	overflow: hidden;
	width: 100%;
	background: #fff;
	padding: 20px 0;
}

.subslider-track {
	display: flex;

	animation: scroll-left 50s linear infinite;
}

/* 個々の画像アイテム */
.subslider-item {
	width: 25%;
	flex-shrink: 0;
	padding: 0 10px;
	box-sizing: border-box;
}

/* 画像自体のスタイル */
.subslider-item img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	height: auto;
	display: block;
	border-radius: 0px;
}

/* 左へ流れるアニメーション定義 */
@keyframes scroll-left {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-100%);
	}
}

/* ホバー時に一時停止したい場合は以下のコメントアウト */
/*
  .subslider-track:hover {
    animation-play-state: paused;
  }
  */

@media screen and (max-width: 768px) {
	.subslider-item {
		width: 30%;
		padding: 0 2px;
	}

	.subslider-track {
		display: flex;
		animation: scroll-left 20s linear infinite;
	}

	.subslider-container {
		padding: 10px 0;
	}

	@keyframes scroll-left {
		0% {
			transform: translateX(0);
		}

		100% {
			transform: translateX(-50%);
		}
	}
}

.chirashi-text {
	text-align: center;
	font-size: 24px;
	color: #f20000;
	font-weight: bold;
}

.flat7_redtxt {
	color: #f20000 !important;
	font-size: 30px !important;
	font-weight: bold !important;
	margin-right: 3px;
}

@media screen and (max-width: 768px) {
	.chirashi-text {
		font-size: 14px;
		letter-spacing: -1px;
	}

	.flat7_redtxt {
		font-size: 14px !important;
		font-weight: bold !important;
		margin-right: 3px;
	}
}

.foot_nav {
	width: 65% !important;
}

.mt20 {
	margin-top: 20px;
}

@media screen and (max-width: 768px) {
	.mt20 {
		margin-top: 10px;
	}
}

@media only screen and (max-width: 1023px) {
	header .logo {
		width: 180px;
		float: none;
		margin: 5px auto 0px;
	}

	.foot_nav {
		width: 100% !important;
	}
}

/* スマホ（768px以下）かつトップページ（body.home）のみ適用 */
@media screen and (max-width: 768px) {
	/* --------------------------------------------------
   SP & トップページのみ：最初は隠して、クラスがついたら表示
-------------------------------------------------- */
	@media screen and (max-width: 768px) {

		/* 通常時は画面の上に隠しておく */
		body.home header {
			position: fixed;
			top: -150px;
			/* ヘッダーの高さ分マイナスにする（隠す） */
			left: 0;
			width: 100%;
			z-index: 99999;
			background: #fff;
			transition: top 0.4s ease;
			/* 0.4秒かけてスッと出す動き */
			box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
		}

		/* JavaScriptでこのクラスがついたら表示する */
		body.home header.is-scrolled {
			top: 0;
			/* 位置を0に戻す（表示） */
		}

	}

	/* ヘッダーが浮いた分、コンテンツが隠れないようにボディに余白を追加 */
	/* ※ヘッダーの高さに合わせて 80px の部分を調整してください */
	body.home {
		padding-top: 0px;
	}

	.nav.sp-only #menu-area {
		top: 55px;
	}

}

@media only screen and (max-width: 1023px) {
	.sp_menu {
		background: #ff1c38;
		padding-top: 5px;
		padding-bottom: 5px;
	}

	.sp_menu a {
		width: 28%;
		background: #1a2da3;
		color: #fff;
		text-align: center;
		margin: 2px 2px 2px;
	}
}

@media only screen and (max-width: 1023px) {
	.yebg {
		margin-top: 0px;
	}

	.top_news {
		margin-top: 30px;
	}

	.comp_data_one img {
		margin: 0px 0;
	}
}

/* --------------------------------------------------
   SP & トップページのみ
   固定バナーとコンタクトエリアをスクロール表示にする
-------------------------------------------------- */
@media screen and (max-width: 768px) {

	/* 対象：最初は画面の下へ隠しておく */
	body.home .fixed_banner,
	body.home .contact_area {
		/* 自分の高さ分だけ下へ移動させて隠す */
		transform: translateY(100%) !important;

		/* 念のため透明にしておく */
		opacity: 0;
		visibility: hidden;

		/* アニメーション設定（0.4秒かけてスッと出る） */
		transition: all 0.4s ease;
	}

	/* クラスがついたら元の位置に戻して表示 */
	body.home .fixed_banner.is-scrolled,
	body.home .contact_area.is-scrolled {
		transform: translateY(0) !important;
		/* 元の位置へ */
		opacity: 1;
		visibility: visible;
	}

}

/* お問い合わせページ（ID:51）だけ、追従ボタンを消す */
.page-id-51 .contact_area {
	display: none !important;
}

.page-id-51 aside.sp-only {
	display: none !important;
}

/* スマホ（768px以下）の設定 */
@media only screen and (max-width: 768px) {

	/* 親枠をグリッドレイアウトにする */
	.car_price .bt_box {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		/* 1fr 1fr で等しく2列 */
		gap: 10px !important;
		/* ボックス間の隙間 */
		padding: 0 5px;
		/* 全体の横余白 */
	}

	/* 子要素（p10 wrap_box）のスタイルを強制リセット */
	.car_price .bt_box .wrap_box {
		width: 100% !important;
		/* 幅は親グリッドに合わせる */
		max-width: 100% !important;
		margin: 0 !important;
		/* 余計なマージンを消す */
		float: none !important;
		/* フロート解除（もし効いていたら） */
		padding: 0px !important;
		/* 内側の余白 */
		box-sizing: border-box !important;
	}

	/* --- 以下は文字サイズ調整（前回と同じ） --- */

	/* 車種名を小さく */
	.car_table_title {
		font-size: 11px !important;
		padding: 5px !important;
		line-height: 1.3;
	}

	/* テーブル内の調整 */
	.car_table dl {
		display: block !important;
		/* 縦積みにする */
		margin-bottom: 0px;
		border-bottom: 1px dotted #ccc;
		/* 区切り線を見やすく */
	}

	.car_table dt::after {
		left: 5px;
	}

	.mo_pri {
		font-size: 14px;
	}

	.mo_pri span {
		font-size: 100%;
	}

	.car_table dt,
	.car_table dd {
		display: block !important;
		width: 100% !important;
		text-align: left !important;
		padding: 2px 0 2px 20px !important;
		font-size: 11px !important;
	}
}

@media screen and (max-width: 900px) {


	.table-contactform7 th {
		width: 100%;
		display: block;
		margin: 0 auto;
		padding: 0px;
		border: none;
		text-align: left;
		background: #fff;
		color: #000;
	}

	.table-contactform7 tr {
		padding: 0px;
		border-bottom: 0px solid #888888;
	}

	.table-contactform7 input[type="text"],
	.table-contactform7 input[type="email"],
	.table-contactform7 input[type="tel"],
	.table-contactform7 textarea {
		margin: 0px;
	}

	.table-contactform7 tr:last-child {
		border-bottom: 0px solid #888888 !important;
	}

}

/* --------------------------------------------
   交通アクセス（shop_box2）のh3スタイル
   赤文字＆左アイコン
-------------------------------------------- */
#category .shop_box2 h3 {
	margin-top: 10px;
	color: #ff2d4a !important;
	font-size: 26px;

	background-repeat: no-repeat;
	/* 画像を繰り返さない */
	background-position: left center;
	/* 左端の上下中央に配置 */

	/* アイコンのサイズ調整（幅25px 高さ自動） */
	/* 大きすぎる/小さすぎる場合はここの数字を調整してください */
	background-size: 35px auto;

	/* 3. アイコンと文字が重ならないように左に余白を空ける */
	/* ※目安：上記の background-size の幅 + 10px くらい */
	padding-left: 45px !important;
}

/* 1. お車（1番目のブロック） */
#category .shop_box2 .mb30:nth-of-type(1) h3 {
	background-image: url('../img/shop/caricon.jpg') !important;
}

/* 2. バス（3番目のブロック） */
/* ※間にh3のないブロックがあるため「3」になります */
#category .shop_box2 .mb30:nth-of-type(3) h3 {
	background-image: url('../img/shop/busicon.jpg') !important;
}

@media screen and (max-width: 900px) {
	#category .shop_box2 h3 {

		font-size: 20px;
		background-size: 25px auto;
		/* ※目安：上記の background-size の幅 + 10px くらい */
		padding-left: 30px !important;
	}
}

/* =========================================
   「お取り扱い商品」エリアのデザイン
   ========================================= */

/* 外枠の調整 */
.sonota_wrapper {
	padding-bottom: 60px;
}

/* 見出しのデザイン（PDFに合わせてシンプルに） */
.sonota_item h3 {
	margin-top: 20px;
	position: relative;
	padding-left: 20px;
	font-size: 22px;
	font-weight: bold;
	color: #1a2da3;
	margin-bottom: 0px;
}

.sonota_item h3::before {
	position: absolute;
	content: "";
	top: 10px;
	left: 0;
	background: #1a2da3;
	width: 15px;
	height: 15px;
}

/* サブテキスト・説明文 */
.sub_text {
	margin-top: 0px !important;
	font-weight: bold;
	margin-bottom: 15px;
	font-size: 18px;
}

.sonota_item .desc_text {
	font-size: 14px;
	line-height: 1.6;
	margin-bottom: 15px;
}

/* リンクテキスト */
.sonota_item .link_text {
	color: #0066cc;
	text-decoration: underline;
	font-weight: bold;
}

/* 画像の共通設定 */
.sonota_item .img_box img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 4px;
	/* 角を少し丸める */
}

/* --- レイアウト設定 --- */

/* 新車エリア（上段） */
.sonota_item.full_width {
	margin-bottom: 40px;
	/* 下の段との余白 */
}

/* 下段のフレックスコンテナ（横並びにする箱） */
.sonota_row {
	display: flex;
	justify-content: space-between;
	/* 左右に配置 */
	align-items: flex-start;
	/* 上揃え */
	gap: 40px;
	/* 左右の隙間 */
}

/* 半分幅のボックス（中古車・未使用車） */
.sonota_item.half_width {
	width: 48%;
	/* ほぼ半分 */
	box-sizing: border-box;
}

/* 左側のボックス（1番目の要素） */
.sonota_row .sonota_item:nth-of-type(1) {
	width: 58% !important;
	/* 隙間を考慮して60%より少し小さく */
}

/* 右側のボックス（2番目の要素） */
.sonota_row .sonota_item:nth-of-type(2) {
	width: 38% !important;
	/* 隙間を考慮して40%より少し小さく */
}

/* 新車エリアの画像を横並びにする設定 */
.sonota_item .img_box {
	display: flex;
	/* 横並びにする */
	gap: 20px;
	/* 画像と画像の間の隙間 */
	justify-content: space-between;
	/* 均等に配置 */
}

/* 画像ごとの設定 */
.sonota_item .img_box_flex img {
	width: 48%;
	/* 隙間を考慮して少し小さめに（約半分） */
	height: auto;
	/* 高さは自動 */
	object-fit: cover;
	/* 枠に合わせてトリミング（必要なければ削除可） */
}

.sonota_item .link_text img {
	margin-top: 20px;
	/* 上の余白 */
	margin-bottom: 40px;
	/* 下の余白 */

	display: block;
	/* 画像をブロック要素にして余白を確実に効かせる */
}

.img_box3 {
	padding-top: 30px;
}

/* スマホ（SP）の時は縦積みにしたい場合 */
/* ※スマホでも横並びのままで良ければ、以下の @media ... は削除してください */
@media only screen and (max-width: 768px) {
	.sonota_item .img_box_flex {
		display: block;
		/* 縦積みに戻す */
	}

	.sonota_item .img_box_flex img {
		width: 100%;
		/* 幅いっぱいにする */
		margin-bottom: 15px;
		/* 下に隙間 */
	}
}

/* =========================================
   スマホ（SP）用レスポンシブ
   ========================================= */
@media only screen and (max-width: 768px) {
	.sonota_item h3 {
		margin-top: 5px;
		font-size: 16px;
		padding-left: 15px;
	}

	.sub_text {
		margin-top: 0px !important;
		font-weight: bold;
		margin-bottom: 15px;
		font-size: 14px;
	}

	.sonota_item h3::before {
		position: absolute;
		content: "";
		top: 10px;
		left: 0;
		background: #1a2da3;
		width: 10px;
		height: 10px;
	}

	.sonota_item .link_text img {
		margin-top: 10px;
		margin-bottom: 0px;
		display: block;
	}

	/* 横並びを解除して縦積みに */
	.sonota_row {
		display: block;
	}

	/* 幅を100%に戻す */
	.sonota_item.half_width {
		width: 100%;
		margin-bottom: 0px;
		/* アイテム間の余白 */
	}

	/* 見出しサイズ調整 */
	.sonota_item h3 {
		font-size: 18px;
	}

	.sonota_item h3 .small {
		font-size: 14px;
	}

	.sonota_row .sonota_item:nth-of-type(1),
	.sonota_row .sonota_item:nth-of-type(2) {
		width: 100% !important;
	}


	.img_box3 {
		padding-top: 0px;
	}

	.sonota_wrapper {
		padding-bottom: 20px;
	}
}

/* =========================================
   「お支払いの種類」専用スタイル
   ========================================= */

/* PC表示：横並び設定 */
.payment_flex_wrapper {
	display: flex;
	justify-content: space-between;
	/* 左右に配置 */
	align-items: center;
	/* 上下中央揃え */
	gap: 20px;
	/* テキストと画像の間の隙間 */
	margin-bottom: 40px;
}

/* テキストエリア（約55%） */
.payment_text_box {
	width: 55%;
}

/* 画像エリア（約45%） */
.payment_img_box {
	width: 42%;
	/* 隙間(gap)の分を引いて少し小さめに調整 */
}

/* 画像自体の設定 */
.payment_img_box img {
	width: 100%;
	height: auto;
	display: block;
}


/* =========================================
   スマホ（SP）用レスポンシブ設定
   ========================================= */
@media only screen and (max-width: 768px) {

	.payment_flex_wrapper {
		/* 重要：並び順を逆にする（下が上に来る） */
		flex-direction: column-reverse;
		gap: 0px;
		margin-bottom: 10px;
	}

	.payment_method_list {
		margin-top: 10px !important;
	}

	/* 幅を100%に戻す */
	.payment_text_box,
	.payment_img_box {
		width: 100%;
	}

	/* 画像とテキストの間の余白調整 */
	.payment_img_box {
		margin-bottom: 10px;
		margin-top: 10px;
	}
}

/* =========================================
   お支払い方法リスト（4つのアイコンリスト）
   ========================================= */

.payment_method_list {
	margin-top: 40px;
}

/* 個々のアイテム（アイコン＋テキスト） */
.payment_item {
	display: flex;
	/* 横並びにする */
	align-items: flex-start;
	/* 上揃え */
	margin-bottom: 30px;
}

.payment_item:last-child {
	border-bottom: none;
	/* 最後だけ線なし */
	margin-bottom: 0;
}

/* 左側のアイコン画像エリア */
.payment_icon {
	width: 100px;
	/* アイコンの幅（画像のサイズに合わせて調整） */
	flex-shrink: 0;
	/* 幅が縮まないように固定 */
	margin-right: 20px;
	/* テキストとの隙間 */
}

.payment_icon img {
	width: 100%;
	height: auto;
	display: block;
}

/* 右側のテキストエリア */
.payment_content {
	flex: 1;
	/* 残りの幅いっぱいを使う */
}

/* タイトル（青太文字） */
.payment_title {
	color: #002c8e;
	/* 画像のような濃い青 */
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 10px;
	line-height: 1.3;
}


/* =========================================
   スマホ（SP）用レスポンシブ設定
   ========================================= */
@media only screen and (max-width: 768px) {

	.payment_item {
		position: relative;
		padding-left: 0;
		margin-bottom: 5px;
	}

	/* アイコンを少し小さくして左上に置くか、上部に配置 */
	.payment_icon {
		width: 50px;
		margin-bottom: 0px;
		margin-right: 3px;
	}

	/* タイトルサイズ調整 */
	.payment_title {
		font-size: 18px;
		margin-bottom: 2px;
	}
}

/* =========================================
   その他サービス（service）エリア
   ========================================= */

.service_list_wrapper {
	margin-top: 30px;
}

/* --- 共通設定 --- */
.service_item {
	padding: 30px 0;
	border-bottom: 3px dotted #002c8e;
	/* 青い点線 */
}

.service_item:last-child {
	border-bottom: none;
}

/* ロゴ画像のサイズ調整 */


.service_logo img {
	max-width: 450px;
	/* ロゴの最大幅 */
	height: auto;
	display: block;
	margin-bottom: 10px;
}

.service_logo2 img {
	max-width: 350px;
	/* ロゴの最大幅 */
	height: auto;
	display: block;
	margin-bottom: 10px;
}

/* 色付きテキスト（【〇〇店】の部分） */
.service_text_color {
	font-weight: bold;
	font-size: 26px;
	margin-bottom: 5px !important;
	line-height: 1em;
}

.color_green {
	color: #009e53;
}

.color_darkgreen {
	color: #00665a;
}

/* ウルトラ車検の緑 */
.color_red2 {
	color: #cc0000;
}

.color_blue {
	color: #0055aa;
}

.color_darkblue {
	color: #184381;
}

/* カーマッチのオレンジ */

/* 黒字の説明文 */
.service_text_desc {
	padding-left: 15px;
	font-weight: bold;
	font-size: 18px;
	color: #333;
	margin-top: 0px !important;
}


/* --- ① ウルトラ車検（特殊レイアウト） --- */
.special_item .service_flex_top {
	display: flex;
	ustify-content: flex-start;
	align-items: flex-end;
	/* 下揃え */
	margin-bottom: 20px;
}

.special_item .service_info {
	width: 37%;
}

.special_item .service_photo {
	width: 40%;
}

.special_item .service_photo img {
	width: 100%;
	height: auto;
	border-radius: 4px;
}

.service_btn_area {
	text-align: left;
	/* 左寄せ */
}

.service_banner_link img {
	max-width: 100%;
	height: auto;
}


/* --- ②〜④ 通常リスト（ニコニコ・アップガレージなど） --- */
.normal_item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	/* 上下中央揃え */
}

/* 左側：情報エリア */
.service_info_col {
	width: 55%;
}

/* 右側：ボタン画像エリア */
.service_btn_col {
	width: 50%;
	text-align: right;
}

.service_btn_col img {
	max-width: 100%;
	height: auto;
	display: block;
	margin-left: auto;
	/* 右寄せ */
}


/* =========================================
   スマホ（SP）用レスポンシブ
   ========================================= */
@media only screen and (max-width: 768px) {
	.service_item {
		padding-top: 0px;
	}

	/* ウルトラ車検：縦積み */
	.special_item .service_flex_top {
		display: block;
	}

	.special_item .service_info,
	.special_item .service_photo {
		width: 100%;
	}

	.special_item .service_photo {
		margin-top: 15px;
	}

	/* 通常リスト：縦積み */
	.normal_item {
		display: block;
	}

	.service_info_col,
	.service_btn_col {
		width: 100%;
		text-align: left;
	}

	.service_btn_col {
		margin-top: 15px;
	}

	.service_btn_col img {
		margin-left: 0;
		/* 左寄せに戻す */
		width: 100%;
		/* バナーを幅いっぱいに */
	}

	.service_item {
		padding-bottom: 20px;
	}

	/* ロゴサイズ調整 */
	.service_logo img {
		max-width: 350px;
		margin: 10px auto 0px;
	}

	.service_text_color {
		font-size: 16px;
		text-align: center;
		margin: 5px auto 2px !important;
	}

	.service_text_desc {
		font-size: 14px;
		text-align: center;
		margin: 0 auto;
		padding-left: 0px !important;
	}
}

/* --------------------------------------------------
   ウルトラ車検の下部ボタンエリア（2列横並び）
   -------------------------------------------------- */
.service_btn_area {
	display: flex;
	/* 横並びにする */
	justify-content: space-between;
	/* 均等配置 */
	gap: 20px;
	/* ボタン間の隙間 */
	margin-top: 20px;
	/* 上との余白 */
}

/* リンク枠の設定 */
.service_banner_link {
	width: 48%;
	/* 2つ並べるので幅を約半分に */
	display: block;
}

/* 画像の設定 */
.service_banner_link img {
	width: 100%;
	height: auto;
	display: block;
}


/* --- スマホ（SP）の時は縦積みに --- */
@media only screen and (max-width: 768px) {
	.service_btn_area {
		display: block;
		/* 縦積みに戻す */
	}

	.service_banner_link {
		width: 100%;
		/* 幅いっぱい */
		margin-bottom: 15px;
		/* 下に隙間 */
	}
}

/* --------------------------------------------------
   自動車保険エリア専用スタイル
   -------------------------------------------------- */

/* 「自動車保険」のテキストロゴ設定 */
.service_text_logo {
	font-size: 55px;
	/* ロゴ画像に負けない大きさ */
	font-weight: bold;
	color: #00665a;
	/* 濃い緑色（画像に合わせて調整） */
	margin-bottom: 10px;
	line-height: 1.0;
	letter-spacing: -1px;
	/* 文字間を少し詰めてロゴっぽく */
}

/* 右側の電話番号 */
.service_tel_number {
	text-align: center;
	font-size: 40px;
	font-weight: bold;
	color: #00665a;
	/* テキストロゴと同じ濃い緑 */
	margin: 0px !important;
	/* ボタンとの隙間 */
	font-family: Arial, sans-serif;
	/* 数字をくっきりと */
}

/* --- スマホ（SP）用調整 --- */
@media only screen and (max-width: 768px) {

	/* テキストサイズを画面に合わせて少し小さく */
	.service_text_logo {
		font-size: 38px;
		text-align: center;
		margin-top: 20px;
	}

	/* 電話番号を中央寄せにする（見やすさのため） */
	.service_tel_number {
		font-size: 24px;
		text-align: center;
		margin-top: 10px;
	}

	.service_text_desc2 {
		margin-bottom: 0px !important;
	}

	.service_btn_col2 {
		margin-top: 0px !important;
	}

	.sonota03img {
		width: 80%;
		height: auto;
		margin: 0 auto;
	}

	.head_line2 {
		background-color: #fff;
		border: 2px solid #003686;
		color: #003686;
	}
}

/* =========================================
   店舗ページ（tenpo）用スタイル 修正版
   ========================================= */

.tenpo_wrapper {
	padding-bottom: 60px;
}

/* --- タイトルエリア --- */
.tenpo_main_head {
	display: flex;
	/* 横並びにする */
	align-items: center;
	/* 文字の底辺（ベースライン）で揃える */
	flex-wrap: wrap;
	/* スマホなどで折り返し */
	/* justify-content: space-between; ←★これは削除します（隙間の原因） */
}

/* ※印の上付き文字設定 */
.tenpo_main_head .asterisk {
	font-size: 0.em;
	/* 文字サイズを小さく */
	position: relative;
	/* 位置調整のために必要 */
	top: -0.5em;
	/* ★重要：強制的に上に持ち上げる */
	line-height: 1;
	/* 行高さの影響をなくす */
	margin-left: 2px;
	/* タイトルとの隙間 */
}

/* 右側の注釈（pタグ）のスタイル */
/* 重複していた記述を1つにまとめました */
.tenpo_note {
	margin: 0;
	/* 基本の余白リセット */
	margin-left: auto !important;
	margin-right: 0px !important;
	/* ★重要：これで左側の余白を最大に取り、右端に寄せます */

	font-size: 14px !important;
	font-weight: medium;
	/* 太字解除 */
	color: #333;
	line-height: 1.2;
	padding-bottom: 3px;
	/* タイトルの底辺と微調整 */
}

/* --- リード文エリア --- */
.tenpo_lead_area {}

.lead_strong {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 0px !important;
	line-height: 1.4;
}

.lead_normal {
	font-size: 18px;
	line-height: 1;
	margin: 0px !important;

}

/* --- 2カラムレイアウト --- */
.tenpo_row {
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 30px;
}

.tenpo_item.half_width {
	width: 48%;
}

/* 見出しと画像 */
.tenpo_sub_head {
	font-size: 20px;
	font-weight: bold;
	color: #002c8e;
	margin-bottom: 15px;
}

.tenpo_item .img_box img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 4px;
}

/* =========================================
   スマホ（SP）用レスポンシブ
   ========================================= */
@media only screen and (max-width: 768px) {

	/* --- 1. タイトル枠の形を調整 --- */
	/* PCのカプセル型だと文字が切れるため、四角に近い角丸にします */
	.tenpo_title_box {
		display: block !important;
		/* 内側の余白 */
		height: auto !important;
		/* 高さを中身に合わせる */
	}

	/* --- 2. メインタイトルの調整 --- */
	.tenpo_main_head {
		display: block !important;
		/* Flexを解除して普通に表示 */
		font-size: 16px !important;
		/* 文字サイズ */
		line-height: 1.4 !important;
		/* 行間を広げて読みやすく */
		text-align: left;
		/* 左寄せ */
	}

	/* ※マークの位置 */
	.tenpo_main_head .asterisk {
		font-size: 0.7em;
		vertical-align: top;
		/* 上付き */
		position: static;
		/* 位置固定を解除 */
	}

	/* --- 3. 注釈（tenpo_note）を右下に配置 --- */
	/* どうしても改行されるので、あえて「右寄せ」できれいに配置します */
	.tenpo_note {
		display: block !important;
		/* ブロック要素にする */
		width: auto;
		/* 幅いっぱい */
		margin: 0 !important;
		/* 余計な余白削除 */
		margin-top: 0px !important;
		/* タイトルとの隙間 */
		text-align: right !important;
		/* ★右寄せにする */
		font-size: 10px !important;
	}


	/* --- 以下は既存のまま --- */
	.tenpo_row {
		display: block;
	}

	.tenpo_item.half_width {
		width: 100%;
		margin-bottom: 30px;
	}

	.lead_strong {
		font-size: 16px;
	}

	.tenpo_sub_head {
		font-size: 18px;
	}
}

.tenpo_mt {
	margin-top: 60px;
	/* お好みで調整してください */
}

/* 画像の下の説明文 */
.tenpo_text_desc {
	margin-top: 15px;
	/* 画像との隙間 */
	font-size: 18px;
	/* 読みやすいサイズ */
	line-height: 1.6;
	/* 行間を適度に空ける */
	color: #333;
	font-weight: normal;
	/* 通常の太さ */
}

/* スマホ用調整 */
@media only screen and (max-width: 768px) {
	.tenpo_mt {
		margin-top: 40px;
		/* スマホでは少し狭く */
	}

	.tenpo_text_desc {
		font-size: 14px;
		/* スマホでは少し小さく */
		text-align: left;
		/* 左寄せ */
	}

	/* メニューボタンが押されたら（force-showクラスがついたら）、
   スクロール位置に関係なくヘッダーを強制的に表示する */
	body.home header.force-show,
	body.front-page header.force-show {
		top: 0 !important;
		transition: top 0.4s ease;
		/* なめらかに */
	}

	/* メニューの開始位置（top）の調整 */
	/* ヘッダーが表示された分、メニューの位置も合わせる */
	body.home .nav.sp-only #menu-area,
	body.front-page .nav.sp-only #menu-area {
		top: 55px !important;
		/* ヘッダーの高さに合わせて調整 */
	}

	body.home .fixed_banner,
	body.front-page .fixed_banner {
		/* 左側の配置を無効化 */
		left: auto !important;
		right: 10px !important;

		/* 読み込み時に横移動のアニメーションが起きないようにする */
		/* transform（出現時の縦移動）だけをアニメーションさせる設定に変更 */
		transition: transform 0.4s ease, opacity 0.4s ease, visibility 0.4s ease !important;
	}

}