@charset "utf-8";

html, body, div, span, 
h1, h2, h3, h4, h5, h6, 
p, em, strong, i,
ul, ol, li, dl, dt, dd, 
table, th, td ,
address {
	margin:				0px;
	padding:			0px;
}

html,
body {
	width:				100%;
	font-family:		"Noto Sans JP", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI","Hiragino Kaku Gothic ProN", "Hiragino Sans","Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif;
	font-size:			16px;
	font-style:			normal;
	font-weight:		normal;
	line-height:		1.6em;
	text-align:			left;
	letter-spacing:		0.05em;
	color:				#061b33;
	overflow-wrap:		break-word;
	word-break:			break-all;
	outline:			none;
}

h6,
h5,
h4,
h3,
h2,
h1 {
	margin:				0px;
	padding:			0px;
	font-size:			100%;
	font-weight:		normal;
	text-align:			left;
	line-height:		100%;
}
h2 {
	position:			relative;
	padding:			20px 0;
	margin-bottom:		55px;
	color:				#fff;
	font-size:			32px;
	font-weight:		bold;
	text-align:			center;
	background-color:	#2b69f4;
	border-radius:		40px;
}
h2:after {
	content:			'';
	position:			absolute;
	display:			inline-block;
	bottom:				1px;
	width:				68px;
	height:				70px;
	margin-left:		0.5em;
	background-image:	url(../images/ttl_icon.png);
	background-size:	contain;
	background-repeat:	no-repeat;
	background-position:right bottom;
	vertical-align:		middle;
}

a {
	text-decoration:	none;
	color:				#000;
	transition:			all 0.5s;
}

a:hover {
	/* color: #2b69f4; */
	text-decoration:underline;
}

a:hover img {
/*	opacity:			0.8;*/
	filter:				brightness(0.6);
}

i, address {
	font-style:			normal;
}

p {
	text-align:			justify;
}

em {
	font-style:			normal;
	color:				#2b69f4;
}

@media all and (max-width: 700px) {

	body {
		font-size:		18px;
	}

	h2 {
		font-size:			20px;
		letter-spacing:		-0.05em;
	}

	h2:after {
		right:				20px;
		height:				55px;
		background-image: initial;
	}
}


/* レスポンシブ対応 */
/* ---------------------------------------------------------------- */
body {
	-webkit-text-size-adjust:	100%;
}

img {
	max-width:			100%;
	height:				auto;
}

@media all and (max-width: 700px) {

}

/* clearfix */
/* ================================================================ */

.clearfix:after {
	content:	"";
	display:	block;
	clear:		both;
}


/* ---------------------------------------------------------------- */

.txt_center {
	text-align:	center;
}
.txt_left {
	text-align:	left;
}
.txt_right {
	text-align:	right;
}


/* ---------------------------------------------------------------- */
header {
	position:			relative;
	box-sizing:			border-box;
	width:				100%;
	height:				80px;
	padding:			21px 0 0 0;
	border-bottom:		1px #b7b7b7 solid;
}
header h1 {
	width:				100%;
	max-width:			1000px;
	margin:				auto;
}

header a {
	text-decoration:	none;
	transition:			all 0.3s;
}
header a:hover {
	opacity:			0.8;
}

header.index_header {
	position:			fixed;
	box-sizing:			border-box;
	width:				100%;
	height:				80px;
/*	padding:			21px 0 0 0;*/
	border-bottom:		1px #b7b7b7 solid;
	background-color: 	#fff;
	display: 			flex;
	align-items: 		center;
	justify-content: 	space-between;
	padding: 			25px 30px;
	transition: 		.3s;
	z-index: 			999;
}

header.index_header h1 {
	width:				100%;
	max-width:			200px;
	margin: 			0;
}

header.index_header ul{
 display: 				flex;
 align-items: 			center;
}

header.index_header li{
	list-style: 			none;
	margin-right: 		30px;
	cursor:				pointer;
}

header.index_header li::before{
	font:				var(--fa-font-solid);
	content: 			"\f1b0";
}

.push{
	height: 			80px;
}

.push2{
	height: 			120px;
}

.push3{
	height: 			50px;
}
/* ---------------------------------------------------------------- */

footer {
	position:			relative;
	width:				100%;
	height:				260px;
	padding:			55px 0 0;
	color:				#fff;
	background-color:	#061b33;
	font-weight:		bold;
}

footer dt {
	padding-bottom:		14px;
}
footer dd {
	padding-bottom:		20px;
	font-size:			24px;
}

footer address {
	font-family:		Helvetica, sans-serif;
	font-size:			24px;
}
footer address a {
	color:				#fff;
}
footer address a:hover {
	text-decoration:	underline;
}

#copyright {
	position:			absolute;
	bottom:				0;
	left:				0;
	width:				100%;
	font-family:		Helvetica, sans-serif;
	font-size:			12px;
	text-align:			center;
}

#page_lift {
	position:			fixed;
	display:			inline-block;
	right:				10px;
	bottom:				10px;
	padding:			5px;
	font-size:			150%;
	text-align:			center;
	text-decoration:	none;
	border-radius:		50%;
	background-color:	#fff;
}
#page_lift a {
	color:				#2b68f4;
	opacity:			0.8;
}
#page_lift a:hover {
	color:				#2b68f4;
	opacity:			1.0;
}

@media all and (max-width: 950px) {
	header.index_header ul{
		display: 				none;
	}

	header.index_header li{
		display: 				none;
	}
}


@media all and (max-width: 700px) {
	footer dt {
		padding-bottom:		0;
		text-align:			center;
	}
	footer dd {
		text-align:			center;
	}

	footer address {
		text-align:			center;
	}
}

/* ---------------------------------------------------------------- */

.contents {
	width:				100%;
	max-width:			1000px;
	margin:				auto;
}

main {
	width:				100%;
	margin:				auto;
}

section {
	box-sizing:			border-box;
	width:				100%;
	max-width:			1000px;
	padding:			0;
	margin:				auto;
}

#new_shop>section {
	box-sizing:			border-box;
	width:				100%;
	max-width:			1200px;
	margin:				auto;
	opacity: 0;
	transform: translateY(50px);
	transition: opacity 1s ease-out, transform 1s ease-out;
}

#new_shop>section.show {
	opacity: 1;
	transform: translateY(0);
}



.half_r {
	float:				right;
	box-sizing:			border-box;
	width:				50%;
	padding:			20px;
}
.half_l {
	float:				left;
	box-sizing:			border-box;
	width:				50%;
	padding:			20px;
}

.half_c {
	text-align: 		center;
	padding:			2%;
}

.half_c img {
	width: 50%;
}

@media all and (max-width: 700px) {
	
	.half_c img {
	width: 100%;
	}
}

.matsuri img{
	padding-bottom:			2%;
}

	
.sp_only {
	display:			none;
}

.pc_only {
	display:			block;
}

.pc_only_a {
	display:			block;
	text-align: center;
}

.sp_line {
	display:			none;
	box-sizing:			border-box;
	width:				86.8%;
	padding:			10px 0;
	margin:				0 6.6% 20px;
	border-bottom:		2px #b7b7b7 solid;
}

.sp_line2 {
	display:			none;
	width:				100%;
	margin-bottom:		60px;
	border-bottom:		2px #b7b7b7 solid;
}

@media all and (max-width: 700px) {

	.sp_only {
		display:			block;
	}

	.pc_only {
		display:			none;
	}

	.sp_line {
		display:			block;
	}
	.sp_line2 {
		display:			block;
	}
	.sp_l {
		float:				left;
	}
	.sp_l_a {
		float:				left;
		width: 100%;
	}

	.sp_r {
		float:				right;
	}

	.sp_ra {
		float:				right;
	}

	.half_r {
		width:				100%;
	}
	.half_l {
		width:				100%;
	}
}

/* ---------------------------------------------------------------- */

#sct1 {
	font-weight:		bold;

}

#sct1 .half_r {
	padding:			40px 0 60px 0;
	text-align:			center;
}
#sct1 .half_r img {
	max-height:			640px;
}
#sct1 .half_l {
	padding:			70px 0 0 0;
}
#sct1 .half_l:nth-child(3) {
	padding:			0;
}

#sct1 .half_l > img {
	margin-bottom:		50px;
}
#sct1 .half_l > h2 {
	margin-bottom:		20px;
	margin-left:		-0.5em;
	font-weight:		bold;
	color:				#2b69f4;
	line-height:		100%;
	text-align:			left;
	background-color:	transparent;
}

#sct1 .half_l > h2:after {
	background-image:	none;
	margin-left:		0;
}

#sct1 .half_l > p {
	margin-bottom:		36px;
	line-height:		1.4em;
}

#btn_apple img {
	height:				60px;
	padding:			14px 0;
}

#btn_google img {
	height:				88px;
}

#btn_apple_sp img {
	height:				50px;
	padding:			14px 0;
}

#btn_google_sp img {
	height:				76px;
}

#sct1 .sp_line {
	float:				left;
}

@media all and (max-width: 700px) {

	#sct1 .half_r {
		padding:			0 0 70px 0;
	}

	#sct1 .half_r > img {
		max-height:			100%;
		width:				70%;
	}


	#sct1 .half_l {
		box-sizing:			border-box;
		padding:			50px 6.6% 0;
	}

	#sct1 .half_l:nth-child(3) {
		padding:			0 6.6% 0;
	}


	#sct1 .half_l > h2 {
		margin-left:		0;
		margin-bottom:		55px;
		color:				#fff;
		text-align:			center;
		background-color:	#2b69f4;
	}
	#sct1 .half_l > h2:after {
		background-image:	url(../images/ttl_icon.png);
		margin-left:		0.5em;
	}

	#sct1 .half_l > h2 span {
		display:			inline-block;
		margin-left:		-2.5em;
	}

	#sct1 .half_l > p {
		box-sizing:			border-box;
		padding:			0 10px;
	}

}

/* ---------------------------------------------------------------- */

#sct2, #sct6, #sct4, #sct3, #sct5 {
	padding:			85px 0 55px 0;
}

#sct7 {
	padding:			35px 0 25px 0;
}

#sct7b {
	padding:			3% 0 3% 0;
}

#sct8 {
	padding:			1% 0;
}

@media all and (max-width: 700px) {

	#sct2 {
		box-sizing:			border-box;
		padding:			35px 6.6% 55px;
	}

	#sct2 img.sp_only {
		margin:				60px auto;
	}

	#sct2 h2:after {
		background-image:	url(../images/ttl_icon.png);
		margin-left:		0.5em;
	}

	#sct2 .sp_line {
		width:				100%;
		margin:				0 0 20px;
	}

	#sct7 {
		box-sizing:			border-box;
	}

	#sct7 img.sp_only {
		margin:				60px auto;
	}

	#sct7 h2:after {
		background-image:	url(../images/ttl_icon.png);
		margin-left:		0.5em;
	}

	#sct7 .sp_line {
		width:				100%;
		margin:				0 0 20px;
	}

	#sct3 h2:after {
		background-image:	url(../images/ttl_icon.png);
		margin-left:		0.5em;
	}

	#sct4 h2:after {
		background-image:	url(../images/ttl_icon.png);
		margin-left:		0.5em;
	}

	#sct6 h2:after {
		background-image:	url(../images/ttl_icon.png);
		margin-left:		0.5em;
	}

	#sct2, #sct6, #sct4, #sct3, #sct5, #sct7 {
		padding:			35px 6.6% 55px;
	}
}

/* ---------------------------------------------------------------- */

#sct3_wrap {
	border-bottom:		1px #b7b7b7 solid;
	margin-bottom:		70px;
}

#sct3 {
	display:			flex;
	flex-wrap:			wrap;
}

#sct3 h2 {
	float:				left;
	width:				100%;
}
#sct3 > div {
	float:				left;
	position:			relative;
	margin-bottom:		55px;
}

#sct3 h3 {
	margin-bottom:		20px;
	font-weight:		bold;
	font-size:			20px;
	color:				#2b69f4;
}

#details h3 {
	margin-bottom:		20px;
	font-family:		Helvetica, sans-serif;
	font-weight:		bold;
	font-size:			36px;
	color:				#2b69f4;
}

#sct3 p {
	line-height:		1.4em;
	font-weight:		bold;
}

#sct3 p i {
	display:			inline-block;
}

.s3_screen {
	width:				26.2%;
}
.s3_illust {
	width:				35%;
}

.s3_illust_a {
	width:				35%;
}

.s3_arrow {
	width:				6.3%;
	text-align:			center;
}

#stepimg_1-2 {
	margin-top:			-70px;
}

#sct3 .sp_line2 {
	float:				left;
}

@media all and (max-width: 700px) {

	#sct3_wrap {
		box-sizing:			border-box;
		width:				86.8%;
		margin:				0 6.6% 60px;
		border-bottom:		2px #b7b7b7 solid;
	}

	#sct3 h2 span {
		display:			inline-block;
		margin-left:		-2.5em;
	}

	.s3_screen,
	.s3_illust {
		width:				100%;
	}
	.s3_screen img,
	.s3_illust img {
		width:				40%;
	}
	.s3_screen div {
		width:				54%;
		padding-top:		70px;
	}

	.s3_illust div {
		width:				54%;
		padding-top:		30px;
	}
	
	.s3_illust_a {
	width:				100%;
}


}

/* ---------------------------------------------------------------- */


@media all and (max-width: 700px) {

}

/* ---------------------------------------------------------------- */
#sct5 h2 {
	margin-bottom:		20px;
}

@media all and (max-width: 700px) {

	#sct5, #sct6 {
		box-sizing:			border-box;
		padding:			35px 6.6% 55px;
	}

	#sct5 h2:after {
		background-image:	url(../images/ttl_icon.png);
		margin-left:		0.5em;
	}
}

/* ---------------------------------------------------------------- */

#sct0 {
	padding:			35px 0 55px 0;
}

#sct0 h3 {
	box-sizing:			border-box;
	padding:			2em 1em 1em;
	font-weight:		bold;
}

#sct0 p {
	box-sizing:			border-box;
	padding:			1em;
}
#sct0 p span {
	display:			inline-block;
}

#sct0 ul {
	list-style:			none;
	margin-left:		1em;
	padding-right:		1em;
}
#sct0 ol {
	margin-left:		2.5em;
	padding-right:		1em;
}
#sct0 > ul > li,
#sct0 > ol > li {
	margin-bottom:		1em;
}

#sct0 ol.olin {
	margin-left:		2.3em;
}

#sct0 > ol.olin {
	margin-left:		3.5em;
}

#sct0 ol.olin li {
	margin-bottom:		0;
	list-style-type:	none;
	counter-increment:	cnt;
}

#sct0 ol.olin li::before {
	content:			"(" counter(cnt) ")";
	display:			inline-block;
	margin-left:		-2.3em;
	width:				2.3em;
}

@media all and (max-width: 700px) {
	#sct0 h2#pp {
		font-size:		17px;
		padding-left:	1em;
		text-align:		left;
	}
}

/* ---------------------------------------------------------------- */
.sp_raa {
	display: none;
}

@media all and (max-width: 700px) {
	.sp_ra {
		display: none;
	}

	.sp_raa {
		display: block;
	}
}

/* 新規入会---------------------------------------------------------------- */
.c_new2_btn {
	text-align: center;
}

.c_new2_2 {
	text-align: center;
	padding-top: 7%;
}

/* 食べて飲んで大当たり---------------------------------------------------------------- */
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.ed_pc { 
	display: block !important; 
	margin: auto;
	width: 100%;
}

.ed_pc_c { 
	display: block !important; 
	margin: auto;
	padding-bottom: 5%;
}

.ed_sp { display: none !important; }


/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 700px) {

	.ed_pc { display: none !important; }
	.ed_pc_c { display: none !important; }
	.ed_sp { display: block !important; }
}

.c_ed_btn {
	text-align: center;
}

.c_ed_2 {
	text-align: center;
}

@media only screen and (max-width: 700px) {
	.c_ed_2 {
		margin-top: 2%;
	}
}

.c_ed_3 {
	margin: 5%;
}

.c_ed_txt01 {
	text-align: center;
	font-size: 90%;
	line-height: 1.2em;
}

.c_ed_txt02 {
	text-align: center;
	font-size: 105%;
	padding-top: 1%;
	padding-bottom: 6%;
	font-weight: bold;
}

/*------------------------------------大泉追記----*/
.count_bg{
	background-color: 			#d1f0ff;
}

.countshop{
	background-color: 			#2b69f4;
	 height:					250px;
	 width:						250px;
	 border-radius:				50%;
	 text-align:				center;
	 box-shadow: 				0 0 15px 4px rgba(0,0,0,0.1);
}

.count-size{
	font-size:					6rem;
	font-weight: 				bold;
	color: 						#fff;
}

#box1{
	width: 				100%;
	max-width: 			480px;
	margin: 			auto;
	padding: 			15% 0;
}

#box1 p{
	text-align: 		center;
	line-height: 		2em;
	color: 				#fff;
}

hr{
	width: 				100%;
	max-width: 			200px;
	color: 				#fff;
	border: 			1px solid;
}

.storecount{
	font-size: 			60%;
	color: 				#fff;
}

.flex{
	display:			flex;
	flex-wrap:	 		wrap;
	margin-bottom: 		5%;
	justify-content: 	space-evenly;
	padding: 			5% 0 8% 0;
}

.newshop > ul li,
#shop > ul li{
	list-style: none;
}

.newshop > ul li{
	padding: 			1.5% 0;
}

.newshop > ul{
	padding-left: 19%;
}

#genre img{
	width: 					350px;
	height: 				200px;
	object-fit: 			cover;
	border-radius: 			25px;
}

#genre h4,
#shop h4{
	text-align: 			center;
	border-bottom: 			1px solid #979797;
	padding-top: 			3%;
	margin-bottom: 			2%;
	padding-bottom: 		2%;
}

#genre h4 span,
#shop h4 span{
	padding-left: 			0.5em;
}

.relative{
	position: 				relative;
}

#genre img.absolute01{
	position: 				absolute;
	width: 					62px;
	height: 				62px;
	right: 					5px;
	bottom:	 				22px;
}

#genre img.absolute02{
	position: 				absolute;
	width: 					62px;
	height: 				62px;
	right: 					69px;
	bottom:	 				22px;
}

#genre img.absolute03{
	position: 				absolute;
	width: 					62px;
	height: 				62px;
	right: 					132px;
	bottom:	 				22px;
}

#genre img.absolute04{
	position: 				absolute;
	width: 					62px;
	height: 				62px;
	right: 					5px;
	top:	 					22px;
}

#genre img.absolute05{
	position: 				absolute;
	width: 					62px;
	height: 				62px;
	right: 					69px;
	top:		 				22px;
}

#genre img.absolute06{
	position: 				absolute;
	width: 					62px;
	height: 				62px;
	right: 					132px;
	top:	 					22px;
}

.newshop{
	background-color: 		#fff;
	border-radius: 			20px;
	box-shadow: 			0 0 15px 4px rgba(0,0,0,0.1);
	width: 					100%;
	max-width: 				500px;
}

.newshop_new{
	padding-top: 			5%;
	text-align: 			center;
	font-weight: 			bold;
	display: 				flex;
	justify-content: 		start;
	align-items: 			center;
	flex-wrap: 				wrap;
}

.new{
	color: 					#fff;
	background-color: 		red;
	padding: 				3% 4%;
}

.newshop_new p{
	color: 					#2b69f4;
	padding-left: 			4%;
	width: 					100%;
}

.newshop ul > li > span{
	padding-left:           0.5em;
} 

.flex2{
	display:				flex;
	flex-wrap:	 			wrap;
	justify-content: 		space-between;
}

.flex2 div{
	width: 					32%;
	padding-bottom: 		3%;
	padding-top: 			3%;
}

.flex2 .genre_conte {
	width: 					100%;
	max-width: 				350px;
	filter: 				drop-shadow(5px 5px 5px #aaa);
}

.flex2::after{
	content:			"";
	display: 			block;
	width:				32%;
}

.flex2::before { 
	content:			""; 
	display:			block; 
	width:				32%;
	order: 				1;
}

.botan_bg{
	background-color: 	#fff;
	border-radius: 		35px;
	padding: 			5%;
	margin-top: 		-8%;
}

.botan_bg_c{
	background-color: 	#fff;
	border-radius: 		35px;
	padding: 			5%;
}

.botanbody {
	display: 				flex;
	justify-content: 		space-between;
	flex-wrap: 				wrap;

}

.shadow_btn02 {
	display: 				inline-block;
	width: 					100%;
	max-width: 				350px;
	border: 				1px solid #000;
	border-radius: 			5px;
	-webkit-box-shadow: 	4px 4px 0 #fadb21;
	box-shadow: 			4px 4px 0 #fadb21;
	font-weight: 			bold;
	text-decoration: 		none;
	text-align: 			center;
	transition: 			0.3s;
	margin: 				2% auto;
	font-size: 				20px;
}

.shadow_btn02:hover {
	-webkit-box-shadow: 		0px 0px 0 #fadb21;
	box-shadow: 				0px 0px 0 #fadb21;
}

.shadow_btn02 a{
	color: 					#2b69f4;
	text-decoration: 		none;
	padding: 				1em 2em;
	display: 				block;
}

#shop{
	padding-top: 			5%;
	padding-bottom: 		5%;
}

#shop p{
	background-color: 		#d1f0ff;
	color: 					#2b69f4;
	font-weight: 			bolder;
	padding-left: 			1.5em;
}

.shoplist{
	display: 				flex;
	flex-wrap: 				wrap;
	padding: 				2% 0;
}

.shoplist span{
	font-size: 				120%;
	color: 					red;
	font-weight: 			bold;
}

.shoplist li {
	position: 				relative;
	padding-left: 			1.6rem;
	list-style: 				none;
	width: 					30%;
}

.shoplist li:before{
	content: 				"★";
	position: 				absolute;
	color: 					#fadb21;
	left: 					0;
}

.shadow_btn03 {
	display: 				inline-block;
	width: 					100%;
	max-width: 				350px;
	border: 				1px solid #000;
	border-radius: 			5px;
	-webkit-box-shadow: 	4px 4px 0 #21c6fa;
	box-shadow: 			4px 4px 0 #21c6fa;
	font-weight: 			bold;
	text-decoration: 		none;
	text-align: 			center;
	transition: 			0.3s;
	margin: 				4% auto 0;
	font-size: 				20px;
}

.shadow_btn03:hover {
	-webkit-box-shadow: 		0px 0px 0 #21c6fa;
	box-shadow: 				0px 0px 0 #21c6fa;
}

.shadow_btn03 a{
	color: 					#2b69f4;
	text-decoration: 		none;
	padding: 				1em 2em;
	display: 				block;
}

@media all and (max-width: 700px) {
	.flex2 div{
		width: 			47%;
		margin: 		auto;
		text-align: 	center;
	}

	.flex2::after{
		width:			47%;
	}

	.flex2::before { 
		width:			47%;
	}

	.shoplist li{
		width: 			90%;
		margin: 		auto;
	}

	.newshop{
		width: 			97%;
	}

	.countshop{
		margin-bottom: 	5%;
	}

	.new{
		margin-bottom: 	2%;
	}

	.newshop > ul {
		margin-bottom: 	3%;
		padding-left: 	10%;
	}

	.newshop_new p {
		width: 			95%;
	}

	.flex2 div span{
		font-size: 		16px;
	}
}

#sct6 div{
	/*width: 				100%;
	max-width: 			800px;
	margin: 			0 auto;*/
}

.newttl{
	background-color: 	#ff7889;
	color: 				#fff;
	padding: 			10px 5px;
	margin-bottom: 		15px;
	font-weight: 		bold;
}

.newttl2{
	background-color: 	#78d2ff;
	color: 				#fff;
	padding: 			10px 5px;
	margin-bottom: 		15px;
	font-weight: 		bold;
}

.newttl3 {
		background-color: #ff9878;
		color: #fff;
		padding: 10px 5px;
		margin-bottom: 15px;
		font-weight: bold;
}

.newttl_a{
	background-color: 	#4d5bf5;
	color: 				#fff;
	padding: 			10px 5px;
	margin-bottom: 		15px;
	font-weight: 		bold;
	margin-left: 2%;
}

.newttl_b{
	background-color: 	#3bad07;
	color: 				#fff;
	padding: 			10px 5px;
	margin-bottom: 		15px;
	font-weight: 		bold;
	margin-left: 2%;
}

.newinfo{
	padding-top: 		3%;
}

.info_day{
	padding-right: 		2em;
}

.new_link{
	text-align: 		right;
}

.new_link a{
	text-decoration: 	underline;
}

.campaign{
	width: 100%;
	margin-bottom: 5%;
	padding-top: 15%;
}

.campaign_a {
	width: 30%;
	float: left;
	background-color: pink;
}

.campaign_aa {
	width: 30%;
	padding-left: 3%;
}


.campaign_b{
	width: 70%;
	background-color: rgb(42, 43, 43);
	float: right;
}

.campaign_bb{
	width: 70%;
	text-align: center;
	padding-top: 8%;
}

.campaign_text{
	width: 100%;
	/* background-color: rgb(42, 43, 43); */
	text-align: center;

}
.campaign_text_aa{
	width: 100%;
	/* text-align: center; */
	color: #050505;
	font-size: xx-large;
	font-weight: bold;
	padding-left: 2%;
	padding-bottom: 5%;

}
.campaign_box_flex{
	display: flex;
	width: 100%;
}
.campaign_box{
	display: flex; 
	width: 50%;
	padding-top: 5%;
	padding-bottom: 2%;
}
.campaign_box1{
	height: auto;
	padding-bottom: 2%;
	margin-bottom: 3%;
	text-align: center;
}

.campaign_box11{
	width: 100%;
	text-align: center;
}

.campaign_box11 img{
	margin-bottom: 5%;
	/* float: right;
	padding-right: 30%; */
}

.campaign_box111{
	width: 100%;
	text-align: center;
	margin-left: 1%;
	margin-right: 1%;
}

.campaign_box3{
}

.campaign_box2{
	width: 100%;
	text-align: center;
}

.campaign_box2_a{
	width: 100%;
	text-align: center;
	padding-top: 1%;
	padding-bottom: 1%;
	margin-top: 2%;

}

.campaign_box1_a{
	font-size:medium;
	font-weight: bold;
	text-align: right;
	padding-top: 10%;
	padding-right: 5%;
	
}

.campaign_box1_aa{
	font-size: large;
	font-weight: bold;
	text-align: center;
	margin-bottom: 1%;
	color: #fff;
}

.campaign_box1_aaa{
	font-size: large;
	font-weight: bold;
	padding-bottom: 1%;
	color: #fff;

}

.campaign_box1_aaa a{
	color: #ffffff;
}

.campaign_box1_bbb{
	font-size: 200%;
	font-weight: bold;
	padding-top: 1%;
	color: #000000;
	text-shadow: 
    -2px -2px 0 white,
     2px -2px 0 white,
    -2px  2px 0 white,
     2px  2px 0 white,
     0px  0px 4px white; 
}


.campaign_box1_bbb a{
	color: #ffffff;
}
.stripe-marker_b{
	font-size: 200%;
}

.campaign_box1_c{
	background-color: #ffffff;
	color: #050505;
	font-size: xxx-large;
	font-weight: bold;
	padding-top: 20%;
	padding-bottom: 20%;
}

.campaign_box1_d{
	background-color: #ffffff;
	color: #050505;
	font-size: xxx-large;
	font-weight: bold;
	padding-bottom: 20%;
	padding-top: 20%;

}

.campaign_box1_e{
	background-color: #ffffff;
	color: #050505;
	font-size: xxx-large;
	font-weight: bold;
	padding-top: 20%;
	padding-bottom: 20%;
}

.campaign_text_a{
	float: right;
	margin-bottom: 5%;
}


.campaign_box4{
	width: 100%;
	display: flex;
}

.campaign_ttl{
	width: 300px;
	height: 50px;
	border-radius: 50px;
	background-color: #ea6120;
	margin: auto;
	margin-top: 3%;
}

.campaign_ttl_b{
	width: 300px;
	height: 50px;
	border-radius: 50px;
	background-color: #ea6120;
	margin: auto;
	margin-top: 3%;
}

.campaign_ttl_c{
	width: 300px;
	height: 50px;
	border-radius: 50px;
	background-color: #f8ffab;
	margin: auto;
	margin-top: 3%;
}

.campaign_ttl_text{
	text-align: center;
	padding-top: 4%;
	font-weight: bold;
	color: #fff;
}


.point_area {
	margin-top: 2%;

}

.point_box2{
	width: 100%;
}

.point_box2_a{
	width: 100%;
}

.point_box1_aa{
	font-weight: bold;
	padding: 4%;
}

.point_box1_aa_img{
	font-weight: bold;
	padding: 4%;
	text-align: center;
}

.point_box2_a span{
	color: #ff253a;
}


.point_box1_a{
	font-size: x-large;
	font-weight: bold;
	padding: 5%;
}

.CPN_innr{
	padding-top: 5%;
}

.top_bag{
	width: 100%;
	background-color: #fb2c0c;
	/* margin-bottom: 3%; */
}

.top_bag_b{
	width: 100%;
	 background-image: repeating-linear-gradient(90deg, #ffdd7d, #ffdd7d 62px, transparent 62px, transparent 110px);
}

.top_bag_c{
	width: 100%;
	background-color: #ff077f;
	/* margin-bottom: 3%; */
}


/*大船渡元気UPキャンペーン*/
.kanko_back_g{
	background-color: #f17483;
	text-align: center;
	color: #fff;
	padding: 3% 0;
}

.kanko_inner{
	width: 100%;
	max-width: 1500px;
	margin: auto;
}

.kanko_inner2{
	width: 100%;
	max-width: 1050px;
	margin: auto;
}

.midashi_block{
	/* background-image:url(../images/back_a.gif); */
	padding: 2%;
}

.midashi_cont{
	width: 95%;
	margin: auto;
}

.midashi{
	position: relative;
	padding: 0.6em;
	background: #f1afb7;
	color: #fff;
	font-weight: bold;
}

.midashi:after{
	position: absolute;
	content: '';
	top: 100%;
	left: 30px;
	border: 15px solid transparent;
	border-top: 15px solid #f1afb7;
	width: 0;
	height: 0;
}

.di_in{
	display: inline-block;
}

.midashi_block .shoplist li{
	padding-bottom: 0.5em;
}

.kameiten{
	width: 100%;
	text-align: center;
}

.kameiten a{
	display: inline-block;
	padding: 2%;
	text-decoration: underline;
	color: #00f ;
}

/*---------------------------------------------------*/
.pattern8{
	color: 					#ffffff;
	line-height: 			2.5em;
}

.pattern8 .line_yellow{
	color: #000;
	 background: 		linear-gradient(transparent 0%, yellow 0%);
}

@media all and (max-width: 900px) {
	.campaign_a {
		width: 30%;
		float: none;
		margin: auto;
		margin-bottom: 8%;

	}

	.campaign_b{
		width: 100%;
		background-color: rgb(42, 43, 43);
	}
	.campaign_box1{
		padding-left: 3%;
		padding-right: 3%;
		height: auto;
		padding-bottom: 2%;
		margin-bottom: 3%;
		text-align: center;
	}
}

@media all and (max-width: 700px) {
	.campaign_b{
		width: 100%;
		margin:auto;
	}
	.campaign_box{
		display: inline-block; 
		width: 100%;
	}
	.campaign_a img {
		float: none;
		margin-bottom: 8%;
	}

	.campaign_box3_c{
		background-image:	url(../images/bg03_bg.png);
		padding-top: 8%;
		padding-bottom: 8%;
	}

	.stripe-marker_a{
		font-size: medium;
	}

	.campaign_box1_bbb{
		font-size: 100%;
		padding-bottom: 2%;
	}

	#sct7b {
		padding: 2% 0 2% 0;
	}

	.campaign_ttl_text{
		text-align: center;
		font-weight: bold;
		font-size: smaller;
	}

	.campaign_ttl{
	width: 200px;
	height: 40px;
	border-radius: 50px;
	margin: auto;
	margin-top: 2%;
}

.campaign_ttl_b{
	width: 200px;
	height: 40px;
	border-radius: 50px;
	margin: auto;
	margin-top: 2%;
}


}

/* -------pointキャンペーン------- */

/* -------3倍キャンペーン------- */

.fuchidori{
	color: white;
	font-size: 70px;
	margin-top: 5%;
	margin-bottom: 3%;
	font-family: "メイリオ","Arial","游ゴシック";
	font-weight: bold;
	text-shadow: 2px 5px 5px #666666;
	padding-left: 13%;
	
	 }
	 .fuchidori_2{
	color: white;
	font-size: 70px;
	margin-top: 5%;
	padding-bottom: 3%;
	font-family: "メイリオ","Arial","游ゴシック";
	font-weight: bold;
	text-shadow: 2px 5px 5px #666666;
	padding-left: 25%;
	
	 }

.fuchidori-marker{
	font-size: xxx-large;
	display: inline-block;
	margin-top: 2%;
	text-shadow: 2px 5px 5px #666666;
	color: white;
	font-family: "メイリオ","Arial","游ゴシック";
	
} 

	 .background-marker {
	font-size: larger;
	display: inline-block;
	margin-top: 2%;
	text-shadow: 2px 5px 5px #666666;
	color: white;
	font-family: "メイリオ","Arial","游ゴシック";

 }

/* kokokara */



.back {
	margin-bottom: 1%;
}

dl.table_ly {
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	width: 100%;
	/* border: 1px solid #ccc; */
	border-bottom: none;
}

dl.table_ly dt {
	padding: 12px;
	width: 100%;
	border-right: none;
	font-weight: bold;
	background: #f5f5f5;
	border-bottom: none;

}

.cam_ttl {
	padding: 12px;
	width: 100%;
	border-right: none;
	font-weight: bold;
	background: #acdbdb;
	border-bottom: none;

}

dl.table_ly dd {
	width: 100%;
	background: #fff;
	padding: 12px;
	/* border-bottom: 1px solid #ccc; */
}

/*3周年キャンペーン*/
.kanko_back_f{
	background-color: #da7655;
	text-align: center;
	color: #fff;
	padding: 1% 0;
}

.kanko_back_ff{
	background-color: #c2e9da42;
	background-image:	url(../images/img10.png);
	padding-top: 5%;
	padding-bottom: 3%;
	text-align: center;
	color: #fff;
}


.kanko_inner3{
	width: 100%;
	max-width: 1500px;
	margin: auto;
	padding-bottom: 1%;
}

.kanko_inner4{
	width: 100%;
	max-width: 1050px;
	margin: auto;
}

.midashi_block{
	padding: 2%;
}

.midashi_cont{
	width: 95%;
	margin: auto;
}

.midashi_1{
	position: relative;
	padding: 0.6em;
	background: #da7655;
	color: #fff;
	font-weight: bold;
}

.midashi_1:after{
	position: absolute;
	content: '';
	top: 100%;
	left: 30px;
	border: 15px solid transparent;
	border-top: 15px solid #da7655;
	width: 0;
	height: 0;
}

.di_in_a{
	display: flex;
	margin: 0 auto;
	width: 100%;
	max-width: 1200px;
}

.di_in_aa img{
	width: 96%;
	text-align: center;
}

.di_in_b{
	display: none;
}
.midashi_block .shoplist li{
	padding-bottom: 0.5em;
}

.kameiten{
	width: 100%;
	text-align: center;
}

.kameiten a{
	display: inline-block;
	padding: 2%;
	text-decoration: underline;
	color: #00f ;
}

.benefits{
	background: #fdd100;
	padding: 2%;
}

.special_a{
	font-weight: bold;
	font-size: large;
	text-align: end;
}
@media all and (max-width: 800px) {
	.di_in_a{
		display: none;
	}

	.di_in_aa img{
	width: 100%;
}

	.di_in_b{
		display: block;
		text-align: center;
	}

	.back {
	margin-bottom: 0%;
}

}
/* kokomade */

/* -------キャンペーン一覧------- */
.campaign_ttl_a{
	width: 300px;
	height: 50px;
	border-bottom: 1px solid #ccc;
	margin: auto;
	margin-top: 10%;
	font-weight: bold;
	
}

.campaign_box1_aa{
	color: #000;
	font-weight: bold;
	padding: 4%;
	text-align: center;
}

.campaign_box_flex_aa{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1%;
  justify-items: stretch; /* 念のため */
}

.campaign_box_flex_aaa{
	display: flex; 
	margin-top: 1%;
}

.end_camp{
	text-decoration: line-through;
}


.campaign_box_aa{
	text-align: center;
	background-color: rgb(255, 255, 255);
	border: 1px solid #d6d6d6;
	padding: 1%;
	border-radius: 5px;
	flex: 					0 1 calc(33.333% - 1%); /* 3カラム分の幅 - ギャップ分 */
	box-sizing: 			border-box; /* パディングやボーダーを幅に含める */
	margin: 				1% 0;
	
}

.campaign_box_b{
	text-align: center;
	background-color: rgb(255, 255, 255);
	padding: 1%;
	border-radius: 5px;
	flex: 					0 1 calc(33.333% - 1%); /* 3カラム分の幅 - ギャップ分 */
	box-sizing: 			border-box; /* パディングやボーダーを幅に含める */
	margin: 				1% 0;
}

.campaign_list_ttl{
	width: 100%;
	margin-top: 3%;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	/* -webkit-box-orient: vertical; */
	font-size: 0.9rem;
	line-height: 1.3;
	text-align: justify;
	font-weight: bold;
}

.campaign_list_ttl_off{
	width: 100%;
	margin-top: 3%;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	font-size: 0.9rem;
	line-height: 1.3;
	text-align: justify;
	font-weight: bold;
	color:#b7b7b7;

}

.before{
	color: #2b69f4;
	font-weight: bold;
	float: left;

}

.on{
	color: #ff253a;
	font-weight: bold;
	float: left;

}

.off{
	color:#b7b7b7;
	font-weight: bold;
	float: left;

}

.campaign_list_time{
	width: 100%;
	height: 20px;
	margin-top: 1%;
	font-size: 0.9rem;
	text-align: justify;
}

.campaign_list_txt{
	width: 100%;
	height: 20px;
	margin-top: 1%;
	font-size: 0.8rem;
	text-align: center;
	color: #ff253a;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	line-height: 1.3;
	text-align: justify;
	font-weight: bold;
}

.campaign_list_time_off{
	width: 100%;
	height: 40px;
	margin-top: 1%;
	font-size: 0.9rem;
	text-align: justify;
	color:#b7b7b7;

}

.campaign_list_banner{
	 width: 100%;

}

.point_box2 span{
	font-size: 	150%;
	color: 	#3568b1;
	text-decoration:	underline;
}
@media all and (max-width: 1100px) {
	.campaign_list_time{
		margin-bottom: 2%;
		font-size:12px;
	}

	.campaign_list_time_off{
		margin-bottom: 2%;
		font-size:12px;
	}

}


@media all and (max-width: 990px) {
	.fuchidori {
		font-size: 230%;
		padding-left: 10%;
	}

	.fuchidori_2 {
		font-size: 230%;
		padding-left: 10%;
	}

	.background-marker {
		font-size: 230%;

	}

	.campaign_bb{
		width: 70%;
		text-align: center;
		padding-top: 3%;
	}

	.campaign_box1_b {
		padding-top: 10%;
		padding-bottom: 10%;
	}

	.campaign_box_flex{
		display: block;
	}
	.campaign_box{
		width: 100%;
		padding-top: 2%;
		padding-bottom: 2%;
		text-align: center;
	}

	.campaign_box11 img{
		margin-bottom: 5%;
		float:inline-start;
		padding-right: 0;
		
	}
}

@media all and (max-width: 915px) {
	.campaign_box{
		width: 100%;

		}
		.campaign_box11{
			width: 100%;
			text-align: center;
			margin-top: 2%;
		}

		.campaign_box111{
			width: 100%;
			text-align: center;
			margin: 0;
			margin-top: 2%;
		}
}

@media all and (max-width: 850px) {

	.campaign_box_flex_aa{
		display: block; 
		margin: auto;
		margin-top: 5%;
		margin-bottom: 7%;
	}
	.campaign_box_flex_aaa{
		display: block; 
		margin: auto;
		margin-top: 5%;
	}

	.campaign_box_aa{
		width: 95%;
		margin-bottom: 2%;
		margin-left: auto;
		margin-right: auto;
	
	}


	.campaign_list_time{
		margin-bottom: 2%;
	}

}

@media all and (max-width: 830px) {
	.campaign_text_aa{
		width: 100%;
		color: #050505;
		font-size: x-large;
		font-weight: bold;
		padding-bottom: 5%;
			}
		
}
			

@media all and (max-width: 800px) {
	.campaign_box4{
		width: 100%;
		display: block;
	}

	.campaign_aa {
		width: 50%;
		margin: auto;
	}
	.campaign_bb{
		width: 100%;
		margin: auto;
	}

}

@media all and (max-width: 702px) {
	.fuchidori {
		padding-left: 5%;
	}

	.fuchidori_2 {
		padding-left: 5%;
	}

	.background-marker{
		font-size: -webkit-xxx-large;

	}

}

@media all and (max-width: 595px) {
	.fuchidori-marker {
		font-size: smaller;
		padding-left: 2%;
	}

	.background-marker{
		font-size: smaller;

	}

	.fuchidori {
		margin-top: 5%;
		margin-bottom: 0;
	}

	.fuchidori_2 {
		margin-top: 1%;
		margin-bottom: 1%;
	}

}

@media all and (max-width: 462px) {
	.fuchidori-marker {
		font-size: 30px;
		padding-left: 2%;
	}

	.background-marker{
		font-size: 30px;

	}
	.fuchidori_2 {
		margin-top: 1%;
		margin-bottom: 1%;
		padding-left: 2%;

	}
}


/* -------キャンペーン一覧------- */


/* -------大船渡情報エリア------- */
#ofunato_guide {
	padding:			35px 0 55px 0;
}

#ofunato_guide p {
	position:			relative;
	margin-bottom:		55px;
	color:				#fff;
	font-weight:		bold;
	text-align:			center;
	border-radius:		40px;
	margin-bottom:		20px;
	padding: 10px 0;
	font-size: 25px;
	background-color: #0f4178;
}

@media all and (max-width: 700px) {

	#ofunato_guide {
		box-sizing:			border-box;
		padding:			35px 6.6% 55px;
	}
}

/*加盟店向けページ*/
/*----------------------------------------*/
#store section{
	max-width: 						none;
}

#store section.main_img{
	width: 							100%;
	max-width: 						2000px;
	margin: 						auto;
}

#new_shop{
	background-color: rgba(0, 150, 224, .5);
	font-family: 'Noto Sans JP', sans-serif;
}

/* 加盟店募集セクションのスタイル */

.shop-recruit{
	background-color: 	#fff;
	position: relative;
	padding-bottom: 2%;
}

.shop-recruit-description {
	font-size: 16px;
	text-align: center;
	margin: 20px 10%;
	line-height: 1.6;
}

.shop-recruit-description span{
	font-weight: bold;
}

.shop-recruit-subtitle {
	font-size: 22px;
	font-weight: bold;
	text-align: center;
	color: #4bb8d9;
	padding-bottom: 1em;
	padding-top: 1em;
}

.shop-recruit-subtitle2 {
	font-size: 22px;
	font-weight: bold;
	text-align: center;
	color: #fff;
	padding-bottom: 1em;
}

.shop-recruit-subtitle3 {
	font-size: 22px;
	font-weight: bold;
	text-align: center;
	color: #4bb8d9;
	padding-bottom: 1em;
	padding-top: 4%;
}

.shop-recruit-apply {
	font-size: 16px;
	text-align: center;
	margin-top: 20px;
}

.shop-recruit-apply a {
	color: #2b69f4;
	font-weight: bold;
	text-decoration: none;
}

.shop-recruit-apply a:hover {
	text-decoration: underline;
}

.benefits-container_pc{
	display: flex;
	width: 100%;
	justify-content: center;
}

.benefits-container_sp{
	display: none;
}

.new_shop_point{
	background-color: #f0c0bf;
	color: #fff;
	padding-bottom: 2%;
	padding-top: 2%;
}

.poin_box{
	width: 90%;
	margin: auto;
	background-color: #fff;
	text-align: center;
	border: 2px dashed #a6a6a6;
	color: #000;
	margin-bottom: 4%;
	margin-top: 4%;
	position: relative;
}

.point_ttl{
	width: 200px;
	padding: 1% 2%;
	background-color: #e62d2b;
	color: #fff;
	text-align: center;
	position: absolute;
	top: -25px;
	right: 0;
	left: 0;
	margin: 0 auto;
	font-size: 18px;
	font-weight: bold;
}

.point_txt{
	width: 80%;
	margin: auto;
	margin-top: 4%;
}

.poin_box2{
	width: 90%;
	margin: auto;
	background-color: #fff;
	text-align: center;
	color: #000;
	margin-bottom: 4%;
	margin-top: 4%;
	position: relative;
}

.point_ttl2{
	width: 200px;
	padding: 1% 2%;
	background-color: #4bb8d9;
	color: #fff;
	text-align: center;
	position: absolute;
	top: -25px;
	right: 0;
	left: 0;
	margin: 0 auto;
	font-size: 18px;
	font-weight: bold;
}

.point_txt2{
	width: 80%;
	margin: auto;
	padding-top: 4%;
}

.seisan_box{
	background-color: #fd596e;
	color: #fff;
	font-size: 120%;
	font-weight: bold;
	text-align: center;
	padding: 2%;
	margin: 2% auto;
	width: 76%;
}

.shop_cont{
	width: 80%;
	margin: auto;
	padding-bottom: 2%;
}

.fb{
	font-weight: bold;
}

.fr{
	color: #e62d2b;
}

.w7{
	width: 95%;
	margin: auto;
}

.shop_cont2{
	width: 80%;
	margin: auto;
	padding: 2%;
	border: 1px solid #fe909e;
}

.shop_cont2 p{
	font-size: 85%;
}

.pt2{
	padding-top: 2%;
}

.pd2{
	padding: 2%;
}

.pb2{
	padding-bottom: 2%;
}

/* FAQ */
.faq-container {
	max-width: 800px;
	margin: 50px auto;
	padding: 20px;
	background: #f9f9f9;
	border-radius: 10px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.faq-title {
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	color: #333;
	margin-bottom: 20px;
}

/* FAQアイテム */
.faq-item {
	margin-bottom: 10px;
	padding: 10px;
	border-bottom: 1px solid #ddd;
	position: relative;
}

/* 質問 */
.faq-question {
	display: block;
	font-size: 18px;
	font-weight: bold;
	color: #333;
	background: #e3f2fd;
	padding: 15px 15px 15px 70px;
	border-radius: 5px;
	cursor: pointer;
	transition: background 0.3s ease-in-out;
	position: relative;
}

/* 質問者アイコン */
.faq-question::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-size: cover;
	transform: translateY(-50%);
}

/* 奇数番の質問者アイコン */
.faq-item:nth-child(odd) .faq-question::before {
	background-image: url('../images/faq/faq02.png');
}

/* 偶数番の質問者アイコン */
.faq-item:nth-child(even) .faq-question::before {
	background-image: url('../images/faq/faq03.png');
}

/* 質問のホバーエフェクト */
.faq-question:hover {
	background: #bbdefb;
}

/* 回答コンテナ */
.faq-answer {
	max-height: 0;
	overflow: hidden;
	background: white;
	padding: 0 20px;
	border-radius: 5px;
	transition: max-height 0.4s ease-in-out, padding 0.3s ease-in-out;
	position: relative;
}

.faq-answer>p{
	width: 90%;
}

/* 回答者アイコン */
.faq-answer::after {
	content: "";
	position: absolute;
	top: 10px;
	right: 10px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-image: url('../images/faq/faq04.png');
	background-size: cover;
}

/* チェックボックスの開閉処理 */
.faq-toggle {
	display: none;
}

.faq-toggle:checked + .faq-question {
	background: #bbdefb;
}

.faq-toggle:checked + .faq-question + .faq-answer {
	max-height: 400px;
	padding: 20px;
}

.hamburger_sp{
	display: none;
}

/*ゴールデンウイーク特集*/
.video-wrapper {
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.video-wrapper video {
	width: 100%;
	height: auto;
}


/*夏ポイントが当たる*/
.back_a{
	background-color: #ffffffbf;
	width: 84%;
	margin: auto;
	padding-top: 1%;
	padding-bottom: 1%;

}

/*お知らせページ*/
/* 共通レイアウト */
.news-list {
  max-width: 900px;
  margin: 32px auto 0;
}

.news-item {
  border-top: 1px solid #e5e5e5;
  padding: 18px 0;
}

.news-item:last-child {
  border-bottom: 1px solid #e5e5e5;
}

.news-item__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  text-decoration: none;
  color: #333;
}

.news-item__main {
  flex: 1;
}

.news-item__meta {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 14px;
  margin-bottom: 6px;
}

.news-date {
  letter-spacing: 0.08em;
}

.news-title {
  font-size: 16px;
  line-height: 1.7;
}

/* カテゴリ表示 */
.news-category {
	color: 				#fff;
	padding: 			7px;
	font-size: 			14px;
	font-weight: 		bold;
	align-items: 		center;
}

/* カテゴリ別カラー（ざっくりスクショ風） */
.news-category--campaign {
  background-color: #ff8f4d;
  border-radius: 10px;
}

.news-category--partner {
  background-color: #ff6ea0;
  border-radius: 10px;
}

.news-category--app {
  background-color: #ffb84d;
  border-radius: 10px;
}

/* 矢印 */
.news-arrow {
  position: relative;
  width: 48px;
  height: 16px;
  flex-shrink: 0;
}

.news-arrow::before {
  /*content: "";*/
  position: absolute;
  top: 50%;
  left: 0;
  right: 8px;
  height: 1.5px;
  background-color: #b3b3b3;
  transform: translateY(-50%);
}

.news-arrow::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 40px;
  width: 8px;
  height: 8px;
  border-top: 1.5px solid #b3b3b3;
  border-right: 1.5px solid #b3b3b3;
  transform: translateY(-50%) rotate(45deg);
}

/* トップの「一覧を見る」ボタン */
.news-main-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 32px;
  border-radius: 999px;
  background-color: #2573ff;
  color: #fff;
  font-size: 14px;
  text-decoration: none;
}

.home-news__footer {
  margin-top: 32px;
  text-align: right;
}

/* 一覧ページの「もっと見る」ボタン */
.news-page__footer {
  margin-top: 32px;
  text-align: center;
}

.news-more-button {
  padding: 10px 32px;
  border-radius: 999px;
  border: none;
  background-color: #f2f2f2;
  font-size: 14px;
  cursor: pointer;
  margin-bottom: 2%;
}

/* お知らせ一覧のリンクホバー調整 */
.news-item__link:hover {
  text-decoration: none;          /* 下線を消す */
  background-color: #94c3f2;      /* 行全体をうっすら色付け */
}

/* ホバー時に矢印をちょっと強調したければオマケ */
.news-item__link:hover .news-arrow::before {
  background-color: #2b69f4;
}

.news-item__link:hover .news-arrow::after {
  border-top-color: #2b69f4;
  border-right-color: #2b69f4;
}

/* お知らせ詳細 */
.news-detail {
  max-width: 900px;
  margin: 32px auto 64px;
}

.news-detail__meta {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 14px;
  margin-bottom: 12px;
}

.news-detail__title {
  font-size: 22px;
  line-height: 1.8;
  margin-bottom: 24px;
}

.news-detail__body p {
  font-size: 16px;
  line-height: 1.9;
  margin-bottom: 1.2em;
}

.news-detail__back {
  margin-top: 32px;
  text-align: right;
}

.news-detail__back a {
  font-size: 14px;
  text-decoration: none;
  color: #2b69f4;
}

.news-detail__back a::after {
  content: " →";
}

/* お知らせ詳細：ヒーロー画像 */
.news-detail__hero {
  margin: 24px 0 32px;
}

.news-detail__hero img {
  display: block;
  width: 100%;      /* コンテンツ幅いっぱい */
  height: auto;
  border-radius: 16px;  /* いらなければ削除 */
  object-fit: cover;
}


/* レスポンシブ対応 */
@media (max-width: 700px) {
	.faq-question {
		padding-left: 60px;
		font-size: 16px;
	}

	.faq-question::before {
		width: 40px;
		height: 40px;
	}

	.faq-answer {
		padding-right: 60px;
	}

	.faq-answer::after {
		width: 40px;
		height: 40px;
	}
}


/* スマホ用メニュー */
@media (max-width: 950px) {
	.push2 {
		height: 95px;
	}

	#new_shop>section {
		width: 95%;
	}

	.benefits-container_sp{
		display: flex;
		width: 100%;
		justify-content: center;
		text-align: center;
	}

	.benefits-container_pc{
		display: none;
	}

	.poin_box,.poin_box2 {
		margin-top: 10%;
	}

	.point_txt {
		margin-top: 10%;
		width: 95%;
	}

	.point_txt2{
		padding-top: 10%;
		width: 95%;
	}

	.shop-recruit-subtitle2{
		padding-top: 1em;
	}

	.seisan_box {
		width: 90%;
		font-size:80%;
	}

	.shop_cont{
		width: 95%;
	}

	.shop_cont2{
		width: 90%;
	}

	/* メニューのスタイル */
	.menu {
		position: fixed;
		top: 0;
		right: -100%; /* 初期状態では画面の外に隠れている */
		width: 300px;
		height: 100%;
		background-color: #d2e8fa;
		color: #333;
		transition: right 0.3s ease; /* スライドインのアニメーション */
		padding: 20px;
		box-sizing: border-box;
		z-index: 10;
	}

	/* メニューが開いているとき */
	.menu.open {
		right: 0;
	}

	/* ボタンのスタイル */
	.hamburger_sp {
		position: fixed;
		top: 20px;
		right: 20px;
		width: 30px;
		cursor: pointer;
		z-index: 20;
	}

	.hamburger_sp span {
		display: block;
		height: 3px;
		width: 100%;
		background-color: #333;
		margin: 5px 0;
		transition: 0.4s;
	}

	/* バツ印に変化するスタイル */
	.hamburger_sp.active span:nth-child(1) {
		transform: rotate(45deg) translate(5px, 5px);
	}

	.hamburger_sp.active span:nth-child(2) {
		opacity: 0;
	}

	.hamburger_sp.active span:nth-child(3) {
		transform: rotate(-45deg) translate(6px, -6px);
	}

	/* メニューリストのスタイル */
	.menu ul {
		list-style-type: none;
		padding: 0;
		margin-top: 80px;
		display: block !important;
	}

	.menu li {
		padding: 20px 0;
		border-bottom: 1px solid #444;
	}

	.menu li a {
		color: #333;
		text-decoration: none;
		display: block;
	}

	.hamburger_sp{
		display: block;
	}

	header.index_header li::before{
		display: none;
	}

	.news-list,.news-detail {
		margin: auto 3%;
	}
}

/* campaign expired: grayscale + disable click */
.campaign_box_aa.is-expired .campaign_list_banner img {
  filter: grayscale(100%);
  opacity: 0.55;
}

.campaign_box_aa.is-expired .campaign_card_disabled {
  cursor: default;
}

.campaign_box_aa.is-expired .before,
.campaign_box_aa.is-expired .campaign_list_ttl,
.campaign_box_aa.is-expired .campaign_list_time {
  opacity: 0.7;
}

/* フェーズラベル色 */
.before.is-live { color: #ff1f7a; font-weight: 800; }        /* 開催中：強め */
.before.is-upcoming { color: #2b6cff; font-weight: 700; }    /* 開催前：少し控えめ */
.before.is-ended { color: #888; font-weight: 700; }          /* 終了：グレー */

/* 終了カードは全体をグレー寄せ */
.campaign_box_aa.is-ended,
.campaign_box_aa.is-ended .campaign_list_ttl,
.campaign_box_aa.is-ended .campaign_list_time {
  color: #888;
}

.campaign_box_aa.is-ended .campaign_list_banner img {
  filter: grayscale(100%);
  opacity: 0.55;
}

/* お知らせ（TOP） */
.newsBox {
  max-width: 1000px;
  margin: 0 auto;
}

.newsList {
  border-top: 1px solid #e6e6e6;
}

.newsItem {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  padding: 18px 10px;
  border-bottom: 1px solid #e6e6e6;
  text-decoration: none;
  color: inherit;
  position: relative;
}

.newsItem:hover {
  background: rgba(0,0,0,.02);
}

.newsMeta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 6px;
}

.newsDate {
  font-size: 14px;
  color: #666;
  white-space: nowrap;
}

/* カテゴリ別に色を出したい場合（slugに合わせて増やす） */
.newsTag--campaign { background: #ff7a3c; }
.newsTag--merchant { background: #ff5da2; }
.newsTag--app { background: #2f6fed; }

.newsTitle {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
}

.newsArrow {
  font-size: 24px;
  color: #bdbdbd;
  align-self: center;
  padding-left: 10px;
}

.newsMoreWrap {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
}

.newsMoreBtn {
  display: inline-flex;
  align-items: center;
  padding: 10px 18px;
  border-radius: 999px;
  background: #2f6fed;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}

.newsMoreBtn:hover {
  opacity: .9;
}

.newsEmpty {
  padding: 16px 0;
  color: #666;
}

/* ===== TOP: お知らせ（#sct6） ===== */
home-news .contents{
  max-width: 1000px;
  margin: 0 auto;
}

/* 見出しが既に帯デザインなら不要。ない場合は帯っぽく */
home-news h2{
  margin: 0 auto 26px;
  text-align: center;
}

/* リスト全体の罫線 */
.newsList{
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid #e6e6e6;
}

/* 1行 */
.newsItem{
  border-bottom: 1px solid #e6e6e6;
}

/* クリック領域 */
.newsItem a{
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 18px 10px;
  text-decoration: none;
  color: inherit;
  position: relative;
}

.newsItem a:hover{
  background: rgba(0,0,0,.02);
}

/* 日付 */
.newsItem time,
.newsMeta .newsItem time{
  font-size: 14px;
  color: #666;
  letter-spacing: .02em;
  white-space: nowrap;
}

/* バッジ */
.newsTag,
.newsMeta .newsTag{
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  white-space: nowrap;
}

/* slug別色 */
.newsTag--merchant{ background:#ff5da2; }
.newsTag--campaign{ background:#ff7a3c; }
.newsTag--app{ background:#2f6fed; }
.newsTag--user{ background:#6a6a6a; }

/* タイトル */
.newsTitle{
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
}

/* 右矢印 */
.newsArrow{
  font-size: 22px;
  color: #c7c7c7;
}

/* 「お知らせ一覧へ」ボタン（右下の青いピル） */
.more{
  margin-top: 18px;
  text-align: right;
}

.more a{
  display: inline-flex;
  align-items: center;
  padding: 12px 22px;
  border-radius: 999px;
  background: #2f6fed;
  color: #fff;
  font-weight: 800;
  text-decoration: none;
}

.more a:hover{
  opacity: .9;
}


.newsItem a{
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 6px 12px;
  padding: 18px 10px;
  text-decoration: none;
  color: inherit;
}

.newsRowTop{
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  display: flex;
  align-items: center;
  gap: 12px;
}

.newsRowBottom{
  grid-column: 1 / 2;
  grid-row: 2 / 3;
}

.newsArrow{
  grid-column: 2 / 3;
  grid-row: 1 / 3;
  align-self: center;
  font-size: 22px;
  color: #c7c7c7;
}

/* ===== 投稿一覧（お知らせ一覧）で TOP と同じ見た目を強制 ===== */
.blog #sct-news .newsList,
.blog #news-archive .newsList{
  display: block;
}

.blog #sct-news .newsItem,
.blog #news-archive .newsItem{
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 6px 12px;
  padding: 18px 10px;
  border-bottom: 1px solid #e6e6e6;
  text-decoration: none;
  color: inherit;
}

.blog #sct-news .newsItem:hover,
.blog #news-archive .newsItem:hover{
  background: rgba(0,0,0,.02);
}

.blog #sct-news .newsMeta,
.blog #news-archive .newsMeta{
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  display: flex;
  align-items: center;
  gap: 12px;
}

.blog #sct-news .newsTitle,
.blog #news-archive .newsTitle{
  grid-column: 1 / 2;
  grid-row: 2 / 3;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
}

.blog #sct-news .newsArrow,
.blog #news-archive .newsArrow{
  grid-column: 2 / 3;
  grid-row: 1 / 3;
  align-self: center;
  font-size: 22px;
  color: #c7c7c7;
}

/* 上の罫線 */
.blog #sct-news .newsBox .newsList,
.blog #news-archive .newsBox .newsList{
  border-top: 1px solid #e6e6e6;
}

/* ===== お知らせ一覧：ページネーション ===== */
.newsPager,
.pagination,
.nav-links{
  margin: 28px 0 0;
  text-align: center;
}

.nav-links{
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

/* 数字・前後ボタン共通 */
.nav-links a,
.nav-links span{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid #d9d9d9;
  text-decoration: none;
  font-weight: 800;
  line-height: 1;
}

/* 未選択 */
.nav-links a{
  background: #fff;
  color: #2f6fed;
}
.nav-links a:hover{
  background: rgba(47,111,237,.08);
}

/* 現在ページ */
.nav-links .current{
  background: #2f6fed;
  color: #fff;
  border-color: #2f6fed;
}

/* … */
.nav-links .dots{
  border: none;
  min-width: auto;
  padding: 0 6px;
  height: auto;
}

/* 前へ/次へ（文字ありの場合も整える） */
.nav-links .prev,
.nav-links .next{
  padding: 0 16px;
}

/* ===== 店舗一覧（Tripadvisor風） ===== */
.store-archive .contents{max-width:1000px;margin:0 auto;padding:20px 12px;}
.store-ttl{font-size:22px;font-weight:900;margin:10px 0 14px;}

.store-search{background:#f7f7f7;border:1px solid #e6e6e6;border-radius:14px;padding:14px;margin:0 0 18px;}
.store-search__row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;align-items:end;}
.store-search__field--btn{display:flex;justify-content:flex-end;}
.store-search__label{font-size:12px;font-weight:800;opacity:.8;margin:0 0 6px;}
.store-search__control{width:100%;height:42px;border:1px solid #d9d9d9;border-radius:10px;padding:0 12px;background:#fff;}
.store-search__btn{height:42px;border:none;border-radius:10px;padding:0 16px;font-weight:900;background:#2f6fed;color:#fff;cursor:pointer;}
.store-search__btn:hover{filter:brightness(.95);}

.store-search__features{margin-top:12px;}
.store-search__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.chip{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #d9d9d9;border-radius:999px;padding:8px 10px;font-size:13px;font-weight:800;cursor:pointer;}
.chip input{margin:0;}

.store-result__meta{display:flex;justify-content:space-between;align-items:center;margin:10px 0;}
.store-result__count{font-weight:900;}

.store-cards{display:flex;flex-direction:column;gap:12px;}
.store-card{display:grid;grid-template-columns:160px 1fr 24px;gap:14px;align-items:center;background:#fff;border:1px solid #e6e6e6;border-radius:14px;padding:12px;text-decoration:none;color:inherit;}
.store-card:hover{background:rgba(0,0,0,.02);}

.store-card__img img{width:160px;height:110px;object-fit:cover;border-radius:10px;display:block;}
.store-card__ph{width:160px;height:110px;border-radius:10px;background:#eee;display:flex;align-items:center;justify-content:center;font-weight:900;opacity:.5;}

.store-card__badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px;}
.badge{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:#2f6fed;color:#fff;font-weight:900;font-size:12px;}
.badge--sub{background:#ff8a00;}

.store-card__title{margin:0 0 6px;font-size:18px;font-weight:900;line-height:1.4;}
.store-card__info{font-size:13px;opacity:.9;display:flex;flex-direction:column;gap:4px;}
.store-card__arrow{font-size:24px;color:#c7c7c7;justify-self:end;}

/* pager */
.store-pager{margin:22px 0 10px;text-align:center;}
.store-pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;margin:0 4px;border-radius:999px;border:1px solid #d9d9d9;text-decoration:none;font-weight:900;}
.store-pager .page-numbers.current{background:#2f6fed;color:#fff;border-color:#2f6fed;}
.store-pager a.page-numbers{color:#2f6fed;background:#fff;}
.store-pager a.page-numbers:hover{background:rgba(47,111,237,.08);}

/* responsive */
@media (max-width: 900px){
  .store-search__row{grid-template-columns:1fr 1fr; }
  .store-search__field--btn{grid-column:1/-1;}
  .store-card{grid-template-columns:120px 1fr 18px;}
  .store-card__img img,.store-card__ph{width:120px;height:90px;}
}

/* ===== 店舗一覧 & 詳細（Tripadvisor風） ===== */
.store-archive .contents,.store-single .contents{max-width:1000px;margin:0 auto;padding:20px 12px;}
.store-ttl{font-size:22px;font-weight:900;margin:10px 0 14px;}

.store-search{background:#f7f7f7;border:1px solid #e6e6e6;border-radius:14px;padding:14px;margin:0 0 18px;}
.store-search__row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;align-items:end;}
.store-search__field--btn{display:flex;justify-content:flex-end;}
.store-search__label{font-size:12px;font-weight:800;opacity:.8;margin:0 0 6px;}
.store-search__control{width:100%;height:42px;border:1px solid #d9d9d9;border-radius:10px;padding:0 12px;background:#fff;}
.store-search__btn{height:42px;border:none;border-radius:10px;padding:0 16px;font-weight:900;background:#2f6fed;color:#fff;cursor:pointer;}
.store-search__btn:hover{filter:brightness(.95);}

.store-result__meta{display:flex;justify-content:space-between;align-items:center;margin:10px 0;}
.store-result__count{font-weight:900;}

.store-cards{display:flex;flex-direction:column;gap:12px;}
.store-card{display:grid;grid-template-columns:160px 1fr 24px;gap:14px;align-items:center;background:#fff;border:1px solid #e6e6e6;border-radius:14px;padding:12px;text-decoration:none;color:inherit;}
.store-card:hover{background:rgba(0,0,0,.02);}

.store-card__img img{width:160px;height:110px;object-fit:cover;border-radius:10px;display:block;}
.store-card__ph{width:160px;height:110px;border-radius:10px;background:#eee;display:flex;align-items:center;justify-content:center;font-weight:900;opacity:.5;}

.store-card__top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:6px;}
.store-card__badges{display:flex;gap:8px;flex-wrap:wrap;}
.badge{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:#2f6fed;color:#fff;font-weight:900;font-size:12px;}
.badge--sub{background:#ff8a00;}

.store-card__points{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.pt{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:8px;font-weight:900;font-size:12px;background:#eaeaea;color:#222;}
.pt--earn{background:rgba(46,204,113,.18);}
.pt--use{background:rgba(241,196,15,.22);}

.store-card__title{margin:0 0 6px;font-size:18px;font-weight:900;line-height:1.4;}
.store-card__info{font-size:13px;opacity:.9;display:flex;flex-direction:column;gap:4px;}
.store-card__arrow{font-size:24px;color:#c7c7c7;justify-self:end;}

.store-pager{margin:22px 0 10px;text-align:center;}
.store-pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;margin:0 4px;border-radius:999px;border:1px solid #d9d9d9;text-decoration:none;font-weight:900;}
.store-pager .page-numbers.current{background:#2f6fed;color:#fff;border-color:#2f6fed;}
.store-pager a.page-numbers{color:#2f6fed;background:#fff;}
.store-pager a.page-numbers:hover{background:rgba(47,111,237,.08);}

/* ===== 詳細 ===== */
.store-hero{display:grid;grid-template-columns:420px 1fr;gap:16px;align-items:stretch;margin:8px 0 18px;}
.store-hero__img img{width:100%;height:320px;object-fit:cover;border-radius:16px;display:block;}
.store-hero__ph{width:100%;height:320px;border-radius:16px;background:#eee;display:flex;align-items:center;justify-content:center;font-weight:900;opacity:.5;}

.store-hero__body{background:#fff;border:1px solid #e6e6e6;border-radius:16px;padding:14px;}
.store-hero__badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
.store-hero__title{font-size:22px;font-weight:900;margin:0 0 8px;line-height:1.4;}
.store-hero__points{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.store-hero__meta{display:flex;flex-direction:column;gap:6px;font-size:13px;opacity:.95;margin-bottom:12px;}
.store-hero__actions{display:flex;gap:10px;flex-wrap:wrap;}

.btn{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 14px;border-radius:12px;background:#2f6fed;color:#fff;text-decoration:none;font-weight:900;border:1px solid #2f6fed;}
.btn:hover{filter:brightness(.95);}
.btn--sub{background:#ff8a00;border-color:#ff8a00;}
.btn--ghost{background:#fff;color:#2f6fed;border-color:#d9d9d9;}

.store-panels{display:flex;flex-direction:column;gap:14px;margin:0 0 20px;}
.panel{background:#fff;border:1px solid #e6e6e6;border-radius:16px;padding:14px;}
.panel__ttl{font-size:16px;font-weight:900;margin:0 0 10px;}
.panel__grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.kv{border:1px solid #eee;border-radius:12px;padding:10px;background:#fafafa;}
.kv__k{font-size:12px;font-weight:900;opacity:.75;margin-bottom:4px;}
.kv__v{font-size:13px;word-break:break-word;}
.panel__content{font-size:15px;line-height:1.8;}

@media (max-width: 900px){
  .store-search__row{grid-template-columns:1fr 1fr;}
  .store-search__field--btn{grid-column:1/-1;}
  .store-card{grid-template-columns:120px 1fr 18px;}
  .store-card__img img,.store-card__ph{width:120px;height:90px;}
  .store-hero{grid-template-columns:1fr;}
  .store-hero__img img,.store-hero__ph{height:220px;}
  .panel__grid{grid-template-columns:1fr;}
}

.store-link{ text-decoration: underline; }
.store-link:hover{ text-decoration: none; }

.campaign-body h3{
  margin: 32px 0 14px;
  padding: 10px 0 10px 14px;
  border-left: 8px solid #2f6be9;
  position: relative;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.4;
}

.campaign-body h3::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-8px;
  width:100%;
  height:1px;
  background: #e6ecff;
}

.campaign-body h3 + p,
.campaign-body h3 + ul,
.campaign-body h3 + ol{
  margin-top: 8px;
}

/* campaign "もっと見る" button */
.campaignMore{
  text-align:center;
  margin-top:18px;
}

.campaignMore a,
.newsMore a,
.howtoSteps__cta a,
.ofnStoreIntro__cta a{
	text-decoration: none;
}

.campaignMore__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 22px;
  min-width:240px;
  border-radius:999px;
  background:#ffffff;
  color:#1f3fbf;
  border:2px solid rgba(31,63,191,.25);
  font-weight:700;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.campaignMore__icon{
  font-size:1.1em;
  transition:transform .15s ease;
}

.campaignMore__btn:hover{
  transform:translateY(-2px);
  border-color:rgba(31,63,191,.45);
  box-shadow:0 14px 30px rgba(0,0,0,.12);
}

.campaignMore__btn:hover .campaignMore__icon{
  transform:translateX(3px);
}

.campaignMore__btn:active{
  transform:translateY(0);
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}

@media (max-width: 600px){
  .campaignMore__btn{
    width:100%;
    max-width:360px;
    min-width:0;
    padding:14px 18px;
  }
}

/* news "もっと見る" button */
.newsMore{
  text-align:center;
  margin-top:18px;
}

.newsMore__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 22px;
  min-width:240px;
  border-radius:999px;
  background:#ffffff;
  color:#1f3fbf;
  border:2px solid rgba(31,63,191,.25);
  font-weight:700;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.newsMore__icon{
  font-size:1.1em;
  transition:transform .15s ease;
}

.newsMore__btn:hover{
  transform:translateY(-2px);
  border-color:rgba(31,63,191,.45);
  box-shadow:0 14px 30px rgba(0,0,0,.12);
}

.newsMore__btn:hover .newsMore__icon{
  transform:translateX(3px);
}

.newsMore__btn:active{
  transform:translateY(0);
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}

@media (max-width: 600px){
  .newsMore__btn{
    width:100%;
    max-width:360px;
    min-width:0;
    padding:14px 18px;
  }
}

/* Howto steps (PayPay風カード) */
.howtoSteps{
  padding: 44px 0;
}

.howtoSteps__inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 18px;
}

.howtoSteps__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.howtoCard{
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  padding: 22px 18px;
  min-height: 400px;
}

.howtoCard__step{
  text-align: center;
  font-weight: 800;
  letter-spacing: .06em;
  color: rgba(0,0,0,.45);
  margin-bottom: 10px;
}

.howtoCard__icon{
  display: grid;
  place-items: center;
  min-height: 360px;
  margin: 6px 0 14px;
}

.howtoCard__icon img{
  max-width: 170px;
  width: 80%;
  height: auto;
}

.howtoCard__ttl{
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 8px;
  text-align: center;
}

.howtoCard__txt{
  font-size: 14px;
  line-height: 1.7;
  margin: 0;
  text-align: center;
  color: rgba(0,0,0,.75);
}

.howtoSteps__cta{
  display: grid;
  place-items: center;
  margin-top: 22px;
}

.howtoSteps__btn{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  font-weight: 800;
  text-decoration: none;
}

.howtoSteps__btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(0,0,0,.10);
}

/* スマホ：横スクロールでPayPayっぽく */
@media (max-width: 900px){
  .howtoSteps__grid{
    grid-template-columns: repeat(6, minmax(260px, 1fr));
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px;
  }
  .howtoCard{
    scroll-snap-align: start;
    min-height: 300px;
  }

  /* スクロールバーちょい控えめ */
  .howtoSteps__grid::-webkit-scrollbar{ height: 8px; }
  .howtoSteps__grid::-webkit-scrollbar-thumb{ background: rgba(0,0,0,.15); border-radius: 999px; }
  .howtoSteps__grid::-webkit-scrollbar-track{ background: rgba(0,0,0,.06); border-radius: 999px; }
}

/* ===== howto: 大船渡さんぽの始め方 ===== */
.ofnStart{margin:0 auto;}
.ofnStart__head{margin-bottom:20px;}
.ofnStart__title{font-size:28px;letter-spacing:.02em;margin:0 0 8px;}
.ofnStart__lead{margin:0;color:#556;line-height:1.8;}

.ofnStartSteps{list-style:none;margin:0;padding:0;display:grid;gap:14px;}
.ofnStartStep{position:relative;display:grid;grid-template-columns:92px 1fr;gap:14px;background:#fff;border:1px solid #e7ebf1;border-radius:18px;padding:16px;box-shadow:0 6px 18px rgba(0,0,0,.04);}

.ofnStartStep__ttl{margin:0 0 6px;font-size:20px;}
.ofnStartStep__txt{margin:0 0 12px;line-height:1.9;color:#334;}

.ofnStartStep__shot{padding:10px; text-align: center;}
.ofnStartStep__shot img{display:block;width:100%;height:auto;border-radius:10px;max-width: 250px}

.ofnStartTip,.ofnStartWarn{display:grid;grid-template-columns:90px 1fr;gap:10px;margin-top:12px;border-radius:14px;padding:10px 12px;border:1px solid #e7ebf1;background:#fbfcff;}
.ofnStartTip__k,.ofnStartWarn__k{font-weight:800;color:#2f6fe8;}
.ofnStartWarn{background:#fff7f7;border-color:#ffd6d6;}
.ofnStartWarn__k{color:#d64545;}
.ofnStartTip__v,.ofnStartWarn__v{color:#334;line-height:1.8;}

.ofnStartCols{;align-items:start;}
.ofnStartBox{border:1px solid #e7ebf1;border-radius:14px;padding:12px;background:#fff;}
.ofnStartBox__ttl{margin:0 0 8px;font-size:16px;}
.ofnStartList{margin:0;padding-left:18px;line-height:1.9;color:#334;}

.ofnStartStep--goal{border-color:#d7e4ff;background:linear-gradient(180deg,#ffffff, #f6f9ff);}

@media (max-width: 900px){
  .ofnStartStep{grid-template-columns:1fr;}
  .ofnStartCols{grid-template-columns:1fr;}
}

/* shots wrapper */
.ofnStartStep__shots{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin-top:14px;
}
.ofnStartStep__shots--single{
  justify-content:center;
}
.ofnStartStep__shots--flow{
  justify-content:flex-start;
}

/* images */
.ofnStartStep__shots img{
  max-width:100%;
  height:auto;
  display:block;
  border-radius:14px;
}

/* arrow */
.ofnShotArrow{
  font-weight:800;
  color:#2f6df6;
  font-size:34px;
  line-height:1;
}

/* small screens: arrows stay readable */
@media (max-width: 680px){
  .ofnShotArrow{ font-size:28px; }
}

/* 共通：フロー画像は横並び */
.ofnStartStep__shots--flow{
  display:flex;
  align-items:center;
  gap:16px;
}

/* 矢印（›） */
.ofnStartStep__shots--flow .ofnShotArrow{
  flex:0 0 auto;
  font-size:28px;
  font-weight:700;
  color:#1f66ff; /* 好きな色に */
  line-height:1;
}

/* 画像は縮む（落下防止の基本） */
.ofnStartStep__shots--flow img{
  height:auto;
  max-width:100%;
  flex:1 1 0;
  min-width:0;
}

/* 2枚のとき：中央寄せ、画像は大きめに */
.ofnStartStep__shots--two{
  justify-content:center;
}
.ofnStartStep__shots--two img{
  flex:0 1 200px;   /* ここで“1枚の幅”を調整 */
  max-width:200px;
}

/* 3枚のとき：落とさず横並び（必要なら縮む） */
.ofnStartStep__shots--three{
  flex-wrap:nowrap;
}
.ofnStartStep__shots--three img{
  flex:0 1 240px;   /* ここで“1枚の幅”を調整 */
  max-width:240px;
}

/* 画面が狭い時は「落とさない」より「横スクロール」を優先（見た目キレイ＆崩れない） */
@media (max-width: 900px){
  .ofnStartStep__shots--three{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:8px;
  }
  .ofnStartStep__shots--three img{
    flex:0 0 220px;
    max-width:220px;
  }
}

/* 2つのCTAボタン共通（白ボタン寄せ） */
.ofnCtaRow .ofnCtaRow__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5em;

  min-width: 220px;
  padding: 14px 22px;
  border-radius: 999px;

  background: #fff;
  color: #1f5eff;
  border: 2px solid rgba(31, 94, 255, .25);

  font-weight: 700;
  text-decoration: none;

  box-shadow: 0 10px 24px rgba(0,0,0,.08);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}

.ofnCtaRow .ofnCtaRow__btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
  background: rgba(31, 94, 255, .06);
  border-color: rgba(31, 94, 255, .45);
}

.ofnCtaRow .ofnCtaRow__btn:active{
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(0,0,0,.10);
}

/* ボタン2つを中央寄せ */
.ofnCtaRow{
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 18px;
  margin-bottom: 24px; /* 下の余白も欲しいとのことなので */
}

.ofnStoreIntro{
  padding: 64px 0;
  background:#fff;
}
.ofnStoreIntro__ttl{
  text-align:center;
  font-size: 28px;
  font-weight: 800;
  margin: 0 0 10px;
}
.ofnStoreIntro__lead{
  text-align:center;
  color:#ff4d4d;
  font-weight: 800;
  font-size: 22px;
  margin: 0 0 10px;
  padding: 4% 0;
}
.ofnStoreIntro__sub{
  text-align:center;
  margin: 0 0 32px;
  color:#333;
}

.ofnStoreIntro__cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  max-width: 980px;
  margin: 0 auto 28px;
}
.ofnStoreIntro__card{
  background:#fff;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
  padding: 22px 18px;
  text-align:center;
}
.ofnStoreIntro__icon{
  font-size: 44px;
  line-height: 1;
  margin-bottom: 10px;
}
.ofnStoreIntro__cardTtl{
  font-weight: 800;
  margin-bottom: 6px;
}
.ofnStoreIntro__cardTxt{
  color:#333;
}
.ofnStoreIntro__link{
  color:#0b63ff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ofnStoreIntro__cta{
  display:flex;
  justify-content:center;
}

/* 既存ボタンがあればそれを使ってOK。無ければ ↓ */
.ofnBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  padding: 14px 26px;
  border-radius: 10px;
  font-weight: 800;
  text-decoration:none;
  border: 2px solid transparent;
}
.ofnBtn--primary{
  background:#2f6bff;
  color:#fff;
}

/* SP */
@media (max-width: 860px){
  .ofnStoreIntro__cards{
    grid-template-columns: 1fr;
    max-width: 520px;
  }
}

.ofnBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6em;
  padding:16px 28px;
  border-radius:999px;
  font-weight:700;
  text-decoration:none;
  line-height:1;
  transition:.2s;
  white-space:nowrap;
}

.ofnBtn--white{
  background:#fff;
  color:#2f63f3;
  border:2px solid #d8e2ff;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}

.ofnBtn--white:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 30px rgba(0,0,0,.10);
  border-color:#bcd0ff;
}

.ofnBtn--white:active{
  transform:translateY(0);
  box-shadow:0 8px 18px rgba(0,0,0,.08);
}

/* =========================
  大船渡さんぽの始め方（ofnStart）レスポンシブ
========================= */

/* まず画像がコンテナを突き破らないように */
.ofnStart img{
  max-width: 100%;
  height: auto;
  display: block;
}

/* STEPカード内の基本 */
.ofnStartSteps{
  list-style: none;
  padding: 0;
  margin: 0;
}
.ofnStartStep{
  overflow: hidden; /* 角丸カード想定で中身はみ出し防止 */
}

/* 画像ブロックの共通：中央寄せ */
.ofnStartStep__shots{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 14px;
}

/* 1枚は中央 */
.ofnStartStep__shots--single{
  justify-content: center;
}

/* 2枚・3枚の並び（PCは横並び維持） */
.ofnStartStep__shots--flow{
  justify-content: center;
  flex-wrap: nowrap;
}

/* 矢印 */
.ofnShotArrow{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  color: #2f6cf6;
  font-size: 28px;
  line-height: 1;
  padding: 0 2px;
}

/* スマホ画面っぽい縦長画像のサイズを安定化（でかくなりすぎ防止） */
.ofnStartStep__shots--flow img,
.ofnStartStep__shots--single img{
  width: auto;
  max-height: 520px; /* PCでの上限 */
}

/* 2カラム（STEP2の右ボックス） */
.ofnStartCols{
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 18px;
  align-items: start;
}

/* =========================
  ここからスマホ対応
========================= */
@media (max-width: 768px){

  /* セクション幅の基準（他セクションと合わせたいならここが効く） */
  .ofnStart{
    width: 100%;
  }

  /* STEP2の2カラムを縦積み */
  .ofnStartCols{
    grid-template-columns: 1fr;
  }

  /* 画像の上限をスマホ用に下げる（縦長がはみ出しやすい） */
  .ofnStartStep__shots--flow img,
  .ofnStartStep__shots--single img{
    max-height: 360px;
  }

  /* 2枚・3枚は「落ちない」より「見やすい」を優先：横スクロールせず折り返す */
  .ofnStartStep__shots--flow{
    flex-wrap: wrap;
    gap: 10px;
  }

  /* 3枚の時：1段目2枚 + 2段目1枚で自然に並ぶ */
  .ofnStartStep__shots--three img{
    flex: 0 1 calc(50% - 10px);
    max-width: calc(50% - 10px);
  }
  .ofnStartStep__shots--three img:nth-of-type(3){
    flex-basis: 100%;
    max-width: 260px;   /* 3枚目は中央に収める */
    margin: 0 auto;
  }

  /* 2枚の時：中央寄せで2枚横並び（小さければ縦落ち） */
  .ofnStartStep__shots--two img{
    flex: 0 1 calc(50% - 10px);
    max-width: calc(50% - 10px);
  }

  /* 矢印はスマホでは邪魔になりやすいので小さめ＆折返し時は非表示でもOK */
  .ofnShotArrow{
    font-size: 22px;
    padding: 0 0;
  }
  /* 折返しが発生した時に矢印が変な位置に出るのを防ぐ（潔く消す） */
  .ofnStartStep__shots--three .ofnShotArrow,
  .ofnStartStep__shots--two .ofnShotArrow{
    display: none;
  }
}

.campaign-single{
	padding: 3% 0;
}