@charset "utf-8";
/*--
中 font-size:96%;
小 font-size:88%;
--*/
/*---------------------------------------*/
/* アニメーション */
/*---------------------------------------*/
.anime.slide{
position:relative;
}
/* スライドインコンテンツ */
.slideIn{
position:relative;
padding:0;
overflow:hidden;
}
.slideIn:after{
position:absolute;
top:0;
right:0;
width:105%;
height:105%;
background:#fff;
z-index:100;
display:inline-block;
opacity:1;
content:"";
-webkit-transition: all 0.4s ease 0.2s;
-moz-transition: all  0.4s ease 0.2s;
-o-transition: all  0.4s ease 0.2s;
transition: all 0.4s ease 0.2s;
}
.slideIn.leftSlide:after{
left:0;
}
.slideIn.animation:after{
width:0;
padding:0;
}
.slideIn:before{
position:absolute;
top:0;
right:0;
width:105%;
height:105%;
background:#f97c38;
z-index:100;
display:inline-block;
opacity:1;
content:"";
padding:0;
-webkit-transition: all 0.4s ease 0.6s;
-moz-transition: all  0.4s ease 0.6s;
-o-transition: all  0.4s ease 0.6s;
transition: all 0.4s ease 0.6s;
}
.slideIn.leftSlide:before{
left:0;
}
.slideIn.animation:before{
width:0;
padding:0;
}
/* 画像スライドイン */
.slideIn.img{
background:#f97c38;
-webkit-transition: all 0s ease 1.6s;
-moz-transition: all 0s ease 1.6s;
-o-transition: all 0s ease 1.6s;
transition: all 0s ease 1.6s;
}
.slideIn.animation.img{
background:none;
}
.slideIn img{
margin-left:-30px;
-webkit-transition: all 1.2s ease 0.4s;
-moz-transition: all  1.2s ease 0.4s;
-o-transition: all  1.2s ease 0.4s;
transition: all 1.2s ease 0.4s;
}
.slideIn.animation img{
	margin-left:0;
}
/* スライドイン インナー */
.slideInner{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
.slideInner:after{
position:absolute;
top:0;
right:0;
width:105%;
height:105%;
background:#fba646;
z-index:99;
display:inline-block;
opacity:1;
content:"";
-webkit-transition: all 0.4s ease 1.0s;
-moz-transition: all  0.4s ease 1.0s;
-o-transition: all  0.4s ease 1.0s;
transition: all 0.4s ease 1.0s;
}
.slideInner.animation:after{
width:0;
padding:0;
}
.slideInner:before{
position:absolute;
top:0;
right:0;
width:105%;
height:105%;
background:rgba(246,146,30,0.7);
z-index:99;
display:inline-block;
opacity:1;
content:"";
-webkit-transition: all 0.4s ease 1.4s;
-moz-transition: all  0.4s ease 1.4s;
-o-transition: all  0.4s ease 1.4s;
transition: all 0.4s ease 1.4s;
}
.slideInner.animation:before{
width:0;
padding:0;
}
/* フェードイン */
.fadeIn{
opacity:0;
}
.animation.fadeIn{
opacity:1;
-webkit-transition: all 0.4s ease 0.5s;
-moz-transition: all  0.4s ease 0.5s;
-o-transition: all  0.4s ease 0.5s;
transition: all   0.4s ease 0.5s;
}
/* ボタンフェードイン */
.btn a{
position:relative;
}
.btn a:before{
content:"";
position:absolute;
top:0;
right:0;
width:0;
height:1px;
background:#f97c38;
-webkit-transition: all 0.2s ease 0.4s;
-moz-transition: all 0.2s ease 0.4s;
-o-transition: all 0.2s ease 0.4s;
transition: all 0.2s ease 0.4s;
}
.btn.black a:before{
background:#333;
}
.animation.fadeInBtn.btn a:before{
width:100%;
}
.btn a:after{
content:"";
position:absolute;
bottom:0;
left:0;
width:0;
height:1px;
background:#f97c38;
-webkit-transition: all 0.2s ease 0.4s;
-moz-transition: all 0.2s ease 0.4s;
-o-transition: all 0.2s ease 0.4s;
transition: all 0.2s ease 0.4s;
}
.btn.black  a:after{
background:#333;
}
.animation.fadeInBtn.btn a:after{
width:100%;
}
.btn .line{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
.btn .line:before{
content:"";
position:absolute;
top:0;
left:0;
height:0;
width:1px;
background:#f97c38;
-webkit-transition: all 0.2s ease 0.6s;
-moz-transition: all 0.2s ease 0.6s;
-o-transition: all 0.2s ease 0.6s;
transition: all 0.2s ease 0.6s;
}
.btn.black .line:before{
background:#333;
}
.animation.fadeInBtn.btn .line:before{
height:100%;
}
.btn .line:after{
content:"";
position:absolute;
bottom:0;
right:0;
height:0;
width:1px;
background:#f97c38;
-webkit-transition: all 0.2s ease 0.6s;
-moz-transition: all 0.2s ease 0.6s;
-o-transition: all 0.2s ease 0.6s;
transition: all 0.2s ease 0.6s;
}
.btn.black .line:after{
background:#333;
}
.animation.fadeInBtn.btn .line:after{
height:100%;
}
.btn .inner{
opacity:0;
-webkit-transition: opacity 0.4s ease 1s,background 0.3s ease;
-moz-transition: opacity  0.4s ease 1s,background 0.3s ease;
-o-transition: opacity  0.4s ease 1s,background 0.3s ease;
transition: opacity   0.4s ease 1s,background 0.3s ease;
}
.animation.fadeInBtn.btn .inner{
opacity:1;
}
/*---------------------------------------*/
/* 個別調整 */
/*---------------------------------------*/
#topArea .slideIn:after{
-webkit-transition: all 0.25s ease 0.2s;
-moz-transition: all  0.25s ease 0.2s;
-o-transition: all  0.25s ease 0.2s;
transition: all 0.25s ease 0.2s;
}
#topArea .slideIn:before{
-webkit-transition: all 0.25s ease 0.45s;
-moz-transition: all  0.25s ease 0.45s;
-o-transition: all  0.25s ease 0.45s;
transition: all 0.25s ease 0.45s;
}
#topArea .slideInner:after{
-webkit-transition: all 0.25s ease 0.7s;
-moz-transition: all  0.25s ease 0.7s;
-o-transition: all  0.25s ease 0.7s;
transition: all 0.25s ease 0.7s;
}
#topArea .slideInner:before{
-webkit-transition: all 0.25s ease 0.95s;
-moz-transition: all  0.25s ease 0.95s;
-o-transition: all  0.25s ease 0.95s;
transition: all 0.25s ease 0.95s;
}
/* 画像スライドイン */
#topArea .slideIn ul li{
left:-30px;
-webkit-transition: left 1.2s ease 0.65s;
-moz-transition: left  1.2s ease 0.65s;
-o-transition: left  1.2s ease 0.65s;
transition: left 1.2s ease 0.65s;
}
#topArea .slideIn.animation ul li{
	left:0;
}
#topArea .mainTxt{
	margin-left:30px;
-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;
}
#topArea .mainTxt.animation{
	margin-left:0;
}
#topArea .subTxt{
	margin-left:30px;
-webkit-transition: all 0.4s ease 1.4s;
-moz-transition: all  0.4s ease 1.4s;
-o-transition: all  0.4s ease 1.4s;
transition: all   0.4s ease 1.4s;
}
#topArea .subTxt.animation{
	margin-left:0;
}