@charset "UTF-8";
.wrapper{
	position: relative;
	/*max-width: 1920px;*/
}
header{
	position: absolute;
	top: 65px;
	left: 8px;
	width: auto;
	padding: 20px 0px 17px;
}
nav.menu{
	position: absolute;
	top: 188px;
	/*top: 35px;*/
	left: 5px;
}
nav.menu,
header{
	z-index: 6;
}

main{
	position: relative;
	display: block;
	width: auto;
	min-height: auto;
}
.kv{
	padding-bottom: 0%;
	z-index: 5;
	margin-top: 0px;
	overflow: hidden;
}
.kv .inner{
	position: relative;
	margin-top: 65px;
}
.kv-img{
	width: 100%
}
img.kv-05,
img.kv-04,
img.kv-03,
img.kv-02,
img.kv-01{
	width: 100%;
	position: absolute;
	left: 0;
}
img.kv-01{bottom: 4%; z-index: 5;}
img.kv-02{/*top: 46.5%;*/ top:677px; z-index: 4;}
img.kv-03{/*bottom: 37.5%;*/ top:357px; z-index: 3;}
img.kv-04{/*top: 17%;*/ top:248px; z-index: 2;}
img.kv-05{/*top: 0.5%;*/ top: 7px; z-index: 1;}
img.kv-bottom{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 4;
}
ul.kv-mv-bnr{
	position: absolute;
	right: 20px;
	top: 20px;
	z-index: 3;
}
ul.kv-mv-bnr li{
	position: relative;
	margin-bottom: 10px;
	width: 244px;
}
a.kv-movie .img{
	position: relative;
	display: block;
}
a.kv-movie .img:before{
	content: "";
	background-color: rgba(0,0,0,.5);
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}
a.kv-movie .img:after{
	content: "";
	background-image: url(../img/common/play.png);
	background-size: contain;
	width: 31px;
	height: 39px;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	background-repeat: no-repeat;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
a.kv-movie .title{
	display: block;
	text-align: left;
	font-size: 16px;
	line-height: 26px;
	margin-top: 10px;
}
a.kv-movie .title>span{
	padding: 0 3px;
	background-color: #000;
	color: #fff;
}
a.kv-movie:hover{opacity: 1;}
a.kv-movie img{
	border-style: solid;
	border-width: 2px;
	border-color: rgb(0, 0, 0);
	background-color: rgb(255, 255, 255);
	box-shadow: 4px 5px 0px 0px rgba(0, 0, 0, 1);
	-webkit-box-shadow: 4px 5px 0px 0px rgba(0, 0, 0, 1);
	width: 240px;
}
ul.kv-bnr li{
	position: absolute;
	z-index: 3;
}
ul.kv-bnr li:first-child{
	top: 322px;
	right: 16px;
}
ul.kv-bnr li.school-mate{
	top: 420px;
	left: 23px;
}

img.kv-lead{
	position: absolute;
	top: 12px;
	left: 0;
	width: 100%;
	z-index: 4;
}

.contents{
	margin-top: -1%;
	font-size: 0;
}
.contents .activity,
.contents .sns{
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 52%;
}
.contents .sns{
	margin-right: -3%;
	width: 53%;
}

.contents .activity{
	margin-top: -4.7%;
	margin-left: -2%;
}
.contents img.bg{
	width: 100%;
}
.contents .sns img.text{
	position: absolute;
	top: 12%;
	left: 2%;
	width: 90%;
}
.contents .sns a.btn{
	position: absolute;
	bottom: 14%;
	right: 4%;
	width: 49.5%;
}
.contents .sns a.btn img{width: 100%;}
.contents .sns .star01,
.contents .sns .star02{
	position: absolute;
	bottom: 12%;
}
.contents .sns .star01{left: 7%;}
.contents .sns .star02{left: 20%;}

.contents .activity .fukidashi04,
.contents .activity .fukidashi03,
.contents .activity .fukidashi02,
.contents .activity .fukidashi01{
	position: absolute;
}
.contents .activity .fukidashi01{
	bottom: 0;
	left: 8.5%;
	width: 48%;
	z-index: 3;
}
.contents .activity .fukidashi02{
	bottom: 20%;
	left: 5.5%;
	width: 33%;
	z-index: 2;
}
.contents .activity .fukidashi03{
	bottom: 6%;
	left: 52%;
	width: 26%;
	z-index: 2;
}
.contents .activity .fukidashi04{
	bottom: 14%;
	left: 32%;
	width: 51%;
	z-index: 1;
}
.contents .activity .deco{
	position: absolute;
	bottom: 48%;
	right: 5%;
}
.contents .activity img.text{
	position: absolute;
	top: 6%;
	left: 6%;
	width: 91.5%;
}


.audition{
	background-image: url(../img/top/audition_bg.png?0925);
	background-size: cover;
	padding-top: 60%;
	position: relative;
	margin-top: -7%;
	z-index: 3;
}
.audition .inner{
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -48%);
	transform: translate(-50%, -48%);
	z-index: 1;
	width: 1140px;
}
.audition h2 img{
	margin: 0 auto;
}

.process{margin-top: 4%;}
.process li{
	width: 328px;
	height: 324px;
	float: left;
	position: relative;
	overflow: hidden;
	background-color: #fff;
	color: #000;
	opacity: 0;
}
.process li:nth-child(5){
	border-style: solid;
	border-width: 2px;
	border-color: rgb(0, 0, 0);
	background-color: rgb(255, 255, 255);
	box-shadow: 4px 5px 0px 0px rgba(0, 0, 0, 1);
	-webkit-box-shadow: 4px 5px 0px 0px rgba(0, 0, 0, 1);
}
.process li.process-arrow {
	width: auto;
	background-color: transparent;
}
.process li.process-img{
	width: auto;
	height: auto;
}
.process-inner{
	padding: 63px 15px;
}
.process li:nth-child(5) .process-inner{
	padding: 40px 15px;
}
.process h3 {
	font-size: 30px;
	line-height: 40px;
	margin-bottom: 10px;
}
.process li:nth-child(3) .process-date {width: 290px;}
.process li:nth-child(5) .process-date {margin-top: 0;}
.process-date {
	background-color: #000;
	color: #fff;
	display: inline-block;
	padding: 0px;
	font-weight: normal;
	font-size: 1rem;
	line-height: 1.8;
	transform: skewX(-20deg);
	-webkit-transform: skewX(-20deg);
	width: 260px;
	margin-top: 10px;
}
.process-date>span {
	transform: skewX(20deg);
	-webkit-transform: skewX(20deg);
	display: block;
}
.process-result img {
	margin: 20px auto 8px;
}
.process-result h3 {
	 margin-bottom: 10px;
	 color: #ff027f;
}
.process-result .process-date {
	background-color: #ff027f;
}
.process li:nth-child(1){left: -9.5%;}
.process li:nth-child(2){left: -39%;}
.process li:nth-child(3){left: -44.5%;}
.process li:nth-child(4){left: -74.5%;}
.process li:nth-child(5){left: -79.5%;}
.process.act li{
	transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
	-moz-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
	-webkit-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
	-ms-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
	opacity: 1;
	left: 0px;
}

.process.act li:nth-child(2){
	transition-delay: 0.1s;
	-webkit-transition-delay: 0.1s;
}
.process.act li:nth-child(3){
	transition-delay: 0.3s;
	-webkit-transition-delay: 0.3s;
}
.process.act li:nth-child(4){
	transition-delay: 0.4s;
	-webkit-transition-delay: 0.4s;
}
.process.act li:nth-child(5){
	transition-delay: 0.6s;
	-webkit-transition-delay: 0.6s;
}


.news{
	background-image: url(../img/top/news_bg.png?0925);
	background-size: cover;
	padding-top: 10%;
	padding-bottom: 8%;
	position: relative;
	margin-top: -7%;
	z-index: 3;
}
.news .inner{
	margin: 0 auto;
	width: 70%;
}
.news h2{margin-bottom: 4%;}
.news h2 img{margin: 0 auto;}
.news a.more {
	display: block;
	width: 253px;
	margin: 5% auto 0%;
}
a.totop{
	position: fixed;
	right: 3%;
	bottom: 3%;
	z-index: 5;
	transition: all .5s ease;
	-webkit-transition: all .5s ease;
	opacity: 0;
}
.live-streaming{
	z-index: 5;
	background-image: url(../img/top/live_streaming_bg.png?0512);
	background-size: cover;
	height: 1004.5px;
	padding-top: 75px;
	margin-top: -100px;
}
.live-streaming h2{
	margin-bottom: 10px;
	cursor: pointer;
	z-index: 2;
	position: relative;
}
.live-streaming h2 img{margin: 0 auto;}
.live-streaming .characters{
	position: relative;
	width: 1245px;
	margin: 0 auto;
	opacity: 0;
	z-index: 1;
}

.live-streaming .chara>a {
	position: relative;
	display: block;
	overflow: hidden;
}

.live-streaming .chara{
	position: absolute;
}
.live-streaming .chara.rhyme{
	top: 0;
	left: 0;
}
.live-streaming .chara.shiika{
	top: -56px;
	left: 590px;
	z-index: 2;
}
.live-streaming .chara.himawari{
	top: 263px;
	left: 0;
}
.live-streaming .chara.chieri{
	top: 205px;
	left: 590px;
	z-index: 2;
}
.live-streaming .chara.ibuki{
	top: 539px;
	left: 0;
}
.live-streaming .chara.fubuki{
	top: 480px;
	right: 0;
	z-index: 2;
}
.streaming-chara{
	position: absolute;
	z-index: 2;
	opacity: 0;
}
.chara.rhyme .streaming-chara{
	bottom: 0;
	left: 0;
}
.chara.shiika .streaming-chara{
	bottom: 29px;
	right: 10px;
}
.chara.himawari .streaming-chara{
	bottom: 12px;
	left: 136px;
}
.chara.chieri .streaming-chara{
	bottom: 2px;
	left: 72px;
}
.chara.ibuki .streaming-chara{
	bottom: 6px;
	left: 50px;
	width: auto;
	height: 272px;
}
.chara.fubuki .streaming-chara{
	bottom: 23px;
	right: 20px;
	width: auto;
	height: 271px;
}

.streaming-fukidashi{
	position: absolute;
	opacity: 0;
}
.chara.rhyme .streaming-fukidashi{
	top: 10px;
	right: 48px;
}
.chara.shiika .streaming-fukidashi{
	top: 38px;
	left: 55px;
}
.chara.himawari .streaming-fukidashi{
	left: 0;
	top: 21px;
}
.chara.chieri .streaming-fukidashi{
	right: 20px;
	top: 30px;
}
.chara.ibuki .streaming-fukidashi{
	bottom: 33px;
	right: 75px;
	width: 290px;
	height: auto;
}
.chara.fubuki .streaming-fukidashi{
	bottom: 0;
	left: 65px;
	height: 250px;
	width: auto;
}
.streaming-layer{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.characters.act{
	opacity: 1;
}
.characters.act .streaming-layer{
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
.characters.act .streaming-chara{
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}

.characters.act .streaming-fukidashi {
	-webkit-animation-duration: 0.8s;
	animation-duration: 0.8s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-delay: .7s;
	animation-delay: .7s;
}


.characters.act .chara.rhyme .streaming-layer{
	-webkit-animation-name: layerBgUpOut;
	animation-name: layerBgUpOut;
}
.characters.act .chara.ibuki .streaming-fukidashi,
.characters.act .chara.ibuki .streaming-chara,
.characters.act .chara.rhyme .streaming-fukidashi,
.characters.act .chara.rhyme .streaming-chara{
	-webkit-animation-name: leftIn;
	animation-name: leftIn;
}
.characters.act .chara.fubuki .streaming-layer,
.characters.act .chara.shiika .streaming-layer{
	-webkit-animation-name: layerBgRightOut;
	animation-name: layerBgRightOut;
}
.characters.act .chara.fubuki .streaming-fukidashi,
.characters.act .chara.fubuki .streaming-chara,
.characters.act .chara.shiika .streaming-fukidashi,
.characters.act .chara.shiika .streaming-chara{
	-webkit-animation-name: rightIn;
	animation-name: rightIn;
}
.characters.act .chara.ibuki .streaming-layer,
.characters.act .chara.himawari .streaming-layer{
	-webkit-animation-name: layerBgLeftOut;
	animation-name: layerBgLeftOut;
}
.characters.act .chara.himawari .streaming-fukidashi,
.characters.act .chara.himawari .streaming-chara{
	-webkit-animation-name: rightIn;
	animation-name: rightIn;
}

.characters.act .chara.chieri .streaming-layer{
	-webkit-animation-name: layerBgDownOut;
	animation-name: layerBgDownOut;
}
.characters.act .chara.chieri .streaming-fukidashi,
.characters.act .chara.chieri .streaming-chara{
	-webkit-animation-name: leftIn;
	animation-name: leftIn;
}
@-webkit-keyframes layerBgUpOut {
	from {top: 0%;}
	to {top: -100%;}
}
@keyframes layerBgUpOut {
	from {top: 0%;}
	to {top: -100%;}
}
@-webkit-keyframes layerBgDownOut {
	from {top: 0%;}
	to {top: 100%;}
}
@keyframes layerBgDownOut {
	from {top: 0%;}
	to {top: 100%;}
}
@-webkit-keyframes layerBgLeftOut {
	from {left: 0%;top: 0%;}
	to {left: -100%;top: 19%;}
}
@keyframes layerBgLeftOut {
	from {left: 0%;top: 0%;}
	to {left: -100%;top: 19%;}
}
@-webkit-keyframes layerBgRightOut {
	from {left: 0%;top: 0%;}
	to {left: 100%;top: -19%;}
}
@keyframes layerBgRightOut {
	from {left: 0%;top: 0%;}
	to {left: 100%;top: -19%;}
}

@keyframes leftIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-5%, 0, 0);
		transform: translate3d(-5%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@-webkit-keyframes leftIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-5%, 0, 0);
		transform: translate3d(-5%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes rightIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(5%, 0, 0);
		transform: translate3d(5%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@-webkit-keyframes rightIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(5%, 0, 0);
		transform: translate3d(5%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

.anim{
	opacity: 0;
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease;
}
nav.menu ul li{
	opacity: 0;
	display: none;
	-webkit-animation-duration: .2s;
	animation-duration: .2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease;
}
nav.menu.act ul li{
	display: block;
	-webkit-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
}
nav.menu.act ul li:nth-child(1){
	-webkit-animation-name: .1s;
	animation-delay: .1s;
}
nav.menu.act ul li:nth-child(2){
	-webkit-animation-name: .2s;
	animation-delay: .2s;
}
nav.menu.act ul li:nth-child(3){
	-webkit-animation-name: .3s;
	animation-delay: .3s;
}
nav.menu.act ul li:nth-child(4){
	-webkit-animation-name: .4s;
	animation-delay: .4s;
}
nav.menu.act ul li:nth-child(5){
	-webkit-animation-name: .5s;
	animation-delay: .5s;
}
nav.menu.act ul li:nth-child(6){
	-webkit-animation-name: .6s;
	animation-delay: .6s;
}
nav.menu.act ul li:nth-child(7){
	-webkit-animation-name: .7s;
	animation-delay: .7s;
}
nav.menu.act ul li:nth-child(8){
	-webkit-animation-name: .8s;
	animation-delay: .8s;
}
nav.menu.act ul li:nth-child(9){
	-webkit-animation-name: .9s;
	animation-delay: .9s;
}
nav.menu.act ul li:nth-child(10){
	-webkit-animation-name: 1.0s;
	animation-delay: 1.0s;
}
img.kv-01,
img.kv-05,
img.kv-04,
img.kv-03,
img.kv-02{
	opacity: 0;
	-webkit-animation-duration: .6s;
	animation-duration: .6s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-timing-function: ease-out;
	animation-timing-function: ease-out;
}
img.kv-01{
	-webkit-animation-duration: .8s;
	animation-duration: .8s;
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease;
}
img.kv-02{
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
img.kv-05.act,
img.kv-04.act{
	-webkit-animation-name: kvFadeIn;
	animation-name: kvFadeIn;
}
img.kv-03.act{
	-webkit-animation-name: kvFadeIn03;
	animation-name: kvFadeIn03;
}
img.kv-02.act{
	-webkit-animation-name: kvFadeIn02;
	animation-name: kvFadeIn02;
}
img.kv-01.act{
	-webkit-animation-name: kvFadeIn01;
	animation-name: kvFadeIn01;
}

@-webkit-keyframes kvFadeIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(5%, -10%, 0);
		transform: translate3d(5%, -10%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes kvFadeIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(5%, -10%, 0);
		transform: translate3d(5%, -10%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@-webkit-keyframes kvFadeIn02 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(5%, -90%, 0);
		transform: translate3d(5%, -90%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes kvFadeIn02 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(5%, -90%, 0);
		transform: translate3d(5%, -90%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@-webkit-keyframes kvFadeIn03 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(5%, -20%, 0);
		transform: translate3d(5%, -20%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes kvFadeIn03 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(5%, -20%, 0);
		transform: translate3d(5%, -20%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@-webkit-keyframes kvFadeIn01 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(2%, 0%, 0);
		transform: translate3d(2%, 0%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes kvFadeIn01 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(2%, 0%, 0);
		transform: translate3d(2%, 0%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

ul.kv-bnr li,
.kv-mv-bnr li{
	display: none;
}
img.kv-lead{opacity: 0;}
img.kv-lead.act{
	-webkit-animation-name: leadFadeIn;
	animation-name: leadFadeIn;
}
@-webkit-keyframes leadFadeIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(20%, -15%, 0);
		transform: translate3d(20%, -15%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes leadFadeIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(20%, 0%, 0);
		transform: translate3d(20%, 0%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

.live-streaming h2.act{
	-webkit-animation-name: ttlFadeIn;
	animation-name: ttlFadeIn;
}
@-webkit-keyframes ttlFadeIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-20%, -15%, 0);
		transform: translate3d(-20%, -15%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes ttlFadeIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-20%, 15%, 0);
		transform: translate3d(-20%, 15%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

.contents .activity .layer,
.contents .sns .layer{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #000;
	z-index: 3;
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease;
}
.contents.act .sns .layer{
	-webkit-animation-name: down;
	animation-name: down;
}
.contents.act .activity img.text,
.contents.act .sns img.text{
	-webkit-animation-name: .3s;
	animation-delay: .3s;
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
.contents .sns a.btn{
	display: none;
}
.contents.act .sns a.btn{
	display: block;
	-webkit-animation-name: .5s;
	animation-delay: .5s;
	-webkit-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
}
.contents .sns .star02,
.contents .sns .star01{
	-webkit-transition-timing-function: ease;
	transition-timing-function: ease;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	opacity: 0;
}
.contents.act .sns .star02,
.contents.act .sns .star01{
	opacity: 1;
	-webkit-animation-name: starFade;
	animation-name: starFade;
}
.contents.act .sns .star01{
	-webkit-transition-duration: 1s;
	transition-duration: 1s;
	-webkit-transform: rotate(-220deg);
	transform: rotate(-220deg);
	-webkit-transition-delay: .8s;
	transition-delay: .8s;
	-webkit-animation-name: .8s;
	animation-delay: .8s;
}
.contents.act .sns .star02{
	-webkit-transition-duration: .6s;
	transition-duration: .6s;
	-webkit-transform: rotate(270deg);
	transform: rotate(270deg);
	-webkit-transition-delay: 1s;
	transition-delay: 1s;
	-webkit-animation-name: 1s;
	animation-delay: 1s;
}
@-webkit-keyframes starFade {
	0% {display: none;opacity: 0;}
	50% {display: block;opacity: 0;}
	100% {display: block;opacity: 1;}
}
@keyframes starFade {
	0% {display: none;opacity: 0;}
	50% {display: block;opacity: 0;}
	100% {display: block;opacity: 1;}
}


.contents.act .activity .layer{
	-webkit-animation-name: up;
	animation-name: up;
}
.contents.act .activity .fukidashi04,
.contents.act .activity .fukidashi03,
.contents.act .activity .fukidashi02,
.contents.act .activity .fukidashi01{
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
.contents.act .activity .fukidashi01{
	-webkit-animation-name: .5s;
	animation-delay: .5s;
}
.contents.act .activity .fukidashi03{
	-webkit-animation-name: .6s;
	animation-delay: .6s;
}
.contents.act .activity .fukidashi02{
	-webkit-animation-name: .7s;
	animation-delay: .7s;
}
.contents.act .activity .fukidashi04{
	-webkit-animation-name: .8s;
	animation-delay: .8s;
}
.contents.act .activity .deco{
	-webkit-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
	-webkit-animation-name: 1s;
	animation-delay: 1s;
}
@-webkit-keyframes down {
	from {top: 0%;}
	to {top: 100%;}
}
@keyframes down {
	from {top: 0%;}
	to {top: 100%;}
}
@-webkit-keyframes up {
	from {top: 0%;}
	to {top: -100%;}
}
@keyframes up {
	from {top: 0%;}
	to {top: -100%;}
}


.news .inner.act .news-list,
.news .inner.act h2,
.audition h2.act,
ul.kv-bnr li.act,
ul.sp-kv-bnr li.act,
.kv-mv-bnr li.act{
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
.kv-mv-bnr li:nth-child(2).act{
	-webkit-animation-name: .1s;
	animation-delay: .1s;
}
.kv-mv-bnr li:nth-child(3).act{
	-webkit-animation-name: .2s;
	animation-delay: .2s;
}
.kv-mv-bnr li:nth-child(4).act{
	-webkit-animation-name: .3s;
	animation-delay: .3s;
}
.kv-mv-bnr li:nth-child(5).act{
	-webkit-animation-name: .4s;
	animation-delay: .4s;
}
ul.sp-kv-bnr{display: none;}

.news .inner.act h2{
	-webkit-animation-name: .3s;
	animation-delay: .3s;
}
.news .inner.act .news-list{
	-webkit-animation-name: .6s;
	animation-delay: .6s;
}
.news .inner.act a.more{
	-webkit-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
	-webkit-animation-name: .8s;
	animation-delay: .8s;
}

@-webkit-keyframes fadeInUp {
	from {opacity: 0;-webkit-transform: translate3d(0, 10%, 0);transform: translate3d(0, 10%, 0);}
	to {opacity: 1;-webkit-transform: none;transform: none;}
}
@keyframes fadeInUp {
	from {opacity: 0;-webkit-transform: translate3d(0, 10%, 0);transform: translate3d(0, 10%, 0);}
	to {opacity: 1;-webkit-transform: none;transform: none;}
}
@-webkit-keyframes fadeInLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-5%, 0, 0);
		transform: translate3d(-5%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes fadeInLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-5%, 0, 0);
		transform: translate3d(-5%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

.live-streaming.act,
.news.act,
.audition.act{
	-webkit-animation-name: secIn;
	animation-name: secIn;
}
@-webkit-keyframes secIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 5%, 0);
		transform: translate3d(0, 5%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes secIn {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 5%, 0);
		transform: translate3d(0, 5%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}



/** smart phone **/
@media screen and (max-width: 767px){
	header{
		top: 4%;
		left: 1%;
		display: block !important;
		padding: 0;
		width: 33%;
	}
	header h1 img{
		width: 75%;
		margin: 0 auto;
	}
	nav.menu{
		position: fixed;
		top: 0;
		z-index: 9998;
	}
	nav.menu ul li{
		opacity: 1;
		display: block;
	}
	a.sp-menu{z-index: 9999;}
	main{padding: 0;}

	.kv{
		margin-top: 0;
		overflow: unset;
	}
	.kv .inner{
		position: static;
		margin-top: 0;
	}
	img.kv-01{
		left: 0%;
		bottom: 0%;
	}
	img.kv-02{top: -3%;}img.kv-04{top: -2.5%;}
	img.kv-05 {top: -2.5%;}
	img.kv-03{bottom: 12%;top: unset;}
	ul.kv-mv-bnr {
		width: 32%;
		top: 21%;
		left: 1%;
	}
	ul.kv-mv-bnr li{
		width: 100%;
	}
	a.kv-movie .title{
		font-size: 11px;
		line-height: 18px;
		margin-top: 3%;
	}
	a.kv-movie img {
		border-width: 1px;
		box-shadow: 2px 3px 0px 0px rgba(0, 0, 0, 1);
		-webkit-box-shadow: 2px 3px 0px 0px rgba(0, 0, 0, 1);
		width: 100%;
	}
	a.kv-movie:before{
		width: 101%;
	}
	a.kv-movie:after{
		width: 16px;
		height: 20px;
	}
	ul.kv-mv-bnr .kv-bnr{display: none !important;}
	ul.sp-kv-bnr {
		display: block;
		position: absolute;
		top: 11%;
		right: 1%;
		z-index: 5;
		width: 32%;
	}
	ul.sp-kv-bnr li{}
	ul.sp-kv-bnr li img{width: 100%;}

	img.kv-lead{
		position: static;
		margin: 3.5% 0 6%;
	}
	.contents,
	.audition,
	.news{
		margin-top: -5%;
	}
	.contents .activity,
	.contents .sns{
		display: block;
		width: auto;
	}
	.contents .sns img.text{
		left: 0;
		width: 97%;
	}
	.contents .activity img.text{
		left: 2%;
		width: 98%;
	}
	.contents .sns .star01{width: 12%;}
	.contents .sns .star02{width: 7%;}
	.contents .activity .deco{width: 12%;}
	.contents .activity .fukidashi01{width: 52%;}
	.contents .activity .fukidashi02,
	.contents .activity .fukidashi01{left: 0;}
	.contents .activity .fukidashi03{left: 47%;}
	.contents .activity .fukidashi04 {
		bottom: 13%;
		left: 27%;
		width: 54%;
	}
	.audition{
		background-image: url(../img/top/audition_bg_sp.png);
		background-size: cover;
		padding-top: 18%;
		padding-bottom: 20%;
	}
	.audition h2 img{width: 90%;}
	.audition .inner{
		width: auto;
		position: static;
		-webkit-transform: none;
		transform: none;
	}
	.process {
		padding: 0 3%;
	}
	.process li{
		float: none;
		width: 97%;
		height: auto;
		float: none;
		left: 0 !important;
	}
	.process li.process-img img{width: 100%;}
	.process li:nth-child(5) .process-inner,
	.process-inner {
		padding: 10% 5%;
	}
	.process li:nth-child(3) .process-date {width: 100%;}
	.process-date {
		font-size: 13px;
		line-height: 26px;
		margin-top: 3%;
		width: 100%;
	}
	.process h3 {
		font-size: 20px;
		line-height: 28px;
		margin-bottom: 10px;
	}
	.process-result img,
	.process-arrow>img{
		width: 9%;
		margin: 6% auto;
	}


	.news{
		padding-top: 20%;
		padding-bottom: 15%;
		background-image: url(../img/top/news_bg_sp.png);
		background-size: cover;
	}
	.news .inner{width: 94%;}
	.news h2 {margin-bottom: 15%;}
	.news h2 img{width: 36%;}
	.news a.more {
		width: 67%;
		margin: 8% auto 0%;
	}
	.news a.more img{width: 100%;}
	a.totop{width: 20%;}
	a.totop img{width: 100%;}

	.live-streaming{
		background-image: url(../img/top/live_streaming_bg_sp.png?0512);
		background-size: cover;
		height: auto;
		padding-top: 4%;
		padding-bottom: 12%;
		margin-top: -5%;
	}
	.live-streaming h2 {margin-bottom: -5%;}
	.live-streaming h2 img{width: 96%;}
	.live-streaming .characters{
		width: auto;
		margin-top: -3%;
	}
	.live-streaming .chara{
		position: static;
		margin-bottom: -7%;
	}
	.live-streaming .chara.chieri{
		margin-bottom: -3.5%;
	}
	.live-streaming .chara>a {
		width: 96%;
		margin: 0 auto;
	}
	.streaming-bg,
	.streaming-chara,
	.streaming-fukidashi{
		width: 100%;
	}
	.chara.rhyme .streaming-fukidashi {
		top: 10%;
		right: 0;
	}
	.chara.shiika .streaming-chara {
		bottom: 10%;
		right: 0;
	}
	.chara.shiika .streaming-fukidashi {
		top: 10%;
		left: 0;
	}
	.chara.himawari .streaming-chara {
		bottom: 0;
		left: 0;
	}
	.chara.himawari .streaming-fukidashi {
		left: 0;
		top: 0;
	}
	.chara.chieri .streaming-chara {
		bottom: 6%;
		left: 0;
	}
	.chara.chieri .streaming-fukidashi {
		right: 0;
		top: 16%;
	}
	.chara.ibuki .streaming-chara {
		bottom: 2%;
		left: 0;
		width: 100%;
		height: auto;
	}
	.chara.ibuki .streaming-fukidashi {
		bottom: 10.5%;
		right: 0;
		width: 100%;
		height: auto;
	}
	.chara.fubuki .streaming-chara {
		bottom: 8.5%;
		right: 0;
		width: 100%;
		height: auto;
	}
	.chara.fubuki .streaming-fukidashi {
		bottom: 3%;
		left: 0;
		height: auto;
		width: 100%;
	}
	.live-streaming .fubuki.chieri{
		margin-bottom: 0;
	}
	.characters.act .chara.shiika .streaming-layer,
	.characters.act .chara.chieri .streaming-layer{
		-webkit-animation-name: layerBgLeftOut;
		animation-name: layerBgLeftOut;
	}
	.characters.act .chara.himawari .streaming-layer,
	.characters.act .chara.rhyme .streaming-layer{
		-webkit-animation-name: layerBgRightOut;
		animation-name: layerBgRightOut;
	}

	.contents.act .sns .layer {
		-webkit-animation-name: leftSlide;
		animation-name: leftSlide;
	}
	.contents.act .activity .layer {
		-webkit-animation-name: rightSlide;
		animation-name: rightSlide;
	}
	@-webkit-keyframes leftSlide {
		from {left: 0%;}
		to {left: 100%;}
	}
	@keyframes leftSlide {
		from {left: 0%;}
		to {left: 100%;}
	}
	@-webkit-keyframes rightSlide {
		from {left: 0%;}
		to {left: -100%;}
	}
	@keyframes rightSlide {
		from {left: 0%;}
		to {left: -100%;}
	}

	.process li.act{
		-webkit-animation-duration: 0.5s;
		animation-duration: 0.5s;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
		-webkit-animation-name: auditionFadeIn;
		animation-name: auditionFadeIn;
	}
	@-webkit-keyframes auditionFadeIn {
		from {opacity: 0;-webkit-transform: translate3d(0, -10%, 0);transform: translate3d(0, -10%, 0);}
		to {opacity: 1;-webkit-transform: none;transform: none;}
	}
	@keyframes auditionFadeIn {
		from {opacity: 0;-webkit-transform: translate3d(0, -10%, 0);transform: translate3d(0, -10%, 0);}
		to {opacity: 1;-webkit-transform: none;transform: none;}
	}
	@-webkit-keyframes kvFadeIn02 {
		from {
			opacity: 0;
			-webkit-transform: translate3d(5%, -30%, 0);
			transform: translate3d(5%, -30%, 0);
		}
		to {
			opacity: 1;
			-webkit-transform: none;
			transform: none;
		}
	}
	@keyframes kvFadeIn02 {
		from {
			opacity: 0;
			-webkit-transform: translate3d(5%, -30%, 0);
			transform: translate3d(5%, -30%, 0);
		}
		to {
			opacity: 1;
			-webkit-transform: none;
			transform: none;
		}
	}
}