@charset "utf-8";
/* 休業案内告知ページ用css */

/* スマホ設定用 */
@media (min-width: 751px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}

/* 共通設定 */
table{
    width: 0;
    height: 0;
}
#closed{
    font-size: 12px !important; 
    /* font-size: 1em !important;  */
    width: 760px;
    margin: 0 10px;
    scroll-behavior: smooth !important;
}
#closed{
a{
    color: black;
    text-decoration: none;
    transition: all .2s !important;
    color: blue;
}
ul,
p{
    padding: 0;
    margin: 0 0 1em;
    font-size: 1.1em;
}
ul li{
    list-style-type: none;
    font-size: 1.2em;
    margin-bottom: .3em;
}
section{
    margin: 0px auto 1.5em;
    box-sizing: border-box;
}
section:not(:first-of-type){
    padding: .5em !important;
}
p a:hover,
.caution a:hover {
    background-color: #3b4b8a;
    color: white;
}

.frame{
    font-size: 1.3em;
    border:1px solid #cfcfcf;
    text-align: center;
    padding:.3em 0 .2em;
    margin:0 auto .5em;
    background-color: white;
}

h4 {
    font-size: 24px;
    text-align: center;
    vertical-align: middle;
    margin: 0 auto;
    padding: 0.3em 0 0.2em;
    background-size: cover;
}
h4 span {
    color: red; 
    font-weight: bold;
    font-size: 1.1em;
}
h5{
    line-height: 1.3em; 
    padding: .2em .4em .1em;
    border-left: 6px solid #ed1c24;
    box-sizing: border-box;
    font-size: 1.7em;
    font-weight: bold;
    margin: .5em 0 1em;
}
section:not(#period) h5,
div:not(#period) h5{
    margin-top: 1em;
}
h6{
    font-weight: bold; 
    font-size: 1.2em; 
    margin:3px auto;
    width: 100%;
}
.subtitle{
    font-size: 1.6em;
}
a img{
    transition: all .2s;
}
a img:hover{
    opacity: .7;
}
/* 共通設定ここまで */


/* ページTOPに戻るボタン */
.pagetop {
    display: none;
    position: fixed;
    bottom: 5%;
    right: 5%;
    z-index: 10000;
}
.pagetop{
a {
    display: block;
    background-color: #333;
    text-align: center;
    color: #FFF;
    font-size: 24px;
    text-decoration: none;
    padding: 14px 18px 12px;
    filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
    border-radius: 40px;
    z-index: 5000;
}
.pagetop a:hover {
    background-color: #ccc;
    color: #333;
    opacity: 1;
}
}
/* ページTOPに戻るボタンここまで */

/* 冒頭文 */
#intro{
    .greeting{
        p{
            width: fit-content;
            font-size: 1.6em;
            text-align: center;
            margin: 0 auto;
            padding: 1.6em 0 3.2em 2em;
            box-sizing: border-box;
            line-height: 1.5em;
        }
        p b{
            color: red;
        }
    }
}
/* 冒頭文ここまで */

/* 《目次》 */
#menu p{
    font-size: 1.8em;
    font-weight: bold;
    text-align: center;
    padding: .5em 0 .4em;
    border-top: 1px solid #000;    
    border-bottom: 1px solid #000;    
}
.menu{
    text-align: center;
    display: block;
    padding:0;
    margin: 0 auto 1em;
    font-size: 1em;
    max-width: 85%;
    font-weight: bold;
}
.menu{ 
a::before{
    content: "▼";
    color: white;
    margin-right: .4em;
}
a{
    font-size: 1.1em;
    display: block;
    white-space: nowrap;
    text-decoration: none;
    text-align: center;
    width: 85%;
    padding: .6em 1em .4em;
    margin: .5em auto;
    background-color: #ec5c2c;
    border-radius: 10em;
    color: white;
    border: 1px solid #ec5c2c;
    box-sizing: border-box;
    box-shadow: 0px 7px 3px 0px #548bb63e;
}
a:not(:first-child){
    margin-left: 2px;
}
a:hover{
    background-color: white;
    color: #ec5c2c;
}
}
/* 《目次》ここまで */

/* 休業期間 */
#period{
    margin: -1em auto 1em;
    padding: .5em 0 1em;
}
#period{
h5{
    text-align: center;
    border: none !important;
    font-size: 2.3em !important;
    margin: .5em auto 0 !important;
}
h5::before,
h5::after{
    content: "■";
    color: #e24c00;
}
div {
    text-align: center;
    font-size: 1.1em;
}
p {
    text-align: center;
    font-size: 1.3em;
    padding:0;
    margin: 0;
}
.day{
    font-size: 2.2em;
    font-weight: bold;
    line-height: 1.2em;
}
.day b{
    font-size: 1.5em;
}
.box{
    width: 90%;
    margin: 1em auto;
    background-color: white;
    padding: .8em 1em .8em;
    border: 1px solid red;
    box-sizing: border-box;
    white-space: nowrap;
}
.box h6{
    color: red;
    text-align: center;
}

.shop{
    margin-bottom: 0;
}
.shop{
    li::before{
        content: "●";
        color: blue;
    }
    li{
        a{
            font-size: 1em;
            color: blue;
        }
        a:hover{
            background-color: #3b4b8a;
            color: white;
        }
    }
}
}
/* 休業期間ここまで */


/* 案内本文 */
#guide{
    padding-bottom: 3em;
}
#guide{
/* リスト */
    .info {
        list-style: none;
        margin: 1em 1em 2em;
    }
    .info {
        li::before{
        content: "●";
        color: #e24c00;
        }
        li{
            text-indent: -1em;
            margin-left: 1em;
        }
        li b{
            color: red;
            font-size: 1.1em;
        }
    }
/* リストここまで */

/* 休業直前・直後の各種ご対応について */
#attention{
    .title{
        font-size: 2em;
        color: white;
        background-color: #bd1818;
        text-align: center;
        padding: .3em 0 .1em;
        margin: .5em auto;
        box-sizing: border-box;
        border-radius: 8px;
        border:none !important;
    }
        .flex{
        /* padding-bottom: 1em; */
        padding-top: .5em;
        margin-bottom: .5em;
        border-bottom: 1px dashed #999;
        align-items: center;
        justify-content: space-between;
    }
    .flex {
        img {
            width: 200px;
            margin: 1em;
            height: auto;
        }
        p{
            font-size: 1.2em;
        }
    }
    .map{
        h6::before{
            content: "●";
            color: skyblue;
        }
        h6{
            font-size: 2em;
            text-align: center;
        }
        img{
            width: 100%;
        }
    }
    .caution {
        font-size: 1.2em;
        text-align: center;
        margin: 1em auto;
    }
    .box {
        width: 90%;
        padding: 1em;
        margin: 0 auto 4em;
        border: 1px solid #000;
    }
    .box {
        .red{
            font-size: 1.7em;
            text-align: center;
            color: red;
            padding: 0;
            font-weight: bold;
            margin: 0 auto;
        }
        .caution{
            font-size: 1.3em;
            margin: 0;
        }
        table {
            white-space: nowrap;
            border-collapse: collapse;
            width: fit-content;
            margin: .5em auto;
            vertical-align: middle;
        }
        table {
            th {
                font-size: 1.2em !important;
                background-color: #ffffe2;
                border: 1px solid #000;
                padding: 1em;
                vertical-align: middle;
                font-weight: normal;
            }
            td {
                font-size: 1.2em !important;
                border: 1px solid #000;
                padding: 1em;
                vertical-align: middle;
                font-weight: bold;
                width: fit-content;
                margin: 0 auto;
            }
            p {
                padding-left: .7em;
                margin: 0 0 .5em; 
            }
            span {
                font-size: .8em;
                font-weight: normal;
            }
            ul {
                font-size: 1em !important;
                font-weight: normal;
                margin: 0;
            }
            li {
                margin: 0;
            }
            li span{
                display: block;
                font-size: .8em;
                text-align: center;
            }
        }
    }
}
/* 休業直前・直後の各種ご対応について */

/* ご注文、商品の出荷・お届けについて */
#order{
    .date{
        align-items: center;
        padding: 1.5em 1.5em 1.4em;
        box-sizing: border-box;
        background-color: #fde8e9;
        margin-bottom: 1.5em;
        vertical-align: middle;
    }
    .date{   
        div{
            width: 82%;
        }
        h6::before{
            content: "■";
            color: #e24c00;
        }
        h6{
            font-size: 1.95em;
            margin: 0;
        }
        p{
            margin: 0;
        }
        .day{
            font-size: 2.1em;
            font-weight: bold;
        }
        .day b{
            font-size: 1.3em;
        }
        p:not(.day) b{
            color: red;
            font-size: 1.3em;
        }
        .circle{
            width: 120px;
            white-space: nowrap;
            font-size: 1.6em;
            font-weight: bold;
            text-align: center;
            line-height: 1.1em;
            color: white;
            background-color: #ed1c24;
            padding: .3em .3em .1em;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 50%;
            box-sizing: border-box;
            aspect-ratio: 1 / 1;
        }
        .circle span{
            color: #ffd900 !important;
        }
        .val1{
            color: #ed1c24;
            background-color: white;
            border: 7px solid #ed1c24;
        }
    }
}
/* ご注文、商品の出荷・お届けについてここまで */


/* Web通販・店頭営業及びご注文・商品の年末年始対応一覧 */
#web-support{
    img{
        display: block;
        width: 100%;
        margin: 1em auto;
    }
}
/*  */

/* 大型商品の年内のお届けご注文受付締切日 */
#big-item{
    h6{
        font-size: 1.3em;
        margin: 0;
    }
    h6::before{
        content: "■";
        color: #e24c00;
    }
    .local-area{
        align-items: center;
        padding: 1.5em 1.5em 1.4em;
        box-sizing: border-box;
        background-color: #fde8e9;
        margin-bottom: 1.5em;
        vertical-align: middle;
    }
    .local-area{
        table{
            background-color: white;
            border: 1px solid #000;
        }
        table{
            tr{
                border: 1px solid #000
            }
        }
    }
    .circle{
        width: 120px;
        white-space: nowrap;
        font-size: 1.6em;
        font-weight: bold;
        text-align: center;
        line-height: 1.1em;
        color: white;
        background-color: #ed1c24;
        padding: .3em .3em .1em;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        box-sizing: border-box;
        aspect-ratio: 1 / 1;
    }
    .circle span{
        color: #ffd900 !important;
    }
    p{
        margin: 0;
    }
    table{
        width: 100%;
        white-space: nowrap;
        border-collapse: collapse;
    }
    tr{
        border: 1px solid #000;
    }
    th{
        font-size: 1.2em !important;
        font-weight: normal;
        text-align: left;
        text-indent: .3em;
        border: 1px solid #000;
        padding: .2em .1em .1em;
        box-sizing: border-box;
        border-right: none;
        background-color: #fcd3d5;
    }
    td{
        font-size: 1.2em !important;
        font-weight: bold;
        text-align: center;
        border: 1px solid #000;
        padding: .2em .1em .1em;
        box-sizing: border-box;
        border-left: none;
    }
}
/* 大型商品の年内のお届けご注文受付締切日ここまで */


/* 年末年始のご注文・商品出荷について|お問い合わせの対応について */
#shipping,#support{
    p{
        text-indent: -2.6em;
        margin-left: 2.6em;
        font-size: 1.2em;
        line-height: 1.6em;
    }
    p b{
        color: red;
        font-size: 1.1em;
    }
    .question::before{
        content: url(https://gigaplus.makeshop.jp/ippinkanjp/originalpage/closed-guide/2025/winter/icon/question-icon.png);
        margin-right: .5em;
        vertical-align: middle;
    }
    .answer::before{
        content: url(https://gigaplus.makeshop.jp/ippinkanjp/originalpage/closed-guide/2025/winter/icon/answer-icon.png);
        margin-right: .5em;
        vertical-align: middle;
    }

}



/* お荷物の配送状況のお問い合わせ先 */
#contact{
    padding-bottom: 3em;
}
#contact{
    .transporter{
        width: 84%;
        margin: 0 2em;
    }
    .info:not(:first-of-type){
        padding-top: 1em;
        margin-top: 1em;
        border-top: 1px solid #000;
    }
    a{
        width: 13%;
    }
    img{
        width: 100%;
    }
    h6{
        font-size: 1.3em;
    }
    p{
        margin-bottom: .2em;
    }
}
/* お荷物の配送状況のお問い合わせ先ここまで */
}
}
/* 案内本文ここまで */

/* pdfダウンロードリンク */
.button{
    display: block;
    width: fit-content;
    text-align: center; 
    margin: 30px auto 50px; 
    font-size: 1.5em; 
    padding: 10px 20px 8px; 
    border: 2px solid #cecece; 
    border-radius: 30px; 
    transition: all .2s;
    background-color: white;
    text-decoration: none;
}
.button:hover{
    border-color: #999 !important; 
    background-color: #999; 
    color: white !important;
    text-decoration: none;
}
.button:active{
    box-shadow: 0 -0.1em 0 0 #5a5a5a;
    border-color: #5a5a5a;
    -webkit-transform: translateY(0.2em);
    transform: translateY(0.2em);
}
/* pdfダウンロードリンクここまで */