@charset "utf-8";

#bodyArea {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	padding-top: 60px;
	background-image: none;
	padding-bottom: 130px;
}

#topPart {
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	padding-top: 100px;
	padding-bottom: 80px;
}

.logo {
	width: 30%;
}

.logo img {
	height: auto;
	width: 100%;
}

h1 {
	font-size: 32px;
	line-height: 200%;
	width: 62%;
	margin-left: 8%;
	font-weight: bolder;
	padding-top: 10vh;
}

#topBtn {
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}

.btnBox {
	background-color: #6F8DD5;
	width: 45%;
	margin-right: 1%;
	margin-left: 1%;
	padding-top: 20px;
	padding-bottom: 20px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}

.btnBox a {
	color: #FFF;
	text-decoration: none;
	text-align: center;
	font-size: 1.6vw;
	line-height: 130%;
	letter-spacing: 0.1em;
	display: block;
	transition:all 0.4s ease;
	font-weight: normal;
}


.btnBox:hover {
	opacity: 0.7;
	cursor : pointer;
}

.main_text {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	display:flex;
	flex-flow: column;
	margin-bottom: 20px;

}
.sub_text {
	width: 70%;
	font-size: 80%;
	margin-right: auto;
	margin-left: auto;
	display:flex;
	flex-flow: column;
	margin-top: 10px;
	margin-bottom: 20px;

}


.btnArea {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	display:flex;
	flex-flow: column;
    flex-direction: row;
}

@media screen and (max-width: 992px){ /*768*/

#bodyArea {
	width: 94%;
	margin-right: auto;
	margin-left: auto;
	padding-top: 20px;
	background-image: none;
	padding-bottom: 60px;
}

#topPart {
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	padding-top: 00px;
	padding-bottom: 20px;
}

.logo {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
}

.logo img {
	height: auto;
	width: 100%;
}

h1 {
	font-size: 4vw;
	line-height: 180%;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	font-weight: bold;
	padding-top: 2vh;
	padding-bottom: 2vh;
}

#topBtn {
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}

.btnBox {
	background-color: #6F8DD5;
	width: 48%;
	margin-right: 1%;
	margin-left: 1%;
	padding-top: 10px;
	padding-bottom: 10px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	margin-bottom: 2%;
}

.btnBox a {
	color: #FFF;
	text-decoration: none;
	text-align: center;
	font-size: 3vw;
	line-height: 130%;
	letter-spacing: 0.1em;
	display: block;
	transition:all 0.4s ease;
}


.btnBox:hover {
	opacity: 0.7;
	cursor : pointer;
}

.btnArea {
	width: 95%;
	margin-right: auto;
	margin-left: auto;
	display:flex;
	flex-flow: column;
    flex-direction: row;
}

.main_text {
	width: 95%;
}

.sub_text {
	width: 95%;
	font-size: 80%;
	margin-right: auto;
	margin-left: auto;
	display:flex;
	flex-flow: column;
	margin-top: 10px;
	margin-bottom: 20px;

}

}