@charset "UTF-8";
/*
Theme Name: 1osMC
Theme URI: https://web.1os.co.jp/
Author: One OS inc.
Author URI: https://1os.co.jp/
Description: このテーマは株式会社ワンオーエス(サービス名：クオリティWebデザイン)によって作成されました。高品質でカスタマイズ可能なデザインを提供し、ユーザーに素晴らしいエクスペリエンスをもたらします。
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: 1os_mc
Tags: レスポンシブ, マルチ, 1カラム, 2カラム, 翻訳対応
*/

/**********  カスタマイズCSS **********/

body{
    position: static !important;
    top: 0 !important;
}
#header_wrapper{
	border-bottom:0 solid rgba(255,255, 0);
}
.scroll #header_wrapper{
	border-bottom:4px solid rgba(56,183,67, 1);
}
#contents_container{
	transition:font-size .1s ease;
}
.title_h2 {
	padding:0 .4em .2em;
	display:flex;
	border-bottom:3px double #38b743;
}

.title_h2::before {
	display:block;
	content: "";
	left: 0;
	top: 0;
	width: 1.4em;
	height: 1.4em;
	margin-right:.4em;
	background-image: url("https://test.nishitokyo-parks.jp/wp-content/uploads/object-title_h2.svg");
	background-repeat: no-repeat;
	background-size: contain;
	flex-shrink: 0; /* ←これ重要 */
}

.title_h3 {
	padding:0 .4em .2em;
	display:flex;
	border-bottom:1px solid #38b743;
}

.title_h3::before {
	display:block;
	content: "";
	left: 0;
	top: 0;
	width: 1.6em;
	height: 1.6em;
	margin-right:.4em;
	background-image: url("https://test.nishitokyo-parks.jp/wp-content/uploads/object-title_h3.svg");
	background-repeat: no-repeat;
	background-size: contain;
}
.table th,
.table td{
	padding:.4em;
	font-weight:400;
	border:1px solid #ccc
}
.park_navi_list{
	min-height:4em;
}
.spot_line_cont > p:first-child{margin-top:0}
.spot_line_cont > p:last-child{margin-bottom:0}
#global_nav{
	display:flex;
	flex-wrap:wrap;
	padding:1.8em .4em 0;
}
#global_nav > .menu-item{
	width:calc(100% / 3)!important;
	padding:.8em .4em;
}
#global_nav > .menu-item > a{
	font-weight:500;
	display:flex;
	flex-direction:column;
	text-align:center;
}
#global_nav .menu_text{
	font-size:.8em;
}
#global_nav > .menu-item > a::before{
	content: "";            /* ← これが必須 */
	display:block;
	width:3em;
	height:3em;
	transform:scale(1);
	transform-origin:center;
	transition:transform .3s ease;
}
#global_nav > #menu-item-10.menu-item > a::before{
	background:url('/wp-content/uploads/icon_home.svg');
    background-size: contain !important;
	background-repeat:no-repeat;
}
#global_nav > #menu-item-23.menu-item > a::before{
	background:url('/wp-content/uploads/icon_parks.svg');
    background-size: contain !important;
	background-repeat:no-repeat;
}

#global_nav > #menu-item-12.menu-item > a::before{
	background:url('/wp-content/uploads/icon_mail.svg');
    background-size: contain !important;
	background-repeat:no-repeat;
}

#global_nav > #menu-item-25.menu-item > a::before{
	background:url('/wp-content/uploads/icon_ikoi.svg');
    background-size: contain !important;
	background-repeat:no-repeat;
}

#global_nav > #menu-item-24.menu-item > a::before{
	background:url('/wp-content/uploads/icon_activities.svg');
    background-size: contain !important;
	background-repeat:no-repeat;
}

#global_nav > #menu-item-257.menu-item > a::before{
	background:url('/wp-content/uploads/icon_event.svg');
    background-size: contain !important;
	background-repeat:no-repeat;
}

@media (min-width: 1024px) and (max-width: 1279px) {
	#global_nav > .menu-item {
	}
	#global_nav > .menu-item > a{
		font-size:.9em;
		padding: 0 .4em;
	}
}

div.skiptranslate,
#google_translate_element2 {display:none!important;}
#gtranslate_selector,
#gtranslate_selector option{
	border-radius:none!important;
	cursor: pointer;
	outline: none;
	background:#fff
}
#gtranslate_selector{
	padding:0 8px!important;
}

.langCng{
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	background:#fff;
	color:#333;
	border:1px solid #ccc;
	padding:0 36px 0 16px;
	height:38px;
	font-size:1rem;
	font-family:inherit;
	cursor:pointer;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23333' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 10px center;
	background-size:10px;
	transition:all .2s ease;
}
.langCng:focus{
	outline:none;
	border-color:#007cba;
	box-shadow:0 0 0 2px rgba(56,183,67, .2);
	background:#fff;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23333' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 10px center;
	background-size:10px;
}

.changeBtn {
	width:						40px;
	height:						40px;
	line-height:				1;
	margin-left:4px;
	cursor:						pointer;
	transition:all .3s ease;
}

.fontTitle{text-shadow:1px 1px 0 #fff,-1px 1px 0 #fff,1px -1px 0 #fff,-1px -1px 0 #fff}

.tab-nav{
	z-index:1;
	margin:0 0 0 1px;
}

.tab-nav .tab-nav_button{
	cursor:pointer;
	padding:.8em 0;
	background:#eee;
	color:#38b743;
	width:calc(100% / 3 + 1px);
	margin-left:-1px;
	transition:background .4s, color .4s;
}
.tab-nav > .tab-nav_button:first-child{
	border-radius:.5em 0 0 0;
}
.tab-nav > .tab-nav_button:last-child{
	border-radius:0 .5em 0 0;
}

.tab-nav .tab-nav_button.active{
	background:#eaffec;
	color:#0a590e;
	border-bottom:none;
}
.tab-contents{
	margin-top:-1px;
	padding:1px;
	background:#eaffec;
	border-radius:0 0 .5em .5em;
}
.tab-contents::after{
	content: "";
	position: absolute;
	right: -.5em;
	bottom: -.5em;
	width: 72px;
	height: 72px;
	background: url('https://test.nishitokyo-parks.jp/wp-content/uploads/object-01.svg') no-repeat center center / contain;
	pointer-events: none;
	opacity:.8
}

.tab-panel{
	display:none;
	padding:.6em;
	min-height:8em;
	border-radius:0 0 .5em .5em;
	background:#fff;
}

.tab-panel.active{
	display:block;
}

.modal_slider .slick-prev,
.post_list_slider .slick-prev,
.modal_slider .slick-next,
.post_list_slider .slick-next {
	position: absolute;
	z-index: 5;
	border: none;
	width: 28px;
	height: 28px;
	top:50%;
	border-radius:50%;
	background:rgba(10,89,14, .8);
	fill:#fff;
	border:1px solid #fff;
	text-indent: -9999px;
	cursor: pointer;
	transition: background 0.4s;
}
.post_list_slider .slick-prev,
.post_list_slider .slick-next {
	transform: translateY(calc(-50% - 1.6em));
}
.modal_slider .slick-prev,
.modal_slider .slick-next{
	transform: translateY(-50%);
}
.modal_slider .slick-prev,
.post_list_slider .slick-prev {left:-10px}
.modal_slider .slick-next,
.post_list_slider .slick-next {right:-10px}
.contents_slider .svg-icon {width:13px}
.js-lazy-map iframe {
	width: 100%;
	height: 100%;
	display: block;
}
#parks_map iframe {
    width: calc(100% + 124px);
    height:calc(100% + 8px);
    margin-top: -8px;
    margin-right: -122px;
    margin-left: -2px;
}
.park_no{
	pointer-events: none;
	width:2em;
	height:2em;
	top:-2px;
	left:-2px;
	z-index:2;
	border:1px solid #fff;
	letter-spacing:-.1em;
	padding-right:.2em;
}
.park_wrapper{
	cursor:pointer;
}
.modal_slider .arrow-right_bottom::after {
	background-color: #fff;
}
/* 背景 */
.park_modal{
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.0);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;

	opacity: 0;
	visibility: hidden;

	transition: opacity .3s ease, background .3s ease, visibility 0s linear .3s;
}

/* 表示状態 */
.park_modal.active{
	opacity: 1;
	visibility: visible;
	transition: opacity .3s ease, background .3s ease;
	background: rgba(0,0,0,0.7);
}
/* 中身 */
.park_modal_inner{
	background: #fff;
	width: min(90%, 800px);
	max-height: 90vh;      /* 画面高さの90%まで */
	overflow-y: auto;     /* 縦スクロール */
	padding: 1em;
	position: relative;

	opacity: 0;
	transform: translateY(20px) scale(.95);
	transition: opacity .3s ease, transform .3s ease;
}

/* 表示時 */
.park_modal.active .park_modal_inner{
	opacity: 1;
	transform: translateY(0) scale(1);
}
.modal_close{
	cursor: pointer;
	border:none;
}

#event_calender{
	width:100%;
}

.required{
	line-height:1.2;
}

/* 見た目 */
.faq_summary {
	cursor: pointer;
	padding: .4em 2em .4em .4em;
	transition: 0.4s;
	border-bottom:1px solid #a0d6a6
}
.faq_summary::before {
	content: "Q";
	margin-top:-.2em;
	margin-right:.4em;
	font-size:1.1em;
}

/* 矢印 */
.faq_summary::after {
	content: "";
	display: block;
	position:absolute;
	width: 1em;
	height: 1em;
	top:50%;
	right:.8em;
	background-color: currentColor;
	vertical-align: -0.125em;
	-webkit-mask: url("./img/icon-arrow-right.svg") no-repeat center / contain;
	mask: url("./img/icon-arrow-right.svg") no-repeat center / contain;
	transition: transform 0.3s ease;
	flex-shrink: 0;
	transform: translateY(-50%) rotate(90deg);
}

/* 開いた時 */
.faq_details.open .faq_summary::after {
	transform: translateY(-50%) rotate(270deg);
}

.faq_details.open .faq_summary {
	border-bottom:1px solid #309b35
}

/* 回答 */
.faq_answer {
	overflow: hidden;
	height: 0;
	transition: height 0.35s ease;
}

/* 入力系共通 */
input[type="text"],
input[type="email"],
textarea,
select {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 16px;
	background: #fafafa;
	transition: all 0.2s ease;
}

/* フォーカス時 */
input:focus,
textarea:focus,
select:focus {
	border-color: #4CAF50;
	background: #fff;
	outline: none;
	box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.15);
}

/* プレースホルダー */
::placeholder {
	color: #aaa;
}

/* テキストエリア */
textarea {
	min-height: 120px;
	resize: vertical;
}

/* ボタン */
button,
input[type="submit"] {
	background: linear-gradient(135deg, #4CAF50, #66bb6a);
	color: #fff;
	line-height:1.2;
	border: none;
	padding:.8em 1.2em .7em;
	border-radius:.2em;
	font-size: 1em;
	cursor: pointer;
	transition: 0.2s;
}

/* ホバー */
button:hover,
input[type="submit"]:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* 無効状態 */
button:disabled {
	background: #ccc;
	cursor: not-allowed;
}

.wpcf7 form .wpcf7-response-output {
	margin: 24px 0 0;
	padding: 14px 18px;
	border: none;
	border-left: 4px solid;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
	font-size: 14px;
	line-height: 1.8;
}

.wpcf7 form.sent .wpcf7-response-output {
	color: #1f5130;
	background: #edf9f1;
	border-left-color: #4caf50;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
	color: #7a5a00;
	background: #fff9e8;
	border-left-color: #e0b100;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
	color: #7a1f27;
	background: #fff1f2;
	border-left-color: #d64550;
}

/* ラベル */
.wpcf7-checkbox label {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
}

/* spanを基準にする（重要） */
.wpcf7-checkbox label span {
	position: relative;
	padding-top:.2em;
	padding-left: 28px; /* チェック分の余白 */
}

/* input隠す */
.wpcf7-checkbox input[type="checkbox"] {
	display: none;
}

/* 四角 */
.wpcf7-checkbox label span::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
	border: 2px solid #ccc;
	border-radius: 4px;
	background: #fff;
	transition: 0.2s;
}

/* チェック時 */
.wpcf7-checkbox input:checked + span::before {
	background: #4CAF50;
	border-color: #4CAF50;
}

/* チェックマーク */
.wpcf7-checkbox input:checked + span::after {
	content: "";
	position: absolute;
	left: 7px;
	top: 50%;
	transform: translateY(-60%) rotate(45deg);

	width: 6px;
	height: 10px;

	border: solid #fff;
	border-width: 0 2px 2px 0;
}
/* エラー時：チェックボックスの枠 */
.wpcf7 .wpcf7-checkbox.wpcf7-not-valid label span::before {
	border-color: #c62828;
	background: #fff5f5;
}

/* 各項目の下に出るエラー文 */
.wpcf7-not-valid-tip {
	display:none
}
/* エラーの入力欄 */
.wpcf7 input.wpcf7-not-valid,
.wpcf7 textarea.wpcf7-not-valid,
.wpcf7 select.wpcf7-not-valid {
	border-color: #c62828;
	background: #fff8f8;
}
.wpcf7 .wpcf7-checkbox.wpcf7-not-valid label {
	color: #c62828;
}
.wpcf7 .wpcf7-checkbox.wpcf7-not-valid input[type="checkbox"] {
	outline: 2px solid #c62828;
}

@media (min-width: 768px) {

	.tab-contents::after{
		width: 84px;
		height: 84px;
	}
	.modal_slider .slick-prev{left:-12px}
	.modal_slider .slick-next{right:-12px}

}
@media (min-width: 1024px) {
	#global_nav{
		flex-wrap:nowrap;
		padding:0;
	}
	#global_nav > .menu-item{
		width:100%!important;
		padding:0;
	}
	#global_nav .menu_text{
		font-size:.9em;
	}
	#global_nav > .menu-item > a::before{
		width:2em;
		height:2em;
	}
	#global_nav > .menu-item > a:hover::before{
		transform: scale(1.2) rotate(8deg);
	}

	.changeBtn {
		width:						32px;
		height:						32px;
	}

	.langCng{
		font-size:0.9rem;
		height:30px;
		padding:0 28px 0 10px;
		font-size:0.85rem;
		background-position:right 8px center;
	}

	.langCng:hover{
		border-color:#999;
		background-color:#f8f8f8;
	}
	.tab-nav li:hover{
		background:#eaffec;
		color:#0a590e;
	}

	.tab-contents::after{
		right: -1em;
		bottom: -1em;
		width: 128px;
		height: 128px;
	}
	.tab-panel{
		padding:1.4em;
	}

	/* ホバー */
	.faq_summary:hover {
		background: rgb(239,242,239)
	}

	/* 入力系共通 */
	input[type="text"],
	input[type="email"],
	textarea,
	select {
		font-size: 1em;
	}
}
@media (min-width: 1280px) {
	#event_calender{
		height:30vw;
	}
}

@media (min-width: 1440px) {

	.tab-nav{
		margin:0 -1px 0 1px;
	}

}