@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:-25%;
right:-25%;
width:150%;
height:150%;
background:#fff;
z-index:100;
display:inline-block;
opacity:1;
content:"";
transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-webkit-transition: all 0.9s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s;
-moz-transition: all  0.9s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s;
-o-transition: all  0.9s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s;
transition: all 0.9s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s;
}
.slideIn.leftSlide:after{
left:-25%;
}
.slideIn.bottomSlide:after{
bottom:-25%;
top:auto;
}
.slideIn.animation:after{
width:0;
}
.slideIn.bottomSlide.animation:after{
width:150%;
height:0%;
}
.slideIn:before{
position:absolute;
top:-25%;
right:-25%;
width:150%;
height:150%;
background:#f5f5f5;
z-index:100;
display:inline-block;
opacity:1;
content:"";
transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-webkit-transition: all 0.9s cubic-bezier(0.075, 0.82, 0.165, 1) 0.9s;
-moz-transition: all  0.9s cubic-bezier(0.075, 0.82, 0.165, 1) 0.9s;
-o-transition: all  0.9s cubic-bezier(0.075, 0.82, 0.165, 1) 0.9s;
transition: all 0.9s cubic-bezier(0.075, 0.82, 0.165, 1) 0.9s;
}
.slideIn.blue:before{
background:#1aa2e6;
}
.slideIn.leftSlide:before{
left:-25%;
}
.slideIn.bottomSlide:before{
bottom:-25%;
top:auto;
}
.slideIn.animation:before{
width:0;
}
.slideIn.bottomSlide.animation:before{
width:150%;
height:0%;
}
/* 画像スライドイン */
.slideIn.img{
background:#f5f5f5;
-webkit-transition: all 0s cubic-bezier(0.075, 0.82, 0.165, 1) 1.6s;
-moz-transition: all 0s cubic-bezier(0.075, 0.82, 0.165, 1) 1.6s;
-o-transition: all 0s cubic-bezier(0.075, 0.82, 0.165, 1) 1.6s;
transition: all 0s cubic-bezier(0.075, 0.82, 0.165, 1) 1.6s;
}
.slideIn.animation.img{
background:none;
}
.slideIn img,
.slideIn .slideBg{
margin-left:-30px;
-webkit-transition: all 1.2s cubic-bezier(0.075, 0.82, 0.165, 1) 0.9s;
-moz-transition: all  1.2s cubic-bezier(0.075, 0.82, 0.165, 1) 0.9s;
-o-transition: all  1.2s cubic-bezier(0.075, 0.82, 0.165, 1) 0.9s;
transition: all 1.2s cubic-bezier(0.075, 0.82, 0.165, 1) 0.9s;
}
.slideIn.animation img,
.slideIn.animation .slideBg{
margin-left:0;
}
/* フェードイン */
.fadeIn{
opacity:0;
}
.animation.fadeIn{
opacity:1;
-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;
}
.animation.fadeIn.late{
-webkit-transition: all 1s ease 0.5s;
-moz-transition: all 1s ease 0.5s;
-o-transition: all 1s ease 0.5s;
transition: all 1s ease 0.5s;
}
.fadeIn.left{
transform: translate(-50px,0);
}
.animation.fadeIn.left{
transform: translate(0,0);
}
.fadeIn.right{
transform: translate(50px,0);
}
.animation.fadeIn.right{
transform: translate(0,0);
}
.fadeIn.top{
transform: translate(0,-50px);
}
.animation.fadeIn.top{
transform: translate(0,0);
}
.fadeIn.bottom{
transform: translate(0,50px);
}
.animation.fadeIn.bottom{
transform: translate(0,0);
}
/* ブラー */
.blur{
opacity:0;
-webkit-filter: blur(3px);
filter: blur(3px);
}
.animation.blur{
opacity:1;
-webkit-filter: blur(0);
filter: blur(0);
-webkit-transition: all 1.2s ease 0.5s;
-moz-transition: all 1.2s ease 0.5s;
-o-transition: all 1.2s ease 0.5s;
transition: all 1.2s ease 0.5s;
}
.animation.blur.late{
-webkit-transition: all 1.5s ease 0.5s;
-moz-transition: all 1.5s ease 0.5s;
-o-transition: all 1.5s ease 0.5s;
transition: all 1.5s ease 0.5s;
}
/* ブライトネス */
.brightness{
opacity:0;
-webkit-filter: brightness(8000%);
filter: brightness(8000%);
}
.animation.brightness{
opacity:1;
-webkit-filter: brightness(100%);
filter: brightness(100%); 
-webkit-transition:all 1.2s ease;
-moz-transition:all 1.2s ease;
-o-transition:all 1.2s ease;
transition:all 1.2s ease;
}


/*---------------------------------------*/
/* 個別記述 */
/*---------------------------------------*/
/*キービジュアル*/
.wideslider .txt.blur.late{
transform:scale(1.1,1.1)
}
.wideslider .txt.animation.blur.late{
-webkit-transition: all 3s ease 1.5s;
-moz-transition: all 3s ease 1.5s;
-o-transition: all 3s ease 1.5s;
transition: all 3s ease 1.5s;
transform:scale(1,1)
}
/* ハンバーガーメニュー */
.accordion .inbox .btnBox,
header .accordion .inbox ul li.fadeIn{
opacity:0;
transform: translate(50vw,0);
}
.accordion .inbox.animation .btnBox,
header .accordion .inbox.animation ul li.fadeIn{
opacity:1;
transform: translate(0,0);
}
header .accordion .inbox.animation ul li:first-child{
-webkit-transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.15s;
-moz-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.15s;
-o-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.15s;
transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.15s;
}
header .accordion .inbox.animation ul li:nth-child(2){
-webkit-transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.2s;
-moz-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.2s;
-o-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.2s;
transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.2s;
}
header .accordion .inbox.animation ul li:nth-child(3){
-webkit-transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.25s;
-moz-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.25s;
-o-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.25s;
transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.25s;
}
header .accordion .inbox.animation ul li:nth-child(4){
-webkit-transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.3s;
-moz-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.3s;
-o-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.3s;
transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.3s;
}
header .accordion .inbox.animation ul li:nth-child(5){
-webkit-transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.35s;
-moz-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.35s;
-o-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.35s;
transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.35s;
}
header .accordion .inbox.animation ul li:nth-child(6){
-webkit-transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.4s;
-moz-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.4s;
-o-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.4s;
transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.4s;
}
.accordion .inbox.animation .btnBox{
-webkit-transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.45s;
-moz-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.45s;
-o-transition: all  0.3s cubic-bezier(.43,.45,0,.92) 0.45s;
transition: all 0.3s cubic-bezier(.43,.45,0,.92) 0.45s;
}
.accordion .inbox .logo{
opacity:0
}
.accordion .inbox.animation .logo{
opacity:1;
-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;
}