.mainSlide_box{
    width: 100%;
    height: 650px;
    position: relative;
    overflow: hidden;
}
.mainSlide_panel{
    width: 100%;
    height: 650px;
}
.mainSlide_panel li{
    display: none;
    position: absolute;
    width: 100%;
    height: 650px;
    z-index: 10;
}

.mainSlide_panel li .background-scale{
    position: absolute;
    width: 100%;
    height: 650px;
    z-index: 11;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: center left;
    overflow: hidden;
    -webkit-animation: mainScale 2s 1 ease-in-out normal;
    -moz-animation: mainScale 2s 1 ease-in-out normal;
    -ms-animation: mainScale 2s 1 ease-in-out normal;
    animation: mainScale 2s 1 ease-in-out normal;
}
/***************
Animation
****************/
@keyframes mainScale {
    0%{
        transform:scale(1.1);
    }
    100%{
        transform:scale(1.0);
    }
}
/*Sfari, Chrome*/
@-webkit-keyframes mainScale {
    0%{
        transform:scale(1.1);
    }
    100%{
        transform:scale(1.0);
    }
}
/*Firefox*/
@-moz-keyframes mainScale {
    0%{
        transform:scale(1.1);
    }
    100%{
        transform:scale(1.0);
    }
}
/*ie*/
@-ms-keyframes mainScale {
    0%{
        transform:scale(1.1) rotate(.001deg);
    }
    100%{
        transform:scale(1.0) rotate(.001deg);
    }
}

.list01{
    background-image: url(../../resources/img/main/mainslide-01.png);
}
.list02{
    background-image: url(../../resources/img/main/mainslide-03.jpg);
}
/******************************
play/stop
********************************/
.play{
	color : red;
	cursor:pointer;
	display : none;
}
.stop{
	color : red;
	cursor:pointer;
	display : block;
}
.play_box{
	margin-top: -10px;
	width: 15px;
}

.mainSlide_panel li:first-child{
    display: block;
}
.title_headline{
    position: absolute;
    top: 145px;
	left:15%;
    z-index: 12;
    transform: scale(1.0) !important;
}
.headline_title{
    font-size:2.6em;
    color:#fff;
    line-height:1.3;
    text-shadow: 1px 0px 10px rgb(0, 0, 0);
    -webkit-animation: titleUp 1.5s 1 ease-in-out normal;
    -moz-animation: titleUp 1.5s 1 ease-in-out normal;
    -ms-animation: titleUp 1.5s 1 ease-in-out normal;
    animation: titleUp 1.5s 1 ease-in-out normal;
}

/***************
Animation
****************/
@keyframes titleUp {
    0%{
        margin-top: 44px;
        opacity: 0;
        filter:opacity(0);
    }
    100%{
        margin-top: 0px;
        opacity: 1;
        filter: opacity(100);
    }
}
/*Sfari, Chrome*/
@-webkit-keyframes titleUp {
    0%{
        margin-top: 44px;
        opacity: 0;
        filter:opacity(0);
    }
    100%{
        margin-top: 0px;
        opacity: 1;
        filter: opacity(100);
    }
}
/*Firefox*/
@-moz-keyframes titleUp {
   0%{
        margin-top: 44px;
        opacity: 0;
        filter:opacity(0);
    }
    100%{
        margin-top: 0px;
        opacity: 1;
        filter: opacity(100);
    }
}
/*ie*/
@-ms-keyframes titleUp {
   0%{
        margin-top: 44px;
        opacity: 0;
        filter:opacity(0);
    }
    100%{
        margin-top: 0px;
        opacity: 1;
        filter: opacity(100);
    }
}
/***************
Animation END
****************/

.headline_explain{
    margin-top: 20px;
    font-size:1.6em;
    color:#fff;
    text-shadow: 1px 0px 10px rgb(0, 0, 0);
    -webkit-animation: explainUp 1.5s 1 ease-in-out normal;
    -moz-animation: explainUp 1.5s 1 ease-in-out normal;
    -ms-animation: explainUp 1.5s 1 ease-in-out normal;
    animation: explainUp 1.5s 1 ease-in-out normal;
}
/***************
Animation
****************/
@keyframes explainUp {
    0%{
        margin-top: -84px;
        opacity: 0;
        filter:opacity(0);
    }
    100%{
        margin-top: 0px;
        opacity: 1;
        filter: opacity(100);
    }
}
/*Sfari, Chrome*/
@-webkit-keyframes explainUp {
    0%{
        margin-top: -84px;
        opacity: 0;
        filter:opacity(0);
    }
    100%{
        margin-top: 0px;
        opacity: 1;
        filter: opacity(100);
    }
}
/*Firefox*/
@-moz-keyframes explainUp {
    0%{
        margin-top: -84px;
        opacity: 0;
        filter:opacity(0);
    }
    100%{
        margin-top: 0px;
        opacity: 1;
        filter: opacity(100);
    }
}
/*ie*/
@-ms-keyframes explainUp {
    0%{
        margin-top: -84px;
        opacity: 0;
        filter:opacity(0);
    }
    100%{
        margin-top: 0px;
        opacity: 1;
        filter: opacity(100);
    }
}
/***************
Animation END
****************/
.mainSlide_btn_tab{
    position: absolute;
    bottom:40px;
    left:50%;
    z-index: 11;
    margin-left: -104px;
    width: 260px;
    height: 4px;
}
.mainSlide_btn_tab ul{
	float : left;
}
.mainSlide_btn_tab_list{
    height:4px;
    cursor: pointer;
	width : 85%;
}
.mainSlide_btn_tab_list li{
    float:left;
    margin-left: 4px;
    margin-bottom: 20px;
    width: 100px;
    height: 4px;
    border-radius: 1.5px;
    background-color: #fff;
    
}
.mainSlide_btn_tab_list li:first-child{
    margin-left: 0;
}
.mainSlide_btn_tab_list li.on{
    background-color: #222;
}
/*
.mainSlide_btn_perv{
    cursor: pointer;
    position: absolute;
    z-index: 11;
    top:50%;
    left:14px;
    width: 25px;
    height: 30px;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    background-position: center center;
    background-image: url(../../resources/img/main/slide_icon_left2.png);
}
.mainSlide_btn_next{
    cursor: pointer;
    position: absolute;
    z-index: 11;
    top:50%;
    right:14px;
    width: 25px;
    height: 30px;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    background-position: center center;
    background-image: url(../../resources/img/main/slide_icon_right2.png);
}
*/
@media (max-width: 1200px) {
	.mainSlide_box,
	.mainSlide_panel,
	.mainSlide_panel li {
		height: 500px;
	}
	.title_headline{
		top:60px;
	}
	.headline_title{
    font-size:2.2em;
	}
	.headline_explain{
    font-size:1.2em;
	}
}

@media (max-width: 991px) {
	.mainSlide_box,
	.mainSlide_panel,
	.mainSlide_panel li {
		height: 450px;
	}
	.title_headline{
		top:120px;
	}
}

@media only screen and (max-width: 768px) {
	.mainSlide_box,
	.mainSlide_panel,
	.mainSlide_panel li {
		height: 400px;
	}
	.title_headline{
		top:110px;
	}
}

@media only screen and (max-width: 768px) {
	.mainSlide_box,
	.mainSlide_panel,
	.mainSlide_panel li {
		height: 400px;
	}
	.title_headline{
		top:110px;
	}
    .mainSlide_btn_perv,
    .mainSlide_btn_next {
        display: none;
    }
}

@media only screen and (max-width: 550px) {
	.title_headline{
		left:15%;
	}
	.headline_title{
    font-size:1.6em;
	}
	.headline_explain{
    font-size:1.08em;
	}
	.mainSlide_btn_tab{
		margin-left: -52px;
        width: 140px;
	}
	.mainSlide_btn_tab_list li{
		width:50px;
	}
}