@charset "UTF-8";

:root {
	--primary-color: #333;
	--secondary-color: #666;
	--accent-color: #F15A24;
	--button-color: #4D4D4D;
	--font-thin: 100;
	--font-medium: 500;
	--font-bold: 900;
}

/* ======= ベースのリセット ======= */

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
}

/* ======= 共通 ======= */

html {
	font-size: 14px;
}

body {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: var(--font-medium);
	background-color: #fff;
	color: var(--primary-color);
	max-width: 100vw;
	/* ビューポートの最大幅に制限 */
	overflow-x: hidden;
	/* 横スクロールを発生させない */
}

main {
	position: relative;
	top: var(--header-height);
}

a {
	color: #333;
	text-decoration: none;
}

input,
select {
	border-radius: 6px;
	border: 0.5px solid #666;
	padding: 20px;
	outline: none;
	line-height: 1;
}

textarea {
	border-radius: 6px;
	border: 0.5px solid #666;
	padding: 20px;
	outline: none;
	line-height: 1.4rem;
	width: 100%;
}

input:not(:placeholder-shown) {
	background-color: #FDF2EA;
}

input:autofill {
	background-color: #FDF2EA !important;
}

input:-webkit-autofill {
	background-color: #FDF2EA !important;
}

input::placeholder,
textarea::placeholder {
	color: #999;
}

/* チェックボックスを隠す */
input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	width: 20px !important;
	height: 20px !important;
	border: 0.5px solid #999;
	border-radius: 6px;
	display: inline-block;
	position: relative;
	cursor: pointer;
	margin: 0 !important;
	background-color: #FFF;
}

/* チェック状態のデザイン */
input[type="checkbox"]:checked {
	background-color: var(--accent-color);
	border-color: var(--accent-color);
}

/* チェックマーク（疑似要素で作成） */
input[type="checkbox"]::after {
	content: "";
	position: absolute;
	top: 1px;
	left: 6px;
	width: 5px;
	height: 10px;
	border: solid white;
	border-width: 0 3px 3px 0px;
	transform: rotate(40deg);
	display: none;
}

input[type="checkbox"]:checked::after {
	display: block;
}

.input_ver2,
.textarea_ver2 {
	background-color: #E6E6E6;
	border: none;
}

.isPC,
.isTab {
	display: none !important;
}

.PageTitleSub {
	display: block;
	font-size: 1.1rem;
	margin-top: 5px;
}

.PageTitleSub::before {
	content: "[";
	padding-right: 3px;
}

.PageTitleSub::after {
	content: "]";
	padding-left: 3px;
}

.hide {
	display: none;
}

.required {
	background-color: var(--accent-color);
	font-size: .8rem;
	line-height: .8rem;
	padding: 3px;
	color: #fff;
	display: inline-block;
	margin-left: 5px;
}

.tooltip-container {
	position: relative;
	display: inline-block;
	cursor: pointer;
}

.tooltip-trigger {
	border: 0.5px solid #999;
	background: none;
	font-size: .8rem;
	cursor: pointer;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	color: var(--primary-color);
}

.tooltip-content {
	position: absolute;
	top: 120%;
	left: -100%;
	width: 250px;
	background: var(--primary-color);
	color: white;
	padding: 10px;
	border-radius: 6px;
	display: none;
	/* デフォルトは非表示 */
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
	font-size: .9rem;
	line-height: 1.4rem;
	white-space: normal;
}

.tooltip-container.active .tooltip-content {
	display: block;
	opacity: 1;
	z-index: 1;
}

.form_2columns {
	display: flex;
	column-gap: 10px;
}

.width-100 {
	width: 100%;
}

.width-50 {
	width: 50%;
}

.width-30 {
	width: 33.333%;
}

.SubPage .list_note {
	font-size: .9rem;
	list-style: none;
	margin: 10px 0 20px;
}

.SubPage .list_note li {
	background-image: url("../img/icon-note.svg");
	background-position: left 2.5px;
	background-repeat: no-repeat;
	background-size: 15px;
	padding: 0 0 0 18px;
	line-height: 1.4rem;
	margin-bottom: 10px;
}

.SubPage .list_note li:last-child {
	margin-bottom: 0;
}

.fontThin {
	color: #000;
}

.h2_ProdcutName {
	word-break: break-word;
	overflow-wrap: break-word;
	max-width: 100%;
}

.padding_bothSide_SpTab {
	padding: 0 20px;
}

.btn_white {
	padding: 30px;
	font-size: 1rem;
	border-radius: 6px;
	line-height: 1.1;
	border: 0.5px solid #999;
	background-color: #E9E9E9;
	display: inline-block;
	text-align: center;
}

.btn_black {
	padding: 30px;
	font-size: 1rem;
	border-radius: 6px;
	line-height: 1.1;
	color: #fff;
	border: 0.5px solid var(--button-color);
	background-color: var(--button-color);
	display: inline-block;
	text-align: center;
}

.btn_orange {
	padding: 30px;
	font-size: 1rem;
	border-radius: 6px;
	line-height: 1.1;
	color: #fff;
	border: 0.5px solid var(--accent-color);
	background-color: var(--accent-color);
	display: inline-block;
	text-align: center;
}

.btn_download {
	padding: 30px 20px;
	font-size: 1rem;
	border-radius: 6px;
	line-height: 1.1;
	color: #fff;
	border: 0.5px solid var(--button-color);
	background-color: var(--button-color);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.btn_download::after {
	content: url("../img/icon-download-white.svg");
	display: inline-block;
	width: 24px;
}

.btn_white:active {
	background-color: #fff;
	cursor: pointer;
}

.btn_black:active {
	background-color: #000;
	cursor: pointer;
}

.btn_orange:active {
	background-color: #F7931E;
	cursor: pointer;
}

.btn_download:active {
	background-color: #000;
	cursor: pointer;
}

.toggle-container {
	display: flex;
	align-items: center;
	gap: 5px;
}

.ToggleBtn {
	position: relative;
	width: 40px;
	height: 24px;
}

.ToggleBtn input {
	opacity: 0;
	width: 0;
	height: 0;
}

.ToggleBtn_slider {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	border-radius: 24px;
	cursor: pointer;
	transition: 0.3s;
}

.ToggleBtn_slider:before {
	content: "";
	position: absolute;
	height: 18px;
	width: 18px;
	left: 3px;
	bottom: 3px;
	background-color: white;
	border-radius: 50%;
	transition: 0.3s;
}

input:checked+.ToggleBtn_slider {
	background-color: #333;
}

input:checked+.ToggleBtn_slider:before {
	transform: translateX(16px);
}

.ToggleBtn_label {
	font-size: .8rem;
	color: #333;
}

.pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	justify-content: space-between;
	margin: 20px;
}

.prev-page,
.next-page {
	display: flex;
	align-items: center;
	font-size: .9rem;
	column-gap: 5px;
}

.prev-page img,
.next-page img {
	width: 40px;
}

.pagination a {
	color: var(--secondary-color);
}

.pagination_text {
	display: none;
}

.prev-page.disabled,
.next-page.disabled {
	opacity: 0.2;
	pointer-events: none;
	cursor: default;
}

.pagination .pagination_text {
	white-space: nowrap;
}

.page-info {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .9rem;
	color: var(--secondary-color);
	column-gap: 8px;
}

.current-page {
	width: auto;
	max-width: 70px;
	text-align: center;
	padding: 15px;
	font-size: 1rem;
}

.indication::before {
	content: "";
	display: block;
	width: 8px;
	height: 8px;
	background-color: var(--accent-color);
	position: absolute;
	border-radius: 50%;
	right: 8px;
	top: 12px;
	border: 1px solid #FFF;
	aspect-ratio: 1 / 1;
}


input.current-page:not(:placeholder-shown) {
	background-color: #fff;
}



header {
	width: 100%;
	position: fixed;
	top: 0;
	z-index: 100;
	background-color: #fff;
	transition: box-shadow 0.3s ease;
}

header.scrolled {
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.top_container {
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}

.top_container h1 {
	margin: 0;
	line-height: 0;
}

.top_container h1 .logo {
	width: 100%;
}

.top_container .inner {
	width: 100%;
	max-width: 1536px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.tel_wrapper {
	display: flex;
	align-items: center;
}

/*** 電話番号表記 ***/

.top_container .tel {
	margin-top: 10px;
}

.top_container .tel div {
	font-size: 0.8rem;
	margin-left: 15px;
	display: inline-block;
}

.top_container .tel div p {
	font-weight: var(--font-thin);
	font-size: 1.5rem;
	margin-top: 5px;
}

.top_container .tel div span.small-text {
	font-size: 0.6em;
}

.bottom_container {
	/*background-color:#F2F2F2;*/
	margin: 0 auto;
	border-top: 0.5px solid #666;
	border-bottom: 0.5px solid #666;
}

.bottom_container .inner {
	width: 100%;
	max-width: 1536px;
	margin: 0 auto;
	display: flex;
	align-items: center;
}

.discontinued {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: normal;
	background-color: #e1e1e1;
	border-radius: 6px;
	line-height: 1.5;
	padding: 2px 9px;
	margin: 0 6px;
	position: relative;
	top: -2px;
}

/* ======= ヘッダーメニュー ======= */

.top_container nav {
	display: flex;
	align-items: center;
}

ul.global_menu {
	list-style: none;
	font-size: 0.8rem;
}

ul.global_menu li {
	text-align: center;
}

ul.global_menu li.indication {
	position: relative;
}

ul.global_menu li a {
	text-decoration: none;
}

ul.global_menu li a.icon {
	width: 45px;
	height: 45px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

ul.global_menu li a.text {
	display: inline-block;
	padding-top: 5px;
}

/* ======= サポートメニュー（ヘッダ） ======= */

ul.global_menu .hasSub {
	position: relative;
}

ul.global_menu .hasSub a {
	cursor: pointer;
}


ul.global_menu .hasSub .support_menu {
	display: none;
	position: absolute;
	top: 100%;
	right: -30px;
	background: #FFF;
	z-index: 10;
	list-style: none;
	border-radius: 6px;
	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
	border: 0.5px solid #999;
	min-width: 200px;
}

ul.global_menu .hasSub ul.support_menu li {
	text-align: left;
	margin: 0;
	white-space: nowrap;
	border-bottom: 0.5px solid #999;
}

ul.global_menu .hasSub ul.support_menu li:last-child {
	border-bottom: none;
}

ul.global_menu .hasSub ul.support_menu li a {
	display: block;
	padding: 15px 20px;
	font-size: 1rem;
}

ul.global_menu .hasSub ul.support_menu li a:hover {
	background-color: #f2f2f2;
	opacity: 1;
}

ul.global_menu .hasSub ul.support_menu li:first-child a {
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}

ul.global_menu .hasSub ul.support_menu li:last-child a {
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
}



/* ======= カテゴリメニュー（ヘッダ） ======= */

.category_menu {
	line-height: 1;
}

/* ボタンデザイン */
.dropdown-button {
	width: 100%;
	height: var(--bottom-container-height);
	max-height: 55px;
	border: none;
	text-align: left;
	cursor: pointer;
	color: #666;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: .9rem;
	line-height: 1;
	position: relative;
	background-color: #FFF;
	padding-left: 15px;
	padding-right: 30px;
	/* 画像がはみ出さないように調整 */
}

/* 疑似要素で背景画像を設定 */
.dropdown-button::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 6px;
	height: 6px;
	background: url("../img/icon-pulldown.svg") no-repeat center center;
	background-size: contain;
	transform: translateY(-50%) rotate(0deg);
	transition: transform 0.3s ease;
}

/* ドロップダウンが開いたときに背景画像を回転 */
.dropdown-button.open::after {
	transform: translateY(-50%) rotate(180deg);
}

.dropdown-button:hover {
	background-color: #f2f2f2;
}

/* ドロップダウンメニューのデザイン */
.dropdown-menu {
	position: absolute;
	background-color: #fff;
	color: #999;
	border: 0.5px solid #999;
	list-style: none;
	padding: 0;
	margin: 0;
	visibility: hidden;
	opacity: 0;
	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
	transform: translateY(-10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	top: var(--header-height);
	left: 0;
	width: 100%;
}

/* メニューが開いている状態 */
.dropdown-menu.open {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
	z-index: 10;
	overflow-y: auto;
	max-height: calc(100dvh - var(--header-height));

}

/* メニュー内の項目デザイン */
.dropdown-menu li {
	cursor: pointer;
	border-bottom: 0.5px solid #999;
	background-image: none;
}

.dropdown-menu li:hover {
	background: #f2f2f2;
}

/* メニューが閉じるときのアニメーション */
.dropdown-menu.closing {
	opacity: 0;
	transform: translateY(-10px);
}

/* ======= 絞り込みフィルター（ヘッダ） ======= */

a.btn_filter {
	align-items: center;
	white-space: nowrap;
	padding: 15px;
	font-size: .9rem;
	border-left: 0.5px solid #666;
	cursor: pointer;
	height: var(--bottom-container-height);
	max-height: 55px;
}

.filter_menu {
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
	position: absolute;
	border: 0.5px solid #666;
	width: 100%;
	top: var(--header-height);
	left: 0;
	background-color: #fff;
	min-height: calc(100dvh - var(--header-height));
	max-height: calc(100dvh - var(--header-height));
	overflow-y: auto;
}

/* `.btn_filter` がクリックされたとき（active クラスを付与） */
.btn_filter.active {
	opacity: 1;
}

/* `.filter_menu` が表示されるとき */
.btn_filter.active+.filter_menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.filter_menu .content_area {
	padding: 40px;
	/* max-height: 520px; */
	overflow: auto;
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.filter_menu .button_area {
	padding: 20px 40px 60px;
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: stretch;
	gap: 10px;
}

.button_area .btn_white,
.button_area .btn_black {
	min-width: 240px;
}

.filter_item {
	flex-basis: calc(50% - 40px);
}

.filter_title {
	font-size: 1rem;
	padding: 0 0 20px 0;
	margin-bottom: 20px;
	border-bottom: 0.5px solid #666;
}

.filter_option {
	list-style: none;
	font-size: .9rem;
	display: flex;
	flex-wrap: wrap;
	column-gap: 5px;
	row-gap: 10px;
}

.filter_option li {
	display: inline-block;
	background-color: #f2f2f2;
	border: 0.5px solid #999;
	border-radius: 6px;
	margin-right: 3px;
}

.filter_option li a {
	display: block;
	padding: 10px;
}

.filter_option li a.selected {
	background-color: #666;
	border-color: #666;
	border-radius: 6px;
	color: #fff;
}


.filter_option li a.selected:hover {
	opacity: 1;
	background-color: #333;
}


/* ======= キーワード検索フォーム（ヘッダ） ======= */

form.keyword_search {
	display: flex;
	justify-content: flex-end;
	border-left: 0.5px solid #666;
	height: var(--bottom-container-height);
	max-height: 55px;
}

form.keyword_search label {
	display: none;
}

form.keyword_search input {
	padding: 10px 15px;
	border: 0;
	border-radius: 0;
	width: 100%;
	font-size: .9rem;
}

form.keyword_search input::placeholder {
	font-size: .9rem;
	line-height: 1rem;
	color: #666;
}

button.btn_search {
	background-color: var(--primary-color);
	display: block;
	border: 0;
}

#keyword:valid {
	background-color: #fff;
	/* 入力があるなら淡い緑 */
	color: #999;
}


/* ======= スマホメニュー ======= */

.hamburger_wrapper {
	background-color: #fff;
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	border-top: 0.5px solid #666;
	top: var(--top-container-height);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

/* メニューが開いているとき */
.hamburger_wrapper.active {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	height: calc(100dvh - var(--top-container-height));
	overflow-y: auto;
}

.hamburger_menu {
	list-style: none;
	margin: 0;
	font-size: 1rem;
	font-weight: var(--font-medium);
}

ul.global_menu li .hamburger_menu li {
	border-bottom: 0.5px solid #666;
	margin: 0;
	position: relative;
}

/* 矢印アイコンのデフォルト */
ul.global_menu li .hamburger_menu li.dropdown>a {
	position: relative;
	padding-right: 30px;
	/* アイコンのスペース確保 */
}

/* 疑似要素でアイコンを設定 */
ul.global_menu li .hamburger_menu li.dropdown>a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 8px;
	height: 8px;
	background: url("../img/icon-down.svg") no-repeat center center;
	background-size: contain;
	transform: translateY(-50%) rotate(0deg);
	transition: transform 0.3s ease;
}

/* 開いたときに矢印を反転（回転） */
ul.global_menu li .hamburger_menu li.dropdown>a.open::after {
	transform: translateY(-50%) rotate(180deg);
}

.hamburger_menu li a {
	display: block;
	padding: 20px;
	text-align: left;
}

.hamburger_menu_dropdown {
	background-color: #f2f2f2;
	font-size: .8rem;
	font-weight: var(--font-medium);
	border-top: 0.5px solid #666;
	list-style: none;
	display: none;
	opacity: 0;
	transform: translateY(-5px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	grid-template-columns: repeat(2, 1fr);
}

/* メニューが開いている状態 */
.hamburger_menu_dropdown.open {
	opacity: 1;
	transform: translateY(0);
}

.hamburger_menu_dropdown li:nth-child(odd) {
	border-right: 0.5px solid #666;
}

ul.global_menu li .hamburger_menu li.bottom-child {
	border-bottom: none;
}

.hamburger_menu_dropdown li a {
	padding: 15px 20px;
	color: var(--primary-color);
}

.hamburger_menu_dropdown li a::before {
	content: "-";
	margin-right: 8px;
}

.hamburger_tel {
	padding: 30px 20px;
}

.hamburger_tel dt {
	font-size: .8rem;
	margin-bottom: 5px;
}

.hamburger_tel dd {
	font-size: 1.8rem;
	font-weight: var(--font-thin);
	margin-bottom: 20px;
	color: #000;
}

.hamburger_tel dd:last-child {
	margin-bottom: 0px;
	font-size: 1.5rem;
}

.hamburger_tel dd a {
	color: #000;
}

.hamburger_tel dd span {
	font-size: 1.4rem;
}

.hamburger_contact {
	display: inline-block;
	background-color: var(--button-color);
	border-radius: 6px;
	width: 60%;
	max-width: 280px;
	margin-bottom: 40px;
}

.hamburger_contact a {
	display: inline-block;
	padding: 30px;
	color: #fff;
}

.hamburger_guest {
	background-color: var(--primary-color);
	padding: 20px;
	display: flex;
	column-gap: 12px;
	list-style: none;
	position: sticky;
	bottom: 0;
}

ul.global_menu li .hamburger_guest li {
	width: 50%;
	margin: 0;
}

.hamburger_guest li img {
	height: 18px;
}

.hamburger_guest li a {
	background-color: #fff;
	padding: 20px;
	line-height: 1;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}


/* ハンバーガーメニューアイコン */
.global_menu .icon img {
	transition: transform 0.3s ease;
}

/* メニューが開いているとき（アイコンが×に変化） */
.global_menu .icon img.active {
	transform: rotate(180deg);
}

/* ======= トップページ ======= */

.home_mainImg {
	width: 100%;
	height: calc(100vh - 325px);
	background-image: url("../img/img_main_sp.jpg");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
}

.catchy_phrase {
	margin: 0;
	padding: 0;
	color: #fff;
	text-align: center;
	font-weight: var(--font-thin);
	text-shadow: 0 0 10px rgba(3, 3, 3, 0.8),
		0 0 20px rgba(3, 3, 3, 0.6),
		0 0 30px rgba(3, 3, 3, 0.4);
}

/* ======= 共通エリア ======= */

.wrapper_common_area {
	width: 100%;
	padding-bottom: 100px;
}

.section_basic {
	padding-top: 90px;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 0 auto;
}

.h2_common {
	font-weight: var(--font-thin);
	color: #000;
}

.h3_desc {
	font-weight: var(--font-medium);
	color: var(--secondary-color);
}

/* ======= 共通エリア（横スクロール） ======= */

.scroll_wrapper {
	position: relative;
	width: 100%;
	/* overflow-x: hidden; */
	/* overflow-y: hidden; */
	/* white-space: nowrap; */
	scrollbar-width: thin;
	scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
	display: flex;
	justify-content: center;
	max-width: 1536px;
}

.scrollable_content {
	display: flex;
	gap: 10px;
	padding: 0 10px 20px;
	overflow: auto;
}

.item {
	display: flex;
	flex-direction: column;
	align-items: center;
	word-break: break-word;
	overflow-wrap: break-word;
}

/* ======= 共通リスト（商品情報） ======= */

.item_pic_common {
	background-color: #f2f2f2;
	line-height: 0;
	width: 100%;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	margin-bottom: 20px;
}

.item_pic_common img {
	width: 100%;
	height: auto;
}

.h3_maker {
	font-size: .9rem;
	font-weight: var(--font-medium);
	color: var(--primary-color);
	text-align: center;
}

.h2_product_number {
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	color: #000;
	margin: 10px 0;
	text-align: center;
}

.h3_category {
	font-size: .8rem;
	font-weight: var(--font-medium);
	color: var(--primary-color);
	text-align: center;
}

.price {
	font-size: 1.1rem;
	font-weight: var(--font-bold);
	color: var(--accent-color);
	margin: 20px 0 10px 0;
}

.without_tax::after {
	content: "（税抜）";
	font-size: .7rem;
	font-weight: var(--font-medium);
}

.icon_fav_10 {
	width: 24px;
	height: auto;
}


.link_item:hover {
	opacity: 1;
}

.btn_favorite,
.btn_trash {
	cursor: pointer;
	border: none;
	background-color: transparent;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* ======= 共通リスト（スクロールバー） ======= */


/* スクロールバー全体のスタイル */
.scroll_wrapper::-webkit-scrollbar {
	width: 20px;
	/* スクロールバーの幅 */
	height: 20px;
	/* 水平スクロールバーの高さを明示 */
}

/* スクロールバーのつまみ部分 */
.scroll_wrapper::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.3);
	/* 色 */
	border-radius: 2px;
	/* 角を丸く */
}

/* スクロールバーの背景 */
.scroll_wrapper::-webkit-scrollbar-track {
	background: #f1f1f1;
	/* 背景色 */
}


/* ======= 共通リスト（スクロールボタン） ======= */

.btn_scroll {
	list-style: none;
	width: 100%;
	max-width: 1630px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	justify-content: space-between;
	padding: 0 10px;
}

.btn_scroll .left a,
.btn_scroll .right a {
	display: block;
}


.btn_scroll img {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

/* ======= 共通エリア（カテゴリ・メーカー・設置場所・最新トピックス） ======= */

.table_category,
.table_maker,
.table_use {
	list-style: none;
	width: 100%;
	max-width: 1536px;
	display: grid;
	margin-bottom: 60px;
}

.table_category li,
.table_maker li,
.table_use li {
	text-align: center;
	line-height: 1.2rem;
}

.table_category li a,
.table_maker li a,
.table_use li a {
	display: block;
	color: var(--secondary-color);
}

.table_category li a img {
	width: 90%;
	height: auto;
}

.table_maker li a img {
	width: 90%;
	height: auto;
}

.table_use li a img {
	width: 90%;
	height: auto;
	border-radius: 6px;
}

.table_category li a::after,
.table_use li a::after {
	display: block;
}

.spotlight::after {
	content: "スポットライト";
}

.downlight::after {
	content: "ダウンライト";
}

.baselight::after {
	content: "ベースライト";
}

.exterior::after {
	content: "エクステリア";
}

.bracket::after {
	content: "ブランケット";
}

.pendant::after {
	content: "ペンダント";
}

.ceiling::after {
	content: "シーリング";
}

.ceilingfan::after {
	content: "シーリングファン";
}

.ceilingSmall::after {
	content: "小型シーリング";
}

.kitchen::after {
	content: "キッチンライト";
}

.indirect::after {
	content: "間接照明";
}

.chandelier::after {
	content: "シャンデリア";
}

.led::after {
	content: "LED電球・ランプ";
}

.bathroom::after {
	content: "トイレ・浴室・洗面所";
}

.emergency::after {
	content: "非常・誘導・防犯灯";
}

.rail::after {
	content: "配線ダクトレール";
}

.step::after {
	content: "フットライト";
}

.standlight::after {
	content: "スタンドライト";
}

.deskStand::after {
	content: "デスクスタンド";
}

.illumination::after {
	content: "イルミネーション";
}

.remote::after {
	content: "リモコン";
}

.dimmer::after {
	content: "調光器";
}

.option::after {
	content: "オプション";
}

.fan::after {
	content: "換気扇";
}

.ac::after {
	content: "エアコン";
}

.detector::after {
	content: "火災報知機・煙探知機";
}

.airPurifiers::after {
	content: "空気清浄機";
}

.doorphone::after {
	content: "インターホン・ドアホン";
}


.office::after {
	content: "オフィス・事務所";
}

.shop::after {
	content: "店舗・飲食店";
}

.shoppingmall::after {
	content: "ショッピングモール";
}

.school::after {
	content: "学校・教育機関";
}

.hospital::after {
	content: "病院・医療機関";
}

.hotel::after {
	content: "宿泊施設（ホテル）";
}

.jphotel::after {
	content: "宿泊施設（旅館）";
}

.aprt::after {
	content: "マンション・集合住宅";
}

.sports::after {
	content: "スポーツ施設";
}

.livingroom::after {
	content: "リビングルーム";
}

.badroom::after {
	content: "寝室";
}

.jproom::after {
	content: "和室";
}

.kitchin::after {
	content: "キッチン・台所";
}

.dining::after {
	content: "ダイニング";
}

.hall::after {
	content: "廊下";
}

.hall::after {
	content: "廊下";
}

.entrance::after {
	content: "玄関";
}

.Bathroom_Washroom::after {
	content: "浴室・洗面所";
}

.toilet::after {
	content: "トイレ";
}

.garden::after {
	content: "庭・ガーデン";
}

.table_topoic {
	max-width: 1536px;
}

.table_topoic a {
	text-decoration: underline;
}

.link_topic_Tab,
.link_topic_PC {
	align-items: center;
	font-size: .9rem;
	line-height: .9rem;
}

.link_topic_PC {
	position: absolute;
	right: 0;
	top: 10px;
}

.link_topic_Tab::before,
.link_topic_PC::before {
	content: url("../img/icon-list-item.svg");
	width: 15px;
	margin-right: 5px;
}



/* ======= フッター ======= */


footer {
	background-color: #f2f2f2;
	padding: 60px 20px 40px;
	margin-top: var(--header-height);
}

.wrapper_footer_top {
	text-align: center;
	max-width: 1536px;
	margin: 0 auto;
	padding-bottom: 30px;
}

.wrapper_footer_top_left {
	margin-bottom: 40px;
}


.wrapper_footer_bottom {
	max-width: 1536px;
	margin: 0 auto;
	text-align: center;
}

.footer_h3 {
	font-weight: var(--font-bold);
	margin-bottom: 20px;
	font-size: 1.2rem;
}

.footer_text {
	font-size: .9rem;
	line-height: 1.3rem;
	text-align: left;
	margin-bottom: 30px;
}

.footer_text a {
	text-decoration: underline;
}


.footer_button {
	display: inline-block;
	background-color: var(--button-color);
	border-radius: 6px;
	color: #fff;
	padding: 20px;
	font-size: .8rem;
}

.width50 {
	width: 50%;
}

.width200 {
	width: 200px;
}

.wrapper_footer_buttons {
	margin-bottom: 40px;
	display: flex;
	gap: 10px;
	justify-content: center;
}

.footer_menu {
	margin-bottom: 30px;
	text-align: left;
}

.footer_menu_title {
	font-weight: var(--font-bold);
	border-bottom: 0.5px solid #999;
	margin-bottom: 15px;
}

.footer_menu_title a {
	display: block;
	padding-bottom: 15px;
	position: relative;
}

.footer_menu_title a::after {
	content: "";
	position: absolute;
	top: 8px;
	right: 10px;
	width: 10px;
	height: 10px;
	background: url(../img/icon-down.svg) no-repeat center center;
	background-size: contain;
}

.footer_menu_list {
	font-size: .9rem;
	margin: 0 0 15px 15px;
	line-height: 1.5rem;
	display: none;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

/* アコーディオンが開いたとき */
.footer_menu_list.open {
	opacity: 1;
	transform: translateY(0);
}

/* フッターメニューのタイトルの矢印（背景画像の回転） */
.footer_menu_title a::after {
	content: "";
	position: absolute;
	top: 6px;
	right: 10px;
	width: 10px;
	height: 10px;
	background: url(../img/icon-down.svg) no-repeat center center;
	background-size: contain;
	transition: transform 0.3s ease;
}

/* `.footer_menu_title` に `open` クラスが付いたときに矢印を回転 */
.footer_menu_title.open a::after {
	transform: rotate(180deg);
}

.footer_bottom_up {
	display: none;
}


.footer_h1 {
	text-align: center;
	margin: 0 0 20px;
}

.footer_h1 a {}

.footer_h1 a img {
	width: 70%;
	max-width: 240px;
}

.footer_businessInfo {
	text-align: center;
	margin-bottom: 30px;
}

.footer_businessInfo dt {
	font-size: .8rem;
	margin-bottom: 5px;
}

.footer_businessInfo dd {
	font-size: 1.5rem;
	font-weight: var(--font-thin);
	color: #000;
	margin-bottom: 20px;
}

.footer_businessInfo dd:last-child {
	margin-bottom: 0;
}


.footer_bottom_down ul {
	list-style: none;
}

.list_subMenu {
	font-size: .8rem;
	margin-bottom: 30px;
}

.list_subMenu li {
	margin-bottom: 10px;
}

.list_subMenu li:last-child {
	margin-bottom: 0;
}

.list_SNS {
	display: flex;
	justify-content: center;
	margin-bottom: 30px;
	gap: 4px;
}

.list_SNS li {
	width: 30px;
	height: 30px;
	border-radius: 50%;
}

.list_SNS li a {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.list_SNS li img {
	width: 60%;
}

.list_SNS li img.logo_x {
	width: 48%;
}

.list_creditCard {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
}

.list_creditCard li {}

.list_creditCard img {
	height: 16px;
}

.list_creditCard img.logo_visa {
	height: 12px;
}

.wrapper_footer_bottom_left {
	margin-bottom: 40px;
}

.wrapper_footer_bottom_right {
	font-size: .7rem;
}

/* ======= モーダルウインドウ ======= */

.modal_window_body {
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: -1;
	width: 100%;
	height: 100%;
	padding: 40px 15px;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease-in-out;
}

.modal_window_main {
	background-color: #fff;
	border-radius: 6px;
	padding: 40px 30px;
	position: relative;
	width: 100%;
	max-height: 100%;
	display: flex;
	flex-direction: column;
	overflow: auto;
	transform: none;
	opacity: 0;
}

/* モーダルが開いた時の状態 */
.modal_window_body.active {
	opacity: 1;
	visibility: visible;
	z-index: 999;
}

.modal_window_body.active .modal_window_main {
	opacity: 1;
}

/* 閉じるボタン */
.modal_window_close {
	position: absolute;
	width: 15px;
	height: auto;
	right: 15px;
	top: 15px;
}

.modal_h2 {
	margin-bottom: 20px;
	line-height: 1.2;
}

.modal_h2_body {
	font-size: 1.1rem;
	line-height: 1.6rem;
	margin-bottom: 1.5rem;
}

.modal_h3 {
	font-size: 1.1rem;
	line-height: 1.4rem;
	margin-bottom: 1.5rem;
	padding: 3px 10px;
	border-left: 6px solid #333;
	display: inline-block;
	margin-top: 1rem;
}

.modal_h4 {
	font-size: 1rem;
	line-height: 1.4rem;
	margin-bottom: 1rem;
	display: block;
}

.modal_p {
	margin-bottom: 1.5rem;
	;
	line-height: 1.4rem;
}



.modal_window_main .list_note {
	margin: 0 0 1.5rem 0;
}

.modal_window_main .list_ReturnFees {
	margin: 0 0 1.5rem 0;
}

.modal_window_main .list_ReturnNG {
	margin: 0 0 1.5rem 20px;
}

.modal_window_main .emphasize {
	font-weight: var(--font-bold);
	color: var(--accent-color);
}

.modal_form_login {
	margin-bottom: 40px;
}

.modal_form_login input {
	width: 100%;
	margin-bottom: 10px;
}

.wrapper_autologin {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 1.5rem;
}

.list_note {
	margin: 15px 0;
	font-size: .8rem;
	line-height: 1.2rem;
	list-style: none;
}


.list_note li {
	margin-bottom: 8px;
	background-image: url("../img/icon-note.svg");
	background-position: left 2.5px;
	background-repeat: no-repeat;
	background-size: 15px;
	padding: 0 0 0 18px;
	line-height: 1.4rem;
}

.list_note li:last-child {
	margin-bottom: 0;
}

.list_note a {
	text-decoration: underline;
}

.form_EditAddress .list_note li:last-child {
	margin-bottom: 0;
}

.btn_login,
.btn_register,
.btn_GoNonMember {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row-reverse;
	padding: 30px 20px;
}


.btn_login::before {
	content: url("../img/icon-login-white.svg");
	display: inline-block;
	width: 20px;
}

.btn_register::before {
	content: url("../img/icon-register.svg");
	display: inline-block;
	width: 20px;
}

.btn_GoNonMember::before {
	content: url("../img/icon-go-black.svg");
	display: inline-block;
	width: 22px;
}


.nonmember {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
}

.dl_FaxTel {
	margin-bottom: 1.5rem;
}

.dl_FaxTel dt {
	font-weight: var(--font-bold);
	margin-bottom: 3px;
	font-size: .9rem;
}

.dl_FaxTel dd {
	display: inline-block;
	font-size: 2rem;
	font-weight: var(--font-thin);
	margin-bottom: 20px;
}

.dl_FaxTel dd:last-child {
	margin-bottom: 0;
}

.dl_FaxTel dd span {
	font-size: 1rem;
}


/* ======= パンくずリスト ======= */

.wrapper_breadcrumb {
	background-color: #e6e6e6;
	padding: 15px 0 15px 20px;
	width: 100%;
	overflow: auto;
	white-space: nowrap;
	/* 横スクロールを有効にする場合 */
	-ms-overflow-style: none;
	/* IE, Edge */
	scrollbar-width: none;
	/* Firefox */
}

.wrapper_breadcrumb::-webkit-scrollbar {
	display: none;
	/* Chrome, Safari */
}

.breadcrumb {
	list-style: none;
	display: flex;
	font-size: .8rem;
	max-width: 1536px;
	margin: 0 auto;
}

.breadcrumb li {
	margin-left: 10px;
	white-space: nowrap;
	color: #999;
}

.breadcrumb li:first-child {
	margin-left: 0;
}

.breadcrumb li:first-child::before {
	content: none;
}

.breadcrumb li::before {
	content: "＞";
	color: #999;
	margin-right: 10px;
	font-weight: var(--font-thin);
}

.breadcrumb li a {}


/* ======= コンテンツ ======= */

.wrapper_content {}

.wrapper_PageTitle {
	margin: 0 auto;
	max-width: 1536px;
	padding: 40px 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.PageTitle {
	font-size: 1.5rem;
	display: inline-block;
	margin: 0;
	color: #000;
}

.wrapper_2columns_2rows {
	margin: 0 auto;
	max-width: 1536px;
	display: flex;
	flex-direction: column-reverse;
	justify-content: flex-end;
}

.wrapper_2columns_2rows_UpsideDown {
	margin: 0 auto;
	max-width: 1536px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.SubPage .column_right {
	display: none;
}

.column_left {
	width: 100%;
}

.column_right {
	width: 100%;
}


/* ======= マイページ ======= */

.Mypage {
	margin-bottom: 100px;
}

.myPage_greeting {
	font-size: 1rem;
}

.myPage_greeting::before {
	content: "こんにちは";
	padding-right: 5px;
	font-size: .7rem;
}

.myPage_greeting::after {
	content: "様";
	padding-left: 5px;
	font-size: .7rem;
}

.myPage_menu {
	background-color: #999;
	color: #fff;
	position: relative;
}

.myPage_menu_title {
	font-weight: var(--font-thin);
	font-size: 1.2rem;
	padding: 20px;
	position: relative;
	cursor: pointer;
	padding-right: 25px;
	/* アイコンのスペースを確保 */
}

.myPage_menu_title::after {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 15px;
	width: 10px;
	height: 10px;
	background: url(../img/icon-down-white.svg) no-repeat center center;
	background-size: contain;
	transition: transform 0.3s ease;
	/* 回転アニメーション */
}

/* ▼ アイコンの回転（開いたとき） */
.myPage_menu.open .myPage_menu_title::after {
	transform: translateY(-50%) rotate(180deg);
}

.myPage_menu dd {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: max-height 0.3s ease, opacity 0.3s ease;
}

.myPage_menu.open dd {
	max-height: 200px;
	/* 適切な高さに調整 */
	opacity: 1;
	border-top: 0.5px solid #fff;
}

.myPage_menu dd a {
	color: #fff;
	display: block;
	padding: 15px 20px;
}

.myPage_menu dd a.active {
	background-color: #666;
}

.myPage_menu_title_pc {
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	padding-bottom: 25px;
	border-bottom: 2px solid #666;
	line-height: 1rem;
}

.myPage_menu_pc dd {
	border-bottom: 0.5px solid #999;
}

.myPage_menu_pc dd a {
	display: flex;
	align-items: center;
	padding: 18px 10px;
}

.myPage_menu_pc dd a::before {
	content: url("../img/icon-list-item.svg");
	width: 18px;
	height: 18px;
	display: inline-block;
	margin-right: 6px;
}

.myPage_menu_pc dd a.active {
	opacity: 0.2;
}

.h2_MypgeTop {
	font-size: 1.2rem;
	font-weight: var(--font-thin);
	color: #000;
	padding: 0 20px 20px;
	border-bottom: 0.5px solid #999;
}

.table_LatestNews {
	padding: 20px;
	border-bottom: 0.5px dashed #999;
}

.table_LatestNews a {
	text-decoration: underline;
}

.table_LatestNews a:active {
	text-decoration: none;
}

.news_date {
	font-weight: var(--font-bold);
	display: inline-block;
	color: var(--secondary-color);
}

.news_category {
	display: inline-block;
	color: var(--secondary-color);
	margin-left: 6px;
}

.news_category::before {
	content: " - ";
	margin-right: 6px;
}

.news_text {
	margin-top: 10px;
	line-height: 1.6rem;
}

.wrapper_buttons_MypageTop {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 30px 0 60px;
}

.wrapper_buttons_MypageTop a {
	padding: 20px;
	font-size: .9rem;
	line-height: 1rem;
}

.MypageMenu_link {
	display: block;
	border-bottom: 0.5px solid #999;
}

.MypageMenu_link .inner {
	display: flex;
	flex-direction: column;
	padding: 20px;
}


.MypageMenu_link .inner h3 {
	font-size: 1rem;
	font-weight: var(--font-bold);
	margin-bottom: 10px;
}

.MypageMenu_link .inner p {
	color: var(--secondary-color);
	font-size: .9rem;
	line-height: 1.4rem;
}



/* ======= マイページ（お気に入り） ======= */

.Mypage_Favorite {
	margin-bottom: 100px;
}

/* ======= マイページ（注文履歴） ======= */

.Mypage_History {
	margin-bottom: 100px;
}

.wrapper_HistorySearch {
	margin-bottom: 30px;
}

.form_Search_History {
	background-color: #F2F2F2;
	display: flex;
	justify-content: center;
	align-items: stretch;
}

.form_Search_History input {
	width: 100%;
	padding: 15px;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-top: 0.5px solid #999;
	border-bottom: 0.5px solid #999;
	border-left: 0.5px solid #999;
}

.form_Search_History button {
	width: 80px;
	padding: 15px;
	white-space: nowrap;
	border: none;
	background-color: var(--button-color);
	color: #fff;
	border-top: 0.5px solid var(--button-color);
	border-bottom: 0.5px solid var(--button-color);
	border-right: 0.5px solid var(--button-color);
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
	font-size: .9rem;
	line-height: .9rem;
	cursor: pointer;
}

.form_Search_History button:active {
	background-color: var(--primary-color);
}

.OrderHistory {
	padding: 30px 20px;
	border-bottom: 0.5px solid #999;
}

.OrderHistory .head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;
}

.OrderHistory .head .right {
	display: flex;
	align-items: stretch;
	column-gap: 10px;
	position: relative;
}

.OrderHistory h3 {
	font-size: .8rem;
	font-weight: var(--font-thin);
	color: #000;
	margin-bottom: 10px;
}

.orderNum {
	font-size: 1.2rem;
	font-weight: var(--font-bold);
}

.btn_KebabMenu {
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0.5px solid #999;
	border-radius: 6px;
	background-color: #FFF;
	cursor: pointer;
}

.btn_KebabMenu img {
	width: 5px;
}

.btn_OrderDetail {
	display: none;
	padding: 15px;
	background-color: var(--button-color);
	color: #fff;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
	font-size: 1rem;
}

.btn_KebabMenu:active {
	background-color: #f2f2f2;
	opacity: 1;
}

.btn_OrderDetail:active {
	background-color: #333;
	opacity: 1;
}

.OrderHistory .middle {
	margin-bottom: 30px;
}

.OrderHistory .middle .left {
	width: 100%;
}

.OrderHistory .middle p {
	margin-bottom: 30px;
	line-height: 1.6rem;
	font-size: 1.1rem;
}


.list_BreakDown_order {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	margin: 0 0 10px;
	width: 100%;
}

.list_BreakDown_order dt {
	width: 50%;
	padding: 10px 0;
	white-space: nowrap;
}

.list_BreakDown_order dt .quantity {
	font-weight: var(--font-thin);
	color: #000;
	margin-left: 8px;
}

.list_BreakDown_order dt .quantity::before {
	content: "×";
	margin-right: 8px;
}

.list_BreakDown_order dd {
	width: 50%;
	text-align: right;
	padding: 10px 0;
	font-size: 1rem;
	white-space: nowrap;
}

.list_BreakDown_order dd::after {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	width: 100%;
	height: 0.5px;
	border-top: 0.5px dashed #999;
	margin-top: 10px;
}

.list_BreakDown_order dt:last-of-type {
	font-weight: var(--font-bold);
}

.list_BreakDown_order dd:last-child {
	font-weight: var(--font-bold);
	font-size: 1.1rem;
}

.list_BreakDown_order dd:last-child::before {
	content: "税込";
	font-size: .8rem;
	font-weight: var(--font-medium);
	color: #000;
	margin-right: 5px;
}

.list_BreakDown_order dd:last-child::after {
	content: none;
}

.list_BreakDown_order .SubTotal {
	padding-top: 20px;
}


.OrderHistory .bottom .ListArea {
	width: calc(100% + 20px);
	overflow-x: auto;
	display: flex;
	column-gap: 30px;
	padding-bottom: 5px;
}

.wrapper_OrderedProduct a {
	display: flex;
	align-items: flex-start;
	width: auto;
}

.wrapper_OrderedProduct figure {
	width: 80px;
	margin: 0 10px 0 0;
}

.wrapper_OrderedProduct .inner {
	width: auto;
}

.wrapper_OrderedProduct .inner .h2_ProdcutName {
	font-size: 1.2rem;
	line-height: 1.5rem;
	margin-bottom: 15px;
}

.wrapper_OrderedProduct .inner h3 {
	text-align: left;
	font-weight: var(--font-medium);
	white-space: nowrap;
}

.wrapper_OrderedProduct .inner .h2_ProdcutName {
	font-size: 1.2rem;
	line-height: 1.5rem;
	margin-bottom: 15px;
	white-space: nowrap;
}

.wrapper_OrderedProduct .inner h3_maker {
	margin-bottom: 15px;
}

.btn_OrderDetail_sp {
	display: block;
	text-align: center;
	padding: 30px;
	background-color: var(--button-color);
	color: #fff;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
	font-size: 1rem;
	margin-top: 30px;
}

.shipping {
	font-weight: var(--font-bold);
	color: var(--accent-color);
}

.shipped {
	display: flex;
	align-items: center;
}

.shipped::after {
	content: url("../img/icon-shipped.svg");
	display: inline-block;
	width: 20px;
	margin-left: 6px;
	line-height: 1;
}

.list_kebab {
	display: none;
	background-color: #fff;
	position: absolute;
	top: 50px;
	list-style: none;
	right: -10%;
	min-width: 180px;
	z-index: 10;
	border-radius: 6px;
	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
	border: 0.5px solid #999;
	margin-top: 5px;
}

.list_kebab.active {
	display: block;
}

.list_kebab li {
	border-bottom: 0.5px solid #999
}

.list_kebab li a {
	display: block;
	padding: 15px;
}

.list_kebab li a:active {
	background-color: #f2f2f2;
	opacity: 1;
}


.list_kebab li:nth-of-type(1) a:active {
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}

.list_kebab li:last-child a:active {
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
}


/* ======= マイページ（注文内容の詳細） ======= */

.Mypage_History_detail {
	margin-bottom: 100px;
}

.Mypage_History_detail .OrderHistory {
	border-top: 0.5px solid #999;
	border-bottom: none;
}

.Mypage_History_detail .OrderHistory .middle {
	margin-bottom: 0;
}

.OrderHistory .middle .address {
	display: block;
	font-size: 1rem;
	margin-top: 8px;
}

.wrapper_paymentInfo {
	display: flex;
	flex-wrap: wrap;
	column-gap: 30px;
}

.wrapper_shippingInfo {
	display: flex;
	flex-wrap: wrap;
	column-gap: 30px;
}

.wrapper_OrderAdditional {
	border-bottom: 0.5px solid #999;
	margin-bottom: 30px;
}


.list_receipt,
.list_return,
.list_ordered {
	list-style: none;
}

.wrapper_OrderAdditional dt {
	font-size: 1.2rem;
	font-weight: var(--font-thin);
	color: #000;
	padding: 30px 20px;
	border-top: 0.5px solid #999;
	display: flex;
	justify-content: space-between;
	cursor: pointer;
}

.wrapper_OrderAdditional dt:active {
	opacity: 0.5;
}

.wrapper_OrderAdditional dt::after {
	content: url(../img/icon-down.svg);
	display: inline-block;
	width: 12px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.wrapper_OrderAdditional dt.active::after {
	transform: rotate(-180deg);
}

.wrapper_OrderAdditional dd {
	font-size: 1rem;
	padding: 0;
	border-top: 0.5px solid #999;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease-out, transform 0.3s ease-out, padding 0.3s ease-out;
	height: 0;
	visibility: hidden;
	overflow: hidden;
}

.wrapper_OrderAdditional dd.open {
	opacity: 1;
	transform: translateY(0);
	padding: 20px 0;
	height: auto;
	visibility: visible;
}


.OrderedProduct {
	padding: 30px 20px;
	display: flex;
	flex-direction: column;
	position: relative;
	border-top: 0.5px solid #999;
}

.OrderedProduct:first-of-type {
	padding: 10px 20px 30px;
	border-top: none;
}

.OrderedProduct:last-of-type {
	padding: 30px 20px 10px;
}

.OrderedProduct .wrapper_batch_checkbox {
	margin-bottom: 20px;
	padding: 0;
}

.OrderedProduct .checkbox_label {
	display: block;
	width: 100%;
	cursor: pointer;
	user-select: none;
}

.link_product_InOrderDetail {
	width: 100%;
}

.link_product_InOrderDetail:active {
	opacity: 1;
}

.link_product_InOrderDetail:active .h2_ProdcutName,
.link_product_InOrderDetail:active .h3_maker,
.link_product_InOrderDetail:active .h3_category {
	text-decoration: underline;
}

.link_product_InOrderDetail:active .item_pic_common {
	opacity: 0.5;
}

.OrderedProduct .wrapper_InfoImg {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
}

.OrderedProduct figure {
	max-width: 80px;
	margin: 0 0 20px 20px;
}

.OrderedProduct .wrapper_InfoImg .Info {
	width: 100%;
}


.OrderedProduct .wrapper_InfoImg .Info .wrapper_TitleFav {
	margin: 0;
}

.OrderedProduct .wrapper_InfoImg .Info .h3_maker,
.OrderedProduct .wrapper_InfoImg .Info .h3_category {
	text-align: left;
	display: inline-block;
	font-size: .9rem;
}

.OrderedProduct .wrapper_InfoImg .Info .h3_category::before {
	content: "（";
}

.OrderedProduct .wrapper_InfoImg .Info .h3_category::after {
	content: "）";
}

.OrderedProduct .h2_ProdcutName {
	font-size: 1.4rem;
	line-height: 1.8rem;
	margin: 20px 0;
}

.OrderedProduct .retail .NetPrice,
.OrderedProduct .retail .GrossPrice {
	font-size: 1.2rem;
}

.OrderedProduct .GrossPrice {
	color: var(--primary-color);
	margin-left: 15px;
}

.OrderedProduct .NetPrice::before {
	content: "税抜";
	font-size: .8rem;
	font-weight: var(--font-medium);
	padding-right: 3px;
}

.OrderedProduct .GrossPrice::before {
	content: "税込";
	font-size: .8rem;
	font-weight: var(--font-medium);
	padding-right: 3px;
}

.OrderedProduct .GrossPrice::after {
	content: none;
}

.OrderedProduct .wrapper_price {
	margin-bottom: 30px;
}

.OrderedProduct .btn_review {
	margin-bottom: 30px;
	font-size: .9rem;
	display: flex;
}

.OrderedProduct .btn_review::before {
	content: url("../img/icon-review.svg");
	display: inline-block;
	width: 20px;
	margin-right: 6px;
}

.OrderedProduct .btn_review:active {
	text-decoration: underline;
	opacity: 1;
}

.OrderedProduct .wrapper_ActionBtn {
	display: flex;
	align-items: flex-start;
	column-gap: 8px;
	margin: 0;
}

.OrderedProduct .quantity-container {
	padding: 14px 8px;
	margin: 0;
	min-height: 50px;
}

.OrderedProduct .quantity-button {
	width: 20px;
	height: 20px;
	font-size: 1.2rem;
}

.OrderedProduct .quantity-value {
	width: 50px;
}

.OrderedProduct .estimate_button,
.OrderedProduct .cart_button {
	padding: 15px;
	min-height: 50px;
	font-size: .8rem;
	white-space: nowrap;
	flex-direction: row;
	justify-content: center;
}

.OrderedProduct .estimate_button::before,
.OrderedProduct .cart_button::before {
	content: none;
}

.OrderedProduct .estimate_button {
	margin: 0;
}

.wrapper_OrderButton {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	gap: 10px;
}

.wrapper_OrderButton .cart_button {
	max-width: 440px;
}

.BackButton {
	padding: 30px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row-reverse;
	width: 100%;
	max-width: 440px;
}

.BackButton::before {
	content: url("../img/icon-back.svg");
	display: inline-block;
	width: 21px;
}

.wrapper_OrderButton .BackButton:active {
	background-color: #f2f2f2;
	opacity: 1;
}

.wrapper_OrderButton .cart_button:active {
	background-color: #E7410D;
	opacity: 1;
}

.AddAddressList-button {
	display: inline-block;
	font-size: .9rem;
	background-color: var(--button-color);
	color: #fff;
	line-height: 1;
	padding: 8px 12px;
	border-radius: 6px;
	margin-top: 10px;
}

.AddAddressList-button:active {
	background-color: #333;
	opacity: 1;
}


/* ======= マイページ（住所リスト） ======= */

.Mypage_Address {
	margin-bottom: 100px;
}

.wrapper_AddAddress {
	padding: 0 20px;
	margin-bottom: 30px;
}

.list_AddAddress {
	list-style: none;
	background-color: #f2f2f2;
	border-radius: 6px;
}

.list_AddAddress dt {
	font-size: 1rem;
	font-weight: var(--font-thin);
	color: #000;
	padding: 20px;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
}

.list_AddAddress dt::after {
	content: url(../img/icon-down.svg);
	display: inline-block;
	width: 12px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.list_AddAddress dt:hover {
	opacity: 0.5;
}

.list_AddAddress dt.active::after {
	transform: rotate(-180deg);
}

.list_AddAddress dd {
	padding: 0 20px;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease-out, transform 0.3s ease-out, padding 0.3s ease-out;
	height: 0;
	visibility: hidden;
	overflow: hidden;
}

.list_AddAddress dd.open {
	opacity: 1;
	transform: translateY(0);
	padding: 20px;
	height: auto;
	visibility: visible;
}

.PlusIcon {
	display: flex;
	align-content: center;
}

.PlusIcon::before {
	content: url("../img/icon-plus.svg");
	display: inline-block;
	width: 18px;
	margin-right: 6px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.form_AddAddress input,
.form_EditAddress input {
	padding: 15px;
	width: 100%;
	margin-bottom: 20px;
}

.form_AddAddress input.last,
.form_EditAddress input.last {
	margin-bottom: 0;
}

.form_AddAddress fieldset,
.form_EditAddress fieldset {
	border: none;
	padding: 0;
	display: flex;
	gap: 10px;
}

.form_AddAddress label,
.form_AddAddress fieldset legend,
.form_EditAddress label,
.form_EditAddress fieldset legend {
	display: inline-block;
	margin-bottom: 8px;
}

.form_AddAddress fieldset .width-30,
.form_EditAddress fieldset .width-30 {
	width: 33.333%;
}

.form_AddAddress .custom_select,
.form_EditAddress .custom_select {
	position: relative;
}

.form_AddAddress .custom_select::after,
.form_EditAddress .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.form_AddAddress .custom_select::after,
.form_EditAddress .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.form_AddAddress select,
.form_EditAddress select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	color: #999;
	padding: 15px;
	width: 100%;
	font-size: .9rem;
	line-height: 1.4285rem;
	cursor: pointer;
	background-color: #fff;
}

.form_EditAddress select {
	color: var(--primary-color);
	background-color: #FDF2EA;
}

.form_AddAddress .list_note,
.form_EditAddress .list_note {
	font-size: .9rem;
	list-style: none;
	margin: 10px 0 20px;
}

.form_AddAddress .list_note li,
.form_EditAddress .list_note li {
	background-image: url("../img/icon-note.svg");
	background-position: left 2.5px;
	background-repeat: no-repeat;
	background-size: 15px;
	padding: 0 0 0 18px;
	line-height: 1.4rem;
	margin-bottom: 10px;
}

.form_AddAddress .list_note li:last-child,
.form_EditAddress .list_note li:last-child {
	margin-bottom: 0;
}

.form_AddAddress button,
.form_EditAddress button {
	width: 100%;
	padding: 30px 20px;
	background-color: var(--accent-color);
	color: #fff;
	line-height: 1rem;
	border-radius: 6px;
	border: none;
	cursor: pointer;
}

.form_EditAddress .buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-top: 30px;
}

.form_EditAddress button {
	display: inline-block;
}

.form_EditAddress button.back {
	background-color: #fff;
	color: var(--primary-color);
	border-radius: 6px;
	border: 0.5px solid #999;
}

.form_AddAddress button:active,
.form_EditAddress button:active {
	background-color: #E7410D;
}

.form_EditAddress button.back:active {
	background-color: #f2f2f2;
}

.wrapper_address {
	padding: 30px 20px;
	border-bottom: 0.5px solid #999;
}

.AddressNumber {
	font-size: 1.8rem;
	font-weight: var(--font-thin);
	color: #999;
	margin-bottom: 15px;
}

.wrapper_address .info {
	margin-bottom: 20px;
}

.wrapper_address .none {
	display: none;
}

.wrapper_address .h2_company {
	font-size: 1.2rem;
	line-height: 1.6rem;
	font-weight: var(--font-bold);
	margin-bottom: 10px;
}

.wrapper_address .h3_name {
	font-size: 1.1rem;
	line-height: 1.5rem;
	margin-bottom: 20px;
}

.wrapper_address .h3_name::after {
	content: "様";
	display: inline-block;
	font-size: .9rem;
	margin-left: 10px;
}

.wrapper_address .address {
	font-size: 1.1rem;
	line-height: 1.5rem;
	margin-bottom: 20px;
}

.wrapper_address .address span {
	display: block;
}

.wrapper_address .phone {
	font-size: 1.1rem;
	line-height: 1.5rem;
	padding-bottom: 10px;
}

.wrapper_address .phone span {
	font-weight: var(--font-thin);
	padding-right: 6px;
}

.wrapper_address .ActionArea {
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
	justify-content: flex-end;
}

.wrapper_address .ActionArea .btn_trash {
	margin-left: 20px;
}

.wrapper_address .ActionArea .btn_trash img {
	width: 50%;
}

.wrapper_address .ActionArea .btn_edit {
	width: 100%;
	max-width: 150px;
	padding: 20px;
	background-color: var(--button-color);
	text-align: center;
	line-height: 1rem;
	border-radius: 6px;
	color: #fff;
}

.wrapper_address .ActionArea .btn_edit:active {
	background-color: var(--primary-color);
	opacity: 1;
}




/* ======= マイページ（お客様情報） ======= */

.Mypage_Account {
	margin-bottom: 100px;
}

.h2_InAccountPage {
	padding: 0 20px 20px;
	border-bottom: 0.5px solid #999;
	font-size: 1.2rem;
	font-weight: var(--font-thin);
}

.list_Account {
	list-style: none;
	position: relative;
	padding-top: 30px
}

.list_Account dt {
	font-size: 1rem;
	font-weight: var(--font-thin);
	color: #000;
	margin-bottom: 8px;
}

.list_Account dd {
	font-size: 1.1rem;
	line-height: 1.8rem;
	margin-bottom: 30px;
}

.list_Account dd .zipcode {
	display: block;
}

.wrapper_cancel_edit_buttons {
	display: flex;
	justify-content: center;
	gap: 10px;
	padding: 0 20px 0 20px;
	margin-bottom: 90px;
}

.wrapper_cancel_edit_buttons .cancel,
.wrapper_cancel_edit_buttons .edit {
	width: 100%;
	padding: 20px;
}

.form_EditAccount {
	display: flex;
	flex-direction: column;
}

.form_EditAccount .input_ver2 {
	padding: 15px;
}

.form_EditAccount fieldset {
	padding: 0;
	border: none;
	margin-bottom: 30px;
}

.form_EditAccount fieldset .custom-radio {
	padding: 0;
}

.form_EditAccount .wrapper_FormInput {
	display: flex;
	column-gap: 10px;
}

.form_EditAccount .RegiType .wrapper_FormInput {
	column-gap: 20px;
}

.form_EditAccount fieldset legend,
.form_EditAccount .FormLabel {
	font-size: 1.2rem;
	font-weight: var(--font-thin);
	color: #000;
	display: block;
	margin-bottom: 15px;
}

.form_EditAccountfieldset .custom-radio {
	padding: 0;
}

.form_EditAccount .list_note {
	font-size: .9rem;
	list-style: none;
	margin: 0;
}

.form_EditAccount .list_note li {
	background-image: url("../img/icon-note.svg");
	background-position: left 2.5px;
	background-repeat: no-repeat;
	background-size: 15px;
	padding: 0 0 0 18px;
	line-height: 1.4rem;
	margin-bottom: 10px;
}

.form_EditAccount .list_note li:last-child {
	margin-bottom: 0;
}

.form_EditAccount .AddressColumn {
	flex-wrap: wrap;
}

.form_EditAccount .wrapper_FormLabelInput input {
	margin-bottom: 10px;
}

.form_EditAccount .wrapper_FormLabelInput .zipcode {
	width: 200px;
}

.form_EditAccount .wrapper_FormLabelInput .custom_select {
	position: relative;
	display: inline-block;
	width: calc(100% - 210px);
	max-width: 200px;
	background-color: #E6E6E6;
	margin-bottom: 10px;
	border-radius: 6px;
}

.form_EditAccount .wrapper_FormLabelInput .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.form_EditAccount .wrapper_FormLabelInput .custom_select select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	color: #999;
	padding: 15px;
	width: 100%;
	font-size: 1rem;
	line-height: 1.4285rem;
	cursor: pointer;
	background-color: #E6E6E6;
	border: none;
}

.form_EditAccount .wrapper_FormLabelInput .custom_select select {
	color: var(--primary-color);
	background-color: #FDF2EA;
	padding: 20px;
}

.form_EditAccount .AddressColumn .list_note {
	margin: 0;
}

.form_EditAccount .AddressColumn .list_note li {
	margin-bottom: 5px;
}

.form_EditAccount .wrapper_CheckBox label {
	display: flex;
	align-items: center;
	column-gap: 8px;
}

.form_EditAccount .width-30 {
	max-width: 120px;
}

.form_EditAccount .buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-top: 10px;
}

.form_EditAccount .buttons button,
.form_EditAccount .buttons button {
	width: 100%;
	padding: 30px 20px;
	background-color: var(--accent-color);
	color: #fff;
	line-height: 1rem;
	border-radius: 6px;
	border: none;
	cursor: pointer;
	display: inline-block;
}

.form_EditAccount .buttons button.back {
	background-color: #fff;
	color: var(--primary-color);
	border-radius: 6px;
	border: 0.5px solid #999;
}

.modal_form_cancel button {
	width: 100%;
}

.wrapper_CreditCard {
	padding: 30px 20px 40px;
	border-bottom: 0.5px solid #999;
}

.CardNumber {
	font-size: 2rem;
	font-weight: var(--font-thin);
	color: #999;
}

.wrapper_CreditCard .info {
	display: flex;
	flex-wrap: wrap;
	margin-top: 20px;
	align-items: baseline;
}

.wrapper_CreditCard .info dt {
	width: 90px;
	font-size: .9rem;
	margin-bottom: 10px;
	font-weight: var(--font-thin);
	color: #000;
}

.wrapper_CreditCard .info dd {
	font-size: 1.2rem;
	width: calc(100% - 100px);
	margin-bottom: 15px;
}

.wrapper_CreditCard .info dd.CardCampany {
	font-weight: var(--font-bold);
}


.wrapper_CreditCard .ActionArea {
	display: flex;
	align-items: center;
	flex-direction: row;
	margin-top: 10px;
	gap: 10px;
}

.wrapper_CreditCard .ActionArea .btn_edit {
	width: 100%;
	padding: 15px;
	background-color: var(--button-color);
	text-align: center;
	line-height: 1rem;
	border-radius: 6px;
	color: #fff;
	max-width: 240px;
}

.wrapper_CreditCard .ActionArea .btn_delete {
	width: 100%;
	padding: 15px;
	background-color: #f2f2f2;
	text-align: center;
	line-height: 1rem;
	border: 0.5px solid #999;
	border-radius: 6px;
	max-width: 240px;
}

.wrapper_CreditCard .ActionArea .btn_trash {
	display: none;
}

.wrapper_AddCard {}

.list_AddCard {
	list-style: none;
	border-bottom: 0.5px solid #999;
}

.list_AddCard dt {
	font-size: 1rem;
	font-weight: var(--font-thin);
	color: #000;
	padding: 30px 20px;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
}

.list_AddCard dt::after {
	content: url(../img/icon-down.svg);
	display: inline-block;
	width: 12px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.list_AddCard dt:hover {
	opacity: 0.5;
}

.list_AddCard dt.active::after {
	transform: rotate(-180deg);
}

.list_AddCard dd {
	padding: 0 20px;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease-out, transform 0.3s ease-out, padding 0.3s ease-out;
	height: 0;
	visibility: hidden;
	overflow: hidden;
}

.list_AddCard dd.open {
	opacity: 1;
	transform: translateY(0);
	padding: 20px;
	height: auto;
	visibility: visible;
}

.list_AddCard .PlusIcon {
	display: flex;
	align-content: center;
}

.list_AddCard .PlusIcon::before {
	content: url("../img/icon-plus.svg");
	display: inline-block;
	width: 18px;
	margin-right: 6px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.form_AddCard {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: -20px
}

.form_AddCard label {
	display: none;
}

.form_AddCard input {
	width: 100%;
}

.form_AddCard button {
	padding: 25px;
}



/* ======= マイページ（お知らせ） ======= */

.Mypage_news {
	margin-bottom: 100px;
}

.table_news {
	padding: 20px;
	border-bottom: 0.5px dashed #999;
}

.table_news a {
	text-decoration: underline;
}

.table_news a:active {
	text-decoration: none;
}

.news_date {
	font-weight: var(--font-bold);
	display: inline-block;
	color: var(--secondary-color);
}

.news_category {
	display: inline-block;
	color: var(--secondary-color);
	margin-left: 6px;
}

.news_category::before {
	content: " - ";
	margin-right: 6px;
}

.news_text {
	margin-top: 10px;
	line-height: 1.6rem;
}


/* ======= マイページ（利用履歴） ======= */

.Mypage_Log {
	margin-bottom: 100px;
}

.table_log {
	padding: 20px;
	border-bottom: 0.5px dashed #999;
}

.table_log a {
	text-decoration: underline;
}

.table_log a:active {
	text-decoration: none;
}

.log_date {
	font-weight: var(--font-bold);
	display: inline-block;
	color: var(--secondary-color);
}

.log_category {
	display: inline-block;
	color: var(--secondary-color);
	margin-left: 6px;
}

.log_category::before {
	content: " - ";
	margin-right: 6px;
}

.log_text {
	margin-top: 10px;
	line-height: 1.6rem;
}






/* ======= 商品ページ ======= */

.DetailPage {
	margin-bottom: 100px;
}

.wrapper_2columns_product {
	display: flex;
	flex-direction: column-reverse;
	justify-content: space-between;
	max-width: 1536px;
	margin: 0 auto;
}

.wrapper_2columns_product .column_left {
	width: 100%;
	padding: 20px;
}

.wrapper_2columns_product .column_right {
	width: 100%;
	padding: 0 20px;
	position: relative;
}

.wrapper_PageTitle_product {
	padding: 20px 0 30px 0
}

.wrapper_PageTitle_product h1 {
	font-size: 1.8rem;
	line-height: 2.2rem;
	word-break: break-word;
	overflow-wrap: break-word;
	max-width: 100%;
}

.wrapper_PageTitle_product h2 {
	font-size: 1.1rem;
	display: inline-block;
	font-weight: var(--font-bold);
	color: var(--primary-color);
}

.wrapper_PageTitle_product .h2_category::before {
	content: "（";
}

.wrapper_PageTitle_product .h2_category::after {
	content: "）";
}

.wrapper_TitleFav {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 20px;
}

.wrapper_tags {
	width: 100%;
	margin-bottom: 20px;
}

.tag {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	gap: 5px;
}

.tag li {
	background-color: #e6e6e6;
	font-size: .8rem;
	padding: 8px;
	white-space: nowrap;
}

.wrapper_product_img {
	width: 100%;
	text-align: center;
	margin-bottom: 20px;
}

.product_img {
	width: 100%;
	max-width: 580px;
}

.ImgSwitcher {
	list-style: none;
	display: none;
	justify-content: center;
	gap: 10px;
	margin-bottom: 20px;
}

.ImgSwitcher li {
	width: 70px;
	height: 70px;
	display: flex;
	justify-content: center;
	background-color: #f2f2f2;
}

.ImgSwitcher li img {
	width: auto;
	height: auto;
}

.product_desc {
	font-size: .9rem;
	margin-bottom: 30px;
	line-height: 1.4rem;
}

.wrapper_price {
	margin-bottom: 40px;
}

.retail {
	color: var(--accent-color);
	font-weight: var(--font-bold);
	margin-bottom: 15px;
}

.retail .NetPrice {
	font-size: 1.7rem;
}

.retail .GrossPrice {
	font-size: 1.2rem;
}

.GrossPrice::before {
	content: "（税込";
	font-size: 1rem;
	font-weight: var(--font-medium);
	padding-right: 3px;
}

.GrossPrice::after {
	content: "）";
	font-size: 1rem;
	font-weight: var(--font-medium);
}

.list {
	font-size: 1rem;
	color: var(--primary-color);
}

.list .NetPrice {
	font-weight: var(--font-bold);
}

.list .NetPrice::before {
	content: "定価";
	font-weight: var(--font-medium);
	padding-right: 3px;
}

.list .GrossPrice {
	font-weight: var(--font-bold);
}

.NotePrice {
	font-size: .9rem;
	color: var(--secondary-color);
	margin-bottom: 40px;
}

.wrapper_rating {
	margin-bottom: 40px;
}

.rating {
	display: flex;
	align-items: center;
}

.stars {
	display: flex;
	font-size: 1.1rem;
	gap: 3px;
}

.star {
	color: #999;
	/* 通常の星（グレー） */
}

.full {
	color: var(--primary-color);
	/* 塗りつぶしの星 */
}

.half {
	color: #666;
	/* 半分の星（ライトグレー） */
}

.review-count {
	font-size: .9rem;
	margin-left: 8px;
	color: var(--primary-color);
}

.wrapper_AddInfo {
	margin-bottom: 40px;
}

.wrapper_AddInfo dl {
	border-bottom: 0.5px solid #999;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 20px;
	padding-bottom: 10px;
}

.wrapper_AddInfo dt {
	font-size: 1rem;
	color: var(--secondary-color);
}

.wrapper_AddInfo dd {
	font-size: 1.1rem;
	font-weight: var(--font-bold);
}

.wrapper_AddInfo dd .tooltip-content {
	left: auto;
	right: -240%;
	font-weight: var(--font-medium);
}


.wrapper_AddInfo dl.InstallationEmphasize dd {
	color: var(--accent-color);
}


.wrapper_notice {
	margin-bottom: 40px;
}

.title_notice {
	border-bottom: 0.5px solid #666;
	padding-bottom: 10px;
}

.wrapper_notice h4 {
	display: inline-block;
	font-weight: var(--font-thin);
	font-size: 1.4rem;
	color: #000;
	margin-right: 10px;
}

.wrapper_notice span {
	font-size: .8rem;
}

.list_notice {
	list-style: none;
	font-size: 0.9rem;
}

.list_notice li {
	list-style: none;
	border-bottom: 0.5px dashed #666;
	padding: 20px 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
}

.list_notice li:active {
	opacity: 0.5;
}

.list_notice li p {
	width: 100%;
	background-image: url("../img/icon-note.svg");
	background-repeat: no-repeat;
	background-position: 0 center;
	background-size: 15px;
	padding-left: 20px;
	white-space: nowrap;
	/* テキストを折り返さない */
	overflow: hidden;
	/* はみ出した部分を隠す */
	text-overflow: ellipsis;
	/* 三点リーダー (...) を表示 */
	min-height: 15px;
}

.list_notice li span {
	margin: 0 10px;
}

.list_notice li span img {
	width: 6px;
}

.list_notice li.noLink {
	cursor: auto;
}

.list_notice li.noLink span {
	display: none;
}

.list_notice li.noLink:active {
	opacity: 1;
}

.wrapper_ActionBtn {
	margin-bottom: 40px;
}

.quantity-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 20px;
	border: 0.5px solid #999;
	border-radius: 6px;
	margin-bottom: 10px;
	min-height: 84px;
}

.quantity-button {
	background: none;
	border: none;
	cursor: pointer;
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.8rem;
	font-weight: var(--font-thin);
}

.quantity-button:disabled {
	cursor: not-allowed;
	opacity: 0.5;
}

.quantity-button:active {
	opacity: 0.5;
}

.quantity-value {
	font-size: 1.2rem;
	text-align: center;
	width: 40px;
	font-weight: var(--font-bold);
}

.estimate_button,
.cart_button,
.GoPurchase_button {
	padding: 30px 20px;
	color: #fff;
	font-size: 1rem;
	border-radius: 6px;
	border: none;
	width: 100%;
	min-height: 84px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	flex-direction: row-reverse;
}


.Purchase_button {
	padding: 30px;
	color: #fff;
	font-size: 1rem;
	border-radius: 6px;
	border: none;
	width: 100%;
	min-height: 84px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.DetailPage .estimate_button,
.DetailPage .cart_button {
	padding: 30px;
	justify-content: center;
	flex-direction: row;
}

.estimate_button {
	background-color: var(--button-color);
	margin-bottom: 10px;
}

.estimate_button::before {
	content: url("../img/icon-estimate-white.svg");
	display: inline-block;
	width: 20px;
}

.DetailPage .estimate_button::before,
.DetailPage .cart_button::before {
	margin-right: 12px;
}

.estimate_button:active {
	background-color: var(--primary-color);
}

.cart_button,
.GoPurchase_button,
.Purchase_button {
	background-color: var(--accent-color);
}

.cart_button::before {
	content: url("../img/icon-cart-white.svg");
	display: inline-block;
	width: 24px;
}

.GoPurchase_button::before {
	content: url("../img/icon-go.svg");
	display: inline-block;
	width: 22px;
}

.cart_button:active,
.GoPurchase_button:active,
.Purchase_button:active {
	background-color: #E7410D;
}

.back_button {
	padding: 30px 20px;
	color: var(--seconday-color);
	font-size: 1rem;
	border-radius: 6px;
	border: 0.5px solid #999;
	width: 100%;
	min-height: 84px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	flex-direction: row-reverse;
	background-color: #f2f2f2;
}

.back_button::before {
	content: url("../img/icon-back.svg");
	display: inline-block;
	width: 20px;
	margin-top: 4px;
}

.back_button:active {
	background-color: #fff;
}

.wrapper_MoreInfo {}

.list_MoreInfo {
	list-style: none;
}

.list_MoreInfo dt {
	font-size: 1.2rem;
	font-weight: var(--font-thin);
	padding: 15px 0;
	border-bottom: 0.5px solid #666;
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
	cursor: pointer;
}

.list_MoreInfo dt:first-child {
	margin-top: 0;
}

.list_MoreInfo dt::after {
	content: url("../img/icon-down.svg");
	display: inline-block;
	width: 12px;
	margin-right: 10px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.list_MoreInfo dt.open::after {
	transform: rotate(-180deg);
}

.list_MoreInfo dt:active {
	opacity: 0.5;
}

.list_MoreInfo dd {
	opacity: 0;
	transform: translateY(-10px);
	padding: 0;
	font-size: 1rem;
	line-height: 1.5rem;
	transition: opacity 0.3s ease-out, transform 0.3s ease-out, padding 0.3s ease-out;
	height: 0;
	visibility: hidden;
}

.list_MoreInfo dd.open {
	opacity: 1;
	transform: translateY(0);
	padding: 20px 0;
	height: auto;
	visibility: visible;
}

/* ======= カテゴリページ ======= */

.CategoryPage {
	margin-bottom: 100px;
}

.wrapper_filter {
	padding: 0 0 0 20px;
	margin-bottom: 30px;
	display: flex;
}

.btn_filter_modal {
	border: 0.5px solid #999;
	border-radius: 6px;
	background-color: #fff;
	padding: 10px;
	cursor: pointer;
	font-size: 0.9rem;
	display: flex;
	align-items: center;
	white-space: nowrap;
	margin-right: 10px;
}

.btn_filter_modal::before {
	content: url("../img/icon-filter.svg");
	display: inline-block;
	width: 15px;
	margin-right: 5px;
}

.selected_option {
	flex-wrap: nowrap;
	column-gap: 3px;
	overflow: auto;
	white-space: nowrap;
	-ms-overflow-style: none;
	scrollbar-width: none;
	padding-right: 6px;
}

.selected_option li {
	white-space: nowrap;
	background-color: #808080;
}

.selected_option li:last-child {
	background-color: #E6E6E6;
}

.selected_option li:last-child a {
	color: var(--primary-color);
}

.selected_option li:only-child:last-child {
	background-color: #808080;
}

.selected_option li:only-child:last-child a {
	color: #fff;
}

.selected_option li a {
	color: #fff;
}

.selected_option li a::after {
	content: "×";
	margin-left: 6px;
	font-weight: var(--font-thin);
}

.column_right .filter_title {
	font-size: 1.4rem;
	font-weight: var(--font-thin);
	color: #000;
}

.modal_filter .filter_title {
	font-size: 1.2rem;
	font-weight: var(--font-thin);
	color: #000;
}

.column_right .filter_item,
.modal_filter .filter_item {
	margin-bottom: 40px;
}

.column_right .filter_item .custom_select,
.modal_filter .filter_item .custom_select {
	position: relative;
	display: inline-block;
	width: 100%;
	background-color: #fff;
}

.column_right .filter_item .custom_select::after,
.modal_filter .filter_item .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.column_right .filter_item select,
.modal_filter .filter_item select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	color: var(--primary-color);
	padding: 15px;
	width: 100%;
	font-size: .9rem;
	line-height: 1.4285rem;
	cursor: pointer;
	background-color: #f2f2f2;
}

.column_right .filter_item label {
	font-size: 1.4rem;
	padding: 0 0 20px 0;
	font-weight: var(--font-thin);
	display: block;
	color: #000;
}

.modal_filter .filter_item label {
	font-size: 1.2rem;
	padding: 0 0 20px 0;
	font-weight: var(--font-thin);
	display: block;
	color: #000;
}

.modal_filter {
	padding: 0;
	flex-direction: column;
}

.modal_filter .modal_window_main {
	height: 100%;
	border-radius: 0;
	;
	padding: 70px 20px 0px 20px;
}

.modal_filter_title {
	font-weight: var(--font-bold);
	position: absolute;
	top: 15px;
	left: 15px;
	font-size: 1rem;
}

.modal_filter .BottomArea {
	background-color: var(--primary-color);
	padding: 20px;
	display: flex;
	column-gap: 12px;
	list-style: none;
	position: sticky;
	bottom: 0;
	width: 100%;
}

.modal_filter .BottomArea li {
	width: 50%;
	margin: 0;
}

.modal_filter .BottomArea li button {
	width: 100%;
	white-space: nowrap;
	padding: 30px 20px;
	font-size: .9rem;
}

.wrapper_Taggles {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 0 20px;
	margin-bottom: 30px;
}

.wrapper_ListNavi {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 0 0 20px;
	border-top: 0.5px solid #999;
	border-bottom: 0.5px solid #999;
	width: 100%;
}

.product_list_info,
.display_options {
	padding: 0;
}

.product_list_info {
	font-size: .9rem;
	white-space: nowrap;
	width: auto;
}

.info_1,
.info_2 {
	margin-right: 15px;
}

.text_long {
	display: none;
}

.product_list_info span {}

.product_list_info strong {
	font-size: 1.2rem;
}

.display_options {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	border-left: 0.5px solid #999;
}

.display_options .PerPage {
	display: none;
}

.display_options select {
	border: none;
	padding: 15px 35px 15px 15px;
	max-width: 150px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
	font-size: .9rem;
	background-color: #fff;
}

.display_options label {
	display: none;
}

.wrapper_ListNavi .custom_select {
	position: relative;
}

.wrapper_ListNavi .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.wrapper_ListNavi .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.product {
	padding: 30px 20px;
	display: flex;
	flex-direction: column;
	border-bottom: 0.5px solid #999;
}

.product figure {
	max-width: 80px;
	margin: 0 0 20px 20px;
}

.link_product_InCategory {
	width: 100%;
}

.link_product_InCategory:active {
	opacity: 1;
}

.link_product_InCategory:active .h2_ProdcutName,
.link_product_InCategory:active .h3_maker,
.link_product_InCategory:active .h3_category {
	text-decoration: underline;
}

.link_product_InCategory:active .item_pic_common {
	opacity: 0.5;
}

.wrapper_ImgInfo {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 40px;
}

.product .wrapper_TitleFav {
	margin: 15px 0;
}

.product .h3_maker,
.product .h3_category {
	text-align: left;
	font-size: .9rem;
}

.product .h2_ProdcutName {
	margin: 0;
	font-size: 1.4rem;
	line-height: 1.8rem;
}

.product .btn_favorite {
	width: 30px;
	height: 30px;
}

.product .icon_fav_10 {
	width: 20px;
}

.product .wrapper_price {
	margin: 20px 0;
}

.product .NetPrice,
.product .GrossPrice {
	font-size: 1.2rem;
}

.product .GrossPrice {
	color: var(--primary-color);
	margin-left: 15px;
}

.product .NetPrice::before {
	content: "税抜";
	font-size: .8rem;
	font-weight: var(--font-medium);
	padding-right: 3px;
}

.product .GrossPrice::before {
	content: "税込";
	font-size: .8rem;
	font-weight: var(--font-medium);
	padding-right: 3px;
}

.product .GrossPrice::after {
	content: none;
}

.product .wrapper_rating {
	margin: 0;
}

.product .wrapper_ActionBtn {
	display: flex;
	align-items: flex-start;
	column-gap: 8px;
	margin: 0;
}

.product .quantity-container {
	padding: 14px 8px;
	margin: 0;
	min-height: 50px;
}

.product .quantity-button {
	width: 20px;
	height: 20px;
	font-size: 1.2rem;
}

.product .estimate_button,
.product .cart_button {
	padding: 15px;
	min-height: 50px;
	font-size: .9rem;
	white-space: nowrap;
	justify-content: center;
}

.product .estimate_button::before,
.product .cart_button::before {
	content: none;
}

.product .estimate_button {
	margin: 0;
}

.list_tag {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	font-size: .9rem;
	line-height: 1.4rem;
	color: var(--secondary-color);
	margin-bottom: 30px;
}

.list_tag li {
	white-space: nowrap;
}

.list_tag li::after {
	content: "/";
	font-weight: var(--font-thin);
	padding: 0 6px;
}

.list_tag li:last-child::after {
	content: none;
}

.NoItemsPage {
	margin-bottom: 100px;
}

.NoItemsPage .column_right {
	width: 100%;
}

.NoItemsPage .column_left {
	margin-bottom: 60px;
}

.SearchResult span {
	font-weight: var(--font-thin);
}

.NoItemsPage h2 {
	font-size: 1.2rem;
	line-height: 1.6rem;
	margin-bottom: 1.8rem;
}

.NoItemsPage .column_left ul {
	margin-left: 17px;
	margin-bottom: 1.8rem;
}

.NoItemsPage .column_left ul li {
	margin-bottom: 10px;
	line-height: 1.4rem;
	font-size: .9rem;
}

.NoItemsPage .column_left ul li:last-child {
	margin-bottom: 0;
}

.form_ReSearch {
	display: flex;
	align-items: stretch;
	gap: 8px;
}

.form_ReSearch input {
	padding: 15px;
	width: 70%;
	max-width: 500px;
	border: 0.5px solid #999;
}

.form_ReSearch button {
	padding: 15px;
	width: 30%;
	max-width: 150px;
	border: none;
	border-radius: 6px;
	background-color: var(--button-color);
	color: #fff;
	cursor: pointer;
}

.form_ReSearch button:active {
	background-color: #000;
}

.NoItemsPage .column_right p {
	line-height: 1.6rem;
	margin-bottom: 2.2rem;
}

.NoItemsPage .column_right .wrapper_ButtonErea {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-bottom: 2.4rem;
}

.NoItemsPage .column_right .wrapper_ButtonErea a {
	background-color: var(--button-color);
	width: 100%;
	max-width: 500px;
	white-space: nowrap;
	padding: 25px 30px;
}

.NoItemsPage .column_right .wrapper_ButtonErea a:active {
	background-color: #000;
}

.NoItemsPage .column_right .list_phone {
	list-style: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;
}

.NoItemsPage .column_right .list_phone .tel,
.NoItemsPage .column_right .list_phone .time {
	font-size: 1.5rem;
	font-weight: var(--font-thin);
}

.NoItemsPage .column_right .list_phone .tel::before {
	content: "電話番号";
	display: block;
	font-size: 1rem;
	font-weight: var(--font-bold);
	text-align: center;
	margin-bottom: 5px;
}

.NoItemsPage .column_right .list_phone .time::before {
	content: "電話受付";
	display: block;
	font-size: 1rem;
	font-weight: var(--font-bold);
	text-align: center;
	margin-bottom: 5px;
}




.NoBrandsPage {
	margin-bottom: 100px;
}

.NoBrandsPage .column_right {
	width: 100%;
}

.NoBrandsPage .column_left {
	display: none;
}

.NoBrandsPage .column_right p {
	line-height: 1.6rem;
	margin-bottom: 2.2rem;
}

.NoBrandsPage .column_right .wrapper_ButtonErea {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-bottom: 2.4rem;
}

.NoBrandsPage .column_right .wrapper_ButtonErea a {
	background-color: var(--button-color);
	width: 100%;
	max-width: 500px;
	white-space: nowrap;
	padding: 25px 30px;
}

.NoBrandsPage .column_right .wrapper_ButtonErea a:active {
	background-color: #000;
}

.NoBrandsPage .column_right .list_phone {
	list-style: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;
}

.NoBrandsPage .column_right .list_phone .tel,
.NoBrandsPage .column_right .list_phone .time {
	font-size: 1.5rem;
	font-weight: var(--font-thin);
}

.NoBrandsPage .column_right .list_phone .tel::before {
	content: "電話番号";
	display: block;
	font-size: 1rem;
	font-weight: var(--font-bold);
	text-align: center;
	margin-bottom: 5px;
}

.NoBrandsPage .column_right .list_phone .time::before {
	content: "電話受付";
	display: block;
	font-size: 1rem;
	font-weight: var(--font-bold);
	text-align: center;
	margin-bottom: 5px;
}

.wrapper_on404 {
	text-align: center;
	margin: 4.5rem auto 0 auto;
	max-width: 1536px;
}

.btn_Top {
	width: 100%;
	max-width: 500px;
	white-space: nowrap;
	padding: 25px 30px;
	margin: 20px 0 40px;
}



/* ======= カート ======= */

.CartPage {
	margin-bottom: 100px;
}

.product_cart {
	border-bottom: 0.5px solid #999;
	padding: 30px 20px;
}

.product_cart:nth-of-type(1) {
	border-top: 0.5px solid #999;
}

.product_cart .wrapper_01 {
	display: flex;
	width: 100%;
	margin-bottom: 20px;
}

.product_cart figure {
	width: 80px;
	height: 80px;
	margin-bottom: 0;
}

.product_cart .wrapper_01 .inner {
	padding-left: 15px;
	width: calc(100% - 80px);
}

.product_cart .h3_maker,
.product_cart .h3_category {
	display: inline-block;
	line-height: 1rem;
	font-size: .9rem;
}

.product_cart .h3_category::before {
	content: "（";
}

.product_cart .h3_category::after {
	content: "）";
}

.product_cart .h2_ProdcutName {
	font-size: 1.4rem;
	line-height: 1.8rem;
	margin: 10px 0;
	display: block;
}

.product_cart .wrapper_02 {
	display: flex;
	align-items: center;
}

.product_cart .wrapper_03 {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.product_cart .list_icons {
	list-style: none;
	display: flex;
	gap: 5px;
}

.product_cart .icon_fav {
	width: 22px;
	height: auto;
}

.product_cart .icon_trash {
	width: 20px;
	height: auto;
}

.product_cart .quantity-container {
	width: auto;
	min-width: 120px;
	min-height: 50px;
	padding: 0;
	margin: 0 20px 0 0;
}

.product_cart .quantity-button {
	font-size: 1.2rem;
}

.product_cart .quantity-value {
	width: 50px;
	font-size: 1.1rem;
}

.product_cart .price_single {
	font-size: 1rem;
	font-weight: var(--font-bold);
}

.product_cart .price_total {
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	white-space: nowrap;
}

.product_cart .price_total::before {
	content: "（税抜）";
	font-size: .7rem;
	font-weight: var(--font-medium);
}

.list_BreakDown {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	margin: 0 0 10px;
}


.list_BreakDown dt {
	width: 50%;
	padding: 20px 10px 20px 20px;
}

.list_BreakDown dd {
	width: 50%;
	text-align: right;
	padding: 20px 20px 20px 10px;
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	white-space: nowrap;
}

.list_BreakDown dd::after {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	width: 100%;
	height: 0.5px;
	border-top: 0.5px solid #999;
	margin-top: 20px;
}

.list_BreakDown dt:last-of-type {
	font-weight: var(--font-bold);
}

.list_BreakDown dd:last-child {
	font-size: 1.4rem;
	color: var(--accent-color);
}

.list_BreakDown dd:last-child::after {
	content: none;
}

.wrapper_buttons {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 20px;
}

.wrapper_buttons .GoPurchase_button,
.wrapper_buttons .back_button {
	width: 100%;
}




/* ======= 購入手続ページ ======= */

.purchase_header {
	border-bottom: 0.5px solid #666;
	position: relative;
	padding: 15px;
}

.purchase_header_inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 1536px;
	margin: 0 auto;
}

.purchase_h1 {
	margin: 0;
	font-size: 1rem;
	font-weight: var(--font-medium);
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--secondary-color);
}

.purchase_h1::before {
	content: "";
	display: inline-block;
	background-image: url("../img/logo.png");
	background-repeat: no-repeat;
	background-size: contain;
	width: 150px;
	height: 40px;
}

.purchase_back a,
.estimate_back a,
.order_back a {
	display: inline-block;
	display: flex;
	align-items: center;
	gap: 10px;
}

.purchase_back a::before {
	display: none;
	content: "カートに戻る";
	font-size: .8rem;
}

.estimate_back a::before {
	display: none;
	content: "お見積り画面に戻る";
	font-size: .8rem;
}

.order_back a::before {
	display: none;
	content: "ご注文フォーム画面に戻る";
	font-size: .8rem;
}

.purchase_back a img,
.estimate_back a img,
.order_back a img {
	width: 25px;
	height: auto;
	margin-top: 3px;
}

.purchase_main {
	display: flex;
	flex-direction: column;
	padding: 30px 20px;
	max-width: 1536px;
	margin: 0 auto;
}

.purchase_main h4 {
	font-size: 1.5rem;
	padding: 0 0 20px 0;
}

.purchase_colmun_right {
	width: 100%;
}

.purchase_colmun_left {
	width: 100%;
	margin-top: 80px;
}

.purchase_footer {
	border-top: 0.5px solid #999;
	padding: 20px 20px;
	max-width: 1536px;
	margin: 0 auto 40px;
	background-color: #fff;
}

.purchase_footer ul {
	list-style: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	font-size: .8rem;
	gap: 5px;
	margin-bottom: 30px;
}

.purchase_footer .wrapper_footer_bottom_right {
	text-align: center;
}

.purchase_colmun_right .list_BreakDown {
	border-top: 0.5px solid #999;

}

.purchase_colmun_right .list_BreakDown dt {
	padding: 20px 10px 20px 0;
}

.purchase_colmun_right .list_BreakDown dd {
	padding: 20px 0 20px 10px;
}

.h4_dropdown {
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
}

.h4_dropdown::after {
	content: "";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 15px;
	height: 9px;
	background-image: url("../img/icon-up.svg");
	background-repeat: no-repeat;
	background-size: contain;
	transition: transform 0.3s ease;
}

.h4_dropdown.active::after {
	transform: rotate(180deg);
}

.h4_dropdown:active {
	opacity: 0.5;
}

.product_purchase {
	border-top: 0.5px solid #999;
	padding: 20px 0px;
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.3s ease, transform 0.3s ease, height 0.3s ease;
}

.product_purchase.hidden {
	opacity: 0;
	transform: translateY(-10px);
	height: 0;
	overflow: hidden;
	padding: 0;
}


.product_purchase figure {
	width: 70px;
	height: 70px;
	margin-bottom: 0;
	cursor: default;
}

.product_purchase figure:active,
.product_purchase figure:hover {
	opacity: 1;
}

.product_purchase .wrapper_01 {
	display: flex;
	width: 100%;
	margin-bottom: 20px;
}

.product_purchase .wrapper_01 .inner {
	width: calc(100% - 70px - 60px);
	padding-left: 15px;
}

.product_purchase .h3_maker,
.product_purchase .h3_category {
	display: inline-block;
	line-height: 1rem;
	font-size: .9rem;
}

.product_purchase .h3_category::before {
	content: "（";
}

.product_purchase .h3_category::after {
	content: "）";
}

.product_purchase .h2_ProdcutName {
	font-size: 1.2rem;
	line-height: 1.5rem;
	margin: 10px 0;
	display: block;
}

.product_purchase .price_single {
	font-size: 1rem;
	font-weight: var(--font-bold);
}

.product_purchase .price_total {
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	white-space: nowrap;
}

.product_purchase .price_total::before {
	content: "（税抜）";
	font-size: .7rem;
	font-weight: var(--font-medium);
}

.product_purchase .wrapper_02 {
	display: flex;
	justify-content: flex-end;
}

.quantity_total {
	width: 60px;
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.quantity_total::before {
	content: "×";
	display: inline-block;
	font-size: 1.5rem;
	font-weight: var(--font-thin);
	margin-right: 10px;
}

.form_purchase {
	margin-bottom: 60px;
}

.form_purchase .wrapper_section {
	margin-bottom: 80px;
	position: relative;
}

.form_purchase label,
.form_purchase legend {
	display: flex;
	font-size: 1rem;
	line-height: 1rem;
	margin-bottom: 8px;
	align-items: center;
}

.form_purchase input::placeholder {
	font-size: .9rem;
}

.form_purchase fieldset {
	padding: 0;
	border: none;
	display: flex;
	column-gap: 6px;
}

.form_purchase input {
	padding: 15px;
	margin-bottom: 20px;
	width: 100%;
}

.form_purchase select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	color: #999;
	padding: 15px;
	width: 100%;
	font-size: .9rem;
	line-height: 1.4285rem;
	cursor: pointer;
	background-color: #fff;
}

.form_purchase .custom_select {
	position: relative;
	display: inline-block;
	width: 100%;
	margin-bottom: 20px;
	background-color: #fff;
}

.form_purchase .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.custom_select_address {
	width: 180px;
	overflow: hidden;
	display: inline-block;
	position: absolute;
	top: 3px;
	right: 0;
}

.custom_select_address:active {
	opacity: 0.5;
}

.custom_select_address select {
	width: 100%;
	padding: 0 10px 0 0;
	background-color: unset;
	border: none;
	color: var(--primary-color);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.form_purchase .custom_select_address::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.form_purchase input.asap {
	padding: 0;
}

.form_purchase input.receipt,
.form_purchase input.Installation {
	padding: 0;
}


.form_purchase .text_note {
	font-size: .8rem;
	margin-left: 5px;
}

.form_purchase .text_note b {
	font-size: 1rem;
}

.form_purchase .list_note {
	font-size: .9rem;
	list-style: none;
	margin: 0;
}

.form_purchase .list_note li {
	background-image: url("../img/icon-note.svg");
	background-position: left 2.5px;
	background-repeat: no-repeat;
	background-size: 15px;
	padding: 0 0 0 18px;
	line-height: 1.4rem;
	margin-bottom: 10px;
}

.form_purchase .list_note li:last-child {
	margin-bottom: 0;
}

.form_purchase .wrapper_CheckBox {
	display: flex;
	align-items: center;
	column-gap: 8px;
	padding-top: 10px;
	margin-bottom: 30px;
}

.List_PayMethod {
	list-style: none;
	border: 0.5px solid #999;
	margin-bottom: 20px;
}

.List_PayMethod dt {
	background-color: #fff;
	padding: 0;
	position: relative;
	border-top: 0.5px solid #999;
}

.List_PayMethod dt:active,
.List_ShippingAddress dt:active {
	background-color: #f2f2f2;
}

.List_PayMethod dt:first-of-type {
	border-top: none;
}

.List_PayMethod dd {
	background-color: #f2f2f2;
	opacity: 0;
	transform: translateY(-10px);
	overflow: hidden;
	transition: opacity 0.3s ease, transform 0.3s ease, height 0.3s ease;
	visibility: hidden;
	height: 0;
	line-height: 1.6rem;
}

.List_PayMethod dd.active {
	opacity: 1;
	transform: translateY(0);
	height: auto;
	visibility: visible;
	border-top: 0.5px solid #999;
	padding: 20px;
}

.List_PayMethod dt label {
	margin: 0;
	flex-wrap: nowrap;
}

.List_PayMethod dd label {
	display: none;
}

.List_PayMethod dd .wrapper_CheckBox {
	margin: 0 0 1.5rem 0;
}

.List_PayMethod dd .wrapper_CheckBox label {
	display: inline-block;
	margin: 0;
}

.List_PayMethod dt input {
	display: inline-block;
	padding: 0;
	margin: 0;
	width: auto;
}

.List_PayMethod dd input {
	margin-bottom: 10px;
}

.List_PayMethod dd p {
	margin-bottom: 1.5rem;
}

/* ラジオボタンのデフォルトデザインを非表示 */
.custom-radio input[type="radio"] {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	position: absolute;
	width: 0;
	height: 0;
}

/* カスタムラジオボタンのデザイン */
.custom-radio {
	display: flex;
	align-items: center;
	cursor: pointer;
	font-size: 16px;
	padding: 20px;
}

/* ラジオボタンの見た目 */
.radio-mark {
	width: 20px;
	height: 20px;
	border: 0.5px solid #999;
	border-radius: 50%;
	display: inline-block;
	margin-right: 8px;
	position: relative;
	background-color: #fff;
}

/* 選択された場合のデザイン */
.custom-radio input[type="radio"]:checked+.radio-mark {
	background-color: var(--accent-color);
}

/* 選択されたときに中央にドットを表示 */
.custom-radio input[type="radio"]:checked+.radio-mark::after {
	content: "";
	width: 10px;
	height: 10px;
	background-color: white;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.List_PayMethod .list_creditCard {
	list-style: none;
	position: absolute;
	gap: 10px;
	top: 54px;
	left: 48px;
	pointer-events: none;
}

.creditCard {
	padding-bottom: 50px;
}


.List_ShippingAddress {
	list-style: none;
	border: 0.5px solid #999;
}

.List_ShippingAddress dt {
	background-color: #fff;
	padding: 0;
	position: relative;
	border-top: 0.5px solid #999;
}

.List_ShippingAddress dt:first-of-type {
	border-top: none;
	border-bottom: none;
}


.List_ShippingAddress dd {
	border-top: 0.5px solid #999;
	background-color: #f2f2f2;
	position: relative;
	opacity: 0;
	transform: translateY(-10px);
	height: 0;
	overflow: hidden;
	transition: opacity 0.3s ease, transform 0.3s ease, height 0.3s ease;
	visibility: hidden;
}

.List_ShippingAddress dd.active {
	opacity: 1;
	transform: translateY(0);
	height: auto;
	visibility: visible;
	padding: 20px;
}


.List_ShippingAddress dt label {
	margin: 0;
	flex-wrap: nowrap;
}

.List_ShippingAddress dt input {
	display: inline-block;
	padding: 0;
	margin: 0;
	width: auto;
}

.List_ShippingAddress dd .wrapper_CheckBox label {
	margin-bottom: 0;
}

.List_ShippingAddress .custom_select_address {
	position: relative;
	width: 100%;
	overflow: auto;
	top: 0;
	padding: 0;
	margin-bottom: 20px;
	border-radius: 6px;
	outline: none;
	line-height: 1;
	border: 0.5px solid #999;
}

.List_ShippingAddress .custom_select_address select {
	padding: 15px 30px 15px 15px;
}

.form_purchase .List_ShippingAddress .custom_select_address::after {
	right: 10px;
}


.form_purchase .installation_section {}

.form_purchase .ReceiptText,
.form_purchase .InstallationText {
	font-size: 1rem;
	line-height: 1.5rem;
	margin-bottom: 10px;
}


.form_purchase .receipt_section .wrapper_CheckBox label,
.form_purchase .installation_section .wrapper_CheckBox label,
.form_purchase .address_section .wrapper_CheckBox label {
	margin: 0;
}

.form_purchase .message {
	margin-bottom: 50px;
}

.form_purchase .message label {
	font-size: 1rem;
	line-height: 1.6rem;
	margin-bottom: 10px;
}

.form_purchase .message textarea {
	width: 100%;
	padding: 15px;
	line-height: 1.4rem;
	border-radius: 6px;
	border: 0.5px solid #999;
	outline: none;
	resize: none;
	/* リサイズできないようにする */
}

.form_purchase .agreement {
	margin-bottom: 0;
}

.form_purchase .agreement .wrapper_CheckBox {
	justify-content: center;
}

.form_purchase .agreement label {
	font-size: .9rem;
	margin: 0;
}

.form_purchase .AgreementText {
	font-size: .9rem;
	line-height: 1.4rem;
	margin-bottom: 15px;
}

.form_purchase .AgreementText a {
	text-decoration: underline;
}

.form_purchase .AgreementText a:active {
	text-decoration: none;
}

/* ======= お気に入りページ ======= */

.FavoritePage {
	margin-bottom: 100px;
}

.Message_favorite {
	background-color: var(--secondary-color);
	font-size: .9rem;
	line-height: 1.4rem;
	padding: 20px;
	color: #fff;
}

.Message_favorite a {
	text-decoration: underline;
	color: #fff;
}

.Message_favorite a:hover {
	text-decoration: none;
}

.login_InRightColmun h2 {
	font-size: 1.4rem;
}

.login_InRightColmun p {
	font-size: 1rem;
}

.modal_BatchOption {
	row-gap: 10px;
}

.batch_execution {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px;
	border-bottom: 0.5px solid #999;
}

.wrapper_batch_checkbox {
	display: flex;
	align-items: center;
	column-gap: 8px;
	padding-right: 30px;
	font-size: .9rem;
}

.btn_BatchOption {
	background-color: #4d4d4d;
	padding: 8px 10px;
	line-height: 1rem;
	font-size: .9rem;
	border-radius: 6px;
	border: none;
	color: #fff;
	cursor: pointer;
}

.btn_BatchOption:active {
	background-color: #000;
}

.modal_BatchOption p {
	text-align: center;
	margin-bottom: 10px;
}

.modal_BatchOption .estimate_button {
	margin-bottom: 0;
}

.trash_button {
	background-color: #E9E9E9;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 84px;
	display: flex;
	flex-direction: row-reverse;
	padding: 30px 20px;
}

.trash_button::before {
	content: url("../img/icon-trash.svg");
	display: inline-block;
	width: 19px;
}

.BatchOption {
	display: none;
	list-style: none;
	align-items: center;
}

.BatchOption li {
	font-size: .9rem;
	margin-right: 30px;
}


.BatchOption li:last-child {
	margin-right: 0;
}

.BatchOption li a {
	display: flex;
	align-items: center;
}

.BatchOption li a.BatchTrash::before {
	content: url("../img/icon-trash.svg");
	display: inline-block;
	width: 19px;
	margin-right: 8px;
}

.BatchOption li a.BatchEstimate::before {
	content: url("../img/icon-estimate.svg");
	display: inline-block;
	width: 19px;
	margin-right: 8px;
}

.BatchOption li a.BatchCart::before {
	content: url("../img/icon-cart.svg");
	display: inline-block;
	width: 19px;
	margin-right: 8px;
}

.favorite {
	padding: 30px 20px;
	display: flex;
	flex-direction: column;
	position: relative;
	border-bottom: 0.5px solid #999;
}

.favorite .wrapper_batch_checkbox {
	margin-bottom: 20px;
	padding: 0;
}

.favorite .checkbox_label {
	display: block;
	width: 100%;
	cursor: pointer;
	user-select: none;
}

.link_product_InFavorite {
	width: 100%;
}

.link_product_InFavorite:active {
	opacity: 1;
}

.link_product_InFavorite:active .h2_ProdcutName,
.link_product_InFavorite:active .h3_maker,
.link_product_InFavorite:active .h3_category {
	text-decoration: underline;
}

.link_product_InFavorite:active .item_pic_common {
	opacity: 0.5;
}

.favorite .wrapper_InfoImg {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
}

.favorite figure {
	max-width: 80px;
	margin: 0 0 20px 20px;
}

.favorite .wrapper_InfoImg .Info {
	width: 100%;
}

.favorite .wrapper_InfoImg .Info .h3_maker,
.favorite .wrapper_InfoImg .Info .h3_category {
	text-align: left;
	display: inline-block;
	font-size: .9rem;
}

.favorite .wrapper_InfoImg .Info .h3_category::before {
	content: "（";
}

.favorite .wrapper_InfoImg .Info .h3_category::after {
	content: "）";
}

.favorite .h2_ProdcutName {
	font-size: 1.4rem;
	line-height: 1.8rem;
	margin: 15px 0;
}

.favorite .NetPrice,
.favorite .GrossPrice {
	font-size: 1.2rem;
}

.favorite .GrossPrice {
	color: var(--primary-color);
	margin-left: 15px;
}

.favorite .NetPrice::before {
	content: "税抜";
	font-size: .8rem;
	font-weight: var(--font-medium);
	padding-right: 3px;
}

.favorite .GrossPrice::before {
	content: "税込";
	font-size: .8rem;
	font-weight: var(--font-medium);
	padding-right: 3px;
}

.favorite .GrossPrice::after {
	content: none;
}

.favorite .btn_trash {
	margin-bottom: 20px;
}

.favorite .btn_trash .icon_trash {
	width: 20px;
	height: auto;
}

.favorite .wrapper_ActionBtn {
	display: flex;
	align-items: flex-start;
	column-gap: 8px;
	margin: 0;
}

.favorite .quantity-container {
	padding: 14px 8px;
	margin: 0;
	min-height: 50px;
}

.favorite .quantity-button {
	width: 20px;
	height: 20px;
	font-size: 1.2rem;
}

.favorite .quantity-value {
	width: 50px;
}

.favorite .estimate_button,
.favorite .cart_button {
	padding: 15px;
	min-height: 50px;
	font-size: .8rem;
	white-space: nowrap;
	margin: 0;
	justify-content: center;
}

.favorite .estimate_button::before,
.favorite .cart_button::before {
	content: none;
}

/* ======= 会員登録ページ ======= */

.register {
	margin-bottom: 100px;
}

.register .column_right p {
	font-size: .9rem;
	line-height: 1.4rem;
	color: var(--secondary-color);
}

.register .column_right p a {
	color: var(--secondary-color);
	text-decoration: underline;
}

.register .column_right p a:active {
	text-decoration: none;
}

.register .agreement {
	text-align: center;
	margin: 30px 0;
}

.register .agreement label {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;
	font-size: .8rem;
	color: var(--secondary-color);
}

.register .column_left {
	margin-bottom: 30px;
}

.form_register {
	display: flex;
	flex-direction: column;
}

.form_register .input_ver2 {
	padding: 15px;
}

.form_register fieldset {
	padding: 0;
	border: none;
	margin-bottom: 30px;
}

.wrapper_FormInput {
	display: flex;
	column-gap: 10px;
}

.RegiType .wrapper_FormInput {
	column-gap: 20px;
}

.wrapper_FormLabelInput {
	margin-bottom: 30px;
}


.form_register fieldset legend,
.form_register .FormLabel {
	font-size: 1.2rem;
	font-weight: var(--font-thin);
	color: #000;
	display: block;
	margin-bottom: 15px;
}

.form_register fieldset .custom-radio {
	padding: 0;
}

.form_register .list_note {
	font-size: .9rem;
	list-style: none;
	margin: 0;
}

.form_register .list_note li {
	background-image: url("../img/icon-note.svg");
	background-position: left 2.5px;
	background-repeat: no-repeat;
	background-size: 15px;
	padding: 0 0 0 18px;
	line-height: 1.4rem;
	margin-bottom: 10px;
}

.form_register .list_note li:last-child {
	margin-bottom: 0;
}

.AddressColumn {
	flex-wrap: wrap;
}

.wrapper_FormLabelInput input {
	margin-bottom: 10px;
}

.wrapper_FormLabelInput .zipcode {
	width: 200px;
}

.wrapper_FormLabelInput .custom_select {
	position: relative;
	display: inline-block;
	width: calc(100% - 210px);
	max-width: 200px;
	background-color: #E6E6E6;
	margin-bottom: 10px;
	border-radius: 6px;
}

.wrapper_FormLabelInput .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.wrapper_FormLabelInput .custom_select select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	color: #999;
	padding: 15px;
	width: 100%;
	font-size: 1rem;
	line-height: 1.4285rem;
	cursor: pointer;
	background-color: #E6E6E6;
	border: none;
}

.form_register .AddressColumn .list_note {
	margin: 0;
}

.form_register .wrapper_CheckBox label {
	display: flex;
	align-items: center;
	column-gap: 8px;
}

.form_register .width-30 {
	max-width: 120px;
}







/* ======= パスワード再発行ページ ======= */

.form_ResetPass {
	display: flex;
	column-gap: 6px;
	align-items: stretch;
}

.form_ResetPass input {
	width: 80%;
	padding: 15px
}

.form_ResetPass button {
	width: 20%;
	white-space: nowrap;
	padding: 15px;
	font-size: 1rem;
	border-radius: 6px;
	line-height: 1.1;
	color: #fff;
	background-color: var(--button-color);
	display: inline-block;
	text-align: center;
	border: none;
}

/* ======= パスワード再設定ページ ======= */

.form_NewPass {
	display: flex;
	align-items: stretch;
}

.form_NewPass .form-group label {
	display: inline-block;
	font-size: 1rem;
	line-height: 1rem;
}

.form_NewPass button {
	font-size: 1rem;
	white-space: nowrap;
	border-radius: 6px;
	line-height: 1.1;
	color: #fff;
	background-color: var(--button-color);
	display: inline-block;
	text-align: center;
	border: none;
}

/* ======= お問い合わせページ ======= */

.ContactPage {
	margin-bottom: 100px;
}

.ContactPage .column_right p {
	font-size: .9rem;
	line-height: 1.4rem;
	color: var(--secondary-color);
}

.ContactPage .column_right p a {
	color: var(--secondary-color);
	text-decoration: underline;
}

.ContactPage .column_right p a:active {
	text-decoration: none;
}

.ContactPage .agreement {
	text-align: center;
	margin: 30px 0;
}

.ContactPage .agreement label {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;
	font-size: .8rem;
	color: var(--secondary-color);
}

.ContactPage .column_left {
	margin-bottom: 0;
}

.form_contact {
	display: flex;
	flex-direction: column;
}

.form_contact .input_ver2 {
	padding: 15px;
}

.form_contact fieldset {
	padding: 0;
	border: none;
	margin-bottom: 30px;
}

.form_contact fieldset legend,
.form_contact .FormLabel {
	font-size: 1.2rem;
	font-weight: var(--font-thin);
	color: #000;
	display: block;
	margin-bottom: 15px;
}

.form_contact fieldset .custom-radio {
	padding: 0;
}

.form_contact .list_note {
	font-size: .9rem;
	list-style: none;
	margin: 10px 0 0;
}

.form_contact .list_note li {
	background-image: url("../img/icon-note.svg");
	background-position: left 2.5px;
	background-repeat: no-repeat;
	background-size: 15px;
	padding: 0 0 0 18px;
	line-height: 1.4rem;
	margin-bottom: 10px;
	color: var(--secondary-color);
}

.form_contact .list_note li:last-child {
	margin-bottom: 0;
}


.ContactPage .wrapper_FormLabelInput .custom_select {
	width: 100%;
	max-width: 440px;
}

.form_contact .wrapper_CheckBox label {
	display: flex;
	align-items: center;
	column-gap: 8px;
}

.form_contact .width-30 {
	max-width: 120px;
}

/* ======= トピックス ======= */

.TopicsPage {
	margin-bottom: 100px;
}

.wrapper_Topics_Category_menu {}

.Topics_Category_menu {}

.Topics_Category_menu_title {
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	padding-bottom: 25px;
	border-bottom: 2px solid #666;
	line-height: 1rem;
}

.Topics_Category_menu dd {
	border-bottom: 0.5px solid #999;
}

.Topics_Category_menu dd a {
	display: flex;
	align-items: center;
	padding: 18px 10px;
}

.Topics_Category_menu dd a::before {
	content: url(../img/icon-list-item.svg);
	width: 18px;
	height: 18px;
	display: inline-block;
	margin-right: 6px;
}

.Topics_Category_menu dd a.active {
	opacity: 0.2;
}

.table_topics {
	padding: 20px;
	border-bottom: 0.5px dashed #999;
}

.table_topics .topics_text a {
	text-decoration: underline;
}

.table_topics .topics_text a:active {
	text-decoration: none;
}

.topics_date {
	font-weight: var(--font-bold);
	display: inline-block;
	color: var(--secondary-color);
	font-size: .9rem;
}

.topics_category {
	display: inline-block;
	color: var(--secondary-color);
	margin-left: 6px;
	font-size: .9rem;
}

.topics_category::before {
	content: " - ";
	margin-right: 6px;
}

.topics_text {
	margin-top: 10px;
	font-size: 1rem;
	line-height: 1.5rem;
	font-weight: var(--font-medium);
}

.list_TopicsInfo {
	display: flex;
	align-items: baseline;
	padding: 0 20px 40px;
}

.list_TopicsInfo dt {
	font-size: .9rem;
	font-weight: var(--font-thin);
	margin-right: 5px;
}

.list_TopicsInfo dd {
	font-size: .9rem;
	font-weight: var(--font-bold);
}

.list_TopicsInfo dd:first-of-type {
	margin-right: 20px;
}

.TopicsContents {
	padding: 0 20px;
	padding-bottom: 20px;
	border-bottom: 0.5px dashed #999;
}

.TopicsContents p {
	font-size: 1rem;
	line-height: 1.5rem;
	margin-bottom: 1rem;
}

.TopicsContents h2 {
	font-size: 1.4rem;
	line-height: 1.8rem;
	margin-bottom: 1rem;
	margin-top: 2rem;
}


.TopicsPage .pagination .btn_black {
	padding: 15px;
	color: #fff;
	font-size: .9rem;
}

.TopicsPage .pagination .btn_black:active {
	opacity: 0.5;
}


.TopicsPage .wrapper_PageTitle .custom_select {
	position: relative;
}

.TopicsPage .wrapper_PageTitle .custom_select::after {
	content: url("../img/icon-pulldown.svg");
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-60%);
	width: 8px;
	pointer-events: none;
}

.TopicsPage .wrapper_PageTitle .custom_select select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding: 10px 25px 10px 10px;
	width: 130px;
	font-size: .9rem;
	line-height: 1.4285rem;
	cursor: pointer;
	background-color: #f2f2f2;
	color: #666;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}


/* ======= お見積り ======= */

.EstimagePage {
	margin-bottom: 100px;
}

.product_estimate {
	border-bottom: 0.5px solid #999;
	padding: 30px 20px;
}

.product_estimate:nth-of-type(1) {
	border-top: 0.5px solid #999;
}

.product_estimate .wrapper_01 {
	display: flex;
	width: 100%;
	margin-bottom: 20px;
}

.product_estimate figure {
	width: 80px;
	height: 80px;
	margin-bottom: 0;
}

.product_estimate .wrapper_01 .inner {
	padding-left: 15px;
	width: calc(100% - 80px);
}

.product_estimate .h3_maker,
.product_estimate .h3_category {
	display: inline-block;
	line-height: 1rem;
	font-size: .9rem;
}

.product_estimate .h3_category::before {
	content: "（";
}

.product_estimate .h3_category::after {
	content: "）";
}

.product_estimate .h2_ProdcutName {
	font-size: 1.4rem;
	line-height: 1.8rem;
	margin: 10px 0;
	display: block;
}

.product_estimate .wrapper_02 {
	display: flex;
	align-items: center;
}

.product_estimate .wrapper_03 {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.product_estimate .list_icons {
	list-style: none;
	display: flex;
	gap: 5px;
}

.product_estimate .icon_fav {
	width: 22px;
	height: auto;
}

.product_estimate .icon_trash {
	width: 20px;
	height: auto;
}

.product_estimate .quantity-container {
	width: auto;
	min-width: 120px;
	min-height: 50px;
	padding: 0;
	margin: 0 20px 0 0;
}

.product_estimate .quantity-button {
	font-size: 1.2rem;
}

.product_estimate .quantity-value {
	width: 50px;
	font-size: 1.1rem;
}

.product_estimate .price_single {
	font-size: 1rem;
	font-weight: var(--font-bold);
}

.product_estimate .price_total {
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	white-space: nowrap;
}

.product_estimate .price_total::before {
	content: "（税抜）";
	font-size: .7rem;
	font-weight: var(--font-medium);
}

.list_AddEstimate {
	list-style: none;
	background-color: #fff;
	border-top: 0.5px solid #999;
}

.list_AddEstimate dt {
	font-size: 1rem;
	font-weight: var(--font-thin);
	color: #000;
	padding: 20px;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
}

.list_AddEstimate dt::after {
	content: url(../img/icon-down.svg);
	display: inline-block;
	width: 12px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.list_AddEstimate dt:hover {
	opacity: 0.5;
}

.list_AddEstimate dt.active::after {
	transform: rotate(-180deg);
}

.list_AddEstimate dd {
	padding: 0 20px;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease-out, transform 0.3s ease-out, padding 0.3s ease-out;
	height: 0;
	visibility: hidden;
	overflow: hidden;
}

.list_AddEstimate dd.open {
	opacity: 1;
	transform: translateY(0);
	padding: 20px;
	height: auto;
	visibility: visible;
}

.list_AddEstimate .PlusIcon {
	display: flex;
	align-content: center;
}

.list_AddEstimate .PlusIcon::before {
	content: url("../img/icon-plus.svg");
	display: inline-block;
	width: 18px;
	margin-right: 6px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.list_AddEstimate dd h3 {
	font-size: 1rem;
	margin-bottom: 15px;
}

.list_AddEstimate dd p {
	font-size: .9rem;
	line-height: 1.3rem;
	color: var(--secondary-color);
	margin-bottom: 15px;
}

.form_AddEstimate_single {
	background-color: #f2f2f2;
	padding: 20px;
	border-radius: 6px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 30px;
}

.form_AddEstimate_single label {
	display: none;
}

.form_AddEstimate_single input {
	padding: 15px;
}

.form_AddEstimate_single .quantity-container {
	padding: 15px;
	background-color: #fff;
	min-height: inherit;
	width: 50%;
	margin: 0;
	max-width: none;
}


.form_AddEstimate_single .quantity-value {
	font-size: 1rem;
}


.form_AddEstimate_single .quantity-button {
	width: 20px;
	height: 20px;
	font-size: 1.2rem;
}

.form_AddEstimate_single .btn_black {
	padding: 15px;
	width: 50%;
}

.form_AddEstimate_single .form_2columns {
	align-items: stretch;
}

.form_AddEstimate_batch {
	background-color: #f2f2f2;
	padding: 20px;
	border-radius: 6px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.form_AddEstimate_batch textarea {
	padding: 15px;
}

.form_AddEstimate_batch .btn_black {
	padding: 20px 15px;
	width: 100%;
}






/* ======= ご注文フォーム ======= */

.OrderPage {
	margin-bottom: 100px;
}

.product_order {
	border-bottom: 0.5px solid #999;
	padding: 30px 20px;
}

.product_order:nth-of-type(1) {
	border-top: 0.5px solid #999;
}

.product_order .wrapper_01 {
	display: flex;
	width: 100%;
	margin-bottom: 20px;
}

.product_order figure {
	width: 80px;
	height: 80px;
	margin-bottom: 0;
}

.product_order .wrapper_01 .inner {
	padding-left: 15px;
	width: calc(100% - 80px);
}

.product_order .h3_maker,
.product_order .h3_category {
	display: inline-block;
	line-height: 1rem;
	font-size: .9rem;
}

.product_order .h3_category::before {
	content: "（";
}

.product_order .h3_category::after {
	content: "）";
}

.product_order .h2_ProdcutName {
	font-size: 1.4rem;
	line-height: 1.8rem;
	margin: 10px 0;
	display: block;
}

.product_order .wrapper_02 {
	display: flex;
	align-items: center;
}

.product_order .wrapper_03 {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.product_order .list_icons {
	list-style: none;
	display: flex;
	gap: 5px;
}

.product_order .icon_fav {
	width: 22px;
	height: auto;
}

.product_order .icon_trash {
	width: 20px;
	height: auto;
}

.product_order .quantity-container {
	width: auto;
	min-width: 120px;
	min-height: 50px;
	padding: 0;
	margin: 0 20px 0 0;
}

.product_order .quantity-button {
	font-size: 1.2rem;
}

.product_order .quantity-value {
	width: 50px;
	font-size: 1.1rem;
}

.product_order .price_single {
	font-size: 1rem;
	font-weight: var(--font-bold);
}

.product_order .price_total {
	font-size: 1.2rem;
	font-weight: var(--font-bold);
	white-space: nowrap;
}

.product_order .price_total::before {
	content: "（税抜）";
	font-size: .7rem;
	font-weight: var(--font-medium);
}

.wrapper_form_AddOrder {
	padding: 20px;
	border-top: 0.5px solid #999;
}

.wrapper_form_AddOrder p {
	font-size: .9rem;
	line-height: 1.5rem;
	color: var(--secondary-color);
	margin-bottom: 20px;
}

.form_AddOrder {
	background-color: #f2f2f2;
	padding: 20px;
	border-radius: 6px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.form_AddOrder label {
	display: none;
}

.form_AddOrder input {
	padding: 15px;
}

.form_AddOrder .quantity-container {
	padding: 15px;
	background-color: #fff;
	min-height: inherit;
	width: 50%;
	margin: 0;
	max-width: none;
}

.form_AddOrder .quantity-value {
	font-size: 1rem;
}

.form_AddOrder .quantity-button {
	width: 20px;
	height: 20px;
	font-size: 1.2rem;
}

.form_AddOrder .btn_black {
	padding: 15px;
	width: 50%;
}

.form_AddOrder .form_2columns {
	align-items: stretch;
}


/* ======= ご利用ガイド ======= */

.GuidePage {
	margin-bottom: 100px;
}

.guide_menu dd {
	border-bottom: 0.5px solid #999;
}

.guide_menu dd a {
	display: flex;
	align-items: center;
	padding: 18px 10px;
}

.guide_menu dd a::before {
	content: url("../img/icon-list-item.svg");
	width: 18px;
	height: 18px;
	display: inline-block;
	margin-right: 6px;
}

.guide_menu dd a.active {
	opacity: 0.2;
}


.list_guide {
	list-style: none;
}

.list_guide dt {
	font-size: 1.4rem;
	font-weight: var(--font-thin);
	color: #000;
	padding: 20px;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	border-bottom: 0.5px solid #999;
}

.list_guide dt::after {
	content: url(../img/icon-down.svg);
	display: inline-block;
	width: 12px;
	line-height: 1rem;
	transition: transform 0.3s ease;
}

.list_guide dt:active {
	opacity: 0.5;
}

.list_guide dt.active::after {
	transform: rotate(-180deg);
}

.list_guide dd {
	padding: 0 20px;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease-out, transform 0.3s ease-out, padding 0.3s ease-out;
	height: 0;
	visibility: hidden;
	overflow: hidden;
	background-color: #f2f2f2;
	border-bottom: 0.5px solid #999;
}

.list_guide dd.open {
	opacity: 1;
	transform: translateY(0);
	padding: 20px;
	height: auto;
	visibility: visible;
}

.list_guide dd h2 {
	font-size: 1.1rem;
	line-height: 1.6rem;
	margin-bottom: 1.5rem;
}

.list_guide dd h2.h2_HowToOrder {
	font-size: 1.4rem;
	padding-top: 1.5rem;
}


.list_guide dd h3 {
	font-size: 1.1rem;
	line-height: 1.4rem;
	margin-bottom: 1.5rem;
	padding: 3px 10px;
	border-left: 6px solid #333;
	display: inline-block;
	margin-top: 1rem;
}

.list_guide dd h4 {
	font-size: 1rem;
	line-height: 1.4rem;
	margin-bottom: 1rem;
	display: block;
}


.list_guide dd p {
	font-size: 1rem;
	line-height: 1.5rem;
	margin-bottom: 1.5rem;
}

.list_guide dd figure {
	margin-bottom: 1.5rem;
	text-align: center;
}

.list_guide dd figcaption {
	text-align: center;
	font-size: .9rem;
	color: var(--secondary-color);
	margin: 8px auto 0;
	width: 100%;
	max-width: 600px;
}

.list_guide dd figure img {
	width: 100%;
	max-width: 440px;
	border: 0.5px solid #CCC;
}

.wrapper_list_PaymentWays {
	display: flex;
	flex-direction: column;
	margin-bottom: 1.5rem;
}

.wrapper_list_PaymentWays .list_PaymentWays {
	border-left: 0.5px solid #666;
	border-right: 0.5px solid #666;
}

.wrapper_list_PaymentWays .list_PaymentWays dt {
	padding: 15px;
	font-size: 1rem;
	font-weight: var(--font-medium);
	background-color: #999;
	border-top: 0.5px solid #666;
	border-bottom: 0.5px solid #666;
	color: #fff;
}

.wrapper_list_PaymentWays .list_PaymentWays dt::after {
	content: none;
}

.wrapper_list_PaymentWays .list_PaymentWays dd {
	padding: 15px;
	opacity: 1;
	transform: translateY(0);
	height: auto;
	visibility: visible;
	overflow: auto;
	border-bottom: none;
}

.wrapper_list_PaymentWays .list_PaymentWays dd.LastChild {
	border-bottom: 0.5px solid #666;
}

.wrapper_list_PaymentWays .list_PaymentWays dd .list_creditCard {
	list-style: none;
	margin-bottom: 1.5rem;
}

.wrapper_list_PaymentWays .list_PaymentWays img.logo_visa {
	height: 18px;
}

.wrapper_list_PaymentWays .list_PaymentWays img {
	height: 30px;
}

.wrapper_list_PaymentWays .list_PaymentWays dd .list_normal {
	margin: 0 0 0 18px;
	font-size: .9rem;
	line-height: 1.3rem;
}

.wrapper_list_PaymentWays .list_PaymentWays dd .list_normal li {
	margin-bottom: 3px;
}

.GuidePage .emphasize {
	font-weight: var(--font-bold);
	color: var(--accent-color);
}

.table_ShippingFee {
	width: 100%;
	max-width: 900px;
	border-collapse: collapse;
}

.table_ShippingFee th,
.table_ShippingFee td {
	border: 0.5px solid #666;
	/* ← これで上下左右に線がつく */
	padding: 15px;
	text-align: center;
}

.table_ShippingFee th {
	background-color: #999;
	font-weight: var(--font-medium);
	color: #fff;
}

.table_ShippingFee th.title {
	width: 30%;
}

.table_ShippingFee td .tax {
	font-size: .7rem;
	padding-right: 4px;
}

.list_shippingTime {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px 25px;
	padding: 0;
	margin: 0 0 0 18px;
	font-size: 1.1rem;
	list-style: circle;
	max-width: 400px;
	margin-bottom: 1.5rem;
}

.list_shippingTime li {}

.list_shippingTime li:nth-child(1) {
	grid-column: 1;
	grid-row: 1;
}

.list_shippingTime li:nth-child(2) {
	grid-column: 1;
	grid-row: 2;
}

.list_shippingTime li:nth-child(3) {
	grid-column: 1;
	grid-row: 3;
}

.list_shippingTime li:nth-child(4) {
	grid-column: 2;
	grid-row: 1;
}

.list_shippingTime li:nth-child(5) {
	grid-column: 2;
	grid-row: 2;
}

.list_shippingTime li:nth-child(6) {
	grid-column: 2;
	grid-row: 3;
}

.list_ReturnFees {
	list-style: none;
	margin: 2rem 0;
	width: auto;
}

.list_ReturnFees li {
	margin-bottom: 12px;
}

.list_ReturnFees li span {
	font-weight: var(--font-bold);
}

.list_ReturnNG {
	list-style: decimal;
	margin: 2rem 0 2rem 20px;
}

.list_ReturnNG li {
	margin-bottom: 10px;
}

.list_normal {
	margin: 0 0 0 18px;
	font-size: .9rem;
	line-height: 1.3rem;
}

.list_normal li {
	margin-bottom: 3px;
}

.InstallationFee {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 1.5rem;
	align-items: center;
	position: relative;
	max-width: 620px;
}

.InstallationFee .left {
	display: inline-block;
	padding: 0 0 12px 0;
	margin-bottom: 12px;
	line-height: 1.4rem;
	width: 70%;

}

.InstallationFee .right {
	display: inline-block;
	padding: 0 0 12px 0;
	margin-bottom: 12px;
	line-height: 1.4rem;
	text-align: right;
	font-weight: var(--font-bold);
}

.InstallationFee .right span {
	font-size: .8rem;
	font-weight: var(--font-medium);
	display: block;
}

.InstallationFee .right::after {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	width: 100%;
	height: 0.5px;
	border-top: 0.5px dashed#999;
	margin-top: 12px;
}




/* ======= トースト通知 ======= */

.Toast_Message {
	position: fixed;
	width: 80%;
	top: calc(var(--header-height) + 30px);
	right: 5%;
	border-radius: 6px;
	left: 50%;
	transform: translateX(-50%);
	background-color: #fff;
	color: var(--accent-color);
	z-index: 9999;
	padding: 15px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
	font-size: 1rem;
	line-height: 1.6rem;
	border: 3px solid var(--accent-color);
}

.Toast_Message .product_text {
	font-weight: var(--font-bold);
}

.list_toast {
	margin-left: 10px;
	margin-bottom: 5px;
}


/* ======= FAXのご注文・お見積もり ======= */

.FaxPage {
	margin-bottom: 100px;
}

.FaxPage .column_right {
	display: none;
}

.FaxPage .column_left {
	width: 100%;
}

.FaxPage .column_left p {
	line-height: 1.5rem;
	margin-bottom: 2rem;
}

.wrapper_FaxButtons {
	display: flex;
	flex-direction: column;
	align-content: center;
	gap: 10px;
	margin-bottom: 2rem;
}

.FaxNumber {
	font-size: 2.5rem;
	font-weight: var(--font-thin);
	text-align: left;
	margin-bottom: 2rem;
}

.FaxNumber span {
	padding-right: 5px;
}

/* ======= プライバシーポリシー ======= */

.PrivacyPolicyPage {
	margin-bottom: 100px;
}

.PrivacyPolicyPage .column_right {
	display: none;
}

.PrivacyPolicyPage .column_left {
	width: 100%;
}

.PrivacyPolicyPage .column_left h3 {
	font-size: 1.1rem;
	line-height: 1.4rem;
	margin-bottom: 1.5rem;
	padding: 3px 10px;
	border-left: 6px solid #333;
	display: inline-block;
	margin-top: 1rem;
}

.PrivacyPolicyPage .column_left h3.FirstChild {
	margin-top: 0;
}

.PrivacyPolicyPage .column_left p {
	line-height: 1.5rem;
	margin-bottom: 1.5rem;
}

.PrivacyPolicyPage .column_left p a {
	text-decoration: underline;
}

.PrivacyPolicyPage .column_left p a:active {
	text-decoration: none;
}

.PrivacyPolicyPage .column_left .list_normal {
	line-height: 1.5rem;
	font-size: 1rem;
	margin-bottom: 1.5rem;
}

.br1280 {
	display: none;
}


/* ======= 特定商取引法に基づく表記＆運営会社 ======= */

.TermsPage,
.CompanyPage {
	margin-bottom: 100px;
}

.TermsPage .column_right,
.CompanyPage .column_right {
	display: none;
}

.TermsPage .column_left,
.CompanyPage .column_left {
	width: 100%;
}

.dl_TermsCompany {
	line-height: 1.5rem;
}

.dl_TermsCompany dt {
	font-weight: var(--font-bold);
	line-height: 1.2rem;
	margin-bottom: 1.5rem;
	padding: 0 0 0 10px;
	border-left: 6px solid #333;
	display: inline-block;
	margin-top: 1rem;
}

.dl_TermsCompany dd {
	margin-bottom: 1.5rem;
}

.dl_TermsCompany a {
	text-decoration: underline;
}

.dl_TermsCompany a:active {
	text-decoration: none;
	opacity: 1;
}

/* ======= 各種完了ページ ======= */

.CompletePage {
	margin-bottom: 100px;
}

.CompletePage .column_left h2,
.CompletePage .column_right h2 {
	font-size: 1.3rem;
	margin-bottom: 1.5rem;
}

.CompletePage .column_left p,
.CompletePage .column_right p {
	margin-bottom: 1.8rem;
	line-height: 1.5rem;
}

.CompletePage .column_left p a {
	text-decoration: underline;
}

.CompletePage .column_left p a:active {
	text-decoration: none;
}

.CompletePage .OrderHistory {
	background-color: #f2f2f2;
	padding-top: 20px;
	padding-bottom: 20px;
	border-bottom: none;
	margin-bottom: 60px;
}

.CompletePage .OrderHistory .head {
	margin-bottom: 0;
}

.CompletePage .OrderHistory .middle,
.CompletePage .OrderHistory .middle .list_BreakDown_order {
	margin-bottom: 0;
}

.CompletePage .column_right .wrapper_ButtonErea {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
}

.CompletePage .column_right .list_notice {
	padding: 0;
	margin-bottom: 40px;
}

.CompletePage .column_right .list_notice p {
	margin: 0;
}

.CompletePage .column_right .list_notice li:first-child {
	border-top: 0.5px solid #999;
}

.CompletePage .column_right .wrapper_ButtonErea a {
	width: 100%;
}

.CompletePage .column_right .Bottom_0 {
	margin-bottom: 0;
}

.CompletePage .column_left .wrapper_ButtonErea {
	display: flex;
	flex-direction: column;
	gap: 10px;
}





/* ======= よくある質問 ======= */

.FAQpage {
	margin-bottom: 100px;
}