@charset "utf-8";
/* CSS Document */



* {margin:0px; padding:0px;}
.cleardiv {clear:both;}
#back {position:fixed; right:40px; bottom:120px; cursor:pointer; display:none; z-index:10;}
#sakura {height:0px; width:0px;}

#layout {position:relative;}

header {height:400px; margin-top:40px; background:url(../images/header.jpg) top center no-repeat;}
header img {display:none;}

nav {background:url(../images/navbg.jpg) center repeat; padding:12px 0px;}
nav div {width:800px ; margin:auto;}
nav a {display:inline-block; padding:5px 10px; margin:0px 8px; text-align:center; font-size:24px; font-family:'cwTeXHei',Microsoft JhengHei ,serif; color:gray; text-decoration:none; border:1px solid #abc8cc; border-radius:5px; background:white;}
nav a:hover {color:white; background:#f7417d; border:1px solid #f7417d;}
nav a.slec {color:white; background:#f7417d; border:1px solid #f7417d;}

#content {background:#e1fbff;}
#content #con_gds {padding:12px 25px; margin:auto !important; background:white;}
.gdsbtn a {display:inline-block; width:150px; height:50px; font-size:20px; line-height:50px; text-align:center; margin:0px 10px; font-family:'cwTeXHei',Microsoft JhengHei ,serif; text-decoration:none; color:#929292; background:white;}
.gdsbtn a:hover {background:url(../images/btn.jpg) center no-repeat; color:#f7417d;}
.gdsbtn a.slec {background:url(../images/btn.jpg) center no-repeat; color:#f7417d;}

#con_gds table {width:100%; border-bottom:1px solid #CCC; font-family:Microsoft JhengHei ; font-size:16px; line-height:26px;}
#con_gds table td span {color:#333;}
#con_gds table td span.t_r {color:orangered;}
#con_gds table td a {color:#333; text-decoration:none;}

#content .article {width:776px; padding:12px 25px; margin:auto; background:white;}
.article article {margin-bottom:15px;}
.article .title {width:780px; height:78px; margin:auto;}
.article article img, .article article p {display:inline-block; vertical-align:middle;}
.article article img { width:800px;height:0px;}
.article article p {width:800px; margin:0px 0px; text-align:justify; font-family:Microsoft JhengHei , MS Gothic; font-size:18px; line-height:26px; color:dimgray;}
.article article p span {display:block; padding-left:10px; margin-bottom:10px; font-size:24px; line-height:36px; font-family:Microsoft JhengHei , MS Gothic; color:white; background:#f7417d;}

#content .precon {width:800px; padding:12px 25px; margin:0 auto; background:white;}
.precon precon {margin-bottom:15px;}
.precon .title {width:800px; height:180px; margin:0 auto;}
.precon precon img, .precon precon p {display:inline-block; vertical-align:middle;}
.precon precon img {width:250px;height:250px;}
.precon precon p {width:520px; margin:0px 10px; text-align:justify; font-family:Microsoft JhengHei , MS Gothic; font-size:18px; line-height:24px; color:dimgray;}
.precon precon p span {display:block; padding-left:10px; margin-bottom:10px; font-size:24px; line-height:36px; font-family:Microsoft JhengHei , MS Gothic; color:white; background:#f7417d;}
#content div.preblock img.pretitle {position:absolute; top:0px; left:0px; z-index:2;}
#content div.preblock img.prepic {position:absolute; top:65px; left:0px; z-index:1;}
#content div.preblock p.premb {display:none;}
#content div.top20 {margin-top:-30px;}
.card-link {background: #0e62b3;}
.card-link:hover {background: #0e62b3cc;}
.nav-pills .nav-link {background-color: #ddd; color: #000;}
.nav-pills .nav-link.active {background-color: #0e62b3cc;}

/* CSS Reset */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,blockquote,fieldset,input { margin: 0; padding: 0; }


@media screen and (max-width: 768px) {
	#back {right:10px; bottom:10px;}
	#back img {width:60px; height:auto;}
	header {height:auto; background:none;}
	header img {display:inherit; width:100%; height:auto;}
	nav {padding:0px; background:white;}
	nav div {width:100%;}
	nav a {display:inline-block; vertical-align:middle; width:20%; margin:0px -2px; padding:8px 0px; border-radius:0px; border:none; font-size:1.005em;}
	nav a:hover {border:none;}
	nav a.slec {border:none;}
	#content {width:100%; padding-top:20px;}
	#content #con_gds {width:90%; padding:2%;}
	.gdsbtn a {width:35%; height:auto; font-size:1.250em; line-height:1.625em;}
	.gdsbtn a:hover {background:pink;}
	.gdsbtn a.slec {background:pink;}
	#content .article {width:96%; padding:2%;}
	.article .title {width:100%; height:auto; margin:auto;}
	.article .title img {width:100%; height:auto;}
	.article article img {display:block; width:50%; height:auto; margin:12px auto;}
	.article article p {display:block; width:80%; margin:auto;}
	#content .precon {width:96%; padding:2%;}
	#content .precon div.preblock {height:auto;}
	.precon .title {width:80%; height:auto; margin:auto;}
	.precon .title img {width:100%; height:auto;}
	.precon precon img {width:100%; height:auto; margin-right�?:0px auto;}
	.precon article p {display:block; width:80%; margin:0px auto;}
	.precon precon p {display:block;width:80%; margin:0px auto; text-align:justify; font-family:Microsoft JhengHei , MS Gothic; font-size:18px; line-height:24px; color:dimgray;}

	#content div.preblock img.pretitle {display:none;}
	#content div.preblock p.premb {display:block; font-size:20px; line-height:32px; text-align:center; font-family:'cwTeXHei',Microsoft JhengHei ,serif; background:hotpink; color:white;}
	#content div.preblock img.prepic {display:block; position:relative !important; width:100%; height:auto; top:0px; left:0px; z-index:0;}
	#content div.top20 {margin-top:0px;}
}

@media screen and (max-width: 480px) {
	nav a {display:inline-block; vertical-align:middle; font-size:0.500em; width:20%; padding:8px 0px;}
	.gdsbtn a {font-size:1.000em;}
	#con_gds table {font-size:14px; line-height:22px;}
	.article article p {font-size:14px; line-height:18px;}
	.article article p span {font-size:16px; line-height:20px;}
	.precon precon p {font-size:14px; line-height:18px;}
	.precon precon p span {font-size:16px; line-height:20px;}
	.precon article img {display:block; width:100%; height:auto; margin:5px auto;}
	.precon article p {display:block; width:50%; margin:auto;}

}

@media screen and (max-width: 360px) {
	#con_gds table {font-size:13px; line-height:19px;}
	.precon precon p {font-size:14px; line-height:18px;}
	.precon precon p span {font-size:16px; line-height:20px;}
	.precon article img {width:50%; height:auto; margin:0px auto;}
}
.list,.menu{
    width: 100%;
}
.list ul, .menu ul {
	display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    height: 110px;
    column-gap: 1rem;
}
.list ul li, .menu ul li{
	transition: 0.1s;
    width: 23%;
    display: block;
    font-weight: 600;
    box-sizing: border-box;
    border: 2px solid rgba(248, 85, 56, 0.9);
    color: rgba(160, 91, 12, 0.9);
    background-color: antiquewhite;
    padding: 10px;
    font-size: 1.2rem;
	margin: 0px;
}
.list ul li a, .menu ul li a{
    display: block;
    width: 100%;
    height: 100%;
}
.list ul li:hover, .menu ul li:hover{
    box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 15px;
}