@charset "UTF-8";

/*---------------------------
  
  1.キービジュアル
  2.製品概要
  3.製品紹介

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

/* ================================================================
 * 
 * キービジュアル
 * 
 * ================================================================ */

.kv{
    background-image: url("./../images/group/kv-bg-cover.webp"), url("./../images/group/kv-parts.webp"), url("./../images/group/kv-bg.webp");
    background-repeat: no-repeat,no-repeat, no-repeat;
    background-position:
        left top,
        left top,
        left top;
    background-blend-mode: multiply,screen, normal;
    background-size: cover,contain,cover;
    background-attachment: fixed,fixed, fixed;
}

.kv__container{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    
    padding: 3.3% 5% 4.3% 5%;
}

/******************Media Queries******************/
/* --- 960px: Standard Desktop --- */
@media (min-width: 960px) {
    .kv{
        background-position:
        right top,
        left top,
        right top;
        background-blend-mode: multiply,screen, normal;
        background-size: cover,contain,cover;
        background-attachment: fixed,fixed, fixed;
    }
}

/* ----------------------------------------------------------------  
   text (kv__content-group) 
------------------------------------------------------------------- */ 
.kv__content-group{
    flex: 1;
}

.kv__heading{
    font-size: 2.8rem;
    line-height: 4.0rem;
    color: var(--color-bg-alt);
    margin-bottom: 2.0rem;
	font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: var(--font-weight-semibold);
}

.kv__text{
    color: var(--color-bg-alt);
    text-align: left;
    font-size: 1.6rem;
	line-height: 2.4rem;
}


/* --- 768px: Tablet Landscape & PC Base --- */
@media (min-width: 768px) {
    .kv__heading{
        font-size: 7.0rem;
        line-height: 8.0rem;
    }
    
    .kv__text{
		font-size: 2.4rem;
		line-height: 3.6rem;
        margin-bottom: 0;
    }
    
    .kv-img{
        margin-left: 2.6%;
        max-width: 55.8%;
    }
}

/* --- 1280px: Desktop Standard / Max Content Width --- */
@media (min-width: 1280px) {
    .kv__heading{
        font-size: 5.6rem;
        line-height: 84px;
    }
    
    .kv__text{
        font-size: 2.0rem;
    }
}

/* --- 1920px: Full HD Wide / Layout Expansion --- */
@media (min-width: 1920px) {
    .kv__container{
        height: 450px;
        max-width: 1792px;
        margin: 0 auto;
        padding: 0;
    } 
    
    .kv__heading{
        font-size: 7.0rem;
        line-height: 111px;
    }
    
    .kv__text{
        font-size: 2.4rem;
    }
    
}

/* --- 1920px: 4K Display (200% Scaling) / High-Density Layout --- */
@media (min-width: 1920px) and (resolution: 2dppx) {
    .kv__heading{
        font-size: 6.8rem;
        line-height: 102px;
    }
    
    .kv__text{
        font-size: 2.0rem;
    }
}

/* ================================================================
 * 
 * 製品概要（product-info）
 * 
 * ================================================================ */

.product-info{
    background:url(./../images/group/product-description-series-img-2x.webp) no-repeat left top;
    background-size: cover;
}

/* 製品タイトル */
.product-title{
    margin-bottom: 1.6rem;
}

/* 製品名 */
.product-name{
    margin-bottom: 2.4rem;
}

/* 製品紹介文 */
.product-description{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.product-description__inner{
    margin-bottom: 2.4rem;
}

.product-description__text:not(:last-of-type){
    margin-bottom: 2.0rem;
}

/******************Media Queries******************/
/* --- 960px: Standard Desktop --- */
@media (min-width: 960px) {
    /* 製品タイトル */
    .product-title{
        font-size: 2.4rem;
    }
    
    /* 製品紹介文 */
    .product-description{
        flex-wrap: nowrap;
    }
    
    /*製品紹介画像*/
    .product-flow-img{
    margin-left: 3.5%;
}
}

/* --- 1280px: Desktop Standard / Max Content Width --- */
@media (min-width: 1280px) {
    /* 製品タイトル */
    .product-title{
        font-size: 4.8rem;
        margin-bottom: 3.2rem;
    }
    
    /* 製品名（ルビ） */
    .product-subtitle{
        font-size: 1.8rem;
    }
    
    /* 製品名 */
    .product-name{
        font-size: 6.0rem;
    }
    
    /* 製品紹介文 */
    .product-description{
        font-size: 2.4rem;
        line-height: 4.8rem;
        margin-bottom: 0;
        
    }

    .product-description__inner{
        margin-bottom: 0;
        max-width: 48%;
    }

    .product-description__text:not(:last-of-type){
        margin-bottom: 4.0rem;
    }
    
}

/*特徴*/
.product-details__feature {
  background-color: var(--color-bg-base);
}

#group-series .product-details__container{
    padding-bottom: 0;
}


/* ================================================================
 * 
 * 製品紹介
 * 
 * ================================================================ */

/* ----------------------------------------------------------------  
   ナビゲーション 
------------------------------------------------------------------- */

#group-series .product-details__slide-indicator-guide{
    border:1px solid var(--color-accent-group);
}

/* ★ 選択時（アクティブ時）のスタイル ★ */
#group-series .swiper-pagination-bullet-active {
  background:var(--color-accent-group);
}



/******************Media Queries******************/
/* --- 768px: Tablet Landscape & PC Base --- */
@media (min-width: 768px) {
    .product-details__slide-nav {
        justify-content: flex-start;
    }

    .product-details__slide-indicator:not(:last-of-type) {
        margin-right: 2.4rem;
    }
}
/* --- 960px: Standard Desktop --- */
@media (max-width: 959px) {
    .product-details__slide-nav {
        display: none;
    }
}


/* ----------------------------------------------------------------  
   シリーズ機能 特徴
------------------------------------------------------------------- */
/*全体*/
.product-feature{
	background:var(--color-bg-alt);
}

.product-feature__container{
    display: flex;
    flex-wrap: wrap;
    max-width: 1600px;
    margin: 0 auto;
}

/*card*/
/******************Media Queries******************/
/* --- 768px: Tablet Landscape & PC Base --- */
@media (min-width: 768px) {
    .product-feature__container{
        justify-content: space-between;
    }
    
    .product-feature__card{
        width:48%;
    }
}


/* --- 960px: Standard Desktop --- */
@media (min-width: 960px) {
    .product-feature__container{
        justify-content:flex-start;
    }
    
    .product-feature__card{
        width:22%;
    }

    .product-feature__card:not(:last-of-type){
        margin-right: 4%;
    }
}

/*img*/
.product-feature__card-img{
    text-align: center;
    margin-bottom: 5.0rem;
}

/*タイトル*/
.product-feature__definition-title{
    text-align: center;
    font-weight: var(--font-weight-semibold);
    margin-bottom: 1.6rem;
}

/*テキスト*/
.product-feature__definition-text{
    font-size: 1.8rem;
    line-height: 36px;
}


/*ボタン*/
/******************Media Queries******************/
/* --- 960px: Standard Desktop --- */
@media (min-width: 960px) {
    .cta-detail__btn.cta-detail__btn-group {
        width:280px;
    }
}

/* ================================================================
 * 
 * 導入の流れ（introduction-flow）
 * 
 * ================================================================ */

.introduction-flow {
    background-color: var(--color-bg-alt);
}

/* ================================================================
 * 
 * FAQ（faq）
 * 
 * ================================================================ */

.faq {
    background-color: var(--color-bg-base);
}

/* ================================================================
 * 
 * 題字改行
 * 
 * ================================================================ */
.sp-br {
  display: none;
}

@media (max-width: 543px) {
  .sp-br {
    display: inline;
  }
}