@charset "utf-8";

/* ==================================

  『商品ラインナップ』 SP Style

================================== */
.pc { display: none !important; }
.sp { display: inherit !important; }

p { font-size: calc(24 / 750 * 100vw); }

.link-next {
  font-size: calc(22 / 750 * 100vw);
  margin: 0 20px 0 0;
}

/* ----------------------------------

  Main Visual

---------------------------------- */
.main-visual { top: initial; }

/* F1
---------------------------------- */
.main-visual.f1 {
  width: 150%;
  margin: 0 0 0 -25%;
}
.main-visual.f1 ul li {
  width: 75%;
  height: auto;
  padding: 0;
}
.main-visual.f1 ul li.mv03 { display: none !important; }
.main-visual.f1 ul li span { position: relative; }

/* F2
---------------------------------- */
.main-visual.f2 .contents-area .inner { width: 100%; }
.main-visual.f2 h2 { width: calc(348 / 750 * 100vw); }
.main-visual.f2 .swiper-slide figure {
  height: auto;
  padding: 0;
}

/* ----------------------------------

  Section

---------------------------------- */

/* Breadcrumb
---------------------------------- */

/* Heading
---------------------------------- */
.heading {
  font-size: calc(48 / 750 * 100vw);
  margin: 0 0 calc(30 / 750 * 100%);
}

/* Intro
---------------------------------- */
.intro { padding: calc(80 / 750 * 100%) 0 calc(70 / 750 * 100%); }
.intro p { line-height: calc(40 / 24); }

/* custom
---------------------------------- */
.syouhin-select .inner{
    width: 100% !important;
    min-width: auto !important;
}
.select-wrap{
    display: block;
    justify-content: center;
    align-content: top;
}

.select-wrap .select-box {
    width: 100%;
    margin-bottom: 50px;
}

.select-wrap .select-box::after {
    content: "";
    display: block;
    clear: both;
}

.select-wrap .select-box:last-of-type {
    margin-bottom: 40px;
}

.syouhin-select h3{
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-size: calc(48 / 750 * 100vw);
    letter-spacing: 0.075em;
    text-align: center;
    margin-bottom: 30px;
}
.syouhin-select .mv{
    text-align: center;
    width: 100%;
}
.syouhin-select p.lead{
    text-align: left;
    padding: 20px;
    font-size: calc(28 / 750 * 100vw);
    line-height: 1.8em;  
}
.syouhin-select p br{ display:none; }
.linkbtn{
    width: 100%;
    margin: 0 auto 60px;
}
.linkbtn a{
    display: block;
    padding: 20px 0;
    text-align: center;
    font-size: 18px;
    border: 1px solid #ccc;
    color: #666;
}
.linkbtn a::after {
    content: "＞";
    display: inline-block;
    transform: scale(0.5, 1.0);
    padding-left: 20px;
}
.linkbtn a:hover{
    background: #ededed;
}

.recommend{
    padding: 20px 0 60px;
}
.recommend h4{
    text-align: center;
    font-size: calc(30 / 750 * 100vw);
    padding-bottom: 20px;
}
.recommend ul{
    display: flex;
    flex-direction: column;
}
.recommend li{
    width: 100%;
    border: 2px solid #ccc;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 10px;
    text-align: center;  
}
.recommend li p{
    font-size: calc(28 / 750 * 100vw);
    padding: 0 0 20px;
}
.recommend li img{
    width: 100%;
}
.recommend-accordion {
    width: 90%;
    margin: 40px auto 60px;
}

/* アコーディオンのスマホ調整
---------------------------------- */
/* トグルボタン（文字サイズの調整など） */
.accordion-toggle {
    font-size: calc(30 / 750 * 100vw);
    padding: 20px 10px;
}

.accordion-toggle .icon {
    right: 5%;
    font-size: calc(48 / 750 * 100vw);
    width: auto;
    transform: translateY(-50%);
    top: 50%;
}

.accordion-inner {
    padding: 0 20px; 
}
.accordion-content.is-open .accordion-inner {
    padding-bottom: 30px;
}

.recommend-group ul {
    flex-direction: column;
}
.recommend-group li {
    width: 100%;
    margin-bottom: 20px;
}
.recommend-group li:last-child {
    margin-bottom: 0;
}
.recommend-group li p {
    font-size: calc(28 / 750 * 100vw);
    min-height: auto;
}
/* Section Header
---------------------------------- */
.sec-header {
  display: block;
  margin: 0 0 calc(100 / 750 * 100%);
}
.sec-header > div:last-of-type {
  position: relative;
  width: 100%;
  padding: calc(60 / 750 * 100%) calc(40 / 750 * 100%) 0;
  /*
  background: url(../images_top/century/wave.png) no-repeat center calc(40 / 750 * 100%);
  background-size: 100%;
  */
}
.sec-header > div:last-of-type dl dt {
  margin: 0 0 calc(60 / 750 * 100%);
  /* margin: 0 0 calc(140 / 750 * 100%);} */
  line-height: 1.0;
}

/* Wave
---------------------------------- */
.wave {
  top: calc(150 / 750 * 100%);
  /* top: calc( ((750 * .5625) / 750) * 100vw + (120 / 750 * 100vw) ); */
  width: 100%;
  height: 80px;
  display: none;
}
.wave_2 { height: 100px; }
.other-model .wave { top: calc(120 / 750 * 100vw); }
.wave-canvas { width: 100%; }

/* Slider Styles
---------------------------------- */
.sec-header .swiper { width: 100%; }

/* Movie
---------------------------------- */
.movie-unit {
  width: 100%;
  padding: 0 0 56.25%;
}

/* Product LineUp
---------------------------------- */
.product-lineup {
  /* display: block; */ → コメントアウト
  margin: 0;
  flex-wrap: nowrap;
}
.product-item {
  width: 100%;
  margin: 0 0 calc(80 / 750 * 100%);
}
.ssbox .product-item {
  width: 100%;
  margin: 0 0 calc(80 / 750 * 100%);
}
.ssbox .product-item{
  width: 100%;
  margin: 0 0 calc(80 / 750 * 100%);
}

.product-item figure a::before {
 content: none;
  background-image: none !important;
}


.century .inner,
.genius .inner,
.smart-style .inner,
.mj-wood .inner {
  width: calc(710 / 750 * 100%);
  margin: 0 0 0 calc(40 / 750 * 100%) !important;
}
.ssbox .product-lineup {
  flex-direction: row;
  width: max-content;
}

/* Product Item Background Image
---------------------------------- */
/* Smart Style */
.product-item .si01 a { background-image: url(../images_top/smart-style/lineup_smart-style_img075.jpg); }
.product-item .si02 a { background-image: url(../images_top/smart-style/lineup_smart-style_img020.jpg); }
.product-item .si03 a { background-image: url(../images_top/smart-style/lineup_smart-style_img028.jpg); }
.product-item .si04 a { background-image: url(../images_top/smart-style/lineup_smart-style_img022.jpg); }
.product-item .si05 a { background-image: url(../images_top/smart-style/lineup_smart-style_img024.jpg); }
.product-item .si06 a { background-image: url(../images_top/smart-style/lineup_smart-style_img023.jpg); }

.product-item.new::before {
  top: calc(111 / 750 * 100vw / 2 * -1);
  left: calc(111 / 750 * 100vw / 4 * -1);
  width: calc(111 / 750 * 100vw);
  height: calc(111 / 750 * 100vw);
}
.product-item dl dt {
  font-size: calc(30 / 750 * 100vw * 1.111111);
  line-height: initial;
  margin: calc(45 / 750 * 100%) 0 calc(35 / 750 * 100%);
}
.product-item dl dt small { font-size: calc(24 / 30 * 1em * 1.111111); }
.product-item dl dd p { line-height: calc(40 / 24); }
.product-item dl dd:last-of-type { margin: 10px 0 0; }
.ssbox dl dd p span{ display:none; }
.ssbox dl dd p br.sp{display: block;}

.tag { font-size: 12px; }

/* Slick Slider Styles */
.slick-slider {
  width: calc(100% + (40 / 750 * 100%));
  overflow: hidden;
  z-index: 10; 
}
.slick-list { padding: 0 calc(40 / 750 * 100%) 0 0; }
/*.slick-slide { margin: 0 20px 0 0; }*/

.slick-slide { 
margin: 0 20px 0 0;
height: auto !important;
-webkit-backface-visibility: hidden;
-webkit-transform-style: preserve-3d;
}

.product-item .op01 a { background-image: url(../images_top/other-products/marge.jpg); }
.product-item .ci05 a { background-image: url(../images_top/century/lineup_century_img050.jpg); }


/* Smart Style
---------------------------------- */
.smart-style { margin: calc(200 / 750 * 100%) 0 0; }
.smart-style .sec-header > div:last-of-type dl dt img { width: calc(323 / 480 * 100%); }
.smart-style .product-item:first-of-type dl dt img { width: calc(336 / 750 * 100vw * 1.111111); }
.smart-style .product-item:nth-of-type(2) dl dt img { width: calc(241 / 750 * 100vw * 1.111111); }
.smart-style .product-item:nth-of-type(3) dl dt img { width: calc(365 / 750 * 100vw * 1.111111); }
.smart-style .product-item:nth-of-type(4) dl dt img { width: calc(238 / 750 * 100vw * 1.111111); }
.smart-style .product-item:nth-of-type(5) dl dt img { width: calc(242 / 750 * 100vw * 1.111111); }
.smart-style .product-item:last-of-type dl dt img { width: calc(236 / 750 * 100vw * 1.111111); }

.ssbox .product-item figure a {
    position: relative;
    width: 100%;
    height: 0;
    padding: 0 0 calc(413 / 670 * 100%);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: cover;
    cursor: pointer;
    pointer-events: inherit;
    display: block;
}