

/*-----------------------------------------------------------------*
	注文流れ
 *-----------------------------------------------------------------*/

#order_flow		{ margin:-30px 0 60px 0; }
#order_flow ul	{ display:flex; width:100%; overflow:hidden; }
#order_flow li	{ width:33.33333%; text-align:center; position:relative; margin:4px 4px 4px 0; }
#order_flow li:last-of-type			{ margin-right:0; }
#order_flow li > *					{ position:relative; padding:1em .8em 1em 2.5em; color:#2c3f4c; background-color:#edeff0; border-color:#edeff0; }
#order_flow li.current > *			{ color:#ffffff; background-color:#96c03d; border-color:#96c03d; }
#order_flow li:first-of-type > *	{ padding-left:1.6em; border-radius:.25em 0 0 .25em; }
#order_flow li:last-of-type > *		{ padding-right:1.6em; border-radius:0 .25em .25em 0; }
#order_flow li::after,
#order_flow li > *::after	{ content:''; position:absolute; top:0; left:100%; content:''; height:0; width:0; border:24px solid transparent; border-right-width:0; border-left-width:20px; }
#order_flow li::after		{ z-index:1; -webkit-transform:translateX(4px); -moz-transform:translateX(4px); -ms-transform:translateX(4px); -o-transform:translateX(4px); transform:translateX(4px); border-left-color:#ffffff; margin:0; }
#order_flow li > *::after	{ z-index:2; border-left-color:inherit; }
#order_flow li:last-of-type::after,
#order_flow li:last-of-type > *::after	{ display:none; }

@media only screen and (max-width: 768px) {
	#order_flow		{ display:none; }
}


/*-----------------------------------------------------------------*
	フォーム
 *-----------------------------------------------------------------*/

.form_title	{ font-size:14px; display:block; width:14em; padding:.3em .5em; text-align:center; background:#139540; color:#fff; margin:3em auto 1.5em auto; letter-spacing:.1em; margin-top:60px; }
.main_exp		{ font-size:18px; text-align:center; line-height:1.8em; }
.main_exp span	{ font-size:14px; line-height:1.2em; }

form h2				{ font-size:30px; margin:30px 0; text-align:center; }
form p.exp			{ text-align:center; }
span.hissu			{ color:#cc0000; margin-right:.5em; display:inline-block; }


.blk_approval				{ border:#cc0000 solid 2px; padding:20px; margin:30px 0 60px 0; }
.blk_approval p				{ text-align:center; line-height:2.0em; }
.blk_approval #check		{ font-size:18px; text-align:center; font-weight:bold; margin-top:10px; padding:10px; color:#cc0000; border-top:solid #ccc 1px; }
.blk_approval #check input	{ margin-right:1em; }
.blk_approval #check:hover	{ background:#efefef; }

table.style01			{ width:100%; border:#ccc solid 2px; border-collapse:collapse; margin:30px 0; }
table.style01 th		{ width:200px; vertical-align:middle; padding:1em; border:#ccc solid 1px; background:#efefef; }
table.style01 td		{ width:560px; vertical-align:middle; padding:1em; border:#ccc solid 1px; }
table.style01 th span	{ color:#cc0000; margin-left:.5em; display:inline-block; }

table.booth_list			{ border:2px solid #ccc; font-size:16px; margin:30px 0; }
table.booth_list th			{ width:75%; padding:1em; vertical-align:middle; text-align:left; border:1px solid #ccc; background:#efefef; }
table.booth_list td			{ width:25%; padding:1em; vertical-align:middle; text-align:center; border:1px solid #ccc; }
table.booth_list tr a:hover	{ background:#efefef; }

table.booth_list th label					{ display:block; padding:1em; }
table.booth_list th label:hover				{ background:#efefef; }

table.booth_list_result		{ border:2px solid #ccc; font-size:16px; margin:30px 0; }
table.booth_list_result th	{ width:75%; padding:1em; vertical-align:middle; text-align:left; border:1px solid #ccc; }
table.booth_list_result td	{ width:25%; padding:1em; vertical-align:middle; text-align:center; border:1px solid #ccc; }
table.booth_list_result tr.thead	{ background:#efefef; }


input, textarea, select	{ border:solid 1px #ccc; padding:.8em; max-width:100%; border-radius:5px; }
input + input			{ margin:.8em 0 0 0; }
select + input			{ margin:.8em 0 0 0; }

table td label			{ display:inline-block; margin-bottom:.4em; }
table td label + label	{ margin-left:2em; }
input[type=checkbox]	{ margin-right:.6em; }
input[type=radio]		{ margin-right:.6em; }

input::placeholder		{ color:#ccc; }

select { width:100px; padding:.5em; }
select + select { margin:.6em 0 0 0; }

#customer_name, #customer_kana, #booth_name, #customer_email
{ width:80%; }
#address_02, #customer_tanto_section, #customer_address2
{ width:60%; }
#customer_address1, #customer_url
{ width:100%; }
#customer_zip, #customer_pref
{ width:30%; }
#customer_tanto_tel, #customer_tanto_mobile, #tanto_fax, #genre_text, #purpose_text, #tel, #name, #tanto
{ width:50%; }

#customer_zip1	{ width:6em; margin:0; }
#customer_zip2	{ width:10em; margin:0; }

#questions	{ width:100%; height:10em; line-height:1.8em; }

.btn_block			{ border-top: solid 1px #f7c200; margin-top:30px; padding:30px 10px; text-align:center; }
.btn_block a		{ display:inline-block; width:300px; margin:0; background:#e0803a; color:#fff; padding:1.2em; text-align:center; border-radius:100px; text-decoration:none; }
.btn_block a.back	{ width:200px; margin:0; background:#ccc; }
.btn_block a:hover	{ background:#f7c200; color:#33322f; }




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

	.main_exp		{ font-size:16px; text-align:left; line-height:1.8em; }
	.main_exp span	{ font-size:14px; line-height:1.2em; }

	table.style01			{ width:100%; border:none; }
	table.style01 th		{ width:100%; display:block; vertical-align:top; padding:.5em 1em; font-weight:bolder; text-align:left; }
	table.style01 td		{ width:100%; display:block; vertical-align:top; padding:.5em 1em 1em .5em; font-weight:normal; }
	table.style01 td label	{ display:block; margin-bottom:.4em; }
	table.style01 td label + label	{ margin-left:0; }
	table.style01,
	table.style01 th,
	table.style01 td		{ border:none; }

	.btn_block			{ border-top: solid 1px #f7c200; margin-top:30px; padding:30px 10px; text-align:center; }
	.btn_block a		{ display:block; width:240px; margin:0 auto; background:#e0803a; color:#fff; padding:1.2em; text-align:center; border-radius:100px; text-decoration:none; }
	.btn_block a.back	{ display:block; width:180px; margin:15px auto 0 auto; background:#ccc; }

}





