@charset "UTF-8";
/* 

========================================
◆ デザイン幅閾値
========================================

320px ~ 479px 
480px ~ 639px 
640px ~ 767px 
768px ~ 959px
960px ~ 1079px
1080px ~ 1279px
1280px ~ 1439px
1440px ~ 1679px
1680px ~ 2560px

デザイン限界: 320px ~ 2560px


========================================
◆ z-index
========================================

fixed-header-z-index: 9000;
fixed-nav-z-index: 8900;
global-footer-z-index: 8990;


========================================
◆ カラー構成
========================================

背景: #ffffff;

メインテキスト: #333333;
サブテキスト: #333333;

テーマカラー: #008542;


========================================
◆ フォント
========================================

見出しフォント:
{
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 700;
    font-style: normal;
}

本文フォント:
{
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 400;
    font-style: normal;
}

装飾フォント:
{
    font-family: "Zen Old Mincho", serif;
    font-weight: 700;
    font-style: normal;
}


========================================
◆ 基準フォントサイズ
========================================

$base-font-size: 20px;

$body-font-size-pc: 16px;
$body-font-size-sp: 13px;


========================================
◆ transition設定
========================================

0.4s: 0.4s;

$hover-transition: 0.4s cubic-bezier(0.2, 0, 0.8, 1) 0s;
$hover-transition-rev: 0.4s cubic-bezier(0.2, 0, 0.8, 1) 0s;
$hover-transition-step-1: 0.2s cubic-bezier(0.4, 0, 1, 1) 0s;
$hover-transition-step-2: 0.2s cubic-bezier(0, 0, 0.6, 1) 0.2s;
$hover-transition-step-1-rev: 0.2s cubic-bezier(0, 0, 0.6, 1) 0.2s;
$hover-transition-step-2-rev: 0.2s cubic-bezier(0.4, 0, 1, 1) 0s;
$hover-transition-step-1-after: 0s 0.2s;
$hover-transition-after: 0s 0.4s;
$hover-transition-after-start: 0.4s cubic-bezier(0.2, 0, 0.8, 1) 0.4s;

$hover-transition-ease: 0.4s ease 0s;

$hover-opacity: 0.70;


0.6s: 0.6s;

$menu-transition: 0.6s cubic-bezier(0.2, 0, 0.8, 1) 0s;
$menu-transition-rev: 0.6s cubic-bezier(0.2, 0, 0.8, 1) 0s;
$menu-transition-step-1: 0.3s cubic-bezier(0.4, 0, 1, 1) 0s;
$menu-transition-step-2: 0.3s cubic-bezier(0, 0, 0.6, 1) 0.3s;
$menu-transition-step-1-rev: 0.3s cubic-bezier(0, 0, 0.6, 1) 0.3s;
$menu-transition-step-2-rev: 0.3s cubic-bezier(0.4, 0, 1, 1) 0s;
$menu-transition-step-1-after: 0s 0.3s;
$menu-transition-after: 0s 0.6s;


$disp-transition-time: 0.6s;



========================================
◆ ヘッダー高さ
========================================

$global-header-height-pc: 80px;
$global-header-height-sp: 50px;


*/


/* 

テーマのデザイン設定

 */
:root {
    /* 

    《 テーマカラー 》

    対応要素に set-color-theme-XX クラスをつけて適用

     */
    --themeval-color-theme-01: #008542;
    --themeval-color-theme-02: #319c62;
    --themeval-color-theme-03: #6fb92c;
    --themeval-color-theme-04: #95c05e;
    --themeval-color-theme-05: #f9be00;
    --themeval-color-theme-06: #f6f8d9;
    --themeval-color-theme-07: #009ea7;
    --themeval-color-theme-08: #00aab7;
    --themeval-color-theme-09: #c4e6f9;
    --themeval-color-theme-10: #f6f5f3;
    --themeval-color-theme-11: #0080cb;
    --themeval-color-theme-12: #eaf5fc;
    --themeval-color-theme-13: #4c818e;
    --themeval-color-theme-14: #b9cd46;
    --themeval-color-theme-15: #78b9c3;
    --themeval-color-theme-16: #cbe6d8;
    --themeval-color-theme-17: #dae9c7;
    --themeval-color-theme-18: #e71e28;
    --themeval-color-theme-19: #aaa;
    --themeval-color-theme-20: #aaa;

    --themeval-rgb-theme-01: 0, 133, 66;
    --themeval-rgb-theme-02: 49, 156, 98;
    --themeval-rgb-theme-03: 111, 185, 44;
    --themeval-rgb-theme-04: 149, 192, 94;
    --themeval-rgb-theme-05: 249, 190, 0;
    --themeval-rgb-theme-06: 246, 248, 217;
    --themeval-rgb-theme-07: 0, 158, 167;
    --themeval-rgb-theme-08: 0, 170, 183;
    --themeval-rgb-theme-09: 196, 230, 249;
    --themeval-rgb-theme-10: 246, 245, 243;
    --themeval-rgb-theme-11: 0, 128, 203;
    --themeval-rgb-theme-12: 234, 245, 252;
    --themeval-rgb-theme-13: 76, 129, 142;
    --themeval-rgb-theme-14: 185, 205, 70;
    --themeval-rgb-theme-15: 120, 185, 195;
    --themeval-rgb-theme-16: 203, 230, 216;
    --themeval-rgb-theme-17: 218, 233, 199;
    --themeval-rgb-theme-18: 231, 30, 40;
    --themeval-rgb-theme-19: 170, 170, 170;
    --themeval-rgb-theme-20: 170, 170, 170;
    /* 

    《 テキストカラー 》

     */
    --themeval-color-theme-text-black: #333;
    --themeval-color-theme-text-white: #fff;
    /* 

    《 モノクロカラー 》

     */
    --themeval-color-theme-black: #333;
    --themeval-color-theme-gray-01: #666;
    --themeval-color-theme-gray-02: #999;
    --themeval-color-theme-gray-03: #ccc;
    --themeval-color-theme-gray-04: #ccc;
    --themeval-color-theme-gray-05: #ccc;
    --themeval-color-theme-gray-06: #ccc;
    --themeval-color-theme-gray-07: #ccc;
    --themeval-color-theme-gray-08: #ccc;
    --themeval-color-theme-gray-09: #ccc;
    --themeval-color-theme-gray-10: #ccc;
    --themeval-color-theme-white: #fff;
    /* 

    《 基本カラー 》

     */
    --themeval-color-theme-red: #e01;
    --themeval-color-theme-blue: #06b;
    --themeval-color-theme-green: #2a3;
    --themeval-color-theme-yellow: #fe0;
    --themeval-color-theme-orange: #fa0;
    --themeval-color-theme-violet: #b0d;
    --themeval-color-theme-purple: #c0b;
    --themeval-color-theme-magenta: #d09;
    --themeval-color-theme-cyan: #0ae;
    /* 

    《 ファイルカラー 》

     */
    --themeval-color-theme-file-pdf: #b10;
    --themeval-color-theme-file-word: #15b;
    --themeval-color-theme-file-excel: #184;
    --themeval-color-theme-file-powerpoint: #d53;
    --themeval-color-theme-file-zip: #eb4;
    --themeval-color-theme-img-jpeg: #27c;
    --themeval-color-theme-img-gif: #69a;
    --themeval-color-theme-img-png: #e15;
    --themeval-color-theme-img-webp: #6c9;
    /*

    《 使用フォント 》

    【 ゴシック体 推奨値 】
    "Noto Sans JP", '游ゴシック体', 'Yu Gothic', 'YuGothic', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    【 明朝体 推奨値 】
    "Noto Serif JP", '游明朝体', 'Yu Mincho', 'YuMincho', 'ヒラギノ明朝 Pro', 'Hiragino Mincho Pro', 'MS P明朝', 'MS PMincho', serif
    
    */
    --themeval-font-default: "Zen Kaku Gothic New", sans-serif;
    --themeval-font-sans: "Zen Kaku Gothic New", sans-serif;
    --themeval-font-serif: "Zen Old Mincho", serif;
    --themeval-font-weight-default: 500;
    /*

    《 コンテナサイズ設定 》
    
    */
    --themeval-container-width: 1100px;
    --themeval-container-width-narrow: 1000px;
    --themeval-container-width-wide: 1200px;
    --themeval-container-width-ex-wide: 1300px;
    --themeval-frame-container-width: 1400px;
    --themeval-max-display-width: 2560px;
    /*

    《 ブロック余白設定 》
    
    */
    --themeval-content-block-margin: 36px;
    --themeval-content-line-margin: 16px;
    --themeval-content-block-margin-sp: 24px;
    --themeval-content-line-margin-sp: 13px;
    /*

    《 フォントサイズ設定 》
    
    */
    --themeval-root-font-size: 20;
    --themeval-root-line-height: 2;

    --themeval-font-size-ex-small: 11;
    --themeval-font-size-small: 13;
    --themeval-font-size-normal: 16;
    --themeval-font-size-large: 20;
    --themeval-font-size-ex-large: 24;

    --themeval-font-size-ex-small-tb: 10;
    --themeval-font-size-small-tb: 12;
    --themeval-font-size-normal-tb: 14;
    --themeval-font-size-large-tb: 18;
    --themeval-font-size-ex-large-tb: 21;

    --themeval-font-size-ex-small-sp: 9;
    --themeval-font-size-small-sp: 11;
    --themeval-font-size-normal-sp: 13;
    --themeval-font-size-large-sp: 16;
    --themeval-font-size-ex-large-sp: 20;
    /*

    《 Transition設定 》
    
    */
    --themeval-transition: cubic-bezier(0.2, 0, 0.8, 1);
    --themeval-hover-transition: 0.4s cubic-bezier(0.2, 0, 0.8, 1) 0s;
    --themeval-hover-transition-rev: 0.4s cubic-bezier(0.2, 0, 0.8, 1) 0s;
    --themeval-hover-transition-step-1: 0.2s cubic-bezier(0.4, 0, 1, 1) 0s;
    --themeval-hover-transition-step-2: 0.2s cubic-bezier(0, 0, 0.6, 1) 0.2s;
    --themeval-hover-transition-step-1-rev: 0.2s cubic-bezier(0, 0, 0.6, 1) 0.2s;
    --themeval-hover-transition-step-2-rev: 0.2s cubic-bezier(0.4, 0, 1, 1) 0s;
    --themeval-hover-transition-step-1-after: 0s 0.2s;
    --themeval-hover-transition-after: 0s 0.4s;
    --themeval-hover-transition-after-start: 0.4s cubic-bezier(0.2, 0, 0.8, 1) 0.4s;
    --themeval-hover-transition-ease: 0.4s ease 0s;
    --themeval-menu-transition: 0.6s cubic-bezier(0.2, 0, 0.8, 1) 0s;
    --themeval-menu-transition-rev: 0.6s cubic-bezier(0.2, 0, 0.8, 1) 0s;
    --themeval-menu-transition-step-1: 0.3s cubic-bezier(0.4, 0, 1, 1) 0s;
    --themeval-menu-transition-step-2: 0.3s cubic-bezier(0, 0, 0.6, 1) 0.3s;
    --themeval-menu-transition-step-1-rev: 0.3s cubic-bezier(0, 0, 0.6, 1) 0.3s;
    --themeval-menu-transition-step-2-rev: 0.3s cubic-bezier(0.4, 0, 1, 1) 0s;
    --themeval-menu-transition-step-1-after: 0s 0.3s;
    --themeval-menu-transition-first: 0.1s cubic-bezier(0.4, 0, 1, 1) 0s;
    --themeval-menu-transition-last: 0.1s cubic-bezier(0, 0, 0.6, 1) 0.5s;
    --themeval-menu-transition-after: 0s 0.6s;
    --themeval-menu-transition-after-start: 0.6s cubic-bezier(0, 0, 0.6, 1) 0.6s;
    /*

    《 ホバー装飾 》
    
    */
    --themeval-hover-opacity: 0.70;
    /*

    《 ヘッダー高さ 》
    
    */
    --themeval-global-header-height: 80px;
    --themeval-global-header-height-pc: 80px;
    --themeval-global-header-height-sp: 50px;
}


