@charset "utf-8";





html {
	padding: 15vw 0 0;
}


/* --------------------------------------------------------------------------------
メイン幅
-------------------------------------------------------------------------------- */
.fs-l-main {
	max-width: none;
}
.fs-l-pageMain {
	max-width: none;
}


.fs-l-main,
.fs-l-pageMain,
.fs-c-breadcrumb {
	width: 100%;
}
.fs-l-main {
	margin: 0;
	background: transparent;
	border-radius: 0;
	padding: 0;
}

#footer-sp {
	padding-top: 5vw;
}


/* --------------------------------------------------------------------------------
フッター
-------------------------------------------------------------------------------- */
#footer-sp {
}


/* --------------------------------------------------------------------------------
★スライダー（カルーセル：コマースクリエイター版）
-------------------------------------------------------------------------------- */
.main-slider-unit {
	padding: 0 0 11vw;
	background: url("../images/index-2025/bg-pattren-stripe.svg") repeat 0 0;
	background-size: 5.5vw auto;
}
.main-slider-unit .main-slider-unit-box {
}
.main-slider-unit .fs-pt-carousel__slide {
	display: block !important;
}




/* --------------------------------------------------------------------------------
indexメイン
-------------------------------------------------------------------------------- */
#index {
	
}


/* --------------------------------------------------------------------------------
★★★indexの共通スタイル
-------------------------------------------------------------------------------- */
/* ----------------------------------------
見出し-1
---------------------------------------- */
#index h2.heading-1 {
	min-height: 13.5vw;
	margin: 0 0 4vw;
	padding: 0 0 0 15.5vw;
	line-height: 1.1;
	font-weight: 900;
	background: url("../images/index-2025/t-icon.svg") no-repeat 3vw 1vw;
	background-size: 12vw auto;
}
#index h2.heading-1 * {
	font-weight: inherit;
}
#index h2.heading-1 .heading-catch {
	padding: 1vw 0 0 1vw;
	display: block;
	font-size: 4vw;
	letter-spacing: 0;
}
#index h2.heading-1 .heading-label {
	padding: 0 0 0 1vw;
	display: block;
	font-size: 7vw;
	letter-spacing: -0.1em;
}
#index h2.heading-1 .heading-label .mark-small-1 {
	font-size: 6vw;
}


/* ----------------------------------------
見出し-2
---------------------------------------- */
#index h2.heading-2 {
	margin: 0 0 3vw;
	line-height: 1.1;
	text-align: center;
	font-weight: 900;
}
#index h2.heading-2 * {
	font-weight: inherit;
}
#index h2.heading-2 .heading-catch {
	padding: 0 0 1vw 0;
	display: block;
	font-size: 4vw;
	letter-spacing: 0;
}
#index h2.heading-2 .heading-label {
	padding: 0 0 0 1vw;
	display: block;
	font-size: 7vw;
	letter-spacing: -0.1em;
}
#index h2.heading-2 .heading-label .mark-small-1 {
	font-size: 7vw;
}
#index h2.heading-2 .heading-label .mark-small-2 {
	font-size: 6vw;
}


/* ----------------------------------------
シェイプ・背景
---------------------------------------- */
#index .zigzag {
	content: '';
	position: absolute;
	width: 100%;
	height: 2vw;
	margin: -1.8vw 0 0;
	background: url("../images/common-2025/bg-zigzag.svg") repeat-x -6vw 0;
	background-size: 383vw auto;
}
#index .wave {
	content: '';
	position: absolute;
	bottom: -1vw;
	width: 100%;
	height: 4vw;
	background: url("../images/index-2025/bg-wave.svg") repeat-x -10vw 100%;
	background-size: 388vw auto;
}




/* --------------------------------------------------------------------------------
★新入荷商品
-------------------------------------------------------------------------------- */
#index .new-arrival {
	position: relative;
	z-index: 2;
	
	margin: -3vw 0 0;
	padding: 2vw 0 2vw;
}
#index .new-arrival .new-arrival-wrapper {
	padding: 7vw 0 10vw;
	background: #fff;
}




/* --------------------------------------------------------------------------------
★売れ筋ランキング
-------------------------------------------------------------------------------- */
#index .ranking {
	position: relative;
	z-index: 1;
	margin: -3vw 0 0;
	
	padding: 11vw 0 19.5vw;
	background: url("../images/index-2025/bg-pattren-dot.svg") repeat 0 0;
	background-size: 6vw auto;
}
#index .ranking .ranking-box {
	padding: 4vw 0 8vw;
	border-radius: 5vw;
	background: #fff;
}

/********** ランキングアイコン **********/
#index .ranking .slide-item a i {
	position: absolute;
	z-index: 2;
	top: 1vw;
	left: 1vw;
	
	display: flex;
	justify-content: center;
	width: 9vw;
	height: 9.9vw;
	
	padding: 2vw 0 0;
	
	color: #fff;
	font-weight: bold;
	font-size: 3.6vw;
	background: url("../images/index-2025/icon-rank4.svg") no-repeat 0 0;
	background-size: 100% auto;
}
#index .ranking .slide-item-1 a i {
	background-image: url("../images/index-2025/icon-rank1.svg");
}
#index .ranking .slide-item-2 a i {
	background-image: url("../images/index-2025/icon-rank2.svg");
}
#index .ranking .slide-item-3 a i {
	background-image: url("../images/index-2025/icon-rank3.svg");
}




/* --------------------------------------------------------------------------------
★店番のPICK UP!お菓子
-------------------------------------------------------------------------------- */
#index .pick-up {
	position: relative;
	z-index: 1;
	margin: -5vw 0 0;
	
	padding: 9vw 0 3vw;
}
#index .pick-up .pick-up-wrapper {
	padding: 11vw 0 7vw;
	background: #fff;
}


/* 子供のイラスト */
#index .pick-up .img-kids {
	position: relative;
	width: 90%;
	margin: 0 0 0 6vw;
}
#index .pick-up .img-kids img {
	position: absolute;
	
	margin: -14.5vw 0 0 -1vw;
}
#index .pick-up h2.heading-1 .heading-label .mark-blank-1 {
	display: inline-block;
	width: 1vw;
}
#index .pick-up h2.heading-1 .heading-label .mark-exclamation-1 {
	display: inline-block;
	width: 2.5vw;
}


/* pick-up-box */
#index .pick-up .pick-up-box {
	padding: 0 0 11vw;
}


/* bnr-list */
#index .pick-up .bnr-list {
	padding: 0 7vw 0;
}
#index .pick-up .bnr-list ul {
}
#index .pick-up .bnr-list ul li {
	padding: 0 0 6vw;
}
#index .pick-up .bnr-list ul li a {
	display: block;
}
#index .pick-up .bnr-list ul li .thumb {
	display: block;
	padding: 0 0 1vw;
}
#index .pick-up .bnr-list ul li .label {
	text-align: center;
	font-size: 4.8vw;
}

#index .pick-up .wave {
	bottom: 0;
	height: 3vw;
}


/* --------------------------------------------------------------------------------
★用途で選ぶ
-------------------------------------------------------------------------------- */
#index .select-youto {
	position: relative;
	margin: -3vw 0 0;
	padding: 11.5vw 0 13vw;
	
	background: url("../images/index-2025/bg-pattren-stripe.svg") repeat 0 0;
	background-size: 5.5vw auto;
}
#index .select-youto .select-youto-box {
	border-radius: 5vw;
	padding: 8vw 3vw;
	background: #fff;
}

/********** 見出し **********/
#index .select-youto h2.heading-1 {
	margin-bottom: 2.5vw;
}

/********** リスト **********/
#index .select-youto .youto-list {
}
#index .select-youto .youto-list ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	
	width: 100%;
}
#index .select-youto .youto-list ul li {
	width: 48%;
	margin: 0 0 3.5vw 0;
}
#index .select-youto .youto-list ul li:nth-of-type(5),
#index .select-youto .youto-list ul li:nth-of-type(6) {
	margin-bottom: 0;
}
#index .select-youto .youto-list ul li a {
	position: relative;
	
	display: block;
	height: 48vw;
	text-decoration: none;
}

/* 画像 */
#index .select-youto .youto-list ul li .bnr {
	border-radius: 3vw;
	overflow: hidden;
}
#index .select-youto .youto-list ul li .bnr img {
	display: block;
}

/* label */
#index .select-youto .youto-list ul li .label {
	position: absolute;
	left: 4%;
	bottom: 1%;
	z-index: 2;
	
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 92%;
	height: 15vw;
	padding: 0 1vw;
	border-radius: 3vw;
	text-align: center;
	font-size: 4.4vw;
	color: #fff;
	background: #87b900;
}


/* --------------------------------------------------------------------------------
★お菓子を選ぼう!
-------------------------------------------------------------------------------- */
#index .select-item {
	position: relative;
	z-index: 2;
	margin: -5vw 0 0;
	
	padding: 5vw 0 3vw;
}
#index .select-item .select-item-wrapper {
	position: relative;
	
	padding: 11vw 0 15.5vw;
	background-color: #fff;
	
	/* 背景画像を指定 */
	background-image: 
		url('../images/index-2025/bg-musical-note.svg'),
		url('../images/index-2025/bg-musical-note.svg'),
		url('../images/index-2025/bg-musical-note.svg');
	
	/* 背景サイズを指定 */
	background-size: 
		288vw auto,
		288vw auto,
		288vw auto;

	/* 各画像の繰り返し設定 (すべてno-repeat) */
	background-repeat: no-repeat, no-repeat, no-repeat;

	/* 各画像の配置位置を設定 */
	background-position: 
		50% 128vw,
		50% 364vw,
		50% 559vw;
	
}



/********** 中見出し **********/
#index .select-item h2.heading-2 {
	margin-bottom: 6.5vw;
}



/********** 中見出し **********/
#index .select-item h3 {
	padding: 1.7vw 6.5vw;
	border-radius: 2vw;
	font-size: 5.4vw;
	color: #fff;
	background: #e65000;
}

/* ----------------------------------------
カテゴリー
---------------------------------------- */
#index .select-item .cat {
	padding: 0 0 8vw;
}
/********** カテゴリー：中見出し **********/
#index .select-item .cat h3 {
	margin: 0 0 5.5vw;
}

/********** カテゴリー：小見出し **********/
#index .select-item .cat h4 {
	padding: 0 0 4vw 3.5vw;
	font-size: 5vw;
}
#index .select-item .cat h4::before {
	content: '●';
}
#index .select-item .cat .cat-unit-yougashi h4::before {
	color: #e65000;
}
#index .select-item .cat .cat-unit-wagashi h4::before {
	color: #87b900;
}
#index .select-item .cat .cat-unit-dagashi h4::before {
	color: #6db2b6;
}

/********** カテゴリーリスト **********/
#index .select-item .cat .cat-unit {
	padding: 0 0 12vw;
}

/********** カテゴリーリスト **********/
#index .select-item .cat .cat-list {
	padding: 0 0 2vw 5vw;
}
#index .select-item .cat .cat-list ul {
	display: flex;
	flex-wrap: wrap;
	
	width: 100%;
}
#index .select-item .cat .cat-list ul li {
	position: relative;
	width: 28%;
	margin: 0 5.3% 4vw 0;
}
#index .select-item .cat .cat-list ul li:nth-of-type(3n) {
	margin-right: 0;
}
#index .select-item .cat .cat-list ul li a {
	display: block;
	text-align: center;
	text-decoration: none;
}
#index .select-item .cat .cat-list ul li .img {
	position: relative;
	width: 100%;
	border-radius: 50vw;
	border: solid 0.7vw #e65000;
	overflow: hidden;
}
#index .select-item .cat .cat-list ul li .img::before {
	content: "";
    display: block;
    padding-top: 100%;
}
#index .select-item .cat .cat-list ul li .img img {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 和菓子系 */
#index .select-item .cat-unit.cat-unit-wagashi .cat-list ul li .img {
	border: solid 0.7vw #87b900;
}

/* 駄菓子系 */
#index .select-item .cat-unit.cat-unit-dagashi .cat-list ul li .img {
	border: solid 0.7vw #6db2b6;
}

#index .select-item .cat .cat-list ul li .img img {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#index .select-item .cat .cat-list ul li .label {
	text-align: center;
	line-height: 1.3;
	font-size: 4.4vw;
}

/********** もっと見るボタン **********/
#index .select-item .cat .btn-more {
	display: flex;
	justify-content: center;
}
#index .select-item .cat .btn-more a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 48vw;
	height: 12vw;
	border-radius: 12vw;
	text-align: center;
	font-size: 4vw;
	color: #fff;
	background: #1e1e14 url("../images/index-2025/btn-arrow-white.svg") no-repeat calc(100% - 3vw) 50%;
	background-size: 1.8vw auto;
}

/********** 価格で選ぶ **********/
/* 価格で選ぶ：中見出し */
#index .select-item .price h3 {
	margin: 0 0 4vw;
}
#index .select-item .price .price-list {
	padding: 0 3vw 7vw;
}
#index .select-item .price .price-list ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	
	width: 100%;
}
#index .select-item .price .price-list ul li {
	width: 46vw;
	margin: 0 0 3vw 0;
}
#index .select-item .price .price-list a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 100%;
	height: 12vw;
	border-radius: 12vw;
	border: solid 0.4vw #e65000;
	text-align: center;
	text-decoration: none;
	font-size: 3.6vw;
	background: #faebdc url("../images/index-2025/btn-arrow-orange.svg") no-repeat calc(100% - 3vw) 50%;
	background-size: 1.8vw auto;
}

#index .select-item .wave {
	bottom: 0;
	height: 3vw;
}


/* --------------------------------------------------------------------------------
★いろんなお菓子が大集合 & 店番からの最新情報
-------------------------------------------------------------------------------- */
#index .ironna-news {
	position: relative;
	z-index: 1;
	margin: -5vw 0 0;
	
	padding: 13vw 0 14vw;
	background: url("../images/index-2025/bg-pattren-dot.svg") repeat 0 0;
	background-size: 6vw auto;
}


/* --------------------------------------------------------------------------------
★いろんなお菓子が大集合
-------------------------------------------------------------------------------- */
#index .ironna {
	padding: 0 0 13.5vw;
}
#index .ironna .ironna-box {
	padding: 10vw 0 10vw;
	border-radius: 5vw;
	background: #fff;
}


/* --------------------------------------------------------------------------------
★店番からの最新情報
-------------------------------------------------------------------------------- */
#index .news .news-wrapper {
	padding: 0 3vw 82.5vw;
	background: url("../images/index-2025/img-news.png") no-repeat 50% 100%;
	background-size: 69vw auto;
}

/********** 見出し **********/
#index .news h2.heading-2 {
	margin: 0 0 4vw;
}

/********** 白い角丸 **********/
#index .news .news-box {
	width: 100%;
	
	padding: 5vw 2vw 5vw 4vw;
	border-radius: 5vw;
	background: #fff;
}
#index .news .news-box ul {
	height: 100vw;
	padding: 0 2vw 0 0;
	overflow: auto;
}
#index .news .news-box ul li {
	padding: 0 0 5.5vw;
	line-height: 1.37;
	font-size: 4vw;
}
#index .news .news-box ul li:last-child {
	padding-bottom: 2vw;
}
#index .news .news-box ul li a {
	display: block;
	text-decoration: none;
}







