/*
KINHAKU

/*----------------------------------------------
NAV
------------------------------------------------*/
/*a {
layout.css
color:#202020;
point color:#019bbc
point color:rgb(201,194,177)#c9c2b1
transition: all 0.25s;
text-decoration: none;
}*/


/*PCメニュー*/
#header {
position: fixed;
top:40px;
left:70px;
right:70px;
bottpm:20px;
display: flex;
padding: 5px 0px 4px 10px;
background-color: rgba(255,254,254,0.890);
border-radius: 10px;
}

#header h1 {
margin-right: auto;
}
h1.logo {
max-width: 134px;
display:block;
margin:0px;
padding:17px 0px 14px 14px;
}
h1.logo img{
width: 134px;
}
#header #nav {
width: auto;
margin-top: 10px;
margin-left: 10px;
margin-right: 0;
display: flex;
flex-flow: row nowrap;
align-items: right;
list-style: none;

}
#header #nav ul{
width: 100%;
display: table;
table-layout:fixed; 
}

#header #nav li {
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;
list-style: none;
font-size: .94rem;
letter-spacing: 0.06em;
margin: 10px 27px 1px 0;
line-height: 160%;
white-space: nowrap;
}
#nav li a {
color:#2b2b2b;
text-decoration: none;
 pointer-events: auto;
}

#nav li a:hover{
color:#0091B1 !important;
text-decoration: none !important;
}

/* 予約 お問い合わせ */
#nav li .reserve a {
position: relative;
margin-top:5px !important;
margin-right: -20px;
font-size: 90%;
width: auto;
z-index: 99999;
list-style: none;
color:#fff !important;
background-color: #019bbc;
padding: 10px 10px 10px;
white-space: nowrap;
border-radius: 50px;
}
#nav li .reserve a:hover {
color:#8DF1FC !important;
background-color: #04757B !important;
}




/* 02 */
/* --------- 1200px ------------*/
@media screen and (max-width: 1200px) {
#header {
position: fixed;
top:40px;
left:30px;
right:30px;
bottpm:20px;
}
h1.logo {
max-width: 130px;
display:block;
margin:0px;
padding:17px 0 14px 14px;
}
h1.logo img{
width: 130px;
}

#header #nav li {
font-family: "Funnel Sans", sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;
list-style: none;
font-size: .843rem;
letter-spacing: 0.07em;
margin: 10px 20px 3px 0;
}
}

/* 03 */
/* --------- 1100px ------------*/
@media screen and (max-width: 1100px) {
#header {
position: fixed;
top:40px;
left:25px;
right:25px;
bottpm:20px;
}
h1.logo {
max-width: 112px;
display:block;
margin:0px;
padding:17px 0 14px 8px;
}
h1.logo img{
width: 110px;
}

#header #nav li {
font-family: "Funnel Sans", sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;
list-style: none;
font-size: .827rem;
letter-spacing: 0.06em;
margin: 10px 17px 1px 0;
line-height: 150%;
}
}



/* 04  MOBILE*/
/* --------------- 990px ---------------*/
@media screen and (max-width: 990px) {
#header {
position: fixed;
top:40px;
left:30px;
right:40px;
bottpm:20px;
}
h1.logo {
margin:0px;
padding:15px 5px 15px 12px;
}
/* bager menu */
#header #nav {
margin-left:50px;
/*transition: all 0.2s;*/
overflow-y: auto;
padding: 30px 20px 0px 30px;
width: 90%;
height: 100vh;
z-index: 8000;
top: -10px;
background-color:rgba(252,248,248,0.92);
position: fixed;
flex-direction: column;
align-items: baseline;
border-top-left-radius:20px;
border-bottom-left-radius:20px;
}
#header #nav li {
width: 100%;
font-size: .96rem;
padding: .2rem 0.5rem .2rem;
text-indent: 1em;
color: #2D2B2B;
text-align: left;
}
#header #nav li a{
width: 100%;
font-size: .9375rem;
padding: .6rem .10rem .6rem !important;
text-indent: 1em;
color: #2D2B2B;
text-align: left;
}
#header #nav li:last-of-type{
border-bottom: none;
text-indent: 0em;
margin: 35px 0 5px;
}

/* 予約 お問い合わせ */
#header #nav li .reserve a {
font-size: 1rem !important;
padding: 10px 20px 11px 20px !important;
}


/* HAMBURGER */
#header .nav_btn {
width: 44px;
height: 44px;
top: 24px;
right:30px;
cursor: pointer;
position: absolute;
z-index: 9000;
}

.hamburger_line {
transition: all 0.3s;
width: 48px;
height: 1.6px;
left: 5px;
background-color: #575757;
position: absolute;
}
.hamburger_line1 {
top: 5px;
}
.hamburger_line2 {
top: 13px;
}
.hamburger_line3 {
top: 22px;
}
.nav_bg {
opacity: 0;
transition: all 0.3s;
width: 50vw;
height: 100vh;
z-index: 280;
top: 0;
left:0;
visibility: hidden;
cursor: pointer;
position: fixed;
}

/* 全面ナビCSS */
.nav_open #header #nav {
padding-top:50px;
right: 0;
}
.nav_open .nav_bg {
opacity: 0.9;
visibility: visible;
}
.nav_open .hamburger_line1 {
transform: rotate(45deg);
top: 15px;
}
.nav_open .hamburger_line2 {
width: 0;
left: 50%;
}
.nav_open .hamburger_line3 {
transform: rotate(-45deg);
top: 15px;
}

/* 予約 お問い合わせ */
.reserve a {
position: relative;
margin-top:5px !important;
font-size: 0.9rem !important;
width: auto;
z-index: 88888;
list-style: none;
color:#fff;
background-color: #019bbc;
padding: 30px 30px 30px !important;
}

.reserve a:hover {
background-color: #627FD4 !important;
color: #FFF !important;
}
}

/* ------ SP 767px ------*/

@media (max-width: 767px) {
#header {
top:30px;
left:25px;
right:25px;
}
h1.logo {
margin:0px;
padding:14px 5px 10px 12px;
}
#header #nav li {
width: 100%;
font-size: .92rem;
padding: .2rem 0.5rem .2rem;
text-indent: 1em;
color: #2D2B2B;
text-align: left;
}
#header #nav li a{
width: 100%;
font-size: .9375rem;
padding: .4rem .10rem .4rem !important;
text-indent: 1em;
color: #2D2B2B;
text-align: left;
}

/* 予約 お問い合わせ */
.reserve a {
position: relative;
font-size: 0.86rem !important;
}
}


/*----------------------------------------------
ドロップボタン
------------------------------------------------*/
#nav {
list-style: none;
}

.menu-item {
text-decoration-line: none;
list-style: none;
position: relative;
pointer-events: auto;
display: block;
}
.menu-item a{
pointer-events: auto;
z-index: 8000;
}
.menu-link {
display: block;
text-decoration: none;
padding: 1px 2px;
/*-transition: background-color 0.1s ease;*/
}

.menu-link:hover {
background-color: #C9EEFC;
padding: 1px 2px;
}

/* Green Space 全体 */
.dropdown {
position: absolute;
top: 120%;
left: 0;
background-color: #5AD0D7;
list-style: none;
margin: 0;
padding: 0;
min-width: 180px !important;
opacity: 0;
line-height:170% ;
visibility: hidden;
/*transform: translateY(-5px);*/
transition: all 0.3s ease;
}
.has-dropdown:hover .dropdown {
opacity: 1;
visibility: visible;
}
/* Green Space LIST　項目 */
.dropdown li{
position: relative;
min-width: 180px;
height: 35px;
border-bottom: 1px solid #ffffff;
/*transform: translateY(-5px);*/
}
.dropdown　li:first-child{
margin-top: 0px;
}
.dropdown li:last-child{
margin-bottom: 0;
border-bottom: none;
}
.dropdown li a {
display: block;
min-width: 180px;
height: 35px;
color: #202020;
text-decoration: none;
line-height:180%;
padding: 5px 5px 5px 14px ;
margin: -12px 0px 0 0;
transition: background-color 0.2s ease;
z-index: 99999;
}

.dropdown li a:hover {
display: block;
min-width: 180px;
height: 42px;
line-height:180% ;
padding: 5px 5px 5px 14px ;
margin-top:-12px;
color: #ffffff !important;
background-color:  #C9EEFC;
} 


/*  MOBILE*/
/* --------------- 989px ---------------*/
@media screen and (max-width: 989px) {
.navbar {
padding: 0;
margin:0 auto;
text-align: center;
}
}
#nav{
margin:0 auto;
padding-left: 100px !important;
text-align: center;
}
/* --------------- 767px ---------------*/
@media (max-width: 767px) {
#nav{
margin:0 auto;
padding-left: 40px !important;
text-align: center;
}
}
/* --------------- 989px ---------------*/
@media screen and (max-width: 989px) {
.menu-item li{
display: block;
text-decoration-line: none;
list-style: none;
position: relative;
padding: -5px 20px 0px 10px !important;
}
.menu-item2 li{
display: block;
text-decoration-line: none;
list-style: none;
position: relative;

padding: -5px 10px -5px 30px !important;
margin-left:10px !important;
}
.indent2{
text-indent: 2em !important;
}
.dropdown-link2 {
display: block;
color: #202020;
text-decoration: none;
margin-top:-15px;
padding:-5px 30px 0px 10px !important;
border-bottom: 0.5px dashed #91B5BC;
transition: background-color 0.2s ease;
}
.dropdown-link2:hover {
color: #ffffff !important;
padding:-5px 30px 0px 10px !important;
background-color:  #C9EEFC;
} 

.dropdown li:last-child .dropdown-link {
margin-bottom: -10px;
border-bottom: none;
}
}