@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Lato:300,400|Poppins:300,400,800&display=swap');
/* CSS Document */
/* reset #c30d23
------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big,
cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd,
ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details,
embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section,
summary, time, mark, audio, video, hr {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-size: 100%;
	vertical-align: baseline;
}

body {
	color: #454545;
    font-family: "微軟正黑體", Arial, sans-serif, "LiHei Pro";
	font-size: 16px;
    margin: 0 auto;
    max-width: 100%;
}

.clear1 {
	clear: both;
	height: 0;
}
.clear30 {
	clear: both;
	height: 15px;
}
.img100 {
	max-width: 100%;
}
.hr-dot {
	display: block;
    height: 2px !important;
	background: url(../images/dots.jpg) repeat-x;
    border: 0;
	opacity: 1;
	margin-top: 25px;
	margin-bottom: 25px;
}

.red {
	color: #c30d23;
}
.no-mt {
	margin-top: 0 !important;
}
.fr {
	float: right;
}

/* GLOBAL SETTING */

.main-block {
    background: #fff;
    -webkit-box-shadow: -21.213px 21.213px 57px 0px rgb(0 0 0 / 10%);
    box-shadow: -21.213px 21.213px 57px 0px rgb(0 0 0 / 10%);
    padding: 15px;
}

.main-tit {
	background-repeat: no-repeat;
	color: #035b4d;
	font-size: 1.875rem;
	font-weight: bold;
}
.subtit {
	color: #035b4d;
	font-size: 1.25rem;
	font-weight: bold;
}

.form-group {
	margin-bottom: 20px;
}
.toplabel {
	margin-bottom: 7px;
}
.alert-attach {
	border: 1px solid #357f64;
	background: #dee8e4;
	color: #357f64;
	line-height: 1.8rem;
}
.form-check-label {
	vertical-align: middle;
}

.index-block {
	margin-top: 10%;
}
.main-hd {
	color: #035b4d;
	font-size: 1.875rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 3.5rem;
}
.type-card {
	width: 100%;
	border: 0;
	-webkit-box-shadow: -21.213px 21.213px 57px 0px rgb(0 0 0 / 10%);
    box-shadow: -21.213px 21.213px 57px 0px rgb(0 0 0 / 10%);
	text-align: center;
	vertical-align: middle;
	margin-bottom: 25px;
}
.type-card a {
	display: block;
	height: 100%;
	padding: 3.5rem 15px;
	text-decoration: none;
}
.type-card a:hover {
	background-color: #ebf2ef;
	transition: background-color .35s linear;
}
.type-card a h2 {
	color: #035b4d;
	font-size: 1.875rem;
}
.type-card a p {
	color: #454545;
	margin-top: 1rem;
}
.type-card a img {
	margin-bottom: 1rem;
}


.btn-more {
	display: inline-block;
	text-align: center;
    text-decoration: none;
	background: rgb(1,119,70);
    background: linear-gradient(90deg, rgba(1,119,70,1) 0%, rgba(8,116,70,1) 50%, rgba(0,106,62,1) 100%);
    color: #FFF;
    font-size: 1rem;
    font-weight: bold;
	letter-spacing: 1px;
    border: 1px solid #035b4d;
    padding: 10px 35px;
    transition: color 0.3s, background 0.3s;
}
.btn-more:hover {
	border: 1px solid #035b4d;
    background: #fff;
    color: #035b4d;
    padding: 10px 35px;
    transition: color 0.5s, background 0.5s;
}
a.btn-more {
	display: inline-block;
	text-align: center;
    text-decoration: none;
	background: rgb(1,119,70);
    background: linear-gradient(90deg, rgba(1,119,70,1) 0%, rgba(8,116,70,1) 50%, rgba(0,106,62,1) 100%);
    color: #FFF;
    font-size: 1rem;
    font-weight: bold;
	letter-spacing: 1px;
    border: 1px solid #035b4d;
    padding: 10px 35px;
    transition: color 0.3s, background 0.3s;
}
a.btn-more:hover {
	border: 1px solid #035b4d;
    background: #fff;
    color: #035b4d;
    padding: 10px 35px;
    transition: color 0.5s, background 0.5s;
}

.footer {
	margin-top: 1.5rem;
}
.footer a {
	color: #006a3e;
	text-decoration: none;
}
.footer a:hover {
	text-decoration: underline;
}

.totop {
	float: right;
	color: #FFF;
	margin-top: 18px;
}
.totop:hover {
	cursor: pointer;
	color: #7eb29a;
}

.login-block {
	margin-top: 10%;
}
.login-block h2 {
	font-size: 1.4rem;
}
.login-block h1 {
	font-size: 2rem;
	font-weight: bold;
	margin-bottom: 1rem;
}
.login-block h3 {
	letter-spacing: 0.8px;
}
.login-block .login-wrap h2 {
	font-size: 1.5rem;
}
.wrap {
	width: 100%;
	border-radius: 5px;
	-webkit-box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
	-moz-box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
	box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
}

.text-wrap, .login-wrap {
	width: 50%;
}
@media (max-width: 991.98px) {
	.text-wrap, .login-wrap {
		width: 100%;
	}
}

.text-wrap {
	background: #088f57;
	background: -moz-linear-gradient(-45deg, #088f57 0%, #006a3e 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, #088f57), color-stop(100%, #006a3e));
	background: -webkit-linear-gradient(-45deg, #088f57 0%, #006a3e 100%);
	background: -o-linear-gradient(-45deg, #088f57 0%, #006a3e 100%);
	background: -ms-linear-gradient(-45deg, #088f57 0%, #006a3e 100%);
	background: -webkit-linear-gradient(315deg, #088f57 0%, #006a3e 100%);
	background: -o-linear-gradient(315deg, #088f57 0%, #006a3e 100%);
	background: linear-gradient(135deg, #088f57 0%, #006a3e 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#088f57', endColorstr='#006a3e', GradientType=1 );
	color: #fff;
}
.text-wrap .text h2 {
	font-weight: 900;
	color: #fff;
}

.login-wrap {
	position: relative;
	background: #fff;
}


@media (min-width: 360px) {

}
@media (min-width: 375px) {

}
@media (min-width: 410px) {

}
@media (min-width: 480px) {

}


/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {


}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {

}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
	.main-block {
		margin-top: 15px;
		padding: 80px 120px;
	}
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {

}
/*xxl and up)*/
@media (min-width: 1400px) {

}
@media (min-width: 1560px) {

}
@media (min-width: 1800px) {

}