@charset "utf-8";

h1{
    color: #543f32;
    font-size: 24px;
    font-weight: normal;
    padding: 30px 0 10px;
}

header,
nav,
#topimage,
main,
footer{
    width: 1000px;
    margin: 0 auto;
}

#topimage img{
    width: 100%;
}

#topimage video{
    width: 1000px;
}

#topimage{
    height: 500px;
    overflow: hidden;
}

.c05 img{
    position: relative;
    bottom: 654px;
}

/* 上記とは別のやり方　
#wrap{
    width: 1000px;
}
*/

/* 全体に対する設定　*/

*{
    margin: 0;
    padding: 0;
    font-family: fantasy;
}

nav ul{
    list-style-type: none;
}

.flexbox{
    display: flex;
}

nav li{
    width: 200px;
}

nav li a{
    display: block;
    background-color: #543f32;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    padding: 15px;
}

main{
    background-color: #f8e58c;
    padding: 40px 0;
}

h2{
    margin-left: 20px;
    margin-bottom: 20px;
}

#toppage h2{
    background-color: #ffffff;
    width: 120px;
    text-align: center;
    padding: 10px 0;
    border-radius: 10px;
}

#toppage p{
    margin: 0 20px;
    padding-top: 20px;
    border-bottom: 3px dotted #ffffff;
}

img{
    vertical-align: bottom;
}

footer{
    background-color: #543f32;
}

footer p{
    padding: 40px 0;
    text-align: center;
    font-size: 80%;
    color: #ffffff;
}

nav li a:hover{
    background-color: #f8e58c;
    color: #543f32;
}

/* menuページ */

section{
    background-color: #543f32;
    margin: 0 20px 40px;
    padding: 20px;
}

h3{
    color: #ffffff;
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: left center;
}

.drink{
    background-image: url(img/listmark_drink.png);
}

.food{
    background-image: url(img/listmark.png);
}

.menu{
    background-color: #ffffff;
    width: 880px;
    padding: 20px;
    margin-top: 20px;
}

.menu h4{
    border-top: 3px solid #543f32;
    border-bottom: 1px solid #543f32;
    margin-bottom: 10px;
    padding: 5px;
}

.menu ul{
    width: 800px;
    padding: 0 40px;
    list-style-type: none;
    display: flex;
    justify-content: space-between;
}

.menu ul li{
    width: 240px;
}

.menu ul li img{
    width: 100%;
    margin-bottom: 5px;
}

.menu dl{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.menu dl dt{
    font-weight: bold;
}

.description{
    font-size: 14px;
    width: 240px;
}

/* accessページ */

th,
td{
    border: 1px solid #543f32;
    background-color: #ffffff;
    padding: 10px;
}

th{
    background-color: #f8e58c;
}

table{
    border-collapse: collapse;
    width: 440px;
}

#map{
    margin: 0 20px;
}

#accessdata{
    margin-left: 20px;
}

iframe{
    width: 500px;
    height: 500px;
}

#accessdata p{
    padding-top: 10px;
}

/* contactページ */

#contact{
    background-color: #543f32;
    margin: 0 20px;
    padding: 20px;
}

#contact div{
    background-color: #ffffff;
    padding: 20px 131px;
}

label{
    background-color: #f8e58c;
    display: block;
    width: 220px;
    height: 24px;
    margin-right: 10px;
    padding: 7px;
}

input,
textarea{
    width: 400px;
    font-size: 100%;
    padding: 5px;
}

textarea{
    height: 150px;
}

#contact #submit{
    background-color: #f8e58c;
    text-align: center;
    border-top: 1px solid #543f32;
}

#submit input{
    width: 250px;
}

/* infoページ */

#info p{
    padding-left: 20px;
    text-decoration: underline;
}

#info .infotext p{
    padding-left: 110px;
    text-decoration: none;
    padding-bottom: 20px;
}