@charset "UTF-8";

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

body {
	margin: 0px 0px 0px 0px; /*外側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる*/
	padding: 0px 0px 0px 0px; /*内側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる*/
	background-color:#ffffe5;/*背景色*/
	background-image:url(../images/logo-2.png);
}
a { /*リンクの文字色*/
	color: #ff8888; 
}
a:hover { /*リンクにマウスカーソルを乗せた時の色*/
	color: #ffa8a8;
}
.wrapper {
	width: 800px; /*幅指定。pxの数値を変えると幅が変化*/
	border-left: 1px solid #c3bab2; /*左側の縦線。pxの数値を変えると太さが変化*/
	border-right: 1px solid #c3bab2; /*右側の縦線。pxの数値を変えると太さが変化*/
	background-color:#ffffff; /*背景色*/
	margin: 0px auto 0px auto; /*外側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる。左右をauto指定するとセンター揃えになります。*/
}


/* ヘッダー：ロゴ、タイトルなどがあるページの先頭 */
.header {
	background-image:url(../images/head.jpg);
}
.header_primary { 
	overflow: hidden; /*範囲内に内容が入りきらない場合に、はみ出た部分の表示の仕方を指定。hidden指定するとはみ出た部分は表示されない。*/
	height: 150px; /*高さ指定。pxの数値を変えると高さが変化*/
}
#logo { /*ロゴの位置を指定*/
	float: left; /*指定された要素を左または右に寄せて配置。後に続く内容なその反対側に回り込む。*/
	margin: 20px 30px 0px 40px; /*外側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる*/
}
.header_sub {
	float: left; /*指定された要素を左または右に寄せて配置。後に続く内容なその反対側に回り込む。*/
	margin: 40px 40px 0px 0px; /*外側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる*/
	text-align: right; /*文字の位置や、均等割付を指定。left,right,center,justify.justifyで均等割付ができる。*/
	color: #53280b; /*文字色の指定*/
}
.header_name {
	font-size: 36px; /*文字サイズ指定。pxの数値を変えると文字サイズが変化*/
	font-family: 'Josefin Sans', sans-serif; /*フォントの種類の指定*/
	margin:20px 0px 0px 0px; /*外側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる*/
}
.header_namesub {
	font-size:20px;/*文字サイズ指定。pxの数値を変えると文字サイズが変化*/
	font-family: 'Josefin Sans', sans-serif; /*フォントの種類の指定*/
}


/*メニューバー：ヘッダー下のメニュー*/

#nav {
	width: 100%; /*幅指定。%の数値を変えると幅が変化*/
	height: 60px; /*高さ指定。pxの数値を変えると高さが変化*/
	background-image: url("../images/menu.jpg") /*メニューバーの背景画像*/
}

#nav ul li {
	list-style:none; /*リストの先頭に表示するマーカーに関する指定*/
	float: left; /*指定された要素を左または右に寄せて配置。後に続く内容なその反対側に回り込む。*/
	width: 120px; /*親メニューの幅*/
	height: 60px; /*親メニューの高さ*/
	line-height:60px; /*行の高さの指定。負の値を指定することはできません。*/
	font-weight:bold; /*フォントの太さの指定*/
	text-align: center; /*文字の位置や、均等割付を指定。left,right,center,justify.*/
	background:#028760; /*親メニューの背景色*/
	color:#ffffff /*親メニューの文字色*/
}

#nav ul li a { /*親メニューのリンクの指定*/
	display: block;
	width: 120px; /*親メニューのリンクの幅*/
	height: 60px; /*親メニューのリンクの高さ*/
	color: #ffffff; /*親メニューのリンクの文字色*/
	font-size: 18px; /*親メニューのリンクの文字サイズ*/
	text-decoration:none; /*テキストに下線、上線、打消し線を付ける。*/
}

#nav ul li:hover,
 #nav ul li a:hover { /*親メニューのリンクにマウスカーソルを乗せた時の色*/
	background:#e0ffc1;/*マウスカーソルを乗せた時の親メニューの背景色*/
	color:#ffffff;/*マウスカーソルを乗せた時の親メニューの文字色*/
}

#nav ul li a:hover {
	background: #a3d6cc; /*マウスカーソルを乗せた時のメニューの背景色*/
	color: #000000; /*マウスカーソルを乗せた時のサブメニューの文字色*/
}
#nav ul li ul {
	display: none;
	margin:0px;
	padding:0px;
}
#nav ul li a:hover {
	background:#e0ffc1; /*ホバー時のメニューの背景色*/
	color: #000000; /*ホバー時のサブメニューの文字色*/
	border-top:1px solid #fff;
}

#nav ul li:hover ul {
	display: block;
	position:relative;
	width: 120px;
	height: 60px;
}
#nav ul li ul li {
	background:#028760; /*サブメニューの背景色*/
}

#nav * { /*マウスカーソルを乗せた時のアニメーションの指定*/
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-ms-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}
#nav p {
	font-size: 18px; /*親メニューのリンクの文字サイズ*/
	text-decoration:none; /*テキストに下線、上線、打消し線を付ける。*/
	margin:0px;
}
#nav p:hover {
	color:#000000;
}



/* メイン */
.main {
	overflow: hidden;
	padding: 10px 20px 10px 20px; /*内側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる*/
	background-color:#ffffff; /*背景色*/
}
.main p { /*main要素内のpタグの指定*/
	margin:10px 0px 0px 0px;/*外側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる*/
}



/* フォーム */

form{
	margin: 0 auto;
	width:525px;
	padding: 25px;
}
label{
	width:100px;
	font-size:16px;
}
div#name {
	float:right;
}
input,textarea{
	font: 25px sans-serif;
	width: 350px;
	-moz-box-sizing: border-box;
	box-sizing:border-box;
	border: 1px solid #999;
}
input,text {
	font-size: 16px;
	margin-top:10px;
	position: relative;
	margin-left:70px;
}
input,email {
	margin-top:5px;
	position: relative;
	margin-left:20px;
}
input:focus,textarea:focus {
	border-color: #000;
}
textarea {
	vertical-align: top;
	height: 150px;
	resize: vertical;
	font-size: 16px;
	margin-left:154px;
	margin-top:10px;
}
message {
	margin-right:100px;
}
div#submit {
	float:left;
	width:100px;
	margin-left: 230px;
}

div#reset {
	float:right;
	width:100px;
	margin-left: 340px;
}

button {
	margin-top:10px;
	width:90px;
}
h1{
	font-size:20px;
	margin-top:20px;
	margin-left:30px;
}
.mail {
	vertical-align:-50px;
	margin-left:10px;
	margin-right:10px;
}


/* フッター：ページ下部に設けられた定型的な情報を記すための領域 */
.footer {
	padding: 10px 20px 40px 20px; /*内側の余白。上、右、下、左の順番で、pxの数値を変えると余白ができる*/
	background-color:#f0fff0; /*ヘッダーの背景色*/
	text-align:center; /*文字の位置や、均等割付を指定。left,right,center,justify.*/
	font-weight:bold;
}
.footer p {
	font-size:16px; /*文字サイズ。pxの数値を変えると文字サイズが変化*/
	font-weight:normal;
	line-height:1.5em;
}
.copyright {
	text-align:center; /*文字の位置や、均等割付を指定。left,right,center,justify.*/
	font-size:16px; /*文字サイズ。pxの数値を変えると文字サイズが変化*/
	font-weight:normal;
}
label {
	font-weight: bold;
}
.privacy h1{
	font-size: 25px;
}
.privacy h2{
	font-size: 20px;
	padding-left: 25px;
}
.privacy p{
	padding-left:40px;
}
.privacy a{
	font-size: 20px;
	font-weight: bold;
	color: #1f3134;
}
.privacy a:hover{
	font-size: 20px;
	color: #00a497;
}
.back{
	text-align: center;
}