@charset "UTF-8";

/*----------------------------------------
location
----------------------------------------*/

.location_box{
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
padding: 80px 0 0 0;
}

.location_title{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
font-family: "greycliff-cf", sans-serif !important;
font-weight: 600 !important;
font-style: normal !important;
font-size: 3.5rem !important;
line-height: 1 !important;
letter-spacing: 2px !important;
margin: 0 0 40px 0;
}

.location_title img{
width: auto;
height: 40px;
margin: 0 10px 0 0;
}

.CL_shopping{
color: #e5815d;
}

.CL_education{
color: #a87452;
}

.CL_park{
color: #66aa54;
}

.CL_medical{
color: #2ca6e0;
}

.CL_others{
color: #c79f62;
}

.location_shoping{
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
border: 2px solid #e5815d;
background-color: rgba(229, 129, 93, 0.1);
padding: 20px;
}

.location_education{
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
border: 2px solid #a87452;
background-color: rgba(168, 116, 82, 0.1);
padding: 20px;
}

.location_park{
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
border: 2px solid #66aa54;
background-color: rgba(102, 170, 84, 0.1);
padding: 20px;
}


.location_icon{
width: 100%;
position: absolute;
left: 0;
right: 0;
}

/*-- sp--*/

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

.location_box{
padding: 60px 0 0 0;
}

.location_title{
font-size: 2.5rem !important;
letter-spacing: 1px !important;
margin: 0 0 20px 0;
}

.location_title img{
height: 30px;
}



.location_shoping,
.location_education,
.location_park{
padding: 10px;
}


}