@charset "UTF-8";
/*============================================================


  seibulions.css


============================================================*/
/*============================================================
  poppin font
============================================================*/
@font-face {
  font-family: "Noto Sans CJK JP";
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: local("Noto Sans CJK JP Thin"), local("NotoSansCJKjp-Thin"),
    url(/assets/fonts/NotoSansJP-Thin.woff2) format("woff2"),
    url(/assets/fonts/NotoSansJP-Thin.woff) format("woff"),
    url(/assets/fonts/NotoSansJP-Thin.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans CJK JP";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: local("Noto Sans CJK JP Light"), local("NotoSansCJKjp-Light"),
    url(/assets/fonts/NotoSansJP-Light.woff2) format("woff2"),
    url(/assets/fonts/NotoSansJP-Light.woff) format("woff"),
    url(/assets/fonts/NotoSansJP-Light.otf) format("opentype");
}

@font-face {
  font-family: "Noto Sans CJK JP";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: local("Noto Sans CJK JP Medium"), local("NotoSansCJKjp-Medium"),
    url(/assets/fonts/NotoSansJP-Medium.woff2) format("woff2"),
    url(/assets/fonts/NotoSansJP-Medium.woff) format("woff"),
    url(/assets/fonts/NotoSansJP-Medium.otf) format("opentype");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: local("Poppins"), local("Poppins-Thin"),
    url("/assets/fonts/Poppins-Thin.ttf") format("truetype");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Poppins"), local("Poppins-Light"),
    url("/assets/fonts/Poppins-Light.ttf") format("truetype");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Poppins"), local("Poppins-Regular"),
    url("/assets/fonts/Poppins-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: local("Poppins"), local("Poppins-Medium"),
    url("/assets/fonts/Poppins-Medium.ttf") format("truetype");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local("Poppins"), local("Poppins-Bold"),
    url("/assets/fonts/Poppins-Bold.ttf") format("truetype");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: local("Poppins"), local("Poppins-SemiBold"),
    url("/assets/fonts/Poppins-SemiBold.ttf") format("truetype");
}
/*============================================================
  header-local none
============================================================*/
.sp-only {
  display: none;
}
@media (max-width: 480px) and (orientation: portrait) {
  .pc-only {
    display: none;
  }
  .sp-only {
    display: block;
  }
}
#seibulions-top > #main > #header-local {
  display: none;
}
/*============================================================
  contents title
============================================================*/
#seibulions-top > #main > #contents > .seibulions {
  position: relative;
}
#seibulions-top > #main > #contents > .seibulions  .wrap-statement {
  position: absolute;
  top: 50%;
  left: 7.14%;
  transform: translateY(-50%);
}
#seibulions-top > #main > #contents > .seibulions  .wrap-statement .statement {
  font-family: "Noto Sans CJK JP";
  font-weight: bold;
  font-size: 4.6rem;
  line-height: 6.7rem;
  /* letter-spacing: 0.76rem; */
}
.ttl-text {
  color: #00214B;
}



@media (max-width: 480px) and (orientation: portrait) {
  #seibulions-top > #main > #contents > .seibulions .wrap-statement {
    position: absolute;
    top: auto;
    bottom: 42px;
    left: 50%;
    width: 87.73%;
    transform: translate(-50%, 0%);
  }
  #seibulions-top > #main > #contents > .seibulions .wrap-statement .statement {
    font-family: "Noto Sans CJK JP";
    font-weight: bold;
    font-size: 2.7rem;
    line-height: 4rem;
    letter-spacing: 0.2rem;
  }
  .ttl-text {
    font-size: 2.47rem;
    line-height: 3.7rem;
    padding: 0.34rem;
  }
}


/*============================================================
  about
============================================================*/
.about-section {
  padding: 4.6rem 0 9.3rem
}
.about-img-wrap {
  width: 92vw;
  max-width: 1532px;
  margin: 0 auto;
}
.about-txt-wrap {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
.about-txt {
  margin: 2.7rem 0 0;
  color: #00214B;
  font-weight: 400;
  font-size: 1.9rem;
  line-height: 2;
  letter-spacing: 0.2rem;
}
@media (max-width: 480px) and (orientation: portrait) {
  .about-section {
    padding: 3.4rem 0 5rem;;
  }
  .about-img-wrap {
    width: 87.73%;
  }
  .about-txt-wrap {
    text-align: left;
  }
  .about-txt {
    width: 86.67vw;
    margin: 3.1rem auto 0;
    font-size: 1.7rem;
    line-height: 3.65rem;
    letter-spacing: 0.1rem;
  }
}


/*============================================================
  cap
============================================================*/
.cap-section {
  width: 100%;
  padding: 10.3rem 0;
  background-color: #001E40;
}
.cap-wrap {
  width: 90%;
  max-width: 1226px;
  margin: 0 auto;
  background-image: url(../images/seibulions/ph_bg_deco.png);
  background-position: top 285px center;
  background-size: 566px auto;
  background-repeat: no-repeat;
}
.cap-wrap-first {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin: 0 auto;
}
.cap-wrap-second {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  margin: 4rem auto 0;
}
.cap-head {
  margin: 0 0 2.1rem;
  color: #fff;
  font-weight: bold;
  font-size: 3.4rem;
  line-height: 5.2rem;
  letter-spacing: 0.3rem;
}
.cap-txt {
  margin: 0.4rem 0 0;
  color: #fff;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 3.2rem;
}
.cap-img-first {
  width: 45.51%;
  max-width: 558px;
  /* margin: 0 -50px 0 0px; */
}
.cap-img-second {
  width: 40.21vw;
  max-width: 493px;
  padding: 0 0 86px;
  transform: translateX(27px);
}
.cap-img-third {
  width: 40.78vw;
  max-width: 500px;
  margin: 0 20px 0 0;
}
@media only screen and (max-width: 1024px) {
  .cap-wrap {
    background-position: top 23.25vw center;
    background-size: 46.17vw auto;
  }
  .cap-img-first {
    margin: 0;
  }
}
@media (max-width: 480px) and (orientation: portrait) {
  .cap-section {
    padding: 4.8rem 0 5.6rem;
  }
  .cap-head {
    font-size: 2.5rem;
    line-height: 4.35rem;
  }
  .cap-wrap-first {
    display: block;
    width: 86.67vw;
    margin: 0 auto;
  }
  .cap-wrap-second {
    display: block;
    margin: 18.13vw 0 0;
  }
  .cap-img-first {
    width: 64.53vw;
    margin: 2.6rem auto 0;
  }
  .cap-wrap {
    display: block;
    margin: 0 auto;
    background-position: right 0 bottom 60.13vw;
    background-size: 70.93vw auto;
  }
  .cap-img-second {
    width: 45.6vw;
    /* margin: 0 0 0 6.67vw; */
    padding: 0;
    transform: none;
  }
  .cap-img-third {
    width: 46.4vw;
    margin: 0 0 0 43.93vw;
  }
  .cap-txt {
    margin: 1.85rem 0 0;
    font-size: 1.45rem;
    line-height: 2.5rem;
    letter-spacing: 0.05rem;
  }
}



/*============================================================
  ad
============================================================*/
.ad-section {
  padding: 7.7rem 0 10.3rem;
}
.ad-txtimg {
  width: 90%;
  max-width: 1181px;
  margin: 0 auto;
}
.ad-txt {
  margin: 5.1rem auto 0;
  color: #00214B;
  text-align: center;
  font-weight: 400;
  font-size: 1.6rem;
}
.ad-wrap {
  display: flex;
  justify-content: space-between;
  width: 92vw;
  max-width: 1226px;
  margin: 6rem auto 0;
}
.ad-img-first {
  width: 52.86%;
  max-width: 649px;
}
.ad-img-second {
  width: 46.06%;
  max-width: 565px;
}
@media (max-width: 480px) and (orientation: portrait) {
  .ad-section {
    padding: 5.4rem 0 6.18rem;
  }
  .ad-txtimg {
    width: 66.67vw;
  }
  .ad-txt {
    margin: 2.3rem auto 0;
    font-size: 1.45rem;
  }
  .ad-wrap {
    display: block;
    margin: 9.6vw auto 0;
  }
  .ad-img-first {
    width: 69.87vw;
    margin: 0 0 0 6.67vw;
  }
  .ad-img-second {
    width: 60.53vw;
    margin: 3.41vw 6.67vw 0 28.8vw;
  }
}





/*============================================================
  footer block bar none
============================================================*/
#seibulions-top > #footer-global > .block-bar {
  display: none;
}

.footer-seibulions {
  padding: 7rem 0;
  text-align: center;
  background-color: #001E40;
}
.footer-img {
  max-width: 300px;
  margin: 0 auto;
}
.foorer-linktxt {
  display: inline-block;
  position: relative;
  margin: 1.4rem 2rem 0 0;
  color: #fff;
  text-decoration: underline !important;
  font-size: 1.6rem;
  transition: 0.3s;
}
.foorer-linktxt::after {
  content: "";
  position: absolute;
  bottom: 2px;
  right: -24px;
  width: 16px;
  height: 16px;
  background-image: url(/assets/images/seibulions/link.svg);
  background-size: 100% auto;
  background-position: center;
}
.foorer-linktxt:hover {
  transition: 0.3s;
  opacity: 0.7;
}
@media (max-width: 480px) and (orientation: portrait) {
  .footer-seibulions {
    padding: 5.6rem 0;
  }
  .footer-img {
    width: 44.8vw;
  }
  .foorer-linktxt {
    margin: 1.2rem 2rem 0 0;
    font-size: 1.55rem;
  }
  .foorer-linktxt::after {
    bottom: 0.53vw;
    right: -5.6vw;
    width: 3.47vw;
    height: 3.47vw;
  }
}


/* add-style */
#seibulions-top .btn.szl {
  width: 30rem;
}

@media (min-width: 481px) {
  .nowrap {
    white-space: nowrap;
  }
}