@charset "UTF-8";
/* Scss Document */
/*変数の宣言*/
/*タブレット端末の横幅*/
/*スマホ端末の横幅*/
/*タブレット用画像の高さ*/
/*スマホ用画像の高さ*/
/*画像のパス*/
/*一枚あたりの表示時間(秒数)*/
/*画像の枚数*/
@media screen and (min-width: 768px) {
  #head_anim {
    height: 0;
    padding-bottom: 29.2708333333%;
    background-size: contain;
    margin: 0 auto; }

  .header_anim li {
    opacity: 0;
    animation: header_anim 9s linear infinite 0s;
    height: 0;
    padding-bottom: 29.2708333333%;
    background-size: contain; }

  .header_anim li:nth-child(1) {
    background: url("../images/header_anim/top_pc01.jpg") center top no-repeat;
    height: 0;
    padding-bottom: 29.2708333333%;
    background-size: contain; }

  .header_anim li:nth-child(2) {
    background: url("../images/header_anim/top_pc02.jpg") center top no-repeat;
    height: 0;
    padding-bottom: 29.2708333333%;
    background-size: contain;
    margin-top: -29.2708333333%;
    animation-delay: 3s; }

  .header_anim li:nth-child(3) {
    background: url("../images/header_anim/top_pc03.jpg") center top no-repeat;
    height: 0;
    padding-bottom: 29.2708333333%;
    background-size: contain;
    margin-top: -29.2708333333%;
    animation-delay: 6s; } }
@media (max-width: 767px) {
  #head_anim {
    height: 0;
    padding-bottom: 102.5390625%;
    background-size: contain;
    margin: 0 auto; }

  .header_anim li {
    opacity: 0;
    animation: header_anim 9s linear infinite 0s;
    height: 0;
    padding-bottom: 102.5390625%;
    background-size: contain; }

  .header_anim li:nth-child(1) {
    background: url("../images/header_anim/top_smp01.jpg") center top no-repeat;
    height: 0;
    padding-bottom: 102.5390625%;
    background-size: contain; }

  .header_anim li:nth-child(2) {
    background: url("../images/header_anim/top_smp02.jpg") center top no-repeat;
    height: 0;
    padding-bottom: 102.5390625%;
    background-size: contain;
    margin-top: -102.5390625%;
    animation-delay: 3s; }

  .header_anim li:nth-child(3) {
    background: url("../images/header_anim/top_smp03.jpg") center top no-repeat;
    height: 0;
    padding-bottom: 102.5390625%;
    background-size: contain;
    margin-top: -102.5390625%;
    animation-delay: 6s; } }
@keyframes header_anim {
  0% {
    opacity: 0; }
  16.6666666667% {
    opacity: 1; }
  33.3333333333% {
    opacity: 1; }
  50% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@-webkit-keyframes header_anim {
  0% {
    opacity: 0; }
  16.6666666667% {
    opacity: 1; }
  33.3333333333% {
    opacity: 1; }
  50% {
    opacity: 0; }
  100% {
    opacity: 0; } }