@charset "utf-8";
/*--
中 font-size:96%;
小 font-size:88%;
--*/
/*---------------------------------------*/
/* アニメーション */
/*---------------------------------------*/
.anime.slide{
position:relative;
}
.anime.slide .bg{
width:0;
opacity:1;
position:absolute;
top:0;
left:0;
height:100%;
background:rgba(156,135,86,0.9);
}
.anime.slide.animation .bg{
width:100%;
}
/* スライドインコンテンツ */
.slideIn{
position:relative;
padding:2px;
}
/*IE用記述 */
@supports (-ms-ime-align:auto) {
.slideIn{
padding:0;
}
.ttlArea .slideIn{
display:inline-block;
}
}
@media all and (-ms-high-contrast: none){
.slideIn{
padding:0;
}
.ttlArea .slideIn{
display:inline-block;
}
}
.slideIn:after{
position:absolute;
top:0;
right:0;
width:100%;
height:100%;
background:#fff;
z-index:100;
display:inline-block;
opacity:1;
content:"";
-webkit-transition: all 0.8s ease 0.3s;
-moz-transition: all  0.8s ease 0.3s;
-o-transition: all  0.8s ease 0.3s;
transition: all   0.8s ease 0.3s;
}
.slideIn.animation:after{
width:0;
padding:0;
}
/* 背景グレー */
.bgArea .slideIn:after{
background:#f1f3f5;
}
.contactArea .slideIn:after{
background:#b4141f;
}
.slideIn:before{
position:absolute;
top:0;
right:0;
width:100%;
height:100%;
background:#b4141f;
z-index:100;
display:inline-block;
opacity:1;
content:"";
padding:0;
-webkit-transition: all 0.8s ease 1s;
-moz-transition: all  0.8s ease 1s;
-o-transition: all  0.8s ease 1s;
transition: all   0.8s ease 1s;
}
.slideIn.animation:before{
width:0;
padding:0;
}
.slideIn.white:before{
display:none;
}
/* スライドダウン */
.slideIn.down:before{
width:100%;
height:100%;
top:inherit;
bottom:0;
-webkit-transition: all 0.4s ease 1s;
-moz-transition: all  0.4s ease 1s;
-o-transition: all  0.4s ease 1s;
transition: all   0.4s ease 1s;
}
.slideIn.down.animation:before{
width:100%;
height:6px;
padding:0;
}
@media screen and (max-width:640px){
.slideIn.down.animation:before{
height:3px;
}
}
/* トップテキスト */
#topArea .txt .subTxt span.slideIn:after{
-webkit-transition: all 0.5s ease 0.3s;
-moz-transition: all  0.5s ease 0.3s;
-o-transition: all  0.5s ease 0.3s;
transition: all   0.5s ease 0.3s;
}
#topArea .txt .subTxt span.slideIn.txt01:before{
-webkit-transition: all 0.5s ease 0.8s;
-moz-transition: all  0.5s ease  0.8s;
-o-transition: all  0.5s ease  0.8s;
transition: all   0.5s ease  0.8s;
}
#topArea .txt .subTxt span.slideIn.txt02:before{
-webkit-transition: all 0.5s ease 0.9s;
-moz-transition: all  0.5s ease 0.9s;
-o-transition: all  0.5s ease 0.9s;
transition: all   0.5s ease 0.9s;
}
#topArea .txt .mainTxt span.slideIn:after{
-webkit-transition: all 0.7s ease 0.5s;
-moz-transition: all  0.7s ease 0.5s;
-o-transition: all  0.7s ease 0.5s;
transition: all   0.7s ease 0.5s;
}
#topArea .txt .mainTxt span.slideIn.txt01:before{
-webkit-transition: all 0.7s ease 1.3s;
-moz-transition: all  0.7s ease 1.3s;
-o-transition: all  0.7s ease 1.3s;
transition: all   0.7s ease 1.3s;
}
#topArea .txt .mainTxt span.slideIn.txt02:before{
-webkit-transition: all 0.7s ease 1.45s;
-moz-transition: all  0.7s ease 1.45s;
-o-transition: all  0.7s ease 1.45s;
transition: all   0.7s ease 1.45s;
}
/* エリアタイトル */
.areaTtl .ttl.slideIn.txt02:after{
-webkit-transition: all 0.8s ease 0.5s;
-moz-transition: all  0.8s ease 0.5s;
-o-transition: all  0.8s ease 0.5s;
transition: all   0.8s ease 0.5s;
}
.areaTtl .ttl.slideIn.txt02.down:before{
-webkit-transition: all 0.4s ease 1.1s;
-moz-transition: all  0.4s ease 1.1s;
-o-transition: all  0.4s ease 1.1s;
transition: all   0.4s ease 1.1s;
}
.areaTtl .ttl.slideIn.txt03:after{
-webkit-transition: all 0.8s ease 0.6s;
-moz-transition: all  0.8s ease 0.6s;
-o-transition: all  0.8s ease 0.6s;
transition: all   0.8s ease 0.6s;
}
.areaTtl .ttl.slideIn.txt03.down:before{
-webkit-transition: all 0.4s ease 1.2s;
-moz-transition: all  0.4s ease 1.2s;
-o-transition: all  0.4s ease 1.2s;
transition: all   0.4s ease 1.2s;
}


/* バウンド */
.anime.bound{
position:relative;
-moz-transform: scale(0.0,0.0);
-webkit-transform: scale(0.0,0.0);
-o-transform: scale(0.0,0.0);
-ms-transform: scale(0.0,0.0);
transform:scale(0.0,0.0);
}
.anime.bound.animation{
-moz-transform: scale(1.2,1.2);
-webkit-transform:scale(1.2,1.2);
-o-transform:scale(1.2,1.2);
-ms-transform:scale(1.2,1.2);
transform:scale(1.2,1.2);
-webkit-transition: all 0.08s ease;
-moz-transition: all 0.08s ease;
-o-transition: all 0.08s ease;
transition: all  0.08s ease;
}
.anime.bound.animationAfter01{
-moz-transform:scale(0.8,0.8);
-webkit-transform:scale(0.8,0.8);
-o-transform:scale(0.8,0.8);
-ms-transform:scale(0.8,0.8);
transform:scale(0.8,0.8);
-webkit-transition: all 0.08s ease;
-moz-transition: all 0.08s ease;
-o-transition: all 0.08s ease;
transition: all  0.08s ease;
}
.anime.bound.animationAfter02{
-moz-transform: scale(1.0,1.0);
-webkit-transform: scale(1.0,1.0);
-o-transform: scale(1.0,1.0);
-ms-transform: scale(1.0,1.0);
transform:scale(1.0,1.0);
-webkit-transition: all 0.08s ease;
-moz-transition: all 0.08s ease;
-o-transition: all 0.08s ease;
transition: all  0.08s ease;
}
/* ズーム */
.anime.zoom{
position:relative;
-moz-transform: scale(0.0,0.0);
-webkit-transform: scale(0.0,0.0);
-o-transform: scale(0.0,0.0);
-ms-transform: scale(0.0,0.0);
transform:scale(0.0,0.0);
}
.anime.zoom.animation{
-moz-transform: scale(1.0,1.0);
-webkit-transform: scale(1.0,1.0);
-o-transform: scale(1.0,1.0);
-ms-transform: scale(1.0,1.0);
transform:scale(1.0,1.0);
-webkit-transition: all 0.35s ease;
-moz-transition: all 0.35s ease;
-o-transition: all 0.35s ease;
transition: all  0.35s ease;
}
/* 文字ドット */
.anime.zoom.ttlOuter:before{
	width:0;
	height:0;
}
.anime.zoom.animation.ttlOuter:before{
	width:5px;
	height:5px;
-webkit-transition: all 0.1s ease 1.6s;
-moz-transition: all 0.1s ease 1.6s;
-o-transition: all 0.1s ease 1.6s;
transition: all  0.1s ease 1.6s;
}
.anime.zoom.ttlOuter:after{
	width:0;
	height:0;
}
.anime.zoom.animation.ttlOuter:after{
	width:5px;
	height:5px;
-webkit-transition: all 0.1s ease 1.8s;
-moz-transition: all 0.1s ease 1.8s;
-o-transition: all 0.1s ease 1.8s;
transition: all  0.1s ease 1.8s;
}
.anime.zoom.dot:before{
	width:0;
	height:0;
}
.anime.zoom.animation.dot:before{
	width:5px;
	height:5px;
-webkit-transition: all 0.1s ease 2s;
-moz-transition: all 0.1s ease 2s;
-o-transition: all 0.1s ease 2s;
transition: all  0.1s ease 2s;
}
.anime.zoom.dot:after{
	width:0;
	height:0;
}
.anime.zoom.animation.dot:after{
	width:5px;
	height:5px;
-webkit-transition: all 0.1s ease 2.2s;
-moz-transition: all 0.1s ease 2.2s;
-o-transition: all 0.1s ease 2.2s;
transition: all  0.1s ease 2.2s;
}
@media screen and (max-width:640px){
.anime.zoom.animation.ttlOuter:before,
.anime.zoom.animation.ttlOuter:after,
.anime.zoom.animation.dot:before,
.anime.zoom.animation.dot:after{
	width:3px;
	height:3px;
}
}