@charset "utf-8";

/* ------------------------------------------
	- COMMON SETTING
	-
	-
------------------------------------------ */


/* ==============================================================
COMMON SETTING
============================================================== */
#contact header{	width:100%;	height:auto;	padding-top: 60px;}
@media screen and (max-width:750px){
	#contact header{	padding-top: 0; }
}

/*　ENTRY
------------------------------------------------ */
.entry p,.entry p a{	margin:20px auto;	font-size: 14px;}
.entry p.guide_text{	max-width:550px;}
.entry p.guide_text a,.check a{	color: #005ca1;	text-decoration: underline;}
.entry h3{	margin-top:50px;	font-size: 24px;}
.entry a img{	margin:10px auto;}
.entry span.must,.entry_form {
padding:7px 5px;
border-radius: 50%;
background: #de3837;
color: #fff;
font-size: 12px;
display: inline-block;
}
p.required{	font-size: 16px;	letter-spacing: 0.1rem;}
p.required span.must{	letter-spacing: normal;	margin-right: 10px;}

@media screen and (max-width:750px){
	.entry p,.entry p a{	margin:20px auto;	font-size: 14px;}
	.entry p.guide_text{	width:90%; }
	.entry h3{	margin-top:30px;	font-size: 18px;}
	.entry span.must,.entry_form {
		padding:8px 5px;
		font-weight: normal;
		margin-left:15px;
	}
	.entry a img{	width:80%; margin:10px auto;}
}

ul.process{
	width:100%;
	max-width:900px;
  list-style-type: none;
  display:table;
  padding:0;
  margin:0;
  overflow:hidden;
	border-radius: 5px;
}
ul.process li{
	width:30%;
  display:table-cell;
  position:relative;
  background: #eeeeee;
  padding: 1em 0.5em;
}
ul.process li:last-child{ padding-right: 1em;}
ul.process li:last-child:before,
ul.process li:last-child:after{ display:none;}
ul.process li:before,ul.process li:after{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  margin: auto;
}
ul.process li:before,ul.process li:after{
	top:-15px;
	border-style: solid;
	border-width: 45px 0 45px 1.5em;
	z-index: 10;
}
ul.process li:before{
  right:-1em;
  border-color: transparent transparent transparent #fff;
}
ul.process li:after{
  right:-.8em;
  border-color: transparent transparent transparent #eeeeee;
}
ul.process li.current{	background: #de3837;	font-weight: bold;	color: #fff;}
ul.process li.current:after{
  border-color: transparent transparent transparent #de3837;
}

@media screen and (max-width:750px){
	ul.process{	width:95%;	margin:0 auto;}
	ul.process li{
		width:38%;
	  display:table-cell;
	  position:relative;
	  background: #eeeeee;
	  padding: 1em 0 1em 5px;
		font-size: 12px;
	}
	ul.process li:last-child{	width:24%;	padding-right: 0;}
	ul.process li:before,ul.process li:after{
		height:auto;
		top:-8px;
		border-style: solid;
		border-width: 32px 0 32px 1.1em;
		z-index: 10;
	}
	ul.process li:before{
	  right:-.8em;
	  border-color: transparent transparent transparent #fff;
	}
	ul.process li:after{
	  right:-.6em;
	  border-color: transparent transparent transparent #eeeeee;
	}

}


/*　ENTRY FORM
------------------------------------------------ */

.form_entry p{	letter-spacing: normal;	font-size: 14px;}
.form_entry table{
	width:90%;
	margin:20px auto;
}
.form_entry table th,.form_entry table td{
	display: block;
	text-align: left;
	width: 100%;
}
.form_entry table th{
	padding:10px 0 5px;
	font-size: 14px;
	font-weight: bold;
}
.form_entry table td{
	margin-bottom: 15px;
	border-bottom: #b5b5b5 solid 1px;
	padding:5px 0 25px;
	display: block;
}
.form_entry table .flexbox{
	width:100%;
	display: flex;
	align-items: center;
	padding-bottom:8px;
	flex-wrap: wrap;
}
.form_entry table .mail_box{
	/*padding-bottom:0;*/
}
.form_entry table td .kome{	padding:0 5px;}
.form_entry table td .b_size{	padding-bottom:8px;}
.form_entry table td .note{	margin:5px 0 0 0; }
.form_entry table td .note2{	margin:0 15px 0 0; }

@media screen and (min-width:751px){
	.form_entry table{
		margin:40px auto 20px;
		display: flex;
		align-items: center;
	}
	.form_entry table tr{	display: flex; border-top:1px solid #e5e5e5;}
	.form_entry table tr:last-child{border-bottom:1px solid #e5e5e5;}
	.form_entry table th,
	.form_entry table td{	display: block;	text-align: left;	padding:20px 30px;}
	.form_entry table th{	width:280px; display: flex;justify-content: space-between; align-items: flex-start;}
	.form_entry table th span.must{	font-weight: normal;}
	.form_entry table td{	margin-bottom: 0;	border-bottom: 0;}
	.form_entry table p,.form_entry table p a{	margin:0 0 0 10px;	font-size: 14px;}
	.form_entry table td .note{	font-size: 14px; margin-left:10px;}
	.form_entry table td .note2{	margin:0 10px 0 0; }
	.form_entry table td.flexbox{	justify-content: flex-start;	padding-bottom:5px;}
	.form_entry table .mail_box{ padding-bottom:0;}
}

.form_entry input[type="text"].long{	width:100%;}
.form_entry input[type="text"].short{	width:100%;}
.form_entry textarea{ width:100%; }
.form_entry input[type="text"],.form_entry textarea,.form_entry select{
  outline: none;
	font-size: 14px;
  border: 1px solid #b3b3b3;
	padding:10px 0 10px 10px;
	background: #eeeeee;
  -webkit-transition: all .3s;
  transition: all .3s;
	box-sizing:border-box;
	-moz-box-sizing:border-box; /* Firefox */
	-webkit-box-sizing:border-box; /* Chrome, Safari */
	border-radius: 5px;
}
.form_entry input[type="text"]:focus,.form_entry textarea:focus {
  box-shadow: 0 0 7px #87cefa;
  border: 1px solid #87cefa;
	background: #ffffff;
}
/* 送信ボタン */
/* ▼▼ iOSでのデフォルトスタイルをリセット ▼▼ */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration { display: none;}
input[type="submit"]:focus,
input[type="button"]:focus {  outline-offset: -2px;}
/* ▲▲ iOSでのデフォルトスタイルをリセット ここまで ▲▲ */

.form_entry input[type="submit"],
.form_entry input[type="button"],
.thanks .text_area p.btn{
	display: inline-block;
	padding:20px 50px;
	background: #de3837;
	color: #ffffff;
	margin: 40px auto;
	font-size: 16px;
	border-radius: 5px;
}
.form_entry input[type="submit"]:hover,
.form_entry input[type="button"]:hover,
.thanks .text_area p.btn:hover{opacity: 0.8; cursor: pointer;}
/* 送信ボタン - 押せないとき */
.form_entry input[type="submit"][disabled],
.form_entry input[type="submit"][disabled]:hover {
	background-color: #b3b3b3; cursor: default; opacity: 1;}
.form_entry .check{	width:90%; margin:0 auto; padding-top: 0;	text-align: center; line-height: 1.5;}
.form_entry .check a{	padding-left: 5px; font-size: 16px; letter-spacing: normal;}

@media screen and (min-width:751px){
	.form_entry input[type="text"].long{width:400px;}
	.form_entry textarea{width: 504px;}
	.form_entry input[type="text"].short{	width: 300px;}
	.form_entry input[type="submit"],
	.form_entry input[type="button"],
	.thanks .text_area p.btn{	margin: 20px auto;	padding:30px 100px;}
	.form_entry .check,.form_entry .check a{	padding-top: 15px; font-size: 14px}
	.form_entry .check input[type=checkbox] {	transform: scale(1.2);}
	.form_entry .check a:hover{opacity: 0.7;}
}

/* ----- CONFIRM ----- */
.confirm .confirm_area{width:85%; margin:0 auto;}
.confirm .confirm_area table{ width:100%; margin-bottom:3em;}
.confirm .confirm_area p.btn{	text-align: center;	margin:0 auto;}
.confirm .form_entry input[type="submit"],
.confirm .form_entry input[type="button"]{	margin: 10px;}
.confirm .form_entry p.lead,.confirm .form_entry ul.lead li{ font-size: 16px;}

@media screen and (min-width:751px){
	.confirm .confirm_area{ width:700px;}
	.confirm .confirm_area th,.confirm .confirm_area td{ vertical-align: top;}
	.confirm .confirm_area th{margin:0;}
	.confirm .confirm_area table td p.note{width:auto; padding-bottom:0; margin-left: 20px;}
	.confirm .confirm_area p.btn{	text-align: center;}
	.confirm .confirm_area input[type="submit"],
	.confirm .confirm_area input[type="button"]{　margin:20px 10px;}
	.confirm .confirm_area p.knowing{ font-size: 18px; text-align: center; margin-bottom: 2em;}
}

/* ----- THANKS ----- */
.thanks .text_area{	text-align: center;}
.thanks .text_area p.mailer_msg{	width:85%; margin:0 auto;}
.thanks .text_area p.gototop{	margin-top:5em;}

@media screen and (min-width:751px){
	.thanks .text_area{	margin-bottom: 80px;}
	.thanks .text_area p,.thanks .text_area a{	letter-spacing: normal;}
	.thanks .text_area p.mailer_msg{	margin-bottom: 3em;}
}

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

}

/* ==============================================================
	INDEX
============================================================== */

.entry{background: #fff; padding:30px 0;}
.entry .detail p a{ font-size: 40px; }
.entry .detail p.link a{
	font-size: 14px;
	text-decoration: underline;
	color: #005ca1;
}

@media screen and (min-width:751px){
	.entry .detail{width:600px; margin:0 auto;}
}
@media screen and (max-width:750px){
	.entry .detail{width:90%; margin:0 auto;}
	.entry .detail p a{ font-size: 24px; }
}