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

.mainimage {
	position: relative;
	width: 100%;
	height: 600px;
	background: #FFF url("../image/top/main.jpg") no-repeat center center;
	background-size: cover;
	z-index: 10;
}

.mainimage h2 {
	position: absolute;
	text-align: center;
	font-size: 2.6rem;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 90%;
	height: 3.5rem;
	color: #FFF;
	letter-spacing: 0.1em;
	line-height: 1.5;
	text-shadow: 0 -1px #000, 0 -2px #000, 0 4px 8px rgba(0, 0, 0, 1);
	font-family: “Times New Roman”, “游明朝”, YuMincho, “ヒラギノ明朝 ProN W3”, “Hiragino Mincho ProN”, “HG明朝E”, serif;
	font-weight: bold;
	animation-name: fadein;
	animation-duration: 2s;
}

@keyframes fadein {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.con1 {
	background: #fff4e3 url("../image/top/midasi_back.png") no-repeat center center;
	width: 100%;
	padding: 40px;
	text-align: center;
}

.con1 p {
	padding: 5px;
}

.con2 {
	background-color: #FFFFFF;
	width: 100%;
	padding: 40px;
	text-align: center;
}

.con2 div {
	max-width: 1024px;
	width: 100%;
	display: flex;
	margin: auto;
}

.con2 div>p {
	max-width: 500px;
	width: 100%;
	margin: 5px;
}

.con2image {
	max-width: 497px;
}

.con3 {
	background-color: #FFFFFF;
	width: 100%;
	padding: 40px;
	text-align: center;
}

.con3 img {
    max-width: 100%;
}

.con4 {
	width: 100%;
	height: auto;
	background: #FFF url("../image/common/sakura.jpg") no-repeat center center;
	background-size: cover;
}
.con4title{
	font-family: YuGothic;
	font-weight: bold;
}
.hoken-logo {
    width: 45%;
    display: inline-block;
}
.hoken-logo img {
    width: 100%;
}
.con4in {
	max-width: 1050px;
	width: 100%;
	padding: 40px;
	display: flex;
	margin: auto;
}
/*
.con4in>div {
	max-width: 508px;
	width: 100%;
	margin: 0px 8px 0px 8px;
	background-color: #ffffff;
	text-align: center;
	padding: 30px;
} */
.con4-half-inner {
    width: 48%;
    background: white;
    margin: 0px auto;
    text-align: center;
    padding: 10px;
}
.con4in>div>p>img {
	margin: 5px;
}

.con4in>div>p {
	margin-top: 5px;
}

.con5 {
	padding: 40px 0px 40px 0px;
	text-align: center;
}

.con5 img {
	max-width: 329px;
	width: 95%;
}



#title1 {
	max-width: 688px;
}

#title2 {
	max-width: 425px;
}

#title4 {
	max-width: 388px;
}

#title5 {
	max-width: 379px;
}

.banner-box {
	display: flex;
	justify-content: center;
	max-width: 1200px;
	margin: 0 auto;
	flex-wrap: wrap;
	align-items: center;
}

@media screen and (max-width: 480px) {
	.banner-box {
		flex-direction: column;
	}
	p.net-hoken {
		text-align: center;
	}
}