@charset "utf-8";
/*
Theme Name: campfield
Theme URI: www.www.www
Author: takedesign
Author URI: www.www.www
Version: 0.0.1
*/
/* リセットCSS */
*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}main{display:block}h1,h2,h3,h4,h5,h6{font-size:inherit;line-height:inherit;font-weight:bold;}a{text-decoration:none;color:inherit;transition:all .3s ease-in-out}img{display: block;width: 100%;max-width:100%;height:auto;vertical-align: middle;}ol,ul{list-style:none}table{border-collapse:collapse}input,textarea,select{font:inherit;line-height:inherit;border:1px solid #ccc;padding:8px;}textarea{resize:vertical}button{padding: 0;font-family: inherit;appearance: none;cursor: pointer;background-color: transparent;border: none;}fieldset{border:0;padding:0;margin:0;min-width:0}legend{display:block;width:100%;max-width:100%;padding:0;white-space:normal;}[hidden],template{display:none}:focus-visible{outline:2px solid #000}

/* 汎用CSS
===================================================== */
/* タイトル */
.c-title01 {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	line-height: 1.25;
	padding-top: 35px;
	position: relative;
	z-index: 1;
}
.c-title01::before {
	content: '';
	display: block;
	width: 130px;
	aspect-ratio: 1;
	background: url(images/common/icon_ww.webp) center / contain no-repeat;
	position: absolute;
	inset: 0 auto auto 50%;
	translate: -50% 0;
	z-index: -1;
}
.c-title01__en {
	display: block;
	font-size: 2.5em;
	font-weight: 900;
	text-transform: uppercase;
}
@media(max-width: 640px) {
	.c-title01 {
		font-size: 14px;
	}
}

/* テキスト */
.c-text01 {
	font-size: 25px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	width: fit-content;
	padding-inline: 1.1em;
	margin-inline: auto;
	position: relative;
}
.c-text01::before,
.c-text01::after {
	content: '';
	display: block;
	width: 1em;
	aspect-ratio: 1;
	background: url(images/common/icon_slash.svg) center / contain no-repeat;
	position: absolute;
	bottom: calc(0.5lh - 0.5em);
}
.c-text01::before {
	left: 0;
	scale: -1 1;
}
.c-text01::after {
	right: 0;
}
.c-ls1em {
	letter-spacing: .5em;
}
@media(max-width: 640px) {
	.c-text01 {
		font-size: 18px;
	}
	.c-ls1em {
		letter-spacing: .05em;
	}
}

/*ボタン */
.c-btn01 {
	display: block;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	width: min(100%, 250px);
	border: 1px solid #222222;
	border-radius: calc(1px * infinity);
	padding: 15px;
}
@media (any-hover: hover) {
	.c-btn01:hover {
		color: #fff;
		background-color: #F40F02;
	}
}
/* 説明リスト */
.c-dl01 {
	display: flex;
	flex-direction: column;
	gap: 45px;
}
.c-dl01__box {
	display: grid;
	grid-template-columns: 110px 1fr;
	align-items: center;
	gap: 15px;
}
.c-dl01__box--aifs {
	align-items: flex-start;
}
.c-dl01__title {
	font-size: 17px;
	font-weight: 500;
	color: #fff;
	text-align: center;
	background-color: #4A6B52;
	border-radius: calc(1px * infinity);
	padding: 7px 10px;
}
.c-dl01__cts {
	font-weight: 500;
	text-align: left;
}
.c-dl01__cts p + p {
	margin-top: 1lh;
}
@media(max-width: 640px) {
	.c-dl01__box {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
}

/* 波区切り */
.c-wave-top,
.c-wave-bottom {
	position: relative;
}
.c-wave-top {
	padding-top: 13.75vw;
}
.c-wave-bottom {
	padding-bottom: 13.75vw;
}
.c-wave-top::before,
.c-wave-bottom::after {
	content: '';
	display: block;
	width: 100%;
	height: 13.75vw;
	position: absolute;
	z-index: 1;
}
.c-wave-top::before {
	background: url(images/common/parts_wave01.webp) center bottom / 100% auto no-repeat;
	inset: -1px auto auto 0;
}
.c-wave-bottom::after {
	background: url(images/common/parts_wave02.webp) center top / 100% auto no-repeat;
	inset: auto auto -1px 0;
}


/* マージン */
.c-mt-m {
	margin-top: 60px;
}
@media(max-width: 640px) {
	.c-mt-m {
		margin-top: 40px;
	}
}

/* ホバー */
.c-hover01 {
	position: relative;
}
.c-hover01::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: #fff;
	transition: all 0.3s;
	transform: scale(0, 1);
	transform-origin: center top;
}
@media (any-hover: hover) {
	.c-hover01:hover::after {
		transform: scale(1, 1);
	}
}

/* フェードイン */
.c-feed {
	translate: 0 100px;
	opacity: 0;
	transition: opacity 1s, translate 1s;
}
.c-feed.animated {
	translate: 0 0;
	opacity: 1;
}

/* スマホでテキストの折り返し用 */
.ib {display: inline-block}

/* フォーム */
label {margin-bottom:8px;}
select,
input[type=date],
input[type=email],
input[type=number],
input[type=password],
input[type=tel],
input[type=text],
input[type=url],
textarea {width: 100%;max-width: 100%;padding: 8px 16px;background-color: #fff;margin-top: 4px;}
select,input,textarea {line-height: 1.1;font-family: inherit;font-size: inherit;font-weight: inherit;}

input[type="submit"],
input[type="button"]{padding: 12px 16px;}

.fontM{font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;}
.fontG{font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;}
.fonten{font-family:var(--en-font)}

:root {
	--font-color: #222222;
	--main-color:#4A6B52;
	--bg-color: #2e2e2e;
	--main-font:"Noto Sans JP", sans-serif;
	--hover-transform:all .3s ease-in-out;
	--hamburger-transform:display .5s ease-in-out;
	--show-anime:opacity .5s , translate 1s;
	--clip-triangle-top: polygon(50% 0, 100% 100%, 0 100%);
	--clip-triangle-bottom: polygon(0 0, 100% 0, 50% 100%);
	--clip-triangle-right: polygon(0 0, 100% 50%, 0 100%);
	--clip-triangle-left: polygon(0 50%, 100% 0, 100% 100%);
	--clip-triangle-lower-left: polygon(0 0, 100% 100%, 0 100%);
	--clip-triangle-upper-left: polygon(0 0, 100% 0, 0 100%);
	--clip-triangle-lower-right: polygon(100% 0, 100% 100%, 0 100%);
	--clip-triangle-upper-right: polygon(0 0, 100% 0, 100% 100%);
}

::selection {background-color: var(--main-color);color:#fff;}

/* 基本レイアウト
===================================================== */

html{height: -webkit-fill-available;}
body{min-height: 100vh;min-height: -webkit-fill-available;}

body {font-size: 16px;font-family:var(--main-font);line-height:1.6;letter-spacing: .05em;color: var(--font-color);text-align: justify;font-feature-settings: "palt";}
.page-content{padding-block:80px;}
.container{width: 1140px;max-width: 100%;padding-inline: 20px;margin-inline: auto;position: relative;z-index:11}

@media(max-width:720px){
	body{font-size:14px;}
}

/* ヘッダー
===================================================== */
.header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 20px 10px;
	width: min(100%, 1040px);
	padding-inline: 20px;
	margin-inline: auto;
	position: absolute;
	inset: 15px auto auto 50%;
	z-index: 100;
	translate: -50% 0;
}

.header__title {
	width: min(100%, 312px);
}
.header__nav-list {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}
.header__nav-link {
	color: #fff;
}
@media(max-width: 1031px) {
	.header {
		padding-inline: 10px;
		top: 10px;
	}
	.header__title {
		width: min(100%, 200px);
	}
	.header__nav {
		display: none;
	}
}

/* ハンバーガーメニュー */
.header-hamburger{display:none}
.hamburgerbutton {position: fixed;display: block;text-decoration: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;border: none;cursor: pointer;height: 78px;width: 78px;background-color: transparent;padding: 0;margin:0 auto;top: 0;right: 0;z-index: 111;}
.hamburgerbutton-line {position: absolute;inset:0;margin: auto;width: 40px;height: 3px;-webkit-transition: inherit;transition: inherit;background-color: var(--main-color);}
.hamburgerbutton-line::before,
.hamburgerbutton-line::after {position: absolute;display: block;width: 100%;height: 100%;background-color: inherit ;content: '';-webkit-transition: inherit;transition: inherit;transition: transform .2s;}
.hamburgerbutton-line::before {top: -10px;}
.hamburgerbutton-line::after {top: 10px;}
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line {background-color: transparent;}
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line::before,
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line::after {top: 0;background-color: var(--main-color);}
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line::before {transform: rotate(45deg);width:100%;}
.hamburgerbutton[aria-expanded="true"] .hamburgerbutton-line::after {transform: rotate(-45deg);width:100%;}
.visuallyHidden {position: absolute;white-space: nowrap;width: 1px;height: 1px;overflow: hidden;border: 0;padding: 0;clip: rect(0 0 0 0);clip-path: inset(50%); margin: -1px;}
.nav_hamburger_menu{position:fixed;inset: 0;margin: auto;width: 100%;height: 100dvh;overflow: auto;transition: opacity .5s;align-items: center;pointer-events: none;}

.hamburger-content{width: 640px;max-width: 89%;height: 100%;margin-left: auto;background-color: #2e2e2e;padding-inline: 20px;padding-block: 40px;overflow: auto;opacity:0;transition:opacity 1.4s cubic-bezier(0.14,1,0.34,1)}


/* フッター
---------------------------- */
.footer {
	padding-top: 16.83vw;
	background-color: #F7F7F7;
	position: relative;
}
.footer::before {
	content: '';
	display: block;
	width: 100%;
	height: 16.83vw;
	background: url(images/common/footer_bg.webp) center bottom / 100% auto no-repeat;
	position: absolute;
	inset: 1px auto auto 0;
	z-index: 1;
}
.footer * {
	color: #fff;
}
.footer__inner {
	background-color: #222222;
	padding: 25px 35px 10px;
}
.footer__nav {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: .5em 1em;
}
.footer__nav-item {
	position: relative;
}
.footer__nav-item:not(:last-child)::after {
	content: '';
	display: block;
	width: 1px;
	height: 1em;
	background-color: #fff;
	position: absolute;
	inset: calc(50% + 2px) -.5em auto auto;
	translate: -50% -50%;
}
.footer__nav-link {
	font-size: 13px;
}
.footer__logo {
	display: block;
	width: min(100%, 312px);
	margin: 22px auto 0;
}
.footer__by,
.footer__address,
.footer__copy {
	text-align: center;
	margin-top: 12px;
}
.footer__by,
.footer__address {
	font-size: 14px;
}
.footer__copy {
	font-size: 12px;
}

@media(max-width:1024px){
	.header-nav{display:none;}
	.header-hamburger{display:block;}
}

@media(max-width:676px){
}

/*-------------------------------------
/* 共通
--------------------------------------- */
.noPost{text-align:center;}
.link-over{position:absolute;inset:0;margin:auto;z-index:1}
.fadeUP{opacity: .0;translate: 0 50px;transition:var(--show-anime);}
.fadeLeft{opacity: .0;translate: -50px 0;transition:var(--show-anime);}
.fadeRight{opacity: .0;translate: 50px 0;transition:var(--show-anime);}
.show .fadeUP{opacity:1;translate:0}
.show .fadeLeft{opacity:1;translate:0}
.show .fadeRight{opacity:1;translate:0}
.show .delay2{transition-delay:.2s}
.show .delay4{transition-delay:.4s}
.show .delay6{transition-delay:.6s}

/*-------------------------------------
/* ホバースタイル
--------------------------------------- */

@media (hover: hover){
	.header_Menu_list li a:hover{opacity:.5}
	.footer_navi a:hover{opacity:.5}
	.link-over:hover ~ figure img{scale:1.05}
}


/* TOP
===================================================== */
/* FV */
.t-fv {
	background: url(images/home/fv_img.webp) center bottom / cover no-repeat;
	mask-image: url(images/home/fv_mask.webp);
	mask-size: cover;
	mask-position: center bottom;
	position: relative;
	z-index: 10;
}
.t-fv::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-color: #1A1311;
	position: absolute;
	inset: 0 auto auto 0;
	opacity: 0.15;
}
.t-fv__wrapper {
	width: min(100%, 1070px);
	padding-inline: 35px;
	margin-inline: auto;
	position: relative;
}
.t-fv__inner {
	width: min(100%, 900px);
	min-height: 700px;
	padding-top: 190px;
	margin-inline: auto;
	position: relative;
}
.t-fv__catch {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
}
.t-fv__catch span {
	font-size: 20px;
	color: #fff;
	background-color: #222222;
	padding: 0 8px;
	clip-path: inset(0 100% 0 0);
	animation: mask 1s ease-out forwards;
}
@keyframes mask {
	to {
		clip-path: inset(0);
	}
}
.t-fv__ww {
	width: 45.89%;
	position: absolute;
	inset: 150px auto auto 50%;
	translate: -50% 0;
}
.t-fv__nap {
	width: min(100%, 115px);
	position: absolute;
	inset: 85px 35px auto auto;
}
@media (any-hover: hover) {
	.t-fv__nap:hover {
		translate: 0 -10px;
	}
}
@media(max-width: 1031px) {
	.t-fv {
		mask-image: none;
	}
	.t-fv__inner {
		display: flex;
		flex-direction: column-reverse;
		justify-content: center;
		row-gap: 30px;
		min-height: 100dvh;
		padding-top: 100px;
	}
	.t-fv__ww {
		width: min(100%, 200px);
		margin-inline: auto;
		position: relative;
		inset: auto;
		translate: 0 0;
	}
	.t-fv__nap {
		width: min(100%, 80px);
		inset: auto 10px 10px auto;
	}
}

/* 当施設について */
.t-about {
	background: url(images/home/about_bg.webp) center / cover no-repeat;
	padding: 170px 35px 155px;
	margin-top: -170px;
	position: relative;
}
.t-about::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-color: #A0D8EF;
	position: absolute;
	inset: 0 auto auto 0;
	opacity: .7;
}
.t-about__inner {
	width: min(100%, 460px);
	margin-inline: auto;
	position: relative;
}
.t-about__text {
	font-weight: 500;
	line-height: 2.18;
}
@media(min-width: 1201px) {
	.t-about {
		margin-top: -14vw;
	}
}
@media(max-width: 1031px) {
	.t-about {
		margin-top: 0;
	}
}
@media(max-width: 640px) {
	.t-about {
		padding: 100px 35px;
	}
}

/* 施設案内図 */
.t-map {
	padding: 80px 35px 55px;
}
.t-map__map {
	width: min(100%, 808px);
	margin: 60px auto 0;
}
.t-map__btn {
	margin: 30px auto 0;
}
@media(max-width: 640px) {
	.t-map {
		padding: 100px 35px;
	}
}

/* アクティビティ */
.t-activities {
	padding: 0;
}
.t-activities__wrapper {
	background: url(images/home/activities_bg.webp) center / cover no-repeat;
	padding: 13.75vw 35px;
	position: relative;
}
.t-activities__wrapper::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-color: #4A6B52;
	position: absolute;
	inset: 0 auto auto 0;
	opacity: 0.5;
}
.t-activities__wrapper > * {
	position: relative;
}
.t-activities__list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px 60px;
	width: min(100%, 875px);
	margin: 45px auto 0;
}
.t-activities__list-icon {
	width: min(100%, 170px);
	margin-inline: auto;
}
.t-activities__list-title {
	font-size: 22px;
	font-weight: bold;
	color: #fff;
	text-align: center;
}
.t-activities__list-img {
	border-radius: 31px;
	margin-top: 10px;
	overflow: hidden;
}
.t-activities__list-text {
	font-weight: 500;
	color: #fff;
	margin-top: 15px;
}
.t-activities__text {
	margin-top: 40px;
}
.t-activities__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-size: 18px;
	font-weight: bold;
	width: min(100%, 250px);
	min-height: 60px;
	background-color: #fff;
	border-radius: calc(1px * infinity);
	margin: 25px auto 0;
}
.t-activities__btn img {
	width: 85px;
	transition: all .3s ease-in-out;
}
@media (any-hover: hover) {
	.t-activities__btn:hover {
		color: #fff;
		background-color: #88BE44;
	}
	.t-activities__btn:hover img {
		filter: brightness(0) invert(1);
	}
}
@media(max-width: 767px) {
	.t-activities__list {
		gap: 30px 40px;
	}
}
@media(max-width: 640px) {
	.t-activities__wrapper {
		padding: calc(13.75vw + 100px) 35px;
	}
	.t-activities__list {
		grid-template-columns: repeat(1, minmax(0, 1fr));
		row-gap: 40px;
		margin-top: 60px;
	}
	.t-activities__list-icon {
		width: min(100%, 100px);
	}
}

/* アクセス */
.t-access {
	width: min(100%, 1070px);
	padding: 0 35px 100px;
	margin: -4.17vw auto 0;
}
.t-access__map {
	width: 100%;
	height: 415px;
	margin-top: 45px;
}
.t-access__dl {
	width: min(100%, 560px);
	margin: 45px auto 0;
}
@media(max-width: 640px) {
	.t-access {
		padding: 100px 35px;
		margin-top: 0;
	}
	.t-access__map {
		height: 250px;
		margin-top: 60px;
	}
}

/* 運営情報 */
.t-info {
	background-color: #F7F7F7;
	padding: 60px 35px 70px;
}
.t-info__dl {
	flex-direction: row;
	justify-content: center;
	gap: 40px 80px;
	flex-wrap: wrap;
	margin-top: 45px;
}
@media(max-width: 640px) {
	.t-info {
		padding: 100px 35px;
	}
	.t-info__dl {
		margin-top: 60px;
	}
}

/* お問い合わせ
===================================================== */
.page-contact-des{text-align:center;padding-top:40px;}

.c-table {width: 800px;max-width:100%;margin-inline: auto;}
.from-item{display:flex;flex-wrap: wrap;padding-block: 40px;border-bottom: 1px solid #E4E4E4;}
.c-table .fl{width:240px;padding-block: 4px;display: block;}
.c-table .fr{width:calc(100% - 240px)}
.required{font-size: 12px;color: #fff;padding-block: 4px;padding-inline: 8px;background-color: var(--main-color);margin-right: 16px;vertical-align: 1px;}
.any{font-size: 12px;padding: 4px 8px;background-color: #b4b5b5;margin: 0 16px 0 0;vertical-align: 1px;}
.example{font-size: 14px;letter-spacing: -1px;}
.from-item input[type=email]{width:100%}
.from-item input[type=tel]{width:310px;}
.from-item textarea {height: 140px;width:100%}
.from-note{width: 420px;max-width: 100%;text-align:center;margin:40px auto 0;padding: 32px 16px;background-color: #F8F8F8;border-radius:6px;}
.from-note p{color:#000;}
.from-note .acceptance-wrap{font-weight:bold;margin:16px 0 0}
.from-note .doui{width: 18px;height: 18px;margin: 0 8px 0 0;border: none;vertical-align: -3px;}
.wpcf7-submit:disabled{opacity: 0.3;pointer-events: none}
.formsubmit{margin: 60px auto 0;position:relative;width:fit-content;}
.formsubmit .wpcf7-submit{width: 300px;max-width:100%;margin-inline: auto;padding-block: 24px;background-color: var(--main-color);line-height:1;text-align: center;position: relative;font-size: 20px;color: #fff;transition:var(--hover-transform)}
.wpcf7-spinner{display:block;margin:16px auto}
.policy-link{padding:0 8px;text-decoration: underline;}

@media(max-width:720px){
  .c-table .fl,
  .c-table .fr{width:100%;}
}

@media(max-width:560px){
  .c-table{margin-top:24px}
}

.page-herder{background-color:var(--main-color);padding-block: 160px 80px;}



/* privacypolicy
===================================================== */

.privacypolicy-item{width: 800px;max-width:100%;margin-inline:auto;}
.privacypolicy-item h3{font-size:20px;margin-block:40px 8px}
.privacypolicy-item h4{font-size:18px;margin-block:32px 8px}
.privacypolicy-item h4::before{content:'';display:inline-block;width:16px;height:16px;background-color: var(--font-color);margin-right:8px;}
.privacypolicy-item h5{margin-block:24px 8px}
.privacypolicy-item h5::before{content:'';display:inline-block;width:16px;height:1px;background-color: var(--font-color);margin-right:8px;vertical-align: 6px;}
.privacypolicy-item ul,
.privacypolicy-item ol{margin-block:16px}
.privacypolicy-item li{position:relative;padding-left: 24px;}
.privacypolicy-item li::before{content:'';position: absolute;width:10px;height:10px;border-radius:10px;background-color: var(--font-color);margin-right:8px;top: 8px;left: 4px;}