@charset "euc-jp";

@media (min-width: 37.5em) {
	/* スマホサイズ以外での適応　*/
}
@media (max-width: 37.5em) {
	/* スマホサイズでの適応　*/
}
/* iOS Safariバグ対応のための設定 */
select span.hide {
	display:none;
}
select span.hide option {
	display:none;
}

body {
	font-family: "Quicksand", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

a {
	color: #036eae;
}

#container {
	color: #000;
	width:auto;
	min-width:320px;
	max-width:1000px;
}

@media (min-width: 37.5em) {
	.sp {display:none;}
}

@media (max-width: 37.5em) {
	.pc {display:none;}
}



#logo {
	width: auto;
	height: auto;
	margin: 10px 0 0;
}
@media (max-width: 37.5em) {
	/* スマホサイズでの適応　*/
	#logo {
		margin-left: 10px;
	}
}

#logo img {
	height:auto;
	width:50%;
	max-width:215px;
	vertical-align: top;
}

div.order_step {
	margin:2em 0;
	text-align:center;
}

div.order_step div.wrapper {
	width:100%;
/*	max-width:700px;*/
	display:inline-block;
	text-align:center;
	border:solid 1px #333333;
/*	border-radius:0.3em;*/
}

div.order_step strong {
	display:block;
	padding:0.2em 0;
	background:#808080;
	color:#fff;
	font-size:1.2em;
	letter-spacing:0.2em;
}

div.order_step ul {
	margin:0.8em 0;
	list-style-type:none;
	text-align:center;
	vertical-align:top;
}

div.order_step li {
	display:inline-block;
	width:15%;
	color:#000;
	background:url(../img/step_arrow.png) no-repeat right 4px;
	background-size:18%;
	opacity:0.3;
	vertical-align:top;
	box-sizing: border-box;
}
@media (max-width: 37.5em) {
	/* スマホサイズでの適応　*/
	div.order_step li {
		width:22%;
		background-size:25%;
	}
}


div.order_step li:last-child {
	background-image:none;
}

div.order_step li.current {
	opacity:1;
	font-weight:bold;
}

div.order_step li span {
	display: block;
	font-weight: bold;
	font-size: 22px;
	line-height: 1.0em;
}

div.order_step li p {
	margin-top:0.4em;
	font-size:12px;
	line-height:1.5;
}

#body {
	text-align:center;
	padding:0 10px;
	font-size: 10px;
}

.title {
	color: #404140;
	font-size: 26px;
	margin: 80px auto 25px;
	line-height: 1.0em;
}
.title div {
	border-bottom: solid 1px #4d4d4d;
	padding: 0 10px 7px;
	display: inline-block;
}
.title span {
	display: inline-block;
	font-weight: bold;
	margin-right: 10px;
	font-size: 1.2em;
	vertical-align: bottom;
}

.title > img {
	height: 30px;
	vertical-align: bottom;
	display: inline-block;
	margin-right: 10px;
}
img.title {
	display:block;
	margin:2em auto;
	max-height:2em;
}

p.info {
/*
	background:url(img/bg_dot_pink.png) repeat 0 0;
*/
	display:inline-block;
	max-width:1000px;
	font-size:14px;
	line-height:1.5;
	letter-spacing:0.1em;
	margin:0 auto;
	text-align:left;
}

p.info span.accent {
	color:#ff0000;
	font-size:0.9em;
}

#step_sub_caution {
	font-size: 1.1em;
	margin-top: 15px;
}
.required_text {
	text-align: center;
	margin-top: 20px;
	font-size: 11px;
}

#main {padding: 0 10px !important;}

#main div.main_title {
	margin:2em 0 1em;
	color:#000;
	font-size:1.6em;
	font-weight:bold;
	line-height:1.7em;
	text-align:center;
}

table.order_cart {
	width:100%;
	max-width:1000px;
	margin-top:1em;
	font-size:1.3em;
	margin:1em auto;
	border-collapse:collapse;
}

table.order_cart thead {
	color:#000;
/*	background:#808080;
}

table.order_cart tr {
/*	border-bottom:dotted 1px #888888;*/
}

table.order_cart th {
	box-sizing: border-box;
	padding:0.5em 4px;
	border: solid 1px #fff;
	border-top: none;
	border-left: none;
	background:#f2f2f2;
}

@media (max-width: 37.5em) {
	/* スマホサイズでの適応　*/
	table.order_cart th.quantity{
		border-right: none;
	}
}

table.order_cart td {
	box-sizing: border-box;
	padding:0.5em 4px;
	line-height:1.5;
	border: solid 1px #fff;
	border-top: none;
	border-left: none;
	background:#f2f2f2;
}

table.order_cart td.name {
	text-align:left;
/*	height: 5em;*/
}
@media (max-width: 37.5em) {
	table.order_cart .order_cart_1 {
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-ms-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		box-lines: multiple;
		box-pack: justify;
	}
	table.order_cart td.name,
	table.order_cart td.price,
	table.order_cart td.quantity {
	}
}

table.order_cart td.price {
	width:90px;
	text-align:right;
/*	height: 5em;*/
}

table.order_cart td.quantity{
	width:80px;
	text-align:right;
/*	height: 5em;*/
}


table.order_cart td.amount{
	width:130px;
	text-align:right;
}

table.order_cart td.amount span.label {
	display:none;
}

table.order_cart tr.postage th
,table.order_cart tr.fee th {
	text-align:right;
}

table.order_cart tr.postage td
,table.order_cart tr.fee td {
	text-align:right;
	font-size:1.1em;
	font-weight:bold;
}

img.arrow_down {
	display:block;
	width:98px;
	margin:1em auto;
}

.order_total {
	font-size: 1.6em;
	text-align: right;
}
.order_total strong {
	font-size: 1.2em;
}
/*
table.order_total {
	margin:auto;
	border:dotted 1px #d7d7d8;
	border-collapse:collapse;
}

table.order_total th {
	padding:0.5em 1em;
	font-size:1.2em;
	background:#fff6cc;
	border-right:dotted 1px #d7d7d8;
}

table.order_total td {
	padding:0.5em 2em;
	font-size:1.5em;
	font-weight:bold;
}
*/
hr.border_single_dot {
	max-width:700px;
	height:1px;
	margin:2em auto;
	border:dotted 0 #888888;
	border-width:1px 0 0 0;
}

.border_double_dot {
	display: block;
	max-width:1000px;
	height:1px;
	margin:3em auto;
	border-top:solid 1px #b3b3b3;
}

ul.step_navi {
	margin:30px auto 60px;
/*
	width:270px;
	text-align:right;
*/
	text-align:center;
	list-style-type:none;
}

ul.step_navi li {
	display: inline-block;
	width: 390px;
	vertical-align: top;
	margin: 0 20px;
}
ul.step_navi li .b_step_navi {
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
	display: block;
	width: 100%;
	position: relative;
	box-sizing: border-box;
	border: solid 1px #333333;
	border-radius: 3px;
	padding: 20px 0px;
	font-size: 1.8em;
	line-height: 1.0em;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
ul.step_navi li .b_step_navi:hover {
	text-decoration: none;
}
ul.step_navi li .step_navi_next {
	background: #6d6c6c;
	color: #fff;
}
ul.step_navi li .step_navi_prev {
	color: #666;
}
ul.step_navi li .step_navi_next:hover {
	background: #999999;
}
ul.step_navi li .step_navi_prev:hover {
	background: #f2f2f2;
}
ul.step_navi li .step_navi_next:before,
ul.step_navi li .step_navi_prev:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -10px;
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    border: 10px solid transparent;
}
ul.step_navi li .step_navi_next:before {
    right: 10px;
    border-left: 10px solid #fff;
}
ul.step_navi li .step_navi_prev:before {
    left: 10px;
    border-right: 10px solid #666;
}
@media (max-width: 37.5em) {
	/* スマホサイズでの適応　*/
	ul.step_navi li {
		width: 90%;
		margin: 7px 0;
	}
	ul.step_navi li .b_step_navi {
		padding: 14px 0;
		font-size: 1.4em;
	}
}




.required {
	color:#f00;
}

.error {
	color:#f00;
}

ul.order_section {
	max-width:1000px;
	margin:auto;
	list-style-type:none;
	font-size:13px;
	line-height:1.5;
}
@media (max-width: 37.5em) {
	/* スマホサイズでの適応　*/
	ul.order_section {
		font-size:1.2em;
	}
}


ul.order_section li {
	margin-top:1em;
	background: #f2f2f2;
/*	border:solid 1px #F95A9A;*/
}

ul.order_section li h3 {
	padding:0.3em 1em;
	background:#808080;
	font-size:1.2em;
	font-weight:bold;
	text-align:left;
	border-bottom: solid 1px #fff;
	color: #fff;
}

ul.order_section li h3 + p {
	margin:1em;
	text-align:left;
}

table.order_detail {
	width: 100%;
/*	max-width:700px;*/
	margin:0;
	background: #f2f2f2;
	border-collapse: collapse;
}

table.order_detail tr:last-child th,
table.order_detail tr:last-child td {
	border-bottom: none;
}

table.order_detail th {
	box-sizing: border-box;
	width: 240px;
	text-align:left;
	padding:0.8em 1em;
	vertical-align:top;
	white-space:nowrap;
	border-right: solid 1px #fff;
	border-bottom: solid 1px #fff;
}
@media (max-width: 37.5em) {
	/* スマホサイズでの適応　*/
	table.order_detail th {
		width: auto;
		border: none;
	}
}

table.order_detail td {
	text-align:left;
	padding:0.8em 1em;
	vertical-align:top;
	border-bottom: solid 1px #fff;
}
@media (max-width: 37.5em) {
	/* スマホサイズでの適応　*/
	table.order_detail td {
		padding-top: 0px;
	}
}


table.order_detail td:first-child {
	padding-top:0;
}

table.order_detail td p {
	margin-top:0.5em;
	margin-bottom:0.5em;
}

table.order_detail input,
table.order_detail select,
table.order_detail textarea {
	padding:0.2em;
	font-size:1.2em;
}

table.order_detail textarea {
	width:100%;
}

table.order_detail .note {
	font-size:.8em;
}

div.supplement {
	margin:1em 1em 0 1em;
	text-align:left;
}

a.button {
	display:inline-block;
	min-width:8em;
	padding:0.5em 2em;
	background:#6d6c6c;
	border:solid 1px #333333;
	border-radius:0.3em;
	color:#fff;
	font-size:1.2em;
	font-weight:bold;
	text-align:center;
	-webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    position: relative;
}
a.button:before {
	content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 5px;
    margin-top: -6px;
    box-sizing: border-box;
    width: 6px;
    height: 6px;
    border: 6px solid transparent;
    border-left: 6px solid #fff;
}

a.button:hover {
	text-decoration: none;
/*	opacity:0.7;*/
	background: #999999;
}

a.button span {
/*
	display:inline-block;
	min-height:19px;
	padding-right:30px;
	background:url(img/icon_button_arrow.png) no-repeat right 50%;
	background-size:19px;
*/
}

div.step_navi_finish {
	margin:2em 0;
}

div.step_navi_finish a {
	margin:0.5em;
}

.button_fomat {

}

.button_fomat {
	font-size: 18px !important;
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	appearance: none;
	display: inline;
	min-width: 300px;
	max-width: 390px;
	position: relative;
	box-sizing: border-box;
	border: solid 1px #333333;
	border-radius: 3px;
	padding: 20px 0px;
	font-size: 1.8em;
	line-height: 1.0em;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	color: #000;
	display: inline-block;
}
.button_fomat:hover {
	text-decoration: none;
	opacity: 1;
	color: #ffffff;
	background-color: #6d6c6c;
}


.cart_ptroduct_quantity {
	position: relative;
	/* padding-left: 10px; */
	/* padding-right: 1.5em; */
	}
	.cart_ptroduct_unit{
		position: relative;
		/* right: -2em; */
	}
	.quantity_box{
	position: relative;
	display: inline-block;
	/* top:1px; */
	width: 5em;
	}
	.products_quantity {
	font-size: .9em;
	display: block;
	border: 1px solid #888;
	background: none;
	text-align: center;
	width: 100%;
	padding: 5px 30px 5px 0;
	margin: 0px;
	z-index: 1;
	}
	.b_minus, .b_plus {
	cursor: pointer;
	position: absolute;
	display: block;
	top: 0px;
	bottom: 0px;
	border: 0px none;
	background: none;
	text-align: center;
	overflow: hidden;
	padding: 0px 5px;
	line-height: 1;
	user-select: none;
	z-index: 2;
	}
	.b_minus {
	left: 0px;
	padding-left: 7px;
	}
	.b_plus {
	right: 0px;
	padding-right: 7px;
	}
	.b_text {
	clip: rect(0px, 0px, 0px, 0px);
	overflow: hidden;
	position: absolute;
	height: 1px;
	width: 1px;
	}
	.icon {
	display: block;
	font-size: 8px;
	width: 10px;
	height: 10px;
	}


	#cart_detail {text-align: right;}
	#cart_product_list {margin-left: auto;font-size: 1.2em;text-align:right;width: 100%;}
	#cart_product_list > tbody > tr {border: 1px solid #ddd;padding: 10px 20px;}
	#cart_product_list > tbody > tr > td {padding: 10px 20px;}
	#cart_product_list table {width: 100%;}
	#cart_product_list small {font-size:.8em;}
	#cart_subtotal {margin-left: auto;font-size: 1.2em;text-align:right;}
	#cart_subtotal td {padding: 5px 20px;}
	.cart_ptroduct_name {width: auto;}
	.cart_ptroduct_quantity {width: 8em;}
	.cart_ptroduct_price {width: 150px;}
	.cart_ptroduct_delete {width: 110px;}
	.cart_order_button_area {
		display: flex;
		justify-content: space-evenly;
		flex-wrap: wrap;
		margin-top: 20px;
	}
	/*
	.cart_order_button {
		margin: 10px 0px;
		min-width: 300px;
		max-width: 390px;
		border-radius : 5%;
		font-size     : 18pt;
		text-align    : center;
		cursor        : pointer;
		padding       : 12px 12px; 
		background    : #999999;
		color         : #ffffff;
		line-height   : 1em;
		transition    : .3s;
		box-shadow    : 2px 2px 5px #666666;
		border        : 2px solid #999999;
	}
	.cart_order_button:hover {
		box-shadow    : none; 
		color         : #999999;
		background    : #ffffff;
	}
	*/
	.cart_order_button {
		display: inline-block;
		vertical-align: top;
		margin: 0 20px;
		background-color: transparent;
		border: none;
		cursor: pointer;
		outline: none;
		padding: 0;
		appearance: none;
		width: 390px;
		position: relative;
		box-sizing: border-box;
		border: solid 1px #333333;
		border-radius: 3px;
		padding: 20px 0px;
		font-size: 18px;
		line-height: 1.0em;
		-webkit-transition: all 0.2s ease;
		-moz-transition: all 0.2s ease;
		-o-transition: all 0.2s ease;
		transition: all 0.2s ease;
	}
	.cart_order_button:hover {
		text-decoration: none;
	}
	.cart_order_button.step_navi_next {
		background: #6d6c6c;
		color: #fff;
	}
	.cart_order_button.step_navi_prev {
		color: #666;
	}
	.cart_order_button.step_navi_next:hover {
		background: #999999;
	}
	.cart_order_button.step_navi_prev:hover {
		background: #f2f2f2;
	}
	.cart_order_button.step_navi_next:before,
	.cart_order_button.step_navi_prev:before {
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		margin-top: -10px;
		box-sizing: border-box;
		width: 10px;
		height: 10px;
		border: 10px solid transparent;
	}
	.cart_order_button.step_navi_next:before {
		right: 10px;
		border-left: 10px solid #fff;
	}
	.cart_order_button.step_navi_prev:before {
		left: 10px;
		border-right: 10px solid #666;
	}
	@media (max-width: 37.5em) {
		/* スマホサイズでの適応　*/
		.cart_order_button {
			width: 90%;
			margin: 7px 0;
			padding: 20px 0;
			font-size: 18px;
		}
	}


	#cart_container {
		display: flex;
	}
	.cart_item_container {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		font-size: 14px;
		text-align:right;
		border: 1px solid #ddd;
		box-sizing: border-box;
		padding: 10px 20px;
		line-height: 1.7em;
	}
	@media (max-width: 37.5em) {
		.cart_item_container {width:94%;margin:auto;}
	}
	.cart_item_row_name {
		flex-basis: auto;
	}
	.cart_item_row_name .note {
		font-size:.8em;
	}

	.cart_item_row_quantity {
		flex-basis: 8em;

	}
	.cart_item_row_price {
		flex-basis: 150px;
	}
	.cart_item_row {
		flex-basis: 8em;
	}
	.link_products_list {
		font-size: .8em;
	}
	@media screen and (max-width: 480px) {
		/* スクリーンサイズが480px以下の場合に適用 */
		
		.cart_item_row_name {
			flex-basis: 98%;
		}
		.cart_ptroduct_name small {
			font-size: .8em;
		}

		.cart_item_row {
			text-align: right;
		}
		.action_button {
			display: inline-block;
			min-width: 100%;
			min-height: 40px;
			margin: 10px 5px;
		}
	} 



/* SP */
@media (max-width: 37.5em) {


table.order_cart {
	width:100%;
	max-width:500px;
}

table.order_cart tr {
	border-bottom:0;
}

table.order_cart thead tr {
/*	border-bottom:dotted 1px #888888;*/
}

table.order_cart th {
	display:inline-block;
}

table.order_cart th.name {
	width:40%;
}

table.order_cart th.price {
	width:29%;
}

table.order_cart th.quantity {
	width:29%;
}

table.order_cart th.amount {
	display:none;
}

table.order_cart td {
	display:inline-block;
}

table.order_cart td.name {
	width:40%;
	text-align:left;
	margin-left: 1%;
}

table.order_cart td.price {
	width:29%;
	text-align:right;
}

table.order_cart td.quantity{
	width:29%;
	text-align:right;
}

table.order_cart td.amount{
	display:block;
	width:98%;
	margin:auto;
	padding-right:1em;
	background:#fff8fa;
	text-align:right;
	font-size:1.1em;
	font-weight:bold;
/*	border-top:dotted 1px #888888;*/
	border-bottom:double 3px #888888;
	background:#f2f2f2;
}

table.order_cart td.amount span.label {
	display:inline-block;
	width:4em;
}

table.order_cart tr.postage
,table.order_cart tr.fee {
	display:block;
	margin-top:0.5em;
	background:#f2f2f2;
}

table.order_cart tr.postage th
,table.order_cart tr.fee th {
	width:8em;
	text-align:center;
	border: none;
}

table.order_cart tr.postage td
,table.order_cart tr.fee td {
	text-align:right;
	border: none;
}
table.order_detail {
	display:block;
	margin:0;
}

table.order_detail tbody {
	display:block;
}

table.order_detail tr {
	display:block;
/*	margin-top:1em;
	padding-top:1em;
	border-top:solid 1px #ccc;*/
}

table.order_detail tr:first-child {
	margin:0;
	padding:0;
	border:0;
}

table.order_detail th {
	display:block;
/*	padding-left:15px;
	background:url(../img/order_form/icon_circle_pink.png) no-repeat 0 0;*/
	text-align:left;
	white-space:normal;
}

table.order_detail td {
	display:block;
	padding-left:3em;
	text-align:left;
}

table.order_detail td.textarea {
	padding-left:0;
}

table.order_detail td.textarea textarea{
	width:100%;
}

table.order_detail input + p,
table.order_detail select + p,
table.order_detail textarea + p {
	margin-top:0.5em;
}

table.order_detail select + input,
table.order_detail select + div {
	margin-top:0.5em;
}


}/* SP */
