@charset "utf-8";


/*CSSスライドショー設定
---------------------------------------------------------------------------*/

/*
/*１枚目*/
@keyframes slide1 {
0% {opacity: 0;}
10% {opacity: 1;}
15% {opacity: 1;}
20% {opacity: 0;}
25% {opacity: 0;}
55% {opacity: 0;}
100% {opacity: 0;}
}
/*２枚目*/
@keyframes slide2 {
0% {opacity: 0;}
10% {opacity: 0;}
15% {opacity: 1;}
35% {opacity: 1;}
40% {opacity: 0;}
100% {opacity: 0;}
}
/*3枚目*/
@keyframes slide3 {
0% {opacity: 0;}
30% {opacity: 0;}    
35% {opacity: 1;}
60% {opacity: 1;}
65% {opacity: 0;}
100% {opacity: 0;}
}
/*4枚目*/
@keyframes slide4 {
0% {opacity: 0;}
55% {opacity: 0;}
60% {opacity: 1;}
75% {opacity: 1;}
85% {opacity: 1;}
100% {opacity: 0;}
}

/*１枚目*/
/*@keyframes slide1 {
	0% {opacity: 0;}
	10% {opacity: 1;}
	40% {}
	50% {opacity: 1;}
	60% {opacity: 0;}
	100% {opacity: 0;}
}*/
/*２枚目*/
/*@keyframes slide2 {
	0% {opacity: 0;}
	25% {opacity: 0;}
	35% {opacity: 1;}
	65% {}
	75% {opacity: 1;}
	85% {opacity: 0;}
	100% {opacity: 0;}
}*/
/*3枚目*/
/*@keyframes slide3 {
	0% {opacity: 0;}
	50% {opacity: 0;}
	60% {opacity: 0;}
	80% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}*/
/*mainimg
---------------------------------------------------------------------------*/
/*画像ブロック*/
#mainimg {
    margin-top: 100px;
	clear: left;
	text-indent: -9999px;
	position: absolute;z-index: -1;
	top: 0px;
	width: 100%;
	height: 800px;
}
/*３枚画像の共通設定*/
.slide1,.slide2,.slide3,.slide4 {
	animation-duration: 18s;
	animation-iteration-count:infinite;
	position: absolute;left:0px;top:0px;width: 100%;height: 100%;
	animation-fill-mode: both;
	animation-timing-function: linear;
	animation-delay: 2s;
}
/*土台画像*/
.slide0 {
	background: url("../images/index/main01.png") no-repeat center center/cover;
	position: relative;width: 100%;height: 100%;
}
/*１枚目*/
.slide1 {
	background: url("../images/index/main01.png") no-repeat center center/cover;
	animation-name: slide1;
}
/*２枚目*/
.slide2 {
	background: url("../images/index/main02.png") no-repeat center center/cover;
	animation-name: slide2;
}
/*３枚目*/
.slide3 {
	background: url("../images/index/main03.png") no-repeat center center/cover;
	animation-name: slide3;
}
/*4枚目*/
.slide4 {
	background: url("../images/index/main04.png") no-repeat center center/cover;
	animation-name: slide4;
}

/*画面幅1360px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1360px){
.slide0 {
	background-size: contain;
    background-repeat: no-repeat;
}
/*１枚目*/
.slide1 {
	background-size: contain;
    background-repeat: no-repeat;
}
/*２枚目*/
.slide2 {
	background-size: contain;
    background-repeat: no-repeat;
}
/*３枚目*/
.slide3 {
	background-size: contain;
    background-repeat: no-repeat;
}
/*4枚目*/
.slide4 {
	background-size: contain;
    background-repeat: no-repeat;
}    
    #mainimg{
        height:550px;
    }
    .mainimg{
        height:550px;
    }
}
/*画面幅1024px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1024px){
    #mainimg{
        margin-top: 70px;
        height:450px;
    }
    .mainimg{
        height:400px;
    }
}
/*画面幅768px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:768px){
    #mainimg{
        margin-top: 70px;
        height:400px;
    }
    .mainimg{
        margin-bottom: 20px;
    }
}
/*画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){
#mainimg{
        margin-top: 220px;
        height:200px;
    }
.slide0 {
	background: url("../images/index/main01_s.png") no-repeat center center/cover;
	position: relative;width: 100%;height: 100%;
}
/*１枚目*/
.slide1 {
	background: url("../images/index/main01_s.png") no-repeat center center/cover;
	animation-name: slide1;
}
/*２枚目*/
.slide2 {
	background: url("../images/index/main02_s.png") no-repeat center center/cover;
	animation-name: slide2;
}
/*３枚目*/
.slide3 {
	background: url("../images/index/main03_s.png") no-repeat center center/cover;
	animation-name: slide3;
}
/*4枚目*/
.slide4 {
	background: url("../images/index/main04_s.png") no-repeat center center/cover;
	animation-name: slide4;
}
}
/*mainimg
---------------------------------------------------------------------------*/
/*画像ブロック*/