@charset "utf-8";

/*stage下層ページcss*/



/* -------------------------------------
    common
---------------------------------------*/

#main {
	background:#000;
	width:100%;
}

.container {
	padding-top:10px;
}

.container .ondemand img,
.container .skystage img {
	max-width:100%;
	height:auto;
}

@media screen and (max-width: 640px) {
	.container img {
		max-width:100%;
		height:auto;
	}
}

.container .section {
	border-bottom:1px solid #808080;
	padding:0 10px 50px 10px;
	overflow:hidden;
	text-align:center;
	font-size:12px;
}
.container .section.books,
	.container .section.music{
		padding-bottom:30px;
	}
@media screen and (max-width: 640px) {
	.container .section {
		padding-bottom:30px;
	}
	.container .section.books{
		padding-bottom:10px;
	}
}
.container .mt-0 {
	margin-top:0 !important;
}
.container .inner {
    display: block;
    width: 960px;
    margin:50px auto 0 auto;
}

@media screen and (max-width: 640px) {
	.container .inner {
		width:100%;
		padding:0 10px;
		margin:30px auto 0 auto;
	}
}
@media screen and (min-width: 641px) and (max-width: 812px){
	.container .inner {
		width:100%;
	}
}


.container ul {
	list-style-type:none;
	padding-left:0;
}
.container ul img{
	margin-bottom:5px;
}
.container .text-link {
	text-decoration:underline;
}
.container .text-link:hover {
	text-decoration:none;
}
.container .title {
	text-align:center;
	font-size:22px;
	margin-bottom:30px;
}

.container .subtitle {
	font-size:14px;
	padding-bottom:20px;
}
.container .goods_text .subtitle {
	font-size:14px;
	margin-bottom:5px;
}
.goods_list{
	margin-bottom: 20px;
}

.container .subtitle span{
	font-size:12px;
}

.container .text_link {
	display:inline-block;
}
.container .goods_text .text_link {
	margin-top:0px;
	margin-bottom:20px;
}

.container a:hover {
	text-decoration:none !important;
}
.container a:hover *:not(img){
	text-decoration:underline;
}
.container a:hover img{
	opacity:0.8;
}

.container .onsale {
	border:1px solid #fff;
	padding:2px 5px;
	display:inline-block;
	margin:5px 0;
	line-height:1.4em;
}

.container .goods .fin {
	display: inline-block;
    padding: 0 5px;
    background: #404040;
    color: #B5B5B5;
    margin: 4px 3px 0 0;
}

.container .font-middle {
	font-size:16px;
	line-height:1.6em;
}
.container .font-middle-border {
	padding:2px 20px;
	border:1px solid #fff;
	display:inline-block;
}

.ico_status {
    display: inline-block;
    padding: 3px 10px;
    background: #404040;
    color: #B5B5B5;
    margin: 0 0 0 0;
    font-size: 12px;
    line-height: 1em;
}
@media screen and (max-width: 640px) {
    .container .ico_status {
         margin: 0;
    }
}
.container .btn {
    display: inline-block;
    color: #fff;
    background: #333333;
    border: 2px solid #666666;
    border-radius: 100px;
    padding: 6px 5px;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    min-width: 310px;
    box-sizing: border-box;
    margin: 20px auto 0;
}
@media screen and (max-width: 640px){
	.container .btn {
        margin:20px 0 0;
		width:100%;
		min-width:0;
	}
}
.container .btn:hover {
    text-decoration:none;
    opacity:0.8;
    transition:0.1s;
}
.container .mb-20 {
	margin-bottom:20px !important;
}
@media screen and (max-width: 640px){
	.container .mb-20 {
		margin-bottom:10px !important;
	}
}
/*--------------------------------------
   introduction
--------------------------------------*/
.container .intro {
	font-size:14px;
}

/*--------------------------------------
   What's new
--------------------------------------*/
.container .news dl{
	overflow:hidden;
	font-size:14px;
	text-align:left;
}

.container .news dt{
	float:left;
	width:10%;
	clear : both;
}

.container .news dd{
	float:left;
	width:80%;
}

@media screen and (max-width: 640px) {
	.container .news dd{
		width:100%;
	}
}

/*--------------------------------------
  movie
--------------------------------------*/
.container .movie{
	overflow:hidden;
	text-align:right;
	min-height:300px;
}

@media screen and (max-width: 640px) {
	.container .movie{
		background:none;
		text-align:center;
	}
}

@media screen and (max-width: 640px) {
	.container .movie{
		background-size:130%;
		min-height:200px;
	}
}

.container .movie-area {
	display:block;
	float:none;
	margin:0 auto;
	max-width:320px;
}

@media screen and (max-width: 640px) {
	.container .movie-area {
		margin-top:40px;
		width:100%;
		float:none;
	}
}

.container .movie-area p{
	display:inline-block;
	vertical-align:middle;
}

/*--------------------------------------
    Bru-ray dvd cd
-------------------------------------*/

.container .product {
	display:inline-block;
	width:24%;
	font-size:14px;
	vertical-align:top;
}
.container .product:not(:last-child) {
	margin-right:2%;
}
@media screen and (max-width: 640px) {
	.container .product {
		width:48%;
		margin:auto;
	}
	.container .product:not(:last-child) {
		margin-right:2%;
	}
	.container .product:nth-child(2n) {
		margin-right:0;
	}
}

@media screen and (min-width: 641px) and (max-width: 812px){
	.container .product {
		width:45%;
		float:none;
		display:inline-block;
		vertical-align:top;
	}
}

.container .jacket {
	display:block;
	margin: 18px auto 42px auto;
	height:224px;
}

@media screen and (max-width: 640px) {
	.container .jacket {
		margin: 18px 0 20px 0;
		max-width:76%;
		height:auto;
	}
	.container .cd .jacket {
	margin: 0px auto 42px auto;
	}
	.container .jacket.label {
		max-width:100%;
	}
}
@media screen and (min-width: 641px) and (max-width: 812px){
	.container .jacket {
		margin-bottom:20px;
	}
}

.container .product.cd .jacket {
    max-width: 167px;
    height: auto;
    margin: 18px auto 42px auto;
    /*padding: 43px 0 0 0;*/
	padding: 43px 0 35px 0;
}

@media screen and (max-width: 640px) {
	.container .product.cd .jacket {
		height:auto;
		max-width:76%;
		padding: 30% 0 0;
		/*padding: 0;*/
	}
}

.container .product_ttl {
	font-family:"ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-size:24px;
}

@media screen and (max-width: 640px) {
	.container .info {
		width:auto;
		margin:0;
	}
}

.container .bluray p.atten{
	margin-top:20px;
}
.container .info ul {
	list-style-type:none;
	padding-left:0;
}

.container .info ul.detail {
	float:left;
}

@media screen and (max-width: 640px) {
	.container .info ul.detail {
		float:none;
		width:auto;
	}
}

.container .info ul.detail p {
	font-size: 16px;
    margin-bottom: 10px;
}

.container .info > ul.detail.nolink,
.container .info img:hover + ul.detail.nolink,
.container .info ul.detail.nolink:hover {
    text-decoration:none !important;
}
.container .info ul.disc_contents {
	clear:both;
	text-indent:-1em;
	padding-left:1em;
	padding-top:15px;
}

.container .info ul.disc_contents li.tag:before{
	content:"";
	display:inline-block;
	width:7px;
	height:10px;
	background: url(/stage/img/tag.png) no-repeat left top;
	padding-right:0.8em;
}

.container .info ul.disc_contents li.tag ul {
	margin-left:0.8em;
}
.container .disc .fin {
    display: inline-block;
    padding: 0 5px;
    background: #404040;
    color: #B5B5B5;
    margin: 0 0 10px 0;
    font-size:12px;
}
.container .attent {
	clear:both;
	padding-top:30px;
	margin-bottom:50px;
	font-size:12px;
	text-align:left;
}

@media screen and (max-width: 640px) {
	.container .attent {
		padding-top:15px;
		margin-bottom:25px;
	}
}

.container .image_area {
	overflow:hidden;
}

.container .image_area img{
	width:474px;
}

@media screen and (max-width: 640px) {
	.container .image_area img{
		width:auto;
	}
}
@media screen and (min-width: 641px) and (max-width: 812px){
	.container .image_area img{
		width:49%;
		margin-right: 5px;
	}
}
.container .image_area img:nth-of-type(odd){
	float:left;
}

.container .image_area img:nth-of-type(even){
	float:right;
}

@media screen and (max-width: 640px) {
	.container .image_area img:nth-of-type(odd),
	.container .image_area img:nth-of-type(even){
		float:none;
	}
}

.container .image_area img:nth-of-type(2),
.container .image_area img:first-of-type{
	margin-bottom:10px;
}

@media screen and (max-width: 640px) {
	.container .image_area img:nth-of-type(2),
	.container .image_area img:first-of-type{
	margin-bottom:0px;
	}
}

.clear {
	clear:both;
	padding:40px 0 0 0;
	text-align:center;
}

.container .left-area,
.container .right-area{
	width:49%;
	display:inline-block;
	vertical-align:middle;
	text-align:left;
}

@media screen and (max-width: 640px) {
	.container .left-area,
	.container .right-area{
		width:100%;
		display:block;
		text-align:center;
	}
	.container .right-area{
		width:100%;
		display:block;
		text-align:center;
	}
	
}

/*campaign bnr*/

.container .bnr_campaign {
	margin-bottom:40px;
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.container .bnr_campaign a{
	display:inline-block;
	margin-right:15px;
}

@media screen and (max-width: 640px) {
	.container .bnr_campaign a{
		width: calc((100% - 15px) / 2);
		max-width:180px;
	}
}

@media screen and (max-width: 640px) {
	.container .bnr_campaign a:first-child{
		margin-bottom:15px;
	}
.container .bnr_campaign a:nth-child(2){
		margin-right:0;
	}
}


.container .bnr_campaign a:last-child{
	margin-right:0;
}

@media screen and (max-width: 640px) {
	.container .bnr_campaign a:last-child{
		margin-bottom:0;
	}
}
.container .specials {
	display:flex;
	justify-content:center;
}
@media screen and (max-width: 640px) {
	.container .specials {
		display:block;
	}
}
@media screen and (max-width: 640px) {
	.container .specials .product:nth-of-type(odd) {
		margin: 0 2% 0 0;
	}
	.container .specials .product:last-child {
		margin: 0;
	}
}

/*--------------------------------------
   special box
-------------------------------------*/

.container .special .lead {
	margin-bottom:30px;
	font-size:14px;
}


.container .special.product {
	float:none;
	display:inline-block;
	vertical-align:top;
	overflow:hidden;
	width:100%;
	margin:0;
}

@media screen and (max-width: 640px) {
	.container .special.product {
		width:100%;
	}
}

.container .special.product .info{
	overflow:hidden;
	width:auto;
}

.container .special .info a{
	display:inline;
}

.container .special.product .detail{
	display:inline-block;
	float:none;
}

@media screen and (max-width: 640px) {
	.container .special.product .detail{
		width:58%;
	}
}

.container .special.product .jacket {
	display:inline-block;
	margin:0 15px 0 0;
	float:left;
	margin-bottom:20px;
}

@media screen and (max-width: 640px) {
	.container .special.product .jacket {
		vertical-align:top;
		float:none;
		width:36.5%;
	}
	.container .special.product .jacket:first-of-type {
		width:69.6%;
	}
}

.container .special.product .right-area {
	float:right;
	width:64%;
}

@media screen and (max-width: 640px) {
	.container .special.product .right-area {
		width:100%;
		text-align:left;
	}
}

.container .special.product .intro {
	margin-top:15px;
	line-height:1.5em;
}

@media screen and (max-width: 640px) {
	.container .special.product .intro {
		margin-top:10px;
		float:left;
	}
}



/*--------------------------------------
    GOODS
-------------------------------------*/
.container .goods ul{
	text-align:center;
	margin-bottom:0;
}
.container .goods ul li{
	display:inline-block;
	text-align:left;
	vertical-align:top;
	width:205px;
	margin-left:40px;
}

@media screen and (max-width: 640px) {
	.container .goods ul li{
		width:48%;
		margin-left:0;
	}
}

.container .goods ul li:first-child,
.container .goods ul li:nth-child(5),
.container .goods ul li:nth-child(9),
.container .goods ul li:nth-child(13){
	margin-left:0px;
}

@media screen and (max-width: 640px) {
	.container .goods ul li:nth-child(even){
		margin:0 4.6%;
		margin:0 0 0 2%;
	}
}


.container .goods_text .att {
	padding-top:5px;
    text-align:center;
}

@media screen and (max-width: 640px) {
	.container .goods_text .att {
		padding-top:10px;
	}
}

.container .bromide {
	clear:both;
	padding-top:40px;
}

.container ul.bromide_list{
	text-align:left;
}

.container .bromide_list li{
	display:inline-block;
	margin:0px 80px 20px 0px;
	width:260px;
}

@media screen and (max-width: 640px) {
	.container .bromide_list li{
		margin:0px 0px 10px 0px;
		width:auto;
	}
}

.container .bromide_list li img{
	margin-right:5px;
	border: 1px #fff solid;
}

.container .bromide_list li:nth-child(3),
.container .bromide_list li:last-child{
	margin:0px 0px 20px 0;
}

@media screen and (max-width: 640px) {
	.container .bromide_list li:nth-child(3),
	.container .bromide_list li:last-child{
		margin:0px 0px 5px 0px;
		width:auto;
	}
}

.container .bromide_list a:hover {
	text-decoration: none;
}

.container .bromide_list .subtitle {
	margin-bottom:10px;
	width: 280px;
}

@media screen and (max-width: 640px) {
	.container .bromide_list .subtitle {
		margin-bottom:5px;
		width: auto;
	}
}

.container .bromide_list .text_link {
	padding-left:15px;
}

.container .bromide_list .text_link:hover {
	text-decoration: underline;
}

.container .bromide .att {
	padding-top:20px;
}

@media screen and (max-width: 640px) {
	.container .bromide .att {
		padding-top:10px;
	}
}


/*-----------------------------------
  BOOKS
-----------------------------------*/

.container .books ul li{
	display:inline-block;
	text-align:left;
	vertical-align:top;
	margin-right:40px;
	min-width:245px;
}

@media screen and (max-width: 640px) {
	.container .books ul li{
		width:48%;
		margin-right:0;
		min-width:0;
	}
	.container .books ul li img{
		height: 50vw;
        width: 100%;
        object-fit: contain;
        object-position: left top;
		max-height: 196px;
        max-width: 160px;
	}
}

.container .books ul li:last-child{
	margin-right:0;
}
.container .books ul li:nth-child(3n){
	margin-right:0;
}

@media screen and (max-width: 640px) {
	.container .books ul li:nth-child(odd){
		margin:0 2% 0 0;
	}
}

/*-----------------------------------
  LIVE
-----------------------------------*/
.container .live ul{
	line-height:2em;
	display:flex;
	align-items:stretch;
	justify-content:center;
}
@media screen and (max-width: 640px) {
	.container .live ul{
		display:block;
	}
}
.container .live ul li {
    display:flex;
	flex-direction:column;
	text-align:left;
	vertical-align:top;
	font-size:16px;
	align-items:flex-start;
}
@media screen and (max-width: 640px) {
    .container .live ul li {
        width:100%;
    }
}

.container .live ul li:not(:last-of-type){
    margin-right:40px;
}
@media screen and (max-width: 640px) {
	.container .live ul li:not(:last-of-type){
        margin:0 0 30px 0;
	}
}
.container .live ul li p{
	margin-bottom:10px;
	min-width:264px;
}
@media screen and (max-width: 640px) {
	.container .live ul li p{
		min-width: 0;
	}
}
.container .live ul li.fin {
	color: #646464;
}
.container .live_head {
	font-size:28px;
	text-align:center;
	margin-bottom:40px;
}

@media screen and (max-width: 640px) {
	.container .live_head {
		font-size:24px;
	}
}

.container .live_head span{
	padding-left:140px;
	background:url(/stage/img/live_logo.png) no-repeat left;
	line-height:57px;
	display: inline-block;
}

@media screen and (max-width: 640px) {
	.container .live_head span{
		padding-left:22%;
		background-size:20%;
		line-height:1.4em;
		text-align: left;
		margin-bottom:0;
	}
}
.container .live .btn {
    width: 280px;
	margin-top:auto;
}
@media screen and (max-width: 640px){
	.container .live .btn {
		width:100%;
	}
}
/*-----------------------------------
  skystage
-----------------------------------*/

.container .skystage ul{
	text-align:center;
}

.container .skystage ul li{
	vertical-align:top;
	display:inline-block;
	width:385px;
	text-align:left;
}

@media screen and (max-width: 640px) {
	.container .skystage ul li{
		width:auto;
		float:none;
	}
}
@media screen and (min-width: 641px) and (max-width: 812px){
	.container .skystage ul li{
		width:45%;
	}
}

.container .skystage ul li:nth-child(even){
	margin-left:40px;
}

@media screen and (max-width: 640px) {
	.container .skystage ul li:nth-child(even){
		margin-left:0;
	}
}
/*-----------------------------------
  ondemand
-----------------------------------*/

.container .ondemand ul {
	margin-top:30px;
}
.container .ondemand ul li{
	display:inline-block;
	vertical-align:top;
	/*width:230px;*/
	width:385px;
	text-align:left;
	padding:0 5px;
}

@media screen and (max-width: 640px) {
	.container .ondemand ul li{
		/*width:48%;
		padding:0 1%;*/
		width:100%;
		padding:0;
	}
}

.container .ondemand ul li:nth-child(even){
}
@media screen and (max-width: 640px) {
	.container .ondemand ul.streaming{
		text-align:left;
	}
}
.container .ondemand ul.streaming li{
	width:auto;
	font-size: 16px;
}
@media screen and (max-width: 640px) {
	.container .ondemand ul.streaming li{
		width:100%;
	}
}
.container .ondemand ul.streaming li:nth-child(2) {
    margin-left: 95px;
}
@media screen and (max-width: 640px) {
	.container .ondemand ul.streaming li:nth-child(2) {
		margin-left:0;
		margin-top:35px;
	}
}
.container .ondemand .streaming_head {
	margin:50px auto 30px auto;
}
@media screen and (max-width: 640px) {
	.container .streaming .subtitle {
		padding-bottom:0;
	}
}

.container .tsukishiro-fes {
	margin-bottom:50px;
}
.container .tsukishiro-fes p{
	margin-top:10px;
}
/*-----------------------------------
  CUSTOMCD / MUSIC
-----------------------------------*/
.container .title + p {
	margin-bottom:30px;
}
.container .customcd,
.container .takarazukamusic{
	display:block;
	vertical-align:top;
}

@media screen and (max-width: 640px) {
	.container .customcd,
	.container .takarazukamusic{
		display:block;
		width:100%;
	}
}

.container .customcd ul li{
	display:inline-block;
	vertical-align:top;
	text-align:left;
}

@media screen and (max-width: 640px) {
	.container .customcd ul li{
		width:48%;
	}
}
.container .takarazukamusic ul{
	display:flex;
	justify-content:center;
	text-align:left;
}
@media screen and (max-width: 640px) {
	.container .takarazukamusic ul li{
		width:48%;
	}
	.container .takarazukamusic ul li:nth-child(even){
		margin-left:2%;
	}
}
.container .customcd ul li a,
.container .takarazukamusic ul li a{
	display:inline-block;
}
@media screen and (max-width: 640px) {
	.container .takarazukamusic ul li a{
		width:100%;
	}
}
.container .takarazukamusic ul li a > div{
	width:auto;
	display:flex;
}
.container .takarazukamusic ul li a > div img{
	min-width:0;
	max-width:none;
}
.container .takarazukamusic ul li a > div img:not(:last-child){
	margin-right:10px;
}
@media screen and (max-width: 640px) {
	.container .takarazukamusic ul li a > div img:not(:last-child){
		margin-right:5px;
	}
}
.container .takarazukamusic ul li img{
    border:1px solid darkgray;
    box-sizing:border-box;
}
.container .customcd ul li:nth-child(even),
.container .takarazukamusic ul li:nth-child(even) {
	margin-left:40px;
}

@media screen and (max-width: 640px) {
	.container .goods ul li{
		width:48%;
	}
}

.container .takarazukamusic ul li:nth-child(even){
	margin:0 4.6%;
}

@media screen and (max-width: 640px) {
	.container .takarazukamusic ul li:nth-child(even){
		margin:0 0 0 2%;
	}
}

.container .takarazukamusic ul li:last-child{
	margin-right:0;
}

/*-----------------------------------
  scheduler
-----------------------------------*/

.container .schedule ul li {
	width:auto;
	margin-bottom:20px;
}

.container .schedule small {
	display:block;
	margin:15px 0;
	font-size:11px;
	line-height:1.4em;
}
@media screen and (max-width: 640px) {
	.container .schedule small {
		text-align:left;
	}
}
.container .schedule small:first-of-type {
	margin:15px 0 0 0;
}
.container .schedule .fin {
	color: #646464;
}