/* hover
=================================================================== */
/* ================================================ vw vh */
/* common
=================================================================== */
/* layout
=================================================================== */
/* imgCover
=================================================================== */
/* mask
=================================================================== */
/* background
=================================================================== */
/* flex
=================================================================== */
/* animation delay
=================================================================== */
/* 3d
=================================================================== */
/* font
=================================================================== */
/* textTate
=================================================================== */
/* form
=================================================================== */
/* =================================================================== hover anime */
@-webkit-keyframes pop-hover {
  0% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
  10% {
    -webkit-transform: translate(0, 2px) rotate(-6deg);
            transform: translate(0, 2px) rotate(-6deg);
  }
  20% {
    -webkit-transform: translate(0, -6px) rotate(0);
            transform: translate(0, -6px) rotate(0);
  }
  30% {
    -webkit-transform: translate(0, 3px) rotate(3deg);
            transform: translate(0, 3px) rotate(3deg);
  }
  40% {
    -webkit-transform: translate(0, -3px) rotate(0);
            transform: translate(0, -3px) rotate(0);
  }
  50% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
  100% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
}
@keyframes pop-hover {
  0% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
  10% {
    -webkit-transform: translate(0, 2px) rotate(-6deg);
            transform: translate(0, 2px) rotate(-6deg);
  }
  20% {
    -webkit-transform: translate(0, -6px) rotate(0);
            transform: translate(0, -6px) rotate(0);
  }
  30% {
    -webkit-transform: translate(0, 3px) rotate(3deg);
            transform: translate(0, 3px) rotate(3deg);
  }
  40% {
    -webkit-transform: translate(0, -3px) rotate(0);
            transform: translate(0, -3px) rotate(0);
  }
  50% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
  100% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
}
@-webkit-keyframes pop-hover-sm {
  0% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
  10% {
    -webkit-transform: translate(0, 2px) rotate(-1deg);
            transform: translate(0, 2px) rotate(-1deg);
  }
  20% {
    -webkit-transform: translate(0, -6px) rotate(0);
            transform: translate(0, -6px) rotate(0);
  }
  30% {
    -webkit-transform: translate(0, 3px) rotate(0.5deg);
            transform: translate(0, 3px) rotate(0.5deg);
  }
  40% {
    -webkit-transform: translate(0, -3px) rotate(0);
            transform: translate(0, -3px) rotate(0);
  }
  50% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
  100% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
}
@keyframes pop-hover-sm {
  0% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
  10% {
    -webkit-transform: translate(0, 2px) rotate(-1deg);
            transform: translate(0, 2px) rotate(-1deg);
  }
  20% {
    -webkit-transform: translate(0, -6px) rotate(0);
            transform: translate(0, -6px) rotate(0);
  }
  30% {
    -webkit-transform: translate(0, 3px) rotate(0.5deg);
            transform: translate(0, 3px) rotate(0.5deg);
  }
  40% {
    -webkit-transform: translate(0, -3px) rotate(0);
            transform: translate(0, -3px) rotate(0);
  }
  50% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
  100% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
}
/* =================================================================== slider anime */
@-webkit-keyframes slider-anime {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
}
@keyframes slider-anime {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
}
/* ================================================ vh */
/* ============================================================================================ topKv */
.topKv {
  position: relative;
  display: block;
  padding-top: 75px;
  overflow: hidden;
  max-height: 850px !important;
  min-height: 714px;
}

.topKv__inner {
  position: relative;
  height: 100%;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}

/* ================================================ topKv__layout */
.topKv__layout--wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}

.topKv__layout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}

/* ================================================ topKvCopy */
.topKvCopy {
  position: absolute;
  line-height: 0;
  z-index: 2;
}

/* --------------------------------------- topKvCopy common */
.topKvCopy__main {
  width: 18.6676427526%;
}

.topKvCopy__sub {
  width: 20.4978038067%;
}

.topKvCopy__svg {
  fill: rgba(var(--color-text), 1);
}

/* --------------------------------------- topKvCopy__mainImg */
.topKvCopy__mainImg--list {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.topKvCopy__mainImg {
  position: absolute;
  width: 22.7450980392%;
  opacity: 0;
}
.topKvCopy__mainImg:nth-child(2) {
  left: 0;
  bottom: 0;
}
.topKvCopy__mainImg:nth-child(1) {
  right: 0;
  top: 0;
}

.topKvCopy__mainImg--inner {
  position: relative;
  padding-top: 72.4137931034%;
  overflow: hidden;
}

.topKvCopy__mainImg--target {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* ================================================ topKvImg */
.topKvImg__block {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.topKvImg {
  position: absolute;
}

/* --------------------------------------- topKvImg inner */
.topKvImg__inner {
  position: relative;
  padding-top: 100%;
}

.topKvImg__large {
  height: 89.7902097902%;
}
.topKvImg__large .topKvImg__inner {
  position: relative;
  height: 100%;
  padding-top: 0;
}

.topKvImg__inner--target {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* --------------------------------------- topKvImg aside text */
.topKvImg__aside {
  position: absolute;
  width: 100%;
  left: 0;
  top: 100%;
  white-space: nowrap;
  -webkit-transform: translate(0, 100%);
          transform: translate(0, 100%);
  z-index: -1;
}

.topKvImg__aside--tate {
  width: auto;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  top: 3.4965034965%;
  left: 1.4641288433%;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  z-index: 2;
}

.topKvImg__asideText {
  line-height: 1;
  font-size: 1.35vh;
}

@media (max-aspect-ratio: 1366/715) {
  .topKvImg__asideText {
    font-size: 0.8052708638vw;
  }
}
/* ================================================ topKv__layout detail */
/* --------------------------------------- topKv__layout 1 */
.topKv__layout--1 .topKvCopy__main {
  top: 47.5524475524%;
  right: 16.8374816984%;
}
.topKv__layout--1 .topKvCopy__sub {
  width: 109.8039215686%;
  bottom: 130%;
  left: 60%;
}
.topKv__layout--1 .topKvImg--1 {
  width: 46.9985358712%;
  left: 5.1244509517%;
  top: 50%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
}
.topKv__layout--1 .topKvImg--2 {
  width: 19.4729136164%;
  right: 18.4480234261%;
  top: 0%;
  -webkit-transform: translateY(-63.1578947368%);
          transform: translateY(-63.1578947368%);
}
.topKv__layout--1 .topKvImg--3 {
  width: 9.5168374817%;
  right: 34.4070278184%;
  bottom: 0%;
  -webkit-transform: translateY(15.037593985%);
          transform: translateY(15.037593985%);
}

/* --------------------------------------- topKv__layout 2 */
.topKv__layout--2 .topKvCopy__main {
  top: 43.3566433566%;
  left: 10.980966325%;
}
.topKv__layout--2 .topKvCopy__sub {
  width: 109.8039215686%;
  bottom: 130%;
  left: 0%;
}
.topKv__layout--2 .topKvImg__large {
  height: 73.4265734266%;
}
.topKv__layout--2 .topKvImg--1 {
  width: 38.6530014641%;
  right: 6.4421669107%;
  top: 7.6923076923%;
}
.topKv__layout--2 .topKvImg--2 {
  width: 10.6149341142%;
  left: 29.2825768668%;
  top: 0%;
}
.topKv__layout--2 .topKvImg--3 {
  width: 11.5666178624%;
  left: 4.0263543192%;
  top: 68.5314685315%;
}
.topKv__layout--2 .topKvImg--4 {
  width: 16.3250366032%;
  left: 35.1390922401%;
  bottom: 0%;
}

/* --------------------------------------- topKv__layout 3 */
.topKv__layout--3 .topKvCopy__main {
  top: 60.8391608392%;
  right: 18.3016105417%;
}
.topKv__layout--3 .topKvCopy__sub {
  top: 17.776%;
  left: 24.1581259151%;
}
.topKv__layout--3 .topKvImg--1 {
  width: 9.1508052709%;
  left: 7.6866764275%;
  top: 6.993006993%;
}
.topKv__layout--3 .topKvImg--2 {
  width: 27.6720351391%;
  left: 0%;
  bottom: 0%;
}
.topKv__layout--3 .topKvImg--3 {
  width: 11.2737920937%;
  left: 38.5065885798%;
  top: 67.1328671329%;
}
.topKv__layout--3 .topKvImg--4 {
  width: 18.3016105417%;
  left: 51.8301610542%;
  top: 13.2867132867%;
}
.topKv__layout--3 .topKvImg--5 {
  width: 13.9092240117%;
  left: 77.2327964861%;
  top: -5.5944055944%;
}

/* --------------------------------------- topKv__layout 4 */
.topKv__layout--4 .topKvCopy__main {
  top: 46.8531468531%;
  right: 14.6412884334%;
}
.topKv__layout--4 .topKvCopy__sub {
  width: 109.8039215686%;
  bottom: 130%;
  left: -50%;
}
.topKv__layout--4 .topKvImg__large {
  height: 65.034965035%;
}
.topKv__layout--4 .topKvImg--1 {
  width: 34.1874084919%;
  left: 7.6866764275%;
  top: 25.8741258741%;
}
.topKv__layout--4 .topKvImg--2 {
  width: 12.298682284%;
  left: 50.1464128843%;
  top: 0%;
  -webkit-transform: translateY(-22.619047619%);
          transform: translateY(-22.619047619%);
}
.topKv__layout--4 .topKvImg--3 {
  width: 12.298682284%;
  left: 57.1010248902%;
  bottom: 0%;
  -webkit-transform: translateY(17.8571428571%);
          transform: translateY(17.8571428571%);
}

/* ============================================================== news__keenWrapper keenArrow */
.news__keenWrapper {
  position: relative;
  padding-top: 50px;
  margin-top: -50px;
  /* --------------------------------------- keenArrow */
  /* --------------------------------------- keenArrow__icon */
  /* --------------------------------------- keenArrow prev */
  /* --------------------------------------- keenArrow next */
  /* --------------------------------------- keenArrow disabled */
}
.news__keenWrapper .keenArrow {
  position: absolute;
  width: 70px;
  height: 18px;
  top: 0;
  right: 0;
  background-color: #fff;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.2);
  border-radius: 9999px;
  cursor: pointer;
  transition-duration: 0.15s;
  transition-timing-function: cubic-bezier(0.41, 0.12, 0.26, 0.97);
  -ms-transition-duration: 0.15s;
  -ms-transition-timing-function: cubic-bezier(0.41, 0.12, 0.26, 0.97);
  -webkit-transition-duration: 0.15s;
  -webkit-transition-timing-function: cubic-bezier(0.41, 0.12, 0.26, 0.97);
  -moz-transition-duration: 0.15s;
  -moz-transition-timing-function: cubic-bezier(0.41, 0.12, 0.26, 0.97);
}
.news__keenWrapper .keenArrow__icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(var(--color-text), 1);
  transition-duration: 0.15s;
  transition-timing-function: cubic-bezier(0.41, 0.12, 0.26, 0.97);
  -ms-transition-duration: 0.15s;
  -ms-transition-timing-function: cubic-bezier(0.41, 0.12, 0.26, 0.97);
  -webkit-transition-duration: 0.15s;
  -webkit-transition-timing-function: cubic-bezier(0.41, 0.12, 0.26, 0.97);
  -moz-transition-duration: 0.15s;
  -moz-transition-timing-function: cubic-bezier(0.41, 0.12, 0.26, 0.97);
}
.news__keenWrapper .keenArrow--prev {
  right: 120px;
}
.news__keenWrapper .keenArrow--prev .keenArrow__icon {
  mask-image: url(../img/common/news__keenArrow--prev.svg);
  -webkit-mask-image: url(../img/common/news__keenArrow--prev.svg);
}
.news__keenWrapper .keenArrow--next {
  right: 40px;
}
.news__keenWrapper .keenArrow--next .keenArrow__icon {
  mask-image: url(../img/common/news__keenArrow--next.svg);
  -webkit-mask-image: url(../img/common/news__keenArrow--next.svg);
}
.news__keenWrapper .arrow--disabled {
  border-color: rgba(0, 0, 0, 0);
  pointer-events: none;
}
.news__keenWrapper .arrow--disabled .keenArrow__icon {
  background-color: rgba(var(--color-text), 0.25);
}

/* ============================================================================================ productBlock */
/* --------------------------------------- top layout setting */
.productBlock--strong, .top .productBlock__list .productBlock:nth-child(1), .top .productBlock__list .productBlock:nth-child(6) {
  width: calc((100% - 160px) / 4 * 2 + 40px);
}

.productBlock--flexEnd, .top .productBlock__list .productBlock:nth-child(3), .top .productBlock__list .productBlock:nth-child(4) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.productBlock--strong .productBlock__cateTag, .top .productBlock__list .productBlock:nth-child(1) .productBlock__cateTag, .top .productBlock__list .productBlock:nth-child(6) .productBlock__cateTag {
  margin-bottom: 5px;
}
.productBlock--strong .productBlock__infoTitle, .top .productBlock__list .productBlock:nth-child(1) .productBlock__infoTitle, .top .productBlock__list .productBlock:nth-child(6) .productBlock__infoTitle {
  font-size: 21px;
  margin-right: 25px;
}
.productBlock--strong .productBlock__infoPrice, .top .productBlock__list .productBlock:nth-child(1) .productBlock__infoPrice, .top .productBlock__list .productBlock:nth-child(6) .productBlock__infoPrice {
  padding-top: 2px;
}
.productBlock--strong .productBlock__infoPrice > span.fontEn, .top .productBlock__list .productBlock:nth-child(1) .productBlock__infoPrice > span.fontEn, .top .productBlock__list .productBlock:nth-child(6) .productBlock__infoPrice > span.fontEn {
  font-size: 19px;
  margin-right: 0.2em;
}
.productBlock--strong .productBlock__infoDesc, .top .productBlock__list .productBlock:nth-child(1) .productBlock__infoDesc, .top .productBlock__list .productBlock:nth-child(6) .productBlock__infoDesc {
  font-size: 13px;
  width: calc(100% - 120px);
  max-width: 60.4838709677%;
}
.productBlock--strong .btnIcon, .top .productBlock__list .productBlock:nth-child(1) .btnIcon, .top .productBlock__list .productBlock:nth-child(6) .btnIcon {
  position: absolute;
  right: 0;
  bottom: 0;
}

/* ============================================================================================ topConcept */
.topConcept {
  overflow: clip;
}

.topConcept__tob {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.topConcept__tobLeader {
  position: sticky;
  -ms-flex-item-align: start;
      align-self: flex-start;
  top: 105px;
  width: 25.9882869693%;
}
.topConcept__tobLeader .articleTitle--strong .articleTitle--p {
  font-size: min(2.196193265vw, 30px);
  letter-spacing: 0.2em;
}

.topConcept__tobContents {
  width: 74.0117130307%;
}
.topConcept__tobContents .csBlock__leader {
  padding: 0.5856515373vw 0vw 2.0497803807vw 1.4641288433vw;
}

/* ============================================================================================ body class */
/* --------------------------------------- kv--active-- */
.topKv__layout {
  display: none;
}

.kv--active--1 .topKv__layout--1 {
  display: block;
}

.kv--active--2 .topKv__layout--2 {
  display: block;
}

.kv--active--3 .topKv__layout--3 {
  display: block;
}

.kv--active--4 .topKv__layout--4 {
  display: block;
}

/* ============================================================================================ hover pc */
@media (hover: hover) and (pointer: fine) {
  .news__keenWrapper .keenArrow:hover, .news__keenWrapper .keenArrow:active {
    background-color: rgba(var(--color-btnBg), 1);
  }
  .news__keenWrapper .keenArrow:hover .keenArrow__icon, .news__keenWrapper .keenArrow:active .keenArrow__icon {
    background-color: #fff;
  }
}
/* ============================================================================================ edit kv */
/* --------------------------------------- topKvCopy__subText */
.topKvCopy__subText--list {
  white-space: nowrap;
  font-size: 0;
}

.topKvCopy__subText {
  margin-top: 1.0980966325vw;
  -webkit-transform: scaleY(0.96);
          transform: scaleY(0.96);
}

.topKvCopy__subText--p {
  font-size: 1.0980966325vw;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.2em;
}

/* --------------------------------------- topKvCopy__mainText */
.topKvCopy__mainText--wrapper {
  position: relative;
  padding-top: 43.137254902%;
}

.topKvCopy__mainText--list {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  white-space: nowrap;
  font-size: 0;
}

.topKvCopy__mainText {
  position: absolute;
  width: 100%;
  -webkit-transform: scaleY(0.96);
          transform: scaleY(0.96);
}
.topKvCopy__mainText:nth-child(1) {
  top: 0;
  left: 0;
  text-align: left;
}
.topKvCopy__mainText:nth-child(2) {
  bottom: 0;
  text-align: right;
}
.topKvCopy__mainText:nth-child(2) .topKvCopy__mainText--p {
  right: -0.5em;
}

.topKvCopy__mainText--p {
  position: relative;
  font-size: 3.513909224vw;
  line-height: 1;
  letter-spacing: 0.4em;
  font-weight: 500;
}

.js--kv--img .topKvImg__inner--target {
  opacity: 0;
}

.topKvImg__asideText span {
  opacity: 0;
}