@charset "UTF-8";
/* CSS Document */
/* mainArea */
.content01_bg {
	background-image: url("../img/top/content01_bg.webp");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: cover;
}
.content01_bg .mainArea {
	position: relative;
	height: 800px;
}
.content01_bg .mainArea:before {
	content: "";
	position: absolute;
	top: 120px;
	right: 0;
	background-image: url("../img/top/main_img.webp");
	background-repeat: no-repeat;
	background-position: right center;
	width: 100%;
	height: 700px;
	background-size: contain;
}
.content01_bg .mainArea .inner {
	height: 100%;
	padding: 0 20px;
	display: flex;
	align-items: center;
	position: relative;
}
.content01_bg .mainArea .inner p {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: 900;
	font-size: 55px;
	padding-top: 80px;
	text-shadow: 1px 1px 2px #fff,2px 2px 4px #fff,2px 2px 4px #fff,2px 2px 4px #fff;
}

/* h2 */
/* btn */
.content02_bg .aboutArea .inner .left h2,
.content02_bg .gmArea .inner .right h2,
.content02_bg .cafetArea .inner .left h2,
.content02_bg .rsArea .inner .right h2,
.content02_bg .purchaseArea .inner .left h2 {
	font-weight: 900;
	font-size: 18px;
	position: relative;
	margin-bottom: 36px;
}
.content02_bg .aboutArea .inner .left h2:before,
.content02_bg .gmArea .inner .right h2:before,
.content02_bg .cafetArea .inner .left h2:before,
.content02_bg .rsArea .inner .right h2:before,
.content02_bg .purchaseArea .inner .left h2:before {
	position: absolute;
	bottom: 0;
	left: 0;
}

/* btn */
.btn {
	padding-top: 36px;
}
.btn02 {
	position: relative;
	display: inline-block;
	color: #ec6d45;
	text-align: left;
	line-height: 30px;
	padding-right: 50px;
	transition: ease .2s;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: 900;
	font-size: 15px;
}
.btn02:hover {
	color: #403632;
}
.btnarrow:after {
	content: url("../img/common/arrow01.svg");
	position: absolute;
	width: 30px;
	height: 30px;
	top: 0;
	right: 10px;
	transition: all .3s;
}
.btnarrow02:after {
	content: url("../img/common/arrow02.svg");
	position: absolute;
	width: 30px;
	height: 30px;
	top: 0;
	right: 10px;
	transition: all .3s;
}
.btnarrow:hover:after,
.btnarrow02:hover:after {
	right: 0;
}

/* newsArea */
.newsArea .inner {
	padding: 80px 20px 40px;
	display: flex;
	justify-content: space-between;
}
.newsArea .inner .right {
	width: calc(20%);
	text-align: center;
	position: relative;
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}
.newsArea .inner .left {
	width: calc(80%);
	margin-right: 40px;
}
.newsArea .inner .left ul li {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 10px 0;
	font-size: 15px;
}
.newsArea .inner .left ul li .n_left {
	width: calc(12%);
}
.newsArea .inner .left ul li .n_left .date {
	color: #3c9ab0;
}
.newsArea .inner .left ul li .n_left .date .ttl a {
	color: #333;
}
.newsArea .inner .left ul li .n_left .date .ttl a:hover {
	color: #115aa1;
}
.newsArea .inner .left ul li .n_right {
	width: calc(88%);
	margin-left: 20px;
}
.newsArea .inner .left ul li .n_right .ttl a {
	font-weight: 700;
}

/* igArea */
.igArea .inner {
	padding: 40px 20px 80px;
	display: flex;
	justify-content: space-between;
}
.igArea .inner .left {
	width: calc(80%);
}
.igArea .inner .right {
	width: calc(20%);
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}
.igArea .inner .left #sb_instagram {
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
.igArea .inner .left #sb_instagram #sbi_images {
 display: flex;
 justify-content: flex-start;
 flex-wrap: wrap;
 margin: 0 auto;
 max-width: 1000px;
}
.igArea .inner .left #sb_instagram #sbi_images .sbi_item {
 width: 14.6666666%;
 margin: 10px 1% 0;
 position: relative;
 overflow: hidden;
}
.sbi-screenreader {
 display: none;
}
.sbi_photo_wrap a {
 display: block;
}
.sbi_photo_wrap a img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.sbi_photo_wrap a:hover {
 opacity: .7;
}
.sbi_photo_wrap svg {
 display: none;
}
/*20241203調整*/
#sbi_images {
    gap: 0!important;
}
.igArea .inner .ig #sb_instagram #sbi_images .sbi_item img{
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

/* content02_bg */
.content02_bg {
	background-image: url("../img/top/content02_bg_l.webp"),url("../img/top/content02_bg_r.webp");
	background-repeat: no-repeat,no-repeat;
	background-position: left center,bottom 200px right;
}

/* aboutArea */
.content02_bg .aboutArea {
	max-width: 1500px;
	margin: 0 auto;
	/*background-image: url("../img/top/about_bg.webp");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: contain;*/
}
.content02_bg .aboutArea .inner {
	padding: 20px 20px 60px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	z-index: 2;
}
.content02_bg .aboutArea .inner .left {
	width: calc(40%);
}
.content02_bg .aboutArea .inner .left h2 {
	padding-bottom: 56px;
}
.content02_bg .aboutArea .inner .left p {
	font-weight: 700;
}
.content02_bg .aboutArea .inner .left h2:before {
	content: url("../img/top/about_ttl.svg");
	width: 226px;
}
.content02_bg .aboutArea .inner .right {
	width: calc(60%);
	margin-left: 40px;
}
.content02_bg .aboutArea .inner .right .img {
	background-image: url("../img/top/about_img.webp");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	aspect-ratio: 8/6;
	position: relative;
}
.content02_bg .aboutArea .inner .right .img:before {
	content: url("../img/top/about_circle.svg");
	position: absolute;
	/*bottom: -80px;
	right: -80px;
	z-index: -1;*/
	bottom: -35px;
    right: 0px;
    z-index: 0;
	width: 240px;
}

/* gmArea */
.content02_bg .gmArea .inner {
	padding: 60px 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row-reverse;
	position: relative;
	z-index: 2;
}
.content02_bg .gmArea .inner .left {
	width: calc(60%);
	margin-right: 40px;
}
.content02_bg .gmArea .inner .left .img {
	background-image: url("../img/top/gm_img.webp?v=230601");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
	aspect-ratio: 5/3;
	position: relative;
}
.content02_bg .gmArea .inner .left .img:before {
	content: url("../img/top/gm_circle.svg");
	position: absolute;
	bottom: -80px;
	left: -80px;
	z-index: -1;
	width: 260px;
}
.content02_bg .gmArea .inner .right {
	width: calc(40%);
}
.content02_bg .gmArea .inner .right h2 {
	padding-bottom: 86px;
}
.content02_bg .gmArea .inner .right p {
	font-weight: 700;
}
.content02_bg .gmArea .inner .right h2:before {
	content: url("../img/top/gm_ttl.svg");
	width: 317px;
}

/* cafetArea */
.content02_bg .cafetArea .inner {
	padding: 60px 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	z-index: 2;
}
.content02_bg .cafetArea .inner .left {
	width: calc(40%);
}
.content02_bg .cafetArea .inner .left h2 {
	padding-bottom: 56px;
}
.content02_bg .cafetArea .inner .left p {
	font-weight: 700;
}
.content02_bg .cafetArea .inner .left h2:before {
	content: url("../img/top/cafe_ttl.svg");
	width: 150px;
}
.content02_bg .cafetArea .inner .right {
	width: calc(60%);
	margin-left: 40px;
}
.content02_bg .cafetArea .inner .right .img {
	background-image: url("../img/top/cafe_img.webp");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: contain;
	aspect-ratio: 5/3;
	position: relative;
}
.content02_bg .cafetArea .inner .right .img:before {
	content: url("../img/top/cafe_circle.svg");
	position: absolute;
	top: -100px;
	right: -100px;
	z-index: -1;
	width: 320px;
}

/* rsArea */
.content02_bg .rsArea .inner {
	padding: 60px 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row-reverse;
	position: relative;
	z-index: 2;
}
.content02_bg .rsArea .inner .left {
	width: calc(60%);
	margin-right: 40px;
}
.content02_bg .rsArea .inner .left .img {
	background-image: url("../img/top/rs_img.webp");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
	aspect-ratio: 5/3;
	position: relative;
}
.content02_bg .rsArea .inner .left .img:before {
	content: url("../img/top/rs_circle.svg");
	position: absolute;
	bottom: -80px;
	left: -80px;
	z-index: -1;
	width: 266px;
}
.content02_bg .rsArea .inner .right {
	width: calc(40%);
}
.content02_bg .rsArea .inner .right h2 {
	padding-bottom: 56px;
}
.content02_bg .rsArea .inner .right p {
	font-weight: 700;
}
.content02_bg .rsArea .inner .right h2:before {
	content: url("../img/top/rs_ttl.svg");
	width: 322px;
}

/* purchaseArea */
.content02_bg .purchaseArea .inner {
	padding: 60px 20px 260px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	z-index: 2;
}
.content02_bg .purchaseArea .inner .left {
	width: calc(40%);
}
.content02_bg .purchaseArea .inner .left h2 {
	padding-bottom: 56px;
}
.content02_bg .purchaseArea .inner .left p {
	font-weight: 700;
}
.content02_bg .purchaseArea .inner .left h2:before {
	content: url("../img/top/purchase_ttl.svg");
	width: 214px;
}
.content02_bg .purchaseArea .inner .right {
	width: calc(60%);
	margin-left: 40px;
}
.content02_bg .purchaseArea .inner .right .img {
	background-image: url("../img/top/purchase_img.webp");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: contain;
	aspect-ratio: 5/3;
	position: relative;
}
.content02_bg .purchaseArea .inner .right .img:before {
	content: url("../img/top/purchase_circle.svg");
	position: absolute;
	top: -80px;
	right: -80px;
	z-index: -1;
	width: 268px;
}

@media screen and (min-width: 2600px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 900px;
	}
	.content01_bg .mainArea:before {
		height: 800px;
	}
}
@media screen and (min-width: 2200px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 860px;
	}
	.content01_bg .mainArea:before {
		height: 760px;
	}
}

@media screen and (max-width: 1800px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 700px;
	}
	.content01_bg .mainArea:before {
		height: 600px;
	}
}

@media screen and (max-width: 1700px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 660px;
	}
	.content01_bg .mainArea:before {
		height: 560px;
	}
}

@media screen and (max-width: 1600px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 600px;
	}
	.content01_bg .mainArea:before {
		height: 500px;
	}
}

@media screen and (max-width: 1400px) {
/* mainArea */
	.content01_bg .mainArea .inner p {
		font-size: 50px;
	}
}

@media screen and (max-width: 1300px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 560px;
	}
	.content01_bg .mainArea:before {
		height: 460px;
	}
	
/* aboutArea */
	.content02_bg .aboutArea .inner .right .img:before {
		bottom: 10px;
		right: 5px;
		width: 180px;
	}
	
/* gmArea */
	.content02_bg .gmArea .inner .left .img:before {
		left: -40px;
		width: 180px;
	}
	
/* cafetArea */
	.content02_bg .cafetArea .inner .right .img:before {
		top: -80px;
		right: -50px;
		width: 220px;
	}
	
/* rsArea */
	.content02_bg .rsArea .inner .left .img:before {
		left: -50px;
		width: 200px;
	}	
	
/* purchaseArea */
	.content02_bg .purchaseArea .inner .right .img:before {
		right: -50px;
		width: 200px;
	}
}

@media screen and (max-width: 1200px) {
/* mainArea */
	.content01_bg .mainArea .inner p {
		font-size: 46px;
	}
}

@media screen and (max-width: 1100px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 520px;
	}
	.content01_bg .mainArea:before {
		height: 420px;
	}
	.content01_bg .mainArea .inner p {
		font-size: 42px;
	}
}

@media screen and (max-width: 1000px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 500px;
	}
	.content01_bg .mainArea:before {
		height: 420px;
		top: 80px;
	}
	.content01_bg .mainArea .inner {
		padding: 0 3vw;
	}	
	.content01_bg .mainArea .inner p {
		font-size: 36px;
	}	
	
/* 共通 */
/* h2 */
.content02_bg .aboutArea .inner .left h2,
.content02_bg .gmArea .inner .right h2,
.content02_bg .cafetArea .inner .left h2,
.content02_bg .rsArea .inner .right h2,
.content02_bg .purchaseArea .inner .left h2 {
	font-size: 20px;
	margin-bottom: 20px;
}
/* btn */
.btn {
	padding-top: 30px;
}

/* newsArea */
	.newsArea .inner {
		padding: 60px 6vw 30px;
	}
	.newsArea .inner .left {
		width: calc(70%);
	margin-right: 20px;
	}	
	.newsArea .inner .right {
	width: calc(30%);
	}	
	.newsArea .inner .left ul li {
		display: block;
		font-size: 14px;
	}
	.newsArea .inner .left ul li .n_left {
		width: 100%;
		padding-bottom: 8px;
	}
	.newsArea .inner .left ul li .n_right {
		width: 100%;
		margin-left: 0;
	}
	.newsArea .inner .left ul li .n_right .ttl {
		line-height: 1.2;
	}

/* igArea */
	.igArea .inner {
		padding: 30px 6vw 40px;
	}
	.igArea .inner .left {
		width: calc(70%);
	}
	.igArea .inner .right {
		width: calc(30%);
	}

/* content02_bg */
	.content02_bg {
		background-position: left center,bottom 100px right;
		background-size: 300px,300px;
	}

/* aboutArea */
	.content02_bg .aboutArea {
		max-width: 100%;
		width: 100%;
		background-position: right -80px center;
	}
	.content02_bg .aboutArea .inner {
		padding: 20px 6vw 40px;
	}
	.content02_bg .aboutArea .inner .left h2 {
		padding-bottom: 46px;
	}
	.content02_bg .aboutArea .inner .left h2:before {
		width: 180px;
	}
	.content02_bg .aboutArea .inner .right {
		margin-left: 20px;
	}
	.content02_bg .aboutArea .inner .right .img:before {
		right: 0;
		width: 140px;
	}

/* gmArea */
	.content02_bg .gmArea .inner {
		padding: 40px 6vw;
	}
	.content02_bg .gmArea .inner .left {
		margin-right: 20px;
	}
	.content02_bg .gmArea .inner .left .img:before {
		bottom: -60px;
		left: -20px;
		width: 160px
	}
	.content02_bg .gmArea .inner .right h2 {
		padding-bottom: 76px;
	}
	.content02_bg .gmArea .inner .right h2:before {
		width: 260px;
	}

/* cafetArea */
	.content02_bg .cafetArea .inner {
		padding: 40px 6vw;
	}
	.content02_bg .cafetArea .inner .left h2 {
		padding-bottom: 46px;
	}
	.content02_bg .cafetArea .inner .left h2:before {
		width: 120px;
	}
	.content02_bg .cafetArea .inner .right {
		margin-left: 20px;
	}
	.content02_bg .cafetArea .inner .right .img:before {
		top: -60px;
		right: -20px;
		width: 180px;
	}

/* rsArea */
	.content02_bg .rsArea .inner {
		padding: 40px 6vw;
	}
	.content02_bg .rsArea .inner .left {
		margin-right: 20px;
	}
	.content02_bg .rsArea .inner .left .img:before {
		bottom: -60px;
		left: -20px;
		width: 200px;
	}
	.content02_bg .rsArea .inner .right h2 {
		padding-bottom: 46px;
	}
	.content02_bg .rsArea .inner .right h2:before {
		width: 260px;
	}

/* purchaseArea */
	.content02_bg .purchaseArea .inner {
		padding: 40px 6vw 160px;
	}
	.content02_bg .purchaseArea .inner .left h2 {
		padding-bottom: 46px;
	}
	.content02_bg .purchaseArea .inner .left h2:before {
		width: 170px;
	}
	.content02_bg .purchaseArea .inner .right {
		margin-left: 20px;
	}
	.content02_bg .purchaseArea .inner .right .img:before {
		bottom: -60px;
		right: -20px;
		width: 200px;
	}
}	

@media screen and (max-width: 960px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 480px;
	}
	.content01_bg .mainArea:before {
		height: 400px;
	}
}	

@media screen and (max-width: 900px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 460px;
	}
	.content01_bg .mainArea:before {
		height: 380px;
	}
	.content01_bg .mainArea .inner p {
		font-size: 32px;
	}	
}	

@media screen and (max-width: 860px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 420px;
	}
	.content01_bg .mainArea:before {
		height: 340px;
	}
	.content01_bg .mainArea .inner p {
		font-size: 30px;
	}	
}	

@media screen and (max-width: 767px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 380px;
	}
	.content01_bg .mainArea:before {
		height: 300px;
	}
	.content01_bg .mainArea .inner p {
		font-size: 26px;
	}	
	
/* newsArea */
	.newsArea .inner {
		padding-top: 36px;
		display: block;
	}
	.newsArea .inner .left {
		width: 100%;
		margin-right: 0;
	}
	.newsArea .inner .right {
		width: 100%;
	}
	.newsArea .inner .left ul li .n_left {
		padding-bottom: 2px;
	}
	
/* igArea */
	.igArea .inner {
		padding-top: 20px;
		display: block;
	}	
	.igArea .inner .left,
	.igArea .inner .right {
		width: 100%;
	}	
	
/* aboutArea */
	.content02_bg .aboutArea {
		background-position: right 0 center;
	}	
	.content02_bg .aboutArea .inner {
		padding: 40px 6vw;
		display: block;
	}
	.content02_bg .aboutArea .inner .left {
		width: 100%;
		padding-bottom: 30px;
	}	
	.content02_bg .aboutArea .inner .right {
		width: 100%;
		margin-left: 0;
	}	
	
/* gmArea */
	.content02_bg .gmArea .inner {
	 display: block;
	}
	.content02_bg .gmArea .inner .left {
		width: 100%;
		margin-right: 0;
	}	
	.content02_bg .gmArea .inner .right {
		width: 100%;
		padding-bottom: 30px;
	}	
	.content02_bg .gmArea .inner .left .img {
		background-position: center center;
	}
	
/* cafetArea */
	.content02_bg .cafetArea .inner {
		padding: 40px 6vw;
		display: block;
	}
	.content02_bg .cafetArea .inner .left {
		width: 100%;
		padding-bottom: 30px;
	}	
	.content02_bg .cafetArea .inner .right {
		width: 100%;
		margin-left: 0;
	}	
	.content02_bg .cafetArea .inner .right .img {
		background-position: center center;
	}
	
/* rsArea */
	.content02_bg .rsArea .inner {
	 display: block;
	}
	.content02_bg .rsArea .inner .left {
		width: 100%;
		margin-right: 0;
	}	
	.content02_bg .rsArea .inner .right {
		width: 100%;
		padding-bottom: 30px;
	}	
	.content02_bg .rsArea .inner .left .img {
		background-position: center center;
	}
	
/* purchaseArea */
	.content02_bg .purchaseArea .inner {
		display: block;
		padding-bottom: 120px;
	}
	.content02_bg .purchaseArea .inner .left {
		width: 100%;
		padding-bottom: 30px;
	}	
	.content02_bg .purchaseArea .inner .right {
		width: 100%;
		margin-left: 0;
	}	
	.content02_bg .purchaseArea .inner .right .img {
		background-position: center center;
	}
}	

@media screen and (max-width: 660px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 340px;
	}
	.content01_bg .mainArea:before {
		height: 260px;
	}
	.content01_bg .mainArea .inner p {
		font-size: 24px;
	}	
}	

@media screen and (max-width: 600px) {
/* 共通 */
/* h2 */
.content02_bg .aboutArea .inner .left h2,
.content02_bg .gmArea .inner .right h2,
.content02_bg .cafetArea .inner .left h2,
.content02_bg .rsArea .inner .right h2,
.content02_bg .purchaseArea .inner .left h2 {
	margin-bottom: 16px;
}
/* btn */
	.btn {
			padding-top: 16px;
	}	
/* mainArea */
	.content01_bg .mainArea {
		height: 540px;
	}
	.content01_bg .mainArea:before {
		height: 470px;
		top: 70px;
		background-image: url("../img/top/main_img_sp.webp");
	}
	.content01_bg .mainArea .inner p {
		font-size: 24px;
	}	
	
/* igArea */
	.igArea .inner {
   padding-bottom: 30px;
	}
	.igArea .inner .left #sb_instagram #sbi_images {
		justify-content: space-between;
	}	
	.igArea .inner .left #sb_instagram #sbi_images .sbi_item {
		width: calc(33.33% - 10px);
		margin: 10px 0 0;
	}
	
/* content02_bg */
	.content02_bg {
		background-position: left center,bottom 60px right;
		background-size: 200px,200px;
	}
	
/* gmArea */
/* cafetArea */
/* rsArea */
/* purchaseArea */
	.content02_bg .gmArea .inner,
	.content02_bg .cafetArea .inner,
	.content02_bg .rsArea .inner {
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.content02_bg .purchaseArea .inner {
		padding-top: 30px;
		padding-bottom: 100px;
	}
}

@media screen and (max-width: 560px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 500px;
	}
	.content01_bg .mainArea:before {
		height: 430px;
	}
}

@media screen and (max-width: 500px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 460px;
	}
	.content01_bg .mainArea:before {
		height: 390px;
	}
}

@media screen and (max-width: 460px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 400px;
	}
	.content01_bg .mainArea:before {
		height: 330px;
	}
}
@media screen and (max-width: 400px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 380px;
	}
	.content01_bg .mainArea:before {
		height: 310px;
	}
	.content01_bg .mainArea .inner p {
		font-size: 20px;
	}	
	
/* igArea */
	.igArea .inner .left #sb_instagram #sbi_images .sbi_item {
			width: calc(50% - 5px);
	}
}

@media screen and (max-width: 340px) {
/* mainArea */
	.content01_bg .mainArea {
		height: 360px;
	}
	.content01_bg .mainArea:before {
		height: 290px;
	}
}