@charset "utf-8";
/* CSS Document */

/*-------------------------------
 intro
---------------------------------*/
#intro {
  width: 100%;
  background: 
    linear-gradient(180deg, rgb(252 232 213 / 50%) 0%, transparent 50%),
    linear-gradient(0deg, rgb(255 255 255 / 70%), rgb(255 255 255 / 70%)),
    url(/dd/special/gakuen-idolmaster/image/bg_classroom-mainheader.jpg) 50% 100% / calc(var(--rs) * 204.8) no-repeat
  ;
  font-family: var(--ff-zenmaruG);
  text-align: center;
}
.intro-cont {
  width: min(100%, calc(102.4rem + 4%));
  padding: calc(var(--rs) * 2) 2%;
  margin: 0 auto;
}
.intro-heading {
  width: fit-content;
  padding: 0.15em 0.5em 0.15em 1em;
  margin: auto;
  background: linear-gradient(90deg, #2d76ad 0%, #608eba 100%);
  color: #fff;
  font-size: calc(var(--rs) * 2 + var(--fs) * 1);
  font-weight: normal;
  line-height: 1.4;
}
.intro-heading span {
  display: block;
  position: relative;
  left: -2em;
}
.intro-heading span ~ span {
  margin-top: calc(var(--rs) * 1);
  left: 2em;
}
.intro-text {
  width: min(100%, 62rem);
  margin: 1em auto;
  font-size: calc(var(--fs) * 2);
  font-weight: bold;
}
/*-------------------------------
 spec
---------------------------------*/
#specDDtemari {
  padding: calc(var(--rs) * 5) 0;
  background: 
    linear-gradient(90deg, rgb(255 255 255 / 100%) 40%, transparent 60%),
    url("/dd/special/gakuen-idolmaster/image/bg_classroom-body.jpg") 50% 0 / cover no-repeat
    ;
}
.cont-ddTemariSpec {
  width: min(100%, 204.8rem);
  margin: 0 auto 1em;
  display: flex;
  flex-flow: row-reverse nowrap;
  align-items: stretch;
  justify-content: center;
  position: relative;
}
/* spec _ img*/
.ddTemariSpec-img {
  width: min(100%, calc(var(--fs) * 87.3));
  max-width: 87.3rem;
  background: url("/dd/special/gakuen-idolmaster/image/bg_notes_grid-temari.png") 0 0 / contain no-repeat;
  margin: 0;
  margin-left: calc(var(--rs) * -0.8);
  margin-right: auto;
  text-align: right;
  flex: 1 1 auto;
  position: relative;
  z-index: 2;
}
.ddTemariStanding {
  width: 60.71%;
  margin: 0;
  margin-left: auto;
}
/*spec _ text*/
.ddTemariSpec-text {
  width: min(100%, calc(var(--fs) * 87.3));
  max-width: 87.3rem;
  padding: 2em 5% 2em 2%;
  margin: 0;
  margin-left: auto;
  margin-right: calc(var(--rs) * -0.8);
  font-family: var(--ff-NtSnsJP);
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
}
.cont-spec {
  width: 100%;
  /*filter: drop-shadow(0 0 calc(var(--rs) * 1)  rgb(0 0 0 / 50%));*/
  position: relative;
}
.bg-notesGrid {
  container-type: inline-size;
}
.grid-left {
  background: url("/dd/special/gakuen-idolmaster/image/bg_notes_grid-left.png") 0 0 / cover repeat-y;
}
.grid-right {
  background: url("/dd/special/gakuen-idolmaster/image/bg_notes_grid-right.png") 0 0 / cover repeat-y;
}
.spec-imgCont {
  width: 43%;
  margin: 0 auto 3em 0;
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-start;
  position: absolute;
  left: 8%;
  top: 9%;
}
.specImg {
  position: relative;
  display: block;
}
.specImg-includedItems {
}
.specImg-partsPoint {
  margin: calc(var(--fs) * 4 + var(--rs) * 10) -17% 0 0;
}
.partsPoint-text {
  width: min(80%, 22rem);
  padding: 0.8em 1em 0.8em 0.5em;
  background: #f9fbfc;
  border-left: calc(var(--rs) * 1.2) solid #3874aa;
  box-shadow: calc(var(--rs) * 0.2) calc(var(--rs) * 0.2) calc(var(--rs) * 1) 1px rgb(0 0 0 / 50%);
  font-size: calc(var(--fs) * 0.6 + var(--rs) * 0.8);
  text-align: left;
  position: absolute;
  left: 3%;
  bottom: 85%;
}
/*pic frame _ masking tape (手毬未使用)*/
/*.pic-frame-mt::before,
.pic-frame-mt::after {
  content: "";
  width: min(20%,calc(var(--rs) * 17));
  height: min(21.6666666%, calc(var(--rs) * 13));
  background-size: contain;
  background-position: 0 0;
  background-repeat: no-repeat;
  position: absolute;
}
.pic-frame-mt::before {
  background-image: url("/dd/special/gakuen-idolmaster/image/deco_maskingtape_01.png");
  left: -3.7647058%;
  top: -4.8333333%;
}
.pic-frame-mt::after {
  background-image: url("/dd/special/gakuen-idolmaster/image/deco_maskingtape_02.png");
  right: -4.5882352%;
  bottom: -5.1666666%;
}*/
@container (min-width: 960px) {
  .spec-imgCont {
    position: absolute;
    right: 0;
    top: 0;
  }
}
@media screen and (max-width: 1230px) {
  #specDDteamari {
    padding-top: 0;  
  }
  .cont-ddTemariSpec {  
    flex-direction: column;
    align-items: center;
  }
  .ddTemariSpec-img {
    width: min(104%, calc(var(--fs) * 87.3));
    margin: 0 auto;
    margin-left: -2%;
    position: relative;
    z-index: 1;
  }
  .ddTemariSpec-text {
    width: min(104%, calc(var(--fs) * 87.3));
    padding-top: calc(2em + 4%);
    padding-left: 6%;
    margin: 0 auto;
    margin-top: -3.2%;
    margin-left: -2%;
    background-position: left top;
    position: relative;
    z-index: 1;
  }
}
/*-------------------------------
 gallery
---------------------------------*/
.cont-galleryDouble {
  width: var(--w-cont);
  margin: 0 auto;
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: center;
}
.galleryDouble {
  width: min(100%, 52rem);
  margin: 0;
  flex: 1 1 auto;
}
/*gallery point*/
.gallery-pointText {
  width: 100vi;
  background: var(--grd-org);
  color: #fff;
  font-family: var(--ff-zenmaruG);
  text-align: center;
  position: relative;
}
.pointText-charmpoint {
  width: fit-content;
  padding: 1em 5%;
  margin: 0 auto;
  font-size: calc(var(--fs) * 1.6  );
  text-align: left;
}
.pointText-parts {
  padding: 1em 3%;
  background: #fff;
  border-bottom: dotted 3px #2e77b7;
  color: #4c4c4c;
  font-size: calc(var(--fs) * 1.6);
  text-align: center;
}
.pointText-parts:nth-child(2n) {
  border: none;
}
@media screen and (min-width: 2000px) {
  .gallery-pointText {
    width: 93.8vi;
  }
}
/*-------------------------------
 slick _ unslick
---------------------------------*/
@media screen and (max-width: 840px) {
  .item-pic {
    padding: 1% 2%;
    display: flex;
    flex-flow: row wrap;
  }
  .item-pic--list {
    width: calc(100% / 3 - 2%);
    margin: 1%;
  }
  .slider-container {
    padding-bottom: 3% !important;
  }
}