@charset "utf-8";

/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
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, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	vertical-align: middle;
}
:focus {outline: 0;}

ol, ul {list-style: none;}
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img {border: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

/**** Clearfix ****/
nav .panel:after, nav#mainNav:after,  .bg:after, nav#mainNav .inner:after{content:""; display: table;clear: both;}
nav .panel,nav#mainNav,nav#mainNav .inner{zoom: 1;}

body{
	font-family: "メイリオ","Meiryo",arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	font-size: 14px;color:#333;
	-webkit-text-size-adjust: 100%;
	background:#fff;

  box-sizing : border-box;

}


/* レイアウト
------------------------------------------------------------*/
#wrapper{
	margin:0 auto;width:960px;
	overflow : hidden ;
}

#header {
	overflow:hidden;
	background: #007d1d;
}

#content{
	float:right;
	width:100%;
	margin-right:auto;margin-left:auto;
	font-size: 130%;
}

#footer{
	clear:both;
} 
 
/* タイトルエリア */

#head-in {
	padding: 8px 2em;
	text-align: center;
}
h1 {
	font-size: 140%;color: #ffffff;
	margin: 0;
}

h2 {
	font-size: 120%;
	text-align: left;
	border-left: solid 4px #00008b;
	border-bottom: 2px solid #1e90ff;
	padding: 4px 6px 0 20px;
	margin: 1.5em 0;
	width: 88%;
}
h5 {
	font-size: 100%;
	text-align: left;
	margin-left:2%;
	margin-bottom: -1%;
}
h6 {
	font-size: 80%;
	text-align: left;
	margin-left:2%;
	margin-bottom: -1%;
}
.hyo{
	clear:both;
	width:98%;
	} 
.hyo2{
	clear:both;
	width:100%;
		margin-right:auto;margin-left:auto;
	} 

/* フォームテーブル内の設定 */

#form-tbl {
	margin-left: 2%;margin-right:1%;
		width: 98%;
}

#form-tbl2 {
	margin-left: 2%;margin-right:0;
		width: 95%;
}
#form {
	border-collapse: collapse;
	font-size: 85%;
	width: 96%;
	margin-top: 1em;
	margin-right: 0;
	margin-bottom: 1em;
	margin-left: 0;
}
#form th, #form td {
	border: 1px solid #666;
	padding: 2px; padding-left:2%;
}
#form th {
	white-space: nowrap;
	background: #f0f8ff; padding-left:2%;
}
#form td {
	background: #fff; padding-left:2%;
}
p.btn input {
	width: 110px;
	height: 32px;
}
/* 強制改行の設定 */
.br-sp1 { display:none; }
.br-sp { display:none; }

#boxWrap {
	padding-top:20px;
  overflow: hidden;
  color:#fff;
  height:auto;
}

.boxCh {
	float: left;
	width: 46%;	height:auto;
	margin-right:2%;margin-left:2%;
}
.entry2 {
	width: 95%;
  	background-color:#dbebc4;
	float: left;padding:1%;
	margin-bottom:2%;
}


/* for message */
p.msg {
	color: #dd0000;
	margin: 2em;
}
span.msg {
	color: #dd0000;
}

/* for back-button */
form.back {
	margin-top: 2em;
}

/*　フッター　　*/
#footer {
	background:#3c7170;
	text-align:center;
	color: #FFFFFF; font-size: 100%;
	clear:both;
	overflow:hidden;
	padding: 10px 0 10px 0;
	position:relative;
    bottom: 0;
    width: 100%;
}


/* メインメニュー　PC用
------------------------------------------------------------*/
@media only screen and (min-width: 1025px){

	#content{clear:both;width:95%;float:none;margin:0 auto;padding:10px 0;
		margin-right:auto;margin-left:auto;
	}
}

/* 1024px以下
------------------------------------------------------------*/
@media only screen and (max-width: 1024px){

	#content{
	clear:both;width:95%;float:none;
	margin-right:auto;margin-left:auto;
	font-size: 120%;
	} 
	
/* 900px以下
------------------------------------------------------------*/
@media only screen and (max-width: 900px){
	#content{;width:85%;
	margin-right:2%;margin-left:3%;
	} 
.boxWrap {
	width: 98%;
}
	.boxCh {
	width: 45%;
}



/* 800px以下
------------------------------------------------------------*/
@media only screen and (max-width: 800px){
	#content{
	float:left;	width:80%;
	margin-right:2%;margin-left:3%;
	font-size: 120%;
	} 
	#form {
	width: 93%;
}
.boxWrap {
	width: 95%;
}
	.boxCh {
	width: 95%;
	margin-left: 2%;
} 

}

/* 700px以下から 1カラム表示
------------------------------------------------------------*/
@media only screen and (max-width: 700px){
  	#wrapper, .inner{width:100%;}
	#header{width:100%;}
	h1{padding:0 1%;width:98%}
	#content{clear:both;width:98%;
	float:none;margin:2%;}
	.hyo{
	clear:both;
	width:98%;	} 
		#form {
	width: 95%;
}
		textarea {width: 95%}
	input.text1 {width: 60%}
	input.text3 {width: 65%}
	
	table th, table td {
	width: 95%; /* テーブルの見出しの横幅を指定する */
	display: block; /* ブロックレベル要素化する */
	}
	#form-tbl2 {
	margin-left: 2%;margin-right:0;
		width: 98%;}
	
  .br-sp1 { display:block; }/* 改行：h2 タイトル */
  .br-sp { display:block; }/* 改行：tbl内の項目名 */
.boxWrap {
	width: 100%;
}

  .boxCh {
	width: 98%;}
}


/* スマホ用 */
@media only screen and (max-width: 480px) 
{
	#body { margin-left: 0; }
	#content{
  	width:95%;margin-left: 2%;margin-right: 2%; }
	/* 投稿フォーム */
	#form-tbl { margin: 0 auto; text-align: center; }
	#form { width: 96%; margin: 2% ; }
    #form th, #form td {
    	text-align: left;
        display: block;
        padding: 6px 3px;
        border-top: none;   }
    #form tr:first-child th	{ border-top: 1px solid #666; }
    p.btn input { width: 10em; }
	/* 小見出し */
	h2 { margin: 1em 3px; width: 90%; }
	.boxCh {
	width: 98%;
	margin-left: 2%;
}
	.br-sp1 { display:block; }/* 改行：h2 タイトル */
	.br-sp { display:block; }/* 改行：tbl内の項目名 */

}

@media only screen and (max-width: 400px) {
	#content{
  	width:98%;margin-left: 1%; }
	#form { width: 98%; margin: 1% ; }
	.entry2 {
		width: 98%;}
     
	.boxCh {
		width: 98%;	margin-left: 1%;margin-right: 1%;
}
	.br-sp1 { display:block; }
	.br-sp { display:none; }

}