@charset "UTF-8";
/* 鮨海宇 scss */
html, body {
  height: 100%; }

html {
  box-sizing: border-box; }

body {
  background: #000;
  font-family: YuMincho, "Yu Mincho", Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, sans-serif;
  font-weight: 500;
  height: 100%; }

h2 {
  font-size: 2.3rem; }

.bg-dark {
  background: url("../img/back_header.png") top center no-repeat;
  background-size: cover;
  background-color: rgba(0, 0, 0, 0.5) !important; }

nav {
  min-height: 300px; }
  nav i {
    color: #C30D23;
    font-size: 20%;
    margin-right: 5px; }
  nav img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto; }

@media (min-width: 992px) {
  nav i {
    margin-bottom: 5px;
    font-size: 20%; }
  nav .navbar-nav {
    display: flex;
    margin-right: 0;
    justify-content: flex-end;
    width: 100%;
    padding-right: 5%;
    flex-direction: row-reverse; }
    nav .navbar-nav li {
      -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      line-height: 3;
      font-size: 1.2rem; }
      nav .navbar-nav li:first-child {
        order: 4; }
      nav .navbar-nav li:nth-of-type(2) {
        order: 3; }
      nav .navbar-nav li:nth-of-type(3) {
        order: 2; }
      nav .navbar-nav li:nth-of-type(4) {
        order: 1; } }
.slidecontact {
  position: relative;
  text-align: center; }
  .slidecontact .slidetel {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 3%;
    color: #fff;
    background: rgba(0, 0, 0, 0.8);
    width: 400px;
    display: block;
    z-index: 1000;
    padding: 20px 0; }
    .slidecontact .slidetel span {
      font-size: 1.5rem;
      padding-left: 15px; }

.intro {
  background: url("../img/back_intro.png") top center;
  background-size: cover; }
  .intro .col {
    margin: 30px auto; }
  .intro p {
    font-size: 1.2rem;
    line-height: 1.7;
    margin-bottom: 30px;
    margin-left: 50px; }
  .intro .ornername {
    font-size: 1rem;
    text-align: right; }

@media (min-width: 992px) {
  .intro {
    display: flex; }
    .intro div {
      text-align: center;
      display: flex;
      flex-direction: row-reverse;
      min-height: 450px; }
    .intro p {
      text-align: left;
      -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      display: inline-block; }
      .intro p:first-child {
        margin-right: 50px; }

  .tabsushi {
    display: none; } }
.sushiimg {
  background: #000;
  text-align: center;
  z-index: 10; }
  .sushiimg img {
    width: 100%; }
  .sushiimg .zposi01 {
    z-index: 10; }

.sushimenuwrap {
  background: url("../img/back_menu.png") top center;
  z-index: 100;
  width: 100%;
  margin-top: -20px;
  margin-bottom: 20px;
  background-size: cover; }

.sushimenu {
  margin: 170px auto 160px auto; }
  .sushimenu .item2 {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-align: start;
    min-height: 500px; }
    .sushimenu .item2 h3 {
      font-size: 1.6rem; }
    .sushimenu .item2 p {
      line-height: 2; }

@media (min-width: 992px) {
  .sushimenu .item2 h2 {
    margin-right: 20%; } }
.info {
  background: url("../img/back_info.png") top center no-repeat;
  background-size: cover;
  color: #fff; }
  .info .row {
    padding: 30px auto; }
  .info h2, .info h3 {
    text-align: center; }
  .info h3 {
    font-size: 1.1rem; }
  .info h4 {
    font-size: 1rem; }
  .info p {
    font-size: 0.9rem; }
  .info img {
    padding-bottom: 20px; }

@media (min-width: 992px) {
  .col-md-1 {
    text-align: center; }

  h2 {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl; } }
.reserve {
  padding-top: 70px;
  padding-bottom: 70px;
  text-align: center;
  background: url("../img/back_intro.png") top center;
  background-size: cover;
  margin: auto -15px; }
  .reserve p span a {
    color: #C30D23;
    border: 1px solid #C30D23;
    padding: 10px 30px;
    display: block; }
    .reserve p span a:hover {
      text-decoration: none;
      background: #C30D23;
      color: #fff; }
  .reserve table {
    text-align: left; }
    .reserve table span {
      color: #C30D23;
      font-size: 1.3rem; }

footer {
  background: #000;
  text-align: center; }
  footer p {
    color: #fff; }
    footer p span {
      font-size: 110%; }

#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 80%;
  z-index: 2000;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl; }

#page-top a {
  display: block;
  background: rgba(255, 255, 255, 0.6);
  color: #C30D23;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  border-radius: 5px;
  border: 1px solid #000; }

#page-top a:hover {
  background: #999;
  text-decoration: none; }

/* =======================================
    ClearFixElements
======================================= */
@media (max-width: 768px) {
  nav {
    min-height: 95px; }
    nav img {
      width: 45px;
      top: 15px;
      margin: 0 auto; }
    nav .navbar-nav {
      writing-mode: horizontal-tb; }
    nav .nav-link {
      text-indent: 5px; }

  .navbar-collapse {
    margin-top: 50px; }

  .navbar {
    padding: .5rem 0 0 0; }

  .nav-link {
    border-bottom: 1px solid #fff;
    padding: 1rem; }

  .navbar-toggler {
    margin-right: 10px; }

  .nav-pc {
    display: none; }

  h2 {
    font-size: 1.8rem;
    writing-mode: horizontal-tb; }

  .bg-dark {
    background-size: 100%; }

  .intro div {
    writing-mode: horizontal-tb; }
  .intro p {
    writing-mode: horizontal-tb;
    margin-left: 20px; }

  .sushimenuwrap {
    background: url("../img/back_menu_tab.png") repeat-x top center;
    background-size: 120%; }

  .pcsushi {
    display: none; }

  .sushimenu {
    margin: 70px auto; }
    .sushimenu .item2 {
      writing-mode: horizontal-tb;
      text-align: center;
      padding-bottom: 80px; }
      .sushimenu .item2 h3 {
        margin-top: 30px; }
      .sushimenu .item2 img {
        width: 250px; }

  .infotab {
    text-align: center; }

  .slidecontact .slidetel {
    bottom: 0;
    color: #fff;
    width: 100%;
    font-size: 1rem;
    padding: 10px 0; }
    .slidecontact .slidetel span {
      font-size: 1.1rem;
      padding-left: 15px; }

  footer p {
    font-size: 90%; } }
@media (min-width: 769px) and (max-width: 991px) {
  nav {
    min-height: 95px; }
    nav img {
      width: 45px;
      top: 15px;
      margin: 0 auto; }
    nav .navbar-nav {
      writing-mode: horizontal-tb; }
    nav .nav-link {
      text-indent: 5px; }

  .navbar-collapse {
    margin-top: 50px; }

  .navbar {
    padding: .5rem 0 0 0; }

  .nav-link {
    border-bottom: 1px solid #fff;
    padding: 1rem; }

  .navbar-toggler {
    margin-right: 10px; }

  .nav-pc {
    display: none; }

  h2 {
    font-size: 1.8rem;
    writing-mode: horizontal-tb; }

  .intro div {
    writing-mode: horizontal-tb;
    -ms-writing-mode: lr-tb; }
  .intro p {
    writing-mode: horizontal-tb;
    margin-left: 20px; }

  .pcsushi {
    display: none; }

  .sushimenuwrap {
    background: url("../img/back_menu_tab.png") repeat-x top center;
    background-size: 60%; }

  .sushimenu {
    margin: 50px auto; }
    .sushimenu .item2 {
      writing-mode: horizontal-tb;
      text-align: center;
      padding-bottom: 100px; }
      .sushimenu .item2 h3 {
        margin-top: 30px; }
      .sushimenu .item2 img {
        width: 400px; }

  .infotab {
    text-align: center; }

  .slidecontact .slidetel {
    bottom: 0;
    color: #fff;
    width: 100%;
    font-size: 1rem;
    padding: 10px 0; }
    .slidecontact .slidetel span {
      font-size: 1.5rem;
      padding-left: 15px; } }
@media (min-width: 992px) and (max-width: 1199px) {
  h2 {
    font-size: 2rem; } }
/* for IE 11 */
@media all and (-ms-high-contrast: none) {
  *::-ms-backdrop, .intro .col-lg-5 {
    margin-right: 40%; } }
@media all and (-ms-high-contrast: none) and (min-width: 769px) and (max-width: 991px) {
  *::-ms-backdrop, .sushimenu .item2 {
    writing-mode: lr-tb; } }
@media all and (-ms-high-contrast: none) and (min-width: 991px) {
  *::-ms-backdrop, .infotab {
    max-height: 500px; }

  *::-ms-backdrop, .reserve h2 {
    max-height: 400px; } }
/* for IE 10 */
@media all and (-ms-high-contrast: none) {
  .intro .col-lg-5 {
    margin-right: 40%; } }
/* for Microsoft Edge */
@supports (-ms-ime-align: auto) and (min-width: 991px) {
  .infotab {
    max-height: 500px; }

  .reserve h2 {
    max-height: 400px; } }