@charset "utf-8";


@keyframes slide1 {
	0% {opacity: 0;}
	10% {opacity: 1;}
	40% {opacity: 1;}
	50% {opacity: 1;}
	60% {opacity: 1;}
	100% {opacity: 1;}
}
/*
@keyframes slide2 {
	0% {opacity: 0;}
	25% {opacity: 0;}
	35% {opacity: 1;}
	65% {}
	75% {opacity: 1;}
	85% {opacity: 0;}
	100% {opacity: 0;}
}
@keyframes slide3 {
	0% {opacity: 0;}
	50% {opacity: 0;}
	60% {opacity: 1;}
	80% {opacity: 1;}
	90% {opacity: 0;}
	100% {opacity: 0;}
}
*/
/*mainimg
---------------------------------------------------------------------------*/
#mainimg {
	clear: left;
	text-indent: -9999px;
	top: 0px;
	width: 100%;
	height: 100%;
	margin: 0;
	/*width: calc(100% - 30px);
	height: calc(100% - 30px);*/
	/*border: 15px solid #000;*/
}
.slide1 {
	animation-duration: 20s;
	animation-iteration-count: 1;
	position: absolute;left:0px;top:0px;width: 100%;height: 100%;
	animation-fill-mode: both;
	animation-timing-function: linear;
	animation-delay: 3s;
}
.slide1 {
	background: url(../images/home_bg.jpg) no-repeat center center/cover;
	animation-name: slide1;
	border-left: 15px solid #000;
	border-right: 15px solid #000;
	border-bottom: 15px solid #000;
	width: calc(100% - 30px);
	height: calc(100% - 115px);
	margin-top: 100px;
}


@media screen and (max-width:900px) {
#mainimg {
	height: calc(100% - 90px);
}
.slide1 {
	height: calc(100% - 105px);
	margin-top: 90px;
}

}


@media screen and (max-width:500px) {
/*
#mainimg {
	height: calc(100% - 92px);
}
*/
.slide1 {
	height: calc(100% - 90px);
	margin-top: 77px;
}

}

/*
.slide2 {
	background: url(../images/mainimg_2.jpg) no-repeat center center/cover;
	animation-name: slide2;
}
.slide3 {
	background: url(../images/mainimg_3.jpg) no-repeat center center/cover;
	animation-name: slide3;
}
*/