@charset "UTF-8";

/* フォーム */
body{
	background:#74534A;
	background:-webkit-linear-gradient( #8F756D, #74534A );
	background:-moz-linear-gradient( #8F756D, #74534A );
	background:-ms-linear-gradient( #8F756D, #74534A );
	background:-o-linear-gradient( #8F756D, #74534A );
	background:linear-gradient( #8F756D, #74534A);
	font-family:'Verdana','BIZ UDゴシック','BIZ UDGothic','游ゴシック','YuGothic','ヒラギノ角ゴ ProN','Hiragino Kaku Gothic ProN','メイリオ','Meiryo','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	min-height:100vh;
}

/* 全体 */
#container{
	position:relative;
	margin:0 auto;
	width:100%;
	background:#F8F6F6;
	padding:30px 15px;
	width:100%;
	box-sizing:border-box;
	box-shadow:inset 0 0 15px #F1F1F1;
}
#headline{
	text-align:center;
	padding:0;
	-webkit-animation: none;
    animation: none;
}
#headline h1{
	padding-top:20px;
	font-size:1.3rem;
	letter-spacing:0.2em;
}
#headline img{
	width:230px;
	height:auto;
}
#headline h2{
	font-size:2.2rem;
	line-height:160%;
	padding:15px 0;
}
#headline p{
	text-align:left;
	font-size:1.4rem;
}
@media (min-width: 768px) {
	#container{
		padding:50px 40px;
		margin:25px auto;
		width:calc(100% - 50px);
		border:1px solid #5C4239;
		-webkit-border-radius:25px;
		-moz-border-radius:25px;
		-ms-border-radius:25px;
		-o-border-radius:25px;
		border-radius:25px;
		box-shadow:0 0 10px #F1F1F1,inset 0 0 20px #F1F1F1;
	}
	#headline img{
		width:280px;
	}
	#headline h2{
		font-size:2.5rem;
		padding:20px 0;
	}
}
@media (min-width: 900px) {
	#container{
		width:800px;
	}
	#container#thanks-page{
		
	}
}

#step{
	position:relative;
	margin:25px 0 5px;
}
#step.thanks{
	margin:5px 0 0;
}
#step-item{
	position:absolute;
	width:100%;
	top:50%;
	margin-top:-21px;
	left:0;
	font-size:0;
}
.step{
	display:inline-block;
	width:33.333%;
	box-sizing:border-box;
	padding-left:17px;
}
.step:first-child{
	padding-left:10px;
}
.step p{
	font-size:1.3rem;
	line-height:130%;
}
.step p.num{
	font-size:1.4rem;
	color:#333;
	font-family:'Open Sans';
	font-weight:400;
	font-weight:normal;
	text-shadow:none;
}
.step p.act{
	color:#FFF;
	font-weight:bold;
}
.step p.num.act{
	font-weight:700;
}
@media (min-width: 375px) {
	#step-item{
		margin-top:-21px;
	}
	.step{
		padding-left:23px;
	}
	.step:first-child{
		padding-left:20px;
	}
}
@media (min-width: 414px) {
	#step-item{
		margin-top:-22px;
	}
	.step{
		padding-left:30px;
	}
	.step:first-child{
		padding-left:27px;
	}
}
@media (min-width: 568px) {
	#step-item{
		margin-top:-21px;
	}
	.step{
		padding-left:55px;
	}
	.step:first-child{
		padding-left:55px;
	}
}
@media (min-width: 667px) {
	.step{
		padding-left:65px;
	}
	.step:first-child{
		padding-left:65px;
	}
}
@media (min-width: 736px) {
	.step{
		padding-left:80px;
	}
	.step:first-child{
		padding-left:80px;
	}
}
@media (min-width: 768px) {
	.step p{
		font-size:1.4rem;
	}
	.step p.num{
		font-size:1.5rem;
	}
	.step{
		padding-left:65px;
	}
	.step:first-child{
		padding-left:65px;
	}
}
@media (min-width: 812px) {
	#step-item{
		margin-top:-22px;
	}
	.step{
		padding-left:75px;
	}
	.step:first-child{
		padding-left:75px;
	}
}

.error{
	color:#F84750;
}


/*  */
.form-cont{
	padding:20px 0;
	border-top:1px solid #EEE;
}
.form-cont.last{
	padding:30px 0 0;
}
.question{
	font-weight:bold;
}
.answer p.category{
	font-weight:bold;
	padding-top:15px;
}
.answer p.top{
	padding-top:5px;
}
.answer ul{
	font-size:0;
}
.answer ul li{
	font-size:1.4rem;
	padding:3px 0;
}
.answer p.agree{
	padding-bottom:16px;
}
.answer p.agree2{
	text-align:center;
}
.answer p a{
	position:relative;
  	display:inline-block;
	font-weight:bold;
	/*text-decoration:underline;*/
}
.answer p a::after{
	content:'';
  	position:absolute;
  	bottom:0;
  	left:0;
  	width:100%;
  	height:1px;
  	background-color:#666;
  	-webkit-transform:scaleX(1);
  	-moz-transform:scaleX(1);
  	-ms-transform:scaleX(1);
  	-o-transform:scaleX(1);
  	transform:scaleX(1);
	-webkit-transition:ease-in-out 0.3s;
    -moz-transition:ease-in-out 0.3s;
    -ms-transition:ease-in-out 0.3s;
    -o-transition:ease-in-out 0.3s;
    transition:ease-in-out 0.3s;
}
.answer p a:hover::after{
	-webkit-transform:scaleX(0);
  	-moz--transform:scaleX(0);
  	-ms-transform:scaleX(0);
  	-o-transform:scaleX(0);
  	transform:scaleX(0);
}
@media (min-width: 568px) {
	.form-cont.last{
		padding:25px 0 0;
	}
	.answer ul li{
		display:inline-block;
		width:50%;
	}
}
@media (min-width: 667px) {
	.answer ul li{
		width:33.333%;
	}
}
@media (min-width: 768px) {
	.answer ul li{
		width:25%;
	}
	p.confirmation{
		display:none;
	}
}
@media (max-width: 767px) {
	.answer ul{
		padding-left:-10px;
	}
}


/* アイコン */
.icon-must{
	color:#FFF;
	font-size:1.0rem;
	padding:3px 6px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	-ms-border-radius:2px;
	-o-border-radius:2px;
	border-radius:2px;
	text-align:center;
	background:#F84750;
}
.icon-free{
	color:#FFF;
	font-size:1.0rem;
	padding:3px 6px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	-ms-border-radius:2px;
	-o-border-radius:2px;
	border-radius:2px;
	text-align:center;
	background:#69ACFE;
}

/* プレイスホルダー */
::-webkit-input-placeholder{
	color:#777;
	font-size:1.4rem;
	display: inline-block;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
:-moz-placeholder{
	color:#777;
	font-size:1.4rem;
	display: inline-block;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
::-moz-placeholder{
	color:#777;
	font-size:1.4rem;
	display: inline-block;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
:-ms-input-placeholder{
	color:#777;
	font-size:1.4rem;
	display: inline-block;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
::placeholder{
	color:#777;
	font-size:1.4rem;
	display: inline-block;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* テキストボックス */
input{
	font-size:100%;
	font-family:'Verdana','BIZ UDゴシック','BIZ UDGothic','游ゴシック','YuGothic','ヒラギノ角ゴ ProN','Hiragino Kaku Gothic ProN','メイリオ','Meiryo','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}
.box, .box-name{
	font-size:1.4rem;
	color:#333;
	height:45px;
	padding:10px;
	outline:none;
	width:100%;
	box-sizing:border-box;
	margin:5px 0;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	-ms-border-radius:2px;
	-o-border-radius:2px;
	border-radius:2px;
	border:1px solid #CCC;
	background:#F6F6F6;
	background:-webkit-linear-gradient( top, #F6F6F6, #FFF );
	background:-moz-linear-gradient( top, #F6F6F6, #FFF );
	background:-ms-linear-gradient( top, #F6F6F6, #FFF );
	background:-o-linear-gradient( top, #F6F6F6, #FFF );
	background:linear-gradient(to bottom, #F6F6F6, #FFF);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#F6F6F6', endColorstr='#FFFFFF');
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#F6F6F6, endcolorstr=#FFFFFF))";
	zoom: 1;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

/* テキストエリア */
textarea{
	font-size:100%;
	font-family:'Verdana','BIZ UDゴシック','BIZ UDGothic','游ゴシック','YuGothic','ヒラギノ角ゴ ProN','Hiragino Kaku Gothic ProN','メイリオ','Meiryo','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}
.textarea{
	font-size:1.4rem;
	height:150px;
	width:100%;
	padding:10px;
	box-sizing:border-box;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

/* フォーカス */
textarea:focus, input[type=text]:focus{
	background:#FFF;
}

/* セレクトボックス */
select{
	font-size:100%;
	font-family:'Verdana','BIZ UDゴシック','BIZ UDGothic','游ゴシック','YuGothic','ヒラギノ角ゴ ProN','Hiragino Kaku Gothic ProN','メイリオ','Meiryo','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}
.select-box {
	font-size: 1.4rem;
	color:#333;
	height:45px;
	padding:10px;
	width:100%;
	box-sizing:border-box;
	margin:5px 0;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	-ms-border-radius:2px;
	-o-border-radius:2px;
	border-radius:2px;
	border:1px solid #CCC;
	background:#F6F6F6;
	background:-webkit-linear-gradient( top, #F6F6F6, #FFF );
	background:-moz-linear-gradient( top, #F6F6F6, #FFF );
	background:-ms-linear-gradient( top, #F6F6F6, #FFF );
	background:-o-linear-gradient( top, #F6F6F6, #FFF );
	background:linear-gradient(to bottom, #F6F6F6, #FFF);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#F6F6F6', endColorstr='#FFFFFF');
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#F6F6F6, endcolorstr=#FFFFFF))";
	zoom: 1;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	color:#999;
}
select:focus{
	background:#FFF;
}

.date, .time{
	width:45%;
}
.time-space{
	padding-left:70px;
}
.name{
	width:70%;
}
.age{
	width:25%;
}
.tel{
	width:50%;
}
.zip{
	width:32%;
}
@media (min-width: 375px) {
	.age{
		width:20%;
	}
	.zip{
		width:27%;
	}
}
@media (min-width: 414px) {
	.age{
		width:18%;
	}
	.zip{
		width:25%;
	}
}
@media (min-width: 568px) {
	.date{
		width:27%;
	}
	.time{
		width:23%;
	}
	.time-space{
		padding-left:15px;
	}
}
@media (min-width: 768px) {
	.age{
		width:12%;
	}
	.date{
		width:25%;
	}
	.time{
		width:19%;
	}
}

/* チェックボックス */
input[type="checkbox"]{
	border:1px solid #B6AEA8;
}
@media (max-width: 767px) {
	input[type="checkbox"]{
		width:30px;
		height:30px;
		font-size:200%;
		vertical-align:-7px;
	}
}

/* ラジオボタン */
input[type="radio"]{
	border:1px solid #B6AEA8;
}
@media (max-width: 767px) {
	input[type="radio"]{
		width:30px;
		height:30px;
		-webkit-border-radius: 15px;
		-moz-border-radius: 15px;
		border-radius:15px;
		font-size:200%;
		vertical-align:-7px;
	}
}


/* プライバシー */
#privacy-cont{
	padding-bottom:20px;
}
#privacy-cont p{
	font-size:1.3rem;
}
#privacy-cont a{
	font-weight:bold;
	text-decoration:underline;
}
#privacy-cont a:hover{
	text-decoration:none;
}

/* サブミット */
#submit{
	text-align:center;
	margin-bottom:10px;
}
.submit-button{
   	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	-ms-border-radius: 25px;
	-o-border-radius: 25px;
	border-radius:25px;
   	border:1px solid #5C4239;
	-webkit-box-shadow:0 2px 4px #999,inset 0 1px 0 #FFF;
	-moz-box-shadow:0 2px 4px #999,inset 0 1px 0 #FFF;
	-ms-box-shadow:0 2px 4px #999,inset 0 1px 0 #FFF;
	-o-box-shadow:0 2px 4px #999,inset 0 1px 0 #FFF;
	box-shadow:0 2px 4px #999,inset 0 1px 0 #FFF;
	background:#74534A;
	background:-webkit-linear-gradient( top, #74534A, #8F756D );
	background:-moz-linear-gradient( top, #74534A, #8F756D );
	background:-ms-linear-gradient( top, #74534A, #8F756D );
	background:-o-linear-gradient( top, #74534A, #8F756D );
	background:linear-gradient(to bottom, #74534A, #8F756D);
   	color:#FFF;
   	padding:10px 25px 10px;
   	text-decoration: none;
   	vertical-align: middle;
	font-size:1.7rem;
	font-weight:bold;
	text-shadow:0 -1px 0 #45312C;
	cursor:pointer;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
    transition: 0.5s;
}
.submit-button:hover{
	background:#8F756D;
	background:-webkit-linear-gradient( top, #8F756D, #74534A );
	background:-moz-linear-gradient( top, #8F756D, #74534A );
	background:-ms-linear-gradient( top, #8F756D, #74534A );
	background:-o-linear-gradient( top, #8F756D, #74534A );
	background:linear-gradient(to bottom, #8F756D, #74534A);
   	color: #E3DCDB;
	text-shadow:0 1px 0 #45312C;
}

.back-button{
   	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius:10px;
   	border:1px solid #AAA;
	-webkit-box-shadow:0 2px 4px #999,inset 0 1px 0 #FFF;
	-moz-box-shadow:0 2px 4px #999,inset 0 1px 0 #FFF;
	box-shadow:0 2px 4px #999,inset 0 1px 0 #FFF;
	background:#EEE;
	background:-webkit-gradient( linear, left top, left bottom, from(#EEE), to(#F7F7F8) );
	background:-moz-linear-gradient( center top, #EEE, #FFF );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#EEEEEE', endColorstr='#F7F7F8');
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#EEEEEE, endcolorstr=#F7F7F8))";
	zoom: 1;
   	color: #AAA;
   	padding: 7px 15px 7px;
   	text-decoration: none;
   	vertical-align: middle;
	font-size:1.4rem;
	text-shadow:0 -1px 0 #FFF;
	cursor:pointer;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
    transition: 0.5s;
}
.back-button:hover{
   	border: 1px solid #BBB;
   	text-shadow: #FFF 0 1px 0;
   	background: #FFF;
	background:-webkit-gradient( linear, left top, left bottom, from(#DDD), to(#EEE) );
	background:-moz-linear-gradient( center top, #DDD, #EEE );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#DDDDDD', endColorstr='#EEEEEE');
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#DDDDDD, endcolorstr=#EEEEEE))";
	zoom: 1;
}
.back-button:active {
   	border: 1px solid #BBB;
   	text-shadow: #FFF 0 1px 0;
   	color: #777;
   	background: #DDD;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #BBB), color-stop(1, #DDD) );
	background:-moz-linear-gradient( center top, #BBB, #DDD );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#BBBBBB', endColorstr='#DDDDDD');
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#BBBBBB, endcolorstr=#DDDDDD))";
	zoom: 1;
}
@media (min-width: 568px) {
	#submit{
		margin-bottom:0;
	}
}

/* サンキューページ */
#thanks h4{
	font-size:1.6rem;
	padding:20px 0;
	text-shadow:0 1px 0 #FFF;
}
#thanks h5{
	font-size:1.4rem;
	border-top:dotted 1px #999;
	padding:20px 0 10px;
	text-shadow:0 1px 0 #FFF;
}
#thanks p{
	border-bottom:dotted 1px #999;
	padding:0 0 20px;
	text-shadow:0 1px 0 #FFF;
}
#thanks p a{
	position:relative;
  	display:inline-block;
}
#thanks p a::after{
	content:'';
  	position:absolute;
  	bottom:1px;
  	left:0;
  	width:100%;
  	height:1px;
  	background-color:#333;
  	-webkit-transform:scaleX(1);
  	-moz-transform:scaleX(1);
  	-ms-transform:scaleX(1);
  	-o-transform:scaleX(1);
  	transform:scaleX(1);
	-webkit-transition:ease-in-out 0.3s;
    -moz-transition:ease-in-out 0.3s;
    -ms-transition:ease-in-out 0.3s;
    -o-transition:ease-in-out 0.3s;
    transition:ease-in-out 0.3s;
}
#thanks p a:hover::after{
	-webkit-transform:scaleX(0);
  	-moz--transform:scaleX(0);
  	-ms-transform:scaleX(0);
  	-o-transform:scaleX(0);
  	transform:scaleX(0);
}

p#MicroEngine{
	position:absolute;
	right:12px;
	bottom:5px;
	text-align:right;
	font-size:1.0rem;
	color:#666;
	font-family:'ProximanovaLight';
}
p#MicroEngine a{
	color:#666;
}
p#MicroEngine a:hover{
	color:#BBB;
}