@charset "utf-8";

/* ========================= */
/* 							 */
/* 	wbl order_f CSS：フォーム専用 */
/* 	last update 241030		 */
/* 							 */
/* ========================= */




/* init：
-------------------------------------------- */

body {
	font-family: "Lucida Grande", "segoe UI", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Verdana, Arial, sans-serif;
	font-size: 0.75rem;
	color: #292424;
	}
em {
	font-style:normal;
	}


/* header@：
---------------------------------------------------- */
.s-header_wrap {
}
@media screen and (max-width: 1200px) {
	.s-header_wrap___ {
	}
}
@media screen and (max-width: 768px) {
	}
}
@media screen and (max-width: 375px) {
	.s-header_wrap___ {
	}
}




/* set@：section
---------------------------------------------------- */



/* navigation@：navg
---------------------------------------------------- */



/* p-cover@：
---------------------------------------------------- */



/* entryセクション： wbl order
---------------------------------------------------- */



/*-- order common --*/

.button_normal {
	-webkit-transition: all 200ms ease;
			transition: all 200ms ease;
	}

.show {
	opacity: 1;
	}
.hide {
	opacity: 0;
	pointer-events: none;
	}


/*-- modal --*/

#dia-overlay{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.0);
	z-index: 9999;
	}
#dia-confirm{
	display: none;
	opacity: 0;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: white;
	padding: 20px;
	z-index: 10000;
	}
#dia-overlay.onApply{
	display: block;
	background-color: rgba(0, 0, 0, 0.5);
	}
#dia-confirm.onApply{
	display: block;
	opacity: 1;
	}
.onApply{
	-webkit-transition: all 1000ms ease;
			transition: all 1000ms ease;
	}

.modal-open{
	position: fixed;
	top: 50%;
	left: 50%;
	font-size: 16px;
	font-weight: bold;
	width: 300px;
	height: 60px;
	color: #fff;
	background: #000;
	border: none;
	cursor: pointer;
	translate: -50% -50%;
	}

/* モーダルと背景の指定 */
.modal{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background: rgba(0,0,0,50%);
	padding: 40px 20px;
	overflow: auto;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
	box-sizing: border-box;
	}

/* モーダルの擬似要素の指定 */
.modal:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
	margin-left: -0.2em;
	}

/* クラスが追加された時の指定 */
.modal.is-active{
	opacity: 1;
	visibility: visible;
	}

/* モーダル内側の指定 */
.modal-container{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	max-width: 600px;
	width: 90%;
	}

/* モーダルを閉じるボタンの指定 */
.modal-close{
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	top: -20px;
	right: -20px;
	width: 40px;
	height: 40px;
	color: #fff;
	background: #000;
	border-radius: 50%;
	cursor: pointer;
	}

/* モーダルのコンテンツ部分の指定 */
.modal-content{
	background: #fff;
	text-align: left;
	line-height: 1.8;
	padding: 20px;
	}

/* モーダルのコンテンツ部分のテキストの指定 */
.modal-content p{
	margin: 1em 0;
	}



/*-- order form check --*/

/* coution */
.secForm > .message {
	margin: 20px 0 0;
	padding: 20px 0px;
	border-radius: 10px;
	/* box-shadow: 0 2px 6px #00000026; */
	background-color: #c3fbfa;
	}
.secForm .notice.blk {
	display: block;
	}
.secForm .notice {
	margin: 20px 0 0;
	font-size: 0.8rem;
	text-align: center;
	}
@media screen and (max-width: 768px) {
	.secForm .notice {
		font-size: calc(0.625rem + ((1vw - 3.75px) * 0.7124681934));
		min-height: 0vw;
	}
}
@media screen and (max-width: 375px) {
	.secForm .notice {
		font-size: 10px;
	}
}

.secForm .notice.lv1.blk {
	width: 100%;
	padding: 6px 0;
	margin: 60px 0px 0;
	/* max-width: 1000px; */
	background: #BCA585;
	color: #ffffff;
	}
.zeromail span.error,
.secForm > .message.error {
	display: block;
	margin: 1.5em 50px;
	padding: 1.5em 0;
	background-color: #f7a499;
	border: solid 1px #e16c48;
	text-align: center;
	color: #181710;
	}

.secForm .prcSet {/* 枠＞料金合計 */
	margin: 60px 0 0;
	}
.secForm .prcSet .prc {/* 枠＞料金合計 */
	justify-content: flex-end;
	align-items: center;
	}
.secForm #orderPrcB .otsVw01 {/* 料金合計 */
	font-size: 2rem;
	}

/* check text flame */
.secForm .f_check {
	margin: 1.5em 0px;
	}
#confirm {/* outerFlame */
	padding: 40px 20px 0;
	border-radius: 0 0 10px 10px;
	/* border-top: 2px solid #49AD3D; */
	box-shadow: 0 2px 6px #00000026;
	box-sizing: border-box;

	background: #fff;
	overflow: hidden;
	}
#confirm .orderInfo {/* shiptoFlame */
	margin: 40px 0 0;
	padding: 40px 0;
	border-radius: 0 0 10px 10px;
	border-top: 2px solid #72cdc8;
	box-sizing: border-box;

	overflow: hidden;
	}

#container .orderInfo h1, #container .orderInfo h2 {
	display: block;
	}
#container .orderInfo h2:after {
	content: " 様";
	}
#confirm .shipto .dataF {/* shiptoFlame */
	display: flex;
	gap: 2px;
	}
#confirm .shipto .dataF .title {/* shiptoFlame */
	width: calc(30% - 4px); /* margin padding分を引く */	
	}
#confirm .shipto .dataF .data {/* shiptoFlame */
	width: calc(70% - 4px); /* margin padding分を引く */	
	}

/* #confirm .orderInfo .order {shiptoFlame */
#confirm .orderInfo .order ul {/* shiptoFlame */
	display: flex;
	flex-wrap: wrap;

	padding: 0;
	}
#confirm .orderInfo .order .item p > em,
#confirm .orderInfo .order .item p > span {
	display: block;
	width: auto;
	text-align: left;
	}
/* bottle(order) */
#confirm .orderInfo .order .item {
	border-radius: 0 0 10px 10px;
	box-shadow: 0 2px 6px #00000026;
	}
#confirm .orderInfo .order .item.Sml,
#confirm .orderInfo .order .item.Med,
#confirm .orderInfo .order .item.Lng,
#confirm .orderInfo .order .item.Lag,
#confirm .orderInfo .order .item.Smlrsn,
#confirm .orderInfo .order .item.Bigrsn {
	width: calc(25% - 20px); /* margin padding分を引く */
	margin: 20px 10px 0;
	padding: 28px 10px;
	}
#confirm .orderInfo .order .item.Plt,
#confirm .orderInfo .order .item.Gft,
#confirm .orderInfo .order .item.Swg {
	width: calc(33% - 20px); /* margin padding分を引く */
	margin: 20px 10px 0;
	padding: 12px 10px;
	}
#confirm .orderInfo .order .item .op04 {
	opacity: 0.4;
	}
#confirm .order .item .label {
	/* font-size: 1.1rem; */
	font-weight: bold;
	}
#confirm .order .item .Num {
	margin: 6px 0 0;
	}
/* bottle opt */
#confirm .orderInfo .order .item.Detail,
#confirm .orderInfo .order .item.Detailrsn {
	width: calc(100% - 20px); /* margin padding分を引く */
	/* margin: 20px 10px 0; */
	margin: 0px 10px 0;
	padding: 20px 10px;
	}
#confirm .orderInfo .order .item.Detail,
#confirm .orderInfo .order .item.Detailrsn {
	box-shadow: none;
	}
#confirm .orderInfo .order .item.Detail .value,
#confirm .orderInfo .order .item.Detailrsn .value {
	display: block;
	text-indent: 0px;
	}
#confirm .orderInfo .order .item.Sb {/* オーダー */
	/* width: calc(33% - 20px); /* margin padding分を引く */ */
	width: 100px;
	margin: 20px 10px 0;
	padding: 20px 10px;
	}
#confirm .orderInfo .order .item.Sb {/* オーダー */
	box-shadow: none;
	}
#confirm .item .Ttl .value::before {
	content: '：¥';
	}
#confirm .item.Sb .Ttl .value {
	/* font-size: 1.2rem; */
	/* font-weight: bold; */
	}
/* option */
#confirm .orderInfo .opt {
	margin: 20px 10px 0;
	}
#confirm .orderInfo .opt .optP > p {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	}
#confirm .orderInfo .opt .optP > p > span {
	width: calc(33% - 2px);
	margin: 10px 0px 0;
	padding: 0px 0px;
	}
#confirm .orderInfo .opt .optP .optframe {
	padding: 4px 20px;
	border: 1px solid #c3c3c3;
	}
#confirm .orderInfo .opt > div {/* option parts frame */
	padding: 12px;
	border: solid 1px #c3c3c3;
	}
#confirm .orderInfo .opt > div + div {/* option parts frame */
	margin: 20px 0px 0;
	}
#confirm .orderInfo .opt p .optframe,
#confirm .orderInfo .opt p .optframe > span {
	display: block;
	}


#orderPrcA_val {/* 料金合計（再表示枠） */
	width: 100%;
	margin: 60px 0 0;
	text-align: center;
	}
#orderPrcA_val .oPAv:before {
	content: "料金合計：￥ ";
	font-size: 1rem;
	}
#orderPrcA_val .oPAv {
	font-size: 2rem;
	}
#orderPrcA_val .oPAv > span {/* comment */
	font-size: 0.8rem;
	}



/* css disable：https://qiita.com/misodonkatsu/items/44c79dfcc534ab1ff7d8 */
.fOO_pt .iOrder {
	cursor: not-allowed; /* It Works! */
	}
.fOO_pt .iOrder .disabled {
	pointer-events: none;
	}
.button___ {
    display: flex;
    justify-content: center;
    font-family: 'Noto Sans JP', sans-serif;
    margin: 50px 0 0;
    /* text-align: right; */
}





/*-- 
order form
 --*/

/*-- order form frame(main) --*/
.inputF .fO_title,
.inputF .fOR_title {
	display: block;
	margin: 20px 20px 0;
	padding: 50px 0 0;
	border-top: 1px solid #cdd8eb;
	font-size: 1rem;
	text-align: center;
	}
.inputF .fOrder .fO_ptSub,
.inputF .fOrder_resin .fOR_ptSub {
	width: 100%;
	padding: 6px 0;
	margin: 20px 20px 0;
	max-width: 1000px;
	}
.inputF .fOrder .fO_ptSub .taLabel.blk,
.inputF .fOrder_resin .fOR_ptSub .taLabel.blk {
	display: block;
	width: 100%;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 600;
	text-align: center;
	}

.button_normal {
	position: absolute;
	top: -10px;
	right: 0;
	width: 100%;
	max-width: 250px;
	margin: 0 0 0 20px;
	padding: 10px 20px;
	background-color: #9A9494;/* gray */
	background-color: #d9d4c4;
	line-height: 1.4;
	color: #ffffff;
	font-size: 1.0rem;
	cursor: pointer;
	font-family: 'Noto Sans JP', sans-serif;
	}
.button_normal:hover {
	color: #9f9f9f;
	background-color: #f0ede3;
	}
.button_not span {/* iMax end */
	display: block;
	width: 100%;
	margin: 0 0 0 0px;
	padding: 10px 20px;
	background-color: #9A9494;
	background-color: #d9d4c4;
	line-height: 1.4;
	color: #ffffff;
	font-size: 1.0rem;
	text-align: center;
	font-family: 'Noto Sans JP', sans-serif;
	}

/*-- order form frame(opt) --*/
.inputF .fOrder_opt .fOO_title {
	display: block;
	margin: 20px 20px 0;
	padding: 20px 0 0;
	border-top: 1px solid #cdd8eb;
	font-size: 1rem;
	text-align: center;
	}
.inputF .fOrder_opt .fOO_img {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	margin: 20px 20px 0;
	padding: 0 0;
	}
.inputF .fOrder_opt .fOO_img .figure {
	text-align: center;
	}
.inputF .fOrder_opt .fOO_img .figcaption {
	display: block;
	margin-top: 10px;
	}
.inputF .fOrder_opt .fOO_pt {
	flex-wrap: wrap;
	justify-content: center;
	padding: 24px;
	border: solid 1px #c3c3c3;
	}
@media screen and (max-width: 656px) {
	.inputF .fOrder_opt .fOO_pt {
		padding: 8px;
		}
}

.inputF .fOrder_opt .fOO_pt.frPlate [type="number"].itNum,
.inputF .fOrder_opt .fOO_pt.frGift [type="number"].itNum {
	background: transparent;
	}
.inputF.cb .orderInfo > .fButt_sub[data-process="del"] {
	position: absolute;
	top: 0;
	right: 0;
	padding: 7px 10px;
	cursor: pointer;
	background-color: #e2e2e2;
	-webkit-transition: all 300ms ease-in;
			transition: all 300ms ease-in;
	}
.inputF.cb .orderInfo > .fButt_sub[data-process="del"]:hover {
    color: #ffffff;
	background-color: #9A9494;
	-webkit-transition: all 300ms ease-in;
			transition: all 300ms ease-in;
	}

/*-- order form init(ow) --*/
.f_info [type="text"], .f_info [type="email"], .f_info [type="tel"], .f_info [type="password"], .f_info textarea {
	padding: 4px 10px;
	font-size: calc(0.625rem + ((1vw - 3.75px) * 1.0178117048));
	}
@media screen and (max-width: 768px) {
	.f_info [type="text"], .f_info [type="email"], .f_info [type="tel"], .f_info [type="password"], .f_info textarea {
		font-size: calc(0.625rem + ((1vw - 3.75px) * 1.0178117048));
		min-height: 0vw;
	}
	.f_info > p:nth-of-type(2) .inpTt, .f_info > p:nth-of-type(3) .inpTt, .f_info > p:nth-of-type(4) .inpTt, .f_info > p:nth-of-type(5) .inpTt, .f_info > p:nth-of-type(6) .inpTt, .f_info > p:nth-of-type(7) .inpTt, .f_info > p:nth-of-type(8) .inpTt {
		max-width: 100px;
	}
	.inputF.cb .orderInfo > span:nth-of-type(3) .cbLb, .inputF.cb .orderInfo > span:nth-of-type(4) .cbLb, .inputF.cb .orderInfo > span:nth-of-type(5) .cbLb, .inputF.cb .orderInfo > span:nth-of-type(6) .cbLb, .inputF.cb .orderInfo > span:nth-of-type(7) .cbLb {
		max-width: 100px;
	}
}
@media screen and (max-width: 375px) {
	.f_info [type="text"], .f_info [type="email"], .f_info [type="tel"], .f_info [type="password"], .f_info textarea {
		font-size: 10px;
	}
}
.f_info textarea {
	margin: 20px 0px 0px;
	}

.f_info .inpTt > label,
.f_info .orderInfo label {/* require base */
	position: relative;
	}
.f_info .inpTt > label .require,
.f_info .orderInfo label .require {/* require parts */
	display: none;
	position: absolute;
	top: 0;
	left: -10px;
	color: #740c0e;
	}
@media screen and (max-width: 768px) {
	.f_info .inpTt > label,
	.f_info .orderInfo label {
		font-size: calc(0.625rem + ((1vw - 3.75px) * 0.5089058524));
		min-height: 0vw;
	}
}
@media screen and (max-width: 375px) {
	.f_info .inpTt > label,
	.f_info .orderInfo label {
		font-size: 10px;
	}
}
/* require 指定＠基本情報用 */
.f_info .inpTt [for="lastname"] .require,
.f_info .inpTt [for="lastnameKana"] .require,
.f_info .inpTt [for="email"] .require,
.f_info .inpTt [for="tel"] .require,
.f_info .inpTt [for="datepicker"] .require {
	display: block;
	}
/* require 指定＠お届け先用 */
.f_info .orderInfo .sp_name .require,
.f_info .orderInfo .sp_zipcode .require,
.f_info .orderInfo .sp_pref .require,
.f_info .orderInfo .sp_address .require,
.f_info .orderInfo .sp_address2 .require {
	display: block;
	}
.f_info .orderSwag .order_ex {
	display: block;
	margin: 20px 0 0;
	text-align: center;
	}
.inputF .fOrder .specifications,
.inputF .fOrder_resin .specifications {
	width: 100%;
	text-align: center;
	color: #7e7e7e;
	}
.inputF .fOrder .itPrice_fl input,
.inputF .fOrder_resin .itPrice_fl input,
.inputF .fOrder_opt .itPrice_fl input {
	padding: 0;
	width: auto;
	max-width: 70px;
	background: transparent;
	font-family: 'Noto Serif JP', sans-serif;
	font-size: 16px;
	}
.inputF .fOrder .itNum.btl,
.inputF [type="number"] {
	border: 0;
	margin: 0 6px;
	padding: 10px 12px;
	font-size: 16px;
	background: #ffffff;
	border-radius: 6px;
	font-family: 'Noto Sans JP', sans-serif;
	}
.inputF .fOrder_opt + .fOrder_opt > .taLabel.blk {
	display: block;
	width: 100%;
	margin: 30px 0 0;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 600;
	text-align: center;
	}
.inputF .fOrder_opt + .fOrder_opt > .taLabel.blk .laPrice {
	display: block;
	font-family: 'Noto Serif JP', sans-serif;
	font-size: 16px;
	font-weight: 300;
	text-align: center;
	}
.inputF .fOrder_opt + .fOrder_opt > .taLabel.blk .laPrice .laPriceYen {
	font-family: "Lucida Grande", "segoe UI", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Verdana, Arial, sans-serif;
	}
/*-- order form radio --*/
.inputF .orderSwag [type=radio] {
	display: none; /* ラジオボタンを非表示にする */
	}
.inputF .fOrder_opt.orderSwag .order_radio {
	display: flex;
	justify-content: center;
	gap: 6px;
	}
.inputF .fOrder_opt.orderSwag .order_radio .taLabel.blk {
	display: flex;
	align-items: center;
	gap: 0 .5em;
	position: relative;
	max-width: 200px;
	margin-bottom: .4em;
	padding: .5em .7em;
	border: 1px solid #d9d4c4;
	border-radius: 3px;
	background-color: #f0ede3;
	cursor: pointer;
	}
.inputF .fOrder_opt.orderSwag .order_radio .itRdi:checked + .taLabel.blk {
	background-color: #d9d4c4;
	color: #fff;
	-webkit-transition: all 300ms ease-in;
			transition: all 300ms ease-in;
	}
.inputF .fOrder_opt .frSwag .iOrder select {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	position: relative;
	margin: 0px 10px 0px 0px;
	padding: 0 10px;
	height: 40px;
	font-size: 16px;
	font-family: 'Noto Sans JP', sans-serif;
	color: #333;
	border: none;
	border-radius: 5px;
	background: #d9d4c4;
	}

.inputF .fOrder_opt .fButt_sub[data-process="onoff"],
.inputF .fOrder_opt .fButt_sub[data-process="onoff_only"] {
    width: 100%;
    margin: 0 0 10px 0px;
    padding: 10px 20px;
    line-height: 1.4;
    cursor: pointer;
    background-color: #9A9494;
    color: #ffffff;
    font-size: 1.0rem;
    font-family: 'Noto Sans JP', sans-serif;
	-webkit-transition: all 300ms ease-in;
			transition: all 300ms ease-in;
	}
.inputF .fOrder_opt .fButt_sub[data-process="onoff"]:hover,
.inputF .fOrder_opt .fButt_sub[data-process="onoff_only"]:hover {
	color: #9f9f9f;
	background-color: #e2e2e2;
	-webkit-transition: all 300ms ease-out;
			transition: all 300ms ease-out;
	}

/*-- order form option --*/
.inputF .fOrder_opt .paneOptL {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: none;
	margin: 0 0 10px 0px;
	}
.inputF .fOrder_opt .paneOptL .order_ex {
	display: block;
	margin: 10px 0 0 0;
	}
@media screen and (max-width: 768px) {
	.inputF .fOrder_opt .paneOptL .order_ex {
		font-size: calc(0.625rem + ((1vw - 3.75px) * 0.5089058524));
		min-height: 0vw;
	}
}
@media screen and (max-width: 375px) {
	.inputF .fOrder_opt .paneOptL .order_ex {
		font-size: 10px;
	}
}

.inputF .fOrder_opt .paneOptL .iPrice.blk {
	margin: 10px 0 0 0;
	}
.inputF .fOrder_opt .paneOptL .itNum::-webkit-inner-spin-button,
.inputF .fOrder_opt .paneOptL .itNum::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
	-moz-appearance:textfield;
	}

.inputF .fOrder_opt .optFl {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	}
.inputF .fOrder_opt .optFl .fButt_sub[data-process="del"] {
	position: absolute;
	top: 0;
	right: 0;
	padding: 4px 10px;
	cursor: pointer;
	background-color: #e2e2e2;
	-webkit-transition: all 300ms ease-in;
			transition: all 300ms ease-in;
	}
.inputF .fOrder_opt .optFl .fButt_sub[data-process="del"]:hover {
	color: #9f9f9f;
	-webkit-transition: all 300ms ease-out;
			transition: all 300ms ease-out;
	}
.f_info > p.payment {
	display: flex;
	gap: 6px;
	align-items: center;
	width: 100%;
	max-width: 600px;
	margin: 68px auto 0;
	}
.f_info > p.payment select#payment {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	position: relative;
	margin: 0px 10px 0px 0px;
	padding: 0 10px;
	height: 40px;
	font-size: 16px;
	font-family: 'Noto Sans JP', sans-serif;
	color: #333;
	border: none;
	border-radius: 5px;
	background: #d9d4c4;
	}



/* option plate form */
.inputF .fOrder_opt .optFl.omit .optFl_sect {
	opacity: 0.2;
	}
.inputF.cb .optFl_sect {
	display: block;
	width: 100%;
	margin: 0px 0 10px;
	padding: 16px 10px ;
	border: 4px solid #d9d4c4;
	border-radius: 10px 10px 0px 10px;
	position: relative;
	-webkit-transition: all 1000ms ease;
			transition: all 1000ms ease;
	}
.inputF.cb .optFl_sect + .optFl_sect {
	padding: 40px 10px 16px;
	}
.inputF.cb .optFl_sect .iTitle,
.inputF.cb .optFl_sect .cbfoLb {
	display: block;
	margin: 10px 0 0 0;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 600;
	text-align: center;
	width: 20%;
	max-width: 10rem;
	min-width: 6rem;
	}

.inputF.cb .optFl_sect > span.blk {
	display: flex;
	width: 100%;
	max-width: none;
	}
.inputF.cb .optFl_sect > span.blk + span.blk {
	margin: 10px auto 0;
	}
.inputF.cb .optFl_sect > span.blk select {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	position: relative;
	margin: 0px 10px 0px 0px;
	padding: 0 10px;
	height: 40px;
	font-size: 16px;
	font-family: 'Noto Sans JP', sans-serif;
	color: #333;
	border: none;
	border-radius: 5px;
	background: #d9d4c4;
	}
.inputF.cb .optFl_sect > span.blk > select {
	/* width: 300px; */
	width: 26%;
	max-width: 14rem;
	min-width: 6rem;
	}
.inputF.cb .optFl_sect > span.blk .postIn {
	display: flex;
	flex: 1;
	width: 52%;
	}
.inputF.cb .optFl_sect > span.blk .postIn input {
	height: 100%;
	}

.inputF.cb .optFl_sect > span.blk .postIn .optInputymd {
	position: relative;
	width: 1rem;
	margin: 0 1.5rem 0 0px;
	text-align: center;
	font-size: 1.0rem;
	color: #838383;
	}

.inputF.cb .optFl_sect > span.blk .postIn .optInputymd span {
	position: absolute;
	top: 50%;
	transform:  translateY(-50%);
	}
.inputF.cb .optFl_sect > span.blk .postIn .optInputand {
	margin: 0 8px;
	font-size: 1.4rem;
	color: #838383;
	}
.inputF.cb .optFl_sect > span.blk .postIn::after {
	}

/* validation message frame */

.inputF .dataFr {/* name innerFr */
	position: relative;
	width: 100%;
	}
.inputF .dataFr .valiMsg {/* error msg  */
	position: absolute;
	top: 22px;
	right: 0px;
	width: 100%;
	font-size: 0.7rem;
	color: red;
	letter-spacing: 0rem;
	z-index: 10;
	}
.inputF.cb .dataFr .valiMsg {/* error msg @ option */
	position: absolute;
	top: 30px;
	right: 0px;
	}
.inputF .dataFr .valiMsg::before {/* error msg kome */
	content: '※';
	}
.inputF .oTitPlate .dataFr {/* name innerFr */
	width: 100%;
	}

.inputF.cb .optFl_sect > span.blk .postIn .dsb,
.inputF .dataFr .dsb {
	opacity: 0;
	-webkit-transition: all 1000ms ease;
			transition: all 1000ms ease;
	}
.inputF.cb .optFl_sect > span.blk .postIn .notdsb,
.inputF .dataFr .notdsb {
	opacity: 1;
	-webkit-transition: all 1000ms ease;
			transition: all 1000ms ease;
	}
/* .inputF.cb .optFl_sect > span.blk .postIn input.notdsb, */
.inputF .dataFr input.notdsb {
	background: #ffffff;
	}




.inputF.cb .optFl_sect > span.blk select.___omit {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 600;
	}
.inputF.cb .optFl_sect > span.blk select[selected][disabled] {
	display: none;
	}
@media screen and (max-width: 768px) {
	.inputF.cb .optFl_sect > span.blk > select {
		font-size: calc(0.625rem + ((1vw - 3.75px) * 1.5267175573));
		min-height: 0vw;
	}
}
@media screen and (max-width: 375px) {
	.inputF.cb .optFl_sect > span.blk > select {
		font-size: 10px;
	}
}

@media screen and (max-width: 656px) {
	.inputF.cb .optFl_sect .iTitle {
		width: 100%;
		max-width: none;
		margin: 0px 0 2px 0;
		text-align: left;
		}
	.inputF.cb .optFl_sect > span.blk {
		flex-wrap: wrap;
		}
	.inputF.cb .optFl_sect > span.blk + span.blk {
		margin: 4px auto 0;
		}
	.inputF.cb .optFl_sect > span.blk select {
		margin: 0px 0px 0px 0px;
		}
	.inputF.cb .optFl_sect > span.blk > select {
		width: 50%;
		max-width: none;
		min-width: 6rem;
		}
	.inputF.cb .optFl_sect > span.blk .postIn {
		flex: 0 1 auto;
		width: 100%;
		margin: 4px 0 0;
		}
	.inputF.cb .optFl_sect > span.blk:nth-child(2) .postIn {/* 日付 */
		flex-wrap: wrap;
		flex: 0 1 auto;
		margin: 4px 0 0;
		width: 100%;
		}
	.inputF.cb .optFl_sect > span.blk .postIn .optInputymd {
		width: 0.5rem;
		margin: 0 1rem 0 0px;
		}
}


.inputF.cb .orderGift {
	display: flex;
	justify-content: center;
	padding: 24px 0;
	margin: 24px 20px 0;
	max-width: 1000px;
	border-top: 1px solid #cdd8eb;
	border-bottom: 1px solid #cdd8eb;
	font-family: 'Noto Sans JP', sans-serif;
	}
.inputF.cb .orderGift > span.blk select {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	position: relative;
	margin: 0px 10px 0px 0px;
	padding: 0 10px;
	height: 40px;
	font-size: 16px;
	font-family: 'Noto Sans JP', sans-serif;
	color: #333;
	border: none;
	border-radius: 5px;
	background: #d9d4c4;
	}



.butt_optUtil {
	display: block;
	position: relative;
	width: 100%;
	}

/*---- フォーム用指定枠 ----*/

