/* Web Font 宣言　
=======================================*/

/*
@font-face {
    font-family: 'OthutomeFont';
    src: url('OthutomeFont_ver1.04.ttf') format('truetype');
}

@font-face {
    font-family: 'Tommy_Lee';
    src: url('Tommy_Lee.otf') format('opentype');
}

@font-face {
    font-family: 'mame';
    src: url('Mamelon.otf') format('opentype');
}

@font-face {
    font-family: 'crayon';
    src: url('crayon_1-1.ttf') format('truetype');
}
*/

* {}

body {
    margin: 0px;
}


/* --テキスト選択時のオリジナルハイライト色設定-- */

::selection {
    background-color: #cf9;
    color: #000;
}

/* --Firefoxの設定-- */
::-moz-selection {
    background-color: #cf9;
    color: #000;
}


/* 基本設定
=============================================*/

h3 {
    /*
    margin-top: 0px;
    */
    margin: 0px;
}

.container {
    width: min(100%, 1920px);
    background-color: #ffffff;
    margin: 0 auto;
}

ul {
    width: 100%;
    margin: 0;
    padding: 0;
}

a.mailto {
    color: #f77941;
    text-decoration: underline;
}


/*　サイト名　
===========================================*/

header {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0px auto 0px auto;
}

.top-cen {
    display: flex;
    flex-direction: column;
}

.top-logo {
    background-color: #000000;
}

.sub-logbox {
    background-color: #74472D;
}

.top-lg {
    width: min(90%, 837px);
}

.top-lg2 {
    width: min(40%, 269px);
}

/* --サイトネーム画像-- */



/* ドロップシャドウ設定
============================================*/

/* 未使用
@mixin text-shadow-white($opacity: 1) {
    text-shadow: 0 1px 0 rgda(#d4d4af, $opacity);
}
*/

/* メニュー設定
==============================================*/

.un-line {
    border-bottom: solid 2px #c3a89a;
}

.l-box {
    width: min(100%, 1400px);
}

.herf-box {
    display: flex;
    flex-direction: column;
}

.top-link {
    width: auto;
    display: flex;
    flex-wrap: wrap;
    margin: 0px 10px;
}

.menu-link {
    color: #6e432d;
    margin-left: 20vw;
}

.sns-lin {
    width: 100vw;
    display: flex;
    justify-content: center;
}

.sns-img {
    margin: 3vw 8vw;
}

/* メインコンテンツ
============================================*/

section {
    max-width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ton-img {
    width: 100%;
}

div.line {
    width: 100%;
    margin-top: 15px;
    display: flex;
    align-items: center;
}

div.line-1 {
    border-bottom: solid 1px #cca15b;
    width: 100%;
    margin-top: 0px;
    margin-top: 0px;
    display: flex;
    align-items: center;
}

a.tonki-1 {
    width: max-content;
}

a.tonki-2 {
    margin-left: 30px;
}

a.shop {
    margin: 40px 0px 80px 3px;
}

.txt-li1 {
    color: #77171f;
    font-size: 3.4vw;
    font-weight: 600;
    margin-top: 4vw;
}

.mame-top1,
.mame-top2 {
    width: 100%;
    margin: 5vw 0px 0px 0px;
    padding: 0px;
}

.mmm {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.mame-top {
    width: 100%;
    margin: -1px auto;
    word-wrap: break-word;
    word-break: break-all;
}

.text-1 {
    background-color: #fef1f2;
    width: 95%;
    border-radius: 10px;
    margin: 25px auto 0px auto;
}

.text-com {
    background-color: #faefe7;
    width: 95%;
    border-radius: 10px;
    margin: 8vw auto 0vw auto;
}

.text-tpp1 {
    display: flex;
    flex-wrap: wrap;
}

/* 店舗住所 */
.end-add {
    flex-direction: column;
}

.end-logo {
    width: auto;
    height: 100%;
    margin: 0px auto;
    display: flex;
    justify-content: center;
}

.end-add-tx {
    display: flex;
    justify-content: center;
}


/* 商品販売店ページ 設定
============================================*/

.syo-han-te2 {
    display: flex;
    flex-direction: column;
}

.ten-cmt {
    display: flex;
    justify-content: center;
}

.han-ten-name {
    background-color: #faefe7;
    border-radius: 5px;
    padding-left: 10px;
}

.ten-cm-t {
    font-size: 4vw;
    line-height: 5vw;
    margin: 0px 0px 10px 0px;
}

.g-hanbai {
    width: 99vw;
    height: min(70vh, 750px);
}


/* footer 設定
============================================*/

footer {
    background-color: #C5AA9A;
    width: min(100%, 1920px);
    height: 20px;
}



/* 画面サイズ760px以上 900px以下で、PC専用画面になる。
==================================================*/

@media screen and (min-width: 760px) {

    /* リンク 760px
    *************************************************/
    .l-box {
        display: flex;
        flex-direction: row;
    }

    .herf-box {
        width: 100%;
        height: 0px;
        flex-direction: row;
        justify-content: space-around;
    }

    .menu-ty {
        width: auto;
        margin: 20px 10px 20px 10px;
        height: 30px;
        border-radius: 5px;
    }

    .top-link {
        width: calc(100% - 120px);
    }

    .menu-link {
        height: 20px;
        margin: 13px auto 0px auto;
        font-size: min(2vw, 18px);
    }

    .sns-lin {
        display: flex;
        flex-direction: column;
        width: 100px;
    }

    .sns-img {
        width: min(3.5vw, 47px);
        margin: 1vw 1vw;
        margin: min(.5vw, 20px) 1vw;
    }

    .text-com {
        width: 95%;
        margin: 40px auto 0px auto;
    }

    .txt-li1 {
        font-size: 18px;
    }

    .tab-raw {
        display: flex;
        flex-direction: row;
        align-items: baseline;
    }

    a.tonki-1 {
        margin: 10px 0px;
    }

    .text-1 {
        width: calc(min(95%, 1200px) - 40px);
        display: flex;
        flex-direction: row-reverse;
        padding: 20px;
    }

    .mame-top1 {
        width: 45%;
        margin: 0px;
    }

    .mame-top2 {
        width: 55%;
        margin: 0px;
    }

    .ton-img {
        width: min(100%, 422px);
    }

    .sub0 {
        width: 540px;
        display: flex;
        flex-wrap: wrap;
        text-align: center;
    }

    .goto-home {
        margin: 5px 20px 5px 20px;
    }

    h2 {
        font-size: 15px;
    }

    .sec0 {
        margin: 10px auto 10px auto;
    }

    /* 店舗住所760px
    *************************************************/
    div.end-add {
        display: flex;
        justify-content: center;
        flex-direction: row;
    }

    .end-logo {
        width: auto;
        height: 100%;
        margin: 0px 40px 0px 0px;
        align-self: center;
        order: 1;
    }

    .end-add-tx {
        order: 2;
    }


    /* 商品販売店ページ 設定
============================================*/

    .ten-cmt {
        margin-bottom: 40px;
    }

    .ten-cm-t {
        font-size: 18px;
        line-height: 18px;
    }

    .g-hanbai-box {
        display: flex;
        flex-direction: row-reverse;
        width: min(95vw, 1300px);
        margin: 0px auto 100px auto;
    }



    .g-hanbai {
        width: min((100% - 390px), 940px);
        height: 870px;
        margin: 0px 0px 0px auto;
    }

    .han-ten-name {
        width: 360px;
        margin-left: 10px;
        margin-right: 20px;
    }


    /* 画面サイズ1000px以上で、PC専用画面になる。
==================================================*/

    @media screen and (min-width: 1070px) {

        .sub0 {
            width: auto;
            display: flex;
            flex-wrap: nowrap;
        }

        .goto-home {
            margin: 5px 0px 5px 0px;
        }

        .menu-ty {
            margin: 5px 0px 5px 0px;
            padding: 0px;
            height: 30px;
            border-radius: 5px;
            display: table-cell;
        }


        @media screen and (min-width: 1300px) {
            .main-box-flame {
                display: flex;
                flex-direction: row;
                width: min(100%, 1300px);
                margin: 0px auto;
            }

            .l-box {
                flex-direction: column;
                width: 240px;
                margin-top: 130px;
            }

            .herf-box {
                flex-direction: column;
                height: auto;
            }

            .menu-b {
                width: 240px;
            }

            .menu-link {
                margin: 13px 16px;
            }

            .top-link {
                width: 100%;
            }

            .sns-lin {
                flex-direction: row;
                width: 70%;
                margin: 1vw 1vw;
            }
        }

        section {
            /*
            width: calc(100% - 240px);
            */
            width: 100%;
        }

        .text-1 {
            width: calc(95% - 40px);
            margin: 25px;
        }

        .g-hanbai-box {
            width: 1050px;
        }

        .g-hanbai {
            width: 640px;
            margin-left: auto;
            margin-right: 0px;
        }

    }

}