html, body {
  width: 100%;
  color: #000; }

.collection {
  width: 100%;
  font-size: 0.9vw; }
  .collection .st_credit {
    position: relative;
    color: #ffe3f1;
    font-size: 0.9vw;
    line-height: 2;
    margin-bottom: 30%;
    width: 40%;
    margin: 0 auto; }
    .collection .st_credit p {
      position: absolute;
      left: 10%;
      bottom: 18%; }
  .collection .credit a {
    color: #e4bfd4; }
  .collection img {
    width: 100%;
    vertical-align: bottom; }
  .collection .sticky {
    position: sticky;
    top: 0;
    overflow: hidden; }
  .collection .content .style .detail a {
    font-size: 3.0vw;
    letter-spacing: 1px; }
  .collection .header {
    position: relative;
    width: 50%;
    float: left; }
    .collection .header h2 {
      width: 40%;
      position: absolute;
      left: 30%;
      top: 45%;
      z-index: 2; }
    .collection .header .pht {
      width: 100%;
      display: block;
      filter: grayscale(100%);
      transition: filter 1.5s cubic-bezier(0.4, 0, 0.2, 1); }
  .collection .header.is-active .pht {
    filter: grayscale(0%); }
  .collection .st0 {
    fill: #000;
    stroke-width: 4;
    transition: fill 0.6s ease; }
  .collection .ttlArea.is-active .st0 {
    fill: #ffe3f1; }
  .collection .trigger {
    height: 1px; }
  .collection .styleWrap {
    width: 30%;
    margin: 0 auto; }
    .collection .styleWrap .sticky {
      z-index: -1; }

.head {
  width: 70%;
  margin: 0 auto; }

.ttlArea {
  display: none; }

.ttlAreapc {
  width: 50%;
  float: right;
  position: relative; }
  .ttlAreapc .ttl {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%; }
    .ttlAreapc .ttl .st0 {
      fill: #ffe3f1; }

#footer {
  margin-top: 0;
  background: #fff; }

.pc {
  display: none; }

.section {
  background: #fff;
  z-index: 2;
  width: 100%;
  overflow: hidden; }

#sec1 {
  padding-bottom: 20%; }
  #sec1 div:nth-child(1) {
    width: 70%;
    padding: 25% 15%; }
  #sec1 div:nth-child(2) {
    width: 100%; }
  #sec1 div:nth-child(3) {
    padding: 3% 0%; }
  #sec1 div:nth-child(4) {
    width: 60%;
    padding: 25% 0%;
    margin-left: 30%; }

#sec2 {
  padding-bottom: 20%; }
  #sec2 div:nth-child(1) {
    width: 70%;
    padding: 25% 15% 0 15%;
    margin-bottom: 2%; }
  #sec2 div:nth-child(2) {
    width: 70%;
    padding: 0% 15%; }
  #sec2 div:nth-child(3) {
    padding: 3% 0%; }
  #sec2 div:nth-child(4) {
    width: 60%;
    padding: 25% 0%;
    margin-left: 30%; }

#sec3 {
  padding-bottom: 20%; }
  #sec3 div:nth-child(1) {
    width: 100%;
    margin-bottom: 15%; }
  #sec3 div:nth-child(2) {
    width: 70%;
    margin-left: 7%; }
  #sec3 div:nth-child(3) {
    width: 70%;
    margin-top: -10%;
    margin-left: 23%; }
  #sec3 div:nth-child(4) {
    padding: 3% 0%; }

#sec4 {
  padding-bottom: 20%; }
  #sec4 div:nth-child(1) {
    width: 50%;
    margin-left: 7%; }
  #sec4 div:nth-child(2) {
    padding: 3% 7%;
    margin-bottom: 20%; }

#sec5 {
  padding-bottom: 20%;
  background: #fff; }
  #sec5 div:nth-child(1) {
    width: 60%;
    padding: 20% 20% 0 20%; }
  #sec5 div:nth-child(2) {
    padding: 3% 0% 0 20%;
    margin-bottom: 20%; }

#sec5-2 {
  padding-bottom: 20%;
  background: #fff; }

#sec6 {
  padding-bottom: 20%; }
  #sec6 div:nth-child(2) {
    width: 70%;
    margin-top: -10%;
    margin-left: 10%; }
  #sec6 div:nth-child(3) {
    width: 40%;
    margin-top: -10%;
    margin-left: 60%; }
  #sec6 div:nth-child(4) {
    width: 70%;
    margin-top: -10%;
    margin-left: 0%; }

#sec7 {
  padding-bottom: 20%; }
  #sec7 div:nth-child(1) {
    width: 60%;
    padding: 25% 20%; }
  #sec7 div:nth-child(2) {
    width: 100%; }
  #sec7 div:nth-child(3) {
    padding: 3% 0%; }

#sec8 {
  padding-bottom: 20%;
  background: #fff; }
  #sec8 div:nth-child(1) {
    width: 50%;
    padding: 0  0 25% 0%;
    margin-left: 40%; }

#sec9 {
  padding-bottom: 20%; }
  #sec9 div:nth-child(1) {
    width: 90%;
    padding: 0 5%;
    margin-bottom: 10%; }
  #sec9 div:nth-child(2) {
    width: 50%;
    margin-top: 0%;
    margin-left: 20%; }
  #sec9 div:nth-child(3) {
    width: 40%;
    margin-top: -10%;
    margin-left: 50%; }
  #sec9 div:nth-child(4) {
    width: 70%;
    margin-top: -10%;
    margin-left: 0%; }

#sec10 {
  padding-bottom: 20%;
  background: #fff; }
  #sec10 div:nth-child(2) {
    padding: 3% 0%; }
  #sec10 div:nth-child(3) {
    width: 70%;
    padding: 25% 15% 0 15%; }