@charset "UTF-8";

/*サービス*/
body.meal{}




#mainhead.meal{
    background : url("/images/meal/head.jpg") no-repeat;
    background-size: auto 33vw;
}

body.meal .profile{
    background : #fff;
}
.imgcBoxMain{
    background : url("/images/meal/denner-bg.png") no-repeat;
    background-size : 100%;
}

body.meal .imgclBox{
    display : flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top : 1em;
}
body.meal .imgclBox li{
    flex-basis : 15%;
    margin-right : 1%;
}
body.meal .profile .img-wid{
    padding : 1em 15px 5px 15px;
    float : left;
    width : 20%;
}

@media (min-width: 768px) {
    #mainhead.meal{
        /*background : url("/images/meal/head.jpg") no-repeat;
        background-size: cover;
        background-position : center bottom;*/
    }
    body.meal .profile{

    }
    body.meal .profile .childBox:first-child{
        width : 80%;
    }
    body.meal .profile .childBox:nth-child(2){
        width : 20%;
    }
    body.meal .profile .img-wid{
        text-align : right;
        padding : 1vw;
        float : none;
        width : auto;
        margin-right : 0;
    }
    body.meal .profile .img-wid img{
        width : 100%;
        margin-right : 0;
    }
}



body.meal .twoBox .childBox_chef {
    width: 25%;
}

body.meal .twoBox .childBox_chef_text {
    width: 75%;
}

body.meal .twoBox .childBox_chef_text .readText_chef{
    margin-top : 30px;
}

body.meal table.dinner{
    width : 100%;
    margin-top : 15px;
    border-spacing : 0 20px;
    border-collapse : separate ;
}
body.meal table.dinner th{
    width: 15%;
    text-align: center;
    virtical-align : center;
    border : solid #888989;
    border-width : 0 1px 0 0;
}
body.meal table.dinner td{
    width: 85%;
    text-align: left;
    padding : 5px 20px;
}
body.meal table.dinner th.morning{
    width: 20%;
    text-align: center;
    virtical-align : center;
    border : solid #888989;
    border-width : 0 1px 0 0;
}
body.meal table.dinner td.morning{
    width: 80%;
    text-align: left;
    padding : 5px 20px;
}
body.meal table.dinner td dt{
    width : 200px;
    float : left;
    text-align : left;
}
body.meal table.dinner td dd{
    text-align : left;
}

body.meal table.alacarte{
    width : 100%;
    margin-top : 15px;
    border-spacing : 0 20px;
    border-collapse : collapse ;
}
body.meal table.alacarte tr:nth-child(even) {
	background: #fff;
}
body.meal table.alacarte th{
	background: #000;
	border : 1px solid #888989;
	color: #fff;
	font-weight: normal;
	text-align: center;
	padding: 15px 0;
}
body.meal table.alacarte th.w30{
	width: 30%;
}
body.meal table.alacarte th.w20{
	width: 20%;
}
body.meal table.alacarte td{
	border : 1px solid #888989;
	text-align: center;
	padding: 15px 10px;
}

@media only screen and (max-width:767px){
    body.meal .twoBox .childBox_chef{
        width : 60%;
        margin-left : 20%;
    }

    body.meal .twoBox .childBox_chef_text{
        width : 100%;
    }
    body.meal .twoBox .childBox_chef_text .readText_chef{
        margin-top : 2em;
    }
    body.meal table.dinner{
        width : 100%;
    }
    body.meal table.dinner th,
    body.meal table.dinner th.morning{
        width : 100%;
        border : solid #888989;
        border-width : 0 0 1px 0;
        display: block;
        padding-bottom : 10px;
    }
    body.meal table.dinner td,
    body.meal table.dinner td.morning{
        width : 100%;
        padding: 10px 0;
        display: block;
        text-align: center;
    }
    body.meal table.dinner td dt{
        width : 45%;
        float : left;
        text-align : center;
    }
    body.meal table.dinner td dd{
        text-align : left;
    }
	body.meal table.alacarte td{
		text-align: left;
	}
}

@media (min-width: 768px) {
	.image50{
		width: 50%;
		margin-left: 25%;
	}
}