@charset "UTF-8";
/*basic*/
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html, body {
  margin: 0;
  font-family: serif;
}

body {
  font-family: NotoSansCJKjp,YuGothicM,"游ゴシック体","Yu Gothic",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;
  /*font-size: 28px;*/
  /*line-height: 1.5;*/
  font-weight: 400;
  letter-spacing: 0;
  -webkit-tap-highlight-color: transparent;
  color: #333;
}


h1, h2, h3, h4, h5, h6, figure {
  margin: 0;
  font-weight: 600;
}
p {
  margin: 0;
}

button {
  padding: 0;
  margin: 0;
  background: none;
  border: none;
}

figure img {
  width: 100%;
  max-width: 100%;
}

iframe, img {
  vertical-align: top;
  max-width: 100%;
}

ul, ol {
  padding-left: 0;
  margin: 0;
  list-style: none;
}

a {
  text-decoration: none;
  cursor: pointer;
}

a:hover, a:focus {
  text-decoration: none;
}

body.s-scroll-disabled {
  position: fixed;
  overflow: hidden;
  left: 0;
  right: 0;
}

/*@media screen and (max-width: 639px) {
  body {
    font-size: 3.7333vw;
  }
}*/
/*end basic*/


/*display helpers*/
@media screen and (min-width: 768px) {
  .h-sp-only { display: none !important; }
}

@media screen and (max-width: 959px) {
  .h-pc-only { display: none !important; }
}

@media screen and (max-width: 767px), screen and (min-width: 960px) {
  .h-tb-only { display: none !important; }
}

@media screen and (max-width: 767px) {
  .h-nonsp-only { display: none !important; }
}

@media screen and (min-width: 960px) {
  .h-nonpc-only { display: none !important; }
}
/*end display helpers*/

/*common helpers*/
.h-hide {
  display: none !important;
}
.h-clear:after {
  content:  '';
  display: block;
  clear:  both;
}

.h-ovfHidden { overflow: hidden; }

.h-ctnBefore:before,
.h-ctnAfter:after {
  content: '';
}

.h-dspBlock { display: block; }
.h-dspInlineBlock { display: inline-block; }
.h-dspFlex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.h-posRelative {position: relative;}
.h-posAbsolute {position: absolute;}
.h-posFixed {position: fixed;}

.h-txtCenter {text-align: center;}
.h-txtLeft {text-align: left;}
.h-txtRight {text-align: right;}
.h-txtJustify {text-align: justify;}

.h-fltLeft {float: left;}
.h-fltRight {float: right;}

.h-flxAlignCenter {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.h-flxJustifyCenter {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.h-flxWrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}


@media screen and (max-width: 767px) {
  .h-dspBlock_sp { display: block; }
  .h-dspInlineBlock_sp { display: inline-block; }
  .h-dspFlex_sp {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .h-posRelative_sp {position: relative;}
  .h-posAbsolute_sp {position: absolute;}
  .h-posFixed_sp {position: fixed;}

  .h-txtCenter_sp {text-align: center;}
  .h-txtLeft_sp {text-align: left;}
  .h-txtRight_sp {text-align: right;}
  .h-txtJustify_sp {text-align: justify;}


  .h-fltLeft_sp {float: left;}
  .h-fltRight_sp {float: right;}

  .h-flxAlignCenter_sp {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .h-flxJustifyCenter_sp {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media screen and (min-width: 768px) {
  .h-dspBlock_nonsp { display: block; }
  .h-dspInlineBlock_nonsp { display: inline-block; }
  .h-dspFlex_nonsp {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .h-posRelative_nonsp {position: relative;}
  .h-posAbsolute_nonsp {position: absolute;}
  .h-posFixed_nonsp {position: fixed;}

  .h-txtCenter_nonsp {text-align: center;}
  .h-txtLeft_nonsp {text-align: left;}
  .h-txtRight_nonsp {text-align: right;}
  .h-txtJustify_nonsp {text-align: justify;}

  .h-fltLeft_nonsp {float: left;}
  .h-fltRight_nonsp {float: right;}

  .h-flxAlignCenter_nonsp {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .h-flxJustifyCenter_nonsp {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media screen and (min-width: 960px) {

  .h-hoverOp70:hover {
    opacity: 0.7;
  }

  .h-dspBlock_pc { display: block; }
  .h-dspInlineBlock_pc { display: inline-block; }
  .h-dspFlex_pc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .h-posRelative_pc {position: relative;}
  .h-posAbsolute_pc {position: absolute;}
  .h-posFixed_pc {position: fixed;}

  .h-txtCenter_pc {text-align: center;}
  .h-txtLeft_pc {text-align: left;}
  .h-txtRight_pc {text-align: right;}
  .h-txtJustify_pc {text-align: justify;}

  .h-fltLeft_pc {float: left;}
  .h-fltRight_pc {float: right;}

  .h-flxAlignCenter_pc {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .h-flxJustifyCenter_pc {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }

}
@media screen and (max-width: 959px) {

  .h-dspBlock_nonpc { display: block; }
  .h-dspInlineBlock_nonpc { display: inline-block; }
  .h-dspFlex_nonpc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .h-posRelative_nonpc {position: relative;}
  .h-posAbsolute_nonpc {position: absolute;}
  .h-posFixed_nonpc {position: fixed;}

  .h-txtCenter_nonpc {text-align: center;}
  .h-txtLeft_nonpc {text-align: left;}
  .h-txtRight_nonpc {text-align: right;}
  .h-txtJustify_nonpc {text-align: justify;}

  .h-fltLeft_nonpc {float: left;}
  .h-fltRight_nonpc {float: right;}

  .h-flxAlignCenter_nonpc {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .h-flxJustifyCenter_nonpc {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }

}
/*end common helpers*/

/*layouts*/
.l-container {
  padding-left: 10px;
  padding-right: 10px;
}
.l-row {
  margin-left: -2.5px;
  margin-right: -2.5px;
}
.l-col {
  padding-left: 2.5px;
  padding-right: 2.5px;
  width: 100%;
}
.l-col.l-col--1p3 { width: 33.3333%; }
.l-col.l-col--1p6 { width: 16.6667%; }
.l-col.l-col--1p7 { width: 14.2857%; }

@media screen and (max-width: 767px) {
  .l-col.l-col--1p3_sp { width: 33.3333%; }
  .l-col.l-col--1p6_sp { width: 16.6667%; }
  .l-col.l-col--1p7_sp { width: 14.2857%; }
}
@media screen and (min-width: 768px) and (max-width: 959px) {
  .l-col.l-col--1p3_tb { width: 33.3333%; }
  .l-col.l-col--1p6_tb { width: 16.6667%; }
  .l-col.l-col--1p7_tb { width: 14.2857%; }
}
@media screen and (min-width: 960px) {
  .l-col.l-col--1p3_pc { width: 33.3333%; }
  .l-col.l-col--1p6_pc { width: 16.6667%; }
  .l-col.l-col--1p7_pc { width: 14.2857%; }
}

@media screen and (min-width: 768px) {
  .l-container {
    padding-left: 15px;
    padding-right: 15px;
  }
  .l-row {
    margin-left: -5px;
    margin-right: -5px;
  }
  .l-col {
    padding-left: 5px;
    padding-right: 5px;
  }
}
@media screen and (min-width: 960px) {
  .l-container {
    width: 985px;
    padding-left: 12.5px;
    padding-right: 12.5px;
    max-width:  100%;
    margin:  0 auto;
  }
  .l-row {
    margin-left: -12.5px;
    margin-right: -12.5px;
  }
  .l-col {
    padding-left: 12.5px;
    padding-right: 12.5px;
  }
}
/*endlayouts*/

/*animations*/
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.fadeIn {
  animation-name: fadeIn;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 30px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  animation-name: fadeInUp;
}

@keyframes pulse {
  0%{
    opacity: 0;
    transform-origin: 50% 50%;
    transform: rotate(0deg) scale(2);
  }
  100%{
    opacity:1;
    transform: rotate(0deg) scale(1);
  }
}

.pulse {
  animation-name: pulse;
}
/*end animations*/