@charset "utf-8";

.font_en {
font-family: 'Poppins', sans-serif;
}

.font_jp {
font-family: "Sawarabi Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
transform: rotate(0.05deg);
}

p {
font-size: 1.8rem;
font-family: "Sawarabi Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
transform: rotate(0.05deg);
}

img {
width: 100%;
}

.fade-in {
transition: opacity 0.4s;
-moz-transition: opacity 0.4s;
-webkit-transition: opacity 0.4s;
-o-transition: opacity 0.4s;
}

.fade-up {
transition: opacity 1.5s;
-moz-transition: opacity 1.5s;
-webkit-transition: opacity 1.5s;
-o-transition: opacity 1.5s;
transition: transform 1.5s;
-moz-transition: transform 1.5s;
-webkit-transition: transform 1.5s;
-o-transition: transform 1.5s;
}


/* TOP画像slide */
#topslide_wrap {
padding: 0;
display: block;
height: 100%;
width: 100%;
position: relative;
z-index: 1;
}

#topslide, #topslide>li {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
}

#topslide>li {
background-size: cover;
background-position: 50% 50%;
z-index: 10;
}

#topslide>li.active {
z-index: 5000;
}

#topslide>li.active:first-child {
z-index: 9000;
}

#topslide_wrap #topslide>li {
-webkit-transform: scale(1.0);
-moz-transform: scale(1.0);
-o-transform: scale(1.0);
-ms-transform: scale(1.0);
transform: scale(1.0);
}

#topslide_wrap #topslide>li.active {
-webkit-animation: slideAnime 6s ease;
animation: slideAnime 6s ease;
}

@-webkit-keyframes slideAnime {
0% {
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2) rotate(0.01);
}

100% {
-webkit-transform: scale(1.0);
-moz-transform: scale(1.0);
-o-transform: scale(1.0);
-ms-transform: scale(1.0);
transform: scale(1.0) rotate(0.01);
}
}

@keyframes slideAnime {
0% {
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2) rotate(0.01);
}

100% {
-webkit-transform: scale(1.0);
-moz-transform: scale(1.0);
-o-transform: scale(1.0);
-ms-transform: scale(1.0);
transform: scale(1.0) rotate(0.01);
}
}

/*********** PC ***********/
@media screen and (min-width: 768px) {
.sp {
display: none !important;
}

#loading {
/*background: #000 url(/images/parts/loading_bg_pc.jpg) no-repeat;*/
background: #000;
background-size: cover;
background-position: center center;
position: fixed;
width: 100vw;
height: 100vh;
z-index: 9999;
}

#loading #loading_img_wrap {
width: 100vw;
height: 100vh;
display: table-cell;
vertical-align: middle;
text-align: center;
}

#loading #loading_img_wrap #loading_logo svg {
margin-top: -40px;
width: 300px;
overflow: visible;
}

@-webkit-keyframes bounce {

from,
10%,
26.5%,
40%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}

20%,
21.5% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -40px, 0);
transform: translate3d(0, -40px, 0);
}

35% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}

45% {
-webkit-transform: translate3d(0, 0px, 0);
transform: translate3d(0, 0px, 0);
}
}

/*
.svg_logo path:nth-child(n + 1):not(:nth-child(n + 13)) {
fill: #fff;
-webkit-animation: bounce ease-in 3s infinite; 
animation: bounce ease-in 3s infinite;
}
.svg_logo01{animation-delay: 0.1s!important;}
.svg_logo02{animation-delay: 0.1s!important;}
.svg_logo03{animation-delay: 0.1s!important;}
.svg_logo04{animation-delay: 0.1s!important;}
.svg_logo05{animation-delay: 0.4s!important;}
.svg_logo06{animation-delay: 0.4s!important;}
.svg_logo07{animation-delay: 0.4s!important;}
.svg_logo08{animation-delay: 0.4s!important;}
.svg_logo09{animation-delay: 1.5s!important;}
.svg_logo10{animation-delay: 1.5s!important;}
.svg_logo11{animation-delay: 1.5s!important;}
.svg_logo12{animation-delay: 1.5s!important;}
*/

#loading #loading_img_wrap #loading_pageloading svg {
margin-top: 10px;
width: 150px;
overflow: visible;
}

.svg_pageloading path:nth-child(n + 1):not(:nth-child(n + 12)) {
fill: #fff;
-webkit-animation: bounce ease-in 1.5s infinite;
animation: bounce ease-in 1.5s infinite;
}

.svg_pageloading01 {
animation-delay: 0.1s !important;
}

.svg_pageloading02 {
animation-delay: 0.2s !important;
}

.svg_pageloading03 {
animation-delay: 0.3s !important;
}

.svg_pageloading04 {
animation-delay: 0.4s !important;
}

.svg_pageloading05 {
animation-delay: 0.5s !important;
}

.svg_pageloading06 {
animation-delay: 0.6s !important;
}

.svg_pageloading07 {
animation-delay: 0.7s !important;
}

.svg_pageloading08 {
animation-delay: 0.8s !important;
}

.svg_pageloading09 {
animation-delay: 0.9s !important;
}

.svg_pageloading10 {
animation-delay: 1.0s !important;
}

.svg_pageloading11 {
animation-delay: 1.1s !important;
}





header {
width: 100%;
z-index: 6000;
position: relative;
}

header h1 {
position: absolute;
top: 40px;
left: -150px;
line-height: 0;
-webkit-transition: all 0.5s ease-out 0s;
-moz-transition: all 0.5s ease-out 0s;
-ms-transition: all 0.5s ease-out 0s;
-o-transition: all 0.5s ease-out 0s;
transition: all 0.5s ease-out 0s;
}

header h1.loadingcomp {
left: 40px;
}

header nav {
position: absolute;
top: 100px;
left: -200px;
-webkit-transition: all 0.5s ease-out 0s;
-moz-transition: all 0.5s ease-out 0s;
-ms-transition: all 0.5s ease-out 0s;
-o-transition: all 0.5s ease-out 0s;
transition: all 0.5s ease-out 0s;
}

header nav.loadingcomp {
left: 40px;
}

header h1 img {
width: 150px;
}

header nav .logo_navi {
display: none;
}

header nav ul li {
margin: 0 0 15px;
text-shadow: 1px 1px 13px #000;
}

header nav ul li a {
color: #fff;
position: relative;
display: inline-block;
}

header nav ul li a:before {
position: absolute;
top: 1.3em;
left: 0;
content: "";
display: inline-block;
width: 0;
height: 1px;
background: #fff;
transition: 0.5s;
}

header nav ul li a:hover:before {
width: 100%;
}

header nav ul li a:hover {
color: #fff;
}

header nav ul li.instagram a {
	display: flex;
	align-items: center;
}
header nav ul li.instagram a span {
	display: inline-block;
}
header nav ul li.instagram a span.ico {
	line-height: 0;
	margin-right: 5px;
}
header nav ul li.instagram a span.ico img {
	width: 20px;
}

main article section#top_image {
z-index: 5000;
}

main article section#top_image ul#topslide li:nth-child(1) {
background-image: url(/images/parts/top_image01.jpg);
}

main article section#top_image ul#topslide li:nth-child(2) {
background-image: url(/images/parts/top_image02.jpg);
}

main article section#top_image ul#topslide li:nth-child(3) {
background-image: url(/images/parts/top_image03.jpg);
}

main article section#top_image ul#topslide li:nth-child(4) {
background-image: url(/images/parts/top_image04.jpg);
}

main article section.cont_area {
padding: 60px 0 100px;
}

main article section.cont_area h2 {
background-size: cover;
background-repeat: no-repeat;
width: 180px;
height: 85px;
text-align: center;
font-weight: bold;
line-height: 114px;
font-size: 2.0rem;
margin: 0 auto;
}

main article section.cont_area.cont_area_white h2 {
background-image: url(/images/parts/all_ttl_bg_black.svg);
}

main article section.cont_area.cont_area_black h2 {
background-image: url(/images/parts/all_ttl_bg_white.svg);
}

main article section.cont_area.cont_area_black {
background: #000;
color: #fff;
}

main article section.cont_area p {
text-align: center;
margin: 40px 0 60px;
}

main article section.cont_area .cont_area_btn {
width: 300px;
margin: 0 auto;
text-align: center;
}

main article section.cont_area.cont_area_white .cont_area_btn a {
padding: 20px 0;
position: relative;
display: block;
background: #000;
color: #fff;
}

main article section.cont_area.cont_area_black .cont_area_btn a {
padding: 20px 0;
position: relative;
display: block;
background: #fff;
color: #000;
}

main article section.cont_area .cont_area_btn a:hover {
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
opacity: 0.8;
}

main article section.cont_area#top_kodawari h3 {
-webkit-writing-mode: vertical-rl;
writing-mode: vertical-rl;
font-size: 4.8rem;
line-height: 2.4;
margin: 50px auto 80px;
text-align: center;
}

main article section.cont_area .cont_area_img {
width: 900px;
margin: 0 auto;
}

main article section.cont_area#top_menu #top_menu_scrollimg01 {
margin-top: 30px;
}

main article section.cont_area#top_kodawari .cont_area_img,
main article section.cont_area#top_shop .cont_area_img,
main article section.cont_area#top_fc .cont_area_img {
margin-top: 30px;
}

#contents_footer {
background-image: url(/images/parts/loading_bg_pc.jpg);
background-repeat: no-repeat;
background-size: cover;
position: relative;
width: 100%;
padding: 30px 0;
}

#contents_footer li a {
color: #fff;
position: relative;
display: inline-block;
}

#contents_footer li a:before {
position: absolute;
top: 1.3em;
left: 0;
content: "";
display: inline-block;
width: 0;
height: 1px;
background: #fff;
transition: 0.5s;
}

#contents_footer li a:hover:before {
width: 100%;
}

#contents_footer span.line_wood_t {
display: block;
position: absolute;
top: 0;
height: 15px;
width: 100%;
background-image: url(/images/parts/line_wood.jpg);
background-repeat: repeat-x;
background-size: contain;
}

#contents_footer span.line_wood_b {
display: block;
position: absolute;
bottom: 0;
height: 15px;
width: 100%;
background-image: url(/images/parts/line_wood.jpg);
background-repeat: repeat-x;
background-size: contain;
}

#contents_footer .logo_cf {
width: 150px;
margin: 0 auto 10px;
}

#contents_footer ul {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
}

#contents_footer ul li {
margin: 0 10px;
}

/* 各ページ */
/*
body.page header nav ul li {
text-shadow: none;
}
body.page header nav ul li a {
color: #000;
}
body.page header nav ul li a:before{
background: #000;
}
body.page header nav ul li a:hover {
color: #000;
}
*/
body.page main article section.cont_area#cont_area_top {
padding-top: 0;
}

body.page main article section.cont_area#cont_area_top .cont_area_img {
margin: 0 auto 30px;
z-index: 500;
position: relative;
width: 100%;
}

main article section.cont_area#cont_area_top h2 {
margin-top: -80px;
z-index: 1000;
position: relative;
background-image: url(/images/parts/all_ttl_bg_black_color.png);
}

/* 3つのこだわり */
main article section.cont_area#cont_area_top h3 {
-webkit-writing-mode: vertical-rl;
writing-mode: vertical-rl;
font-size: 4.8rem;
line-height: 2.4;
margin: 50px auto 80px;
text-align: center;
}

main article section.cont_area.cont_area_kodawari {
border-top: 1px solid #ddd;
}

main article section.cont_area.cont_area_kodawari .subttl {
text-align: center;
font-weight: bold;
font-family: 'Poppins', sans-serif;
margin: 20px 0 5px;
letter-spacing: 5px;
font-size: 1.4rem;
}

main article section.cont_area.cont_area_kodawari h3 {
font-size: 4.8rem;
line-height: 1.1;
text-align: center;
margin: 0;
padding-bottom: 30px;
position: relative;
}

main article section.cont_area.cont_area_kodawari h3:after {
position: absolute;
bottom: 0;
left: calc(50% - 35px);
content: "";
display: block;
width: 70px;
height: 3px;
background-color: #000;
}

main article section.cont_area.cont_area_kodawari h3 span {
font-weight: bold;
}

/* メニュー */
body.page main article ul#menu_tab {
display: flex;
width: 900px;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
align-content: stretch;
margin: 0 auto;
}

body.page main article ul#menu_tab li {
background: #f4f4f0;
flex: auto;
text-align: center;
padding: 20px 0;
}

body.page main article ul#menu_tab li:hover {
text-decoration: underline;
cursor: pointer;
}

body.page main article ul#menu_tab li.active:hover {
text-decoration: none;
cursor: inherit;
}

body.page main article ul#menu_tab li.active {
background: #000;
color: #fff;
}

body.page main article ul#menu_tab li div.menu_tab_txt_b {
font-size: 3.0rem;
}

body.page main article section.cont_area.cont_area_menu {
width: 900px;
margin: 0 auto;
display: none;
}

body.page main article section.cont_area.cont_area_menu.active {
display: block;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li {
margin: 0 40px;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li a {
color: #fff;
position: relative;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li a:hover {
color: #ff6;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li a:before {
display: block;
content: "";
position: absolute;
top: 55%;
right: -20px;
width: 0;
height: 0;
margin-top: -5px;
border: 7px solid transparent;
border-top: 7px solid #fff;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li a:hover:before {
border-top: 7px solid #ff6;
}

body.page main article section.cont_area.cont_area_menu .cont_area_menu_item h3 {
font-size: 3.4rem;
text-align: center;
margin: 30px 0 20px;
padding-top: 30px;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul {
display: flex;
flex-wrap: wrap;
width: 100%;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul li {
width: 33.3%;
text-align: center;
margin-bottom: 40px;
cursor: pointer;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul li:hover {
color: #ff6;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul li .item_img {
padding: 0 20px;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul {
display: flex;
flex-wrap: wrap;
width: 100%;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li {
width: 100%;
text-align: center;
margin-bottom: 40px;
cursor: pointer;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li:hover {
color: #ff6;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li .item_img {
text-align: center;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li .item_img img {
width: 200px;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li.item_coffee {
border-top: 1px solid #666;
border-bottom: 1px solid #666;
margin: 0 20px 40px;
padding: 30px;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li.item_coffee .item_name_s {
font-size: 1.2rem;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li.item_coffee .item_coffee_txt {
font-size: 1.2rem;
margin-top: 20px;
}

/* 店舗情報 */
body.page main article section.cont_area.cont_area_shop {
padding-top: 0;
}

body.page main article section.cont_area.cont_area_shop .shop_pref {
width: 900px;
margin: 0 auto;
}

body.page main article section.cont_area.cont_area_shop .shop_pref .shop_pref_ttl {
background: #000;
color: #fff;
padding: 10px 15px;
margin: 40px 0 20px;
font-size: 2.0rem;
}

body.page main article section.cont_area.cont_area_shop .shop_pref ul li {
float: left;
display: inline-block;
margin: 0 20px 10px;
}

body.page main article section.cont_area.cont_area_shop .shop_pref ul li a {
text-decoration: underline;
}

body.page main article section.cont_area.cont_area_shop .shop_pref ul li a:hover {
text-decoration: none;
}

body.page main article section.cont_area.cont_area_shop .shop_info {
width: 900px;
margin: 0 auto;
}

body.page main article section.cont_area.cont_area_shop .shop_info table {
width: 100%;
}

body.page main article section.cont_area.cont_area_shop .shop_info table caption {
font-size: 3.0rem;
margin: 60px 0 20px;
}

body.page main article section.cont_area.cont_area_shop .shop_info table thead {
background: #000;
color: #fff;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tbody {
	font-size: 1.3rem;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr {
border-bottom: 1px solid #ddd;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tr th,
body.page main article section.cont_area.cont_area_shop .shop_info table tr td {
padding: 10px 8px 8px;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr th {
width: 100px;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.address {
width: 230px;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.openclose {
width: 150px;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.tel {
width: 120px;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-top: 3px;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder span {
	display: inline-block;
	line-height: 0;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder span img {
	width: 60px;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder span + span {
	margin-left: 7px;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder span.wolt img {
	height: 25x;
	width: 25px;
}

/* FC募集 */
body.page main article section.cont_area.cont_area_fc {
width: 100%;
max-width: 900px;
margin: 0 auto;
}

body.page main article section.cont_area.cont_area_fc h3 {
font-size: 3.4rem;
text-align: center;
margin: 0 0 20px;
}

body.page main article section.cont_area.cont_area_fc ol li {
font-size: 2.4rem;
color: #fff;
padding: 8px 0 10px;
margin-bottom: 40px;
text-align: center;
background: #979797;
position: relative;
}

body.page main article section.cont_area.cont_area_fc ol li.open_orange {
background: #dd6321;
}

body.page main article section.cont_area.cont_area_fc ol li.open_red {
background: #e00;
}

body.page main article section.cont_area.cont_area_fc ol li::after {
display: block;
content: "";
position: absolute;
bottom: -42px;
left: 50%;
width: 0;
height: 0;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #979797;
}

body.page main article section.cont_area.cont_area_fc ol li.kaiten::after {
border: none;
display: none;
}

body.page main article section.cont_area.cont_area_fc .fc_table {
margin: 0 0 30px;
}

body.page main article section.cont_area.cont_area_fc .fc_table table {
width: 100%;
}

body.page main article section.cont_area.cont_area_fc .fc_table.fc_table_fckamehiyou table {
width: 50%;
}

body.page main article section.cont_area.cont_area_fc .fc_table.fc_table_model table {
width: 70%;
}

body.page main article section.cont_area.cont_area_fc .fc_table table caption {
font-weight: bold;
}

body.page main article section.cont_area.cont_area_fc .fc_table table th,
body.page main article section.cont_area.cont_area_fc .fc_table table td {
padding: 4px 10px 2px;
}

body.page main article section.cont_area.cont_area_fc .fc_table table thead {
border-top: 2px solid #7a7a78;
border-left: 2px solid #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table thead th:first-child {
border-right: 2px solid #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table thead th {
border-right: 2px solid #7a7a78;
border-bottom: 2px solid #7a7a78;
background: #d0d0cc;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody th {
border-left: 1px solid #7a7a78;
border-right: 2px solid #7a7a78;
border-bottom: 1px dotted #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody td {
border-right: 1px solid #7a7a78;
border-bottom: 1px dotted #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.bd_line th,
body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.bd_line td {
border-bottom: 1px dotted #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.bd_2pxsolid th,
body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.bd_2pxsolid td {
border-bottom: 3px double #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.summary th {
text-align: center;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.summary th,
body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.summary td {
border-bottom: 1px solid #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.royality th,
body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.royality td {
border-bottom: 1px solid #7a7a78;
}

body.page main article section.cont_area.cont_area_fc h3.fc_contact_ttl {
line-height: 1;
}

body.page main article section.cont_area.cont_area_fc h3 span.fc_subtxt {
font-size: 1.2rem;
}

body.page main article section.cont_area.cont_area_fc .fc_contact {
border: 1px solid #000;
padding: 30px;
text-align: center;
}

body.page main article section.cont_area.cont_area_fc .fc_contact .fc_contact_txt {
margin-top: 10px;
}


/* footer */
#footer {
background: #fff;
text-align: center;
}
#footer img {
width: 100%;
}
#footer .corporate {
	padding: 20px 0;
	font-size: 10px;
}

#footer .logo img {
width: 150px;
}
#footer .copyright {
font-size: 12px;
color: #666;
	padding-bottom: 10px;
}

}


























/*********** スマホ ***********/
@media screen and (max-width: 767px) {
.pc {
display: none !important;
}

#loading {
/*background: #000 url(/images/parts/loading_bg_pc.jpg) no-repeat;*/
background: #000;
background-size: cover;
background-position: center center;
position: fixed;
width: 100vw;
height: 100vh;
z-index: 9999;
}

#loading #loading_img_wrap {
width: 100vw;
height: 100vh;
display: table-cell;
vertical-align: middle;
text-align: center;
}

#loading #loading_img_wrap #loading_logo svg {
margin-top: -20px;
width: 50vw;
overflow: visible;
}

@-webkit-keyframes bounce {

from,
10%,
26.5%,
40%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}

20%,
21.5% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -40px, 0);
transform: translate3d(0, -40px, 0);
}

35% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}

45% {
-webkit-transform: translate3d(0, 0px, 0);
transform: translate3d(0, 0px, 0);
}
}

/*
.svg_logo path:nth-child(n + 1):not(:nth-child(n + 13)) {
fill: #fff;
-webkit-animation: bounce ease-in 3s infinite; 
animation: bounce ease-in 3s infinite;
}
.svg_logo01{animation-delay: 0.1s!important;}
.svg_logo02{animation-delay: 0.1s!important;}
.svg_logo03{animation-delay: 0.1s!important;}
.svg_logo04{animation-delay: 0.1s!important;}
.svg_logo05{animation-delay: 0.4s!important;}
.svg_logo06{animation-delay: 0.4s!important;}
.svg_logo07{animation-delay: 0.4s!important;}
.svg_logo08{animation-delay: 0.4s!important;}
.svg_logo09{animation-delay: 1.5s!important;}
.svg_logo10{animation-delay: 1.5s!important;}
.svg_logo11{animation-delay: 1.5s!important;}
.svg_logo12{animation-delay: 1.5s!important;}
*/

#loading #loading_img_wrap #loading_pageloading svg {
margin-top: 10px;
width: 25vw;
overflow: visible;
}

.svg_pageloading path:nth-child(n + 1):not(:nth-child(n + 12)) {
fill: #fff;
-webkit-animation: bounce ease-in 1.5s infinite;
animation: bounce ease-in 1.5s infinite;
}

.svg_pageloading01 {
animation-delay: 0.1s !important;
}

.svg_pageloading02 {
animation-delay: 0.2s !important;
}

.svg_pageloading03 {
animation-delay: 0.3s !important;
}

.svg_pageloading04 {
animation-delay: 0.4s !important;
}

.svg_pageloading05 {
animation-delay: 0.5s !important;
}

.svg_pageloading06 {
animation-delay: 0.6s !important;
}

.svg_pageloading07 {
animation-delay: 0.7s !important;
}

.svg_pageloading08 {
animation-delay: 0.8s !important;
}

.svg_pageloading09 {
animation-delay: 0.9s !important;
}

.svg_pageloading10 {
animation-delay: 1.0s !important;
}

.svg_pageloading11 {
animation-delay: 1.1s !important;
}



.navi_btn {
position: fixed;
top: 20px;
right: 15px;
width: 35px;
height: 25px;
z-index: 5000;
}

.navi_btn span {
display: block;
width: 35px;
height: 4px;
background: #fff;
-webkit-transition: all 0.3s ease-out 0s;
-moz-transition: all 0.3s ease-out 0s;
-ms-transition: all 0.3s ease-out 0s;
-o-transition: all 0.3s ease-out 0s;
transition: all 0.3s ease-out 0s;
position: absolute;
cursor: pointer;
}

.navi_btn span:nth-child(1) {
top: 0;
}

.navi_btn span:nth-child(2) {
top: 10px;
}

.navi_btn span:nth-child(3) {
top: 20px;
}

.navi_btn.clicked span {
-webkit-transition: all 0.3s ease-out 0s;
-moz-transition: all 0.3s ease-out 0s;
-ms-transition: all 0.3s ease-out 0s;
-o-transition: all 0.3s ease-out 0s;
transition: all 0.3s ease-out 0s;
}

.navi_btn.clicked span:nth-child(1),
.navi_btn.clicked span:nth-child(3) {
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
top: 8px;
left: 0;
}

.navi_btn.clicked span:nth-child(2) {
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
top: 8px;
left: 0;
}




header {
width: 100%;
z-index: 6000;
position: relative;
}

header h1 {
position: absolute;
top: 12px;
left: 15px;
line-height: 0;
}

header h1 img {
width: 150px;
}

header nav {
margin-top: -100vh;
position: fixed;
width: 100vw;
height: 100vh;
text-align: center;
background: url(/images/parts/loading_bg_sp.jpg) no-repeat;
background-size: cover;
background-position: center center;
}

header nav.clicked {
-webkit-transition: all 0.3s ease-out 0s;
-moz-transition: all 0.3s ease-out 0s;
-ms-transition: all 0.3s ease-out 0s;
-o-transition: all 0.3s ease-out 0s;
transition: all 0.3s ease-out 0s;
margin-top: 0;
}

header nav .logo_navi {
width: 40vw;
margin: 20vh auto 20px;
}

header nav ul li {
margin: 0 0 20px;
}

header nav ul li a {
color: #fff;
font-size: 2.0rem;
}

header nav ul li a:hover {
color: #eee;
}
header nav ul li.instagram a {
	display: flex;
	align-items: center;
	justify-content: center;
}
header nav ul li.instagram a::before {
	display: none;
}
header nav ul li.instagram a span {
	display: inline-block;
}
header nav ul li.instagram a span.ico {
	line-height: 0;
	margin-right: 5px;
}
header nav ul li.instagram a span.ico img {
	width: 20px;
}

main article section#top_image {
z-index: 5000;
}

main article section#top_image ul#topslide li:nth-child(1) {
background-image: url(/images/parts/top_image01_sp.jpg);
}

main article section#top_image ul#topslide li:nth-child(2) {
background-image: url(/images/parts/top_image02_sp.jpg);
}

main article section#top_image ul#topslide li:nth-child(3) {
background-image: url(/images/parts/top_image03_sp.jpg);
}

main article section#top_image ul#topslide li:nth-child(4) {
background-image: url(/images/parts/top_image04_sp.jpg);
}

main article section.cont_area {
padding: 60px 0 100px;
}

main article section.cont_area h2 {
background-size: contain;
background-repeat: no-repeat;
width: 180px;
height: 85px;
text-align: center;
font-weight: bold;
line-height: 114px;
font-size: 2.0rem;
margin: 0 auto;
}

main article section.cont_area .cont_area_img {
margin: 0 20px;
}

main article section.cont_area .cont_area_img img {
width: 100%;
}

main article section.cont_area.cont_area_white h2 {
background-image: url(/images/parts/all_ttl_bg_black.svg);
}

main article section.cont_area.cont_area_black h2 {
background-image: url(/images/parts/all_ttl_bg_white.svg);
}

main article section.cont_area.cont_area_black {
background: #000;
color: #fff;
}

main article section.cont_area p {
text-align: center;
margin: 20px 20px 100px;
}

main article section.cont_area .cont_area_btn {
width: 300px;
margin: 0 auto;
text-align: center;
}

main article section.cont_area.cont_area_white .cont_area_btn a {
padding: 20px 0;
position: relative;
display: block;
background: #000;
color: #fff;
}

main article section.cont_area.cont_area_black .cont_area_btn a {
padding: 20px 0;
position: relative;
display: block;
background: #fff;
color: #000;
}

main article section.cont_area .cont_area_btn a:hover {
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
opacity: 0.8;
}

main article section.cont_area#top_kodawari h3 {
-webkit-writing-mode: vertical-rl;
writing-mode: vertical-rl;
font-size: 3.4rem;
line-height: 2.4;
margin: 60px auto 100px;
text-align: center;
}

main article section.cont_area#top_menu #top_menu_scrollimg01 {
margin-top: 30px;
}

main article section.cont_area#top_menu .top_menu_scrollimg img {
width: 800px;
}

main article section.cont_area#top_kodawari .cont_area_img,
main article section.cont_area#top_shop .cont_area_img,
main article section.cont_area#top_fc .cont_area_img {
margin-top: 30px;
}

#contents_footer {
background-image: url(/images/parts/loading_bg_pc.jpg);
background-repeat: no-repeat;
background-size: cover;
position: relative;
width: 100%;
padding: 30px 0;
}

#contents_footer li a {
color: #fff;
display: inline-block;
font-size: 1.2rem;
}

#contents_footer span.line_wood_t {
display: block;
position: absolute;
top: 0;
height: 15px;
width: 100%;
background-image: url(/images/parts/line_wood.jpg);
background-repeat: repeat-x;
background-size: contain;
}

#contents_footer span.line_wood_b {
display: block;
position: absolute;
bottom: 0;
height: 15px;
width: 100%;
background-image: url(/images/parts/line_wood.jpg);
background-repeat: repeat-x;
background-size: contain;
}

#contents_footer .logo_cf {
width: 150px;
margin: 0 auto 10px;
}

#contents_footer ul {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
}

#contents_footer ul li {
margin: 0 7px;
}

/* 各ページ */
/*
body.page header nav ul li {
text-shadow: none;
}
body.page header nav ul li a {
color: #000;
}
body.page header nav ul li a:before{
background: #000;
}
body.page header nav ul li a:hover {
color: #000;
}
*/
body.page header {
height: 50px;
background: #000;
position: fixed;
}

body.page header h1 img {
width: 95px;
}

body.page .navi_btn {
top: 14px;
right: 14px;
}

body.page .navi_btn span {
background: #fff;
}

body.page .navi_btn.clicked span {
background: #fff;
}

body.page main article section.cont_area#cont_area_top {
padding-top: 50px;
}

body.page main article section.cont_area#cont_area_top .cont_area_img {
margin: 0 auto 30px;
z-index: 500;
position: relative;
width: 100%;
}

body.page main article section.cont_area#cont_area_top h2 {
margin-top: -80px;
z-index: 1000;
position: relative;
background-image: url(/images/parts/all_ttl_bg_black_color.png);
}

/* 3つのこだわり */
body.page main article section.cont_area#cont_area_top h3 {
-webkit-writing-mode: vertical-rl;
writing-mode: vertical-rl;
font-size: 4.8rem;
line-height: 2.4;
margin: 50px auto 80px;
text-align: center;
}

body.page main article section.cont_area.cont_area_kodawari {
border-top: 1px solid #ddd;
}

body.page main article section.cont_area.cont_area_kodawari .subttl {
text-align: center;
font-weight: bold;
font-family: 'Poppins', sans-serif;
margin: 20px 0 5px;
letter-spacing: 5px;
font-size: 1.4rem;
}

body.page main article section.cont_area.cont_area_kodawari h3 {
font-size: 4.8rem;
line-height: 1.1;
text-align: center;
margin: 0;
padding-bottom: 30px;
position: relative;
}

body.page main article section.cont_area.cont_area_kodawari h3:after {
position: absolute;
bottom: 0;
left: calc(50% - 35px);
content: "";
display: block;
width: 70px;
height: 3px;
background-color: #000;
}

body.page main article section.cont_area.cont_area_kodawari h3 span {
font-weight: bold;
}

body.page main article section.cont_area.cont_area_kodawari p {
text-align: left;
margin: 40px 20px 40px;
}

/* メニュー */
body.page main article ul#menu_tab {
display: flex;
width: 100%;
flex-direction: row;
justify-content: space-between;
align-items: center;
align-content: stretch;
margin: 0 auto;
}

body.page main article ul#menu_tab li {
background: #f4f4f0;
flex: auto;
text-align: center;
padding: 20px;
width: 50%;
}

body.page main article ul#menu_tab li:hover {
text-decoration: underline;
cursor: pointer;
}

body.page main article ul#menu_tab li.active:hover {
text-decoration: none;
cursor: inherit;
}

body.page main article ul#menu_tab li.active {
background: #000;
color: #fff;
}

body.page main article ul#menu_tab li div.menu_tab_txt_b {
font-size: 2.4rem;
}

body.page main article ul#menu_tab li div.menu_tab_txt_s {
font-size: 1.2rem;
white-space: nowrap;
}

body.page main article section.cont_area.cont_area_menu {
width: 100%;
margin: 0 auto;
display: none;
}

body.page main article section.cont_area.cont_area_menu.active {
display: block;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li {
margin: 0 20px;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li a {
color: #fff;
position: relative;
font-size: 1.2rem;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li a:hover {
color: #ff6;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li a:before {
display: block;
content: "";
position: absolute;
top: 55%;
right: -20px;
width: 0;
height: 0;
margin-top: -5px;
border: 7px solid transparent;
border-top: 7px solid #fff;
}

body.page main article section.cont_area.cont_area_menu ul#menu_pan_nav li a:hover:before {
border-top: 7px solid #ff6;
}

body.page main article section.cont_area.cont_area_menu .cont_area_menu_item h3 {
font-size: 3.4rem;
text-align: center;
margin: 30px 0 20px;
padding-top: 30px;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul {
display: flex;
flex-wrap: wrap;
width: 100%;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul li {
width: 50%;
text-align: center;
margin-bottom: 40px;
cursor: pointer;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul li:hover {
color: #ff6;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul li .item_img {
padding: 0 20px;
}

body.page main article section.cont_area.cont_area_menu#menu_pan .cont_area_menu_item ul li .item_name {
font-size: 1.4rem;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul {
display: flex;
flex-wrap: wrap;
width: 100%;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li {
width: 100%;
text-align: center;
margin-bottom: 40px;
cursor: pointer;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li:hover {
color: #ff6;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li .item_img {
text-align: center;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li .item_img img {
width: 200px;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li.item_coffee {
border-top: 1px solid #666;
border-bottom: 1px solid #666;
margin: 0 20px 40px;
padding: 30px;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li.item_coffee .item_name_s {
font-size: 1.2rem;
}

body.page main article section.cont_area.cont_area_menu#menu_drink .cont_area_menu_item ul li.item_coffee .item_coffee_txt {
font-size: 1.2rem;
margin-top: 20px;
}

/* 店舗情報 */
body.page main article section.cont_area#cont_area_top {
padding-bottom: 40px;
}

body.page main article section.cont_area.cont_area_shop {
padding-top: 0;
}

body.page main article section.cont_area.cont_area_shop .shop_pref {
width: 100%;
margin: 0;
}

body.page main article section.cont_area.cont_area_shop .shop_pref .shop_pref_ttl {
background: #000;
color: #fff;
padding: 10px 15px;
margin: 40px 0 20px;
font-size: 2.0rem;
}

body.page main article section.cont_area.cont_area_shop .shop_pref ul li {
float: left;
display: inline-block;
margin: 0 20px 10px;
}

body.page main article section.cont_area.cont_area_shop .shop_pref ul li a {
text-decoration: underline;
}

body.page main article section.cont_area.cont_area_shop .shop_pref ul li a:hover {
text-decoration: none;
}

body.page main article section.cont_area.cont_area_shop .shop_info {
margin: 0 10px;
}

body.page main article section.cont_area.cont_area_shop .shop_info table {
width: 100%;
}

body.page main article section.cont_area.cont_area_shop .shop_info table caption {
font-size: 3.0rem;
margin: 60px 0 20px;
}

body.page main article section.cont_area.cont_area_shop .shop_info table thead {
display: none;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr {
border-bottom: 1px solid #ddd;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tr th,
body.page main article section.cont_area.cont_area_shop .shop_info table tr td {
padding: 0;
display: block;
}

body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr th {
padding: 15px 0 5px;
font-weight: bold;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-top: 3px;
	margin-bottom: 10px;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder span {
	display: inline-block;
	line-height: 0;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder span img {
	width: 60px;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder span + span {
	margin-left: 7px;
}
body.page main article section.cont_area.cont_area_shop .shop_info table tbody tr td.shop_otherinfo .netorder span.wolt img {
	height: 25x;
	width: 25px;
}




/* FC募集 */
body.page main article section.cont_area.cont_area_fc {
margin: 0 10px;
}

body.page main article section.cont_area.cont_area_fc h3 {
font-size: 3.4rem;
text-align: center;
margin: 0 0 20px;
}

body.page main article section.cont_area.cont_area_fc ol li {
font-size: 2.4rem;
color: #fff;
padding: 8px 0 10px;
margin-bottom: 40px;
text-align: center;
background: #979797;
position: relative;
}

body.page main article section.cont_area.cont_area_fc ol li.open_orange {
background: #dd6321;
}

body.page main article section.cont_area.cont_area_fc ol li.open_red {
background: #e00;
}

body.page main article section.cont_area.cont_area_fc ol li::after {
display: block;
content: "";
position: absolute;
bottom: -42px;
left: 50%;
width: 0;
height: 0;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #979797;
}

body.page main article section.cont_area.cont_area_fc ol li.kaiten::after {
border: none;
display: none;
}

body.page main article section.cont_area.cont_area_fc .fc_table {
margin: 0 0 30px;
}

body.page main article section.cont_area.cont_area_fc .fc_table table {
width: 100%;
}

body.page main article section.cont_area.cont_area_fc .fc_table.fc_table_fckamehiyou table {}

body.page main article section.cont_area.cont_area_fc .fc_table.fc_table_model table {}

body.page main article section.cont_area.cont_area_fc .fc_table table caption {
font-weight: bold;
}

body.page main article section.cont_area.cont_area_fc .fc_table table th,
body.page main article section.cont_area.cont_area_fc .fc_table table td {
padding: 4px 10px 2px;
}

body.page main article section.cont_area.cont_area_fc .fc_table table thead {
border-top: 2px solid #7a7a78;
border-left: 2px solid #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table thead th:first-child {
border-right: 2px solid #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table thead th {
border-right: 2px solid #7a7a78;
border-bottom: 2px solid #7a7a78;
background: #d0d0cc;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody th {
border-left: 1px solid #7a7a78;
border-right: 2px solid #7a7a78;
border-bottom: 1px dotted #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody td {
border-right: 1px solid #7a7a78;
border-bottom: 1px dotted #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.bd_line th,
body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.bd_line td {
border-bottom: 1px dotted #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.bd_2pxsolid th,
body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.bd_2pxsolid td {
border-bottom: 3px double #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.summary th {
text-align: center;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.summary th,
body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.summary td {
border-bottom: 1px solid #7a7a78;
}

body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.royality th,
body.page main article section.cont_area.cont_area_fc .fc_table table tbody tr.royality td {
border-bottom: 1px solid #7a7a78;
}

body.page main article section.cont_area.cont_area_fc h3.fc_contact_ttl {
line-height: 1;
}

body.page main article section.cont_area.cont_area_fc h3 span.fc_subtxt {
font-size: 1.2rem;
}

body.page main article section.cont_area.cont_area_fc .fc_contact {
border: 1px solid #000;
padding: 30px;
text-align: center;
}

body.page main article section.cont_area.cont_area_fc .fc_contact .fc_contact_txt {
margin-top: 10px;
}











/* footer */
#footer {
background: #fff;
text-align: center;
}
#footer img {
width: 100%;
}
#footer .corporate {
	padding: 20px 0;
	font-size: 10px;
}

#footer .logo img {
width: 150px;
}
#footer .copyright {
font-size: 12px;
color: #666;
	padding-bottom: 10px;
}



}