@charset "utf-8";
/* ----------------------------------
 * home slider
 * -------------------------------- */

#mainvisual {
	position:relative;
	overflow:hidden;
	width:100%;
	background:#ebecf0;
	z-index:-1;
}
#mainvisual .inner{
	margin:0 auto;
	max-width:75rem;
}

#mainvisual .bg {
	position:absolute;
	top:0;
	left:0;
	z-index:1;
}
#mainvisual .metaslider {
	position: relative;
	z-index: 1;
}
#mainvisual .metaslider .caption-wrap {
	position: absolute;
 	top:calc(50% - 30px);
	left: 0;
	width:100%;
	height:100%;
	opacity:1;
	background:rgba(0,0,0,0);
    -webkit-transform: translate(0);
    transform: translate(0);
}
#mainvisual .metaslider .caption {
	padding:0 15px;
}
#mainvisual .metaslider .caption-wrap img{
	width:200px;
}
#mainvisual .metaslider .flexslider .slides p{
	line-height:2!important;
	margin-bottom:20px;
	font-size:18px!important;
	color:#333!important;
	font-family: "logotypegothic";
}
#mainvisual article .anime1 {
	animation-name:down;
	animation-duration:2s;
	animation-delay: 2s;
	animation-fill-mode:forwards;
	margin-top:0;
}
#mainvisual article .anime2 {
	animation-name:up;
	animation-duration:2s;
	animation-delay:2s;
	animation-fill-mode:forwards;
	margin-top:1vh;
}
#mainvisual article .anime3 {
	animation-name:down;
	animation-duration:2s;
	animation-delay: 2s;
	animation-fill-mode:forwards;
	margin-top:1vh;
}
 @keyframes titleAnime {
 0% {
 opacity:0;
}
 100% {
 opacity:1;
}
}
 @keyframes down {
 0% {
 margin-left:-200px;
}
 100% {
 margin-left:0px;
}
}
@keyframes up {
 0% {
 margin-right:-200px;
}
 100% {
 margin-right:0px;
}
}
 @media(min-width:40rem) {

#mainvisual .metaslider .caption-wrap img{
	width:280px;
}
#mainvisual .metaslider .caption-wrap {
 	top:calc(50% - 100px);
}
}

@media(min-width:64rem) {
#mainvisual .metaslider .caption {
	padding:0 30px;
}
#mainvisual .metaslider .caption-wrap {
 	top:calc(50% - 115px);
}
#mainvisual .metaslider .caption-wrap img{
	width:auto;
}
}