/*******************************
vol016.scss
*******************************/
html, body {
  background-color: #000;
  color: #FFF;
}

.intro__top {
  position: relative;
  padding: 0 40px;
}
.intro__top__slider {
  position: relative;
  overflow: hidden;
  max-height: 712px;
}
.intro__top__slider .slider__slides {
  z-index: 0;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 59.33333%;
}
.intro__top__slider .slider__slides__slide {
  width: 100%;
}
.intro__top__slider .slider__slides__slide > img {
  position: relative;
  width: 105%;
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
.intro__top__slider .slider__slides__slide.move > img {
  -moz-transition: -moz-transform 9000ms linear;
  -o-transition: -o-transform 9000ms linear;
  -webkit-transition: -webkit-transform 9000ms linear;
  transition: transform 9000ms linear;
  -moz-transform: translateX(-4.7%);
  -ms-transform: translateX(-4.7%);
  -webkit-transform: translateX(-4.7%);
  transform: translateX(-4.7%);
}
.intro__top__title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 493px;
  width: 38.51563%;
  max-height: 229px;
  height: 32.16292%;
  margin: auto;
}
.intro__top__credit {
  position: absolute;
  left: 2.5%;
  bottom: 3.93258%;
  margin-left: 40px;
  font-size: 75%;
  font-weight: 600;
  line-height: 1.2em;
}
.intro__top__copy {
  overflow: hidden;
  pointer-events: none;
  position: absolute;
  top: 8.42697%;
  right: 1.5625%;
  margin-right: 40px;
  max-width: 228px;
  width: 17.8125%;
}
.intro__top__copy__p {
  position: relative;
  overflow: hidden;
  width: 0;
  -moz-transition: width 640ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -o-transition: width 640ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -webkit-transition: width 640ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: width 640ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.intro__top__copy__p:nth-child(2) {
  margin-top: -7px;
}
.intro__top__copy__p:nth-child(3) {
  -moz-transition: width 1400ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -o-transition: width 1400ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -webkit-transition: width 1400ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: width 1400ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.intro__top__copy__p.show {
  width: 100%;
}
.intro__top__scroll {
  position: absolute;
  bottom: 0;
  right: 12.8125%;
  max-width: 86px;
  width: 6.71875%;
  margin-bottom: -3.4375%;
}
.intro__top__scroll__link {
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 100%;
  height: 0;
  padding-bottom: 0;
  margin-top: -226.74419%;
  -moz-transition: padding 320ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
  -o-transition: padding 320ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
  -webkit-transition: padding 320ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
  transition: padding 320ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.intro__top__scroll__link.show {
  padding-bottom: 226.74419%;
}
.intro__top__scroll__link > img {
  position: absolute;
  top: 0;
}
.intro__content {
  padding: 5.625% 0 4.6875%;
  text-align: center;
}
.intro__content__title {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  margin-bottom: 32px;
  padding-bottom: 1px;
  font-size: 112.5%;
  font-weight: 700;
  line-height: 1em;
  letter-spacing: 0.1em;
  border-bottom: 1px solid #FFF;
}
.intro__content__text {
  width: 92.5%;
  margin: 0 auto 1.8em;
  font-size: 87.5%;
  line-height: 1.8em;
}

.slider {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.slider__slides__slide {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  font-size: 0;
}
.slider__slides__slide__tile {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  width: 50%;
}

.section {
  position: relative;
}
.section__content {
  width: 860px;
  padding: 5% 0 9.375%;
  margin: 0 auto;
  text-align: center;
}
.section__content:after {
  content: ' ';
  display: block;
  clear: both;
}
.section__content__title {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  margin-bottom: 7.44186%;
  padding-bottom: 1px;
  font-size: 112.5%;
  font-weight: 700;
  text-align: center;
}
.section__content__box {
  margin-bottom: 32px;
  text-align: left;
}
.section__content__box:last-child {
  margin-bottom: 0;
}
.section__content__box:after {
  content: ' ';
  display: block;
  clear: both;
}
.section__content__left {
  float: left;
}
.section__content__right {
  float: right;
}
.section__content__text {
  margin-bottom: 1.8em;
  line-height: 1.8em;
}

.section-1 .section__content__title {
  border-bottom: 1px solid #FFF;
}
.section-1__top {
  position: relative;
  margin-bottom: 1.5625%;
}
.section-1__top__image:after {
  content: ' ';
  display: block;
  clear: both;
}
.section-1__top__image__left, .section-1__top__image__right {
  width: 50%;
}
.section-1__top__image__left {
  float: left;
}
.section-1__top__image__right {
  float: right;
}
.section-1__top__title {
  position: absolute;
  left: 14.84375%;
  bottom: -3.4632%;
  max-width: 214px;
  width: 16.71875%;
}
.section-1__top__copy {
  overflow: hidden;
  position: absolute;
  left: 66.17188%;
  bottom: -3.4632%;
  max-width: 267px;
  width: 0;
  -moz-transition: width 1200ms cubic-bezier(0.645, 0.045, 0.355, 1);
  -o-transition: width 1200ms cubic-bezier(0.645, 0.045, 0.355, 1);
  -webkit-transition: width 1200ms cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: width 1200ms cubic-bezier(0.645, 0.045, 0.355, 1);
}
.section-1__top__copy.show {
  width: 20.85938%;
}
.section-1__top__attr {
  position: absolute;
  top: 2.1645%;
  right: 3.28125%;
  max-width: 141px;
  width: 11.01563%;
}
.section-1 .section__content__left {
  width: 372px;
}
.section-1 .section__content__right {
  width: 431px;
}

.section-2 {
  color: #C8FF00;
}
.section-2 .section__content__title {
  border-bottom: 1px solid #C8FF00;
}
.section-2__top {
  position: relative;
}
.section-2__top__image {
  position: relative;
  overflow: hidden;
  max-height: 580px;
}
.section-2__top__title {
  position: absolute;
  top: 8.27586%;
  left: 16.25%;
  max-width: 733px;
  width: 57.26563%;
}
.section-2__top__title__left, .section-2__top__title__right {
  position: absolute;
  overflow: hidden;
  height: 0;
  padding-bottom: 0;
  -moz-transition: padding 1600ms cubic-bezier(0.77, 0, 0.175, 1);
  -o-transition: padding 1600ms cubic-bezier(0.77, 0, 0.175, 1);
  -webkit-transition: padding 1600ms cubic-bezier(0.77, 0, 0.175, 1);
  transition: padding 1600ms cubic-bezier(0.77, 0, 0.175, 1);
}
.section-2__top__title__left > img, .section-2__top__title__right > img {
  position: absolute;
}
.section-2__top__title__left {
  top: 0;
  left: 28.10368%;
  width: 4.91132%;
  margin-top: 21.69168%;
}
.section-2__top__title__left.show {
  padding-bottom: 22.91951%;
}
.section-2__top__title__left > img {
  top: 0;
}
.section-2__top__title__right {
  left: 86.90314%;
  bottom: 0;
  width: 5.59345%;
  margin-bottom: 4.2292%;
}
.section-2__top__title__right.show {
  padding-bottom: 29.05866%;
}
.section-2__top__title__right > img {
  bottom: 0;
}
.section-2__top__copy {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transition: opacity 240ms ease-in-out;
  -o-transition: opacity 240ms ease-in-out;
  -webkit-transition: opacity 240ms ease-in-out;
  transition: opacity 240ms ease-in-out;
  position: absolute;
  top: 0;
  right: 2.31924%;
  margin-top: 17.59891%;
  width: 2.45566%;
}
.section-2__top__copy.show {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}
.section-2__top__attr {
  position: absolute;
  top: 4.82759%;
  right: 16.25%;
  max-width: 141px;
  width: 11.01563%;
}
.section-2 .section__content__left {
  width: 452px;
}
.section-2 .section__content__right {
  width: 368px;
}

.section-3 {
  color: #000;
  background-color: #C8FF00;
}
.section-3 .section__content__title {
  border-bottom: 1px solid #000;
}
.section-3__top {
  position: relative;
  background-color: #000;
}
.section-3__top__image {
  position: relative;
  overflow: hidden;
  max-height: 502px;
}
.section-3__top__title {
  position: absolute;
  bottom: 0;
  left: 16.25%;
  max-width: 344px;
  width: 26.875%;
}
.section-3__top__title__left, .section-3__top__title__right {
  overflow: hidden;
  position: absolute;
  right: 6.39535%;
  width: 24.7093%;
  height: 0;
  padding-bottom: 0;
}
.section-3__top__title__left.show, .section-3__top__title__right.show {
  padding-bottom: 49.12791%;
}
.section-3__top__title__left {
  top: 0;
  margin-top: 6.68605%;
  -moz-transition: padding 280ms cubic-bezier(0.39, 0.575, 0.565, 1);
  -o-transition: padding 280ms cubic-bezier(0.39, 0.575, 0.565, 1);
  -webkit-transition: padding 280ms cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: padding 280ms cubic-bezier(0.39, 0.575, 0.565, 1);
}
.section-3__top__title__left > img {
  position: absolute;
  top: 0;
}
.section-3__top__title__right {
  bottom: 0;
  margin-bottom: 22.67442%;
  -moz-transition: padding 280ms cubic-bezier(0.47, 0, 0.745, 0.715);
  -o-transition: padding 280ms cubic-bezier(0.47, 0, 0.745, 0.715);
  -webkit-transition: padding 280ms cubic-bezier(0.47, 0, 0.745, 0.715);
  transition: padding 280ms cubic-bezier(0.47, 0, 0.745, 0.715);
}
.section-3__top__title__right > img {
  position: absolute;
  bottom: 0;
}
.section-3__top__copy {
  overflow: hidden;
  position: absolute;
  top: -15.86207%;
  left: 59.53125%;
  max-width: 322px;
  width: 0;
  -moz-transition: width 840ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -o-transition: width 840ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -webkit-transition: width 840ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: width 840ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.section-3__top__copy.show {
  width: 25.15625%;
}
.section-3 .section__content__left {
  width: 408px;
}
.section-3 .section__content__right {
  width: 408px;
}

.section-4 .section__content__title {
  border-bottom: 1px solid #FFF;
}
.section-4__top {
  position: relative;
  background-color: #000;
}
.section-4__top__image__list {
  font-size: 0;
}
.section-4__top__image__list__item {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  width: 25%;
}
.section-4__top__title {
  position: absolute;
  top: 0;
  width: 100%;
}
.section-4__top__title__main {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 14.53125%;
  max-width: 597px;
  width: 0;
  margin-top: 8.28125%;
  -moz-transition: width 520ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -o-transition: width 520ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -webkit-transition: width 520ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: width 520ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.section-4__top__title__main.show {
  width: 46.64063%;
}
.section-4__top__title__line {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 50.625%;
  max-width: 442px;
  width: 34.53125%;
  height: 0;
  padding-bottom: 0;
  -moz-transition: padding 600ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
  -o-transition: padding 600ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
  -webkit-transition: padding 600ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: padding 600ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
}
.section-4__top__title__line.show {
  padding-bottom: 32.8125%;
}
.section-4__top__attr {
  position: absolute;
  right: 16.25%;
  bottom: 3.10345%;
  max-width: 140px;
  width: 10.9375%;
}
.section-4__info {
  padding: 18px 0;
  margin-top: 60px;
  border-top: 1px solid #666;
  border-bottom: 1px solid #666;
}
.section-4__info__title {
  color: #DDD;
  font-size: 87.5%;
  font-weight: 700;
  line-height: 1em;
}
.section-4__info__text {
  margin-top: 2.7027%;
  color: #EEE;
  font-size: 81.25%;
  line-height: 1.6em;
}
.section-4__info__link {
  margin-top: 2.7027%;
  color: #999;
  font-size: 81.25%;
  line-height: 1em;
}
.section-4 .section__content__left {
  width: 372px;
}
.section-4 .section__content__right {
  width: 444px;
}

.outro__sns {
  position: relative;
  width: 860px;
  margin: -7.5% auto 0;
  padding: 60px 0 5.625%;
}
.outro__sns__title {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 328px;
  width: 0;
  -moz-transition: width 480ms ease-in-out;
  -o-transition: width 480ms ease-in-out;
  -webkit-transition: width 480ms ease-in-out;
  transition: width 480ms ease-in-out;
}
.outro__sns__title.show {
  width: 50px;
}
.outro__sns__title > img {
  width: 50px;
}
.outro__sns__list {
  font-size: 0;
  text-align: center;
}
.outro__sns__list__btn {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  width: 37px;
  margin: 0 6px;
}
.outro__sns__list__btn > a {
  display: block;
}

.insta {
  margin-bottom: 70px;
}