﻿/*--------リンク・フォント--------*/
.linkStyle{color: #987d74; text-decoration: underline;}

/*--------全体--------*/
.txt_shadow { text-shadow: 0 0px 7px rgba(51, 51, 51, .7);}
#top_header,
#main_right,
#pc_news,
#sp_info,
#page_container{ background-image: url(./Dup/back.png);}
#footer_txt a{color: #50290f;}
#main_left #footer_txt{color: #333;}
#left_bar #menu_bt{background-color: #b79780;}
#top_header h1{width: 30%!important;}
#main_right header,
#main_right,
#main_left{ border: none;}
#main_left #footer_txt {
    width: 75%;
    left: 12%;
}
#contents h3{ margin-bottom: 2vh!important;}
#copyright{color: #b79780;}
#link.on .bg_wrap,
#link2.on .bg_wrap{
    background-color: rgba(202, 185, 157, .7)!important;
}
.btn_wrap{
  max-width: 300px;
  margin: 60px auto;
}
a.btn_add {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 64px;
  box-sizing: border-box;
  background: #ece8df;
  position: relative;
}
a.btn_add span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 64px;
  background: #fff;
  box-sizing: border-box;
  letter-spacing: 0.1em;
  color: #5a4434;
  box-shadow: 0px 5px 12px #d2ccbe, -6px -6px 12px #f1ede7;
  position: absolute;
  top: -5px;
  left: 0;
  transition-duration: 0.2s;
}
a.btn_add:hover span {
  left: 0;
  top: 0;
  box-shadow: 0 0 4px #d2ccbe, -2px -2px 4px #f1ede7;
}
#map2 {
    position: relative;
    height: 500px;
    overflow: hidden;
}
#map2 iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#map h4,
#map2 h4{
position: absolute;
    z-index: +1; 
    right: 0;
    background-color:rgba(136, 133, 126, .85);
    padding: 1.2% 4%;
    font-size: 1.2em;
}
.portrait_img{
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 700px!important;
}
.portrait_img img{
    width: auto;
    height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
#pc_news h3 {
  position: relative;
  padding: 0 65px;
  text-align: center;
}

#pc_news h3:before {
  position: absolute;
  top: calc(50% + 8px);
  left: 0;
  width: 100%;
  height: 2px;
  content: '';
  background: #95928d;
}

#pc_news h3 span {
  position: relative;
  padding: 0 1em;
  background: #f8f6f2;
background-image: url(./Dup/back.png);
    background-position: 30% 50%;
}


#link2{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	animation-name: fadeout;
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-fill-mode:forwards;
}
#link2 .bg_wrap{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	z-index: 9997;
	transition: all 0.5s;
}
#link2 .bg_wrap .close_bt{
	position: absolute;
	top: 40px;
	right: 40px;
	width: 40px;
	height: 40px;
	cursor: pointer;
}	
#link2 ul{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 60%;
	max-width: 800px;
	max-height: 800px;
	z-index: 9999;
	overflow: auto;
	transition: all 0.5s;
}
#link2 ul li{
	padding: 2%;
}
#link2.on{
	z-index: 9998;
	animation-name: fadein;
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-fill-mode:forwards;
}
#link2.on .bg_wrap,#link.on ul{
	opacity: 1;
}
#top_return.retop,
#left_bar #scroll {
    background-color: #b79780;
}
.icon_anime{
    transform-origin: center center;
    animation: yurayura 6s linear infinite;
}
@keyframes yurayura {
  0% , 100%{
      transform: rotate(5deg);
  }
  50%{
      transform: rotate(0deg);
  }
}
.icon_anime2{
    transform-origin: center center;
    animation: yurayura2 6s linear infinite;
}

@keyframes yurayura2 {
  0% , 100%{
      transform: rotate(5deg);
  }
  50%{
      transform: rotate(0deg);
  }
}




/*--------下層--------*/
#page_container {  background-color: rgba(236, 233, 228, 1);}
#page_title { background-color: rgba(220, 212, 200, .5)!important;}
#page_title h2 span{ text-shadow: 0 0px 7px rgba(111, 85, 67, 1);}
.cate_list li a{background-color: #b79780;}
.subpage #main_left #footer_txt {
    top: 3%;
}
.subpage #main_left #left_link {
width: 65%;
top: auto;
bottom:0%;
}
.pager li a {
    transition: all 0.3s;
    background-color: #be9a82!important;
    border: 1px solid #fff;
}
#cms_3-c .box_txt1{
margin: 0 15px;
    background-color: #f1f1f1;
}
#cms_6-c .arrow,
#cms_6-c .circle {
display:none;
}
#cms_6-c .box_title:first-letter {
	font-size: calc(1rem + 6px);
	padding-right: 0px;
}
#cms_5-b .arrow img {
    background-color: #b79780;
}
#cms_5-b .cate_box .open_bt .box_title1::before {
    color: rgba(168, 127, 86, 1)!important;
}
#page7 #map {
position:relative;
height: 400px;
    overflow: hidden;
}
#page7 #map2 {
    position: relative;
    height: 400px;
    overflow: hidden;
}
#page7 #map2 iframe {
    width: 100%;
    height: 400px;
}
#page8 .tel_box{
position: relative;
    overflow: hidden;
}
#page8 .tel_box > a:before{
    content:"";
    position: absolute;
    width:100vw;
    height:100vh;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    left:50%;
    top:50%;
}
@media screen and (max-width: 960px){
    #page8 .tel_box p{
        display: block;
        padding-right: 0px;
        margin-right: 0px;
        border-right: none;
        
    }
}
#page10 ul li {    background-color: #c3afa0;}




/*--------タブレット--------*/
@media screen and (max-width: 768px){
#intro #intro_wrap #intro_txt,
#intro #intro_wrap > div ,
#intro #intro_wrap > div a  {color: #88857e;}
header #top_link { height: 51vh!important;}
#top_header h1 {
    width: 25%!important;
}
header #top_link .links_bt {
    position: inherit!important;
}
.btn_wrap { 
    margin: 20px auto;
}
.portrait_img img {
    left: 68%;
}
#sp_info,#sp_info a{color: #333333;}

#map2 {
    position: relative;
    height: 400px;
    overflow: hidden;
}
#link_bt.links_bt {
    bottom: 103%;
    left: 40%;
}
#link_bt2.links_bt2 {
    position: absolute;
    z-index: 3;
    width: 20%;
    max-width: 100px;
    left: 60%;
    bottom: 100%;
    transform: translateX(-50%);
}
#link2 ul{
		top: 10%;
		left: 10%;
		transform: translate(0);
		width: 80%;
	}
#main_menu .txt_white{color: #b79780;}
#pc_news,
#sp_info{border:none;}
#page8 .tel_box p {
    display: block;
    padding-right: 20px;
    margin-right: 15px;
    border-right: 1px solid #88857e;
}
}

/*--------スマートフォン--------*/
@media screen and (max-width: 667px){
.portrait_img { height: 350px!important;}
.portrait_img img { left: 51%;}
.btn_wrap { 
max-width: 240px;
margin: 40px auto 0px;
}
a.btn_add span{ height: 50px;}
#link_bt.links_bt { left: 35%;}
#link_bt2.links_bt2 { left: 62%;}

header #top_link { margin-top: 25px;}
header #top_link {
    height: 40vh!important;
}
#map{width: 100%!important;}
#map2{
width: 100%!important;
    position: relative;
    height: 300px;
    overflow: hidden;
}
#cms_3-c .box_txt1 {
    margin: 0;
    padding: 0 5px;
}
#page8 .tel_box p {
    display: block;
    padding-right: 0px;
    margin-right: 0px;
    border-right: none;
}
}


/*--------------------------------------------
IE
--------------------------------------------*/
@media all and (-ms-high-contrast:none){

}














/* color */
body,.txt_color_nomal{color: #333333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #88857e} /* メインカラー */
.txt_color2{color: #be9a82} /* サブカラー */
.txt_color3{color: #d9c4b3} /* アクセントカラー1 */
.txt_color4{color: #ece9e4} /* アクセントカラー2 */
.txt_color5{color: #f8f8f8} 


/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #ece9e4} /* メインカラー */
.bg_color2{background-color: #f2e8dc } /* サブカラー */
.bg_color3{background-color: #d9c4b3} /* アクセントカラー1 */
.bg_color4{background-color: #be9a82} /* アクセントカラー2 */
.bg_color5{background-color: #f8f8f8}
.bg_color_clear{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #be9a82}
.border_color2{border-color: #f2e8dc}
.border_color3{border-color: #d9c4b3}
.border_color4{border-color: #ece9e4}
.border_color5{border-color: #f8f8f8}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_normal:hover{color: #333333;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #be9a82} /* メインカラー */
.hvr_txt_color2:hover{color: #f2e8dc} /* サブカラー */
.hvr_txt_color3:hover{color: #d9c4b3} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #ece9e4} /* アクセントカラー2 */
.hvr_txt_color5:hover{color: #f8f8f8}

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #be9a82} /* メインカラー */
.hvr_bg_color2:hover{background-color: #f2e8dc} /* サブカラー */
.hvr_bg_color3:hover{background-color: #d9c4b3} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #ece9e4} /* アクセントカラー2 */
.hvr_bg_color5:hover{background-color: #f8f8f8}
.hvr_bg_color_clear:hover{background-color: transparent!important}


/* border-color ※!important */
.hvr_border_color1:hover{border-color: #be9a82}
.hvr_border_color2:hover{border-color: #f2e8dc}
.hvr_border_color3:hover{border-color: #d9c4b3}
.hvr_border_color4:hover{border-color: #ece9e4}
.hvr_border_color5:hover{border-color: #f8f8f8}

