@charset "utf-8";

html {
  scroll-padding-top: 150px;
}

.content-title {
  margin-left: min(calc(-15 / var(--vw-min) * 100vw), -15px);
}
@media screen and (max-width: 768px) {
  .content-title {
    margin-left: calc(-8 / var(--vw-min) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .content-titleWrap {
    overflow: hidden;
    display: block;
    position: relative;
  }
  .illustration .content-title-navIn {
    position: absolute;
    right: 0;
    top: 0;
    height: calc(190 / var(--vw-min) * 100vw);
  }
  .illustration .breadcrumbs li {
    white-space: nowrap;
  }
}
/*---------------------------------
* illustration / content
----------------------------------*/
.content__aroundWrap {
  height: calc(100% - var(--footerHeight));
}
.illustration {
  padding: min(calc(186 / var(--vw-min) * 100vw), 186px) 0 min(calc(310 / var(--vw-min) * 100vw), 310px);
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .illustration {
    padding: calc(170 / var(--vw-min) * 100vw) 0 calc(190 / var(--vw-min) * 100vw);
  }
}
.illustration__content {
  width: min(calc(880 / var(--vw-min) * 100vw), 880px);
  margin: min(calc(70 / var(--vw-min) * 100vw), 70px) auto;
}

@media screen and (max-width: 768px) {
  .illustration__content {
    width: 100%;
    padding: 0;
    margin: calc(70 / var(--vw-min) * 100vw) 0 calc(48 / var(--vw-min) * 100vw);
  }
}

/*---------------------------------
* illustrationListWrap
----------------------------------*/
/* illustrationListWrap */
@media screen and (max-width: 768px) {
  .illustrationListWrap {
    width: 80%;
    margin: 0 auto;
  }
}

/* illustrationTit */
.illustrationTit {
  text-align: center;
  margin-bottom: min(calc(50 / var(--vw-min) * 100vw), 50px);
}
@media screen and (max-width: 768px) {
  .illustrationTit {
    font-size: calc(30 / var(--vw-min) * 100vw);
    margin-bottom: calc(80 / var(--vw-min) * 100vw);
  }
}

.illustrationTit > span {
  font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
  font-weight: 800;
  background: linear-gradient(transparent 70%, #b69848 30%);
  display: inline;
}
@media screen and (max-width: 768px) {
  .illustrationTit > span {
    font-size: calc(30 / var(--vw-min) * 100vw);
    line-height: 1.5;
  }
}

.illustrationTit img {
  margin-bottom: min(calc(15 / var(--vw-min) * 100vw), 15px);
}
@media screen and (max-width: 768px) {
  .illustrationTit img {
    margin-bottom: calc(20 / var(--vw-min) * 100vw);
  }
}

/* illustrationImg */
.illustrationImg {
  margin: min(calc(40 / var(--vw-min) * 100vw), 40px) 0;
}
.illustrationImg img {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .illustrationImg {
    margin: calc(50 / var(--vw-min) * 100vw) 0;
  }
}

/* illustrationList */
.illustrationList{
  margin-bottom: min(calc(70 / var(--vw-min) * 100vw), 70px);
}
@media screen and (max-width: 768px) {
  .illustrationList{
    margin-bottom:calc(80 / var(--vw-min) * 100vw);
  }
}

@media screen and (min-width: 769px) {
  .pcsmall{
    width: 60%;
    margin: 0 auto;
    padding: min(calc(40 / var(--vw-min) * 100vw), 40px) 0;
  }
  .pcsmall img{
    width: 100%;
  }
}

/* illustrationSubtxt */
.illustrationSubtxt {
  margin-top: min(calc(50 / var(--vw-min) * 100vw), 50px);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .illustrationSubtxt {
    font-size: calc(30 / var(--vw-min) * 100vw);
    margin-top: calc(80 / var(--vw-min) * 100vw);
  }
}

.illustrationSubtxt > span {
  font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
  font-weight: 800;
  background: linear-gradient(transparent 70%, #b64848 30%);
  display: inline;
}
@media screen and (max-width: 768px) {
  .illustrationSubtxt > span {
    font-size: calc(30 / var(--vw-min) * 100vw);
    line-height: 1.5;
  }
}

/*---------------------------------
* linkBox
----------------------------------*/
.linkBox {
  display: block;
  position: relative;
  width: min(calc(300 / var(--vw-min) * 100vw), 300px);
  height: min(calc(48 / var(--vw-min) * 100vw), 48px);
  color: #fff;
  background: url(../img/movie/linkbtn_off.png) no-repeat center center / contain;
  transition: all 0.3s ease;
  color: #fff;
  font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
  letter-spacing: 0.013em;
  font-family: source-han-serif-japanese, "bodoni-urw", serif;
  font-weight: 400;
  font-style: normal;
  margin: auto;
}
.linkBox button {
  color: #fff;
  display: block;
  cursor: pointer;
}
.linkBox a {
  width: 100%;
  height: 100%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.linkBox.is-active,
.linkBox:hover {
  color: #b64848;
  background: url(../img/movie/linkbtn_on.png) no-repeat center center / contain;
  cursor: pointer;
}
.linkBox.is-active a,
.linkBox:hover a {
  color: #b64848;
}

@media screen and (max-width: 768px) {
  .linkBox {
    height: min(calc(64 / var(--vw-min) * 100vw), 64px);
    font-size: calc(22 / var(--vw-min) * 100vw);
    letter-spacing: 0.08em;
    width: 60vw;
    margin: calc(40 / var(--vw-min) * 100vw) auto 0;
  }
  .interview .tabBtnWrap li .linkBox {
    margin-bottom: calc(5 / var(--vw-min) * 100vw);
  }
}