@charset "UTF-8";
@media only screen and (min-width: 768px) { html.lower #contents .imgpattern { background: url(../../../hotspring/images/img_main.jpg) no-repeat center/cover; } }
@media only screen and (max-width: 767px) { html.lower #contents .imgpattern { background: url(../../../hotspring/images/img_main-sp.jpg) no-repeat center/cover; } }

.con_hots { margin: 50px auto 100px; }
@media only screen and (min-width: 768px) and (max-width: 1199px) { .con_hots { margin: 50px auto 8.33333%; } }
@media only screen and (max-width: 767px) { .con_hots { margin: 2em auto 4em; } }
.con_hots h3 span.jp { font-size: 115%; font-family: "Gilda Display", serif; letter-spacing: .2em; }
.con_hots [class^="box_slider"] { margin-bottom: 0 !important; }
.con_hots [class^="box_slider"] > div { display: none; }
.con_hots [class^="box_slider"] > div:first-child { display: block; }
.con_hots [class^="box_slider"] > div span { display: block; position: relative; overflow: hidden; }
@media only screen and (min-width: 768px) { .con_hots [class^="box_slider"] > div span { height: 0; padding-bottom: 40%; }
  .con_hots [class^="box_slider"] > div span img { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; } }
@media only screen and (max-width: 767px) { .con_hots [class^="box_slider"] > div span { overflow: hidden; }
  .con_hots [class^="box_slider"] > div span img { position: relative; width: 129%; max-width: none; margin-left: -14.5%; } }
.con_hots [class^="js-dots"] { display: flex; align-items: center; justify-content: center; margin: 15px 0 80px; }
@media only screen and (max-width: 767px) { .con_hots [class^="js-dots"] { margin: 1em 0 3em; } }
.con_hots [class^="js-dots"] .prev, .con_hots [class^="js-dots"] .next { text-align: center; cursor: pointer; }
@media only screen and (max-width: 767px) { .con_hots [class^="js-dots"] .prev, .con_hots [class^="js-dots"] .next { margin-top: .2em; } }
.con_hots [class^="js-dots"] .prev:before, .con_hots [class^="js-dots"] .next:before { margin: 0 !important; color: #403c38; font-size: 122%; }
@media only screen and (min-width: 768px) and (max-width: 1199px) { .con_hots [class^="js-dots"] .prev:before, .con_hots [class^="js-dots"] .next:before { font-size: 115%; } }
@media only screen and (max-width: 767px) { .con_hots [class^="js-dots"] .prev:before, .con_hots [class^="js-dots"] .next:before { font-size: 108%; } }
.con_hots [class^="js-dots"] .prev { order: 0; margin-right: 2.5em; }
.con_hots [class^="js-dots"] .prev:before, .con_hots [class^="js-dots"] .prev:after { font-family: FontAwesome; }
.con_hots [class^="js-dots"] .prev > * { vertical-align: middle; }
.con_hots [class^="js-dots"] .prev:before { content: ""; margin-right: .5em; }
.con_hots [class^="js-dots"] .next { order: 2; margin-left: 2.5em; }
.con_hots [class^="js-dots"] .next:before, .con_hots [class^="js-dots"] .next:after { font-family: FontAwesome; }
.con_hots [class^="js-dots"] .next > * { vertical-align: middle; }
.con_hots [class^="js-dots"] .next:before { content: ""; margin-right: .5em; }
.con_hots [class^="js-dots"] ul { text-align: right; bottom: -2.5em; z-index: 1; width: auto; position: absolute; left: 50%; -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); position: static; transform: translate(0); width: auto !important; }
@media only screen and (max-width: 767px) { .con_hots [class^="js-dots"] ul { bottom: .5em; width: 100%; text-align: center; } }
.con_hots [class^="js-dots"] ul li { position: relative; width: 4px; height: 0; padding-top: 4px; margin: 0; display: inline-block; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; overflow: hidden; -moz-transition: background 300ms; -o-transition: background 300ms; -webkit-transition: background 300ms; transition: background 300ms; background: #cbcbcb; }
.con_hots [class^="js-dots"] ul li:not(.slick-active) button { cursor: pointer; }
.mouse .con_hots [class^="js-dots"] ul li:not(.slick-active):hover, .touch .con_hots [class^="js-dots"] ul li:not(.slick-active).touchstart { background: #868482; }
.touch .con_hots [class^="js-dots"] ul li:not(.slick-active) { -webkit-tap-highlight-color: transparent; }
.touch .con_hots [class^="js-dots"] ul li:not(.slick-active).touchend { -moz-transition-delay: 200ms; -o-transition-delay: 200ms; -webkit-transition-delay: 200ms; transition-delay: 200ms; }
.con_hots [class^="js-dots"] ul li:not(:first-child) { margin-left: 1.5em; }
@media only screen and (max-width: 767px) { .con_hots [class^="js-dots"] ul li:not(:first-child) { margin-left: 1em; } }
.con_hots [class^="js-dots"] ul li.slick-active { background-color: #403c38; }
@media only screen and (max-width: 767px) { .con_hots [class^="js-dots"] ul li { width: 1em; padding-top: 1em; } }
.con_hots [class^="js-dots"] ul li button { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; margin: 0; padding: 0; }
.con_hots [class^="js-dots"] ul li { vertical-align: middle; }
.con_hots [class^="js-dots"] ul li.slick-active { width: 10px; padding-top: 10px; }
@media only screen and (max-width: 767px) { .con_hots [class^="js-dots"] ul li { width: .5em; padding-top: .5em; }
  .con_hots [class^="js-dots"] ul li.slick-active { width: 1em; padding-top: 1em; } }
.con_hots .box_info .tbl_basic { margin: 1em 0 2.8em; }
@media only screen and (max-width: 767px) { .con_hots .box_info .tbl_basic { margin: 0.5em 0 2em; } }
.con_hots .box_info .tbl_basic th { width: 24%; }
@media only screen and (max-width: 767px) { .con_hots .box_info .tbl_basic th { width: 100%; } }

.con_info { padding: 4.4em 0 6em; background: #f5f2ee; }
@media only screen and (max-width: 767px) { .con_info { padding: 3em 0 5em; } }
.con_info .sub_title { font-size: 115%; font-weight: normal; }
@media only screen and (min-width: 768px) and (max-width: 1199px) { .con_info .sub_title { font-size: 115%; } }
@media only screen and (max-width: 767px) { .con_info .sub_title { font-size: 108%; } }
.con_info .box_guide { background: #fff; border: 1px solid #e0e0e0; padding: 3.6em; }
@media only screen and (max-width: 767px) { .con_info .box_guide { padding: 2.2em 1.8em 1.8em; } }
.con_info .box_guide .sub_title { margin-bottom: 2em; }
@media only screen and (max-width: 767px) { .con_info .box_guide .sub_title { margin-bottom: 1.2em; } }
.con_info .box_guide p { font-size: 93%; margin-bottom: 2em; line-height: 2.5em; }
@media only screen and (min-width: 768px) and (max-width: 1199px) { .con_info .box_guide p { font-size: 93%; } }
@media only screen and (max-width: 767px) { .con_info .box_guide p { font-size: 86%; } }
@media only screen and (max-width: 767px) { .con_info .box_guide p { margin-bottom: 1.2em; } }
@media only screen and (max-width: 767px) { .con_info .box_guide p { line-height: 1.6em; } }