/*=======================================*/


/* Web Font 変数宣言 */


/*=======================================*/


/*  拡張子 .ttf, .otf, woff  */


/****************************/


/*  拡張子 .woff  */


/*****************/

@font-face {
    font-family: 'rounded-mplus-1c';
    src: url('../css/woff2/rounded-mplus-1c-regular.woff2') format('woff');
    font-display: swap;
}





/*  拡張子 .ttf  */


/****************/

@font-face {
    
    
}





/*  ベースカラー設定 （サイトカラーは４色以内がベスト） */


/************************************************/

:root {

    /*  レイティナ画面時の倍率  */
    /************************/
    --reit: 1;


    /*  HPの基本色  */
    /***************/
    /*  サイト背景（茶色）Color #4D2C1C  */
    /**********************************/
    --main-col0: #4D2C1C;

    /*  サイトネームカラー（オレンジ）Color #EA6E32  */
    /********************************************/
    --main-col1: #EA6E32;


    /*  ナビゲータ背景色（黄緑）Color #88bb9c  */
    /***************************************/
    --main-col2: #88bb9c;


    /*  フッター　企業名　color フッター　Copyright　背景Color #7E472C  */
    /**************************************************************/
    --main-col3: #7E472C;


    /*  サイト内　基本テキストcolor #ffff  */
    /***********************************/
    --text-col1: #ffffff;


    /*  選択ハイライト&テキストcolor #f7a94e & #4b4845  */
    /************************************************/
    --text-hilight1: #F2626F;
    /*  ハイライト背景カラー  */
    --text-hilight2: #ffd76a;
    /*  選択テキストカラー  */
}






/*  スクロールバー設定  */


/*===================*/


/*Chrome*/

::-webkit-scrollbar {
    /*縦方向スクロールバーの幅*/
    width: 8px;
}

::-webkit-scrollbar:horizontal {
    /*横方向スクロールバーの高さ*/
    height: 12px;
}

::-webkit-scrollbar-track {
    /*スクロールバーの軌道*/
    background: rgba(172, 172, 172, 0.24);
}

::-webkit-scrollbar-thumb {
    /*つまみの部分*/
    box-shadow: inset 0 0 10px #F2626F;
    border-radius: 10px;
    background: rgba(144, 144, 144, 0.48);
}

::-webkit-scrollbar-thumb:hover {
    /*マウスホバー時*/
    background: gold;
}




/*Firefox*/

.info_tx {
    /*適用させる箇所のID, クラス名に置き換えてください*/
    scrollbar-width: thin;
    /*細さ(幅・高さ両方に適用)*/
    scrollbar-color: #ff7e00 rgba(87, 87, 87, 0.18);
    /*つまみの色 軌道の色*/
}






/* div要素　表示 非表示 */


/*********************/

.dis-none {
    display: none;
}

.dis-none {
    display: block;
}






/* 画像保護 */


/**********/

img {
    pointer-events: none;
}



.go-top {
    display: none;
}

/* 任意改行 <wbr> 設定 */
.wsnw {
    white-space: nowrap;
}

.Gothic {
        font-family: 'GenJyuuGothic-Medium';
}



/*  Link　設定  */


/***************/

.top-link {
    color: #D0545F;
    text-decoration: underline;
}

.top-link:hover {
    color: #ff8048;
}

.low-lin {
    text-decoration: underline;
}



.c-b {
    color: #000000;
}

.c-w {
    color: #ffffff;
}

.c-pin {
    color: #D0545F;
}

.c-gly {
    color: #494949;
}

.cl-pin {
    color: #F2626F;
}

.cl-gly {
    color: #606060;
}

.c-chee {
    color: #494949;
}

.c-chee:first-letter {
    color: #D5961E;
}

.c-wine:first-letter {
    color: #9B2D38;
}





/*  Flex設定  */


/*************/

.fl-v1 {}

.fl-v2 {}

.fl-h1 {}

.fl-h2 {}





/*  アニメ設定  */


/**************/

.ani1 {}

.ani2 {}

.ani3 {}





/*  下スペース設定  */


/******************/

.sp-1 {
    margin-bottom: 1rem;
}

.sp-2 {
    margin-bottom: 2rem;
}

.sp-3 {
    margin-bottom: 3rem;
}

.sp-4 {
    margin-bottom: 4rem;
}

.sp-5 {
    margin-bottom: 5rem;
}

.sp-6 {
    margin-bottom: 6rem;
}

.sp-7 {
    margin-bottom: 7rem;
}

.sp-8 {
    margin-bottom: 8rem;
}

.sp-9 {
    margin-bottom: 9rem;
}

.sp-10 {
    margin-bottom: 10rem;
}

.sp-11 {
    margin-bottom: 11rem;
}

.sp-12 {
    margin-bottom: 12rem;
}

.sp-13 {
    margin-bottom: 13rem;
}

.sp-14 {
    margin-bottom: 14rem;
}

.sp-15 {
    margin-bottom: 15rem;
}

.sp-16 {
    margin-bottom: 16rem;
}





/*  上スペース設定　（.bspはビフォアースペースの意味）  */


/************************************************/

.bsp-1 {
    margin-top: 1rem;
}

.bsp-2 {
    margin-top: 2rem;
}

.bsp-3 {
    margin-top: 3rem;
}

.bsp-4 {
    margin-top: 4rem;
}





/*  NEW 等のコメント文字表示  */


/***************************/

.new::after {
    content: 'NEW !!';
    color: #f0ffe0;
    background-color: #f75a14;
    font-weight: 900;
    font-size: 2rem;
    padding: 0px 1rem;
    border-radius: 6px;
}

.topic::after {
    content: 'Topic 　♪───Ｏ（≧∇≦）Ｏ────♪　!!';
    color: #f0ffe0;
    background-color: #f75a14;
    font-weight: 900;
    font-size: 2rem;
    padding: 0px 1rem;
    border-radius: 6px;
}