@charset "utf-8";
/* ===================================================================
CSS information
file name  :mypage.css
style info :マイページ
=================================================================== */
/* -----------------------------------------------
MYページ汎用
----------------------------------------------- */
#mypagecolumn {
    width: 100%;
    padding-bottom: 35px;
}
#mypagecolumn h2.title {
    font-size: 18px;
    border-bottom: #CCC solid 1px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}
h3.title_mypage {
    font-size: 18px;
    margin-bottom: 10px;
    padding: 10px 5%;
    border-bottom: solid 1px #ccc;
    font-weight: normal;
}
/**イントロダクション*/
#mypagecolumn .information {
    font-size: 12px;
    padding: 10px 5% 0;
    border-bottom: 0;
    font-weight: normal;
    overflow: hidden;
}

/*-----------------------------------------------
MYページナビ
----------------------------------------------- */
#mypage_nav {
    width: 100%;
    background: #DAE0E5;
    background: -moz-linear-gradient(center top, #FDFDFD 0%,#DAE0E5 90%,#DAE0E5 0%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(0.9, #DAE0E5),color-stop(0, #DAE0E5));
    margin-bottom: 15px;
    -webkit-box-shadow: 1px 5px 5px #EEEEEE;
    -moz-box-shadow: 1px 5px 5px #EEEEEE;
}
#mypage_nav ul {
    width: auto;
    clear: both;
    margin: 0 auto;
}
#mypage_nav ul li {
    text-align: center;
    border-bottom: #CCC solid 1px;
    white-space: nowrap;
}
#mypage_nav ul li a {
    color: #000;
    padding: 15px 0;
    display: block;
    text-shadow: 0px -1px 1px rgba(255,255,255,0.7);
    background-color: #DAE0E5;
    background: -moz-linear-gradient(center top, #EEF0F3 0%,#DAE0E5 90%,#DAE0E5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #EEF0F3),color-stop(0.9, #DAE0E5),color-stop(1, #DAE0E5));
}
#mypage_nav ul li a:hover {
    color: #FFF;
    text-shadow: 0px -1px 1px rgba(0,0,0,0.5);
    background: #5393c5;
    background: -moz-linear-gradient(center top, #5393c5 10%,#80b6e2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #5393c5),color-stop(1, #80b6e2));
}
#mypage_nav ul li {
    width: 100%;
}

/* ログアウトボタン */
p.btn_logout {
	margin-top: 30px;
}
p.btn_logout a {
    border: solid 1px #ccc;
    width: 90%;
    text-align: center;
    padding: 10px 0;
    display: inline-block;
    margin: 0 auto 0 5%;
    background: #efefef;
    border-radius: 5px;
}


/* -----------------------------------------------
MYページトップ
----------------------------------------------- */
#mycontents_area.mypage-top h2 {
    margin-top: 60px;
}
#mycontents_area.mypage-top h3 {
    margin-top: 30px;
}
#mycontents_area.mypage-top #account_info .account_change_bloc h3 {
    margin-bottom: 0;
    margin-top: 15px;
}

#customer_info {
    overflow: hidden;
}
/* 登録画像(プロフィール画像を使用しない場合かつ顧客ランク設定時はランク画像) */
#customer_info .customer_img {
    position: relative;
    float: left;
    width: 18%;
    margin-left: 5%;
}
/* ランクがあれば登録画像にランク画像を重ねる */
#customer_info .customer_img #rank_icon {
    position: absolute;
    bottom: 0;
    left: 37px;
}
#customer_info .customer_detail {
	float: right;
    padding-top: 15px;
    width: 70%;
    margin-right: 5%;
}
/* 画像がない場合は顧客名とポイント数のみ表示する */
#customer_info .customer_detail_noimage {
    margin: 0 5%;
}
/* ランクアップ後の特典等を表示 */
#customer_next_rank_info {
	width: 84%;
    border: solid 1px #ccc;
    background: #fcfcf7;
    padding: 3%;
    margin: 5px 5% 0;
    clear: both;
    display: inline-block;
}
#customer_next_rank_info .customer_rank_img {
    float: left;
    margin-right: 5px;
    width: 14%;
}
#customer_next_rank_info .customer_rank_detail {
    float: left;
    padding-top: 6px;
    width: 84%;
    line-height: 1.4;
}
#customer_next_rank_info p.next_rank_service {
	padding-top: 10px;
    color: #e64c66;
    clear: both;
    text-align: center;
}
#customer_next_rank_info p.next_rank_service span {
    border: solid 1px #ccc;
    font-size: 11px;
    font-weight: normal;
    padding: 2px 5px;
    background: #fff;
    color: #333;
    display: block;
    text-align: center;
    margin-bottom: 4px;
}

/* アカウントメニュー */
#account_info .account_change_bloc ul li a {
    border-bottom: solid 1px #e9e9e9;
    padding: 15px 10px 15px 20px;
    overflow: hidden;
    display: block;
}

/* キャンペーン情報 */
.campaign_info {
    border: solid 1px #ccc;
    margin: 5%;
    padding: 3%;
    border-radius: 4px;
}
.campaign_info p.campaign_name {
    background: #fef9d9;
    padding: 6px 12px;
    margin-bottom: 5px;
    color: #e64c66;
    font-weight: bold;
}
.campaign_info p.campaign_name i {
	color: #ECBD00;
}
.campaign_info .nav_btn { /* エントリー済 */
    padding: 5px 0;
    border-radius: 2px;
    border: solid 1px #ccc;
    font-size: 12px;
    margin: 10px auto 0;
    text-align: center;
    width: 65%;
    background: #ededed;
    color: #999;
}
.campaign_info .nav_btn_entry a { /* エントリーする */
    padding: 5px 0;
    border-radius: 2px;
    font-size: 12px;
    margin: 10px auto 0;
    text-align: center;
    width: 70%;
    display: block;
    background: #e64c66;
    color: #fff;
}
.campaign_info p.campaign_info_detail {
    text-align: right;
    font-size: 11px;
    margin-top: 10px;
}

/* 購入履歴一覧へのリンク */
p.other_histry {
	margin: 10px 5% 30px;
	text-align: right;
}

/* 加盟店ユーザーの場合のみ、お届け先を表示する */
.order_history_list .order_info .order_shipping_wrap,
.order_history_list .order_info .order_sender_wrap,
.estimate_history_list .estimate_info .estimate_shipping_wrap,
.estimate_history_list .estimate_info .estimate_sender_wrap {
	clear: both;
	margin-left: 0;
	float: none;
	font-size: 12px;
	overflow: hidden;
}
.order_history_list .order_info .order_shipping_wrap .order_shipping,
.order_history_list .order_info .order_sender_wrap .order_sender,
.estimate_history_list .estimate_info .estimate_shipping_wrap .estimate_shipping,
.estimate_history_list .estimate_info .estimate_sender_wrap .estimate_sender {
	padding-top: 5px;
	margin-bottom: 5px;
	width: 100%;
}
.order_history_list .order_info .order_shipping_wrap .order_shipping span.icon_ship,
.order_history_list .order_shipping_wrap .order_shipping span.icon_ship,
.order_history_list .order_info .order_sender_wrap .order_sender span.icon_ship,
.order_history_list .order_sender_wrap .order_sender span.icon_ship,
.estimate_history_list .estimate_info .estimate_shipping_wrap .estimate_shipping span.icon_ship,
.estimate_history_list .estimate_sender_wrap .estimate_sender span.icon_ship {
	font-size: 10px;
	padding: 2px 6px;
	background: #666;
	color: #fff;
}

/* MYページメニュー */
.sp_f_menu_mypage {
    margin-bottom: 65px;
}
#mypagecolumn h2 {
    font-size: 113%;
}
h3.title_mypage {
    padding: 5px 0;
    font-weight: normal;
    text-align: center;
    font-size: 100%;
    background: #2D2D2E;
    color: #fff;
    margin-top: 30px;
}
.sp_f_menu_mypage p a {
    border-bottom: solid 1px #e9e9e9;
    padding: 15px 10px 15px 20px;
    overflow: hidden;
    display: block;
    color: #333;
}
.sp_f_menu_mypage p.ttl {
    margin-top: 15px;
    font-size: 18px;
    margin-bottom: 10px;
    padding: 10px 5%;
    border-bottom: solid 1px #ccc;
    font-weight: normal;
}
.sp_f_menu_mypage ul li a {
    border-bottom: solid 1px #e9e9e9;
    padding: 15px 10px 15px 20px;
    overflow: hidden;
    display: block;
    color: #333;
}


/* -----------------------------------------------
   購入履歴一覧
   ※定期購入履歴でも一部使用
----------------------------------------------- */

/* 注文内容詳細 */
.order_history_list,
.estimate_history_list {
    border-bottom: solid 1px #e9e9e9;
    padding: 5%;
    position: relative;
}
.pagenumber_area + .order_history_list,
.pagenumber_area + .estimate_history_list {
    border-top: solid 1px #e9e9e9;
    margin-top: 20px;
}
/* 配送状況確認ボタン */
.order_history_list a.deliv_track,
.estimate_history_list a.deliv_track {
/*
    position: absolute;
    top: 4px;
    right: 0;
*/
    font-size: 12px;
    color: #008a00;
    font-weight: normal;
}
.deliv_track_area {
    position: absolute;
    float: right;
    top: 5%;
    right: 5%;
}

.order_history_list .deliv_track_area p {
	margin-bottom: 0;
}

/* 注文内容ヘッダー部 */
.order_history_list .order_info,
.estimate_history_list .estimate_info {
    position: relative;
}
.order_history_list p {
    margin-bottom: 15px;
}
.order_history_list .order_info > p,
.estimate_history_list .estimate_info > p {
    line-height: 1.3;
    font-weight: bold;
}
.order_history_list .order_info .order_status p,
.estimate_history_list .estimate_info .estimate_status p {
    color: #fff;
    padding: 1px 10px;
    font-size: 11px;
    display: inline-block;
    margin-bottom: 8px;
}
.order_history_list .order_info .order_status p.deliv_status_close,
.estimate_history_list .estimate_info .estimate_status p.deliv_status_close {
	background: #008a00;
}
.order_history_list .order_info .order_status p.order_status_cancel,
.estimate_history_list .estimate_info .estimate_status p.estimate_status_cancel {
	background: #999;
}
.estimate_history_list .estimate_detail_info .estimate_status p.estimate_status_close{
	background: #008a00;
}
.estimate_history_list .estimate_detail_info .estimate_status p.estimate_status_cancel {
	background: #999;
}
.estimate_history_list .estimate_detail_info .estimate_status p {
    color: #fff;
    padding: 2px 6px;
    display: inline-block;
    font-size: 10px;
}
/* 注文内容詳細 - 各種ナビゲーション */
.order_history_list .order_detail_info .order_nav_area,
.estimate_history_list .estimate_detail_info .estimate_nav_area {
    text-align: right;
}
/* 各種ナビ - 問い合わせボタン */
.order_history_list .order_detail_info .order_nav_area a.nav_btn,
.estimate_history_list .estimate_detail_info .estimate_nav_area a.nav_btn {
	display: block;
    padding: 5px 0;
    border-radius: 2px;
    background: #fff;
    border: solid 1px #ccc;
    text-align: center;
    width: 70%;
    color: #2d2d2e;
    font-size: 12px;
    margin: 15px auto 0;
}
/* 各種ナビ - 購入詳細確認ボタン */
.order_history_list .order_detail_info .order_nav_area a.order_history_detail,
.estimate_history_list .estimate_detail_info .estimate_nav_area a.estimate_history_detail {
    font-size: 11px;
}

/* 注文内容詳細 - 購入商品表示 */
.order_history_list .order_detail_info .order_item,
.estimate_history_list .estimate_detail_info .estimate_item {
    overflow: hidden;
    margin: 10px 0 0;
}
.order_history_list .order_detail_info .order_item .item_bloc,
.estimate_history_list .estimate_detail_info .estimate_item .item_bloc {
    overflow: hidden;
    margin-top: 7px;
}
.order_history_list .order_detail_info .order_item .item_image,
.estimate_history_list .estimate_detail_info .estimate_item .item_image,
.order_history_list .order_detail_info .order_item .raku2_item_image,
.estimate_history_list .estimate_detail_info .estimate_item .raku2_item_image {
	float: left;
	width: 20%;
    clear: both;
    margin-right: 3%;
}
.order_history_list .order_detail_info .order_item .item_image img,
.estimate_history_list .estimate_detail_info .estimate_item .item_image img,
.order_history_list .order_detail_info .order_item .raku2_item_image img,
.estimate_history_list .estimate_detail_info .estimate_item .raku2_item_image img {
	width: 100%;
}
.order_history_list .order_detail_info .order_item .item_detail,
.estimate_history_list .estimate_detail_info .estimate_item .item_detail {
    width: 77%;
    margin-bottom: 5px;
    display: inline-block;
}
.order_history_list .order_detail_info .order_item .item_detail p,
.estimate_history_list .estimate_detail_info .estimate_item .item_detail p {
	font-size: 11px;
	line-height: 14px;
	margin-bottom: 5px;
}
.order_history_list .order_detail_info .order_item .item_detail p a {
    margin-bottom: 5px;
    display: inline-block;
}
.order_detail_info .order_item .order_item_product {
    display: inline-block;
    margin-bottom: 25px;
    width: 100%;
}
/* -----------------------------------------------
   購入履歴詳細
   見積履歴詳細
----------------------------------------------- */
.raku2_estimate2apply_outer {
	text-align: center;
	margin-top: 10px;
}
.raku2_estimate2apply_outer textarea {
	width: 90%;
}
.btn input[id^='estimate2apply'] {
	border-radius: 2px;
	border: none;
	color: #fff;
	background-color: #3166ad;
	appearance: none;
	-webkit-appearance: none;
	-webkit-text-size-adjust: none;
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: none;
	cursor: pointer;
	outline: none;
}
.btn input[id^='estimate2reapply'] {
	border-radius: 2px;
	border: none;
	color: #fff;
	background-color: #3166ad;
	appearance: none;
	-webkit-appearance: none;
	-webkit-text-size-adjust: none;
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: none;
	cursor: pointer;
	outline: none;
}
.history .order_history,
.history .estimate_history {
    margin: 0 5%;
}

.history .order_history .box_header,
.history .estimate_history .box_header {
	padding: 10px 15px;
}
.history .order_history input.btn_reorder,
.order_history input.raku2_btn_order_cancel,
.order_history input.raku2_btn_order_image_dl,
.history .estimate_history input.estimate2order,
.history .estimate_history input.estimate2cancel,
.history .estimate_history input.estimate2reestimate {
    margin-top: 10px;
}

/* 注文内容詳細 - お届け先 */
.history .order_history .order_shipping,
.history .order_history .order_sender,
.history .order_history .order_mail_message,
.history .estimate_history .estimate_shipping,
.history .estimate_history .estimate_mail_message {
    border: solid 1px #ccc;
    margin-top: 30px;
}
.estimate_shipping {
    margin-bottom: 30px;
}
.history .order_history .order_shipping .ship_sec,
.history .order_history .order_sender .sender_sec,
.history .estimate_history .order_mail_message .mail_message_sec,
.history .estimate_history .estimate_mail_message .mail_message_sec,
.history .estimate_history .estimate_shipping .ship_sec {
    margin: 0 15px;
    padding: 15px 0;
    border-bottom: solid 1px #ccc;
}
.history .order_history .order_shipping .ship_sec:last-child,
.history .order_history .order_sender .sender_sec:last-child,
.history .order_history .order_mail_message .mail_message_sec:last-child,
.history .estimate_history .estimate_mail_message .mail_message_sec:last-child,
.history .estimate_history .estimate_shipping .ship_sec:last-child {
	border-bottom: none;
}
/* 注文内容詳細 - 購入商品表示 */
.history .order_history .order_item,
.history .estimate_history .estimate_item {
    overflow: hidden;
    margin-top: 30px;
    border: solid 1px #ccc;
    border-bottom: none;
}
.history .order_history .order_item .item_bloc,
.history .estimate_history .estimate_item .item_bloc {
    overflow: hidden;
	margin: 15px 0;
	padding: 0 15px;
}
.history .order_history .order_item .item_bloc .item_image,
.history .estimate_history .estimate_item .item_bloc .item_image {
	float: left;
	width: 20%;
    clear: both;
}
.history .order_history .order_item .item_bloc .item_image img,
.history .estimate_history .estimate_item .item_bloc .item_image img {
	width: 100%;
}
.history .order_history .order_item .item_bloc .item_detail,
.history .estimate_history .estimate_item .item_bloc .item_detail {
    float: right;
    width: 77%;
    margin-bottom: 5px;
}
.history .order_history .order_item .item_bloc ul,
.history .estimate_history .estimate_item .item_bloc ul {
    float: right;
}
.history .order_history .order_item .item_bloc ul li,
.history .estimate_history .estimate_item .item_bloc ul li {
    display: inline-block;
    margin-left: 10px;
}
.history .order_history .order_item .total_area,
.history .estimate_history .estimate_item .total_area {
    padding: 15px;
    border-top: solid 1px #ccc;
}
.history .order_history .order_item .item_bloc .item_detail p, .history .estimate_history .estimate_item .item_bloc .item_detail p {
    line-height: 16px;
    font-size: 11px;
    margin-bottom: 5px;
}
.history .order_history .order_item .item_bloc .item_detail p a, .history .estimate_history .estimate_item .item_bloc .item_detail p a {
    color: #333;
    text-decoration: underline;
}

/* 注文内容詳細 - メール送信履歴 */
.history .order_history .order_mail,
.history .estimate_history .estimate_mail {
    border: solid 1px #ccc;
    margin: 30px 0;
}

#pdf_dl_btn_sp {
    -webkit-appearance: none;
    width: 100%;
    color: #FFF;
    font-size: 16px;
    text-decoration: none;
    text-align: center;
    padding: 10px;
    display: block;
    cursor: -webkit-grab;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: none;
    background: #FF931E;
    margin-top: 10px;
}
/* 見積内容の詳細 */
.estimate_info input.estimate2order.btn.data-role-none,
.estimate_info input.estimate2cancel.btn.data-role-none,
.estimate_info input.estimate2reestimate.btn.data-role-none {
    -webkit-appearance: none;
    width: 100%;
    color: #FFF;
    font-size: 16px;
    text-decoration: none;
    text-align: center;
    padding: 10px;
    display: block;
    cursor: -webkit-grab;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: none;
    background: #FF931E;
    margin-top: 10px;
}

/* A => 2024.07.03 BBファイル添付注文 */
.order_history div.raku2_mypage_order_attached_file_btn_area,
.estimate_history div.raku2_mypage_estimate_attached_file_btn_area {
        padding: 0 5%;
    margin-bottom: 10px;
}

.order_history div.raku2_mypage_order_attached_file_name,
.estimate_history div.raku2_mypage_estimate_attached_file_name {
    margin-top: 10px;
    word-wrap: break-word;
}

.order_history p.raku2_mypage_order_attached_file_btn,
.estimate_history p.raku2_mypage_estimate_attached_file_btn {
    text-align: end;
    margin-bottom: 10px;
}

.order_history p.raku2_mypage_order_attached_file_btn a,
.estimate_history p.raku2_mypage_estimate_attached_file_btn a {
    text-decoration: none !important;
    border-radius: 4px;
    background: var(--accent-color);
    border: none;
    padding: 4px 4px;
    text-align: center;
    margin-right: 5px;
}

/* A <= 2024.07.03 BBファイル添付注文 */

/* -----------------------------------------------
   定期購入履歴一覧
----------------------------------------------- */
/* お申し込み内容詳細 */
.periodical_history_list {
    border-bottom: solid 1px #e9e9e9;
    padding: 7% 5%;
}
.pagenumber_area + .periodical_history_list {
    border-top: solid 1px #e9e9e9;
    margin-top: 20px;
}

/* お申し込み内容ヘッダー部 */
.periodical_history_list .periodical_info {
    position: relative;
}
.periodical_history_list .periodical_info > p {
    line-height: 1.6;
    font-weight: bold;
    margin-bottom: 5px;
}
.periodical_history_list .periodical_info .periodical_status p {
    color: #fff;
    padding: 1px 10px;
    font-size: 11px;
    display: inline-block;
    margin-bottom: 8px;
}
.periodical_history_list .periodical_info .periodical_status p.deliv_status_close {
	background: #008a00;
}
.periodical_history_list .periodical_info .periodical_status p.periodical_status_cancel {
	background: #999;
}

/* 次回、次々回お届け日時 */
.periodical_history_list .periodical_detail_info .next_shipping_date,
#mycontents_area.periodical_order_history .periodical_order_detail_bloc .next_shipping_date {
    margin: 15px 0;
    border: dotted 1px #ccc;
    padding: 10px 12px 2px;
    background: #fcfcf7;
}
.periodical_history_list .periodical_detail_info .next_shipping_date p,
#mycontents_area.periodical_order_history .periodical_order_detail_bloc .next_shipping_date p {
    font-size: 12px;
    margin-bottom: 5px;
}
#mycontents_area.periodical_order.periodical_order span.order_status_icon,
.periodical_history_list .periodical_detail_info span.order_status_icon,
#mycontents_area.periodical_order_history .periodical_order_detail_bloc span.order_status_icon {
    border: solid 1px #ccc;
    padding: 0 6px;
	background: #fff;
    font-size: 11px;
}

/* 継続ステータスアイコン */
.periodical_history_list .periodical_info span.periodical_status,
#mycontents_area.periodical_order_history .periodical_order_detail_bloc span.periodical_status {
    background: #008a00;
	color: #fff;
    padding: 1px 10px;
    font-size: 11px;
    margin-right: 3px;
}
.periodical_history_list .periodical_info span.periodical_status_stop,
#mycontents_area.periodical_order_history .periodical_order_detail_bloc span.periodical_status_stop  {
    background: #F00;
	color: #fff;
    padding: 1px 10px;
    font-size: 11px;
    margin-right: 3px;
}
.periodical_history_list .periodical_info span.periodical_status_cancel,
#mycontents_area.periodical_order_history .periodical_order_detail_bloc span.periodical_status_cancel  {
    background: #999;
	color: #fff;
    padding: 1px 10px;
    font-size: 11px;
    margin-right: 3px;
}

.periodical_history_list .periodical_info span.periodical_status_end,
#mycontents_area.periodical_order_history .periodical_order_detail_bloc span.periodical_status_end  {
    background: #999;
	color: #fff;
    padding: 1px 10px;
    font-size: 11px;
    margin-right: 3px;
}

.periodical_history_list .periodical_info span.teiki_course_cnt {
	padding: 0px 0 0 60px;
	font-weight: normal;
	margin-bottom: 0;
	display: block;
}

.teiki_course_inner,
.teiki_course_msg,
.teiki_course_cnt_msg {
	font-size: 11px;
}

.periodical_order_detail_bloc.periodical_info p.detail_teiki_course_msg {
	padding-top: 0;
}

.teiki_course_msg {
	display: block;
}

/* 注文内容詳細 - 各種ナビゲーション */
.periodical_nav_area {
    text-align: right;
}
/* 各種ナビ - お申し込み内容の確認・変更ボタン */
.periodical_nav_area a.nav_btn {
    display: block;
    padding: 5px 0;
    border-radius: 2px;
    background: #2185c5;
    text-align: center;
    width: 70%;
    color: #fff;
    font-size: 12px;
    margin: 15px auto 0;
}

/* 注文内容詳細 - 購入商品表示 */
.periodical_item {
    overflow: hidden;
    margin: 0 0 10px;
}
.periodical_item .item_bloc {
    overflow: hidden;
	margin-bottom: 25px;
}
.periodical_item .item_image {
	float: left;
	width: 20%;
	clear: both;
	margin-right: 3%;
}
.periodical_item .item_image img {
	width: 100%;
}
.periodical_item .item_detail {
    width: 77%;
    margin-bottom: 5px;
    display: inline-block;
}
.periodical_item .item_detail p {
	font-size: 11px;
}

/* -----------------------------------------------
   定期購入詳細
----------------------------------------------- */
#mycontents_area.periodical_order_history h4 {
    margin: 30px 5% 0;
    font-weight: normal;
    padding: 5px 10px;
    font-size: 14px;
    background: #999;
    color: #fff;
}
#periodical_order_message {
    margin: 5%;
}
.periodical_order_detail_bloc {
    margin: 5%;
}
.periodical_order_detail_bloc.periodical_info p,
.periodical_order_detail_bloc.periodical_next_shipping_date p,
.periodical_order_detail_bloc.periodical_use_point p,
.periodical_order_detail_bloc.periodical_payment p {
    margin-bottom: 10px;
}
.periodical_order_detail_bloc.periodical_info p {
    padding: 10px 10px 0;
    margin-bottom: 0;
}
.periodical_order_detail_bloc.periodical_info p.t_right {
    padding-bottom: 5px;
}
/* お届けサイクル */
.periodical_order_detail_bloc.periodical_next_shipping_date .next_shipping_date {
    border: solid 1px #ccc;
    padding: 15px 15px 5px;
}
/* お届け商品 */
.periodical_order_detail_bloc #periodical_item_price {
    border-top: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
    padding: 10px 0 5px;
    margin-bottom: 10px;
}
.periodical_order_detail_bloc #periodical_item_price span.total_price {
    display: inline-block;
    font-size: 18px;
    margin-top: 5px;
}
.periodical_order_detail_bloc #periodical_item_price span.total_price .mini {
	font-size: 14px;
}
/* お届け先住所 */
.periodical_order_detail_bloc dl.periodicalOrderShipping {
    margin-bottom: 10px;
}
.periodical_order_detail_bloc dl.periodicalOrderShipping dt {
    float: left;
    clear: left;
    font-weight: bold;
    width: 25%;
}
.periodical_order_detail_bloc dl.periodicalOrderShipping dd {
    float: left;
    width: 75%;
}
/* お届け履歴 */
.periodical_order_detail_bloc table#periodicalOrderHistory {
    width: 100%;
}
.periodical_order_detail_bloc table#periodicalOrderHistory th,
.periodical_order_detail_bloc table#periodicalOrderHistory td {
    border: solid 1px #ccc;
    padding: 5px 10px;
    text-align: center;
}
.periodical_order_detail_bloc table#periodicalOrderHistory th {
    background: #fcfcf7;
}

/* -----------------------------------------------
   定期コース　各種変更画面
----------------------------------------------- */
[class^="periodical_order_chg"] h4 {
    margin: 30px 5% 0;
    font-weight: normal;
    padding: 5px 10px;
    font-size: 14px;
    background: #999;
    color: #fff;
}
[class^="periodical_order_chg"] select {
    min-height: 30px;
}

/* 
   休止・解約変更画面
----------------------------------------------- */
#mycontents_area.periodical_order_chgstatus ul#chgstatus_list,
#mycontents_area.periodical_order_chgstatus_confirm #chgstatus_list_confirm {
    margin: 20px 0;
}
#mycontents_area.periodical_order_chgstatus ul#chgstatus_list li {
    margin: 10px 0;
}
#mycontents_area.periodical_order_chgstatus textarea[name="stop_message"] {
    width: 98%;
    min-height: 70px;
}

/* 
   お届けサイクル変更画面
----------------------------------------------- */
#mycontents_area.periodical_order_chgcycle .periodical_order_detail_bloc p {
    margin-bottom: 10px;
}
#mycontents_area.periodical_order_chgcycle #cycle_week,
#mycontents_area.periodical_order_chgcycle #cycle_month,
#mycontents_area.periodical_order_chgcycle #cycle_day {
    margin-top: 25px;
	padding: 5%;
    border: solid 1px #ccc;
    background: #ededed; /* 初期はグレー */
}
#mycontents_area.periodical_order_chgcycle #cycle_week.cycle_select,
#mycontents_area.periodical_order_chgcycle #cycle_month.cycle_select,
#mycontents_area.periodical_order_chgcycle #cycle_day.cycle_select {
    background: #fff; /* 選択されているものを白に */
}

#mycontents_area.periodical_order_chgcycle #cycle_next .cycle_next_day_msg {
    margin-top: 5px;
}

/* 
   お支払い方法変更画面
----------------------------------------------- */
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list {
    margin-bottom: 15px;
    border-bottom: solid 1px #ccc;
    padding-bottom: 15px;
    padding: 0 10px 15px;
}
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list img {
	max-width: 100%;
}

/* カード番号入力エリア */
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list .information p:first-child {
    font-size: 11px;
}
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #credit_info_area,
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #regist_credit_area,
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #zeus_credit_area {
    text-align: left;
    margin-top: 10px;
    font-size: 11px;
}
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #credit_info_area .information,
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #regist_credit_area .information,
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #zeus_credit_area .information {
    padding: 0;
    margin-bottom: 15px;
}
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #credit_info_area > h3,
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #regist_credit_area > h3 {
    display: none;
}
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #credit_info_area table th {
    vertical-align: top;
    width: 38%;
}
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #regist_credit_area table[summary="クレジットカード選択"] + table {
    display: none;
}
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #regist_credit_area table[summary="クレジットカード選択"] {
    font-size: 11px;
}
#mycontents_area.periodical_order_chgpayment #periodArea .payment_list #regist_credit_area table[summary="クレジットカード選択"] th {
    width: 15%;
}
/* 登録済カード選択エリア */
#mycontents_area.periodical_order_chgpayment #periodArea section#regist_credit_area ul li {
	margin-bottom: 15px;
}
#mycontents_area.periodical_order_chgpayment #periodArea section#regist_credit_area .form_area {
    padding: 10px 0 0;
}

/* 
   お支払い方法確認画面
----------------------------------------------- */
#mycontents_area.periodical_order_chgpayment_confirm #periodArea p#payment_name {
    margin-bottom: 10px;
}
#mycontents_area.periodical_order_chgpayment_confirm p.charge_attention {
    text-align: center;
    margin-bottom: 10px;
}

/* 
   お届け先変更画面
----------------------------------------------- */
#mycontents_area.periodical_order_chgship table#periodical_ship_info,
#mycontents_area.periodical_order_chgship_confirm table#periodical_ship_info {
	width: 100%;
	margin-top: 10px;
}
#mycontents_area.periodical_order_chgship table#periodical_ship_info th,
#mycontents_area.periodical_order_chgship_confirm table#periodical_ship_info th {
	text-align: left;
}
#mycontents_area.periodical_order_chgship_confirm p.ship_attention {
    text-align: center;
    margin: 20px 0 10px;
}
#mycontents_area.periodical_order_chgship_confirm table#change_ship_price {
    width: 100%;
    table-layout: fixed;
    text-align: center;
}
#mycontents_area.periodical_order_chgship_confirm table#change_ship_price th {
    border: solid 1px #ccc;
    background: #ededed;
}
#mycontents_area.periodical_order_chgship_confirm table#change_ship_price td {
	padding-top: 5px;
}

/* 
   お届け商品変更画面
----------------------------------------------- */
/* 数量や規格などの編集可能エリア */
#mycontents_area.periodical_order_chgitem .item_detail .change_area {
    border: solid 1px #ccc;
    padding: 10px;
    margin: 10px 0;
    font-size: 11px;
}
#mycontents_area.periodical_order_chgitem .item_detail .change_area select {
    min-height: 25px;
}
#mycontents_area.periodical_order_chgitem .item_detail .change_area dl {
    margin-bottom: 10px;
}
/* 削除ボタン */
#mycontents_area.periodical_order_chgitem a.btn_del_item {
    background: #999;
    color: #fff;
    font-size: 11px;
    padding: 2px 5px;
    border-radius: 2px;
    margin-top: 10px;
    display: inline-block;
}
/* 追加ボタン */
#mycontents_area.periodical_order_chgitem a.btn_add_item {
    background: #2185c5;
    color: #fff;
    font-size: 11px;
    display: block;
    text-align: center;
    border-radius: 4px;
    padding: 5px 0;
    margin: 20px auto;
    width: 80%;
}
/* 変更ボタン */
#mycontents_area.periodical_order_chgitem a.btn_upd_item,
#mycontents_area.periodical_order_chgitem a.btn_split_set_item {
    background: #2185c5;
    color: #fff;
    font-size: 11px;
    padding: 2px 5px;
    border-radius: 2px;
    margin-top: 10px;
    display: inline-block;
}
#mycontents_area.periodical_order_chgitem a.btn_split_set_item {
    margin-bottom: 10px;
}
#mycontents_area.periodical_order_chgitem_confirm p.item_change_attention {
    text-align: center;
    margin-top: 20px;
}

#mycontents_area.periodical_order_chgitem .periodical_order_detail_bloc p {
    margin-bottom: 10px;
}
#mycontents_area.periodical_order_chgitem #cycle_week,
#mycontents_area.periodical_order_chgitem #cycle_month,
#mycontents_area.periodical_order_chgitem #cycle_day {
    margin-top: 25px;
	padding: 5%;
    border: solid 1px #ccc;
    background: #ededed; /* 初期はグレー */
}
#mycontents_area.periodical_order_chgitem #cycle_week.cycle_select,
#mycontents_area.periodical_order_chgitem #cycle_month.cycle_select,
#mycontents_area.periodical_order_chgitem #cycle_day.cycle_select {
    background: #fff; /* 選択されているものを白に */
}

#mycontents_area.periodical_order_chgitem #cycle_next .cycle_next_day_msg {
    margin-top: 5px;
}

/* 
   お届け商品追加画面
----------------------------------------------- */
/* 検索エリア */
#mycontents_area.periodical_order_chgitemset .periodical_order_detail_bloc.item_search_bloc {
    border: solid 1px #ccc;
    padding: 3% 4% 0;
    font-size: 11px;
    background: #fcfcf7;
}
#mycontents_area.periodical_order_chgitemset .periodical_order_detail_bloc.item_search_bloc select {
    width: 100%;
    margin-bottom: 8px;
}
#mycontents_area.periodical_order_chgitemset .periodical_order_detail_bloc.item_search_bloc input {
    width: 95%;
    margin: 0 !important;
    padding: 6px 2% !important;
}
#mycontents_area.periodical_order_chgitemset .periodical_order_detail_bloc.item_search_bloc a.btn_search {
    background: #2185c5;
    color: #fff;
    width: 60%;
    display: block;
    margin: 15px auto;
    padding: 5px;
    text-align: center;
    border-radius: 2px;
}
/* 商品一覧テーブル */
#mycontents_area.periodical_order_chgitemset table.change_item_list th,
#mycontents_area.periodical_order_chgitemset table.change_item_list td {
    border: solid 1px #ccc;
    padding: 8px 10px;
}
#mycontents_area.periodical_order_chgitemset table.change_item_list th {
	background: #fcfcf7;
}
#mycontents_area.periodical_order_chgitemset table.change_item_list .periodical_item {
    margin: 0;
}
#mycontents_area.periodical_order_chgitemset table.change_item_list .periodical_item .item_detail dl {
	font-size: 11px;
    margin: 10px 0 5px;
}
#mycontents_area.periodical_order_chgitemset table.change_item_list .periodical_item .item_detail select {
    min-height: 25px;
}

/* 
   変更完了画面（共通）
----------------------------------------------- */
#mycontents_area.periodical_order_chgcomp #complete_area {
    padding: 5%;
}
#mycontents_area.periodical_order_chgcomp #complete_area .message {
    margin-bottom: 20px;
}

/* -----------------------------------------------
   ポイント履歴一覧
----------------------------------------------- */
#point_list .formBox {
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-bottom: none;
    border: #E3E3E3 solid 1px;
    border-width: 1px 1px 0 0;
    margin-bottom: 0;
}

#point_list p {
    margin-bottom: 0em !important;
}
#point_list .point_name {
    font-weight: bold;
}
#point_list .point_date {
    text-align: center;
    font-size: 64%;
}

/* ポイント履歴一覧テーブル */
#point_list table.tbl_history {
    width: 100%;
}
#point_list table.tbl_history th,
#point_list table.tbl_history td {
    border: #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    padding: 10px 5px !important;
    font-size: 11px;
}
#point_list table.tbl_history th {
	background-color: #FAFAFA;
}

#point_list table.tbl_history td.point_number {
    text-align: right;
}

/* 獲得・利用・失効アイコン */
#point_list p.kbn_icon {
    padding: 1px;
    color: #fff;
    font-size: 80%;
    text-align: center;
    width: 40px;
    margin: 5px auto 0;
}
#point_list p.kbn_icon.grant_kbn_get {
	background: #e64c66;
}
#point_list p.kbn_icon.grant_kbn_use {
	background: #2185c5;
}
#point_list p.kbn_icon.grant_kbn_loss {
	background: #999;
}
#point_list p.kbn_icon.grant_kbn_get {
	background: #e64c66;
}
#point_list p.kbn_icon.grant_kbn_use {
	background: #2185c5;
}
#point_list p.kbn_icon.grant_kbn_loss {
	background: #999;
}

#point_list p.kbn_icon.grant_kbn_expire {
	background: #666;
}

#point_list p.kbn_icon.grant_kbn_cancel {
	background: #999;
	width: 80%;
}

/* 獲得・利用・失効ポイント数の装飾 */
#point_list .point_name span,
#point_list .point_get span {
    padding-left: 5px;
}
#point_list .point_get span,
#point_list .point_use span,
#point_list .point_loss span {
    font-size: 100%;
    font-weight: bold;
}
#point_list .point_get {
    color: #e64c66;
}
#point_list .point_use,
#point_list .point_loss {
	color: #2185c5;
}

.normal_point_message {
	padding: 10px 5% 0;
}

/* -----------------------------------------------
   利用可能クーポン一覧・クーポン取得完了画面
----------------------------------------------- */
#coupon_list_wrap .formBox {
    margin-bottom: 0;
    border: none;
}
#coupon_list_wrap #coupon_list {
    margin: 0 auto 20px;
    border: solid 1px #ccc;
    border-radius: 4px;
}

/* クーポン画像・回数 */
#coupon_list_wrap #coupon_list #coupon_list_left {
    float: left;
    clear: left;
    width: 20%;
    text-align: center;
    padding: 5% 0 5% 5%;
}
#coupon_list_wrap #coupon_list #coupon_list_left img {
    display: block;
    border: solid #eee 1px;
    width: 100%;
    margin: 0 auto;
}

/* 以下、クーポン内容詳細 */
#coupon_list_wrap #coupon_list #coupon_list_right {
    float: left;
    width: 75%;
}
#coupon_list_wrap #coupon_list #coupon_list_right #coupon_info p#coupon_name {
    margin-bottom: 0;
}
#coupon_list_wrap #coupon_list #coupon_list_right #coupon_info p#coupon_name i {
    margin-right: 5px;
}
#coupon_info {
    border: none;
    margin: 0;
    padding: 5%;
    border-radius: none;
    box-shadow: none;
}
#coupon_info dt h3 {
    font-size: 100%;
}
#coupon_info dd {
    font-size: 85%;
    padding: 0 5% 8px;
    border-bottom: dashed 1px #ccc;
    margin-bottom: 8px;
}

#coupon_info p#coupon_code {
    text-align: right;
    font-size: 60%;
}

#coupon_info p#coupon_name {
    background: #fef9d9;
    padding: 6px 12px;
    margin: 5px 0 15px;
    color: #e64c66;
    font-weight: bold;
}

/* クーポン獲得画面での詳細画像 */
#coupon_info img.widget_coupon_image {
    width: 100%;
}
/* クーポン獲得画面での詳細情報 */
#coupon_info #coupon_info_detail {
    border: solid 1px #ccc;
    margin-top: 5%;
    padding: 5%;
    border-radius: 4px;
    box-shadow: 0 0 6px #ddd;
}
/* クーポン発行時メッセージ */
p.coupon_msg {
    text-align: center;
    border: solid 2px #ccc;
    padding: 2% 4%;
    margin: 30px 5%;
    background: #fcfcf7;
}
.form_area #coupon_info_serial h2 {
    margin-bottom: 3%;
}

/* -----------------------------------------------
購入履歴詳細
----------------------------------------------- */
#mypagecolumn .cartitemBox {
    padding: 10px 0;
}

.historyBox {
    padding: 10px 10px 5px;
    background: #F7F5F0;
    border: #A9ABAD solid 1px;
    border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    margin-bottom: 10px;
}
.historyBox p {
    font-size: 12px;
    width: 70%;
    display: inline;
    float: left;
}
.historyBox .btn_reorder .estimate2order {
    width: 5em;
    float: right;
    padding: 15px;
    display: inline;
    margin: 0;
}
#mypagecolumn .cartinContents  {
    min-height: 65px;
}

#mypagecolumn .cartinContents ul li.result {
    padding-top: 0!important;
    padding-left: 1em;
}
/* -----------------------------------------------
お気に入り
----------------------------------------------- */
.favoriteBox {
    padding: 10px 0 10px 0;
    border-bottom: #CCC solid 1px;
    clear: both;
    position: relative;
}
.favoriteBox:last-child {
    border-bottom: none;
}
.favoriteBox .photoL {
    width: 100%;
    max-width: 80%;
    min-width: 90px;
    margin-right: 3%;
}
.favoriteContents {
    width: 70%;
    margin-left: 5px;
}
.favoriteBox .favoriteContents a {
    width: auto;
    float: none;
    display: inline-block;
    max-width: 100%;
}
.favoriteBox  a {
    float: left;
    display: inline-block;
    width: 20%;
    max-width: 100px;
}
.favoriteBox a + .favoriteContents {
    width: auto;
    display: block;
    float: none;
    padding-left: 100px;
}
.favoriteContents h4 {
    margin-right: 30px;
}

.favoriteBox .btn_delete {
    position: absolute;
    top: 10px;
    right: 10px;
}

/* -----------------------------------------------
会員登録内容変更
----------------------------------------------- */
#mypagecolumn .thankstext {
    padding: 15px 10px 10px 10px;
}

/* 退会手続きエリア */
#mypagecolumn .refusal_area {
    text-align: center;
    margin-top: 50px;
}
#mypagecolumn .refusal_area a.btn {
    width: 90%;
    background: #999;
    color: #fff;
    display: inline-block;
    padding: 10px 0;
    border-radius: 5px;
    margin-top: 10px;
}

/* 会員変更完了画面 - 定期変更アラートエリア */
#mypagecolumn #teiki_change_alart {
	border: solid 2px #f00;
    padding: 5%;
    background: #fcfcf7;
    text-align: center;
    margin: 5%;
}
#mypagecolumn #teiki_change_alart h4 {
    text-align: center;
    padding-bottom: 8px;
    border-bottom: solid 1px #ccc;
    margin-bottom: 10px;
}
#mypagecolumn #teiki_change_alart a {
    display: inline-block;
    padding: 8px 20px;
    background: #39c;
    color: #fff;
    border-radius: 3px;
    margin-top: 10px;
}
/* 
   変更完了画面
----------------------------------------------- */
#mypagecolumn #complete_area {
    padding: 5%;
}

/* -----------------------------------------------
お届け先追加・変更
----------------------------------------------- */
#mypagecolumn .btn_area_top {
    margin-top: 10px;
}
.delivBox {
    padding: 10px 10px 5px 10px;
    border-bottom: #CCC solid 1px;
    clear: both;
    position: relative;
}

.delivBox:last-child {
    border-bottom: none;
}

/* -----------------------------------------------
退会手続き
----------------------------------------------- */
.refusetxt {
    padding: 15px 10px 10px 10px;
}
.refusetxt p:first-child {
    margin-bottom: 10px;
}
.btn_refuse {
    padding: 0;
    margin: 20px auto 0 auto;
}
.btn_refuse li {
    display: inline-block;
    vertical-align: middle;
}
.btn_refuse a.btn,
.btn_refuse input[type="submit"].btn {
    font-size: 13px!important;
    display: inline;
}
.btn_refuse li:first-child {
    margin-right: 1em;
}


/* ==============================================
▼加盟店グループ・加盟店用MYページ
=============================================== */
#mycontents_area[class^="member_"] h4 {
    margin: 30px 0 0;
    font-weight: 400;
    padding: 5px 10px;
    font-size: 14px;
    background: #999;
    color: #fff;
}
#mycontents_area[class^="member_"] input,
#mycontents_area[class^="member_"] select {
    outline: none;
}
#mycontents_area[class^="member_"] p.data_cnt_msg {
	margin-top: 10px;
}
#mycontents_area[class^="member_"] #member_contents_area {
    margin: 10% 5% 5%;
    text-align: center;
}
#mycontents_area[class^="member_"] #member_contents_area a.ins_btn,
#mycontents_area[class^="member_"] #member_contents_area a.csv_dl_btn,
#mycontents_area[class^="member_"] #member_contents_area a.raku2_update_btn {
    display: inline-block;
    padding: 6px 0;
    border-radius: 2px;
    background: #fff;
    border: solid 1px #ccc;
    text-align: center;
    min-width: 200px;
    color: #2d2d2e;
    font-size: 13px;
    text-decoration: none;
    margin-top: 5px;
}
#mycontents_area[class^="member_"] select {
	height: 26px;
    max-width: 90%;
}

/* MYページトップ
----------------------------------------------- */
#member_account_info .account_change_bloc ul {
    display: table;
    table-layout: fixed;
    width: 100%;
    background: #f5f5f5;
}
#member_account_info .account_change_bloc ul:after {
    content: none;
}
#member_account_info .account_change_bloc ul li {
    display: table-cell;
    text-align: center;
    border: solid 1px #e9e9e9;
}
#member_account_info .account_change_bloc ul li a {
    padding: 10px 0 !important;
    display: block;
}

/* テーブル
----------------------------------------------- */
#mycontents_area[class^="member_"] table {
    width: 100%
}
#mycontents_area[class^="member_"] table td,
#mycontents_area[class^="member_"] table th {
    border: 1px solid #ccc;
    padding: 10px;
}
#mycontents_area[class^="member_"] table th {
    background: #fcfcf7
}

#mycontents_area.member_list table th,
#mycontents_area.member_customer table th,
#mycontents_area.member_staff table th {
	text-align: center;
}

/* テーブル２（dl）
----------------------------------------------- */
#mycontents_area[class^="member_"] dl {
    border-top: solid 1px #e9e9e9;
    margin-top: 20px;
}
#mycontents_area[class^="member_"] dl dt {
    padding: 5% 5% 0;
    font-weight: bold;
}
#mycontents_area[class^="member_"] dl dd {
    padding: 0 5% 5%;
    border-bottom: solid 1px #e9e9e9;
}

/* キーワード検索
----------------------------------------------- */
#mycontents_area[class^="customer_"] #search_keyword_area {
	border: 1px solid #ccc;
    margin: 0 5% 10%;
    padding: 4% 4% 0;
    font-size: 11px;
    background: #fcfcf7;
}
#mycontents_area[class^="customer_"] #search_keyword_top input#btn_kwd_search,
#mycontents_area[class^="customer_"] #search_keyword_top input#btn_sales_search {
    background: #2185c5;
    color: #fff;
    width: 60%;
    display: block;
    margin: 15px auto;
    padding: 5px;
    text-align: center;
    border-radius: 2px;
    border: none;
}
#mycontents_area[class^="customer_"] #search_keyword_area #search_estimate_date {
    margin-bottom: 10px;
}
#mycontents_area[class^="customer_"] #search_keyword_area #search_estimate_keyword {
    margin-top: 10px;
}
#mycontents_area[class^="customer_"] #search_keyword_top input {
	width: 96%;
	margin: 0;
}
#mycontents_area[class^="customer_"] #search_keyword_top input[type="checkbox"] {
	width: auto;
	vertical-align: middle;
}
/*
#mycontents_area[class^="customer_"] #search_keyword_top select {
    width: 100%;
    margin-bottom: 8px;
}
*/

#mycontents_area[class^="customer_"] #search_keyword_top input#search_kw {
    width: 96%;
}
#mycontents_area[class^="customer_"] #search_keyword_top #search_order_date {
    margin-bottom: 8px;
}


/* キーワード検索
----------------------------------------------- */
#mycontents_area[class^="member_"] #search_keyword_area {
	border: 1px solid #ccc;
    margin: 0 5% 10%;
    padding: 4% 4% 0;
    font-size: 11px;
    background: #fcfcf7;
}
#mycontents_area[class^="member_"] #search_keyword_top input#btn_kwd_search,
#mycontents_area[class^="member_"] #search_keyword_top input#btn_sales_search {
    background: #2185c5;
    color: #fff;
    width: 60%;
    display: block;
    margin: 15px auto;
    padding: 5px;
    text-align: center;
    border-radius: 2px;
    border: none;
}
#mycontents_area[class^="member_"] #search_keyword_top input {
	width: 96%;
	margin: 0;
}
#mycontents_area[class^="member_"] #search_keyword_top input[type="checkbox"] {
	width: auto;
}
/*
#mycontents_area[class^="member_"] #search_keyword_top select {
    width: 100%;
    margin-bottom: 8px;
}
*/

#mycontents_area[class^="member_"] #search_keyword_top input#search_kw {
    width: 96%;
}
#mycontents_area[class^="member_"] #search_keyword_top #search_order_date {
    margin-bottom: 8px;
}
#mycontents_area[class^="member_"] #search_keyword_area .ranking_list_area {
	font-size: 12px;
}
#mycontents_area[class^="member_"] #search_keyword_area .ranking_list_area p.sub-ttl {
	font-weight: bold;
	margin: 0 auto 6px;
	font-size: 14px;
	border-bottom: 1px dotted #ccc;
	letter-spacing: 1px;
	padding: 10px 3px 0;
}
#search_keyword_top h3.btn-box {
	margin: 20px 0 0;
	padding-bottom: 5px;
	font-size: 14px;
	letter-spacing: 0.2px;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area select,
#mycontents_area[class^="member_"] #search_keyword_top.teiki_list_area select {
	width: auto;
	font-size: 1.5em;
	margin-right: 2px;
	margin-left: 10px;
	height: 32px;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area #search_order_date select[name="search_order_sdate_year"],
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area #search_order_date select[name="search_order_edate_year"],
#mycontents_area[class^="member_"] #search_keyword_top.teiki_list_area #search_order_date select[name="search_order_sdate_year"],
#mycontents_area[class^="member_"] #search_keyword_top.teiki_list_area #search_order_date select[name="search_order_edate_year"],
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area select[name="search_option_1"],
#mycontents_area[class^="member_"] #search_keyword_top.teiki_list_area select[name="search_member_staff_id"] {
	margin-left: 0;
}
#mycontents_area[class^="member_"] #search_keyword_top.teiki_list_area #member_list {
	margin-bottom: 10px;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area label {
	margin-bottom: 7px;
	display: inline-block;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area input[type="checkbox"],#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area input[type="checkbox"]:checked {
	box-sizing: border-box;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area input[type="checkbox"] {
	border: 1px solid #aaaaaa;
	vertical-align: -5px;
	-webkit-appearance: none;
	position: relative;
	margin-right: 5px;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	-webkit-box-sizing: border-box;
	width: 20px;
	height: 20px;
	background: #fff;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area input[type="checkbox"]:checked {
	background: #333;
	border: 1px solid #aaa;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area input[type="checkbox"]:checked:before {
	position: absolute;
	left: 2px;
	top: 13px;
	display: block;
	content: "";
	width: 5px;
	height: 2px;
	background: #ffffff;
	-webkit-transform: rotate(37deg);
	-webkit-transform-origin: right center;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area input[type="checkbox"]:checked:after {
	display: block;
	position: absolute;
	left: 6px;
	top: 13.5px;
	content: "";
	width: 14px;
	height: 2px;
	background: #ffffff;
	-webkit-transform: rotate(-53deg);
	-webkit-transform-origin: left center;
}
#mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area input#btn_sales_search {
	width: 200px;
	border-radius: 3px;
	background: #333;
	color: #fff;
	appearance: none;
	-webkit-appearance: none;
	-webkit-text-size-adjust: none;
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: none;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 6px;
	font-size: 16px;
}
.bg {
	height:100%;
	width:100%;
	top:0%;
	left:0%;
	position:fixed;
	background:rgba(0,0,0,0.4);
}
#advanced_sort_area {
	top: 0;
	height: auto;
	width: 100%;
	position: fixed;
	background: #fff;
	left: 50%;
	transform: translateX(-50%);
	overflow-y: scroll;
	display: none;
	z-index: 100;
}
#advanced_sort_area.on {
	display: block;
}
#btn_sort_close {
	font-size: 24px;
	position: absolute;
	right: 15px;
	top: 5px;
}
#advanced_sort_area h3 {
	margin: 35px 15px 15px;
}
#advanced_sort_area ul {
	margin: 0 15px 15px;
	border-top: 1px solid #eee;
}
#advanced_sort_area ul li {
	font-size: 16px;
	border-bottom: 1px solid #eee;
}
#advanced_sort_area ul li a {
	display: block;
	padding: 15px 0;
}
#advanced_sort_area ul li i {
	margin-right: 5px;
}
#btn_advanced_sort {
	min-width: 188px;
	width: 78%;
	border-radius: 0;
	border: 1px solid #333;
	background: #fff;
	color: #333;
	appearance: none;
	-webkit-appearance: none;
	-webkit-text-size-adjust: none;
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: none;
	cursor: pointer;
	outline: none;
	padding: 6px;
	display: block;
	text-align: left;
	margin: 0 auto 20px;
	font-size: 16px;
}
#btn_advanced_sort i {
	margin-right: 5px;
	font-size: 16px;
	vertical-align: middle;
}

/* ランキング一覧（member_ranking.php）
----------------------------------------------- */
#ranking_outer {
display: flex;
	justify-content: space-between;
	margin: 10px auto 0;
	flex-wrap: wrap;
}
#ranking_outer span {
	width: 100%;
	display: inline-block;
	margin-bottom: 4px;
}
#ranking_outer div {
	text-align: right;
	width: calc(50% - 5px);
}
#ranking_outer span.list_name {
	background: #eee;
	text-align: center;
}
#ranking_outer span.result {
	text-align: right;
}

/* 店舗一覧（member.php）
----------------------------------------------- */
#mycontents_area.member_list table td,
#mycontents_area.member_list table th {
    padding: 2px 10px;
}
#mycontents_area.member_list table td {
	text-align: center;
}
#mycontents_area.member_list .member_list_area {
    margin: 5%;
}
#mycontents_area.member_list .member_list_area .memberOrderBloc {
    border-bottom: solid 1px #ccc;
    padding: 5% 0;
}
#mycontents_area.member_list .member_list_area .memberOrderBloc table.memberOrderDetail th {
    background: #f0f0f0
}
#mycontents_area.member_list table td, #mycontents_area.member_list table th {
    padding: 2px 2px;
    font-size: 13px;
}

/* 店舗登録（member_change.php）
----------------------------------------------- */
a.btn-normal.btn_inputzip {
    width: 150px;
    font-size: 12px;
    border-radius: 3px;
    padding: 5px;
    background: #333;
    font-weight: normal;
    text-shadow: none;
    color: #fff;
}
a#codeAddress, a#mapAddress {
    border-bottom: 1px solid #543719;
    line-height: 1.2em;
    display: inline-block;
}

#mycontents_area[class^="member_"] dd .raku2_member_change_select {
    height: initial;
}

/* 店舗登録確認ページ（member_change.php）
----------------------------------------------- */
div#mycontents_area.member_change_conf table {
    margin: 5%;
    width: 90%;
}
div#mycontents_area.member_change_conf table th {
    text-align: left;
}

/* スタッフ一覧（member_staff.php）
----------------------------------------------- */
#mycontents_area.member_staff .member_staff_list {
    font-size: 12px;
    margin: 5%;
}
#mycontents_area.member_staff .member_staff_list table td.staff_code {
	text-align: center;
}

/* スタッフ編集（member_staff_change.php）
   スタッフ確認（member_staff_conf.php）
----------------------------------------------- */
#mycontents_area.member_staff_change table,
#mycontents_area.member_staff_change_conf table {
    font-size: 12px;
    margin: 5%;
    width: 90%;
}
#mycontents_area.member_staff_change table th,
#mycontents_area.member_staff_change_conf table th {
	text-align: left;
}

/* 会員一覧（member_customer.php）
----------------------------------------------- */
#mycontents_area.member_customer .member_customer_list {
    font-size: 12px;
    margin: 5%;
}
#mycontents_area.member_customer .member_customer_list table td.customer_code {
    text-align: center;
}
#mycontents_area.member_customer .member_customer_list table td p.customer_name {
    font-size: 14px;
    margin-bottom: 8px;
    padding-bottom: 5px;
    border-bottom: solid 1px #e9e9e9;
}

/* 売上一覧（member_sales.php）
----------------------------------------------- */
#mycontents_area.member_sales #search_keyword_top #member_list {
    margin-bottom: 5px;
}
#mycontents_area.member_sales #search_keyword_top input {
	width: 40%;
}
#mycontents_area.member_sales #sales_total {
    font-size: 12px;
    margin: 5%;
}
#mycontents_area.member_sales #sales_total table#sales_total_detail td {
	text-align: right;
}
#mycontents_area.member_sales #sales_total + .pagenumber_area {
    margin-bottom: 5%;
}
#mycontents_area.member_sales .sales_detail_list {
    padding: 5%;
    font-size: 12px;
    border-bottom: solid 1px #e9e9e9;
}
#mycontents_area.member_sales .pagenumber_area + .sales_detail_list {
    border-top: solid 1px #e9e9e9;
}
#mycontents_area.member_sales .sales_detail_list .sales_info {
    margin-bottom: 10px;
}
#mycontents_area.member_sales .sales_detail_list .sales_info span.item_subtotal {
    margin-right: 15px;
}
#mycontents_area.member_sales .sales_detail_list .sales_order_teiki p img {
    vertical-align: text-bottom;
}

/* 定期一覧（member_sales.php）
----------------------------------------------- */
#mycontents_area.member_periodical_order #search_keyword_top input {
	width: 40%;
}
#mycontents_area.member_periodical_order #search_keyword_top #search_periodical_status {
	margin-bottom: 5px;
}
#mycontents_area.member_periodical_order #search_keyword_top #search_periodical_status input[type="checkbox"] {
	width: auto;
}

/* 購入店舗・スタッフ、購入者情報 */
#mycontents_area.member_periodical_order .periodical_history_list .periodical_order_cycle {
    font-size: 12px;
}
#mycontents_area.member_periodical_order .periodical_history_list .periodical_sales_info {
    font-size: 11px;
    border-bottom: solid 1px #ccc;
    border-top: solid 1px #ccc;
    padding: 5px 0;
    margin: 4px 0;
}
#mycontents_area.member_periodical_order .periodical_history_list .periodical_detail_info .next_shipping_date {
    margin: 15px 0 0;
}

/* お支払明細一覧（member_payments.php）
----------------------------------------------- */
#mycontents_area.member_payments .paymants_detail_list {
    padding: 5%;
    font-size: 12px;
    border-bottom: solid 1px #e9e9e9;
}
#mycontents_area.member_payments .pagenumber_area .paymants_detail_list {
    border-top: solid 1px #e9e9e9;
}
#mycontents_area.member_payments .paymants_detail_list {
    margin-bottom: 10px;
}
#mycontents_area.member_payments .paymants_detail_list {
    margin-right: 15px;
}
#mycontents_area.member_payments .paymants_detail_list {
    vertical-align: text-bottom;
}

/* クレジットカード情報更新
----------------------------------------------- */
.teiki_used_msg{
    border: solid #f00;
    border-width: 3px 3px 3px;
    text-align: center;
    color: #f00;
    padding: 5px 0px;
    margin: 3px
}

.teiki_attention{
    border: solid #f00;
    text-align: center;
    color: #f00;
    padding: 0 0 5px 0px;
    margin: 3px;
}

.teiki_att_upper{
    border-width: 3px 3px 1px;
    background: #fee;
    font-weight: bold;
}

.teiki_att_lower{
    border-width: 0px 3px 3px;
}

p.no_regist_card {
    margin: 15px 5% 35px;
}

/* 注文キャンセル
----------------------------------------------- */
.raku2_order_cancel_bloc,
.raku2_order_cancel_upper_message {
    margin: 5%;
}
#mycontents_area.raku2_order_cancel textarea[name="cancel_memo"] {
    width: 96%;
    min-height: 70px;
}

.raku2_order_cancel_confirm_lower {
    margin-top: 5%;
}

/* 
   お届け日変更画面
----------------------------------------------- */
#mycontents_area .raku2_change_shipping_date_bloc {
	margin: 5%;
}

#mycontents_area #change_shipping_date {
	margin: 5% 0;
}

#mycontents_area .raku2_current_shipping_date {
	padding: 5%;
	border: solid 1px #ccc;
	margin-bottom: 5px;
}

/* 営業担当者プロフィール
----------------------------------------------- */
#mycontents_area section.profile {
    padding: 3%;
    box-shadow: 0 0 6px #cccccc;
    border-radius: 10px;
}
#mycontents_area .profile-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
#mycontents_area .profile-image {
    width: 20%;
}
#mycontents_area .profile-image img {
    border-radius: 50%;
    overflow: hidden;
    width: 100%;
}
#mycontents_area .profile-txt {
    width: 65%;
    padding-left: 3%;
    font-size: 13px;
    line-height: 1.4;
}
#mycontents_area .profile-txt p {
    margin-bottom: 10px;
}
#mycontents_area .profile-txt .name {
    font-size: 16px;
    font-weight: bold;
    margin: 3% 0;
}
@media (max-width: 600px) {
    #mycontents_area .profile-container {
        flex-direction: column;
    }
    #mycontents_area section.profile {
        padding: 6%;
        box-shadow: none;
    }
    #mycontents_area .profile-image {
        width: 40%;
    }
    #mycontents_area .profile-txt {
        width: 100%;
        padding-left: 0;
        text-align: center;
    }
}

/* 発行クーポン一覧（member_coupon.php）
----------------------------------------------- */
#mycontents_area[class^="member_"] #search_keyword_area .raku2_search_member_coupon_status,
#mycontents_area[class^="member_"] #search_keyword_area .raku2_search_member_coupon_yuko,
#mycontents_area[class^="member_"] #search_keyword_area .raku2_search_member_coupon_orderby {
    margin-top: 10px;
    font-size: 12px;
}

#mycontents_area #search_keyword_area .raku2_search_member_coupon_orderby select{
    height: auto;
}
#mycontents_area.member_coupon .member_coupon_list {
    font-size: 12px;
    margin: 5%;
}
#mycontents_area.member_coupon .member_coupon_list table td.coupon_code {
	text-align: left;
}

#mycontents_area.member_coupon .member_coupon_list table td.raku2_member_coupon_detail p:not(:first-child) {
    margin-top: 5px;
}

/* 発行クーポン編集（member_coupon_change.php）
----------------------------------------------- */
#mycontents_area.member_coupon_change table {
    font-size: 12px;
    margin: 5%;
    width: 90%;
}
#mycontents_area.member_coupon_change table th {
	text-align: left;
}
#mycontents_area #condition3_category_id {
    width: 100%;
}
#mycontents_area #condition3_category_id select {
    font-size: 12px;
    height: auto;
}
#mycontents_area div[class^="raku2_member_coupon_change"] select {
    font-size: 12px;
    margin: 10px 0px;
}
#mycontents_area div[class^="raku2_member_coupon_change_auto"] {
    margin: 10px 0px;
    height: 20px;
}
#mycontents_area div[class^="raku2_member_coupon_change_auto"] .raku2_auto_date_link {
    margin: 5px 10px;
}

.raku2_member_coupon_change_detail.raku2_member_coupon_start_time,
.raku2_member_coupon_change_detail.raku2_member_coupon_start_date_auto {
	margin-top: 10px;
}
/* 発行クーポン確認（member_coupon_conf.php）
----------------------------------------------- */
#mycontents_area.member_coupon_change_conf table {
    font-size: 12px;
    margin: 5%;
    width: 90%;
}
#mycontents_area.member_coupon_change_conf table {
	text-align: left;
}