@charset "UTF-8";
/* CSS Document */

._an {
	opacity: 0;
	transform-origin: center;
	-webkit-transform-origin: center;

	transition: all 0ms cubic-bezier(0.42, 0, 0.58, 1.0);
	-webkit-transition: all 0ms cubic-bezier(0.42, 0, 0.58, 1.0);
}

.ie9 ._an {
	opacity: 1;
}

/* ------------------------------------------------
	SEKISUI
------------------------------------------------ */
/*  PC  */
@media all and (min-width:768px){
	#sec-esg ._an.logoSekisui {
		animation: _lgsks 1300ms ease-out 0ms alternate forwards;
		-moz-animation: _lgsks 1300ms ease-out 0ms alternate forwards;
		-webkit-animation: _lgsks 1300ms ease-out 0ms alternate forwards;
	}
}
@keyframes _lgsks {
	0%		{ opacity: 0; transform: scale(0.2); }
	10%		{ opacity: 1; transform: scale(0.88); }
	85%		{ opacity: 1; }
	100%	{ opacity: 0; transform: scale(1); }
}
@-moz-keyframes _lgsks {
	0%		{ opacity: 0; transform: scale(0.2); }
	10%		{ opacity: 1; transform: scale(0.88); }
	85%		{ opacity: 1; }
	100%	{ opacity: 0; transform: scale(1); }
}
@-webkit-keyframes _lgsks {
	0%		{ opacity: 0; -webkit-transform: scale(0.2); }
	10%		{ opacity: 1; -webkit-transform: scale(0.88); }
	85%		{ opacity: 1; }
	100%	{ opacity: 0; -webkit-transform: scale(1); }
}

/* poster E
------------------------------------------------ */
/*  PC  */
@media all and (min-width:768px){
	#sec-esg ._an.logoSekisui + .set li.poster_e {
		z-index: 4;
		animation: _slidein1 1400ms ease-in-out 0ms alternate forwards;
		-moz-animation: _slidein1 1400ms ease-in-out 0ms alternate forwards;
		-webkit-animation: _slidein1 1400ms ease-in-out 0ms alternate forwards;
	}
}
@keyframes _slidein1 {
	0%		{ opacity: 0; transform: scale(0.58) translate(-10%,6%); }
	70%		{ opacity: 0; transform: scale(0.58) translate(-10%,6%); }
	85%		{ opacity: 1; }
	100%	{ opacity: 1; transform: scale(1) translate(0,0); }
}
@-moz-keyframes _slidein1 {
	0%		{ opacity: 0; transform: scale(0.58) translate(-10%,6%); }
	70%		{ opacity: 0; transform: scale(0.58) translate(-10%,6%); }
	85%		{ opacity: 1; }
	100%	{ opacity: 1; transform: scale(1) translate(0,0); }
}
@-webkit-keyframes _slidein1 {
	0%		{ opacity: 0; -webkit-transform: scale(0.58) translate(-10%,6%); }
	70%		{ opacity: 0; -webkit-transform: scale(0.58) translate(-10%,6%); }
	85%		{ opacity: 1; }
	100%	{ opacity: 1; -webkit-transform: scale(1) translate(0,0); }
}

/* poster S
------------------------------------------------ */
/*  PC  */
@media all and (min-width:768px){
	#sec-esg .logoSekisui + .set li.poster_s {
		z-index: 3;
		animation: _slidein2 300ms ease-in-out 1500ms alternate forwards;
		-moz-animation: _slidein2 300ms ease-in-out 1500ms alternate forwards;
		-webkit-animation: _slidein2 300ms ease-in-out 1500ms alternate forwards;
	}
}
@keyframes _slidein2 {
	0%		{ opacity: 0; transform: translate(-100%,0); }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-moz-keyframes _slidein2 {
	0%		{ opacity: 0; transform: translate(-100%,0); }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-webkit-keyframes _slidein2 {
	0%		{ opacity: 0; -webkit-transform: translate(-100%,0); }
	100%	{ opacity: 1; -webkit-transform: translate(0,0); }
}

/* poster G
------------------------------------------------ */
/*  PC  */
@media all and (min-width:768px){
	#sec-esg .logoSekisui + .set li.poster_g {
		z-index: 2;
		animation: _slidein3 400ms ease-out 1600ms alternate forwards;
		-moz-animation: _slidein3 400ms ease-out 1600ms alternate forwards;
		-webkit-animation: _slidein3 400ms ease-out 1600ms alternate forwards;
	}
}
@keyframes _slidein3 {
	0%		{ opacity: 0; transform: translate(-200%,0); }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-moz-keyframes _slidein3 {
	0%		{ opacity: 0; transform: translate(-200%,0); }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-webkit-keyframes _slidein3 {
	0%		{ opacity: 0; -webkit-transform: translate(-200%,0); }
	100%	{ opacity: 1; -webkit-transform: translate(0,0); }
}

/* cover
------------------------------------------------ */
/*  PC  */
@media all and (min-width:768px){
	#sec-esg .logoSekisui + .set + .cover {
		height: 0;
		transition: height 0ms 2100ms cubic-bezier(0.42, 0, 0.58, 1.0);
		-webkit-transition: height 0ms 2100ms cubic-bezier(0.42, 0, 0.58, 1.0);
	}
}

/* ------------------------------------------------
	STORY
------------------------------------------------ */
.story ._an._strb {
	opacity: 1;
}
.story ._an .set .img,
.story ._an .set dl,
.story ._an .line::before,
.story ._an .line::after {
	opacity: 0;
	transform-origin: center;
	-webkit-transform-origin: center;

	transition: all 0ms cubic-bezier(0.42, 0, 0.58, 1.0);
	-webkit-transition: all 0ms cubic-bezier(0.42, 0, 0.58, 1.0);
}
.ie9 .story ._an .set .img,
.ie9 .story ._an .set dl,
.ie9 .story ._an .line::before,
.ie9 .story ._an .line::after {
	opacity: 1;
}
.story ._an .line::before { width: 0; }
.story ._an .line::after { height: 0; }

/* storyBox .line::before
------------------------------------------------ */
.story ._an.storyBox .line::before {
	animation: _strb_line_b 600ms ease-in 0ms alternate forwards;
	-moz-animation: _strb_line_b 600ms ease-in 0ms alternate forwards;
	-webkit-animation: _strb_line_b 600ms ease-in 0ms alternate forwards;
}
@keyframes _strb_line_b {
	0%		{ opacity: 1; width: 30%; }
	100%	{ opacity: 1; width: 100%; }
}
@-moz-keyframes _strb_line_b {
	0%		{ opacity: 1; width: 30%; }
	100%	{ opacity: 1; width: 100%; }
}
@-webkit-keyframes _strb_line_b {
	0%		{ opacity: 1; width: 30%; }
	100%	{ opacity: 1; width: 100%; }
}

/* storyBox .line::after
------------------------------------------------ */
.story ._an.storyBox .line::after {
	animation: _strb_line_a 2500ms ease-out 600ms alternate forwards;
	-moz-animation: _strb_line_a 2500ms ease-out 600ms alternate forwards;
	-webkit-animation: _strb_line_a 2500ms ease-out 600ms alternate forwards;
}
@keyframes _strb_line_a {
	0%		{ opacity: 1; height: 0; }
	100%	{ opacity: 1; height: 50%; }
}
@-moz-keyframes _strb_line_a {
	0%		{ opacity: 1; height: 0; }
	100%	{ opacity: 1; height: 50%; }
}
@-webkit-keyframes _strb_line_a {
	0%		{ opacity: 1; height: 0; }
	100%	{ opacity: 1; height: 50%; }
}

/* storyBox .img
------------------------------------------------ */
.story ._an.storyBox .set .img {
	animation: _strb_du 700ms ease-in-out 700ms alternate forwards;
	-moz-animation: _strb_du 700ms ease-in-out 700ms alternate forwards;
	-webkit-animation: _strb_du 700ms ease-in-out 700ms alternate forwards;
}
@keyframes _strb_du {
	0%		{ opacity: 0; transform: translate(0,50%); }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-moz-keyframes _strb_du {
	0%		{ opacity: 0; transform: translate(0,50%); }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-webkit-keyframes _strb_du {
	0%		{ opacity: 0; -webkit-transform: translate(0,50%); }
	100%	{ opacity: 1; -webkit-transform: translate(0,0); }
}

/* storyBox dl
------------------------------------------------ */
.story ._an.storyBox .set dl {
	animation: _strb_du 600ms ease-in-out 800ms alternate forwards;
	-moz-animation: _strb_du 600ms ease-in-out 800ms alternate forwards;
	-webkit-animation: _strb_du 600ms ease-in-out 800ms alternate forwards;
}

/* ------------------------------------------------
	main common
------------------------------------------------ */

/*	scrollLoop
------------------------------------------------ */
._an.scrollLoop {
	opacity: 1;
	animation: _scrl 800ms ease-in-out 0ms infinite normal;
	-moz-animation: _scrl 800ms ease-in-out 0ms infinite normal;
	-webkit-animation: _scrl 800ms ease-in-out 0ms infinite normal;
}
@keyframes _scrl {
	0%		{ transform: translate(0,0); }
	50%		{ transform: translate(0,25%); }
	100%	{ transform: translate(0,0); }
}
@-moz-keyframes _scrl {
	0%		{ transform: translate(0,0); }
	50%		{ transform: translate(0,25%); }
	100%	{ transform: translate(0,0); }
}
@-webkit-keyframes _scrl {
	0%		{ -webkit-transform: translate(0,0); }
	50%		{ -webkit-transform: translate(0,25%); }
	100%	{ -webkit-transform: translate(0,0); }
}

/* ------------------------------------------------
	common
------------------------------------------------ */

/*	loopAni
------------------------------------------------ */
._an.loopAni {
	opacity: 1;
	animation: _la 800ms ease-in-out 0ms infinite normal;
	-moz-animation: _la 800ms ease-in-out 0ms infinite normal;
	-webkit-animation: _la 800ms ease-in-out 0ms infinite normal;
}
@keyframes _la {
	0%		{ transform: rotate(0deg) scale(1); }
	60%		{ transform: rotate(360deg) scale(0.95); }
	100%	{ transform: rotate(0deg) scale(1); }
}
@-moz-keyframes _la {
	0%		{ transform: rotate(0deg) scale(1); }
	60%		{ transform: rotate(360deg) scale(0.95); }
	100%	{ transform: rotate(0deg) scale(1); }
}
@-webkit-keyframes _la {
	0%		{ -webkit-transform: rotate(0deg) scale(1); }
	60%		{ -webkit-transform: rotate(360deg) scale(0.95); }
	100%	{ -webkit-transform: rotate(0deg) scale(1); }
}

/*	zoomIn
------------------------------------------------ */
._an.zoomIn {
	animation: _zi 1000ms ease-in-out 0ms alternate forwards;
	-moz-animation: _zi 1000ms ease-in-out 0ms alternate forwards;
	-webkit-animation: _zi 1000ms ease-in-out 0ms alternate forwards;
}
@keyframes _zi {
	0%		{ opacity: 0; transform: scale(0.95); }
	100%	{ opacity: 1; transform: scale(1); }
}
@-moz-keyframes _zi {
	0%		{ opacity: 0; transform: scale(0.95); }
	100%	{ opacity: 1; transform: scale(1); }
}
@-webkit-keyframes _zi {
	0%		{ opacity: 0; -webkit-transform: scale(0.95); }
	100%	{ opacity: 1; -webkit-transform: scale(1); }
}

/*	zoomOut
------------------------------------------------ */
._an.zoomOut {
	animation: _zo 2600ms ease-out 0ms alternate forwards;
	-moz-animation: _zo 2600ms ease-out 0ms alternate forwards;
	-webkit-animation: _zo 2600ms ease-out 0ms alternate forwards;
}
@keyframes _zo {
	0%		{ opacity: 0; transform: scale(1.1); }
	50% 	{ opacity: 1; }
	100%	{ opacity: 1; transform: scale(1); }
}
@-moz-keyframes _zo {
	0%		{ opacity: 0; transform: scale(1.1); }
	50% 	{ opacity: 1; }
	100%	{ opacity: 1; transform: scale(1); }
}
@-webkit-keyframes _zo {
	0%		{ opacity: 0; -webkit-transform: scale(1.1); }
	50% 	{ opacity: 1; }
	100%	{ opacity: 1; -webkit-transform: scale(1); }
}

/*	fadeIn
------------------------------------------------ */
._an.fadeIn {
	animation: _fi 500ms ease-out 0ms alternate forwards;
	-moz-animation: _fi 500ms ease-out 0ms alternate forwards;
	-webkit-animation: _fi 500ms ease-out 0ms alternate forwards;
}
@keyframes _fi {
	from	{ opacity: 0; }
	to		{ opacity: 1; }
}
@-moz-keyframes _fi {
	from	{ opacity: 0; }
	to		{ opacity: 1; }
}
@-webkit-keyframes _fi {
	from	{ opacity: 0; }
	to		{ opacity: 1; }
}

/*	fadeInBounce
------------------------------------------------ */
._an.fadeInBounce {
	animation: _fib 450ms ease-in-out 0ms alternate forwards;
	-moz-animation: _fib 450ms ease-in-out 0ms alternate forwards;
	-webkit-animation: _fib 450ms ease-in-out 0ms alternate forwards;
}
@keyframes _fib {
	0%		{ opacity: 0; transform: scale(0.6); }
	65%		{ opacity: 1; transform: scale(1.15); }
	85%		{ opacity: 1; transform: scale(0.9); }
	100%	{ opacity: 1; transform: scale(1.0); }
}
@-moz-keyframes _fib {
	0%		{ opacity: 0; transform: scale(0.6); }
	65%		{ opacity: 1; transform: scale(1.15); }
	85%		{ opacity: 1; transform: scale(0.9); }
	100%	{ opacity: 1; transform: scale(1.0); }
}
@-webkit-keyframes _fib {
	0%		{ opacity: 0; -webkit-transform: scale(0.6); }
	65%		{ opacity: 1; -webkit-transform: scale(1.15); }
	85%		{ opacity: 1; -webkit-transform: scale(0.9); }
	100%	{ opacity: 1; -webkit-transform: scale(1.0); }
}

/*	smallMedium
------------------------------------------------ */
._an.smallMedium {
	animation: _sm 500ms ease-out 0ms alternate forwards;
	-moz-animation: _sm 500ms ease-out 0ms alternate forwards;
	-webkit-animation: _sm 500ms ease-out 0ms alternate forwards;
}
@keyframes _sm {
	0%		{ opacity: 0; transform: scale(0.6); }
	90%		{ opacity: 1; transform: scale(1.05); }
	100%	{ opacity: 1; transform: scale(1.0); }
}
@-moz-keyframes _sm {
	0%		{ opacity: 0; transform: scale(0.6); }
	90%		{ opacity: 1; transform: scale(1.05); }
	100%	{ opacity: 1; transform: scale(1.0); }
}
@-webkit-keyframes _sm {
	0%		{ opacity: 0; -webkit-transform: scale(0.6); }
	90%		{ opacity: 1; -webkit-transform: scale(1.05); }
	100%	{ opacity: 1; -webkit-transform: scale(1.0); }
}

/*	upDown
------------------------------------------------ */
._an.upDown {
	animation: _ud 500ms ease-out 0ms alternate forwards;
	-moz-animation: _ud 500ms ease-out 0ms alternate forwards;
	-webkit-animation: _ud 500ms ease-out 0ms alternate forwards;
}
@keyframes _ud {
	from	{ opacity: 0; transform: translate(0,-80%); }
	to		{ opacity: 1; transform: translate(0,0); }
}
@-moz-keyframes _ud {
	from	{ opacity: 0; transform: translate(0,-80%); }
	to		{ opacity: 1; transform: translate(0,0); }
}
@-webkit-keyframes _ud {
	from	{ opacity: 0; -webkit-transform: translate(0,-80%); }
	to		{ opacity: 1; -webkit-transform: translate(0,0); }
}

/*	downUp
------------------------------------------------ */
._an.downUp {
	animation: _du 600ms ease-out 0ms alternate forwards;
	-moz-animation: _du 600ms ease-out 0ms alternate forwards;
	-webkit-animation: _du 600ms ease-out 0ms alternate forwards;
}
@keyframes _du {
	from	{ opacity: 0; transform: translate(0,80%); }
	to		{ opacity: 1; transform: translate(0,0); }
}
@-moz-keyframes _du {
	from	{ opacity: 0; transform: translate(0,80%); }
	to		{ opacity: 1; transform: translate(0,0); }
}
@-webkit-keyframes _du {
	from	{ opacity: 0; -webkit-transform: translate(0,80%); }
	to		{ opacity: 1; -webkit-transform: translate(0,0); }
}

/*	leftRight
------------------------------------------------ */
._an.leftRight {
	animation: _lr 600ms ease-out 0ms alternate forwards;
	-moz-animation: _lr 600ms ease-out 0ms alternate forwards;
	-webkit-animation: _lr 600ms ease-out 0ms alternate forwards;
}
@keyframes _lr {
	0%		{ opacity: 0; transform: translate(-50%,0); }
	30%		{ opacity: 1; }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-moz-keyframes _lr {
	0%		{ opacity: 0; transform: translate(-50%,0); }
	30%		{ opacity: 1; }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-webkit-keyframes _lr {
	0%		{ opacity: 0; -webkit-transform: translate(-50%,0); }
	30%		{ opacity: 1; }
	100%	{ opacity: 1; -webkit-transform: translate(0,0); }
}

/*	rightLeft
------------------------------------------------ */
._an.rightLeft {
	animation: _rl 600ms ease-out 0ms alternate forwards;
	-moz-animation: _rl 600ms ease-out 0ms alternate forwards;
	-webkit-animation: _rl 600ms ease-out 0ms alternate forwards;
}
@keyframes _rl {
	0%		{ opacity: 0; transform: translate(50%,0); }
	30%		{ opacity: 1; }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-moz-keyframes _rl {
	0%		{ opacity: 0; transform: translate(50%,0); }
	30%		{ opacity: 1; }
	100%	{ opacity: 1; transform: translate(0,0); }
}
@-webkit-keyframes _rl {
	0%		{ opacity: 0; -webkit-transform: translate(50%,0); }
	30%		{ opacity: 1; }
	100%	{ opacity: 1; -webkit-transform: translate(0,0); }
}

/*	delay
------------------------------------------------ */
._an._delay1 {
	animation-delay: 300ms;
	-moz-animation-delay: 300ms;
	-webkit-animation-delay: 300ms;
}
._an._delay2 {
	animation-delay: 1000ms;
	-moz-animation-delay: 1000ms;
	-webkit-animation-delay: 1000ms;
}

/*	slow
------------------------------------------------ */
._an._slow {
	animation-duration: 800ms;
	-moz-animation-duration: 800ms;
	-webkit-animation-duration: 800ms;
}

/*	fast
------------------------------------------------ */
._an._fast {
	animation-duration: 300ms;
	-moz-animation-duration: 300ms;
	-webkit-animation-duration: 300ms;
}
