@charset "utf-8";

/*PCSP共通設定*/
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP');

#wrapper{
	font-family:'Noto Sans JP', sans-serif;
}

img {
    image-rendering: -webkit-optimize-contrast;
}

a:hover img {
	opacity: 0.8;
	filter: progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=80);
}

.textLeft {
	text-align: left;
}

.textCenter {
	text-align: center;
}

.textRight {
	text-align: right;
}

/*759px以下*/
@media screen and (max-width: 759.9px) {
#wrapper {line-height: 1.4;}
.smpnone {display:none !important;}

/* CSS */
#dirPathBlock,
#anchorLinkBlock {
	font-size: 10px;
	margin: 1% 1% 0 1%;
}

#dirPathBlock p,
#anchorLinkBlock a{font-size: 12px;}

section:nth-of-type(odd){
    padding-bottom: 20px;
    overflow: hidden;
}

section:nth-of-type(even){
    background:#faf6d5;
    padding-bottom: 20px;
}

.inner {
	width: 94%;
	margin: 0 auto;
	padding: 3%;
}

#main_title {
	position:relative;
	background:url(../images/bg.jpg) repeat-x 50% 50%;
    background-size: cover;
	text-align:center;
	overflow:hidden;
	padding:0 0 0;
}

#main_title img {
    width: 100%;
    vertical-align: bottom;
}

.atten_info {
	padding: 5px 10px;
	margin: 0px;
	background: #fdeae6;
	text-align: left;
	font-size: 12px;
}
.atten_info p {
margin: 0px;
padding: 0px;
}

h1 {
	font-size: 12px;
	margin: 0 1%;
}

h2.no_bg {
	min-height: auto;
	margin: 20px 0 10px;
	padding: 0;
	text-align: center;
	background: none;
	font-size: 18px;
	color: #000;
	font-weight: bold;
}

h3 {
	font-size:1.2rem;
	font-weight:bold;
	padding:10px;
	text-align:center;
	clear:both;
border-top: 1px dashed #333;
margin: 0px 10px;
}
h3 span:before {
    content: '';
    display: inline-block;/*忘れずに！*/
    width: 1.5rem;/*画像の幅*/
  height: 1.5rem;/*画像の高さ*/
  background-image: url(../images/icon_onsen.png);
    background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
    padding: 7px 0 0 0;
    margin-right: 5px;
}

.midashi1 {
	font-size:1.3rem;
	font-weight:bold;
	padding:30px 0px 10px;
	text-align:center;
	color:#f68104;
	clear:both;
}

.midashi1 img{
	display:inline-block;
	width:4rem;
	height:auto;
	vertical-align:top;
	position:relative;
	top:-2px;
	margin-right:15px;
}

.midashi1 span {
    display: block;
    width:100%;
    background-image: url(../images/tit_left.png),url(../images/tit_right.png);
    background-position: left,right;
    background-size: 18%;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 10px;
    padding: 0 18%;
    box-sizing: border-box;
}

/*navigation*/
#navi{
	text-align:center;
	letter-spacing:-0.4em;
	padding:0;
	display:table;
	width:100%;
	margin: 0px;
}

#navi li{
    width:49%;
    margin:0.4% 0.5%;
	letter-spacing:normal;
	display:table-cell;
	vertical-align:middle;
    float:left;
    background:#f68104;
}

#navi li a{
	font-size:10px;
	padding:5px 2px;
	display:block;
	color:#ffffff;
	line-height:14px;
}

/* 新着情報・ランキング */
#campaignBox {
	margin: 0 auto 20px;
	padding: 10px 0px;
    height:170px;
	background: #fff;
    overflow: auto;
}
#campaignBox dl {
	width: 90%;
	margin: 0 auto;
	font-size: 12px;
	line-height: 1.5;
	margin-bottom: 15px;
}
#campaignBox dl {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px dashed #333;
}
#campaignBox dl:last-of-type {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}
#campaignBox dl dt {
	margin-bottom: 3px;
}
#campaignBox dl dd {
	margin:0 0 25px;
}
#campaignBox dl div:last-child dd {
	margin-bottom: 0;
}
#campaignBox dl div dd span {
	display: inline-block;
	margin-right: 10px;
	padding: 0 15px;
	background: #ff0000;
	font-size: 10px;
	color: #fff;
}

#intro img {
width: 100%;
padding: 10px 0px 0px 0px;
}
#intro p {
text-align: center;
padding: 0px;
margin: 0px;
}

#ranking {
    width:100%;
    margin: 0 auto;
}
#ranking dl {
    float:left;
    width:96%;
    margin:5px 2% 5px 2%;
    border: 2px solid #f1e3d5;
    box-sizing: border-box;
    padding: 10px;
    position: relative;
    overflow: hidden;
    background: #fff;
}
#ranking dl:nth-of-type(3n) {
    margin-right: 0;
}
#ranking dl p.icon_ranking {
    position: absolute;
    top:0px;
    left:10px;
}
#ranking dl dt {
    padding: 0px 0 10px 0;
    font-size: 18px;
    text-align: center;
    font-weight: bold;
}
#ranking dl p.icon {
    border: 1px solid #f68104;
    padding: 5px;
    color: #f68104;
    font-size: 13px;
    display: inline-block;
    margin: 0 0 5px 0;
}
#ranking dl dd {
    font-size: 0.8rem;
    width:50%;
    float:left;
}
#ranking dl dd img {
    width:96%;
}
#ranking p.add {
    margin:10px 2% 0;
    font-size: 12px;
}

/*アコーディオンメニュー*/
nav{ display: none; }
.nav-open{
    width:60%;
	padding: 15px 5%;
	font-size: 16px;
    text-align: center;
	position: relative;
    border: 2px #f68104 solid;
    border-radius: 20px;
    display: inline-block;
    color: #f68104;
    margin:15px 15%;
}
.nav-open::before{/* 閉じている時 */
	content: "ー";
	position: absolute;
	right: 20px;
}
.nav-open.active::before{/* 開いている時 */
	content: "＋";
}

/* おんせんtabi旅行記 */
.itemList5 > div .areaBtn {
  color: #fff;
  width: 100%;
  text-align: center;
  position: relative; /* 追記 */
  font-size: 138.5%;
  font-weight: bold;
}

.itemList5 > div .areaBtn a {
	color: #a41f00;
	display: block;
	padding: 2px 0 6px;
	background: #FFF;
    border: 2px solid #a41f00;
	border-radius: 10px;
}

.itemList5 > div .areaBtn a:hover {
	opacity: 0.8;
}

.itemList5 > div .areaBtn span {
  font-size: 80%;
  font-weight: normal;
}

/*.itemList5 > div .areaBtn::after {
  content: "＞";
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  color: #a41f00;
}*/

.itemList5 .areaBtn_on {
  color: #fff;
  width: 100%;
  text-align: center;
  background: #a41f00;
  border-radius: 10px;
  padding: 2px 0 6px;
  position: relative; /* 追記 */
  font-size: 138.5%;
  font-weight: bold;
}

.itemList5 > div .areaBtn_on span {
  font-size: 80%;
  font-weight: normal;
}

/*.itemList5 .areaBtn_on::after {
  content: "＞";
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}*/

.txt_travelogue {
text-align: center;
font-size: 14px;
padding: 0px 0px 0px 0px;
margin: 0px 0px 20px 0px;
}

#tab .tab_content {
	width: 100%;
	height: 0;
	overflow: hidden;
	opacity: 0;
}

#travelogue p.catch {
    width:94%;
    margin:0 3% 10px;
    font-size: 0.95rem!important;
    line-height: 1.4;
}

.swiper-custom-parent{
  margin: 0 auto;
  width: 90%;
  position: relative;
  padding: 0px 10px;
}

.spot {
}
.spot .inner {
overflow: hidden;
padding: 10px 10px 0px 10px;
}
.img_spot {
padding: 0px;
margin: 0px 0px 10px 0px;
}

.img_spot img {
width: 100%;
}

.spot dl {
clear: both;
padding: 0px;
margin: 0px 0px 10px 0px;
display: inline-block;
}
.spot dt {
font-size: 1.1rem;
font-weight: bold;
padding: 0px 0 7px 0;
margin: 0px 0px 10px 0px;
border-bottom: 2px solid;
    text-align: center;
}
.spot dd {
font-size: 0.95rem;
padding: 0px;
margin: 0px 0px 0px 0px;
}
.spot dd.txt2 {
    font-size: 0.9rem;
    margin:10px 0 10px 0;
    padding:10px 0 0 0;
    border-top:1px dashed #666;
}

/* スライドswiper カスタマイズ */
.swiper-container{
	width: 100%;
	margin:0 auto;
}
.swiper-container .swiper-slide{
    background-color: #fff;
}
.swiper-container .swiper-slide img{
}
.swiper-container .swiper-slide p{
}
.swiper-container .swiper-pagination {
	bottom: 15px !important;
}
.swiper-pagination-bullet-active{
background-color: #FFFFFF !important;
}
.swiper-button-prev:focus,
.swiper-button-next:focus{
  outline: none;
}
.swiper-button-prev::after,
.swiper-button-next::after{
	font-size:20px;
	color: #666666;
	font-weight: bold;
	opacity: 0.5;
}
.swiper-button-prev:hover::after,
.swiper-button-next:hover::after{
	opacity: 1;
}
.swiper-button-prev{
	left:0px !important;
	top:48%;
}
.swiper-button-next{
	right:0px !important;
	top:48%;
}

/*鉄道旅のすすめ*/
h3.lineno {
    border-top: none;
    margin-top: -20px;
}

.aboutBox,
.aboutBox02 {
    width: 96%!important;
	margin: 0 2%;
    padding-bottom: 5%;
}

.aboutBox .photo {
	text-align: center;
	padding-bottom: 2%;
}

.aboutBox .photo img {
	width: 100%;
}

.aboutBox02 .photo {
	text-align: center;
	width: 80%!important;
	margin: 0 auto;
	padding-bottom: 2%;
}

.aboutBox .detail,
.aboutBox02 .detail {
   font-size: 123.1%;
}

.aboutBox .detail img {
    width: 100%;
    padding: 2% 0;
}

.attention {
	font-size: 123.1%;
	width: 90%;
	margin: 2% 2% 5% 2%;
	border: 2px #F00 solid;
	padding: 2%;
	background: #FFF;
}

.attention strong {
    font-weight: bold;
}

/*slide*/
.slide-wrap {
	display: flex;
	margin: 0 auto;
	width: 100%;
	overflow-x: scroll;
	-webkit-overflow-scrolling: touch;
	overflow-scrolling: touch;
}

.slide-box {
	margin-right: 3%;
    flex: 0 0 80%;
	text-align: center;
}

.slide-box img {
	width: 100%;
}

.slide-box p {
	text-align: left;
	font-size: 123.1%;
}

.slide-box p span {
	font-weight: bold;
}

.slide-box p.point {
	background: #FFFFD9;
	padding: 2%;
	margin-top: 1%;
}

.slide-box p.point span {
	color: #F00;
}

.slide-box p.detail {
	line-height: 1.5;
	font-size: 0.9rem;
}

.slide-box .detail dl {
	font-size: 123.1%;
	line-height: 1.5;
	padding: 2% 0;
	border-bottom: 1px dotted #333;
	text-align: left;
}

.slide-box .detail dl span {
	font-size: 80%;
}

.slide-box .detail dt {
	clear: left;
	float: left;
	width: 30%;
	font-weight: bold;
}

.slide-box .detail dd {
	margin-left: 30%;
}

.slide-box .detail dl:last-child {
	border-bottom: none;
}

.slide-box p.heed {
	font-size: 123.1%;
	background: #FFF;
	margin: 3% 0;
}

/*ショートムービー*/
.youtube {
	width: 315px;
	margin: 10px auto 10px;
}

/* 横長の時↓ */
/*
.youtube {
  position: relative;
  width: 94%;
    margin:20px 3% 10px;
  padding-top: 52.875%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
*/

/*Tripa記事紹介*/
div#useWrap{
	padding:10px;
	margin-bottom:0px;
}
div#useWrap div{
	overflow:hidden;
	padding:15px;
	margin:0 0 0 0;
	background:#FFF;
	float:none!important;
	width:auto!important;
	border:1px solid #fdd4e7;
}

div#useWrap div:nth-of-type(1){
	padding:15px;
}

div#useWrap div p{
	float:left;
	margin:0 20px 0 0;
	width:75px;
	height:75px;
}

#useWrap div p img{
	width:100%;
	height:auto;
}

#useWrap div dl{
	overflow:hidden;
	display:block;
	padding:0 0 0 0;
}

/*#useWrap div:last-child{
	border-bottom:none
}*/

#useWrap div dl dt{
	font-size:14px;
	margin:0 0 10px 0;
	padding:0;
}

#useWrap div dl dt a{
	color:#000;
}

#useWrap div dl dd{
	font-size:12px;
	color:#999;
	margin:0;
	padding:0;
}

#useWrap div dl dd > span{
	display:block;
	margin:5px 0 0 0;
}

#useWrap div dl dd > span a{
	color:#CCC;
	display:inline-block;
	background:none;
	padding:0;
	text-align:center;
	margin-top:0;
	font-size:14px;
	-webkit-border-radius: 0;
	border-radius: 0;
	border-bottom:none;
}

#useWrap div dl dd > span span{
	color:#F69;
	display:inline;
}

#useWrap .commonTit{
	margin:0;
}

/*ギャラリー*/
#gallery {
    padding:40px 0;
}
.gallery_wrap {
    width:100%;
    margin: 0 auto 60px auto;
    overflow: hidden;
}
.gallery_img {
    position: relative;
    width:48%;
    float:left;
    margin: 5px 1%;
}
.gallery_img:before{
  content: "";
  display: block;
  padding-top: 100%;
}
.gallery_img img {
    position: absolute;
  width: 100%;
  height: 100%!important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  object-fit: cover;
}
/*.gallery_img {
    width:50%;
    padding: 2%;
    height: auto;
    float:left;
}
.gallery_img img {
    width:100%;
}*/

/*お申し込みはこちら*/
.plan_btn {
margin-bottom: 20px;
}
.plan_btn h4 {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	margin: 4% 3%;
}

.col2{
margin: 0px;
padding: 0px 0px 0px 0px;
}
.btlink {
margin-bottom: 10px;
}
.btlink a {
position: relative;
display: block;
align-items: center;
margin: 0px auto;
padding: 0.7em 15px;
width: 80%;
color: #fff;
font-size: 100%;
font-weight: 600;
text-decoration: none;
text-align: center;
background-color: #a41f00;
border-radius: 5px;
transition: 0.2s;
}
.btlink a::after {
content: '';
position: absolute;
right:15px;
top:50%;
margin-top: -2.5px;
width: 5px;
height: 5px;
border-top: 3px solid #fff;
border-right: 3px solid #fff;
transform: rotate(45deg);
}

/*温泉の泉質と効能について*/
#about p.catch {
    width:100%;
    background: url(../images/about_bg.png) no-repeat;
    background-size: 100%;
    background-repeat: no-repeat;
    padding: 10px 10px;
    margin:0 auto 0px;
    font-size: 1rem!important;
    line-height: 1.4;
    box-sizing: border-box;
}
#about p.catch span {
    text-align: center;
    display: block;
    margin: 0 0 15px;
    font-size: 1.2rem;
    font-weight: bold;
}
#about dl {
    width:94%;
    margin: 10px auto;
    border: 2px solid #f1e3d5;
    box-sizing: border-box;
    padding: 20px;
    overflow: hidden;
    background: #fff;
}
#about dl dt {
    font-size: 1.2rem;
    font-weight: bold;
    text-align: center;
    padding: 0 10px 10px 10px;
    border-bottom: 1px solid #f1e3d5;
    margin-bottom: 10px;
}
#about dl dd {
    font-size: 0.95rem;
    margin-top:10px;
}
#about dl dd p.onsen_tit {
    padding: 10px 10px 10px 40px;
    background: url(../images/icon_onsen2.png) no-repeat #d3d0d0;
    background-size: 25px 25px;
    background-position: 10px center;
    display: inline-block;
    margin-bottom: 7px;
    border-radius: 5px;
}

/*入浴のマナー*/
#manners p.catch {
    width:100%;
    background: url(../images/manners_bg.png) no-repeat;
    background-size: 100%;
    background-repeat: no-repeat;
    padding: 10px 10px;
    margin:0 auto 20px;
    font-size: 1rem!important;
    line-height: 1.4;
    box-sizing: border-box;
}
#manners p.catch span {
    text-align: center;
    display: block;
    margin: 0 0 15px;
    font-size: 1.2rem;
    font-weight: bold;
}
#manners ul {
    width:100%;
    margin: 0 auto;
    border: 2px solid #f1e3d5;
    box-sizing: border-box;
    padding: 20px;
    overflow: hidden;
    /*background: #fff;*/
}
#manners ul li {
    font-size: 0.95rem;
    padding: 0 10px 10px 30px;
    border-bottom: 1px solid #f1e3d5;
    margin-bottom: 10px;
    background: url(../images/icon_onsen2.png) no-repeat;
    background-size: 20px 20px;
}
#manners ul li:last-of-type {
    border:none;
    padding-top: 15px;
    padding-left: 0;
    padding-bottom: 0px;
    margin-bottom: 0;
    font-size: 15px;
    background:none;
}
#manners dl dd p.onsen_tit {
    padding: 10px 10px 10px 40px;
    background: url(../images/icon_onsen2.png) no-repeat #d3d0d0;
    background-size: 25px 25px;
    background-position: 10px center;
    display: inline-block;
    margin-bottom: 7px;
    border-radius: 5px;
}

/*ラジオ ON AIR*/
.radioBox {
margin-bottom: 20px;
}

.radioBox .detail {
	width: 100%;
	text-align: center;
}

.radioBox .detail img {
	margin: 2% 2% 0;
    width: 96%;
}

.radioBox .photo {
	width: 100%;
	text-align: center;
}

.radioBox .photo img {
	width: 70%!important;
    margin: 2% 15% 0;
}

.radioBox .photo p {
    font-size: 15px;
	font-weight: bold;
    margin-top: 1%;
}

.radioCaption {
	text-align: center;
	font-size: 15px;
	font-weight: bold;
	margin-top: 2%;
}

.scheduleBox {
    font-size: 15px;
	line-height: 1.4;
	width: 100%;
	padding: 2% 0;
	margin-top: 2%;
	text-align: center;
	background: #FDD;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}

.scheduleBox span {
    font-weight: bold;
	color: #F00;
}

.in h4 {
    font-size: 1.0rem !important;
    font-weight: normal;
    font-weight: bold;
    padding: 0;
    text-align: center;
    color: #000000;
    clear: both;
    margin-top:1.5rem;
    margin-bottom: 10px;
    background-image: url(../images/h2_l.png),url(../images/h2_r.png);
    background-repeat: no-repeat;
    background-position: left bottom,right bottom;
}

.media {
}
.media p {
font-size: 12px;
padding: 0px;
margin: 0px;
}
.media p img {
width: 100%;
margin-bottom: 6px;
}

/*Instagramキャンペーン*/
.catchBox {
	text-align: center;
}

.catchBox img {
    width: 80%!important;
    margin: 0 auto 2%;
}

/*list横並び*/
.itemList3,
.itemList4,
.itemList5 {
	float: left;
	width: 100%;
	padding: 2% 0;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}

.itemList3,
.itemList4 > div {
	float: left;
	width: 44%;
	padding: 1%;
    margin-top: 2%;
}


.itemList4 > div img {
	width: 100%;
    display: inline-block;
}

.itemList3,
.itemList4,
.itemList5 > div dd {
	font-size: 123.1%;
	text-align: left;
	padding: 2%;
}

.itemList5 > div {
	float: left;
	width: 31%;
	padding: 1%;
}

/*ボタン*/
.Btn {
  color: #fff;
  width: 94%;
  margin: 2% 3% 4%;
  text-align: center;
  position: relative; /* 追記 */
  font-size: 123.1%;
  font-weight: bold;
}

.Btn a {
	color: #fff;
    display: block;
    padding: 6% 3%;
    background: #F60;
    border-radius: 5px;
}

.Btn span {
  font-size: 80%;
  font-weight: normal;
}

.Btn::after {
  content: "＞";
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}

.Btn_gray {
  color: #fff;
  width: 94%;
  margin: 2% 3%;
  text-align: center;
  background: #666    ;
  border-radius: 5px;
  padding: 6% 3%;
  position: relative; /* 追記 */
  font-size: 123.1%;
  font-weight: bold;
}

.Btn_gray::after {
  content: "＞";
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}
	
}





/*760px以上*/
@media screen and (min-width: 760px),print {
/* CSS */
#wrapper {line-height: 1.231;}
#dirPathBlock,
h1,
.iframe_end-content_gadget,
#anchorLinkBlock{
	width: 100%;
	max-width:970px;
	min-width:760px;
	margin: auto;
}
	
.pcnone{
    display: none !important;
	}

/*panlist&back*/
#dirPathBlock,
#anchorLinkBlock {
	width: 100%;
	margin: 10px auto;
	display: block;
	font-size: 12px;
}

#dirPathBlock p,
#anchorLinkBlock a{font-size: 12px;}

section:nth-of-type(odd){
    padding-bottom: 60px;
    overflow: hidden;
    background-image:url(../images/bg01.jpg);
    background-position:top;
}

section:nth-of-type(even){
    padding-bottom: 60px;
    background:#faf6d5 url(../images/bg02.png) center top;
}

.inner {
	width: 950px;
	margin: 0 auto;
	padding: 20px 0;
}

#main_title{
	position:relative;
	background:url(../images/bg.jpg) repeat-x 50% 50%;
	text-align:center;
	overflow:hidden;
	padding:0 0 0;
	height:360px;
}

.atten_info {
	padding: 10px 0;
	margin: 0px;
	background: #fdeae6;
	text-align: center;
}
.atten_info p {
	width: 900px;
	padding: 0px;
	margin: 0px auto;
}

h1 {
	font-size: 14px;
    width: auto;
    max-width: 970px;
    margin: 0 auto 5px;
}

h2.no_bg {
font-size: 22px;
	min-height: auto;
	margin: 50px 0 10px;
	padding: 0;
	text-align: center;
	background: none;
	color: #000;
	font-weight: bold;
}

h3 {
	font-size:1.8rem;
	font-weight:bold;
	padding:20px 0 20px;
	text-align:center;
	clear:both;
    width: 950px;
    border-top: 1px dashed #333;
    margin: 20px auto 0px auto;
}

h3 span:before {
    content: '';
    display: inline-block;/*忘れずに！*/
    width: 40px;/*画像の幅*/
    height: 40px;/*画像の高さ*/
    background-image: url(../images/icon_onsen.png);
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
    padding: 7px 0 0 0;
}

.midashi1 {
	font-size:2.5rem;
	font-weight:bold;
	padding:30px 0 20px;
	text-align:center;
	color:#f68104;
	clear:both;
    margin-bottom:20px;
}
.midashi1 img{
	display:inline-block;
	width:50px;
	height:auto;
	vertical-align:top;
	position:relative;
	top:-2px;
	margin-right:15px;
}

.midashi1 span:before {
    content: url(../images/tit_left.png);
    margin: 10px;
    position: relative;
    top: 8px;
}

.midashi1 span:after {
    content: url(../images/tit_right.png);
    margin: 10px;
    position: relative;
    top: 8px;
}

/*navigation*/
#navi{
	text-align:center;
	letter-spacing:-0.4em;
	background:#f68104;
	padding:10px 0;
	margin: 0px;
}

#navi li{
	display:inline-block;
	letter-spacing:normal;
	border-left:2px dashed #ffffff;
    vertical-align: top;
    /*width:190px;*/
}

#navi li a{
	font-size:18px;
	padding:15px 20px;
	display:block;
	color:#ffffff;
}

#navi li:nth-of-type(1){
	border-left:none;
}
#navi li:nth-of-type(2){
    box-sizing: border-box;
}
#navi li:nth-of-type(3),
#navi li:nth-of-type(4),
#navi li:nth-of-type(5),
#navi li:nth-of-type(6),
#navi li:nth-of-type(7){
    box-sizing: border-box;
}
#navi li a:hover{
	transition: 0.2s ;
	opacity: 0.8 ;
	text-decoration:none!important
}
#navi li span{
	font-size:18px;
	padding:15px 20px;
	display:block;
	color:#666666;
}

/* 新着情報・ランキング */
#campaignBox {
width: 950px;
	margin: 0 auto 20px;
	padding: 10px 0;
	/*border-top: double #000;
	border-bottom: double #000;*/
    height: 140px;
    overflow: auto;
}
#campaignBox dl {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px dashed #333;
}
#campaignBox dl:last-of-type {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}
#campaignBox dl div {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	margin-bottom: 25px;
	font-size: 18px;
	line-height: 1.5;
}
#campaignBox dl div:last-child {
	margin-bottom: 0;
}
#campaignBox dl div div {
position: relative;
	display: block;
	padding-left: 78px;
	margin-bottom: 5px;
}
#campaignBox dl div dt {
	min-width: 4em;
}
#campaignBox dl div dd {
	position: relative;
	margin:0;
}
#campaignBox dl div dd span {
position: absolute;
left: 0px;
	display: inline-block;
	margin-right: 10px;
	padding: 0 15px;
	background: #ff0000;
	color: #fff;
	font-size: 16px;
}

#intro {
width: 100%;
padding: 40px 0px 20px 0px;
}

#intro p {
text-align: center;
padding: 0px;
margin: 0px;
}

#ranking {
    width:950px;
    margin: 0 auto;
}
#ranking dl {
    float:left;
    width:304px;
    margin:15px 16px 15px 0;
    border: 2px solid #f1e3d5;
    box-sizing: border-box;
    padding: 10px;
    position: relative;
    overflow: hidden;
}
#ranking dl:nth-of-type(3n) {
    margin-right: 0;
}
#ranking dl p.icon_ranking {
    position: absolute;
    top:0px;
    left:10px;
}
#ranking dl dt {
    padding: 15px 0 15px 0;
    font-size: 18px;
    text-align: center;
    font-weight: bold;
}
#ranking dl dt a:link {
	color: #333;
}
#ranking dl dt a:hover {
	text-decoration: none !important;
	color: #0065D6;
}
#ranking dl p.icon {
    border: 1px solid #f68104;
    padding: 5px;
    color: #f68104;
    font-size: 13px;
    display: inline-block;
    margin: 5px 0;
}
#ranking dl dd {
    font-size: 16px;
}
#ranking dl dd img {
    width:280px;
}
#ranking p.add {
    display: inline-block;
    margin:10px 0 0 0;
    font-size: 12px;
    height: 30px;
}

/*アコーディオンメニュー*/
nav{ display: none; }
.nav-open{
	padding: 15px 80px;
	font-size: 18px;
    text-align: right;
	position: relative;
    border: 2px #f68104 solid;
    border-radius: 20px;
    display: inline-block;
    color: #f68104;
    box-sizing: border-box;
    margin:0 345px 15px;
}
.nav-open::before{/* 閉じている時 */
	content: "ー";
	position: absolute;
	right: 20px;
}
.nav-open.active::before{/* 開いている時 */
	content: "＋";
}

/* おんせんtabi旅行記 */
.itemList5 > div .areaBtn {
  color: #fff;
  width: 100%;
  text-align: center;
  position: relative; /* 追記 */
  font-size: 153.9%;
  font-weight: bold;
}

.itemList5 > div .areaBtn a {
	color: #a41f00;
	display: block;
	padding: 10px 0;
	background: #FFF;
    border: 3px solid #a41f00;
	border-radius: 10px;
}

.itemList5 > div .areaBtn a:hover {
	opacity: 0.8;
}

.itemList5 > div .areaBtn span {
  font-size: 75%;
  font-weight: normal;
}

.itemList5 > div .areaBtn::after {
  content: "＞";
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  color: #a41f00;
}

.itemList5 .areaBtn_on {
  color: #fff;
  width: 100%;
  text-align: center;
  background: #a41f00;
  border: 3px solid #a41f00;
  border-radius: 10px;
  padding: 10px 30px;
  position: relative; /* 追記 */
  font-size: 153.9%;
  font-weight: bold;
}

.itemList5 > div .areaBtn_on span {
  font-size: 75%;
  font-weight: normal;
}

.itemList5 .areaBtn_on::after {
  content: "＞";
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}

.txt_travelogue {
text-align: center;
font-size: 20px;
padding: 0px 0px 0px 0px;
margin: -10px 0px 30px 0px;
}

#tab .tab_content {
	width: 100%;
	height: 0;
	overflow: hidden;
	opacity: 0;
}

#travelogue p.catch {
    width:860px;
    margin:0 auto 20px;
    font-size: 18px !important;
    line-height: 1.4;
}

.swiper-custom-parent{
  margin: 0 auto;
  width: 950px;
  position: relative;
margin-bottom: 30px;
}

.spot {
position: relative;
width: 850px;
background-color: #fff;
margin: 0px auto;
}
.spot .inner {
overflow: hidden;
padding: 15px;
}
.img_spot {
width:390px;
padding: 0px;
margin: 0px 0px 0px 0px;
}
.img_spot img {
    width:100%;
}
.spot dl {
clear: both;
display: inline-block;
width: 400px;
padding: 0px;
margin: 0px 0px 0px 15px;
}
.spot dt {
font-size: 20px;
font-weight: bold;
padding: 0px 0 7px 0;
margin: 0px 0px 15px 0px;
border-bottom: 2px solid;
}
.spot dd {
font-size: 16px;
padding: 0px;
margin: 0px 0px 0px 0px;
}
.spot dd.txt2 {
    margin:10px 0 0px 0;
    padding:10px 0 0 0;
    border-top:1px dashed #666;
    font-size: 15px;
}

.spot p {
padding: 0px;
margin: 0px 0px 0 0px;
float:left;
}
.area_spot {
display: inline-block;
font-size: 12px;
line-height: 12px;
font-weight: bold;
text-align: center;
color: #fff;
background-color: #9ac8da;
padding: 7px 10px;
margin: 0px 0px 10px 0px;
}

/* スライドswiper カスタマイズ */
.swiper-container{
	width: 100%;
	margin:0 auto;
}
.swiper-container .swiper-slide{
}
.swiper-container .swiper-slide img{
}
.swiper-container .swiper-slide p{
}
.swiper-container .swiper-pagination {
	bottom: 15px !important;
}
.swiper-pagination-bullet-active{
background-color: #FFFFFF !important;
}
.swiper-button-prev:focus,
.swiper-button-next:focus{
  outline: none;
}
.swiper-button-prev::after,
.swiper-button-next::after{
	font-size:20px;
	color: #666666;
	font-weight: bold;
	opacity: 0.5;
}
.swiper-button-prev:hover::after,
.swiper-button-next:hover::after{
	opacity: 1;
}
.swiper-button-prev{
	left:0px !important;
	top:50% !important;;
}
.swiper-button-next{
	right:0px !important;
	top:50% !important;;
}

/*鉄道旅のすすめ*/
h3.lineno {
    border-top: none;
    margin-top: -30px;
}

.aboutBox,
.aboutBox02 {
    margin-bottom: 20px;
    width: 850px;
	margin: 0 auto;
}

.aboutBox .photo,
.aboutBox02 .photo {
	float: left;
	margin-right: 10px;
}

.aboutBox .photo img {
	width: 400px;
	height: auto;
}

.aboutBox02 .photo img {
	width: 300px;
	height: auto;
}

.aboutBox .detail,
.aboutBox02 .detail {
    float:  left; 
	width: 440px;
    font-size: 16px;
	line-height: 1.5;
}

.aboutBox .detail img {
    width: 440px;
    padding: 5px 0;
}

.aboutBox02 .detail img {
    margin-top:  30px;
}

.attention {
    width: 850px;
    margin: 0 auto;
	font-size: 16px;
	line-height: 1.5;
	margin-bottom: 30px;
	padding: 20px;
	border: 2px #F00 solid;
	text-align: left;
	background: #FFF;
}

.attention strong {
    font-weight: bold;
}

/*slide*/
.slide-wrap {
  width: 92%;
  margin: 0 4%;
  padding: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-box;
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.slide-box {
  width: 33.33333%;
  padding: 10px;
}

.slide-box:nth-child(4n){
  margin-right: 0;
}

.slide-box:nth-child(-n+4){
  margin-top: 0;
}

.slide-box img {
  display: block;
  height: auto;
  width: 100%;
}

.slide-box p {
  font-size: 16px;
  margin-top: 5px;
}

.slide-box p span {
	font-weight: bold;
}

.slide-box p.point {
	background: #FFFFD9;
	padding: 10px;
	margin-top: 10px;
	line-height: 1.4;
}

.slide-box p.point span {
	color: #F00;
}

.slide-box .detail dl {
	font-size: 16px;
	line-height: 1.4;
	padding: 0;
	margin: 0;
	padding: 6px 0;
	border-bottom: 1px dotted #333;
}

.slide-box .detail dl span {
	font-size: 80%;
}

.slide-box .detail dt {
	clear: left;
	float: left;
	width: 30%;
	font-weight: bold;
}

.slide-box .detail dd {
	margin-left: 30%;
}

.slide-box .detail dl:last-child {
	border-bottom: none;
}

.slide-box p.heed {
	font-size: 16px;
	background: #FFF;
	margin: 5px 0;
}

/*ショートムービー*/
.youtube_shortbox {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;

	width: 950px;
	margin: 0 auto;
}
.youtube {
	width: 315px;
	margin: 10px auto 10px;
}

/*Tripa記事紹介*/
#tripa {
    padding:40px 0;
}
div#useWrap div {
    overflow: hidden;
    padding: 15px;
    margin: 0 auto;
    background: #FFF;
    float: none !important;
    width: 950px;
    border: 1px solid #fdd4e7;
    box-sizing: border-box;
}
div#useWrap div p {
    float: left;
    margin: 0 20px 0 0;
    width: 150px;
    height: auto;
}

div#useWrap div p img{
	width:100%;
	height:auto;
}

#useWrap div dl {
    overflow: hidden;
    display: block;
    padding: 0 0 0 0;
}

#useWrap div dl dt {
    font-size: 18px;
    margin: 0 0 10px 0;
    padding: 0;
}
#useWrap div dl dd{
	font-size:14px;
}

#useWrap div dl dd > span{
	display:block;
	margin:5px 0 0 0;
}

#useWrap div dl dd > span a{
	color:#CCC;
	display:inline-block;
	background:none;
	padding:0;
	text-align:center;
	margin-top:0;
	font-size:14px;
	-webkit-border-radius: 0;
	border-radius: 0;
	border-bottom:none;
}

#useWrap div dl dd > span span{
	color:#F69;
	display:inline;
	font-size:14px;
}

/*ギャラリー*/
#gallery {
    padding:40px 0;
}
.gallery_wrap {
    width:950px;
    margin: 0 auto 60px auto;
    overflow: hidden;
}
.gallery_img {
    position: relative;
    width:225px;
    float:left;
    margin: 5px;
}
.gallery_img:before{
  content: "";
  display: block;
  padding-top: 100%;
}
.gallery_img img {
    position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  object-fit: cover;
}
/*.gallery_img {
    width:230px;
    height: 230px;
    padding: 10px;
    float:left;
    overflow: hidden;
    text-align: center;
}
.gallery_img img {
    height:230px;
}*/

/*.お申し込みはこちら*/
.plan_btn {
width: 800px;
margin: 30px auto 30px auto;
}

.plan_btn h4 {
	text-align: center;
	font-size: 22px;
	font-weight: bold;
	margin: 0px 0px;
}
.col2{
display: flex;
justify-content:center;
margin: 0 auto;
padding: 10px 0px 0px 0px;
gap: 0px 20px;
}

.btlink {
width: 70%;
}
.btlink a {
position: relative;
display: block;
align-items: center;
padding: 0.7em 15px;
width: 100%;
color: #fff !important;
font-size: 18px;
font-weight: 600;
text-decoration: none;
text-align: center;
background-color: #a41f00;
border-radius: 10px;
transition: 0.2s;
}
.btlink a::after {
content: '';
position: absolute;
right:15px;
top:45%;
width: 10px;
height: 10px;
border-top: 3px solid #fff;
border-right: 3px solid #fff;
transform: rotate(45deg);
}

.btlink a:hover {
text-decoration: none !important;
background-color: #c62500;
}

/*温泉の泉質と効能について*/
#about {
width: 100%;
padding: 40px 0px 0px 0px;
    font-size: 18px;
}
#about p.catch {
    width:950px;
    background: url(../images/about_bg.png) no-repeat;
    padding: 10px 195px;
    margin:0 auto 40px;
    font-size: 18px !important;
    line-height: 1.4;
    box-sizing: border-box;
}
#about p.catch span {
    text-align: center;
    display: block;
    margin: 0 0 15px;
    font-size: 22px;
    font-weight: bold;
}
#about dl {
    width:800px;
    margin: 25px auto;
    border: 2px solid #f1e3d5;
    box-sizing: border-box;
    padding: 20px;
    overflow: hidden;
    background: #fff;
}
#about dl dt {
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    padding: 0 10px 10px 10px;
    border-bottom: 1px solid #f1e3d5;
    margin-bottom: 10px;
}
#about dl dd {
    font-size: 16px;
    margin-top:10px;
}
#about dl dd p.onsen_tit {
    padding: 10px 10px 10px 40px;
    background: url(../images/icon_onsen2.png) no-repeat #d3d0d0;
    background-size: 25px 25px;
    background-position: 10px center;
    display: inline-block;
    margin-bottom: 7px;
    border-radius: 5px;
}

/*入浴のマナー*/
#manners p.catch {
    width:950px;
    background: url(../images/manners_bg.png) no-repeat;
    padding: 10px 195px;
    margin:0 auto 20px;
    font-size: 18px !important;
    line-height: 1.4;
    box-sizing: border-box;
}
#manners p.catch span {
    text-align: center;
    display: block;
    margin: 0 0 15px;
    font-size: 22px;
    font-weight: bold;
}
#manners ul {
    width:800px;
    margin: 0 auto;
    border: 2px solid #f1e3d5;
    box-sizing: border-box;
    padding: 20px;
    overflow: hidden;
    /*background: #fff;*/
}
#manners ul li {
    font-size: 17px;
    padding: 0 10px 10px 30px;
    border-bottom: 1px solid #f1e3d5;
    margin-bottom: 10px;
    background: url(../images/icon_onsen2.png) no-repeat;
    background-size: 20px 20px;
}
#manners ul li:last-of-type {
    border:none;
    padding-top: 15px;
    padding-left: 0;
    padding-bottom: 0px;
    margin-bottom: 0;
    font-size: 15px;
    background:none;
}
#manners dl dd p.onsen_tit {
    padding: 10px 10px 10px 40px;
    background: url(../images/icon_onsen2.png) no-repeat #d3d0d0;
    background-size: 25px 25px;
    background-position: 10px center;
    display: inline-block;
    margin-bottom: 7px;
    border-radius: 5px;
}

/*メディア紹介*/
.radioBox {
    width: 950px;
	line-height: 1.2;
	overflow: hidden;
	margin: 0px auto 20px auto;
	font-size: 130%;
}

.radioBox .detail {
	float: left;
	width: 700px;
    margin-right: 10px;
}

.radioBox .detail img {
	width: 700px;
    margin-bottom: 5px;
}

.radioBox .photo {
	float: left;
	width: 230px;
	margin-bottom: 10px;
}

.radioBox .photo p {
	text-align: center;
	margin-top: 4px;
	font-weight: bold;
}

.radioBox .photo img {
	width: 230px;
	height: auto;
}

.radioCaption {
	text-align: center;
	font-size: 153.9%;
	font-weight: bold;
	margin-top: 30px;
}

.scheduleBox {
clear: both;
	line-height: 1.4;
	width: 80%;
	margin: 0 10% 10px;
	padding: 20px 0;
	margin-top: 10px;
	text-align: center;
	background: #FDD;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}

.scheduleBox span {
	font-size: 120%;
    font-weight: bold;
	color: #F00;
}

.in h4 {
    font-size: 24px;
	letter-spacing: -1px;
    font-weight: normal;
    padding: 0px 0 20px 0px;
    text-align: center;
    font-family: "Mplus 1p";
    color: #000000;
    clear: both;
	margin: 0px;
}
.in h4 span:before {
    content: url(../images/h2_l.png);
    margin: 10px;
    position: relative;
    top: 8px;
}
.in h4 span:after {
    content: url(../images/h2_r.png);
    margin: 10px;
    position: relative;
    top: 8px;
}

.media {
}
.media p {
font-size: 16px;
text-align: center;
padding: 0px;
margin: 0px;
}
.media p img {
width: 850px;
margin-bottom: 10px;
}

/*Instagramキャンペーン*/
.catchBox {
	text-align: center;
} 

.catchBox img {
    width: 400px;
    margin: 0 20px;
}

/*list横並び*/
*, *:before, *:after {
	box-sizing: border-box;
}

.itemList3 {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}

.itemList3 > div {
	width: 33.33333%;
	padding: 10px;
}

.itemList3 > div img {
	width: 100%;
}

.itemList3 > div dd {
	margin: 0; /* これがないとずれる */
	font-size: 123.1%;
	line-height: 1.5;
	text-align: left;
	/*background: #FFF;*/
}

.itemList4 {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}

.itemList4 > div {
	width: 25%;
	padding: 4px;
}

.itemList4 > div img {
	width: 100%;
}

.itemList4 > div dd {
	font-size: 123.1%;
	text-align: left;
	/*padding: 10px;*/
	background: #FFF;
}

.itemList5 {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}

.itemList5 > div {
	width: 20%;
	padding: 4px;
}

.itemList5 > div img {
	width: 100%;
}

.itemList5 > div dd {
	font-size: 123.1%;
	text-align: left;
	/*padding: 10px;*/
	background: #FFF;
}

/*ボタン*/
.Btn {
  color: #fff;
  width: 70%;
  margin: 20px auto 0;
  text-align: center;
  position: relative; /* 追記 */
  font-size: 153.9%;
  font-weight: bold;
}

.Btn a {
	color: #fff;
	display: block;
	width: 100%;
	padding: 20px 0;
	background: #F60;
	border-radius: 5px;
}

.Btn a:hover {
	opacity: 0.8;
}

.Btn span {
  font-size: 75%;
  font-weight: normal;
}

.Btn::after {
  content: "＞";
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}

.Btn_gray {
  color: #fff;
  width: 70%;
  margin: 20px auto 0;
  text-align: center;
  background: #666;
  border-radius: 5px;
  padding: 20px 30px;
  position: relative; /* 追記 */
  font-size: 153.9%;
  font-weight: bold;
}

.Btn_gray::after {
  content: "＞";
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}

}