@charset "utf-8";
#hakusho2027 {
	color: #555;
	font-size: 14px;
}

/*----- COMMON -----*/
#hakusho2027 img {
	width: 100%;
}

#hakusho2027 a {
	font-size: inherit;
	text-decoration: none;
}

#hakusho2027 ::selection {
	color: #FFF;
	background: #ff9541;
}

#hakusho2027 {
	> div {
		position: relative;
		margin: 0 auto;
		max-width:800px;

		img {
			width: 100%;
		}

		.cover {
			display: block;
			position: absolute;
			width: 60%;
			height: 6.5%;
			left: 20%;
			bottom: 5.8%;
			background-color: #FFF;
            text-align: center;
            padding-top: 16px;
            font-size: 2.1rem;
            color: #ff5f97;
            font-weight: bold;
		}
		.info {
            text-align: center;
            padding: 8px;
            font-size: 1.4rem;
            color: #ff5f97;
            font-weight: bold;
		}

		.info_intro {
            text-align: center;
            padding: 8px;
            font-size: 1.2rem;
            color: #ff5f97;

		}
	}
	h1 {
		margin: 24px auto;
		padding: 4px 8px;
		width: fit-content;
		color: #33619f;
		text-align: center;
		font-size: 2rem;
		border-bottom: 2px solid #33619f;
	}

	.note {
		margin: 24px auto;
		padding: 4px 8px;
		width: fit-content;
		color: #33619f;
		text-align: center;
		font-size: 1.4rem;
		}

		ul {
		margin: 24px auto;
		padding: 4px 8px;
		width: fit-content;
		color: #33619f;
		text-align: left;
		font-size: 1.4rem;
		font-weight: 600;
		}

	.link_list {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		
		a {
			margin: 8px;
			padding: 20px 8px;
			width: 30%;
			color: #FFF;
			font-size: 1.2rem;
			font-weight: 600;
			text-align: center;
			border-radius: 8px;
			background: #33619f;
		}
	}
}

@media screen and (max-width: 1199px){
	/*bootstrapを使用する場合。幅を1200pxとして
	左右に15pxずつpaddingをつけている為*/
}
@media screen and (max-width: 1169px){
	/*bootstrapを使用しない場合*/
}
	
@media screen and (max-width: 1024px){
}

@media (max-width: 767px){
	#hakusho2027 {
	> div {
		p {
			padding-top: 8px;
			font-size: 1.4rem;
		}
	}
}