@charset "UTF-8";

/* #cpn_contents */
:root {
	/* font */
	--gothic: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	--mincho: "Hiragino Mincho Pro", "游明朝", "Yu Mincho", YuMincho, serif;

	/* color */
	--blk: 62, 58, 57;
	--wht: 255, 255, 255;
	--gre: 0, 168, 80;
	--light-gre: 215, 238, 209;
}

/* ----------------------------------------------------
	基本設定
---------------------------------------------------- */
html {
	scroll-behavior: smooth;
}

/*
	reset
------------------------------ */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	list-style: none;
}

p {
	word-wrap: break-word;
}

p:not(:last-of-type) {
	margin-bottom: 1em;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

fieldset,
img {
	border: 0;
}
/* fieldset,
#cpn_contents img {
	border: 0;
} */


address,
b,
caption,
cite,
code,
dfn,
em,
i,
strong,
th,
var {
	font-style: normal;
	font-weight: normal;
}

caption,
th {
	text-align: left;
}

a {
	text-decoration: underline;
	transition: all 0.5s ease 0s;
}
/* #cpn_contents a {
	text-decoration: underline;
	transition: all 0.5s ease 0s;
} */


a:hover {
	text-decoration: none;
	opacity: 0.7;
}
/* #cpn_contents a:hover {
	text-decoration: none;
	opacity: 0.7;
} */

area {
	border: none;
	outline: none;
}

img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
/* #cpn_contents img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
} */


/*
	表示設定
------------------------------ */
body {
	background: var(--wht);
	line-height: 1.8;
}
/* #cpn_contents {
	background: var(--wht);
	line-height: 1.8;
} */


.container {
	margin: 0 auto;
	padding: 0 50px;
	width: 100%;
}

.close {
	display: none;
}


@media screen and (max-width: 768px) {
	.container {
		padding: 0 4.8vw;
	}
}

/*
	font
------------------------------ */
body {
	color: var(--blk);
	font-family: var(--gothic);
	font-feature-settings: "palt"1;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.05em;
}
/* #cpn_contents {
	color: var(--blk);
	font-family: var(--gothic);
	font-feature-settings: "palt"1;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.05em;
} */


@media screen and (max-width: 768px) {
	body {
		font-size: 3.46667vw;
	}
	/* #cpn_contents {
		font-size: 3.46667vw;
	} */
}



/*
	ページトップへ戻る
------------------------------ */
.pagetop {
	height: 50px;
	width: 50px;
	position: fixed;
	right: 30px;
	bottom: 30px;
	background: #fff;
	border: solid 2px #119936;
	border-radius: 50%;
	display: none;
	justify-content: center;
	align-items: center;
	z-index: 5000;
	cursor: pointer;
}
.pagetop__arrow {
	display: block;
	height: 10px;
	width: 10px;
	border-top: 3px solid #119936;
	border-right: 3px solid #119936;
	transform: translateY(20%) rotate(-45deg);
}

@media screen and (max-width: 768px) {
	.pagetop {
		right: 10px;
	}	
}

/*
	SP,PC表示切り替え
------------------------------ */
.pc {
	display: block;
}

.sp {
	display: none;
}

@media screen and (max-width: 768px) {
	.pc {
		display: none;
	}

	.sp {
		display: block;
	}
}

/*
	list
------------------------------ */
ul.list li {
	padding-left: 1.25em;
	text-indent: 0;
	position: relative;
}

ul.list li::before {
	margin-right: 0.25em;
	position: absolute;
	left: 0;
}

/* note */
ul.note li {
	font-size: 14px;
}

ul.note li::before {
	content: "※";
}

@media screen and (max-width: 768px) {
	ul.note li {
		font-size: 2.93333vw;
	}
}

/*
	linkBtn
------------------------------ */
.linkBtn a {
	text-decoration: none;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}

@media screen and (max-width: 768px) {
	.linkBtn a {}
}

/* ---------------------------------------------------
	agbHeader
---------------------------------------------------- */
.agbHeader {
	position: relative;	
}

.agbHeader h1 {
	position: absolute;
	top: 50%;
	left: 80%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	width: 22%;
	z-index: 100;
}

@media screen and (max-width: 768px) {
	.agbHeader h1 {
		left: 50%;
		width: 80%;
	}
}

/*
	headerSlide
------------------------------ */
.agbHeader .headerSlide {
	width: 100%;
	line-height: 0;
}
.agbHeader .headerSlide::after {
	content: '';
	background-image: url(../img/mvbg.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	display: block;
	width: 45.6%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
}

.agbHeader .headerSlide__item {
	overflow: hidden;
}

@media screen and (max-width: 768px) {
	.agbHeader .headerSlide {
		width: 100%;
	}
	.agbHeader .headerSlide::after {
		background-image: none;
		background-color: #505050;
		opacity: 0.7;
		display: block;
		width: 100%;
		height: 100%;
	}
}

/* ---------------------------------------------------
	agbMain
---------------------------------------------------- */

/*
	Renewal Pointsエリア（points）
------------------------------ */
#points {
	background-color: #119936;
	padding: 40px 0;
}

#points .area_points {
	max-width: 780px;
	margin: 0 auto;
}

#points .area_points h2 {
	width: 40%;
	margin: 0 auto 50px;
}

#points .area_points ul {
	display: flex;
	justify-content: space-around;
}

#points .area_points ul li {
	width: 25.3333%;
	color: #fff;
}

#points .area_points ul li h3 {
	text-align: center;
	padding: 20px 0;
	font-size: 20px;
}

#points .area_points ul li p {
	font-size: 14px;
	line-height: 2;
	
}

@media screen and (max-width: 768px) {
	#points {
		padding: 30px 0 10px;
	}
	#points .area_points h2 {
		width: 70%;
		margin: 0 auto 40px;
	}
	#points .area_points ul {
		display: block;
	}
	#points .area_points ul li {
		display: flex;
		justify-content: space-evenly;
		width: 90%;
		margin: 0 auto 30px;
	}
	#points .area_points ul li div:first-child{
		width: 40%;
	}
	#points .area_points ul li div:last-child{
		width: 60%;
		margin-left: 20px;
	}
	#points .area_points ul li h3 {
		text-align: left;
		padding: 10px 0;
		font-size: 16px;
	}
	#points .area_points ul li p {
		font-size: 13px;
		line-height: 1.5;
	}
}


/*
	Renewal Mapエリア（map）
------------------------------ */
#map {
	margin: 40px auto;
}

#map .area_map {
	max-width: 780px;
	margin: 0 auto;
}

#map .area_map h2 {
	width: 40%;
	margin: 0 auto 50px;
}

#map .area_map .wrap_map {
	position: relative;
}

#map .area_map .wrap_map ul li {
	display: none;
}

#map .area_map .wrap_map ul li.active {
	display: block;
}

#map .area_map .wrap_map p.mapbtn {
	display: inline-block;
	position: absolute;
	margin-bottom: 0;
	color: #119936;
	font-size: 20px;
	cursor: pointer;
	text-decoration: none;
}
#map .area_map .wrap_map p.mapbtn:hover {
	color: #EA9000;
}

#map .area_map .wrap_map p.mapbtn.kv01 {
	bottom: 28%;
	right: 5.5%;
}
#map .area_map .wrap_map p.mapbtn.kv02 {
	top: 28%;
	right: 40.5%;
}
#map .area_map .wrap_map p.mapbtn.kv03 {
	bottom: 10.5%;
	right: 26.5%;
}
#map .area_map .wrap_map p.mapbtn.kv04 {
	bottom: 37%;
	left: 34.5%;
}
#map .area_map .wrap_map p.mapbtn.kv05 {
	bottom: 30.5%;
	left: 22%;
}
#map .area_map .wrap_map p.mapbtn.kv06 {
	bottom: 6%;
	left: 0;
}
#map .area_map .wrap_map p.mapbtn.close {
	color: #c5c3c3;
	cursor: auto;
}


#map .area_map .wrap_map .piece {
	opacity: 0;
	cursor: pointer;
}
#map .area_map .wrap_map .piece:hover {
	opacity: 1;
}
#map .area_map .wrap_map .piece.pi01 {
	position: absolute;
	width: 15.7%;
	bottom: 22.5%;
	right: 29.15%;
}
#map .area_map .wrap_map .piece .pi02a {
	position: absolute;
	width: 35.2%;
	top: 0%;
	right: 0%;
}
#map .area_map .wrap_map .piece .pi02b {
	position: absolute;
	width: 11%;
	top: 37.2%;
	right: 26%;
}
#map .area_map .wrap_map .piece.pi03 {
	position: absolute;
	width: 11.1%;
	bottom: 17%;
	right: 42.9%;
}
#map .area_map .wrap_map .piece.pi04 {
	position: absolute;
	width: 10.8%;
	bottom: 15%;
	right: 48.9%;
}
#map .area_map .wrap_map .piece.pi05 {
	position: absolute;
	width: 12.5%;
	bottom: 18.5%;
	left: 24.7%;
}
#map .area_map .wrap_map .piece.pi06 {
	position: absolute;
	width: 23.8%;
	bottom: -0.1%;
	left: 5.8%;
}

@media screen and (max-width: 768px) {
	#map .area_map h2 {
		width: 60%;
		margin: 0 auto 30px;
	}
	#map .area_map .wrap_map ul li.active {
		width: 90%;
		margin: 0 auto;
	}
	#map .area_map .wrap_map p.mapbtn {
		font-size: 15px;
	}
	#map .area_map .wrap_map p.mapbtn.kv01 {
		bottom: 33.5%;
		right: 5.5%;
	}
	#map .area_map .wrap_map p.mapbtn.kv02 {
		top: 24%;
		right: 47.5%;
	}
	#map .area_map .wrap_map p.mapbtn.kv03 {
		bottom: 16.5%;
		right: 28.5%;
	}
	#map .area_map .wrap_map p.mapbtn.kv04 {
		bottom: 41.5%;
		left: 21.5%;
	}
	#map .area_map .wrap_map p.mapbtn.kv05 {
		bottom: 35.5%;
		left: 7%;
	}
	#map .area_map .wrap_map p.mapbtn.kv06 {
		bottom: 6%;
		left: 23%;
	}
	#map .area_map .wrap_map .piece.pi01 {
		width: 17.2%;
		bottom: 28.7%;
		right: 36.7%;
	}
	#map .area_map .wrap_map .piece .pi02a {
		width: 38%;
		top: 0%;
		right: 5%;
	}
	#map .area_map .wrap_map .piece .pi02b {
		width: 12%;
		top: 34.5%;
		right: 33.5%;
	}
	#map .area_map .wrap_map .piece.pi03 {
		width: 12%;
		bottom: 23.5%;
		right: 51.9%;
	}
	#map .area_map .wrap_map .piece.pi04 {
		width: 12%;
		bottom: 21.5%;
		right: 58.5%;
	}
	#map .area_map .wrap_map .piece.pi05 {
		width: 14%;
		bottom: 24.5%;
		left: 12.7%;
	}
	#map .area_map .wrap_map .piece.pi06 {
		width: 48%;
		bottom: 0.2%;
		left: 5%;
	}
}


/*
	Renewal Mapエリア（map）
	コンテンツ
------------------------------ */
.area_contents {
	background-color: #EEF8E7;
	position: relative;
	padding: 40px 0;
}

.area_contents .wrap {
	max-width: 930px;
	margin: 0 auto;
}

.area_contents .wrap div.group{
	display: none;
}
.area_contents .wrap div.group.active{
	display: block;
}


.area_contents .wrap h2 {
	font-size: 28px;
	color: #119936;
	text-align: center;
}

.area_contents .wrap ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-top: 30px;
}

.area_contents .wrap ul li {
	width: 23%;
	height: 300px;
}

.area_contents .wrap ul li a {
	color: #000;
	text-decoration: none;
}

.area_contents .wrap ul li a img {
	width: 100%;
	height: 160px;
	object-fit: cover;
}

.area_contents .wrap ul li a .text {
	color: #EA9000;
	font-size: 14px;
	margin-top: 10px;
	margin-bottom: 0;
	line-height: 1.3;
}

.area_contents .wrap ul li a h3 {
	font-size: 18px;
	font-weight: 500;
	line-height: 1.3;
	margin-top: 10px;
}

.area_contents .wrap ul li a .pn {
	font-size: 11px;
	margin-top: 5px;
}


@media screen and (max-width: 768px) {
	.area_contents {
		padding: 20px 0;
	}
	.area_contents .wrap h2 {
		font-size: 24px;
	}
	.area_contents .wrap ul {
		width: 90%;
		margin: 0 auto;
		padding-top: 20px;
	}
	.area_contents .wrap ul li {
		width: 47%;
		height: auto;
		margin-bottom: 30px;
	}
	.area_contents .wrap ul li a img {
		height: 120px;
	}
	.area_contents .wrap ul li a .text {
		font-size: 12px;
	}
	.area_contents .wrap ul li a h3 {
		font-size: 15px;
	}
}


/*
	Renewal Mapエリア（map）
	詳細情報
------------------------------ */
.area_detail {
	margin: 60px auto;
}

.area_detail .wrap {
	max-width: 830px;
	margin: 0 auto;
}

.area_detail .wrap .group {
	display: none;
}
.area_detail .wrap .group.active {
	display: block;
}


.area_detail .wrap .box_detail.mt100 {
	margin-top: 100px;
}

.area_detail .wrap .box_detail p.data {
	text-align: center;
	font-size: 21px;
	color: #EA9000;
}

.area_detail .wrap .box_detail h2 {
	text-align: center;
	font-size: 32px;
	color: #119936;
	border-bottom: 2px solid #119936;
}

.area_detail .wrap .box_detail ul {
	display: flex;
	justify-content: space-between;
	margin: 20px auto;
}

.area_detail .wrap .box_detail ul li {
	width: 50%;
}

.area_detail .wrap .box_detail ul li .wrap {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 15px;
}
.area_detail .wrap .box_detail ul li .wrap.icon {
	justify-content: flex-end;
}

.area_detail .wrap .box_detail ul li .wrap p {
	font-size: 14px;
}

.area_detail .wrap .box_detail ul li .wrap p.location {
	display: inline-block;
	background-color: #97B1B1;
	color: #fff;
	font-size: 12px;
	padding: 5px 10px;
	border-radius: 5px;
	margin-bottom: 0;
}

.area_detail .wrap .box_detail ul li .wrap p.access {
	font-size: 12px;
	padding-left: 10px;
}

.area_detail .wrap .box_detail ul li .wrap.icon div {
	width: 100px;
	margin: 0 5px;
}
.area_detail .wrap .box_detail ul li .wrap.icon div:last-child {
	margin-right: 0;
}

.area_detail .wrap .box_detail .detail_slider {
	position: relative;
	margin-top: 120px;
	margin-bottom: 0;
}
.area_detail .wrap .box_detail .detail_slider img {
	width: 100%;
	height: auto;
	object-fit: cover;
	padding: 0 5px;
}
.area_detail .wrap .box_detail .detail_slider .thum-paging {
	margin-top: 10px;
	display:grid;
	grid-template-columns: repeat(8,1fr);
	gap:5px;
	position: absolute;
	top: -90px;
	max-width: 100%;
}
.area_detail .wrap .box_detail .detail_slider .thum-paging li{
	width: 100%;
	transition:0.2s;
	opacity: 0.7;
}
.area_detail .wrap .box_detail .detail_slider .thum-paging li img{
	padding: 0;
}
.area_detail .wrap .box_detail .detail_slider .thum-paging li.slick-active{
	opacity: 1;
	position: relative;
}
.area_detail .wrap .box_detail .detail_slider .thum-paging li.slick-active::after{
	content: '';
	background: url(../img/bg01.svg);
	background-size: 100%;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.area_detail .wrap .box_detail .detail_slider .slick-slide {
	opacity: 0.3;
	position: relative;
}
.area_detail .wrap .box_detail .detail_slider .slick-slide.slick-center{
	opacity: 1;
}
.area_detail .wrap .box_detail .detail_slider .slick-slide.slick-center::after{
	content: '';
	background: none;
}
.area_detail .wrap .box_detail .detail_slider p.text {
	text-align: center;
	font-size: 19px;
	margin-top: 20px;
	line-height: 1.3;
}
.area_detail .wrap .box_detail .detail_slider p.text span {
	display: block;
	font-size: 14px;
	line-height: 1.3;
	margin-top: 10px;
}
.slick-prev,
.slick-next {
	width: 9%;
	height: 440px;
	background-size: 100%;
	background-repeat: no-repeat;
	z-index: 100;
	background-color: #119936;
	top: 41.6%;
	opacity: 0.8;
}
.slick-prev {
	left: 0;
}
.slick-next {
	right: 0;
}
.slick-prev:before,
.slick-next:before {
	content: '';
	background-size: 100%;
	background-repeat: no-repeat;
	display: block;
	width: 20px;
	height: 40px;
	opacity: 1;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);

}
.slick-prev:before {
	background-image: url(../img/arrow01.svg);
}
.slick-next:before {
	background-image: url(../img/arrow02.svg);
}


.area_detail .wrap .box_detail ul.area_btn {
	display: flex;
	justify-content: center;
	align-items: center;
}

.area_detail .wrap .box_detail ul.area_btn li {
	width: 250px;
	margin: 0 10px;
}

.area_detail .wrap .box_detail ul.area_btn li a {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #119936;
	font-size: 15px;
	padding: 10px 0;
	color: #fff;
	text-decoration: none;
}

.area_detail .wrap .box_detail .area_guidance {
	background-color: #EFEFEF;
	padding: 30px 30px 10px;
	margin-top: 20px;
}

.area_detail .wrap .box_detail .area_guidance h3 {
	color: #119936;
	font-size: 19px;
	text-align: center;
}

.area_detail .wrap .box_detail .area_guidance ul {
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
}

.area_detail .wrap .box_detail .area_guidance ul li {
	width: 29.33333%;
	margin-bottom: 20px;
}

.area_detail .wrap .box_detail .area_guidance ul li p {
	font-size: 14px;
	text-align: center;
	margin-top: 10px;
	line-height: 1.3;
}

@media screen and (max-width: 768px) {
	.area_detail .wrap {
		width: 90%;
	}
	.area_detail {
		margin: 40px auto;
	}
	.area_detail .wrap .box_detail.mt100 {
		margin-top: 60px;
	}
	.area_detail .wrap .box_detail p.data {
		font-size: 18px;
	}
	.area_detail .wrap .box_detail h2 {
		font-size: 26px;
		line-height: 1.5;
	}
	.area_detail .wrap .box_detail ul {
		display: block;
	}
	.area_detail .wrap .box_detail ul li {
		width: 100%;
	}
	.area_detail .wrap .box_detail ul li .wrap {
		display: block;
		width: 100%;
		margin: 10px 0;
	}
	.area_detail .wrap .box_detail ul li .wrap.icon {
		display: flex;
		justify-content: flex-start;
	}
	.area_detail .wrap .box_detail ul li .wrap.icon div {
		width: 20%;
		margin: 0 5px;
	}
	.area_detail .wrap .box_detail ul li .wrap.icon div:first-child {
		margin-left: 0;
	}
	.area_detail .wrap .box_detail .detail_slider {
		margin-top: 70px;
	}
	.area_detail .wrap .box_detail .detail_slider .thum-paging {
		top: -50px;
	}
	.slick-prev, .slick-next {
		width: 7%;
		height: 20%;
		top: 36.5%;
	}
	.slick-prev {
		left: -10px;
	}
	.slick-next {
		right: -10px;
	}
	.slick-prev:before, .slick-next:before {
		width: 8px;
		height: 16px;
	}
	.area_detail .wrap .box_detail .detail_slider p.text {
		font-size: 14px;
		margin-top: 20px;
	}
	.area_detail .wrap .box_detail .detail_slider p.text span {
		font-size: 11px;
	}
	.area_detail .wrap .box_detail ul.area_btn {
		display: grid;
	}
	.area_detail .wrap .box_detail ul.area_btn li:first-child {
		margin-bottom: 10px;
	}
	.area_detail .wrap .box_detail .area_guidance {
		padding: 20px 10px 10px;
	}
	.area_detail .wrap .box_detail .area_guidance ul li {
		width: 46%;
	}
	.area_detail .wrap .box_detail .area_guidance ul li p {
		font-size: 12px;
	}
	.area_detail .wrap .box_detail ul li .wrap p.location {
		padding: 5px;
		margin-bottom: 0;
		text-align: center;
	}
	.area_detail .wrap .box_detail ul li .wrap p.access {
		padding-left: 0;
		padding-top: 5px;
	}
	.area_detail .wrap .box_detail ul.area_btn li a {
		font-size: 14px;
	}
	.area_detail .wrap .box_detail .detail_slider .slick-slide {
		opacity: 1;
	}
	.area_detail .wrap .box_detail .detail_slider img {
		padding: 0;
	}
	.area_detail .slick-slider .slick-track,
	.area_detail .slick-slider .slick-list {
		width: 90%;
		margin: 0 auto;
	}
}

/* 画像4つ用 */
.area_detail .wrap .box_detail .detail_slider.col4 {
	margin-bottom: 30px;
}
.area_detail .wrap .box_detail .detail_slider.col4 .slick-prev,
.area_detail .wrap .box_detail .detail_slider.col4 .slick-next {
    width: 9%;
    height: 440px;
    background-size: 100%;
    background-repeat: no-repeat;
    z-index: 100;
    background-color: #119936;
    top: 43%;
    opacity: 0.8;
}

@media screen and (max-width: 768px) {
	.area_detail .wrap .box_detail .detail_slider.col4 .slick-prev,
	.area_detail .wrap .box_detail .detail_slider.col4 .slick-next {
		width: 7%;
		height: 20%;
		top: 36.5%;
	}
}


/* ストリートビュー */
.street {
	width: 600px;
	margin: 0 auto;
	background-color: #EFEFEF;
	padding: 10px 10px 20px 10px;
}

.street p.text {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	color: #119936;
	margin-bottom: 10px;
}

.street p.text span {
	display: inline-block;
	position: relative;
	width: 50px;
	margin-right: 15px;
}
/* .street p.text span::before {
	content: "";
	background: url(../img/logo_360.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	width: 50px;
	height: 26px;
	position: absolute;
	top: -5px;
	left: -56px;
} */

.street iframe {
	display: block;
	width: 80%;
	height: 360px;
	margin: 0 auto;
}

@media screen and (max-width: 768px) {
	.street {
		width: 100%;
	}	
	.street p.text {
		font-size: 16px;
	}	
	.street iframe {
		width: 100%;
	}
	.street p.text span::before {
		width: 35px;
		top: 0;
		left: -40px;
	}	
}