@charset "UTF-8";
/*//////////////////////////////////////////////////

各scssの読み込み

//////////////////////////////////////////////////*/
/*//////////////////////////////////////////////////
	reset設定
//////////////////////////////////////////////////*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

html {
  font-size: 62.5%;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/*//////////////////////////////////////////////////
    変数設定
//////////////////////////////////////////////////*/
/*===============================
// ブレイクポイント変数
/==============================*/
/* カラー変数 */
/* フォント変数 */
/*//////////////////////////////////////////////////
	mixin設定
//////////////////////////////////////////////////*/
/*===============================
// ブレイクポイントの設定
/==============================*/
/*===============================
// 横幅の設定
// @include w_box(横幅にしたい数値) デフォルト1200px
/==============================*/
/*===============================
// 文字サイズの可変設定
// @include font(最小フォントサイズ, 最大フォントサイズ, 最小ブラウザサイズ, 最大ブラウザサイズ);
/==============================*/
/*===============================
// 文字サイズの可変を呼び出し
/==============================*/
/*===============================
// 表示切り替え設定
/==============================*/
/*===============================
// 文字行間の可変設定
// @include l_height(line-height,font-size);
/==============================*/
/*===============================
// 文字間隔の可変設定
// @include l_space(サイズ);
/==============================*/
/*===============================
// marginの可変設定
// @include margin(横幅, 上, 右, 下, 左);
/==============================*/
/*===============================
// paddingの可変設定
// @include padding(横幅, 上, 右, 下, 左);
/==============================*/
/*===============================
// positionの自動設定
// @include center(xy);上下左右中央
// @include center(x);左右中央
// @include center(y);上下中央
/==============================*/
/*===============================
// flexの自動設定
// @include flex_wrap;
/==============================*/
/*===============================
// flexの自動設定：align-items
// @include items(center);
// @include items(stretch);
// @include items(start);
// @include items(end);
/==============================*/
/*===============================
// flexの自動設定：justify-content
// @include justify(between);
// @include justify(center);
// @include justify(start);
// @include justify(end);
/==============================*/
/*===============================
// flex要素の幅設定
// @include flex_box(サイズ＆単位);　デフォルト48%
/==============================*/
/*===============================
// box-sizingの設定
// @include box;
/==============================*/
/*===============================
// ベンダープレフィックス設定
// @include prefix(border-radius, 10px);
/==============================*/
/*===============================
// 値にプレフィックスを付与
// @include value_prefix(display, flex);
/==============================*/
/*===============================
// border生成
// @include border(full);四方 デフォルト 1px solid
// @include border(top);上線 デフォルト 1px solid
// @include border(bottom);下線 デフォルト 1px solid
// @include border(left);左線 デフォルト 1px solid
// @include border(right);右線 デフォルト 1px solid
/==============================*/
/*===============================
// 角丸の設定
// @include radius(角丸のサイズ); デフォルト4px
/==============================*/
/*===============================
// 円の生成
// @include circle(円のサイズ);
/==============================*/
/*===============================
// 円の生成：可変
// @include v_circle; 親要素に横幅指定必須
/==============================*/
/*===============================
// くの字矢印の生成
// @include arrow(三角のサイズ,線の太さ); デフォルト4px,1px
/==============================*/
/*===============================
// 三角の生成
// @include triangle(向き,三角のサイズ,色);
/==============================*/
/*===============================
// 背景画像の生成
// @include back_image("画像パス");
/==============================*/
/*===============================
// グラデーションの生成
// @include gradient("最初の色,最後の色");
/==============================*/
/*===============================
// 文字の位置設定
// @include t_align(center);
// @include t_align(left);
// @include t_align(right);
/==============================*/
/*===============================
// object-fit設定
// @include ofi(contain);
// @include ofi(cover);
/==============================*/
/*//////////////////////////////////////////////////
    ベース設定
//////////////////////////////////////////////////*/
/* 初期設定 */
html {
  font-size: min(12px, 2.66vw);
}
html:not(.lang-ja) body {
  text-align: left;
}

body {
  letter-spacing: 0.05em;
  list-style: 2;
  font-feature-settings: "palt";
  font-family: "Noto Sans JP", serif;
  font-weight: 500;
  word-wrap: break-word;
  line-height: 1.7;
  letter-spacing: 0;
  text-align: justify;
  text-justify: inter-character; /* Firefoxで必要 */
  color: #000;
}

h1, h2, h3, h4, h5 {
  text-align: center;
  font-weight: bold;
  font-family: "Noto Sans JP", serif;
}

p {
  font-size: 100%;
  letter-spacing: 0.05em;
}

address {
  font-style: normal;
}

a, button {
  text-decoration: none;
  color: inherit;
  transition: 0.3s ease;
}

a {
  display: block;
}

button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}

figure, picture {
  display: block;
}

img {
  width: 100%;
  vertical-align: bottom;
  -webkit-backface-visibility: hidden;
  image-rendering: -webkit-optimize-contrast;
}

/* デバイス別の表示切り替え */
.sp {
  display: inherit;
}
@media screen and (min-width: 769px) {
  .sp {
    display: none;
  }
}
@media screen and (min-width: 961px) {
  .sp {
    display: none;
  }
}

.tab {
  display: none;
}
@media screen and (min-width: 769px) {
  .tab {
    display: inherit;
  }
}
@media screen and (min-width: 961px) {
  .tab {
    display: none;
  }
}
@media screen and (min-width: 1366px) {
  .tab {
    display: none;
  }
}

.sp-tab {
  display: inherit;
}
@media screen and (min-width: 769px) {
  .sp-tab {
    display: inherit;
  }
}
@media screen and (min-width: 961px) {
  .sp-tab {
    display: none;
  }
}
@media screen and (min-width: 1366px) {
  .sp-tab {
    display: none;
  }
}

.pc-tab {
  display: none;
}
@media screen and (min-width: 769px) {
  .pc-tab {
    display: inherit;
  }
}
@media screen and (min-width: 961px) {
  .pc-tab {
    display: inherit;
  }
}
@media screen and (min-width: 1366px) {
  .pc-tab {
    display: inherit;
  }
}

.pc {
  display: none;
}
@media screen and (min-width: 769px) {
  .pc {
    display: none;
  }
}
@media screen and (min-width: 961px) {
  .pc {
    display: inherit;
  }
}
@media screen and (min-width: 1366px) {
  .pc {
    display: inherit;
  }
}

.inner {
  margin: auto;
  padding: 0 2rem;
  width: 100%;
  box-sizing: border-box;
}

/* テキストの反転設定 */
::selection {
  color: #FFF;
  background: #990033;
}

/*------------------------------
769px以上
------------------------------*/
@media screen and (min-width: 769px) {
  html {
    font-size: 1.04058vw;
  }
}
/*------------------------------
961px以上
------------------------------*/
@media screen and (min-width: 961px) {
  html {
    font-size: min(12px, 0.73vw);
  }
  a:hover {
    opacity: 0.8;
  }
  /* telリンクの無効化 */
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
  .inner {
    padding: 0;
    max-width: 100rem;
  }
}
/*------------------------------
1366px以上
------------------------------*/
@media screen and (min-width: 1366px) {
  html {
    font-size: 62.5%;
  }
}
/*//////////////////////////////////////////////////
    ヘッダー設定
//////////////////////////////////////////////////*/
#header {
  width: 100vw;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  height: 13rem;
  background: #990033;
  margin-bottom: 2.5rem;
  padding: 1.5rem 2.5rem;
  box-sizing: border-box;
  filter: drop-shadow(1.5px 1.5px 2px rgba(0, 0, 0, 0.2));
}
#header .header_wrap {
  max-width: 100%;
  margin: 0 auto;
}
#header .header_wrap .header_ttl {
  margin-bottom: 1.5rem;
  color: #FFF;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1.4;
  letter-spacing: 0.05em;
}
#header .header_wrap .header_ttl ._l {
  font-size: 1.3em;
}
#header .header_wrap .header_bnr {
  max-width: 320px;
  margin: 0 auto;
  filter: drop-shadow(1.5px 1.5px 2px rgba(0, 0, 0, 0.2));
}

/*------------------------------
961px以上
------------------------------*/
@media screen and (min-width: 769px) {
  #header {
    margin-bottom: 5rem;
    height: 8rem;
  }
  #header .header_wrap {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
  }
  #header .header_wrap .header_ttl {
    flex: 0 0 auto;
    font-size: 2.25rem;
    margin: 0;
  }
  #header .header_wrap .header_ttl ._l {
    font-size: 1.33em;
  }
  #header .header_wrap .header_bnr {
    flex: 0 0 auto;
    max-width: 32rem;
    margin: 0;
  }
}
/*//////////////////////////////////////////////////
    フッター設定
//////////////////////////////////////////////////*/
#footer {
  margin-top: 7rem;
  border-top: 1px solid #990033;
  background: #F2F2F2;
  padding: 3.5rem 0 12rem;
}
#footer .foorer_copy {
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0.03em;
  text-align: center;
  line-height: 1.4;
}

/*------------------------------
961px以上
------------------------------*/
/*//////////////////////////////////////////////////
	パーツ設定
//////////////////////////////////////////////////*/
/* ページトップ */
#pageTop {
  display: none;
  width: 7rem;
  height: 7rem;
  font-size: 1.3rem;
  line-height: 1.2;
  text-align: center;
  border-radius: 50%;
  color: #FFF;
  background: #990033;
  position: fixed;
  right: 1.5rem;
  bottom: 8rem;
  transition: none;
  z-index: 999;
}
#pageTop span {
  position: absolute;
  top: 62%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#pageTop::before {
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  border-top: 1.5px solid #FFF;
  border-left: 1.5px solid #FFF;
  position: absolute;
  top: 1.5rem;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
}

/*------------------------------
769px以上
------------------------------*/
/*------------------------------
961px以上
------------------------------*/
@media screen and (min-width: 961px) {
  #pageTop {
    width: 11.5rem;
    height: 11.5rem;
    font-size: 1.6rem;
    line-height: 1.2;
    color: #FFF;
    background: #990033;
    right: 3.5rem;
    bottom: 3.5rem;
    transition: 0.3s ease;
    cursor: pointer;
  }
  #pageTop span {
    width: 100%;
    top: 60%;
  }
  #pageTop::before {
    width: 2.52rem;
    height: 2.52rem;
    border-top-width: 2px;
    border-left-width: 2px;
    top: 2.8rem;
  }
  #pageTop:hover {
    color: #990033;
    background: #FFF;
    opacity: 1;
  }
}
/*# sourceMappingURL=common.css.map */
