@charset "utf-8";

/**
 *
 *  ページ用CSS
 *　location
 * 
 */

/*--------------------------------------------------------------------------
   Overwright
---------------------------------------------------------------------------*/



/*--------------------------------------------------------------------------
   Content
---------------------------------------------------------------------------*/

/* intro
-----------------------------------------------------------------*/
.intro{
	padding: 180px 0;
	background: url(../img/common/cont_upper_bg.png) no-repeat left top var(--light);
	background-size: 100% auto;	
}
.intro h2{
	margin-bottom: 80px;
	font-size: 4.5rem;
	font-weight: 400;
	letter-spacing: .2em;
	text-align: center;
}
.intro .txt-lead{
	margin-bottom: 180px;
	text-align: center;
	font-size: 3rem;
	letter-spacing: .2em;
}
.intro-item{
	align-items: center;
}
.intro-item .pic{
	position: relative;
	max-width: 575px;
	width: calc(50% - 10px);
}
.intro-item .pic .caption{
	display: block;
	margin-top: 5px;
	line-height: 1.4;
	text-align: right;
}
.intro-item .txt-area{
	width: calc(50% - 10px);
}
.intro-item .txt-area .txt{
	max-width: 500px;
	font-size: 2rem;
	line-height: 2.2;
	letter-spacing: .2em;
}
.intro-item + .intro-item {
	flex-direction: row-reverse;
}
.intro-item + .intro-item .txt-area .txt{
	margin-left: auto;
}

/* category
-----------------------------------------------------------------*/
.category{
	padding-bottom: 180px;
	background: #E6E6E6;
}
.cat-item + .cat-item{
	margin-top: 180px;
}
.cat-item .ttl-cat{
  position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 400px;
	margin-bottom: 120px;
	background: center center no-repeat;
	background-size: cover;
	font-weight: 400;
	line-height: 1;
	letter-spacing: .4em;
	color: var(--light);
	text-align: center;
}
.cat-item .ttl-cat .en{
	display: block;
	font-size: 7.5rem;
}
.cat-item .ttl-cat .ja{
	display: block;
	margin-top: 20px;
	font-size: 1.6rem;
}
.cat-item .ttl-cat .caption{
  position: absolute;
  right: 10px;
  bottom: 10px;
	letter-spacing: 0;  
}
.cat-item .txt-lead{
	margin-bottom: 60px;
	text-align: center;
	font-size: 3rem;
	letter-spacing: .2em;
}
.cat-item .txt-lead + .txt{
	margin-bottom: 80px;
	text-align: center;
	font-size: 2rem;
	line-height: 2.2;
	letter-spacing: .2em;
}
.cat-item .ttl-cat-topic{
	margin-bottom: 80px;
	text-align: center;
	font-size: 2.6rem;
	font-weight: 400;
	letter-spacing: .2em;
}
.cat-item .ttl-cat-topic .num{
	display: block;
	margin-bottom: 30px;
	font-size: 1.6rem;
	letter-spacing: .04em;
	line-height: 1;
	color: var(--gold);
}
.cat-item .ttl-cat-topic .num strong{
	display: block;
	margin-top: 5px;
	font-size: 3rem;
	font-weight: 400;
}
.cat-item .ttl-cat-topic .num::after{
	display: block;
	margin-top: 10px;
	content: "|";
	font-size: 2rem;
}
.cat-item .spot-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.cat-item .spot-list .thumb{
  position: relative;  
}
.cat-item .spot-list h4{
	font-size: 1.6rem;
	line-height: 1.5;
	font-weight: 400;
	letter-spacing: .2em;
}
.cat-item .spot-list .distance{
	font-size: 1.1rem;
	color: #696969;
	letter-spacing: .1em;
}
.cat-item .spot-list .distance span{
	font-size: 150%;
}


/* shop ---------------------------------*/
.cat-item.shop .ttl-cat{
	background-image: url(../img/location/bg_ttl_shop_pc.jpg);
}
.cat-item.shop .map-area{
	position: relative;
	margin-bottom: 100px;
	padding-bottom: 20px;
}
.cat-item.shop .map-area .caption{
	position: absolute;
	right: 0;
	bottom: 0;
	line-height: 1.4;	
}
.cat-item.shop .map-area .swipe{
	display: none;
}
.cat-item.shop .cat-topic + .cat-topic{
	margin-top: 100px;
}
.cat-item.shop .restaurant .spot-list li{
	display: flex;
	align-items: flex-start;
	max-width: 580px;
	width: calc(50% - 10px);
}
.cat-item.shop .restaurant .spot-list li:nth-child(n+3){
	margin-top: 60px;
}
.cat-item.shop .restaurant .spot-list .thumb{
	position: relative;
	width: 46%;
}
.cat-item.shop .restaurant .spot-list .thumb .caption{
  position: absolute;
  right: 10px;
  bottom: 8px;
  line-height: 1;  
}
.cat-item.shop .restaurant .spot-list .txt-area{
	width: calc(54% - 20px);
	margin-left: 20px;
}
.cat-item.shop .restaurant .spot-list h4{
	font-size: 2rem;
}
.cat-item.shop .restaurant .spot-list .txt{
	margin-top: 10px;
	font-size: 1.4rem;
	letter-spacing: .2em;
}
.cat-item.shop .station-area .spot-list li{
	max-width: 280px;
	width: calc((100% - 30px)/4);
}
.cat-item.shop .station-area .spot-list h4{
	margin-top: 7px;
}

/* park ---------------------------------*/
.cat-item.park .ttl-cat{
	background-image: url(../img/location/bg_ttl_park_pc.jpg);
}
.cat-item.park .ttl-cat-topic small{
	display: block;
	font-size: 1.1rem;
	color: #696969;
	letter-spacing: .1em;
}
.cat-item.park .ttl-cat-topic small span{
	font-size: 150%;
}
.cat-item.park .park01 .ttl-cat-topic{
	margin-bottom: 50px;
}
.cat-item.park .park01 .ttl-cat-topic + .txt{
	margin-bottom: 80px;
	text-align: center;
	font-size: 1.6rem;
	line-height: 2.2;
	letter-spacing: .3em;	
}
.cat-item.park .park01 .spot-list{
	margin-bottom: 60px;
}
.cat-item.park .park01 .spot-list li{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.cat-item.park .park01 .spot-list .thumb{
	max-width: 580px;
	width: calc(50% - 10px);
}

.cat-item.park .park02 .spot-list{
	margin-bottom: 200px;
}
.cat-item.park .park02 .spot-list li{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;	
	max-width: 580px;
	width: calc(50% - 10px);
}
.cat-item.park .park02 .spot-list li:nth-child(3){
	margin-top: 60px;
}
.cat-item.park .park02 .spot-list .thumb{
	max-width: 278px;
	width: calc(50% - 5px);	
}
.cat-item.park .park02 .spot-list .txt-area{
	width: 100%;
	margin-top: 7px;
}
.cat-item.park .green-matrix .ttl-cat-topic{
	margin-bottom: 60px;
} 
.cat-item.park .green-matrix .map-area{
	position: relative;
	padding-bottom: 20px;
	margin-bottom: 50px;
}
.cat-item.park .green-matrix .map-area .caption{
	position: absolute;
	right: 0;
	bottom: 0;
	line-height: 1.4;	
}
.cat-item.park .green-matrix .map-area .swipe{
	display: none;	
}
.cat-item.park .green-matrix .layout-box{
	margin-bottom: 120px;
}
.cat-item.park .green-matrix .spot-list{
	width: 48%;
}
.cat-item.park .green-matrix .spot-list li{
	max-width: 280px;
	width: calc(50% - 5px);
}
.cat-item.park .green-matrix .spot-list h4{
	margin-top: 7px;
}
.cat-item.park .green-matrix .txt{
	width: 48%;
	letter-spacing: .1em;
}
.cat-item.park .column .txt{
	margin-bottom: 60px;
}
.cat-item.park .column .pic-list{
	display: flex;
	justify-content: space-between;	
	max-width: 990px;
	margin-inline: auto;	
}
.cat-item.park .column .pic-list li{
	max-width: 480px;
	width: calc(50% - 10px);
}
.cat-item.park .column .pic-list .caption{
	display: block;
	margin-top: 3px;
	text-align: right;
}

/* central ---------------------------------*/
.cat-item.central .ttl-cat{
	background-image: url(../img/location/bg_ttl_central_pc.jpg);
}
.cat-item.central .map-area{
	position: relative;
	padding-bottom: 20px;
	margin-bottom: 70px;
}
.cat-item.central .map-area .caption{
	position: absolute;
	right: 0;
	bottom: 0;
	line-height: 1.4;	
}
.cat-item.central .map-area .swipe{
	display: none;	
}
.cat-item.central .layout-box{
	margin-bottom: 50px;
}
.cat-item.central .area-item{
	max-width: 570px;
	width: calc(50% - 10px);
}
.cat-item.central .area-item .pic-main{
	position: relative;
	margin-bottom: 10px;
	color: var(--light);
}
.cat-item.central .area-item .pic-main .name{
	position: absolute;
	left: 10px;
	bottom: 12px;
	line-height: 1;	
}
.cat-item.central .area-item .pic-main .name .en{
	display: block;
	font-size: 7.5rem;
}
.cat-item.central .area-item .pic-main .name .ja{
	display: block;
	margin-top: 5px;
	font-size: 1.6rem;
}
.cat-item.central .area-item .pic-main .caption{
	position: absolute;
	right: 10px;
	bottom: 5px;
	line-height: 1.4;	
}
.cat-item.central .area01 .layout-box + .txt{
	margin-bottom: 50px;
}
.cat-item.central .area-item .access-list{
	font-size: 2rem;
	letter-spacing: .2em;
}
.cat-item.central .area-item .access-list li > span{
	display: inline-block;
}
.cat-item.central .area-item .access-list .time{
	font-size: 3rem;
	line-height: 1;
}
.cat-item.central .area-item .access-list .ico{
	width: 32px;
	margin-right: 15px;
}
.cat-item.central .area-item .access-list li:nth-child(2) .ico{
	transform: translateY(8px);
}
.cat-item.central .area-item .access-list .time strong{
	padding: 0 2px;
	font-weight: normal;
	font-size: 6rem;
	color: var(--gold);
	letter-spacing: 0;
}
.cat-item.central .layout-box + .layout-box{
	margin-bottom: 100px;
}
.cat-item.central .layout-box + .layout-box .txt{
	max-width: 580px;
	width: calc(50% - 10px);
	line-height: 2.2;
	letter-spacing: .2em;
}
.cat-item.central .layout-box + .layout-box .spot-list{
	max-width: 580px;
	width: calc(50% - 10px);
}
.cat-item.central .layout-box + .layout-box .spot-list li{
	max-width: 280px;
	width: calc(50% - 5px);
}
.cat-item.central .layout-box + .layout-box .spot-list li:nth-child(n+3){
	margin-top: 30px;
}
.cat-item.central .area01 .spot-list h4{
	margin-top: 7px;
}
.cat-item.central .area01 .column .txt-lead{
	font-size: 2.4rem;
}
.cat-item.central .area01 .column .spot-list{
	margin-bottom: 0;
	text-align: left;
}
.cat-item.central .area01 .column .spot-list li{
	max-width: 240px;
	width: calc((100% - 30px)/4);	
}
.cat-item.central .area01 .column .spot-list h4{
	color: var(--dark);
}
.cat-item.central .area01 .column .spot-list .thumb{
  position: relative;  
}
.cat-item.central .area01 .column .spot-list .thumb .caption{
  position: absolute;
  right: 10px;
  bottom: 8px;
  line-height: 1;  
}

/* life-info
-----------------------------------------------------------------*/
.life-info{
	padding-bottom: 100px;
}
.cat-nav ul{
	display: flex;
	justify-content: space-between;
}
.cat-nav ul li{
	display: flex;
	justify-content: center;
	align-items: center;
	width: calc((100% - 12px)/7);
	height: 80px;
	text-align: center;
	background: #C9CACA;
	font-size: 1.6rem;
	line-height: 1.5;
	cursor: pointer;
	transition: .3s;
}
.cat-nav ul li.current,
.cat-nav ul li:hover{
	background: var(--gold);
	color: var(--light);
}
.map-cont+.map-cont{
	display: none;
}

/* map ------------------------*/
.gmap_wrap{
	display: flex;
	height: 750px;
}
#gmap{
	width: 58%;
	height: 100%;
}
#markerArea{
	width: 42%;
	padding: 10px 20px;
	overflow: auto;
}
#markerList{
	max-width: 580px;
	margin: 0 auto;
}
.marker_list li{
	border-bottom: 1px dashed #b4b4b4;
	background: no-repeat left 10px top 6px;
	cursor: pointer;
	transition: .3s;
}
.marker_list li:hover{
	opacity: .7;
}
.marker_list li:last-child{
	display: none;
}
.marker_list .flex{
	display: flex;
	align-items: flex-start;
	line-height: 1.4;
	color: #03201f;
}
.marker_list .flex > div:nth-child(1){
	position: relative;
	width: 65%;
	padding: 12px 0 12px 30px;
}
.marker_list .flex > div:nth-child(1) span{
	position: absolute;
	left: 0;
	top: 10px;
	display: block;
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background: var(--gold);
	text-align: center;
	line-height: 25px;
	color: #fff;
	font-size: 1.6rem;
}
.marker_list .flex > div:nth-child(1) span strong{
	display: none;
}
.marker_list .flex > div:nth-child(1) small{
	display: block;
	font-size: 1.4rem;
}
.marker_list .flex > div:nth-child(2){
	width: 35%;
	padding: 12px 0;
	font-size: 1.4rem;
	text-align: right;
}





















/*--------------------------------------------------------------------------
   mobile
---------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {


/* intro
-----------------------------------------------------------------*/
	.intro{
		padding: 60px 0;
	}
	.intro h2{
		margin-bottom: 30px;
		font-size: 2.2rem;
	}
	.intro .txt-lead {
		margin-bottom: 40px;
		font-size: 1.8rem;
	}
	.intro-item{
		display: block;
	}
	.intro-item .pic{
		width: auto;
	}
	.intro-item .pic .caption{
		right: 5px;
	}
	.intro-item .txt-area{
		width: auto;
		padding: 0;
	}
	.intro-item .txt-area .txt{
		width: auto;
		margin-bottom: 20px;
		font-size: 1.3rem;
	}
	.intro-item + .intro-item {
		margin-top: 30px;
	}


/* category
-----------------------------------------------------------------*/
	.category{
		padding-bottom: 60px;
	}
	.cat-item + .cat-item{
		margin-top: 60px;
	}
	.cat-item .ttl-cat{
		height: 130px;
		margin-bottom: 40px;
	}
	.cat-item .ttl-cat .en{
		font-size: 3rem;
	}
	.cat-item .ttl-cat .ja{
		margin-top: 5px;
		font-size: 1.3rem;
	}
  .cat-item .ttl-cat .caption{
    right: 5px;
    bottom: 5px;  
  }
	.cat-item .txt-lead{
		margin-bottom: 20px;
		font-size: 1.8rem;
	}
	.cat-item .txt-lead + .txt{
		margin-bottom: 40px;
		font-size: 1.3rem;
		line-height: 2;
	}
	.cat-item .ttl-cat-topic{
		margin: 0 auto 20px;
		font-size: 1.8rem;
	}
	.cat-item .ttl-cat-topic .num{
		margin-bottom: 10px;
		font-size: 1.3rem;
	}
	.cat-item .ttl-cat-topic .num strong{
		margin-top: 3px;
		font-size: 2.4rem;
	}
	.cat-item .ttl-cat-topic .num::after{
		margin-top: 5px;
		font-size: 1.3rem;
	}
	.cat-item .spot-list .thumb .caption{
		right: 5px;
	}
	.cat-item .spot-list h4{
		font-size: 1.3rem;
	}
	.cat-item .spot-list .txt{
		font-size: 1.1rem;
		line-height: 1.6;
		text-align: justify;
	}
	.cat-item .spot-list .distance {
		font-size: 1rem;
	}

/* shop ---------------------------------*/
	.cat-item.shop .ttl-cat{
		background-image: url(../img/location/bg_ttl_shop_sp.jpg);
	}
	.cat-item.shop .map-area{
		width: calc(100% + 30px);
		overflow:auto;
		padding-bottom: 25px;
		margin-bottom: 50px;
	}
	.cat-item.shop .map-area .caption{
		right: 10px;
		bottom: 5px;
	}
	.cat-item.shop .map-area .swipe{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
		display: block;
		width: 75px;
	}
	.cat-item.shop .map-area .map{
		width: 700px;
		padding-right: 30px;
	}
	.cat-item.shop .cat-topic + .cat-topic{
		margin-top: 40px;
	}
	.cat-item.shop .restaurant .spot-list li{
		display: block;
		max-width: none;
		width: calc(50% - 5px);
	}
	.cat-item.shop .restaurant .spot-list li:nth-child(n+3),
	.cat-item.shop .station-area .spot-list li:nth-child(n+3){
		margin-top: 20px;
	}
	.cat-item.shop .restaurant .spot-list h4 {
    font-size: 1.4rem;
	}
	.cat-item.shop .restaurant .spot-list .thumb{
		width: auto;
	}
	.cat-item.shop .restaurant .spot-list .txt-area{
		width: auto;
		margin: 10px 0 0;
	}
	.cat-item.shop .restaurant .spot-list .txt{
		margin-top: 5px;
		font-size: 1.1rem;	
	}
	.cat-item.shop .station-area .spot-list li{
		max-width: none;
		width: calc(50% - 5px);
	}
	.cat-item.shop .station-area .spot-list h4{
		margin-top: 10px;
	}

/* park ---------------------------------*/
	.cat-item.park .ttl-cat{
		background-image: url(../img/location/bg_ttl_park_pc.jpg);
	}
	.cat-item.park .park01 .ttl-cat-topic {
    margin-bottom: 20px;
	}
	.cat-item.park .park01 .ttl-cat-topic + .txt {
		margin-bottom: 20px;
		font-size: 1.3rem;
		line-height: 2;
		text-align: justify;
	}
	.cat-item.park .park01 .spot-list{
		display: block;
		margin-bottom: 40px;
	}
	.cat-item.park .park01 .spot-list li{
		display: block;
	}
	.cat-item.park .park01 .spot-list .thumb{
		max-width: none;
		width: auto;
	}
	.cat-item.park .park01 .spot-list .thumb + .thumb{
		margin-top: 10px;
	}
	.cat-item.park .park01 .spot-list .caption{
		display: block;
		margin-top: 5px;
	}
	.cat-item.park .park01 .spot-list + .txt{
		margin-bottom: 40px;
		font-size: 1.3rem;
		line-height: 2;	
	}
	.cat-item.park .park02 .spot-list{
		display: block;
		margin-bottom: 40px;
	}
	.cat-item.park .park02 .spot-list li{
		max-width: 580px;
		width: auto;
	}
	.cat-item.park .park02 .spot-list li:nth-child(n+2){
		margin: 20px auto 0;
	}
	.cat-item.park .park02 .spot-list .thumb{
		max-width: none;
		width: calc(50% - 5px);	
	}
	.cat-item.park .park02 .spot-list .caption{
		margin-top: 5px;
		font-size: 1.1rem;
	}
	.cat-item.park .park02 .spot-list .caption span{
		font-size: 120%;
	}
	.cat-item.park .green-matrix .ttl-cat-topic {
    margin-bottom: 20px;
	}
	.cat-item.park .green-matrix .map-area{
		width: calc(100% + 30px);
		overflow:auto;
		padding-bottom: 25px;
		margin-bottom: 15px;
	}
	.cat-item.park .green-matrix .map-area .map{
		width: 560px;
		padding-right: 30px;
	}
	.cat-item.park .green-matrix .map-area .caption{
		right: 10px;
		bottom: 5px;
	}
	.cat-item.park .green-matrix .map-area .swipe{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
		display: block;
		width: 75px;
	}
	.cat-item.park .green-matrix .layout-box{
		display: block;
		margin-bottom: 30px;
	}
	.cat-item.park .green-matrix .spot-list{
		width: auto;
	}
	.cat-item.park .green-matrix .spot-list li{
		max-width: none;
		width: calc(50% - 5px);
	}
	.cat-item.park .green-matrix .spot-list h4{
		margin-top: 5px;
	}
	.cat-item.park .green-matrix .txt{
		margin-top: 20px;
		width: auto;
		text-align: justify;
	}
	.cat-item.park .column .txt{
		margin-bottom: 20px;
		font-size: 1.3rem;
	}
	.cat-item.park .column .pic-list{
		display: block;
		max-width: none;
	}
	.cat-item.park .column .pic-list li{
		max-width: none;
		width: auto;
	}
	.cat-item.park .column .pic-list li:nth-child(n+2){
		margin-top: 10px;
	}

/* central ---------------------------------*/
	.cat-item.central .ttl-cat{
		background-image: url(../img/location/bg_ttl_central_pc.jpg);
	}
	.cat-item.central .map-area{
		overflow: auto;
		width: calc(100% + 60px);
		padding-bottom: 25px;
		margin: 0 0 30px -30px;
	}
	.cat-item.central .map-area .map{
		width: 750px;
	}
	.cat-item.central .map-area .caption{
		right: 10px;
		bottom: 10px;
	}
	.cat-item.central .map-area .swipe{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
		display: block;
		width: 75px;
	}
	.cat-item.central .layout-box{
		display: block;
		margin-bottom: 25px;
	}
	.cat-item.central .area-item{
		max-width: none;
		width: auto;
	}
	.cat-item.central .area-item + .area-item{
		margin-top: 20px;
	}
	.cat-item.central .area-item .pic-main{
		margin-bottom: 5px;
	}
	.cat-item.central .area-item .pic-main .name .en{
		font-size: 4.5rem;
	}
	.cat-item.central .area-item .pic-main .name .ja{
		margin-top: 3px;
		font-size: 1.3rem;
	}
	.cat-item.central .area-item .pic-main .caption{
		right: 5px;
		bottom: 5px;
	}
	.cat-item.central .area-item .access-list{
		font-size: 1.3rem;
	}
	.cat-item.central .area-item .access-list .time{
		font-size: 1.8rem;
	}
	.cat-item.central .area-item .access-list .ico{
		width: 25px;
		margin-right: 7px;
	}
	.cat-item.central .area-item .access-list li:nth-child(1) .ico img{
		width: 17px;
	}
	.cat-item.central .area-item .access-list li:nth-child(2) .ico{
		transform: translateY(4px);
	}
	.cat-item.central .area-item .access-list .time strong{
		font-size: 3.5rem;
	}
	.cat-item.central .layout-box + .layout-box {
		display: block;
    margin-bottom: 50px;
	}
	.cat-item.central .layout-box + .layout-box .txt {
		margin-bottom: 20px;
    max-width: none;
    width: auto;
    line-height: 2;
		text-align: justify;
	}
	.cat-item.central .layout-box + .layout-box .spot-list{
		max-width: none;
		width: auto;
	}
	.cat-item.central .area01 .spot-list li{
		max-width: none;
		width: calc(50% - 5px);	
	}
	.cat-item.central .area01 .spot-list li:nth-child(n+3){
		margin-top: 20px;
	}
	.cat-item.central .area01 .spot-list h4{
		margin-top: 5px;
	}
	.cat-item.central .area01 .column .txt-lead{
		font-size: 1.3rem;
	}
	.cat-item.central .area01 .column .spot-list li{
		max-width: none;
		width: calc(50% - 5px);	
	}
	.cat-item.central .area01 .column .spot-list li:nth-child(n+3){
		margin-top: 20px;
	}
	.cat-item.central .area01 .column .spot-list h4{
		text-align: left;
		color: var(--dark);
	}


/* life-info
-----------------------------------------------------------------*/
	.life-info{
		padding-bottom: 30px;
	}
	.cat-nav ul{
		overflow: auto;
	}
	.cat-nav ul li{
		flex-shrink: 0;
		min-width: 60px;
		width: auto;
		height: 50px;
		padding: 0 7px;
		font-size: 1.1rem;
		line-height: 1.4;
	}
	.cat-nav ul li:nth-child(n+2){
		margin-left: 1px;
	}

/* map ------------------------*/
	.gmap_wrap{
		display: block;
		height: auto;
	}
	#gmap{
		width: 100%;
		height: 350px;
	}
	#markerArea{
		width: 100%;
		height: 400px;
		padding: 10px;
		overflow: auto;
	}
	#markerList{
		max-width: none;
	}
	.marker_list li{
		border-bottom: 1px dashed #b4b4b4;
		background: no-repeat left 10px top 6px;
		cursor: pointer;
		transition: .3s;
	}
	.marker_list li:hover{
		opacity: 1;
	}
	.marker_list li:last-child{
		display: none;
	}
	.marker_list .flex > div:nth-child(1){
		width: 65%;
		padding: 10px 0 10px 28px;
		font-size: 1.2rem;
	}
	.marker_list .flex > div:nth-child(1) span{
		top: 5px;
		width: 22px;
		height: 22px;
		line-height: 20px;
		font-size: 1.1rem;
	}
	.marker_list .flex > div:nth-child(1) small{
		display: block;
		font-size: 1rem;
	}
	.marker_list .flex > div:nth-child(2){
		width: 35%;
		padding: 10px 0;
		font-size: 1rem;
	}


}