*{ box-sizing: border-box; }
html { font-size: 62.5%; }

body{
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	font-feature-settings: "palt";
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: #444;	
	font-size: 1.5rem;
	font-style: normal;
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: 0.08em;
	text-align: justify;
}

.mincho{ font-family: "游明朝", YuMincho, yu-mincho-pr6n, serif; font-weight: 500; }

/**** 
adobe使用フォント
font-family: yu-mincho-pr6n, sans-serif;
font-weight: 400;
***/

a{ transition: .5s; }
a:hover{ opacity: .7; }
br{ line-height: inherit; }
p{ line-height: 2; }
span, a, strong, small{ color: inherit; font-size: inherit; font-family: inherit; font-weight: inherit; letter-spacing: inherit; }

.wrap{ width: 800px; margin: 0 auto; position: relative; }
.wrap.midium{ width: 900px; }
.row{ display: flex; justify-content: space-between; }

.linkwrap{ width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 10; }
.body-wrap{ overflow: hidden; position: relative; padding-top: 9rem; }

.sp{ display: none; }

header{ width: 100%; background: #fff; position: fixed; top: 0; left: 0; z-index: 9982; }
header .inner{ width: 1350px; height: 9rem; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
header .inner > .logo{ line-height: 0; }
header nav{ margin-left: auto;}
header nav .gnav{ display: flex; }
header nav .gnav li{ font-size: 1.1rem; color: #0058a7;line-height: 1.4; letter-spacing: 0; }
header nav .gnav li a small{ font-size: .8rem;  }
header nav .gnav li + li{ margin-left: 1.8rem; }
header .contact-link{ display: table; line-height: 0; margin-left: 1.8rem; }

footer .bg{ background: url(../images/index/webp/footer-bg01.webp) no-repeat center/cover; color: #fff; padding: 9rem 0 10rem; position: relative; }
footer .bg.hakata{ background-image: url(../images/index/webp/footer-bg02.webp); }
footer .bg.hakata.tenjin{ background-image: url(../images/index/webp/footer-bg03.webp); }
footer .bg + .bg:before{ content: ''; width: 100%; height: 2px; background: url(../images//index/border01.png) repeat-x left top/contain; position: absolute; top: -1px; left: 0; }
footer .bg .wrap{ flex-wrap: wrap }
footer .bg .wrap > picture{ display: block; width: 100%; }
footer .bg .logo{ display: block; margin: 0 auto 5rem; }
footer .bg .left{ width: 37.5rem; }
footer .bg .left p{ font-size: 1.4rem; margin-bottom: 2rem; }
footer .bg .left iframe{ display: block; width: 100%; height: 27rem; }
footer .bg .right{ width: 37.5rem; }
footer .bg .right .hour-table{ width: 100%; table-layout: fixed; font-size: 1.4rem; border-bottom: solid 1px rgba(255, 255, 255, .3); margin-bottom: 1.2rem; }
footer .bg .right .hour-table th{ width: 14rem; vertical-align: middle; padding-left: 2.5rem; }
footer .bg .right .hour-table td{ text-align: center; vertical-align: middle; }
footer .bg .right .hour-table thead{ background: rgba(255, 255, 255, .3); font-weight: 700; }
footer .bg .right .hour-table thead th{ height: 3.6rem; }
footer .bg .right .hour-table tbody th{ height: 4.2rem; }
footer .bg .right .hour-table tr > *:last-child{ width: 5rem; padding-right: 2rem; }
footer .bg .right .hour-table + p{ font-size: 1.2rem; opacity: .7; line-height: 1.6; margin-bottom: 2.6rem; }
footer .bg .right a.resv{ width: 31.2rem; height: 6rem; background: url(../images/common/webp/footer-resv01.webp) #fff no-repeat left top/auto 100%; padding-left: 12.6rem; display: flex; align-items: center; font-size: 1.6rem; color: #0058a1; position: relative; margin-bottom: 3rem; }
footer .bg.hakata .right a.resv{ background-image: url(../images/common/webp/footer-resv02.webp); }
footer .bg.tenjin .right a.resv{ background-image: url(../images/common/webp/footer-resv03.webp); }
footer .bg .right a.resv span{ position: relative; padding-right: 1.5rem; }
footer .bg .right a.resv span:after{ content: ''; width: 0; height: 0; border-style: solid; border-width: 6px 0 6px 6px; border-color: transparent transparent transparent #0058a1; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
footer .bg .right .tel-free{ display: table; font-size: 2.5rem; padding-left: 4.2rem; line-height: 1.6; background: url(../images/common/icon-free01.png) no-repeat left center/3.5rem; }
footer .bg .right .tel-free:after{ content: '市内限定'; font-size: 1.2rem; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; border: solid 1px; display: inline-block; padding: .2rem .5em; vertical-align: text-bottom; margin-left: 2rem; }
footer .bg .right .tel{ display: table; font-size: 2.5rem; padding-left: 4.2rem; line-height: 1.6; background: url(../images/common/icon-tel01.png) no-repeat left .5rem center/2.5rem; }
footer .bg .right .sns{ display: flex; justify-content: flex-end; align-items: center; margin-top: 3rem; }
footer .bg .right .sns li + li{ margin-left: 1.5rem; }

footer .loop-slide .swiper-wrapper{ transition-timing-function: linear; }
footer .loop-slide li{ line-height: 0; }
footer .loop-slide li img{ width: 100%; }

footer .copy{ display: block; text-align: center; font-size: 1.1rem; padding: 1.4em 0; }

.bottom-navi { width: 100%; height: 70px; background-color:#0058a1; display:flex; position:fixed; bottom:0; left:0; z-index:9978;}
	.bottom-navi li { width: calc(100% / 2); height: 70px; float: left; display: flex; justify-content: center; align-items: center; text-align:center; font-size:1.5rem; letter-spacing:0.08rem; color:#FFF; line-height:2rem; border-top: solid 1px rgba(255, 255, 255, .5); font-weight: bold; letter-spacing: 0;}
	.bottom-navi li:first-child:before{ content:""; background:url(../images/common/icon-tel01.png) no-repeat left .5rem center/2.3rem; display:table; width:3rem; height:3rem; margin-right:1rem;  position: absolute; left: 18vw; }
	.bottom-navi li:last-child:before{ content:""; background: url(../images/common/icon-resv01-2.png) no-repeat center left/2.2rem; display:table; width:3rem; height:3rem; margin-right:0.2rem;  position: absolute; left: 67vw;}
    .bottom-navi li:last-child{ background:#f6e890; color: #0058a1;}
    .bottom-navi li span{ display: block; width:100%; height: 100%; padding-top: 15px;}
	.bottom-navi li:first-child { border-right: solid 1px rgba(255, 255, 255, .5);}
	.bottom-navi li a { display: block;}
	.bottom-navi.active {display: none;}
	.bottom-link { width: calc(100% / 2); display: none; position: fixed; bottom: 60px;}
	.bottom-link span { margin: 0; width: 100%; height: 55px; background-color:#6091c2; display: block; text-align:center; padding-left: 0!important; padding-bottom: 1rem!important;}
	.bottom-link span:nth-child(-n+2) {border-bottom: 1px solid #ccc;}
	.bottom-link span a { width: 100%; line-height: 1.5; font-size: 16px; color: #fff; display: block;}
    .bottom-link span a small{font-size: 10px;}
    .bottom-link span a small strong{font-size: 13px!important; font-weight: 800!important;}

@media(max-width: 768px){
	html{ font-size: 2.66vw; }
	body{ font-size: 1.5rem; letter-spacing: 0.04em; }
	p{ line-height: 2; }

	.pc{ display: none !important; }
	.sp{ display: initial; }

	.body-wrap{ padding-top: 5.5rem; }

	.wrap{ width: 100%; padding-left: 1.75rem; padding-right: 1.75rem; }
    .wrap.wrap2{ padding-left: 0; padding-right: 0;}
	.wrap.midium{ width: 100%; }
	.row{ flex-wrap: wrap; }

	header .inner{ width: 100%; height: auto; flex-wrap: wrap; position: relative; }
	header .inner .menu-btn{ width: 3.8rem; height: 2.75rem; position: absolute; top: 1.4rem; right: 1.9rem }
	header .inner .menu-btn span{ width: 100%; height: .5rem; border-radius: .25rem; background: #3664a0; position: absolute; left: 0; transition: .5s; }
	header .inner .menu-btn span:nth-of-type(1){ top: 0; }
	header .inner .menu-btn span:nth-of-type(2){ top: 50%; transform: translateY(-50%); }
	header .inner .menu-btn span:nth-of-type(3){ bottom: 0; }
	header .inner .menu-btn.active span:nth-of-type(1){ top: 50%; transform: translateY(-50%) rotate(45deg); }
	header .inner .menu-btn.active span:nth-of-type(2){ opacity: 0; }
	header .inner .menu-btn.active span:nth-of-type(3){ bottom: 50%; transform: translateY(50%) rotate(-45deg); }
	header .inner h1{ width: 17.7rem; height: 5.6rem; margin: 0 auto; display: flex; align-items: center; }
	header .inner h1 a{ display: block; line-height: 0; }
	header .inner h1 img{ width: 100%; }
	header nav{ width: 100%; background: #3664a0; display: none; }
	header nav .gnav{ display: block; }
	header nav .gnav li{ font-size: 1.6rem; color: #fff; text-align: center; line-height: 1.4; }
    header nav .gnav li a small{font-size: 1rem;}
    header nav .gnav li a small strong{font-size: 1.6rem;}
	header nav .gnav li + li{ margin-left: 0; border-top: 1px dotted #fff; }
	header nav .gnav li a{ display: block; line-height: 2.5; }
	header .contact-link{ position: absolute; top: 1.9rem; right: 1.25rem; width: 2.4rem; }
	header .contact-link img{ width: 100%; }

	footer{ padding-bottom: 5.5rem; }
	footer .bg{ padding: 4.5rem 0 5rem; }
	footer .bg .logo{ margin-bottom: 3rem; }
	footer .bg.hirao .logo{ width: 28.85rem; }
	footer .bg.hakata .logo{ width: 34rem; }
	footer .bg .left{ width: 100%; margin-bottom: 3.5rem; }
	footer .bg .left iframe{ height: 24.5rem; }
	footer .bg .right{ width: 100%; }
	footer .bg .right a.resv{ font-size: 1.7rem; height: 6.5rem; width: 100%; }
	footer .bg .right .sns{ justify-content: center; }
	footer .bg .right .sns li img{ width: 1.9rem; }
	footer .bg .right .sns li + li{ margin-left: 2.8rem; }
	footer .copy{ letter-spacing: 0; padding: 1em 0; }
	
	.float-btn{ width: 100%; display: flex; position: fixed; bottom: 0; left: 0; z-index: 9978; background: #0058a1; }
	.float-btn li{ width: 50%; font-size: 1.3rem; color: #fff; }
	.float-btn li + li{ border-left: solid 1px rgba(255, 255, 255, .5); }
	.float-btn li a{ display: flex; width: 100%; height: 4.5rem; justify-content: center; align-items: center; }
	.float-btn li a span{ padding-left: 2.5rem; background: url(../images/common/icon-resv01.png) no-repeat center left/1.35rem; }
    .bottom-navi li span{ padding-left: 30px;}
    .bottom-navi li:first-child:before{ left: 5vw;}
    .bottom-navi li:last-child:before{ left: 53vw;}
    .bottom-navi li{ font-size: 14px;}

}