@charset "Shift_JIS";

/* :root {
    --contents-padding-left: 400px;
}
@media screen and (max-width: 1700px) {
    :root {
        --contents-padding-left: 23vw;
    }
}
@media screen and (max-width: 1500px) {
    :root {
        --contents-padding-left: 425px;
    }
} */


/*==============================================
 共通 ここから
================================================*/
/* パンくず削除 */
#pankuzu {
    display: none;
}
body {
    background: #f5f5f5;
}
#seikatsu_ouen2024 img {
  width: 100%;
}
#seikatsu_ouen2024 a {
    display: block;
}
#seikatsu_ouen2024 a:hover {
    opacity: .75;
}
#seikatsu_ouen2024 a:hover p{
    color: #222;
}
#seikatsu_ouen2024 a.link-none:hover {
    opacity: 1;
    color: #222 !important;
}
article#contents {
    padding-bottom: 0 !important;
}
footer .bottom {
    margin-top: 0 !important;
}

/* 税込 */
.buy_price>ul .price.sale+.intax,.buy_price>ul .intax {
    display: none !important;
}
.spesicalprice {
    display: none !important;
}
#seikatsu_ouen2024 .buy_price>ol, .buy_price>ul {
    margin: 0;
}
span.marker {
    background: linear-gradient(transparent 60%, #ffe4d2 40%);
    font-weight: bold;
    color: #ff3500;
    line-height: 1;
    font-size: 1.1em;
    white-space: nowrap;
}
/* デフォルトの見出し */
#seikatsu_ouen2024 .default-title {
    /* width: 100%; */
    text-align: center;
    /* margin-bottom: 2%; */
        padding: 3%;
        margin: 0 auto;
}
#seikatsu_ouen2024 .default-title h3 {
    font-size: 2em;
    line-height: 1.3;
    color: #FFF;
}
#seikatsu_ouen2024 .default-title p {
    font-size: .9em ;
    color: #FFF;
}
/*==============================================
 共通 ここまで
================================================*/
#seikatsu_ouen2024{
    position: relative;
    background-color: #ffe2c5;
    width: 100%;
}
#seikatsu_ouen2024 .contents {
    box-sizing: border-box;
    position: relative;
    background: #951812;
}

#seikatsu_ouen2024 .section-title {
    position: relative;
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center;
}
#seikatsu_ouen2024 .section-title h2{
    width: 100%;
    padding: 2% 0;
}
/* 横幅最大 */
footer .footer-inner, header .header, header .information, main, main#wrapper, nav .category_nav {
    max-width: none;
    padding: 0;
}
/* footer右寄せ */
footer .footer-inner {
    box-sizing: border-box;
    padding-top: 5%;
}
/* section共通 */
#seikatsu_ouen2024 section {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 0;
    box-sizing: border-box;
    /* padding: 2% 0;
    margin-top: -10%;
    padding-top: 13%; */
}
/* カテゴリ用ボタン */
#seikatsu_ouen2024 .btn{
    width: 100%;
    display: flex;
    justify-content: center;
}
#seikatsu_ouen2024 .btn a {
    background-color: #222;
    color: #FFF;
    padding: .5em 3em;
    border-radius: 100vw;
    position: relative;
    font-size: 1.5em;
}
#seikatsu_ouen2024 .btn a:hover {
    color: #FFF !important;
}
#seikatsu_ouen2024 .btn a::after {
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    content: "";
    width: .3em;
    height: .3em;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    top: 0;
    bottom: 0;
    right: 6%;
    margin: auto;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: all 0.3s ease 0s;
}
/* バナー */
#seikatsu_ouen2024 .banner {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}
#seikatsu_ouen2024 .banner p {
    text-align: center;
    font-size: 1.8em;
    font-weight: bold;
    color: #FFF;
}
#seikatsu_ouen2024 .banner a{
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
}
/*==============================================
看板 ここから
================================================*/
#seikatsu_ouen2024 h1 {
    width: 100%;
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
}
#seikatsu_ouen2024 h1 .title {
}
/*==============================================
看板 ここまで
================================================*/
/*==============================================
アンカー ここから
================================================*/
#seikatsu_ouen2024 section.anchor {
    z-index: 5;
    padding: .5% 0% .5%;
    overflow: hidden;
    background: #951812;
}
#seikatsu_ouen2024 .anchor-h2 {
    text-align: center;
    color: #FFF;
    font-size: 1.3rem;
    margin-bottom: 1%;
}
#seikatsu_ouen2024 .anchor-link {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin: 0 auto 1%;
    max-width: 800px; 
}
#seikatsu_ouen2024 .anchor-link li {
    width: calc(100% / 3 - 2%);
    position: relative;
}
#seikatsu_ouen2024 .anchor-link li img{
    border-radius: 5px;
    overflow: hidden;
}
#seikatsu_ouen2024 .anchor-link li p{
    position: absolute;
    bottom: 1%;
    left: 50%;
    transform: translateX(-50%);
    color: #951812;
    text-align: center;
    font-size: 1em;
    font-weight: 600;
    white-space: nowrap;
}

/*==============================================
アンカー ここまで
================================================*/



/*==============================================
商品ラインアップ ここから
================================================*/

/* 見出し */
#seikatsu_ouen2024 section .item-h2 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4%;
}
#seikatsu_ouen2024 section .item-h2 h2 {
    font-size: 2.0rem;
    color: #fffe94;
    text-align: center;
    display: inline-block;
    position: relative;
}
#seikatsu_ouen2024 section .item-h2__icon {
    width: 10%;
}
#seikatsu_ouen2024 section .item-h2__icon.width {
    width: 15%;
}


#seikatsu_ouen2024 section#outlet-item,
#seikatsu_ouen2024 section#winter-item {
    max-width: none;
    margin-bottom: 0;
}
#seikatsu_ouen2024 section#household-item {
    max-width: none;
    margin-bottom: 0;
}
#seikatsu_ouen2024 section .item-h2 {
    margin-bottom: 1.5%;
    max-width: 800px;
    margin: 0 auto;
    padding: 2%;
}
#seikatsu_ouen2024 .item-list {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#seikatsu_ouen2024 #medama .item-list {
    /* margin: 0 auto 15%; */
        margin: 0 auto;

}

#seikatsu_ouen2024 .item-list .item {
    width: 100%;
    box-sizing: border-box;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 4%;
    background: #FFF;
    padding: 0% 0;
}
#seikatsu_ouen2024 .item a{
    display: flex;
}
#seikatsu_ouen2024 .item-list .item-img {
    width: 55%;
    position: relative;
}
#seikatsu_ouen2024 .item-list .item-back {
    width: 45%;
    box-sizing: border-box;
    padding-right: 1%;
    /* background-color: #fff; */
    display: flex;
    flex-direction: column;
    justify-content: center;
}
#seikatsu_ouen2024 .item-list .item-name h3 {
    font-size: 1.1em;
    text-align: center;
    padding: 2% 0 2.5%;
}
#seikatsu_ouen2024 .item-list .item-sokyu {
    font-weight: bold;
    text-align: center;
    margin-bottom: 1%;
}
#seikatsu_ouen2024 .item-list .item-sokyu .price{
    font-size: 1.0em;
    font-weight: 500;
    color: #222 !important;
    display: block;
    font-family: 'Noto Sans JP', 'Yu Gothic black', sans-serif, 'メイリオ';
}
#seikatsu_ouen2024 .item-list .item-sokyu .price::before{
    content: '通常価格';
}
#seikatsu_ouen2024 .item-list .item-sokyu .price::after{
    content: 'のところ';
}
#seikatsu_ouen2024 .item-price {
    display: flex;
    justify-content: center;
    margin-bottom: 2%;
    position: relative;
}
#seikatsu_ouen2024 .item-price__icon {
    font-size: 1.1em;
    color: #dd0000 !important;
    font-weight: 700;
    letter-spacing: 0.01em;
    margin-right: 3%;
    background-color: #f1da3e;
    display: flex;
    align-items: center;
    padding: 0em .5em;
    line-height: 1;
}
#seikatsu_ouen2024 .item-price__icon.sale {
    color: #FFF !important;
    background-color: #dd0000;
}
#seikatsu_ouen2024 .item-price__icon.point {
    color: #dd0000 !important;
    background-color: #f1da3e;
    font-size: .9em;
    margin-right: 2%;
}
#seikatsu_ouen2024 .item-price__icon.coupon {
    background-color: #1051c9;
    color: #fff !important;
    font-size: .9em;
    margin-right: 2%;
}
#seikatsu_ouen2024 .item-price .price {
    font-size: 2em;
    color: #dd0000 !important;
    text-shadow: 2px 2px #fff383;
    font-family: "Hind", sans-serif;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1em;
}
#seikatsu_ouen2024 .item-review {
    border-top: 1px dashed #f9d16f;
    padding: 2% 0;
    width: 100%;
    margin: 0 auto;
}
#seikatsu_ouen2024 .item-review_txt {
    line-height: 1.6em;
    font-size: 1.1em;
    text-align: center;
    padding: 1% 0 1.5%;
white-space: nowrap;
}
#seikatsu_ouen2024 .item-arrow {
    position: absolute;
    right: 3%;
    top: 2%;
}
#seikatsu_ouen2024 .item-arrow .shosai {
    position: relative;
    display: block;
    font-size: 1em;
    padding: 1em 1em 1em 1em;
    border-radius: 100em;
    background-color: #dd0000;
    color: #FFF;
}
#seikatsu_ouen2024 .item-arrow .shosai::after {
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    content: "";
    width: .4em;
    height: .4em;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    top: 0;
    bottom: 0;
    right: 39%;
    margin: auto;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: all 0.3s ease 0s;
}

/* 2カラム用 */
#seikatsu_ouen2024 .item-list.cal2 .item {
    width: calc(100% / 2 - 2%);
}
#seikatsu_ouen2024 .item-list.cal2 .item a {
    display: flex;
    flex-direction: column;
}
#seikatsu_ouen2024 .item-list.cal2 .item-img {
    width: 100%;
    box-sizing: border-box;
    padding: 2% 5% 1%;
    position: relative;
}
#seikatsu_ouen2024 .item-list.cal2 .item-back {
    width: 100%;
}

/* カテゴリーリスト */
#seikatsu_ouen2024 .category-list {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#seikatsu_ouen2024 .category-list li {
    width: calc(100% / 3 - 2%);
    background-color: #FFF;
    border-radius: 5px;
    margin: 0 0 2% 0;
    border: 1px solid #FFF;
    transition: .3s;
}

#seikatsu_ouen2024 .category-list li a {
    width: 100%;
    height: 4.5em;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2%;
}
#seikatsu_ouen2024 .category-list svg {
    width: 2rem !important;
    fill: #951812;
}
#seikatsu_ouen2024 .category-list i {
    font-size: 1.5rem;
    color: #951812;
}
#seikatsu_ouen2024 .category-list i.fa-play {
    font-size: .8rem;
    margin-left: 5%;
}
#seikatsu_ouen2024 .category-list p {
    font-size: 1rem;
    color: #951812;
    text-align: center;
}

#seikatsu_ouen2024 .category-list li:hover {
    background-color: #951812;
}
#seikatsu_ouen2024 .category-list li a:hover {
    opacity: 1;
}
#seikatsu_ouen2024 .category-list li a:hover i {
    color: #FFF !important;
}
#seikatsu_ouen2024 .category-list li a:hover p {
    color: #FFF !important;
}
#seikatsu_ouen2024 .category-list li a:hover svg {
    fill: #FFF;
}

/* 2カラム */
#seikatsu_ouen2024 .category-list.cal2 li {
    width: calc(100% / 2 - 2%);
}
/* 2カラム内100％ */
#seikatsu_ouen2024 .category-list.cal2 li.width100 {
    width: 100%;
}

/*==============================================
商品ラインアップ ここまで
================================================*/

/* ストア */
#seikatsu_ouen2024 .store-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#seikatsu_ouen2024 .store-list a {
    width: calc(100% / 3 - 1.5%);
    margin-bottom: 2%;
    border-radius: 5px;
    overflow: hidden;
}

#seikatsu_ouen2024 #store .banner {
    margin: 0 auto 3%;
}
#seikatsu_ouen2024 .banner a.winter {
    box-sizing: border-box;
    border: 2px solid #FFF;
}
#seikatsu_ouen2024 #store .banner-flex {
    margin: 0 auto 3%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#seikatsu_ouen2024 #store .banner-flex a{
    width: calc(100% / 3 - 1.5%);
    margin-bottom: 3%;
}

/*==============================================
ナビゲーション　ここから
================================================*/
#seikatsu_ouen2024 #nav {
    position: fixed;
    z-index: 500;
}
#seikatsu_ouen2024 #nav .gray-back{
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: #5656566b;
}
#seikatsu_ouen2024 #nav .gray-back.active{
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
#seikatsu_ouen2024 #nav .g-nav{
    position: fixed;
    width: var(--contents-padding-left);
    height: calc(100% - 141px);
    top: 141px;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    z-index: 5;
    background: #8b0604;
    box-sizing: border-box;
    padding: 2% 2%;
}
#seikatsu_ouen2024 #nav .g-nav.g-nav__left {
    left: 0;
}
#seikatsu_ouen2024 #nav .g-nav.g-nav__right {
    right: 0;
}
/*スクロールバー非表示（Chrome・Safari）*/
#seikatsu_ouen2024 #nav .g-nav::-webkit-scrollbar{
    display:none;
}
#seikatsu_ouen2024 #nav .nav-title {
    position: relative;
    width: 100%;
}
#seikatsu_ouen2024 #nav .g-nav-list h3{
    width: 100%;
    text-align: center;
    color: #FFF;
    font-size: 1.6em;
    line-height: 1;
    letter-spacing: 0.12em;
    margin-bottom: 1%;
}
#seikatsu_ouen2024 #nav .g-nav-list p{
    width: 100%;
    text-align: center;
    color: #FFF;
    font-size: 0.9em;
    margin-bottom: 2.5%;
    letter-spacing: 0.12em;
    font-weight: 400;
}
#seikatsu_ouen2024 #nav .g-nav-list .title{
    width: 100%;
    margin-bottom: 6%;
}
#seikatsu_ouen2024 #nav .g-nav__3cal {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 4%;
}
#seikatsu_ouen2024 #nav .g-nav__3cal li{
    position: relative;
    width: calc(100% / 3 - 2%);
    margin-bottom: 3%;
}

#seikatsu_ouen2024 #nav .g-nav__2cal {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#seikatsu_ouen2024 #nav .g-nav__2cal li{
    width: calc(100% / 2 - 2%);
    margin-bottom: 3%;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}
/* ナビゲーション ザブロウ配置 */
#seikatsu_ouen2024 #nav .g-nav__left .nav-img.left {
    width: 80%;
    max-width: 200px;
    margin: 0 auto;
}
#seikatsu_ouen2024 #nav .g-nav__right .nav-img.right-tit {
    position: absolute;
    right: 4%;
    top: -20%;
    width: 16%;
    margin: 0 auto;
}
#seikatsu_ouen2024 #nav .g-nav__right .nav-img.right-bottom {

}

/*アクティブクラスがついたら位置を0に*/
#seikatsu_ouen2024 #nav .g-nav.g-nav__left.panelactive{
    transition: .3s;
    right: 0;
}


/*========= ボタンのためのCSS ===============*/
.openbtn1{
    display: none;
    position:fixed;
    z-index: 1000;/*ボタンを最前面に*/
    bottom: 57px;
    right: 10px;
    cursor: pointer;
    width: 50px;
    height:50px;
    background: transparent;
    border-radius: 100px;
}
.openbtn1{
    display: none;
    position:fixed;
    z-index: 1000;/*ボタンを最前面に*/
    bottom: 3%;
    right: 3%;
    cursor: pointer;
    width: 50px;
    height:50px;
    background: transparent;
    border-radius: 100px;
    /* border: 1px solid #b9b9b9; */
}
  
/*×に変化*/  
.openbtn1 span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 2px;
    /* background-color: #53dcd7; */
    background: #FFF;
    width: 45%;
}

.openbtn1 p{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    text-align: center;
    left: 21.5%;
    bottom: 3%;
    font-size: .6rem;
}

.openbtn1 span:nth-of-type(1) {
  top:15px; 
}

.openbtn1 span:nth-of-type(2) {
  top:23px;
}

.openbtn1 span:nth-of-type(3) {
  top:31px;
}

.openbtn1.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%;
}

.openbtn1.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn1.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%;
}

/*==============================================
ナビゲーション　ここまで
================================================*/

/* 家具ランキング追加 */

@media screen and (max-width: 1500px) {
    #seikatsu_ouen2024 #nav .g-nav.g-nav__right {
        display: none;
    }
    #seikatsu_ouen2024 .contents {
        padding-right: 0;
    }
    footer .footer-inner {
        padding-right: 0;
    }
}
/* タブレット */
@media screen and (max-width: 1300px) {
    #nav     {
        right: -100%;
        left: auto;
        width: 100%;
        background-color: transparent;
    }
    #nav.panelactive {
        right: 0;
    }
    .g-nav {
        width: 35%;
        height: calc(100% - 141px);
        background: #9d0300;
    }
    #seikatsu_ouen2024 #nav .g-nav.g-nav__left {
        left: auto;
        right: -100%;
    }
    #seikatsu_ouen2024 .contents {
        padding-left: 0;
    }
    .openbtn1 {
        display: block;
        background: #dd070a;
    }
    footer .footer-inner {
        padding-left: 0;
    }
}
