:root {
    /* common setting */
    /* bootstrap.php _CSS_IMG_VER と値を合わせる  */
    /* --img_ver : 220809144421; */
    /* 文字列の連結ができないので直接記述とする */

    /* デフォルトのフォントを変更する*/
    --base-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;

    /* mpbile用 PCで読み込む際に計算式で必要 数字に影響が出ないように1とする start */
    --mobile-margin-top-balance: 1;
    --mobile-font-balance :1;
    --mobile-width-balance :1;
    --mobile-margin-left-balance :1;
    /* mpbile用 end */

    --d-color: #4D5156; /* --default-color */
    --d-color-thin-0: #64686C;
    --d-color-thin-1: #83878C;
    --d-color-thin-2: #B8BBBF;
    --d-color-thin-3: #DFE2E5;
    --d-color-thin-4: #F5F5F5;
    --d-color-thin-5: #F7F6F6;

    --d-color-deep-1: #313336;
    --d-color-deep-2: #1D1E1F;

    /* brand color start */
    --primary-color: #D01516;
    --primary-color-2: #D73B14;
    --primary-color-3: #E06D1E;
    --primary-color-4: #FFE8CF;
    --primary-color-5: #FFF9F3;
    --error-color: #EE141E;
    --white : #fff;
    --black : #000;
    --d-contents-background-color: #F5F5F5;

    /* padding */
    --d-padding-r: 1.2em; /* --default-padding-right */
    --d-padding-l: 1.2em; /* --default-padding-left */
    --d-padding-b: 3em; /* --default-padding-bottom */

    /* header 調整の変数*/
    --header-margin: 57px;

    /* margin */
    --d-margin-r: 1.2em; /* --default-padding-right */
    --d-margin-l: 1.2em; /* --default-padding-left */
    --d-margin-b: 6em; /* --default-padding-bottom */

    /* font size */
    --d-font-size: 1.1rem; /* --default-font-size */
    --d-font-size-0: calc( var(--d-font-size) * 1.125 ); /* 2.4rem */
    --d-font-size-1: calc( var(--d-font-size) * 1.25 ); /* 2.4rem */

    --d-font-size-2: calc( var(--d-font-size) * 1.35 ); /* 3.2rem */
    @media (max-width: 980px) {
        --d-font-size-2: calc( var(--d-font-size) * 1.5 ); /* 3.2rem */
    }

    --d-font-size-3: calc( var(--d-font-size) * 1.5 );  /* 3.2rem */
    --d-font-size-4: calc( var(--d-font-size) * 1.75 );
    --d-font-size-5: calc( var(--d-font-size) * 2 );
    --d-font-size-6: calc( var(--d-font-size) * 2.25 );
    --d-font-size-7: calc( var(--d-font-size) * 2.5 );
    --d-font-size-8: calc( var(--d-font-size) * 2.75 );
    --d-font-size-9: calc( var(--d-font-size) * 5 );

    --d-font-size-min-0: calc( var(--d-font-size) * 0.9 ); /* 1.2rem */
    --d-font-size-min-1: calc( var(--d-font-size) * 0.85 ); /* 1.2rem */
    --d-font-size-min-2: calc( var(--d-font-size) * 0.8 );  /* 0.8rem */
    --d-font-size-min-3: calc( var(--d-font-size) * 0.75 );
    --d-font-size-min-4: calc( var(--d-font-size) * 0.65 ); /* 1rem に相当 */
    --d-font-size-min-5: calc( var(--d-font-size) * 0.4 );
    /* 読み物用 size */
    --read-font-size: 1.2rem;
    --read-line-height: 1.8;

    /* font margin */
    --d-font-margin-b: 1.5em; /* --default-font-margin-bottom */
    --d-font-size-2-margin-b: 0.4em; /* --d-font-size-2-margin-bottom */
    --d-font-size-4-margin-b: 1em; /* --d-font-size-4-margin-bottom */

    /* line height */
    --d-font-line-h: 1.8; /* --default-font-line-height */
    --d-font-line-h-1: calc( var(--d-font-line-h) * 1.111 );
    --d-font-line-h-2: calc( var(--d-font-line-h) * 1.33 );
    --d-font-line-h-min-1: calc( var(--d-font-line-h) * 0.92);
    --d-font-line-h-min-2: calc( var(--d-font-line-h) * 0.8);

    /* font family */
    /*  'Noto Serif JP'は android micho 対応 */
    --font-price-bord: 'DIN-Exp', Hiragino Sans, "ヒラギノ角ゴシック",
    Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ ProN W3",
    Roboto, "Droid Sans",
    YuGothic, "游ゴシック",
    Verdana, "ＭＳ Ｐゴシック",
    Arial, BIZ UDPGothic,
    Meiryo, "メイリオ",
    ＭＳ\ ゴシック, MS Gothic, Osaka－等幅, Osaka-mono, monospace;



    --font-f-en-gothic: "Oswald", Hiragino Sans, "ヒラギノ角ゴシック",
    Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ ProN W3",
    Roboto, "Droid Sans",
    YuGothic, "游ゴシック",
    Verdana, "ＭＳ Ｐゴシック",
    Arial, BIZ UDPGothic,
    Meiryo, "メイリオ",
    ＭＳ\ ゴシック, MS Gothic, Osaka－等幅, Osaka-mono, monospace;

    --font-f-en-qa:    'Bahnschrift', ＭＳ\ Ｐ明朝, MS PMincho, ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, serif;
    --font-f-en-ranking: 'Zapf', ＭＳ\ Ｐ明朝, MS PMincho, ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, serif;
    --font-f-en-big:    'LilStuart', ＭＳ\ Ｐ明朝, MS PMincho, ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, serif;
    --font-f-en:        'Outfit', ＭＳ\ Ｐ明朝, MS PMincho, ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, serif;
    --font-f-mincho:    ＭＳ\ Ｐ明朝, MS PMincho, ヒラギノ明朝 Pro W3, Hiragino Mincho Pro,'Noto Serif JP',  serif;
    --font-f-mincho-h:  'Hannari', ＭＳ\ Ｐ明朝, MS PMincho, ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, 'Noto Serif JP', serif;
    --font-f-gothic:
            Hiragino Sans, "ヒラギノ角ゴシック",
            Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ ProN W3",
            Roboto, "Droid Sans",
            YuGothic, "游ゴシック",
            Verdana, "ＭＳ Ｐゴシック",
            Arial, BIZ UDPGothic,
            Meiryo, "メイリオ",
            ＭＳ\ ゴシック, MS Gothic, Osaka－等幅, Osaka-mono, monospace;

    --font-f-number:    'D-DIN',ヒラギノ角ゴ Pro W3, ＭＳ\ ゴシック, MS Gothic, Osaka－等幅, Osaka-mono, monospace, sans-serif;

    --font-f-tel-number: "Lato", sans-serif;

    --font-f-times-italic: 'Old Standard TT', ＭＳ\ Ｐ明朝, MS PMincho, ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, serif;

    --d-font-weight-light: 280;
    --d-font-weight: 400;

    --d-font-weight-bold-2:700;
    --d-font-weight-bold-1:650;
    --d-font-weight-bold: 600;
    --d-font-weight-bold-min-0:550;
    --d-font-weight-bold-min-1:450;

    /* indent title */
    --d-indent: 2em;
    --d-indent-min-0: 0px;
    --d-indent-min-1: -1px;

    /* heroImage用 */
    --hero-height : 540px;

    /* common shadow */
    --shadow : 0 -2px 10px rgba(0,0,0,.15);
    --shadow-top:0 -15px 10px rgba(0,0,0,.15);
    --shadow-in : 0 10px 10px rgba(0,0,0,.3) inset;
    --shadow-thin-1 : 0 -1px 5px rgba(0,0,0,.05);

    /* common in page contents width */
    --width-sidebar : 230px;
    --width-main : 980px;
    --width-in: 735px;
}
body{
    padding: 0;
    margin: 0;
    font-family: var(--font-f-mincho);
    line-height: 1.85;
}
body *:not(h1){
    /* body の h1以外に yellow */
    /* background-color: yellow; */
}
/**********************
font size
***********************/
.f-min1{
    padding: 1em 2em;
    font-size: var(--d-font-size-min-1);
    line-height: var(--d-font-line-h-1);
    margin-bottom: var(--d-font-margin-b);
}
.f-min2{
    font-size: var(--d-font-size-min-2);
    line-height: var(--d-font-line-h);
    margin-bottom: var(--d-font-margin-b);
}
/**********************
font family
***********************/
.ff-m{
    font-family: var(--font-f-mincho);
}
.ff-m-h{
    font-family: var(--font-f-mincho-h);
}
.ff-en{
    font-family: var(--font-f-en);
}
.ff-g{
    font-family: var(--font-f-gothic);
}
.ff-g-b{
    font-family: var(--font-f-gothic);
    font-weight: var(--d-font-weight-bold);
}
.ff-num{
    font-family: var(--font-f-number);
}
.ff-i{
    font-family: var(--font-f-times-italic);
}


.font-bg-en {
     font-family: "Libre Franklin", sans-serif;
     font-optical-sizing: auto;
     font-weight: 700;
     font-style: normal;
             }
/**********************
font decoration
***********************/
.b{ font-weight: var(--d-font-weight-bold); margin-right:0.3em; }
.marker-y{ background: linear-gradient(transparent 70%, #FFF89D 70%);}
.marker-r{ background: linear-gradient(transparent 70%, #FFF89D 70%);}


/**********************
text-indent
***********************/
.indent-min-0{
    letter-spacing: var(--d-indent-min-0);
}
.indent-min-1{
    letter-spacing: var(--d-indent-min-1);
}

/**********************
font-face
***********************/
/* =========================
   Outfit
========================= */
@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-Bold.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Outfit-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/Outfit-Bold.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/Outfit-Bold.woff') format('woff'), /* Modern Browsers */
    url('../fonts/Outfit-Bold.ttf') format('truetype'); /* Safari, Android, iOS */
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/**********************
link
***********************/
a{
    text-decoration: none;
    color: var(--d-color);
}
a:link, a:visited {
    text-decoration: none;
}

a:active, a:hover {
    text-decoration: underline;
}
@media (max-width: 980px) {
picture{
    line-height: 0;
}
    }
*{
    box-sizing: border-box;
}
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }

input, select, textarea {
    max-width: 100%;
    width: 100%;
}
p{
    margin: 0;
    padding: 0;
}
dl{
    margin: 0;
    padding: 0;
}
dl dd,
dl dt{
    margin: 0;
    padding: 0;
}
picture{
    display: block;
}
img{
    pointer-events:none;
}

::placeholder {
    color:var(--d-color-thin-2);
}
html {
    scroll-behavior: smooth;
}