.alert-banner {
  position: fixed;
  top: 70px;
  left: 0;
  width: 100%;
  z-index: 1050;
  border-radius: 0;
  padding: 12px 24px;
  font-size: 15px;
  margin-bottom: 0;
  text-align: center;
}

.flash-messages {
  position: fixed;
  top: 70px; /* below header */
  left: 0;
  width: 100%;
  z-index: 1050;
}

/* --------------------------------------------------
  * Flash messages (banner style)
  * -------------------------------------------------- */
.flash-messages .alert {
  width: 100%;
  border-radius: 0 0 7px 7px;
  border-width: 0 0 2px 0;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.11);
}

/* close button */
.flash-messages .btn-close {
  padding: 1.25rem 3rem;
}

/* Fallback: notice key maps to success, no extra styles */
.custom-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 12px;
}

.custom-checkbox-input {
  width: 28px;
  height: 30px;
  appearance: none;
  border: 2px solid #bbb;
  border-radius: 4px;
  cursor: pointer;
  position: relative;
  background-color: #fff;
}

.custom-checkbox-input:checked {
  background-color: #0066CC;
  border-color: #0066CC;
}

.custom-checkbox-input:checked::after {
  content: "✔";
  font-size: 16px;
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.custom-checkbox-label {
  font-size: 16px;
  cursor: pointer;
  line-height: 1.5;
  font-family: inherit;
}

.setting-label {
  font-size: 1.8rem;
  font-weight: 600;
  color: #333;
  margin-bottom: 15px;
  display: block;
}

.setting-options {
  display: flex;
  flex-direction: row;
  gap: 20px;
  flex-wrap: wrap;
}

.setting-options .custom-checkbox {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 0;
  padding: 6px 10px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  background: #fafafa;
  transition: all 0.2s ease;
  min-width: fit-content;
  white-space: nowrap;
}

.setting-options .custom-checkbox:hover {
  background: #f0f8ff;
  border-color: #0066CC;
}

.setting-options .custom-checkbox-input {
  width: 18px;
  height: 18px;
  margin: 0;
  flex-shrink: 0;
}

.setting-options .custom-checkbox-label {
  font-size: 1.6rem;
  font-weight: 500;
  color: #333;
  margin: 0;
  cursor: pointer;
  flex: 1;
}

.setting-options .custom-checkbox-input:checked + .custom-checkbox-label {
  color: #0066CC;
  font-weight: 600;
}

.setting-options .custom-checkbox:has(.custom-checkbox-input:checked) {
  background: #e6f3ff;
  border-color: #0066CC;
  box-shadow: 0 2px 4px rgba(0, 102, 204, 0.1);
}

/* Small checkbox variant for tables */
.custom-checkbox-input-sm {
  width: 18px;
  height: 18px;
  appearance: none;
  border: 2px solid #bbb;
  border-radius: 4px;
  cursor: pointer;
  position: relative;
  background-color: #fff;
  flex-shrink: 0;
  vertical-align: middle;
  margin-right: 4px;
}

/* Keep label text vertically centered next to the small checkbox */
.custom-checkbox-input-sm + span,
label:has(> .custom-checkbox-input-sm) {
  vertical-align: middle;
}

.custom-checkbox-input-sm:checked {
  background-color: #0066CC;
  border-color: #0066CC;
}

.custom-checkbox-input-sm:checked::after {
  content: "✔";
  font-size: 12px;
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.create-success__box {
  height: 500px;
  align-items: center;
  padding-top: 200px !important;
}

.create-success__box-title {
  font-size: 22px;
  text-align: center;
  margin: auto;
  line-height: 1.5;
}
.activation__box {
  line-height: 1.5;
}

.transform-container {
  padding-left: 1rem;
}

.transform-container .headline {
  background: #666;
  color: white;
  padding: 10px;
  margin: 20px 0;
  position: relative;
}

.transform-container .headline[data-toggle="collapse"]::after {
  content: "▼";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  transition: transform 0.2s, content 0.2s;
  cursor: pointer;
}

.transform-container .headline[data-toggle="collapse"][aria-expanded="false"]::after {
  content: "▼";
}
.transform-container .headline[data-toggle="collapse"][aria-expanded="true"]::after {
  content: "▲";
}

.file-upload-area {
  border: 1px dashed #ccc;
  padding: 20px;
  text-align: center;
  margin: 20px 0;
  background: white;
  transition: all 0.3s ease;
}

.file-upload-area.drag-over {
  border-color: #007bff;
  background-color: #f8f9fa;
  box-shadow: 0 0 10px rgba(0, 123, 255, 0.3);
}

.file-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.choose-file-btn {
  display: inline-block;
  padding: 6px 12px;
  background: #eee;
  border: 1px solid #ccc;
  border-radius: 3px;
  cursor: pointer;
}

.file-input {
  display: none;
}

.drag-drop-text {
  margin-top: 10px;
  color: #666;
  position: relative;
}

span.right-align {
  margin-left: auto;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

/* Schedule modal radio styles */
.transform-form-group input[type="radio"] {
  -webkit-appearance: auto !important;
  appearance: auto !important;
  width: 18px;
  height: 18px;
  accent-color: #0f4c81;
  cursor: pointer;
}

.form-input {
  width: 100%;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 3px;
}

.file-mapping-container {
  display: flex;
  gap: 20px;
  margin: 20px 0;
}

.import-section, .export-section {
  flex: 1;
}

.export-settings {
  margin: 20px 0;
}

.setting-group {
  display: flex;
  margin-top: 15px;
}

.setting-group--with-hint .setting-options--with-hint {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}

.setting-group--with-hint .radio-options-row {
  display: flex;
  gap: 32px;
}

.setting-group--with-hint .radio-options-row .radio-option {
  width: auto;
  flex-shrink: 0;
}

.setting-group--with-hint .order-output-hint {
  margin: 0;
  width: 100%;
  padding: 10px 14px;
  background-color: #f8fbff;
  border: 1px solid #d6e6f7;
  border-left: 4px solid #2b5aa9;
  color: #333;
  font-size: 1.4rem;
  line-height: 1.6;
}

.order-output-hint__message {
  margin: 0;
}

.order-output-hint__highlight {
  color: #2b5aa9;
  font-weight: 600;
}

.setting-label {
  background: #666;
  color: white;
  padding: 12px 15px;
  width: 200px;
  display: flex;
  align-items: center;
}

.setting-options {
  display: flex;
  padding: 12px 20px;
  background: white;
  flex-grow: 1;
}

.radio-option {
  display: flex;
  align-items: center;
  width: 200px;
}

.radio-option input[type="radio"] {
  -webkit-appearance: none;
  appearance: none;
  width: 24px;
  height: 24px;
  border: 2px solid #666;
  border-radius: 50%;
  margin: 0;
  margin-right: 8px;
  position: relative;
  cursor: pointer;
  background-color: white;
  min-width: 24px;
}

.radio-option input[type="radio"]:checked {
  border-color: #666;
}

.radio-option input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  background-color: #666;
  border-radius: 50%;
}

.radio-option label {
  cursor: pointer;
  font-size: 16px;
  user-select: none;
  white-space: nowrap;
}

.button-group {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 30px;
}

.button-group button,
.button-group input[type="submit"] {
  padding: 15px 40px;
  background: white;
  border: 1px solid #666;
  border-radius: 5px;
  cursor: pointer;
  min-width: 180px;
  height: 50px;
}

.button-group button:hover,
.button-group input[type="submit"]:hover {
  background: #f5f5f5;
}

.file-mapping-container {
  display: flex;
  gap: 20px;
  margin: 20px 0;
}

.import-section {
  flex: 2;
  border: 1px solid #ddd;
  padding: 15px;
  border-radius: 4px;
  min-width: 300px;
  background: white;
  overflow-x: auto;
}

.export-section {
  flex: 3;
  border: 1px solid #ddd;
  padding: 15px;
  border-radius: 4px;
  min-width: 400px;
  background: white;
  /* ヘッダーと一覧を同じスクロール幅にし、狭い画面でもデータ項目名が消えないようにする */
  overflow-x: auto;
}

.export-section__title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.export-section__add-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  padding: 6px 14px;
  color: #174B7D;
  background: #fff;
  border: 1px solid #174B7D;
  border-radius: 4px;
  font-size: 1.3rem;
  font-weight: 600;
  cursor: pointer;
}

.export-section__add-btn:hover {
  color: #fff;
  background: #174B7D;
}

.column-list {
  max-height: 550px;
  overflow-y: auto;
  border: 1px solid #eee;
}

.column-item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #eee;
  cursor: pointer;
  user-select: none;
  background: white;
  min-width: 320px;
}

.column-item.selected {
  background-color: #e3f2fd;
}

.column-name,
.column-value {
  padding: 8px 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.column-name {
  border-right: 1px solid #eee;
}

/* Style for table header */
.import-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: #f8f9fa;
  border-bottom: 2px solid #dee2e6;
  font-weight: bold;
  min-width: 320px;
}

.header-cell {
  padding: 10px 12px;
  border-right: 1px solid #eee;
}

.export-header {
  display: flex;
  padding: 8px 12px;
  border-bottom: 1px solid #ddd;
  font-weight: bold;
  margin-bottom: 8px;
  background: #f8f9fa;
  flex-wrap: nowrap;
  min-width: 440px;
}

.export-column-item {
  display: flex;
  align-items: center;
  padding: 12px;
  margin: 0;
  border-bottom: 1px solid #eee;
  background: white;
  cursor: move;
  flex-wrap: nowrap;
  min-width: 440px;
}

.export-column-item.drag-disabled {
  cursor: default;
}

.order-column {
  width: 50px;
  min-width: 50px;
  display: flex;
  align-items: center;
}

.name-column,
.value-column {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.name-column {
  flex: 2;
  min-width: 200px;
  padding-right: 40px;
}

.value-column {
  flex: 2;
  min-width: 150px;
  padding-right: 40px;
}

.column-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(100% - 40px);
}

.name-column .required-label {
  margin-right: 0;
  margin-left: 4px;
  flex-shrink: 0;
}

.edit-icon {
  position: absolute;
  right: 8px;
  color: #666;
  cursor: pointer;
  padding: 4px;
  font-size: 14px;
}

.delete-icon {
  color: #dc3545;
  cursor: pointer;
  padding: 4px 8px;
  font-size: 16px;
  margin-left: 10px;
}

.actions-column {
  width: 40px;
  min-width: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Add horizontal lines between rows */
.export-column-item:not(:last-child) {
  border-bottom: 1px solid #eee;
}

/* Add spacing between rows */
.export-column-item+.export-column-item {
  margin-top: 1px;
}

/* Style for the drag handle */
.order-handle {
  color: #999;
  cursor: move;
}

/* Empty row style */
.empty-row {
  height: 45px;
  border-bottom: 1px solid #eee;
  pointer-events: none;
  min-width: 440px;
}

/* 狭い画面ではインポート／エクスポートを縦並びにし、各エリアの横幅を確保する */
@media (max-width: 992px) {
  .file-mapping-container {
    flex-direction: column;
  }

  .file-mapping-container .transfer-buttons {
    justify-content: center;
    padding: 10px 0;
  }
}

.transfer-buttons {
  display: flex;
  align-items: center;
  padding: 0 10px;
}

.transfer-btn {
  width: 40px;
  height: 40px;
  padding: 0;
  background: #2B5AA9;
  color: white;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s;
}

.transfer-btn:hover {
  background: #224785;
}

.transfer-btn i {
  font-size: 18px;
}

.column-list::-webkit-scrollbar {
  width: 8px;
}

.column-list::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}

.column-list::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}

.column-list::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.selection-guide {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  margin-bottom: 10px;
  background-color: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 4px;
  color: #666;
  font-size: 0.9em;
}

.selection-guide i {
  color: #2B5AA9;
}

.modal-content {
  border-radius: 8px;
}

.modal-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
}

.modal-footer {
  border-top: 1px solid #dee2e6;
}

.btn-primary {
  background-color: #2B5AA9;
  border-color: #2B5AA9;
}

.btn-primary:hover {
  background-color: #224785;
  border-color: #224785;
}

/* Transform Page Modern Design - Based on Settings Page */
.transform-page {
  min-height: calc(100vh - 120px);
  padding: 40px 20px;
  background: linear-gradient(135deg, #f5f7fa 0%, #fafbfc 100%);
}

.transform-page__container {
  max-width: 1200px;
  margin: 0 auto;
}

/* Multivendor B-CART / ColorMe 連携画面のみ親（.transform-page の padding 内）いっぱいに広げる */
.transform-page__container--multivendor-ec-wide {
  max-width: 100%;
}

.transform-page__title {
  font-size: 2.8rem;
  font-weight: 700;
  color: #174B7D;
  text-align: center;
  margin-bottom: 0.8rem;
}

.transform-page__subtitle {
  font-size: 2rem;
  font-weight: 600;
  color: #174B7D;
  text-align: center;
  margin-bottom: 1.5rem;
}

.transform-page__title::after {
  content: '';
  display: block;
  width: 60px;
  height: 4px;
  background: linear-gradient(90deg, #174B7D 0%, #47cd89 100%);
  margin: 1.2rem auto 0;
  border-radius: 2px;
}

.transform-page__description {
  font-size: 1.4rem;
  color: #666;
  text-align: center;
  line-height: 1.8;
  margin-bottom: 3rem;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

/* Transform Cards */
.transform-cards {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.transform-card {
  background: #ffffff;
  border: 2px solid #e8eef5;
  border-radius: 16px;
  padding: 2.5rem;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 8px rgba(23, 75, 125, 0.04);
  position: relative;
  overflow: hidden;
}

.transform-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, #174B7D 0%, #47cd89 100%);
  transform: scaleY(0);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.transform-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(23, 75, 125, 0.12);
  border-color: #174B7D;
}

.transform-card:hover::before {
  transform: scaleY(1);
}

.transform-card__toolbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 1rem;
}

.transform-order-summary {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem 1.25rem;
  font-size: 1.4rem;
  color: #174b7d;
  font-weight: 600;
}

.transform-order-summary__text {
  white-space: nowrap;
}

.transform-card__header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
}

.transform-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f0fe 100%);
  border-radius: 12px;
  color: #174B7D;
  flex-shrink: 0;
}

.transform-card__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #174B7D;
  margin: 0;
}

/* Transform Table */
.transform-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #ffffff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(23, 75, 125, 0.06);
}

.transform-table thead {
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
}

.transform-table thead th {
  padding: 1.2rem 1.5rem;
  color: #ffffff;
  font-weight: 600;
  font-size: 1.4rem;
  text-align: left;
  border: none;
}

.transform-table tbody tr {
  transition: background-color 0.2s ease;
}

.transform-table tbody tr:hover {
  background-color: #f8fafc;
}

.transform-table tbody td {
  padding: 1.2rem 1.5rem;
  border-bottom: 1px solid #e8eef5;
  font-size: 1.4rem;
  color: #333;
}

.transform-table tbody tr:last-child td {
  border-bottom: none;
}

/* Transform Buttons */
.transform-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.8rem 1.5rem;
  border-radius: 8px;
  font-size: 1.3rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
  cursor: pointer;
  border: none;
}

.transform-btn--primary {
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
}

.transform-btn--primary:hover {
  background: linear-gradient(135deg, #0d3252 0%, #174B7D 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.3);
  color: #ffffff;
  text-decoration: none;
}

.transform-btn--secondary {
  background: #ffffff;
  color: #174B7D;
  border: 2px solid #174B7D;
}

.transform-btn--secondary:hover {
  background: #174B7D;
  color: #ffffff;
  text-decoration: none;
}

.transform-btn--danger {
  background: #ffffff;
  color: #dc3545;
  border: 2px solid #dc3545;
}

.transform-btn--danger:hover {
  background: #dc3545;
  color: #ffffff;
  text-decoration: none;
}

.transform-btn--success {
  background: linear-gradient(135deg, #47cd89 0%, #2d7a54 100%);
  color: #ffffff;
}

.transform-btn--success:hover {
  background: linear-gradient(135deg, #2d7a54 0%, #1e5239 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(71, 205, 137, 0.3);
  color: #ffffff;
  text-decoration: none;
}

.transform-btn:disabled,
.transform-btn--disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.transform-btn:disabled:hover,
.transform-btn--disabled:hover {
  transform: none;
  box-shadow: none;
}

/* Usage Cards */
.transform-usage-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
  margin: 2rem 0;
}

.transform-usage-card {
  background: #ffffff;
  border: 2px solid #e8eef5;
  border-radius: 16px;
  padding: 2rem;
  text-align: center;
  transition: all 0.3s ease;
}

.transform-usage-card:hover {
  border-color: #174B7D;
  box-shadow: 0 4px 16px rgba(23, 75, 125, 0.1);
}

.transform-usage-card__label {
  font-size: 1.4rem;
  color: #666;
  margin-bottom: 1rem;
}

.transform-usage-card__value {
  font-size: 3rem;
  font-weight: 700;
  color: #174B7D;
}

.transform-usage-card__unit {
  font-size: 1.6rem;
  color: #666;
  margin-left: 0.5rem;
}

/* Service Info Box */
.transform-info-box {
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f0fe 100%);
  border: 2px solid #174B7D;
  border-radius: 16px;
  padding: 2.5rem;
  margin: 2rem 0;
}

.transform-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2rem;
}

.transform-info-item h3 {
  font-size: 1.4rem;
  font-weight: 700;
  color: #174B7D;
  margin-bottom: 0.8rem;
}

.transform-info-item p,
.transform-info-item div {
  font-size: 1.4rem;
  color: #333;
  line-height: 1.8;
}

/* Service List */
.transform-service-list {
  list-style: none;
  padding: 0;
  margin: 2rem 0;
}

.transform-service-list li {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1rem 0;
  font-size: 1.4rem;
  color: #333;
  border-bottom: 1px solid #e8eef5;
}

.transform-service-list li:last-child {
  border-bottom: none;
}

.transform-service-list li::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  background: linear-gradient(135deg, #174B7D 0%, #47cd89 100%);
  border-radius: 50%;
  margin-top: 0.6rem;
  flex-shrink: 0;
}

/* Confirmation Section */
.transform-confirmation {
  text-align: center;
  padding: 2rem;
  background: #f8fafc;
  border-radius: 12px;
  margin-top: 2rem;
}

.transform-confirmation__text {
  font-size: 1.5rem;
  color: #333;
  margin-bottom: 1.5rem;
}

.transform-confirmation__success {
  font-size: 1.6rem;
  font-weight: 700;
  color: #47cd89;
}

/* Empty State */
.transform-empty {
  text-align: center;
  padding: 4rem 2rem;
  color: #666;
}

.transform-empty__icon {
  font-size: 4rem;
  color: #ccc;
  margin-bottom: 1.5rem;
}

.transform-empty__text {
  font-size: 1.5rem;
}

/* Form Section Cards */
.transform-form-section {
  background: #ffffff;
  border: 2px solid #e8eef5;
  border-radius: 16px;
  padding: 2rem;
  margin-bottom: 2rem;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 8px rgba(23, 75, 125, 0.04);
  position: relative;
  overflow: hidden;
}

.transform-form-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, #174B7D 0%, #47cd89 100%);
}

.transform-form-section__header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e8eef5;
}

.transform-form-section__number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  border-radius: 50%;
  color: #ffffff;
  font-weight: 700;
  font-size: 1.4rem;
  flex-shrink: 0;
}

.transform-form-section__title {
  font-size: 1.6rem;
  font-weight: 700;
  color: #174B7D;
  margin: 0;
}

.transform-form-section__badge {
  background: linear-gradient(135deg, #47cd89 0%, #2d7a54 100%);
  color: white;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 1.1rem;
  font-weight: 600;
  margin-left: auto;
}

.transform-form-section__description {
  font-size: 1.4rem;
  color: #666;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.transform-form-section__content {
  padding-left: 0.5rem;
}

/* Collapsible Section */
.transform-form-section--collapsible .transform-form-section__header {
  cursor: pointer;
  user-select: none;
}

.transform-form-section--collapsible .transform-form-section__header::after {
  content: '';
  width: 10px;
  height: 10px;
  border-right: 2px solid #174B7D;
  border-bottom: 2px solid #174B7D;
  transform: rotate(45deg);
  transition: transform 0.3s ease;
  margin-left: auto;
}

.transform-form-section--collapsible.collapsed .transform-form-section__header::after {
  transform: rotate(-135deg);
}

/* File Upload Area - Modern */
.transform-file-upload {
  border: 2px dashed #174B7D;
  border-radius: 12px;
  padding: 2.5rem;
  text-align: center;
  background: linear-gradient(135deg, #f8fafc 0%, #f0f6ff 100%);
  transition: all 0.3s ease;
  margin-bottom: 1.5rem;
}

.transform-file-upload--clickable {
  cursor: pointer;
}

.transform-file-upload:hover {
  border-color: #47cd89;
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f5ee 100%);
}

.transform-file-upload.drag-over {
  border-color: #47cd89;
  background: linear-gradient(135deg, #e8f5ee 0%, #d4f0e0 100%);
  box-shadow: 0 0 20px rgba(71, 205, 137, 0.2);
}

.transform-file-upload__icon {
  font-size: 3rem;
  color: #174B7D;
  margin-bottom: 1rem;
}

.transform-file-upload__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.8rem 2rem;
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 1.4rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.transform-file-upload__btn:hover {
  background: linear-gradient(135deg, #0d3252 0%, #174B7D 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.3);
}

.transform-file-upload__text {
  font-size: 1.4rem;
  color: #666;
  margin-top: 1rem;
}

.transform-file-upload__limit {
  font-size: 1.2rem;
  color: #999;
  margin-top: 0.5rem;
}

/* Auto Mapping Section */
.transform-auto-mapping {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  padding: 1.5rem;
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f0fe 100%);
  border-radius: 12px;
  margin-top: 1rem;
}

.transform-auto-mapping__input-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.transform-auto-mapping__label {
  font-size: 1.3rem;
  font-weight: 600;
  color: #174B7D;
}

.transform-auto-mapping__file-input {
  padding: 0.8rem 1rem;
  border: 2px solid #e8eef5;
  border-radius: 8px;
  background: #ffffff;
  font-size: 1.3rem;
  transition: border-color 0.2s ease;
}

.transform-auto-mapping__file-input:focus {
  border-color: #174B7D;
  outline: none;
}

.transform-auto-mapping__file-select {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.transform-auto-mapping__file-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.7rem 1.5rem;
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 1.3rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.transform-auto-mapping__file-btn:hover {
  background: linear-gradient(135deg, #0d3252 0%, #174B7D 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.3);
}

.transform-auto-mapping__file-name {
  font-size: 1.3rem;
  color: #666;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 250px;
}

.transform-auto-mapping__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 2rem;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 1.4rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: auto;
}

.transform-auto-mapping__btn:hover {
  background: linear-gradient(135deg, #5a6fd6 0%, #6a4190 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

/* Mapping Container - Modern */
.transform-mapping-container {
  display: flex;
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.transform-mapping-panel {
  flex: 1;
  background: #ffffff;
  border: 2px solid #e8eef5;
  border-radius: 12px;
  overflow: hidden;
}

.transform-mapping-panel--import {
  flex: 2;
}

.transform-mapping-panel--export {
  flex: 3;
}

.transform-mapping-panel__header {
  display: flex;
  align-items: center;
  padding: 1rem 1.5rem;
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  font-weight: 600;
  font-size: 1.4rem;
}

.transform-mapping-panel__add-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 1rem;
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 6px;
  font-size: 1.2rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-left: auto;
}

.transform-mapping-panel__add-btn:hover {
  background: rgba(255, 255, 255, 0.3);
  border-color: rgba(255, 255, 255, 0.6);
}

.transform-mapping-panel__subheader {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: #f8fafc;
  border-bottom: 1px solid #e8eef5;
  font-weight: 600;
  font-size: 1.3rem;
  color: #333;
  position: relative;
}

.transform-mapping-panel__subheader-cell {
  padding: 0.8rem 1rem;
  border-right: 1px solid #e8eef5;
}

.transform-mapping-panel__subheader-cell:last-child {
  border-right: none;
}

.column-resize-handle {
  position: absolute;
  left: calc(50% - 3px);
  top: 0;
  bottom: 0;
  width: 6px;
  cursor: col-resize;
  z-index: 10;
  background: transparent;
}

.transform-mapping-panel__export-subheader {
  display: flex;
  background: #f8fafc;
  border-bottom: 1px solid #e8eef5;
  font-weight: 600;
  font-size: 1.3rem;
  color: #333;
  padding: 0.8rem 1rem;
}

.transform-mapping-panel__list {
  max-height: 450px;
  overflow-y: auto;
}

/* Transfer Button */
.transform-transfer-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
}

.transform-transfer-btn__button {
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  font-size: 1.6rem;
}

.transform-transfer-btn__button:hover {
  background: linear-gradient(135deg, #0d3252 0%, #174B7D 100%);
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.3);
}

/* Settings Group - Modern */
.transform-settings-group {
  display: flex;
  margin-bottom: 1rem;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e8eef5;
}

.transform-settings-group__label {
  display: flex;
  align-items: center;
  padding: 1rem 1.5rem;
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  font-weight: 600;
  font-size: 1.4rem;
  width: 180px;
  min-width: 180px;
  flex: 0 0 180px;
  box-sizing: border-box;
  margin-bottom: 0;
}

/* Legacy .setting-label rules are also applied to order output settings. */
.transform-settings-group > .transform-settings-group__label {
  display: flex;
  color: #ffffff;
  font-size: 1.4rem;
  margin: 0;
}

.transform-settings-group__options {
  display: flex;
  align-items: center;
  padding: 1rem 1.5rem;
  background: #ffffff;
  flex-grow: 1;
  gap: 2rem;
}

.transform-settings-group__option {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
}

.transform-settings-group__option input[type="radio"],
.transform-settings-group__option input[type="checkbox"] {
  -webkit-appearance: auto !important;
  appearance: auto !important;
  width: 20px !important;
  height: 20px !important;
  accent-color: #174B7D;
  margin: 0;
  margin-right: 0.5rem;
  cursor: pointer;
}

.transform-settings-group__option label {
  font-size: 1.4rem;
  color: #333;
  cursor: pointer;
}

/* Security Badge */
.transform-security-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  margin-bottom: 1rem;
  background-color: #f8f9fa;
  border: 1px solid #e8eef5;
  border-radius: 8px;
}

.transform-security-badge__logos {
  display: flex;
  align-items: center;
  gap: 16px;
}

.transform-security-badge__logo {
  height: 36px;
  width: auto;
  opacity: 0.85;
}

.transform-security-badge__text {
  margin: 0;
  font-size: 0.75rem;
  color: #6c757d;
  text-align: center;
  line-height: 1.5;
}

/* Button Group - Modern */
.transform-button-group {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid #e8eef5;
}

.transform-button-group .transform-btn {
  min-width: 180px;
  padding: 1rem 2rem;
  font-size: 1.4rem;
}

/* Modal - Modern Design */
.transform-modal .modal-content {
  border: none;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(23, 75, 125, 0.2);
  overflow: hidden;
}

.transform-modal .modal-header {
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  padding: 1.5rem 2rem;
  border: none;
}

.transform-modal .modal-title {
  font-size: 1.8rem;
  font-weight: 700;
}

.transform-modal .modal-header .btn-close {
  filter: brightness(0) invert(1);
  opacity: 0.8;
}

.transform-modal .modal-header .btn-close:hover {
  opacity: 1;
}

.transform-modal .modal-body {
  padding: 2rem;
}

.transform-modal .modal-footer {
  padding: 1.5rem 2rem;
  border-top: 1px solid #e8eef5;
  background: #f8fafc;
}

/* Auto Map Result Modal */
.transform-modal--automap .modal-header {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.transform-modal--automap .transform-summary {
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f0fe 100%);
  border-radius: 12px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.transform-modal--automap .transform-result-table-wrapper {
  max-height: 400px;
  overflow-y: auto;
  border-radius: 12px;
  border: 1px solid #e8eef5;
}

/* Value Edit Modal - Modern */
.transform-modal--value-edit .modal-dialog {
  max-width: 80%;
}

.transform-modal--value-edit .transform-mode-selector {
  border: 2px solid #e8eef5;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 1.5rem;
}

.transform-modal--value-edit .transform-mode-option {
  border-bottom: 1px solid #e8eef5;
  padding: 0;
}

.transform-modal--value-edit .transform-mode-option:last-child {
  border-bottom: none;
}

.transform-modal--value-edit .transform-mode-option label {
  display: flex;
  align-items: center;
  padding: 1.2rem 1.5rem;
  cursor: pointer;
  margin: 0;
  transition: background-color 0.2s;
}

.transform-modal--value-edit .transform-mode-option label:hover {
  background-color: #f8fafc;
}

.transform-modal--value-edit .transform-mode-option input[type="radio"] {
  margin-right: 1rem;
  width: 18px;
  height: 18px;
  accent-color: #174B7D;
}

.transform-modal--value-edit .transform-mode-option input[type="radio"]:checked + .transform-mode-title {
  color: #174B7D;
  font-weight: 700;
}

.transform-modal--value-edit .transform-mode-title {
  font-size: 1.5rem;
  font-weight: 500;
  margin-right: 1rem;
  min-width: 280px;
}

.transform-modal--value-edit .transform-mode-description {
  font-size: 1.3rem;
  color: #666;
}

.transform-modal--value-edit .transform-panel {
  background: #f8fafc;
  border: 2px solid #e8eef5;
  border-radius: 12px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.transform-modal--value-edit .transform-panel-label {
  font-size: 1.4rem;
  font-weight: 600;
  color: #174B7D;
  margin-bottom: 0.8rem;
  display: block;
}

.transform-modal--value-edit .transform-panel-input {
  font-size: 1.4rem;
  padding: 0.8rem 1rem;
  border: 2px solid #e8eef5;
  border-radius: 8px;
  width: 100%;
  max-width: 400px;
  transition: border-color 0.2s ease;
}

.transform-modal--value-edit .transform-panel-input:focus {
  border-color: #174B7D;
  outline: none;
}

.transform-modal--value-edit .transform-panel-select {
  font-size: 1.4rem;
  padding: 0.8rem 1rem;
  border: 2px solid #e8eef5;
  border-radius: 8px;
  min-width: 200px;
  max-width: 400px;
  transition: border-color 0.2s ease;
}

.transform-modal--value-edit .transform-panel-select:focus {
  border-color: #174B7D;
  outline: none;
}

/* Modal Buttons */
.transform-modal .transform-modal-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.8rem 2rem;
  border-radius: 8px;
  font-size: 1.4rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: 140px;
  justify-content: center;
}

.transform-modal .transform-modal-btn--primary {
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  border: none;
}

.transform-modal .transform-modal-btn--primary:hover {
  background: linear-gradient(135deg, #0d3252 0%, #174B7D 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.3);
}

.transform-modal .transform-modal-btn--secondary {
  background: #ffffff;
  color: #666;
  border: 2px solid #e8eef5;
}

.transform-modal .transform-modal-btn--secondary:hover {
  background: #f8fafc;
  border-color: #174B7D;
  color: #174B7D;
}

.transform-modal .transform-modal-btn--success {
  background: linear-gradient(135deg, #47cd89 0%, #2d7a54 100%);
  color: #ffffff;
  border: none;
}

.transform-modal .transform-modal-btn--success:hover {
  background: linear-gradient(135deg, #2d7a54 0%, #1e5239 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(71, 205, 137, 0.3);
}

.transform-modal .transform-modal-btn--automap {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: #ffffff;
  border: none;
}

.transform-modal .transform-modal-btn--automap:hover {
  background: linear-gradient(135deg, #5a6fd6 0%, #6a4190 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

/* Test Result Table */
.transform-test-result {
  margin-top: 2rem;
}

.transform-test-result__title {
  font-size: 1.4rem;
  font-weight: 600;
  color: #174B7D;
  margin-bottom: 1rem;
}

.transform-test-result__table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e8eef5;
}

.transform-test-result__table th,
.transform-test-result__table td {
  padding: 1rem 1.5rem;
  text-align: left;
  font-size: 1.4rem;
}

.transform-test-result__table th {
  background: #f8fafc;
  font-weight: 600;
  color: #333;
  border-bottom: 1px solid #e8eef5;
}

.transform-test-result__table td {
  background: #ffffff;
}

/* Form Input - Modern */
.transform-form-input {
  width: 100%;
  padding: 0.8rem 1rem;
  border: 2px solid #e8eef5;
  border-radius: 8px;
  font-size: 1.4rem;
  transition: border-color 0.2s ease;
  margin-bottom: 1rem;
}

.transform-form-input:focus {
  border-color: #174B7D;
  outline: none;
}

.transform-form-input::placeholder {
  color: #999;
}

/* Selection Guide - Modern */
.transform-selection-guide {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.5rem;
  background: linear-gradient(135deg, #f8fafc 0%, #f0f6ff 100%);
  border: 1px solid #e8eef5;
  border-radius: 8px;
  margin-bottom: 1rem;
}

.transform-selection-guide__icon {
  color: #174B7D;
  font-size: 1.4rem;
}

.transform-selection-guide__text {
  font-size: 1.3rem;
  color: #666;
}

.transform-selection-guide__btn {
  margin-left: auto;
}

/* Responsive */
@media (max-width: 768px) {
  .transform-page {
    padding: 24px 16px;
  }

  .transform-page__title {
    font-size: 2.2rem;
  }

  .transform-page__subtitle {
    font-size: 1.6rem;
  }

  .transform-card {
    padding: 1.5rem;
  }

  .transform-table thead th,
  .transform-table tbody td {
    padding: 1rem;
    font-size: 1.2rem;
  }

  .transform-usage-cards {
    grid-template-columns: 1fr;
  }

  .transform-info-grid {
    grid-template-columns: 1fr;
  }

  .transform-mapping-container {
    flex-direction: column;
  }

  .transform-transfer-btn {
    transform: rotate(90deg);
  }

  .transform-settings-group {
    flex-direction: column;
  }

  .transform-settings-group > .transform-settings-group__label {
    width: auto;
    min-width: auto;
    flex-basis: auto;
  }

  .transform-auto-mapping {
    flex-direction: column;
    align-items: stretch;
  }

  .transform-modal--value-edit .modal-dialog {
    max-width: 95%;
  }
}

/* Auto Mapping Results - Font Size & Button Improvements */
#autoMapResultTable thead th {
  font-size: 1.6rem;
}

#autoMapResultTable tbody td {
  font-size: 1.6rem;
}

#autoMapResultTable .badge {
  font-size: 1.3rem;
  padding: 0.4rem 0.8rem;
}

#autoMapResultTable .form-select {
  font-size: 1.5rem;
}

#autoMapResultTable .remove-mapping-btn {
  padding: 0.2rem 0.5rem;
  font-size: 1.1rem;
  line-height: 1;
}

#autoMapResultTable .remove-mapping-btn i {
  font-size: 1.1rem;
}

/* Condition Function Section in Output */
.condition-function-section {
  margin-top: 10px;
}

/* Logic Operator Prominent Style */
.logic-operator-section .logic-operator {
  font-weight: 600;
  font-size: 1.4rem;
  padding: 8px 20px;
  background: #174B7D;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  min-width: 180px;
  text-align: center;
}

/* ============================================
   Shared Modern Page Styles
   Used across all pages for unified design
   ============================================ */

/* Search Form inside card */
.transform-search {
  background: linear-gradient(135deg, #f8fafc 0%, #f0f4f8 100%);
  border-radius: 12px;
  padding: 2rem;
  margin-bottom: 2rem;
}

.transform-search__row {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 2rem;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}

.transform-search__field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 200px;
}

.transform-search__field label {
  font-size: 1.3rem;
  font-weight: 600;
  color: #174B7D;
}

.transform-search__field input,
.transform-search__field select {
  font-size: 1.4rem;
  padding: 0.8rem 1rem;
  border: 2px solid #e8eef5;
  border-radius: 8px;
  transition: border-color 0.2s ease;
}

.transform-search__field input:focus,
.transform-search__field select:focus {
  border-color: #174B7D;
  outline: none;
  box-shadow: 0 0 0 3px rgba(23, 75, 125, 0.1);
}

.transform-search__row--inline {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0;
}

.transform-search__field--inline {
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  min-width: auto;
  flex: 1 1 auto;
}

.transform-search__field--inline label {
  margin-bottom: 0;
  white-space: nowrap;
}

.transform-search__field--inline input {
  flex: 1 1 auto;
  max-width: 480px;
}

.transform-search__row--inline .transform-search__btn {
  flex-shrink: 0;
}

.transform-search__actions {
  text-align: center;
  margin-top: 0.5rem;
}

.transform-search__row .transform-search__actions {
  margin-top: 0;
  text-align: left;
  flex-shrink: 0;
}

.transform-search__row:last-child {
  margin-bottom: 0;
}

.transform-search__btn {
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  font-size: 1.4rem;
  font-weight: 600;
  padding: 0.8rem 3rem;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: 120px;
}

.transform-search__btn:hover {
  background: linear-gradient(135deg, #0d3252 0%, #174B7D 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.3);
}

/* Definition List (Form) inside card */
.transform-dl {
  width: 100%;
  max-width: 942px;
  margin: 0 auto;
}

.transform-dl__row {
  display: flex;
  flex-wrap: wrap;
  font-size: 1.8rem;
  border-bottom: 1px solid #e8eef5;
}

.transform-dl__row:first-child {
  border-top: 1px solid #e8eef5;
}

.transform-dl__dt {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 300px;
  color: #ffffff;
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  padding: 1.24em 1em;
  position: relative;
  font-weight: 600;
}

/* Scope long label + required badge nowrap to specific rows only (not shared default). */
.transform-dl__dt--nowrap {
  gap: 0.6em;
  width: 380px;
  white-space: nowrap;
}

.transform-dl__dt--nowrap .required {
  flex-shrink: 0;
}

.transform-dl__dt--nowrap + .transform-dl__dd {
  width: calc(100% - 380px);
}

.transform-dl__dd {
  font-family: "Segoe UI", Arial, sans-serif;
  width: calc(100% - 300px);
  padding: 1.24em 2em;
  display: flex;
  align-items: center;
}

/* Tab Buttons */
.transform-tabs {
  display: flex;
  gap: 0.8rem;
  flex-wrap: wrap;
  align-items: center;
}

.transform-tab {
  background: #ffffff;
  color: #174B7D;
  font-size: 1.4rem;
  padding: 0.7rem 1.5rem;
  border-radius: 8px;
  border: 2px solid #e8eef5;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: all 0.2s ease;
}

.transform-tab:hover {
  border-color: #174B7D;
  background: #f0f6ff;
  text-decoration: none;
  color: #174B7D;
}

.transform-tab.active {
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  border-color: #174B7D;
}

/* Action buttons row */
.transform-actions {
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
  align-items: center;
  margin-bottom: 1.5rem;
}

.transform-actions--between {
  justify-content: space-between;
}

.transform-actions--start {
  justify-content: flex-start;
}

.transform-actions--center {
  justify-content: center;
}

.transform-btn--compact {
  padding: 0.4rem 0.9rem;
  font-size: 1.1rem;
}

/* Accordion Modern Design */
.transform-accordion .accordion-item {
  border: 2px solid #e8eef5;
  border-radius: 12px !important;
  overflow: hidden;
  margin-bottom: 1.5rem;
  box-shadow: 0 2px 8px rgba(23, 75, 125, 0.04);
}

.transform-accordion .accordion-button {
  font-size: 1.6rem;
  font-weight: 700;
  background: linear-gradient(135deg, #e8f0fe 0%, #d9e8fc 100%);
  color: #174B7D;
  border: none;
  padding: 1.4rem 1.6rem;
}

.transform-accordion .accordion-button:not(.collapsed) {
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  box-shadow: none;
}

.transform-accordion .accordion-button:not(.collapsed)::after {
  filter: brightness(0) invert(1);
}

.transform-accordion .accordion-body {
  border-top: 2px solid #e8eef5;
  padding: 2rem;
}

/* Info Card */
.transform-info {
  background: #ffffff;
  border: 2px solid #e8eef5;
  border-radius: 12px;
  padding: 2rem;
  margin-bottom: 2rem;
}

.transform-info__label {
  font-size: 1.4rem;
  font-weight: 600;
  color: #174B7D;
  margin-bottom: 0.5rem;
}

/* URL display */
.transform-url-block {
  background: #f8fafc;
  border: 1px solid #e8eef5;
  border-radius: 8px;
  padding: 1rem 1.5rem;
  margin-top: 1.5rem;
  font-size: 1.4rem;
}

.transform-url-block a {
  color: #174B7D;
  word-break: break-all;
}

/* Pagination wrapper */
.transform-pagination {
  margin-top: 2rem;
  display: flex;
  justify-content: center;
}

/* Add user / action button (top right) */
.transform-btn--add {
  background: linear-gradient(135deg, #174B7D 0%, #2d64ad 100%);
  color: #ffffff;
  font-size: 1.4rem;
  padding: 0.7rem 1.5rem;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
}

.transform-btn--add:hover {
  background: linear-gradient(135deg, #0d3252 0%, #174B7D 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.3);
  color: #ffffff;
  text-decoration: none;
}

.transform-btn--add[disabled],
.transform-btn--add--disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* Checkbox styles for order management */
.transform-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.4rem;
  color: #333;
  cursor: pointer;
}

/* Responsive additions */
@media (max-width: 768px) {
  .transform-search__row {
    flex-direction: column;
    align-items: stretch;
  }

  .transform-search__field {
    min-width: auto;
  }

  .transform-dl__dt {
    width: 100%;
  }

  .transform-dl__dd {
    width: 100%;
  }

  .transform-tabs {
    flex-direction: column;
  }

  .transform-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .transform-actions--between {
    gap: 1rem;
  }
}

/* ============================================
   UI Fixes - Click ranges, hover, layout
   ============================================ */

/* Clickable table rows - entire row is clickable */
.transform-table--clickable tbody tr {
  cursor: pointer;
  position: relative;
}

.transform-table--clickable tbody tr:hover {
  background-color: #d0e2f2 !important;
}

.transform-table--clickable tbody tr td a {
  color: inherit;
  text-decoration: none;
}

/* Stronger hover color for all transform tables */
.transform-table tbody tr:hover {
  background-color: #d0e2f2;
}

/* Action buttons horizontal layout in table cells */
.transform-table__actions {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-wrap: nowrap;
  white-space: nowrap;
}

/* Section spacing for product management pages */
.transform-card + .transform-actions,
.transform-actions + .transform-card {
  margin-top: 2rem;
}

.transform-search + .transform-actions {
  margin-top: 2rem;
}

/* Non-published state single line */
.transform-table td.text-danger {
  white-space: nowrap;
}

/* Detail button horizontal text */
.transform-btn--secondary {
  white-space: nowrap;
}

/* Connector settings - clickable link styling */
.transform-table td a:not(.transform-btn):not(.transform-btn--secondary):not(.transform-btn--danger):not(.transform-btn--success):not(.transform-btn--add) {
  color: #174B7D;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.transform-table td a:not(.transform-btn):not(.transform-btn--secondary):not(.transform-btn--danger):not(.transform-btn--success):not(.transform-btn--add):hover {
  color: #0d3252;
}

/* Section title inside card */
.transform-card__section-title {
  font-size: 1.6rem;
  font-weight: 700;
  color: #174B7D;
  margin-bottom: 1.5rem;
  padding-bottom: 0.8rem;
  border-bottom: 2px solid #e8eef5;
}

/* ============================================
   Transform Plan Feature Styles
   ============================================ */

/* Plan Badge */
.transform-plan-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  margin-bottom: 2rem;
}

.transform-plan-badge__label {
  font-size: 1.8rem;
  color: #666;
}

.transform-plan-badge__value {
  display: inline-block;
  padding: 0.6rem 2rem;
  border-radius: 20px;
  font-size: 2.2rem;
  font-weight: 700;
}

.transform-plan-badge__value--free {
  background: #e8eef5;
  color: #174B7D;
}

.transform-plan-badge__value--advanced {
  background: linear-gradient(135deg, #174B7D 0%, #47cd89 100%);
  color: #ffffff;
}

/* Plan Section */
.transform-plan-section__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #174B7D;
  margin-bottom: 2rem;
}

/* Plan Cards */
.transform-plan-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  margin-bottom: 2rem;
}

.transform-plan-card {
  background: #ffffff;
  border: 2px solid #e8eef5;
  border-radius: 16px;
  padding: 2rem;
  text-align: center;
  transition: all 0.3s ease;
}

.transform-plan-card--active {
  border-color: #174B7D;
  box-shadow: 0 4px 16px rgba(23, 75, 125, 0.15);
}

.transform-plan-card__header {
  font-size: 2.6rem;
  font-weight: 700;
  color: #174B7D;
  margin-bottom: 1rem;
}

.transform-plan-card__header--advanced {
  background: linear-gradient(135deg, #174B7D, #47cd89);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.transform-plan-card__price {
  font-size: 2.4rem;
  font-weight: 700;
  color: #333;
  margin-bottom: 1.5rem;
}

.transform-plan-card__price span {
  font-size: 1.4rem;
  color: #666;
  font-weight: 400;
}

.transform-plan-card__features {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem 0;
  text-align: left;
}

.transform-plan-card__features li {
  padding: 0.6rem 0;
  font-size: 1.5rem;
  color: #555;
  border-bottom: 1px solid #f0f0f0;
}

.transform-plan-card__features li:last-child {
  border-bottom: none;
}

.transform-plan-card__current {
  display: inline-block;
  padding: 0.6rem 1.5rem;
  background: #e8eef5;
  color: #174B7D;
  border-radius: 8px;
  font-size: 1.3rem;
  font-weight: 600;
}

/* Slot Section */
.transform-slot-section {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 2px solid #e8eef5;
}

.transform-slot-section__title {
  font-size: 1.6rem;
  font-weight: 700;
  color: #174B7D;
  margin-bottom: 1rem;
}

.transform-slot-section__info {
  font-size: 1.4rem;
  color: #555;
  margin-bottom: 1.5rem;
}

/* Sidebar Lock Icon */
.sidebar-lock-icon {
  font-size: 1.2rem;
  color: #999;
  margin-right: 0.3rem;
}

.sidebar-locked-link {
  color: #999 !important;
  cursor: pointer;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.sidebar-locked-link:hover {
  color: #174B7D !important;
}

/* Status Badges */
.transform-status-badge {
  display: inline-block;
  padding: 0.3rem 0.8rem;
  border-radius: 12px;
  font-size: 1.2rem;
  font-weight: 600;
}

.transform-status-badge--success {
  background: #d4edda;
  color: #155724;
}

.transform-status-badge--danger {
  background: #f8d7da;
  color: #721c24;
}

.transform-status-badge--warning {
  background: #fff3cd;
  color: #856404;
}

.transform-status-badge--secondary {
  background: #e2e3e5;
  color: #383d41;
}

/* Alert */
.transform-alert {
  padding: 1rem 1.5rem;
  border-radius: 8px;
  font-size: 1.3rem;
  margin-bottom: 1.5rem;
}

.transform-alert--warning {
  background: #fff3cd;
  color: #856404;
  border: 1px solid #ffc107;
}

/* Form Groups for Plan Features */
.transform-form-group--locked {
  opacity: 0.6;
}

.transform-form-hint {
  font-size: 1.2rem;
  color: #888;
  margin-top: 0.4rem;
}

/* FTP Settings */
.transform-ftp-settings {
  border-top: 1px solid #e8eef5;
  padding-top: 1.5rem;
}

.transform-ftp-setting-group {
  background: #f8f9fa;
  border: 1px solid #e8eef5;
  border-radius: 12px;
  padding: 1.5rem;
}

.transform-ftp-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 1rem;
}

.transform-ftp-fields .transform-form-group {
  margin-bottom: 0;
}

.transform-ftp-fields .transform-form-group label {
  font-size: 1.2rem;
  color: #555;
  margin-bottom: 0.3rem;
  display: block;
}

/* Form elements for schedules */
.transform-form-label {
  font-size: 1.4rem;
  font-weight: 600;
  color: #333;
  margin-bottom: 0.5rem;
  display: block;
}

.transform-form-select {
  width: 100%;
  padding: 0.8rem;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 1.3rem;
  background: #ffffff;
}

.transform-form-checkbox {
  width: 20px;
  height: 20px;
  margin-right: 0.5rem;
  vertical-align: middle;
}

.transform-form-group {
  margin-bottom: 1.5rem;
}

/* Processing Overlay - ダウンロード・FTP処理中オーバーレイ */
.processing-overlay__backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9998;
}

.processing-overlay__content {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 12px;
  padding: 2.5rem 3rem;
  text-align: center;
  z-index: 9999;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
  min-width: 320px;
}

.processing-overlay__spinner {
  font-size: 3rem;
  color: #28a745;
  margin-bottom: 1rem;
  display: block;
}

.processing-overlay__text {
  font-size: 1.6rem;
  font-weight: bold;
  color: #333;
  margin-bottom: 0.5rem;
}

.processing-overlay__subtext {
  font-size: 1.2rem;
  color: #888;
  margin: 0;
}

/* ==========================================
   Extra Row Settings (明細行追加設定)
   ========================================== */
.extra-row-settings {
  padding: 1rem 0;
}

.extra-row-settings__group-key {
  margin-bottom: 2rem;
}

.extra-row-settings__label {
  display: block;
  font-size: 1.4rem;
  font-weight: bold;
  color: #333;
  margin-bottom: 0.5rem;
}

.extra-row-settings__select {
  width: 100%;
  max-width: 400px;
  padding: 0.6rem 1rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 1.3rem;
  background: #fff;
}

.extra-row-settings__hint {
  display: block;
  font-size: 1.1rem;
  color: #888;
  margin-top: 0.3rem;
}

.extra-row-settings__rules-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}

.extra-row-settings__add-rule-btn {
  padding: 0.4rem 1.2rem;
  background: #0f4c81;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 1.2rem;
  cursor: pointer;
  transition: background 0.2s;
}

.extra-row-settings__add-rule-btn:hover {
  background: #0d3d6a;
}

.extra-row-settings__add-rule-btn--disabled {
  background: #999;
  cursor: not-allowed;
}

.extra-row-settings__add-rule-btn--disabled:hover {
  background: #999;
}

.extra-row-settings__rule-count {
  font-size: 1.2rem;
  color: #666;
}

.extra-row-settings__empty-message {
  padding: 2rem;
  text-align: center;
  color: #999;
  font-size: 1.3rem;
  border: 1px dashed #ddd;
  border-radius: 6px;
  background: #fafafa;
}

.extra-row-settings__rules-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Rule Card */
.extra-row-rule {
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
  transition: box-shadow 0.2s;
}

.extra-row-rule:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.extra-row-rule__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8rem 1.2rem;
  background: #f5f7fa;
  border-bottom: 1px solid #eee;
}

.extra-row-rule__priority {
  font-size: 1.3rem;
  font-weight: bold;
  color: #0f4c81;
}

.extra-row-rule__actions {
  display: flex;
  gap: 0.3rem;
}

.extra-row-rule__actions button {
  background: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 1.2rem;
  color: #555;
  transition: all 0.2s;
}

.extra-row-rule__actions button:hover {
  background: #e9ecef;
  border-color: #adb5bd;
}

.extra-row-rule__actions button:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.extra-row-rule__delete-btn:hover {
  background: #dc3545 !important;
  color: #fff !important;
  border-color: #dc3545 !important;
}

.extra-row-rule__body {
  padding: 1rem 1.2rem;
  display: flex;
  gap: 2rem;
  font-size: 1.3rem;
  color: #555;
}

.extra-row-rule__condition i,
.extra-row-rule__overrides i {
  color: #0f4c81;
  margin-right: 0.3rem;
}

/* Rule Edit Modal */
.extra-row-modal__section {
  margin-bottom: 2rem;
}

.extra-row-modal__section-title {
  font-size: 1.4rem;
  font-weight: bold;
  color: #333;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #0f4c81;
}

.extra-row-modal__section-hint {
  font-weight: normal;
  font-size: 1.1rem;
  color: #888;
  margin-left: 1rem;
}

.extra-row-modal__condition-row {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-wrap: wrap;
}

.extra-row-modal__condition-row select,
.extra-row-modal__condition-row input {
  padding: 0.5rem 0.8rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 1.2rem;
}

.extra-row-modal__condition-left-column {
  width: 150px;
}

.extra-row-modal__condition-right-value {
  width: 150px;
}

.extra-row-modal__condition-particle {
  font-weight: bold;
  font-size: 1.2rem;
  color: #333;
  padding: 0 0.2rem;
}

.extra-row-modal__condition-operator {
  width: 160px;
}

/* Extra Row Modal dialog width */
.extra-row-modal__dialog {
  max-width: 95%;
  width: 95%;
}

/* Columns Table in Modal */
.extra-row-modal__columns-table-wrapper {
  max-height: 400px;
  overflow-y: auto;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.extra-row-modal__columns-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.2rem;
}

.extra-row-modal__columns-table thead {
  position: sticky;
  top: 0;
  z-index: 1;
}

.extra-row-modal__columns-table th {
  background: #f5f7fa;
  padding: 0.6rem 1rem;
  text-align: left;
  font-weight: bold;
  color: #333;
  border-bottom: 2px solid #ddd;
}

.extra-row-modal__columns-table td {
  padding: 0.5rem 0.8rem;
  border-bottom: 1px solid #eee;
  vertical-align: top;
}

.extra-row-modal__columns-table td > select,
.extra-row-modal__columns-table td > input {
  width: 100%;
  padding: 0.4rem 0.6rem;
  border: 1px solid #ccc;
  border-radius: 3px;
  font-size: 1.2rem;
}

/* Column status styles */
.extra-row-column--override {
  background-color: #fff8e1;
}

.extra-row-column--copy {
  background-color: #fff;
}

.extra-row-column__status-badge {
  display: inline-block;
  padding: 0.2rem 0.6rem;
  border-radius: 3px;
  font-size: 1.1rem;
  font-weight: bold;
}

.extra-row-column__status-badge--override {
  background: #ffc107;
  color: #333;
}

.extra-row-column__status-badge--copy {
  background: #e9ecef;
  color: #666;
}

.extra-row-column__value--copy-label {
  color: #888;
  font-style: italic;
  font-size: 1.2rem;
}

/* Extra row column function params */
.extra-row-column__column-container {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  width: 100%;
}

.extra-row-column__value--select,
.extra-row-column__function-select {
  width: 100%;
  padding: 0.4rem 0.6rem;
  border: 1px solid #ccc;
  border-radius: 3px;
  font-size: 1.2rem;
}

.extra-row-column__function-params {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.extra-row-func-param {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.1rem;
  margin-bottom: 0.3rem;
}

.er-param-label {
  white-space: nowrap;
  color: #555;
  font-weight: 500;
  min-width: 100px;
}

.extra-row-func-param input[type="text"],
.extra-row-func-param input[type="number"],
.extra-row-func-param select {
  flex: 1;
  padding: 0.3rem 0.5rem;
  border: 1px solid #ccc;
  border-radius: 3px;
  font-size: 1.1rem;
}

.er-param-hint {
  font-size: 1.1rem;
  color: #666;
  margin-top: 0.2rem;
}

.er-param-hint-inline {
  font-size: 1.1rem;
  color: #666;
  white-space: nowrap;
}

/* Radio button styling for line_number */
.er-radio-option {
  padding: 0.4rem 0;
}

.er-radio-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  padding: 0.4rem 0.8rem;
  border: 1px solid #ddd;
  border-radius: 4px;
  background: #f9f9f9;
  transition: background 0.15s, border-color 0.15s;
}

.er-radio-label:hover {
  background: #eef2ff;
  border-color: #aac;
}

.er-radio-label input[type="radio"] {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin: 0;
  cursor: pointer;
  accent-color: #4a6cf7;
}

.er-radio-label input[type="radio"]:checked + .er-radio-text {
  font-weight: 600;
  color: #333;
}

.er-radio-text {
  font-size: 1.2rem;
  color: #555;
}

.er-lineNumberColumnSelect {
  margin-top: 0.3rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding-left: 0.5rem;
}

/* Concat items in extra row settings */
.er-concat-items-container {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.er-concat-item {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0;
}

.er-concat-item-number {
  font-weight: bold;
  color: #555;
  min-width: 20px;
  font-size: 1.1rem;
}

.er-concat-item-type {
  flex: 0 0 90px;
  width: 90px;
  padding: 0.3rem 0.4rem;
  border: 1px solid #ccc;
  border-radius: 3px;
  font-size: 1.1rem;
}

.er-concat-item-column,
.er-concat-item-value {
  flex: 1;
  min-width: 0;
  padding: 0.3rem 0.5rem;
  border: 1px solid #ccc;
  border-radius: 3px;
  font-size: 1.1rem;
}

.er-btn-remove-concat-item {
  padding: 0.2rem 0.6rem;
  border: 1px solid #ddd;
  border-radius: 3px;
  background: #fff;
  color: #d9534f;
  cursor: pointer;
  font-size: 1.1rem;
  white-space: nowrap;
}

.er-btn-remove-concat-item:hover {
  background: #fef0ef;
  border-color: #d9534f;
}

.er-btn-add-concat-item {
  display: inline-block;
  margin-top: 0.4rem;
  padding: 0.3rem 0.8rem;
  border: 1px dashed #4a6cf7;
  border-radius: 4px;
  background: #f8f9ff;
  color: #4a6cf7;
  cursor: pointer;
  font-size: 1.1rem;
}

.er-btn-add-concat-item:hover {
  background: #eef2ff;
}

.hidden {
  display: none !important;
}

/* ============================================
   Multivendor Customer Fulfillment Email Settings
   ============================================ */

.mv-mail-setting__toggle-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 14px;
  background: #f3f8fd;
  border: 1px solid #d4e4f3;
  border-radius: 8px;
  margin-bottom: 22px;
}

.mv-mail-setting__switch {
  position: relative;
  display: inline-block;
  width: 48px;
  height: 26px;
  flex-shrink: 0;
  margin-bottom: 0;
}

.mv-mail-setting__switch-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.mv-mail-setting__switch-slider {
  position: absolute;
  cursor: pointer;
  inset: 0;
  background: #c3cbd3;
  border-radius: 26px;
  transition: 0.2s;
}

.mv-mail-setting__switch-slider:before {
  content: "";
  position: absolute;
  height: 20px;
  width: 20px;
  left: 3px;
  top: 3px;
  background: #fff;
  border-radius: 50%;
  transition: 0.2s;
}

.mv-mail-setting__switch-input:checked + .mv-mail-setting__switch-slider {
  background: #1f9d57;
}

.mv-mail-setting__switch-input:checked + .mv-mail-setting__switch-slider:before {
  transform: translateX(22px);
}

.mv-mail-setting__toggle-label {
  font-weight: 700;
  font-size: 15px;
}

.mv-mail-setting__toggle-state {
  font-size: 13px;
  font-weight: 700;
  color: #1f9d57;
  margin-left: auto;
}

.mv-mail-setting__toggle-state--off {
  color: #6b7682;
}

.mv-mail-setting__section-title {
  font-size: 14px;
  font-weight: 700;
  color: #15568f;
  border-left: 4px solid #1a6fc4;
  padding-left: 10px;
  margin: 26px 4px 16px;
}

.mv-mail-setting__split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.mv-mail-setting__panel {
  border: 1px solid #e2e6ea;
  border-radius: 8px;
  overflow: hidden;
}

.mv-mail-setting__panel-head {
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
}

.mv-mail-setting__panel--edit .mv-mail-setting__panel-head {
  background: #eef4fa;
  color: #15568f;
  border-bottom: 1px solid #d4e4f3;
}

.mv-mail-setting__panel--preview .mv-mail-setting__panel-head {
  background: #f0f2f4;
  color: #445566;
  border-bottom: 1px solid #e2e6ea;
}

.mv-mail-setting__panel-tag {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 10px;
  color: #fff;
}

.mv-mail-setting__panel-tag--edit {
  background: #1a6fc4;
}

.mv-mail-setting__panel-tag--preview {
  background: #7a8794;
}

.mv-mail-setting__panel-body {
  padding: 18px 16px;
}

.mv-mail-setting__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;
}

.mv-mail-setting__field:last-child {
  margin-bottom: 0;
}

.mv-mail-setting__label {
  font-weight: 600;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 0;
}

.mv-mail-setting__badge {
  font-size: 10px;
  border-radius: 3px;
  padding: 1px 6px;
  font-weight: 700;
}

.mv-mail-setting__badge--required {
  background: #d0342c;
  color: #fff;
}

.mv-mail-setting__badge--optional {
  background: #eceff2;
  color: #6b7682;
}

.mv-mail-setting__hint {
  color: #6b7682;
  font-size: 11.5px;
  line-height: 1.6;
}

.mv-mail-setting textarea.form-input.mv-mail-setting__textarea {
  height: auto;
  min-height: 120px;
  padding: 12px 15px;
  resize: vertical;
}

.mv-mail-setting__form--disabled {
  opacity: 0.45;
  pointer-events: none;
}

.mv-mail-setting__mail-meta {
  background: #fafbfc;
  border: 1px solid #e2e6ea;
  border-radius: 6px;
  padding: 10px 12px;
  margin-bottom: 12px;
  font-size: 12px;
}

.mv-mail-setting__mail-meta-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 2px 0;
}

.mv-mail-setting__mail-meta-key {
  color: #6b7682;
  width: 4.5em;
  flex-shrink: 0;
  white-space: nowrap;
}

.mv-mail-setting__mail-meta-value {
  flex: 1;
  min-width: 0;
  font-weight: 600;
  word-break: break-all;
}

.mv-mail-setting__preview-from-note {
  color: #7a8794;
  font-weight: 400;
}

.mv-mail-setting__preview-empty {
  color: #999;
}

.mv-mail-setting__mail-text {
  background: #fff;
  border: 1px solid #e2e6ea;
  border-radius: 6px;
  padding: 16px;
  font-family: "Consolas", "Menlo", "Courier New", monospace;
  font-size: 12.5px;
  line-height: 1.85;
  color: #2b3138;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 520px;
  overflow: auto;
}

.mv-mail-setting__preview-placeholder {
  color: #c0392b;
}

.mv-mail-setting__note {
  background: #f7f9fb;
  border: 1px solid #e2e6ea;
  border-left: 3px solid #1a6fc4;
  border-radius: 4px;
  padding: 10px 14px;
  font-size: 12px;
  color: #6b7682;
  margin-top: 16px;
  line-height: 1.7;
}

.mv-mail-window {
  max-width: 860px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e2e6ea;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(20, 40, 70, 0.06);
}

.mv-mail-window__chrome {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px 14px;
  background: #f0f2f4;
  border-bottom: 1px solid #e2e6ea;
}

.mv-mail-window__dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #cfd6dd;
}

.mv-mail-window__body {
  padding: 32px 36px;
  font-size: 14px;
  line-height: 2;
  color: #2b3138;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 640px;
  overflow: auto;
}

.mv-mail-window__body .mv-mail-setting__preview-placeholder {
  color: #c0392b;
}

@media (max-width: 1080px) {
  .mv-mail-setting__split {
    grid-template-columns: 1fr;
  }
}

/* app/assets/stylesheets/home.css */

/* --- トップページ用変数 --- */
:root {
  --home-color-primary: #003876;
  --home-color-primary-light: #0056b3;
  --home-color-bg-light: #F8FAFC;
  --home-color-border: #E2E8F0;
  --home-color-text-main: #45556C;
  --home-radius-lg: 16px;
}

/* --- ヒーローセクション --- */
.home-hero {
  position: relative;
  width: 100%;
  height: 500px;
  background: #004da1;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.home-hero__bg {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.home-hero__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, rgba(0,77,161,1) 0%, rgba(0,77,161,0.8) 50%, rgba(0,77,161,0) 100%);
  z-index: 2;
}

.home-hero__content {
  position: relative;
  z-index: 3;
  padding-left: 60px;
  color: white;
}

.home-hero__catchcopy {
  display: block;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 10px;
}

.home-hero__title {
  font-size: 56px;
  font-weight: 700;
  display: block;
  margin: 10px 0;
}

/* --- サービスパネルグリッド --- */
.home-panel-grid {
  display: grid;
  grid-template-columns: repeat(2, 260px);
  gap: 16px;
  margin-top: 24px;
  font-size: 18px;
}

.home-panel {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  border-radius: 12px;
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--home-color-primary);
  text-decoration: none;
  border: 1px solid var(--home-color-border);
  box-shadow: 0 4px 6px rgba(0,0,0,0.05);
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.home-panel__icon-box {
  width: 40px;
  height: 40px;
  background: #FFFFFF;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--home-color-border);
  transition: all 0.3s ease;
}

.home-panel__icon-box img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.home-panel__label {
  color: var(--home-color-primary);
  font-size: 14px;
  font-weight: 700;
}

.home-panel:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0, 56, 118, 0.25);
  background: #FFFFFF;
  border-color: var(--home-color-primary-light);
  text-decoration: none;
  color: var(--home-color-primary);
}

.home-panel:hover .home-panel__icon-box {
  background: var(--home-color-primary);
}

.home-panel:hover .home-panel__icon-box img {
  filter: brightness(0) invert(1);
}

/* --- サービス概要セクション --- */
.home-service-overview {
  padding: 60px 48px;
}

.home-heading-group {
  margin-bottom: 48px;
  text-align: center;
}

.home-heading-2 {
  font-size: 32px;
  color: var(--home-color-primary);
  margin-bottom: 12px;
  font-weight: 700;
}

.home-heading-paragraph {
  font-size: 20px;
  color: var(--home-color-text-main);
}

/* --- サービスカード --- */
.home-service-card {
  background: #FFFFFF;
  border-radius: var(--home-radius-lg);
  padding: 48px;
  margin-bottom: 40px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 20px rgba(0, 56, 118, 0.05);
  border: 1px solid var(--home-color-border);
  scroll-margin-top: 80px;
}

/* --- サプライヤー向けコンパクトヒーロー --- */
.home-hero--compact {
  height: 360px;
}

/* --- オーナー画面用 --- */
.service-explanation {
  font-size: small;
  font-weight: bold;
  color: #555555;
  line-height: 1.6;
  margin-bottom: 24px;
}

.home-card__main-row {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 32px;
}

.home-card__content-left {
  flex: 1;
}

.home-card__service-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

.home-card__service-icon {
  width: 64px;
  height: 64px;
  object-fit: contain;
}

.home-card__service-subtitle {
  font-size: 18px;
  color: var(--home-color-primary);
  font-weight: 700;
  display: block;
  opacity: 0.8;
}

.home-card__service-title {
  font-size: 36px;
  margin: 4px 0 0;
  color: var(--home-color-primary);
  font-weight: 800;
}

.home-card__description {
  font-size: 20px;
  line-height: 1.8;
  margin-bottom: 32px;
  color: var(--home-color-text-main);
}

.home-card__feature-img {
  width: 100%;
  max-width: 500px;
  height: auto;
  object-fit: contain;
}

.home-card__image-right {
  flex: 0 0 420px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.home-card__image-right img {
  width: 100%;
  max-width: 420px;
  height: auto;
  border-radius: 8px;
  filter: drop-shadow(0 10px 30px rgba(0,0,0,0.1));
}

.home-card__footer {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  width: 100%;
}

.home-btn-premium {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 32px;
  background: #FFFFFF;
  color: var(--home-color-primary);
  text-decoration: none;
  font-weight: 700;
  font-size: 18px;
  border: 2px solid var(--home-color-primary);
  border-radius: 50px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  margin-bottom: 12px;
  white-space: nowrap;
}

.home-btn-premium:hover {
  color: #FFFFFF;
  background: var(--home-color-primary);
  transform: translateY(-2px);
  text-decoration: none;
}

.home-cta-note {
  font-size: 14px;
  color: var(--home-color-text-main);
  line-height: 1.6;
  text-align: left;
  max-width: 420px;
  margin: 0;
}

/* --- レスポンシブ対応 --- */
@media (max-width: 1200px) {
  .home-card__main-row {
    flex-direction: column;
  }

  .home-card__image-right {
    flex: none;
    width: 100%;
    justify-content: flex-start;
  }

  .home-card__image-right img {
    max-width: 100%;
  }
}

@media (max-width: 768px) {
  .home-hero {
    height: auto;
    min-height: 400px;
    padding: 40px 0;
  }

  .home-hero__content {
    padding-left: 24px;
    padding-right: 24px;
  }

  .home-hero__catchcopy {
    font-size: 20px;
  }

  .home-hero__title {
    font-size: 36px;
  }

  .home-panel-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .home-service-overview {
    padding: 32px 16px;
  }

  .home-service-card {
    padding: 24px;
  }

  .home-heading-2 {
    font-size: 22px;
  }

  .home-card__service-title {
    font-size: 24px;
  }
}
.lh-1 {
  line-height: 1em;
}

.lh-1-5 {
  line-height: 1.5em;
}

.ecc-action-btn-grey {
  background: #484B4E;
  color: #fff !important;
  border: none;
  border-radius: 6px;
  font-size: 1.4rem;
  font-weight: 500;
  padding: 4px 14px;
  height: 32px;
  min-width: 64px;
  cursor: pointer;
  box-shadow: none;
  transition: background 0.2s;
  text-align: center;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

.ecc-action-btn-grey:hover {
  background: #33383b;
  opacity: 0.85;
  text-decoration: none;
}

.disabled {
  background: #bcbcbc;
  color: #fff !important;
  opacity: 0.7;
  cursor: not-allowed;
  pointer-events: none;
  text-decoration: none;
}

/* site-header を固定する */
.site-header {
  position: fixed;
  top: 0;
  width: 100%;
  height: 60px;
  background-color: #ffffff;
  z-index: 1000;
  display: flex;
  align-items: center;
  padding: 0 20px;
  box-shadow: 0 2px 8px rgba(0, 56, 118, 0.08);
  border-bottom: 1px solid #E2E8F0;
}

/* スクロールでバックグラウンドや影を変える */
.site-header.is-active {
  background-color: #ffffff;
  box-shadow: 0 2px 12px rgba(0, 56, 118, 0.12);
}

/* main-header 固有の内包要素（幅揃えや余白など）*/
.main-header__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

/* ナビゲーションの初期非表示（モバイル時など、toggle で表示） */
.main-header__navGlobal {
  display: flex; /* 必要に応じて flex-wrap や justify-content を追加 */
}

/* 通知ドロップダウンの初期非表示 */
.box-notification {
  display: none;
  position: absolute;
  top: 100%;
  right: 20px;
  background: white;
  border: 1px solid #e0e0e0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  z-index: 1500;
}

/* プロフィールメニューの初期非表示 */
.box-profile {
  display: none;
  position: absolute;
  top: 100%;
  right: 20px;
  background: white;
  border: 1px solid #e0e0e0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  z-index: 1500;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* メニュー項目（.box-profile__menu li a / .box-profile__menu-btn）の見た目は
   application.scss 側で一元管理する。ここで .box-profile li a を定義すると
   同詳細度の競合になりリンクとログアウトボタンの表示がずれるため定義しない。 */

/* Info Link - 情報リンクスタイル */
.info-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.3rem;
  color: #174B7D;
  text-decoration: none;
  white-space: nowrap;
}

.info-link__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: #e8f0fe;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.info-link__text {
  text-decoration: underline;
}

.info-link:hover {
  opacity: 0.8;
}

.info-link-container {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 1rem;
}

.info-link-container--multiple {
  display: flex;
  justify-content: flex-end;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

/* プロモーションバナー */
.promotion-banner {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 300px;
  z-index: 1400;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  overflow: visible;
}

.promotion-banner__close {
  position: absolute;
  top: -12px;
  right: -12px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid #ccc;
  background: #fff;
  color: #666;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  transition: background 0.2s, color 0.2s;
  padding: 0;
}

.promotion-banner__close:hover {
  background: #f0f0f0;
  color: #333;
}

.promotion-banner__link {
  display: block;
}

.promotion-banner__image {
  width: 300px;
  height: 300px;
  object-fit: cover;
  border-radius: 8px 8px 0 0;
  display: block;
}

.promotion-banner__dismiss-label {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  font-size: 12px;
  color: #666;
  cursor: pointer;
  user-select: none;
  background: #fafafa;
  border-radius: 0 0 8px 8px;
}

.promotion-banner__dismiss-checkbox {
  margin: 0;
  cursor: pointer;
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  appearance: checkbox;
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  accent-color: #0066CC;
  flex-shrink: 0;
}
/* --- サイドバー全体を固定 --- */
/* サイドバー本体 */
.sidebar-page {
  position: fixed;
  top: 60px;
  left: 0;
  width: 260px;
  height: calc(100vh - 60px);
  background: #f6f6f7;
  color: #202223;
  border-right: 1px solid #e1e3e5;
  padding: 16px 0;
  z-index: 20;
  display: flex;
  flex-direction: column;
  font-size: 1.4rem;
  line-height: 1.5;
  overflow-y: auto;
  transition: all 0.3s ease;
}

/* スクロールバーのスタイル */
.sidebar-page::-webkit-scrollbar {
  width: 6px;
}

.sidebar-page::-webkit-scrollbar-track {
  background: transparent;
}

.sidebar-page::-webkit-scrollbar-thumb {
  background: #c4cdd5;
  border-radius: 3px;
}

.sidebar-page::-webkit-scrollbar-thumb:hover {
  background: #919eab;
}

/* サイドバー親メニュー（サービス名、設定など） */
.btn-setting {
  width: 100%;
  display: flex;
  align-items: center;
  padding: 10px 16px;
  background: transparent;
  color: #202223;
  font-family: "Noto Sans JP", "Segoe UI", Arial, sans-serif;
  font-size: 2.0rem;
  font-weight: 600;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
  position: relative;
  text-align: left;
}

/* アイコン */
.btn-setting i {
  margin-right: 12px;
  font-size: 1.8rem;
  width: 20px;
  text-align: center;
}

/* テキストやアイコンなど内部要素にもクリックを通す */
.btn-setting * {
  pointer-events: none;
}

/* ホバー時 */
.btn-setting:hover,
.btn-setting:focus {
  background: #e4e5e7;
  outline: none;
}

/* アクティブ（選択中）親メニュー */
.btn-setting__active,
.btn-setting.active {
  background: #f1f2f4;
  color: #202223;
  font-weight: 700;
}

/* サービスリスト上詰め、設定ボタン下固定 */
.sidebar-page__list {
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

.sidebar-page__list li {
  margin-bottom: 4px;
}

.sidebar-setting-btn-fixed {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid #e1e3e5;
}

/* レスポンシブ */
@media screen and (max-width: 834px) {
  .sidebar-page { display: none; }
  .main-page { margin-left: 0; width: 100%; }
}

/* 子メニューエリア（展開可能なサブメニュー） */
.area-setting {
  display: none;
  margin: 0;
  padding: 0 0 8px 0;
  list-style: none;
  background: transparent;
}

.area-setting.is-show {
  display: block;
}

/* 子メニューリスト */
.area-setting__list {
  margin: 0;
  padding: 0;
  list-style: none;
  background: transparent;
  font-size: 1.6rem;
}

.area-setting__list li {
  margin: 0;
}

.area-setting__list li a {
  display: flex;
  align-items: center;
  padding: 8px 16px 8px 48px;
  color: #6d7175;
  font-family: "Noto Sans JP", "Segoe UI", Arial, sans-serif;
  font-size: 1.4rem;
  font-weight: 400;
  text-decoration: none;
  transition: all 0.2s ease;
  position: relative;
}

.area-setting__list li a:hover {
  background: #e4e5e7;
  color: #202223;
}

/* 選択中の子メニュー項目 */
.area-setting__list li a.active,
.area-setting__list li a[aria-current="page"] {
  background: #ffffff;
  color: #202223;
  font-weight: 600;
}

/* 選択中の子メニュー項目の左側のインジケーター */
.area-setting__list li a.active::before,
.area-setting__list li a[aria-current="page"]::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #174B7D;
}

/* 閉じるボタンは不要になったため非表示 */
.area-setting__btn {
  display: none;
}

/* Base style for drag & drop zone */
.dropzone {
  border: 2px dashed #ced4da;
  border-radius: 0.5rem;
  background: #fafbfc;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.dropzone:hover {
  background: #f1f3f5;
  border-color: #0d6efd;
}

.dropzone.drag-over {
  border-color: #0d6efd;
  background: #e7f1ff;
}
.cart-settings {
  margin: 0 auto;
  font-size: 1.1rem;
  padding: 40px 20px;

  .accordion-button {
    padding: 1.4rem 1.6rem;
    font-size: 1.725rem;
    font-weight: 700;
    background-color: #d9eaff;
    border: 1px solid #a3c9ff;
  }

  .accordion-body {
    border: 1px solid #a3c9ff;
    border-top: none;
    border-radius: 0 0 8px 8px;
    padding: 1.8rem 1.4rem;
  }

  .input-group {
    display: flex;
    margin-bottom: 1.5rem;

    @media (max-width: 480px) {
      flex-direction: column;
      margin-bottom: 1.2rem;
    }
  }

  .input-group-text {
    background-color: #007bff;
    color: white;
    width: 180px;
    font-weight: 700;
    font-size: 1.05rem;
    padding: 0.8rem 1rem;
    justify-content: center;
    border-radius: 6px 0 0 6px;

    @media (max-width: 480px) {
      width: 100%;
      margin-bottom: 0.4rem;
      padding-left: 1.2rem;
      border-radius: 6px 6px 0 0;
      text-align: left;
    }
  }

  .form-control {
    font-size: 1rem;
    padding: 1.7rem 1.2rem;
    border-radius: 0 6px 6px 0;
    border: 1px solid #ccc;
    flex: 1;

    @media (max-width: 480px) {
      border-radius: 0 0 6px 6px;
    }
  }

  .btn-submit {
    width: 240px;
    padding: 0.85rem 0;
    font-size: 1.2rem;
    font-weight: 700;
    border-radius: 8px;
    background-color: #007bff;
    color: white;
    border: none;
    margin: 3rem auto 0;
    display: block;
    cursor: pointer;

    @media (max-width: 480px) {
      width: 90%;
    }
  }

  .field-error-banner {
    background-color: #ffcccc;
    color: #a94442;
    padding: 0.6rem 1rem;
    border-left: 4px solid #d9534f;
    border-radius: 4px;
    font-weight: 600;
    font-size: 0.95rem;
  }

  .basic-settings h2 {
    font-size: 1.3rem;
    font-weight: 700;
    color: #007bff;
  }

  .identifier-card {
    border: 1px solid #a3c9ff;
    background-color: #f5faff;
    border-radius: 8px;
    padding: 1.6rem 1.4rem;
  }

  .form-note {
    text-align: center;
    background-color: #eef6ff;
    padding: 0.6rem 1rem;
    border-radius: 4px;
    margin-top: 0.4rem;
    font-size: 0.9rem;
    line-height: 1.4;
  }
}

.settings-page {
  min-height: calc(100vh - 120px);
  padding: 40px 20px;
  background: linear-gradient(135deg, #f5f7fa 0%, #fafbfc 100%);
}

.settings-page__container {
  max-width: 900px;
  margin: 0 auto;
}

.settings-page__title {
  font-size: 3.2rem;
  font-weight: 700;
  color: var(--home-color-primary, #003876);
  text-align: center;
  margin-bottom: 1.5rem;
  position: relative;
}

.settings-page__title::after {
  content: '';
  display: block;
  width: 60px;
  height: 4px;
  background: linear-gradient(90deg, var(--home-color-primary, #003876) 0%, #47cd89 100%);
  margin: 1.2rem auto 0;
  border-radius: 2px;
}

.settings-page__description {
  font-size: 1.6rem;
  color: #666;
  text-align: center;
  line-height: 1.8;
  margin-bottom: 4rem;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.settings-cards {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.settings-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  border: 2px solid #e8eef5;
  border-radius: 16px;
  padding: 3rem 3.2rem;
  text-decoration: none;
  color: inherit;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 8px rgba(0, 56, 118, 0.04);
  position: relative;
  overflow: hidden;
}

.settings-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, var(--home-color-primary, #003876) 0%, #47cd89 100%);
  transform: scaleY(0);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.settings-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 56, 118, 0.12);
  border-color: var(--home-color-primary, #003876);
}

.settings-card:hover::before {
  transform: scaleY(1);
}

.settings-card:active {
  transform: translateY(-2px);
}

.settings-card__header {
  display: flex;
  align-items: center;
  gap: 2.4rem;
  flex: 1;
}

.settings-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f0fe 100%);
  border-radius: 12px;
  color: var(--home-color-primary, #003876);
  flex-shrink: 0;
  transition: all 0.3s ease;
}

.settings-card:hover .settings-card__icon {
  background: linear-gradient(135deg, var(--home-color-primary, #003876) 0%, #0056b3 100%);
  color: #ffffff;
  transform: scale(1.05);
}

.settings-card__content {
  flex: 1;
}

.settings-card__title {
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--home-color-primary, #003876);
  margin-bottom: 0.8rem;
  transition: color 0.3s ease;
}

.settings-card:hover .settings-card__title {
  color: #002855;
}

.settings-card__text {
  font-size: 1.5rem;
  color: #666;
  line-height: 1.6;
  margin: 0;
}

.settings-card__status {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  flex-shrink: 0;
}

.settings-card__badge {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.8rem 1.6rem;
  border-radius: 24px;
  font-size: 1.5rem;
  font-weight: 600;
  transition: all 0.3s ease;
}

.settings-card__badge--completed {
  background: linear-gradient(135deg, #e8f8f1 0%, #d4f4e6 100%);
  color: #2d7a54;
  border: 1px solid #47cd89;
}

.settings-card__badge--pending {
  background: #f5f5f5;
  color: #666;
  border: 1px solid #e0e0e0;
}

.settings-card:hover .settings-card__badge--completed {
  background: linear-gradient(135deg, #47cd89 0%, #2d7a54 100%);
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(71, 205, 137, 0.3);
}

.settings-card__badge-icon {
  display: block;
  flex-shrink: 0;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));
}

.settings-card__badge-text {
  white-space: nowrap;
}

.settings-card__arrow {
  color: #999;
  transition: all 0.3s ease;
  flex-shrink: 0;
}

.settings-card:hover .settings-card__arrow {
  color: var(--home-color-primary, #003876);
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .settings-page {
    padding: 24px 16px;
  }

  .settings-page__title {
    font-size: 2.6rem;
  }

  .settings-page__description {
    font-size: 1.4rem;
    margin-bottom: 3rem;
  }

  .settings-cards {
    gap: 1.6rem;
  }

  .settings-card {
    flex-direction: column;
    align-items: flex-start;
    padding: 2.4rem 2rem;
    gap: 2rem;
  }

  .settings-card__header {
    width: 100%;
    gap: 1.6rem;
  }

  .settings-card__icon {
    width: 56px;
    height: 56px;
  }

  .settings-card__title {
    font-size: 1.9rem;
  }

  .settings-card__text {
    font-size: 1.4rem;
  }

  .settings-card__status {
    width: 100%;
    justify-content: space-between;
  }

  .settings-card__badge {
    font-size: 1.4rem;
    padding: 0.6rem 1.2rem;
  }
}

@media (max-width: 480px) {
  .settings-card__header {
    flex-direction: column;
    align-items: flex-start;
  }

  .settings-card__icon {
    width: 48px;
    height: 48px;
  }
}

/* ============================
   サービス利用状況 - テーブル表示
   ============================ */

.service-table-wrap {
  overflow-x: auto;
  padding: 1rem 0;
}

.service-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #ffffff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  border: 1px solid #e8eef5;
}

.service-table__th {
  padding: 1.2rem 1.6rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: #666;
  text-align: left;
  background: #fafbfc;
  border-bottom: 2px solid #e8eef5;
  white-space: nowrap;
}

.service-table__row {
  transition: background-color 0.15s ease;
}

.service-table__row:hover {
  background-color: #f8fafc;
}

.service-table__row:not(:last-child) .service-table__td {
  border-bottom: 1px solid #f0f2f5;
}

.service-table__td {
  padding: 1.4rem 1.6rem;
  font-size: 1.3rem;
  color: #333;
  vertical-align: middle;
  white-space: nowrap;
}

.service-table__td--name {
  min-width: 200px;
}

.service-table__td--action {
  text-align: right;
}

.service-table__service-info {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}

.service-table__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  flex-shrink: 0;
  color: #ffffff;
  font-size: 1.3rem;
  font-weight: 700;
}

.service-table__icon-img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  flex-shrink: 0;
  object-fit: contain;
}

.service-table__icon-img--small {
  width: 36px;
  height: 36px;
}

.service-table__icon-img--inactive {
  filter: grayscale(100%);
  opacity: 0.5;
}

.service-table__name-group {
  display: flex;
  flex-direction: column;
}

.service-table__name {
  font-size: 1.4rem;
  font-weight: 600;
  color: #333;
}

.service-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.3rem 1rem;
  border-radius: 20px;
  font-size: 1.2rem;
  font-weight: 600;
  white-space: nowrap;
}

.service-status-badge--active {
  background-color: #e8f5e9;
  color: #2e7d32;
  border: 1px solid #a5d6a7;
}

.service-status-badge--inactive {
  background-color: #f5f5f5;
  color: #999;
  border: 1px solid #e0e0e0;
}

/* ============================
   サービス利用状況 - モバイルカード表示
   ============================ */

.service-mobile-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem 0;
}

.service-mobile-card {
  background: #ffffff;
  border: 1px solid #e8eef5;
  border-radius: 10px;
  overflow: hidden;
}

.service-mobile-card__header {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.2rem 1.4rem;
}

.service-mobile-card__title {
  flex: 1;
}

.service-mobile-card__details {
  padding: 0 1.4rem 1.2rem;
  border-top: 1px solid #f0f2f5;
  padding-top: 1rem;
}

.service-mobile-card__detail {
  display: flex;
  justify-content: space-between;
  padding: 0.4rem 0;
  font-size: 1.2rem;
  color: #333;
}

.service-mobile-card__label {
  color: #666;
  font-weight: 500;
}

.service-mobile-card__name {
  font-size: 1.4rem;
  font-weight: 600;
  color: #333;
}

.service-mobile-card__action {
  margin-top: 1rem;
  text-align: right;
}
/* Modern card-style UI for integration settings */

.integration-settings-page {
  background: #f7f8fa;
}

.integration-settings-page .transform-page__container {
  max-width: 1440px;
}

.integration-section__title {
  font-size: 18px;
  font-weight: 700;
  color: #495057;
  margin: 0 0 14px;
}

.integration-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
  gap: 20px;
  margin-bottom: 32px;
}

.integration-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  padding: 36px 24px;
  margin-bottom: 0;
  cursor: pointer;
  background: #fff;
  border: 1px solid #e9ecef;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.2s ease, background-color 0.2s ease;
}
.integration-card:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.integration-card.enabled {
  background: #eef4ff;
  border-color: #d5e2fd;
}
.integration-card.enabled::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: #0d6efd;
}

.integration-card__name {
  display: flex;
  align-items: center;
  align-self: stretch;
  line-height: 1.2;
  font-size: 17px;
  font-weight: 700;
  color: #212529;
}
.integration-card.inactive .integration-card__name {
  color: #6c757d;
}

.integration-card__switch {
  display: flex;
  align-items: center;
  margin-bottom: 0;
  padding-left: 2.5em;
  white-space: nowrap;
}
.integration-card__switch .form-check-input {
  margin-top: 0;
  margin-left: -2.5em;
  cursor: pointer;
}
.integration-card__switch .form-check-input:checked {
  background-color: #0d6efd;
  border-color: #0d6efd;
}
.integration-card__switch .form-check-input:not(:checked) {
  background-color: #ced4da;
  border-color: #ced4da;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}

.integration-card .status-label {
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  color: #0d6efd;
}
.integration-card.inactive .status-label {
  color: #6c757d;
}
/* デフォルト設定画面 */
.photo-assist-default {
  max-width: 1100px;
  margin: 0 auto;
}

.photo-assist-default__box {
  border: 1px solid #e3e8ee;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
}

.photo-assist-default__box-h {
  background: #1a4d8f;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  padding: 11px 15px;
}

.photo-assist-default__box-b {
  padding: 16px;
}

.photo-assist-default__hint {
  background: #eef3fa;
  border: 1px solid #cfe0f2;
  border-radius: 4px;
  padding: 9px 11px;
  font-size: 12px;
  color: #1a4d8f;
  margin-bottom: 18px;
}

.photo-assist-default__param-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.photo-assist-default__pcard {
  border: 1px solid #e3e8ee;
  border-radius: 8px;
  padding: 16px;
  background: #fff;
}

.photo-assist-default__pcard--wide {
  grid-column: 1 / -1;
}

.photo-assist-default__pcard-h {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}

.photo-assist-default__pcard-badge {
  font-size: 10px;
  font-weight: 700;
  color: #1a4d8f;
  background: #eef3fa;
  border: 1px solid #cfe0f2;
  border-radius: 4px;
  padding: 2px 8px;
}

.photo-assist-default__pcard-badge--alt {
  color: #55657a;
  background: #f4f7fb;
  border-color: #e3e8ee;
}

.photo-assist-default__pcard-t {
  font-size: 13px;
  font-weight: 700;
  color: #1f2937;
}

.photo-assist-default__pfield {
  margin-bottom: 18px;
}

.photo-assist-default__pfield:last-child {
  margin-bottom: 0;
}

.photo-assist-default__pfield-l {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 10px;
}

.photo-assist-default__pfield-nm {
  font-size: 12px;
  font-weight: 700;
  color: #1a4d8f;
}

.photo-assist-default__pfield-k {
  font-size: 11px;
  color: #6b7280;
}

.photo-assist-default__seg-row {
  display: grid;
  gap: 10px;
}

.photo-assist-default__seg-row--two {
  grid-template-columns: 1fr 1fr;
}

.photo-assist-default__seg-row--three {
  grid-template-columns: repeat(3, 1fr);
}

.photo-assist-default__seg-row--simple .photo-assist-default__seg-body {
  min-height: 0;
  padding: 14px 10px;
}

.photo-assist-default__seg {
  position: relative;
  display: block;
  margin: 0;
  cursor: pointer;
}

.photo-assist-default__seg-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.photo-assist-default__seg-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-height: 88px;
  padding: 12px 10px;
  border: 1px solid #cbd4df;
  border-radius: 8px;
  background: #fff;
  text-align: center;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.photo-assist-default__seg-input:checked + .photo-assist-default__seg-body {
  border-color: #1a4d8f;
  background: #f3f7fc;
  box-shadow: 0 0 0 1px #1a4d8f inset;
}

.photo-assist-default__seg:hover .photo-assist-default__seg-body {
  border-color: #2f6fc0;
}

.photo-assist-default__seg-ic {
  font-size: 22px;
  line-height: 1;
}

.photo-assist-default__seg-nm {
  font-size: 13px;
  font-weight: 700;
  color: #1f2937;
}

.photo-assist-default__seg-sub {
  font-size: 11px;
  color: #6b7280;
  line-height: 1.4;
}

.photo-assist-default__size-ratio {
  padding: 6px 4px 0;
}

.photo-assist-default__size-ratio-value-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 10px;
}

.photo-assist-default__size-ratio-input-box {
  display: flex;
  align-items: center;
  border: 1px solid #cbd4df;
  border-radius: 6px;
  padding: 6px 10px;
  background: #fff;
  width: fit-content;
}

.photo-assist-default__size-ratio-input {
  width: 56px;
  border: none;
  outline: none;
  font-size: 22px;
  font-weight: 700;
  color: #1a4d8f;
  text-align: right;
  -moz-appearance: textfield;
  appearance: textfield;
}

.photo-assist-default__size-ratio-input::-webkit-outer-spin-button,
.photo-assist-default__size-ratio-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.photo-assist-default__size-ratio-input-unit {
  font-size: 14px;
  font-weight: 500;
  color: #6b7280;
  margin-left: 2px;
}

.photo-assist-default__size-ratio-track {
  position: relative;
  height: 6px;
  background: #e3e7ed;
  border-radius: 3px;
  margin: 18px 6px 8px;
}

.photo-assist-default__size-ratio-fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 90%;
  background: #1a4d8f;
  border-radius: 3px;
  pointer-events: none;
}

.photo-assist-default__size-ratio-range {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 18px;
  margin: 0;
  transform: translateY(-50%);
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  cursor: pointer;
}

.photo-assist-default__size-ratio-range::-webkit-slider-runnable-track {
  background: transparent;
  height: 18px;
}

.photo-assist-default__size-ratio-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  background: #fff;
  border: 3px solid #1a4d8f;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}

.photo-assist-default__size-ratio-range::-moz-range-track {
  background: transparent;
  height: 18px;
}

.photo-assist-default__size-ratio-range::-moz-range-thumb {
  width: 18px;
  height: 18px;
  background: #fff;
  border: 3px solid #1a4d8f;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}

.photo-assist-default__size-ratio-scale {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: #6b7280;
  margin: 0 6px;
}

.photo-assist-default__actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px;
  border-top: 1px solid #e3e8ee;
  background: #f4f7fb;
}

.photo-assist-default__btn {
  padding: 8px 18px;
  font-size: 13px;
  font-weight: 700;
  border-radius: 6px;
  cursor: pointer;
  border: 1px solid #1a4d8f;
  background: #fff;
  color: #1a4d8f;
}

.photo-assist-default__btn:hover {
  background: #f3f7fc;
}

.photo-assist-default__btn--primary {
  background: #1a4d8f;
  color: #fff;
}

.photo-assist-default__btn--primary:hover {
  background: #163f74;
}

.photo-assist-default__btn--primary:disabled {
  background: #eef1f5;
  border-color: #d5dbe3;
  color: #9aa6b2;
  cursor: not-allowed;
}

@media screen and (max-width: 834px) {
  .photo-assist-default__param-grid {
    grid-template-columns: 1fr;
  }

  .photo-assist-default__seg-row--two,
  .photo-assist-default__seg-row--three {
    grid-template-columns: 1fr;
  }
}

/* 商品画像加工画面 */
.photo-assist-edit {
  max-width: 1100px;
  margin: 0 auto;
}

.photo-assist-edit__box {
  margin-bottom: 24px;
}

.photo-assist-edit__box:last-child {
  margin-bottom: 0;
}

.photo-assist-edit__dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 160px;
  padding: 24px 16px;
  border: 2px dashed #cbd4df;
  border-radius: 8px;
  background: #f9fbfd;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}

.photo-assist-edit__dropzone:hover,
.photo-assist-edit__dropzone--dragover {
  border-color: #1a4d8f;
  background: #f3f7fc;
}

.photo-assist-edit__dropzone-ic {
  font-size: 32px;
  line-height: 1;
}

.photo-assist-edit__dropzone-t {
  font-size: 13px;
  color: #55657a;
  text-align: center;
}

.photo-assist-edit__file-list {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
}

.photo-assist-edit__file-item {
  padding: 6px 0;
  font-size: 13px;
  color: #1f2937;
  border-bottom: 1px solid #e3e8ee;
}

.photo-assist-edit__file-item:last-child {
  border-bottom: none;
}

/* 加工履歴画面 */
.photo-assist-history {
  max-width: 1100px;
  margin: 0 auto;
}

.photo-assist-history__box .photo-assist-default__box-h {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.photo-assist-history__card-subtitle {
  font-size: 11px;
  font-weight: 400;
  opacity: 0.85;
}

.photo-assist-history__table-wrap {
  overflow-x: auto;
}

.photo-assist-history__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  table-layout: fixed;
}

.photo-assist-history__table th {
  background: #1a4d8f;
  color: #fff;
  font-weight: 700;
  text-align: left;
  padding: 11px 15px;
}

.photo-assist-history__table td {
  padding: 12px 15px;
  border-bottom: 1px solid #e3e8ee;
  color: #1f2937;
  vertical-align: middle;
  white-space: nowrap;
}

.photo-assist-history__table tr:last-child td {
  border-bottom: 0;
}

.photo-assist-history__col-datetime { width: 170px; }
.photo-assist-history__col-method { width: 130px; }
.photo-assist-history__col-count { width: 80px; }
.photo-assist-history__col-status { width: 100px; }
.photo-assist-history__col-download { width: 130px; }
.photo-assist-history__col-detail { width: 80px; }

.photo-assist-history__method {
  font-size: 13px;
  color: #1f2937;
}

.photo-assist-history__status--processing {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #1f2937;
}

.photo-assist-history__status--completed {
  font-size: 13px;
  color: #1f2937;
}

.photo-assist-history__status--failed {
  font-size: 13px;
  color: #b91c1c;
  font-weight: 700;
}

.photo-assist-history__dash {
  color: #6b7280;
}

.photo-assist-history__btn {
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 700;
  border-radius: 5px;
  cursor: pointer;
  border: 1px solid #1a4d8f;
  background: #1a4d8f;
  color: #fff;
}

.photo-assist-history__btn:disabled {
  background: #eef1f5;
  border-color: #d5dbe3;
  color: #9aa6b2;
  cursor: default;
}

.photo-assist-history__btn--type2:not(:disabled) {
  background: #f97316;
  border-color: #ea580c;
  color: #fff;
}

.photo-assist-history__btn--type2:not(:disabled):hover {
  background: #ea580c;
  border-color: #c2410c;
}

.photo-assist-history__btn--ghost {
  background: #fff;
  color: #1a4d8f;
}

.photo-assist-history__empty {
  text-align: center;
  color: #6b7280;
  padding: 24px 15px !important;
}

.photo-assist-history__pager {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}

.photo-assist-history__pager-summary {
  font-size: 12px;
  color: #55657a;
}

.photo-assist-history__pager-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.photo-assist-history__pager-btn {
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 700;
  border-radius: 5px;
  border: 1px solid #cbd4df;
  background: #fff;
  color: #1a4d8f;
  text-decoration: none;
}

.photo-assist-history__pager-btn:hover {
  background: #f3f7fc;
}

.photo-assist-history__pager-btn--disabled {
  color: #9aa6b2;
  border-color: #e0e5ea;
  background: #f6f7f9;
}

.photo-assist-history__pager-page {
  font-size: 12px;
  color: #55657a;
}

.photo-assist-history__notes {
  margin-top: 14px;
  font-size: 12px;
  color: #55657a;
  line-height: 1.7;
}

.photo-assist-history__notes p {
  margin: 0 0 4px;
}

.photo-assist-history__notes p:last-child {
  margin-bottom: 0;
}

.photo-assist-history-detail {
  max-width: 960px;
  margin: 0 auto;
}

.photo-assist-history-detail__backbar {
  margin-bottom: 16px;
}

.photo-assist-history-detail__backbtn {
  display: inline-block;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  color: #1a4d8f;
  text-decoration: none;
  border: 1px solid #c5d4e8;
  border-radius: 6px;
  background: #fff;
}

.photo-assist-history-detail__backbtn:hover {
  background: #f5f8fc;
  color: #163f74;
}

.photo-assist-history-detail__meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}

.photo-assist-history-detail__meta-item {
  border: 1px solid #e3e8ee;
  border-radius: 6px;
  padding: 11px 14px;
  background: #fafcff;
}

.photo-assist-history-detail__meta-key {
  font-size: 11px;
  color: #6b7280;
  margin-bottom: 4px;
}

.photo-assist-history-detail__meta-value {
  font-size: 14px;
  font-weight: 700;
  color: #1f2937;
}

.photo-assist-history-detail__params {
  border: 1px solid #e3e8ee;
  border-radius: 6px;
  padding: 14px 16px;
  background: #fff;
}

.photo-assist-history-detail__error {
  margin-top: 16px;
  border: 1px solid #fecaca;
  border-radius: 6px;
  padding: 14px 16px;
  background: #fef2f2;
}

.photo-assist-history-detail__error-message {
  margin: 0;
  font-size: 13px;
  color: #b91c1c;
  white-space: pre-wrap;
  word-break: break-word;
}

.photo-assist-history-detail__section-title {
  font-size: 12px;
  font-weight: 700;
  color: #1a4d8f;
  margin: 0 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid #e3e8ee;
}

.photo-assist-history-detail__param-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 16px;
}

.photo-assist-history-detail__param-row {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 13px;
}

.photo-assist-history-detail__param-key {
  color: #6b7280;
  font-size: 11px;
}

.photo-assist-history-detail__param-value {
  font-weight: 600;
  color: #1f2937;
}

@media (max-width: 768px) {
  .photo-assist-history-detail__meta {
    grid-template-columns: 1fr 1fr;
  }

  .photo-assist-history-detail__param-grid {
    grid-template-columns: 1fr;
  }
}

/* FTP設定画面 */
.photo-assist-ftp {
  max-width: 1100px;
  margin: 0 auto;
}

.photo-assist-ftp__toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: #1f2937;
  margin: 0;
  cursor: pointer;
}

.photo-assist-ftp__toggle-input {
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
  appearance: none;
  -webkit-appearance: none;
  border: 2px solid #bbb;
  border-radius: 3px;
  cursor: pointer;
  position: relative;
  background-color: #fff;
}

.photo-assist-ftp__toggle-input:checked {
  background-color: #1a4d8f;
  border-color: #1a4d8f;
}

.photo-assist-ftp__toggle-input:checked::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.photo-assist-ftp__toggle-input:disabled {
  cursor: not-allowed;
  background-color: #f6f7f9;
  border-color: #d5dbe3;
}

.photo-assist-ftp__toggle-input:disabled + span {
  color: #aeb8c4;
}

.photo-assist-ftp__batch-desc {
  margin: 8px 0 0;
  font-size: 12px;
  color: #55657a;
  line-height: 1.6;
}

.photo-assist-ftp__run-form {
  display: none;
}

.photo-assist-ftp__run-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
}

.photo-assist-ftp__run-hint {
  font-size: 12px;
  color: #55657a;
}

.photo-assist-ftp__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 18px;
}

.photo-assist-ftp__grid-wide {
  grid-column: 1 / -1;
}

.photo-assist-ftp__label {
  display: block;
  font-size: 12px;
  color: #55657a;
  margin: 0 0 5px;
}

.photo-assist-ftp__pcard {
  margin-top: 16px;
  margin-bottom: 16px;
}

.photo-assist-ftp__pcard:last-of-type {
  margin-bottom: 0;
}

.photo-assist-ftp__connection-test-row {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
}

.photo-assist-ftp__divider {
  border: none;
  border-top: 1px solid #e3e8ee;
  margin: 22px 0;
}

.photo-assist-ftp__section-t {
  font-size: 14px;
  font-weight: 700;
  color: #1f2937;
  margin: 0 0 12px;
}

.photo-assist-ftp__toggle-row .photo-assist-ftp__toggle {
  align-items: flex-start;
}

.photo-assist-ftp__toggle-row .photo-assist-ftp__toggle-input {
  margin-top: 3px;
}

.photo-assist-ftp__toggle-label-wrap {
  display: block;
}

.photo-assist-ftp__save-footer {
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}

.photo-assist-ftp__save-scope {
  font-size: 12.5px;
  color: #55657a;
}

.photo-assist-ftp__save-scope strong {
  color: #1f2937;
}

.photo-assist-ftp__save-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.photo-assist-ftp__note {
  font-size: 12px;
  color: #55657a;
  line-height: 1.7;
}

@media (max-width: 768px) {
  .photo-assist-ftp__grid {
    grid-template-columns: 1fr;
  }

  .photo-assist-ftp__run-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .photo-assist-ftp__save-footer {
    flex-direction: column;
    align-items: stretch;
  }
}

.photo-assist-history__gdrive-link {
  background: none;
  border: none;
  padding: 0;
  margin: 0 2px;
  color: #fff;
  text-decoration: underline;
  cursor: pointer;
  font: inherit;
}

.photo-assist-history__upload-folder-panel {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
}

.photo-assist-history__upload-folder-panel--hidden {
  display: none;
}

.photo-assist-history__upload-folder-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
}

.photo-assist-history__upload-folder-dialog {
  position: relative;
  width: calc(100vw - 32px);
  max-width: 720px;
  background: #fff;
  border-radius: 8px;
  border: 1px solid #e3e8ee;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18);
}

.photo-assist-history__upload-folder-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: #1a4d8f;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  border-radius: 8px 8px 0 0;
}

.photo-assist-history__upload-folder-close {
  background: none;
  border: none;
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  padding: 0 4px;
}

.photo-assist-history__upload-folder-body {
  padding: 16px;
}

.photo-assist-history__upload-folder-label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #1f2937;
}

.photo-assist-history__upload-folder-input-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  flex-wrap: wrap;
}

.photo-assist-history__upload-folder-prefix {
  font-size: 12px;
  color: #55657a;
  white-space: nowrap;
}

.photo-assist-history__upload-folder-input {
  flex: 1 1 160px;
  min-width: 120px;
  padding: 6px 10px;
  font-size: 13px;
  border: 1px solid #d5dbe3;
  border-radius: 4px;
}

.photo-assist-history__upload-folder-message {
  margin: 12px 0 0;
  font-size: 12px;
}

.photo-assist-history__upload-folder-message--success {
  color: #15803d;
}

.photo-assist-history__upload-folder-message--error {
  color: #b91c1c;
}
/* Company detail page - wider layout, larger text */
.admin-company-detail .table-container {
  max-width: 100%;
  padding: 0 1rem;
}

.admin-company-detail .form-setting__list {
  max-width: 100%;
}

.admin-company-detail .detail-table {
  font-size: 1.5rem;
  width: 100%;
  table-layout: auto;
}

.admin-company-detail .detail-table th {
  font-size: 1.5rem;
  white-space: nowrap;
  min-width: 100px;
}

.admin-company-detail .detail-table td {
  font-size: 1.5rem;
}

/* 費用・日付・請求など情報量の少ない列は幅・文字サイズを抑える */
.admin-company-detail .detail-table th.col-compact,
.admin-company-detail .detail-table td.col-compact {
  font-size: 1.2rem;
  min-width: 0;
}

.admin-company-detail .headline {
  font-size: 1.8rem;
}

/* Company service modals (add / stop / resume) */
.admin-company-service-modal {
  max-width: 520px;
}

.admin-company-service-modal .modal-title {
  font-size: 1.6rem;
  font-weight: 600;
}

.admin-company-service-modal__body {
  font-size: 1.4rem;
  line-height: 1.7;
}

.admin-company-service-modal__body p {
  margin-bottom: 0;
}

.admin-company-service-modal__label {
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
}

.admin-company-service-modal__select {
  font-size: 1.375rem;
  padding: 0.85rem 1rem;
  line-height: 1.5;
}

.admin-company-service-modal .modal-footer {
  justify-content: center;
  gap: 0.75rem;
}

/* Modern card-style UI for admin companies list */
.admin-companies-page {
  padding: 0 0 2rem;
}

/* 企業詳細のヘッダー（タイトル + サービス履歴ボタン） */
.admin-company-detail .company-detail-header {
  margin-bottom: 1.2rem;
}

/* 紹介パートナーは件数が多くても列幅を広げず、一定幅内で横スクロールさせる */
.admin-companies-page th.referral-partners-cell,
.admin-companies-page td.referral-partners-cell {
  width: 180px;
}

/* table-layout: auto ではセルへの max-width が効かないため、内側の要素で幅を固定する */
.admin-companies-page .referral-partners-cell__inner {
  width: 180px;
  overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: thin;
}

.companies-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}

@media (max-width: 768px) {
  .companies-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

.company-card {
  background: #ffffff;
  border: 2px solid #e8eef5;
  border-radius: 16px;
  padding: 2rem;
  text-decoration: none;
  color: inherit;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 8px rgba(23, 75, 125, 0.04);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.company-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, #174B7D 0%, #47cd89 100%);
  transform: scaleY(0);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.company-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(23, 75, 125, 0.12);
  border-color: #174B7D;
}

.company-card:hover::before {
  transform: scaleY(1);
}

.company-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid #e8eef5;
}

.company-card__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #174B7D;
  margin: 0;
  flex: 1;
  transition: color 0.3s ease;
}

.company-card:hover .company-card__title {
  color: #0d3252;
}

.company-card__title a {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
}

.company-card__title a:hover {
  color: #47cd89;
  text-decoration: underline;
}

.company-card__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border-radius: 20px;
  font-size: 1.2rem;
  font-weight: 600;
  background: linear-gradient(135deg, #e8f8f1 0%, #d4f4e6 100%);
  color: #2d7a54;
  border: 1px solid #47cd89;
  white-space: nowrap;
}

.company-card__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.company-card__info-row {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  font-size: 1.4rem;
  line-height: 1.6;
}

.company-card__info-icon {
  color: #174B7D;
  flex-shrink: 0;
  margin-top: 0.2rem;
}

.company-card__info-label {
  font-weight: 600;
  color: #666;
  min-width: 80px;
}

.company-card__info-value {
  color: #333;
  flex: 1;
  word-break: break-word;
}

.company-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #e8eef5;
  margin-top: auto;
}

.company-card__timestamps {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  font-size: 1.2rem;
  color: #999;
}

.company-card__actions {
  display: flex;
  gap: 1rem;
}

.company-card__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.7rem 1.5rem;
  border-radius: 8px;
  font-size: 1.3rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
  border: none;
  cursor: pointer;
}

.company-card__btn--primary {
  background: linear-gradient(135deg, #0d6efd 0%, #3d8bfd 100%);
  color: #fff;
  box-shadow: 0 2px 6px rgba(13, 110, 253, 0.25);
}

.company-card__btn--primary:hover {
  background: linear-gradient(135deg, #0b5ed7 0%, #2b7bff 100%);
  transform: translateY(-1px);
  color: #fff;
  text-decoration: none;
}

.company-card__btn--disabled {
  background: #e9ecef;
  color: #adb5bd;
  cursor: not-allowed;
  box-shadow: none;
}

.company-card__btn--disabled:hover {
  transform: none;
}

/* List-style layout for companies */
.companies-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 20px;
}

.company-list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background-color: #ffffff;
  border-bottom: 1px solid #e5e7eb;
  transition: background-color 0.2s ease;
}

.company-list-item:hover {
  background-color: #f9fafb;
}

.company-list-item:first-child {
  border-top: 1px solid #e5e7eb;
}

.company-list-item__content {
  display: grid;
  grid-template-columns: 30em 10em max-content max-content;
  column-gap: 24px;
  align-items: center;
  flex: 1;
}

.company-list-item__name {
  font-weight: 600;
  overflow: hidden;
}

.company-name-link {
  color: #2563eb;
  text-decoration: none;
  font-size: 15px;
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.company-name-link:hover {
  color: #1d4ed8;
  text-decoration: underline;
}

.company-list-item__info {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: hidden;
}

.info-label {
  color: #6b7280;
  font-size: 14px;
  font-weight: 500;
  display: inline-block;
  width: 5em;
  flex-shrink: 0;
}

.info-value {
  color: #111827;
  font-size: 14px;
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.company-list-item__actions {
  display: flex;
  align-items: center;
  margin-left: auto;
}

.company-list-item__actions .btn {
  white-space: nowrap;
}

@media (max-width: 1024px) {
  .company-list-item__content {
    grid-template-columns: 28em 9em max-content max-content;
    column-gap: 16px;
  }
}

@media (max-width: 768px) {
  .company-list-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  
  .company-list-item__content {
    width: 100%;
    grid-template-columns: 1fr;
    row-gap: 8px;
  }
  
  .company-list-item__actions {
    width: 100%;
    margin-left: 0;
  }
  
  .company-list-item__actions .btn {
    width: 100%;
  }
}

/* メール配信先管理: 用途区分（お知らせ用/エラー用）のpill表示 */
.mail-usage-pill {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.mail-usage-pill--to {
  background: rgb(239, 246, 255);
  color: rgb(23, 75, 125);
}

.mail-usage-pill--cc {
  background: rgb(255, 247, 230);
  color: rgb(146, 100, 6);
}

.mail-usage-pill--none {
  background: rgb(241, 245, 249);
  color: rgb(148, 163, 184);
  font-weight: 500;
}
/* Fulfillment Upload Styles */
.fulfillment-upload-dropzone {
  border: 2px dashed #dee2e6;
  border-radius: 4px;
  cursor: pointer;
  width: 100%;
  text-align: center;
  padding: 3rem 1rem;
  margin-bottom: 1rem;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.fulfillment-upload-dropzone:hover {
  border-color: #0d6efd;
  background-color: #f8f9fa;
}

.fulfillment-upload-dropzone.drag-over {
  border-color: #0d6efd;
  background-color: #e7f1ff;
}

.fulfillment-upload-icon {
  margin-bottom: 1rem;
}

.fulfillment-upload-text {
  color: #6c757d;
}

.fulfillment-upload-default {
  display: block;
}

.fulfillment-selected-file {
  display: none;
  font-size: 1.8rem;
  font-weight: 600;
  color: #198754;
  text-align: center;
  word-break: break-all;
  padding: 1rem;
}

/* Multivendor bcart product/set edit (ecc-*) */
.form-input.ecc-textarea {
  height: auto;
  min-height: 100px;
  padding: 10px 15px !important;
  resize: vertical;
}

.ecc-datetime-fields {
  display: flex;
  gap: 5rem;
  align-items: flex-start;
  flex-wrap: wrap;
}
.ecc-datetime-field {
  flex: 1;
  min-width: 12rem;
}
.ecc-datetime-field__label {
  display: block;
  margin-bottom: 0.25rem;
}
.ecc-datetime-field__input {
  display: block;
  margin-bottom: 0.25rem;
  max-width: 20rem;
}
.ecc-datetime-field__hint {
  display: block;
  font-size: 0.875rem;
  color: #6c757d;
}

.ecc-form-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
}
.ecc-form-inline .form-input {
  width: auto;
  min-width: 10rem;
}
.ecc-form-inline__input {
  max-width: 10rem;
}
.ecc-form-inline__suffix {
  margin-left: 0.25rem;
}
.ecc-form-inline__label {
  margin-right: 0.25rem;
}
.ecc-form-inline--stack .ecc-form-inline__label {
  margin-left: 0;
}
.ecc-help-block {
  margin-top: 0.75rem;
  margin-bottom: 0;
  font-size: 0.875rem;
  color: #6c757d;
  line-height: 1.5;
}

/* Bcart product_set discount fields (owner edit/new) */
.ecc-bcart-discount-dd {
  flex-direction: column;
  align-items: flex-start;
}

.ecc-bcart-discount-hint {
  margin-top: 0.75rem;
  margin-bottom: 0;
}

.ecc-bcart-special-add {
  width: 100%;
  display: block;
  margin-top: 0.75rem;
  text-align: right;
}

.ecc-bcart-unit-inline {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.ecc-bcart-unit-inline .form-input {
  width: 60%;
}

/* Shipping group edit: time option (時間選択肢) number labels */
.ecc-bcart-time-option {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.ecc-bcart-time-option__no {
  margin-bottom: 0;
  font-weight: 600;
  color: #333;
  flex-shrink: 0;
  min-width: 1.5rem;
  text-align: right;
}

.ecc-bcart-time-option .form-input {
  width: auto;
  flex: 1;
}

/* Shipping group edit: shipping size name / unit rows (項目名・単位) */
.shipping-size-name-unit th {
  padding: 1rem 3rem 1rem 0;
  text-align: left;
  white-space: nowrap;
  vertical-align: middle;
}

.shipping-size-name-unit td {
  padding: 1rem 0;
  vertical-align: middle;
  white-space: nowrap;
}

.shipping-size-name-unit td .form-input {
  margin-right: 0.5rem;
}

/* Multivendor supplier header: distinct from owner (User) */
.main-header--supplier {
  background: #cfe2ff !important;
}

/* Multivendor supplier header label (next to logo) */
.main-header__supplier-label {
  margin-left: 16px;
  font-size: 1.4rem;
  font-weight: 600;
  color: #333;
  white-space: nowrap;
}

/* Multivendor bcart product/set edit (expandable row + detail tables) */
.bcart-set-detail-row.collapse {
  display: none;
}

.bcart-set-detail-row.collapse.show {
  display: table-row;
}

.bcart-set-detail-cell {
  padding: 1rem 1.5rem;
  background: #f8f9fa;
  vertical-align: top;
}

.bcart-set-row__toggle-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
}

.bcart-set-row__toggle-btn .bcart-set-row__toggle-icon::before {
  content: "\f282";
  font-family: "bootstrap-icons";
}

.bcart-set-row__toggle-btn[aria-expanded="true"] .bcart-set-row__toggle-icon::before {
  content: "\f286";
}

.transform-dl--compact .transform-dl__row {
  margin-bottom: 0.5rem;
}

.transform-dl--compact dt,
.transform-dl--compact dd {
  display: inline;
  margin: 0;
}

.transform-dl--compact dt {
  font-weight: 600;
  margin-right: 0.5rem;
}

.transform-dl--compact dd {
  margin-right: 1rem;
}

.bcart-set-detail__tables {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}

.bcart-set-detail__table-wrap {
  flex: 1;
  min-width: 280px;
}

.bcart-set-detail__table-wrap .transform-table {
  margin-bottom: 0;
}

.bcart-set-detail__table-wrap .transform-table th {
  white-space: nowrap;
  width: 1%;
}

.edit-modal-header {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.edit-modal-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-left: auto;
  padding: 0;
  border: none;
  border-radius: 50%;
  color: #6c757d;
  background: rgba(0, 0, 0, 0.06);
  font-size: 22px;
  line-height: 1;
  opacity: 1;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.edit-modal-close:hover,
.edit-modal-close:focus {
  color: #343a40;
  background: rgba(0, 0, 0, 0.12);
  outline: none;
  text-decoration: none;
}

.transform-table__caption {
  font-weight: 600;
  text-align: left;
  padding: 0 0 0.5rem 0;
  margin: 0;
}

/* Bcart 商品管理一覧: セット情報テーブルヘッダ（グレー背景・グレー文字） */
.transform-table.transform-table--bcart-sets--product-index thead {
  background: #e9ecef;
}

.transform-table.transform-table--bcart-sets--product-index thead th {
  color: #6c757d;
}

/* Inline style replacements */
.ecc-align-items-center {
  align-items: center;
}

.ecc-btn--back-gradient {
  background: #6c757d;
  background: linear-gradient(135deg, #6c757d 0%, #868e96 100%);
}

.ecc-btn--danger-gradient {
  background: #dc3545;
  background: linear-gradient(135deg, #dc3545 0%, #e4606d 100%);
}

/* Multivendor shipping group edit: bcart-like section */
.ecc-bcart-box-body {
  padding: 0;
}

.ecc-bcart-form-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 1.4rem;
  color: #333;
}

.ecc-bcart-form-table > tbody > tr {
  border-top: 1px solid #e8eef5;
}

.ecc-bcart-form-table > tbody > tr:last-child {
  border-bottom: 1px solid #e8eef5;
}

.ecc-bcart-form-table > tbody > tr > th {
  width: 170px;
  padding: 16px 14px;
  vertical-align: top;
  background: #f8fafc;
  color: #174b7d;
  font-weight: 700;
}

.ecc-bcart-form-table > tbody > tr > td {
  padding: 14px;
  vertical-align: top;
  background: #ffffff;
  color: #333;
}

.ecc-bcart-label-danger {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  border-radius: 3px;
  background: #dc3545;
  color: #fff;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.4;
  vertical-align: middle;
}

.ecc-bcart-form-control {
  width: 100%;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid #ccc;
  border-radius: 3px;
  background: #fff;
  color: #333;
  font-size: 1.4rem;
  line-height: 1.5;
}

.ecc-bcart-form-control[readonly] {
  background: #fff;
  color: #333;
}

.ecc-bcart-form-control:focus {
  outline: none;
  border-color: #174b7d;
  box-shadow: 0 0 0 1px rgba(23, 75, 125, 0.08);
}

.ecc-bcart-form-control--textarea {
  min-height: 220px;
  resize: vertical;
}

.ecc-bcart-table-bordered {
  width: 100%;
  margin-top: 2px;
  border-collapse: collapse;
  font-size: 1.4rem;
}

.ecc-bcart-table-bordered th,
.ecc-bcart-table-bordered td {
  border: 1px solid #e8eef5;
  padding: 12px;
  vertical-align: top;
}

.ecc-bcart-table-bordered th {
  width: 210px;
  background: #f8fafc;
  color: #174b7d;
  font-weight: 700;
}

.ecc-bcart-table-bordered td {
  background: #ffffff;
}

.ecc-bcart-help-text {
  margin-bottom: 8px;
  color: #666;
  font-size: 1.3rem;
  line-height: 1.5;
}

.ecc-bcart-checkbox-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
}

.ecc-bcart-checkbox-line input[type="checkbox"] {
  margin: 0;
}

#ss-table th {
  width: auto;
}

#ss-table {
  table-layout: fixed;
}

#ss-add-wrapper {
  overflow-x: auto;
  overflow-y: auto;
  max-height: 560px;
}

#ss-table .ss-name > th:first-child,
#ss-table .ss-ikkatsu > th:first-child,
#ss-table .ss-pref > td:first-child {
  width: 95px !important;
  min-width: 95px;
  max-width: 95px;
  white-space: nowrap;
  text-align: left;
}

#ss-table .ss-name > th:not(:first-child),
#ss-table .ss-ikkatsu > th:not(:first-child),
#ss-table .ss-pref > td:not(:first-child) {
  width: 130px;
  min-width: 130px;
  max-width: 130px;
  text-align: left;
}

#ss-table thead th {
  position: sticky;
  z-index: 3;
  background: #f8fafc;
}

#ss-table .ss-name th {
  top: 0;
}

#ss-table .ss-ikkatsu th {
  top: 58px;
}

#ss-table .ss-del {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-left: 6px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: #dc3545;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  vertical-align: middle;
}

#ss-table .ss-del:hover {
  color: #b02a37;
}

#flat-shipping-cost-table th {
  width: auto;
  min-width: 72px;
  max-width: 100px;
  white-space: nowrap;
}

#flat-shipping-cost-table td.flat-shipping-cost-cell {
  min-width: 160px;
  width: 160px;
}

#flat-shipping-cost-table .ecc-bcart-unit-inline .form-input {
  width: auto;
  min-width: 100px;
  flex: 1 1 100px;
  max-width: 120px;
}

.ecc-bcart-add-button {
  background: #C65340;
  color: #FFF;
  padding: 3px 8px 1px;
  margin-top: 8px;
  margin-bottom: 12px;
  cursor: pointer;
  border-color: #C65340;
  font-size: 1.5rem;
}

.ecc-bcart-add-button:hover,
.ecc-bcart-add-button:focus {
  background: #b54837;
  color: #FFF;
  border-color: #b54837;
}

/* Shipping group edit: CSV download / upload toolbar */
.ecc-shipping-group-csv-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 1.5rem;
}

.ecc-shipping-group-csv-download {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding-right: 0.5rem;
}

.ecc-shipping-group-csv-divider {
  align-self: stretch;
  width: 2px;
  min-height: 4.4rem;
  margin: 0.25rem 0;
  background: #c5d3e3;
  border-radius: 1px;
  flex-shrink: 0;
}

.ecc-shipping-group-csv-upload {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  flex: 1 1 320px;
  min-width: 0;
  padding-left: 0.5rem;
}

.ecc-shipping-group-csv-upload__select {
  margin: 0;
  white-space: nowrap;
  cursor: pointer;
}

.ecc-shipping-group-csv-upload__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.ecc-shipping-group-csv-upload__filename {
  flex: 1 1 140px;
  min-width: 0;
  max-width: 320px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.3rem;
  line-height: 1.4;
  color: #495057;
  padding: 0.55rem 0.9rem;
  background: #f8fafc;
  border: 1px solid #e8eef5;
  border-radius: 6px;
}

@media (max-width: 767px) {
  .ecc-shipping-group-csv-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .ecc-shipping-group-csv-divider {
    width: 100%;
    height: 2px;
    min-height: 0;
    margin: 0.5rem 0;
  }

  .ecc-shipping-group-csv-download,
  .ecc-shipping-group-csv-upload {
    padding-left: 0;
    padding-right: 0;
  }

  .ecc-shipping-group-csv-upload {
    flex-direction: column;
    align-items: stretch;
  }

  .ecc-shipping-group-csv-upload__filename {
    max-width: none;
  }
}

/* Supplier payments (owner) */
.supplier-payment-date-sep {
  align-self: center;
  color: var(--ecc-text-muted, #6c757d);
}

.supplier-payment-table-info {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 1rem 2.5rem;
  width: 100%;
  margin-bottom: 1rem;
  font-size: 1.5rem;
  font-weight: 600;
}

.supplier-payment-index-table .supplier-payment-status-cell {
  font-size: 1.4rem;
}

.supplier-payment-index-table .supplier-payment-status {
  font-size: 1.4rem;
  padding: 0.35rem 1rem;
}

.supplier-payment-actions-cell {
  text-align: center;
}

.supplier-payment-actions-cell .transform-table__actions {
  justify-content: center;
}

.supplier-payment-detail-summary {
  max-width: 1100px;
  margin-bottom: 2rem;
  border: 1px solid #d0d6dd;
  padding: 1.25rem 1.5rem;
  background: #fafbfc;
}

.supplier-payment-show .supplier-payment-summary-grid {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 1px;
  margin-bottom: 1rem;
  background: #d0d6dd;
  border: 1px solid #d0d6dd;
}

.supplier-payment-show .supplier-payment-summary-grid__label {
  background: #eef1f4;
  padding: 0.75rem 1rem;
  font-size: 1.5rem;
  font-weight: 600;
  color: #333;
  text-align: left;
}

.supplier-payment-show .supplier-payment-summary-grid__value {
  padding: 0.75rem 1rem;
  font-size: 1.5rem;
  color: #222;
  background: #fff;
  text-align: left;
}

.supplier-payment-show .supplier-payment-summary-grid__value--total {
  font-size: 1.8rem;
  font-weight: 700;
  color: #1f3f6a;
}

.supplier-payment-show .supplier-payment-tax-table {
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin-bottom: 1rem;
  background: #d0d6dd;
  border: 1px solid #d0d6dd;
}

.supplier-payment-show .supplier-payment-tax-table__row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
}

.supplier-payment-show .supplier-payment-tax-table__cell {
  display: flex;
  align-items: center;
  background: #fff;
  min-width: 0;
}

.supplier-payment-show .supplier-payment-tax-table__label {
  background: #eef1f4;
  padding: 0.75rem 1rem;
  font-size: 1.4rem;
  font-weight: 600;
  color: #333;
  min-width: 9.5rem;
  flex-shrink: 0;
  text-align: left;
}

.supplier-payment-show .supplier-payment-tax-table__value {
  flex: 1;
  padding: 0.75rem 1rem;
  font-size: 1.5rem;
  color: #222;
  text-align: right;
}

.supplier-payment-detail-actions {
  padding-top: 1rem;
  margin-top: 0.5rem;
}

.supplier-payment-show .supplier-payment-breakdown {
  margin-top: 1rem;
  width: 100%;
  max-width: none;
}

.supplier-payment-show .supplier-payment-breakdown__title {
  text-align: center;
  font-size: 2.2rem;
  font-weight: 700;
  color: #1f3f6a;
  border-top: 2px solid #1f3f6a;
  padding-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.supplier-payment-show .supplier-payment-voucher {
  margin-bottom: 1.5rem;
  width: 100%;
  border: 1px solid #d0d6dd;
  background: #fff;
  overflow: hidden;
}

.supplier-payment-show .supplier-payment-voucher__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.75rem 1.5rem;
  padding: 1rem 1.25rem;
  background: #f5f7fa;
  border-bottom: 1px solid #d0d6dd;
  font-size: 1.5rem;
  font-weight: 600;
}

.supplier-payment-show .supplier-payment-voucher__meta,
.supplier-payment-show .supplier-payment-voucher__tax-lines {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 2rem;
  text-align: left;
}

.supplier-payment-show .supplier-payment-voucher__items {
  width: 100%;
  margin: 0;
  border: none;
  border-radius: 0;
}

.supplier-payment-show .supplier-payment-voucher__items thead th,
.supplier-payment-show .supplier-payment-voucher__items tbody td {
  font-size: 1.5rem;
  padding: 1.1rem 1.35rem;
}

.supplier-payment-status {
  display: inline-block;
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 9999px;
}

.supplier-payment-status--calculated {
  background: #fff3cd;
  color: #856404;
}

.supplier-payment-status--recalculating {
  background: #cce5ff;
  color: #004085;
}

.supplier-payment-status--confirmed {
  background: #d4edda;
  color: #155724;
}

@media (max-width: 768px) {
  .supplier-payment-show .supplier-payment-voucher__head {
    flex-direction: column;
  }

  .supplier-payment-show .supplier-payment-tax-table__row {
    grid-template-columns: 1fr;
  }

  .supplier-payment-show .supplier-payment-summary-grid {
    grid-template-columns: 1fr;
  }
}

/* 受注通知メール設定 */
.order-notification-mail-setting .transform-dl__row.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}

.order-notification-mail-setting .transform-dl__dd {
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}

.order-notification-mail-setting__caption {
  font-size: 13px;
  color: #6b7280;
  white-space: nowrap;
}

.order-notification-mail-setting__time-rows {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.order-notification-mail-setting__time-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.order-notification-mail-setting__hour-select {
  min-width: 110px;
  width: auto;
}

.order-notification-mail-setting__minute-fixed {
  font-size: 15px;
  padding: 11px 16px;
  border: 1.5px solid #e3e7ec;
  border-radius: 8px;
  background: #f3f4f6;
  color: #6b7280;
}

.order-notification-mail-setting__remove-btn {
  background: none;
  border: none;
  color: #d05353;
  font-size: 20px;
  cursor: pointer;
  line-height: 1;
  padding: 4px 8px;
  border-radius: 6px;
}

.order-notification-mail-setting__remove-btn:hover {
  background: #fbeaea;
}

.order-notification-mail-setting__remove-btn:disabled {
  color: #d1d5db;
  cursor: not-allowed;
  background: none;
}

.order-notification-mail-setting__add-wrap {
  width: 100%;
}

.order-notification-mail-setting__add-btn {
  background: #fff;
  border: 1.5px solid #e3e7ec;
  border-radius: 8px;
  padding: 10px 20px;
  font-size: 14px;
  color: #374151;
  cursor: pointer;
}

.order-notification-mail-setting__add-btn:hover {
  background: #f3f6f9;
  border-color: #b9c6d4;
}

.order-notification-mail-setting__add-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Bcart 出荷処理の日付入力（未選択時は 年/月/日 を表示） */
.form-input-date-jp-wrap {
  position: relative;
  width: 100%;
}

.form-input-date-jp-wrap::before {
  content: "年/月/日";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #6c757d;
  pointer-events: none;
}

.form-input-date-jp-wrap.is-filled::before,
.form-input-date-jp-wrap:focus-within::before {
  display: none;
}

.form-input-date-jp-wrap .form-input-date-jp:not(:focus)::-webkit-datetime-edit {
  color: transparent;
}

.form-input-date-jp-wrap.is-filled .form-input-date-jp::-webkit-datetime-edit,
.form-input-date-jp-wrap .form-input-date-jp:focus::-webkit-datetime-edit {
  color: inherit;
}

/* 在庫更新: マイナス値は赤字 */
.stock-update-input.is-negative {
  color: #dc3545;
}

/* 連携設定: プルダウン下の注意文言を縦並びに */
.integration-settings .transform-dl__dd {
  align-items: flex-start;
}
/* line 5, app/assets/stylesheets/admin_list_pages.scss */
.main-page .breadcrumb--admin {
  padding-top: 0.5em;
  margin-bottom: 0.2em;
}

/* line 11, app/assets/stylesheets/admin_list_pages.scss */
.scroll-content.admin-page,
.scroll-content.admin-list-page {
  padding-top: 0;
}

/* line 17, app/assets/stylesheets/admin_list_pages.scss */
.admin-page, .admin-list-page {
  padding: 8px 24px 24px;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  min-height: calc(100vh - 120px);
}

/* line 24, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-ttl__01, .admin-list-page .c-ttl__01 {
  margin-bottom: 16px;
}

/* line 27, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-ttl__01 div, .admin-list-page .c-ttl__01 div {
  font-size: 2.4rem;
  font-weight: 700;
  color: #1e293b;
  position: relative;
  padding-left: 16px;
}

/* line 34, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-ttl__01 div::before, .admin-list-page .c-ttl__01 div::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 28px;
  background: linear-gradient(180deg, #174B7D 0%, #2364a0 100%);
  border-radius: 2px;
}

/* line 49, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .table-container, .admin-list-page .table-container {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
  padding: 24px;
  margin: 0;
}

/* line 58, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-container, .admin-list-page .form-container {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
  padding: 32px;
  margin: 0;
  max-width: 900px;
}

/* line 68, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .d-flex.justify-content-between, .admin-list-page .d-flex.justify-content-between,
.admin-page .d-flex.justify-content-end,
.admin-list-page .d-flex.justify-content-end {
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e2e8f0;
}

/* line 76, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-input, .admin-list-page .form-input {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 1.4rem;
  transition: all 0.2s ease;
  background: #ffffff;
}

/* line 84, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-input:focus, .admin-list-page .form-input:focus {
  outline: none;
  border-color: #174B7D;
  box-shadow: 0 0 0 3px rgba(23, 75, 125, 0.1);
}

/* line 90, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-input:hover, .admin-list-page .form-input:hover {
  border-color: #cbd5e1;
}

/* line 94, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-input::placeholder, .admin-list-page .form-input::placeholder {
  color: #94a3b8;
}

/* line 99, app/assets/stylesheets/admin_list_pages.scss */
.admin-page select.form-input, .admin-list-page select.form-input {
  cursor: pointer;
}

/* line 103, app/assets/stylesheets/admin_list_pages.scss */
.admin-page textarea.form-input, .admin-list-page textarea.form-input {
  resize: vertical;
  min-height: 100px;
}

/* line 109, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table, .admin-list-page .ecc-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

/* line 115, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table thead th, .admin-list-page .ecc-table thead th {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  color: #475569;
  font-weight: 600;
  font-size: 1.3rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 14px 16px;
  border-bottom: 2px solid #e2e8f0;
  white-space: nowrap;
}

/* line 126, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table thead th:first-child, .admin-list-page .ecc-table thead th:first-child {
  border-radius: 8px 0 0 0;
}

/* line 130, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table thead th:last-child, .admin-list-page .ecc-table thead th:last-child {
  border-radius: 0 8px 0 0;
}

/* line 137, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody tr, .admin-list-page .ecc-table tbody tr {
  transition: all 0.15s ease;
}

/* line 140, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody tr[data-href], .admin-list-page .ecc-table tbody tr[data-href] {
  cursor: pointer;
}

/* line 144, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody tr:nth-child(even), .admin-list-page .ecc-table tbody tr:nth-child(even) {
  background: #f8fafc;
}

/* line 148, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody tr:hover, .admin-list-page .ecc-table tbody tr:hover {
  background: #e0f2fe;
}

/* line 152, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody tr:last-child td, .admin-list-page .ecc-table tbody tr:last-child td {
  border-bottom: none;
}

/* line 155, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody tr:last-child td:first-child, .admin-list-page .ecc-table tbody tr:last-child td:first-child {
  border-radius: 0 0 0 8px;
}

/* line 159, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody tr:last-child td:last-child, .admin-list-page .ecc-table tbody tr:last-child td:last-child {
  border-radius: 0 0 8px 0;
}

/* line 165, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody td, .admin-list-page .ecc-table tbody td {
  padding: 14px 16px;
  color: #334155;
  font-size: 1.4rem;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
}

/* line 172, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody td a:not(.c-btn__02):not(.c-btn__03):not(.c-btn__01), .admin-list-page .ecc-table tbody td a:not(.c-btn__02):not(.c-btn__03):not(.c-btn__01) {
  color: #174B7D;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.2s ease;
}

/* line 178, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .ecc-table tbody td a:not(.c-btn__02):not(.c-btn__03):not(.c-btn__01):hover, .admin-list-page .ecc-table tbody td a:not(.c-btn__02):not(.c-btn__03):not(.c-btn__01):hover {
  color: #0d2e4e;
  text-decoration: underline;
}

/* line 188, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__01, .admin-list-page .c-btn__01 {
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 14px 40px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 200px;
}

/* line 205, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__01:hover, .admin-list-page .c-btn__01:hover {
  background: linear-gradient(135deg, #0d2e4e 0%, #174B7D 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(23, 75, 125, 0.35);
  color: #ffffff;
  text-decoration: none;
}

/* line 213, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__01:active, .admin-list-page .c-btn__01:active {
  transform: translateY(0);
}

/* line 219, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__02, .admin-list-page .c-btn__02 {
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  color: #ffffff;
  font-size: 1.4rem;
  font-weight: 600;
  padding: 10px 20px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
  box-shadow: 0 2px 4px rgba(23, 75, 125, 0.2);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* line 235, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__02:hover, .admin-list-page .c-btn__02:hover {
  background: linear-gradient(135deg, #0d2e4e 0%, #174B7D 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(23, 75, 125, 0.3);
  color: #ffffff;
  text-decoration: none;
}

/* line 243, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__02:active, .admin-list-page .c-btn__02:active {
  transform: translateY(0);
}

/* line 249, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__03, .admin-list-page .c-btn__03 {
  background: #ffffff;
  color: #475569;
  font-size: 1.3rem;
  font-weight: 500;
  padding: 6px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  margin: 2px;
}

/* line 264, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__03:hover, .admin-list-page .c-btn__03:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #1e293b;
  text-decoration: none;
}

/* line 272, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__03.text-danger, .admin-list-page .c-btn__03.text-danger {
  color: #dc2626;
  border-color: #fecaca;
}

/* line 276, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .c-btn__03.text-danger:hover, .admin-list-page .c-btn__03.text-danger:hover {
  background: #fef2f2;
  border-color: #f87171;
  color: #b91c1c;
}

/* line 285, app/assets/stylesheets/admin_list_pages.scss */
.admin-page input.c-btn__03[type="submit"], .admin-list-page input.c-btn__03[type="submit"] {
  background: #f8fafc;
  border-color: #cbd5e1;
}

/* line 289, app/assets/stylesheets/admin_list_pages.scss */
.admin-page input.c-btn__03[type="submit"]:hover, .admin-list-page input.c-btn__03[type="submit"]:hover {
  background: #e2e8f0;
}

/* line 296, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list .headline, .admin-list-page .form-setting__list .headline {
  font-size: 1.6rem;
  font-weight: 700;
  padding: 12px 16px;
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  color: #ffffff;
  border-radius: 8px;
  margin-bottom: 20px;
  margin-top: 0;
}

/* line 307, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list .headline.mt-4, .admin-list-page .form-setting__list .headline.mt-4 {
  margin-top: 32px;
}

/* line 312, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dl, .admin-list-page .form-setting__list-dl {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 16px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

/* line 323, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dt, .admin-list-page .form-setting__list-dt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 240px;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  color: #475569;
  padding: 14px 16px;
  font-size: 1.4rem;
  font-weight: 600;
  border-right: 1px solid #e2e8f0;
}

/* line 335, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dt .required, .admin-list-page .form-setting__list-dt .required {
  background: #dc2626;
  color: #ffffff;
  font-size: 1.1rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  white-space: nowrap;
}

/* line 346, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dd, .admin-list-page .form-setting__list-dd {
  flex: 1;
  padding: 14px 16px;
  min-width: 0;
  background: #ffffff;
}

/* line 352, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dd .form-input, .admin-list-page .form-setting__list-dd .form-input {
  width: 100%;
}

/* line 356, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dd .form-check, .admin-list-page .form-setting__list-dd .form-check {
  display: flex;
  align-items: center;
  padding-left: 0;
}

/* line 362, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dd .form-check-input, .admin-list-page .form-setting__list-dd .form-check-input {
  width: 18px;
  height: 18px;
  float: none;
  margin: 0 8px 0 0;
  cursor: pointer;
}

/* line 370, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dd .form-check-label, .admin-list-page .form-setting__list-dd .form-check-label {
  font-size: 1.4rem;
  color: #475569;
  cursor: pointer;
}

/* line 376, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .form-setting__list-dd small.text-muted, .admin-list-page .form-setting__list-dd small.text-muted {
  display: block;
  margin-top: 6px;
  font-size: 1.2rem;
  color: #94a3b8;
}

/* line 385, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .alert-danger, .admin-list-page .alert-danger,
.admin-page #error_explanation,
.admin-list-page #error_explanation {
  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
  border: 1px solid #fecaca;
  border-left: 4px solid #dc2626;
  border-radius: 8px;
  padding: 16px 20px;
  margin-bottom: 24px;
}

/* line 394, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .alert-danger ul, .admin-list-page .alert-danger ul,
.admin-page #error_explanation ul,
.admin-list-page #error_explanation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* line 400, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .alert-danger li, .admin-list-page .alert-danger li,
.admin-page #error_explanation li,
.admin-list-page #error_explanation li {
  color: #dc2626;
  font-size: 1.4rem;
  font-weight: 500;
  padding: 4px 0;
}

/* line 409, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .detail-table, .admin-list-page .detail-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin-bottom: 24px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  overflow: hidden;
}

/* line 418, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .detail-table th, .admin-list-page .detail-table th {
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  color: #475569;
  font-weight: 600;
  font-size: 1.3rem;
  padding: 12px 16px;
  border-bottom: 1px solid #e2e8f0;
  border-right: 1px solid #e2e8f0;
  width: 180px;
  text-align: left;
}

/* line 430, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .detail-table td, .admin-list-page .detail-table td {
  background: #ffffff;
  color: #334155;
  font-size: 1.4rem;
  padding: 12px 16px;
  border-bottom: 1px solid #e2e8f0;
  border-right: 1px solid #e2e8f0;
}

/* line 438, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .detail-table td:last-child, .admin-list-page .detail-table td:last-child {
  border-right: none;
}

/* line 442, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .detail-table td a, .admin-list-page .detail-table td a {
  color: #174B7D;
  text-decoration: none;
  font-weight: 500;
}

/* line 447, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .detail-table td a:hover, .admin-list-page .detail-table td a:hover {
  text-decoration: underline;
}

/* line 454, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .detail-table tr:last-child th, .admin-list-page .detail-table tr:last-child th, .admin-page .detail-table tr:last-child td, .admin-list-page .detail-table tr:last-child td {
  border-bottom: none;
}

/* line 461, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .empty-state, .admin-list-page .empty-state {
  text-align: center;
  padding: 48px 24px;
  color: #64748b;
}

/* line 466, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .empty-state i, .admin-list-page .empty-state i {
  font-size: 4rem;
  margin-bottom: 16px;
  opacity: 0.5;
}

/* line 472, app/assets/stylesheets/admin_list_pages.scss */
.admin-page .empty-state p, .admin-list-page .empty-state p {
  font-size: 1.5rem;
}

@media screen and (max-width: 834px) {
  /* line 485, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page,
.admin-list-page {
    padding: 16px;
  }
  /* line 489, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .table-container,
.admin-page .form-container,
.admin-list-page .table-container,
.admin-list-page .form-container {
    padding: 16px;
    overflow-x: auto;
  }
  /* line 495, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .ecc-table,
.admin-list-page .ecc-table {
    font-size: 1.3rem;
  }
  /* line 498, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .ecc-table th, .admin-page .ecc-table td,
.admin-list-page .ecc-table th,
.admin-list-page .ecc-table td {
    padding: 10px 12px;
  }
  /* line 503, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .d-flex.justify-content-between,
.admin-list-page .d-flex.justify-content-between {
    flex-direction: column;
    gap: 12px;
  }
  /* line 508, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .form-setting__list-dl,
.admin-list-page .form-setting__list-dl {
    flex-direction: column;
  }
  /* line 512, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .form-setting__list-dt,
.admin-list-page .form-setting__list-dt {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #e2e8f0;
  }
  /* line 518, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .form-container,
.admin-list-page .form-container {
    padding: 20px;
  }
  /* line 522, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .c-btn__01,
.admin-list-page .c-btn__01 {
    width: 100%;
    min-width: auto;
  }
  /* line 528, app/assets/stylesheets/admin_list_pages.scss */
  .admin-page .detail-table th,
.admin-list-page .detail-table th {
    width: 120px;
  }
}
/* line 14, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-lead {
  font-size: 1.3rem;
  color: #64748b;
  line-height: 1.7;
  margin-bottom: 18px;
}

/* line 20, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-lead code {
  background: #eef2f7;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 1.2rem;
}

/* line 29, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-section {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  padding: 18px 20px;
  margin-bottom: 18px;
}

/* line 37, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-section--feature {
  border: 2px solid #378add;
}

/* line 41, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-section--warn {
  border-color: #f0c36d;
  background: #fffbf2;
}

/* line 47, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-section__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

/* line 55, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-title {
  font-size: 1.6rem;
  font-weight: 600;
  color: #1e293b;
}

/* line 61, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-note {
  font-size: 1.3rem;
  color: #64748b;
  line-height: 1.7;
  margin-bottom: 14px;
}

/* line 67, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-note--inline {
  margin-bottom: 0;
}

/* line 72, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-subnote {
  font-size: 1.15rem;
  color: #94a3b8;
  margin-top: 12px;
}

/* line 78, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-collision-text {
  color: #e24b4a;
  font-weight: 600;
}

/* line 84, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

/* line 91, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metric {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 14px 16px;
}

/* line 97, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metric--alert {
  background: #fcebeb;
  border-color: #f3b0b0;
}

/* line 102, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metric__label {
  display: block;
  font-size: 1.2rem;
  color: #64748b;
  margin-bottom: 6px;
}

/* line 109, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metric__value {
  font-size: 2.4rem;
  font-weight: 700;
  color: #1e293b;
}

/* line 114, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metric__value small {
  font-size: 1.2rem;
  font-weight: 500;
  color: #64748b;
  margin-left: 2px;
}

/* line 124, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 1.25rem;
  color: #64748b;
  margin-bottom: 18px;
}

/* line 133, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-legend__item {
  display: flex;
  align-items: center;
  gap: 6px;
}

/* line 139, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-swatch {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  display: inline-block;
}

/* line 145, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-swatch--collision {
  background: #e24b4a;
}

/* line 151, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-lane {
  margin: 8px 0 4px;
}

/* line 155, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-lane__track {
  position: relative;
  height: 30px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 5px;
}

/* line 163, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tick {
  position: absolute;
  bottom: 0;
  width: 2px;
  height: 14px;
  background: #378add;
  transform: translateX(-1px);
  border-radius: 1px;
}

/* line 172, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tick--collision {
  width: 3px;
  height: 24px;
  background: #e24b4a;
  transform: translateX(-1.5px);
  z-index: 1;
}

/* line 181, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-axis {
  position: relative;
  height: 16px;
  margin-top: 4px;
}

/* line 187, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-axis__label {
  position: absolute;
  font-size: 1.1rem;
  color: #94a3b8;
  transform: translateX(-50%);
}

/* line 193, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-axis__label--end {
  right: 0;
  left: auto;
  transform: none;
}

/* line 200, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-collisions {
  margin-top: 14px;
  background: #fff5f5;
  border: 1px solid #f3d0d0;
  border-radius: 8px;
  padding: 12px 14px;
}

/* line 207, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-collisions__title {
  display: block;
  font-size: 1.3rem;
  font-weight: 600;
  color: #a32d2d;
  margin-bottom: 8px;
}

/* line 215, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-collisions ul {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* line 221, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-collisions li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: 1.25rem;
}

/* line 228, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-collisions__min {
  flex: 0 0 44px;
  font-weight: 700;
  color: #e24b4a;
}

/* line 234, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-collisions__jobs {
  color: #475569;
}

/* line 240, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl {
  margin-top: 6px;
  position: relative;
}

/* line 245, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__row {
  display: grid;
  grid-template-columns: 190px 1fr;
  align-items: center;
  gap: 12px;
  margin-bottom: 6px;
}

/* line 252, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__row--axis {
  margin-bottom: 8px;
}

/* line 257, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__axis {
  position: relative;
  height: 14px;
  font-size: 1.1rem;
  color: #94a3b8;
}

/* line 263, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__axis span {
  position: absolute;
  transform: translateX(-50%);
}

/* line 268, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__axis--end {
  right: 0;
  left: auto !important;
  transform: none !important;
}

/* line 275, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__label {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* line 281, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__key {
  font-size: 1.2rem;
  color: #334155;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* line 289, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__sched {
  font-size: 1.05rem;
  color: #94a3b8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* line 297, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__track {
  position: relative;
  height: 16px;
  border-radius: 3px;
  overflow: hidden;
  background: repeating-linear-gradient(to right, transparent 0 calc(25% - 1px), rgba(15, 23, 42, 0.07) calc(25% - 1px) 25%), #f8fafc;
}

/* line 311, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__bar,
.admin-recurring-schedules .ars-tl__hourly {
  position: absolute;
  inset: 0;
}

/* line 317, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__dot {
  position: absolute;
  top: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

/* line 326, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__grouphead {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 16px 0 8px;
  font-size: 1.3rem;
  font-weight: 600;
  color: #1e293b;
}

/* line 336, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__count {
  font-size: 1.1rem;
  font-weight: 500;
  color: #64748b;
  background: #f8fafc;
  border-radius: 10px;
  padding: 1px 8px;
}

/* line 346, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-clock {
  margin-left: auto;
  font-size: 1.25rem;
  color: #64748b;
}

/* line 351, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-clock span {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: #334155;
}

/* line 358, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-size: 1.2rem;
}

/* line 366, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-chips__label {
  color: #64748b;
}

/* line 371, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-chip {
  background: #e1f5ee;
  color: #0f6e56;
  border-radius: 12px;
  padding: 2px 10px;
  font-size: 1.15rem;
}

/* line 379, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-feed {
  display: flex;
  flex-direction: column;
}

/* line 384, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-feed__row {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid #e2e8f0;
}

/* line 392, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-feed__row:last-child {
  border-bottom: none;
}

/* line 397, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-feed__time {
  font-size: 1.4rem;
  font-weight: 600;
  color: #1e293b;
  font-variant-numeric: tabular-nums;
}

/* line 404, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-feed__date {
  font-size: 1.1rem;
  font-weight: 500;
  color: #64748b;
  margin-right: 4px;
}

/* line 411, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-feed__tasks {
  font-size: 1.3rem;
  color: #475569;
}

/* line 416, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-feed__dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 5px;
  vertical-align: middle;
}

/* line 425, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-feed__count {
  font-size: 1.15rem;
  color: #a32d2d;
  background: #fcebeb;
  padding: 2px 8px;
  border-radius: 6px;
  white-space: nowrap;
}

/* line 435, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-filter {
  margin-left: auto;
  width: 240px;
  height: 34px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  padding: 0 12px;
  font-size: 1.3rem;
}

/* line 445, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-table-wrap {
  overflow-x: auto;
}

/* line 450, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-table code {
  font-size: 1.2rem;
}

/* line 455, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-cat {
  display: inline-block;
  font-size: 1.15rem;
  padding: 2px 10px;
  border-radius: 12px;
  color: var(--cat-color);
  border: 1px solid var(--cat-color);
  background: transparent;
}

/* line 465, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-sched-label {
  display: block;
  font-weight: 500;
  color: #334155;
}

/* line 471, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-sched-cron {
  display: block;
  font-size: 1.1rem;
  color: #94a3b8;
}

/* line 478, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-empty {
  text-align: center;
  padding: 60px 20px;
  color: #64748b;
}

/* line 483, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-empty i {
  font-size: 4rem;
  color: #cbd5e1;
}

/* line 488, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-empty p {
  margin-top: 10px;
  font-size: 1.4rem;
}

/* line 493, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-empty__hint {
  font-size: 1.2rem !important;
  color: #94a3b8;
}

/* line 497, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-empty__hint code {
  background: #eef2f7;
  padding: 1px 6px;
  border-radius: 4px;
}

/* line 506, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-invalid li {
  font-size: 1.25rem;
  color: #92400e;
  padding: 3px 0;
}

/* line 514, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metric--clickable {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  border: 1px solid #e2e8f0;
  transition: border-color 0.12s, background 0.12s;
}

/* line 523, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metric--clickable:hover {
  border-color: #f3b0b0;
}

/* line 527, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-metric--clickable.is-active {
  background: #fcebeb;
  border-color: #e24b4a;
}

/* line 534, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-facets {
  position: sticky;
  top: 60px;
  z-index: 4;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 10px 12px;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

/* line 549, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-facets__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}

/* line 556, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-facets__label {
  font-size: 1.15rem;
  color: #94a3b8;
  margin-right: 2px;
}

/* line 562, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-facets__spacer {
  flex: 1;
}

/* line 566, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-fchip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 1.2rem;
  padding: 4px 11px;
  border-radius: 14px;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #64748b;
  cursor: pointer;
  transition: all 0.12s;
}

/* line 579, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-fchip:hover {
  background: #f8fafc;
}

/* line 583, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-fchip.is-active {
  background: #e6f1fb;
  color: #0c447c;
  border-color: #378add;
}

/* line 589, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-fchip--danger.is-active {
  background: #fcebeb;
  color: #a32d2d;
  border-color: #f3b0b0;
}

/* line 596, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-fchip__dot {
  width: 9px;
  height: 9px;
  border-radius: 3px;
}

/* line 602, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-ffilter {
  height: 30px;
  width: 200px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  padding: 0 10px;
  font-size: 1.25rem;
}

/* line 611, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-fcount {
  font-size: 1.2rem;
  color: #64748b;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* line 618, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-fclear {
  font-size: 1.2rem;
  color: #64748b;
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: underline;
}

/* line 626, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-fclear:hover {
  color: #1e293b;
}

/* line 632, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 4px;
}

/* line 638, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix .is-hidden[data-col] {
  display: none;
}

/* line 643, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix__corner {
  text-align: left;
  font-size: 1.1rem;
  color: #94a3b8;
  font-weight: 400;
  width: 124px;
}

/* line 651, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix__colhead {
  text-align: center;
  font-size: 1.25rem;
  font-weight: 600;
  color: #1e293b;
  padding-bottom: 2px;
}

/* line 659, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix__rowhead {
  text-align: left;
  font-size: 1.2rem;
  font-weight: 400;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 8px;
  width: 124px;
}

/* line 671, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix__cell {
  height: 34px;
  text-align: center;
  vertical-align: middle;
  background: #f8fafc;
  border-radius: 6px;
}

/* line 678, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix__cell.is-empty {
  background: transparent;
}

/* line 683, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-mcell {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 1.3rem;
  font-variant-numeric: tabular-nums;
  color: #1e293b;
}

/* line 691, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-mcell + .admin-recurring-schedules .ars-mcell {
  margin-left: 6px;
}

/* line 695, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-mcell.is-collision {
  color: #e24b4a;
  font-weight: 500;
}

/* line 701, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-mcell__hint {
  font-size: 1.1rem;
  color: #64748b;
}

/* line 706, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix__dash {
  color: #cbd5e1;
  font-size: 1.4rem;
}

/* line 712, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-matrix.is-collisions-only .ars-mcell:not(.is-collision),
.admin-recurring-schedules .ars-matrix.is-collisions-only .ars-matrix__dash {
  opacity: 0.2;
}

/* line 719, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-nonexport {
  margin-top: 14px;
  border-top: 1px dashed #e2e8f0;
  padding-top: 12px;
}

/* line 724, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-nonexport__title {
  display: block;
  font-size: 1.25rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 8px;
}

/* line 732, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-nonexport__group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}

/* line 740, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-nonexport__cat {
  font-size: 1.2rem;
  color: #64748b;
  margin-right: 4px;
}

/* line 746, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-nonexport__job {
  font-size: 1.15rem;
  background: #f8fafc;
  color: #475569;
  border-radius: 10px;
  padding: 2px 9px;
}

/* line 756, app/assets/stylesheets/admin_recurring_task_schedules.scss */
.admin-recurring-schedules .ars-tl__now {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #e24b4a;
  opacity: 0.7;
  z-index: 2;
  pointer-events: none;
}
/* line 20, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 8px 40px;
}

/* line 26, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-lead {
  font-size: 1.4rem;
  line-height: 1.9;
  color: #64748b;
  margin: 0 0 24px;
}

/* line 32, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-lead a {
  color: #174b7d;
  font-weight: 600;
}

/* line 39, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-panel {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  margin-bottom: 20px;
  overflow: hidden;
}

/* line 47, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-panel__head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 24px;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
}

/* line 56, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-panel__title {
  font-size: 1.7rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}

/* line 63, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-count {
  font-size: 1.2rem;
  font-weight: 600;
  color: #174b7d;
  background: #e8eff7;
  border-radius: 999px;
  padding: 3px 12px;
}

/* line 72, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-panel__body {
  padding: 24px;
}

/* line 77, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-notice {
  font-size: 1.35rem;
  line-height: 1.8;
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 20px;
}

/* line 84, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-notice--warn {
  background: #fffbf2;
  border: 1px solid #f0c36d;
  color: #7a5b12;
}

/* line 90, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-notice--info {
  background: #f0f6fc;
  border: 1px solid #bcd8f0;
  color: #1c4f7c;
}

/* line 98, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table--scopes + .edr-notice {
  margin-top: 24px;
  margin-bottom: 0;
}

/* line 104, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-add {
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid #e2e8f0;
}

/* line 110, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-add__label {
  display: block;
  font-size: 1.4rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 10px;
}

/* line 118, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-add__row {
  display: flex;
  gap: 10px;
  align-items: stretch;
  flex-wrap: wrap;
}

/* line 125, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-input {
  flex: 1 1 260px;
  min-width: 0;
  font-size: 1.5rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: #1e293b;
  padding: 10px 14px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  transition: border-color 0.15s, box-shadow 0.15s;
}

/* line 137, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-input::placeholder {
  color: #a3adbb;
}

/* line 141, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-input:focus {
  outline: none;
  border-color: #174b7d;
  box-shadow: 0 0 0 3px rgba(23, 75, 125, 0.15);
}

/* line 148, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-add__help {
  font-size: 1.25rem;
  line-height: 1.8;
  color: #64748b;
  margin: 10px 0 0;
}

/* line 156, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1;
  padding: 12px 22px;
  border-radius: 8px;
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}

/* line 170, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-btn--primary {
  background: #174b7d;
  color: #fff;
}

/* line 174, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-btn--primary:hover {
  background: #12395f;
}

/* line 180, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-btn--quiet-danger {
  background: #fff;
  color: #64748b;
  border-color: #cbd5e1;
}

/* line 185, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-btn--quiet-danger:hover {
  background: #fdf2f2;
  color: #e24b4a;
  border-color: #e24b4a;
}

/* line 192, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-btn--sm {
  font-size: 1.25rem;
  padding: 7px 14px;
}

/* line 199, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.4rem;
}

/* line 204, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table th,
.admin-email-domain-restrictions-page .edr-table td {
  text-align: left;
  padding: 14px 12px;
  vertical-align: middle;
}

/* line 211, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table th {
  font-size: 1.2rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #64748b;
  border-bottom: 1px solid #e2e8f0;
  padding-bottom: 10px;
}

/* line 220, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table td {
  border-bottom: 1px solid #f1f5f9;
  color: #334155;
}

/* line 225, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table tbody tr:last-child td {
  border-bottom: none;
}

/* line 229, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table tbody tr:hover td {
  background: #fafbfc;
}

/* line 233, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table th:first-child,
.admin-email-domain-restrictions-page .edr-table td:first-child {
  padding-left: 0;
}

/* line 238, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table th:last-child,
.admin-email-domain-restrictions-page .edr-table td:last-child {
  padding-right: 0;
  text-align: right;
}

/* line 247, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table--scopes td {
  vertical-align: top;
  padding-top: 18px;
  padding-bottom: 18px;
}

/* line 254, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-scope__label {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 6px;
}

/* line 261, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-scope__desc {
  font-size: 1.25rem;
  line-height: 1.8;
  color: #64748b;
  margin: 0;
  max-width: 46em;
}

/* line 269, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-state {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 1.4rem;
  font-weight: 700;
  color: #1e293b;
  white-space: nowrap;
}

/* line 279, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: none;
  background: #94a3b8;
}

/* line 286, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.is-on .admin-email-domain-restrictions-page .edr-dot {
  background: #157f4a;
  box-shadow: 0 0 0 4px rgba(21, 127, 74, 0.15);
}

/* line 293, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-badge {
  display: inline-block;
  font-size: 1.1rem;
  font-weight: 600;
  color: #64748b;
  background: #eef2f7;
  border-radius: 999px;
  padding: 2px 10px;
  margin-top: 6px;
}

/* line 304, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-meta {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #64748b;
  white-space: nowrap;
}

/* line 313, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-domain {
  display: inline-block;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 1.4rem;
  font-weight: 600;
  color: #1e293b;
  background: #eef2f7;
  border-radius: 6px;
  padding: 4px 10px;
}

/* line 324, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-empty {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #64748b;
  text-align: center;
  padding: 28px 12px;
  background: #f8fafc;
  border-radius: 8px;
  margin: 0;
}

/* line 335, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-nodata {
  color: #a3adbb;
}

/* line 340, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-table form {
  display: inline;
  margin: 0;
}

/* line 346, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-notes {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* line 351, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-notes li {
  position: relative;
  font-size: 1.35rem;
  line-height: 1.9;
  color: #334155;
  padding-left: 18px;
  margin-bottom: 10px;
}

/* line 359, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-notes li:last-child {
  margin-bottom: 0;
}

/* line 363, app/assets/stylesheets/admin_email_domain_restrictions.scss */
.admin-email-domain-restrictions-page .edr-notes li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #cbd5e1;
}

@media screen and (max-width: 834px) {
  /* line 377, app/assets/stylesheets/admin_email_domain_restrictions.scss */
  .admin-email-domain-restrictions-page .edr-panel__head,
.admin-email-domain-restrictions-page .edr-panel__body {
    padding-left: 16px;
    padding-right: 16px;
  }
  /* line 385, app/assets/stylesheets/admin_email_domain_restrictions.scss */
  .admin-email-domain-restrictions-page .edr-table:not(.edr-table--scopes) th:nth-child(2),
.admin-email-domain-restrictions-page .edr-table:not(.edr-table--scopes) td:nth-child(2),
.admin-email-domain-restrictions-page .edr-table:not(.edr-table--scopes) th:nth-child(3),
.admin-email-domain-restrictions-page .edr-table:not(.edr-table--scopes) td:nth-child(3) {
    display: none;
  }
  /* line 395, app/assets/stylesheets/admin_email_domain_restrictions.scss */
  .admin-email-domain-restrictions-page .edr-table--scopes th:nth-child(3),
.admin-email-domain-restrictions-page .edr-table--scopes td:nth-child(3) {
    display: none;
  }
}
/* Product Management Styles */

/* Tab buttons */
.product-management-tab-btn {
  width: 100px;
}

/* Action buttons */
.product-management-action-btn-csv {
  width: 200px;
}

.product-management-action-btn-add {
  width: 140px;
}

/* Detail button */
.product-management-detail-btn {
  width: 80px;
}

/* Filter section (display state: 全て / 公開 / 非公開) */
.product-management-filter-group {
  margin-left: 2rem;
  margin-top: 0;
}

.product-management-filter-options {
  padding: 0;
  gap: 12px;
  background: transparent;
  flex-grow: 0;
}

.product-management-radio-option {
  width: auto;
  min-width: auto;
}

.product-management-radio-link {
  text-decoration: none;
  color: inherit;
  display: flex;
  align-items: center;
  gap: 4px;
}

.product-management-radio-input {
  pointer-events: none;
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: 0;
}

.product-management-radio-label {
  margin: 0;
  cursor: pointer;
  pointer-events: none;
  font-size: 14px;
  white-space: nowrap;
}

/* Table row height */
.product-management-table.ecc-table th,
.product-management-table.ecc-table td {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  line-height: 1.4;
}

.product-management-table.ecc-table th {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

/* ==========================================================================
   カチノテ診断ページ
   ========================================================================== */

/* --- カスタムプロパティ・ページ全体 --- */
.kachinote-page {
    --navy: #002B62;
    --bg-light: #F4F7F9;
    --white: #FFFFFF;
    --red: #E63946;
    --yellow: #FFD60A;
    --green: #70E000;
    --text-dark: #333333;
    --border-light: #E0E6ED;
    --shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    --line-height: 1.6;

    font-family: 'Noto Sans JP', sans-serif;
    background-color: var(--bg-light);
    color: var(--text-dark);
    margin: 0;
    padding: 20px 40px;
    display: flex;
    justify-content: center;
}

/* --- ラッパー・ヘッダー --- */
.kachinote-page .wrapper {
    display: block;
    width: 100%;
    max-width: 1400px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    overflow: hidden;
    padding-bottom: 40px;
}

.kachinote-page header {
    text-align: center;
    padding: 30px 20px;
}

.kachinote-page .header-line {
    height: 12px;
    background-color: var(--navy);
}

.kachinote-page .main-title {
    font-size: 36px;
    font-weight: 900;
    color: var(--navy);
    margin: 15px 0;
    letter-spacing: 0.1em;
}

.kachinote-page .summary-box {
    margin: 20px 0;
}

.kachinote-page .summary-label {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 5px;
    color: var(--navy);
}

.kachinote-page .total-amount {
    font-size: 42px;
    font-weight: 900;
    color: var(--red);
    margin: 0;
}

/* --- カードグリッド --- */
.kachinote-page .content-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 0 30px;
}

@media (min-width: 850px) {
    .kachinote-page .content-list {
        grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
        gap: 25px;
    }
}

/* --- カード --- */
.kachinote-page .card {
    border: 1px solid var(--border-light);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.06);
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
}

.kachinote-page .card-header {
    background-color: var(--navy);
    color: var(--white);
    padding: 12px 15px;
    text-align: center;
    font-weight: 700;
    font-size: 18px;
}

.kachinote-page .card-loss-section {
    padding: 15px;
    border-bottom: 1px solid var(--border-light);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.kachinote-page .loss-tag {
    font-size: 13px;
    color: var(--red);
    border: 1.5px solid var(--red);
    padding: 4px 8px;
    font-weight: 900;
}

.kachinote-page .loss-value {
    font-size: 32px;
    font-weight: 900;
    margin: 0;
}

.kachinote-page .card-lower-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.kachinote-page .info-box {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.kachinote-page .info-box-cause { border-bottom: 1px dashed var(--border-light); }
.kachinote-page .info-box-action { background-color: #FAFBFC; }

.kachinote-page .pill {
    display: inline-block;
    padding: 6px 25px;
    border-radius: 20px;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 15px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.kachinote-page .pill-yellow { background-color: var(--yellow); }
.kachinote-page .pill-green { background-color: var(--green); color: var(--white); }

/* --- テキスト折りたたみ（もっと見る） --- */
.kachinote-page .description-container {
    width: 100%;
    position: relative;
}

.kachinote-page .toggle-check { display: none; }

.kachinote-page .description {
    font-size: 14px;
    line-height: var(--line-height);
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    max-height: calc(14px * var(--line-height) * 2);
    overflow: hidden;
    position: relative;
    transition: max-height 0.3s ease;
}

.kachinote-page .description::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1.2em;
    background: linear-gradient(transparent, #ffffff 90%);
    pointer-events: none;
    transition: opacity 0.3s;
}

.kachinote-page .info-box-action .description::after {
    background: linear-gradient(transparent, #FAFBFC 90%);
}

.kachinote-page .more-btn {
    display: block;
    margin-top: 8px;
    color: var(--navy);
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    text-align: right;
    text-decoration: underline;
}

.kachinote-page .more-btn::before { content: "もっと見る ▼"; }

/* --- 折りたたみ解除状態 --- */
.kachinote-page .description.no-clamp {
    -webkit-line-clamp: initial;
    max-height: none;
    overflow: visible;
}

.kachinote-page .description.no-clamp::after {
    display: none;
}

/* --- チェックボックス連動の展開アニメーション --- */
.kachinote-page .toggle-check:checked + .description {
    -webkit-line-clamp: initial;
    max-height: 1000px;
}

.kachinote-page .toggle-check:checked + .description::after {
    opacity: 0;
}

.kachinote-page .toggle-check:checked ~ .more-btn::before {
    content: "閉じる ▲";
}
/* ==========================================================================
   ブランドスコアページ
   ========================================================================== */

/* --- カスタムプロパティ・ページ全体 --- */
.brandscore-page {
  --navy-dark: #0f172a;
  --latest-blue: #2563eb;
  --mid-lime: #10b981;
  --old-gray: #94a3b8;
  --bg-body: #f8fafc;
  --card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --text-main: #1e293b;
  --bg-identity: #e0f2fe;

  margin: 0;
  padding: 20px 30px;
  background-color: var(--bg-body);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--text-main);
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* --- ヘッダー --- */
.brandscore-page .page-header {
  width: 100%;
  max-width: 1360px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 25px;
  padding-bottom: 10px;
}

.brandscore-page .title-area {
  display: flex;
  align-items: baseline;
}

.brandscore-page .main-title {
  font-size: 64px;
  font-weight: 900;
  color: var(--navy-dark);
  margin: 0;
  line-height: 1;
  letter-spacing: -0.05em;
}

.brandscore-page .sub-title {
  font-size: 28px;
  font-weight: bold;
  color: var(--navy-dark);
  margin-left: 15px;
}

.brandscore-page .brandscore-pdf-link {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 6px;
  background: var(--latest-blue);
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

/* --- ダッシュボードコンテナ --- */
.brandscore-page .dashboard-container {
  width: 100%;
  max-width: 1360px;
}

.brandscore-page .glass-card {
  background: #fff;
  border-radius: 20px;
  box-shadow: var(--card-shadow);
  padding: 40px 60px;
  margin-bottom: 30px;
}

.brandscore-page .content-layout {
  display: flex;
  justify-content: center;
  gap: 100px;
  align-items: center;
}

.brandscore-page .left-panel {
  width: 380px;
  text-align: center;
}

.brandscore-page .date-badge {
  background: var(--navy-dark);
  color: #fff;
  padding: 6px 45px;
  border-radius: 4px;
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 25px;
  display: inline-block;
}

/* --- SVGゲージ（メイン・サブ） --- */
.brandscore-page .gauge-value,
.brandscore-page .sub-gauge-value {
  fill: none;
  stroke-linecap: round;
  transition: stroke-dashoffset 1.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.brandscore-page .gauge-wrapper {
  position: relative;
  width: 300px;
  height: 260px;
  margin: 0 auto;
}

.brandscore-page .svg-gauge {
  transform: rotate(135deg);
}

.brandscore-page .score-center {
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}

.brandscore-page .score-number {
  font-size: 82px;
  font-weight: 900;
  color: var(--navy-dark);
  line-height: 1;
}

.brandscore-page .linear-progress-main {
  width: 180px;
  height: 10px;
  background: #f1f5f9;
  border-radius: 5px;
  margin: 15px auto;
  overflow: hidden;
  border: 1px solid #cbd5e1;
}

.brandscore-page .linear-fill-main {
  height: 100%;
  background: var(--latest-blue);
  transition: width 1.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.brandscore-page .sub-gauges {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  padding: 0 10px;
}

.brandscore-page .sub-item {
  position: relative;
  width: 140px;
  text-align: center;
}

.brandscore-page .sub-label-mini {
  background: #2d3e50;
  color: white;
  font-size: 11px;
  padding: 2px 12px;
  border-radius: 2px;
  position: absolute;
  top: 15px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
}

.brandscore-page .sub-score-val {
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 800;
  font-size: 22px;
  color: var(--navy-dark);
}

/* --- レーダーチャート --- */
.brandscore-page .radar-panel {
  flex: 0 1 450px;
  height: 400px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.brandscore-page .radar-label {
  position: absolute;
  font-size: 13px;
  font-weight: bold;
  color: #64748b;
  text-align: center;
  line-height: 1.1;
  white-space: nowrap;
  z-index: 10;
}

.brandscore-page .val-current {
  color: var(--latest-blue);
  font-size: 14px;
  font-weight: 800;
  display: block;
  margin-top: 1px;
}

.brandscore-page .label-top {
  top: 10px;
}

.brandscore-page .label-right-top {
  top: 120px;
  right: 20px;
}

.brandscore-page .label-left-top {
  top: 120px;
  left: 15px;
}

.brandscore-page .label-right-bottom {
  bottom: 40px;
  right: 70px;
}

.brandscore-page .label-left-bottom {
  bottom: 40px;
  left: 70px;
}

.brandscore-page .legend {
  position: absolute;
  bottom: -30px;
  right: 0;
  display: flex;
  gap: 15px;
  background: #f8fafc;
  padding: 5px 12px;
  border-radius: 20px;
  border: 1px solid #eee;
}

.brandscore-page .legend-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: bold;
}

.brandscore-page .l-dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.brandscore-page .radar-path {
  fill: none;
  transition: d 1.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.brandscore-page .radar-fill {
  transition: d 1.5s cubic-bezier(0.4, 0, 0.2, 1);
  mix-blend-mode: multiply;
}

/* --- 詳細レポートセクション --- */
.brandscore-page .detail-report-section {
  background: #fff;
  border-radius: 24px;
  box-shadow: var(--card-shadow);
  padding: 40px;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #e2e8f0;
  margin-top: 10px;
}

.brandscore-page .identity-report-box {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  background: var(--bg-identity);
  padding: 30px;
  border-radius: 16px;
  margin-bottom: 24px;
}

.brandscore-page .report-box-main {
  display: flex;
  align-items: center;
}

.brandscore-page .meaning-report-box {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  background: var(--bg-identity);
  padding: 30px;
  border-radius: 16px;
  margin-bottom: 24px;
}

.brandscore-page .response-report-box {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  background: var(--bg-identity);
  padding: 30px;
  border-radius: 16px;
  margin-bottom: 24px;
}

.brandscore-page .resonance-report-box {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  background: var(--bg-identity);
  padding: 30px;
  border-radius: 16px;
  margin-bottom: 24px;
}

.brandscore-page .health-report-box {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  background: var(--bg-identity);
  padding: 30px;
  border-radius: 16px;
  margin-bottom: 24px;
}

.brandscore-page .pillar-metrics-grid {
  margin-bottom: 40px;
}

.brandscore-page .id-badge-wrap {
  background: var(--navy-dark);
  color: #fff;
  padding: 15px;
  border-radius: 12px;
  font-size: 14px;
  text-align: center;
  min-width: 100px;
  line-height: 1.4;
  font-weight: bold;
}

.brandscore-page .id-score-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 0.85;
  margin: 0 35px;
}

.brandscore-page .id-score-num {
  font-size: 64px;
  font-weight: 800;
  color: var(--navy-dark);
}

.brandscore-page .id-score-unit {
  font-size: 32px;
  font-weight: 800;
  color: var(--navy-dark);
  margin-top: 5px;
}

.brandscore-page .id-v-line {
  width: 2px;
  height: 80px;
  background: var(--latest-blue);
  opacity: 0.3;
}

.brandscore-page .id-desc {
  font-size: 17px;
  line-height: 1.8;
  color: var(--text-main);
  flex: 1;
  padding-left: 35px;
  font-weight: 500;
}

/* --- 詳細カードグリッド --- */
.brandscore-page .detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
}

.brandscore-page .detail-card {
  background: var(--bg-body);
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  transition: all 0.2s ease;
}

.brandscore-page .detail-card:hover {
  transform: translateY(-3px);
  border-color: var(--latest-blue);
  background: #fff;
}

.brandscore-page .card-head {
  background: #e0f2fe;
  padding: 14px;
  font-size: 14px;
  font-weight: bold;
  color: var(--navy-dark);
  text-align: center;
  border-bottom: 1px solid #e2e8f0;
  border-radius: 12px 12px 0 0;
}

.brandscore-page .card-body {
  padding: 25px;
  align-items: flex-start;
  flex: 1;
}

.brandscore-page .card-score-zone {
  width: 100%;
  text-align: center;
  border-bottom: 1px solid #f1f5f9;
  padding-bottom: 15px;
  margin-bottom: 15px;
}

.brandscore-page .big-num {
  font-size: 44px;
  font-weight: 800;
  margin: 0;
  color: #444;
}

.brandscore-page .sub-num {
  font-size: 17px;
  color: #94a3b8;
  margin: 5px 0;
  font-weight: 600;
}

.brandscore-page .mini-progress {
  width: 130px;
  height: 12px;
  background: #f1f5f9;
  border-radius: 6px;
  margin: 15px auto 0;
  overflow: hidden;
}

.brandscore-page .mini-fill {
  height: 100%;
  background: var(--mid-lime);
  border-radius: 6px;
  transition: width 1s ease-out;
}

/* --- カード情報エリア --- */
.brandscore-page .card-info-zone {
  flex: 1;
  width: 100%;
}

.brandscore-page .analysis-zone {
  padding-top: 20px;
  margin-top: 24px;
}

.brandscore-page .analysis-zone .info-text:last-child {
  margin-bottom: 0;
}

.brandscore-page .info-title {
  font-size: 15px;
  font-weight: 800;
  color: var(--latest-blue);
  margin-bottom: 8px;
}

.brandscore-page .info-text {
  font-size: 15px;
  color: #333;
  line-height: 1.6;
  margin-bottom: 18px;
  font-weight: 500;
}

.brandscore-page .info-list {
  margin: 0;
  padding-left: 20px;
  font-size: 15px;
  color: #333;
  font-weight: 500;
}

.brandscore-page .info-list li {
  margin-bottom: 6px;
}

/* --- レポート履歴・お知らせ設定画面 --- */
.brandscore-box {
  border: 1px solid #e3e8ee;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
}

.brandscore-history {
  max-width: 1100px;
  margin: 0 auto;
}

.brandscore-history__note {
  max-width: 1100px;
  margin: 0 auto 12px;
  font-size: 12px;
  color: #6b7280;
}

.brandscore-history__table-wrap {
  overflow-x: auto;
}

.brandscore-history__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  table-layout: fixed;
}

.brandscore-history__table th {
  background: #1a4d8f;
  color: #fff;
  font-weight: 700;
  text-align: left;
  padding: 11px 15px;
}

.brandscore-history__table td {
  padding: 12px 15px;
  border-bottom: 1px solid #e3e8ee;
  color: #1f2937;
  vertical-align: middle;
  white-space: nowrap;
}

.brandscore-history__table tr:last-child td {
  border-bottom: 0;
}

.brandscore-history__col-period { width: 170px; }
.brandscore-history__col-pdf { width: 130px; }

.brandscore-history__btn {
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 700;
  border-radius: 5px;
  cursor: pointer;
  border: 1px solid #1a4d8f;
  background: #1a4d8f;
  color: #fff;
  text-decoration: none;
}

.brandscore-history__btn:hover {
  background: #16406f;
  border-color: #16406f;
}

.brandscore-history__empty {
  text-align: center;
  color: #6b7280;
  padding: 24px 15px !important;
}

/* --- お知らせ設定（配信設定カード） --- */
.brandscore-mail-setting {
  --bms-primary: #0052cc;
  --bms-primary-dark: #003da6;
  --bms-line: #e0e6ed;
  --bms-line-strong: #cdd7e3;
  --bms-text: #1f2937;
  --bms-text-sub: #6b7280;
  --bms-head-bg: #f9fafb;
  --bms-success: #22a76d;
  --bms-disabled: #d1d5db;

  max-width: 1100px;
  margin: 0 auto;
  color: var(--bms-text);
  font-size: 13px;
  line-height: 1.6;
}

.brandscore-mail-setting__card {
  background: #fff;
  border: 1px solid var(--bms-line);
  border-radius: 6px;
}

.brandscore-mail-setting__card-header {
  padding: 12px 16px;
  border-bottom: 1px solid var(--bms-line);
  font-weight: 600;
  font-size: 13px;
  background: var(--bms-head-bg);
  border-radius: 6px 6px 0 0;
}

.brandscore-mail-setting__card-body {
  padding: 16px;
}

.brandscore-mail-setting__small {
  font-size: 11px;
  color: var(--bms-text-sub);
}

.brandscore-mail-setting__field {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.brandscore-mail-setting__field label {
  min-width: 140px;
  font-size: 12px;
  color: var(--bms-text-sub);
  font-weight: 600;
}

.brandscore-mail-setting__field input[type="text"] {
  width: 360px;
  border: 1px solid var(--bms-line-strong);
  border-radius: 4px;
  padding: 7px 10px;
  font-size: 12px;
  height: 32px;
  background: #fff;
  color: var(--bms-text);
}

.brandscore-mail-setting__field input[type="text"]:focus {
  outline: none;
  border-color: var(--bms-primary);
  box-shadow: 0 0 0 2px #e8f4ff;
}

.brandscore-mail-setting__switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  user-select: none;
  color: var(--bms-text-sub);
  font-weight: 700;
  min-width: 0 !important;
}

.brandscore-mail-setting__switch input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.brandscore-mail-setting__switch-track {
  width: 40px;
  height: 20px;
  border-radius: 10px;
  background: var(--bms-disabled);
  position: relative;
  transition: 0.2s;
}

.brandscore-mail-setting__switch-track::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  transition: 0.2s;
}

.brandscore-mail-setting__switch input:checked ~ .brandscore-mail-setting__switch-track {
  background: var(--bms-success);
}

.brandscore-mail-setting__switch input:checked ~ .brandscore-mail-setting__switch-track::after {
  left: 22px;
}

.brandscore-mail-setting__switch input:focus-visible ~ .brandscore-mail-setting__switch-track {
  outline: 2px solid var(--bms-primary);
  outline-offset: 2px;
}

.brandscore-mail-setting__btn-row {
  display: flex;
  gap: 8px;
  margin-top: 16px;
  align-items: center;
}

.brandscore-mail-setting__btn {
  border: 1px solid var(--bms-primary);
  background: var(--bms-primary);
  color: #fff;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.15s;
}

.brandscore-mail-setting__btn:hover {
  background: var(--bms-primary-dark);
}

.brandscore-mail-setting__note {
  background: #fff8e1;
  border: 1px solid #ffe0b2;
  border-radius: 4px;
  padding: 10px 12px;
  font-size: 11px;
  color: #856404;
  margin-top: 12px;
}
/* ==========================================================================
   目標値設定（西武ライオンズ様向けダッシュボードカスタム）
   モック mock_seibu_admin_10_11.html の SCREEN 2 を移植。
   すべて .seibulions-kpi-target-page 配下にスコープする。
   ========================================================================== */

.seibulions-kpi-target-page {
  --slk-primary: #0052CC;
  --slk-primary-dark: #003DA6;
  --slk-panel: #FFFFFF;
  --slk-line: #E0E6ED;
  --slk-line-strong: #CDD7E3;
  --slk-text: #1F2937;
  --slk-text-sub: #6B7280;
  --slk-head-bg: #F9FAFB;
  --slk-accent: #1F8D8D;

  color: var(--slk-text);
  font-size: 13px;
  line-height: 1.6;
}

.seibulions-kpi-target-page h1 {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 20px;
}

.seibulions-kpi-target-page .slk-card {
  background: var(--slk-panel);
  border: 1px solid var(--slk-line);
  border-radius: 6px;
  margin-bottom: 16px;
}

.seibulions-kpi-target-page .slk-card-hd {
  padding: 12px 16px;
  border-bottom: 1px solid var(--slk-line);
  font-weight: 600;
  font-size: 13px;
  background: var(--slk-head-bg);
  border-radius: 6px 6px 0 0;
}

.seibulions-kpi-target-page .slk-card-bd { padding: 16px; }

.seibulions-kpi-target-page .slk-btn {
  border: 1px solid var(--slk-line-strong);
  background: #fff;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12.5px;
  cursor: pointer;
  color: var(--slk-text);
  font-weight: 600;
  transition: .15s;
}
.seibulions-kpi-target-page .slk-btn:hover { background: var(--slk-head-bg); }
.seibulions-kpi-target-page .slk-btn.primary { background: var(--slk-primary); border-color: var(--slk-primary); color: #fff; }
.seibulions-kpi-target-page .slk-btn.primary:hover { background: var(--slk-primary-dark); }

.seibulions-kpi-target-page .slk-btn-row { display: flex; gap: 8px; margin-top: 16px; align-items: center; }

.seibulions-kpi-target-page input[type=number],
.seibulions-kpi-target-page select {
  border: 1px solid var(--slk-line-strong);
  border-radius: 4px;
  padding: 7px 10px;
  font-size: 12px;
  background: #fff;
  color: var(--slk-text);
  height: 32px;
}
.seibulions-kpi-target-page input:focus,
.seibulions-kpi-target-page select:focus {
  outline: none;
  border-color: var(--slk-primary);
  box-shadow: 0 0 0 2px #E8F4FF;
}
.seibulions-kpi-target-page label { font-size: 12px; color: var(--slk-text-sub); font-weight: 600; }
.seibulions-kpi-target-page .slk-small { font-size: 11px; color: var(--slk-text-sub); }
.seibulions-kpi-target-page .slk-field { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.seibulions-kpi-target-page .slk-field label { width: 90px; }

.seibulions-kpi-target-page .slk-tbl-scroll {
  max-height: 500px;
  overflow: auto;
  border: 1px solid var(--slk-line);
  border-radius: 4px;
}

/* 属性グループを横並び、コードを縦に並べた一覧テーブル */
.seibulions-kpi-target-page .slk-tgt-table { border-collapse: collapse; width: 100%; font-size: 11px; table-layout: fixed; }
.seibulions-kpi-target-page .slk-tgt-table thead tr.grp-row th {
  background: var(--slk-accent);
  color: #fff;
  text-align: center;
  padding: 8px 4px;
  font-size: 12px;
  border: 1px solid rgba(255, 255, 255, .2);
  position: sticky;
  top: 0;
  z-index: 3;
  height: 34px;
  box-sizing: border-box;
}
.seibulions-kpi-target-page .slk-tgt-table thead tr.sub-row th {
  background: var(--slk-head-bg);
  color: var(--slk-text);
  text-align: center;
  padding: 6px 4px;
  font-size: 10.5px;
  border: 1px solid var(--slk-line);
  white-space: nowrap;
  position: sticky;
  top: 34px;
  z-index: 2;
  height: 30px;
  box-sizing: border-box;
}
.seibulions-kpi-target-page .slk-tgt-table tbody td {
  border: 1px solid var(--slk-line);
  padding: 4px 6px;
  text-align: center;
  background: #fff;
}
.seibulions-kpi-target-page .slk-tgt-table tbody td.name-cell { text-align: left; }
.seibulions-kpi-target-page .slk-tgt-table tbody td.grp-gap { border-left: 3px solid var(--slk-line-strong); }
.seibulions-kpi-target-page .slk-tgt-table tbody tr:nth-child(even) td { background: #FAFBFC; }
.seibulions-kpi-target-page .slk-tgt-table input[type=number] {
  width: 100%;
  min-width: 70px;
  height: 26px;
  font-size: 11px;
  padding: 2px 6px;
  text-align: right;
}

/* 確認モーダル */
.seibulions-kpi-target-page .slk-modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, .45);
  z-index: 1050;
  align-items: center;
  justify-content: center;
}
.seibulions-kpi-target-page .slk-modal {
  background: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 420px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .25);
  overflow: hidden;
}
.seibulions-kpi-target-page .slk-modal-hd {
  padding: 14px 20px;
  font-weight: 700;
  font-size: 15px;
  border-bottom: 1px solid var(--slk-line);
  background: var(--slk-head-bg);
}
.seibulions-kpi-target-page .slk-modal-bd { padding: 20px; }
.seibulions-kpi-target-page .slk-modal-bd p { margin: 0 0 8px; }
.seibulions-kpi-target-page .slk-modal-ft {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 20px;
  border-top: 1px solid var(--slk-line);
}
/* ==========================================================================
   試合日・EC係数カレンダー（西武ライオンズ様向けダッシュボードカスタム）
   モック mock_seibu_admin_10_5_1.html の SCREEN 3 を移植。
   すべて .game-ec-calendar-page 配下にスコープする。
   ========================================================================== */

.game-ec-calendar-page {
  --gec-primary: #0052CC;
  --gec-primary-dark: #003DA6;
  --gec-panel: #FFFFFF;
  --gec-line: #E0E6ED;
  --gec-line-strong: #CDD7E3;
  --gec-text: #1F2937;
  --gec-text-sub: #6B7280;
  --gec-head-bg: #F9FAFB;
  --gec-accent: #1F8D8D;
  --gec-success: #22A76D;
  --gec-disabled: #D1D5DB;

  color: var(--gec-text);
  font-size: 13px;
  line-height: 1.6;
}

.game-ec-calendar-page h1 {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 20px;
}

.game-ec-calendar-page .gec-card {
  background: var(--gec-panel);
  border: 1px solid var(--gec-line);
  border-radius: 6px;
  margin-bottom: 16px;
}

.game-ec-calendar-page .gec-card-hd {
  padding: 12px 16px;
  border-bottom: 1px solid var(--gec-line);
  font-weight: 600;
  font-size: 13px;
  background: var(--gec-head-bg);
  border-radius: 6px 6px 0 0;
}

.game-ec-calendar-page .gec-card-bd { padding: 16px; }

.game-ec-calendar-page .gec-btn {
  border: 1px solid var(--gec-line-strong);
  background: #fff;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12.5px;
  cursor: pointer;
  color: var(--gec-text);
  font-weight: 600;
  transition: .15s;
}
.game-ec-calendar-page .gec-btn:hover { background: var(--gec-head-bg); }
.game-ec-calendar-page .gec-btn.primary { background: var(--gec-primary); border-color: var(--gec-primary); color: #fff; }
.game-ec-calendar-page .gec-btn.primary:hover { background: var(--gec-primary-dark); }
.game-ec-calendar-page .gec-btn.sm { padding: 6px 12px; font-size: 11px; }

.game-ec-calendar-page .gec-btn-row { display: flex; gap: 8px; margin-top: 16px; align-items: center; }

.game-ec-calendar-page input[type=text],
.game-ec-calendar-page input[type=number],
.game-ec-calendar-page select {
  border: 1px solid var(--gec-line-strong);
  border-radius: 4px;
  padding: 7px 10px;
  font-size: 12px;
  background: #fff;
  color: var(--gec-text);
  height: 32px;
}
.game-ec-calendar-page input:focus,
.game-ec-calendar-page select:focus {
  outline: none;
  border-color: var(--gec-primary);
  box-shadow: 0 0 0 2px #E8F4FF;
}
.game-ec-calendar-page label { font-size: 12px; color: var(--gec-text-sub); font-weight: 600; }
.game-ec-calendar-page .gec-small { font-size: 11px; color: var(--gec-text-sub); }

.game-ec-calendar-page table { border-collapse: collapse; width: 100%; font-size: 12px; }
.game-ec-calendar-page th,
.game-ec-calendar-page td { border: 1px solid var(--gec-line); padding: 8px 10px; text-align: left; }
.game-ec-calendar-page thead th { background: var(--gec-primary); color: #fff; font-weight: 600; }
.game-ec-calendar-page tbody tr:nth-child(even) { background: #FAFBFC; }
.game-ec-calendar-page tbody tr:hover { background: #F3F7FF; }

.game-ec-calendar-page .gec-tbl-scroll {
  max-height: 500px;
  overflow: auto;
  border: 1px solid var(--gec-line);
  border-radius: 4px;
}

.game-ec-calendar-page .gec-note {
  background: #FFF8E1;
  border: 1px solid #FFE0B2;
  border-radius: 4px;
  padding: 10px 12px;
  font-size: 11px;
  color: #856404;
  margin-top: 12px;
}
.game-ec-calendar-page .gec-note.mt0 { margin-top: 0; }
.game-ec-calendar-page .gec-note.mt16 { margin-top: 16px; }
.game-ec-calendar-page .gec-note.mb16 { margin-bottom: 16px; }

.game-ec-calendar-page .gec-dropzone {
  border: 2px dashed var(--gec-line-strong);
  border-radius: 6px;
  padding: 20px;
  text-align: center;
  cursor: pointer;
  transition: .15s;
}
.game-ec-calendar-page .gec-dropzone.drag-over { border-color: var(--gec-primary); background: #E8F4FF; }
.game-ec-calendar-page .gec-dropzone p { margin: 0 0 4px; }

/* 取り込み済みCSVファイル名バッジ（視認性向上のため大きく強調表示） */
.game-ec-calendar-page .gec-file-badge:empty { display: none; }
.game-ec-calendar-page .gec-file-badge {
  display: inline-flex;
  align-items: center;
  margin-top: 12px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 700;
  color: #0f5132;
  background: #D1E7DD;
  border: 1px solid #A3CFBB;
  border-radius: 999px;
  word-break: break-all;
}
.game-ec-calendar-page .gec-file-badge::before {
  content: "\1F4C4  \9078\629E\4E2D\306E\30D5\30A1\30A4\30EB\FF1A";
  margin-right: 6px;
  font-weight: 700;
}

.game-ec-calendar-page .gec-toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.game-ec-calendar-page .gec-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 11px; margin: 8px 0 12px; }
.game-ec-calendar-page .gec-legend .key { display: inline-flex; align-items: center; gap: 5px; }
.game-ec-calendar-page .gec-sw { width: 12px; height: 12px; border-radius: 2px; display: inline-block; border: 1px solid var(--gec-line-strong); }

.game-ec-calendar-page .cal-month-title { font-weight: 700; font-size: 14px; min-width: 90px; text-align: center; }

.game-ec-calendar-page .gamebadge { font-size: 10px; padding: 2px 6px; border-radius: 6px; font-weight: 700; cursor: pointer; }
.game-ec-calendar-page .gamebadge.y { background: #E8F5E9; color: var(--gec-success); }
.game-ec-calendar-page .gamebadge.n { background: #F0F0F0; color: var(--gec-text-sub); }

/* 更新確認モーダル */
.game-ec-calendar-page .gec-modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, .45);
  z-index: 1050;
  align-items: center;
  justify-content: center;
}
.game-ec-calendar-page .gec-modal {
  background: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 420px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .25);
  overflow: hidden;
}
.game-ec-calendar-page .gec-modal-hd {
  padding: 14px 20px;
  font-weight: 700;
  font-size: 15px;
  border-bottom: 1px solid var(--gec-line);
  background: var(--gec-head-bg);
}
.game-ec-calendar-page .gec-modal-bd { padding: 20px; }
.game-ec-calendar-page .gec-modal-bd p { margin: 0 0 8px; }
.game-ec-calendar-page .gec-modal-ft {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 20px;
  border-top: 1px solid var(--gec-line);
}

.game-ec-calendar-page td.sun { color: #E74C3C; }
.game-ec-calendar-page td.sat { color: #2E86DE; }
.game-ec-calendar-page td.holiday { color: #E74C3C; }
.game-ec-calendar-page tr.row-dirty td { background: #FFF3CD !important; }
.game-ec-calendar-page tr.row-dirty td:first-child { border-left: 3px solid #F0B429; }
.game-ec-calendar-page #calBody input { width: 90px; height: 26px; font-size: 11px; padding: 2px 6px; }
/* ==========================================================================
   アラート設定（西武ライオンズ様向けダッシュボードカスタム）
   モック mock_seibu_admin_10_11.html の SCREEN 1 を移植。
   すべて .seibulions-alert-page 配下にスコープする。
   ========================================================================== */

.seibulions-alert-page {
  --sla-primary: #0052CC;
  --sla-primary-dark: #003DA6;
  --sla-panel: #FFFFFF;
  --sla-line: #E0E6ED;
  --sla-line-strong: #CDD7E3;
  --sla-text: #1F2937;
  --sla-text-sub: #6B7280;
  --sla-head-bg: #F9FAFB;
  --sla-success: #22A76D;
  --sla-disabled: #D1D5DB;

  color: var(--sla-text);
  font-size: 13px;
  line-height: 1.6;
}

.seibulions-alert-page h1 {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 20px;
}

.seibulions-alert-page .sla-small { font-size: 11px; color: var(--sla-text-sub); }

.seibulions-alert-page .sla-tabs {
  display: flex;
  border-bottom: 2px solid var(--sla-primary);
  margin-bottom: 18px;
}
.seibulions-alert-page .sla-tab {
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 600;
  color: var(--sla-text-sub);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
}
.seibulions-alert-page .sla-tab:hover { color: var(--sla-text); }
.seibulions-alert-page .sla-tab.active { color: var(--sla-primary); border-bottom-color: var(--sla-primary); }

.seibulions-alert-page .sla-card {
  background: var(--sla-panel);
  border: 1px solid var(--sla-line);
  border-radius: 6px;
  margin-bottom: 16px;
}
.seibulions-alert-page .sla-card-hd {
  padding: 12px 16px;
  border-bottom: 1px solid var(--sla-line);
  font-weight: 600;
  font-size: 13px;
  background: var(--sla-head-bg);
  border-radius: 6px 6px 0 0;
}
.seibulions-alert-page .sla-card-bd { padding: 16px; }

.seibulions-alert-page .sla-btn {
  border: 1px solid var(--sla-line-strong);
  background: #fff;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12.5px;
  cursor: pointer;
  color: var(--sla-text);
  font-weight: 600;
  transition: .15s;
}
.seibulions-alert-page .sla-btn:hover { background: var(--sla-head-bg); }
.seibulions-alert-page .sla-btn.primary { background: var(--sla-primary); border-color: var(--sla-primary); color: #fff; }
.seibulions-alert-page .sla-btn.primary:hover { background: var(--sla-primary-dark); }
.seibulions-alert-page .sla-btn.sm { padding: 6px 12px; font-size: 11px; }
.seibulions-alert-page .sla-btn-row { display: flex; gap: 8px; margin-top: 16px; align-items: center; }

.seibulions-alert-page input[type=text],
.seibulions-alert-page input[type=email],
.seibulions-alert-page input[type=time],
.seibulions-alert-page select {
  border: 1px solid var(--sla-line-strong);
  border-radius: 4px;
  padding: 7px 10px;
  font-size: 12px;
  background: #fff;
  color: var(--sla-text);
  height: 32px;
}
.seibulions-alert-page input:focus,
.seibulions-alert-page select:focus {
  outline: none;
  border-color: var(--sla-primary);
  box-shadow: 0 0 0 2px #E8F4FF;
}
.seibulions-alert-page label { font-size: 12px; color: var(--sla-text-sub); font-weight: 600; }

.seibulions-alert-page .sla-search-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px 16px;
}
.seibulions-alert-page .sla-field { display: flex; align-items: center; gap: 8px; }
/* ラベル幅は揃えたうえで右寄せし、ラベルとselect・inputの間に余白が空かないようにする */
.seibulions-alert-page .sla-field label { min-width: 72px; text-align: right; white-space: nowrap; }
.seibulions-alert-page .sla-field select,
.seibulions-alert-page .sla-field input[type=text] { flex: 1; min-width: 0; }
.seibulions-alert-page .sla-field-wide { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.seibulions-alert-page .sla-field-wide label { min-width: 140px; }
.seibulions-alert-page .sla-field-wide input[type=text] { width: 360px; }

.seibulions-alert-page table { border-collapse: collapse; width: 100%; font-size: 12px; }
.seibulions-alert-page th,
.seibulions-alert-page td { border: 1px solid var(--sla-line); padding: 8px 10px; text-align: left; }
.seibulions-alert-page thead th { background: var(--sla-primary); color: #fff; font-weight: 600; }
.seibulions-alert-page tbody tr:nth-child(even) { background: #FAFBFC; }
.seibulions-alert-page tbody tr:hover { background: #F3F7FF; }

.seibulions-alert-page .sla-tbl-scroll {
  max-height: 900px;
  overflow: auto;
  border: 1px solid var(--sla-line);
  border-radius: 4px;
}

.seibulions-alert-page .sla-note {
  background: #FFF8E1;
  border: 1px solid #FFE0B2;
  border-radius: 4px;
  padding: 10px 12px;
  font-size: 11px;
  color: #856404;
  margin-top: 12px;
}
.seibulions-alert-page .sla-note.mt0 { margin-top: 0; }

.seibulions-alert-page .sla-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  user-select: none;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  color: var(--sla-text-sub);
  font-weight: 700;
}
.seibulions-alert-page .sla-toggle .track {
  width: 40px;
  height: 20px;
  border-radius: 10px;
  background: var(--sla-disabled);
  position: relative;
  transition: .2s;
}
.seibulions-alert-page .sla-toggle .track::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  transition: .2s;
}
.seibulions-alert-page .sla-toggle.on .track { background: var(--sla-success); }
.seibulions-alert-page .sla-toggle.on .track::after { left: 22px; }
.seibulions-alert-page .sla-toggle[disabled] { opacity: .5; cursor: progress; }

/* 配信設定タブのメール配信ON/OFFスイッチ（フォーム送信で保存） */
.seibulions-alert-page .sla-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  user-select: none;
  color: var(--sla-text-sub);
  font-weight: 700;
}
.seibulions-alert-page .sla-switch input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.seibulions-alert-page .sla-switch .track {
  width: 40px;
  height: 20px;
  border-radius: 10px;
  background: var(--sla-disabled);
  position: relative;
  transition: .2s;
}
.seibulions-alert-page .sla-switch .track::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  transition: .2s;
}
.seibulions-alert-page .sla-switch input:checked ~ .track { background: var(--sla-success); }
.seibulions-alert-page .sla-switch input:checked ~ .track::after { left: 22px; }
.seibulions-alert-page .sla-switch .txt.on { display: none; }
.seibulions-alert-page .sla-switch input:checked ~ .txt.on { display: inline; }
.seibulions-alert-page .sla-switch input:checked ~ .txt.off { display: none; }
.seibulions-alert-page .sla-switch input:focus-visible ~ .track { outline: 2px solid var(--sla-primary); outline-offset: 2px; }

.seibulions-alert-page .sla-pager { display: flex; align-items: center; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.seibulions-alert-page .sla-pager .info { font-size: 11px; color: var(--sla-text-sub); }
@charset "UTF-8";
/* Signup Flow Modern Design Styles */
/* Scoped under .signup-page to avoid global leakage */
/* Page Container */
/* line 5, app/assets/stylesheets/signup.scss */
.signup-page {
  min-height: calc(100vh - 60px);
  padding: 40px 20px;
  background: #F8FAFC;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

/* Form Card */
/* line 15, app/assets/stylesheets/signup.scss */
.signup-page__card {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(23, 75, 125, 0.12), 0 1px 4px rgba(23, 75, 125, 0.06);
  padding: 4rem 3.6rem;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  border-top: 4px solid #174B7D;
}

/* Page Title */
/* line 27, app/assets/stylesheets/signup.scss */
.signup-page__title {
  font-size: 2.4rem;
  font-weight: 700;
  color: #174B7D;
  text-align: center;
  margin-bottom: 0.8rem;
}

/* line 35, app/assets/stylesheets/signup.scss */
.signup-page__title::after {
  content: '';
  display: block;
  width: 60px;
  height: 4px;
  background: linear-gradient(90deg, #174B7D 0%, #47cd89 100%);
  margin: 1.2rem auto 2.4rem;
  border-radius: 2px;
}

/* Error Block */
/* line 46, app/assets/stylesheets/signup.scss */
.signup-page__errors {
  background: linear-gradient(135deg, #fff5f5 0%, #ffe8e8 100%);
  border-left: 4px solid #dc3545;
  border-radius: 8px;
  padding: 1.6rem 2rem;
  margin-bottom: 2.4rem;
  box-shadow: 0 2px 8px rgba(220, 53, 69, 0.1);
}

/* line 55, app/assets/stylesheets/signup.scss */
.signup-page__errors ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* line 61, app/assets/stylesheets/signup.scss */
.signup-page__errors li {
  color: #dc3545;
  font-size: 1.4rem;
  font-weight: 500;
  padding: 0.4rem 0;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

/* line 71, app/assets/stylesheets/signup.scss */
.signup-page__errors li::before {
  content: '\26A0' / '';
  font-size: 1.4rem;
}

/* Form Group */
/* line 77, app/assets/stylesheets/signup.scss */
.signup-page__form-group {
  margin-bottom: 2rem;
}

/* line 81, app/assets/stylesheets/signup.scss */
.signup-page__form-label {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 1.5rem;
  font-weight: 600;
  color: #174B7D;
  margin-bottom: 0.8rem;
}

/* line 91, app/assets/stylesheets/signup.scss */
.signup-page__form-label .required {
  background: #dc3545;
  color: #ffffff;
  font-size: 1.1rem;
  font-weight: 700;
  padding: 0.2rem 0.8rem;
  border-radius: 4px;
  white-space: nowrap;
}

/* Form Inputs */
/* line 102, app/assets/stylesheets/signup.scss */
.signup-page__input {
  width: 100%;
  border: 2px solid #c8d8e8;
  border-radius: 8px;
  padding: 1.2rem 1.6rem;
  font-size: 1.5rem;
  transition: all 0.3s ease;
  background: #f8fbff;
  box-sizing: border-box;
}

/* line 113, app/assets/stylesheets/signup.scss */
.signup-page__input:focus {
  outline: none;
  border-color: #174B7D;
  box-shadow: 0 0 0 3px rgba(23, 75, 125, 0.1);
  background: #f8fbff;
}

/* line 120, app/assets/stylesheets/signup.scss */
.signup-page__input:hover {
  border-color: #2364a0;
}

/* line 124, app/assets/stylesheets/signup.scss */
.signup-page__input::placeholder {
  color: #94a3b8;
}

/* Name Row (side-by-side inputs) */
/* line 129, app/assets/stylesheets/signup.scss */
.signup-page__name-row {
  display: flex;
  gap: 1.2rem;
}

/* line 134, app/assets/stylesheets/signup.scss */
.signup-page__name-row .signup-page__name-col {
  flex: 1;
}

/* Terms of Service Box */
/* line 139, app/assets/stylesheets/signup.scss */
.signup-page__terms-box {
  border: 2px solid #c8d8e8;
  border-radius: 8px;
  height: 280px;
  overflow-y: auto;
  padding: 1.6rem;
  margin-bottom: 2rem;
  background: #f8fbff;
  font-size: 1.3rem;
  line-height: 1.8;
  color: #334155;
}

/* line 152, app/assets/stylesheets/signup.scss */
.signup-page__terms-box::-webkit-scrollbar {
  width: 6px;
}

/* line 156, app/assets/stylesheets/signup.scss */
.signup-page__terms-box::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 3px;
}

/* line 161, app/assets/stylesheets/signup.scss */
.signup-page__terms-box::-webkit-scrollbar-thumb {
  background: #174B7D;
  border-radius: 3px;
}

/* Section Title (e.g. 利用規約) */
/* line 167, app/assets/stylesheets/signup.scss */
.signup-page__section-title {
  font-size: 1.6rem;
  font-weight: 600;
  color: #174B7D;
  margin-bottom: 1rem;
  padding-left: 1.2rem;
  position: relative;
}

/* line 176, app/assets/stylesheets/signup.scss */
.signup-page__section-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 1.6rem;
  background: linear-gradient(180deg, #174B7D 0%, #47cd89 100%);
  border-radius: 2px;
}

/* Checkbox */
/* line 189, app/assets/stylesheets/signup.scss */
.signup-page__checkbox {
  display: flex;
  align-items: flex-start;
  gap: 1.2rem;
  margin-bottom: 1.6rem;
  padding: 1.4rem 1.6rem;
  border-radius: 8px;
  background: #f0f6ff;
  border: 2px solid #c8d8e8;
  transition: all 0.2s ease;
}

/* line 201, app/assets/stylesheets/signup.scss */
.signup-page__checkbox:hover {
  border-color: #174B7D;
  box-shadow: 0 2px 8px rgba(23, 75, 125, 0.1);
}

/* line 206, app/assets/stylesheets/signup.scss */
.signup-page__checkbox-input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 22px;
  height: 22px;
  min-width: 22px;
  margin-top: 0.2rem;
  border: 2px solid #174B7D;
  border-radius: 4px;
  cursor: pointer;
  position: relative;
  background-color: #ffffff;
  transition: all 0.2s ease;
}

/* line 222, app/assets/stylesheets/signup.scss */
.signup-page__checkbox-input:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(23, 75, 125, 0.2);
}

/* line 227, app/assets/stylesheets/signup.scss */
.signup-page__checkbox-input:checked {
  background-color: #174B7D;
  border-color: #174B7D;
}

/* line 232, app/assets/stylesheets/signup.scss */
.signup-page__checkbox-input:checked::after {
  content: "\2713" / "";
  font-size: 14px;
  color: #ffffff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: 700;
}

/* line 243, app/assets/stylesheets/signup.scss */
.signup-page__checkbox-label {
  font-size: 1.3rem;
  color: #334155;
  line-height: 1.6;
  cursor: pointer;
}

/* Buttons */
/* line 251, app/assets/stylesheets/signup.scss */
.signup-page__btn-primary {
  display: block;
  width: 100%;
  max-width: 320px;
  margin: 2.4rem auto 0;
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 1.4rem 2.4rem;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.25);
  text-align: center;
}

/* line 269, app/assets/stylesheets/signup.scss */
.signup-page__btn-primary:hover {
  background: linear-gradient(135deg, #0d2e4e 0%, #174B7D 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(23, 75, 125, 0.35);
}

/* line 275, app/assets/stylesheets/signup.scss */
.signup-page__btn-primary:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(23, 75, 125, 0.2);
}

/* line 280, app/assets/stylesheets/signup.scss */
.signup-page__btn-secondary {
  background: #ffffff;
  color: #174B7D;
  font-size: 1.6rem;
  font-weight: 600;
  padding: 1.4rem 2.4rem;
  border: 2px solid #174B7D;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.3s ease;
  text-align: center;
}

/* line 293, app/assets/stylesheets/signup.scss */
.signup-page__btn-secondary:hover {
  background: #f0f6ff;
  border-color: #2364a0;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.1);
}

/* Button Group (confirm page) */
/* line 301, app/assets/stylesheets/signup.scss */
.signup-page__btn-group {
  display: flex;
  justify-content: center;
  gap: 1.6rem;
  margin-top: 3rem;
}

/* line 308, app/assets/stylesheets/signup.scss */
.signup-page__btn-group .signup-page__btn-primary,
.signup-page__btn-group .signup-page__btn-secondary {
  display: inline-block;
  width: auto;
  min-width: 180px;
  margin: 0;
}

/* Confirmation List */
/* line 317, app/assets/stylesheets/signup.scss */
.signup-page__confirm-list {
  margin-bottom: 2rem;
}

/* line 321, app/assets/stylesheets/signup.scss */
.signup-page__confirm-item {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #e8eef5;
  padding: 1.4rem 0;
}

/* line 328, app/assets/stylesheets/signup.scss */
.signup-page__confirm-item:last-of-type {
  border-bottom: none;
}

/* line 332, app/assets/stylesheets/signup.scss */
.signup-page__confirm-dt {
  width: 200px;
  font-size: 1.4rem;
  font-weight: 600;
  color: #174B7D;
  padding-right: 1rem;
}

/* line 340, app/assets/stylesheets/signup.scss */
.signup-page__confirm-dd {
  flex: 1;
  font-size: 1.5rem;
  color: #334155;
  min-width: 0;
}

/* Success Card */
/* line 348, app/assets/stylesheets/signup.scss */
.signup-page__success-card {
  text-align: center;
  padding: 4rem 2rem;
}

/* line 353, app/assets/stylesheets/signup.scss */
.signup-page__success-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: linear-gradient(135deg, #47cd89 0%, #2dd4a0 100%);
  margin-bottom: 2.4rem;
  box-shadow: 0 4px 16px rgba(71, 205, 137, 0.3);
}

/* line 365, app/assets/stylesheets/signup.scss */
.signup-page__success-icon::after {
  content: '\2713' / '';
  font-size: 3.6rem;
  color: #ffffff;
  font-weight: 700;
}

/* line 372, app/assets/stylesheets/signup.scss */
.signup-page__success-message {
  font-size: 1.8rem;
  color: #174B7D;
  font-weight: 600;
  line-height: 1.8;
}

/* Activation Info Box */
/* line 380, app/assets/stylesheets/signup.scss */
.signup-page__info-box {
  background: #f0f6ff;
  border-radius: 8px;
  padding: 2rem 2.4rem;
  margin-bottom: 2.4rem;
  border: 1px solid #e0ecf7;
}

/* line 388, app/assets/stylesheets/signup.scss */
.signup-page__info-box p {
  font-size: 1.4rem;
  color: #334155;
  line-height: 1.8;
  text-align: center;
  margin: 0 0 1rem;
}

/* line 396, app/assets/stylesheets/signup.scss */
.signup-page__info-box p:last-child {
  margin-bottom: 0;
}

/* line 400, app/assets/stylesheets/signup.scss */
.signup-page__info-box .signup-page__note {
  font-size: 1.2rem;
  color: #64748b;
}

/* Responsive */
@media (max-width: 768px) {
  /* line 407, app/assets/stylesheets/signup.scss */
  .signup-page {
    padding: 24px 16px;
  }
  /* line 411, app/assets/stylesheets/signup.scss */
  .signup-page__card {
    padding: 2.4rem 2rem;
  }
  /* line 415, app/assets/stylesheets/signup.scss */
  .signup-page__title {
    font-size: 2rem;
  }
  /* line 419, app/assets/stylesheets/signup.scss */
  .signup-page__name-row {
    flex-direction: column;
    gap: 0;
  }
  /* line 424, app/assets/stylesheets/signup.scss */
  .signup-page__confirm-item {
    flex-direction: column;
  }
  /* line 428, app/assets/stylesheets/signup.scss */
  .signup-page__confirm-dt {
    width: 100%;
    margin-bottom: 0.4rem;
  }
  /* line 433, app/assets/stylesheets/signup.scss */
  .signup-page__btn-group {
    flex-direction: column;
    align-items: stretch;
  }
  /* line 438, app/assets/stylesheets/signup.scss */
  .signup-page__btn-group .signup-page__btn-primary,
.signup-page__btn-group .signup-page__btn-secondary {
    min-width: auto;
    width: 100%;
  }
}

/* Visually hidden utility for accessibility */
/* line 446, app/assets/stylesheets/signup.scss */
.signup-page .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@charset "UTF-8";
/*
 * This is a manifest file that'll be compiled into application.scss.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
























 */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&display=swap");
@media screen and (min-width: 835px) {
  /* line 45, app/assets/stylesheets/application.scss */
  .mbpc-0 {
    margin-bottom: 0px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 50, app/assets/stylesheets/application.scss */
  .mbsp-0 {
    margin-bottom: 0px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 55, app/assets/stylesheets/application.scss */
  .mbpc-1 {
    margin-bottom: 1px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 60, app/assets/stylesheets/application.scss */
  .mbsp-1 {
    margin-bottom: 1px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 65, app/assets/stylesheets/application.scss */
  .mbpc-2 {
    margin-bottom: 2px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 70, app/assets/stylesheets/application.scss */
  .mbsp-2 {
    margin-bottom: 2px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 75, app/assets/stylesheets/application.scss */
  .mbpc-3 {
    margin-bottom: 3px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 80, app/assets/stylesheets/application.scss */
  .mbsp-3 {
    margin-bottom: 3px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 85, app/assets/stylesheets/application.scss */
  .mbpc-4 {
    margin-bottom: 4px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 90, app/assets/stylesheets/application.scss */
  .mbsp-4 {
    margin-bottom: 4px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 95, app/assets/stylesheets/application.scss */
  .mbpc-5 {
    margin-bottom: 5px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 100, app/assets/stylesheets/application.scss */
  .mbsp-5 {
    margin-bottom: 5px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 105, app/assets/stylesheets/application.scss */
  .mbpc-6 {
    margin-bottom: 6px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 110, app/assets/stylesheets/application.scss */
  .mbsp-6 {
    margin-bottom: 6px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 115, app/assets/stylesheets/application.scss */
  .mbpc-7 {
    margin-bottom: 7px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 120, app/assets/stylesheets/application.scss */
  .mbsp-7 {
    margin-bottom: 7px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 125, app/assets/stylesheets/application.scss */
  .mbpc-8 {
    margin-bottom: 8px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 130, app/assets/stylesheets/application.scss */
  .mbsp-8 {
    margin-bottom: 8px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 135, app/assets/stylesheets/application.scss */
  .mbpc-9 {
    margin-bottom: 9px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 140, app/assets/stylesheets/application.scss */
  .mbsp-9 {
    margin-bottom: 9px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 145, app/assets/stylesheets/application.scss */
  .mbpc-10 {
    margin-bottom: 10px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 150, app/assets/stylesheets/application.scss */
  .mbsp-10 {
    margin-bottom: 10px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 155, app/assets/stylesheets/application.scss */
  .mbpc-11 {
    margin-bottom: 11px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 160, app/assets/stylesheets/application.scss */
  .mbsp-11 {
    margin-bottom: 11px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 165, app/assets/stylesheets/application.scss */
  .mbpc-12 {
    margin-bottom: 12px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 170, app/assets/stylesheets/application.scss */
  .mbsp-12 {
    margin-bottom: 12px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 175, app/assets/stylesheets/application.scss */
  .mbpc-13 {
    margin-bottom: 13px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 180, app/assets/stylesheets/application.scss */
  .mbsp-13 {
    margin-bottom: 13px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 185, app/assets/stylesheets/application.scss */
  .mbpc-14 {
    margin-bottom: 14px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 190, app/assets/stylesheets/application.scss */
  .mbsp-14 {
    margin-bottom: 14px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 195, app/assets/stylesheets/application.scss */
  .mbpc-15 {
    margin-bottom: 15px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 200, app/assets/stylesheets/application.scss */
  .mbsp-15 {
    margin-bottom: 15px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 205, app/assets/stylesheets/application.scss */
  .mbpc-16 {
    margin-bottom: 16px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 210, app/assets/stylesheets/application.scss */
  .mbsp-16 {
    margin-bottom: 16px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 215, app/assets/stylesheets/application.scss */
  .mbpc-17 {
    margin-bottom: 17px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 220, app/assets/stylesheets/application.scss */
  .mbsp-17 {
    margin-bottom: 17px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 225, app/assets/stylesheets/application.scss */
  .mbpc-18 {
    margin-bottom: 18px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 230, app/assets/stylesheets/application.scss */
  .mbsp-18 {
    margin-bottom: 18px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 235, app/assets/stylesheets/application.scss */
  .mbpc-19 {
    margin-bottom: 19px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 240, app/assets/stylesheets/application.scss */
  .mbsp-19 {
    margin-bottom: 19px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 245, app/assets/stylesheets/application.scss */
  .mbpc-20 {
    margin-bottom: 20px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 250, app/assets/stylesheets/application.scss */
  .mbsp-20 {
    margin-bottom: 20px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 255, app/assets/stylesheets/application.scss */
  .mbpc-21 {
    margin-bottom: 21px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 260, app/assets/stylesheets/application.scss */
  .mbsp-21 {
    margin-bottom: 21px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 265, app/assets/stylesheets/application.scss */
  .mbpc-22 {
    margin-bottom: 22px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 270, app/assets/stylesheets/application.scss */
  .mbsp-22 {
    margin-bottom: 22px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 275, app/assets/stylesheets/application.scss */
  .mbpc-23 {
    margin-bottom: 23px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 280, app/assets/stylesheets/application.scss */
  .mbsp-23 {
    margin-bottom: 23px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 285, app/assets/stylesheets/application.scss */
  .mbpc-24 {
    margin-bottom: 24px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 290, app/assets/stylesheets/application.scss */
  .mbsp-24 {
    margin-bottom: 24px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 295, app/assets/stylesheets/application.scss */
  .mbpc-25 {
    margin-bottom: 25px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 300, app/assets/stylesheets/application.scss */
  .mbsp-25 {
    margin-bottom: 25px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 305, app/assets/stylesheets/application.scss */
  .mbpc-26 {
    margin-bottom: 26px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 310, app/assets/stylesheets/application.scss */
  .mbsp-26 {
    margin-bottom: 26px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 315, app/assets/stylesheets/application.scss */
  .mbpc-27 {
    margin-bottom: 27px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 320, app/assets/stylesheets/application.scss */
  .mbsp-27 {
    margin-bottom: 27px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 325, app/assets/stylesheets/application.scss */
  .mbpc-28 {
    margin-bottom: 28px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 330, app/assets/stylesheets/application.scss */
  .mbsp-28 {
    margin-bottom: 28px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 335, app/assets/stylesheets/application.scss */
  .mbpc-29 {
    margin-bottom: 29px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 340, app/assets/stylesheets/application.scss */
  .mbsp-29 {
    margin-bottom: 29px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 345, app/assets/stylesheets/application.scss */
  .mbpc-30 {
    margin-bottom: 30px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 350, app/assets/stylesheets/application.scss */
  .mbsp-30 {
    margin-bottom: 30px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 355, app/assets/stylesheets/application.scss */
  .mbpc-31 {
    margin-bottom: 31px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 360, app/assets/stylesheets/application.scss */
  .mbsp-31 {
    margin-bottom: 31px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 365, app/assets/stylesheets/application.scss */
  .mbpc-32 {
    margin-bottom: 32px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 370, app/assets/stylesheets/application.scss */
  .mbsp-32 {
    margin-bottom: 32px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 375, app/assets/stylesheets/application.scss */
  .mbpc-33 {
    margin-bottom: 33px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 380, app/assets/stylesheets/application.scss */
  .mbsp-33 {
    margin-bottom: 33px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 385, app/assets/stylesheets/application.scss */
  .mbpc-34 {
    margin-bottom: 34px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 390, app/assets/stylesheets/application.scss */
  .mbsp-34 {
    margin-bottom: 34px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 395, app/assets/stylesheets/application.scss */
  .mbpc-35 {
    margin-bottom: 35px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 400, app/assets/stylesheets/application.scss */
  .mbsp-35 {
    margin-bottom: 35px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 405, app/assets/stylesheets/application.scss */
  .mbpc-36 {
    margin-bottom: 36px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 410, app/assets/stylesheets/application.scss */
  .mbsp-36 {
    margin-bottom: 36px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 415, app/assets/stylesheets/application.scss */
  .mbpc-37 {
    margin-bottom: 37px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 420, app/assets/stylesheets/application.scss */
  .mbsp-37 {
    margin-bottom: 37px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 425, app/assets/stylesheets/application.scss */
  .mbpc-38 {
    margin-bottom: 38px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 430, app/assets/stylesheets/application.scss */
  .mbsp-38 {
    margin-bottom: 38px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 435, app/assets/stylesheets/application.scss */
  .mbpc-39 {
    margin-bottom: 39px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 440, app/assets/stylesheets/application.scss */
  .mbsp-39 {
    margin-bottom: 39px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 445, app/assets/stylesheets/application.scss */
  .mbpc-40 {
    margin-bottom: 40px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 450, app/assets/stylesheets/application.scss */
  .mbsp-40 {
    margin-bottom: 40px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 455, app/assets/stylesheets/application.scss */
  .mbpc-41 {
    margin-bottom: 41px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 460, app/assets/stylesheets/application.scss */
  .mbsp-41 {
    margin-bottom: 41px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 465, app/assets/stylesheets/application.scss */
  .mbpc-42 {
    margin-bottom: 42px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 470, app/assets/stylesheets/application.scss */
  .mbsp-42 {
    margin-bottom: 42px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 475, app/assets/stylesheets/application.scss */
  .mbpc-43 {
    margin-bottom: 43px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 480, app/assets/stylesheets/application.scss */
  .mbsp-43 {
    margin-bottom: 43px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 485, app/assets/stylesheets/application.scss */
  .mbpc-44 {
    margin-bottom: 44px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 490, app/assets/stylesheets/application.scss */
  .mbsp-44 {
    margin-bottom: 44px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 495, app/assets/stylesheets/application.scss */
  .mbpc-45 {
    margin-bottom: 45px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 500, app/assets/stylesheets/application.scss */
  .mbsp-45 {
    margin-bottom: 45px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 505, app/assets/stylesheets/application.scss */
  .mbpc-46 {
    margin-bottom: 46px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 510, app/assets/stylesheets/application.scss */
  .mbsp-46 {
    margin-bottom: 46px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 515, app/assets/stylesheets/application.scss */
  .mbpc-47 {
    margin-bottom: 47px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 520, app/assets/stylesheets/application.scss */
  .mbsp-47 {
    margin-bottom: 47px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 525, app/assets/stylesheets/application.scss */
  .mbpc-48 {
    margin-bottom: 48px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 530, app/assets/stylesheets/application.scss */
  .mbsp-48 {
    margin-bottom: 48px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 535, app/assets/stylesheets/application.scss */
  .mbpc-49 {
    margin-bottom: 49px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 540, app/assets/stylesheets/application.scss */
  .mbsp-49 {
    margin-bottom: 49px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 545, app/assets/stylesheets/application.scss */
  .mbpc-50 {
    margin-bottom: 50px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 550, app/assets/stylesheets/application.scss */
  .mbsp-50 {
    margin-bottom: 50px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 555, app/assets/stylesheets/application.scss */
  .mbpc-51 {
    margin-bottom: 51px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 560, app/assets/stylesheets/application.scss */
  .mbsp-51 {
    margin-bottom: 51px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 565, app/assets/stylesheets/application.scss */
  .mbpc-52 {
    margin-bottom: 52px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 570, app/assets/stylesheets/application.scss */
  .mbsp-52 {
    margin-bottom: 52px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 575, app/assets/stylesheets/application.scss */
  .mbpc-53 {
    margin-bottom: 53px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 580, app/assets/stylesheets/application.scss */
  .mbsp-53 {
    margin-bottom: 53px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 585, app/assets/stylesheets/application.scss */
  .mbpc-54 {
    margin-bottom: 54px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 590, app/assets/stylesheets/application.scss */
  .mbsp-54 {
    margin-bottom: 54px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 595, app/assets/stylesheets/application.scss */
  .mbpc-55 {
    margin-bottom: 55px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 600, app/assets/stylesheets/application.scss */
  .mbsp-55 {
    margin-bottom: 55px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 605, app/assets/stylesheets/application.scss */
  .mbpc-56 {
    margin-bottom: 56px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 610, app/assets/stylesheets/application.scss */
  .mbsp-56 {
    margin-bottom: 56px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 615, app/assets/stylesheets/application.scss */
  .mbpc-57 {
    margin-bottom: 57px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 620, app/assets/stylesheets/application.scss */
  .mbsp-57 {
    margin-bottom: 57px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 625, app/assets/stylesheets/application.scss */
  .mbpc-58 {
    margin-bottom: 58px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 630, app/assets/stylesheets/application.scss */
  .mbsp-58 {
    margin-bottom: 58px !important;
  }
}

/* カスタムフォルダ選択ドロップダウン — 常に下方向に展開 */
/* line 636, app/assets/stylesheets/application.scss */
[data-controller="folder-select"] {
  position: relative;
}

/* line 640, app/assets/stylesheets/application.scss */
.folder-select-trigger {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 16px;
  padding: 12px 16px;
  min-height: 50px;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #fff;
  cursor: pointer;
  font-weight: 500;
  transition: all 0.2s ease;
  user-select: none;
}

/* line 655, app/assets/stylesheets/application.scss */
.folder-select-trigger:hover, .folder-select-trigger:focus {
  border-color: #0d6efd;
  background-color: #f8f9fa;
}

/* line 661, app/assets/stylesheets/application.scss */
.folder-select-trigger:focus {
  outline: none;
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}

/* line 667, app/assets/stylesheets/application.scss */
.folder-select-arrow {
  font-size: 12px;
  color: #6c757d;
  margin-left: 8px;
}

/* line 673, app/assets/stylesheets/application.scss */
.folder-select-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 1050;
  background: #fff;
  border: 2px solid #0d6efd;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  max-height: 300px;
  overflow-y: auto;
  margin-top: 4px;
}

/* line 688, app/assets/stylesheets/application.scss */
.folder-select-option {
  padding: 10px 16px;
  font-size: 15px;
  cursor: pointer;
  color: #333;
  line-height: 1.4;
}

/* line 695, app/assets/stylesheets/application.scss */
.folder-select-option:first-child {
  color: #6c757d;
}

/* line 699, app/assets/stylesheets/application.scss */
.folder-select-option:hover {
  background-color: #e3f2fd;
}

/* line 703, app/assets/stylesheets/application.scss */
.folder-select-option:focus {
  background-color: #e3f2fd;
  outline: 2px solid #0d6efd;
  outline-offset: -2px;
}

@media screen and (max-width: 768px) {
  /* line 711, app/assets/stylesheets/application.scss */
  .folder-select-trigger {
    font-size: 14px;
    padding: 10px 12px;
    min-height: 45px;
  }
  /* line 717, app/assets/stylesheets/application.scss */
  .folder-select-option {
    font-size: 14px;
  }
}

@media screen and (min-width: 835px) {
  /* line 723, app/assets/stylesheets/application.scss */
  .mbpc-59 {
    margin-bottom: 59px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 728, app/assets/stylesheets/application.scss */
  .mbsp-59 {
    margin-bottom: 59px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 733, app/assets/stylesheets/application.scss */
  .mbpc-60 {
    margin-bottom: 60px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 738, app/assets/stylesheets/application.scss */
  .mbsp-60 {
    margin-bottom: 60px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 743, app/assets/stylesheets/application.scss */
  .mbpc-61 {
    margin-bottom: 61px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 748, app/assets/stylesheets/application.scss */
  .mbsp-61 {
    margin-bottom: 61px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 753, app/assets/stylesheets/application.scss */
  .mbpc-62 {
    margin-bottom: 62px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 758, app/assets/stylesheets/application.scss */
  .mbsp-62 {
    margin-bottom: 62px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 763, app/assets/stylesheets/application.scss */
  .mbpc-63 {
    margin-bottom: 63px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 768, app/assets/stylesheets/application.scss */
  .mbsp-63 {
    margin-bottom: 63px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 773, app/assets/stylesheets/application.scss */
  .mbpc-64 {
    margin-bottom: 64px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 778, app/assets/stylesheets/application.scss */
  .mbsp-64 {
    margin-bottom: 64px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 783, app/assets/stylesheets/application.scss */
  .mbpc-65 {
    margin-bottom: 65px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 788, app/assets/stylesheets/application.scss */
  .mbsp-65 {
    margin-bottom: 65px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 793, app/assets/stylesheets/application.scss */
  .mbpc-66 {
    margin-bottom: 66px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 798, app/assets/stylesheets/application.scss */
  .mbsp-66 {
    margin-bottom: 66px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 803, app/assets/stylesheets/application.scss */
  .mbpc-67 {
    margin-bottom: 67px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 808, app/assets/stylesheets/application.scss */
  .mbsp-67 {
    margin-bottom: 67px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 813, app/assets/stylesheets/application.scss */
  .mbpc-68 {
    margin-bottom: 68px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 818, app/assets/stylesheets/application.scss */
  .mbsp-68 {
    margin-bottom: 68px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 823, app/assets/stylesheets/application.scss */
  .mbpc-69 {
    margin-bottom: 69px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 828, app/assets/stylesheets/application.scss */
  .mbsp-69 {
    margin-bottom: 69px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 833, app/assets/stylesheets/application.scss */
  .mbpc-70 {
    margin-bottom: 70px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 838, app/assets/stylesheets/application.scss */
  .mbsp-70 {
    margin-bottom: 70px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 843, app/assets/stylesheets/application.scss */
  .mbpc-71 {
    margin-bottom: 71px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 848, app/assets/stylesheets/application.scss */
  .mbsp-71 {
    margin-bottom: 71px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 853, app/assets/stylesheets/application.scss */
  .mbpc-72 {
    margin-bottom: 72px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 858, app/assets/stylesheets/application.scss */
  .mbsp-72 {
    margin-bottom: 72px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 863, app/assets/stylesheets/application.scss */
  .mbpc-73 {
    margin-bottom: 73px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 868, app/assets/stylesheets/application.scss */
  .mbsp-73 {
    margin-bottom: 73px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 873, app/assets/stylesheets/application.scss */
  .mbpc-74 {
    margin-bottom: 74px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 878, app/assets/stylesheets/application.scss */
  .mbsp-74 {
    margin-bottom: 74px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 883, app/assets/stylesheets/application.scss */
  .mbpc-75 {
    margin-bottom: 75px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 888, app/assets/stylesheets/application.scss */
  .mbsp-75 {
    margin-bottom: 75px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 893, app/assets/stylesheets/application.scss */
  .mbpc-76 {
    margin-bottom: 76px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 898, app/assets/stylesheets/application.scss */
  .mbsp-76 {
    margin-bottom: 76px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 903, app/assets/stylesheets/application.scss */
  .mbpc-77 {
    margin-bottom: 77px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 908, app/assets/stylesheets/application.scss */
  .mbsp-77 {
    margin-bottom: 77px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 913, app/assets/stylesheets/application.scss */
  .mbpc-78 {
    margin-bottom: 78px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 918, app/assets/stylesheets/application.scss */
  .mbsp-78 {
    margin-bottom: 78px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 923, app/assets/stylesheets/application.scss */
  .mbpc-79 {
    margin-bottom: 79px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 928, app/assets/stylesheets/application.scss */
  .mbsp-79 {
    margin-bottom: 79px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 933, app/assets/stylesheets/application.scss */
  .mbpc-80 {
    margin-bottom: 80px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 938, app/assets/stylesheets/application.scss */
  .mbsp-80 {
    margin-bottom: 80px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 943, app/assets/stylesheets/application.scss */
  .mbpc-81 {
    margin-bottom: 81px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 948, app/assets/stylesheets/application.scss */
  .mbsp-81 {
    margin-bottom: 81px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 953, app/assets/stylesheets/application.scss */
  .mbpc-82 {
    margin-bottom: 82px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 958, app/assets/stylesheets/application.scss */
  .mbsp-82 {
    margin-bottom: 82px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 963, app/assets/stylesheets/application.scss */
  .mbpc-83 {
    margin-bottom: 83px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 968, app/assets/stylesheets/application.scss */
  .mbsp-83 {
    margin-bottom: 83px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 973, app/assets/stylesheets/application.scss */
  .mbpc-84 {
    margin-bottom: 84px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 978, app/assets/stylesheets/application.scss */
  .mbsp-84 {
    margin-bottom: 84px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 983, app/assets/stylesheets/application.scss */
  .mbpc-85 {
    margin-bottom: 85px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 988, app/assets/stylesheets/application.scss */
  .mbsp-85 {
    margin-bottom: 85px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 993, app/assets/stylesheets/application.scss */
  .mbpc-86 {
    margin-bottom: 86px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 998, app/assets/stylesheets/application.scss */
  .mbsp-86 {
    margin-bottom: 86px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1003, app/assets/stylesheets/application.scss */
  .mbpc-87 {
    margin-bottom: 87px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1008, app/assets/stylesheets/application.scss */
  .mbsp-87 {
    margin-bottom: 87px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1013, app/assets/stylesheets/application.scss */
  .mbpc-88 {
    margin-bottom: 88px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1018, app/assets/stylesheets/application.scss */
  .mbsp-88 {
    margin-bottom: 88px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1023, app/assets/stylesheets/application.scss */
  .mbpc-89 {
    margin-bottom: 89px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1028, app/assets/stylesheets/application.scss */
  .mbsp-89 {
    margin-bottom: 89px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1033, app/assets/stylesheets/application.scss */
  .mbpc-90 {
    margin-bottom: 90px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1038, app/assets/stylesheets/application.scss */
  .mbsp-90 {
    margin-bottom: 90px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1043, app/assets/stylesheets/application.scss */
  .mbpc-91 {
    margin-bottom: 91px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1048, app/assets/stylesheets/application.scss */
  .mbsp-91 {
    margin-bottom: 91px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1053, app/assets/stylesheets/application.scss */
  .mbpc-92 {
    margin-bottom: 92px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1058, app/assets/stylesheets/application.scss */
  .mbsp-92 {
    margin-bottom: 92px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1063, app/assets/stylesheets/application.scss */
  .mbpc-93 {
    margin-bottom: 93px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1068, app/assets/stylesheets/application.scss */
  .mbsp-93 {
    margin-bottom: 93px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1073, app/assets/stylesheets/application.scss */
  .mbpc-94 {
    margin-bottom: 94px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1078, app/assets/stylesheets/application.scss */
  .mbsp-94 {
    margin-bottom: 94px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1083, app/assets/stylesheets/application.scss */
  .mbpc-95 {
    margin-bottom: 95px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1088, app/assets/stylesheets/application.scss */
  .mbsp-95 {
    margin-bottom: 95px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1093, app/assets/stylesheets/application.scss */
  .mbpc-96 {
    margin-bottom: 96px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1098, app/assets/stylesheets/application.scss */
  .mbsp-96 {
    margin-bottom: 96px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1103, app/assets/stylesheets/application.scss */
  .mbpc-97 {
    margin-bottom: 97px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1108, app/assets/stylesheets/application.scss */
  .mbsp-97 {
    margin-bottom: 97px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1113, app/assets/stylesheets/application.scss */
  .mbpc-98 {
    margin-bottom: 98px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1118, app/assets/stylesheets/application.scss */
  .mbsp-98 {
    margin-bottom: 98px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1123, app/assets/stylesheets/application.scss */
  .mbpc-99 {
    margin-bottom: 99px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1128, app/assets/stylesheets/application.scss */
  .mbsp-99 {
    margin-bottom: 99px !important;
  }
}

@media screen and (min-width: 835px) {
  /* line 1133, app/assets/stylesheets/application.scss */
  .mbpc-100 {
    margin-bottom: 100px !important;
  }
}

@media screen and (max-width: 834px) {
  /* line 1138, app/assets/stylesheets/application.scss */
  .mbsp-100 {
    margin-bottom: 100px !important;
  }
}

/* ====================================================
reset style
==================================================== */
/* line 1145, app/assets/stylesheets/application.scss */
html {
  font-size: 10px;
  /* Base font size, change to 14px or 16px if needed */
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

/* line 1151, app/assets/stylesheets/application.scss */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
}

/* line 1156, app/assets/stylesheets/application.scss */
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* line 1161, app/assets/stylesheets/application.scss */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* line 1166, app/assets/stylesheets/application.scss */
fieldset, img {
  border: 0;
}

/* line 1170, app/assets/stylesheets/application.scss */
img {
  vertical-align: middle;
  max-width: 100%;
}

/* line 1175, app/assets/stylesheets/application.scss */
address, caption, cite, code, dfn, var {
  font-style: normal;
  font-weight: normal;
}

/* line 1180, app/assets/stylesheets/application.scss */
li {
  list-style: none;
}

/* line 1184, app/assets/stylesheets/application.scss */
caption, th {
  text-align: left;
}

/* line 1188, app/assets/stylesheets/application.scss */
h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

/* line 1193, app/assets/stylesheets/application.scss */
q:before, q:after {
  content: "";
}

/* line 1197, app/assets/stylesheets/application.scss */
abbr, acronym {
  border: 0;
  font-variant: normal;
}

/* line 1202, app/assets/stylesheets/application.scss */
sup {
  vertical-align: text-top;
}

/* line 1206, app/assets/stylesheets/application.scss */
sub {
  vertical-align: text-bottom;
}

/* line 1210, app/assets/stylesheets/application.scss */
input, textarea, button {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/*to enable resizing for IE*/
/* line 1221, app/assets/stylesheets/application.scss */
input, textarea, select {
  font-size: 100%;
}

/*because legend doesn't inherit in IE */
/* line 1226, app/assets/stylesheets/application.scss */
legend {
  color: #000;
}

/* line 1230, app/assets/stylesheets/application.scss */
del, ins {
  text-decoration: none;
}

/* line 1234, app/assets/stylesheets/application.scss */
main {
  display: block;
}

/* line 1238, app/assets/stylesheets/application.scss */
body {
  padding-top: 60px;
}

/* line 1242, app/assets/stylesheets/application.scss */
section {
  position: relative;
}

/* ====================================================
HTML
==================================================== */
/* line 1249, app/assets/stylesheets/application.scss */
html {
  font-size: 62.5%;
}

/* line 1253, app/assets/stylesheets/application.scss */
body {
  color: #000;
  font-family: "Noto Sans JP", "Meiryo", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", "MS Pゴシック", Arial, Helvetica, Verdana, sans-serif;
  font-weight: 400;
  font-size: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1;
  background: #fff;
}

/* line 1264, app/assets/stylesheets/application.scss */
a {
  display: inline-block;
  color: inherit;
  text-decoration: none;
  outline: none;
}

/* line 1271, app/assets/stylesheets/application.scss */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* ====================================================
Layout
==================================================== */
/* line 1279, app/assets/stylesheets/application.scss */
.wrapper {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  min-width: 1200px;
}

/* メインページの左余白をサイドバー分確保 */
/* line 1287, app/assets/stylesheets/application.scss */
.main-page {
  margin-left: 260px;
  width: calc(100% - 260px);
  transition: margin-left 0.3s, width 0.3s;
}

/* ログイン画面専用：main-pageのマージントップ調整 */
/* line 1293, app/assets/stylesheets/application.scss */
.main-page--login {
  margin-left: auto;
  margin-right: auto;
  margin-top: 100px;
  width: 100%;
  max-width: 640px;
}

/* line 1301, app/assets/stylesheets/application.scss */
.main-page--login .form-setting {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(0, 56, 118, 0.08);
  border: 1px solid #E2E8F0;
  padding: 40px 32px;
}

/* line 1309, app/assets/stylesheets/application.scss */
.main-page--login .inner {
  background: transparent;
  padding: 0;
}

/* line 1314, app/assets/stylesheets/application.scss */
.main-page--login .form-setting__list-dl {
  border-bottom: none;
  margin-bottom: 16px;
}

/* line 1319, app/assets/stylesheets/application.scss */
.main-page--login .form-setting__list-dt {
  width: 100%;
  background: transparent;
  color: var(--home-color-primary, #003876);
  padding: 0.6em 0;
  font-weight: 600;
  font-size: 1.6rem;
}

/* line 1328, app/assets/stylesheets/application.scss */
.main-page--login .form-setting__list-dd {
  width: 100%;
  padding: 0.4em 0;
}

/* line 1333, app/assets/stylesheets/application.scss */
.main-page--login .form-input {
  border: 1px solid #E2E8F0;
  border-radius: 8px;
  height: 48px;
  font-size: 1.6rem;
  transition: border-color 0.2s ease;
}

/* line 1341, app/assets/stylesheets/application.scss */
.main-page--login .form-input:focus {
  border-color: var(--home-color-primary, #003876);
  box-shadow: 0 0 0 3px rgba(0, 56, 118, 0.1);
}

/* line 1346, app/assets/stylesheets/application.scss */
.main-page--login a:hover,
.main-page--login a:focus-visible {
  color: var(--home-color-primary, #003876);
  text-decoration: underline;
}

/* line 1352, app/assets/stylesheets/application.scss */
.inner {
  width: 90%;
  margin: 0 auto;
  max-width: 1155px;
  background: #F8FAFC;
  padding: 42px 15px;
  border-radius: 12px;
}

/* line 1360, app/assets/stylesheets/application.scss */
.inner--lg {
  max-width: 1265px;
}

/* ====================================================
Breadcrumb
==================================================== */
/* line 1367, app/assets/stylesheets/application.scss */
.breadcrumb {
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 1.8rem;
  margin-bottom: 2em;
  background-color: white;
  padding-left: 20px;
  padding-top: 20px;
}

/* line 1375, app/assets/stylesheets/application.scss */
.breadcrumb a {
  text-decoration: underline;
  position: relative;
  margin-right: 2em;
}

/* line 1380, app/assets/stylesheets/application.scss */
.breadcrumb a:after {
  content: ">";
  position: absolute;
  top: 0;
  right: -1.5em;
}

/* ====================================================
Form Input
==================================================== */
/* line 1390, app/assets/stylesheets/application.scss */
.form-input {
  width: 100%;
  height: 40px;
  border: 1px solid #707070;
  border-radius: 5px;
  padding: 0 15px;
  outline: 0;
}

/* line 1399, app/assets/stylesheets/application.scss */
.pure-input input {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

/* line 1409, app/assets/stylesheets/application.scss */
.pure-input input[type=radio]:checked + label:before {
  -webkit-animation: borderscale 300ms ease-in;
  animation: borderscale 300ms ease-in;
}

/* line 1413, app/assets/stylesheets/application.scss */
.pure-input input[type=radio]:checked + label:after {
  -webkit-backface-visibility: hidden;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  opacity: 1;
}

/* line 1419, app/assets/stylesheets/application.scss */
.pure-input label {
  font-weight: 500;
  position: relative;
  padding: 0 0 0 2em;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media (any-hover: hover) {
  /* line 1434, app/assets/stylesheets/application.scss */
  .pure-input label {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 1438, app/assets/stylesheets/application.scss */
  .pure-input label:hover {
    opacity: 0.7;
  }
}

/* line 1442, app/assets/stylesheets/application.scss */
.pure-input label:before {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  content: "";
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  width: 1.25em;
  height: 1.25em;
  border: 1px solid #707070;
  text-align: center;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
  background: #FAFAFA;
  border-radius: 50%;
}

/* line 1461, app/assets/stylesheets/application.scss */
.pure-input label:after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 0.84em;
  height: 0.84em;
  border-radius: 50%;
  background: #707070;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0.25em;
  opacity: 0;
}

/* ====================================================
Control
==================================================== */
/* line 1480, app/assets/stylesheets/application.scss */
.c-fw--lt {
  font-weight: 300 !important;
}

/* line 1483, app/assets/stylesheets/application.scss */
.c-fw--rg {
  font-weight: 400 !important;
}

/* line 1486, app/assets/stylesheets/application.scss */
.c-fw--md {
  font-weight: 500 !important;
}

/* line 1489, app/assets/stylesheets/application.scss */
.c-fw--sbd {
  font-weight: 600 !important;
}

/* line 1492, app/assets/stylesheets/application.scss */
.c-fw--bd {
  font-weight: 700 !important;
}

/* line 1495, app/assets/stylesheets/application.scss */
.c-fw--bk {
  font-weight: 900 !important;
}

/* line 1499, app/assets/stylesheets/application.scss */
.c-tx--v {
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
}

@media screen and (min-width: 835px) {
  /* line 1505, app/assets/stylesheets/application.scss */
  .c-tx--v-pc {
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
  }
}

/* line 1512, app/assets/stylesheets/application.scss */
.c-al--c {
  text-align: center !important;
}

/* line 1515, app/assets/stylesheets/application.scss */
.c-al--r {
  text-align: right !important;
}

/* line 1518, app/assets/stylesheets/application.scss */
.c-al--l {
  text-align: left !important;
}

/* line 1522, app/assets/stylesheets/application.scss */
.c-val--md {
  vertical-align: middle;
}

/* line 1525, app/assets/stylesheets/application.scss */
.c-val--top {
  vertical-align: top;
}

/* ====================================================
Component
==================================================== */
/* line 1532, app/assets/stylesheets/application.scss */
.c-txt__01 {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2.0714285714;
}

@media screen and (max-width: 640px) {
  /* line 1538, app/assets/stylesheets/application.scss */
  .c-txt__01 {
    line-height: 1.8;
  }
}

/* line 1543, app/assets/stylesheets/application.scss */
.c-ttl__01 {
  font-size: 2.4rem;
  font-weight: 700;
  text-align: center;
  color: var(--home-color-primary, #003876);
  margin-bottom: 1.8em;
}

/* line 1550, app/assets/stylesheets/application.scss */
.c-ttl__02 {
  font-size: 2.4rem;
  line-height: 1.5;
  font-weight: 700;
  color: #174B7D;
  position: relative;
  padding-top: 0.8em;
  margin-bottom: 1.2em;
  text-align: center;
}

/* line 1560, app/assets/stylesheets/application.scss */
.c-ttl__02:before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 3.33em;
  height: 3px;
  background: #174B7D;
  top: 0;
  left: calc(50% - 45px);
}

/* line 1571, app/assets/stylesheets/application.scss */
.c-btn__01 {
  max-width: 400px;
  width: 40%;
  margin: 0 auto;
  height: 3em;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  border-radius: 10px;
  background: #484B4E;
  color: #fff;
  font-weight: 700;
  font-size: 2.2rem;
  margin: 0 auto;
  outline: 0;
  border: none;
  cursor: pointer;
}

@media (any-hover: hover) {
  /* line 1596, app/assets/stylesheets/application.scss */
  .c-btn__01 {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 1600, app/assets/stylesheets/application.scss */
  .c-btn__01:hover {
    opacity: 0.7;
  }
}

/* line 1604, app/assets/stylesheets/application.scss */
.c-btn__01--blue-dark {
  background: linear-gradient(135deg, #003876 0%, #0056b3 100%);
  box-shadow: 0 4px 12px rgba(0, 56, 118, 0.25);
  transition: all 0.3s ease;
}

/* line 1609, app/assets/stylesheets/application.scss */
.c-btn__01--blue-dark:hover {
  background: linear-gradient(135deg, #002855 0%, #003876 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 56, 118, 0.35);
  opacity: 1;
}

/* line 1615, app/assets/stylesheets/application.scss */
.c-btn__01--blue-dark:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(0, 56, 118, 0.2);
}

/* line 1620, app/assets/stylesheets/application.scss */
.c-btn__02 {
  background: #174B7D;
  color: #fff;
  font-size: 1.5rem;
  padding: 10px 18px;
  border: none;
  border-radius: 6px;
  font-weight: 500;
  cursor: pointer;
  text-align: center;
  float: right;
  margin-bottom: 10px;
  margin-top: 0;
  text-decoration: none;
  text-underline-offset: 0;
}

/* line 1636, app/assets/stylesheets/application.scss */
.c-btn__02:hover {
  background: #0d2e4e;
  color: #fff;
  opacity: 0.85;
  text-decoration: none;
}

/* line 1643, app/assets/stylesheets/application.scss */
.c-btn__03 {
  background: white;
  color: black;
  font-size: 1.5rem;
  padding: 10px 18px;
  border-radius: 5px;
  border: 1px solid black;
  font-weight: 500;
  cursor: pointer;
  text-align: center;
  margin-bottom: 10px;
  margin-top: 0;
  text-decoration: none;
  text-underline-offset: 0;
}

/* line 1658, app/assets/stylesheets/application.scss */
.c-btn__03:hover {
  background: #F5F5F5;
  opacity: 0.85;
  text-decoration: none;
}

/* line 1663, app/assets/stylesheets/application.scss */
.c-btn__03.active {
  background: #85e98d;
}

/* ====================================================
Utility
==================================================== */
@media screen and (max-width: 834px) {
  /* line 1671, app/assets/stylesheets/application.scss */
  .pc {
    display: none;
  }
}

@media screen and (min-width: 835px) {
  /* line 1677, app/assets/stylesheets/application.scss */
  .sp {
    display: none;
  }
}

@media screen and (max-width: 640px) {
  /* line 1683, app/assets/stylesheets/application.scss */
  .pc-sm {
    display: none;
  }
}

@media screen and (min-width: 641px) {
  /* line 1689, app/assets/stylesheets/application.scss */
  .sp-sm {
    display: none;
  }
}

/* line 1694, app/assets/stylesheets/application.scss */
.u-fn-hover {
  display: inline-block;
}

@media (any-hover: hover) {
  /* line 1698, app/assets/stylesheets/application.scss */
  .u-fn-hover {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 1702, app/assets/stylesheets/application.scss */
  .u-fn-hover:hover {
    opacity: 0.7;
  }
}

/* line 1707, app/assets/stylesheets/application.scss */
.u-pull--left {
  margin-left: calc((100vw - 100%) / 2 * -1);
}

/* line 1710, app/assets/stylesheets/application.scss */
.u-pull--right {
  margin-right: calc((100vw - 100%) / 2 * -1);
}

/* line 1714, app/assets/stylesheets/application.scss */
.u-img-of {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  font-family: "object-fit: cover; object-position: center", sans-serif;
}

/* line 1724, app/assets/stylesheets/application.scss */
.c-scroll-box {
  padding-bottom: 20px;
  overflow-x: scroll;
  overflow-y: hidden;
}

/* line 1729, app/assets/stylesheets/application.scss */
.c-scroll-box-y {
  padding-bottom: 20px;
  overflow-x: hidden;
  overflow-y: scroll;
}

@media screen and (max-width: 834px) {
  /* line 1735, app/assets/stylesheets/application.scss */
  .c-scroll-box-sp {
    padding-bottom: 20px;
    overflow-x: scroll;
    overflow-y: hidden;
  }
}

/* line 1742, app/assets/stylesheets/application.scss */
.js-u__scrollin {
  opacity: 0;
  -webkit-transform: translate(0, 70px);
  -ms-transform: translate(0, 70px);
  transform: translate(0, 70px);
}

/* line 1749, app/assets/stylesheets/application.scss */
.js-u__scrollin.is-visible {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ====================================================
Module
==================================================== */
/* ====================================================
Header
==================================================== */
/* line 1764, app/assets/stylesheets/application.scss */
.main-header {
  padding: 10px 20px;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #fff;
  border-bottom: 1px solid #707070;
  z-index: 10;
}

/* line 1775, app/assets/stylesheets/application.scss */
.main-header__inner {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
}

/* line 1786, app/assets/stylesheets/application.scss */
.main-header__logo {
  width: 70px;
}

/* line 1789, app/assets/stylesheets/application.scss */
.main-header__navGlobal {
  width: 150px;
}

/* line 1792, app/assets/stylesheets/application.scss */
.main-header__menu {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  gap: 0 10px;
}

/* line 1804, app/assets/stylesheets/application.scss */
.main-header__menu a {
  position: relative;
}

@media (any-hover: hover) {
  /* line 1808, app/assets/stylesheets/application.scss */
  .main-header__menu a {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 1812, app/assets/stylesheets/application.scss */
  .main-header__menu a:hover {
    opacity: 0.7;
  }
}

/* line 1816, app/assets/stylesheets/application.scss */
.main-header__menu .qty {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #E21C1C;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  color: #fff;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 1.4rem;
  line-height: 1;
  position: absolute;
  top: -5px;
  right: -5px;
}

/* line 1838, app/assets/stylesheets/application.scss */
.main-header__menu-item {
  width: calc(33.33% - 13.333px);
}

/* --- プロフィールメニュー --- */
/* line 1843, app/assets/stylesheets/application.scss */
.box-profile {
  position: absolute;
  top: 65px;
  right: 5px;
  min-width: 270px;
  max-width: 320px;
  border: none;
  background: #fff;
  padding: 20px 12px;
  border-radius: 18px;
  box-shadow: 0 8px 32px rgba(16, 31, 64, 0.16), 0 2px 8px rgba(100, 100, 100, 0.11);
  display: none;
  z-index: 100;
  font-family: 'Segoe UI', 'Noto Serif JP', Arial, sans-serif;
}

/* メニュー項目はリンク（<a>）と button_to が生成するログアウトボタンの2種類あるため、
   アイコン位置・余白・ホバーはまとめて定義してずれが再発しないようにする */
/* line 1861, app/assets/stylesheets/application.scss */
.box-profile__menu li a,
.box-profile__menu-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px 11px 10px;
  font-size: 1.7rem;
  color: #2c3550;
  border-radius: 8px;
  font-weight: 500;
  text-decoration: none;
  letter-spacing: 0.01em;
  white-space: nowrap;
  /* hover時に border を足すとレイアウトが動くため、基準状態から同じ太さを確保する */
  border: 1.5px solid transparent;
  transition: background 0.22s cubic-bezier(0.3, 0.9, 0.35, 1.15), color 0.18s, box-shadow 0.18s, border-color 0.18s, transform 0.15s;
  box-shadow: none;
  position: relative;
}

/* line 1886, app/assets/stylesheets/application.scss */
.box-profile__menu li a i,
.box-profile__menu-btn i {
  font-size: 1.35em;
  color: #5773c4;
  min-width: 22px;
  text-align: center;
  transition: color 0.18s;
}

/* line 1895, app/assets/stylesheets/application.scss */
.box-profile__menu li a:hover,
.box-profile__menu li a:focus,
.box-profile__menu-btn:hover,
.box-profile__menu-btn:focus {
  background: linear-gradient(90deg, #e7edfa 70%, #e1eafb 100%);
  color: #174B7D;
  transform: translateY(-2px) scale(1.035);
  box-shadow: 0 3px 14px rgba(30, 80, 190, 0.07);
  outline: none;
  border-color: #d5e1fa;
}

/* line 1907, app/assets/stylesheets/application.scss */
.box-profile__menu li a:hover i,
.box-profile__menu li a:focus i,
.box-profile__menu-btn:hover i,
.box-profile__menu-btn:focus i {
  color: #3861e8;
}

/* line 1914, app/assets/stylesheets/application.scss */
.box-profile__menu li a:active,
.box-profile__menu-btn:active {
  background: #dae3f2;
  transform: scale(0.98);
}

/* ログアウトボタン: button_to が生成する <form><button> をリンク項目と同じ見た目に
   揃えるための、ボタン要素固有のリセット（Issue #1368 / ログアウト404対策） */
/* line 1922, app/assets/stylesheets/application.scss */
.box-profile__menu form.button_to {
  margin: 0;
  width: 100%;
}

/* line 1927, app/assets/stylesheets/application.scss */
.box-profile__menu-btn {
  width: 100%;
  background: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
}

/* line 1935, app/assets/stylesheets/application.scss */
.profile-avatar-initial {
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e2d6dc;
  color: #444;
  border-radius: 50%;
  font-size: 2.2rem;
  font-weight: 700;
  font-family: 'Noto Serif JP', 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.05em;
  user-select: none;
  box-shadow: 0 1px 4px rgba(60, 40, 50, 0.06);
  transition: box-shadow 0.15s;
}

/* line 1952, app/assets/stylesheets/application.scss */
.main-header__menu-item .main-header__link:hover {
  background: #e1eafb;
  /* 明るいブルー系背景 */
  color: #174B7D;
  /* 文字色をブランドカラー */
  text-decoration: none;
  box-shadow: 0 4px 18px rgba(30, 80, 190, 0.13);
  transition: all 0.17s cubic-bezier(0.42, 0.13, 0.33, 0.95);
  cursor: pointer;
  transform: scale(1.08);
  /* 少し拡大 */
}

@media screen and (max-width: 600px) {
  /* line 1963, app/assets/stylesheets/application.scss */
  .profile-avatar-initial {
    width: 40px;
    height: 40px;
    font-size: 1.7rem;
  }
}

/* ドロップダウンアニメ用 */
/* line 1971, app/assets/stylesheets/application.scss */
.box-profile.is-open {
  display: block;
}

@media screen and (max-width: 600px) {
  /* line 1974, app/assets/stylesheets/application.scss */
  .box-profile {
    right: 2vw;
    min-width: unset;
    max-width: 96vw;
    padding: 14px 8px 10px 8px;
  }
  /* line 1980, app/assets/stylesheets/application.scss */
  .box-profile__menu li a,
.box-profile__menu-btn {
    font-size: 1.08rem;
  }
}

/* line 1984, app/assets/stylesheets/application.scss */
.box-notification {
  position: absolute;
  top: 65px;
  right: 70px;
  border: 1px solid #707070;
  background: #fff;
  padding: 30px;
  width: 620px;
  height: calc(96vh - 72px);
  display: none;
  border-radius: 5px;
}

/* line 1996, app/assets/stylesheets/application.scss */
.box-notification.is-open {
  display: block;
}

/* line 1999, app/assets/stylesheets/application.scss */
.box-notification__ttl {
  display: block;
  font-size: 2.4rem;
  font-weight: 700;
  text-align: center;
  color: #707070;
  padding-bottom: 1em;
  border-bottom: 1px solid #707070;
}

/* line 2008, app/assets/stylesheets/application.scss */
.box-notification__list {
  height: calc(100% - 48px);
  overflow-y: auto;
}

/* line 2012, app/assets/stylesheets/application.scss */
.box-notification__list li {
  padding: 1em 0;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.6666666667;
  border-bottom: 1px solid #707070;
}

/* ====================================================
Pages
==================================================== */
/* line 2023, app/assets/stylesheets/application.scss */
.top-notice {
  padding-bottom: 67px;
}

/* line 2026, app/assets/stylesheets/application.scss */
.top-notice__inner {
  max-width: 1287px;
  margin: 0 auto;
}

/* line 2030, app/assets/stylesheets/application.scss */
.top-notice__ttl {
  text-align: center;
  font-size: 2.4rem;
  line-height: 1.65;
  font-weight: 700;
  margin-bottom: 2em;
}

/* line 2037, app/assets/stylesheets/application.scss */
.top-notice__list {
  margin-bottom: 35px;
}

/* line 2040, app/assets/stylesheets/application.scss */
.top-notice__list-item {
  border-top: 1px dashed #707070;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.5555555556;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 30px 0;
}

/* line 2052, app/assets/stylesheets/application.scss */
.top-notice__list-date {
  font-weight: 700;
  width: 140px;
}

/* line 2056, app/assets/stylesheets/application.scss */
.top-notice__list-link {
  width: calc(100% - 140px);
  text-decoration: underline;
}

@media (any-hover: hover) {
  /* line 2061, app/assets/stylesheets/application.scss */
  .top-notice__list-link {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 2065, app/assets/stylesheets/application.scss */
  .top-notice__list-link:hover {
    opacity: 0.7;
  }
}

/* line 2069, app/assets/stylesheets/application.scss */
.top-notice__btn {
  max-width: 6.5em;
  font-size: 1.8rem;
  font-weight: 700;
  margin-left: auto;
  margin-right: 0;
  color: #174B7D;
  display: block;
  position: relative;
}

@media (any-hover: hover) {
  /* line 2080, app/assets/stylesheets/application.scss */
  .top-notice__btn {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 2084, app/assets/stylesheets/application.scss */
  .top-notice__btn:hover {
    opacity: 0.7;
  }
}

/* line 2088, app/assets/stylesheets/application.scss */
.top-notice__btn:after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 1em;
  height: 1em;
  background: url(/../img/common/arr-right.png) no-repeat center/100%;
  top: 0;
  right: 0;
}

/* line 2098, app/assets/stylesheets/application.scss */
.top-notice__intro {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.7777777778;
  margin-bottom: 40px;
}

/* line 2104, app/assets/stylesheets/application.scss */
.top-notice__service {
  background: #F5F5F5;
  padding: 60px;
}

/* line 2109, app/assets/stylesheets/application.scss */
.top-service {
  padding-bottom: 50px;
}

/* line 2112, app/assets/stylesheets/application.scss */
.top-service__inner {
  max-width: 1287px;
  margin: 0 auto;
}

/* line 2116, app/assets/stylesheets/application.scss */
.top-service__intro {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.7777777778;
  margin-bottom: 1.25em;
}

/* line 2122, app/assets/stylesheets/application.scss */
.top-service__list {
  background: #F5F5F5;
  padding: 30px;
}

/* line 2126, app/assets/stylesheets/application.scss */
.top-service__list-dl {
  margin-bottom: 50px;
}

/* line 2129, app/assets/stylesheets/application.scss */
.top-service__list-dl:last-of-type {
  margin-bottom: 0;
}

/* line 2132, app/assets/stylesheets/application.scss */
.top-service__list-dt {
  font-size: 2.6rem;
  font-weight: 700;
  background: #174B7D;
  color: #fff;
  padding: 0.5em 0.8em;
  margin-bottom: 0.6em;
}

/* line 2140, app/assets/stylesheets/application.scss */
.top-service__list-dt span {
  font-size: 70%;
  margin-left: 10px;
}

/* line 2144, app/assets/stylesheets/application.scss */
.top-service__list-dd {
  font-size: 1.8rem;
  line-height: 1.65;
}

/* line 2149, app/assets/stylesheets/application.scss */
.company-setting__ttlsub {
  margin-bottom: 28px;
}

/* line 2152, app/assets/stylesheets/application.scss */
.company-setting__list {
  max-width: 942px;
  margin: 0 auto 57px;
}

/* line 2156, app/assets/stylesheets/application.scss */
.company-setting__list--second {
  margin-bottom: 48px;
}

/* line 2159, app/assets/stylesheets/application.scss */
.company-setting__list-dl {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  font-size: 1.8rem;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
}

/* line 2169, app/assets/stylesheets/application.scss */
.company-setting__list-dl:first-child {
  border-top: 1px solid #fff;
}

/* line 2172, app/assets/stylesheets/application.scss */
.company-setting__list-dl dt {
  font-weight: normal;
}

/* line 2175, app/assets/stylesheets/application.scss */
.company-setting__list-dt {
  width: 300px;
  color: #fff;
  background: #174B7D;
  padding: 1.24em 1em;
  position: relative;
}

/* line 2182, app/assets/stylesheets/application.scss */
.company-setting__list-dd {
  font-family: "Segoe UI", Arial, sans-serif;
  width: calc(100% - 300px);
  /* color: #817D7D; */
  padding: 1.24em 2em;
}

@media (any-hover: hover) {
  /* line 2189, app/assets/stylesheets/application.scss */
  .company-setting__list-dd a {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 2193, app/assets/stylesheets/application.scss */
  .company-setting__list-dd a:hover {
    opacity: 0.7;
  }
}

/* line 2198, app/assets/stylesheets/application.scss */
.form-setting__ttlsub {
  margin-bottom: 28px;
}

/* line 2201, app/assets/stylesheets/application.scss */
.form-setting__list {
  max-width: 942px;
  margin: 0 auto 67px;
}

/* line 2205, app/assets/stylesheets/application.scss */
.form-setting__list--second {
  margin-bottom: 48px;
}

/* line 2208, app/assets/stylesheets/application.scss */
.form-setting__list-dl {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  font-size: 1.8rem;
  border-bottom: 1px solid #fff;
}

/* line 2217, app/assets/stylesheets/application.scss */
.form-setting__list-dt {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  width: 300px;
  color: #fff;
  background: var(--home-color-primary, #003876);
  padding: 1.24em 1em;
  position: relative;
  font-weight: normal;
}

/* line 2234, app/assets/stylesheets/application.scss */
.form-setting__list-dt .required, .company-setting__list-dt .required {
  width: 3.4em;
  height: 1.8em;
  background: #C60F0F;
  border-radius: 5px;
  position: absolute;
  top: calc(50% - 15px);
  right: 20px;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  font-size: 80%;
  font-weight: bold;
}

/* line 2254, app/assets/stylesheets/application.scss */
.required-label {
  width: 3.4em;
  height: 1.8em;
  background: #C60F0F;
  border-radius: 5px;
  margin-right: 140px;
  margin-left: auto;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  font-size: 80%;
  font-weight: bold;
  color: white;
}

/* line 2274, app/assets/stylesheets/application.scss */
.form-setting__list-dd {
  font-family: "Segoe UI", Arial, sans-serif;
  width: calc(100% - 300px);
  /* color: #817D7D; */
  padding: 1.24em 2em;
}

@media (any-hover: hover) {
  /* line 2281, app/assets/stylesheets/application.scss */
  .form-setting__list-dd a {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 2285, app/assets/stylesheets/application.scss */
  .form-setting__list-dd a:hover {
    opacity: 0.7;
  }
}

/* line 2289, app/assets/stylesheets/application.scss */
.form-setting__list-dd .pref {
  width: 161px;
  height: 40px;
  border: 1px solid #707070;
  border-radius: 5px;
  background: #fff url(/../img/common/ico-arrdown.png) no-repeat center right 5px/15px 13px;
  padding: 0 15px;
}

/* line 2297, app/assets/stylesheets/application.scss */
.form-setting__list-dd--has-note {
  padding-top: 20px;
  padding-bottom: 10px;
}

/* line 2301, app/assets/stylesheets/application.scss */
.form-setting__list-add {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/* line 2311, app/assets/stylesheets/application.scss */
.form-setting__list-add .form-control {
  width: 121px;
}

/* line 2314, app/assets/stylesheets/application.scss */
.form-setting__list-add .form-control:nth-child(3) {
  width: 140px;
}

/* line 2317, app/assets/stylesheets/application.scss */
.form-setting__list-add span {
  margin: 0 6px;
}

/* line 2320, app/assets/stylesheets/application.scss */
.form-setting__list-add .btn-zip {
  width: 6em;
  height: 40px;
  cursor: pointer;
  border: none;
  outline: 0;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 1.8rem;
  color: #fff;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  background: #707070;
  border-radius: 5px;
  margin-left: 1em;
  font-weight: normal;
}

@media (any-hover: hover) {
  /* line 2344, app/assets/stylesheets/application.scss */
  .form-setting__list-add .btn-zip {
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  /* line 2348, app/assets/stylesheets/application.scss */
  .form-setting__list-add .btn-zip:hover {
    opacity: 0.7;
  }
}

/* line 2352, app/assets/stylesheets/application.scss */
.form-setting__list-note {
  display: block;
  margin-top: 0.5em;
  font-size: 80%;
}

/* line 2357, app/assets/stylesheets/application.scss */
.form-setting__input-group {
  position: relative;
}

/* line 2360, app/assets/stylesheets/application.scss */
.form-setting__input-group label {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
}

/* line 2367, app/assets/stylesheets/application.scss */
.service-setting .inner {
  padding-top: 10px;
  padding-left: 55px;
  padding-right: 66px;
  margin-bottom: 25px;
}

/* line 2373, app/assets/stylesheets/application.scss */
.service-setting__ttl {
  margin-bottom: 28px;
  color: var(--home-color-primary, #003876);
}

/* line 2377, app/assets/stylesheets/application.scss */
.service-setting__billing-info {
  font-size: 1.8rem;
  margin-bottom: 20px;
  padding-left: 60px;
  padding-right: 0;
}

/* line 2383, app/assets/stylesheets/application.scss */
.service-setting__billing-info-note {
  margin-top: -47px;
}

/* line 2386, app/assets/stylesheets/application.scss */
.service-setting__box {
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.5;
  margin-bottom: 3.65em;
}

/* line 2392, app/assets/stylesheets/application.scss */
.service-setting__box:last-of-type {
  margin-bottom: 0;
}

/* line 2395, app/assets/stylesheets/application.scss */
.service-setting__box-heading {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 15px;
}

/* line 2406, app/assets/stylesheets/application.scss */
.service-setting__box-left {
  width: 38.34%;
}

/* line 2409, app/assets/stylesheets/application.scss */
.service-setting__box-left p {
  border: 1px solid #707070;
  background: #fff;
  text-align: center;
  padding: 2em 0;
  margin-bottom: 1em;
}

/* line 2416, app/assets/stylesheets/application.scss */
.service-setting__box-list span {
  font-size: 110%;
}

/* line 2419, app/assets/stylesheets/application.scss */
.service-setting__box-desc {
  width: 58%;
}

/* line 2422, app/assets/stylesheets/application.scss */
.service-setting__box-main {
  margin-bottom: 25px;
}

/* line 2426, app/assets/stylesheets/application.scss */
.invoices-page__inner {
  max-width: 1155px;
  margin: 0 auto;
}

/* line 2430, app/assets/stylesheets/application.scss */
.invoices-page__inner--lg {
  max-width: 1360px;
}

/* line 2433, app/assets/stylesheets/application.scss */
.invoices-page__txt {
  font-size: 2.2rem;
  font-family: "Segoe UI", Arial, sans-serif;
  margin-bottom: 1em;
}

/* line 2438, app/assets/stylesheets/application.scss */
.invoices-page__wp {
  background: #F5F5F5;
  padding: 5%;
  margin-bottom: 50px;
}

/* line 2443, app/assets/stylesheets/application.scss */
.invoices-page__table {
  margin-bottom: 27px;
}

/* line 2446, app/assets/stylesheets/application.scss */
.invoices-page__table table {
  width: 100%;
  font-size: 1.8rem;
  border: 1px solid #fff;
}

/* line 2451, app/assets/stylesheets/application.scss */
.invoices-page__table table tr th, .invoices-page__table table tr td {
  border-bottom: 1px solid #fff;
}

/* line 2454, app/assets/stylesheets/application.scss */
.invoices-page__table table tr th {
  width: 300px;
  padding: 1em 0.5em;
  background: #174B7D;
  color: #fff;
}

/* line 2460, app/assets/stylesheets/application.scss */
.invoices-page__table table tr td {
  width: calc(100% - 300px);
  padding: 1.25em 1.8em;
  position: relative;
  /* color: #817D7D; */
}

/* line 2466, app/assets/stylesheets/application.scss */
.invoices-page__table table tr td a {
  font-size: 90%;
  position: absolute;
  text-decoration: underline;
  right: 15px;
  color: #000;
}

/* line 2473, app/assets/stylesheets/application.scss */
.invoices-page__note {
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.5;
  margin-bottom: 2em;
}

/* line 2480, app/assets/stylesheets/application.scss */
.table-container table {
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.5;
  width: 100%;
}

/* line 2487, app/assets/stylesheets/application.scss */
.table-container table tr th, .table-container table tr td {
  border-bottom: 1px solid #E5E5E5;
  padding: 1em 0.5em;
  font-weight: normal;
}

/* line 2492, app/assets/stylesheets/application.scss */
.table-container table tr th {
  background: #F5F5F5;
}

/* line 2495, app/assets/stylesheets/application.scss */
.table-container table tr td a {
  text-decoration: underline;
}

/* line 2498, app/assets/stylesheets/application.scss */
.ecc-table {
  width: 100%;
  border-collapse: collapse;
}

/* line 2503, app/assets/stylesheets/application.scss */
.ecc-table th,
.ecc-table td {
  padding: 12px;
  text-align: left;
  border-bottom: 1px solid #e0e0e0;
}

/* line 2510, app/assets/stylesheets/application.scss */
.ecc-table th {
  background-color: #e8f0fe;
  color: var(--home-color-primary, #003876);
  font-weight: 600;
}

/* line 2516, app/assets/stylesheets/application.scss */
.ecc-btn--show {
  color: #333;
  background-color: transparent;
  border: none;
}

/* line 2522, app/assets/stylesheets/application.scss */
.ecc-btn--download {
  color: #333;
  background-color: transparent;
  border: none;
}

/* line 2528, app/assets/stylesheets/application.scss */
.ecc-btn--delete {
  color: #dc3545;
  background-color: transparent;
  border: none;
  text-decoration: none;
}

/* line 2535, app/assets/stylesheets/application.scss */
.ecc-btn--delete:hover {
  color: #bd2130;
}

/* line 2539, app/assets/stylesheets/application.scss */
.payment-page .inner {
  padding: 70px 32px;
}

/* line 2542, app/assets/stylesheets/application.scss */
.payment-page__dl {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  font-size: 1.8rem;
  background: #174B7D;
  border-bottom: 1px solid #fff;
}

/* line 2555, app/assets/stylesheets/application.scss */
.payment-page__dl:first-child {
  margin-bottom: 1.42em;
  border: 1px solid #fff;
}

/* line 2559, app/assets/stylesheets/application.scss */
.payment-page__dt {
  width: 300px;
  color: #fff;
  height: 100%;
  padding: 0.535em 0.75em;
}

/* line 2565, app/assets/stylesheets/application.scss */
.payment-page__dd {
  width: calc(100% - 300px);
  background: #f5f5f5;
  padding: 1em;
}

/* line 2570, app/assets/stylesheets/application.scss */
.payment-page__dd--method .pure-input {
  font-family: "Segoe UI", Arial, sans-serif;
  margin-bottom: 1.4em;
  line-height: 1.2;
}

/* line 2575, app/assets/stylesheets/application.scss */
.payment-page__dd--method .pure-input:last-of-type {
  margin-bottom: 0;
}

/* line 2578, app/assets/stylesheets/application.scss */
.payment-page__dd--date .form-control {
  width: 102px;
  text-align: right;
}

/* line 2582, app/assets/stylesheets/application.scss */
.payment-page__img {
  max-width: 663px;
  margin: 0 auto 30px;
}

/* line 2586, app/assets/stylesheets/application.scss */
.payment-page__note {
  padding: 22px 0 36px;
  max-width: 897px;
  margin: 0 auto;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.7777777778;
}

/* line 2594, app/assets/stylesheets/application.scss */
.mx-auto {
  margin: auto !important;
}

/* line 2597, app/assets/stylesheets/application.scss */
.system-rule {
  margin: auto;
  padding: 30px 0;
  font-weight: bold;
  text-align: center;
}

/* line 2603, app/assets/stylesheets/application.scss */
.ecc-alert {
  font-size: 1.6rem;
  line-height: 1.5;
  margin-bottom: 0;
}

/* line 2608, app/assets/stylesheets/application.scss */
.ecc-alert .close {
  font-size: 3.2rem;
  /* bigger x icon */
  line-height: 1;
  padding: 0.6rem 2.5rem 0.6rem 2.5rem;
  /* keep hit area wide */
  opacity: 0.8;
}

/* line 2614, app/assets/stylesheets/application.scss */
.ecc-alert .close:hover,
.ecc-alert .close:focus {
  opacity: 1;
  text-decoration: none;
  outline: none;
}

/* line 2620, app/assets/stylesheets/application.scss */
.ecc-font-size {
  font-size: 1.8rem;
}

/* line 2623, app/assets/stylesheets/application.scss */
body {
  font-size: 1.8rem;
}

/* line 2626, app/assets/stylesheets/application.scss */
.service-description {
  width: 70%;
  margin: 0 auto;
}

/* Service Setting Start */
/* line 2632, app/assets/stylesheets/application.scss */
.service-container {
  background: linear-gradient(135deg, #f5f7fa 0%, #fafbfc 100%);
  padding: 40px;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* line 2638, app/assets/stylesheets/application.scss */
.service-intro {
  margin-bottom: 30px;
  font-size: 1.4rem;
  color: #555555;
  font-weight: 500;
}

/* line 2644, app/assets/stylesheets/application.scss */
.service-list {
  list-style: none;
  margin-left: 40px;
  margin-bottom: 40px;
}

/* line 2649, app/assets/stylesheets/application.scss */
.service-list li {
  margin-bottom: 15px;
}

/* line 2652, app/assets/stylesheets/application.scss */
.font-weight-bold {
  font-weight: bold;
}

/* line 2655, app/assets/stylesheets/application.scss */
.service-info-box {
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  padding: 24px;
  margin-bottom: 40px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

/* line 2664, app/assets/stylesheets/application.scss */
.service-info-box:hover {
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}

/* line 2668, app/assets/stylesheets/application.scss */
.service-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
}

/* line 2673, app/assets/stylesheets/application.scss */
.info-heading {
  margin-bottom: 20px;
  color: #174B7D;
  font-weight: 700;
  font-size: 1.1rem;
  letter-spacing: 0.02em;
}

/* line 2680, app/assets/stylesheets/application.scss */
.info-content {
  line-height: 1.8;
}

/* line 2683, app/assets/stylesheets/application.scss */
.confirmation-text {
  margin-bottom: 20px;
  font-size: 1.4rem;
  color: #333333;
  font-weight: 500;
}

/* Service Setting Responsive */
@media screen and (max-width: 834px) {
  /* line 2692, app/assets/stylesheets/application.scss */
  .service-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  /* line 2696, app/assets/stylesheets/application.scss */
  .service-container {
    padding: 30px 20px;
  }
  /* line 2699, app/assets/stylesheets/application.scss */
  .c-btn__01 {
    width: 60%;
    font-size: 2rem;
  }
}

@media screen and (max-width: 640px) {
  /* line 2706, app/assets/stylesheets/application.scss */
  .service-container {
    padding: 20px 15px;
    border-radius: 8px;
  }
  /* line 2710, app/assets/stylesheets/application.scss */
  .service-info-box {
    padding: 16px;
    border-radius: 8px;
  }
  /* line 2714, app/assets/stylesheets/application.scss */
  .service-grid {
    gap: 20px;
  }
  /* line 2717, app/assets/stylesheets/application.scss */
  .info-heading {
    font-size: 1rem;
  }
  /* line 2720, app/assets/stylesheets/application.scss */
  .c-btn__01 {
    width: 80%;
    font-size: 1.8rem;
    height: 2.5em;
  }
}

/* Service Setting End */
/* Usage Records Styling */
/* line 2729, app/assets/stylesheets/application.scss */
.usage-cards {
  display: flex;
  flex-direction: column;
  gap: 16px;
  /* align-items: center; */
  justify-content: left;
  width: 70%;
  margin: 0 auto;
  margin-top: 32px;
}

/* line 2740, app/assets/stylesheets/application.scss */
.usage-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 370px;
  background: #f5f5f5;
  border: 1px solid #cccccc;
  border-radius: 8px;
  padding: 16px 32px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
  font-size: 1.8rem;
}

/* line 2753, app/assets/stylesheets/application.scss */
.usage-card__label {
  color: #333;
  font-weight: 500;
}

/* line 2758, app/assets/stylesheets/application.scss */
.usage-card__value {
  display: flex;
  align-items: baseline;
  gap: 4px;
}

/* line 2764, app/assets/stylesheets/application.scss */
.usage-records__count {
  font-size: 2.2rem;
  font-weight: 700;
  color: #174B7D;
}

/* line 2770, app/assets/stylesheets/application.scss */
.usage-records__unit {
  font-size: 1.6rem;
  font-weight: 600;
  color: #174B7D;
}

/* Service Links Styling */
/* line 2777, app/assets/stylesheets/application.scss */
.service-links {
  margin-top: 30px;
  width: 100%;
}

/* line 2782, app/assets/stylesheets/application.scss */
.setup-links {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

/* line 2788, app/assets/stylesheets/application.scss */
.setup-link {
  display: block;
  background: #fff;
  border: 1px solid #cccccc;
  border-radius: 10px;
  padding: 15px 20px;
  text-decoration: none;
  color: #333;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

/* line 2799, app/assets/stylesheets/application.scss */
.setup-link:hover {
  text-decoration: none;
  color: #333;
  transform: translateY(-2px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  background-color: #f8f9fa;
}

/* line 2807, app/assets/stylesheets/application.scss */
.setup-link span {
  color: #333;
  text-decoration: underline;
  text-underline-offset: 5px;
}

/* line 2813, app/assets/stylesheets/application.scss */
.service-links {
  width: 70%;
  margin: 0 auto;
  padding: 0;
}

/* Service Links Styling End */
/* line 2820, app/assets/stylesheets/application.scss */
.billing-info-block {
  width: 90%;
  max-width: 1155px;
  margin: 0 auto 0 auto;
}

/* line 2826, app/assets/stylesheets/application.scss */
.flash-messages {
  position: fixed;
  top: 60px;
  /* ←ヘッダー高さに合わせて */
  left: 0;
  width: 100vw;
  z-index: 99999;
  /* 全レイヤーで最前面 */
  pointer-events: none;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 0;
}

/* line 2839, app/assets/stylesheets/application.scss */
.flash-messages .alert {
  width: 100vw;
  max-width: none;
  margin: 0;
  border-radius: 0 0 7px 7px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.11);
  font-size: 1.8rem;
  text-align: center;
  border-width: 0 0 2px 0;
  pointer-events: auto;
}

@media (max-width: 640px) {
  /* line 2852, app/assets/stylesheets/application.scss */
  .flash-messages, .flash-messages .alert {
    font-size: 1.4rem;
    top: 49px;
    /* モバイルヘッダーにあわせて微調整 */
  }
}

/* line 2857, app/assets/stylesheets/application.scss */
.setup-link--status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1em 1.5em;
  border: 1px solid #ddd;
  border-radius: 8px;
  margin-bottom: 0.85em;
  background: #fff;
  text-decoration: none;
  color: inherit;
  font-size: 1.1em;
  transition: box-shadow 0.2s;
}

/* line 2872, app/assets/stylesheets/application.scss */
.setup-link--status:hover {
  box-shadow: 0 2px 8px rgba(71, 205, 137, 0.12);
}

/* line 2876, app/assets/stylesheets/application.scss */
.setup-check {
  display: flex;
  align-items: center;
  margin-left: 1.2em;
}

/* line 2882, app/assets/stylesheets/application.scss */
.setup-check-icon {
  display: block;
  width: 26px;
  height: 26px;
  /* 軽いドロップシャドウで“映え”感UP */
  filter: drop-shadow(0 1px 2px rgba(71, 205, 137, 0.25));
}

/* line 2890, app/assets/stylesheets/application.scss */
.scroll-content {
  padding: 20px 10px;
}

/* line 2894, app/assets/stylesheets/application.scss */
.service-setting__box_border {
  border: #dc3545 1px solid;
  padding: 10px;
  border-radius: 7px;
  background-color: #FDECEA;
}

/* ===== Flash Alert Color Overrides (must be after Bootstrap) ===== */
/* (removed overrides to rely on Bootstrap defaults) */
/* ===== Admin Users Modern Design ===== */
/* Admin Users Modern Design Styles */
/* Admin Users Page Container */
/* line 4, app/assets/stylesheets/admin_users.css */
.admin-users-page {
  min-height: calc(100vh - 120px);
  padding: 40px 20px;
  background: linear-gradient(135deg, #f5f7fa 0%, #fafbfc 100%);
}

/* line 10, app/assets/stylesheets/admin_users.css */
.admin-users-page__container {
  max-width: 1200px;
  margin: 0 auto;
}

/* Page Header */
/* line 16, app/assets/stylesheets/admin_users.css */
.admin-users-header {
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  border-radius: 16px;
  padding: 3.2rem 3.6rem;
  margin-bottom: 3.2rem;
  box-shadow: 0 4px 16px rgba(23, 75, 125, 0.15);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* line 27, app/assets/stylesheets/admin_users.css */
.admin-users-header__title {
  font-size: 3rem;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 1.2rem;
}

/* line 37, app/assets/stylesheets/admin_users.css */
.admin-users-header__title::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 3.6rem;
  background: #47cd89;
  border-radius: 2px;
}

/* line 46, app/assets/stylesheets/admin_users.css */
.admin-users-header__btn {
  background: #ffffff;
  color: #174B7D;
  font-size: 1.6rem;
  font-weight: 600;
  padding: 1.2rem 2.4rem;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
}

/* line 63, app/assets/stylesheets/admin_users.css */
.admin-users-header__btn:hover {
  background: #47cd89;
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(71, 205, 137, 0.3);
  text-decoration: none;
}

/* line 71, app/assets/stylesheets/admin_users.css */
.admin-users-header__btn::before {
  content: '+';
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
}

/* Modern Table Container */
/* line 79, app/assets/stylesheets/admin_users.css */
.admin-users-table-container {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 2px 12px rgba(23, 75, 125, 0.08);
  overflow: hidden;
}

/* Enhanced Table Styles */
/* line 87, app/assets/stylesheets/admin_users.css */
.admin-users-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.5rem;
}

/* line 93, app/assets/stylesheets/admin_users.css */
.admin-users-table thead {
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f0fe 100%);
}

/* line 97, app/assets/stylesheets/admin_users.css */
.admin-users-table th {
  padding: 1.8rem 2rem;
  text-align: left;
  font-weight: 600;
  color: #174B7D;
  font-size: 1.6rem;
  border-bottom: 2px solid #174B7D;
}

/* line 106, app/assets/stylesheets/admin_users.css */
.admin-users-table tbody tr {
  border-bottom: 1px solid #e8eef5;
  transition: all 0.3s ease;
}

/* line 111, app/assets/stylesheets/admin_users.css */
.admin-users-table tbody tr:hover {
  background: linear-gradient(90deg, #f8fbff 0%, #ffffff 100%);
  transform: translateX(4px);
  box-shadow: -4px 0 0 0 #47cd89;
}

/* line 117, app/assets/stylesheets/admin_users.css */
.admin-users-table td {
  padding: 1.6rem 2rem;
  color: #333;
  vertical-align: middle;
}

/* line 123, app/assets/stylesheets/admin_users.css */
.admin-users-table td:first-child {
  font-weight: 600;
  color: #174B7D;
}

/* Action Buttons Container */
/* line 129, app/assets/stylesheets/admin_users.css */
.admin-users-actions {
  display: flex;
  gap: 0.8rem;
  align-items: center;
}

/* Modern Action Buttons */
/* line 136, app/assets/stylesheets/admin_users.css */
.admin-users-btn {
  padding: 0.8rem 1.6rem;
  border-radius: 6px;
  font-size: 1.4rem;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  border: none;
  cursor: pointer;
}

/* line 151, app/assets/stylesheets/admin_users.css */
.admin-users-btn--edit {
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  color: #ffffff;
  box-shadow: 0 2px 6px rgba(23, 75, 125, 0.2);
}

/* line 157, app/assets/stylesheets/admin_users.css */
.admin-users-btn--edit:hover {
  background: linear-gradient(135deg, #0d2e4e 0%, #174B7D 100%);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.3);
  color: #ffffff;
  text-decoration: none;
}

/* line 165, app/assets/stylesheets/admin_users.css */
.admin-users-btn--delete {
  background: #ffffff;
  color: #dc3545;
  border: 2px solid #dc3545;
  padding: 0.6rem 1.2rem;
}

/* line 172, app/assets/stylesheets/admin_users.css */
.admin-users-btn--delete:hover {
  background: #dc3545;
  color: #ffffff;
  transform: scale(1.05);
  box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
}

/* line 179, app/assets/stylesheets/admin_users.css */
.admin-users-btn--delete i {
  font-size: 1.6rem;
}

/* Form Page Styles */
/* line 184, app/assets/stylesheets/admin_users.css */
.admin-users-form-page {
  min-height: calc(100vh - 120px);
  padding: 40px 20px;
  background: linear-gradient(135deg, #f5f7fa 0%, #fafbfc 100%);
}

/* line 190, app/assets/stylesheets/admin_users.css */
.admin-users-form-container {
  max-width: 900px;
  margin: 0 auto;
}

/* line 195, app/assets/stylesheets/admin_users.css */
.admin-users-form-header {
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  border-radius: 16px 16px 0 0;
  padding: 3rem 3.6rem;
  margin-bottom: 0;
}

/* line 202, app/assets/stylesheets/admin_users.css */
.admin-users-form-header__title {
  font-size: 2.8rem;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 1.2rem;
}

/* line 212, app/assets/stylesheets/admin_users.css */
.admin-users-form-header__title::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 3.2rem;
  background: #47cd89;
  border-radius: 2px;
}

/* Form Content Card */
/* line 222, app/assets/stylesheets/admin_users.css */
.admin-users-form-card {
  background: #ffffff;
  border-radius: 0 0 16px 16px;
  box-shadow: 0 4px 16px rgba(23, 75, 125, 0.1);
  padding: 4rem 3.6rem;
}

/* Enhanced Error Messages */
/* line 230, app/assets/stylesheets/admin_users.css */
.admin-users-error {
  background: linear-gradient(135deg, #fff5f5 0%, #ffe8e8 100%);
  border-left: 4px solid #dc3545;
  border-radius: 8px;
  padding: 2rem 2.4rem;
  margin-bottom: 3rem;
  box-shadow: 0 2px 8px rgba(220, 53, 69, 0.1);
}

/* line 239, app/assets/stylesheets/admin_users.css */
.admin-users-error ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* line 245, app/assets/stylesheets/admin_users.css */
.admin-users-error li {
  color: #dc3545;
  font-size: 1.5rem;
  font-weight: 500;
  padding: 0.4rem 0;
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

/* line 255, app/assets/stylesheets/admin_users.css */
.admin-users-error li::before {
  content: '⚠';
  font-size: 1.8rem;
}

/* Enhanced Form Fields */
/* line 261, app/assets/stylesheets/admin_users.css */
.admin-users-form-group {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2.4rem;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

/* line 271, app/assets/stylesheets/admin_users.css */
.admin-users-form-group:hover {
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.1);
}

/* line 275, app/assets/stylesheets/admin_users.css */
.admin-users-form-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 280px;
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  color: #ffffff;
  padding: 1.8rem 2rem;
  font-size: 1.6rem;
  font-weight: 600;
  position: relative;
}

/* line 288, app/assets/stylesheets/admin_users.css */
.admin-users-form-label .required {
  background: #dc3545;
  color: #ffffff;
  font-size: 1.2rem;
  font-weight: 700;
  padding: 0.4rem 1rem;
  border-radius: 4px;
  white-space: nowrap;
}

/* line 298, app/assets/stylesheets/admin_users.css */
.admin-users-form-input-wrapper {
  flex: 1;
  background: #ffffff;
  padding: 1.8rem 2rem;
  min-width: 0;
}

/* line 305, app/assets/stylesheets/admin_users.css */
.admin-users-form-input {
  width: 100%;
  border: 2px solid #e8eef5;
  border-radius: 8px;
  padding: 1.2rem 1.6rem;
  font-size: 1.6rem;
  transition: all 0.3s ease;
  background: #ffffff;
}

/* line 315, app/assets/stylesheets/admin_users.css */
.admin-users-form-input:focus {
  outline: none;
  border-color: #174B7D;
  box-shadow: 0 0 0 3px rgba(23, 75, 125, 0.1);
  background: #f8fbff;
}

/* line 322, app/assets/stylesheets/admin_users.css */
.admin-users-form-input:hover {
  border-color: #47cd89;
}

/* Submit Button */
/* line 327, app/assets/stylesheets/admin_users.css */
.admin-users-submit {
  background: linear-gradient(135deg, #174B7D 0%, #2364a0 100%);
  color: #ffffff;
  font-size: 1.8rem;
  font-weight: 700;
  padding: 1.6rem 4rem;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(23, 75, 125, 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  min-width: 300px;
}

/* line 345, app/assets/stylesheets/admin_users.css */
.admin-users-submit:hover {
  background: linear-gradient(135deg, #0d2e4e 0%, #174B7D 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(23, 75, 125, 0.35);
}

/* line 351, app/assets/stylesheets/admin_users.css */
.admin-users-submit:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(23, 75, 125, 0.2);
}

/* Responsive Design */
@media (max-width: 768px) {
  /* line 358, app/assets/stylesheets/admin_users.css */
  .admin-users-page {
    padding: 24px 16px;
  }
  /* line 362, app/assets/stylesheets/admin_users.css */
  .admin-users-header {
    flex-direction: column;
    gap: 2rem;
    padding: 2.4rem 2rem;
  }
  /* line 368, app/assets/stylesheets/admin_users.css */
  .admin-users-header__title {
    font-size: 2.4rem;
  }
  /* line 372, app/assets/stylesheets/admin_users.css */
  .admin-users-header__btn {
    width: 100%;
    justify-content: center;
  }
  /* line 377, app/assets/stylesheets/admin_users.css */
  .admin-users-table-container {
    overflow-x: auto;
  }
  /* line 381, app/assets/stylesheets/admin_users.css */
  .admin-users-table {
    font-size: 1.4rem;
  }
  /* line 385, app/assets/stylesheets/admin_users.css */
  .admin-users-table th,
.admin-users-table td {
    padding: 1.2rem 1rem;
  }
  /* line 390, app/assets/stylesheets/admin_users.css */
  .admin-users-actions {
    flex-direction: column;
    gap: 0.6rem;
  }
  /* line 395, app/assets/stylesheets/admin_users.css */
  .admin-users-btn {
    width: 100%;
  }
  /* line 399, app/assets/stylesheets/admin_users.css */
  .admin-users-form-page {
    padding: 24px 16px;
  }
  /* line 403, app/assets/stylesheets/admin_users.css */
  .admin-users-form-header {
    padding: 2.4rem 2rem;
  }
  /* line 407, app/assets/stylesheets/admin_users.css */
  .admin-users-form-header__title {
    font-size: 2.4rem;
  }
  /* line 411, app/assets/stylesheets/admin_users.css */
  .admin-users-form-card {
    padding: 2.4rem 2rem;
  }
  /* line 415, app/assets/stylesheets/admin_users.css */
  .admin-users-form-group {
    flex-direction: column;
  }
  /* line 419, app/assets/stylesheets/admin_users.css */
  .admin-users-form-label {
    width: 100%;
    border-radius: 12px 12px 0 0;
  }
  /* line 424, app/assets/stylesheets/admin_users.css */
  .admin-users-form-input-wrapper {
    border-radius: 0 0 12px 12px;
  }
  /* line 428, app/assets/stylesheets/admin_users.css */
  .admin-users-submit {
    width: 100%;
    min-width: auto;
  }
}

@media (max-width: 480px) {
  /* line 435, app/assets/stylesheets/admin_users.css */
  .admin-users-header__title {
    font-size: 2rem;
  }
  /* line 439, app/assets/stylesheets/admin_users.css */
  .admin-users-form-header__title {
    font-size: 2rem;
  }
  /* line 443, app/assets/stylesheets/admin_users.css */
  .admin-users-table {
    font-size: 1.3rem;
  }
  /* line 447, app/assets/stylesheets/admin_users.css */
  .admin-users-table th,
.admin-users-table td {
    padding: 1rem 0.8rem;
  }
}