@charset "Shift_JIS";

@import "common3.css";
@import "common3_small.css";
@import "colorbox2.css";






/*全体　

TOP改修時はhomeのみに反映としておく
状況次第ではcommonにもっていく
---------------------------------------------------- */
/*===リセット===*/
svg {
	display: inline-block;
	vertical-align: middle;
	/* inline要素のずれ防止 */
	fill: currentColor;
	/* 意図した通り色が継承されるように */
    width: 100%;
    height: 100%;
}

/*===枠系===*/
.inner{
	max-width: 1200px;
    margin: 0 auto;
}
/*===タイトル、テキスト===*/
.ttl-01 {
	/*26px*/
    color: #5B451D;
	font-size: 1.857em;
	font-weight: bold;
}
.ttl-02 {
	/*23px*/
    color: #5B451D;
	font-size: 1.643em;
	font-weight: bold;
}
.ttl-03 {
	/*20px*/
    color: #5B451D;
	font-size: 1.429em;
	font-weight: bold;
	line-height: 120%;
}
.ttl-04 {
	/*15px*/
	font-size: 1.071em;
	font-weight: bold;
}
.ttl-05 {
	/*23px*/
    color: #5B451D;
	font-size: 1.643em;
	font-weight: bold;
}
.txt-01 {
	color: #5B564E;
	/*16px*/
	font-size: 1.143em;
}
.txt-02 {
	color: #5B564E;
	/*18px*/
	font-size: 1.286em;
}
.bold{
	font-weight: bold;
}
.red{
    color: #F0250E;
}

/*===お届け日===*/
.otodoke-clm{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 10px;
    margin-bottom: 86px;
}
.otodoke-txt{
    color: #5B451D;
    font-size: 1.571em;
}
.otodoke{
	color: #5B564E;
	font-size: 1.857em;
	line-height: 120%;
	font-weight: bold;
}


/*===リスト===*/
.list-01>li {
    display: flex;
    border-bottom: 1px solid #5B451D;
    padding: 30px 0 23px;
}
.list-01>li .list-ttl {
    width: 207px;
    box-sizing: border-box;
}
.list-01>li .list-cnt {
    flex: 1;
}

/*===リンクボタン===*/
.link-01 a {
    color: #5B451D;
	font-weight: bold;
    display: flex;
    align-items: center;
    width: fit-content;
}
.link-01 a .arrow{
	margin-left: 10px;
}
.btn-01 a {
	color: #5B451D;
	font-size: 1.0714em;
	font-weight: bold;
	line-height: 1.25;
	text-align: center;
	border-radius: 90px;
	border: 2px solid #5B451D;
	padding: 12px 77px 12px 50px;
	/* background: #fff; */
	min-width: 300px;
	display: inline-block;
	box-sizing: border-box;
	position: relative;
}
.btn-01.type-02 a {
	border-radius: 20px;
	padding: 20px 73px 20px 50px;
	background: #FAF4EB;
	min-width: 314px;
}
.btn-01 .arrow {
	display: inline-flex;
	position: absolute;
	width: 7px;
	height: 10px;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
}
.btn-01.type-02 .arrow{
	width: 9px;
	height: 14px;
}
.btn-01 a:hover{
	text-decoration: none;
	opacity: 0.5;
}

/*===横並び===*/
.flex-wrap-01{
    display: flex;
    flex-wrap: wrap;
    gap: 100px 60px;
    justify-content: flex-start;
}
.flex-cnt-01{
    width: calc((100% - 60px * 1) / 2);
    box-sizing: border-box;
}
.is-hidden{
	display: none;
}

/* メインエリア

TOP改修時はhomeのみに反映としておく
状況次第ではcommonにもっていく
ヘッダー等に影響しないよう色などはpagebodyに記載している
---------------------------------------------------- */
#pagebody{
	color: #5B451D;
	font-family: 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, '游ゴシック体', 'Yu Gothic', YuGothic, 'ＭＳ Ｐゴシック', sans-serif;
	width: inherit;
}
#pagebody a{
	color:inherit;
	transition: all 0.3s;
}
#pagebody a:hover{
	text-decoration: none;
	opacity: 0.5;
}

#HDR-SP {
	border: none;
}
#HOME h1{
	border: none;
	margin: 0;
}
#HOME .top-clm {
	width: 100%;
	margin-bottom: 80px;
}
#HOME .otodoke-clm{
    border: 2px solid #5B451D;
    margin-top: 80px;
    padding: 40px 0 45px;
    width: 645px;
}
#HOME .otodoke-clm .otodoke {
	color: #5B451D;
	font-size: 2.1429em;
}

/*スライダー*/
#HOME .splide .splide__arrow {
	background: none;
	opacity: 1;
}
#HOME .splide .splide__arrow:hover {
	opacity: 0.5;
}
#HOME .splide .splide__arrow svg {
	width: 50px;
	height: 50px;
}
/* MVスライダー */
#HOME #splide-mv.splide {
	margin: 0 auto;
}
#HOME #splide-mv .splide__track {
	overflow: initial;
}
#HOME #splide-mv .splide__arrows {
	max-width: 1200px;
	margin: 0 auto;
	height: 640px;
	position: absolute;
	right: 0;
	left: 0;
	margin: 0 auto;
}
#HOME #splide-mv .splide__arrows button{
	width: 50px;
	height: 50px;
}
#HOME #splide-mv .splide__arrow--prev {
	left: 40px;
}
#HOME #splide-mv .splide__arrow--next {
	right: 40px;
}
#HOME #splide-mv .splide__slide a{
	display: block;
}
#HOME #splide-mv .splide__slide img {
	width: 100%;
	height: auto;
}
#HOME #splide-mv .opt-clm {
	display: flex;
	gap: 30px;
	justify-content: center;
	margin-top: 10px;
}
#HOME #splide-mv button {
	padding: 0;
	border: none;
	font: inherit;
	color: inherit;
	background: none;
}
#HOME #splide-mv .splide__pagination {
	bottom: initial;
	gap: 30px;
	padding: 0;
	position: static;
}
#HOME #splide-mv .splide__pagination__page {
	width: 14px;
	height: 14px;
	opacity: 1;
	background: #5b564e;
	margin: 0;
}
#HOME #splide-mv .splide__pagination__page.is-active {
	transform: scale(1.1429);
	background: #2d5818;
}
#HOME #splide-mv .splide__toggle svg {
	width: 40px;
	height: 40px;
}
/* 季節のおすすめスライダー */
#HOME .splide-items {
	margin: 20px auto 0;
}
#HOME .splide-items .splide__arrow:disabled {
	opacity: 0;
}
#HOME .splide-items .splide__slide {
	overflow: hidden;
}
#HOME .splide-items .splide__arrows {
	margin: 0 auto;
	height: 200px;
	position: absolute;
	right: 0;
	left: 0;
	margin: 0 auto;
}
#HOME .splide-items .splide__arrows button{
	width: 40px;
	height: 40px;
}
#HOME .splide-items .splide__arrow--next {
	right: -20px;
	transition: right 0.2s;
}
#HOME .splide-items .splide__arrow--prev {
	left: -20px;
	transition: left 0.2s;
}
#HOME .splide-items .splide__slide a{
	display: block;
}
#HOME .splide-items .splide__slide a:hover {
	text-decoration: none;
	opacity: 0.75;
}
#HOME .splide-items .splide__slide a:hover img{
	opacity: 1;
}
#HOME .splide-items .splide__slide a:focus-visible {
	border: 2px solid;
	box-sizing: border-box;
}
#HOME .splide-items .splide__slide .items-img {
	position: relative;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 11px;
}
#HOME .splide-items .splide__slide .items-img img {
	max-width: 100%;
	height: auto;
}
#HOME .splide-items .splide__slide .items-img .tags {
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 0 0 6px;
	z-index: 1;
}
/* はみ出た矢印対策 */
@media only screen and (max-width: 1250px) {
	#HOME .splide-items .splide__arrow--next {
		right: 1em;
	}
	#HOME .splide-items .splide__arrow--prev {
		left: 1em;
	}
}
#HOME .splide-items .items-txt{
	line-height: 1.2;
	color: #5B451D;
}
#HOME .splide-items .items-txt .small-txt{
    font-size: 0.8em;
    font-weight: normal;
    display: inline-block;
    margin-top: 5px;
}
#HOME .splide-items .items-bt-tags{
	margin-top: 25px;
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
}
#HOME .splide-items .tags{
	display: inline-block;
	box-sizing: border-box;
	background: #2D5818;
	color: #FFF;
	font-weight: bold;
	padding: 5px 13px 8px;
	border-radius: 6px;
}
#HOME .splide-items .tags.tag-01{
	background: #2D5818;
}
#HOME .splide-items .tags.tag-02 {
	background: #F0250E;
}
#HOME .splide-items .tags.tag-03 {
	background: #796300;
}
#HOME .splide-items + .btn-01,
#HOME .tab-wrap + .btn-01{
	display: flex;
	justify-content: center;
	margin-top: 35px;
}

/* 季節のおすすめ装飾 */
#HOME .recommend-clm{
	padding: 80px 0 100px;
	background: #FAF2F2;
}
#HOME .recommend-clm + .recommend-clm{
	margin-top: 40px;
}
#HOME .recommend-clm:not(:has(~ .recommend-clm)) {
    margin-bottom: 144px;
}
/*common3＊にて対応*/
/* #HOME .recommend-clm h2.ttl-01{
	color: #5B451D;
	border: none;
	padding-bottom: 0;
} */
#HOME .recommend-clm h2.ttl-01 .ttl-wrap {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
#HOME .recommend-clm .ttl-01 .svg-ico{
    display: inline-block;
}
#HOME .recommend-clm .ttl-01 .star {
    width: 25px;
	height: 24px;
}
#HOME .recommend-clm .ttl-01 .clown {
	width: 30px;
	height: 24px;
}
#HOME .recommend-clm .ttl-01 .cookie{
	width: 24px;
	height: 24px;
}
#HOME .recommend-clm .ttl-01 .pie{
	width: 30px;
	height: 24px;
}
#HOME .recommend-clm .ttl-01 .small{
	font-size: 0.6154em;
}
/* 個別背景 */
/* ひまわり */
#HOME .recommend-clm.recommend-bg01{
	background: #FAF2F2 url(../img/home/recommend-bg01.png) no-repeat top right / 641px ;
}

/* バナー群 */
#HOME .bnr_clm{
    margin-top: 40px;
}
#HOME .bnr_clm .flex-wrap-01{
    gap: 0 40px;
    justify-content: center;
}
#HOME .bnr_clm .flex-cnt-01{
    width: calc((100% - 40px * 1) / 2);
}

/* タブメニュー */
.tab-wrap .tab-btn{
	display: flex;
	width: 100%;
	margin-bottom: 53px;
}
.tab-wrap .tab-btn > *{
	flex: 1;
	position: relative;
}
.tab-wrap .tab-btn *+*::before {
	content: "";
	width: 2px;
	height: 1em;
	background: #5B451D;
	display: block;
	position: absolute;
	top: 0;
	left: -1px;
	top: 0;
	bottom: 0;
	margin: auto 0;
	pointer-events: none;
}
.tab-wrap .tab-btn button{
	/* リセット */
	padding: 0;
	border: none;
	/* outline: none; */
	font: initial;
	color: inherit;
	background: none;
	/* ここまでリセット */
	width: 100%;
	height: 100%;
	font-size: 1em;
	font-weight: bold;
	line-height: 1.2;
	border-bottom: 5px solid #D9D9D9;
	padding: 17px 1.5em;
	cursor: pointer;
}
.tab-wrap .tab-btn button:hover{
	opacity: 0.5;
}
.tab-wrap .tab-btn button[aria-selected="true"]{
	border-color: #2D5818;
}
.tab-wrap .tab-cont>* {
	transition-property: opacity;
	transition-behavior: allow-discrete;
	transition-duration: 0.75s;
	@starting-style {
		height: 0px;
		opacity: 0;
	}
}
/*===人気ランキング===*/
#HOME .recommend-clm.ranking-clm{
	background: #FAF4EB;
    margin-top: 40px;
}
#HOME .recommend-clm.ranking-clm .ttl-01{
	margin-bottom: 9px;
}
#HOME .recommend-clm.ranking-clm .tab-wrap{
	margin-top: 40px;
}
#HOME .recommend-clm .flex-wrap-01{
	flex-wrap: nowrap;
	gap: 30px;
}
#HOME .recommend-clm .flex-cnt-01{
	width: calc((100% - 30px * 4) / 5);
}
#HOME .recommend-clm .flex-cnt-01 a{
	display: block;
}
#HOME .recommend-clm .flex-cnt-01 a:hover{
	text-decoration: none;
}
#HOME .recommend-clm .flex-cnt-01 a:hover .ttl-03,
#HOME .recommend-clm .flex-cnt-01 a:hover .txt-01{
	opacity: 0.75;
}
#HOME .recommend-clm .flex-cnt-01 .txt-02{
	color: #5B451D;
	margin-bottom: 4px;
}
#HOME .recommend-clm .flex-cnt-01 .txt-02 .clown{
	display: inline-flex;
	width: 19px;
	height: 15px;
	margin-right: 4px;
}
#HOME .recommend-clm .flex-cnt-01 .txt-02 .clown.rank1 svg{
	fill: #997D00;
}
#HOME .recommend-clm .flex-cnt-01 .txt-02 .clown.rank2 svg {
	fill: #88909C;
}
#HOME .recommend-clm .flex-cnt-01 .txt-02 .clown.rank3 svg {
	fill: #922608;
}
#HOME .recommend-clm .flex-cnt-01 .img-cnt{
	border-radius: 10px;
	overflow: hidden;
	margin-bottom: 10px;
}
#HOME .recommend-clm .flex-cnt-01 .ttl-03{
	margin-bottom: 10px;
	line-height: 1.2;
}
#HOME .recommend-clm .flex-cnt-01 .ttl-03 .small-txt{
    font-size: 0.8em;
    font-weight: normal;
    display: inline-block;
    margin-top: 10px;
}

/*===お知らせ===*/
#HOME .news-clm{
    margin-bottom: 120px;
}
#HOME .news-clm .tab-wrap .tab-btn{
	margin-bottom: 43px;
}
#HOME .news-clm .list-01 li{
	padding: 30px 40px 23px;
}
#HOME .news-clm .txt-01 a{
	display: inline-block;
	position: relative;
    box-sizing: border-box;
    padding-right: 80px;
}
#HOME .news-clm .txt-01 .svg-ico{
    display: inline-block;
	position: absolute;
	right: 0;
    top: 50%;
    transform: translateY(-50%);
}
#HOME .news-clm .txt-01 .arrow{
    width: 9px;
    height: 14px;
}
#HOME .news-clm .txt-01 .link-ex{
    width: 14px;
    height: 14px;

}

/*===ご予算バナー===*/
#HOME .bnr-clm{
    margin-bottom: 160px;
}
#HOME .bnr-clm .img-cnt{
    width: 800px;
    margin: 0 auto;
}

/*===カテゴリー===*/
#HOME .cat-clm {
    margin-bottom: 170px;
}
#HOME .cat-clm .ttl-01{
    margin-bottom: 20px;
}
#HOME .cat-clm .flex-wrap-01{
    flex-wrap: inherit;
    justify-content: space-around;
    gap: 0 22px;
}
#HOME .cat-clm .flex-cnt-01{
    width: 180px;
    display: flex;
}
#HOME .cat-clm .flex-cnt-01 a{
    display: flex;
    flex-direction: column;
    align-items: center;
}
#HOME .cat-clm .img-cnt{
    position: relative;
}
#HOME .cat-clm .img-cnt::before{
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    border-radius: 180px;
    background: #FAF4EB;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
}
#HOME .cat-clm .ttl-03{
    display: flex;
    flex-grow: 1;
    justify-content: center;
    width: fit-content;
    align-items: center;
    gap: 0 16px;
	margin-top: 10px;
}
#HOME .cat-clm a .arrow{
    width: 9px;
    height: 14px;
}


/*===検索窓===*/
.clm-bg-01{
    background: #FAF4EB;
    padding: 40px 40px 60px;
    margin-bottom: 160px;
}
#HOME .search-clm .ttl-01{
	text-align: center;
	margin-bottom: 20px;
}
#HOME .search-clm input{
	border-radius: 0;
}
#HOME .search-clm #search{
    display: flex;
    max-width: 720px;
	border: 1px solid #5B564E;
    margin: 20px auto 0;
}
#HOME .search-clm .text-clm{
	font-size: 1.5em;
	width: 660px;
	border: none;
    border-radius: unset;
	padding: 5px;
}

/*===用途別===*/
#HOME .use-clm{
    margin-bottom: 160px;
}
#HOME .use-clm .ttl-01{
    margin-bottom: 20px;
}
#HOME .use-clm .img-cnt{
    margin-bottom: 80px;
}
#HOME .use-clm .flex-wrap-01{
    margin-bottom: 80px;
    gap: 60px 40px;
}
#HOME .use-clm .flex-cnt-01{
    width: calc((100% - 80px) / 3);
    display: flex;
    flex-direction: column;
}
#HOME .use-clm .flex-cnt-01 .ttl-05 {
    display: flex;
    flex-grow: 1;
}
#HOME .use-clm .flex-cnt-01 .ttl-05 a {
    position: relative;
    width: 100%;
    display: flex;
	align-items: center;
    border-bottom: 2px solid #5B451D;
    padding-bottom: 20px;
}
#HOME .use-clm .flex-cnt-01 .use01{
	width: 31px;
	margin-right: 12px;
}
#HOME .use-clm .flex-cnt-01 .use02{
	width: 31px;
	margin-right: 20px;
}
#HOME .use-clm .flex-cnt-01 .use03{
	width: 40px;
	margin-right: 16px;
}
#HOME .use-clm .flex-cnt-01 .use04{
	width: 36px;
	margin-right: 16px;
}
#HOME .use-clm .flex-cnt-01 .use05{
	width: 32px;
	margin-right: 16px;
}
#HOME .use-clm .flex-cnt-01 .svg-ico{
    display: inline-block;
}
#HOME .use-clm .flex-cnt-01 .arrow{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 11px;
    height: 18px;
}
#HOME .use-clm .use-01{
    width: 30px;
    height: 35px;
    margin-right: 12px;
}
#HOME .use-clm .use-02{
    width: 30px;
    height: 26px;
    margin-right: 20px;
}
#HOME .use-clm .use-03{
    width: 40px;
    height: 36px;
    margin-right: 16px;
}
#HOME .use-clm .use-04{
    width: 35px;
    height: 27px;
    margin-right: 16px;
}
#HOME .use-clm .use-05{
    width: 30px;
    height: 30px;
    margin-right: 16px;
}
#HOME .use-clm .btn-01{
    text-align: center;
}
#HOME .use-clm .btn-wrap{
    display: flex;
    justify-content: center;
    gap: 0 80px;
    margin-top: 80px;
}


/*===大切にしていること===*/
#HOME .important-clm{
    margin-bottom: 100px;
}
#HOME .important-clm .ttl-01{
    margin-bottom: 18px;
}
#HOME .important-clm .flex-wrap-01{
    flex-wrap: inherit;
	justify-content: space-between;
    gap: 0;
}
#HOME .important-clm .flex-cnt-01{
    width: 270px;
}
#HOME .important-clm .ttl-03{
	line-height: 120%;
    position: relative;
    margin-top: 20px;
}
#HOME .important-clm a .svg-ico{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
}
#HOME .important-clm a .arrow{
    width: 11px;
    height: 18px;
}
#HOME .important-clm a .link-ex{
    width: 20px;
    height: 20px;
}
/*===SNS===*/
#HOME .sns-clm{
    margin-bottom: 160px;
}
#HOME .sns-clm .flex-wrap-01{
    gap: 0 80px;
    justify-content: center;
}
#HOME .sns-clm .flex-cnt-01{
    width: inherit;
}
#HOME .sns-clm .link-01 a{
    padding-bottom: 20px;
    border-bottom: 2px solid #5B451D;
}
#HOME .sns-clm .link-01 .svg-img{
    margin-right: 20px;
}
#HOME .sns-clm .link-01 a .arrow{
    width: 11px;
    height: 18px;
    margin-left: 40px;
}

/* //メインエリア
---------------------------------------------------- */

/* 補足エリア
---------------------------------------------------- */
.sup-section{
	background: #F3F0F0;
	padding: 98px 0 187px;
}
.sup-section .clm-cnt{
	display: flex;
	justify-content: space-between;
    gap: 0 60px;
}
.sup-section .clm-cnt .clm-01{
	width: calc(100% / 3);
    position: relative;
}
.sup-section .clm-cnt .clm-01:not(:last-child)::after{
    content: "";
    display: block;
    position: absolute;
    width: 1px;
    height: 100%;
    background-color: #A9A194;
    right: 30px;
    right: -30px;
    top: 0;
}
.sup-section .clm-ttl{
    font-size: 2em;
    font-weight: bold;
    text-align: center;
    margin-bottom: 66px;
}
.sup-section .clm-ttl .svg-img{
    width: 80px;
    margin: 0 auto 20px;
    display: block;
}
.sup-section .item:not(:last-child){
	margin-bottom: 80px;
}
.sup-section .item .ttl-02{
	margin-bottom: 15px;
}
.sup-section .item .txt-02.bold{
    margin-bottom: 7px;
}
.sup-section .item p:not(.otodoke) + .txt-02.bold{
    margin-top: 40px;
}
.sup-section .item .link-01{
	margin-top: 20px;
}
.sup-section .item .link-01 + .txt-02{
    margin-top: 20px;
}
.sup-section .item .link-01 a .arrow{
    width: 6px;
    height: 10px;
}
.sup-section .item .otodoke{
	margin-bottom: 7px;
}
/* //補足エリア
---------------------------------------------------- */


/* スマートフォンサイズ  */
@media only screen and (max-width: 768px) {
	.sp-br{
		display: none;
	}

	/*全体　
	TOP改修時はhomeのみに反映としておく
	状況次第ではcommonにもっていく
	---------------------------------------------------- */
	/*===枠系===*/
	.inner{
		width: 100%;
        max-width: unset;
        padding: 0 5.208vw;
        box-sizing: border-box;
	}
	/*===タイトル、テキスト===*/
	.ttl-01 {
		font-size: 5.209vw;
	}
	.ttl-02 {
		font-size: 4.688vw;
	}
	.ttl-03 {
		font-size: 3.386vw;
	}
	.ttl-04 {
		font-size: 3.125vw;
	}
	.ttl-05 {
		font-size: 3.907vw;
	}
	.txt-01 {
		font-size: 3.386vw;
	}
	.txt-02 {
		font-size: 3.646vw;
	}
	/*===お届け日===*/
	/*===リスト===*/
    .list-01>li {
        display: flex;
        border-bottom: 0.261vw solid #5B451D;
        padding: 3.906vw 0;
        flex-direction: column;
    }
    .list-01>li .list-ttl {
        width: 100%;
        padding-left: 0;
        box-sizing: border-box;
    }
    .list-01>li .list-cnt {
        flex: 1;
    }
	/*===リンクボタン===*/
    .link-01 a .arrow{
        margin-left: 2.604vw;
    }
	.btn-01 a {
		font-size: 3.646vw;
		border-radius: 10.417vw;
		border: 0.261vw solid #5B451D;
		padding: 2.563vw 8.287vw 2.163vw 4.511vw;
		min-width: initial;
	}
    .btn-01.type-02 a {
        border-radius: 2.604vw;
        padding: 2.776vw 3.208vw;
        min-width: initial;
    }
	.btn-01 .arrow {
		width: 1.172vw;
		right: 4.511vw;
	}
	.btn-01.type-02 .arrow {
        width: 1.433vw;
        height: 2.344vw;
        right: 3.511vw;
    }

	/*===横並び===*/
    /*gap60 2列*/
    .flex-wrap-01 {
        gap: 15.625vw 5.209vw;
    }
    .flex-wrap-01 .flex-cnt-01 {
        width: calc((100% - 5.209vw * 1) / 2);
    }

	/* メインエリア */
	#HOME .top-clm{
		margin-bottom: 10.459vw;
	}
	#HOME .otodoke-clm{
		flex-direction: column;
		margin-bottom: 7.625vw;
        margin-top: 7.813vw;
		gap: 1.303vw;
        padding: 5.208vw 5.208vw 6.208vw;
        border: 0.261vw solid #5B451D;
        width: 73.438vw;
	}
	#HOME .otodoke-clm .otodoke-txt{
		font-size: 4.167vw;
	}
	#HOME .otodoke-clm .otodoke{
		font-size: 5.209vw;
	}
	/*スライダー*/
	/* 共通 */
	#HOME .splide .splide__arrow:hover{
		opacity: initial;
	}
	#HOME .splide .splide__arrow svg {
		width: 9.375vw;
		height: 9.375vw;
	}
	/* MVスライダー */
	#HOME #splide-mv .splide__arrows {
		max-width: initial;
		height: 65.105vw;
	}
	#HOME #splide-mv .splide__arrows button {
		width: 9.375vw;
		height: 9.375vw;
	}
	#HOME #splide-mv .splide__arrow--prev {
		left: 2.605vw;
	}
	#HOME #splide-mv .splide__arrow--next {
		right: 2.605vw;
	}
	#HOME #splide-mv .opt-clm {
		gap: 6.511vw;
		margin-top: 2.604vw;
	}
	#HOME #splide-mv .splide__pagination {
		gap: 5.209vw;
	}
	#HOME #splide-mv .splide__pagination__page {
		width: 2.084vw;
		height: 2.084vw;
	}
	#HOME #splide-mv .splide__pagination__page.is-active {
		transform: scale(1.5);
	}
	#HOME #splide-mv .splide__toggle svg {
		width: 6.25vw;
		height: 6.25vw;
	}
	/* 	季節のおすすめスライダー */
	#HOME .splide-items {
		margin: 2.813vw auto 0;
	}
	#HOME .splide-items.splide {
		width: 100vw;
	}
	#HOME .splide-items .splide__slide {
		width: 38.021vw;
	}
	#HOME .splide-items .splide__slide .items-img {
		border-radius: 1.303vw;
		margin-bottom: 1.907vw;
	}
	#HOME .splide-items .splide__slide .items-img .tags {
		border-radius: 0 0 0.782vw;
	}
    #HOME .splide-items .items-txt .small-txt{
        font-size: 3.125vw;
        margin-top: 1vw;
    }
	#HOME .splide-items .items-bt-tags {
		margin-top: 2.605vw;
		gap: 0.912vw;
	}
	#HOME .splide-items .tags {
		font-size: 2.605vw;
		padding: 0.652vw 1.303vw;
		border-radius: 0.782vw;
	}
	#HOME .splide-items+.btn-01 {
		margin-top: 7.17vw;
	}
	#HOME .tab-wrap+.btn-01{
		margin-top: 8.672vw;
	}
	/* 季節のおすすめ装飾 */
	#HOME .recommend-clm {
		padding: 7.617vw 0 10.625vw;
	}
	#HOME .recommend-clm+.recommend-clm {
		margin-top: 5.209vw;
	}
    #HOME .recommend-clm:not(:has(~ .recommend-clm)) {
        margin-bottom: 12.531vw;
    }
	#HOME .recommend-clm h2.ttl-01 .ttl-wrap{
		display: flex;
		gap: 2.605vw;
		align-items: center;
	}
	#HOME .recommend-clm .ttl-01 svg {
		height: 5.209vw;
	}
	#HOME .recommend-clm .ttl-01 .small {
		display: inline-block;
		padding-top: 1.303vw;
	}
	#HOME .recommend-clm .ttl-01 .star {
		width: 4.948vw;
		height: 4.688vw;
	}
	#HOME .recommend-clm .ttl-01 .clown {
		width: 6.511vw;
		height: 5.209vw;
	}
	#HOME .recommend-clm .ttl-01 .cookie {
		width: 5.209vw;
		height: 5.209vw;
	}
	#HOME .recommend-clm .ttl-01 .pie {
		width: 6.511vw;
		height: 5.209vw;
	}
	/* 個別背景 */
	/* ひまわり */
	#HOME .recommend-clm.recommend-bg01 {
		background: #FAF2F2 url(../img/home/recommend-bg01_sp.png) no-repeat top right / 62.24vw;
	}

    /* バナー群 */
    #HOME .bnr_clm{
        margin-top: 7.813vw;
    }
    #HOME .bnr_clm .flex-wrap-01{
        flex-direction:column;
        gap: 5.513vw 0;
    }
    #HOME .bnr_clm .flex-wrap-01 .flex-cnt-01{
        width: 100%;
    }

	/* タブメニュー */
	.tab-wrap .tab-btn {
		/* display: flex; */
		/* width: 100%; */
		margin-bottom: 7.813vw;
	}
	.tab-wrap .tab-btn>* {
		/* position: relative; */
	}
	.tab-wrap .tab-btn .tab-large{
		flex: initial;
		width: 42.709vw;
	}
	.tab-wrap .tab-btn *+*::before {
		/* content: ""; */
		/* width: 2px; */
		/* height: 1em; */
		/* background: #5B451D; */
		/* display: block; */
		/* position: absolute; */
		/* top: 0; */
		/* left: -1px; */
		/* top: 0; */
		/* bottom: 0; */
		/* margin: auto 0; */
		/* pointer-events: none; */
	}
	.tab-wrap .tab-btn button {
		/* width: 100%; */
		/* height: 100%; */
		/* font-size: 1em; */
		/* font-weight: bold; */
		/* line-height: 1.2; */
		/* border-bottom: 5px solid #D9D9D9; */
		border-width: 0.652vw;
		padding: 1.303vw 1.5em;
		/* cursor: pointer; */
	}
	.tab-wrap .tab-btn button:hover {
		/* opacity: 0.5; */
	}
	.tab-wrap .tab-btn button[aria-selected="true"] {
		/* border-color: #2D5818; */
	}

	/*===人気ランキング===*/
	#HOME .recommend-clm.ranking-clm {
		/* background: #FAF4EB; */
		margin-top: 10.313vw;
        padding: 10.17vw 0 10.625vw;
	}
	#HOME .recommend-clm.ranking-clm .ttl-01 {
		margin-bottom: 3.907vw;
	}
	#HOME .recommend-clm.ranking-clm .tab-wrap {
		margin-top: 5.73vw;
	}
	#HOME .recommend-clm .flex-wrap-01 {
		/* flex-wrap: nowrap; */
		gap: 5.079vw;
		flex-direction: column;
	}
	#HOME .recommend-clm .flex-cnt-01 {
		width: 100%;
	}
	#HOME .recommend-clm .flex-cnt-01 a {
		display: grid;
		grid-template-columns: repeat(2, auto);
		/* grid-template-rows: repeat(3, auto); */
		grid-column-gap: 2.605vw;
	}
	#HOME .recommend-clm .flex-cnt-01 a:hover {
		/* text-decoration: none; */
	}
	#HOME .recommend-clm .flex-cnt-01 a:hover .ttl-03,
	#HOME .recommend-clm .flex-cnt-01 a:hover .txt-01 {
		/* opacity: 0.75; */
	}
	#HOME .recommend-clm .flex-cnt-01 .txt-02 {
		/* color: #5B451D; */
		margin-bottom: 1.563vw;
		font-size: 4.167vw;
		display: inline-flex;
	}
	#HOME .recommend-clm .flex-cnt-01 .txt-02 .clown {
		/* display: inline-flex; */
		width: 6.25vw;
		height: 4.948vw;
		margin-right: 1.823vw;
	}
	#HOME .recommend-clm .flex-cnt-01 .txt-02 .clown.rank1 svg {
		/* fill: #997D00; */
	}
	#HOME .recommend-clm .flex-cnt-01 .txt-02 .clown.rank2 svg {
		/* fill: #88909C; */
	}
	#HOME .recommend-clm .flex-cnt-01 .txt-02 .clown.rank3 svg {
		/* fill: #922608; */
	}
	#HOME .recommend-clm .flex-cnt-01 .img-cnt {
		grid-area: 1 / 1 / 4 / 2;
		width: 31.25vw;
		border-radius: 1.303vw;
		/* overflow: hidden; */
		margin-bottom: 0;
	}
	#HOME .recommend-clm .flex-cnt-01 .ttl-03 {
		margin-bottom: 1.303vw;
		/* line-height: 1.2; */
	}
    #HOME .recommend-clm .flex-cnt-01 .ttl-03 .small-txt{
        font-size: 3.386vw;
        margin-top: 0;
    }
	
	/* 検索-TOP */
	#SEARCH-CLM-TOP {
		margin-bottom: 3.125vw;
	}
	#SEARCH-CLM-TOP .text-clm {
		border: 1px solid #8a743f;
		padding: calc(6.176% - 8px) 0.5em;
		width: 83.66%;
	}
	#SEARCH-CLM-TOP .search-btn {
		width: 14.6%;
		height: auto;
	}
	/* 検索 */
	
	/*SP用お知らせ（オンラインショップ停止のお知らせ）*/
	#HOME .sp-info{
		border: solid 2px red;
		padding: 1em;
	}
	#HOME .sp-info p+p{
		margin-top: 1em;
	}
	#HOME .sp-info .red{
		color: #f00;
	}
	#HOME .sp-info ul{
		text-align: left;
	}
	#HOME .sp-info .list-normal{
		margin-left: 1.3em;
	}
	#HOME .sp-info .list-normal li{
		list-style: outside;
		margin-bottom: 0.75em;
	}
	#HOME .sp-info .list-normal li:last-child{
		margin-bottom: 0;
	}






	/*===お知らせ===*/
	#HOME .news-clm{
		margin-bottom: 22.438vw;
	}
    #HOME .news-clm .tab-btn{
        margin-bottom: 3.906vw;
    }
    #HOME .news-clm .tab-btn .ttl-03{
        margin-bottom: 0;
    }
    #HOME .news-clm .list-01 li{
        flex-direction: column;
        padding: 3.906vw 0 2.906vw;
    }
    #HOME .news-clm .list-01 li a{
		display: block;
		position: relative;
		padding-right: 6vw;
	}
    #HOME .news-clm .list-01>li .list-ttl{
        padding-left: 0;
    }
	#HOME .news-clm .txt-01 .svg-ico{
		margin-left: inherit;
		position: absolute;
        right: 0;
        top: 50%;
		bottom: inherit;
        transform: translateY(-50%);
	}
	#HOME .news-clm .txt-01 .arrow{
		width: 1.433vw;
		height: 2.344vw;
	}
	#HOME .news-clm .txt-01 .link-ex{
		width: 2.344vw;
		height: 2.344vw;
	}

	/*===ご予算バナー===*/
	#HOME .bnr-clm{
		margin-bottom: 19.532vw;
	}
	#HOME .bnr-clm .img-cnt{
		width: 100%;
	}

	/*===カテゴリー===*/
	#HOME .cat-clm {
		margin-bottom: 19.532vw;
	}
	#HOME .cat-clm .ttl-01{
		margin-bottom: 4.509vw;
	}
	#HOME .cat-clm .flex-wrap-01{
		flex-wrap: wrap;
		justify-content: center;
		gap: 7.813vw;
	}
	#HOME .cat-clm .flex-cnt-01{
        justify-content: center;
		width: 32.99vw;
        position: relative;
        z-index: 0;
	}
	#HOME .cat-clm .img-cnt{
		width: 20.834vw;
		height: 20.834vw;
    }
    #HOME .cat-clm .img-cnt::before{
		width: 20.834vw;
		height: 20.834vw;
		border-radius: 20.834vw;
	}
	#HOME .cat-clm .ttl-03{
		margin-top: 2.605vw;
		gap: 0 2.605vw;
	}
	#HOME .cat-clm a .arrow{
		width: 1.433vw;
		height: 2.344vw;
	}


	/*===検索窓===*/
	.clm-bg-01{
		padding: 6.813vw 5.208vw 10.417vw;
		margin-bottom: 18.232vw;
	}
	#HOME .search-clm .ttl-01{
        font-size: 3.906vw;
		margin-bottom: 1.605vw;
	}
	#HOME .search-clm #search{
		max-width: 75.125vw;
		border: 0.261vw solid #5B564E;
		margin: 0 auto;
	}
	#HOME .search-clm .text-clm{
		font-size: 3.385vw;
		width: 65.105vw;
		padding: 1.303vw;
	}
    #HOME .search-clm .search-btn{
        width: 12.321vw;
    }

	/*===用途別===*/
	#HOME .use-clm{
		margin-bottom: 23.438vw;
	}
	#HOME .use-clm .ttl-01{
		margin-bottom: 2.605vw;
	}
	#HOME .use-clm .img-cnt{
		margin-bottom: 7.509vw;
	}
	#HOME .use-clm .flex-wrap-01{
		margin-bottom: 8.417vw;
		gap: 7.141vw 5.209vw;
	}
	#HOME .use-clm .flex-cnt-01{
		width: calc((100% - 5.209vw) / 2);
	}
    #HOME .use-clm .flex-cnt-01 .ttl-05 a {
		border-bottom: 0.261vw solid #5B451D;
		padding-bottom: 2.105vw;
	}
	#HOME .use-clm .flex-cnt-01 .use01{
		width: 4.11vw;
		margin-right: 3.646vw;
	}
	#HOME .use-clm .flex-cnt-01 .use02{
		width: 4.11vw;
		margin-right: 3.777vw;
	}
	#HOME .use-clm .flex-cnt-01 .use03{
		width: 4.683vw;
		margin-right: 2.605vw;
	}
	#HOME .use-clm .flex-cnt-01 .use04{
		width: 4.553vw;
		margin-right: 2.605vw;
	}
	#HOME .use-clm .flex-cnt-01 .use05{
		width: 4.11vw;
		margin-right: 3.777vw;
	}
	#HOME .use-clm .flex-cnt-01 .arrow{
		width: 1.433vw;
		height: 2.344vw;
	}
	#HOME .use-clm .btn-wrap{
		gap: 0 5.209vw;
		margin-top: 7.813vw;
	}
    #HOME .use-clm .btn-wrap .btn-01{
        width: calc((100% - 5.209vw) /2);
    }
    #HOME .use-clm .btn-wrap .btn-01 a{
        text-align: left;
        width: 100%;
    }


	/*===大切にしていること===*/
	#HOME .important-clm{
		margin-bottom: 19.532vw;
	}
	#HOME .important-clm .ttl-01{
		margin-bottom: 2.605vw;
	}
	#HOME .important-clm .flex-wrap-01{
		flex-wrap: wrap;
		gap: 5.99vw 3.516vw;
	}
	#HOME .important-clm .flex-cnt-01{
		width: calc((100% - 3.516vw) / 2);
	}
	#HOME .important-clm .ttl-03{
		margin-top: 2.605vw;
	}
	#HOME .important-clm a .arrow{
		width: 1.433vw;
		height: 2.344vw;
	}
	#HOME .important-clm a .link-ex{
		width: 3.125vw;
		height: 3.125vw;
	}
	/*===SNS===*/
	#HOME .sns-clm{
        padding: 7.813vw 0 10.417vw;
		margin-bottom: 18.532vw;
	}
	#HOME .sns-clm .flex-wrap-01{
		gap: 7.413vw 0;
		justify-content: center;
	}
	#HOME .sns-clm .flex-cnt-01{
		width: 70.703vw;
	}
	#HOME .sns-clm .link-01 a{
		padding-bottom: 3.907vw;
		border-bottom: 0.261vw solid #5B451D;
        width: 100%;
	}
	#HOME .sns-clm .link-01 .svg-img{
		width: 7.813vw;
		margin-right: 3.907vw;
	}
	#HOME .sns-clm .link-01 a .arrow{
		width: 1.433vw;
		height: 2.344vw;
        margin-left: auto;
	}

	/* //メインエリア
	---------------------------------------------------- */

	/* 補足エリア
	---------------------------------------------------- */
	.sup-section{
		padding: 0;
		background: none;
	}
	.sup-section .clm-cnt{
		flex-direction: column;
		gap: 5.209vw 0;
		position: relative;
		z-index: 0;
	}
	.sup-section .clm-cnt .clm-01{
		width: 100%;
		padding: 10.417vw 0 15.625vw;
		background-color: #F3F0F0;
	}
	.sup-section .clm-cnt .clm-01:not(:last-child)::after{
		display: none;
	}
	.sup-section .clm-cnt .clm-01::before{
		content: "";
		display: block;
		position: absolute;
		width: 100vw;
		height: 100%;
		background-color: #F3F0F0;
		left: -5.208vw;
		top: 0;
		z-index: -1;
	}
	.sup-section .clm-ttl{
		font-size: 5.209vw;
		margin-bottom: 10.021vw;
	}
	.sup-section .clm-ttl .svg-img{
		width: 15.625vw;
		margin: 0 auto 1.605vw;
	}
	.sup-section .item:not(:last-child){
		margin-bottom: 11.021vw;
	}
	.sup-section .item .ttl-02{
		margin-bottom: 2.605vw;
	}
	.sup-section .item .txt-02.bold{
		margin-bottom:1.303vw;
	}
	.sup-section .item p:not(.otodoke) + .txt-02.bold{
		margin-top: 1.303vw;
	}
	.sup-section .item .link-01{
		margin-top: 2.605vw;
	}
	.sup-section .item .link-01 a{
		font-size: 2.604vw;
		border-bottom: 0.26vw solid #5B451D;
	}
	.sup-section .item .link-01 + .txt-02{
		margin-top: 5.079vw;
	}
	.sup-section .item .link-01 a .arrow{
		width: 1.172vw;
		height: 1.823vw;
	}
	.sup-section .clm-cnt .otodoke{
		font-size: 3.385vw;
		margin-bottom: 2.604vw;
	}
	/* //補足エリア
	---------------------------------------------------- */



}