@charset "UTF-8";
  /* 共通 */
:root{
  --black: #323232;
  --white: #fff;
  --link: #1558d6;
  --gray-bg-01: #e6e6e6;
  --gray-bg-02: #f6f6f6;
}
  /* グレースケール */
:root{
  --gray-01: #464646;
  --gray-02: #5a5a5a;
  --gray-03: #6e6e6e;
  --gray-04: #828282;
  --gray-05: #969696;
  --gray-06: #aaaaaa;
  --gray-07: #bebebe;
  --gray-08: #d2d2d2;
  --gray-09: #fafafa;  
}

/* メールマーケティング */
:root{
  --rmailmarketing-primary: #172a88;
  --rmailmarketing-light: #87a1ff;
  --rmailmarketing-medium: #5163ed;
  --rmailmarketing-dark: #2135c4;
  --rmailmarketing-bg-main: #6575f0;
  --rmailmarketing-bg-sub-01: #aeb9ef;
  --rmailmarketing-bg-sub-02: #d6dcf7;
  --rmailmarketing-bg-sub-03: #f4f6fd;
  --rmailmarketing-cta: #f08300;
  --rmailmarketing-accent: #ffe680;
}
/* 階層の変数定義 z-index*/
:root{
  --z-index-header: 1000;
  --z-index-hamburger-menu: 999;
  --z-index-sub-menu: 998;
  --z-index-totop: 999;
  --z-index-overlay: 995;
  --z-index-modal: 1001;
}
/* セクション間(上下)の空白の変数定義 padding*/
:root{
  --sec-padding: 50px 0;
  --sec-padding-top: 50px;
  --sec-padding-bottom: 50px;
}
@media (max-width: 768px) {
  :root{
    --sec-padding: 30px 0;
    --sec-padding-top: 30px;
    --sec-padding-bottom: 30px;
  }
}