.logo {
    width: 70%;
    max-width: 500px;
}

html, body{
    margin: 0;         /* 余白の削除 */
    padding: 0;        /* 余白の削除 */
    width:100%;
    height:100%;
}
div#header-fixed
{
    background: #ffffff;
    position: fixed;            /* ヘッダーの固定 */
    top: 0px;                   /* 位置(上0px) */
    left: 0px;                  /* 位置(右0px) */
    width: 100%;                /* 横幅100%　*/
    height: 100px;              /* 縦幅140px */
    border-bottom: #7ECB5C 2px solid;
}
 
 
div#header-bk { 
	padding:20px 0 20px;       /* 上10px、下20pxをあける */
	height:110px;              /* 縦の高さ110px */
	width:100%;                /* 横の幅を100% */
}
 
 
div#header { 
	height: 100%;              /* 縦の表示領域はheader-bkと同じ */
    margin: auto;              /* 中央揃え */
    text-align: center;
}

.logo {
    width: 70%;
    max-width: 500px;
}

.separate {
    border-bottom: #7ECB5C 2px dashed;
    width: 80%;
    max-width: 750px;
    margin: 50px auto;
}

div#body-bk{
    padding:160px 0 160px 0;    /* 上下に160pxを余白を取る */
}
 
div#body{
    padding: 10px 0;
    margin:auto;
    text-align: center;
    font-size: 2em;
}


.myButton {
	-moz-box-shadow: 0px 10px 14px -7px #3e7327;
	-webkit-box-shadow: 0px 10px 14px -7px #3e7327;
	box-shadow: 0px 10px 14px -7px #3e7327;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77b55a), color-stop(1, #72b352));
	background:-moz-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background:-webkit-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background:-o-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background:-ms-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background:linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77b55a', endColorstr='#72b352',GradientType=0);
	background-color:#77b55a;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	border:1px solid #4b8f29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size: 1em;
	font-weight:bold;
    padding:10px 0px;
    margin: 20px 0;
    text-align: center;
    width: 500px;
	text-decoration:none;
    text-shadow:0px 1px 0px #5b8a3c;
}

.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #72b352), color-stop(1, #77b55a));
	background:-moz-linear-gradient(top, #72b352 5%, #77b55a 100%);
	background:-webkit-linear-gradient(top, #72b352 5%, #77b55a 100%);
	background:-o-linear-gradient(top, #72b352 5%, #77b55a 100%);
	background:-ms-linear-gradient(top, #72b352 5%, #77b55a 100%);
	background:linear-gradient(to bottom, #72b352 5%, #77b55a 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#72b352', endColorstr='#77b55a',GradientType=0);
	background-color:#72b352;
}
.myButton:active {
	position:relative;
	top:1px;
}

.screenshot-bk{
    margin: 100px 0;
}
.screenshot{
    padding: 20px ;
    width: 80%;
    max-width: 750px;
}


div#footer-fixed
{
    background: #46BE32;
    position: fixed;            /* フッターの固定 */
    bottom: 0px;                /* 位置(下0px) */
    left: 0px;                  /* 位置(左0px) */
    width: 100%;                /* 横幅100%　*/
    height: 80px;              /* 縦幅140px */
}
 
div#footer-bk
{
	height:80px;              /* 縦の高さ140px */
	width:100%;               /* 横の幅を100% */
}
 
div#footer { 
    height: 100%;              /* 縦の表示領域はheader-bkと同じ */
    line-height: 80px;
    text-align: center;
    margin: auto;              /* 中央揃え */
    font-size: 1.2em;
    color: #ffffff;
}

span {
    display: inline-block;
}

.form {
    display: flex;
}

.form-description {
}

.form-main {
    width: 80%;
    margin: 0 auto;
}

.form-input input {
    width: 100%;
    border: 1px solid grey;
    margin: 10px;
    height: 60px;
    font-size: 24px;
}

.form-submit button {
    font-size: 24px;
    width: 80%;
    display: block;
    margin: 40px auto;
    border-radius: 20px;
    background: #46be32;
    color: white;
}