@charset "UTF-8";
/* Easy myShop
 * 管理画面 スタイルシート
 *
 * 作成者 : SR)A.Kogiso
 * 作成日 : 2026/06/03
 *
 * Version :
 *    01.00.00 2026/06/03 SR)A.Kogiso 新規作成
 */

/* Responsive DESIGN TEMPLATE
    system research
______________________________________________________________________________*/

:root {

  --font_family: "Noto Sans JP", sans-serif;
  --border_color: #ededed;
  --mark_color: #2474f2;
  --background_color_gray: #F0F0F4;
  --border: 1px solid #ededed;
  /* 背景 */
  --background_color: #FFF;
  --background_color_sp: #F5F5F8;

  /* 文字色 */
  --font_color: #707070;
  --font_color_off: #B9B9B9;
  --font_color_icon: #C5C5C5;
  /* 文字サイズ */
  --font_size_std: 14px;
  --font_size_inp: 16px;
  /*  --font_size_page_ttl: 28px;*/
  --font_size_ttl: 16px;
  /*  --font-size_set: 13px;*/
  --font_size_sub: 12px;
  --font_size_em: 12px;
  --font_size_sp_ttl: 12px;
  /* 行間 */
  --line_height: 1.4;

  /* テーブル */
  --tbl_th_color: #fff;
  --tbl_th_background: #55a6bb;
  --tbl_th_hvr_background: #4d7581;
  --tbl_tr_kind_background: #cde1e4;
  --tbl_body_background: #fff;
  --tbl_body_hvr_background: #eff8ff;
  --tbl_border: 1px solid var(--border_color);
  /*  --tbl_tr_kind_frame: #BCC8C0;*/

  /* ボタン */
  --btn_ok_color: #21a6e8;
  --btn_general_color: #595e60;
  --btn_hvr_color: #fff;
  --btn_hvr_background: #4d7581;
  --btn_hvr_border: #4d7581;
  --btn_view_color: #FFF;
  --btn_view_background: #68B3C8;

  /* リンク */
  --a_color: #0b57d0;
  --a_hover_color: #0c66f6;
  /* 注釈 */
  --em_color: gray;
  --em_font-style: normal;
  --em_font-size: 13px;
  /*--em_line-height: 1.65;*/
  --em_line-height: 1.4;
  /* ? 情報 */
  --excl_color: #11b0ff;

  /* タブ */
  --tab_color: #55A6BB;
  --tab_background: var(--tbl_body_background);
  --tab_sel_background: #F3FDFF;
  --tab_non_sel_border: #E6E6EB;
  --tab_cont_background: var(--background_color_gray);
  /* フィールドセット */
  --fieldset_background: #E6E6EB;

  /* テキストエリア */
  /*--text_size_xs: 10%;*/
  /*--text_size_s: 30%;*/
  --text_size_m: 50%;
  --text_size_l: 95%;
  --text_size_full: 100%;

  --text_size_5: 120px;
  --text_size_10: 200px;
  --text_size_20: 380px;
  --text_size_30: 520px;
  --text_size_50: 850px;
  --text_size_100: 200px;

  --text_size_num_3: 55px;
  --text_size_num_4: 70px;
  --text_size_num_6: 80px;
  --text_size_num_8: 103px;
  --text_size_num_9: 110px;

  /* 初期値設定エリア */
  --initial_setting_background: #FDF4CB;

}

/* padding,borderを幅指定の内側にする */
*,
*::before,
*::after {
  box-sizing: border-box;
}
.cleditor *:not(textarea) {
  box-sizing: initial;
}

/* 入力欄 */
input[type=text],
input[type=search],
input[type=tel],
input[type=url],
input[type=email],
input[type=password],
input[type=datetime],
input[type=date],
input[type=month],
input[type=week],
input[type=time],
input[type=datetime-local],
input[type=number],
select,
textarea,
.tagify-container {
  margin: 1px;
  padding: 12px;
  font-size: var(--font_size_inp);
  /*  line-height: var(--line_height);*/
  outline: none;
  border: 1px solid #d0d0dd;
  border-radius: 4px;
  box-sizing: border-box;
}
/* スマホ表示の数値入力 */
.sp input[type=text].price_base,
.sp input[type=text].price_min,
.sp input[type=text].price_max {
  padding: 12px 8px;
}

.price_min
@media only screen and (min-device-width: 699px) {
  textarea {
    font-size: var(--font_size_std);
  }
}
input[type=submit],
input[type=reset],
input[type=button],
input[type=image] {
  cursor: pointer;
}
input[type="radio"],
input[type="checkbox"] {
  margin: 0px 3px 0px 5px;
  vertical-align: middle;
}
input[type=text]:not([readonly]):focus,
input[type=search]:not([readonly]):focus,
input[type=tel]:not([readonly]):focus,
input[type=url]:not([readonly]):focus,
input[type=email]:not([readonly]):focus,
input[type=password]:not([readonly]):focus,
input[type=datetime]:not([readonly]):focus,
input[type=date]:not([readonly]):focus,
input[type=month]:not([readonly]):focus,
input[type=week]:not([readonly]):focus,
input[type=time]:not([readonly]):focus,
input[type=datetime-local]:not([readonly]):focus,
input[type=number]:not([readonly]):focus,
select:not([readonly]):focus,
textarea:not([readonly]):focus {
  border: 1px solid #e9ae3e;
  color: #000;
  background-color: #ffffd8;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ffd));
}
input[type=text][readonly],
textarea[readonly],
select[readonly] {
  color: #000;
  background-color: #EEE;
}
textarea:disabled,
input:disabled,
select:not([readonly]):disabled {
  color: #333;
  background-color: #ababab;
  border-color: transparent;
  opacity: .35;
}
textarea:disabled,
input:disabled:not([type="button"]),
select:not([readonly]):disabled {
  color: transparent;
}
select {
  max-width: 100%;
}
option[hidden] {
  display: none;
}

:placeholder-shown {
  color: #bbb;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.05);
}
::-webkit-input-placeholder {
  color: #bbb;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.05);
}
:-moz-placeholder {
  color: #bbb;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.05);
}
::-moz-placeholder {
  color: #bbb;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.05);
}
:-ms-input-placeholder {
  color: #bbb;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.05);
}
::selection {
  color: #058eb1;
  background: #b5d3e6;
}

/* 全体 */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: var(--font_family);
  font-size: var(--font_size_std);
  color: var(--font_color);
  line-height: var(--line_height);
  border: 0;
}
body{
  background-color: var(--background_color);
}
/* 印刷時(余分な白紙を出力しないため) */
@media print {
  html, body {
    height: auto;
  }
}

/* 画面全体 */
body.sp,
body.sp:before {
  background: var(--background_color_sp);
}

/* 外枠 */
.pc .outer_frame {
  display: inline-block;
  min-width: 100%;
  background: rgba(255, 255, 255, 0.7);
}

/* 画面タイトル */
.view_title {
  color: #222222;
  border-bottom: 1px solid var(--border_color);
}
.sp .view_title {
  border-bottom: none;
}
.view_title a {
  margin: 0;
  padding: 10px 6px;
  text-decoration: none;
  color: inherit;
}
.view_title a:hover,
.view_title a:focus,
.view_title a:active {
  color: inherit;
  border-bottom: 1px solid;
}

/* ページタイトル */
.page_title {
  position: relative;
  vertical-align: middle;
  margin: 0 16px;
  padding-left: 17px;
  font-size: 28px;
}
.page_title:before {
  content: '';
  position: absolute;
  margin: auto 0;
  top: 0;
  bottom: 0;
  left: 0;
  width: 6px;
  height: 1.6em;
  border-radius: 3px;
  background: var(--btn_view_background);
  opacity: 0.6;
}
.sp .page_title {
  margin: 0;
  padding-left: 8px;
  font-size: 18px;
  font-weight: bold;
}
.sp .page_title:before {
  width: 3px;
  height: 1.4em;
}

/* コンテンツエリア */
.pc .view_title, .pc .content_pane{
  padding: 10px 12px;
  min-width: 950px;
}
.sp .view_title, .sp .content_pane {
  padding: 3px 12px 5px;
  min-width: 350px;
}


/** 一覧、設定 **/
/* 基本構造 */
.data_table .row {
  display: grid;
  gap: 8px;
  align-items: center;
  /*padding: 12px 10px;*/
  padding: 10px;
  background: var(--tbl_body_background);
  border-bottom: var(--tbl_border);
}
.sp .data_table .row {
  gap: 4px;
}
/* ホバー行の色変更 */
.data_table .row:hover:not(.row_header) {
  background: var(--tbl_body_hvr_background);
}
/* ヘッダ */
.data_table .row_header,
.inner_table .row_header {
  text-align: center;
  padding: 1rem 0.5rem;
  background: var(--tbl_th_background);
  color: var(--tbl_th_color);
}
/* ヘッダ入れ子 */
.list_table .row_header .row_header {
  padding: 0;
  border-bottom: none;
}
/* SPヘッダ */
.sp .list_table .row_header {
  display:none;
}
/* ヘッダ内のリンク 必要かも */
/**table.grid > thead > tr > th > a,
table.grid > tfoot > tr > th > a,
table.grid > tbody > tr > th > a,
table.grid > thead > tr > td > a,
.grid_head a {
  color: #d5fbfd;
}**/


/* 画面を縮めたときに中身がはみ出すのを防ぐ */
.row > * {
  min-width: 0;
}

/** 一覧 **/
/* PC横表示、SP縦表示用の入れ子 */
.pc .list_table .pc_row_nest {
  display: grid;
  gap: 8px;
  align-items: center;
}

/** 設定 **/
/* 項目名と設定欄の幅 */
.pc .set_table .row:not(.row_header) {
  grid-template-columns: 15rem minmax(15rem, 1fr);
}
.pc .set_table_short .row:not(.row_header) {
  grid-template-columns: 10rem minmax(10rem, 1fr);
}
.pc .set_table_min .row:not(.row_header) {
  grid-template-columns: 7rem minmax(10rem, 1fr);
}
.pc .set_table_wide .row:not(.row_header) {
  grid-template-columns: 18rem minmax(15rem, 1fr);
}
/* 項目名列 */
.data_table .cell_ttl {
  /*font-weight: 600;*/
  font-weight: bold;
}
.pc .data_table .cell_ttl {
  padding-left: 16px;
}
.sp .data_table .cell_ttl {
  font-size: var(--font_size_sp_ttl);
}
.sp .cell:not(.cell_ttl) {
  padding-left: 8px;
}

/** 設定欄内の設定表 **/
/* 基本構造 */
.pc .inner_table {
  display: grid;
}
.inner_table .inner_row {
  display: grid;
  gap: 4px;
  align-items: center;
}
/* 項目名と設定欄の幅 */
.pc .inner_table .inner_row {
  grid-template-columns: 5rem minmax(0, 1fr);
}

/** 設定欄内のテーブル **/
/* 基本構造 */
table.min_table {
  border-collapse: collapse;
  background: #fff;
}
.sp table.min_table {
  width: 100%;
}
.min_table td {
  padding: 4px 4px;
  border: 1px solid #bbb;
}

/* 設定系テーブル */
.min_set_table {
  border: 3px var(--tbl_th_background) solid;
}
.sp .min_set_table .row_head {
  font-size: var(--font_size_sub);
}
.min_set_table td {
  padding: 12px 4px;
  border: none;
  border-bottom: 1px var(--tbl_th_background) solid;
}
.pc .min_set_table tbody td {
  padding: 12px 8px;
}
table.min_set_table .row_head {
  background-color: var(--tbl_th_background);
  color: var(--tbl_th_color);
}
.min_set_table .row_head th,
.min_set_table .row_head td {
  padding: 12px 8px;
  font-weight: normal;
  text-align: initial;
}
.min_set_table .set_add_tr {
  background-color: var(--tbl_th_background);
  color: var(--tbl_th_color);
  text-align: center;
}
/* 情報系テーブル */
table.min_info_table .col_head,
table.min_info_table .row_head {
  background-color: #eee;
}

/* テーブルをスクロールさせる */
.table_scroll {
  overflow-x: auto;
}
.sp .table_scroll table:not(.nobr) {
  min-width: 900px;
}

/** フィールドセット **/
fieldset {
  margin: 8px 2px;
  background-clip: padding-box;
  border: 1px solid #ddd;
  border-radius: 8px;
  min-width: 0;
}
legend {
  font-weight: bold;
}

/** タブ **/
ul.tab {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 -1px;
  padding: 10px 0 0 0;
  list-style-type: none;
  overflow: hidden;
}
/** タブ PC **/
.pc .tab li {
  position: relative;
  margin: 4px -4px -4px 5px;
  padding: 10px 16px 4px;
  height: 46px;
  box-sizing: border-box;
  transition: all 0.05s ease-in-out;
  z-index: 0;
}
.pc .tab li:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background: #eef2f4;
  background: linear-gradient(to bottom, #eef2f4 50%, #dbdfe0 90%);
  border: 1px solid #D6D8DA;
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
  z-index: -1;
  box-sizing: initial;
}
/* 無効タブ */
.pc .tab .non_sel_tab:hover,
.pc .tab .non_sel_tab:focus {
  color: var(--btn_hvr_color);
  background: none;
  transform: translatey(-9px);
  cursor: pointer;
}
.pc .tab .non_sel_tab:hover:after,
.pc .tab .non_sel_tab:focus:after {
  background: var(--btn_hvr_background);
}
/* 有効タブ */
.pc .tab .sel_tab {
  color: #333;
  z-index: 0;
  border-bottom-color: transparent;
  transform: translatey(-5px);
}
.pc .tab .sel_tab:after {
  background: #FFF;
}
/* タブの中身 */
.pc .tab_content {
  margin: 0;
  padding: 10px;
  border: 1px #D6D8DA solid;
  background: #fff;
}
/** タブ SP **/
.sp .tab li {
  position: relative;
  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 .non_sel_tab:hover,
.sp .tab .non_sel_tab:focus {
  color: var(--font_color);
  background-color: var(--tab_sel_background);
  border-color: var(--tab_color);
}
/* 有効タブ */
.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;
}

/** ボタン配置 **/
/* 画面上部ボタン */
.top_buttons {
  margin: 10px 0 1.6em;
}
/* 画面上部ボタン間のスペース */
.top_buttons_margin{
  margin-left: 20px;
}
/* 画面下部ボタン */
.bottom_buttons {
  margin: 16px auto;
  text-align: center;
}
.sp .bottom_buttons .btn-dlg {
  margin-top: 5px;
}
/* 画面上部リンク */
.top_links {
  padding: 3px 18px;
  font-size: 14px;
}

/** ダイアログ **/
/* 要素 */
.own_dlg {
  display: none;
}
/* SP 横幅 */
.sp .ui-dialog {
  width: 99vw !important;
}
.ui-dialog-title,
.confirm-title {
  color: #222222;
}
[aria-describedby="Confirm_Dlg"] .ui-dialog-titlebar-close {
  display: none;
}
.ui-widget-content .own_dlg {
  font-family: var(--font_family);
  font-size: var(--font_size_std);
  line-height: var(--line_height);
}
.ui-widget select {
  font-family: var(--font_family);
  font-size: var(--font_size_inp);
}
/* ダイアログ内の文字サイズの調整 */
@media only screen and (max-device-width: 700px) {
  .ui-widget input:not[type=button], .ui-widget select, .ui-widget textarea {
    font-size: var(--font_size_inp);
    /*font-size: 13px;*/
  }
}
@media only screen and (max-device-width: 700px) {
  .ui-widget input[type=button] {
    font-size: var(--font_size_std);
    /*font-size: 13px;*/
  }
}

/*ダイアログのクローズボタン*/
.ems_close_icon {
  margin: 0;
  top: 0;
  right: 0;
  width: 30px;
  padding: 1px;
  height: 28px;
  border: 0;
  border-radius: 0 3px 0 0;
  background: #413941;
  transition: 0.15s;
  min-width: 54px;
  font-weight: bold;
  color: #FFF;
}
.ems_titlebar_close_btn {
  height: 18px;
}
.ems_titlebar_close_btn:before,
.ems_titlebar_close_btn:after {
  background-color: #FFF !important;
}
/* ダミーインプットを消す */
.dlg_input_dummy,
.dlg_input_dummy input {
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/** 印刷用 TODO 要調査 **/
@media print {
  .own_navi_top {
    width: 100%;
    position: fixed;
    background-color: #FEFEFE;
    z-index: 1001;
  }
  .body,
  .list_id {
    color: #000;
  }
}

/* スマホ非表示 */
.sp .help_pane_show, /* ヘルプ欄 */
.sp .helpsize_pane, /* ヘルプ欄 */
.sp .help_size, /* ヘルプ欄 */
.sp .txt_all_order_search /*  全注文検索の入力欄*/{
  display: none !important;
}

/** ヘルプ消したら消す **/
.help_value ul {
  padding: 0 0 0 2em;
}
/* インラインヘルプ */
.helpsize_pane {
  width:20px;
  background-color:#E8E8E8;
  color:#607070;
  text-align:center;
  cursor:pointer;
  font-weight:bold;
}
.helpsize_pane:hover {
  background: #D6D6D6;
  box-shadow: 2px 0px 3px #A3A3A3 inset;
}
.help_size {
  display:block;
  width:10px;
  margin:0px 5px;
  background-image:url(../img/icn_op_cl.png);
  background-repeat: no-repeat;
  text-indent:-9999px;
}
.helpsize_big {
  background-position:-10px;
}
.help_pane_show {
  width: 30%;
  background: #eee;
  color: var(--font_color);
  /*color: #333;*/
  vertical-align: top;
  transition: all 180ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.help_pane_hide {
  width:0%;
  background-color: #ECF0F1;
  padding:0px !important;
  transition: all 180ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}