@charset "UTF-8";
.back-base-grayscale {
  --color-contrast: #FFFFFF;
  --color-white: #000000;
  --color-primary: #ffffff;
  --color-links: #ffffff;
  --color-links-hover: #ffffff;
  color: #ffffff;
  background-color: #000000 !important;
}
.back-base-grayscale:not(.home) .l-main {
  background-image: none;
}
.back-base-grayscale .l-header {
  background-color: var(--color-black);
  border-bottom: 2px solid #fff;
}
.back-base-grayscale .l-header__hamburger__line {
  background: #fff;
}
.back-base-grayscale .l-header__udSetting__list li .current {
  color: #000;
  background-color: #fff;
}
.back-base-grayscale .l-header__udSetting__list li a {
  outline: 2px solid #fff;
  color: #fff;
  background-color: #000;
}
.back-base-grayscale .l-header__udSetting__list li a:hover {
  background-color: var(--color-medium-gray);
  color: #000;
}
.back-base-grayscale .l-header__headerBtnNavi__links li a {
  border: 2px solid #fff;
}
.back-base-grayscale .l-header__headerBtnNavi__links li a:hover {
  border: 2px solid #fff;
  background-color: #fff;
  color: #000;
}
.back-base-grayscale .l-header__logo__link img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}
.back-base-grayscale .l-header .l-header__globalNavi__links > li:hover > a,
.back-base-grayscale .l-header .back-base-grayscale .l-header .l-header__globalNavi__links > li a:hover {
  background-color: #fff;
  color: #000;
}
.back-base-grayscale .l-header .l-header__globalNavi__links > li:hover .dropdown__toggleWrap a:hover {
  background-color: #fff;
  color: #000;
}
.back-base-grayscale .l-header .l-header__globalNavi__links .dropdown__active .dropdown__toggleWrap > a::before, .back-base-grayscale .l-header .l-header__globalNavi__links .dropdown__active .dropdown__toggle::before {
  content: "";
  background: #000;
}
.back-base-grayscale .l-header .dropdown__toggle {
  background-color: #000;
  border-color: #fff;
  border-width: 2px 2px 2px 2px;
}
.back-base-grayscale .l-header .dropdown__toggleWrap:hover .dropdown__toggle {
  border-radius: 0 5px 5px 0;
  background-color: #000;
}
.back-base-grayscale .l-header .dropdown__toggleWrap:hover .dropdown__toggle:hover {
  background-color: #fff;
  color: #000;
}
.back-base-grayscale .l-header .l-header__globalNavi__links > .dropdown__toggleWrap a:hover {
  background-color: #fff !important;
  color: #000;
}
.back-base-grayscale .l-header .dropdown .dropdownMenu-title a:hover {
  color: #fff;
}
.back-base-grayscale .l-header .dropdown .dropdownMenu-inner {
  background-color: #000;
}
.back-base-grayscale .l-header .dropdown .dropdownMenu-list li a {
  background-color: #000;
  color: #fff;
}
.back-base-grayscale .l-header .dropdown .dropdownMenu-list li a:hover {
  background-color: #fff;
  color: #000;
}
.back-base-grayscale .topMenu::before {
  display: none;
}
.back-base-grayscale .topMenu__box__body--message * {
  color: #fff;
}
.back-base-grayscale .topMenu__box__body--message a {
  text-decoration: underline;
  color: #fff;
}
.back-base-grayscale .topMenu__box__body--message a:hover {
  text-decoration: underline;
  text-decoration-thickness: auto;
  text-underline-offset: 0.4em;
  text-decoration-thickness: 3px;
}
.back-base-grayscale .topMenu__box[href]:hover {
  background-color: #fff;
}
.back-base-grayscale .topMenu__box[href]:hover .topMenu__box__body__title {
  color: #000;
}
.back-base-grayscale .topMenu__box[href]:hover .topMenu__box__body__title::before {
  color: #000;
}
.back-base-grayscale .c-newsList a {
  text-decoration: underline;
  color: #fff;
}
.back-base-grayscale .c-newsList a:hover {
  text-decoration: underline;
  text-decoration-thickness: auto;
  text-underline-offset: 0.4em;
  text-decoration-thickness: 3px;
}
.back-base-grayscale .topNews__pickupBox {
  background-color: var(--color-black);
}
.back-base-grayscale .topNews::before, .back-base-grayscale .topAccess::before {
  background-color: #fff;
  bottom: 2px;
}
.back-base-grayscale .topNews::after, .back-base-grayscale .topAccess::after {
  content: "";
  z-index: 1;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  display: block;
  height: var(--section-container-padding);
  background-color: #000000;
  -webkit-clip-path: polygon(100% 100%, 0% 100%, 0% 87.5%, 1.82% 86.95%, 3.64% 85.32%, 5.45% 82.65%, 7.27% 79.03%, 9.09% 74.56%, 10.91% 69.36%, 12.73% 63.61%, 14.55% 57.45%, 16.36% 51.07%, 18.18% 44.66%, 20% 38.41%, 21.82% 32.5%, 23.64% 27.1%, 25.45% 22.37%, 27.27% 18.45%, 29.09% 15.46%, 30.91% 13.47%, 32.73% 12.56%, 34.55% 12.74%, 36.36% 14.02%, 38.18% 16.35%, 40% 19.66%, 41.82% 23.86%, 43.64% 28.83%, 45.45% 34.42%, 47.27% 40.47%, 49.09% 46.79%, 50.91% 53.21%, 52.73% 59.53%, 54.55% 65.58%, 56.36% 71.17%, 58.18% 76.14%, 60% 80.34%, 61.82% 83.65%, 63.64% 85.98%, 65.45% 87.26%, 67.27% 87.44%, 69.09% 86.53%, 70.91% 84.54%, 72.73% 81.55%, 74.55% 77.63%, 76.36% 72.9%, 78.18% 67.5%, 80% 61.59%, 81.82% 55.34%, 83.64% 48.93%, 85.45% 42.55%, 87.27% 36.39%, 89.09% 30.64%, 90.91% 25.44%, 92.73% 20.97%, 94.55% 17.35%, 96.36% 14.68%, 98.18% 13.05%, 100% 12.5%);
          clip-path: polygon(100% 100%, 0% 100%, 0% 87.5%, 1.82% 86.95%, 3.64% 85.32%, 5.45% 82.65%, 7.27% 79.03%, 9.09% 74.56%, 10.91% 69.36%, 12.73% 63.61%, 14.55% 57.45%, 16.36% 51.07%, 18.18% 44.66%, 20% 38.41%, 21.82% 32.5%, 23.64% 27.1%, 25.45% 22.37%, 27.27% 18.45%, 29.09% 15.46%, 30.91% 13.47%, 32.73% 12.56%, 34.55% 12.74%, 36.36% 14.02%, 38.18% 16.35%, 40% 19.66%, 41.82% 23.86%, 43.64% 28.83%, 45.45% 34.42%, 47.27% 40.47%, 49.09% 46.79%, 50.91% 53.21%, 52.73% 59.53%, 54.55% 65.58%, 56.36% 71.17%, 58.18% 76.14%, 60% 80.34%, 61.82% 83.65%, 63.64% 85.98%, 65.45% 87.26%, 67.27% 87.44%, 69.09% 86.53%, 70.91% 84.54%, 72.73% 81.55%, 74.55% 77.63%, 76.36% 72.9%, 78.18% 67.5%, 80% 61.59%, 81.82% 55.34%, 83.64% 48.93%, 85.45% 42.55%, 87.27% 36.39%, 89.09% 30.64%, 90.91% 25.44%, 92.73% 20.97%, 94.55% 17.35%, 96.36% 14.68%, 98.18% 13.05%, 100% 12.5%);
}
.back-base-grayscale .topAccess_illust {
  z-index: 2;
}
.back-base-grayscale .topNews {
  border-top: 2px solid #fff;
}
.back-base-grayscale .topNews__btn:hover {
  background-color: var(--color-white);
  text-decoration: none;
  color: #fff !important;
}
.back-base-grayscale .topSupportDesk {
  background-color: black;
}
.back-base-grayscale .topSupportDesk__card a[href^="tel:"] {
  text-decoration: underline;
  transition: -webkit-text-decoration 0.3s ease;
  transition: text-decoration 0.3s ease;
  transition: text-decoration 0.3s ease, -webkit-text-decoration 0.3s ease;
  text-underline-offset: 0.3em;
}
.back-base-grayscale .topSupportDesk__card a[href^="tel:"]:hover {
  text-decoration: underline;
  text-decoration-thickness: auto;
  text-underline-offset: 0.3em;
  text-decoration-thickness: 2px;
}
.back-base-grayscale .topSupportDesk__card__link {
  position: relative;
  text-indent: -1.1em;
  padding-left: 1.1em;
}
.back-base-grayscale .topSupportDesk__card__link::before {
  color: var(--color-primary);
  content: "\f0a9";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-block;
}
.back-base-grayscale .l-footer__logo__link img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}
.back-base-grayscale .l-footer__social li a {
  border: 1px solid #fff;
}
.back-base-grayscale .l-spMenu {
  background-color: #000;
}
.back-base-grayscale .l-spMenu__udSetting__list li a {
  color: #fff;
  background-color: #000;
  outline: 2px solid #fff;
}
.back-base-grayscale .l-spMenu__udSetting__list li a.current {
  color: var(--color-white);
  background-color: var(--color-primary);
}
.back-base-grayscale .l-spMenu__udSetting__list li a:hover {
  outline: 2px solid var(--color-primary);
  outline-offset: -2px;
  color: #000;
  background-color: var(--color-medium-gray);
}
.back-base-grayscale .l-spMenu__navi__links a:hover {
  background-color: rgba(255, 255, 255, 0.5);
}
.back-base-grayscale .l-spMenu__btnNavi__links li a {
  border: 2px solid #fff;
}
.back-base-grayscale .l-spMenu__btnNavi__links li a:hover {
  color: #000;
  background-color: #fff;
}
.back-base-grayscale .c-arrow--down {
  background-color: #fff;
}
.back-base-grayscale .c-button:hover {
  background-color: #000;
  color: #fff !important;
  border-color: #fff;
}
.back-base-grayscale .c-editorStylesWrapper,
.back-base-grayscale .c-editorStylesWrapper [class^=c-block],
.back-base-grayscale .c-editorStylesWrapper [class*=l-col] {
  /* 見出し： lvl3 */
  /* c-block */
}
.back-base-grayscale .c-editorStylesWrapper h3:not([class*=u-heading]):not(.noteditor),
.back-base-grayscale .c-editorStylesWrapper .u-heading--lvl3,
.back-base-grayscale .c-editorStylesWrapper [class^=c-block] h3:not([class*=u-heading]):not(.noteditor),
.back-base-grayscale .c-editorStylesWrapper [class^=c-block] .u-heading--lvl3,
.back-base-grayscale .c-editorStylesWrapper [class*=l-col] h3:not([class*=u-heading]):not(.noteditor),
.back-base-grayscale .c-editorStylesWrapper [class*=l-col] .u-heading--lvl3 {
  border-left: 5px solid #fff;
  background-color: #000;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
}
.back-base-grayscale .c-editorStylesWrapper .c-block--fill,
.back-base-grayscale .c-editorStylesWrapper [class^=c-block] .c-block--fill,
.back-base-grayscale .c-editorStylesWrapper [class*=l-col] .c-block--fill {
  background: none !important;
  border: 1px solid #fff !important;
}
.back-base-grayscale .c-loadDeviceFilter {
  --filter-background-color: var(--color-black);
  --filter-border-color: #fff;
  --_border-color: #fff;
}
.back-base-grayscale .c-deviceCard {
  --deviceCard-border-color: #fff;
  --deviceCard-button-border-color: #fff;
  --deviceCard-button-color: #fff;
  --deviceCard-button-color-hover: #000;
  --deviceCard-button-background-color: #000;
  --deviceCard-button-background-color-hover: #fff;
}
.back-base-grayscale .c-editorStylesWrapper table tbody tr th,
.back-base-grayscale .c-editorStylesWrapper [class^=c-block] table tbody tr th,
.back-base-grayscale .c-editorStylesWrapper [class*=l-col] table tbody tr th {
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}
.back-base-grayscale .c-editorStylesWrapper blockquote,
.back-base-grayscale .c-editorStylesWrapper [class^=c-block] blockquote,
.back-base-grayscale .c-editorStylesWrapper [class*=l-col] blockquote {
  background-color: #000;
  border: 1px solid #fff;
}
.back-base-grayscale .c-block-fill {
  background-color: transparent;
  border: 2px solid var(--color-primary);
}
.back-base-grayscale .c-qaBox summary::before, .back-base-grayscale .c-qaBox-q::before {
  color: #fff;
}
.back-base-grayscale .c-qaBox-a::before {
  color: #fff;
}
.back-base-grayscale ul.c-jumpBtn-index {
  background-color: #000;
}