@import url(https://fonts.googleapis.com/css?family=Ubuntu:400,700,400italic,500italic);
/*  reset  */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin:0;
	padding:0;
}
.order_table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
.center{
	text-align: center;
}
img{
	margin:0px;
	padding:0px;
	}
/*address, caption, cite, code, dfn, em, strong, th, var {
	font-style:normal;
	font-weight:normal;
}*/
/*ol, ul {
	list-style:none;
}*/
/*caption, th {
	text-align:left;
}*/
/*h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}*/
q:before, q:after {
	content:'';

}
abbr, acronym {
	border:0;
}
/*.ul{
	list-style:none;
	}*/
.lileft li{
	float:left;
	}
input,button{
	border:none;
	outline:none;
	}
button,.cursor{
	cursor:pointer;
	}
.user_edit ul,.user_edit ol{
	padding:0px 0px 0px 20px;
	}
button{
	font-size:1em;
	font-family:Arial, "微軟正黑體", "新細明體", Helvetica, sans-serif;
}
select,option,input,textarea{
	font-family:Arial, "微軟正黑體", "新細明體", Helvetica, sans-serif;
	outline:none;
}
select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000;
}
select option:disabled {
    background-color: #ccc;
}
/*================================reset================================*/
body{
	font-size:1em;
	color:#555;
	font-family:Arial, "微軟正黑體", "新細明體", Helvetica, sans-serif;
	line-height:2em;
	overflow-x: hidden;
	}
body, html{
	width: 100%;
	height: 100%;
	background-color: #ffffff;

}
a{ text-decoration:none; outline:0;}
*{ /*-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;*/}
.wrapper{
	width:100%;
	position:relative;
	z-index:1;
	margin:0 auto;
	padding-bottom: 45px;

	}

.wrapper.bg_bottom{
	background-image: url(../images/img_footer.png);
	background-position: 50% 100%;
	background-repeat: no-repeat;
}
.clearfix:after { /* FF, IE8, O, S, etc. */
     content: ".";
     display: block;
     height: 0;
     clear: both;
     visibility: hidden;
	}
.clearfix{
	zoom:1;
	}
.clear{
	clear:both;
	}
.fleft{
	float:left;
	}
.fright{
	float:right;
	}
.inline_block{
	display: inline-block;
}
.table{
	display:table;
}
.table_cell{
	display: table-cell;
}
.relative{
	position:relative;
}
.overflow_hidden{
	overflow:hidden;
}
.margin{
	margin:0 auto;
}
h4{ font-size:24px; color:#000; font-weight:bold;}
/*-----==========Header==========-----*/
header{
	width:100%;
	min-width:1280px;
	height:80px;
	border-bottom:5px solid #006cba;
	background-color:#fff;
	position:relative;
}
.Nav{
	max-width:1220px;
	min-width:960px;
	margin:0 auto;
	position:relative;
	z-index:999;
}
.Nav li{
	position: relative;
	width:calc(88% / 6);
	height:80px;
	list-style:none;
	display:inline-block;
	font-size:23px;
	font-weight:bold;
	color:#006cba;
	cursor:pointer;
	text-align:center;
	padding:27px 10px;
	/*margin:0 27px;*/
}
.Nav li a{
	color:#006cba;
}
.Nav span{
	width:47px;
	height:47px;
	display:inline-block;
	margin:0 auto;
}
.Nav span.news{
	background:url(../images/sprite.png) left top no-repeat;
	display:block;
}
.Nav span.activity{
	background:url(../images/sprite.png) -56px top no-repeat;
	display:block;
}
.Nav span.signup{
	background:url(../images/sprite.png) -112px top no-repeat;
	display:block;
	position: relative;
	z-index: 1;
}
.Nav span.works{
	background:url(../images/sprite.png) -168px top no-repeat;
	display:block;
	position: relative;
	z-index: 1;
}
.Nav span.case{
	background:url(../images/sprite.png) -224px top no-repeat;
	display:block;
}
.Nav span.home{
	background:url(../images/sprite.png) -648px top no-repeat;
	display:block;
}
.Nav span.vote{
	background:url(../images/nav.png) center top no-repeat;
	display:block;
}
/*---Nav hover---*/
.Nav li:hover a{
	color:#07913a;
}
.Nav li:hover span.news{
	background:url(../images/sprite.png) left -51px no-repeat;
	display:block;
}
.Nav li:hover span.activity{
	background:url(../images/sprite.png) -56px -51px no-repeat;
	display:block;
}
.Nav li:hover span.signup{
	background:url(../images/sprite.png) -112px -51px no-repeat;
	display:block;
}
.Nav li:hover span.works{
	background:url(../images/sprite.png) -168px -51px no-repeat;
	display:block;
}
.Nav li:hover span.case{
	background:url(../images/sprite.png) -224px -51px no-repeat;
	display:block;
}
.Nav li:hover span.home{
	background:url(../images/sprite.png) -648px -51px no-repeat;
	display:block;
}
.Nav li:hover span.vote{
	background:url(../images/nav.png) center -51px no-repeat;
	display:block;
}

.Nav01{
	max-width:1220px;
	min-width:1000px;
	margin:0 auto;
	position:relative;
	z-index:999;
}
.Nav01 li{
	width: calc(97% / 7);
	height:80px;
	list-style:none;
	display:inline-block;
	font-size:23px;
	font-weight:bold;
	color:#006cba;
	cursor:pointer;
	text-align:center;
	padding:27px 0;
	position:relative;
}
/* .Nav01 li:nth-child(5){
	width:16%;
	min-width:162px;
	height:80px;
	list-style:none;
	display:inline-block;
	font-size:23px;
	font-weight:bold;
	color:#006cba;
	cursor:pointer;
	text-align:center;
	padding:27px 0;
} */
.Nav01 li a{
	color:#006cba;
}
.Nav01 span{
	width:47px;
	height:47px;
	display:inline-block;
	margin:0 auto;
}
.Nav01 li span.news{
	background:url(../images/sprite.png) left top no-repeat;
	display:block;
}
.Nav01 li span.activity{
	background:url(../images/sprite.png) -56px top no-repeat;
	display:block;
}
.Nav01 li span.signup{
	background:url(../images/sprite.png) -112px top no-repeat;
	display:block;
	position:relative;
	z-index:1;
}
.Nav01 li span.works{
	background:url(../images/sprite.png) -168px top no-repeat;
	display:block;
	position: relative;
	z-index: 1;
}
.Nav01 li span.case{
	background:url(../images/sprite.png) -224px top no-repeat;
	display:block;
}
.Nav01 li span.home{
	background:url(../images/sprite.png) -648px top no-repeat;
	display:block;
}
.Nav01 li span.digital, .Nav li span.digital{
	background:url(../images/nav_digital.png) center top no-repeat;
	display:block;
}
/*---Nav hover---*/
.Nav01 li:hover a{
	color:#07913a;
}
.Nav01 li:hover span.news{
	background:url(../images/sprite.png) left -51px no-repeat;
	display:block;
}
.Nav01 li:hover span.activity{
	background:url(../images/sprite.png) -56px -51px no-repeat;
	display:block;
}
.Nav01 li:hover span.signup{
	background:url(../images/sprite.png) -112px -51px no-repeat;
	display:block;
}
.Nav01 li:hover span.works{
	background:url(../images/sprite.png) -168px -51px no-repeat;
	display:block;
}
.Nav01 li:hover span.case{
	background:url(../images/sprite.png) -224px -51px no-repeat;
	display:block;
}
.Nav01 li:hover span.home{
	background:url(../images/sprite.png) -648px -51px no-repeat;
	display:block;
}
.Nav01 li:hover span.digital, .Nav li:hover span.digital{
	background:url(../images/nav_digital_now.png) no-repeat;
	display:block;
}

/* Nav子選單 */
ul.subnav{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	display: none;
	transition: .3s;
	background: #ffffff;
	top: 85px;
	padding: 30px 0 0;
	z-index: 0;
}

ul.subnav li{
	display: block;
	width: 100%;
	height: auto;
	padding: 10px 0;		
}

ul.subnav li a{
	width: 100%;
	height: 100%;
	display: block;	
}

ul.subnav li:hover{
	background-color: #07913a;
}

ul.subnav li:hover a{
	color: #ffffff;
}

.Nav li:hover ul.subnav,
.Nav01 li:hover ul.subnav{
	display: block;
	transition: .3s;
}

/*-----==========Content==========-----*/
.wrapper img.bg_index{
	width:100%;
	min-width:1280px;
}
.minbox_index{
	width:100%;
	height:100%;
	min-width:1280px;
	position: absolute;
	top:0;
	left:0;
	margin:0 auto;
	padding:25px 0 40px 0;
	margin-bottom:-45px; }
.time{
	width:40%;
	/*width:49%;*/
	position:absolute;
	z-index:999;
	left:40%;
	/*left:35%;*/
	top:43%;
}
.time img, .description img, .title img{
	width:100%;
}
.time .reddot{
	width:58px;
	height:58px;
	background-color:#e8343d;
	color:#fff;
	font-size:39px;
	display:inline-block;
	border-radius:50%;
	line-height:58px;
	text-align:center;
}
.time .brown{
	font-size:50px;
	font-weight:bold;
}

.timeflex{ display:flex; max-width:1280px; padding:0 20px; margin:auto; margin-bottom:40px; }
.timeflex .timegrid{ padding:0 15px; }
.timeflex .timegrid img{ max-width:100%; }

.brown{
	color:#6a3906;
}
.red{
	color:#e8343d;
}
.redarrow{
	border-top: 12px solid transparent;
    border-left: 18px solid #e8343d;
    border-bottom: 12px solid transparent;
    display: inline-block;
	margin:6px 25px;
}
.info{
	position:absolute;
	bottom:13%;
	left:17%;
}

.info.nopos{ position:static; max-width:1280px; margin:auto; padding:0 20px; }

.description{
	width:75%;
	float:left;
	position: relative;
	padding:0 0 0 20px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	/*position:absolute;
	right:16.5%;
	top:53%;*/
}

.description a{
	position: absolute;
	width: 249px;
    height: 47px;
    bottom: 118px;
    right: 0;
    /* outline: 1px solid #000; */
}

.btn_signup{
	width:25%;
	float:left;
}
.btn_signup img{
	width:100%;
}
.newsarea{
	background-color:#fff;
	border-radius:10px;
	font-size:17px;
	color:#6a3906;
	padding:15px 25px;
	/*float:left;*/
	margin:2% 0 0 22%;
}
.newsarea .news_item{
	color:#6a3906;
	font-size:17px;
}
.newsarea .news_item:hover{
	color:#8b5013;
}
.newsarea .newsStyle {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    word-wrap: break-word;
}
.btn_more_index{
	width:150px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #136830;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#59ba16+0,0b8538+100 */
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
	display:inline-block;
	/*margin:0 0 0 80%; */
}

/*-----==========Footer==========-----*/
footer{
	width:100%;
	text-align:center;
	position:relative;
	z-index:99;
	min-width:1280px;
	background-color: #40210F;
	padding: 15px 0 10px;
}
footer p, footer a{
	color:#ffffff;
}
footer a:hover{
	text-decoration: underline;
}

/*-----==========Signup==========-----*/
.wrapper .bg_signup, .wrapper .bg_case, .wrapper .bg_news_list, .wrapper .bg_news_detail, .wrapper .bg_activity, .bg_awards, .bg_vote, .bg_digital{
	width:100%;
	min-width:1280px;
	position:absolute;
	top:0;
	left:0;
}
.minbox_signup{
	width:100%;
	height:100%;
	min-width:960px;
	padding:375px 0 0 0;
}
.title{
	width:62%;
	position:absolute;
	z-index:99;
	top:-29px;
	left:19%;
}
.signup_from{
	width:1280px;
	/*height:1190px;*/
	background-color:#fff;
	box-shadow: 0px 7px 10px 5px rgb(0,0,0,.15);
	border-radius:10px;
	margin:0 auto;
	position:relative;
	padding:50px 0;
}
.signup_from table{
	font-size:20px;
	border:1px solid #999;
	margin:0 auto;
	border-collapse:collapse;
}
.signup_from table td{
	border:1px solid #999;
}
.signup_from table td a{
	color:#59ba16;
}
.signup_from table .star{
	color:#e8343d;
}
.signup_from table .star.sm{ font-size:15px; }
.q_td{
	padding:7px 0 7px 20px;
	line-height:40px;
}
.pad_20{
	padding:20px;
}
.pad_lr{
	padding:0 20px;
}
ul.groupUl{ list-style:none; padding:0;}
ul.groupUl li{ display:block; line-height:36px; padding:5px 0;}

input, select{ vertical-align:middle; }

input.signup{
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
}
input.grade{
	width:50px;
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
}
input.add{
	width:650px;
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
}
input.full{
	width:100%;
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
	box-sizing:border-box;
}
input.school, input.email{
	width:895px;
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
}
input.theme{
	width:1020px;
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
}
select.signup{
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
}
select.grade{
	width:50px;
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
}
textarea.worktext{
	border:1px solid #ccc;
	width:1020px;
	height:150px;
	font-size:20px;
	padding:5px 10px;
}
select.add{
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
	vertical-align:middle;
}
select.full{
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:20px;
	vertical-align:middle;
	width:100%;
	box-sizing:border-box;
}
select.city{
	width:120px;
	padding:5px 10px;
	font-size:20px;
	background-color:transparent;
	border:none;
	position:absolute;
	top:16px;
	left:109px;
	background: url(../images/arrow.png) scroll 100px 14px no-repeat;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	background-size: 9px 11px;
}
select.city option{
	background-color:#fff;
}
.btn_warp{
	text-align:center;
	padding-top:50px;
}
.btn_send{
	width:150px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #136830;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#59ba16+0,0b8538+100 */
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
	display:inline-block;
}
.btn_send a{
	width:150px;
	height:50px;
	color:#fff;
	display:block;
}

.flexbox{ display:flex; margin-left:-15px; }
.flexbox .f1{ width:25%; padding-left:15px; }
.flexbox .f2{ flex:1; padding-left:15px; }
.flexbox .f3{ padding-left:15px; }
.flexbox .input{ font-size: 20px; border:1px solid #ccc; padding:5px 10px; width:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; vertical-align: middle; }

.flexbox.sty01{ padding:10px 0; align-items: baseline; }

/*-----==========Case==========-----*/
.minbox_case, .minbox_vote{
	position:relative;
}
.search{
	width:100%;
	padding:20% 0 0 15%;
	font-size:20px;
}

.btn_search{
	width:150px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #136830;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#59ba16+0,0b8538+100 */
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
	display:inline-block;
	margin:8px 0 0 225px;
	cursor:pointer;
}

.btn_search a{
	width:150px;
	height:50px;
	color:#fff;
	display:block;
}

.btn_site{
	position: absolute;
	top: 0;
	right: -680px;
	background: linear-gradient(to bottom, #99ee74 0%,#59ba16 100%);
	font-weight: bold;
}

.btn_goodcase{
	width: 180px;
	position: absolute;
	top: 0;
	right: -510px;
	background: linear-gradient(to bottom, #99ee74 0%,#59ba16 100%);
	font-weight: bold;
}

.btn_goodcase a {
    width: 180px;
}

.btn_now{
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%);
}

.btn_goodcase:hover, .btn_site:hover{
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%);
}

.casebox{
	width:1280px;
	/*height:1510px;*/
	margin:30px auto 0;
}
.title_city{
	width:100px;
	height:80px;
	background:url(../images/sprite.png) -10px -320px no-repeat;
	display:block;
	/*margin:20px 0 0 20%;*/
	color:#fff;
	font-size:24px;
	font-weight:bold;
	line-height:67px;
	padding:0 130px;
	position:relative;
}

/* 得獎名單 */
.award_select{
	width: 168px;
    padding: 5px 10px;
    font-size: 20px;
    background-color: transparent;
    border: none;
    position: absolute;
    top: 16px;
    left: 84px;
    background: url(../images/arrow.png) scroll 148px 14px no-repeat;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-size: 9px 11px;
}

.title_site{
	width:100px;
	height:80px;
	display:block;
	padding:0 130px;
	position:relative;
}

.case_item, .vote_item{
	width:25%;
	display:inline-block;
	margin:0 20px 40px 20px;
	background-color:#fff;
	box-shadow:0px 7px 10px 5px rgb(0,0,0,.15);
	border-radius:15px;
	padding:40px;
	vertical-align: top;
}
.case_item:nth-child(1n), .vote_item:nth-child(1n){
	margin-left:0;
}
.case_item:nth-child(3n), .vote_item:nth-child(3n){
	margin-right:0;
}
.case_item .imgbox, .vote_item .imgbox{
	width:320px;
	height:210px;
	overflow:hidden;
	position:relative;
	background-color:#e0e0e0;
	text-align:center;
}
.case_item .imgbox img, .vote_item .imgbox img{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	display:block;
	max-height: 100%;
	max-width: 100%;
	vertical-align:middle;
}
.case_item .item_title, .item_title{
    height: 123px;
	font-size:24px;
	font-weight:bold;
	margin-top:20px;
	color:#000;
	overflow:hidden;
}
.case_item .icon_map{
	width:25px;
	height:25px;
	background:url(../images/sprite.png) -281px top no-repeat;
	display:inline-block;
	margin-left:10px;
}
.case_item .item_add, .vote_item .item_name{
	font-size:16px;
	color:#000;
}
.vote_item .item_name{
	display:inline-block;
}
.btn_website, .btn_vote{
	float:right;
}
.btn_association, .btn_share{
	float:left;
}
.btn_share{
	width:150px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #1c356e;
	background: #4b6ab4; /* Old browsers */
	background: -moz-linear-gradient(top, #4b6ab4 0%, #284486 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #4b6ab4 0%,#284486 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #4b6ab4 0%,#284486 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4b6ab4', endColorstr='#284486',GradientType=0 ); /* IE6-9 */
	display:inline-block;
	margin:15px 0 0 0;
}
.btn_website, .btn_association, .btn_vote{
	width:150px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #136830;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#59ba16+0,0b8538+100 */
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
	display:inline-block;
	margin:15px 0 0 0;
}
.btn_website a, .btn_association a, .btn_more a, .btn_back a, .btn_case a, .btn_more_index a, .btn_share a, .btn_vote a{
	width:150px;
	height:50px;
	color:#fff;
	display:block;
}
.pages{
	/*width:450px;*/
	margin:0 auto;
	text-align: center;
}

.pages a{
	display:inline-block;
	background-color:#07913a;
	color:#fff;
	margin:0 5px;
	font-size:24px;
	padding:10px 15px;
}
.pages a:hover{
	background-color:#76be2f;
}
.pages a.now{
	background-color:#76be2f;
}

/* 綠建築景點 */

.site_list{
	width: 1280px;
	margin: 30px auto 0;
}

.sl_table{
	width: 100%;
	display: table;
	background-color: #fff;
	border-radius: 15px;
	padding: 40px;
	box-sizing: border-box;
}

.sl_tr{
	display: table-row;
}

.sl_td{
	display: table-cell;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding: 5px 0;
	text-align: center;
}

.sl_td:last-child{
	border-right: 0px solid #ccc;
}

.sl_tr:last-child .sl_td{
	border-bottom: 0px solid #ccc;
}


.sl_td1, .sl_td2, .sl_td3{
	font-weight: bold;
	font-size: 24px;
	text-align: center;
}

.sl_td1{
	width: 100px;
}

.sl_td2{
	width: 500px;
}

.sl_td1-1{
	font-size: 20px;
}

.sl_td2-1{
	text-align: left;
	padding: 0 20px;
}

.site_map{
	width: 25px;
	height: 25px;
	background:url(../images/sprite.png) -281px top no-repeat;
	float: right;
}



/*-----==========News==========-----*/
.minbox_news_list, .minbox_news_detail, .minbox_activity{
	position:relative;
}
.newsbox{
	width:1280px;
	/*height:1400px;*/
	padding:20% 0 0 0;
	margin:0 auto;
}
.newslist_item{
	width:1251px;
	height:120px;
	background:url(../images/sprite.png) 0px -398px no-repeat;
	display:inline-block;
	position:relative;
	margin:0 0 20px 0;
}
.newslist_item .date, .newsDetail_date .date{
	color:#fff;
	font-size:20px;
	font-weight:bold;
	padding:35px 50px;
	display:inline-block;
	text-align:center;
}
.news_title{
	color:#000;
	font-size:18px;
	display:inline-block;
	position:absolute;
	top:41px;
	left:165px;
	max-width: 810px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: break-word;
}
.btn_more{
	width:150px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #136830;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#59ba16+0,0b8538+100 */
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
	display:inline-block;
	position:absolute;
	top:30px;
	right:100px;
}
.newsbox_d{
	width:1280px;
	/*height:1025px;*/
	padding:20% 0 0 0;
	margin:0 auto;
}
.newsDetail_bg{
	width:1220px;
	background-color:#ffffff;
	box-shadow: 0px 7px 10px 5px rgb(0,0,0,.15);
	border-radius:15px;
	padding:30px 30px 50px 30px;
}
.newsDetail_date{
	width:153px;
	height:120px;
	background:url(../images/sprite.png) -279px -29px no-repeat; 
	display:inline-block;
}
.newsDetail_title{
	font-size:30px;
	font-weight:bold;
	color:#000;
	display:inline-block;
	width: calc(100% - 158px);
}
.btn_back{
	width:150px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #136830;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#59ba16+0,0b8538+100 */
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
	display:block;
	margin:50px auto 0 auto;	
}
.newsDetail_text{
	padding-top:20px;
	font-size:20px;
	color:#000;
}

/*-----==========Acivity==========-----*/
.minbox_activity{
	padding-top:20%;
}
.activitybox{
	width:1220px;
	padding:30px;
	margin:0 auto;
	font-size:18px;
	background-color:#fff;
	box-shadow: 0px 7px 10px 5px rgb(0,0,0,.15);
	border-radius:15px;
}

.activityboxTitle{
	color: #136830;
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	padding: 40px 0;
}

.activityItem{
	padding:0 0 40px 0;
	font-size:18px;
}
.activityTitle{
	height:35px;
	position:relative;
	margin:0 0 10px 0;
}

div.actvityPaintTheme h4, div.actvityPaintTheme p{
	color: #59ba16;
	font-weight: bold;
}

.activityTitle_icon{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px 0px no-repeat;
	display:inline-block;
}
.activityTitle_icon1{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -40px no-repeat;
	display:inline-block;
}
.activityTitle_icon2{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -77px no-repeat;
	display:inline-block;
}
.activityTitle_icon3{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -114px no-repeat;
	display:inline-block;
}
.activityTitle_icon4{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -151px no-repeat;
	display:inline-block;
}
.activityTitle_icon5{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -191px no-repeat;
	display:inline-block;
}
.activityTitle_icon6{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -238px no-repeat;
	display:inline-block;
}
.activityTitle_icon7{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -540px  -39px no-repeat;
	display:inline-block;
}
.activityTitle_icon8{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -279px no-repeat;
	display:inline-block;
}
.activityTitle_icon9{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -320px no-repeat;
	display:inline-block;
}
.activityTitle_icon10{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -441px -361px no-repeat;
	display:inline-block;
}
.activityTitle_icon11{
	width:93px;
	height:32px;
	background:url(../images/sprite.png) -540px 0px no-repeat;
	display:inline-block;
}
.activityTitle h4{
	/*padding:0 0 0 100px;*/
	position:absolute;
	left:0;
	top:0;
}
.activityItem p{
	font-size:20px;
	color:#000;
	max-height: 999999px;
}
ol.activityList{
	list-style-type:none;
	padding: 0 0 0 30px;
	color:#000;
	font-size:18px;
	max-height: 999999px;
}
ol.activityList > ol{
	list-style-type:Decimal;
}
ol.activityList2{
	padding:0 0 0 60px;
}
ol.activityList2 a{
	color:#136d3b;
}
ol.activityList3{
	padding:0 0 0 20px;
	list-style-type:none;
}
ol.activityList4{
	padding:0 0 0 20px;
	list-style-type:none;
}

.activitybox .threebox{
	height:140px;
	font-size:18px;
}
.threebox .activityItem{
	width:30%;
	display:inline-block;
	margin-left:30px;
	vertical-align:top;
}
.threebox .activityItem:first-child{
	margin:0;
}
.btn_case{
	width:150px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #136830;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#59ba16+0,0b8538+100 */
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
	display:inline-block;
	margin:0 0 0 10px;
}
.green{
	color:#136d3b;
}
ul.step{
	padding:0 0 0 40px;
	list-style:none;
}
.imgGrid{display: grid;gap:32px;grid-template-columns: repeat(2, minmax(0, 1fr));}
.imgGrid img{width: 100%;border: 1px solid #999;}
.activitybox hr{margin-block: 40px;}


/*-----==========Vote==========-----*/
.minbox_vote{
	min-width:1300px;
}
.vote_tag{
	width:1280px;
	padding:20% 0 0 0;
	margin:auto;
	font-size:20px;
}
.vote_team{
	border-bottom:4px solid #0c8638; 
}
.tag{
	width: 297px;
    line-height: 50px;
    text-align: center;
    color: #fff;
    border-radius: 10px 10px 0 0;
    display: inline-block;
    font-size: 20px;
	background: #99ee74; /* Old browsers */
	background: -moz-linear-gradient(top, #99ee74 0%, #59ba16 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #99ee74 0%,#59ba16 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #99ee74 0%,#59ba16 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99ee74', endColorstr='#59ba16',GradientType=0 ); /* IE6-9 */
	margin:0 0 0 20px;
}
.tag:first-child{
	margin:0;
}
.tag:hover{
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
}
.tag.now{
	width: 310px;
    line-height: 50px;
    text-align: center;
    color: #fff;
    border-radius: 10px 10px 0 0;
    display: inline-block;
    font-size: 20px;
	background: #59ba16; /* Old browsers */
	background: -moz-linear-gradient(top, #59ba16 0%, #0b8538 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #59ba16 0%,#0b8538 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #59ba16 0%,#0b8538 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59ba16', endColorstr='#0b8538',GradientType=0 ); /* IE6-9 */
}

.alignBoxForCase{
	position: relative;
}

.alignBoxForCase:after{
	content: '';
	clear: both;
	display: block;
}

.votebox, .awardsbox{
	width:1280px;
	margin:30px auto 0;
	text-align: center;
}
.votes{
	font-size:18px;
	position: absolute;
	bottom: 0;
	right: 0;
}
.votes span.red.number{
	font-size:60px;
	font-weight:bold;
}
.btn_explan{
	width:175px;
	height:50px;
	border-radius:10px;
	color:#fff;
	font-size:20px;
	line-height:50px;
	text-align:center;
	border-bottom:4px solid #b45506;
	background: #f58812; /* Old browsers */
	background: -moz-linear-gradient(top, #f58812 0%, #de6a0c 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #f58812 0%,#de6a0c 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #f58812 0%,#de6a0c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f58812', endColorstr='#de6a0c',GradientType=0 ); /* IE6-9 */
	display:block;
	margin:15px 0 0 0;
	float:right;
}
.btn_explan a{
	width:175px;
	height:50px;
	color:#fff;
	display:block;
}
.vote_info{
	width:100%;
}

/*-----==========Awards==========-----*/
.firstPrize{
	width:33%;
	height:425px;
	display:block;
	margin:0 auto 40px auto;
	background-color:#fff;
	border-radius:15px;
	padding:40px 40px 120px 40px;
	vertical-align: top;
	position:relative;
}
.firstPrize .imgbox{
	width:417px;
	height:329px;
	overflow:hidden;
	position:relative;
	background-color:#e0e0e0;
	text-align:center;
}
.secPrize, .thirdPrize, .fourthPrize{
	width:25%;
	display:inline-block;
	margin:0 20px 40px 20px;
	background-color:#fff;
	border-radius:15px;
	padding:40px;
	vertical-align: top;
	position:relative;
}

.secPrize_title{
	text-align: center;
	font-size: 26px;
	margin-bottom: 30px; 
}

.secPrize:nth-child(1n), .thirdPrize:nth-child(1n), .fourthPrize:nth-child(1n){
	margin-left:0;
}
.secPrize:nth-child(3n), .thirdPrize:nth-child(3n), .fourthPrize:nth-child(3n){
	margin-right:0;
}
.secPrize .imgbox, .thirdPrize .imgbox, .fourthPrize .imgbox{
	width:320px;
	height:210px;
	overflow:hidden;
	position:relative;
	background-color:#e0e0e0;
	text-align:center;
}
 .firstPrize .imgbox img, .secPrize .imgbox img, .thirdPrize .imgbox img, .fourthPrize .imgbox img{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	display:block;
	max-height: 100%;
	max-width: 100%;
	vertical-align:middle;
}
.firstPrize .item_title, .secPrize .item_title, .thirdPrize .item_title, .fourthPrize .item_title {
	font-size:24px;
	font-weight:bold;
	margin-top:20px;
	color:#000;
}
.firstPrize .item_name, .secPrize .item_name, .thirdPrize .item_name, .fourthPrize .item_name {
	font-size:16px;
	color:#000;
}

.item_name{
	text-align: left;
}

.icon_prize, .icon_prize02, .icon_prize03, .icon_prize04{
	width:49px;
	height:80px;
	display:block;
	position:absolute;
	left:15px;
	top:0;
	z-index:5;
}
.icon_prize{
	background:url(../images/icon_awards.png) left top no-repeat;
}
.icon_prize02{
	background:url(../images/icon_awards.png) -55px top no-repeat;
}
.icon_prize03{
	background:url(../images/icon_awards.png) -110px top no-repeat;
}
.icon_prize04{
	background:url(../images/icon_awards.png) -165px top no-repeat;
}


/* 數位教材 */
.digital_list{
	width: 1280px;
	padding: 25% 0 0 0;
    margin: 0 auto;
}

.dlbox, .dlb_title, .dlbc_text{
	position: relative;
}

.dlbox_img, .dlbox_img img, .dlbox_img p, .dlbox_bottom{
	position: absolute;
}

.dlbox_img{
	top: -10px;
	left: -45px;
}

.dlbox_img p{
	color: #fff;
	font-size: 36px;
	font-weight: bold;
	top: 50px;
	left: 65px;
}

.dlbox{
	background-color: #fff;
	padding: 75px 100px 60px 150px;
	margin-bottom: 150px; 
	box-shadow: 0px 7px 10px 5px rgb(0,0,0,.15);
	border-radius: 15px;
}

.dlbox:last-of-type{
	margin-bottom: 0;
}


.dlb_title{
	margin-bottom: 40px;
}

.dlb_title p{
	font-size: 30px;
	font-weight: bold;
	color: #0a923a;
}

.dlb_class{
	font-size: 24px;
	font-weight: bold;
}

.dlbc_text{
	margin: 30px 0 10px;
	padding: 10px 0;
	border-bottom: 1px solid #ccc;
}

.dlbc_text p{
	font-size: 20px;
	font-weight: 600;
}

.dlb_title .btn_more, .dlbc_text .btn_more{
	top: -15px;
	right: 15px;
}

.dlb_title .btn_media{
	right: 185px;
}

.dlbox_bottom{
	bottom: -89px;
	right: 0px;
}

@media screen and (max-width: 1023px){
	.wrapper.bg_bottom{
		background-image: none;
	}
}

.exbox{ position:relative; box-sizing:border-box; padding-bottom:25px;}
.exbox .extt{ position:absolute; left:0; right:0; bottom:0; text-align:center; font-size:12px; line-height:25px;}
.awards_label_box{ display:inline-block; vertical-align:top; padding-top:15px;}
.awards_label_box a{ display:inline-block; padding:0 30px; line-height:40px; background-color:#e50015; color:#fff; font-size:18px; font-weight:bold; margin-right:10px; border-radius:10px; border: 2px solid #a7000f; opacity:.5;}
.awards_label_box a.focus,.awards_label_box a:hover{ opacity:1;}
.su_label{ display:flex; text-align:center; padding:0 10px;}
.su_label .su_btn{ flex:1; color:#999;}
.su_label .su_btn.btnstyle{ background-color:#eee; border-radius:5px; border:1px solid #ccc; margin:0 5px; padding:3px 0;}
.su_label .su_btn.focus{ color:#fff; background-color:#006cba;}
.addbtn{ border-radius:5px; background-color:#ff535e; color:#fff !important; padding:5px 10px;}
.editbtn{ border-radius:5px; padding:5px 10px; border:1px solid #59ba16;}
.deletbtn{ border-radius:5px; padding:5px 10px; border:1px solid #ff535e; color:#ff535e !important;}
.color_gray{ color:#aaa;}
.color_blue{ color:#006cba;}
.color_green{ color:#59ba16;}
.color_red{ color:#ff535e;}