@charset "utf-8";
/* CSS Document */

*{font-family: Meiryo, "Yu Gothic", sans-serif;margin:0;padding:0;box-sizing:border-box;
	quotes:none;text-decoration:none;font-optical-sizing:auto;list-style:none;color:#333333;font-style:normal;}

button,a{transition:0.3s;}
button:hover,a:hover{opacity:0.8;}

section{width:600px;margin:0 auto;}

@media (max-width:630px){
	section{width:97.5%;}	
}

.IndexHeader{text-align:center;padding:20px 0;}
.IndexHeader h1{font-size:20px;}

.IndexPost{background:#eeeeee;padding:5px 20px 20px 20px;border-radius:10px;}
.IndexPost h2{font-size:16px;margin:15px 0 3px 0;}
.IndexPost input[name="name"]{font-size:15px;padding: 5px 8px;width:100%;border:1px solid #cccccc;}
.IndexPost input[type="file"]{cursor:pointer;transition:0.3s;}
.IndexPost textarea{font-size:15px;text-align:justify;line-height:1.6;padding:5px 8px;width:100%;height:150px;min-height:150px;max-height:300px;resize:vertical;border:1px solid #cccccc;}
.IndexPost hr{border:none;height:1px;display:block;margin:30px 0 20px 0;width:100%;background:#999999;}
.IndexPost button{width:180px;display:block;text-align:center;padding:10px 0;background:#333333;margin:0 auto;border:none;color:#ffffff;cursor:pointer;font-size:14px;}
.IndexPost img{width:97.5%;margin:5px auto 0;border: 5px solid #ffffff;box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.3);display:block;}


.IndexHistory h3{font-size:18px;margin:40px 0 0 0;background:#666666;padding:5px;color:#ffffff;}
.IndexHistory ul{margin:20px 0 0 0;}
.IndexHistory li{margin:20px 0 0 0;border-bottom:2px dotted #999999;padding:0 0 20px 0;}
.IndexHistory li h4{font-size:16px;margin:0 0 5px 0;}
.IndexHistory li h5{font-size:14px;color:#666666;margin:0 0 5px 0;}
.IndexHistory li p{text-align: justify;line-height: 1.6;font-size:15px;word-break:break-all;}
.IndexHistory li img{width:97.5%;margin:5px auto 0;border: 5px solid #ffffff;box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.3);display:block;}
.IndexHistory li div{margin:10px 0 0 0;display: flex;gap:10px;justify-content: flex-end;}
.IndexHistory li form.IndexEdit{width:100px;}
.IndexHistory li form.IndexDekete{width:80px;}
.IndexHistory li form button{border-radius:0;;line-height:0;font-size:15px;text-align:center;display:block;width:100%;cursor:pointer;}
.IndexHistory li form.IndexEdit button{background:#666666;color:#ffffff;border:none;padding:15px 0 12px 0;}
.IndexHistory li form.IndexDekete button{border:2px solid #f00000;color:#f00000;background:#ffffff;padding:13px 0 11px 0;}

.IndexPager{margin:50px 0 0 0;text-align:center;}
.IndexPager li{display:inline-block;width:40px;margin:0 5px;}
.IndexPager li a{line-height:0;padding:20px 0 18px 0;color:#ffffff;font-weight:bold;background:#999999;display:block;}

.IndexFooter{padding:30px 0;}
.IndexFooter p{text-align:center;font-size:12px;font-weight:bold;}

.IndexLink{position:fixed;width:200px;display:block;text-align:center;padding:10px 0;background:#4682b4;margin:0 auto;border:none;color:#ffffff;cursor:pointer;
	font-size:14px;right:20px;bottom:20px;box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.3)}


.ViewHeader{text-align:center;padding:20px 0;width:97.5%;margin:0 auto;}
.ViewHeader h1{font-size:24px;margin:0 0 10px 0;}
.ViewHeader p{font-size:16px;line-height:1.6;}
.ViewHeader p a{color:#666666;text-decoration:underline;}

.ViewPost{margin:20px 0 0 0;}
.ViewPost li{margin:20px 0 0 0;padding:20px;background:#f8f8ff;border-radius:10px;box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.3);}
.ViewPost li h3{font-size:16px;margin:0 0 5px 0;background-image:url("images/icon-user.png");background-repeat:no-repeat;background-size:18px;background-position:left center;padding:0 0 0 22px;}
.ViewPost li h4{font-size:14px;color:#666666;margin:10px 0 0 0;background-image:url("images/icon-time.png");background-repeat:no-repeat;background-size:16px;background-position:left center;padding:2px 0 0 20px;}

.ViewPost li hr{background:#cccccc;height:1px;display:block;width:100%;margin:10px 0;border:none;}

.ViewPost li p{text-align: justify;line-height: 1.6;font-size:15px;word-break:break-all;}
.ViewPost li img{width:97.5%;margin:5px auto 20px;border: 5px solid #ffffff;box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.3);display:block;}

.ViewPager{margin:50px 0 0 0;text-align:center;}
.ViewPager li{display:inline-block;width:40px;margin:0 5px;}
.ViewPager li a{line-height:0;padding:20px 0 18px 0;color:#ffffff;font-weight:bold;background:#999999;display:block;}


.ViewFooter{padding:30px 0;text-align:center;width:97.5%;margin:0 auto;}
.ViewFooter h5{font-size:16px;}
.ViewFooter h6{font-size:14px;font-weight:normal;padding:10px 0  20px 0;}
.ViewFooter p{font-size:12px;font-weight:bold;}



@media (max-width:630px){
	.ViewHeader h1{font-size:20px;}
	.ViewHeader p{font-size:14px;line-height:1.6;}

	.ViewPost{margin:20px 0 0 0;}
	.ViewPost li{margin:20px 0 0 0;padding:15px;border-radius:5px;}
	.ViewPost li h3{font-size:14px;background-size:16px;background-position:left center;padding:0 0 0 20px;}
	.ViewPost li h4{font-size:13px;background-size:14px;background-position:left center;padding:2px 0 0 18px;}

	.ViewPost li p{text-align: justify;line-height: 1.6;font-size:13px;word-break:break-all;}


	.ViewFooter{padding:30px 0;text-align:center;width:97.5%;margin:0 auto;}
	.ViewFooter h5{font-size:16px;}
	.ViewFooter h6{font-size:14px;font-weight:normal;padding:10px 0  20px 0;}
	.ViewFooter p{font-size:12px;font-weight:bold;}
	
}