/*==========簡介內容頁共用設定=========*/
#xo-content .formatbox #about {
	position: relative;
	padding: 0rem 0.625rem;
	color: #303030;
	word-break: normal;
	overflow-wrap: anywhere;
}

#xo-content .formatbox #about .table {
	margin: 1.875rem 0rem;
}

#xo-content .formatbox #about .alert {
	font-size: 120%;
}

#xo-content .formatbox #about .table-striped tbody tr:nth-of-type(odd) {
	background-color: rgba(0, 0, 0, 0.05) !important;
}

/*==========簡介內容頁共用標題=========*/
#xo-content .formatbox #about_title_h3 {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	min-height: 3.75rem;
	margin: 0rem 0rem 1.875rem 0rem !important;
	padding: 0.5rem 3.25rem;
	background: #197caf;
	border-top: 0.5rem solid #d45aa9;
	border-bottom: 0.125rem solid #0b5d86;
	border-radius: 0rem 0rem 0.375rem 0.375rem;
	box-shadow: 0rem 0.1875rem 0.5rem rgba(0, 61, 94, 0.18);
	color: #ffffff;
	font-size: 135%;
	font-weight: 700;
	line-height: 1.45;
	text-align: center;
}

#xo-content .formatbox #about_title_h3 #about_title {
	position: relative;
	z-index: 1;
	display: inline-block;
	box-sizing: border-box;
	max-width: 100%;
	padding: 0.125rem 2.1875rem;
	background: #ffffff;
	border: 0.0625rem solid #d9edf7;
	border-radius: 0.25rem;
	color: #075b84;
	overflow-wrap: anywhere;
}

#about #about_title_h3::before,
#about #about_title_h3::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 1.25rem;
	height: 0.3125rem;
	margin-top: -0.15625rem;
	background: #ffe05c;
	pointer-events: none;
}

#about #about_title_h3::before {
	left: 1.125rem;
}

#about #about_title_h3::after {
	right: 1.125rem;
}

/*==========簡介內容頁共用文字=========*/
#xo-content .formatbox #about .conrent_each {
	position: relative;
	margin: 0rem 0rem 2.25rem 0rem;
	color: #303030;
	line-height: 1.9;
}

#xo-content .formatbox #about p {
	margin: 0rem 0rem 1.25rem 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 2em;
}

#xo-content .formatbox #about dt {
	color: #477b1c;
	font-weight: 700;
}

#xo-content .formatbox #about .style_01,
#xo-content .formatbox #about .style_02,
#xo-content .formatbox #about .style_03,
#xo-content .formatbox #about .style_04,
#xo-content .formatbox #about .style_05,
#xo-content .formatbox #about .style_06 {
	font-size: 110%;
	font-weight: 700;
}

#xo-content .formatbox #about .style_01 {
	color: #a91569;
}

#xo-content .formatbox #about .style_02 {
	color: #075b84;
}

#xo-content .formatbox #about .style_03 {
	color: #8a4a00;
}

#xo-content .formatbox #about .style_04 {
	color: #176b2d;
}

#xo-content .formatbox #about .style_05 {
	color: #64249b;
}

#xo-content .formatbox #about .style_06 {
	color: #b3261e;
}

#xo-content .formatbox #about h4 .fa-brands {
	position: relative;
	top: 0.1875rem;
	font-size: 130%;
}

/*==========簡介內容頁共用圖片=========*/
#xo-content .formatbox #about #img_box {
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
}

#xo-content .formatbox #about #img_box img {
	display: block;
	width: 100%;
	height: auto !important;
	border-radius: 0.25rem;
	object-fit: contain;
	transform: scale(1, 1);
	transform-origin: center center;
}

#xo-content .formatbox #about #img_box:hover img {
	animation: img_box 0.7s ease-in-out 1;
}

@keyframes img_box {
	0% {
		transform: scale(1, 1);
	}

	60% {
		transform: scale(1.2, 0.9);
	}

	100% {
		transform: scale(1, 1);
	}
}

#xo-content .formatbox #about #img_box figcaption {
	position: relative;
	margin: 0rem;
	padding: 0.5rem 0.75rem 0.125rem 0.75rem;
	color: #46545a;
	font-size: 90%;
	line-height: 1.6;
	text-align: center;
}

/*==========歷史沿革：校景圖=========*/
#xo-content .page1.formatbox #about #img_box.img_box_l {
	width: 100%;
	margin: 0.625rem 0rem 1.5625rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page1.formatbox #about .history_intro {
	position: relative;
	margin: 0rem 0rem 2rem 0rem;
	padding: 1.125rem 1.375rem 0.125rem 1.375rem;
	background: #f3f9fc;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
}

/*==========歷史沿革：歷任校長=========*/
#xo-content .page1.formatbox #about .history_section_title,
#xo-content .page1.formatbox #about .history_vision h4 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1.25rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
}

#xo-content .page1.formatbox #about .history_section_title .fa-solid,
#xo-content .page1.formatbox #about .history_vision h4 .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page1.formatbox #about .history_timeline {
	position: relative;
	margin: 0rem 0rem 2rem 0rem;
	padding: 0rem;
	list-style: none;
}

#xo-content .page1.formatbox #about .history_timeline::before {
	content: "";
	position: absolute;
	top: 0.75rem;
	bottom: 0.75rem;
	left: 1.125rem;
	width: 0.1875rem;
	background: #9fc9dc;
}

#xo-content .page1.formatbox #about .history_timeline > li {
	position: relative;
	display: grid;
	grid-template-columns: minmax(9.5rem, 12rem) minmax(0, 1fr);
	gap: 1.25rem;
	box-sizing: border-box;
	margin: 0rem 0rem 1rem 0rem;
	padding: 1rem 1.125rem 1rem 3rem;
	background: #ffffff;
	border: 0.0625rem solid #c6d8e0;
	border-top: 0.3125rem solid #2b95bf;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.1);
	list-style: none !important;
}

#xo-content .page1.formatbox #about .history_timeline > li::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 1.3125rem;
	left: 0.6875rem;
	box-sizing: border-box;
	width: 1.0625rem;
	height: 1.0625rem;
	background: #ffffff;
	border: 0.3125rem solid #d64f9a;
	border-radius: 50%;
}

#xo-content .page1.formatbox #about .history_timeline > li:nth-child(even) {
	border-top-color: #d77c2c;
}

#xo-content .page1.formatbox #about .history_timeline h5 {
	align-self: start;
	box-sizing: border-box;
	margin: 0rem;
	padding: 0.5rem 0.625rem;
	background: #edf7fb;
	border-bottom: 0.125rem solid #8dc7df;
	color: #2b3438;
	font-size: 108%;
	line-height: 1.65;
	text-align: center;
}

#xo-content .page1.formatbox #about .history_term {
	display: block;
	margin-bottom: 0.125rem;
	color: #7d315f;
	font-size: 90%;
	font-weight: 700;
}

#xo-content .page1.formatbox #about .history_detail {
	min-width: 0rem;
}

#xo-content .page1.formatbox #about .history_detail p {
	margin: 0rem 0rem 0.75rem 0rem;
	text-indent: 0rem;
}

#xo-content .page1.formatbox #about .history_detail p:last-child {
	margin-bottom: 0rem;
}

#xo-content .page1.formatbox #about .history_vision {
	position: relative;
	margin-top: 2rem;
	padding: 0rem 0rem 0.25rem 0rem;
	background: #fffbea;
	border-bottom: 0.125rem solid #e3bf37;
}

#xo-content .page1.formatbox #about .history_vision h4 {
	background: #9a5b18;
	border-left-color: #ffe17a;
}

#xo-content .page1.formatbox #about .history_vision p {
	margin: 0rem;
	padding: 1rem 1.375rem 1.25rem 1.375rem;
}





/*============學校簡介=====================*/
#xo-content .page12.formatbox #about .school_intro_layout,
#xo-content .page12.formatbox #about .school_feature_layout {
	display: grid;
	grid-template-columns: minmax(17.5rem, 42%) minmax(0rem, 1fr);
	gap: 1.5rem;
	align-items: start;
	box-sizing: border-box;
}

#xo-content .page12.formatbox #about .school_intro_layout {
	padding: 1rem;
	background: #f3f9fc;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
}

#xo-content .page12.formatbox #about .school_about_figure {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	margin: 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page12.formatbox #about .school_about_figure a {
	display: block;
	overflow: hidden;
	border-radius: 0.25rem;
}

#xo-content .page12.formatbox #about .school_about_figure img {
	display: block;
	width: 100%;
	height: auto !important;
	border-radius: 0.25rem;
	object-fit: contain;
	transform: scale(1, 1);
	transform-origin: center center;
}

#xo-content .page12.formatbox #about .school_about_figure:hover img {
	animation: img_box 0.7s ease-in-out 1;
}

#xo-content .page12.formatbox #about .school_about_figure figcaption {
	margin: 0rem;
	padding: 0.625rem 0.5rem 0.125rem 0.5rem;
	color: #46545a;
	font-size: 90%;
	line-height: 1.6;
	text-align: center;
}

#xo-content .page12.formatbox #about .school_intro_text,
#xo-content .page12.formatbox #about .school_feature_content {
	min-width: 0rem;
}

#xo-content .page12.formatbox #about .school_intro_text p,
#xo-content .page12.formatbox #about .school_feature_content p {
	margin-bottom: 1rem;
}

#xo-content .page12.formatbox #about .history_section_title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	box-sizing: border-box;
	margin: 0rem 0rem 1.25rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
	text-align: center;
}

#xo-content .page12.formatbox #about .history_section_title .fa-solid {
	color: #fff1a8;
}

#xo-content .page12.formatbox #about .school_subtitle {
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0.5rem 0.75rem;
	background: #eef8f6;
	border-left: 0.3125rem solid #2c9a83;
	color: #176878;
	font-size: 112%;
	font-weight: 700;
	line-height: 1.6;
}

#xo-content .page12.formatbox #about .school_subtitle .fa-solid {
	margin-right: 0.5rem;
	color: #d45aa9;
}

#xo-content .page12.formatbox #about .school_vision_list,
#xo-content .page12.formatbox #about .school_goal_list {
	margin: 0rem 0rem 1.5rem 0rem;
	padding: 0rem;
	list-style: none;
}

#xo-content .page12.formatbox #about .school_vision_list li,
#xo-content .page12.formatbox #about .school_goal_list li {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 0.625rem 0rem;
	padding: 0.625rem 0.875rem 0.625rem 2.25rem;
	background: #ffffff;
	border-bottom: 0.0625rem solid #c8dce5;
	line-height: 1.8;
	list-style: none;
}

#xo-content .page12.formatbox #about .school_vision_list li::before,
#xo-content .page12.formatbox #about .school_goal_list li::before {
	content: "";
	position: absolute;
	top: 1.1875rem;
	left: 0.875rem;
	box-sizing: border-box;
	width: 0.75rem;
	height: 0.75rem;
	background: #ffffff;
	border: 0.25rem solid #d45aa9;
	border-radius: 50%;
}

#xo-content .page12.formatbox #about .school_vision_list li > span:first-child {
	display: inline-block;
	min-width: 6.5rem;
	margin-right: 0.5rem;
}

#xo-content .page12.formatbox #about .school_building_layout {
	padding: 1rem;
	background: #fffbea;
	border-bottom: 0.125rem solid #e3bf37;
}

#xo-content .page12.formatbox #about .school_building_list {
	margin: 0.5rem 0rem 0rem 0rem;
}

#xo-content .page12.formatbox #about .school_building_list dt {
	margin: 0.75rem 0rem 0.25rem 0rem;
	padding: 0.375rem 0.75rem;
	background: #fff3bd;
	border-left: 0.3125rem solid #d79524;
	color: #76500c;
	font-size: 108%;
	font-weight: 700;
}

#xo-content .page12.formatbox #about .school_building_list dd {
	margin: 0rem;
	padding: 0.25rem 0.75rem 0.75rem 1.25rem;
	line-height: 1.9;
}

/*==========學校簡介：快樂校徽===========*/
#xo-content .page12.formatbox #about .school_emblem_section {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 2rem 0rem;
}

#xo-content .page12.formatbox #about .school_emblem_section > .history_section_title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	box-sizing: border-box;
	margin: 0rem 0rem 1.25rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
	text-align: center;
}

#xo-content .page12.formatbox #about .school_emblem_section > .history_section_title .fa-solid {
	color: #fff1a8;
}

#xo-content .page12.formatbox #about .school_emblem_layout {
	position: relative;
	display: grid;
	grid-template-columns: minmax(14rem, 20rem) minmax(0rem, 1fr);
	gap: 1.25rem;
	align-items: center;
	box-sizing: border-box;
	padding: 1rem;
	background: #fffbea;
	border-left: 0.375rem solid #d6a820;
	border-bottom: 0.125rem solid #e3bf37;
}

#xo-content .page12.formatbox #about .school_emblem_figure {
	box-sizing: border-box;
	margin: 0rem;
	padding: 0.5rem;
	background: #ffffff;
	border: 0.0625rem solid #c8b779;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.75rem rgba(72, 61, 22, 0.14);
	overflow: hidden;
}

#xo-content .page12.formatbox #about .school_emblem_figure .fancybox_each,
#xo-content .page12.formatbox #about .school_emblem_figure img {
	display: block;
	width: 100%;
	height: auto;
}

#xo-content .page12.formatbox #about .school_emblem_figure img {
	border-radius: 0.25rem;
	object-fit: contain;
}

#xo-content .page12.formatbox #about .school_emblem_figure figcaption {
	margin: 0rem;
	padding: 0.5rem 0.75rem 0.125rem 0.75rem;
	color: #5d5642;
	font-size: 90%;
	line-height: 1.6;
	text-align: center;
}

#xo-content .page12.formatbox #about .school_emblem_content {
	min-width: 0rem;
}

#xo-content .page12.formatbox #about .school_emblem_description {
	box-sizing: border-box;
	padding: 1rem 1.25rem;
	background: #ffffff;
	border: 0.0625rem solid #e0d5ad;
	border-radius: 0.25rem;
}

#xo-content .page12.formatbox #about .school_emblem_description h5 {
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0rem 0rem 0.5rem 0rem;
	border-bottom: 0.0625rem solid #dfcf91;
	color: #075b84;
	font-size: 115%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page12.formatbox #about .school_emblem_description h5 .fa-solid {
	margin-right: 0.625rem;
	color: #d64f9a;
}

#xo-content .page12.formatbox #about .school_emblem_description p {
	margin: 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 2em;
}



/*===========快樂學區=================*/
#xo-content .page5.formatbox #about #img_box.img_box_l {
	width: 100%;
	box-sizing: border-box;
	margin: 0.625rem 0rem 1.5625rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page5.formatbox #about #img_box.img_box_l a {
	display: block;
	overflow: hidden;
	border-radius: 0.25rem;
}

#xo-content .page5.formatbox #about #img_box.img_box_l figcaption {
	margin: 0rem;
	padding: 0.625rem 0.75rem 0.125rem 0.75rem;
	color: #46545a;
	font-size: 90%;
	line-height: 1.6;
	text-align: center;
}

#xo-content .page5.formatbox #about .school_district_panel {
	position: relative;
	box-sizing: border-box;
	margin: 0rem;
	padding: 1rem;
	background: #f6fafb;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.125rem solid #c8dce5;
}

#xo-content .page5.formatbox #about .school_district_title {
	box-sizing: border-box;
	margin: 0rem 0rem 1rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 120%;
	font-weight: 700;
	line-height: 1.55;
}

#xo-content .page5.formatbox #about .school_district_title .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page5.formatbox #about .school_district_list {
	display: grid;
	grid-template-columns: minmax(13.5rem, 19rem) minmax(0rem, 1fr);
	box-sizing: border-box;
	margin: 0rem;
	padding: 0rem;
	background: #ffffff;
	border: 0.0625rem solid #c8dce5;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.08);
	overflow: hidden;
}

#xo-content .page5.formatbox #about .school_district_list dt,
#xo-content .page5.formatbox #about .school_district_list dd {
	box-sizing: border-box;
	margin: 0rem;
	border-bottom: 0.0625rem solid #d7e3e8;
}

#xo-content .page5.formatbox #about .school_district_list dt {
	padding: 0.875rem 1rem;
	background: #edf7fb;
	border-left: 0.3125rem solid #2b95bf;
	color: #176878;
	font-size: 105%;
	font-weight: 700;
	line-height: 1.8;
}

#xo-content .page5.formatbox #about .school_district_list dt .fa-solid {
	margin-right: 0.5rem;
	color: #d45aa9;
}

#xo-content .page5.formatbox #about .school_district_list dd {
	padding: 0.875rem 1.125rem;
	background: #ffffff;
	color: #303030;
	line-height: 1.9;
}

#xo-content .page5.formatbox #about .school_district_list dt:first-of-type {
	background: #e8f7ee;
	border-left-color: #2f9b59;
	color: #176b2d;
}

#xo-content .page5.formatbox #about .school_district_list dt:first-of-type + dd {
	background: #f4fbf6;
	font-weight: 700;
}

#xo-content .page5.formatbox #about .school_district_list dt:last-of-type,
#xo-content .page5.formatbox #about .school_district_list dd:last-of-type {
	border-bottom: 0rem;
}



/*=========位置交通===============*/
#xo-content .page2.formatbox #about .location_map_grid {
	display: grid;
	grid-template-columns: minmax(0rem, 1fr);
	gap: 3rem;
	align-items: stretch;
}

#xo-content .page2.formatbox #about .location_map_card {
	box-sizing: border-box;
	padding: 0.75rem;
	background: #ffffff;
	border: 0.0625rem solid #b9ccd5;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.14);
}

#xo-content .page2.formatbox #about .location_map_card h4,
#xo-content .page2.formatbox #about .location_section_title {
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 120%;
	font-weight: 700;
	line-height: 1.55;
}

#xo-content .page2.formatbox #about .location_map_card h4 .fa-solid,
#xo-content .page2.formatbox #about .location_section_title .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page2.formatbox #about .location_iframe_box {
	position: relative;
	width: 100%;
	box-sizing: border-box;
	overflow: hidden;
	background: #edf4f7;
	border: 0.0625rem solid #d1dfe5;
	border-radius: 0.25rem;
}

#xo-content .page2.formatbox #about .location_iframe_box iframe {
	display: block;
	width: 100%;
	height: auto;
	min-height: 0rem;
	margin: 0rem;
	border: 0rem;
	aspect-ratio: 5 / 3;
}

#xo-content .page2.formatbox #about .location_map_link,
#xo-content .page2.formatbox #about .location_map_note {
	margin: 0.75rem 0rem 0rem 0rem;
	padding: 0rem;
	font-size: 92%;
	line-height: 1.7;
	text-align: center;
	text-indent: 0rem;
}

#xo-content .page2.formatbox #about .location_map_link a {
	display: inline-block;
	box-sizing: border-box;
	padding: 0.375rem 0.75rem;
	background: #edf7fb;
	border: 0.0625rem solid #8fc6dc;
	border-radius: 0.25rem;
	color: #075b84;
	font-weight: 700;
	text-decoration: none;
}

#xo-content .page2.formatbox #about .location_map_link a:hover,
#xo-content .page2.formatbox #about .location_map_link a:focus {
	background: #075b84;
	color: #ffffff;
	text-decoration: underline;
}

#xo-content .page2.formatbox #about .location_map_link .fa-solid,
#xo-content .page2.formatbox #about .location_map_note .fa-solid {
	margin-right: 0.375rem;
}

#xo-content .page2.formatbox #about .location_map_note {
	color: #59686f;
}

#xo-content .page2.formatbox #about .location_section_title {
	margin-bottom: 1.25rem;
}

#xo-content .page2.formatbox #about .location_information_grid {
	display: grid;
	grid-template-columns: minmax(0rem, 1fr);
	gap: 1.5rem;
	align-items: start;
}

#xo-content .page2.formatbox #about .location_information_card {
	box-sizing: border-box;
	min-width: 0rem;
	padding: 1rem;
	background: #f6fafb;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.125rem solid #c8dce5;
}

#xo-content .page2.formatbox #about .location_information_card h5 {
	box-sizing: border-box;
	margin: 0rem 0rem 0.875rem 0rem;
	padding: 0.5rem 0.75rem;
	background: #e8f5f2;
	border-left: 0.3125rem solid #2c9a83;
	color: #176878;
	font-size: 112%;
	font-weight: 700;
	line-height: 1.6;
}

#xo-content .page2.formatbox #about .location_information_card h5 .fa-solid {
	margin-right: 0.5rem;
	color: #d45aa9;
}

#xo-content .page2.formatbox #about .school_contact_card address {
	margin: 0rem;
	font-style: normal;
}

#xo-content .page2.formatbox #about .school_contact_list,
#xo-content .page2.formatbox #about .transport_group,
#xo-content .page2.formatbox #about .transport_sublist {
	margin-top: 0rem;
	margin-bottom: 0rem;
}

#xo-content .page2.formatbox #about .school_contact_list li,
#xo-content .page2.formatbox #about .transport_group > li {
	box-sizing: border-box;
	margin-bottom: 0.625rem !important;
	padding-bottom: 0.625rem !important;
	border-bottom: 0.0625rem solid #c8dce5;
}

#xo-content .page2.formatbox #about .transport_sublist {
	box-sizing: border-box;
	margin-top: 0.625rem;
	padding: 0.625rem 0.75rem;
	background: #ffffff;
	border-left: 0.25rem solid #8fc6dc;
}

#xo-content .page2.formatbox #about .transport_sublist li {
	margin-bottom: 0.5rem !important;
}

#xo-content .page2.formatbox #about .transport_sublist li:last-child,
#xo-content .page2.formatbox #about .transport_group > li:last-child,
#xo-content .page2.formatbox #about .school_contact_list li:last-child {
	margin-bottom: 0rem !important;
	border-bottom: 0rem;
}

#xo-content .page2.formatbox #about .location_information_card .labelbox {
	z-index: 1;
	background: transparent !important;
	color: #176878;
	font-weight: 700;
}



/*=========教職員行事曆===============*/
#xo-content .page15.formatbox #about iframe{
min-height: 50rem;
}

/*=========教職員行事曆===============*/
#xo-content .page14.formatbox #about iframe{
min-height: 50rem;
}

/*=========安全地圖：學區安全地圖===============*/
#xo-content .page3.formatbox #about .school_district_title {
	box-sizing: border-box;
	margin: 0rem 0rem 1.25rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
	text-align: center;
}

#xo-content .page3.formatbox #about .school_district_title .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page3.formatbox #about .safety_map_figure {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	margin: 0rem 0rem 1.5rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page3.formatbox #about .safety_map_figure a {
	display: block;
	overflow: hidden;
	border-radius: 0.25rem;
}

#xo-content .page3.formatbox #about .safety_map_figure img {
	display: block;
	width: 100%;
	height: auto !important;
	border-radius: 0.25rem;
	object-fit: contain;
	transform: scale(1, 1);
	transform-origin: center center;
}

#xo-content .page3.formatbox #about .safety_map_figure:hover img {
	animation: img_box 0.7s ease-in-out 1;
}

#xo-content .page3.formatbox #about .safety_map_figure figcaption {
	margin: 0rem;
	padding: 0.625rem 0.75rem 0.125rem 0.75rem;
	color: #46545a;
	font-size: 90%;
	line-height: 1.6;
	text-align: center;
}

#xo-content .page3.formatbox #about .safety_map_grid {
	display: grid;
	grid-template-columns: minmax(0rem, 0.9fr) minmax(0rem, 1.1fr);
	gap: 1.5rem;
	align-items: start;
}

#xo-content .page3.formatbox #about .safety_map_card {
	box-sizing: border-box;
	min-width: 0rem;
	padding: 1rem;
	background: #f6fafb;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.125rem solid #c8dce5;
}

#xo-content .page3.formatbox #about .safety_points_card {
	background: #fffbea;
	border-left-color: #d79524;
	border-bottom-color: #e3bf37;
}

#xo-content .page3.formatbox #about .safety_map_card > h5 {
	box-sizing: border-box;
	margin: 0rem 0rem 1rem 0rem;
	padding: 0.5rem 0.75rem;
	background: #e8f5f2;
	border-left: 0.3125rem solid #2c9a83;
	color: #176878;
	font-size: 112%;
	font-weight: 700;
	line-height: 1.6;
}

#xo-content .page3.formatbox #about .safety_points_card > h5 {
	background: #fff2bd;
	border-left-color: #d79524;
	color: #76500c;
}

#xo-content .page3.formatbox #about .safety_map_card > h5 .fa-solid {
	margin-right: 0.5rem;
	color: #d45aa9;
}

#xo-content .page3.formatbox #about .safety_orientation_list,
#xo-content .page3.formatbox #about .safety_points_list {
	margin: 0rem;
}

#xo-content .page3.formatbox #about .safety_orientation_list dt,
#xo-content .page3.formatbox #about .safety_points_list dt {
	box-sizing: border-box;
	margin: 0.75rem 0rem 0rem 0rem;
	padding: 0.4375rem 0.75rem;
	background: #edf7fb;
	border-left: 0.3125rem solid #2b95bf;
	color: #176878;
	font-size: 105%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page3.formatbox #about .safety_orientation_list dt:first-child,
#xo-content .page3.formatbox #about .safety_points_list dt:first-child {
	margin-top: 0rem;
}

#xo-content .page3.formatbox #about .safety_orientation_list dd,
#xo-content .page3.formatbox #about .safety_points_list dd {
	box-sizing: border-box;
	margin: 0rem;
	padding: 0.625rem 0.75rem 0.875rem 1rem;
	background: #ffffff;
	border-bottom: 0.0625rem solid #d7e3e8;
	line-height: 1.9;
}

#xo-content .page3.formatbox #about .safety_points_list dt {
	background: #fff2bd;
	border-left-color: #d79524;
	color: #76500c;
}

#xo-content .page3.formatbox #about .safety_points_list dt .fa-solid {
	margin-right: 0.5rem;
	color: #d45aa9;
}

#xo-content .page3.formatbox #about .safety_point_items {
	margin: 0rem;
	padding: 0rem;
}

#xo-content .page3.formatbox #about .safety_point_items li {
	box-sizing: border-box;
	margin: 0rem 0rem 0.375rem 0rem !important;
	padding-bottom: 0.375rem !important;
	border-bottom: 0.0625rem dotted #c8d3d8;
	line-height: 1.75;
}

#xo-content .page3.formatbox #about .safety_point_items li:last-child {
	margin-bottom: 0rem !important;
	border-bottom: 0rem;
}

#xo-content .page3.formatbox #about .safety_point_items .labelbox {
	z-index: 1;
	background: transparent !important;
	color: #176878;
	font-weight: 700;
}


/*=========校園安全地圖 conrent_02 樣式====================*/
#xo-content .page3.formatbox #about .campus_safety_title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	box-sizing: border-box;
	margin: 0rem 0rem 1.25rem 0rem;
	padding: 0.625rem 1rem;
	background: #9a5b18;
	border-left: 0.375rem solid #ffe17a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
	text-align: center;
}

#xo-content .page3.formatbox #about .campus_safety_title .fa-solid {
	color: #fff1a8;
}

#xo-content .page3.formatbox #about .campus_safety_notice {
	box-sizing: border-box;
	margin: 0rem 0rem 1.5rem 0rem;
	padding: 0.875rem 1rem;
	background: #fff7d6;
	border-left: 0.375rem solid #d79524;
	border-bottom: 0.0625rem solid #e3bf37;
	color: #5f430f;
	font-weight: 700;
	line-height: 1.8;
	text-indent: 0rem;
}

#xo-content .page3.formatbox #about .campus_safety_notice .fa-solid {
	margin-right: 0.625rem;
	color: #b3261e;
}

#xo-content .page3.formatbox #about .campus_hazard_items {
	box-sizing: border-box;
	margin: 0rem 0rem 0rem 1.25rem;
	padding: 0rem;
	list-style: disc;
}

#xo-content .page3.formatbox #about .campus_hazard_items li {
	box-sizing: border-box;
	margin: 0rem 0rem 0.5rem 0rem;
	padding: 0rem 0rem 0.5rem 0rem;
	border-bottom: 0.0625rem dotted #c8d3d8;
	line-height: 1.8;
	list-style: disc;
}

#xo-content .page3.formatbox #about .campus_hazard_items li:last-child {
	margin-bottom: 0rem;
	padding-bottom: 0rem;
	border-bottom: 0rem;
}

#xo-content .page3.formatbox #about .campus_hazard_items strong {
	color: #8a4a00;
	font-size: 100%;
}


/*============多元活動=================*/

#xo-content .page6.formatbox #about #img_box.img_box_l {
	width: 100%;
	margin: 0.625rem 0rem 1.5625rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page6.formatbox #about .multiple_activity_intro {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 2rem 0rem;
	padding: 1rem 1.125rem 1.25rem 1.125rem;
	background: #f3f9fc;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
}

#xo-content .page6.formatbox #about .multiple_activity_intro > h4 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1.125rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
}

#xo-content .page6.formatbox #about .multiple_activity_intro > h4 .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page6.formatbox #about .multiple_activity_list {
	position: relative;
	display: grid;
	grid-template-columns: repeat(1, minmax(0rem, 1fr));
	gap: 1rem;
	box-sizing: border-box;
	margin: 0rem;
	padding: 0rem;
	list-style: none;
	counter-reset: multiple_activity;
}

#xo-content .page6.formatbox #about .multiple_activity_item {
	position: relative;
	display: block;
	box-sizing: border-box;
	min-width: 0rem;
	margin: 0rem;
	padding: 1rem;
	background: #ffffff;
	border: 0.0625rem solid #c9dce4;
	border-top: 0.3125rem solid #278fbd;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.1);
	list-style: none !important;
	counter-increment: multiple_activity;
}

#xo-content .page6.formatbox #about .multiple_activity_item::before {
	content: counter(multiple_activity, decimal-leading-zero);
	position: absolute;
	top: 1.25rem;
	right: 0.875rem;
	color: #5e7179;
	font-size: 110%;
	font-weight: 700;
	line-height: 1;
}

#xo-content .page6.formatbox #about .multiple_activity_item.activity_civic {
	border-top-color: #d77c2c;
}

#xo-content .page6.formatbox #about .multiple_activity_item.activity_field {
	border-top-color: #7c5aa6;
}

#xo-content .page6.formatbox #about .multiple_activity_item h5 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0rem 2.25rem 0.5rem 0rem;
	border-bottom: 0.0625rem solid #d7e4e9;
	color: #075b84;
	font-size: 108%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page6.formatbox #about .multiple_activity_item h5 .fa-solid {
	margin-right: 0.4375rem;
	color: #d64f9a;
}

#xo-content .page6.formatbox #about .multiple_activity_item p {
	margin: 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 0rem;
}



/*=========創意教學===========*/
#xo-content .page7.formatbox #about #img_box.img_box_l {
	width: 100%;
	margin: 0.625rem 0rem 1.5625rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page7.formatbox #about .creative_teaching_intro {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 2rem 0rem;
	padding: 1rem 1.125rem 1.25rem 1.125rem;
	background: #f3f9fc;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
}

#xo-content .page7.formatbox #about .creative_teaching_intro > h4 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1.125rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
}

#xo-content .page7.formatbox #about .creative_teaching_intro > h4 .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page7.formatbox #about .creative_teaching_list {
	position: relative;
	display: grid;
	grid-template-columns: repeat(1, minmax(0rem, 1fr));
	gap: 1rem;
	box-sizing: border-box;
	margin: 0rem;
	padding: 0rem;
	list-style: none;
	counter-reset: creative_teaching;
}

#xo-content .page7.formatbox #about .creative_teaching_item {
	position: relative;
	display: block;
	box-sizing: border-box;
	min-width: 0rem;
	margin: 0rem;
	padding: 1rem;
	background: #ffffff;
	border: 0.0625rem solid #c9dce4;
	border-top: 0.3125rem solid #278fbd;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.1);
	list-style: none !important;
	counter-increment: creative_teaching;
}

#xo-content .page7.formatbox #about .creative_teaching_item::before {
	content: counter(creative_teaching, decimal-leading-zero);
	position: absolute;
	top: 1.25rem;
	right: 0.875rem;
	color: #5e7179;
	font-size: 110%;
	font-weight: 700;
	line-height: 1;
}

#xo-content .page7.formatbox #about .creative_teaching_item.creative_culture {
	border-top-color: #d77c2c;
}

#xo-content .page7.formatbox #about .creative_teaching_item.creative_digital {
	border-top-color: #7c5aa6;
}

#xo-content .page7.formatbox #about .creative_teaching_item h5 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0rem 2.25rem 0.5rem 0rem;
	border-bottom: 0.0625rem solid #d7e4e9;
	color: #075b84;
	font-size: 108%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page7.formatbox #about .creative_teaching_item h5 .fa-solid {
	margin-right: 0.4375rem;
	color: #d64f9a;
}

#xo-content .page7.formatbox #about .creative_teaching_item p {
	margin: 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 0rem;
}

/*=========豐富學習===========*/
#xo-content .page11.formatbox #about #img_box.img_box_l {
	width: 100%;
	margin: 0.625rem 0rem 1.5625rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page11.formatbox #about .rich_learning_intro {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 2rem 0rem;
	padding: 1rem 1.125rem 1.25rem 1.125rem;
	background: #f3f9fc;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
}

#xo-content .page11.formatbox #about .rich_learning_intro > h4 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1.125rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
}

#xo-content .page11.formatbox #about .rich_learning_intro > h4 .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page11.formatbox #about .rich_learning_list {
	position: relative;
	display: grid;
	grid-template-columns: repeat(1, minmax(0rem, 1fr));
	gap: 1rem;
	box-sizing: border-box;
	margin: 0rem;
	padding: 0rem;
	list-style: none;
	counter-reset: rich_learning;
}

#xo-content .page11.formatbox #about .rich_learning_item {
	position: relative;
	display: block;
	box-sizing: border-box;
	min-width: 0rem;
	margin: 0rem;
	padding: 1rem;
	background: #ffffff;
	border: 0.0625rem solid #c9dce4;
	border-top: 0.3125rem solid #278fbd;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.1);
	list-style: none !important;
	counter-increment: rich_learning;
}

#xo-content .page11.formatbox #about .rich_learning_item::before {
	content: counter(rich_learning, decimal-leading-zero);
	position: absolute;
	top: 1.25rem;
	right: 0.875rem;
	color: #5e7179;
	font-size: 110%;
	font-weight: 700;
	line-height: 1;
}

#xo-content .page11.formatbox #about .rich_learning_item.rich_language_contest {
	border-top-color: #d77c2c;
}

#xo-content .page11.formatbox #about .rich_learning_item.rich_learning_passport {
	border-top-color: #7c5aa6;
}

#xo-content .page11.formatbox #about .rich_learning_item h5 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0rem 2.25rem 0.5rem 0rem;
	border-bottom: 0.0625rem solid #d7e4e9;
	color: #075b84;
	font-size: 108%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page11.formatbox #about .rich_learning_item h5 .fa-solid {
	margin-right: 0.4375rem;
	color: #d64f9a;
}

#xo-content .page11.formatbox #about .rich_learning_item p {
	margin: 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 0rem;
}


/*=========適性發展===========*/
#xo-content .page10.formatbox #about #img_box.img_box_l {
	width: 100%;
	margin: 0.625rem 0rem 1.5625rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page10.formatbox #about .adaptive_development_intro {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 2rem 0rem;
	padding: 1rem 1.125rem 1.25rem 1.125rem;
	background: #f3f9fc;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
}

#xo-content .page10.formatbox #about .adaptive_development_intro > h4 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1.125rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
}

#xo-content .page10.formatbox #about .adaptive_development_intro > h4 .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page10.formatbox #about .adaptive_development_list {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0rem, 1fr));
	gap: 1rem;
	box-sizing: border-box;
	margin: 0rem;
	padding: 0rem;
	list-style: none;
	counter-reset: adaptive_development;
}

#xo-content .page10.formatbox #about .adaptive_development_item {
	position: relative;
	display: block;
	box-sizing: border-box;
	min-width: 0rem;
	margin: 0rem;
	padding: 1rem;
	background: #ffffff;
	border: 0.0625rem solid #c9dce4;
	border-top: 0.3125rem solid #278fbd;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.1);
	list-style: none !important;
	counter-increment: adaptive_development;
}

#xo-content .page10.formatbox #about .adaptive_development_item::before {
	content: counter(adaptive_development, decimal-leading-zero);
	position: absolute;
	top: 1.25rem;
	right: 0.875rem;
	color: #5e7179;
	font-size: 110%;
	font-weight: 700;
	line-height: 1;
}

#xo-content .page10.formatbox #about .adaptive_development_item.adaptive_family_partnership {
	border-top-color: #d77c2c;
}

#xo-content .page10.formatbox #about .adaptive_development_item h5 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0rem 2.25rem 0.5rem 0rem;
	border-bottom: 0.0625rem solid #d7e4e9;
	color: #075b84;
	font-size: 108%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page10.formatbox #about .adaptive_development_item h5 .fa-solid {
	margin-right: 0.4375rem;
	color: #d64f9a;
}

#xo-content .page10.formatbox #about .adaptive_development_item p {
	margin: 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 0rem;
}






/*=========雙語創新教學計畫介紹==============*/
#xo-content .page9.formatbox #about #img_box.img_box_l {
	width: 100%;
	margin: 0.625rem 0rem 1.5625rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page9.formatbox #about .bilingual_program_intro {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 2rem 0rem;
	padding: 1rem 1.125rem 1.25rem 1.125rem;
	background: #f3f9fc;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
}

#xo-content .page9.formatbox #about .history_section_title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	box-sizing: border-box;
	margin: 0rem 0rem 1.125rem 0rem;
	padding: 0.625rem 1rem;
	background: #177c68;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
	text-align: center;
}

#xo-content .page9.formatbox #about .history_section_title .fa-solid {
	color: #fff1a8;
}

#xo-content .page9.formatbox #about .bilingual_program_list {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0rem, 1fr));
	gap: 1rem;
	box-sizing: border-box;
	margin: 0rem;
	padding: 0rem;
	list-style: none;
	counter-reset: bilingual_program;
}

#xo-content .page9.formatbox #about .bilingual_program_item {
	position: relative;
	display: block;
	box-sizing: border-box;
	min-width: 0rem;
	margin: 0rem;
	padding: 1rem;
	background: #ffffff;
	border: 0.0625rem solid #c9dce4;
	border-top: 0.3125rem solid #278fbd;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.1);
	list-style: none !important;
	counter-increment: bilingual_program;
}

#xo-content .page9.formatbox #about .bilingual_program_item::before {
	content: counter(bilingual_program, decimal-leading-zero);
	position: absolute;
	top: 1.25rem;
	right: 0.875rem;
	color: #5e7179;
	font-size: 110%;
	font-weight: 700;
	line-height: 1;
}

#xo-content .page9.formatbox #about .bilingual_program_item.bilingual_program_reading {
	border-top-color: #d77c2c;
}

#xo-content .page9.formatbox #about .bilingual_program_item h5 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0rem 2.25rem 0.5rem 0rem;
	border-bottom: 0.0625rem solid #d7e4e9;
	color: #075b84;
	font-size: 108%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page9.formatbox #about .bilingual_program_item h5 .fa-solid {
	margin-right: 0.4375rem;
	color: #d64f9a;
}

#xo-content .page9.formatbox #about .bilingual_program_item p {
	margin: 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 0rem;
}

#xo-content .page9.formatbox #about .bilingual_program_item strong {
	color: #8a4a00;
	font-size: 105%;
}

/*=========雙語創新教學計畫前言=========*/
#xo-content .page9.formatbox #about .bilingual_program_overview {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1.5rem 0rem;
	padding: 1rem 1.375rem 1.125rem 1.375rem;
	background: #eef7fb;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.08);
}

#xo-content .page9.formatbox #about .bilingual_program_overview h4 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0rem 0rem 0.5rem 0rem;
	border-bottom: 0.0625rem solid #bfd8e3;
	color: #075b84;
	font-size: 115%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page9.formatbox #about .bilingual_program_overview h4 .fa-solid {
	margin-right: 0.625rem;
	color: #d64f9a;
}

#xo-content .page9.formatbox #about .bilingual_program_overview p {
	margin: 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 2em;
}


/*==========輕鬆營造家庭英語學習環境===========*/
#xo-content .page8.formatbox #about #img_box.img_box_l {
	width: 100%;
	margin: 0.625rem 0rem 1.5625rem 0rem;
	padding: 0.5rem;
	overflow: hidden;
	background: #ffffff;
	border: 0.0625rem solid #aebfc8;
	border-radius: 0.375rem;
	box-shadow: 0rem 0.25rem 0.875rem rgba(38, 66, 78, 0.16);
}

#xo-content .page8.formatbox #about .family_english_panel {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1.5rem 0rem;
	padding: 1rem 1.125rem 1.25rem 1.125rem;
	background: #eef7fb;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
}

#xo-content .page8.formatbox #about .family_english_panel > h4 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1rem 0rem;
	padding: 0.625rem 1rem;
	background: #145f7b;
	border-left: 0.375rem solid #ffcf4a;
	border-radius: 0.25rem;
	color: #ffffff;
	font-size: 125%;
	font-weight: 700;
	line-height: 1.55;
}

#xo-content .page8.formatbox #about .family_english_panel > h4 .fa-solid {
	margin-right: 0.625rem;
	color: #fff1a8;
}

#xo-content .page8.formatbox #about .family_input {
	background: #f1f8f3;
	border-left-color: #3c9566;
	border-bottom-color: #c9dfd0;
}

#xo-content .page8.formatbox #about .family_input > h4 {
	background: #236c46;
}

#xo-content .page8.formatbox #about .family_interaction {
	background: #fff8ed;
	border-left-color: #d77c2c;
	border-bottom-color: #ead3b8;
}

#xo-content .page8.formatbox #about .family_interaction > h4 {
	background: #9a4d0b;
}

#xo-content .page8.formatbox #about .family_english_list {
	position: relative;
	box-sizing: border-box;
	margin: 0rem;
	padding: 0rem;
}

#xo-content .page8.formatbox #about .family_english_list > dt {
	display: flex;
	align-items: flex-start;
	gap: 0.625rem;
	box-sizing: border-box;
	margin: 0rem;
	padding: 0.625rem 0.875rem;
	background: #e4f1f7;
	border-left: 0.25rem solid #278fbd;
	color: #075b84;
	font-size: 108%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page8.formatbox #about .family_input .family_english_list > dt {
	background: #e4f2e9;
	border-left-color: #3c9566;
	color: #185b38;
}

#xo-content .page8.formatbox #about .family_interaction .family_english_list > dt {
	background: #fff0da;
	border-left-color: #d77c2c;
	color: #874108;
}

#xo-content .page8.formatbox #about .family_english_list > dt .fa-solid {
	position: relative;
	top: 0.3125rem;
	flex: 0 0 auto;
	color: #d64f9a;
}

#xo-content .page8.formatbox #about .family_english_list > dd {
	box-sizing: border-box;
	margin: 0rem 0rem 0.875rem 0rem;
	padding: 0.75rem 1rem 1rem 2.75rem;
	background: #ffffff;
	border-bottom: 0.0625rem solid #d4e1e7;
	color: #333333;
	line-height: 2;
}

#xo-content .page8.formatbox #about .family_english_list > dd:last-child {
	margin-bottom: 0rem;
}

#xo-content .page8.formatbox #about .family_english_items {
	margin-top: 0rem;
}

#xo-content .page8.formatbox #about .family_english_reminder {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 0.875rem;
	box-sizing: border-box;
	margin: 0rem 0rem 2rem 0rem;
	padding: 1rem 1.25rem;
	background: #f7eff9;
	border-left: 0.375rem solid #8a3da2;
	border-bottom: 0.0625rem solid #d9bddf;
	color: #6b267f;
	font-size: 110%;
	font-weight: 700;
	line-height: 1.8;
}

#xo-content .page8.formatbox #about .family_english_reminder > .fa-solid {
	position: relative;
	top: 0.3125rem;
	flex: 0 0 auto;
	color: #a52ec9;
}

#xo-content .page8.formatbox #about .family_english_reminder p {
	margin: 0rem;
	color: #6b267f;
	line-height: 1.8;
	text-indent: 0rem;
}


/*=========學習環境說明前言=========*/
#xo-content .page8.formatbox #about .bilingual_program_overview {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 1.5rem 0rem;
	padding: 1rem 1.375rem 1.125rem 1.375rem;
	background: #eef7fb;
	border-left: 0.375rem solid #278fbd;
	border-bottom: 0.0625rem solid #c8dce5;
	box-shadow: 0rem 0.1875rem 0.625rem rgba(42, 68, 78, 0.08);
}

#xo-content .page8.formatbox #about .bilingual_program_overview h4 {
	position: relative;
	box-sizing: border-box;
	margin: 0rem 0rem 0.75rem 0rem;
	padding: 0rem 0rem 0.5rem 0rem;
	border-bottom: 0.0625rem solid #bfd8e3;
	color: #075b84;
	font-size: 115%;
	font-weight: 700;
	line-height: 1.7;
}

#xo-content .page8.formatbox #about .bilingual_program_overview h4 .fa-solid {
	margin-right: 0.625rem;
	color: #d64f9a;
}

#xo-content .page8.formatbox #about .bilingual_program_overview p {
	margin: 0rem;
	color: #333333;
	line-height: 2;
	text-indent: 2em;
}



/*============動畫=================*/
.animationtrue #about #conrent_01 {
	position: relative;
	animation-duration: 1.5s;
	animation-name: aboutcenter;
	opacity: 1;
}

.animationtrue #about .conrent_each {
	position: relative;
	animation-duration: 1.5s;
	opacity: 0;
}

@keyframes aboutcenter {
	from {
		top: 12.5rem;
		opacity: 0;
	}

	to {
		top: 0rem;
		opacity: 1;
	}
}