@charset "UTF-8";

/* CSS Document */
:root {
	--bs-cjcu-color: #7c152e;
	/*#9d0e35;*/
	--bs-cjcu-obvious-bg-color: hsla(0, 0%, 90%, 0.85);
	--bs-cjcu-obvious-border-color: hsla(239, 100%, 31%, 0.92);
	--bs-cjcu-obvious-border-width: 2px;
	--bs-cjcu-a-hover-padding-y: calc(var(--bs-gutter-y) *1);
	--bs-cjcu-a-hover-padding-x: calc(var(--bs-gutter-x) *1);
	/*medium thick thin*/
	--bs-cjcu-obvious-border-style: solid;
	/*double dotted dashed*/
	--bs-cjcu-obvious-border-radius: 5px;
	--bs-offcanvas-padding-x: 1rem;
	--bs-offcanvas-padding-y: 1rem;
	--bs-cjcu-tabs-bg-color: hsla(0, 0%, 90%, 0.85);
}

a {
	color: var(--bs-dark) !important;
	border-bottom: none;
	text-decoration: none !important;
	padding: calc(var(--bs-gutter-x) * .1);
	width: auto;
	display: inline-block;
}

a:hover {
	background-color: var(--bs-cjcu-obvious-bg-color);
	border: var(--bs-cjcu-obvious-border-color) var(--bs-cjcu-obvious-border-width) var(--bs-cjcu-obvious-border-style);
	border-radius: var(--bs-cjcu-obvious-border-radius);
	padding: calc(var(--bs-gutter-x) * .1 - var(--bs-cjcu-obvious-border-width));
}

.text-muted a {
	--bs-text-opacity: 1;
	color: var(--bs-gray-700) !important;
}

header {
	height: auto;
	position: relative;
	padding-top: 100px;
	z-index: 1050;
}

.header-wrap {
	padding-top: 100px;
	/*	height: 66px; /*86px*/
}

@media screen and (max-width: 991px) {
	header {
		padding-top: 68px;
	}

	.header-wrap {
		padding-top: 68px;
		/*	height: 66px; /*86px*/
	}
}

.logo {
	margin: 0px;
	float: left;
	/*height: 80px ;*/
	/* width: auto; */
	padding: 5px 5px;
	align-items: center;
	display: flex;
}

.logo img {
	height: 70px;
	/*60px*/
}

@media screen and (max-width: 1200px) {
	.logo img {
		height: 60px;
	}
}

@media screen and (max-width: 1100px) {
	.logo img {
		height: 50px;
	}
}

.logo-cjcu {
	position: static;
}

.logo-cjcu img {
	height: 40px;
}

.logo-cjcu h1 {
	margin: 0;
	padding: 0;
}

/*.logo-cjcu h1 a {
	background-image: url(https://www.cjcu.edu.tw/cjcu_logo/CJCU_logotype_w.png);
	background-position: left;
	background-repeat: no-repeat;

}*/

footer {
	height: auto;
	/*160px;  .push must be the same height as .footer */
	width: 100%;
	position: relative;
	bottom: 0px;
	margin-top: -0px !important;
	z-index: 1000;
}

ul,
li {
	list-style-type: none;
}

.top-line {
	border-top: 2px solid var(--bs-cjcu-color);
}

.bottom-line {
	border-bottom: 10px solid var(--bs-cjcu-color);
}

.cleaner {
	float: none;
	clear: both;
	height: 0;
}

.frontpage {
	/*background-image: url("/img_fg/0.jpg"); no gray */
	background-color: var(--bs-light);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	margin: 0;
	padding: 0;
	height: 100%;
	border: none;
}

.fg-content {
	/*padding-top: 80px;
	position: relative;*/
	width: 100%;
	height: 100vh;
	z-index: 98;
}

@media screen and (max-width: 576px) {
	.fg-content {}
}

.video-wrapper {
	position: relative;
	padding-bottom: 56.25%;
	overflow: hidden;
	border-radius: 8px;
	margin-left: 2px;
	margin-right: 2px;
}

.video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*----------------------------------------------------
 color format
----------------------------------------------------*/
.cjcu-red {
	color: var(--bs-cjcu-color) !important;
}

.fc-red {
	color: var(--bs-cjcu-color) !important;
}

.border-c-cjcu {
	border-color: var(--bs-cjcu-color) !important;
}

.bg-gray {
	background: var(--bs-gray-100) !important;
	/*hsla(210,17%,98%,0.90)!important;*/
}

/*----------------------------------------------------
date format
----------------------------------------------------*/

.post-date-2 {
	/*text-align: center;*/
	overflow: hidden;
	padding: 0 0;
	width: auto;
	background-color: rgba(0, 0, 0, 0);
	color: var(--bs-cjcu-color);
	/* 9d0e35 7777777 by gray */
}

.post-date-2 .day {
	font-size: 100%;
	letter-spacing: 1px;
	padding-left: 5px;
	padding-right: 5px;
}

.post-date-2 .month {
	margin-right: 12px;
	margin-bottom: 0;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	color: var(--bs-light);
	padding: 0;
	margin: 0;
	text-transform: uppercase;
	font-size: 100%;
	letter-spacing: 1px;
	/* background-color: var(--bs-cjcu-color); */
	/* border: solid 1px var(--bs-cjcu-color); */
	background-color: var(--bs-cjcu-color);
	/* 9d0e35 7777777 by gray */
	border: solid 1px var(--bs-cjcu-color);
	/* 9d0e35 7777777 by gray */
}

.post-date-3 {
	float: left;
	text-align: center;
	margin-right: .2rem;
	margin-bottom: 0;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	overflow: hidden;
	padding: 0 0;
	background-color: hsla(0, 0%, 100%, 0.00);
	color: var(--bs-cjcu-color);
	/* 9d0e35 7777777 by gray */
	border: solid 0px var(--bs-cjcu-color);
	/* 9d0e35 7777777 by gray */
}

.post-date-3 .day {
	font-size: 100%;
	/*font-weight: 800%;*/
	letter-spacing: 1px;
}

.post-date-3 .month {
	text-transform: uppercase;
	font-size: 100%;
	letter-spacing: 1px;
}

.post-date-3 .year {
	/*display: block;*/
	color: var(--bs-light);
	background-color: var(--bs-cjcu-color);
	/* 9d0e35 777777 by gray */
	padding: 0 3px;
	margin: 0 2px;
	border-radius: 10%;
}

.post-date-3 .bg-c {
	/*display: block;*/
	color: var(--bs-light);
	background-color: var(--bs-cjcu-color);
	/* 9d0e35 777777 by gray */
	padding: 0 3px;
	margin: 0 2px;
	border-radius: 10%;
}

/*----------------------------------------------------
block height
----------------------------------------------------*/
.height-focus {
	min-height: 10vh;
}


/*----------------------------------------------------
	image control
----------------------------------------------------*/
.bannerShow {
	max-height: 300px;
	/*280px*/
	vertical-align: middle;
	align-items: center;
	overflow: hidden;
}

.bannerShow img {
	max-width: 100%;
	height: auto;
}

.news-cover img {
	max-width: 100%;
	height: auto;
}

.img-100h {
	height: 100vh;
}

@media screen and (max-width: 768px) {
	.img-100h {
		height: 65vh;
	}
}

@media screen and (max-width: 550px) {
	.img-100h {
		height: 55vh;
	}
}

.img-fluid-wheel {
	/*position: fixed;*/
	margin-left: 49.5vw;
	transform: translate(-50%);
	bottom: 0;
	left: 0;
	min-width: 100%;
	min-height: 100%;
}

/*----------------------------------------------------
	Slider control
----------------------------------------------------*/
.slider-topic {
	position: absolute;
	bottom: 0%;
	left: 0%;
	width: 100%;
	margin: 0px;
	padding-top: 1%;
	padding-left: 2%;
	padding-right: 10%;
	padding-bottom: 1%;
	background-color: rgba(145, 145, 145, 0.72);
}

.slider-topic .topic {
	font-size: 1.5rem !important;
	line-height: 2rem;
	color: rgba(255, 255, 255, 1.00);
	text-shadow: black 0.1em 0.1em 0.2em;
}

.slider-topic .desc {
	font-size: .8rem !important;
	line-height: 1.5rem;
	color: rgba(255, 255, 255, 1.00);
	text-shadow: black 0.1em 0.1em 0.2em;
}

@media screen and (max-width: 768px) {
	.slider-topic {
		/*
    padding-top: 1%;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 1%;
    */
	}

	.slider-topic .topic {
		font-size: 1rem !important;
		line-height: 1.2rem;

	}

	.slider-topic .desc {
		font-size: .8rem !important;
		line-height: 1.0rem;
	}
}

@media screen and (max-width: 550px) {
	.slider-topic {
		/*
    padding-top: 1%;
    padding-left: 1%;
    padding-right: 1%;
    padding-bottom: 1%;
    */
	}

	.slider-topic .topic {
		font-size: .8rem !important;
		line-height: 1.0rem;
	}

	.slider-topic .desc {
		visibility: hidden;
		font-size: .6rem !important;
		line-height: .8rem;
	}
}

@media screen and (max-width: 400px) {
	.slider-topic {}

	.slider-topic .topic {
		font-size: .8rem !important;
		line-height: 1.0rem;
	}
}

@media screen and (min-width: 660px) and (max-height: 375px) {
	.slider-topic {
		/*
    padding-right: 1%;
		padding-left: 1%;
		padding-bottom: 1%;
    */
	}

	.slider-topic .topic {
		font-size: .8rem !important;
		line-height: 1.0rem;
	}
}



/*----------------------------------------------------
cjcu Logo css
----------------------------------------------------*/
.logo-idea {}

.logo-name {}

.logo-name:after {
	content: "|";
	color: var(--bs-cjcu-color);
	padding: 0 .5rem;
	padding-left: .8rem;
}

.logo-img {
	width: 100px;
}

ul.logo-memo {
	padding-left: 0rem;
}

.logo-memo li {
	display: block;
	position: relative;
	padding-left: .8rem;
}

.logo-memo li:before {
	content: "";
	position: absolute;
	top: 10px;
	left: 0;
	width: 3px;
	height: 3px;
	display: block;
	background-color: var(--bs-cjcu-color);
}

.topic {
	min-width: 60px;
	margin: 0;
	padding: .2rem;
	display: inline-block;

}

/*----------------------------------------------------
sdgs page icon control
----------------------------------------------------*/

.col-sdg {
	padding: 0rem;
}

.col-sdg>li {
	display: inline-block;
	padding: 0;
	width: 10%;
	line-height: 100%
}

.col-sdg img {
	padding: 0.1rem;
}

@media screen and (max-width: 768px) {
	.col-sdg>li {
		width: 15%;
	}
}

/*----------------------------------------------------
display control
----------------------------------------------------*/

.show-lg,
.show-md {
	display: none;
}

@media screen and (max-width: 990px) {
	.hidden-lg {
		display: none;
	}

	.show-lg {
		display: block;
	}
}

@media screen and (max-width: 768px) {
	.hidden-md {
		display: none;
	}

	.ebable-md,
	.show-md {
		display: block;
	}
}

@media screen and (max-width: 600px) {
	.hidden-sm {
		display: none;
	}
}

.low-profile {
	color: rgba(0, 0, 0, 0.00);
	font-size: .5rem;
}

/*----------------------------------------------------
board show 
----------------------------------------------------*/
@media screen and (min-width: 768px) {
	.border-start-md {
		border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-cjcu-color) !important;
	}
}

@media screen and (max-width: 768px) {
	.border-top-sm-rev {
		border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-cjcu-color) !important;
	}
}

/*----------------------------------------------------
list item
----------------------------------------------------*/

.list-item-3 li {
	width: 32%;
	position: relative;
	padding: .1rem .5rem;
	margin: .1rem .2rem;
	padding-left: 30px;
	float: left;
	display: block;
}

.list-item-2 li {
	width: 48%;
	position: relative;
	padding: .1rem .5rem;
	margin: .1rem .2rem;
	padding-left: 30px;
	float: left;
	display: block;
}

.list-item-2 li:before,
.list-item-3 li:before {
	content: "";
	position: absolute;
	display: block;
	left: 6px;
	top: 4px;
	width: 20px;
	height: 20px;
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='rgba(157,14,53,1.00)' class='bi bi-play-circle' viewBox='0 0 16 16'><path d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/><path d='M6.271 5.055a.5.5 0 0 1 .52.038l3.5 2.5a.5.5 0 0 1 0 .814l-3.5 2.5A.5.5 0 0 1 6 10.5v-5a.5.5 0 0 1 .271-.445z'/></svg>") no-repeat center/1rem auto;
}

.list-item-nodot-3 li,
.list-item-nodot-3c li,
.list-item-nodot-2 li,
.list-item-nodot li,
.list-item-n li {
	position: relative;
	padding: .1rem .5rem;
	margin: .1rem .2rem;
	float: left;
	display: block;
}

.list-item-nodot-2 li {
	width: 48%;
}

.list-item-nodot-3c li,
.list-item-nodot-3 li {
	width: 32%;
}

@media screen and (max-width: 768px) {

	.list-item-3 li,
	.list-item-nodot-3c li,
	.list-item-nodot-3 li {
		width: 48%;
	}
}

@media screen and (max-width: 620px) {

	.list-item-3 li,
	.list-item-nodot-3c li,
	.list-item-nodot-2 li {
		width: 98%;
	}
}

.accesskey-menu {
	visibility: visible;
	vertical-align: middle;
	display: inline-block;
	/*
  padding: 0;
  margin-top: auto;
  */
	margin-bottom: auto;
	width: auto;
	height: auto;
}

/*----------------------------------------------------
list item before icon
----------------------------------------------------*/
.dot-icon li:before {
	/*content: "";
	padding-left: 25px;
	color: rgba(157,14,53,1.00);
	*/
	content: "";
	position: absolute;
	display: block;
	left: 6px;
	top: 4px;
	width: 20px;
	height: 20px;
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='rgba(157,14,53,1.00)' class='bi bi-play-circle' viewBox='0 0 16 16'><path d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/><path d='M6.271 5.055a.5.5 0 0 1 .52.038l3.5 2.5a.5.5 0 0 1 0 .814l-3.5 2.5A.5.5 0 0 1 6 10.5v-5a.5.5 0 0 1 .271-.445z'/></svg>") no-repeat center/1rem auto;
}

.dot-icon a:hover {
	background-color: var(--bs-cjcu-obvious-bg-color);
	border: var(--bs-cjcu-obvious-border-color) var(--bs-cjcu-obvious-border-width) var(--bs-cjcu-obvious-border-style);
	border-radius: var(--bs-cjcu-obvious-border-radius);
	padding: calc(var(--bs-gutter-x) * .1 - var(--bs-cjcu-obvious-border-width));
}

/*----------------------------------------------------

----------------------------------------------------*/
.btn-outline-cjcu {
	--bs-btn-color: var(--bs-cjcu-color);
	--bs-btn-border-color: var(--bs-cjcu-color);
	--bs-btn-hover-color: var(--bs-light);
	--bs-btn-hover-bg: var(--bs-cjcu-color);
	--bs-btn-hover-border-color: var(--bs-cjcu-color);
	--bs-btn-focus-shadow-rgb: 13, 110, 253;
	--bs-btn-active-color: var(--bs-light);
	--bs-btn-active-bg: var(--bs-cjcu-color);
	--bs-btn-active-border-color: var(--bs-cjcu-color);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--bs-cjcu-color);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--bs-cjcu-color);
	--bs-gradient: none;
}

/* -------------------------------------------------------*/
/* page menu  	*/
.page-menu {
	width: 100%;
	height: auto;
}

.page-menu ul {
	padding-left: .5rem;
}

.page-menu .dropdown {
	position: relative;
	display: inline-block;
	width: 100%;
	height: auto;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.page-menu .dropdown a {
	font-size: 1.25rem;
	font-weight: 600;
	border-bottom: 3px solid hsl(345.44deg 71.03% 28.43%);
}

.page-menu .dropdown-menu {
	display: block;
	position: relative;
	top: 20px;
	left: 0px;
	min-width: 120px;
	width: 90%;
	background-color: hsla(0, 0%, 100%, 0.91);
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
	margin-bottom: 2rem;
}

.page-menu .dropdown-menu a {
	padding: calc(var(--bs-dropdown-item-padding-y)*.5)calc(var(--bs-dropdown-item-padding-x)*.5);
	text-decoration: none;
	display: block;
	font-size: 100% !important;
	font-weight: normal !important;
	border-bottom: 0px;
	line-height: normal;
}

.page-menu .dropdown-menu li {
	padding: .25rem;
	display: block;
	border-bottom: 1px solid hsla(0, 0%, 90%, 0.90);
	width: 95%;
	line-height: normal;
}

.page-menu .dropdown-item {
	padding: calc(var(--bs-dropdown-item-padding-y)*.5) calc(var(--bs-dropdown-item-padding-x)*.5);
	white-space: normal !important;
}

.page-menu .dropdown .dropbtn a {
	/*background-color: #9d0e35;*/

}

.page-menu .dropdown .dropbtn a:hover {
	font-weight: 600;
	border-radius: 5px;
	page-break-after: 0.2rem;
	color: var(--bs-dark);
	background-color: var(--bs-cjcu-obvious-bg-color);
	border: var(--bs-cjcu-obvious-border-color) var(--bs-cjcu-obvious-border-width) var(--bs-cjcu-obvious-border-style)
}

/* Change color of dropdown links on hover */
.page-menu .dropdown-menu a {
	padding: calc(var(--bs-gutter-x) * .1);
}

.page-menu .dropdown-menu a:hover {
	font-weight: 600;
	border-radius: 5px;
	page-break-after: 0.2rem;
	color: var(--bs-dark);
	background-color: var(--bs-cjcu-obvious-bg-color);
	border: var(--bs-cjcu-obvious-border-color) var(--bs-cjcu-obvious-border-width) var(--bs-cjcu-obvious-border-style);
	padding: calc(var(--bs-gutter-x) * .1 - var(--bs-cjcu-obvious-border-width));
}

/*----------------------------------------------------
文字大小
----------------------------------------------------*/

.fs-7 {
	font-size: .8rem;
}

.fs-cj-menu {}

@media screen and (max-width: 1040px) {
	.fs-cj-menu {
		font-size: 1.25em !important;
	}

}

@media screen and (max-width: 992px) {
	.fs-cj-menu {
		font-size: 1.15rem !important;
	}
}

@media screen and (max-width: 768px) {
	.fs-cj-menu {
		font-size: 1rem !important;
	}
}

@media screen and (max-width: 500px) {
	.fs-cj-menu {
		font-size: 1.25rem !important;
	}
}

/*----------------------------------------------------
padding 
----------------------------------------------------*/
.px-6 {
	padding-right: 3rem;
	padding-left: 3rem;
}

.px-7 {
	padding-right: 3.5rem;
	padding-left: 3.5rem;
}

.px-8 {
	padding-right: 4rem;
	padding-left: 4rem;
}

.px-9 {
	padding-right: 4.5rem;
	padding-left: 4.5rem;
}

.px-10 {
	padding-right: 5rem;
	padding-left: 5rem;
}

.px-11 {
	padding-right: 5.5rem;
	padding-left: 5.5rem;
}

.px-11 {
	padding-right: 6rem;
	padding-left: 6rem;
}


.py-6 {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.py-7 {
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
}

.py-8 {
	padding-top: 4rem;
	padding-bottom: 4rem;
}

.py-9 {
	padding-top: 4.5rem;
	padding-bottom: 4.5rem;
}

.py-10 {
	padding-top: 5rem;
	padding-bottom: 5rem;
}

.py-11 {
	padding-top: 5.5rem;
	padding-bottom: 5.5rem;
}

.py-12 {
	padding-top: 6rem;
	padding-bottom: 6rem;
}

.py-x {
	padding-top: 8rem;
	padding-bottom: 8rem;
}


/* Links inside the dropdown */


/* Show the dropdown menu on hover 
.page-menu .dropdown:hover .dropdown-menu {display: block;}*/

@media screen and (max-width: 768px) {
	.page-menu .dropdown .dropbtn {
		border-bottom: 0px;

	}

	.page-menu .dropdown .dropbtn a {
		/*background-color: #9d0e35;*/
		font-size: 1rem;
		font-weight: bold;
		border-bottom: 3px solid var(--bs-cjcu-color);
	}

	.page-menu .dropdown-menu {
		position: relative;
		top: 10px;
		left: 00px;
		width: 99%;
		background-color: rgba(255, 255, 255, 0.00);
		box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.00);
		border: 0;
	}

	.page-menu .dropdown-menu li {
		font-size: 100%;
		float: left;
		background: #eee;
		/*border: solid 2px #fff;
			padding: 2px 4px ;*/
		margin: 2px;
		min-height: 28px;
		width: auto !important;
	}

	.page-menu .dropdown-menu a {
		font-weight: normal !important;
		border-bottom: 0px !important;
	}
}

@media screen and (max-width: 991px) {
	.dropdown-item {
		white-space: normal;
		min-width: 200px;
	}

	.dropdown-item {
		white-space: normal;
		min-width: auto;
	}

	.page-menu .dropbtn {}
}

@media screen and (max-width: 800px) {
	.page-menu .dropbtn {}
}

/*----------------------------------------------------
	 .page-menu 強制變更
	----------------------------------------------------*/
.page-menu .nav-link {
	display: inline !important;
}

.page-menu .dropdown-toggle::after {
	display: none !important;
}

/*----------------------------------------------------
強制變更
----------------------------------------------------*/

.page-header {
	padding-top: 4rem;
}

/*----------------------------------------------------
freego control
----------------------------------------------------*/
.f-hidden {
	display: none;
}

/*----------------------------------------------------
強制變更
----------------------------------------------------*/
.offcanvas {
	--bs-offcanvas-width: 250px !important;
}

.offcanvas-header {
	/*background-color: rgba(255,255,255,0.85) !important;*/
	height: 60px;
}

.offcanvas.show,
.offcanvas.showing {
	background-color: rgba(255, 255, 255, 0.85) !important;
}

.nav-tabs {}

.nav-link {
	padding: calc(var(--bs-gutter-x) * .1) calc(var(--bs-gutter-x) * .2);
}

.nav-tabs .active {
	background-color: var(--bs-cjcu-tabs-bg-color) !important;
	border-radius: 0.375rem !important;
}

.nav-tabs .nav-link {
	border: 0;
	margin: 0 0.125rem;
}


.logo>a,
.nav-tabs .nav-link,
.nav-tabs .nav-item .nav-link {
	padding: calc(var(--bs-gutter-x) * .1) calc(var(--bs-gutter-x) * .2) !important;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item .nav-link:active {
	background-color: var(--bs-cjcu-tabs-bg-color) !important;
	color: var(--bs-dark) !important;
	border: var(--bs-cjcu-tabs-bg-color) var(--bs-cjcu-obvious-border-width) var(--bs-cjcu-obvious-border-style);
	padding: calc(var(--bs-gutter-x) * .1 - var(--bs-cjcu-obvious-border-width)) calc(var(--bs-gutter-x) * .2 - var(--bs-cjcu-obvious-border-width)) !important;
}

.logo>a:hover,
.nav-link:hover,
.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover>a,
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
	/*
	border-top: 1px solid rgba(66,66,66,0.92)!important;
	border-left: 1px solid rgba(66,66,66,0.92)!important;
	border-right: 1px solid rgba(66,66,66,0.92)!important;
	*/
	background-color: var(--bs-cjcu-tabs-bg-color) !important;
	color: var(--bs-dark) !important;
	border-radius: 0.375rem !important;
	/*var(--bs-cjcu-obvious-bg-color);*/
	border: var(--bs-cjcu-obvious-border-color) var(--bs-cjcu-obvious-border-width) var(--bs-cjcu-obvious-border-style);
	padding: calc(var(--bs-gutter-x) * .1 - var(--bs-cjcu-obvious-border-width)) calc(var(--bs-gutter-x) * .2 - var(--bs-cjcu-obvious-border-width)) !important;
}

.navbar a,
.navbar a:focus {
	color: var(--bs-dark) !important;
}

.navbar-nav .dropdown-menu {
	right: 0;
}

.carousel-control-next,
.carousel-control-prev {
	opacity: 1.0;
	display: block;
}



.carousel-control-next:focus,
.carousel-control-next:hover,
.carousel-control-prev:focus,
.carousel-control-prev:hover {
	/*text-decoration: block;
	outline: 0;*/
	border: thick;
	opacity: .9
}

/*.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#040404'><path d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/></svg>");
}
.carousel-control-prev-icon {
    background-image:  url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#040404'><path d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/></svg>");
}*/
.carousel-control-next-icon,
.carousel-control-prev-icon {
	width: 3.5rem !important;
	height: 3.5rem !important;
}

.carousel-control-next-icon:hover,
.carousel-control-prev-icon:hover {
	width: 5rem !important;
	height: 5rem !important;
	/*background-color: var(--bs-cjcu-color);*/
	/*opacity: .6*/
}



.carousel-item>a {
	padding: 0px;
	border: var(--bs-light) var(--bs-cjcu-obvious-border-width) var(--bs-cjcu-obvious-border-style);
}

.carousel-item>a:hover {
	padding: 0px;
	border: var(--bs-cjcu-obvious-border-color) var(--bs-cjcu-obvious-border-width) var(--bs-cjcu-obvious-border-style);
}


.carousel-indicators {
	margin-bottom: 0% !important;
	margin-left: auto;
	margin-right: 0%;
	line-height: .8rem;
	width: fit-content;
	/* background-color: rgba(138,138,138,0.68); */
	justify-content: flex-end;
}

.carousel-indicators [data-bs-target] {
	height: 10px;
	width: 10px;
	margin: 15px;
	border: 0px;
	border-radius: 50%;
	color: #282828;
}

@media screen and (max-width: 1024px) {
	.carousel-inner {}

	.carousel-indicators [data-bs-target] {
		height: 6px;
		width: 6px;
		margin: 10px;
	}
}

@media screen and (max-width: 768px) {
	.carousel-inner {}

	.carousel-indicators [data-bs-target] {
		height: 4px;
		width: 4px;
		margin: 8px;
	}
}

/*----------------------------------------------------
 CJCU 30
----------------------------------------------------*/
.cjcu30_read li {
	border: 1px solid hsla(0, 0%, 100%, 0.00);
	background-color: #eee;
	margin: .1rem;
	padding: .1rem;
	/*min-width: 10%;*/
	min-height: 1rem;
	line-height: auto;
	font-size: 1rem;
	float: left;
	align-items: center;
	justify-content: center;
	align-content: center;
	flex-wrap: nowrap;
	flex-direction: row;
	display: inline-block;
	border-radius: 4px;

}

/*----------------------------------------------------
Hero
----------------------------------------------------*/
.vh-45 {
	height: 45vh;
}

.hero-height {
	height: 350px;
}

/*----------------------------------------------------
 youtube play
----------------------------------------------------*/
.video-wrapper:focus {
	outline-style: solid !important;
	outline-width: medium !important;
}

.ytp-large-play-button {
	visibility: hidden !important;
}

/*----------------------------------------------------
錨點偏移
----------------------------------------------------*/
.content_target {
	position: relative;
	top: -100px;
	/* 偏移爲nav被fixed元素的高度 */
	display: block;
	height: 0;
	/*高度爲0 */
	overflow: hidden;
}

@media screen and (min-width: 1920px) {
	.container-fluid {
		max-width: 1920px;
	}
}

/*------------------------------------------------------------
content fade-in
------------------------------------------------------------*/
@keyframes fadeInUp {
	from {
		transform: translateY(200px);
		opacity: 0;
	}

	to {
		transform: translateY(0);
		opacity: 1;
	}
}

.fade-in-up {
	animation: 1.8s both fadeInUp;
}

/*------------------------------------------------------------
content z-index
------------------------------------------------------------*/
.z-index-1000 {
	z-index: 1000;
}

.z-index-900 {
	z-index: 900;
}


/*------------------------------------------------------------
 強制修改 CSS值
------------------------------------------------------------*/
.gsc-input {
	font-size: 1rem !important;
}

.obvious h3:hover,
.obvious a:hover {
	border-radius: 5px;
	background-color: hsla(0, 0%, 83%, 0.92);
}

.obvious img:hover {
	border-radius: 5px;
	border: thick dotted hsla(0, 0%, 83%, 0.92);
}