@media screen and (max-width:782px) {
body{
	line-height: 1.6;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-o-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
body {
	width  : 100%;
	height : 100%;
}
#wrapper{
	width: 100%;
	min-width:100%;
}
.area{
	width:100%;
	
}
a img:hover {
	-moz-opacity:1;
	opacity:1;
	filter:alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}
.areaPC{
	display:none;
}
.areaSP{
	display:block;
}
#js-accordion{
	display:block;
}
#logoMain{
	display:none;
}

#top-title{
		padding:1em 0;
		background-color:#000;
}

#top-title h1{
	display:block;
	text-align:center;
}
#top-title h1 img{
	width:30%;
}
#top-title h2{
	position:static;
	top:inherit;
	right:inherit;
	font-family: 'Fjalla One', sans-serif;
	color:#fff;
	font-size:16px;
	text-align:center;
	letter-spacing:0;
}
p.more a:hover{
	border:2px solid #fff;
	color:#fff;
}
/*-----------------------------------------------
	MENU
-----------------------------------------------*/
.menu-button {
  right: 20px;
  top: 20px;
}
.nav-content {
	width: 100%;
	margin-left: 0px;
	left:0;
	top:40px;
	}
.nav-content ul{
	width:100%;
}
.nav-content ul li {
font-size:14px;
letter-spacing:0.1em;
padding: 5px 0px;}
.is-open .nav-content {
  top: 40px;
  }
.nav-content ul li a {
	width:100%;
	display:block;
}
/*-----------------------------------------------
	FOOTER
-----------------------------------------------*/
.footerArea{
	padding-top:20px;
}
.footerArea p.logo{
	margin-bottom:10px;
}
.footerArea p.title{
	margin-bottom: 20px;
	font-size: 18px;
}
.footerArea p.title span{
	padding-bottom:0.1em;
}
.footerArea .footMenu{
	display:none;
}


.footer{
	padding: 10px 0;
	font-size:10px;
}
.pagetop{
	text-align:center;
	margin-bottom:15px;
	padding-right:0px;
	padding-top:15px;
}

/*-----------------------------------------------
	TOP MAIN
-----------------------------------------------*/
.spMain{
	width:100%;
	position:relative;
	display:block;
}
.spMain img{
	width:100%;
	max-width:100%;
	height:auto;
}
.t1s{
	z-index:60;
	left:0;
	top:0;
	width:100%;
	position:absolute;
	
}
.t2s{
	z-index:60;
	left:0;
	top:0;
	width:100%;
	position:absolute;
}
.t3s{
	z-index:60;
	left:0;
	top:0;
	width:100%;
	position:absolute;
}


p.more{
	
	
}

/*-----------------------------------------------
	TOP WHAT
-----------------------------------------------*/
#what{
	background-size:cover;
	padding:60px 1em;
}
#what h3{
	font-family: 'Fjalla One', sans-serif;
	font-size:28px;
	letter-spacing:0.1em;
	margin-bottom:1.5em;

}
#what p.tx{
	font-size:13px;
	line-height:2.5em;
	letter-spacing:0.1em;
	margin-bottom:5em;
}
#what p.more a:link{
	
	width:50%;
	display:block;
	margin:0 auto;
	padding:7px 0px;
}
/*-----------------------------------------------
	TOP BALL
-----------------------------------------------*/
#ballbearing{
	background-image:url(../img/ball_bg.jpg);
	background-size:cover;
	height:auto;
	padding:8em 1em;
	
}

.ballRight{
	width:70%;
	float:right;
	text-align:center;
	padding-top:0px;
}
#ballbearing p.more a:link{
	
	width:60%;
	display:block;
	margin:0 auto;
	padding:7px 0px;
}
/*-----------------------------------------------
	TOP LINEUP
-----------------------------------------------*/
#lineup{
	padding:0 1em;
	
}

.lineupArea{
	
	padding-top: 60px;
	padding-bottom: 80px;
}
#lineup p.more a:link{
	
	width:50%;
	display:block;
	margin:0 auto;
	padding:7px 0px;
}

#lineup li{
	width:33%;
	margin-right:0.5%;
}

#lineup ul{
	margin-bottom:4em;
}
/*-----------------------------------------------
	TOP MOVIE
-----------------------------------------------*/


.mag_movie{
	height:auto;
	width: 100%;
	background-size:cover;
	
	
}
.mag_movie .movieTx{
	padding:40px 0;
	
}


#movie2{
	padding:20px 0 40px 0;

}
#movie2 p.more a:link{
	
	width:50%;
	display:block;
	margin:0 auto;
	padding:7px 0px;
	
}
/*-----------------------------------------------
	POP UP
-----------------------------------------------*/

.popup{
	
width:100%;
height:auto;

}
.popupArea{
	padding:3em;
}

/*-----------------------------------------------
	TOP 他（コラム、ユーザー）
-----------------------------------------------*/
#other li .txArea{

	top:8%;

}

/*-----------------------------------------------
	BALL PAGE
-----------------------------------------------*/

#ball{
	width:99%;
	margin:0 auto;
	
	padding-top: 50px;
	background-image:none;
	
}
#ball .ballArea{
	padding:0 0.5em;
}
#ball .txArea{
	padding-right:0px;
}
#ball p.max img{
	width:100%;
	max-width:100%;
	height:auto;
}


/*-----------------------------------------------
	MOVIE PAGE
-----------------------------------------------*/

#moviepage{
	width:99%;
	margin:0 auto;
	
}

#movieArea01 img,#movieArea02 img{
	width:100%;
	max-width:100%;
	height:auto;
}
#movieArea01 .movieBox{
	width: 49%;
	margin-right: 0px;
}
#movieArea01 .movieBox2{
	width: 49%;
	
}
#movieArea02 .movieBox{
	width: 24%;
	margin-right: 1%;
}
#movieArea02 .movieBox3{
	width: 24%;
	margin-right: 1%;
}
#movieArea02 .movieBox2{
	width:49%;
	float: right;	
}

}
@media screen and (max-width:600px) {
#top-title h1 img{
	width:35%;
}
#top-title h2{
		position:static;
		font-size:14px;
		text-align:center;
}

/*-----------------------------------------------
	MENU
-----------------------------------------------*/
.menu-button {
  right: 10px;
  top: 15px;
}
/*-----------------------------------------------
	FOOTER
-----------------------------------------------*/
.footerArea{
	padding-top: 20px;
}
.footerArea p.logo{
	margin-bottom:10px;
}
.footerArea p.logo img{
	width:30%;
	height:auto;
}
.footerArea p.title{
	margin-bottom: 15px;
	font-size: 14px;
}
.footerArea .sns{
	padding-left: 15px;
	margin: 0 auto;
	width: 100px;
}
.footerArea .sns li img{
	width:35px;
	height:auto;
}
.footer{
	padding: 5px 0;
}


/*-----------------------------------------------
	TOP WHAT
-----------------------------------------------*/
#what{
	padding:30px 1em;
	

}
#what h3{
	font-size:20px;
	margin-bottom:1em;

}
#what p.tx{
	font-size: 11px;
	line-height: 2em;
	margin-bottom: 3em;
}


/*-----------------------------------------------
	TOP BALL
-----------------------------------------------*/
#ballbearing{

	padding:5em 1em;
	
}
#ballbearing h3{
	font-size:20px;

}
#ballbearing p.tx{
	font-size:10px;
	margin-bottom:3em;
}
.ballRight{
	width:90%;
	float:none;
	margin:0 auto;
}

/*-----------------------------------------------
	TOP LINEUP
-----------------------------------------------*/


.lineupArea{
	
	padding-top: 30px;
	padding-bottom: 40px;
}
#lineup h3{

	font-size:20px;
	margin-bottom:1em;

}

#lineup li{
	width:80%;
	float:none;
	margin-right:0;
	margin:0 auto;
	margin-bottom:1em;
}
#lineup li:last-child{
	margin-bottom:0px;
	margin:0 auto;
	
}
#lineup li p.name{
	font-size:18px;
}
#lineup ul{
	margin-bottom:2em;
}
#lineup p.more a:link{
	font-size:11px;
	width:80%;

}
/*-----------------------------------------------
	TOP MOVIE
-----------------------------------------------*/


.mag_movie{
	
}
.mag_movie .movieTx{
	padding:20px 0;
	width: 90%;
	margin:0 auto;
}
#movie h3{

	font-size:20px;
	
}


#movie2 p.more a:link{
	
	width:80%;
	
}

/*-----------------------------------------------
	TOP 他（コラム、ユーザー）
-----------------------------------------------*/
.otherArea{
	padding:20px 0 40px 0;
}
#other li{
	width:100%;
	float:none;
	margin-right:0;
}
#other li:last-child{
	margin-right:0%;
}

#other li .txArea{
	position:absolute;
	top:20%;
	right:2em;
	text-align:right;
	width:100%;
}
#other li .txArea p.title{
	font-size:20px;
	
}
#other li .txArea p.title2{
	font-size:14px;
	
}
#other li .txArea p.tx{
	font-size:11px;
}



#other li .bttt p.more a:link{
	
	display:block;
	margin:0 auto;
	padding:7px 40px;
	
}
/*-----------------------------------------------
	BALL PAGE
-----------------------------------------------*/
.ballMain{
	
	background-size:cover;
	height:150px;
}
#ball{
	padding-top:20px;
	
}
#ball h3{

	font-size:24px;
}
#ball p.tx{
	margin-bottom:2em;
}
#ball p.title2{
	font-size:14px;
	margin-bottom:10px;
}
#ball p.ind{
	line-height:1.6;
	
}
#ball p.ph{
	padding-right:10px;
	padding-bottom:5px;
}
#ball p.ph2{
	padding-left:10px;
	padding-bottom:5px;
}
#ball p.ph{
	width:40%;
}
#ball p.ph2{
	width:50%;
}
#ball p.ph img,#ball p.ph2 img{
	width:100%;
	max-width:100%;
	height:auto;
}


/*-----------------------------------------------
	MOVIE PAGE
-----------------------------------------------*/

#moviepage{
	padding-top:20px;
	padding-bottom: 30px;
}
#moviepage h3{
	font-size:24px;
	margin-bottom:0.5em;
}
.movieMain{
	background-size:cover;
	height:150px;
}

#moviepage p.tx{
	font:12px;
}
#moviepage p.tx2{
	font:11px;
}

#movieArea01{
	margin-bottom:10px;
}
#movieArea02{
}

#movieArea01 .movieBox{
	width: 100%;
	float: none;
}
#movieArea01 .movieBox2{
	width: 100%;
	float: none;
	
}
#movieArea02 .movieBox{
	width: 49%;
	margin-right: 0px;
}
#movieArea02 .movieBox3{
	width: 49%;
	margin-right: 0px;
	float:right;
}
#movieArea02 .movieBox2{
	width: 49%;
	float: right;	
}
}