@charset "utf-8";
/* CSS Document */

@media only screen and (max-width: 600px) { body.top .top-head{ padding: 56px 0 0 0; } }

/*-----swiper.css上書き分-----*/

body.top .swiper-inner{
    width: 60%; margin: 0 auto; text-align: center;
    }
    @media only screen and (max-width: 1024px) {
        body.top .swiper-inner{  width: 60%;}
        }
        @media only screen and (max-width: 768px) {
            body.top .swiper-inner{  width: 60%;}
            }
body.top .swiper{ text-align: center; }
body.top .slider2 .swiper-slide{ padding: 0 0 60px 0; background-color: #fff;}
body.top .slider2 .swiper-slide img{ border-top-left-radius: 60px; border-bottom-right-radius: 60px; position: relative; }

body.top .top-head-r .swiper-button-next {
        width: 60px;
        height: 60px;
        margin-top: -60px;
        background-size: 60px 60px;
        right: 120px !important; background-image: url("../img/common/ic-more2.png");
    }
    @media only screen and (max-width: 1440px) { 
        body.top .top-head-r .swiper-button-next { right: 80px !important; }
        }
        @media only screen and (max-width: 1024px) {
            body.top .top-head-r .swiper-button-next {
                width: 40px;
                height: 40px;
                margin-top: -40px;
                background-size: 40px 40px;
                right: 60px !important;
                }
            }
            @media only screen and (max-width: 600px) {
                body.top .top-head-r .swiper-button-next {
                    width: 30px;
                    height: 30px;
                    margin-top: -30px;
                    background-size: 30px 30px;
                    right: 30px !important;
                    }
                }
body.top .top-head-r .swiper-button-prev {
    width: 60px;
    height: 60px;
    margin-top: -60px;
    background-size: 60px 60px;
    left: 120px !important; background-image: url("../img/common/ic-more2.png");
    transform: rotate( -180deg );
    }
    @media only screen and (max-width: 1440px) { 
        body.top .top-head-r .swiper-button-prev { left: 80px !important;}
        }
        @media only screen and (max-width: 1024px) {
            body.top .top-head-r .swiper-button-prev {
                width: 40px;
                height: 40px;
                margin-top: -40px;
                background-size: 40px 40px;
                left: 60px !important;
              }
            }
            @media only screen and (max-width: 600px) {
                body.top .top-head-r .swiper-button-prev {
                    width: 30px;
                    height: 30px;
                    margin-top: -30px;
                    background-size: 30px 30px;
                    left: 30px !important;
                  }
                }
        
body.top .swiper-slide span {
    position: absolute;
    left: 0;
    bottom: 20px;
    z-index: 10;
    font-size: 14px;
    font-weight: normal !important;
    text-align: left;
    /*white-space: nowrap;*/
    background: #fff;
    }
    @media only screen and (max-width: 1024px) {
        body.top .swiper-slide span { font-size: 12px; bottom: 10px; }
        }
        @media only screen and (max-width: 600px) {
            body.top .swiper-slide span { font-size: 11px; }
            }

body.top .top-head{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    /*min-height:100vh;*/
    margin: 0 auto 60px;
    }
    @media only screen and (max-width: 768px) {
        body.top .top-head{ display: block; /*min-height: 100vh;*/ }
        }
        @media only screen and (max-width: 600px) {
            body.top .top-head{ margin: 0 auto 40px; }
        }

body.top .top-head-l{
    display: flex;
    /*align-items: center;*/
    justify-content: center;
    width: 46%;
    }
    @media only screen and (max-width: 768px) {
        body.top .top-head-l{ display: block; width: 100%; margin-bottom: 60px; }
    } 
body.top .top-head-l img{ border-bottom-right-radius: 60px; }

body.top .top-head-r{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44%;
    position: relative;
    padding: 0 5% 0 5%;
    }
    @media only screen and (max-width: 768px) {
        body.top .top-head-r{ display: block; width: 100%; padding: 0; }
    } 

body.top .top-txt{ text-align: center; margin: 0 auto 60px; }
@media only screen and (max-width: 600px) {
    body.top .top-txt{ text-align: left; width: 80%; margin: 0 auto 40px; }
    }
body.top .top-txt h2{ font-weight: normal;}
body.top .top-txt ul:nth-of-type(1){ font-family: 'ShipporiMincho-Regular'; color: #61573b; }
body.top .top-txt ul:nth-of-type(1) li:nth-of-type(1){ font-size: 20px; margin-bottom: 20px;}
@media only screen and (max-width: 1024px) { body.top .top-txt ul:nth-of-type(1) li:nth-of-type(1){ font-size: 16px; }}
@media only screen and (max-width: 600px) { body.top .top-txt ul:nth-of-type(1) li:nth-of-type(1){ font-size: 14px; }}
@media only screen and (max-width: 600px) { body.top .top-txt ul:nth-of-type(1) li:nth-of-type(1) span{ display: block; }}
body.top .top-txt ul:nth-of-type(1) li:nth-of-type(2){
    font-size: 14px; margin-bottom: 0px;
    }
    @media only screen and (max-width: 600px) {
        body.top .top-txt ul:nth-of-type(1) li:nth-of-type(2){ font-size: 12px; }
        }
body.top .top-txt ul:nth-of-type(1) li:nth-of-type(3) h2{
    font-size: 42px; margin-bottom: 20px; line-height: 1.2; letter-spacing: 0.2em;
    }
    @media only screen and (max-width: 600px) {
        body.top .top-txt ul:nth-of-type(1) li:nth-of-type(3) h2{ font-size: 26px;}
        }
body.top .top-txt ul:nth-of-type(2){
    font-family: 'Playfair Display', serif; color: #C8BB9B; font-size: 14px;
    }
    @media only screen and (max-width: 600px) {
        body.top .top-txt ul:nth-of-type(2){ font-size: 11px; }
        }
/*:nth-of-type(1)*/

/*-----ABOUT-----*/

body.top .top-about{
    background-image: url(../img/top/top-about-bg1.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 160px 0;
    }
    @media only screen and (max-width: 1024px) {
        body.top .top-about{padding: 100px 0;}
        }
        @media only screen and (max-width: 600px) {
            body.top .top-about{padding: 70px 0; background-image: url(../img/top/top-about-bg1-sp.jpg);}
            }

body.top .top-about .top-about-inner{
    width: 1024px; margin: 0 auto; display: flex; color: #fff;
    }
    @media only screen and (max-width: 1024px) {
        body.top .top-about .top-about-inner{ width: 90%;}
        }
        @media only screen and (max-width: 600px) {
            body.top .top-about .top-about-inner{ display: block; width: 80%;}
        }

body.top .top-about .top-about-inner div:nth-of-type(1){
    width: 30%;
    text-align: right;
    margin-right: 10%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    }
    @media only screen and (max-width: 768px) {
        body.top .top-about .top-about-inner div:nth-of-type(1){ margin-right: 5%;}
        }
        @media only screen and (max-width: 600px) {
            body.top .top-about .top-about-inner div:nth-of-type(1){ margin-right: 0; display: block; width: 100%; text-align: left; margin-bottom: 50px; }
        }
body.top .top-about .top-about-inner div:nth-of-type(1) span{
    font-family: 'Playfair Display', serif;
    font-size: 26px;
    position: relative;
    padding: 0 0 0 80px;
}
@media only screen and (max-width: 1024px) {
    body.top .top-about .top-about-inner div:nth-of-type(1) span{ font-size: 22px; }
}
@media only screen and (max-width: 600px) {
    body.top .top-about .top-about-inner div:nth-of-type(1) span{ padding: 0; }
}
body.top .top-about .top-about-inner div:nth-of-type(1) span::after{
    position: absolute;
    top: 50%;
    left: 0;
    content: "";
    width: 60px;
    height: 1px;
    background-color: rgb(255 255 255 / 30%);
    /*transform: translate(0%, -50%);*/
    }
    @media only screen and (max-width: 600px) {
        body.top .top-about .top-about-inner div:nth-of-type(1) span::after{ display: none; }
    }

@media only screen and (max-width: 600px) {
    body.top .top-about .top-about-inner div:nth-of-type(1) span::before{
    position: absolute;
    left: 50%;
    top: 40px;
    content: "";
    width: 1px;
    height: 40px;
    background-color: rgb(255 255 255 / 30%);
    }
}
body.top .top-about .top-about-inner div:nth-of-type(2){
    width: 60%;
    display: flex;
    flex-direction: column;
}
@media only screen and (max-width: 768px) {
    body.top .top-about .top-about-inner div:nth-of-type(2){ width: 65%; }
    }
    @media only screen and (max-width: 600px) {
        body.top .top-about .top-about-inner div:nth-of-type(2){ display: block; width: 100%; }
    }

body.top .top-about .top-about-inner div:nth-of-type(2) h3{
    font-size: 18px;
    font-weight: normal;
    letter-spacing: 0.2em;
    line-height: 2.4;
    font-family: 'ShipporiMincho-Regular';
    }
    @media only screen and (max-width: 1024px) {
        body.top .top-about .top-about-inner div:nth-of-type(2) h3{ font-size: 16px;}
        }
        @media only screen and (max-width: 600px) {
            body.top .top-about .top-about-inner div:nth-of-type(2) h3{ font-size: 14px;}
            }
@media only screen and (max-width: 600px) {
    body.top .top-about .top-about-inner div:nth-of-type(2) h3 span{ display: block;}
    }
@media only screen and (max-width: 600px) {
    body.top .top-about .top-about-inner div:nth-of-type(2) h3 span:nth-of-type(3){ margin-top: 20px;}
    }

/*-----COLLECTION-----*/

body.top .top-collection .top-collection-box1{
    top: 20%;
    width: 70%;
    height: 28%;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
    border-right: solid 1px #fff;
    border-bottom-right-radius: 60px;
    border-top-right-radius: 60px;
    position:absolute;
    z-index: 5;}
@media only screen and (max-width: 1440px){ body.top .top-collection .top-collection-box1{ /*top: 700px; height: 760px;*/top: 25%; height: 26%; }}
@media only screen and (max-width: 1024px){ body.top .top-collection .top-collection-box1{ /*top: 560px;*/top: 26%; height: 24%; }}
@media only screen and (max-width: 768px){ body.top .top-collection .top-collection-box1{ /*top: 400px;*/top: 26%; height: 26%; }}
@media only screen and (max-width: 600px){ body.top .top-collection .top-collection-box1{
        top: 16.5%;
        height: 340px;
        width: 90%;
        right: 0;
        border-right: 0px;
        border-left: solid 1px #fff;
        border-top-left-radius: 40px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 40px;
        }
    }
body.top .top-collection .top-collection-box2{
    top: 74%;
    right: 0;
    width: 58%;
    height: 700px;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
    border-left: solid 1px #fff;
    border-bottom-left-radius: 60px;
    border-top-left-radius: 60px;
    position:absolute;
    z-index: 5;
    }
@media only screen and (max-width: 1440px){ body.top .top-collection .top-collection-box2{ top:2000px; height: 600px;}}
@media only screen and (max-width: 1024px){ body.top .top-collection .top-collection-box2{ top:1600px; height: 400px;}}
@media only screen and (max-width: 768px){ body.top .top-collection .top-collection-box2{ top: 1160px; height: 280px;}}
@media only screen and (max-width: 600px){ body.top .top-collection .top-collection-box2{
        top: 78%;
        height: 340px;
        width: 90%;
        right: 0;
        border-right: 0px;
        border-left: solid 1px #fff;
        border-top-left-radius: 40px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 40px;
        }
    }
body.top .top-collection .top-collection-box3{ display: none; }
@media only screen and (max-width: 600px){ body.top .top-collection .top-collection-box3{
        display: block;
        top: 47%;
        height: 340px;
        width: 90%;
        right: 0;
        border-right: 0px;
        border-left: solid 1px #fff;
        border-top: solid 1px #fff;
        border-bottom: solid 1px #fff;
        border-top-left-radius: 40px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 40px;
        position:absolute;
        z-index: 5;
        }
    }

body.top .top-collection{ background-color: #E4E2DE; padding: 120px 0 200px 0; text-align: center; position: relative; }
@media only screen and (max-width: 768px){ body.top .top-collection{ padding: 60px 0 80px 0; }}
@media only screen and (max-width: 600px) {
    body.top .top-collection{ padding: 60px 0 40px 0; }
    }
body.top .top-collection-inner{
    width: 1440px; margin: 0 auto;
    position: relative;
    z-index: 100;
    }
    @media only screen and (max-width: 1440px) {
        body.top .top-collection-inner{ width: 80%; }
        }
        @media only screen and (max-width: 600px) {
            body.top .top-collection-inner{ width: 100%; }
            }
body.top .top-collection .top-collection-inner h4{ font-family: 'Playfair Display', serif; color: #62563D; font-size: 40px; font-weight: 400; margin-bottom: 100px;}
    @media only screen and (max-width: 1024px) {
        body.top .top-collection .top-collection-inner h4{ font-size: 30px; }
        }
        @media only screen and (max-width: 768px) {
            body.top .top-collection .top-collection-inner h4{ margin-bottom: 60px; }
            }
            @media only screen and (max-width: 600px) {
                body.top .top-collection .top-collection-inner h4{ font-size: 26px; }
                }

body.top .top-collection .top-collection-inner .top-collection-inner-cont{
    display: flex; justify-content: space-between;
    } 
    @media only screen and (max-width: 600px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-cont{
            /*display:block;*/
            } 
        }
body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(1){
    display: flex; flex-direction: column; width: 100px;
    }
    @media only screen and (max-width: 1440px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(1){ width: 10%;}
        }
        @media only screen and (max-width: 600px) {
            body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(1){ margin-left: 5%; width: 20%; /*display:inline-block; vertical-align: top; width: 20%;*/}
            }
body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(1) img{}
body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(2){
    display: flex; flex-direction: column; width: 530px;
    }
    @media only screen and (max-width: 1440px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(2){ width: 36%;}
        }
        @media only screen and (max-width: 600px) {
            body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(2){ /*display:inline-block; width: 80%;*/ width: 70%; }
            }
body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(2) img{ border-top-left-radius: 60px; }
body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(3){
    display: flex; flex-direction: column; width: 530px;
    }
    @media only screen and (max-width: 1440px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(3){ width: 36%;}
        }
        @media only screen and (max-width: 600px) {
            body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(3){ display: none;}
            }
body.top .top-collection .top-collection-inner .top-collection-inner-cont div:nth-of-type(3) img{ border-bottom-right-radius: 60px;}
body.top .top-collection .top-collection-inner .top-collection-inner-cont-hide{
    display: none;
    }
    @media only screen and (max-width: 600px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-cont-hide{ display: block; width: 70%;}
    }
body.top .top-collection .top-collection-inner .top-collection-inner-cont-hide img{ border-bottom-right-radius: 60px; }

body.top .top-collection .top-collection-inner .top-collection-inner-btn1 {
    padding-left: 15.5%;
    text-align: left;
    margin-top: 30px;
    margin-bottom: 120px;
    }
    @media only screen and (max-width: 1440px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-btn1 { padding-left: 19%; }
        }
        @media only screen and (max-width: 768px) {
            body.top .top-collection .top-collection-inner .top-collection-inner-btn1 { margin-bottom: 60px; }
            }
            @media only screen and (max-width: 600px) {
                body.top .top-collection .top-collection-inner .top-collection-inner-btn1 { padding-left: 30%; margin-bottom: 40px; }
                }

body.top .top-collection .top-collection-inner .top-collection-inner-btn1 a{
    text-decoration: none; color: #62563D; font-family: 'Playfair Display', serif; font-size: 16px;
    }
    @media only screen and (max-width: 1024px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-btn1 a{ font-size: 14px;}
    }
body.top .top-collection .top-collection-inner .top-collection-inner-btn1 a:hover{ color: #afaaa0; }
body.top .top-collection .top-collection-inner .top-collection-inner-btn1 a span{
    display: inline-block; vertical-align: middle; width: 66px; margin-right: 16px;
    }
    @media only screen and (max-width: 1024px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-btn1 a span{ width: 40px; }
        }
body.top .top-collection .top-collection-inner .top-collection-inner-btn1 a:hover span{ transition: all 0.3s ease 0s; width: 74px; }

body.top .top-collection .top-collection-inner .top-collection-inner-btn2 {
    text-align: right;
    margin-top: 30px;
    margin-bottom: 120px;
    }
    @media only screen and (max-width: 768px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-btn2 { margin-bottom: 60px; }
        }
    @media only screen and (max-width: 600px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-btn2 { margin-right: 30%; }
        }
body.top .top-collection .top-collection-inner .top-collection-inner-btn2 a{
    text-decoration: none; color: #62563D; font-family: 'Playfair Display', serif; font-size: 16px;
    }
    @media only screen and (max-width: 1024px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-btn2 a{ font-size: 14px;}
        }
body.top .top-collection .top-collection-inner .top-collection-inner-btn2 a:hover{ color: #afaaa0; }
body.top .top-collection .top-collection-inner .top-collection-inner-btn2 a span{
    display: inline-block; vertical-align: middle; width: 66px; margin-right: 16px;
    }
    @media only screen and (max-width: 1024px) {
        body.top .top-collection .top-collection-inner .top-collection-inner-btn2 a span{ width: 40px; }
        }
body.top .top-collection .top-collection-inner .top-collection-inner-btn2 a:hover span{ transition: all 0.3s ease 0s; width: 74px; }