/*--------------- common css ---------------*/
html {
	font-size: 18px;
}

body {
	font-family: Georgia, 游明朝,YuMincho, "Hiragino Mincho PronN", Meiryo, serif;
}


a {
	color: #666;
	text-decoration: none;
}

h1 .sitename {
	color: #333;
	display: block;
	font-size: 2rem;
	font-weight: bold;
}

ul {
	list-style-type: none;
	margin-block-start: 0;
	margin-block-end: 0;
	padding-inline-start: 0;
}

.menu_area ul {
	display: flex;
	justify-content: space-between;
}

.menu_area li {
	margin: 1rem 1rem 0 1rem;
}

.menu_area a {
	font-size: .9rem;
}

.menu_area a i {
	font-size: .6rem;
	padding-left: .5rem;
}

td,th{text-align: left;}
img{
	vertical-align:bottom;
	max-width: 100%;
	height: auto;
}


/*---------------
container(pc)
---------------*/

@media screen and (min-width: 1281px) {
	/* main_area */
	
	/* header */
	header {
		z-index: 999;
		width: 100%;
		height: 100%;
	}
	header h1 {
		pointer-events:all;
		potision: absolute;
		width: 80px;
		top: 30px;
		left: 30px;
	}
	header .gnav,
	header .snav {
		position: absolute;
		position: fixed;
		font-family: 'Yu Gothic','sans-serif';
		font-weight: 700;
		font-size: 13px;
		line-height: 1;
	}
	header .gnav {
		display: block!important;
		right: 25px;
		top: 30px;
	}
	header .snav {
		right: 25px;
		bottom: 30px;
	}
	header .gnav ul,
	header .snav ul .reserve {
		display: flex;
		align-items: center;
		width: 24px;
		-webkit-writing-mode: vertical-rl;
		-moz-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		-ms-writing-mode: vertical-rl;
		writing-mode: vertical-rl;
	}
	header .gnav ul li+li {
		margin-top: 15px;
	}
}


/*---------------
container(mobile)
---------------*/

@media screen and (max-width: 900px) {
	a{
		transition-duration: 0;
		transition-property: color;
	}
a:link { color: #3c3835; text-decoration:none; }
a:visited { color: #3c3835; text-decoration:none; }
a:hover { color: #3c3835; text-decoration:none; }
a:active { color: #3c3835; text-decoration:none; }

	/* header */
	header {
		position: fixed;
		z-index: 999;
		width: 100%;
		height: 60px;
		background: #fff;
		display: flex;
		justfy-conntent: space-between;
		align-items: center;
		border-bottom: solid 1px #F2F2F2;
	}
	header h1 {
		potision: absolute;
		width: 60px;
		left: 30px;
	}
	header .gnav {
		display: none;
		position: absolute;
		top: 60px;
		width: 100%;
		height: 100vh;
		background: #fff;
	}
	header .gnav ul {
		font-family: 'Yu Gothic','sans-serif';
		font-weight: 300;
		font-size: 30px;
		line-height: 1;
	}
	header .gnav ul li {
		border-bottpm: solid 1px #f2f2f2;
		text-align: center;
		padding: 20px;
	}
	header .gnav ul li a {
		display: block;
	}
	header .snav {
		potision: absolute;
		right: 25px;
		bottom: 30px;
	}
	header .snav ul {
		display: flex;
		align-items: center;
	}
	header .snav ul .reserve {
		display: flex;
		align-items: center;
	}
	header .snav ul li+li {
		margin-left: 15px;
	}
	
	/*menu_btn*/
	header .menu_btn {
		display: block;
		position: absolute;
		cursor:pointer;
		top: 0;
		right: 0;
		width: 60px;
		height: 60px;
		border-left: solid 1px #f2f2f2;
	}
	header .menu_btn_icon {
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		width: 30px;
		height: 1px;
		margin: 0 0 0 -15px;
		background: #3C3835;
		transition-duration: .2s;
		transition-property: transform;		
	}
	header .menu_btn_icon:before,
	header .menu_btn_icon:after{
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		left: 0;
		width: 30px;
		height: 1px;
		background: #3C3835;
		transition-duration: .2s;
		transition-property: transform;		
	}
	header .menu_btn_icon:before{
		margin-top: -10px;
	}
	header .menu_btn_icon:after{
		margin-top: 10px;
	}
	header .menu_btn .close {
		background: transparent;
	}
	header .menu_btn .close:before,
	header .menu_btn .close:after {
		margin-top: 0;
		width: 30px;
		background: #3c3835;
	}
	header .menu_btn .close:before {
		tranceform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
	}
	header .menu_btn .close:after {
		tranceform: rotate(-135deg);
		-webkit-transform: rotate(-135deg);
	}	
}

@media screen and (max-width: 600px) {
	body {
		font-size: 13px;	
	}
	header .gnav ul {
		font-family: 'Yu Gothic','sans-serif';
		font-weight: 300;
		font-size: 24px;
		line-height: 1;
	}

	
	
}