﻿@charset "utf-8";

/* ■■冒頭でimport */
@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
@import url(https://fonts.googleapis.com/earlyaccess/sawarabigothic.css);


.logo{
	width: 300px;
	height: 300px;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 200px;
	margin: auto;
	animation: fadeIn 3s ease 0s 1 normal;
	-webkit-animation: fadeIn 3s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

.logo_txt{
	width: 300px;
	height: 150px;
	position: fixed;
	top: 250px;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
.logo_txt h1{
	padding: 0;
	margin: 0;
	line-height: 0;
}

.ab_box{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;	
	width: 900px;
	height: 500px;
}

.wellcome{
	width: 300px;
	height: 100px;
	margin: 50px auto 0;
}
.txt_img01{
	width: 300px;
	height: 130px;

	margin: auto;
}
.top_txt{
	width: 90%;
	text-align: center;
	margin: auto;
	font-size: 18px;
	line-height: 34px;
	color: #fff;
}

.contents02{
	position: relative;
	z-index: 2;
	height:auto;
	padding: 40px 0;
	background-color: #fff;
	background-attachment: fixed;
}

.topic_box{
	width: 1100px;
	margin: 0 auto;
}

.topic_line{
	width: 1100px;
	display: inline-block;
}

.topic_l{
	width: 530px;
	margin: 0 40px 0 0;
	float: left;
}
.topic_tit{
	width: 300px;
	height: 140px;
	margin: 0 auto 30px;
}

.topic_area{
	width: 530px;
	height: 260px;
	overflow: hidden;
}

.topics{
	width: 520px;
	padding: 0 0 15px;
	display: inline-block;
}

.day{
	width: 100px;
	font-weight: bold;
	float: left;
}
.title{
	width: 420px;
	float: left;
}

.more{
	width: 360px;
	height: 80px;
	margin: 20px 0 0;
}
.more img{
	width: 180px;
	height: 40px;
}

.topic_r{
	width: 530px;
	padding: 90px 0 0;
	margin: 0;
	float: left;
}

.topic_r img{
	width: 530px;
	height: 180px;
	margin: 0 0 20px;
}

.contents03{
	position: relative;
	z-index: 3;
	height:400px;
	background-image: url("../img/main_img3.jpg");
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.middle_logo{
	width: 300px;
	height: 300px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}

.contents04{
	position: relative;
	z-index: 4;
	height:auto;
	padding: 40px 0;
	background-color: #fff;
	background-attachment: fixed;
}

.contents05{
	position: relative;
	z-index: 5;
	height:auto;
	padding: 40px 0;
	margin: 0 0 50px;
	background-color: rgba(156,192,89,0.3);
	background-attachment: fixed;
}




.inst_tit{
	width: 300px;
	height: 100px;
	margin: 0 auto;
}




.insta_blo{
	width: 100%;
	height: 316px;
	background-color: rgba(255,255,255,0);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}




@media screen and (min-width:320px) and ( max-width:639px) {
/*　画面サイズが320pxから639pxまではここを読み込む　*/

.logo{
	width: 200px;
	height: 200px;
	margin: 130px auto 20px;
	animation: fadeIn 3s ease 0s 1 normal;
	-webkit-animation: fadeIn 3s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

.logo img{
	width: 200px;
	height: 200px;
}

.sp_arrow{
	width: 60px;
	height: 60px;
	position: fixed;
	top: 350px;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}

.contents01{
	position: relative;
	z-index: 1;
	height:auto;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}



.sp_well_box{
	width: 100%;
}

.sp_well{
	width: 100%;
	height: 100px;
	padding: 30px 0;
}
.sp_well img{
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.well_img{
	width: 100%;
	height: auto;
	margin: 0 0 50px;
}
.well_img img{
	width: 100%;
	height: auto;
}

.well_txt_img{
	width: 90%;
	padding: 0 5% 20px;
	margin: 50px 0 0;
}
.well_txt_img img{
	width: 100%;
	height: auto;
}

.well_txt{
	width: 90%;
	padding: 0 5% 20px;
	font-size: 14px;
}


.topic_box{
	width: 90%;
	margin: 0 auto;
}

.topic_line{
	width: 100%;
	display: inline-block;
}

.topic_l{
	width: 100%;
	margin: 0 0 30px 0;
}
.topic_tit{
	width: 270px;
	height: 126px;
	margin: 0 auto 30px;
}

.topic_tit img{
	width: 270px;
	height: 126px;
}


.topic_area{
	width: 100%;
	height: 260px;
	overflow: hidden;
}

.topics{
	width: 100%;
	padding: 0 0 15px;
	display: inline-block;
}

.day{
	width: 100%;
	font-weight: bold;
}
.title{
	width: 100%;
}

.more{
	width: 180px;
	height: 40px;
	margin: 20px auto 0;
}
.more img{
	width: 180px;
	height: 40px;
	margin: 20px auto 0;
}

.topic_r{
	width: 100%;
	padding: 0;
}

.topic_r img{
	width: 100%;
	height: auto;
	margin: 0 0 20px;
}



.imgbox{
	width: 90%;
	margin: 0 auto;
}

.imgarea{
	width: 100%;
	margin: 0 0 70px;
	position: relative;
}

.ia_img01{
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 0;
}
.ia_img01 img{
	width: 300px;
	transition: 2s;
}
.ia_img01 img:hover{
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

.ia_txtbox01{
	width: 100%;
	background-color: rgba(255,255,255,0.4);
	z-index: 2;
	margin: 0 0 30px;
}

.ia_img02{
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 0;
}
.ia_img02 img{
	width: 300px;
	transition: 2s;
}
.ia_img02 img:hover{
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

.ia_txtbox02{
	width: 100%;
	background-color: rgba(255,255,255,0.4);
	margin: 0 0 30px;
	z-index: 2;
}

.ia_tit{
	width: 270px;
	height: 126px;
	margin: 0 auto ;
}

.ia_tit img{
	width: 270px;
	height: 126px;
	margin: 0 auto ;
}

.ia_txt{
	margin: 0 0 30px;
	text-align: center;
}
.ia_more{
	width: 180px;
	height: 40px;
	margin: 0 auto;
}
.ia_more img{
	width: 180px;
	height: 40px;
}

.arrow{
	display: none;
}

.contents03{
	display: none;
}






/* ■■バナー */

.bnr_back{
	background-color:#edeccd;
	width:100%;
	height:auto;
	margin:0 auto 50px;
	clear:both;
	z-index:9999;
	text-align:center;
	position: relative;
}

.bnr_logo{
	display:none;
}

.bnr_logo img{
	display:none;
}

.bnr_center{
	width:90%;
	height:;
	padding:20px 5% 0 5%;
}

.bnr_tel{
	text-align:right;
	width: 300px;
	height: 60px;
	margin: 15px auto 0;
}

.bnr_text{
	font-size:16px;
	text-align:left;
}

.bnr_text span{
	font-family	: 'Sawarabi Gothic';
	font-size:28px;
	font-weight:600;
	line-height:1.5;
	text-align:left;
	color:#9cc059;
}


.bnr_photo{
	width:90%;
	height:auto;
	padding:40px 5% 40px 5%;
}

.bnr_photo img{
	width:90%;
	height:auto;
}


.inst_area_sp{
	width: 100%;
	padding: 0 0 40px;
	margin: 0 auto 30px;
	display: inline-block;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-justify-content: space-around;
	justify-content: space-around;
	position: relative;
	z-index: 1;
}


.inst_area_pc{
	display: none;
}

}






@media screen and (min-width: 640px) {
/* 640pxからの幅の場合に適応される */

.contents01{
	position: relative;
	z-index: 1;
	height:100%;
	background-image: url("../img/main_img2.jpg");
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.sp_well_box{
	display: none;
}
.sp_arrow{
	display: none;
}

.arrow{
	width: 60px;
	height: 60px;
	position: fixed;
	top: 500px;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}

.imgbox{
	width: 1100px;
	margin: 0 auto;
}

.imgarea{
	width: 1100px;
	height: 460px;
	margin: 0 0 70px;
	position: relative;
}

.ia_img01{
	width: 530px;
	height: 360px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	overflow: hidden;
}
.ia_img01 img{
	transition: 2s;
}
.ia_img01 img:hover{
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

.ia_txtbox01{
	width: 640px;
	height: 350px;
	border: solid 5px #8EB25D;
	background-color: rgba(255,255,255,0.4);
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 2;
}

.ia_img02{
	width: 530px;
	height: 360px;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	overflow: hidden;
}
.ia_img02 img{
	transition: 2s;
}
.ia_img02 img:hover{
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

.ia_txtbox02{
	width: 640px;
	height: 350px;
	border: solid 5px #8EB25D;
	background-color: rgba(255,255,255,0.4);
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 2;
}

.ia_tit{
	width: 300px;
	height: 140px;
	margin: 0 auto 20px;
}
.ia_txt{
	margin: 0 0 30px;
	text-align: center;
}
.ia_more{
	width: 180px;
	height: 40px;
	margin: 0 auto;
}
.ia_more img{
	width: 180px;
	height: 40px;
}


/* ■■バナー */

.bnr_back{
	background-color:#edeccd;
	width:1100px;
	height:330px;
	margin:0 auto 50px;
	clear:both;
	z-index:9999;
	text-align:center;
	position: relative;
}

.bnr_logo{
	width: 220px;
	height:200px;
	padding:40px 20px 0 20px;
	float:left;
}

.bnr_logo img{
	width: 220px;
	height:200px;
}

.bnr_center{
	width:450px;
	height:;
	float:left;
	padding:20px 0 0;
}

.bnr_tel{
	text-align:right;
	width: 300px;
	height: 60px;
	margin: 15px 0 0;
	float:right;
}

.bnr_text{
	font-size:16px;
	text-align:left;
}

.bnr_text span{
	font-family	: 'Sawarabi Gothic';
	font-size:32px;
	font-weight:600;
	text-align:left;
	color:#9cc059;
	line-height:1.5;
}


.bnr_photo{
	width:350px;
	height:250px;
	padding:40px 20px 0;
	float:left;
}

.bnr_photo img{
	width:350px;
	height:250px;
}




.inst_area_pc{
	width: 100%;
	padding: 0 0 40px;
	margin: 0 auto 30px;
	display: inline-block;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-justify-content: space-around;
	justify-content: space-around;
	position: relative;
	z-index: 1;
}


.inst_area_sp{
	display: none;
}


}



/* ■■■■■■■■20240228追加■■■■■■■■ */

.instructor{
	width				: 600px;
	margin				: 0 auto;
	line-height: 1.5;
}

.instructor .img01, .instructor .img01 img{
	width				: 80px;
	margin				: 30px auto 0;
}

.instructor .img02, .instructor .img02 img{
	width				: 400px;
	margin				: 30px auto 50px;
}

.instructor h2{
	font-size			: 30px;
	text-align			: center;
	margin				: 20px auto 0;
	color				: #9CC15A;
}

.instructor h3{
	font-size			: 20px;
	text-align			: center;
	margin				: 20px auto;
	color				: #444;
}

@media screen and (max-width:749px) {
.instructor{
	width				: 90%;
	margin				: 0 auto;
}

.instructor .img02, .instructor .img02 img{
	width				: 300px;
}

}


#emmaz {
	position		: fixed;
	width			: 300px ;
	height			: 115px;
	bottom			: 0px;
	right			: 0px;
	opacity			: 1;
	cursor			: pointer ;
	z-index			: 9999 ;
	box-shadow		: 0 0 20px;
}

#emmaz img {
	width			: 300px ;
	height			: 115px;
}
@media screen and (max-width:749px) {
#emmaz {
	width			: 175px ;
	height			: 70px;
	box-shadow		: 0 0 5px;
}
#emmaz img {
	width			: 175px ;
	height			: 70px;
}


}
