@charset "UTF-8";
/*----------------------------------------------------
基本設定
----------------------------------------------------*/
/*----------------------------------------------------
.inner 余白 設定
----------------------------------------------------*/
/*----------------------------------------------------
//ベースフォントサイズ
----------------------------------------------------*/
/*----------------------------------------------------
グローバルナビブレイクポイント
/* ハンバーガーメニューの切り替わるポイント。
----------------------------------------------------*/
/* gnav.jsの変数「gNav_bpoint」も数値を合わせる */
/*----------------------------------------------------
transition
----------------------------------------------------*/
/* ホバー変更はやさ*/
/*----------------------------------------------------
mixinで、cssアニメーションを変数で指定できるようにするのに使う
----------------------------------------------------*/
/* インクルードする際はこんなふうに使う */
/*----------------------------------------------------
アニメーション名を指定する
----------------------------------------------------*/
/*----------------------------------------------------
中央寄せ
----------------------------------------------------*/
/* 上下左右中央寄せ */
/* 上下中央寄せ */
/* 左右中央寄せ */
/*----------------------------------------------------
フォント設定
----------------------------------------------------*/
/*----------------------------------------------------
フォント
----------------------------------------------------*/
/*----------------------------------------------------
google font
----------------------------------------------------*/
/*----------------------------------------------------
======================================================
mixin-疑似要素
======================================================
----------------------------------------------------*/
/* ホバーで下線が左に消える */
body {
  /* for iOS スマホを横向きにした際に文字が大きくならなくする https://qiita.com/Sen-Din/items/3553de9cf34358f3e2e0*/
  -webkit-text-size-adjust: 100%;
}

body {
  position: relative;
  z-index: 1;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: 14px;
  color: #666666;
  background-color: #fff;
  overflow-x: hidden;
  font-family: "Zen Maru Gothic", YuGothic, "游ゴシック", "Hiragino Kaku Gothic Pro",
    "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
  /* 751- */
}
@media all and (min-width: 751px) {
  body {
    font-size: 16px;
  }
}

*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

a {
  text-decoration: none;
}

a img {
  border: none;
}

img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

figure {
  margin: 0;
}

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

ul,
li,
dl,
dt,
dd {
  margin: 0;
  padding: 0;
  list-style: none;
}

input,
label,
select,
textarea {
  vertical-align: middle;
}

.align-center {
  text-align: center;
}

strong {
  font-size: 1.2em;
}

/*----------------------------------------------------
js スクロール時の動き
----------------------------------------------------*/
.boxOpacity {
  opacity: 0;
}

/* 下からフワッと出てくる */
.fadeUp {
  -webkit-animation-name: fadeUpAnime;
  animation-name: fadeUpAnime;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeUpAnime {
  from {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
.starFadeUp {
  -webkit-animation-name: fadeUpStar;
  animation-name: fadeUpStar;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeUpStar {
  from {
    opacity: 0;
    -webkit-transform: translateY(70px);
    transform: translateY(70px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeUpStar {
  from {
    opacity: 0;
    -webkit-transform: translateY(70px);
    transform: translateY(70px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
/*----------------------------------------------------
inner
----------------------------------------------------*/
/* ベース */
.inner {
  padding: 0 5px;
  /* 751- */
  /* innerの幅 */
}
@media all and (min-width: 751px) {
  .inner {
    padding: 0 70px;
  }
}
@media all and (min-width: 1201px) {
  .inner {
    margin: 0 auto;
    max-width: 1200px;
    padding: 0;
  }
}

/*----------------------------------------------------
クリック無効化と透過
----------------------------------------------------*/
.is_opacity {
  pointer-events: none;
  opacity: 0;
}

/*----------------------------------------------------
表示 非表示
----------------------------------------------------*/
.hide {
  display: none;
}

.opacity {
  opacity: 0;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.forSP {
  /* -750 */
  /* 751- */
}
@media all and (max-width: 750px) {
  .forSP {
    display: block;
  }
}
@media all and (min-width: 751px) {
  .forSP {
    display: none;
  }
}

.forPC {
  /* -750 */
  /* 751- */
}
@media all and (max-width: 750px) {
  .forPC {
    display: none;
  }
}
@media all and (min-width: 751px) {
  .forPC {
    display: block;
  }
}

/* 河野りょうたさん切り替えよう */
@media all and (max-width: 1249px) {
  .forKawanoSP {
    display: block;
  }
}
@media all and (min-width: 1250px) {
  .forKawanoSP {
    display: none;
  }
}

@media all and (max-width: 1249px) {
  .forKawanoPC {
    display: none;
  }
}
@media all and (min-width: 1250px) {
  .forKawanoPC {
    display: block;
  }
}

/*----------------------------------------------------
改行 表示非表示
----------------------------------------------------*/
.brsp {
  display: block;
  /* 751- */
}
@media all and (min-width: 751px) {
  .brsp {
    display: none;
  }
}

.brpc {
  display: none;
  /* 751- */
}
@media all and (min-width: 751px) {
  .brpc {
    display: block;
  }
}

.brlg {
  display: none;
}
@media all and (max-width: 1060px) {
  .brlg {
    display: block;
  }
}
@media all and (max-width: 750px) {
  .brlg {
    display: none;
  }
}

/*----------------------------------------------------
キラキラ光る星
----------------------------------------------------*/
.star,
.star2,
.star3 {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  opacity: 0;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.star.animeStart.starAnime {
  -webkit-animation-name: star1;
  animation-name: star1;
}
.star.animeStart.starAnime2 {
  -webkit-animation-name: star2;
  animation-name: star2;
  -webkit-animation-duration: 2.5s;
  animation-duration: 2.5s;
}
.star.animeStart.starAnime3 {
  -webkit-animation-name: star3;
  animation-name: star3;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}
.star.animeStart.starAnime4 {
  -webkit-animation-name: star1;
  animation-name: star1;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

@-webkit-keyframes star1 {
  0% {
    opacity: 0;
  }
  33% {
    opacity: 0;
  }
  66% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes star1 {
  0% {
    opacity: 0;
  }
  33% {
    opacity: 0;
  }
  66% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes star2 {
  0% {
    opacity: 1;
  }
  33% {
    opacity: 0;
  }
  66% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes star2 {
  0% {
    opacity: 1;
  }
  33% {
    opacity: 0;
  }
  66% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes star3 {
  0% {
    opacity: 0;
  }
  33% {
    opacity: 1;
  }
  66% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes star3 {
  0% {
    opacity: 0;
  }
  33% {
    opacity: 1;
  }
  66% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/*# sourceMappingURL=common.css.map */
