@charset "utf-8";

/* ===================================================================
css information

File Name  : common.css
Author     :
Style Info :
=================================================================== */

/* ----------------------------------------------------------------------
 ページ全体
---------------------------------------------------------------------- */
.wrap-cont{
    margin-bottom: 120px;
}

/* ----------------------------------------------------------------------
 ページ内リンク
---------------------------------------------------------------------- */
@media screen and (min-width: 1201px){
	html.sale {
	 scroll-padding-top:151px;
	}
}
@media screen and (max-width: 1200px){
	 html.sale {
	 scroll-padding-top:180px;
	}
}

/* ----------------------------------------------------------------------
 スマホのみ改行
---------------------------------------------------------------------- */

@media print, screen and (min-width: 768px) {
    .kaigyouSp{
        display: none;
    }
}

/*--------------------------------------
カテゴリタイトル
--------------------------------------*/
h2.product-item--name{
    line-height: 1.8em;
}
h2.cateTit{
    color:#996f50;
    font-size:25px;
    border-left:5px #996f50 solid;
    padding-left: 10px;
        font-family: 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    font-weight: bold;
    margin-bottom: 50px;
    background: #f6f2f0;
    padding:12px 10px 10px;
}

/*--------------------------------------
カテゴリメニュー
--------------------------------------*/
.cateMenu{
    position: sticky;
    top:84px;
    align-self: flex-start;
    height: fit-content;
    z-index: 99;
    background: #fff;
    padding: 10px 0;
    margin-bottom: 80px;
}
#container-list{
    width: 100%;
    margin: 0 auto;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}
#container-list ul{
    width: 100%;
    display: flex;
    list-style: none;
    flex-wrap: wrap;
    justify-content: space-between;
    text-align: center;
}
#container-list ul li{
    width: calc(100% / 4);
    border-right:1px #fff solid;
    box-sizing: border-box;
}
#container-list ul li a{
    position: relative;
    display: block;
    width: 100%;
    background: #996f50;
    box-sizing: border-box;
    color:#fff;
    text-decoration: none;
    font-size:18px;
    font-weight: 700;
    padding: 10px;
}
#container-list ul li a::before {
    position: absolute;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transition: all 0.5s ease 0s;
    font-size: 80%;
    transition : all 0.5s ease 0s;
}
#container-list ul li a:hover::before {
    right: 15px;
}
@media screen and (min-width:768px)  {
    #container-list ul li:last-child{
        border-right:none;
    }
}
@media screen and (max-width:767px)  {
    body.saleBody{
        overflow:visible !important;
    }
    .cateMenu{
        position: sticky;
        top:60px;
    }
    #container-list ul li{
        width: calc(100% / 2);
    }
    #container-list ul li:nth-child(1),
    #container-list ul li:nth-child(2){
        border-bottom:1px #fff solid;
    }
    #container-list ul li:nth-child(2n){
        border-right:none;
    }
    #container-list ul li a{
        font-size: 14px;
    }
}


/*--------------------------------------
テキスト関連
--------------------------------------*/
/*商品名*/
h2.product-item--name{
    margin-bottom: 0.5em;
}
/*定価打ち消し戦*/
.product-item--info s{
    text-decoration: line-through;
}
/*売値*/
.product-item--price .font-weight-bold{
    font-size:20px !important;
    font-family: 'ヒラギノ角ゴ Pro W5', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    font-weight: bold;
}
.product-item--price .product-item--price-1{
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    font-weight: normal;
    font-size:14px !important;
}
/*差額*/
.salePrice{
    background-color: #ffff00;
    background-size: 200% .8em;
	background-position: 0 .5em;
    display: inline-block;
    font-family: 'ヒラギノ角ゴ Pro W5', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    font-weight: bold;
    margin-bottom: 15px;
}


/*--------------------------------------
予約注文
--------------------------------------*/
/*予約注文ボタン*/
a.reserveBtn{
    display: block;
    width: 180px;
    position: relative;
    border: 1px solid #ef715d;;
    background: #ef715d;;
    padding: 12px 10px 11px;
    font-size: 15px;
    text-align: center;
    color: #fff;
    border-radius: 100px;
    text-decoration: none;
    line-height: 1.3em;
    margin: 10px 0;
}