@charset "UTF-8";

/*************************************************
	layauto
**************************************************/
body{
  background: url(../img/bg.png) repeat;
  color:#333;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height:1.5;
  font-size: 1.6rem;
	width: 100%;
	height:100%;
}

html, body {
  height: 100%;
}

.wrapper {
  position: relative;
  width: 100%;
  height: auto !important;
  height: 100%;
  min-height: 100%;
}

#main {
  padding-bottom: 210px;
}
.row{
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}
.t-c{
  text-align: center;
}
@media screen and (max-width: 640px) {
  #main {
    padding-bottom: 0;
  }
  img{
  	max-width: 100%;
  	height: auto;
  	width /***/:auto;　
  }
  .row{
    padding:0 4%;
  }
}
/*************************************************
	2カラム
**************************************************/
.column-right,.column-left{
  float: left;
}
.column-right{
  width: 70.2%;
}
.column-left{
  width: 29.8%;
}
@media screen and (max-width: 640px) {
  .column-right,.column-left{
    float: none;
  }
  .column-right{
    width: 100%;
  }
  .column-left{
    width: 100%;
  }
}

/*footer
---------------------------------*/

#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 70px 0 30px 0;
  background: url(../img/division_border.png)repeat-x top;
}
.footer-inner{
  position: relative;
}
.footer-inner ul{
  margin-bottom: 30px;
}
.footer-inner li{
  display: inline-block;
}
.footer-inner li:not(:last-child){
  margin-right: 70px;
}

.footer-inner li a{
  color: #333;
  font-size: 1.4rem;
}
.footer-inner li a:hover{
	color: #009944;
}
#copy{
  font-size: 11px;
  text-align: center;
}
.footerLogo{
  position: absolute;
  top: -120px;
  left: 50%;
  margin-left: -50px;
}
.footerLogo img{
  width: 100px;
}
@media screen and (max-width: 640px) {
  #footer {
    position: static;
    padding: 15% 0 4% 0;
  }
  .footer-inner ul{
    margin-bottom: 4%;
    text-align: center;
  }
  .footer-inner li{
    display: inline-block;
    margin-bottom: 3%
  }
  .footer-inner li:not(:last-child){
    margin-right: 3%;
  }
  .footerLogo{
    width: 100px;
    position: absolute;
    top:-110px;
    left: 50%;
    margin-left: -50px;
  }
}
/*ボタン
---------------------------------*/
.bt {
  text-align: center;
}
.bt a{
  font-size: 1.8rem;
  display: inline-block;
}
.bt-typ0 a{
  border-radius: 25px;
  color: #009944;
  border: 2px solid #009944;
  padding: 10px 45px;
}
.bt-typ0 a:hover{
  color: #fff;
  background: #009944;
}
.bt-typ01 a{
  border-radius: 25px;
  color: #fff;
  border: 2px solid #fff;
  padding: 10px 45px;
}
.bt-typ01 a:hover{
  color: #009944;
  background: #fff;
}
.bt-typ02 a{
  width: 100%;
  border-radius: 8px;
  border: 2px solid #009944;
  padding: 5px 0 15px 0;
}
.bt-typ03 a{
  background: #e63623;
  padding: 10px 130px;
  border-radius: 8px;
  box-shadow:0px 4px 0px 0px #a4271a;
  -moz-box-shadow:0px 4px 0px 0px #a4271a;
  -webkit-box-shadow:0px 4px 0px 0px #a4271a;
}
@media screen and (max-width: 640px) {
  .bt-typ03 a{
    width: 100%;
    padding: 3% 0;
  }
  .bt-typ03 img{
    width: 45%;
    vertical-align: middle;
  }
}

/*clearfix
---------------------------------*/
 .cf:after {
       content:".";
       display:block;
       height:0;
       clear:both;
       visibility:hidden;
}
/*menu
---------------------------------*/
ul.spnav{
  display: none;
}
@media screen and (max-width: 980px) {
	article {
		padding: 0 30px;
	}
	.inner {
		width: 100%;
		padding: 0 20px;
	}
	#global-nav ul li a {
		padding: 0 20px;
	}
	#top-head.fixed #global-nav ul li a {
		padding: 0 15px;
	}
}

@media screen and (max-width: 640px) {
  .menu{
    display: none;
  }
  #top-head .mob-logo {
  	display: block;
  }
	#top-head,
	.inner {
		width: 100%;
		padding: 0;
	}
	#top-head {
		top: 0;
		position: fixed;
		margin-top: 0;
	}
	/* Fixed reset */
	#top-head.fixed {
		padding-top: 0;
		background: transparent;
	}
	#mobile-head {
		width: 100%;
		height: 56px;
		z-index: 999;
		position: relative;
    background: url(../img/bg.png) repeat;
    border-bottom: 1px solid #d1c9be;
	}
	#top-head.fixed .mob-logo,
	#top-head .mob-logo {
		position: absolute;
		left: 13px;
		top: 5px;
		color: #009944;

	}
	#top-head .mob-logo img{
    height: 45px;
  }
	#global-nav {
		position: absolute;
		/* 開いてないときは画面外に配置 */
		top: -500px;
		background: #009944;
		width: 100%;
		text-align: center;
		padding: 10px 0;
		-webkit-transition: .5s ease-in-out;
		-moz-transition: .5s ease-in-out;
		transition: .5s ease-in-out;
	}
	#global-nav ul {
		list-style: none;
		position: static;
		right: 0;
		bottom: 0;
		font-size: 11px;
	}
	#global-nav ul li {
		display: block;
		position: static;
    font-size: 1.6rem;
	}
  #global-nav ul li:not(:last-child){
  	border-right:none;
    border-bottom: 1px dashed #b8ad9d;
  }
  ul.spnav{
    display: block;
  }
  #global-nav ul.spnav li span{
    display: block;
  }
  #global-nav ul li img{
    display: none;
  }
	#global-nav ul li:after  {
		display: none;
	}
	#top-head #global-nav ul li a,
	#top-head.fixed #global-nav ul li a {
		width: 100%;
		display: block;
		color: #fff;
		padding: 18px 0;
	}
	#nav-toggle {
		display: block;
	}
	/* #nav-toggle 切り替えアニメーション */
	.open #nav-toggle span:nth-child(1) {
		top: 11px;
		-webkit-transform: rotate(315deg);
		-moz-transform: rotate(315deg);
		transform: rotate(315deg);
	}
	.open #nav-toggle span:nth-child(2) {
		width: 0;
		left: 50%;
	}
	.open #nav-toggle span:nth-child(3) {
		top: 11px;
		-webkit-transform: rotate(-315deg);
		-moz-transform: rotate(-315deg);
		transform: rotate(-315deg);
	}
	/* #global-nav スライドアニメーション */
	.open #global-nav {
		/* #global-nav top + #mobile-head height */
		-moz-transform: translateY(556px);
		-webkit-transform: translateY(556px);
		transform: translateY(556px);
	}
  #top-head #global-nav ul.spnav li ul{
      background: #4c3432;
      border-top: 1px dashed #b8ad9d;
    }
  #top-head #global-nav ul.spnav li ul li:not(:last-child) {
    border-bottom: 1px dashed #b8ad9d;
  }
  #top-head #global-nav ul.spnav li ul li a{
      padding: 10px 0 !important;
      font-size: 1.4rem !important;
    }



}
