@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@400;600&display=swap');
@import url("reset.css?v=3");

html, body{
	padding:0;
	margin: 0;
	width: 100%;
	height: 100%;
	/* font-family: Arial, "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "標楷體", sans-serif;	 */
	font-size: 1.1rem!important;
	line-height: 1.6!important;
}

span {
  font-size: 1.2rem !important;
  line-height: 1.6!important;
}


body{
	display: grid;
	grid-template-rows: auto auto 1fr auto;
	min-height: 100vh;
	margin: 0;
	position: relative;
}

body.fixheight{
	display: grid;
	  grid-template-rows: auto auto 1fr auto; /* 自动大小的头部、撑满内容的主体、自动大小的页脚 */
	  min-height: 100vh; /* 保证内容高度不足时，也撑开整个页面高度 */
	  margin: 0;
}

.mainWrapper{
	/* min-height: 100%; */
	 *display: table; /* For IE7 Hack */
	 *height: 100%; /* For IE7 Hack */
	 padding-bottom:30px;
}


.f-html{
	background: transparent!important;
}

#mainBannerIndicators .carousel-control-prev{
	justify-content: flex-start;
	left:-60px;
}


#mainBannerIndicators .carousel-control-next{
	justify-content: flex-end;
	right:-60px;
}


h4{
	font-size: 1.2rem;
}

p{
	line-height: 1.4;
	color:#736357;
	margin-bottom:.5rem;
}

p.priceTxt{
	font-size: 1.4rem;
	color:#a93124;
}

ul>li,
ol>li{
	line-height: 1.6;
}

#loading{
	width: 100%;
	height: 100%;
	background: #fcf7f1;
	z-index: 999999;
	position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

#loading img{
	width: 8%;
	height: auto;
	position: absolute;
	top:0;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
}

table.cust-table{
	border: 1px solid #c79c6e;;
}

table.cust-table tr th,
table.cust-table tr td{
	line-height: 1.3;
}

table.cust-table thead tr{
	background: #c79c6e;
	color:#ffffff;
}

table.cust-table tr:nth-child(even) {background: #f2f2f2}


h3.cust-h3{
	font-size: 1.6rem; 
	color:#926137;
	line-height: 1.4;
}

.w-10{
  width: 10%;
}

.w-20{
  width: 20%;
}

.w-70{
  width: 70%;
}

.w-80{
  width: 80%;
}



.yh-h3-1{
	font-size:1.5rem;
	line-height: 1.6;
}

.cust-bg-white {
	/* background: linear-gradient(to top, #d9b776 0%, #ead8b4 5%, #f0e5cf 10%, #f4ece2 100%) !important; */
	background: #ffffff;
}

.jumbotron{
	padding: 2rem 2rem;
}

.img-w100{
  width:100%;
  height: auto;
}

.btn-link:focus {
	outline: none;
	box-shadow: none; /* 如果有阴影效果，可以同时移除 */
}

.for_pc_block{
  display: block!important;
}

.for_pc_flex{
  display: flex!important;
}

.for_m_block{
  display: none!important;
}

.for_m_flex{
  display: none!important;
}

.border-0{
	border: none!important;
}

.btn-main{
	background: #C69C6D!important;
	color:#fff;
	border:0;
}

.msgbox{
	line-height: 1.6;
}

ol>li{
	line-height: 1.5;
	color:#736357;
}

ul>li{
	line-height: 1.5;
	list-style: disc;
	color:#736357;
}

.news-detail-body ul>li{
	list-style: none;
}

ul.mainMenu>li{
	list-style: none;	
}

ul.mainMenu li .dropdown-menu{
	color: #212529;
	text-align: left;
	list-style: none;
	background-color: #c79c6e;
	background-clip: padding-box;
	border: 1px solid rgba(0, 0, 0, .15);
	border-radius: 0;
}

ul.mainMenu li .dropdown-menu .dropdown-item{
	color: #f7ede0;
	text-align: inherit;
	white-space: nowrap;
	border: 0;
}

ul.mainMenu li .dropdown-menu .dropdown-item:hover{
	background-color: #c79c6e;
	color:#ffffff;
}

ul.cust-ul>li{
	list-style: square;
	font-size: 1.2rem;
	line-height: 1.6;
}

ul.courseIntro>li{
	list-style: square;
	padding-bottom:1.2rem;
}


ul.courseIntro li h4{
	color:#333;
}

ul.courseIntro li p{
	margin-bottom:.25rem;
}


/* ======================================== 選單 ===================================== */

.navbar-brand img{
	width:auto;
	height:140px;
}

.bgColorBar{
	width:100%;
	height:50px;
	position: absolute;
	background: #F7EDE0;
	z-index: -1;
}

.loginBtnGrp{
	position: absolute;
	right:20px;
	top:20px;
	display: flex;
}

.loginBtnGrp a:link,
.loginBtnGrp a:visited,
.loginBtnGrp a:active{
	width:auto;
	display: flex;
	font-size: .8rem!important;
	padding:.25rem .5rem;
	background: #333;
	color:#fff;
	border-radius: 10px;
	text-decoration: none;
}

.loginBtnGrp a:hover{
	opacity: .8;
}

.navbar-nav .nav-item a.nav-link{
	color:#333;
	padding-right:.8rem;
	padding-left:.8rem;
}

/* ======================================== 首頁 ===================================== */
	.carousel-inner {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}

.carousel-control-prev-icon, .carousel-control-next-icon {
	height: 40px;
	width: 40px;
	outline: black;
	background-size: 100%, 100%;
	border-radius: 20%;
	/* border: 1px solid black; */
	background-image: none;
}

.carousel-control-prev-icon:after {
	content: '〈';
	font-size: 2rem;
	font-weight: bolder;
	color: #333;
}

.carousel-control-next-icon:after {
	content: '〉';
	font-size: 2rem;
	font-weight: bolder;
	color: #333;
}

h1{
	width:100%;
	color: #374D58;
	font-size: 2.5rem;
	line-height: 1.6;
}

h2{
	font-size: 1.3rem;
	line-height: 1.6;
}

.rule h2,
.rule h4{
	text-align: left;
}

.rule ol li{
	text-align: left;
}

.serve-desc {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding:0 1rem;
	align-items: flex-start;
}


.serve-desc h3{
	font-size: 1.3rem;
}

.serve-desc h2 span{
  display: inline-block;
}

.tutor-desc {
	display: flex;
	flex-direction: column;
	padding:0 1rem;
	align-items: flex-start;
}

.tutor-desc h3{
	font-size: 1.3rem;
	color:#8b633e!important;
}


h3.prdTitle{
	font-size: 1.5rem;
	line-height: 1.6;
}

.img-box{
	margin-bottom:1.5rem;
	  display: flex;
	  justify-content: center;	
}

.img-circle{
	width:160px;
	height:160px;
	border-radius: 50%;
	background: #f5ede1;
	flex-shrink: 0; 
	display: flex;
	justify-content: center;
	align-items: center;
}

.img-circle.real-tutor{
	border:1px solid #a28662;
}

.img-circle img{
	width:85%;
	height:auto;
}

.img-circle.real-tutor img{
	width:100%;
	height:auto;
}

.blockquote{
	height: auto;
	overflow: hidden;
	transition:all .5s ease-in-out;
	-webkit-transition:all .5s ease-in-out;
	-moz-transition:all .5s ease-in-out;
}

.blockquote:after,
.blockquote:before{
	position: absolute;
	font-size: 3rem;
	color:#dac8b3;
	font-weight: bolder;
}

.blockquote:after{
	content:"「";
	top: 100px;
	left: -52px;
	font-weight: bold;
}

.blockquote:before{
	content:"」";
	font-weight: bold;
	bottom:10px;
	right:-52px;
}

.blockquote h2{
	font-size: 1.5rem;
	color: #713b1f;
}

.blockquote p{
	margin-bottom:1rem;
	font-size: 1.2rem;
	line-height: 1.6;
}

h1.card-title{
	font-size: 2rem;
	line-height: 1.8;
	color:#926137;
}

h4.sub-title{
	font-size: 1.5rem;
	line-height: 1.3;
	color:#4d4d4d;
}

h5.card-title{
	font-size: 2rem;
	line-height: 1.8;
	color:#926137;
}


#aboutusMore{
	width: 40px;
	margin: 0 auto;
	background: #bf9e73;
	color:#fff;
	border-radius: 6px;
	font-size: 1.1rem;
	display: flex;
	padding: .5rem;
	justify-content: center;
}

#aboutusMore:hover{
	cursor:pointer;
}

#aboutusMore img{
	width:90%;
	height:auto;
}

.card-img{
	position: relative;
	display: flex;
	overflow: hidden;
}

.card-img .itemDes{
	position: absolute;
	bottom:0;
	width:100%;
	height:auto;
	background: rgba(0,0,0,.7);
	padding: .8rem;
}

.card-img .itemDes p{
	color:#fff;
	margin-bottom:0;
}

.jumbotron.inpage{
	background: #f5ede1!important;
}


.custom-accordion{
	padding: 1.25rem;
	padding-top:0; 
}

.accordion.custom-accordion>.card>.card-header{
	padding:.75rem!important;
	background-color:#f4ede2;
}

.accordion.custom-accordion>.card>.card-header>.btn-link{
	color:#f4ede2!important;
	text-decoration: none;
}

.accordion.custom-accordion>.card>.card-header .btn-link:after{
	content:'▶';
	font-size: .6rem;
	display: block;
	position: absolute;
	top:5px;
	right:5px;
	color:#bf9e73;
}

.accordion.custom-accordion>.card>.card-header .btn-link.collapsed{
	color:#8b633e!important;
	text-decoration: none;
}

.accordion.custom-accordion>.card.expanded>.card-header{
	background-color:#bf9e73;
	
}

.accordion.custom-accordion>.card.expanded>.card-header .btn-link{
	color:#ffffff!important;
	text-decoration: none;
}

.accordion.custom-accordion>.card.expanded>.card-header .btn-link:after{
	content:'▼';
	font-size: .6rem;
	display: block;
	position: absolute;
	top:5px;
	right:5px;
	color:#f4ede2;
}

/* .accordion.custom-accordion>.card>.card-header .btn-link[aria-expanded="true"]{
	
} */

.outlineBox{
	border:1px solid #926137;
	border-radius: 10px;
	padding: 1.2rem;
}

.lineBtn{
	background: #06C755;
	display: flex;
	width: fit-content;
}

.lineBtn:hover{
	color:#fff;
}

.lineBtn img{
	height:32px;
}

.lineBtn p{
	margin:0;
	color:#fff;
	margin:0 .5rem;
}

.row.globalelt-step .card-body{
	background: #fff9f2;
}

.row.globalelt-step .card-body h5.card-title{
	font-size: 1.3rem;
	/* background: #926137;
	border-radius: 20px; */
	width: fit-content;
	padding-right:1.35rem;
	color:#926137;
	border-bottom:3px solid #926137;
	font-family: Arial, "儷黑", "LiHei", "微軟正黑體", "Microsoft JhengHei", "標楷體", sans-serif;
}

/* .row.globalelt-step .col:after{
	content: '<i class="fa fa-arrow-right d-none d-md-block" aria-hidden="true"></i>';
	width:32px;
	display: inline-flex;
} */

span.btn-orange{
	background: #ed5223;
	color:#fff;
	padding:.2rem .8rem;
	border-radius: 20px;
	font-family: Arial, "儷黑", "LiHei", "微軟正黑體", "Microsoft JhengHei", "標楷體", sans-serif;

}

span.btn-ching{
	background: #62cbe2;
	color:#fff;
	padding:.2rem .8rem;
	border-radius: 20px;
	font-family: Arial, "儷黑", "LiHei", "微軟正黑體", "Microsoft JhengHei", "標楷體", sans-serif;

}

span.btn-blue{
	background: #3449fb;
	color:#fff;
	padding:.2rem .8rem;
	border-radius: 20px;
	font-family: Arial, "儷黑", "LiHei", "微軟正黑體", "Microsoft JhengHei", "標楷體", sans-serif;

}

.copyIcon{
	width: 22px;
	height: 22px;
	display: block;
	background: url(../images/copy_icon.svg) #926137;
	background-size: 60%;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 50%;
	margin-left:.5rem;
}

#copyToken:hover{
	cursor: pointer;
}

#copyToken:hover h4{
	text-decoration: underline;
}

h4#theToken{
	color:#926137;
}

.copyNoteWap{
	width:100vw;
	min-height:100vh;
	display:none;
	/* background: red; */
	flex-direction: row;
	flex-wrap: wrap;
	position: fixed;
	left: 0;
	top:0;
	right: 0;
	bottom: 0;
	justify-content: center;
	align-items: center;
}

.copyNoteWap .copyNote{
	width: fit-content;
	height: min-content;
	padding:.15rem .35rem;
	line-height: 1.4;
	background: rgba(0,0,0,.5);
	border-radius: 5px;
	font-size: 10pt;
	text-align: center;
	color: #fff;
	font-weight: 300;
}

/* footer */
.footerCnt{
	position: relative;
	background: #F7EDE0;
	padding:1.5rem;
}

.footBtnGrp{
	width: 100%;
	display: flex;
	flex-direction: column;
}

.footBtnGrp a{
	text-decoration: none;
	margin-bottom:1.5rem;
}

a .btnDes{
	display: flex;
	align-items: center;
}

a .btnDes img{
	width:32px;
}

/* a .btnDes .btnDesTxt{
	
} */

a .btnDes .btnDesTxt p{
	font-size: 1.3rem;
	color:#926137;
	margin-bottom:0;
	margin-left:1.2rem;
	font-weight: 400;
}

.footBtnGrp a p.contactTxt{
	font-size: 1.1rem;
	color:#4d4d4d;
}

.prdinfoModal p b.txt-sub{
	color:#000;
	font-size: 1.1rem;
}

.prdinfoModal h2.modal-title{
	font-size: 1.8rem;
}

.card.disOrder .card-header{
	background: #d9d9d9;
}

.card.disOrder .card-body{
	background: #ebebeb;
}