/*============================================
メインビジュアル（トップ）
===========================================*/
#top_main_wrapper {
position: relative;
}

.top_main_box {
height: 100%;
position: relative;
}

/*メインビジュアル*/
.top_main_img {
}

.top_main_img img {
width: 100%;
}

@media screen and (min-width:768px) and ( max-width:1024px){
.top_main_img {
width: 100%;
}
}
@media screen and (max-width: 767px) {
.top_main_img {
width: 100%;
position: relative;
}
}

/*ロゴ*/
.top_main_logo {
position: absolute;
top: -0.9rem;
left: 0.6rem;
z-index: 200;
}

@media screen and (min-width:768px) and ( max-width:1024px){
.top_main_logo {
left: 0.3rem;
width: 1.6rem;
}
}

@media screen and (max-width: 767px) {
.top_main_logo {
width: 1.6rem;
left: 50%;
top:50%;
transform: translate(-50%,-50%);
}
.top_main_logo.active {
opacity: 0;
}
}

/*ロゴ*/
.top_sp_logo {
position: absolute;
top: -0.44rem;
left: 0.15rem;
width: 1.1rem;
}

.top_sp_logo.active {
opacity: 1;
}

/*============================================
当店について
===========================================*/
#top_about {
margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
#top_about {
padding-top: 0.8rem;
margin-top: -0.8rem;
}
}

/*テキスト*/
.top_about_box_text h2 {
font-size: 0.36rem;
line-height: 1.5;
font-family: 'Noto Serif JP', serif;
padding-top: 0.3rem;
position: relative;
}

.top_about_box_text h2::before {
content: "";
width: 2px;
height: 40px;
position: absolute;
left: 20px;
top:-20px;
background:#FFF;
}

.top_about_box_text h2 span {
font-size: 0.12rem;
letter-spacing: 0.1em;
display: block;
color: #C69C6D;
font-family: 'Roboto', AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
}

.top_about_box_text {
max-width: 6rem;
width: 100%;
background: #000;
box-sizing: border-box;
padding-bottom: 0.4rem;
padding-left: 0.4rem;
padding-right: 0.4rem;
color: #fff;
position: relative;
margin-top: -0.4rem;
z-index: 10;
}
@media screen and (max-width: 767px) {
.top_about_box_text {
max-width: auto;
width: 100%;
padding-left: 0.2rem;
padding-right: 0.2rem;
letter-spacing: 0.02em;
}
}

.top_about_box_text h2 {
margin-bottom: 0.3rem;
}
.top_about_box_text h2 img {
margin-top: -0.4rem;
}

@media screen and (max-width: 767px) {
.top_about_box_text h2 img {
height: 1.2rem;
}
}

.top_about_box_text h3 {
font-size: 0.18rem;
margin-bottom: 0.3rem;
line-height: 1.7;
}

.top_about_box_text p {
font-size: 0.14rem;
line-height: 1.8
}


.top_about_box_img {
margin-top: -1.5rem;
background: url("../img/about_back.png") no-repeat;
background-position: right;
background-size: 90%;
}

.top_about_box_img img {
display: block;
}

@media screen and (max-width: 767px) {
.top_about_box_img {
margin-top: 0.15rem;
position: relative;
z-index: 20;
background-size: 100% 70%;
}
}

.top_about_box_img ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
@media screen and (max-width: 767px) {
.top_about_box_img ul {
flex-flow: wrap-reverse;
box-sizing: border-box;
}
}

.top_about_box_img li {
width: 21%;
margin-top: auto;
box-sizing: border-box;
padding-right: 0.05rem;
}
@media screen and (max-width: 767px) {
.top_about_box_img li {
width: 49.6%;
padding: 0;
}
}

.top_about_box_img li:last-child {
width: 58%;
padding-right: 0;
}
@media screen and (max-width: 767px) {
.top_about_box_img li:last-child {
width: 100%;
padding-right: 0;
padding-bottom: 0.04rem;
}
}


/*============================================
おすすめメニュー
===========================================*/
#top_menu {
margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
#top_menu {
padding-top: 0.8rem;
margin-top: -0.8rem;
}
}

/*メニュー*/
.top_menu_wrapper{
width: calc(100% - 0.6rem);
background: #000;
margin: 0 auto;
padding-bottom: 1.7rem;
}
@media screen and (max-width: 767px) {
.top_menu_wrapper{
width: 100%;
padding-bottom: 0.7rem;
}
}


#top_menu h2 {
text-align: center;
font-size: 0.36rem;
line-height: 1.5;
font-family: 'Noto Serif JP', serif;
padding-top: 0.3rem;
position: relative;
color: #FFF;
margin-bottom: 0.2rem;
}

#top_menu h2::before {
content: "";
width: 2px;
height: 40px;
position: absolute;
left: 49%;
top:-20px;
background:#C1272D;
}

#top_menu h2 span {
font-size: 0.16rem;
letter-spacing: 0.1em;
display: block;
color: #C69C6D;
font-family: 'Roboto', AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
}

#top_menu h3 {
font-family: 'Noto Serif JP', serif;
color: #FFF;
font-size: 0.2rem;
letter-spacing: 0.1em;
text-align: center;
margin-bottom: 0.4rem;
}

@media screen and (max-width: 767px) {
#top_menu h2 {
margin-bottom: 0.4rem;
}
}

#top_menu h2 img {
margin-top: -0.15rem;
}

@media screen and (max-width: 767px) {
#top_menu h2 img {
height: 1rem;
}
}

.top_menu_box {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 90%;
margin: 0 auto;
}

@media screen and (max-width: 767px) {
.top_menu_box {
width: 94%;
}
}

.top_menu_box_left {
width: 42%;
}
@media screen and (max-width: 767px) {
.top_menu_box_left {
width: 100%;
}
}

.top_menu_box_right {
width: 42%;
}
@media screen and (max-width: 767px) {
.top_menu_box_right {
width: 100%;
}
}

.top_menu_box ul.menu_list {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.top_menu_box li {
width: 48%;
font-size: 0.16rem;
color: #fff;
margin-bottom: 0.2rem;
letter-spacing: 0.06em;
font-family: 'Noto Serif JP', serif;
box-sizing: border-box;
line-height: 1.4;
margin-left: 0.16rem;
text-indent: -0.2rem;
}

.top_menu_box li::before {
content: "●";
padding-right: 0.04rem;
color: #666;
}

@media screen and (max-width: 767px) {
.top_menu_box li {
width: 100%;
font-size: 0.16rem;
margin-bottom: 0.2rem;
}
}

.menu_caption {
font-size: 0.12rem;
color: #FFF;
line-height: 1.8;
font-family: 'Noto Serif JP', serif;
padding-top: 0.2rem;
}

@media screen and (max-width: 767px) {
.menu_caption {
font-size: 0.12rem;
color: #FFF;
line-height: 1.8;
font-family: 'Noto Serif JP', serif;
}
}

.tab-reader-box2 {
flex: auto;
}

.tab-reader-box3 {
font-family: 'Roboto', sans-serif;
}

.tab-reader-box3 em {
font-size: 0.14rem;
padding-left: 0.02rem;
}

/*画像*/
.top_menu_img_wrapper {
margin-top: -1.2rem;
}
@media screen and (max-width: 767px) {
.top_menu_img_wrapper {
margin-top: -0.4rem;
}
}

.top_menu_img ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.top_menu_img li {
width: 32.5%;
}


/*============================================
お知らせ
===========================================*/
.top_news_wrapper {
width: calc(100% - 0.6rem);
background: #f2f2f2;
margin: 0 auto;
padding-bottom: 0.8rem;
margin-bottom: 0.8rem;
}
@media screen and (max-width: 767px) {
.top_news_wrapper {
width: 100%;
}
}

/*タイトル*/
.top_news_wrapper h2 {
margin-bottom: 0.3rem;
}

.top_news_wrapper h2 {
font-size: 0.36rem;
line-height: 1.5;
font-family: 'Noto Serif JP', serif;
padding-top: 0.3rem;
position: relative;
text-align: center;
}

.top_news_wrapper h2::before {
content: "";
width: 2px;
height: 40px;
position: absolute;
left: 49%;
top: -20px;
background: #C1272D;
}

.top_news_wrapper h2 span {
font-size: 0.12rem;
letter-spacing: 0.1em;
display: block;
color: #C69C6D;
font-family: 'Roboto', AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
}


/*コンテンツ*/
.top_news_cont {
padding-left: 0.4rem;
padding-right: 0.4rem;
margin-bottom: 0.3rem;
}
@media screen and (max-width: 767px) {
.top_news_cont {
padding-left: 0;
padding-right: 0;
}
}

.top_news_cont a {
padding: .1rem;
padding-top: .18rem;
padding-bottom: .18rem;
display: block;
color: #222;
text-decoration: none;
position: relative;
	border-bottom: 1px dotted #CCC;
	font-family: 'Roboto', AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
}

.top_news_cont a:hover {
opacity: 0.7;
}

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

.top_news_cont a dt {
width: 13%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
position: relative;
top: .03rem;
font-size: 0.14rem;
}
@media screen and (max-width: 767px) {
.top_news_cont a dt {
width: 100%;
margin-bottom: 0.1rem;
}
}

.top_news_cont a dd {
width: 85%;
font-size: .16rem;
letter-spacing: .04em;
/*border-bottom: 1px dotted #CCC;*/
/*padding-bottom: 10px;*/
}
@media screen and (max-width: 767px) {
.top_news_cont a dd {
width: 100%;
margin-bottom: 0.1rem;
}
}

.top_news_cont a dd h4 {
	  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/*ボタン*/
.top_news_btn a {
background: #000;
color: #fff;
font-size: 0.18rem;
font-weight: bold;
text-align: center;
text-decoration: none;
width: 300px;
display: block;
box-sizing: border-box;
margin: 0 auto;
padding-top: 18px;
padding-bottom: 18px;
position: relative;
}
@media screen and (max-width: 767px) {
.top_news_btn a {
width: 90%;
}
}

.top_news_btn a:hover {
opacity: 0.7;
}

.top_news_btn a::after {
content: "";
width: 40px;
height: 2px;
position: absolute;
top: 50%;
right: -20px;
background: #C1272D;
}

/*============================================
アクセス
===========================================*/
#top_access {
margin-bottom: 0.4rem;
}
@media screen and (max-width: 767px) {
#top_access {
padding-top: 0.8rem;
margin-top: -0.8rem;
}
}

#top_access h2 {
margin-bottom: 0.4rem;
}

@media screen and (max-width: 767px) {
#top_access h2 img {
height: 0.9rem;
}
}

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

/*テキスト*/
.top_access_box_left {
width: 58%;
box-sizing: border-box;
line-height: 0;
}
@media screen and (max-width: 767px) {
.top_access_box_left {
width: 100%;
margin-bottom: 0.5rem;
}
}

.top_access_text01 {
font-family: 'Noto Serif JP', serif;
font-size: 0.18rem;
margin-bottom: 5px;
line-height: 1.7;
letter-spacing: 0.1em;
}

@media screen and (max-width: 767px) {
.top_access_text01 {
font-size: 0.16rem;
}
}

.top_access_text02 {
font-size: 0.14rem;
line-height: 2;
font-family: 'Noto Serif JP', serif;
}

@media screen and (max-width: 767px) {
.top_access_text02 {
line-height: 1.6;
padding-bottom: 0.1rem;
font-size: 0.12rem;
}
}

.top_access_text03 {
font-family: 'Noto Serif JP', serif;
font-size: 0.14rem;
line-height: 2;
margin-bottom: 0.3rem;
}

@media screen and (max-width: 767px) {
.top_access_text03 {
line-height: 1.6;
font-size: 0.16rem;
}
}

/*電話番号*/
.top_access_box_left a {
font-family: 'Roboto', sans-serif;
font-size: 0.4rem;
text-decoration: none;
color: #000;
margin-bottom: 0.5rem;
display: inline-block;
font-weight: 100;
}

@media screen and (max-width: 767px) {
.top_access_box_left a {
font-size: 0.3rem;
margin-bottom: 0.2rem;
display: block;
font-weight: 300;
}
}

/*画像*/
.top_access_box_right {
width: 42%;
box-sizing: border-box;
padding-left: 2%;
line-height: 0;
margin-bottom: 0.3rem;
}
@media screen and (max-width: 767px) {
.top_access_box_right {
width: 100%;
box-sizing: border-box;
padding-left: 0;
}
}

/*マップ*/
.top_access_map {
width: calc(100% - 0.6rem);
margin: 0 auto;
}
@media screen and (min-width:768px) and ( max-width:1024px){
.top_access_map {
width: 100%;
}
}
@media screen and (max-width: 767px) {
.top_access_map {
width: 100%;
}
}

.top_access_map iframe{
width: 100%;
height: 5.5rem;
}
@media screen and (max-width: 767px) {
.top_access_map iframe{
height: 3rem;
}
}


/*============================================
イメージ写真
===========================================*/
#top_image {
margin-bottom: 0.6rem;
}
.top_image_box ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.top_image_box li {
width: 33%;
margin-bottom: 0.05rem;
line-height: 0;
}
@media screen and (max-width: 767px) {
.top_image_box li {
width: 49.5%;
margin-bottom: 0.05rem;
line-height: 0;
}
}

