@charset "utf-8";

/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Site Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/



.bg_b {background: #222;}
.bg_w {background: #FFF;}
.col_b {color: #222;}
.col_w {color: #FFF;}
.mainTitle {
	font-size: 12.0rem;
	letter-spacing: 0.04em;
	line-height: 100px;
}
.mainTitle.min {
	font-size: 11.0rem;
}
.subTitle {
	margin-top: 20px;
	letter-spacing: 4px;
}
.subTitle span {
	padding: 2px 13px 2px 13px;
	letter-spacing: 0.42em;
}


/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     breadcrumb Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/


/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     page Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/
/*       top       */
#top {
	width: 1200px;
	margin: auto;
}
.top {
	padding: 140px 0 200px;
	position: relative;
}
.top .topBgImg {
	position: absolute;
	pointer-events: none;
}
.top .topBgImg.topLeft {
	top: 320px;
	left: -700px;
}
.top .topBgImg.topRight {
	top: -220px;
	right: -465px;
}
.top .topBgImg.bottomLeft {
	bottom: 55px;
	left: -230px;
}
.top .topBgImg.bottomRight {
	bottom: 30px;
	right: -360px;
}
.top .logoBox {
	position: relative;
	z-index: 1;
	padding: 0 30px;
}
.top .daysBox {
	position: absolute;
	padding-top: 20px;
}
.topCtt {
	position: relative;
	top: -30px;
	padding: 0 30px;
}
.topCtt .info {
	position: absolute;
	z-index: 1;
	padding-top: 50px;
}
.topCtt .kvBox {
	width: 860px;
	margin: 0 0 0 auto;
	position: relative;
}
.topCtt .kvBox .catchphraseBox {
	position: absolute;
	bottom: 30px;
	right: -35px;
	width: 80%;
}

.topicsBox {
	/*padding-top: 250px;*/
	padding-top: 150px;
	width: 300px;
}
.topicsBox a {
	display: block;
	padding: 10px 0;
}




.contentsBg {
	background: repeat-x center / cover;
	width: 100%;
	padding-top: 360px;
	position: absolute;
	z-index: -1;
	top: -40px;
}
.contentsBox {
	width: 1200px;
	margin: auto;
}
.contentsBox .elementBox {
	width: 1100px;
	margin: auto;
	display: -webkit-flex; display: flex;
	flex-wrap: wrap; -webkit-flex-wrap: wrap;
}
.elementBox .titleBox {
	width: 50%;
	position: relative;
	z-index: 1;
}
.contentsImg {
	position: absolute;
	z-index: -1;
	top: -160px;
	left: 70px;
}
.contentsImg .dot {
	position: absolute;
	z-index: -1;
	top: -90px;
	left: -90px;
}


.elementBox .linkBox {
	width: 50%;
	text-align: center;
	padding: 90px 0 0;
	height: 380px;
}
.linkBox .linkTitle {
	font-size: 2.5rem;
}
.linkBox .linkTxt {
	font-size: 2.4rem;
	padding-top: 30px;
}
.linkBox .linkTxt a {
	display: block;
	width: 290px;
	margin: auto;
	border-radius: 60px;
	color: #FFF;
	text-decoration: none;
	padding: 15px;
	font-weight: bold;
	letter-spacing: 0.13em;
}


.eventReportLink {
	text-align: center;
	padding: 50px 0;
}

/*       blu-ray       */
.blu-ray {
	position: relative;
	margin-top: 280px;
}
.blu-ray .contentsBox {
	background: #e9fce8;
}
.blu-ray .linkBox .linkTxt a {
	background: linear-gradient( 90deg,#02bf44 0%,#7deb3c 100%);
}



/*       about       */
.about {
	position: relative;
	margin-top: 360px;
}
.about .contentsBox {
	background: #fffae5;
}
.about .linkBox .linkTxt a {
	background: linear-gradient( 90deg,#ff8800 0%,#ffd400 100%);
}

/*       artists       */
.artists {
	position: relative;
	margin-top: 360px;
}
.artists .contentsBox {
	background: #fff5f8;
}
.artists .linkBox .linkTxt a {
	background: linear-gradient( 90deg,#ff4c94 0%,#ff99b6 100%);
}

/*       tickets       */
.tickets {
	position: relative;
	margin-top: 360px;
}
.tickets .contentsBox {
	background: #e8f7ff;
}
.tickets .linkBox .linkTxt a {
	background: linear-gradient( 90deg,#0088ff 0%,#73d3ff 100%);
}

/*       goods       */
.goods {
	position: relative;
	margin-top: 360px;
}
.goods .contentsBox {
	background: #ffefed;
}
.goods .linkBox .linkTxt a {
	background: linear-gradient(90deg,#ff4026 0%,#ff8873 100%);
}



/*       movie       */
.movie {
	
}
.movie .contentsBox {
	width: 1100px;
	background: #f9edff;
	text-align: center;
	position: relative
}
.movie .contentsBox .movieBox {
	padding: 140px 0 150px;
	position: relative;
	z-index: 2;
}
.movie .contentsBg {
	background: repeat-x;
	width: 1000%;
	padding-top: unset;
	height: 100%;
	margin-left: 715px;
	position: absolute;
	z-index: 1;
	top: 0;
}
.movie .contentsBox .dot {
	position: absolute;
	z-index: -1;
	top: -90px;
	left: -90px;
}


/*       news       */
.news .titleBox {
	text-align: center;
}
.news .newsList {
	height: 305px;
	margin: 45px auto;
	overflow-y: auto;
	width: 1000px;
}
.news .newsList li {
	display: -webkit-flex; display: flex;
	flex-wrap: wrap; -webkit-flex-wrap: wrap;
	-webkit-align-items: center; align-items: center;
	border-bottom: 2px solid #bfbfbf;
	padding: 30px 0;
	margin-right: 30px;
}
.news .newsList li:first-child {
	border-top: 2px solid #bfbfbf;
}
.news .newsList li p {
	margin-left: 40px;
}
.news .newsList li .category {
	color: #FFF;
	width: 90px;
	text-align: center;
	font-size: 1.2rem;
	padding: 2px 0;
}
.news .newsList li a {
	text-decoration: none;
}
.news .newsList li a:hover {
	text-decoration: underline;
}
.news .newsList::-webkit-scrollbar {
	width: 10px;
}
.news .newsList::-webkit-scrollbar-track {
	background: #bfbfbf;
}
.news .newsList::-webkit-scrollbar-thumb {
	background:#262626;
}
/*       twitter       */
.twitter {
	
}
.twitter .contentsBox {
	width: 1100px;
	background: #f3ffd9;
	text-align: center;
	position: relative;
	padding: 145px 0 80px;
}
.twitter .contentsBox .twitterBox {
	position: relative;
	z-index: 2;
	background: #ffffff;
	width: 520px;
	height: 520px;
	margin: 40px auto 0;
}
.twitter .contentsBg {
	background: repeat-x right;
	width: 1000%;
	padding-top: unset;
	height: 100%;
	margin-right: 715px;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
}
.twitter .contentsBox .dot {
	position: absolute;
	z-index: -1;
	top: -90px;
	right: -90px;
}
.twitterBox > iframe {
	width: 100% !important;
	min-width: 100% !important;
	max-width: 100% !important;
	height: 250px !important;
	min-height: 100% !important;
	max-height: 100% !important;
}


/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Footer Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/




/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Media Screen     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/
/*          SP          */
@media screen and (max-width:768px) {
/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Site Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/
/* -----     イベント共通     ----- */
/*--  横幅サイズ  --*/
	
/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Header Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/
/*Navigation Button*/
	
	.sp_logo {
		display: none;
	}
	
	

	/*       top       */
	#top {
		width: 100%;
		margin: 40px auto 0;
	}
	.top {
		padding: 30px 0 0;
		background: url(/img/top/topBg_sp.png) no-repeat;
		background-position: 50% 0%;
		background-size: contain;
	}
	.top .topBgImg {
		display: none;
	}
	.top .logoBox {
		padding: 0 10px;
		width: 90%;
		margin: auto;
	}
	.top .logoBox img {
		width: 90%;
	}
	.topCtt {
		top: -10px;
		padding: 0;
		-webkit-flex-direction: column-reverse;
		flex-direction: column-reverse;
		display: -webkit-flex;
		display: flex;
		width: 90%;
		margin: auto;
	}
	.topCtt .info {
		position: relative;
		padding-top: 30%;
		width: 100%;
		
		margin: auto;
	}
	.topicsBox {
		padding-top: 0px;
		width: 100%;
		max-width: 500px;
		margin: auto;
	}
	.topicsBox a img {
		width: 100%;
	}
	.topicsBox .topicsList {
		display: -webkit-flex; display: flex;
		flex-wrap: wrap; -webkit-flex-wrap: wrap;
		-webkit-justify-content: space-between; justify-content: space-between;
	}
	.topicsBox .topicsList a {
		width: 48%;
	}

	
	.topCtt .kvBox {
		width: 100%;
	}
	.topCtt .kvBox .catchphraseBox {
		position: absolute;
		bottom: -20%;
		right: 0;
		width: 100%;
		text-align: center;
	}
	.catchphraseBox .days {
		width: 60%;
	}
	.catchphraseBox .catchphrase {
		padding: 0 10px;
	}
	
	
	
	
	
	
	.contentsBox {
		width: 95%;
		margin: 0 0 0 auto;
	}
	.contentsBox .elementBox {
		width: 95%;
		margin: 0 auto 0 0;
		display: block;
	}
	.elementBox .titleBox {
		width: 100%;
		margin: auto;
		max-width: 500px;
		-webkit-transform: translateY(-45%);
		transform: translateY(-45%);
		padding: 0 10px;
		display: flex;
		align-items: center;
	}
	.elementBox .linkBox {
		width: 100%;
		margin: auto;
		max-width: 500px;
		height: auto;
		padding: 0 0 8%;
	}
	.mainTitle {
		font-size: 6.0rem;
		line-height: normal;
	}
	.mainTitle {
		font-size: 6.0rem;
	}
	.subTitle {
		margin-top: 0px;
	}
	.subTitle span {
		padding: 2px 8px 2px 8px;
		font-size: .8em;
}
	.contentsImg {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		padding: 0 60px;
		width: 100%;
		max-width: 450px;
	}
	.contentsImg .dot {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		padding: 0 60px;
	}
	.contentsImg .dot img {
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		width: 40%;
	}
	.contentsBg {
		padding-top: 66.6%;
	}
	.linkBox .linkTitle {
		font-size: 1.5rem;
		padding-top: 5%;
	}
	.linkBox .linkTxt {
		font-size: 1.4rem;
		padding-top: 15px;
	}
	.linkBox .linkTxt a {
		width: 45%;
		padding: 10px 15px;
	}

	
	.eventReportLink {
		width: 90%;
		margin: auto;
		padding: 30px 0;
	}

	
	/*       blu-ray       */
	.blu-ray {
		margin-top: min(50%, 300px);
	}
	.blu-ray .contentsBox .elementBox {
		-webkit-flex-direction: column-reverse; flex-direction: column-reverse;
		display: -webkit-flex; display: flex;
		margin: 0 0 0 auto;
	}
	.blu-ray .contentsImg .dot img {
		transform: translate(200%, -50%);
		-webkit-transform: translate(200%, -50%);
		-ms-transform: translate(200%, -50%);
	}
	.blu-ray .contentsBox {
		margin: 0 auto 0 0;
	}


	/*       about       */
	.about {
		margin-top: min(50%, 300px);
	}
	/*       artists       */
	.artists {
		margin-top: min(50%, 300px);
	}
	.artists .contentsBox .elementBox {
		-webkit-flex-direction: column-reverse; flex-direction: column-reverse;
		display: -webkit-flex; display: flex;
		margin: 0 0 0 auto;
	}
	.artists .contentsImg .dot img {
		transform: translate(200%, -50%);
		-webkit-transform: translate(200%, -50%);
		-ms-transform: translate(200%, -50%);
	}
	.artists .contentsBox {
		margin: 0 auto 0 0;
	}
	/*       goods       */
	.goods {
		margin-top: min(50%, 300px);
	}
	.goods .contentsBox .elementBox {
		-webkit-flex-direction: column-reverse; flex-direction: column-reverse;
		display: -webkit-flex; display: flex;
		margin: 0 0 0 auto;
	}
	.goods .contentsImg .dot img {
		transform: translate(200%, -50%);
		-webkit-transform: translate(200%, -50%);
		-ms-transform: translate(200%, -50%);
	}
	.goods .contentsBox {
		margin: 0 auto 0 0;
	}
	
	
	/*       tickets       */
	.tickets {
		margin-top: min(50%, 300px);
	}
	/*       movie       */
	.movie {
		padding-top: 30%;
	}
	.movie .contentsBox {
		width: 100%;
	}
	.movie .contentsBox .titleBox {
		position: absolute;
		z-index: 2;
		width: 100%;
		-webkit-transform: translateY(-40%);
		transform: translateY(-40%);
	}
	.movie .contentsBox .movieBox {
		padding: 65px 0 60px;
		width: 85%;
		max-width: 500px;
		margin: auto;
	}
	.movie .contentsBg {
		margin-left: 72%;
		background-size: contain;
		width: 100%;
	}
	.movie .contentsBox .dot {
		top: 0;
		left: 0;
		width: 100%;
		max-width: 500px;
	}
	.movie .contentsBox .dot img {
		position: absolute;
		transform: translate(-185%, -70%);
		-webkit-transform: translate(-185%, -70%);
		-ms-transform: translate(-185%, -70%);
		width: 23%;
	}
	.movie .mainTitle {
		font-size: 5.0rem;
	}
	.mainTitle.min {
		font-size: 4.6rem;
	}
	/*       news      */
	.news {
		padding-top: 80px;
	}
	.news .newsList {
		height: 200px;
		margin: 25px auto;
		width: 90%;
		max-width: 500px;
	}
	.news .newsList li {
		padding: 15px 0;
		margin-right: 15px;
		font-size: 1.0rem;
		flex-wrap: nowrap;
		-webkit-flex-wrap: nowrap;
	}
	.news .newsList li .spBox {
		padding: 0 10px;
	}
	.news .newsList li .category {
		font-size: 0.8rem;
		width: 100%;
	}
	.news .newsList li p {
		margin-left: 0;
		padding: 0 5px;
	}
	.news .newsList::-webkit-scrollbar {
		width: 8px;
	}
	/*       twitter       */
	.twitter {
		padding-top: 130px;
	}
	.twitter .contentsBox {
		width: 100%;
		padding: 0 0 60px;
	}
	.twitter .contentsBox .titleBox {
		position: absolute;
		z-index: 2;
		width: 100%;
		-webkit-transform: translateY(-40%);
		transform: translateY(-40%);
	}
	.twitter .contentsBox .twitterTxtImg {
		padding: 80px 0 0;
		position: relative;
		z-index: 2;
		width: 55%;
		max-width: 150px;
		margin: auto;
	}
	.twitter .contentsBg {
		margin-right: 72%;
		background-size: contain;
		width: 100%;
	}
	.twitter .contentsBox .dot {
		top: 0;
		right: 0;
		width: 100%;
		max-width: 500px;
	}
	.twitter .contentsBox .dot img {
		position: absolute;
		transform: translate(80%, -70%);
		-webkit-transform: translate(80%, -70%);
		-ms-transform: translate(80%, -70%);
		width: 23%;
	}
	.twitter .contentsBox .twitterBox {
		width: 80%;
		max-width: 400px;
		height: 260px;
		margin: 20px auto 0;
	}
	
	

/*       blu-ray       */
.blu-ray .contentsBg {
	background-image: url(/img/top/blu-ray_bg_sp.jpg);
}



	
/*       about       */
	.about .contentsBg {
		background-image: url(/img/top/about_bg_sp.jpg);
	}
	
/*       artists       */
	.artists .contentsBg {
		background-image: url(/img/top/artists_bg_sp.jpg);
	}
	
/*       tickets       */
	.tickets .contentsBg {
		background-image: url(/img/top/tickets_bg_sp.jpg);
	}
	
/*       goods       */
	.goods .contentsBg {
		background-image: url(/img/top/goods_bg_sp.jpg);
	}
	
/*       movie       */
	.movie .contentsBg {
		background-image: url(/img/top/movie_bg_sp.jpg);
	}
/*       movie       */
	.twitter .contentsBg {
		background-image: url(/img/top/twitter_bg_sp.jpg);
	}
	
	
	
}
/*          SP          */
@media screen and (max-width:768px) {
	.langLink a {
		font-size: 1.0rem;
		padding: 0 2px;
		margin: 0 3px;
	}
	.elementBox .intoTxtBox p {
		font-size: 1.2rem;
		line-height: 7.8vw;
	}
	.section_into .elementBox .noteBox p {
		font-size: 1.1rem;
		line-height: 6.5vw;
	}

	


}
@media screen and (width:768px) {
	
	
	.contentsBg {
		padding-top: 33.6%;
	}
	.movie .contentsBg {
		margin-left: 60%;
	}
	.movie .contentsBox .dot {
		left: 10%;
	}
	.movie {
		padding-top: 150px;
	}
	.twitter {
		padding-top: 150px;
	}
	.twitter .contentsBg {
		margin-right: 60%;
	}
	.twitter .contentsBox .dot {
		right: 10%;
		left: unset;
	}
	
	.topCtt .info {
		padding-top: 35%;
	}
	.topCtt .kvBox .catchphraseBox {
		bottom: -19%;
	}
	.catchphraseBox .days {
		width: 50%;
	}
	

	
}
/*          PC          */
@media screen and (min-width:769px) {
/*          Site Contents          */
	
/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Header Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/

	/*       top       */
	.topCtt .kvBox .kv {
		padding-right: 20px;
	}

/*       blu-ray       */
.blu-ray .contentsBg {
	background-image: url(/img/top/blu-ray_bg.jpg);
}
.blu-ray .titleBox p {
	position: relative;
	left: 70px;
}
.blu-ray .contentsImg {
	position: absolute;
	z-index: -1;
	top: -160px;
	left: 0px;
}
.blu-ray .contentsImg .dot {
	position: absolute;
	z-index: -1;
	top: -90px;
	right: -90px;
	left: unset;
}




/*       about       */
	.about .contentsBg {
		background-image: url(/img/top/about_bg.jpg);
	}
	
/*       artists       */
	.artists .contentsBg {
		background-image: url(/img/top/artists_bg.jpg);
	}
	.artists .titleBox p {
		position: relative;
		left: 70px;
	}
	.artists .contentsImg {
		position: absolute;
		z-index: -1;
		top: -160px;
		left: 0px;
	}
	.artists .contentsImg .dot {
		position: absolute;
		z-index: -1;
		top: -90px;
		right: -90px;
		left: unset;
	}

	
/*       tickets       */
	.tickets .contentsBg {
		background-image: url(/img/top/tickets_bg.jpg);
	}
	/*.tickets .elementBox .linkBox {
		padding: 50px 0 0;
	}*/

/*       goods       */
	.goods .contentsBg {
		background-image: url(/img/top/goods_bg.jpg);
	}
	.goods .titleBox p {
		position: relative;
		left: 70px;
	}
	.goods .contentsImg {
		position: absolute;
		z-index: -1;
		top: -160px;
		left: 0px;
	}
	.goods .contentsImg .dot {
		position: absolute;
		z-index: -1;
		top: -90px;
		right: -90px;
		left: unset;
	}

/*       movie       */
	.movie .contentsBg {
		background-image: url(/img/top/movie_bg.jpg);
	}
	.movie .contentsBox .titleBox {
		position: absolute;
		z-index: 2;
		top: -55px;
		width: 100%;
	}

/*       movie       */
	.twitter .contentsBg {
		background-image: url(/img/top/twitter_bg.jpg);
	}
	.twitter .contentsBox .titleBox {
		position: absolute;
		z-index: 2;
		top: -55px;
		width: 100%;
	}

	.spBox {
		display: -webkit-flex;
		display: flex;
		flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
	}
	
/*       news       */
	.news .newsList li a {
		width: 640px;
		display: block;
	}
	
}