@charset "UTF-8";

/* --------------------------------
 * base
 * -------------------------------- */
html {
  font-size: 62.5%;
}
body {
  background: #ffffff;
  background-size: cover;
  color: #333;
  text-align: center;
  font-size: 1.5rem;
  font-family: 'Roboto', "Hiragino Kaku Gothic ProN", "YuGothic", Meiryo, "メイリオ", sans-serif;
}
*, *::before, *::after {
  box-sizing: border-box;
}
a:link, a:visited{
  text-decoration:none;
  color:#69913b;
}
a:hover, a:active{
  text-decoration:none;
  color:#8cc220;
  transition: all 0.3s;
}
a:link.link2, a:visited.link2{
  text-decoration:none;
  color:#333;
}
a:hover.link2, a:active.link2{
  text-decoration:none;
  color:#8cc220;
  transition: all 0.3s;
}

/* --------------------------------
 * scrollTop
 * -------------------------------- */
.scrollTop {
    /* 表示位置を固定 */
  position: fixed;
  bottom: 50px;
  right: 30px;
  z-index: 9999;
  color: #5d5e5d;
  font-size: 7rem;
  text-decoration:none;
  opacity: 0.8;
}
.scrollTop:hover {
  opacity: 0.5;
  transition: all 0.3s;
  text-decoration:none;
}

@media (max-width: 567px) {
.scrollTop {
  bottom: 30px;
  right: 5px;
  font-size: 5rem;
}
}
/* --------------------------------
 * header
 * -------------------------------- */
.header {
  padding: 10px 30px 10px;
background-image:url("http://www.gardenersnet.or.jp/comp/bgheader.png") no-repeat bottom;
  background-size:100% 100%; 
} 
@media (max-width: 567px) {
.header {
  padding: 10px 3px 10px;
  background: url('http://gardenersnet.or.jp/comp/bgheader-smartphone.png') no-repeat bottom;
  background-size:100% 100%; 
}
}

.logo {
  width: 350px;
  padding:/*30px*/ 10px 0 20px 0;
}

@media (max-width: 1000px) {
.logo {
  width: 300px;
} 
}

@media (max-width: 768px) {
 .logo {
  width: 260px;
}
}


.logo a:hover {
}
.address {
  font-size: 1.4rem; 
  color: #000;
}


/* --------------------------------
 * contents
 * -------------------------------- */

.contents {
  padding: 10px 30px 10px;
  color: #333;
  background: #ffffff;
}
@media (max-width:768px) {
.contents{
  padding: 10px 0px 10px;
}
}

/* メールフォーム全体を囲うidタグ */
#contents_wrapper {
  display: table;
  width: 90%;
  margin: 5px auto 15px;
  background : #ffffff;

}
@media (max-width:768px) {
#contents_wrapper {
  width: 100%;
}
}

/* 入力フォームを囲うclassタグ */
.setting_section {
    margin-bottom : 0px ;
}

/* ボタンを囲うclassタグ */
.button_box {
    clear : both ;
    padding : 5px ;
    margin: 10px ;
    font-size: 100%;
    text-align : center ;
}

/* 赤文字を表示するためのclassタグ */
.red_txt {
    color: #d70029;
}

/* 左詰の文字を表示するためのclassタグ */
.left_txt {
    text-align : left;
}

/* 説明文を表示するためのidタグ */
#txt_explain {
    color: #000000;
}

/* コンテンツ内の[p]タグ */
#contents p {
    margin-bottom : 1em ;
    text-align : left ;
}

/* コンテンツ内の[h3]タグ */
#contents h3 {
    border-left : 10px solid #69913b;
    border-bottom : 1px solid #69913b;
    color: #69913b;
    padding : 5px 10px 5px 6px ;
    text-align : left ;
    font-size : 125% ;
    margin-bottom : 10px ;
}

/* コンテンツ内の内部タグ */
#contents .inner {
    padding : 0 15px ;
}
@media (max-width:768px) {
#contents .inner {
    padding : 0 5px ;
}
}

/* コンテンツ内のフォームに使用する[table]タグ */
#contents table {
 
    border-collapse : collapse ;
    border: 1px solid #cccccc;
    margin: 0 0 1.5em;
    width: 90%;
}
@media (max-width:768px) {
#contents table{
    width: 100%;
}
}


/* コンテンツ内のフォームに使用する[th]タグ */
#contents table th {
	width: 30%;
	border: 1px solid #cccccc;
	font-size: 100%;
	background: #97B174;
	color: #ffffff;
	text-align: center;
	vertical-align: middle;
	padding:10px 5px;
}
@media (max-width:768px) {
#contents table th{
	display: block;
	width: 100%;
}
}

/* コンテンツ内のフォームに使用する[td]タグ */
#contents table td {
	width: 60%;
	border: 1px solid #cccccc;
    text-align : left ;
	font-size: 100%;
	background: #EEF3EA;
	text-align: left;
	vertical-align: middle;
	padding:10px 5px;
}


@media (max-width:768px) {
#contents table td{
	display: block;
	width: 100%;
	padding:20px 5px;
}
}



/* フォーム全体 */
#main_table * {
	font-family :  'Roboto', "Hiragino Kaku Gothic ProN", "YuGothic", Meiryo, "メイリオ", sans-serif;
}

/* フォーム内の入力欄 */
#main_table input {
    width : 100% ;
  padding: 3px 0px;
}

/* フォーム内の入力欄 */
#main_table textarea {
    width : 100% ;
  padding: 3px 0px;
}

/* --------------------------------
 * footer
 * -------------------------------- */
.footer {
  font-size: 1.3rem;
  position: fixed;
  bottom: -1px;
  right: 0px;
  width: 100%;
    padding : 5px 0px;
  background: #69913b;
  color: #fff;
}

@media (max-width: 567px) {
.footer {
  font-size: 0.8rem;

}
.footer-nav,
.footer-nav2 {
  font-size: 1.2rem;
  letter-spacing: 0px;
}
}