﻿@charset "utf-8";
/* CSS Document */

/*====================================
  	base
====================================*/
.txt_color_nomal{color:#331c16; }
.txt_white{color: white;}
.txt_red{color: #f8c6be;}
.txt_color1{color: #f8c6be} /* メインカラー */
.txt_color2{color: #ff9f86} /* サブカラー */
.txt_color3{color: #473020} /* アクセントカラー1 */
.txt_color4{color: #fbfafa} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #f8c6be} /* メインカラー */
.bg_color2{background-color: #ff9f86} /* サブカラー */
.bg_color3{background-color: #a9d5d2} /* アクセントカラー1 */
.bg_color4{background-color: #fbfafa} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #f8c6be}
.border_color2{border-color: #ff9f86}
.border_color3{border-color: #473020}
.border_color4{border-color: #fbfafa}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #331c16;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #f8c6be} /* メインカラー */
.hvr_txt_color2:hover{color: #ff9f86} /* サブカラー */
.hvr_txt_color3:hover{color: #473020} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #fbfafa} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #f8c6be} /* メインカラー */
.hvr_bg_color2:hover{background-color: #ff9f86} /* サブカラー */
.hvr_bg_color3:hover{background-color: #473020} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #fbfafa} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #f8c6be}
.hvr_border_color2:hover{border-color: #ff9f86}
.hvr_border_color3:hover{border-color: #473020}
.hvr_border_color4:hover{border-color: #fbfafa}
.txt_shadow_h{text-shadow: none;}
.txt_shadow-b{text-shadow: none;}
/*====================================
  	共通
====================================*/
.foot_tel_bt {
     max-width: 300px!important; 
}

.button:hover::after {
    box-shadow: inset 0 0 0 15em 
    rgba(169,213,210,1);
}
.link_box ul{justify-content: left;}
.link_box ul li{margin-right: 10px; width: 40px!important;}

.lino_link a{display: block; width: 180px; background-color: #fff; border: 1px solid #f8c6be;padding: 10px 0px 10px; color:#473020; text-align: center;    transition: all 0.5s;}
.lino_link a:hover{background-color: #f8c6be; color:#fff;}
.more a,.contact_bt a,.tel_bt a,.foot_tel_bt a{border-color: #a9d5d2;}
.more a:hover,.contact_bt a:hover,.tel_bt a:hover,.foot_tel_bt a:hover{border-color: #a9d5d2;}
footer div .grid_6{width: 45%!important;}
footer div .grid_5{width: 50%!important;}
#map .ggmap{padding-bottom: 580px;}

/*====================================
  	トップページ
====================================*/

#main_img h2.txt1 {
    text-shadow: 0 0 5px 
rgba(100, 60, 20, .7), 0 0 10px rgba(100, 60, 20,0.80), 0 0 15px rgba(100, 60, 20,0.80), 0 0 20px
    rgba(100, 60, 20,0.90);
    font-weight: bold;
    z-index: 2;
    width: auto;
    max-width: 90%;
    right: auto;
}

/*====================================
  	下層ページ
====================================*/

#page_title .title_img::before{opacity: 0.5;}
#page_title .page_box h2{text-shadow:none;}




/* CMS
   ----------------------------------------------------------------- */
.button2:hover{
	box-shadow: none;
background-color:#f8c6be;
color:white;
}

#cms_4-b .cate_box_item{
	position: fixed;
    top: 15%;
    left: 50%;
    transform: translateX(-50%);
	width: 90%;
	max-width: 800px;
	z-index: 9999;
	overflow:auto;
	max-height:70%;
}
#cms_4-b .modal_bg{
	position: fixed;
	display: none;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(255,255,255,0.9);
	z-index: 9998;
}
#cms_4-b .cate_box_item .close span,#cms_4-b .cate_box{cursor: pointer;}
.close span{
    width: 100%;
    text-align: center;
    color: #473020;
    padding: 15px 0px;
    display: block;
    line-height: 1;
	border: #a9d5d2 solid 1px;
	transition: all 0.5s;
}
.close span:hover{
    color: #fff;
	background: #a9d5d2;
}

.hamburger{z-index:9997;}


/* タブレット
   ----------------------------------------------------------------- */
@media screen and (max-width: 768px){
	footer div .grid_6{width: 100%!important;}
footer div .grid_5{width: 100%!important;}
	
}
/* スマホ
   ----------------------------------------------------------------- */
@media screen and (max-width: 667px){
	.logo{text-align: center;}
.main_box {    padding-top: 100px;}
}

/*====================================
  	IE環境の設定
====================================*/
@media all and (-ms-high-contrast:none){
	.cate_list .button2{padding-bottom: 5px;}
.contact_bt	.button{padding-bottom: 10px;}
	.tel_bt .button{padding-top: 14px;}
	#form_area .mail input{padding-top: 15px;}
	#page9 .box_wrap p a{padding: 8px 10px 3px;}
	#page10 .button2{padding-bottom: 10px;}

}

/*2020/10/09　追加予約バナー*/
#fixed_right_banner {
    position: fixed;
    top: 200px;
    right: 0;
	z-index: 99;
}
#fixed_right_banner > *{
    width: 80px;
	margin-right: -20px;
	-webkit-transition: margin .2s ease;
    transition: margin .2s ease;
}
#fixed_right_banner > *:hover{
	margin-right: 0px;
}
#fixed_right_banner > a {
    display: block;
}
@media screen and (max-width: 768px){
#fixed_right_banner {
    top: 280px;
}
}
@media screen and (max-width: 667px){
#fixed_right_banner {
display:none;
}
}