/* --- 1. 固定させて、後ろから来る要素に被られるセクション --- */
/* --- 変更点 --- */
#business02,
#business03,
#business04 {
    position: -webkit-sticky;
    position: sticky;
    top: 0; 
    width: 100%;
    box-shadow: 0 -5px 20px rgba(0,0,0,0.05); 
}

/* --- 2. 重なり順（z-index）の指定 --- */
/* 後ろの要素ほど数値を大きくして、上に乗るようにします */

#business02 {
    z-index: 1;
}

#business03 {
    z-index: 2;
}

#business04 {
    z-index: 3;
}

/* --- 3. 最後に被さるが、そのままスクロールしていくセクション --- */
.other {
    position: relative;
    z-index: 4; 
    box-shadow: 0 -5px 20px rgba(0,0,0,0.05); 
}
.sns,
.company,
.cta-contact,
.footer {
	position: relative;
	z-index: 5;
}

/* snsセクションは特別な記述不要（通常通りotherの下に続きます） */

.ib {
	display: inline-block;
}
.ball_title {
	position: relative;
	margin-bottom: 60px;
}
.ball_title_bg {
	position: absolute;
	top: -20px;
	left: -10px;
	width: 100px;
	opacity: .5;
	pointer-events: none;
}
.ball_title_heading {
	display: flex;
	flex-direction: column;
}
.ball_title_ja {
	margin-bottom: 7px;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.8;
}
.sns .ball_title_ja {
	color: #2D362C;
}
.ball_title_en {
}
.news .ball_title_en {
	width: 79px;
}
.business .ball_title_en {
	width: 199px;
}
.sns .ball_title_en {
	width: 64px;
}
.company .ball_title_en {
	width: 203px;
}
@media (min-width: 1024px) {
	.ball_title {
		margin-bottom: 120px;
	}
	.ball_title_bg {
		top: -50px;
		left: -80px;
		width: 200px;
	}
	.ball_title_heading {
	}
	.ball_title_ja {
		margin-bottom: 14px;
		font-size: 16px;
	}
	.ball_title_en {
	}
	.news .ball_title_en {
		width: 157px;
	}
	.business .ball_title_en {
		width: 398px;
	}
	.sns .ball_title_en {
		width: 127px;
	}
	.company .ball_title_en {
		width: 407px;
	}
}

.fv {
	position: relative;
	padding: 0;
}
.fv_bg {
	width: 100%;
}
.cover_bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: .8;
}
.fv_title {
	position: absolute;
	top: 51.5%;
	left: 8.5%;
	width: 72%;
	mix-blend-mode: difference;
	opacity: 0;
}
.fv_lead {
	position: absolute;
	top: 14%;
	right: 20%;
	width: 68px;
}
.fv_treat {
	position: absolute;
	top: 25%;
	left: 50%;
	transform: translateX(-50%);
	width: 250px;
	mix-blend-mode: screen;
	opacity: .7;
	transform-origin: center center;
	animation: fvTreatRotate 60s linear infinite;
}
@keyframes fvTreatRotate {
	from {
		transform: translateX(-50%) rotate(0deg);
	}
	to {
		transform: translateX(-50%) rotate(360deg);
	}
}
@keyframes fvTreatRotate_pc {
	from {
		transform: translate(-50%, -50%) rotate(0deg);
	}
	to {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}

@media (min-width: 1024px) {
	.fv_title {
		top: 42.9%;
		left: 4.4%;
		width: 27.6%;
		mix-blend-mode: color-dodge;
	}
	.fv_lead {
		top: 15%;
		right: 29%;
		width: 5.4%;
	}
	.fv_treat {
		top: 50%;
		left: 50%;
		width: 37%;
		animation: fvTreatRotate_pc 60s linear infinite;
	}
}

.news {
	background: #000;
}
.news_inner {
	position: relative;
}
.news_list {
}
.news_list_item {
	margin-bottom: 24px;
	padding-bottom: 16px;
	border-bottom: .5px solid #A3A3A3;
}
.news_list_link {
	display: flex;
	gap: 12px;
}
.news_list_thumb {
	width: 90px;
	height: 90px;
	overflow: hidden;
}
.news_list_thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.news_list_body {
	width: calc(100% - 102px);
}
.news_list_date {
	margin-right: 16px;
	color: #A3A3A3;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: .04em;
}
.news_list_category {
	display: inline-block;
	padding: 2px 6px;
	background: #B2D5AA;
	color: #2D362C;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .08em;
}
.news_list_category-category-01 {
	background: #B2D5AA;
}
.news_list_category-category-02 {
	background: #93BFCD;
}
.news_list_category-category-03 {
	background: #DEDAA9;
}
.news_list_title {
	position: relative;
	margin-top: 6px;
	padding-right: 32px;
	color: #fff;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.8;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
.news_list_title::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 16px;
	transform: translateY(-50%);
	display: block;
	width: 10px;
	height: 10px;
	background-image: url("../img/news/icon_news_item.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}
.news_page_link_wrap {
	margin-top: 48px;
}
.news_noitem {
	color: #fff;
}
@media (min-width: 1024px) {
	.news {
	}
	.news_list {
	}
	.news_list_item {
		margin-bottom: 0;
		padding: 16px 32px;
		border-bottom: 1px solid #A3A3A3;
	}
	.news_list_link {
		align-items: center;
		gap: 24px;
	}
	.news_list_thumb {
		width: 100px;
		height: 100px;
	}
	.news_list_body {
		display: flex;
		align-items: center;
		gap: 32px;
		width: calc(100% - 124px);
	}
	.news_list_date {
		flex-shrink: 0;
		margin-right: 0;
		font-size: 16px;
	}
	.news_list_category {
		flex-shrink: 0;
		padding: 4px 16px;
		font-size: 14px;
	}
	.news_list_title {
		flex-grow: 1;
		margin-top: 0;
		padding-right: 32px;
		letter-spacing: .04em;
		-webkit-line-clamp: 1;
		background-image: linear-gradient(#ffffff, #ffffff);
		background-repeat: no-repeat;
		background-position: bottom right 32px;
		background-size: 0 1px;
		transition: .7s background-size ease;
	}
	.news_list_link:hover .news_list_title {
		background-position: bottom left;
		background-size: calc(100% - 32px) 1px;
		opacity: 1;
	}
	.news_list_title::after {
		right: 0;
		width: 14px;
		height: 14px;
	}
	.news_page_link_wrap {
		position: absolute;
		top: 0;
		right: 100px;
	}
	.news_page_link {
		height: 44px;
		padding: 0 24px;
		gap: 12px;
	}
}

.business {
	color: #fff;
	background-image:
		url(../img/common/bg_texture.png),
		linear-gradient(171.07deg, #495365 4.46%, #000000 26.15%, #000000 78.66%, #536D51 107.5%);
	background-blend-mode: multiply;
}
.business_title {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 16px;
	font-weight: 400;
	line-height: 1;
}
.business .business_title,
.business03 .business_title {
	color: #8FAB8F;
}
.business02 .business_title,
.business04 .business_title {
	color: #617E64;
}
.business_title_text {
	font-size: 14px;
}
.business_title_index {
	display: flex;
	align-items: baseline;
}
.business_title_hash {
	font-size: 20px;
}
.business_title_num {
	font-size: 60px;
}
.business_sub_title {
	position: relative;
	margin-bottom: 56px;
	padding-left: 28px;
	font-size: 24px;
	font-weight: 900;
	line-height: 1.6;
}
.business_sub_title::before {
	content: '';
	position: absolute;
	top: 19px;
	left: 0;
	width: 20px;
	height: 1px;
	background: #fff;
}
.business02 .business_sub_title::before,
.business04 .business_sub_title::before {
	background: #2D362C;
}
.business_img {
	margin-bottom: 40px;
}
.business02 .business_img {
	width: 220px;
	box-shadow: 4px 4px 0 0 #ACACAC80;
}
.business03 .business_img {
	width: 130px;
}
.business04 .business_img {
	width: 220px;
}
.business_lead {
	margin-bottom: 40px;
	font-size: 24px;
	font-weight: 900;
	line-height: 1.6;
}
.business_text {
	margin-bottom: 40px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 2.2;
	text-align: justify;
}
.business_link {
	gap: 30px;
	max-width: 320px;
	padding: 0 30px;
}
.business_icon_external {
	width: 10px;
}
.business_img_logo {
	width: 222px;
	margin-bottom: 40px;
}
.business_img_01 {
	width: 347px;
	margin: 0 auto 40px;
}
.business_img_02 {
	width: 213px;
	margin: 90px auto 40px 0;
}
.business_img_03 {
	width: 164px;
	margin: 0 0 0 auto;
}
@media (min-width: 1024px) {
	.business {
		background-image:
			url(../img/common/bg_texture.png),
			linear-gradient(171.07deg, #495365 4.46%, #000000 26.15%, #000000 78.66%, #536D51 107.5%);
	}
	.business_title {
		gap: 12px;
		margin-bottom: 72px;
	}
	.business_title_text {
		font-size: 24px;
	}
	.business_title_index {
	}
	.business_title_hash {
		font-size: 40px;
	}
	.business_title_num {
		font-size: 96px;
	}
	.business_sub_title {
		margin-bottom: 32px;
		padding-left: 56px;
		font-size: 32px;
	}
	.business_sub_title::before {
		top: 25px;
		width: 40px;
	}
	.business_img {
		margin-bottom: 72px;
	}
	.business02 .business_img {
		width: 400px;
	}
	.business03 .business_img {
		width: 230px;
	}
	.business04 .business_img {
		width: 400px;
	}
	.business_lead {
		margin-bottom: 32px;
		line-height: 2;
	}
	.business_text {
	}
	.business_link {
		max-width: 520px;
		padding: 0 40px;
	}
	.business_icon_external {
		width: 15px;
	}
	.business_img_logo {
		width: 416px;
		margin-bottom: 72px;
	}
	.business_img_01 {
		width: 100%;
		margin: 0 auto 64px;
	}
	.business_img_02 {
		width: 457px;
		margin: 110px auto 273px 0;
	}
	.business_img_03 {
		width: 354px;
	}
	.business_inner {
		display: flex;
		justify-content: space-between;
		gap: 80px;
	}
	.business_left {
		width: 50%;
		max-width: 556px;
	}
	.business_right {
		width: 50%;
		max-width: 556px;
		padding-top: 20px;
	}
}

.business02 {
	color: #2D362C;
	background-image: url("../img/top/bg_business02_sp.jpg");
	background-size: cover;
	background-position: top right;
	background-repeat: no-repeat;
	padding: 80px 0;
}
@media (min-width: 1024px) {
	.business02 {
		background-image: url("../img/top/bg_business02.jpg");
		padding: 220px 0;
	}
}

.business03 {
	color: #fff;
	background-image: url("../img/top/bg_business03_sp.jpg");
	background-size: cover;
	background-position: top right;
	background-repeat: no-repeat;
	padding: 80px 0;
}
@media (min-width: 1024px) {
	.business03 {
		background-image: url("../img/top/bg_business03.jpg");
		padding: 220px 0;
	}
}

.business04 {
	color: #2D362C;
	background-image: url("../img/top/bg_business04_sp.jpg");
	background-size: cover;
	background-position: top right;
	background-repeat: no-repeat;
	padding: 80px 0;
}
@media (min-width: 1024px) {
	.business04 {
		background-image: url("../img/top/bg_business04.jpg");
		padding: 220px 0;
	}
}

.map {
	background: #000;
	padding: 80px 0;
}
.map_wrap {
	position: relative;
}
.map_text {
	margin: 0 auto 24px;
	color: #fff;
	font-size: 18px;
	font-weight: 900;
	line-height: 1.8;
	letter-spacing: .2em;
	writing-mode: vertical-rl;
}
.map_img {
}
@media (min-width: 1024px) {
	.map {
		padding: 220px 0;
	}
	.map_text {
		position: absolute;
		top: 0;
		left: 11%;
		margin: 0;
		font-size: 24px;
		letter-spacing: .3em;
	}
}

.shop {
	position: relative;
	background-image:
		url(../img/common/bg_texture_white.png),
		linear-gradient(345.16deg, #9DB2A6 3.02%, #D8E0DC 22.23%, #E7EDE9 27.49%, #FFFFFF 39.58%, #F0F6FC 79.98%, #DDE8F4 93.27%);
	background-blend-mode: screen;
	padding: 80px 0 160px;
	overflow: hidden;
}
.bg_tobby {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 160px;
	pointer-events: none;
}
.shop_title {
	position: relative;
	width: 273px;
	margin-bottom: 40px;
	padding-left: 30px;
}
.shop_title::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 20px;
	height: 1px;
	background: #2D362C;
}
.scroll_guide {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.8;
	letter-spacing: 0.04em;
	color: #2D362C;
}
.scroll_guide_icon {
	width: 12px;
}
.scroll_guide_icon svg {
	fill: #2D362C;
	stroke: #fff;
}
.shop_list_wrap {
	width: calc(50vw + 50%);
	margin-bottom: 40px;
	padding-bottom: 8px;
	overflow-x: scroll;
}
.shop_list {
	display: flex;
	gap: 15px;
}
.shop_item {
	width: 145px;
	min-width: 145px;
	color: #2D362C;
}
.shop_item_img {
	margin-bottom: 8px;
}
.shop_item_name {
	margin-bottom: 4px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.5;
}
.shop_item_price {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.5;
}
.shop_item_price .sub {
	display: inline-block;
	margin-left: 3px;
	color: #6A6A6A;
	font-size: 10px;
	font-weight: 500;
}
.shop_link {
	max-width: 320px;
}
.shop_icon_external {
	width: 10px;
}
@media (min-width: 1024px) {
	.shop {
		padding: 220px 0 240px;
	}
	.bg_tobby {
		width: 352px;
	}
	.shop_title {
		width: 364px;
		margin-bottom: 45px;
		padding-left: 60px;
	}
	.shop_title::before {
		width: 40px;
	}
	.scroll_guide {
		gap: 20px;
		margin-bottom: 40px;
		font-size: 16px;
	}
	.scroll_guide_icon {
		width: 14px;
	}
	.shop_list_wrap {
		margin-bottom: 60px;
		padding-bottom: 12px;
	}
	.shop_list {
		gap: 32px;
	}
	.shop_item {
		width: 304px;
		min-width: 304px;
	}
	.shop_item_img {
		margin-bottom: 16px;
	}
	.shop_item_name {
		margin-bottom: 8px;
		font-size: 18px;
	}
	.shop_item_price {
		font-size: 20px;
	}
	.shop_item_price .sub {
		color: #6A6A6A;
	}
	.shop_link {
		margin: 0 auto;
		max-width: 520px;
	}
	.shop_icon_external {
		width: 15px;
	}
}

.series {
	background-image:
		url(../img/common/bg_texture.png),
		linear-gradient(171.07deg, #495365 4.46%, #000000 26.15%, #000000 78.66%, #536D51 107.5%);
	background-blend-mode: multiply;
	padding: 80px 0;
	color: #fff;
}
.series_title {
	position: relative;
	width: 219px;
	margin-bottom: 60px;
	padding-left: 30px;
}
.series_title::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 20px;
	height: 1px;
	background: #fff;
}
.series_list {
	display: flex;
	flex-wrap: wrap;
	gap: 24px 14px;
}
.series_item {
	width: calc((100% - 14px) / 2);
}
.series_item_media {
	margin-bottom: 8px;
}
.series_item_text {
	font-size: 15px;
	font-weight: 900;
	line-height: 1.4;
	text-align: center;
}
@media (min-width: 1024px) {
	.series {
		padding: 220px 0;
	}
	.series_title {
		width: 292px;
		margin-bottom: 120px;
		padding-left: 60px;
	}
	.series_title::before {
		width: 40px;
	}
	.series_list {
		gap: 60px 28px;
	}
	.series_item {
		width: calc((100% - 28px * 3) / 4);
	}
	.series_item_media {
		margin-bottom: 16px;
	}
	.series_item_text {
		font-size: 20px;
		line-height: 1.5;
	}
}

.other {
	background-image: url("../img/top/bg_other_sp.jpg");
	background-size: cover;
	background-position: top right;
	background-repeat: no-repeat;
	padding: 80px 0;
}
.other_inner {
}
.other_title {
	width: 198px;
	margin-bottom: 60px;
}
.other_link_wrap {
	display: flex;
	flex-direction: column;
	gap: 30px;
}
.other_link {
	padding: 0 30px;
}
.other_icon_external {
	width: 10px;
}
.other_link_disable {
	border: none;
	pointer-events: none;
}
@media (min-width: 1024px) {
	.other {
		background-image: url("../img/top/bg_other.jpg");
		padding: 220px 0;
	}
	.other_inner {
		display: flex;
		justify-content: space-between;
		gap: 40px;
	}
	.other_title {
		width: 397px;
		margin-bottom: 0;
	}
	.other_link_wrap {
		gap: 60px;
		width: 50%;
		padding-top: 20px;
	}
	.other_link {
		max-width: 520px;
		padding: 0 40px;
	}
	.other_icon_external {
		width: 15px;
	}
	.other_link_disable {
	}
}

.sns {
	background-image:
		url(../img/common/bg_texture_white.png),
		linear-gradient(345.16deg, #9DB2A6 3.02%, #D8E0DC 22.23%, #E7EDE9 27.49%, #FFFFFF 39.58%, #F0F6FC 79.98%, #DDE8F4 93.27%);
	background-blend-mode: screen;
	padding: 80px 0;
	color: #2D362C;
}
.sns_group {
	margin-bottom: 60px;
}
.sns_group:last-child {
	margin-bottom: 0;
}
.sns_link {
	max-width: 160px;
	height: 30px;
	margin: 0 0 20px;
	padding: 0 20px;
}
.sns_title {
	display: flex;
	align-items: center;
	gap: 4px;
}
.sns_icon {
	width: 15px;
}
.sns_name {
	font-family: "Zen Old Mincho", serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
}
.sns_icon_external {
	width: 10px;
}
.sns_timeline {
}
.sns section {
	padding: 0;
}
.sns #sb-tiktok-feeds-container-1 .sb-post-item-wrap {
	margin-bottom: 0;
}
@media (min-width: 1024px) {
	.sns {
		padding: 220px 0;
	}
	.sns_group {
		margin-bottom: 120px;
	}
	.sns_group:last-child {
		margin-bottom: 0;
	}
	.sns_link {
		max-width: 320px;
		height: 60px;
		padding: 0 40px;
	}
	.sns_title {
		gap: 8px;
	}
	.sns_icon {
		width: 30px;
	}
	.sns_name {
		font-size: 24px;
	}
	.sns_icon_external {
		width: 15px;
	}
	.sns_timeline {
	}
}

.company {
	background-image: url("../img/top/bg_company_sp.jpg");
	background-size: cover;
	background-position: top right;
	background-repeat: no-repeat;
	padding: 80px 0;
	color: #fff;
}
.company_wrap {
}
.company_content {
	margin-bottom: 60px;
}
.company_lead {
	width: 201px;
	margin-bottom: 30px;
}
.company_text {
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 2.2;
	text-align: justify;
}
.company_link_wrap {
	display: flex;
	flex-direction: column;
	gap: 30px;
}
.company_link {
}
@media (min-width: 1024px) {
	.company {
		background-image: url("../img/top/bg_company.jpg");
		padding: 220px 0;
	}
	.company_wrap {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		gap: 40px;
	}
	.company_content {
		width: 50%;
		max-width: 440px;
		margin-bottom: 0;
	}
	.company_lead {
		width: 225px;
		margin-bottom: 80px;
	}
	.company_text {
	}
	.company_link_wrap {
		width: 50%;
		max-width: 520px;
	}
	.company_link {
		max-width: none;
	}
}


