.animate .fadein {
  opacity: 0;
  transform-style: preserve-3d;
  transition-property: all;
  transition-duration: 2000ms;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  transition-delay: 0ms;
}

.animate.show .fadein {
  opacity: 1;
}

.animate .slidein_left {
  opacity: 0;
  transform: translateX(-100px);
  transform-style: preserve-3d;
  transition-property: all;
  transition-duration: 1000ms;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  transition-delay: 0ms;
}

.animate .slidein_right {
  opacity: 0;
  transform: translateX(100px);
  transform-style: preserve-3d;
  transition-property: all;
  transition-duration: 1000ms;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  transition-delay: 0ms;
}

.animate.show .slidein_left, .animate.show .slidein_right {
  opacity: 1;
  transform: translateX(0);
}

.animate .slidein_top {
  opacity: 0;
  transform: translateY(-100px);
  transform-style: preserve-3d;
  transition-property: all;
  transition-duration: 1000ms;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  transition-delay: 0ms;
}

.animate .slidein_bottom {
  opacity: 0;
  transform: translateY(100px);
  transform-style: preserve-3d;
  transition-property: all;
  transition-duration: 1000ms;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  transition-delay: 0ms;
}

.animate.show .slidein_top, .animate.show .slidein_bottom {
  opacity: 1;
  transform: translateY(0);
}

.animate .zoomin {
  opacity: 0;
  transform: scale(1.5, 1.5);
  transform-style: preserve-3d;
  transition-property: all;
  transition-duration: 500ms;
  transition-delay: 0ms;
}

.animate .zoomout {
  opacity: 0;
  transform: scale(0.5, 0.5);
  transform-style: preserve-3d;
  transition-property: all;
  transition-duration: 500ms;
  transition-delay: 0ms;
}

.animate.show .zoomin, .animate.show .zoomout {
  opacity: 1;
  transform: scale(1, 1);
}

.animate .d1 {
  transition-delay: 100ms;
}

.animate .d2 {
  transition-delay: 200ms;
}

.animate .d3 {
  transition-delay: 300ms;
}

.animate .d4 {
  transition-delay: 400ms;
}

.animate .d5 {
  transition-delay: 500ms;
}

.animate .d6 {
  transition-delay: 600ms;
}

.animate .d7 {
  transition-delay: 700ms;
}

.animate .d8 {
  transition-delay: 800ms;
}

.animate .d9 {
  transition-delay: 900ms;
}

.animate .d10 {
  transition-delay: 1000ms;
}

.animate .d11 {
  transition-delay: 1100ms;
}

.animate .d12 {
  transition-delay: 1200ms;
}

.animate .d13 {
  transition-delay: 1300ms;
}

.animate .d14 {
  transition-delay: 1400ms;
}

.animate .d15 {
  transition-delay: 1500ms;
}

.animate .d16 {
  transition-delay: 1600ms;
}

.animate .d17 {
  transition-delay: 1700ms;
}

.animate .d18 {
  transition-delay: 1800ms;
}

.animate .d19 {
  transition-delay: 1900ms;
}

.animate .d20 {
  transition-delay: 2000ms;
}

.qor-actionbar {
  position: relative;
  z-index: 1;
}

#footer {
  position: relative;
  z-index: 100;
}

body article#main {
  width: 100%;
  overflow: hidden;
  background: #000000;
  font-family: sans-serif;
}

@media screen and (max-width: 1024px) {
  [capillary] .dylan-page.transform, [sfcc] .dylan-page.transform, .dylan-page.transform {
    will-change: initial;
    -webkit-transform: initial;
    transform: initial;
  }

  [capillary] .dylan-page.transform.dylan-slideout, [sfcc] .dylan-page.transform.dylan-slideout, .dylan-page.transform.dylan-slideout {
    will-change: transform;
    -webkit-transform: translate3d(84%, 0, 0);
    transform: translate3d(84%, 0, 0);
  }

  [sfcc] .en-us .dylan-page.dylan-slideout {
    -webkit-transform: translate3d(calc(100% - 45px), 0, 0);
    transform: translate3d(calc(100% - 45px), 0, 0);
  }

  body article#main section.teaser {
    padding-top: 42px;
  }

  body article#main section.teaser .hero {
    margin: 0 auto 47px auto;
    width: 326.5px;
    height: 424px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/img_hero_sp.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .hero span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  body article#main section.teaser .cv a {
    margin: 0 auto 50px auto;
    width: 267px;
    height: 50.5px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/btn_cv_sp.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .cv a span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  body article#main section.teaser .date {
    margin: 0 auto 66px auto;
    width: 345px;
    height: 278px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/text_date_sp.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .date span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  body article#main section.teaser .white {
    margin: 0 auto 85px auto;
    width: 260px;
  }

  body article#main section.teaser .white .img1 {
    margin-bottom: 30px;
    width: 260px;
    height: 347px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/img_white1.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .white .img1 span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  body article#main section.teaser .white .img2 {
    width: 260px;
    height: 347px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/img_white2.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .white .img2 span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  #footer {
    margin-top: 0;
  }

  .for_pc {
    display: none !important;
  }
}
@media screen and (min-width: 1025px) {
  body article#main section.teaser {
    padding-top: 60px;
  }

  body article#main section.teaser .hero {
    margin: 0 auto 74px auto;
    width: 494px;
    height: 476px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/img_hero_pc.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .hero span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  body article#main section.teaser .cv a {
    margin: 0 auto 64px auto;
    width: 320px;
    height: 60px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/btn_cv_pc.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
    opacity: 1;
    transform-style: preserve-3d;
    transition-property: all;
    transition-duration: 300ms;
    transition-timing-function: linear;
    transition-delay: 0ms;
  }

  body article#main section.teaser .cv a span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  body article#main section.teaser .cv a:hover {
    opacity: .8;
  }

  body article#main section.teaser .date {
    margin: 0 auto 82px auto;
    width: 912px;
    height: 79px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/text_date_pc.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .date span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  body article#main section.teaser .white {
    margin: 0 auto 100px auto;
    width: 914px;
    overflow: hidden;
  }

  body article#main section.teaser .white .img1 {
    float: left;
    width: 440px;
    height: 587px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/img_white1.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .white .img1 span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  body article#main section.teaser .white .img2 {
    float: right;
    width: 440px;
    height: 587px;
    display: block;
    border: none;
    background-color: transparent;
    background-image: url("../img/img_white2.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
  }

  body article#main section.teaser .white .img2 span {
    height: 1px;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }

  .for_sp {
    display: none !important;
  }
}
or-actionbar {
  position: relative;
  z-index: 1;
}

.dylan-page {
  background: transparent;
}

@media only screen and (min-width: 320px) and (max-width: 1024px) {
  [sfcc] .dylan-page {
    background-color: transparent;
  }

  [capillary] .dylan-page.transform,
  [sfcc] .dylan-page.transform,
  .dylan-page.transform {
    will-change: initial;
    -webkit-transform: initial;
    transform: initial;
  }

  [capillary] .dylan-page.transform.dylan-slideout,
  [sfcc] .dylan-page.transform.dylan-slideout,
  .dylan-page.transform.dylan-slideout {
    will-change: transform;
    -webkit-transform: translate3d(84%, 0, 0);
    transform: translate3d(84%, 0, 0);
  }

  [sfcc] .en-us .dylan-page.dylan-slideout {
    -webkit-transform: translate3d(calc(100% - 45px), 0, 0);
    transform: translate3d(calc(100% - 45px), 0, 0);
  }
}
#footer {
  position: relative;
  z-index: 100;
}

html.not_full_support body article#main .logo .base {
  display: none;
}
html.not_full_support body article#main .logo .main {
  mix-blend-mode: normal;
}
html.not_full_support body article#main section.share {
  background-attachment: inherit;
}

@media screen and (max-width: 768px) {
  [capillary] .dylan-page.transform,
  [sfcc] .dylan-page.transform,
  .dylan-page.transform {
    will-change: initial;
    -webkit-transform: initial;
    transform: initial;
  }
  [capillary] .dylan-page.transform.dylan-slideout,
  [sfcc] .dylan-page.transform.dylan-slideout,
  .dylan-page.transform.dylan-slideout {
    will-change: transform;
    -webkit-transform: translate3d(84%, 0, 0);
    transform: translate3d(84%, 0, 0);
  }

  [sfcc] .header-mobile {
    position: relative;
  }

  [sfcc] .en-us .dylan-page.dylan-slideout {
    -webkit-transform: translate3d(calc(100% - 45px), 0, 0);
    transform: translate3d(calc(100% - 45px), 0, 0);
  }

  .search-tool.mobile {
    margin-top: -2px;
    background: #ffffff;
  }

  #footer {
    margin-top: -1px;
  }

  .mw {
    display: none;
  }

  .mw .mw_bg {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
    background: #000000;
  }

  .mw .mw_content {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 90px;
    left: 0;
    z-index: 1002;
    pointer-events: none;
  }

  .mw .mw_content a.close {
    padding: 24px;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
  }

  .mw .mw_content a.close span {
    width: 30px;
    height: 30px;
    display: block;
    background: url("../img/btn_close.svg") no-repeat center center/contain;
    text-indent: -9999px;
    transform-style: preserve-3d;
    transition-property: all;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-delay: 0ms;
  }

  .mw .mw_content .mw_inner {
    margin: 0 auto;
    padding: 76px 0 0 0;
    position: relative;
    top: calc(50vh - 300px);
    pointer-events: auto;
  }

  .mw .mw_content .mw_inner .mw_video {
    padding-top: 56.25%;
    position: relative;
    width: 100%;
  }

  .mw .mw_content .mw_inner .mw_video iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
  }

  .for_pc {
    display: none !important;
  }

  body article#main section.teaser {
    padding-top: 0;
  }
  body article#main section.teaser .hero_area {
    width: 100%;
    overflow: hidden;
    position: relative;
    height: 522px;
  }
  body article#main section.teaser .hero_area video {
    display: block;
    width: auto;
    height: 100%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
  body article#main section.teaser a.yt_mw {
    display: block;
    position: absolute;
    width: 100px;
    height: 100px;
    bottom: 50px;
    left: auto;
    right: 25px;
  }
  body article#main section.teaser a.yt_mw img {
    display: block;
    width: 100%;
    height: auto;
    position: absolute;
  }
  body article#main section.teaser .hero {
    position: absolute;
    top: 42px;
    margin: 0;
    left: 50%;
    margin-left: -163.25px;
  }
  body article#main section.teaser .pic_area {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    width: calc(670% / 7.5);
    margin: 0 auto;
    position: relative;
    padding: 27px 0 48px;
  }
  body article#main section.teaser .pic_area .pic {
    width: calc(320% / 6.7);
    opacity: 0;
    transform: translateY(100px);
    transform-style: preserve-3d;
    transition-property: transform,opacity;
    transition-duration: 1000ms;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-delay: 0ms;
  }
  body article#main section.teaser .pic_area .pic img {
    display: block;
  }
  body article#main section.teaser .pic_area .pic:nth-child(n+3) {
    margin-top: calc(63% / 6.7);
  }
  body article#main section.teaser .pic_area .pic.show {
    opacity: 1;
    transform: translateY(0px);
  }
  body article#main section.teaser .cv a {
    margin-bottom: 80px;
  }

  .sp_none {
    display: none !important;
  }
}
@media screen and (min-width: 769px) {
  .mw {
    display: none;
  }

  .mw .mw_bg {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 103;
    background: #000000;
  }

  .mw .mw_content {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 90px;
    left: 0;
    z-index: 104;
    pointer-events: none;
  }

  .mw .mw_content .mw_inner {
    margin: 0 auto;
    padding: 76px 20px 0 20px;
    max-width: 960px;
    position: relative;
    top: calc(50vh - 360px);
    pointer-events: auto;
  }

  .mw .mw_content .mw_inner a.close {
    padding: 24px;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
  }

  .mw .mw_content .mw_inner a.close span {
    width: 40px;
    height: 40px;
    display: block;
    background: url("../img/btn_close.svg") no-repeat center center/contain;
    text-indent: -9999px;
    transform-style: preserve-3d;
    transition-property: all;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-delay: 0ms;
  }

  .mw .mw_content .mw_inner a.close:hover span {
    transform: scale(1.2);
  }

  .mw .mw_content .mw_inner .mw_video {
    padding-top: 56.25%;
    position: relative;
    width: 100%;
  }

  .mw .mw_content .mw_inner .mw_video iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
  }

  #dylan-menu-0 {
    overflow: hidden;
  }

  body article#main section.teaser {
    padding-top: 0;
  }
  body article#main section.teaser .hero_area {
    position: relative;
    width: 100%;
    max-height: 595px;
    overflow: hidden;
  }
  body article#main section.teaser .hero_area video {
    display: block;
    width: 100%;
    max-width: 1360px;
    margin: 0 auto;
    height: auto;
    position: relative;
  }
  body article#main section.teaser a.yt_mw {
    display: block;
    position: absolute;
    width: 151px;
    height: 151px;
    bottom: 73px;
    left: 50%;
    margin-left: 310px;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  body article#main section.teaser a.yt_mw {
    left: auto;
    margin-left: 0;
    right: 60px;
  }
}
@media screen and (min-width: 769px) {
  body article#main section.teaser a.yt_mw img {
    display: block;
    width: 100%;
    height: auto;
    position: absolute;
  }
  body article#main section.teaser a.yt_mw .on {
    opacity: 0;
    transition: opacity 0.2s ease-out;
  }
  body article#main section.teaser a.yt_mw:hover .on {
    opacity: 1;
  }
  body article#main section.teaser .hero {
    position: absolute;
    margin: 0;
    left: 50%;
    width: 543px;
    margin-left: -272px;
    height: 362px;
    top: 50%;
    margin-top: -181px;
  }
  body article#main section.teaser .pic_area {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    width: calc(1280% / 13.6);
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
    padding: 60px 0;
  }
  body article#main section.teaser .pic_area .pic {
    width: calc(300% / 12.8);
    margin-right: calc(26% / 12.8);
    opacity: 0;
    transform: translateY(100px);
    transform-style: preserve-3d;
    transition-property: transform,opacity;
    transition-duration: 1000ms;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-delay: 0ms;
  }
  body article#main section.teaser .pic_area .pic img {
    display: block;
  }
  body article#main section.teaser .pic_area .pic:nth-child(4n), body article#main section.teaser .pic_area .pic:last-child {
    margin-right: -4px;
  }
  body article#main section.teaser .pic_area .pic:nth-child(n+5) {
    margin-top: calc(60% / 12.8);
  }
  body article#main section.teaser .pic_area .pic.show {
    opacity: 1;
    transform: translateY(0px);
  }
  body article#main section.teaser .cv a {
    margin-bottom: 156px;
  }

  .pc_none {
    display: none !important;
  }
}
