@charset “UTF-8”;
/* =============================================================================

CSS Information

 File name:	common.css

 Style Info:	レイアウト設定 & 全ページ共通CSS

============================================================================= */

:root {
	--color-text      : #333;
	--color-body      : #FFF;
	--color-bg-base   : #f4f3ef;
	--color-bg-light  : #efeee8;
	--color-bg-or     : #efd9ce;

	--color-primary   : #e52a00;
	--color-secondary : #4f8f2b;

	--color-line      : #22ba4f;
	--color-fb        : #315096;
	
	--color-white     : #FFF;
	--color-gray-100  : #f0f0f0;
	--color-gray-200  : #e6e6e6;
	--color-gray-300  : #CCCCCC;
	--color-gray-600  : #737373;
	--color-gray-800  : #4b4b4b;
	--color-black     : #000;
	
	--color-dred      : #C00;
	
	--layer_dark      : rgba(0,0,0,.75);

	--grade-bl        : linear-gradient( 0deg, #333333 0%, #737373 100%);
	--grade-rd        : linear-gradient( 0deg, #be1400 0%, #e52a00 100%);

	--font-main: 'Noto Sans JP', 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	--font-mincho: 'Noto Serif JP', '游明朝', YuMincho, 'Hiragino Mincho ProN W3', 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: 70px;
}

body {
	overflow-x: hidden;
	position: relative;
	background: var(--color-body);
	color: var(--color-text);
	font-size: 1.4rem;
	font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	line-height: 1.8;
}
@media only screen and (min-width: 768px) {
	body {
		font-size: 1.6rem;
	}
}

.font_mincho {
	font-family: '游明朝', YuMincho, 'Hiragino Mincho ProN W3', 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif;
}

a {
	color: var(--color-text);
	text-decoration: underline;
}
a:hover {
	opacity: .8;
	color: inherit;
	text-decoration: none;
}

a:hover img {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

em {
	font-style: normal;
}

strong {
	font-weight: bold;
}

.clearfix::after {
	content: '';
	display: block;
	clear: both;
	height: 0;
}

p {
	margin: 0;
	padding: 0;
}

.vibtn {
	position: absolute;
	visibility: hidden;
}


/* -----------------------------------------------------------------------------

 Future shop コマースクリエーター style [スタートアップテーマ(PC/タブレット)ベース]

----------------------------------------------------------------------------- */

.fs-preview-header {
	display: none;
}

.fs-l-header {
	padding-top: 0;
}

.fs-l-header--min {
	border-bottom: none;
}

.fs-l-footer {
	margin-top: 0;
	background: none;
	border-top: none;
}

/* ログイン/ログアウト：表示非表示 
.member.my_true ,
.mypage.my_false {
	display: none;
}*/
.logout.my_false ,
.login.my_true {
	display: none;
}


/* -------------------------------------------------------------------------------

 header

------------------------------------------------------------------------------- */

.headline {
	padding: 8px 0;
	background: var(--color-primary);
	color: var(--color-white);
}
.headline h1 {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 20px;
	font-size: min(1.3rem,3vw);
}

.header__body {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1240px;
	margin: 0 auto;
}
.header .logo-area {
	width: 240px;
	max-width: 45%;
	line-height: 1;
}
.header .logo-area a {
	display: block;
}


/* PC/SP 共通：utility navi
----------------------------------------------------------- */

.unavi__wrapper {
	display: flex;
	justify-content: flex-end;
	gap: 30px;
	margin-bottom: 8px;
}
.unavi {
	position: relative;
	display: flex;
	justify-content: flex-end;
	gap: 18px;
	line-height: 1.6;
}
.unavi a {
	position: relative;
	display: block;
	padding-left: 24px;
	font-size: 1.4rem;
	text-decoration: none;
}
.unavi a::before {
	position: absolute;
	content: '';
	top: calc( 50% - 11px );
	left: 0;
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 80%;
}
.unavi__item--info a::before {
	background-image: url(../images/common/icon_bord.svg);
}
.unavi__item--guide a::before {
	background-image: url(../images/common/icon_hatena.svg);
}
.unavi__item--contact a::before {
	background-image: url(../images/common/icon_mail.svg);
}


.ubtn {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	line-height: 1.5;
}
.ubtn a {
	display: block;
	width: 120px;
	padding: 9px 5px;
	border-radius: 4px;
	color: var(--color-white);
	font-size: 1.5rem;
	text-align: center;
	text-decoration: none;
}
.ubtn .member a {
	background: var(--grade-bl);
}
.ubtn .login a ,
.ubtn .logout a {
	background: var(--grade-rd);
}

.user-info {
	text-align: right;
}

/* navbar
----------------------------------------------------------- */

.navbar {
	position: relative;
	width: 100%;
	background: var(--color-gray-200);
	line-height: 1.2;
	z-index: 2300;
}
.navbar.fixed {
	position: fixed;
	top: 0;
	left: 0;
}
.navbar__body {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1240px;
	margin: 0 auto;
	padding: 10px;
}
.search {
	position: relative;
	display: flex;
	justify-content: space-between;
	gap: 10px;
	flex: 1 1 740px;
}
.hbtn__wrapper {
	width: 321px;
}

/* search */
.search__form {
	overflow: hidden;
	flex: 0 1 620px;
	border-radius: 4px;
	border: 1px solid var(--color-text);
	background: var(--color-white);
}
.search__form form {
	display: flex;
}
.search__form .select_wrap {
	position: relative;
	display: block;
	width: 160px;
	padding-right: 16px;
	border-right: 1px solid var(--color-text);
}
.search__form .select_wrap::before {
    position: absolute;
    content: '';
    top: calc(50% - 4px);
    right: 10px;
    display: block;
    width: 10px;
    height: 8px;
    background: url("data:image/svg+xml,%3Csvg width='10' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m-.001.001h9.101l-4.101 7.998z' fill='%234b4b4b' fill-rule='evenodd'/%3E%3C/svg%3E") no-repeat center / contain;
}
.search__form select {
	border: none;
	width: 100%;
	height: 50px;
	text-align: center;
}
.search__form .input_wrap {
	display: block;
	flex: 1 1 390px;
}
.search__form input {
	width: 100%;
	height: 44px;
	padding: 0 4px;
	-webkit-appearance: none;
	appearance: none;
	border: none;
	border-radius: 0;
	outline: none;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	font-size: min(1.6rem,3.5vw);
}
.search__form .button_wrap {
	display: block;
	width: 70px;
	background: var(--grade-bl);
}
.search__form button {
	width: 100%;
	height: 48px;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	border: none;
	border-radius: 0;
	outline: none;
	color: var(--color-white);
}
@media only screen and (max-width: 767px) {
	.search__form button {
	height: 12.5vw;
	}
}

.search__detail-btn {
	width: 120px;
}
.search__detail-btn label {
	cursor: pointer;
	display: block;
	width: 100%;
	padding: 10px 0;
	border-radius: 4px;
	border: 1px solid var(--color-text);
	background: var(--color-white);
	font-size: min(1.6rem,3vw);
	font-weight: 600;
	text-align: center;
}
.search__detail-btn label:hover {
	opacity: .8;
}
.search__detail-btn label::after {
	content: '';
	display: inline-block;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	margin-top: -.2em;
	margin-left: .3em;
	background: 50% 55% / 50% var(--color-primary) url("data:image/svg+xml,%3Csvg width='12.4' height='9.4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m9.352 1.377-3.551 4.289-3.55-4.289' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat;
	vertical-align: middle;
}

.search__detail {
	position: absolute;
	max-height: 0;
	overflow: hidden;
	transition: .3s;

	top: 64px;
	right: 0;
	width: calc(100%);
	padding: 0 20px;
}
#search-detail:checked ~ .search__detail {
	display: block;
	max-height: 1000px;
	padding: 20px 20px 20px;
	background: var(--color-white);
	box-shadow: 0 6px 10px rgba(0, 0, 0, .2);
}
.search__detail-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}
.search__detail-title {
	font-size: 4.5vw;
	font-weight: 600;
}
.search__detail-head .close-icon {
	position: relative;
	display: block;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--color-gray-600);
}
.search__detail-head .close-icon::before ,
.search__detail-head .close-icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 70%;
	height: 2px;
	background: var(--color-white);
	transform-origin: center;
}
.search__detail-head .close-icon::before {
	transform: translate(-50%, -50%) rotate(45deg);
}
.search__detail-head .close-icon::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

.search__detail-list {
	font-size: min(1.5rem,4vw);
}
.search__detail-list dt {
	padding-bottom: .5em;
}
.search__detail-list dd {
	padding-bottom: 15px;
}
.search__detail-list dd :where(select,input) {
	width: auto;
	border-radius: 4px;
	border: 1px solid var(--color-text);
}
.search__detail-list .select_wrap {
	position: relative;
	display: inline-block;
	border-right: 1px solid var(--color-text);
}
.search__detail-list .select_wrap::before {
    position: absolute;
    content: '';
    top: calc(50% - 4px);
    right: 10px;
    display: block;
    width: 10px;
    height: 8px;
    background: url("data:image/svg+xml,%3Csvg width='10' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m-.001.001h9.101l-4.101 7.998z' fill='%234b4b4b' fill-rule='evenodd'/%3E%3C/svg%3E") no-repeat center / contain;
}
.search__detail-list .input_wrap input {
	width: 100%;
}
.search__detail-list .price_wrap input {
	width: 38%;
}
.search__detail-submit {
	text-align: center;
}
.search__detail-submit button {
	width: 8em;
	padding: 10px 5px;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	background: var(--grade-bl);
	border: none;
	border-radius: 5px;
	outline: none;
	color: var(--color-white);
}

/* hbtn
------------------------------------------------------------- */

.hbtn {
	display: flex;
	justify-content: flex-end;
}
.hbtn--sp {
	padding: 10px 10px 10px 5px;
}
.hbtn--pc {
	border-left: 1px solid var(--color-gray-200);
}
.hbtn a {
	position: relative;
	display: block;
	border-left: none;
	font-size: min(1.3rem,2.5vw);
	text-align: center;
	text-decoration: none;
}
.hbtn--sp a {
	padding: 0 4px;
}
.hbtn--pc a {
	padding-top: 8px;
	width: 80px;
	height: 70px;
	border: 1px solid var(--color-gray-200);
	background-image: linear-gradient( 0deg, #f0f0f0 0%, #ffffff 100%);
}
.hbtn a::before {
	display: block;
	content: '';
	margin: 0 auto 4px;
	background: center / contain no-repeat;
}
.hbtn--sp a::before {
	width: 27px;
	height: 27px;
}
.hbtn--pc a::before {
	width: 36px;
	height: 36px;
}
.hbtn .history a::before {
	background-image: url(../images/common/icon_history.svg);
}
.hbtn .mypage a::before {
	background-image: url(../images/common/icon_user.svg);
}
.hbtn .favo a::before {
	background-image: url(../images/common/icon_favo.svg);
}
.hbtn .cart a::before {
	background-image: url(../images/common/icon_cart.svg);
}

.hbtn li.cart {
	position: relative;
}
.hbtn li.cart a {
	color: var(--color-primary);
}
.hbtn .cart-badge {
	position: absolute;
	top: 0;
	right: 0;
	width: 1.5em;
	height: 1.5em;
	border-radius: 50%;
	background-color: var(--color-dred);
	color: var(--color-white);
	font-size: min(1.2rem,2.5vw);
	text-align: center;
	line-height: 1.5;
}


/* menu
------------------------------------------------------------- */

.burger {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2400;
}

/* ハンバーガーメニュー */
.burger_icon {
	display: block;
	width: 70px;
	height: 70px;
	padding: 25px 14px 0;
	background-color: var(--color-primary);
	font-size: 1rem;
	color: var(--color-white);
}
.burger_icon .text {
	display: block;
	margin: 14px -10px 0;
	text-align: center;
}
.burger_icon .burger_bar {
	position: relative;
	display: block;
	width: 30px;
	height: 3px;
	margin: 0 auto;
	border-radius: 50vh;
	background-color: var(--color-white);
	transition: 0.4s;
}
.burger_icon .burger_bar::before ,
.burger_icon .burger_bar::after {
	position: absolute;
	content: '';
	left: 0;
	width: 100%;
	height: 3px;
	border-radius: 50vh;
	background-color: var(--color-white);
	transition: 0.4s;
}
.burger_icon .burger_bar::before {
	top: -10px;
}
.burger_icon .burger_bar::after {
	bottom: -10px;
}

/* レイヤー */
.burger_btn_area .layer {
	position: absolute;
}
input[type="checkbox"]#burger_btn:checked ~ .layer {
	position: fixed;
	content: '';
	width: 100%;
	height: 100%;
	background: 95% 5% / 32px auto url(../images/common/icon_close_wh.svg) no-repeat rgba(0 0 0 / 60%);
	top: 0;
	right: 0;
	visibility: visible;
	z-index: 2410;
}

/* メニュー：OPEN/CLOSE */
.burger_content {
	position:fixed;
	overflow: scroll;
	top: 0;
	left: -90%;
	width: 82%;
	height: calc(100vh);
	padding: 20px;
	background: var(--color-white);
	color: var(--color-text);
	opacity: 0;
	z-index: 2450;
	transition: 0.1s ease-in-out;
}
input[type="checkbox"]:checked ~ .burger_content {
	overscroll-behavior-y: contain;
	-webkit-overflow-scrolling: touch;
	left: 0;
	opacity: 1;
}

.burger__head {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
}
.burger__head-home a {
	font-size: 1rem;
	text-decoration: none;
	line-height: 1.2;
}
.burger__head-home a::before {
	display: block;
	content: '';
	width: 2.5em;
	height: 2.5em;
	margin: 0 auto;
	background: center / contain url(../images/common/icon_home.svg) no-repeat;
}
.burger__head-member {
	font-size: 1.5rem;
}

.burger_content .ubtn {
	margin-bottom: 20px;
}
.burger_content .ubtn li {
	width: calc((100% - 10px) / 2);
}
.burger_content .ubtn a {
	width: 100%;
}

.bnavi__block {
	margin-left: -20px;
	margin-right: -20px;
}
.bnavi dt {
	padding: 5px 15px;
	background: var(--color-gray-200);
	font-weight: 600;
}
.bnavi dd a {
	position: relative;
	display: block;
	padding: 12px 20px;
	border-bottom: 1px solid var(--color-gray-300);
	font-size: 1.6rem;
	text-decoration: none;
}
.bnavi dd a::after {
	position: absolute;
	content: '';
	top: calc(50% - .5em);
	right: 20px;
	display: block;
	width: 1em;
	height: 1em;
	background: right center / contain url("data:image/svg+xml,%3Csvg width='9.4' height='12.4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.377 2.249 4.289 3.55-4.289 3.55' fill='none' stroke='%234b4b4b' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat;
}


@media only screen and (max-width: 767px) {
	.headline ,
	.search__form .select_wrap ,
	.hbtn__wrapper ,
	.header__utility {
		display: none;
	}
	.header__wrapper {
		height: 120px;
	}
	.header__body {
		height: 70px;
		margin-left: 70px;
	}
}

@media only screen and (min-width: 768px) {
	.burger ,
	.burger_area ,
	.header__spbtn01 ,
	.header__spbtn02 {
		display: none;
	}
	.header__body {
		padding: 0 20px;
	}
	.header .logo-area {
		display: flex;
		align-items: center;
		gap: 20px;
		width: 440px;
		max-width: 50%;
	}
	.header .logo-area a {
		padding-top: 1.5%;
		width: 60%; /* 264 */
	}
	.header .logo-area .hbnr {
		flex: 1;
	}
	.header__utility {
		flex: 1;
	}
	.hbtn .cart-badge {
		top: 5px;
		right: 10px;
		width: 2em;
		height: 2em;
		line-height: 2;
	}
	.navbar__body {
		padding: 0 20px;
	}
	.search {
		justify-content: flex-start;
		flex: 0 1 740px;
	}
	.search__form input {
		height: 52px;
	}
	.search__form button {
		height: 55px;
	}
	.search__detail-btn label {
		padding: 18px 0;
		white-space: nowrap;
	}
	.search__detail {
		top: 64px;
		width: calc(100% - 100px);
	}
	.search__detail-head {
		margin-bottom: 20px;
	}
	.search__detail-title {
		font-size: 1em;
	}
	.search__detail-list dt {
		clear: both;
		float: left;
		width: 8em;
		padding-top: .5em;
		padding-bottom: 0;
	}
	.search__detail-list dd {
		padding-bottom: 20px;
		padding-left: 8.5em;
	}
	.search__detail-list .input_wrap input {
		width: 90%;
	}
}

.hbnr_ranking {
	padding: 5px 10px 10px;
	text-align: center;
}


/* -----------------------------------------------------------------------------

メインコンテンツ : fs-l-main / fs-l-pageMain / side

※ fs で始まるクラスはショップ全体にかかわるので、変更するときは注意 ※
※ 変更する時はそのページの body のクラス名を調べてページだけ適応する ※

----------------------------------------------------------------------------- */

.fs-l-main {
	position: relative;
	display: block;
	max-width: 1230px;
	margin: 0 auto;
	padding: 30px 15px;
}

@media only screen and (min-width: 768px) {
	.fs-l-main {
		display:flex;
		flex-direction: row-reverse;
		flex-wrap: wrap;
		gap: 36px;
		padding: 0 15px 80px;
	}
	.fs-c-panelContainer {
		width: 100%;
	}
	.fs-l-pageMain {
		flex: 1;
		min-width: 0;
	}
	.side {
		width:240px;
		flex-shrink:0;
	}
	
}

.fs-c-breadcrumb {
	max-width: 1220px;
	margin: 15px auto;
	padding: 0 10px;
}

/* -----------------------------------------------------------------------------

 side

----------------------------------------------------------------------------- */

.side_btn-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 20px;
}
.side_btn-list a {
	position: relative;
	display: block;
	padding: 11px 10px;
	border-radius: 4px;
	background: var(--grade-bl) var(--color-text);
	color: var(--color-white);
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	line-height: 1.5;
}
.side_btn-list a::after {
	position: absolute;
	content: '';
	top: calc(50% - .5em);
	right: 10px;
	display: block;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	background: center / 50% url("data:image/svg+xml,%3Csvg width='9.4' height='12.4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.377 2.249 4.289 3.55-4.289 3.55' fill='none' stroke='%234b4b4b' stroke-width='1.6'/%3E%3C/svg%3E") var(--color-white) no-repeat;
}


.side_bnr-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 20px;
}
.side_bnr-list a {
	display: block;

}
@media only screen and (max-width: 767px) {
	.side_bnr-list {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 15px;
	}
	.side_bnr-list li {
		width: calc((100% - 15px) / 2);
	}
}

.side-title {
	margin-bottom: 10px;
	padding: 8px 10px;
	border-radius: 3px;
	background: var(--color-gray-800);
	color: var(--color-white);
}

.side-cate__list {
	margin-bottom: 20px;
}
.side-cate__item {
	border-bottom: 1px solid var(--color-gray-300);
}

.side-cate__item .parent {
	position: relative;
	cursor: pointer;
	padding: 6px 10px;
}
.side-cate__item .parent .icon {
	display: inline-block;
	width: 36px;
	margin-right: .5em;
}
.side-cate__item .parent::after {
	position: absolute;
	top: calc(50% - .5em);
	right: 10px;
	content: '';
	display: block;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	background: 50% 55% / 50% var(--color-primary) url("data:image/svg+xml,%3Csvg width='12.4' height='9.4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m9.352 1.377-3.551 4.289-3.55-4.289' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat;
}
.side-cate__item.is-active .parent {
	background: var(--color-primary);
	color: var(--color-white);
}
.side-cate__item.is-active .parent::after {
	background: 50% 55% / 50% var(--color-white) url("data:image/svg+xml,%3Csvg width='12.4' height='9.4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m9.352 1.377-3.551 4.289-3.55-4.289' fill='none' stroke='%23e52a00' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat;
}

.side-cate__list .child {
	max-height: 0;
	overflow: hidden;
	transition: 0.3s;
}
.side-cate__item.is-active .child {
	max-height: 1250px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.side-cate__list li.index {
	border-bottom: 1px dashed  var(--color-gray-300);
}
.side-cate__list a {
	position: relative;
	display: block;
	padding: 4px 0 4px 20px;
	font-size: min(1.5rem,3.5vw);
	text-decoration: none;
}
.side-cate__list a::before {
	position: absolute;
	content: '';
	top: calc(50% - 3px);
	left: 10px;
	display: block;
	width: 5px;
	height: 6px;
	background: url("data:image/svg+xml,%3Csvg width='5' height='6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 6.001v-6l4.1 3z' fill='%234b4b4b' fill-rule='evenodd'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* -----------------------------------------------------------------------------

 footer

----------------------------------------------------------------------------- */

/* page top
-----------------------------------------------------------*/

.page_top {
	position: fixed;
	overflow: hidden;
	bottom: 10px;
	right: 10px;
	z-index: 5000;
}
.page_top a {
	cursor: pointer;
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 50vw;
	background: url('data:image/svg+xml,%3Csvg%20enable-background%3D%22new%200%200%2036%2020%22%20height%3D%2220%22%20viewBox%3D%220%200%2036%2020%22%20width%3D%2236%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m35.6%2018.1c0%20.5-.2.9-.5%201.3-.7.7-1.8.7-2.5%200l-14.8-15.2-14.8%2015.2c-.7.7-1.8.7-2.5%200s-.7-1.8%200-2.5l16.1-16.4c.7-.7%201.8-.7%202.5%200l16%2016.4c.3.3.5.8.5%201.2z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E') rgba(0,0,0,0.6)  50% 45% no-repeat;
	background-size: 40% auto;
	text-indent: 100%;
	white-space: nowrap;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s, visibility 0.3s;
}
.page_top.is-show a {
	opacity: 1;
	visibility: visible;
}


/* footer
----------------------------------------------------------- */

.footer {
	clear: both;
	color: var(--color-text);
}
.footer__main {
	background: var(--color-gray-100);
}
/* 営業日カレンダー */
.footer .fguide__calendar .calendar {
	display: flex;
	justify-content: space-between;
	margin: 0 0 10px;
}
.footer .fguide__calendar .calendar .calendar-box{
	width: 200px;
}
.footer .fguide__calendar .calendar table {
	width: 100%;
	line-height: 1.25;
	font-size: 13px;
	text-align: center;
	border: 1px solid #737373;
	border-collapse: collapse;
	color: #000;
	background: #FFFFFF;
}
/* 月名 */
.footer .fguide__calendar .calendar caption {
	padding: 3px;
	text-align: center;
	font-size: 15px;
	color: #333333;
}
.footer .fguide__calendar .calendar caption span {
	font-weight: 700;
}
/* 曜日 */
.footer .fguide__calendar .calendar th {
	padding: 5px 0;
	width: calc(100% / 7);
	border: 1px solid #250e13;
}

/* 日付の枠 */
.footer .fguide__calendar .calendar td {
	padding: 5px 0;
	width: calc(100% / 7);
	border: 1px solid #250e13;
}
.footer .fguide__calendar .calendar td.sunday {
}
.footer .fguide__calendar .calendar td.saturday {
}
.footer .fguide__calendar .calendar td.close {
	color: #fff;
	background: #E2300F;
}

/* カレンダーの色説明 */
.footer .fguide__calendar .txt-close {
	font-size: 15px;
	line-height: 1.4;
}
.footer .fguide__calendar .txt-close .mark-close {
	color: #E2300F;
	margin: 0 5px 0 0;
}
.footer .fguide__calendar .txt-close-note {
	font-size: 15px;
}
@media only screen and (max-width: 767px) {
	/* 営業日カレンダー */
	.footer .fguide__calendar .calendar {
		margin: 0 3vw 3vw;
	}
	.footer .fguide__calendar .calendar .calendar-box{
		width: 48%;
	}
	.footer .fguide__calendar .calendar caption {
		padding: 1vw 1vw 1.5vw;
		font-size: 3.6vw;
	}
	.footer .fguide__calendar .calendar table {
		font-size: 3.2vw;
		line-height: 1;
	}
	.footer .fguide__calendar .calendar th {
		padding: 1vw 0;
	}
	.footer .fguide__calendar .calendar td {
		padding: 1vw 0;
	}
	.footer .fguide__calendar .txt-close {
		font-size: 4vw;
		margin: 0 3vw;
		}
	.footer .fguide__calendar .txt-close-note {
		font-size: 4vw;
		margin: 0 3vw;
	}
}

/* fguide
----------------------------------------------------------- */

.fguide {
	position: relative;
	max-width: 1240px;
	margin: 0 auto;
	padding: 8vw 3vw;
}
.fguide__title {
	margin-bottom: 10px;
	padding: 10px 10px;
	border-radius: 3px;
	background: var(--color-gray-800);
	color: var(--color-white);
	font-weight: 600;
	font-size: 1.5rem;
}
.fguide__text:not(:last-child) {
	margin-bottom: 30px;
}
.fguide__text p:not(:last-child) {
	margin-bottom: .5em;
}
.fguide__text img {
	margin-bottom: 1em;
}
.fguide__text a {
	font-size: 1.3rem;
}
@media only screen and (max-width: 767px) {
	.fguide__item:not(:last-child) {
		display: none;
	}
}
@media only screen and (min-width: 768px) {
	.fguide {
		display: flex;
		gap: 40px;
		padding: 50px 20px;
	}
	.fguide__item {
		width: 350px;
		max-width: 30%;
	}
	.fguide__item:last-child {
		width: 420px;
		max-width: none;
		flex: 1;
	}
	.fguide__text {
		font-size: 1.5rem;
	}
}


/* bottom
----------------------------------------------------------- */

.finfo__list a {
	display: block;
	text-decoration: none;
}

.footer .copy {
	padding: 15px 10px;
	font-size: min(1.2rem,2.8vw);
	text-align: center;
}

@media only screen and (max-width: 767px) {
	.finfo__list {
		border-top: 1px solid var(--color-gray-300);
	}
	.finfo__list li {
		border-bottom: 1px solid var(--color-gray-300);
	}
	.finfo__list a {
		position: relative;
		padding: 12px 20px;
		font-size: 1.6rem;
	}
	.finfo__list a::after {
		position: absolute;
		content: '';
		top: calc(50% - .5em);
		right: 20px;
		display: block;
		width: 1em;
		height: 1em;
		background: right center / contain url("data:image/svg+xml,%3Csvg width='9.4' height='12.4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.377 2.249 4.289 3.55-4.289 3.55' fill='none' stroke='%234b4b4b' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat;
	}
}
@media only screen and (min-width: 768px) {
	.footer__bottom {
		padding: 30px 20px 20px;
	}
	.finfo__list {
		display: flex;
		justify-content: center;
		margin-bottom: 30px;
		line-height: 1.2;
	}
	.finfo__list li:not(:last-child) {
		border-right: 1px solid var(--color-text);
	}
	.finfo__list a {
		padding: 0 1em;
		font-size: min(1.3rem,3vw);
	}
	.footer .copy {
		padding: 10px;
	}
}


/*-------------------------------------------------------------------------------

 メインカラム 共通部分 / 汎用パーツ

-------------------------------------------------------------------------------*/

/* content
-----------------------------------------------------------*/

.container {
	margin-bottom: 30px;
}

@media only screen and (min-width: 768px) {
	.container {
		margin-bottom: 60px;
	}
}


/* 見出し
-----------------------------------------------------------*/

.title_block {
	margin-bottom: 15px;
}
.title_block :where(h2,h3){
	border-bottom: 1px solid var(--color-gray-800);
	line-height: 1.6;
}
.title_block .en {
	display: inline-block;
	margin-right: .5em;
	font-size: min(3rem,6.5vw);
}
.title_block .en__accent {
	color: var(--color-primary);
	font-weight: 600;
}
.title_block .ja {
	display: inline-block;
	font-size: min(2rem,5vw);
	font-weight: bold;
}

.title_block p {
	margin-top: 1em;
}

@media only screen and (min-width: 768px) {
	.title_block {
		margin-bottom: 20px;
		padding: 0;
	}
}


/* text
-----------------------------------------------------------*/

.text_block p:not(:last-child) ,
.text_block_center p:not(:last-child) {
	margin-bottom: 1.5em;
}

.text_block {
  margin-bottom: 30px;
}

.color--red {
  color: var(--color-primary);
}
.color--gr {
  color: var(--color-secondary);
}

.bold {
  font-weight: 600;
}

.center {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.left {
	text-align: left;
}
.right {
	text-align: right;
}


/* link / btn
-----------------------------------------------------------*/

.link_box {
	text-align: right;
}
.link_box a {
	display: inline-block;
	color: var(--color-secondary);
}

.btn_box {
	clear: both;
	margin: 0;
	padding: 10px 0 20px;
	text-align: center;
}
.btn_box a {
	display: inline-block;
	width: 240px;
	max-width: 100%;
	padding: 12px;
	border-radius: 8px;
	background-color: var(--color-primary);
	color: #FFF;
	font-weight: bold;
	text-decoration: none;
}


/* bnr
----------------------------------------------------------- */

/* list */
.bnr-list {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}
.card-list+.bnr-list ,
.bnr-list+.bnr-list {
	margin-top: 40px;
}
.bnr-list__item ,
.bnr-list__item--full ,
.bnr-list--detail .bnr-list__item {
	width: 100%;
}
.bnr-list__item--3col, .bnr-list__item--4col {
	width: calc((100% - 15px) / 2);
}
.bnr-list a {
	display: block;
	text-decoration: none;
}
.bnr-list__text {
	margin-top: 1em;
}
@media only screen and (min-width: 768px) {
	.bnr-list {
		gap: 15px;
	}
	.bnr-list--detail {
		gap: 10px;
	}
	.bnr-list__item {
		width: calc((100% - 15px) / 2);
	}
	.bnr-list__item--3col {
		width: calc((100% - 15px * 2) / 3);
	}
	.bnr-list__item--4col {
		width: calc((100% - 15px * 3) / 4);
	}
	.bnr-list__item--full {
		width: 100%;
	}
}


/*-------------------------------------------------------------------------------

 fs 全般

-------------------------------------------------------------------------------*/

/* ページタイトル */
.fs-c-heading--page {
	margin-bottom: 1em;
	padding: 0;
	border-bottom: none;
	color: inherit;
	font-size: min(2.8rem,6.5vw);
	font-weight: 600;
}

/* サブタイトル */
.fs-c-subSection__title {
	margin-bottom: 20px;
	border-bottom: none;
	color: inherit;
	font-size: min(2.4rem,5.5vw);
	font-weight: normal;
}

/* アナウンスタイトル */
.fs-p-announcement__title {
	margin-bottom: 20px;
	color: inherit;
	font-size: 2rem;
	font-weight: normal;
}

/* テーブルセル：会員登録/ログインなどフォーム共通 */
.fs-c-inputTable__headerCell,
.fs-c-inputTable__dataCell {
	padding-bottom: 5px;
	font-weight: normal;
}
[type="text"], [type="search"], [type="tel"], [type="url"], [type="email"], [type="password"], [type="datetime"], [type="date"], [type="month"], [type="week"], [type="time"], [type="datetime-local"], [type="number"], .fs-c-inputGroup--vertical > [type="password"],select, textarea {
	box-sizing: border-box;
	padding: 4px;
	border-radius: 4px;
	border: 2px solid #CCC;
	border-radius: 0;
}
.fs-c-inputGroup, .fs-c-inputGroup--inline, .fs-c-inputGroup--vertical {
	border-width: 2px;
}

/* ラジオボタンを横並びに */
.fs-c-radioGroup {
	display: block;
}
.fs-c-radioGroup .fs-c-radio {
	display: inline-block;
	min-height: auto;
	margin-right: 8px;
}

/** ボタン一般 **/
.fs-c-button--primary ,
.fs-c-button--secondary {
	padding: .8em;
	box-sizing: border-box;
	border-radius: 4px;
	border: none;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.fs-c-button--standard {
	box-sizing: border-box;
}
.fs-c-inputInformation__button {
	margin-top: 10px;
}
.fs-c-button--plain {
	color: inherit;
}
.fs-c-dropdown::after {
	box-sizing: border-box;
}

/* 商品アイコン */
.fs-c-mark, .fs-c-productMark__mark {
	margin: 0 4px 4px 0;
	padding: 6px 8px;
}

/* 価格 */
.fs-c-productPrice:not(.fs-c-productPrice--listed) .fs-c-productPrice__main__price {
	color: var(--color-dred);
}

/* モーダル横幅 */
.fs-c-modal__inner {
	max-width: 95%;
	width: 800px;
}

/* 右下固定カートボタン */
.fs-p-scrollingCartButton {
	display: none;
}

/* おすすめ商品/wishlist系 */
.fs-c-wishlistProduct__title ,
.fs-c-featuredProduct__title {
	margin-bottom: 15px;
	padding-bottom: .5em;
	border-bottom: solid 1px var(--color-black);
	color: inherit;
	font-size: min(2.4rem,5vw);
	font-weight: bold;
}
.fs-c-productListCarousel__ctrl {
	min-width: 20px;
}
.fs-c-featuredProduct .fs-c-slick.slick-slider .fs-c-productListItem__image a {
	display: flex;
	justify-content: center;
	align-items: center;
}
.fs-c-productListCarousel__list a {
	text-decoration: none;
}

@media only screen and (min-width: 768px) {
	.fs-c-wishlistProduct__title ,
	.fs-c-featuredProduct__title {
		margin-bottom: 25px;
	}
}

/*-------------------------------------------------------------------------------

 カート / fs

-------------------------------------------------------------------------------*/

/* 削除 / あとで買う */
.fs-c-cartTable__actionButton__container > button {
	white-space: nowrap;
}

/* 送料無料/ついで買い誘導 */
.fs-body-cart .fs-p-announcement {
	margin-bottom: 40px;
}
.fs-p-flexibleColumn {
	margin-top: 20px;
}
.fs-p-flexibleColumn a {
	text-decoration: none;
}

/* ショッピングを続ける */
.fs-c-continueShopping {
	margin-bottom: 40px;
	text-align: center;
}
.fs-c-button--continueShopping {
	width: 360px;
	max-width: 100%;
	font-size: 1.6rem;
}

@media screen and (max-width: 600px) {
	.fs-c-cartTable__row:last-child {
		border-bottom: none;
	}
}
@media screen and (min-width: 600px) {
	/* カート */
	.fs-c-cartTableContainer {
		padding: 0;
		border: none;
	}
}


/*-------------------------------------------------------------------------------

 ログイン / fs

-------------------------------------------------------------------------------*/

/* ログインの目アイコン */
.fs-c-button--particular.fs-c-button--displayPassword ,
.fs-c-button--hidePassword.fs-c-button--particular {
	margin-right: 8px;
}

/* 会員登録ボタン */
.fs-c-buttonContainer.fs-c-buttonContainer--memberRegister {
	margin-top: 32px;
}

/* 連携サービスでログイン */
.fs-c-linkedServiceLogin__title {
	margin-bottom: 20px;
	border-bottom: none;
	color: inherit;
	font-size: 1.8rem;
	font-weight: normal;
}
.fs-c-linkedServiceLogin .fs-c-anotherLogin {
	margin: auto;
	max-width: 360px;
}

/* ログインアイパスエリア */
@media only screen and (min-width: 768px) {
	.fs-body-login .fs-c-inputInformation__field ,
	.fs-body-newsletter-subscribe .fs-c-inputInformation__field {
		padding: 40px 32px;
	}
	.fs-body-login .bnr-area .bnr ,
	.fs-body-register .bnr-area .bnr {
		margin-bottom: 40px;
	}	
}

/*-------------------------------------------------------------------------------

 会員登録 / fs

-------------------------------------------------------------------------------*/

/* 上部文言:カートと共有ペーツ */
.fs-body-register .fs-p-announcement {
	max-width: 640px;
	margin: 32px auto;
}
/* 必須マーク */
:not(.fs-body-product) .fs-c-requiredMark {
	overflow: hidden;
	width: 3.4em;
	height: 2.2em;
	margin-left: 10px;
	vertical-align: middle;
	color: var(--color-white);
}
:not(.fs-body-product) .fs-c-requiredMark::before {
	overflow: hidden;
	content: '必須';
	margin-top: .5em;
	padding: 4px 0;
	border-radius: 2px;
	background-color: var(--color-dred);
	color: var(--color-white);
	font-size: 1.0rem;
	text-align: center;
}
.fs-c-buttonContainer--confirmRegister .fs-c-button--primary {
	width: 240px;
	max-width: 100%;
	padding: 1em;
}
/* 同意するチェック */
.fs-c-agreementConfirmation__message {
	margin-bottom: 15px;
}
.fs-body-register .fs-c-additionalCheckField .fs-c-inputField__field ,
.fs-body-register .fs-c-agreementConfirmation__checkbox {
	display: block;
	max-width: 15em;
	margin: 0 auto;
}
.fs-body-customerDetails .fs-c-additionalCheckField .fs-c-inputField__field ,
.fs-body-customerDetails .fs-c-agreementConfirmation__checkbox {
	display: block;
	max-width: 500px;
	margin: 0 auto;
}
.fs-body-customerDetails .fs-c-agreementConfirmation__password {
	display: block;
	max-width: 500px;
	margin: 15px auto;
}
.fs-c-checkbox__label {
	align-items: flex-start;
}
.fs-c-checkbox__checkMark {
	margin-top: 6px;
}
/* パスワード入力 */
.fs-c-agreementConfirmation__password {
	margin-left: 0;
}
/* 登録完了 */
.fs-c-registerSuccessMessage {
	max-width: 600px;
	border-bottom: none;
	text-align: left;
}
/* マイページへ行くボタン */
.fs-c-button--myPageTop.fs-c-button--plain {
	color: inherit;
	text-decoration: underline;
}
@media only screen and (min-width: 769px) {
	/* 会員登録テーブル:フォーム共通 */
	.fs-c-inputInformation__field {
		max-width: 760px;
	}
	.fs-body-register .fs-c-inputTable > tbody > tr ,
	.fs-body-customerDetails .fs-c-inputTable > tbody > tr ,
	.fs-body-my-account-settings .fs-c-inputTable > tbody > tr ,
	.fs-body-my-account-settings-edit .fs-c-inputTable > tbody > tr {
		display: table-row;
	}
	.fs-body-register .fs-c-inputTable__headerCell ,
	.fs-body-register .fs-c-inputTable__dataCell ,
	.fs-body-customerDetails .fs-c-inputTable__headerCell ,
	.fs-body-customerDetails .fs-c-inputTable__dataCell ,
	.fs-body-my-account-settings .fs-c-inputTable__headerCell ,
	.fs-body-my-account-settings .fs-c-inputTable__dataCell ,
	.fs-body-my-account-settings-edit .fs-c-inputTable__headerCell ,
	.fs-body-my-account-settings-edit .fs-c-inputTable__dataCell {
		padding: 15px 10px;
	}
	.fs-body-register .fs-c-inputTable__headerCell ,
	.fs-body-customerDetails .fs-c-inputTable__headerCell ,
	.fs-body-my-account-settings .fs-c-inputTable__headerCell ,
	.fs-body-my-account-settings-edit .fs-c-inputTable__headerCell {
		width: 35%;
		text-align: right;
	}
	.fs-body-register .fs-c-inputTable__dataCell ,
	.fs-body-customerDetails .fs-c-inputTable__dataCell ,
	.fs-body-my-account-settings .fs-c-inputTable__dataCell ,
	.fs-body-my-account-settings-edit .fs-c-inputTable__dataCell {
		width: 526px;
		max-width: 65%;
	}
}

/*-------------------------------------------------------------------------------

 マイページ / fs

-------------------------------------------------------------------------------*/

.fs-p-accountInfo {
	padding: 15px;
}
.fs-p-accountInfo__header {
	margin-bottom: 10px;
}

.fs-c-purchasePointExpiration + * {
	margin-top: 15px;
}

/* マイページナビ */
.fs-c-accountService {
	gap: 15px;
}
.fs-c-accountService > li {
	flex: 0 0 calc((100% - 15px) / 2);
}

@media only screen and (min-width: 600px) {
	.fs-c-accountService > li {
		margin: 0;
		flex: 0 0 calc((100% - 30px) / 3);
	}
}
@media screen and (min-width: 768px) {
	.fs-body-my-points .fs-c-history__info {
		max-width: none;
	}
}
@media screen and (min-width: 960px) {
	.fs-c-history {
		display: flex;
		flex-direction: row-reverse;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: space-between;
	}	
	.fs-c-history .fs-c-history__info {
		flex-basis: 35%;
	}
	.fs-c-history .fs-c-history__infoSummary {
		flex-basis: 64%;
	}
}


/*-------------------------------------------------------------------------------

 ガイド / 問い合わせ / 特定商取引

-------------------------------------------------------------------------------*/

.fs-c-documentArticle {
	padding: 0 0 20px;
}
.fs-c-documentArticle__content {
	padding: 0;
}

/* 見出し */
.fs-c-documentArticle__heading {
	padding: 8px;
	background-color: var(--color-gray-800);
	font-size: min(1.8rem,4.5vw);
}
.fs-c-documentColumn__heading {
	margin-bottom: 20px;
	padding: 0 0 10px;
	border-left: none;
	color: inherit;
}
.fs-c-documentContent__heading {
	padding: 4px 8px;
	font-size: inherit;
}
.fs-c-documentSubContent__heading {
	border-bottom-width: 2px;
	font-size: inherit;
}

/* メルマガ登録 */
.fs-body-newsletter-subscribe .fs-c-inputInformation__field {
	padding: 32px;
}
.fs-c-inputInformation__button.fs-c-buttonContainer--confirmRegister {
	margin-bottom: 20px;
}


/* /////////////////////////////////////////////////////////////////////////////

 汎用CSS

///////////////////////////////////////////////////////////////////////////// */

@media only screen and (max-width: 767px) {
	.sp_hide {
		display: none;
	}
	.sp_center {
		margin-left: auto;
		margin-right: auto;
		text-align: center;
	}

	/* 夢やテーマから転載 */
	.sp_none {
		display:none;
	}
	.device-sp{
		display:block;
	}
	.device-sp-inline{
		display:inline;
	}
	.device-pc{
		display:none;
	}
	.device-pc-inline{
		display:none;
	}
}
@media only screen and (min-width: 768px) {
	.pc_hide {
		display: none;
	}
	.pc_center {
		margin-left: auto;
		margin-right: auto;
		text-align: center;
	}

	/* 夢やテーマから転載 */
	.pc_none {
		display:none;
	}
	.device-sp{
		display:none;
	}
	.device-sp-inline{
		display:none;
	}
	.device-pc{
		display:block;
	}
	.device-pc-inline{
		display:inline;
	}
	
}
