/* ---------------------------------------------------- */
/********************************
 * module
********************************/
/* heading +++++++++++++++++++ */
.home-ttl-h2 {
  text-align: center;
  font-weight: normal;
  margin: 0;
}

@media (max-width: 767.98px) {
  .home-ttl-h2 {
    font-size: 2.8rem;
    line-height: 1.43;
  }
}
@media (min-width: 768px) {
  .home-ttl-h2 {
    font-size: 3.6rem;
    line-height: 1.5556;
    letter-spacing: 1px;
  }
}
/* info +++++++++++++++++++ */
.home-info {
  margin: 0 auto;
}

@media (max-width: 767.98px) {
  .home-info {
    max-width: 528px;
  }
}
@media (min-width: 768px) {
  .home-info {
    max-width: 1056px;
    padding: 0 48px;
  }
}
/* infolink +++++++++++++++++++ */
.home-infolinks {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  text-align: left;
  --infolinks-bgc: #ebeeff;
}
.home-infolinks.-maintenance {
  --infolinks-bgc: #ffeec5;
}
.home-infolinks.-info {
  --infolinks-bgc: #fcf2f2;
  color: #cc0100;
}
.home-infolinks > li {
  margin: 0;
  padding: 0;
}
.home-infolinks > li > a {
  position: relative;
  display: block;
  padding: 14px 32px;
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
  background-color: var(--infolinks-bgc);
}

@media (max-width: 767.98px) {
  .home-infolinks > li > a {
    margin: 8px auto;
    padding: 8px 16px;
  }
}
@media (min-width: 768px) {
  .home-infolinks > li > a {
    margin: 16px auto;
  }
  .home-infolinks > li > a::before {
    position: absolute;
    top: 50%;
    right: 16px;
    display: block;
    width: 1em;
    height: 1em;
    margin-top: -0.5em;
    background: currentColor;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center;
    -webkit-mask-image: url(/assets/images/icon/link/icon-link-arrow.svg);
    mask-image: url(/assets/images/icon/link/icon-link-arrow.svg);
    overflow: hidden;
    white-space: nowrap;
    content: "";
  }
  .home-infolinks > li > a:hover {
    opacity: 0.8;
  }
}
/********************************
 * hero
********************************/
.home-hero {
  position: relative;
}

@media (max-width: 767.98px) {
  .home-hero {
    margin-top: -64px;
  }
  .home-hero .swiper-wrapper {
    aspect-ratio: 360/560;
  }
  .home-hero .m-swiper_slider .swiper-pagination {
    background-color: var(--color-rich-black-003);
  }
}
@media (min-width: 768px) {
  .home-hero .swiper-wrapper {
    width: 1280px;
    height: 480px;
  }
}
/********************************
 * account
********************************/
@media (max-width: 767.98px) {
  .home-account {
    margin: 0 auto;
    padding: 0 0 24px;
    background-color: var(--color-rich-black-003);
    text-align: center;
  }
  .home-account [href*="/naviLogin.do"] {
    display: none;
  }
}
@media (min-width: 768px) {
  .home-hero > .home-account {
    position: absolute;
    top: 24px;
    left: 50%;
    z-index: 2;
    transform: translateX(-50%);
    margin-left: 468px;
  }
  .home-account {
    background-color: rgba(255, 255, 255, 0.5);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    border-radius: 8px;
    pointer-events: auto;
    width: 272px;
    height: 432px;
    padding: 32px;
    text-align: center;
    line-height: 1;
    opacity: 1;
    transition: all 0.3s;
  }
  .home-account.is-open-sk, .home-account:hover {
    background-color: rgba(255, 255, 255, 0.7);
    box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1);
  }
  .home-account.is-open-sk {
    background-color: rgba(255, 255, 255, 0.8);
  }
  .home-account > ._entrance {
    margin: 0 auto;
    padding-bottom: 24px;
    border-bottom: 2px solid var(--color-rich-black-020);
  }
  .home-account [href*="/naviLogin.do"] {
    display: block;
    margin: 26px auto 0;
    color: var(--color-rich-black-080);
    font-size: 1.4rem;
    line-height: 1.429;
    letter-spacing: 1.08px;
    text-decoration: none;
  }
  .home-account [href*="/naviLogin.do"]:hover {
    color: var(--c-text-link-hover);
    text-decoration: none;
  }
  .swiper.-playing_video ~ .home-account {
    opacity: 0;
  }
}
/********************************
 * reason
********************************/
.home-reason {
  text-align: center;
}
.home-reason > ul {
  list-style: none;
  margin: 0 auto;
  padding: 0;
}
.home-reason_item > h3 {
  margin: 0;
  font-weight: normal;
}
.home-reason_item > p {
  margin: 0 auto;
  color: var(--color-rich-black-060);
  text-align: justify;
}

@media (max-width: 767.98px) {
  .home-reason {
    margin-top: 80px;
  }
  .home-reason > ul {
    max-width: 480px;
  }
  .home-reason_item {
    padding: 48px 0;
    font-size: 1.2rem;
    line-height: 1.667;
  }
  .home-reason_item + .home-reason_item {
    box-shadow: 0 -1px 0 0 var(--color-rich-black-020);
  }
  .home-reason_item > h3 {
    margin-bottom: 36px;
  }
  .home-reason_item > p {
    padding: 0 32px;
  }
  .home-reason_btn {
    width: 200px;
  }
}
@media (min-width: 768px) {
  .home-reason {
    margin-top: 96px;
  }
  .home-reason > ul {
    display: flex;
    margin: 96px auto 64px;
  }
  .home-reason_item {
    flex: 1 1 100%;
    min-height: 496px;
    margin: 0;
    padding: 4px 48px;
  }
  .home-reason_item:nth-child(3) {
    order: -1;
  }
  .home-reason_item:nth-child(1) {
    box-shadow: -1px 0 0 0 var(--color-rich-black-020), 1px 0 0 0 var(--color-rich-black-020);
  }
  .home-reason_item > h3 {
    font-size: 2.4rem;
    line-height: 1.17;
    margin: 0 0 56px;
  }
  .home-reason_item > p {
    font-size: 1.4rem;
    line-height: 2;
  }
  .home-reason_btn {
    width: 240px;
  }
}
/********************************
 * service
********************************/
.home-service ._panels {
  display: grid;
  margin: 0 auto;
}
.home-service_panel {
  overflow: hidden;
  display: block;
  border: 2px solid #c7cdd2;
  border-radius: 16px;
  background-color: #f7f7f9;
  text-decoration: none;
}
.home-service_panel > ._ttl {
  position: relative;
  overflow: hidden;
  text-align: center;
  aspect-ratio: 528/264;
}
.home-service_panel > ._ttl > img {
  margin: -2px;
  -o-object-fit: cover;
     object-fit: cover;
}
.home-service_panel > ._ttl > b {
  position: absolute;
  top: 21.21%;
  left: 0;
  display: block;
  overflow: hidden;
  width: 100%;
  margin: 0;
  font-size: 0;
}
.home-service_panel > ._ttl > b::before, .home-service_panel > ._ttl > b::after {
  display: inline-block;
  width: 19.887%;
  max-width: 105px;
  padding-top: 34.285%;
  padding-top: 6.818%;
  background-size: 100% auto;
  background-image: url(/assets/images/sprite-ttl-service-label.svg);
}
.home-service_panel > ._ttl > b::before {
  content: "";
}
.home-service_panel.-fxneo > ._ttl > b::before {
  background-position-y: 44.4%;
}
.home-service_panel.-cfd > ._ttl > b::before {
  background-position-y: 77.9%;
}
.home-service_panel.-kabu > ._ttl > b::before {
  background-position-y: 11.2%;
}
.home-service_panel.-ixop > ._ttl > b::before {
  background-position-y: 89%;
}
.home-service_panel.-ixop > ._ttl > b::after {
  margin-left: 2.4%;
  background-position-y: 55.4%;
  content: "";
}
.home-service_panel > ._ttl > p {
  position: absolute;
  top: 40.15%;
  width: 100%;
  margin: 0;
  font-size: 3.2rem;
  line-height: 1.5;
}
.home-service_panel.-fxneo > ._ttl > p {
  color: #b38224;
  letter-spacing: 0.25;
}
.home-service_panel.-cfd > ._ttl > p {
  color: #4c4cad;
  letter-spacing: 0.25;
}
.home-service_panel.-kabu > ._ttl > p {
  color: #3e6b99;
}
.home-service_panel.-ixop > ._ttl > p {
  color: #0a1f33;
}
.home-service_panel.-ixop > ._ttl > p > span {
  letter-spacing: -3;
}
.home-service_panel > p {
  font-size: 1.4rem;
  line-height: 1.714;
  margin: 18px 46px 14px;
}
.home-service_list {
  display: grid;
  list-style: none;
  margin: 0 auto;
}
.home-service_list > li {
  display: flex;
}
.home-service_list > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 80px;
  margin: 0;
  border: 2px solid #c7cdd2;
  border-radius: 8px;
  background-color: #f7f7f9;
  font-size: 2rem;
  text-align: center;
  text-decoration: none;
}
.home-service_list > li > a:hover {
  border-color: currentColor;
}
.home-service_footer {
  position: relative;
  margin: 0 auto;
}
.home-service_btn {
  display: block;
  margin: 0 auto;
}
.home-service_link_btn {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  text-decoration: none;
}

@media (max-width: 767.98px) {
  .home-service {
    margin-top: 120px;
  }
  .home-service ._panels {
    gap: 24px;
    max-width: 528px;
    margin-top: 56px;
  }
  .home-service_panel {
    width: 100%;
  }
  .home-service_panel > ._ttl {
    aspect-ratio: 328/164;
  }
  .home-service_panel > ._ttl > p {
    top: 43.9%;
    font-size: 5vw;
    font-size: min(26px, 5vw);
    line-height: 1.556;
  }
  .home-service_panel > p {
    margin: 22px;
  }
  .home-service_list {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 16px;
    max-width: 528px;
    margin-top: 24px;
    padding: 0;
  }
  .home-service_list > li > a {
    min-height: 48px;
    font-size: 1.6rem;
  }
  .home-service_footer {
    margin-top: 72px;
  }
  .home-service_btn {
    width: 200px;
  }
  .home-service_link_btn {
    width: 200px;
    height: 56px;
    margin: 64px auto 0;
  }
}
@media (min-width: 768px) {
  .home-service {
    margin-top: 184px;
  }
  .home-service ._panels {
    grid-template-columns: repeat(2, 1fr);
    gap: 48px;
    padding: 96px 48px 0;
  }
  .home-service_panel {
    width: 528px;
    transition: border-color 0.3s ease;
  }
  .home-service_panel:hover {
    border-color: #0067c3;
  }
  .home-service_panel > ._ttl > img {
    transition: transform 0.5s ease;
  }
  .home-service_panel:hover > ._ttl > img {
    transform: scale(1.05);
  }
  .home-service_list {
    grid-template-columns: repeat(4, 1fr);
    gap: 24px 48px;
    margin-top: 48px;
    padding: 0 48px;
  }
  .home-service_list > li > a {
    min-height: 80px;
    font-size: 2rem;
  }
  .home-service_footer {
    margin-top: 136px;
  }
  .home-service_btn {
    width: 240px;
  }
  .home-service_link_btn {
    position: absolute;
    top: 0;
    right: 72px;
    width: 164px;
    height: 72px;
  }
}
/********************************
 * investment
********************************/
.home-investment {
  ---fullwide-bgc: #f2f2f2;
}
.home-investment [data-ruby] {
  position: relative;
}
.home-investment [data-ruby]::before {
  content: attr(data-ruby);
  position: absolute;
  top: -16px;
  left: 0;
  font-size: 1.4rem;
  font-weight: bold;
}
.home-investment > ._panels {
  display: grid;
  margin: 0 auto;
}
.home-investment_panel {
  position: relative;
  width: 100%;
  border-radius: 16px;
  text-decoration: none;
  opacity: 1;
  transition: opacity 0.3s ease;
}
.home-investment_panel::before {
  position: absolute;
  background-size: contain;
  content: "";
}
.home-investment_panel:nth-child(1) {
  background-color: #3fb2d1;
}
.home-investment_panel:nth-child(2) {
  background-color: #9fbd4b;
}
.home-investment_panel:nth-child(3) {
  background-color: #e07d43;
}
.home-investment_panel:nth-child(4) {
  background-color: #56ccac;
}
.home-investment_panel:nth-child(1)::before {
  background-image: url(/assets-home/images/investment-icon-money.svg);
}
.home-investment_panel:nth-child(2)::before {
  background-image: url(/assets-home/images/investment-icon-business.svg);
}
.home-investment_panel:nth-child(3)::before {
  background-image: url(/assets-home/images/investment-icon-yutai.svg);
}
.home-investment_panel:nth-child(4)::before {
  background-image: url(/assets-home/images/investment-icon-nisa.svg);
}
.home-investment_panel > ._title {
  font-size: 3.2rem;
  line-height: 1.5;
  font-weight: bold;
  color: #fff;
  text-align: center;
  margin: 0 0 16px;
}
.home-investment_panel > ._text {
  line-height: 1.75;
  color: #fff;
  margin: 0 0 40px;
  text-align: center;
}
.home-investment_panel > ._link {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  width: 120px;
  height: 32px;
  border-radius: 2px;
  box-shadow: inset 0 0 0 1px #fff;
  margin: 0 auto;
}

@media (max-width: 767.98px) {
  .home-investment {
    margin-top: 64px;
    padding: 80px 0;
  }
  .home-investment > ._panels {
    gap: 24px;
    max-width: 528px;
    margin-top: 48px;
  }
  .home-investment_panel {
    padding: 32px;
  }
  .home-investment_panel::before {
    top: 16px;
    left: 16px;
    width: 40px;
    height: 40px;
  }
  .home-investment_panel > ._title {
    margin: 0 -16px 16px;
    font-size: 2.8rem;
    line-height: 1.43;
  }
  .home-investment_panel > ._text {
    text-align: left;
    margin-bottom: 16px;
    font-size: 1.6rem;
  }
}
@media (min-width: 768px) {
  .home-investment {
    margin-top: 184px;
    padding: 112px 0 184px;
  }
  .home-investment > ._panels {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    padding: 104px 96px 0;
  }
  .home-investment_panel {
    min-height: 320px;
    padding: 48px 48px 32px;
  }
  .home-investment_panel:hover {
    opacity: 0.8;
  }
  .home-investment_panel::before {
    top: 24px;
    left: 24px;
    width: 48px;
    height: 48px;
  }
  .home-investment_panel > ._title {
    font-size: 3.2rem;
    margin-bottom: 16px;
  }
  .home-investment_panel > ._text {
    line-height: 1.75;
  }
  .home-investment_panel > ._link {
    width: 120px;
    height: 32px;
  }
}
/********************************
 * rate
********************************/
.home-rate {
  display: grid;
  text-align: center;
}
.home-rate_panel {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 0;
  margin: 0 auto;
}
.home-rate_panel > a {
  order: 1;
  width: 168px;
  margin: 0 auto;
  padding-right: 0;
  padding-left: 0;
}
.home-rate_item {
  display: grid;
  align-content: center;
  height: 144px;
  margin: 0;
}
.home-rate_item:nth-of-type(2n) {
  box-shadow: inset 1px 0 0 0 var(--color-rich-black-010);
}
.home-rate_item > ._ttl {
  margin: 0;
  font-size: 1.6rem;
  line-height: 1;
}
.home-rate_item > ._rate {
  margin: 8px 0;
  line-height: 4.8rem;
  font-weight: bold;
}
.home-rate_item > ._change {
  font-size: 2.1rem;
  font-weight: normal;
  margin: 0;
  line-height: 1;
}
.home-rate_item > ._change.-up {
  color: #e65d8b;
}
.home-rate_item > ._change.-down {
  color: #528fcc;
}

@media (max-width: 767.98px) {
  .home-rate {
    display: grid;
    gap: 64px;
    margin-top: 72px;
    margin-bottom: 96px;
  }
  .home-rate_panel {
    width: auto;
    max-width: 528px;
  }
  .home-rate_panel > a {
    margin-top: 48px;
  }
  .home-rate_item {
    width: 50%;
  }
  .home-rate_item > ._rate {
    font-size: 3.2rem;
  }
}
@media (min-width: 768px) {
  .home-rate {
    grid-template-columns: repeat(2, 1fr);
    gap: 48px;
    margin-top: 168px;
    margin-bottom: 120px;
    padding: 0 96px;
  }
  .home-rate_panel {
    width: 480px;
  }
  .home-rate_panel > a {
    margin-top: 80px;
  }
  .home-rate_item {
    width: 240px;
  }
  .home-rate_item > ._rate {
    font-size: 3.6rem;
  }
}
/********************************
 * news
********************************/
.home-news {
  margin: 0 auto;
}
.home-news > section {
  display: flex;
  flex-direction: column;
}
.home-news > section > p {
  margin: 0;
  line-height: 4.8rem;
  text-align: center;
}
.home-news > section > a {
  width: 168px;
  margin: auto auto 0;
}

@media (max-width: 767.98px) {
  .home-news {
    margin-top: 96px;
  }
  .home-news > section {
    margin-top: 40px;
    margin-bottom: 80px;
  }
  .home-news > section > p {
    margin-bottom: 48px;
    font-size: 1.8rem;
  }
  .home-news > section > ul {
    margin-bottom: 64px;
  }
}
@media (min-width: 768px) {
  .home-news {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 48px 96px;
    margin-top: 160px;
    padding: 0 48px;
  }
  .home-news > h2 {
    grid-column-end: span 2;
  }
  .home-news > section > p {
    margin-bottom: 56px;
    font-size: 2.4rem;
  }
  .home-news > section > ul {
    margin-bottom: 88px;
  }
}
/********************************
 * sysstat
********************************/
.home-sysstat {
  width: 100%;
  margin: 0 auto;
}

@media (max-width: 767.98px) {
  .home-sysstat {
    margin-top: 160px;
  }
}
@media (min-width: 768px) {
  .home-sysstat {
    margin-top: 136px;
  }
}
/********************************
 * bnr
********************************/
.home-bnr {
  list-style: none;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}
.home-bnr > li {
  width: 100%;
  max-width: 264px;
  margin: 0 auto;
}
.home-bnr > li > * {
  width: 100%;
}
.home-bnr > li img {
  width: 100%;
}

@media (max-width: 767.98px) {
  .home-bnr {
    margin-top: 32px;
    margin-bottom: 24px;
  }
  .home-bnr > li {
    padding: 12px 0;
  }
}
@media (min-width: 768px) {
  .home-bnr {
    display: flex;
    gap: 48px;
    max-width: 1232px;
    margin-top: 40px;
    margin-bottom: 144px;
  }
}
/* ----------------------------------------------------
sys module
---------------------------------------------------- */
/********************************
 * loginbox
********************************/
@media (max-width: 767.98px) {
  .sys-loginbox {
    display: none !important;
  }
}
@media (min-width: 768px) {
  form.sys-loginbox::before,
  form.sys-loginbox::after {
    position: absolute;
    left: 8px;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 24px 24px;
    background-position: center center;
    content: "";
    pointer-events: none;
  }
  form.sys-loginbox::before {
    top: 64px;
    background-image: url(/assets-home/images/icon-userid.svg);
  }
  form.sys-loginbox::after {
    top: 120px;
    background-image: url(/assets-home/images/icon-loginpassword.svg);
  }
  .sys-loginbox {
    position: relative;
    display: block;
    width: 208px;
    padding-top: 16px;
    /* loggedin */
    /* maintenance */
    /* notconnect */
  }
  .sys-loginbox [id=skOpen] {
    position: relative;
    display: block;
    width: 24px;
    height: 24px;
    cursor: pointer;
    margin: 0 auto 16px;
    overflow: hidden;
    text-indent: 200%;
    white-space: nowrap;
  }
  .sys-loginbox [id=skOpen]:hover {
    opacity: 0.8;
  }
  .sys-loginbox [id=skOpen]::before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 24px;
    height: 24px;
    background-image: url(/assets-home/images/icon-keyboard.svg);
    content: "";
  }
  .sys-loginbox input {
    display: block;
    width: 208px;
    height: 40px;
    margin: 0 0 16px;
    padding: 8px;
    padding-left: 40px;
    border-radius: 2px;
    box-shadow: inset 0 0 0 1px rgba(10, 31, 51, 0.2);
    background-color: rgba(255, 255, 255, 0.4);
    border: none;
    outline: none;
    letter-spacing: 1px;
  }
  .sys-loginbox input:-moz-placeholder-shown {
    font-size: 1.2rem !important;
    letter-spacing: 0.25px;
  }
  .sys-loginbox input:placeholder-shown {
    font-size: 1.2rem !important;
    letter-spacing: 0.25px;
  }
  .sys-loginbox input.is-focus,
  .sys-loginbox input:focus {
    outline: 1px solid #32aed7;
    box-shadow: 0 0 0 2px #32aed7 inset;
  }
  .sys-loginbox input.is-focus {
    outline: 1px solid #32aed7;
    box-shadow: 0 0 0 2px #32aed7 inset;
  }
  .sys-loginbox [value=Login],
  .sys-loginbox [href*="/sso-logout"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 3px;
    background-color: #0c9dc2;
    color: #fff;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    width: 128px;
    height: 40px;
    margin: 24px auto 16px;
    cursor: pointer;
    transition: filter 0.25s ease;
  }
  .sys-loginbox [value=Login]:hover,
  .sys-loginbox [href*="/sso-logout"]:hover {
    filter: saturate(130%);
  }
  .sys-loginbox [href*="/sso-logout"] {
    padding-right: 12px;
  }
  .sys-loginbox [href*="/sso-logout"]::after {
    content: "";
    width: 16px;
    height: 16px;
    background: url(/assets-home/images/icon-logout.svg);
    background-size: 100%;
    position: absolute;
    right: 6px;
  }
  .sys-loginbox [href*="/corp/support/describe/password"] {
    color: rgba(10, 31, 51, 0.8);
    font-size: 1.2rem;
    text-align: center;
    text-decoration: none;
  }
  .sys-loginbox [href*="/corp/support/describe/password"]:hover {
    color: #0067c3;
  }
  .sys-loginbox.-loggedin > p {
    position: relative;
    width: 160px;
    height: 120px;
    margin: 16px auto 24px;
    overflow: hidden;
    text-indent: 200%;
    white-space: nowrap;
  }
  .sys-loginbox.-loggedin > p::before {
    position: absolute;
    display: block;
    width: 160px;
    height: 120px;
    background-image: url(/assets-home/images/img-hatchukun-logged-in.svg);
    content: "";
  }
  .sys-loginbox.-maintenance {
    height: 248px;
    padding-top: 96px;
    font-size: 1.4rem;
    line-height: 1.7;
    text-align: center;
  }
  .sys-loginbox.-maintenance > a {
    color: #0a89a8;
    text-decoration: underline;
    font-weight: bold;
  }
  .sys-loginbox.-notconnect {
    height: 248px;
    padding-top: 96px;
    font-size: 1.4rem;
    line-height: 1.7;
    text-align: center;
  }
  .sys-loginbox.-notconnect > p {
    margin: 0;
  }
  .is-open-sk .sys-loginbox input {
    background-color: #fff;
    box-shadow: 0 0 0 1px rgba(50, 174, 215, 0.4) inset;
  }
}
/********************************
 * sysstat headline
********************************/
.sys-headline {
  --sys-headline-color: currentColor;
  margin: 0 auto;
  padding: 0;
  text-align: left;
}
.sys-headline.-during {
  --sys-headline-color: var(--color-sysstat-during);
}
.sys-headline.-verifying {
  --sys-headline-color: var(--color-sysstat-verifying);
}
.sys-headline.-restoration {
  --sys-headline-color: var(--color-sysstat-restoration);
}
.sys-headline.-final {
  --sys-headline-color: var(--color-rich-black-060);
}
.sys-headline > li {
  position: relative;
  list-style: none;
  margin: 16px auto;
  border-radius: 8px;
  color: var(--sys-headline-color);
  border: 2px solid var(--sys-headline-color);
}
.sys-headline > li > a {
  display: block;
  color: inherit;
  font-weight: bold;
  text-decoration: none;
}
.sys-headline > li > a::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: block;
  content: "";
}

@media (max-width: 767.98px) {
  .sys-headline > li {
    margin-top: 8px;
    margin-bottom: 8px;
    padding: 6px 14px;
  }
}
@media (min-width: 768px) {
  .sys-headline > li {
    display: flex;
    gap: 16px;
    padding: 8px 30px;
  }
  .sys-headline > li::before {
    position: absolute;
    top: 50%;
    right: 16px;
    display: block;
    width: 1em;
    height: 1em;
    margin-top: -0.5em;
    background: currentColor;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center;
    -webkit-mask-image: url(/assets/images/icon/link/icon-link-arrow.svg);
    mask-image: url(/assets/images/icon/link/icon-link-arrow.svg);
    overflow: hidden;
    white-space: nowrap;
    content: "";
  }
  .sys-headline > li:hover {
    opacity: 0.8;
  }
}
/********************************
 * sysstat info_list/press_list
********************************/
.sys-newslist {
  margin: 0;
  padding: 0;
  list-style: none;
}
.sys-newslist > li {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  margin: 0;
  text-align: left;
}
.sys-newslist > li > span {
  display: block;
  margin-right: 20px;
  color: var(--color-rich-black-060);
  font-size: 1.4rem;
  line-height: 2.4rem;
}
.sys-newslist > li > i {
  display: block;
  width: 64px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(/assets-home/images/badge-important.svg);
  overflow: hidden;
  white-space: nowrap;
  text-indent: 120%;
}
.sys-newslist > li > a {
  display: block;
  width: 100%;
  font-size: 1.6rem;
  line-height: 1.75;
  text-decoration: none;
}
.sys-newslist > li > a:hover {
  text-decoration: underline;
}
.sys-newslist > li > a::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  content: "";
}

@media (max-width: 767.98px) {
  .sys-newslist > li + li {
    margin-top: 32px;
  }
  .sys-newslist > li > a {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
}
@media (min-width: 768px) {
  .sys-newslist > li {
    height: 112px;
  }
  .sys-newslist > li + li {
    margin-top: 16px;
  }
}
/********************************
 * sysstat banner
********************************/
.sys-banner {
  margin: 0 auto;
  color: var(--color-sysstat-restoration);
}
.sys-banner > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 160px;
  height: 64px;
  margin: 0 auto;
  border-radius: 4px;
  border: 2px solid currentColor;
  color: currentColor;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.333;
  text-align: center;
  text-decoration: none;
}
.sys-banner.-error {
  color: var(--color-sysstat-during);
}
.sys-banner.-verify {
  color: var(--color-sysstat-verifying);
}/*# sourceMappingURL=home.css.map */