@charset "UTF-8";
@layer reset,library,componentUiLow,componentUiMiddle,componentUiHigh,componentCommon,componentPage,utils;
:root {
  --leading-trim: calc((1em - 1lh) / 2);
}
@layer reset {
  * {
    box-sizing: border-box;
  }
  *:before,
  *:after {
    box-sizing: border-box;
  }
  html {
    background: #ecf2f7;
    block-size: 100%;
    color: #526b81;
    inline-size: 100%;
    line-height: 1;
  }
  body {
    background-attachment: fixed;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    border-block: 0;
    border-inline: 0;
    font-family: Helvetica Neue, arial, Hiragino Kaku Gothic ProN, Hiragino Sans,
      meiryo, sans-serif;
    font-weight: 400;
    inline-size: 100%;
    line-height: 1.6;
    margin-block: 0;
    margin-inline: 0;
    overflow: clip auto;
    padding-block: 0;
    padding-inline: 0;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  article,
  aside,
  details,
  figcaption,
  include,
  footer,
  header,
  hgroup,
  main,
  nav,
  section,
  summary,
  figure {
    display: block;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  dl,
  dt,
  dd,
  p,
  blockquote,
  ul,
  ol,
  li {
    margin-block: 0;
    margin-inline: 0;
    -webkit-overflow-wrap: break-word;
    overflow-wrap: break-word;
    padding-block: 0;
    padding-inline: 0;
    vertical-align: baseline;
    -webkit-word-wrap: break-word;
    word-wrap: break-word;
  }
  ul,
  ol {
    list-style: none;
  }
  figcaption,
  span {
    -webkit-overflow-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-word-wrap: break-word;
    word-wrap: break-word;
  }
  audio,
  canvas,
  progress,
  video {
    display: inline-block;
    vertical-align: baseline;
  }
  audio:not([controls]) {
    block-size: 0;
    display: none;
  }
  [hidden]:not([hidden="until-found"]),
  template {
    display: none;
  }
  a {
    color: #0071ea;
    cursor: pointer;
    text-decoration: none;
    transition: 0.3s color, 0.3s opacity, 0.3s background-color,
      0.3s border-color;
  }
  a:link,
  a:visited {
    color: #0071ea;
    text-decoration: none;
  }
  @media (any-hover: hover) {
    a:hover,
    a:active {
      color: #5ba6f6;
      text-decoration: underline;
    }
  }
  button {
    cursor: pointer;
    font-family: Helvetica Neue, arial, Hiragino Kaku Gothic ProN, Hiragino Sans,
      meiryo, sans-serif;
    font-weight: 400;
  }
  abbr[title] {
    border-block-end: 1px dotted;
  }
  i,
  em,
  address {
    font-style: normal;
  }
  b,
  strong,
  em {
    font-weight: 700;
  }
  dfn {
    font-style: italic;
  }
  mark {
    background-color: #ffc107;
    color: #2f3a3a;
  }
  small {
    font-size: 100%;
  }
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sup {
    inset-block-start: -0.5em;
  }
  sub {
    inset-block-end: -0.25em;
  }
  img {
    block-size: auto;
    border-block: none;
    border-inline: none;
    interpolation-mode: bicubic;
    max-inline-size: 100%;
    vertical-align: top;
  }
  svg {
    overflow: hidden;
  }
  hr {
    block-size: 0;
    box-sizing: content-box;
  }
  pre {
    overflow: auto;
  }
  code,
  kbd,
  pre,
  samp {
    font-family: Helvetica Neue, arial, Hiragino Kaku Gothic ProN, Hiragino Sans,
      meiryo, sans-serif;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    font-size: 0.625rem;
  }
  table {
    border-collapse: collapse;
    border-spacing: 0;
  }
  td,
  th {
    padding-block: 0;
    padding-inline: 0;
  }
  body,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  dl,
  dt,
  dd,
  p,
  blockquote,
  ul,
  ol,
  li {
    font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
  }
  [role="tabpanel"]:target {
    display: revert;
  }
  @view-transition {
    navigation: auto;
  }
  form {
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
  }
  fieldset {
    border: none;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
  }
  legend {
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
  }
  optgroup {
    font-weight: 700;
  }
  label {
    cursor: pointer;
    display: block;
  }
  button,
  input,
  optgroup,
  select,
  textarea {
    box-sizing: border-box;
    color: #526b81;
    font-family: Helvetica Neue, arial, Hiragino Kaku Gothic ProN, Hiragino Sans,
      meiryo, sans-serif;
    font-weight: 400;
    line-height: 1.6;
    margin-block: 0;
    margin-inline: 0;
    outline: 0;
    font-size: 1rem;
  }
  button::-moz-focus-inner,
  input::-moz-focus-inner {
    border: none;
    padding-block: 0;
    padding-inline: 0;
  }
  input[type="text"],
  input[type="tel"],
  input[type="email"],
  input[type="date"],
  input[type="month"],
  input[type="search"],
  input[type="password"],
  input[type="reset"],
  input[type="number"] {
    appearance: none;
    line-height: 1.6;
    font-size: 1rem;
  }
  input:focus {
    outline: 0;
  }
  input:disabled {
    cursor: not-allowed;
  }
  input[type="file"]:disabled {
    cursor: not-allowed;
  }
  input[readonly] {
    pointer-events: none;
  }
  @media (any-hover: hover) {
    input[readonly]:hover {
      pointer-events: none;
    }
  }
  input[type="number"] {
    appearance: textfield;
  }
  input[type="number"]::-webkit-inner-spin-button,
  input[type="number"]::-webkit-outer-spin-button {
    appearance: none;
    block-size: auto;
    margin-block: 0;
    margin-inline: 0;
  }
  input[type="button"],
  input[type="submit"] {
    cursor: pointer;
  }
  input[type="button"]:disabled,
  input[type="submit"]:disabled {
    cursor: not-allowed;
  }
  button,
  html input[type="button"],
  input[type="reset"],
  input[type="submit"] {
    appearance: button;
    cursor: pointer;
  }
  button[disabled],
  html input[disabled] {
    cursor: not-allowed;
  }
  select {
    appearance: none;
    cursor: pointer;
    line-height: 1.6;
  }
  select:focus {
    outline: 0;
  }
  select:disabled {
    cursor: not-allowed;
  }
  select[readonly] {
    pointer-events: none;
  }
  @media (any-hover: hover) {
    select[readonly]:hover {
      pointer-events: none;
    }
  }
  textarea {
    appearance: none;
    field-sizing: content;
    line-height: 1.6;
    resize: vertical;
    font-size: 1rem;
  }
  textarea:focus {
    outline: 0;
  }
  textarea:disabled {
    cursor: not-allowed;
  }
  textarea[readonly] {
    pointer-events: none;
  }
  @media (any-hover: hover) {
    textarea[readonly]:hover {
      pointer-events: none;
    }
  }
  :placeholder {
    color: #c2c0bf;
  }
  ::placeholder {
    color: #c2c0bf;
  }
  :input-placeholder {
    color: #c2c0bf;
  }
  ::input-placeholder {
    color: #c2c0bf;
  }
  input:placeholder,
  textarea:placeholder {
    color: #c2c0bf;
  }
  input::placeholder,
  textarea::placeholder {
    color: #c2c0bf;
  }
  input:input-placeholder,
  textarea:input-placeholder {
    color: #c2c0bf;
  }
  input::input-placeholder,
  textarea::input-placeholder {
    color: #c2c0bf;
  }
  input:focus:placeholder,
  textarea:focus:placeholder {
    color: transparent;
  }
  input:focus::placeholder,
  textarea:focus::placeholder {
    color: transparent;
  }
  input:focus:input-placeholder,
  textarea:focus:input-placeholder {
    color: transparent;
  }
  input:focus::input-placeholder,
  textarea:focus::input-placeholder {
    color: transparent;
  }
}
@layer componentUiLow {
  .SvgIcon {
    display: inline-flex;
  }
  .SvgIcon:before {
    aspect-ratio: 1/1;
    background-color: #000;
    block-size: auto;
    content: "";
    display: block;
    inline-size: 24px;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    transition: 0.3s background-color;
  }
  .SvgIcon--x:before {
    mask-image: url(../img/icon-x.svg);
  }
  .SvgIcon--youtube:before {
    mask-image: url(../img/icon-youtube.svg);
  }
  .SvgIcon--instagram:before {
    mask-image: url(../img/icon-instagram.svg);
  }
  .SvgIcon--tiktok:before {
    mask-image: url(../img/icon-tiktok.svg);
  }
  .SvgIcon--facebook:before {
    mask-image: url(../img/icon-facebook.svg);
  }
  .SvgIcon--pinterest:before {
    mask-image: url(../img/icon-pinterest.svg);
  }
  .SvgIcon--fine:before {
    mask-image: url(../img/icon-fine.svg);
  }
  .SvgIcon--normal:before {
    mask-image: url(../img/icon-normal.svg);
  }
  .SvgIcon--bad:before {
    mask-image: url(../img/icon-bad.svg);
  }
  .SvgIcon--dashboard:before {
    mask-image: url(../img/icon-dashboard.svg);
  }
  .SvgIcon--trackChanges:before {
    mask-image: url(../img/icon-track-changes.svg);
  }
  .SvgIcon--troubleshoot:before {
    mask-image: url(../img/icon-troubleshoot.svg);
  }
  .SvgIcon--syncSavedLocally:before {
    mask-image: url(../img/icon-sync-saved-locally.svg);
  }
  .SvgIcon--campaign:before {
    mask-image: url(../img/icon-campaign.svg);
  }
  .SvgIcon--travelExplore:before {
    mask-image: url(../img/icon-travel-explore.svg);
  }
  .SvgIcon--screenSearchDesktop:before {
    mask-image: url(../img/icon-screen-search-desktop.svg);
  }
  .SvgIcon--travelExploreSearch:before {
    mask-image: url(../img/icon-travel-explore-search.svg);
  }
  .SvgIcon--awardStar:before {
    mask-image: url(../img/icon-award-star.svg);
  }
  .SvgIcon--bookmarkStar:before {
    mask-image: url(../img/icon-bookmark-star.svg);
  }
  .SvgIcon--tour:before {
    mask-image: url(../img/icon-tour.svg);
  }
  .SvgIcon--whereToVote:before {
    mask-image: url(../img/icon-where-to-vote.svg);
  }
  .SvgIcon--callMade:before {
    mask-image: url(../img/icon-call-made.svg);
  }
  .SvgIcon--southEast:before {
    mask-image: url(../img/icon-south-east.svg);
  }
  .SvgIcon--emojiObjects:before {
    mask-image: url(../img/icon-emoji-objects.svg);
  }
  .SvgIcon--strategy:before {
    mask-image: url(../img/icon-strategy.svg);
  }
  .SvgIcon--arrowRight:before {
    mask-image: url(../img/icon-arrow-right.svg);
  }
  .SvgIcon--arrowLeft:before {
    mask-image: url(../img/icon-arrow-left.svg);
  }
  .SvgIcon--arrowDown:before {
    mask-image: url(../img/icon-arrow-down.svg);
  }
  .SvgIcon--triangleTop:before {
    mask-image: url(../img/icon-triangle-top.svg);
  }
  .SvgIcon--triangleLeft:before {
    mask-image: url(../img/icon-triangle-left.svg);
  }
  .SvgIcon--close:before {
    mask-image: url(../img/icon-close.svg);
  }
  .SvgIcon--question:before {
    mask-image: url(../img/icon-question.svg);
  }
  .SvgIcon--fullscreen:before {
    mask-image: url(../img/icon-fullscreen.svg);
  }
  .SvgIcon--fullscreenExit:before {
    mask-image: url(../img/icon-fullscreen-exit.svg);
  }
  .SvgIcon--download:before {
    mask-image: url(../img/icon-download.svg);
  }
  .SvgIcon--attachFile:before {
    mask-image: url(../img/icon-attach-file.svg);
  }
  .SvgIcon--hotelClass:before {
    mask-image: url(../img/icon-hotel-class.svg);
  }
  .SvgIcon--keyVertical:before {
    mask-image: url(../img/icon-key-vertical.svg);
  }
  .SvgIcon--currencyYen:before {
    mask-image: url(../img/icon-currency-yen.svg);
  }
  .SvgIcon--accountBalanceWallet:before {
    mask-image: url(../img/icon-account-balance-wallet.svg);
  }
  .SvgIcon--edit:before {
    mask-image: url(../img/icon-edit.svg);
  }
  .SvgIcon--markChatRead:before {
    mask-image: url(../img/icon-mark-chat-read.svg);
  }
  .SvgIcon--delete:before {
    mask-image: url(../img/icon-delete.svg);
  }
  .SvgIcon--exitToApp:before {
    mask-image: url(../img/icon-exit-to-app.svg);
  }
  .StatusIcon.StatusIcon--fine .StatusIconBadge {
    background-color: #f38b3f;
  }
  .StatusIcon.StatusIcon--fine .StatusIconContents__text {
    color: #f38b3f;
  }
  .StatusIcon.StatusIcon--normal .StatusIconBadge {
    background-color: #999;
  }
  .StatusIcon.StatusIcon--normal .StatusIconContents__text {
    color: #999;
  }
  .StatusIcon.StatusIcon--bad .StatusIconBadge {
    background-color: #3d7fcc;
  }
  .StatusIcon.StatusIcon--bad .StatusIconContents__text {
    color: #3d7fcc;
  }
  .StatusIcon {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto;
  }
  .StatusIconBadge {
    align-items: center;
    aspect-ratio: 1/1;
    block-size: auto;
    border-radius: 4px;
    display: flex;
    inline-size: 32px;
    justify-content: center;
  }
  .StatusIconBadge__icon:before {
    background-color: #fff;
    inline-size: 20px;
  }
  .StatusIconContents__text {
    display: block;
    font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
    font-weight: 400;
  }
  .LayoutInner.LayoutInner--large {
    max-inline-size: 1264px;
  }
  .LayoutInner.LayoutInner--full {
    max-inline-size: none;
  }
  .LayoutInner {
    inline-size: 100%;
    margin-block: 0;
    margin-inline: auto;
    max-inline-size: 992px;
    padding-block: 0;
    padding-inline: 4vi;
  }
  @media screen and (width >= 576px), print {
    .LayoutInner {
      padding-inline: 4.6vi;
    }
  }
  @media screen and (width >= 768px), print {
    .LayoutInner {
      padding-inline: 32px;
    }
  }
  .LayoutWrapper {
    display: flex;
    flex-direction: column;
    min-block-size: 100svb;
    position: relative;
  }
  @media screen and (width >= 576px), print {
    .LayoutMain.LayoutMain--noSpace {
      padding-inline-start: 0;
    }
  }
  @media screen and (width >= 576px), print {
    .LayoutMain {
      padding-inline-start: clamp(200px, 172px + 7.69vi, 280px);
    }
  }
  .LayoutSection.LayoutSection--notTopSpace {
    padding-block-start: 0;
  }
  .LayoutSection.LayoutSection--notBottomSpace {
    padding-block-end: 0;
  }
  .LayoutSection.LayoutSection--bottomLargeSpace {
    padding-block-end: clamp(16px, 13px + 0.77vi, 24px);
  }
  .LayoutSection {
    padding-block: clamp(8px, 7px + 0.38vi, 12px);
    padding-inline: 0;
  }
  .LayoutContainer.LayoutContainer--noSpace {
    padding-block: 0;
    padding-inline: 0;
  }
  .LayoutContainer.LayoutContainer--radiusSmall {
    border-radius: 10px;
  }
  .LayoutContainer {
    background-color: #fff;
    border-radius: 20px;
    box-shadow: 0 4px 10px #8190a226;
    padding-block: clamp(16px, 13px + 0.77vi, 24px);
    padding-inline: clamp(16px, 13px + 0.77vi, 24px);
  }
  .PageTitle {
    padding-block-start: 64px;
  }
  @media screen and (width >= 576px), print {
    .PageTitle {
      padding-block-start: 0;
    }
  }
  .PageTitle__wrapper {
    padding-block: clamp(16px, 19px + -0.77vi, 8px);
  }
  .PageTitle__container {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 16px 24px;
  }
  .PageTitle__contents {
    display: flex;
    flex-grow: 1;
  }
  .PageTitle__title {
    color: #526b81;
    font-size: clamp(1.5rem, 1.413rem + 0.38vi, 1.75rem);
    font-weight: 700;
  }
  .PageTitleBack {
    flex-shrink: 0;
    margin-inline-end: 16px;
    padding-block-start: 10px;
  }
  .PageTitleBack__button {
    align-items: center;
    background-color: transparent;
    block-size: auto;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    display: flex;
    inline-size: auto;
    justify-content: center;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    position: relative;
    text-align: start;
    text-decoration: none;
  }
  @media (any-hover: hover) {
    .PageTitleBack__button:hover .PageTitleBack__icon:before {
      background-color: #8fbad9;
    }
  }
  .PageTitleBack__icon:before {
    background-color: #0881d8;
    inline-size: 16px;
  }
  .SectionTitle__container {
    display: flex;
    flex-wrap: wrap;
    margin-block: clamp(-8px, -5px + -0.77vi, -16px) 0;
    margin-inline: clamp(-8px, -5px + -0.77vi, -16px) 0;
  }
  .SectionTitle__container > * {
    padding-block: clamp(8px, 5px + 0.77vi, 16px) 0;
    padding-inline: clamp(8px, 5px + 0.77vi, 16px) 0;
  }
  .SectionTitle__contents {
    align-items: flex-start;
    display: flex;
  }
  .SectionTitle__title {
    color: #333;
    font-size: clamp(1.375rem, 1.288rem + 0.38vi, 1.625rem);
    font-weight: 700;
  }
  .SectionTitle__sidepeakTrigger {
    flex-shrink: 0;
    margin-inline-start: 2px;
  }
  .SectionTitle__select {
    align-items: center;
    display: flex;
    flex-shrink: 0;
  }
  .SectionTitleButtons {
    margin-inline-start: auto;
  }
  .SectionTitleButtons__items {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-block: clamp(-8px, -5px + -0.77vi, -16px) 0;
    margin-inline: clamp(-8px, -5px + -0.77vi, -16px) 0;
  }
  .SectionTitleButtons__item {
    padding-block: clamp(8px, 5px + 0.77vi, 16px) 0;
    padding-inline: clamp(8px, 5px + 0.77vi, 16px) 0;
  }
  .SectionTitleButtons__icon {
    flex-shrink: 0;
    margin-inline-end: 2px;
  }
  .SectionTitleButtons__icon:before {
    background-color: #0881d8;
    inline-size: 16px;
  }
  .EmptyMessage__container {
    padding-block: 40px;
    padding-inline: 24px;
  }
  .EmptyMessage__paragraph {
    text-align: center;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 700;
  }
  .ReportCard {
    block-size: 100%;
  }
  .ReportCard__container {
    block-size: 100%;
    display: flex;
    flex-direction: column;
  }
  .ReportCardTitle {
    align-items: flex-start;
    display: flex;
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--liteblue {
    background: linear-gradient(90deg, #29beed 0, #45d6d6);
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--pink {
    background: linear-gradient(90deg, #f16790 0, #ee8a5f);
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--yellow {
    background: linear-gradient(90deg, #ed9e27 0, #e4cf15);
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--purple {
    background: linear-gradient(90deg, #9861f1 0, #dd61f1);
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--litepurple {
    background: linear-gradient(90deg, #296bea 0, #9c77e9);
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--iteyellow {
    background: linear-gradient(90deg, #accf48 0, #e1e53a);
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--litepink {
    background: linear-gradient(90deg, #ed34c4 0, #f795e7);
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--orange {
    background: linear-gradient(90deg, #ff6524 0, #fea463);
  }
  .ReportCardTitleIcon.ReportCardTitleIcon--green {
    background: linear-gradient(90deg, #12c844 0, #96ea88);
  }
  .ReportCardTitleIcon {
    align-items: center;
    aspect-ratio: 1/1;
    border-radius: 8px;
    display: flex;
    flex-shrink: 0;
    inline-size: 48px;
    justify-content: center;
    margin-inline-end: 16px;
  }
  .ReportCardTitleIcon__icon:before {
    background-color: #fff;
  }
  .ReportCardTitle__contents {
    flex-grow: 1;
  }
  .ReportCardTitle__paragraph {
    align-items: flex-start;
    display: flex;
  }
  .ReportCardTitle__title {
    color: #333;
    font-size: clamp(1.125rem, 1.082rem + 0.19vi, 1.25rem);
    font-weight: 700;
  }
  .ReportCardTitle__sidepeakTrigger {
    flex-shrink: 0;
    margin-inline-start: 2px;
  }
  .ReportCardTitle__subTitle {
    font-weight: 400;
    font-size: 0.875rem;
  }
  .ReportCardInfo {
    margin-block-start: auto;
    padding-block-start: 8px;
  }
  .ReportCardInfo__items {
    display: grid;
    gap: 4px;
    grid-template-columns: repeat(1, 1fr);
  }
  .ReportCardInfo__item {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: auto 1fr;
  }
  .ReportCardInfoTitle {
    font-weight: 400;
    font-size: 0.875rem;
  }
  .ReportCardInfoTitle__text {
    display: block;
  }
  .ReportCardInfoContents__items {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
  }
  .ReportCardInfoContents__main.ReportCardInfoContents__main--large {
    font-size: clamp(1.5rem, 1.413rem + 0.38vi, 1.75rem);
    font-weight: 700;
  }
  .ReportCardInfoContents__main {
    color: #333;
    display: block;
    font-size: clamp(1.25rem, 1.163rem + 0.38vi, 1.5rem);
    font-weight: 700;
  }
  .ReportCardInfoContents__sub {
    color: #333;
    display: block;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 700;
  }
  .ReportCardInfoContents__unit {
    font-weight: 700;
    font-size: 0.625rem;
  }
  .ReportCardInfoContentsComparison.ReportCardInfoContentsComparison--positive
    .ReportCardInfoContentsComparison__icon:before {
    background-color: #11af80;
  }
  .ReportCardInfoContentsComparison.ReportCardInfoContentsComparison--positive
    .ReportCardInfoContentsComparison__text {
    color: #11af80;
  }
  .ReportCardInfoContentsComparison.ReportCardInfoContentsComparison--negative
    .ReportCardInfoContentsComparison__icon:before {
    background-color: #ec3333;
  }
  .ReportCardInfoContentsComparison.ReportCardInfoContentsComparison--negative
    .ReportCardInfoContentsComparison__text {
    color: #ec3333;
  }
  .ReportCardInfoContentsComparison {
    align-items: center;
    display: flex;
  }
  .ReportCardInfoContentsComparison__icon {
    flex-shrink: 0;
  }
  .ReportCardInfoContentsComparison__icon:before {
    inline-size: 12px;
  }
  .ReportCardInfoContentsComparison__text {
    display: block;
    font-weight: 400;
    font-size: 0.875rem;
  }
  .ReportCardStatus {
    margin-block-start: auto;
    padding-block-start: 8px;
  }
  .ConditionCard {
    padding-block: clamp(16px, 19px + -0.77vi, 8px);
    padding-inline: clamp(8px, 5px + 0.77vi, 16px);
  }
  .ConditionCard__container {
    display: grid;
    gap: 8px;
    grid-template-columns: 80px 1fr;
    grid-template-rows: auto auto;
  }
  @media screen and (width >= 576px), print {
    .ConditionCard__container {
      grid-template-columns: 1fr 1fr;
    }
  }
  .ConditionCardTitle {
    align-items: flex-start;
    display: flex;
    grid-column: 1/2;
    grid-row: 1/3;
  }
  @media screen and (width >= 576px), print {
    .ConditionCardTitle {
      grid-row: 1/2;
      justify-content: flex-end;
    }
  }
  .ConditionCardTitle__text {
    color: #333;
    font-size: clamp(1.125rem, 1.082rem + 0.19vi, 1.25rem);
    font-weight: 700;
  }
  .ConditionCardTitle__sidepeakTrigger {
    flex-shrink: 0;
    margin-inline-start: 2px;
  }
  .ConditionCardStatus {
    grid-column: 2/3;
    grid-row: 1/2;
  }
  .ConditionCardInfo {
    grid-column: 2/3;
    grid-row: 2/3;
  }
  @media screen and (width >= 576px), print {
    .ConditionCardInfo {
      display: flex;
      grid-column: 1/3;
      justify-content: center;
    }
  }
  @media screen and (width >= 576px), print {
    .ConditionCardInfo__items.ConditionCardInfo__items--icons {
      gap: 4px 16px;
      grid-template-columns: repeat(2, 1fr);
    }
  }
  .ConditionCardInfo__items {
    display: grid;
    gap: 4px;
    grid-template-columns: repeat(1, 1fr);
  }
  .ConditionCardInfo__item {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: auto 1fr;
  }
  .ConditionCardInfoTitle {
    font-weight: 400;
    font-size: 0.875rem;
  }
  .ConditionCardInfoTitle__text {
    display: block;
  }
  .ConditionCardInfoTitle__icon {
    padding-block-start: 4px;
  }
  .ConditionCardInfoTitle__icon:before {
    background-color: #526b81;
    inline-size: 24px;
  }
  .ConditionCardInfoContents__items {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
  }
  .ConditionCardInfoContents__main {
    color: #333;
    display: block;
    font-size: clamp(1.25rem, 1.163rem + 0.38vi, 1.5rem);
    font-weight: 700;
  }
  .ConditionCardInfoContents__sub {
    color: #333;
    display: block;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 700;
  }
  .ConditionCardInfoContents__small {
    font-size: 0.625rem;
  }
  .ConditionCardInfoContentsComparison.ConditionCardInfoContentsComparison--positive
    .ConditionCardInfoContentsComparison__icon:before {
    background-color: #11af80;
  }
  .ConditionCardInfoContentsComparison.ConditionCardInfoContentsComparison--positive
    .ConditionCardInfoContentsComparison__text {
    color: #11af80;
  }
  .ConditionCardInfoContentsComparison.ConditionCardInfoContentsComparison--negative
    .ConditionCardInfoContentsComparison__icon:before {
    background-color: #ec3333;
  }
  .ConditionCardInfoContentsComparison.ConditionCardInfoContentsComparison--negative
    .ConditionCardInfoContentsComparison__text {
    color: #ec3333;
  }
  .ConditionCardInfoContentsComparison {
    align-items: center;
    display: flex;
  }
  .ConditionCardInfoContentsComparison__icon {
    flex-shrink: 0;
  }
  .ConditionCardInfoContentsComparison__icon:before {
    inline-size: 12px;
  }
  .ConditionCardInfoContentsComparison__text {
    display: block;
    font-weight: 400;
    font-size: 0.75rem;
  }
  @media screen and (width >= 768px), print {
    .StrategyCard__container {
      align-items: flex-start;
      display: flex;
    }
  }
  .StrategyCardTitle.StrategyCardTitle--primary .StrategyCardTitle__container {
    background: linear-gradient(90deg, #0880d8 0, #04aadd);
  }
  .StrategyCardTitle.StrategyCardTitle--primary
    .StrategyCardTitle__icon:before {
    background-color: #fff;
  }
  .StrategyCardTitle.StrategyCardTitle--primary .StrategyCardTitle__text {
    color: #fff;
  }
  .StrategyCardTitle {
    align-items: center;
    display: flex;
    justify-content: center;
  }
  @media screen and (width >= 768px), print {
    .StrategyCardTitle {
      flex-shrink: 0;
    }
  }
  .StrategyCardTitle__container {
    align-items: center;
    aspect-ratio: 1/1;
    background-color: #edf2f5;
    border-radius: calc(infinity * 1px);
    display: flex;
    justify-content: center;
    min-inline-size: clamp(120px, 113px + 1.92vi, 140px);
  }
  .StrategyCardTitle__contents {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .StrategyCardTitle__icon:before {
    background-color: #0881d8;
    inline-size: 32px;
  }
  .StrategyCardTitle__paragraph {
    align-items: flex-start;
    display: flex;
  }
  .StrategyCardTitle__text {
    color: #0881d8;
    font-size: clamp(1.125rem, 1.082rem + 0.19vi, 1.25rem);
    font-weight: 700;
  }
  .StrategyCardTitle__sidepeakTrigger {
    flex-shrink: 0;
    margin-inline-start: 2px;
  }
  .StrategyCardContents.StrategyCardContents--emphasis
    .StrategyCardContents__icon:before {
    background-color: #eef8ff;
  }
  .StrategyCardContents.StrategyCardContents--emphasis
    .StrategyCardContents__container {
    background-color: #eef8ff;
  }
  .StrategyCardContents {
    margin-block-start: 8px;
    padding-block-start: 20px;
    position: relative;
  }
  @media screen and (width >= 768px), print {
    .StrategyCardContents {
      flex-grow: 1;
      margin-block-start: 0;
      margin-inline-start: 8px;
      padding-block-start: 0;
      padding-inline-start: 20px;
    }
  }
  .StrategyCardContents__icon {
    inset-block-start: 0;
    inset-inline-start: 50%;
    position: absolute;
    translate: -50% 0;
  }
  .StrategyCardContents__icon:before {
    background-color: #edf2f5;
    inline-size: 24px;
  }
  @media screen and (width >= 768px), print {
    .StrategyCardContents__icon {
      inset-block-start: 24px;
      inset-inline-start: 0;
      translate: 0;
    }
  }
  .StrategyCardContents__container {
    background-color: #edf2f5;
    border-radius: 10px;
    padding-block: 24px;
    padding-inline: 24px;
  }
  .StrategyCardContents__paragraph {
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 400;
  }
  .StrategyCardListBottom {
    align-items: center;
    display: flex;
    justify-content: center;
    margin-block-start: clamp(32px, 29px + 0.77vi, 40px);
  }
  .StrategyCardListBottom__icon {
    flex-shrink: 0;
    margin-inline-start: 4px;
  }
  .StrategyCardListBottom__icon:before {
    background-color: #0881d8;
    inline-size: 10px;
  }
  .StrategyArticleCard {
    align-items: center;
    background-color: transparent;
    block-size: 100%;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    color: #333;
    display: flex;
    inline-size: 100%;
    justify-content: flex-start;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 16px;
    padding-inline: 0;
    position: relative;
    text-align: start;
    text-decoration: none;
    transition: 0.3s color, 0.3s opacity;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 400;
  }
  @media (any-hover: hover) {
    .StrategyArticleCard:hover {
      color: #0881d8;
    }
  }
  .StrategyArticleCard__container {
    align-items: flex-start;
    display: flex;
  }
  .StrategyArticleCard__text {
    display: block;
  }
  .StrategyArticleCard__icon {
    flex-shrink: 0;
    margin-block-start: clamp(4px, 3px + 0.19vi, 6px);
    margin-inline-start: 4px;
  }
  .StrategyArticleCard__icon:before {
    background-color: #0881d8;
    inline-size: 16px;
  }
  .RankingCard {
    align-items: center;
    display: grid;
    grid-column: span 2;
    grid-template-columns: subgrid;
  }
  .RankingCardNumber__container {
    align-items: center;
    background-color: #8fbad9;
    border-radius: calc(infinity * 1px);
    color: #fff;
    display: flex;
    justify-content: center;
    padding-block: 4px;
    padding-inline: 4px;
    font-weight: 700;
    font-size: 0.75rem;
  }
  .RankingCardNumber__container:where(
      .RankingCardNumber--gold .RankingCardNumber__container
    ) {
    background: linear-gradient(180deg, #f3d772 0, #d9b531);
  }
  .RankingCardNumber__container:where(
      .RankingCardNumber--silver .RankingCardNumber__container
    ) {
    background: linear-gradient(180deg, #dedede 0, #a7a7a7);
  }
  .RankingCardNumber__container:where(
      .RankingCardNumber--bronze .RankingCardNumber__container
    ) {
    background: linear-gradient(180deg, #d0a17f 0, #936d51);
  }
  .RankingCardNumber__image.RankingCardNumber__image--left {
    margin-inline-end: 2px;
    mask-image: url(../img/img-ranking-card-left.svg);
  }
  .RankingCardNumber__image.RankingCardNumber__image--right {
    margin-inline-start: 2px;
    mask-image: url(../img/img-ranking-card-right.svg);
  }
  .RankingCardNumber__image {
    background-color: #fff;
    block-size: 24px;
    display: block;
    flex-shrink: 0;
    inline-size: 10px;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
  }
  .RankingCardContents__container {
    align-items: center;
    display: flex;
  }
  .RankingCardContents__title {
    color: #000;
    font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
    font-weight: 400;
  }
  .RankingCardCount {
    align-items: center;
    align-items: baseline;
    color: #333;
    display: flex;
    flex-shrink: 0;
    line-height: 1;
    margin-inline-start: 8px;
  }
  .RankingCardCount__number {
    display: block;
    font-size: clamp(1.25rem, 1.163rem + 0.38vi, 1.5rem);
    font-weight: 700;
  }
  .RankingCardCount__unit {
    display: block;
    margin-inline-start: 4px;
    font-weight: 700;
    font-size: 0.625rem;
  }
  .BaseButton.BaseButton--disabled,
  .BaseButton[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
    pointer-events: none;
  }
  .BaseButton.BaseButton--contained {
    border-block: none;
    border-inline: none;
    box-shadow: none;
  }
  .BaseButton.BaseButton--contained:before,
  .BaseButton.BaseButton--contained:after {
    block-size: 100%;
    border-radius: calc(infinity * 1px);
    display: block;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    position: absolute;
  }
  .BaseButton.BaseButton--contained:before {
    transition: 0.3s opacity;
    z-index: 2;
  }
  .BaseButton.BaseButton--contained:after {
    z-index: 1;
  }
  .BaseButton.BaseButton--outlined {
    border-block: 1px solid;
    border-inline: 1px solid;
    box-shadow: none;
  }
  .BaseButton.BaseButton--contained.BaseButton--primary {
    color: #fff;
  }
  .BaseButton.BaseButton--contained.BaseButton--primary:before,
  .BaseButton.BaseButton--contained.BaseButton--primary:after {
    content: "";
  }
  .BaseButton.BaseButton--contained.BaseButton--primary:before {
    background: linear-gradient(90deg, #0880d8 0, #04aadd);
  }
  .BaseButton.BaseButton--contained.BaseButton--primary:after {
    background: linear-gradient(90deg, #29beed 0, #45d6d6);
  }
  @media (any-hover: hover) {
    .BaseButton.BaseButton--contained.BaseButton--primary:hover:before {
      opacity: 0;
    }
  }
  .BaseButton.BaseButton--contained.BaseButton--information {
    background-color: #0881d8;
    color: #fff;
  }
  @media (any-hover: hover) {
    .BaseButton.BaseButton--contained.BaseButton--information:hover {
      background-color: #8fbad9;
    }
  }
  .BaseButton.BaseButton--contained.BaseButton--sub {
    background-color: #ecf2f7;
    color: #0881d8;
  }
  @media (any-hover: hover) {
    .BaseButton.BaseButton--contained.BaseButton--sub:hover {
      background-color: #c6d5e1;
    }
  }
  .BaseButton.BaseButton--outlined.BaseButton--sub {
    background-color: #fff;
    border-color: #e0e7ed;
    color: #526b81;
  }
  @media (any-hover: hover) {
    .BaseButton.BaseButton--outlined.BaseButton--sub:hover {
      background-color: #e0e7ed;
    }
  }
  .BaseButton.BaseButton--medium {
    padding-block: 16px;
    padding-inline: 40px;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 400;
  }
  .BaseButton.BaseButton--small {
    padding-block: 8px;
    padding-inline: 16px;
    font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
    font-weight: 400;
  }
  .BaseButton {
    align-items: center;
    background-color: transparent;
    block-size: 100%;
    border-block: none;
    border-inline: none;
    border-radius: calc(infinity * 1px);
    display: inline-flex;
    inline-size: auto;
    justify-content: center;
    margin-block: 0;
    margin-inline: 0;
    position: relative;
    text-align: start;
    text-decoration: none;
    transition: 0.3s background-color, 0.3s color, 0.3s opacity,
      0.3s border-color;
  }
  .BaseButton__contents {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 3;
  }
  .BaseButton__text {
    display: block;
  }
  .TextButton.TextButton--disabled,
  .TextButton[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
    pointer-events: none;
  }
  .TextButton.TextButton--outlined {
    border-block: 1px solid;
    border-inline: 1px solid;
    box-shadow: none;
  }
  .TextButton.TextButton--outlined.TextButton--sub {
    background-color: #fff;
    border-color: #e0e7ed;
    color: #526b81;
  }
  @media (any-hover: hover) {
    .TextButton.TextButton--outlined.TextButton--sub:hover {
      background-color: #e0e7ed;
    }
  }
  .TextButton.TextButton--small {
    padding-block: 8px;
    padding-inline: 16px;
    font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
    font-weight: 400;
  }
  .TextButton {
    align-items: center;
    background-color: transparent;
    block-size: 100%;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    color: #526b81;
    display: inline-flex;
    inline-size: auto;
    justify-content: center;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    position: relative;
    text-align: start;
    text-decoration: none;
    transition: 0.3s color, 0.3s opacity;
    font-weight: 400;
    font-size: 0.875rem;
  }
  @media (any-hover: hover) {
    .TextButton:hover {
      color: #0881d8;
    }
  }
  .TextButton__contents {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
  }
  .TextButton__text,
  .FullModal__wrapper.IsActive {
    display: block;
  }
  .FullModal__wrapper {
    background-color: #fff;
    block-size: 100%;
    display: none;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    overflow: clip auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    position: fixed;
    z-index: 20100;
  }
  .FullModal__container {
    block-size: calc(100% + 1px);
    display: flex;
    inline-size: 100%;
  }
  .FullModal__inner {
    block-size: 100%;
  }
  .FullModal__contents {
    block-size: 100%;
    display: flex;
    inline-size: 100%;
    padding-block: 16px 32px;
  }
  .FullModalContents {
    inline-size: 100%;
    margin-block: auto;
  }
  .FullModalContentsClose {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    margin-block-end: 16px;
  }
  .FullModalContentsClose__button {
    align-items: center;
    background-color: transparent;
    border: none;
    border-radius: 0;
    display: flex;
    justify-content: center;
    padding-block: 16px;
    padding-inline: 16px 0;
    text-decoration: none;
  }
  @media (any-hover: hover) {
    .FullModalContentsClose__button:hover .FullModalContentsClose__icon:before {
      background-color: #8fbad9;
    }
  }
  .FullModalContentsClose__icon:before {
    background-color: #0881d8;
    inline-size: 16px;
  }
  .ChartModal__background.IsActive {
    display: block;
  }
  .ChartModal__background {
    background-color: #526b814d;
    block-size: 100%;
    display: none;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    position: fixed;
    z-index: 20000;
  }
  .ChartModal__wrapper.IsActive {
    display: block;
  }
  .ChartModal__wrapper {
    block-size: 100%;
    display: none;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    overflow: clip auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    position: fixed;
    z-index: 20100;
  }
  .ChartModal__container {
    block-size: calc(100% + 1px);
    display: flex;
    inline-size: 100%;
  }
  .ChartModal__inner {
    block-size: 100%;
  }
  .ChartModal__contents {
    block-size: 100%;
    display: flex;
    inline-size: 100%;
    padding-block: 40px;
  }
  .ChartModalContents {
    inline-size: 100%;
    margin-block: auto;
  }
  .ChartModalContents__contents {
    inline-size: 100%;
    margin-inline: auto;
    max-inline-size: 440px;
    overflow: hidden;
  }
  .ChartModalForm.IsActive {
    display: block;
  }
  .ChartModalForm {
    display: none;
  }
  .ChartModalTextarea__label {
    display: flex;
    position: relative;
  }
  .ChartModalTextarea__textarea {
    background-color: #fff;
    border: none;
    border-radius: 0;
    inline-size: 100%;
    max-block-size: 320px;
    min-block-size: 160px;
    padding-block: clamp(16px, 13px + 0.77vi, 24px);
    padding-inline: clamp(16px, 13px + 0.77vi, 24px);
    position: relative;
    font-size: 1rem;
  }
  .ChartModalFormButtons {
    border-block-start: 1px solid #e0e7ed;
    padding-block: 16px;
    padding-inline: 16px;
  }
  .ChartModalFormButtons__items {
    display: flex;
    justify-content: center;
    margin-block: -16px 0;
    margin-inline: -16px 0;
  }
  .ChartModalFormButtons__item {
    padding-block: 16px 0;
    padding-inline: 16px 0;
  }
  .ChartModalFormButtons__button {
    min-inline-size: 96px;
  }
  .ChartModalInfo.IsActive {
    display: block;
  }
  .ChartModalInfo {
    display: none;
  }
  .ChartModalInfoHead__container {
    align-items: center;
    display: flex;
    padding-block: 16px;
    padding-inline: 16px;
  }
  .ChartModalInfoHead__date {
    color: #526b81;
    display: block;
    flex-shrink: 0;
    margin-inline-end: 16px;
    font-weight: 400;
    font-size: 0.75rem;
  }
  .ChartModalInfoHeadButtons {
    margin-inline-start: auto;
  }
  .ChartModalInfoHeadButtons__items {
    display: flex;
    justify-content: flex-end;
    margin-block: -8px 0;
    margin-inline: -8px 0;
  }
  .ChartModalInfoHeadButtons__item {
    padding-block: 8px 0;
    padding-inline: 8px 0;
  }
  .ChartModalInfoHeadButtons__button {
    align-items: center;
    background-color: transparent;
    block-size: 100%;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    display: flex;
    inline-size: 100%;
    justify-content: center;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    position: relative;
    text-align: start;
    text-decoration: none;
  }
  @media (any-hover: hover) {
    .ChartModalInfoHeadButtons__button:hover
      .ChartModalInfoHeadButtons__icon:before {
      background-color: #0881d8;
    }
  }
  .ChartModalInfoHeadButtons__contents {
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .ChartModalInfoHeadButtons__icon:before {
    background-color: #8fbad9;
    inline-size: 20px;
  }
  .ChartModalInfoBody {
    border-block-start: 1px solid #e0e7ed;
  }
  .ChartModalInfoBody__contents {
    padding-block: clamp(16px, 13px + 0.77vi, 24px);
    padding-inline: clamp(16px, 13px + 0.77vi, 24px);
  }
  .ChartModalInfoBody__paragraph {
    color: #333;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 400;
  }
}
@layer componentUiMiddle {
  .ReportCardSlider {
    overflow: clip visible;
  }
  .ReportCardSlider__container {
    margin-inline: clamp(-4px, -3px + -0.38vi, -8px);
  }
  .ReportCardSlider__contents {
    block-size: 100%;
    padding-inline: clamp(4px, 3px + 0.38vi, 8px);
  }

  .ConditionCardList {
    display: flex;
    justify-content: center;
  }

  @media screen and (width >= 768px), print {
    .ConditionCardList__items.ConditionCardList__items--col2 {
      /* grid-template-columns: repeat(2, 1fr); */
    }
  }
  .ConditionCardList__items.ConditionCardList__items--col2
    > .ConditionCardList__item:first-of-type {
    /* border-block-start: none; */
  }
  @media screen and (width >= 768px), print {
    .ConditionCardList__items.ConditionCardList__items--col2
      > .ConditionCardList__item:nth-of-type(2n) {
      /* border-inline-end: none; */
    }
  }
  @media screen and (width >= 992px), print {
    .ConditionCardList__items.ConditionCardList__items--col2
      > .ConditionCardList__item:nth-of-type(3n) {
      /* border-inline-end: 1px solid #e0e7ed; */
    }
  }
  .ConditionCardList__items {
    /* grid-template-columns: repeat(1, 1fr); */
  }
  @media screen and (width >= 768px), print {
    .ConditionCardList__items {
      /* grid-template-columns: repeat(2, 1fr); */
    }
  }
  @media screen and (width >= 992px), print {
    .ConditionCardList__items {
      /* grid-template-columns: repeat(3, 1fr); */
    }
  }
  .ConditionCardList__items > .ConditionCardList__item:first-of-type {
    /* border-block-start: none; */
  }
  @media screen and (width >= 768px), print {
    .ConditionCardList__items > .ConditionCardList__item:nth-of-type(2n) {
      /* border-inline-end: none; */
    }
  }
  @media screen and (width >= 992px), print {
    .ConditionCardList__items > .ConditionCardList__item:nth-of-type(2n) {
      /* border-inline-end: 1px solid #e0e7ed; */
    }
  }
  @media screen and (width >= 992px), print {
    .ConditionCardList__items > .ConditionCardList__item:nth-of-type(3n) {
      /* border-inline-end: none; */
    }
  }
  .ConditionCardList__item {
    /* border-block-start: 1px solid #e0e7ed; */
  }
  @media screen and (width >= 768px), print {
    .ConditionCardList__item {
      /* border-block-start: none; */
      /* border-inline-end: 1px solid #e0e7ed; */
    }
  }
  .StrategyCardList__items {
    display: grid;
    gap: 32px 0;
    grid-template-columns: repeat(1, 1fr);
  }
  .StrategyArticleCardList__items {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(1, 1fr);
  }
  .StrategyArticleCardList__item {
    border-block-end: 1px solid #e0e7ed;
  }
  .RankingCardList__container {
    display: grid;
    gap: 0;
    gap: 0 16px;
    grid-template-columns: [column-1] auto [column-2] 1fr;
  }
  .RankingCardList__container > .RankingCard {
    border-block-start: 1px solid #e0e7ed;
    padding-block: 8px;
  }
  .RankingCardList__container > .RankingCard:first-of-type {
    border-block-start: none;
    padding-block-start: 0;
  }
  .RankingCardList__container > .RankingCard:last-of-type {
    padding-block-end: 0;
  }
  .BaseTabButtons {
    overflow: auto clip;
  }
  .BaseTabButtons__items {
    display: flex;
  }
  .BaseTabButtons__items
    > .BaseTabButtons__item:first-of-type
    .BaseTabButtons__button {
    border-radius: calc(infinity * 1px) 0 0 calc(infinity * 1px);
  }
  .BaseTabButtons__items
    > .BaseTabButtons__item:first-of-type
    .BaseTabButtons__button:after {
    content: none;
  }
  .BaseTabButtons__items
    > .BaseTabButtons__item:last-of-type
    .BaseTabButtons__button {
    border-radius: 0 calc(infinity * 1px) calc(infinity * 1px) 0;
  }
  .BaseTabButtons__item {
    flex-grow: 1;
    white-space: nowrap;
  }
  .BaseTabButtons__button {
    align-items: center;
    background-color: #ecf2f7;
    block-size: 100%;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    box-shadow: none;
    color: #0881d8;
    display: flex;
    inline-size: auto;
    justify-content: center;
    margin-block: 0;
    margin-inline: 0;
    overflow: hidden;
    padding-block: 6px;
    padding-inline: 4px;
    position: relative;
    text-align: start;
    text-decoration: none;
    transition: 0.3s color;
    font-weight: 400;
    font-size: 0.875rem;
  }
  @media (any-hover: hover) {
    .BaseTabButtons__button:hover {
      color: #fff;
    }
    .BaseTabButtons__button:hover:before {
      opacity: 1;
    }
  }
  .BaseTabButtons__button:before {
    background: linear-gradient(90deg, #0880d8 0, #04aadd);
    block-size: 100%;
    content: "";
    display: block;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    opacity: 0;
    position: absolute;
    transition: 0.3s opacity;
    z-index: 1;
  }
  .BaseTabButtons__button:after {
    background-color: #fff;
    block-size: 100%;
    content: "";
    display: block;
    inline-size: 1px;
    inset-block-start: 0;
    inset-inline-start: 0;
    position: absolute;
    z-index: 2;
  }
  .BaseTabButtons__button[role="tab"][aria-selected="true"] {
    color: #fff;
  }
  .BaseTabButtons__button[role="tab"][aria-selected="true"]:before {
    opacity: 1;
  }
  .SwitchTabButtons__radios {
    background-color: #fff;
    border-radius: calc(infinity * 1px);
    display: none;
    overflow: auto clip;
    padding-block: 4px;
    padding-inline: 4px;
  }
  @media screen and (width >= 768px), print {
    .SwitchTabButtons__radios {
      display: block;
    }
  }
  .SwitchTabButtons__items {
    display: flex;
  }
  .SwitchTabButtons__item {
    white-space: nowrap;
  }
  .SwitchTabButtons__label {
    position: relative;
  }
  .SwitchTabButtons__input {
    inset-block-start: 0;
    inset-inline-start: 0;
    opacity: 0;
    position: absolute;
  }
  .SwitchTabButtons__contents {
    align-items: center;
    background-color: transparent;
    border-radius: calc(infinity * 1px);
    color: #0881d8;
    display: flex;
    justify-content: center;
    min-inline-size: 96px;
    padding-block: 6px;
    padding-inline: 16px;
    position: relative;
    transition: 0.3s color, 0.3s background-color;
    font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
    font-weight: 400;
  }
  .SwitchTabButtons__contents:where(
      .SwitchTabButtons__label:has(.SwitchTabButtons__input:focus)
        .SwitchTabButtons__contents
    ) {
    color: #8fbad9;
  }
  .SwitchTabButtons__contents:where(
      .SwitchTabButtons__label:has(.SwitchTabButtons__input:checked)
        .SwitchTabButtons__contents
    ) {
    background-color: #0881d8;
    color: #fff;
  }
  .SwitchTabButtons__contents:where(
      .SwitchTabButtons__label:has(.SwitchTabButtons__input:checked:focus)
        .SwitchTabButtons__contents
    ) {
    background-color: #0881d8;
    color: #fff;
  }
  @media (any-hover: hover) {
    .SwitchTabButtons__contents:where(
        .SwitchTabButtons__label:has(.SwitchTabButtons__input:hover)
          .SwitchTabButtons__contents
      ) {
      color: #8fbad9;
    }
    .SwitchTabButtons__contents:where(
        .SwitchTabButtons__label:has(.SwitchTabButtons__input:checked:hover)
          .SwitchTabButtons__contents
      ) {
      background-color: #0881d8;
      color: #fff;
    }
  }
  @media screen and (width >= 768px), print {
    .SwitchTabSelect {
      display: none;
    }
  }
  .SwitchTabSelect__label {
    position: relative;
  }
  .SwitchTabSelect__input {
    background-color: #fff;
    background-image: url(../img/icon-select-background.svg);
    background-position: center right 8px;
    background-repeat: no-repeat;
    background-size: 16px;
    border: 1px solid #fff;
    border-radius: calc(infinity * 1px);
    font-weight: 700;
    inline-size: 100%;
    padding-block: 4px;
    padding-inline: 16px 32px;
    position: relative;
    transition: 0.3s color, 0.3s background-color, 0.3s border-color,
      0.3s opacity;
    width: 100%;
    font-size: 1rem;
  }
  .SwitchTabSelect__input:focus {
    border-color: #0881d8;
  }
  @media (any-hover: hover) {
    .SwitchTabSelect__input:hover {
      border-color: #0881d8;
    }
  }
  .FlatTabButtons {
    overflow: auto clip;
    position: relative;
  }
  .FlatTabButtons:after {
    background-color: #e0e7ed;
    block-size: 1px;
    content: "";
    display: block;
    inline-size: 100%;
    inset-block-end: 0;
    inset-inline-start: 0;
    position: absolute;
    z-index: 1;
  }
  .FlatTabButtons__items {
    display: flex;
  }
  .FlatTabButtons__items
    > .FlatTabButtons__item:first-of-type
    .FlatTabButtons__button {
    padding-inline-start: 0;
  }
  .FlatTabButtons__items
    > .FlatTabButtons__item:first-of-type
    .FlatTabButtons__button:after {
    inline-size: calc(100% - 12px);
    inset-inline-start: 0;
  }
  .FlatTabButtons__items
    > .FlatTabButtons__item:last-of-type
    .FlatTabButtons__button {
    padding-inline-end: 0;
  }
  .FlatTabButtons__items
    > .FlatTabButtons__item:last-of-type
    .FlatTabButtons__button:after {
    inline-size: calc(100% - 12px);
  }
  .FlatTabButtons__item {
    position: relative;
    white-space: nowrap;
  }
  .FlatTabButtons__item:after {
    background-color: #e0e7ed;
    block-size: 1px;
    content: "";
    display: block;
    inline-size: 100%;
    inset-block-end: 0;
    inset-inline-start: 0;
    position: absolute;
    z-index: 1;
  }
  .FlatTabButtons__button.FlatTabButtons__button--active {
    color: #0881d8;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 700;
  }
  .FlatTabButtons__button.FlatTabButtons__button--active:after {
    opacity: 1;
  }
  .FlatTabButtons__button {
    align-items: center;
    background-color: transparent;
    block-size: 100%;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    box-shadow: none;
    color: #526b81;
    display: flex;
    inline-size: auto;
    justify-content: center;
    margin-block: 0;
    margin-inline: 0;
    overflow: hidden;
    padding-block: 8px;
    padding-inline: 12px;
    position: relative;
    text-align: start;
    text-decoration: none;
    transition: 0.3s color, 0.3s font-size;
    font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
    font-weight: 400;
  }
  @media (any-hover: hover) {
    .FlatTabButtons__button:hover {
      color: #0881d8;
    }
  }
  .FlatTabButtons__button:after {
    background-color: #0881d8;
    block-size: 1px;
    content: "";
    display: block;
    inline-size: calc(100% - 24px);
    inset-block-end: 0;
    inset-inline-start: 12px;
    opacity: 0;
    position: absolute;
    transition: 0.3s opacity;
    z-index: 2;
  }
  .BaseTabButtons__contents {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 2;
  }
  .BaseTabContents__contents {
    margin-block-start: 16px;
  }
  .BaseSidepeakTrigger {
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .BaseSidepeakTrigger__button.BaseSidepeakTrigger__button--light {
    border-color: #fff;
  }
  @media (any-hover: hover) {
    .BaseSidepeakTrigger__button.BaseSidepeakTrigger__button--light:hover {
      background-color: #fff;
    }
    .BaseSidepeakTrigger__button.BaseSidepeakTrigger__button--light:hover
      .BaseSidepeakTrigger__icon:before {
      background-color: #0881d8;
    }
  }
  .BaseSidepeakTrigger__button.BaseSidepeakTrigger__button--light
    .BaseSidepeakTrigger__icon:before {
    background-color: #fff;
  }
  .BaseSidepeakTrigger__button {
    align-items: center;
    aspect-ratio: 1/1;
    background-color: transparent;
    block-size: auto;
    border-block: 1px solid #8fbad9;
    border-inline: 1px solid #8fbad9;
    border-radius: calc(infinity * 1px);
    display: flex;
    inline-size: 16px;
    justify-content: center;
    margin-block: 0;
    margin-inline: 0;
    overflow: hidden;
    position: relative;
    text-align: center;
    text-decoration: none;
    transition: 0.3s background-color;
  }
  @media (any-hover: hover) {
    .BaseSidepeakTrigger__button:hover {
      background-color: #e0e7ed;
    }
  }
  .BaseSidepeakTrigger__icon:before {
    background-color: #8fbad9;
    inline-size: 12px;
  }
  .BaseSidepeak__container.IsActive {
    display: block;
  }
  .BaseSidepeak__container {
    block-size: 100%;
    display: none;
    inline-size: 100%;
    inset-block-end: 0;
    inset-inline-end: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    position: fixed;
    z-index: 15100;
  }
  @media screen and (width >= 576px), print {
    .BaseSidepeak__container {
      background-color: #fff;
      border-radius: 0;
      box-shadow: 0 4px 10px #8190a226;
      inline-size: 90%;
      inset-block: 0 auto;
      max-inline-size: clamp(240px, 212px + 7.69vi, 320px);
    }
  }
  .BaseSidepeak__box {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-block-size: calc(100vb + 1px);
    min-block-size: calc(100dvb + 1px);
    padding-block-start: 40svb;
  }
  @media screen and (width >= 576px), print {
    .BaseSidepeak__box {
      display: block;
      min-block-size: auto;
      padding-block-start: 0;
    }
  }
  .BaseSidepeak__contents {
    background-color: #fff;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 4px 10px #8190a226;
    padding-block: clamp(32px, 35px + -0.77vi, 24px)
      clamp(40px, 26px + 3.85vi, 80px);
  }
  @media screen and (width >= 576px), print {
    .BaseSidepeak__contents {
      background-color: transparent;
      border-radius: 0;
      box-shadow: none;
      min-block-size: calc(100vb + 1px);
    }
  }
  .BaseSidepeakHide {
    align-items: center;
    display: flex;
    inset-block-start: clamp(40px, 43px + -0.77vi, 32px);
    inset-inline-end: 0;
    justify-content: flex-end;
    position: sticky;
  }
  .BaseSidepeakHide__button {
    align-items: center;
    background-color: transparent;
    block-size: auto;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    display: flex;
    inline-size: clamp(40px, 43px + -0.77vi, 32px);
    justify-content: flex-start;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    position: relative;
    text-align: center;
    text-decoration: none;
  }
  .BaseSidepeakHide__icon:before {
    background-color: #0881d8;
    inline-size: 24px;
  }
  .BaseSidepeakBody {
    padding-inline: clamp(24px, 21px + 0.77vi, 32px)
      clamp(40px, 43px + -0.77vi, 32px);
  }
  .BaseSidepeakBody__title {
    color: #333;
    font-size: clamp(1.25rem, 1.163rem + 0.38vi, 1.5rem);
    font-weight: 700;
  }
  .BaseSidepeakBody__subTitle {
    font-weight: 400;
    font-size: 0.75rem;
  }
  .BaseSidepeakBody__paragraph {
    margin-block-start: 16px;
    font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
    font-weight: 400;
  }
  .BaseSidepeakOverlay.IsActive {
    display: block;
  }
  .BaseSidepeakOverlay {
    background-color: transparent;
    block-size: 100%;
    display: none;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    position: fixed;
    z-index: 15000;
  }
  .BaseSidepeakOverlay__container {
    block-size: calc(100vb + 1px);
    display: block;
    inline-size: 100%;
  }
  .BaseTable__container.BaseTable__container--full {
    block-size: calc(90svb - 104px);
  }
  .BaseTable__container.BaseTable__container--inflowAnalysis {
    block-size: calc(90svb - 394px);
  }
  @media screen and (width >= 576px), print {
    .BaseTable__container.BaseTable__container--inflowAnalysis {
      block-size: calc(90svb - 496px);
    }
  }
  @media screen and (width >= 768px), print {
    .BaseTable__container.BaseTable__container--inflowAnalysis {
      block-size: calc(90svb - 440px);
    }
  }
  .BaseTable__container.BaseTable__container--seo {
    block-size: calc(90svb - 334px);
  }
  @media screen and (width >= 576px), print {
    .BaseTable__container.BaseTable__container--seo {
      block-size: calc(90svb - 466px);
    }
  }
  @media screen and (width >= 768px), print {
    .BaseTable__container.BaseTable__container--seo {
      block-size: calc(90svb - 416px);
    }
  }
  @media screen and (width >= 992px), print {
    .BaseTable__container.BaseTable__container--seo {
      block-size: calc(90svb - 416px);
    }
  }
  @media screen and (width >= 1200px), print {
    .BaseTable__container.BaseTable__container--seo {
      block-size: calc(90svb - 350px);
    }
  }
  .BaseTable__container.BaseTable__container--default {
    block-size: auto;
    max-block-size: 540px;
    min-block-size: 100px;
  }
  .BaseTable__container {
    background-color: #fff;
    block-size: calc(90svb - 64px);
    border: 1px solid #e0e7ed;
    border-radius: 5px;
    max-block-size: 900px;
    min-block-size: 300px;
    overflow: auto;
  }
  @media screen and (width >= 576px), print {
    .BaseTable__container {
      block-size: calc(90svb - 76px);
    }
  }
  .BaseTable__table {
    inline-size: 100%;
  }
  .BaseTableHead__row > .BaseTableHead__cell:last-child:after {
    content: none;
  }
  .BaseTableHead__row
    > .BaseTableHead__cell.BaseTableHead__cell--showBorderLeft:not(
      :root
    ):after {
    content: "";
  }
  .BaseTableHead__cell.BaseTableHead__cell--auto {
    white-space: normal;
  }
  .BaseTableHead__cell.BaseTableHead__cell--fixed {
    inset-block-start: 0;
    position: sticky;
    z-index: 2;
  }
  .BaseTableHead__cell.BaseTableHead__cell--small {
    padding-block: 4px;
  }
  .BaseTableHead__cell.BaseTableHead__cell--gradationBlue {
    background: linear-gradient(90deg, #0880d8 0, #04aadd);
  }
  .BaseTableHead__cell.BaseTableHead__cell--sub {
    background-color: #2ECC71
    ;
  }
  .BaseTableHead__cell.BaseTableHead__cell--subLight {
    background-color: #F39C12;
  }
  .BaseTableHead__cell.BaseTableHead__cell--yellow {
    background-color: #ffeeb0;
  }
  .BaseTableHead__cell {
    background-color: #edf2f5;
    padding-block: 12px;
    padding-inline: 16px;
    position: relative;
    white-space: nowrap;
  }
  .BaseTableHead__cell:before {
    background-color: #e0e7ed;
    block-size: 1px;
    content: "";
    inline-size: 100%;
    inset-block-end: 0;
    inset-inline-start: 0;
    position: absolute;
  }
  .BaseTableHead__cell:after {
    background-color: #e0e7ed;
    block-size: 100%;
    content: "";
    inline-size: 1px;
    inset-block-end: 0;
    inset-inline-end: 0;
    position: absolute;
  }
  .BaseTableHead__text.BaseTableHead__text--emphasis {
    font-weight: 700;
    font-size: 0.875rem;
  }
  .BaseTableHead__text.BaseTableHead__text--light {
    color: #fff;
  }
  .BaseTableHead__text {
    color: #333;
    display: block;
    font-weight: 400;
    font-size: 0.875rem;
  }
  .BaseTableHeadTitle {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .BaseTableHeadTitle__paragraph {
    align-items: flex-start;
    display: flex;
  }
  .BaseTableHeadTitle__title.BaseTableHeadTitle__title--small {
    font-weight: 400;
    font-size: 0.875rem;
  }
  .BaseTableHeadTitle__title {
    color: #333;
    font-weight: 700;
    font-size: 0.875rem;
  }
  .BaseTableHeadTitle__sidepeakTrigger {
    flex-shrink: 0;
    margin-inline-start: 2px;
  }
  .BaseTableHeadTitle__subTitle {
    font-weight: 400;
    font-size: 0.875rem;
  }
  .BaseTableBody > .BaseTableBody__row:last-of-type {
    border-block-end: none;
  }
  .BaseTableBody__row {
    border-block-end: 1px solid #e0e7ed;
  }
  .BaseTableBody__row > .BaseTableBody__cell:last-of-type:after {
    content: none;
  }
  .BaseTableBody__cell.BaseTableBody__cell--emphasis {
    background-color: #fe7b7b;
  }
  .BaseTableBody__cell.BaseTableBody__cell--alert {
    background-color: #ffd595;
  }
  .BaseTableBody__cell.BaseTableBody__cell--warning {
    background-color: #ffeeb0;
  }
  .BaseTableBody__cell.BaseTableBody__cell--caution {
    background-color: #ffffe9;
  }
  .BaseTableBody__cell.BaseTableBody__cell--blue {
    background-color: #eef8ff;
  }
  .BaseTableBody__cell.BaseTableBody__cell--sub {
    background-color: #edf2f5;
  }
  .BaseTableBody__cell.BaseTableBody__cell--auto {
    white-space: normal;
  }
  .BaseTableBody__cell.BaseTableBody__cell--fixed {
    position: sticky;
    z-index: 1;
  }
  .BaseTableBody__cell {
    background-color: #fff;
    padding-block: 12px;
    padding-inline: 16px;
    position: relative;
    white-space: nowrap;
  }
  .BaseTableBody__cell:after {
    background-color: #e0e7ed;
    block-size: 100%;
    content: "";
    inline-size: 1px;
    inset-block-end: 0;
    inset-inline-end: 0;
    position: absolute;
  }
  .BaseTableBody__text.BaseTableBody__text--positive {
    color: #11af80;
  }
  .BaseTableBody__text.BaseTableBody__text--negative {
    color: #ec3333;
  }
  .BaseTableBody__text.BaseTableBody__text--start {
    text-align: start;
  }
  .BaseTableBody__text.BaseTableBody__text--center {
    text-align: center;
  }
  .BaseTableBody__text.BaseTableBody__text--oneLine {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    /* -webkit-line-clamp: 1; */
    overflow: hidden;
  }
  .BaseTableBody__text.BaseTableBody__text--link {
    text-decoration: underline;
  }
  @media (any-hover: hover) {
    .BaseTableBody__text.BaseTableBody__text--link:hover {
      color: #5ba6f6;
    }
  }
  .BaseTableBody__text {
    color: #333;
    display: block;
    text-align: end;
    font-weight: 400;
    font-size: 0.875rem;
  }
  .BaseTableBody__status {
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .BaseTableBody__difference {
    margin-inline-start: 4px;
  }
  .BaseTableBody__difference.BaseTableBody__difference--positive {
    color: #11af80;
  }
  .BaseTableBody__difference.BaseTableBody__difference--negative {
    color: #ec3333;
  }
  .BaseTableBodyTitle__paragraph {
    color: #333;
    display: flex;
    font-weight: 700;
    font-size: 0.875rem;
  }
  .BaseTableBodyTitle__icon {
    flex-shrink: 0;
    margin-inline-end: 16px;
  }
  .BaseTableBodyTitle__icon:before {
    background-color: #526b81;
    inline-size: 20px;
  }
  .BaseTableBodyTitle__text {
    display: block;
    padding-block-start: 2px;
  }
  .VerticalTable > .VerticalTable__container + .VerticalTable__container {
    margin-block-start: 32px;
  }
  .VerticalTableTitle + .VerticalTable__contents {
    margin-block-start: 8px;
  }
  .VerticalTableTitle__paragraph {
    color: #333;
    display: flex;
    font-size: clamp(1.125rem, 1.082rem + 0.19vi, 1.25rem);
    font-weight: 700;
  }
  .VerticalTableTitle__rank {
    color: #526b81;
    display: block;
    flex-shrink: 0;
    margin-inline-end: 16px;
    padding-block-start: 2px;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 700;
  }
  .VerticalTableTitle__icon {
    flex-shrink: 0;
    margin-inline-end: 16px;
  }
  .VerticalTableTitle__icon:before {
    background-color: #526b81;
    inline-size: 20px;
  }
  .VerticalTableTitle__text {
    display: block;
  }
  .VerticalTable__contents {
    background-color: #fff;
    border: 1px solid #e0e7ed;
    border-radius: 5px;
    overflow: auto clip;
  }
  .VerticalTable__table {
    inline-size: 100%;
  }
  .VerticalTableBody > .VerticalTableBodyContents:last-child {
    border-block-end: none;
  }
  .VerticalTableBodyTitle.VerticalTableBodyTitle--borderLight {
    border-color: #fff;
  }
  .VerticalTableBodyTitle.VerticalTableBodyTitle--borderEmphasis {
    border-color: #c6d5e1;
  }
  .VerticalTableBodyTitle {
    border-block-end: 1px solid #e0e7ed;
  }
  .VerticalTableBodyTitle > .VerticalTableBodyTitle__cell:last-of-type {
    border-inline-end: none;
  }
  .VerticalTableBodyTitle__cell.VerticalTableBodyTitle__cell--gradationBlue {
    background: linear-gradient(90deg, #0880d8 0, #04aadd);
  }
  .VerticalTableBodyTitle__cell.VerticalTableBodyTitle__cell--blue {
    background-color: #d6edfe;
    border-color: #fff;
  }
  .VerticalTableBodyTitle__cell.VerticalTableBodyTitle__cell--sub {
    background-color: #456580;
  }
  .VerticalTableBodyTitle__cell.VerticalTableBodyTitle__cell--subLight {
    background-color: #7d98b1;
  }
  .VerticalTableBodyTitle__cell.VerticalTableBodyTitle__cell--yellow {
    background-color: #ffeeb0;
  }
  .VerticalTableBodyTitle__cell.VerticalTableBodyTitle__cell--yellowLight {
    background-color: #f7f8ca;
    border-color: #fff;
  }
  .VerticalTableBodyTitle__cell.VerticalTableBodyTitle__cell--minimum {
    white-space: nowrap;
    width: 1px;
  }
  .VerticalTableBodyTitle__cell.VerticalTableBodyTitle__cell--small {
    padding-block: 4px;
  }
  .VerticalTableBodyTitle__cell {
    background-color: #edf2f5;
    border-inline-end: 1px solid #e0e7ed;
    padding-block: 12px;
    padding-inline: 12px;
  }
  .VerticalTableBodyTitle__contents.VerticalTableBodyTitle__contents--center {
    justify-content: center;
  }
  .VerticalTableBodyTitle__contents {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
  }
  .VerticalTableBodyTitle__paragraph {
    align-items: flex-start;
    display: flex;
    margin-inline-end: 8px;
  }
  .VerticalTableBodyTitle__title.VerticalTableBodyTitle__title--small {
    font-weight: 400;
    font-size: 0.875rem;
  }
  .VerticalTableBodyTitle__title {
    color: #333;
    font-weight: 700;
    font-size: 0.875rem;
  }
  .VerticalTableBodyTitle__text.VerticalTableBodyTitle__text--start {
    text-align: start;
  }
  .VerticalTableBodyTitle__text.VerticalTableBodyTitle__text--emphasis {
    font-weight: 700;
    font-size: 0.875rem;
  }
  .VerticalTableBodyTitle__text.VerticalTableBodyTitle__text--light {
    color: #fff;
  }
  .VerticalTableBodyTitle__text {
    color: #333;
    display: block;
    text-align: center;
    font-weight: 400;
    font-size: 0.875rem;
  }
  .VerticalTableBodyTitle__sidepeakTrigger {
    flex-shrink: 0;
    margin-inline-start: 2px;
  }
  .VerticalTableBodyTitle__subTitle {
    font-weight: 400;
    font-size: 0.875rem;
  }
  .VerticalTableBodyContents.VerticalTableBodyContents--borderEmphasis {
    border-color: #c6d5e1;
  }
  .VerticalTableBodyContents.VerticalTableBodyContents--borderBlue {
    border-color: #eef8ff;
  }
  .VerticalTableBodyContents.VerticalTableBodyContents--borderYellow {
    border-color: #ffffe9;
  }
  .VerticalTableBodyContents.VerticalTableBodyContents--borderLight {
    border-color: #fff;
  }
  .VerticalTableBodyContents {
    border-block-end: 1px solid #e0e7ed;
  }
  .VerticalTableBodyContents > .VerticalTableBodyContents__cell:last-of-type {
    border-inline-end: none;
  }
  .VerticalTableBodyContents__cell.VerticalTableBodyContents__cell--emphasis {
    background-color: #fe7b7b;
  }
  .VerticalTableBodyContents__cell.VerticalTableBodyContents__cell--alert {
    background-color: #ffd595;
  }
  .VerticalTableBodyContents__cell.VerticalTableBodyContents__cell--warning {
    background-color: #ffeeb0;
  }
  .VerticalTableBodyContents__cell.VerticalTableBodyContents__cell--caution {
    background-color: #ffffe9;
  }
  .VerticalTableBodyContents__cell.VerticalTableBodyContents__cell--minimum {
    white-space: nowrap;
    width: 1px;
  }
  .VerticalTableBodyContents__cell.VerticalTableBodyContents__cell--blue {
    background-color: #eef8ff;
  }
  .VerticalTableBodyContents__cell {
    background-color: #fff;
    border-inline-end: 1px solid #e0e7ed;
    padding-block: 12px;
    padding-inline: 12px;
  }
  .VerticalTableBodyContents__box {
    display: flex;
    flex-wrap: wrap;
  }
  .VerticalTableBodyContents__title {
    flex-grow: 1;
    margin-inline-end: 8px;
    font-weight: 400;
    font-size: 0.875rem;
  }
  .VerticalTableBodyContents__text.VerticalTableBodyContents__text--positive {
    color: #11af80;
  }
  .VerticalTableBodyContents__text.VerticalTableBodyContents__text--negative {
    color: #ec3333;
  }
  .VerticalTableBodyContents__text {
    color: #333;
    font-weight: 400;
    font-size: 0.875rem;
  }
  .VerticalTableBodyContents__paragraph.VerticalTableBodyContents__paragraph--start {
    text-align: start;
  }
  .VerticalTableBodyContents__paragraph.VerticalTableBodyContents__paragraph--center {
    text-align: center;
  }
  .VerticalTableBodyContents__paragraph.VerticalTableBodyContents__paragraph--oneLine {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    overflow: hidden;
  }
  .VerticalTableBodyContents__paragraph.VerticalTableBodyContents__paragraph--link {
    text-decoration: underline;
  }
  @media (any-hover: hover) {
    .VerticalTableBodyContents__paragraph.VerticalTableBodyContents__paragraph--link:hover {
      color: #5ba6f6;
    }
  }
  .VerticalTableBodyContents__paragraph {
    color: #333;
    display: block;
    text-align: end;
    font-weight: 400;
    font-size: 0.875rem;
  }
  .VerticalTableBodyContents__status {
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .VerticalTableBodyContents__difference {
    margin-inline-start: 4px;
  }
  .VerticalTableBodyContents__difference.VerticalTableBodyContents__difference--positive {
    color: #11af80;
  }
  .VerticalTableBodyContents__difference.VerticalTableBodyContents__difference--negative {
    color: #ec3333;
  }
  .Select__label {
    position: relative;
  }
  .Select__input {
    background-color: #fff;
    background-image: url(../img/icon-select-background.svg);
    background-position: top 45% right 12px;
    background-repeat: no-repeat;
    background-size: 8px;
    border: 1px solid #e0e7ed;
    border-radius: calc(infinity * 1px);
    inline-size: 100%;
    padding-block: 4px;
    padding-inline: 8px 24px;
    position: relative;
    transition: 0.3s color, 0.3s background-color, 0.3s border-color,
      0.3s opacity;
    width: 100%;
    font-weight: 400;
    font-size: 0.875rem;
  }
  .Select__input:focus {
    border-color: #0881d8;
  }
  @media (any-hover: hover) {
    .Select__input:hover {
      border-color: #0881d8;
    }
  }
  .BaseChart__container.BaseChart__container--dashboard {
    block-size: calc(90svb - 406px);
  }
  @media screen and (width >= 576px), print {
    .BaseChart__container.BaseChart__container--dashboard {
      block-size: calc(90svb - 578px);
    }
  }
  .BaseChart__container.BaseChart__container--competitiveSeo {
    block-size: calc(90svb - 144px);
  }
  @media screen and (width >= 576px), print {
    .BaseChart__container.BaseChart__container--competitiveSeo {
      block-size: calc(90svb - 184px);
    }
  }
  @media screen and (width >= 768px), print {
    .BaseChart__container.BaseChart__container--competitiveSeo {
      block-size: calc(90svb - 526px);
    }
  }
  @media screen and (width >= 992px), print {
    .BaseChart__container.BaseChart__container--competitiveSeo {
      block-size: calc(90svb - 538px);
    }
  }
  @media screen and (width >= 1200px), print {
    .BaseChart__container.BaseChart__container--competitiveSeo {
      block-size: calc(90svb - 546px);
    }
  }
  @media screen and (width >= 1400px), print {
    .BaseChart__container.BaseChart__container--competitiveSeo {
      block-size: calc(90svb - 554px);
    }
  }
  .BaseChart__container.BaseChart__container--competitiveSns {
    block-size: calc(90svb - 144px);
  }
  @media screen and (width >= 576px), print {
    .BaseChart__container.BaseChart__container--competitiveSns {
      block-size: calc(90svb - 184px);
    }
  }
  @media screen and (width >= 768px), print {
    .BaseChart__container.BaseChart__container--competitiveSns {
      block-size: calc(90svb - 606px);
    }
  }
  @media screen and (width >= 992px), print {
    .BaseChart__container.BaseChart__container--competitiveSns {
      block-size: calc(90svb - 542px);
    }
  }
  @media screen and (width >= 1200px), print {
    .BaseChart__container.BaseChart__container--competitiveSns {
      block-size: calc(90svb - 550px);
    }
  }
  @media screen and (width >= 1400px), print {
    .BaseChart__container.BaseChart__container--competitiveSns {
      block-size: calc(90svb - 558px);
    }
  }
  .BaseChart__container {
    block-size: calc(90svb - 64px);
    inline-size: 100%;
    max-block-size: 900px;
    min-block-size: 200px;
    position: relative;
  }
  @media screen and (width >= 576px), print {
    .BaseChart__container {
      block-size: calc(90svb - 76px);
    }
  }
  .BaseChartButtons {
    margin-block-start: 8px;
  }
  .BaseChartButtons__items {
    display: flex;
  }
  .BaseChartButtons__item {
    flex-grow: 1;
  }
  .BaseChartButtons__button[data-modal-mode="create"]
    .BaseChartButtons__icon.BaseChartButtons__icon--create,
  .BaseChartButtons__button[data-modal-mode="update"]
    .BaseChartButtons__icon.BaseChartButtons__icon--update {
    display: inline-flex;
  }
  .BaseChartButtons__button {
    align-items: center;
    background-color: transparent;
    block-size: 100%;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    display: flex;
    inline-size: 100%;
    justify-content: center;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    position: relative;
    text-align: start;
    text-decoration: none;
  }
  @media (any-hover: hover) {
    .BaseChartButtons__button:hover .BaseChartButtons__icon:before {
      background-color: #0881d8;
    }
  }
  .BaseChartButtons__contents {
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .BaseChartButtons__icon {
    display: none;
  }
  .BaseChartButtons__icon:before {
    background-color: #8fbad9;
    inline-size: 20px;
  }
}
@layer componentUiHigh;
@layer componentCommon {
  .LayoutHeader {
    background-color: #fff;
    box-shadow: 0 4px 10px #8190a226;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    position: fixed;
    view-transition-name: layout-header;
    z-index: 10000;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeader {
      block-size: 100%;
      inline-size: clamp(200px, 172px + 7.69vi, 280px);
    }
  }
  @media screen and (width >= 576px), print {
    .LayoutHeader__wrapper {
      block-size: 100%;
      overflow-y: auto;
    }
  }
  .LayoutHeader__inner {
    inline-size: 100%;
    padding-block: 0;
    padding-inline: 4vi;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeader__inner {
      block-size: 100%;
      padding-inline: 0;
    }
  }
  .LayoutHeader__container {
    block-size: 64px;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeader__container {
      block-size: 100%;
      padding-block: 56px 80px;
    }
  }
  .LayoutHeaderLogo {
    align-items: center;
    block-size: 100%;
    display: flex;
    justify-content: center;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderLogo {
      block-size: auto;
      padding-inline-end: 20px;
    }
  }
  .LayoutHeaderLogo__link {
    align-items: center;
    block-size: 100%;
    display: flex;
    text-decoration: none;
    transition: 0.3s opacity;
  }
  @media (any-hover: hover) {
    .LayoutHeaderLogo__link:hover {
      opacity: 0.6;
    }
  }
  .LayoutHeaderLogo__image {
    block-size: auto;
    inline-size: clamp(123px, 115px + 2.12vi, 145px);
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenu {
      margin-block-start: 40px;
    }
  }
  .LayoutHeaderMenuGlobal.LayoutHeaderMenuGlobal--outer {
    display: block;
  }
  .LayoutHeaderMenuGlobal {
    display: none;
    padding-inline-end: 16px;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuGlobal {
      block-size: 100%;
      display: block;
    }
  }
  .LayoutHeaderMenuGlobal__navigation {
    block-size: 100%;
  }
  .LayoutHeaderMenuGlobal__items {
    block-size: 100%;
    display: grid;
    gap: 0;
    grid-template-columns: repeat(1, 1fr);
  }
  .LayoutHeaderMenuGlobalLink.LayoutHeaderMenuGlobalLink--dashboard:after {
    content: "";
    mask-image: url(../img/icon-dashboard.svg);
  }
  .LayoutHeaderMenuGlobalLink.LayoutHeaderMenuGlobalLink--trackChanges:after {
    content: "";
    mask-image: url(../img/icon-track-changes.svg);
  }
  .LayoutHeaderMenuGlobalLink.LayoutHeaderMenuGlobalLink--troubleshoot:after {
    content: "";
    mask-image: url(../img/icon-troubleshoot.svg);
  }
  .LayoutHeaderMenuGlobalLink.LayoutHeaderMenuGlobalLink--syncSavedLocally:after {
    content: "";
    mask-image: url(../img/icon-sync-saved-locally.svg);
  }
  .LayoutHeaderMenuGlobalLink.LayoutHeaderMenuGlobalLink--campaign:after {
    content: "";
    mask-image: url(../img/icon-campaign.svg);
  }
  .LayoutHeaderMenuGlobalLink.LayoutHeaderMenuGlobalLink--travelExplore:after {
    content: "";
    mask-image: url(../img/icon-travel-explore.svg);
  }
  .LayoutHeaderMenuGlobalLink.LayoutHeaderMenuGlobalLink--screenSearchDesktop:after {
    content: "";
    mask-image: url(../img/icon-screen-search-desktop.svg);
  }
  .LayoutHeaderMenuGlobalLink.LayoutHeaderMenuGlobalLink--travelExploreSearch:after {
    content: "";
    mask-image: url(../img/icon-travel-explore-search.svg);
  }
  .LayoutHeaderMenuGlobalLink.current-menu-item {
    color: #fff;
  }
  .LayoutHeaderMenuGlobalLink.current-menu-item:before {
    opacity: 1;
  }
  .LayoutHeaderMenuGlobalLink.current-menu-item:after {
    background-color: #fff;
  }
  .LayoutHeaderMenuGlobalLink {
    align-items: center;
    background-color: transparent;
    block-size: 100%;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    color: #526b81;
    display: flex;
    inline-size: 100%;
    justify-content: flex-start;
    padding-block: 16px;
    padding-inline: 24px clamp(24px, 18px + 1.54vi, 40px);
    position: relative;
    text-align: left;
    text-decoration: none;
    transition: 0.3s color;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 400;
  }
  .LayoutHeaderMenuGlobalLink:before {
    background: linear-gradient(90deg, #0880d8 0, #04aadd);
    block-size: 100%;
    border-radius: 0 calc(infinity * 1px) calc(infinity * 1px) 0;
    content: "";
    display: block;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    opacity: 0;
    position: absolute;
    transition: 0.3s opacity;
    z-index: 1;
  }
  .LayoutHeaderMenuGlobalLink:after {
    aspect-ratio: 1/1;
    background-color: #526b81;
    block-size: auto;
    display: block;
    inline-size: 24px;
    inset-block-start: 16px;
    inset-inline-start: 16px;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    position: absolute;
    transition: 0.3s background-color;
    z-index: 2;
  }
  @media (any-hover: hover) {
    .LayoutHeaderMenuGlobalLink:hover {
      color: #fff;
    }
    .LayoutHeaderMenuGlobalLink:hover:before {
      opacity: 1;
    }
    .LayoutHeaderMenuGlobalLink:hover:after {
      background-color: #fff;
    }
  }
  .LayoutHeaderMenuGlobalLink__contents {
    display: block;
    padding-inline-start: clamp(24px, 18px + 1.54vi, 40px);
    position: relative;
    z-index: 2;
  }
  .LayoutHeaderMenuGlobalLink__text {
    display: inline-block;
  }
  .LayoutHeaderMenuButton {
    block-size: 100%;
    flex-shrink: 0;
    inset-block-start: 0;
    inset-inline-start: 0;
    position: fixed;
    z-index: 10100;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuButton {
      display: none;
    }
  }
  .LayoutHeaderMenuButton__button.LayoutHeaderMenuButton__button--active
    .LayoutHeaderMenuButton__icons
    > .LayoutHeaderMenuButton__icon:nth-of-type(1) {
    inset-block-start: 6px;
    transform: rotate(-45deg);
  }
  .LayoutHeaderMenuButton__button.LayoutHeaderMenuButton__button--active
    .LayoutHeaderMenuButton__icons
    > .LayoutHeaderMenuButton__icon:nth-of-type(2) {
    opacity: 0;
  }
  .LayoutHeaderMenuButton__button.LayoutHeaderMenuButton__button--active
    .LayoutHeaderMenuButton__icons
    > .LayoutHeaderMenuButton__icon:nth-of-type(3) {
    inset-block-end: 6px;
    transform: rotate(45deg);
  }
  .LayoutHeaderMenuButton__button {
    align-items: center;
    background-color: transparent;
    block-size: 64px;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    display: flex;
    justify-content: flex-start;
    min-inline-size: 48px;
    padding-block: 0;
    padding-inline: 4vi 0;
  }
  @media (any-hover: hover) {
    .LayoutHeaderMenuButton__button:hover .LayoutHeaderMenuButton__icon {
      background-color: #8fbad9;
    }
  }
  .LayoutHeaderMenuButton__button:where(
      .LayoutHeaderMenuOuterButton .LayoutHeaderMenuButton__button
    ) {
    padding-inline: 0 16px;
  }
  .LayoutHeaderMenuButton__container {
    display: block;
  }
  .LayoutHeaderMenuButton__icons {
    block-size: 13px;
    display: block;
    inline-size: 24px;
    margin-block: 0;
    margin-inline: 0;
    position: relative;
  }
  .LayoutHeaderMenuButton__icons
    > .LayoutHeaderMenuButton__icon:nth-of-type(1) {
    inset-block-start: 0;
  }
  .LayoutHeaderMenuButton__icons
    > .LayoutHeaderMenuButton__icon:nth-of-type(2) {
    inset-block-start: 50%;
  }
  .LayoutHeaderMenuButton__icons
    > .LayoutHeaderMenuButton__icon:nth-of-type(3) {
    inset-block-end: 0;
  }
  .LayoutHeaderMenuButton__icon {
    background-color: #0881d8;
    block-size: 1px;
    display: block;
    inline-size: 100%;
    inset-inline-start: 0;
    position: absolute;
    transition: 0.3s background-color, 0.3s transform, 0.3s top, 0.3s bottom;
  }
  .LayoutHeaderMenuOuter.IsActive {
    display: block;
  }
  .LayoutHeaderMenuOuter {
    background-color: #fff;
    block-size: 100%;
    border-radius: 0 20px 20px 0;
    box-shadow: 0 4px 10px #8190a226;
    display: none;
    inline-size: 90%;
    inset-block-start: 0;
    inset-inline-start: 0;
    max-inline-size: 320px;
    overflow-y: auto;
    overscroll-behavior: contain;
    position: fixed;
    z-index: 10300;
  }
  .LayoutHeaderMenuOuterButton {
    block-size: auto;
    inset-block-start: 0;
    inset-inline: auto 0;
    position: absolute;
    z-index: 10400;
  }
  .LayoutHeaderMenuOuter__container {
    min-block-size: calc(100vb + 1px);
    min-block-size: calc(100dvb + 1px);
    padding-block: 0 80px;
    padding-inline: 0;
  }
  .LayoutHeaderMenuOuter__contents {
    border-block-start: 1px solid #e0e7ed;
    padding-block-start: 24px;
  }
  .LayoutHeaderOverlay.IsActive {
    display: block;
  }
  .LayoutHeaderOverlay {
    background-color: #526b814d;
    block-size: 100%;
    display: none;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    position: fixed;
    z-index: 10200;
  }
  @media screen and (width >= 768px), print {
    .LayoutHeaderOverlay {
      display: none;
    }
  }
  .LayoutHeaderOverlay__container {
    block-size: calc(100vb + 1px);
    display: block;
    inline-size: 100%;
  }
  .LayoutHeaderMenuOuterUser {
    padding-block: 32px;
    position: relative;
  }
  .LayoutHeaderMenuOuterUser__container {
    padding-inline-end: 64px;
  }
  .LayoutHeaderMenuOuterUser__contents {
    align-items: center;
    display: flex;
    padding-inline: 24px 0;
  }
  .LayoutHeaderMenuOuterUserButton {
    align-items: center;
    background-color: transparent;
    block-size: auto;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    color: #526b81;
    display: flex;
    inline-size: 100%;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    text-align: start;
    text-decoration: none;
    transition: 0.3s color;
    font-weight: 400;
    font-size: 0.875rem;
  }
  @media (any-hover: hover) {
    .LayoutHeaderMenuOuterUserButton:hover {
      color: #0881d8;
    }
  }
  .LayoutHeaderMenuOuterUserButton__container {
    align-items: center;
    display: flex;
  }
  .LayoutHeaderMenuOuterUserButton__text {
    display: block;
    margin-block-start: 2px;
  }
  .LayoutHeaderMenuOuterUserButton__arrow {
    flex-shrink: 0;
    margin-inline-start: 4px;
  }
  .LayoutHeaderMenuOuterUserButton__arrow:before {
    background-color: #0881d8;
    inline-size: 8px;
  }
  .LayoutHeaderMenuOuterUserButton__icon {
    align-items: center;
    aspect-ratio: 1/1;
    background-color: #fff;
    block-size: auto;
    border: 1px solid #e0e7ed;
    border-radius: calc(infinity * 1px);
    color: #e0e7ed;
    display: flex;
    flex-shrink: 0;
    inline-size: 32px;
    justify-content: center;
    margin-block: 1;
    margin-inline-start: 8px;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 700;
  }
  .LayoutHeaderMenuOuterUserMenu__container.IsActive {
    display: block;
  }
  .LayoutHeaderMenuOuterUserMenu__container {
    block-size: 100%;
    display: none;
    inline-size: 100%;
    inset-block-end: 0;
    inset-inline-end: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    position: fixed;
    z-index: 10600;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUserMenu__container {
      block-size: auto;
      inline-size: auto;
      inset-block: calc(100% + 8px) auto;
      min-inline-size: 160px;
      overflow: visible;
      position: absolute;
    }
  }
  .LayoutHeaderMenuOuterUserMenu__box {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-block-size: calc(100vb + 1px);
    min-block-size: calc(100dvb + 1px);
    padding-block-start: 40svb;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUserMenu__box {
      display: block;
      min-block-size: auto;
      padding-block-start: 0;
    }
  }
  .LayoutHeaderMenuOuterUserMenu__contents {
    background-color: #fff;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 4px 10px #8190a226;
    padding-block: clamp(32px, 35px + -0.77vi, 24px)
      clamp(40px, 26px + 3.85vi, 80px);
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUserMenu__contents {
      border-radius: 16px;
      overflow: hidden;
      padding-block: 0;
    }
  }
  .LayoutHeaderMenuOuterUserMenuHide {
    align-items: center;
    display: flex;
    inset-block-start: clamp(40px, 43px + -0.77vi, 32px);
    inset-inline-end: 0;
    justify-content: flex-end;
    position: sticky;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUserMenuHide {
      display: none;
    }
  }
  .LayoutHeaderMenuOuterUserMenuHide__button {
    align-items: center;
    background-color: transparent;
    block-size: auto;
    border-block: none;
    border-inline: none;
    border-radius: 0;
    display: flex;
    inline-size: clamp(40px, 43px + -0.77vi, 32px);
    justify-content: flex-start;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    position: relative;
    text-align: center;
    text-decoration: none;
  }
  .LayoutHeaderMenuOuterUserMenuHide__icon:before {
    background-color: #0881d8;
    inline-size: 24px;
  }
  .LayoutHeaderMenuOuterUserMenuBody {
    padding-inline: clamp(24px, 21px + 0.77vi, 32px)
      clamp(40px, 43px + -0.77vi, 32px);
  }
  .LayoutHeaderMenuOuterUserMenuOverlay.IsActive {
    display: block;
  }
  .LayoutHeaderMenuOuterUserMenuOverlay {
    background-color: #526b814d;
    block-size: 100%;
    display: none;
    inline-size: 100%;
    inset-block-start: 0;
    inset-inline-start: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    position: fixed;
    z-index: 10500;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUserMenuOverlay {
      background-color: transparent;
    }
  }
  .LayoutHeaderMenuOuterUserMenuOverlay__container {
    block-size: calc(100vb + 1px);
    display: block;
    inline-size: 100%;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUserMenuOverlay__container {
      block-size: auto;
    }
  }
  .LayoutHeaderMenuOuterUserMenuContents {
    padding-inline: clamp(24px, 21px + 0.77vi, 32px)
      clamp(40px, 43px + -0.77vi, 32px);
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUserMenuContents {
      padding-inline: 0;
    }
  }
  .LayoutHeaderMenuOuterUserMenuButtons__items {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(1, 1fr);
  }
  .LayoutHeaderMenuOuterUserMenuButtons__button {
    align-items: center;
    background-color: #fff;
    block-size: auto;
    border-block: 1px solid #e0e7ed;
    border-inline: 1px solid #e0e7ed;
    border-radius: 16px;
    color: #526b81;
    display: flex;
    inline-size: 100%;
    justify-content: flex-start;
    margin-block: 0;
    margin-inline: 0;
    padding-block: clamp(16px, 17px + -0.38vi, 12px);
    padding-inline: clamp(16px, 19px + -0.77vi, 8px);
    position: relative;
    text-align: start;
    text-decoration: none;
    transition: 0.3s background-color;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 400;
  }
  @media (any-hover: hover) {
    .LayoutHeaderMenuOuterUserMenuButtons__button:hover {
      background-color: #e0e7ed;
    }
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUserMenuButtons__button {
      background-color: transparent;
      border: none;
      border-radius: 0;
    }
  }
  .LayoutHeaderMenuOuterUserMenuButtons__contents {
    display: flex;
  }
  .LayoutHeaderMenuOuterUserMenuButtons__text {
    display: block;
  }
  .LayoutHeaderMenuOuterUserMenuButtons__icon {
    flex-shrink: 0;
    margin-inline-end: 4px;
  }
  .LayoutHeaderMenuOuterUserMenuButtons__icon:before {
    background-color: #0881d8;
    inline-size: 24px;
  }
  .LayoutHeaderMenuOuterUser.LayoutHeaderMenuOuterUser--pageTitle {
    display: none;
    flex-shrink: 0;
    margin-inline-start: auto;
    padding-block: 0;
  }
  @media screen and (width >= 576px), print {
    .LayoutHeaderMenuOuterUser.LayoutHeaderMenuOuterUser--pageTitle {
      display: block;
    }
  }
  .LayoutHeaderMenuOuterUser.LayoutHeaderMenuOuterUser--pageTitle
    .LayoutHeaderMenuOuterUser__container {
    padding-inline-end: 0;
  }
  .LayoutHeaderMenuOuterUser.LayoutHeaderMenuOuterUser--pageTitle
    .LayoutHeaderMenuOuterUser__contents {
    padding-inline-start: 0;
  }
}
@layer componentPage {
  .SignIn {
    display: flex;
    min-block-size: 100svb;
    padding-block: 40px;
  }
  .SignIn__wrapper {
    inline-size: 100%;
    margin-block: auto;
    margin-inline: auto;
  }
  .SignIn__container {
    margin-inline: auto;
    max-inline-size: 384px;
  }
  .SignInLogo {
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .SignInLogo__title {
    inline-size: 100%;
    max-inline-size: 200px;
  }
  .SignInLogo__image {
    block-size: auto;
    inline-size: 100%;
  }
  .SignInForm {
    margin-block-start: 24px;
    padding-block: 56px;
    padding-inline: clamp(24px, 13px + 3.08vi, 56px);
  }
  .ForgotPassword {
    display: flex;
    min-block-size: 100svb;
    padding-block: 40px;
  }
  .ForgotPassword__wrapper {
    inline-size: 100%;
    margin-block: auto;
    margin-inline: auto;
  }
  .ForgotPassword__container {
    margin-inline: auto;
    max-inline-size: 520px;
  }
  .ForgotPasswordLogo {
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .ForgotPasswordLogo__title {
    inline-size: 100%;
    max-inline-size: 200px;
  }
  .ForgotPasswordLogo__image {
    block-size: auto;
    inline-size: 100%;
  }
  .ForgotPasswordForm {
    margin-block-start: 24px;
    padding-block: 40px;
    padding-inline: clamp(24px, 18px + 1.54vi, 40px);
  }
  .InflowAnalysisTitle__buttons {
    margin-inline-start: 24px;
  }
  .InflowAnalysisRanking,
  .InflowAnalysisTable,
  .SeoKeywordRankingTable,
  .AdvertisementPerformanceRankingTable,
  .SnsPerformanceTable,
  .CompetitiveSeoAnalysisTable,
  .CompetitiveSeoChart,
  .CompetitiveSnsChart,
  .StrategyArticlesList {
    margin-block-start: 16px;
  }
  .DashboardTitle {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
  }
  .NotFoundMessage__paragraph {
    text-align: center;
    font-size: clamp(1rem, 0.957rem + 0.19vi, 1.125rem);
    font-weight: 400;
  }
  .NotFoundMessageButton {
    align-items: center;
    display: flex;
    justify-content: center;
    margin-block-start: clamp(24px, 18px + 1.54vi, 40px);
  }
  .NotFoundMessageButton__icon {
    flex-shrink: 0;
    margin-inline: 8px -8px;
  }
  .NotFoundMessageButton__icon:before {
    background-color: #fff;
    inline-size: 20px;
  }
}
@layer utils {
  .Obj--sm,
  .Obj--md,
  .Obj--lg,
  .Obj--xl {
    display: none;
  }
  .Obj--xs {
    display: block;
  }
  @media screen and (width >= 360px), print {
    .Obj--xs {
      display: none;
    }
    .Obj--sm {
      display: block;
    }
  }
  @media screen and (width >= 576px), print {
    .Obj--sm {
      display: none;
    }
    .Obj--md {
      display: block;
    }
  }
  @media screen and (width >= 768px), print {
    .Obj--md {
      display: none;
    }
    .Obj--lg {
      display: block;
    }
  }
  @media screen and (width >= 992px), print {
    .Obj--lg {
      display: none;
    }
    .Obj--xl {
      display: block;
    }
  }
}
.ReportCardSlider__items.slick-initialized:not(:root) {
  display: flex;
  flex-direction: column;
  opacity: 1;
}
.ReportCardSlider__items:not(:root) {
  opacity: 0;
}
.ReportCardSlider__items:not(:root) .slick-list {
  overflow: visible;
}
.ReportCardSlider__items:not(:root) .slick-track {
  display: flex;
  width: 100% !important;
}
.ReportCardSlider__item.slick-slide:not(:root) {
  height: auto;
}

.custom-dashboard-item {
  width: 100% !important;
}

/* span.sort-icon {
  float: right;
} */

.BaseTableHead__text {
  display: flex;
  justify-content: space-between;
  column-gap: 10px;
}

.centered-text {
  text-align: center !important;
  display: flex !important;
  justify-content: center !important;
  color: #fff !important;
}

.sort-icon::before {
  content: "▲";
  display: block;
  font-size: 10px;
  line-height: 10px;
  text-align: center;
  color: #888;
}

.sort-icon::after {
  content: "▼";
  display: block;
  font-size: 10px;
  line-height: 10px;
  text-align: center;
  color: #888;
}

/* Sorted ASCENDING (highlight ▲ only) */
th.sort-asc .sort-icon::before {
  color: #000;
}

th.sort-asc .sort-icon::after {
  color: #888;
}

/* Sorted DESCENDING (highlight ▼ only) */
th.sort-desc .sort-icon::before {
  color: #888;
}

th.sort-desc .sort-icon::after {
  color: #000;
}

th.resizable {
  position: relative;
}

th .resizer {
  position: absolute;
  right: 0;
  top: 0;
  width: 5px;
  cursor: col-resize;
  user-select: none;
  height: 100%;
  z-index: 10;
}

.BaseTabButtons__button.is-active {
  background-color: #0ea5e9; 
  color: #fff;
}

.ChartSlider__items.slick-initialized:not(:root) {
  opacity: 1;
}
.ChartSlider__items:not(:root) {
  display: grid;
  gap: 16px 0;
  grid-template-columns: auto 1fr auto;
  grid-template-rows: 1fr auto;
  opacity: 0;
}
.ChartSlider__items:not(:root) .slick-list {
  grid-column: 1/4;
  grid-row: 1/2;
}
.ChartSlider__items:not(:root) .slick-arrow.slick-disabled {
  cursor: auto;
  opacity: 0;
}
.ChartSlider__items:not(:root) .slick-arrow {
  align-items: center;
  background-color: transparent;
  block-size: 100%;
  border-block: none;
  border-inline: none;
  border-radius: 0;
  color: #0881d8;
  display: flex;
  inline-size: auto;
  margin-block: 0;
  margin-inline: 0;
  min-inline-size: 72px;
  padding-block: 0;
  padding-inline: 0;
  position: relative;
  text-align: start;
  text-decoration: none;
  transition: 0.3s color, 0.3s opacity;
  font-weight: 400;
  font-size: 0.875rem;
}
@media (any-hover: hover) {
  .ChartSlider__items:not(:root) .slick-arrow:hover {
    color: #8fbad9;
  }
  .ChartSlider__items:not(:root) .slick-arrow:hover:before,
  .ChartSlider__items:not(:root) .slick-arrow:hover:after {
    background-color: #8fbad9;
  }
}
.ChartSlider__items:not(:root) .slick-prev {
  grid-column: 1/2;
  grid-row: 2/3;
  justify-content: flex-start;
}
.ChartSlider__items:not(:root) .slick-prev:before {
  aspect-ratio: 1/1;
  background-color: #0881d8;
  block-size: auto;
  content: "";
  display: block;
  flex-shrink: 0;
  inline-size: 10px;
  margin-inline-end: 2px;
  mask-image: url(../img/icon-arrow-left.svg);
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  transition: 0.3s background-color;
}
.ChartSlider__items:not(:root) .slick-next {
  grid-column: 3/4;
  grid-row: 2/3;
  justify-content: flex-end;
}
.ChartSlider__items:not(:root) .slick-next:after {
  aspect-ratio: 1/1;
  background-color: #0881d8;
  block-size: auto;
  content: "";
  display: block;
  flex-shrink: 0;
  inline-size: 10px;
  margin-inline-start: 2px;
  mask-image: url(../img/icon-arrow-right.svg);
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  transition: 0.3s background-color;
}
.ChartSlider__items:not(:root) .slick-dots {
  align-items: center;
  display: flex;
  gap: 8px;
  grid-column: 2/3;
  grid-row: 2/3;
  justify-content: center;
}
.ChartSlider__items:not(:root) .slick-dots button[aria-selected="true"] {
  background-color: #0881d8;
}
.ChartSlider__items:not(:root) .slick-dots button {
  align-items: center;
  aspect-ratio: 1/1;
  background-color: #fff;
  block-size: auto;
  border-block: 1px solid #0881d8;
  border-inline: 1px solid #0881d8;
  border-radius: calc(infinity * 1px);
  color: transparent;
  display: flex;
  font-size: 0;
  inline-size: 10px;
  justify-content: center;
  margin-block: 0;
  margin-inline: 0;
  padding-block: 0;
  padding-inline: 0;
  position: relative;
  text-align: start;
  text-decoration: none;
  transition: 0.3s background-color;
}
@media (any-hover: hover) {
  .ChartSlider__items:not(:root) .slick-dots button:hover {
    background-color: #0881d8;
  }
}
.SignInForm__form:not(:root) {
  display: grid;
  grid-template-columns: 1fr;
}
.SignInForm__form:not(:root) .um-row {
  grid-column: 1/2;
  grid-row: 1/2;
  margin-block: 0 !important;
  margin-inline: 0 !important;
}
.SignInForm__form:not(:root) .um-col-1 > .um-field:first-of-type {
  padding-block-start: 0;
}
.SignInForm__form:not(:root)
  .um-col-1
  > .um-field:first-of-type
  .um-field-label {
  inset-block-start: 20px;
}
.SignInForm__form:not(:root)
  .um-col-1
  > .um-field:first-of-type
  .um-field-label:where(
    .um-field:has(input[type="text"]:focus, input[type="password"]:focus)
      .um-field-label
  ) {
  inset-block-start: 4px;
}
.SignInForm__form:not(:root)
  .um-col-1
  > .um-field:first-of-type
  .um-field-label:where(
    .um-field:has(input[type="text"].IsActive, input[type="password"].IsActive)
      .um-field-label
  ) {
  inset-block-start: 4px;
}
@media (any-hover: hover) {
  .SignInForm__form:not(:root)
    .um-col-1
    > .um-field:first-of-type
    .um-field-label:where(
      .um-field:has(input[type="text"]:hover, input[type="password"]:hover)
        .um-field-label
    ) {
    inset-block-start: 4px;
  }
}
.SignInForm__form:not(:root) .um-col-1 > .um-field:last-of-type {
  padding-block-end: 0;
}
.SignInForm__form:not(:root) .um-field {
  padding-block: 8px;
  padding-inline: 0;
  position: relative;
}
.SignInForm__form:not(:root) .um-field-label {
  inset-block-start: 26px;
  inset-inline-start: 16px;
  margin-block: 0;
  margin-inline: 0;
  position: absolute;
  transition: 0.3s inset-block-start, 0.3s inset-inline-start;
  z-index: 2;
}
.SignInForm__form:not(:root)
  .um-field-label:where(
    .um-field:has(input[type="text"]:focus, input[type="password"]:focus)
      .um-field-label
  ) {
  inset-block-start: 12px;
  inset-inline-start: 8px;
}
.SignInForm__form:not(:root)
  .um-field-label:where(
    .um-field:has(input[type="text"].IsActive, input[type="password"].IsActive)
      .um-field-label
  ) {
  inset-block-start: 12px;
  inset-inline-start: 8px;
}
@media (any-hover: hover) {
  .SignInForm__form:not(:root)
    .um-field-label:where(
      .um-field:has(input[type="text"]:hover, input[type="password"]:hover)
        .um-field-label
    ) {
    inset-block-start: 12px;
    inset-inline-start: 8px;
  }
}
.SignInForm__form:not(:root) .um-field-label > label {
  color: #8fbad9;
  font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  transition: 0.3s font-size, 0.3s color;
}
.SignInForm__form:not(:root)
  .um-field-label
  > label:where(
    .um-field:has(input[type="text"]:focus, input[type="password"]:focus)
      .um-field-label
      > label
  ) {
  color: #0881d8;
  font-size: clamp(0.625rem, 0.625rem + 0vi, 0.625rem) !important;
}
.SignInForm__form:not(:root)
  .um-field-label
  > label:where(
    .um-field:has(input[type="text"].IsActive, input[type="password"].IsActive)
      .um-field-label
      > label
  ) {
  color: #0881d8;
  font-size: clamp(0.625rem, 0.625rem + 0vi, 0.625rem) !important;
}
@media (any-hover: hover) {
  .SignInForm__form:not(:root)
    .um-field-label
    > label:where(
      .um-field:has(input[type="text"]:hover, input[type="password"]:hover)
        .um-field-label
        > label
    ) {
    color: #0881d8;
    font-size: clamp(0.625rem, 0.625rem + 0vi, 0.625rem) !important;
  }
}
.SignInForm__form:not(:root) .um-field-area {
  margin-block: 0;
  margin-inline: 0;
  position: relative;
  z-index: 1;
}
.SignInForm__form:not(:root) input[type="text"],
.SignInForm__form:not(:root) input[type="password"] {
  background-color: #ecf2f7;
  border: 1px solid #ecf2f7;
  border-radius: 6px;
  color: #526b81;
  padding-block: 16px;
  padding-inline: 16px;
  transition: 0.3s color, 0.3s background-color, 0.3s border-color, 0.3s opacity;
  width: 100%;
  font-size: 1rem;
}
.SignInForm__form:not(:root) input[type="text"]:focus,
.SignInForm__form:not(:root) input[type="password"]:focus {
  border-color: #0881d8;
}
@media (any-hover: hover) {
  .SignInForm__form:not(:root) input[type="text"]:hover,
  .SignInForm__form:not(:root) input[type="password"]:hover {
    border-color: #0881d8;
  }
}
.SignInForm__form:not(:root) .um-field-error {
  background-color: transparent;
  border-radius: 0;
  color: #ec3333;
  line-height: 1.6 !important;
  margin-block: 8px 0;
  margin-inline: 0;
  padding-block: 0;
  padding-inline: 0;
  font-weight: 400;
  font-size: 0.75rem;
}
.SignInForm__form:not(:root) .um-field-arrow {
  display: none;
}
.SignInForm__form:not(:root) .um-col-alt {
  grid-column: 1/2;
  grid-row: 3/4;
  margin-block: 24px 0;
  margin-inline: 0;
}
.SignInForm__form:not(:root) .um-button {
  align-items: center;
  background: linear-gradient(90deg, #0880d8 0, #04aadd);
  block-size: 100%;
  border-block: none;
  border-inline: none;
  border-radius: calc(infinity * 1px) !important;
  color: #fff;
  display: inline-flex !important;
  font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem) !important;
  font-weight: 400 !important;
  inline-size: 100% !important;
  justify-content: center;
  line-height: 1.6 !important;
  margin-block: 0;
  margin-inline: 0;
  max-inline-size: 240px;
  min-width: auto !important;
  padding-block: 16px !important;
  padding-inline: 16px !important;
  position: relative;
  text-align: center;
  text-decoration: none !important;
  transition: 0.3s background-color, 0.3s color, 0.3s opacity, 0.3s border-color;
}
@media (any-hover: hover) {
  .SignInForm__form:not(:root) .um-button:hover {
    background: linear-gradient(90deg, #29beed 0, #45d6d6);
  }
}
.SignInForm__form:not(:root) .um-col-alt-b {
  align-items: center;
  display: flex;
  grid-column: 1/2;
  grid-row: 2/3;
  justify-content: flex-end;
  margin-block: 8px 0;
  margin-inline: 0;
  padding-block: 0;
  padding-inline: 0;
}
.SignInForm__form:not(:root) .um-link-alt {
  color: #0881d8 !important;
  line-height: 1.6;
  text-decoration: none;
  font-weight: 400;
  font-size: 0.75rem;
}
@media (any-hover: hover) {
  .SignInForm__form:not(:root) .um-link-alt:hover,
  .SignInForm__form:not(:root) .um-link-alt:active {
    color: #5ba6f6 !important;
    text-decoration: underline;
  }
}
.ForgotPasswordForm__form:not(:root) .um:not(.um-admin) {
  -webkit-font-smoothing: initial !important;
  -moz-osx-font-smoothing: initial !important;
}
.ForgotPasswordForm__form:not(:root) .um:not(.um-admin) * {
  -webkit-font-smoothing: initial !important;
  -moz-osx-font-smoothing: initial !important;
}
.ForgotPasswordForm__form:not(:root) .um-um_password_id.um {
  margin: 0 !important;
  max-width: none;
  opacity: 1;
}
.ForgotPasswordForm__form:not(:root) .um-form form > .um-field:first-of-type {
  padding-block-start: 0;
}
.ForgotPasswordForm__form:not(:root)
  .um-form
  form
  > .um-field:first-of-type
  .um-field-label {
  inset-block-start: 20px;
}
.ForgotPasswordForm__form:not(:root)
  .um-form
  form
  > .um-field:first-of-type
  .um-field-label:where(
    .um-field:has(input[type="text"]:focus, input[type="password"]:focus)
      .um-field-label
  ) {
  inset-block-start: 4px;
}
.ForgotPasswordForm__form:not(:root)
  .um-form
  form
  > .um-field:first-of-type
  .um-field-label:where(
    .um-field:has(input[type="text"].IsActive, input[type="password"].IsActive)
      .um-field-label
  ) {
  inset-block-start: 4px;
}
@media (any-hover: hover) {
  .ForgotPasswordForm__form:not(:root)
    .um-form
    form
    > .um-field:first-of-type
    .um-field-label:where(
      .um-field:has(input[type="text"]:hover, input[type="password"]:hover)
        .um-field-label
    ) {
    inset-block-start: 4px;
  }
}
.ForgotPasswordForm__form:not(:root)
  .um-form
  form
  > .um-field:first-of-type
  .um-field-block {
  font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem);
  font-weight: 400;
}
.ForgotPasswordForm__form:not(:root)
  .um-form
  form
  > .um-field:first-of-type
  .um-field-block
  div {
  text-align: start !important;
}
.ForgotPasswordForm__form:not(:root) .um-field {
  padding-block: 8px;
  padding-inline: 0;
  position: relative;
}
.ForgotPasswordForm__form:not(:root) .um-field-label {
  inset-block-start: 26px;
  inset-inline-start: 16px;
  margin-block: 0;
  margin-inline: 0;
  position: absolute;
  transition: 0.3s inset-block-start, 0.3s inset-inline-start;
  z-index: 2;
}
.ForgotPasswordForm__form:not(:root)
  .um-field-label:where(
    .um-field:has(input[type="text"]:focus, input[type="password"]:focus)
      .um-field-label
  ) {
  inset-block-start: 12px;
  inset-inline-start: 8px;
}
.ForgotPasswordForm__form:not(:root)
  .um-field-label:where(
    .um-field:has(input[type="text"].IsActive, input[type="password"].IsActive)
      .um-field-label
  ) {
  inset-block-start: 12px;
  inset-inline-start: 8px;
}
@media (any-hover: hover) {
  .ForgotPasswordForm__form:not(:root)
    .um-field-label:where(
      .um-field:has(input[type="text"]:hover, input[type="password"]:hover)
        .um-field-label
    ) {
    inset-block-start: 12px;
    inset-inline-start: 8px;
  }
}
.ForgotPasswordForm__form:not(:root) .um-field-label > label {
  color: #8fbad9;
  font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  transition: 0.3s font-size, 0.3s color;
}
.ForgotPasswordForm__form:not(:root)
  .um-field-label
  > label:where(
    .um-field:has(input[type="text"]:focus, input[type="password"]:focus)
      .um-field-label
      > label
  ) {
  color: #0881d8;
  font-size: clamp(0.625rem, 0.625rem + 0vi, 0.625rem) !important;
}
.ForgotPasswordForm__form:not(:root)
  .um-field-label
  > label:where(
    .um-field:has(input[type="text"].IsActive, input[type="password"].IsActive)
      .um-field-label
      > label
  ) {
  color: #0881d8;
  font-size: clamp(0.625rem, 0.625rem + 0vi, 0.625rem) !important;
}
@media (any-hover: hover) {
  .ForgotPasswordForm__form:not(:root)
    .um-field-label
    > label:where(
      .um-field:has(input[type="text"]:hover, input[type="password"]:hover)
        .um-field-label
        > label
    ) {
    color: #0881d8;
    font-size: clamp(0.625rem, 0.625rem + 0vi, 0.625rem) !important;
  }
}
.ForgotPasswordForm__form:not(:root) .um-field-area {
  margin-block: 0;
  margin-inline: 0;
  position: relative;
  z-index: 1;
}
.ForgotPasswordForm__form:not(:root) input[type="text"]:not(:root),
.ForgotPasswordForm__form:not(:root) input[type="password"]:not(:root) {
  background-color: #ecf2f7 !important;
  border: 1px solid #ecf2f7 !important;
  border-radius: 6px !important;
  color: #526b81 !important;
  font-size: 16px !important;
  height: auto !important;
  line-height: 1.6 !important;
  padding-block: 16px !important;
  padding-inline: 16px !important;
  transition: 0.3s color, 0.3s background-color, 0.3s border-color, 0.3s opacity;
  width: 100%;
}
.ForgotPasswordForm__form:not(:root) input[type="text"]:not(:root):focus,
.ForgotPasswordForm__form:not(:root) input[type="password"]:not(:root):focus {
  border-color: #0881d8 !important;
}
@media (any-hover: hover) {
  .ForgotPasswordForm__form:not(:root) input[type="text"]:not(:root):hover,
  .ForgotPasswordForm__form:not(:root) input[type="password"]:not(:root):hover {
    border-color: #0881d8 !important;
  }
}
.ForgotPasswordForm__form:not(:root) .um-field-error {
  background-color: transparent;
  border-radius: 0;
  color: #ec3333;
  line-height: 1.6 !important;
  margin-block: 8px 0;
  margin-inline: 0;
  padding-block: 0;
  padding-inline: 0;
  font-weight: 400;
  font-size: 0.75rem;
}
.ForgotPasswordForm__form:not(:root) .um-field-arrow {
  display: none;
}
.ForgotPasswordForm__form:not(:root) .um-col-alt-b {
  align-items: center;
  display: flex;
  justify-content: center;
  margin-block: 16px 0;
  margin-inline: 0;
  padding-block: 0;
  padding-inline: 0;
}
.ForgotPasswordForm__form:not(:root) .um-col-alt-b .um-center {
  inline-size: 100%;
}
.ForgotPasswordForm__form:not(:root) .um-button:not(:root) {
  align-items: center;
  background: linear-gradient(90deg, #0880d8 0, #04aadd);
  block-size: 100%;
  border-block: none;
  border-inline: none;
  border-radius: calc(infinity * 1px) !important;
  color: #fff;
  display: inline-flex !important;
  font-family: Helvetica Neue, arial, Hiragino Kaku Gothic ProN, Hiragino Sans,
    meiryo, sans-serif;
  font-size: clamp(0.875rem, 0.832rem + 0.19vi, 1rem) !important;
  font-weight: 400 !important;
  inline-size: 100% !important;
  justify-content: center;
  line-height: 1.6 !important;
  margin-block: 0;
  margin-inline: 0;
  max-inline-size: 240px;
  min-width: auto !important;
  padding-block: 16px !important;
  padding-inline: 16px !important;
  position: relative;
  text-align: center;
  text-decoration: none !important;
  transition: 0.3s background-color, 0.3s color, 0.3s opacity, 0.3s border-color;
}
@media (any-hover: hover) {
  .ForgotPasswordForm__form:not(:root) .um-button:not(:root):hover {
    background: linear-gradient(90deg, #29beed 0, #45d6d6);
  }
}