@charset "utf-8";

/* ==================================================================
	index.css
	
=================================================================== */

/* --------------------------------
   □ 
-------------------------------- */ 


h2{
    text-align: center;
    margin-bottom: 40px;
    font-weight: 400;
    font-size: 16px;
}

h2 span.en-free{
    font-size: 287%;
    display: block;
    
}

/* --------------------------------
   □ スライダー
-------------------------------- */ 

.fs-pt-carousel{
    position: relative;
}

.fs-pt-carousel:after{
    content: "";
    position: absolute;
    background: url("../../images/accent/parts3.png") repeat-x;
    width: 100%;
    height: 34px;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 5px;
    visibility: visible;
}

.fs-pt-carousel:before{
    content: "";
    position: absolute;
    background: url("../../images/accent/parts4.png") repeat-x;
    width: 100%;
    height: 2px;
    left: 0;
    right: 0;
    margin: auto;
    top: 0;
    visibility: visible;
    z-index: 99;
}


.fs-c-slick .slick-dots {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 50px;
    z-index: 2;
}
/* --------------------------------
   □ contents
-------------------------------- */ 
main {
    position: relative;
    z-index: 2;
}

/* ◇ box
-------------------------------- */ 
/* main直下のsection */
main > section.fs-l-pageMain > section {
    padding: 80px 0;
}

main > section.fs-l-pageMain > section:last-child{
    margin-bottom:0px;
}

.aside{
    display: none;
}

.fs-l-sideArea + .fs-l-pageMain, .fs-l-pageMain + .fs-l-sideArea {
    max-width: 1230px;
}

    /* --------------------------------
       □ item
    -------------------------------- */ 


#item h2.title span.block{
    position: relative;
    display: inline-block;
    padding: 0 115px;
}

#item h2.title span.block:before{
    content: "";
    background: url("https://yoship.itembox.design/item/images/index/item_title1.png");
    width: 72px;
    height: 65px;
    position: absolute;
    left: 20px;
    top: 0;
}

#item h2.title span.block:after{
    content: "";
    background: url("https://yoship.itembox.design/item/images/index/item_title2.png");
    width: 74px;
    height: 80px;
    position: absolute;
    right: 20px;
    top: 0;
}

    .fs-c-productListCarousel__list{
        overflow-y: visible;
    }
    #item .slick-slide article{
        position:relative;
    }

    #item .slick-slide article:after{
        content:"";
        position: absolute;
        width: 68px;
        height: 68px;
        left: 0px;
        top: 0px;
        visibility: visible;
    }
    #item .slick-slide[data-slick-index="0"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no1.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="1"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no2.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="2"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no3.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="3"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no4.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="4"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no5.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="5"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no6.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="6"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no7.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="7"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no8.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="8"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no9.png") no-repeat;
    }
    #item .slick-slide[data-slick-index="9"] article::after{
        background: url("https://yoship.itembox.design/item/images/common/icon/no10.png") no-repeat;
    }
    .slick-slide article .fs-c-productListItem__imageContainer img{
        border-radius: 10px;
    }
    @media only screen and
    (max-width : 767px) {
        #item h2.title{
            margin-bottom: 8%;
        }
    }

    .fs-p-messageBoard {
        border: 1px solid #da4b56 !important;
        color: #da4b56 !important;
        margin-bottom: 24px;
        padding: 16px;
        background: none !important;
    }
    .fs-p-messageBoard__heading {
        display: block;
        font-weight: 700;
        margin-bottom: 0 !important; 
        text-align: center;
    }

    .fs-c-productName__copy, .fs-c-productName__variation {
        font-size: 14px !important;
        text-align: left;
        margin-bottom: 4px;
    }

    .fs-c-productName__name {
        font-size: 16px;
        text-align: left;
        margin-bottom: 4px;
        line-height: 1.5;
    }

    .fs-c-productPrice:not(.fs-c-productPrice--listed) .fs-c-productPrice__main__price {
        color: #371804 !important;
    }

    #top_main .fs-c-productListItem__prices {
        margin: 4px auto 0;
    }

    #item{
        padding: 80px 0;
        background:url("../../images/index/item_bg.png");
    }
    #item .fs-c-buttonContainer {
        display: none;
    }

/* --------------------------------
   □ category
-------------------------------- */ 

section#category.wide{
    margin-bottom:calc(80px + 8em);
    padding-bottom:0;
    background: url("../../images/index/category_bg.jpg") no-repeat;
    background-size: 100%;
}

    #category h2{
        color: #fff;
    }

    #category h2 span{
        margin-bottom: 15px;
    }

    #category .categoryArea {
        position:relative;
        margin-bottom:-150px;
        background: #fcfaf7;
        border-radius: 10px;
        padding: 55px 55px 0;
        overflow: hidden;
        
    }

    #category ul.categoryList{
        overflow: hidden;
    }

    #category ul.categoryList li{
        width: 25%;
        float: left;
        margin-bottom: 35px;
    }

    #category ul.categoryList li:nth-child(4n){
        margin-right: 0;
    }

    #category ul.categoryList li a{
        display: flex;
        align-items: center;
        margin-left: 10px;
    }

    #category ul.categoryList li a:hover{
        text-decoration: none;
    }

    #category ul.categoryList li a span{
        background: url("../../images/common/icon/arrow/arrow.png") 85% 50% no-repeat;
        margin-left: 10px;
        padding-right: 50px;
        transition: 0.3s;
    }


    #category ul.categoryList li a:hover span{
        background: url("../../images/common/icon/arrow/arrow.png") 100% 50% no-repeat;
    }







/* --------------------------------
   □ scene
-------------------------------- */ 

#scene{
    background: #f5f4f1;
}

#scene .scenearea{
    position: relative;
}

#scene .scenearea:before{
    content: "";
    position: absolute;
    background: url("../../images/index/scene_parts1.png");
    width: 401px;
    height: 271px;
    left: 45px;
    top: -160px;
}

#scene ul.sceneList{
    overflow: hidden;
    position: relative;
}

#scene ul.sceneList li{
    width: 283px;
    margin-right: 32px;
    float: left;
}

#scene ul.sceneList li a{
    text-decoration: none;
}

#scene ul.sceneList li:last-child{
    margin-right: 0;
}

#scene ul.sceneList li dl dt{
    position: relative;
    font-size: 112.5%;
    font-weight: 700;
    margin-bottom: 10px;
    display: inline-block;
    padding-right: 30px;
}

#scene ul.sceneList li dl dt:after{
    content: "";
    background: url("../../images/common/icon/arrow/arrow.png");
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    transition: 0.3s;
}

#scene ul.sceneList li a:hover dl dt:after{
    right: -20px;
}

#scene ul.sceneList li dl dd{
    font-size: 87.5%;
}

/* --------------------------------
   □ News
-------------------------------- */ 

#news{
    background: #fcfaf7;
}

#news .container{
    position: relative;
}

#news h2.title{
    width: 18%;
    float: left;
    text-align: left;
    margin-bottom: 0;
}

.fs-pt-list {
    width: 80%;
    float: right;
    margin-top: 15px;
}

.fs-p-dateList > li {
  border: none!important;
  padding: 8px 0 0;
  font-size: 87.5%;
}

.fs-p-dateList > li:last-child {
  border-bottom-width: 1px;
  padding-bottom: 8px;
}

.fs-p-dateList > li time:first-child {
  background: none!important;
  color: #371804!important;
}

#news p.more{
    position: absolute;
    top: 100px;
}

#news p.more a{
    padding-right: 30px;
    background: url("../../images/common/icon/arrow/arrow.png") 90% 50% no-repeat;
    transition: 0.3s;
}

#news p.more a:hover{
    background: url("../../images/common/icon/arrow/arrow.png") 100% 50% no-repeat;
}

#news time{padding-right:1em;}

/* --------------------------------
   □ ウェルカムメッセージ
-------------------------------- */ 
.fs-pt-carousel__track:after{
    content: "";
    background: url(../../images/accent/parts1.png);
    width: 218px;
    height: 271px;
    left: 30px;
    bottom: -98px;
    position: absolute;
    z-index: 2;
}

.fs-l-header__welcomeMsg{
    padding:1em;
    color:#fff;
    background:#bd9a77;
    content: "";
    left: 280px;
    top: 28px;
    margin-top:-80px;
    position: relative;
    z-index: 2;
    border-radius:4px;
}
.fs-l-header__welcomeMsg.is-ready{
    display: inline-block;
}
.fs-l-header__welcomeMsg::after{
    border: solid transparent;
    content:'';
    height:0;
    width:0;
    pointer-events:none;
    position:absolute;
    border-color: rgba(0, 153, 255, 0);
    border: top width 10px;
    border-bottom-width:14px;
    border-left-width:20px;
    border-right-width:20px;
    margin-top: -14px;
    border-left-width:20px;
    border-right-color:#bd9a77;
    right:100%;
    top:53%;
}

@media only screen and
(max-width : 767px) {
    .fs-pt-carousel__track:after{
        background-size: cover;
        width: 90px;
        height: 113px;
        left: 10px;
        bottom: -91px;
    }
    .fs-l-header__welcomeMsg{
        padding:1em;
        color:#fff;
        background:#bd9a77;
        content: "";
        left: auto;
        top: 41px;
        margin-top:-80px;
        position: relative;
        z-index: 2;
        border-radius:4px;
        right: -128px;
        font-size: 87.5%;
    }
}



/* --------------------------------
   guide
-------------------------------- */

#guide a.arrow{
    display:inline-block;
    padding-right:1.5em;
    color:#5f361b;
    background:url(../../images/common/icon/arrow/arrow.png) no-repeat center right;
}

#guide .division:not(:last-child){
    margin-bottom:4em;
}
#guide .division h2{
    margin-bottom:1em;
    font-size:2.4rem;
    font-weight:bold;
    text-align:left;
}


#guide.fs-c-documentArticle{
    margin:0 auto;
    width:1018px;
    max-width:100%;
}

#guide.fs-c-documentArticle .guide-navigation li{
    border-bottom:1px solid #5f361b;
}
#guide.fs-c-documentArticle .guide-navigation li:first-child{
    border-top:1px solid #5f361b;
}
#guide.fs-c-documentArticle li.order{ background:url(../../images/guide/icon/order.png) no-repeat 0.5em 50%; }
#guide.fs-c-documentArticle li.pay{ background:url(../../images/guide/icon/pay.png) no-repeat 0.5em 50%; }
#guide.fs-c-documentArticle li.delivery{ background:url(../../images/guide/icon/delivery.png) no-repeat 0.5em 50%; }
#guide.fs-c-documentArticle li.postage{ background:url(../../images/guide/icon/postage.png) no-repeat 0.5em 50%; }
#guide.fs-c-documentArticle li.return{ background:url(../../images/guide/icon/return.png) no-repeat 0.5em 50%; }
#guide.fs-c-documentArticle li.entry{ background:url(../../images/guide/icon/entry.png) no-repeat 0.5em 50%; }
#guide.fs-c-documentArticle li.subsc{ background:url(../../images/guide/icon/subsc.png) no-repeat 0.5em 50%; }
#guide.fs-c-documentArticle li.faq{ background:url(../../images/guide/icon/faq.png) no-repeat 0.5em 50%; }


#guide.fs-c-documentArticle .guide-navigation li a{
    display:block;
    padding:2em 4em;
    color:#5f361b;
    text-decoration:none;
    background:url(../../images/common/icon/arrow/arrow.png) no-repeat 98% 50%;
}
#guide.fs-c-documentArticle .guide-navigation li a:hover{
    transition: .2s;
    background-position:99% 50%;
}


#guide ul.list{
    margin-bottom:1em;
    padding-left:1.5em;
    list-style-type:disc;
}


/* order ***/
.order .division h2{
    padding-bottom:0.5em;
    font-size:2.8rem;
    background:url(../../images/common/border/rough.png) no-repeat bottom left;
}

.order .division section h3{
    margin-bottom:1em;
    font-size:2rem;
    text-align:left;
}

.order .division section{margin-bottom:2em;}

.order .flow{ margin-bottom:2em;}
.order .flow li{
    position:relative;
    padding:3% 5%;
    border:1px dotted #5f361b;
    background:#fff;
    box-sizing:border-box;
    border-radius:1em;
    text-align:left;
}
.order .flow li:not(:last-child){
    margin-bottom:4em;
}
.order .flow li:not(:last-child)::before,
.order .flow li:not(:last-child)::after{
    position:absolute;
    display:block;
    content:"";
    width:2em;
    border-top:2px solid #5f361b;
}
.order .flow li:not(:last-child)::before{
    bottom:-1.8em;
    left:calc(50% - 0.82em);
    transform:rotate(30deg)
}
.order .flow li:not(:last-child)::after{
    bottom:-1.8em;
    left:calc(50% + 0.82em);
    transform:rotate(-30deg)
}


.order .flow li dt{
    font-weight:bold;
    font-size:130%;
}
.order .flow li dt::before{
    display:inline-block;
    margin-right:0.5em;
    padding:0.1em 1.2em;
    background:#f3eeea;
    border-radius:1em;
}
.order .flow li:nth-child(1) dt::before{content:"STEP1";}
.order .flow li:nth-child(2) dt::before{content:"STEP2";}
.order .flow li:nth-child(3) dt::before{content:"STEP3";}
.order .flow li:nth-child(4) dt::before{content:"STEP4";}
.order .flow li:nth-child(5) dt::before{content:"STEP5";}
.order .flow li:nth-child(6) dt::before{content:"STEP6";}
.order .flow li:nth-child(7) dt::before{content:"STEP7";}
.order .flow li:nth-child(8) dt::before{content:"STEP8";}

.order .flow li dd{
    margin-top:1em;
}


/* pay ***/
.pay .division h2{
    padding-bottom:0.5em;
    font-size:2.8rem;
    background:url(../../images/common/border/rough.png) no-repeat bottom left;
}

.pay .division section h3{
    margin-bottom:1em;
    font-size:2rem;
}

.pay .division section{margin-bottom:2em;}

.pay p.overview{margin-bottom:2em;}

.pay .card{display:inline-block;padding:0.5em 1em;background:#fff;border-radius:10px;}

/* postage ***/
.fs-c-postage__list--prefecture dt{
    background:#5f361b;
    color:#fff;
    text-align:center;
}
.fs-c-postage__list--prefecture dd{
    text-align:right;
}


.postage table{margin-bottom:1em;width:100%;}
.postage th,.postage td{
    padding:1.5em;
}

th.fs-c-specTable__headerCell,
.postage thead th{
    background:#5f361b;
    color:#fff;
    text-align:center;
}
.postage table thead th:not(:first-child){
    border-left:1px solid #e5e5e5;
}

.postage tbody tr{
    border-bottom:1px solid #e5e5e5;
}

.postage tbody td{
    width:30%;
    text-align:center;
    border-left:1px solid #e5e5e5;
}

.postage tbody th dd + dt{
    margin-top:1em;
}
.postage tbody th dd{
    margin: top 0.3em;
    font-size:92%;
    font-weight:initial;
}

.postage table + p{font-size:84%;}


/* faq ***/
.faq details{
    padding:1.5em;
    border-top:1px solid #5f361b;
    border-bottom:1px solid #5f361b;
}
.faq details + details{
    border-top:0;
}

.faq summary {
    position:relative;
    cursor: pointer;
    padding-left:3em;
    padding-right:2em;
    box-sizing:border-box;
}
.faq details summary::before {
    content:"Q";
    font-size:2.2em;
    position:absolute;
    top:-0.5em;
    left:0px;
}
.faq summary::after {
    content: '';
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px #5f361b;
    border-right: solid 2px #5f361b;
    transition: all .2s;
    transform: rotate(135deg);
    position: absolute;
    top: calc(50% - 3px);
    right:1%;
}
.faq details[open] summary::after {
    transform: rotate(315deg);
}

.faq .answer {
    position:relative;
    padding-top:2em;
    padding-left:3em;
    transition: all .2s;
    box-sizing:border-box;
}
.faq .answer::before {
    content:"A";
    display:block;
    font-size:2.2em;
    position:absolute;
    top:0.5em;
    left:0.12em;
}

details[open] .answer {
	animation: fadein 0.5s ease;
}

@keyframes fadein {
	0% { opacity: 0; }
	100% { opacity: 1; }
}


/* ぴぃきち堂について *****/

article#about h2{
    padding-bottom:0.5em;
    font-size:2.2rem;
    text-align:left;
    background:url(../../images/common/border/rough.png) repeat-x bottom left;
}

article#about #greeting{
    margin-bottom:6em;
    margin-left:auto;
    margin-right:auto;
    width:872px;
    font-size:108%;
}

article#about #greeting p{
    text-align:center;
    line-height:2;
    margin-bottom:2em;
    font-weight:bold;
}
article#about #greeting p.logo{margin-bottom:5em;}
article#about #greeting p.image{margin-top:5em;}

article#about #char .inner{
    margin-bottom:4em;
    display:flex;
    justify-content:space-between;
    padding-bottom:4em;
    overflow: hidden;
    background: url("../../images/common/footer/border.png") bottom left no-repeat;
}
article#about #char .inner dl{
    width:48%;
}
article#about #char .inner dt{text-align:center;margin-bottom:2em;}
article#about #char .inner dd em{
    display:block;
    text-align:center;
    font-size:140%;
    margin-bottom:0.8em;
}
article#about #char .inner dd{
    font-size:114%;

}

article#about .link{

}
article#about .link ul{
    display:flex;
    justify-content:space-between;
}
article#about .link ul li{
    width:48%;
}

article#about .link ul li a{
    position:relative;
    background:#5f361b;
    color:#fff;
    display:block;
    text-align:center;
    padding:2em;
    border-radius:6px;
    transition: .3s ease;
}
article#about .link ul li a[target="_blank"]::after{
    content:"";
    position:absolute;
    display:block;
    width:0.8em;
    height:0.8em;
    top:calc(50% - 0.4em);
    left:95%;
    background:url(../../images/common/icon/blank.svg) no-repeat top left;
    background-size:contain;
}

article#about .link ul li a:hover{
    text-decoration:none;
    background:#8d8179;
}




/* 商品画像 ****/
#fs_ProductDetails .fs-c-productCarouselMainImage .fs-c-slick.slick-slider{
    height:400px;
    overflow:hidden;
}
#fs_ProductDetails .fs-c-productCarouselMainImage .slick-list.draggable{
    width:400px;overflow:hidden;margin-left:50px;
}
#fs_ProductDetails .fs-c-productCarouselMainImage__thumbnailList{overflow:hidden;margin-top:2em;}
#fs_ProductDetails .fs-c-productCarouselMainImage__thumbnailList > li{
    border-radius:8px;
    overflow:hidden;
    box-sizing:border-box;
    overflow:hidden;
}
#fs_ProductDetails .fs-c-productCarouselMainImage__thumbnailList > li:hover{
    opacity: 0.8;
    cursor: pointer;
}

#fs_ProductDetails .fs-c-productCarouselMainImage__image{
    height:400px;
}

#fs_ProductDetails .fs-c-productCarouselMainImage__image img{
    height:100%;
}


#fs_ProductDetails .fs-c-productCarouselMainImage__thumbnail__img{
    border-radius:8px;
}

/* 拡大ボタン ****/
.fs-c-productCarouselMainImage__expandButton{display:none;}


/* 左右ボタン **/
.fs-c-slick .slick-prev, .fs-c-slick .slick-next{
height:auto;
width:auto;
background:none;
}

.fs-c-slick .slick-prev{
    left:0;
}
.fs-c-slick .slick-next{
    right:0;
}

.fs-c-productCarouselMainImage__thumbnailList{
box-sizing:border-box;

}
.fs-c-productCarouselMainImage__thumbnailList > li {
    width:90px;
    flex-basis: 90px;
    margin:0;
}
.fs-c-productCarouselMainImage__thumbnailList > li:not(:first-child){
    margin-left:11px;
}
.fs-c-productCarouselMainImage__thumbnailList > li > figure{
    width:100%;
    box-sizing:border-box;
}
.fs-c-productCarouselMainImage__thumbnailList > li > figure > img{
    box-sizing:border-box;
}



.fs-c-slick .slick-prev:before, .fs-c-slick .slick-next:before{
    font-size:6rem;
    color:#5f361b;
    opacity: 1;
}

@media only screen and
(max-width : 767px) {
    .fs-c-slick .slick-prev:before, .fs-c-slick .slick-next:before{
        font-size:5rem;
    }
}

/* 商品名 ****/
h1.fs-c-productNameHeading.fs-c-heading{
    margin-bottom:1em;
    color:#5f361b;
}
h1.fs-c-productNameHeading.fs-c-heading .fs-c-productNameHeading__copy{display:block;text-align:left;margin-bottom:1em;font-weight:100;}

h1.fs-c-productNameHeading.fs-c-heading .fs-c-productNameHeading__name{
    font-size:2.8rem;
}

/* 商品番号 ****/
.fs-c-productNumber{
    margin-bottom:1em;
	margin-left:-0.6em;
    font-size:80%;
}

.fs-c-productPrices{
    margin-bottom:0;
}

fs-c-productPrice__main__price{font-size:24px;}
.fs-c-productPrice__main__price span,
.fs-c-productPrice__addon{
    color:#371804;
}

/* 商品概要 *****/
.fs-p-productDescription{
    padding-bottom:2em;
    border-bottom:1px solid #e5e5e5;
    margin-bottom: 2em;
}
.fs-c-productQuantityAndWishlist{
    display:flex;
    align-items:center;
    margin-bottom:1em;
}

/* 数量 ****/
.fs-c-productQuantityAndWishlist__quantity{
    display:block;
    grid-column:unset;
    zoom:1;
    max-width:none;
    display:flex;
    /*width:120px;*/
    align-items:center;
    margin-right:1em;
}
.fs-c-productQuantityAndWishlist__quantity em{
    display:block;
    width:4em;
    font-size:14px;
}
.fs-c-quantity select[name="quantity"]{
    display:block;
    position:relative;
    width:70px;
    padding:5px 11px;
    appearance: menulist;
}


/* お気に入り登録 ****/
.fs-c-productQuantityAndWishlist__wishlist{order:2;}
.fs-c-button--particular.fs-c-button--addToWishList--detail{padding:10px 11px;font-size:15px;border-radius:4px;}
.fs-c-button--particular {
    background: #fcfaf7;
    box-shadow: 0 0 0px #b2b2b2;
}
.fs-c-button--particular.fs-c-button--addToWishList--detail::before {
    font-family: 'fs-icon' !important;
    font-size:1.6rem;
    content: "\e919";
    margin-right:0.2em;
}
.fs-c-button--particular.fs-c-button--addToWishList--detail::after{display:none;}


/* カートに入れる　****/
.fs-c-productActionButton .fs-c-button--addToCart--detail.fs-c-button--primary {
    background:#bb272d;
    border:0;
    padding:1.5em;
    width:100%;
    border-radius:4px;
    margin-bottom:2em;
}

.fs-c-productActionButton .fs-c-button__label{
    background:#bb272d;
    position:relative;
    font-size:18px;
}

.fs-c-productActionButton .fs-c-button__label::before{
    font-family: 'fs-icon' !important;
    content: "\e91e";
    font-size:2.2rem;
    margin-right:0.8rem;
    position:relative;
    top:0.25rem;
}


.fs-c-returnedSpecialContract a,
.fs-c-inquiryAboutProduct{
    font-size:14px;
    color:#5f361b;
}

/* sns シェアボタン ******/
.fs-p-snsArea{
    margin-top:2em;
    display:flex;
    padding:1em 2em;
    border:1px dashed #5f361b;
    border-radius:8px;
    align-items:center;
}
.fs-p-snsArea p{margin:0;font-weight:bold;margin-right:auto;}

.fs-p-snsArea a img{border-radius:4px;}

.fs-p-snsArea a{margin-left:20px;}


/* おすすめ商品 */
#fs_ProductDetails .fs-c-featuredProduct {
    margin-top: 60px;
}
#fs_ProductDetails .fs-c-featuredProduct .fs-c-buttonContainer {
    display: none;
}

/* 返品交換について ***/
.fs-p-card{
    display:none;
}

.fs-c-returnedSpecialContract__link a,
.fs-c-inquiryAboutProduct button span{
    background: url("../../images/common/icon/arrow/arrow.png") 85% 50% no-repeat;
    padding-right: 60px;
    transition: 0.3s;
    background-size:contain;
    color:#5f361b;
}
.fs-c-returnedSpecialContract__link a:hover,
.fs-c-inquiryAboutProduct button span:hover{
    background-position:90% 50%;
}



/* 商品概要 ***/
#outline.division{
    margin:4em 0;
    padding: 38px 0 0 0;
    overflow: hidden;
    background: url("../../images/common/footer/border.png") top left no-repeat;
}

#outline.division table{
    width:100%;
}
#outline.division table tr{
    border-bottom:1px solid #e5e5e5;
}
#outline.division table th,
#outline.division table td{
    padding:1.0em 0;
}
#outline.division table th{
    width:30%;
}

#outline.division table h5{
    margin-bottom:0.5em;
}
#outline.division table ul{
    margin-left:1em;
}
#outline.division table ul:not(:last-child){
    margin-bottom:1.5em;
}

.fs-c-buttonContainer{padding:0;}


/* ==================================================================================
    smartphone
===================================================================================*/
@media only screen and
(max-width : 767px) {

/* --------------------------------
   □ 
-------------------------------- */ 

.fs-l-sideArea + .fs-l-pageMain, .fs-l-pageMain + .fs-l-sideArea {
    max-width: 100vw;
    width:100vw;
    overflow:hidden;
}

main > section.fs-l-pageMain > section {
    padding: 60px 0;
    box-sizing:border-box;
}



/*------------------------------------------
　common
------------------------------------------*/
header{
    box-sizing:border-box;
}

/* パンくず ***/
.fs-c-breadcrumb ol{
    width:100%;
}


/* wrap ****/
.fs-system-product .wrap{
    display:flex;
    width:100%;
    margin:0 auto;
    justify-content:space-between;
    flex-direction:column;
}


#fs_ProductDetails .fs-c-productCarouselMainImage{width:100%;margin-bottom:2em;}
#fs_ProductDetails .item-summary{width:100%;text-align:left;}


/* 商品画像 ****/
#fs_ProductDetails .fs-c-productCarouselMainImage .fs-c-slick.slick-slider{
    height:calc(100vw - 75px);
    overflow:hidden;
}
#fs_ProductDetails .fs-c-productCarouselMainImage .slick-list.draggable{width:calc(100vw - 75px);overflow:hidden;margin-left:28px;}

#fs_ProductDetails .fs-c-productCarouselMainImage .fs-c-slick.slick-slider img{ width:auto;height:calc(100vw - 75px);}

#outline.division table th,
#outline.division table td{
    display:block;
    width:100%;
    box-sizing:border-box;
}
#outline.division table th{padding-bottom:0.5em;}
#outline.division table td{padding-top:0;}



#fs_ProductDetails .fs-c-productCarouselMainImage__thumbnailList{
    justify-content:space-between;
}
#fs_ProductDetails .fs-c-productCarouselMainImage__thumbnailList > li{
    width:18vw;
    flex-basis:auto;
}
#fs_ProductDetails .fs-c-productCarouselMainImage__thumbnailList > li:not(:first-child){
    margin:0;
}




/* 商品画像 ****/
.fs-c-productCarouselMainImage__carousel{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
}
.fs-c-productCarouselMainImage__carousel figure{

}


/* sns シェアボタン ******/
.fs-p-snsArea{
    display:flex;
    padding:0.8em;
    border:1px dashed #5f361b;
    border-radius:8px;
    align-items:center;
    justify-content:space-between;
}
.fs-p-snsArea p{margin:0;font-weight:bold;margin-right:auto;width:100%;margin-bottom:1em;}

.fs-p-snsArea a img{border-radius:4px;}

.fs-p-snsArea a{margin-left:0px;width:30%;}





/* faq ***/
.faq details{
    padding:1em 0.5em;
}

.faq summary {
    padding-left:2.5em;
    padding-right:1.6em;
}
.faq details summary::before {
    font-size:2em;
    top:-0.4em;
}

.faq .answer {
    position:relative;
    padding-top:1.8em;
    padding-left:2.5em;
}
.faq .answer::before {
    font-size:2em;
}






    /* ぴぃきち堂について *****/
    article#about.fs-c-documentArticle{padding:0;}
    article#about #greeting{
        margin-bottom:6em;
        width:100%;
        font-size:104%;
    }
    article#about #greeting p.logo img{
        width:80%;
    }
    article#about #greeting p span{
        display:inline-block;
    }


    article#about #char .inner{
        margin-bottom:3em;
        display:flex;
        flex-direction:column;
        justify-content:space-between;
        padding-bottom:3em;
    }
    article#about #char .inner dl{
        width:100%;
    }

    article#about #char .inner dl dt img{
        width:60%;
    }

    article#about #char .inner dl:not(:last-child){
        margin-bottom:3em;
    }
    article#about #char .inner dt{text-align:center;margin-bottom:2em;}
    article#about #char .inner dd em{
        display:block;
        text-align:center;
        font-size:120%;
        margin-bottom:0.8em;
    }
    article#about #char .inner dd{
        font-size:100%;

    }

    article#about .link{

    }
    article#about .link ul{
        display:flex;
        flex-direction:column;
        justify-content:space-between;
    }
    article#about .link ul li{
        width:100%;
        box-sizing:border-box;
    }
    article#about .link ul li:not(:last-child){
        margin-bottom:1em;
    }

    article#about .link ul li a[target="_blank"]::after{
        left:92%;
    }



    
/* ----------------------------------
 index
 -----------------------------------*/
 #fs_Top main > section{
    margin:0;
}

#fs_Top main > section h2.title {
    font-size:16px;
}
h2 span.en-free {
    font-size: 220%;
    display: block;
}


/* main visual ***************************/
/*
.fs-pt-carousel__slide img{
    width:auto;
}

.fs-pt-carousel__slide img.pc{display:none;border:1px solid red;}

.fs-pt-carousel:after {
    height: 34px;
    bottom: -2px;
}

.fs-c-slick .slick-prev::before,
.fs-c-slick .slick-next::before{display:none;}

.fs-pt-carousel__track .slick-track{
    height:330px;
 }
*/
/*
 .fs-c-slick .slick-dots li{
    width:16px;
    height:16px;
    font-size:16px;
 }
 .fs-c-slick .slick-dots li button{
    width:100%;
    height:100%;
 }
 .fs-c-slick .slick-dots li button:before{
    font-size:16px;
 }
 .fs-c-slick .slick-dots li.slick-active button:before{
    color:#371804;
    opacity:1;
 }
*/
 .fs-pt-carousel:after {
    display: none;
}


/* message board *********/
.fs-p-messageBoard{font-size:90%;}




/*  カルーセル ******/
.fs-pt-column{
   
}

.fs-pt-column__item{

}



 /*  □ item
-------------------------------- */
#item {
    padding:40px 0;
    box-sizing:border-box;
    overflow:hidden;
}
#item .container{
    margin:0 auto;
    width:98.5%
    box-sizing:border-box;
}


#item h2{
    margin-bottom:20px;
}


#item h2.title span.block {
    position: relative;
    display: inline-block;
    padding: 0 50px;
}
#item h2.title span.block:before {
    background-size:contain;
    background-repeat:no-repeat;
    width: 36px;
    height: 32px;
    position: absolute;
    left: 10px;
    bottom:0;
}
#item h2.title span.block:after {
    background-size:contain;
    background-repeat:no-repeat;
    width: 37px;
    height: 40px;
    right: 10px;
    top: 0;
}

#item .fs-c-productPrices {
    margin-bottom: 0;
    color:#5f361b;
}
#item .fs-c-productPrice__main__price span,
#item .fs-c-productPrice__addon{
    color:#5f361b;
}


#item .fs-c-productListItem__productName{
    margin:10px 0 6px 0;
    text-align:left;
}


#item .fs-c-productListCarousel__list__item{
    flex-basis: 160px;
    max-width: 160px;
    min-width: 138px;
    margin: 0 13px;
}
#item .fs-c-productListItem__imageContainer{
    border-radius:6px;
    overflow:hidden;
}

#item .fs-c-productListCarousel__ctrl{
    position:relative;
    top:-30px;
    flex-basis:20px;
    min-width:20px;
}

#item .fs-c-productName__copy,
#item .fs-c-productListItem__control{display:none;}



 /*  □ category
-------------------------------- */
section#category.wide {
    margin-bottom:150px;
    background: url(https://yoship.itembox.design/item/images/index/category_bg_sp.jpg) no-repeat;
}

#category .categoryArea {
    position: relative;
    padding: 20px 16px;
}

#category ul.categoryList {
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
}
#category ul.categoryList li{
    width:49.8%;
    font-size:78%;
}


#category ul.categoryList li a {
    display: flex;
    align-items: center;
    margin-left: 0;
}

#category ul.categoryList li a img{
    width:52px;
}
#category ul.categoryList li a span{
    background: url(../../images/common/icon/arrow/arrow.png) 100% 50% no-repeat;
    margin-left: 6px;
    padding-right: 18px;
    transition: 0.3s;
    background-size:14px 14px;
}



 /*  □ scene
-------------------------------- */
#scene {
    padding:40px 0;
    width:100vw;
    position:relative;
    box-sizing:border-box;
}
#scene .container{
    box-sizing:border-box;
}

#scene .scenearea{
    position: relative;
}

#scene .scenearea:before{
    content: "";
    display:none;
}


#scene ul.sceneList{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
}
#scene ul.sceneList li{
    width:47%;
    margin:0;
    margin-bottom:2em;
}

 /*  □ news
-------------------------------- */

#news h2.title {
    width: 100%;
    float: none;
    text-align: center;
    margin-bottom:20px;
}

#news .fs-pt-list {
    width: 100%;
    float: none;
    margin-top: 0px;
}
#news .fs-pt-list li time{
    display:block;
}


}

/*商品画像サイズの調整　PC*/
#fs_ProductDetails .fs-c-productCarouselMainImage__image {
    height: 500px;
}
#fs_ProductDetails .fs-c-productCarouselMainImage .slick-list.draggable {
    margin-left: 0;
    width: 500px;
}
#fs_ProductDetails .fs-c-productCarouselMainImage .fs-c-slick.slick-slider {
    height: 500px;
}
 
/*商品画像サイズの調整　SP*/
@media screen and (max-width: 767px) {
  #fs_ProductDetails .fs-c-productCarouselMainImage__image {
    height: auto;
  }
    #fs_ProductDetails .fs-c-productCarouselMainImage .fs-c-slick.slick-slider img{
        height:100vw;
    }
    #fs_ProductDetails .fs-c-productCarouselMainImage .slick-list.draggable {
        margin-left: 0;
        width: auto;
    }
    #fs_ProductDetails .fs-c-productCarouselMainImage .fs-c-slick.slick-slider {
        height:auto;
    }
}