html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, input, textarea, button {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  font-size: 13px;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Helvetica , Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 1.6em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "halt" 1;
}
img{
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: bottom;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
}
.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}


#loader-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: url(./img/load_bg@2x.jpg)no-repeat center #2FA0DA;
  -webkit-background-size: cover;
  background-size: cover;
  z-index: 9998;
}
#loader {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 241px;
  height: 187px;
  margin-top: -93px;
  margin-left: -120px;
  text-align: center;
  z-index: 9999;
}
#loader .img{margin-bottom: 30px;}
#loader .chara{font-size: 0;text-align: center;}
#loader .chara span{display: inline-block;margin-right: 2px;font-size: 0;}
#loader .chara span.c_1{animation: c_1 5s linear 0s infinite normal;width: 7px;}
#loader .chara span.c_2{animation: c_2 5s linear 0s infinite normal;width: 7px;}
#loader .chara span.c_3{animation: c_3 5s linear 0s infinite normal;width: 8px;}
#loader .chara span.c_4{animation: c_4 5s linear 0s infinite normal;width: 8px;}
#loader .chara span.c_5{animation: c_5 5s linear 0s infinite normal;width: 3px;}
#loader .chara span.c_6{animation: c_6 5s linear 0s infinite normal;width: 9px;}
#loader .chara span.c_7{animation: c_7 5s linear 0s infinite normal;width: 7px;}
#loader .chara span.c_8{animation: c_8 5s linear 0s infinite normal;width: 2px;}
#loader .chara span.c_9{animation: c_9 5s linear 0s infinite normal;width: 2px;}
#loader .chara span.c_10{animation: c_10 5s linear 0s infinite normal;width: 2px;}
@keyframes c_1 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(180deg);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(0);}
}
@keyframes c_2 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(180deg);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(0);}
}
@keyframes c_3 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(180deg);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(0);}
}
@keyframes c_4 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(180deg);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(0);}
}
@keyframes c_5 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(180deg);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(0);}
}
@keyframes c_6 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(180deg);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(0);}
}
@keyframes c_7 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(180deg);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(0);}
}
@keyframes c_8 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(180deg);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(0);}
}
@keyframes c_9 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(180deg);}
    100% {transform: rotateY(0);}
}
@keyframes c_10 {
    0% {transform: rotateY(0);}
    10% {transform: rotateY(0);}
    20% {transform: rotateY(0);}
    30% {transform: rotateY(0);}
    40% {transform: rotateY(0);}
    50% {transform: rotateY(0);}
    60% {transform: rotateY(0);}
    70% {transform: rotateY(0);}
    80% {transform: rotateY(0);}
    90% {transform: rotateY(0);}
    100% {transform: rotateY(180deg);}
}



html{background: #EBE2CB;}

#sec1{background: #EDE9E0;}
#sec1 .thumb_b:after{background-color: #B38248;}
#sec1 .thumb_s:after{background-color: #01913A;}
#sec2{background: #FCE6D9;}
#sec2 .thumb_b:after{background-color: #F3A5A2;}
#sec3{background: #E9DDB0;}
#sec3 .thumb_b:after{background-color: #F29874;}
#sec3 .thumb_s:after{background-color: #F6CF40;}
#sec4{background: #DDD1E7;}
#sec4 .thumb_b:after{background-color: #9172A3;}
#sec5{background: #FCE6D9;}
#sec5 .thumb_b:after{background-color: #F3A5A2;}

#vol2{background: #F3EDED;}
#vol2 p{color: #231815;}
#vol2 #sec0 p{font-size: 13px;letter-spacing: 0.05em;}
#vol2 #sec1{background: #DEE8D6;}
#vol2 #sec1 .thumb_b:after{background-color: #B28247;}
#vol2 #sec1 .thumb_s:after{background-color: #9D0131;}
#vol2 #sec2{background: #F0E4E1;}
#vol2 #sec2 .thumb_b:after{background-color: #E3B337;}
#vol2 #sec2 .thumb_s:after{background-color: #F9B8C0;}
#vol2 #sec3{background: #FAE5D0;}
#vol2 #sec3 .thumb_b:after{background-color: #F33A00;}
#vol2 #sec3 .thumb_s:after{background-color: #4C822B;}
#vol2 #sec4{background: #D9E4EA;}
#vol2 #sec4 .thumb_b:after{background-color: #9172A3;}
#vol2 #sec5{background: #DEE5DB;}
#vol2 #sec5 .thumb_b:after{background-color: #C19F76;}
#vol2 #sec5 .thumb_s:after{background-color: #52A4A7;}
@media screen and (min-width: 737px) {
  .pc-none{display: none;}
  .w900{width: 900px;margin:auto;}


  a{color: #2EA7E0;text-decoration: underline;font-size: 13px;letter-spacing: 0.01em;transition: 0.3s;}
  a:hover{color: #000;}

  footer{padding: 80px 0 90px;text-align: center;background: url(./img/f_bg@2x.png)no-repeat center;-webkit-background-size: cover;background-size: cover;}
  footer .f_logo{margin-bottom: 50px;}
  footer p{color: #fff !important;font-size: 12px;letter-spacing: 0.01em;}
  footer ul{font-size: 0;}
  footer li{font-size: 12px;color: #fff;display: inline-block;margin: 0 6px;}
  footer li a{text-decoration: none;color: #fff;}
  footer li a:hover{color: #FFF100;}
  footer p#copy{margin-top: 25px;font-size: 11px;letter-spacing: 0.07em;}

  .btn{text-align: center;font-size: 0;}
  .btn li{display: inline-block;width: 259px;margin-right: 62px;position: relative;}
  .btn li:last-of-type{margin-right: 0;}
  .btn li img.on{opacity: 0;position: absolute;top: 0;left: 0;}
  /*.btn li img{transition: 0.3s;}*/
  .btn li a:hover img.off{opacity: 0;}
  .btn li a:hover img.on{opacity: 1;}
  /*.btn li a:hover img{transform: scale(1.03);}*/
  #sec0 .btn{margin-top: 62px;}
  footer .btn{margin-bottom: 39px;}

  .bg-ambiance {
    height: 510px;
    background-repeat: none;
    background-attachment: fixed;
    background-position-x: 50%;
    z-index: 3;
    position: relative
  }

  .thumb {
    position: relative;
    z-index: 10;
    display: inline-block
  }
  .thumb:after {
    content: "";
    z-index: -1;
    position: absolute;
    top: 10px;
    left: -10px;
    width: 100%;
    height: 100%;
  }
  .thumb.thumb_b {
    position: absolute;
    top: -206px;
    right: 0;
    width: 612px;
  }
  .thumb.thumb_b img {
    width: 100%;
    height: auto
  }
  .thumb.thumb_s {
    position: absolute;
    top: 110px;
    right: 78px;
    width: 317px;
    z-index: 11;
  }
  .thumb.thumb_s img {
    width: 100%;
    height: auto
  }


  #sec0{padding: 0 0 90px;}
  #sec0 .main{margin-bottom: 68px;}
  #sec0 .ttl{margin-bottom: 30px;}
  #sec0 p{font-size: 14px;text-align: center;line-height: 1.8em;}
  section{padding: 64px 0 140px 0;position: relative;}
  section h2{margin-bottom: 84px;position: relative;z-index: 10;}
  section .ttl{padding-left: 174px;margin-bottom: 48px;
    background: url(./img/ico00.png)no-repeat left top;-webkit-background-size: 113px auto;background-size: 113px auto;}
  section .cont .l_ttl{float: left;width: 111px;}
  section .cont .txt{float: right;width: 729px;font-size: 16px;line-height: 1.87em;letter-spacing: 0.02em;}
  section .info{position: relative;}
  section .info .img{text-align: right;}
  #sec1 .ttl{background-image: url(./img/ico1@2x.png);}
  #sec1 .info .img img{margin-top: -47px;}
  #sec1 .info .link{position: absolute;bottom: 15px;left: 434px;}

  #sec2 .ttl{background-image: url(./img/ico2@2x.png);}
  #sec2 .info .img img{margin-top: -94px;}
  #sec2 .info .link{position: absolute;bottom: 15px;left: 461px;}

  #sec3 .ttl{background-image: url(./img/ico3@2x.png);}
  #sec3 .info .img img{margin-top: -66px;}
  #sec3 .info .link{position: absolute;bottom: 15px;left: 434px;}

  #sec4 .ttl{background-image: url(./img/ico4@2x.png);}
  #sec4 .info .img img{margin-top: -70px;}
  #sec4 .info .link{position: absolute;bottom: 21px;left: 389px;}

  #sec5 .ttl{background-image: url(./img/ico5@2x.png);}
  #sec5 .info .img img{margin-top: -98px;}
  #sec5 .info .link{position: absolute;bottom: 0;left: 434px;}



  .spacer-img-2 {
    position: relative
  }
  .img-toast {
    max-width: 100%;
    width: 100%;
    height: auto
  }

  #pagetop{position: fixed;bottom: 50px;right: 50%;margin-right: -550px;z-index: 999;display: none;}
  
  #vol2 section .ttl{height: 113px;}
  #vol2 #sec0 .ttl{margin-bottom: 22px;}
  #vol2 #sec1 .ttl{background-image: url(./img/vol2/ico1@2x.png);}
  #vol2 #sec2 .ttl{background-image: url(./img/vol2/ico2@2x.png);}
  #vol2 #sec3 .ttl{background-image: url(./img/vol2/ico3@2x.png);}
  #vol2 #sec4 .ttl{background-image: url(./img/vol2/ico4@2x.png);}
  #vol2 #sec5 .ttl{background-image: url(./img/vol2/ico5@2x.png);}
  #vol2 #sec1 .info .img img{margin-top: 11px;}
  #vol2 #sec2 .info .img img{margin-top: -19px;}
  #vol2 #sec3 .info .img img{margin-top: -21px;}
  #vol2 #sec4 .info .img img{margin-top: -28px;}
  #vol2 #sec5 .info .img img{margin-top: 44px;}
  #vol2 #sec2 .info .link{position: absolute;bottom: 12px;left: 459px;}
  #vol2 #sec3 .info .link{position: absolute;bottom: 12px;left: 422px;}
  #vol2 #sec4 .info .link{position: absolute;bottom: 41px;left: 422px;}
  #vol2 #sec5 .info .link{position: absolute;bottom: 7px;left: 422px;}
}

@media screen and (max-width: 736px) {
  .sp-none{display: none;}
  img{width: 100%;height: auto;}
  a{color: #2EA7E0;text-decoration: underline;font-size: 12px;letter-spacing: 0.01em;transition: 0.3s;word-break: break-all;}

  .bg-ambiance {
    height: 250px;
    background-repeat: none;
    background-position-x: 50%;
    z-index: 3;
    position: relative
  }
  .thumb {
    position: relative;
    z-index: 10;
    display: inline-block
  }
  .thumb:after {
    content: "";
    z-index: -1;
    position: absolute;
    top: 5px;
    left: -5px;
    width: 100%;
    height: 100%;
  }
  .thumb.thumb_b {
    position: absolute;
    top: -100px;
    right: 0;
    width: 60%;
  }
  .thumb.thumb_b img {
    width: 100%;
    height: auto
  }
  .thumb.thumb_s {
    position: absolute;
    top: 20px;
    right: 5%;
    width: 40%;
    z-index: 11;
  }
  .thumb.thumb_s img {
    width: 100%;
    height: auto
  }
  .spacer-img-2 {
    position: relative
  }
  .img-toast {
    max-width: 100%;
    width: 100%;
    height: auto
  }
  section{padding: 10% 5%;position: relative;}
  section h2{margin-bottom: 24px;padding-left: 32%;position: relative;z-index: 99;
    background: url(./img/ico1@2x.png)no-repeat left top;-webkit-background-size: auto 100%;background-size: auto 100%;}
  section .ttl{margin-bottom: 28px;}
  section .cont .l_ttl{padding-right: 20%;margin-bottom: 16px;}
  section .cont .txt{font-size: 13px;line-height: 1.8em;letter-spacing: 0.02em;margin-bottom: 32px;}
  section .info{position: relative;}
  section .info .img{text-align: right;}


  #sec0{padding: 0 0 64px;}
  #sec0 .main{margin-bottom: 40px;padding: 0;}
  #sec0 .ttl{margin-bottom: 16px;padding: 0 15%;}
  #sec0 p{font-size: 13px;line-height: 1.8em;padding: 0 5%;}
  #sec1 h2{background-image: url(./img/ico1@2x.png);}
 /* #sec1 .info .img img{margin-top: -47px;}
  #sec1 .info .link{position: absolute;bottom: 15px;left: 434px;}*/

  #sec2 h2{background-image: url(./img/ico2@2x.png);}
  /*#sec2 .info .img img{margin-top: -94px;}
  #sec2 .info .link{position: absolute;bottom: 15px;left: 461px;}*/

  #sec3 h2{background-image: url(./img/ico3@2x.png);}
 /* #sec3 .info .img img{margin-top: -66px;}
  #sec3 .info .link{position: absolute;bottom: 15px;left: 434px;}*/

  #sec4 h2{background-image: url(./img/ico4@2x.png);}
 /* #sec4 .info .img img{margin-top: -90px;}
  #sec4 .info .link{position: absolute;bottom: 21px;left: 434px;}*/

  #sec5 h2{background-image: url(./img/ico5@2x.png);}
  /*#sec5 .info .img img{margin-top: -117px;}
  #sec5 .info .link{position: absolute;bottom: 0;left: 434px;}*/
 

  /*#vol2 section .cont .l_ttl{padding-right: 40%;}*/
  #vol2 #sec1 h2{background-image: url(./img/vol2/ico1@2x.png);}
  #vol2 #sec2 h2{background-image: url(./img/vol2/ico2@2x.png);}
  #vol2 #sec3 h2{background-image: url(./img/vol2/ico3@2x.png);}
  #vol2 #sec4 h2{background-image: url(./img/vol2/ico4@2x.png);}
  #vol2 #sec5 h2{background-image: url(./img/vol2/ico5@2x.png);}



  footer{padding: 10% 5%;text-align: center;background: url(./img/f_bg@2x.png)no-repeat center;-webkit-background-size: cover;background-size: cover;}
  footer .f_logo{margin-bottom: 30px;padding: 0 25%;}
  footer p{color: #fff !important;font-size: 12px;letter-spacing: 0.01em;}
  footer ul{font-size: 0;}
  footer li{font-size: 12px;color: #fff;display: inline-block;margin: 0 6px 2px;}
  footer li.ico{display: none;}
  footer li a{text-decoration: none;color: #fff;}
  footer p#copy{margin-top: 25px;font-size: 11px;letter-spacing: 0.07em;}


  .btn{padding: 0 18%;}
  .btn li{margin-bottom: 10px;}
  .btn li:last-of-type{margin-bottom: 0;}
  .btn li img.off{display: none;}
  /*.btn li a:hover img{transform: scale(1.03);}*/

  #sec0 .btn{margin: 32px 5% 0;}
  footer .btn{margin-bottom: 32px;}

  #pagetop{position: fixed;bottom: 50px;right: 5%;z-index: 999;display: none;width: 18px;}
}