@charset "utf-8";

/* ---------------------------------
  _01 トップページ
------------------------------------*/

#top-intro {
	padding-top: 80px;
	padding-bottom: 0;}
#top-intro h1 {
	margin: 0 auto 30px auto;
	width: 432px;
	height: auto;
	font-size: 2.4rem;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;}
#top-intro h1 img {
	margin-bottom: 0.5em;}
#top-intro img.catch {
	margin: 0 auto;}
#top-intro .section_end {
	margin-top: 0;
	width: 100%;
	height: 100px;
	background-image: url("../images/top/end_intro.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center bottom;}
#top-intro .suigunsen_logo {
	/* top: -50px; */}

@media screen and (max-width: 640px){

#top-intro h1 {
	width: 80%;}
#top-intro h1 img {
	width: 100%;}
#top-intro img.catch {
	width: 100%;}
#top-intro .section_end {
	height: 2em;}

}

.top-news {
	margin-top: 30px;
	margin-bottom: 30px;
	padding: 30px 50px;
	background-color: #FFF7DF;
	border-radius: 10px;}
.top-news h2 {
	margin-bottom: 1em;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;}
.top-news ul {
	border-bottom: solid 2px #fff;}
.top-news ul li {
	border-top: solid 2px #fff;}
.top-news ul li a {
	display: flex;
	justify-content: flex-start;}
.top-news ul li .news_date {
	padding: 1em;}
.top-news ul li .news_title {
	padding: 1em;}

@media screen and (max-width: 640px){

.top-news {
	padding: 2em 1em;}
.top-news ul li a {
	flex-direction: column;}
.top-news ul li .news_date {
	padding: 1em 1em 0 1em;}
.top-news ul li .news_title {
	padding: 0.5em 1em 1em 1em;}

}

#top-about {
	padding-bottom: 0;
	background-color: #D9E471;}
#top-about h2 {
	margin-bottom: 1em;
	line-height: 1.4;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 3.0rem;
	text-align: center;}
#top-about h2 img {
	display: inline-block;
	height: 60px;}

.about_merits {
	margin-bottom: 2em;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;}
.about_merits_box {
	width: 350px;}
.about_merits_box_marker {
	height: 150px;
	background-image: url("../images/top/about_marker.png");}
.about_merits_box h3 {
	margin-bottom: 0.5em;
	line-height: 1.2;
	text-align: center;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 2.5rem;}
.about_merits_box_inner {
	padding: 0 25px 25px 25px;
	background-color: #F4F2ED;
	border-radius: 0 0 10px 10px;}
.about_merits_box_inner img {
	margin-bottom: 1em;
	width: 100%;}
#top-about p.catch {
	color: #fff;
	text-align: center;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 2.8rem;
	letter-spacing: -0.05em;
	text-shadow: 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000, 0 0 3px #000;}
#top-about p.catch span {
	color: #FFF100;}
#top-about .section_end {
	width: 100%;
	height: 100px;
	background-image: url("../images/top/end_about.png");
	background-repeat: no-repeat;
	background-size: cover;}

@media screen and (max-width: 640px){

#top-about h2 img {
	margin: 0 auto 0.5em auto;
	display: block;}
.about_merits {
	flex-direction: column;}
.about_merits_box {
	margin: 0 auto 1em auto;
	width: 100%;}
.about_merits_box_marker {
	height: auto;
	aspect-ratio: 2.33;
	background-image: url("../images/top/about_marker.png");}

}

#top-service {
	padding-bottom: 50px;
	background-color: #ADCE16;}
#top-service h2 {
	margin-bottom: 1em;
	text-align: center;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 2.8rem;}
#top-service h2 img {
	margin: 0 auto 0.5em auto;
	height: 64px;}
#top-service p.intro {
	margin-bottom: 5em;
	text-align: center;}

.service_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;}
.service_list_box {
	margin-bottom: 25px;
	padding: 20px;
	position: relative;
	width: 350px;
	background-color: #FFFEEE;
	box-sizing: border-box;}
.service_list_shopname {
	margin: 0 auto 1em auto;
	padding: 0 1em 0.5em 1em;
	border-bottom: solid 2px #C7B299;
	display: block;
	width: fit-content;}
.service_list_content ul {
	margin-left: 1.5em;
	list-style: disc;}
.service_list_box_marker {
	position: absolute;
	left: -50px;
	top: -58px;
	width: 80px;
	height: 88px;}
.service_list_shopping {
	border: solid 8px #9BBC61;}
.service_list_shopping .service_list_box_marker {
	background-image: url("../images/top/service_marker01.png");}
.service_list_eat {
	border: solid 8px #F2CE7C;}
.service_list_eat .service_list_box_marker {
	background-image: url("../images/top/service_marker02.png");}
.service_list_sightseeing {
	border: solid 8px #EDCCD4;}
.service_list_sightseeing .service_list_box_marker {
	background-image: url("../images/top/service_marker03.png");}
.service_list_stay {
	border: solid 8px #A1C7C9;}
.service_list_stay .service_list_box_marker {
	background-image: url("../images/top/service_marker04.png");}
.btn_servicelist {
	margin-bottom: 2em;}
.btn_servicelist a {
	color: #000;
	background-color: #FFFF00;
	font-size: 2.4rem;}

@media screen and (max-width: 640px){

.service_list_box {
	width: 100%;}
	
}

.register_box {
	padding: 30px 20px 20px 20px;
	border: solid 5px #0092A3;
	background-color: #E6FDFF;
	border-radius: 0.5em;}
.register_box h3 {
	margin-bottom: 0.5em;
	text-align: center;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 2.4rem;}
.register_box p {
	margin-bottom: 1em;
	text-align: center;}
.register_box .btn a {
	color: #fff;
	background-color: #0092A3;
	font-size: 2.4rem;}
#top-service .section_end {
	width: 100%;
	height: 100px;
	background-image: url("../images/top/end_service.png");
	background-repeat: no-repeat;
	background-size: cover;
}
	
#top-news {
	background-color: #C3DCE2;}
#top-news h2 {
	margin-bottom: 1em;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;}
#top-news ul {
	border-bottom: solid 2px #fff;}
#top-news ul li {
	border-top: solid 2px #fff;}
#top-news ul li a {
	display: flex;
	justify-content: flex-start;}
#top-news ul li .news_date {
	padding: 1em;}
#top-news ul li .news_title {
	padding: 1em;}

/* ---------------------------------
  _02 協賛店・サービス一覧ページ
------------------------------------*/

#service_index .service_index_city {
	margin-bottom: 3em;}
#service_index .service_index_city h2 {
	margin-bottom: 1em;
	width: 100%;
	height: 2em;
	line-height: 2em;
	color: #fff;
	background-color: #adce16;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	border-radius: 0.25em;}
#service_index .service_index_city ul {
	margin-bottom: 1em;
	display: flex;
	flex-wrap: wrap;
	gap: 0 25px;
	justify-content: flex-start;}
#service_index .service_index_city ul li {
	padding: 1em;
	border-top: solid 2px #fff;
	width: 350px;
	box-sizing: border-box;}
#service_index .service_index_city iframe {
	width: 100%;}

/* ---------------------------------
  _03 協賛店・サービス情報ページ
------------------------------------*/

#service_info .service_info_box {
	margin-bottom: 2em;
	padding: 50px 100px;
	position: relative;
	background-color: #FFFEEE;
	box-sizing: border-box;}
#service_info .service_info_box h2 {
	margin: 0 auto 1em auto;
	padding: 0 1em 0.5em 1em;
	border-bottom: solid 2px #C7B299;
	display: block;
	width: fit-content;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;}
#service_info .service_info_box .service_box {
	margin-bottom: 2em;
	padding: 2em;
	border-radius: 0.5em;}
#service_info .service_info_box .service_box ul {
	margin-left: 1.5em;
	list-style: disc;
	line-height: 1.4;}
#service_info .service_info_box dl {
	border-bottom: solid 2px #ccc;
	display: flex;
	flex-wrap: wrap;}
#service_info .service_info_box dl dt {
	padding: 1em;
	border-top: solid 2px #ccc;
	width: 200px;
	line-height: 1.4;
	box-sizing: border-box;}
#service_info .service_info_box dl dd {
	padding: 1em;
	border-top: solid 2px #ccc;
	width: 684px;
	line-height: 1.4;
	box-sizing: border-box;}
#service_info .service_info_box_marker {
	position: absolute;
	left: -50px;
	top: -58px;
	width: 80px;
	height: 88px;}

#service_info .btn {
	margin-bottom: 2em;}
#service_info .btn a {
	color: #000;
	background-color: #FFFF00;
	font-size: 2.4rem;}

.service_info_box_shopping {
	border: solid 8px #9BBC61;}
.service_info_box_shopping .service_box {
	background-color: #D7E4B6;}
.service_info_box_shopping .service_info_box_marker {
	background-image: url("../images/top/service_marker01.png");}
.service_info_box_eat {
	border: solid 8px #F2CE7C;}
.service_info_box_eat .service_box {
	background-color: #FAEBC0;}
.service_info_box_eat .service_info_box_marker {
	background-image: url("../images/top/service_marker02.png");}
.service_info_box_sightseeing {
	border: solid 8px #EDCCD4;}
.service_info_box_sightseeing .service_box {
	background-color: #F8EAE4;}
.service_info_box_sightseeing .service_info_box_marker {
	background-image: url("../images/top/service_marker03.png");}
.service_info_box_stay {
	border: solid 8px #A1C7C9;}
.service_info_box_stay .service_box {
	background-color: #D9E8DF;}
.service_info_box_stay .service_info_box_marker {
	background-image: url("../images/top/service_marker04.png");}

@media screen and (max-width: 640px){

#service_info .service_info_box {
	padding: 1em;}
#service_info .service_info_box dl {
	flex-direction: column;}
#service_info .service_info_box dl dt {
	padding: 1em 1em 0.5em 1em;
	width: 100%;
	font-weight: 700;}
#service_info .service_info_box dl dd {
	padding: 0 1em 1em 1em;
	border-top: none;
	width: 100%;}

}


/* ---------------------------------
  _04 協賛店登録のご案内ページ
------------------------------------*/

#register p.intro {
	margin-bottom: 2em;
	color: #111111;
	text-align: center;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 2.4rem;
	letter-spacing: -0.05em;}
#register p.intro2 {
	margin-bottom: 0.5em;
	color: #111111;
	text-align: center;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 2.4rem;
	letter-spacing: -0.05em;}
#register .btn_flyer a {
	margin-bottom: 4em;
	background-color: #ADCE16;
	font-size: 2.0rem;}

#register .register_merits {
	margin-bottom: 3em;
	padding: 2em 50px;
	background-color: #fff;
	border-radius: 0.5em;}
#register .register_merits ul li {
	margin-bottom: 1em;
	padding: 1em;
	color: #fff;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 2.0rem;
	text-align: center;
	border-radius: 0.5em;}
#register .register_merits ul li:nth-of-type(1) {
	background-color: #59D4D8;}
#register .register_merits ul li:nth-of-type(2) {
	background-color: #0071DA;}
#register .register_merits ul li:nth-of-type(3) {
	background-color: #ED3824;}


#register .register_merits h2 {
	margin-bottom: 1em;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;}

#register .register_flow {
	padding: 2em 45px;
	border: solid 5px #0092A3;
	background-color: #fff;
	border-radius: 1em;}
#register .register_flow h2 {
	margin-bottom: 1em;
	font-family: "fot-tsukubrdgothic-std", sans-serif;
	font-weight: 700;
	font-style: normal;
	text-align: center;}
#register .register_flow ol {
	margin-bottom: 2em;
	list-style: none;}
#register .register_flow ol li {
	margin-bottom: 60px;;
	padding: 1em 5em;
	position: relative;
	line-height: 1.4;
	background-color: #B2DEE3;
	border-radius: 0.5em;}
#register .register_flow ol li::after {
	position: absolute;
	bottom: -45px;
	left: calc(50% - 40px);
	content: '';
	width: 80px;
	height: 30px;
	background-image: url("../images/register/flow_arrow.png");}
#register .register_flow ol li .btn a {
	color: #fff;
	background-color: #0092A3;
	font-size: 2.0rem;}

#register .register_flow ol li:nth-of-type(2),
#register .register_flow ol li:nth-of-type(3) {
	text-align: center;}
#register .register_flow ol li:last-of-type {
	margin-bottom: 0;}
#register .register_flow ol li:last-of-type::after {
	display: none;}
#register .register_flow p {
	margin-bottom: 1.5em;}
#register .register_flow ul {
	margin-left: 1.5em;
	list-style: disc;
	line-height: 1.4;}

@media screen and (max-width: 640px){

#register .register_merits {
	padding: 2em 1.5em 1em 1.5em;}

#register .register_flow {
	margin-bottom: 2em;
	padding: 1.5em;}
#register .register_flow ol li {
	padding: 1em;}
}

}

