@charset 'utf-8';
/*
Foundation
*/
html {
font-size: 62.5%;
font-family:"游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
width: 100%;
overflow-x: hidden;
line-height: normal;
}
body {
font-size: 1.4em;
}
* {
margin: 0;
padding: 0;
vertical-align: top;
box-sizing: border-box;
}
*:hover {
}
a, span {
display: inline-block;
text-decoration: none;
color: #111;
transition: 0.2s linear all;
}
a:hover {
opacity: 0.7;
transition: 0.2s linear all;
}
h1 {
font-size: 0.8em;
font-weight: normal;
}
iframe {
border: none;
}
table {
border-collapse: collapse;
}
.center_box {
width: 100%;
max-width: 1000px;
margin: 0 auto;
}
.ul_box {
list-style-type: none;
padding: 0;
}
.flex_center {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.flex_left {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}
.flex_right {
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
}
.cb {
clear: both;
}
.hidden {
display: none;
}
.pc {
display: block;
}
.pc.inline {
display: inline-block;
}
.sp {
display: none;
}
/*
Modules (inner page title)
*/
main {
margin: 2em 0;
}
main h2 {
margin-bottom: 1em;
}
/*
Modules (header top)
*/
.page_header {
}
.header_top {
background-size: contain;
/*border-top: 4px #006699 solid;*/
}
.header_top .header_top_left {
float: left;
/* margin: 1.5em 1em 0; */
margin: 0 10px;
}
.header_top .header_top_left a {
padding: 0.35em 0;
height: 55px;
}
.header_top .header_top_left img {
height: 100%;
}
.header_top .header_top_right {
float: right;
width: calc(100% - 390px);
/*
line-height: 36px;
padding-top: 9px;
margin: 0.35em 0;
*/
margin: 0 10px;
line-height: 55px;
text-align: right;
display:table-cell;
}
.header_top .header_top_right a {
/*
float: right;
*/
height: 30px;
line-height: 30px;
margin: 0 1%;
padding: 0 10px;
vertical-align: middle;
}
.header_top .header_top_right a span {
vertical-align: middle;
font-size: 0.8em;
}
.header_top .header_top_right a.contact {
background: url(../images/index/next.jpg) right center transparent no-repeat;
background-size: cover;
width: 150px;
text-align: left;
cursor: pointer;
}
.header_top .header_top_right a.contact span {
width: calc(100% - 45px);
text-align: center;
color: #fff;
}
.header_top .header_top_right a:hover {
background-color: #354D69;
color: #fff;
}
.header_top .header_top_right a:hover span {
color: #fff;
}
/*
Modules (main_nav)
*/
.main_nav {
margin: 2em 0;
}
.main_nav table {
}
.main_nav table td {
width: 14.2857%;
vertical-align: middle;
}
.main_nav a {
width: 100%;
text-align: center;
padding: 0.75em 0;
line-height: 1em;
font-size: 1em;
font-weight: bold;
}
.main_nav a:hover {
background: url(../images/main_nav/bg002_10.gif) top left repeat;
}
.main_nav a.reservation,
.main_nav a.reservation span {
background-color: #FA8A00;
color: #fff;
}
.main_nav a.reservation:hover {
background: #FA8A00;
}
/*
.main_nav a:hover > span {
color: #fff;
}
*/
/*
.main_nav table td:nth-child(1) {
font-weight: bold;
border-left: none;
}
.main_nav table td:nth-child(5) {
border-right: none;
}
*/
/*
Modules (main_nav)
*/
.sp_nav {
display: none;
position: fixed;
top: 0;
width: 100%;
z-index: 200;
opacity: 0.95;
background: #fff;
overflow: none;
}
.sp_nav .top {
width: 100%;
margin: 0 auto;
box-sizing: border-box;
text-align: right;
border-bottom: 1px #111 solid;
}
.sp_nav .top li {
line-height: 2em;
box-sizing: border-box;
}
.sp_nav .top li.logo {
width: 59%;
float: left;
text-align: left;
padding: 0.5em 0 0.5em 0.5em;
color: #473200;
font-weight: bold;
font-size: 1.5em;
}
.sp_nav .top li.button {
width: 39%;
float: right;
text-align: right;
padding: 0.5em 0.5em 0.5em 0;
}
.sp_nav .top li a {
padding: 0;
line-height: 2em;
}
.sp_nav .top li a:hover {
background: transparent;
}
.sp_nav .top li.logo a {
width: 100%;
}
.sp_nav .top li.logo a img {
max-width: 100%;
max-height: 40px;
vertical-align: middle;
}
.sp_nav .top li a.top_drawer_button {
margin-top: 0.2em;
padding: 0.2em 0.5em;
z-index: 3;
border: 1px solid #333;
text-decoration: none;
text-transform: uppercase;
border-radius: 4px;
background: #fff;
color: #333;
}
.sp_nav .top li a.top_drawer_button .mark {
font-size: 2em;
vertical-align: middle;
}
.sp_nav .top li a.top_drawer_button .text {
vertical-align: middle;
}
.sp_nav .top li a.top_drawer_button:hover,
.sp_nav .top li a.top_drawer_button:hover .mark,
.sp_nav .top li a.top_drawer_button:hover .text {
background: #FA8A00;
color: #fff;
}
.top_drawer_list {
/*
display: flex;
flex-direction: row;
flex-wrap: wrap;
*/
height: 0px;
overflow: hidden;
margin: 0 auto;
box-sizing: border-box;
border-bottom: 1px #111 solid;
transition: height 0.3s;
}
.top_drawer_list.active {
height: 372.4px;
transition: height 0.3s;
}
.top_drawer_list li {
float: left;
width: 50%;
height: 3.8em;
line-height: 3.8em;
box-sizing: border-box;
background: #fff;
border-bottom: 1px #999 solid;
text-decoration: none;
color: #333;
font-size: 14px;
}
.top_drawer_list li.full_width {
width: 100%;
box-sizing: border-box;
}
.top_drawer_list li a {
width: 100%;
padding: 0 0 0 1em;
box-sizing: border-box;
color: #333;
}
.top_drawer_list li a span {
line-height: 1.4em;
vertical-align: middle;
}
.top_drawer_list li a:hover,
.top_drawer_list li a:hover span {
background: #FA8A00;
color: #fff;
}
.top_drawer_list li a.reservation,
.top_drawer_list li a.reservation span {
background-color: #FA8A00;
color: #fff;
}
/*
Modules (side nav)
*/
nav.side {
position: fixed;
top: 141px; /* topはassets/scripts/jquery.scroll_top_fixed.jsにも設定があるので同時に変更が必要 */
left: 0;
width: 100px;
z-index: 1000;
font-size: 0;
background-color: #473200;
}
nav.side a {
width: 100px;
height: 100px;
background: center center transparent no-repeat;
background-size: contain;
}
/*
nav.side a.icon_shop {
background-image: url(../images/side_nav/icon_shop.png);
}
nav.side a.icon_fare {
background-image: url(../images/side_nav/icon_fare.png);
}
nav.side a.icon_inquiry {
background-image: url(../images/side_nav/icon_inquiry.png);
}
nav.side a.icon_campaign {
background-image: url(../images/side_nav/icon_campaign.png);
}
*/
/*
Modules (content title)
*/
h3 {
padding-bottom: 0.2em;
line-height: 1.4em;
vertical-align: text-bottom;
font-size: 1.4em;
/* font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; */
color: #354D69;
}
h4 {
font-size: 1.2em;
}
/*
h3 img {
width: 1.6em;
margin: 0 0.3em;
vertical-align: text-bottom;
}
h3 span {
font-size: 0.7em;
color: #7EC7ED;
vertical-align: text-bottom;
line-height: 1em;
margin-left: 0.5em;
}
*/
/*
Modules (footer top)
*/
.footer_top {
padding: 1em 0;
background-color: #473200;
font-size: 0.9em;
}
.footer_nav_column_a {
float: left;
/*width: 25%;*/
/*padding: 1%;*/
}
.footer_nav_column_b {
float: left;
width: 28%;
padding: 1%;
}
.footer_top a,
.footer_top span.only {
width: 100%;
padding: 0.3em 0;
}
.footer_top a  span{
color: #FFF;
}
.footer_top a:hover span {
color: #fff;
text-shadow: 3px 3px 3px #0c0800;
}
.footer_top ul {
padding-left: 15px;
}
/*
Modules (footer bottom)
*/
.footer_bottom {
padding: 1em 0;
text-align: center;
font-size: 0.8em;
}
.footer_logo {
float: right;
/* width: 320px; */
/* height: 48px; */
margin: 0 10px;
}
.footer_logo a {
background: url(../images/common/rogo2.png) center center transparent no-repeat;
/* background-size: cover; */
background-size: contain;
width: 320px;
/* max-width: 360px; */
height: 48px;
}
.footer_info {
float: right;
/* width: calc(100% - 340px); */
/* height: 48px; */
line-height: 24px;
font-size: 0.9em;
}
.footer_info td.branch_office {
width: 110px;
}
/*
Utilities (show/hide)
*/
.hide {
display: none;
}
/*
Utilities (pager)
*/
.pager {
text-align: center;
margin: 2em 0;
}
.pager > span,
.pager > a {
width: 2.5em;
height: 2.5em;
line-height: 2.5em;
border-radius: 50%;
margin: 0 0.25em;
text-align: center;
}
.pager > span {
color: #666;
border: 1px #aaa solid;
}
.pager a {
background-color: #F8961D;
color: #fff;
border: 1px #F8961D solid;
}
.pager a span {
color: #fff;
}
.pager a:hover {
background-color: #F8961D;
border: 1px #F8961D solid;
}
.pager a:hover span {
color: #111;
}
