@charset "UTF-8";

/*===============================================
画面の横幅が768px以上（PC用）

(max-width: 767.99px) (max-width: 959.99px)
(max-width: 1024.99px) (max-width: 1059.99px)
===============================================
画面の横幅が約767.99pxまで（SP用）

(min-width: 376px)(max-width: 375.99px)
(min-width: 376px)(max-width: 567.99px)
(min-width: 568px)
(max-width: 959.99px)
===============================================*/

*{box-sizing: border-box;outline: none;}


/*------------------------------------------------------------
  DISPLAY
------------------------------------------------------------*/
.is_none { display: none; }

.clearfix{clear: both;}
.clearfix::after {
content: “”;
display: block;
clear: both;
}

.set-clear{clear: both; height: 1px;}




/* ========= margin ========== */
.m0 { margin: 0rem !important; }


/* ========= margin ========== */
.m0 {
  margin: 0rem !important; }
  @media screen and (max-width: 797.99px) {
    .m0 {
      margin: 0rem !important; } }

.mt0 {
  margin-top: 0rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt0 {
      margin-top: 0rem !important; } }

.mb0 {
  margin-bottom: 0rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb0 {
      margin-bottom: 0rem !important; } }

.ml0 {
  margin-left: 0rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml0 {
      margin-left: 0rem !important; } }

.mr0 {
  margin-right: 0rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr0 {
      margin-right: 0rem !important; } }

.mtb0 {
  margin: 0rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb0 {
      margin: 0rem auto !important; } }

.mrl0 {
  margin-right: 0rem !important;
  margin-left: 0rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl0 {
      margin-right: 0rem !important;
      margin-left: 0rem !important; } }

.m5 {
  margin: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .m5 {
      margin: 0.25rem !important; } }

.mt5 {
  margin-top: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt5 {
      margin-top: 0.25rem !important; } }

.mb5 {
  margin-bottom: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb5 {
      margin-bottom: 0.25rem !important; } }

.ml5 {
  margin-left: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml5 {
      margin-left: 0.25rem !important; } }

.mr5 {
  margin-right: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr5 {
      margin-right: 0.25rem !important; } }

.mtb5 {
  margin: 0.5rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb5 {
      margin: 0.25rem auto !important; } }

.mrl5 {
  margin-right: 0.5rem !important;
  margin-left: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl5 {
      margin-right: 0.25rem !important;
      margin-left: 0.25rem !important; } }

.m10 {
  margin: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .m10 {
      margin: 0.5rem !important; } }

.mt10 {
  margin-top: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt10 {
      margin-top: 0.5rem !important; } }

.mb10 {
  margin-bottom: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb10 {
      margin-bottom: 0.5rem !important; } }

.ml10 {
  margin-left: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml10 {
      margin-left: 0.5rem !important; } }

.mr10 {
  margin-right: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr10 {
      margin-right: 0.5rem !important; } }

.mtb10 {
  margin: 1rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb10 {
      margin: 0.5rem auto !important; } }

.mrl10 {
  margin-right: 1rem !important;
  margin-left: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl10 {
      margin-right: 0.5rem !important;
      margin-left: 0.5rem !important; } }

.m15 {
  margin: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .m15 {
      margin: 0.75rem !important; } }

.mt15 {
  margin-top: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt15 {
      margin-top: 0.75rem !important; } }

.mb15 {
  margin-bottom: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb15 {
      margin-bottom: 0.75rem !important; } }

.ml15 {
  margin-left: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml15 {
      margin-left: 0.75rem !important; } }

.mr15 {
  margin-right: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr15 {
      margin-right: 0.75rem !important; } }

.mtb15 {
  margin: 1.5rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb15 {
      margin: 0.75rem auto !important; } }

.mrl15 {
  margin-right: 1.5rem !important;
  margin-left: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl15 {
      margin-right: 0.75rem !important;
      margin-left: 0.75rem !important; } }

.m20 {
  margin: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .m20 {
      margin: 1rem !important; } }

.mt20 {
  margin-top: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt20 {
      margin-top: 1rem !important; } }

.mb20 {
  margin-bottom: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb20 {
      margin-bottom: 1rem !important; } }

.ml20 {
  margin-left: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml20 {
      margin-left: 1rem !important; } }

.mr20 {
  margin-right: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr20 {
      margin-right: 1rem !important; } }

.mtb20 {
  margin: 2rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb20 {
      margin: 1rem auto !important; } }

.mrl20 {
  margin-right: 2rem !important;
  margin-left: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl20 {
      margin-right: 1rem !important;
      margin-left: 1rem !important; } }

.m25 {
  margin: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .m25 {
      margin: 1.25rem !important; } }

.mt25 {
  margin-top: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt25 {
      margin-top: 1.25rem !important; } }

.mb25 {
  margin-bottom: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb25 {
      margin-bottom: 1.25rem !important; } }

.ml25 {
  margin-left: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml25 {
      margin-left: 1.25rem !important; } }

.mr25 {
  margin-right: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr25 {
      margin-right: 1.25rem !important; } }

.mtb25 {
  margin: 2.5rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb25 {
      margin: 1.25rem auto !important; } }

.mrl25 {
  margin-right: 2.5rem !important;
  margin-left: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl25 {
      margin-right: 1.25rem !important;
      margin-left: 1.25rem !important; } }

.m30 {
  margin: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .m30 {
      margin: 1.5rem !important; } }

.mt30 {
  margin-top: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt30 {
      margin-top: 1.5rem !important; } }

.mb30 {
  margin-bottom: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb30 {
      margin-bottom: 1.5rem !important; } }

.ml30 {
  margin-left: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml30 {
      margin-left: 1.5rem !important; } }

.mr30 {
  margin-right: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr30 {
      margin-right: 1.5rem !important; } }

.mtb30 {
  margin: 3rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb30 {
      margin: 1.5rem auto !important; } }

.mrl30 {
  margin-right: 3rem !important;
  margin-left: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl30 {
      margin-right: 1.5rem !important;
      margin-left: 1.5rem !important; } }

.m35 {
  margin: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .m35 {
      margin: 1.75rem !important; } }

.mt35 {
  margin-top: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt35 {
      margin-top: 1.75rem !important; } }

.mb35 {
  margin-bottom: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb35 {
      margin-bottom: 1.75rem !important; } }

.ml35 {
  margin-left: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml35 {
      margin-left: 1.75rem !important; } }

.mr35 {
  margin-right: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr35 {
      margin-right: 1.75rem !important; } }

.mtb35 {
  margin: 3.5rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb35 {
      margin: 1.75rem auto !important; } }

.mrl35 {
  margin-right: 3.5rem !important;
  margin-left: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl35 {
      margin-right: 1.75rem !important;
      margin-left: 1.75rem !important; } }

.m40 {
  margin: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .m40 {
      margin: 2rem !important; } }

.mt40 {
  margin-top: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt40 {
      margin-top: 2rem !important; } }

.mb40 {
  margin-bottom: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb40 {
      margin-bottom: 2rem !important; } }

.ml40 {
  margin-left: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml40 {
      margin-left: 2rem !important; } }

.mr40 {
  margin-right: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr40 {
      margin-right: 2rem !important; } }

.mtb40 {
  margin: 4rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb40 {
      margin: 2rem auto !important; } }

.mrl40 {
  margin-right: 4rem !important;
  margin-left: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl40 {
      margin-right: 2rem !important;
      margin-left: 2rem !important; } }

.m45 {
  margin: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .m45 {
      margin: 2.25rem !important; } }

.mt45 {
  margin-top: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt45 {
      margin-top: 2.25rem !important; } }

.mb45 {
  margin-bottom: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb45 {
      margin-bottom: 2.25rem !important; } }

.ml45 {
  margin-left: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml45 {
      margin-left: 2.25rem !important; } }

.mr45 {
  margin-right: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr45 {
      margin-right: 2.25rem !important; } }

.mtb45 {
  margin: 4.5rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb45 {
      margin: 2.25rem auto !important; } }

.mrl45 {
  margin-right: 4.5rem !important;
  margin-left: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl45 {
      margin-right: 2.25rem !important;
      margin-left: 2.25rem !important; } }

.m50 {
  margin: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .m50 {
      margin: 2.5rem !important; } }

.mt50 {
  margin-top: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt50 {
      margin-top: 2.5rem !important; } }

.mb50 {
  margin-bottom: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb50 {
      margin-bottom: 2.5rem !important; } }

.ml50 {
  margin-left: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml50 {
      margin-left: 2.5rem !important; } }

.mr50 {
  margin-right: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr50 {
      margin-right: 2.5rem !important; } }

.mtb50 {
  margin: 5rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb50 {
      margin: 2.5rem auto !important; } }

.mrl50 {
  margin-right: 5rem !important;
  margin-left: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl50 {
      margin-right: 2.5rem !important;
      margin-left: 2.5rem !important; } }

.m55 {
  margin: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .m55 {
      margin: 2.75rem !important; } }

.mt55 {
  margin-top: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt55 {
      margin-top: 2.75rem !important; } }

.mb55 {
  margin-bottom: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb55 {
      margin-bottom: 2.75rem !important; } }

.ml55 {
  margin-left: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml55 {
      margin-left: 2.75rem !important; } }

.mr55 {
  margin-right: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr55 {
      margin-right: 2.75rem !important; } }

.mtb55 {
  margin: 5.5rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb55 {
      margin: 2.75rem auto !important; } }

.mrl55 {
  margin-right: 5.5rem !important;
  margin-left: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl55 {
      margin-right: 2.75rem !important;
      margin-left: 2.75rem !important; } }

.m60 {
  margin: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .m60 {
      margin: 3rem !important; } }

.mt60 {
  margin-top: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt60 {
      margin-top: 3rem !important; } }

.mb60 {
  margin-bottom: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb60 {
      margin-bottom: 3rem !important; } }

.ml60 {
  margin-left: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml60 {
      margin-left: 3rem !important; } }

.mr60 {
  margin-right: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr60 {
      margin-right: 3rem !important; } }

.mtb60 {
  margin: 6rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb60 {
      margin: 3rem auto !important; } }

.mrl60 {
  margin-right: 6rem !important;
  margin-left: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl60 {
      margin-right: 3rem !important;
      margin-left: 3rem !important; } }

.m65 {
  margin: 6.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .m65 {
      margin: 3.25rem !important; } }

.mt65 {
  margin-top: 6.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mt65 {
      margin-top: 3.25rem !important; } }

.mb65 {
  margin-bottom: 6.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mb65 {
      margin-bottom: 3.25rem !important; } }

.ml65 {
  margin-left: 6.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ml65 {
      margin-left: 3.25rem !important; } }

.mr65 {
  margin-right: 6.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mr65 {
      margin-right: 3.25rem !important; } }

.mtb65 {
  margin: 6.5rem auto !important; }
  @media screen and (max-width: 797.99px) {
    .mtb65 {
      margin: 3.25rem auto !important; } }

.mrl65 {
  margin-right: 6.5rem !important;
  margin-left: 6.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .mrl65 {
      margin-right: 3.25rem !important;
      margin-left: 3.25rem !important; } }

/* ========= padding ========== */
.p5 {
  padding: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .p5 {
      padding: 0.25rem !important; } }

.p10 {
  padding: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .p10 {
      padding: 0.5rem !important; } }

.p15 {
  padding: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .p5 {
      padding: 1rem !important; } }

.p20 {
  padding: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .p20 {
      padding: 1.5rem !important; } }

.pt5 {
  padding-top: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt5 {
      padding-top: 0.25rem !important; } }

.pb5 {
  padding-bottom: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb5 {
      padding-bottom: 0.25rem !important; } }

.pl5 {
  padding-left: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl5 {
      padding-left: 0.25rem !important; } }

.pr5 {
  padding-right: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr5 {
      padding-right: 0.25rem !important; } }

.ptb5 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb5 {
      padding-top: 0.25rem !important;
      padding-bottom: 0.25rem !important; } }

.prl5 {
  padding-right: 0.5rem !important;
  padding-left: 0.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl5 {
      padding-right: 0.25rem !important;
      padding-left: 0.25rem !important; } }

.p10 {
  padding: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .p10 {
      padding: 0.5rem !important; } }

.pt10 {
  padding-top: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt10 {
      padding-top: 0.5rem !important; } }

.pb10 {
  padding-bottom: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb10 {
      padding-bottom: 0.5rem !important; } }

.pl10 {
  padding-left: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl10 {
      padding-left: 0.5rem !important; } }

.pr10 {
  padding-right: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr10 {
      padding-right: 0.5rem !important; } }

.ptb10 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb10 {
      padding-top: 0.5rem !important;
      padding-bottom: 0.5rem !important; } }

.prl10 {
  padding-right: 1rem !important;
  padding-left: 1rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl10 {
      padding-right: 0.5rem !important;
      padding-left: 0.5rem !important; } }

.p15 {
  padding: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .p15 {
      padding: 0.75rem !important; } }

.pt15 {
  padding-top: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt15 {
      padding-top: 0.75rem !important; } }

.pb15 {
  padding-bottom: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb15 {
      padding-bottom: 0.75rem !important; } }

.pl15 {
  padding-left: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl15 {
      padding-left: 0.75rem !important; } }

.pr15 {
  padding-right: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr15 {
      padding-right: 0.75rem !important; } }

.ptb15 {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb15 {
      padding-top: 0.75rem !important;
      padding-bottom: 0.75rem !important; } }

.prl15 {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl15 {
      padding-right: 0.75rem !important;
      padding-left: 0.75rem !important; } }

.p20 {
  padding: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .p20 {
      padding: 1rem !important; } }

.pt20 {
  padding-top: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt20 {
      padding-top: 1rem !important; } }

.pb20 {
  padding-bottom: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb20 {
      padding-bottom: 1rem !important; } }

.pl20 {
  padding-left: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl20 {
      padding-left: 1rem !important; } }

.pr20 {
  padding-right: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr20 {
      padding-right: 1rem !important; } }

.ptb20 {
  padding-top: 2rem !important;
  padding-bottom: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb20 {
      padding-top: 1rem !important;
      padding-bottom: 1rem !important; } }

.prl20 {
  padding-right: 2rem !important;
  padding-left: 2rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl20 {
      padding-right: 1rem !important;
      padding-left: 1rem !important; } }

.p25 {
  padding: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .p25 {
      padding: 1.25rem !important; } }

.pt25 {
  padding-top: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt25 {
      padding-top: 1.25rem !important; } }

.pb25 {
  padding-bottom: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb25 {
      padding-bottom: 1.25rem !important; } }

.pl25 {
  padding-left: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl25 {
      padding-left: 1.25rem !important; } }

.pr25 {
  padding-right: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr25 {
      padding-right: 1.25rem !important; } }

.ptb25 {
  padding-top: 2.5rem !important;
  padding-bottom: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb25 {
      padding-top: 1.25rem !important;
      padding-bottom: 1.25rem !important; } }

.prl25 {
  padding-right: 2.5rem !important;
  padding-left: 2.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl25 {
      padding-right: 1.25rem !important;
      padding-left: 1.25rem !important; } }

.p30 {
  padding: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .p30 {
      padding: 1.5rem !important; } }

.pt30 {
  padding-top: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt30 {
      padding-top: 1.5rem !important; } }

.pb30 {
  padding-bottom: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb30 {
      padding-bottom: 1.5rem !important; } }

.pl30 {
  padding-left: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl30 {
      padding-left: 1.5rem !important; } }

.pr30 {
  padding-right: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr30 {
      padding-right: 1.5rem !important; } }

.ptb30 {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb30 {
      padding-top: 1.5rem !important;
      padding-bottom: 1.5rem !important; } }

.prl30 {
  padding-right: 3rem !important;
  padding-left: 3rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl30 {
      padding-right: 1.5rem !important;
      padding-left: 1.5rem !important; } }

.p35 {
  padding: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .p35 {
      padding: 1.75rem !important; } }

.pt35 {
  padding-top: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt35 {
      padding-top: 1.75rem !important; } }

.pb35 {
  padding-bottom: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb35 {
      padding-bottom: 1.75rem !important; } }

.pl35 {
  padding-left: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl35 {
      padding-left: 1.75rem !important; } }

.pr35 {
  padding-right: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr35 {
      padding-right: 1.75rem !important; } }

.ptb35 {
  padding-top: 3.5rem !important;
  padding-bottom: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb35 {
      padding-top: 1.75rem !important;
      padding-bottom: 1.75rem !important; } }

.prl35 {
  padding-right: 3.5rem !important;
  padding-left: 3.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl35 {
      padding-right: 1.75rem !important;
      padding-left: 1.75rem !important; } }

.p40 {
  padding: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .p40 {
      padding: 2rem !important; } }

.pt40 {
  padding-top: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt40 {
      padding-top: 2rem !important; } }

.pb40 {
  padding-bottom: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb40 {
      padding-bottom: 2rem !important; } }

.pl40 {
  padding-left: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl40 {
      padding-left: 2rem !important; } }

.pr40 {
  padding-right: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr40 {
      padding-right: 2rem !important; } }

.ptb40 {
  padding-top: 4rem !important;
  padding-bottom: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb40 {
      padding-top: 2rem !important;
      padding-bottom: 2rem !important; } }

.prl40 {
  padding-right: 4rem !important;
  padding-left: 4rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl40 {
      padding-right: 2rem !important;
      padding-left: 2rem !important; } }

.p45 {
  padding: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .p45 {
      padding: 2.25rem !important; } }

.pt45 {
  padding-top: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt45 {
      padding-top: 2.25rem !important; } }

.pb45 {
  padding-bottom: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb45 {
      padding-bottom: 2.25rem !important; } }

.pl45 {
  padding-left: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl45 {
      padding-left: 2.25rem !important; } }

.pr45 {
  padding-right: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr45 {
      padding-right: 2.25rem !important; } }

.ptb45 {
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb45 {
      padding-top: 2.25rem !important;
      padding-bottom: 2.25rem !important; } }

.prl45 {
  padding-right: 4.5rem !important;
  padding-left: 4.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl45 {
      padding-right: 2.25rem !important;
      padding-left: 2.25rem !important; } }

.p50 {
  padding: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .p50 {
      padding: 2.5rem !important; } }

.pt50 {
  padding-top: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt50 {
      padding-top: 2.5rem !important; } }

.pb50 {
  padding-bottom: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb50 {
      padding-bottom: 2.5rem !important; } }

.pl50 {
  padding-left: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl50 {
      padding-left: 2.5rem !important; } }

.pr50 {
  padding-right: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr50 {
      padding-right: 2.5rem !important; } }

.ptb50 {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb50 {
      padding-top: 2.5rem !important;
      padding-bottom: 2.5rem !important; } }

.prl50 {
  padding-right: 5rem !important;
  padding-left: 5rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl50 {
      padding-right: 2.5rem !important;
      padding-left: 2.5rem !important; } }

.p55 {
  padding: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .p55 {
      padding: 2.75rem !important; } }

.pt55 {
  padding-top: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt55 {
      padding-top: 2.75rem !important; } }

.pb55 {
  padding-bottom: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb55 {
      padding-bottom: 2.75rem !important; } }

.pl55 {
  padding-left: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl55 {
      padding-left: 2.75rem !important; } }

.pr55 {
  padding-right: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr55 {
      padding-right: 2.75rem !important; } }

.ptb55 {
  padding-top: 5.5rem !important;
  padding-bottom: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb55 {
      padding-top: 2.75rem !important;
      padding-bottom: 2.75rem !important; } }

.prl55 {
  padding-right: 5.5rem !important;
  padding-left: 5.5rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl55 {
      padding-right: 2.75rem !important;
      padding-left: 2.75rem !important; } }

.p60 {
  padding: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .p60 {
      padding: 3rem !important; } }

.pt60 {
  padding-top: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .pt60 {
      padding-top: 3rem !important; } }

.pb60 {
  padding-bottom: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .pb60 {
      padding-bottom: 3rem !important; } }

.pl60 {
  padding-left: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .pl60 {
      padding-left: 3rem !important; } }

.pr60 {
  padding-right: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .pr60 {
      padding-right: 3rem !important; } }

.ptb60 {
  padding-top: 6rem !important;
  padding-bottom: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .ptb60 {
      padding-top: 3rem !important;
      padding-bottom: 3rem !important; } }

.prl60 {
  padding-right: 6rem !important;
  padding-left: 6rem !important; }
  @media screen and (max-width: 797.99px) {
    .prl60 {
      padding-right: 3rem !important;
      padding-left: 3rem !important; } }







/* ///  共通BTN  ///////////////////////　*/

.p_btn {
    text-align: center;
    margin: 1rem auto 7rem;
    max-width: 800px;
        }

.p_btn a {
    font-weight: bold;
    font-size: 2rem;
    width: 600px;
    position: relative;
    border-radius: 1rem;
  }

.p_btn::after {
    position: absolute;
    top: calc(50% - 0.6em);
    right: 25px;
    content: ">";
}





/*------------------------------------------------------------
  width調整
------------------------------------------------------------*/
.w50{width:50px;}
.w200{width:200px;}

.wi100 {width: 100%!important; }
.wi96 {width: 96%!important; }
.wi90 {width: 90%!important; }
.wi80 {width: 80%!important; }
.wi70 {width: 70%!important; }
.wi60 {width: 60%!important; }
.wi50, .width50 {width: 50%!important; }
.wi40, .width40 {width: 40%!important; }
.wi30, .width30 {width: 30%!important; }
.wi25 {width: 25%!important; }
.wi20 {width: 20%!important; }
.wi10 {width: 10%!important; }



.wi95{
  margin:0 auto;
  width:95%;
}


.maxwi1100 {max-width: 1100px!important; }
.maxwi1000 {max-width: 1000px!important; }
.maxwi900 {max-width: 900px!important; }
.maxwi800 {max-width: 800px!important; }
.maxwi700 {max-width: 700px!important; }
.maxwi650 {max-width: 650px!important; }


.h50px{height:50px;}
.h200px{height:200px;}
.h50per{height:50%;}


/*------------------------------------------------------------
  padding調整
------------------------------------------------------------　*/
.p0 {padding: 0!important; }
.p1 {padding: 1rem!important; }
.p2 {padding: 2rem!important; }
.p3 {padding: 3rem!important; }

.pt0 {padding-top: 0rem!important; }
.pt1 {padding-top: 1rem!important; }
.pt2 {padding-top: 2rem!important; }
.pt3 {padding-top: 3rem!important; }
.pt4 {padding-top: 4rem!important; }
.pt5 {padding-top: 5rem!important; }
.pt10 {padding-top: 10rem!important; }
.pt15 {padding-top: 15rem!important; }

.pb0 {padding-bottom: 0rem!important; }
.pb1 {padding-bottom: 1rem!important; }
.pb2 {padding-bottom: 2rem!important; }
.pb3 {padding-bottom: 3rem!important; }
.pb4 {padding-bottom: 4rem!important; }
.pb5 {padding-bottom: 5rem!important; }
.pb10 {padding-bottom: 10rem!important; }
.pb15 {padding-bottom: 15rem!important; }



@media screen and (max-width: 767.99px) {
.pt1 {padding-top: 0.3rem!important; }
.pt2 {padding-top: 1rem!important; }
.pt3 {padding-top: 1.5rem!important; }
.pt4 {padding-top: 2rem!important; }
.pt5 {padding-top: 2.5rem!important; }
.pt10 {padding-top: 5rem!important; }
.pt15 {padding-top: 7rem!important; }

.pb1 {padding-bottom: 0.3rem!important; }
.pb2 {padding-bottom: 1rem!important; }
.pb3 {padding-bottom: 1.5rem!important; }
.pb4 {padding-bottom: 2rem!important; }
.pb5 {padding-bottom: 2.5rem!important; }
.pb10 {padding-bottom: 5rem!important; }
.pb15 {padding-bottom: 7rem!important; }
}


/* foot padding用　*/
.pb80px {
  padding-bottom: 5em!important; }
@media screen and (max-width: 959.99px) {.pb80px {padding-bottom: 7em!important; }}
@media screen and (max-width: 767.99px) {.pb80px {padding-bottom: 3em!important; }}


.ptb0 {
  padding-top: 0!important;
  padding-bottom: 0!important;}


.ptb3 { padding-top: 3rem!important;padding-bottom: 3rem!important; }
@media screen and (max-width: 767.99px) {
.ptb3 {padding-top: 1.5rem!important;padding-bottom: 1.5rem!important; }
}

.ptb5 { padding-top: 5rem!important;padding-bottom: 5rem!important; }
@media screen and (max-width: 767.99px) {
.ptb5 {padding-top: 2rem!important;padding-bottom: 2rem!important; }
}

.prl1 {padding-right: 1%!important;padding-left: 1%!important; }
.prl2 {padding-right: 2%!important;padding-left: 2%!important; }
.prl3 {padding-right: 3%!important;padding-left: 3%!important; }
.prl4 {padding-right: 4%!important;padding-left: 4%!important; }





/*------------------------------------------------------------
  margin調整
---------------------------------------------------------- --*/
.m0 {margin: 0!important; }
.m1 {margin: 1rem!important; }
.m2 {margin: 2rem!important; }
.m3 {margin: 3rem!important; }

.mt0 {margin-top: 0!important; }
.mt1 {margin-top: 1rem!important; }
.mt2 {margin-top: 2rem!important; }
.mt3 {margin-top: 3rem!important; }
.mt4 {margin-top: 4rem!important; }
.mt5 {margin-top: 5rem!important; }
.mt6 {margin-top: 6rem!important; }
.mt7 {margin-top: 7rem!important; }

.mb0 {margin-bottom: 0rem!important; }
.mb1 {margin-bottom: 1rem!important; }
.mb2 {margin-bottom: 2rem!important; }
.mb3 {margin-bottom: 3rem!important; }
.mb4 {margin-bottom: 4rem!important; }
.mb5 {margin-bottom: 5rem!important; }
.mb6 {margin-bottom: 6rem!important; }
.mb7 {margin-bottom: 7rem!important; }


@media screen and (max-width: 767.99px) {
.mt0 {margin-top: 0!important; }
.mt1 {margin-top: 0.3rem!important; }
.mt2 {margin-top: 1rem!important; }
.mt3 {margin-top: 1.5rem!important; }
.mt4 {margin-top: 2rem!important; }
.mt5 {margin-top: 2.5rem!important; }
.mt6 {margin-top: 3rem!important; }
.mt7 {margin-top: 3.5rem!important; }

.mb1 {margin-bottom: 0.3rem!important; }
.mb2 {margin-bottom: 1rem!important; }
.mb3 {margin-bottom: 1.5rem!important; }
.mb4 {margin-bottom: 2rem!important; }
.mb5 {margin-bottom: 2.5rem!important; }
.mb6 {margin-bottom: 3rem!important; }
.mb7 {margin-bottom: 3.5rem!important; }
}


.mtb1 { margin-top: 1em!important;margin-bottom: 1em!important; }
.mtb2 { margin-top: 2em!important;margin-bottom: 2em!important; }
.mtb3 { margin-top: 3em!important;margin-bottom: 3em!important; }
.mtb4 { margin-top: 4em!important;margin-bottom: 4em!important; }
.mtb5 { margin-top: 5em!important;margin-bottom: 5em!important; }
.mtb6 { margin-top: 6em!important;margin-bottom: 6em!important; }
.mtb7 { margin-top: 7em!important;margin-bottom: 7em!important; }

@media screen and (max-width: 767.99px) {
.mtb1 { margin-top: .5em!important;margin-bottom: .5em!important; }
.mtb2 { margin-top: 1em!important;margin-bottom: 1em!important; }
.mtb3 { margin-top: 1.5em!important;margin-bottom: 1.5em!important; }
.mtb4 { margin-top: 2em!important;margin-bottom: 2em!important; }
.mtb5 { margin-top: 2.5rem!important;margin-bottom: 2.5em!important; }
.mtb6 { margin-top: 3em!important;margin-bottom: 3em!important; }
.mtb7 { margin-top: 3.5em!important;margin-bottom: 3.5em!important; }
}




.mrl1 {margin-right: 1%!important;margin-left: 1%!important; }
.mrl2 {margin-right: 2%!important;margin-left: 2%!important; }
.mrl3 {margin-right: 3%!important;margin-left: 3%!important; }
.mrl4,.mrl-4 {margin-right: 4%!important;margin-left: 4%!important; }
.mrl5,.mrl5p {margin-right: 5%!important;margin-left: 5%!important; }
.mrl10,.mrl10p  {margin-right: 10%!important;margin-left: 10%!important; }
.mrl15 {margin-right: 15%!important;margin-left: 15%!important; }

@media screen and (max-width: 767.99px) {
.mrl1 {margin-right: 0.5%!important;margin-left: 0.5%!important; }
.mrl2 {margin-right: 1%!important;margin-left: 1%!important; }
.mrl3 {margin-right: 1.5%!important;margin-left: 1.5%!important; }
.mrl4 {margin-right: 2%!important;margin-left: 2%!important; }
.mrl5,.mrl5p {margin-right: 2.5%!important;margin-left: 2.5%!important; }
.mrl10,.mrl10p  {margin-right: 3%!important;margin-left: 3%!important; }
.mrl15 {margin-right: 5%!important;margin-left: 5%!important; }

}

.mrlauto{margin-right: auto!important; margin-left: auto!important;}
.mtb2em { margin: 2em auto;}


/*------------------------------------------------------------
  font調整
------------------------------------------------------------*/

/* フォントサイズ */
.f-small{font-size: small !important; }
.f-smaller{font-size: smaller !important; }
.f-large{font-size: large !important; }

.fzb1_txt {font-size: 105% !important; }
.fzb2_txt {font-size: 110% !important; }
.fzb3_txt {font-size: 140% !important; }
.fzb4_txt {font-size: 150% !important; }
.fzs1_txt {font-size: 95% !important; }
.fzs2_txt {font-size: 80% !important; }

.fon100 {font-size: 100% !important; }
.fon105 {font-size: 105% !important; }
.fon110 {font-size: 110% !important; }
.fon120 {font-size: 120% !important; }
.fon130 {font-size: 130% !important; }
.fon140 {font-size: 140% !important; }
.fon150 {font-size: 150% !important; }
.fon160 {font-size: 160% !important; }
.fon95 {font-size: 95% !important; }
.f0n80 {font-size: 80% !important; }
.f0n70 {font-size: 70% !important; }
.f0n60 {font-size: 60% !important; }

@media screen and (max-width: 767.99px) {.fon150 {font-size: 80% !important;}}
@media screen and (max-width: 375.99px) {.fon150 {font-size: 75% !important;}}


.ssss-text{font-size:50% !important; }
.sss-text{font-size:60% !important; }
.ss-text{font-size:75% !important; }
.s-text{font-size:85% !important; }
.m-text{font-size:92% !important; }
.l-text{font-size:108% !important; }
.ll-text{font-size:115% !important; }
.lll-text{font-size:130% !important; }
.llll-text{font-size:150% !important; }
.lllll-text{font-size:170% !important; }
.llllll-text{font-size:200% !important; }

.font18rem{font-size:1.8rem;}
span.cate {font-size: smaller;}


/* 基本文字 */
.txt {
    font-size: 16px;
    line-height: 1.5;
}


/* 太文字 */
.strong_txt, .t_bold {font-weight: bold!important; }
.strong_stxt {font-weight: 500; }
.strong_0txt {font-weight: normal; }


/* インデント */
.indent-1 {
    padding-left: 1em;
    text-indent: -1em;
}


/* インデント ※ */
.coution,
.indent-kome {
  padding-left: 1em;
  text-indent: -1em;}
.coution::before,
.indent-kome::before {
  content: "※";
}


/* ※ */
.s-kome{
    margin: 0;
    line-height: 1.5;
    font-size: 80%;}
@media screen and (max-width: 767.99px) {
.s-kome{
  font-size: 90%;
}}


/* インデント ★ */
.indent-star {
  padding-left: 1.25em;
  text-indent: -1em;}
.indent-star::before {
  content: "\02605";
  font-size: 1em;
  color:#ffc107;
animation: tenmetu 3s ease-in-out normal infinite;
}

@keyframes tenmetu {
0% { transform: opacity: 0; color:#fff;}
50% { transform: opacity: 1; color:#ffc107;}
100% { transform: opacity: 1; color:#fff;}

}

/* 字詰め */
.f-tyosei {
  font-feature-settings: "palt";
}


/* 字あけ */
.l-space{  letter-spacing: 0.2rem;}

/* 明朝 */
.f-tmincho {font-family: serif;}

/* NOTO明朝 */
.ff_Noto {font-family: 'Noto Serif JP', serif;}

/* normal */
@font-face {
  font-family: "Noto Serif JP", serif;";
  src: url("../NotoSerifJP-Regular.otf");
  font-weight: normal;
  font-style: normal;
}

/* semibold  */
/*@font-face {
  font-family: "Noto Serif JP", serif;";
  src: url("../NotoSerifJP-SemiBold.otf");
    font-weight: bold;
  font-style: normal;
}
*/

/* bold  */
/*@font-face {
  font-family: "font-family: 'Noto Serif JP', serif;";
  src: url("../NotoSerifJP-Bold.otf") format("truetype");
    font-weight: bold;
  font-style: normal;
}*/



/* 指マーク */
.handpointer{cursor:pointer}
.handpointer:hover {opacity:0.7}


/* ￥円　￥税込 */
.priceen,
.pricezei {
  width: auto;
      font-size: 130%;
      font-weight: bold;
      font-feature-settings: "palt";
      text-align: center;
      font-family: serif;
      display: inline-block;
      position: relative;
      align-items: baseline;}
@media screen and (max-width: 767.99px) {
.pricecode {
  font-size: 180%;
}}

.priceen::before,
.pricezei::before {
  content: "￥";
  position: absolute;
  bottom: 0%;
  margin-left: -1em;
  display: contents;
  font-size: 85%;
  /* left: calc(50% - 40px); */
}

.priceen::after {
  content: "円";
  position: absolute;
  bottom: 0%;
  margin-right: -1em;
  font-size: 80%;
}

.pricezei::after {
  content: "(税込)";
  position: absolute;
  bottom: 0%;
  display:contents;
  margin-right: -1em;
  font-size: 60%;
}



/*------------------------------------------------------------
  BACKGROUND NO
------------------------------------------------------------*/
.back-0{ background: none!important; }

/*------------------------------------------------------------
  影
------------------------------------------------------------*/
.filt50bk { filter: drop-shadow(0.5px 1px 0.5px #55555550);}
.filt80bk { filter: drop-shadow(1px 1px 0px #55555580);}
.filt50wh { filter: drop-shadow(0.5px 1px 0.5px #ffffff50);}
.filt100wh { filter: drop-shadow(1px 1px 0 #fff);}

/* 白 影 薄め　*/
.white-shadow{filter: drop-shadow(1px 2px 2px #ffffff70);}

/* 黒 影 薄め　*/
.black-shadow{filter: drop-shadow(3px 2px 2px #00000015);}

/* 紫 影 薄め　*/
.purple-shadow{filter: drop-shadow(4px 2px 2px #8386c010);}


/*------------------------------------------------------------
  位置
------------------------------------------------------------*/
.f-left {float: left;}
.f-right {float: right;}
.f-initial {float: initial;}
.f-unset {float: unset;}



/*------------------------------------------------------------
  POSITION
------------------------------------------------------------*/
.posi_re {position: relative; }
.posi_ab {position: absolute; }
.posi_fi {position: fixed; }
.posi_sta {position: static; }
.posi_sti {position: sticky; }
.posi_sti {position: sticky; }
.posi_inh {position: inherit; }
.posi_ini {position: initial; }
.posi_re {position: revert; }
.posi_un {position: unset; }



/*------------------------------------------------------------
  FLEX
------------------------------------------------------------*/
.flexkihon{display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: flex-start;
  }


.disc{list-style:disc;}
.flex-one{display:flex;}
.flex{display:flex;flex-wrap: wrap;}
.justify_center {justify-content: center;}
.justify_between{justify-content: space-between;}
.justify_around {justify-content: space-around;}
.align_start   {align-items: flex-start;}
.align_end     {align-items: flex-end;}
.align_center  {align-items: center;}
.align_baseline{align-items: baseline;}


.t-flex {
  text-align:left;
  display: flex;
  flex-wrap: wrap;
}

/*------------------------------------------------------------
  向き
------------------------------------------------------------*/
.t-center,.course-c {text-align: center!important;}
.t-right,.course-r {text-align: right!important;}
.t-left,.course-l {text-align:left!important;}
.t-just,.course-j{text-align: justify!important;}


.v-top{vertical-align: top!important;}
.v-mid{vertical-align: middle!important;}
.v-bottom{vertical-align: bottom!important;}


.flip-horizontal {transform: scale(-1, 1);} /* 左右反転 */
.flip-vertical {transform: scale(1, -1);} /* 上下反転 */


/*------------------------------------------------------------
  Z-INDEX
------------------------------------------------------------*/
.index-1{z-index: -1;}
.index1{z-index: 1;}
.index10{z-index: 10;}
.index100{z-index: 100;}
.index1000{z-index: 1000;}



/*------------------------------------------------------------
  ICON 資料IMG
------------------------------------------------------------*/
.icscli {
  line-height: 1.4;
  list-style-image: linear-gradient(300deg, #33366a, #8E8BC2);
  list-style-type: square;
  padding: 0 0 0 3px;
  width: 96%;
  margin: 0.5rem 0 0 5%;
  font-size: medium;
   }


.icli {
    background: url(../../asset/img/emergency/ic_susume.png) left 0px top 3px no-repeat;
    background-size: 15px auto;
    padding-left: 22px;
    width: 96%;
    margin-bottom: 1rem;
    margin-left: 2%;
        font-size: medium;
   }


/*------------------------------------------------------------
  COLOR
------------------------------------------------------------*/
.red_txt {color: #b31a2e!important;}
.pink_txt,.txt_red {color: #e55d8a!important;}
.white_txt {color: #ffffff!important;}
.green_txt {color: #206229!important;}
.green_txt2 {color: #4ca736!important;}
.yellow-green_txt {color: #7ac543!important;}
.sky_txt {color: #118bbb!important;}
.purple_txt {color: #8E8BC2!important;}
.orange_txt {color: #ff8f1e!important;}
.coral, .coral_txt{color:coral!important;}
.yello_txt {color:#ffff00!important;}
.navy_txt {color:#33366a!important;}
.gree_txt {color:#333!important;}
.gray_txt {color: #e4e4e4!important;}
.gray_txt2 {color: #655e51!important;}
.dark-gray_txt {colord: #333!important;}


/* *******BG color ******** */
.bg_beige { background: #F4f4f4; }
.col-white{background: #fff!important;}
.col-purple{background: #8E8BC2!important;}
.col-purple2{background: #cbcce5!important;}
.col-sky{background: #118bbb;}
.col-sky2{background: #7c9edd!important;}
.col-yr{background: #F3F3E9!important;}
.col-gr2{background: #f4f4f4!important;}
.col-gr3{background: #A1C5AB!important;}
.col-gr4{background: #cfcfcf!important;}
.col-blue{background: #00498f!important;}
.col-yellow{background: #ffff00!important;}
.col-yellow2{background: #fffbec!important;}
.col-beige{background: #f5f5f5!important;}
.col-pink{background: #e55d8a!important;}
.col-green{background: #4ca736!important;}
.col-red{background: #b31a2e!important;}


/* *******ohnoya color ******** */
.onoya-green_txt{color: #5ab620!important;}
.onoya-g_txt{color: #6FBA2C!important;}
.onoya-p_txt{color: #8E8BC2!important;}
.onoya-o_txt{color: #F8B500!important;}
.col-onoya-green{background: #5ab620!important;}
.col-onoya-g{background: #6FBA2C!important;}
.col-onoya-p{background: #8E8BC2!important;}
.col-onoya-o{background: #F8B500!important;}


.col-none{background: none!important;}


.backcol-purple{background:rgba(131,134,192,0.1);} /*#8386c0*/
.backcol-pink{background:rgba(229,93,138,0.1);}  /*#e55d8a*/
.backcol-yellow{background:rgba(255,255,0,0.2);} /*#ffff00*/



/*------------------------------------------------------------
  マーカー
------------------------------------------------------------*/

/* 薄黄マーカー　*/
    .marker {
      background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(0%, #fdf3d1));
      background: -webkit-linear-gradient(transparent 60%, #fdf3d1 0%);
      background: -o-linear-gradient(transparent 60%, #fdf3d1 0%);
      background: linear-gradient(transparent 60%, #fdf3d1 0%); }


  @media screen and (max-width: 767.98px) {
    .marker {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, transparent), color-stop(0%, #fdf3d1));
    background: -webkit-linear-gradient(transparent 20%, #fdf3d1 0%);
    background: -o-linear-gradient(transparent 20%, #fdf3d1 0%);
    background: linear-gradient(transparent 20%, #fdf3d1 );
} }


/* グリーンマーカー　*/
/*.green_line {background:linear-gradient(transparent 60%, #e2f5cc 0%) ;}*/
.green_line,
.green_line2 {background:linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,0,0) 15%,rgba(255,255,0,0) 60%,rgba(226,245,204,0.8) 85%,rgba(255,255,255,0) 100%);
}

/* イエローマーカー　*/
.yello_line {background:linear-gradient(transparent 60%, #ffff00 0%) ;}

/* ピンクーマーカー　*/
.pink_line {background:linear-gradient(transparent 60%, #ffdaea 0%) ;}

/* ホワイトーマーカー　*/
.white_line {background:linear-gradient(transparent 60%, #ffffff 0%) ;}

/* パープルーマーカー　*/
.purple_line {
    background: linear-gradient(transparent 70%, #8386c020 0%);
}





/*------------------------------------------------------------
  ボーダー
------------------------------------------------------------*/

.radius1,.border-r1{border-radius:1rem;}
.radius10{border-radius:10px;}

.purple_frame1{border:2px solid #8386c060!important;}
.gold_frame1{border:1px solid #ffd700!important;}
.forestgreen_frame1{border:1px solid #228b22!important;}
.lightskyblue_frame1{border:1px solid #87cefa!important;}
.dodgerblue_frame1{border:1px solid #1e90ff!important;}
.orangered_frame1{border:1px solid #ff4500!important;}
.orange_frame1{border:1px solid #ffa500!important;}
.mediumorchid_frame1{border:1px solid #ba55d3!important;}
.pink_frame1{border:1px solid #ee86a5!important;}
.red_frame2{border:2px solid #b31a2e!important;}
.purple_frame2{border:2px solid #8386c060!important;}
.gray_frame1{border:1px solid #cfcfcfcf!important;}



.border0 { border: 0!important;} /* ボーダー無し */


.border_line,
.border_linetxt { /* 基本ボーダー枠 TXT */
  padding: 20px;
  border: 2px solid #f2f2f2;
  margin-bottom: 20px; }



.border_lineimg { /* 基本ボーダー枠 IMG */
  padding: 0;
  margin: 1em auto 2em;
  border:1px solid #cfcfcfcf!important;
  filter: drop-shadow(1px 5px 3px #00000015);
  transition:.6s;}
.border_lineimg img {
  width:100%;
}
.border_lineimg:hover {
  opacity:0.9;
}




/* ///  dotボーダー  ///////////////////////　*/
.border_dot {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-bottom: 1px dotted #00498f;/*#ACA6B9 00498f d8b94d*/
}



/* ///   金のボーダー　///////////////////////　*/
.gold-boder{
    border-bottom: 3px solid #d4b54b;
    border-image: linear-gradient(to right, #f3e385 0%, #d4b54b 50%,#f3e385 100% );
    border-image-slice: 1;
    border-collapse: collapse; /* 隙間埋め */
    filter: drop-shadow(0px 1px 1px rgba(0,0,0,0.1));
}


/* ///   大きなdotボーダー　　//////////////　*/
.big-dot{
    margin: 1rem 3%;
    /* float: left; */
    height: 1rem;
    background-image: radial-gradient(#ccc 20%, transparent 13%);
    background-size: 14px 14px;
    background-repeat: repeat-x;
    width: 95%;
    padding: 0;
    overflow: hidden;
}


/* ドット */
.border_dot {
    padding-bottom: 3px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-bottom: 1px dotted #ACA6B9;
}


/* 上下 */
.border_tb {
  padding: 0.6rem 1vw 0.3rem;
  border: solid #c01625;
  border-width: 1px 0px;
}



/* 大きなドットの背景　*/
.big-dot2{
  background-image:
    radial-gradient(#ccc 20%, transparent 20%);
  background-size: 16px 16px;
}



/* 両サイドにボーダー　*/
.side-shadow{
    position: relative;
    margin: 0 auto;
    width: 80%;
    height: 100px;
    background-color: #fff;
}

.side-shadow::before,
.side-shadow::after{
    content:"";
    position: absolute;
    z-index: -1;
    bottom: 10px;
    display: block;
    width: 50%;
    height: 50%;
    box-shadow: 0 10px 5px rgba(0,0,0,.3);
}

.side-shadow::before{
    left: 5px;
    transform:rotate(-3deg);
}

.side-shadow::after{
    right: 5px;
    transform:rotate(3deg);
}


/*------------------------------------------------------------
  透過
------------------------------------------------------------*/
/*白にぼかす　*/
.bg-h {
  /*background-image: url(---.jpg);*/
  background-color: rgba(255,255,255,0.5);
  background-blend-mode: lighten;
}



.bg-b {
  /*background-image: url(---.jpg);*/
  background-color: rgba(0,0,0,0.5);
  background-blend-mode: darken;
}


/*------------------------------------------------------------
  HR
------------------------------------------------------------*/
hr.stripe{
    background: repeating-linear-gradient(45deg, #f9d7f300, #f9d7f300 5px, white 5px, white 10px);
    height: 5px;
    padding: 0.4rem 0;
    margin: 0.5rem 0;
    border: none;
}


/* ///  HR CUT LINE /////////　*/
.hasami {
  border-top: 1px solid #ccc;
  height: 1em;
  text-align: center;
  overflow: visible;
  margin: 1rem auto 1.5rem;
}
.hasami::after {
  content: "\002702";
  background: #fff;
  color: #ccc;
  display: inline-block;
  height: 1em;
  line-height: 1em;
  position: relative;
  top: -0.75em;
  padding: 0 1em;
}


/*------------------------------------------------------------
  スクロールバー
------------------------------------------------------------*/

.scroll_bar{
   background-color: #fff;
   overflow-y: scroll;
   width: 100%;
   height: 80vh;
}
.scroll_bar::-webkit-scrollbar{
   width: 14px;}
@media screen and (max-width: 767.99px) {
.scroll_bar::-webkit-scrollbar{
    width: 20px;
}}

.scroll_bar::-webkit-scrollbar-track{
   background-color: #e5001210;
}
.scroll_bar::-webkit-scrollbar-thumb{
    background-color: #E91E63;
}



/*------------------------------------------------------------
  閉じる
------------------------------------------------------------*/

.close_box{
  margin-top: 0.5rem;
  width: 100%;
  height: auto;
  text-align: center;
}

.popup-close {
cursor: pointer;
  right: 0;
}

.close_box a{
    transition: 2s ease;
}

.close_box a.close_btn{
  font-weight: normal;
  color: #fff !important;
  text-align: center;
  display: block;
  font-size: smaller;
  text-decoration: none;
}



/*------------------------------------------------------------
  ARROW
------------------------------------------------------------*/
  a.has_arrow {
    position: relative;
    padding: 0 0 0 1.5rem;
    display: inline-block; }
    a.has_arrow:before {
      display: block;
      content: "";
      width: 0;
      height: 0;
      position: absolute;
      top: 6px;
      left: 0;
      border: 7px solid transparent;
      border-left-color: #00498f; }
    @media screen and (max-width: 767.98px) {
      a.has_arrow {
        position: relative;
        padding-left: 1rem; }
        a.has_arrow:before {
          display: block;
          content: "";
          width: 0;
          height: 0;
          position: absolute;
          top: 6px;
          left: 0;
          border: 6px solid transparent;
          border-left-color: #00498f; }
        }


/* ///  三角  ///////////////////////　*/

/* 　右　中　配置 */
.triangle a:hover {position: relative;}
.triangle a:hover::after {
    position: absolute;
    content: "▼";
    color: #fff;
    background: #e55d8a;
    top: calc(50% - 1.2em);
    right: 15px;
    border-radius: 50%;
    width: 2rem;
    text-align: center;
    font-size: 90%;
    font-weight: bold;
    transform: rotate(-90deg);
    line-height: initial;
}


.support-triangle {position: relative;}
.support-triangle::after {
    content: "";
    position: absolute;
    border-style: solid;
    border-width: 4rem 20vw 0px 20vw;
    border-color: #f5f5f5 transparent transparent transparent;
    bottom: -3rem;
    margin: 0 auto;
    width: 0;
    height: 0;
    left: 0;
    right: 0;
    z-index: 500;
}




/* 　右 下　配置 */
.triangle-under a:hover {
    position: relative;
}

.triangle-under a:hover::after {
    position: absolute;
    content: "▼";
    color: #fff;
    background: #e55d8a;
    bottom: calc(33% - 1em);
    right: 10px;
    border-radius: 50%;
    width: 2rem;
    text-align: center;
    font-size: 90%;
    font-weight: bold;
    transform: rotate(-90deg);
    line-height: initial;
}




.triangle3{ /* 下 小 */
    position: relative;}
.triangle3::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-top: 30px solid #EEE;
  border-right: 5vw solid transparent;
  border-left: 5vw solid transparent;
  /* transform: rotate(-90deg); */
}


.triangle4{ /* 下 大 */
    position: relative;}
.triangle4::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
border-top: 4rem solid #33366a50;
border-right: 6vw solid transparent;
border-left: 6vw solid transparent;
  /* transform: rotate(-90deg); */
}


/* 　単品　中　配置 */
.sankaku {
    margin: 0 auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 39.5px 0 39.5px;
    border-color: #8386c0 transparent transparent transparent;
}

/* 　単品　中　配置　大 */
.sankaku-large {
    margin: 1rem auto 3rem;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 36px 80px 0 80px;
    border-color: #8588c270 transparent transparent transparent;
}




/* 　単品　右　配置　 */
.triangle-r a:hover {position: relative;}
.triangle-r a:hover::after {
  content: "";
  border-left: 14px solid #f6f6f6;
  border-top: 3vh solid transparent;
  border-bottom: 3vh solid transparent;
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: 49%;
}





/*------------------------------------------------------------
  anime
------------------------------------------------------------*/

/* ///  横回転 /////////　*/

.rotateX {
  color:#FFF;
  -moz-transition: -moz-transform 2s linear;
  -webkit-transition: -webkit-transform 2s linear;
  -o-transition: -o-transform 2s linear;
  -ms-transition: -ms-transform 2s linear; 
  transition: transform 2s linear; 
}
.rotateX:hover {
  -moz-transform: rotateY(360deg);
  -webkit-transform: rotateY(360deg);
  -o-transform: rotateY(360deg);
  -ms-transform: rotateY(360deg);
  transform: rotateY(360deg);
}


/* ///  ふわ2 /////////　*/

.huwa2  a img {
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.huwa2 a:hover img {opacity: 0.6;filter: alpha(opacity=60);}




/* ///  ふわふわ /////////　*/

.fuwafuwa {
  -webkit-animation-name:fuwafuwa; /*  */
  -webkit-animation-duration:5s;
  -webkit-animation-iteration-count:infinite;
  /*-webkit-animation-direction:alternate;*/
  -webkit-animation-timing-function:ease;

  -moz-animation-name:fuwafuwa;
  -moz-animation-duration:5s;
  -moz-animation-iteration-count:infinite;
  /*-moz-animation-direction:alternate;*/
  -moz-animation-timing-function:ease;
}

@-webkit-keyframes fuwafuwa {
  0% {-webkit-transform:translate(0, 0);}
  50% {-webkit-transform:translate(0, -8px);}
  100% {-webkit-transform:translate(0, 0);}
}

@-moz-keyframes fuwafuwa {
  0% {-moz-transform:translate(0, 0);}
  50% {-moz-transform:translate(0, -8px);}
  100% {-moz-transform:translate(0, 0);}
}



/* ///  波紋 /////////　*/
.btnripple{
  position: relative;
  margin:0 auto;
  outline: none;
}

.btnripple:hover::before {
    content: '';
    position: absolute;
    left:50%;
    top:0;
    /*波形の形状*/
    border: 1px solid #333;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    opacity:1;
    animation:1s circleanime forwards;
}

@keyframes circleanime{
  0%{transform: scale(0);}
  100%{ transform:scale(2); opacity: 0;}
}



/* /// shine  /////////　*/
.shine { position: relative;}

.shine a::before{
  position: absolute;
  top: 0;
  left: -300%;
  z-index: 2;
  display: block;
  content: '';
  width: 50%;
  height: 100%;
  background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
  background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
  -webkit-transform: skewX(-25deg);
  transform: skewX(-25deg);
}

.shine a:hover::before {
  -webkit-animation: shine .75s;
  animation: shine .75s;
}

@-webkit-keyframes shine {100% { left: 125%;}}
@keyframes shine {100% {left: 125%;}}



/* /// shine2  /////////　*/
/*
<div class="kiran-img">
<img src="/images/sample.png" alt="キラーン">
<div class="kiran"></div>
</div>
 */

.kiran-img{
/*width:100%;*/
position :relative;
overflow :hidden;
}
.kiran {
height:100%;
width:30px;
position:absolute;
top:-500px;
left:0;
background-color: #fff;
opacity:0;
transform: rotate(45deg);
animation: reflection 3s ease-in-out normal infinite;
}
@keyframes reflection {
0% { transform: scale(0) rotate(45deg); opacity: 0; }
22% { transform: scale(0) rotate(45deg); opacity: 0; }
23% { transform: scale(2) rotate(45deg); opacity: 0.7; }
100% { transform: scale(50) rotate(45deg); opacity: 0; }
}



/* /// RIGHT  /////////　*/
.light-box{
  position: relative; /*上階層にrelative */
}

.light {
  position: absolute;
  width: 48px;
  height: 48px;
  border-radius: 100%;
  overflow: hidden;
}
.light:before {
  content:'';
  display: block;
  position: absolute;
  width: 2px;
  height: 80px;
  top: -75%;
  left: 0;
  transform: rotate(45deg);
  background: rgba(255,255,255,0.5);
  animation: light 7s infinite;
}

@keyframes light {
  0% {opacity: 0; }
  34% {opacity: 0;transform: rotate(15deg);}
  40% {opacity: 0.6;transform: rotate(620deg);}
  48%,100% {opacity: 0;transform: rotate(635deg);}
}



/* グロー */
.glow {
  position: absolute;
  top: calc(50% - 20px);
  left: calc(50% - 20px);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow:
    0 0 60px 30px #fff,
    0 0 100px 60px #f0f,
    0 0 140px 90px #0ff;
}





/* /// border shine  /////////　*/
.border-shine{
background: #f0de94;
    animation: blinkBorder 1.4s ease infinite alternate;
    }
    @keyframes blinkBorder {
  0% { border: 5px solid #f7dc6f ;}
  100% { border: 5px solid #f9edbb ;}
}
.border-shine img{
width: 99.6%;
}

/* ///  上からフェードイン  animation   /////////　*/
#animation {
margin: 50px 0;
font-size: 40px;
font-weight: bold;
color: #e55d8a;
text-align: center;
}
  @media screen and (max-width: 767.98px) {
    #animation  {
      margin: 1rem 0 2rem;}
       }


/* ///  上からフェードダウン fadeInDown   /////////　*/
.fadeInDown {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInDown;
 animation-name: fadeInDown;
 visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}




/* ///  上からフェードイン fadeIn  /////////　*/
.fadein {
    margin: 0 auto 0rem;
    padding: 0;
    font-family: serif;
    animation: fadeIn 6s ease 1s 1 normal;
    overflow: hidden;
    line-height: 1.8;
    }

    @keyframes fadeIn { /*animation-nameで設定した値を書く*/
        0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
        100% {opacity: 1} /*アニメーション終了時は不透明度100%*/
    }



/* ///  ふわっとゆっくり現れて繰り返す  /////////　*/

.huwa1 {
    padding: 1rem;
    text-align: center;
    font-size: 140%;
    line-height: 1.4;
    font-family: serif;
    font-feature-settings: "palt";
    animation: fade-in 10s 8s infinite;
}

@keyframes fade-in {
  0% {opacity: 0; /*transform: translateY(30px);*/}
  80% {opacity: 1; }
  100% {opacity: 0; }
}





/* ///  hover 拡大  /////////　*/
.hoverBox{transition-duration: 0.3s;}
.hoverBox:hover{
  transform: scale(1.2);
  transition-duration: 0.3s;
}


/* ///  hover 拡大2  /////////　*/
.hoverBox2{animation: bigger2 4s ease;}
.hoverBox2:hover{transition-duration: 0.3s;}

@keyframes bigger2 {
  0% {opacity: 0; }
  60% {opacity: 1;transform: scale(1);transform: rotate(620deg);}
  100% {opacity: 0;transform: scale(1.2);transform: rotate(635deg);}
}



/* ///  ぽよぽよ  /////////　*/
.poyopoyo {
  animation: poyopoyo 2s ease-out infinite;
  opacity: 1;
}
@keyframes poyopoyo {
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.95);
  }
}




/* ///  色変化  /////////　*/
.changecolor{
    font-family: serif;
    animation: changecolor1 16s infinite; 
}

@keyframes changecolor1 {
  0% {opacity: 1; color: #e55d8a;scale(1.0);}
  50% {opacity: 1; color: #8386c0;scale(1.0);}
  100% {opacity: 1;color: #e55d8a;scale(1.15);}
}