/* ─────────────────────────────────────────
   MAIL MAGAZINE PAGE
───────────────────────────────────────── */
.sn-mm-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 40px;
  width: 100%;
  max-width: 890px;
}

/* Page Title */
.sn-mm-header-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 16px;
  width: 100%;
}
.sn-mm-page-title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 40px;
  letter-spacing: -0.02em;
  color: #061C3D;
  margin: 0;
  /* Wrap on long labels instead of overflowing the flex column */
  word-break: break-word;
  overflow-wrap: anywhere;
}
@media (max-width: 1024px) {
  .sn-mm-page-title {
    font-size: 28px;
    line-height: 36px;
  }
}
@media (max-width: 768px) {
  .sn-mm-page-title {
    font-size: 24px;
    line-height: 32px;
  }
}
@media (max-width: 480px) {
  .sn-mm-page-title {
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.01em;
  }
}

/* Content Wrap */
.sn-mm-content-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 26px;
  width: 100%;
}
.sn-mm-content-text-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 16px;
  width: 100%;
}
.sn-mm-text-top {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #42526B;
  margin: 0;
}
.sn-mm-subtitle {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  letter-spacing: -0.02em;
  color: #00C48A;
  margin: 0;
}
.sn-mm-text {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #42526B;
  margin: 0;
}
.sn-mm-text-note {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #42526B;
  margin: 0;
}

/* Back number Button */
.sn-mm-btn-wrap {
  width: 100%;
  max-width: 405px;
  height: 56px;
}
.sn-mm-btn {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 10px 16px;
  gap: 10px;
  width: 100%;
  height: 100%;
  background: #008F8D;
  border-radius: 8px;
  text-decoration: none;
  transition: opacity 0.3s;
}
.sn-mm-btn--backnum {
  background-image: url('../../images/Btn_background.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.sn-mm-btn:hover {
  opacity: 0.85;
}
.sn-mm-btn span {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.sn-mm-btn-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
}

/* Forms Container */
.sn-mm-forms-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 40px;
  width: 100%;
}

.sn-mm-form-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 16px;
  width: 100%;
}

.sn-mm-form-head {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0px;
  gap: 12px;
}
.sn-mm-form-icon {
  width: 40px;
  height: 40px;
}
.sn-mm-form-title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  letter-spacing: -0.02em;
  color: #061C3D;
  margin: 0;
}
.sn-mm-form-desc {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #42526B;
  margin: 0;
}

.sn-mm-form {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0px;
  gap: 18px;
  width: 100%;
  max-width: 878px;
}
.sn-mm-input {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 18px 20px;
  gap: 10px;
  flex: 1;
  height: 56px;
  background: #FFFFFF;
  border: 1px solid #CDD2D8;
  border-radius: 8px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  color: #061C3D;
}
.sn-mm-input::placeholder {
  color: #B4BBC5;
}
.sn-mm-input:focus {
  outline: none;
  border-color: #008F8D;
}

/* Field wrapper: input + validation error message DIRECTLY BELOW input.
   Takes the input's place as the flex-grow element (flex:1) in the form row. */
.sn-mm-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  align-self: center;
}
.sn-mm-field .sn-mm-input {
  flex: 0 0 auto;
  width: 100%;
}
.sn-mm-input-error {
  margin: 0;
  color: #E7380D;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 1.5;
}
.sn-mm-input--invalid {
  border-color: #E7380D;
}
.sn-mm-input--invalid:focus {
  border-color: #E7380D;
}
@media (max-width: 768px) {
  .sn-mm-field { flex: 0 0 auto; width: 100%; align-self: stretch; }
}

.sn-mm-submit {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 10px 16px;
  gap: 10px;
  width: 224px;
  height: 56px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  transition: opacity 0.3s;
}
.sn-mm-submit:hover {
  opacity: 0.85;
}
.sn-mm-submit span {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  white-space: nowrap;
}
.sn-mm-submit .sn-mm-btn-icon {
  flex-shrink: 0;
}
.sn-mm-submit--register {
  background-image: url('../../images/btn_background_blue.png');
  background-color: #008F8D;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.sn-mm-submit--unsubscribe {
  background-image: url('../../images/btn_background_red.png');
  background-color: rgba(239, 68, 68, 0.68);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

@media (max-width: 768px) {
  /* Layout */
  .sn-mm-main { gap: 24px; }
  .sn-mm-content-wrap { gap: 18px; }
  .sn-mm-forms-container { gap: 28px; }

  /* Typography scale */
  .sn-mm-subtitle    { font-size: 18px; line-height: 26px; }
  .sn-mm-form-title  { font-size: 18px; line-height: 26px; }
  .sn-mm-text,
  .sn-mm-text-top,
  .sn-mm-text-note,
  .sn-mm-form-desc   { font-size: 14px; line-height: 22px; }

  /* Form column layout */
  .sn-mm-form {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .sn-mm-input { height: 48px; padding: 12px 16px; font-size: 14px; }

  /* Full-width buttons on mobile */
  .sn-mm-submit, .sn-mm-btn-wrap {
    width: 100%;
    max-width: 100%;
  }
  /* 登録する / 解除する / バックナンバーを見る buttons keep their compact width, not full-width */
  .sn-mm-submit.sn-mm-submit--register,
  .sn-mm-submit.sn-mm-submit--unsubscribe,
  .sn-mm-btn.sn-mm-btn--backnum {
    width: auto;
    max-width: 100%;
    align-self: flex-start;
  }
  /* Backnum button wrap also doesn't stretch full-width */
  .sn-mm-btn-wrap:has(> .sn-mm-btn--backnum) {
    width: auto;
    max-width: 405px;
    align-self: flex-start;
  }
  .sn-mm-submit { height: 52px; padding: 8px 16px; }
  .sn-mm-btn    { padding: 8px 16px; }
  .sn-mm-submit span,
  .sn-mm-btn span { font-size: 16px; line-height: 24px; }

  /* Shrink icon so 24px btn text + icon fit within 52px row cleanly */
  .sn-mm-btn-icon { width: 32px; height: 32px; }
  .sn-mm-btn-icon img { width: 20px; height: 20px; }

  /* Form heading row */
  .sn-mm-form-head { gap: 8px; }
  .sn-mm-form-icon { width: 32px; height: 32px; }
}

@media (max-width: 480px) {
  .sn-mm-main { gap: 20px; }
  .sn-mm-subtitle,
  .sn-mm-form-title { font-size: 16px; line-height: 24px; }
  .sn-mm-submit span,
  .sn-mm-btn span   { font-size: 15px; line-height: 22px; }
  .sn-mm-submit { height: 48px; }
  .sn-mm-btn-wrap { height: 48px; }
}

/* Sidebar Navigation */
.sn-mm-sidebar-nav {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  width: 100%;
  max-width: 270px;
}

.sn-mm-sidebar-title {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 18px;
  gap: 10px;
  width: 100%;
  min-height: 62px;
  background: #008E8C;
  border-bottom: 1px solid #FFFFFF;
  border-radius: 16px 16px 0px 0px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 22px;
  color: #FFFFFF;
}

.sn-mm-sidebar-link {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 18px;
  gap: 10px;
  width: 100%;
  min-height: 62px;
  background: #E9ECEE;
  border-bottom: 1px solid #FFFFFF;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 22px;
  color: #008E8C;
  text-decoration: none;
  transition: background 0.3s;
}

.sn-mm-sidebar-link:hover,
.sn-mm-sidebar-link.active {
  background: #008E8C;
  color: #FFFFFF;
}

.sn-mm-sidebar-link:last-child {
  border-bottom: none;
  border-radius: 0 0 16px 16px;
}

@media (max-width: 768px) {
  .sn-mm-sidebar-nav {
    max-width: 100%;
    margin-bottom: 24px;
  }
  /* Title keeps the same type scale as the links (desktop is 18px for both). */
  .sn-mm-sidebar-title {
    padding: 14px 16px;
    min-height: 52px;
    font-size: 14px;
    line-height: 20px;
    border-radius: 12px 12px 0 0;
  }
  .sn-mm-sidebar-link {
    padding: 14px 16px;
    min-height: 52px;
    font-size: 14px;
    line-height: 20px;
  }
  .sn-mm-sidebar-link:last-child {
    border-radius: 0 0 12px 12px;
  }
  .sn-req-sidebar .sn-mm-sidebar-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    border-radius: 12px;
    background: #fff;
    margin-bottom: 0;
  }
  .sn-req-sidebar .sn-mm-sidebar-title {
    grid-column: 1 / -1;
    border-radius: 0;
  }
  .sn-req-sidebar .sn-mm-sidebar-link {
    min-height: 48px;
    height: auto;
    white-space: normal;
    word-break: break-word;
    border: 0;
    border-radius: 0 !important;
  }
}

@media (max-width: 480px) {
  .sn-mm-sidebar-nav {
    margin-bottom: 20px;
  }
  .sn-mm-sidebar-title {
    padding: 12px 14px;
    min-height: 48px;
    font-size: 13px;
    line-height: 18px;
  }
  .sn-mm-sidebar-link {
    padding: 12px 14px;
    min-height: 48px;
    font-size: 13px;
    line-height: 18px;
  }
  .sn-req-sidebar .sn-mm-sidebar-title,
  .sn-req-sidebar .sn-mm-sidebar-link {
    padding: 10px 12px;
    font-size: 12px;
    line-height: 1.45;
  }
}

/* Back Number Page Styles */
.sn-req-main.sn-mm-main {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sn-backnum-block-inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.sn-backnum-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  width: 100%;
}
.sn-backnum-title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 40px;
  color: #061C3D;
  margin: 0;
  flex-grow: 1;
}
.sn-backnum-filter-wrap {
  width: 190px;
  height: 40px;
  position: relative;
  background: #FFFFFF;
  border: 1px solid #CDD2D8;
  box-sizing: border-box;
  flex-shrink: 0;
  overflow: hidden;
}
.sn-backnum-filter {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  border: none;
  box-shadow: none;
  width: 100%;
  height: 100%;
  padding: 0 30px 0 12px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 14px;
  line-height: 38px;
  cursor: pointer;
  outline: none;
}
.sn-backnum-filter-wrap::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid currentColor;
  pointer-events: none;
}

.sn-backnum-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.sn-backnum-item {
  display: flex;
  width: 100%;
  align-items: center;
  background: #FFFFFF;
  border: 1px solid #CDD2D8;
  padding: 16px;
  gap: 14px;
  text-decoration: none;
  height: 62px;
  box-sizing: border-box;
}
.sn-backnum-tag {
  background: #FFFFFF;
  border: 1px solid #E6E8EC;
  border-radius: 10px;
  padding: 1px 12px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #6A778B;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 30px;
  min-width: 58px;
  box-sizing: border-box;
}
.sn-backnum-date {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 14px;
  color: #243752;
  font-weight: 400;
}

.sn-backnum-text {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: #061C3D;
  flex-grow: 1;
  margin: 0;
}

.sn-backnum-icon {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sn-backnum-icon .icon-hover {
  display: none;
}


/* Item Hover Style — applies the green background & white text state on hover */
.sn-backnum-item:hover {
  background: #008F8D;
  border-color: #008F8D;
  opacity: 1;
}
.sn-backnum-item:hover .sn-backnum-tag {
  background: #FFFFFF;
}
.sn-backnum-item:hover .sn-backnum-date {
  color: #FFFFFF;
}
.sn-backnum-item:hover .sn-backnum-text {
  color: #FFFFFF;
}
.sn-backnum-item:hover .sn-backnum-icon .icon-leave {
  display: none;
}
.sn-backnum-item:hover .sn-backnum-icon .icon-hover {
  display: block;
}

@media (max-width: 768px) {
  .sn-backnum-header {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    width: 100%;
  }
  .sn-backnum-title {
    width: 100%;
    max-width: 100%;
    font-size: 22px;
    line-height: 30px;
    word-break: break-word;
  }
  .sn-backnum-filter-wrap {
    width: 100%;
    max-width: 100%;
  }

  .sn-backnum-list { gap: 12px; }
  .sn-backnum-item {
    flex-wrap: wrap;
    gap: 8px 12px;
    height: auto;
    min-height: 62px;
    padding: 12px 14px;
  }
  .sn-backnum-tag {
    min-width: 52px;
    height: 26px;
    padding: 1px 10px;
    font-size: 12px;
  }
  .sn-backnum-date { font-size: 12px; }
  /* Text + icon share row 2 — text takes remaining width, icon sits at the end
     after the text. Order 2/3 keeps text before icon in visual order. */
  .sn-backnum-text {
    order: 2;
    flex: 1 1 auto;
    min-width: 200px;
    margin: 4px 0 0 0;
    padding: 0;
    font-size: 14px;
    line-height: 20px;
    white-space: normal;
  }
  .sn-backnum-icon {
    order: 3;
    flex: 0 0 auto;
    margin-left: auto;
    align-self: flex-end;
  }

  /* Pagination: allow wrap + tighter spacing */
  .sn-backnum-pagination { flex-wrap: wrap; gap: 4px; }
  .sn-backnum-pg { min-width: 32px; height: 32px; font-size: 13px; }

  /* Icon (external link) — keep at 24×24 on mobile so highlighted top item's
     white variant stays visible without overlapping wrapped text */
  .sn-backnum-icon { width: 24px; height: 24px; }
  .sn-backnum-icon img { width: 100%; height: 100%; display: block; }


}

@media (max-width: 480px) {
  .sn-backnum-title { font-size: 20px; line-height: 28px; }
  .sn-backnum-item { padding: 10px 12px; }
  .sn-backnum-text { font-size: 13px; line-height: 19px; }
}

/* Backnum Pagination */
.sn-backnum-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  margin-top: 24px;
  width: 100%;
}
.sn-backnum-pg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: transparent;
  border: none;
  color: #000000;
  text-decoration: none;
  font-family: 'Poppins', 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 14px;
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
  box-sizing: border-box;
}
.sn-backnum-pg:hover:not(.active):not(.ellipsis) {
  background: #f0f0f0;
}
.sn-backnum-pg.active {
  background: #008F8D;
  color: #FFFFFF;
  box-shadow: 0px 1px 2px -1px rgba(17, 12, 34, 0.08);
}
.sn-backnum-pg.ellipsis {
  background: transparent;
  color: #000000;
  box-shadow: none;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translateY(4px);
  cursor: default;
  pointer-events: none;
}
.sn-backnum-pg.prev,
.sn-backnum-pg.next {
  background: #FFFFFF;
  border: 1px solid #ECECED;
  box-shadow: 0px 1px 2px -1px rgba(17, 12, 34, 0.08);
  color: #000000;
}
.sn-backnum-pg.prev {
  margin-right: 24px;
}
.sn-backnum-pg.next {
  margin-left: 24px;
}
.sn-backnum-pg.prev.disabled,
.sn-backnum-pg.next.disabled {
  cursor: not-allowed;
}

/* Single Mail Magazine Detail */
.sn-req-main.sn-mm-main.sn-single-mm-main {
  gap: 26px;
}
.sn-single-mm-header {
  margin-bottom: 24px;
}
.sn-single-mm-title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.5;
  color: #061C3D;
  margin: 0 0 12px;
  word-break: break-word;
}
.sn-single-mm-content {
  width: 100%;
  box-sizing: border-box;
  background: #F4F5F6;
  border-radius: 8px;
  padding: 52px 120px;
  font-family: 'Noto Sans JP', 'Noto Sans', 'Courier New', monospace, sans-serif;
  font-size: 17px;
  line-height: 1.8;
  color: #061C3D;
  white-space: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.sn-single-mm-content p {
  margin: 0 0 0.5em;
  white-space: nowrap;
}
.sn-single-mm-content p:last-child {
  margin: 0;
}
.sn-single-mm-content a {
  color: #008F8D;
  text-decoration: underline;
}

/* Responsive Scaling (co nhỏ theo viewport thay vì wrap line) */
@media (max-width: 1200px) {
  .sn-single-mm-content {
    padding: 40px 60px;
    font-size: 16px;
  }
}

@media (max-width: 992px) {
  .sn-single-mm-content {
    padding: 32px 36px;
    font-size: 14px;
    line-height: 1.7;
  }
  .sn-single-mm-title {
    font-size: 22px;
  }
}

@media (max-width: 768px) {
  .sn-req-main.sn-mm-main.sn-single-mm-main {
    gap: 20px;
  }
  .sn-single-mm-content {
    padding: 24px 20px;
    font-size: 12.5px;
    line-height: 1.65;
  }
  .sn-single-mm-title {
    font-size: 20px;
  }
}

@media (max-width: 480px) {
  .sn-req-main.sn-mm-main.sn-single-mm-main {
    gap: 16px;
  }
  .sn-single-mm-content {
    padding: 16px 12px;
    font-size: 11px;
    line-height: 1.6;
  }
  .sn-single-mm-title {
    font-size: 18px;
  }
}

/* Article-style detail (author byline + headings + figures + references),
   as opposed to the ASCII-art newsletter body the nowrap rules above target. */
.sn-single-mm-content--article {
  white-space: normal;
  overflow-x: auto;
  max-width: 100%;
  box-sizing: border-box;
  background: #FFFFFF;
  padding: 52px 120px;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(6, 28, 61, 0.04);
  border: 1px solid #E6E8EC;
  font-family: 'Noto Sans JP', sans-serif;
  color: #061C3D;
  word-break: break-word;
  overflow-wrap: break-word;
}
.sn-single-mm-content hr,
.sn-single-mm-content--article hr {
  border: 0;
  border-top: 1px solid #E6E8EC;
  margin: 16px 0;
  width: 100%;
}
.sn-single-mm-content--article p {
  white-space: normal;
  line-height: 1.85;
  margin: 0;
  font-size: 16px;
  color: #243752;
}
.sn-single-mm-content--article p strong,
.sn-single-mm-content p strong {
  color: #061C3D;
  font-weight: 700;
}
.sn-single-mm-content a.recommend,
.sn-single-mm-content--article a.recommend {
  display: inline-block;
  margin-top: 8px;
  margin-bottom: 12px;
  color: #008F8D;
  font-weight: 700;
  font-size: 16.5px;
  line-height: 1.6;
  text-decoration: none;
  transition: color 0.15s ease, text-decoration 0.15s ease;
}
.sn-single-mm-content a.recommend:hover,
.sn-single-mm-content--article a.recommend:hover {
  text-decoration: underline;
  color: #006664;
}
.sn-single-mm-content--article #mail_name,
.sn-single-mm-content--article .mail_name,
.sn-single-mm-content--article .sn-mm-byline {
  margin: 12px 0 28px;
  text-align: right;
  font-size: 15px;
  line-height: 1.6;
  color: #42526B;
  font-weight: 500;
}
.sn-single-mm-content--article h3 {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
  color: #008F8D;
  border-left: 4px solid #008F8D;
  padding-left: 12px;
  margin: 36px 0 16px;
  display: flex;
  align-items: center;
}
.sn-single-mm-content--article h3:first-child {
  margin-top: 0;
}
.sn-single-mm-content--article h4 {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.5;
  color: #008F8D;
  margin: 28px 0 14px;
}
.sn-single-mm-content--article h5 {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 1.5;
  color: #008F8D;
  border-bottom: 2px solid #E0E8E6;
  padding-bottom: 8px;
  margin: 32px 0 16px;
}
.sn-single-mm-content--article .mail_t_area {
  display: block;
  width: 100%;
  margin-bottom: 24px;
  font-size: 16px;
  line-height: 1.85;
  color: #243752;
}
.sn-single-mm-content--article .mail_t_area p {
  margin-bottom: 12px;
}
.sn-single-mm-content--article .mail_history,
.sn-single-mm-content--article .sn-mm-bio {
  background: #F8FAF9;
  padding: 24px;
  border-radius: 8px;
  border: 1px solid #E0E8E6;
  margin: 20px 0 28px;
}
.sn-single-mm-content--article .mail_history p,
.sn-single-mm-content--article .sn-mm-bio p {
  margin-bottom: 8px;
  font-size: 14.5px;
  line-height: 1.75;
  color: #42526B;
}
.sn-single-mm-content--article .list-num1,
.sn-single-mm-content--article .sn-mm-refs,
.sn-single-mm-content--article dl {
  margin: 16px 0 24px;
  padding: 0;
}
.sn-single-mm-content--article .list-num1 dt,
.sn-single-mm-content--article .sn-mm-refs dt {
  float: left;
  clear: left;
  width: 2.5em;
  font-weight: 700;
  color: #008F8D;
}
.sn-single-mm-content--article .list-num1 dd,
.sn-single-mm-content--article .sn-mm-refs dd {
  margin: 0 0 10px 2.5em;
  font-size: 15px;
  line-height: 1.7;
  color: #42526B;
}
.sn-single-mm-content--article img,
.sn-single-mm-content--article figure img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 16px auto;
  border-radius: 6px;
}
.sn-single-mm-content--article figure {
  margin: 1.5em 0;
  text-align: center;
}
.sn-single-mm-content--article figcaption {
  margin-top: 0.5em;
  font-size: 0.85em;
  color: #6A778B;
}
.sn-single-mm-content--article .add-center {
  text-align: center;
  margin: 20px 0;
}
@media (max-width: 1200px) {
  .sn-single-mm-content--article {
    padding: 40px 60px;
  }
}
@media (max-width: 992px) {
  .sn-single-mm-content--article {
    padding: 32px 36px;
  }
}
@media (max-width: 768px) {
  .sn-single-mm-content--article {
    padding: 24px 20px;
    font-size: 14px;
  }
  .sn-single-mm-content--article h3 {
    font-size: 18px;
    margin: 28px 0 14px;
  }
  .sn-single-mm-content--article h5 {
    font-size: 16px;
    margin: 24px 0 12px;
  }
  .sn-single-mm-content--article p,
  .sn-single-mm-content--article .mail_t_area {
    font-size: 14.5px;
    line-height: 1.75;
  }
  .sn-single-mm-content hr,
  .sn-single-mm-content--article hr {
    margin: 12px 0;
  }
}
@media (max-width: 480px) {
  .sn-single-mm-content--article {
    padding: 16px 12px;
  }
  .sn-single-mm-content hr,
  .sn-single-mm-content--article hr {
    margin: 10px 0;
  }
}

/* Standalone mail-detail page — recreates the original mac.or.jp mail-detail
   layout (plain logo bar, simple breadcrumb, share buttons) with modern
   semantic HTML/CSS, used when the site's normal header/nav + sidebar chrome
   is intentionally skipped (see ar-body-render.php). */
.sn-mm-standalone {
  background: #fff;
}
.sn-mm-standalone-logobar {
  background: #C5DEC5;
  padding: 24px 0;
  text-align: center;
}
.sn-mm-standalone-logobar img {
  height: 46px;
  width: auto;
}
.sn-mm-standalone-inner {
  max-width: 700px;
  margin: 0 auto;
  padding: 24px 16px 64px;
}
.sn-mm-standalone-breadcrumb {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 14px;
  color: #445068;
  display: flex;
  align-items: center;
  gap: 6px;
  padding-bottom: 12px;
  margin-bottom: 16px;
  border-bottom: 1px solid #E0E2E6;
}
.sn-mm-standalone-breadcrumb a {
  color: #445068;
  text-decoration: none;
}
.sn-mm-standalone-breadcrumb a:hover {
  text-decoration: underline;
}
.sn-mm-standalone-title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.5;
  color: #000000;
  margin: 0 0 16px;
  word-break: break-word;
}
.sn-mm-standalone-share {
  display: flex;
  gap: 12px;
  margin: 20px 0;
}
.sn-mm-share-btn {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 4px;
  font-size: 13px;
  font-family: 'Noto Sans JP', sans-serif;
  text-decoration: none;
  color: #fff;
}
.sn-mm-share-fb { background: #1877F2; }
.sn-mm-share-tw { background: #000000; }
.sn-mm-standalone-content {
  font-family: 'Noto Sans JP', 'Noto Sans', 'Courier New', monospace, sans-serif;
  font-size: 17px;
  line-height: 1.8;
  color: #061C3D;
  white-space: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.sn-mm-standalone-content p {
  margin: 0 0 0.5em;
  white-space: nowrap;
}
.sn-mm-standalone-content a {
  color: #008F8D;
  text-decoration: underline;
}
.sn-mm-standalone-content--article {
  white-space: normal;
  overflow-x: visible;
  font-size: 16px;
}
.sn-mm-standalone-content--article p {
  white-space: normal;
}
.sn-mm-standalone-content--article .sn-mm-byline {
  margin: 0 0 1.5em;
  font-size: 0.9em;
  color: #445068;
}
.sn-mm-standalone-content--article h3 {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 1.15em;
  color: #000000;
  margin: 1.75em 0 0.75em;
}
.sn-mm-standalone-content--article h3:first-child {
  margin-top: 0;
}
.sn-mm-standalone-content--article h4 {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 1.05em;
  color: #008F8D;
  margin: 1.5em 0 0.5em;
}
.sn-mm-standalone-content--article h5 {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 1em;
  color: #000000;
  margin: 1.5em 0 0.5em;
}
.sn-mm-standalone-content--article figure {
  margin: 1.5em 0;
  text-align: center;
}
.sn-mm-standalone-content--article figure img {
  max-width: 100%;
  height: auto;
}
.sn-mm-standalone-content--article figcaption {
  margin-top: 0.5em;
  font-size: 0.85em;
  color: #6A778B;
}
.sn-mm-standalone-content--article .sn-mm-refs {
  margin: 0;
  padding: 0;
  font-size: 0.9em;
}
.sn-mm-standalone-content--article .sn-mm-refs dt {
  float: left;
  clear: left;
  width: 2.5em;
}
.sn-mm-standalone-content--article .sn-mm-refs dd {
  margin: 0 0 0.5em 2.5em;
}
.sn-mm-standalone-content--article .sn-mm-bio p {
  margin: 0 0 0.5em;
}
.sn-mm-standalone-actions {
  display: flex;
  gap: 12px;
  margin: 32px 0 24px;
  flex-wrap: wrap;
}
.sn-mm-standalone-back {
  display: inline-block;
  padding: 10px 20px;
  border-radius: 4px;
  background: #061C3D;
  color: #fff;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 14px;
  text-decoration: none;
}
.sn-mm-standalone-back:hover {
  opacity: 0.85;
}
.sn-mm-standalone-back-home {
  background: #6A778B;
}
.sn-mm-standalone-contact {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 13px;
  color: #6A778B;
  border-top: 1px solid #E0E2E6;
  padding-top: 16px;
}
.sn-mm-standalone-contact a {
  color: #008F8D;
}

@media (max-width: 768px) {
  .sn-mm-standalone-inner {
    padding: 16px 16px 48px;
  }
  .sn-mm-standalone-title {
    font-size: 20px;
  }
  .sn-mm-standalone-content {
    font-size: 14px;
  }
  .sn-mm-standalone-content--article {
    font-size: 14px;
  }
}

/* ─────────────────────────────────────────
   ACCESS RANKING - アクセスランキング
───────────────────────────────────────── */
.sn-req-main.sn-ranking-main {
  gap: 0;
}
.sn-ranking-main-title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 40px;
  color: #061C3D;
  margin: 0 0 16px;
  padding-bottom: 0;
  border-bottom: none;
  letter-spacing: -0.02em;
}
.sn-ranking-section {
  margin-bottom: 40px;
  width: 100%;
}
.sn-ranking-section:last-child {
  margin-bottom: 0;
}
.sn-ranking-subtitle {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  color: #42526B;
  margin: 0 0 16px;
  letter-spacing: -0.02em;
}
.sn-ranking-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.sn-ranking-item {
  display: flex;
  align-items: center;
  width: 100%;
  height: 62px;
  padding: 0 25px 0 14px;
  background: #FFFFFF;
  border: 1px solid #CDD2D8;
  text-decoration: none;
  box-sizing: border-box;
  position: relative;
}

.sn-ranking-num {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 900;
  font-size: 20px;
  line-height: 34px;
  width: 40px;
  text-align: center;
  letter-spacing: -0.02em;
  margin-right: 20px;
  flex: none;
  color: #6A778B;
}

.sn-ranking-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 144px;
  flex: none;
}
.sn-ranking-vol {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 17px;
  width: 58px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border: 1px solid #E6E8EC;
  background: #FFFFFF;
  color: #6A778B;
  box-sizing: border-box;
}
.sn-ranking-date {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #243752;
}

.sn-ranking-text {
  flex: 1;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  padding: 0 13px;
  color: #061C3D;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sn-ranking-arrow {
  width: 30px;
  height: 30px;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sn-ranking-arrow .icon-hover {
  display: none;
}

/* Item Hover Style — applies green background & white text state on hover */
.sn-ranking-item:hover {
  background: #008F8D;
  border-color: #008F8D;
  z-index: 1;
}
.sn-ranking-item:hover .sn-ranking-num {
  color: #FFFFFF;
}
.sn-ranking-item:hover .sn-ranking-vol {
  background: #FFFFFF;
  color: #008F8D;
  border-color: #FFFFFF;
}
.sn-ranking-item:hover .sn-ranking-date {
  color: #FFFFFF;
}
.sn-ranking-item:hover .sn-ranking-text {
  color: #FFFFFF;
}
.sn-ranking-item:hover .sn-ranking-arrow .icon-leave {
  display: none;
}
.sn-ranking-item:hover .sn-ranking-arrow .icon-hover {
  display: block;
}
@media (max-width: 768px) {
  /* Title / subtitle scale */
  .sn-ranking-main-title { font-size: 22px; line-height: 30px; margin: 0 0 12px; }
  .sn-ranking-subtitle   { font-size: 18px; line-height: 26px; margin: 0 0 12px; }
  .sn-ranking-section    { margin-bottom: 28px; }

  .sn-ranking-list { gap: 12px; }

  /* Mirror the .sn-backnum-item mobile pattern used by /recommend-mag/:
     Row 1: [num] [meta]            [arrow at right]
     Row 2: [text full-width] */
  .sn-ranking-item {
    height: auto;
    min-height: 62px;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    padding: 12px 14px;
  }
  .sn-ranking-num {
    width: auto;
    min-width: 32px;
    margin-right: 0;
    text-align: left;
    font-size: 18px;
    line-height: 28px;
  }
  .sn-ranking-meta {
    width: auto;
    flex: 0 1 auto;
    gap: 8px;
  }
  .sn-ranking-vol  { width: 52px; height: 26px; font-size: 12px; }
  .sn-ranking-date { font-size: 12px; }
  /* Same layout as /recommend-mag/: text + arrow share row 2, arrow is the
     last element after text. */
  .sn-ranking-text {
    order: 2;
    flex: 1 1 auto;
    min-width: 200px;
    margin: 4px 0 0 0;
    padding: 0;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    font-size: 14px;
    line-height: 20px;
  }

  .sn-ranking-arrow {
    position: static;
    transform: none;
    order: 3;
    flex: 0 0 auto;
    margin-left: auto;
    align-self: flex-end;
    width: 24px;
    height: 24px;
  }
  .sn-ranking-arrow img { width: 100%; height: 100%; display: block; }
}

@media (max-width: 480px) {
  .sn-ranking-main-title { font-size: 20px; line-height: 28px; }
  .sn-ranking-subtitle   { font-size: 16px; line-height: 24px; }
  .sn-ranking-item       { padding: 10px 12px; }
  .sn-ranking-text       { font-size: 13px; line-height: 19px; }
}

/* ─────────────────────────────────────────
   MAIL MAGAZINE — 登録確認 (メール確認) PAGE
   Specs Figma: H2 26px #008F8D / underline 3px, H3 20px #061C3D / underline 2px,
   body 16px/24px #061C3D, group gap 18px, gap before final paragraph 50px.
───────────────────────────────────────── */
.sn-mm-confirm {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  width: 100%;
}
.sn-mm-confirm-title {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 26px;
  line-height: 31px;
  letter-spacing: -0.02em;
  color: #008F8D;
  margin: 0;
  width: 100%;
  padding-bottom: 10px;
  border-bottom: 3px solid rgba(0, 143, 141, 0.7);
}
.sn-mm-confirm-subtitle {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 32px;
  letter-spacing: -0.02em;
  color: #061C3D;
  margin: 0;
  width: 100%;
  padding-bottom: 2px;
  border-bottom: 2px solid rgba(0, 143, 141, 0.7);
}
.sn-mm-confirm-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  width: 100%;
}
.sn-mm-confirm-text {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #061C3D;
  margin: 0;
}
.sn-mm-confirm-text strong {
  font-weight: 700;
  color: #061C3D;
}
.sn-mm-confirm-text--gap {
  margin-top: 18px;
}

@media (max-width: 768px) {
  .sn-mm-confirm-title {
    font-size: 22px;
    line-height: 30px;
  }
  .sn-mm-confirm-subtitle {
    font-size: 18px;
    line-height: 28px;
  }
}

/* ─────────────────────────────────────────────────────────────────────────
   EDITOR — mm-body / mm-forms wrappers (mirror con-body / est-body pattern)
   Only applies inside the block editor iframe.
───────────────────────────────────────────────────────────────────────── */

/* Root container: allow full-width for mm-body just like con-body pages. */
.is-root-container:has(> .wp-block[data-type="sunatec/mm-body"]),
.is-root-container.block-editor-block-list__layout:has(> .wp-block[data-type="sunatec/mm-body"]),
.editor-styles-wrapper .is-root-container:has(> .wp-block[data-type="sunatec/mm-body"]) {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.is-root-container > .wp-block[data-type="sunatec/mm-body"],
.editor-styles-wrapper .is-root-container > .wp-block[data-type="sunatec/mm-body"] {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* mm-body wrapper: 2-col flex (already applied via .sn-req-body-layout in
 * the render callback). Just kill Gutenberg's default max-width. */
.wp-block[data-type="sunatec/mm-body"] {
  max-width: none !important;
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
}
.wp-block[data-type="sunatec/mm-body"]::before,
.wp-block[data-type="sunatec/mm-body"]::after {
  content: none !important;
}
.wp-block[data-type="sunatec/mm-body"] > * {
  max-width: none !important;
  width: 100% !important;
}

/* Sidebar column — 270px, styled label + dashed teal border. */
.wp-block[data-type="sunatec/mm-body"] .sn-con-editor-sidebar-preview {
  width: 270px;
  flex: none;
}
.wp-block[data-type="sunatec/mm-body"].is-selected .sn-con-editor-sidebar-preview {
  outline: none;
  box-shadow: 0 0 0 2px var(--wp-admin-theme-color, #007cba);
  z-index: 2;
}

/* Main column — thin flex:1 wrapper holding InnerBlocks (intro + forms). */
.sn-mm-editor-main-wrap {
  flex: 1;
  min-width: 0;
}
.sn-mm-editor-main-wrap,
.sn-mm-editor-main-wrap > .block-editor-inner-blocks,
.sn-mm-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.sn-mm-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sn-mm-editor-main-wrap .wp-block[data-type="sunatec/mm-intro"],
.sn-mm-editor-main-wrap .wp-block[data-type="sunatec/mm-forms"] {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}

/* mm-forms wrapper — 2 form-boxes horizontally. .sn-mm-forms-container from
 * front-end CSS already handles the flex layout; just ensure InnerBlocks lay
 * out horizontally in the editor. */
.wp-block[data-type="sunatec/mm-forms"] {
  max-width: none !important;
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
}
.wp-block[data-type="sunatec/mm-forms"]::before,
.wp-block[data-type="sunatec/mm-forms"]::after {
  content: none !important;
}
.sn-mm-editor-forms > .block-editor-inner-blocks,
.sn-mm-editor-forms > .block-editor-inner-blocks > .block-editor-block-list__layout {
  display: flex;
  flex-direction: column;
  gap: 40px;
  width: 100%;
  max-width: none;
}
.sn-mm-editor-forms .wp-block[data-type="sunatec/mm-register"],
.sn-mm-editor-forms .wp-block[data-type="sunatec/mm-unsubscribe"] {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Hide the standalone mm-/bn-/ar-sidebar blocks if they end up rendered
 * outside the layout wrapper (legacy content). Preview inside mm-body / bn-body
 * / ar-body is emitted via ServerSideRender into .sn-editor-sidebar-preview-wrap. */
.sn-con-editor-layout .wp-block-sunatec-mm-sidebar,
.sn-con-editor-layout [data-type="sunatec/mm-sidebar"],
.sn-con-editor-layout .wp-block-sunatec-bn-sidebar,
.sn-con-editor-layout [data-type="sunatec/bn-sidebar"],
.sn-con-editor-layout .wp-block-sunatec-ar-sidebar,
.sn-con-editor-layout [data-type="sunatec/ar-sidebar"],
.sn-con-editor-layout .wp-block-sunatec-rm-sidebar,
.sn-con-editor-layout [data-type="sunatec/rm-sidebar"],
.sn-con-editor-layout .wp-block-sunatec-esg-sidebar,
.sn-con-editor-layout [data-type="sunatec/esg-sidebar"] {
  display: none;
}

/* ─────────────────────────────────────────────────────────────────────────
   EDITOR — bn-body wrapper (same pattern as mm-body).
───────────────────────────────────────────────────────────────────────── */
.is-root-container:has(> .wp-block[data-type="sunatec/bn-body"]),
.is-root-container.block-editor-block-list__layout:has(> .wp-block[data-type="sunatec/bn-body"]),
.editor-styles-wrapper .is-root-container:has(> .wp-block[data-type="sunatec/bn-body"]) {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.is-root-container > .wp-block[data-type="sunatec/bn-body"],
.editor-styles-wrapper .is-root-container > .wp-block[data-type="sunatec/bn-body"] {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.wp-block[data-type="sunatec/bn-body"] {
  max-width: none !important;
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
}
.wp-block[data-type="sunatec/bn-body"]::before,
.wp-block[data-type="sunatec/bn-body"]::after {
  content: none !important;
}
.wp-block[data-type="sunatec/bn-body"] > * {
  max-width: none !important;
  width: 100% !important;
}
.wp-block[data-type="sunatec/bn-body"] .sn-con-editor-sidebar-preview {
  width: 270px;
  flex: none;
}
.wp-block[data-type="sunatec/bn-body"].is-selected .sn-con-editor-sidebar-preview {
  outline: none;
  box-shadow: 0 0 0 2px var(--wp-admin-theme-color, #007cba);
  z-index: 2;
}
.sn-bn-editor-main-wrap {
  flex: 1;
  min-width: 0;
}
.sn-bn-editor-main-wrap,
.sn-bn-editor-main-wrap > .block-editor-inner-blocks,
.sn-bn-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.sn-bn-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sn-bn-editor-main-wrap .wp-block[data-type="sunatec/bn-list"] {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   EDITOR — ar-body wrapper (same pattern as mm-body / bn-body).
───────────────────────────────────────────────────────────────────────── */
.is-root-container:has(> .wp-block[data-type="sunatec/ar-body"]),
.is-root-container.block-editor-block-list__layout:has(> .wp-block[data-type="sunatec/ar-body"]),
.editor-styles-wrapper .is-root-container:has(> .wp-block[data-type="sunatec/ar-body"]) {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.is-root-container > .wp-block[data-type="sunatec/ar-body"],
.editor-styles-wrapper .is-root-container > .wp-block[data-type="sunatec/ar-body"] {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.wp-block[data-type="sunatec/ar-body"] {
  max-width: none !important;
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
}
.wp-block[data-type="sunatec/ar-body"]::before,
.wp-block[data-type="sunatec/ar-body"]::after {
  content: none !important;
}
.wp-block[data-type="sunatec/ar-body"] > * {
  max-width: none !important;
  width: 100% !important;
}
.wp-block[data-type="sunatec/ar-body"] .sn-con-editor-sidebar-preview {
  width: 270px;
  flex: none;
}
.wp-block[data-type="sunatec/ar-body"].is-selected .sn-con-editor-sidebar-preview {
  outline: none;
  box-shadow: 0 0 0 2px var(--wp-admin-theme-color, #007cba);
  z-index: 2;
}
.sn-ar-editor-main-wrap {
  flex: 1;
  min-width: 0;
}
.sn-ar-editor-main-wrap,
.sn-ar-editor-main-wrap > .block-editor-inner-blocks,
.sn-ar-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.sn-ar-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sn-ar-editor-main-wrap .wp-block[data-type="sunatec/ar-intro"],
.sn-ar-editor-main-wrap .wp-block[data-type="sunatec/ar-monthly"],
.sn-ar-editor-main-wrap .wp-block[data-type="sunatec/ar-overall"] {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   EDITOR — rm-body wrapper (same pattern as mm-body / bn-body / ar-body).
───────────────────────────────────────────────────────────────────────── */
.is-root-container:has(> .wp-block[data-type="sunatec/rm-body"]),
.is-root-container.block-editor-block-list__layout:has(> .wp-block[data-type="sunatec/rm-body"]),
.editor-styles-wrapper .is-root-container:has(> .wp-block[data-type="sunatec/rm-body"]) {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.is-root-container > .wp-block[data-type="sunatec/rm-body"],
.editor-styles-wrapper .is-root-container > .wp-block[data-type="sunatec/rm-body"] {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.wp-block[data-type="sunatec/rm-body"] {
  max-width: none !important;
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
}
.wp-block[data-type="sunatec/rm-body"]::before,
.wp-block[data-type="sunatec/rm-body"]::after {
  content: none !important;
}
.wp-block[data-type="sunatec/rm-body"] > * {
  max-width: none !important;
  width: 100% !important;
}
.wp-block[data-type="sunatec/rm-body"] .sn-con-editor-sidebar-preview {
  width: 270px;
  flex: none;
}
.wp-block[data-type="sunatec/rm-body"].is-selected .sn-con-editor-sidebar-preview {
  outline: none;
  box-shadow: 0 0 0 2px var(--wp-admin-theme-color, #007cba);
  z-index: 2;
}
.sn-rm-editor-main-wrap {
  flex: 1;
  min-width: 0;
}
.sn-rm-editor-main-wrap,
.sn-rm-editor-main-wrap > .block-editor-inner-blocks,
.sn-rm-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.sn-rm-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sn-rm-editor-main-wrap .wp-block[data-type="sunatec/rm-list"] {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   EDITOR — esg-body / es-body wrapper (same pattern as mm-body / bn-body / etc).
───────────────────────────────────────────────────────────────────────── */
.is-root-container:has(> .wp-block[data-type="sunatec/esg-body"]),
.is-root-container:has(> .wp-block[data-type="sunatec/es-body"]),
.is-root-container.block-editor-block-list__layout:has(> .wp-block[data-type="sunatec/esg-body"]),
.is-root-container.block-editor-block-list__layout:has(> .wp-block[data-type="sunatec/es-body"]),
.editor-styles-wrapper .is-root-container:has(> .wp-block[data-type="sunatec/esg-body"]),
.editor-styles-wrapper .is-root-container:has(> .wp-block[data-type="sunatec/es-body"]) {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.is-root-container > .wp-block[data-type="sunatec/esg-body"],
.is-root-container > .wp-block[data-type="sunatec/es-body"],
.editor-styles-wrapper .is-root-container > .wp-block[data-type="sunatec/esg-body"],
.editor-styles-wrapper .is-root-container > .wp-block[data-type="sunatec/es-body"] {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.wp-block[data-type="sunatec/esg-body"],
.wp-block[data-type="sunatec/es-body"] {
  max-width: none !important;
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
}
.wp-block[data-type="sunatec/esg-body"]::before,
.wp-block[data-type="sunatec/esg-body"]::after,
.wp-block[data-type="sunatec/es-body"]::before,
.wp-block[data-type="sunatec/es-body"]::after {
  content: none !important;
}
.wp-block[data-type="sunatec/esg-body"] > *,
.wp-block[data-type="sunatec/es-body"] > * {
  max-width: none !important;
  width: 100% !important;
}
.wp-block[data-type="sunatec/esg-body"] .sn-con-editor-sidebar-preview,
.wp-block[data-type="sunatec/es-body"] .sn-con-editor-sidebar-preview {
  width: 279px;
  flex: none;
}
.wp-block[data-type="sunatec/esg-body"].is-selected .sn-con-editor-sidebar-preview,
.wp-block[data-type="sunatec/es-body"].is-selected .sn-con-editor-sidebar-preview {
  outline: none;
  box-shadow: 0 0 0 2px var(--wp-admin-theme-color, #007cba);
  z-index: 2;
}
.sn-esg-editor-main-wrap,
.sn-es-editor-main-wrap {
  flex: 1;
  min-width: 0;
}
.sn-esg-editor-main-wrap,
.sn-esg-editor-main-wrap > .block-editor-inner-blocks,
.sn-esg-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout,
.sn-es-editor-main-wrap,
.sn-es-editor-main-wrap > .block-editor-inner-blocks,
.sn-es-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.sn-esg-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout,
.sn-es-editor-main-wrap > .block-editor-inner-blocks > .block-editor-block-list__layout {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.sn-esg-editor-main-wrap .wp-block[data-type="sunatec/esg-intro"],
.sn-esg-editor-main-wrap .wp-block[data-type="sunatec/esg-features"],
.sn-esg-editor-main-wrap .wp-block[data-type="sunatec/esg-members"],
.sn-esg-editor-main-wrap .wp-block[data-type="sunatec/esg-flow"],
.sn-esg-editor-main-wrap .wp-block[data-type="sunatec/esg-apply"],
.sn-esg-editor-main-wrap .wp-block[data-type="sunatec/esg-faq"],
.sn-es-editor-main-wrap .wp-block[data-type="sunatec/es-intro"],
.sn-es-editor-main-wrap .wp-block[data-type="sunatec/es-link"],
.sn-es-editor-main-wrap .wp-block[data-type="sunatec/es-register"],
.sn-es-editor-main-wrap .wp-block[data-type="sunatec/es-security"],
.sn-es-editor-main-wrap .wp-block[data-type="sunatec/es-faq"] {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}
