@charset "utf-8";
/************************************************************
 *
 *	2016/05/30
 *	Form CSS
 *	Auther : KCR Web
 *
 ************************************************************/
/* =========================================================
 Element
========================================================= */
#formarea {
	background: #fff;
}

#formarea .attention {
	color: #e83a4a;
}

#formarea .bold {
	font-weight: bold;
}

#formarea ul.list {
	display: block;
}

#formarea ul.list li {
	list-style-type: disc;
	margin: 0 0 0 25px;
}

#formarea ul.list li.listnone {
	list-style-type: none;
}

/* iPad */
input[type="submit"] ,
input[type="button"] {
	-webkit-appearance: none;
}

/* =========================================================
 Header
========================================================= */
#formarea #header {
	padding: 0;
	margin: 0 auto 30px;
	text-align: center;
	width: 1000px;
}

#formarea #header .title {
	margin: 0 auto 20px;
	padding: 10px 0 0;
}

#formarea #header .phrase {
	margin: 0 auto 30px;
}

#formarea #header .flow {
	margin: 0;
}


/* =========================================================
 Content
========================================================= */
#formarea #content {
	display: block;
	margin: 0 auto 50px;
	padding: 0;
	width: 1000px;
}

#formarea #content #entry-header {
	margin: 0 auto 30px;
}

#formarea #content #entry-header #title {
	background: #e83a4a;
	color: #fff;
	padding: 5px;
	text-align: left;
}

#formarea #content .entry-content {
	display: block;
}

/* Sub Title
--------------------------------------------------------- */
#formarea #content .entry-content h2 {
	color: #e83a4a;
	font-weight: bold;
	font-size: 18px;
	margin: 0 auto 30px;
}

/* 脚注
--------------------------------------------------------- */
#formarea #content .entry-content #footnote {
	display: block;
	margin: 0 auto 30px;
	padding: 0;
}

#formarea #content .entry-content #footnote h3 {
	color: #e83a4a;
	font-weight: bold;
	font-size: 18px;
	margin: 0 auto 10px;
}

#formarea #content .entry-content #footnote .ssl {
	border: 1px solid #035C9f;
	float: right;
	font-size: 14px;
	margin: 0;
	padding: 9px;
	width: 330px;
}

#formarea #content .entry-content #footnote .ssl .left {
	float: left;
	margin: 0 20px 0 0;
	width: 100px;
}

#formarea #content .entry-content #footnote .ssl .left a ,
#formarea #content .entry-content #footnote .ssl .left a img {
	display: inline-block;
	line-height: 1;
	margin: 0;
	padding: 0;
}

#formarea #content .entry-content #footnote .ssl .right {
}

/* 注意書き
--------------------------------------------------------- */
#formarea #content .entry-content #caution {
	float: left;
	margin: 0 auto;
}

#formarea #content .entry-content #caution h3 {
	margin: 0 0 10px;
}

#formarea #content .entry-content .policy a {
	background: #f2f2f2; /* Old browsers */
	background: -moz-linear-gradient(top,  #f2f2f2 0%, #e5e5e5 50%, #cccccc 51%, #d8d8d8 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #f2f2f2 0%,#e5e5e5 50%,#cccccc 51%,#d8d8d8 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #f2f2f2 0%,#e5e5e5 50%,#cccccc 51%,#d8d8d8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#d8d8d8',GradientType=0 ); /* IE6-9 */

	color: #666;
	border: 1px solid #cccccc;
	border-radius: 5px;
	display: inline-block;
	font-weight: normal;
	font-size: 14px;
	padding: 4px 9px;
}

#formarea #content .entry-content .policy a:hover ,
#formarea #content .entry-content .policy a:active {
	background: #cccccc;
	color: #fff;
}

/* お願い
--------------------------------------------------------- */
#formarea #content .entry-content #please {
	margin: 0 auto 10px;
}

#formarea #content .entry-content #please .ssl {
	border: 1px solid #035C9f;
	font-size: 14px;
	margin: 0 auto 10px;;
	padding: 9px;
	width: 800px;
}

#formarea #content .entry-content #please .ssl .left {
	float: left;
	margin: 0 20px 0 0;
	width: 100px;
}

#formarea #content .entry-content #please .ssl .left a ,
#formarea #content .entry-content #please .ssl .left a img {
	display: inline-block;
	line-height: 1;
	margin: 0;
	padding: 0;
}

/* Form
--------------------------------------------------------- */
#form input ,
#form select {
	vertical-align: baseline;
}

#form select {
	font-size: 18px;
	line-height: 1.5em;
	padding: 4px;
	width: 25%;
}

.formlist {
	font-size: 18px;
	margin: 30px auto;
	width: 900px;
}

.formlist .required ,
.formlist .required2 {
	background: #ff3019; /* Old browsers */
	background: -moz-linear-gradient(top,  #ff3019 0%, #cf0404 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ff3019 0%,#cf0404 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ff3019 0%,#cf0404 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); /* IE6-9 */

	color: #fff;
	border-radius: 5px;
	display: inline-block;
	font-size: 12px;
	font-weight: bold;
	float: right;
	margin: 0 5px;
	padding: 3px 10px;
}

.formlist .required2 {
	float: none;
}

.formlist th ,
.formlist td {
	border-bottom: 1px solid #CCC;
	padding: 10px 10px 9px;
	vertical-align: middle;
}

.formlist th {
	background: #e0ffff;
	font-weight: normal;
	text-align: left;
	width: 240px;
}

.formlist th.time {
	background: #fff;
}

.formlist th.none {
	background: #FFF;
	padding: 30px 0 10px;
	text-align: center;
	width: auto;
}

.formlist td.bordernone {
	border: none;
	padding: 10px 10px 0;
}

.formlist td .radio li {
	float: left;
	margin: 0 20px 5px 0;
}

.formlist td .radio2 li {
	float: left;
	margin: 0 10px 5px 0;
	width: 230px;
}

.formlist td .radio2 li span {
	font-size: 14px;
}

.formlist td input[ type="text" ],
.formlist td input[ type="tel" ],
.formlist td input[ type="email" ],
.formlist td input[ type="date" ],
.formlist td input[ type="time" ] ,
.formlist td textarea {
	border: 1px solid #ccc;
	border-radius: 5px;
	font-size: 18px;
	line-height: 1.5em;
	padding: 2px 9px;
}

.formlist td input[ type="date" ],
.formlist td input[ type="time" ] {
	width: 70%;
}

.formlist td label {
	cursor: pointer !important;
}

.formlist td label:hover {
	background: #EEE;
}


/* ---------- Time Info ---------- */
.formlist th.time #timeinfo {
	background: #faf0e6;
	border: 1px solid #ffdab9;
	font-size: 14px;
	margin: 0 auto;
	padding: 10px;
}

.formlist th.time #timeinfo h3 {
	color: #ffa04d;
	font-weight: bold;
	font-size: 22px;
	margin: 0 0 10px;
	text-align: center;
}

.formlist th.time #timeinfo .shoptime {
	margin: 0 auto 10px;
}

.formlist th.time #timeinfo .shoptime dt {
	margin: 0 0 5px;
}

.formlist th.time #timeinfo .shoptime dd {
	margin: 0 0 10px;
}

/* ---------- Form Info ---------- */
#forminfo {
	background: #ffe6ea;
	border: 1px solid #ffc0cb;
	display: block;
	margin: 0 auto 30px;
	padding: 19px;
}

#forminfo h3 {
	color: #ff1493;
	font-size: 20px;
	margin: 0 auto 10px;
}

/* ---------- Validation ---------- */
.formlist .formError.inline {
	display: block;
}

.formlist .formError.inline .formErrorContent {
	display: inline-block;
	font-size: 12px;
	font-weight: bold;
	width: 50%;
}

/* ---------- Calendar 追加 ---------- */
.ui-datepicker {
	z-index: 2000 !important;
}

#datepicker01 ,
#datepicker02 ,
#datepicker03 {
	width: 90%;
}

/* 確認画面
--------------------------------------------------------- */
table.conformlist {
	display: block;
	margin: 0 auto 30px;
	width: 1000px;
}

table.conformlist th ,
table.conformlist td {
	border-bottom: 1px solid #CCC;
	padding: 10px 10px 9px;
	vertical-align: middle;
}

table.conformlist th {
	background: #e0ffff;
	font-weight: normal;
	text-align: left;
	width: 240px;
}

table.conformlist td {
	width: 720px;
}

/*完了画面
--------------------------------------------------------- */
#boxnumber {
	background: #faf0e6;
	border: 1px solid #ffdab9;
	margin: 0 auto 50px;
	padding: 10px;
	width: 600px;
}

#boxnumber h3 {
	color: #ffa04d;
	font-weight: bold;
	font-size: 30px;
	margin: 0 0 10px;
}

/* =========================================================
 Form Button
========================================================= */
/* 共通ボタン
--------------------------------------------------------- */
/* 確認 */
input[type="button"].Confirmation ,
input[type="submit"].Confirmation ,
/* 送信 */
input[type="button"].Transmission ,
input[type="submit"].Transmission ,
/* 訂正 */
input[type="button"].Return ,
input[type="submit"].Return ,
/* エラー */
input[type="button"].Error ,
input[type="submit"].Error {
	border-radius: 5px;
	color: #FFF;
	cursor: pointer;
	display: block;
	font-weight: bold;
	font-size: 20px;
	text-align: center;
	margin: 0 auto;
	padding: 15px 0;
	width: 400px;
}

/* 確認ボタン( Confirmation ) , 訂正ボタン( Return ) , 戻るボタン ( Error )
--------------------------------------------------------- */
input[type="button"].Confirmation ,
input[type="submit"].Confirmation ,
input[type="button"].Return ,
input[type="submit"].Return ,
input[type="button"].Error ,
input[type="submit"].Error {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f7a5a5+0,f27c7e+100 */
	background: #f7a5a5; /* Old browsers */
	background: -moz-linear-gradient(top,  #f7a5a5 0%, #f27c7e 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #f7a5a5 0%,#f27c7e 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #f7a5a5 0%,#f27c7e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7a5a5', endColorstr='#f27c7e',GradientType=0 ); /* IE6-9 */

	border: 1px solid #f16b6d;
	text-shadow: -1px -1px 0 #f16b6d;
}

input[type="button"].Return ,
input[type="submit"].Return {
	padding: 5px 0;
}

input[type="button"].Confirmation:hover ,
input[type="submit"].Confirmation:hover ,
input[type="button"].Return:hover ,
input[type="submit"].Return:hover ,
input[type="button"].Error:hover ,
input[type="submit"].Error:hover {
	background: #f27c7e;
}

input[type="button"].Confirmation:active ,
input[type="submit"].Confirmation:active ,
input[type="button"].Return:active ,
input[type="submit"].Return:active ,
input[type="button"].Error:active ,
input[type="submit"].Error:active {
	background: #f16b6d;
	text-shadow: -1px -1px 0 #f7a5a5;
}

/* 送信ボタン
--------------------------------------------------------- */
input[type="button"].Transmission ,
input[type="submit"].Transmission {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#79d974+0,3bc733+100 */
	background: #79d974; /* Old browsers */
	background: -moz-linear-gradient(top,  #79d974 0%, #3bc733 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #79d974 0%,#3bc733 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #79d974 0%,#3bc733 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#79d974', endColorstr='#3bc733',GradientType=0 ); /* IE6-9 */

	border: 1px solid #3bc733;
	font-size: 20px;
	font-weight: bold;
	text-shadow: -1px -1px 0 #3bc733;
}

input[type="button"].Transmission:hover ,
input[type="submit"].Transmission:hover {
	background: #79d974;
}

input[type="button"].Transmission:active ,
input[type="submit"].Transmission:active {
	background: #3bc733;
	text-shadow: -1px -1px 0 #3bc733;
}