@charset "utf-8";
/* CSS Document */


/*ヘッダー*/
#header{
	width: 100%;
	margin: 0 auto 2em;
	padding: 0;
	text-align: center;
}


/*商品詳細*/
.product-link{
	margin: 0 auto 3em;
	padding: 0;
	width: 93%;
}
.product-link_flex{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.product-link_title{
	margin: 0 0 1em;
	width: 100%;
}
.product-link_btn{
	margin: 0 0 1.5em;
	padding: 0;
	width: 24%;
	flex-shrink: 0;
}

.product_inner{
	margin: 0 auto .3em;
	padding: 0;
	width: 93%;
}


/*フォーム部分*/
.select-product{
	width: 90%;
	margin: 0 auto 3em;
	padding: 0;
}

.product_box{
	width: 100%;
	margin: 0 auto 2.5em;
	padding: 0 0 1.5em;
	border: solid 2px #e50048;
}

.product_title{
	width: 100%;
	margin: 0 auto .5em;
	padding: 0;
	display: flex;
}

.product_no{width: 12%;}
.product_name{width: 88%;}

.product_data{
	width: 95%;
	margin: 0 auto 1.5em;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.product_img{
	width:39%;
	margin: 0 0 .5em;
}



.product_price{
	width: 61%;
	margin: 0 0 .5em;
}

.product_list_h4{
	margin: 0 0 .5em;
	padding: .5em 0;
	width: 100%;
	background: #e50048;
	color: #ffffff; 
	font-size: 110%; 
	text-align: center;
}

.product_list_box{
	margin: 0 auto; 
	padding: .5em 0; 
	width: 90%; 
	font-weight: bold;
	display: flex; 
	justify-content: space-between; 
	align-items: baseline; 
	border-bottom: dashed 1px #cccccc;
}

.product_list_name{
	width: 80%;
	line-height: 1.5em;
}
.product_list_kosu{width: 20%; text-align: right;}

/*商品個数選択*/
.select_kosu{
	margin: 1em 0;
	text-align: right;
	font-size: 120%;
	display: flex;
	justify-content: flex-end;
	align-items:center;
}

.type{
	width: 65%;
	text-align: left;
}


/*プルダウンセレクト*/
.selectwrap1 {
  position: relative;
  width: 3em;
  margin: 0 .5em 0;
}

.selectwrap2 {
  position: relative;
  width: 5em;
  margin: 0 .5em 0;
}

.selectwrap3 {
  position: relative;
  width: 4.5em;
  margin: 0 .5em 0;
}

.selectwrap4 {
  position: relative;
  width: 7em;
  margin: 0 .5em 0;
}

.selectwrap1::after,
.selectwrap2::after,
.selectwrap3::after,
.selectwrap4::after{
	position: absolute;
	top: 30%;
	right: 1px;
	font-family: "Font Awesome 5 Free"; /* Font Awesome を指定 */
	font-weight: bold; /* ここを bold 指定しないと表示されないアイコンがある */
	pointer-events: none; 
	content: "\f0d7"; /* Font Awesome の Unicode */
	color: #58504A;
}

.select-box01{
	appearance: none; /* デフォルトの矢印を消す */
	width: 3em; /* セレクトボックスの幅 */
	background: #ffffff;
	border: solid 1px #666666; /* セレクトボックスのデフォルトの枠線を消す */
	border-radius: 4px;  /* セレクトボックスの四隅の丸み */
	color: #58504A;  /* セレクトボックスの文字色 */
	font-family: 'Kiwi Maru', serif;
	padding: .5em; /* セレクトボックスの内側の余白 */
	cursor: pointer;
	font-size: 110%;
}


.select-box02{
	appearance: none; /* デフォルトの矢印を消す */
	width: 5em; /* セレクトボックスの幅 */
	background: #ffffff;
	border: solid 1px #666666; /* セレクトボックスのデフォルトの枠線を消す */
	border-radius: 4px;  /* セレクトボックスの四隅の丸み */
	color: #58504A;  /* セレクトボックスの文字色 */
	font-family: 'Kiwi Maru', serif;
	padding: .5em; /* セレクトボックスの内側の余白 */
	cursor: pointer;
	font-size: 110%;
}

.select-box03{
	appearance: none; /* デフォルトの矢印を消す */
	width: 4.5em; /* セレクトボックスの幅 */
	background: #ffffff;
	border: solid 1px #666666; /* セレクトボックスのデフォルトの枠線を消す */
	border-radius: 4px;  /* セレクトボックスの四隅の丸み */
	color: #58504A;  /* セレクトボックスの文字色 */
	font-family: 'Kiwi Maru', serif;
	padding: .5em; /* セレクトボックスの内側の余白 */
	cursor: pointer;
	font-size: 110%;
}

.select-box04{
	appearance: none; /* デフォルトの矢印を消す */
	width: 7em; /* セレクトボックスの幅 */
	background: #ffffff;
	border: solid 1px #666666; /* セレクトボックスのデフォルトの枠線を消す */
	border-radius: 4px;  /* セレクトボックスの四隅の丸み */
	color: #58504A;  /* セレクトボックスの文字色 */
	font-family: 'Kiwi Maru', serif;
	padding: .5em; /* セレクトボックスの内側の余白 */
	cursor: pointer;
	font-size: 110%;
}

select:focus {
  outline: none; /* focus 時のデフォルトの枠線を消す */
}
::-ms-expand {
  display: none;  /* IE 対応( select のデフォルト矢印を消す) */
}


/*支払い方法選択*/
.pay-box{
	width: 100%;
	margin: 0 auto 1em;
	padding: 1em 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	background: #fbf5ec;
}

.pay-boxselect_err{
	width: 100%;
	margin: 0 auto 1em;
	padding: 1em 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	background: #ffff00;
	border: solid 2px #ff0000;
}

.pay-title{
	width: 95%;
	margin: 0 auto 1em;
	padding: 0 0 .3em;
	font-size: 120%;
	border-bottom: solid 1px #666666;
}

.selectradio-item {
		margin: 0;
		padding: 0; 
	}
.selectradio {
	width: 100%;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: space-around;
}
.selectradio .selectradio-item {
	margin: 0;
	padding: 0; 
}
.selectradio input[type="radio"] {
display: none; }
.selectradio input[type="radio"]:checked + label {
	background: #fbb03b;
	color: #333333;
	border: 2px solid #f15a24;
}
.selectradio .selectradio-label {
	margin: 0;
	padding:0;
	font-weight: bold;
	background-color: #ffffff;
	border: solid 2px #ccc;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	display: inline-block;

}
.selectradio-inline .selectradio-item {
	width: 43%;
	text-align: center;
	display: inline-block; 
}
.selectradio-inline .selectradio-label {
	display: inline-block;
	width: 100%; 
	vertical-align: middle;
}	


.product_requirement{width: 100%;}
/*注釈*/
/*.annotation{
	margin: 0;
	padding: 0 0 1em;
	text-align: justify;
	font-size: 85%;
	line-height: 1.3em;
	
}*/

.annotation_img{
	width: 100%;
	margin: .5em auto;
	padding: 0;
}

.annotation{
	width: 95%;
	margin: .5em auto;
	padding: 0;
	font-size: 60%;
}



/*カートボックス*/
#cart_box{
	width: 90%;
	margin: 0 auto 2em;
	padding: .5em 0;
	border: solid 1px #999999;
}

.cart_title{
	width: 95%;
	margin: 0 auto .5em;
	padding: .5em 0;
	text-align: center;
	color:#ffffff;
	background: #666666;
	font-size: 130%;
}

.cart-product{
	width: 95%;
	margin: 0 auto 1em;
	padding: 0 0 .5em;
	border-bottom: solid 1px #fbb03b;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.cart-product_l{
	width: 22%;
}

.cart-product_r{
	width: 70%;
}

.cart-product_data{
	width: 100%;
	margin: 0 0 .3em;
	padding: 0;
}

.cart-product_data_item{
	margin: 0 auto 0.3em;
	padding: 0.3em 0 0.3em;
	font-size: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	border-bottom: dashed 1px #cccccc;
}
.item_name{
	width: 40%;
}
.quantity{
	width: 100%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	flex-wrap: wrap;
}

.quantity_title{
	width: 25%;
}

.quantity_select{
	width: 75%;
}
.campaign{
	width: 95%;
	margin: 0 auto;
	padding: 1em 0;
	display: flex;
	justify-content: space-around;
	align-items: center;
	border: solid 3px #fbb03b;
	flex-wrap: wrap;
}

.campaign_title{
	width: 90%;
	margin: 0 auto 0.5em;
	padding: 0 0 0.3em;
	text-align: center;
	border-bottom: solid 1px #666;
	font-size: 130%;
}
.campaign_text{
	font-size: 130%;
	line-height: 1.3em;
}
.benefits{
	font-size: 110%;
	color: #ff0000;
	font-weight: bold;
}





/*注文フォーム*/
#form_box{
	width: 100%;
	margin: 0 auto 2em;
	padding: 1.5em 0;
	background: #f2f2f2;
}


::placeholder {
  color: #cccccc;
}
.form_title{
	width: 95%;
	margin: 0 auto 1.5em;
	padding: 0 0 .3em .5em;
	border-bottom: solid 1px #666666;
}

.form_inner{
	width: 95%;
	margin: 0 auto 1.5em;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

.form_inner02{
	width: 95%;
	margin: 0 auto 1.5em;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
}


.form_item{
	width: 95%;
	margin: 0 auto .3em;
	padding: 0 0 .3em 0;
}

.form_text_s{
	width: 40%;
	margin: 0;
	padding: .5em;
	border: solid 1px #666666;
	border-radius: 5px;
	font-size: 110%;
}

.form_text{
	width: 90%;
	margin: 0 auto;
	padding: .5em;
	border: solid 1px #666666;
	border-radius: 5px;
	font-size: 110%;
}


.req{
	margin-left: 1em;
	padding: .3em;
	font-size: 80%;
	background: #ff0000;
	color: #ffffff;
	border-radius: 6px;
}


.total{
	width: 95%;
	margin: 1.5em auto 0;
	padding: 1em 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: center;
	border: solid 2px #666666;
}

.total_title{font-size: 130%;}
.tota-amount{
	font-size: 130%;
	line-height: 1.3em;
}

#order-details{
	width: 85%;
	margin: 0 auto 2em;
	padding: 1.5em 0;
	border: solid 1px #666666;
	background: #ffffff;
	border-radius: 12px;
}

.customer-data{
	width: 80%;
	margin: 0 auto;
	padding: 0;
	line-height: 1.5em;

}

/*ボタン*/

input[type="submit"] {
	-webkit-appearance: none;
	border-radius: 0;
}
input[type="number"] {
	-webkit-appearance: none;
	border-radius: 0;
}


.btn{
	width: 95%;
	margin: 1em auto;
	padding: 0;
	text-align: center;
}
.submit_btn{
	width: 100%;
	height: 4em;
	font-size: 140%;
	color:#ffffff;
	background: #0071bc;
	display: inline-block;
	vertical-align: middle;
	margin:0 0 2em;
	padding: 0;
	font-weight: bold;
	letter-spacing: 0.5pt;
	text-decoration: none;
	cursor: pointer;
	border: none;
}

.submit_btn02{
	width: 70%;
	height: 3em;
	font-size: 140%;
	color:#ffffff;
	background: #f7931e;
	display: inline-block;
	vertical-align: middle;
	margin:0 ;
	padding: 0;
	font-weight: bold;
	letter-spacing: 0.5pt;
	text-decoration: none;
	cursor: pointer;
	border: none;
}

.return_btn{
	width: 100%;
	height: 4em;
	font-size: 140%;
	color:#666666;
	background: #cccccc;
	display: inline-block;
	vertical-align: middle;
	margin:0 0 2em;;
	padding: 0;
	font-weight: bold;
	letter-spacing: 0.5pt;
	text-decoration: none;
	cursor: pointer;
	border: none;
}

.others_btn{
	width: 60%;
	height: 3em;
	font-size: 130%;
	color:#666666;
	background: #ffffff;
	border: solid 2px #666666;
	display: inline-block;
	vertical-align: middle;
	margin:0 0 2em;;
	padding: 0;
	font-weight: bold;
	letter-spacing: 0.5pt;
	text-decoration: none;
	cursor: pointer;
}

.delete_btn{
	width: 100%;
	margin: 0 auto;
	padding: .3em 0;
	font-size: 90%;
	font-weight: bold;
	display: inline-block;
	text-decoration: none;
	cursor: pointer;
	background: #ffffff;
	border: solid 2px #ed1c24;
	border-radius: 6px;
	color: #ed1c24;
}

.list-link{
	margin: 0 0 2em;
	padding: 0;
	text-align: right;
}
.list-link a{
	color: #737272;
}

/*スピナーボタン*/
.spinner-container {
	margin-bottom: .5em;
	display: flex;
	justify-content: center;
	user-select: none;
	-ms-user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
}

.spinner {
	width: 2em;
	padding: 0;
	text-align: center;
	background: none;
	outline: none;
	pointer-events: none;
	border: solid 1px #1a1a1a;
	font-size: 120%;
}

.spinner::-webkit-inner-spin-button,
.spinner::-webkit-outer-spin-button {
	-webkit-appearance: none;
}

.spinner-sub{
	display: block;
	width: 1.5em;
	text-align: center;
	font-size: 120%;
	line-height: 1.3em;
	border: 1px solid #1a1a1a;
	background: #1a1a1a;
	border-radius: 10% 0 0 10%;
	color:#ffffff;
	cursor: pointer;
	vertical-align: middle;
}

.spinner-add {
	display: block;
	width: 1.5em;
	text-align: center;
	font-size: 120%;
	line-height: 1.3em;
	border: 1px solid #1a1a1a;
	background: #1a1a1a;
	border-radius: 0 10% 10% 0;
	color:#ffffff;
	cursor: pointer;
	vertical-align: middle;
}


.disabled {
	opacity: 0.3;
	cursor: inherit;
}


/*運営者情報*/
.co_date_dt{
	margin: 0 0 .5em;
	padding: 0 0 .3em;
	border-bottom: solid 2px #ff0000;
}

.co_date_dt_span{
	padding: 0 0 0 .3em; 
	font-size: 120%;
	font-weight: bold;
	color: #2E2E2E;
}

.co_date_dd{
	margin: 0 0 3em;
}

.co_date_dd_p{
	width: 95%;
	margin: 0 auto;
	line-height: 1.5em;
	/*text-align: justify;*/
}



/*サンクスページ*/
#thanks{
	width: 90%;
	margin: 0 auto 2em;
}

.ng{
	margin-bottom: 2em;
	font-size: 140%;
	line-height: 1.5em;
}

.ok{
	margin-bottom: 2em;
	font-size: 140%;
	line-height: 1.5em;
}

.caution{
	width: 95%;
	margin: 0 auto;
	padding: 1em 0;
	border: solid 2px #c1272d;
	border-radius: 14px;
}

.caution_title{
	width: 90%;
	margin: 0 auto 0.5em;
	padding: 0 0 .3em 0;
	border-bottom: solid 1px #cccccc;
	font-size: 90%;
	font-weight: bold;
}

.caution_text{
	width: 90%;
	margin: 0 auto 0.5em;
	font-size: 85%;
	line-height: 1.5em;

}

/*ご注文に際してのご注意*/
.guide{
	width: 100%;
	margin: 0  auto 2em;
	padding: 1.5em 0;
	font-size: 120%;
	background: #f2f2f2;
}

.guide_h3{
	width: 95%;
	margin: 0 auto .5em;
	padding: 0 0 .3em .5em;
	border-bottom: solid 1px #666666;
}

.guide_text{
	width: 92%;
	margin: 0 auto;
	padding: 0;
	font-size: 80%;
	line-height: 1.3em;
}


/*footer*/
.footer_link{
	width: 95%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}

.company-name-list{
	width: 98%;
	margin: 0 auto .5em;
	padding: 0 0 .3em;
	font-size: 110%;
	border-bottom: solid 1px #666666;
}

.company-name{
	width: 50%;
	margin: 0 0 1em;
	padding: 0;
}

.admin{
	margin: 0 0 1em;
	padding: 1.5em 0 0;
	text-align: center; 
	border-top:solid 1px #666666;
}

.footer_policy{
	margin: 0 0 2em;
	padding-bottom: 1.5em; 
	border-bottom: solid 1px #666666;
	text-align: left;
}

.footer_policy_link{
	margin: 0 0 0 1em;
	text-decoration: none;
	color: #333333;
}
.footer_policy_link:hover,
.footer_policy_link:active{
	color: #333333;
}

.footer_address{
	width: 100%;
	margin: 0;
	padding: .5em 0;
	text-align:center; 
	font-size: 90%; 
	background: #432107; 
	color: #ffffff;
}

.footer_address address{
	font-style: normal;
}