/*リセットCSS*/
* { margin: 0; padding: 0; }
a{text-decoration: none;}


.space{height: 65px;}

/*フォント*/
body {
    font-family:  "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
a{color: #505050;}

/*ハンバーガーメニュー*/
body{
	overflow-x: hidden;}

.header-area{
	width: 100%;
	background: rgba(255,255,255,0.8);
	display: flex;
	justify-content: space-between;
	height: 65px;
	padding: 0 20px;
	align-items: center;
	position: fixed;}
.hamburger{
	margin-right: 40px;
	width: 45px;
	height: 30px;
	position: relative;}
.hamburger span{
	position: absolute;
	width: 100%;
	height: 1px;
	background-color: #AF9dc0;
	transition: .5s;}
.hamburger span:first-of-type{
	top: 0;}
.hamburger span:nth-of-type(2){
	top:45%;}
.hamburger span:last-of-type{
	top: 90%;}
.slide-menu{
	background-color: rgba(248,247,249,0.99);
	position: fixed;
	top:65px;
	width: 100%;
	left: 0;
	transform: translateX(100%);
	transition: .5s;}
.slide-menu li{
	line-height: 300%;
	text-align: center;}
ul{padding: 0;}
.menuline{color: #505050;
	transition: .2s;}
.menuline:hover{color: #D2B04D;}
.menuline:hover{text-shadow: 1px 1px 2px white;}
@media (min-width:750px){.menuline:hover{text-shadow: 1px 1px 2px silver;}}
/*ここから*/




/*・消す*/
li{list-style: none;}
.hamburger.active span:first-of-type{
	top: 50%;
	transform: rotate(45deg);}
.hamburger.active span:nth-of-type(2){
	opacity: 0;}
.hamburger.active span:last-of-type{
	top: 50%;
	transform: rotate(-45deg);}
.slide-menu.active{
	transform: translateX(0);}


/*ヘッダー手前に固定*/
.header{position: sticky;
z-index: 999;}

/*ヘッダー*/
.soen_wide{width: 150px;}

/*キービジュアル*/
/*キービジュアルふわっと表示*/
@keyframes fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
  }
.keyvisual{animation: fadeIn 3.5s ease-in-out;}
/*キービジュアルスライドショー*/
.keyvisual_box{position: relative;
  width: 100%;
  padding-top: 62.5%;
  overflow: hidden;
  background-color: #c6c6c6;}
@keyframes slideshow {
  0% {opacity: 0;}
  10% {opacity: 1;}
  28% {opacity: 1}
  38% {opacity: 0;}
  100% {opacity: 0;}}
 
.keyvisual_box img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
  opacity: 0;
  animation: slideshow 24s linear infinite;}
.keyvisual_box img:nth-child(2) {animation-delay: 8s;}
.keyvisual_box img:last-child {animation-delay: 16s;}



/*スクロール*/
/* スクロールダウンの位置 */
.scroll {
  position: absolute;
  right: 10%;
  top: 70%;
}
/* 線のアニメーション部分 */
.scroll::before {
  animation: scroll 2s infinite;
  background-color: #B800A6;
  bottom: -115px;
  content: "";
  height: 100px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  width: 1px;
  z-index: 2;
}
/* 線の背景色 */
.scroll::after {
  background-color: #FFCEF9;
  bottom: -115px;
  content: "";
  height: 100px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  width: 1px;
}
/* 線のアニメーション */
@keyframes scroll {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  51% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

/*main*/
main{background-color: #F8EEF5;}
main h1{color: #505050;}
main p{color: #505050;}


/*カード*/
.card{margin: 0%;
	padding: 10%;}
@media (min-width:750px){.card{padding-left: 25%;
		padding-right: 25%;
		padding-bottom: 5%;
		padding-top: 5%;}}
.card h1{color: #D2B04D;
	margin-bottom: 0.5em;}
.card p{color: #505050;
	margin-bottom: 0.5em;}
.card h2{color: #808080;
	margin-bottom: 0.5em;}

.photo_a{width: 100%;}

/*カードふわっと*/
.card{opacity: 0.1;
transition: all ease 3s;}
.is-active{opacity: 1;}

/*上部カード*/
.card_top{margin: 0%;
	padding: 10%;}
@media (min-width:750px){.card_top{padding-left: 25%;
		padding-right: 25%;
		padding-bottom: 5%;
		padding-top: 5%;}}
.card_top h1{color: #D2B04D;
	margin-bottom: 0.5em;}
.card_top p{color: #505050;
	margin-bottom: 0.5em;}
.card_top h2{color: #808080;
	margin-bottom: 0.5em;}
/*上部カードゆっくり表示*/
@keyframes fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
  }
.card_top{animation: fadeIn 3.5s ease-in-out;}


/*ボタン2*/
.btn2{border: 1px solid #a0a0a0;
    display: inline-block;
    width: 150px;
    padding: 10px;
    box-sizing: border-box;
	background-color: #f8eef5;
    color: #808080;
    text-decoration: none;
    text-align: center;
	transition-property: opacity;
  transition-duration: .5s;
  -webkit-transition-duration: .5s;
}
.btn-wrap{display: flex;
justify-content: center;}

.btn2:hover {
	border: 1px solid #D2b04d;
  background-color: #F8EEF5;
	color: #D2B04D;
}


/*Instargram_icon*/
.ig_icon{height: 1em;}
.ig_account{display: flex;}

/*map*/
.g_map{width: 100%;}

/*電話番号*/
@media (min-width:750px){a[href*="tel:"] {
	pointer-events: none;
	cursor: default;
	text-decoration: none;}}


/*子ページ*/
.subpage_title{padding-left: 20%;
	padding-right: 20%;
	padding-bottom: 10%;
	padding-top: 10%;}
.subpage_title h1{font-size: 3rem;
	color: #D2B04D;}
/**/
.h1_silver{color: #A9A9A9;
	text-align: center;
	border-bottom: solid 1px #C0C0C0;
	border-top: solid 1px #c0c0c0;}
/*プライスリスト*/
.shina{color: #505050;}
.nedan{color: #505050;}
td{padding-right: .5em;
	padding-bottom: 1em;}
@media (max-width: 749px){
td{display: flex;
	justify-content: flex-start;}}
tr{padding-bottom: 2em;}
/*about*/
.left{color: #505050;
	font-weight: bold;
	font-size: 0.9em;}
.right{color: #505050;}
.left{white-space: nowrap;}

/*ギャラリーイメージ*/
.imgjs{opacity: 0.1;
transition: all ease 3s;
padding-left: 1px;
padding-right: 1px;}
.isactive{opacity: 1;}

.gallery_image{width: 100%;}
.gallery_images{display: block;}
@media (min-width: 750px){
	.gallery_images{display: flex;
		padding-left: 25%;
		padding-right: 25%;}}


/*フッター*/
footer{background-color: #4F284E;
color: #FFFFFF;
text-align: center;
padding: 20px;}
.footer_logo{width: 50%;}
@media (min-width: 750px){.footer_logo{width: 300px;}}
footer h2{color: #fafafa;}
.footer_textbox{padding: 1em;}

@media (min-width: 750px){

/*メニュー*/
nav{
	display: flex;}
.header{
	width: 100%;
	display: flex;}
	
.slide-menu{
	background-color: rgba(255,255,255,0.10);
	margin: 0;
	position: static;
	transform: initial;
	padding:  0;
	display: flex;
	flex-wrap: wrap;
	gap:1em;
	justify-content: center;}
	.menuline{color: #808080;
		transition: 0.2s;}
	.menuline:hover{color: #daa520;}	
		
	
/*ヘッダ*/
.hamburger{display: none;}
}