.img100 { width: 100%; height: auto; vertical-align: bottom; }

.center, .title, .w550, .w830, .note { left: 0; right: 0; margin-left: auto; margin-right: auto; }

.title { position: relative; width: 100%; max-width: 500px; }

.title.newplan::after { content: "NEW"; font-family: 'Times New Roman', Times, serif; font-size: 12px; color: #FFF; background-color: #c1272d; position: absolute; top: 1px; right: 1px; line-height: 1em; letter-spacing: 0.1em; padding: 4px 10px; }

@media (max-width: 580px) { .title.newplan::after { font-size: 10px; padding: 3px 5px; } }

.w550 { width: 100%; max-width: 550px; left: 0; }

.w830 { width: 100%; max-width: 830px; }

.note { max-width: 1100px; text-align: left; padding-top: 15px; padding-bottom: 15px; margin-top: 30px; margin-bottom: 0; }

@media screen and (min-width: 641px), print { .image { position: relative; }
  .main { background-color: #FFFFFF; }
  .main .design_top { background-color: #FFFFFF; }
  .main .design_top .head36 { margin-bottom: 0; padding-bottom: 40px; }
  .detail { padding-top: 50px; padding-bottom: 70px; }
  .madori { text-align: center; padding-top: 50px; padding-bottom: 50px; }
  .madori_img { width: auto; height: auto; }
  .detail p { text-align: center; }
  .banner_box { margin-top: 32px; margin-right: auto; margin-bottom: 0px; margin-left: auto; text-align: center; width: 1000px; display: block; overflow: hidden; position: relative; }
  .banner_box .reservation { float: left; display: block; width: 50%; padding-top: 50px; padding-bottom: 50px; }
  .banner_box .request { float: right; display: block; width: 50%; padding-top: 50px; padding-bottom: 50px; }
  .banner_box img { width: 100%; max-width: 480px; box-shadow: 3px 3px 16px 4px rgba(0, 0, 0, 0.3); }
  .detail ul.bt { overflow: hidden; position: relative; display: table; text-align: center; margin-top: 50px; margin-right: auto; margin-bottom: 0px; margin-left: auto; width: 800px; }
  .detail ul.bt li { text-align: center; display: table-cell; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; }
  .detail ul.bt li a { background: #e8e8e8; background-image: linear-gradient(to bottom, #e8e8e8, #dbdbdb); color: #000000; border: solid #d1d1d1 1px; text-decoration: none; font-size: 20px; line-height: 1.5em; text-align: center; display: block; padding-top: 10px; padding-bottom: 10px; width: 200px; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; } }

@media screen and (min-width: 0px) and (max-width: 640px) { .image { position: relative; }
  .main { background-color: #FFFFFF; }
  .main .design_top { background-color: #FFFFFF; }
  .main .design_top .head36 { margin-bottom: 0; padding-bottom: 0px; }
  .note { text-align: left; padding-top: 15px; padding-bottom: 15px; margin-top: 0; margin-bottom: 0; }
  .detail { padding-top: 0px; padding-bottom: 30px; }
  .detail img { height: auto; width: 100%; }
  .detail .title { text-align: center; }
  .detail .madori { text-align: center; padding-top: 50px; padding-bottom: 50px; }
  .detail p { text-align: center; }
  .banner_box { margin-top: 30px; margin-right: auto; margin-bottom: 0px; margin-left: auto; text-align: center; display: block; overflow: hidden; position: relative; }
  .banner_box .reservation { display: block; padding-top: 20px; padding-bottom: 20px; }
  .banner_box .request { display: block; padding-top: 0px; padding-bottom: 20px; }
  .banner_box img { width: 95%; max-width: 480px; box-shadow: 2px 2px 8px 2px rgba(0, 0, 0, 0.3); }
  .detail ul.bt { overflow: hidden; position: relative; text-align: center; margin-top: 10px; margin-right: auto; margin-bottom: 0px; margin-left: auto; }
  .detail ul.bt li { text-align: center; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; float: left; width: 50%; }
  .detail ul.bt li a { background: #e8e8e8; background-image: -webkit-linear-gradient(top, #e8e8e8, #dbdbdb); background-image: -moz-linear-gradient(top, #e8e8e8, #dbdbdb); background-image: -ms-linear-gradient(top, #e8e8e8, #dbdbdb); background-image: -o-linear-gradient(top, #e8e8e8, #dbdbdb); background-image: linear-gradient(to bottom, #e8e8e8, #dbdbdb); color: #000000; border: solid #d1d1d1 1px; text-decoration: none; font-size: 16px; line-height: 1.5em; text-align: center; display: block; padding-top: 10px; padding-bottom: 10px; width: 90%; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; } }

@media print { .banner_box, .bt, .footer_nav, .freedialmark, .dialmark { display: none !important; }
  .developer { width: 377px; }
  .xs_off { display: none; } }