@media screen and (min-width:768px) {
	main section article h2 { text-align: center; }
}
main section.kv {
	background: url(../img/top/bg-kv-sp.png) no-repeat;
	background-size: 100% 100%;
	color: #26466d;
	width: 100%;
	font-weight: 700;
	@media screen and (min-width:768px) {
		padding: 40px 0;
		background: url(../img/top/bg-kv-pc.png) no-repeat;
		background-size: 100% 100%;
	}
	article {
		display: grid;
		gap: 10px;
		color: #26466d;
		@media screen and (min-width:768px) { grid-template-columns: 1fr 320px;}
		ul.target {
			order: 3;
			display: grid;
			gap: 10px;
			grid-template-columns: repeat(2, 1fr);
			@media screen and (min-width: 768px) {
				order: 0;
				width: 90%;
				position: relative;
				z-index: 1;
			}
			li a {
				background-color: #26466d;
				color: #f4df7c;
				font-size: 3.5vw;
				line-height: 1.3;
				text-decoration: none;
				text-align: center;
				padding: 15px;
				display: block;
				border-radius: 45px;
				@media screen and (min-width:768px) {
					padding: 20px;
					font-size: 150%;
					border-radius: 60px;
				}
			}
		}
		p {
			font-size: 5vw;
			line-height: 1.5;
			@media screen and (min-width:768px) {
				font-size: 3vw;
			}
			@media screen and (min-width:950px) {
				order: 0;
				font-size: 200%;
			}
			a {
				display: block;
				text-align: right;
				font-size: 87.5%;
			}
		}
		picture {
			width: 80%;
			margin: 0 auto;
			@media screen and (min-width:768px) { 
               		width: 135px;
               		position: relative;
			}
			img {
				@media screen and (min-width:768px) {
					position: absolute;
					width: 170%;
					top: 50%;
					transform: translateY(-50%);
					right: 0;
				}
               	}
		}
	}
}
main section.kv article ul li:last-child a { color: #f7bdac; }
main section {
	@media screen and (min-width: 768px) { padding: 40px 0; }
}
main section.survey article > ul {
	display: grid;
	gap: 20px;
	color: #333333;
	text-align: center;
	@media screen and (min-width:768px) {
		grid-template-columns: repeat(6, 1fr);
	}
	> li {
		border-radius: 20px;
		padding: 20px;
		a {
			line-height: 1.2;
		}
		> h3 {
			color: #333333;
			font-size: 112.5%;
			font-weight: 700;
			line-height: 1.5;
			span {
				font-size: 87.5%;
				display: inline-block;
				font-weight: 400;
				margin-left: 0.5em;
			}
		}
		li.public, li.medical {
			a:first-child {
				color: #ffffff; 
				font-weight: 700;
				padding: 0.5em 0.9em;
				border-radius: 20px;
				text-decoration: none;
			}
		}
		li.public a:first-child { background-color: #ff9999; }
		li.medical a:first-child { background-color: #5b9bd5; }
	}
	> li:first-child,  > li:last-child {
		background-color: #d1e3b3;
		@media screen and (min-width:768px) {
			grid-column: 1/7;
			h3 {
				display: inline-block;
				margin-right: 1.5em;
			}
		}
	}
	li.consult { background-color: #fff8dc; }
	li.report {
		background-color: #bbd6ee;
		a {
			background-color: #5b9bd5;
			color: #ffffff; 
			font-weight: 700;
			padding: 0.5em 1em;
			border-radius: 20px;
			text-decoration: none;
			&:last-child {margin-top: 5px;}
		}
	}
	> li:nth-child(4), > li:nth-child(5), > li:nth-child(6) { background-color: #c4e0b2; }
	> li:nth-child(7), > li:nth-child(8), > li:nth-child(9) { background-color: #e1efd8; }
}
main section.survey article > ul {
	li.consult, li.report, li.request {
		p {color: #fb0000;}
		ul {
			display: grid;
			gap: 5px;
			grid-template-columns: repeat(2, 1fr);
		}
	}
}
main section.survey article > ul li.awareness ul {
	li:first-child a, li:nth-child(2) a {
		color: #ffffff; 
		font-weight: 700;
		padding: 0.5em 1em;
		border-radius: 20px;
		background-color: #70ad47;
		text-decoration: none;
		margin-bottom: 5px;
	}
}
main section.survey article > ul li.request ul li:last-child {margin-top: 5px;}
main section.survey article > ul li.training {
	ul {
	line-height: 1.5;
	text-align: left;
		span {
			color: #ffffff;
			font-size: 75%;
			padding: 0 0.5em;
			margin-right: 5px;
			border-radius: 10px;
			&.accepting, &.upcoming { background-color: #fd841c; }
			&.ended, &.accepting-ended { background-color: #8d8b8b; }
		}
	}
	> p {
		text-align: right;
		margin-top: 10px;
	}
}
@media screen and (min-width:768px) {
	main section.survey article > ul {
		li.consult { grid-column: 1/3; }
		li.report { grid-column: 3/5; }
		li.request { grid-column: 5/7; }
		li.awareness { grid-column: 1/4; }
		li.training { grid-column: 4/7; }
		li.report, li.request {
			ul {
				 display: flex ;
				 justify-content: space-around;
			}
			h3 { margin-bottom: 1.2em; }
		}
		li.awareness {
			ul {
				width: 85%;
                		margin: 5px auto 0;
				text-align: left;
				li:first-child, li:nth-child(2) {
					position: relative;
					margin: 2em 0;
					&::after {
						content:'';
						display: block;
						width: 7em;
						height: 4.5em;
						position: absolute;
						top: -1em;
						right: 0.5em;
					}
				}
				li:first-child::after {
					background: url(../img/top/img-awareness1.png) no-repeat;
					background-size: contain;
				}
				li:nth-child(2)::after {
					background: url(../img/top/img-awareness2.png) no-repeat;
					background-size: contain;
				}
			}
		}
		> li:nth-child(7) { grid-column: 1/3; text-align: left;}
		> li:nth-child(8) { grid-column: 3/5; text-align: left;}
		> li:nth-child(9) { grid-column: 5/7; text-align: left;}
		li.training ul {
			overflow-y: auto;
			height: 13em;
			margin-top: 5px;
			li { margin-bottom: 7px; }
		}
		li.request ul li:last-child { margin-top: 0; }
	}
}
main section.other article {
	@media screen and (min-width:768px) {
		display: grid;
		gap: 0 40px;
		grid-template-columns: 30% auto;
		justify-content: center;
	}
	p {
		margin-bottom: 20px;
		@media screen and (min-width:768px) {
			margin-bottom: 30px;
			text-align: center;
		}
		&:has(a){
			margin: 0 auto 20px;
			a {
				font-size: 5svw; 
				padding: 20px 1.5em;
				color: #ffffff;
				background-color: #7db72a;
				text-decoration: none;
				height: 100px;
				align-content: center;
				border-radius: 50px;
				font-weight: 700;
				line-height: 1.3;
				@media screen and (min-width:768px) { font-size: 137.5%; }
			}
		}
	}
}
@media screen and (min-width:768px) {
	main section.other article p:last-child {
		grid-row: 1 / 4;
		margin-bottom: 0;
	}
}
main section.news article ul {
	margin-bottom: 60px;
	@media screen and (min-width:768px) {
		width: fit-content;
		margin: 0 auto 60px;
	}
	li {
		&:not(:last-child) { margin-bottom: 1em; }
		time {
			color: #669933;
			font-weight: 700;
			&::after {
				color: rgb(255, 255, 255);
				background-color: rgb(125, 183, 42);
				content: "機構のお知らせ";
				margin-left: 0.5em;
				font-size: 75%;
				width: 9em;
				display: inline-block;
				text-align: center;
				padding: 1px 0.5em;
				border-radius: 12px;
			}
		}
		&.survey time::after {
			background-color: rgb(125, 181, 201);
			content: "支援センター事業";
		}
		&.others time::after {
			background-color: #f7b52c;
			content: "その他の事業";
		}
	}
}
main section.news article > p > a {
	color: #ffffff;
	background-color: #7db72a;
	padding: 10px 1.5em;
	font-weight: 700;
	text-decoration: none;
	border-radius: 25px;
	width: fit-content;
	margin: 0 auto;
	display: block;
}
main section.news article ul li p {
	em {
		background-color: #e74e59;
		color: #ffffff;
		font-size: 87.5%;
		padding: 0 0.5em;
		margin-right: 0.5em;
		border-radius: 5px;
		font-style: normal;
		font-weight: 700;
	}
	span {
		background-color: #f7747e;
		color: #ffffff;
		font-size: 87.5%;
		padding: 0 0.5em;
		margin-right: 0.5em;
		border-radius: 5px;
	}
	a { display: inline;}
}
@media screen and (min-width:768px) {
	main section.news article ul li {
		display: grid;
		gap: 0 1em;
		grid-template-columns: auto 1fr;
	}
}