@charset "UTF-8";
@import url(//use.fontawesome.com/releases/v5.7.2/css/all.css);
@import url('https://fonts.googleapis.com/css2?family=DotGothic16&family=Kosugi+Maru&display=swap');

:root{
	--main-color: #D9CFFF;
	--accent-color: #46bb46;
	--accent-2-color: #faf094;
	--base-color:#fff;
	--black:#202020;
	--dark-main-color: #264e23;
	--text-bright-color: #FFF;
	--max-large-width:1280px;
	--large-width: 1024px;
	--icon-color:#FFF;
	--icon-bk-color:#b10000;
	--gray-color:#ddd;
	--middle-width: 768px;
	--small-width: 500px;
}
@media (max-width:599px){
	:root{
		font-size: 14px;
	}
}
@media (min-width:600px){
	:root{
		font-size: 16px;
	}
}


body{
	color: #FFF;
	margin: 0;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 14px;
	background-color:#46bb46;
	overflow-x: hidden;
}
p {
    font-size: 1rem;
}
h1{
	font-size: 1.5rem;
	font-weight: 600;
}
h2{
	font-size: 1.375rem;
	font-weight: 600;
}
h3{
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0;
}
h4{
	font-size: 1.125rem;
	font-weight: 700;
	/*font-family: 'Zen Kaku Gothic New', sans-serif;*/
}
/*========= レイアウトのためのCSS ===============*/
.br{
	display: none;
}
.donot{
	display: none;
}
.main-content{
	margin-top: 15%;
	}
    ul{
    margin:0;
    padding: 0;
    list-style: none;
    }

    
    a:hover,
    a:active{
    text-decoration: none;
    }


header{
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
}


.headA{
	display: inline-block;
	padding-left: 20px;
	padding-right: 20px;
	font-size: 24px;
	text-decoration: none;
	background-color:#FFF;
	background-color: var(--base-color);
}

.logo{
position: absolute;
z-index: 2;
top: 5px;
left: 0;
text-transform: uppercase;
margin-left: 40px;   
}
.logo img{
width: 100px;  
	}
.top{
	display: flex;
}
.bx-wrapper {
margin: 0;
}
.headB{
position: absolute;
bottom: 20%;
right: 0;
display: flex;
margin: 0;
}

.headB .menu-item {
	display: flex;
	height: 100%;
	/* メニューテキスト位置をリスト内中心に */
	align-items: center;
	text-align: right;
	background-color: rgb(255, 255, 255, 0.3);
	}

.li{
	text-align: center;
	
}

.headB ul{
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100vw;
    justify-content: center;
}
.headB a{
	display: block;
	padding: 15px 0px;
	color: inherit;/*プロパティの値を親要素から取得*/
	font-size: clamp(0.7rem, 0.585rem + 0.35vw, 0.9rem);
	text-decoration: none;/*テキストの下線を消去*/
	white-space: nowrap;
	width: 100%;
	box-sizing: border-box;
	font-weight: 400;
    line-height: 1.5;
}

.headB .menu-item {
	position: relative;
	width: clamp(5vw, 10vw, 10vw);
	z-index: 1;
	padding: 0;
	color: #fff;
	text-align: center;
	color: var(--base-color);
	background: #46bb46;
	background: var(--accent-color);
  }
  .headB .menu-item::before {
	background: #fff;
	background: var(--base-color);
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	margin: auto;
	transform: scale(1, 0);
	transform-origin:right bottom;
	transition: transform .3s;
	z-index: -1;
  }
  .headB .menu-item:hover {
	color: #000;
	color: var(--dark-main-color);
  }
  .headB .menu-item:hover::before {
	transform-origin: center top;
	transform: scale(1, 1);
  }
  .headB .sub-menu {
    display: block;
}


/*========= スクロールカラーチェンジのCSS ===============*/

  .headerchange-color .headB .menu-item{
	color: #000000;
	color: var(--black);
  	background-color: #fff;
	background-color: var(--base-color);
	transition: 0.3s;
	opacity: 1;
  }
  .headerchange-color .headB .menu-item::before{
	background: #46bb46;
  background: var(--accent-color);
  transition: 0.3s;
  }
  .headerchange-color .headB .menu-item:hover{
	color: #fff;
	color: var(--base-color);
	transition: 0.3s;
	opacity: 1;
  }
  .headerchange-color .site-title a {
	color: #000000;
	color: var(--black);
	transition: 0.3s;
	opacity: 1;
	}
	.headerchange-color .menu-toggle{
		color: #000000;
		color: var(--black);
		transition: 0.3s;
		opacity: 1;
		}

/*====================================================*/

    
	.mainimages .text{
	position: absolute;
    z-index: 4;
    top: 50%;
	left: 0;
	transform: translate(0,-50%);
    /*transform: translate(-50%, -50%);*/
	/*基準点を真ん中に 横 縦*/
    text-align: center;
	margin-left: 30px;
    color: #2a9ee2b6;
	font-weight: bold;
	-webkit-text-stroke: .3px #fff;
	
	}
	.mainimages svg{
		width: 100%;
		height: auto;
		overflow: visible;
	  }
	  text {
		fill: #2a9ee2b6;
		stroke: #FFF;
		stroke-width: .5;
        stroke-linecap: round;
        stroke-linejoin: round;
		letter-spacing: 0.1em;
		font-family: 'Yusei Magic', sans-serif;
	  }
	  .viewtitle text .cls-1{
		font-size: 5rem;
	  }
	  .viewtitle text .cls-2{
		font-size: 2rem;
		stroke-width: .3;
	  }
	  .viewsubtitle text {
		display: none;
		font-size:10px;
	  }


	.waku img{
		position: absolute;
		width: 100%;
		z-index: 2;
		top: 0;
		}
		
	img.wakugumi{
		position: absolute;
		width: 100vw;
		height: 100svh;
		z-index: 2;
		top: 0;
		}
	svg.wakugumi{
		position: absolute;
		width: 100vw;
		height: 100svh;
		z-index: 2;
		top: 0;
	}
	svg.wakugumi tspan{
		fill:#FFFFFF; 
		font-family:'Kosugi Maru', sans-serif; 		
		font-family: 'DotGothic16', sans-serif;
		font-size:3em;
	}
	.neon-sign {
		--interval: 1s;
		display: block;
		text-shadow: 
		  0 0 10px yellow,
		  0 0 20px rgb(0, 224, 37),
		  0 0 40px green,
		  0 0 80px darkgreen;
		will-change: filter, color;
		filter: saturate(60%);
		animation: flicker steps(100) var(--interval) 1s infinite;
	  }
	@keyframes flicker {
		50% {
		  color: white;
		  filter: saturate(200%) hue-rotate(20deg);
		}
	  }

	.bookmark{
	position:absolute;
	z-index: 4;
    top: 50%;
	right: 5%;
	transition: .5s;
	}
	.bookmark:hover{
		transform: rotate(-15deg);
		transition: 0.5s;
	}
	  
	.bookmark:active {
		opacity: 0.5;
	}
	.pressBT{
		position:absolute;
		z-index: 4;
		bottom: 25%;
		left: 0;
	}
	.pressBT a.btn_04{
		position:static;
		border-radius: 0 100svh 100svh 0;
		border-left: none;
		padding: 1rem 1.3rem;
		font-size: 1.3rem;
	}

	.circle{
	position: relative;
	display: inline-block;
	z-index: 4;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	background-color: #2a9ee2b6;
	box-shadow: 0px 0px 20px rgb(107 235 255 / 46%);
	transition: .5s;

    background-image: linear-gradient(135deg, #abf377 0%, #24b8ff 100%);
    box-shadow: 0 20px 30px -6px rgb(87 197 249 / 50%);
	}
	.bookmark:hover .circle{
		box-shadow: none;
	}

	.circle span{
	position: absolute;
	display: inline-block;
	left: 0;
	z-index: 1;
	top: 50%;
	--webkit-transform: translateY(-45%) rotate(10deg);
	transform: translateY(-45%) rotate(10deg);
	width: 100%;
	color: #ffffff;
	color: var(--icon-color);
	font-size: 1.2rem;
	text-align: center;
	text-decoration: none;
	margin: auto;
	}
	.circle::after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	  
		background-color: rgba(255, 255, 255, 0.253);
		filter: blur(15px);
		transform: scale(1.05);
		/* ④乗算で重ねる */
		mix-blend-mode: multiply;
		border-radius: 50%;
	}
	.circle::before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border: 2px dotted;
		transform: scale(1.15);
		z-index: 9;
		border-radius: 50%;
	}

    
    .wrapper{
    position: relative;
    }
	.slide{
	position: relative;
	}
	
	.waku{
    z-index: 3;
	top: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	position: relative;
	}

	.banner{
		display: flex;
		width: 100%;
		margin: auto;
		text-align: center;
	}
	.banner img{
		width: 100%;
		height: 100%;
	}


	.con1{
		background-color: #46bb46;
		background-color: var(--accent-color);
		color: #FFF;
		color: var(--base-color);
	}

	.con1 .main-container{
		padding-top: 30px;
		padding-bottom: 30px;
		
	}

	.flexbox{
		display: flex;
		text-align: center;
		align-items: center;
		justify-content: center;
		border-radius: 50px;
		background-color: #dddddd33;
	}


	.midasi{
		text-align: center;
		font-size: 1.5em;
		margin: 25px 10px;
	}

	.midasi h1{
		margin: 0;
	}

	.midasi .icon{
		display: inline-block;
		font-size: 60px;
		width: 2em;
		text-align: center;
		color: #FFF;
		color: var(--icon-color);
	}

	.title-sinple{
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 40px 10px 0px 10px;
		margin-top: 5svh;
	}
	.title-sinple h2{
		padding: 30px 10px;
		border:  dashed 2px;
	}

	
	.naiyou{
		margin: 40px;
		font-size: 1rem;
		flex: 2;
	}

	.photo img{
		width: max-content;
		height: auto;
	}
	.con2{
		background-color: #FFF;
		background-color: var(--base-color);
		color: rgb(0, 0, 0);
		color: var(--dark-main-color);
	}

	.con2 h2{
		font-weight: bold;
	}
	.con2 .photo{
		display: flex;
		justify-content: center;
		padding: 10px 0px;
		letter-spacing: 1rem;
		flex: 1;
	}

	.con2 .text{
		width: 100%;
		padding: 20px;
	}

	.con2 p{
		margin-top: 0;
		margin-bottom: 20px;
		font-size: 1rem;
		line-height: 1.8;
	}

	.kaigyou{
		padding-left: 2.5em;
	}
    .t-box{
		margin: 30px 0px;
		border: dotted 2px #3f3f3f;
		padding: 20px;
		word-spacing: 1em;
	}
	.naiyou h2{
		margin-bottom: 10px;
	}
	

	.title{
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 40px 50px 30px 50px;
	}
	.title h2{
		background-color: #f8f8f8;
		white-space: nowrap;
		padding: 30px 100px;
		box-shadow: 5px 5px 10px 0 var(--accent-color);
		text-align: center;
		margin: 20px 0;
	}
	.title h2::after {
		/* 疑似要素で同じ大きさのboxを作り、position: absoluteで背面に表示 */
		content: '';
		display: block;
		position: absolute;
		z-index: -1;
		top: 0;
		left: 0;
	  
		/* ①疑似要素のボックスを影色で塗りつぶし */
	
		/* ②ブラーフィルターでぼかす */
		filter: blur(15px);
		/* ③位置やサイズを調整 */
		transform: translateY(10px) scale(1.05);
		/* ④乗算で重ねる */
		mix-blend-mode: multiply;
	  }
	  a.btn_04{
		text-align: center;
    vertical-align: middle;
    text-decoration: none;
    width: fit-content;
    margin: auto;
    padding: .5rem 1rem;
    font-weight: bold;
    border: 2px solid var(--accent-color);
	border-color: var(--accent-color) !important;
    color: var(--dark-main-color);
    background-color: #fff;
    border-radius: 100svh;
    transition: 0.5s;
    font-size: 1rem;
    position: absolute;
	right: 20px;
    bottom: 0;
	  }
	  a.btn_04.stand{
		position: relative;
	  }
	  a.btn_04:hover,a.btn_04.stand:hover{
		color: #fff!important;
		background: var(--accent-color);
		border-color: var(--accent-2-color)!important;
	}
	
	.flex.inbtn{
		flex-flow: column;
	}
	
	@media (max-width: 767px){
	a.btn_04{
	padding: 1rem 2rem;
	}
	.single a.btn_04 {
		margin-top: 0px;
		margin-bottom: 20px;
	}
	
	}
	@media (max-width: 1280px){
	a.btn_04 {
			position: static;
			margin-top: 30px;
		}
	}

		.listA{
		background-color: #fff;
		background-color: var(--base-color);
		}

		.listA .text{
		color: rgb(0, 0, 0);
		text-decoration: none;
		}
		.text h2{
			margin-bottom: 15px;	
		}
		
		.listA .main-container{
			display: flex;
			flex-wrap: wrap;
			max-width: 1000px;
			max-width: var(--large-width);
			margin: 30px auto;
			margin-top: 0;
		}
		.listA article{
			flex: 1 1 300px;
			display: flex;
			align-items: stretch;
			flex-wrap: wrap;
		}
		
		.listA .listdiv{
			display: flex;
			justify-content: center;
			margin: 10px;
			border: solid 1px #ddd;
			border: solid 1px var(--gray-color);
			color: inherit;
			text-decoration: none;
			flex: 1 1 500px;
		}
		.listA .listdiv#allarticle{
			flex-wrap: nowrap;
			flex: auto;
		}
		.listA a:hover{
			opacity: 0.8;
		}
		.listA .text{
			margin: 10px;
		}
		.con2 #planetext {
			min-height: 200px;
		}
	


	.con3{
		background-color: #FFF;
		background-color: var(--base-color);
	}

	.con3 .main-container{
		padding-top: 80px;
		padding-bottom: 20px;
	}

	.con3 .text{
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 60px;
		text-align: center;
	}
	
	.con3 .icon{
		display: inline-block;
		margin-bottom: 20px;
		font-size: 40px;
		width: 2em;
		line-height: 2em;
		border-radius: 50%;
		text-align: center;
		background-color: #46bb46;
		background-color: var(--accent-color);
		color: #FFF;
		color: var(--icon-color);
	}
	.con3 .icon:hover{
		background-color: #fff;
		background-color: var(--icon-color);
		color: #2d8326;
		color: var(--accent-color);
	}

	.icontext a{
		transition: all 1s;
		text-decoration: none;
	}
	.text a:hover{
	transform: scale(1.05);
	}
	.icontext h2{
		color: #2d8326;
		color: var(--accent-color);
		font-weight: bold;
	}
	.icontext {
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 60px;
		text-align: center;
		
	}
	

	.member-list{
		margin: 40px;
	}
	.member-list li{
		list-style-type: none;
		padding: 35px 10px;
		font-size: 1.1rem;
	}
	.con2 .member-list p{
		margin: 40px;
		font-size: 1.2em;
	}

	.con4 .t-box{
		margin:20px;
		width: 80%;
		
	}
	.con4 h2{
		margin-bottom: 10px;
	}

	.calender{
		margin: 20px;
		flex: 1;
	}
	.columns{
		flex: 1;
	}
	.con2 #planetext a{
		color: inherit;
		color: var(--accent-color);
		border-bottom: solid 2px;
	}
	.con2 #planetext a:not(:first-of-type){
		margin-left: 10px;
	}
	.con2 #planetext a:has(img){
		margin-left: 0px!important;
	}
	.con2 #planetext:has(a img)  {
		position: relative;
	}
	.con2 #planetext a img{
		border: 1px solid #000;
	}
	.con2 #planetext a:hover {
		/* color: var(--accent-2-color); */
		opacity: .5;
	}
	.con2 #planetext:has(a img):before {
		content: "資料・画像をクリックしてプレビュー";
		font-size: 0.8rem;
		border-bottom: 1px dotted;
	}

	div.pdfemb-toolbar div {
		font-size: 1rem !important;
	}
	
  /*========= レイアウトのためのCSS ===============*/
  .box{
    width: 100%;
	padding: 20px;
    background: #ffffff ;
	background: var(--base-color);
    box-sizing:border-box;
  }

.flex{
    display:flex;
    flex-wrap: wrap;
	justify-content: center;
	padding: 0;
	margin: 0;
 }
.block{
    display:block;
	width: 100%;
	justify-content: center;
	padding: 0;
	margin: 0;
 }

.container{
    display: inline-block;
    vertical-align: middle;
    max-width: 1000px;
	max-width: var(--large-width);
	margin-left: auto;
	margin-right: auto;
}

.facebook_wrap{
	margin-left: auto;
	margin-right: auto;
	width: 100%;
  }
   
.fb-page,
.fb-page span,
.facebook_wrap iframe{
	width: 100% !important;
	height: 500px !important;
  }
.sns{
	background-color: #FFF;
	margin: 0;
	padding: 30px 0;
	
}
.sns .main-container{
	display: flex;
	justify-content: center;
	text-align:center;
	background-color: #FFF;
	margin-top: 50px;
	}

/*.sns img{
	display: flex;
	width: auto;
    height: 300px;
	align-self: flex-end;
	}*/

footer{
	color: #FFF;
	color: var(--base-color);
	background-color: #264e23;
	background-color: var(--dark-main-color);
}
.footer{
	color: #FFF;
	color: var(--base-color);
	background-color: #264e23;
	background-color: var(--dark-main-color);
}

footer .main-container{
	padding: 40px 20px;
}
.sidebar-footA{
	margin-bottom: 30px;
	display: block;
}
.footA{
	margin-bottom: 30px;
	display: block;
}

.footA h2{
	margin-top: 0;
	margin-bottom: 10px;
	font-size: 30px;
	letter-spacing: 0.2em;
    margin-block-start: 0;
    margin-block-end: 0;
	margin-bottom: 10px;
}
.footA p{
	margin-top: 0;
	margin-bottom: 0;
	font-size: 14px;
}
.footA a{
	color: inherit;
	text-decoration: none;
}

.sidebar-footB div{
	margin-bottom: 20px;
}

.footer-widget h2.widget-title{
	margin-top: 0;
	margin-bottom: 10px;
	border-bottom: solid 1px currentColor;/*solid=実線 currentColor=文字と同じ色*/
    font-size: 20px;
    line-height: 1.4;
}

.sidebar-footB h2{
	margin-top: 0;
	margin-bottom: 10px;
	border-bottom: solid 1px currentColor;/*solid=実線 currentColor=文字と同じ色*/
}
.footB ul{
	margin: 0;
	padding: 0;
	list-style: none;
}
.footB a{
	display: grid;
	padding: 5px;
	color: inherit;
	font-size: 12px;
	text-decoration: none;
	
}
.footB p{
	margin-bottom: 10px;
}
.footB a:hover{
	background-color: rgba(0, 0, 0, 0.302);
}


.site-info{
	font-size: 0.7rem;
	text-align: center;
	font-family: 'Courier New', Courier, monospace;
}
.site-name{
	margin-top: 0;
	margin-bottom: 10px;
	font-size: 2rem;
	letter-spacing: 0.1em;
    margin-block-start: 0;
    margin-block-end: 0;
	margin-bottom: 10px;
}
/* tab lists */

/*========= タブメニューのためのCSS ===============*/
/*tabの形状*/

@media (min-width: 1024px){
	.main-container#tab {
	  justify-content: flex-start;
	}
	.tab{
	margin-top: 30px;
	}
	}

	.tab{
	  display: flex;
	  flex-wrap: wrap;
	  color: #000;
	}
	.tab,#tab{
		width: 100%;
	  }

	.tab li{
	  display: block;
	  flex: 1;
	  text-align: center;
	  background:#ddd;
	  font-size: 1rem;
	  display: flex;
	  align-items: center;
	  border: solid 0.5px #cbcbcb;
	  border-bottom: none;
	  letter-spacing: .15em;
	}
	.tab li:not(:last-of-type){
		border-right: none;
	}
	.tab li a{
	  display: block;
      width: 100%;
	  padding:10px 20px;
	}
	/*liにactiveクラスがついた時の形状*/
	.tab li.active{
	  background:#ffffff;
	  border: solid .5px var(--base-color);
	  border-bottom: none;
	}
	
	
	/*エリアの表示非表示と形状*/
	.area {
	  display: none;/*はじめは非表示*/
	  opacity: 0;/*透過0*/
	  background: #fff;
	  padding:50px 20px;
	  padding-top: 0;
	}
	
	/*areaにis-activeというクラスがついた時の形状*/
	.area.is-active {
		display: block;/*表示*/
		animation-name: displayAnime;/*ふわっと表示させるためのアニメーション*/
		animation-duration: 1s;
		animation-fill-mode: forwards;
	}
	@keyframes displayAnime{
		from {
		  opacity: 0;
		}
		to {
		  opacity: 1;
		}
	  }
	  
	  .area h2{
		position: relative;
		font-size:1.3rem;
		margin:0 0 20px 10px;
	  }

	.listdiv .text h2:after {
		content: "＿詳細はこちらをクリック";
		font-size: .9rem;
		margin-left: 10px;
		font-weight: 400;
		display: inline-block;
		color: var(--dark-main-color);
	}
	  
	  .area li{
		padding: 10px; 
	  }


.gnavi-list {
    background-color: #E5F0F8;
    position: relative;
    transition: all .3s;
}
.gnavi-list:hover {
    background-color: #264e23;
	color: #fff;
}
.gnavi-list:not(:first-child)::before {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0;
}
.gnavi-list:hover::before {
    background-color: #264e23;
}
.gnavi-list a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: #1b4059;
    font-size: 15px;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.dropdown-lists {
    display: none;/*デフォルトでは非表示の状態にしておく*/
    width: fit-content;
    position: absolute;
    top: 46px;
    left: 0;
	margin: 0;
	transition: all .3s;
}
.gnavi-list.active .dropdown-lists{
	display: block;
	transition: all .3s;
}
li.dropdown-list,li.dropdown-list-child {
    background-color: #264e23;
    height: 60px;
    transition: all .3s;
    position: relative;
	width: max-content;
    margin: 0;
}
.dropdown-list:not(:first-child)::before,.dropdown-list-child:not(:first-child)::before{
    content: "";
    width: 100%;
    height: 1px;
    background-color: #46bb46;
    position: absolute;
    top: 0;
    left: 0;
}
.dropdown-list:hover,.dropdown-list-child:hover {
    background-color: #46bb46;
}
.dropdown-list a,.dropdown-list-child a {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    text-decoration: none;
    position: relative;
	background-color: #fff0!important;
}
.dropdown-list a::before,.dropdown-list-child a::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    transform: rotate(135deg);
    position: absolute;
    left: -10px;
    top: calc(50% - 3px);
}


   
div[id^="m_"] .title{
	flex: 1;
    display: flex;
    padding: 0;
    margin: 0 20px 30px 0;
}

div[id^="m_"]{
	display: flex;
	flex-wrap: wrap;
	margin: 0 -1rem;         /* p-img-card の paddingと同じ */
}
div[id^="m_"] .naiyou {
    display: flex;
    margin: 0;
    font-size: 1em;
	flex-wrap: wrap;
}
div[id^="m_"] a{
	display: block;
	width: 33.3%;
	padding: 1rem;          /* 隙間の太さになる */
	margin-bottom: 2rem;    /* 下側の隙間の太さ */

	position: relative;
	overflow: hidden;
	cursor: pointer;
}
div[id^="m_"] a h4{
	position: absolute;
    bottom: 0;
    font-size: 1rem;
	font-weight: 400;
    left: 0;
    width: 100%;
    text-align: center;
    background-color: #ffffffbd;
    padding: 0 10px;
}
div[id^="m_"] a::before{
	content: '';
	display: block;
	padding-top: 100%;      /*正方形にするおまじない*/
}
div[id^="m_"] a:hover img{
	transform: scale(1.2);
	transition: transform 0.5s;
	animation: min-and-big 3s;
}
.member_item_one{
	display: block;
	width: calc(100% - 2rem);  /* カードのラッパーは隙間paddingの分だけ小さくする */
	height: calc(100% - 2rem); /* カードのラッパーは隙間paddingの分だけ小さくする */
	position: absolute;
	top: 1rem;/* 位置もカードのpaddingの分だけ下げる */
	overflow: hidden;
	border-radius: 35px;
	box-shadow: 0px 0px 8px -3px rgba(0, 0, 0, 0.6);
}

.member_item_one img{
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transform: scale(1);
	transition: transform 0.5s;
}
article[class*="members"] .entry-thumbnail{
	display: none;
}
article[class*="members"] a,article[class*="members"] iframe{
	display: block;
    width: 50%;
	padding: 0 10px;
}
article[class*="members"] .text{
	display: flex;
}
article[class*="members"] a:hover img{
	transform: scale(1)!important;
	animation: none;
}


.movie {
    display: flex;
    overflow-x: scroll;
}


.movie iframe{
	width: calc(100% / 3.1);
}

/* widget lists */

.widget ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.button-custom{
	background-color: #46bb46;
	margin: 10px auto;
	padding: 20px;
	border-radius: 10px;
	text-align: center;
	max-width: 200px;
}
.button-custom:hover{
background-color: #264e23;
transition: all 0.6s;
}
.button-custom span{
	color: #ffffff;
}

/* comment lists */
.sns iframe {
    height: 750px;
    margin: auto;
}
.sns #activity{
    padding: 0 20px;
}
.attachment_post_thumbnail{
	width: 100%;
    height: 100%;
    display: flex;
    background-color: #264e23;
    justify-content: center;
    align-items: center;
}
.attachment_post_thumbnail .fa-solid{
	color: #ffffff;
	font-size: 2rem;
}
.logged-in-as{
	display: none;
}
.comment-form-comment label{
	display: none;
}

  .tw-comment-window-page {
	min-width: unset; /* 表示幅の最低値(320px)を無効化 */
  }
  .tw-comment-window-page article{
    height: 750px;
    overflow-y: scroll;
  }
  .tw-comment-window-page article::-webkit-scrollbar{
	width: 5px;
 }
 .tw-comment-window-page article::-webkit-scrollbar-track{
	background-color: #ccc;
	border-radius: 10px;
 }
 .tw-comment-window-page article::-webkit-scrollbar-thumb{
	background-color: #264e23;
	border-radius: 10px;
 }

  .tw-comment-list-view__scroller {
	overflow: visible !important; /* 水平スクロールバーを表示させない設定 */
  }
  .tw-comment-window-page {
	padding: 0 !important;
	width: -webkit-fill-available;
  }
  
  @keyframes entry { /* アニメーションのフレーム設定 */
	 0% { left: 100%; max-height:   0px; opacity: 0.0; }
	96% { left: -5%; max-height:   50px; opacity: 0.8; }
	98% { left: 0%;  max-height:  300px; opacity: 0.9; }
   100% { left: 0%;  max-height: 1000px; opacity: 1.0; }
  }
  .tw-comment-list-view__scroller >div {
	padding-left: 5%;
  }
  .tw-comment-item {
	width: 100%;
	background-color: #ffffff !important; /* 背景色 */
	padding: 3px 0 !important;
	/* アニメーション用の設定 */
	animation-name: entry;
	animation-duration: 1s;  
	animation-fill-mode: both;
	animation-timing-function: ease-out;
	max-height: 0px;
	display: flex;
  }
  .tw-comment-item:not(:first-child) {
	border-top: 1px solid #536471; /* 区切り線 */
  }
  .tw-comment-item-comment br {
	display: block !important; /* コメント内の改行の有効化 */  
  }
  .tw-comment-item-body {
	text-shadow:none !important; /* テキストの影を無効化 */
  }
  
  /* アイコン */
  .tw-comment-item-icon {
	display: unset !important;
	margin-top: 5px;
	margin-right: .5em;
	height: 64px;
	width: 64px;
	overflow: hidden;
	border-radius: 50%;
  }
  .tw-comment-item-icon img{
	height: 100%;
	width: 100%;
	object-fit: cover;

  }
  
  /* ユーザー名 */
.tw-comment-item-name:link,
.tw-comment-item-name:visited,
.tw-comment-item-name:hover,
.tw-comment-item-name:active {
	color: #0f1419; 
  }
  .tw-comment-item-name {
	font-size: 1rem;
    margin: 0.5rem 0;
	font-weight: 900 !important;
  }
  
  /* ユーザーID */
  .tw-comment-item-screen-id {
	display: unset !important;
	color: #536471;
  }
  
  /* サポートの星 */
  .tw-comment-item-star {
	display: unset;
  }
  
  /* コメント */
  .tw-comment-item-comment {
	color: #0f1419;
	margin-right: 6px;
  }
  .tw-comment-tagitems{
	margin-bottom: 20px;
  }
  p.tw-comment-item-comment-tag{
	display: inline;
	color: #2d8326;
	margin: 0;
  }
  .tw-comment-item-comment-tag::before{
	color: #2d8326;
	font-family: "Font Awesome 5 Free";
	font-weight: 400;
	content: "#";
  }
  .tw-comment-item-text{
	text-align: left;
	flex: 1;
  }
  .tw-comment-item-comment img{
	width: 49%;
    padding: 5px;
    border-radius: 10px;
	object-fit: cover;
    height: 200px;
  }

  .tw-comment-item-comment .page-imagelink{
	display: block;
	width: 49%;
    padding: 10px;
    border-radius: 10px;
	background-color: #ededed;
  }
  .tw-comment-item-comment .page-imagelink:hover{
	opacity: .8;
  }
  .page-imagelink img{
    width: 100%;
	padding: 0;
  }
  .tw-comment-item-comment .imagelink-title{
	font-weight: 600;
	display: inline;
  }
  .tw-comment-item-comment .imagelink-caption{
	padding: 0 5px;
	font-size: .8rem;
	display: inline;
  }
  .tw-comment-item-comment .imagelink-caption::before{
	content: "-";
	display: inline;
  }
  .tw-comment-item-comment .imagelink-content{
	padding: 20px 0 5px;
	font-size: .8rem;
  }
  .tw-comment-item-comment .imagelink-content::after{
	content: "……";
	display: inline;
  }
  
  /* タイムスタンプ */
 .con2 .tw-comment-item-date {
	display: block !important;
	color: #536471;
	font-size: .8rem;
  }

  /* コメント欄 */
 .comment_form textarea {
    overflow: auto;
    border: none;
    background: #ffffff57;
    border-radius: 10px;
    width: 80%;
    margin: auto;
}



.naiyou .bookmark {
    position: static;
    width: fit-content;
    margin-left: auto;
    justify-content: flex-end;
}
	/*========= project CSS ===============*/

	.project .main-container{
		display: block!important;
	}
	.project .mainimg-box{
		width: 40%;
	}
	.project .mainimg-box img{
	object-fit: contain;
    width: 100%;
    height: 100%;
}
	.project .img-box{
		display: flex;
		width: 60%;
		flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 5px;
		justify-content: center;
		align-content: center;

	}
	.project .img-box img{
		width: 30%;
		box-sizing: border-box;
	}
	/*========= form  CSS tsuji===============*/


	/*========= wp form  CSS ===============*/
	input{
		color:black;
	}
	input::placeholder{
		color:rgb(158, 158, 158);
	}
	select {
		width: 100%;
		height: 100%;
		color:rgb(158, 158, 158);
		font-size: .9rem;
	}

	.list-exam,.list-exam td{
		border: 1px #ffffff00!important;
	}
	.mw_wp_form_preview{
		width: 100%;
	}
	.mw_wp_form>form{
		min-height: 50svh;
		padding: 20px 0;
	}
	.mw_wp_form input[type='submit']{
		margin: 30px auto 20px;
		display: block;
	}
	.mw_wp_form table,.mw_wp_form h2{
		text-align: left;
		margin-bottom: 10px;
	}

	.mw_wp_form input[type='text']:focus ,.mw_wp_form input[type="email"]:focus,.mw_wp_form input[type="url"]:focus,.mw_wp_form input[type="password"]:focus,.mw_wp_form input[type="search"]:focus,.mw_wp_form input[type="number"]:focus,.mw_wp_form input[type="tel"]:focus,.mw_wp_form input[type="range"]:focus,.mw_wp_form input[type="date"]:focus,.mw_wp_form input[type="month"]:focus,.mw_wp_form input[type="week"]:focus,.mw_wp_form input[type="time"]:focus,.mw_wp_form input[type="datetime"]:focus,.mw_wp_form input[type="datetime-local"]:focus,.mw_wp_form input[type="color"]:focus,.mw_wp_form textarea:focus,select:focus{
		border: 1px solid var(--accent-color);
		outline: none;
		box-shadow: 0 0 5px 1px var(--accent-color);
	}
	.radio-button {
		display: flex;
		gap: 10px;
		justify-content: center;
		margin: 10px;
		position: relative;
		align-items: center;
		width: fit-content;
	  }
	  
	  .radio-button input[type="radio"] {
		position: absolute;
		opacity: 0;
	  }
	  
	  .radio-button .ratio {
		position: relative;
		display: inline-block;
		width: 1rem;
		height: 1rem;
		border-radius: 50%;
		border: 2px solid #ccc;
		box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
		transform: translateZ(-25px);
		transition: all 0.3s ease-in-out;
	  }
	  
	  .radio-button .ratio::before {
		position: absolute;
		content: '';
		width: 80%;
		height: 80%;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		border-radius: 50%;
		background-color: #46bb46;
		box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
		opacity: 0;
		transition: all 0.3s ease-in-out;
	  }
	  
	  .radio-button input[type="radio"]:checked + .ratio {
		border-color: var(--accent-color);
		transform: translateZ(0px);
	  }
	  
	  .radio-button input[type="radio"]:checked + .ratio::before {
		opacity: 1;
	  }
	  #formstyle table {
		font-size: 1rem;
		border-color: inherit;
		border-collapse: collapse;
	}
	#formstyle td {
		border: none;
	}
	#formstyle .member-info td{
		border: solid 1px #e0e0e0;
		padding: 0 0 0 5px;
	}
	.information td,.information th{
		border: none;
	}
	.mw_wp_form .form-group input::placeholder {
		color: #d1d1d1!important;
	  }
	  .mw_wp_form .form-group input::-webkit-input-placeholder /* Google Chrome, Safari, Opera 15+, Android, iOS */{
		color: #d1d1d1!important;
	  }
	  #formstyle td,#formstyle th{
		vertical-align: middle;
	  }
	  #formstyle input[type="text"], #formstyle input[type="email"], #formstyle input[type="url"], #formstyle input[type="password"], #formstyle input[type="search"], #formstyle input[type="number"],#formstyle input[type="range"], #formstyle input[type="date"], #formstyle input[type="month"], #formstyle input[type="week"], #formstyle input[type="time"], #formstyle input[type="datetime"], #formstyle input[type="datetime-local"], #formstyle input[type="color"], #formstyle textarea {
		padding: 5px;
		border: solid 1px #ffffff00;
		margin: 0;
	}
	.mwform-tel-field input[type="text"], .mwform-zip-field input[type="text"] {
		border: solid 1px #e0e0e0 !important;
		margin: 10px 0 !important;
		padding: 0 0 0 2% !important;
		width: 25% !important;
	}
	#formstyle select {
		padding: 5px;
		border: solid 1px #e0e0e000;
		display: block;
	}
	p.print-only{
		margin: 10px 0;
		text-align: left;
		line-height: 1.2;
	}

	.table-title td:empty {
		background-image: linear-gradient(to right top, transparent calc(50% - 0.5px), #e0e0e0 50%, #e0e0e0 calc(50% + 0.5px), transparent calc(50% + 1px))
	}

	/*========= calendar-list  CSS ===============*/
	.calendar-list .main-container {
		padding-top: 20px!important;
		padding-bottom: 20px!important;
	}

	.list-tit {
		background: #fffad1;
		display: inline-block;
		font-weight: bold;
		font-size: .9em;
		margin: 0 0 0 1.2em!important;
		padding: .5em;
	}
	.tit-bor {
		background: linear-gradient(90deg, var(--accent-color) 0%, var(--accent-color) 100%);
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100% 20%;
	}
	.list-box {
		background: #fffad1;
		border-radius: 10px;
		padding: .5em 0;
	}
	.list-design{
		display: flex;
		flex-wrap: wrap;
		margin: 0 20px 20px;
	}
	.list-design li {
		list-style: none;
		margin-top: 10px;
		padding: 10px;
	}
	.list-design li:hover {
		opacity: .7;
		background-color: #f5d3a894;
	}
	.calendar-list .events-day{
		display: none;
	}
	.calendar-list .list-info{
		display: flex;
		font-size: .9rem;
	}
	.calendar-list .list-info .day{
		margin-right: 10px;
		margin-bottom: 0;
	}
	.calendar-list .category{
		width: fit-content;
		border-radius: 20px;
		padding: 2px 10px;
		color: #fff;
		font-size: .9rem;
		margin-bottom: 0;
	}
	.calendar-list .teireikai{
		background-color: #46bb46;
	}
	.calendar-list .education{
		background-color: #aeadf7;
	}
	.calendar-list .scaffold{
		background-color: #bb9c46;
	}
	.calendar-list .site-disaster{
		background-color: #ef9292;
	}
	.calendar-list .pub-relation{
		background-color: #46adbb;
	}

	/*========= LP  CSS ===============*/
	#primary {
		grid-column: 2;
		grid-row: 1/5;
		grid-column-start: 2;
		min-width: 0;
	}
	.LP .waku {
		position: absolute;
		right: 0;
		left: auto;
		width: 50%;
		margin-top: 10svh;
    	height: 80svh;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #fff;
	}
	.LP .wrapper {
		position: relative;
		width: 100vw;
		height: calc(100svh - 50px);
		margin-top: 50px;
	}
	.LP .mainimages .text{
		font-family: 'Noto Sans JP', sans-serif;
		color: #454649;
		-webkit-text-stroke: 0;
		margin-left: 4%;
	}
	.LP .mainimages p {
		-webkit-text-stroke: 0;
		text-align: center;
	}
	.dots {
		font-size: 130%;
    	padding-bottom: 15px;
    	background-position: bottom left;
    	background-repeat: repeat-x;
    	background-size: 1em 0.5em;
    	letter-spacing: 0;
    	background-image: radial-gradient(circle at center, #ff9b00 20%, transparent 20%);
    	margin-right: 0.1em;
	}
	.LP .mainimages .photo{
		background: #fff;
    	padding: 30px;
    	border: 30px solid;
	}
	.LP .waku img.illust {
		position: relative;
		object-fit: contain;
		width: 80%;
		height: 100%;
	}
	.LP img.wakugumi {
		transform: rotateY(180deg);
		z-index: 0;
		width: 100%;
    	height: 100%;
		pointer-events: none;
	}
	.LP .mainimages h2 {
		font-size: 3rem;
		letter-spacing: 0.1em;
		margin-top: 15px;
		z-index: 0;
	}
	.LP .mainimages h3 {
		font-size: 2rem;
		letter-spacing: 0.1em;
		margin-top: 15px;
		z-index: 0;
	}
	.LP.con1 {
		padding: 5% 0;
		color: #202020;
		position: relative;
		background: #faf094;
	}
	.LP.con1 .main-container {
		padding: 130px 4%;
	}
	.LP2.con1 img.wakugumi {
		width: 100%;
		height: 100%;
	}
	.imgs.con1 .human-circle{
		position: relative;
	}
	.imgs.con1 .human-circle_imgbox{
		width: 300px;
    	height: 300px;
		overflow: hidden;
		border-radius: 50%;
		position: relative;
		z-index: 0;
	}
	.imgs.con1 .human-circle::before{
		content: "";
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
    	z-index: 0;
		width: 90%;
		height: 90%;
		overflow: hidden;
		border-radius: 50%;
		background-color: var(--accent-2-color);
	}
	.imgs.con1 .human-circle .hukidasi {
		position: absolute;
		top: -100px;
		left: 0;
		width: 100%;
	}
	.imgs.con1 .human-circle .hukidasi:before{
		position: absolute;
		border-radius: 50% 50% 48% 52% / 0% 0% 100% 100%;
		background-color: #ffffff;
		content: "";
		top: 80%;
		left: 42px;
		height: 15px;
		width: 25px;
	}
	.imgs.con1 .human-circle p {
		position: relative;
		width: fit-content;
		padding: 2.5rem 0.5rem 2rem 0.5rem;
		border-radius: 50%;
		background-color: #ffffff;
		color: #616161;
		font-weight: bold;
    	text-align: center;
	}
	
	.imgs.con1 .human-circle p:before,
	.imgs.con1 .human-circle p:after {
		position: absolute;
		border-radius: 50%;
		background-color: #ffffff;
		content: "";
	}
	
	.imgs.con1 .human-circle p:before {
		top: 100%;
		left: 52px;
		height: 10px;
		width: 15px;
	}
	
	.imgs.con1 .human-circle p:after {
		top: 115%;
		left: 65px;
		height: 7px;
		width: 10px;
	}

	.imgs.con1 .human-circle img{
		width: 100%;
		height: 100%;
		z-index: 0;
    	position: relative;
	}
	.LP2.con1 ul li{
		text-align: center;
		margin: 35px 0;
		margin-inline: auto;
	}

	.underline {
		display: inline;
		background-image: linear-gradient(90deg, var(--accent-2-color), var(--accent-2-color));
		background-repeat: no-repeat;
		background-position: left bottom;
		background-size: 0 5px;
		text-decoration: none;
		transition: background-size 1.5s;
		transition-delay: 0.5s;
	}
	.underline.active {
		background-size: 100% 5px;
	}
	.imgbox.pc{
		width: 100%;
		display: flex;
	}
	.mb{
		display: none;
		width: 60%;
	}
	.imgbox.mb img{
		width: 100%;
	}
	.imgbox.pc img {
		width: 33.33%;
	}
	.LP2.con1 .midasi h1{
		font-family: 'Noto Sans JP';
    	font-weight: 500;
		width: 100%;
		display: inline-flex;
		justify-content: space-evenly;
    align-items: center;
	}
	.LP2.con1 .midasi h1 img{
		width: 80%;

	}
	.LP.con1 .midasi h1{
		color: var(--accent-color);
		font-family: 'Noto Sans JP';
    font-weight: 500;
	}
	.LP.con1 .midasi h1{
		display: inline-flex;
		width: 100%;
		justify-content: space-around;
		align-items: center;
	}
.LP.con1 .midasi .icon {
		color: var(--accent-color);
		font-weight: 600;
	}
	.LP.con1 .naiyou{
		color: var(--accent-color);
		font-weight: 500;
	}
	.LP.con1 .flexbox {
		background-color: #ffffff7a;
		z-index: 1;
	}
	.imgs.con1 .main-container{
		padding: 50px 0;
		justify-content: space-evenly;
	}
	.imgs.con1.onayami .main-container{
		padding: 0;
		padding-top: 150px;
	}
	img.border-waku{
		width: 100vw;
		background-color: #faf094;
	}
/*========= menu_gijiroku  CSS ===============*/

	.menu-listitem ul{
		margin: 0;
		padding: 0;
		list-style: none;
		width: 100%;
		justify-content: center;
		padding: 100px 0;
		display: flex;
		flex-wrap: wrap;
		gap: 20px;
	}
	.menu-listitem a{
		display: block;
		padding: 0px;
		padding-top: 100%;
		color: inherit;/*プロパティの値を親要素から取得*/
		font-weight: 600;
		font-size: 1.2rem;
		text-decoration: none;/*テキストの下線を消去*/
		white-space: nowrap;
		width: 100%;
		box-sizing: border-box;
		line-height: 1.5;
	}
	.menu-listitem a span{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		display: flex;
		flex-flow: column;
	}
	.menu-listitem i {
		font-size: 3rem;
		padding-bottom: 10px;
	}
	
	.menu-listitem li {
		display: flex;
		/* メニューテキスト位置をリスト内中心に */
		align-items: center;
		text-align: right;
		background-color: rgb(255, 255, 255, 0.3);

		position: relative;
		width: calc(220px - 40px);
		z-index: 1;
		padding: 0;
		color: #fff;
		text-align: center;
		color: var(--base-color);
		background: #46bb46;
		background: var(--accent-color);
		border-radius: 50%;
		transition: color .5s;
	  }
	  .menu-listitem li::before {
		background: #ffffffad;
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		bottom: 0;
		margin: auto;
		transform: scale(1, 0);
		transform-origin:right bottom;
		transition: transform .5s;
		z-index: -1;
	  }
	  .menu-listitem li:hover {
		color: #000;
		color: var(--accent-color);
	  }
	  .menu-listitem li:hover::before {
		transform-origin: center top;
		transform: scale(1, 1);
	  }



@media (min-width:1025px){


	div.main-container{
		display: flex;
		align-items: center;/*中身を中央揃えで表示*/
		justify-content: center;/*両端揃えで表示*/
		max-width: 1024px;
		max-width: var(--large-width);
		margin-left: auto;
		margin-right: auto;
	}

	.logo img{
		width: 15svh;
		height: 10svh;
		}

	.headB ul{
		display: flex;
		justify-content: space-around;
	}
	.headB .sub-menu{
		display: block;
	}
	.headB a{
		display: inline-block;
	}
	.headC {
		display: none;/*大きい画面では非表示*/
	}



	.mainimages h1{
		font-size: 5rem;
	}


	.mainimages p{
		font-size: 2rem;
	}
	.circle{
        width: 18svh;
        height: 18svh;

	}
	.circle span{
		font-size: 1.2rem;
	}

	.flexbox{
		display: flex;
		justify-content: space-between;
		padding: 30px;
	}
	.LP2 .flexbox{
		width: 50%;
	}
	#page-section .flexbox{
		display: flex;
		justify-content: center;
		padding: 30px;
		width: 100vw;
	}

	.midasi{
    	width: 330px;
    	margin: 40px auto;
    	font-size: 2.2em;
	}
	#page-section .midasi{
		display: inline-block;
    	width: 100svh;
    	margin: 40px;
    	font-size: 2.2em;
	}
	
	.midasi .icon{
		vertical-align: 10%;
	}
	.naiyou{
		width: 50%;
		margin: 50px;
		font-size: 1em;
	}
	.naiyou p{
		margin: 0;
	}
	
	.con3 .icontext{
		flex: 1;
	}
	.con3 .icon{
		font-size: 60px;
	}
	.icontext h2{
		font-size: 20px;
	}

	.con1 .main-container{
		display: flex;
		flex-wrap: wrap;
		padding-top: 185px;
		padding-bottom: 50px;
	}
	.con3 .main-container{
		display: flex;
		flex-wrap: wrap;
		max-width: 1000px;
		max-width: var(--large-width);
	}
	.con2 .main-container{
		display: flex;
		align-items:unset;
		max-width: 1000px;
		max-width: var(--large-width);
		padding-top: 100px;
		margin-left: auto;
		margin-right: auto;
		justify-content: space-around;
	}

	.con2 .text{
		flex: 2;
		padding: 50px;
	}
	.con2 .photo{
		display: block;
		padding: 50px;
	}

	.con4 .t-box{
		margin:20px;
		min-width: 600px;
	}

	.listA .listdiv#allarticle{
		width: 100%;
	}
	footer .main-container{
		display: block;
	}

	.footA{
		display: flex;
		flex-direction: column;
		align-content: flex-start;
		flex-wrap: nowrap;
		align-items: flex-start;
	}
	nav.footB{
		width: 100%;
	}
	.footB{
		display: flex;
	}
	.footB div{
		flex: 1;/*1:1の比率で等分割*/
	}
	.footB div:not(:first-child){
		margin-left: 40px;
	}
	.footB a,.footB p{
		font-size: 16px;
	}

	.copywright{
		font-size: 12px;
		text-align: center;
		font-family: 'Courier New', Courier, monospace;
	}

	.menu-listitem ul {
		display: flex;
		justify-content: space-around;
	}

}
@media (min-width:1280px){
	div.main-container{
		display: flex;
		align-items: center;/*中身を中央揃えで表示*/
		justify-content: center;/*両端揃えで表示*/
		max-width: 1280px;
		max-width: var(--max-large-width);
		margin-left: auto;
		margin-right: auto;
	}
	.con3 .main-container{
		max-width: var(--max-large-width);
	}
	.con2 .main-container{
		max-width: var(--max-large-width);
	}
	.banner img{
		width: 50%;
	}
	}
@media (min-width:1024px) and (max-width:1280px) {
	.LP .mainimages .text {
		width: 50%;
		padding-left: 4%;
		margin: 0;
	}
	.br{
		display: contents;
	}
	.tab .br {
		display: none;
	}
	}

@media (min-width:768px) and (max-width:1024px) {
	
	div.main-container{
		display: flex;
		align-items: center;/*中身を中央揃えで表示*/
		justify-content: space-between;/*両端揃えで表示*/
		max-width: 768px;
		max-width: var(--middle-width);
		margin-left: auto;
		margin-right: auto;
	}

	.logo {
		top: 5px;
		left: 0;
		margin-left: 15px;
	}

	.headB ul{
		display: flex;
		justify-content: space-evenly;
	}
	.headB a{
		display: inline-block;
		padding: 5px;
		margin: 5px 0;
		font-size: 14px;
	}

	.headB .menu-item {
		width: auto;
	}
	.headB li.menu-item-has-children ul {
		width: auto;
	}
	.site-title, .site-title a {
		display: none;
	}

	.headC {
		display: none;/*大きい画面では非表示*/
	}



	.viewsubtitle text{
		display: block;
		stroke-width: .3;
	  }
	.viewsubtitle text .cls-1{
		font-size: 1.5rem;
	  }
	  .viewsubtitle text .cls-2{
		font-size: .8rem;
		stroke-width: .15;
	  }
	  .viewtitle text {
		display: none;
		font-size:10px;
	  }

	.flexbox{
		display: flex;
		justify-content: space-between;
		padding: 30px;
	}

	#page-section .midasi {
		min-width: 50vw;
		margin:0 40px;
		font-size: 2em;
	}
	
	.midasi .icon{
		vertical-align: 10%;
	}
	.naiyou{
		margin: 20px;
		font-size: 1em;
		flex: 1;
	}
	.naiyou p{
		margin: 0;
	}
	
	.con3 .icontext{
		flex: 1;
		padding-left: 5px;
		padding-right: 5px;
	}

	.con1 .main-container{
		display: flex;
		flex-wrap: wrap;
		max-width: 750px;
		max-width: var(--middle-width);
		padding-top: 150px;
		padding-bottom: 30px;
		justify-content: center;
	}
	.con3 .main-container{
		display: flex;
		flex-wrap: wrap;
		max-width: 750px;
		max-width: var(--middle-width);
		align-items: flex-start;
	}
	.con2 .main-container{
		display: flex;
		align-items:unset;
		max-width: 750px;
		max-width: var(--middle-width);
		margin-left: auto;
		margin-right: auto;
		padding: 0 4%;
	}
	.con2 .text{
		flex: 2;
		padding: 50px;
		margin: 0;
	}
	.con2 .photo{
		display: flex;
		padding: 50px 0;
		justify-content: center;
		align-items: center;
	}
	.flex {
		flex-flow: column;
	}
	.sns .main-container {
		flex-flow: column;
	}

	.con4 .t-box{
		margin:20px;
		min-width: 600px;
	}
	.listA .listdiv#allarticle{

		width: 100%;
	}
	.seihin .flex {
		flex-flow: column;
	}
	.movie iframe{
		width: 70%;
	}


	footer .main-container{
		display: block;
	}

	.footA{
		display: flex;
		flex-direction: column;
		align-content: flex-start;
		flex-wrap: nowrap;
		align-items: flex-start;
	}
	nav.footB{
		width: 100%;
	}
	.footB{
		display: flex;
	}
	.footB div{
		flex: 1;/*1:1の比率で等分割*/
	}
	.footB div:not(:first-child){
		margin-left: 40px;
	}

	.copywright{
		font-size: 12px;
		text-align: center;
		font-family: 'Courier New', Courier, monospace;
	}

	div[id^="m_"] a {
		width: 50%;
	}
	/*========= carendar-list CSS ===============*/
	.calendar-list .list-info{
		flex-flow: column;
	}
	/*========= LP CSS ===============*/

	.LP .mainimages .text {
		width: 50%;
		padding-left: 4%;
		margin: 0;
	}
	.LP .mainimages .br{
		display: contents;
	}
	.LP.con1 .naiyou {
		margin: 35px 0;
	}
	.LP.con1 .main-container {
		display: block;
	}
	.LP.con1 .midasi {
		margin: 25px auto;
	}

}

@media (min-width:500px) and (max-width:767px){
	div.main-container{
		max-width: 500px;
		max-width: var(--small-width);
		margin-left: auto;
		margin-right: auto;
	}
	.flex {
		flex-flow: column;
	}
	.con1 .main-container{
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		padding-top: 100px;
		padding-bottom: 30px;
		justify-content: center;
	}
	.flexbox {
		max-width: 750px;
		max-width: var(--middle-width);
		margin: 0px 30px;
		width: 100%;
	}


	div.container-small {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-left: auto;
    	margin-right: auto;
	}
	header{
		height: 5%;
	}

	.headB{
		top: 50px;
		left: 0;
	}
	.headB a {
		font-size: 1rem;
	}
	.main-navigation.toggled-on {
		display: block;
		position: absolute;
		top: 65px;
		left: 0;
		transition: all .3s;
	}
	#site-navigation {
		position: absolute;
	}
	

	
	.headC {
		margin-top: 15px;
		margin-right: 10px;
		color: #fff;
		padding: 0;
		border: none;
		outline: none;
		background: none;
		font-size: 30px;
		opacity: 0.8;
		cursor: pointer;/*リンクにカーソルを重ねたとき、形を手の形状に変更*/
	}

	.headC:hover{
		opacity: 0.3;
	}


.newsslider {
    width: 800px;
}


.viewsubtitle text{
	display: block;
	stroke-width: .3;
  }
.viewsubtitle text .cls-1{
	font-size: 1.5rem;
  }
  .viewsubtitle text .cls-2{
	font-size: .8rem;
	stroke-width: .15;
  }
  .viewtitle text {
	display: none;
	font-size:10px;
  }

	.logo img{
	width: 50%;
	height: 50%;
	}

	.logo{
	margin: 5px;
	}

	.bookmark{
		top: 15%;
		right: 5%;
		}
	.circle{
		width: 120px;
		height: 120px;
	}
	.circle span{
		width: 110px;
		font-size: 16px;
		margin-top: 5px;
		margin-left: 5px;
		}

		.calender {
			margin: 0;
			padding: 4%;
		}

	.con2 h2{
		font-size: 1.2em;
		}
		
	.con2 p{
		font-size: 0.9em;
		}
	
	.listA article {
		display: block;
	}

	.listA .listdiv {
		margin: 10px;
		color: inherit;
		text-decoration: none;
		flex: 1 1 500px;
	}

	.listdiv a{
		display: flex;
		justify-content: center;
	}

	.slide {
		position: relative;
		height: 100svh;
	}

	.sub-menu{
		display: none;
	}

	div[id^="m_"] {
		display: block;
	}

	.tab {
		justify-content: space-between;
	}
	.tab li {
		position: relative;
		padding: 5px;
		text-align: center;
		/*min-width: 100px;*/
	}
	.tab li:first-of-type {
		min-width: 100%;
	}
	.tab li a {
		padding: 0;
		font-size: .8rem;
	}
	/*========= project CSS ===============*/
	.con2.project .title h2 {
		padding: 30px 10px;
	}
	.project .mainimg-box,.project .img-box {
		width: 50%;
	}
	.project .flex {
		flex-flow: inherit;
		align-items: flex-start;
	}
	.project .img-box img {
		width: 45%;
	}
	/*========= carendar-list CSS ===============*/
	.calendar-list .list-info{
		flex-flow: column;
	}
	/*========= LP CSS ===============*/
	.br{
		display: contents;
	}
	.LP .wrapper {
		position: relative;
		width: 100vw;
		height: auto;
		margin-top: 110px;
	}
	.LP .mainimages .text {
		position: static;
		transform: translate(0,0);
		margin: auto;
    	padding: 0 4%;
	}
	.LP.con1 .naiyou {
		margin: 35px 0;
	}
	.LP .waku {
		position: relative;
		width: 100%;
		margin-top: 0; 
		height: auto;
	}
	div.human-circle:nth-of-type(2) {
		margin-top: 120px;
	}
		


	.sns .main-container {
		display: flex;
		flex-flow: column;
	}


	
}

@media (max-width:499px){
	div.main-container{
		margin-left: 4%;
		margin-right: 4%;
	}
	.main-container#tab{
		margin:0;
	}
	.flex {
		flex-flow: column;
		align-items: center;
	}
	.br{
		display: contents;
	}

	.con1 .main-container{
		display: flex;
		flex-wrap: wrap;
		padding-top: 100px;
		padding-bottom: 30px;
		justify-content: center;
	}
	.flexbox {
		max-width: 500px;
		max-width: var(--small-width);
		margin: 0px 20px;
		width: 100%;
	}
	div .container-small {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-left: auto;
    	margin-right: auto;
	}
	.loader.con1 .flexbox {
		margin: 0 auto;
		padding: 0;
		width: 90%;
		position: fixed;
		top: 25%;
		left: 50%;
		transform: translate(-50%);
	}


	.headB{
		top: 50px;
		left: 0;
	}

	#site-navigation {
		position: absolute;
	}
	.newsslider h4 {
		margin: 5px 2.5px;
		font-size: .9rem;
		white-space: nowrap;
	}
	
	.headC {
		margin-top: 15px;
		margin-right: 10px;
		color: #fff;
		padding: 0;
		border: none;
		outline: none;
		background: none;
		font-size: 30px;
		opacity: 0.8;
		cursor: pointer;/*リンクにカーソルを重ねたとき、形を手の形状に変更*/
	}

	.headC:hover{
		opacity: 0.3;
	}
	.viewsubtitle text{
		display: block;
		stroke-width: .3;
	  }
	.viewsubtitle text .cls-1{
		font-size: 1.5rem;
	  }
	  .viewsubtitle text .cls-2{
		font-size: .8rem;
		stroke-width: .15;
	  }
	  .viewtitle text {
		display: none;
		font-size:10px;
	  }


	.logo img{
	width: 50%;
	height: 50%;
	}
	.logo{
	margin: 5px;
	}

	.bookmark {
		top: 60%;
		right: 5%;
	}
	.circle{
		width: 120px;
		height: 120px;
	}
	.circle span{
		width: 110px;
		font-size: 1rem;
		margin-top: 5px;
		margin-left: 5px;
		}

	.con2 .area h2 {
		font-size: 1.3rem;
		margin: 0 0 20px 0;
	}

	.con2.p-single .main-container{
		margin-top: 100px;
	}
	.con2.p-single .text {
		padding: 0;
	}
		
	.con2 p{
		font-size: 0.9rem;
		}
		

	.listA article {
		display: block;
	}
	.listA .text {
		margin: 0;
	}

	.slide {
		position: relative;
		height: 100svh;
	}
	.site-name{
		font-size: 1.6rem;

	}
    .gnavi-list:first-child{
		width: 100%;
	}
	.tab {
		justify-content: space-between;
	}
	.tab li {
		position: relative;
		padding: 5px;
		text-align: center;
		/*min-width: 100px;*/
	}
	.tab li:first-of-type {
		min-width: 100%;
	}
	.tab li a {
		padding: 0;
		font-size: .8rem;
	}

	.naiyou {
		margin: 0;
	}
	.naiyou.kengaku {
		margin: 40px 0;
	}
	.seihin .photo-list a {
		width: 50%;
	}
	.movie iframe{
		width: calc(100%);
	}

	.sns .main-container {
		display: flex;
		flex-flow: column;
	}
	.tw-comment-item-icon {
		height: 40px;
		width: 40px;
	}
	.tw-comment-item-comment {
		margin-right: 0px;
	}
	.tw-comment-item-comment img {
		padding: 2px;
		height: 90px;
	}
	.attachment_post_thumbnail .fa-solid {
		font-size: 1.5rem;
	}
	.tw-comment-item-comment .page-imagelink {
		width: 100%;
	}
	.sns #activity {
		padding: 0 5px;
	}
	.facebook{
		margin-top: 50px!important;
	}
	.con3 .main-container {
		padding-top:0px;
	}

	div[id^="m_"] {
		display: block;
	}
	div[id^="m_"] a {
		width: 50%;
	}

	a[href^="?mlist"],a[href^="#m"]{
		font-size: .9rem;
	}
	article[class*="members"] a, article[class*="members"] iframe {
		width: 100%;
		padding:10px 0;
	}
	article[class*="members"] .text {
		display: block;
	}

	.banner{
		display: block;
	}
	/*========= form CSS ===============*/
	#formstyle tr:not(.table tr) {
		display: grid;
		margin-bottom: 10px;
	}

	/*========= project CSS ===============*/
	.con2.project .title h2 {
		padding: 30px 10px;
	}
	.project .mainimg-box,.project .img-box {
		width: 100%;
	}
	.project .img-box img {
		width: 45%;
	}

	/*========= carendar-list CSS ===============*/
	.calendar-list .category {
		font-size: .8rem;
	}
	.list-design {
		flex-flow: column;
		margin: 0 5px;
	}
	.list-design li {
		width: 100%;
		padding: 2.5px 5px;
	}
	.list-box h2 {
		font-size: 1rem;
	}
	/*========= LP CSS ===============*/
	.LP .wrapper {
		position: relative;
		width: 100vw;
		height: auto;
		margin-top: 110px;
	}
	.LP .mainimages .text {
		position: static;
		transform: translate(0,0);
		margin: auto;
    	padding: 0 4%;
	}
	.LP .mainimages h2 {
		font-size: 2.5rem;
		letter-spacing: 0.1em;
		margin-top: 1rem;
	}
	.LP .mainimages h3 {
		font-size: 1.5rem;
		margin-top: 3rem;
		margin-bottom: 10rem;
	}
	.LP.con1 .naiyou {
		margin: 35px 0;
	}
	.LP .waku {
		position: relative;
		width: 100%;
		margin-top: 0; 
		height: auto;
	}
	.imgbox.pc{
		display: none;
	}
	.mb{
		display: block;
	}
	div.human-circle:nth-of-type(2){
		margin-top: 120px;
	}
	.imgs.con1 .human-circle_imgbox{
		width: 230px;
    	height: 230px;
	}

	.menu-listitem li {
		width: calc(50% - 40px);
	}
	

	
	/*========= スクロールカラーチェンジのCSS ===============*/

	.headerchange-color .headC{
		color: rgb(0, 0, 0);
	  }
}