@charset "utf-8";





html {
	padding: 167px 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 {
	padding-top: 20px;
}




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




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


/* --------------------------------------------------------------------------------
★★★indexの共通スタイル
-------------------------------------------------------------------------------- */
/* ----------------------------------------
見出し-1
---------------------------------------- */
#index h2.heading-1 {
	min-height: 80px;
	margin: 0 0 24px;
	padding: 0 0 0 86px;
	line-height: 1.1;
	font-weight: 900;
	background: url("../images/index-2025/t-icon.svg") no-repeat 0 3px;
}
#index h2.heading-1 * {
	font-weight: inherit;
}
#index h2.heading-1 .heading-catch {
	padding: 0 0 2px 0;
	display: block;
	font-size: 22px;
	letter-spacing: 0;
}
#index h2.heading-1 .heading-label {
	padding: 0 0 0 2px;
	display: block;
	font-size: 44px;
	letter-spacing: -0.1em;
}
#index h2.heading-1 .heading-label .mark-small-1 {
	font-size: 36px;
}


/* ----------------------------------------
見出し-2
---------------------------------------- */
#index h2.heading-2 {
	margin: 0 0 30px;
	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 2px 0;
	display: block;
	font-size: 22px;
	letter-spacing: 0;
}
#index h2.heading-2 .heading-label {
	padding: 0 0 0 2px;
	display: block;
	font-size: 44px;
	letter-spacing: -0.1em;
}
#index h2.heading-2 .heading-label .mark-small-1 {
	font-size: 44px;
}
#index h2.heading-2 .heading-label .mark-small-2 {
	font-size: 36px;
}


/* ----------------------------------------
シェイプ・背景
---------------------------------------- */
#index .zigzag {
	content: '';
	
	position: absolute;
	
	width: 100%;
	height: 20px;
	margin: -20px 0 0;
	background: url("../images/common-2025/bg-zigzag.svg") repeat-x 0 0;
	background-size: 1920px auto;
}
#index .wave {
	content: '';
	
	position: absolute;
	bottom: 0;
	
	width: 100%;
	height: 15px;
	background: url("../images/index-2025/bg-wave.svg") repeat-x 0 0;
	background-size: 1920px auto;
}




/* --------------------------------------------------------------------------------
★新入荷商品
-------------------------------------------------------------------------------- */
#index .new-arrival {
	position: relative;
	z-index: 2;
	
	padding: 14px 0 14px;
}
#index .new-arrival .new-arrival-wrapper {
	padding: 38px 0 54px;
	background: #fff;
}




/* --------------------------------------------------------------------------------
★売れ筋ランキング
-------------------------------------------------------------------------------- */
#index .ranking {
	position: relative;
	z-index: 1;
	margin: -15px 0 0;
	
	padding: 62px 0 125px;
	background: url("../images/index-2025/bg-pattren-dot.svg") repeat 0 0;
	background-size: 60px auto;
}
#index .ranking .ranking-box {
	padding: 30px 0 55px;
	border-radius: 30px;
	background: #fff;
}

/********** ランキングアイコン **********/
#index .ranking .slide-item a i {
	position: absolute;
	z-index: 2;
	top: 8px;
	left: 0;
	
	display: flex;
	justify-content: center;
	width: 60px;
	height: 64px;
	
	padding: 16px 0 0;
	
	color: #fff;
	font-weight: bold;
	font-size: 20px;
	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: -15px 0 0;
	
	padding: 62px 0 14px;
}
#index .pick-up .pick-up-wrapper {
	padding: 54px 0 86px;
	background: #fff;
}


/* 子供のイラスト */
#index .pick-up .img-kids {
	position: relative;
	width: 760px;
	margin: 0 auto;
}
#index .pick-up .img-kids img {
	position: absolute;
	
	margin: -129px 0 0;
}
#index .pick-up h2.heading-1 .heading-label .mark-blank-1 {
	display: inline-block;
	width: 15px;
}
#index .pick-up h2.heading-1 .heading-label .mark-exclamation-1 {
	display: inline-block;
	width: 17px;
}


/* pick-up-box */
#index .pick-up .pick-up-box {
	padding: 0 0 95px;
}


/* bnr-list */
#index .pick-up .bnr-list {
	padding: 0 0 ;
}
#index .pick-up .bnr-list ul {
	display: flex;
	justify-content: space-between;
	
	width: 100%;
}
#index .pick-up .bnr-list ul li {
	width: 520px;
}
#index .pick-up .bnr-list ul li a {
	display: block;
}
#index .pick-up .bnr-list ul li .thumb {
	display: block;
	padding: 0 0 4px;
}
#index .pick-up .bnr-list ul li .label {
	text-align: center;
	font-size: 20px;
}


/* --------------------------------------------------------------------------------
★用途で選ぶ
-------------------------------------------------------------------------------- */
#index .select-youto {
	position: relative;
	margin: -10px 0 0;
	padding: 77px 0 90px;
	
	background: url("../images/index-2025/bg-pattren-stripe.svg") repeat 0 0;
	background-size: 55px auto;
}
#index .select-youto .select-youto-box {
	border-radius: 30px;
	padding: 40px;
	background: #fff;
}

/********** リスト **********/
#index .select-youto .youto-list {
}
#index .select-youto .youto-list ul {
	display: flex;
	flex-wrap: wrap;
	
	width: 100%;
}
#index .select-youto .youto-list ul li {
	width: 300px;
	margin: 0 50px 25px 0;
}
#index .select-youto .youto-list ul li:nth-of-type(3n) {
	margin-right: 0;
}
#index .select-youto .youto-list ul li:nth-of-type(4),
#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: 255px;
	text-decoration: none;
}
#index .select-youto .youto-list ul li.line-2 a {
	height: 280px;
}

/* 画像 */
#index .select-youto .youto-list ul li .bnr {
	border-radius: 20px;
	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: 10px;
	bottom: 0;
	z-index: 2;
	
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 280px;
	height: 40px;
	padding: 10px 20px;
	
	border-radius: 20px;
	text-align: center;
	font-size: 20px;
	color: #fff;
	background: #87b900;
}

/* label */
#index .select-youto .youto-list ul li.line-2 .label {
	height: 65px;
	line-height: 1.2;
}


/* --------------------------------------------------------------------------------
★お菓子を選ぼう!
-------------------------------------------------------------------------------- */
#index .select-item {
	position: relative;
	z-index: 2;
	margin: -15px 0 0;
	
	padding: 15px 0 14px;
}
#index .select-item .select-item-wrapper {
	position: relative;
	
	padding: 60px 0 75px;
	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: 
		1920px auto,
		1920px auto,
		1920px auto;

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

	/* 各画像の配置位置を設定 */
	background-position: 
		50% 437px,   /* (3) 右上端に配置 */
		50% 1213px,  /* (2) 中央上端に配置 */
		50% 1934px;
	
}



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



/********** 中見出し **********/
#index .select-item h3 {
	padding: 10px 24px;
	border-radius: 6px;
	font-size: 34px;
	color: #fff;
	background: #e65000;
}

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

/********** カテゴリー：小見出し **********/
#index .select-item .cat h4 {
	padding: 0 0 23px;
	font-size: 30px;
}
#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 45px;
}

/********** カテゴリーリスト **********/
#index .select-item .cat .cat-list {
	padding: 0 0 31px 20px;
}
#index .select-item .cat .cat-list ul {
	display: flex;
	
	width: 100%;
}
#index .select-item .cat .cat-list ul li {
	width: 160px;
	margin: 0 16px 2px 0;
}
#index .select-item .cat .cat-list ul li .img {
	padding: 5px;
	border-radius: 160px;
	margin: 0 0 5px;
	height: 160px;
	border: solid 4px #e65000;
	overflow: hidden;
}

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

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

#index .select-item .cat .cat-list ul li .img img {
	position: relative;
	display: block;
	width: 160px;
	margin: -9px 0 0 -9px;
	max-width: none;
}
#index .select-item .cat .cat-list ul li .label {
	text-align: center;
	line-height: 1.3;
	font-size: 20px;
}

/********** もっと見るボタン **********/
#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: 240px;
	height: 60px;
	border-radius: 60px;
	text-align: center;
	font-size: 18px;
	color: #fff;
	background: #1e1e14 url("../images/index-2025/btn-arrow-white.svg") no-repeat 210px 50%;
	background-size: 9px auto;
}

/********** 価格で選ぶ **********/
/* 価格で選ぶ：中見出し */
#index .select-item .price h3 {
	margin: 0 0 29px;
}
#index .select-item .price .price-list {
	padding: 0 0 42px;
}
#index .select-item .price .price-list ul {
	display: flex;
	flex-wrap: wrap;
	
	width: 100%;
}
#index .select-item .price .price-list ul li {
	width: 258px;
	margin: 0 16px 16px 0;
}
#index .select-item .price .price-list ul li:nth-of-type(4n) {
	margin-right: 0;
}
#index .select-item .price .price-list a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 100%;
	height: 60px;
	border-radius: 60px;
	border: solid 2px #e65000;
	text-align: center;
	text-decoration: none;
	font-size: 18px;
	background: #faebdc url("../images/index-2025/btn-arrow-orange.svg") no-repeat 226px 50%;
	background-size: 9px auto;
}
#index .select-item .price .price-list a:hover {
	background-color: #f7de66;
}


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


/* --------------------------------------------------------------------------------
★いろんなお菓子が大集合
-------------------------------------------------------------------------------- */
#index .ironna {
	padding: 0 0 90px;
}
#index .ironna .ironna-box {
	padding: 30px 0 9px;
	border-radius: 30px;
	background: #fff;
}


/* --------------------------------------------------------------------------------
★店番からの最新情報
-------------------------------------------------------------------------------- */
#index .news .news-wrapper {
	padding: 0 0 0 520px;
	background: url("../images/index-2025/img-news.png") no-repeat 0 0;
	background-size: 460px auto;
}

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

/********** 白い角丸 **********/
#index .news .news-box {
	width: 100%;
	
	padding: 30px 12px 30px 30px;
	border-radius: 20px;
	background: #fff;
}
#index .news .news-box ul {
	height: 440px;
	padding: 0 20px 0 0;
	overflow: auto;
}
#index .news .news-box ul li {
	padding: 0 0 20px;
	font-size: 16px;
}
#index .news .news-box ul li a {
	display: block;
	text-decoration: none;
}












