@media screen and (max-width: 768px) {

	a{
	}
	a:hover, a:focus{
	}

	a:hover img,
	a:focus img {
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}
	.pcHide{
		display: block !important;
	}
	.spHide{
		display: none !important;
	}
	.pc_br{
		display: none !important;
	}
	.sp_br{
		display: inline !important;
	}
	body{
  	background: url(../img/bg_main.jpg) no-repeat top center;
		background-size: auto 500px;
		background-color: #000000;
	}

	/* Layout */
	.wrapper{
		width: auto;
		margin: 0 20px 0 20px;
		text-align: center;
		font-size: 14px;
		font-size: 1.4rem;
	}

	h2{
		display: block;
		font-size: 24px;
		font-size: 2.4rem;
		text-align: center;
		font-weight: 500;
	  line-height: 1.0;
	}
	.txtBox{
	  margin-top: 24px;
	}
	.link a span{
	  display: block;
	  background: url(../img/ico_link.png) no-repeat center right;
		background-size: 11px 19px;
	  text-align: center;
	}
	.outlink{
		display: inline-block;
	  margin-right: 4px;
	  padding-right: 14px;
		background: url(../img/ico_outlink.png) no-repeat center right;
		background-size: 8px 10px;
	}
	.btnEntry img{
		width: 100%;
		height: auto;
	}
	/* header*/
	#header{
		width: 100%;
		display: block;
		margin: 0 0 0 0;
		padding: 15px 0 15px 0;
	}
	#header.on{
		background: url(../img/bg_b60.png) repeat top left;
	}
	#header .wrapper{
		margin: 0 0 0 0 !important;
	}

	h1{
		width: 191px;
		height: 0;
		display: block;
		float: left;
		margin-left: 10px;
		padding-top: 48px;
		background: url(../img/h1.png) no-repeat center center;
		background-size: auto 48px;
		overflow: hidden;
	}

	h3{
		width: 80px;
		height:  0;
		display: block;
		margin-top: 0;
		padding-top: 36px;
		background: url(../img/menu_off.png) no-repeat top left;
		background-size: 80px 36px;
		overflow: hidden;
		position: absolute;
		top: 20px;
		right: 15px;
	}
	h3.on{
		background: url(../img/menu_on.png) no-repeat top left;
		background-size: 80px 36px;
	}

	.sp_btnTicket{
	  display: block;
		margin-top: 3px;
		margin-right: 62px;
		float: right;
	}
	.sp_btnTicket a{
		display: inline-block;
	  padding: 0 15px 0 15px !important;
	  text-align: center;
	  background-color: #010101;
	  color: #ffffff;
	  border-radius: 4px;
	  font-size: 11px;
	  font-size: 1.1rem;
		font-weight: 500;
	  line-height: 36px;
		border-bottom: none;
	}

	/* Navi */
	#navi{
		width: 100%;
	  margin-top: 0;
		display: none;
		float: none;
		background: url(../img/bg_b60.png) repeat top left;
		font-size: 14px;
		font-size: 1.4rem;
		font-weight: 500;
	  line-height: 1.0;
		position: absolute;
		top: 58px;
		left: 0;
		z-index: 10000;
	}
	#navi ul{
		display: block;
	}
	#navi li{
		width: 90%;
		display: block;
		float: none;
		margin: 0 auto 0 auto;
		padding: 16px 0 16px 0;
		border-bottom: 1px solid #ffffff;
	}
	#navi li:first-child{
		margin: 0 auto 0 auto;
		border-top: 1px solid #ffffff;
	}
	#navi li:last-child{
		border-bottom: none;
	}
	#navi li a{
		width: 100%;
		display: block;
	  border-bottom: none;
	}
	#navi li a:hover{
		color: #010101;
		padding-bottom: 1px;
	  border-bottom: none;
	}

	#navi li.bt_ticket{
		width: 90%;
		margin: 0 auto 0 auto;
		border-bottom: none;
	}
	#navi li.bt_ticket:after{
		content: ".";
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
	}
	#navi li.bt_ticket a{
		width: 100%;
		display: block;
	  padding: 20px 0 20px 0;
	  text-align: center;
	  background-color: #010101;
	  color: #ffffff;
	  border-radius: 8px;
	  font-size: 12px;
	  font-size: 1.2rem;
	  line-height: 1.0;
	}
	#navi li.bt_ticket a:hover{
	  background-color: #010101;
	  border-bottom: none;
	}

	/* main */
	#main{
	  width: 100%;
		display: block;
		margin: 0 0 0 0;
	  padding: 0 0 16px 0;
	  overflow: hidden;
	}
	#main .wrapper{
	  width: 100%;
		margin: 0;
	  overflow: hidden;
	}
	#main h2{
	  width: 100%;
		height: 0;
		display: block;
		padding-top: 80%;
		background: url(../img/h2_main_sp.png) no-repeat center center;
		background-size: 100% auto;
		overflow: hidden;
	}
	#main .btnEntry{
	  display: block;
	  margin: 0 20px 0 20px;
	  position: repeat;
	  top: 0;
	}
	.txtEntry{
		width: 80%;
		margin: 0 auto 0 auto;
	  font-size: 10px;
		font-size: 1.0rem;
	  color: #afe876;
		text-align: center;
	}

	/* about */
	#about{
	  display: block;
		margin: 0 0 0 0;
	  background: url(../img/bg_about.jpg) no-repeat top center;
	  background-size: cover;
	}
	#about .wrapper{
	  padding: 20px 0 22px 0;
	}
	#about h2{
	  text-shadow: 0 0 13px #007da4, 1px 1px 1px #007da4, 1px -1px 1px #007da4, -1px -1px 1px #007da4, -1px 1px 1px #007da4;
	}

	.aboutBox{
	  display: block;
	  margin: 24px 0 32px 0;
	  padding: 5px;
		background: url(../img/bg_b40.png) repeat top left;
	}
	.aboutBox dl{
	  padding: 2px 10px 10px 10px;
	}
	.aboutBox dt{
		width: auto;
		display: block;
		float: none;
	  padding: 8px 0 0 0;
	}

	.aboutBox dd{
		padding: 0 10px 8px 0;
		word-wrap: break-word;
  	border-bottom: 1px solid #ffffff;
	}
	.aboutAttention{
	  font-size: 12px;
		font-size: 1.2rem;
	}
	.map{
	  font-size: 10px;
	  font-size: 1.0rem;
	  border-radius: 2px;
	  border-bottom: none !important;
	}
	.map:hover{
	  background-color: #345a21;
	}

	#about .btnEntry{
	  margin-bottom: 42px !important;
	}

	.playerBox{
	  margin: 24px 0 0 0;
	}
	.playerBox li{
	  width: 49%;
	  display: block;
	  margin: 0 0 16px 2%;
	  float: left;
	}
	.playerBox li:nth-child(2n+1){
	  margin: 0 0 16px 0;
	  clear: left;
	}
	.playerBox li img{
	  width: 100%;
	  height: auto;
	}
	.playerBox li.profBtn{
	  width: 100%;
	  display: block;
	  margin: 16px 0  0 0 !important;
	}
	.profBtn a{
	  border-radius: 5px;
	}
	.playerBox h4{
	  font-size: 16px;
	  font-size: 1.6rem;
	}

	/* rule */
	#rule{
	  display: block;
		margin: 0 0 0 0;
	}
	#rule .wrapper{
	  display: block;
		margin-top: 60px;
	}
	#rule h2{
  	text-shadow: 0 0 13px #007da4, 1px 1px 1px #007da4, 1px -1px 1px #007da4, -1px -1px 1px #007da4, -1px 1px 1px #007da4;
	}
	#rule ul{
	  display: block;
	  margin-top: 24px;
	  padding: 0;
	}
	#rule li{
	}
	#rule li:last-child{
	  border-bottom: none;
	}
	#rule li dt{
	  width: auto;
	  height: 0;
	  display: block;
	  float: none;
	  padding: 32px 0 0 0;
	  overflow: hidden;
	}
	#rule li:nth-child(1) dt{
	  background: url(../img/txt_rule01.png) no-repeat left center;
		background-size: auto 32px;
	}
	#rule li:nth-child(2) dt{
	  background: url(../img/txt_rule02.png) no-repeat left center;
		background-size: auto 32px;
	}
	#rule li:nth-child(3) dt{
	  background: url(../img/txt_rule03.png) no-repeat left center;
		background-size: auto 32px;
	}
	#rule li:nth-child(4) dt{
	  background: url(../img/txt_rule04.png) no-repeat left center;
		background-size: auto 32px;
	}
	#rule li:nth-child(5) dt{
	  background: url(../img/txt_rule05.png) no-repeat left center;
		background-size: auto 32px;
	}
	#rule li dd{
	  display: block;
	  padding: 5px 5px 0 5px;
	  font-size: 16px;
	  font-size: 1.6rem;
	}

	.ruleAttention{
	  display: block;
	  margin-top: 24px;
	  font-size: 11px;
	  font-size: 1.1rem;
		text-align: left;
	}

	/* att */
	#att{
		display: block;
		margin: 60px 0 0 0;
	}
	#att .wrapper{
	  padding: 20px 10px 20px 10px;
	  box-shadow: 0 0 12px 3px rgba(255,255,255,0.35) inset;
	}
	#att .txtBox{
	  display: block;
	  margin: 24px 0 0 0;
	}


	/* banner */
	#banner{
	}
	#banner .col1{
	  width: 100%;
	  margin: 40px auto 0 auto;
	}
	#banner .col4{
	  display: block;
	  margin: 30px auto 0 auto;
	}

	#banner .col4 li{
	  width: 49%;
	  display: block;
	  float: left;
	  margin: 0 0 0 2%;
	}
	#banner .col4 li:first-child{
	  margin: 0 0 0 0;
	}
	#banner .col4 li:nth-child(2n+1){
	  margin: 0 0 0 0;
	}

	/* Btn TOP */
	#btnTop{
	  width: 30px;
	  height: 30px;
	  display: block;
	  position: fixed;
	  bottom: 15px;
	  right: 15px;
	}
	#btnTop a{
	  width: 30px;
	  height: 0;
	  display: block;
	  padding-top: 30px;
	  background: url(../img/btTop.png) no-repeat center center;
	  background-size: 30px 30px;
	  border-bottom: none;
	  overflow: hidden;
	}
	#btnTop a:hover{
	  background: url(../img/btTop_on.png) no-repeat center center;
	  background-size: 30px 30px;
	}

	/* footer */
	#footer{
	}
	#footer .wrapper{
	  padding: 0 0 42px 0;
	}
	.privacy{
	  display: block;
	  float: none;
	  margin-top: 32px;
	  font-size: 9px;
	  font-size: 0.9rem;
	}
	#copyright{
		display: block;
	  float: none;
	  margin-top: 24px;
		font-size: 9px;
	  font-size: 0.9rem;
	}


}
