@charset "utf-8";
/* CSS Document */

/*----------------------
	デフォルトスタイル
-----------------------*/
body,p,h1,h2,h3,h4,h5,h6,
span,small,strong,
div,ul,li,
figure,img,
header,footer,nav,section{
    margin:0;
    padding:0;
	border:none;
	outline:none;
	font-size:1rem;
}

header,footer,nav,section{display:block;}

html{
	font:16px/1.3 "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho" serif;
	-webkit-text-size-adjust:none;}

li{list-style:none;}

img{ width:100%;}

img a{ border:none;}

/*----------------------------------------
	common
----------------------------------------*/
body{
	background: #F1EFE0;
	color:#9F723C;
	margin:20px;
	line-height:200%;
}

/* リンク */
a{
	color:#F8F7EF;
	text-decoration:none;
	background:#9F723C;
	margin:5px;
	padding:5px;
}

/*【角丸】角丸コンテンツにクラス指定*/
.corner{
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}

.corner img{
	background:#FFF;
	padding:1px;
	-moz-border-radius:50px;
	-webkit-border-radius:50px;
	border-radius:50px;
}

/*--------------------
	共通ヘッダ部分
--------------------*/
header{width:100%;}

/*	サイト名やタイトル
--------------------*/
header h1{
	padding:.25em 0;
	/*border-bottom:solid 1px #DDCFB9;*/
	text-align:center;
 width: 100%;
}
header h1 img{width:70%;}
header h1 img.form_logo{ max-width:445px;}

h2 { font-size:120%; }
h2 span{ font-size:60%; display: inline; background:#DDCFB9; padding:5px; }

#top_img { width:50%;margin:0 auto; padding:30px 0; }


/*	セクションボーダー
--------------------*/
section{
	padding:30px 0;
		border-bottom:solid 1px #DDCFB9;
}


@media only screen and (min-width: 900px) {
  img{
    width:auto;
  }
  header{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  header h1 img,
  header #top_img{
    width:auto;
  }
  section {
    max-width: 640px;
    margin: auto;
	  padding:100px 0;
  }
}



#map {	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;}
#map iframe{	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height:100%;
}

#fb_wrap{margin:0 auto; }

#fb{width:100%;}





/*--------------------
ギャラリー*/
#stream-grid{ overflow:hidden; width:100%; }
#stream-grid ul{ margin:0 auto; width:200px;}
#stream-grid li a{ margin:0; padding:0; border:none; }
#stream-grid li { margin:0; padding:0; width:100px;  }


/*--------------------
オーダーフォーム
--------------------*/
#form .read{font-size:80%;line-height:200%; margin:2em 0;}
#form .read span{ display:inline-block; font-size:150%; border:#9F723C 3px solid; padding:0.5em 1em; margin:0.5em 0;}
#form .read span strong{ font-size:150%; }
#form .read_footer{margin:1px; text-align:center; background:#DDCFB9; padding:1em;}
.mailform{ font-size:70%; text-align:left; width:100%; }
.mailform th{line-height:140%; min-width:6em;}
.mailform th, .mailform td{ background:#fff; padding:1em 0.5em; }
.mailform .catch{background:#9F723C; color:#fff; text-align:center; }

.mailform input[type="text"] { width:80%;}
.mailform .mf_other{ width:80%;}
.mailform input[type="text"].mf_price{ width:6em;}

.mailform .cap{ font-size:90%;line-height:140%; display:block;}
#mailform .submit{margin-top:2em;}
#mailform .submit input[type="submit"],
#mailform .submit input[type="reset"] {font-size:150%; background:#9F723C; color:#fff; border:none; border-radius:20px; padding:0.5em 1em; box-shadow:0 0 4px 0 #000; }
/*--------------------
フッター
--------------------*/
footer{
	width:100%;
	padding-top:10px;
	border-top:solid 1px #FFF;
}

footer a{
	text-decoration:underline;
}

/*	pagetop
--------------------*/
.pagetop a{
	overflow:hidden;
	text-align:center;
	color:#F8F7EF;
	text-decoration:none;
	background:#9F723C;
	padding:5px 10px;
	display:block;}





#copy{
	padding:.5em 0;
	font-size:12px;
	text-align:center;
}




/*フェードイン*/
@keyframes logo_20th_anime {
  0% {
    transition-timing-function: ease-out;
    opacity: 0;
  }
  99.9%, to {
    opacity: 1;
  }
}

#logo_20th{
  animation-fill-mode:both;
  animation-duration:5s;
  animation-name: logo_20th_anime;
}