/* home */
#top .pc-none {
	display: none;
  }
#top {
	background: url(../../img/home/bg_body002.jpg) left bottom fixed no-repeat #f1e1ca;
}
#top .wrapper {
	padding: 30px;
	display: grid;
	display: grid;
grid-template-columns: repeat(3, 1fr);
	padding-bottom: 20px;
  }
  #top .box.main{
	display: grid;
	position: relative;
	grid-column: 1/2;
	grid-row: 1/2;
  }
  #top #panking_tai{
	display: grid;
	position: relative;
	grid-column: 2/3;
	grid-row: 1/2;
	
  }
  #top #album{
	display: grid;
	position: relative;
	grid-column: 3/4;
	grid-row: 1/2;
	text-align: center;
  }

  #top #goods {
	position: relative;
	grid-column: 2/4;
	grid-row: 2/3;
	overflow: hidden;
}
#top #events {
	display: grid;
	position: relative;
	grid-column: 1/2;
	grid-row: 2/3;
	text-align: center;
}
#top #history {
	position: relative;
	grid-column: 1/3;
	grid-row: 3/4;
}
#top #movie {
position: relative;
grid-column: 1/3;
grid-row: 4/5;
}
#top #bnr {
	display: grid;
position: relative;
grid-column: 1/2;
grid-row: 5/6;
}
#top #twitter {
position: relative;
grid-column: 3/4;
grid-row: 3/6;
}
#top #container .main img{
	width: 337px; 
	height: 330px;
}
#top {
	/*height: 100%;*/
}
#top .box {
	/*height:330px;*/
}
#top #panking_tai img{
	height: 350px;
}

#top #events img{
	padding-top: 50px;
	border: 2px #291D1D;
	width: 340px;
}

#top #history .history_inner {
	position: absolute;
	top: 100px;
	left: 20px;
	overflow-x: hidden;
	overflow-y: scroll;
	height: 200px;
}
#top #history .history_inner span.date {
	color: #F4090D;
}
#top #history .history_inner ul li {
	background: url(../../img/home/arrow_red.png) no-repeat 0px 5px;
	padding: 5px 5px 5px 25px;
	width: 437px;
	font-family: 'Lucida Grande',  'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',  Meiryo, メイリオ, sans-serif;
}
#top #history .history_inner ul li a {
	font-size: small;
	color: #0000ff;
}
#top #history .history_inner ul li p span.more {
	padding: 10px 0px 5px 10px;
}
#top #history .history_bg img{
	width: 695px; 
	height: 330px;
}
#top #container #album img{
	width: 350px; 
	height: 330px;
}
#top #whats {
	position: relative;
}
#top #whats .whats_inner {
	position: absolute;
	top: 190px;
	left: 100px;
}
#top #whats .whats_inner .whats_bg img{
	width: 339px; 
	height: 330px;
}
#top #whats .whats_inner ul li {
	margin-bottom: 10px;
}
#top #container #goods .goods_inners .bxslider img{
	width: 152px; 
	height: 158px;
}
#top #container #goods .goods_bg img{
	width: 695px; 
	height: 330px;
}
#top #app {
	position: relative;
}
#top #app .ballon {
	position: absolute;
	top: 80px;
	right: 0;
}
#top #app .ballon img{
	width: 83px; 
	height: 78px;
}
#top #app .app_inner {
	position: absolute;
	top: 140px;
	left: 10px;
	text-align: center;
}
#top #app .app_inner .app_btn img{
	width: 97px; 
	height: 97px;
}
#top #app .app_inner .btn_app_iphone img{
	width: 219px; 
	height: 27px;
}
#top #app .app_inner .app_bg img{
	width: 320px; 
	height: 330px;
}
#top #app .app_inner .img_ico {
	margin-left: 60px;
	margin-bottom: 10px;
}
#top #app .app_btn li {
	float: left;
	margin-right: 5px;
}
#top #app .app_btn {
	overflow: hidden;
	margin: 10px 0;
}

#top #goods .goods_inners {
	position: absolute;
	top: 120px;
	left: 25px;
	width:680px;
}
#top #goods .goods_inners .bx-wrapper {
	margin: 0;
	max-width:680px!important;
}
#top #goods .goods_inners ul li p {
	text-align: center;
}
#top #fb {
	position: relative;
	background: #FFFFFF;
	margin-top: 55px;
}
#top #fb iframe {
	background: #FFFFFF;
}
#top #fb .fb_inner {
	position: absolute;
	top: 140px;
	left: 12px;
}
#top #twitter {
	margin-top: 55px;
	width:310px;
	height:460px;
}
#top #movie {
	position: relative;
}
#top #movie .movie_inner {
	position: absolute;
	top: 100px;
	left: 20px;
	overflow-x: hidden;
	overflow-y: scroll;
	height: 200px;
}
#top #movie .movie_inner span.date {
	color: #F4090D;
	}
#top #movie .movie_inner ul li {
	background: url(../../img/home/arrow_red.png) no-repeat 0px 5px;
	padding: 5px 5px 5px 25px;
	width: 437px;
	font-family: 'Lucida Grande',  'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',  Meiryo, メイリオ, sans-serif;
}
#top #movie .movie_inner ul li p {
	font-size: 16px;
}
#top #movie .movie_inner ul li p span.more {
	padding: 10px 0px 5px 10px;
}
#top #movie .movie_bg img{
	width:695px;
	height:330px;
}
#top #bnr{
	margin-top:55px;
}
#top #bnr img{
	width:337px;
	height:337px;
}

#top #goods .bx-wrapper{
	max-width: 638px;
	background-color: transparent;
	box-shadow: none;
	border: none;
}

#top #goods .bx-viewport{
	width: 100%; 
	overflow: hidden; 
	position: relative; 
	height: 194px;
	background-color: transparent;
	box-shadow: none;
	border: none;
}

#top #goods .bxslider{
	width: 1215%; 
	position: relative; 
	transition-duration: 15s; 
	transform: translate3d(-500px, 0px, 0px); 
	transition-timing-function: linear;
}

#top #goods .bxslider li{
	float: left; 
	list-style: none; 
	position: relative; 
	width: 152px; 
	margin-right: 10px;
}
#top .pc-none {
	display: none;
  }

/* =========================================================================

　sp

===========================================================================*/
@media screen and (min-width: 1440px){
#top .wrapper {
	display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(4, 1fr);
grid-column-gap: 10px;
grid-row-gap: 10px;
  }
  #top .box.main{
	grid-area: 1 / 1 / 2 / 2;
  }
  #top #panking_tai{
	grid-area: 1 / 2 / 2 / 3;
  }
  #top #album{
	grid-area: 1 / 3 / 2 / 4;
  }
  #top #events {
	grid-area: 1 / 4 / 2 / 5;
}
  #top #goods {
	grid-area: 2 / 1 / 3 / 3;
}

#top #history {
	grid-area: 2 / 3 / 3 / 5;
}
#top #movie {
	grid-area: 3 / 1 / 4 / 3;
}
#top #bnr {
	grid-area: 4 / 1 / 5 / 2;
}
#top #twitter {
	grid-area: 3 / 3 / 6 / 4;
}
#top #history .history_bg img {
    width: auto;
    height: 330px;

}
#top #movie .movie_bg img {
    width: auto;
    height: 330px;
}
}
	

@media screen and (max-width:1060px){
	#top {
		width: 100%;
	}
	#top #container{
		width: 100%;
	}
	#top img {
		width: 100%;
		height: auto;
	}
	#top .wrapper {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(7, 1fr);
		grid-column-gap: 10px;
		grid-row-gap: 10px;
	}
	#top .box.main{
		grid-area: 1 / 1 / 2 / 2;
	  }
	  #top #panking_tai{
		grid-area: 1 / 2 / 2 / 3;
	  }
	  #top #album{
		grid-area: 2 / 1 / 3 / 2;
	  }
	  #top #events {
		grid-area: 2 / 2 / 3 / 3;
	}
	  #top #goods {
		grid-area: 3 / 1 / 4 / 4;
	}
	
	#top #history {
		grid-area: 4 / 1 / 5 / 4;
	}
	#top #movie {
		grid-area: 5 / 1 / 6 / 3;
	}
	#top #bnr {
		grid-area: 6 / 2 / 7 / 3;;
	}
	#top #twitter {
		grid-area: 6 / 1 / 9 / 2;;
	}

}

@media screen and (max-width:768px){
	#top .sp-none {
		display: none;
	  }
	  #top .pc-none {
		display: block;
	  }
	#top .wrapper {
		display: block;
		padding: 0;
		padding-bottom: 150px;
	  }
	
	#top::before {
		content: "";
		display: block;
		position: fixed;
		top: 0px;
		left: 0px;
		z-index: -1;
		width: 100%;
		height: 100vh;
		background-image: url(../../img/home/bg_body002.jpg);
		background-size: cover;
		background-repeat: no-repeat;
	  }
	  #top #panking_tai img {
		height: auto;
	}
	#top #container #goods .goods_bg img {
		max-width:100%;
		height:auto;
	}
	#container .goods_bg {
	padding: 0;
	}
	#top #goods .goods_inners {
		position: absolute;
		top: 23%;
		width: 88%;
		left: 30px;
	}
	#top #goods .bx-wrapper{
		max-width: 100%;
	}
	
	#top #goods .bx-viewport{
		width: 100%; 
		overflow: hidden; 
		position: relative; 
		height: 133px;
	}
	
	#top #goods .bxslider{
		width: 1215%; 
		position: relative; 
		transition-duration: 10s; 
		transform: translate3d(-500px, 0px, 0px); 
		transition-timing-function: linear;
	}
	
	#top #goods .bxslider li{
		float: left; 
		list-style: none; 
		position: relative; 
		width: 118.333px; 
		margin-right: 10px;
		font-size: 12px;
	}
	#top #goods .bxslider li img{ 
		width: 152px; 
		height: auto;
	}
	#top #history .history_bg img {
		max-width:100%;
		height:auto;
	}
	#top #history .history_inner {
		position: absolute;
		top: 20%;
		left: 5%;
		overflow-x: hidden;
		overflow-y: scroll;
		height: 300px;
	}
	#top #history .history_inner ul li {
		width: 80%;
	}
	#top #history .history_inner ul li {
		background: url(../../img/home/arrow_red.png) no-repeat 0px 5px;
		padding: 0px 5px 5px 25px;
		font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	}
	#top #history .history_inner ul li p {
		font-size: 16px;
	}
	#top #history .history_inner span.date {
		color: #F4090D;
		font-size: 12px;
	}
	#top #movie .movie_bg img{
		max-width:100%;
		height:auto;
	}
	#top #movie .movie_inner {
		position: absolute;
		top: 20%;
		left: 5%;
		overflow-x: hidden;
		overflow-y: scroll;
		height: 300px;
	}
	#top #movie .movie_inner ul li {
		width: 80%;
	}
	#top #movie .movie_inner ul li {
		background: url(../../img/home/arrow_red.png) no-repeat 0px 5px;
		padding: 0px 5px 5px 25px;
		font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;

	}
	#top #movie .movie_inner span.date {
		color: #F4090D;
		font-size: 12px;
	}
	#top #movie .movie_inner ul li p {
		font-size: 16px;
	}
	#top #bnr img{
		width:100%;
		height:auto;
	}
	#top #twitter {
		margin-bottom: 180px;
	}

}