@charset "UTF-8";

html {
	font-size: 62.5%;
	/* ブラウザ既定16px × 62.5% = 10px → 1rem = 10px */
	/* 
	html,body 以外の個所ではfont-sizeは下記の用にremで指定
	14px = 1.4rem
	15px = 1.5rem
	16px = 1.6rem
	17px = 1.7rem 
	*/
}

:root {
	--color-body: #000;
	--color-primary: #002F7B;
	--color-secondary: #0091DB;
	--color-accent: #CCE9F8;

	--font-serif: "YuMincho", "Yu Mincho", "Hiragino Mincho ProN", "MS PMincho", "Times New Roman", serif;
	--font-yu_gothic: YuGothic, "Noto Sans JP", sans-serif;
	--font-bona: "Bona Nova", serif;
	--font-mincho: "Zen Old Mincho", serif;

	--h3-left-inset: 24px;
}

/* ==================================================== */
.variable-box {
	p {
		&:not(:last-child) {
			margin-bottom: 30px;
		}
	}
}

.flex-box {
	display: flex;
	gap: 50px;

	&.reverse {
		flex-direction: row-reverse;
	}

	.col {
		width: 48.5%;
	}
}

.lead-member {
	background-color: var(--color-accent);
	display: flex;
	align-items: center;
	padding: 20px 50px;

	dt {
		width: 100px;
	}

	dd {
		border-left: solid 1px var(--color-primary);
		flex: 1;
		padding-left: 50px;
	}
}

aside {
	position: fixed;
	right: 0;
	top: 0;
	z-index: 11;
	width: 64px;
	background-color: #fff;
	box-sizing: border-box;

	.contact {
		display: block;
		background-color: var(--color-primary);
		font-size: 1.8rem;
		color: #fff;
		padding: 15px 20px;
		box-sizing: border-box;
		line-height: 1.1;
		text-align: center;

		&:hover {
			text-decoration: none;
			filter: alpha(opacity=60);

			/* IE 6,7*/
			-ms-filter: "alpha(opacity=60)";

			/* IE 8,9 */
			-moz-opacity: 0.6;

			/* FF , Netscape */
			-khtml-opacity: 0.6;

			/* Safari 1.x */
			opacity: 0.6;
			zoom: 1;

			/*IE*/
		}
	}


	.sns {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 24px;
		padding: 24px 10px;
		box-sizing: border-box;

		a {
			line-height: 1;

			&:hover {
				text-decoration: none;
				filter: alpha(opacity=60);

				/* IE 6,7*/
				-ms-filter: "alpha(opacity=60)";

				/* IE 8,9 */
				-moz-opacity: 0.6;

				/* FF , Netscape */
				-khtml-opacity: 0.6;

				/* Safari 1.x */
				opacity: 0.6;
				zoom: 1;

				/*IE*/
			}
		}
	}
}

/* NEWS */
.news-list {
	li {
		&:not(:last-child) {
			margin-bottom: 17px;
		}

		time {
			display: block;
			font-weight: bold;
			color: var(--color-primary);
		}

		.titles {
			font-weight: bold;
		}

		a {
			text-decoration: none !important;

			&:hover {
				filter: alpha(opacity=60);

				/* IE 6,7*/
				-ms-filter: "alpha(opacity=60)";

				/* IE 8,9 */
				-moz-opacity: 0.6;

				/* FF , Netscape */
				-khtml-opacity: 0.6;

				/* Safari 1.x */
				opacity: 0.6;
				zoom: 1;

				/*IE*/
			}
		}
	}
}

.news-singlebox {
	.titles {
		font-size: 150%;
		font-weight: bold;
		color: var(--color-primary);
		margin-bottom: 15px;
		border-bottom: solid 1px var(--color-primary);
	}
}


/* SUBNAV */
#subnav,
#subnav_layer {
	margin-bottom: 50px;

	.no-use {
		a {
			background-color: #ccc !important;
		}
	}

	>span {
		display: inline-block;
		margin-bottom: 35px;
		font-weight: bold;
		font-size: 162.5%;
		/*26px*/
	}

	.subnav-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		gap: 15px 20px;
		padding-bottom: 35px;

		li {

			&.on,
			&.active {
				a {
					background-color: var(--color-primary);
					color: #fff;
				}
			}
		}

		a {
			min-width: 193px;
			display: inline-block;
			padding: 5px 20px;
			text-decoration: none !important;
			box-sizing: border-box;
			text-align: center;
			color: var(--color-primary);
			border: solid 1px var(--color-primary);
			position: relative;

			&:hover {
				opacity: 0.6;
			}

		}
	}
}

/* 共通 PAGINATION用  */
.pagenavi-box {

	text-align: center;

	.wp-pagenavi {
		clear: both;
		text-align: center;
		display: inline-block;
		margin: 50px 0 0;

		a,
		span {
			display: inline-block;
			color: var(--color-primary);
			font-size: 14px;
			text-decoration: none;
			padding: 5px 15px !important;
			border-color: var(--color-primary) !important;
			margin: 2px 5px;
		}

		span.current {
			color: #fff;
			background: var(--color-primary);
		}
	}
}

/* wp-editor */

#content .wp-editer {
	overflow: hidden;

	strong {
		font-weight: bold;
	}

	em {
		font-style: italic;
	}

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

	ul:not([class]) {
		margin-left: 20px;
		list-style: disc;
	}

	ol:not([class]) {
		margin-left: 30px;
		list-style: decimal;
	}

	h1 {
		font-size: 2em;
		font-weight: bold;
	}

	h2 {
		font-size: 1.5em;
		font-weight: bold;
	}

	h3 {
		font-size: 1.17em;
		font-weight: bold;
	}

	h4 {
		font-weight: bold;
	}

	h5 {
		font-size: 0.83em;
		font-weight: bold;
	}

	h6 {
		font-size: 0.67em;
		font-weight: bold;
	}
}

/* EDITOR */

.alignleft,
.alignright,
.aligncenter,
.alignnone {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

blockquote.alignleft,
img.alignleft,
.wp-caption.alignleft,
blockquote.alignright,
img.alignright,
.wp-caption.alignright,
blockquote.aligncenter,
img.aligncenter,
.wp-caption.aligncenter {
	margin-bottom: 10px;
}

@media all and (min-width: 751px) {

	#side-btn {
		position: fixed;
		top: 140px;
		right: 0;
		width: 55px;
		z-index: 115;
		display: flex;
		flex-direction: column;
		align-items: center;
		background-color: #fff;
		overflow: hidden;

		.contact-btn {
			font-size: 112.5%;
			font-weight: bold;
			padding: 20px;
			color: #fff;
			background: $color-secondary;
			display: inline-block;
			box-sizing: border-box;
			line-height: 1.2;
			text-decoration: none !important;
			z-index: 99;

		}

		.fb_icon {
			line-height: 0;
			padding: 7px;

			&::after {
				content: none !important;
			}
		}
	}

	/* INDEX */
}

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

	#side-btn {
		display: none;
	}

	.flex-box {
		flex-direction: column !important;
		align-items: center;
		gap: 20px;

		.col {
			width: 100%;
		}
	}

	aside {
		position: fixed;
		right: 0;
		top: auto;
		bottom: 0;
		z-index: 11;
		width: 64px;
		background-color: #fff;
		box-sizing: border-box;
		width: 100%;

		address {
			display: flex;
			align-items: center;
		}

		.contact {
			width: 50%;
			text-decoration: none !important;
		}


		.sns {
			flex-direction: row;
			gap: 20px;
			padding: 8px 10px;

			a {
				line-height: 1;
			}
		}
	}


	/* INDEX */
	.news-list {
		li {
			&:not(:last-child) {
				margin-bottom: 25px;
			}

			.head {
				flex-direction: column;
				gap: 0px;
			}

			.titles {
				font-weight: bold;
			}

			a {
				/* color: var(--color-primary); */

				&:hover {
					filter: alpha(opacity=60);

					/* IE 6,7*/
					-ms-filter: "alpha(opacity=60)";

					/* IE 8,9 */
					-moz-opacity: 0.6;

					/* FF , Netscape */
					-khtml-opacity: 0.6;

					/* Safari 1.x */
					opacity: 0.6;
					zoom: 1;

					/*IE*/
				}
			}
		}
	}

	.single-news {
		.title {
			font-size: 125%;
		}
	}

	/* -- */
	.lead-member {
		flex-direction: column;
		padding: 20px;

		dt {
			width: 100%;
			text-align: center;
			padding-bottom: 10px;
		}

		dd {
			border-left: none;
			border-top: solid 1px var(--color-primary);
			padding-left: 0px;
			padding-top: 10px;
		}
	}

	/* SUBNAV */
	#subnav,
	#subnav_layer {
		margin-bottom: 50px;

		.subnav-list {
			gap: 10px;
			padding-bottom: 0px;

			li {
				width: 48%;

				&.on,
				&.active {
					a {
						background-color: var(--color-primary);
						color: #fff;
					}
				}
			}

			a {
				min-width: 100%;
				padding: 5px;
				line-height: 1.5;
				min-height: 53px;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
	}


}