@charset "utf-8";
/* CSS Document */

/*----------------- 共用區 -----------------*/
a{
	text-decoration: none;
}

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden; /* 防止捲動條影響全螢幕效果 */
}

body{
	background: #00000075;
	background-image:
		linear-gradient(to right, #00000095, #00000095),
		url("../images/IMG_0227.jpg");
    background-position:center;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

.close {
	width: 16px;
}

.arrow {
	width: 20px;
	margin-right: 12px;
}

.arrow img, .close img {
	width: 100%;
}
#mainBox{
	background: #FFF;
	border-radius: 16px;
	width: 83vw;
	height: 90vh;
	max-width: 1600px;
	max-height: 960px;
	margin: auto;
	margin-top: 5vh;
	padding: 40px;
}

.fs-0875{font-size: 0.875rem;}

.text-light-blue{color: #94C4D3;}

.text-orange{color: #D18748;}

.text-red{color: #BB5555;}


/*----------------- 最上區 -----------------*/
.topArea {
	display: inline-flex;
	justify-content: space-between;
	margin-bottom: 1.5rem;
	width: 100%;
}

#print_title {
	display: none;
}

#mainBox h1{
	color: #477FA8;
	font-size: 2.6rem;
	font-weight: 700;
	margin-top: -10px;
}

#mainBox h1 a {
		color: #477FA8;	}

#logo{
	margin-top: -70px;
}

#logo img{
	width: 100px;
	height: 120px;
}


/*----------------- 公告區 -----------------*/
/*----------------- 左側整體內容 -----------------*/
.a_title{
	font-size: 1.425rem;
	font-weight: 700;
	color: #0C4E7F;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #C2C2C2;
}

.a_content{
	color: #000;
	font-size: 1rem;
	line-height: 2rem;
	height: calc(90vh - 255px);
	overflow-y: scroll;
}

 .a_content::-webkit-scrollbar, .a_more::-webkit-scrollbar{
      width: 0;
    }

 .a_content::-webkit-scrollbar-button, .a_more::-webkit-scrollbar-button {
      background: transparent;
      border-radius: 4px;
    }

 .a_content::-webkit-scrollbar-track-piece, .a_more::-webkit-scrollbar-track-piece {
      background: transparent;
    }

 .a_content::-webkit-scrollbar-thumb, .a_more::-webkit-scrollbar-thumb{
      border-radius: 4px;
      background-color: rgba(0, 0, 0, 0.4);
      border: 1px solid slategrey;

    }

 .a_content::-webkit-scrollbar-track, .a_more::-webkit-scrollbar-track {
      box-shadow: transparent;
    }

/*----------------- 右側整體內容 -----------------*/
.a_more{
	border-left: 1px solid #C2C2C2;
	height: calc(90vh - 155px);
	overflow-y: scroll;
	overflow-x: hidden;
}

.a_more .subTitle{
	color: #0C4E7F;
	font-size: 1.25rem;
	font-weight: 700;
	border-left: 4px solid #94C4D3;
	background: #F5F5F5;
	height: 40px;
	padding-left: 12px;
	line-height: 40px;
	margin-left: -2px;
}

.a_more_info a{
	text-decoration: none;
}

/*----------------- 公告資訊 -----------------*/
.info{
	padding: 12px;
	color: #303233;
	font-size: 1rem;
}

.info div{
	margin-bottom: .5rem;
}


/*----------------- 附件 -----------------*/
.appendix{
	padding: 6px 0 6px 0;
}

.appendix span{
	padding-left: 0.875rem;
	font-size: 0.875rem;
}

.appendix a {
	padding: 6px 6px 6px 12px;
	color: #000;
	transition-duration: .2s;
}

.appendix a:hover {
	background: #94C4D3;
	color: #FFF;
	transition-duration: .2s;
}

/*----------------- 下載說明 -----------------*/
.intro{
	padding-left: 12px;
	padding-bottom: 6px;
	font-size: .875rem;
	color: #717E87;
}

.intro span{
	width: calc(100% - 110px);
	display: inline-block;
}
	

a.reload{
	background: #94C4D3;
	line-height: 32px;
	color: #FFF !important;
	font-size: .875rem;
	text-align: center;
	border-radius: 16px;
	padding:6px 12px;
	vertical-align: top;
	transition-duration: .2s;
}

a.reload:hover{
	background: #0C4E7F;
	transition-duration: .2s;
}

.a_more .odfRule{
	background: #F5F5F5;
	color: #717E87;
	font-size: 0.875rem;
	padding: .875rem;
}

.a_more .odfRule a{
	text-decoration: 0;
}

/*----------------- 相關連結 -----------------*/
.link{
	padding: 12px 0 0 0;
	margin-bottom: 1.5rem;
}

.link span{
	padding-left: 0.875rem;
	font-size: 0.875rem;
}

.link a {
	padding: 6px 6px 12px 12px;
	color: #000;
	transition-duration: .2s;
}

.link a:hover {
	background: #94C4D3;
	color: #FFF;
	transition-duration: .2s;
}


@media screen and (max-width:1695px) { 
	#mainBox{
		width: 90vw;
		padding: 24px;
	}
	
	.a_content{
		height: calc(90vh - 240px);
	}
}

@media screen and (max-width:944px) { 
	body{
		background: #717E87;
		overflow: scroll;
	}
	
	#mainBox{
		display: inherit;
		height: initial;
		width: 94vw;
		padding: 24px;
		margin-bottom: 1.5rem;
	}

	#logo {
		margin: 0 1rem;
		margin-top: -70px;
	}
	
	.a_title{
		font-size: 1.2rem;
	}
	
	/*.a_content{ 
		height: calc(90% - 140px);
	}*/
	
	.a_more{
		border-left: 0;
		height: inherit;
	}
}

@media screen and (max-width:820px) { 
	#mainBox{
		width: 94vw;
		max-height: none;
		padding: 16px;
		margin-bottom: 2rem;
	}
}

@media screen and (max-width:450px) { 
	
	
	.topArea{
		margin-bottom: 1rem;
	}

	.close {
		width: 16px;
	}

	.arrow {
		width: 20px;
		margin-right: 12px;
	}

		.arrow img, .close img {
			width: 100%;
		}

	
	#mainBox h1{
		font-size: 1.6rem;
		margin-top: 0;
	}
	
	#logo{
		margin-top: -30px;
	}
	
	#logo img{
		width: 50px;
		height: 60px;
	}
	
	.a_content{
		height: inherit;
	}
	
}

/*----------------- 列印畫面用 -----------------*/

@media print {
	html, body {
		height: auto;
		overflow: visible !important;
		background: none !important;
	}

	#mainBox {
		width: 100% !important;
		height: auto !important;
		max-height: none !important;
		padding: 0 !important;
		margin: 0 !important;
		border-radius: 0;
	}

	.a_content,
	.a_more {
		height: auto !important;
		overflow: visible !important;
	}

	.print-page-break {
		display: block;
		page-break-before: always;
		break-before: page;
		height: 0;
		margin: 0;
		padding: 0;
	}

	.topArea {
		display: none;
	}

	#print_title {
		display: block;
		color: #477FA8;
		font-size: 2rem;
		font-weight: 700;
		margin-bottom: 1rem;
	}
}

/*難字*/
@font-face {
	font-family: "PccuEudcFont";
	src: url("/webPublic/Fonts/EUDC.woff") format('woff');
}

.PccuEudcFont {
	font-family: "PccuEudcFont";
}