body{
  background-color: black;
  font-family: "ＭＳ Ｐ明朝", serif;
}

.header {
  height: 300px;
}

.wrap-video{
  position:relative;
}

.wrap-video video{
  width: 100%;
  height:100%
}

.wrap-video .text{
  position: absolute;
  top: 30%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); /*上下左右中央寄せ*/
  text-align:center;
}

.icon{
  position: absolute;
  left: 45%;
}

.wrap-video .text p {
  font-size:16px;
  font-weight:bold;
  color:white;
}

.main-contents h1{
  text-align: center;
}

.wrap-video .text{
  font-size:20px;
}

.icon img{
  width: 30%;
  height: 30%;
}

h1{
  font-size: 50px;
  font-weight: 700;
  color: #f5f5f5;
  text-shadow: 1px 1px 1px #4d4d4d,
     1px 2px 1px #4d4d4d,
     1px 3px 1px #4d4d4d,
     1px 4px 1px #4d4d4d,
     1px 5px 1px #787777,
     1px 6px 1px #787777,
     1px 7px 1px #787777,
     1px 8px 1px #919191,
     1px 9px 1px #919191,
     1px 10px 1px #919191,
   1px 18px 6px rgba(16,16,16,0.4),
   1pc 22px 10px rgba(16,16,16,0.2),
   1px 25px 35px rgba(16,16,16,0.2),
   1px 30px 60px rgba(16,16,16,0.4);
}

.footer{
  height: 700px;
  background: black;
  color: #fff;
  clear: both;
  padding-top: 10px;
}

.footer-title{
  background-color: gray;
  width: 80%;
}

.tel p{
  font-size: 30px;
  color: red;
  display: inline-block;
  border: 4px inset #828282;
  padding-left: 50px;
}

.tel{
  margin: 0;
  margin-right: 0;
  width: 50%;
}

.google_map{
    position:relative;
    width:100%;
    height:600px;
    padding-top:75%;
}
.google_map iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
.main-contents{
  height: 250px;
}
.main-contents {
  background-color: black;
  color: #fff;
  float: left;
  width: 80%;
}

.menu-wrap{
  height: 120px;
  border: 4px inset #828282;
}

.menu-wrap p{
  font-size: 45px;
}

.menu {
  background-color: black;
  color: #fff;
  float: left;
  width: 80%;
}

.menu{
  float: left;
}


.main{
  width: 80%;
  float: right;
}


.menu-coment {
  width: 100%;
  display: block;
}



@media screen and (max-width: 600px){
  .main, .main-contents, .menu{
  width: 100%;
  }
  h1{
   width: 300px;
   font-size: 20px;
   margin-top: 30px;
   margin-bottom: 0;
   text-shadow:
       2px  2px 1px black,
      -2px  2px 1px black,
       2px -2px 1px black,
      -2px -2px 1px black,
       2px  0px 1px black,
       0px  2px 1px black,
      -2px  0px 1px black,
       0px -2px 1px black;
  }
  .headline{
    margin-top: 0;
  }
  .main-contents{
    height: 150px;
  }
  .takeout {
    text-align: center;
    margin-left: 30px;
  }

  .menu-wrap p{
    font-size: 20px;
  }

  .menu-wrap {
    height: 50px;
  }

.menu-coment{
  display: none;
}

  .text{
    margin-top: 20px;
  }

  .tel p{
    width: 100%;
    display: block;
  }

  .tel {
    width: 80%;
  }

  .footer{
    padding-top: 10px;
  }

  .iframe {
    width: 100%;
  }

  .coment{
    font-size: 12px;
  }
}
