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

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

/* 値は元のサイト（arch作業用/css/style.css）のまま。切り替わる画面幅は 800px と 480px */

/* 全体
---------------------------------------------------------------------------*/
body {
	--container_size: 990px;
	--article_size: 990px;
	--swl-pad_container: 0px;
	--swl-pad_post_content: 0px;
	--swl-fz--content: 14px;
	color: #333;
	background-color: #fff;
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	font-size: 14px;
	line-height: 2;
}
a {
	color: #333;
}
a:hover {
	color: #148ef6;
	text-decoration: none;
}
.p-breadcrumb {
	display: none !important;
}

/* ヘッダー
---------------------------------------------------------------------------*/
.l-header {
	background: #fff;
	border: none;
	box-shadow: none;
}
/* PC（960px 以上）：ロゴ・電話番号の箱・メニュー。スクロールすると SWELL の追従ヘッダーが上に付く */
@media (min-width: 960px) {
	.l-header .l-header__inner {
		display: block;
		position: relative;
		max-width: 990px;
		margin: 0 auto;
		padding: 0;
	}
	.l-header .l-header__logo {
		box-sizing: border-box;
		height: 100px;
		width: auto;
		padding: 10px 0 0 15px;
		text-align: left;
	}
	.l-header .c-headLogo {
		height: 80px;
	}
	.l-header .-img .c-headLogo__link {
		display: inline-block;
		padding: 0;
	}
	.l-header .c-headLogo__img {
		width: 195px;
		height: 80px;
	}
	/* 電話番号の箱（ウィジェット「ヘッダー内部」） */
	.l-header .w-header.pc_ {
		display: block !important;
		position: absolute;
		top: 15px;
		right: 10px;
		width: auto;
		margin: 0;
	}
	.l-header .w-header .c-widget {
		margin: 0;
	}
	/* メニュー */
	.l-header .l-header__gnav {
		display: block !important;
		width: 100%;
	}
	.l-header .c-gnav {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		height: auto;
	}
	.l-header .c-gnav > .menu-item {
		width: 165px;
		height: auto;
	}
	.l-header .c-gnav > .menu-item > a {
		display: block;
		height: auto;
		margin: 0 0 20px;
		padding: 10px 0;
		border-bottom: 1px solid #000;
		color: #535353;
		text-align: center;
		white-space: normal;
		transition: 0.5s;
	}
	.l-header .c-gnav > .menu-item > a .ttl {
		font-size: 16px;
		font-weight: bold;
		line-height: 1.4;
		letter-spacing: 0.1em;
	}
	.l-header .c-gnav > .menu-item > a::after {
		display: none !important;
	}
	.l-header .c-gnav > .menu-item > a:hover,
	.l-header .c-gnav > .current-menu-item > a {
		border-bottom-color: #7d0000;
		color: #7d0000;
	}
}
/* 960px 未満：SWELL のスマホ用のヘッダー（ロゴと三本線のボタン。上に付いてくる）。電話番号の箱は出さない（下の固定ボタンに電話がある） */
@media (max-width: 959px) {
	.l-header .w-header {
		display: none !important;
	}
}
.arch-tel {
	font-style: normal;
	font-size: 11px;
	line-height: 2;
	text-align: center;
	background-color: #b5b5b5;
	padding: 5px;
	letter-spacing: 0.2em;
	color: #fff;
	opacity: 0.7;
	box-shadow: 1px 2px 7px #999;
}
.arch-tel a,
.arch-tel a:hover {
	color: #fff;
	text-decoration: none;
}


/* トップのスライドショー（SWELL のメインビジュアル）
---------------------------------------------------------------------------*/
#main_visual {
	max-width: 990px;
	margin: 0 auto 20px;
}

/* コンテンツ
---------------------------------------------------------------------------*/
.l-content {
	margin-bottom: 0;
	padding-top: 0;
}
.arch-page {
	--swl-block-margin: 0;
}
.arch-page #main_content .l-mainContent__inner > .post_content {
	margin: 0;
	padding-bottom: 15px;
	line-height: 2;
}
.arch-page.home #main_content .l-mainContent__inner > .post_content {
	padding-bottom: 0;
}
.arch-page #main_content .post_content > *,
.arch-page #main_content .post_content > .arch-magazine > .wp-block-group__inner-container > * {
	margin-top: 0;
	margin-bottom: 0;
}
.arch-page #main_content .post_content p {
	margin: 0;
	padding: 0.5em 15px 1em;
}

/* ページのタイトル（元の h2 の箱） */
#main_content .c-pageTitle {
	background-color: #fff;
	box-shadow: 1px 2px 7px #999;
	border: 1px solid #000;
	font-size: 14px;
	font-weight: bold;
	line-height: 2;
	color: #000;
	padding: 10px 15px;
	margin: 0;
}
/* SWELL は中身を float にして ::after で高さを保つ。float を外して、::after は消さない */
#main_content .c-pageTitle__inner {
	display: block;
	float: none;
	margin: 0;
	padding: 0;
	border: none;
}
#main_content .c-pageTitle::before,
#main_content .c-pageTitle__inner::before,
#main_content .c-pageTitle__inner::after {
	display: none !important;
}
#main_content .c-pageTitle__subTitle {
	display: inline;
	margin-left: 1em;
	font-size: 12px;
	font-weight: normal;
	color: #333;
}

/* 見出し（元の h3：黒い線。「赤い線」は元の h4） */
.arch-page #main_content .post_content h2 {
	position: static;
	background: none;
	color: #000;
	font-size: 14px;
	font-weight: bold;
	line-height: 2;
	padding: 2px 0 2px 10px;
	margin: 10px 0 0.5em;
	border: none;
	border-bottom: 1px solid #ccc;
	border-left: 3px solid #000;
	border-radius: 0;
	box-shadow: none;
}
.arch-page #main_content .post_content h2::before,
.arch-page #main_content .post_content h2::after {
	display: none !important;
	content: none;
}
/* 「ページの見出し」：ページのタイトルと同じ箱（トップの NEWS） */
.arch-page #main_content .post_content h2.is-style-arch-title {
	background-color: #fff;
	box-shadow: 1px 2px 7px #999;
	border: 1px solid #000;
	color: #000;
	padding: 10px 15px;
	margin: 20px 0 0;
}
.arch-page #main_content .post_content h2.is-style-arch-title .c-pageTitle__subTitle {
	margin-left: 1em;
	font-size: 12px;
	font-weight: normal;
	color: #333;
}
.arch-page #main_content .post_content h2.is-style-arch-red {
	border-bottom-color: #a40035;
	border-left-color: #a40035;
	margin-top: 32px;
	margin-left: 5px;
}

/* 段落のスタイル */
.arch-page #main_content .post_content p.is-style-arch-note {
	clear: both;
	margin: 0 0 10px 15px;
	padding: 0;
	line-height: 1.5;
	color: #cd5c5c;
	font-size: 95%;
}
.arch-page #main_content .post_content p.is-style-arch-note + p.is-style-arch-note {
	margin-top: -10px;
}
.arch-page #main_content .post_content p.is-style-arch-price-note {
	clear: both;
	margin: 0 0 0 5px;
	padding: 0;
}
.is-style-arch-lead {
	font-size: 130%;
}
.is-style-arch-tel {
	font-size: 150%;
}

/* 表 */
.arch-page #main_content .post_content .wp-block-table {
	margin: 0;
	overflow: visible;
}
.arch-page #main_content .post_content .wp-block-table table {
	width: 100%;
	border: none;
	border-collapse: collapse;
	table-layout: auto;
	font-size: 100%;
}
.arch-page #main_content .post_content .wp-block-table td,
.arch-page #main_content .post_content .wp-block-table th {
	border: none;
	background: none;
	line-height: 2;
	text-align: left;
	vertical-align: top;
}
.arch-page #main_content .post_content .wp-block-table tr {
	background: none;
}
/* 店舗情報（元の .ta1） */
.arch-page #main_content .post_content .is-style-arch-info {
	margin-bottom: 15px;
}
.arch-page #main_content .post_content .is-style-arch-info td {
	padding: 5px;
}
.arch-page #main_content .post_content .is-style-arch-info td:first-child {
	width: 180px;
	font-weight: bold;
}
/* ヘアスタイルの表の分類の値：/hairstyle/ の長さのボタン（ul.arch-jump）と同じ系統の小さなラベル。押しやすいよう高さ32px以上 */
.arch-page #main_content .post_content .is-style-arch-info .arch-term-labels {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 8px;
}
.arch-page #main_content .post_content .is-style-arch-info .arch-term-label {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	padding: 0 12px;
	font-size: 13px;
	font-weight: bold;
	line-height: 1.4;
	color: #7d0000;
	background: #fff;
	border: 1px solid #7d0000;
	border-radius: 4px;
	text-decoration: none;
	transition: background-color 0.2s, color 0.2s;
}
.arch-page #main_content .post_content .is-style-arch-info a.arch-term-label:hover {
	background: #7d0000;
	color: #fff;
}
/* 「料金を見る ›」：ラベルの列の後ろに、濃い赤の下線付きの文字リンク */
.arch-page #main_content .post_content .is-style-arch-info a.arch-price-link {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	margin-left: 4px;
	font-size: 13px;
	color: #7d0000;
	text-decoration: underline;
	text-underline-offset: 3px;
	white-space: nowrap;
}
.arch-page #main_content .post_content .is-style-arch-info a.arch-price-link::after {
	content: "›";
	margin-left: 0.4em;
	font-size: 1.2em;
	line-height: 1;
}
.arch-page #main_content .post_content .is-style-arch-info a.arch-price-link:hover {
	color: #4d0000;
}
/* 料金表（元の .price_box） */
.arch-page #main_content .post_content .is-style-arch-price table {
	width: calc(100% - 5px);
	margin-left: 5px;
}
.arch-page #main_content .post_content .is-style-arch-price td {
	padding: 8px 0;
}
.arch-page #main_content .post_content .is-style-arch-price td:first-child {
	width: 66%;
	padding-left: 1%;
}
.arch-page #main_content .post_content .is-style-arch-price td:last-child {
	width: 30%;
}

/* 写真（元の .photo_box） */
.arch-page #main_content .post_content .wp-block-image.aligncenter {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

/* トップの紹介文の欄（左右2列）：左が紹介文、右がご予約・住所・インスタグラム
   本文の中でカラム・見出し・段落のブロックで組み、見た目をここで付ける
---------------------------------------------------------------------------*/
.arch-page #main_content .post_content .wp-block-columns.arch-intro {
	display: flex;
	flex-wrap: nowrap;
	gap: 0;
	margin: 0;
	align-items: stretch;
}
.arch-page #main_content .post_content .arch-intro > .arch-intro__main {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0 20px 0 15px;
}
.arch-page #main_content .post_content .arch-intro > .arch-intro__side {
	flex: 0 0 270px !important;
	padding: 0 15px 0 20px;
	border-left: 1px solid #ddd;
}
.arch-page #main_content .post_content .arch-intro p {
	margin: 0;
	padding: 0;
}
/* 左：小さな行・キャッチ・段落 */
.arch-page #main_content .post_content .arch-intro p.arch-intro__lead {
	font-size: 12px;
	letter-spacing: 0.15em;
	color: #7d0000;
}
.arch-page #main_content .post_content .arch-intro h2.arch-intro__catch {
	margin: 8px 0 16px;
	padding: 0;
	border: none;
	background: none;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: 0.05em;
	color: #333;
}
.arch-page #main_content .post_content .arch-intro h2.arch-intro__catch span {
	display: block;
}
.arch-page #main_content .post_content .arch-intro .arch-intro__main > p {
	margin-bottom: 12px;
}
/* 左：得意なことの3つの欄 */
.arch-page #main_content .post_content .wp-block-columns.arch-points {
	display: flex;
	flex-wrap: nowrap;
	gap: 0;
	margin: 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #ddd;
}
.arch-page #main_content .post_content .arch-points > .wp-block-column {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
	padding: 12px 14px;
}
.arch-page #main_content .post_content .arch-points > .wp-block-column + .wp-block-column {
	border-left: 1px solid #ddd;
}
.arch-page #main_content .post_content .arch-points h3 {
	margin: 0 0 6px;
	padding: 0;
	border: none;
	background: none;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.6;
	color: #7d0000;
}
.arch-page #main_content .post_content .arch-points h3::before,
.arch-page #main_content .post_content .arch-points h3::after {
	display: none;
	content: none;
}
.arch-page #main_content .post_content .arch-points p {
	font-size: 13px;
	line-height: 1.8;
}
/* 右：ご予約・住所・インスタグラム */
.arch-page #main_content .post_content .arch-intro h2.arch-side__title {
	margin: 0 0 8px;
	padding: 0;
	border: none;
	background: none;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.6;
	color: #333;
}
.arch-page #main_content .post_content .arch-intro h2.arch-side__title small {
	margin-left: 0.5em;
	font-size: 12px;
	font-weight: normal;
	color: #777;
}
.arch-page #main_content .post_content .arch-intro p.arch-side__note,
.arch-page #main_content .post_content .arch-intro p.arch-side__hours {
	font-size: 12px;
	line-height: 1.8;
}
.arch-page #main_content .post_content .arch-intro p.arch-side__tel {
	font-size: 24px;
	font-weight: bold;
	line-height: 1.5;
}
.arch-page #main_content .post_content .arch-intro p.arch-side__tel a {
	color: #7d0000;
	text-decoration: none;
}
.arch-page #main_content .post_content .arch-intro p.arch-side__tel a:hover {
	color: #4d0000;
}
/* 「初めての方へ」のボタン（本文の標準のボタンのブロック。1行目は太字の書式、2行目はそのままの文字）：右の列の幅いっぱい・濃い赤の細い枠・白地・角丸4px */
.arch-page #main_content .post_content .arch-intro .wp-block-buttons.arch-side__first {
	display: block;
	margin: 16px 0 0;
}
.arch-page #main_content .post_content .arch-intro .arch-side__first .wp-block-button {
	display: block;
	width: 100%;
	margin: 0;
}
.arch-page #main_content .post_content .arch-intro .arch-side__first .wp-block-button__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	padding: 8px 12px;
	background: #fff;
	border: 1px solid #7d0000;
	border-radius: 4px;
	box-shadow: none;
	color: #777;
	font-size: 12px;
	font-weight: normal;
	line-height: 1.6;
	text-align: center;
	text-decoration: none;
	transition: background-color 0.2s, color 0.2s;
}
.arch-page #main_content .post_content .arch-intro .arch-side__first .wp-block-button__link strong {
	display: block;
	color: #7d0000;
	font-size: 14px;
	font-weight: bold;
}
.arch-page #main_content .post_content .arch-intro .arch-side__first .wp-block-button__link:hover,
.arch-page #main_content .post_content .arch-intro .arch-side__first .wp-block-button__link:hover strong {
	background: #7d0000;
	color: #fff;
}
.arch-page #main_content .post_content .arch-intro .arch-side__first .wp-block-button__link:hover {
	opacity: 1;
}
.arch-page #main_content .post_content .arch-intro p.arch-side__addr {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px dotted #999;
	font-size: 13px;
	line-height: 1.8;
}
.arch-page #main_content .post_content .arch-intro p.arch-side__access {
	font-size: 13px;
	line-height: 1.8;
}
.arch-page #main_content .post_content .arch-intro p.arch-side__insta {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
	font-size: 13px;
}
.arch-page #main_content .post_content .arch-intro p.arch-side__insta img {
	width: 28px;
	height: auto;
}

/* VOICE（元の section.list）
   SWELL はグループの中身を .wp-block-group__inner-container で包み、左寄せの画像を div.wp-block-image > figure.alignleft の形で出す
---------------------------------------------------------------------------*/
.arch-page #main_content .post_content .arch-voice {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 5px;
	margin: 5px 0 15px;
	overflow: hidden;
}
.arch-page #main_content .post_content .arch-voice .wp-block-image {
	margin: 0;
}
.arch-page #main_content .post_content .arch-voice .wp-block-image figure.alignleft {
	float: left;
	margin: 0;
}
.arch-page #main_content .post_content .arch-voice .wp-block-image img {
	width: 200px;
	height: auto;
	background-color: #fff;
	padding: 5px;
	border: 1px solid #ccc;
}
.arch-page #main_content .post_content .arch-voice p {
	padding: 0;
	margin-left: 0;
}
/* 1つの声の中の段落の間：1行分（14px × 行の高さ 2）あける。最後の段落の下はあけない */
.arch-page #main_content .post_content .arch-voice p:not(:last-child) {
	margin-bottom: 28px;
}
/* PC と 481〜800px：見出しの下で、画像を左・文章を右に並べる（文章の段落が複数あるので grid で並べる） */
@media (min-width: 481px) {
	.arch-page #main_content .post_content .arch-voice .wp-block-group__inner-container {
		display: grid;
		grid-template-columns: auto 1fr;
		column-gap: 20px;
		align-items: start;
	}
	.arch-page #main_content .post_content .arch-voice .wp-block-group__inner-container > h2 {
		grid-column: 1 / -1;
	}
	.arch-page #main_content .post_content .arch-voice .wp-block-group__inner-container > .wp-block-image {
		grid-column: 1;
		grid-row: 2 / span 10;
	}
	.arch-page #main_content .post_content .arch-voice .wp-block-group__inner-container > .wp-block-image figure.alignleft {
		float: none;
	}
	.arch-page #main_content .post_content .arch-voice .wp-block-group__inner-container > p {
		grid-column: 2;
	}
}

/* HAIR STYLE の写真の一覧（③で中身を入れる）
---------------------------------------------------------------------------*/
ul.arch-hairstyle-list {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 16px;
	list-style: none;
	padding: 0;
	margin: 32px 0 0 0;
}
ul.arch-hairstyle-list li {
	position: relative;
	background: #fff;
	border: 1px solid #ddd;
	overflow: hidden;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
ul.arch-hairstyle-list li a {
	display: block;
	text-decoration: none;
	color: inherit;
	position: relative;
	width: 100%;
	padding-top: 100%;
	overflow: hidden;
}
ul.arch-hairstyle-list li img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}
ul.arch-hairstyle-list li .caption {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: rgba(0, 0, 0, 0.6);
	color: #fff;
	padding: 8px;
	font-size: 14px;
	opacity: 0;
	transition: opacity 0.3s;
}
ul.arch-hairstyle-list li a:hover .caption {
	opacity: 1;
}

/* 長さへのジャンプリンクと見出し */
.arch-page #main_content .post_content ul.arch-jump {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 10px 15px 0;
}
.arch-page #main_content .post_content ul.arch-jump li {
	margin: 0;
	padding: 0;
}
.arch-page #main_content .post_content ul.arch-jump a {
	display: inline-flex;
	padding: 10px 24px;
	font-size: 14px;
	font-weight: bold;
	color: #7d0000;
	background: #fff;
	border: 1px solid #7d0000;
	border-radius: 4px;
	text-decoration: none;
	transition: background-color 0.2s, color 0.2s;
}
.arch-page #main_content .post_content ul.arch-jump a:hover {
	background: #7d0000;
	color: #fff;
}
.arch-page #main_content .post_content h2.arch-length-title {
	margin-top: 32px;
	scroll-margin-top: 10px;
}
.arch-page #main_content .post_content h2.arch-length-title .c-pageTitle__subTitle {
	margin-left: 1em;
	font-size: 12px;
	font-weight: normal;
	color: #333;
}
.arch-page #main_content .post_content h2.arch-length-title + ul.arch-hairstyle-list {
	margin-top: 16px;
}

/* ヘアスタイルの分類ごとの一覧ページ：説明文とページ送り */
.arch-page #main_content .post_content p.arch-term-desc {
	margin-top: 10px;
}
.arch-page #main_content .post_content .arch-term-pagination {
	margin: 24px 0 0;
	text-align: center;
}
.arch-page #main_content .post_content .arch-term-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
}
.arch-page #main_content .post_content .arch-term-pagination .page-numbers {
	display: inline-block;
	min-width: 2.2em;
	padding: 4px 8px;
	border: 1px solid #ccc;
	text-decoration: none;
}
.arch-page #main_content .post_content .arch-term-pagination .page-numbers.current {
	background: #7d0000;
	border-color: #7d0000;
	color: #fff;
}
.arch-page #main_content .post_content .arch-term-pagination .screen-reader-text {
	display: none;
}

/* ヘアスタイルの個別ページ */
.arch-page #main_content .post_content figure.arch-style-photo {
	margin: 20px auto;
	max-width: 600px;
	text-align: center;
}
.arch-page #main_content .post_content figure.arch-style-photo img {
	width: 100%;
	height: auto;
}
/* 一番上のアイキャッチ：押すと拡大（見た目は変えない） */
.arch-page #main_content .post_content figure.arch-style-photo a.arch-lb {
	display: block;
	cursor: zoom-in;
}
/* 仕上がりの写真・施術前の写真の2枚目以降（小さく並べ、押すと拡大） */
.arch-page #main_content .post_content ul.arch-style-thumbs {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	list-style: none;
	margin: 8px auto 20px;
	padding: 0;
	max-width: 600px;
}
.arch-page #main_content .post_content ul.arch-style-thumbs li {
	width: calc(25% - 6px);
	margin: 0;
	padding: 0;
}
.arch-page #main_content .post_content ul.arch-style-thumbs a {
	display: block;
}
.arch-page #main_content .post_content ul.arch-style-thumbs img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border: 1px solid #ddd;
}
/* Before → After：同じ幅で左右に。写真は切り取らない */
.arch-page #main_content .post_content .arch-ba {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	margin: 0 0 20px;
}
.arch-page #main_content .post_content .arch-ba__col {
	flex: 1 1 0;
	min-width: 0;
}
.arch-page #main_content .post_content figure.arch-ba__photo {
	margin: 0;
}
.arch-page #main_content .post_content figure.arch-ba__photo a {
	display: block;
}
.arch-page #main_content .post_content figure.arch-ba__photo img {
	display: block;
	width: 100%;
	height: auto;
}
.arch-page #main_content .post_content figure.arch-ba__photo figcaption {
	margin-top: 4px;
	font-size: 13px;
	text-align: center;
}
.arch-page #main_content .post_content .arch-ba__col ul.arch-style-thumbs {
	justify-content: flex-start;
	margin: 8px 0 0;
}
.arch-page #main_content .post_content .arch-ba__col ul.arch-style-thumbs li {
	width: calc(33.333% - 6px);
}
/* 拡大表示 */
.arch-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 16px;
	background: rgba(0, 0, 0, 0.85);
}
.arch-lightbox[hidden] {
	display: none;
}
.arch-lightbox__img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}
.arch-lightbox__close {
	position: absolute;
	top: 8px;
	right: 12px;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	background: none;
	color: #fff;
	font-size: 32px;
	line-height: 40px;
	cursor: pointer;
}
html.arch-lightbox-open {
	overflow: hidden;
}
.arch-page #main_content .post_content p.arch-style-back {
	margin-top: 20px;
	text-align: right;
}
/* ヘアスタイルの個別ページの見出し：/hairstyle/ の長さの見出しと同じく、上を32pxあける（色・線・大きさはほかのページの見出しと同じ） */
.arch-page #main_content .post_content.arch-style-single h2 {
	margin-top: 32px;
}

/* 地図（元の .ggmap）
---------------------------------------------------------------------------*/
.ggmap {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* PAGE TOP
---------------------------------------------------------------------------*/
.arch-page #main_content .post_content p.arch-pagetop {
	clear: both;
	overflow: hidden;
	margin: 0;
	padding: 0;
}
.arch-pagetop a {
	float: right;
	display: block;
	width: 12em;
	color: #fff;
	font-size: 10px;
	background-color: #000;
	text-decoration: none;
	text-align: center;
	letter-spacing: 0.1em;
}
.arch-pagetop a:hover {
	background-color: #333;
	color: #fff;
}

/* フッター
---------------------------------------------------------------------------*/
.l-footer {
	background: #fff;
	color: #535353;
	margin-top: 0;
}
.l-footer .l-footer__foot {
	background: none;
	padding: 0;
}
.l-footer .l-footer__foot .l-container {
	max-width: 990px;
	margin: 0 auto;
	padding: 5px 0;
	border: 1px solid #000;
	text-align: right;
}
.home .l-footer .l-footer__foot .l-container {
	border-top: none;
}
.l-footer .copyright {
	margin: 0;
	font-size: 14px;
	line-height: 2;
	color: #535353;
	text-align: right;
}
.l-footer .copyright span[lang="en"] {
	display: none;
}
.l-footer .copyright a,
.l-footer .copyright a:hover {
	color: #535353;
	text-decoration: underline;
}

/* フッターの店舗情報（ブログパーツ footer-info）。コピーライトの上に、同じ文字の大きさと色で */
.l-footer .l-footer__foot .l-container {
	display: flex;
	flex-direction: column;
}
.l-footer .copyright {
	order: 2;
}
.l-footer .arch-footer-info {
	order: 1;
	text-align: right;
	font-size: 14px;
	line-height: 2;
	color: #535353;
}
.l-footer .arch-footer-info .post_content,
.l-footer .arch-footer-info p {
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height: 2;
}
.l-footer .arch-footer-info .arch-fi {
	white-space: nowrap;
}
.l-footer .arch-footer-info a {
	color: #7d0000;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.l-footer .arch-footer-info a:hover {
	color: #4d0000;
	text-decoration: underline;
}

/* お知らせの一覧（SWELL のテキスト型。/news/ とトップのお知らせの欄）：日付とタイトルを1行で、区切り線で並べる
---------------------------------------------------------------------------*/
#main_content .p-postList.-type-simple {
	margin: 0;
	border-top: 1px solid #ccc;
}
#main_content .p-postList.-type-simple .p-postList__item {
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #ccc;
}
#main_content .p-postList.-type-simple .p-postList__link {
	display: block;
	padding: 10px 15px;
	color: #333;
	text-decoration: none;
}
#main_content .p-postList.-type-simple .p-postList__body {
	display: flex;
	align-items: baseline;
	gap: 1em;
}
#main_content .p-postList.-type-simple .p-postList__meta {
	flex: 0 0 auto;
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
}
#main_content .p-postList.-type-simple .p-postList__title {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	color: #333;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.6;
}
#main_content .p-postList.-type-simple .p-postList__link:hover .p-postList__title {
	color: #148ef6;
}

/* 本文の文字リンク（手順20）：本文・ブログパーツ・テンプレートの中の文字リンクを濃い赤・下線付きに。乗せると少し濃く
   :where() で外すもの（ボタンの形・ラベル・ページ送り・お知らせの一覧の行・写真の一覧・PAGE TOP・拡大表示の写真）は、それぞれの決まりのまま */
#main_content .post_content a:where(:not(.wp-block-button__link, .arch-term-label, .arch-price-link, .page-numbers, .p-postList__link, .arch-lb, .arch-jump a, .arch-hairstyle-list a, .arch-style-thumbs a, .arch-pagetop a, .arch-side__tel a)) {
	color: #7d0000;
	text-decoration: underline;
	text-underline-offset: 3px;
}
#main_content .post_content a:where(:not(.wp-block-button__link, .arch-term-label, .arch-price-link, .page-numbers, .p-postList__link, .arch-lb, .arch-jump a, .arch-hairstyle-list a, .arch-style-thumbs a, .arch-pagetop a, .arch-side__tel a)):hover {
	color: #4d0000;
	text-decoration: underline;
}

/* ページの中のリンクの行（トップの紹介文の下・メニューの「スタイル例を見る」） */
.arch-page #main_content .post_content p.is-style-arch-links {
	margin: 10px 0 0;
	padding: 0.5em 15px 0;
	text-align: right;
}

/* ヘアスタイルの個別ページの「（長さ）のスタイルをもっと見る ›」：右寄せ。見た目は「料金を見る ›」と同じ（色・下線は本文の文字リンクの決まり） */
.arch-page #main_content .post_content p.arch-style-more {
	margin-top: 8px;
	text-align: right;
}
.arch-page #main_content .post_content p.arch-style-more a.arch-more-link {
	font-size: 13px;
	text-underline-offset: 3px;
}
.arch-page #main_content .post_content p.arch-style-more a.arch-more-link::after {
	content: "›";
	margin-left: 0.4em;
	font-size: 1.2em;
	line-height: 1;
}
/* 「もっと見る」のすぐ後の「ヘアスタイル一覧へ」は上の余白を詰める（長さが無い投稿では今までどおり20px） */
.arch-page #main_content .post_content p.arch-style-more + p.arch-style-back {
	margin-top: 0;
}
/* お知らせ・「初めての方へ」の下の案内 */
.arch-news-guide {
	margin-top: 2em;
	padding-top: 1em;
	border-top: 1px solid #ccc;
}
/* 固定ページ（「初めての方へ」）では下にシェアのボタンや前後の記事が続かないので、フッターとの間をあける（SWELL が本文の最後の要素の下の余白を 0 にするので padding で） */
.page #main_content .arch-news-guide {
	padding-bottom: 2em;
}

/* タブレット（481px〜800px）とスマホ共通
---------------------------------------------------------------------------*/
@media (max-width: 800px) {
	body {
		--swl-pad_container: 6px;
	}
	#main_visual {
		margin-left: 6px;
		margin-right: 6px;
	}
	.l-footer .l-footer__foot .l-container {
		margin: 0 6px;
	}
	/* トップの紹介文の欄：右の列は左の列の下に回し、区切りは横線。3つの欄は縦に並べる */
	.arch-page #main_content .post_content .wp-block-columns.arch-intro,
	.arch-page #main_content .post_content .wp-block-columns.arch-points {
		flex-direction: column;
	}
	.arch-page #main_content .post_content .arch-intro > .arch-intro__main {
		padding: 0 10px;
	}
	.arch-page #main_content .post_content .arch-intro > .arch-intro__side {
		flex: none !important;
		margin-top: 16px;
		padding: 16px 10px 0;
		border-left: none;
		border-top: 1px solid #ddd;
	}
	/* 22px 前後。狭い画面では行の途中で折り返さないよう、画面の幅に合わせて少し小さくする */
	.arch-page #main_content .post_content .arch-intro h2.arch-intro__catch {
		font-size: min(22px, 5.4vw);
	}
	.arch-page #main_content .post_content .arch-points > .wp-block-column {
		flex: none;
	}
	.arch-page #main_content .post_content .arch-points > .wp-block-column + .wp-block-column {
		border-left: none;
		border-top: 1px solid #ddd;
	}
	/* フッターの店舗情報：項目ごとに1行ずつ */
	.l-footer .arch-footer-info {
		text-align: center;
	}
	.l-footer .arch-footer-info p {
		font-size: 13px;
		line-height: 1.8;
	}
	.l-footer .arch-footer-info .arch-fi {
		display: block;
		white-space: normal;
	}
	.l-footer .arch-footer-info .arch-fi-sep {
		display: none;
	}
	.l-footer .l-footer__foot .l-container {
		padding-top: 10px;
		padding-bottom: 10px;
	}
}

/* スマホ（480px以下）
---------------------------------------------------------------------------*/
@media (max-width: 480px) {
	.arch-page #main_content .post_content p {
		padding: 0.5em 5px 1em;
	}
	.arch-page #main_content .post_content .is-style-arch-info td {
		padding: 2px;
	}
	.arch-page #main_content .post_content .is-style-arch-info td:first-child {
		width: 100px;
	}
	.arch-page #main_content .post_content ul.arch-jump li {
		width: calc(50% - 4px);
	}
	.arch-page #main_content .post_content ul.arch-jump a {
		display: flex;
		justify-content: center;
		width: 100%;
		box-sizing: border-box;
	}
	/* ヘアスタイル：Before と After を上下に並べる */
	.arch-page #main_content .post_content .arch-ba {
		flex-direction: column;
	}
	.arch-page #main_content .post_content .arch-ba__col {
		width: 100%;
	}
	/* VOICE：画像を上に横幅いっぱいで出し、文章をその下に（回り込ませない） */
	.arch-page #main_content .post_content .arch-voice .wp-block-image {
		float: none;
		width: 100%;
		margin: 0 0 12px;
	}
	.arch-page #main_content .post_content .arch-voice .wp-block-image figure.alignleft {
		float: none;
		width: 100%;
		margin: 0;
	}
	.arch-page #main_content .post_content .arch-voice .wp-block-image img {
		display: block;
		box-sizing: border-box;
		width: 100%;
		height: auto;
	}
}

/* 960px 未満：画面の下の固定ボタン（SWELL の固定フッターメニュー）で、ページの一番下が隠れないように */
@media (max-width: 959px) {
	.l-footer {
		padding-bottom: calc(56px + env(safe-area-inset-bottom));
	}
}

@media (max-width: 768px) {
	ul.arch-hairstyle-list {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* プロフィール（/profile/。手順34）：本文のブロックの追加CSSクラス arch-profile-* に付ける。
   明朝体はトップのキャッチと同じ、赤は文字リンクと同じ #7d0000、文字 #333、線 #ddd、ラベル #777。スマホは 781px まで（カラムが縦に並ぶ幅） */
#main_content .post_content .arch-profile-hero {
	margin: 0;
}
#main_content .post_content .arch-profile-hero .wp-block-columns {
	--wp-column-gap: 56px;
	margin: 0;
}
#main_content .post_content .arch-profile-hero .wp-block-column {
	margin: 0;
}
#main_content .post_content .arch-profile-hero .wp-block-image {
	margin: 0;
}
#main_content .post_content .arch-profile-label {
	margin: 0;
	padding: 0;
	font-size: 12px;
	letter-spacing: 0.2em;
	line-height: 1.6;
	color: #777;
}
#main_content .post_content h2.arch-profile-name,
#main_content .post_content h2.arch-profile-heading,
#main_content .post_content .arch-profile-point h3 {
	position: static;
	padding: 0;
	border: none;
	border-radius: 0;
	background: none;
	box-shadow: none;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-weight: 600;
	line-height: 1.5;
	color: #333;
}
#main_content .post_content h2.arch-profile-name::before,
#main_content .post_content h2.arch-profile-name::after,
#main_content .post_content h2.arch-profile-heading::before,
#main_content .post_content h2.arch-profile-heading::after,
#main_content .post_content .arch-profile-point h3::before,
#main_content .post_content .arch-profile-point h3::after {
	display: none;
	content: none;
}
#main_content .post_content h2.arch-profile-name {
	margin: 8px 0 28px;
	font-size: 34px;
	letter-spacing: 0.08em;
}
/* 3項目（グループ arch-profile-fact ×3）：782px 以上は中身の幅で横に並べ、781px 以下は縦（下の @media） */
#main_content .post_content .arch-profile-facts {
	margin: 0;
}
#main_content .post_content .arch-profile-facts > .wp-block-group__inner-container {
	display: flex;
}
#main_content .post_content .arch-profile-fact {
	flex: none;
	margin: 0;
	padding: 0 20px;
}
#main_content .post_content .arch-profile-fact:first-child {
	padding-left: 0;
}
#main_content .post_content .arch-profile-fact + .arch-profile-fact {
	border-left: 1px solid #ddd;
}
#main_content .post_content .arch-profile-fact-label {
	margin: 0 0 6px;
	padding: 0;
	font-size: 12px;
	letter-spacing: 0.15em;
	line-height: 1.5;
	white-space: nowrap;
	color: #777;
}
#main_content .post_content .arch-profile-fact-value {
	margin: 0;
	padding: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.4;
	white-space: nowrap;
	color: #333;
}

/* キャッチ（グループ arch-profile-catch に段落 arch-profile-catch-line ×2）：上下に幅 40px・太さ 1px の線。
   782px 以上は2つの段落を1行につなげる。段落の間の改行が空白にならないよう、グループの文字の大きさを 0 にして段落で戻す */
#main_content .post_content .arch-profile-catch {
	margin: 96px 0;
	padding: 0;
	font-size: 0;
	text-align: center;
}
#main_content .post_content .arch-profile-catch::before,
#main_content .post_content .arch-profile-catch::after {
	content: "";
	display: block;
	width: 40px;
	height: 0;
	margin: 0 auto 32px;
	border-top: 1px solid #ddd;
}
#main_content .post_content .arch-profile-catch::after {
	margin: 32px auto 0;
}
#main_content .post_content .arch-profile-catch-line {
	display: inline;
	margin: 0;
	padding: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.8;
	color: #333;
}

/* 各章 */
#main_content .post_content .arch-profile-section {
	max-width: 680px;
	margin: 0 auto;
}
#main_content .post_content .arch-profile-section + .arch-profile-section {
	margin-top: 96px;
}
#main_content .post_content .arch-profile-en {
	margin: 0 0 8px;
	padding: 0;
	font-size: 12px;
	letter-spacing: 0.25em;
	line-height: 1.6;
	color: #7d0000;
}
#main_content .post_content h2.arch-profile-heading {
	margin: 0 0 40px;
	font-size: 24px;
	letter-spacing: 0.06em;
}
#main_content .post_content .arch-profile-text {
	margin: 0;
	padding: 0;
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.04em;
	color: #333;
}
#main_content .post_content .arch-profile-text + .arch-profile-text {
	margin-top: 24px;
}

/* 大切にしていること：01・02 */
#main_content .post_content .arch-profile-point {
	margin: 32px 0 0;
	padding: 32px 0 8px;
	border-top: 1px solid #ddd;
}
#main_content .post_content .arch-profile-point-num {
	margin: 0;
	padding: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 28px;
	line-height: 1;
	color: #7d0000;
}
#main_content .post_content .arch-profile-point h3 {
	margin: 12px 0 16px;
	font-size: 19px;
}

/* これから：結び（グループ arch-profile-closing に段落 arch-profile-closing-line ×2）と名前。
   782px 以上は段落ごとに1行で中央。781px 以下は1つの文としてつなげて左そろえ（文字の大きさ 0 の仕組みはキャッチと同じ） */
#main_content .post_content .arch-profile-closing {
	margin: 48px 0 0;
	padding: 0;
	font-size: 0;
	text-align: center;
}
#main_content .post_content .arch-profile-closing-line {
	display: block;
	margin: 0;
	padding: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 18px;
	line-height: 2;
	color: #333;
}
#main_content .post_content .arch-profile-sign {
	margin: 24px 0 0;
	padding: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 16px;
	letter-spacing: 0.08em;
	line-height: 1.6;
	text-align: right;
	color: #333;
}

/* 実績：ラベルと雑誌名の行。上下の線は重なる所を1本に */
#main_content .post_content .arch-profile-works {
	margin: 24px 0 0;
}
#main_content .post_content .arch-profile-works-row {
	margin: 0;
	padding: 20px 0;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
#main_content .post_content .arch-profile-works-row + .arch-profile-works-row {
	border-top: none;
}
#main_content .post_content .arch-profile-works-row > .wp-block-group__inner-container {
	display: flex;
	align-items: baseline;
}
#main_content .post_content .arch-profile-works-label {
	flex: none;
	width: 120px;
	margin: 0;
	padding: 0;
	font-size: 12px;
	letter-spacing: 0.2em;
	line-height: 1.6;
	color: #777;
}
#main_content .post_content .arch-profile-works-names {
	margin: 0;
	padding: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 22px;
	letter-spacing: 0.06em;
	line-height: 1.6;
	color: #333;
}

@media (max-width: 781px) {
	#main_content .post_content .arch-profile-hero .wp-block-columns {
		--wp-column-gap: 32px;
	}
	#main_content .post_content h2.arch-profile-name {
		font-size: 28px;
	}
	#main_content .post_content .arch-profile-facts > .wp-block-group__inner-container {
		display: block;
	}
	#main_content .post_content .arch-profile-fact,
	#main_content .post_content .arch-profile-fact:first-child {
		padding: 12px 0;
	}
	#main_content .post_content .arch-profile-fact + .arch-profile-fact {
		border-left: none;
		border-top: 1px solid #ddd;
	}
	/* キャッチは「鏡の前で、」のあとで2行に */
	#main_content .post_content .arch-profile-catch {
		margin: 64px 0;
	}
	#main_content .post_content .arch-profile-catch-line {
		display: block;
		font-size: 19px;
	}
	#main_content .post_content .arch-profile-section + .arch-profile-section {
		margin-top: 64px;
	}
	#main_content .post_content h2.arch-profile-heading {
		font-size: 21px;
	}
	/* 結びは1つの文としてつなげて折り返し、左そろえ */
	#main_content .post_content .arch-profile-closing {
		text-align: left;
	}
	#main_content .post_content .arch-profile-closing-line {
		display: inline;
		font-size: 17px;
	}
	#main_content .post_content .arch-profile-works-row > .wp-block-group__inner-container {
		display: block;
	}
	#main_content .post_content .arch-profile-works-label {
		width: auto;
	}
	#main_content .post_content .arch-profile-works-names {
		font-size: 18px;
	}
}

/* 初めての方へ（/first-visit/。手順36）：/profile/ の共通のクラス（arch-profile-*）に、このページだけの部分を arch-fv-* で足す */
/* キャッチ：782px 以上は「完全予約制で、」で1行、残りの2つの段落を1行につなげる（781px 以下は /profile/ の指定のまま段落ごとに1行） */
#main_content .post_content .arch-fv-catch .arch-profile-catch-line:not(.arch-fv-catch-a, .arch-fv-catch-b) {
	display: block;
}

/* 締めの文 */
#main_content .post_content .arch-fv-closing {
	margin: 0;
	padding: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 18px;
	line-height: 2;
	text-align: left;
	color: #333;
}

/* ボタン（章の中と予約の欄で共通） */
#main_content .post_content .arch-fv-btn .wp-block-button__link {
	display: inline-block;
	margin: 0;
	padding: 14px 32px;
	border: 1px solid #333;
	border-radius: 0;
	background: none;
	box-shadow: none;
	font-size: 14px;
	letter-spacing: 0.1em;
	color: #333;
	text-decoration: none;
}
#main_content .post_content .arch-fv-btn .wp-block-button__link::after {
	content: " ›";
}
#main_content .post_content .arch-fv-btn .wp-block-button__link:hover {
	background: #333;
	color: #fff;
}
/* 章の中のボタン：左そろえ、上 32px */
#main_content .post_content .arch-profile-section .wp-block-buttons:has(> .arch-fv-btn) {
	justify-content: flex-start;
	margin: 32px 0 0;
}
#main_content .post_content .arch-fv-btn {
	margin: 0;
}

/* 予約の欄 */
#main_content .post_content .arch-fv-reserve {
	box-sizing: border-box;
	max-width: 680px;
	margin: 96px auto 0;
	padding: 48px 32px;
	border: 1px solid #ddd;
	border-radius: 0;
	text-align: center;
}
#main_content .post_content .arch-fv-reserve-text {
	margin: 16px 0 0;
	padding: 0;
	font-size: 15px;
	line-height: 1.8;
	color: #333;
}
#main_content .post_content .arch-fv-tel {
	margin: 8px 0 32px;
	padding: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	font-size: 32px;
	font-weight: 600;
	letter-spacing: 0.06em;
	line-height: 1.5;
	white-space: nowrap;
}
#main_content .post_content .arch-fv-tel a,
#main_content .post_content .arch-fv-tel a:hover {
	color: #7d0000;
	text-decoration: none;
}
#main_content .post_content .arch-fv-btns {
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: 16px;
	margin: 0;
}

@media (max-width: 781px) {
	#main_content .post_content .arch-fv-closing {
		font-size: 17px;
	}
	#main_content .post_content .arch-fv-reserve {
		margin-top: 64px;
		padding: 32px 20px;
	}
	#main_content .post_content .arch-fv-tel {
		font-size: 28px;
	}
	#main_content .post_content .arch-fv-btns {
		flex-direction: column;
		gap: 12px;
	}
	#main_content .post_content .arch-fv-btns .arch-fv-btn {
		width: 100%;
	}
	#main_content .post_content .arch-fv-btns .arch-fv-btn .wp-block-button__link {
		display: block;
		box-sizing: border-box;
		width: 100%;
	}
}

/* LINEで予約（手順38）：本文の標準のボタンのブロック（追加CSSクラス arch-line-btn）と、スマホの下の固定ボタンのメニューの項目（CSSクラス arch-line-btn）。
   緑 #06C755、乗せると #05B34C、白い文字・太字。本文では電話番号が文字なので、高さ 48px・角丸 4px・左右 24px・16px で、電話番号の 12px 下に置く */
#main_content .post_content .wp-block-buttons:has(> .arch-line-btn) {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 12px 0;
}
#main_content .post_content .arch-line-btn {
	margin: 0;
}
#main_content .post_content .arch-line-btn .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 48px;
	padding: 0 24px;
	border: none;
	border-radius: 4px;
	background: #06C755;
	box-shadow: none;
	color: #FFFFFF;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
}
#main_content .post_content .arch-line-btn .wp-block-button__link:hover {
	background: #05B34C;
	color: #FFFFFF;
	opacity: 1;
}
/* 幅（手順39）：ボタンの枠（.wp-block-button）とリンクを、場所ごとの幅いっぱいにする */
#main_content .post_content .arch-line-btn .wp-block-button__link {
	width: 100%;
}
/* トップの RESERVATION：下の「初めての方へ」の枠と同じく、右の列の幅いっぱい */
#main_content .post_content .arch-intro .arch-line-btn {
	width: 100%;
}
/* 初めての方への予約の欄：電話番号の下を 12px にし、下のボタンの並びとの間は今までの 32px。
   幅は下の「メニュー・料金」「店舗情報・アクセス」に合わせる：782px 以上（横に2つ）は、欄の中身の幅を中身に合わせて（fit-content）2つを合わせた幅にし、LINE をその幅いっぱいに。
   781px 以下（縦に1つずつ・幅いっぱい）は、LINE も幅いっぱい */
#main_content .post_content .arch-fv-tel:has(+ .wp-block-buttons > .arch-line-btn) {
	margin-bottom: 12px;
}
#main_content .post_content .arch-fv-reserve .wp-block-buttons:has(> .arch-line-btn) {
	justify-content: center;
	margin: 0 0 32px;
}
#main_content .post_content .arch-fv-reserve .arch-line-btn {
	width: 100%;
}
@media (min-width: 782px) {
	#main_content .post_content .arch-fv-reserve:has(.arch-line-btn) > .wp-block-group__inner-container {
		width: fit-content;
		margin: 0 auto;
	}
}
/* お知らせ・コラムの下の案内（ブログパーツ news-guide）：文の 12px 下に、幅 100%・最大 360px */
#main_content .post_content .arch-news-guide p:has(+ .wp-block-buttons > .arch-line-btn) {
	margin-bottom: 0;
}
#main_content .post_content .arch-news-guide .arch-line-btn {
	width: 100%;
	max-width: 360px;
}
/* スマホの下の固定ボタン（手順39）：背景はほかの項目と同じ白のまま。上に吹き出しのアイコン（SVG 20px。functions.php で入れる）、下に文字。
   アイコンの箱（i）と文字（span）の大きさ・位置は SWELL の電話の項目と同じ指定のまま、色だけ #06C755 */
#fix_bottom_menu .menu-item.arch-line-btn a,
#fix_bottom_menu .menu-item.arch-line-btn a:hover {
	color: #06C755;
}
#fix_bottom_menu .menu-item.arch-line-btn i svg {
	display: block;
	width: 20px;
	height: 20px;
	margin: 0 auto;
}