@charset "UTF-8";
/* CSS Document */

html {

}

body {
	font-family: "M PLUS 1p", sans-serif;
	background: #fff;
}

.main-image {
/*	background-size: cover;
	background-position: center;
*/
	color: #fff;
}


body.admin-bar .navbar {
	top:32px;
}

.main-image .back_slide {
	width:100%;
	height:100%;
	display:block;
	position:relative;
}

.main-image .back_slide div {
	background-repeat:no-repeat;
	background-size: cover;
	background-position: center;
	height:80vh;
}


.main-image .back_slide .back_image_01 {
	background-image: url("images/main_images_06.jpg");
}

.main-image .back_slide .back_image_02 {
	background-image: url("images/main_images_02.jpg");
}

.main-image .back_slide .back_image_03 {
	background-image: url("images/main_images_03.jpg");
}

.main-image .top_copy {
	position:absolute;
    top: 50%; /* 親要素の外側（上辺）から50%内側 */
    left: 50%; /* 親要素の外側（左辺）から50%内側 */
    transform: translate(-50%, -50%); /* 要素の位置を-50%上・-50%左に変える */
	padding-top: 0;
	max-width:760px;
	width:100%;
}

.main-image h1 {
	font-weight: bold;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); 
}

.main-image h2 {
	font-weight: bold;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); 
}

.main-image h3 {
	margin-top: 26%;
	font-weight: bold;
	margin-bottom: 20px;
	font-size: 20px;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); 
}

.navbar {
	background-color: transparent;
	transition: all 0.4s ease-in-out; /* 滑らかに変化させる */
	padding-top: 4px;
	padding-bottom: 4px;
	box-shadow: 0 0px 5px rgba(112,112,112,0.2); /* オプション：影を付ける */
}

/* スクロール後のスタイル: 不透明にする */
.navbar.scrolled {
	background-color: rgba(255, 255, 255, 0.6) !important; /* 80%不透明の黒 */
	box-shadow: 0 2px 5px rgba(0,0,0,0.2); /* オプション：影を付ける */
}

.navbar-brand {
	width: 220px;
	height:30px;
	margin-left: 7px;
	padding-top: 0;
	padding-bottom: 6px;
}

.navbar-toggler {
	margin-right: 7px;
	padding: 2px;
	background: #3d6c06;
}

.navbar-toggler:focus {
	box-shadow:none;
}

.navbar-toggler-icon {
	width:38px;
	height: 38px;
	background: #3d6c06;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.info {
	background: #f5fff0;
	padding-top: 40px;
	padding-bottom: 30px;
}

.info h2 {
	font-size: 24px;
	margin-bottom: 20px;
	font-weight: normal;
}

.info h2 span {
	font-size: 18px;
	font-weight: bold;
}

.info ul {
	margin: 0;
	padding: 0;
}

.info ul li {
	list-style: none;
	margin-bottom: 15px;
/*	width: 49%;
	float: left;
	margin-right: 2%;
	*/
}

.info ul li:nth-child(2n+2){
	margin-right: 0;
}

.info ul li dl {
	margin: 0;
}

.info ul li dl dt {
	margin: 0;
	width: 100px;
	float: left;
}

.info ul li dl dt img {
	width: 100px;
	height: 100px;
	object-fit: cover;
	object-position: center top;
}

.info ul li dl dt a img {
	transition: .8s;
}

.info ul li dl dt a:hover img {
	opacity: .6;
}

.info ul li dl dd {
	padding-left: 110px;
}

.info ul li dl dd a {
	color:#105132;
	text-decoration: none;
	transition: .8s;
	font-weight: bold;
	letter-spacing:0.03em;
}

.info ul li dl dd a:hover {
	color: #999;
}

.event,
.recommend,
.projects{
	padding-top: 40px;
	padding-bottom: 30px;
	background: #fff;
}

.event h2,
.recommend h2,
.projects h2,
.top_company h2 {
	font-size: 24px;
	font-weight: normal;
}

.top_company h2 {
	color: #fff;
}

.event h2 span,
.recommend h2 span,
.projects h2 span,
.top_company h2 span {
	font-size: 18px;
	font-weight: bold;
}
.event ul,
.recommend ul,
.other_events ul,
.other_recommend ul {
	margin: 22px 0 0 0;
	padding: 0;
    display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	flex-wrap: wrap;
}

.event ul li,
.recommend ul li,
.other_events ul li {
	list-style: none;
	margin-bottom: 15px;
	width: 49%;
	float: left;
	margin-right: 2%;
}

.other_recommend ul li {
	list-style: none;
	margin-bottom: 15px;
	width: 32%;
	float: left;
	margin-right: 2%;
}

.event ul li:nth-child(2n+2),
.recommend ul li:nth-child(2n+2),
.other_events ul li:nth-child(2n+2){
	margin-right: 0;
}

.other_recommend ul li:nth-child(3n+3) {
	margin-right:0;
}

.event ul li dl,
.other_events ul li dl,
.other_recommend ul li dl {
	margin: 0;
	padding: 0;
}

.event ul li dl dt,
.other_events ul li dl dt,
.other_recommend ul li dl dt {
	margin: 0;
	padding: 0;
	position: relative;
}

.event ul li dl dt a img,
.other_events ul li dl dt a img,
.other_recommend ul li dl dt a img {
	width: 100%;
	height:auto;
}

.event ul li dl dt p,
.other_events ul li dl dt p,
.other_recommend ul li dl dt p {
	position: absolute;
	margin: 0;
	bottom: 10px;
	right: 10px;
	background: #fff;
	padding: 3px 8px;
}

.other_recommend ul li dl dt p {
	font-size:12px;
}

.event ul li dl dd a,
.other_events ul li dl dd a,
.other_recommend ul li dl dd a {
	color:#105132;
	text-decoration: none;
	transition: .8s;
	font-weight: bold;
	letter-spacing:0.03em;
}

.event ul li dl dd a:hover,
.other_events ul li dl dd a:hover,
.other_recommend ul li dl dt a:hover {
	color: #999;
}

.event ul li dl dd span,
.other_events ul li dl dd span {
	font-size:14px;
}

.recommend ul li a {
	position: relative;
	text-decoration: none;
}

.recommend ul li a img {
	width: 100%;
	height:auto;
	position: relative;
}

.recommend ul li a:hover img {

	filter: brightness(0.5); 
	transition: .8s;
}

.recommend ul li a .over-text {
	text-align: center;
	color: #000;
	margin-top: 8px;
}

.recommend ul li a .over-text h3 {
	font-size: 16px;
	text-decoration: none;
}

.recommend ul li a .over-text h4 {
	font-size: 16px;
}

.projects ul {
	margin: 22px 0 0 0;
	padding: 0;
}

.projects ul li {
	width: 100%;
	margin-bottom: 15px;
	list-style: none;
}

.projects ul li a {
	text-decoration: none;
	color: #000;
	
}

.projects ul li a img{
	width: 100%;
}

.projects ul li a h3 {
	text-align: center;
	margin-top: 8px;
	font-size: 20px;
	font-weight: normal;
}

.projects ul li a h3 span {
	font-size: 16px;
	font-weight: bold;
}

.top_company {

}

.company_box {
	/*clip-path:inset(0);*/
	height: 60vh;
	position: sticky;
	overflow: hidden;
	top: 0;
	z-index: -1;
}

.company_box img {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	animation: scale-up linear;
	animation-timeline: scroll();
  /* 範囲の調整 (画像が見え始めてから隠れるまで) */
	animation-range: entry 10% cover 100%; 
}

@keyframes scale-up {
  from { transform: scale(0.7); }
  to { transform: scale(1.6); } /* 1.5倍に拡大 */
}

.company_text {
	position: absolute;
	background: url("images/top_company_back.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding-top: 45%;
	padding-bottom: 0;
	height: 60vh;
}

.top_company p.link {
	text-align: center;
	margin-top: 30px;
}

.top_company p.link a {
	border: 1px solid #fff;
	padding: 10px 48px 10px 28px;
	font-weight: 400;
	color: #105132;
	background: #fff;
	text-decoration:none;
	transition: .6s;
	z-index: 100;
}

.top_company p.link a:hover {
	opacity: .6;
}

.top_company p.link a i {
	position: relative;
	font-style: normal;
}

.top_company p.link a i::before {
	position: absolute;
	display: block;
	content: "";
	top:31%;
	right: -30px;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-left: 10px solid #105132;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
}

.banner-area {
	padding-top: 60px;
	padding-bottom: 60px;
	background: #fff;
}

.footer {
	background: #538a12;
}

.footer ul {
	margin: 0;
	padding: 0;
	text-align: center;
}

.footer ul li {
	margin: 0;
	padding: 15px 0 16px 0;
	display: block;
	border-bottom: 1px solid #fff;
}

.footer ul li a {
	color: #fff;
	text-decoration:none;
	transition: .5s;
}

.footer ul li a:hover {
	color: #a1e8c8;
}

.footer_copy {
	background: #3d6c06;
	padding-top: 20px;
	padding-bottom: 5px;
}

.footer_copy p {
	color: #fff;
	text-align: center;
}

/*

.top_company {
	background: url("images/top_company_back.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-top: 40px;
	position: fixed;
	height: 450px;
}

.company_box {
	background: url("images/top_company_back.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding-top: 20%;
	padding-bottom: 40%;
}
*/


.page_content,
.single_content {
	padding-top:80px;
}

.page_content_02 {
	padding-top:30px
}

.page_content h1,
.single_content h1,
.page_content_02 h1 {
	font-size:22px;
	margin-bottom:30px;
}

.page_content_02 h2 {
	font-size:20px;
	padding-bottom:7px;
	border-bottom:1px solid #dfdfdf;
	margin-bottom:30px;
}

.single_content ul.event_data {
	margin:20px 0 0;
	padding:0;
}

.single_content ul.event_data li {
	list-style:none;
	padding:8px 0 6px 0;
	border-bottom:1px solid #dfdfdf;
}

.single_content p.link {
	text-align:center;
	margin-top:20px;
}

.single_content p.link a {
	display:inline-block;
	background:#3d6c06;
	padding:6px 38px 6px 18px;
	color:#fff;
	border-radius:8px;
	text-decoration:none;
	transition-duration: 0.5s;
}

.single_content p.link a i {
	position:relative;
}

.single_content p.link a i::before {
	position: absolute;
	display: block;
	content: "";
	top:31%;
	right: -30px;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-left: 10px solid #fff;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
}

.single_content p.link a:hover {
	background:#538a12
}


.other_events,
.other_recommend {
	margin-top:40px;
}

.other_events h3,
.other_recommend h3 {
	text-align:center;
	font-size:20px;
	margin-bottom:20px;
}


ul.recommend_img {
	margin:20px 0 0;
	padding:0;
}

ul.recommend_img li {
	list-style:none;
	width:50%;
	float:left;
}


.top_img.company_top {
	background:url("images/company_title_back.jpg");
	background-repeat: no-repeat;
	background-size:100%;
	background-position:center top;
	padding-bottom:50%;
}

.top_img.company_02 {
	background:url("images/company_title_back_02.jpg");
	background-repeat: no-repeat;
	background-size:100%;
	background-position:center top;
	padding-bottom:50%;
}


ul.company_navi {
	margin:0;
	padding:0;
}

ul.company_navi li {
	width:100%;
	list-style:none;
	margin-bottom:5px;
}

ul.company_navi li a {
	border:1px solid #efefef;
	display:block;
	padding:15px;
	text-align:center;
	text-decoration:none;
	color:#105132;
	transition:.5s;
}

ul.company_navi li.current a {
	background:#dfdfdf;
}

ul.company_navi li a:hover {
	background:#dfdfdf;
}

ul.company_navi li a i {
	position:relative;
}

ul.company_navi li a i::before {
	position: absolute;
	display: block;
	content: "";
	top:31%;
	right: -30px;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-left: 10px solid #105132;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
}

ul.history {
	margin:0;
	padding:0;
}

ul.history li {
	border-top:1px solid #efefef;
	padding-bottom:6px;
	padding-top:6px;
	list-style:none;
	border-left:5px solid #3d6c06;
	border-bottom:1px solid #efefef;	
	padding-left:15px;
	margin-bottom:8px;
}

ul.history li dl {
	margin:0;
	padding:0;
}

ul.history li:last-child {
	border-bottom:1px solid #efefef;	
}

/*
@media (min-width: 563px) {

	.company_box {
		height: 40vh;
	}
	
	.company_text {
		position: absolute;
		background: url("images/top_company_back.png");
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		padding-top: 43%;
		padding-bottom: 33%;
		height: 40vh;
	}

}
*/

@media (min-width: 576px) {
	.projects ul li {
		width: 33.333%;
		float: left;
		margin-bottom: 15px;
	}
}
@media (min-width: 768px) {

	.offcanvas-body ul.navbar-nav {
		margin-bottom: -6px;
	}
	
	.offcanvas-body ul.navbar-nav li.nav-item {
		margin-right: 5px;
	}
	
	.offcanvas-body ul.navbar-nav li.nav-item:last-child{
		margin-right: 0;
	}

	.offcanvas-body ul.navbar-nav li.nav-item a {
		color: #fff;
		background:#3d6c06;
		text-decoration: none;
		padding: 8px 20px 10px;
		border-radius: 5px 5px 0 0;
		transition: .8s;
	}
	
	.offcanvas-body ul.navbar-nav li.nav-item a:hover {
		background: #75bd9e;
	}
	
	.navbar-brand {
		width: 300px;
		height:40px;
		margin-left: 7px;
		padding-top: 0;
	}
	
	.main-image .main-image_logo img {
		width: 220px;
		margin-right: 10px;
	}
	
	.info h2,
	.event h2,
	.recommend h2,
	.projects h2 {
		font-size: 28px;
		margin-bottom: 32px;
		color: #666;
	}

	.top_company h2 {
		font-size: 36px;
		margin-bottom: 32px;
		color: #fff;
	}
	
	.info h2 span {
		font-size: 20px;
	}
	
	.event h2 span,
	.recommend h2 span,
	.projects h2 span {
		font-size: 22px;
		color: #333;
	}
	
	
	.top_company h2 span {
		font-size: 22px;
		color: #fff;
	}
	
	.recommend ul li a {
		transition: .8s;
	}

	
	.recommend ul li a .over-text h3 {
		font-size: 20px;
		text-decoration: none;
	}

	.recommend ul li a .over-text h4 {
		font-size: 18px;
	}
	
	.recommend ul li a .over-text {
		position: absolute;
		top: 0;
		opacity: 0;
		transition: .8s;
		width: 100%;
		height: 100%;
	}

	.recommend ul li a:hover .over-text {
		opacity: 1;
		text-align: center;
		color: #fff;
		transition: .8s;
	}
	
	
	.footer ul li {
		margin: 0 20px;
		padding: 15px 0 16px 0;
		display: inline-block;
		border-bottom: none;
	}

	ul.recommend_img li {
		width:25%;
		float:left;
	}

	ul.company_navi li {
		width:49%;
		list-style:none;
		margin-bottom:5px;
		display:inline-block;
	}

}
@media (min-width: 992px) {
	
	.main-image .back_slide {
		width:100%;
		height:100%;
		display:block;
		position:relative;
	}

	.main-image .back_slide div {
		height:100vh;
	}

	.main-image .top_copy {
		top: 50%; /* 親要素の外側（上辺）から50%内側 */
		left: 50%; /* 親要素の外側（左辺）から50%内側 */
		transform: translate(-50%, -50%); /* 要素の位置を-50%上・-50%左に変える */
		padding-top: 0;
		max-width:1280px;
		width:100%;
	}

	
	.main-image h3 {
		margin-top: 32vh;
		font-weight: bold;
		font-size: 40px;
	}
	
	.main-image .main-image_logo img {
		width: 280px;
		margin-right: 10px;
	}
	
	.event ul,
	.recommend ul,
	.other_events ul {
		margin: 10px 0 0 0;
	}
	
	.event ul li,
	.recommend ul li,
	.other_events ul li {
		width: 24.4%;
		margin-right: 0.8%;
	}

	.event ul li:nth-child(2n+2),
	.recommend ul li:nth-child(2n+2),
	.other_events ul li:nth-child(2n+2) {
		margin-right: 0.8%;
	}

	.event ul li:nth-child(4n+4),
	.recommend ul li:nth-child(4n+4),
	.other_events ul li:nth-child(4n+4) {
		margin-right: 0;
	}
	
	.projects ul {
		margin: 10px 0 0 0;
	}
	
	/*.company_box {
		height: 50vh;
	}
	*/
	.company_text {
		position: absolute;
		background: url("images/top_company_back.png");
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		padding-top: 23%;
		padding-bottom: 0;
	}


	.single_content {
		margin-top:100px;
		margin-bottom:80px;
		padding:20px 15px ;
		box-shadow: 0px 0px 15px 0px rgba(136, 136, 136, .1);
		border-radius:20px;
	}

	.page_content {
		margin-top:50px;
		margin-bottom:80px;
	}

	.page_content h1,
	.page_content_02 h1 {
		font-size:26px;
		margin-bottom:30px;
	}

	.page_content_02 h2 {
		font-size:24px;
	}

	.other_recommend ul li {
		width: 19.2%;
		margin-right: 1%;
	}
	
	.other_recommend ul li dl dt p {
		font-size:14px;
	}

	.other_recommend ul li:nth-child(3n+3) {
		margin-right:1%;
	}

	.other_recommend ul li:nth-child(5n+5) {
		margin-right:0;
	}

}
@media (min-width: 1200px) {

}
@media (min-width: 1400px) {

	
	.main-image h3 {
		/*margin-top: 48%;*/
		font-size: 44px;
	}

}