@charset "UTF-8";
/*書式設定
----------------------------------*/
@media only screen and (max-width: 990px) {
} /*990px end*/

@media only screen and (max-width: 640px) {
  .left {
    float: none;
  }
  .right {
    float: none;
  }
  .pc {
    display: none;
  }
  .sp-i {
    display: inline-block;
  }
  .sp {
    display: block;
  }
  .absl {
    position: static;
  }

  .container {
    width: 100%;
    min-width: 100%;
  }

  #contentWrap {
    max-width: 640px;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
  }
  #contentWrap .tips {
    width: 100%;
    padding: 10px 10px 10px 20px;
    box-sizing: border-box;
  }
  #contentWrap img {
    width: 100%;
    height: auto;
  }
  #contentWrap .contentBox {
    max-width: 640px;
    width: 100%;
    height: auto;
  }

  #mainBox {
    background-position: center 80vw;
    background-size: 420vw;
  }
  #mainBox #mainTitle img {
    width: 75%;
    padding-bottom: 5px;
  }

  #mainBox #mainTitle::before {
    width: 20vw;
    height: 10vw;
    background-size: cover;
    top: 3vw;
    left: -5vw;
  }
  #mainBox #mainTitle::after {
    width: 20vw;
    height: 10vw;
    background-size: cover;
    top: 3vw;
    right: -7vw;
  }
  #mainSlide #slide li img {
    width: 180vw;
  }
  #mainBox .contentBox .catch {
    position: absolute;
    width: 80%;
    top: -10vw;
    left: 10vw;
  }
  #mainBox .contentBox .lead {
    width: 75%;
    margin: 0 auto;
    padding-top: 30px;
  }
  #mainBox .contentBox .map {
    display: none;
  }
  #mainBox .contentBox .colvBox {
    padding: 10px;
    margin: 20px;
  }
  #mainBox .contentBox .colvBox ul li {
    text-indent: -1em;
    padding-left: 1em;
  }
  #spotBoxWrap {
    margin: 60px auto 0;
  }
  #spotBoxWrap .spotBox01 .contentBox,
  #spotBoxWrap .spotBox02 .contentBox,
  #spotBoxWrap .spotBox03 .contentBox,
  #spotBoxWrap .spotBox04 .contentBox,
  #spotBoxWrap .spotBox05 .contentBox,
  #spotBoxWrap .spotBox06 .contentBox {
    height: auto;
    padding-bottom: 30px;
  }
  #spotBoxWrap .spotBox01 .contentBox .title01,
  #spotBoxWrap .spotBox02 .contentBox .title02,
  #spotBoxWrap .spotBox03 .contentBox .title03,
  #spotBoxWrap .spotBox04 .contentBox .title04,
  #spotBoxWrap .spotBox05 .contentBox .title05,
  #spotBoxWrap .spotBox06 .contentBox .title06 {
    padding-bottom: 30px;
  }
  #spotBoxWrap .spotBox01,
  #spotBoxWrap .spotBox02,
  #spotBoxWrap .spotBox03,
  #spotBoxWrap .spotBox04,
  #spotBoxWrap .spotBox05,
  #spotBoxWrap .spotBox06 {
    margin-top: 30px;
    background-size: 400vw;
    background-position: -120vw bottom;
  }
  #spotBoxWrap .spotBox01 .contentBox .spot01,
  #spotBoxWrap .spotBox02 .contentBox .spot03,
  #spotBoxWrap .spotBox03 .contentBox .spot05,
  #spotBoxWrap .spotBox04 .contentBox .spot07,
  #spotBoxWrap .spotBox06 .contentBox .spot12 {
    padding-bottom: 30px;
  }
  #spotBoxWrap .spotBox01 {
    background-position: -90vw bottom;
  }
  #spotBoxWrap .spotBox02 {
    background-position: -90vw bottom;
  }
  #spotBoxWrap .spotBox04 {
    background-position: -80vw bottom;
  }
  #spotBoxWrap .spotBox06 {
    background-position: -90vw bottom;
  }
  #spotBoxWrap .spotBox04 .contentBox .spot07 {
    padding-bottom: 0;
  }
  #spotBoxWrap .spotBox05 .contentBox .title05 {
    padding: 0 0 0 20px;
  }
  #spotBoxWrap .spotBox05 .contentBox .title05_2 {
    margin: -5px -30vw 10px 0;
  }
  #spotBoxWrap .spotBox05 .contentBox .title05_2 img {
    width: 100vw;
  }
  #spotBoxWrap .spotBox05 .contentBox .spot09,
  #spotBoxWrap .spotBox05 .contentBox .spot10 {
    padding-bottom: 30px;
  }
  #spotBoxWrap .spotBox05 .contentBox .spot09 img,
  #spotBoxWrap .spotBox05 .contentBox .spot10 img,
  #spotBoxWrap .spotBox05 .contentBox .spot11 img {
    width: 75%;
  }
  #cpnBoxWrap .caution {
    text-align: left;
    margin: 20px;
  }
  #cpnBoxWrap .linkBox a {
    width: 100%;
    height: auto;
  }
  #cpnBoxWrap .linkBox a:hover p img {
    opacity: 1;
  }
  #cpnBoxWrap .linkBox .left {
    margin-bottom: 30px;
  }
  #cpnBoxWrap .linkBox h4 {
    line-height: 1.2em;
    font-size: 5vw;
  }
} /*640px end*/

@media only screen and (max-width: 380px) {
} /*380px end*/

@media only screen and (max-width: 320px) {
} /*320px end*/
