﻿html {
	min-width: 1200px;
	/* viewport */
}



/*=============================================
 * body
 *=============================================*/

body {
	color: #391902;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-size: 15px;
	line-height: 30px;
	letter-spacing: 1.2px;
	min-width: inherit;
	min-height: inherit;
	max-height: 100%;
	background: url(../img/shared/bg.jpg) repeat;
}



/*=============================================
 * fonts - DON'T EDIT
 *=============================================*/

.fnt-mincho {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.fnt-meiryo {
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴシックPro", "ＭＳ ゴシック", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.fnt-gothic {
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}



/*=============================================
 * .fnt - customs
 *=============================================*/

.fnt-mincho {}

.fnt-meiryo {}

.fnt-gothic {}

.fnt-garamond {}



/*=============================================
 * #wrapper
 *=============================================*/

#wrapper {
	clear: both;
	width: 100%;
	position: relative;
	overflow: hidden;
}



#sec1,
#sec2,
#sec3,
#sec4,
#sec5,
#sec6 {
	position: relative;
	z-index: 1;
}

h1,
h2,
h3,
h4,
h5 {
	position: relative;
	z-index: 2;
}

.ttl,
.ttl1,
.ttl2,
.ttl3,
.ttl4,
.ttl5 {
	position: relative;
	z-index: 1;
}

.box,
.box1,
.box2,
.box3,
.box4,
.box5 {
	position: relative;
}

.group,
.group1,
.group2,
.group3,
.group4,
.group5 {
	position: relative;
}




/*=============================================
 * header
 *=============================================*/

#header {
	position: relative;
	height: 1000px;
	background: url(../img/shared/pattern1.jpg) repeat;
	z-index: 1;
}

#header:before {
	position: absolute;
	content: "";
	background: url(../img/shared/h_shadow.png) repeat;
	width: calc(50% - 500px);
	height: 100%;
	left: 0;
	top: 0;
}


#header h1 {
	position: absolute;
	top: 17px;
	right: 151px;
	color: #958946;
	font-size: 14px;
	letter-spacing: 1px;
}

#header .logo {
	position: absolute;
	left: 0;
	top: 0;

}

#header .tel {
	text-align: center;
	margin-top: 32px;
}

#header .nav {
	padding-top: 78px;
	margin-left: 190px;
}

#header .mail {
	position: absolute;
	right: 0;
	top: 16px;
}



/*=============================================
 * key
 *=============================================*/

#key {
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	min-height: 688px;
	position: relative;
	width: 1135px;
	margin: 0 auto;
	margin-top: 43px;
	z-index: 2;
}
#key .key_img {
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	min-height: 688px;
	position: relative;
	width: 1135px;
	margin: 0 auto;
	margin-top: 43px;
	z-index: 2;
}
#key:before {
	position: absolute;
	content: "";
	background: url(../img/shared/key_frame.png) no-repeat;
	width: 1420px;
	height: 815px;
	top: -45px;
	left:-151px;
	right:0;
	margin: 0 auto;
	z-index:0;
}

#key:after {
	position: absolute;
	content: "";
	background: url(../img/shared/key_deco1.png) no-repeat;
	width: 1420px;
	height: 815px;
	top: -43px;
	left: -150px;
	right: 0;
	margin: 0 auto;
	z-index: 2;
	padding-left: 18px;
}



#key ul {
	min-height: inherit;
}

#key li {
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	min-height: inherit;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
}



/*=============================================
 * container
 *=============================================*/

#container {}



/*=============================================
 * #socialbuttons
 *=============================================*/

#socialbuttons {
	text-align: left;
}



/*=============================================
 * footer
 *=============================================*/

#footer {
	text-align: center;
	background: url(../img/shared/footer_bg.jpg) repeat-x;
	height: 810px;
	color: #eae3d1;
}

#footer .logo {
	padding-top: 63px;
}

#footer .tel {}

#footer .txt {
	margin-top: 15px;
}

#footer .box {
	margin-top: 64px;
}

#footer .nav {
	text-align: left;
	margin-top: 71px;
	margin-left: 116px;
}

#footer .nav li:after {
	position: absolute;
	content: "";
	background: url(../img/shared/f_line.png) no-repeat;
	width: 8px;
	height: 14px;
	right: -22px;
	top: 7px;
	z-index: 1;
}

#footer .nav li {
	position: relative;
	margin-right: 30px;
}

#footer .nav li + li {}

#footer .nav li + li:before {
	display: none;
}

#footer .nav li.dsn:after {
	display: none;
}



/*=============================================
 * copyright
 *=============================================*/

address {
	position: absolute;
	right: 0;
	top: -5px;
	color: #9d9359;
	letter-spacing: 0.7px;
}



.btn_hover {
	position: relative;
	z-index: 2;
}

.btn_hover:before {
	content: "";
	position: absolute;
	width: 13px;
	height: 3px;
	transform: translateY(-50%);
	top: 50%;
	background: #fff;
	z-index: 1;
	right: 36px;
	transition: 0.7s;

}


.btn_hover:hover:before {
	right: 0;
	transition: 0.7s;
}

.btn_hover:after {
	position: absolute;
	content: "";
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: url(../img/shared/btn_bg.png) repeat;
	z-index: -1;

}

.btn_hover:hover:after {
	background: url(../img/shared/btn_shadow.png) repeat;
}


#sp_botan a{
	border:1px #37160b solid;
	padding:25px 5px;
	text-align:center;
	font-size:32px;
	color:#FFFFFF;
	display:block;
	text-decoration:none;
	background: #37160b; 
}


/*=============================================*/
/*               横についてくるボタン          */
/*=============================================*/

#yoyaku a{
	position:fixed;
	right:5px;
	top:50px;
	z-index:999999;
}