@charset "utf-8";

.around_sec-arrow {
 position: relative;
 padding-right: 26px;
}
.around_sec-arrow:before {
 content: "";
 display: block;
 width: 12px;
 height: 1px;
 position: absolute;
 right: 8px;
 top:50%;
 background-color: #133263;
}
.around_sec-arrow:after {
 content: "";
 display: block;
 width: 5px;
 height: 5px;
 position: absolute;
 right: 8px;
 top:50%;
 transform: translateY(-50%) rotate(45deg);
 border-top:solid 1px #133263;
 border-right:solid 1px #133263;
}

@media print,screen and (min-width: 769px) {
/* ---------------------------------------
　index
--------------------------------------- */
	#head_line.toppage{
		background-image: url(../img/index_main.jpg);
	}
#head_line > h1 {
        /* border-top: 1px solid #FFF; */
        font-size: 42px;
        line-height: 1;
        font-weight: bold;
        padding-top: 15px;
        margin-top: 15px;
    }  
	#catch_box{
		font-size: 16px;
		line-height: 2;
		text-align: center;
  margin: 80px auto 0;
  max-width: 1500px;
 }
	#catch_box > h1{
		color: #133263;
		font-size: 26px;
		font-weight: bold;
	}

	#google_map{
		margin: 80px auto 0;
		max-width: 1080px;
		height: 480px;
	}
	#google_map iframe{
		width: 100%;
		height: 480px;
	} 
	
	.map_area{
		margin: 80px auto 0;
		max-width: 1080px;
	}
	.map_area img{
		height: auto;
		width: 100%;
	}
	
	
	
	#hotel_the_flag_sec{
		margin: 60px auto 0;
		max-width: 800px;
	}
	#hotel_the_flag_sec > dl{
		display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
	}
	#hotel_the_flag_sec > dl > dt,
	#hotel_the_flag_sec > dl > dd{
		box-sizing: border-box;
		padding: 15px 0;
	}
	#hotel_the_flag_sec > dl > dt{
		padding-left: 10px;
		width: 21%;
		border-bottom: 1px solid #f2eee5;
	}
	#hotel_the_flag_sec > dl > dd{
		width: 79%;
		border-bottom: 1px solid #f2eee5;
	}
	#hotel_the_flag_sec > dl > *:nth-last-child(1),
	#hotel_the_flag_sec > dl > *:nth-last-child(2){
		border-bottom: none;
		padding-bottom: 0;
	}
	#hotel_the_flag_sec > .btn_area{
		display: flex;
		justify-content:space-around;
		margin-top: 40px;
	}
	#hotel_the_flag_sec > .btn_area > .btn{
		width: 48.5%;
	}
	
	
	
	#timereq_sec{
		margin: 80px auto 0;
		max-width: 800px;
	}
	#timereq_sec .fig{
		margin-top: 20px;
	}
	#timereq_sec .fig img{
		height: auto;
		width: 100%;
	}
	
	
	#around_sec{
		margin: 80px auto 0;
		max-width: 800px;
	}
	#around_sec > ul{
		box-sizing: border-box;
		margin-top: 15px;
	}
	#around_sec > ul > li{
		margin: 5px 0;
	}
	#around_sec > ul > li {
 
		border: 2px solid #f2eee5;
		box-sizing: border-box;
		color: #333;
		display: flex;
		flex-grow: 1;
		flex-direction:column;
		justify-content: center;
		align-self: stretch;
	}
	#around_sec > ul > li dl{
		box-sizing: border-box;
		padding: 15px 20px 15px 20px;
		display: flex;
		flex-grow: 1;
		flex-direction:column;
		justify-content: center;
		align-self: stretch;
	}
	#around_sec > ul > li dl > dt{
		font-size: 15px;
		font-weight: bold;
	}
	#around_sec > ul > li dl > dd{
		font-size: 13px;
	}
	
	
	#car_sec{
		margin: 80px auto 0;
		max-width: 800px;
	}
	#car_sec > p{
		margin: 20px 10px 0;
	}
	#car_sec > dl{
		display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
		margin-top: 20px;
	}
	#car_sec > dl > dt{
		box-sizing: border-box;
		padding-left: 10px;
		margin-top: .75em;
		width: 10em;
	}
	#car_sec > dl > dd{
		margin-top: .75em;
		width: calc(100% - 10em);
	}
	#car_sec > dl > dd p {
		margin-top: .5em;
	}
	
	#route_search_sec{
		margin: 80px auto 0;
		max-width: 800px;
	}
	#route_search_sec > form{
		display: flex;
		justify-content: space-between;
		margin-top: 20px;
	}
	#route_search_sec > form label,
	#route_search_sec > form input[type=button]{
		display: inline-block;
		width: 66%;
	}
	#route_search_sec > form select,
	#route_search_sec > form input[type=button]{
		box-sizing: border-box;
		font-size: 16px;
		font-weight: bold;
	}
	#route_search_sec > form select{
		display: block;
		border: 2px solid #f2eee5;
		padding: 15px;
	 -webkit-appearance: none;
  appearance: none;
		width: 100%;
	}
	::-ms-expand {
		display: none;
	}
	#route_search_sec > form label{
		position: relative;
	}
	#route_search_sec > form label:before{
		color: #cfc4a8;
		position: absolute;
		content: "▼";
		display: block;
		top: 15px;
		right: 15px;
		pointer-events: none;
	}
	#route_search_sec > form > input[type=button]{
		background: #b09e76 url(../img/icon_search_white.png) right 15px center no-repeat;
		box-sizing: border-box;
		border: none;
		cursor: pointer;
		text-align: left;
		width: 30%;
	}

	#timereq_sec .line_head,
	#around_sec .line_head,
	#car_sec .line_head,
	#route_search_sec .line_head,
	#train_sec .line_head,
	#taxi_sec .line_head,
	#bus_sec .line_head
	{
		background-position: 10px top;
		background-repeat: no-repeat;
		background-size: 30px auto;
		padding-left: 50px;
	}
	#walk_sec .line_head{
		padding-left: 0;
	}
	
	#timereq_sec .line_head{background-image: url(../img/icon_train.png);}
	#around_sec .line_head{background-image: url(../img/icon_bag.png);}
	#car_sec .line_head{background-image: url(../img/icon_car.png);}
	#route_search_sec .line_head{background-image: url(../img/icon_search.png);}
	
	#train_sec .line_head{background-image: url(../img/icon_train.png);}
	#taxi_sec .line_head{background-image: url(../img/icon_taxi.png);}
	#bus_sec .line_head{background-image: url(../img/icon_bus.png);}
	
#recommend_sec,
#train_sec ,
	#taxi_sec,
	#bus_sec,
	#exit1,
	#exit2,
	#walk_sec	{
		margin: 120px auto 0;
		max-width: 800px;
	}
	#recommend_sec > .btn,
#train_sec > .btn,
	#taxi_sec > .btn,
	#bus_sec > .btn,
	#exit1 > .btn,
	#exit2 > .btn,
	#walk_sec > .btn{
		margin: 40px auto 0;
		width: 260px;
	}
	
#GoogleMap {
 width: calc(100vw - 200px);
 position: relative;
 top:0;
 left: 50%;
 margin-top: 80px;
 transform: translateX(-50%);
}
	
}

@media screen and (max-width:768px) {
	
/* ---------------------------------------
　index
--------------------------------------- */
	#head_line{
		background-image: url(../img/index_main.jpg);
	}
	 #head_line > h1 {
        /* border-top: 1px solid #FFF; */
        font-size: 30px;
        line-height: 1.2;
        font-weight: bold;
        padding-top: 15px;
        margin-top: 15px;
    }
	#catch_box{
		font-size: 16px;
		line-height: 2;
		text-align: center;
  margin: 80px 15px 0;
 }
	#catch_box > h1{
		color: #133263;
		font-size: 17px;
		font-weight: bold;
	}
	
	#google_map{
		margin: 40px 15px 0;
		height: 480px;
	}
	#google_map iframe{
		width: 100%;
		height: 360px;
	} 
	
	.map_area{
		margin: 40px 15px 0;
	}
	.map_area img{
		height: auto;
		width: 100%;
	}
	
	
	#hotel_the_flag_sec{
		margin: 30px 15px 0;
	}
	#hotel_the_flag_sec > dl{
		display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
	}
	#hotel_the_flag_sec > dl > dt,
	#hotel_the_flag_sec > dl > dd{
		box-sizing: border-box;
		padding: 15px 0;
	}
	#hotel_the_flag_sec > dl > dt{
		padding-left: 10px;
		width: 21%;
		border-bottom: 1px solid #f2eee5;
	}
	#hotel_the_flag_sec > dl > dd{
		width: 79%;
		border-bottom: 1px solid #f2eee5;
	}
	#hotel_the_flag_sec > dl > *:nth-last-child(1),
	#hotel_the_flag_sec > dl > *:nth-last-child(2){
		border-bottom: none;
		padding-bottom: 0;
	}
	#hotel_the_flag_sec > .btn_area{
		margin-top: 40px;
	}
	#hotel_the_flag_sec > .btn_area > .btn{
		margin-top: 5px;
		width: 100%;
	}
	
	#timereq_sec{
		margin: 40px 15px 0;
	}
	#timereq_sec .fig{
		margin-top: 20px;
	}
	#timereq_sec .fig img{
		height: auto;
		width: 100%;
	}
	
	
#around_sec{
		margin: 40px 15px 0;
	}
	#around_sec > ul{
		box-sizing: border-box;
		margin-top: 15px;
	}
	#around_sec > ul > li{
		margin: 5px 0;
	}
	#around_sec > ul > li {
		border: 2px solid #f2eee5;
		box-sizing: border-box;
		color: #333;
		display: flex;
		flex-grow: 1;
		flex-direction:column;
		justify-content: center;
		align-self: stretch;
	}
	#around_sec > ul > li dl{
		box-sizing: border-box;
		padding: 15px;
		display: flex;
		flex-grow: 1;
		flex-direction:column;
		justify-content: center;
		align-self: stretch;
	}
	#around_sec > ul > li dl > dt{
		font-size: 15px;
		font-weight: bold;
	}
	#around_sec > ul > li dl > dd{
		font-size: 13px;
	}
	
	
	
	#car_sec{
		margin: 40px 15px 0;
	}
	#car_sec > p{
		margin: 20px 10px 0;
	}
	#car_sec > dl{
		display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
		margin-top: 20px;
	}
	#car_sec > dl > dt{
		box-sizing: border-box;
		padding-left: 10px;
		margin-top: 5px;
		width: 25%;
	}
	#car_sec > dl > dd{
		margin-top: 5px;
		width: 75%;
	}
	
	
	
	#route_search_sec{
		margin: 40px 15px 0;
	}
	#route_search_sec > form{
		margin-top: 20px;
	}
	#route_search_sec > form label,
	#route_search_sec > form input[type=button]{
		display: block;
		margin-top: 5px;
		width: 100%;
	}
	#route_search_sec > form select,
	#route_search_sec > form input[type=button]{
		box-sizing: border-box;
		font-size: 16px;
		font-weight: bold;
	}
	#route_search_sec > form select{
		display: block;
		border: 2px solid #f2eee5;
		padding: 15px;
	 -webkit-appearance: none;
  appearance: none;
		width: 100%;
	}
	::-ms-expand {
		display: none;
	}
	#route_search_sec > form label{
		position: relative;
	}
	#route_search_sec > form label:before{
		color: #cfc4a8;
		position: absolute;
		content: "▼";
		display: block;
		top: 15px;
		right: 15px;
		pointer-events: none;
	}
	#route_search_sec > form > input[type=button]{
		background: #b09e76 url(../img/icon_search_white.png) right 15px center no-repeat;
		box-sizing: border-box;
		border: none;
		cursor: pointer;
		text-align: left;
	}
	
	
	#timereq_sec .line_head,
	#around_sec .line_head,
	#car_sec .line_head,
	#route_search_sec .line_head,
	#train_sec .line_head,
	#taxi_sec .line_head,
	#bus_sec .line_head{
		background-position: 10px top;
		background-repeat: no-repeat;
		background-size: 30px auto;
		padding-left: 50px;
	}
	
	#timereq_sec .line_head{background-image: url(../img/icon_train.png);}
	#around_sec .line_head{background-image: url(../img/icon_bag.png);}
	#car_sec .line_head{background-image: url(../img/icon_car.png);}
	#route_search_sec .line_head{background-image: url(../img/icon_search.png);}
	
	#train_sec .line_head{background-image: url(../img/icon_train.png);}
	#taxi_sec .line_head{background-image: url(../img/icon_taxi.png);}
	#bus_sec .line_head{background-image: url(../img/icon_bus.png);}
	
 #recommend_sec,
 #train_sec,
	#taxi_sec,
	#bus_sec,
	#exit1,
	#exit2,
	#walk_sec{
		margin: 30px 15px 0;
	}
	#recommend_sec > .btn,
 #train_sec > .btn,
	#taxi_sec > .btn,
	#exit1 > .btn,
	#exit2 > .btn,
	#bus_sec > .btn,
	#walk_sec > .btn{
		margin: 20px auto 0;
		width: 100%;
	}
	
#GoogleMap {
 position: relative;
 top:0;
 margin-top: 40px;
}
	
}