@charset "utf-8";


/*=============================
メインビジュアル
=============================*/
#slide {
	/*	background-color: #fff;*/
	position: relative;
	width: 100%;
	height: auto;
	z-index: 0;
	margin-top: 3.625rem;
}

#slide::before {
	content: "";
	display: block;
	padding-top: 40%;
}

#slide ul {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	position: absolute;
	top: 0;
	left: 0;
}

#slide ul li {
	height: auto;
	position: absolute;
	left: 0;
	top: 0;
}


.fixed {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: auto;
	z-index: 9;
}

#slide ul li img,
.fixed img {
	display: block;
	width: 100%;
	height: auto;
}

/*=============================
お知らせ・活動報告・議会報告
=============================*/
#news ol li,
#double ol li {
	text-align: left;
}

#news ol li:not(:last-of-type),
#double ol li:not(:last-of-type) {
	padding-bottom: 1.5rem;
}

#news ol li p,
#double ol li p {
	padding-top: 0.25rem;
}

#double section {
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
	padding-left: 1.25rem;
	padding-right: 1.25rem;
}

#double .todetail {
	text-align: right;
	margin-top: 2rem;
}

.l_content a {
	color: #333;
}

.l_content .todetail a {
	color: #fff;
	background-color: #333;
	padding: 0.25rem 0.75rem;
}

.r_content {
	background-color: #0b3954;
	color: #fff;
}

.r_content a {
	color: #fff;
}

.r_content .todetail a {
	color: #333;
	background-color: #fff;
	padding: 0.25rem 0.75rem;
	vertical-align: middle;
}
.group_3 {
border: #fff solid 1px;
}

/*=============================
議員団便り・民報・アルバム
=============================*/
#magazine {
	background: linear-gradient(180deg, #f3f3f3 0%, #f3fbfd 100%);
}

#magazine ul li {
	max-width: 20rem;
	margin: 0 auto;

}

#magazine ul li:not(:last-of-type) {
	margin-bottom: 1.5rem;
}

#magazine dl {
	position: relative;
}

#magazine dt {
	width: 100%;
	font-size: 1.25rem;
	position: absolute;
	bottom: 0;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	background-color: rgba(11, 57, 84, 0.7);
	color: #fff;
}

#magazine dd img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 20rem;
}

#magazine p {
	text-align: left;
	padding-top: 0.5rem;
	font-size: 0.9rem;
	color: #333;
}

/*=============================
リンク先一覧
=============================*/
#link ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

#link ul li {
	flex-shrink: 0;
	flex-grow: 0;
	width: 48%;
	max-width: 13.5rem;
	margin-bottom: 1rem;
}
#link ul li:last-of-type {
	margin-bottom: 0;
}

#link ul li a,
#link ul li a img {
	display: block;
	width: 100%;
	height: auto;
}



/*===============================================
=================================================
=================================================
================画面幅広い場合に適用===============
=================================================
=================================================
===============================================*/

@media (min-width:768px) {

	#slide {
		margin-top: 0;
	}

	#news ol li:not(:last-of-type) {
		padding-bottom: 2rem;
	}

	#double {
		background: linear-gradient(90deg, #fff 0%, #fff 50%, #0b3954 50%, #0b3954 100%);
	}

	#double section {
		padding-top: 5rem;
		padding-bottom: 5rem;
		padding-left: 0;
		padding-right: 0;
	}

	.double_wrap {
		display: flex;
		max-width: 960px;
		padding-left: 2.5rem;
		padding-right: 2.5rem;
		margin: 0 auto;
	}

	#double section {
		flex-grow: 0;
		flex-shrink: 0;
		flex-basis: 50%;
	}

	#double section h2 {
		text-align: left;
		padding-bottom: 0;
		margin-bottom: 3rem;
	}

	#double section.l_content {
		padding-right: 2.5rem;

	}

	#double section.l_content h2 {
		border-bottom: 2px solid #333;

	}

	#double section.r_content {
		padding-left: 2.5rem;
	}

	#double section.r_content h2 {
		border-bottom: 2px solid #fff;
	}

	#double .todetail {
		margin-top: 3rem;
	}

	#magazine ul {
		display: flex;
		justify-content: space-between;
	}

	#magazine ul li {
		flex-grow: 0;
		flex-shrink: 0;
		flex-basis: 32%;
	}
	#magazine dt {
		font-size: 1.5rem;
		padding-top: 1rem;
		padding-bottom: 1rem;
	}
	#magazine p {
		padding-top: 1rem;
	}
	#link ul {
		justify-content: space-between;
	}
	#link ul li {
		width: 23%;
	}
}