@charset "UTF-8";

/* ====================================================

  Assorti About PC Style

==================================================== */

/* ------------------------------------------

  Page Header

------------------------------------------ */
.page-header .inner { padding: 130px 0 0; }
.page-heading {
  width: 821px;
  bottom: initial;
}
.page-catch {
  right: 0;
  width: 520px;
  opacity: 0.6;
}

@media screen and (max-width:1024px) {
  .page-header .inner { padding: calc(130 / 1500 * 100vw) 0 0; }
  .page-heading { width: calc(821 / 1500 * 100vw); }
  .page-catch { width: calc(520 / 1500 * 100vw); }
}

/* ------------------------------------------

  Section

------------------------------------------ */

/* Intro
------------------------------------------ */
.intro {
  height: 855px;
  padding: 0 0 0 calc((100% - 1200px) / 2);
  margin: 115px 0 300px;
}
.intro figure {
  position: absolute;
  top: 0;
  right: 0;
}
.intro-summary {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.intro-summary h3 {
  font-size: 60px;
  font-size: 6.0rem;
  font-weight: 400;
  letter-spacing: 0.075em;
  margin: 0 0 80px;
}
.intro-summary p {
  font-size: 18px;
  font-size: 1.8rem;
  letter-spacing: 0.075em;
  line-height: calc(40 / 18);
}

@media screen and (max-width:1024px) {
  .intro {
    padding: 0 0 0 3.125%;
    margin: calc(115 / 1500 * 100%) 0 calc(300 / 1500 * 100%);
  }
  .intro-summary {
    top: 15%;
    transform: translateY(-15%);
  }
  .intro-summary h3 {
    font-size: calc(60 / 1500 * 100vw);
    margin: 0 0 calc(80 / 1500 * 100%);
  }
}

/* Interval
------------------------------------------ */
.interval {
  height: 0;
  padding: 0 0 calc(600 / 1500 * 100%);
  background-image: url(../images/about_img02.jpg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-attachment: fixed;
  background-size: cover;
  margin: 0 0 30px;
}