@charset "UTF-8";

html {
  font-size: 100%;
  *font-size: small;
  *font: x-small;
  overflow: auto;
  width: 100%;
}

body {
  margin: 0;
  padding: 0;
  width: 100%;
}

html body {
  font-family: "Barlow", "Noto Sans JP", sans-serif;
}

div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}

main,
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  line-height: 1;
}

* {
  box-sizing: border-box;
}

*:before,
*:after {
  box-sizing: inherit;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

input,
button,
textarea,
select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-outline: 0;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

select::-ms-expand {
  display: none;
}

@media screen and (min-width: 768px) {
  .pc {
    display: block;
  }

  img.pc,
  span.pc,
  br.pc {
    display: inline;
  }

  .sp,
  img.sp,
  span.sp,
  br.sp {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .sp {
    display: block;
  }

  img.sp,
  span.sp,
  br.sp {
    display: inline;
  }

  .pc,
  img.pc,
  span.pc,
  br.pc {
    display: none;
  }
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  header.sp {
    display: flex;
  }

  header.pc {
    display: none !important;
  }
}

.topSecHero .product .button a,
.topSec2 .product .button a,
.topSec3 .product .button a,
.topSec4 .product .button a,
.topSec5 .product .button a,
.topSec6 .product .button a,
.wallSecStyle2 .feature1 .button a,
.wallSecStyle3 .feature1 .button a,
.wallSecStyle4 .feature1 .button a,
.freeS1SecHero .read .button a,
.freeProSecHero .read .button a,
b,
strong,
.bold,
#toEc a,
.modBanner dt,
.modBanner .button a,
.modTopics .swiper-slide dl dt,
.modList2Col ul li .text,
.modList3Col ul li .text,
.modList4Col ul li .text,
.modListButton a,
.modWallBanner .product .button a,
.modSecSpec .spec .text h3,
.modSecSpec .spec .text dl div dt,
.modLineup .tab ul li figure figcaption,
.modLineup .wrap,
.modLineup .comparison h3,
.modLineup .comparison table th,
.modLineup .comparison table td,
.modLineup .comparison table th:first-child,
.modLineup .comparison table td:first-child,
header.pc .product > li > a,
header.pc .sub-v-series li a figcaption,
header.pc .sub-freestanding li a figcaption,
header.pc .sub-catalog li a,
#navSp .member li a,
#navSp .product figure figcaption,
#navSp .catalog li a,
#productHeader > .inner,
#productNavSp .tv a,
#productNavSp .catalog li a,
footer nav,
footer .copyright .inner,
.topSecHero .product .type,
.topSec2 .product .type .jp,
.topSec3 .product .type .jp,
.topSec4 .product .type .jp,
.topSec5 .product .type .jp,
.topSec6 .product .type .jp,
.wallSecHeader .read,
.wallSecStyle2 .feature2 dl dt,
.wallSecStyle3 .feature2 dl dt,
.wallSecStyle4 .feature2 dl dt,
.secInterview .read .button a,
.secInterview .detail .textWrap .text dt:not(.profile),
.secResistant dl .button a,
.wallV4SecHero .read .type .jp,
.wallV3SecHero .read .type .jp,
.wallV2SecHero .read .type .jp,
.wallV4SecFeature .text dt,
.freeSecHero .read .text,
.freeSecHero .read .type .jp,
.freeS1SecHero .read .type .jp,
.freeProSecHero .read .type .jp,
#buyFixedFooter .inner,
#buyFixedFooter .inner button,
.buySecMain .productInfo .catch,
.buySecMain .productInfo .type,
.buySecMain .productInfo .price,
.buySecMain .productInfo .security a,
.buySecMain .productInfo .selectColor p,
.buySecTitle p,
.buySecOption .detailOption .security a,
.buySecOption .selectOption .option li .detail,
.buySecOption .selectOption .option li .image,
.buySecOption .selectOption .option li .name,
.buySecOption .selectOption .option li .price,
.buySecOption .selectOption .option li .button,
.buySecOption .selectOption.withLink .link a,
.optionSecHero .bg figure figcaption .jp,
.shopSecList dl dt,
.shopSecList dl dd a {
  font-weight: bold;
}

.topSec2 .product .read,
.topSec3 .product .read,
.topSec4 .product .read,
.topSec5 .product .read,
.topSec6 .product .read,
.wallSecHero .read h2,
.wallSecHero .read .catch,
.wallTvCm ul li .text,
.wallSecStyle1 .feature .read .jp,
.wallSecStyle2 .feature1 .read .jp,
.wallSecStyle3 .feature1 .read .jp,
.wallSecStyle4 .feature1 .read .jp,
.secInterview .read dt,
.secInterview .detail h3,
.secResistant dl dt,
.wallV4SecHero .read .catch,
.wallV3SecHero .read .catch,
.wallV2SecHero .read .catch,
.wallV4SecSpecial .read dt,
.freeSecHero .read .catch,
.freeS1SecHero .read .catch,
.freeProSecHero .read .catch,
.designSecStory h2 {
  font-family: "Noto Serif JP", serif;
}

.modTopics h2,
.modSecHeader h2,
.modWallBanner .product .type,
.modSecSpec .type .text dt .en,
.modLineup h2,
.modLineup .detail .type,
footer .copyright small,
.topSecHeader h2,
.topSec2 .info,
.topSec3 .info,
.topSec4 .info,
.topSec2 .product .type .en,
.topSec3 .product .type .en,
.topSec4 .product .type .en,
.topSec5 .product .type .en,
.topSec6 .product .type .en,
.wallTvCm h2,
.wallSecStyle1 .info,
.wallSecStyle1 .feature .read .en,
.wallSecStyle2 .feature1 .read .en,
.wallSecStyle3 .feature1 .read .en,
.wallSecStyle4 .feature1 .read .en,
.wallSecStyle2 .info,
.wallSecStyle3 .info,
.wallSecStyle4 .info,
.secInterview .en,
.secInterview .detail .textWrap .text dt.profile,
.wallV4SecHero .read .type .en,
.wallV3SecHero .read .type .en,
.wallV2SecHero .read .type .en,
.freeSecHero .read .type .en,
.freeS1SecHero .read .type .en,
.freeProSecHero .read .type .en,
.buySecMain .productInfo h1,
.buySecOption .detailOption h2 .en,
.optionSecHero .read h2,
.optionSecHero .read .type,
.optionSecHero .bg figure figcaption .en,
.designSecFeature .design1 .en,
.designSecFeature .design2 .en,
.designSecFeature .design3 .en,
.designSecFeature .design4 .en,
.designSecColor dl dt,
.designSecStory h2::before,
.shopSecTitle h2 .en {
  font-weight: 600;
}

.topSecHero .product .button a,
.topSec2 .product .button a,
.topSec3 .product .button a,
.topSec4 .product .button a,
.topSec5 .product .button a,
.topSec6 .product .button a,
.wallSecStyle2 .feature1 .button a,
.wallSecStyle3 .feature1 .button a,
.wallSecStyle4 .feature1 .button a,
.freeS1SecHero .read .button a,
.freeProSecHero .read .button a {
  display: block;
  width: 240px;
  font-size: 14px;
  padding: 20px 0;
  position: relative;
}

@media screen and (max-width: 767px) {
  .topSecHero .product .button a,
  .topSec2 .product .button a,
  .topSec3 .product .button a,
  .topSec4 .product .button a,
  .topSec5 .product .button a,
  .topSec6 .product .button a,
  .wallSecStyle2 .feature1 .button a,
  .wallSecStyle3 .feature1 .button a,
  .wallSecStyle4 .feature1 .button a,
  .freeS1SecHero .read .button a,
  .freeProSecHero .read .button a {
    width: 48vw;
    font-size: 1.4rem;
    padding: 5.33333vw 0;
  }
}

.topSecHero .product .button a:hover,
.topSec2 .product .button a:hover,
.topSec3 .product .button a:hover,
.topSec4 .product .button a:hover,
.topSec5 .product .button a:hover,
.topSec6 .product .button a:hover,
.wallSecStyle2 .feature1 .button a:hover,
.wallSecStyle3 .feature1 .button a:hover,
.wallSecStyle4 .feature1 .button a:hover,
.freeS1SecHero .read .button a:hover,
.freeProSecHero .read .button a:hover {
  padding-left: 20px;
}

.topSecHero .product .button a:hover::before,
.topSec2 .product .button a:hover::before,
.topSec3 .product .button a:hover::before,
.topSec4 .product .button a:hover::before,
.topSec5 .product .button a:hover::before,
.topSec6 .product .button a:hover::before,
.wallSecStyle2 .feature1 .button a:hover::before,
.wallSecStyle3 .feature1 .button a:hover::before,
.wallSecStyle4 .feature1 .button a:hover::before,
.freeS1SecHero .read .button a:hover::before,
.freeProSecHero .read .button a:hover::before,
.topSecHero .product .button a:hover::after,
.topSec2 .product .button a:hover::after,
.topSec3 .product .button a:hover::after,
.topSec4 .product .button a:hover::after,
.topSec5 .product .button a:hover::after,
.topSec6 .product .button a:hover::after,
.wallSecStyle2 .feature1 .button a:hover::after,
.wallSecStyle3 .feature1 .button a:hover::after,
.wallSecStyle4 .feature1 .button a:hover::after,
.freeS1SecHero .read .button a:hover::after,
.freeProSecHero .read .button a:hover::after {
  opacity: 1;
  filter: alpha(opacity=100);
}

.topSecHero .product .button a::before,
.topSec2 .product .button a::before,
.topSec3 .product .button a::before,
.topSec4 .product .button a::before,
.topSec5 .product .button a::before,
.topSec6 .product .button a::before,
.wallSecStyle2 .feature1 .button a::before,
.wallSecStyle3 .feature1 .button a::before,
.wallSecStyle4 .feature1 .button a::before,
.freeS1SecHero .read .button a::before,
.freeProSecHero .read .button a::before,
.topSecHero .product .button a::after,
.topSec2 .product .button a::after,
.topSec3 .product .button a::after,
.topSec4 .product .button a::after,
.topSec5 .product .button a::after,
.topSec6 .product .button a::after,
.wallSecStyle2 .feature1 .button a::after,
.wallSecStyle3 .feature1 .button a::after,
.wallSecStyle4 .feature1 .button a::after,
.freeS1SecHero .read .button a::after,
.freeProSecHero .read .button a::after {
  content: "";
  position: absolute;
  opacity: 0.6;
  filter: alpha(opacity=60);
  transition: 0.3s;
}

.topSecHero .product .button a::before,
.topSec2 .product .button a::before,
.topSec3 .product .button a::before,
.topSec4 .product .button a::before,
.topSec5 .product .button a::before,
.topSec6 .product .button a::before,
.wallSecStyle2 .feature1 .button a::before,
.wallSecStyle3 .feature1 .button a::before,
.wallSecStyle4 .feature1 .button a::before,
.freeS1SecHero .read .button a::before,
.freeProSecHero .read .button a::before {
  width: 16px;
  height: 13px;
  background-image: url(../../img/common/arrow_01.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
  .topSecHero .product .button a::before,
  .topSec2 .product .button a::before,
  .topSec3 .product .button a::before,
  .topSec4 .product .button a::before,
  .topSec5 .product .button a::before,
  .topSec6 .product .button a::before,
  .wallSecStyle2 .feature1 .button a::before,
  .wallSecStyle3 .feature1 .button a::before,
  .wallSecStyle4 .feature1 .button a::before,
  .freeS1SecHero .read .button a::before,
  .freeProSecHero .read .button a::before {
    width: 4.26667vw;
    height: 3.46667vw;
  }
}

.topSecHero .product .button a::after,
.topSec2 .product .button a::after,
.topSec3 .product .button a::after,
.topSec4 .product .button a::after,
.topSec5 .product .button a::after,
.topSec6 .product .button a::after,
.wallSecStyle2 .feature1 .button a::after,
.wallSecStyle3 .feature1 .button a::after,
.wallSecStyle4 .feature1 .button a::after,
.freeS1SecHero .read .button a::after,
.freeProSecHero .read .button a::after {
  width: 100%;
  height: 1px;
  background-color: #000;
  bottom: 0;
  left: 0;
}

@media screen and (max-width: 767px) {
  html {
    font-size: 2.66667vw;
  }
}

.disable-auto-tel a[href^="tel:"] {
  color: inherit;
  text-decoration: none;
  pointer-events: none;
}

body {
  font-size: 16px;
  color: #333;
  -webkit-text-size-adjust: inherit;
}

@media screen and (max-width: 767px) {
  body {
    -webkit-text-size-adjust: 100%;
    font-size: 1.4rem;
  }
}

input,
textarea,
select {
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  input,
  textarea,
  select {
    font-size: 1.4rem;
  }
}

_:-ms-fullscreen,
:root body {
  overflow: hidden;
}

_:lang(x)::-ms-backdrop,
.selector {
  font-family: "Segoe UI", Meiryo, sans-serif;
}

div,
section,
dl,
ul,
p,
nav {
  box-sizing: border-box;
}

p img,
figure img {
  vertical-align: bottom;
}

a,
button {
  color: #333;
  text-decoration: none;
  transition: 0.3s;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  cursor: pointer;
}

*:focus {
  outline: none;
}

.ofi-img,
.hero-ofi-img {
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
  width: 100%;
  height: 100%;
}

.ofi-contain-img {
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
  font-family: "object-fit: contain; object-position: 50% 50%;";
}

.hero-ofi-img {
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 0% 50%;
  object-position: 0% 50%;
  font-family: "object-fit: cover; object-position: 0% 50%;";
  width: 100%;
  height: 100%;
}

body .anchor {
  display: block;
  padding-top: 58px;
  margin-top: -58px;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  body .anchor {
    padding-top: 46px;
    margin-top: -46px;
  }
}

@media screen and (max-width: 767px) {
  body .anchor {
    padding-top: 12.26667vw;
    margin-top: -12.26667vw;
  }
}

main {
  width: 1600px;
  max-width: 100%;
  /* min-width: 1080px; */
  margin: 0 auto;
}

#loading {
  width: 100%;
  height: 100%;
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 30000;
}

#loading img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

#toEc {
  position: fixed;
  right: 30px;
  bottom: 30px;
  z-index: 10000;
  -webkit-transform: translateX(190px);
  transform: translateX(190px);
  transition: 0.5s;
}

@media screen and (max-width: 767px) {
  #toEc {
    display: none;
  }
}

#toEc a {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  width: 160px;
  height: 160px;
  border-radius: 100%;
  background-color: #a78a5a;
  color: #fff;
  position: relative;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #toEc a {
    font-size: 12px;
    width: 100px;
    height: 100px;
  }
}

#toEc a::before {
  content: "";
  width: 28px;
  height: 24px;
  background: url(../../img/wall/ic_cart.svg) no-repeat;
  background-size: contain;
  margin-bottom: 12px;
}

#toEc.isShow {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

.fadeUp {
  opacity: 0;
  filter: alpha(opacity=0);
}

.fadeUp.scrollin {
  -webkit-animation: fadeUp 0.7s ease-in-out 0s 1 normal forwards;
  animation: fadeUp 0.7s ease-in-out 0s 1 normal forwards;
}

@-webkit-keyframes fadeZoom {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes fadeZoom {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes fadeUp {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeUp {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@-webkit-keyframes fadeUpZoom {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateY(120px) scale(1.05);
    transform: translateY(120px) scale(1.05);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1);
  }
}

@keyframes fadeUpZoom {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateY(120px) scale(1.05);
    transform: translateY(120px) scale(1.05);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1);
  }
}

@-webkit-keyframes fadeUpForElement {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeUpForElement {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@-webkit-keyframes fadeSlideForElement {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateX(80px);
    transform: translateX(80px);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeSlideForElement {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateX(80px);
    transform: translateX(80px);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@-webkit-keyframes slideToRight {
  0% {
    left: -110%;
  }

  100% {
    left: 0;
  }
}

@keyframes slideToRight {
  0% {
    left: -110%;
  }

  100% {
    left: 0;
  }
}

@-webkit-keyframes slideMaskToRight {
  0% {
    left: 0;
  }

  100% {
    left: 100%;
  }
}

@keyframes slideMaskToRight {
  0% {
    left: 0;
  }

  100% {
    left: 100%;
  }
}

@-webkit-keyframes slideToLeft {
  0% {
    right: -110%;
  }

  100% {
    right: 0;
  }
}

@keyframes slideToLeft {
  0% {
    right: -110%;
  }

  100% {
    right: 0;
  }
}

@-webkit-keyframes slideMaskToLeft {
  0% {
    right: 0;
  }

  100% {
    right: 100%;
  }
}

@keyframes slideMaskToLeft {
  0% {
    right: 0;
  }

  100% {
    right: 100%;
  }
}

@-webkit-keyframes zoomOut {
  0% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes zoomOut {
  0% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wallHeroSlideToLeft {
  0% {
    right: -24.30556%;
  }

  100% {
    right: 0;
  }
}

@keyframes wallHeroSlideToLeft {
  0% {
    right: -24.30556%;
  }

  100% {
    right: 0;
  }
}

#modalMovie {
  display: none;
  opacity: 0;
  filter: alpha(opacity=0);
}

#modalMovie #modalMovie-content {
  display: none;
  opacity: 0;
  filter: alpha(opacity=0);
}

#modalMovie.is-open {
  display: block;
  opacity: 1;
  filter: alpha(opacity=100);
}

#modalMovie.is-open #modalMovie-content {
  display: block;
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-animation: modalFadeIn 0.6s;
  animation: modalFadeIn 0.6s;
}

#modalOverlay {
  background: rgba(0, 0, 0, 0.9);
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 30000;
}

#modalMovie-content {
  width: 896px;
  height: 504px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

@media screen and (max-width: 767px) {
  #modalMovie-content {
    width: 100%;
    height: auto;
  }
}

@media screen and (max-width: 767px) {
  #youtube > div {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
  }
}

#youtube #player {
  width: 100%;
  vertical-align: bottom;
}

@media screen and (max-width: 767px) {
  #youtube #player {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}

#modalPlay {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
  -webkit-transform-origin: center;
  transform-origin: center;
  transition: 0.2s;
}

@media screen and (max-width: 767px) {
  #modalPlay {
    width: 26.66667vw;
    height: 26.66667vw;
  }
}

#modalPlay:hover {
  -webkit-transform: translate(-50%, -50%) scale(1.1);
  transform: translate(-50%, -50%) scale(1.1);
}

#modalClose {
  position: absolute;
  top: 40px;
  right: 40px;
}

@media screen and (max-width: 767px) {
  #modalClose {
    top: 5.33333vw;
    right: 5.33333vw;
  }
}

#modalClose button {
  display: block;
  width: 60px;
  height: 60px;
  border-radius: 100%;
  border: 1px solid #fff;
  overflow: hidden;
  text-indent: -10000px;
  position: relative;
}

@media screen and (max-width: 767px) {
  #modalClose button {
    width: 16vw;
    height: 16vw;
  }
}

#modalClose button span {
  display: block;
  width: 20px;
  height: 1px;
  background: #fff;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  transition: 0.3s;
  pointer-events: none;
}

@media screen and (max-width: 767px) {
  #modalClose button span {
    width: 5.33333vw;
  }
}

#modalClose button span:nth-child(1) {
  top: 16px;
  -webkit-transform: translate(-10px, 12px) rotate(-45deg);
  transform: translate(-10px, 12px) rotate(-45deg);
}

@media screen and (max-width: 767px) {
  #modalClose button span:nth-child(1) {
    top: 4.26667vw;
    -webkit-transform: translate(-2.66667vw, 3.2vw) rotate(-45deg);
    transform: translate(-2.66667vw, 3.2vw) rotate(-45deg);
  }
}

#modalClose button span:nth-child(2) {
  bottom: 16px;
  -webkit-transform: translate(-10px, -12px) rotate(45deg);
  transform: translate(-10px, -12px) rotate(45deg);
}

@media screen and (max-width: 767px) {
  #modalClose button span:nth-child(2) {
    bottom: 4.26667vw;
    -webkit-transform: translate(-2.66667vw, -3.2vw) rotate(45deg);
    transform: translate(-2.66667vw, -3.2vw) rotate(45deg);
  }
}

@-webkit-keyframes modalFadeIn {
  0% {
    display: none;
    opacity: 0;
  }

  1% {
    display: block;
    opacity: 0;
  }

  100% {
    display: block;
    opacity: 1;
  }
}

@keyframes modalFadeIn {
  0% {
    display: none;
    opacity: 0;
  }

  1% {
    display: block;
    opacity: 0;
  }

  100% {
    display: block;
    opacity: 1;
  }
}

.modBanner {
  width: 100%;
  max-width: 1600px;
  min-width: 1080px;
  margin: 0 auto;
  margin-bottom: 240px;
}

@media screen and (max-width: 767px) {
  .modBanner {
    max-width: inherit;
    min-width: 0;
  }
}

@media screen and (max-width: 767px) {
  .modBanner {
    margin-bottom: 42.66667vw;
  }
}

.modBanner .inner {
  display: flex;
  width: 88.88889%;
  background-color: #333;
  color: #fff;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .modBanner .inner {
    display: block;
    width: 86.4vw;
  }
}

.modBanner figure {
  order: 2;
  width: 42.8125%;
}

@media screen and (max-width: 767px) {
  .modBanner figure {
    width: auto;
  }
}

.modBanner figure img {
  width: 100%;
}

.modBanner dl {
  order: 1;
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 40px;
}

@media screen and (max-width: 767px) {
  .modBanner dl {
    display: block;
    padding: 10.66667vw;
  }
}

.modBanner dt {
  font-size: 24px;
  line-height: 1.5em;
  margin-bottom: 12px;
}

@media screen and (max-width: 767px) {
  .modBanner dt {
    font-size: 2rem;
    margin-bottom: 5.33333vw;
  }
}

.modBanner .text {
  line-height: 1.625em;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .modBanner .text {
    line-size: 1.3rem;
    margin-bottom: 5.33333vw;
  }
}

.modBanner .button a {
  display: inline-block;
  width: 185px;
  text-align: center;
  color: #333;
  background-color: #fff;
  border-radius: 40px;
  padding: 18px 0;
}

@media screen and (max-width: 767px) {
  .modBanner .button a {
    width: 48vw;
    padding: 4.8vw 0;
  }
}

.modBanner .button a:hover {
  background-color: #ccc;
}

.modTopics {
  margin-bottom: 240px;
  min-width: 1080px;
}

@media screen and (max-width: 767px) {
  .modTopics {
    margin-bottom: 42.66667vw;
    min-width: 0;
  }
}

.modTopics h2 {
  width: 100%;
  max-width: 1600px;
  min-width: 1080px;
  margin: 0 auto;
  font-size: 36px;
  margin: 0 0 100px 0;
}

@media screen and (max-width: 767px) {
  .modTopics h2 {
    max-width: inherit;
    min-width: 0;
  }
}

@media screen and (max-width: 767px) {
  .modTopics h2 {
    font-size: 2.8rem;
    margin: 0 0 14.93333vw 0;
  }
}

.modTopics .swiper-slide {
  width: 380px;
  margin-right: 40px;
}

@media screen and (max-width: 767px) {
  .modTopics .swiper-slide {
    width: 48vw;
    margin-right: 5.33333vw;
  }
}

.modTopics .swiper-slide figure {
  padding-top: 66.31579%;
  overflow: hidden;
  position: relative;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .modTopics .swiper-slide figure {
    margin-bottom: 4vw;
  }
}

.modTopics .swiper-slide .ofi-img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  transition: 0.3s;
}

.modTopics .swiper-slide dl dt {
  line-height: 1.75em;
  margin-bottom: 10px;
  transition: 0.3s;
}

@media screen and (max-width: 767px) {
  .modTopics .swiper-slide dl dt {
    font-size: 1.2rem;
    margin-bottom: 2.66667vw;
  }
}

.modTopics .swiper-slide dl dd {
  font-size: 15px;
  display: inline-block;
  margin-right: 1.2em;
  transition: 0.3s;
}

@media screen and (max-width: 767px) {
  .modTopics .swiper-slide dl dd {
    font-size: 0.9rem;
  }
}

.modTopics .swiper-slide a:hover .ofi-img {
  -webkit-transform: translate(-50%, -50%) scale(1.1);
  transform: translate(-50%, -50%) scale(1.1);
}

.modTopics .swiper-slide a:hover dt,
.modTopics .swiper-slide a:hover dd {
  color: #999;
}

.modTopics .swiper-nav {
  width: 100%;
  max-width: 1600px;
  min-width: 1080px;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-55.5%);
  transform: translateX(-55.5%);
}

@media screen and (max-width: 767px) {
  .modTopics .swiper-nav {
    max-width: inherit;
    min-width: 0;
  }
}

.modTopics .swiper-next,
.modTopics .swiper-prev {
  width: 60px;
  height: 60px;
  border: 1px solid #ddd;
  border-radius: 100%;
  cursor: pointer;
  position: absolute;
  top: 0;
  transition: 0.3s;
}

@media screen and (max-width: 767px) {
  .modTopics .swiper-next,
  .modTopics .swiper-prev {
    display: none;
  }
}

.modTopics .swiper-next::before,
.modTopics .swiper-prev::before {
  content: "";
  width: 16px;
  height: 13px;
  background-image: url(../../img/common/arrow_01.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.modTopics .swiper-next:hover,
.modTopics .swiper-prev:hover {
  border: 1px solid #000;
  opacity: 1;
  filter: alpha(opacity=100);
}

.modTopics .swiper-next.swiper-button-disabled,
.modTopics .swiper-prev.swiper-button-disabled {
  cursor: inherit;
}

.modTopics .swiper-next.swiper-button-disabled::before,
.modTopics .swiper-prev.swiper-button-disabled::before {
  opacity: 0.25;
  filter: alpha(opacity=25);
}

.modTopics .swiper-next.swiper-button-disabled::before:hover,
.modTopics .swiper-prev.swiper-button-disabled::before:hover {
  opacity: 0.25;
  filter: alpha(opacity=25);
}

.modTopics .swiper-next.swiper-button-disabled:hover,
.modTopics .swiper-prev.swiper-button-disabled:hover {
  border: 1px solid #ddd;
}

.modTopics .swiper-next {
  right: 0;
}

.modTopics .swiper-prev {
  right: 70px;
}

@media screen and (max-width: 767px) {
  .modTopics .swiper-prev {
    right: 12.8vw;
  }
}

.modTopics .swiper-prev::before {
  -webkit-transform: translate(-50%, -50%) scale(-1, 1);
  transform: translate(-50%, -50%) scale(-1, 1);
}

.modSecHeader {
  display: flex;
  align-items: center;
  margin: 0 0 40px 5.55556%;
}

@media screen and (max-width: 767px) {
  .modSecHeader {
    display: block;
    margin: 0 8vw 10.66667vw 8vw;
  }
}

.modSecHeader h2 {
  font-size: 36px;
  color: #000;
  margin-right: 30px;
}

@media screen and (max-width: 767px) {
  .modSecHeader h2 {
    font-size: 3.6rem;
    margin: 0 0 5.33333vw 0;
  }
}

.modSecHeader .exp {
  font-size: 14px;
  line-height: 1.85714em;
}

@media screen and (max-width: 767px) {
  .modSecHeader .exp {
    font-size: 1.2rem;
  }
}

.modList2Col,
.modList3Col,
.modList4Col {
  padding: 0 5.55556%;
  margin-bottom: 120px;
}

@media screen and (max-width: 767px) {
  .modList2Col,
  .modList3Col,
  .modList4Col {
    padding: 0 8vw;
    margin-bottom: 26.66667vw;
  }
}

.modList2Col ul,
.modList3Col ul,
.modList4Col ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin: 0 -10px;
}

@media screen and (max-width: 767px) {
  .modList2Col ul,
  .modList3Col ul,
  .modList4Col ul {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .modList2Col ul li,
  .modList3Col ul li,
  .modList4Col ul li {
    margin-bottom: 8vw;
  }

  .modList2Col ul li:last-child,
  .modList3Col ul li:last-child,
  .modList4Col ul li:last-child {
    margin-bottom: 0;
  }
}

.modList2Col ul li a,
.modList3Col ul li a,
.modList4Col ul li a {
  display: block;
}

.modList2Col ul li a:hover figure img,
.modList3Col ul li a:hover figure img,
.modList4Col ul li a:hover figure img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.modList2Col ul li figure,
.modList3Col ul li figure,
.modList4Col ul li figure {
  overflow: hidden;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .modList2Col ul li figure,
  .modList3Col ul li figure,
  .modList4Col ul li figure {
    margin-bottom: 4.4vw;
  }
}

.modList2Col ul li figure img,
.modList3Col ul li figure img,
.modList4Col ul li figure img {
  width: 100%;
  transition: 0.3s;
}

.modList2Col ul li .text,
.modList3Col ul li .text,
.modList4Col ul li .text {
  font-size: 18px;
  line-height: 1.44444em;
  color: #000;
}

@media screen and (max-width: 767px) {
  .modList2Col ul li .text,
  .modList3Col ul li .text,
  .modList4Col ul li .text {
    font-size: 1.4rem;
  }
}

.modList2Col ul li .postscript,
.modList3Col ul li .postscript,
.modList4Col ul li .postscript {
  font-size: 14px;
  line-height: 1.85714em;
}

@media screen and (max-width: 767px) {
  .modList2Col ul li .postscript,
  .modList3Col ul li .postscript,
  .modList4Col ul li .postscript {
    font-size: 1.2rem;
  }
}

.modList2Col ul li .text + .postscript,
.modList3Col ul li .text + .postscript,
.modList4Col ul li .text + .postscript {
  margin-top: 8px;
}

.postscript span {
  font-size: 11px !important;
}

@media screen and (max-width: 767px) {
  .modList2Col ul li .text + .postscript,
  .modList3Col ul li .text + .postscript,
  .modList4Col ul li .text + .postscript {
    margin-top: 2.13333vw;
  }
}

.modList2Col ul li {
  width: 49.21875%;
}

@media screen and (max-width: 767px) {
  .modList2Col ul li {
    width: auto;
  }
}

.modList3Col ul li {
  width: 33.333%;
  padding: 0 10px;
}

@media screen and (max-width: 767px) {
  .modList3Col ul li {
    width: auto;
    padding: 0;
  }
}

.modList4Col ul li {
  width: 23.4375%;
}

@media screen and (max-width: 767px) {
  .modList4Col ul li {
    width: auto;
  }
}

.modListButton {
  text-align: center;
  margin-bottom: 80px;
}

@media screen and (max-width: 767px) {
  .modListButton {
    -moz-text-align-last: left;
    text-align-last: left;
    margin: 0 8vw 26.66667vw 8vw;
  }
}

.modListButton a {
  display: inline-block;
  font-size: 14px;
  border-radius: 25px;
  border: 1px solid #999;
  padding: 17px 30px;
}

@media screen and (max-width: 767px) {
  .modListButton a {
    font-size: 1.4rem;
    padding: 4.53333vw 8vw;
    border-radius: 6.66667vw;
  }
}

.modListButton a:hover {
  color: #000;
  border: 1px solid #000;
}

.modList4Col + .modListButton {
  margin-top: -70px;
}

@media screen and (max-width: 767px) {
  .modList4Col + .modListButton {
    margin-top: -16vw;
  }
}

.modWallBanner {
  padding: 0 5.55556%;
  margin-bottom: 120px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .modWallBanner {
    padding: 0;
    margin: 0 8vw 26.66667vw 8vw;
  }
}

.modWallBanner .product {
  width: 22.91667%;
  color: #000;
  background-color: #fff;
  position: absolute;
  top: 50%;
  right: 5.55556%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  padding: 75px 0 75px 3.81944%;
}

@media screen and (max-width: 767px) {
  .modWallBanner .product {
    width: 77.33333vw;
    position: static;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    padding: 10.66667vw 18.66667vw 10.66667vw 0;
    margin-top: -5.33333vw;
  }
}

.modWallBanner .product .type {
  font-size: 16px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .modWallBanner .product .type {
    font-size: 1.2rem;
    margin-bottom: 6.66667vw;
  }
}

.modWallBanner .product h2 {
  width: 85.45455%;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .modWallBanner .product h2 {
    width: 57.33333vw;
    margin-bottom: 6.66667vw;
  }
}

.modWallBanner .product h2 img {
  width: 100%;
}

.modWallBanner .product .text {
  font-size: 14px;
  line-height: 2.28571em;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .modWallBanner .product .text {
    font-size: 1.3rem;
    margin-bottom: 6.66667vw;
  }
}

.modWallBanner .product .button a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 190px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  background-color: #333;
  border-radius: 25px;
}

@media screen and (max-width: 767px) {
  .modWallBanner .product .button a {
    width: 48vw;
    height: 13.33333vw;
    font-size: 1.4rem;
    border-radius: 6.66667vw;
  }
}

.modWallBanner .product .button a:hover {
  background-color: #555;
}

.modWallBanner .bg {
  height: 600px;
}

@media screen and (max-width: 767px) {
  .modWallBanner .bg {
    height: 69.33333vw;
  }
}

.modWallBanner .bg img {
  width: 100%;
}

.modSecSpec {
  width: 88.88889%;
  background: linear-gradient(135deg, #f5f5f5 0%, #ececf0 100%);
  padding: 60px;
  margin: 0 auto 180px auto;
}

@media screen and (max-width: 767px) {
  .modSecSpec {
    width: auto;
    background: transparent;
    padding: 0;
    margin: 0 8vw 40vw 8vw;
  }
}

.modSecSpec .type {
  display: flex;
  justify-content: space-between;
  margin-bottom: 60px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .type {
    display: block;
    margin-bottom: 13.33333vw;
  }
}

.modSecSpec .type .image {
  width: 66.37931%;
  background-color: #fff;
}

@media screen and (max-width: 767px) {
  .modSecSpec .type .image {
    width: 100%;
    margin-bottom: 8vw;
  }
}

.modSecSpec .type .image img {
  width: 100%;
}

.modSecSpec .type .text {
  display: flex;
  flex-flow: column;
  justify-content: center;
  width: 33.18966%;
  background-color: #e4e4e5;
  padding: 0 1.72414% 0 3.44828%;
  margin-left: 0.43103%;
}

@media screen and (max-width: 767px) {
  .modSecSpec .type .text {
    width: auto;
    background-color: transparent;
    padding: 0;
    margin-left: 0;
  }
}

.modSecSpec .type .text dt span {
  display: block;
}

.modSecSpec .type .text dt .en {
  font-size: 36px;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .type .text dt .en {
    font-size: 2.4rem;
    margin-bottom: 4vw;
  }
}

.modSecSpec .type .text dt .jp {
  font-size: 14px;
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .type .text dt .jp {
    font-size: 1.2rem;
    margin-bottom: 6.66667vw;
  }
}

.modSecSpec .type .text dd {
  font-size: 13px;
  line-height: 2.46154em;
}

@media screen and (max-width: 767px) {
  .modSecSpec .type .text dd {
    font-size: 1.2rem;
  }
}

.modSecSpec .spec {
  display: flex;
  justify-content: space-between;
  background-color: #fff;
  padding: 50px 1.72414% 50px 4.31034%;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec {
    display: block;
    padding: 0;
  }
}

.modSecSpec .spec .text {
  width: 520px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec .text {
    width: auto;
  }
}

.modSecSpec .spec .text h3 {
  font-size: 28px;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec .text h3 {
    font-size: 2.4rem;
    margin-bottom: 4vw;
  }
}

.modSecSpec .spec .text .exp {
  font-size: 14px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec .text .exp {
    font-size: 1.2rem;
    margin-bottom: 9.33333vw;
  }
}

.modSecSpec .spec .text dl div {
  display: flex;
  background-color: #f5f5f5;
  margin-bottom: 12px;
  padding: 30px 0;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec .text dl div {
    display: block;
    margin-bottom: 2.13333vw;
    padding: 5.33333vw 0;
  }

  .modSecSpec .spec .text dl div:nth-of-type(1) img {
    width: 32.26667vw;
  }

  .modSecSpec .spec .text dl div:nth-of-type(2) img {
    width: 40vw;
  }

  .modSecSpec .spec .text dl div:nth-of-type(3) img {
    width: 65.6vw;
  }

  .modSecSpec .spec .text dl div:nth-of-type(4) img {
    width: 69.86667vw;
  }
}

@media screen and (min-width: 768px) {
  .modSecSpec .spec .text dl div.sp {
    display: none;
  }
}

.modSecSpec .spec .text dl div dt {
  display: flex;
  align-items: center;
  line-height: 1.5em;
  width: 190px;
  padding-left: 30px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec .text dl div dt {
    width: 100%;
    justify-content: center;
    font-size: 1.6rem;
    padding-left: 0;
  }
}

.modSecSpec .spec .text dl div dd {
  width: 330px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec .text dl div dd {
    width: 100%;
    text-align: center;
    padding-top: 3.2vw;
  }
}

.modSecSpec .spec .text > .image.sp {
  width: 69.86667vw;
  margin: 0 auto 10.66667vw auto;
}

.modSecSpec .spec .text > .image.sp img {
  width: 100%;
}

.modSecSpec .spec > .image {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  text-align: center;
  margin-left: 20px;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec > .image {
    margin-left: 0;
  }
}

.modSecSpec .spec > .image img {
  width: 100%;
  max-width: 400px;
  margin-bottom: 25px;
}

.modSecSpec .spec > .image figcaption {
  width: 100%;
  font-size: 11px;
  text-align: right;
}

@media screen and (max-width: 767px) {
  .modSecSpec .spec > .image figcaption {
    font-size: 1.1rem;
  }
}

.modPhotolibrary {
  margin-bottom: 180px;
}

@media screen and (max-width: 767px) {
  .modPhotolibrary {
    margin-bottom: 32vw;
  }
}

.modPhotolibrary .photowrap {
  position: relative;
}

@media screen and (min-width: 768px) {
  .modPhotolibrary .photowrap {
    width: 100%;
    height: 0;
    padding-top: 47.5%;
    margin-bottom: 4.5em;
  }
}

.modPhotolibrary .photos {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .modPhotolibrary .photos {
    position: absolute;
    height: calc(100% + 4.5em);
    top: 0;
    left: 0;
  }
}

.modPhotolibrary .photos .swiper-slide figure {
  width: 100%;
  height: 100%;
}

.modPhotolibrary .photos .swiper-slide figure img {
  display: block;
  width: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  background: #eeeeee;
  padding: 20px 0 0 0;
}

@media screen and (min-width: 768px) {
  .modPhotolibrary .photos .swiper-slide figure img {
    height: calc(100% - 3em);
  }
}

@media screen and (max-width: 767px) {
  .modPhotolibrary .photos .swiper-slide figure img {
    height: auto;
  }
}

.modPhotolibrary .photos .swiper-slide figcaption {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  line-height: 1.5;
  padding: 0;
}

@media screen and (min-width: 768px) {
  .modPhotolibrary .photos .swiper-slide figcaption {
    height: 3em;
  }
}

@media screen and (max-width: 767px) {
  .modPhotolibrary .photos .swiper-slide figcaption {
    font-size: 1.2rem;
    padding: 1em;
  }
}

.modPhotolibrary .thumbnails {
  padding: 7px 0;
}

@media screen and (min-width: 768px) {
  .modPhotolibrary .thumbnails .swiper-wrapper {
    justify-content: center;
  }
}

.modPhotolibrary .thumbnails .swiper-slide {
  position: relative;
  width: auto;
  cursor: pointer;
}

.modPhotolibrary .thumbnails .swiper-slide:not(:last-child) {
  margin-right: 10px;
}

@media screen and (max-width: 767px) {
  .modPhotolibrary .thumbnails .swiper-slide:not(:last-child) {
    margin-right: 1.6vw;
  }
}

.modPhotolibrary .thumbnails .swiper-slide.swiper-slide-thumb-active:after {
  content: "";
  position: absolute;
  width: calc(100% + 10px);
  height: calc(100% + 10px);
  border: #a78a5a solid 4px;
  left: -5px;
  top: -5px;
}

@media screen and (max-width: 767px) {
  .modPhotolibrary .thumbnails .swiper-slide.swiper-slide-thumb-active:after {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
  }
}

.modPhotolibrary .thumbnails img {
  display: block;
  width: 180px;
}

@media screen and (max-width: 1280px) and (min-width: 768px) {
  .modPhotolibrary .thumbnails img {
    width: 160px;
  }
}

@media screen and (max-width: 767px) {
  .modPhotolibrary .thumbnails img {
    width: 20.53333vw;
  }
}

.modLineup {
  color: #fff;
  background: linear-gradient(-45deg, #000 0%, #2d2d2d 100%);
  text-align: center;
  padding: 130px 6.94444%;
  margin-bottom: 240px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .modLineup {
    padding: 18.66667vw 6.66667vw 13.33333vw 6.66667vw;
    margin-bottom: 26.66667vw;
  }
}

.modLineup h2 {
  font-size: 48px;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .modLineup h2 {
    font-size: 3.2rem;
    margin-bottom: 5.33333vw;
  }
}

.modLineup .read {
  font-size: 14px;
  margin-bottom: 75px;
}

@media screen and (max-width: 767px) {
  .modLineup .read {
    font-size: 1.2rem;
    margin-bottom: 13.33333vw;
  }
}

.modLineup .tab ul {
  display: flex;
  justify-content: space-between;
  margin-bottom: 17.33333vw;
}

.modLineup .tab ul li {
  width: 29%;
}

.page-freestanding .modLineup .tab ul li {
  width: 48%;
}

.modLineup .tab ul li:not(.active) figcaption,
.modLineup .tab ul li:not(.active) a::before {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.modLineup .tab ul li.active figcaption,
.modLineup .tab ul li.active a::before {
  opacity: 1;
  filter: alpha(opacity=100);
}

.modLineup .tab ul li.active a::after {
  content: "";
  border-style: solid;
  border-width: 2.66667vw 2.4vw 0 2.4vw;
  border-color: #fff transparent transparent transparent;
  position: absolute;
  left: 50%;
  bottom: -5.33333vw;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.modLineup .tab ul li a {
  display: block;
  position: relative;
}

.modLineup .tab ul li a::before {
  content: "";
  width: 100%;
  height: 0.53333vw;
  background-color: #fff;
  position: absolute;
  left: 0;
  bottom: -2.66667vw;
}

.modLineup .tab ul li figure img {
  width: 25.6vw;
  margin-bottom: 2.66667vw;
}

.page-freestanding .modLineup .tab ul li figure img {
  width: 32vw;
}

.modLineup .tab ul li figure figcaption {
  font-size: 2rem;
  color: #fff;
}

.modLineup .wrap {
  display: flex;
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .modLineup .wrap {
    display: block;
    margin-bottom: 8vw;
  }
}

.page-freestanding .modLineup .wrap {
  width: 68.75%;
  min-width: 880px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 767px) {
  .page-freestanding .modLineup .wrap {
    width: auto;
    min-width: 0;
  }
}

.modLineup .detail {
  width: 100%;
  position: relative;
}

.modLineup .detail::after {
  content: "";
  width: 1px;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0.25;
  filter: alpha(opacity=25);
}

@media screen and (max-width: 767px) {
  .modLineup .detail::after {
    display: none;
  }
}

.modLineup .detail:last-of-type::after {
  display: none;
}

.modLineup .detail .catch {
  font-size: 18px;
  line-height: 1.55556em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .catch {
    font-size: 1.8rem;
    margin-bottom: 8vw;
  }
}

.modLineup .detail .image {
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .image {
    margin-bottom: 6.66667vw;
  }
}

.modLineup .detail .image img {
  width: 255px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .image img {
    width: 67.73333vw;
  }
}

.modLineup .detail h3 {
  font-size: 36px;
  margin-bottom: 12px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail h3 {
    font-size: 3.6rem;
    margin-bottom: 2.66667vw;
  }
}

.modLineup .detail .type {
  font-size: 12px;
  margin-bottom: 12px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .type {
    font-size: 1.2rem;
    margin-bottom: 4.8vw;
  }
}

.modLineup .detail .color {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .color {
    margin-bottom: 6.4vw;
  }
}

.modLineup .detail .color li {
  width: 28px;
  margin: 0 6px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .color li {
    width: 7.46667vw;
    margin: 0 2.66667vw;
  }
}

.modLineup .detail .color li img {
  width: 100%;
}

.modLineup .detail .buttonDetail a,
.modLineup .detail .buttonBuy a {
  display: inline-block;
  font-size: 12px;
  width: 160px;
  padding: 13px 0;
  border-radius: 20px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .buttonDetail a,
  .modLineup .detail .buttonBuy a {
    font-size: 1.4rem;
    width: 53.33333vw;
    padding: 4.53333vw 0;
    border-radius: 6.66667vw;
  }
}

.modLineup .detail .buttonDetail {
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .buttonDetail {
    margin-bottom: 2.66667vw;
  }
}

.modLineup .detail .buttonDetail a {
  background-color: #fff;
}

.modLineup .detail .buttonDetail a:hover {
  background-color: #ccc;
}

.modLineup .detail .buttonBuy {
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .buttonBuy {
    margin-bottom: 8vw;
  }
}

.modLineup .detail .buttonBuy a {
  color: #fff;
  background-color: #a08963;
}

.modLineup .detail .buttonBuy a:hover {
  background-color: #8d744b;
}

.modLineup .detail .size {
  font-size: 20px;
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .size {
    font-size: 2rem;
    margin-bottom: 6.66667vw;
  }
}

.modLineup .detail .size::before {
  content: "対応サイズ";
  display: block;
  font-size: 12px;
  margin-bottom: 5px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .size::before {
    font-size: 1.2rem;
    margin-bottom: 1.6vw;
  }
}

.modLineup .detail .base,
.modLineup .detail .panel,
.modLineup .detail .height,
.modLineup .detail .storage,
.modLineup .detail .resistant {
  font-size: 18px;
  margin-bottom: 28px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .base,
  .modLineup .detail .panel,
  .modLineup .detail .height,
  .modLineup .detail .storage,
  .modLineup .detail .resistant {
    font-size: 1.8rem;
    margin-bottom: 7.46667vw;
  }
}

.modLineup .detail .base .thickness {
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .base .thickness {
    font-size: 1.2rem;
  }
}

.modLineup .detail .height {
  display: flex;
  justify-content: center;
}

.modLineup .detail .height li {
  margin: 0 24px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .height li {
    width: 50%;
    margin: 0;
  }
}

.modLineup .detail .height li::before {
  display: block;
  font-size: 12px;
  margin-bottom: 5px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .height li::before {
    font-size: 1.2rem;
    margin-bottom: 1.6vw;
  }
}

.modLineup .detail .height li.low::before {
  content: "LOW TYPE";
}

.modLineup .detail .height li.high::before {
  content: "HIGH TYPE";
}

.modLineup .detail .height li.active::before {
  content: "ACTIVE TYPE";
}

.modLineup .detail .height li.base::before {
  content: "BASE TYPE";
}

.modLineup .detail .height li.low::after,
.modLineup .detail .height li.active::after {
  content: "";
  width: 1px;
  height: 100%;
  background-color: #fff;
  opacity: 0.25;
  filter: alpha(opacity=25);
  position: absolute;
  top: 0;
  right: -24px;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .height li.low::after,
  .modLineup .detail .height li.active::after {
    right: 0;
  }
}

.modLineup .detail .resistant {
  margin-bottom: 0;
}

.modLineup .detail .resistant span.caution {
  font-size: 11px;
  vertical-align: text-top;
}

@media screen and (max-width: 767px) {
  .modLineup .detail .resistant span.caution {
    font-size: 1rem;
  }
}

.modLineup p.caution {
  font-size: 11px;
  color: #ccc;
  text-align: right;
}

@media screen and (max-width: 767px) {
  .modLineup p.caution {
    font-size: 0.9rem;
    line-height: 1.44444em;
    text-align: center;
  }
}

.modLineup .wrap + p.caution {
  margin-bottom: 90px;
}

@media screen and (max-width: 767px) {
  .modLineup .wrap + p.caution {
    margin-bottom: 13.33333vw;
  }
}

@media screen and (max-width: 767px) {
  .modLineup .comparison + p.caution {
    text-align: left;
  }
}

.modLineup #lineup-v4.detail .height {
  padding-top: 8px;
}

@media screen and (max-width: 767px) {
  .modLineup #lineup-v4.detail .height {
    padding: 2.13333vw 0;
  }
}

.modLineup .comparison {
  display: flex;
  background: #222;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .modLineup .comparison {
    display: block;
    margin-bottom: 2.66667vw;
  }
}

.modLineup .comparison h3 {
  width: 30.35714%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 28px;
  line-height: 1.57143em;
  color: #fff;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .modLineup .comparison h3 {
    width: auto;
    font-size: 1.8rem;
    padding: 8vw 0;
  }
}

.modLineup .comparison .tableWrap {
  flex: 1;
  width: 100%;
}

.modLineup .comparison table {
  width: 100%;
}

.modLineup .comparison table th,
.modLineup .comparison table td {
  width: 190px;
  font-size: 14px;
  vertical-align: middle;
  padding: 20px;
  border: 1px solid #555;
}

@media screen and (max-width: 767px) {
  .modLineup .comparison table th,
  .modLineup .comparison table td {
    width: 18.13333vw;
    font-size: 1.1rem;
    line-height: 1.45455em;
    padding: 2.66667vw;
  }
}

.modLineup .comparison table th:first-child,
.modLineup .comparison table td:first-child {
  width: 280px;
  font-weight: normal;
  border-left: none;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .modLineup .comparison table th:first-child,
  .modLineup .comparison table td:first-child {
    width: auto;
  }
}

.modLineup .comparison table th:last-child,
.modLineup .comparison table td:last-child {
  border-right: none;
}

.modLineup .comparison table tr:first-child th {
  border-top: none;
  text-align: center;
}

.modLineup .comparison table .gr1 {
  background-color: #404040;
}

.modLineup .comparison table .gr2 {
  background-color: #333;
}

header.pc {
  height: 60px;
  background-color: #fff;
  position: relative;
  z-index: +5000;
}

header.pc .global {
  width: 100%;
  max-width: 1600px;
  min-width: 1080px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 3.47222%;
}

@media screen and (max-width: 767px) {
  header.pc .global {
    max-width: inherit;
    min-width: 0;
  }
}

header.pc h1 {
  width: 110px;
}

header.pc h1 img {
  width: 100%;
}

header.pc .product,
header.pc .member {
  flex-basis: auto;
  display: flex;
  align-items: center;
}

header.pc .product > li {
  margin-top: 0px;
  height: 60px;
  margin-left: 24px;
  position: relative;
  display: flex;
  align-items: center;
}

header.pc .product > li > a {
  display: inline-block;
  font-size: 12px;
  color: #333;
  white-space: nowrap;
  position: relative;
}

header.pc .product > li > a:hover {
  color: #999;
}

header.pc .member > li {
  margin-top: 15px;
  height: 45px;
  margin-left: 26px;
  position: relative;
}

header.pc .member > li > a {
  display: inline-block;
  font-size: 8px;
  color: #333;
  white-space: nowrap;
  padding-top: 26px;
  position: relative;
}

header.pc .member > li > a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

header.pc .member > li > a::before {
  content: "";
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

header.pc .member > li.search > a::before {
  width: 18px;
  height: 18px;
  background-image: url(../../img/common/ic_nav_search.svg);
}

header.pc .member > li.catalog > a::before {
  width: 21px;
  height: 18px;
  background-image: url(../../img/common/ic_nav_catalog.svg);
}

header.pc .member > li.login > a::before {
  width: 18px;
  height: 18px;
  background-image: url(../../img/common/ic_nav_login.svg);
}

header.pc .member > li.cart > a::before {
  width: 22px;
  height: 18px;
  background-image: url(../../img/common/ic_nav_cart.svg);
}

header.pc .sub-v-series,
header.pc .sub-freestanding {
  display: flex;
  background-color: #fff;
  position: absolute;
  top: 60px;
  left: -30px;
  padding: 0 10px 10px 10px;
}

header.pc .sub-v-series li,
header.pc .sub-freestanding li {
  margin-right: 4px;
}

header.pc .sub-v-series li:last-child,
header.pc .sub-freestanding li:last-child {
  margin-right: 0;
}

header.pc .sub-v-series li a,
header.pc .sub-freestanding li a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 160px;
  height: 160px;
  background: linear-gradient(135deg, #fdfdfd 0%, #f2f2f5 100%);
}

header.pc .sub-v-series li a:hover,
header.pc .sub-freestanding li a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

header.pc .sub-v-series li a figcaption,
header.pc .sub-freestanding li a figcaption {
  font-size: 11px;
  font-weight: bold;
  margin-top: 5px;
  line-height: 1.5;
}

header.pc .sub-v-series li a figcaption span,
header.pc .sub-freestanding li a figcaption span {
  display: block;
  font-size: 9px;
  font-weight: normal;
  margin-top: 2px;
}

header.pc .sub-v-series img,
header.pc .sub-freestanding img {
  margin: 10px 0;
}

header.pc .sub-v-series {
  width: 508px;
}

header.pc .sub-v-series.sub-v-series--4 {
  width: 672px;
}

header.pc .sub-v-series img {
  width: 129px;
}

header.pc .sub-freestanding {
  width: 344px;
}

header.pc .sub-freestanding img {
  width: 136px;
}

header.pc .sub-search {
  width: 240px;
  background-color: #fff;
  position: absolute;
  top: 55px;
  right: -30px;
  padding: 15px;
}

header.pc .sub-search .inputWrap {
  display: flex;
  border-bottom: 1px solid #ccc;
}

header.pc .sub-search .inputWrap input {
  font-size: 14px;
  height: 17px;
}

header.pc .sub-search .inputWrap button {
  vertical-align: middle;
  margin: 0 15px 6px 0;
}

header.pc .sub-search .inputWrap button img {
  width: 17px;
}

header.pc .sub-catalog {
  width: 200px;
  background-color: #fff;
  position: absolute;
  top: 55px;
  right: -15px;
}

header.pc .sub-catalog li a {
  display: flex;
  justify-content: left;
  align-items: center;
  width: 100%;
  height: 50px;
  font-size: 12px;
  padding: 10px 0 10px 30px;
}

header.pc .sub-catalog li a:hover {
  background-color: #eee;
}

header.pc .sub-catalog li a::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-size: 100% auto;
  vertical-align: middle;
  margin-right: 8px;
}

header.pc .sub-catalog li.digital a::before {
  background-image: url(https://equals.itembox.design/item/assets/img/common/ic_nav_digital-01.svg);
}
header.pc .sub-catalog li.option a::before {
  background-image: url(https://equals.itembox.design/item/assets/img/common/ic_nav_option_01.svg);
}

header.pc .sub-catalog li.request a::before {
  background-image: url(../../img/common/ic_nav_catalog.svg);
}

header.sp {
  height: 48px;
  background-color: #fff;
  position: relative;
  z-index: 20000;
}

header.sp .global {
  width: 100%;
  height: 48px;
  display: flex;
  align-items: center;
  padding: 0 20px 0 18px;
}

header.sp h1 {
  width: 70px;
}

@media screen and (max-width: 767px) {
  header.sp h1 {
    width: 18.66667vw;
  }
}

header.sp h1 img {
  width: 100%;
}

header.sp .cart {
  width: 19px;
  margin-left: auto;
}

@media screen and (max-width: 767px) {
  header.sp .cart {
    width: 5.06667vw;
  }
}

header.sp .cart img {
  width: 100%;
}

#dispNav {
  cursor: pointer;
  position: relative;
  width: 24px;
  height: 9px;
  margin-left: 25px;
}

@media screen and (max-width: 767px) {
  #dispNav {
    width: 6.4vw;
    height: 2.4vw;
    margin-left: 6.66667vw;
  }
}

#dispNav span {
  display: block;
  box-sizing: border-box;
  position: absolute;
  right: 0;
  width: 100%;
  height: 1px;
  background: #666;
  transition: 0.3s;
}

#dispNav span:nth-of-type(1) {
  top: 0;
}

#dispNav span:nth-of-type(2) {
  top: 4px;
}

@media screen and (max-width: 767px) {
  #dispNav span:nth-of-type(2) {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
}

#dispNav span:nth-of-type(3) {
  width: 50%;
  bottom: 0;
}

#dispNav.active span:nth-of-type(1) {
  -webkit-transform: translateY(4px) rotate(-25deg);
  transform: translateY(4px) rotate(-25deg);
}

@media screen and (max-width: 767px) {
  #dispNav.active span:nth-of-type(1) {
    -webkit-transform: translateY(1.06667vw) rotate(-25deg);
    transform: translateY(1.06667vw) rotate(-25deg);
  }
}

#dispNav.active span:nth-of-type(2) {
  display: none;
}

#dispNav.active span:nth-of-type(3) {
  width: 100%;
  -webkit-transform: translateY(-4px) rotate(25deg);
  transform: translateY(-4px) rotate(25deg);
}

@media screen and (max-width: 767px) {
  #dispNav.active span:nth-of-type(3) {
    -webkit-transform: translateY(-1.06667vw) rotate(25deg);
    transform: translateY(-1.06667vw) rotate(25deg);
  }
}

#dispProductNav {
  width: 8px;
  height: 15px;
  cursor: pointer;
  position: relative;
  margin: 0 20px 0 auto;
}

@media screen and (min-width: 768px) {
  #dispProductNav {
    display: none;
  }
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #dispProductNav {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  #dispProductNav {
    width: 2.13333vw;
    height: 4vw;
    margin: 0 4vw 0 auto;
  }
}

#dispProductNav::after {
  content: "";
  width: 11px;
  height: 11px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -75%) rotate(45deg);
  transform: translate(-50%, -75%) rotate(45deg);
}

@media screen and (max-width: 767px) {
  #dispProductNav::after {
    width: 2.93333vw;
    height: 2.93333vw;
  }
}

#dispProductNav.active::after {
  -webkit-transform: translate(-50%, -25%) rotate(-135deg);
  transform: translate(-50%, -25%) rotate(-135deg);
}

#navSp {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 48px;
  left: 0;
}

@media screen and (max-width: 767px) {
  #navSp {
    position: fixed;
    top: 48px;
  }
}

#navSp .bg {
  width: 100%;
  height: calc(100vh - 48px);
  background-color: rgba(51, 51, 51, 0.75);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

@media screen and (max-width: 767px) {
  #navSp .bg {
    height: calc(100vh - 12.8vw);
  }
}

#navSp .inner {
  width: 100%;
  background: #fff;
  overflow-y: auto;
  padding: 0 12px 48px 12px;
}

@media screen and (max-width: 767px) {
  #navSp .inner {
    height: 100%;
    padding: 0 3.2vw 42.66667vw 3.2vw;
    -webkit-overflow-scrolling: touch;
  }
}

#navSp .member {
  width: 100%;
  display: flex;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  #navSp .member {
    margin-bottom: 5.33333vw;
  }
}

#navSp .member li {
  width: 50%;
  position: relative;
}

#navSp .member li:first-child::after {
  content: "";
  width: 1px;
  height: 40px;
  background-color: #eee;
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
  #navSp .member li:first-child::after {
    height: 10.66667vw;
  }
}

#navSp .member li a {
  display: block;
  font-size: 14px;
  text-align: center;
  padding: 22px 0;
}

@media screen and (max-width: 767px) {
  #navSp .member li a {
    font-size: 1.4rem;
    padding: 5.33333vw 0;
  }
}

#navSp .member li a::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-size: 100% auto;
  vertical-align: middle;
  margin-right: 12px;
}

@media screen and (max-width: 767px) {
  #navSp .member li a::before {
    width: 4.8vw;
    height: 4.8vw;
    margin-right: 3.2vw;
  }
}

#navSp .member li.login a::before {
  background-image: url(../../img/common/ic_nav_login_sp.svg);
}

#navSp .member li.registration a::before {
  background-image: url(../../img/common/ic_nav_regist_sp.svg);
}

#navSp .search {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  #navSp .search {
    margin-bottom: 5.33333vw;
  }
}

#navSp .search .inputWrap {
  display: flex;
  background: linear-gradient(165deg, #f8f8f8 0%, #f2f2f5 100%);
  padding: 17px;
}

@media screen and (max-width: 767px) {
  #navSp .search .inputWrap {
    padding: 4.53333vw;
  }
}

#navSp .search .inputWrap button {
  margin-right: 17px;
}

@media screen and (max-width: 767px) {
  #navSp .search .inputWrap button {
    margin-right: 4.53333vw;
  }
}

#navSp .search .inputWrap button img {
  width: 17px;
}

@media screen and (max-width: 767px) {
  #navSp .search .inputWrap button img {
    width: 4.53333vw;
  }
}

#navSp .search .inputWrap input {
  font-size: 1.6rem;
  width: 100%;
  flex: 1;
  box-sizing: border-box;
}

#navSp .product {
  display: flex;
  justify-content: space-between;
  margin-bottom: 48px;
}

@media screen and (max-width: 767px) {
  #navSp .product {
    flex-wrap: wrap;
    margin-bottom: 10.66667vw;
  }
}

#navSp .product li {
  width: 100%;
  height: 208px;
  margin-right: 10px;
}

@media screen and (max-width: 767px) {
  #navSp .product li {
    width: 45.33333vw;
    height: 50.66667vw;
    margin-right: 0;
    margin-bottom: 2.66667vw;
  }
}

#navSp .product li:last-child {
  margin-right: 0;
}

#navSp .product li a {
  height: 100%;
  background: linear-gradient(135deg, #fdfdfd 0%, #f2f2f5 100%);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

#navSp .product figure img {
  width: 156px;
}

@media screen and (max-width: 767px) {
  #navSp .product figure img {
    width: 38.13333vw;
  }
}

#navSp .product figure figcaption {
  font-size: 11px;
  line-height: 1.63636em;
  color: #333;
  text-align: center;
  margin-top: 12px;
}

@media screen and (max-width: 767px) {
  #navSp .product figure figcaption {
    font-size: 1.1rem;
    margin-top: 3.2vw;
  }
}

#navSp .wallCatalog {
  font-size: 14px;
  text-align: center;
  margin-bottom: 18px;
}

@media screen and (max-width: 767px) {
  #navSp .wallCatalog {
    font-size: 1.4rem;
    margin-bottom: 5.33333vw;
  }
}

#navSp .catalog {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  font-size: 11px;
  height: auto;
}

#navSp .catalog li {
  width: 45.33333vw;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  #navSp .catalog li {
    width: 45.33333vw;
    margin-right: 0;
    margin-bottom: 10px;
  }
}

#navSp .catalog li a {
  height: 100%;
  color: #fff;
  background-color: #555;
  border-radius: 6px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  line-height: 14px;
  padding: 4.33333vw 0;
}

@media screen and (max-width: 767px) {
  #navSp .catalog li a {
    padding: 4.33333vw 0;
  }
}

#navSp .catalog li a::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: 100% auto;
  vertical-align: middle;
  margin-right: 12px;
}

@media screen and (max-width: 767px) {
  #navSp .catalog li a::before {
    width: 4.26667vw;
    height: 4.26667vw;
    margin-right: 3.2vw;
  }
}

#navSp .catalog li.digital a::before {
  background-image: url(https://equals.itembox.design/item/assets/img/common/ic_nav_digital_sp02-01.svg);
}
#navSp .catalog li.option a::before {
  background-image: url(https://equals.itembox.design/item/assets/img/common/ic_nav_option_sp-01.svg);
}

#navSp .catalog li.request a::before {
  background-image: url(../../img/common/ic_nav_catalog_sp.svg);
}

#productHeader {
  width: 100%;
  height: 60px;
  background-color: #333;
  color: #fff;
  z-index: 10000;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #productHeader {
    height: 48px;
  }
}

@media screen and (max-width: 767px) {
  #productHeader {
    height: 12.8vw;
  }
}

#productHeader.phFixed {
  position: fixed;
  top: 0;
  left: 0;
}

#productHeader > .inner {
  width: 100%;
  max-width: 1600px;
  min-width: 1080px;
  margin: 0 auto;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 3.47222%;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  #productHeader > .inner {
    max-width: inherit;
    min-width: 0;
  }
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #productHeader > .inner {
    max-width: inherit;
    min-width: 0;
    padding: 0 20px 0 18px;
  }
}

@media screen and (max-width: 767px) {
  #productHeader > .inner {
    padding: 0 4.8vw;
  }
}

#productHeader > .inner h1 {
  display: flex;
  align-items: center;
  white-space: nowrap;
}

#productHeader > .inner h1 > span {
  font-size: 11px;
  margin-right: 1em;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #productHeader > .inner h1 > span {
    font-size: 9px;
  }
}

@media screen and (max-width: 767px) {
  #productHeader > .inner h1 > span {
    font-size: 0.9rem;
  }
}

#productHeader > .inner h1 strong {
  font-size: 22px;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #productHeader > .inner h1 strong {
    font-size: 18px;
  }
}

@media screen and (max-width: 767px) {
  #productHeader > .inner h1 strong {
    font-size: 1.6rem;
  }
}

#productHeader > .inner h1 strong span {
  font-weight: normal;
}

#productHeader > .inner ul {
  display: flex;
}

#productHeader > .inner ul li {
  margin: 0 10px;
}

#productHeader > .inner ul li a {
  color: #fff;
  font-size: 12px;
}

#productHeader > .inner ul li a:hover {
  color: #ccc;
}

#productHeader > .inner .button a {
  width: 160px;
  height: 36px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #ffa700;
  color: #fff;
  font-size: 12px;
  border-radius: 20px;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #productHeader > .inner .button a {
    width: 90px;
    height: 28px;
    font-size: 10px;
  }
}

@media screen and (max-width: 767px) {
  #productHeader > .inner .button a {
    width: 24vw;
    height: 7.46667vw;
    font-size: 1rem;
  }
}

#productHeader > .inner .button a:hover {
  background-color: #8d744b;
}

@media screen and (min-width: 768px) {
  #productNavPc {
    display: block;
    margin: 0 auto 0 1.38889%;
  }
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #productNavPc {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  #productNavPc {
    display: none;
  }
}

#productNavSp {
  display: none;
  width: 100%;
  height: calc(100vh - 96px);
  position: absolute;
  top: 126px;
  left: 0;
  z-index: 10000;
}

.isPhFixed #productNavSp {
  height: calc(100vh - 48px);
  top: 79px;
}

@media screen and (max-width: 767px) {
  #productNavSp {
    position: fixed;
    top: 108px;
    height: calc(100vh - 25.6vw);
  }

  .isPhFixed #productNavSp {
    top: 108px;
  }
}

#productNavSp .bg {
  width: 100%;
  height: 100%;
  background-color: rgba(51, 51, 51, 0.75);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

#productNavSp .inner {
  width: 320px;
  height: 100%;
  background: #333;
  overflow-y: auto;
  position: absolute;
  top: 0;
  right: 0;
  padding: 20px 24px;
}

@media screen and (max-width: 767px) {
  #productNavSp .inner {
    position: static;
    width: 100%;
    padding: 5.33333vw 5.33333vw 42.66667vw 5.33333vw;
    -webkit-overflow-scrolling: touch;
  }
}

#productNavSp .tv {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  #productNavSp .tv {
    margin-bottom: 4vw;
  }
}

#productNavSp .tv a {
  height: 100%;
  color: #fff;
  background-color: #555;
  border-radius: 6px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 17px 0;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #productNavSp .tv a {
    font-size: 14px;
  }
}

@media screen and (max-width: 767px) {
  #productNavSp .tv a {
    font-size: 1.4rem;
    padding: 4vw 0;
  }
}

#productNavSp .tv a::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url(../../img/common/ic_tv_sp.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  vertical-align: middle;
  margin-right: 12px;
}

@media screen and (max-width: 767px) {
  #productNavSp .tv a::before {
    width: 5.6vw;
    height: 5.6vw;
    margin-right: 3.2vw;
  }
}

#productNavSp .product {
  padding: 0 20px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  #productNavSp .product {
    padding: 0 2.66667vw;
    margin-bottom: 10.13333vw;
  }
}

#productNavSp .product li {
  border-bottom: 1px solid #444;
}

#productNavSp .product li a {
  display: block;
  font-size: 14px;
  color: #fff;
  padding: 20px 0;
}

@media screen and (max-width: 767px) {
  #productNavSp .product li a {
    font-size: 1.4rem;
    padding: 5.33333vw 0;
  }
}

#productNavSp .wallCatalog {
  font-size: 12px;
  color: #ddd;
  text-align: center;
  margin-bottom: 18px;
}

@media screen and (max-width: 767px) {
  #productNavSp .wallCatalog {
    font-size: 1.4rem;
    margin-bottom: 5.33333vw;
  }
}

#productNavSp .catalog {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  height: auto;
}

#productNavSp .catalog li {
  width: 100%;
}

@media screen and (max-width: 767px) {
  #productNavSp .catalog li {
    width: 43.33333vw;
    margin-bottom: 10px;
  }
}

#productNavSp .catalog li a {
  height: 100%;
  color: #fff;
  font-size: 12px;
  background-color: #555;
  border-radius: 6px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 17px 0;
  line-height: 14px;
}

@media screen and (max-width: 767px) {
  #productNavSp .catalog li a {
    font-size: 1rem;
    padding: 4.33333vw 0;
  }
}

#productNavSp .catalog li a::before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  background-repeat: no-repeat;
  background-size: 100% auto;
  vertical-align: middle;
  margin-right: 12px;
}

@media screen and (max-width: 767px) {
  #productNavSp .catalog li a::before {
    width: 4.26667vw;
    height: 4.26667vw;
    margin-right: 3.2vw;
  }
}

#productNavSp .catalog li.digital a::before {
  background-image: url(https://equals.itembox.design/item/assets/img/common/ic_nav_digital_sp02-01.svg);
}
#productNavSp .catalog li.option a::before {
  background-image: url(https://equals.itembox.design/item/assets/img/common/ic_nav_option_sp-01.svg);
}

#productNavSp .catalog li.request a::before {
  background-image: url(../../img/common/ic_nav_catalog_sp.svg);
}

#pagetop {
  position: absolute;
  z-index: 994;
  right: 5.55556%;
}

@media screen and (max-width: 767px) {
  #pagetop {
    top: -8vw;
    right: 6.66667vw;
  }
}

#pagetop svg {
  width: 68px;
}

@media screen and (max-width: 767px) {
  #pagetop svg {
    width: 16vw;
  }
}

#pagetop svg g {
  fill: #000;
  transition: 0.3s;
}

#pagetop:hover svg g {
  fill: #555;
}

footer {
  min-width: 1080px;
  background-color: #333;
  color: #fff;
}

@media screen and (max-width: 767px) {
  footer {
    min-width: 0;
  }
}

footer a {
  color: #ccc;
}

footer a:hover {
  color: #fff;
}

footer nav {
  width: 100%;
  max-width: 1600px;
  min-width: 1080px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 110px 5.55556% 80px 5.55556%;
  position: relative;
}

@media screen and (max-width: 767px) {
  footer nav {
    max-width: inherit;
    min-width: 0;
  }
}

@media screen and (max-width: 767px) {
  footer nav {
    display: block;
    padding: 13.33333vw 6.66667vw;
  }
}

footer .sns {
  order: 4;
  width: 180px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

@media screen and (max-width: 767px) {
  footer .sns {
    width: 61.33333vw;
    margin: 0 auto 10.66667vw auto;
  }
}

footer .sns dt {
  width: 100%;
  font-size: 12px;
  color: #999;
  white-space: nowrap;
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  footer .sns dt {
    text-align: center;
    font-size: 1.2rem;
    color: #ccc;
    margin-bottom: 5.33333vw;
  }
}

footer .sns dd a svg {
  width: 48px;
}

@media screen and (max-width: 767px) {
  footer .sns dd a svg {
    width: 16vw;
  }
}

footer .sns dd a svg g {
  fill: #fff;
  transition: 0.3s;
}

footer .sns dd a:hover g {
  fill: #ccc;
}

footer .information,
footer .support,
footer .other {
  width: 100%;
  max-width: 240px;
  font-size: 14px;
  line-height: 2.85714em;
  flex: 1;
}

@media screen and (max-width: 767px) {
  footer .information,
  footer .support,
  footer .other {
    max-width: none;
    font-size: 1.4rem;
    margin-bottom: 5.33333vw;
  }
}

footer .information dt,
footer .support dt,
footer .other dt {
  border-bottom: 1px solid #707070;
  padding-bottom: 8px;
  margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
  footer .information dt,
  footer .support dt,
  footer .other dt {
    padding-bottom: 1.06667vw;
    margin-bottom: 2.13333vw;
  }
}

footer .information,
footer .support {
  margin-right: 3.125%;
}

@media screen and (max-width: 767px) {
  footer .information,
  footer .support {
    margin-right: 0;
  }
}

footer .other {
  margin-right: auto;
}

@media screen and (max-width: 767px) {
  footer .other {
    margin-right: 0;
  }
}

footer .confidence {
  width: 180px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  bottom: 100px;
  right: 5.55556%;
}

@media screen and (max-width: 767px) {
  footer .confidence {
    width: 48vw;
    position: static;
    margin: 0 auto;
  }
}

footer .confidence .jdma {
  width: 111px;
}

@media screen and (max-width: 767px) {
  footer .confidence .jdma {
    width: 29.6vw;
  }
}

footer .confidence .pmark {
  width: 50px;
}

@media screen and (max-width: 767px) {
  footer .confidence .pmark {
    width: 13.33333vw;
  }
}

footer .confidence .jdma img,
footer .confidence .pmark img {
  width: 100%;
}

footer .copyright {
  background-color: #000;
  padding: 50px 0 40px 0;
}

@media screen and (max-width: 767px) {
  footer .copyright {
    padding: 16vw 6.66667vw 10.66667vw 6.66667vw;
  }
}

footer .copyright .inner {
  width: 100%;
  max-width: 1600px;
  min-width: 1080px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 5.55556%;
  position: relative;
}

@media screen and (max-width: 767px) {
  footer .copyright .inner {
    max-width: inherit;
    min-width: 0;
  }
}

@media screen and (max-width: 767px) {
  footer .copyright .inner {
    display: block;
    padding: 0;
    text-align: center;
  }
}

footer .copyright .logo {
  width: 156px;
}

@media screen and (max-width: 767px) {
  footer .copyright .logo {
    width: 42.66667vw;
    margin: 0 auto 6.66667vw auto;
  }
}

footer .copyright .logo img {
  width: 100%;
}

footer .copyright small {
  font-size: 11px;
  color: #ccc;
}

@media screen and (max-width: 767px) {
  footer .copyright small {
    font-size: 1.1rem;
    text-align: center;
  }
}

.topSecHero {
  height: 780px;
  position: relative;
  margin-bottom: 120px;
}

@media screen and (max-width: 767px) {
  .topSecHero {
    height: 168vw;
    margin-bottom: 26.66667vw;
  }
}

.topSecHero .product {
  width: 20.27778%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  margin-left: 8.33333%;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .topSecHero .product {
    width: auto;
    position: absolute;
    top: 114.66667vw;
    left: 6.93333vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
  }
}

.topSecHero .product h2 {
  width: 100%;
  max-width: 292px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .topSecHero .product h2 {
    width: 50.66667vw;
    max-width: none;
    margin-bottom: 5.33333vw;
  }
}

.topSecHero .product h2 img {
  width: 100%;
}

.topSecHero .product .type {
  font-size: 17px;
  line-height: 1.70588em;
  margin-bottom: 5px;
}

@media screen and (max-width: 767px) {
  .topSecHero .product .type {
    font-size: 1.1rem;
    margin-bottom: 1.33333vw;
  }
}

@media screen and (max-width: 767px) {
  .topSecHero .product .gd.sp {
    width: 24vw;
    margin-bottom: 2.66667vw;
  }

  .topSecHero .product .gd.sp img {
    width: 100%;
  }
}

.topSecHero .product .button a {
  width: 180px;
}

@media screen and (max-width: 767px) {
  .topSecHero .product .button a {
    width: 48vw;
  }
}

.topSecHero .read {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .topSecHero .read {
    top: 25.06667vw;
    right: 6.66667vw;
    left: auto;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }

  .topSecHero .read img {
    width: 6.13333vw;
  }
}

.topSecHero .gd.pc {
  position: absolute;
  right: 2.77778%;
  bottom: 40px;
  z-index: +1;
}

.topSecHero .gd.pc img {
  width: 100%;
}

.topSecHero .bg {
  width: 100%;
  height: 780px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .topSecHero .bg {
    width: 100%;
    height: 120vw;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.topSecHero .image {
  width: 192px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  margin-left: 30.55556%;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .topSecHero .image {
    width: 27.2vw;
    top: 114.66667vw;
    right: 8vw;
    left: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
  }
}

.topSecHero .image img {
  width: 100%;
}

.topSecHero .product h2,
.topSecHero .product .type,
.topSecHero .product .button,
.topSecHero .bg img,
.topSecHero .image img,
.topSecHero .gd {
  opacity: 0;
  filter: alpha(opacity=0);
}

.topSecHero.isShow .product h2 {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

.topSecHero.isShow .product .type {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

.topSecHero.isShow .product .gd.sp {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

.topSecHero.isShow .product .button {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .topSecHero.isShow .product .button {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
  }
}

.topSecHero.isShow .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.topSecHero.isShow .image img {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.3s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.3s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .topSecHero.isShow .image img {
    -webkit-animation: fadeUp 0.6s ease-in-out 2.1s 1 normal forwards;
    animation: fadeUp 0.6s ease-in-out 2.1s 1 normal forwards;
  }
}

.topSecHero .gd.pc {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.9s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.9s 1 normal forwards;
}

.topSec1 {
  height: 1040px;
  margin-bottom: 200px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .topSec1 {
    height: 198.66667vw;
    margin-bottom: 29.33333vw;
  }
}

.topSec1 .what {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

@media screen and (max-width: 767px) {
  .topSec1 .what {
    position: static;
    padding: 92vw 0 0 10.66667vw;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

.topSec1 .what h2 {
  margin-bottom: 35px;
}

@media screen and (max-width: 767px) {
  .topSec1 .what h2 {
    margin-bottom: 8vw;
  }

  .topSec1 .what h2 img {
    width: 59.2vw;
  }
}

.topSec1 .what p {
  line-height: 2em;
  color: #000;
}

@media screen and (max-width: 767px) {
  .topSec1 .what p {
    font-size: 1.3rem;
  }
}

.topSec1 ul li {
  position: absolute;
}

.topSec1 ul li:nth-child(1) {
  width: 35.41667%;
  height: 320px;
  top: 0;
  left: 23.61111%;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .topSec1 ul li:nth-child(1) {
    width: 44.8vw;
    height: 28.53333vw;
    left: auto;
    right: 0;
  }
}

.topSec1 ul li:nth-child(2) {
  width: 30.55556%;
  height: 652px;
  top: 200px;
  left: 0;
}

@media screen and (max-width: 767px) {
  .topSec1 ul li:nth-child(2) {
    width: 42.66667vw;
    height: 64vw;
    top: 12.8vw;
  }
}

.topSec1 ul li:nth-child(3) {
  width: 29.16667%;
  height: 290px;
  top: 180px;
  right: 0;
}

@media screen and (max-width: 767px) {
  .topSec1 ul li:nth-child(3) {
    width: 31.46667vw;
    height: 40vw;
    top: 44.8vw;
    right: 13.33333vw;
  }
}

.topSec1 ul li:nth-child(4) {
  width: 22.91667%;
  height: 210px;
  bottom: 235px;
  right: 12.15278%;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .topSec1 ul li:nth-child(4) {
    width: 40.53333vw;
    height: 25.6vw;
    right: 10.66667vw;
    bottom: 28.8vw;
  }
}

.topSec1 ul li:nth-child(5) {
  width: 36.11111%;
  height: 330px;
  bottom: 0;
  right: 25.69444%;
}

@media screen and (max-width: 767px) {
  .topSec1 ul li:nth-child(5) {
    width: 66.66667vw;
    height: 42.13333vw;
    right: auto;
    left: 0;
  }
}

.topSecHeader {
  margin-bottom: 100px;
}

@media screen and (max-width: 767px) {
  .topSecHeader {
    margin-bottom: 16vw;
  }
}

.topSecHeader h2 {
  font-size: 36px;
  color: #000;
  margin-left: 5.55556%;
}

@media screen and (max-width: 767px) {
  .topSecHeader h2 {
    font-size: 3.6rem;
    margin-left: 10.66667vw;
  }
}

.topSec2,
.topSec3,
.topSec4 {
  height: 980px;
  position: relative;
  margin-bottom: 240px;
}

@media screen and (max-width: 767px) {
  .topSec2,
  .topSec3,
  .topSec4 {
    height: auto;
    padding-top: 96vw;
    margin-bottom: 32vw;
  }
}

.topSec2 .bg,
.topSec2 .image,
.topSec3 .bg,
.topSec3 .image,
.topSec4 .bg,
.topSec4 .image {
  position: absolute;
}

.topSec2 .product,
.topSec2 .info,
.topSec3 .product,
.topSec3 .info,
.topSec4 .product,
.topSec4 .info {
  position: absolute;
}

@media screen and (max-width: 767px) {
  .topSec2 .product,
  .topSec2 .info,
  .topSec3 .product,
  .topSec3 .info,
  .topSec4 .product,
  .topSec4 .info {
    position: static;
  }
}

@media screen and (max-width: 767px) {
  .topSec2 .product,
  .topSec3 .product,
  .topSec4 .product {
    margin-left: 10.66667vw;
  }
}

.topSec2 .bg,
.topSec3 .bg,
.topSec4 .bg {
  width: 63.88889%;
  height: 820px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .topSec2 .bg,
  .topSec3 .bg,
  .topSec4 .bg {
    width: 90.66667vw;
    height: 74.66667vw;
  }
}

.topSec2 .image,
.topSec3 .image,
.topSec4 .image {
  width: 33.33333%;
  height: 520px;
}

@media screen and (max-width: 767px) {
  .topSec2 .image,
  .topSec3 .image,
  .topSec4 .image {
    width: 42.66667vw;
    height: 42.66667vw;
  }
}

.topSec2 .info,
.topSec3 .info,
.topSec4 .info {
  color: #000;
}

@media screen and (max-width: 767px) {
  .topSec2 .info,
  .topSec3 .info,
  .topSec4 .info {
    display: none;
  }
}

.topSec2 .info dt,
.topSec3 .info dt,
.topSec4 .info dt {
  font-size: 12px;
  padding-bottom: 26px;
  position: relative;
}

.topSec2 .info dt::after,
.topSec3 .info dt::after,
.topSec4 .info dt::after {
  content: "";
  width: 12px;
  height: 1px;
  background-color: #000;
  position: absolute;
  bottom: 10px;
  left: 0;
}

.topSec2 .info dd,
.topSec3 .info dd,
.topSec4 .info dd {
  font-size: 9px;
  line-height: 2.22222em;
}

.topSec2 {
  height: 1020px;
}

@media screen and (max-width: 767px) {
  .topSec2 {
    height: auto;
  }
}

.topSec2,
.topSec3,
.topSec4,
.topSec5,
.topSec6 {
  overflow: hidden;
}

.topSec2 .product .type,
.topSec3 .product .type,
.topSec4 .product .type,
.topSec5 .product .type,
.topSec6 .product .type {
  color: #000;
  margin-bottom: 18px;
}

@media screen and (max-width: 767px) {
  .topSec2 .product .type,
  .topSec3 .product .type,
  .topSec4 .product .type,
  .topSec5 .product .type,
  .topSec6 .product .type {
    margin-bottom: 4.8vw;
  }
}

.topSec2 .product .type .jp,
.topSec3 .product .type .jp,
.topSec4 .product .type .jp,
.topSec5 .product .type .jp,
.topSec6 .product .type .jp {
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .topSec2 .product .type .jp,
  .topSec3 .product .type .jp,
  .topSec4 .product .type .jp,
  .topSec5 .product .type .jp,
  .topSec6 .product .type .jp {
    font-size: 0.8rem;
  }
}

.topSec2 .product .type .en,
.topSec3 .product .type .en,
.topSec4 .product .type .en,
.topSec5 .product .type .en,
.topSec6 .product .type .en {
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .topSec2 .product .type .en,
  .topSec3 .product .type .en,
  .topSec4 .product .type .en,
  .topSec5 .product .type .en,
  .topSec6 .product .type .en {
    font-size: 0.9rem;
  }
}

.topSec2 .product .type .en::before,
.topSec3 .product .type .en::before,
.topSec4 .product .type .en::before,
.topSec5 .product .type .en::before,
.topSec6 .product .type .en::before {
  content: "|";
  font-weight: normal;
  display: inline-block;
  margin: 0 8px;
}

@media screen and (max-width: 767px) {
  .topSec2 .product .type .en::before,
  .topSec3 .product .type .en::before,
  .topSec4 .product .type .en::before,
  .topSec5 .product .type .en::before,
  .topSec6 .product .type .en::before {
    margin: 0 2.13333vw;
  }
}

.topSec2 .product h3,
.topSec3 .product h3,
.topSec4 .product h3,
.topSec5 .product h3,
.topSec6 .product h3 {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .topSec2 .product h3,
  .topSec3 .product h3,
  .topSec4 .product h3,
  .topSec5 .product h3,
  .topSec6 .product h3 {
    margin-bottom: 5.33333vw;
  }
}

.topSec2 .product .read,
.topSec3 .product .read,
.topSec4 .product .read,
.topSec5 .product .read,
.topSec6 .product .read {
  font-size: 36px;
  line-height: 1.55556em;
  color: #000;
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  .topSec2 .product .read,
  .topSec3 .product .read,
  .topSec4 .product .read,
  .topSec5 .product .read,
  .topSec6 .product .read {
    white-space: nowrap;
    font-size: 3rem;
    line-height: 1.8em;
    margin-bottom: 8vw;
  }
}

.topSec2 .product .text,
.topSec3 .product .text,
.topSec4 .product .text,
.topSec5 .product .text,
.topSec6 .product .text {
  font-size: 14px;
  line-height: 1.85714em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .topSec2 .product .text,
  .topSec3 .product .text,
  .topSec4 .product .text,
  .topSec5 .product .text,
  .topSec6 .product .text {
    display: none;
  }
}

.topSec2 .product .type,
.topSec2 .product h3,
.topSec2 .product .read,
.topSec2 .product .text,
.topSec2 .product .button,
.topSec3 .product .type,
.topSec3 .product h3,
.topSec3 .product .read,
.topSec3 .product .text,
.topSec3 .product .button,
.topSec4 .product .type,
.topSec4 .product h3,
.topSec4 .product .read,
.topSec4 .product .text,
.topSec4 .product .button,
.topSec5 .product .type,
.topSec5 .product h3,
.topSec5 .product .read,
.topSec5 .product .text,
.topSec5 .product .button,
.topSec6 .product .type,
.topSec6 .product h3,
.topSec6 .product .read,
.topSec6 .product .text,
.topSec6 .product .button {
  opacity: 0;
  filter: alpha(opacity=0);
}

.topSec2 .bg img,
.topSec2 .image,
.topSec2 .info,
.topSec3 .bg img,
.topSec3 .image,
.topSec3 .info,
.topSec4 .bg img,
.topSec4 .image,
.topSec4 .info,
.topSec5 .bg img,
.topSec5 .image,
.topSec5 .info,
.topSec6 .bg img,
.topSec6 .image,
.topSec6 .info {
  opacity: 0;
  filter: alpha(opacity=0);
}

.topSec2.fadeUpForElement.scrollin .product .read,
.topSec3.fadeUpForElement.scrollin .product .read,
.topSec4.fadeUpForElement.scrollin .product .read,
.topSec5.fadeUpForElement.scrollin .product .read,
.topSec6.fadeUpForElement.scrollin .product .read {
  -webkit-animation: fadeSlideForElement 0.7s ease-in-out 0.8s 1 normal forwards;
  animation: fadeSlideForElement 0.7s ease-in-out 0.8s 1 normal forwards;
}

.topSec2.fadeUpForElement.scrollin .product .text,
.topSec3.fadeUpForElement.scrollin .product .text,
.topSec4.fadeUpForElement.scrollin .product .text,
.topSec5.fadeUpForElement.scrollin .product .text,
.topSec6.fadeUpForElement.scrollin .product .text {
  -webkit-animation: fadeSlideForElement 0.7s ease-in-out 0.9s 1 normal forwards;
  animation: fadeSlideForElement 0.7s ease-in-out 0.9s 1 normal forwards;
}

.topSec2.fadeUpForElement.scrollin .product .type,
.topSec3.fadeUpForElement.scrollin .product .type,
.topSec4.fadeUpForElement.scrollin .product .type,
.topSec5.fadeUpForElement.scrollin .product .type,
.topSec6.fadeUpForElement.scrollin .product .type {
  -webkit-animation: fadeSlideForElement 0.7s ease-in-out 1s 1 normal forwards;
  animation: fadeSlideForElement 0.7s ease-in-out 1s 1 normal forwards;
}

.topSec2.fadeUpForElement.scrollin .product h3,
.topSec3.fadeUpForElement.scrollin .product h3,
.topSec4.fadeUpForElement.scrollin .product h3,
.topSec5.fadeUpForElement.scrollin .product h3,
.topSec6.fadeUpForElement.scrollin .product h3 {
  -webkit-animation: fadeSlideForElement 0.7s ease-in-out 1s 1 normal forwards;
  animation: fadeSlideForElement 0.7s ease-in-out 1s 1 normal forwards;
}

.topSec2.fadeUpForElement.scrollin .product .button,
.topSec3.fadeUpForElement.scrollin .product .button,
.topSec4.fadeUpForElement.scrollin .product .button,
.topSec5.fadeUpForElement.scrollin .product .button,
.topSec6.fadeUpForElement.scrollin .product .button {
  -webkit-animation: fadeSlideForElement 0.7s ease-in-out 1.1s 1 normal forwards;
  animation: fadeSlideForElement 0.7s ease-in-out 1.1s 1 normal forwards;
}

.topSec2.fadeUpForElement.scrollin .image,
.topSec3.fadeUpForElement.scrollin .image,
.topSec4.fadeUpForElement.scrollin .image,
.topSec5.fadeUpForElement.scrollin .image,
.topSec6.fadeUpForElement.scrollin .image {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 1.4s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .topSec2.fadeUpForElement.scrollin .image,
  .topSec3.fadeUpForElement.scrollin .image,
  .topSec4.fadeUpForElement.scrollin .image,
  .topSec5.fadeUpForElement.scrollin .image,
  .topSec6.fadeUpForElement.scrollin .image {
    -webkit-animation: fadeUpForElement 0.7s ease-in-out 0.5s 1 normal forwards;
    animation: fadeUpForElement 0.7s ease-in-out 0.5s 1 normal forwards;
  }
}

.topSec2.fadeUpForElement.scrollin .info,
.topSec3.fadeUpForElement.scrollin .info,
.topSec4.fadeUpForElement.scrollin .info,
.topSec5.fadeUpForElement.scrollin .info,
.topSec6.fadeUpForElement.scrollin .info {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 1.7s 1 normal forwards;
}

.topSec2.fadeUpForElement.scrollin .bg img,
.topSec3.fadeUpForElement.scrollin .bg img,
.topSec4.fadeUpForElement.scrollin .bg img,
.topSec5.fadeUpForElement.scrollin .bg img,
.topSec6.fadeUpForElement.scrollin .bg img {
  -webkit-animation: fadeUpZoom 0.7s ease-in-out 0s 1 normal forwards;
  animation: fadeUpZoom 0.7s ease-in-out 0s 1 normal forwards;
}

.topSec2 .bg,
.topSec4 .bg {
  top: 0;
  left: 0;
}

.topSec2 .image,
.topSec4 .image {
  bottom: 0;
  right: 5.55556%;
}

@media screen and (max-width: 767px) {
  .topSec2 .image,
  .topSec4 .image {
    bottom: auto;
    top: 48vw;
    right: 0;
  }
}

.topSec2 .product,
.topSec4 .product {
  width: 340px;
  right: 5.55556%;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  .topSec2 .product,
  .topSec4 .product {
    right: 2.77778%;
  }
}

@media screen and (max-width: 767px) {
  .topSec2 .product,
  .topSec4 .product {
    width: auto;
  }
}

.topSec2 .info,
.topSec4 .info {
  left: 5.55556%;
}

.topSec2 .product {
  top: 30px;
}

.topSec2 .info {
  bottom: 60px;
}

.topSec4 .product {
  top: 60px;
}

.topSec4 .info {
  bottom: 20px;
}

.topSec3 .bg {
  top: 0;
  right: 0;
}

@media screen and (max-width: 767px) {
  .topSec3 .bg {
    right: auto;
    left: 0;
  }
}

.topSec3 .image {
  bottom: 0;
  left: 5.55556%;
}

@media screen and (max-width: 767px) {
  .topSec3 .image {
    bottom: auto;
    top: 48vw;
    left: auto;
    right: 0;
  }
}

.topSec3 .product {
  top: 80px;
  left: 5.55556%;
}

.topSec3 .info {
  right: 5.55556%;
  bottom: 20px;
}

.topSecWrap {
  display: flex;
  justify-content: space-between;
  margin-bottom: 240px;
}

@media screen and (max-width: 767px) {
  .topSecWrap {
    display: block;
    margin-bottom: 0;
  }
}

.topSec5,
.topSec6 {
  width: 45.83333%;
}

@media screen and (max-width: 767px) {
  .topSec5,
  .topSec6 {
    width: 78.93333vw;
    margin-bottom: 32vw;
  }
}

.topSec5 .bg,
.topSec6 .bg {
  margin-bottom: 50px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .topSec5 .bg,
  .topSec6 .bg {
    margin-bottom: 10.66667vw;
  }
}

.topSec5 .bg img,
.topSec6 .bg img {
  width: 100%;
}

.topSec5 .product {
  margin-left: 12.12121%;
}

@media screen and (max-width: 767px) {
  .topSec5 .product {
    margin-left: 10.66667vw;
  }
}

.topSec6 {
  margin-top: 170px;
}

@media screen and (max-width: 767px) {
  .topSec6 {
    margin-top: 0;
    margin-left: auto;
  }
}

.topSec2 h3 img {
  width: 178px;
}

@media screen and (max-width: 767px) {
  .topSec2 h3 img {
    width: 48vw;
  }
}

.topSec3 h3 img {
  width: 189px;
}

@media screen and (max-width: 767px) {
  .topSec3 h3 img {
    width: 50.66667vw;
  }
}

.topSec4 h3 img {
  width: 39px;
}

@media screen and (max-width: 767px) {
  .topSec4 h3 img {
    width: 10.66667vw;
  }
}

.topSec5 h3 img {
  width: 76px;
}

@media screen and (max-width: 767px) {
  .topSec5 h3 img {
    width: 20.8vw;
  }
}

.topSec6 h3 img {
  width: 229px;
}

@media screen and (max-width: 767px) {
  .topSec6 h3 img {
    width: 48vw;
  }
}

.wallSecHero {
  height: 848px;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .wallSecHero {
    height: auto;
  }
}

.wallSecHero .read {
  width: 24.30556%;
  max-width: 350px;
  height: 740px;
  display: flex;
  flex-flow: column;
  justify-content: center;
  color: #000;
  background-color: #fff;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: +1;
  padding-left: 4.16667%;
}

@media screen and (max-width: 767px) {
  .wallSecHero .read {
    width: auto;
    max-width: none;
    height: auto;
    position: static;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    padding: 138.66667vw 0 16vw 13.33333vw;
  }
}

.wallSecHero .read h2 {
  font-size: 24px;
  line-height: 1.83333em;
  margin-bottom: 35px;
}

@media screen and (max-width: 767px) {
  .wallSecHero .read h2 {
    font-size: 2.7rem;
    margin-bottom: 8vw;
  }
}

.wallSecHero .read h2 img {
  width: 100%;
}

.wallSecHero .read .text {
  font-size: 12px;
  line-height: 1.91667em;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .wallSecHero .read .text {
    font-size: 1.2rem;
    margin-bottom: 5.33333vw;
  }
}

.wallSecHero .read .catch {
  font-size: 20px;
  margin-top: 10px;
}

@media screen and (max-width: 767px) {
  .wallSecHero .read .catch {
    font-size: 2rem;
    margin-top: 5.33333vw;
  }
}

.wallSecHero .read .logo {
  width: 168px;
  margin-top: 22px;
}

@media screen and (max-width: 767px) {
  .wallSecHero .read .logo {
    width: 44.8vw;
    margin-top: 5.86667vw;
  }
}

.wallSecHero .read .logo img {
  width: 100%;
}

.wallSecHero .award {
  position: absolute;
  bottom: 60px;
  left: 60px;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .wallSecHero .award {
    display: flex;
    bottom: auto;
    top: 105.33333vw;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

.wallSecHero .award .text {
  width: 180px;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .wallSecHero .award .text {
    width: 38.66667vw;
    margin-bottom: 0;
    margin-right: 3.2vw;
  }
}

.wallSecHero .award .text img {
  width: 100%;
}

.wallSecHero .award .mark {
  width: 180px;
}

@media screen and (max-width: 767px) {
  .wallSecHero .award .mark {
    width: 31.46667vw;
  }
}

.wallSecHero .award .mark img {
  width: 100%;
}

.wallSecHero .bg {
  width: 100%;
  height: 848px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .wallSecHero .bg {
    width: 100%;
    height: 120vw;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.wallSecHero .bg img {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallSecHero .read {
  right: -24.30556%;
}

.wallSecHero .read h2,
.wallSecHero .read .text,
.wallSecHero .read .catch,
.wallSecHero .read .logo {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallSecHero .award .text,
.wallSecHero .award .mark {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallSecHero.isShow .read {
  -webkit-animation: wallHeroSlideToLeft 0.4s ease-in-out 2s 1 normal forwards;
  animation: wallHeroSlideToLeft 0.4s ease-in-out 2s 1 normal forwards;
}

.wallSecHero.isShow .read h2 {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 3.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 3.1s 1 normal forwards;
}

.wallSecHero.isShow .read .text:nth-of-type(1) {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 3.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 3.4s 1 normal forwards;
}

.wallSecHero.isShow .read .text:nth-of-type(2) {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 3.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 3.7s 1 normal forwards;
}

.wallSecHero.isShow .read .text:nth-of-type(3) {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 4s 1 normal forwards;
}

.wallSecHero.isShow .read .catch {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 4.3s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 4.3s 1 normal forwards;
}

.wallSecHero.isShow .read .logo {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 4.6s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 4.6s 1 normal forwards;
}

.wallSecHero.isShow .award .text {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 4s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .wallSecHero.isShow .award .text {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  }
}

.wallSecHero.isShow .award .mark {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 4.3s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 4.3s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .wallSecHero.isShow .award .mark {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
  }
}

.wallSecHero.isShow .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.wallTvCm {
  color: #fff;
  background: linear-gradient(-45deg, #000 0%, #2d2d2d 100%);
  padding: 130px 5.55556% 150px 5.55556%;
  text-align: center;
  margin-bottom: 180px;
}

@media screen and (max-width: 767px) {
  .wallTvCm {
    padding: 14.66667vw 8vw;
    margin-bottom: 26.66667vw;
  }
}

.wallTvCm h2 {
  font-size: 48px;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .wallTvCm h2 {
    font-size: 4rem;
    margin-bottom: 6.66667vw;
  }
}

.wallTvCm > .text {
  font-size: 14px;
  line-height: 1.85714em;
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .wallTvCm > .text {
    font-size: 1.2rem;
    margin-bottom: 8vw;
  }
}

.wallTvCm ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

@media screen and (max-width: 767px) {
  .wallTvCm ul {
    display: block;
  }
}

.wallTvCm ul li {
  width: 31.25%;
}

@media screen and (max-width: 767px) {
  .wallTvCm ul li {
    width: auto;
    margin-bottom: 8vw;
  }

  .wallTvCm ul li:last-child {
    margin-bottom: 0;
  }
}

.wallTvCm ul li a {
  display: block;
  color: #fff;
}

.wallTvCm ul li a:hover figure img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.wallTvCm ul li figure {
  overflow: hidden;
  margin-bottom: 25px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .wallTvCm ul li figure {
    margin-bottom: 4vw;
  }
}

.wallTvCm ul li figure::after {
  content: "";
  width: 68px;
  height: 68px;
  background: url(../../img/wall/ic_play.svg) no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

@media screen and (max-width: 767px) {
  .wallTvCm ul li figure::after {
    width: 16vw;
    height: 16vw;
  }
}

.wallTvCm ul li figure img {
  width: 100%;
  transition: 0.3s;
}

.wallTvCm ul li .text {
  font-size: 20px;
}

@media screen and (max-width: 767px) {
  .wallTvCm ul li .text {
    font-size: 1.5rem;
  }
}

.wallTvCm ul li {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallTvCm ul.fadeUpForElement.scrollin li:nth-of-type(1) {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 0.3s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 0.3s 1 normal forwards;
}

.wallTvCm ul.fadeUpForElement.scrollin li:nth-of-type(2) {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 0.6s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 0.6s 1 normal forwards;
}

.wallTvCm ul.fadeUpForElement.scrollin li:nth-of-type(3) {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 0.9s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 0.9s 1 normal forwards;
}

.wallSecHeader {
  margin: 0 0 100px 5.55556%;
}

@media screen and (max-width: 767px) {
  .wallSecHeader {
    margin: 0 0 8vw 9.6vw;
  }
}

.wallSecHeader .read {
  font-size: 20px;
  color: #000;
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  .wallSecHeader .read {
    font-size: 1.2rem;
    margin-bottom: 5.33333vw;
  }
}

.wallSecHeader h2 {
  width: 639px;
}

@media screen and (max-width: 767px) {
  .wallSecHeader h2 {
    width: 64vw;
  }
}

.wallSecHeader h2 img {
  width: 100%;
}

.wallSecStyle1 {
  margin-bottom: 240px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 {
    margin-bottom: 26.66667vw;
  }
}

.wallSecStyle1 .bg {
  height: 800px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .bg {
    height: 71.46667vw;
  }
}

.wallSecStyle1 .bg .ofi-img {
  width: 100%;
  height: 100%;
}

.wallSecStyle1 .info {
  font-size: 9px;
  color: #000;
  display: flex;
  justify-content: flex-end;
  margin: 10px 10px 60px 0;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .info {
    display: none;
  }
}

.wallSecStyle1 .info dt {
  margin-right: 1em;
}

.wallSecStyle1 .info dd {
  font-weight: 400;
}

.wallSecStyle1 .info dd:not(:last-child)::after {
  content: "/";
  display: inline-block;
  margin: 0 0.5em;
}

.wallSecStyle1 .feature {
  display: flex;
  justify-content: space-between;
  padding: 0 5.55556%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .feature {
    display: block;
    padding: 10.66667vw 8vw 0 8vw;
  }
}

.wallSecStyle1 .feature .read {
  flex: 1;
  color: #000;
  margin-right: 1.5625%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .feature .read {
    margin-right: 0;
  }
}

.wallSecStyle1 .feature .read span {
  display: block;
}

.wallSecStyle1 .feature .read .en {
  font-size: 14px;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .feature .read .en {
    font-size: 1.2rem;
    margin-bottom: 5.33333vw;
  }
}

.wallSecStyle1 .feature .read .jp {
  max-width: 12em;
  font-size: 32px;
  line-height: 1.6875em;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .feature .read .jp {
    font-size: 2.6rem;
    max-width: inherit;
  }
}

.wallSecStyle1 .feature .text {
  flex: 1;
  font-size: 14px;
  line-height: 1.85714em;
  margin-top: 42px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .feature .text {
    font-size: 1.2rem;
    margin: 5.33333vw 0 10.66667vw 0;
  }
}

.wallSecStyle1 .feature .image {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  min-width: 330px;
  margin-left: 6.25%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .feature .image {
    min-width: 0;
    margin-left: 0;
    justify-content: space-between;
  }
}

.wallSecStyle1 .feature .image li {
  width: 160px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .feature .image li {
    width: 40.8vw;
  }
}

.wallSecStyle1 .feature .image li:first-child {
  margin-right: 10px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle1 .feature .image li:first-child {
    margin-right: 0;
  }
}

.wallSecStyle1 .feature .image li img {
  width: 100%;
}

.wallSecStyle1 .bg img,
.wallSecStyle1 .info,
.wallSecStyle1 .feature {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallSecStyle1.fadeUpForElement.scrollin .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.wallSecStyle1.fadeUpForElement.scrollin .info {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 1.5s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 1.5s 1 normal forwards;
}

.wallSecStyle1.fadeUpForElement.scrollin .feature {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 1.8s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 1.8s 1 normal forwards;
}

.wallSecStyle2,
.wallSecStyle3,
.wallSecStyle4 {
  height: 980px;
  position: relative;
  margin-bottom: 240px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2,
  .wallSecStyle3,
  .wallSecStyle4 {
    height: auto;
    padding-top: 128vw;
    margin-bottom: 26.66667vw;
  }
}

.wallSecStyle2 .bg,
.wallSecStyle2 .image,
.wallSecStyle3 .bg,
.wallSecStyle3 .image,
.wallSecStyle4 .bg,
.wallSecStyle4 .image {
  position: absolute;
}

.wallSecStyle2 .feature1,
.wallSecStyle2 .feature2,
.wallSecStyle2 .info,
.wallSecStyle3 .feature1,
.wallSecStyle3 .feature2,
.wallSecStyle3 .info,
.wallSecStyle4 .feature1,
.wallSecStyle4 .feature2,
.wallSecStyle4 .info {
  position: absolute;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature1,
  .wallSecStyle2 .feature2,
  .wallSecStyle2 .info,
  .wallSecStyle3 .feature1,
  .wallSecStyle3 .feature2,
  .wallSecStyle3 .info,
  .wallSecStyle4 .feature1,
  .wallSecStyle4 .feature2,
  .wallSecStyle4 .info {
    position: static;
  }
}

.wallSecStyle2 .bg,
.wallSecStyle3 .bg,
.wallSecStyle4 .bg {
  width: 63.88889%;
  height: 680px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .bg,
  .wallSecStyle3 .bg,
  .wallSecStyle4 .bg {
    width: 100%;
    height: 69.33333vw;
  }
}

.wallSecStyle2 .bg .ofi-img,
.wallSecStyle3 .bg .ofi-img,
.wallSecStyle4 .bg .ofi-img {
  position: absolute;
  top: 0;
}

.wallSecStyle2 .bg::after,
.wallSecStyle3 .bg::after,
.wallSecStyle4 .bg::after {
  content: "";
  width: 100%;
  height: 100%;
  background-color: #eee;
  position: absolute;
  top: 0;
}

.wallSecStyle2 .image,
.wallSecStyle3 .image,
.wallSecStyle4 .image {
  height: 360px;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .image,
  .wallSecStyle3 .image,
  .wallSecStyle4 .image {
    height: 48vw;
  }
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .image li,
  .wallSecStyle3 .image li,
  .wallSecStyle4 .image li {
    width: 49.33333vw;
    height: 48vw;
  }
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature1,
  .wallSecStyle3 .feature1,
  .wallSecStyle4 .feature1 {
    padding: 0 8vw;
    margin-bottom: 17.33333vw;
  }
}

.wallSecStyle2 .feature1 .read,
.wallSecStyle3 .feature1 .read,
.wallSecStyle4 .feature1 .read {
  color: #000;
}

.wallSecStyle2 .feature1 .read span,
.wallSecStyle3 .feature1 .read span,
.wallSecStyle4 .feature1 .read span {
  display: block;
}

.wallSecStyle2 .feature1 .read .en,
.wallSecStyle3 .feature1 .read .en,
.wallSecStyle4 .feature1 .read .en {
  font-size: 14px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature1 .read .en,
  .wallSecStyle3 .feature1 .read .en,
  .wallSecStyle4 .feature1 .read .en {
    font-size: 1.2rem;
    margin-bottom: 5.33333vw;
  }
}

.wallSecStyle2 .feature1 .read .jp,
.wallSecStyle3 .feature1 .read .jp,
.wallSecStyle4 .feature1 .read .jp {
  font-size: 28px;
  line-height: 1.71429em;
  margin-bottom: 35px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature1 .read .jp,
  .wallSecStyle3 .feature1 .read .jp,
  .wallSecStyle4 .feature1 .read .jp {
    font-size: 2.6rem;
    margin-bottom: 5.33333vw;
  }
}

.wallSecStyle2 .feature1 .text,
.wallSecStyle3 .feature1 .text,
.wallSecStyle4 .feature1 .text {
  font-size: 14px;
  line-height: 1.85714em;
  margin-bottom: 18px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature1 .text,
  .wallSecStyle3 .feature1 .text,
  .wallSecStyle4 .feature1 .text {
    font-size: 1.2rem;
    margin-bottom: 4.8vw;
  }
}

.wallSecStyle2 .feature2,
.wallSecStyle3 .feature2,
.wallSecStyle4 .feature2 {
  display: flex;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature2,
  .wallSecStyle3 .feature2,
  .wallSecStyle4 .feature2 {
    display: block;
    padding: 0 8vw;
  }
}

.wallSecStyle2 .feature2 figure,
.wallSecStyle3 .feature2 figure,
.wallSecStyle4 .feature2 figure {
  display: flex;
  justify-content: space-between;
  margin-right: 4.41176%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature2 figure,
  .wallSecStyle3 .feature2 figure,
  .wallSecStyle4 .feature2 figure {
    margin-right: 0;
  }
}

.wallSecStyle2 .feature2 dl,
.wallSecStyle3 .feature2 dl,
.wallSecStyle4 .feature2 dl {
  flex: 1;
}

.wallSecStyle2 .feature2 dl dt,
.wallSecStyle3 .feature2 dl dt,
.wallSecStyle4 .feature2 dl dt {
  font-size: 18px;
  line-height: 1.44444em;
  color: #000;
  margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature2 dl dt,
  .wallSecStyle3 .feature2 dl dt,
  .wallSecStyle4 .feature2 dl dt {
    font-size: 1.6rem;
    margin-bottom: 4vw;
  }
}

.wallSecStyle2 .feature2 dl dd,
.wallSecStyle3 .feature2 dl dd,
.wallSecStyle4 .feature2 dl dd {
  font-size: 14px;
  line-height: 1.85714em;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature2 dl dd,
  .wallSecStyle3 .feature2 dl dd,
  .wallSecStyle4 .feature2 dl dd {
    font-size: 1.2rem;
  }
}

.wallSecStyle2 .info,
.wallSecStyle3 .info,
.wallSecStyle4 .info {
  display: flex;
  font-size: 9px;
  color: #000;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .info,
  .wallSecStyle3 .info,
  .wallSecStyle4 .info {
    display: none;
  }
}

.wallSecStyle2 .info dt,
.wallSecStyle3 .info dt,
.wallSecStyle4 .info dt {
  margin-right: 1em;
}

.wallSecStyle2 .info dd,
.wallSecStyle3 .info dd,
.wallSecStyle4 .info dd {
  font-weight: 400;
}

.wallSecStyle2 .info dd:not(:last-child)::after,
.wallSecStyle3 .info dd:not(:last-child)::after,
.wallSecStyle4 .info dd:not(:last-child)::after {
  content: "/";
  display: inline-block;
  margin: 0 0.5em;
}

.wallSecStyle2 .image,
.wallSecStyle2 .info,
.wallSecStyle2 .feature2,
.wallSecStyle3 .image,
.wallSecStyle3 .info,
.wallSecStyle3 .feature2,
.wallSecStyle4 .image,
.wallSecStyle4 .info,
.wallSecStyle4 .feature2 {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallSecStyle2 .feature1 .read,
.wallSecStyle2 .feature1 .text,
.wallSecStyle2 .feature1 .button,
.wallSecStyle3 .feature1 .read,
.wallSecStyle3 .feature1 .text,
.wallSecStyle3 .feature1 .button,
.wallSecStyle4 .feature1 .read,
.wallSecStyle4 .feature1 .text,
.wallSecStyle4 .feature1 .button {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallSecStyle2.fadeUpForElement.scrollin .feature1 .type,
.wallSecStyle3.fadeUpForElement.scrollin .feature1 .type,
.wallSecStyle4.fadeUpForElement.scrollin .feature1 .type {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 1.5s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 1.5s 1 normal forwards;
}

.wallSecStyle2.fadeUpForElement.scrollin .feature1 .read,
.wallSecStyle3.fadeUpForElement.scrollin .feature1 .read,
.wallSecStyle4.fadeUpForElement.scrollin .feature1 .read {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 1.8s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 1.8s 1 normal forwards;
}

.wallSecStyle2.fadeUpForElement.scrollin .feature1 .text,
.wallSecStyle3.fadeUpForElement.scrollin .feature1 .text,
.wallSecStyle4.fadeUpForElement.scrollin .feature1 .text {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 2.1s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 2.1s 1 normal forwards;
}

.wallSecStyle2.fadeUpForElement.scrollin .feature1 .button,
.wallSecStyle3.fadeUpForElement.scrollin .feature1 .button,
.wallSecStyle4.fadeUpForElement.scrollin .feature1 .button {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 2.4s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 2.4s 1 normal forwards;
}

.wallSecStyle2.fadeUpForElement.scrollin .feature2,
.wallSecStyle3.fadeUpForElement.scrollin .feature2,
.wallSecStyle4.fadeUpForElement.scrollin .feature2 {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 2.7s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 2.7s 1 normal forwards;
}

.wallSecStyle2.fadeUpForElement.scrollin .image,
.wallSecStyle3.fadeUpForElement.scrollin .image,
.wallSecStyle4.fadeUpForElement.scrollin .image {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 3s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 3s 1 normal forwards;
}

.wallSecStyle2.fadeUpForElement.scrollin .info:nth-of-type(1),
.wallSecStyle3.fadeUpForElement.scrollin .info:nth-of-type(1),
.wallSecStyle4.fadeUpForElement.scrollin .info:nth-of-type(1) {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 2s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 2s 1 normal forwards;
}

.wallSecStyle2.fadeUpForElement.scrollin .info:nth-of-type(2),
.wallSecStyle3.fadeUpForElement.scrollin .info:nth-of-type(2),
.wallSecStyle4.fadeUpForElement.scrollin .info:nth-of-type(2) {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 3.3s 1 normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 3.3s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2.fadeUpForElement.scrollin .feature1 .type,
  .wallSecStyle3.fadeUpForElement.scrollin .feature1 .type,
  .wallSecStyle4.fadeUpForElement.scrollin .feature1 .type {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.3s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 1.3s 1 normal forwards;
  }

  .wallSecStyle2.fadeUpForElement.scrollin .feature1 .read,
  .wallSecStyle3.fadeUpForElement.scrollin .feature1 .read,
  .wallSecStyle4.fadeUpForElement.scrollin .feature1 .read {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.5s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 1.5s 1 normal forwards;
  }

  .wallSecStyle2.fadeUpForElement.scrollin .feature1 .text,
  .wallSecStyle3.fadeUpForElement.scrollin .feature1 .text,
  .wallSecStyle4.fadeUpForElement.scrollin .feature1 .text {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  }

  .wallSecStyle2.fadeUpForElement.scrollin .feature1 .button,
  .wallSecStyle3.fadeUpForElement.scrollin .feature1 .button,
  .wallSecStyle4.fadeUpForElement.scrollin .feature1 .button {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.9s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 1.9s 1 normal forwards;
  }

  .wallSecStyle2.fadeUpForElement.scrollin .feature2,
  .wallSecStyle3.fadeUpForElement.scrollin .feature2,
  .wallSecStyle4.fadeUpForElement.scrollin .feature2 {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
  }

  .wallSecStyle2.fadeUpForElement.scrollin .image,
  .wallSecStyle3.fadeUpForElement.scrollin .image,
  .wallSecStyle4.fadeUpForElement.scrollin .image {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 0.8s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 0.8s 1 normal forwards;
  }
}

.wallSecStyle2 .bg img,
.wallSecStyle2 .bg::after,
.wallSecStyle3 .bg img,
.wallSecStyle3 .bg::after,
.wallSecStyle4 .bg img,
.wallSecStyle4 .bg::after {
  left: -110%;
}

.wallSecStyle2.fadeUpForElement.scrollin .bg img,
.wallSecStyle3.fadeUpForElement.scrollin .bg img,
.wallSecStyle4.fadeUpForElement.scrollin .bg img {
  -webkit-animation: slideToRight 0.8s cubic-bezier(0.64, 0, 0.78, 0) 0s 1
      normal forwards,
    zoomOut 0.7s ease-in-out 0.8s 1 normal forwards;
  animation: slideToRight 0.8s cubic-bezier(0.64, 0, 0.78, 0) 0s 1 normal
      forwards,
    zoomOut 0.7s ease-in-out 0.8s 1 normal forwards;
}

.wallSecStyle2.fadeUpForElement.scrollin .bg::after,
.wallSecStyle3.fadeUpForElement.scrollin .bg::after,
.wallSecStyle4.fadeUpForElement.scrollin .bg::after {
  -webkit-animation: slideToRight 0.8s cubic-bezier(0.64, 0, 0.78, 0) 0s 1
      normal forwards,
    slideMaskToRight 0.7s ease-in-out 0.8s 1 normal forwards;
  animation: slideToRight 0.8s cubic-bezier(0.64, 0, 0.78, 0) 0s 1 normal
      forwards,
    slideMaskToRight 0.7s ease-in-out 0.8s 1 normal forwards;
}

.wallSecStyle2 .image {
  width: 36.80556%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .image {
    width: 100%;
  }
}

.wallSecStyle2 .image li {
  width: 49.0566%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .image li {
    width: 49.33333vw;
  }
}

.wallSecStyle2 .feature1 {
  width: 320px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature1 {
    width: 100%;
  }
}

.wallSecStyle2 .feature2 {
  width: 47.22222%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature2 {
    width: auto;
  }
}

.wallSecStyle2 .feature2 figure {
  width: 330px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature2 figure {
    width: 100%;
    margin-bottom: 5.33333vw;
  }
}

.wallSecStyle2 .feature2 figure img {
  width: 160px;
  height: 160px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .feature2 figure img {
    width: 41.33333vw;
    height: 40.8vw;
  }
}

.wallSecStyle3 {
  overflow: visible;
}

.wallSecStyle3 .image {
  width: 42.36111%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle3 .image {
    width: 100%;
  }
}

.wallSecStyle3 .image li:nth-of-type(1) {
  width: 39.34426%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle3 .image li:nth-of-type(1) {
    width: 49.33333vw;
  }
}

.wallSecStyle3 .image li:nth-of-type(2) {
  width: 59.01639%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle3 .image li:nth-of-type(2) {
    width: 49.33333vw;
  }
}

.wallSecStyle3 .feature1 {
  width: 320px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle3 .feature1 {
    width: 100%;
  }
}

.wallSecStyle3 .feature2 {
  width: 40.97222%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle3 .feature2 {
    width: auto;
  }
}

.wallSecStyle3 .feature2 figure {
  order: 2;
  width: 220px;
  margin-left: 8.47458%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle3 .feature2 figure {
    width: 53.33333vw;
    margin: 0 auto 5.33333vw auto;
  }
}

.wallSecStyle3 .feature2 figure img {
  width: 221px;
  height: 203px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle3 .feature2 figure img {
    width: 100%;
    height: auto;
  }
}

.wallSecStyle4 .image {
  width: 42.36111%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle4 .image {
    width: 100%;
  }
}

.wallSecStyle4 .image li:nth-of-type(1) {
  width: 57.37705%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle4 .image li:nth-of-type(1) {
    width: 49.33333vw;
  }
}

.wallSecStyle4 .image li:nth-of-type(2) {
  width: 40.98361%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle4 .image li:nth-of-type(2) {
    width: 49.33333vw;
  }
}

.wallSecStyle4 .feature1 {
  width: 350px;
}

@media screen and (max-width: 767px) {
  .wallSecStyle4 .feature1 {
    width: auto;
    margin-bottom: 0;
  }
}

.wallSecStyle2 .bg,
.wallSecStyle4 .bg {
  top: 0;
  left: 0;
}

.wallSecStyle2 .image,
.wallSecStyle4 .image {
  bottom: 0;
  right: 5.55556%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle2 .image,
  .wallSecStyle4 .image {
    bottom: auto;
    top: 70.66667vw;
    right: 0;
  }
}

.wallSecStyle2 .feature1,
.wallSecStyle4 .feature1 {
  top: 100px;
  right: 5.55556%;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  .wallSecStyle2 .feature1,
  .wallSecStyle4 .feature1 {
    right: 2.77778%;
  }
}

.wallSecStyle2 .feature2,
.wallSecStyle4 .feature2 {
  top: 760px;
  left: 5.55556%;
}

.wallSecStyle2 .info,
.wallSecStyle4 .info {
  top: 690px;
  left: 10px;
}

.wallSecStyle3 .bg {
  top: 0;
  right: 0;
}

.wallSecStyle3 .image {
  bottom: 0;
  left: 5.55556%;
}

@media screen and (max-width: 767px) {
  .wallSecStyle3 .image {
    bottom: auto;
    top: 70.66667vw;
    left: 0;
  }
}

.wallSecStyle3 .feature1 {
  top: 100px;
  left: 5.55556%;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  .wallSecStyle3 .feature1 {
    left: 2.77778%;
  }
}

.wallSecStyle3 .feature2 {
  top: 760px;
  right: 5.55556%;
}

.wallSecStyle3 .info {
  top: 690px;
  right: 10px;
}

.wallSecStyle3 .info:nth-of-type(2) {
  top: auto;
  right: auto;
  bottom: -19px;
  left: 5.55556%;
}

.secInterview {
  color: #000;
  background-color: #e4e4e5;
  position: relative;
  padding: 100px 11.11111%;
  margin-top: 240px;
}

@media screen and (max-width: 767px) {
  .secInterview {
    padding: 14.66667vw 8vw;
    margin-top: 26.66667vw;
  }
}

.secInterview h2 {
  position: absolute;
  top: 66px;
  left: 5.55556%;
}

@media screen and (max-width: 767px) {
  .secInterview h2 {
    top: 8.8vw;
    left: auto;
    right: 5.86667vw;
  }

  .secInterview h2 img {
    width: 11.73333vw;
  }
}

.secInterview .en {
  width: 400px;
  font-size: 18px;
  line-height: 1.55556em;
  position: absolute;
  top: 100px;
  right: 5.55556%;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  .secInterview .en {
    right: 2.77778%;
  }
}

@media screen and (max-width: 767px) {
  .secInterview .en {
    width: auto;
    font-size: 1.2rem;
    top: 7.46667vw;
    left: 5.33333vw;
    right: auto;
  }
}

.secInterview .en::after {
  content: "";
  width: 20px;
  height: 1px;
  background-color: #000;
  position: absolute;
  left: 0;
  bottom: -12px;
}

@media screen and (max-width: 767px) {
  .secInterview .en::after {
    width: 4vw;
    bottom: -3.2vw;
  }
}

.secInterview > .image {
  width: 60.71429%;
  height: 780px;
}

@media screen and (max-width: 767px) {
  .secInterview > .image {
    width: 85.33333vw;
    height: 106.66667vw;
    margin: 0 0 8vw -8vw;
  }
}

.secInterview > .image .ofi-img {
  width: 100%;
  height: 780px;
}

@media screen and (max-width: 767px) {
  .secInterview > .image .ofi-img {
    width: 85.33333vw;
    height: 106.66667vw;
  }
}

.secInterview .read {
  width: 400px;
  position: absolute;
  top: 300px;
  right: 5.55556%;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  .secInterview .read {
    right: 2.77778%;
  }
}

@media screen and (max-width: 767px) {
  .secInterview .read {
    width: auto;
    position: static;
  }
}

.secInterview .read dt {
  font-size: 40px;
  line-height: 1.5em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .secInterview .read dt {
    font-size: 2.6rem;
    margin-bottom: 8vw;
  }
}

.secInterview .read .text {
  line-height: 2em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .secInterview .read .text {
    font-size: 1.3rem;
    margin-bottom: 8vw;
  }
}

.secInterview .read .button a {
  display: inline-block;
  font-size: 14px;
  background-color: #333;
  color: #fff;
  border-radius: 25px;
  padding: 17px 50px 17px 30px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .secInterview .read .button a {
    font-size: 1.4rem;
    padding: 4.53333vw 13.33333vw 4.53333vw 8vw;
    border-radius: 6.66667vw;
  }
}

.secInterview .read .button a::before,
.secInterview .read .button a::after {
  content: "";
  width: 13px;
  height: 1px;
  background-color: #fff;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
  .secInterview .read .button a::before,
  .secInterview .read .button a::after {
    width: 14px;
    height: 2px;
  }
}

.secInterview .read .button a::before {
  right: 22px;
}

@media screen and (max-width: 767px) {
  .secInterview .read .button a::before {
    right: 5.86667vw;
  }
}

.secInterview .read .button a::after {
  right: 22px;
  -webkit-transform: translateY(-50%) rotate(90deg);
  transform: translateY(-50%) rotate(90deg);
  transition: 0.3s;
}

@media screen and (max-width: 767px) {
  .secInterview .read .button a::after {
    right: 5.86667vw;
  }
}

.secInterview .read .button a.isOpen::before {
  display: none;
}

.secInterview .read .button a.isOpen::after {
  -webkit-transform: translateY(-50%) rotate(0);
  transform: translateY(-50%) rotate(0);
}

.secInterview .read .button a:hover {
  background-color: #555;
}

.secInterview .detail {
  color: #333;
  display: none;
  padding-top: 140px;
}

@media screen and (max-width: 767px) {
  .secInterview .detail {
    padding-top: 26.66667vw;
  }
}

.secInterview .detail .movieWrap.pc {
  padding-top: 56.25%;
  margin-bottom: 100px;
  position: relative;
}

.secInterview .detail .movieWrap.pc iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.secInterview .detail .movieWrap.sp {
  margin-bottom: 16vw;
}

.secInterview .detail .movieWrap.sp a {
  display: block;
}

.secInterview .detail .movieWrap.sp figure {
  overflow: hidden;
  position: relative;
}

.secInterview .detail .movieWrap.sp figure::after {
  content: "";
  width: 16vw;
  height: 16vw;
  background: url(../../img/wall/ic_play.svg) no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.secInterview .detail .movieWrap.sp figure img {
  width: 100%;
}

.secInterview .detail h3 {
  font-size: 36px;
  margin-bottom: 60px;
}

@media screen and (max-width: 767px) {
  .secInterview .detail h3 {
    font-size: 2.6rem;
    line-height: 1.69231em;
    margin-bottom: 10.66667vw;
  }
}

.secInterview .detail .textWrap {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap {
    display: block;
  }
}

.secInterview .detail .textWrap .text {
  width: 60.71429%;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .text {
    width: auto;
  }
}

.secInterview .detail .textWrap .text dt:not(.profile) {
  line-height: 1.71429em;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .text dt:not(.profile) {
    margin-bottom: 4vw;
  }
}

.secInterview .detail .textWrap .text dt:not(.profile)::before {
  content: "― ";
}

.secInterview .detail .textWrap .text dt.profile {
  font-size: 14px;
  border-bottom: 1px solid #707070;
  padding: 30px 0 12px 0;
  margin-bottom: 12px;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .text dt.profile {
    font-size: 1.4rem;
    padding: 2.66667vw 0 2.66667vw 0;
    margin-bottom: 2.66667vw;
  }
}

.secInterview .detail .textWrap .text dd:not(.profile) {
  font-size: 14px;
  line-height: 2em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .text dd:not(.profile) {
    font-size: 1.2rem;
    margin-bottom: 8vw;
  }
}

.secInterview .detail .textWrap .text dd.profile {
  font-size: 11px;
  line-height: 1.81818em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .text dd.profile {
    font-size: 1rem;
    margin-bottom: 8vw;
  }
}

.secInterview .detail .textWrap .image {
  width: 30.35714%;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .image {
    width: auto;
  }
}

.secInterview .detail .textWrap .image figure {
  margin-bottom: 30px;
}

.secInterview .detail .textWrap .image figure:last-of-type {
  margin-bottom: 0;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .image figure:last-of-type {
    margin-bottom: 10.66667vw;
  }
}

.secInterview .detail .textWrap .image figure img {
  width: 100%;
  margin-bottom: 8px;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .image figure img {
    margin-bottom: 2.13333vw;
  }
}

.secInterview .detail .textWrap .image figure figcaption {
  font-size: 11px;
  line-height: 1.81818em;
  color: #333;
}

@media screen and (max-width: 767px) {
  .secInterview .detail .textWrap .image figure figcaption {
    font-size: 1rem;
  }
}

.secResistant {
  height: 680px;
  background-image: url(../../img/wall/resistant_img_01.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

@media screen and (max-width: 767px) {
  .secResistant {
    height: auto;
    background-image: url(../../img/wall/resistant_img_01_sp.jpg);
    background-position: center top;
    background-color: #edf0f2;
    background-size: 100% auto;
    padding-top: 71.73333vw;
  }
}

.secResistant dl {
  width: 360px;
  color: #000;
  position: absolute;
  top: 50%;
  left: 5.55556%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
  .secResistant dl {
    width: auto;
    position: static;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    padding: 10.66667vw 8vw 13.33333vw 8vw;
  }
}

.secResistant dl dt {
  font-size: 40px;
  line-height: 1.5em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .secResistant dl dt {
    font-size: 2.6rem;
    margin-bottom: 6.66667vw;
  }
}

.secResistant dl .text {
  line-height: 2em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .secResistant dl .text {
    font-size: 1.3rem;
    margin-bottom: 6.66667vw;
  }
}

.secResistant dl .button a {
  display: inline-block;
  font-size: 14px;
  color: #fff;
  background-color: #333;
  padding: 17px 50px;
  border-radius: 25px;
}

@media screen and (max-width: 767px) {
  .secResistant dl .button a {
    font-size: 1.4rem;
    padding: 4.53333vw 10.66667vw;
    border-radius: 6.66667vw;
  }
}

.secResistant dl .button a:hover {
  background-color: #555;
}

.wallV4SecHero,
.wallV3SecHero,
.wallV2SecHero {
  height: 780px;
  position: relative;
  overflow: hidden;
}
.wallV3SecHero {
  height: 54vw;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero,
  .wallV3SecHero,
  .wallV2SecHero {
    height: auto;
    padding: 142.93333vw 0 24vw 0;
  }
}

.wallV4SecHero .read,
.wallV3SecHero .read,
.wallV2SecHero .read {
  position: absolute;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read,
  .wallV3SecHero .read,
  .wallV2SecHero .read {
    position: static;
    text-align: center;
  }
}

.wallV4SecHero .read .catch,
.wallV3SecHero .read .catch,
.wallV2SecHero .read .catch {
  font-size: 36px;
  line-height: 1.55556em;
  color: #fff;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read .catch,
  .wallV3SecHero .read .catch,
  .wallV2SecHero .read .catch {
    width: 100%;
    text-align: center;
    position: absolute;
    left: 0;
    z-index: +1;
  }
}

.wallV4SecHero .read .type,
.wallV3SecHero .read .type,
.wallV2SecHero .read .type {
  color: #fff;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read .type,
  .wallV3SecHero .read .type,
  .wallV2SecHero .read .type {
    color: #000;
    margin-bottom: 5.33333vw;
  }
}

.wallV4SecHero .read .type .jp,
.wallV3SecHero .read .type .jp,
.wallV2SecHero .read .type .jp {
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read .type .jp,
  .wallV3SecHero .read .type .jp,
  .wallV2SecHero .read .type .jp {
    font-size: 1.1rem;
  }
}

.wallV4SecHero .read .type .en,
.wallV3SecHero .read .type .en,
.wallV2SecHero .read .type .en {
  font-size: 18px;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read .type .en,
  .wallV3SecHero .read .type .en,
  .wallV2SecHero .read .type .en {
    font-size: 1.3rem;
  }
}

.wallV4SecHero .read .type .en::before,
.wallV3SecHero .read .type .en::before,
.wallV2SecHero .read .type .en::before {
  content: "|";
  font-weight: normal;
  display: inline-block;
  margin: 0 10px;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read .type .en::before,
  .wallV3SecHero .read .type .en::before,
  .wallV2SecHero .read .type .en::before {
    margin: 0 2.13333vw;
  }
}

.wallV4SecHero .read h2,
.wallV3SecHero .read h2,
.wallV2SecHero .read h2 {
  width: 328px;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read h2,
  .wallV3SecHero .read h2,
  .wallV2SecHero .read h2 {
    width: 62.66667vw;
    margin: 0 auto 4.26667vw auto;
  }
}

.wallV4SecHero .read h2 img,
.wallV3SecHero .read h2 img,
.wallV2SecHero .read h2 img {
  width: 100%;
}

.wallV4SecHero .read .image.sp,
.wallV3SecHero .read .image.sp,
.wallV2SecHero .read .image.sp {
  margin: 0 auto 2.66667vw auto;
}

.wallV4SecHero .read .image.sp img,
.wallV3SecHero .read .image.sp img,
.wallV2SecHero .read .image.sp img {
  width: 100%;
}

.wallV4SecHero .gd,
.wallV3SecHero .gd,
.wallV2SecHero .gd {
  width: 69px;
  position: absolute;
  bottom: 40px;
  right: 40px;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .gd,
  .wallV2SecHero .gd {
    position: static;
    width: 43.2vw;
    margin: 0 auto;
  }
}

.wallV4SecHero .gd img,
.wallV3SecHero .gd img,
.wallV2SecHero .gd img {
  width: 100%;
}

.wallV4SecHero .bg,
.wallV3SecHero .bg,
.wallV2SecHero .bg {
  width: 100%;
  height: 780px;
  overflow: hidden;
}
.wallV3SecHero .bg {
  height: 54vw;
}

@media screen and (max-width: 1020px) and (min-width: 768px) {
  .wallV3SecHero .read {
    top: 40px;
  }
  .wallV3SecHero {
    height: 580px;
  }
  .wallV3SecHero .bg {
    height: 580px;
  }
}

.wallV3SecHero .bg div {
  height: 100%;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .bg,
  .wallV3SecHero .bg,
  .wallV2SecHero .bg {
    width: 100%;
    height: 122.66667vw;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.wallV4SecHero .read .catch,
.wallV4SecHero .read .type,
.wallV4SecHero .read h2,
.wallV4SecHero .read .image.sp,
.wallV4SecHero .bg img,
.wallV4SecHero .gd,
.wallV3SecHero .read .catch,
.wallV3SecHero .read .type,
.wallV3SecHero .read h2,
.wallV3SecHero .read .image.sp,
.wallV3SecHero .bg img,
.wallV3SecHero .gd,
.wallV2SecHero .read .catch,
.wallV2SecHero .read .type,
.wallV2SecHero .read h2,
.wallV2SecHero .read .image.sp,
.wallV2SecHero .bg img,
.wallV2SecHero .gd {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallV4SecHero.isShow .read .catch,
.wallV3SecHero.isShow .read .catch,
.wallV2SecHero.isShow .read .catch {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

.wallV4SecHero.isShow .read .type,
.wallV3SecHero.isShow .read .type,
.wallV2SecHero.isShow .read .type {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

.wallV4SecHero.isShow .read h2,
.wallV3SecHero.isShow .read h2,
.wallV2SecHero.isShow .read h2 {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

.wallV4SecHero.isShow .read .image.sp,
.wallV3SecHero.isShow .read .image.sp,
.wallV2SecHero.isShow .read .image.sp {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
}

.wallV4SecHero.isShow .gd,
.wallV3SecHero.isShow .gd,
.wallV2SecHero.isShow .gd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.4s 1 normal forwards;
}

.wallV4SecHero.isShow .bg img,
.wallV3SecHero.isShow .bg img,
.wallV2SecHero.isShow .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.wallV4SecHero .read {
  top: 90px;
  left: 5.55556%;
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read .catch {
    top: 8vw;
    font-size: 2.6rem;
  }
}

@media screen and (max-width: 767px) {
  .wallV4SecHero .read .image.sp {
    width: 83.2vw;
  }
}

.wallV3SecHero,
.wallV2SecHero {
  margin-bottom: 120px;
}

@media screen and (max-width: 767px) {
  .wallV3SecHero,
  .wallV2SecHero {
    margin-bottom: 0;
  }
}

.wallV3SecHero .read,
.wallV2SecHero .read {
  top: 200px;
  left: 5.55556%;
}
@media screen and (max-width: 1500px) and (minx-width: 768px) {
  .wallV3SecHero .read,
  .wallV2SecHero .read {
    top: 40px;
  }
}
@media screen and (max-width: 767px) {
  .wallV3SecHero .read .catch,
  .wallV2SecHero .read .catch {
    font-size: 2.2rem;
  }
}

@media screen and (max-width: 767px) {
  .wallV3SecHero .read .image.sp,
  .wallV2SecHero .read .image.sp {
    width: 89.6vw;
  }
}

@media screen and (max-width: 767px) {
  .wallV3SecHero .read .catch {
    top: 98.66667vw;
  }
}

@media screen and (max-width: 767px) {
  .wallV2SecHero .read .catch {
    top: 88vw;
  }
}

.wallV4SecSpecial {
  background: #000;
  padding-top: 100px;
  margin-bottom: 150px;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial {
    padding-top: 24vw;
    margin-bottom: 26.66667vw;
  }
}

.wallV4SecSpecial .carousel .upper {
  width: 100%;
  height: 130px;
  margin-bottom: 20px;
  background: url(https://equals.itembox.design/item/assets/img/v4/slide_img_01.png)
    left top repeat-x;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .carousel .upper {
    height: 28.26667vw;
    background-size: auto 28.26667vw;
  }
}

.wallV4SecSpecial .carousel .lower {
  width: 100%;
  height: 130px;
  background: url(https://equals.itembox.design/item/assets/img/v4/slide_img_02.png)
    left top repeat-x;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .carousel .lower {
    height: 28.26667vw;
    background-size: auto 28.26667vw;
  }
}

.wallV4SecSpecial .carousel .upper,
.wallV4SecSpecial .carousel .lower {
  opacity: 0;
  filter: alpha(opacity=0);
}

.wallV4SecSpecial .carousel.fadeUpForElement.scrollin .upper {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 0s 1 normal forwards,
    carouselslide 40s linear -3s infinite normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 0s 1 normal forwards,
    carouselslide 40s linear -3s infinite normal forwards;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .carousel.fadeUpForElement.scrollin .upper {
    -webkit-animation: fadeUpForElement 0.7s ease-in-out 0s 1 normal forwards,
      carouselslide_sp 40s linear -3s infinite normal forwards;
    animation: fadeUpForElement 0.7s ease-in-out 0s 1 normal forwards,
      carouselslide_sp 40s linear -3s infinite normal forwards;
  }
}

.wallV4SecSpecial .carousel.fadeUpForElement.scrollin .lower {
  -webkit-animation: fadeUpForElement 0.7s ease-in-out 0.3s 1 normal forwards,
    carouselslide 40s linear 0s infinite normal forwards;
  animation: fadeUpForElement 0.7s ease-in-out 0.3s 1 normal forwards,
    carouselslide 40s linear 0s infinite normal forwards;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .carousel.fadeUpForElement.scrollin .lower {
    -webkit-animation: fadeUpForElement 0.7s ease-in-out 0.3s 1 normal forwards,
      carouselslide_sp 40s linear 0s infinite normal forwards;
    animation: fadeUpForElement 0.7s ease-in-out 0.3s 1 normal forwards,
      carouselslide_sp 40s linear 0s infinite normal forwards;
  }
}

.wallV4SecSpecial .read {
  text-align: center;
  color: #fff;
  position: relative;
  z-index: +1;
  margin: -15px 0 80px 0;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .read {
    margin: -5.33333vw 0 18.66667vw 0;
  }
}

.wallV4SecSpecial .read dt {
  font-size: 40px;
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .read dt {
    font-size: 3rem;
    line-height: 1.53333em;
    margin-bottom: 5.33333vw;
  }
}

.wallV4SecSpecial .read dd {
  line-height: 2em;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .read dd {
    font-size: 1.3rem;
    margin: 0 8vw;
    text-align: left;
  }
}

.wallV4SecSpecial .special {
  background-image: url(../../img/v4/special_img_01.png);
  background-repeat: no-repeat;
  background-position: right top;
  background-size: auto 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 0 0 140px 8.33333%;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .special {
    background-size: auto 117.33333vw;
    padding: 117.33333vw 8vw 24vw 8vw;
  }
}

.wallV4SecSpecial .special .text {
  width: 540px;
  color: #fff;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .special .text {
    width: auto;
  }
}

.wallV4SecSpecial .special .text h3 {
  width: 485px;
  margin-bottom: 12px;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .special .text h3 {
    width: auto;
    margin-bottom: 2.66667vw;
  }
}

.wallV4SecSpecial .special .text h3 img {
  width: 100%;
}

.wallV4SecSpecial .special .text .caution {
  font-size: 11px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .special .text .caution {
    font-size: 1rem;
    margin-bottom: 8vw;
  }
}

.wallV4SecSpecial .special .text .exp {
  font-size: 14px;
  line-height: 2.57143em;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .special .text .exp {
    font-size: 1.3rem;
    line-height: 2em;
    margin-bottom: 2.66667vw;
  }
}

.wallV4SecSpecial .special .text .award {
  width: 410px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .wallV4SecSpecial .special .text .award {
    width: 100%;
  }
}

.wallV4SecSpecial .special .text .award .text,
.wallV4SecSpecial .special .text .award .mark {
  width: 48%;
}

.wallV4SecSpecial .special .text .award img {
  width: 100%;
}

@-webkit-keyframes carouselslide {
  from {
    background-position-x: 0px;
  }

  to {
    background-position-x: -1452px;
  }
}

@keyframes carouselslide {
  from {
    background-position-x: 0px;
  }

  to {
    background-position-x: -1452px;
  }
}

@-webkit-keyframes carouselslide_sp {
  from {
    background-position-x: 0px;
  }

  to {
    background-position-x: -315.71692vw;
  }
}

@keyframes carouselslide_sp {
  from {
    background-position-x: 0px;
  }

  to {
    background-position-x: -315.71692vw;
  }
}

.wallV4SecFeature {
  width: 88.88889%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f5f5f5;
  padding: 40px 10px 40px 40px;
  margin: -80px auto 120px auto;
}

@media screen and (max-width: 767px) {
  .wallV4SecFeature {
    width: auto;
    display: block;
    padding: 5.33333vw;
    margin: -18.66667vw 8vw 13.33333vw 8vw;
  }
}

.wallV4SecFeature .image:nth-of-type(1) {
  width: 29.5935%;
}

@media screen and (max-width: 767px) {
  .wallV4SecFeature .image:nth-of-type(1) {
    width: auto;
    margin-bottom: 5.33333vw;
  }
}

.wallV4SecFeature .image:nth-of-type(2) {
  width: 31.70732%;
}

@media screen and (max-width: 767px) {
  .wallV4SecFeature .image:nth-of-type(2) {
    width: auto;
  }
}

.wallV4SecFeature .image img {
  width: 100%;
}

.wallV4SecFeature .text {
  width: 34.14634%;
}

@media screen and (max-width: 767px) {
  .wallV4SecFeature .text {
    width: auto;
  }
}

.wallV4SecFeature .text dt {
  font-size: 18px;
  line-height: 1.44444em;
  color: #000;
  margin-bottom: 8px;
}

@media screen and (max-width: 767px) {
  .wallV4SecFeature .text dt {
    font-size: 1.4rem;
  }
}

.wallV4SecFeature .text dd {
  font-size: 14px;
  line-height: 1.85714em;
}

@media screen and (max-width: 767px) {
  .wallV4SecFeature .text dd {
    font-size: 1.2rem;
  }
}

.wallV4SecFeature .text dd.caution {
  font-size: 11px;
}

@media screen and (max-width: 767px) {
  .wallV4SecFeature .text dd.caution {
    font-size: 0.9rem;
  }
}

.freeSecHero {
  height: 840px;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .freeSecHero {
    height: auto;
  }
}

.freeSecHero .read {
  color: #fff;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: +1;
  padding-left: 3.47222%;
}

@media screen and (max-width: 767px) {
  .freeSecHero .read {
    color: #000;
    position: static;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    padding: 126.13333vw 0 24vw 8vw;
  }
}

.freeSecHero .read .catch {
  font-size: 42px;
  line-height: 1.61905em;
  margin-bottom: 22px;
}

@media screen and (max-width: 767px) {
  .freeSecHero .read .catch {
    font-size: 2.8rem;
    margin-bottom: 8vw;
  }
}

.freeSecHero .read .text {
  font-size: 14px;
  line-height: 2.42857em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .freeSecHero .read .text {
    font-size: 1.2rem;
    line-height: 1.91667em;
    font-weight: normal;
    margin-bottom: 9.33333vw;
  }
}

.freeSecHero .read .type {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .freeSecHero .read .type {
    color: #000;
    margin-bottom: 5.33333vw;
  }
}

.freeSecHero .read .type .jp {
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .freeSecHero .read .type .jp {
    font-size: 1.2rem;
  }
}

.freeSecHero .read .type .en {
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .freeSecHero .read .type .en {
    font-size: 1.2rem;
  }
}

.freeSecHero .read .type .en::before {
  content: "|";
  font-weight: normal;
  display: inline-block;
  margin: 0 10px;
}

@media screen and (max-width: 767px) {
  .freeSecHero .read .type .en::before {
    margin: 0 2.13333vw;
  }
}

.freeSecHero .read h2 {
  width: 284px;
}

@media screen and (max-width: 767px) {
  .freeSecHero .read h2 {
    width: 60vw;
  }
}

.freeSecHero .read h2 img {
  width: 100%;
}

.freeSecHero .bg {
  width: 100%;
  height: 840px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .freeSecHero .bg {
    width: 100%;
    height: 110.13333vw;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.freeSecHero .bg img {
  opacity: 0;
  filter: alpha(opacity=0);
}

.freeSecHero .read .catch,
.freeSecHero .read .text,
.freeSecHero .read .type,
.freeSecHero .read h2 {
  opacity: 0;
  filter: alpha(opacity=0);
}

.freeSecHero.isShow .read .catch {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

.freeSecHero.isShow .read .text {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

.freeSecHero.isShow .read .type {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

.freeSecHero.isShow .read h2 {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
}

.freeSecHero.isShow .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.freeS1SecHero {
  height: 760px;
}

.freeS1SecHero .bg {
  height: 760px;
}

.freeProSecHero {
  height: 780px;
}

.freeProSecHero .bg {
  height: 780px;
}

.freeS1SecHero,
.freeProSecHero {
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero,
  .freeProSecHero {
    height: auto;
  }
}

.freeS1SecHero .read,
.freeProSecHero .read {
  color: #000;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: +1;
  padding-left: 3.47222%;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read,
  .freeProSecHero .read {
    position: static;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    padding: 112vw 0 16vw 8vw;
  }
}

.freeS1SecHero .read .type,
.freeProSecHero .read .type {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read .type,
  .freeProSecHero .read .type {
    color: #000;
    margin-bottom: 5.33333vw;
  }
}

.freeS1SecHero .read .type .jp,
.freeProSecHero .read .type .jp {
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read .type .jp,
  .freeProSecHero .read .type .jp {
    font-size: 1.1rem;
  }
}

.freeS1SecHero .read .type .en,
.freeProSecHero .read .type .en {
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read .type .en,
  .freeProSecHero .read .type .en {
    font-size: 1.2rem;
  }
}

.freeS1SecHero .read .type .en::before,
.freeProSecHero .read .type .en::before {
  content: "|";
  font-weight: normal;
  display: inline-block;
  margin: 0 10px;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read .type .en::before,
  .freeProSecHero .read .type .en::before {
    margin: 0 2.13333vw;
  }
}

.freeS1SecHero .read h2,
.freeProSecHero .read h2 {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read h2,
  .freeProSecHero .read h2 {
    margin-bottom: 4vw;
  }
}

.freeS1SecHero .read h2 img,
.freeProSecHero .read h2 img {
  height: 43px;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read h2 img,
  .freeProSecHero .read h2 img {
    height: 8.8vw;
  }
}

.freeS1SecHero .read .catch,
.freeProSecHero .read .catch {
  font-size: 36px;
  line-height: 1.55556em;
  margin-bottom: 35px;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read .catch,
  .freeProSecHero .read .catch {
    font-size: 3rem;
    line-height: 1.8em;
    margin-bottom: 8vw;
  }
}

.freeS1SecHero .read .image.pc,
.freeProSecHero .read .image.pc {
  width: 290px;
  margin-bottom: 30px;
}

.freeS1SecHero .read .image.pc img,
.freeProSecHero .read .image.pc img {
  width: 100%;
}

.freeS1SecHero .read .button a,
.freeProSecHero .read .button a {
  width: 290px;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .read .button a,
  .freeProSecHero .read .button a {
    width: 48vw;
  }
}

.freeS1SecHero .bg,
.freeProSecHero .bg {
  width: 100%;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .freeS1SecHero .bg,
  .freeProSecHero .bg {
    width: 100%;
    height: 96vw;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.freeS1SecHero .bg img,
.freeProSecHero .bg img {
  opacity: 0;
  filter: alpha(opacity=0);
}

.freeS1SecHero .read .catch,
.freeS1SecHero .read .type,
.freeS1SecHero .read h2,
.freeS1SecHero .read .image,
.freeS1SecHero .read .button,
.freeProSecHero .read .catch,
.freeProSecHero .read .type,
.freeProSecHero .read h2,
.freeProSecHero .read .image,
.freeProSecHero .read .button {
  opacity: 0;
  filter: alpha(opacity=0);
}

.freeS1SecHero.isShow .read .catch,
.freeProSecHero.isShow .read .catch {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

.freeS1SecHero.isShow .read .type,
.freeProSecHero.isShow .read .type {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

.freeS1SecHero.isShow .read h2,
.freeProSecHero.isShow .read h2 {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

.freeS1SecHero.isShow .read .image,
.freeProSecHero.isShow .read .image {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
}

.freeS1SecHero.isShow .read .button,
.freeProSecHero.isShow .read .button {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.3s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.3s 1 normal forwards;
}

.freeS1SecHero.isShow .bg img,
.freeProSecHero.isShow .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

#buyFixedFooter {
  width: 100%;
  height: 80px;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 9000;
  background-color: #eee;
}

@media screen and (max-width: 767px) {
  #buyFixedFooter {
    height: 13.86667vw;
  }
}

#buyFixedFooter .inner {
  width: 100%;
  max-width: 1600px;
  min-width: 1080px;
  margin: 0 auto;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 3.47222%;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  #buyFixedFooter .inner {
    max-width: inherit;
    min-width: 0;
  }
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  #buyFixedFooter .inner {
    max-width: inherit;
    min-width: 0;
    padding: 0 20px;
  }
}

@media screen and (max-width: 767px) {
  #buyFixedFooter .inner {
    padding: 0 3.73333vw;
  }
}

#buyFixedFooter .inner .present.pc {
  color: #a78a5a;
}

#buyFixedFooter .inner dl {
  display: flex;
  align-items: center;
  margin-left: auto;
}

@media screen and (max-width: 767px) {
  #buyFixedFooter .inner dl {
    margin-left: 0;
  }
}

#buyFixedFooter .inner dl dt {
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  #buyFixedFooter .inner dl dt {
    font-size: 0.9rem;
    line-height: 1.33333em;
  }
}

#buyFixedFooter .inner dl #price {
  font-size: 32px;
  margin-left: 15px;
}

@media screen and (max-width: 767px) {
  #buyFixedFooter .inner dl #price {
    font-size: 1.8rem;
    margin-left: 2.66667vw;
  }
}

#buyFixedFooter .inner dl .yen {
  font-size: 18px;
  margin-top: 5px;
}

@media screen and (max-width: 767px) {
  #buyFixedFooter .inner dl .yen {
    font-size: 1.1rem;
    margin-top: 1.33333vw;
  }
}

#buyFixedFooter .inner button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 220px;
  height: 48px;
  border-radius: 25px;
  font-size: 14px;
  color: #fff;
  background-color: #a78a5a;
  margin-left: 30px;
}

@media screen and (max-width: 767px) {
  #buyFixedFooter .inner button {
    width: 36.26667vw;
    height: 7.46667vw;
    border-radius: 6.66667vw;
    font-size: 1rem;
    margin-left: 0;
  }
}

#buyFixedFooter .inner button:hover {
  background-color: #8d744b;
}

.page-wall-v4-buy footer,
.page-wall-v3-buy-low footer,
.page-wall-v3-buy-high footer,
.page-wall-v2-buy-low footer,
.page-wall-v2-buy-high footer {
  margin-bottom: 80px;
}

@media screen and (max-width: 767px) {
  .page-wall-v4-buy footer,
  .page-wall-v3-buy-low footer,
  .page-wall-v3-buy-high footer,
  .page-wall-v2-buy-low footer,
  .page-wall-v2-buy-high footer {
    margin-bottom: 13.86667vw;
  }
}

.page-wall-v4-buy main,
.page-wall-v3-buy-low main,
.page-wall-v3-buy-high main,
.page-wall-v2-buy-low main,
.page-wall-v2-buy-high main,
.page-wall-v4-option main,
.page-wall-v3-option-low main,
.page-wall-v3-option-high main,
.page-wall-v2-option-low main,
.page-wall-v2-option-high main {
  padding-bottom: 200px;
}

@media screen and (max-width: 767px) {
  .page-wall-v4-buy main,
  .page-wall-v3-buy-low main,
  .page-wall-v3-buy-high main,
  .page-wall-v2-buy-low main,
  .page-wall-v2-buy-high main,
  .page-wall-v4-option main,
  .page-wall-v3-option-low main,
  .page-wall-v3-option-high main,
  .page-wall-v2-option-low main,
  .page-wall-v2-option-high main {
    padding-bottom: 26.66667vw;
  }
}

.buySecTab {
  padding: 40px 5.55556% 42px 5.55556%;
}

@media screen and (max-width: 767px) {
  .buySecTab {
    padding: 5.33333vw 2.66667vw;
    overflow-x: auto;
  }
}

.buySecTab ul {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .buySecTab ul {
    width: 146.66667vw;
  }
}

.buySecTab ul li {
  width: 20%;
  position: relative;
}

@media screen and (max-width: 767px) {
  .buySecTab ul li {
    width: 29.33333vw;
  }
}

.buySecTab ul li:not(:last-child) {
  border-right: 1px solid #ddd;
}

.buySecTab ul li a {
  display: block;
  color: #000;
  padding: 20px 0 15px 0;
  margin: 0 3px;
  position: relative;
  opacity: 0.6;
  filter: alpha(opacity=60);
}

@media screen and (max-width: 767px) {
  .buySecTab ul li a {
    padding: 2.66667vw 0;
  }
}

.buySecTab ul li a:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}

.buySecTab ul li.active a {
  opacity: 1;
  filter: alpha(opacity=100);
}

.buySecTab ul li.active a::before,
.buySecTab ul li.active a::after {
  content: "";
  position: absolute;
}

.buySecTab ul li.active a::before {
  width: 100%;
  height: 4px;
  background-color: #000;
  bottom: -2px;
}

.buySecTab ul li.active a::after {
  border-style: solid;
  border-width: 6px 4px 0 4px;
  border-color: #000 transparent transparent transparent;
  left: 50%;
  bottom: -8px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

@media screen and (max-width: 767px) {
  .buySecTab ul li.active a::after {
    border-width: 6px 6px 0 6px;
  }
}

.buySecTab ul li .type {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .buySecTab ul li .type {
    white-space: nowrap;
    margin-bottom: 1.33333vw;
  }
}

.buySecTab ul li .type strong {
  font-size: 28px;
  margin-right: 15px;
}

@media screen and (max-width: 767px) {
  .buySecTab ul li .type strong {
    font-size: 1.8rem;
    margin-right: 1.33333vw;
  }
}

.buySecTab ul li .type span {
  font-size: 18px;
}

@media screen and (max-width: 767px) {
  .buySecTab ul li .type span {
    font-size: 1rem;
  }
}

.buySecTab ul li .inch {
  font-size: 12px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .buySecTab ul li .inch {
    font-size: 0.8rem;
  }
}

.buySecMain {
  display: flex;
  padding: 0 5.55556%;
  margin-bottom: 80px;
}

@media screen and (max-width: 767px) {
  .buySecMain {
    display: block;
    padding: 0 5.33333vw;
    margin-bottom: 13.33333vw;
  }
}

.buySecMain .productInfo {
  flex: 1;
  max-width: 520px;
  line-height: 2;
  margin: 20px 0 0 6.25%;
}

@media screen and (max-width: 1097px) and (min-width: 768px) {
  .buySecMain .productInfo {
    margin-left: 1.5625%;
  }
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo {
    max-width: inherit;
    margin-left: 0;
  }
}

.buySecMain .productInfo .catch {
  font-size: 14px;
  line-height: 14, 24;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .catch {
    font-size: 1.4rem;
    margin-bottom: 5.33333vw;
  }
}

.buySecMain .productInfo h1 {
  font-size: 36px;
  line-height: 1.33333em;
  color: #000;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo h1 {
    font-size: 3rem;
  }
}

.buySecMain .productInfo .type {
  font-size: 18px;
  color: #000;
  margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .type {
    font-size: 1.6rem;
    margin-bottom: 6.66667vw;
  }
}

.buySecMain .productInfo .text {
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .text {
    font-size: 1.2rem;
  }
}

.buySecMain .productInfo .caution {
  font-size: 11px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .caution {
    font-size: 1.1rem;
  }
}

.buySecMain .productInfo .price {
  font-size: 32px;
  line-height: 1.2;
  color: #000;
  margin-top: 12px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .price {
    font-size: 3.2rem;
    margin-top: 5.33333vw;
  }
}

.buySecMain .productInfo .price span {
  font-size: 18px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .price span {
    font-size: 1.8rem;
  }
}

.buySecMain .productInfo .security {
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .security {
    margin-bottom: 8vw;
  }
}

.buySecMain .productInfo .security a {
  display: inline-block;
  font-size: 11px;
  color: #fff;
  background-color: #952734;
  padding: 0 15px;
  border-radius: 15px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .security a {
    font-size: 1.2rem;
    padding: 0 4vw;
    border-radius: 4vw;
  }
}

.buySecMain .productInfo .selectColor {
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .selectColor {
    margin-bottom: 6.66667vw;
  }
}

.buySecMain .productInfo .selectColor p {
  font-size: 14px;
  color: #000;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .selectColor p {
    font-size: 1.4rem;
  }
}

.buySecMain .productInfo .selectColor ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: -10px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .selectColor ul {
    margin-bottom: -2.66667vw;
  }
}

.buySecMain .productInfo .selectColor ul li {
  width: 49%;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .selectColor ul li {
    margin-bottom: 2.66667vw;
  }
}

.buySecMain .productInfo .selectColor ul li input[type="radio"] {
  display: none;
}

.buySecMain .productInfo .selectColor ul li label {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 14px 15px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .selectColor ul li label {
    font-size: 1.4rem;
    padding: 3.73333vw 3.2vw;
  }
}

.buySecMain .productInfo .selectColor ul li label .image {
  width: 24px;
  margin-right: 10px;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .selectColor ul li label .image {
    width: 5.33333vw;
    margin-right: 2.66667vw;
  }
}

.buySecMain .productInfo .selectColor ul li label .image img {
  width: 100%;
}

.buySecMain
  .productInfo
  .selectColor
  ul
  li
  input[type="radio"]:checked
  + label {
  position: relative;
  border: 1px solid #a78a5a;
}

.buySecMain
  .productInfo
  .selectColor
  ul
  li
  input[type="radio"]:checked
  + label::after {
  content: "";
  width: 100%;
  height: 100%;
  border: 2px solid #a78a5a;
  border-radius: 5px;
  position: absolute;
  top: 0;
  left: 0;
}

.buySecMain .productInfo .number {
  font-size: 11px;
  line-height: 1.45455em;
}

@media screen and (max-width: 767px) {
  .buySecMain .productInfo .number {
    font-size: 1.1rem;
  }
}

.productImagesWrap {
  width: 602px;
}

@media screen and (max-width: 767px) {
  .productImagesWrap {
    width: auto;
  }
}

.productImagesWrap .productImages {
  width: 100%;
}

.productImagesWrap .productImages .photowrap {
  width: 100%;
  height: 0;
  padding-top: 100%;
  margin-bottom: 2px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .productImagesWrap .productImages .photowrap {
    height: 89.6vw;
    margin-bottom: 0;
  }
}

.productImagesWrap .productImages .photowrap .photos.swiper-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: #dddddd 1px solid;
}

.productImagesWrap
  .productImages
  .photowrap
  .photos.swiper-container
  .ofi-contain-img {
  width: 100%;
  height: 100%;
}

.productImagesWrap .productImages .thumbnails {
  width: 100%;
}

@media screen and (max-width: 767px) {
  .productImagesWrap .productImages .thumbnails {
    display: none;
  }
}

.productImagesWrap .productImages .thumbnails .swiper-slide {
  width: 72px;
  height: 80px;
  border: #dddddd 1px solid;
  cursor: pointer;
}

.productImagesWrap .productImages .thumbnails .swiper-slide:not(:last-child) {
  margin-right: 2px;
}

.productImagesWrap
  .productImages
  .thumbnails
  .swiper-slide.swiper-slide-thumb-active {
  border: #a78a5a solid 1px;
}

.productImagesWrap
  .productImages
  .thumbnails
  .swiper-slide.swiper-slide-thumb-active::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border: #a78a5a solid 3px;
  left: 0;
  top: 0;
}

.productImagesWrap .productImages .thumbnails .swiper-slide img {
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 768px) {
  .productImagesWrap .swiper-pagination {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .productImagesWrap .swiper-pagination {
    width: 89.6vw;
    height: 12vw;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .productImagesWrap .swiper-pagination .swiper-pagination-bullet {
    width: 2.66667vw;
    height: 2.66667vw;
    background: transparent;
    border: #cccccc 1px solid;
    opacity: 1;
  }

  .productImagesWrap
    .swiper-pagination
    .swiper-pagination-bullet:not(:last-child) {
    margin-right: 2.66667vw;
  }

  .productImagesWrap
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #cccccc;
  }
}

.buySecTitle {
  padding: 0 5.55556%;
  padding-bottom: 3%;
}

@media screen and (max-width: 767px) {
  .buySecTitle {
    padding: 0 5.33333vw;
    margin-bottom: 13.33333vw;
  }
}

.buySecTitle p {
  font-size: 24px;
  color: #000;
}

@media screen and (max-width: 767px) {
  .buySecTitle p {
    font-size: 1.8rem;
    line-height: 1.77778em;
  }
}

.buySecOption {
  display: flex;
  justify-content: space-between;
  width: 88.88889%;
  border-top: 1px solid #ddd;
  padding: 100px 0;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .buySecOption {
    display: block;
    width: auto;
    padding: 13.33333vw 0;
    margin: 0 5.33333vw;
  }
}

.buySecTitle + .buySecOption {
  padding-top: 60px;
  border-top: none;
}

@media screen and (max-width: 767px) {
  .buySecTitle + .buySecOption {
    padding-top: 13.33333vw;
    border-top: 1px solid #ddd;
  }
}

.buySecTab + .buySecOption {
  padding-top: 60px;
  border-top: none;
}

@media screen and (max-width: 767px) {
  .buySecTab + .buySecOption {
    padding-top: 13.33333vw;
  }
}

.buySecOption .detailOption {
  width: 21.875%;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption {
    width: auto;
    margin-bottom: 8vw;
  }
}

.buySecOption .detailOption h2 {
  padding-top: 30px;
  margin-bottom: 25px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption h2 {
    padding-top: 0;
    margin-bottom: 5.33333vw;
  }
}

.buySecOption .detailOption h2::before {
  content: "";
  width: 40px;
  height: 1px;
  background-color: #000;
  position: absolute;
  top: 0;
  left: 0;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption h2::before {
    display: none;
  }
}

.buySecOption .detailOption h2 span {
  display: block;
}

.buySecOption .detailOption h2 .en {
  font-size: 36px;
  line-height: 1.33333em;
  color: #000;
  margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption h2 .en {
    font-size: 3.6rem;
    margin-bottom: 1.33333vw;
  }
}

.buySecOption .detailOption h2 .jp {
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption h2 .jp {
    font-size: 1.2rem;
  }
}

.buySecOption .detailOption .text {
  font-size: 12px;
  line-height: 2;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption .text {
    font-size: 1.2rem;
  }
}

.buySecOption .detailOption .caution {
  font-size: 10px;
  line-height: 2;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption .caution {
    font-size: 1rem;
  }
}

.buySecOption .detailOption .security {
  margin-top: 10px;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption .security {
    margin-top: 2.66667vw;
  }
}

.buySecOption .detailOption .security a {
  display: inline-block;
  font-size: 11px;
  line-height: 2;
  color: #fff;
  background-color: #952734;
  padding: 0 15px;
  border-radius: 15px;
}

@media screen and (max-width: 767px) {
  .buySecOption .detailOption .security a {
    font-size: 1.2rem;
    padding: 0 4vw;
    border-radius: 4vw;
  }
}

.buySecOption .selectOption {
  width: 75%;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption {
    width: auto;
  }
}

.buySecOption .selectOption .image1Col {
  width: 100%;
  height: 360px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .image1Col {
    width: 89.33333vw;
    height: 46.4vw;
    margin-bottom: 0;
  }
}

.buySecOption .selectOption .image1Col figure {
  width: 100%;
  height: 360px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .image1Col figure {
    width: 89.33333vw;
    height: 46.4vw;
  }
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .imageWrap {
    overflow-x: auto;
    padding: 0 5.33333vw 2.66667vw 5.33333vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    margin-bottom: 2.66667vw;
  }
}

.buySecOption .selectOption .image2Col {
  display: flex;
  justify-content: space-between;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .image2Col {
    width: 170.66667vw;
    margin-bottom: 0;
  }
}

.buySecOption .selectOption .image2Col figure {
  width: 49.79167%;
  height: 360px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .image2Col figure {
    width: 84vw;
    height: 46.4vw;
  }
}

.buySecOption .selectOption .option {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: -40px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .option {
    margin-bottom: -8vw;
  }
}

.buySecOption .selectOption .option::after {
  content: "";
  width: 32.5%;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .option::after {
    width: 43.73333vw;
  }
}

.buySecOption .selectOption .option li {
  width: 32.5%;
  margin-bottom: 40px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .option li {
    width: 43.73333vw;
    margin-bottom: 8vw;
  }
}

.buySecOption .selectOption .option li input[type="checkbox"] {
  display: none;
}

.buySecOption .selectOption .option li label {
  display: block;
  height: 100%;
  cursor: pointer;
  border: 1px solid #ccc;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}

.buySecOption .selectOption .option li .detail,
.buySecOption .selectOption .option li .image,
.buySecOption .selectOption .option li .name,
.buySecOption .selectOption .option li .price,
.buySecOption .selectOption .option li .button {
  display: block;
  text-align: center;
}

.buySecOption .selectOption .option li .image img {
  width: 100%;
}

.buySecOption .selectOption .option li .detail {
  padding: 18px 18px 0 18px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .option li .detail {
    padding: 2.66667vw;
  }
}

.buySecOption .selectOption .option li .detail .name {
  font-size: 18px;
  line-height: 1.66667em;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .option li .detail .name {
    font-size: 1.2rem;
    text-align: left;
    margin-bottom: 1.6vw;
  }
}

.buySecOption .selectOption .option li .detail .price {
  font-size: 18px;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .option li .detail .price {
    font-size: 1.4rem;
    text-align: left;
    margin-bottom: 2.66667vw;
  }
}

.buySecOption .selectOption .option li .detail .price span {
  font-size: 14px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .option li .detail .price span {
    font-size: 1rem;
  }
}

.buySecOption .selectOption .option li .detail .button a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 160px;
  height: 40px;
  font-size: 12px;
  color: #fff;
  background-color: #333;
  border-radius: 20px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption .option li .detail .button a {
    width: 31.46667vw;
    height: 8.53333vw;
    font-size: 1.1rem;
    border-radius: 5.33333vw;
  }
}

.buySecOption .selectOption .option li input[type="checkbox"]:checked + label {
  position: relative;
  border: 1px solid #a78a5a;
}

.buySecOption
  .selectOption
  .option
  li
  input[type="checkbox"]:checked
  + label::after {
  content: "";
  width: 100%;
  height: 100%;
  border: 4px solid #a78a5a;
  border-radius: 8px;
  position: absolute;
  top: 0;
  left: 0;
}

.buySecOption
  .selectOption
  .option
  li
  input[type="checkbox"]:checked
  + label
  .detail
  .button
  a {
  background-color: #a78a5a;
}

.buySecOption .selectOption:not(.withLink) .option li .detail .button a:hover {
  background-color: #555;
}

.buySecOption .selectOption.withLink .option {
  margin-bottom: -12px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption.withLink .option {
    margin-bottom: -1.86667vw;
  }
}

.buySecOption .selectOption.withLink .option li {
  margin-bottom: 12px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption.withLink .option li {
    margin-bottom: 1.86667vw;
  }
}

.buySecOption .selectOption.withLink .option label .detail {
  padding-bottom: 50px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption.withLink .option label .detail {
    padding-bottom: 13.33333vw;
  }
}

.buySecOption .selectOption.withLink .button a {
  transition: 0s;
  pointer-events: none;
}

.buySecOption .selectOption.withLink .link {
  position: absolute;
  bottom: 22px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption.withLink .link {
    bottom: 0.53333vw;
  }
}

.buySecOption .selectOption.withLink .link a {
  display: block;
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .buySecOption .selectOption.withLink .link a {
    width: 39.46667vw;
    font-size: 1.2rem;
    text-align: center;
    border-top: 1px solid #ccc;
    padding: 2.66667vw 0;
  }
}

.optionSecHero {
  height: 780px;
  position: relative;
  margin-bottom: 100px;
}

@media screen and (max-width: 767px) {
  .optionSecHero {
    height: 138.66667vw;
    margin-bottom: 37.33333vw;
  }
}

.optionSecHero .read {
  position: absolute;
  top: 60px;
  left: 4.16667%;
  color: #fff;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .optionSecHero .read {
    width: 100%;
    text-align: center;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding-top: 5.33333vw;
  }
}

.optionSecHero .read h2 {
  font-size: 60px;
  margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
  .optionSecHero .read h2 {
    font-size: 4.4rem;
    margin-bottom: 1.6vw;
  }
}

.optionSecHero .read .type {
  font-size: 14px;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .optionSecHero .read .type {
    font-size: 1.2rem;
    margin-bottom: 0;
  }
}

.optionSecHero .read .catch {
  font-size: 14px;
  line-height: 1.85714em;
}

@media screen and (max-width: 767px) {
  .optionSecHero .read .catch {
    font-size: 2rem;
    color: #000;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: -90.66667vw;
  }
}

.optionSecHero .bg {
  display: flex;
}

@media screen and (max-width: 767px) {
  .optionSecHero .bg {
    display: block;
  }
}

.optionSecHero .bg figure {
  width: 50%;
  height: 780px;
  overflow: hidden;
  position: relative;
}

@media screen and (max-width: 767px) {
  .optionSecHero .bg figure {
    width: 100%;
    height: 69.33333vw;
  }
}

.optionSecHero .bg figure figcaption {
  position: absolute;
  left: 8.33333%;
  bottom: 60px;
  color: #fff;
}

@media screen and (max-width: 767px) {
  .optionSecHero .bg figure figcaption {
    left: 5.33333vw;
  }
}

.optionSecHero .bg figure figcaption span {
  display: block;
}

.optionSecHero .bg figure figcaption .en {
  font-size: 28px;
  margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
  .optionSecHero .bg figure figcaption .en {
    font-size: 2rem;
    margin-bottom: 2.66667vw;
  }
}

.optionSecHero .bg figure figcaption .jp {
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .optionSecHero .bg figure figcaption .jp {
    font-weight: normal;
    font-size: 0.9rem;
  }
}

@media screen and (max-width: 767px) {
  .optionSecHero .bg figure:nth-of-type(1) figcaption {
    bottom: auto;
    top: 5.33333vw;
  }

  .optionSecHero .bg figure:nth-of-type(2) figcaption {
    bottom: 5.33333vw;
  }
}

.optionSecHero .read h2,
.optionSecHero .read .type,
.optionSecHero .read .catch,
.optionSecHero .bg img,
.optionSecHero .bg figure figcaption {
  opacity: 0;
  filter: alpha(opacity=0);
}

.optionSecHero.isShow .read h2 {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

.optionSecHero.isShow .read .type {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

.optionSecHero.isShow .read .catch {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

.optionSecHero.isShow .bg figure figcaption {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
}

.optionSecHero.isShow .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.optionSecTitle {
  padding-top: 30px;
}

@media screen and (max-width: 767px) {
  .optionSecTitle {
    padding-top: 13.33333vw;
  }
}

.optionSecTitle p {
  font-size: 14px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .optionSecTitle p {
    font-size: 1.4rem;
  }
}

.designSecHero {
  height: 780px;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .designSecHero {
    height: 217.33333vw;
    padding: 106.66667vw 8vw 0 8vw;
  }
}

.designSecHero .read {
  width: 342px;
  color: #fff;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 5.55556%;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .designSecHero .read {
    width: 100%;
    color: #000;
    top: 109.33333vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    right: 0;
    padding: 0 8vw;
  }
}

.designSecHero .read h2 {
  width: 328px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .designSecHero .read h2 {
    width: 78.4vw;
    margin-bottom: 5.33333vw;
  }
}

.designSecHero .read h2 img {
  width: 100%;
}

.designSecHero .read .text dt {
  font-size: 30px;
  line-height: 1.73333em;
  margin-bottom: 25px;
}

@media screen and (max-width: 767px) {
  .designSecHero .read .text dt {
    font-size: 2.6rem;
    margin-bottom: 5.33333vw;
  }
}

.designSecHero .read .text dd {
  font-size: 14px;
  line-height: 1.85714em;
}

@media screen and (max-width: 767px) {
  .designSecHero .read .text dd {
    font-size: 1.2rem;
  }
}

.designSecHero .gd.pc {
  width: 69px;
  position: absolute;
  bottom: 30px;
  right: 40px;
  z-index: +1;
}

.designSecHero .gd.pc img {
  width: 100%;
}

.designSecHero .bg {
  width: 100%;
  height: 780px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .designSecHero .bg {
    width: 100%;
    height: 217.33333vw;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.designSecHero .read h2,
.designSecHero .read .text dt,
.designSecHero .read .text dd,
.designSecHero .gd,
.designSecHero .bg img {
  opacity: 0;
  filter: alpha(opacity=0);
}

.designSecHero.isShow .read h2 {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

.designSecHero.isShow .read .text dt {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

.designSecHero.isShow .read .text dd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

.designSecHero.isShow .gd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.1s 1 normal forwards;
}

.designSecHero.isShow .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.designSecFeature {
  display: flex;
  width: 100%;
  height: 840px;
}

@media screen and (max-width: 767px) {
  .designSecFeature {
    display: block;
    height: auto;
  }
}

.designSecFeature .design1,
.designSecFeature .design2,
.designSecFeature .design3,
.designSecFeature .design4 {
  width: 50%;
  height: 840px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design1,
  .designSecFeature .design2,
  .designSecFeature .design3,
  .designSecFeature .design4 {
    width: 100%;
    height: auto;
    padding-top: 116.53333vw;
  }
}

.designSecFeature .design1 .en,
.designSecFeature .design2 .en,
.designSecFeature .design3 .en,
.designSecFeature .design4 .en {
  position: absolute;
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design1 .en,
  .designSecFeature .design2 .en,
  .designSecFeature .design3 .en,
  .designSecFeature .design4 .en {
    white-space: nowrap;
  }
}

.designSecFeature .design1 .en dt,
.designSecFeature .design2 .en dt,
.designSecFeature .design3 .en dt,
.designSecFeature .design4 .en dt {
  font-size: 28px;
  line-height: 1.21429em;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design1 .en dt,
  .designSecFeature .design2 .en dt,
  .designSecFeature .design3 .en dt,
  .designSecFeature .design4 .en dt {
    font-size: 2.4rem;
    margin-bottom: 2.66667vw;
  }
}

.designSecFeature .design1 .en dd,
.designSecFeature .design2 .en dd,
.designSecFeature .design3 .en dd,
.designSecFeature .design4 .en dd {
  font-size: 10px;
  line-height: 1.8em;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design1 .en dd,
  .designSecFeature .design2 .en dd,
  .designSecFeature .design3 .en dd,
  .designSecFeature .design4 .en dd {
    font-size: 0.8rem;
  }
}

.designSecFeature .design1 .jp,
.designSecFeature .design2 .jp,
.designSecFeature .design3 .jp,
.designSecFeature .design4 .jp {
  position: absolute;
  z-index: +1;
}

.designSecFeature .design1 .jp dt,
.designSecFeature .design2 .jp dt,
.designSecFeature .design3 .jp dt,
.designSecFeature .design4 .jp dt {
  font-size: 28px;
  line-height: 1.57143em;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design1 .jp dt,
  .designSecFeature .design2 .jp dt,
  .designSecFeature .design3 .jp dt,
  .designSecFeature .design4 .jp dt {
    font-size: 2.6rem;
    margin-bottom: 5.33333vw;
  }
}

.designSecFeature .design1 .jp dd,
.designSecFeature .design2 .jp dd,
.designSecFeature .design3 .jp dd,
.designSecFeature .design4 .jp dd {
  font-size: 12px;
  line-height: 1.83333em;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design1 .jp dd,
  .designSecFeature .design2 .jp dd,
  .designSecFeature .design3 .jp dd,
  .designSecFeature .design4 .jp dd {
    font-size: 1.2rem;
  }
}

.designSecFeature .design1 .bg,
.designSecFeature .design2 .bg,
.designSecFeature .design3 .bg,
.designSecFeature .design4 .bg {
  width: 100%;
  height: 840px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design1 .bg,
  .designSecFeature .design2 .bg,
  .designSecFeature .design3 .bg,
  .designSecFeature .design4 .bg {
    width: 100%;
    height: 116.8vw;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.designSecFeature .design2 {
  color: #000;
}

.designSecFeature .design2 .en {
  top: 180px;
  right: 11.11111%;
  width: 200px;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design2 .en {
    top: 10.66667vw;
    right: 8vw;
    width: auto;
  }
}

.designSecFeature .design2 .jp {
  top: 360px;
  right: 11.11111%;
  width: 200px;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design2 .jp {
    position: static;
    width: auto;
    background: linear-gradient(135deg, #fcfeff 0%, #b1bcc3 100%);
    padding: 16vw 8vw;
  }
}

.designSecFeature .design3 {
  color: #fff;
}

.designSecFeature .design3 .en {
  top: 470px;
  left: 70.83333%;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design3 .en {
    top: 50.66667vw;
    left: auto;
    right: 8vw;
  }
}

.designSecFeature .design4 {
  color: #fff;
}

.designSecFeature .design4 .en {
  top: 190px;
  left: 9.72222%;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design4 .en {
    top: 21.33333vw;
    left: 8vw;
  }
}

.designSecFeature .design4 .jp {
  top: 560px;
  right: 11.11111%;
  width: 340px;
}

@media screen and (max-width: 767px) {
  .designSecFeature .design4 .jp {
    position: static;
    width: auto;
    background: linear-gradient(135deg, #293033 0%, #000 100%);
    padding: 16vw 8vw;
  }
}

.designSecFeature .bg img {
  opacity: 0;
  filter: alpha(opacity=0);
}

.designSecFeature .design2 .en dt,
.designSecFeature .design2 .en dd,
.designSecFeature .design2 .jp dt,
.designSecFeature .design2 .jp dd,
.designSecFeature .design3 .en dt,
.designSecFeature .design3 .en dd,
.designSecFeature .design3 .jp dt,
.designSecFeature .design3 .jp dd,
.designSecFeature .design4 .en dt,
.designSecFeature .design4 .en dd,
.designSecFeature .design4 .jp dt,
.designSecFeature .design4 .jp dd {
  opacity: 0;
  filter: alpha(opacity=0);
}

.designSecFeature.fadeUpForElement.scrollin .design2 .en dt {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

.designSecFeature.fadeUpForElement.scrollin .design2 .en dd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

.designSecFeature.fadeUpForElement.scrollin .design2 .jp dt {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

.designSecFeature.fadeUpForElement.scrollin .design2 .jp dd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
}

.designSecFeature.fadeUpForElement.scrollin .design3 .en dt {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .designSecFeature.fadeUpForElement.scrollin .design3 .en dt {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  }
}

.designSecFeature.fadeUpForElement.scrollin .design3 .en dd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .designSecFeature.fadeUpForElement.scrollin .design3 .en dd {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  }
}

.designSecFeature.fadeUpForElement.scrollin .design4 .en dt {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .designSecFeature.fadeUpForElement.scrollin .design4 .en dt {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 1.7s 1 normal forwards;
  }
}

.designSecFeature.fadeUpForElement.scrollin .design4 .en dd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

@media screen and (max-width: 767px) {
  .designSecFeature.fadeUpForElement.scrollin .design4 .en dd {
    -webkit-animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
    animation: fadeUpForElement 0.6s ease-in-out 2s 1 normal forwards;
  }
}

.designSecFeature.fadeUpForElement.scrollin .design4 .jp dt {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.3s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.3s 1 normal forwards;
}

.designSecFeature.fadeUpForElement.scrollin .design4 .jp dd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 2.6s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 2.6s 1 normal forwards;
}

.designSecFeature.fadeUpForElement.scrollin .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.designSecColor {
  width: 100%;
  height: 560px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .designSecColor {
    height: auto;
    padding-top: 85.06667vw;
  }
}

.designSecColor dl {
  width: 360px;
  position: absolute;
  top: 50%;
  left: 11.11111%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: +1;
}

@media screen and (max-width: 767px) {
  .designSecColor dl {
    width: auto;
    position: static;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    background: #d8dcdf;
    padding: 13.33333vw 8vw;
  }
}

.designSecColor dl dt {
  font-size: 36px;
  color: #000;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .designSecColor dl dt {
    margin-bottom: 5.33333vw;
    font-size: 3.2rem;
  }
}

.designSecColor dl dd {
  font-size: 12px;
  line-height: 1.83333em;
}

@media screen and (max-width: 767px) {
  .designSecColor dl dd {
    font-size: 1.2rem;
  }
}

.designSecColor .bg {
  width: 100%;
  height: 560px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .designSecColor .bg {
    width: 100%;
    height: 85.33333vw;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.designSecColor .bg img,
.designSecColor dl dt,
.designSecColor dl dd {
  opacity: 0;
  filter: alpha(opacity=0);
}

.designSecColor.fadeUpForElement.scrollin dl dt {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.1s 1 normal forwards;
}

.designSecColor.fadeUpForElement.scrollin dl dd {
  -webkit-animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
  animation: fadeUpForElement 0.6s ease-in-out 1.4s 1 normal forwards;
}

.designSecColor.fadeUpForElement.scrollin .bg img {
  -webkit-animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
  animation: fadeZoom 2s ease-in-out 0s 1 normal forwards;
}

.designSecStory {
  background-color: #e4e4e5;
  color: #000;
  padding: 140px 11.11111% 160px 11.11111%;
  margin-bottom: 180px;
}

@media screen and (max-width: 767px) {
  .designSecStory {
    padding: 21.33333vw 8vw;
    margin-bottom: 48vw;
  }
}

.designSecStory h2 {
  font-size: 44px;
  text-align: center;
  padding-top: 80px;
  margin-bottom: 40px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .designSecStory h2 {
    font-size: 2.8rem;
    line-height: 1.57143em;
    padding-top: 18.66667vw;
    margin-bottom: 10.66667vw;
  }
}

.designSecStory h2::before,
.designSecStory h2::after {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.designSecStory h2::before {
  content: "PRODUCT STORY";
  font-size: 18px;
  top: 0;
}

@media screen and (max-width: 767px) {
  .designSecStory h2::before {
    font-size: 1.2rem;
  }
}

.designSecStory h2::after {
  content: "";
  width: 20px;
  height: 1px;
  background-color: #000;
  top: 36px;
}

@media screen and (max-width: 767px) {
  .designSecStory h2::after {
    width: 5.33333vw;
    top: 12vw;
  }
}

.designSecStory .read {
  font-size: 14px;
  line-height: 1.85714em;
  text-align: center;
  margin-bottom: 110px;
}

@media screen and (max-width: 767px) {
  .designSecStory .read {
    font-size: 1.2rem;
    text-align: left;
    margin-bottom: 21.33333vw;
  }
}

.designSecStory .story1,
.designSecStory .story2 {
  margin-bottom: 80px;
}

@media screen and (max-width: 767px) {
  .designSecStory .story1,
  .designSecStory .story2 {
    margin-bottom: 21.33333vw;
  }
}

.designSecStory .story1,
.designSecStory .story2,
.designSecStory .story3 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .designSecStory .story1,
  .designSecStory .story2,
  .designSecStory .story3 {
    display: block;
  }
}

.designSecStory .story1 h3,
.designSecStory .story2 h3,
.designSecStory .story3 h3 {
  font-size: 28px;
  line-height: 2em;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .designSecStory .story1 h3,
  .designSecStory .story2 h3,
  .designSecStory .story3 h3 {
    font-family: "Noto Serif JP", serif;
    font-size: 2.6rem;
    margin-bottom: 8vw;
  }
}

.designSecStory .story1 .image,
.designSecStory .story2 .image,
.designSecStory .story3 .image {
  order: 2;
  width: 30.35714%;
}

@media screen and (max-width: 767px) {
  .designSecStory .story1 .image,
  .designSecStory .story2 .image,
  .designSecStory .story3 .image {
    width: auto;
    margin: 10.66667vw 0;
  }
}

.designSecStory .story1 .image img,
.designSecStory .story2 .image img,
.designSecStory .story3 .image img {
  width: 100%;
}

.designSecStory .story1 .image figcaption,
.designSecStory .story2 .image figcaption,
.designSecStory .story3 .image figcaption {
  font-size: 11px;
  line-height: 1.81818em;
  margin-top: 10px;
}

@media screen and (max-width: 767px) {
  .designSecStory .story1 .image figcaption,
  .designSecStory .story2 .image figcaption,
  .designSecStory .story3 .image figcaption {
    font-size: 1rem;
    margin-top: 2.13333vw;
  }
}

.designSecStory .story1 .text,
.designSecStory .story2 .text,
.designSecStory .story3 .text {
  width: 60.71429%;
}

@media screen and (max-width: 767px) {
  .designSecStory .story1 .text,
  .designSecStory .story2 .text,
  .designSecStory .story3 .text {
    width: auto;
  }
}

.designSecStory .story1 .text p,
.designSecStory .story2 .text p,
.designSecStory .story3 .text p {
  font-size: 14px;
  line-height: 2em;
}

@media screen and (max-width: 767px) {
  .designSecStory .story1 .text p,
  .designSecStory .story2 .text p,
  .designSecStory .story3 .text p {
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 767px) {
  .designSecStory .story1 .text p:not(:last-child),
  .designSecStory .story2 .text p:not(:last-child),
  .designSecStory .story3 .text p:not(:last-child) {
    margin-bottom: 2em;
  }
}

.shopSecTitle {
  color: #000;
  border-top: 1px solid #eee;
  text-align: center;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .shopSecTitle {
    margin-bottom: 13.33333vw;
  }
}

.shopSecTitle h2 {
  padding-top: 90px;
}

@media screen and (max-width: 767px) {
  .shopSecTitle h2 {
    padding-top: 14.66667vw;
  }
}

.shopSecTitle h2 span {
  display: block;
}

.shopSecTitle h2 .jp {
  font-size: 36px;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .shopSecTitle h2 .jp {
    font-size: 2.4rem;
    margin-bottom: 5.33333vw;
  }
}

.shopSecTitle h2 .en {
  font-size: 12px;
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .shopSecTitle h2 .en {
    font-size: 1rem;
    margin-bottom: 8vw;
  }
}

.shopSecTitle .read {
  font-size: 13px;
}

@media screen and (max-width: 767px) {
  .shopSecTitle .read {
    font-size: 1.2rem;
    line-height: 1.75em;
  }
}

.shopSecList {
  width: 800px;
  margin: 0 auto 180px auto;
}

@media screen and (max-width: 767px) {
  .shopSecList {
    width: auto;
    margin: 0 8vw 29.33333vw 8vw;
  }
}

.shopSecList dl {
  margin-bottom: 18px;
}

@media screen and (max-width: 767px) {
  .shopSecList dl {
    margin-bottom: 4vw;
  }
}

.shopSecList dl div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #ddd;
  padding: 45px 0;
}

@media screen and (max-width: 767px) {
  .shopSecList dl div {
    padding: 5.86667vw 0;
  }
}

.shopSecList dl dt {
  font-size: 18px;
  color: #000;
}

@media screen and (max-width: 767px) {
  .shopSecList dl dt {
    font-size: 1.6rem;
  }
}

.shopSecList dl dd a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  width: 160px;
  height: 40px;
  color: #000;
  border: 1px solid #707070;
  border-radius: 20px;
}

@media screen and (max-width: 767px) {
  .shopSecList dl dd a {
    font-size: 1.2rem;
    width: 29.33333vw;
    height: 7.46667vw;
    border-radius: 5.33333vw;
  }
}

.shopSecList dl dd a:hover {
  border: 1px solid #000;
}

.shopSecList .caution {
  font-size: 11px;
}

@media screen and (max-width: 767px) {
  .shopSecList .caution {
    font-size: 1.2rem;
  }
}

.item_list_btn a:hover {
  color: inherit;
  opacity: 0.8;
  transition: 0.15s;
}

.fixedCartArea {
  position: fixed;
  right: 5px;
  bottom: 80px;
  top: auto;
  z-index: 995;
  width: 130px;
  height: 130px;
}

.na_cart_a {
  display: none;
}
@media screen and (max-width: 1097px) {
  #na_cart_count {
    top: -8px;
    right: -7px;
    width: 18px;
    font-size: 11px;
  }
  .na_cart_a {
    position: absolute;
    top: 50% !important;
    right: 70px;
    display: block;
    width: 28px !important;
    transform: translateY(-50%);
  }
}

.item_icon.item_icon--text {
  border-top: 1px solid #ffa700;
  border-bottom: 1px solid #ffa700;
  display: inline-block !important;
  font-size: 12px;
  padding: 2px 0;
  color: #ffa700;
  font-weight: 700;
}
#productHeader > .inner h1 a {
  color: #fff;
}

.colva_taitle {
  width: 70%;
  text-align: center;
  display: block;
  margin: 0 auto;
  padding: 15% 0 3% 0;
}
.tab_box {
  width: 100%;
}

input[type="radio"] {
  display: none;
}
.tab_area {
  width: 158px !important;
  margin: 0 auto;
}
#tab1:checked ~ .tab_area .tab1_label {
  background: #8d8d8d;
  color: #000;
}

.tab_area label {
  margin: 0 5px;
  display: inline-block;
  width: 24px;
}
.panel_area {
  background: #d5d5d5;
  padding: 10% 0;
  margin-top: 4%;
}
.tab_panel {
  width: 100%;
  padding: 0;
  display: none;
}
.color_img {
  width: 70%;
  display: block;
  margin: 0 auto;
}
.colorva {
  text-align: center;
  padding: 5%;
}
.tab_panel p:first-child {
  letter-spacing: 1px;
  text-align: center;
}
.tab_panel p:nth-child(2) {
  font-size: 59px;
  font-weight: bold;
  color: #1b384a;
}
.colorva p:nth-child(3) {
  padding: 5%;
  line-height: 1.5;
}
#tab2:checked ~ .panel_area #panel2 {
  display: block;
}
.tab_panel {
  width: 100%;
  padding: 0;
  display: none;
}
#tab1:checked ~ .panel_area #panel1 {
  display: block;
}
#tab2:checked ~ .panel_area #panel2 {
  display: block;
}
#tab3:checked ~ .panel_area #panel3 {
  display: block;
}
#tab4:checked ~ .panel_area #panel4 {
  display: block;
}

/* -------------------------------------------- */
/* ▼タブレット用デザインとして付け足すデザイン */
/* -------------------------------------------- */
@media (min-width: 768px) {
  .tab_panel {
    position: relative;
  }
  .colorva p:nth-child(3) {
    line-height: 1.5;
    font-size: 15px;
  }
  .colorva {
    padding: 0 0 0 0;
    /* float: right; */
    width: 50%;
    position: absolute;
    top: 70px;
    right: 6%;
  }
  .colva_taitle {
    width: 47%;
  }

  .col_wp {
    width: 50%;
    margin: 0 auto;
  }
  .tab_area {
    width: 21%;
  }
  .panel_area {
    padding: 0;
    margin-top: 4%;
    height: 310px;
  }
  .tab_panel {
    position: relative;
  }
  .color_img {
    width: 34%;
    position: absolute;
    top: 80px;
    left: 9%;
  }
}

/* ------------------------------------ */
/* ▼PC用デザインとして付け足すデザイン */
/* ------------------------------------ */
@media (min-width: 1024px) {
  .color_img {
    top: 40px;
  }
}

.pr_nm-top-slider-arrow-prev,
.pr_nm-top-slider-arrow-next {
  background: transparent !important;
}

section.fs-c-checkoutSuccess.fs-c-subSection {
  line-height: 1.5;
  text-align: center;
  padding-top: 40px;
}
h2.fs-c-checkoutSuccess__title {
  font-weight: bold;
  margin-bottom: 30px;
  font-size: 20px;
}
#fs_CheckoutSuccess main.fs-l-main {
  margin: 3rem auto;
  max-width: 100%;
  padding: 2rem;
}
