
body {
	padding: 0;
	margin: 0;
	background: #fff;	
	color: #212529;
	line-height: 28px;
	font-size: 15px;
	font-family: "Noto Sans TC","Microsoft JhengHei","微軟正黑體","Arial", sans-serif!important;
  height: 100%;
}
body a {
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
	text-decoration: none;
}
body a:hover {
	text-decoration: none;
}
body a:focus, a:hover {
	text-decoration: none;
}
input[type="button"], input[type="submit"] {
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	font-weight:normal;
	font-weight: 500;
	line-height:1.5em;
}
p {
	margin: 0;
	color:#414141;
	letter-spacing:1px;
	line-height:1.5em;
	font-size:15px;}
.row{
	margin:0px;
	padding:0px;
}
ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
label {
	margin: 0;
}
a{
	color:#000;
}
a:focus, a:hover {
	text-decoration: none;
	outline: none;
}
a:focus, a:hover {    
    text-decoration:none;
}
.hide{display: none;}
img{width: 100%;}
section{padding-bottom: 4rem;padding-top: 4rem;}


article{
	padding:2em 0;
}

@media (max-width: 575px) {
	.container {
		padding-left: 1.5em !important;
		padding-right: 1.5em !important;
	}
}
@media (min-width: 992px) {
	.container.sm {
		max-width: 768px;
	}
}

@media (min-width: 1200px) {

	.container.sm {
		max-width: 912px;
	}
}

/*END_container*/

/*-- //Reset-Code --*/

.bg-white{background-color: #ffffff !important;}
.bg-g{background-color: #ededf0 !important;}
.bg-lightblue{background-color: #f7faff !important;}
.bg-lightgray{background-color: #f7f7f7 !important;}
.bg-yellow{background-color: #ffedc7 !important;}
.bg-green{background-color: #008582!important;}

.bg-o{background-color: #f9c270;}
.bg-bk{background-color: #000 ;}
.bg-pink{background-color: #ba4c63;}


.bg-gray{background-color: #dcdcdc;}
.bg-blue{background-color: #344989;}
.bg-blue2{background-color: #5DA4D8;}

.bg-purple{background-color: #c6d6ee;}


.f-blue{color: #2a76da;}
.f-pink{color: #e05c6f;}
.f-white{color: #FFFFFF;}
.f-green{color: #008582;}
.f-littleyellow{color: #ffeaa6!important;}
.f-yellow{color: #F2D061!important;}
.f-red{color: #d13c0f!important;}

.stroke-white,.hover-stroke-white:hover{color: #00577e;text-shadow: 0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff,0 0 calc(0.005rem + 1em / 15) #fff;}
.stroke-blue,.hover-stroke-blue:hover{color: #fff;text-shadow: 0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e,0 0 calc(0.005rem + 1em / 15)#00577e;}
.stroke-orange,.hover-stroke-orange:hover{color: #fff;text-shadow: 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27, 0 0 calc(0.005rem + 1em / 15)#e75d27;}

.bg_banner{
	background-image: url("../images/bn_bg.png");
	background-position:center bottom!important;
	background-size: cover!important;
	-ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}


/*BTN AREA*/
.topline{width:70px;}

/*BTNN*/
/* .hoverbig img{
	filter:drop-shadow(2px 2px 2px #303030);
} */
.hoverbig:hover img{
	transform: scale(1.1, 1.1);
	transition: 0.3s all;
	-webkit-transition: 0.3s all;
	-moz-transition: 0.3s all;
	-o-transition: 0.3s all;
	-ms-transition: 0.3s all;
filter:drop-shadow(0px 0px 0px #303030);
}

a.btngo{
	font-size: 2.5vmin;
	line-height: 1.7;
	font-weight: bolder;
	color: #fff;
	background: linear-gradient(5deg, #e7ce7e 0%,#ab8542 100%);
	padding: 0.25em 3.5em 0.25em 3em;
  border-radius: 5em;
	/* border: 3px solid #fff; */
	box-shadow: 4px 5px 0 rgba(18,69,112,.8);
	margin-bottom: 1em;
}

a.btngo:hover{
	color: #ffe05f;
	box-shadow: 2px 2px 0 rgba(18,69,112,.8);
    transform: scale(1.1, 1.1);
	transition: 0.3s all;
	-webkit-transition: 0.3s all;
	-moz-transition: 0.3s all;
	-o-transition: 0.3s all;
	-ms-transition: 0.3s all;
}
/*BTNN*/
.hoverbig img {
	filter: drop-shadow(2px 2px 2px #303030);
}

.hoverbig:hover img {
	transform: scale(1.1, 1.1);
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
	filter: drop-shadow(0px 0px 0px #303030);
}


.btngo .point {
	position: absolute;
  top: 5%;
  right: 10%;
    /* filter: drop-shadow(2px 2px 2px #303030); */
  width: 1.4em;
}

.btngo:hover .point {
	display: none;
}

.btngo:hover .linee {
	color: #83ff3b;
	border: 1px solid #83ff3b;
}

@media screen and (max-width: 575px) {
	a.btngo {
		font-size: 4vmin;
		border: 2px solid #fff;
		box-shadow: rgba(18, 69, 112, 0.8) -4px 5px 0px;
	}

	#part2-2 ul a.btngo {
		padding: 0.25em 2.5em 0.25em 2em;
	}
}
/*#BTNN*/
/*click*/
.click_box{
    position: relative;
}
.click_box:hover img{
   display: none;
}
.click_hand{
    position: absolute;
    filter:drop-shadow(2px 2px 2px #303030);
    width: 60px;
    z-index: 2;
}
/*##click*/
	
	/**/
	/*---------------------------#END_mainNav----------------------------*/
	
	


/*#BTNN*/
.shadow-f {
	filter: drop-shadow(3px 3px 5px #303030);
}

.shadow-f:hover {
	filter: drop-shadow(8px 8px 8px #303030);
}

/*click*/
.click_box {
	position: relative;
	display: inline-block;
}

.click_box:hover img.click_hand,
.click_box.active img.click_hand {
	display: none;
}

.click_hand {
	position: absolute;
	filter: drop-shadow(2px 2px 2px #303030);
	width: 3em;
	z-index: 2;
}

/*##click*/



.bg01{
	background-color: #f2f9ff;
	}
.bg02{
	background-color: #5494c6;
	}
	#part3{
		background-color: #98bbda;
		}
	.bg02	h3,
	.bg02	.h2title{
		color: #fff;
	}
.h2title{
	text-align: center;
	font-size: 2.5em;
	/* color: #00577e; */
	font-weight:700;
	--stroke-w: calc(0.1rem + 0.05em);
	filter: drop-shadow(0.1em 0.1em #000000aa);
}

/*----------------page-top --------------------*/


#page-top .bn{
	width: 54%;
}
#page-top .bn_box{
	padding: 1em 0 4em 0;
}
#page-top .bn_box h2{
	color: #254570;
}


@media screen and (max-width: 1300px) {


}
/*992~1200*/
@media screen and (max-width: 991px) {

#page-top .bn{
	width: 100%;
	padding: 6em 0 0 0;
}
}
@media screen and (max-width: 768px) {
	#page-top .bn {
    padding: 4.5em 0 0em 0;
}

}

/*----------------#page-top --------------------*/


/*----------------part1 --------------------*/

#part1 h4{
	font-size: 2em;
  font-weight: 700;
	color: #2e69b8;
}
#part1 .bg_white_o h4{
	color: #ff9045;
}
.bg_white{
	background-color: #fff;
	padding:1em;
}
#pt1-1 .bg_white{
	background-color: #fff;
	border-radius: 5em;
	padding: 2em 1em;
	box-shadow: 5px 5px #00577e;
	border: 5px #2e69b8 solid;
}
#pt1-1 .bg_white_o{
	background-color: #fff;
	border-radius: 5em;
	padding: 2em 1em;
	box-shadow: 5px 5px #ff9045;
	border: 5px #ff9045 solid;
}

#pt1-2 li{
width: 33%;
}
#pt1-2 li p{
	font-size: 1.2em;
	}
#pt1-2 .bg_white{
	background-color: #ffffee;
	/* box-shadow: 5px 5px#00577e; */
	padding: 1em 1em;
}
#pt1-2 .bg_glod{
	background-color: #caa862;
	/* box-shadow: 5px 5px#00577e; */
	padding: 1em 0em;
	border-radius: 1em;
	color:#fff;
}
#pt1-2 h4{
	color: #4a2007;
}
@media screen and (max-width: 767px) {
/*-------#pt1-2 --------*/
#pt1-2 li{
	width: 100%;
	margin-top: 1em;
	}
#pt1-2 li p{
	font-size: 1.3em;
	}
}

@media screen and (max-width: 575px) {
	/*-------#pt1-1 --------*/
	#part1 .bg_white{
		padding:1em;
	}
	#pt1-1 li{
		margin-top: 1em;
	}
}
/*----------------#part1 --------------------*/
/*----------------part2 --------------------*/
#part2 li:nth-child(2){
	transform: rotate(-5deg); 
}
#part2 li:nth-child(2) .bg_blue{
	clip-path: polygon(0% 0%, 80% 0%, 100% 50%, 80% 100%, 0% 100%);
	padding-right: 10%;
	background-color: #54b6dd;
}

#part2 li:nth-child(2) h4{
font-weight: 700;
line-height: 1.2em;
}
#part2 .ch4{
	font-size:1.8em;
	margin-bottom: .2em;
	font-weight: 700;
	color: #e75d27;
	padding-right: 5%;
	--stroke-w: calc(0.1rem + 0.05em);
	filter: drop-shadow(0.12em 0.12em #d8b452);
	line-height: 1.2em;
}
.bg_blue{
	background-color: #2e69b8;
	color: #fff;
	padding: .5em 0;
}
.bg_orange{
	background-color: #ff9045;
	color: #fff;
	padding: .5em 0;
}
@media screen and (max-width: 575px) {
	#part2 li:nth-child(2){
		transform: rotate(0deg); 
	}
	#part2 li:nth-child(2) .bg_blue{
		clip-path: polygon(0% 0%, 100% 0%, 100% 70%, 50% 100%, 0% 70%);
		padding-right: 0%;
		padding: 1em 0 1.5em 0;
	}
	#part2  li{
		margin-top: 1em;
	}
}

/*表格*/
/* 基本表格樣式 */
.exam-compare-table table {
	font-size: 0.95rem;
	border: 2px solid #333;
	margin-top: 2em;
}

.exam-compare-table table tr th{
background-color: #2e69b8;
color: #fff;
}

.exam-compare-table:nth-child(3) table tr th{
background-color: #ff9045 !important;
color: #fff;
}


.exam-compare-table th {
	font-weight: bold;
	vertical-align: middle;
}


/* 針對行動端的提示 */
@media (max-width: 768px) {
	
	.exam-compare-table {
			position: relative;
	}
	/* 可以在下方加個小提示告訴使用者可以左右滑動 */
	/* .exam-compare-table::after {
			content: "← 左右滑動檢視完整對照 →";
			display: block;
			text-align: center;
			font-size: 0.8rem;
			color: #888;
			padding: 5px 0;
	} */
}
/*----------------#part2--------------------*/
/*----------------part3 --------------------*/
#part3 .y_box{
	background-color: #2e69b8;
	padding: .1em 1em 0.25em 1em;
	font-size: 0.9em;
	color: #fff;
}
#part3 .h3title{
	font-size: 3em;
	color: #2e69b8;
	font-weight:800;
	--stroke-w: calc(0.1rem + 0.05em);
	filter: drop-shadow(0.1em 0.1em #000000aa);
	margin-bottom: .3em;
}


#part3 li img{
	width: 35%;
	margin-bottom: .5em;
}
#part3 h5 span{
	background-color: #ff9045;
	color: #fff;
	padding: .1em 2em 0.25em 2em;
	font-size: 1em;
	font-weight: 700;
	border-radius: 2em;
}
#part3 li:nth-child(1) h5 span{
	background-color: #29abe2;
}
#part3 h4{
	font-size: 2em;
	font-weight: 700;
	filter: drop-shadow(0.1em 0.1em #123c7caa);
}
#part3 p{
	font-size: 1.2em;
}

/*主目標-國營職員級*/
#part3 .mainitem{
	margin-bottom: 6em;
}
#part3 .mainitem h5 span{
	background-color: #fff;
	color: #2e69b8;
	border: #2e69b8 3px solid;
}
#part3 .mainitem .hlh4{
	background-color: #ffe84b;
	color: #ff6060;
	padding: .1em 0em 0.25em 0em;
	font-size: 1.5em;
}



#part3 .al,
#part3 .ar{
position:absolute;
width: 10%;
top: 17%;
}
#part3 .al{
left: 27%;
}
#part3 .ar{
right: 27%;
}
@media screen and (max-width: 767px) {
#part3 .mainitem{
	margin-bottom: 1em;
}
#part3 h5 span{
	padding: .1em 1em 0.25em 1em;
}
#part3 h4 {
	font-size: 1.5em;
}
#part3 .mainitem h4{
	font-size: 2em;
}
#part3 .mainitem img{
	width: 35%;
}
#part3 li img{
	width: 50%;
}
}
/*----------------#part3-------------------*/
/*----------------part4 --------------------*/

/*----------------#part4--------------------*/
/*----------------part5--------------------*/
.story {
  justify-content: center;
  align-items: stretch;
  width: 100%;
  margin: 0px 0px;
  border-radius: 20px;
  overflow: hidden;
}


.left {
	align-items: center;
	padding: 1.5em 0em 1.5em 1em;
	background-color: #caa862;
	text-align: center;
}

.left h4 {
  font-size: 1.4em;
  line-height: 1.2;
  color: #fff;
  font-style: normal;
}
.left h5 {
  font-size: 1.8em;
  color: #fff;
  font-weight: 700;
}
.left h5 span{
  display: inline-block;
	font-size: .9em;
  padding: .1em 1em;
  background-color: #ff6903;
  border-radius: 50px;
	line-height: 1.2em;
}
.right {
  text-align: justify;
  padding:2em 3em 2em 2em;
  background-color: #fff;
	vertical-align:middle;
}
.right p {
  font-size: 1.2em;
  color: #fff;
  line-height: 1.6;
  color: #595757;
}
.carousel-control-prev {
	left: -1.5em!important;
}
.carousel-control-next {
	right: -2.5em !important;
}
@media screen and (max-width: 575px) {
	.carousel-control-prev {
		left: -3em;
	}
	.carousel-control-next {
		right: -3em;
	}

}


/* ===== 平板 ===== */
@media (max-width: 820px) {
  .right p {
    font-size: 1.1em;
  }
}

/* ===== moblie ===== */
@media (max-width: 768px) {
  .story {
    border-radius: 8px;
  }

	.left h4 {
    font-size: 1.4em;
  }

	.carousel-control-next {
    right: -1em !important;
}
}

@media (max-width: 600px) {
  .left h4 {
    font-size: 1.2em;
    line-height: 1.2;
  }
  .left h5 {
    padding: .2em .8em;
    font-size: 1.6em;
  }
  .right {
    padding: 20px;
  }
  .right p {
    font-size: 1em;
		line-height: 1.4;
  }

.left {
	padding: 1.5em 0.5em 1.5em .8em;
}
}
/*----------------#part5--------------------*/

/*---------------------------media------------------------------*/
@media screen and (max-width: 1400px) {
}
/*992~1200*/
@media screen and (max-width: 1199px) {
	
}/*576以上*/
@media screen and (min-width: 576px) {
.type_ph{display: none!important;}
	
}/*手機板575*/
@media screen and (max-width: 575px) {
section{padding-bottom: 1.2rem;padding-top: 1.2rem;}	
.type_pc{display: none!important;}
/* .container:not(.nolr){
    padding-left: 0!important;
    padding-right: 0!important;}	 */

}/*END(max-width: 575px)*/
@media screen and (max-width: 472px) {	


}/*END(max-width: 472px)*/
@media screen and (max-width: 420px) {


}
