@charset "utf-8";
/*
Theme Name: HIBARI NEST
Version: 2022.10.10
*/
/*---------------------------------------------------------
reset
---------------------------------------------------------*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
font-family: 'Noto Sans JP', sans-serif;
font-feature-settings: "palt";
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}
img{
	max-width:100%;
	vertical-align: bottom;
}
_:lang(x)::-internal-media-controls-overlay-cast-button, img {
	image-rendering: -webkit-optimize-contrast;
}
a:hover img {
	opacity: 0.8;
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
}

a.anchor {
	position: relative;
	top: -80px;
	display: block;
}

body {
	background-color: #fff;
	-webkit-text-size-adjust: none;
	font-size: 16px;
	font-weight:300;
	color: #000;
	line-height: 1.8;
}
a {
	color: #000;
	outline: none;
	text-decoration:none;
}
.sp {
	display: none;
}
.container{
	max-width:1600px;
	width:92%;
	margin:auto;
	position:relative;
	z-index:3;
}
h2{
	font-size:40px;
	letter-spacing:0.06em;
	position:relative;
	margin-bottom:2em;
}
h2 span{
	display: table;
	background:#45FFC0;
	padding-right:0.5em;
}
h2 span:not(:first-child){
	margin-top:-0.5em;
}
h2::before{
	content: "";
	width: 110%;
	height: 100%;
	background: #45FFC0;
	position: absolute;
	top: 0;
	left: -100%;
	display: table;
	z-index: -1;
}
h3{
	display: table;
	border-bottom: 2px solid #000;
	font-size: 40px;
	line-height: 1.1;
	margin-bottom:.6em;
}
body.single{
	background-image: linear-gradient(rgba(0,0,0,0.1) 1px, transparent 0),
	linear-gradient(90deg, rgba(0,0,0,0.1) 1px, transparent 0);
	background-size: 20px 20px;
}
/*---------------------------------------------------------
header
---------------------------------------------------------*/
header {
	background:#fff;
	display:flex;
	justify-content:space-between;
	width:100%;
	padding:40px 60px ; 
	position:fixed;
	top:0;
	left:0;
	box-sizing: border-box;
	z-index:1000;
}
header h1{
	width:310px;
	position: relative;
	z-index: 9999;
}
header h1 img{
	vertical-align: top;
}
#toggle{
	width:56px;
	height:32px;
	position:relative;
	z-index:9999;
}
/* ハンバーガーメニューの大きさ指定 */
#toggle-box {
	position: relative;
	width: 100%;
	height: 100%;
	cursor: pointer;
}
#toggle-box > span {
	width: 100%;
	height: 2.75px;
	left: 0;
	right: 0;
	margin: auto;
	display: block;
	display: block;
	background: #000;
	position: absolute;
	transition: transform .3s ease-in-out;
}
#toggle-box > span:nth-child(1) {
	top: 0;
}
#toggle-box > span:nth-child(2) {
	top: 20px;
}
/* ハンバーガーメニュークリックで、「×」マークにアニメーション */
.is-open #toggle-box > span:nth-child(1) {
	top: 35%;
	transform: rotate(45deg);
}
.is-open #toggle-box > span:nth-child(2) {
	top: 35%;
	transform: rotate(-45deg);
}


#nav-content {
	display:block;
	z-index: 10;
	overflow: auto;
	width: 100%;
	height: 100%;
	background: #fff;
	color: #000;
	position: fixed;
	top: 0;
	left: 0;
	transform: translateY(-100%);
	transition:  transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
#nav-content nav {
}
header nav ul{
	margin:30vh 0 0 12.4%;
}
header nav ul li {
	margin:1em 0;
}
#nav-content ul li a{
	display:block;
	font-size:20px;
	text-decoration:none;
}
.is-open {
	overflow: hidden;
}
.is-open #nav-content {
	z-index: 10;
	transform: translateY(0);
}

/*---------------------------------------------------------
mv
---------------------------------------------------------*/
#mv{
	margin-top:120px;
	margin-bottom:120px;
}
/*---------------------------------------------------------
about
---------------------------------------------------------*/
#about .innr{
	max-width:1240px;
	width:84%;
	margin:auto;
}
#about p{
	font-size:20px;
	margin-bottom:4.5em;
}
/*---------------------------------------------------------
facility
---------------------------------------------------------*/
#facility .innr{
	max-width:1410px;
	width:88%;
	margin:auto;
	font-size:21px;
}
#facility figure{
	text-align:center;
	width: 90%;
	margin: 120px auto;
}
#facility h3{
	display:block;
	font-size:36px;
	border:0;
	text-align:center;
	position:relative;
	margin-bottom:60px;
}
#facility h3::before{
	content:"";
	width:100%;
	height:24px;
	background:rgba(219,196,118,0.5);
	position:absolute;
	bottom:-12px;
	left:0;
	z-index:-1;
}
#facility h3.a,#facility h3.b,
#facility h3.c,#facility h3.d{
	margin-bottom:30px;
}
#facility h3.a::before{
	background:rgba(219,196,194,0.5);
}
#facility h3.b::before{
	background:rgba(213,164,180,0.5);
}
#facility h3.c::before{
	background:rgba(155,188,203,0.35);
}
#facility h3.d::before{
	background:rgba(169,186,92,0.5);
}
#facility p{
	font-size:17px;
	margin-bottom:4.5em;
}
#facility ul{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	margin-bottom:30px;
}
#facility ul li{
	width:48%;
	padding:25px 32px;
	margin-bottom:30px;
	border:2px solid #000;
	box-sizing:border-box;
}
#facility ul.room li,
#facility ul.sdgs li{
	border:0;
}
#facility ul li p{
	margin-top: 0.5em;
	margin-bottom:0;
}
#facility ul li strong{
	font-size:34px;
	font-weight:400;
}
#facility ul li span{
	font-size:24px;
	font-weight:400;
	margin-left:2em;
}
#facility b{
	font-weight:400;
}
#facility hr{
	height:2px;
	border:0;
	background:#000;
	margin-bottom:64px;
}
.sdgs h4{
	display:table;
	border-bottom:2px solid #000;
	font-size:40px;
	line-height: 1.1;
	margin-bottom:1em;
}
/*---------------------------------------------------------
feature
---------------------------------------------------------*/
#feature .innr{
	max-width:1410px;
	width:88%;
	margin:auto;
	font-size:21px;
}
#feature p{
	font-size:20px;
	margin-bottom:4.5em;
}

/*---------------------------------------------------------
kind
---------------------------------------------------------*/
#kind{
	margin-bottom:100px;
}
.kado{
	display:table;
	padding:0 50px;
	margin:0 auto 50px;
	position:relative;
}
.kado::before, .kado::after {
	content: '';
	width: 15px;
	height: 100%;
	position: absolute;
}

.kado::before {
	border-left: solid 2px #000000;
	border-top: solid 2px #000000;
	border-bottom: solid 2px #000000;
	top: 0;
	left: 0;
}

.kado::after {
	border-right: solid 2px #000000;
	border-top: solid 2px #000000;
	border-bottom: solid 2px #000000;
	top: 0;
	right: 0;
}
#kind strong{
	display:table;
	font-size:40px;
	margin:auto;
}
/*---------------------------------------------------------
school
---------------------------------------------------------*/
#school .innr{
	max-width:1410px;
	width:88%;
	margin:auto;
	font-size:21px;
}
#school p{
	font-size:20px;
	margin-bottom:4.5em;
}
/*---------------------------------------------------------
system
---------------------------------------------------------*/
#system {
	margin-bottom:150px;
}
#system h4{
	font-size:34px;
	font-weight:500;
}
#system ul{
	display:flex;
	justify-content:space-between;
}
#system ul li{
	width:48%;
}
#system dl{
	display:flex;
	background:#4d4d4d;
	border:1px solid #4d4d4d;
	font-size:25px;
	text-align: center;
	margin-bottom:5px;
}
#system dt{
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
	line-height: 1.2;
	width: 50%;
	padding: 0.5em 0;
}
#system dt small{
	font-size:15px;
}
#system dd{
	display:flex;
	align-items:center;
	justify-content:center;
	background:#fff;
	width:50%;
}
/*---------------------------------------------------------
news
---------------------------------------------------------*/
#news{
	margin-bottom:150px;
}
#news .noinfo{
	font-size:26px;
	text-align:center;
	margin:150px auto;
}
#posts{
	display:flex;
	flex-wrap:wrap;
}
#posts .post{
	width:48%;
}
#posts .post{
	margin-bottom:3rem;
}
#posts .post:nth-child(odd){
	margin-right:4%;
}
#posts .post h3 a{
	font-size:30px;
	text-decoration:none;
}
/*---------------------------------------------------------
contact
---------------------------------------------------------*/
.form_wrap{
	max-width:840px;
	margin:auto;
	font-size:20px;
}
.form_wrap small{
	font-size:.8em;
}
.form_wrap span{
	display:block;
	position:relative;
}
.form_wrap span::before{
	content:"※";
	position:absolute;
	left:-1em;
	top:0;
}
.form_wrap input[type=text],
.form_wrap input[type=email],
.form_wrap textarea{
	width:100%;
	border:1px solid #000;
	font-size:20px;
	padding: 0.5em;
	box-sizing:border-box;
}
.form_wrap ul li{
	margin-bottom:30px;
}
.form_wrap span.mwform-checkbox-field-text{
	display:inline-block;
	font-weight:300;
}
.form_wrap span.mwform-checkbox-field-text::before,
.form_wrap span.mwform-checkbox-field::before,
.form_wrap span.error::before{
	display:none;
}
.form_wrap a{
	color:#0071bc;
	text-decoration:underline;
}
form div{
	text-align:center;
}
.form_wrap input[type=submit]{
	display:table;
	background:#000;
	color:#fff;
	font-size:20px;
	font-weight:400;
	text-align:center;
	padding:0.3em 2em;
	margin:2em auto;
	border:0;
	cursor:pointer;
}
/*---------------------------------------------------------
access
---------------------------------------------------------*/
#access .container{
	max-width:1432px;
	font-size:24px;
}
#access iframe{
	aspect-ratio:9 / 5;
	width:100%;
	height:100%;
}
/*---------------------------------------------------------
archive
---------------------------------------------------------*/
#topicslist{
	min-height:100vh;
	margin-top:180px;
}
ul.categories{
	display:flex;
	flex-wrap:wrap;
	margin-bottom:40px;
}
ul.categories li{
	border:1px solid #707070;
	font-size:18px;
	letter-spacing:0.08em;
	width:calc(100% / 5);
	height:45px;
	box-sizing: border-box;
	margin-left:-1px;
}
ul.categories li:first-child,
ul.categories li:nth-child(5n + 1){
	margin-left:0;
}
ul.categories li:nth-child(n +6){
	margin-top:-1px;
}
ul.categories li a{
	display:block;
	text-align:center;
	line-height:43px;
}
ul.categories li.now{
	background:#000;

}
ul.categories li.now a{
	color:#fff;
}
.pagination{
	margin:auto;
}
.page-numbers{
	display:flex;
	justify-content:center;
	align-items:center;
}
.page-numbers li{
	margin:0 0.5em;
}
.page-numbers img{
	width:12px;
}
.page-numbers a{
	color:#98A6B5;
	font-size:18px;
	font-weight:500;
}
.page-numbers .current{
	color:#000;
	font-weight:500;
}
/*---------------------------------------------------------
single
---------------------------------------------------------*/
article{
	font-size:18px;
}
article .content{
	margin-bottom:180px;
}
article .cat a{
	font-size:22px;
	margin-bottom:1em;
}
article h2{
	font-size:32px;
	font-weight:600;
	margin-bottom:1em;
}
.pagenate{
	display:flex;
	justify-content:center;
	align-items:center;
}
.pagenate li a{
	display:flex;
	margin:0 25px;
}
.pagenate img{
	width:12px;
}
.pagenate li.all a{
	display:block;
	font-size:18px;
	line-height: 43px;
	width:200px;
	height:45px;
	border:1px solid #000;
	box-sizing:border-box;
	text-align:center;
}

/*---------------------------------------------------------
footer
---------------------------------------------------------*/

footer {
	width: 100%;
	background: #ccc;
	font-size: 15px;
	font-weight: 300;
	padding:55px 100px 20px;
	margin-top: 140px;
	box-sizing:border-box;
}
footer h1{
	margin-bottom:20px;
}
footer .sign{
	font-size:12px;
	text-align:right;
}
footer .sign small{
	margin-right:4em;
}
#page_top{
	width: 38px;
	height: 38px;
	position: fixed;
	right: 36px;
	bottom: -100px;
	z-index:9999;
}

/*---------------------------------------------------------
Mobile
---------------------------------------------------------*/


/*Media Queries*/

@media screen and (max-width: 767px) {
	html:before,html:after,body:before,body:after{
		display:none;
	}
	body, html {
		min-width: 100%;
	}
	body {
		font-size: 15px;
	}
	img {
		max-width: 100%;
	}
	img.sp {
		width: 100%;
	}
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	header {
		display:flex;
		justify-content:space-between;
		align-items:center;
		width: 100%;
		height:60px;
		padding:0 15px 0 30px;
		box-sizing:border-box;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 999;
	}
	header h1{
		z-index:999;
	}
	#toggle{
		margin-top: unset;
	}

	#fv{
		padding: 10vh 0 10vh;
	}
	.slick-next:before,.slick-prev:before{
		width:30px;
	}
	.slick-prev {
		left: 4%;
	}
	.slick-next {
		right: 4%;
	}
	#slide {
		margin-bottom: 100px;
	}
	#topics h2 {
		font-size: 24px;
		margin-bottom: 60px;
	}
	.ttl {
		margin-bottom: 40px;
	}
	#posts .post {
		width: 100%;
		margin-bottom: 20px;
	}
	#posts .post:nth-child(3n-1){
		margin:0 0 20px;
	}
	#company {
		padding-top: 85px;
	}
	#topicslist {
		margin-top: 90px;
	}
	ul.categories li{
		width:100%;
		margin-left:0;
	}
	#posts{
		justify-content:space-between;
	}
	#posts .post{
		width:49%;
	}
	#posts figure{
		height:120px;
	}
	.post h3,article .cat a{
		font-size:16px;
	}
	article h2 {
		font-size: 20px;
	}
	article .txt p{
		font-size:16px;
	}
	footer{
		margin-top:80px;
	}
	#page_top {
		width: 32px;
		height: 32px;
		right: 15px;
	}
}