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

body{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	font-size: 15px;
}
header{
	width: 98%;
	margin: auto;
	display: flex;
	justify-content: space-between;
	margin-top: 5px;
}
footer{
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	background-color: rgba(3,5,119,1.00);
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
}
main{
	width: 100%;
}
img{
	vertical-align: top;
	width: 100%;
}
a{
	text-decoration: none;
}
a:hover{
	opacity: 0.8;
}
table{
	width: 98%;
	margin: auto;
	margin-bottom: 15px;
	border-left: solid thin #534F4F;
	border-bottom: solid thin #534F4F;
}
table tr th{
	border-top: solid thin #534F4F;
	border-right: solid thin #534F4F;
}
.yoko{
	display: flex;
}
.yoko2{
	display: flex;
	justify-content: center;
	margin-bottom: 15px;
}
.contact{
	display:block;
	margin: 15 0;
	padding:10px;
	background: linear-gradient(180deg, rgba(2,85,48,1.00),rgba(6,127,114,1.00));
	font-weight: bold;
	color: #FFFFFF;
	border-radius: 5px;
	text-align: center;
}
.logo{
	width: 50%;
}
.logo img{
	width: 100%;
	min-width: 100px;
	max-width: 200px;
}
.top{
	width: 100%;
}
.top img{
	width: 100%;
}
.img1{
	width: 100%;
	background-color: #f8f9ee;
	padding-top: 30px;
}
.img1 img{
	width: 100%;
}
.contitle{
	width: 100%;
	padding: 10px 0px 10px 0px;
	text-align: center;
	background-color: #FCFB9D;
	border-top: solid 3px #007c73;
}
.contitle img{
	max-width: 270px;
}
.con1{
	padding: 15px 5px 15px 5px;
}
.con1 img{
	width: 100%;
	max-width: 180px; 
}
.con1_r{
	margin-right: 10px;
}
.kouza{
	width: 98%;
	margin: auto;
	margin-top: 30px;
	margin-bottom: 30px;
}
.k1{
	background-color: #29A5B1;
	font-size: 20px;
	font-weight: bold;
	color: #FFFFFF;
}
.k1-set{
	background-color: #051243;
	font-size: 20px;
	font-weight: bold;
	color: #FFFFFF;
}
.k2{
	background-color: #cccccc;
	font-size: 18px;
	text-align: center;
}
.k3{
	display: block;
	width: 70%;
	margin: auto;
	margin-top: 10px;
	border-radius: 10px;
	padding: 5px 0px;
	text-align: center;
	font-size: 18px;
	color: #FFFFFF;
	line-height: 1.3em;
}
.k4{
	width: 90%;
	margin: auto;
	background-color: #29A5B1;
	padding: 15px;
	border-radius: 20px 5px;
	font-weight: bold;
	color: #FFFFFF;
	box-shadow: 4px 4px 3px 1px #cccccc;
}
.k5{
	width: 100%;
	margin-top: 30px;
	text-align: center;
	background-color: #F8E8EF;
	padding-bottom: 30px;
}
.k5 img{
	max-width: 407px;
}
.k6{
	display: block;
	width: 70%;
	margin: auto;
	padding-top: 15px;
	padding-bottom: 15px;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	background-color: #0071bc;
	color: #FFFFFF;
	border-radius: 50px;
}
.gotop{
	width: 98%;
	margin: auto;
	margin-top: 10px;
	margin-bottom: 30px;
	text-align: right;
	font-size: 13px;
	line-height: 1.5em;
}
.f_contact{
	width: 50%;
	margin: auto;
	margin-bottom: 30px;
	font-size: 20px;
}

/*文字*/
.blue{
	color: blue;
	font-size: 18px;
}
.pink{
	color: #F4076E;
	font-size: 18px;
}
.green{
	color: #0A7B5A;
}
/*カラー指定*/
.bg-b{
	background-color: blue;
}
.bg-p{
	background-color: #F4076E;
}
.bg-y{
	background-color: #FCFB9D;
}

/*アニメーション*/
.anim-box{
	display: block;
	width: 75%;
	padding: 10px 5px;
	margin: auto;
	margin-bottom: 15px;
	text-align: center;
	font-size: 23px;
	font-weight: bold;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	background-color: #1BB2F1;
	color: #FFFFFF;
	border-radius: 50px;
}
.anim-box.fadeup{
  animation: fadeup 1s cubic-bezier(1, 1, 1, 1) forwards;
}
@keyframes fadeup {
  0% {
    transform: translateY(30px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.fadein{
	animation-name: fadeIn;
	animation-duration: 3.5s;
	animation-timing-function: cubic-bezier(3,0.5,0.5,1);
	animation-fill-mode: forwards;
}
@keyframes fadeIn {
  0% {
	opacity: 0;
  }
  100% {
    opacity: 1;
  }
}





@media (max-width: 450px){
	
	.img_t,.img_p,.contitle_p,.con1_p{
		display: none;
	}
	
	
}

@media (min-width: 451px) and (max-width: 760px){
	
	.img_m,.img_p,.contitle_p,.con1_p{
		display: none;
	}
	
	.con1_r{
	margin-right: 40px;
	}
	.k4{
		width: 70%;
	}
	.k6{
		width: 60%;
	}
	.anim-box{
		font-size: 25px;
		max-width: 400px;
	}
	
}

@media (min-width: 761px){
	.img_m,.img_t,.contitle_m,.con1{
		display: none;
	}
	
	
	header{
		max-width: 1200px;
	}
	main{
		margin-bottom: 30px;
	}
	.top,.img1{
		text-align: center;
	}
	.top img,.img1 img{
		max-width: 1200px;
	}
	.kouza{
		max-width: 1000px;
	}
	.contitle{
		padding: 20px 0px;
		margin-bottom: 50px;
	}
	.contitle img{
		max-width: 390px;
	}
	.con1_r{
		padding-right: 20px;
	}
	.con1_p img{
		max-width: 300px;
	}
	.con1_p{
		margin-top: 50px;
		margin-bottom: 50px;
	}
	.k1,.k1-set{
		font-size: 30px;
	}
	.blue,.pink,.k3{
		font-size: 25px;
	}
	.k7{
		font-size: 20px;
	}
	.k4{
		width: 70%;
		font-size: 20px;
		margin-top: 30px;
		margin-bottom: 50px;
	}
	.k5{
		padding-top: 5px;
	}
	.k6{
		font-size: 30px;
		width: 60%;
		margin-top: 30px;
	}
	.gotop{
		font-size: 15px;
		max-width: 1300px;
		margin: auto;
		margin-top: 10px;
		margin-bottom: 15px;
	}
	.f_contact{
		max-width: 300px;
	}
	.f_contact .contact{
		padding-top: 30px;
		padding-bottom: 30px;
		font-size: 30px;
		border-radius: 50px;
	}
	.k5 img{
		max-width: 1000px;
	}
	.anim-box{
		max-width: 500px;
		font-size: 30px;
	}
	
}