@charset "UTF-8";
/*
 * news.css
 *
 */

/* !お知らせ一覧
---------------------------------------------------------- */
.newsIndex {
	width:100%;
	padding:80px 50px 100px 50px;
}
	.newsIndex div.inner {
		width:100%;
		max-width:1200px;
		display: flex;
		margin:0 auto ;
	}
		.newsIndex div.inner div.left {
			width:37%;
		}
			.newsIndex div.inner div.left h2 {
				font-size:40px;
				font-weight: 700;
				line-height: 1.6;
				color: #65B401;
				letter-spacing: 0.04em;
				position: relative;
				padding-left:60px;
				margin-bottom: 50px;
			}
				.newsIndex div.inner div.left h2:before {
					position: absolute;
					content:"";
					width:40px;
					height: 1px;
					background: #65B401;
					top:50%;
					left:0;
				}
		.newsIndex div.inner div.right {
			width:63%;
		}
			.newsIndex div.inner div.right div.newsList {
				display:block;
				width:100%;
			}
					.newsIndex div.inner div.right div.newsList a dl {
						width:100%;
						line-height:1.8;
						display:flex;
						flex-wrap:wrap;
						padding-right: 40px;
						position: relative;
						border-bottom:1px solid #E2E2E2;
					}
					.newsIndex div.inner div.right div.newsList a dl:before {
						position: absolute;
						content:"";
						width:24px;
						height: 1px;
						background: #65B401;
						bottom:-1px;
						right:0;
						transition:.2s;
					}
						.newsIndex div.inner div.right div.newsList a dl dt {
							width:100%;
							padding:1.3em 0 0 0;
							transition: .6s;
						}
						.newsIndex div.inner div.right div.newsList a dl dd {
							width:100%;
							padding:0.4em 0 1.3em 0;
							transition: .6s;
						}
							.newsIndex div.inner div.right div.newsList a:hover dl dt {
								color:#65B401;
							}
							.newsIndex div.inner div.right div.newsList a:hover dl dd {
								color:#65B401;
							}
						.newsIndex div.inner div.right div.newsList a dl dd span.arrow {
							position: absolute;
							display: block;
							width: 20px;
							height: 20px;
							background: #65B401;
							border-radius: 50%;
							top:50%;
							right:2px;
							margin-top: -10px;
							transition:.2s;
						}
							.newsIndex div.inner div.right div.newsList a dl dd span.arrow:before {
								content: "";
								width: 5px;
								height: 5px;
								border: 1px solid #FFF;
								position: absolute;
								box-sizing: border-box;
								border-left: 0;
								border-bottom: 0;
								transform: rotate(45deg);
								transform-origin: top right;
								top: 50%;
								right: 7px;
							}
					.newsIndex div.inner div.right div.newsList a:hover dl:before {
						width:34px;
					}
						.newsIndex div.inner div.right div.newsList a:hover dl dd span.arrow {
							position: absolute;
							display: block;
							width: 20px;
							height: 20px;
							background: #65B401;
							border-radius: 50%;
							top:50%;
							right:7px;
							margin-top: -10px;
							transition:.2s;
						}

@media screen and (max-width:1039px){
.newsIndex {
	padding:60px 30px 80px 30px;
}
		.newsIndex div.inner div.left {
			width:42%;
		}
			.newsIndex div.inner div.left h2 {
				font-size:32px;
				margin-bottom: 40px;
			}
		.newsIndex div.inner div.right {
			width:58%;
		}
							.newsIndex div.inner div.right div.newsList a:hover dl dt {
								color:#111;
							}
							.newsIndex div.inner div.right div.newsList a:hover dl dd {
								color:#111;
							}
					.newsIndex div.inner div.right div.newsList a:hover dl:before {
						width:24px;
					}
						.newsIndex div.inner div.right div.newsList a:hover dl dd span.arrow {
							right:2px;
						}
}

@media screen and (max-width:767px){
.newsIndex {
	padding:40px 25px 70px 25px;
}
	.newsIndex div.inner {
		flex-wrap: wrap;
	}
		.newsIndex div.inner div.left {
			width:100%;
			margin-bottom: 20px;
		}
			.newsIndex div.inner div.left h2 {
				font-size:24px;
				padding-left:35px;
				margin-bottom: 0;
			}
				.newsIndex div.inner div.left h2:before {
					width:20px;
					top:50%;
				}
		.newsIndex div.inner div.right {
			width:100%;
		}
			.newsIndex div.inner div.right div.newsList {
				display:block;
				width:100%;
			}
					.newsIndex div.inner div.right div.newsList a dl {
						padding-right: 35px;
					}
						.newsIndex div.inner div.right div.newsList a dl dt {
							padding:1.1em 0 0 0;
						}
						.newsIndex div.inner div.right div.newsList a dl dd {
							padding:0.4em 0 1.1em 0;
						}
}

/* !お知らせ記事
---------------------------------------------------------- */
.newsArticle {
	width:100%;
	padding:80px 50px 100px 50px;
}
	.newsArticle div.inner {
		width:100%;
		max-width:1000px;
		margin:0 auto ;
	}

ul.articleNavi{
	width:60%;
	margin-left:auto;
	margin-right:auto;
}
	ul.articleNavi li {
		width:33.3%;
		float:left;
	}
	ul.articleNavi li a{
		display:block;
		height:56px;
		line-height:56px;
		background:#65B401;
		color:#FFF;
		text-align:center;
		-webkit-transition: all .6s;
		transition: all .6s;
		margin-left:1px;
	}
		ul.articleNavi li:first-child a{
			border-radius: 6px 0 0 6px;
		}
		ul.articleNavi li:last-child a{
			border-radius: 0 6px 6px 0;
		}
	ul.articleNavi li a:hover{
		opacity:.7;
	}
	
.articleBody {
	margin-bottom:20px;
}
	.articleBody h2.articleTit{
		font-size:20px;
		font-weight:700;
		line-height:1.6;
		letter-spacing: 0;
		border-bottom:1px solid #E2E2E2;
		padding-bottom:1em;
		padding-left:0;
		margin-bottom:10px;
	}
	.articleBody p.date{
		text-align:right;
		color:#999;
		margin-bottom:30px;
	}
	.articleBody div.txt p {
		margin-bottom:30px;
	}
	.articleBody div.txt a {
		color:#65B401;
		text-decoration:underline;
		transition:.6s;
	}
		.articleBody div.txt a:hover {
			opacity:.7;
		}
		
.imgBlock {
	text-align:center;
}
.imgBlock img {
	display:block;
	width:auto;
	max-width:80%;
	margin:0 auto 40px auto;
}

.fileBlock a {
	color:#65B401;
	transition:.6s;
}
	.fileBlock a:hover {
		opacity:.7;
	}

@media screen and (max-width:1039px){
.newsArticle {
	padding:60px 30px 80px 30px;
}
	
	ul.articleNavi li a:hover{
		opacity:1;
	}
	
	.articleBody h2.articleTit{
		font-size:18px;
	}
		.articleBody div.txt p a:hover {
			opacity:1;
		}
	
	.fileBlock a:hover {
		opacity:1;
	}
}

@media screen and (max-width:767px){
.newsArticle {
	padding:40px 25px 70px 25px;
}
	
ul.articleNavi{
	width:100%;
	font-size:12px;
}
	ul.articleNavi li a{
		height:50px;
		line-height:50px;
	}
	
	.articleBody h2.articleTit{
		font-size:16px;
	}

.imgBlock img {
	max-width:90%;
}
}