
/*基本的な要素*/


.font-mini{
font-size:80%;
}
img{width:auto;
	height:100%;}
.box img{
	max-height:1200px;
	height:100VH;
	min-width:600px;
	clear:both;
	border-radius:10px 0 0 10px}

A{	letter-spacing:0.01em;
	color:darkgreen;
	font-weight:normal;}

	/*構造*/


	article{
	overflow-x: scroll;
	overflow: hidden;
	display:flex;
	flex-wrap:no-wrap;
	height:100%;
	position:relative;
	text-align: center;
	width:auto;
	margin:0 auto;
	word-break:break-all}

	nav{position:relative;
	max-width:600px;
	width:auto;
	padding:0;}

	/*H要素*/
h1{
	border-style:none;
	line-height:20px;
	height:auto;
	top:0;
	margin:0 5px 0 5px;
	padding:0 0 5px 0;
	width:95%;
	left:5px;
	font-size:80%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	vertical-align:top;}

	/*ヘッダー*/
header{
position:fixed;
top:0;
	width:100%;
	left:0;
	background-color:#dcd3b2;
	height:auto;
	z-index:100;
	margin:0 100px 0 0;
	border:solid gray;
	border-width:0 0 1px 0;
	transition: top 0.3s ease;}

	.menutable{
padding:0;
height:auto;
width:100VW;}

.menutable tbody{padding:0;}
.menutable tr{margin:20px;}

/*入力画面の共通のスタイル*/
.caption{
font-size:110%;
width:90%;
height:100px;
resize: none;
border-radius: 10px; /* 角を10pxの円形にする */
  border: solid;
  margin:0 0 10px 0;
  border-width:1px;
  border-color:grey;
}

.name{
font-size:110%;
width:80%;
height:1em;
       border: solid;
     border-width:0 0 1px 0;
     border-color:grey;
}

.postButton {
display: inline-block;
  font-size:110%;
  width:50%;
  height: 50px;
  padding: 10px 20px;
  left:0;
  background-color:white;
	color:black;
	border-radius: 10px;
	vertical-align:middle;
     position:relative;
     border: solid;
     border-width:1px;
     border-color:gray;
}
.postButton:disabled {
  background-color:gray;
  opacity: 0.5;
}


/*カメラ*/
.cameraxbox{
display: block;
width:32px;
height:32px;
position:sticky;
margin:0 0 0 auto;
top:0;
}

#menushow {
	position:fixed;
	overflow: auto;
	padding:10px;
    left: 50%;
    transform: translate(-50%);
	background-color:#fff1cf;
	top:50px;
	width:90vw;
	box-sizing:border-box;
	max-width:550px;
	height:90vh;
    display: none;
    z-index:200;
    transition: all 0.3s;
	border-color:grey;
	border-radius:10px;
}
#labelfile{
background-color:white;
height:2em;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
border-radius: 10px; /* 角を10pxの円形にする */
  padding: auto;
  border: solid;
  margin:32px 0 10px 0;
  border-width:1px;
  border-color:grey;
  display:block;
}
#imagefile{
display: none;
}
#camerapreview{
height:200px;
width:auto;
}

.scroll_box{
	height:100VH;
	overflow-y: auto;
	overflow-x:clips;
}
/*アコーディオンテキストの要素*/
.accbox{
		display:flex;
	flex-wrap:no-wrap;
}

.accbox label {
position:relative;
    display: block;
    cursor :pointer;
    transition: all 0.9s;
}

.accbox .label_box{
width:80px;
height:100VH;
line-height:100VH;
font-size:200%;
font-weight:700;
vertical-align:middle;
text-align:center;}

.accbox .accshow {
	height:100VH;
    width:0;
    display:flex;
    overflow: hidden;
    opacity: 1;
    transition: all 0.9s;
}

.cssacc:checked + .accshow {
	clear:both;
    width: auto;
    transition: all 0.9s;
    opacity: 1;
}
.accbox .cssacc {
    display: none;
    }

   /*記事のスタイル*/
.box{
	position:relative;
	display:flex;
	float:left;
text-align: left;
margin:0 5px;
     border: solid;
     border-width:1px;
     border-color:gray;
     overflow:hidden;
border-radius: 10px;
background-color:white;
}
.box .comebox{
max-width:300px;
width:100VW;
background-color: #f3f3f3;
padding:10px 10px 20px 10px;
box-sizing:border-box;}
.box .comebox:nth-child(even) {
  background-color: white;
}

.come_form_box{
height:100%;
width:100%;
background-color: #f3f3e0;
     border: solid;
     border-width:0 0 0 1px;
     border-color:gray;
padding:10px;
box-sizing:border-box;
}
.box_name{
	color:black;
	font-weight:normal;
	text-decoration: none;
     border: solid;
     border-width:1px;
     border-color:gray;
     padding:5px;
}