@charset "utf-8";
/* CSS Document */
.fade_left{
	-webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity : 0;
	/*transition:transform .9s ease 1.5s,opacity 1.5s ease 1.5s;*/
	 transition: transform 1.8s cubic-bezier(.08,.92,.50,1),opacity 1.8s;
}
.cate_txt1.fade_left{
	-webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity : 0;
	/*transition:transform .9s ease 1.9s,opacity 1.5s ease 1.9s;*/
	 transition: transform 1.8s cubic-bezier(.08,.92,.50,1),opacity 1.8s;
}
.fade_left.start {
    opacity : 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
.img_anime{
	position: relative;
	overflow: hidden;
}
.img_anime::before {
    content: '';
    display: inline-block;
    width: 110%;
    height: 110%;
    background-color: #000019;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
   /* transition: transform .6s cubic-bezier(.01,.25,1,-0.24) .3s;*/
	 transition: transform 1.8s cubic-bezier(.08,.92,.50,1),opacity 1.8s;
}
.img_anime.start::before {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}

#color .txt_box.txt_box_anime .inner::before{
	transform: rotate(-45deg) translateY(-100px);
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1);
}
#color .txt_box.txt_box_anime.start .inner::before{
	transform: rotate(-45deg) translateY(-547px);
}
#color .txt_box.txt_box_anime .inner p{
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1) .5s;
	opacity: 0;
}
#color .txt_box.txt_box_anime.start .inner p{
	color: #7c7c7c;
	opacity: 1;
}

#intro h2.intro_title_anime.row > span span {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1);
}
#intro h2.intro_title_anime .row > span:nth-child(1) span {
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1);
}
#intro h2.intro_title_anime .row > span:nth-child(2) span {
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1).1s;
}
#intro h2.intro_title_anime .row > span:nth-child(3) span {
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1).2s;
}
#intro h2.intro_title_anime .row > span:nth-child(4) span {
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1).3s;
}
#intro h2.intro_title_anime .row > span:nth-child(5) span {
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1).4s;
}
#intro h2.intro_title_anime .row > span:nth-child(6) span {
	transition: .6s cubic-bezier(0.5, 0.1, 0.2, 1).5s;
}
#intro h2.intro_title_anime.start .row > span span {
	transform: matrix(1, 0, 0, 1, 0, 0);
}

#item h3.title_anime .row > span span ,#shop h3.title_anime .row > span span, #top_news h3.title_anime .row > span span {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
	transition: .8s cubic-bezier(0.5, 0.1, 0.2, 1);
}
#item h3.title_anime .row > span:nth-child(1) span {
	transition: .8s cubic-bezier(0.5, 0.1, 0.2, 1);
}
#item h3.title_anime .row > span:nth-child(2) span, #shop h3.title_anime .row > span:nth-child(2) span {
	transition: .8s cubic-bezier(0.5, 0.1, 0.2, 1) .15s;
}
#item .content_03 h3.title_anime .row > span:nth-child(3) span {
	transition: .8s cubic-bezier(0.5, 0.1, 0.2, 1) .25s;
}
#item h3.title_anime:nth-of-type(2) .row > span span, #shop h3.title_anime:nth-of-type(2) .row > span span {
	transition: .8s cubic-bezier(0.5, 0.1, 0.2, 1) .45s;
}
#item .content_03 h3.title_anime:nth-of-type(2) .row > span span {
	transition: .8s cubic-bezier(0.5, 0.1, 0.2, 1) .35s;
}
#top_news h3.title_anime:nth-of-type(2) .row > span span {
	transition: .8s cubic-bezier(0.5, 0.1, 0.2, 1) .15s;
}
#item h3.title_anime.start .row > span span, #shop h3.title_anime.start .row > span span, #top_news h3.title_anime.start .row > span span {
	transform: matrix(1, 0, 0, 1, 0, 0);
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.fade_left{
	-webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity : 1;
}
.cate_txt1.fade_left{
	-webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity : 1;
}
.fade_left.start {
    opacity : 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.fade_up{
    top: 0;
}
#color .txt_box.txt_box_anime.start .inner::before{
	transform: rotate(-45deg) translateY(-520px);	
}
}