@charset "UTF-8";

:root {
	font-size: 16px;
	}

html {
    scroll-padding-top: 180px;
}
header {
  position: fixed; /* 画面に固定する */
  top: 0;          /* 上端に配置 */
  left: 0;         /* 左端に配置 */
  width: 100%;     /* 横幅を全幅にする */
  z-index: 9999;   /* 他の要素より手前に表示する */
  background: #fff;
}
.container {
	background: #fff;
	max-width: 1023px;
	margin: 180px auto 0 auto;
	}

body,td,th {
	font-size: 16px;
	background: #fff;
	margin-top: 0;
}
a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	color: #dd0000;
}

/* 掲示板タイトル */
h1 {
	font-size: 150%;
	margin-bottom: 0;
	color: #555555;
	margin-top: 10px;
	text-align: center;
}
h1 a {
	text-align: center;
	margin: 0 auto 0 auto;
}
h1 img {
  width: 20%;
  }
/* 削除キー入力フォーム部の文字サイズ */
td.small {
	font-size: 70%;
}
/* メイン記事装飾 */
div.art {
	width: 92%;
	background: #fff;
	text-align: left;
	padding: 0.7em 0.7em 0.7em 1em;
	border: 1px solid #d4d4d4;
	margin: 1.2em auto;
	color: #555555;
}
.art input {
  height: 30px;
  width: 20%;
  margin: 3px 0 3px 0;
  border: 1px solid #bfbfbf;
  text-align: center;
  background: #f4f4f4;
  border-radius: 10px;
  padding: 5px 5px 5px 5px;
}
.art p {
  line-height: 150%;
  margin: 20px 0 20px 0;
  color: #555555;
}

/* メイン記事タイトル */
div.art strong {
	color: #cd5c5c;
}
/* メイン記事番号色 */
span.num {
	color: #cd5c5c;
}
/* 投稿フォーム */
table.regfm td, table.regfm th {
	padding: 0.1em;
	white-space: nowrap;
	text-align: left;
}
img.capt {
	vertical-align: middle;
}
div.obi {
	text-align: center;
	padding: 2px;
	background: #400000;
	color: #fff;
	font-weight: bold;
}
div.note {
	width: 97%;
	background: #fff;
	border: 1px solid gray;
	margin: 1em;
	padding: 6px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}
p.close {
	text-align: center;
	margin-top: 3em;
}
p.close input {
	width: 80px;
}
p.red {
	color: #dd0000;
}
div.key {
	float: left;
	width: 3.5em;
}
div.val {
	float: left;
}
td.oldlog {
	background: #fff;
}
div.val strong {
	color: #008000;
}

/* 写真枠デザイン設定 */
div.photo {
	border: 1px solid #2b0000;
	background: #4c4c4c;
	color: #fff;
	width: 270px;
	height: 200px;
	float: left;
	margin: 12px 5px;
}
/* 写真およびキャプション位置 */
p.image, p.caption {
	text-align: center;
	margin: 10px;
}
/* 画像廻り込み終了 */
.clear {
	clear: both;
}

/* アイコン位置 */
img.icon {
	vertical-align: middle;
	border: none;
	margin: 0 2px;
}
div.ttl {
	font-weight: bold;
	color: #572c00;
	border-bottom: 1px solid #572c00;
	padding: 2px;
}

/* 汎用画面寄せ */
.ta-r {
	text-align: right;
}
.ta-c {
	text-align: center;
	margin: 0 0 0 auto;

}
.ta-c02 {
	text-align: center;
	margin: 200px 0 0 auto;
	color: #555555;
	font-size: 16px;
}
/* 返信記事 */
div.reslog {
	margin: 0 0 0 auto;
	width: 92%;
	text-align: left;
	border-top: 1px dashed gray;
	padding: 6px;
}
div.rescom {
	margin: 20px 0 20px 0;
	line-height: 150%;
	color: #555555;
}

/* トピック画面 */
table.topic {
	border-collapse: collapse;
	width: 90%;
	margin: 5px auto 1em auto;
}
table.topic th {
	border: 1px solid #552b00;
	padding: 4px;
	background: #ffdab5;
}
table.topic td {
	border: 1px solid #552b00;
	padding: 4px;
	background: #fff;
}
.w-s {
	width: 3.5em;
}
.w-m {
	width: 12em;
}

/* 投稿・返信ボタン */
div.new-btn {
	width: 90%;
	text-align: left;
	margin: 6px auto;
}
div#addform {
	width: 90%;
	text-align: left;
	margin: 0 auto;
}
div.res-btn {
	width: 92%;
	text-align: left;
	margin: 1em auto;
}
div.find-form {
	width: 90%;
	text-align: left;
	margin: 0 auto;
}

/*
	ページ送り
	参考: http://css-happylife.com/template/page_nav/
*/
ul.pager {
	margin: 0 0 10px;
	padding: 10px 10px 5px;
}
ul.pager li {
	display: inline;
	margin: 0 2px;
	padding: 0;
}
ul.pager li span {
	display: inline-block;
	margin-bottom: 5px;
	padding: 5px 12px;
	background: #804040;
	color: #fff;
	border: 1px solid #aaa;
	text-decoration: none;
	vertical-align: middle;
}
ul.pager li a {
	display: inline-block;
	margin-bottom: 5px;
	padding: 5px 12px;
	background: #fff;
	color: #5b2e00;
	border: 1px solid #804040;
	text-decoration: none;
	vertical-align: middle;
}
ul.pager li a:hover {
	background: #ffc488;
}

.form-01 {
  margin: 10px 10px 10px 10px;
}
input {
  height: 40px;
  width: 50%;
  margin: 3px 10px 3px 0;
  border: 1px solid #bfbfbf;
  padding: 5px 5px 5px 10px;
}
.inp-long input {
  border: none;
}

.btn01 input {
  height: 40px;
  width: 25%;
  margin: 3px 10px 3px 0;
  border: 1px solid #bfbfbf;
  text-align: center;
  background: #f4f4f4;
  border-radius: 10px;
}

/*独自CSS*/

:root {
	--large-width: 1000px;
	--middle-width: 800px;
}




.form-01 p {
	margin: 0;
	padding: 0;
	text-align: left;
	font-size: 16px;
	line-height: 150%;
	color: #555555;
}

h2 {
  background: -webkit-linear-gradient(top, #e6a39d 0%, #cd5c5c 100%);
  background: linear-gradient(to bottom, #e6a39d 0%, #cd5c5c 100%);
  margin: 10px 0 10px 0;
  height: 30px;
  vertical-align: middle;
	width: 100%;
  color: #fff;
  text-shadow: 1px 1px 1px #000000;
  text-align: center;
  font-size: 16px;
  padding: 5px 0 3px 0;
  font-weight: 500;
}
h3 {
  margin: 20px 0 10px 0;
  height: 30px;
  vertical-align: middle;
  width: 100%;
  background: -webkit-linear-gradient(top, #e6a39d 0%, #BF6A7A 100%);
  background: linear-gradient(to bottom, #e6a39d 0%, #BF6A7A 100%);
  color: #fff;
  text-align: center;
  font-size: 16px;
  padding: 5px 0 3px 0;
  font-weight: 500;
}

textarea {
  width: 98%;
  margin: 10px 5px 10px 5px; 
  text-align: left;
  padding: 5px 5px 5px 10px;
  border: 1px solid #bfbfbf;
}

.small {
	font-size: 100%;
}

.a-btn {
	text-align: center;
	font-size: 16px;
}
.a-btn a {
	display: inline-block;
	margin: 10px 0 0 0; 
	padding: 10px 5px;
	border: solid 3px currentColor;
	border-radius: 6px;
	background: -webkit-linear-gradient(top, #e6a39d 0%, #BF6A7A 100%);
	background: linear-gradient(to bottom, #e6a39d 0%, #BF6A7A 100%);
	color: #fff;
	font-size: 14px;
	text-decoration: none;
}
.a-btn a:hover	{
	background: -webkit-linear-gradient(top, #BF6A7A 0%, #e6a39d 100%);
	background: linear-gradient(to bottom, #BF6A7A 0%, #e6a39d 100%);
}
.art img {
	margin: 0 5px 5px 0; 
}
.b-btn a {
	display: inline-block;
	margin: 5% 0 5% 85%; 

}

/* 基本設定： フォントサイズ */

@media (min-width: 600px) and (max-width: 799px) {
}

@media (max-width: 800px) {

h1 img {
  width: 40%;
  }

}

@media (max-width: 599px) {

input {
  width: 80%;
	}
.form-02 input {
  width: 50%;
  }

h2 {
  height: 30px;
  font-size: 16px;
  margin: 20px 0 10px 0;
}
.btn01 input {
  width: 40%;
}

}

@media (max-width: 480px) {
input {
  width: 95%;
}
h1 img {
  width: 60%;
  }
.btn01 input {
  width: 45%;
}

}

@media (max-width: 350px) {
.btn01 input {
  width: 60%;
}


}