@charset "utf-8";
body {
	font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI","Noto Sans Japanese","ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size:18px;
}
h1 {
	font-size:2.1em;
	font-weight:bolder;
	margin:1% 0 1%;
}
h2 {
	background:#2C8FFF;
	color:#fff;
	font-size:1.3em;
	padding:10px;
}
h3 {
	font-size:1.3em;
	margin:0;
}
p {
	font-size:1em;
	line-height:1;
	padding:0;
	margin:0;
}
ul {
	list-style:none;
	padding:0;
	margin:0;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
}
/*header nav {
	-webkit-box-shadow: 0 2px 4px #888;
	box-shadow: 0 2px 4px #888;
	background: #000;
	background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#000));
	background: -webkit-linear-gradient(#555, #000);
	background: linear-gradient(#555, #000);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#555555, endcolorstr=#000000)";
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#555555, endcolorstr=#000000);
	zoom: 1;
}
.navbar-light .navbar-brand {
	color:#fff;
	font-weight:bold;
}
.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
	color:#fff;
}
.navbar-light .navbar-toggler {
	color:#fff;
	border-color:#fff;
}*/
.navbar-light .navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
/*.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {
	color:#fff;
}*/
.navbar-brand img {
	width:50%;
	float:left;
	margin-right:1%;
}
.navbar-brand p {
	font-size:0.86em;
}
.navbar-brand hr {
	margin-top:0.5rem;
	margin-bottom:0;
	width:130%;
}
.navbar-nav {
	margin-left:auto;
}
.qr-smart {
	width:20%;
	margin-left:auto;
}
.qr-smart img {
	width:100%;
}
.collapse:not(.show) {
	display:none!important;
}
.search-bar {
	background: #000;
	background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#000));
	background: -webkit-linear-gradient(#555, #000);
	background: linear-gradient(#555, #000);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#555555, endcolorstr=#000000)";
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#555555, endcolorstr=#000000);
	zoom: 1;
	padding:5px;
}
.search-bar .container:after {
	content:" ";
	display:block;
	clear:both;
}
.search-bar .navbar-form {
	width:30%;
	float:right;
}
.search-bar ul {
	float:right;
	width:25%;
}
.search-bar ul li {
	color:#fff;
	width:50%;
}
.search-bar ul li a {
	color:#fff;
	padding:5%;
	display:block;
}
.breadcrumb {
	background-color:#fff;
	font-size:0.8em;
	margin:0;
}
i.ico-roupe,i.ico-book,i.ico-question,i.ico-hotel,i.ico-ping,i.ico-tel,i.ico-station,i.ico-station-w,i.ico-walk,i.ico-train,i.ico-car,i.ico-compass,i.ico-hokkaido,i.ico-koshinetsu,i.ico-kanto,i.ico-tokai,i.ico-kansai,i.ico-chugoku,i.ico-kyusyu {
	position:relative;
	padding:1.2em;
}
i.ico-roupe:after {
	background:url(./img/ico-roupe.png) no-repeat;
	background-size:cover;
}
i.ico-book:after {
	background:url(./img/ico-book.png) no-repeat;
	background-size:cover;
}
i.ico-question:after {
	background:url(./img/ico-question.png) no-repeat;
	background-size:cover;
}
i.ico-hotel:after {
	background:url(./img/ico-hotel.png) no-repeat;
	background-size:cover;
}
i.ico-station-w:after {
	background:url(./img/ico-station-w.png) no-repeat;
	background-size:cover;
}
i.ico-ping:after {
	background:url(./img/ico-ping.png) no-repeat;
	background-size:cover;
}
i.ico-tel:after {
	background:url(./img/ico-tel.png) no-repeat;
	background-size:cover;
}
i.ico-station:after {
	background:url(./img/ico-station.png) no-repeat;
	background-size:cover;
}
i.ico-walk:after {
	background:url(./img/ico-walk.png) no-repeat;
	background-size:cover;
}
i.ico-train:after {
	background:url(./img/ico-train.png) no-repeat;
	background-size:cover;
}
i.ico-car:after {
	background:url(./img/ico-car.png) no-repeat;
	background-size:cover;
}
i.ico-compass:after {
	background:url(./img/ico-compass.png) no-repeat;
	background-size:cover;
}
i.ico-hokkaido:after {
	background:url(./img/ico-hokkaido.png) no-repeat;
	background-size:cover;
}
i.ico-koshinetsu:after {
	background:url(./img/ico-koshinetsu.png) no-repeat;
	background-size:cover;
}
i.ico-kanto:after {
	background:url(./img/ico-kanto.png) no-repeat;
	background-size:cover;
}
i.ico-tokai:after {
	background:url(./img/ico-tokai.png) no-repeat;
	background-size:cover;
}
i.ico-kansai:after {
	background:url(./img/ico-kansai.png) no-repeat;
	background-size:cover;
}
i.ico-chugoku:after {
	background:url(./img/ico-chugoku.png) no-repeat;
	background-size:cover;
}
i.ico-kyusyu:after {
	background:url(./img/ico-kyusyu.png) no-repeat;
	background-size:cover;
}
i.ico-roupe:after,i.ico-book:after,i.ico-question:after,i.ico-hotel:after,i.ico-ping:after,i.ico-tel:after,i.ico-station:after,i.ico-station-w:after,i.ico-walk:after,i.ico-train:after,i.ico-car:after,i.ico-compass:after,i.ico-hokkaido:after,i.ico-koshinetsu:after,i.ico-kanto:after,i.ico-tokai:after,i.ico-kansai:after,i.ico-chugoku:after,i.ico-kyusyu:after {
	content:" ";
	display:block;
	width:2.5em;
	height:2.5em;
	position:absolute;
	top:16px;
	left:-10px;
}
.area-select {
	box-shadow:3px 3px 3px #aaa;
	padding-bottom:1%;
}
.area-select > ul {
	font-size:0.9em;
	margin:15px 0 15px auto;
	width:99%;
}
.area-select > ul > li {
	padding:5px 3px;
	text-align:center;
	width:9.4%;
}
.area-select > ul > li:first-child {
	font-weight:bold;
	width:15%;
	text-align:left;
}
.txt-area {
	box-shadow:3px 3px 3px #aaa;
}
.txt-area p {
	font-size:0.9em;
	line-height:1.4;
	padding:3%;
}
.foot-area {
	box-shadow:3px 3px 3px #aaa;
	margin-top:3%;
}
.foot-area p {
	font-size:0.9em;
	line-height:1.4;
	padding:1%;
}
footer {
	-webkit-box-shadow: 0 -5px 4px #000;
	box-shadow: 0 -5px 4px #000;
	background: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#fff));
	background: -webkit-linear-gradient(#000, #fff);
	background: linear-gradient(#000, #fff);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#000000, endcolorstr=#ffffff)";
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#000000, endcolorstr=#ffffff);
	zoom: 1;
	padding:3% 0;
	margin-top:2%;
	text-align:center;
}
footer a,footer a:hover {
	color:#fff;
}
.f_copyright {
	margin-top:1%;
}

/*マップ操作*/
#map {
	width:100%;
	height:600px;
	margin-bottom:1%;
}

.area-select.sub > ul {
	width:97%;
}
.area-select.sub > ul > li {
	background:none;
	width:16%;
}
.area-select.sub > ul > li a,.area-select.sub > ul > li span {
	display:block;
	border:1px solid #eee;
	border-radius:5%;
	padding:1%;
	text-align:center;
	font-weight:normal;
}
.hotel-list {
	border:2px solid #eee;
	box-shadow:1px 1px 5px #aaa;
}
.hotel-list ul {
	display:block;
}
.hotel-list ul li {
	background:#eee;
	margin:1%;
	border:1px solid #999;
	position:relative;
}
.hotel-list ul li:after {
	content:" ";
	display:block;
	clear:both;
}
.hotel-meta {
	float:left;
	width:95%;
	margin:0;
	position:relative;
	padding:1%;
}
.hotel-meta > div {
	float:left;
	position:relative;
	padding:1%;
}
.hotel-meta > div,.hotel-meta > div h3 {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.hotel-meta > .name {
	width:40%;
}
.hotel-meta > .addr {
	width:40%;
	cursor:pointer;
}
.hotel-meta > .tel {
	width:20%;
}
.hotel-meta > .addr:before,.hotel-meta > .tel:before {
	content:" ";
	background:#777;
	position:absolute;
	top:0;
	left:0;
	width:2px;
	height:50px;
}
.hotel-meta > .addr i:after,.hotel-meta > .tel i:after {
	top:12px;
	left:-6px;
}
.border {
	width:2px;
	height:75px;
	position:relative;
}
.hotel-flg {
	width:50px;
	height:50px;
	position:absolute;
	top:10px;
	right:1%;
}
.hotel-flg img {
	width:100%;
}
.hotel-detail {
	position:relative;
}
.hotel-detail h2 a {
	color:#fff;
	text-decoration:none;
}
.detail-meta:after {
	content:" ";
	display:block;
	clear:both;
}
.detail-meta dl dt {
	float:left;
	margin-right:10px;
}
.detail-meta dl dt > i:after {
	top:12px;
	left:-4px;
}
.detail-meta dl dt.msg {
	background:#eee;
}
.detail-meta dl dt,.detail-meta dl dd {
	padding:1%;
}
.detail-meta dl dd > .spacer:last-child {
	display:none;
}
.hotel-detail .hotel-flg {
	width:150px;
	height:150px;
	position:absolute;
	top:21%;
	right:1%;
	border:2px solid #999;
}
.route-nav {
	display:flex;
	width:80%;
	margin:0 auto 5%;
	
}
.route-nav > a {
	width:32%;
	margin:0 auto;
}
.station-select {}
.station-select h3 {
	color:#fff;
	background:#2C8FFF;
	padding:5px 10px;
}
.station-select ul {
	display:block;
	margin:5px 10px;
}
.station-select ul:after {
	content:" ";
	display:block;
	clear:both;
}
.station-select ul li {
	width:33.33333%;
	float:left;
	padding:5px 10px;
}
.station-select ul li a,.station-select ul li span {
	display:block;
	padding:5px 10px;
	border:1px solid #eee;
}
.detail-map {
	text-align:center;
}
.detail-map iframe {
	width:80%;
	height:450px;
}
@media screen and (min-width:1025px) {
	.route-nav {
		display:none;
	}
}
@media screen and (max-width:1199px) {
	body {
		font-size:17px;
	}
	.area-select > ul {
		display:flex;
		-webkit-flex-wrap:wrap;
		flex-wrap:wrap;
	}
	.area-select > ul > li {
		width:11%;
	}
	.area-select > ul > li:first-child {
		width:100%;
	}
	.area-select.sub > ul > li {
		width:16%;
	}
	.detail-meta dl {
		width:80%;
	}
}
@media screen and (max-width:991px) {
	body {
		font-size:12px;
	}
	.qr-smart,.search-bar {
		display:none;
	}
	i.ico-roupe:after, i.ico-book:after, i.ico-question:after, i.ico-hotel:after, i.ico-ping:after, i.ico-tel:after, i.ico-station:after, i.ico-station-w:after, i.ico-walk:after, i.ico-train:after, i.ico-car:after, i.ico-hokkaido:after, i.ico-koshinetsu:after, i.ico-kanto:after, i.ico-tokai:after, i.ico-kansai:after, i.ico-chugoku:after, i.ico-kyusyu:after {
		top:10px;
	}
	.area-select > ul {
		margin:15px auto;
	}
	.area-select > ul > li {
		width:14%;
	}
	.area-select.sub > ul > li {
		width:20%;
	}
	.txt-area {
		margin-top:3%;
	}
	.hotel-flg {
		top:2px;
		right:2px;
	}
	.detail-meta dl {
		width:75%;
	}
	.detail-meta dl dt {
		width:20%;
	}
	.hotel-detail .hotel-flg {
		top:28%;
	}
}
@media screen and (max-width:767px) {
	body {
		font-size:18px;
	}
	.area-select > ul > li {
		width:20%;
	}
	.area-select.sub > ul > li {
		width:33.333333%;
	}
	.hotel-meta > .name {
		width:60%;
	}
	.hotel-meta > .addr {
		width:20%;
	}
	.hotel-flg {
		width:40px;
		height:40px;
		top:3px;
		height:3px;
	}
	.detail-meta dl dt {
		width:25%;
	}
	.detail-meta dl dd:last-child {
		width:130%;
	}
	.hotel-detail .hotel-flg {
		width:100px;
		height:100px;
	}
}
@media screen and (max-width:575px) {
	body {
		font-size:10px;
	}
	h1 {
		font-size:1.3em;
	}
	h2 {
		font-size:1em;
	}
	h2 small {
		display:none;
	}
	.navbar-brand img {
		width:35%;
	}
	.navbar-brand p {
		font-size:0.54em;
	}
	.navbar-brand hr {
		width:104%;
	}
	.breadcrumb {
		padding:0;
		padding-bottom:3%;
	}
	i.ico-roupe:after, i.ico-book:after, i.ico-question:after, i.ico-hotel:after, i.ico-ping:after, i.ico-tel:after, i.ico-station:after, i.ico-station-w:after, i.ico-walk:after, i.ico-train:after, i.ico-car:after, i.ico-hokkaido:after, i.ico-koshinetsu:after, i.ico-kanto:after, i.ico-tokai:after, i.ico-kansai:after, i.ico-chugoku:after, i.ico-kyusyu:after {
		top:7px;
		left:-6px;
	}
	.area-select.sub > ul > li {
		width:50%;
	}
	.hotel-detail .hotel-flg {
		top:25%;
	}
	.station-select ul li {
		width:50%;
	}
	.station-select ul li a, .station-select ul li span {
		text-align:center;
	}
	.navbar-light .navbar-toggler {
		position:absolute;
		top:15px;
		right:3%;
	}
	.detail-meta dl dt {
		text-align:center;
	}
	.detail-meta dl dt > i:after {
		top:8px;
		left:0;
	}
	.hotel-detail .hotel-flg {
		width:80px;
		height:80px;
		top:26%;
	}
}
@media screen and (max-width:413px) {
	h1 {
		font-size:1.2em;
		line-height:1.2;
	}
	.navbar-brand p {
		font-size:0.5em;
	}
	.hotel-meta > .addr i:after, .hotel-meta > .tel i:after {
		top:7px;
		left:0;
	}
	.hotel-flg {
		width:29px;
		height:29px;
		top:0;
		right:0;
	}
}
@media screen and (max-width:374px) {
	h1 {
		font-size:0.96em;
		line-height:2;
	}
	.navbar-light .navbar-toggler {
		top:10px;
	}
	.hotel-flg {
		width:26px;
		height:26px;
	}
	.hotel-detail .hotel-flg {
		width:60px;
		height:60px;
	}
}
