@charset "UTF-8";
body,html{
    height: 100%;
}
#main #content h1 {
	display: none;
}
#content #subtitle .sub {
	color: #666666;
	font-size: 0.6rem;
	padding-left: 7%;
}
#main #content #subtitle {
	display: block;
	margin-top: 5%;
	margin-bottom: 3%;
	position: relative;
}
#content #subtitle .title {
	color: #666666;
	font-size: 1.5rem;
	padding-left: 7%;
	position:relative;
	line-height:2rem;
}
#rogomark {
	width: 8%;
	position:absolute;
	bottom:0%;
	left:90%;
	}
#subtitle :before{
    display: block;
    content: "";
    position: absolute;
    top: 40%;
    left: 0%;
    width: 4%;
    margin-top: -5%;
	padding-top: 3%;
	padding-bottom: 8%;
    background: #8cc63f;
  }
#main #content .hr {
	width: 100%;
	height: 0.1rem;
	background-color: #8cc63F;
	margin-top: 0.15rem;
	z-index:10000;
}
#mainset {
	margin-top: 2rem;
	float: left;
	position: relative;
	overflow:visible;
}
#mainset figure  {
	overflow:visible;
	z-index:10000;
}
#mainset figure img {
	width: 90%;
	height: auto;
	border: 0.1rem solid #A5A5A5;
	border-radius: 1px;
	-moz-transition: -moz-transform 0.2s linear;
    -webkit-transition: -webkit-transform 0.2s linear;
    -o-transition: -o-transform 0.2s linear;
    -ms-transition: -ms-transform 0.2s linear;
    transition: transform 0.2s linear;
	z-index:1000000000;
	overflow:visible;
}
#mainset figure img:hover {
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-o-transform: scale(1.5);
	-ms-transform: scale(1.5);
	transform: scale(1.5);
	overflow:visible;
}
#content #mainset h2 {
	display: none;
}
#discriptionTitle {
	font-size: 1rem;
	color: #8cc63f;
	border: 0.15rem solid #8cc63f;
	width: 100%;
	line-height: 1.5rem;
	height: 1.5rem;
	top: 0%;
}
#mainset a img {
	width: 60%;
	height: auto;
	margin-top: 1rem;
}
#discription {
	margin-top:1rem;
	font-size: 0.8rem;
	top: 3rem;
	text-align: justify;
	line-height: 1.2rem;
}
#use {
	color: #8cc63f;
	padding-top: 1rem;
}
#content #subset h2 {
	display: none;
}
#subset a img {
	height: auto;
	margin-top: 1rem;
}
#horizon {
	border-bottom: 0.1rem dotted #7B7B7B;
	clear: both;
	height: 2rem;
	margin-bottom:0.5rem;
}
#left {
	width: 60%;
	float: left;
}
#right   {
	width: 40%;
	float: left;
}
#kochira {
	position:relative
}
#kochira2 {
	position:relative
}
.kochira{
	font-size: 0.9rem;
	display: table-cell;
	height: 2.5rem;
	line-height: 2.5rem;
	position: absolute;
	right: 0;
	background-color: #8cc63f;
	color: #fff;
	padding-left: 1rem;
	padding-right: 1rem;
	border: 0.1rem solid #d3e9b6;
	}
#content .kochira .triangle {
	font-size: 1.5rem;
	float: left;
	color:#f8bc7c;
}
.sankaku{
	width: 0;
	height: 0;
	border-top: 0.5rem solid transparent;
	border-right: 0.8rem solid transparent;
	border-left: 0.8rem solid #f00;
	border-bottom: 0.5rem solid transparent;
	flaot: right;
}
#right a img {
	width: 100%;
}
#subset {
	padding-top:6rem;
	}
#subset #left2 #Draft {
	font-size: 1rem;
	color: #8cc63f;
	border: 0.15rem solid #8cc63f;
	width: 95%;
	line-height: 1.5rem;
	height: 1.5rem;
	margin-bottom: 1rem;
}
#content #subset #left2 {
	width: 40%;
	margin-right:5%;
	float: left;
}
#left2 a img {
	width: 90%;
}
#subset #left2 .maru {
	width: 0.8rem;
	height: 0.8rem;
	border-radius: 0.4rem;
	background-color: #575757;
}
#subset #left2 .dr1 {
	font-size: 0.8rem;
	margin-left: 1rem;
	margin-top: -1rem;
	line-height: 1rem;
	margin-bottom: 1rem;
}
#subset #left2 .dr2 {
	font-size: 0.8rem;
	line-height: 1rem;
	margin-bottom: 1rem;
}

#content #subset #right2 {
	width: 55%;
}
table, th, td {
    border: 1px #B3B3B3 solid;
}
th {
	background-color: #736357;
	color: #fff;
	font-size: 0.8rem;
	font-weight: normal;
	width: 30%;
	vertical-align: middle;
}
td {
	font-size: 0.8rem;
	text-align: center;
	vertical-align: middle;
}
th, td {
	height: 2.5rem;
	line-height: 2.5rem;
}
.br {
	line-height: 1rem;
	padding-top:0.2rem;
	padding-bottom:0.2rem;

}
#annotation {
	font-size: 0.8rem;
	line-height: 0.8rem;
	color: #EA053C;
	font-weight: normal;
}
#annotation2 {
	font-size: 0.8rem;
	line-height: 1.5rem;
}
#main #content #portableDiscription img {
	width: 100%;
}
#main #content #subset {
	padding-bottom: 3rem;
}

#downroadBtn:hover img {
	opacity:0.5;
}
#downroadBtn {
	display:block;
}
#downroadBtn img {
	transition-property:all;
	transition-duration:0.3s;
}
#contactBtn{
	display:block;
	}
#contactBtn img{
	transition-property:all;
	transition-duration:0.3s;
	}
#contactBtn:hover img{
	opacity:0.5;
}
#kochira {
	transition-property:all;
	transition-duration:0.3s;
}
#kochira:hover {
	opacity:0.5;
}
#subtitle .title br {
	display: none;
}
@media screen and (max-width: 870px){
	th {
	background-color: #736357;
	color: #fff;
	font-size: 0.7rem;
	font-weight: normal;
	width: 30%;
	vertical-align: middle;
}
td {
	font-size: 0.7rem;
	text-align: center;
	vertical-align: middle;
}
#annotation {
	font-size: 0.7rem;
	line-height: 0.8rem;
	color: #EA053C;
	font-weight: normal;
}
#annotation2 {
	font-size: 0.7rem;
	line-height: 1.5rem;
}
	}
@media screen and (max-width: 680px){
	#left {
	width: 100%;
	float: none;
}
#discriptionTitle {
	width: 90%;
}
#right   {
	width: 100%;
	float: none;
}
#content #subset #left2 {
	width: 100%;
	float: none;
}
#content #subset #right2 {
	width: 100%;
}
#subtitle .title br {
	display: block;
}
#rogomark {
	width: 15%;
	bottom:0%;
	left:85%;
	}
#discription {
	font-size: 1rem;	
}
#subset #left2 .dr1 {
	font-size: 1rem;
	line-height:1.5rem;
}
#subset #left2 .dr2 {
	font-size: 1rem;
	line-height:1.5rem;
}

	}