@charset "UTF-8";

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　初期設定　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
*{
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
}

body {
background:#977c56;
width:100%;
}
.wrapper {
overflow:hidden;
}

footer {
background:#FFF;
font-size:.9em;
}


/* link style
----------------------------
この順番　link viited hover active じゃないと効かなくなる */

/*a:link {
	color: #74000f;
	text-decoration: none;
}
dropdown-menu に影響するので消している。他に何か影響が出たら戻す */
a:visited {
	color: #000;
}
a:hover {
	color: #ff0000;
}
a:active {
	color: #ff0000;
}


.bn_banner img a:active, .bn_banner img a:hover {
	text-decoration:none;
	filter: alpha(opacity=60);
filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.7));
	  -moz-opacity:0.6;
	  opacity:0.6;
	}

.boxshadow img {
box-shadow:0px 3px 10px rgba(0,0,0,.8);
}
.boxshadow img:hover {
background:#eee;
	opacity: 0.8;
}

/* other
--------------------------- */
@media screen and (min-width: 579px) {
	.br-sp { display:none; }
}

@media screen and (max-width: 579px) {
	.br-sp2 { display:none; }
}

a:focus, *:focus {
	outline:none;
}

span.aka {
color:#ff0000;
}

.bg_gold {
background:#977c56;
color:#FFF;
}
.bg_gold2 {
background:#69563c;
color:#FFF;
}

.topmenu {
height:100vh;
width:100vw;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　common　＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.maincontainer {
	max-width:1100px !important;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

@media screen and (max-width: 800px) {
.maincontainer {
	max-width:1100px !important;
  position: relative;
  margin: 0 auto;
  padding-left: 0px;
  padding-right: 0px;
background:none;
}
}
.rl15-container {
  max-width: 900px;
  position: relative;
  margin: 0 auto;
  padding-left: 15px;
  padding-right: 15px;
}

.rl80-container {
  max-width: 800px;
  position: relative;
  margin: 0 auto;
  padding-left: 45px;
  padding-right: 45px;
}

p.lead {
margin:.5em 0 0.5em 1em;
font-size:1em;
}
p.lead2 {
margin:1.2em 0 1.2em 1em;
font-size:1em;
}

/*-------------------------- Booking -----------------------------*/
.bn_booking {
	width: 90px;
	height: 36px;
background: #e22431;
margin-right:5px;
  font-size: 14px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
border-radius:5px;
border:solid 1px #e22431;
}
.bn_booking a {
  position: relative;
  z-index:1;
  color:#FFF;
  text-decoration: none;
	width: 90px;
	height: 36px;
line-height: 36px;
text-align:center;
border-radius:5px;
border:solid 1px #e22431;
}
.bn_booking a:hover {
background:#FFF;
color:#e22431;
}

.Language_btn {
font-size:0.9em;
}
@media screen and (max-width: 800px) {
.Language_btn {
position:fixed;
top:10px;
right:70px;
z-index:9999;
font-size:0.7em;
}
.bn_booking {
position:fixed;
top:10px;
right:170px;
z-index:9998;
font-size:0.7em;
	height: 31px;
line-height: 31px;
}
.bn_booking a {
	height: 31px;
line-height: 31px;
}
}




/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　ナビゲーション　＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.navigation {
max-width:100%;
/*ロゴとメニューを一列にするのに使用 flex */
  display: flex;
align-items:center;
}

.d_nav {
	margin-left:auto;
	margin-right:auto;
margin-bottom:0;/*余計なマージンをとる*/
    list-style: none;
}
.d_nav:before,
.d_nav:after {
    content: " "; 
    display: table; 
}
.d_nav:after {
    clear: both;
}
.d_nav ul {
    list-style: none;
    width: 16em;/*階層の長さ*/
}
.d_nav a {
    padding: 10px 15px;
    color:#000;
    text-decoration: none;
    outline: none;
    z-index: 1;
}
.d_nav a:visited {
	text-decoration: none;
}

.d_nav a:hover {
    padding: 10px 15px;
    color:#fff;
    text-decoration: none;
    background:#c3ad80;
}

.d_nav li {
    position: relative;
	padding:0;/*navとnavの間*/
}
.d_nav > li {
    float: left;
}
.d_nav > li > .parent {
    background-image: url("../css/downArrow.png");
    background-repeat: no-repeat;
    background-position: right;
}
.d_nav > li > a {/*navのtitle*/
    display: block;
    font-size: 0.9rem;
	margin:0 3px;/*navとnavの間*/
}
.d_nav li  ul {
    position: absolute;
    left: -9999px;
}
.d_nav > li.hover > ul {
    left: 0;
}
.d_nav li li.hover ul {
    left: 100%;
    top: 0;

}
.d_nav li li a {
    display: block;
    background: #00ff00;
    position: relative;
    z-index:100;
    border-top: 1px solid #00ff00;
}
.d_nav li li li a {
    background:#249578;
    z-index:200;
    border-top: 1px solid #000;
}

@media screen and (min-width:800px) and ( max-width:900px) {
.d_nav a, .d_nav a:hover {
    padding: 10px 10px;
}
}



@media screen and (max-width: 800px) {
.d_nav {
    margin: 0px auto;
    }
.d_nav li {
    position: relative;
	padding:0;
    }
    .active {
        display: block;
    }
    .d_nav > li {
        float: none;
border-top:solid 1px #666;
    }

    .d_nav > li:last-child {
border-bottom:solid 1px #666;
}
    .d_nav > li > .parent {
        background-position: 95% 50%;
    }
    .d_nav li li .parent {
        background-image: url("../css/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }
    .d_nav ul {
        display: block;
        width: 100%;
    z-index: -1;
    }
   .d_nav > li.hover > ul , .d_nav li li.hover ul {
        position: static;
    z-index: 1;
    }
.navigation {
display:block;/* display:flex の解除　スマホの時のプルダウンを全幅にするため */
}
}


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

p.linksaki a {
padding:8px 16px;
border:solid 1px #FFF;
font-size:18px;
color:#FFF;

}
.linksaki a:hover {
background:#FFF;
color:#2b1919;
}


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

.square_btn {
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
    border-radius: 4px;
    color:＃FFF;/*効かない*/
    background-image: -webkit-linear-gradient(#4e9926 0%, #143719 100%);
    background-image: linear-gradient(#4e9926 0%, #143719 100%);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #4e9926;
  }
.square_btn:hover{
background:#143719;
border-bottom: solid 3px #488c24;
}
.square_btn:active{
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
    color: #fff;
}


/* ＝＝＝＝ 地図 ＝＝＝＝＝ 
#gmap {
	float:left;
	width:100%;
	height:500px;
	margin:0px 0px 0px 0px;
}
.maph4 {
	color:#034a7f;
	font-weight: 900; 
}
.popup {
	width:200px;
	height:80px;
	padding:5px;
	white-space: nowrap;
}
*/


/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　footer navi　＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */	
hr.footer-line {
background-color:#eee;
max-width:900px;
text-align: center;
margin: 0 auto;
}

.copyright {
  text-align: center;
font-size:0.8em;
padding:1.5em 0;
}


/*====================== footer_menu =========================*/ 

.my-parts ul {
  list-style: none;
  margin:20px;
  padding: 0;
}
.my-parts ul::after {
  content: "";
  display: block;
  clear: both;
}
.my-parts ul li {
  float: left;
}
.my-parts ul li a {
  display: block;
  padding: .4em .8em;
  text-decoration: none;
  color: #333;
  background: #fff;
  text-align: center;
}
.my-parts ul li a:hover {
  background: #eee;
}

span.footer_logo {
margin-left:10px;
font-size:20px;
}



.carousel-caption {
  position: absolute;
  bottom: 1.5rem;
  left: 1.5rem;
  z-index: 10;
	max-width:200px;
transition-duration: 1s;
}

.carousel-caption :hover {
background:#FFF;
}

@media (max-width: 600px) {
.carousel-caption {
	max-width:120px;
}
}

/*==================================================*/
.ribbon12-wrapper {  
  display: block;
  position: relative;
  margin: 15px auto;
  padding: 10px 0;
  width: 100%;
  background: #261302;
  }

.ribbon12 {
  display: inline-block;
  position: relative;
  box-sizing: border-box;
  padding: 10px;
  margin: 0 0 0 -20px;
  width: calc(100% + 20px);
  font-size: 22px;
  color: white;
  background: #fd7c23;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
}

.ribbon12:before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-right: solid 20px #924710;
}



/*==================================================*/
#header_wrapper {
position:fixed;
width:100%;
z-index:9999;
   top: 0;
    padding: 0;
background:rgba(255,255,255, 0.4);
}

.top_logo {
display:flex;
justify-content:center;
}

@media (max-width: 800px) {
.top_logo {
    margin: inherit;
    padding: inherit;
width:50px;
left:3px;
}
}



/*-------------------------- Toggle Button -----------------------------*/
.toggleMenu {
position:fixed;
top:12px;
right:10px;
z-index:9999;
    display:  none;
}
/*   https://cocohp.com/7906/    */
.toggle {
    display: block;
    width: 40px;
    height: 48px;
    cursor: pointer;/*カーソルが乗ったらポインターに変化させる*/
margin:0 5px;
    }
.toggle span {
    display: block;
    position: absolute;
    width: 40px;
    border-bottom: solid 3px #333;/*ボーダーで実装*/
    -webkit-transition: 0.2s ease;/*変化の速度を指定*/
    -moz-transition: 0.2s ease;	/*変化の速度を指定*/
    transition: 0.2s ease;	/*変化の速度を指定*/
 background:#eee;
}


.toggles {
    display: block;
    width: 40px;
    height: 48px;
    cursor: pointer;/*カーソルが乗ったらポインターに変化させる*/
margin:0 5px;
    }
.toggles span {
    display: block;
    position: absolute;
    height: 4px;
    width: 100%;
    background: #333;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}
.toggles span:nth-child(1) {
    top:0;
}
 .toggles span:nth-child(2) {
    top: 11px;
}
 .toggles span:nth-child(3) {
    top: 22px;
}
.toggles.active span:nth-child(1) {
    top: 11px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}
 
/* 2番目と3番目のspanを45度に */
.toggles.active span:nth-child(2) {
    width: 0;
    left: 50%;
}
.toggles.active span:nth-child(3) {
    top: 11px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}


#header_wrapper.fixed {
background:rgba(255,255,255, 1);
}

#header_wrapper.fixed .top_logo{
    margin: inherit;
    padding: inherit;
width:50px;
left:3px;
}

#header_wrapper.flex_wrap {
display:flex;
flex-direction:column;
}
@media (min-width: 800px) {
#header_wrapper.fixed.flex_wrap{
display:flex;
flex-flow:row wrap;
justify-content:space-between;
}
#header_wrapper.fixed .d_nav a {
    padding: 10px 5px;
}
#header_wrapper.fixed .d_nav a:hover {
    padding: 10px 5px;
}
}