@charset "UTF-8";

/* ==================================================================
  COMMON
================================================================== */
#module-light .pc-none {
  display: none;
}

#module-light .sp-none {
  display: block;
}
#module-light .sp--inline-none {
  display: inline-block;
}

#module-light .m--left {
  text-align: left;
}

#module-light .m--right {
  text-align: right;
}

#module-light .module-base {
  text-align: center;
  word-break: normal;
  line-break: strict;
  line-height: 1.6;
  color: #000;
  font: 1.4em/1.4 "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial, helvetica, sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#module-light .module-base a {
  color: #000;
  outline: none !important;
  -webkit-tap-highlight-color: transparent;
}

#module-light .module-base a:hover {
  outline: none !important;
}

#module-light .module-base img {
  width: 100%;
  height: auto;
}


@media screen and (max-width: 768px) {
  #module-light .module-base {
    margin: 0 auto;
    text-align: center;
    font-size: 13px;
    line-height: 1.7;
  }
  #module-light .pc-none {
    display: block;
  }
  #module-light .sp-none {
    display: none;
  }
  #module-light .sp--inline-none {
    display: none;
  }
  #module-light.prc .header .header_logo a img {
    width: auto;
    height: 47px;
  }
}


/* Menu ________________________*/
#module-light .float-wrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  background: #fff;
  border-top:1px solid #ebebeb;
  border-bottom:1px solid #ebebeb;
}

#module-light .float-wrap {
  display: none;
}

#module-light .float-inner {
  max-width: 1240px;
  width: 100%;
  line-height: 1;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 0 0 0 20px;
}

#module-light .float-inner .float-ttl {
  display: none;
}

#module-light .menu-inner {
  justify-content: center;
  align-items: center;
  webkit-justify-content: space-between;
  justify-content: space-between;
  display: -webkit-flex;
  display: flex;
  height: 40px;
}

#module-light .menu-inner .menu-ttl {
  line-height: 1;
  font-size: 17px;
  letter-spacing: 0.04em;
}

#module-light .menu-inner .menu-ttl a {
  font-weight: 700;
}

#module-light .menu-inner .menu-lead {
  display: none;
}

#module-light .official-list {
  display: none;
}
#module-light .menu-inner .ttl-onlineshop {
  display: none;
}
#module-light .menu-link {
  overflow: hidden;
}

#module-light .menu-link li {
  float: left;
  margin: 0 0 0 20px;
}

#module-light .menu-link li:first-child {
  margin: 0;
}

#module-light .menu-link li a,#module-light .menu-link li.current {
  letter-spacing: 0.02em;
  font-size: 16px;
  opacity: 0.5;
}

#module-light .menu-link li a:hover,#module-light .menu-link li a.current,#module-light .menu-link li.current {
  opacity: 1;
}

@media screen and (max-width: 768px) {
  #module-light .float-wrap {}
  #module-light .float-inner {
    position: relative;
    z-index: 100;
    max-width: 100%;
    height: 40px;
    padding: 0;
    overflow: visible;
  }
  #module-light .float-inner .float-ttl {
    display: block;
    font-size: 16px;
  }
  #module-light .float-inner .float-ttl.m--font-small {
    font-size: 14px;
  }
  #module-light .float-inner .float-ttl a {
  line-height: 40px;
  letter-spacing: 0.04em;
  }
  #module-light .float-box {
    position: absolute;
    top: 11px;
    left: 28px;
    display: block;
  }
  #module-light .menu-trigger {
    position: relative;
    width: 18px;
    height: 16px;
    z-index: 10000;
  }

  #module-light .menu-trigger,
  #module-light .menu-trigger span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box;
  }

  #module-light .menu-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
  }
  #module-light .menu-trigger span:nth-of-type(1) {
    top: 0;
  }
  #module-light .menu-trigger span:nth-of-type(2) {
    top: 7px;
  }
  #module-light .menu-trigger span:nth-of-type(3) {
    bottom: 0;
  }

  #module-light .menu-trigger.active span:nth-of-type(1) {
    -webkit-transform: translateY(20px) rotate(-45deg);
    transform: translateY(5px) rotate(-45deg);
  }
  #module-light .menu-trigger.active span:nth-of-type(2) {
    opacity: 0;
  }
  #module-light .menu-trigger.active span:nth-of-type(3) {
    -webkit-transform: translateY(-20px) rotate(45deg);
    transform: translateY(-9px) rotate(45deg);
  }

  #module-light .menu-body {
    line-height: 1;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    overflow: hidden;
    overflow-y: visible;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
  }
  #module-light .float-menu.active .menu-body {
    visibility: visible;
    opacity: 1;
  }
  #module-light .menu-inner {
    display: block;
    padding: 50px 0 0;
    height: auto;
  }
  #module-light .menu-inner .menu-ttl {
    line-height: 1.5;
    margin: 0 0 20px;
  }
  #module-light .menu-inner .menu-lead {
    display: block;
    line-height: 1.5;
    margin: 0 0 30px;
    font-size: 14px;
  }
  #module-light .menu-link {
    margin: 0 0 35px;
  }
  #module-light .menu-link li {
    float: none;
    margin: 20px 0 0;
  }
  #module-light .menu-link li a,#module-light .menu-link li.current {
    opacity: 1;
    font-size: 20px;
  }
  #module-light .menu-inner .ttl-onlineshop {
    display: block;
    margin: 0 0 30px;
    font-size: 16px;
  }
  #module-light .official-list {
    display: block;
    padding: 0 11.8%;
  }
  #module-light .official-list li {
    position: relative;
    float: none;
    margin: 0 0 20px;
  }
  #module-light .official-list li:last-child {
    margin: 0;
  }
}

@media screen and (max-width: 350px) {
  #module-light .float-inner .float-ttl {
    font-size: 14px;
  }
}

/* footer ________________________*/
#module-light .footer-basic {
  margin: 180px 0 0;
}

#module-light .footer-basic .footer-content {
  padding: 45px 0;
  border-top: 2px solid #000;
}

#module-light .footer-basic .footer-content_ttl {
  line-height: 1.75;
  margin: 0 0 15px;
  font-size: 30px;
  letter-spacing: 0.1em;
}

#module-light .footer-basic .footer-content_lead {
  margin: 0 0 30px;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

#module-light .footer-basic .footer-content_nav {
  text-align: center;
}

#module-light .footer-basic .footer-content_nav li {
  position: relative;
  display: inline-block;
  padding: 0 0 0 80px;
  vertical-align: middle;
}

#module-light .footer-basic .footer-content_nav li:after {
  content: '|';
  position: absolute;
  left: 40px;
  top: 0;
  line-height: 1;
  font-size: 22px;
}

#module-light .footer-basic .footer-content_nav li:first-child:after {
  display: none;
}

#module-light .footer-basic .footer-content_nav li:first-child {
  padding: 0;
}

#module-light .footer-basic .footer-content_nav li a {
  display: block;
  line-height: 1;
  font-size: 22px;
  letter-spacing: 0.06em;
  color: #000;
}

#module-light .footer-basic .brand-info {
  line-height: 1;
  margin: 0 0 25px;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0.015em;
  color: #4f4f4f;
}

#module-light .footer-basic .brand-info span {
  letter-spacing: 0.045em;
  font-size: 11px;
}

#module-light .footer-basic .brand-info .telno, #module-light .footer-basic .brand-info a {
  letter-spacing: 0.045em;
  font-size: 12px;
  color: #4f4f4f;
}

#module-light .footer-basic .brand-info .sp-none {
  display: inline-block;
}

#module-light .footer-basic .staff-block .pre {
  line-height: 1.9;
  font-size: 14px;
  color: #4f4f4f;
}

#module-light .footer-basic .staff-block .pre .sp-none {
  display: inline-block;
}

#module-light .footer-basic .ttl-onlineshop {
  margin: 50px 0 0;
  font-size: 18px;
}

#module-light .footer-basic .brand-link {
  -webkit-justify-content: space-between;
  justify-content: space-between;
  display: -webkit-flex;
  display: flex;
  width: 525px;
  margin: 45px auto 50px;
}

#module-light .footer-basic .brand-link.m--btn-03 {
  width: 800px;
}

#module-light .footer-basic .brand-link.m--btn-04 {
  max-width: 1075px;
  width: 100%;
}

#module-light .footer-basic .brand-link.m--btn-05,
#module-light .footer-basic .brand-link.m--btn-multi {
  justify-content: center;
  flex-wrap: wrap;
  width: 870px;
}

#module-light .footer-basic .brand-link li {
  width: 250px;
}

#module-light .footer-basic .brand-link.m--btn-single li {
  margin: 0 auto;
}

#module-light .footer-basic .brand-link.m--btn-04 li {
  width: 23.3%;
}

#module-light .footer-basic .brand-link.m--btn-05 li:first-child {
  margin: 0 20px 0 165px;
}

#module-light .footer-basic .brand-link.m--btn-05 li:nth-child(2) {
  margin: 0 165px 0 20px;
}

#module-light .footer-basic .brand-link.m--btn-05 li:nth-child(3) {
  margin: 25px 20px 0;
}

#module-light .footer-basic .brand-link.m--btn-05 li:nth-child(n+4) {
  margin: 25px 20px 0;
}

#module-light .footer-basic .brand-link.m--btn-multi li {
  margin: 0 20px;
}

#module-light .footer-basic .brand-link.m--btn-multi li:nth-child(n+4) {
  margin: 25px 20px 0;
}

@media screen and (max-width: 768px) {
  #module-light .footer-basic {
    margin: 90px 0 0;
  }
  #module-light .footer-basic .footer-content {
    margin: 0 0 25px;
    padding: 20px 0 0;
    border-top: 2px solid #000;
  }
  #module-light .footer-basic .footer-content_ttl {
    margin: 0 0 5px;
    font-size: 19px;
    letter-spacing: 0.08em;
  }
  #module-light .footer-basic .footer-content_lead {
    margin: 0 0 20px;
    font-size: 13px;
  }
  #module-light .footer-basic .footer-content_nav {
    background: #ffffff;
  }
  #module-light .footer-basic .footer-content_nav li {
    display: block;
    padding: 0;
    border-bottom: 1px solid #eaeaea;
  }
  #module-light .footer-basic .footer-content_nav li a {
    padding: 17px 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.04em;
  }
  #module-light .footer-basic .footer-content_nav li:after {
    display: none;
  }

  #module-light .footer-basic .footer-content_nav li:first-child {
    border-top: 1px solid #eaeaea;
  }
  #module-light .footer-basic .footer-content_nav li:first-child a:after {
    display: none;
  }
  #module-light .footer-basic .brand-info {
    line-height: 1.8;
    margin: 0 0 20px;
    font-size: 11px;
  }
  #module-light .footer-basic .brand-info .sp-none {
    display: none;
  }
  #module-light .footer-basic .brand-info .telno, #module-light .footer-basic .brand-info a {
    font-size: 11px;
  }
  #module-light .footer-basic .ttl-onlineshop {
    margin: 35px 0 0;
    font-size: 16px;
  }
  #module-light .footer-basic .staff-block {
    padding: 0 5%;
  }
  #module-light .footer-basic .staff-block .pre .sp-none {
    display: inline-block;
  }
  #module-light .footer-basic .brand-link {
    display: block;
    width: 76.5%;
    margin: 35px auto 50px;
  }
  #module-light .footer-basic .brand-link.m--btn-multi {
    display: block;
    width: 90%;
  }
  #module-light .footer-basic .brand-link.m--btn-03 {
    width: 90%;
  }
  #module-light .footer-basic .brand-link.m--btn-04 {
    max-width: 90%;
  }
  #module-light .footer-basic .brand-link.m--btn-05 {
    width: 90%;
  }

  #module-light .footer-basic .brand-link li {
    width: 100%;
    margin: 0 0 20px;
  }
  #module-light .footer-basic .brand-link.m--btn-single li {
    margin: 0 0 15px;
  }
  #module-light .footer-basic .brand-link.m--btn-04 li {
    width: 100%;
    margin: 0 0 15px;
  }
  #module-light .footer-basic .brand-link.m--btn-05 li:first-child {
    margin: 0 0 15px;
  }
  #module-light .footer-basic .brand-link.m--btn-05 li:nth-child(2) {
    margin: 0 0 15px;
  }
  #module-light .footer-basic .brand-link.m--btn-05 li:nth-child(3) {
    margin: 0 0 15px;
  }
  #module-light .footer-basic .brand-link.m--btn-05 li:nth-child(n+4) {
    margin:  0 0 15px;
  }
  #module-light .footer-basic .brand-link.m--btn-multi li {
    margin: 0 0 15px;
  }
  #module-light .footer-basic .brand-link.m--btn-multi li:nth-child(n+4) {
    margin: 0 0 15px;
  }
  #module-light .footer-basic .brand-link.m--btn-multi li:last-child {
    margin: 0;
  }
  #module-light .footer-basic .brand-link li .icon {
    top: 10px;
    right: 8px;
  }
  #module-light .footer-basic .brand-link li .icon:first-child {
    margin: 0;
  }
  #module-light .footer-basic .brand-link li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
  }
  footer {
    position: relative;
  }
}


/* Footer_Share ________________________*/

#module-light .share {
  position: relative;
  padding: 0 0 30px;
  background: #fff;
  margin: 50px 0 0 0 !important;
}

#module-light .share_label {
  display: inline-flex;
  margin: 0 10px;
}

#module-light .share_btn {
  display: inline-block;
  margin: 0 5px 0 5px;
  width: 28px;
  height: 28px;
}

#module-light .share_btn a img {
  width: 100%;
  height: auto;
}


/* clear
=================================================== */

/* float */

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clearfix {
  display: inline-block;
}

/* Hides from IE-mac \*/
.clearfix {
  display: block;
}


/* End hide from IE-mac */

@media only screen and (max-width: 768px) {
  html, body {
    width: 100%;
  }
  body {
    line-height: 1.8;
  }
  #module-light .share {
    padding: 0;
  }
}

footer {
  z-index: 2;
}


/* ---- Slider ---- */

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-track {
  left: 0;
  display: block;
}

.slick-track:before, .slick-track:after {
  display: table;
  content: '';
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
  margin: 0;
}

[dir='rtl'] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/* Icons */
@font-face {
  font-family: 'slick';
  font-weight: normal;
  font-style: normal;
  src: url("./fonts/slick.eot");
  src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
}

/* Arrows */
.slick-prev, .slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
  z-index: 1;
}

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
  color: transparent;
  outline: none;
  background: transparent;
}

.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
  opacity: 1;
}

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
  opacity: .25;
}

.slick-prev:before, .slick-next:before {
  display: block;
  width: 18px;
  height: 35px;
  background: url("https://cf-special-spur.hpplus.jp/spur-special02/module-light/assets/img/slider/icon_arrow_prev.png") no-repeat;
  background-size: 18px 35px;
}

.slick-prev {
  margin: 0 0 0 -11.5%;
}

[dir='rtl'] .slick-prev {
  right: 20%;
  left: auto;
}

.slick-prev:before {
  content: '';
}

[dir='rtl'] .slick-prev:before {
  content: '';
}

.slick-next {
  margin: 0 -11.5% 0 0;
  left: auto;
  right: 50%;
}

[dir='rtl'] .slick-next {
  right: auto;
  left: -25px;
}

.slick-next:before {
  content: '';
  background: url("https://cf-special-spur.hpplus.jp/spur-special02/module-light/assets/img/slider/icon_arrow_next.png") no-repeat;
  background-size: 18px 35px;
}

[dir='rtl'] .slick-next:before {
  content: '';
}


/* Dots */
.slick-dots {
  position: absolute;
  bottom: 0;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  margin: 0 6px;
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 8px;
  height: 8px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
}

.slick-dots li button:hover, .slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before, .slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 10px;
  content: '';
  text-align: center;
  opacity: .25;
  color: black;
  background: #000;
}

.slick-dots li.slick-active button:before {
  opacity: .75;
  color: black;
}

#over {
  position: absolute;
  width: 100%;
  height: 100%;
}



/* ---- TOP ---- */

/* kv
===================================== */
@-webkit-keyframes sdb {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg) translate(-10px, 10px);
    opacity: 0;
  }
}

@keyframes sdb {
  0% {
    transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: rotate(-45deg) translate(-10px, 10px);
    opacity: 0;
  }
}

#module-light .pager-wrap {
  margin: 40px 0 0;
}

#module-light .kv-full {
  position: relative;
  width: 100%;
  background: url("https://cf-special-spur.hpplus.jp/spur-special02/module-light/assets/img/top/kv.jpg") no-repeat center top;
  background-size: cover;
}

#module-light .kv-pr {
  position: absolute;
  top: 27px;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  z-index: 99;
  max-width: 1245px;
  width: 100%;
  line-height: 0;
  text-align: right;
}

#module-light .kv-pr_inner {
  display: inline-block;
  width: 40px;
  line-height: 0;
}

#module-light .kv-box {
  position: absolute;
  bottom: 10%;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  width: 100%;
  margin: 0 auto;
  padding: 0 0 40px;
  z-index: 2;
}

#module-light .kv-spur {
  line-height: 1;
  margin: 0 0 15px;
  letter-spacing: 0.02em;
  font-size: 40px;
  color: #000;
}

#module-light .kv-ttl {
  display: inline-block;
  line-height: 1.3;
  padding: 0 20px;
  letter-spacing: 0.09em;
  font-size: 64px;
  color: #000;
  background: #fff;
  border-bottom: 10px solid #000;
}

#module-light .kv-lead {
  letter-spacing: 0.04em;
  font-size: 32px;
  color: #000;
}

#module-light .kv-lead-inner {
  display: inline-block;
  line-height: 1.5;
  margin: 20px 0 0;
  padding: 0 20px;
  letter-spacing: 0.09em;
  color: #000;
  background: #fff;
  border-bottom: 7px solid #000;
}

#module-light .kv-scroll {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}

#module-light .kv-scroll p {
  line-height: 1;
  letter-spacing: 0.08em;
  font-size: 12px;
  color: #fff;
  text-shadow: 2px 2px 10px #9B8578;
}

#module-light .kv-scroll p:after {
  display: inline-block;
  content: "";
  position: absolute;
  top: 10px;
  left: 50%;
  width: 12px;
  height: 12px;
  margin-left: -6px;
  border-left: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb 2.5s infinite;
  animation: sdb 2.5s infinite;
  box-sizing: border-box;
}

@media screen and (max-width: 768px) {
  #module-light .pager-wrap {
    margin:0;
  }
  #module-light .kv-full {
    background: none;
  }
  #module-light .kv-pr {
    top: 12px;
    max-width: 100%;
  }
  #module-light .kv-pr_inner {
    /*width: 30px;*/
    margin: 0 10px 0 0;
  }
  #module-light .kv-spur {
    display: none;
  }
  #module-light .kv-box {
    display: none;
  }
  #module-light .kv-ttl {
    margin: 0 0 25px;
    letter-spacing: 0.08em;
    font-size: 28px;
  }
  #module-light .kv-lead {
    letter-spacing: 0.16em;
    font-size: 21px;
  }
  #module-light .kv-scroll p {
    font-weight: 700;
  }
}


/* kv-sp
===================================== */
#module-light .kv-sp {
  display: none;
}

@media screen and (max-width: 768px) {
  #module-light .kv .kv-full.sp-slider {
    background: none;
  }

  #module-light .kv-sp {
    display: block;
    line-height: 0;
  }

  #module-light .kv-sp--slide .slide-01 {
  background: url(../img/top/kv_sp_slide_01.jpg) no-repeat center top;
  background-size: cover;
  }

  #module-light .kv-sp--slide .slide-02 {
  background: url(../img/top/kv_sp_slide_02.jpg) no-repeat center top;
  background-size: cover;
  }

  #module-light .kv-sp--slide .slide-03 {
  background: url(../img/top/kv_sp_slide_03.jpg) no-repeat center top;
  background-size: cover;
  }

  #module-light .kv-sp--slide .slide-04 {
  background: url(../img/top/kv_sp_slide_04.jpg) no-repeat center top;
  background-size: cover;
  }

  #module-light .kv-sp--slide .slide-05 {
  background: url(../img/top/kv_sp_slide_05.jpg) no-repeat center top;
  background-size: cover;
  }
}


/* kv-short
===================================== */
#module-light .kv-short {
  width: 100%;
}

#module-light .kv-short--inner {
  position: relative;
}

#module-light .kv-short--img {
  line-height: 0;
}

#module-light .kv-short--kv {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 75%;
  margin: 0 auto;
  background: url("https://cf-special-spur.hpplus.jp/spur-special02/module-light/assets/img/top/kv_short_01.jpg") no-repeat center top;
  background-size: cover;
}

#module-light .kv-short--box {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 25%;
  margin: 0 auto;
  background: #fff;
  box-sizing: border-box;
}

#module-light .kv-short--box_inner {
  position: relative;
  height: 100%;
}

#module-light .kv-short--block {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
}

#module-light .kv-short--ttl {
  line-height: 1.75;
  margin: 0 0 15px;
  font-size: 54px;
  letter-spacing: 0.08em;
}

#module-light .kv-short--lead {
  margin: 0 0 20px;
  font-size: 24px;
  font-weight: bold;
}

#module-light .kv-short--scroll {
  position: relative;
}

#module-light .kv-short--scroll:after {
  display: inline-block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  border-left: 1px solid #000000;
  border-bottom: 1px solid #000000;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb 2.5s infinite;
  animation: sdb 2.5s infinite;
  box-sizing: border-box;
}

#module-light .kv-short--text {
  width: 750px;
  line-height: 2;
  margin: 100px auto 0;
  font-size: 15px;
  letter-spacing: 0.04em;
}

@media screen and (max-width: 1000px) {
  #module-light .kv-short--kv {
    background: url("https://cf-special-spur.hpplus.jp/spur-special02/module-light/assets/img/top/kv_short_02.jpg") no-repeat center top;
    background-size: cover;
  }
}

@media screen and (max-width: 768px) {
  #module-light .kv-short--inner {
    background: none;
  }

  #module-light .kv-short--img {
    margin: 0;
  }

  #module-light .kv-short--kv {
    display: none;
    background: none;
  }

  #module-light .kv-short--box {
  position: static;
  height: 100%;
  padding: 25px 0;
  }

  #module-light .kv-short--box_inner {
    padding: 0;
  }

  #module-light .kv-short--block {
    position: static;
    transform: none;
  }

  #module-light .kv-short--ttl {
    margin: 0 0 5px;
    font-size: 28px;
  }

  #module-light .kv-short--lead {
    line-height: 1.6;
    margin: 0;
    font-size: 17px;
    letter-spacing: 0.04em;
  }

  #module-light .kv-short--text {
    width: 90%;
    margin: 0 auto;
    text-align: left;
    font-size: 14px;
    letter-spacing: 0.02em;
  }
  #module-light .kv-short--scroll {
    display: none;
  }
  #module-light .kv-short--scroll:after {
    top: 5px;
  }
}


/* kv-half
===================================== */
@-webkit-keyframes sdb-h {
  0% {
    -webkit-transform: translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform:  translate(0, 20px);
    opacity: 0;
  }
}

@keyframes sdb-h {
  0% {
    transform:  translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform:  translate(0, 20px);
    opacity: 0;
  }
}

#module-light .kv-half {
  overflow: hidden;
  position: relative;
}

#module-light .kv-half--inner {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 100%;
}

#module-light .kv-half--box, #module-light .kv-half--sp-box {
  width: 50%;
}

#module-light .kv-half--box {
  text-align: left;
  box-sizing: border-box;
  padding: 9vh 0 0 6vh;
}

#module-light .kv-half--box_inner {
  max-width: 500px;
  width: 100%;
}

#module-light .kv-half--copy {
  line-height: 1;
  margin: 0 0 20px;
  font-size: 35px;
  letter-spacing: 0.06em;
}

#module-light .kv-half--ttl {
  line-height: 1.25;
  margin: 0 0 25px;
  font-size: 60px;
  letter-spacing: 0.06em;
  word-wrap:break-word;
  font-feature-settings: "palt";
}

#module-light .kv-half--lead {
  margin: 0 0 70px;
  line-height: 1.6;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

#module-light .kv-half--text {
  line-height: 2;
  font-size: 15px;
  letter-spacing: 0.04em;
}

#module-light .kv-half--scroll {
  line-height: 1;
  margin: 50px 0 0;
}

#module-light .kv-half--scroll p {
  display: inline-block;
  writing-mode: tb-rl;
  writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  margin: 0 0 0 5px;
  font-size: 15px;
  letter-spacing: 0.1em;
  font-weight: 700;
}

#module-light .kv-half--scroll .scroll-box {
  display: inline-block;
  vertical-align: top;
}

#module-light .kv-half--scroll svg {
  animation: sdb-h 2.5s infinite;
  width: 10px;
}

#module-light .kv-half--scroll .scroll-point {
  fill:none;stroke:#4F4F4F;
  stroke-miterlimit:10;
}

#module-light .scroll-arrow {
  width: 2px;
  height: 100px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

#module-light .scroll-arrow::before {
  content: '';
  width: 2px;
  height: 100px;
  margin: 50px auto 0;
  background-color: #000;
  position: absolute;
  top: -150px;
  left: 0;
  -webkit-animation: arrow 2.5s ease 0s infinite normal;
  animation: arrow 2.5s ease 0s infinite normal;
}

@keyframes arrow {
  0% {
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0);
  }

  60% {
    -webkit-transform: translate3d(-50%, 100px, 0);
    transform: translate3d(-50%, 100px, 0);
  }

  100% {
    -webkit-transform: translate3d(-50%, 100px, 0);
    transform: translate3d(-50%, 100px, 0);
  }
}


#module-light .kv-half--sp-block {
  display: none;
}

#module-light .m--kv-half_bg {
  height: 100%;
  background: url(https://s3-ap-northeast-1.amazonaws.com/cf.hpplus.jp/01_shueisha/more/module/asset/img/top/kv_half.jpg) no-repeat center center;
  background-size: cover;
}

#module-light .kv-half.m--square .m--kv-half_bg {
  background: url(../img/top/kv_half_square.jpg) no-repeat center center;
  background-size: cover;
}

@media screen and (max-width: 768px) {
  #module-light .kv-half {}

  #module-light .kv-half--inner {
    display: block;
    width: 100%;
  }

  #module-light .kv-half--sp-box {
    position: relative;
    width: 100%;
    background: none;
  }

  #module-light .kv-half--sp-box.sp-slider {
    background: none;
  }

  #module-light .kv-half--box,
  #module-light .kv-half--img {
    width: 100%;
  }

  #module-light .m--square .kv-half--img {
    opacity: 0;
    line-height: 0;
    -webkit-transition: all 1.8s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all 1.8s cubic-bezier(0.77, 0, 0.175, 1);
  }

  #module-light .m--square .kv-half--img.active {
     opacity: 1;
  }

  #module-light .kv-half--box {
    display: none;
    width: 90%;
    text-align: left;
    box-sizing: border-box;
    margin: 90px auto 0;
    padding: 0;
  }

  #module-light .kv-half--box_inner {
    width: 100%;
  }

  #module-light .kv-half--ttl {
    line-height: 1.75;
    margin: 0 0 10px;
    font-size: 28px;
    text-align: center;
    font-feature-settings: "palt";
  }

  #module-light .kv-half--lead {
    margin: 0 0 20px;
    text-align: center;
    font-size: 14px;
  }

  #module-light .kv-half--text {
    font-size: 14px;
    letter-spacing: 0.02em;
  }

  #module-light .kv-half--scroll {
    display: none;
  }
  #module-light .kv-half--sp-block {
    display: block;
    width: 100%;
    height: 100%;
    line-height: 0;
    z-index: 1;
  }
  #module-light .kv-half--sp-ttl {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    color: #fff;
    letter-spacing: 0.08em;
    font-size: 28px;
    text-shadow: 2px 2px 10px #9B8578;
    z-index: 1;
  }
  #module-light .kv-half--sp-ttl span {
    display: inline-block;
    line-height: 1.85;
    margin: 10px 0 0;
    font-size: 15px;
    font-weight: bold;
  }
  #module-light .kv-half--sp-scroll {
    position: absolute;
    bottom: 45px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    z-index: 1;
  }
  #module-light .kv-half--sp-scroll p {
    position: relative;
    line-height: 1;
    letter-spacing: 0.08em;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    text-shadow: 2px 2px 10px #9B8578;
  }
  #module-light .kv-half--sp-scroll p span {
    display: block;
    position: absolute;
    top: 25px;
    left: 50%;
    width: 1px;
    height: 35px;
    background-color: #fff;
    pointer-events: none;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation: scroll-bar 2.5s cubic-bezier(0.075, 0.82, 0.165, 1) infinite forwards;
    animation: scroll-bar 2.5s cubic-bezier(0.075, 0.82, 0.165, 1) infinite forwards;
  }
  @-webkit-keyframes scroll-bar { 0% { -webkit-transform-origin: top left; transform-origin: top left;
      -webkit-transform: scaleY(0);
              transform: scaleY(0); }
    50% { -webkit-transform-origin: top left; transform-origin: top left;
      -webkit-transform: scaleY(1);
              transform: scaleY(1); }
    75% { -webkit-transform-origin: bottom left; transform-origin: bottom left;
      -webkit-transform: scaleY(1);
              transform: scaleY(1); }
    100% { -webkit-transform-origin: bottom left; transform-origin: bottom left;
      -webkit-transform: scaleY(0);
              transform: scaleY(0); }
    }
  @keyframes scroll-bar { 0% {
      -webkit-transform-origin: top left; transform-origin: top left;
      -webkit-transform: scaleY(0);
              transform: scaleY(0); }
    50% { -webkit-transform-origin: top left; transform-origin: top left;
      -webkit-transform: scaleY(1);
              transform: scaleY(1); }
    75% { -webkit-transform-origin: bottom left; transform-origin: bottom left;
      -webkit-transform: scaleY(1);
              transform: scaleY(1); }
    100% { -webkit-transform-origin: bottom left; transform-origin: bottom left;
      -webkit-transform: scaleY(0);
              transform: scaleY(0); }
    }

  #module-light .kv-sp--slide.kv-sp-half .slide-01 {
  background: url(../img/top/kv_half_sp_slide_01.jpg) no-repeat center top;
  background-size: cover;
  }

  #module-light .kv-sp--slide.kv-sp-half .slide-02 {
  background: url(../img/top/kv_half_sp_slide_02.jpg) no-repeat center top;
  background-size: cover;
  }

  #module-light .kv-sp--slide.kv-sp-half .slide-03 {
  background: url(../img/top/kv_half_sp_slide_03.jpg) no-repeat center top;
  background-size: cover;
  }

  #module-light .kv-sp--slide.kv-sp-half .slide-04 {
  background: url(../img/top/kv_half_sp_slide_04.jpg) no-repeat center top;
  background-size: cover;
  }

  #module-light .kv-sp--slide.kv-sp-half .slide-05 {
  background: url(../img/top/kv_half_sp_slide_05.jpg) no-repeat center top;
  background-size: cover;
  }
}

/* kv-movie
===================================== */
#module-light .kv-movie {
  position: relative;
}
#module-light .kv-video {
  height: 100%;
}

@media screen and (max-width: 768px) {
  #module-light .kv-video {
    width: auto;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: auto;
  }
}

/* kv-half--movie
===================================== */
#module-light .kv-half--video .kv-video {
  max-width: 800px;
  min-width: 620px;
/*  width: auto;*/
  height: auto;
  width: 100%;
}
#module-light .kv-half--box.m--movie {
  position: relative;
  padding: 100px 0 0 3%;
}

#module-light .kv-half--box.m--movie .kv-half--box_inner {
  max-width: 500px;
  width: 100%;
}


#module-light .kv-half--video {
    text-align: right;
}

#module-light.kv-half--box.m--movie .kv-half--box_inner {
    max-width: 500px;
    width: 100%;
}

@media screen and (max-width: 1500px) {
  #module-light .kv-half--video .kv-video {
   height: auto;
  }
}

@media screen and (max-width: 768px) {
  #module-light .kv-half--box.m--movie {
    padding: 0;
  }

  #module-light .kv-half--sp-box.m--movie {
    overflow: hidden;
    background: none;
  }
  #module-light .kv-half--video {
    position: absolute;
    width: 100%;
  }
  #module-light .kv-half--video .kv-video {
    max-width: none;
    min-width: 100%;
    width: auto;
    height: 100%;
  }
}

/* lead
===================================== */
.lead {
  margin: 90px 0 0;
}

.lead-inner {
  width: 750px;
  margin: 0 auto;
}

.lead-ttl {
  line-height: 1.75;
  margin: 0 0 40px;
  font-size: 36px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.lead-ttl.m--border {
  display: inline-block;
}

.lead-ttl.m--border:after {
  display: block;
  content: "";
  width: 1.5em;
  margin: 0 auto;
  padding-top: 5px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

.lead-subttl {
  display: none;
}

.lead-text {
  line-height: 2;
  font-size: 15px;
  color: #020202;
}

@media screen and (max-width: 768px) {
  .lead {
    margin: 25px 0 0;
  }
  .lead-inner {
    width: 90%;
  }
  .lead-ttl {
    line-height: 1.5;
    margin: 0 0 25px;
    font-size: 28px;
  }
  .lead-subttl {
    margin: 0 0 20px;
    letter-spacing: 0.1em;
    font-weight: bold;
    display: block;
    font-size: 14px;
  }
  .lead-text {
    line-height: 1.7;
    font-size: 14px;
    text-align: left;
  }
}


/* ---- STYLE ---- */

#module-light .style-wrap {
  margin: 100px 0 0;
  padding: 100px 0;
  background: #efefef;
}

@media screen and (max-width: 768px) {
  #module-light .style-wrap {
    margin: 50px 0 0;
    padding: 0 0 80px;
  }
}


/* style-lw-01
===================================== */
#module-light .style-lw-01 {
  width: 100%;
  margin: 0;
}

#module-light .style-lw-01 .style-inner {
  display: -webkit-flex;
  display: flex;
  max-width: 1800px;
  width: 100%;
  margin: 0 auto;
}

#module-light .style-lw-01 .style-img {
  max-width: 50%;
  width: 100%;
}

#module-light .style-lw-01 .style-box {
  max-width: 50%;
  width: 100%;
}

#module-light .style-lw-01 .style-box_inner {
  max-width: 560px;
  width: 100%;
  padding: 0 0 0 3vw;
  box-sizing: border-box;
  text-align: left;
}

@media screen and (max-width: 768px) {
  #module-light .style-lw-01 {
    margin: 60px 0 0;
  }
  #module-light .style-lw-01 .style-inner {
    display: block;
    max-width: 100%;
  }
  #module-light .style-lw-01 .style-img {
    max-width: 100%;
    width: 100%;
    line-height: 0;
  }

  #module-light .style-lw-01 .style-box {
    max-width: 90%;
    width: 100%;
    margin: 0 auto;
    padding: 25px 0 0 0;
  }
  #module-light .style-lw-01 .style-box_inner {
    max-width: 100%;
    padding: 0;
  }
}

/* style-rw-02
===================================== */
#module-light .style-rw-02 {
  width: 100%;
  margin: 100px 0 0;
}

#module-light .style-rw-02 .style-inner {
  display: -webkit-flex;
  display: flex;
  flex-direction: row-reverse;
  max-width: 1800px;
  width: 100%;
  margin: 0 auto;
}

#module-light .style-rw-02 .style-img {
  max-width: 50%;
  width: 100%;
  line-height: 0;
}

#module-light .style-rw-02 .style-box {
  width: 50%;
  text-align: right;
}

#module-light .style-rw-02 .style-box_inner {
  display: inline-block;
  max-width: 560px;
  width: 100%;
  padding: 0 3vw 0 0;
  box-sizing: border-box;
  text-align: left;
}

@media screen and (max-width: 768px) {
  #module-light .style-rw-02 {
    margin: 80px 0 0;
  }
  #module-light .style-rw-02 .style-inner {
    display: block;
    max-width: 100%;
    padding: 0;
  }
  #module-light .style-rw-02 .style-img {
    max-width: 100%;
    width: 100%;
    padding: 0;
    box-sizing: border-box;
  }

  #module-light .style-rw-02 .style-box {
    width: 90%;
    text-align: left;
    margin: 25px auto 0;
  }

  #module-light .style-rw-02 .style-box_inner {
    display: block;
    max-width: 100%;
    padding: 0;
  }
}

/* style-lw-03
===================================== */
#module-light .style-lw-03 {
  width: 100%;
  margin: 100px 0 0;
}

#module-light .style-lw-01.m--3rd {
  margin: 100px 0 0;
}

#module-light .style-lw-03 .style-inner {
  display: -webkit-flex;
  display: flex;
  justify-content: flex-end;
  max-width: 1800px;
  width: 100%;
  margin: 0 auto;
  text-align: left;
}

#module-light .style-lw-03 .style-img {
  width: 44%;
  line-height: 0;
}

#module-light .style-lw-03 .style-box {
  width: 46%;
}

#module-light .style-lw-03 .style-box_inner {
  max-width: 560px;
  width: 100%;
  padding: 0 0 0 3vw;
  box-sizing: border-box;
}

@media screen and (max-width: 768px) {
  #module-light .style-lw-03 {
    margin: 80px 0 0;
  }

  #module-light .style-lw-01.m--3rd {
    margin: 80px 0 0;
  }

  #module-light .style-lw-03 .style-inner {
    display: block;
    max-width: 100%;
    padding: 0;
  }
  #module-light .style-lw-03 .style-img {
    width: 100%;
    padding: 0;
  }
  #module-light .style-lw-03 .style-img p {
    line-height: 0;
  }
  #module-light .style-lw-03 .style-box {
    width: 90%;
    margin: 0 auto;
    padding: 25px 0 0;
    box-sizing: border-box;
  }
  #module-light .style-lw-03 .style-box_inner {
    max-width: 100%;
    padding: 0;
  }
}


/* movie
===================================== */
#module-light .movie {
  margin: 100px 0 0;
  padding: 75px 0 0;
}

#module-light .movie-ttl {
  display: inline-block;
/*  margin: 0px 0 35px;*/
  font-size: 34px;
}

#module-light .movie-ttl:after {
  display: block;
  content: "";
  width: 1em;
  margin: 0 auto;
  padding-top: 15px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

#module-light .movie-text {
  width: 750px;
  margin: 35px auto 0;
/*  margin: 0 auto 55px;*/
  font-size: 14px;
}

#module-light .movie-box {
  max-width: 1000px;
  width: 100%;
  margin: 55px auto 0;
}

#module-light .movie-inner {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

#module-light .movie-inner.m--square-01,
#module-light .movie-inner.m--square {
  width: 65%;
  margin: 0 auto;
  padding-top: 65%;
}

#module-light .movie-inner.m--vertical {
  width: 52%;
  margin: 0 auto;
  padding-top: 69.3%;
}

#module-light .movie-inner iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#module-light .movie-btn {
  width: 320px;
  margin: 45px auto 0;
}

@media screen and (max-width: 768px) {
  #module-light .movie {
    margin: 55px 0 0;
    padding: 50px 0 0;
  }
  #module-light .movie-ttl {
    font-size: 28px;
  }
  #module-light .movie-text {
    width: 90%;
    margin: 20px auto 0;
    text-align: left;
    font-size: 14px;
  }
  #module-light .movie-box {
    max-width: 100%;
    margin: 35px 0 0;
  }
  #module-light .movie-inner.m--square-01,
  #module-light .movie-inner.m--square {
    width: 80%;
    padding-top: 80%;
  }
  #module-light .movie-inner.m--vertical {
    width: 70%;
    padding-top: 93.34%;
  }
  #module-light .movie-btn {
    width: 76.5%;
    margin: 30px auto 0;
  }
}

/* TOP item default
===================================== */
#module-light .item-block {
  margin: 90px 0 0;
  padding: 30px 0 0;
}

#module-light .item-block .item-ttl {
  display: inline-block;
  font-size: 34px;
}

#module-light .item-block .item-ttl:after {
  display: block;
  content: "";
  width: 1em;
  margin: 0 auto;
  padding-top: 15px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

#module-light .item-block .item-text {
  width: 750px;
  margin: 35px auto 0;
/*  margin: 0 auto 55px;*/
}

#module-light .item-block .item-box_list {
  webkit-justify-content: center;
  justify-content: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  margin: 55px auto 0;
  padding: 0 15px;
}

#module-light .item-block .item-box_list li {
  width: 25%;
  margin: 0 0 3%;
  padding: 0 1.5%;
}

#module-light .item-block .item-box_list li a {
  position: relative;
  display: block;
  line-height: 0;
}

#module-light .item-block .item-box_list li a:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  /* -webkit-transform: translate(-50%, -50%); */
  /* transform: translate(-50%, -50%); */
  z-index: 1;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  border: 1px solid #000;
}

/*#module-light .item-block .item-box_list li a:after {
  content: '';
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
   -webkit-transform: translate(-50%, -50%); 
   transform: translate(-50%, -50%); 
  z-index: 1;
  width: 2em;
  height: 2em;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
}*/


#module-light .item-block .item-box_list li a:hover {
  opacity: 1;
}

#module-light .item-block .item-btn {
  width: 300px;
  margin: 0 auto;
}

@media screen and (max-width: 768px) {
  #module-light .item-block {
    margin: 60px 0 0;
  }
  #module-light .item-block .item-ttl {
    font-size: 26px;
  }
  #module-light .item-block .item-text {
    width: 90%;
    margin: 20px auto 0;
    text-align: left;
  }
  #module-light .item-block .item-box_list {
    webkit-justify-content: space-between;
    justify-content: space-between;
    margin: 30px auto 0;
    padding: 0 5%;
  }
  #module-light .item-block .item-box_list li {
    width: 47%;
    margin: 0 0 7%;
    padding: 0;
  }
  #module-light .item-block .item-box_list li a {}
  #module-light .item-block .item-box_list li a:hover {
    opacity: 1;
  }
  #module-light .item-block .item-box_list li a:hover:before {
    background: rgba(126, 97, 77, 0.4);
  }

  #module-light .item-block .item-btn {
    width: 90%;
    margin: 0 auto;
  }
}

/* item-2c
===================================== */
#module-light .item-2c .item-box_list {
  justify-content: center;
  padding: 0 0 45px;
}

@media screen and (max-width: 768px) {
  #module-light .item-2c .item-box_list {
    justify-content: start;
    padding: 0 0 40px;
  }
}

/* item-3c
===================================== */
#module-light .item-3c .item-box_list {
  justify-content: center;
  padding: 0 0 45px;
}

@media screen and (max-width: 768px) {
  #module-light .item-3c .item-box_list {
    justify-content: start;
    padding: 0 0 40px;
  }
}


/* item-4c
===================================== */
#module-light .item-4c .item-box_list {
  padding: 0 0 45px;
}

@media screen and (max-width: 768px) {
  #module-light .item-4c .item-box_list {
    padding: 0 0 40px;
  }
}


/* item-5c
===================================== */
#module-light .item-5c .item-box_list {
  padding: 0 0 45px;
}

#module-light .item-5c .item-box_list li {
  width: 20%;
}

@media screen and (max-width: 768px) {
  #module-light .item-5c .item-box_list {
    padding: 0 0 40px;
  }
  #module-light .item-5c .item-box_list li {
    width: 50%;
  }
}


/* item-6c
===================================== */
#module-light .item-6c .item-box_list {
  justify-content: center;
  padding: 0 0 45px;
  width: 75%;
  margin: 55px auto 0;
}

#module-light .item-6c .item-box_list li {
  width: 33.3333%;
}

@media screen and (max-width: 768px) {
  #module-light .item-6c .item-box_list {
    webkit-justify-content: space-between;
    justify-content: space-between;
    width: 100%;
    margin: 30px auto 0;
    padding: 0 5%;
    box-sizing: border-box;
  }
  #module-light .item-6c .item-box_list li {
    width: 48%;
  }
}


/* item-7c
===================================== */
#module-light .item-7c .item-box_list {
  justify-content: center;
  padding: 0 0 45px;
}

@media screen and (max-width: 768px) {
  #module-light .item-7c .item-box_list {
    justify-content: start;
    padding: 0 0 40px;
  }
}


/* item-8c
===================================== */
#module-light .item-8c .item-box_list {
  padding: 0 15px 0;
}

@media screen and (max-width: 768px) {
  #module-light .item-8c .item-box_list {
    padding: 0 5%;
  }
}


/* item-modal
===================================== */
#module-light .modal-items {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.96);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  overflow-y: scroll;
  z-index: 101;
}
_:-ms-lang(x), #module-light .modal-items {
  z-index: -1;
}

#module-light .modal-items.active {
  opacity: 1;
  pointer-events: all;
}
_:-ms-lang(x), #module-light .modal-items.active {
  z-index: 101;
}

#module-light .modal-items .modal-inner {
  width: 800px;
  position: absolute;
  left: 50%;
  top: 30px;
  margin-left: -400px;
}

#module-light .modal-items .modal-list {
  margin-bottom: 77px;
}

#module-light .modal-items .modal-list .slick-arrow {
  position: absolute;
  z-index: 10;
  font-size: 0;
  cursor: pointer;
}

#module-light .modal-items .modal-list .slick-arrow.slick-prev {
    top: 290px;
    left: 70px;
    margin: 0;
}

#module-light .modal-items .modal-list .slick-arrow.slick-next {
    top: 290px;
    right: 70px;
    left: auto;
    margin: 0;
}

#module-light .modal-items .btn-close {
  position: absolute;
  right: 0;
  top: 45px;
  width: 29px;
  height: 29px;
  cursor: pointer;
  z-index: 1000;
  background: url("https://cf-special-spur.hpplus.jp/spur-special02/module-light/assets/img/slider/btn_close.png") no-repeat;
  background-size: 29px 29px;
}

#module-light .modal-head {
  width: 450px;
  margin: 40px auto 45px;
}

#module-light .modal-head_caption {
  display: inline-block;
  line-height: 1;
  margin: 0 0 35px;
  padding: 0 0 10px;
  font-size: 28px;
  letter-spacing: 0.08em;
  font-weight: 700;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

#module-light .modal-block {
  width: 450px;
  margin: 0 auto;
}

#module-light .modal-head_img {
  border: 1px solid #000;
}

#module-light .modal-ttl {
  display: inline-block;
  line-height: 1.8;
  font-size: 14px;
  font-weight: bold;
  color: #3a3a3a;
}

#module-light .modal-ttl:after {
  display: block;
  content: "";
  width: 3em;
  margin: 0 auto;
  padding-top: 10px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

#module-light .modal-text {
  line-height: 1.66;
  margin: 25px 0 0;
  text-align: left;
  font-size: 13px;
}

#module-light .modal-credit {
  line-height: 1.66;
  margin: 10px 0 0;
  text-align: left;
  font-size: 12px;
  color: #999999;
}

#module-light .modal-items .slick-dots {
  bottom: auto;
  top: 500px;
  line-height: 1;
}

#module-light .modal-items .slick-dots li button:before {
  border-radius: 50%;
}
#module-light .modal-items .slick-dots li button:before {
  display: inline-block;
  position: absolute;
  top: 0px;
  left: 0;
  width: 8px;
  height: 8px;
  content: '';
  background: #3a3a3a;
  opacity: .2;
}
#module-light .modal-items .slick-dots li.slick-active button:before {
  opacity: .5;
}
#module-light .modal-link {
  width: 320px;
  margin: 30px auto 0;
}
#module-light .modal-items .slick-counter {
  position: absolute;
  top: 530px;
  right: 0;
  left: 0;
  font-size: 17px;
}

@media screen and (max-width: 768px) {
  #module-light .modal-items {
    top: 0;
    overflow-x: hidden;
    border-top: 1px solid #e4e3e2;
  }
  #module-light .modal-items .modal-inner {
    position: static;
    width: 100%;
    margin: 14% auto 0;
    padding: 0 5%;
    box-sizing: border-box;
  }
  #module-light .modal-items .modal-list {
    width: 100%;
    margin: 0 auto;
    padding: 0 0 50px;
  }
  #module-light .modal-items .modal-list .slick-arrow {}
  #module-light .modal-items .modal-list .slick-arrow.slick-prev {
  top: 180px;
  left: -4px;
  width: 18px;
  height: 35px;
  }
  #module-light .modal-items .modal-list .slick-arrow.slick-next {
  top: 180px;
  right: -4px;
  width: 18px;
  height: 35px;
  }
  #module-light .modal-items .modal-list .slick-slide{
    padding: 0 0 30px;
  }
  #module-light .modal-items .btn-close {
    right: 4%;
    top: 9%;
  }
  #module-light .modal-head {
    width: 100%;
    margin: 45px auto 55px;
  }

  #module-light .modal-head_caption {
    margin: 0 0 20px;
    padding: 0 0 10px;
    font-size: 20px;
  }

  #module-light .modal-block {
    width: 100%;
  }
  #module-light .modal-head_img {
    width: 270px;
    margin: 0 auto;
  }
  #module-light .modal-items .slick-dots {
    top: 330px;
  }
  #module-light .modal-items .slick-dots li {
    position: relative;
    display: inline-block;
    margin: 0 5px;
    padding: 0;
    width: auto;
    height: auto;
    cursor: pointer;
  }
  #module-light .modal-items .slick-dots li button:before {
    border-radius: 50%;
  }
  #module-light .modal-items .slick-dots li button:before {
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 0;
    width: 6px;
    height: 6px;
    content: '';
    background: #3a3a3a;
    opacity: .2;
  }
  #module-light .modal-items .slick-dots li.slick-active button:before {
    opacity: .5;
  }
  #module-light .modal-link {
    width: 80%;
  }
  #module-light .modal-items .slick-counter {
    top: 326px;
    font-size: 15px;
  }
}

@media screen and (max-width: 350px) {
  #module-light .modal-items .modal-list .slick-arrow.slick-prev {
    left: -15px;
  }
  #module-light .modal-items .modal-list .slick-arrow.slick-next {
    right: -15px;
  }
}

/* item-slide
===================================== */

#module-light .item-slide {
  margin: 175px 0 0;
  padding: 30px 0 0;
}

@-webkit-keyframes open {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes open {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes close {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes close {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

#module-light .item-slide .item-ttl {
  margin: 0 0 35px;
}

#module-light .item-slide .item-text {
  width: 750px;
  margin: 0 auto 55px;
}

#module-light .item-slide .item-slider {
  margin: 0 auto 65px;
}

#module-light .item-slide .slick-slide .item-slider_img {
  -webkit-transform: scale(0.7);
  transform: scale(0.7);
  opacity: 0.3;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

#module-light .item-slide .slick-center.slick-slide .item-slider_img {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

#module-light .item-slide .slick-initialized .slick-slide {
  font-weight: normal;
  vertical-align: middle;
}

#module-light .item-slide .item-info_block {
  opacity: 0;
  width: 445px;
  margin: 0 auto;
  animation-delay: 0.5s;
  animation-duration: 1.0s;
  animation-fill-mode: both;
  -webkit-animation-delay: 0.5s;
  -webkit-animation-duration: 1.0s;
  -webkit-animation-fill-mode: both;
}

#module-light .item-slide .item-info_ttl {
  margin: 0 0 25px;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.04em;
}

#module-light .item-slide .item-info_credit {
  font-size: 12px;
}

#module-light .item-slide .item-info_text {
  margin: 0 0 25px;
  font-size: 14px;
  letter-spacing: 0.04em;
}

#module-light .item-slide .item-info_btn {
  width: 300px;
  margin: 35px auto 0;
}

#module-light .item-slide .item-info .slick-active .item-info_block {
  animation-name: open;
  -webkit-animation-name: open;
}

#module-light .item-slide .slick-dots {
  bottom: -35px;
  line-height: 1;
}
#module-light .item-slide .slick-dots li {
  position: relative;
  display: inline-block;
  margin: 0 5px;
  padding: 0;
  width: auto;
  height: auto;
  cursor: pointer;
}
#module-light .item-slide .slick-dots li button:before {
  border-radius: 50%;
}
#module-light .item-slide .slick-dots li button:before {
  display: inline-block;
  position: absolute;
  top: 0px;
  left: 0;
  width: 6px;
  height: 6px;
  content: '';
  background: #3a3a3a;
  opacity: .2;
}
#module-light .item-slide .slick-dots li.slick-active button:before {
  opacity: .5;
}
#module-light .item-slide .slick-counter {
  position: absolute;
  bottom: -40px;
  right: 0;
  left: 0;
  font-size: 18px;
}

@media screen and (max-width: 768px) {
  .is-pc {
    display: none;
  }
  #module-light .item-slide {
    margin: 75px 0 0;
  }
  #module-light .item-slide .item-ttl {
    margin: 0 0 20px;
  }
  #module-light .item-slide .item-text {
    width: 90%;
    margin: 0 auto 55px;
  }

  #module-light .item-slide .item-slider-wrap {}

  #module-light .item-slide .item-slider {
    width: 100%;
    margin: 0 auto 55px;
  }

  #module-light .item-slide .slick-slide .item-slider_img {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    width: 65%;
    margin: 0 auto;
  }
  #module-light .item-slide .slick-center.slick-slide .item-slider_img {
  }
  #module-light .item-slide .slick-initialized .slick-slide {
    margin: 0;
  }
  #module-light .item-slide .item-info_block {
    opacity: 0;
    width: 100%;
    margin: 0 auto;
    padding: 0 5%;
    box-sizing: border-box;
  }
  #module-light .item-slide .item-info_ttl {
  margin: 0 0 20px;
  font-size: 14px;
  letter-spacing: 0.16em;
  }
  #module-light .item-slide .item-info_credit {
    margin: 0px 0 30px;
    font-size: 11px;
    text-align: left;
  }
  #module-light .item-slide .item-info_text {
  margin: 0 0 15px;
  text-align: left;
  font-size: 12px;
  }
  #module-light .item-slide .item-info_btn {
    width: 100%;
    margin: 0 auto;
  }
  #module-light .item-slide .item-info .slick-active .item-info_block {
    padding: 0 5%;
    box-sizing: border-box;
  }

  #module-light .item-slide .slick-prev {
    margin: 0;
    left: 5%;
    width: 18px;
    height: 35px;
  }
  #module-light .item-slide .slick-next {
    margin: 0;
    right: 5%;
    width: 18px;
    height: 35px;
  }
  #module-light .item-slide .slick-counter {
    bottom: -35px;
    font-size: 16px;
  }
}


/* interview
===================================== */
#module-light .interview {
  margin: 180px 0 0;
  padding: 75px 0 100px;
}

#module-light .interview-ttl {
  margin: 0 0 35px;
}

#module-light .interview-text {
  width: 750px;
  margin: 0 auto 55px;
}

/* information picture
===================================== */
#module-light .info {
  max-width: 900px;
  width: 100%;
  margin: 70px auto 0;
  padding: 30px 0 0;
}

#module-light .info-ttl {
  display: inline-block;
  margin: 0 0 55px;
  font-size: 34px;
}

#module-light .info-ttl:after {
  display: block;
  content: "";
  width: 1em;
  margin: 0 auto;
  padding-top: 15px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

#module-light .info-block {
  webkit-justify-content: space-between;
  justify-content: space-between;
  display: -webkit-flex;
  display: flex;
}

#module-light .info-pic {
  width: 400px;
}

#module-light .info-box {
  width: 450px;
  margin: 0 0 0 50px;
}

#module-light .info-text {
  line-height: 1.6;
  text-align: left;
  font-size: 14px;
  letter-spacing: 0.02em;
}

#module-light .m--paragraph-ttl {
  display: block;
  margin: 0 0 10px;
}

#module-light .info-text_head {

}

#module-light .info-text_body {
  margin: 15px 0 0;
}

#module-light .info-btn {
  width: 300px;
  margin: 30px 0 0;
}

@media screen and (max-width: 768px) {
  #module-light .info {
    max-width: 90%;
    margin: 60px auto 0;
    padding: 20px 0 0;
  }
  #module-light .info-ttl {
    line-height: 1;
    margin: 0 0 30px;
    font-size: 24px;
  }
  #module-light .info-block {
    display: block;
    width: 100%;
  }
  #module-light .info-pic {
    width: 100%;
    margin: 0 0 20px;
    line-height: 0;
  }
  #module-light .info-box {
    width: 100%;
    margin: 0;
  }
  #module-light .info-text {
    font-size: 12px;
  }
  #module-light .info-btn {
    width: 85%;
  }
}

/* ---- PARTS ---- */
#module-light .m--ttl {
  line-height: 1;
  font-size: 34px;
  letter-spacing: 0.1em;
}

#module-light .m--subttl {
  margin: 0 0 10px;
  font-weight: bold;
  font-size: 18px;
}

#module-light .m--text {
  line-height: 1.8;
  font-size: 14px;
  color: #4f4f4f;
}

#module-light .m--btn a {
  font-size: 15px;
  letter-spacing: 0.12em;
}

#module-light .m--ttl-style {
  display: inline-block;
  line-height: 1;
  text-align: left;
  font-size: 50px;
  letter-spacing: 0.01em;
}

#module-light .m--ttl-style .style-ttl_first {
  font-size: 65px;
}

#module-light .m--ttl-style:after {
  display: block;
  content: "";
  width: 1em;
  padding-top: 15px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

#module-light .m--lead-style {
  line-height: 1.7;
  margin: 15px 0 0;
  text-align: left;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 0.12em;
}

#module-light .m--text-style {
  line-height: 1.6;
  margin: 35px 0 0;
  text-align: left;
  font-size: 14px;
  letter-spacing: 0.02em;
}

#module-light .m--caption-style {
  line-height: 1.5;
  margin: 25px 0 0;
  text-align: left;
  font-size: 12px;
  color: #888;
  border-radius: 4px;
}

#module-light .m--style-btn {
  max-width: 320px;
  width: 100%;
  margin: 40px 0 0;
}

#module-light .m--profile-style {
  font-size: 15px;
}

#module-light .m--profile-style dt {
  margin: 0 0 5px;
  font-weight: bold;
}

#module-light .m--arrow a {
  display: block;
  position: relative;
  line-height: 1;
  padding: 17px 0;
}

#module-light .m--arrow a:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 15px;
  width: 10px;
  height: 10px;
  border: 0px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  margin-top: -5px;
}

#module-light .m--external {
  position: relative;
  line-height: 1;
  padding: 17px 0;
}

#module-light .m--external .icon {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 15px;
  height: 15px;
  line-height: 0;
  -webkit-transition: opacity .3s ease-in-out;
  transition: opacity .3s ease-in-out;
}

#module-light .m--external a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
#module-light .m--external p {
  text-align: center;
  font-size: 16px;
  letter-spacing: 0.08em;
  -webkit-transition: opacity .3s ease-in-out;
  transition: opacity .3s ease-in-out;
}
#module-light .m--external:hover p,#module-light .m--external:hover .icon {
  opacity: .6;
}


@media screen and (max-width: 768px) {
  #module-light .m--ttl {
    font-size: 26px;
  }
  #module-light .m--text {
    font-size: 13px;
  }
  #module-light .m--btn {
    font-size: 14px;
  }
  #module-light .m--ttl-style {
    font-size: 35px;
    letter-spacing: 0;
  }
  #module-light .m--ttl-style:after {
    padding-top: 10px;
  }
  #module-light .m--ttl-style .style-ttl_first {
    font-size: 45px;
  }
  #module-light .m--lead-style {
    margin: 10px 0 0;
    font-size: 20px;
    letter-spacing: 0.1em;
  }
  #module-light .m--text-style {
    margin: 25px 0 0;
    font-size: 13px;
  }
  #module-light .m--caption-style {
    margin: 20px 0 0;
    font-size: 12px;
    border-radius: 2px;
  }
  #module-light .m--style-btn {
    max-width: 85%;
    width: 100%;
    margin: 30px 0 0;
  }
  #module-light .m--profile-style {
    font-size: 14px;
  }
  #module-light .m--arrow a:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 15px;
    width: 10px;
    height: 10px;
    border: 0px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -5px;
  }
  #module-light .m--external {
    margin: 30px auto 0;
    padding: 20px 0;
  }
  #module-light .m--external p {
    font-size: 15px;
  }
  #module-light .m--external .icon {
    top: 5px;
  }
}

/* ---- FONT SIZE ---- */
#module-light .m--fs-xx-large {
  font-size: 64px;
}
#module-light .m--fs-x-large {
  font-size: 53px;
}
#module-light .m--fs-large {
  font-size: 48px;
}
#module-light .m--fs-medium {
  font-size: 32px;
}
#module-light .m--fs-small {
  font-size: 24px;
}
#module-light .m--fs-x-small {
  font-size: 22px;
}
#module-light .m--fs-xx-small {
  font-size: 20px;
}

@media screen and (max-width: 768px) {
  #module-light .m--fs-xx-large {
    font-size: 28px;
  }
  #module-light .m--fs-x-large {
    font-size: 28px;
  }
  #module-light .m--fs-large {
    font-size: 27px;
  }
  #module-light .m--fs-medium {
    font-size: 21px;
  }
  #module-light .m--fs-small {
    font-size: 21px;
  }
  #module-light .m--fs-x-small {
    font-size: 22px;
  }
  #module-light .m--fs-xx-small {
    font-size: 20px;
  }
}

/* ---- FONT WEIGTHT ---- */
#module-light .m--fw-400 {
  font-weight: 400;
}
#module-light .m--fw-500 {
  font-weight: 500;
}
#module-light .m--fw-600 {
  font-weight: 600;
}
#module-light .m--fw-700 {
  font-weight: 700;
}
#module-light .m--fw-800 {
  font-weight: 800;
}
#module-light .m--fw-900 {
  font-weight: 900;
}
#module-light .m--fw-bold {
  font-weight: bold;
}

@media screen and (max-width: 768px) {
  #module-light .m--fw-400 {
    font-weight: 400;
  }
  #module-light .m--fw-500 {
    font-weight: 500;
  }
  #module-light .m--fw-600 {
    font-weight: 600;
  }
  #module-light .m--fw-700 {
    font-weight: 700;
  }
  #module-light .m--fw-800 {
    font-weight: 800;
  }
  #module-light .m--fw-900 {
    font-weight: 900;
  }
  #module-light .m--fw-bold {
    font-weight: bold;
  }
}

/* ---- INDENT ---- */
#module-light .m--indent-01 {
  padding-left: 1em;
  text-indent: -1em;
}

#module-light .m--indent-02 {
  padding-left: 2em;
  text-indent: -2em;
}

#module-light .m--indent-03 {
  padding-left: 3em;
  text-indent: -3em;
}


/* navigation pager
===================================== */
#module-light .pager {
  position: fixed;
  top: 50%;
  right: 3%;
  z-index: 100;
}

#module-light .pager li {
  width: 6px;
  height: 6px;
  margin: 0 0 14px;
  background: rgba(58, 58, 58, 0.2);
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
}

#module-light .pager li.current {
  background: rgba(58, 58, 58, 0.5);
  -webkit-transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
}

#module-light .pager li:last-child {
  margin: 0;
}

/* block-multi
===================================== */
#module-light .block-multi {
  margin: 180px 0 0;
}
@media screen and (max-width: 768px) {
  #module-light .block-multi {
    margin: 80px 0 0;
  }
}


/* ---- EFFECT ---- */

/* #mode-luxury
===================================== */
#module-light .fade {
  opacity: 0;
  -webkit-transition: all 1.8s cubic-bezier(0.77, 0, 0.175, 1);
  transition: all 1.8s cubic-bezier(0.77, 0, 0.175, 1);
}

#module-light .fade.active {
  opacity: 1;
}


/* 追記分 */

@media screen and (min-width: 769px) {
  .is-sp {
    display: none;
  }
}

.share_btn.share_btn__x {
    width: 21px !important;
    position: relative;
    top: -4px;
}

.share_btn.share_btn__fb {
    left: 3px;
    position: relative;
}