@charset "UTF-8";
/* Easy myShop
 * 管理画面 スタイルシート
 *
 * 作成者 : SR)A.Kogiso
 * 作成日 : 2025/02/19
 *
 * Version :
 *    01.00.00 2025/02/19 SR)A.Kogiso 新規作成
 */

/* Responsive DESIGN TEMPLATE
    system research
______________________________________________________________________________*/

:root {

  --background_color: #F5F5F8;
  --btn_color_apply: #21A6E8;

  /*--tbl_head_background: #55a6bb;*/
  /*--tbl_head_color: #fff;*/
  --tbl_head_background: var(--tbl_th_background);
  --tbl_head_color: var(--tbl_th_color);

  --tbl_body_background: #fff;
  --tbl_body_hvr_background: #eff8ff;
  --tbl_border: 1px solid var(--border_color);

  --tab_color: #55A6BB;
  --tab_background: var(--tbl_body_background);
  --tab_sel_background: #F3FDFF;
  --tab_non_sel_border: #E6E6EB;
  --tab_cont_background: #F0F0F4;

  --fieldset_background: #E6E6EB;

  --text_size_xs: 10%;
  --text_size_s: 30%;
  --text_size_m: 50%;
  --text_size_l: 95%;
  --text_size_full: 100%;

}

/* 画面全体 */
body.sp,
body.sp:before {
  background: var(--background_color);
}
.sp table.title_box {
  background: initial;
}
.sp .page_title {
  margin: 0;
  padding-left: 8px;
  font-size: 18px;
  font-weight: bold;
}
.sp .page_title:before {
    width: 3px;
    height: 1.4em;
}

.sp table.title_box > thead > tr > th,
.sp table.title_box > tfoot > tr > th,
.sp table.title_box > tbody > tr > th,
.sp table.title_box > thead > tr > td,
.sp table.title_box > tfoot > tr > td,
.sp table.title_box > tbody > tr > td {
  padding: 3px 12px 5px;
  vertical-align: top;
}
.sp .view_title {
  border-bottom: none;
}


/* PC・SPのみ表示 */
.pc .sp_only,
.sp .pc_only {
  display: none !important;
}

/* 文字サイズ */
.font_size_page_ttl {
  font-size: var(--font_size_page_ttl);
}
.font_size_ttl {
  font-size: var(--font_size_ttl);
}
.font_size_sub,
.sp .sp_font_size_sub {
  font-size: var(--font_size_sub);
}
.font_size_em {
  font-size: var(--font_size_em);
}

.info_ttl,
.sp .sp_info_ttl,
.sp .sp_set_ico {
  font-size: var(--font_size_ttl);
  font-weight: bold;
}
.sp .sp_info_main,
.sp .sp_btn_text,
.sp .sp_btn_text .fa {
  font-weight: bold;
}

.info_sub,
.pc .pc_info_sub,
.sp .sp_info_sub {
  font-size: var(--font_size_sub);
}

/* アイコンポインター */
.clickable {
  cursor: pointer;
}

/* 設定欄間のスペース */
.spacing_small {
  margin-left: 0.5rem;
}
.spacing_medium {
  margin-left: 1.5rem;
}
.spacing_large {
  margin-left: 3rem;
}

/* 縦並び */
.pc .pc_vertical,
.sp .sp_vertical {
  display: flex;
  flex-direction: column;
}
/* 横並び */
.horizontal,
.pc .pc_horizontal,
.sp .sp_horizontal {
  display: flex;
}

.sp .sp_ttl_horizontal {
  display: flex;
  align-items: center;
}

.d-block {
  display: block;
}


/* 一覧テーブル */
/* 標準 */
.list_table .row {
  display: grid;
  gap: 8px;
  align-items: center;
  padding: 12px 10px;
  background: var(--tbl_body_background);
  border-bottom: var(--tbl_border);
}
.list_table .row:hover:not(.header) {
  background: var(--tbl_body_hvr_background);
}
/* ヘッダ */
.list_table .header {
  text-align: center;
  padding: 1rem 0.5rem;
  background: var(--tbl_head_background);
  color: var(--tbl_head_color);
}
.list_table .header .header {
  padding: 0;
  border-bottom: none;
}
/* SPヘッダ */
.sp .list_table .header {
  display:none;
}

/* PC横表示、SP縦表示用の入れ子 */
.pc .list_table .pc_row_nest {
  display: grid;
  gap: 8px;
  align-items: center;
}

/* 設定 */
.pc .list_table.list_set .row {
  grid-template-columns: auto;
}
.sp .list_table.list_set .row {
  grid-template-columns: 1fr 1fr;
  border: none;
  border-radius: 8px;
}

/* 右寄せ */
.cell_right,
.sp .sp_cell_right {
  justify-self: end;
}
.sp_flex_right {
  margin-left: auto;
}
/* 中央寄せ */
.cell_center {
  justify-self: center;
}

/* ソート */
.pc .drag_row:hover,
.sp .sp_drag_cell:hover {
  cursor: move;
}
.drag_row {
  user-select: none;
}
.sp_drag_cell {
  display: flex;
  align-items: center;
  height: 100%;
}

/* 下部追加ボタン */
.sp .sp_bottom_btn {
  width: 100%;
  text-align: center;
}

/* 画面遷移・SP設定ボタン */
.ico_arrow {
  font-family:'FontAwesome';
  font-size: 1.2em;
  font-weight: bold;
  margin-left: 0.5em;
}
.go_set,
.open_info,
.close_info {
  color: var(--font_color_icon);
}
.go_set:before,
.go_set_color:before {
  content: '\f105';
}
/* 展開ボタン */
.open_info:before,
.open_info_color:before {
  content: '\f107';
}
/* 閉じるボタン */
.close_info:before,
.close_info_color:before {
  content: '\f106';
}

/* 設定状況表示 */
.set_on {
  font-weight: bold;
}
.set_off {
  color: var(--font_color_off);
}
.set_text {
  color: var(--font_color_off);
  font-weight: bold;
}

/* SP フィールドセット */
.sp fieldset {
  /*background: #F5F5F8;*/
  background: var(--fieldset_background);
  border: none;
  border-radius: 0;
  margin: 0 0 20px 0;
  padding: 35px 12px 15px 12px;
  position: relative;
}
.sp legend {
  position: absolute;
  top: 10px;
  font-size: var(--font_size_ttl);
}

/* タブ */
.sp ul.tab {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 -1px;
  padding: 10px 0 0 0;
  list-style-type: none;
  overflow: hidden;
}
/* pcデザインを消す */
.sp ul.tab > li.sel_tab,
.sp .tab li {
   z-index: initial;
   transform: initial;
   margin: initial;
   height: initial;
}
.sp ul.tab > li.non_sel_tab:hover,
.sp ul.tab > li.non_sel_tab:focus {
  color: var(--font_color);
  background: initial;
  transform: initial;
  background-color: var(--tab_sel_background);
  border-color: var(--tab_color);
}
/* 共通 */
.sp .tab li {
  flex-grow: 1;
  padding: 1rem 0.5rem;
  font-size: var(--font_size_ttl);
  font-weight: bold;
  text-align: center;
  background-color: var(--tab_background);
  border-bottom: solid 3px;
  border-color: var(--tab_non_sel_border);
}
/* 有効タブ */
.sp .tab .sel_tab {
  color: var(--tab_color);
  background-color: var(--tab_sel_background);
  border-color: var(--tab_color);
}
/* タブの中身 */
.sp .tab_content{
  padding: 0;
  border: none;
  background-color: var(--tab_cont_background);
  display: flow-root;
}
/* svgアイコン */
.tab_svg {
  width: 20px;
  vertical-align: bottom;
}
.pc ul.tab > li.non_sel_tab:hover .tab_svg,
.pc ul.tab > li.non_sel_tab:focus-within .tab_svg {
  background: #eef2f4;
  background: linear-gradient(to bottom, #eef2f4 50%, #dbdfe0 90%);
}

/* (?)情報 */
.info {
  /*color: var(--excl_color);*/
  color: #11b0ff;
  cursor: pointer;
  font-size: var(--font_size_em);
}

/* 設定の補足情報 */
.sup_info {
  margin-bottom: 8px;
}

/* 開店中等のボタン */
.sp input.info_btn,
.sp span.info_btn {
  /*padding: 5px 20px;*/
  font-size: var(--font_size_std);
  border-radius: 4px;
  /*font-weight: bold;*/
  /*border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;*/
  text-decoration: none;
  display: inline-block;
  position: relative;
  /*margin-right: .1em;*/
  vertical-align: middle;
  text-align: center;
  user-select: none;
  overflow: visible;
  display: inline-block;
}
.sp .account_info_open .info_btn {
  padding: 5px 20px;
  font-weight: bold;
}
.sp input.btn_prepare {
  color: #E05153;
  background: #FFE3E3;
  border-color: #E05153;
}
.sp input.btn_open {
  color: #fff;
  background: #16C4D4;
  border-color: #00A9B8;
}
.sp input.btn_close {
  color: #BFBFBF;
  background: #e0e0e0;
}
/* 申し込みボタン */
.sp input.info_btn.application_btn,
.sp .info_btn.application_btn {
  padding: 5px 10px;
  color: #0C66F6;
  background: #EEF9FF;
  border-color: #0C66F6;
  font-size: 13px;
  font-weight: normal;
}

/* 各一覧画面の列幅指定 */
/* 共通 レコード無し */
.pc .list_table .none_row {
  padding: 1rem 0.5rem;
  text-align: center;
  background: var(--tbl_body_background);
  border-bottom: var(--tbl_border);
}
.sp .list_table .none_row {
  padding: 2rem 0.5rem;
  text-align: center;
  background: #DCDCE2;
  color: #A0A0A0;
}
/* 支払方法一覧 */
.pc .payment_list .row {
  grid-template-columns: 5rem 4rem 1fr 8rem;
}
.pc .payment_list .pc_row_nest {
  grid-template-columns: minmax(22rem, 1fr) minmax(20rem, 1fr) 7rem;
}
.sp .payment_list .row {
  grid-template-columns: 4em 1fr 4.5em;
}

/* 配送方法一覧 */
/* 共通設定 */
.sp .transport_list .select_set {
  margin-bottom: 20px;
}
/* 基本送料 */
.pc .transport_list .transport .row {
  	grid-template-columns: 4rem 1fr minmax(7rem, auto);
}
.pc .transport_list .transport .pc_row_nest {
  grid-template-columns: minmax(20rem, 1fr) minmax(10rem, 17rem) minmax(4rem, 7rem);
}
.pc .transport_list .transport .shipping .pc_row_nest {
  grid-template-columns: 5rem minmax(20rem, 1fr) minmax(10rem, 17rem) minmax(4rem, 7rem);
}
.pc .transport_list .transport .shippind_auto .pc_row_nest {
  grid-template-columns: minmax(20rem, 1fr) minmax(10rem, 17rem) minmax(4rem, 7rem);
}
.sp .transport_list .transport .row {
  grid-template-columns: 4rem 1fr 2rem;
}
.pc .trans_name_area {
  align-items: end;
}
/* 例外送料 */
.pc .transport_list .postage .row {
  	grid-template-columns: 4rem 1fr minmax(4rem, 7rem);
}
.pc .transport_list .postage .pc_row_nest {
  grid-template-columns: minmax(20rem, 1fr) minmax(10rem, 17rem) minmax(4rem, 7rem);
}
.sp .transport_list .postage .row {
  grid-template-columns: 4rem 1fr 2rem;
}

/* メール設定 注文 */
.pc .mailtemp_list .row_out {
  display: grid;
  grid-template-columns: 15rem 1fr;
  align-items: center;
}
.pc .pc_mail_kind {
  display: flex;
  align-items: center;
  height: 100%;
  border-bottom: var(--tbl_border);
}

.pc .mailtemp_list .row {
  grid-template-columns: 1fr 8rem;
}
.pc .mailtemp_list .join_cell {
  grid-template-columns: 1fr;
}
.pc .order_mailtemp .mailtemp_list .row:first-child {
  grid-template-columns: 1fr;
}
.pc .mailtemp_list .pc_row_nest {
  grid-template-columns: 15rem 7rem 1fr;
}

.sp .mailtemp_list .row {
  grid-template-columns: 1fr 2rem;
  margin: 1px;
}

.sp .send_icon_cell {
  padding-bottom: 0.5rem;
}
.sp .mailtemp_list:not(.generic_mailtemp) .cell_border_top {
  border-top: var(--tbl_border);
}
/* メールコメント */
.pc .mailtemp_list .mail_comment_list .row {
  grid-template-columns: auto 1fr auto;
}
.pc .mailtemp_list .mail_comment_list .join_cell {
  grid-template-columns: 1fr;
}
.sp .mailtemp_list .mail_comment_list .row {
  grid-template-columns: auto 1fr 2em;
}

.sp .sp_info_block {
  background-color: #D5D5D9;
  padding: 3px;
  margin: 15px 12px;
/*  margin-bottom: 16px;*/
}
.sp fieldset .sp_info_block {
  margin: 0 0 15px 0;
}
.sp fieldset .sp_info_block:last-child {
  margin-bottom: 0;
}
.sp .block_ttl {
  margin: 5px 8px;
  font-weight: bold;
}

.pc .pc_list_ttl {
  padding-left: 24px;
  font-weight: bold;
  vertical-align: middle;
}
.sp .generic_mailtemp_ttl {
  font-size: var(--font_size_sub);
  font-weight: normal;
  margin-right: 0.5em;
}

/*汎用のみにする*/
.sp .generic_mailtemp .send_icon_cell {
  display: none;
}

.add_new_mailtemp_area {
  padding: 12px;
}
.add_new_mailtemp {
  display: grid;
  grid-template-columns: 1fr 2rem;
  align-items: center;
  text-align: center;
  margin: 10px 0;
  padding: 0.5rem;
/*  color: #fff;*/
  background: #fff;
  /*border-radius: var(--sp_block_radius);*/
  border-radius: 8px;
}


/* ショップ設定 */
.sp table.grid thead,
.sp table.grid tbody,
.sp table.grid th,
.sp table.grid td,
.sp table.grid tr {
  display: block;
}
.sp .grid td.grid_row_head {
  padding: 10px 10px 0;
  border: none;
}
.sp table.grid tbody tr td {
  padding: 5px 10px 10px;
}

.set_ttl_emstag{
  margin-left: 0.5rem;
  font-size: 90%;
}
.set_ttl_btn {
  margin-left: 0.5em;
}

.ifram_law_shop_info {
  width: 100%;
  max-width: 682px;
  height: 223px;
  border:1px solid #999;
  background-color:#FFFFFF;
}
.set_text_area {
  margin-top: 10px;
}
.text_indent_one {
  margin-left: 1rem;
}


.sp .ui-dialog {
  width: 99vw !important;
}

@media only screen and (max-device-width: 700px) {
  .ui-widget input, .ui-widget select, .ui-widget textarea {
    /*font-size: 16px;*/
    font-size: 13px;
  }
}

/* テキストエリアの大きさ */
.sp .text_m {
  width: var(--text_size_m);
}
.sp .text_l {
  width: var(--text_size_l);
}
.sp .text_full {
  width: var(--text_size_full);
}

.text_break {
  overflow-wrap: break-word;
  white-space: normal;
}

/* ボタンサイズ */
.sp .btn-lg .fa {
  margin: -10px 0 -8px;
  font-size: 30px;
  vertical-align: middle;
}

.sp .account_open_section,
.sp .header_menu_button {
  color: var(--font_color);
}
.sp #before_confirm_dlg .btn-dlg {
  margin-top: 5px;
}


/* スマホ非表示 */
.sp .help_pane_show, /* ヘルプ欄 */
.sp .helpsize_pane, /* ヘルプ欄 */
.sp .help_size, /* ヘルプ欄 */
.sp .txt_all_order_search /*  全注文検索の入力欄*/{
  display: none !important;
}
