@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;500;900&display=swap');
@import "//fonts.googleapis.com/css?family=Macondo: 400|Short+Stack:400|Open+Sans:700|Gentium+Book Basic:700|PT+Serif:400|Volkhov:700|Source+Sans Pro:300|Source+Sans Pro:400|Varela+Round:400";
.gotop { position: fixed; z-index: 10; right: 5px; bottom: 20px; width: 50px; height: 50px; padding-top: 13px; border-radius: 25px; color: #fff; background: rgba(0, 0, 0, 0.5); cursor: pointer; text-align: center; }

/* 按鈕 */
.go_btn { align-items: center; justify-content: center; padding: 0.8em 1em; border: solid yellow 0.15em; border-radius: 0.25em; color: yellow; }
.go_btn:hover { border: solid red 0.15em; color: red; }
img { max-width: 100%; height: auto; border: 0;}

/* CSS Document @media由小寫到大*/
* { padding: 0; margin: 0; }
body { margin: 0px; background: url(../images/bg.png); font-family: arial, 'Noto Sans TC'; font-weight: 300; -webkit-overflow-scrolling: touch; }

/*共用------------------------------*/
.wrap { position: relative; padding-top: 100px; padding-bottom: 100px; color: #fff; }
.wrap:before { position: absolute; z-index: -1; top: 0; width: 100%; height: 100vh; background: url(../images/bg_top.png?20241206) no-repeat top center; background-size: 250% auto; content: ''; pointer-events: none; }
.wrap:after { position: absolute; z-index: -1; bottom: 0; width: 100%; height: 100vh; background: url(../images/bg_bottom.png) no-repeat bottom center; background-size: 250% auto; content: ''; pointer-events: none; }
li { list-style: none; }

/*類別標題*/
.title .col-md-6:nth-child(2n) { padding: 10px 0 25px; background: url(../images/bg_class_title2.png) no-repeat bottom left; background-size: 90% auto; text-align: center; }
.title .col-md-6 h2 { padding: 20px 0; background: url(../images/bg_class_title.png) no-repeat right center; background-size: auto 100%; text-align: center; font-size: 1.8em; }
.special-j .col-md-6 h2 { padding: 20px 0; background: url(../images/bg_class_title.png) no-repeat right center; background-size: auto 100%; text-align: center; font-size: 1.6em; }
.title .col-md-6 h2 small { display: inline-block; }
h3 { text-align: center; }
.title .col-md-6 [class*="col"]:not(:last-child) { border-right: 1px dotted #01a1fe; }

/* activity */
.title .col-md-7:nth-child(2n) { padding: 10px 0 25px; background: url(../images/bg_class_title2.png) no-repeat bottom left; background-size: 90% auto; text-align: center;}
.title .col-md-7 h2 {padding: 20px 0; background: url(../images/bg_class_title.png) no-repeat right center; background-size: auto 100%; text-align: center; font-size: 1.65em; }
.title .col-md-7 h2 small { display: inline-block; }
h3 { text-align: center; }
.acttitle .col-md-7 [class*="col"]:not(:last-child) { border-right: 1px dotted #01a1fe; }
.activity h4, .activity h5{text-align: center;margin: 15px;}



.activity .fillin .fillin_item{border-bottom: 1px dashed #01a1fe; margin-bottom: 15px;}

.activity .add{position: relative;padding: 12px 8px ; border: 1px solid #01a1fe !important; color: #ddd; text-align: center;margin-top: 0;}
.activity .add_item:before{ position: absolute; top: -10px;left: 0; display: block; width: 100%; height: 20px; background: url(../images/data_top.png) no-repeat top; background-size: 100% auto; content: ''; }
.activity .add_item:after { position: absolute; bottom: -20px; left: 0; display: block; width: 100%; height: 20px; background: url(../images/data_bottom.png) no-repeat top; background-size: 100% auto; content: ''; }

.activity ul li div{border: #01a1fe 1.5px solid;padding: 15px 13px 15px 14px;}

/*個頁目錄*/
.menu { margin-top: 20px; margin-bottom: 40px; }
.menu_center { color: #fff; text-align: center; font-weight: bold; }
.menu a { position: relative; top: 0; display: block; padding: 10% 0 16%; margin-bottom: 10px; color: #01a1fe; background: url(../images/btn_target_in.png) no-repeat right bottom; transition-duration: .3s; text-align: center; font-weight: 500; }
.menu a:hover { position: relative; top: -5px; display: block; color: #0bcad3; background: url(../images/btn_target_h_in.png) no-repeat right bottom; text-shadow: 0 0 8px rgba(11, 202, 211, 0.3); }
.menu a:before { position: absolute; top: 0px; display: block; width: 100%; height: 100%; background: url(../images/btn_target.svg) no-repeat top left; background-size: 100% auto; content: ''; transition-duration: .3s; }
.menu a:hover:before { opacity: 0; }
.menu a:after { position: absolute; top: 0px; display: block; width: 100%; height: 100%; opacity: 0; background: url(../images/btn_target_h.svg) no-repeat top left; background-size: 100% auto; content: ''; transition-duration: .3s; }
.menu a:hover:after { opacity: 1; }

/*項目符號*/
ol li { margin-bottom: 10px; }
ol li:last-of-type { margin-bottom: 0; }
ol.second_list { margin-top: 5px; margin-left: 2rem; list-style: none; }
ol.second_list > li { position: relative; }
ol.second_list > li::before { position: absolute; left: -2rem; content: "("counter(list-item, cjk-ideographic)")"; }
ol.second_list ol { margin-top: 10px; }
ol.fore_list { margin-left: 2rem; list-style: none; }
ol.fore_list > li { position: relative; }
ol.fore_list li::before { position: absolute; left: -1.5rem; content: "("counter(list-item, decimal)")"; }

/*回上方*/
.menu_buttom { position: relative; top: 0px; display: inline-block; width: 205px; margin-bottom: 60px; transition-duration: .3s; }
.menu_buttom:hover { top: -5px; }
.menu_buttom:before { position: absolute; display: block; width: 100%; height: 100%; opacity: 0; background: url(../images/btn_go_top_h.svg); background-size: 100% auto; content: ''; transition-duration: .3s; }
.menu_buttom:hover:before { opacity: 1; }
.menu_buttom img { transition-duration: .3s; }
.menu_buttom:hover img { opacity: 0; }

/* 考試用書推薦按鈕 */
.menu_buttom2 { position: relative; top: 0px; display: inline-block; width: 205px; margin-bottom: 60px; transition-duration: .3s; }
.menu_buttom2:hover { top: -5px; }
.menu_buttom2:before { position: absolute; display: block; width: 100%; height: 100%; opacity: 0; background: url(../images/btn_go_top_h2.svg); background-size: 100% auto; content: ''; transition-duration: .3s; }
.menu_buttom2:hover:before { opacity: 1; }
.menu_buttom2 img { transition-duration: .3s; }
.menu_buttom2:hover img { opacity: 0; }

/*表格*/
.table-responsive { padding: 20px 0; }
.table-responsive table { position: relative; min-width: 800px; border: 1px solid #01a1fe !important; color: #ddd; text-align: center; }
.table-responsive table:before{ position: absolute; top: -20px; left: 0; display: block; width: 100%; height: 20px; background: url(../images/data_top.png) no-repeat top; background-size: 100% auto; content: ''; }
.table-responsive table:after { position: absolute; bottom: -20px; left: 0; display: block; width: 100%; height: 20px; background: url(../images/data_bottom.png) no-repeat top; background-size: 100% auto; content: ''; }
.table-responsive table th { border: 1px solid #000c30; color: #000c30; background: #01a1fe; vertical-align: middle; }
.table-responsive table td { border: 1px solid #01a1fe; vertical-align: middle; }
.table-responsive table .tr_odd td { background: rgba(1, 161, 254, 0.3); }

/*卡片*/
.card { background: none; }
.card ol { margin-bottom: 0; }

/*文字框*/
.border_color { position: relative; padding: 15px 15px 0; margin-top: 30px; margin-bottom: 40px; border: 1px solid #01a1fe !important; }
.border_color:before { position: absolute; top: -20px; left: 0; display: block; width: 100%; height: 20px; background: url(../images/data_top.png) no-repeat top; background-size: 100% auto; content: ''; }
.border_color:after { position: absolute; bottom: -20px; left: 0; display: block; width: 100%; height: 20px; background: url(../images/data_bottom.png) no-repeat top; background-size: 100% auto; content: ''; }

/*主頁index------------------------------*/
ul.main_nav { display: flex; justify-content: space-around; margin-top: 20px; }
ul.main_nav li { position: relative; width: 31%; margin-bottom: 10px; }
ul.main_nav li:before { position: absolute; z-index: -1; top: 0; left: 0; display: block; width: 100%; height: 100%; background: url(../images/btn_nav.svg) no-repeat; background-size: 100% auto; content: ''; transition-duration: .3s; }
ul.main_nav li:hover:before { opacity: 0; }
ul.main_nav li:after { position: absolute; z-index: -1; top: 0; left: 0; display: block; width: 100%; height: 100%; opacity: 0; background: url(../images/btn_nav_h.svg) no-repeat; background-size: 100% auto; content: ''; transition-duration: .3s; }
ul.main_nav li:hover:after { opacity: 0.6; }
ul.main_nav a { display: block; padding: 12% 0 16% 0; color: #fff; transition-duration: .3s; text-align: center; }
ul.main_nav a:hover { color: #fff; }
ul.main_nav li a.active { position: relative; color: #fff; }
ul.main_nav li a.active:after { position: absolute; z-index: -1; top: 0; left: 0; display: block; width: 100%; height: 100%; background: url(../images/btn_nav_h.svg) no-repeat; background-size: 100% auto; content: ''; }
.main_content{ background: url(../images/bg_tab-pane_top.png) no-repeat top, url(../images/bg_tab-pane_bottom.png) no-repeat bottom, url(../images/bg_tab-pane_center.png) repeat-y; background-size: 100% auto; }

/*警察特考special------------------------------*/

.special-j .special_j_item2 span{color: #ffc107;font-size: 25px;font-weight: 400;}

.special-j h6{font-size: 16px;}

.special-j ul li {
  position: relative;
  padding-left: 1em;
  font-size: 17px;
  text-align: start;
}

.special-j .special_j_item2 ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 0.6em;
  height: 0.6em;
  background-image: url(../images/special_j-2.png);
  background-size: cover;
  background-repeat: no-repeat;
}

.special_j_item h5{
	background:#01a1fe;
	display: block;
	color: #000c30;
}

.special-j .special_j_item { position: relative; min-width: 100%; border: 1px solid #01a1fe !important; color: #ddd; text-align: center; }
.special-j .special_j_item:before{ position: absolute; top: -20px; left: 0; display: block; width: 100%; height: 20px; background: url(../images/data_top.png) no-repeat top;  content: ''; }
.special-j .special_j_item:after { position: absolute; bottom: -20px; left: 0; display: block; width: 100%; height: 20px; background: url(../images/data_bottom.png) no-repeat top;  content: ''; }

.special_j_item ul li span{
	font-weight: 400;
}

.special_j_item ul li{
	font-size: 15px;
}


/*警察升官等考promotion------------------------------*/

/*警大碩士班graduate------------------------------*/
#graduate .title .col-md-6 [class*="col"]:not(:last-child) { border-right: 1px dotted #01a1fe; }
#graduate .title .col-md-6 [class*="col"]:nth-child(1) { padding-bottom: 10px; border-bottom: 1px dotted #01a1fe; }
#graduate .title .col-md-6 [class*="col"]:nth-child(2) { padding-bottom: 10px; border-right: 0; border-bottom: 1px dotted #01a1fe; }
#graduate .title .col-md-6 [class*="col"]:nth-child(3) { padding-top: 10px; }

/*警佐班/消佐班basic------------------------------*/
.table_basic_fire.table-responsive table { min-width: 100%; }
.table_list { display: inline-block; padding-left: 2em; margin-bottom: 10px; text-indent: -2em; }
td .table_list:last-child { margin-bottom: 0; }

/*師資陣容teacher------------------------------*/
#teacher .col-md-6 { margin-bottom: 30px; }
.teacher_item { padding: 15px 15px 0; margin-bottom: 0; color: #000c30; background: url(../images/bg_teacher_top.png) no-repeat top center #27aae1; background-size: 100% auto; }
.teacher_item h5 { padding: 3% 0 0; font-size: 2em; }
.teacher_item .col-5 { padding-right: 0; }
.teacher_item .col-5 div { background: #fff; }
.teacher_item .col-7 { font-weight: 400; }
.teacher_item ul li { margin-bottom: 5px; }
.teacher_item ul a { color: #000c30; }
#teacher .col-md-6 > img { display: block; }
.modin { position: relative; top: -60px; display: block; visibility: hidden; width: 1px; height: 1px; }
 /*sm*/ 
@media (min-width:576px) {
	
}
 /*md*/
@media (min-width:768px) {
	.wrap:before, .wrap:after { background-size: 120% auto; }
	
		/*個頁目錄*/
	.menu .row { align-items: center; }
	.menu a { padding: 23px 0 28px; }
	.menu a:before { background-size: 100% auto; }
	.menu a:after { background-size: 100% auto; }
	.menu_center { margin-bottom: 0; }
	
		/*主頁index------------------------------*/
	ul.main_nav li { width: 27%; margin-bottom: 15px; }
	ul.main_nav li:before { background-size: auto 100%; }
	ul.main_nav li:after { background-size: auto 100%; }
	ul.main_nav a { padding: 13% 5% 17.5% 0; font-size: 1.2em; }
	ul.main_nav li a.active:after { background-size: auto 100%; }
	
		/*師資陣容teacher------------------------------*/
	.teacher_item .col-5 { padding-right: 15px; margin-bottom: 15px; }
	.modin { position: relative; top: -100px; visibility: hidden; }


	/* 警察特考special */
	.activity .fillin .fillin_item{border-bottom: none;}
	.activity .fillin .fillin_item{border-right: 1px dashed #01a1fe; margin-bottom: 15px;}

	.activity .add_item:before{ top: -20px; }


	.special_j_item2 h6{text-align: center;font-size: 22px;line-height: 32px;}

	.special_j_item2 ul li{font-size: 21px;	}

	.special-j .col-md-6 h2 { font-size: 2em; }

	.special_j_item ul li{font-size: 18px;}

}
 	 /*lg*/
@media (min-width:992px) {
	.wrap { padding: 100px 0 150px; }
	.wrap:before, .wrap:after { background-size: 100% auto; }
	.title .col-md-6:nth-child(2n) { background-size: auto 20px; }
	
		/*個頁目錄*/
	.menu a { padding: 12% 0 15%; font-size: 1.2em; }
	.menu_center { font-size: 1.4em; }
	
		/*主頁index------------------------------*/
	ul.main_nav a { font-size: 1.6em; }
	
		/*師資陣容teacher------------------------------*/
	.teacher_item .col-5 { padding-right: 0; }
}

	 /*xl*/
@media (min-width:1200px) {
	.wrap { padding: 10% 0 15%; }
	.title .col-md-6 h2 { font-size: 2.6em; }
	
		/*個頁目錄*/
	.menu a { padding: 15% 0 14%; font-size: 1.4em; }
	.menu_center { font-size: 1.6em; }
	
		/*主頁index------------------------------*/
	ul.main_nav li { width: 15%; }
	ul.main_nav a { padding: 13% 5% 15% 0; font-size: 1.25em; }
	
		/*警大碩士班graduate------------------------------*/
	#graduate .title .col-md-6 [class*="col"]:not(:last-child) { border-right: 1px dotted #01a1fe; }
	#graduate .title .col-md-6 [class*="col"]:nth-child(1) { padding-bottom: 0px; border-bottom: 0; }
	#graduate .title .col-md-6 [class*="col"]:nth-child(2) { padding-bottom: 0px; border-right-width: 1px; border-bottom: 0; }
	#graduate .title .col-md-6 [class*="col"]:nth-child(3) { padding-top: 0px; }
}