@charset "utf-8";
/* ---------- 全般 ---------- */
html {
    background-color: #dedbd1;
}
html, body {
    font-family: 'fot-tsukuardgothic-std', sans-serif;
    overflow-x: hidden;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0.12rem;
    color: #3E1900;
    line-height: 1.5;
}
img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
h1,h2,h3,h4,h5,h6 {
    font-weight: 700;
}
a, a:hover, a:active, a:visited {
    color: #3E1900;
    text-decoration: none;
}
p {
	margin-bottom:0;
}
ul {
	margin : 0;
  	padding : 0;
}
li {
    list-style: none;
}
strong {
    color: #3E1900;
}
.section {
    padding: 3rem 1.5rem; /* デフォルトのパディング */
}
@media screen and (min-width: 768px) {
    .section {
        padding: 4.5rem 3rem; /* デスクトップ用のパディング */
    }
}

/* フォント設定 */
.is-yota {
    font-family: "vdl-yotag", sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: 1.2;
}
.has-text-red {
    color: #91181D;
}
.jc-center-mobile {
	text-align:center;
}
@media screen and (min-width:768px) {
  .jc-center-mobile {
	text-align:left;
}
}
.b-b {
	border: 1px solid #3E1900;
}
.b-b2 {
	border: 2px solid #3E1900;
}
.bt-b {
	border-top: 1px solid #3E1900;
}
.bb-b {
	border-bottom: 1px solid #3E1900;
}
.bb-b-dot {
	border-bottom: 1px dotted #3E1900;
}
.fs-08rem {
	font-size:0.8rem;
}
.caution {
background: #F3DDAF;
}

.caution2 {
    position: relative;
    display: inline;
  z-index: 5;
}
.caution2::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50%; 
    background: #F3DDAF;
    z-index: -1;
}
/* 背景 */
.bg-full {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.bg-red {
    background-color: #91181D;
	color: #FFF;
}
.bg-brown {
    background-color: #3E1900;
	color: #FFF;
}
.bg-beige {
    background: #EFE7DB;
}



/* 角丸 */
.is-r50 {
    border-radius: 50px;
}
.is-r50-top {
    border-radius: 50px 50px 0px 0px;
}
.is-r50-bottom {
    border-radius: 0px 0px 50px 50px;
}
.is-r50-left {
    border-radius: 50px 0px 0px 50px;
}
.is-r50-right {
    border-radius: 0px 50px 50px 0px;
}
@media screen and (min-width:768px) {
    .is-r50-tablet {
        border-radius: 50px;
    }
    .is-r50-top-tablet {
        border-radius: 50px 50px 0px 0px;
    }
    .is-r50-bottom-tablet {
        border-radius: 0px 0px 50px 50px;
    }
    .is-r50-left-tablet {
        border-radius: 50px 0px 0px 50px;
    }
    .is-r50-right-tablet {
        border-radius: 0px 50px 50px 0px;
    }
}
@media screen and (min-width:992px) {
    .is-r50-desktop {
        border-radius: 50px;
    }
    .is-r50-top-desktop {
        border-radius: 50px 50px 0px 0px;
    }
    .is-r50-bottom-desktop {
        border-radius: 0px 0px 50px 50px;
    }
    .is-r50-left-desktop {
        border-radius: 50px 0px 0px 50px;
    }
    .is-r50-right-desktop {
        border-radius: 0px 50px 50px 0px;
    }
}
/* ボタン関連 */
.btn {
	border-radius: 16px;
}
.btn p {
  line-height:1;
  padding:0;
  margin:0;
}
.btn.is-rounded {
	border-radius:50px;
}
.btn.is-red {
    background-color: #91181D;
    border: 2px solid #91181D;
    color: #FFF;
}
.btn.is-red a, .btn.is-red p{
    color: #FFF;
}
.btn.is-red:hover {
  	background-color: #FFF;
  	color: #91181D;
}
.btn.is-red:hover a, .btn.is-red:hover p{
    color: #91181D;
}
.btn.is-yellow {
    background-color: #F3DDAF;
    border: none;
}
.btn.is-yellow a{
    color: #3E1900;
}
.btn.is-yellow:hover {
    background-color: #E3CD9F;
}
.btn.is-yellow:hover  a{
    color: #3E1900;
}
.btn.is-clear {
    background: none;
    border: 2px solid #3E1900;
}
.btn.is-clear{
    color: #3E1900;
}
.btn.is-clear:hover {
    background-color: #3E1900;
}
.btn.is-clear:hover p{
    color: #FFFFFF;
}
.c5049 {
    text-align: right;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.button-container {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.button-text {
     	z-index:10;
}
.button-text p {
    font-size: 1.2rem;
    margin: 0; 
}
.circle {
    width: 80px;
    height: 80px;
    background-color: rgba(218, 165, 32, 0.5);
    border-radius: 50%;
    margin-left: -50px;
}
.button-container.is-small .button-text p {
    font-size: 1rem;
}
.button-container.is-small .circle {
    width: 80px;
    height: 80px;
    margin-left: -40px;
}


/* ---------- ナビ設定 ---------- */

/* Sidenav */
.top-h1 {
	padding-bottom:1rem;
  	margin-bottom:1rem;
  	border-bottom:2px solid #3E1900;
}
.sidenav {
    position: fixed;
    top: 0;
    left: 0;
    text-align: center;
    opacity: 0;
    display: none;
    z-index: 1000;
  	width: 100%;
}
.sidenav-top {
    align-self: flex-start;
    padding-top: 150px;
} 
.sidenav-links {
	position: absolute;
  	top:50%;
  	left:50%;
    transform: translate(-50%, -50%);
  width:100%;
}

.nav-logo {
  width:200px;
  display: none;
}
.sidenav li {
	margin-bottom: 24px;
}
.sidenav li a {
    border-radius: 5px;
  	padding: 8px;
}
.sidenav li a:hover {
    background-color: #91181D;
    color: #FFF;
}
.sidenav-innner {
    width: 100%;
    height: 100vh;
    padding: 1rem;
}
.sidenav-bottom {
    width: 100%;
  	position: absolute;
  	padding:0 16px;
	left:0;
	bottom:16px;
}
.sidenav-bottom .btn {
    width: 100%;
  	padding: 24px 0;
}
.sidenav.is-active {
  display: block;
}

/* sp用 Navbar */
.nav-bar-sp {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 20px 10px;
    z-index: 1100;
}
@media screen and (min-width:768px) {
    .sidenav {
        width: 212px;
        opacity: 1;
        display: block;
    }
    .sidenav-top {
        align-self: flex-start;
        padding-top: 0;
    }
    .nav-logo {
        width: 212px;
        display: block;
    }
    .sidenav-innner, .sidenav-bottom {
        width: 212px;
    }
    .nav-bar-sp {
        display: none;
    }
}

.nav-bar-sp {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 20px 10px;
    z-index: 1100;
}
@media screen and (min-width:768px) {
  .nav-bar-sp {
  	display:none;
  }
}
.navbar-burger {
  z-index:1100;
    align-items: center;
    appearance: none;
    background: none;
    border: none;
    border-radius:2px;
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    flex-shrink: 0;
    height: 32px;
    justify-content: center;
    position: relative;
    vertical-align: top;
    width:32px;
    align-self: center;
    color: #333;
    margin:0 0 0 12px;
	padding:0;
}
.navbar-burger div {
    background-color: #333;
    display: block;
    width: 26px;
    height: 2px;
    position: absolute;
    left: 0;
    transform-origin: center;
    transition-duration: 0.3s;
    transition-property: background-color,color,opacity,transform;
  	padding:0;
  	margin:0;
  	border-radius:2px;
}
.navbar-burger div:first-child, .navbar-burger div:nth-child(2) {
    top: 15px;
}
.navbar-burger div:nth-child(3) {
    bottom: 8px;
}
.navbar-burger div:nth-child(4) {
    top: 8px;
}
.navbar-burger.is-active div:first-child {
    transform: rotate(-45deg);
}
.navbar-burger.is-active div:nth-child(2) {
    transform: rotate(45deg);
}
.navbar-burger.is-active div:nth-child(3), .navbar-burger.is-active div:nth-child(4) {
    opacity: 0;
}

.top-logo-box {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    margin: 0 auto;
    padding: 20px;
    border-radius: 100px;
}
.top-logo {
    width: 100px;
}

.main-cont , .footer-section {
    width: 100%;
}
@media screen and (min-width:768px) {
    .main-cont, .footer-section {
        margin-left: 212px;
        width: calc(100%  - 212px) ;
    }
}
/* フッター */
.footer-logo-box {
  text-align:center;
}
@media screen and (min-width:992px) {
  .footer-logo-box {
    text-align:left;
  }
}

/*------ TOPページ ------*/
/* Topセクション */
.top-section {
    width: 100%;
    height: 100vh;
}
.top-img-box {
  	width: 100%;
	height: calc(100vh - 243px);
	margin-top: 80px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
@media screen and (min-width:768px) {
	.top-img-box {
		height: 100vh;
		margin-top: 0;
	}
}
.top-info h2 {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.top-info h2::after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    height: 50%; 
    bottom: 0;
    background: #F3DDAF;
    z-index: -1;
}
.top-info {
	position: absolute;
    bottom:0;
    border-radius: 0;
    margin: 0;
    padding: 0 1rem;
    border: 1px solid #CCC;
    background: #F7F3ED;
	z-index:100;
}
.top-info-cont {
  border-bottom: 2px dotted #CCC;
}
@media screen and (min-width:992px) {
    .top-info {
        bottom: 2rem;
        border-radius: 2rem;
        margin: 2rem;
        padding: 1rem;
      	max-width: 1015px;
    }
    .top-info-cont {
        border-bottom: none;
    }
}
@media screen and (min-width:1200px) {
    .top-info {
		width:950px;
		left:50%;
      	transform: translateX(-50%);
      margin: 2rem 0;
    }
}
/* Top - おしらせ */
.news-item-box {
  	margin: 48px 0;
}
.news-item {
	border-bottom: 1px solid #CCC;
}
.news-item:first-of-type {
    border-top: 1px solid #CCC;
}
.news-item p, .news-item h2, .news-item h3 {
	font-size:16px;
  	padding: 12px 0;
  	margin:0;
}
.news-item p {
  text-align: center;
}

/* Top - おすすめ */
.osusume-section {
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.osusume-title {
    padding-bottom: 1rem;
  font-size: 1.5rem;
}
.osusume-img-column {
	padding:3rem;
}
@media screen and (min-width:768px) {
    .osusume-title {
        padding-bottom: 1.5rem;
      font-size:1.7rem;
    }
  .osusume-img-column {
	padding:3rem 0;
}
}
/* Top - メニュー */
.top-menu-title {
  font-size:1.5rem;
}
@media screen and (min-width:768px) {
  .top-menu-title {
    font-size:2rem;
  }
}

/* 下層ページ */
.sub-page {
	padding: 12rem 0 3rem 0;
  	background-image: url(https://mishima-tanakatei.com/system_panel/uploads/images/kodawari-background.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
@media screen and (min-width:768px) {
  .sub-page {
      padding: 8rem 0 3rem 0;
  }
}

/* News - ページ */
.webgene-pagination {
	margin: 3rem 0;
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.webgene-pagination  ul{
	display: flex;
}
.webgene-pagination  ul li{
	padding: 0 1rem;
}

/* News 詳細 - ページ */

.news-cont img {
	border-radius: 50px;
	margin-bottom:2rem;
}
.news-cont p {
	padding-bottom: 1rem;
}

/* Menuページ */
.sub-page.menu-page {
  	background-image: url(https://mishima-tanakatei.com/system_panel/uploads/images/menu-background.jpg);
}
.menu-title {
    position: relative;
  	color:#91181D;
   	margin-bottom: 4rem;
  font-size: 1.75rem;
}
.menu-title::after {
    content: '|||||||||||||||||||||'; /* 装飾に使用する文字列 */
    display: block;
    font-size: 1rem; /* 装飾の文字サイズ */
    color: #A52A2A;
    text-align: center;
    margin-top: 10px; /* 文字との距離を調整 */
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.menu-title-container {
	padding-bottom: 160px;
  	background-image: url(https://mishima-tanakatei.com/system_panel/uploads/images/illustration.png);
    background-position: bottom 0% right 10%;
    background-repeat: no-repeat;
    background-size:100px;
}
.menu-cont-box {
  	background-image: url(https://mishima-tanakatei.com/system_panel/uploads/images/kodawari-background.jpg);
      background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.menu-name {
    position: relative;
    font-size: 1.75rem; /* フォントサイズを調整 */
    list-style: none; /* デフォルトのリストスタイルを削除 */
    padding-left: 35px; /* 丸の位置を調整 */
  	margin-bottom: 1rem;
}

.menu-name::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1.75rem; /* 丸のサイズ */
    height: 1.75rem; /* 丸のサイズ */
    background-color: #e3c890; /* 丸の色（画像のベージュに近い色） */
    border-radius: 50%; /* 丸くする */
}
.menu-name.menu-name-sm {
    font-size: 1.25rem; /* フォントサイズを調整 */
    padding-left: 35px; /* 丸の位置を調整 */
}

.menu-name.menu-name-sm::before {
    width: 1rem; /* 丸のサイズ */
    height: 1rem; /* 丸のサイズ */
}
.gram-text {
 	display:inline-block;
	font-size:12px;
    background-color: #3E1900;
    color: #FFFFFF;
    padding: 6px 0 8px 0;
    width: 72px;
    height: 28px;
 	border-radius:14px;
  	margin-top:6px;
  text-align:center;
}
.gram-text p {
	display:inline;
  	padding:0;
  	margin:0;
}

.menu-cat {
    display: flex;
    justify-content: center; /* 中央にテキストを配置 */
    align-items: center; /* 垂直方向も中央揃え */
    position: relative;
}

.menu-cat::before,
.menu-cat::after {
    content: '●'; /* 丸を表示 */
    font-size: 1.25rem; /* 丸のサイズ */
    margin: 0 10px; /* テキストとの間隔を調整 */
}

.menu-cat::before {
    margin-right: 10px; /* テキストの左側にスペース */
}

.menu-cat::after {
    margin-left: 10px; /* テキストの右側にスペース */
}
.humburg-gram {
	 font-size: 12px;
}
.menu-price {
	font-size:14px;
}
@media screen and (min-width:768px) {
  .menu-price {
      font-size:18px;
  }
}
@media screen and (min-width:1025px) {
  .menu-price {
      font-size:18px;
  }
}
.meat-text {
 	display:inline-block;
	font-size:10px;
    padding: 0 0 4px 0;
    width: 60px;
    height: 16px;
  border: 1px solid #3E1900;
 	border-radius:8px;
  	margin-top:6px;
  text-align:center;
}
.meat-text p {
	display:inline;
  	padding:0;
  	margin:0;
}

.drink-cat {
font-size:1rem;
  padding:2px 8px;
  border: 1px solid #3E1900;
  border-radius: 2rem;
  display:inline-block;
}

.epark-second-column {
	border-top: 2px dotted #3E1900;
  	border-bottom: 2px dotted #3E1900;
}
@media screen and (min-width:992px) {
.epark-second-column {
  	border-top: none;
  	border-bottom: none;
	border-left: 2px dotted #3E1900;
  	border-right: 2px dotted #3E1900;
}
}
.nameformError, .mailformError, .kanaformError, .msgformError, .telformError
{
position: relative !important;
  top:0 !important;
  left:0 !important;
  margin-top:0 !important;
  margin-bottom:8px !important;
  color:#91181D;
}
.policy-check {
position: relative;
}
.form-validation-field-0formError {
  position: absolute !important;
  bottom:0 !important;
  left:0 !important;
  margin-top:30px !important;
  margin-bottom:8px !important;
  color:#91181D;
}

.btn.btn_red{
    background-color: #91181D;
    border: 2px solid #91181D;
    color: #fff;
}
.btn.btn_red:hover{
    background-color: #fff;
}
.btn.btn_red:hover p{
    color: #91181D;
}
.row_new{
    gap: 2rem;
}
@media screen and (max-width:991px) {
.row_new{
    display: block;
}
}
.row_new .col-md-3{
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 40%;
    flex: 0 0 40%;
    max-width: 40%;
}
.row_new .col-md-9{
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
}