/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>---------------------ここから注文ページの設定------------------------------------ */

div.soapmei{
	background:url(../img/2605_kabe_bg5_3_bee0ef.gif) center repeat;                   /* 250325 画像変更 sim_013.gif → gmy012 */
	background-color:#dbf1d1;                                                             /* <>注文画面の中の石けん名表示の囲み線の色 (桃色 0%, 40%, 20%, 0% ) */
	height:43px;                                                                          /* 210207 30px → 43px */
	margin:10px 15px 0px 15px;                                                            /* 210201 margin:15px 15px 0px 15px; → margin:10px 15px 0px 15px; */
	padding-top:0px;                                                                      /* 210201 padding-top:10px; → padding-top:0px; */
	text-align:center;
	color:#344470;                                                                        /* <>注文画面の中の石けん名表示の文字線 */
	font-family:"ヒラギノ角ゴシック","メイリオ","游ゴシック","Meiryo","Meiryo UI",sans-serif;
/*	font-family:"Trebuchet MS Bold","BIZ UDゴシック Regular","BIZ UDGothic Regular","メイリオ","Meiryo","Meiryo UI",sans-serif; */   /*250502 フォント変更*/
	font-size:19pt;
	font-weight:bolder;
}

h2.soapmei{
    width:98%;
	height:30px;
	font-family:"ヒラギノ角ゴシック","メイリオ","游ゴシック","Meiryo","Meiryo UI",sans-serif;
/*	font-family:"Trebuchet MS Bold","BIZ UDゴシック Regular","BIZ UDGothic Regular","メイリオ","Meiryo","Meiryo UI",sans-serif; */   /*250502 フォント変更*/
    color:#344470;                                                                        /* <>注文画面の中の石けん名表示のh2の文字色 (白色 0%, 0%, 0%, 0% ) */
    font-weight: bold;
	font-weight:bold;
    background-color:#8ABCD5;                                                             /* <>注文画面の中の石けん名表示のh2の囲み線の色 (水色 40%, 20%, 0%, 0% ) */
    padding-top:10px;
    padding-left:15px;
    margin:15px 15px 0px 15px;
}

.pageCH{                                                                                  /* 220110追加 注文画面の「検索表示対象数」表示 */
	color:#4643AA;
	text-align:;
	font-weight:bold;
}

.kagononaka{
	color:#525f82;                                                                        /* <>注文画面の中の、現在の購入金額を表示する表の中で左寄せの文字色 (青色 100%, 100%, 0%, 40% ) */
	text-align:right;
	margin-top:0px;
	margin-right:15px;
	margin-left:auto;
	font-weight:bold;
	border-style: solid;
	border-color:#525f82f;                                                                 /* 枠線色 */
	border-width: 2px;

	background:url(../img/2605_kabe_bg5_3_d8def0.gif) center repeat;
	background-color:#B0A4CC;                                                             /* 220110 注文画面、注文金額を表示する区画 */
	width:210px;
	padding-top:10px;
	padding-bottom:10px;
	padding-right:25px;
	padding-left:auto;
	border-radius: 10px;
}

.koumoku{
	color:#344470;                                                                        /* フォント */
	background-color:#E1FFFF;                                                             /* <>注文画面の中の「原材料」「重さ」「価格」の項目名の背景色 */
	margin-top:10px;                                                                      /* 5px → 10px(250506) */
	margin-bottom:11px;
	margin-left:20px;
	width:70px;                                                                             /* 横幅 */
	font-family:"ヒラギノ角ゴシック","メイリオ","游ゴシック","Meiryo","Meiryo UI",sans-serif;
	font-size:14pt;
	font-weiht:1100;
	border-color:#344470;                                                                 /* 背景色 */
	border-width: 2px;
	border-style: solid;
	padding: 2px 3px 2px 3px;                                                             /* 内側の隙間 */
	line-height:1.2;                                                                      /* 行間 1.8 → 1.4 */
}



======================================================================================================================

.AKAcc0000{                                                                               /* <>注文画面の中の「注文の流れ」の中の「↓」の文字線 */
	color:#cc0000;
	font:120%;
}

.shitaya{                                                                                 /* <>注文画面の中の「注文の流れ」の中の「↓」の文字線 */
	color:#;
	margin-left:11%;
}

.jancode{
    color:#343970;                                                                              /* <>注文画面の中の石けん名表示のとなりのJANコードの文字色 */
	margin-top:-21px;                                                                     /* 210207 -11pt → -21px */
	text-align:right;
	font-family:"ヒラギノ角ゴシック","メイリオ","游ゴシック","Meiryo","Meiryo UI",sans-serif;
/*	font-family:"BIZ UDゴシック Regular","BIZ UDGothic Regular","メイリオ","Meiryo","Meiryo UI",sans-serif; */   /*250502 フォント変更*/
	font-size:10pt;
	line-height:1.3;                                                                      /* 210202 行間 10pt → 1.3 */
	letter-spacing:1px;
}

.soapimg{
	background-color:#ffffff;                                                             /* <>注文画面の中の石けん画像の背景色 (白色 0%, 0%, 0%, 0% ) */
	margin:16px 10px 0px 21px;
}

div.chuumon{
	width:100%;
	background-color:#;                                                                   /* <>注文画面の中の石けんの説明文全体の背景色 */
	margin:15px 0px 9px 15px;
	font-family:"ヒラギノ角ゴシック","メイリオ","游ゴシック","Meiryo","Meiryo UI",sans-serif;
/*	font-family:"BIZ UDゴシック Regular","BIZ UDGothic Regular","メイリオ","Meiryo","Meiryo UI",sans-serif; */   /*250502 フォント変更*/
	font-size:12pt;
	line-height:1.5;                                                                      /* 210202 行間 12pt → 1.5 */
	letter-spacing:2px;
}

div.soapword{                                                                             /* <>注文画面の中の石けんの説明文のみの背景色 */
	background-color:#;
	margin-bottom:9px;
	margin-right:15%;
	font-family:"ヒラギノ角ゴシック","メイリオ","游ゴシック","Meiryo","Meiryo UI",sans-serif;
/*	font-family:"BIZ UDゴシック Regular","BIZ UDGothic Regular","メイリオ","Meiryo","Meiryo UI",sans-serif; */   /*250502 フォント変更*/
	font-size:12pt;
	color:#333333;
	line-height:1.4;                                                                      /* 210202 行間 12pt → 1.5 */ /* 210205 行間 1.5 → 1.4 */
	letter-spacing:2px;
}

.aboutsoap{
	background-color:#;                                                                   /* <>注文画面の中の「原材料」「重さ」「価格」の数値の背景色 */
	margin:-43px 10% 11px 110px;                                                          /* 210207 -27px → -35px → -30px(250506)*/
	font-family:"ヒラギノ角ゴシック","メイリオ","游ゴシック","Meiryo","Meiryo UI",sans-serif;
/*	font-family:"BIZ UDゴシック Regular","BIZ UDGothic Regular","メイリオ","Meiryo","Meiryo UI",sans-serif; */   /*250502 フォント変更*/
	line-height:1.4;                                                                      /* 210202 行間 12pt → 1.8 */  /* 210205 行間 1.8 → 1.4 */
	letter-spacing:2px;
	}

.chuumon_tanka{
	color:#cc0000;                                                                        /* chuumon_tanka<>注文画面の値段表示 (赤色、金赤 0%, 100%, 100%, 20% ) */
	}


.kakaku{                                                                                  /* <>注文画面の中の注文個数と入力ボタンの位置の背景色 */
	background:url(../img/ch08-bg.gif) center repeat;
	background-color:#;
	margin-top:10px;
	margin-left:55px;
	padding:5px 11px;
	width:155px;
	font-family:"ヒラギノ角ゴシック","メイリオ","游ゴシック","Meiryo","Meiryo UI",sans-serif;
/*	font-family:"BIZ UDゴシック Regular","BIZ UDGothic Regular","メイリオ","Meiryo","Meiryo UI",sans-serif; */   /*250502 フォント変更*/
	font-size:13pt;
	line-height:1.8;                                                                      /* 210202 行間 11pt → 1.8 */
	clear:right;
	}

.kago_ni_ireru{
	margin-left:20px;
	}
	

.msg{                                                                                     /* <>注文画面の中のメッセージ文(中央揃え)の文字色 (灰色 0%, 0%, 0%, 60% ) */
	color:#666666;
	text-align:center;
	font-weight:bold;
	}

.msg_l{                                                                                   /* <>注文画面の中のメッセージ文(左寄せ)の文字色 (青色 100%, 100%, 0%, 40% ) */
	color:#000099;
	text-align:left;
	font-weight:bold;
	}

.msg__l{                                                                                  /* <>注文画面の中のメッセージ文(左寄せ)の文字色 (青色 100%, 100%, 0%, 40% ) */
	color:#666633;
	text-align:left;
	font-size:-1;
	}

.msg_c{                                                                                   /* 「表示対象数」の文字色 in 注文画面 */
	color:#666633;                                                                        /* 「表示対象数」の文字色 in 注文画面 (青色 100%, 100%, 0%, 40% ) */
	text-align:;
	font-weight:bold;
	}

.msg_r{
	color:#;                                                                              /* <>注文画面の中のメッセージ文(右寄せ)の文字色 */
	font-size:12pt;
	text-align:right;
	margin-top:-16px;                                                                     /* 210207 -21px → -16px */
	}

.chuui{
	color:#cc0033;                                                                        /* <>注文画面の中のエラー文(大)の文字色 (赤色やや桃色がかった 0%, 100%, 75%, 20% ) */
	font-size:120%;
	font-weight:bold;
	text-align:center;
	}

.chuui_normal{
	color:#cc0033;                                                                        /* <>注文画面の中のエラー文(大)の文字色 (赤色やや桃色がかった 0%, 100%, 75%, 20% ) */
	font-weight:bold;
	}

.chuui_ko{
	color:#cc0033;                                                                        /* <>注文画面の中のエラー文(小)の文字色 (赤色やや桃色がかった 0%, 100%, 75%, 20% ) */
	font-size:10pt;
	}

.komoji{
	color:#;                                                                              /* <>注文画面の中の子文字(中央揃え)の文字色 */
	font-size:13pt;
	text-align:center;
	}

table.deeta{
	color:#;                                                                              /* <>注文画面の中の注文後のデータを表示する表の文字色 */
	border-collapse:collapse;
	}

.and_or{
	background-color:#;                                                                   /* <>注文画面の中の、and_or and検索or検索の表示の背景色 */
	text-align:center;
	}

.icon_KorZ{
	margin-top:7px;
	margin-left:0px;
	}

.chuumon_tanka{
	color:#cc0000;                                                                        /* chuumon_tanka<>注文画面の値段表示 (赤色 0%, 100%, 100%, 20% ) */
	}

.memori_red{                                                                              /* 250812 [使用感]と[泡立ち]の程度を表す目盛りが赤 */
	width:10px;
	background-color:#cc0000;
	}

.memori_gray{                                                                             /* 250812 [使用感]と[泡立ち]の程度を表す目盛りが灰色 */
	width:10px;
	background-color:#999999;
	}

.kagoni_sukima{                                                                           /* 250819 個数と[かごに入れる]の間の隙間 */
	margin-left:15px;
	}


/* <>--------------------ここまで注文ページの設定------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>-------------------ここから_かごの中確認画面始まり------------------------------- */
.tejun{
	text-align:center;
	font-weight:bold;
	padding:7px;
	width:75%;
	margin-top:11px;
	border-color:#6DB3AC;                                                                 /* <>かごの中確認画面の中の、手順表示の背景色 (橙色、黄色みの強い 0%, 20%, 100%, 20% ) */
	border-width:3px;
	border-style:inset;
	}

.td_hidari{                                                                               /* <>かごの中確認画面の中の、かごの中表示(左寄せ)の背景色|  250811 [td]削除 */
	text-align:left;
	vertical-align:top;
	font-weight:bold;
	font-size:14pt;
	background:url(../img/2601_kago__gch_af024.gif) center repeat;
	background-color:#E5DEE0;
    border: solid 2px #9AC3DB;
	padding-top:1rem;
	padding-left:1.5rem;
	padding-bottom:1rem;
	}

.td_migi{                                                                                 /* <>かごの中確認画面の中の、かごの中表示(右寄せ)の背景色|  250811 [td]削除 */
	text-align:right;
	vertical-align:top;
	font-weight:bold;
	font-size:14pt;
	background:url(../img/2601_kago__gch_af024.gif) center repeat;
	background-color:#E5DEE0;
    border: solid 2px #9AC3DB;
	padding-right:1.5rem;
	padding-bottom:1rem;
	}

.goukei{
	background-color:#;                                                                   /* <>かごの中確認画面の中の、合計金額表示の背景色 */
	width:85%;
	text-align:right;
	font-weight:bold;
	color:#666666;                                                                        /* <>かごの中確認画面の中の、合計金額表示の文字色 */
	}

.font_bigger{                                                                             /* <>かごの中確認画面の中の、合計金額数字部分 */
	font-size:115%;
	color:#3b2b47;                                                                        /* <>かごの中確認画面_金額の小計_文字色 #b2a7bb → #3b2b47 (220213) */
	}

.botan{
	background-color:#;                                                                   /* <>かごの中確認画面の中の、前ページに戻る等ボタン表示の背景色 */
	text-align:right;
	margin-right:11%;
	}

.sen{                                                                                     /* <>かごの中確認画面の中の、客情報入力の題の線の背景色 */
	background-color:#97BEE6;                                                             /* #b2a7bb(薄紫) → #C9DC87(薄緑/250502) → #A9EEFF(水色/250811) */
	color:#343970;                                                                        /* <>かごの中確認画面の中の、客情報入力の題の線の文字色 */
	font-weight:bold;
	text-align:left;
	width:95%;
	margin-top:15px;
	margin-bottom:11px;
	}

.kara{                                                                                    /* <>かごの中確認画面の中の、「かごの中は空」表示の線色 */
	width:85%;
	height:100px;
	padding-top:55px;
	padding-bottom:45px;                                                                  /* 250506 一文追加 */
	margin-top:20px;
	border-color:#999999;
	border-width:thin;
	border-style:solid;
	text-align:center;
	font-weight:bold;                                                                     /* 250506 一文追加 */
	}



h1{
	color:#333333;                                                                        /* h1<>見出しのテキスト */
	font-size:14pt;
	background:#99ccff;                                                                   /* h1_bg<>見出しの背景 */
	padding:3;
	margin:0;
	}

/* f5f5f5 */
#kago_koumokubg{                                                                          /* kago_koumokubg<>表見出しボーダー */
	width:95%;
}
    
.kago_koumoku{                                                                            /* kago_koumoku<>表見出しテキスト */
	background:#8ABCD5 url(../img/2605_kabe_bg5_3_bee0ef.gif) center repeat;              /* 表見出しの背景色  #382078 (250926) */
	color:#344470;                                                                        /* 文字色 #3b2b47(濃紫) → #3B5C0A(緑) */
	font-size:14pt;
	font-weight:bold;
	text-align:center;                                                                    /* かごの中確認_表見出し背景色 #b2a7bb(薄紫) → #C9DC87(若草/250502) →  */
	height:18px;
    border: solid 2px #8ABCD5;
}

.kago_nakami{                                                                             /* 251009追加 かごの表の背景 */
	background:#FEFDBD url(../img/2604_kabe_gch_lc011.gif) center repeat;                  /* 表の背景 */
	color:#333333;                                                                        /* 文字色 #3b2b47(濃紫) → #3B5C0A(緑) */
	font-size:14pt;
	font-weight:bold;
	text-align:center;                                                                    /* かごの中確認_表見出し背景色 #b2a7bb(薄紫) → #C9DC87(若草/250502) →  */
	height:18px;
    border: solid 2px #FEC84E;
}

.item_ta{             　　　　　　　                                                      /* cart_item_ta<>カート商品表示ボーダー */
	background:#cccccc;
	border-spacing:1;
	width:95%;
}

.item_ta{                           　　　　　　　                                        /* cart_item_ta<>カート商品表示ボーダー */
	background:#999999;
	width:95%;
}

#item_name{
	font-weight:bold;                                                                     /* item_name<>商品名テキスト */
}

.proc_bg{
	background:#cccccc;                                                                   /* cart_proc_bg<>カートの画面遷移表示ボーダー */
	margin-top:11px;
}

.proc{
	background:#;                                                                         /* cart_proc<>カートの画面遷移表示テキスト */
}

.tejun_genzai{                                                                            /* 210213 kago.php 注文手順、今どこか発送方法の選択肢 */
	display        : inline-block;
	color:#CC3366;                                                                        /* cart_tejun_genzai<>カートの画面遷移の現在の表示テキスト0066cc */
	font-weight:bold;
	letter-spacing : 4px;                                                                 /* 文字間 */
	text-shadow    :                                                                      /* 文字の影 */
		2px  2px 10px #FFCC99,
		-2px  2px 10px #FFCC99,
		2px -2px 10px #FFCC99,
		-2px -2px 10px #FFCC99,
		2px  0px 10px #FFCC99,
		0px  2px 10px #FFCC99,
		-2px  0px 10px #FFCC99,
		0px -2px 10px #FFCC99;

/*		2px  2px 1px #FFCC99, */
/*		-2px  2px 1px #FFCC99, */
/*		2px -2px 1px #FFCC99, */
/*		-2px -2px 1px #FFCC99, */
/*		2px  0px 1px #FFCC99, */
/*		0px  2px 1px #FFCC99, */
/*		-2px  0px 1px #FFCC99, */
/*		0px -2px 1px #FFCC99; */
/*	height:30px;                                                                          /* 文字を囲む角丸の四角の大きさ 210223 30px → 30px */ */
/*	width:120px;                                                                          /* 210223 40px → 100px */ */
/*	background-color:#FF9966; */
/*	padding-top:5px; */
/*	padding-left:5px; */
/*	border-radius:7px;                                                                    /* 角丸指定 */ */
}

/*********************************** 220405 情報入力の表の表示方法 ここから ***************************************************/
/******************************************************************************************************************************/

table.order_data{                                                                         /* cart_form_tr<>カートお客様情報入力ボーダー */
	border-collapse:separate;
	border-spacing:5px;
	margin-right:5%;
	margin-left:5%;
/*	width:85%;*/
}

table.order_data th{                                                                      /* cart_form_tr_bg<>カートお客様情報入力の項目の背景 */
	width:200px;                                                                          /* 220405 表の項目名部分 幅 */
	background:#C6D5F0 url(../img/2601_kago__bg5_7.gif) center repeat;                      /* 表の項目名部分 220213 Pink cca3a9 */
	color:#5F5388;                                                                        /* cart_form_tr<>カートお客様情報入力の項目のテキスト */
	font-size:100%;                                                                       /* 210205 フォントサイズ 110%拡大 → 100%(250507) */
	border:2.5px solid #7289A9;                                                           /* 210405 枠線をつける */
/*	border-color:#9aad57;                                                                  210405 枠線の色 #FF99CC(薄桃) → #FFCCFF(もっと薄桃) */
	padding-top:5px;                                                                      /* 210405 枠の内側の隙間(上)  */
	padding-bottom:3px;                                                                   /* 210405 枠の内側の隙間(下)  */
	padding-left:15px;                                                                    /* 210405 枠の内側の隙間(左)  */
	min-height:50px;                                                                      /* 210205 表の最低限の高さを設定 */
}

table.order_data td{                                                                      /* cart_form_td_bg<>カートお客様情報入力のフォーム部の背景 */
	width:800px;                                                                          /* 220405 表の項目名部分 幅 */
	background:#E5DEE0 url(../img/2601_kago_bg5_7.gif) center repeat;                       /* 表の項目名部分 220213 Light Blue 94a9c1 */
	color:#5A719E;                                                                        /* cart_form_td<>カートお客様情報入力のフォーム部のテキスト */
	font-size:103%;
	font-weight:bold;
	border:2.5px solid;                                                                   /* 210405 枠線をつける */
	border-color:#9AC3DB;                                                                 /* 210405 枠線の色 #CC99FF(薄紫) → #CCCCFF(もっと薄紫) */
	padding-top:5px;                                                                      /* 210405 枠の内側の隙間(上)  */
	padding-bottom:3px;                                                                   /* 210405 枠の内側の隙間(下)  */
	padding-left:15px;                                                                    /* 210405 枠の内側の隙間(左)  */
	min-height:50px;                                                                      /* 210205 表の最低限の高さを設定 */
}

.form_th_takasa50{
	height: 50px;                                                                         /* 220207 表の高さを固定する */
}

.form_th_takasa40{
	height: 40px;                                                                         /* 220207 表の高さを固定する */
}

.gauge_on{
	background-color:#ff8b5f;                                                             /* 260526 使用感を表すメーター on 橙色 */
}

.gauge_off{
	background-color:#bcc3cf;                                                             /* 260526 使用感を表すメーター off 灰色 */
}

/******************************************************************************************************************************/
/*********************************** 220405 情報入力の表の表示方法 ここまで ***************************************************/
/******************************************************************************************************************************/
/******************************************************************************************************************************/
/******************************************************************************************************************************/
/******************************************************************************************************************************/
/******************************************************************************************************************************/





#show_top{
	background:#99ccff url(../img/ch08-bg.gif) center repeat;
	width:500px;
	color:#000099;　                                                                      /* show.phpの */
	}

#kosuu_miseru{                                                                            /* 210208 注文内容を確認するページの個数表示部 */
    width: 75%;                                                                           /* 親要素に対して */
    padding: 5px 7px;                                                                     /* ボックスを大きくする */
    font-size: 18px;
	font-weight:bold;
    border-radius: 3px;                                                                   /* ボックス角の丸み */
    border: 2px solid #b2a7bb;                                                            /* 枠線 gray #999999 → #b2a7bb (220213) */
    box-sizing: border-box;                                                               /* 横幅の解釈をpadding, borderまでとする */
}

#kosuu_miseru:focus {
    border: 3px solid #b2a7bb;                                                            /* 枠線 3399CC → #b2a7bb(220213) → #b2a7bb (220213) */
    z-index: 10;
    outline: 0;
}

#cust_info{                                                                               /* 210210 お客様情報を入力するページの入力欄 */
/*	width: 100%; */                                                                         /* 親要素いっぱい広げる */
	padding: 10px 15px;                                                                   /* ボックスを大きくする */
	font-size: 18px;
	border-radius: 3px;                                                                   /* ボックス角の丸み */
	border: 2px solid #b2a7bb;                                                            /* 枠線 #999999 → #b2a7bb(220213) */
	box-sizing: border-box;                                                               /* 横幅の解釈をpadding, borderまでとする */
}

#cust_info:focus {
    border: 4px solid #b2a7bb;                                                            /* 枠線 #6666CC → #91849c(220213) → #b2a7bb(220213) */
    z-index: 10;
    outline: 0;
}

.hissu{                                                                                   /* 210210 「必須」を強調表示する。赤文字をうす赤で囲む */
	display        : inline-block;
	color          : #ff0000;                                                             /* 文字の色 */
	letter-spacing : 4px;                                                                 /* 文字間 */
	text-shadow    :                                                                      /* 文字の影 */
		2px  2px 1px #ffcccc,
		-2px  2px 1px #ffcccc,
		2px -2px 1px #ffcccc,
		-2px -2px 1px #ffcccc,
		2px  0px 1px #ffcccc,
		0px  2px 1px #ffcccc,
		-2px  0px 1px #ffcccc,
		0px -2px 1px #ffcccc;
	height:20px;                                                                          /* 文字を囲む角丸の四角 */
	width:60px;                                                                           /* 50px _ 60px(250507) */
	background-color:#ffcccc;
	padding-top:-21px;                                                                    /* 3px _ -17px(250507) _ -21px(250508) */
	padding-left:10px;                                                                    /* 5px _ 10px(250507) */
	border-radius:7px;
	font-size: 85%;                                                                       /* 250507 サイズ指定 85% */
}






/* /////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////// */
/* 210223 追加ここから kago.php 配達方法を選ぶセレクトボックスにデザイン */
/* 210223 参照 https://copypet.jp/797/ */

.erabu_kago {
	overflow: hidden;
	width: 180px;                                                                         /* 210227 90% → 180px */
	margin: 2em auto;
	text-align: left;                                                                     /* 210227 center → left */
/*	float:left;                                                                           /* 210227 追加 */
	display:inline-flex;                                                                  /* 210404 追加_改行しない */
}

.erabu_kago select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}

.erabu_kago select::-ms-expand {
    display: none;
}

.erabu_kago.cp_sl01 {                                                                     /* 210213 数を選ぶ選択枠について */
	position: relative;
	border: 2px solid #b2a7bb;                                                            /* 210213 #FF6699 → #6666CC → #b2a7bb (220213) */
	border-radius: 4px;                                                                   /* 210227 追加 ボックス角の丸み */
/*	border-radius: 10px 100px / 120px;                                                    /* 210213 2px 100px / 120px → 10px 100px / 120px */ */
	border-width: 3px;                                                                    /* 210213 追加 */
	background: #dad5de;                                                                  /* 210213 背景色 #CCCCFF → #dad5de (220213) */
}

.erabu_kago.cp_sl01::before {
	position: absolute;
	top: 0.8em;
	right: 0.9em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #b2a7bb;                                                        /* 210213 下向きの三角の色 → #b2a7bb (220213) */
	pointer-events: none;
}

.erabu_kago.cp_sl01 select {                                                              /* 210213 文字について */
	padding: 8px 38px 8px 8px;
	color: #3b2b47;                                                                       /* 210213 文字色 #CC0033 → #333399 → #3b2b47 (220213) */
	font-size: 17px;                                                                      /* 210213 追加、15px → 19px → 17px */
	font-weight: bold;                                                                    /* 210213 追加 */
}

/* 210223 追加ここまで kago.php 配達方法を選ぶセレクトボックスにデザイン */


/* 220215 追加ここから チェックボックスにデザインをつける */
/* 220215 参照":kodocode.net/design-css-checkbox/"------- */
/* ------------------------------------------------------ */
label input[type="checkbox"] ~ i.fa.fa-square-o{
    color: #c8c8c8;    display: inline;
}

label input[type="checkbox"] ~ i.fa.fa-check-square-o{
    display: none;
}

label input[type="checkbox"]:checked ~ i.fa.fa-square-o{
    display: none;
}

label input[type="checkbox"]:checked ~ i.fa.fa-check-square-o{
    color: #7AA3CC;    display: inline;
}

label:hover input[type="checkbox"] ~ i.fa {
color: #b2a7bb;　　　　　　　　　　　　　　　　　　                                       /* 210215 チェックボックスの色 */
}

div[data-toggle="buttons"] label.active{
    color: #b2a7bb;　　　　　　　　　　　　　　　　　                                     /* 210215 チェックボックスの色 */
}

div[data-toggle="buttons"] label {
display: inline-block;
/* padding: 6px 12px; */
/* margin-bottom: 0; */
/* font-size: 14px; */
/* font-weight: normal; */
border-weight: bold; 　　　　　　　　　　　　　　　　　　                                 /* 210215 一行の高さを決める */
/* line-height: 2em; */　　　　　　　　　　　　　　　　　　                               /* 210215 一行の高さを決める */
/* text-align: left; */
/* white-space: nowrap; */　　　　　　　　　　　　　　　　　　                            /* 210215 アルファベットのホワイトスペースをどうするか */
/* vertical-align: top; */
/* cursor: pointer; */　　　　　　　　　　　　　　　　　                                　/* 210215 カーソルの形状を変える */
/* background-color: none; */
border: 0px solid #b2a7bb;　　　　　　　　　　　　　　　　　　                            /* 210215 太さ、種類、色 #c8c8c8 → #b2a7bb (220215) */
border-radius: 3px;　　　　　　　　　　　　　　　　　　                                   /* 210215 角丸にする */
color: #3a5370;　　　　　　　　　　　　　　　　　　                                       /* 210215 文字色 #c8c8c8(灰色) → #3a5370 */
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;　　　　　　　　　　　　　　　　　                                    　/* 210215 文章の範囲選択を無効にする */
touch-callout: none;　　　　　　　　　　　　　　　　　　                                  /* 210215 長押しすることで現れるコールアウト表示を無効にする */
}

div[data-toggle="buttons"] label:hover {
color: #7AA3CC;　　　　　　　　　　　　　　　　　　                                       /* #7AA3CC → #b2a7bb (210215) */
}

div[data-toggle="buttons"] label:active, div[data-toggle="buttons"] label.active {
-webkit-box-shadow: none;
box-shadow: none;
}
/* ------------------------------------------------------ */
/* 220215 追加ここまで チェックボックスにデザインをつける */
/* 220215 参照":kodocode.net/design-css-checkbox/"------- */







/* <>-----------------ここまでかごの中確認ページの設定-------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>-----------------cart.cssからコピーしてきた-------------------------------------- */






/* 210201 追加ここから__________注文画面のボタン_ボタンを押すとへこむ */
#kagonaka_btn{                                                                            /* 250819 [かごの中を見る]ボタン */
	color:#2b27ba;                                                                        /* 文字色 */
	background:#cac9f5;                                                                   /* ボタン背景 */
	border-color:#2b27ba;                                                                 /* ボタン枠線の色 */
	width:160px;
	height:40px;
	font-weight:900;
	font-size:13pt;

	display: inline-block;                                                                /* 250819 追加ここから ボタンが立体 */
	padding: 0.5em 1em;
	text-decoration: none;
	border-radius: 4px;
	background-image: -webkit-linear-gradient(180deg, #B0A4CC 0%, #DAC4D1 100%);          /* 250819 [#B0A4CC 紫 0%, #DAC4D1薄紫 100%] */
	background-image: linear-gradient(180deg, #B0A4CC 0%, #DAC4D1 100%);                  /* 250819 グラデーションの向きと色 */
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
	border-bottom: 3px solid #7885AB;                                                     /* 250819 ボタンの立体影の色 */
}                                                                                         /* 250819 ここまで */

#kagonaka_btn:active {                                                                    /* 250819 */                                                                        /* 210201 追加ここから ボタンを押すとへこむ */
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
	border-bottom: none !important;
}
/* 210201 追加ここまで__________注文画面のボタン_ボタンを押すとへこむ */





/* 210204 追加ここから chuumon.php 個数を選ぶセレクトボックスにデザイン */
/* 210204 参照 https://copypet.jp/797/ */

.ko_select {
	overflow: hidden;
	width: 90%;
	margin: 2em auto;
	text-align: center;
}

.ko_select select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}

.ko_select select::-ms-expand {
    display: none;
}

.ko_select.cp_sl01 {                                                                      /* 数を選ぶ選択枠について */
	position: relative;
	border: 2px solid #24578D;                                                            /* 枠線の色 */
	border-radius: 10px 100px / 120px;                                                    /* 210206 2px → 10px 100px / 120px */
	border-width: 3px;                                                                    /* 210206 追加 */
	background: #EDFBFF;                                                                  /* 背景色 */
}

.ko_select.cp_sl01::before {
	position: absolute;
	top: 0.8em;
	right: 0.9em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #24578D;                                                        /* 下向きの三角の色 */
	pointer-events: none;
}

.ko_select.cp_sl01 select {                                                               /* 210206 文字について */
	padding: 8px 38px 8px 8px;
	color: #24578D;                                                                       /* 文字色 */
	font-size: 19px;                                                                      /* フォントサイズ */
	font-weight: bold;                                                                    /* 太字 */
}


/* 210204 追加ここまで chuumon.php 個数を選ぶセレクトボックスにデザイン */



/* 250822 追加ここから__________「お届け先の入力」のボタン_ボタンを押すとへこむ */
#kagoni_btn{                                                                              /* [お届け先の入力へ]ボタン */
	width:160px;
	height:50px;
	background:#ff2200;                                                                   /* ボタン背景 */
	border-color:#ff7000;                                                                 /* ボタン枠線の色 */
	font-weight:900;
	font-size:14pt;
	color:#ffffff;                                                                        /* 文字色 */

	display: inline-block;                                                                /* 250819 追加ここから ボタンが立体 */
	padding: 0.5em 1em;
	text-decoration: none;
	border-radius: 4px;
	background-image: -webkit-linear-gradient(180deg, #ff7408 0%, #ff8d33 100%);          /* 250819 [#B0A4CC 紫 0%, #DAC4D1薄紫 100%] */
	background-image: linear-gradient(180deg, #ff7408 0%, #ff8d33 100%);                  /* 250819 グラデーションの向きと色 */
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
	border-bottom: 3px solid #ff7000;                                                     /* 250819 ボタンの立体影の色 */
}                                                                                         /* ボタンが立体 ここまで */

#kagoni_btn:active {                                                                      /* 210201 追加ここから ボタンを押すとへこむ */
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
	border-bottom: none !important;
}

.kagoni_btn{                                                                              /* [お届け先の入力へ]ボタン */
	width:160px;
	height:50px;
	background:#ff2200;                                                                   /* ボタン背景 */
	border-color:#ff7000;                                                                 /* ボタン枠線の色 */
	font-weight:900;
	font-size:14pt;
	color:#ffffff;                                                                        /* 文字色 */

	display: inline-block;                                                                /* 250819 追加ここから ボタンが立体 */
	padding: 0.5em 1em;
	text-decoration: none;
	border-radius: 4px;
	background-image: -webkit-linear-gradient(180deg, #ff7408 0%, #ff8d33 100%);          /* 250819 [#B0A4CC 紫 0%, #DAC4D1薄紫 100%] */
	background-image: linear-gradient(180deg, #ff7408 0%, #ff8d33 100%);                  /* 250819 グラデーションの向きと色 */
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
	border-bottom: 3px solid #ff7000;                                                     /* 250819 ボタンの立体影の色 */
}                                                                                         /* ボタンが立体 ここまで */

.kagoni_btn:active {                                                                      /* 210201 追加ここから ボタンを押すとへこむ */
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
	border-bottom: none !important;
}

/* 250822 追加ここまで__________「お届け先の入力」のボタン_ボタンを押すとへこむ */



















#btn_cart00{
	width:100px;
	background:#3366cc;                                                                   /* btn_cart_bg<>商品画面のカート順路のボタン背景 */
	border-color:#003399;                                                                 /* btn_cart_bo<>商品画面のカート順路のボタンボーダー3366cc */
	color:#cccc99;                                                                        /* btn_cart<>商品画面のカート順路のボタンテキスト */
	font-weight:bold;
}




/* 210202 「商品の一覧へ戻る」「前の画面へ戻る」のボタン */
#btn{                                                                                     /* 210202 「商品の一覧へ戻る」「前の画面へ戻る」のボタン */
	width:140px;
	heigth:50px;
	background:#d9d8df;                                                                   /* ボタン背景色 #CCCCCC → #d9d8df薄紫 (220213) */
	border-color:#d9d8df;                                                                 /* ボタンの枠線の色 #CCCC00 → #0099FF(210202) → #f6f6f7白紫 (220213)*/
	font-weight:bold;
	font-size:11pt;
	color:#3a5370;                                                                        /* ボタンの文字色 #003399 → #3a5370濁った青 (220213) */
	text-align:center;
	margin-right:5px;                                                                     /* 220405 ボタンの右の隙間を文字色 #003399 → #3a5370濁った青 (220213) */

	display: inline-block;                                                                /* 210202 追加ここから ボタンが立体 */
	padding: 0.5em 1em;
	text-decoration: none;
	border-radius: 4px;
	background-image: -webkit-linear-gradient(45deg, #f6f6f7 0%, #d9d8df 100%);           /* 220213 グラデーションを設定 [#CCFFFF 0% ～ #6699FF 100%] → [#f6f6f7白紫 0% ～ #d9d8df薄紫 100%](220213薄紫) */
	background-image: linear-gradient(45deg, #f6f6f7 0%, #d9d8df 100%);                   /* 220213 グラデーションを設定 [#CCFFFF 0% ～ #6699FF 100%] → [#f6f6f7白紫 0% ～ #d9d8df薄紫 100%](220213薄紫) */
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
	border-bottom: 3px solid #cccccc;                                                     /* 210202 追加ここまで ボタンが立体 */
}

#btn:active{                                                                             /* 210202 追加ここから ボタンを押すとへこむ */
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
	border-bottom: none !important;
}                                                                                         /* 210202 追加ここまで ボタンを押すとへこむ */




/* 210202 「削除」「変更」のボタン */
#btn_de_cha{                                                                              /* 210202 「削除」「変更」のボタン */
	width:60px;
	heigth:21px;
	background:#f6f6f7;                                                                   /* ボタン背景色 #CCCCCC → #d9d8df (220213薄紫) */
	border-color:#d9d8df;                                                                 /* ボタンの枠線の色 #CCCC00 → #0099FF(210202) → #f6f6f7白紫 (220213)*/
	font-weight:bold;
	font-size:12pt;
	color:#3a5370;                                                                        /* ボタンの文字色 #003399 → #3a5370濁った青 (220213) */
	text-align:center;
	margin-right:10px;                                                                    /* 220405 ボタンの右の隙間を文字色 #003399 → #3a5370濁った青 (220213) */

	display: inline-block;                                                                /* 210202 追加ここから ボタンが立体 */
	text-decoration: none;
	border-radius: 4px;
	background-image: -webkit-linear-gradient(45deg, #f6f6f7 0%, #d9d8df 100%);           /* 220213 グラデーションを設定 [#CCFFFF 0% ～ #6699FF 100%] → [#f6f6f7白紫 0% ～ #d9d8df薄紫 100%](220213) */
	background-image: linear-gradient(45deg, #f6f6f7 0%, #d9d8df 100%);                   /* 220213 グラデーションを設定 [#CCFFFF 0% ～ #6699FF 100%] → [#f6f6f7白紫 0% ～ #d9d8df薄紫 100%](220213) */
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
	border-bottom: 3px solid #CCCCCC;                                                     /* 210202 追加ここまで ボタンが立体 */
}

#btn_de_cha:active{                                                                       /* 210202 追加ここから ボタンを押すとへこむ */
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
	border-bottom: none !important;
}                                                                                         /* 210202 追加ここまで ボタンを押すとへこむ */

#adm .menu{
	color:#333333;
	font-size:14pt;
	background:#ccffff;
	width:150;
	padding:3;
	margin:0;
	text-align:center;
	font-weight:bold;
}

#adm .md{
	color:#0000ff;
}

#adm .fmth{
	background:#ccc;
	color:#333333;
	font-weight:400;
}

#adm .fmtd{
	background:#eee;
	color:#666666;
}

/* <>------------------cart.cssからコピーしてきた終わり------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */






/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>----------------------------ここから「動くボタン(Hover Action)」の設定----------- */

.btn-a13 {
	display: inline-block;
	padding: 0.5em 1em;
	text-decoration: none;
	border-radius: 4px;
	color: #ffffff;
	background-image: -webkit-linear-gradient(45deg, #ECD204 0%, #E0E2A7 100%);
	background-image: linear-gradient(45deg, #ECD204 0%, #E0E2A7 100%);
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
	border-bottom: 3px solid #c58668;
}

.btn-a13:active {
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
	border-bottom: none !important;
}

.test{
	display       : inline-block;
	border-radius : 5%;                                                                   /* 角丸       */
	font-size     : 25pt;                                                                 /* 文字サイズ */
	text-align    : right;                                                                /* 文字位置   */
}	

/* <>----------------------------ここまで「動くボタン(Hover Action)」の設定----------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------------------------------------------------------------- */
/* <>--------------------------- ここから「画像の大きさ」の設定_すべてのページ ------- */

/* <>------ ここから全ページ共通の指定 ------- */

.all_kotori{                                                                              /* 250513 ことり屋マークの大きさを指定 */
	width: 114px;
	height: 110px;
}

.all_menu{                                                                                /* 250513 他のページに行くアイコンの大きさを指定 */
	width: 79px;
	height: 57px;
}

.all_menu_s{                                                                              /* 250513 他のページに行くアイコンの大きさを指定 for chuumon.phpの小さいアイコン */
	width: 68px;
	height: 49px;
}


/* <>------ ここからindex上の画像の指定 ------- */

.index_daiji{                                                                             /* 250513 indexの題字の大きさを指定 */
	width: 257px;
	height: 36px;
}

.index_kongetsu{                                                                          /* 250513 index上の今月の石けんの画像の大きさを指定 */
	width: 563px;
	height: 422px;
}

/* <>------ ここからkikkake上の画像の指定 ------- */

.kikkake_daiji{                                                                           /* 250513 [きっかけ]の題字の大きさを指定 */
	width: 377px;
	height: 36px;
}

.kikkake_img{                                                                             /* 250513 [きっかけ]上の画像の大きさを指定 */
	width: 200px;
	height: 150px;
}


/* <>------ ここからmamechishiki上の画像の指定 ------- */

.mamechishiki_daiji{                                                                      /* 250513 [きっかけ]の題字の大きさを指定 */
	width: 437px;
	height: 36px;
}

.mamechishiki_img{                                                                        /* 250513 [きっかけ]上の画像の大きさを指定 */
	width: 200px;
	height: 150px;
}

.mamechishiki_2110_img{                                                                   /* 250513 [きっかけ]上の画像の大きさを指定 */
	width: 550px;
	height: 413px;
}

.mamechishiki_0705_01_img{                                                                /* 250513 [きっかけ]上の画像の大きさを指定 */
	width: 290px;
	height: 198px;
}




/* <>------ ここからchuumon.php上の画像の指定 ------- */

.chuumon_daiji{                                                                          /* 250521 [注文]の石けん画像の大きさを指定 */
	width: 580px;
	height: 450px;
}
.chuumon_nioi{                                                                            /* 250521 [注文]の[無香料、香り付き]アイコンの大きさを指定 */
	width: 60px;
	height: 63px;
}

.chuumon_kesho{                                                                           /* 250521 [注文]の[化粧石けん、雑貨]アイコンの大きさを指定 */
	width: 58px;
	height: 59px;
}

.chuumon_koumoku_haba_10{                                                                           /* 250521 [注文]の[化粧石けん、雑貨]アイコンの大きさを指定 */
	width: 10px;
}

.chuumon_koumoku_haba_10{                                                                           /* 250521 [注文]の[化粧石けん、雑貨]アイコンの大きさを指定 */
}


/* <>------ ここからkago.php上の画像の指定 ------- */

.kago_daiji_see{                                                                          /* 250522 [かごの中を見る]の題字画像の大きさを指定 */
	width: 457px;
	height: 36px;
}

.kago_daiji_input{                                                                        /* 250522 [お届け先の入力]の題字画像の大きさを指定 */
	width: 507px;
	height: 36px;
}

.kago_daiji_confirm{                                                                      /* 250522 [入力内容の確認]の題字画像の大きさを指定 */
	width: 491px;
	height: 36px;
}

.kago_daiji_complet{                                                                      /* 250522 [ご注文完了]の題字画像の大きさを指定 */
	width: 434px;
	height: 36px;
}

.kago_hyou_haba10p{                                                                       /* 250522 [かごの中を見る]の表の幅を10%で指定 */
	width: 10%;
}

.kago_hyou_haba11p{                                                                       /* 250522 [かごの中を見る]の表の幅を11%で指定 */
	width: 11%;
}

.kago_hyou_haba13p{                                                                       /* 250522 [かごの中を見る]の表の幅を13%で指定 */
	width: 13%;
}

.kago_hyou_haba15p{                                                                       /* 250522 [かごの中を見る]の表の幅を15%で指定 */
	width: 15%;
}

.kago_hyou_haba35p{                                                                       /* 250522 [かごの中を見る]の表の幅を35%で指定 */
	width: 35%;
}

.kago_hyou_haba45p{                                                                       /* 250522 [かごの中を見る]の表の幅を45%で指定 */
	width: 45%;
}

.kago_hyou_haba55p{                                                                       /* 250522 [かごの中を見る]の表の幅を55%で指定 */
	width: 55%;
}

.kago_hyou_haba95p{                                                                       /* 250522 [かごの中を見る]の表の幅を95%で指定 */
	width: 95%;
}

.kago_hyou_haba100{                                                                       /* 250522 [かごの中を見る]の表の画像の幅を100pxで指定 */
	width: 100px;
}