@charset "utf-8";
/*
【スマートフォン 2025】トップページ用
2025年度にリニューアルした時のCSSです 次回のリニューアル時に
その年の西暦をファイル名にして作成します。
細かな更新などは次回のリニューアルまで使用 ※例えば2026年度の更新はこのファイルに記載
*/


	
/* ----------------------------------------
スマートフォンはトップページのみ
スライダーとヘッダーを重ねる
---------------------------------------- */
header {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 2;
	
	width: 100%;
}

#main {
    padding: 0;
}

/* ----------------------------------------
スライダー
---------------------------------------- */
#index .main-slider {
	padding: 0;
}
#index .main-slider .sample1 {
	position: relative;
	overflow: hidden;
}

/********** スライダーバナーなど **********/
#index .main-slider .slick-track .slick-slide {
	width: 100%;
}
#index .main-slider .slick-track .slick-slide {
	padding: 0;
}
#index .main-slider .slick-track .slick-slide a {
	display: block;
}
#index .main-slider .slick-track .slick-slide img {
	display: block;
	width: 100%;
	height: auto;
}

	
/* ----------------------------------------
ILLUSTRATION CAKE
---------------------------------------- */
#index .illustration-cake {
	padding: 14vw 4vw 18vw;
	background: url("../images/index-2025/bg-illustration-cake.jpg") no-repeat 0 0;
	background-size: cover;
}

/********** 見出し **********/
#index .illustration-cake h2 {
	padding: 0 0 2.2vw;
}

/********** キャッチ **********/
#index .illustration-cake .txt-catch {
	display: flex;
	justify-content: center;
	
	padding: 0 0 3vw 3.2vw;
	text-align: center;
	letter-spacing: 0.01em;
	font-size: 4.2vw;
	font-weight: 600;
	
	background: url("../images/index-2025/t-illustration-cake-left.svg") no-repeat 2.2vw 1.5vw,
				url("../images/index-2025/t-illustration-cake-right.svg") no-repeat calc(100% - 2vw) 1.5vw;
	background-size: 4vw auto, 4vw auto;
}

/********** 白い背景の角丸 **********/
#index .illustration-cake .illustration-cake-wrapper {
	padding: 8vw 0 7vw;
	border: solid 1px #d7b98c;
	border-radius: 10vw;
	text-align: center;
	background: #fff;
}

/********** txt-1 **********/
#index .illustration-cake .txt-1 {
	padding: 0 0 3vw;
}
#index .illustration-cake .txt-1 p {
	line-height: 1.7;
	font-size: 4.4vw;
}
#index .illustration-cake .txt-1 p .mark-1 {
	color: #e62350;
}

/********** txt-2 **********/
#index .illustration-cake .txt-2 {
	padding: 0 0 3vw;
}
#index .illustration-cake .txt-2 p {
	line-height: 1.7;
	font-size: 3.6vw;
}

/********** img-illustration-cake **********/
#index .illustration-cake .img-illustration-cake {
	width: 76%;
	margin: 0 auto 7vw;
}
#index .illustration-cake .img-illustration-cake img {
	display: block;
}

/********** bnr **********/
#index .illustration-cake .bnr {
	padding: 0 0 3vw;
}
#index .illustration-cake .bnr a {
	display: block;
	text-decoration: none;
}
#index .illustration-cake .bnr .bnr-txt {
	padding: 0 0 2vw;
	text-align: center;
	font-size: 3.6vw;
}
#index .illustration-cake .bnr .bnr-img {
	width: 87%;
	margin: 0 auto;
	text-align: center;
}


/* ----------------------------------------
ケーキへの着色は果物と食品で優しく
---------------------------------------- */
#index .chakushoku {
	padding: 10vw 4vw;
	background: #d2ebeb;
}
#index .chakushoku .chakushoku-wrapper {
	padding: 1.4vw 1.4vw;
	border-radius: 10vw;
	text-align: center;
	background: #fff;
}
#index .chakushoku .chakushoku-box {
	padding: 6.7vw 0 8.6vw;
	border-radius: 8vw;
	border: solid 1px #d7b98c;
}
#index .chakushoku h2 {
	padding: 0 0 2.8vw;
	font-size: 4.4vw;
}
#index .chakushoku h2 .mark-1 {
	display: block;
	color: #e62350;
}
#index .chakushoku .txt {
	padding: 0 0 5.5vw;
	font-size: 3.6vw;
}
#index .chakushoku .btn-about {
	display: flex;
	justify-content: center;
	
}
#index .chakushoku .btn-about a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 70vw;
	height: 15vw;
	border-radius: 15vw;
	text-decoration: none;
	font-size: 4.4vw;
	color: #fff;
	background: #f22359 url("../images/index-2025/btn-arrow-white.svg") no-repeat calc(100% - 6vw) 50%;
	background-size: 2vw 3.6vw;
}


/* ----------------------------------------
ORDER
---------------------------------------- */
#index .order {
	padding: 14vw 4vw 16vw;
	text-align: center;
	background: #feeff3;
}
#index .order h2 {
	padding: 0 0 2vw;
}
#index .order .txt {
	padding: 0 0 4.5vw;
	line-height: 1.5;
	font-weight: 600;
	font-size: 4.2vw;
}
#index .order .btn-list {
	padding: 0 0 3.5vw;
}
#index .order .btn-list ul {
}
#index .order .btn-list ul li {
	padding: 0 0 2.5vw;
}
#index .order .btn-list ul li a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 80vw;
	height: 15vw;
	margin: 0 auto;
	border-radius: 15vw;
	border: solid 1px #282828;
	text-decoration: none;
	font-weight: 600;
	font-size: 4.4vw;
	color: #282828;
	background: #fff;
}


/********** LINEから簡単ご注文 **********/
#index .order .line-order {
	margin: 0 0 4vw;
	padding: 9vw 0 10vw;
	border: solid 1px #d7b98c;
	border-radius: 10vw;
	text-align: center;
	background: #fff;
}

#index .order .line-order h3 {
	padding: 0 0 2vw;
	font-size: 4.2vw;
	font-weight: 600;
	color: #e62350;
}
#index .order .line-order .txt-line {
	padding: 0 0 4vw;
}
#index .order .line-order .txt-line p {
	line-height: 1.6;
	font-size: 3.6vw;
}
#index .order .line-order .txt-line p .line-id {
	font-weight: bold;
}
#index .order .btn-order-line {
	display: flex;
	justify-content: center;
}
#index .order .btn-order-line a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 70vw;
	height: 15vw;
	border-radius: 15vw;
	text-decoration: none;
	font-size: 4.4vw;
	color: #fff;
	background: #f22359 url("../images/index-2025/btn-arrow-white.svg") no-repeat calc(100% - 6vw) 50%;
	background-size: 2vw 3.6vw;
}
#index .order .txt-mail-error p {
	line-height: 1.6;
	font-size: 3.4vw;
}


/* ----------------------------------------
CATEGORY
---------------------------------------- */
#index .category {
	padding: 18vw 4vw 12vw;
	text-align: center;
	background: url("../images/index-2025/bg-category.png") repeat-x 50% 0vw;
	background-size: 192% auto;
}

/* 見出し */
#index .category .common-heading-1 {
	padding: 0 0 2vw;
}

/* テキスト */
#index .category .cat-txt {
	padding: 0 0 5vw;
	font-size: 4.2vw;
	font-weight: 600;
}

/********** カテゴリーリスト **********/
#index .category .category-box ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	
	width: 100%;
}
#index .category .category-box ul li {
	width: 48%;
	margin: 0 0 5vw;
}
#index .category .category-box ul li a {
	display: block;
	text-decoration: none;
}
#index .category .category-box ul li a .item-thumb {
	padding: 0 0 2vw;
}
#index .category .category-box ul li a .item-thumb img {
	display: block;
	border-radius: 4vw;
}
#index .category .category-box ul li a .item-name {
	font-size: 3.6vw;
	font-weight: 600;
	color: #e62350;
}


/* ----------------------------------------
NEWS
---------------------------------------- */
#index .news {
	margin: 0 0 14.5vw;
	padding: 14vw 4vw 16vw;
	background: #d2ebeb;
}
#index .news .common-heading-1 {
	padding: 0 0 2vw;
}
#index .news .cat-txt {
	text-align: center;
	padding: 0 0 3vw;
	line-height: 1.7;
	font-weight: 600;
	font-size: 4vw;
}

#index .news ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	
	width: 100%;
}
#index .news ul li {
	width: 48.75%;
	margin: 0 0 2vw;
}
#index .news ul li a {
	display: block;
	padding: 2.5vw 2.5vw 3vw;
	border-radius: 3vw;
	font-size: 3.2vw;
	background: #fff;
	overflow: hidden;
}
#index .news ul li a .eye-catch-image {
	padding: 0 0 2vw;
}
#index .news ul li a .eye-catch-image img {
	display: block;
	
	object-fit: cover;
	width: 100%;
	height: 40vw;
}
#index .news ul li a .title {
}


/* ----------------------------------------
PRICE
---------------------------------------- */
#index .price {
	padding: 0 0 90px;
}


/********** 見出し **********/
#index .price h2 {
	padding: 0 0 1.5vw;
}
#index .price .price-txt {
	text-align: center;
	padding: 0 0 3.5vw;
	line-height: 1.7;
	font-weight: 600;
	font-size: 4vw;
}


/********** 価格表 **********/
#index .price .img-price {
	margin: 0 0 7vw;
}


/********** テキスト **********/
#index .price .txt-price-shop {
	margin: 0 0 3vw;
}
#index .price .txt-price-shop p {
	text-align: center;
	font-size: 3.6vw;
}

/********** ボタン **********/
#index .price .btn-size {
	display: flex;
	justify-content: center;
	
	width: 100%;
	margin: 0 0 13vw;
}
#index .price .btn-size a {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 70vw;
	height: 15vw;
	margin: 0 auto;
	border-radius: 15vw;
	border: solid 1px #282828;
	text-decoration: none;
	font-weight: 600;
	font-size: 4.4vw;
	color: #282828;
	background: #fff url("../images/index-2025/btn-arrow-black.svg") no-repeat calc(100% - 6vw) 50%;
	background-size: 2vw 3.6vw;
}

/********** バナー **********/
#index .price .bnrs {
	padding: 0 4vw;
}
#index .price .bnrs ul {
}
#index .price .bnrs ul li {
	padding: 0 0 3vw;
}
#index .price .bnrs ul li:last-child {
	padding: 0;
}





