@charset "utf-8";

/*キービジュアル*/
.keyvisual{
	margin-bottom: 50px;
}
.keyvisual img{
	width: 100%;
	height: auto;
}
.keyvisual-sp{
	display: none;
}

/*あいさつ*/
.greeting{
	max-width: 1200px;
	width: 75%;
	margin: 0 auto;
	padding-top: 40px;
	padding-bottom: 40px;
	
	background: url("../image/bg_greeting01.jpg");
	background-repeat: no-repeat;
	background-size: 560px;
	background-position: 100% 50%;
	margin-bottom: 20px;
}
.message_g{
	max-width: 1200px;
	width: 75%;
	margin: 0 auto;
	padding-top: 40px;
	padding-bottom: 40px;
	
	background: url("../image/bg_greeting02.jpg");
	background-repeat: no-repeat;
	background-size: 560px;
	background-position: 0 5%;
	margin-bottom: 20px;
}
.achivement_g{
	max-width: 1200px;
	width: 75%;
	margin: 0 auto;
	padding-top: 40px;
	padding-bottom: 40px;
	
	background: url("../image/bg_greeting03.jpg");
	background-repeat: no-repeat;
	background-size: 560px;
	background-position: 100% 5%;
	margin-bottom: 20px;
}
.greeting-text{
	width: 500px;
}
.greeting-text-right{
	text-align: right;
}
h3{
	font-size: 30px;
	padding-bottom: 20px;
	
	background: linear-gradient(110deg, #3561ac, #0186af 45%, #0186af);
	-webkit-background-clip: text;
	color: transparent;
}
.h3_2{
	font-size: 30px;
	padding-bottom: 20px;
	
	background: linear-gradient(-110deg, #3561ac, #0186af 45%, #0186af);
	-webkit-background-clip: text;
	color: transparent;
}
.h3_br{
	display: none;
}
.greeting p:nth-of-type(1),
.message_g p:nth-of-type(1),
.achivement_g p:nth-of-type(1){
	font-size: 16px;
	line-height: 24px;
	text-shadow: #fff 2px 0px, #fff -2px 0px, #fff 0px -2px, #fff 0px 2px, #fff 2px 2px , #fff -2px 2px, #fff 2px -2px, #fff -2px -2px, #fff 1px 2px, #fff -1px 2px, #fff 1px -2px, #fff -1px -2px, #fff 2px 1px, #fff -2px 1px, #fff 2px -1px, #fff -2px -1px;
}
.greeting-button01 a{
	width: 180px;
	padding: 5px 8px;
	margin: 20px 0 20px 10px;
	
	text-align: center;
	border: 2px solid #0186af;
	
	color: #0186af;
	background-color: #FFF;
}
.greeting-button02 a{
	width: 230px;
	padding: 5px 8px;
	margin: 20px 10px 20px 0;
	float: right;
	
	text-align: center;
	border: 2px solid #0186af;
	
	color: #0186af;
	background-color: #FFF;
}
.greeting-button03 a{
	width: 200px;
	padding: 5px 8px;
	margin: 20px 0 20px 10px;
	
	text-align: center;
	border: 2px solid #0186af;
	
	color: #0186af;
	background-color: #FFF;
}
.greeting-button01 a:hover{
	opacity: .7;
}
.greeting-button02 a:hover{
	opacity: .7;
}
.greeting-button03 a:hover{
	opacity: .7;
}

/*バナー*/
.menu-banner{
	max-width: 1200px;
	width: 75%;
	margin: 80px auto 50px auto;
	
	text-align: center;
	overflow-x: visible;
}
.banner01{
	margin-bottom: 80px;
}
.banner01 a:nth-of-type(1) img{
	width: 95%;
	height: auto;
	margin-bottom: 20px;
	margin-top: 10px;
}
.banner01 a:nth-of-type(2){
	display: none;
}

.banner02{
	height: 350px;
	
	border-radius: 10px;
	box-shadow: 0 0 10px 3px rgba(0,0,0,.1);
	
	margin: 15px auto;
	padding: 0 0 0 30px;
	
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
}

.banner02-left{
	min-width: 380px;
	margin: 0;
}
h4{
	font-size: 26px;
	color: #3361AC;
	margin-bottom: 5px;
}
.h4-bottom{
	margin-bottom: 20px;
}
.contact-box{
	display: flex;
	justify-content: center;
}

.tel{
	width: 180px;
	height: 180px;
	border: 1px solid #CCC;
	margin: 0 10px;
}
.h5_01{
	height: 40px;
	color: #FFF;
	background-color: #3361AC;
	line-height: 40px;
	font-size: 18px;
}
.tel-main p:nth-of-type(1){
	padding: 30px 0 15px 0;
	color: #3361AC;
	font-size: 20px;
	font-weight: bold;
}
.tel-main p:nth-of-type(2){
	width: 90%;
	margin: 0 auto;
	color: #000;
	font-size: 12px;
	font-weight: normal;
}
.mail{
	width: 180px;
	height: 180px;
	border: 1px solid #CCC;
	margin: 0 10px;
}
.h5_02{
	height: 40px;
	color: #FFF;
	background-color: #0085AE;
	line-height: 40px;
	font-size: 18px;
}
.mail01 a,.mail02 a{
	padding-top: 10px;
	color: #3361AC;
	font-size: 18px;
	font-weight: bold;
	text-decoration: underline;
}
.mail01_span,.mail02_span{
	width: 90%;
	color: #000;
	font-size: 12px;
	font-weight: normal;
}
.mail01 a:hover,.mail02 a:hover{
	opacity: .7;
	text-decoration: none;
}


.button{
	width: 50%;
	margin: 0;
}
.button img{
	width: 80%;
	height: auto;
	min-width: 200px;
}
.button02,.button03{
	display: none;
}

.banner01 a img:hover{
	opacity: .7;
}

.banner02_br{
	display: none;
}


/*下部*/
.bottom-img img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
.bottom-img-sp{
	display: none;
}


/*==========レスポンシブ==========*/
@media screen and (max-width: 1400px){
	.menu-banner{
		width: 85%;
	}
	.button{
		display: none;
	}
	.button02{
		width: 40%;
		display: block;
	}
	.button02 img{
		width: 80%;
		height: auto;
	}
}
@media screen and (max-width: 1100px){
	.greeting,.message_g,.achivement_g{
		width: 100%;
	}
	.greeting-text{
		margin-left: 70px;
	}
	.greeting-text-right{
		margin-right: 70px;
	}
	.menu-banner{
		width: 90%;
	}
	.banner01 a:nth-of-type(1) img{
		width: 100%;
	}
	.button02 img{
		width: 75%;
		height: auto;
	}
}
@media screen and (max-width: 801px){
	.keyvisual{
		margin-bottom: 20px;
	}
	.greeting{
		width: 100%;
		background-repeat: no-repeat;
		background-position: 100% 100%;
		background-size: 90%;
		margin-bottom: 30px;
		padding-top: 60px;
	}
	.message_g{
		width: 100%;
		background-repeat: no-repeat;
		background-position: 0 100%;
		background-size: 85%;
		margin-bottom: 30px;
		padding-top: 60px;
	}
	.achivement_g{
		width: 100%;
		background-repeat: no-repeat;
		background-position: 100% 100%;
		background-size: 95%;
		margin-bottom: 30px;
		padding-top: 60px;
	}
	.greeting-text{
		width: 400px;
	}
	.greeting-button01 a,
	.greeting-button02 a,
	.greeting-button03 a{
		font-weight: bold;
	}
	
	.menu-banner{
		width: 95%;
	}
	.banner{
		flex-direction: column;
	}
	.banner01 a:nth-of-type(1){
		display: none;
	}
	.banner01 a:nth-of-type(2){
		display: block;
	}
	.banner01 a:nth-of-type(2) img{
		width: 90%;
		height: auto;		
	}
	.banner02{
		flex-direction: column;
		justify-content: center;
		
		width: 95%;
		height: auto;
		padding: 40px 0;
		margin-bottom: 20px;
	}
	.tel,.mail{
		margin-left: 10px;
		margin-right: 10px;
		margin-bottom: 20px;
	}
	.button02{
		width: 100%;
	}
	.button02 img{
		max-width: 380px;
		margin: 10px;
	}
}
@media screen and (max-width: 712px){
	.greeting{
		background-size: cover;
	}
	.message_g{
		background-size: cover;
	}
	.achivement_g{
		background-size: cover;
	}
}
@media screen and (max-width: 601px){
	.greeting{
		width: 100%;
		background: url("../image/bg_greeting01_sp.jpg");
		background-repeat: no-repeat;
		background-position: 100% 100%;
		background-size: 100%;
		padding-bottom: 150px;
		padding-top: 0;
	}
	.message_g{
		width: 100%;
		background: url("../image/bg_greeting02_sp.jpg");
		background-repeat: no-repeat;
		background-position: 0 100%;
		background-size: 100%;
		padding-bottom: 180px;
		padding-top: 0;
	}
	.achivement_g{
		width: 100%;
		background: url("../image/bg_greeting03_sp.jpg");
		background-repeat: no-repeat;
		background-position: 100% 100%;
		background-size: 100%;
		padding-bottom: 180px;
		padding-top: 0;
	}
	h3,.h3_2{
		margin: 0 auto;
		text-align: center;
		padding-top: 15px;
		font-size: 25px;
	}
	.greeting-button01 a,.greeting-button03 a{
		margin: 20px auto;
	}
	.greeting-button02 a{
		margin: 20px auto;
		float: none;
	}
	.greeting-text,.greeting-text-right{
		width: 85%;
		margin: 0 auto;
		text-align: left;
	}
	.gtr_br{
		display: none;
	}
	
	.contact-box{
		flex-direction: column;
		align-items: center;
		margin-bottom: 20px;
	}
	.tel,.mail{
		width: 100%;
		height: auto;
		box-sizing: border-box;
	}
	.tel-main {
		padding-bottom: 30px;
	}
	.mail-main {
		padding: 20px 0 30px;
	}
	.mail01_span, .mail02_span {
		width: 100%;
	}
}
@media screen and (max-width: 501px){
	.keyvisual{
		display: none;
	}
	.keyvisual-sp{
		display: block;
	}
	.keyvisual-sp img{
		width: 100%;
		height: auto;
	}
	
	.greeting{
		padding-bottom: 150px;
	}
	.message_g{
		padding-bottom: 150px;
	}
	.achivement_g{
		padding-bottom: 150px;
	}
	.h3_br{
		display: block;
	}
	
	.menu-banner{
		width: 100%;
	}
	
	.banner01 a:nth-of-type(2) img{
		width: 85%;
	}
	.banner02{
		width: 90%;
		padding: 8%;
	}
	.banner02-left {
		min-width: 100%;
	}
	.banner02_br{
		display: block;
	}
	.button02 img{
		width: 100%;
		margin: 0;
	}
	.h4-bottom{
		font-size: 14px;
	}
	
	.bottom-img{
		display: none;
	}
	.bottom-img-sp{
		display: block;
	}
	.bottom-img-sp img{
		width: 100%;
		height: auto;
		vertical-align: bottom;
	}
}