@charset "UTF-8";

@media (max-width: 1400px) and (min-width: 768px) {
  html {
    font-size: 0.7142857143vw !important;
  }
}

#CE240712summer {
  --zindex-behind: -1;
  --zindex-middle: 0;
  --zindex-front: 1;
  --pointer-none: none;
  --color-credit: #8E8E8E;
  --color-white: #fff;
  --color-yellow: rgb(206, 193, 119, 30%);
  --color-violet: rgb(135, 144, 215, 30%);
}

/*================================
  breadlist
=================================*/
#breadcrumb .cateList {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  text-align: initial;
}

.archiveArea {
  margin-top: calc(130 *(100vw / 750)) !important;
}
#breadcrumb .cateList a {
  width: auto;
}

@media screen and (min-width: 768px) {
  #breadcrumb {
    max-width: 120rem;
    width: 100%;
    margin: 0 auto;
  }
  #breadcrumb .cateList {
    text-overflow: clip;
    white-space: normal;
    overflow: visible;
  }
  .archiveArea {
    margin-top: 115px !important;
  }
}

/*================================
  variables
=================================*/
#CE240712summer img,
#CE240712summer picture,
#CE240712summer a {
  display: inline-block;
  width: 100%;
  height: auto;
}
#CE240712summer a:hover {
  transition: .5s;
  opacity: .6s;
}
#CE240712summer span {
  display: inline-block;
}
#CE240712summer .flexArea {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin: 0 auto;
}
#CE240712summer .gridWrap {
  display: grid;
  margin: 0 auto;
  width: 100%;
}

/*--------------------------------
  variables for mobile
--------------------------------*/
@media screen and (max-width: 767px) {
  #CE240712summer .flexArea-sp {
    display: flex;
    width: 100%;
    margin: 0 auto;
  }

  #CE240712summer .pc_only {
    display: none !important;
  }
}

/*--------------------------------
  variables for desktop
--------------------------------*/
@media only screen and (min-width: 768px) {
  #CE240712summer .flexArea-pc {
    display: flex;
    width: 100%;
    margin: 0 auto;
  }
  #CE240712summer .gridWrap-pc {
    display: grid;
    margin: 0 auto;
    width: 100%;
  }
}
/* end variables */

/*================================
  font
=================================*/
#CE240712summer .font-ja-serif-R{
  font-family: "shippori-mincho", sans-serif;
  font-weight: 400;
  font-style: normal;
  /* font-feature-settings: "palt" */
}
#CE240712summer .font-ja-serif-M{
  font-family: "shippori-mincho", sans-serif;
  font-weight: 500;
  font-style: normal;
  /* font-feature-settings: "palt" */
}
#CE240712summer .font-ja-serif-SB{
  font-family: "shippori-mincho", sans-serif;
  font-weight: 600;
  font-style: normal;
  /* font-feature-settings: "palt" */
}
#CE240712summer .font-en-serif{
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  /* font-feature-settings: "palt" */
}
#CE240712summer .font-en-sans{
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-feature-settings: "palt"
}
#CE240712summer .font-ja-sub02{
  font-family: "Bodoni Moda", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: italic;
}

/*================================
  font
=================================*/
#CE240712summer .firstviewArea__ttl{
  font-size: calc(35 *(100vw / 750));
  line-height: 1.4285714286;
  letter-spacing: 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: calc(12 *(100vw / 750));
  margin-bottom: calc(32*(100vw / 750));
}
#CE240712summer .firstviewArea__numb{
  width: calc(75 *(100vw / 750));
}
#CE240712summer .firstviewArea__lead{
  font-size: calc(24 *(100vw / 750));
  line-height: 2.08333333333;
  letter-spacing: 0.03em;
  text-align: center;
}
#CE240712summer .creditWrap__cont{
  font-size: calc(18 *(100vw / 750));
  line-height: 2;
  letter-spacing: 0;
  color: var(--color-credit);
}
#CE240712summer .creditWrap__cont a{
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: calc(2 *(100vw /750));
}
#CE240712summer [data-lead-bold]{
  font-size: calc(24 *(100vw / 750));
  line-height: 2;
  letter-spacing: 0;
}
#CE240712summer [data-lead-bold="08"]{
  line-height: 1.6666666667;
}
#CE240712summer [data-lead]{
  font-size: calc(24 *(100vw / 750));
  line-height: 2.08333333333;
  letter-spacing: 0.03em;
  text-align: left;
}
#CE240712summer .lastArea__ttl-txt{
  font-size: calc(25 *(100vw /750));
  line-height: 1.5;
  letter-spacing: 0;
  color:#fff;
  text-align: center;
}
#CE240712summer .lastArea__txt{
  font-size: calc(18*(100vw /750));
  line-height: 2;
  letter-spacing: 0.03em;
  color: #fff;
  text-align: center;
  margin: 0 auto calc(36*(100vw / 750));
}
#CE240712summer .lastArea__edit{
  font-size: calc(14*(100vw / 750));
  line-height: 2;
  letter-spacing: 0;
  color: #fff;
  text-align: center;
  padding-top: calc(36*(100vw /750));
  position: relative;
}
#CE240712summer .lastArea__edit a{
  display: inline;
}
#CE240712summer .lastArea__edit::before{
  content: "";
  display: block;
  background-color: var(--color-white);
  width: calc(400*(100vw / 750));
  height: 1px;
  position: absolute;
  top: 0;
  left: 23%;
}
#CE240712summer .lastArea__staff{
  font-size: calc(16*(100vw /750));
  line-height: 2.1875;
  letter-spacing: 0;
  color:#000002;
  text-align: center;
  margin: 0 auto;
}

/*--------------------------------
  font for desktop
--------------------------------*/
@media only screen and (min-width: 768px) {
  #CE240712summer .firstviewArea__ttl{
    font-size: 4rem;
    line-height: 1.5;
    flex-direction: row;
    column-gap: 0;
    column-gap: 2rem;
    padding-right: 1rem;
    margin-bottom: 3.5rem;
  }
  #CE240712summer .firstviewArea__numb{
    width: 7.5rem;
    height: 4.5rem;
  }
  #CE240712summer .firstviewArea__lead{
    font-size: 2.6rem;
    line-height: 1.9230769231;
  }
  #CE240712summer .creditWrap__cont{
    font-size: 1.8rem;
  }
  #CE240712summer .creditWrap__cont a{
    text-underline-offset: 0.1rem;
  }
  #CE240712summer [data-lead-bold]{
    font-size: 2.4rem;
  }
  #CE240712summer [data-lead]{
    font-size: 1.8rem;
    line-height: 2;
    letter-spacing: 0.025em;
  }
  #CE240712summer .lastArea__ttl-txt{
    font-size: 2.5rem;
    margin-left: 5rem;
  }
  #CE240712summer .lastArea__txt{
    font-size: 1.8rem;
    line-height: 2;
    text-align: left;
    width: 61rem;
    margin: 0 auto 2.4rem 5rem;
  }
  #CE240712summer .lastArea__edit{
    font-size: 1.4rem;
    text-align: left;
    width: 51rem;
    padding-top: 2.5rem;
    margin: 0 auto 0 5rem;
  }
  #CE240712summer .lastArea__edit::before{
    width: 40rem;
    left: 0;
  }
  #CE240712summer .lastArea__staff{
    font-size: 1.8rem;
    line-height: 2;
  }
}
/* end font */

/*================================
  page-common
=================================*/
#CE240712summer .creditWrap__cont a{
  display: inline-block;
  width: auto;
}
#CE240712summer [data-side-txt]{
  width: calc(78*(100vw / 750));
  position: relative;
}
#CE240712summer [data-side-txt] [data-delay="02"]{
  display: block;
  width: calc(26.5*(100vw / 750));
  position: absolute;
  top: -13.2%;
  left: 31.6%;
}
#CE240712summer [data-topic]{
  position: relative;
  z-index: var(--zindex-front);
  pointer-events: var(--pointer-none);
}
#CE240712summer [data-topic-line]{
  position: absolute;
  bottom: 0;
  display: grid;
  width: calc(350*(100vw / 750));
}
#CE240712summer [data-topic-line] [data-delay]{
  grid-column: 1;
  grid-row: 1;
}
#CE240712summer [data-topic-line] [data-delay="02"]{
  display: block;
}
#CE240712summer .leadWrap{
  width: calc(600*(100vw / 750));
  margin: 0 auto;
  position: relative;
}
#CE240712summer [data-lead-bg]{
  position: absolute;
  content: "";
  display: block;
  background-color: var(--color-yellow);
  z-index: var(--zindex-behind);
  pointer-events: var(--pointer-none);
}
#CE240712summer [data-lead-bg="06"],
#CE240712summer [data-lead-bg="07"]{
  background-color: var(--color-violet);
}

#CE240712summer .anchor {
  width: 8.552vw;
  position: sticky;
  display: inline-block;
  bottom: 14.1333333333vw;
  left: 87.3146666667vw;
}

/*--------------------------------
  page-common for desktop
--------------------------------*/
@media only screen and (min-width: 768px) {
  #CE240712summer [data-side-txt]{
    width: 11.1rem;
  }
  #CE240712summer [data-side-txt] [data-delay="02"]{
    width: 3.8rem;
    top: -20%;
    left: 32%;
  }
  #CE240712summer [data-side-txt]::after{
    width: 3.8rem;
    top: -50%;
    left: 50%;
  }
  #CE240712summer .leadWrap{
    width: 80rem;
    margin: 0 auto;
  }
  #CE240712summer [data-topic-line="03"] [data-delay="01"]{
    width: 100%;
  }
  #CE240712summer [data-topic-line="01"] [data-delay="02"],
  #CE240712summer [data-topic-line="04"] [data-delay="02"],
  #CE240712summer [data-topic-line="07"] [data-delay="02"]{
    background: none;
  }

  #CE240712summer .anchor {
    width: 6.414rem;
    bottom: 10.6rem;
    left: calc(50% + 55.6rem);
  }
}
/* end page-common */


/*================================
  layout
=================================*/
#CE240712summer .firstviewArea{
  margin: 0 auto calc(90*(100vw / 750));
  position: relative;
}
#CE240712summer .firstviewArea__img{
  margin: 0 auto calc(77*(100vw / 750));
  overflow: hidden;
}
#CE240712summer .firstviewArea__img-txt{
  width: calc(496*(100vw / 750));
  height: calc(353*(100vw / 750));
  display: grid;
  grid-template-columns: calc(123*(100vw / 750)) calc(150*(100vw / 750)) auto;
  grid-template-rows: calc(85*(100vw / 750)) calc(84*(100vw / 750)) auto;
  position: absolute;
  top: 36.4%;
  left: 13.6%;
  z-index: var(--zindex-front);
  pointer-events: var(--pointer-none);
}
#CE240712summer .firstviewArea__img-txt00{
  width: 100%;
  height: 100%;
  grid-column: 1 / 4;
  grid-row: 2 / 4;
}
#CE240712summer .firstviewArea__img-txt01{
  width: calc(298*(100vw / 750));
  height: calc(79*(100vw / 750));
  grid-column: 2 / 4;
  grid-row: 1 / 2;
}
#CE240712summer .firstviewArea__img-txt02{
  width: calc(53.6*(100vw / 750));
  height: calc(33*(100vw / 750));
  grid-column: 3 / 4;
  grid-row: 3 / 4;
}
#CE240712summer .block01{
  margin: 0 auto calc(142*(100vw / 750));
}
#CE240712summer [data-grid="01"]{
  display: grid;
  grid-template-columns: calc(105*(100vw / 750)) calc(45*(100vw / 750)) calc(280*(100vw / 750)) calc(20*(100vw / 750)) calc(195*(100vw / 750));
  grid-template-rows: calc(274*(100vw / 750)) calc(492*(100vw / 750)) calc(20*(100vw / 750)) calc(37*(100vw / 750)) calc(91*(100vw / 750)) calc(56*(100vw / 750)) calc(246*(100vw / 750)) calc(6*(100vw / 750));
  margin-bottom: calc(55*(100vw / 750));
}
#CE240712summer [data-side-txt="01"]{
  grid-column: 1/2;
  grid-row: 2/3;
}
#CE240712summer [data-topic="01"]{
  grid-column: 1/5;
  grid-row: 5/6;
  margin: 0 calc(65*(100vw / 750)) 0 auto;
}
#CE240712summer [data-topic-ttl="01"]{
  width: calc(294*(100vw / 750));
}
#CE240712summer [data-topic-line="01"]{
  width: calc(350*(100vw / 750));
}
#CE240712summer [data-img="01"]{
  grid-column: 2/6;
  grid-row: 1/3;
}
#CE240712summer [data-img="02"]{
  grid-column: 5/7;
  grid-row: 4/8;
}
#CE240712summer [data-img="03"]{
  grid-column: 3/4;
  grid-row: 7/10;
}
#CE240712summer [data-credit="01"]{
  grid-column: 5/7;
  grid-row: 9/10;
}
#CE240712summer [data-lead-bold="01"]{
  margin-bottom: calc(16*(100vw / 750));
}
#CE240712summer [data-lead-bg="01"]{
  width: calc(120*(100vw / 750));
  height: calc(200*(100vw / 750));
  top: -4%;
  left: -12.5%;
}
#CE240712summer .block02{
  margin: 0 auto calc(156*(100vw / 750));
}
#CE240712summer [data-grid="02"]{
  display: grid;
  grid-template-columns: calc(105*(100vw / 750)) calc(225*(100vw / 750)) calc(17*(100vw / 750)) calc(298*(100vw / 750)) calc(32*(100vw / 750));
  grid-template-rows: calc(274*(100vw / 750)) calc(490*(100vw / 750)) calc(20*(100vw / 750)) calc(35*(100vw / 750)) calc(123*(100vw / 750)) calc(312*(100vw / 750)) calc(5*(100vw / 750)) calc(150*(100vw / 750));
  margin-bottom: calc(30*(100vw / 750));
}
#CE240712summer [data-side-txt="02"]{
  grid-column: 5/7;
  grid-row: 2/3;
  margin-left: auto;
}
#CE240712summer [data-topic="02"]{
  grid-column: 3/7;
  grid-row: 5/6;
}
#CE240712summer [data-topic-ttl="02"]{
  width: calc(314*(100vw / 750));
  margin-left: calc(45*(100vw / 750));
}
#CE240712summer [data-topic-line="02"]{
  width: calc(359.55*(100vw / 750));
  top: 30%;
}
#CE240712summer [data-img="04"]{
  grid-column: 2/5;
  grid-row: 1/3;
}
#CE240712summer [data-img="05"]{
  grid-column: 1/3;
  grid-row: 4/7;
}
#CE240712summer [data-img="06"]{
  grid-column: 4/6;
  grid-row: 6/9;
}
#CE240712summer [data-credit="02"]{
  grid-column: 1/3;
  grid-row: 8/10;
  margin-left: calc(60*(100vw / 750));
}
#CE240712summer [data-lead-bold="02"]{
  margin-bottom: calc(36*(100vw / 750));
}
#CE240712summer [data-lead-bg="02"]{
  width: calc(120*(100vw / 750));
  height: calc(200*(100vw / 750));
  top: 1%;
  left: -12.5%;
}
#CE240712summer .block03{
  margin: 0 auto calc(140*(100vw / 750));
}
#CE240712summer [data-grid="03"]{
  display: grid;
  grid-template-columns: calc(54*(100vw / 750)) calc(96*(100vw / 750)) calc(334*(100vw / 750)) calc(118*(100vw / 750)) calc(89*(100vw / 750));
  grid-template-rows: calc(225*(100vw / 750)) calc(90*(100vw / 750)) calc(20*(100vw / 750)) calc(130*(100vw / 750)) calc(184*(100vw / 750)) calc(20*(100vw / 750)) calc(181*(100vw / 750)) calc(68*(100vw / 750)) calc(381*(100vw / 750));
  margin-bottom: calc(56*(100vw / 750));
}
#CE240712summer [data-side-txt="03"]{
  grid-column: 1/3;
  grid-row: 2/6;
}
#CE240712summer [data-side-txt="03"] [data-delay="02"]{
  top: -15%;
}
#CE240712summer [data-topic="03"]{
  grid-column: 2/4;
  grid-row: 8/9;
}
#CE240712summer [data-topic-ttl="03"]{
  width: calc(270*(100vw / 750));
}
#CE240712summer [data-topic-line="03"]{
  width: calc(285*(100vw / 750));
  top: 57%;
  left: 1%;
}
#CE240712summer [data-img="07"]{
  grid-column: 3/5;
  grid-row: 1/3;
}
#CE240712summer [data-img="08"]{
  grid-column: 3/5;
  grid-row: 4/6;
}
#CE240712summer [data-img="09"]{
  grid-column: 3/5;
  grid-row: 7/10;
}
#CE240712summer [data-credit="03"]{
  grid-column: 4/6;
  grid-row: 5/6;
  text-align: right;
  z-index: var(--zindex-front);
}
#CE240712summer [data-lead-bold="03"]{
  margin-bottom: calc(16*(100vw / 750));
}
#CE240712summer [data-lead-bg="03"]{
  width: calc(120*(100vw / 750));
  height: calc(200*(100vw / 750));
  top: -3.8%;
  left: -12.5%;
}
#CE240712summer .block04{
  margin: 0 auto calc(142*(100vw / 750));
}
#CE240712summer [data-grid="04"]{
  display: grid;
  grid-template-columns: calc(72*(100vw / 750)) calc(30*(100vw / 750)) calc(298*(100vw / 750)) calc(20*(100vw / 750)) calc(222*(100vw / 750));
  grid-template-rows: calc(274*(100vw / 750)) calc(490*(100vw / 750)) calc(20*(100vw / 750)) calc(60*(100vw / 750)) calc(106*(100vw / 750)) calc(303*(100vw / 750)) calc(166*(100vw / 750));
  margin-bottom: calc(58*(100vw / 750));
}
#CE240712summer [data-side-txt="04"]{
  grid-column: 6/7;
  grid-row: 2/3;
  margin-left: auto;
}
#CE240712summer [data-topic="04"]{
  grid-column: 3 / 5;
  grid-row: 5 / 6;
  margin-left: calc(89*(100vw / 750));
}
#CE240712summer [data-topic-ttl="04"]{
  width: calc(273*(100vw / 750));
}
#CE240712summer [data-topic-line="04"]{
  width: calc(305.6*(100vw / 750));
  top: 34%;
  left: -15%;
}
#CE240712summer [data-img="10"]{
  grid-column: 3/6;
  grid-row: 1/3;
}
#CE240712summer [data-img="11"]{
  grid-column: 5/7;
  grid-row: 4/8;
}
#CE240712summer [data-img="12"]{
  grid-column: 2/4;
  grid-row: 6/8;
}
#CE240712summer [data-credit="04"]{
  grid-column: 5/7;
  grid-row: 7/8;
}
#CE240712summer [data-lead-bold="04"]{
  margin-bottom: calc(16*(100vw / 750));
}
#CE240712summer [data-lead-bg="04"]{
  width: calc(120*(100vw / 750));
  height: calc(200*(100vw / 750));
  top: -4%;
  left: -12.5%;
}
#CE240712summer .block05{
  margin: 0 auto calc(142*(100vw / 750));
}
#CE240712summer [data-grid="05"]{
  display: grid;
  grid-template-columns: calc(105*(100vw / 750)) calc(225*(100vw / 750)) calc(17*(100vw / 750)) calc(298*(100vw / 750)) calc(32*(100vw / 750));
  grid-template-rows: calc(258*(100vw / 750)) calc(506*(100vw / 750)) calc(20*(100vw / 750)) calc(51*(100vw / 750)) calc(109*(100vw / 750)) calc(312*(100vw / 750)) calc(5*(100vw / 750)) calc(150*(100vw / 750));
  margin-bottom: calc(58*(100vw / 750));
}
#CE240712summer [data-side-txt="05"]{
  grid-column: 1/2;
  grid-row: 2/3;
}
#CE240712summer [data-topic="05"]{
  grid-column: 3/7;
  grid-row: 5/6;
}
#CE240712summer [data-topic-ttl="05"]{
  width: calc(248*(100vw / 750));
  margin-left: calc(38*(100vw / 750));
}
#CE240712summer [data-topic-line="05"]{
  width: calc(285*(100vw / 750));
  top: 30%;
}
#CE240712summer [data-img="13"]{
  grid-column: 2/5;
  grid-row: 1/3;
}
#CE240712summer [data-img="14"]{
  grid-column: 1/3;
  grid-row: 4/7;
}
#CE240712summer [data-img="15"]{
  grid-column: 4/6;
  grid-row: 6/9;
}
#CE240712summer [data-credit="05"]{
  grid-column: 1/3;
  grid-row: 8/10;
  margin-left: calc(60*(100vw / 750));
}
#CE240712summer [data-lead-bold="05"]{
  margin-bottom: calc(16*(100vw / 750));
}
#CE240712summer [data-lead-bg="05"]{
  width: calc(120*(100vw / 750));
  height: calc(200*(100vw / 750));
  top: -3.8%;
  left: -12.5%;
}
#CE240712summer .block-movie{
  margin: 0 auto calc(150*(100vw / 750));
}
#CE240712summer .block06{
  margin: 0 auto calc(142*(100vw / 750));
}
#CE240712summer [data-grid="06"]{
  display: grid;
  grid-template-columns: calc(72*(100vw / 750)) calc(33*(100vw / 750)) calc(278*(100vw / 750)) calc(20*(100vw / 750)) calc(16*(100vw / 750)) calc(225*(100vw / 750));
  grid-template-rows: calc(112*(100vw / 750)) calc(653*(100vw / 750)) calc(20*(100vw / 750)) calc(86*(100vw / 750)) calc(90*(100vw / 750)) calc(294*(100vw / 750)) calc(6*(100vw / 750));
  margin-bottom: calc(44*(100vw / 750));
}
#CE240712summer [data-side-txt="06"]{
  grid-column: 7 / 8;
  grid-row: 2 / 3;
  margin-left: auto;
}
#CE240712summer [data-side-txt="06"] [data-delay="02"]{
  top: -6.2%;
}
#CE240712summer [data-topic="06"]{
  grid-column: 1 / 5;
  grid-row: 5 / 6;
  margin: 0 calc(60*(100vw / 750)) 0 auto;
}
#CE240712summer [data-topic-ttl="06"]{
  width: calc(249*(100vw / 750));
}
#CE240712summer [data-topic-line="06"]{
  width: calc(294.7*(100vw / 750));
}
#CE240712summer [data-img="16"]{
  grid-column: 3 / 7;
  grid-row: 1 / 3;
}
#CE240712summer [data-img="17"]{
  grid-column: 6 / 8;
  grid-row: 4 / 8;
}
#CE240712summer [data-img="18"]{
  grid-column: 2 / 5;
  grid-row: 6 / 9;
}
#CE240712summer [data-credit="06"]{
  grid-column: 6 / 7;
  grid-row: 8 / 9;
}
#CE240712summer [data-lead-bold="06"]{
  margin-bottom: calc(16*(100vw / 750));
}
#CE240712summer [data-lead-bg="06"]{
  width: calc(120*(100vw / 750));
  height: calc(200*(100vw / 750));
  top: -4%;
  left: -12.5%;
}
#CE240712summer .block07{
  margin: 0 auto calc(142*(100vw / 750));
}
#CE240712summer [data-grid="07"]{
  display: grid;
  grid-template-columns: calc(104*(100vw / 750)) calc(190*(100vw / 750)) calc(35*(100vw / 750)) calc(20*(100vw / 750)) calc(296*(100vw / 750)) calc(36*(100vw / 750));
  grid-template-rows: calc(200*(100vw / 750)) calc(564*(100vw / 750)) calc(20*(100vw / 750)) calc(70*(100vw / 750)) calc(80*(100vw / 750)) calc(317*(100vw / 750)) calc(150*(100vw / 750));
  margin-bottom: calc(88*(100vw / 750));
}
#CE240712summer [data-side-txt="07"]{
  grid-column: 1 / 2;
  grid-row: 2 / 3;
  width: calc(89.4*(100vw / 750));
}
#CE240712summer [data-side-txt="07"] [data-delay="02"]{
  top: -14.2%;
  left: 35.5%;
}
#CE240712summer [data-topic="07"]{
  grid-column: 3 / 5;
  grid-row: 5 / 6;
}
#CE240712summer [data-topic-ttl="07"]{
  width: calc(330*(100vw / 750));
}
#CE240712summer [data-topic-line="07"]{
  width: calc(363*(100vw / 750));
  top: 44%;
  left: -60%;
}
#CE240712summer [data-img="19"]{
  grid-column: 2/6;
  grid-row: 1/3;
}
#CE240712summer [data-img="20"]{
  grid-column: 1/4;
  grid-row: 4/7;
}
#CE240712summer [data-img="21"]{
  grid-column: 5/7;
  grid-row: 6/8;
}
#CE240712summer [data-credit="07"]{
  grid-column: 1 / 4;
  grid-row: 7 / 8;
  margin: calc(8*(100vw / 750)) 0 0 calc(58*(100vw / 750));
}
#CE240712summer [data-lead-bold="07"]{
  margin-bottom: calc(16*(100vw / 750));
}
#CE240712summer [data-lead-bg="07"]{
  width: calc(120*(100vw / 750));
  height: calc(200*(100vw / 750));
  top: -4%;
  left: -12.5%;
}
#CE240712summer .block08{
  width: calc(644*(100vw / 750));
  padding: 0 calc(12*(100vw / 750)) calc(70*(100vw / 750)) 0;
  margin: 0 calc(45*(100vw / 750)) calc(55*(100vw / 750)) calc(60*(100vw / 750));
  position: relative;
}
#CE240712summer .block08::before{
  content: "";
  display: block;
  background-image: url(../img/bg-border_sp.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  top: calc(73*(100vw / 750));
  left: 0;
  z-index: var(--zindex-behind);
  pointer-events: var(--pointer-none);
}
#CE240712summer .block08__ttl{
  width: calc(326.87*(100vw / 750));
  margin: 0 0  calc(62*(100vw / 750)) calc(153*(100vw / 750));
}
#CE240712summer .block08__ttl [data-delay="02"]{
  display: block;
  width: calc(209.73*(100vw / 750));
  margin: 0 0 calc(21*(100vw / 750)) calc(57*(100vw / 750));
}
#CE240712summer .block08__ttl-main{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(10*(100vw / 750));
}
#CE240712summer .block08__ttl-main span:nth-child(1){
  width: calc(145*(100vw / 750));
  height: calc(25*(100vw / 750));
}
#CE240712summer .block08__ttl-main span:nth-child(2){
  width: calc(10.7*(100vw / 750));
  height: calc(10.7*(100vw / 750));
}
#CE240712summer .block08__ttl-main span:nth-child(3){
  width: calc(149*(100vw / 750));
  height: calc(24*(100vw / 750));
}
#CE240712summer .block08__top{
  justify-content: center;
  margin-bottom: calc(28*(100vw / 750));
}
#CE240712summer [data-lead-bold="08"]{
  margin-bottom: calc(20 *(100vw / 750));
}
#CE240712summer [data-img="22"],
#CE240712summer [data-img="23"]{
  width: calc(240*(100vw / 750));
}
#CE240712summer .block08__bottom{
  display: grid;
  grid-template-columns: calc(300*(100vw / 750)) calc(20*(100vw / 750));
  grid-template-rows: calc(500*(100vw / 750)) calc(22*(100vw / 750));
  width: calc(480*(100vw / 750));
  margin: 0 auto;
}
#CE240712summer .block08__bottom-lead{
  grid-column: 1/4;
  grid-row: 1/2;
}
#CE240712summer [data-img="24"]{
  grid-column: 1/2;
  grid-row: 3/4;
}
#CE240712summer [data-credit="08"]{
  grid-column: 3/4;
  grid-row: 3/4;
  margin: auto 0 calc(-4*(100vw / 750));
}
#CE240712summer .lastArea{
  padding-bottom: calc(50*(100vw / 750));
  margin: 0 auto calc(50*(100vw / 750));
  position: relative;
  overflow: hidden;
  position: relative;
}
#CE240712summer .lastArea__img{
  width: calc(394*(100vw / 750));
  margin: 0 auto calc(-15*(100vw / 750));
}
#CE240712summer .lastArea__ttl{
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  margin-bottom: calc(42*(100vw / 750));
}
#CE240712summer .lastArea__ttl-img{
  display: block;
  width: calc(280.76*(100vw / 750));
  height: calc(121.44*(100vw / 750));
  margin-bottom: calc(12*(100vw / 750));
}
#CE240712summer .lastArea::before{
  content: "";
  display: block;
  position: absolute;
  z-index: var(--zindex-behind);
  pointer-events: var(--pointer-none);
  width: 100%;
  height: calc(1152*(100vw / 750));
  background-color: #464646;
  top: calc(184*(100vw / 750));
  left: 0;
}
@media screen and (max-width: 767px) {
  #CE240712summer .lastArea::before{
    left: -100%;
    transition: 1.5s;
  }
  #CE240712summer .lastArea.js-scrollIn::before{
    left: 0;
  }
}
#CE240712summer .youtubeWrap{
  width: calc(600*(100vw / 750));
  height: calc(337.5*(100vw / 750));
  margin: 0 auto calc(45.5*(100vw / 750));
}
#CE240712summer .youtubeWrap iframe{
  width: 100%;
  height: 100%;
}

/*--------------------------------
  layout for desktop
--------------------------------*/
@media only screen and (min-width: 768px) {
  #CE240712summer .firstviewArea{
    width: 110rem;
    margin-bottom: 15rem;
  }
  #CE240712summer .firstviewArea__img{
    margin-bottom: 12.7rem;
  }
  #CE240712summer .firstviewArea__img-txt{
    width: 45.1rem;
    height: 32rem;
    grid-template-columns: 8.8rem 16rem auto;
    grid-template-rows: 7.7rem 7.6rem auto;
    top: 18.4%;
    left: auto;
    right: 4%;
  }
  #CE240712summer .firstviewArea__img-txt01{
    width: 27.2rem;
    height: 7.2rem;
  }
  #CE240712summer .firstviewArea__img-txt02{
    width: 4.8rem;
    height: 3rem;
  }
  #CE240712summer .block01{
    width: 140rem;
    margin-bottom: 14.5rem;
  }
  #CE240712summer [data-grid="01"]{
    grid-template-columns: 20rem 10rem 15rem 31.9rem 3rem 2rem 45rem;
    grid-template-rows: 34.2rem 16.1rem 16.5rem 18.2rem 2rem 27rem 0.5rem;
    margin-bottom: 6.7rem;
  }
  #CE240712summer [data-side-txt="01"]{
    grid-column: 1/2;
    grid-row: 4/7;
    margin-left: 2rem;
  }
  #CE240712summer [data-topic="01"]{
    grid-column: 5/8;
    grid-row: 2/3;
    margin: 0;
  }
  #CE240712summer [data-topic-line="01"]{
    width: 40.6rem;
  }
  #CE240712summer [data-topic-ttl="01"]{
    width: 36.7rem;
  }
  #CE240712summer [data-img="01"]{
    grid-column: 2/6;
    grid-row: 1/5;
  }
  #CE240712summer [data-img="02"]{
    grid-column: 7/8;
    grid-row: 3/7;
  }
  #CE240712summer [data-img="03"]{
    grid-column: 4/6;
    grid-row: 6/9;
  }
  #CE240712summer [data-credit="01"]{
    grid-column: 7/8;
    grid-row: 8/9;
    text-align: right;
  }
  #CE240712summer [data-lead-bold="01"]{
    margin-bottom: 0.7rem;
  }
  #CE240712summer [data-lead-bg="01"]{
    width: 10rem;
    height: 11.2rem;
    top: -7.2%;
    left: -3%;
  }
  #CE240712summer .block02{
    width: 140rem;
    margin-bottom: 14.4rem;
  }
  #CE240712summer [data-grid="02"]{
    grid-template-columns: 15rem 50rem 2rem 58rem 15rem;
    grid-template-rows: 6.4rem 26.9rem 25.5rem 12rem 2rem 42.2rem 11.4rem;
    margin-bottom: 6rem;
  }
  #CE240712summer [data-side-txt="02"]{
    grid-column: 5/6;
    grid-row: 4/7;
    margin-left: 1.8rem;
  }
  #CE240712summer [data-side-txt="02"] [data-delay="02"]{
    top: -16.6%;
  }
  #CE240712summer [data-topic="02"]{
    grid-column: 3/5;
    grid-row: 2/3;
  }
  #CE240712summer [data-topic-ttl="02"]{
    width: 39.3rem;
    margin-left: 10.2rem;
  }
  #CE240712summer [data-topic-line="02"]{
    width: 49.6rem;
    top: 18%;
  }
  #CE240712summer [data-img="04"]{
    grid-column: 4/5;
    grid-row: 3/7;
  }
  #CE240712summer [data-img="05"]{
    grid-column: 2/3;
    grid-row: 1/5;
  }
  #CE240712summer [data-img="06"]{
    grid-column: 2/3;
    grid-row: 6/9;
  }
  #CE240712summer [data-credit="02"]{
    grid-column: 4/5;
    grid-row: 8/9;
    margin-left: 0;
  }
  #CE240712summer [data-lead-bold="02"]{
    margin-bottom: 0.8rem;
  }
  #CE240712summer [data-lead-bg="02"]{
    width: 10rem;
    height: 11.2rem;
    top: -7.2%;
    left: -3%;
  }
  #CE240712summer .block03{
    width: 140rem;
    margin-bottom: 14.4rem;
  }
  #CE240712summer [data-grid="03"]{
    display: grid;
    grid-template-columns: 10.4rem 7.6rem 12.5rem 28.4rem 46.6rem;
    grid-template-rows: 53rem 2rem 11rem 42rem 2rem 33.5rem 12.5rem 41.6rem;
    margin: 0 0 6rem 2rem;
  }
  #CE240712summer [data-side-txt="03"]{
    grid-column: 1/3;
    grid-row: 4/5;
  }
  #CE240712summer [data-side-txt="03"] [data-delay="02"]{
    top: -22.6%;
  }
  #CE240712summer [data-topic="03"]{
    grid-column: 3/5;
    grid-row: 7/8;
  }
  #CE240712summer [data-topic-ttl="03"]{
    width: 33.87rem;
    margin-left: 0.5rem;
  }
  #CE240712summer [data-topic-line="03"]{
    width: 40.7rem;
    top: 40%;
  }
  #CE240712summer [data-img="07"]{
    grid-column: 4/6;
    grid-row: 1/2;
  }
  #CE240712summer [data-img="08"]{
    grid-column: 4/6;
    grid-row: 3/5;
  }
  #CE240712summer [data-img="09"]{
    grid-column: 4/6;
    grid-row: 6/10;
  }
  #CE240712summer [data-credit="03"]{
    grid-column: 1/4;
    grid-row: 9/10;
    margin-right: 2rem;
  }
  #CE240712summer [data-lead-bold="03"]{
    margin-bottom: 0.8rem;
  }
  #CE240712summer [data-lead-bg="03"]{
    width: 10rem;
    height: 11.2rem;
    top: -7.2%;
    left: -3%;
  }
  #CE240712summer .block04{
    width: 140rem;
    margin-bottom: 14.5rem;
  }
  #CE240712summer [data-grid="04"]{
    grid-template-columns: 15rem 34rem 11rem 2rem 28rem 35rem;
    grid-template-rows: 6.9rem 10rem 7.5rem 29rem 13.5rem 2rem 45rem 5rem;
    margin-bottom: 6rem;
  }
  #CE240712summer [data-side-txt="04"]{
    grid-column: 7 / 8;
    grid-row: 5 / 8;
    margin-left: 2rem;
  }
  #CE240712summer [data-side-txt="04"] [data-delay="02"]{
    top: -15.6%;
  }
  #CE240712summer [data-topic="04"]{
    grid-column: 3 / 6;
    grid-row: 2 / 3;
    margin: 0 0 0 auto;
  }
  #CE240712summer [data-topic-ttl="04"]{
    width: 34.1rem;
  }
  #CE240712summer [data-topic-line="04"]{
    width: 39.85rem;
    top: 44%;
    left: -17%;
  }
  #CE240712summer [data-img="10"]{
    grid-column: 5 / 7;
    grid-row: 4 / 8;
  }
  #CE240712summer [data-img="11"]{
    grid-column: 2 / 4;
    grid-row: 7 / 10;
  }
  #CE240712summer [data-img="12"]{
    grid-column: 2 / 4;
    grid-row: 1 / 6;
  }
  #CE240712summer [data-credit="04"]{
    grid-column: 5 / 6;
    grid-row: 9 / 10;
  }
  #CE240712summer [data-lead-bold="04"]{
    margin-bottom: 0.7rem;
  }
  #CE240712summer [data-lead-bg="04"]{
    width: 10rem;
    height: 11.2rem;
    top: -7.2%;
    left: -3%;
  }
  #CE240712summer .block05{
    width: 140rem;
    margin-bottom: 14.4rem;
  }
  #CE240712summer [data-grid="05"]{
    grid-template-columns: 15rem 18rem 40rem 2rem 40rem 10rem;
    grid-template-rows: 23rem 14.7rem 33.9rem 10.2rem 2rem 24.8rem 21.8rem;
    margin-bottom: 6rem;
  }
  #CE240712summer [data-side-txt="05"]{
    grid-column: 1 / 2;
    grid-row: 4 / 7;
    margin-left: 1.8rem;
  }
  #CE240712summer [data-side-txt="05"] [data-delay="02"]{
    top: -25%;
    left: 34%;
  }
  #CE240712summer [data-topic="05"]{
    grid-column: 4 / 6;
    grid-row: 2 / 3;
    margin: 0 0 0 auto;
  }
  #CE240712summer [data-topic-ttl="05"]{
    width: 31rem;
  }
  #CE240712summer [data-topic-line="05"]{
    width: 34.3rem;
    top: 32%;
    right: -8%;
  }
  #CE240712summer [data-img="13"]{
    grid-column: 2 / 4;
    grid-row: 1 / 5;
  }
  #CE240712summer [data-img="14"]{
    grid-column: 5 / 7;
    grid-row: 3 / 7;
  }
  #CE240712summer [data-img="15"]{
    grid-column: 3 / 4;
    grid-row: 6 / 9;
  }
  #CE240712summer [data-credit="05"]{
    grid-column: 5 / 6;
    grid-row: 8 / 9;
    margin-left: 0;
  }
  #CE240712summer [data-lead-bold="05"]{
    margin-bottom: 0.8rem;
  }
  #CE240712summer [data-lead-bg="05"]{
    width: 10rem;
    height: 11.2rem;
    top: -9%;
    left: -3%;
  }
  #CE240712summer .block-movie{
    width: 110rem;
    margin-bottom: 15rem;
  }
  #CE240712summer .block06{
    width: 140rem;
    margin-bottom: 14.5rem;
  }
  #CE240712summer [data-grid="06"]{
    grid-template-columns: 15rem 8.4rem 36rem 18.6rem 2rem 45rem;
    grid-template-rows: 9.2rem 12.4rem 42.2rem 2rem 44.5rem 2rem;
    margin-bottom: 5.9rem;
  }
  #CE240712summer [data-side-txt="06"]{
    grid-column: 7 / 8;
    grid-row: 3 / 6;
    width: 11.15rem;
    margin: 0.8rem 0 0 1.8rem;
  }
  #CE240712summer [data-side-txt="06"] [data-delay="02"]{
    top: -6.6%;
  }
  #CE240712summer [data-topic="06"]{
    grid-column: 2 / 4;
    grid-row: 2 / 3;
    margin: 0 0 0 auto;
  }
  #CE240712summer [data-topic-ttl="06"]{
    width: 31.17rem;
  }
  #CE240712summer [data-topic-line="06"]{
    width: 35.96rem;
    top: 41%;
    left: -16%;
  }
  #CE240712summer [data-img="16"]{
    grid-column: 2 / 5;
    grid-row: 3 / 6;
  }
  #CE240712summer [data-img="17"]{
    grid-column: 6 / 7;
    grid-row: 1 / 4;
  }
  #CE240712summer [data-img="18"]{
    grid-column: 6 / 7;
    grid-row: 5 / 8;
  }
  #CE240712summer [data-credit="06"]{
    grid-column: 4 / 5;
    grid-row: 7 / 8;
    text-align: right;
  }
  #CE240712summer [data-lead-bold="06"]{
    margin-bottom: 0.7rem;
  }
  #CE240712summer [data-lead-bg="06"]{
    width: 10rem;
    height: 11.2rem;
    top: -7.2%;
    left: -3%;
  }
  #CE240712summer .block07{
    width: 140rem;
    margin-bottom: 14.5rem;
  }
  #CE240712summer [data-grid="07"]{
    grid-template-columns: 15rem 45rem 2rem 12.4rem 41rem 9.6rem;
    grid-template-rows: 7.4rem 12.2rem 23.2rem 21rem 2rem 42rem 4.6rem;
    margin-bottom: 5.9rem;
  }
  #CE240712summer [data-side-txt="07"]{
    grid-column: 1 / 2;
    grid-row: 4 / 7;
    width: 11.1rem;
    margin-left: 2rem;
  }
  #CE240712summer [data-side-txt="07"] [data-delay="02"]{
    top: -15.8%;
    left: 34%;
  }
  #CE240712summer [data-topic="07"]{
    grid-column: 3 / 6;
    grid-row: 2 / 3;
    margin: 0 0 0 auto;
  }
  #CE240712summer [data-topic-ttl="07"]{
    width: 41.23rem;
  }
  #CE240712summer [data-topic-line="07"]{
    width: 44.98rem;
    top: 37.5%;
    left: 1%;
  }
  #CE240712summer [data-img="19"]{
    grid-column: 4 / 7;
    grid-row: 3 / 7;
  }
  #CE240712summer [data-img="20"]{
    grid-column: 2 / 3;
    grid-row: 1 / 5;
  }
  #CE240712summer [data-img="21"]{
    grid-column: 2 / 3;
    grid-row: 6 / 9;
  }
  #CE240712summer [data-credit="07"]{
    grid-column: 4 / 6;
    grid-row: 8 / 9;
    margin: 0;
  }
  #CE240712summer [data-lead-bold="07"]{
    margin-bottom: 0.7rem;
  }
  #CE240712summer [data-lead-bg="07"]{
    width: 10rem;
    height: 11.2rem;
    top: -7.2%;
    left: -3%;
  }
  #CE240712summer .block08{
    width: 109.95rem;
    padding: 0 0 4.5rem;;
    margin: 0 auto 15rem;
  }
  #CE240712summer .block08::before{
    background-image: url(../img/bg-border_pc.svg);
    width: 100%;
    height: 100%;
    top: 11.11rem;
  }
  #CE240712summer .block08__ttl{
    width: 46.7rem;
    margin: 0 auto 6rem;
  }
  #CE240712summer .block08__ttl [data-delay="02"]{
    width: 29.96rem;
    margin: 0 auto 3rem;
  }
  #CE240712summer .block08__ttl-main{
    gap: 1.3rem;
  }
  #CE240712summer .block08__ttl-main span:nth-child(1){
    width: 20.7rem;
    height: 3.5rem;
  }
  #CE240712summer .block08__ttl-main span:nth-child(2){
    width: 2rem;
    height: 2rem;
    padding-top: 0.8rem;
  }
  #CE240712summer .block08__ttl-main span:nth-child(3){
    width: 21.3rem;
    height: 3.48rem;
  }
  #CE240712summer .block08__top{
    margin-bottom: 5rem;
  }
  #CE240712summer [data-lead-bold="08"]{
    margin-bottom: 1.2rem;
  }
  #CE240712summer [data-img="22"],
  #CE240712summer [data-img="23"]{
    width: 50rem;
  }
  #CE240712summer .block08__bottom{
    display: grid;
    grid-template-columns: 35rem 5rem 41rem;
    grid-template-rows: 34.2rem 1.8rem;
    width: 81rem;
    padding-left: 6rem;
    margin: 0 auto;
  }
  #CE240712summer .block08__bottom-lead{
    grid-column: 3/4;
    grid-row: 1/2;
  }
  #CE240712summer [data-img="24"]{
    grid-column: 1/2;
    grid-row: 1/4;
  }
  #CE240712summer [data-credit="08"]{
    grid-column: 3/4;
    grid-row: 3/4;
    margin: 0;
  }
  #CE240712summer .lastArea{
    width: 110rem;
    padding: 5.5rem 0 5rem;
    margin-bottom: 10rem;
  }
  #CE240712summer .lastArea__img{
    width: 50.7rem;
    margin: 0;
    position: absolute;
    top: 6.6rem;
    right: 6.3%;
    background-image: url(../img/img26_bg.png);
    background-size: 78%;
    background-position-y: 45%;
    background-position-x: 50%;
    background-repeat: no-repeat;
  }
  #CE240712summer .lastArea__ttl{
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    width: 44rem;
    margin: 0 0 4.4rem;
  }
  #CE240712summer .lastArea__ttl-img{
    width: 28rem;
    height: 12rem;
    margin: 0 0 1.1rem 6.2rem;
  }
  #CE240712summer .lastArea::before{
    width: 80rem;
    height: 92.3rem;
    top: 0;
  }
  #CE240712summer .lastArea::before{
    left: -100%;
    transition: 1.5s;
  }
  #CE240712summer .lastArea.js-scrollIn::before{
    left: 0;
  }
  #CE240712summer .youtubeWrap{
    width: 80rem;
    height: 45rem;
    margin-bottom: 7.5rem;
  }
}
/* end layout */



/*================================
  fadeIn
=================================*/
#CE240712summer .js-fadeIn,
#CE240712summer .js-anchor{
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1.2s, transform 1.2s;
}
#CE240712summer [data-delay="02"]{
  transition-delay: 0.5s;
}
#CE240712summer [data-delay="01"]{
  transition-delay: 0.5s;
}
#CE240712summer [data-delay="02"]{
  transition-delay: 1s;
}
#CE240712summer .js-scrollIn{
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

/*================================
  slideIn
=================================*/
#CE240712summer .js-slideIn-right{
  opacity: 0;
}
#CE240712summer .js-slideIn-right.js-scrollIn{
  animation: js-slideRtoL 1s ease-in-out 1.5s 1 normal forwards;
}
@keyframes js-slideRtoL{
  0%{
    opacity: 0;
    transform: translate(10%);
  }
  20%{
    visibility: visible;
    opacity: 1;
  }
  100%{
    visibility: visible;
    opacity: 1;
    transform: translate(0%);
  }
}

/*================================
  clip
=================================*/
#CE240712summer .js-clip-bottom{
  clip-path: inset(0 0 100% 0);
  transition-duration: 0.5s;
}
#CE240712summer .js-clip-right,
#CE240712summer .js-clip-left-pc{
  clip-path: inset(0 100% 0 0);
  transition-duration: 0.5s;
}
#CE240712summer .js-clip-left,
#CE240712summer .js-clip-right-pc{
  clip-path: inset(0 0 0 100%);
  transition-duration: 0.5s;
}
@media only screen and (min-width: 768px) {
  #CE240712summer .js-clip-left-pc{
    clip-path: inset(0 0 0 100%);
    transition-duration: 0.5s;
  }
  #CE240712summer .js-clip-right-pc{
    clip-path: inset(0 100% 0 0);
    transition-duration: 0.5s;
  }
}
#CE240712summer .js-clip-bottom.js-scrollIn,
#CE240712summer .js-clip-right.js-scrollIn,
#CE240712summer .js-clip-left.js-scrollIn,
#CE240712summer .js-clip-left-pc.js-scrollIn,
#CE240712summer .js-clip-right-pc.js-scrollIn{
  opacity: 1;
  clip-path: inset(0 0 0 0);
}

/*================================
  scale
=================================*/
#CE240712summer .js-scale{
  visibility: hidden;
  opacity: 0;
}
#CE240712summer .js-scale.js-scrollIn{
  animation: js-scale 5s ease-in-out 0.5s 1 normal forwards;
}
@keyframes js-scale{
  0%{
    opacity: 0;
    transform: scale(1.1);
  }
  20%{
    visibility: visible;
    opacity: 1;
  }
  100%{
    visibility: visible;
    opacity: 1;
    transform: scale(1);
  }
}

/*================================
  rotate
=================================*/
#CE240712summer .js-rotate{
  visibility: hidden;
  opacity: 0;
}
#CE240712summer .js-rotate.js-scrollIn{
  visibility: visible;
  opacity: 1;
  animation: js-rotate 1s ease-in-out 0.5s 1 normal forwards;
}

/*================================
  photo-animation
=================================*/
#CE240712summer .lastArea__img{
  opacity: 0;
}
#CE240712summer .lastArea__img.js-scrollIn{
  animation-name: photo-r;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-delay: .5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
@keyframes photo-r{
  0% {
    opacity: 0;
    transform: scale(1.2) rotate(15deg) translateY(-10%);
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale(1) rotate(0) translateY(0);
  }
}
/* end photo-animation */