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


  sunouchi.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;
  }
}
#sunouchi-top > #main > #header-local {
  display: none;
}
/*============================================================
  contents title
============================================================*/
#sunouchi-top > #main > #contents > .sonoda {
  position: relative;
}
#sunouchi-top > #main > #contents > .wrap-ttl {
  position: absolute;
  top: 5rem;
  left: 8rem;
}
#sunouchi-top > #main > #contents > .wrap-ttl .ttl {
  font-family: "Poppins";
  font-weight: 600;
  font-size: 2.5rem;
  /*color: #25265A;*/
  color: #fff;
  line-height: 3.2rem;
}
#sunouchi-top > #main > #contents > .wrap-ttl .ttl-sub {
  font-family: "Poppins";
  font-weight: 100;
  font-size: 2.5rem;
  /*color: #25265A;*/
  color: #fff;
  line-height: 3.2rem;
}
#sunouchi-top > #main > #contents > .wrap-statement {
  position: absolute;
  top: 40rem;
  left: 8rem;
}
#sunouchi-top > #main > #contents > .wrap-statement .statement {
  font-family: "Noto Sans CJK JP";
  font-weight: 100;
  font-size: 6rem;
  /*color: #25265A;*/
  color: #fff;
  line-height: 8rem;
}
#sunouchi-top > #main > #contents > .wrap-txt {
  width: 100%;
  text-align: center;
  padding: 8rem 0;
}
#sunouchi-top > #main > #contents > .wrap-txt .txt {
  font-family: "Noto Sans CJK JP";
  /* font-family: "Roboto"; */
  font-weight: 400;
  font-size: 1.75rem;
  line-height: 4rem;
  letter-spacing: 0.3rem;
  color: #25265a !important;
}
@media (max-width: 480px) and (orientation: portrait) {
  #sunouchi-top > #main > #contents > .sunouchi > img {
    height: 120vw;
    object-fit: cover;
  }
  #sunouchi-top > #main > #contents > .wrap-ttl {
    top: 1.6rem;
    left: 1.6rem;
  }
  #sunouchi-top > #main > #contents > .wrap-ttl .ttl,
  #sunouchi-top > #main > #contents > .wrap-ttl .ttl-sub {
    font-size: 1.5rem;
    line-height: 1.4;
  }
  #sunouchi-top > #main > #contents > .wrap-statement {
    position: absolute;
    top: 8.6%;
    left: 1.6rem;
  }
  #sunouchi-top > #main > #contents > .wrap-statement .statement {
    font-size: 4.22rem;
    line-height: 1.33;
  }
  #sunouchi-top > #main > #contents > .wrap-txt {
    text-align: left;
    padding: 8rem 10%;
  }
  #sunouchi-top > #main > #contents > .wrap-txt .txt {
    font-size: 1.55rem;
    line-height: 2.2;
    color: #25265a;
    letter-spacing: 0.04rem;
  }
  #sunouchi-top .inner-results {
    color: #25265a;
    line-height: 2;
  }
  #sunouchi-top .inner-results:nth-child(1) {
    font-weight: 400;
    color: #25265a !important;
  }
  #sunouchi-top .inner-results:nth-child(2) {
    font-weight: 400;
    color: #25265a !important;
  }
  #sunouchi-top hr {
    width: 85% !important;
    margin: 4rem auto !important;
    size: 1rem !important;
    color: #fff !important;
  }
  #sunouchi-top > #main > #contents > .wrap-profile > .wrap-list {
    padding: 0rem 0 8rem !important;
  }
  #sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl > dt {
    padding-top: 0 !important;
    line-height: 0.5;
  }
  #sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl > dd {
    padding-top: 0 !important;
  }
  #sunouchi-top > #main > #contents > .wrap-profile {
    background-image: url(/assets/images/sonoda/ph_bg-sp.jpg) !important;
    background-size: cover;
  }
  #sunouchi-top .inner-results p:nth-child(1) {
    line-height: 2.1 !important;
    font-weight: 500 !important;
  }
  #sunouchi-top .inner-results p:nth-child(2) {
    line-height: 2.1 !important;
    font-weight: 300 !important;
  }
  #sunouchi-top > #main > #contents > .wrap-txt .txt {
    font-weight: 500;
  }
}
/*============================================================
  profile
============================================================*/
#sunouchi-top > #main > #contents > .wrap-profile {
  background-image: url(/assets/images/sonoda/ph_bg.jpg);
  background-size: cover;
}
#sunouchi-top > #main > #contents > .wrap-profile > .inner-profile {
  display: flex;
  justify-content: space-between;
  width: 73%;
  margin: auto;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-txt {
  padding-top: 12rem;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-txt
  .ttl-profile {
  font-family: "Poppins";
  font-weight: 100;
  font-size: 7.85rem;
  color: #fff;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-txt
  .txt-profile {
  font-family: "Noto Sans CJK JP";
  font-weight: 500;
  font-size: 1.6rem;
  letter-spacing: 0.08rem;
  line-height: 2;
  color: #fff;
  margin: 6rem 0 0 0;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-portrait {
  margin-top: 10rem;
  position: relative;
}
#sunouchi-top > .wrap-portrait-syunsuke {
  width: 30%;
}
#sunouchi-top > .wrap-portrait-syunsuke img {
  width: 100%;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-portrait
  img {
  width: 30rem;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-portrait
  .link-twitter {
  position: absolute;
  top: 34.5rem;
  right: -2.7rem;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-portrait
  .link-twitter
  img {
  width: 8rem;
  height: 8rem;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-portrait
  .link-twitter
  img:nth-of-type(1) {
  display: none;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-portrait
  .link-twitter:hover
  img:nth-of-type(1) {
  display: block;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-profile
  > .inner-profile
  > .wrap-portrait
  .link-twitter:hover
  img:nth-of-type(2) {
  display: none;
}
@media (max-width: 700px) {
  #sunouchi-top > #main > #contents > .wrap-profile > .inner-profile {
    justify-content: center;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-txt
    .ttl-profile {
    font-size: 6.85rem;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-txt
    .txt-profile {
    font-size: 1.3rem;
    line-height: 4rem;
    letter-spacing: 0.08rem;
    margin: 2rem 0 0 0;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-portrait
    img {
    width: 20vw;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-portrait
    .link-twitter {
    top: 22.98vw;
    right: 0;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-portrait
    .link-twitter
    img {
    width: 5.33vw;
    height: 5.33vw;
  }
}
#sunouchi-top > #main > #contents > .wrap-profile > .wrap-list {
  display: flex;
  justify-content: center;
  padding: 2rem 0 8rem;
}
#sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl {
  font-family: "Noto Sans CJK JP";
  /* font-family: "Roboto"; */
  font-weight: 400;
  font-size: 1.75rem;
  line-height: 1.4rem;

  display: grid;
  grid-template-columns: 10rem 14rem 10rem 14rem 10rem 14rem;
  grid-auto-rows: 2.8rem;
  column-gap: 2rem;
  row-gap: 2rem;
}
#sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl > dt {
  padding-top: 0.78rem;
  font-weight: 300;
  display: block;
  background-color: #fff;
  border-radius: 100vh;
  text-align: center;
}
#sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl > dd {
  padding-top: 0.65rem;
  color: #fff;
  font-weight: 400;
  text-wrap: nowrap;
}
@media (max-width: 700px) {
  #sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl {
    display: grid;
    grid-template-columns: 12vw 14vw 12vw 14vw 12vw 8vw;
    grid-auto-rows: 2.8vw;
    column-gap: 2vw;
    row-gap: 2vw;
  }
  #sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl > dt,
  #sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl > dd {
    padding-top: 1vw;
    line-height: 1.286;
    text-wrap: wrap;
  }
}
@media (max-width: 480px) and (orientation: portrait) {
  #sunouchi-top > #main > #contents > .wrap-profile > .inner-profile {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    width: 100%;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-txt {
    padding: 6.66rem 10% 0rem;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-txt
    .ttl-profile {
    text-align: center;
    font-size: 5.55rem;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-txt
    .txt-profile {
    font-size: 1.44rem;
    line-height: 2.1;
    margin: 28.5rem 0 0 0;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-portrait {
    position: absolute;
    top: 15.55rem;
    left: 50%;
    margin: 0 0;
    transform: translateX(-50%);
    width: 37%;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-portrait
    img {
    width: 100% !important;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-portrait
    img {
    width: 40vw;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-portrait
    .link-twitter {
    top: 37vw;
    right: -8vw;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .inner-profile
    > .wrap-portrait
    .link-twitter
    img {
    width: 17vw !important;
    height: 17vw;
  }
  #sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl {
    display: grid;
    grid-template-columns: 8rem 8rem 8rem;
    grid-auto-rows: 2rem 10rem;
    gap: 1.2rem 3.5rem;
  }
  #sunouchi-top > #main > #contents > .wrap-profile > .wrap-list > dl > dt,
  dd {
    text-align: center;
    font-size: 1.44rem;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dt:nth-of-type(1),
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dt:nth-of-type(2),
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dt:nth-of-type(3) {
    grid-row-start: 1;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dt:nth-of-type(4),
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dt:nth-of-type(5),
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dt:nth-of-type(6) {
    grid-row-start: 3;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dd:nth-of-type(1),
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dd:nth-of-type(2),
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dd:nth-of-type(3) {
    grid-row-start: 2;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dd:nth-of-type(4),
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dd:nth-of-type(5),
  #sunouchi-top
    > #main
    > #contents
    > .wrap-profile
    > .wrap-list
    > dl
    > dd:nth-of-type(6) {
    grid-row-start: 4;
  }
}
/*============================================================
  results
============================================================*/
#sunouchi-top > #main > #contents > .wrap-results > .ttl-results {
  font-family: "Poppins";
  font-weight: 100;
  font-size: 7.85rem;
  padding: 10rem 0 5rem;
  width: 75%;
  margin: auto;
  color: #25265a !important;
}
#sunouchi-top > #main > #contents > .wrap-results > .dsc-results {
  display: flex;
  flex-wrap: wrap;
  width: 75%;
  font-family: "Noto Sans CJK JP";
  /* font-family: "Roboto"; */
  font-weight: 400;
  font-size: 1.75rem;
  line-height: 4rem;
  margin-left: 12.5%;
  color: #25265a !important;
}
@media (max-width: 700px) {
  #sunouchi-top > #main > #contents > .wrap-results > .dsc-results {
    width: 90%;
    margin-left: 5%;
  }
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-results
  > .dsc-results
  > .inner-results {
  display: block;
  width: 50%;
  margin-bottom: 4rem;
}
#sunouchi-top
  > #main
  > #contents
  > .wrap-results
  > .dsc-results
  > .inner-results
  > .year {
  font-weight: 500;
  color: #25265a !important;
}
#sunouchi-top .inner-results p:nth-child(1) {
  line-height: 1.94;
  font-weight: 400;
  color: #25265a !important;
}
#sunouchi-top .inner-results p:nth-child(2) {
  line-height: 1.94;
  font-weight: 400;
  color: #25265a !important;
}
#sunouchi-top > #main > #contents > .wrap-results > .dsc-results > .etc {
  width: 100%;
  text-align: right;
}
#sunouchi-top > #main > #contents > .wrap-results > .dsc-results > .etc p {
  color: #25265a !important;
}
#sunouchi-top > #main > #contents > .wrap-results > .btn-block {
  text-align: center;
  margin: 6.5rem 0;
}
@media (max-width: 480px) and (orientation: portrait) {
  #sunouchi-top > #main > #contents > .wrap-results > .ttl-results {
    font-size: 5.55rem;
    padding: 6.2rem 0 5rem;
    text-align: center;
  }
  #sunouchi-top > #main > #contents > .wrap-results > .dsc-results {
    display: flex;
    flex-direction: column;
    width: 80%;
    justify-content: center;
    font-weight: 400;
    font-size: 1.75rem;
    line-height: 4rem;
    margin-left: 10%;
    letter-spacing: 0.08rem;
  }
  #sunouchi-top
    > #main
    > #contents
    > .wrap-results
    > .dsc-results
    > .inner-results {
    display: block;
    width: 100%;
    margin-bottom: 4rem;
  }
  #sunouchi-top > #main > #contents > .wrap-results > .dsc-results > .etc {
    width: 100%;
    font-weight: 100;
  }
  #sunouchi-top > #main > #contents > .wrap-results > .btn-block {
    margin: 4.1rem 0;
  }
  body .btn.prev {
    width: 80% !important;
  }
}
/*============================================================
  return btn customize
============================================================*/
.btn::after {
  display: block;
  width: 1em;
  height: 1em;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  margin: auto 0;
  position: absolute;
  left: 0.5em;
  top: 0;
  bottom: 0;
}
/*============================================================
  footer block bar none
============================================================*/
#sunouchi-top > #footer-global > .block-bar {
  display: none;
}

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