@charset "UTF-8";

/* CSS Document */
/*---------------------------------------------
表示非表示
----------------------------------------------*/
.sp {
  display: none !important;
}

.pc {
  display: block !important;
}

@media screen and (max-width: 639px) {
  .sp0 {
    display: block !important;
  }

  .pc0 {
    display: none !important;
  }
}

@media screen and (max-width: 639px) {
  .sp {
    display: block !important;
  }

  .pc {
    display: none !important;
  }
}

/*------------------------------------------*
* ブロックスタイル
*------------------------------------------*/
li {
  list-style: none;
}

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

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

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

.vertical-bottom {
  vertical-align: bottom;
}

/*------------------------------------------*
* インラインスタイル
*------------------------------------------*/
img {
  max-width: 100%;
}

a {
  text-decoration: none;
  color: #767676;
  display: block;
}

a:hover,
a:hover img,
input[type=submit]:hover,
input[type=button]:hover {
  text-decoration: none;
  cursor: pointer;
  opacity: 0.9;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=80)";
}

/*------------------------------------------*
* ポジション
*------------------------------------------*/
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*------------------------------------------*
* 文字スタイル
*------------------------------------------*/
.fs12 {
  font-size: 12px;
}

.fs14 {
  font-size: 14px;
}

.fs16 {
  font-size: 16px;
}

.fs18 {
  font-size: 18px;
}

.fs20 {
  font-size: 20px;
}

.fs22 {
  font-size: 22px;
}

.fs24 {
  font-size: 24px;
}

.fs28 {
  font-size: 28px;
}

.fs32 {
  font-size: 32px;
}

.fs36 {
  font-size: 36px;
}

.palt {
  font-feature-settings: "palt" 1;
}

.latters_005 {
  letter-spacing: 0.04em;
}

.lsn {
  letter-spacing: normal t;
}

.ls-01 {
  letter-spacing: -0.1em t;
}

.ls01 {
  letter-spacing: 0.1em t;
}

.ls-02 {
  letter-spacing: -0.2em t;
}

.ls02 {
  letter-spacing: 0.2em t;
}

.ls-03 {
  letter-spacing: -0.3em t;
}

.ls03 {
  letter-spacing: 0.3em t;
}

.ls-04 {
  letter-spacing: -0.4em t;
}

.ls04 {
  letter-spacing: 0.4em t;
}

.ls-06 {
  letter-spacing: -0.6em t;
}

.ls06 {
  letter-spacing: 0.6em t;
}

.ls-08 {
  letter-spacing: -0.8em t;
}

.ls08 {
  letter-spacing: 0.8em t;
}

.txt_bold {
  font-weight: bold;
}

.txt_500 {
  font-weight: 500;
}

.td_under {
  text-decoration: underline;
}

.txt_blue {
  color: #195270;
}

.txt_orange {
  color: #ff7f00;
}

.txt_red {
  color: #ff0000;
}

.txt_fff {
  color: #fff;
}

@media (max-width: 639px) {
  .fs12_sp {
  font-size: 12px !important;
}

.fs14_sp {
  font-size: 14px !important;
}
}
/*------------------------------------------*
* margin系CSS
*------------------------------------------*/
.mt2 {
  margin-top: 2px;
}

.mt4 {
  margin-top: 4px;
}

.mt8 {
  margin-top: 8px;
}

.mt10 {
  margin-top: 10px;
}

.mt16 {
  margin-top: 16px;
}

.mt20 {
  margin-top: 20px;
}

.mt4 {
  margin-top: 24px;
}

.mt30 {
  margin-top: 30px;
}

.mt32 {
  margin-top: 32px;
}

.mt36 {
  margin-top: 36px;
}

.mt40 {
  margin-top: 40px;
}

.mt50 {
  margin-top: 50px;
}

.mt60 {
  margin-top: 60px;
}

.mt65 {
  margin-top: 65px;
}

.mt70 {
  margin-top: 70px;
}

.mt75 {
  margin-top: 75px;
}

.mt80 {
  margin-top: 80px;
}

.mt90 {
  margin-top: 90px;
}

.mt150 {
  margin-top: 150px;
}

.mt160 {
  margin-top: 160px;
}

.mt200 {
  margin-top: 200px;
}

/*------------------------------------------*
* position系CSS
*------------------------------------------*/
.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.z1 {
  z-index: 1;
}

.z2 {
  z-index: 2;
}

.z3 {
  z-index: 3;
}

/*------------------------------------------*
*ブロック・インライン
*------------------------------------------*/
.block {
  display: block;
}

.inline {
  display: inline-block;
}

/*------------------------------------------*
*アニメーション
*------------------------------------------*/
/********* フェードイン *********/
.fadeIn {
  -webkit-animation-name: fadeInAnime;
  animation-name: fadeInAnime;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeInAnime {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeInAnime {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeUp {
  -webkit-animation-name: fadeUpAnime;
  animation-name: fadeUpAnime;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

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

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fadeDown {
  -webkit-animation-name: fadeDownAnime;
  animation-name: fadeDownAnime;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeDownAnime {
  from {
    opacity: 0;
    transform: translateY(-100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeDownAnime {
  from {
    opacity: 0;
    transform: translateY(-100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fadeLeft {
  -webkit-animation-name: fadeLeftAnime;
  animation-name: fadeLeftAnime;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeLeftAnime {
  from {
    opacity: 0;
    transform: translateX(-100px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeLeftAnime {
  from {
    opacity: 0;
    transform: translateX(-100px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.fadeRight {
  -webkit-animation-name: fadeRightAnime;
  animation-name: fadeRightAnime;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeRightAnime {
  from {
    opacity: 0;
    transform: translateX(100px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeRightAnime {
  from {
    opacity: 0;
    transform: translateX(100px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {
  transition: 0.8s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
}

.scroll_up.on {
  transform: translateY(0);
  opacity: 1;
}

/*----------------------------
scroll_down ｜上から下へ出現
----------------------------*/
.scroll_down {
  transition: 0.8s ease-in-out;
  transform: translateY(-30px);
  opacity: 0;
}

.scroll_down.on {
  transform: translateY(0);
  opacity: 1;
}

/*----------------------------
scroll_left ｜左から出現
----------------------------*/
.scroll_left {
  transition: 0.8s ease-in-out;
  transform: translateX(-80px);
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
}

.scroll_left.on {
  opacity: 1;
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  transform: translateX(0);
}

/*----------------------------
scroll_right ｜右から出現
----------------------------*/
.scroll_right {
  transition: 0.8s ease-in-out;
  transform: translateX(80px);
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
}

.scroll_right.on {
  opacity: 1;
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  transform: translateX(0);
}

/*--徐々にずらす -- */
.low_timing02 {
  transition-delay: 1s;
}

.low_timing03 {
  transition-delay: 2s;
}

.low_timing04 {
  transition-delay: 3s;
}

.low_timing05 {
  transition-delay: 4s;
}

.low_timing05 {
  transition-delay: 10s;
}

.low_timing06 {
  transition-delay: 20s;
}

.low_timing07 {
  transition-delay: 30s;
}

.low_timing08 {
  transition-delay: 50s;
}

.timing02 {
  transition-delay: 0.2s;
}

.timing03 {
  transition-delay: 0.4s;
}

.timing04 {
  transition-delay: 0.6s;
}

.timing05 {
  transition-delay: 0.8s;
}

@-webkit-keyframes rotation1 {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotation1 {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(360deg);
  }
}

@-webkit-keyframes gradation {
  0% {
    background-position: 0% 0%;
  }

  100% {
    background-position: 100% 100%;
  }
}

@keyframes gradation {
  0% {
    background-position: 0% 0%;
  }

  100% {
    background-position: 100% 100%;
  }
}

@-webkit-keyframes flash {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes flash {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-webkit-keyframes show {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes show {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}