@charset "UTF-8";



/*----------------------------------------------------------------------------------------------------------------------menu----------*/


.box_cont{ 
display: flex;
justify-content: space-between;
}

.profile{
align-items: flex-start;
margin: 85px 0 0 0;
}

.roaster{ 
align-items:center;
flex-direction: row-reverse;
margin: 125px 0 0 0;
}

.beans{ 
align-items:flex-end;
margin: 125px 0 0 0;
}

.box_cont .ph{ width:40%; }

.box_cont .ph p{
font-size: 18px;
font-weight: bold;
margin-top: 20px;
}

.box_cont .ph p span{ 
font-size: 14px;
font-weight: normal;
}

.box_cont .ph p span:first-child{ padding-right: 8px; }
.box_cont .ph p span:last-child{ padding-left: 8px; }

.box_cont .txt{ width:50%; }

.gr_txt span{ line-height:3; }

.gr_txt h3{
margin-top: 6px;
font-size: 24px;
line-height: 1.8;
}

.gr_txt p{ margin-top:12px; }

.gr_txt p a{ text-decoration: underline; }
.gr_txt p a:hover{ text-decoration: none; }

.gr_second{ margin-top:60px; }

#large_img{
width:83.3%;
margin-top: 170px;
}

#shop{
width:91.7%;
margin: 170px 0 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
}

.info{ width:36.3%; }

.info h2{font-size: 40px;}

.info h2 span{
font-size: 15px;
padding-left: 15px;
}

.info p{margin-top: 10px;}

.info div{margin-top: 80px;}

.access{width:54.5%;}

.vehicle{ margin-top: 40px; }

.vehicle h3{ font-weight: bold; }

.vehicle p{ 
width:83.3%;
padding-left: 4%;
}

.access p.tel{ 
margin-top: 40px;
font-size: 14px;
}

.gmap{
filter: grayscale(100%);
padding-bottom: 20px;
}


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


}

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

.box_cont{ display:block; }

.profile{ margin: 40px 0 0 0; }

.roaster{ margin:80px 0 0 0; }

.beans{ margin: 80px 0 0 0; }

.box_cont .ph{ 
width:100%;
margin: 0 auto;
padding-bottom: 20px;
}

.box_cont .ph p{
font-size: 16px;
margin-top:15px;
}

.box_cont .ph p span{ font-size: 13px; }

.box_cont .ph p span:first-child{ padding-right: 4px; }
.box_cont .ph p span:last-child{ padding-left: 4px; }

.box_cont .txt{ width:100%; }

.gr_txt span{ line-height:3; }

.gr_txt h3{
margin-top: 6px;
font-size: 20px;
line-height: 1.7;
}

.gr_second{ margin-top:30px; }

#large_img{
width:95%;
margin-top: 80px;
}

#shop{
width:90%;
margin: 80px auto 0 auto;
display: block;
}

.info{ width:100%; }

.info h2{font-size: 28px;}

.info h2 span{
font-size: 13px;
padding-left: 10px;
}

.info div{ 
margin:30px auto 0;
width:100%;

}

.access{
width:100%;
margin-top:40px;
}

.gmap{
padding-bottom:0px;
width:100%;
margin-left: auto;
}

.vehicle{ margin-top:20px; }

.vehicle h3{ font-weight: bold; }

.vehicle p{ 
width:100%;
padding-left: 5%;
}

.access p.tel{ 
margin-top:30px;
font-size: 12px;
}




}