@charset "utf-8";
/* CSS Document */
@import url(common.css);
/*選択中メニュー,パンくず領域↓*/

.drawer-content .selecting{
    color:#C61C1E;
}
.nav_pc .selecting{
    color:#C61C1E;
}
.breadcrumb ul {
	list-style-type: none;
	padding: 5px;

}
.breadcrumb ul li {
	display: inline;
	margin-right: 5px;
    color:#804e21;
}
.breadcrumb ul li a {
    color:#c61c1e;
	padding-right: 15px;
	background-image: url(../img/breadcrumb.png);
	background-repeat: no-repeat;
	background-position: right center;
}
@media screen and (min-width:769px) {
    .breadcrumb ul {
        padding-left:10px;
     margin-top:-15px;
}
}
/*選択中メニュー,パンくず領域↑*/
/*About領域↓*/
.content img{
    width:80%;
    height:auto;
    border-radius:5px;
}
.content{
    text-align:center;
    max-width:1024px;
}
.content p{
    margin-bottom:30px;
}
h2{
        font-size:24px;
        padding-top:30px;
        padding-bottom:15px;
    }
h3{
 margin-top:-10px;
}
@media screen and (min-width:769px) {
    .content p{
        font-size:18px;
        line-height:2em;
    }
}
/*About領域↑*/
/*Menu領域↓*/
p,h2,h3{
    color:#804e21;
}
.coffee img,.food img{
    width:40%;
    height:auto;
    margin-top:40px;
}

.menu1,.menu2{
    margin-right:7.5px;
    margin-left:7.5px;
}
.coffee h3,.food h3{
    margin-top:10px;
}
.coffee p,.food p{
    margin:20px 0 20px 0;
}
hr{
    width:60%;
    border:1px dotted #804e21;
}

@media screen and (min-width:769px) {
    .coffee p,.food p{
    font-size:15px;
    }
   .coffee img,.food img{
    width:170px;
    height:auto;
    }
    .coffee{
        float:left;
    }
    .food{
        float:right;
    }
    .button{
        clear:both;
    }
    .coffee,.food{
        width:50%;
    }
}
/*Menu領域↑*/
/*Coffee領域↓*/
.select,.roast,.brew,.customize,.you{
    border-radius:5px;
    background:#335D2E;
    margin:20px 20px;
}
.select img,.roast img,.brew img,.customize img,.you img{
    width:100%;
    height:auto;
}
.select h3,.roast h3,.brew h3,.customize h3,.you h3{
    margin:5px 0;
    color:#fcfad3;
}
.select p,.roast p,.brew p,.customize p,.you p{
    margin:0 5px;
    color:#fcfad3;
          padding-bottom:10px;
}
.select img,.roast img,.brew img,.customize img,.you img{
    border-radius:5px 5px 0 0;}
@media screen and (min-width:769px) {
    .select,.roast,.brew,.customize,.you{
        width:45%;
    }
    .select p,.roast p,.brew p,.customize p,.you p{
    font-size:16px;
  
}
    .select p,.roast p,.brew p,.customize p,.you p{
        margin:0 10px;}
    .content_pc img,.you img{
    margin-bottom:-20px;
    }
    .select h3,.roast h3,.brew h3,.customize h3,.you h3{
        display:inline-block;
    margin:0;
}
    .select,.brew{
        float:left;
        
    }  
    .roast,.customize{
        float:right;
    }
    .content_pc,.you{
        clear:both;
    }
    .select,.roast,.brew,.customize{
        margin:0 10px 50px 10px;
    }
    .you{
        margin:0 auto;
    }
}
/*Coffee領域↑*/
/*Service領域↓*/
.howto{
    margin-top:40px;
}
.howto img{
    width:60%;
}
.tasting{
    background:#335D2E;
}
.cupping_pc{
    display:none;
}
.tasting h3,.tasting p{
    color:#fcfad3;
    margin:20px 0;
}
.tasting h3{
    padding:20px 0;
    font-size:18px;
}
.otherpage {
    font-size:20px;
    color:#fcfad3;
  display: inline-block;
  margin-top: 10px;
    margin-bottom:30px;
  padding: 0px 50px;
  border-bottom: 3px solid #fcfad3;
  border-top: 3px solid #fcfad3;
} 

@media screen and (min-width:769px) {
   
    .howto img{
    width:70%;
}
    .howto p{
        font-size:16px;
    }
    .howto1,.howto2,.howto3{
        float:left;
        width:30%;
    }
    .howto{
        margin-top:60px;
        display:flex;
        justify-content: space-between;
        overflow:hidden;
    }
    .tasting{
    border-radius:10px;
}
    .cupping_pc{
    display:inline-block;
}
    .cupping{
    display:none;
}
    .tasting h3{
    padding:8px 0;
        margin:5px 0;
}
    .tasting_pc img,.tasttext{
         float:left; 
    }
    .tasting_pc{
        overflow:hidden; 
        display:flex;
        justify-content: space-between;
      
    }
    .tasting_pc img{
        width:350px;
        height:auto;
        margin:0 20px 30px 30px;
    }
    .tasttext{
        display:inline-block;
        width:60%;
        height:300px;
        margin:-20px 30px;
    }  
    
    .otherpage{
   font-size:24px;
          margin:-5px 0 10px 0 ;
    padding: 0 50px;
  }
    .otherpage:hover{
    transform: scale(0.9);
    transition: 0.2s;
      color:#C61C1E;
         border-bottom: 3px solid #C61C1E;
    border-top: 3px solid #C61C1E;
  }
  
}
/*Service領域↑*/