@charset "UTF-8";

/* ---- サイトマップ / 個人情報保護方針 / サイトご利用にあたって ---- */

#utility_page {
  --section-color: var(--medix-blue-deep);
  --line-color: var(--medix-blue-deep);
  padding-bottom: 3em;
}

#utility_page .utility_lead {
  max-width: 46em;
  margin: 0 0 1.5em;
  line-height: 1.9;
}

#utility_page .utility_body {
  width: 100%;
  max-width: none;
  line-height: 1.95;
}

#utility_page .utility_body > *:not(:last-child) {
  margin-bottom: 1.35em;
}

#utility_page .utility_body h2 {
  margin: 2em 0 0.85em;
  padding: 0.15em 0 0.15em 0.75em;
  border-left: 4px solid #8094dd;
  border-left-color: var(--medix-blue-deep);
  font-size: clamp(1.2em, 2.4vw, 1.45em);
  font-weight: 700;
  line-height: 1.45;
  color: #8094dd;
  color: var(--medix-blue-deep);
}

#utility_page .utility_body h2:first-child {
  margin-top: 0;
}

#utility_page .utility_body h3 {
  margin: 1.75em 0 0.75em;
  font-size: 1.15em;
  font-weight: 700;
  color: #8094dd;
  color: var(--medix-blue-deep);
}

#utility_page .utility_body h4 {
  margin: 1.35em 0 0.55em;
  font-size: 1.02em;
  font-weight: 700;
}

#utility_page .utility_body a {
  color: #8094dd;
  color: var(--medix-blue-deep);
  text-decoration: underline;
}

#utility_page .utility_body a:hover {
  color: #e86162;
  color: var(--medix-footer-accent);
}

#utility_page .utility_body ol.num,
#utility_page .utility_body ul.dot {
  margin: 0 0 1em;
  padding-left: 1.4em;
}

#utility_page .utility_body ol.num li:not(:last-child),
#utility_page .utility_body ul.dot li:not(:last-child) {
  margin-bottom: 0.55em;
}

#utility_page .policy_contact {
  margin-top: 1em;
  padding: 1.25em 1.35em;
  background: #f3f6fa;
  border: 1px solid rgba(128, 148, 221, 0.12);
  line-height: 1.85;
}

/* ---- 個人情報保護方針（セクション区切り） ---- */
#utility_page.privacy .utility_body > .policy_block:not(:last-child) {
  margin-bottom: 0;
}

#utility_page.privacy .policy_block + .policy_block {
  margin-top: 2.25em;
  padding-top: 1.75em;
  border-top: 1px solid rgba(128, 148, 221, 0.22);
}

#utility_page.privacy .policy_block > h2:first-child,
#utility_page.privacy .policy_block > h3:first-child {
  margin-top: 0;
}

#utility_page.privacy .policy_block > h3:first-child {
  padding: 0.15em 0 0.15em 0.75em;
  border-left: 4px solid #8094dd;
  border-left-color: var(--medix-blue-deep);
  font-size: clamp(1.2em, 2.4vw, 1.45em);
}

/* ---- sitemap（flex 2カラム・等高なし） ---- */
#utility_page .sitemap_list {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-align-content: flex-start;
  align-content: flex-start;
  gap: 1.35em 3em;
  margin: 0;
  padding: 0;
}

#utility_page .sitemap_block {
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 calc(50% - 1.5em);
  flex: 0 1 calc(50% - 1.5em);
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

#utility_page .sitemap_block .block_title {
  margin: 0 0 0.45em;
  padding: 0.05em 0 0.05em 0.65em;
  border-left: 4px solid #e86162;
  border-left-color: var(--medix-footer-accent);
  font-size: 1.05em;
  font-weight: 700;
  line-height: 1.4;
  color: #8094dd;
  color: var(--medix-blue-deep);
}

#utility_page .sitemap_links {
  margin: 0;
  padding: 0;
  list-style: none;
}

#utility_page .sitemap_links li:not(:last-child) {
  margin-bottom: 0.22em;
}

#utility_page .sitemap_links .sitemap_group_label {
  margin-top: 0.65em;
  margin-bottom: 0.15em;
  font-size: 0.92em;
  font-weight: 700;
  color: #8094dd;
  color: var(--medix-blue-deep);
}

#utility_page .sitemap_links .sitemap_group_label:first-child {
  margin-top: 0;
}

#utility_page .sitemap_links a {
  position: relative;
  display: inline-block;
  padding-left: 0.9em;
  color: #333;
  text-decoration: none;
  line-height: 1.4;
}

#utility_page .sitemap_links a::before {
  position: absolute;
  top: 0.48em;
  left: 0;
  content: "";
  display: block;
  width: 0.32em;
  height: 0.32em;
  border-radius: 50%;
  background: #e86162;
  background: var(--medix-footer-accent);
}

#utility_page .sitemap_links a:hover {
  color: #8094dd;
  color: var(--medix-blue-deep);
}

@media screen and (max-width: 768px) {
  #utility_page .sitemap_list {
    gap: 1.15em;
  }

  #utility_page .sitemap_block {
    -webkit-flex: 1 1 100%;
    flex: 1 1 100%;
  }
}
