@charset "utf-8";



/*COMMON*/
.contents_main_scroll p > span:nth-child(1) { animation:scroll0 2.5s ease-in-out 0.8s infinite; }
.contents_main_scroll p > span:nth-child(2) { animation:scroll0 2.5s ease-in-out 0.875s infinite; }
.contents_main_scroll p > span:nth-child(3) { animation:scroll0 2.5s ease-in-out 0.95s infinite; }
.contents_main_scroll p > span:nth-child(4) { animation:scroll0 2.5s ease-in-out 1.025s infinite; }
.contents_main_scroll p > span:nth-child(5) { animation:scroll0 2.5s ease-in-out 1.1s infinite; }
.contents_main_scroll p > span:nth-child(6) { animation:scroll0 2.5s ease-in-out 1.175s infinite; }
@keyframes scroll0 {
	0% { opacity:0; transform:translateY(-50%) rotateX(90deg); }
	15% { opacity:1; transform:translateY(0px) rotateX(0deg); }
	85% { opacity:1; transform:translateY(0px) rotateX(0deg); }
	100% { opacity:0; transform:translateY(50%) rotateX(-90deg); }
}
.contents_main_off .contents_main_scroll p { animation:scroll1 0.5s ease-in-out forwards; }
@keyframes scroll1 {
	0% { opacity:1; transform:translateY(0%) rotateX(0deg); }
	100% { opacity:0; transform:translateY(-50%) rotateX(-90deg); }
}
.contents_main_on .contents_main_scroll p { animation:scroll2 0.5s ease-in-out forwards; }
@keyframes scroll2 {
	0% { opacity:0; transform:translateY(-50%) rotateX(-90deg); }
	100% { opacity:1; transform:translateY(0%) rotateX(0deg); }
}



/*OPENING*/
.opening_on .opening_logo > div:nth-child(1) img { animation:opening_on0 0.75s steps(44) 1.25s forwards; }
@keyframes opening_on0 {
	0% { left:0; }
	100% { left:-4400%; }
}
.opening_on .opening_logo > div:nth-child(2) { animation:opening_on1 1.25s ease-in-out 1.5s forwards; }
@keyframes opening_on1 {
	0% { width:0; }
	100% { width:100%; }
}
.opening_on .opening_logo { animation:opening_on2 ease-in-out 0.75s forwards; }
@keyframes opening_on2 {
	0% { background:rgba(255,255,255,0); }
	100% { background:rgba(255,255,255,1); }
}
.opening_shadow img { animation:opening_shadow0 2s ease-in-out infinite; }
@keyframes opening_shadow0 {
	0% { opacity:1; }
	50% { opacity:0; }
	100% { opacity:1; }
}
.firefox .opening_on .opening_shadow img { animation:none; }



/*LOADING*/
.wrap_on .loading { animation:wrap_on0 0.5s ease-in-out forwards; }
@keyframes wrap_on0 {
	0% { opacity:0; }
	100% { opacity:1; }
}
.wrap_off .loading { animation:wrap_off0 0.5s ease-in-out forwards; }
@keyframes wrap_off0 {
	0% { opacity:1; }
	100% { opacity:0; }
}
.wrap_off .header_difference { animation:wrap_off1 1s ease-in-out forwards; }
@keyframes wrap_off1 {
	0% { opacity:0; }
	100% { opacity:1; }
}
.wrap_off .contents_main_img { animation:wrap_off2 1.5s ease-in-out forwards; }
@keyframes wrap_off2 {
	0% { transform:scale(1.05) translate3d(0,0,0); opacity:0; }
	100% { transform:scale(1) translate3d(0,0,0); opacity:1; }
}
.wrap_off .contents_main_title div > p:nth-child(2) { animation:wrap_off3 0.75s ease-in-out 0.75s forwards; }
@keyframes wrap_off3 {
	0% { width:0; }
	100% { width:100%; }
}
.wrap_off .contents_main_scroll { animation:wrap_off4 1.25s ease-in-out 0.25s forwards; }
@keyframes wrap_off4 {
	0% { opacity:0; }
	100% { opacity:1; }
}
.wrap_off .contents_main_illust { animation:wrap_off5 1.25s ease-in-out 0.25s forwards; }
@keyframes wrap_off5 {
	0% { opacity:0; }
	100% { opacity:1; }
}



/*SCROLL*/
.scroll_on { animation:scroll_on0 0.5s ease-in-out forwards; }
@keyframes scroll_on0 {
	0% { opacity:0; transform:translate(0,15px); }
	100% { opacity:1; transform:translate(0,0); }
}
.scroll_off { animation:scroll_off0 0.5s ease-in-out forwards; }
@keyframes scroll_off0 {
	0% { opacity:1; transform:translate(0,0); }
	100% { opacity:0; transform:translate(0,15px); }
}
#store .scroll_on { animation:scroll_on1 0.5s ease-in-out forwards; }
@keyframes scroll_on1 {
	0% { opacity:0; }
	100% { opacity:1; }
}
#store .scroll_off { animation:scroll_off1 0.5s ease-in-out forwards; }
@keyframes scroll_off1 {
	0% { opacity:1; }
	100% { opacity:0; }
}
.scroll_on .motion_line { animation:scroll_on2 0.25s ease-in-out 0.25s forwards; }
@keyframes scroll_on2 {
	0% { left:-100%; opacity:0; }
	100% { left:0; opacity:1; }
}



/*SELECT*/
.select_on { animation:select_on0 1s ease-in-out forwards; }
@keyframes select_on0 {
	0% { opacity:0; transform:translate(0,15px); }
	50% { opacity:0; transform:translate(0,15px); }
	100% { opacity:1; transform:translate(0,0); }
}
.select_off { animation:select_off0 0.5s ease-in-out forwards; }
@keyframes select_off0 {
	0% { opacity:1; transform:translate(0,0); }
	100% { opacity:0; transform:translate(0,15px); }
}



/*BUTTON*/
.line_button_on span { animation:line_button_on0 0.625s ease-in-out forwards; }
@keyframes line_button_on0 {
	0% { left:0; opacity:1; }
	49% { left:100%; opacity:0; }
	51% { left:-100%; opacity:0; }
	100% { left:0; opacity:1; }
}



/*POPUP*/
.popup_on { animation:popup_on0 0.5s ease-in-out forwards; }
@keyframes popup_on0 {
	0% { opacity:0; }
	100% { opacity:1; }
}
.popup_on .popup_inner { animation:popup_on1 0.5s ease-in-out 0.5s forwards; }
@keyframes popup_on1 {
	0% { opacity:0; }
	100% { opacity:1; }
}
.popup_off { animation:popup_off0 0.5s ease-in-out forwards; }
@keyframes popup_off0 {
	0% { opacity:1; }
	100% { opacity:0; }
}



/*HEADER*/
.header_fix .header_inner { animation:header_fix0 0.5s ease-in-out forwards; }
@keyframes header_fix0 {
	0% { opacity:0; transform:translate(0,30%); }
	100% { opacity:1; transform:translate(0,0); }
}
.header_nofix .header_inner { animation:header_nofix0 0.25s ease-in-out forwards; }
@keyframes header_nofix0 {
	0% { opacity:1; transform:translate(0,0); }
	100% { opacity:0; transform:translate(0,-15%); }
}



/*MENU*/
.header_on .header_menu_inner { animation:header_on0 0.25s ease-in-out forwards; }
@keyframes header_on0 {
	0% { opacity:0; }
	100% { opacity:1; }
}
.header_on .header_menu_inner > a:nth-child(1) { animation:header_on1 0.25s ease-in-out 0.2s forwards; }
.header_on .header_menu_inner > a:nth-child(2) { animation:header_on1 0.25s ease-in-out 0.225s forwards; }
.header_on .header_menu_inner > a:nth-child(3) { animation:header_on1 0.25s ease-in-out 0.25s forwards; }
.header_on .header_menu_inner > a:nth-child(4) { animation:header_on1 0.25s ease-in-out 0.275s forwards; }
.header_on .header_menu_inner > a:nth-child(5) { animation:header_on1 0.25s ease-in-out 0.3s forwards; }
.header_on .header_menu_inner > a:nth-child(6) { animation:header_on1 0.25s ease-in-out 0.325s forwards; }
.header_on .header_menu_inner > a:nth-child(7) { animation:header_on1 0.25s ease-in-out 0.35s forwards; }
.header_on .header_menu_inner > div:nth-child(8) { animation:header_on1 0.25s ease-in-out 0.375s forwards; }
@keyframes header_on1 {
	0% { opacity:0; transform:translate(0,-10px) scale(1.05); }
	100% { opacity:1; transform:translate(0,0) scale(1); }
}
@media (max-width:960px){
	.header_on .header_menu_inner > a:nth-child(1) { animation:header_on1_0_sp 0.25s ease-in-out 0.2s forwards; }
	.header_on .header_menu_inner > a:nth-child(2) { animation:header_on1_0_sp 0.25s ease-in-out 0.225s forwards; }
	.header_on .header_menu_inner > a:nth-child(3) { animation:header_on1_0_sp 0.25s ease-in-out 0.25s forwards; }
	.header_on .header_menu_inner > a:nth-child(4) { animation:header_on1_0_sp 0.25s ease-in-out 0.275s forwards; }
	.header_on .header_menu_inner > a:nth-child(5) { animation:header_on1_0_sp 0.25s ease-in-out 0.3s forwards; }
	.header_on .header_menu_inner > a:nth-child(6) { animation:header_on1_0_sp 0.25s ease-in-out 0.325s forwards; }
	.header_on .header_menu_inner > a:nth-child(7) { animation:header_on1_0_sp 0.25s ease-in-out 0.35s forwards; }
	.header_on .header_menu_inner > div:nth-child(8) { animation:header_on1_1_sp 0.25s ease-in-out 0.375s forwards; }
}
@keyframes header_on1_0_sp {
	0% { opacity:0; transform:translate(0,-5px) scale(1.025); }
	100% { opacity:1; transform:translate(0,0) scale(1); }
}
@keyframes header_on1_1_sp {
	0% { opacity:0; }
	100% { opacity:1; }
}
.header_off .header_menu_inner { animation:header_off0 0.25s ease-in-out forwards; }
@keyframes header_off0 {
	0% { opacity:1; }
	100% { opacity:0; }
}
.header_on .header_button_inner > div:nth-child(1) { animation:header_on2 0.3125s ease-in-out 0.3125s forwards; }
@keyframes header_on2 {
	0% { transform:rotate(0deg) translate3d(0,0,0); }
	100% { transform:rotate(45deg) translate3d(0,0,0); }
}
.header_on .header_button_inner > div:nth-child(3) { animation:header_on3 0.3125s ease-in-out 0.3125s forwards; }
@keyframes header_on3 {
	0% { transform:rotate(0deg) translate3d(0,0,0); }
	100% { transform:rotate(-45deg) translate3d(0,0,0); }
}
.header_off .header_button_inner > div:nth-child(1) span { animation:header_off1 2.5s ease-in-out 0s infinite; }
.header_off .header_button_inner > div:nth-child(2) span { animation:header_off1 2.5s ease-in-out 0.15s infinite; }
.header_off .header_button_inner > div:nth-child(3) span { animation:header_off1 2.5s ease-in-out 0.3s infinite; }
@keyframes header_off1 {
	0% { left:-100%; opacity:0; }
	15% { left:0; opacity:1; }
	85% { left:0; opacity:1; }
	100% { left:100%; opacity:0; }
}



/*HOME*/
.slide_on .store_slide_img { animation:slide_on0 12.5s linear forwards; }
.slide_on.main_slide span { animation:slide_on0 12.5s linear forwards; }
@keyframes slide_on0 {
	0% { transform:scale(1.25) translate3d(0,0,0); }
	100% { transform:scale(1) translate3d(0,0,0); }
}
.slide_on .store_slide_logo { animation:slide_on1 1.25s ease-in-out 1.25s forwards; }
@keyframes slide_on1 {
	0% { opacity:0; transform:scale(1.05) translate3d(0,0,0); }
	100% { opacity:1; transform:scale(1) translate3d(0,0,0); }
}



/*FAQ*/
.faq_on .faq_list_a { animation:faq_on0 1s ease-in-out forwards; }
@keyframes faq_on0 {
	0% { opacity:0; }
	25% { opacity:0; }
	75% { opacity:1; }
	100% { opacity:1; }
}
.faq_on .open_button > div:nth-child(1) { animation:faq_on1 0.5s ease-in-out forwards; }
@keyframes faq_on1 {
	0% { transform:rotate(0deg) translate3d(0,0,0); }
	100% { transform:rotate(45deg) translate3d(0,0,0); }
}
.faq_on .open_button > div:nth-child(2) { animation:faq_on2 0.5s ease-in-out forwards; }
@keyframes faq_on2 {
	0% { transform:rotate(90deg) translate3d(0,0,0); }
	100% { transform:rotate(135deg) translate3d(0,0,0); }
}
.faq_on .open_button div span { animation:faq_on3 0.75s ease-in-out forwards; }
@keyframes faq_on3 {
	0% { left:0; opacity:1; }
	49% { left:100%; opacity:0; }
	51% { left:-100%; opacity:0; }
	100% { left:0; opacity:1; }
}
.faq_off .faq_list_a { animation:faq_off0 0.5s ease-in-out forwards; }
@keyframes faq_off0 {
	0% { opacity:1; }
	100% { opacity:0; }
}
.faq_off .open_button > div:nth-child(1) { animation:faq_off1 0.5s ease-in-out forwards; }
@keyframes faq_off1 {
	0% { transform:rotate(45deg) translate3d(0,0,0); }
	100% { transform:rotate(90deg) translate3d(0,0,0); }
}
.faq_off .open_button > div:nth-child(2) { animation:faq_off2 0.5s ease-in-out forwards; }
@keyframes faq_off2 {
	0% { transform:rotate(135deg) translate3d(0,0,0); }
	100% { transform:rotate(180deg) translate3d(0,0,0); }
}
.faq_off .open_button > div:nth-child(1) span { animation:faq_off3 0.75s ease-in-out forwards; }
@keyframes faq_off3 {
	0% { left:0; opacity:1; }
	49% { left:100%; opacity:0; }
	51% { left:-100%; opacity:0; }
	100% { left:0; opacity:1; }
}
.faq_off .open_button > div:nth-child(2) span { animation:faq_off4 0.75s ease-in-out forwards; }
@keyframes faq_off4 {
	0% { left:0; opacity:1; }
	49% { left:-100%; opacity:0; }
	51% { left:100%; opacity:0; }
	100% { left:0; opacity:1; }
}





/*BANNER*/
.banner_on { animation:banner_on0 0.5s ease-in-out 4s forwards; }
@keyframes banner_on0 {
	0% { opacity:0; transform:translate(0,15px); }
	100% { opacity:1; transform:translate(0,0); }
}
.banner_repeat { animation:banner_repeat0 0.5s ease-in-out 0.5s forwards; }
@keyframes banner_repeat0 {
	0% { opacity:0; transform:translate(0,15px); }
	100% { opacity:1; transform:translate(0,0); }
}
.banner_off { animation:banner_off0 0.5s ease-in-out forwards; }
@keyframes banner_off0 {
	0% { opacity:1; transform:translate(0,0); }
	100% { opacity:0; transform:translate(0,15px); }
}




