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

Neighborhood
///////////////////////*/

/*---------------------------------------------
Page Title
*/

.neighborhood{
    background: url(../images/title_neighborhood.jpg);
    background-size: cover;
    /*background: #9bacb6*/
}

/*---------------------------------------------
#おみや
*/
.sec_cont_wrap{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.sec_cont_detail{
    width: 40%;
    padding: 5%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    
}

.sec_cont_detail h2{
    font-size: 3rem;
    line-height: 1.2em;
    font-weight: normal;
    margin-bottom: 4rem;
    
}
.sec_cont_detail h2 span{
    font-size: 1rem;
    letter-spacing: .1em;
    display: block;
    margin-bottom: 1rem  
}
.sec_cont_detail .detailTxt{
    font-size: 1.2rem;
    line-height: 2rem;
    margin-bottom: 2rem;
}
.sec_cont_detail .detailTxtIcon{
    font-size: 1.2rem;
    line-height: 2.4rem;
    margin-bottom: 2rem;
}
.sec_cont_img{
    width: 60%;
    padding:2% 0; 
    box-sizing: border-box;
}

@media screen and (max-width:767px){
.sec_cont_wrap{
    width: 100%;
    flex-direction: column;
}
.sec_cont_detail{
    width: 100%;
    height: auto;
    order: 2;
}
.sec_cont_img{
    width: 100%;
    padding:5%; 
    box-sizing: border-box;
    order: 1;
}  
}

/*---------------------------------------------
#dinner restaurant
*/
#dinner{
}


.din_cont_wrap{
    width: 90%;
    margin: 0 auto 40px;
    display: flex;

}
.din_cont_wrap .din_cont{
    width: 33.3333%;
    margin-right: 20px;
    padding-bottom: 20px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    position: relative;
    background: #efefef;  
    flex-grow: 1
}
.din_cont_wrap .din_cont_02{

    width: calc(100%/2);
    margin-right: 10px;
    padding-bottom: 20px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    position: relative;
    background: #efefef;  
    flex-grow: 2
}
.din_cont_wrap .din_cont, .din_cont_wrap .din_cont02 a{
    text-decoration: none;
    color: #2b365d;
}

.din_cont_wrap .din_cont:nth-child( 3n ) {
    margin-right: 0;
}

.din_cont_wrap .din_cont .din_cont_img,.din_cont_wrap .din_cont_02 .din_cont_img{
    width:100%;
    box-sizing: border-box;
}
.din_cont_wrap .din_cont .din_cont_img #list, .din_cont_wrap .din_cont_02 .din_cont_img #list{
    width: 100%;
    height: 280px;
}
.din_cont_wrap .din_cont .din_cont_img #list02{
    width: 100%;
    height: 480px;
}
.din_cont_wrap .din_cont .din_cont_img img, .din_cont_wrap .din_cont_02 .din_cont_img ing{
    width: 100%;
    height: auto;
}
.din_cont_wrap .din_cont .din_cont_txt,.din_cont_wrap .din_cont_02 .din_cont_txt{
    background: #fff;
    width: 90%;
    padding: 5%;
    margin: 0 auto;

}

.din_cont_wrap .din_cont .din_cont_txt .din_name, .din_cont_wrap .din_cont_02 .din_cont_txt .din_name{
    display: block;
    font-size: 2rem;
    margin: 1.5rem auto;
}
.din_cont_wrap .din_cont .din_cont_txt .din_name_jap, .din_cont_wrap .din_cont_02 .din_cont_txt .din_name_jap{
    display: block;
    font-size: 1rem;
    margin: 0 0 1.5rem;
}
.din_cont_wrap .din_cont .din_cont_txt .detail, .din_cont_wrap .din_cont_02 .din_cont_txt .detail{
    display: block;
    font-size: 1.2rem;
    line-height: 1.8em;
}
.din_cont_wrap .din_cont .din_cont_txt .tags, .din_cont_wrap .din_cont_02 .din_cont_txt .tags{
    background: #2b365d;
    display: inline-block;
    padding: .2em .5em;
    font-size: 1rem;
    color: #fff;
    margin: .3em; 
    border-radius: 3px;
}
.din_cont_wrap .din_cont .din_cont_txt .next, .din_cont_wrap .din_cont_02 .din_cont_txt .next{
    font-size: 1.2rem;
    text-decoration: underline;
    margin: 1rem auto;
    text-align: right;
}


@media screen and (max-width: 767px) {
.din_cont_wrap{
    width: 90%;
    margin: 0 auto 40px;
    display: flex;
    flex-direction: column;

}
.din_cont_wrap .din_cont, .din_cont_wrap .din_cont_02{
    width: 100%;
    margin-right: 0;
    padding-bottom: 20px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    position: relative;
    background: #efefef;  
}
.din_cont_wrap .din_cont .din_cont_img #list02{
    width: 100%;
    height: 280px;
}
    
}