@charset "utf-8";

/* --------------------------
コンテンツ
-------------------------- */
#contents  {
	width: 100%;
	max-width:900px;
	height:auto;
	padding: 0 0 0 0;
	margin: 0 auto;
	background-color: #fff;
	}
@media only screen and (max-width: 768px) {
#contents  {
	width: 100%;
	max-width:100%;
	padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  background-color: transparent;
	}
}

/* --------------------------
ヘッダー
-------------------------- */
#contents #header  {
width: 100%;
max-width:900px;
margin:0;
padding:0 0 10px 0;
background: transparent url(../images/common/header.jpg) repeat-y top center;
	}
#contents #header .h01  {
margin:5px 0 0 20px;
	}

#contents #header .h02  {
margin:12px -30px 0 20px;
	}
#contents #header .h02 img  {
margin:0 0 0 auto;
	}
#contents #header .h03  {
margin:10px 0 0 20px;
	}

@media only screen and (max-width: 768px) {
#contents #header .h02  {
margin:10px 20px 0 0px;
	}
	#contents #header .h02 img  {
margin:0 auto 0 20px;
	}
	#contents #header .h03  {
margin:10px 20px 0 0;
	}
}
	
/* --------------------------
ナビゲーション
-------------------------- */
#contents #navi  {
width: 100%;
margin:0;
padding:10px 0 ;
background: transparent url(../images/common/navi_bg.jpg) no-repeat top center;
	}

#contents #navi nav{
text-align: center;
}
#contents #navi nav ul{
margin: 0 ;
padding: 0 ;
}
#contents #navi nav li{
list-style: none;
display: inline-block;
/*width: 10%;
min-width: 90px;*/
padding:0 20px;
text-shadow: 2px 2px 2px #000;
}
#contents #navi nav li:not(:last-child){
border-right:1px solid #fff;
}
#contents #navi nav a{
text-decoration: none;
color: #fff;
font-size:180%;
font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}
#contents #navi nav a.current{
color: #ffff99;
}
#contents #navi nav a:hover{
color:#d3ceb2;
border-bottom:1px solid #d3ceb2;
}
@media only screen and (max-width: 895px) {
#contents #navi nav li{
padding:0 10px;
}
}


/* --------------------------
ハンバーガーメニューボタン
-------------------------- */
.hamburger {
  display : block;
  /*position: fixed;*/
  position: relative;
  z-index : 3;
  /*right : 24px;*/
  right : 0;
  top   : 15px;
  width : 42px;
  height: 42px;
  cursor: pointer;
  text-align: center;
  background : #3a341e;
}
.hamburger span {
  display : block;
  position: absolute;
  width   : 30px;
  height  : 2px ;
  left    : 6px;
  background : #fff;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition   : 0.3s ease-in-out;
  transition        : 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
  top: 10px;
}
.hamburger span:nth-child(2) {
  top: 20px;
}
.hamburger span:nth-child(3) {
  top: 30px;
}

/* スマホメニューを開いてる時のボタン */
.hamburger.active span:nth-child(1) {
  top : 20px;
  left: 6px;
  background :#fff;
  -webkit-transform: rotate(-45deg);
  -moz-transform   : rotate(-45deg);
  transform        : rotate(-45deg);
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
  top: 20px;
  background :#fff;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
}

/* メニュー背景　*/
nav.globalMenuSp {
  position: fixed;
  z-index : 2;
  top  : 0;
  left : 0;
  color: #fff;
  background: rgba( 58,52,30,0.9 );
  text-align: center;
  width: 100%;
  opacity: 0;
  display: none;
  transition: opacity .6s ease, visibility .6s ease;
}

nav.globalMenuSp ul {
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

nav.globalMenuSp ul li {
  list-style-type: none;
  padding: 0;
  width: 100%;
  transition: .4s all;
  font-size:160%;
}
nav.globalMenuSp ul li:last-child {
  padding-bottom: 0;
}
nav.globalMenuSp ul li:hover{
  background :#000;
}

nav.globalMenuSp ul li a {
  display: block;
  color: #fff;
  padding: 1em 0;
  text-decoration :none;
}

/* クリックでjQueryで追加・削除 */
nav.globalMenuSp.active {
  opacity: 100;
  display: block;
}



/* --------------------------
メインビジュアル
-------------------------- */
#contents #main_v_ct  {
width: 900px;
height:280px;
margin:0;
padding:0;
position: relative;
	}

/* --------------------------
footer
-------------------------- */
#contents .fb  {
width: 100%;
height:60px;
padding:0;
margin:0;
background: transparent url(../images/common/footer.jpg) repeat-y top center;
	}
#contents .fb .tel  {
text-align:left;
margin:10px 0 0 20px;
	}
	
#contents .fb .copyright  {
text-align:right;
margin:10px 20px 0 0;
	}
@media only screen and (max-width: 768px) {
#contents .fb  {
height:auto;
padding:0 0 10px 0;
	}
	#contents .fb .copyright  {
text-align:left;
margin:10px 0 0 20px;
	}
}
