@charset "utf-8";
/* reset */
html, body, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p {
	margin: 0;
	padding: 0;
	font-size: 100%;
	/*********** 明朝font-family ***********/
	/*
	font-family: 'ヒラギノ明朝 ProN','Hiragino Mincho ProN','Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ＭＳ Ｐ明朝','MS PMincho',sans-serif;
	*/

	/*********** ゴシックfont-family ***********/
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.fluffy {
  animation: fluffy1 3s ease infinite;
}

@keyframes fluffy1 {
  0% { transform:translateY(0) }
  20% { transform:translateY(-15px) }
  40% { transform:translateY(0) }
  60% { transform:translateY(-15px) }
  80% { transform:translateY(0) }
  100% { transform:translateY(0) }
}

.slidein {
  animation: SlideIn 3.0s;
}

@keyframes SlideIn {
  0% {
    opacity: 0;/*初期状態では透明に*/
    transform: translateX(64px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@media screen and (min-width: 0px) and (max-width: 480px){
	
		header{
		width: 100%;
		background: rgb(41,182,179);
		background: linear-gradient(90deg, rgba(41,182,179,1) 0%, rgba(19,108,176,1) 100%);
		position:fixed;
		top:0;
		left:0;
		z-index: 100;
		}

		header img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.main_vis{
		background-image: url("../img/main_bg.png");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}
	
	.main_vis img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
	}
	
	.contents{
		background-position: left bottom;
		background-size: cover;
		background-repeat: no-repeat;
		padding: 5% 0 0 0;
	}

	.contents img{
		width:100%;
		height: auto;
		display: block;
		margin: 0 auto;
	}

	.sub_cont{
		background-image: url("../img/hondana_bg.jpg");
		width: 100%;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.sub_cont img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.what_cont{
		width: 100%;
		background-image: url("../img/what_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.what_cont img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.answer_box{
		width: 100%;
		background-image: url("../img/hondana_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.answer_box img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.answer_desc{
		width: 100%;
		background: rgb(41,182,179);
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.answer_desc img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.max10_content{
		width: 100%;
		background-image: url("../img/max10_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.max10_content img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.chance_box{
		width: 100%;
		background-image: url("../img/chance_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.chance_box img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.zai_box{
		width: 100%;
		background-image: url("../img/zai_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.zai_box img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.shidai_desc{
		width: 100%;
		background: rgb(41,182,179);
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.shidai_desc img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.owatashi_box{
		width: 100%;
		background-image: url("../img/owatashi_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.owatashi_box img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.aimani_box{
		width: 100%;
		background: #fff;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.aimani_box img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.dondon_box{
		width: 100%;
		background-image: url("../img/dondon_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.dondon_box img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.price_box{
		width: 100%;
		background: #fff;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.price_box img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.kochira{
		width: 100%;
		background: #fff;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.kochira img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
		}


	
	form input[type="text"]{
		width: 90%;
		height: auto;
		text-align: center;
		display: block;
		margin: 0 auto;
		line-height: 1.5em;
		font-size: 1em;
		font-weight: 100;
		margin-bottom: 8%;
	}
	
	input::placeholder {
		color: #bbbbbb;
		font-weight: 100;
	}
	
	form input[type="image"]{
		width: 80%;
		height: auto;
		display: block;
		margin: 0 auto;
	}
	
	footer{
		padding-top: 1%;
		padding-bottom: 1%;
		margin-top:0;
		background: rgb(41,182,179);
		background: linear-gradient(90deg, rgba(41,182,179,1) 0%, rgba(19,108,176,1) 100%);

	}
	
	footer p{
		text-align: center;
		line-height: 1.7em;
		color: #fff;
		font-size: 0.6em;
	}
	
	footer p a{
		text-decoration: none;
		color: #fff;
	}

	.btn{
		margin-bottom:3%;
	}

	.form{
		width: 100%;
		background: #fff;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}


	.wave_form{
		width:80%;
		height: auto;
		display: block;
		margin: 0 auto;

	}

	form input[type="text"]{
		width:100%;
		height: auto;
		margin: 0 auto;
		line-height: 1.5em;
		font-size: 1.5em;
		font-weight: 100;
		margin-bottom: 5%;

	}
	
	input::placeholder {
		color: #dddddd;
		font-weight: 100;
	}
	
	form input[type="image"]{
		width: 80%;
		height: auto;
		display: block;
		margin: 0 auto;
	}

	.form_text {
	height: auto;
	display: block;
	margin: 0 auto;
}

	label[for="form_title"] {
	color:#000;
	height: auto;
	display: block;
	font-size: 1.5em;
	color:rgb(41,182,179);
	margin-bottom: 2%;
}



	form input[type="radio"]{
		width: 2em;
		height: 2em;
	}

	label[for="radio_title"] {
	color:#000;
	height: auto;
	display: block;
	color:rgb(41,182,179);
	margin-bottom: 5%;
}

	.age_radio {
	font-size: 1.2em;
	margin-bottom: 7%;

}

	.pay_radio {
	font-size: 1.1em;
	margin-bottom: 7%;

}

	.tokutei_radio {
	font-size: 1.2em;
	margin-bottom: 7%;

}
	.p-form_btn{
	margin-bottom: 7%;

}

}


@media screen and (min-width: 480px) {

		header{
		width: 100%;
		background: rgb(41,182,179);
		background: linear-gradient(90deg, rgba(41,182,179,1) 0%, rgba(19,108,176,1) 100%);
		position:fixed;
		top:0;
		left:0;
		z-index: 100;
		}

		header img{
		height: 100px;
		display: block;
		margin: 0 auto;
		}


	.inner{
		max-width: 1000px;
		height: auto;
		display: block;
		margin: 0 auto;
	}
	
	.main_vis{
		background-image: url("../img/bg_01.png");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}
	
	.main_vis img{
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
	}
	
	.contents{
		background-size: cover;
		background-repeat: no-repeat;
		padding: 2% 0 0 0;
	}

	.contents img{
		height: auto;
		display: block;
		margin: 0 auto;
	}


	.sub_cont{
		background-image: url("../img/hondana_bg.jpg");
		width: 100%;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.sub_cont img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.what_cont{
		width: 100%;
		background-image: url("../img/what_bg.jpg");
		background-position: center;
		background-size: auto;
		background-repeat: no-repeat;
	}

	.what_cont img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.answer_box{
		width: 100%;
		background-image: url("../img/hondana_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.answer_box img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.answer_desc{
		width: 100%;
		background: rgb(41,182,179);
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.answer_desc img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.max10_content{
		width: 100%;
		background-image: url("../img/max10_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.max10_content img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.chance_box{
		width: 100%;
		background-image: url("../img/chance_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.chance_box img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.zai_box{
		width: 100%;
		background-image: url("../img/zai_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.zai_box img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.shidai_desc{
		width: 100%;
		background: rgb(41,182,179);
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.shidai_desc img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.owatashi_box{
		width: 100%;
		background-image: url("../img/owatashi_bg.jpg");
		background-position: center;
		background-size: contain;
		background-repeat: no-repeat;
	}

	.owatashi_box img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.aimani_box{
		width: 100%;
		background: #fff;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.aimani_box img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.dondon_box{
		width: 100%;
		background-image: url("../img/dondon_bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.dondon_box img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.price_box{
		width: 100%;
		background: #fff;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.price_box img{
		height: auto;
		display: block;
		margin: 0 auto;
		}

	.kochira{
		width: 100%;
		background: #fff;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.kochira img{
		height: auto;
		display: block;
		margin: 0 auto;
		}



	.btn{
		margin-bottom:3%;
	}


	
	footer{
		padding-top: 1%;
		padding-bottom: 1%;
		margin-top:0;
		background: rgb(41,182,179);
		background: linear-gradient(90deg, rgba(41,182,179,1) 0%, rgba(19,108,176,1) 100%);


	}
	
	footer p{
		text-align: center;
		line-height: 1.7em;
		color: #fff;
		font-size: 0.8em;
	}
	
	footer p a{
		text-decoration: none;
		color: #fff;
	}

.ring {
	background: rgba(51, 255, 51, 0.8);
	z-index:100;
	position: absolute;
	width: 40%;
	height: 40%;
	border-radius: 150px;
	top: 0%;
	left: 50%;
   	animation: pulsate 1s ease-out;  /* スピードなど */ 
	animation-iteration-count: infinite;
}


	.form{
		width: 100%;
		background: #fff;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}
	.wave_form{
		width:800px;
		height: auto;
		display: block;
		margin: 0 auto;

	}

	form input[type="text"]{
		width:100%;
		height: auto;
		margin: 0 auto;
		line-height: 2em;
		font-size: 2em;
		font-weight: 100;
		margin-bottom: 5%;

	}
	
	input::placeholder {
		color: #dddddd;
		font-weight: 100;
	}
	
	form input[type="image"]{
		width: 80%;
		height: auto;
		display: block;
		margin: 0 auto;
	}

	.form_text {
	height: auto;
	display: block;
	margin: 0 auto;
}

	label[for="form_title"] {
	color:#000;
	height: auto;
	display: block;
	font-size: 2.5em;
	color:rgb(41,182,179);
	margin-bottom: 2%;
}



	form input[type="radio"]{
		width: 2.5em;
		height: 2.5em;
	}

	label[for="radio_title"] {
	color:#000;
	height: auto;
	display: block;
	color:rgb(41,182,179);
	margin-bottom: 5%;
}

	.age_radio {
	font-size: 2.5em;
	margin-bottom: 7%;

}

	.pay_radio {
	font-size: 2.5em;
	margin-bottom: 7%;

}

	.tokutei_radio {
	font-size: 2.5em;
	margin-bottom: 7%;

}
	.p-form_btn{
	margin-bottom: 7%;

}









@keyframes pulsate {
    0%   { transform: scale(1, 1); }
    50%  { opacity: 1; }
    100% { transform: scale(2.5, 3.5); opacity: 0.0; }
}

}