/* First view for the front page only. */
body.home #header-full {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  background: #fff !important;
}
body.home #headbox-bg { background: #fff !important; }
body.home #headbox .descr { color: #334b5b !important; }
body.home #playnow { display: none !important; }
body.home #gazou-wide.hb-firstview-wrap,
body.home #st-headerbox.hb-firstview-box {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
}
body.home #st-header.hb-firstview {
  box-sizing: border-box;
  display: grid !important;
  grid-template-columns: 45% 55%;
  grid-template-rows: minmax(0, 1fr) auto;
  grid-template-areas: "copy visual" "action visual";
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 530px;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  background: #f4f7f8;
  color: #173b53;
}
.hb-firstview__copy {
  grid-area: copy;
  align-self: end;
  box-sizing: border-box;
  padding: 48px 7% 18px 10%;
}
.hb-firstview__copy h1 {
  margin: 0 0 24px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #153c58;
  font-size: clamp(30px, 2.9vw, 46px);
  font-weight: 700;
  letter-spacing: .025em;
  line-height: 1.35;
  text-wrap: balance;
}
.hb-firstview__copy h1 span { display: block; }
.hb-firstview__copy p {
  margin: 0;
  color: #334b5b;
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.95;
}
.hb-firstview__visual {
  grid-area: visual;
  position: relative;
  min-width: 0;
  margin: 0;
  background: #d5dfe3;
}
.hb-firstview__visual img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 530px;
  object-fit: cover;
  object-position: 60% center;
}
.hb-firstview__action {
  grid-area: action;
  box-sizing: border-box;
  padding: 8px 7% 48px 10%;
}
.hb-firstview__proof {
  margin: 0 0 22px;
  color: #335a70;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.6;
}
.hb-firstview__links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.hb-firstview__link {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 18px;
  border: 2px solid #0d527c;
  border-radius: 3px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none !important;
  transition: background-color .2s ease, color .2s ease;
}
.hb-firstview__link--primary { background: #0d527c; color: #fff !important; }
.hb-firstview__link--secondary { background: #fff; color: #0d527c !important; }
.hb-firstview__link--primary:hover,
.hb-firstview__link--primary:focus-visible { background: #073a59; color: #fff !important; }
.hb-firstview__link--secondary:hover,
.hb-firstview__link--secondary:focus-visible { background: #e7f1f6; color: #0d527c !important; }
.hb-firstview__link:focus-visible { outline: 3px solid #e2a431; outline-offset: 3px; }
@media (max-width: 767px) {
  body.home #st-header.hb-firstview {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    grid-template-areas: "copy" "visual" "action";
    min-height: 0;
  }
  .hb-firstview__copy { padding: 30px 20px 28px; }
  .hb-firstview__copy h1 {
    margin-bottom: 16px;
    font-size: clamp(20px, 6.2vw, 30px);
    letter-spacing: -.01em;
    line-height: 1.4;
  }
  .hb-firstview__copy p { font-size: 15px; line-height: 1.8; }
  .hb-firstview__visual img {
    height: min(64vw, 310px);
    min-height: 220px;
    object-position: 60% center;
  }
  .hb-firstview__action { padding: 24px 24px 32px; }
  .hb-firstview__proof { margin-bottom: 16px; font-size: 13px; }
  .hb-firstview__links { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .hb-firstview__link { width: 100%; min-height: 50px; }
}
