@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
______________________________________________________________________________*/

@import url("./own_pager.css");

/* PC・SPのみ表示 */
.pc .sp_only,
.sp .pc_only {
  display: none !important;
}

/* リンク */
a {
  color: var(--a_color);
  text-decoration: none;
  cursor: pointer;
  outline: none;
}
a:hover,
a:active,
a:focus {
  color: var(--a_hover_color);
  text-decoration: underline;
}

/* リンク風 */
.link_style {
  color: var(--a_color);
}
.link_style:hover {
  color: var(--a_hover_color);
  cursor: pointer;
  text-decoration:underline;
}

/* 注釈 */
em {
  display: inline-block;
  margin: 1px 0 0 1em;
  color: var(--em_color);
  font-style: var(--em_font-style);
  font-size: var(--font_size_em);
  line-height: var(--em_line-height);
  text-indent: -1em;
}
em li,
em i {
  text-indent: initial;
}
em:not(.no_indent) {
  padding-left: 1em;
}

/* 必須マーク */
.input_must {
  display: inline-block;
  margin: 0 -2px 0 0;
  padding: 3px 4px;
  height: 1.3ex;
  line-height: 0.6;
  vertical-align: baseline;
  font-family: serif;
  font-size: 18px;
  font-weight: 300;
  color: #bd6027;
  background: #fbe0cf;
  border-radius: 10px;
  cursor: help;
}
.sp .input_must {
  margin-left: 1px;
  padding: 2px 3px;
  font-size: 16px;
}

/** ソート **/
.pc .drag_row:hover,
.sp .sp_drag_cell:hover {
  cursor: move;
/*  opacity: 0.9;*/
/*  box-shadow: 0px 3px 6px -2px rgb(0 0 0 / 20%);*/
/*  box-shadow: rgba(0, 0, 0, 0.18) 0px 10px 20px 0px, rgba(0, 0, 0, 0.23) 0px 6px 6px -1px;*/
/*  transform: translateY(0);
  transition: all 0.15s ease;
  transition-property: transform, color, background, box-shadow;*/
}
.drag_row {
  user-select: none;
}
.drag_cell {
  display: flex;
  align-self: stretch;
  align-items: center;
}
.drag_icon_area {
  display: flex;
  align-self: stretch;
  align-items: center;
  border-right: var(--border);
}
.drag_info_area {
  padding-left: 4px;
}
/* ドラッグアイコン */
.drag_icon::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../svg/icon_drag.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}
.drag_icon {
  border-right: none;
  margin: 0;
  padding-right: 2px;
}

/* ドラッグ */
.no_drag {
  cursor: auto;
}

/*テスト環境限定の目印*/
.develop_mode_only,
.develop_mode_only>td {
  background:#FFE4E1;
}

/* リスト表記 */
ul, menu, dir {
  padding: 0 0 0 2em;
}
/* リストスタイルなし */
.none_list_li {
  list-style-type: none;
}
/* リスト表記(内容が複数行) */
.info_ul ul li {
  margin: 2ex 0;
}

/* 説明リスト */
.def_list > dt {
  font-weight: bold;
  margin: 4px 0;
}
.def_list > dd {
  margin-bottom: 1em;
  margin-left: 1em;
}

/* 注意コメント欄 */
.etc_caution {
  display: inline-block; margin: 0.5em 0;
  padding: 1em;
  color: #796002;
  background: #FFF9E4;
  border-radius: 4px;
  border: 1px solid #8D7002;
}
/* 注意テキスト */
.caution_other_txt {
  color: #db7e32;
}

/** ダイアログ **/
/* 警告ダイアログのタイトル */
.dlg_alert_title {
  margin: 0 0 1.6em;
  font-size: 1.2em;
  font-weight: bold;
  color: #d71;
}
.dlg_alert_title:before {
  content: "\f071";
  display: inline-block;
  margin-right: 0.15em;
  font: normal normal normal 14ex/1 FontAwesome;
  font-size: 200%;
  vertical-align: bottom;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* インフォダイアログのタイトル */
.dlg_info_title {
  margin: 0 0 1.6em;
  font-size: 18px;
  color: #d71;
}
.dlg_info_title:before {
  content: "\f05a";
  display: inline-block;
  margin-right: 0.15em;
  font: normal normal normal 14ex/1 FontAwesome;
  font-size: 30px;
  vertical-align: bottom;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

/* jQuery-Validationのスタイル */
.formError .formErrorContent {
  font-size: var(--font_size_std);
  font-weight: bold;
  color: #a94442;
  background: #ffffad;
  padding: 4px 0px;
}
.formError.inline {
  display: block;
  z-index: 1;
}
input.v_err,
textarea.v_err,
select.v_err {
  background-color: #edf4ff !important;
  box-shadow: 0px 0px 0px 1px #737898 inset !important;
  border-color: #737898 !important;
  /* ここまで */
}

/** ヘッダーメニュー、詳細選択メニュー **/
.navi_name,
.dropdown_name {
  display: inline-block;
}
.dropdown_name {
  padding-left: 4px;
}
.dropdown-menu.menu-indent-left {
  left: 0;
  padding-left: 15px;
}
/** 詳細メニュー選択 **/
.etc-div{
  position: relative;
  display: inline-flex;
}

/** 画像 **/
img {
  border: 0 none;
}

/* smallタグ */
small {
  font-size:11px;
}

/* 文字サイズ */
/*.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);
}*/

/* 太字 */
.fw_bold {
  font-weight: bold;
}
/* 文字サイズ(大) */
/*.fs_l {
  font-size: var(--font_size_ttl);
}*/
/* 情報のタイトル */
.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);
}

/* 警告テキスト */
.fc_strong {
  color:#FF0000;
}
/* 強調背景 */
.bg_caution {
  background: #fee;
}

/* 青文字 */
.fc_special {
  color: #0000FF;
}

/* アイコンポインター */
.clickable {
  cursor: pointer;
}
/* ホバー時の下線なし */
/*.noul:hover {
  text-decoration: none;
}*/

/* インデント */
.text_indent_one {
  margin-left: 1rem;
}

/* 非表示 */
.nodisp {
  display: none;
}
/* 改行不可 */
.nobr {
  display: inline-block;
  white-space: nowrap;
}

/** 設定欄の調整 **/
/* ラベル */
.pc label {
  white-space: nowrap;
}
label {
  /*  white-space: nowrap;*/
  cursor: pointer;
}
label:hover {
  color: #000;
  background-color: rgba(242, 242, 242, .45);
  filter: brightness(0.8);
  text-decoration: underline;
}
label img {
  pointer-events: none;
}
/* チェックボックス、ラジオボタンのテキスト内の改行 */
.sp .label_br {
  display: flex;
  align-items: flex-start;
}
.sp .label_br input {
  margin-top: 0.25em;
}
/* ラジオボタン・チェックボックス間のスペース */
.label_spacing + .label_spacing{
  margin-left: 0.5em;
}
/* 設定欄間のスペース */
.spacing_small,
.pc .pc_spacing_small,
.sp .sp_spacing_small {
  margin-left: 0.5rem;
}
.spacing_medium,
.pc .pc_spacing_medium,
.sp .sp_spacing_medium {
  margin-left: 1.5rem;
}
.spacing_large {
  margin-left: 3rem;
}
/* 上下余白 */
/*.space_v_s {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}*/
.sp .space_v_m {
  margin-top: 4px;
  margin-bottom: 4px;
}
.sp .space_v_m + .space_v_m{
  margin-top: 8px;
}

/** テキストボックス **/
/* 数値右よせ */
input.input_number {
  text-align: right;
}
/* 色コード入力 */
input.input_color{
  width:200px;
}
/* datepicker入力 */
.pc .ems-datepicker {
  width: 110px;
}
.sp .ems-datepicker {
  width: 125px;
}
/* 郵便番号 */
.input_zip {
  width: 100px;
}
/* テキスト入力 */
/*.sp .text_m {
  width: var(--text_size_m);
}*/
.sp .text_l {
  width: var(--text_size_l);
}
/* テキスト入力(最大)*/
.text_full,
.sp .sp_text_full {
  width: var(--text_size_full);
}
/* テキスト入力(5文字)*/
.text_5 {
  width: var(--text_size_full);
  max-width: var(--text_size_5);
}
/* テキスト入力(10文字)*/
.text_10 {
  width: var(--text_size_full);
  max-width: var(--text_size_10);
}
/* テキスト入力(20文字)*/
.text_20 {
  width: var(--text_size_full);
  max-width: var(--text_size_20);
}
/* テキスト入力(30文字)*/
.text_30 {
  width: var(--text_size_full);
  max-width: var(--text_size_30);
}
/* テキスト入力(50文字)*/
.text_50 {
  width: var(--text_size_full);
  max-width: var(--text_size_50);
}
/* 数値入力(3桁) */
.number_3 {
  width: var(--text_size_num_3);
}
/* 数値入力(4桁) */
.number_4 {
  width: var(--text_size_num_4);
}
/* 価格入力(6桁) */
.price_min {
  width: var(--text_size_num_6);
}
/* 価格入力(8桁(6桁+少数2桁)) */
.price_base {
  width: var(--text_size_num_8);
}
/* 価格入力(9桁) */
.price_max {
  width: var(--text_size_num_9);
}

/* テキストエリアのサイズ */
textarea {
  width: 100%;
}
/*textarea:not(.normal_ta) {
  width: 100%;
}
textarea.normal_ta {
  width: auto;
}*/
.textarea_auto_height {
  line-height: 1.3em;
  max-height: 90vh;
}

/* CLEditor */
div.cleditorMain {  /* for CLEditor */
  border: 1px solid #aaa;
}
div.cleditorToolbar {  /* for CLEditor */
  background: #f0f0f0;
  border-bottom: 1px solid #ccc;
}
div.cleditorPopup {  /* for CLEditor */
  z-index: 999999;
}
textarea.cl {
  transition: transform 400ms cubic-bezier(0.42, 0, 0.58, 1.0);
  transition-property: height;
}
/* 狭く */
.cleditor .narrow {
  max-height: 200px
}
/* 広く */
.cleditor .wide {
  min-height: 400px !important;
}


/** レイアウト系 */
/* 縦並び */
.pc .pc_vertical,
.sp .sp_vertical {
  display: flex;
  flex-direction: column;
}
/* 横並び */
.horizontal,
.pc .pc_horizontal,
.sp .sp_horizontal {
  display: flex;
  align-items: center;
}
/* ブロック要素にする */
/*.d_block {
  display: block;
}*/
/* テキスト右寄せ */
.t_right {
  text-align: right;
}
/* テキスト中央寄せ */
.t_center {
  text-align: center;
}

/* cell結合 */
.cell_join2 {
  grid-column: 1/3;
}
/* テーブル二重線 */
.border_double {
  border-top-style: double;
}
/* grid内右寄せ */
.cell_right,
.sp .sp_cell_right {
  justify-self: end;
}
/* flex要素右寄せ */
.sp .sp_flex_right {
  margin-left: auto;
}
/* grid内中央寄せ */
.cell_center {
  justify-self: center;
}
/* テーブル中央寄せ */
.table_center {
  margin: auto;
}
/* 要素中央寄せ */
.contents_center {
  text-align: center;
}
/* PC横表示、SP縦表示用の入れ子 */
.pc .list_table .pc_row_nest {
  display: grid;
  gap: 8px;
  align-items: center;
}

/* スクロール */
.pc .pc_scroll,
.sp .sp_scroll {
  overflow: auto;
}

/** ボタン・アイコン系 **/
/* 画面遷移・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';
}

/* アイコンボタン(大) */
.sp .btn-lg .fa {
  margin: -10px 0 -8px;
  font-size: 30px;
  vertical-align: middle;
}
/* 下部の設定追加ボタン */
.sp .sp_bottom_btn {
  width: 100%;
  text-align: center;
  margin-top: 10px;
}
.sp .sp_add_tr_btn {
  width: 100%;
  text-align: center;
}

/* 設定状況表示 */
.set_on {
  font-weight: bold;
}
.set_off {
  color: var(--font_color_off);
}
.set_text {
  color: var(--font_color_off);
  font-weight: bold;
}

/* アイコン余白 */
.right_fa_icon,
.btn-sm .right_fa_icon {
  margin-left: 4px;
}
.left_fa_icon,
.btn-sm .left_fa_icon,
.btn-lg .left_fa_icon {
  margin-right: 4px;
}
/*.both_fa_icon {
  margin: 0 4px;
}*/

/* emsアイコン */
.ems_ico {
  font-size: 1.3em;
  vertical-align: bottom;
  margin: 0 3px;
}

/* リンク案内のアイコン */
.link_arrow:before {
  content: "\f0da";
  display: inline-block;
  margin-left: 0.6em;
  margin-right: 0.25em;
  opacity: 0.7;
  font: normal normal normal 14px/1 FontAwesome;
  vertical-align: middle;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* (?)情報 */
.info {
  /*color: var(--excl_color);*/
  color: #11b0ff;
  cursor: pointer;
  font-size: var(--font_size_em);
}

/* コロン付与 */
.pc .pc_colon:after {
  content: "：";
}

/* 開店中等のボタン */
.sp input.info_btn,
.sp span.info_btn {
  font-size: var(--font_size_std);
  border-radius: 4px;
  text-decoration: none;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  text-align: center;
  user-select: none;
  overflow: visible;
}
.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;
}

/* 独自タグ参照リンク */
.tag_window_open {
  font-size:12px;
}

/** 説明欄系 **/
/* 設定の補足情報 */
.sup_info {
  margin-bottom: 8px;
}

/** 一覧画面系 **/
/* レコード無し行 */
.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 .pc_list_ttl {
  padding-left: 24px;
  font-weight: bold;
  vertical-align: middle;
}

/* 説明テーブルのサブタイトル行 */
.sub_ttl_tr td {
  border: none;
  padding: 0;
}

/* SP 一覧系のフィールドセット */
.sp fieldset.list_fieldset {
  background: var(--fieldset_background);
  border: none;
  border-radius: 0;
  margin: 0 0 20px 0;
  padding: 35px 12px 15px 12px;
  position: relative;
}
.sp .list_fieldset legend {
  position: absolute;
  top: 10px;
  font-size: var(--font_size_ttl);
}
/** 初期値設定欄 */
fieldset.initial_setting {
  margin:10px 15px;
  text-align:left;
  background-color: var(--initial_setting_background);
}
.pc fieldset.initial_setting {
  display:inline-block;
}

/* フィールドセット内の要素ブロック(メール設定) */
.sp .sp_info_block {
  background-color: #D5D5D9;
  padding: 10px;
}
.sp fieldset .sp_info_block {
  margin: 0 0 15px 0;
  padding: 3px;
}
.sp fieldset .sp_info_block:last-child {
  margin-bottom: 0;
}
.sp .block_ttl {
  margin: 5px 8px;
  font-weight: bold;
}

/* 設定(開店状態、配送設定) */
.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;
}

/* 設定項目内の小項目名 */
.sp .detail_set_ttl {
  display: inline-block;
  margin-top: 4px;
  font-size: var(--font_size_sp_ttl);
  font-weight: bold;
}

/* 設定項目列のemsタグ */
.set_ttl_emstag {
  font-size: 90%;
}
/* 設定項目列のemsタグ、ボタン */
.sp .set_ttl_emstag,
.sp .set_ttl_btn {
  margin-left: 0.5em;
}

/** パスワード表示切り替え **/
/* 目のアイコンを持ったiタグ */
.show-password {
  position: absolute;
  top: 50%;
  right: 0.5em;
  transform: translate(-50%, -50%);
  font-size: 130%;
  color: #979797;
  cursor: pointer;
}
/* パスワードのinputと、目のアイコンを囲うdiv */
.password-wrapper {
  position: relative;
}

/*Sortable.min.jsをつかって並び替える対象のクラス*/
.ems_sortable {
  user-select: none;
}
.ems_sortable_ghost {
  background: #f2fbff !important;
  border: 1px dashed #b6bcbf;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 5px;
}
.ems_sortable_ghost * {
  visibility: hidden !important;
}
.sortable-ghost {
  opacity: 0.4;
  bacuground-color: #87CEEB !important;
}
.sortable-fallback {
  opacity: 1;
}

/* チェックボックス横の禁止アイコン */
.no_select, .no_select_not, .no_target {
  position: relative;
  margin-left: 15px;
}
.no_select input[type=checkbox]:checked ~ .label_value, .no_target {
  color: #f57471;
  text-decoration: line-through;
}
.no_select input[type=checkbox] ~ .label_value:before, .no_target:before {
  font-family: FontAwesome;
  font-size: 1.6em;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  content: "\f05e";
  color: #f00;
  position: absolute;
  left: -20px;
  transition: all 250ms;
  opacity: 0;
  margin-top: -5px;
}
.no_select input[type=checkbox]:checked ~ .label_value:before, .no_target:before {
  opacity: 1;
}
/*.optout_td .mailmaga_val_detail .no_select input[type=checkbox] ~ .label_value:before, .no_target:before {
  margin-top: 0;
}*/

/* 店舗限定 */
.shop_only_class {
  color: #FFF;
  background: #ad452f;
}
.shop_only_use {
  margin: 0 5px;
  padding: 0px 5px;
  line-height: 1;
  color: #DF7862;
  background: #fff;
  font-size: 11px;
  border: 1px solid #DF7862;
  border-radius: 50px;
}

/* tagify デザイン */
input.tagify-input,
input.tagify-input:not([readonly]):focus {
  border:none;
  color: #000;
  background-color: #fff;
  background: none;
  padding:0;
}
.tagify-container {
  cursor:text;
  background:#fff;
}
.tagify-container[disabled] {
  background:#ababab;
}
.tagify-container a {
  position: absolute;
  top: 5px;
/*  top: 3px;*/
/*  right: 5px;*/
}
.tagify-container .tagify-tag {
  display: inline-block;
  padding: 4px 17px 4px 6px;
  background: #E5E5E5;
  position: relative;
  border-radius: 10px;
  margin-right: 5px;
  margin-bottom: 3px;
}
.tagify-container.add_hash .tagify-tag:before {
  content: '#';
}
.tagify-container.category .tagify-tag {
  background: #ffb6c1;
}
.tagify-container.hashtag .tagify-tag {
  background: #e0ffff;
}
.tagify-container.email .tagify-tag {
  background: #FFEBCD;
}

/******  検討中  ******/
/* 入力欄サイズ自動 */
/*.input_number {
  field-sizing: content;
}*/
/** 入力欄(大きいサイズ) */
.text_max,
.link_input,
.name_input {
  width:100%;
  min-width:140px;
}



/******  たぶんいらない  ******/
/* スマホヘッダーメニュー */
/*.sp .account_open_section,
.sp .header_menu_button {
  color: var(--font_color);
}*/