@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Yuji+Syuku&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Anton&display=swap");
:root {
  /* 色の指定 */
  /*　- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  --col--main-01: #990013;
  --col--main-02: #c30d23;
  --col--main-03: #3a0d11;
  --col--acc-01: #ffcc00;
  --col--base-01: #fff;
  --col--txt-01: #fff;
  --col--txt-02: #1d1d1d;
  --col--line: #06c755;
  /* フォントの指定 */
  /*　- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  --fot--Noto-Serif: "Noto Serif JP", serif;
  --fot--Noto-Sans: "Noto Sans JP", sans-serif;
  --fot--Meiryo: "メイリオ", "Meiryo", "Noto Sans JP", sans-serif;
  --fot--Yu-Go: "YU Gothic UI" ,"游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Noto Sans JP", sans-serif;
  --fot--Yu-Min: "游明朝体", "Yu Mincho", YuMincho, "Noto Serif JP", serif;
  /*　Google font　*/
  --fot--Zen-Kaku-Goth: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  --fot--yuji-syuku: "Yuji Syuku", "Noto Sans JP", sans-serif;
  --fot--anton: "Anton", sans-serif;
  /*　font-size */
  /*　- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  --font-size-12: 12px;
  --font-size-13: 13px;
  --font-size-14: 14px;
  --font-size-15: 15px;
  --font-size-16: 16px;
  --font-size-17: 17px;
  --font-size-18: 18px;
  --font-size-19: 19px;
  --font-size-18: 18px;
  --font-size-19: 19px;
  --font-size-20: 20px;
  --font-size-21: 21px;
  --font-size-22: 22px;
  --font-size-23: 23px;
  --font-size-24: 24px;
  --font-size-25: 25px;
  --font-size-26: 26px;
  --font-size-27: 27px;
  --font-size-28: 28px;
  --font-size-29: 29px;
  --font-size-30: 30px;
  --font-size-31: 31px;
  --font-size-32: 32px;
  --font-size-33: 33px;
  --font-size-34: 34px;
  --font-size-35: 35px;
  --font-size-36: 36px;
  --font-size-37: 37px;
  --font-size-38: 38px;
  --font-size-39: 39px;
  --font-size-40: 40px;
  --font-size-41: 41px;
  --font-size-42: 42px;
  --font-size-43: 43px;
  --font-size-44: 44px;
  --font-size-45: 45px;
  --font-size-46: 46px;
  --font-size-47: 47px;
  --font-size-48: 48px;
  --font-size-49: 49px;
  --font-size-50: 50px;
  --font-size-51: 51px;
  --font-size-52: 52px;
  --font-size-53: 53px;
  --font-size-54: 54px;
  --font-size-55: 55px;
  --font-size-56: 56px;
  --font-size-57: 57px;
  --font-size-58: 58px;
  --font-size-59: 59px;
  --font-size-60: 60px;
  /*　margin */
  /*　- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  --margin-10: 10px;
  --margin-15: 15px;
  --margin-20: 20px;
  --margin-25: 25px;
  --margin-30: 30px;
  --margin-35: 35px;
  --margin-40: 40px;
  --margin-45: 45px;
  --margin-50: 50px;
  --margin-55: 55px;
  --margin-60: 60px;
  --margin-65: 65px;
  --margin-70: 70px;
  --margin-75: 75px;
  --margin-80: 80px;
  --margin-85: 85px;
  --margin-90: 90px;
  --margin-95: 95px;
  --margin-100: 100px;
}
@media screen and (max-width: 767px) {
  :root {
    --font-size-12: 3.2vw;
    --font-size-13: 3.5vw;
    --font-size-14: 3.8vw;
    --font-size-15: 4vw;
    --font-size-16: 4vw;
    --font-size-17: 4vw;
    --font-size-18: 4.2vw;
    --font-size-19: 4.2vw;
    --font-size-18: 4.2vw;
    --font-size-19: 4.2vw;
    --font-size-20: 4.4vw;
    --font-size-21: 4.4vw;
    --font-size-22: 4.6vw;
    --font-size-23: 5vw;
    --font-size-24: 5vw;
    --font-size-25: 5.2vw;
    --font-size-26: 5.4vw;
    --font-size-27: 5.6vw;
    --font-size-28: 6vw;
    --font-size-29: 6vw;
    --font-size-30: 6vw;
    --font-size-31: 6vw;
    --font-size-32: 6vw;
    --font-size-33: 6.4vw;
    --font-size-34: 6.4vw;
    --font-size-35: 6.4vw;
    --font-size-31: 6.6vw;
    --font-size-32: 6.6vw;
    --font-size-33: 6.6vw;
    --font-size-34: 6.6vw;
    --font-size-35: 6.6vw;
    --font-size-36: 6.6vw;
    --font-size-37: 6.6vw;
    --font-size-38: 6.6vw;
    --font-size-39: 6.6vw;
    --font-size-40: 6.6vw;
    --font-size-41: 6.8vw;
    --font-size-42: 6.8vw;
    --font-size-43: 6.8vw;
    --font-size-44: 6.8vw;
    --font-size-45: 6.8vw;
    --font-size-46: 7vw;
    --font-size-47: 7vw;
    --font-size-48: 7vw;
    --font-size-49: 7.2vw;
    --font-size-50: 7.2vw;
    --font-size-51: 7.3vw;
    --font-size-52: 7.3vw;
    --font-size-53: 7.4vw;
    --font-size-54: 7.4vw;
    --font-size-55: 7.5vw;
    --font-size-56: 7.5vw;
    --font-size-57: 7.5vw;
    --font-size-58: 7.6vw;
    --font-size-59: 7.6vw;
    --font-size-60: 7.7vw;
  }
}
@media screen and (max-width: 767px) {
  :root {
    --margin-10: 1vw;
    --margin-15: 1vw;
    --margin-20: 2vw;
    --margin-25: 2vw;
    --margin-30: 3vw;
    --margin-35: 3vw;
    --margin-40: 6vw;
    --margin-45: 6vw;
    --margin-50: 7vw;
    --margin-55: 7vw;
    --margin-60: 8vw;
    --margin-65: 8vw;
    --margin-70: 10vw;
    --margin-75: 10vw;
    --margin-80: 14vw;
    --margin-85: 14vw;
    --margin-90: 15vw;
    --margin-95: 15vw;
    --margin-100: 18vw;
  }
}

/* flex */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.flex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: -ms-flexbox;
  -js-display: flex;
  display: flex;
  width: 100%;
}

.flx-cr {
  flex-direction: column-reverse;
}

.flx-c {
  flex-direction: column;
}

/*折り返し
-----------------------*/
.flx-wrp {
  flex-wrap: wrap;
}

/*逆順
-----------------------*/
.flx-rr {
  flex-direction: row-reverse;
}

/*水平方向の揃え
=================================================*/
/*初期値
-----------------------*/
.flx-strt {
  -webkit-justify-content: start;
  justify-content: start;
}

/*並列で均等配置（左右隙間なし=space-between）
-----------------------*/
.flx-btw {
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

/*並列で均等配置（左右隙間あり=space-around）
-----------------------*/
.flx-ard {
  -webkit-justify-content: space-around;
  justify-content: space-around;
}

/*水平揃え　末揃え
-----------------------*/
.flx-end {
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
}

/*水平揃え　中央揃え
-----------------------*/
.flx-center {
  -webkit-justify-content: center;
  justify-content: center;
}

/*垂直方向の揃え
=================================================*/
/*水平揃え　上揃え
-----------------------*/
.flx-alitem-strt {
  -webkit-align-items: flex-start;
  align-items: flex-start;
}

/*水平揃え　高さ揃え
-----------------------*/
.flx-alitem-strch {
  -webkit-align-items: stretch;
  align-items: stretch;
}

/*水平揃え　縦・横の中央揃え
-----------------------*/
.flx-alitem-c {
  -webkit-align-items: center;
  align-items: center;
}

/*水平揃え　下揃え
-----------------------*/
.flx-alitem-end {
  -webkit-align-items: flex-end;
  align-items: flex-end;
}

/*水平揃え　ベースライン揃え
-----------------------*/
.flx-alitem-base {
  -webkit-align-items: baseline;
  align-items: baseline;
}

/*複数行にした揃え方
=================================================*/
/*初期値
-----------------------*/
.flx-alcont-strt {
  -webkit-align-content: flex-start;
  align-content: flex-start;
}

/*親要素の開始位置から配置。上揃え
-----------------------*/
.flx-alcont-strch {
  -webkit-align-content: stretch;
  align-content: stretch;
}

/*親要素の終点から配置。下揃え
-----------------------*/
.flx-alcont-end {
  -webkit-align-content: flex-end;
  align-content: flex-end;
}

/*中央揃え
-----------------------*/
.flx-alcont-c {
  -webkit-align-content: center;
  align-content: center;
}

/*最初と最後の子要素を上下の端に配置し、残りの要素は均等に間隔をあけて配置
-----------------------*/
.flx-alcont-s-btw {
  -webkit-align-content: space-between;
  align-content: space-between;
}

/*上下端にある子要素も含め、均等に間隔をあけて配置
-----------------------*/
.flx-alcont-s-ard {
  -webkit-align-content: space-around;
  align-content: space-around;
}

/* ホバーアクション　*/
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* 速度 */
.hov--sp-15 {
  transition: ease 0.15s;
}

.hov--sp-17 {
  transition: ease 0.17s;
}

.hov--sp-20 {
  transition: ease 0.2s;
}

.hov--sp-25 {
  transition: ease 0.25s;
}

.hov--sp-30 {
  transition: ease 0.3s;
}

/* 透明度 */
.hov--op-40:hover {
  opacity: 0.4;
}

.hov--op-50:hover {
  opacity: 0.5;
}

.hov--op-60:hover {
  opacity: 0.6;
}

.hov--op-70:hover {
  opacity: 0.7;
}

.hov--op-80:hover {
  opacity: 0.8;
}

/* スライド */
.hov--top {
  position: relative;
  top: 0px;
}
.hov--top:hover {
  top: -5px;
}

.hov--right {
  position: relative;
  right: 0px;
}
.hov--right:hover {
  right: -5px;
}

.hov--bottom {
  position: relative;
  bottom: 0px;
}
.hov--bottom:hover {
  bottom: -5px;
}

.hov--left {
  position: relative;
  left: 0px;
}
.hov--left:hover {
  left: -5px;
}

/* 色変更 */
.hov--col-acc:hover {
  color: var(--col--acc-01);
}/*# sourceMappingURL=setting.css.map */