@charset "utf-8";




/*----------------------------------------
	for PC
----------------------------------------*/


@media screen and (min-width: 481px){

	body{

		background-color:#FFF6F1;
	}

	#wrapper{
		background:url('../img/bg.jpg') no-repeat;
		background-position:center top;
		background-attachment:fixed;
		min-width:1000px;
	}

	#contents{
		width:1000px;
		margin:0 auto 0;
				position:relative;
	}

	.logo_haruka15th{
		position:absolute;
		top:0px;
		right:0px;
	}

	h1{
		display:block;
		width:100%;
		text-align:center;
		margin:0px auto 0;
		padding:30px 0 0;
	}

	#base{
		background-image:url('../img/bg_base_2.jpg');
		background-size:100%;
		position:relative;
		padding:40px 0 60px;
		overflow:hidden;
		box-shadow:2px 2px 3px rgba(0,0,0,0.3);
	}

	.base_top{
		position:absolute;
		top:0px;
		left:0px;
		display:block;
		width:100%;
		z-index:0;
	}

	.base_bottom{
		position:absolute;
		bottom:0px;
		left:0px;
		display:block;
		width:100%;
		z-index:0;
	}

	.base_inner{
		position:relative;
		display:block;
		z-index:10;
		width:92%;
		margin:0 auto 0;
	}



	h2{
		width:90%;
		text-align:center;
		padding:2px 0;
		border-bottom:1px solid #FBE573;
		margin:0 auto 0;
	}


	h2::after{
		content:"";
		display:block;
		width:95%;
		text-align:center;
		border-bottom:1px solid #FBE573;
		margin:0 auto 0;
	}

	.readText{
		text-align:center;
		padding:15px 0 0;
		font-size:17px;
		line-height:1.6;
		font-weight:800;
		text-shadow:0px 0px 3px rgba(0,0,0,0.5);
	}


	/*box*/

	.box{
		background-color:#fff;
		margin:30px 0 0;
		box-shadow:2px 2px 3px rgba(0,0,0,0.3);
		position:relative;
	}

	.box.num_1::before{
		content:'';
		display:block;
		background-image:url('../img/num1.png');
		background-repeat:no-repeat;
		position:absolute;
		top:-10px;left:0px;
		width:150px;
		padding-top:15%;
	}

	.box.num_2::before{
		content:'';
		display:block;
		background-image:url('../img/num2.png');
		background-repeat:no-repeat;
		position:absolute;
		top:-11px;left:0px;
		width:150px;
		padding-top:15%;
	}

	.box.num_3::before{
		content:'';
		display:block;
		background-image:url('../img/num3.png');
		background-repeat:no-repeat;
		position:absolute;
		top:-11px;left:0px;
		width:150px;
		padding-top:15%;
	}

	.box_line{
		padding:4% 4% 0%;
	}

	.box .logo{
		width:40%;
		float:left;
	}

	.box.num_1 .logo{
		padding:40px 0 0;
	}

	.box.num_2 .logo{
		padding:35px 0 0;
	}

	.box.num_3 .logo{
		padding:50px 0 0;
	}

	.box .info{
		width:45%;
		float:right;
		text-align:center;
	}

	.box .info h4{
		width:100%;
		display:block;
		text-align:center;
	}

	.box .info .date{
		margin:10px auto 10px;
	}

	.box .info .btn_os{
		display:block;
		width:90%;
		margin:0 auto 0;
		background-color:#450C77;
		color:#fff;
		border-radius:5px;
		padding:7px 0;
		box-shadow:2px 2px 0px rgba(0,0,0,0.2);
	}


	.num_1 .box_line{
		border:6px solid #f5579e;
	}

	.num_2 .box_line{
		border:6px solid #1ac39d;
	}

	.num_3 .box_line{
		border:6px solid #dbc846;
	}

	.box .text{
		border-top:1px solid #ddd;
		margin-top:20px;
		padding:10px 0;
		font-size:15px;
		color:#36298a;
	}

	.box .accordion_btn{
		padding:3px 15px;
		border-radius:20px;
		color:#fff;
		display:inline-block;
		cursor:pointer;
	}

	.box.num_1 .accordion_btn{
		background-color:#ed1c79;
	}

	.box.num_2 .accordion_btn{
		background-color:#048d6e;
	}

	.box.num_3 .accordion_btn{
		background-color:#be8d08;
	}

	.accordion{
		margin:10px auto 0;
		text-align:center;
		overflow:hidden;
	}

	.accordion_content{
		text-align:left;
		padding:10px 0 30px;
	}

	.accordion_content h5{
		font-size:22px;
		font-weight:800;
	}

	.accordion_content h6{
		display:inline-block;
		font-size:20px;
		font-weight:800;
		margin:30px 0 9px;
		border-bottom:1px solid #36298a;
		padding:0 0 0px;
	}

	.accordion_content .min{
		font-size:13px;
		display:block;
		margin:5px 0 0px;
		line-height:1.4;
		color:#777;
	}


	.travelplan{
		padding:15px 15px;
		background-color:#d00;
		border-radius:5px;
		text-align:center;
		color:#fff;
	}

	.travelplan .bold{
		color:#fff;
		font-weight:800;
		font-size:25px;
		text-shadow:2px 2px 0px rgba(0,0,0,0.2);
	}

	.travelplan .btn_entry{
		background-color:#d00;
		color:#fff;
		border-radius:20px;
		padding:1px 10px;
		display:inline-block;
		margin:5px 0 0;
		border:2px solid #fff;
	}







	#spec{
		background:#fff url('../img/common/bg_spec.jpg') center bottom ;
		background-repeat:no-repeat;
		min-width:1000px;
	}

	#spec .spec_inner{
		width:900px;
		margin:0 auto 0;
		color:#338;
		padding:60px 0 80px;
	}

	#spec .image{
		float:left;
		box-shadow:2px 2px 3px rgba(50,80,50,0.4);
	}

	#spec .txt{
		float:left;
		margin-left:40px;
	}

	#spec table{
		border-collapse:collapse;
	}

	#spec table th{
		font-weight:800;
		text-align:left;
		vertical-align:top;
		border-bottom:1px solid #888;
		padding:5px;padding-right:15px;
	}

	#spec table td{
		border-bottom:1px solid #888;
		padding:5px;
	}





	#footer{
		padding:55px 0;
		position:relative;
		z-index:80;
		min-width:1000px;
		margin:0 auto 0;
		color:#333;
		text-align:center;
	}

	#footer img{
		display:block;
		margin:0 auto 0;
	}

	#footer .rights{
		display:block;
		margin:0 auto 0;
	}

	#footer .attention_screenshots{
		display:block;
		font-size:12px;
		color:#666;
		width:980px;
		padding:0px 10px 30px;
		margin:0 auto 0;
		line-height:1.7em;
		text-align:center;
	}

	#footer .btn_twitter img{
		display:block;
		width:100%;
	}

	#sns{
		width:220px;
		margin:0 auto 30px;
	}

	#sns a{
		float:left;
		margin:4px;
	}

	a.mo:hover{
		opacity:0.8;
	}

	.textLink{
		font-size:16px;
		width:1000px;
		margin:0 auto 0;
		text-align:center;
		color:#36298a;
		padding:0px 0 20px;
	}

	.textLink a{
		color:#36298a;
	}


	/*--------common---------*/

	.hide_sp{display:block!important;}
	.hide_pc{display:none!important;}
	.hide_spi{display:inline!important;}
	.hide_pci{display:none!important;}



	.text1{
		width:50%;
		float:left;
	}

	.item1{
		width:45%;
		float:right;
	}

	.text2{
		float:left;
		width:49%;
		margin:8px 0.5% 0;
		line-height:1.6;
	}


	.text2 img{
		width:100%;
		display:block;
	}


}

/*----------------------------------------
	for SP
----------------------------------------*/

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

	body{

		background-color:#FFF6F1;
	}

	#wrapper{
		background:url('../img/bg.jpg') no-repeat;
		background-position:center top;
		background-attachment:fixed;
		background-size:140%;
	}

	#contents{
		width:100%;
		margin:0 auto 0;
		position:relative;
	}

	.logo_haruka15th{
		position:absolute;
		top:0px;
		right:0px;
		width:14%;
	}

	h1{
		display:block;
		width:100%;
		text-align:center;
		margin:0px auto 0;
		padding:10% 0 5%;
	}

	h1 img{
		display:block;
		width:98%;
		margin:0 auto 0;
	}


	#base{
		background-image:url('../img/bg_base_2.jpg');
		background-size:100%;
		position:relative;
		padding:40px 0 60px;
		width:96%;
		margin:0 auto 0;
		overflow:hidden;
		box-shadow:2px 2px 1px rgba(0,0,0,0.3);
	}

	.base_top{
		position:absolute;
		top:0px;
		left:0px;
		display:block;
		width:100%;
		z-index:0;
	}

	.base_bottom{
		position:absolute;
		bottom:0px;
		left:0px;
		display:block;
		width:100%;
		z-index:0;
	}

	.base_inner{
		position:relative;
		display:block;
		z-index:10;
		width:94%;
		margin:0 auto 0;
	}



	h2{
		width:94%;
		text-align:center;
		padding:2px 0;
		border-bottom:1px solid #FBE573;
		margin:0 auto 0;
	}

	h2 img{
		width:100%;
		text-align:center;
	}


	h2::after{
		content:"";
		display:block;
		width:95%;
		text-align:center;
		border-bottom:1px solid #FBE573;
		margin:0 auto 0;
	}

	.readText{
		text-align:left;
		padding:15px 0 0;
		font-size:15px;
		line-height:1.6;
		text-shadow:0px 0px 3px rgba(0,0,0,0.5);
		width:94%;
		margin:0 auto 0;
	}

	.readText br{
		display:none;
	}


	/*box*/

	.box{
		background-color:#fff;
		margin:30px 0 0;
		box-shadow:2px 2px 3px rgba(0,0,0,0.3);
		position:relative;
	}

	.box.num_1::before{
		content:'';
		display:block;
		background-image:url('../img/num1.png');
		background-repeat:no-repeat;
		background-size:100%;
		position:absolute;
		top:0px;left:0px;
		width:20%;
		padding-top:18%;
		margin-top:-1.2%;
	}

	.box.num_2::before{
		content:'';
		display:block;
		background-image:url('../img/num2.png');
		background-repeat:no-repeat;
		background-size:100%;
		position:absolute;
		top:0px;left:0px;
		width:20%;
		padding-top:18%;
		margin-top:-1.2%;
	}

	.box.num_3::before{
		content:'';
		display:block;
		background-image:url('../img/num3.png');
		background-repeat:no-repeat;
		background-size:100%;
		position:absolute;
		top:0px;left:0px;
		width:20%;
		padding-top:18%;
		margin-top:-1.6%;
	}

	.box_line{
		padding:4% 4% 0%;
	}

	.box .logo{
		width:90%;
		margin:0 auto 5%;
		padding:10% 0 5%;
	}

	.box .logo img{
		display:block;
		width:100%;
	}


	.box .info{
		width:100%;
		text-align:center;
	}

	.box .info h4{
		width:100%;
		display:block;
		text-align:center;
	}

	.box .info h4 img{
		width:90%;
	}

	.box .info .date{
		margin:6% auto 6%;
		display:block;
	}

	.box.num_1 .info .date{
		width:80%;
	}

	.box.num_2 .info .date,
	.box.num_3 .info .date{
		width:32%;
	}


	.box .info .btn_os{
		display:block;
		width:90%;
		margin:0 auto 0;
		background-color:#000;
		color:#fff;
		border-radius:5px;
	}

	.num_1 .box_line{
		border:6px solid #f5579e;
	}

	.num_2 .box_line{
		border:6px solid #1ac39d;
	}

	.num_3 .box_line{
		border:6px solid #dbc846;
	}

	.box .text{
		border-top:1px solid #ddd;
		margin-top:20px;
		padding:10px 0;
		font-size:14px;
		color:#36298a;
	}

	.box .text br{
		display:none;
	}

	.box .accordion_btn{
		padding:3px 15px;
		border-radius:20px;
		color:#fff;
		display:inline-block;
		cursor:pointer;
		font-size:12px;
	}

	.box.num_1 .accordion_btn{
		background-color:#ed1c79;
	}

	.box.num_2 .accordion_btn{
		background-color:#048d6e;
	}

	.box.num_3 .accordion_btn{
		background-color:#be8d08;
	}

	.accordion{
		margin:10px auto 0;
		text-align:center;
		overflow:hidden;
	}

	.accordion_content{
		text-align:left;
		padding:10px 0 30px;
	}

	.box .text .accordion_content br{
		display:inline;
	}

	.accordion_content h5{
		font-size:22px;
		font-weight:800;
	}

	.accordion_content h6{
		display:inline-block;
		font-size:20px;
		font-weight:800;
		margin:30px 0 9px;
		border-bottom:1px solid #36298a;
		padding:0 0 0px;
	}

	.accordion_content .min{
		font-size:11px;
		display:block;
		margin:5px 0 0px;
		line-height:1.4;
		color:#777;
	}


	.travelplan{
		padding:15px 15px;
		background-color:#d00;
		border-radius:5px;
		text-align:center;
		color:#fff;
		font-size:12px;
	}

	.travelplan .bold{
		color:#fff;
		font-weight:800;
		font-size:25px;
		text-shadow:2px 2px 0px rgba(0,0,0,0.2);
	}

	.travelplan .btn_entry{
		background-color:#d00;
		color:#fff;
		border-radius:20px;
		padding:1px 10px;
		display:inline-block;
		margin:8px 0 0;
		border:2px solid #fff;

	}




	#spec{
		background:#fff url('../img/common/bg_spec.jpg') center bottom ;
		background-repeat:no-repeat;
		min-width:1000px;
	}

	#spec .spec_inner{
		width:900px;
		margin:0 auto 0;
		color:#338;
		padding:60px 0 80px;
	}

	#spec .image{
		float:left;
		box-shadow:2px 2px 3px rgba(50,80,50,0.4);
	}

	#spec .txt{
		float:left;
		margin-left:40px;
	}

	#spec table{
		border-collapse:collapse;
	}

	#spec table th{
		font-weight:800;
		text-align:left;
		vertical-align:top;
		border-bottom:1px solid #888;
		padding:5px;padding-right:15px;
	}

	#spec table td{
		border-bottom:1px solid #888;
		padding:5px;
	}





	#footer{
		padding:55px 0 20px;
		position:relative;
		z-index:80;
		width:100%;
		margin:0 auto 0;
		color:#333;
		text-align:center;
		font-size:11px;
	}

	#footer img{
		display:block;
		margin:0 auto 0;
	}

	#footer .rights{
		display:block;
		margin:0 auto 0;
	}


	#footer .btn_twitter img{
		display:block;
		width:100%;
	}

	#sns{
		width:220px;
		max-width:100%;
		margin:0 auto 30px;
	}

	#sns a{
		float:left;
		margin:4px;
	}

	a.mo:hover{
		opacity:0.8;
	}

	.textLink{
		font-size:14px;
		width:96%;
		margin:0 auto 0;
		text-align:center;
		color:#36298a;
		padding:0px 0 20px;
	}

	.textLink a{
		color:#36298a;
		display:block;
	}


/*--------common---------*/

.hide_sp{display:none!important;}
.hide_pc{display:block!important;}
.hide_spi{display:none!important;}
.hide_pci{display:inline!important;}


.text1{
	width:100%;
	float:left;
}

.item1{
	width:100%;
	float:right;
}

.text2{
	width:100%;
	margin:14px auto 0;
	line-height:1.6;
}


.text2 img{
	width:100%;
	display:block;
}

}