@charset "utf-8";
/* CSS Document */


html {position: relative;min-height: 100%; overflow-x: hidden;}
* { font-family: 'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;}
*, *::before, *::after { box-sizing: border-box;}
body { font-size:16px; margin:0 auto; box-sizing:border-box; color:#333; -webkit-print-color-adjust: exact; overflow-x: hidden; overflow-y: auto;}
div { box-sizing: border-box;}
main img, header img{ width:100%; display:block;}
ul { padding-left:0;}
ul li { list-style-type:none; }
a { color:#E50012; text-decoration:none;}
a:hover { color:#EF5656;}
.caption { font-size:0.8rem;}


/* --------------------------------------------------------

　ベース

-------------------------------------------------------- */

.clearfix { overflow:hidden;} .clearfix::after{content: "";clear: both;display: block;}
.box_content, .bk_content, .box_inner { margin:0 auto;}
.box_content{ max-width:1430px; margin:0 auto;}
.bk_content{ width:100%; background-color:#CCC;}
.box_inner{ max-width:1100px;}
.box_relative { position:relative;}
.box_absolute { position:absolute;} 


/* WEBフォント */
@font-face{ font-family: 'haresora'; src: url('../fonts/haresora.woff') format('woff'), url('../fonts/haresora.otf') format('opentype'); font-weight: normal; font-style: normal;}
.f_haresora, .f_haresora > p, .f_haresora > li a { font-family: 'haresora';}

@font-face{ font-family: 'aozora_r'; src: url('../fonts/aozora_r.woff') format('woff'), url('../fonts/aozora_r.ttf') format('truetype'); font-weight: normal; font-style: normal;}
@font-face{ font-family: 'aozora_m'; src: url('../fonts/aozora_m.woff') format('woff'), url('../fonts/aozora_m.ttf') format('truetype'); font-weight: normal; font-style: normal;}
@font-face{ font-family: 'oswald_b'; src: url('../fonts/oswald_b.woff') format('woff'), url('../fonts/oswald_b.ttf') format('truetype'); font-weight: normal; font-style: normal;}
.f_oswald_b {font-family: 'oswald_b'; font-weight: normal;}
.f_opensans {font-family: 'Open Sans', sans-serif;}


/* 見出し */
main h2,  main h2 span{font-family: 'aozora_r'; font-weight:normal;}
main h3,  main h3 span{font-family: 'aozora_m'; font-weight:normal;}

#hana main h2, #hana main h3, #hana main h2 span,  #hana main h3 span{font-family: 'hanazonomin'; font-weight:normal;}
#ao main h2, #ao main h3, #ao main h2 span,  #ao main h3 span{font-family: 'aozora_r'; font-weight:normal;}
#ao_m main h2, #ao_m main h3, #ao_m main h2 span,  #ao_m main h3 span{font-family: 'aozora_m'; font-weight:normal;}

main > div h2 { margin-top:6.2rem; padding:1rem 0; font-size: 3.5rem; text-align: center; border-bottom:#333 1px solid; border-top:#333 1px solid; line-height:135%;}
main > div h2::before { content:url(../img/img_stamp.png);}
main h3 { font-size:1.5rem; text-align:center; line-height:135%;} 
main h3 span{ display:block; font-size:0.85rem;}
.box_absolute h3 { margin:0; text-align:left;}


/* テキスト */
p { line-height:170%; margin:0;}
.text_v{ letter-spacing: 1px;writing-mode: vertical-rl;-ms-writing-mode: tb-rl;-webkit-writing-mode:vertical-rl;}
.text_v h3 { text-align:left;}
.text_v.line_white p,	.text_v.line_black p { border-left:#333 1px solid; padding:0.2rem; font-size:1.15rem;}
.text_v.line_white p { color:#FFF; border-left-color:rgba(255,255,255,0.7);}	.text_v.line_white p:first-of-type{ border-right: rgba(255,255,255,0.7) 1px solid;}
.text_v.line_black p { border-left-color:rgba(51,51,51,0.7);}					.text_v.line_black p:first-of-type{ border-right: rgba(51,51,51,0.7) 1px solid;}
i[aria-hidden="true"] { margin-right:0.25rem;}

#satsuma .text_v.line_white p:last-of-type { border-left: none; text-align:right;padding-right: 0.75rem;}


/* その他アイテム */
.drop { position:relative;}
.drop::after { content: url(../img/img_metaphor.png); position: absolute; top:0; left:0; right:0; margin:0 auto;width: 100%;text-align: center;}
.pickup::before { content:url(../img/img_pickup.png); position:absolute; left:0;}
.pickup { padding-left:4rem;}
.clearfix.over_image { overflow:inherit;}
.masking {-webkit-clip-path: url(#svg_drop); clip-path: url(#svg_drop);}


/* メニュー */
.fat-nav li { padding:0.35rem; }


/* --------------------------------------------------------

　カラム

-------------------------------------------------------- */



.col { margin-bottom:0;}

.col [class*="w"] { margin:0 1.8%; float:left;}
.col > [class*="w"] { margin-bottom:2.5rem;}
#concept .col > [class*="w"] { margin-bottom:6.5rem;}

/* マージン打ち消し */
.col [class*="w"]:first-of-type { margin-left:0;}
.col [class*="w"]:last-of-type { margin-right:0;}

/* 左打ち消し */
.col .w_3:nth-of-type(4n+1),
.col .w_4:nth-of-type(3n+1){ margin-left:0;}



/* 右打ち消し */
.col .w_3:nth-of-type(4n),
.col .w_4:nth-of-type(3n),
.col .w_6:nth-of-type(even) { margin-right:0;}


.col .m0_bottom { margin-bottom:0;}
.col .m0_right { margin-right:0;}
.col .m0_left { margin-left:0;}

.col .w_3 { width: 22.27%;}
.col .w_4 { width: 30.9%}
.col .w_6 { width: 48.18%}
.col .w_8 { width: 65.45%}
.col .w_9 { width: 74.09%}
.col .w_12 { width: 100%}

.col_mr { margin-right:1.8%;}
.col_ml { margin-left:1.8%;}





/* --------------------------------------------------------

　ヘッダー

-------------------------------------------------------- */
header li img { width:100%;}
header > div { position:relative; padding-top:40.9%;overflow:hidden;}
header h1, header h2, header #main_shop_data { position:absolute;font-size:1rem;color:#fff;margin:0 auto;}
header h1 { top:17%; right:0; bottom:0; left:0; margin:0 auto; width:20.6%; height:436px; z-index:2;}
header h2{top: 0; width: 100%; background-color:rgba(48,22,12,0.85); text-align:center; padding:0.5rem 5%; font-weight: normal; line-height:140%; z-index:1;}
header #main_shop_data { padding: 2rem 0 1rem; bottom:0; background: url(../img/img_bk_main.png) no-repeat center top; background-size: cover; opacity:0.8;}
header .col, header .col > [class*="w"]{ margin-bottom:0;}
header #main_shop_data_s{ display:none; background-color:#31180D; color:#FFF; padding:0.75rem 2.5% 1rem 2.5%;}
	

/* ハンバーガメニュー */
.hamburger__icon, .hamburger__icon:before, .hamburger__icon:after {background-color:#fff;}
.hamburger { position:absolute; top:3.5rem; right:5%; left:auto; height:auto; background-color:rgba(48,22,12,0.6); border: 4px solid #fff; box-shadow:0 0 17px 2px #31180D; z-index:10000;}
.hamburger__icon, .hamburger__icon:before, .hamburger__icon:after { width:18px; height:3px;}


/* スライダー */

header #img_mobile.box_slider{ display:none;}
header #img_pc.box_slider{ display: block;}

header .box_slider { position:absolute; top:0; z-index:0;}
.flexslider {width: 100%;}
.flex-direction-nav { margin-top:5%;}
.flexslider .flex-nav-prev { opacity:1; display:block; z-index:20;}
.flex-direction-nav a { margin-top:0;}





/* --------------------------------------------------------

　メイン

-------------------------------------------------------- */

/* コンセプト */
#concept > div:first-of-type { position:relative;}
#grill { position:absolute; width:100%; max-width:7.3%; right:0; left:0; bottom:0; margin:0 auto; }
#concept .bk_content { background:url(../img/img_bk_concept.jpg) no-repeat center; background-size: cover; position:relative;}
#concept .bk_content::after { content:url(../img/img_metaphor.png); position:absolute; top:0; right:0; left:0; margin:0 auto; text-align:center; }
#concept .col > [class*="w"] { padding-top:1.5rem;}

#concept .col > [class*="w"]:nth-of-type(2) { padding-top:0; }
#concept .col > [class*="w"]:nth-of-type(2) img { display:block; margin:0 auto; right:-19%;}
#concept .col > [class*="w"]:last-of-type .box_absolute { right:15%; padding-bottom:1.5rem;}
#concept .box_content { padding:2rem 0;}
#concept .text_v.line_white p { height:17rem; margin-top:1rem; letter-spacing:2px; font-size:1.25rem;}
#concept > .bk_content > .box_inner > div:first-of-type > div { left:23%; }

.flexslider { z-index:0;}
.flexslider#short { display:none;}

/* 焼肉きっずのおもてなし */
main #omotenashi h2 { margin-top:12rem;}


/* 秘伝のタレ */
#souce .box_inner{ background:url(../img/img_sauce_main.jpg) no-repeat top right ; background-size:contain; padding-top:40%;}
#souce .text_v { top:0; left:0;}


/* さつま ＆ メッセージ */
#satsuma { background-color:#151413;}
#satsuma .box_inner > div:last-of-type,
#message .box_inner > div:last-of-type { padding-top: 1.25rem;}
#satsuma .box_inner > div:last-of-type > div,
#message .box_inner > div:last-of-type > div { float:right;}
#satsuma h3, #message h3 { color: #FFF; margin-right:0; font-size:1.9rem; line-height: 125%;}
#message { background-color:#30160C;}
#satsuma .col [class*="w"], #message .col > [class*="w"] { margin:0;}
#satsuma .col [class*="w"] > div, #message .col > [class*="w"] > div { min-height:1.7rem;}



/* おすすめ */
#menu .box_inner .img_main .box_absolute { top:0; left:0; }
#menu .img_main { margin-bottom:2rem;}
#menu .box_inner .img_main .box_absolute h3 { margin-top:0; font-size:2rem;}
#menu h3 { text-align:left; margin:1rem 0 0.5rem 0;}

#menu .box_inner > div:nth-child(2) > .box_relative:first-of-type > img{ width:857px; right:0;}
#menu .box_inner > div:nth-child(2) > .box_relative:first-of-type > div{ width:55%; right:0;}
#menu #sirloin > div:first-of-type h3{ margin-top:0;}
#menu #heart > div { width:106.2%; position: absolute; top:-1rem; left:0;}
#menu #heart > div h3 { margin-top:0.5rem;}
#menu #rice > div { width:175%; position: absolute; top:-6rem; left:0;}
#menu #rice > div  > div { position:absolute; z-index:1; bottom: -3.15rem; width: 55%;}
#menu #kimchi .box_relative div { padding-top: 36.1%;}
#menu #kimchi .box_absolute { width:140%; top:0; right:0;}




/* メニュー */
#all_menu h4 { border-bottom:1px solid #ccc; padding:0.5rem 0; margin-bottom:1rem;}
#all_menu ul { margin: 0.8rem 0 2rem 0;}
#all_menu li span:last-of-type { float:right;}
#all_menu ul li { margin-top:0.3rem; font-size:0.95rem; width:100%; display:inline-block;}

#all_menu .all_menu_box { padding:0 2%;}

.flexible_box {
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}



/* 店舗のご紹介 */
#shop .box_inner > .col:first-of-type div > .box_relative { padding-top:73.5%; background-color:#ccc;}
#shop .box_inner > .col:first-of-type div > .box_relative:after{ content:"※お使いのブラウザでは表示できません"; color:#FFF; top:0; bottom:0; left:0; right:0; padding:1rem; display:block; height:100%; width:100%;}
#shop .box_inner > .col:first-of-type div > .box_relative iframe { top: 0;left: 0;width: 100%;height: 100%;}

#shop h3 { text-align:left;}
#shop .col p { margin-top:1rem;}
#shop .col > div:first-of-type > img { margin-top:1rem;}
#shop .col:last-of-type h3 { margin-top:0;}


/* お問い合わせ */

#contact { text-align:center;}
main #contact > p:nth-of-type(2) { font-size:3.25rem;}

/*20180123予約ボタン*/

#contact .btn_frame {
	display:block;
	border:solid #E50012 1px;
	padding:15px;
	margin:auto; 
	margin-top:20px;
	width:30%;
}




/* --------------------------------------------------------

　フッター

-------------------------------------------------------- */
footer .bk_content{ margin-top:6rem; background:url(../img/img_foot.jpg) no-repeat center top; background-size:contain; padding-top:11.75%;}
footer img { display:block; margin:1.75rem auto;}
#btn_top, #back-top { position:fixed; bottom: 2.5rem; right: 2.5%;}
#btn_top a, #back-top a { position: relative; background: url(../img/img_btn_top.png) no-repeat top center; background-size: contain; color: #FFF; padding: 1.25rem; }
#btn_top a i, #back-top a i { position: absolute;display: block;top: 0;bottom: 0; right:0; left:0; margin: auto;width: 100%; height: 55%;text-align: center;}
footer div:last-of-type { padding:0.5rem 0; background-color:#31180D; color:#FFF; text-align:center; }





/* 画面Ｌサイズ */
@media (max-width: 64em) {
.box_content { padding:0 5%;}
.box_absolute { position:static;}
#menu #sirloin .box_relative > img { width:125%; margin-bottom:2rem;}
#menu #sirloin .box_relative > div { width:100%;}

.drop:after { content:url(../img/img_metaphor_s.png);}
.text_v.line_white p, .text_v.line_black p { font-size:0.9rem;}

.text_v h3 { margin-left:0.75rem;}

#concept .col > [class*="w"] .box_absolute { position:absolute;}
#concept .bk_content::after { content:url(../img/img_metaphor_s.png); }

#souce .box_absolute { position:absolute;}
.flex-direction-nav { margin-top:15%;} 
#contact .btn_frame{width:50%;}


/* ヘッダー */
header #main_shop_data_s{ display:block; font-size:0.7rem;}
header #main_shop_data{ display:none;}
header h1 { width:30%;}
header h2 { padding: 0.5rem 2.5%; text-align:left; font-size:0.8rem; }




/* メニューイレギュラー */
#menu { overflow:hidden;}
#menu .img_main .col > div { margin-bottom:0;}
#menu #sirloin div.box_absolute { position:absolute; bottom:0;}
#menu #heart > div{ width:90%; position: static; margin:0 auto;}
#menu #rice > div { width:70%; position: static; margin:0 auto;}
#menu #rice > div > div { bottom: -2rem; width: 100%;}
#menu #kimchi .box_absolute {position: absolute;}
#shop .box_absolute { position: absolute; }




	
/* カラム */
/* 両方打ち消し */
.col [class*="wl_"]:nth-of-type(odd),
.col [class*="wl_"]:nth-of-type(even){ margin-right:0; margin-left:0;}
.col > [class*="w"] { margin-bottom:2.5rem;}

.col .wl_3:nth-of-type(4n),
.col .wl_4:nth-of-type(3n),
.col .wl_6:nth-of-type(even) { margin-right:0; margin-left:1.8%;}
.col .wl_6:nth-of-type(odd) { margin-left:0; margin-right:1.8%;}

.col .wl_3 { width: 22.27%}
.col .wl_4 { width: 30.9%}
.col .wl_6 { width: 48.18%}
.col .wl_12 { width: 100%;}


}


/* 画面Ｍサイズ */
@media (max-width: 52em) {
.br_point::after{ content:"\A"; white-space: pre ;}
main h3 { font-size: 1.5rem;}
#satsuma .box_inner > div:last-of-type > div, 
#message .box_inner > div:last-of-type > div { float:none; margin:0 auto;}
#message .box_inner > div:last-of-type { padding-top: 0;}
#satsuma h3, #message h3 { font-size:1.5rem;}
#satsuma .col > [class*="w"]:last-of-type, #message .col > [class*="w"]:last-of-type { padding:2rem 0;}
#contact .btn_frame{width:50%;}

/* 焼肉きっずのおもてなし */
main #omotenashi h2 { margin-top:6.2rem;}

.flex-direction-nav { margin-top:18%;}


/* カラム */
.col [class*="wm_12"]{ margin-left:0; margin-right:0;}
.col > [class*="w"] { margin-bottom:2.5rem;}

.col .wm_3 { width: 22.27%}
.col .wm_4 { width: 30.9%}
.col .wm_6 { width: 48.18%}
.col .wm_12 { width: 100%;margin-left:0; margin-right:0;}

}


/* 画面Ｓサイズ */
@media (max-width: 40em) {
.br_point::after{ content:"\A"; white-space: pre ;}
body { font-size:14px;}
main > div h2 { padding-top:1rem; padding-bottom:0.75rem; font-size:1.75rem; }
main > div h2::before { content:url(../img/img_stamp_s.png); margin-right:0.15rem;}
main h3 { margin:0.75rem auto 0.5rem auto; font-size:1.35rem;}
#menu .box_inner .img_main .box_absolute h3 { font-size:1.35rem;}
main #contact > p:nth-of-type(2) { font-size:2rem;}
.text_v.line_white p, .text_v.line_black p { font-size:0.8rem;}
#satsuma .text_v.line_white p,
#message .text_v.line_white p {border:none; }

.fat-nav a { font-size:1rem;}

.hamburger__icon, .hamburger__icon:before, .hamburger__icon:after { width:16px; height:2px;}
.hamburger { top:0.75rem; right:0.75rem; /*padding-left:3.85rem; padding-right: 1.5rem; padding-top:0.5rem; padding-bottom:0.57rem;*/}
.hamburger:after { right: 2.0rem; font-size:0.9rem; padding-right: 1.75rem; padding-right:0;}

#concept .col > [class*="w"] .box_absolute { position: static;}
#concept .text_v.line_white p { height:11rem; margin-top:0; font-size:0.8rem; letter-spacing:0;}
#concept .col > [class*="w"] { margin-bottom:2.5rem; }
	  

#concept .col { height:27rem;}
#concept .col > div:first-of-type { position:absolute; bottom:0; right:4%; margin:0 auto 2rem 47.5%; padding-top:8rem; }
#concept .col > div:nth-of-type(2) { position:absolute; width:80%; top:0; left:0;}
#concept .col > div:last-of-type { position:absolute; top:0; right:4%; margin:0 auto 0 47.5%; padding-top:1.5rem;}

#souce .box_inner { background-size:125%; padding-top:57.5%;}
#souce .box_absolute { position:static; margin:0 auto 0 auto; padding-bottom: 1.5rem;}

#contact .btn_frame{width:100%;}

/* ヘッダー */
header h1 { width:45%; top: 25.5%; }
header h2 { display:block; position:inherit; padding: 1rem 2.5% 0 2.5%; background-color: rgba(48,22,12,1); text-align: left;line-height: 170%; font-weight: bold; }



/* スライド */
header > div { padding-top:100%;}
header #img_pc.box_slider { display:none;}
header #img_mobile.box_slider { display:block;}


/* メニューイレギュラー */
#menu #sirloin div.box_absolute { position: static;}
#menu .box_inner .img_main .box_absolute { margin-top:1rem;}
#menu #sirloin .box_relative > img { width:150%; margin:0 0 0 -20%;}
#menu #heart > div { width:140%; }
#menu #heart > div img { margin:0 -12.5%;}
#menu #rice > div { width:100%; }
#menu #rice > div > div { position:static;}
#menu #kimchi .box_absolute { right:-20%;}
#menu #rice h3 { margin-top:-0.5rem; }
#menu #kimchi > div:first-of-type h3{ margin-top:0; }



/* カラム */
.col [class*="wl_"]:nth-of-type(odd),
.col [class*="wl_"]:nth-of-type(even) { margin-left:0; margin-right:0;}
.col:only-child [class*="_12"]:last-of-type { margin-bottom:0;} 
.col [class*="ws_12"],
.col [class*="wl_"],
.col [class*="wm_"]{ margin-left:0; margin-right:0;}

/* 左打ち消し */
.col .ws_6:nth-of-type(odd){ margin-left:0;}

/* 右打ち消し */
.col .ws_6:nth-of-type(even) { margin-right:0;}

/* 両方打ち消し */
.col .ws_12:nth-of-type(odd),
.col .ws_12:nth-of-type(even) { margin-right:0; margin-left:0;}

/* カラム　再定義 */
.col .ws_3 { width: 22.27%;}
.col .ws_4 { width: 30.9%}
.col .ws_6 { width: 48.18%}
.col .ws_12 { width: 100%; margin-left:0; margin-right:0;}
.col > [class*="w"] { margin-bottom:2.5rem;}

.flexible_box { display:block;}



/* ※アンドロイド用 */
html.android #shop .col { display: block;}
html.android #shop .col .ws_6:nth-of-type(odd) { margin-left:0; float:left;}
html.android #shop .col .ws_6:nth-of-type(even) { margin-right:0; float: right;}

html.android #souce .box_absolute { height:16rem;}
html.android #concept .text_v { height:13rem; margin:0;}
html.android #concept .col { overflow: hidden; padding-top:100%;}

html.android #concept .col { height: auto;}
html.android #concept .col > div:first-of-type{ position:static; margin:0 0 1rem 0; padding-top:0; padding-left:5%; float:left; z-index:1; box-sizing:border-box;}
html.android #concept .col > div:nth-of-type(2) { width:95%; left:20%; }
html.android #concept .col > div:last-of-type { position:static; margin:0 0 1rem 0; padding-top:0; padding-right:5%; float:right; box-sizing:border-box;}

html.android #concept .col > div p { border:none;}
html.android #souce .text_v p { height:13rem;padding-bottom:1rem;}
html.android #satsuma .col > [class*="w"]:last-of-type { overflow:hidden;}
html.android #satsuma .col > [class*="w"]:last-of-type > div { height:18rem; padding-bottom:1rem; }
html.android #message .col > [class*="w"]:last-of-type > div { height:18rem; padding-bottom:1rem;}

html.android #all_menu .flexible_box { display:block;}

}