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

/*------------------------------------------------------------
	デフォルトスタイル #F0F0E1　#eee1cc
------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}

ul{
	list-style:none;
	margin:0;
	padding:0;
}

body{
	overflow-x:hidden;
	font-size:14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background-image:url(../common/main_bg02.jpg);
	-webkit-text-size-adjust:100%;

}

img{
	margin:0;
	padding:0;
	vertical-align:bottom;
}

.main{
	clear:left;
	width:100%;
	height:1000px
}

/*------------------------------------------------------------
	パララックスエフェクト
------------------------------------------------------------*/
#animation {
	margin: 50px 0;
	font-size: 40px;
	font-weight: bold;
	color: #ff0000;
}

.fadeInDown {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	visibility: visible !important;
}

@-webkit-keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}

@keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

/*------------------------------------------------------------
	header
	#logo #678d42 #31471b
------------------------------------------------------------*/
header{
	clear:left;
	width:100%;
	height:103px;
	background:#421e04;
}

header #logo{
	float:left;
	padding-top:20px;
	margin-left:30px;
}

header #menu{
	float:right;
}

/*------------------------------------------------------------
	レスポンシブメニュー
------------------------------------------------------------*/
#menu{
	width:100%;
	max-width:1189px;
	margin:0 auto;
	padding:0;
	background:#421e04;
}

#menu li{
	display:block;
	float:left;
	width:auto;
	margin:0;
	padding:0;
}

#menu li span{
	color:#CC9;
	font-size:10px;
}

#menu li a{
	display:block;
	padding:32px 36px 29px;
	color:#FFF;
	font-family:serif;
	font-size:16px;
	text-align:center;
	text-decoration:none;
	background:#421e04;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#menu li a:hover{
	background:#623311;
}

#toggle{ 
	display:none;
}

header #menu #menu_btn01 a{
	color:#FFF;
	background:#de6e00;
	-webkit-transition:0.4s;
	transition:0.4s;
}

header #menu #menu_btn01 a:hover{
	background:#de8800;
}

header #menu #menu_btn01 span{
	color:#FFF;
}

/*------------------------------------------------------------
	top_img
------------------------------------------------------------*/
#top_img{
	clear:left;
	width:100%;
	height:auto;
}

#top_img p img{
	width:100%;
	height:auto;
	position:relative;
}

#viewer{
	clear:left;
	margin:0 auto;
	width:100%;
	text-align:left;
	overflow:hidden;
	position:relative;
	background:#000;
}

#viewer img{
	margin:0;
	padding:0;
	top:0;
	left:0;
	width:100%;
	position:absolute;
}

/*------------------------------------------------------------
	footer menu #421e04
------------------------------------------------------------*/
#footer_menu{
	clear:left;
	width:100%;
	height:80px;
	background:url(../common/footer_bg1.jpg);
}

#footer_menu section{
	clear:left;
	margin:0 auto;
	width:1200px;
	height:80px;
	border-top:#623311 1px dotted;
}

#footer_menu ul{
	padding-top:20px;
}

#footer_menu li{
	float:left;
	margin:0 -1px -1px 0;
	border-left:#623311 1px dotted;
	border-right:#623311 1px dotted;
}

#footer_menu a{
    display:block;
    overflow:hidden;
	padding:10px 23.5px;
	margin:0;
	text-decoration:none;
	font-size:13px;
	color:#FFF;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#footer_menu a:hover{
	background:#623311;
}

/*------------------------------------------------------------
	footer
------------------------------------------------------------*/
footer{
	clear:left;
	width:100%;
	height:250px;
	background:url(../common/footer_pic1.png) no-repeat bottom left,url(../common/footer_pic2.png) no-repeat bottom right, url(../common/footer_bg2.jpg);
}

footer section{
	clear:left;
	margin:0 auto;
	width:1200px;
	line-height:1.8em;
}

footer #logo{
	padding-top:50px;
	margin-bottom:15px;
}

footer #tel{
	font-size:26px;
	font-family:serif;
}

footer #tel a{
	color:#fff;
	text-decoration:none;
}

footer #tel a:hover{
	background:none;
}

footer .copyright{
	margin-top:15px;
	color:#CC9;
	font-size:14px;
}

footer li{
	color:#FFF;
}

footer #left{
	float:left;
	width:500px;
}

footer #right{
	float:left;
	margin-top:50px;
	margin-left:250px;
	width:450px;
	text-align:center;
}

/*------------------------------------------------------------
	footer img
------------------------------------------------------------*/
#footer_img{
	clear:left;
	display:none;
	width:100%;
	height:auto;
}

#footer_img img{
	width:100%;
}

/*------------------------------------------------------------
	ページトップ
------------------------------------------------------------*/
.pagetop{
    display:none;
    position:fixed;
    bottom:15px;
    right:15px;
}
.pagetop a{
	display:block;
    text-decoration:none;
	background:#C63;
	-webkit-transition:0.4s;
	transition:0.4s;
}
 
.pagetop a:hover{
	background:#b14814;
}

/*------------------------------------------------------------
	height
------------------------------------------------------------*/
.height5{
	margin:0;
	padding:0;
	width:auto;
	height:5px;
}

.height10{
	margin:0;
	padding:0;
	width:auto;
	height:10px;
}

.height15{
	margin:0;
	padding:0;
	width:auto;
	height:15px;
}

.height20{
	margin:0;
	padding:0;
	width:auto;
	height:20px;
}

.height30{
	margin:0;
	padding:0;
	width:auto;
	height:30px;
}

.height50{
	margin:0;
	padding:0;
	width:auto;
	height:50px;
}

.height100{
	margin:0;
	padding:0;
	width:auto;
	height:100px;
}


/*------------------------------------------------------------
	768px
------------------------------------------------------------*/
@media only screen and (max-width: 1200px) {
header{
	clear:left;
	width:100%;
	height:160px;
	background:#421e04;
}

header #logo{
	clear:left;
	float:none;
	padding-top:80px;
	margin-left:0;
	margin-bottom:0;
	text-align:center;
	background:#421e04;
}

#menu-box{
	clear:left;
	width:100%;
	height:auto;
	background:#421e04;
	position:fixed;
	top:0;
	left:0;
	z-index:9999;
}

#menu{
	clear:left;
	margin-top:0;
	display:none;
	width:100%;
	padding:0;
	background:#623311;
	z-index:999;
}

#menu li{
	width:50%;
	margin-bottom:1px;
}

#menu li span{
	font-size:0;
}

#menu li a{
	display:block;
	padding:23px 0px 20px;
	background:#421e04;
	color:#fff;
	font-size:18x;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-align:center;
	text-decoration:none;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#menu li a:hover{
	background:#623311;
	border-bottom:0px;
}

header #menu #menu_btn01 a{
	color:#FFF;
	background:#de6e00;
	-webkit-transition:0.4s;
	transition:0.4s;
}

header #menu #menu_btn01 a:hover{
	background:#de8800;
}

#toggle{
	clear:left;
	display:block;
	position:relative;
	width:100%;
	background:#421e04;
}

#toggle a{
	display:block;
	position:relative;
	padding:18px 0 15px;
	border-bottom:1px solid #623311;
	color:#fff;
	text-align:center;
	text-decoration:none;
}

#toggle:before{
	display: block;
	content: "";
	position: absolute;
	top:50%;
	left:10px;
	width:20px;
	height:20px;
	margin-top:-10px;
	background:#fff;
}

#toggle a:before, #toggle a:after{
	display:block;
	content:"";
	position:absolute;
	top:50%;
	left:10px;
	width:20px;
	height:4px;
	background:#421e04;
}

#toggle a:before{
	margin-top:-6px;
}

#toggle a:after{
	margin-top:2px;
}

/*------------------------------------------------------------
	top_img
------------------------------------------------------------*/
#viewer{
	clear:left;
	margin:0 auto;
	width:100%;
	height:500px;
	text-align:left;
	overflow:hidden;
	position:relative;
	background:#000;
}

#viewer img{
	margin:0;
	padding:0;
	top:0;
	left:0;
	width:100%;
	height:500px;
	object-fit:cover;
	position:absolute;
}

/*------------------------------------------------------------
	footer menu
------------------------------------------------------------*/
#footer_menu{
	clear:left;
	display:none;
	width:100%;
	height:80px;
	background:#421e04;
}

/*------------------------------------------------------------
	footer
------------------------------------------------------------*/
footer{
	clear:left;
	width:100%;
	height:330px;
	background:#421e04;
}

footer section{
	clear:left;
	margin:0 auto;
	width:90%;
	text-align:center;
}

footer #left{
	width:100%;
}

footer #right{
	margin-top:20px;
	margin-left:0;
	width:100%;
}

footer #tel a{
	display:block;
	margin:0 auto;
	margin-top:10px;
	padding:10px 0;
	width:80%;
	color:#fff;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:16px;
	text-decoration:none;
	border:#623311 1px dotted;
	-webkit-transition:0.4s;
	transition:0.4s;
}

footer #tel a:hover{
	color:#FFF;
	background:#623311;
}

/*------------------------------------------------------------
	footer img
------------------------------------------------------------*/
#footer_img{
	clear:left;
	display:block;
	width:100%;
	height:auto;
}

#footer_img img{
	width:100%;
}


}