@charset "UTF-8";
/*////////////////////////

windyfarm.jp/cliff-end-icecream/
teaser

///////////////////////*/


/*================================
top_main
================================*/
.top_main{
   background-image: url(/images/icecream/main_01.jpg);
}




/*================================
menu
================================*/
section.menu {
   padding: 0;
   margin-bottom: 100px;
}
.size_price{
   width: 100%;
   background: #6A3906;
   color: #FFF;
   text-align: center;
   padding: 80px 4% 70px;
   font-size: 1.2rem;
   margin-bottom: 50px;
}
.size_price img{
   width: 100%;
   max-width: 700px;
   height: auto;
   margin-bottom: 40px;
   /*border-radius: 10%;*/
}
.menu h2{
   text-align: center;
   font-size: 3.5rem;
   line-height: 1.1em;
}
.menu h2 span{
   font-size: 1.4rem;
   padding-left: 0;
   display: block;
}
.boxFlex{
   margin: 0 auto 0;
   /*width: 95%; */ 
   display: flex;
   flex-flow: wrap;
   justify-content:flex-start;
   /*align-items: center;*/
}
.boxCont{
   width: 33.3%;
   padding: 2% 2.5% 6%;
   /*text-align: center;*/
}
.boxContImg{
   width: 50%;
   text-align: center;
   position: relative;
}
.boxContImg .photo{
   border-radius: 10%;
}

.local{
   position: absolute;
   margin: 30px -10px;
   display: flex;
   justify-content: center;
    align-items: center;
   text-align: center;
   background: #E94530;
   border-radius: 50%;
   width: 50px;
   height: 50px;
}
.local span{
   padding-top: .3em;
   font-size: 1.4rem;
   font-weight: bold;
   line-height: 1.0em;
   color: #fff;
}
.local small{
   font-size: .6em;
   display: block;
}

.boxCont .photo{
   width: 100%;
   height: auto;
   margin-bottom: 15px;
   border-radius: 12%;
}
.boxCont h3{
   font-size: 1.5rem;
   text-align: center;
   line-height: 1.5em;
   margin-bottom: 1em;
}
.boxCont h3 span{
   font-size: 1.2rem;
   display: block;
}
.boxCont p{
   font-size: 1.2rem;
   text-align: center;
}
.boxCont .size{
   padding: 0 0 .8em;
}
.boxCont .price{
   font-size: 1.2rem;
   padding: 0 0 1.5em;
   font-weight: bold;
}
.boxCont .price strong{
   font-size: 1.6rem;
}
.boxCont .comment{
   text-align: left;
   font-size: 1.2rem;
    line-height: 1.8em;
}
.boxCont span{
   /*font-size: 1.4em;*/
}

@media screen and (max-width: 767px) {
   
   .boxCont{
   padding: 20px 20px 40px;
   }
   .boxCont, .boxContImg{
      width: 100%;
   }
   .boxCont h3{
   font-size: 1.8rem;
   }
   .boxCont .comment{
   font-size: 1.3rem;
   }

}