.con_pnav, .con_roo .box_roo, .con_overview {
  width: 95%;
  max-width: 1200px;
  margin: auto
}

@media only screen and (max-width: 767px) {
  .con_pnav, .con_roo .box_roo, .con_overview {
    width: 91.66667%
  }
}

@font-face {
  font-family: 'Hannari';
  src: url("font/Hannari.woff") format("woff"), url("font/Hannari.otf’") format("opentype")
}

.list_style_c>li {
  padding-left: 1em;
  text-indent: -0.7em
}

.list_style_c>li:before {
  content: '●';
  font-size: 59%;
  color: #e1d6b5;
  margin-right: 0.3em;
  font-family: "Yu Gothic", "游ゴシック体", "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", YuGothic, "MS Ｐゴシック", "MS PGothic", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, sans-serif
}

.con_intr {
  max-width: 1830px;
  margin: 40px auto 7.8125%;
  position: relative
}

@media only screen and (max-width: 1023px) {
  .con_intr {
    width: 100%;
    margin: 5% auto 3em;
    padding: 1.5em 0;
    background: url(../images/common/bg01.jpg) repeat 0 0
  }
}

.con_intr:before {
  content: '';
  width: 75.13661%;
  height: 100%;
  position: absolute;
  right: 0;
  bottom: 0;
  background: url(../images/common/bg01.jpg) repeat 0 0
}

@media only screen and (max-width: 1023px) {
  .con_intr:before {
    content: none
  }
}

.con_intr:after {
  content: '';
  width: 17.48634%;
  height: 100%;
  position: absolute;
  right: 0;
  bottom: 0;
  background: url(../images/home/bg_acc.jpg) repeat 0 0
}

.con_intr .box_intr {
  width: 500px;
  position: absolute;
  top: 12.5%;
  left: 50%;
  margin-left: 50px;
  z-index: 1
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_intr .box_intr {
    width: 41.70142%
  }
}

@media only screen and (max-width: 1023px) {
  .con_intr .box_intr {
    position: relative;
    left: auto;
    top: auto;
    width: 91.66667%;
    margin: 0 auto 1em
  }
}

.con_intr .box_intr .sst {
  text-align: center;
  background: #000;
  font-size: 118%;
  letter-spacing: .2em;
  color: #cbb77d;
  padding: 0.1em 0 0.4em
}

@media only screen and (max-width: 1199px) {
  .con_intr .box_intr .sst {
    font-size: 106%
  }
}

@media only screen and (max-width: 767px) {
  .con_intr .box_intr .sst {
    letter-spacing: .1em;
    font-size: 100%
  }
}

.con_intr .box_intr h3 {
  font-weight: normal;
  letter-spacing: .28em;
  font-size: 195%
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_intr .box_intr h3 {
    font-size: 153%
  }
}

@media only screen and (max-width: 767px) {
  .con_intr .box_intr h3 {
    font-size: 130%;
    letter-spacing: .2em
  }
}

.con_intr .box_intr .txt {
  line-height: 2.25;
  margin-top: 0.5em
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_intr .box_intr .txt {
    line-height: 2
  }
}

@media only screen and (max-width: 767px) {
  .con_intr .box_intr .txt {
    line-height: 1.8
  }
}

.con_intr .photo {
  width: 910px;
  position: relative;
  left: 50%;
  top: 0;
  margin-left: -910px;
  z-index: 1;
  -moz-transform: translateY(-40px);
  -ms-transform: translateY(-40px);
  -webkit-transform: translateY(-40px);
  transform: translateY(-40px)
}

@media only screen and (max-width: 1023px) {
  .con_intr .photo {
    left: auto;
    top: auto;
    width: 91.66667%;
    margin: 0 auto;
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
}

.con_intr .line:before {
  content: '';
  position: absolute;
  bottom: -5px;
  right: 0;
  width: 75.13661%;
  height: 5px;
  background: url(../../hotspring/images/line_intr.jpg) repeat 0 0
}

@media only screen and (max-width: 1023px) {
  .con_intr .line:before {
    width: 100%
  }
}

.con_pnav .box_pnav {
  margin: auto
}

@media only screen and (min-width: 768px) {
  .con_pnav .box_pnav {
    overflow: hidden;
    max-width: 797px
  }
}

@media only screen and (min-width: 768px) {
  .con_pnav .box_pnav li {
    float: left;
    width: 22.9611%;
    margin-left: 2.5596%
  }
  .con_pnav .box_pnav li:nth-child(1) {
    margin-left: 12.54705%
  }
  .con_pnav .box_pnav li:nth-child(4) {
    margin-left: 0
  }
  .con_pnav .box_pnav li:nth-child(1), .con_pnav .box_pnav li:nth-child(4) {
    clear: both
  }
  .con_pnav .box_pnav li:nth-child(n+4) {
    margin-top: 18px
  }
}

@media only screen and (max-width: 767px) {
  .con_pnav .box_pnav li {
    float: none;
    width: 100%;
    margin: 2% auto 0
  }
  .con_pnav .box_pnav li:first-child {
    margin: 0 auto
  }
}

.con_pnav .box_pnav li a {
  display: block;
  text-decoration: none;
  background: #fff;
  color: #2f2f2f;
  text-align: center;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}

@media only screen and (max-width: 767px) {
  .con_pnav .box_pnav li a {
    letter-spacing: -.4em;
    padding: 1%;
    position: relative;
    text-align: left
  }
}

.con_pnav .box_pnav li a:after {
  content: "";
  font-family: FontAwesome;
  margin-left: .5em;
  color: #8d8a82;
  margin: auto;
  font-size: 95%;
  display: block;
  text-align: center;
  line-height: 1;
  padding-top: 5px;
  border-top: 1px solid #b04c2e
}

@media only screen and (max-width: 767px) {
  .con_pnav .box_pnav li a:after {
    width: 1.2em;
    height: calc(100% + 4%);
    top: -2%;
    right: 0;
    position: absolute;
    text-align: center;
    padding-top: 1.8em;
    border-top: none;
    letter-spacing: normal;
    border-left: 1px solid #b04c2e;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
  }
}

.con_pnav .box_pnav li a .img {
  padding: 5.46448%
}

@media only screen and (max-width: 767px) {
  .con_pnav .box_pnav li a .img {
    display: inline-block;
    letter-spacing: normal;
    vertical-align: middle;
    width: 30%;
    padding: 0
  }
}

.con_pnav .box_pnav li a .st {
  padding: 0.5em 0 1em
}

@media only screen and (max-width: 767px) {
  .con_pnav .box_pnav li a .st {
    display: inline-block;
    letter-spacing: normal;
    vertical-align: middle;
    width: 65%;
    padding: 0 0 0.25em 0.25em;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
  }
}

.con_pnav .box_pnav li a .st.st02 {
  line-height: 1.25
}

@media only screen and (min-width: 768px) {
  .con_pnav .box_pnav li a .st.st02 {
    padding: 0 0 0.6em
  }
}

.con_roo {
  margin-top: 120px
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_roo {
    margin-top: 10%
  }
}

@media only screen and (max-width: 767px) {
  .con_roo {
    margin-top: 4em
  }
}

@media only screen and (min-width: 1200px) {
  .con_roo#view_mod {
    margin-top: 100px
  }
}

@media print {
  .con_roo#view_mod {
    margin-top: 100px
  }
}

.con_roo .main_title {
  margin-bottom: 30px
}

@media only screen and (max-width: 767px) {
  .con_roo .main_title {
    margin-bottom: 4%
  }
}

.con_roo .wrp_photo {
  position: relative;
  background: url(../images/home/bg_po01.png) repeat left top;
  margin-bottom: 40px
}

@media only screen and (max-width: 767px) {
  .con_roo .wrp_photo {
    margin-bottom: 0.6em
  }
}

.con_roo .wrp_photo:after {
  content: '';
  width: 100%;
  height: 33%;
  position: absolute;
  left: 0;
  bottom: 0;
  background: url(../images/home/bg_po01-2.png) repeat left bottom;
  z-index: 0
}

.con_roo .wrp_photo .box_photo {
  max-width: 1620px;
  margin: auto;
  width: 95%;
  z-index: 1;
  position: relative
}

@media only screen and (max-width: 767px) {
  .con_roo .wrp_photo .box_photo {
    width: 91.66667%
  }
}

@media only screen and (min-width: 768px) and (max-width: 983px) {
  .con_roo .wrp_photo .box_photo .photo {
    overflow: hidden
  }
  .con_roo .wrp_photo .box_photo .photo img {
    position: relative;
    width: 130%;
    max-width: none;
    margin-left: -15%
  }
}

@media only screen and (max-width: 767px) {
  .con_roo .wrp_photo .box_photo .photo {
    overflow: hidden
  }
  .con_roo .wrp_photo .box_photo .photo img {
    position: relative;
    width: 160%;
    max-width: none;
    margin-left: -30%
  }
}

.con_roo .wrp_photo .box_photo .box_ic {
  position: absolute;
  top: 3.33333%;
  left: 1.23457%;
  overflow: hidden;
  width: 170px
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_roo .wrp_photo .box_photo .box_ic {
    width: 14.16667%
  }
}

@media only screen and (max-width: 767px) {
  .con_roo .wrp_photo .box_photo .box_ic {
    width: 19.31818%
  }
}

.con_roo .wrp_photo .box_photo .box_ic li {
  width: 47.05882%
}

.con_roo .wrp_photo .box_photo .box_ic li:first-child {
  float: left
}

.con_roo .wrp_photo .box_photo .box_ic li:last-child {
  float: right
}

.con_roo .wrp_photo .box_photo .notes {
  font-size: 88%;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
  position: absolute;
  bottom: 2.5%;
  left: 1em;
  width: calc(100% - 2em)
}

@media only screen and (max-width: 767px) {
  .con_roo .wrp_photo .box_photo .notes {
    font-size: 75%;
    line-height: 1.25
  }
}

.con_roo .box_roo {
  overflow: hidden
}

.con_roo .box_roo .txt {
  float: left;
  width: 46.66667%;
  margin-bottom: 2.91667%
}

@media only screen and (max-width: 767px) {
  .con_roo .box_roo .txt {
    float: none;
    width: 100%;
    margin-bottom: 0.8em
  }
}

@media only screen and (min-width: 768px) {
  .con_roo .box_roo .box_tbl {
    float: right;
    width: 46.66667%
  }
}

.con_roo .box_roo .box_tbl table {
  width: 100%
}

.con_roo .box_roo .box_tbl table th {
  padding-right: 0
}

@media only screen and (min-width: 1200px) {
  .con_roo .box_roo .box_tbl table th {
    width: 130px
  }
}

@media print {
  .con_roo .box_roo .box_tbl table th {
    width: 130px
  }
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_roo .box_roo .box_tbl table th {
    width: 100px
  }
}

@media only screen and (max-width: 767px) {
  .con_roo .box_roo .box_tbl table th {
    width: 28%
  }
}

.con_roo .box_roo .box_btn {
  float: left;
  width: 46.66667%
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_roo .box_roo .box_btn {
    clear: both
  }
}

@media only screen and (max-width: 767px) {
  .con_roo .box_roo .box_btn {
    float: none;
    margin-top: 1em;
    width: 100%
  }
}

.con_roo .box_roo .box_btn li {
  width: 48.21429%
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_roo .box_roo .box_btn li {
    max-width: 270px
  }
}

@media only screen and (max-width: 1199px) {
  .con_roo .box_roo .box_btn li {
    width: 100%
  }
}

.con_roo .box_roo .box_btn li.btn_base {
  float: right
}

@media only screen and (max-width: 1199px) {
  .con_roo .box_roo .box_btn li.btn_base {
    float: none;
    margin-bottom: 0.8em
  }
}

@media only screen and (min-width: 1200px) {
  .con_roo .box_roo .box_btn li.btn_plan {
    float: left
  }
}

@media print {
  .con_roo .box_roo .box_btn li.btn_plan {
    float: left
  }
}

.con_roo .box_roo .box_btn li.btn_base a:before, .con_roo .box_roo .box_btn li.btn_base a:after, .con_roo .box_roo .box_btn li.btn_plan a:before, .con_roo .box_roo .box_btn li.btn_plan a:after {
  width: calc(100% - 2.2px);
  height: calc(100% - 2.2px)
}

#mod_j10 .box_roo .box_btn, .con_roo .box_roo .box_btn {
  clear: both
}

.wrp_overview {
  background: url(../images/common/bg01.jpg) repeat 0 0;
  padding: 80px 0 60px;
  margin-top: 110px
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .wrp_overview {
    margin-top: 10%
  }
}

@media only screen and (max-width: 767px) {
  .wrp_overview {
    padding: 2em 0;
    margin-top: 4em
  }
}

.con_overview {
  overflow: hidden
}

.con_overview .main_title {
  margin-bottom: 35px
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_overview .main_title {
    margin-bottom: 30px
  }
}

@media only screen and (max-width: 767px) {
  .con_overview .main_title {
    margin-bottom: 1em
  }
}

.con_overview .box_ov {
  float: left;
  width: 280px
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_overview .box_ov {
    width: 35%
  }
}

@media only screen and (max-width: 767px) {
  .con_overview .box_ov {
    float: none;
    width: 100%;
    margin-bottom: 1em
  }
}

.con_overview .box_ov li {
  margin-top: 7.14286%;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center
}

.con_overview .box_ov li:first-child {
  margin-top: 0
}

.con_overview .box_ov li .ic {
  width: 21.42857%
}

@media only screen and (max-width: 767px) {
  .con_overview .box_ov li .ic {
    width: 15%
  }
  .con_overview .box_ov li .ic img {
    width: 100%
  }
}

.con_overview .box_ov li .st {
  margin-left: 5.35714%;
  width: 73.21429%
}

@media only screen and (max-width: 767px) {
  .con_overview .box_ov li .st {
    margin-left: 5%;
    width: 80%
  }
}

.con_overview .box_tbl {
  float: right;
  width: 70%
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_overview .box_tbl {
    width: 62%
  }
}

@media only screen and (max-width: 767px) {
  .con_overview .box_tbl {
    float: none;
    width: 100%
  }
}

.con_overview .box_tbl table {
  width: 100%
}

@media only screen and (min-width: 768px) {
  .con_overview .box_tbl table th {
    padding-right: 0
  }
}

@media only screen and (min-width: 1200px) {
  .con_overview .box_tbl table th {
    width: 190px
  }
}

@media print {
  .con_overview .box_tbl table th {
    width: 190px
  }
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_overview .box_tbl table th {
    width: 120px
  }
}

#footer {
  margin-top: 0
}

.con_roo .box_bg_slider {
  position: relative;
  background: url(../images/home/bg_po01.png) repeat left top;
  margin-bottom: 40px
}

@media only screen and (max-width: 767px) {
  .con_roo .box_bg_slider {
    margin-bottom: 1em
  }
}

.con_roo .box_bg_slider:after {
  content: '';
  width: 100%;
  height: 33%;
  position: absolute;
  left: 0;
  bottom: 0;
  background: url(../images/home/bg_po01-2.png) repeat left bottom;
  z-index: 0
}

.con_roo .box_bg_slider .photo {
  max-width: 1620px;
  margin: auto;
  width: 95%;
  z-index: 1;
  position: relative
}

@media only screen and (min-width: 768px) and (max-width: 983px) {
  .con_roo .box_bg_slider .photo {
    overflow: hidden
  }
  .con_roo .box_bg_slider .photo img {
    position: relative;
    width: 130%;
    max-width: none;
    margin-left: -15%
  }
}

@media only screen and (max-width: 767px) {
  .con_roo .box_bg_slider .photo {
    width: 91.66667%;
    overflow: hidden
  }
  .con_roo .box_bg_slider .photo img {
    position: relative;
    width: 160%;
    max-width: none;
    margin-left: -30%
  }
}

.con_roo .box_bg_slider .box_slider {
  max-width: 1620px;
  margin: auto;
  width: 95%;
  z-index: 1
}

@media only screen and (max-width: 767px) {
  .con_roo .box_bg_slider .box_slider {
    width: 91.66667%
  }
}

@media only screen and (min-width: 768px) and (max-width: 983px) {
  .con_roo .box_bg_slider .box_slider .slick-list .slick-track .slide {
    overflow: hidden
  }
  .con_roo .box_bg_slider .box_slider .slick-list .slick-track .slide img {
    position: relative;
    width: 130%;
    max-width: none;
    margin-left: -15%
  }
}

@media only screen and (max-width: 767px) {
  .con_roo .box_bg_slider .box_slider .slick-list .slick-track .slide {
    overflow: hidden
  }
  .con_roo .box_bg_slider .box_slider .slick-list .slick-track .slide img {
    position: relative;
    width: 160%;
    max-width: none;
    margin-left: -30%
  }
}

@media only screen and (max-width: 767px) {
  .con_roo .box_bg_slider .box_slider .slick-dots {
    bottom: -2em
  }
}

.con_roo .box_bg_slider .box_slider .slick-dots li {
  width: 10px;
  height: 10px;
  margin: 0 .6em
}

@media only screen and (max-width: 767px) {
  .con_roo .box_bg_slider .box_slider .slick-dots li {
    width: .6em;
    height: .6em;
    margin: 0 .5em
  }
}

.con_roo .box_bg_slider .box_slider .slick-dots li button {
  width: 100%;
  height: 100%
}

.con_roo .box_bg_slider .box_slider .slick-dots li button:before {
  content: '';
  width: 100%;
  height: 100%;
  border: 1px solid #fff;
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  -moz-transition: background .8s;
  -o-transition: background .8s;
  -webkit-transition: background .8s;
  transition: background .8s
}

.con_roo .box_bg_slider .box_slider .slick-dots li.slick-active button:before {
  background: #fff
}

.con_roo .box_bg_slider .box_slider .slick-dots {
  bottom: 30px
}

@media only screen and (max-width: 767px) {
  .con_roo .box_bg_slider .box_slider .slick-dots {
    bottom: 1em
  }
}

.con_roo .box_bg_slider .box_slider .slick-arrow {
  z-index: 5;
  width: auto;
  height: auto;
  font-size: 100%
}

.con_roo .box_bg_slider .box_slider .slick-prev {
  left: 1.23457%
}

.con_roo .box_bg_slider .box_slider .slick-prev:before {
  content: "";
  font-family: FontAwesome;
  font-size: 248%;
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1
}

.con_roo .box_bg_slider .box_slider .slick-next {
  right: 1.23457%
}

.con_roo .box_bg_slider .box_slider .slick-next:before {
  content: "";
  font-family: FontAwesome;
  font-size: 248%;
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1
}

.con_roo .ic_wrap{
  position: relative;
  text-align: left;
  max-width: 1620px;
  width: 95%;
  z-index: 20;
  margin: 0 auto -20px;
}

.con_roo .ic_wrap .box_ic {
  position: absolute;
  top: 3.33333%;
  left: 1.23457%;
  overflow: hidden;
  width: 170px
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .con_roo .ic_wrap .box_ic {
    width: 14.16667%
  }
  .con_roo .ic_wrap{
    margin-bottom: -15px;
  }
}

@media only screen and (max-width: 767px) {
  .con_roo .ic_wrap .box_ic {
    width: 19.31818%
  }
  .con_roo .ic_wrap{
    margin-bottom: -5px;
  }
}

.con_roo .ic_wrap .box_ic li {
  width: 47.05882%
}

.con_roo .ic_wrap .box_ic li:first-child {
  float: left
}

.con_roo .ic_wrap .box_ic li:last-child {
  float: right
}
