.mainVisual {
  padding: 0 0.6rem 0 0
}
.mainVisual img {
  width: 100%
}
.mainVisual .slider {
  position: relative;
  line-height: 1px
}
.mainVisual .slick-arrow {
  display: block;
  width: 0.12rem;
  height: 0.18rem;
  border: none;
  padding: 0;
  position: absolute;
  top: 50%;
  background: 0 0 / contain no-repeat;
  color: transparent;
  outline: none;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  -webkit-transition: -webkit-transform 0.3s ease-in;
  transition: -webkit-transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in, -webkit-transform 0.3s ease-in
}
.mainVisual .slick-prev {
  left: 0.2rem;
  z-index: +1;
  background-image: url("../images/ar-left.png")
}
.mainVisual .slick-prev:hover {
  -webkit-transform: translate(-10px, -50%);
  transform: translate(-10px, -50%)
}
.mainVisual .slick-next {
  right: 0.2rem;
  background-image: url("../images/ar-right.png")
}
.mainVisual .slick-next:hover {
  -webkit-transform: translate(10px, -50%);
  transform: translate(10px, -50%)
}
.mainVisual .slick-dots {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  bottom: 0.6rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}
.mainVisual .slick-dots li+li {
  margin: 0 0 0 0.05rem
}
.mainVisual .slick-dots button {
  width: 0.16rem;
  height: 0.03rem;
  border: none;
  padding: 0;
  background: #fff;
  color: transparent;
  outline: none;
  overflow: hidden;
  cursor: pointer
}
.mainVisual .slick-dots .slick-active button {
  background: #bd1200
}
@media only screen and (max-width: 959px) {
  .mainVisual {
    padding: 0 .4rem 0 0;
  }
  .mainVisual .slick-dots {
      bottom: 0.45rem
  }
}
@media only screen and (max-width: 599px) {
  .mainVisual {
    padding: 0 .2rem;
  }
  .mainVisual .slick-arrow {
      width: 0.24rem;
      height: 0.36rem
  }
  .mainVisual .slick-prev {
      left: 0.1rem
  }
  .mainVisual .slick-next {
      right: 0.1rem
  }
  .mainVisual .slick-dots {
      bottom: 0.5rem
  }
  .mainVisual .slick-dots li+li {
      margin: 0 0 0 0.09rem
  }
  .mainVisual .slick-dots button {
      width: 0.32rem;
      height: 0.06rem
  }
}
.banner {
  max-width: 12.2rem;
  margin: -0.4rem auto 0.6rem;
  padding: 0 1.1rem;
  position: relative
}

.banner ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background: #fff;
  -webkit-box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.1)
}
.banner ul li {
  width: 25%
}
.banner a {
  display: block;
  height: 1.3rem;
  position: relative;
  overflow: hidden
}
.banner a::after {
  content: '';
  display: block;
  width: 0;
  height: 0.05rem;
  position: absolute;
  right: 100%;
  bottom: 0;
  background: #b61100;
  -webkit-transition: -webkit-transform 0.5s ease-in;
  transition: -webkit-transform 0.5s ease-in;
  transition: transform 0.5s ease-in;
  transition: transform 0.5s ease-in, -webkit-transform 0.5s ease-in
}
.banner a:hover::after {
  width: 100%;
  -webkit-transform: translateX(200%);
  transform: translateX(200%)
}
.banner a:hover .name {
  width: 100%
}
.banner .image {
  width: calc(100% - 1rem);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden
}
.banner .image img {
  max-width: none;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}
.banner .name {
  width: 1rem;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  background: #fff;
  text-align: center;
  -webkit-transition: width 0.3s ease-in;
  transition: width 0.3s ease-in
}
.banner .name img {
  width: 1rem
}
.banner .name::after {
  content: '';
  display: block;
  width: 0.16rem;
  height: 0.16rem;
  position: absolute;
  right: 0.05rem;
  bottom: 0.05rem;
  background: url("../images/ico-ex01.png") 0 0 /contain no-repeat
}
@media only screen and (max-width: 959px) {
  .banner {
    width: 8.4rem;
    margin: -0.3rem auto .5rem;
    padding: 0;
    position: relative;
  }
  .banner a::after {
      content: none
  }
  .banner a:hover .image img {
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%)
  }
}
@media only screen and (max-width: 599px) {
  .banner {
    width: auto;
    margin: -0.3rem .4rem .5rem;
    padding: 0;
  }
  .banner ul {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap
  }
  .banner ul li {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      width: 50%;
      border-right: 1px solid #e5e5e5;
      border-bottom: 1px solid #e5e5e5
  }
  .banner ul li:nth-child(even) {
      border-right-style: none
  }
  .banner ul li:nth-child(n + 3) {
      border-bottom: none
  }
  .banner a {
      display: block;
      height: auto
  }
  .banner .image {
      display: none
  }
  .banner .name {
      width: auto;
      height: auto;
      position: relative
  }
  .banner .name img {
      width: auto
  }
  .banner .name::after {
      width: 0.2rem;
      height: 0.2rem;
      right: 0.09rem;
      bottom: 0.09rem;
      background-image: url("../images/ico-ex03.png")
  }
}
.guidance {
  padding: 0 0.4rem;
  margin-bottom: 0.6rem
}
.guidance_inner {
  max-width: 10.6rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1)
}
.guidance_inner > div {
  width: 25%;
  text-align: center;
  display: block
}
@media screen and (max-width: 599px) {
  .guidance_inner > div {
      width: 50%
  }
}
.guidance_inner > div+div a {
  border-left: 1px solid #e5e5e5
}
.guidance_inner>div+div:nth-child(2) a {
  border-left: none
}
@media screen and (max-width: 599px) {
  .guidance_inner>div+div:nth-child(3) a {
      border-left: none
  }
  .guidance_inner>div+div:nth-child(3),
  .guidance_inner>div+div:nth-child(4) {
      border-top: 1px solid #e5e5e5
  }
}
.guidance_inner > div * {
  min-height: 0;
  vertical-align: middle
}
.guidance_inner > div.title {
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #7e0c00;
  color: #fff;
  letter-spacing: 0.2em;
  font-size: 0.3rem;
  font-weight: bold
}
@media screen and (max-width: 599px) {
  .guidance_inner > div.title {
      font-size: 0.44rem;
      letter-spacing: 0.1em;
      font-family: "Lato"
  }
}
.guidance_inner > div a {
  display: block;
  padding-top: 0.42rem;
  padding-bottom: 0.21rem;
  background: #fff;
  height: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative
}
.guidance_inner > div a::before {
  content: '';
  width: 0;
  height: 100%;
  display: block;
  background: #b61100;
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease
}
.guidance_inner > div a span {
  position: relative;
  z-index: 10
}
.guidance_inner > div a span.icon {
  display: inline-block;
  position: relative
}
.guidance_inner > div a span.icon img {
  -webkit-transition: 0.6s ease;
  transition: 0.6s ease
}
.guidance_inner > div a span.icon img.ov {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0
}
.guidance_inner > div a span.text {
  display: block;
  font-size: 0.16rem;
  line-height: 1.5;
  letter-spacing: 0.1em;
  color: #222;
  margin-top: calc(.2rem - (((.16rem * 1.5) - .16rem) / 2));
  margin-bottom: calc(0rem - (((.16rem * 1.5) - .16rem) / 2));
}
.guidance_inner>div a:hover::before {
  width: 100%;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
  right: auto;
  left: 0
}
.guidance_inner>div a:hover span.icon img.df {
  opacity: 0
}
.guidance_inner>div a:hover span.icon img.ov {
  opacity: 1
}
.guidance_inner>div a:hover span.text {
  color: #fff
}
@media screen and (max-width: 599px) {
  .guidance_inner > div a {
      padding-top: 0.6rem;
      padding-bottom: 0.72rem
  }
  .guidance_inner > div a.long {
      padding-top: 0.6rem;
      padding-bottom: 0.26rem
  }
  .guidance_inner > div a span.icon {
      width: 0.9rem
  }
  .guidance_inner > div a span.text {
      font-size: 0.28rem;
      letter-spacing: 0;
      line-height: 1.214285714
  }
}
.contentBox .inner {
  max-width: 1088px;
  width: 100%;
  padding: 0 0.32rem;
  margin-left: auto;
  margin-right: auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}
@media screen and (max-width: 599px) {
  .contentBox .inner {
      padding: 0 0.6rem
  }
}
.contentBox .titleA {
  font-family: "Lato";
  font-size: calc(100vw * 106 / 1440);
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 0.47rem
}
@media screen and (min-width: 1441px) {
  .contentBox .titleA {
      font-size: 1.06rem
  }
}
@media screen and (max-width: 599px) {
  .contentBox .titleA {
      text-align: center;
      font-size: 1.06rem
  }
}
.contentBox .titleB {
  font-size: 0.28rem;
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: 0.06em;
  margin-top: calc(0px - (((.28rem * 1.5) - .28rem) / 2));
  margin-bottom: calc(0px - (((.28rem * 1.5) - .28rem) / 2));
  color: #222
}
@media screen and (max-width: 599px) {
  .contentBox .titleB {
      font-size: 0.42rem;
      margin-top: calc(0px - (((.42rem * 1.5) - .42rem) / 2));
      margin-bottom: calc(0px - (((.42rem * 1.5) - .42rem) / 2));
  }
}
.contentBox .titleC {
  font-size: 0.28rem;
  line-height: 1.3;
  letter-spacing: 0.06em;
  display: inline-block;
  padding-top: 0.3rem;
  padding-right: 1.29rem;
  padding-bottom: 0.29rem;
  position: relative;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.6rem
}
.contentBox .titleC.small {
  padding-right: 0.65rem
}
.contentBox .titleC > span {
  display: block;
  position: relative;
  z-index: 10
}
.contentBox .titleC > span .smallTxt {
  display: block;
  font-size: 57.142857143%;
  line-height: 1.6875;
  letter-spacing: 0.1em;
  font-weight: 400;
  margin-top: 0.08rem
}
@media screen and (max-width: 599px) {
  .contentBox .titleC {
      display: block;
      width: 100%;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      font-size: 0.42rem;
      padding-top: 0.27rem;
      padding-bottom: 0.26rem;
      padding-right: 0
  }
}
.contentBox .titleC::before {
  content: '';
  width: 1500px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  background: #b61100
}
@media screen and (max-width: 599px) {
  .contentBox .titleC::before {
      width: calc(100% + .6rem);
      right: auto;
      left: -0.6rem
  }
}
.contentBox .ctext {
  font-size: 0.14rem;
  letter-spacing: 0.1em;
  line-height: 1.714285714;
  color: #222;
  margin-top: calc(0px - (((.14rem * 1.714285714) - .14rem) / 2));
  margin-bottom: calc(0px - (((.14rem * 1.714285714) - .14rem) / 2));
}
@media screen and (max-width: 599px) {
  .contentBox .ctext {
      font-size: 0.22rem;
      margin-top: calc(0px - (((.22rem * 1.714285714) - .22rem) / 2));
      margin-bottom: calc(0px - (((.22rem * 1.714285714) - .22rem) / 2))
  }
}
#outline {
  background-image: url('../../images/outline_bg03.png'), url('../../images/outline_bg02.png'), url('../../images/outline_bg01.jpg');
  background-position: left top, left top, top left;
  background-repeat: repeat, no-repeat, no-repeat;
  background-size: auto, auto, cover;
  padding-top: 0.43rem;
  padding-bottom: 0.6rem;
  position: relative
}
@media screen and (max-width: 599px) {
  #outline {
      background-image: url('../../images/outline_bg03_1_sp.png'), url('../../images/outline_bg01_sp.jpg');
      background-position: center top, center bottom;
      background-repeat: no-repeat, no-repeat;
      background-size: 100% auto, 100% auto;
      background-color: #e9e9e9;
      padding-top: 0.5rem;
      padding-bottom: 2.9rem
  }
}
#outline > img {
  width: 100%
}
#outline .inner .titleA {
  margin-left: -0.09rem
}
#outline .inner .titleB+.ctext {
  margin-top: calc(.3rem - (((.14rem * 1.714285714) - .14rem) / 2));
  margin-bottom: calc(0px - (((.14rem * 1.714285714) - .14rem) / 2));
}
@media screen and (max-width: 599px) {
  #outline .inner .titleB {
      padding: 0 0.2rem
  }
  #outline .inner .titleB+.ctext {
      padding: 0 0.2rem;
      margin-top: calc(.3rem - (((.42rem * 1.5) - .42rem) / 2));
      margin-bottom: calc(0px - (((.42rem * 1.5) - .42rem) / 2));
  }
}
#outline .inner .bgBox {
  margin-top: 0.32rem;
  max-width: 504px;
  width: 100%;
  background: rgba(255, 255, 255, 0.7);
  padding: 0.34rem 0.32rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}
#outline .inner .bgBoxInner {
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center
}
#outline .inner .bgBoxInner > div.logo {
  width: 20%
}
#outline .inner .bgBoxInner > div.text {
  width: 71.136363636%;
  font-size: 0.2rem;
  line-height: 1.5;
  letter-spacing: 0.04em
}
@media screen and (max-width: 599px) {
  #outline .inner .bgBox {
      width: 100%
  }
  #outline .inner .bgBoxInner > div.text {
      font-size: 0.26rem;
      letter-spacing: 0.06em
  }
}
#development {
  margin-top: 0.6rem
}
#development .inner .clm3_1 {
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}
#development .inner .clm3_1 .large {
  text-align: center;
  width: 65.625%
}
#development .inner .clm3_1 .small {
  width: 31.25%
}
@media screen and (max-width: 599px) {
  #development .inner .clm3_1 .large {
      width: 100%
  }
  #development .inner .clm3_1 .small {
      width: 100%;
      margin-top: 0.4rem
  }
}
#development .inner .clm3_n {
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 0.26rem
}
@media screen and (max-width: 599px) {
  #development .inner .clm3_n {
      margin-top: 30px
  }
}
#development .inner .clm3_n > div {
  width: 31.25%
}
@media screen and (max-width: 599px) {
  #development .inner .clm3_n > div {
      width: 100%
  }
  #development .inner .clm3_n > div+div {
      margin-top: 0.6rem
  }
}
#development .inner .textBox .smallTtl {
  font-size: 0.16rem;
  line-height: 1.5;
  letter-spacing: 0.1em;
  margin-top: calc(0px - (((.16rem * 1.5) - .16rem) / 2));
  margin-bottom: calc(0px - (((.16rem * 1.5) - .16rem) / 2));
  font-weight: 700;
  color: #b60000
}
#development .inner .textBox .smallTtl+.ctext {
  margin-top: calc(.18rem - (((.14rem * 1.714285714) - .14rem) / 2));
}
@media screen and (max-width: 599px) {
  #development .inner .textBox .smallTtl {
      font-size: 0.24rem
  }
  #development .inner .textBox .smallTtl+.ctext {
      font-size: 0.22rem;
      margin-top: calc(.32rem - (((.22rem * 1.714285714) - .22rem) / 2));
  }
}
#development .inner .textBox+.textBox {
  margin-top: 0.26rem
}
@media screen and (max-width: 599px) {
  #development .inner .textBox+.textBox {
      margin-top: 30px
  }
}
#spec {
  margin-top: 1rem
}
#spec .inner dl {
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}
#spec .inner dl.first {
  border-top: 1px solid #c17f78;
  border-bottom: 1px solid #c17f78
}
#spec .inner dl+dl {
  border-bottom: 1px solid #c17f78
}
#spec .inner dl dt,
#spec .inner dl dd {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0.23rem 0.3rem;
  font-size: 0.16rem;
  line-height: 1.5
}
#spec .inner dl dt {
  width: 31.25%
}
#spec .inner dl dd {
  width: 68.75%
}
@media screen and (max-width: 599px) {
  #spec .inner dl.first {
      border-top: none;
      border-bottom: none
  }
  #spec .inner dl+dl {
      border-bottom: none
  }
  #spec .inner dl dt,
  #spec .inner dl dd {
      width: 100%;
      font-size: 0.24rem;
      letter-spacing: 0.06em
  }
  #spec .inner dl dt {
      background: #c17f78
  }
}
#access {
  margin-top: 1rem
}
#access .inner .map01 {
  text-align: center;
  background: #f8f8f8;
  -webkit-box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1)
}
#access .inner .map02 {
  margin-top: 0.4rem;
  text-align: center
}
#access .inner .map02+.caption {
  max-width: 993px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.2rem;
  font-size: 0.1rem;
  letter-spacing: 0.06em;
  line-height: 1.5
}
@media screen and (max-width: 599px) {
  #access .inner .map02+.caption {
      font-size: 0.2rem
  }
}
#plan {
  margin-top: 1rem
}
#plan table tr.gray {
  background: #f4f4f4
}
#plan table tr th {
  padding: calc(.3rem - (((.16rem * 1.5) -  .16rem))) 0.2rem calc(.3rem - (((.16rem * 1.5) -  .16rem))) 0.2rem;
  font-weight: 400;
  font-size: 0.16rem;
  letter-spacing: 0.06em;
  line-height: 1.5;
  width: 1.91rem;
  text-align: right;
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}
#plan table tr th+td {
  overflow: hidden
}
#plan table tr th+td::before {
  content: '';
  width: 2px;
  height: 240%;
  display: block;
  background: #b61100;
  position: absolute;
  bottom: 0;
  left: 0.09rem
}
#plan table tr th+td::after {
  content: '';
  width: 0.2rem;
  height: 0.2rem;
  display: block;
  background: #b61100;
  position: absolute;
  top: 1.4em;
  left: 0;
  border-radius: 50%
}
#plan table tr th+td.circle_start::before {
  height: calc(100% - .4rem)
}
#plan table tr th+td.circle_end::before {
  bottom: auto;
  top: 0;
  height: calc(100% - .4rem)
}
@media screen and (max-width: 599px) {
  #plan table tr th {
      display: none
  }
  #plan table tr th+td::before {
      left: 0.44rem;
      width: 0.04rem
  }
  #plan table tr th+td::after {
      top: 0.9em;
      width: 0.3rem;
      height: 0.3rem;
      left: 0.3rem
  }
  #plan table tr th+td.circle_end::before {
      bottom: auto;
      top: 0;
      height: 1.5em
  }
  #plan table tr th+td .sp {
      margin-bottom: 0.1rem;
      display: block
  }
}
#plan table tr td {
  padding: calc(.3rem - (((.16rem * 1.5) -  .16rem))) 0 calc(.3rem - (((.16rem * 1.5) -  .16rem))) 0.4rem;
  font-size: 0.16rem;
  letter-spacing: 0.06em;
  line-height: 1.5;
  position: relative
}
@media screen and (max-width: 599px) {
  #plan table tr td {
      padding-left: 0.9rem;
      font-size: 0.24rem
  }
}
#plan table tr td+td {
  padding: calc(.3rem - (((.16rem * 1.5) -  .16rem))) 0.3rem calc(.3rem - (((.16rem * 1.5) -  .16rem))) 0.22rem;
  text-align: center
}
@media screen and (max-width: 599px) {
  #plan table tr td+td {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      width: 2.32rem
  }
}
#plan table tr td+td img {
  -webkit-box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1)
}
#plan table tr td+td img.small {
  width: 1.16rem
}
#composition {
  margin-top: 0.73rem;
  position: relative;
  background: url('../../images/composition_bg.jpg') no-repeat center;
  background-size: cover
}
#composition img {
  width: 100%
}
#composition::before {
  content: '';
  width: 100%;
  height: 100%;
  background: url('../../images/outline_bg03.png') center center repeat;
  position: absolute;
  top: 0;
  left: 0
}
#composition .titleA {
  position: absolute;
  width: 100%;
  text-align: center;
  top: 6.5%;
  left: 0
}
@media screen and (max-width: 599px) {
  #composition {
      background: url('../../images/composition_bg_sp.jpg') no-repeat center;
      background-size: cover
  }
  #composition::before {
      background: url('../../images/outline_bg03_sp.png') center center repeat
  }
}
#harukas {
  margin-top: 0.6rem
}
#harukas .inner .titleC {
  margin-bottom: 0.6rem;
  padding-top: 0.38rem;
  padding-bottom: 0.37rem
}
#harukas .inner .titleC span {
  line-height: 1.3
}
#harukas .inner .smallInner {
  max-width: 912px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start
}
#harukas .inner .smallInner > div {
  width: 48.245614035%
}
@media screen and (max-width: 599px) {
  #harukas .inner .smallInner > div img {
      width: 3.6rem;
      margin-left: auto;
      margin-right: auto
  }
}
#harukas .inner .smallInner > div .btnInner {
  max-width: 408px;
  width: 100%
}
#harukas .inner .smallInner > div .btnInner .btnBox+.btnBox {
  margin-top: 0.2rem
}
#harukas .inner .smallInner > div .btnInner .btnBox a {
  display: block;
  position: relative;
  padding: 0 0.35rem 0 0.19rem;
  height: 0.85rem;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
  background: #fff;
  -webkit-box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1)
}
#harukas .inner .smallInner > div .btnInner .btnBox a span {
  font-family: "Lato";
  font-weight: 700;
  letter-spacing: 0.1em;
  font-size: 0.16rem;
  line-height: 1.5;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease
}
#harukas .inner .smallInner > div .btnInner .btnBox a i {
  font-size: 0.16rem;
  line-height: 1;
  letter-spacing: normal;
  position: absolute;
  right: 0.17rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease
}
#harukas .inner .smallInner>div .btnInner .btnBox a:hover span {
  color: #b61100
}
#harukas .inner .smallInner>div .btnInner .btnBox a:hover i {
  color: #b61100;
  -webkit-transform: translateY(-50%) rotate(90deg);
  transform: translateY(-50%) rotate(90deg)
}
#harukas .inner .smallInner > div .btnInner .btnBox.btn01 a {
  outline: 3px solid #f3be1a;
  outline-offset: -3px
}
#harukas .inner .smallInner>div .btnInner .btnBox.btn01 a:hover {
  outline: 3px solid #b61100;
  outline-offset: -3px
}
@media screen and (max-width: 599px) {
  #harukas .inner .smallInner > div .btnInner .btnBox.btn01 a {
      outline: 4px solid #f3be1a;
      outline-offset: -4px
  }
}
#harukas .inner .smallInner > div .btnInner .btnBox.btn02 a {
  outline: 3px solid #e77d1f;
  outline-offset: -3px
}
#harukas .inner .smallInner>div .btnInner .btnBox.btn02 a:hover {
  outline: 3px solid #b61100;
  outline-offset: -3px
}
@media screen and (max-width: 599px) {
  #harukas .inner .smallInner > div .btnInner .btnBox.btn02 a {
      outline: 4px solid #e77d1f;
      outline-offset: -4px
  }
}
#harukas .inner .smallInner > div .btnInner .btnBox.btn03 a {
  outline: 3px solid #0f97c5;
  outline-offset: -3px
}
#harukas .inner .smallInner>div .btnInner .btnBox.btn03 a:hover {
  outline: 3px solid #b61100;
  outline-offset: -3px
}
@media screen and (max-width: 599px) {
  #harukas .inner .smallInner > div .btnInner .btnBox.btn03 a {
      outline: 4px solid #0f97c5;
      outline-offset: -4px
  }
}
#harukas .inner .smallInner > div .btnInner .btnBox.btn04 a {
  outline: 3px solid #9973af;
  outline-offset: -3px
}
#harukas .inner .smallInner>div .btnInner .btnBox.btn04 a:hover {
  outline: 3px solid #b61100;
  outline-offset: -3px
}
@media screen and (max-width: 599px) {
  #harukas .inner .smallInner > div .btnInner .btnBox.btn04 a {
      outline: 4px solid #9973af;
      outline-offset: -4px
  }
}
#harukas .inner .smallInner > div .btnInner .btnBox.btn05 a {
  height: 1.18rem;
  outline: 3px solid #d46fa4;
  outline-offset: -3px
}
#harukas .inner .smallInner>div .btnInner .btnBox.btn05 a:hover {
  outline: 3px solid #b61100;
  outline-offset: -3px
}
@media screen and (max-width: 599px) {
  #harukas .inner .smallInner > div .btnInner .btnBox.btn05 a {
      outline: 4px solid #d46fa4;
      outline-offset: -4px
  }
}
#harukas .inner .smallInner > div .btnInner .btnBox.btn06 a {
  outline: 3px solid #4fb9b5;
  outline-offset: -3px
}
#harukas .inner .smallInner>div .btnInner .btnBox.btn06 a:hover {
  outline: 3px solid #b61100;
  outline-offset: -3px
}
@media screen and (max-width: 599px) {
  #harukas .inner .smallInner > div .btnInner .btnBox.btn06 a {
      outline: 4px solid #4fb9b5;
      outline-offset: -4px
  }
}
@media screen and (max-width: 599px) {
  #harukas .inner .smallInner > div {
      width: 100%
  }
  #harukas .inner .smallInner > div.imgBox {
      text-align: center
  }
  #harukas .inner .smallInner > div.imgBox+div {
      margin-top: 0.8rem
  }
  #harukas .inner .smallInner > div .btnInner {
      display: -ms-flex;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1);
      box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1);
      max-width: none
  }
  #harukas .inner .smallInner > div .btnInner > div {
      width: 50%
  }
  #harukas .inner .smallInner > div .btnInner > div.btnBox+.btnBox {
      margin-top: auto
  }
  #harukas .inner .smallInner > div .btnInner > div.btnBox a {
      font-size: 0.2rem;
      line-height: 1.5;
      letter-spacing: 0.06em;
      min-height: 2.03rem;
      -webkit-box-shadow: none;
      box-shadow: none
  }
  #harukas .inner .smallInner > div .btnInner > div.btnBox.btn05 a {
      min-height: 2.03rem
  }
}
#harukas .inner .clm2_n {
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  margin-top: 0.6rem
}
#harukas .inner .clm2_n .imageArea {
  width: 48.4375%;
  -webkit-box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1)
}
#harukas .inner .clm2_n .imageArea img {
  width: 100%
}
#harukas .inner .clm2_n .textArea {
  width: 48.4375%
}
#harukas .inner .clm2_n .textArea .clmTtl {
  font-size: 0.24rem;
  line-height: 1.291666667;
  letter-spacing: 0.1em;
  color: #b60000;
  font-weight: 700;
  margin-top: calc(0px - (((.24rem * 1.291666667) - .24rem) / 2));
  margin-bottom: calc(0px - (((.24rem * 1.291666667) - .24rem) / 2));
}
#harukas .inner .clm2_n .textArea .contTxt p {
  font-size: 0.14rem;
  line-height: 1.5;
  letter-spacing: 0.1em;
  margin-top: calc(.2rem - (((.14rem * 1.5) - .14rem) / 2));
  margin-bottom: calc(0px - (((.14rem * 1.5) - .14rem) / 2));
}
#harukas .inner .clm2_n .textArea .contTxt p+p {
  margin-top: calc(.3rem - (((.14rem * 1.5) - .14rem) / 2));
}
#harukas .inner .clm2_n .textArea .contTxt p+p a {
  padding-left: 0.26rem;
  display: block;
  position: relative;
  margin-top: 5px
}
#harukas .inner .clm2_n .textArea .contTxt p+p a::before {
  content: '';
  width: 0.14rem;
  height: 0.14rem;
  display: block;
  background: url('../../images/harukas_link.jpg') no-repeat center;
  background-size: cover;
  position: absolute;
  top: 0.2em;
  left: 0
}
#harukas .inner .clm2_n .textArea .contTxt p+p a span {
  position: relative;
  display: inline-block
}
#harukas .inner .clm2_n .textArea .contTxt p+p a span::after {
  content: '';
  width: 100%;
  height: 1px;
  display: block;
  background: #b61100;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
  -webkit-transform-origin: right;
  transform-origin: right
}
#harukas .inner .clm2_n .textArea .contTxt p+p a:hover span::after {
  -webkit-transform: scale(0);
  transform: scale(0)
}
#harukas .inner .clm2_n.rev .imageArea {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2
}
@media screen and (max-width: 599px) {
  #harukas .inner .clm2_n.rev .imageArea {
      -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
      order: 1
  }
}
#harukas .inner .clm2_n.rev .textArea {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1
}
@media screen and (max-width: 599px) {
  #harukas .inner .clm2_n.rev .textArea {
      -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
      order: 2
  }
}
@media screen and (max-width: 599px) {
  #harukas .inner .clm2_n {
      margin-top: 0.6rem
  }
  #harukas .inner .clm2_n .imageArea,
  #harukas .inner .clm2_n .textArea {
      width: 100%
  }
  #harukas .inner .clm2_n .textArea {
      margin-top: 0.4rem
  }
  #harukas .inner .clm2_n .textArea .clmTtl {
      font-size: 0.36rem;
      line-height: 1.5;
      margin-top: calc(0px - (((.36rem * 1.5) - .36rem) / 2));
      margin-bottom: calc(0px - (((.36rem * 1.5) - .36rem) / 2))
  }
  #harukas .inner .clm2_n .textArea .contTxt p {
      font-size: 0.22rem;
      line-height: 1.5;
      margin-top: calc(.4rem - (((.22rem * 1.5) - .22rem) / 2));
      margin-bottom: calc(0px - (((.22rem * 1.5) - .22rem) / 2))
  }
  #harukas .inner .clm2_n .textArea .contTxt p+p {
      margin-top: calc(.5rem - (((.22rem * 1.5) - .22rem) / 2))
  }
  #harukas .inner .clm2_n .textArea .contTxt p+p a {
      padding-left: 0.5rem
  }
  #harukas .inner .clm2_n .textArea .contTxt p+p a::before {
      content: '';
      width: 0.28rem;
      height: 0.28rem;
      display: block;
      background: url('../../images/harukas_link.jpg') no-repeat center;
      background-size: cover;
      position: absolute;
      top: 0.2em;
      left: 0
  }
  #harukas .inner .clm2_n .textArea .contTxt p+p a span::after {
      content: none
  }
}
#information {
  margin-top: 1rem;
  position: relative;
  background: url('../../images/info_bg.jpg') no-repeat center;
  background-size: cover
}
#information img {
  width: 100%
}
#information::before {
  content: '';
  width: 100%;
  height: 100%;
  background: url('../../images/outline_bg03.png') center center repeat;
  position: absolute;
  top: 0;
  left: 0
}
#information .titleA {
  position: absolute;
  width: 100%;
  text-align: center;
  top: 6.5%;
  left: 0
}
@media screen and (max-width: 599px) {
  #information {
      background: url('../../images/info_bg_sp.jpg') no-repeat center;
      background-size: cover
  }
  #information::before {
      background: url('../../images/outline_bg03_sp.png') center center repeat
  }
  #information .titleA {
      letter-spacing: normal
  }
}
#town {
  margin-top: 0.6rem
}
#town .inner .titleC > span {
  line-height: 1.3
}
#town .inner .titleC > span .smallTxt {
  margin-top: 0.08rem
}
#town .inner .contBlock .textArea .contTtl {
  font-size: 0.24rem;
  line-height: 1.291666667;
  letter-spacing: 0.1em;
  color: #b60000;
  font-weight: 700;
  margin-top: calc(0px - (((.24rem * 1.291666667) - .24rem) / 2));
  margin-bottom: calc(0px - (((.24rem * 1.291666667) - .24rem) / 2));
}
#town .inner .contBlock .textArea .contTxt {
  font-size: 0.14rem;
  line-height: 1.5;
  letter-spacing: 0.1em;
  margin-top: calc(.18rem - (((.14rem * 1.5) - .14rem) / 2));
  margin-bottom: calc(0px - (((.14rem * 1.5) - .14rem) / 2));
}
@media screen and (max-width: 599px) {
  #town .inner .contBlock .textArea .contTtl {
      font-size: 0.36rem;
      line-height: 1.5;
      margin-top: calc(0px - (((.36rem * 1.5) - .36rem) / 2));
      margin-bottom: calc(0px - (((.36rem * 1.5) - .36rem) / 2))
  }
  #town .inner .contBlock .textArea .contTxt {
      font-size: 0.22rem;
      line-height: 1.5;
      margin-top: calc(.4rem - (((.22rem * 1.5) - .22rem) / 2));
      margin-bottom: calc(0px - (((.22rem * 1.5) - .22rem) / 2))
  }
}
#town .inner .contBlock .imageArea {
  margin-top: 0.4rem
}
@media screen and (max-width: 599px) {
  #town .inner .contBlock .imageArea {
      margin-top: 0.4rem
  }
}
#town .inner .contBlock .imageArea .clm2_n {
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between
}
#town .inner .contBlock .imageArea .clm2_n > div {
  width: 48.4375%
}
#town .inner .contBlock .imageArea .clm2_n > div img {
  width: 100%
}
@media screen and (max-width: 599px) {
  #town .inner .contBlock .imageArea .clm2_n > div {
      width: 100%
  }
  #town .inner .contBlock .imageArea .clm2_n > div+div {
      margin-top: 0.4rem
  }
}
#town .inner .contBlock+.contBlock {
  margin-top: 0.6rem
}
#area {
  margin-top: 1rem;
  padding-bottom: 1rem
}
#area .inner .map {
  text-align: center
}
/*# sourceMappingURL=top.css.map */

/* 利用規約からのアンカーリンク */
.anchor {
  position: absolute;
  top: -1.05rem;
}
@media screen and (max-width: 959px) {
  .anchor {
    top: -0.6rem;
  }
}
@media screen and (max-width: 599px) {
  .anchor {
    top: -1.2rem;
  }
}