@charset "UTF-8";

section { margin: 0 auto 150px;}

@media screen and (max-width:799px){
    section { margin-bottom: 60px;}
}


h2 { margin: 0 0 60px; font-size: 60px; line-height: 1.0em;}

@media screen and (max-width:1199px){
    h2 { font-size: 45px;}
}

@media screen and (max-width:999px){
    h2 { margin: 0 0 30px; font-size: 55px; text-align: center;}
}

@media screen and (max-width:699px){
    h2 { font-size: 40px;}
}

@media screen and (max-width:599px){
    h2 { font-size: 28px;}
}

/**========================================**/
/* bxslider */
a.bx-prev, 
a.bx-next {
	display:block; position: absolute; top: 50%; z-index: 5;
	width: 50px; height: 100px;
    text-indent: -999999px;}

a.bx-prev:hover,
a.bx-next:hover {opacity: 0.5;}

a.bx-prev { left: 20px;}
a.bx-next { right: 20px;}

@media screen and (max-width:1199px){
    a.bx-prev, 
    a.bx-next { width: 30px; height: 60px;}
}

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

/**============================================================================================**/
/* メインイメージ */
#img { position: relative;}

#img .mb { display: none;}

@media screen and (max-width:999px){
    #img { margin-bottom: 80px;}
}

@media screen and (max-width:799px){
    #img { margin-bottom: 60px;}
}

@media screen and (max-width:599px){
    #img .pc { display: none;}
    #img .mb { display: block;}
}

/**========================================**/
/* bxslider */
#img a.bx-prev,
#img a.bx-next { transform: translateY(-50%);}

#img a.bx-prev { background: url("../images/nav-l_wh.webp"); background-size: 100% auto;}
#img a.bx-next { background: url("../images/nav-r_wh.webp"); background-size: 100% auto;}

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

/**============================================================================================**/
/* ASIWO COLLECTION */
#item { position: relative;}

@media screen and (max-width:799px){
    #item { padding: 0 20px;}
}

/**========================================**/
/* bxslider */
#item .bx-wrapper { padding: 0 100px;}

#item a.bx-prev { background: url("../images/nav-l_cy.webp"); background-size: 100% auto;}
#item a.bx-next { background: url("../images/nav-r_cy.webp"); background-size: 100% auto;}

@media screen and (max-width:1199px){
    #item .bx-wrapper { padding: 0 80px;}
}

/**========================================**/
#item li { 
    display: table; table-layout: fixed;
    box-sizing: border-box; width: 100%; padding: 5.2vw 10.41vw;
    border: solid 2px #000;
    border-radius: 50px;}

#item li > * { display: table-cell; vertical-align: middle;}
#item li > *:nth-child(1) {  padding: 0 6vw 0 0;}
#item li > *:nth-child(2) {  padding: 0 0 0 6vw; text-align: right;}


@media screen and (max-width:1599px){
    #item li > *:nth-child(1) { padding-right: 6vw;}
    #item li > *:nth-child(2) { padding-left: 6vw;}
}

@media screen and (max-width:1399px){
    #item li { padding: 4vw 7vw;}
    #item li > *:nth-child(1) { padding-right: 5vw;}
    #item li > *:nth-child(2) { padding-left: 5vw;}
}

@media screen and (max-width:1199px){
    #item li { padding: 4vw 7vw;}
    #item li > *:nth-child(1) { padding-right: 5vw;}
    #item li > *:nth-child(2) { padding-left: 5vw;}
}

@media screen and (max-width:999px){
    #item li { padding: 30px 20px; border-radius: 20px;}
}

@media screen and (max-width:799px){
    #item { padding: 0 20px;}
    
    #item li { 
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column-reverse;
        flex-direction: column-reverse;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: 0 0 30px; padding: 60px 20px 30px;}
        
    #item li > * { box-sizing: border-box; width: 100%;}
    #item li > *:nth-child(1) { padding-right: 0;}
    #item li > *:nth-child(2) { padding: 0 20px; text-align: center;}
}

@media screen and (max-width:699px){
    #item li > *:nth-child(2) { padding: 0;}
}

/**========================================**/
/* 品名 */
h3 { margin: 0 0 40px; color: #53b4ba; font-size: 90px; line-height: 1.0em;}

/* カテゴリー */
#item .category { font-size: 0;}
#item strong { 
    display: inline-block;
    margin: 0 20px 20px 0; padding: 10px;
    border: solid 2px #53b4ba; border-radius: 10px;
    color: #53b4ba; font-size: 23px; font-weight: 900; line-height: 1.0em;}

/* スペック */
#item .spec { 
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap; margin: 40px 0 0;}

#item .spec p {
    box-sizing: border-box; width: 50%; padding-bottom: 40px;
    color: #9fa1a0; vertical-align: top;}

#item .spec p:nth-child(odd) { padding-right: 25px;}
#item .spec p:nth-child(even) { padding-left: 25px;}

#item .spec span {
    display: block;
    margin: 0 0 10px; padding-bottom: 15px;
    border-bottom: dashed 2px #9fa1a0;
    color: #000; font-size: 40px; line-height: 1.0em;}

/* 商品情報はこちら */
#item li a {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    position: relative;
    box-sizing: border-box; width: 260px; height: 60px; margin: 0 auto; padding-right: 55px;
    border: solid 1px #000; 
    border-radius: 30px;
    font-size: 20px; line-height: 1.0em; text-decoration: none;}

#item li a::after {
    content: '';
    display: block; position: absolute; top: 50%; right: 15px;
    width: 44px; height: 44px;
    background: url("../images/sitelink.webp");
    background-size: 100% auto;
    transform: translateY(-50%);}

#item li a:hover { opacity: 0.5;}

@media screen and (max-width:1599px){
    /* 品名 */
    h3 { font-size: 70px;}

    /* カテゴリー */
    #item strong { font-size: 20px;}

    /* スペック */
    #item .spec span { font-size: 30px;}    
}

@media screen and (max-width:1199px){
    /* 品名 */
    h3 { font-size: 60px;}

    /* カテゴリー */
    #item strong { margin: 0 10px 15px 0; font-size: 14px;}

    /* スペック */
    #item .spec { margin: 20px 0 0;}
    #item .spec p { padding-bottom: 30px; font-size: 14px;}
    #item .spec span { padding-bottom: 10px; font-size: 22px;}      
}

@media screen and (max-width:999px){
    /* 商品情報はこちら */
    #item li a { 
        width: 100%; height: 40px; padding-right: 38px; 
        font-size: 16px;}

    #item li a::after { right: 8px; width: 30px; height: 30px;}    
}

@media screen and (max-width:899px){
    /* 品名 */
    h3 { font-size: 50px;}

    /* スペック */
    #item .spec p { padding-bottom: 20px;}
    #item .spec p:nth-child(odd) { padding-right: 20px;}
    #item .spec p:nth-child(even) { padding-left: 20px;}

    /* カテゴリー */
    #item strong { padding: 8px;}
}

@media screen and (max-width:799px){
    /* 品名 */
    h3 { margin-top: 40px; text-align: center;}
    
    /* カテゴリー */
    #item .category { text-align: center;}
    #item strong { margin: 0 5px 20px;}

    #item img { max-width: 300px;}
}

@media screen and (max-width:399px){
    #item img { max-width: 200px;}
}

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

/**============================================================================================**/
/* Follow Us on Instagram */
#insta { position: relative; padding: 0 90px;}

/* @asiwo_jp */
#insta > a {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    position: absolute; top: 0; right: 100px;
    box-sizing: border-box; width: 275px; height: 60px; margin: 0 auto; padding: 0 55px;
    border: solid 1px #000; 
    border-radius: 30px;
    font-size: 20px; line-height: 1.0em; text-decoration: none;}

#insta > a::before,
#insta > a::after {
    content: '';
    display: block; position: absolute; top: 50%;
    width: 44px; height: 44px;
    transform: translateY(-50%);}

#insta > a::before {
    left: 15px;
    background: url("../images/insta.webp");
    background-size: 100% auto;}

#insta > a::after {
    right: 15px;
    background: url("../images/sitelink.webp");
    background-size: 100% auto;}

#insta > a:hover { opacity: 0.5;}

@media screen and (max-width:999px){
    #insta { padding: 0 15px;}

    /* @asiwo_jp */
    #insta > a {
        position: relative; top: auto; right: auto;
        width: 190px; height: 40px; margin-bottom: 30px; padding: 0 41px;
        border-radius: 20px;
        font-size: 16px;}

    #insta > a::before,
    #insta > a::after { width: 30px; height: 30px;}
    
    #insta > a::before { left: 10px;}
    #insta > a::after { right: 10px;}
}

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

/**============================================================================================**/
/* Seen in Action */
#mv h2 { padding: 0 100px;}

#mv ul.mv { padding: 0 90px;}
#mv li { margin: 0 10px;}
#mv li div { position: relative; width: 100%; padding: 177.57% 0 0;}
#mv video {
    position: absolute; top: 0; right: 0;
    width: 100%; height: 100%;
    border-radius: 20px;}


/* slick */
#mv .slick-list { 
    box-sizing: border-box; width: 100%; 
    /* padding: 0 5%; */    
    }

@media screen and (max-width:1499px){
    #mv ul.mv { padding: 0;}
    #mv .slick-list { padding: 0 10%;}
}

@media screen and (max-width:999px){
    #mv h2 { padding: 0 20px;}
}
/*
@media screen and (max-width:799px){
    #mv .slick-list{ padding: 0 20%;}
}
*/
@media screen and (max-width:699px){
    #mv li { margin: 0 5px;}
    #mv .slick-list{ padding: 0 22%;}
}

@media screen and (max-width:499px){
    #mv .slick-list{ padding: 0 15%;}
}


/* slick ドットナビゲーションボタン */
#mv ul.slick-dots { margin: 20px 0 0; text-align: center;}
#mv ul.slick-dots li {display: inline-block; margin: 0 5px 5px; padding: 0;}
#mv ul.slick-dots button {
    display: block; 
    width:10px; height:10px; margin:0; padding: 0;
	border: none; border-radius: 5px; outline: 0;
	background: #cecece;
    text-indent: -9999px;}

#mv .slick-dots li.slick-active button {background: #53b4ba;}

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

/**============================================================================================**/
/* News */
#news { position: relative; padding: 0 70px;}
#news h2 { padding: 0 15px;}

/* すべて見る */
#news > a {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    position: absolute; top: 0; right: 100px;
    box-sizing: border-box; width: 220px; height: 60px; margin: 0 auto; padding-right: 55px;
    border: solid 1px #000; 
    border-radius: 30px;
    font-size: 20px; line-height: 1.0em; text-decoration: none;}

#news > a::after {
    content: '';
    display: block; position: absolute; top: 50%; right: 15px;
    width: 44px; height: 44px;
    background: url("../images/sitelink.webp");
    background-size: 100% auto;
    transform: translateY(-50%);}

#news > a:hover { opacity: 0.5;}


@media screen and (max-width:999px){
    #news { padding: 0 5px;}

    /* すべて見る */
    #news > a {
        position: relative; top: auto; right: auto;
        width: 150px; height: 40px; margin-bottom: 30px; padding-right: 41px;
        border-radius: 20px;
        font-size: 16px;}

    #news > a::after { right: 10px; width: 30px; height: 30px;}
}
/**========================================**/
/* ブログ一覧 */
#resuco ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 1760px; margin: 0 auto;} 
        
#resuco li { width: 410px; padding: 0 15px 30px;}

/* リンク */
#resuco a { text-decoration: underline;}
#resuco a:hover { color: #53b4ba;}

/* アイキャッチ */
#resuco div { width: 410px; margin: 0 auto 20px;}
#resuco img { width: 410px; height: 410px; object-fit: cover;}

/* 投稿日 */
#resuco .date { margin: 5px 0 0; text-align: right;}

@media screen and (max-width:1899px){
    #resuco ul { width: 1660px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 385px;}

    #resuco img { height: 385px;}
}

@media screen and (max-width:1799px){
    #resuco ul { width: 1560px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 360px;}

    #resuco img { height: 360px;}
}

@media screen and (max-width:1699px){
    #resuco ul { width: 1460px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 335px;}

    #resuco img { height: 335px;}
}

@media screen and (max-width:1599px){
    #resuco ul { width: 1360px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 310px;}

    #resuco img { height: 310px;}
}

@media screen and (max-width:1499px){
    #resuco ul { width: 1260px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 285px;}

    #resuco img { height: 285px;}
}

@media screen and (max-width:1399px){
    #resuco ul { width: 1160px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 260px;}

    #resuco img { height: 260px;}
}

@media screen and (max-width:1299px){
    #resuco ul { width: 1060px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 500px;}

    #resuco img { height: 500px;}
}

@media screen and (max-width:1199px){
    #resuco ul { width: 960px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 450px;}

    #resuco img { height: 450px;}
}

@media screen and (max-width:1099px){
    #resuco ul { width: 860px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 400px;}

    #resuco img { height: 400px;}
}

@media screen and (max-width:999px){
    #resuco ul { width: 890px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 400px;}

    #resuco img { height: 400px;}
}

@media screen and (max-width:899px){
    #resuco ul { width: 790px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 365px;}

    #resuco img { height: 365px;}
}

@media screen and (max-width:799px){
    #resuco ul { width: 690px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 315px;}

    #resuco img { height: 315px;}
}

@media screen and (max-width:699px){
    #resuco ul { width: 590px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 285px;}
        
    #resuco li { padding: 0 5px 30px;}
    #resuco div { margin-bottom: 10px;}
    #resuco img { height: 285px;}
    
}

@media screen and (max-width:599px){
    #resuco ul { width: 490px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 235px;}

    #resuco img { height: 235px;}
}

@media screen and (max-width:499px){
    #resuco ul { width: 390px;}
    
    #resuco li,
    #resuco div,
    #resuco img { width: 185px;}

    #resuco img { height: 185px;}
}

@media screen and (max-width:399px){
    #resuco ul { display: block; width: auto;} 

    #resuco ul,
    #resuco li,
    #resuco div,
    #resuco img { width: 280px;}

     #resuco li { padding: 0 0 30px;}
    #resuco img { height: 280px;}
}

/* LastUp2025.07.07_kimata */