@charset "utf-8";
@import url("reset.css");
@import url("loading.css");
@import url(jquery-ui.css);
@import url(jquery-ui.theme.css);
@import url("bootstrap.css");
@import url('https://fonts.googleapis.com/css?family=Marcellus+SC');
@import url(fontawesome5.2/css/all.min.css);
@import url(icon/css/ionicons.css);
@import url("../../plugins/sweetalert/sweetalert2.min.css");
@import url("../../plugins/pagination-master/css/style.css");
/*@import url("/style/front/js/fancyBox/source/jquery.fancybox.css?v=2.1.7");*/


/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Main <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

html { position: relative; min-height: calc(100% - 0px); }
body {    /* Margin bottom by footer height */
margin-bottom: 100px; }
body { -webkit-text-size-adjust: none; font-size: 12px; overflow-y: scroll; }
body, td, th { font-family: Verdana, Geneva, sans-serif; }
img { max-width: 100%; height: auto; }
#hiddle { display: none; }
.iframe_ch { display: none; }
.license-box input { display: none; }
select::-ms-expand { display: none; }
select { }

/*div, a, section, article, span, img, h1, h2, h3, h4, h5, h6 { -webkit-user-select: none; -moz-user-select: none; }*/
#rand-img { cursor: pointer; }
#event_left, #event_right { width: 120px; height: 250px; }
.event_left_link a { padding: 5px 0; display: block; font-size: 14px; color: #888; font-family: 'Noto Sans TC', '微軟正黑體'; }
.nodata { font-size: 14px; line-height: 1.8; color: #666; }
.label { display: inline-block; padding: .25em .4em; font-size: 75%; font-weight: 400; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: 0.25rem; }
.label-danger { background-color: #ff5d48; }
.center { text-align: center; }
.card_num_block .card_num_label { display: block; font: normal 14px '微軟正黑體'; letter-spacing: 1px; line-height: 25px; cursor: default; }
.card_num { padding: 3px 5px; font: normal 14px '微軟正黑體'; letter-spacing: 1px; color: #555; width: 55px; }
.card_info { font-size: 13px; line-height: 1.4; }
.file input { width: 100%; min-width: 14rem; margin: 0; filter: alpha(opacity=0); opacity: 1; top: 0; right: 0; left: 0; z-index: 5; padding: .0rem 1rem; line-height: 1.5; color: #555; user-select: none; background-color: #fff; border: 1px solid #ccc; border-radius: 0rem; }
.ifile { position: absolute; opacity: 0; filter: alpha(opacity=0); padding: 0; }
.upfile { margin: -5px 0 0; }
.newfilebtn { border: none; padding: 3px 12px; color: #fff; background: #64b0f2; border-radius: 0px; }
.swal2-container button, .swal2-modal .swal2-title, .swal2-modal .swal2-content { font-family: 'Century Gothic', '微軟正黑體'; font-size: 20px; }
.swal2-footer, .swal2-footer a{ font-family: 'Century Gothic', '微軟正黑體'; font-size: 20px; }

.hide { display: none }
.breadcrumb { padding: 0.75rem 1rem 15px 0; margin-bottom: 0; list-style: none; background: none; border-radius: 0.25rem; }
.breadcrumb>li { float: left; font: normal 13px 'Century Gothic', '微軟正黑體'; }
.breadcrumb>li a { color: #666; }
.breadcrumb>li a:hover { opacity: 0.8; }
.breadcrumb>li+li::before { color: #666; }
.breadcrumb>.active { color: #666; }
.imgSweetalertModalWidth{width: 60%; min-width: 300px;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> public <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.btnCustom { font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; padding: 0 5px; line-height: 26px; position: relative; }
.btnCustom:hover, .btnCustom:focus, .btnCustom.active {}
.btnCustom:disabled {}
.btnCustom.btnOrg { position: relative; top: -2px; background: #ff9900; color: #fff; transition: all 0.6s; }
.btnCustom.btnOrg:hover, .btnCustom.btnOrg:focus, .btnCustom.btnOrg.active {opacity: 0.8;}
.btnCustom.btnOrg:disabled {opacity: 0.8;}
.btnCustom-outline { border-radius: 0; border: solid 1px #003c4f; color: #003c4f; background: none; font: normal 16px 'Marcellus SC', '微軟正黑體'; letter-spacing: 1px; height: 30px; padding: 0; line-height: 30px; }
.btnCustom-outline:hover, .btnCustom-outline:focus, .btnCustom-outline.active { color: #fff; background: #003c4f; }
.btnCustom-outline:disabled, .btnCustom-outline.disabled { background-color: #003c4f; color: #fff; }
.btnCustom-outline.btnWhite { border-radius: 0; border: solid 1px #fff; color: #fff; }
.btnCustom-outline.btnWhite:hover, .btnCustom-outline.btnWhite:focus { color: #002254; background: #fff; }
.btnCustom-outline.btnGray { border-radius: 0; border: solid 1px #999; color: #777; }
.btnCustom-outline.btnGray:hover, .btnCustom-outline.btnGray:focus { color: #fff; background: #999; }
.btnCustom-outline.btnOrange { border-radius: 0; border: solid 1px #e5a300; color: #e5a300; }
.btnCustom-outline.btnOrange:hover, .btnCustom-outline.btnOrange.active, .btnCustom-outline.btnOrange:focus { color: #fff; background: #e5a300; }
.btnCustom-outline.googleBtn, .btnCustom-outline.googleBtn:focus { border-radius: 0; border: solid 1px #dd4e41; color: #dd4e41; background: none; }
.btnCustom-outline.googleBtn:hover, .btnCustom-outline.googleBtn.active { color: #fff; background: #dd4e41; }
.btnCustom-outline.facebookBtn, .btnCustom-outline.facebookBtn:focus { border-radius: 0; border: solid 1px #3b5998; color: #3b5998; background: none; }
.btnCustom-outline.facebookBtn:hover, .btnCustom-outline.facebookBtn.active { color: #fff; background: #3b5998; }
.btnCustom-outline.lineBtn, .btnCustom-outline.lineBtn:focus { border-radius: 0; border: solid 1px #02b801; color: #02b801; background: none; }
.btnCustom-outline.lineBtn:hover, .btnCustom-outline.lineBtn.active { color: #fff; background: #02b801; }
.btnCustom-outline.btnBorderRadius-5px { border-radius: 5px; }
.tableRwdContent { display: none }
.tableCustomStyle { color: #555; font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; }
.tableCustomStyle thead tr th { border-top: none; color: #fff; font: normal 15px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; background: #6caccd; }
.tableCustomStyle tbody tr td { border-top: none; font: normal 16px 'Century Gothic', '微軟正黑體'; color: #000; background: rgba(255, 255, 255, 0.6); vertical-align: middle;}
.tableCustomStyle tbody tr:nth-child(2n+2) td { background: rgba(226, 245, 254, 0.5); }
.tableCustomStyle tbody tr:last-child td { border-top: none; border-bottom: double 3px #6caccd; }
.tableCustomStyle a { text-decoration: none; color: #49abd1; }
.tableCustomStyle a:hover { opacity: 0.6; }
.tableCustomStyle.table td.verticalAlignMmiddle{vertical-align: middle;}
.pageCustomStyle { }
.pageCustomStyle.pagination { border-radius: 0; }
.pageCustomStyle .page-item:first-child .page-link { border-radius: 0; }
.pageCustomStyle .page-item:last-child .page-link { border-radius: 0; }
.pageCustomStyle .page-item.active .page-link { background-color: #fff; color: #216b9c; border: none; font-weight: bolder; }
.pageCustomStyle .page-item.active:hover .page-link { background-color: #e9ecef; }
.pageCustomStyle .page-link { padding: 0.5rem 0.75rem; margin-left: -1px; line-height: 1.25; color: #216b9c; background-color: #fff; font: normal 14px 'Century Gothic', '微軟正黑體'; border: none; }
.pageCustomStyle .page-link:focus, .pageCustomStyle .page-link:hover { color: #216b9c; text-decoration: none; font-weight: bolder; background-color: #e9ecef; border-color: #ddd; }
.mr-10px { margin-right: 10px; }
.table-hover tbody tr { transition: background 0.3s; }
.table-hover tbody tr:hover { background-color: rgba(0, 100, 200, 0.075); }
.formCustomStyle { font: normal 15px 'Century Gothic', '微軟正黑體'; }
.formCustomStyle .col-form-label { font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #333; padding-top: 0px; padding-bottom: 0px; line-height: 30px; }
.formCustomStyle .form-group input.form-control, .formCustomStyle .form-group select.form-control { height: 30px; padding: 2px 5px; line-height: 20px; border-radius: 0px; font: normal 14px 'Century Gothic', '微軟正黑體'; border: none; background: #eee; }
.formCustomStyle .form-group input.form-control-plaintext{padding-left: 5px; font: normal 14px 'Century Gothic', '微軟正黑體';}
.formCustomStyle .form-group input.form-control:focus, .formCustomStyle .form-group select.form-control:focus, .formCustomStyle .form-group textarea.form-control:focus, .formCustomStyle .form-group input.form-control-plaintext:focus { box-shadow: none; outline: none }
.formCustomStyle .form-group input.form-control-plaintext { font: normal 14px 'Century Gothic', '微軟正黑體'; }
.formCustomStyle .form-group textarea.form-control { font: normal 14px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; line-height: 24px; border-radius: 0px; border:none; background: #eee; }
.formCustomStyle.formCustomStyle-borderBottom .form-group input.form-control, .formCustomStyle.formCustomStyle-borderBottom .form-group select.form-control { height: 30px; padding: 3px 5px; line-height: 24px; border-radius: 0px; font: normal 14px 'Century Gothic', '微軟正黑體'; border: none; border-bottom: solid 1px #777; }
.formCustomStyle .parsley-errors-list { color: #ff9e34 }
.formCustomStyle ul.parsley-errors-list { margin-bottom: 0px; }
.formCustomStyle .fileuploader-input .fileuploader-input-button, .formCustomStyle .fileuploader-popup .fileuploader-popup-content .fileuploader-popup-button.button-success { background-color: linear-gradient(135deg, #92b50f 0, #546b00 100%); }
.formCustomStyle .fileuploader-input .fileuploader-input-caption { color: #92b50f; }
.formCustomStyle.whiteForm .col-form-label { color: #fff; }
.formCustomStyle.whiteForm .form-group input.form-control, .formCustomStyle.whiteForm .form-group select.form-control { border: solid 1px #fff; background: rgba(255, 255, 255, 0.2); color: #fff; }
.formCustomStyle.whiteForm .form-group select.form-control { background: #6f6f6f; }
.formCustomStyle.whiteForm .form-group select.form-control option { background: #777; border: #fff }
.formCustomStyle.whiteForm .form-group textarea.form-control { border: solid 1px #fff; background: rgba(255, 255, 255, 0.2); color: #fff; }
.formCustomStyle.whiteForm{}

.cursor-pointer { cursor: pointer; }
.cursor-not-allowed { cursor: not-allowed;}
.infoContainer { font: normal 14px 'Century Gothic', '微軟正黑體'; line-height: 46px; letter-spacing: 1px; color: #777; margin: 0 0 20px; }
.infoContainer .form-group { margin: 8px 0; }
.articleContainer { font: normal 14px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #777; }
.tableHeaderHide { display: none }
.lineHeight25 { line-height: 25px; }
.lineHeight30 { line-height: 30px; }
.lineHeight35 { line-height: 35px; }
.lineHeight40 { line-height: 40px; }
.contentContainer { font: normal 16px 'Century Gothic', '微軟正黑體'; line-height: 35px; letter-spacing: 1px; color: #000; }
.mainContainer { padding: 50px 0; }
.maxWidth-100px { max-width: 100px; }
.width-80px{width: 80px;}
.title{
	font: normal 30px 'Marcellus SC', '微軟正黑體';
	color: #003c4f;
	letter-spacing: 1px;
}
.contentContainer { font: normal 16px 'Century Gothic', '微軟正黑體'; line-height: 25px; letter-spacing: 1px; color: #333; }
a:hover{
	text-decoration: none;
}

.aboutContainer .container,
.privacyContainer .container,
.newsContainer .container,
.newsContainer .container,
.activityDetailContainer .container,
.linkContainer .container,
.applyInformationFillFormContainer .container,
.applyInfoCheckContainer .container,
.memberLoginContainer .container,
.memberInfoContainer .container,
.memberOrder .container,
.orderDetail .container,
.orderDetail .container,
.orderDetail .container,
.contactContainer .container
{
	padding-left: 30px;
	padding-right: 30px;
}



/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> include_header.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.header { height: 150px; box-shadow: 0px 1px 5px 1px rgba(0, 0, 0, 0.5); position: relative; z-index: 8 }
.headerTopBg { height: 60px; width: 100%; background: #024e69; }
.headerContentContainer { position: absolute; top: 0; width: 100%; }
.headerTopContainer { height: 60px; }
.headerTopMenu { display: flex; justify-content: flex-end; position: relative; top: 50%; transform: translateY(-50%); z-index: 20; }
.headerTopMenuSearchContainer { width: 180px; margin-right: 20px; position: relative; }
.headerTopMenuSearchContainer input.form-control { background: none; border: solid 1.2px #fff; border-radius: 15px; font: normal 15px 'Century Gothic', '微軟正黑體'; color: #c0edff; letter-spacing: 1px; }
.headerTopMenuSearchIcon { display: inline-block; position: absolute; top: 3px; right: 10px; color: #fff; }
.headerTopMenuSearchIcon a { color: #fff; font-size: 14px; }
.headerTopMenuFBcontainer { margin-right: 18px; font: normal 18px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #fff; }
.headerTopMenuFBcontainer a { color: #fff; transition: all 0.6s; }
.headerTopMenuMember { font: normal 18px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #fff; }
.headerTopMenuMember a { color: #fff; transition: all 0.6s; }
.headerTopMenuMemberSubContainer{
	padding: 5px 10px;
	border-radius: 5px;
	position: absolute;
	width: 150px;
	top: 42px;
	background: rgba(188, 236, 255, 0.95);
	z-index: 20;
	text-align: center;
}
.headerTopMenuMemberSubContainer>div{
	padding: 5px 5px;
	border-bottom: 1px solid #fff;
}
.headerTopMenuMemberSubContainer>div:last-child{
	border-bottom: none;
}
.headerTopMenuMemberSubContainer a{
	 font: normal 16px 'Century Gothic', '微軟正黑體';
	 letter-spacing: 1px;
	 color: #555;
}
.headerTopMenuMemberSubContainer a:hover{
	opacity: 0.8;
}
.headerTopMenuFBcontainer a:hover, .headerTopMenuMember a:hover { opacity: 0.6; }
.headerNavContainer { height: 90px; position: relative; z-index: 10; }
.headerNav { position: relative; top: 50%; transform: translateY(-50%); }
.headerNav a { display: block; font: bold 20px 'Marcellus SC', '微軟正黑體'; position: relative; letter-spacing: 1px; color: #024e69; transition: all 0.6s; }
.headerNavEn { display: block; font-size: 22px; font-weight: normal; color: #3ea6ce; }
.headerNav a:hover { opacity: 0.6; }
.headerLogoContainer { position: absolute; top: 0; width: 100%; z-index: 10; }
.headerLogo { width: 100%; height: 150px; text-align: center; background: #fff; /*box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, 0.3)*/; }
.headerLogo img { width: 95%; position: relative;top: 50%; transform: translateY(-50%); }
.headerIndexLogo { background: #fff; text-align: center; border-bottom-right-radius: 136px; border-bottom-left-radius: 136px; box-shadow: 5px 3px 15px 1px rgba(0, 0, 0, 0.5); position: relative; left: -50px; }
.headerIndexLogo img { width: 90%; margin-top: 10px; margin-bottom: 30px; }

/* --------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> index.php <<<-------------------------------------------------------------*/
/* ---------------------------------------------------------------------------------------------------------------*/


/*---ABOUT---*/
/*
.indexAboutContainer { margin-top: 50px; padding-bottom: 120px; }
.indexAboutContainer .container { position: relative; }
.indexAboutContentContainer { width: 60%; padding: 20px; font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; line-height: 30px; color: #fff; background: #003c4f; }
.indexAboutContentDec { border: solid 1px #88b4ca; }
.indexAboutTitle { margin: 20px 0 15px; text-align: center; color: #fff; }
.indexAboutContent { width: 85%; margin: 0 auto 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 10; }
.indexAboutContent p { margin-bottom: 0; }
.indexAboutBtn { width: 250px; margin: 20px auto; font-weight: bold; }
.indexAboutImg { width: 500px; position: absolute; bottom: -50px; right: 0; box-shadow: -2px 2px 10px 0px rgba(0, 0, 0, 0.4); }
*/
.indexAboutNewsContainer { margin-top: 70px; padding-bottom: 120px; position: relative; max-width: 1140px; margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px;}
.indexAboutContentContainer { width: 500px; padding: 20px; font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; line-height: 30px; color: #fff; background: #003c4f; }
.indexAboutContentDec { border: solid 1px #88b4ca; }
.indexAboutTitle { margin: 20px 0 15px; text-align: center; color: #fff; }
.indexAboutContent { width: 85%; margin: 0 auto 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 10; }
.indexAboutContent p { margin-bottom: 0; }
.indexAboutBtn { width: 250px; margin: 20px auto; font-weight: bold; }
.indexAboutImg { width: 500px; position: absolute; bottom: -50px; right: 0; box-shadow: -2px 2px 10px 0px rgba(0, 0, 0, 0.4); }

/*---NEWS---*/
/*
.indexNewsContainer { background: url(../../images/front/index_news_bg.png); background-attachment: fixed; padding: 40px 0 50px; }
.indexNewsTitle { margin-bottom: 30px; }
.indexNewsBoxContainer { }
.indexNewsBox { position: relative; }
.indexNewsBox:hover .indexNewsContentContainer::after { width: 100%; background: rgba(141, 201, 222, 0.6); }
.indexNewsDateContainer { width: 60px; height: 60px; background: #003c4f; color: #fff; font: normal 14px 'Century Gothic', '微軟正黑體'; position: absolute; top: -10px; left: -10px; transition: all 0.6s; z-index: 20 }
.indexNewsDateYear { position: absolute; top: 22px; left: 15px; transform: rotate(-45deg); }
.indexNewsDateYear::after { content: ''; width: 12px; height: 1px; background: #fff; position: absolute; top: 8px; margin-left: 5px; }
.indexNewsDateYear::before { content: ''; width: 12px; height: 1px; background: #fff; position: absolute; margin-right: 5px; top: 7px; left: -16px; }
.indexNewsDateMonth { font-size: 22px; position: absolute; top: 0px; left: 3px; }
.indexNewsDateDay { font-size: 22px; position: absolute; bottom: 0px; right: 3px; }
.indexNewsContentContainer { width: 100%; border: solid 1px #003c4f; padding: 10px 20px 15px; position: relative; z-index: 5; }
.indexNewsContentContainer::after { content: ''; width: 0; height: 100%; position: absolute; top: 0; left: 0; background: rgba(141, 201, 222, 0); z-index: -1; transition: all 1s; }
.indexNewsBoxTitle { width: calc(100% - 205px); margin: 10px 0px 15px 55px; font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.indexNewsBoxTitle a { color: #003c4f; transition: all 0.6s; }
.indexNewsBoxTitle a:hover { opacity: 0.6; }
.indexNewsType { width: 150px; padding: 3px; background: #003c4f; font: normal 18px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; text-align: center; color: #fff; position: absolute; right: 0px; top: 20px; }
.indexNewsContent { font: normal 16px 'Century Gothic', '微軟正黑體'; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: #076291; }
.indexNewsContent a { color: #076291; transition: all 0.6s; }
.indexNewsContent a:hover { opacity: 0.6; }
*/
.indexNewsContainer { background: url(../../images/front/index_news_bg.png); background-attachment: fixed; padding: 20px 0 30px; width: 650px; position: absolute;top: 80px; right: 0; box-shadow: -2px 2px 10px 0px rgba(0, 0, 0, 0.4); }
.indexNewsTitle { margin-bottom: 30px; }
.indexNewsBoxContainer { }
.indexNewsBox { position: relative; }
.indexNewsBox:hover .indexNewsContentContainer::after { width: 100%; background: rgba(141, 201, 222, 0.6); }
.indexNewsDateContainer { width: 60px; height: 60px; background: #003c4f; color: #fff; font: normal 14px 'Century Gothic', '微軟正黑體'; position: absolute; top: -10px; left: -10px; transition: all 0.6s; z-index: 20 }
.indexNewsDateYear { position: absolute; top: 22px; left: 15px; transform: rotate(-45deg); }
.indexNewsDateYear::after { content: ''; width: 12px; height: 1px; background: #fff; position: absolute; top: 8px; margin-left: 5px; }
.indexNewsDateYear::before { content: ''; width: 12px; height: 1px; background: #fff; position: absolute; margin-right: 5px; top: 7px; left: -16px; }
.indexNewsDateMonth { font-size: 22px; position: absolute; top: 0px; left: 3px; }
.indexNewsDateDay { font-size: 22px; position: absolute; bottom: 0px; right: 3px; }
.indexNewsContentContainer { width: 100%; border: solid 1px #003c4f; padding: 10px 20px 15px; position: relative; z-index: 5; }
.indexNewsContentContainer::after { content: ''; width: 0; height: 100%; position: absolute; top: 0; left: 0; background: rgba(141, 201, 222, 0); z-index: -1; transition: all 1s; }
.indexNewsBoxTitle { width: calc(100% - 205px); margin: 10px 0px 15px 55px; font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.indexNewsBoxTitle a { color: #003c4f; transition: all 0.6s; }
.indexNewsBoxTitle a:hover { opacity: 0.6; }
.indexNewsType { width: 150px; padding: 3px; background: #003c4f; font: normal 18px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; text-align: center; color: #fff; position: absolute; right: 0px; top: 20px; }
.indexNewsContent { font: normal 16px 'Century Gothic', '微軟正黑體'; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: #076291; }
.indexNewsContent a { color: #076291; transition: all 0.6s; }
.indexNewsContent a:hover { opacity: 0.6; }

/*---ACTIVITY---*/
.indexActivityContainer { padding: 40px 0 60px; }
.indexActivityTitle { margin-bottom: 30px; }
.indexActivityBoxContainer { }
.indexActivityBox { border: solid 1px #024e69; padding: 10px 10px 30px; position: relative; }
.indexActivityBoxImg { margin-bottom: 10px; overflow: hidden; }
.indexActivityBoxImg img{transition:  all 0.6s}
.indexActivityBox:hover .indexActivityBoxImg img{ transform: scale(1.14); }
.indexActivityBoxTitle { font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; }
.indexActivityBoxTitle a { color: #024e69; transition:  all 0.6s}
.indexActivityBoxTitle a:hover { opacity: 0.6; }
.indexActivityBoxType, .indexActivityBoxDate, .indexActivityBoxNum { font: normal 15px 'Century Gothic', '微軟正黑體'; letter-spacing: 0px; color: #555; line-height: 28px; }
.indexActivityBoxNumNow { font-weight: bold; }
.indexActivityBoxSubTitle { display: inline-block; width: 20px; color: #076291; }
.indexActivityBoxStatus { width: 120px; font: bold 18px 'Century Gothic', '微軟正黑體'; line-height: 28px; text-align: center; color: #fff; position: absolute; right: -12px; bottom: 10px; }
.indexActivityBoxStatusApply{ background: #076291; }
.indexActivityBoxStatusFull { background: #faaf05; }
.indexActivityBoxStatusCutoff { background: #d84141; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> about.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.aboutContainer { }
.aboutTitle { }
.aboutNav { margin-top: 30px;}
.aboutNavBox { border: solid 1px #3ea6ce; font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; text-align: center; line-height: 32px; background: #fff; color: #3ea6ce; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all 0.6s; }
.aboutNavBox a { color: #3ea6ce; display: block; }
.aboutNavBox.active, .aboutNavBox:hover { background: #3ea6ce; color: #fff }
.aboutNavBox.active a, .aboutNavBox:hover a{color: #fff;}
.aboutNavBox.active a { }
.aboutContentContainer { margin-top: 10px; position: relative; height: auto; display: block; }
.aboutContentBox { width: 100%; font: normal 16px 'Century Gothic', '微軟正黑體'; line-height: 25px; letter-spacing: 1px; color: #333; }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> news.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.newsTypeContainer { margin-top: 30px; }
.newsTypeContainer .formCustomStyle .form-group input.form-control { border: solid 1px #aaa; background: none; border-radius: 5px; }
.newsTypeIcon{position: absolute; right: 12px; top: 6px;}
.newsTypeIcon a{
	color: #777
}
.newsTypeIcon a:hover{
	opacity: 0.8
}
.newsTypeContainer .formCustomStyle .form-group select.form-control { border: solid 1px #aaa; background: none; border-radius: 5px; }
.newsContainer .indexNewsBox:hover .indexNewsContentContainer::after { background: rgba(208, 242, 254, 0.6); }
.newsContainer .indexNewsContentContainer::after { background: rgba(208, 242, 254, 0); }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> news_detail.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.newsDetailTitle { font: bold 25px 'Century Gothic', '微軟正黑體'; color: #003c4f; margin-bottom: 5px; }
.newsDetailType { margin-bottom: 8px; width: 220px; padding: 3px 0 3px 5px; background: linear-gradient(to right, rgba(0, 60, 79, 1), rgba(0, 60, 79, 0)); font: normal 15px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #fff; }
.newsDetailDate { font: normal 13px 'Century Gothic', '微軟正黑體'; color: #555; margin-bottom: 15px; }
.newsDetailContent { font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; line-height: 25px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> activity_detail.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.activityDetailContainer { }
.activityDetailBanner { }
.activityDetailBreadcrumb { position: relative; top: -30px; padding: 3px 15px 3px 10px; background: rgba(255, 255, 255, 0.6); display: inline-block; }
.activityDetailBreadcrumb .breadcrumb { padding: 0; border-radius: 0; }
.activityDetailBreadcrumb .breadcrumb>li { float: left; font: bold 14px 'Century Gothic', '微軟正黑體'; }
.activityDetailBreadcrumb .breadcrumb>li a { color: #333; }
.activityDetailBreadcrumb .breadcrumb>li a:hover { opacity: 0.8; }
.activityDetailBreadcrumb .breadcrumb>li+li::before { color: #333; }
.activityDetailBreadcrumb .breadcrumb>.active { color: #333; }
.activityDetailContentContainer { }
.activityDetailContntLeftContainer { }
.activityDetailContentLeftTop { padding: 0 10px; }
.activityDetailTitle { margin-top: -10px; margin-bottom: 10px; font: bold 30px 'Century Gothic', '微軟正黑體'; color: #024e69; letter-spacing: 1px; }
.activityDetailType { min-width: 120px; margin-bottom: 15px; padding: 3px 15px; background: #024e69; font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #fff; text-align: center; display: inline-block; }
.activityDetailInfomation { padding-left: 5px; font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; }
.activityDetailInfomation>ul>li { padding: 3px 0; }
.activityDetailInfomationIcon { width: 20px; color: #076291; display: inline-block; }
.activityDetailInfomationTitle { display: inline-block; width: 80px; }
.activityDetailInfomationContent { display: inline-block; }
.activityDetailInfomationContent a { color: #078ca1; }
.activityDetailInfomationContent a:hover { opacity: 0.6; }
.activityDetailContentLeftBottom { }
.activityDetailDetailContentTitle { font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 2px; color: #024e69; text-align: center; border-bottom: solid 1px #cccccc; }
.activityDetailDetailContent { padding: 20px 10px 0; font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; line-height: 26px; color: #444444; }
.activityDetailContentRightContainer { position: sticky; top: 10px; }
.activityDetailSideImg { }
.activityDetailSideContentContainer { padding: 10px 10px 10px; background: #eeeeee; position: relative; }
.activityDetailSideTitle { margin-bottom: 5px; font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #024e69; }
.activityDetailSideDate { margin-bottom: 5px; font: normal 17px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; }
.activityDetailSidePriceOri { font: normal 15px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; text-decoration: line-through; }
.activityDetailSidePrice { margin-bottom: 5px; font: normal 30px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #3ea6ce; }
.activityDetailSidePrice.earlyBird { color: #e01065; }
.activityDetailSidePrice.memberPrice { color: #faaf05; }
.activityDetailSideBtn { }
.activityDetailSideBtn .btnCustom { padding: 3px 0; border-radius: 10px; font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 5px; background: #024e69; color: #fff; transition: all 0.4s; }
.activityDetailSideBtn .btnCustom:hover { opacity: 0.6; }
.activityDetailSideStatus { width: 100px; height: 24px; text-align: center; background: #3ea6ce; font: bold 15px 'Century Gothic', '微軟正黑體'; line-height: 24px; color: #fff; letter-spacing: 3px; position: absolute; bottom: 57px; right: -8px; }
.activityDetailSideStatus.earlyBird { background: #e01065; }
.activityDetailSideStatus.memberPrice { background: #faaf05; }
.activityDetailMapContainer { margin: 20px 0 20px; }
.activityDetailMapTitle { padding: 5px 10px 5px 15px; font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 5px; color: #fff; background: #024e69; display: inline-block; }
.activityDetailMap { border: solid 5px #024e69; }
.activityDetailMap iframe { width: 100%; height: 400px; display: block; }
.activityDetailBtnContainer { }
.activityDetailApplyRwdContainer { position: fixed; width: 100%; bottom: 50px; display: flex; height: 50px; background: #eee; }
.activityDetailApplyRwdPriceContainer { width: 50%; }
.activityDetailApplyRwdStatus { width: 100%; height: 20px; text-align: center; background: #3ea6ce; font: bold 13px 'Century Gothic', '微軟正黑體'; line-height: 20px; color: #fff; letter-spacing: 3px; }
.activityDetailApplyRwdStatus.earlyBird { background: #e01065; }
.activityDetailApplyRwdStatus.memberPrice { background: #faaf05; }
.activityDetailApplyRwdPrice { font: normal 25px 'Century Gothic', '微軟正黑體'; text-align: center; color: #3ea6ce; }
.activityDetailApplyRwdPrice.earlyBird { color: #e01065; }
.activityDetailApplyRwdPrice.memberPrice { color: #faaf05; }
.activityDetailApplyRwdBtnContainer { width: 50%; font: bold 20px 'Century Gothic', '微軟正黑體'; text-align: center; line-height: 50px; background: #024e69; color: #fff; }
.activityDetailApplyRwdBtnContainer a { color: #fff; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> apply_information_fill.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
.applyInfoFillContainer { }
.applyBreadcrumbContainer { padding-top: 25px; }
.applyBreadcrumbBox { font: bold 20px 'Century Gothic', '微軟正黑體'; line-height: 45px; text-align: center; background: #ddd; color: #555; position: relative; }
.applyBreadcrumbBox.active { background: #024e69; color: #89ddf7; }
.applyBreadcrumbFill { }
.applyBreadcrumbCheck { }
.applyBreadcrumbFinish { }
.arrow { }
.arrow::after { content: ''; display: block; position: absolute; top: 0; right: -18px; width: 0; height: 0; border-style: solid; border-width: 22.5px 0 22.5px 18px; border-color: transparent transparent transparent #ddd; }
.arrowBack { }
.arrowBack::before { content: ''; display: block; position: absolute; top: 0; left: -18px; width: 0; height: 0; border-style: solid; border-width: 0 18px 22.5px 0; border-color: transparent #ddd transparent transparent; }
.arrowBack::after { content: ''; display: block; position: absolute; bottom: 0px; left: -18px; width: 0; height: 0; border-style: solid; border-width: 0 0 22.5px 18px; border-color: transparent transparent #ddd transparent; }
.applyBreadcrumbBox.active .arrow::after { border-color: transparent transparent transparent #024e69; }
.applyBreadcrumbBox.active .arrowBack::before { border-color: transparent #024e69 transparent transparent; }
.applyBreadcrumbBox.active .arrowBack::after { border-color: transparent transparent #024e69 transparent; }

.applyTopInformationContainer { margin-top: 20px; background: #eee; position: relative; }
.applyTopImg { }
.applyTopContent { position: relative; top: 50%; transform: translateY(-50%); }
.applyTopTitle { width: 100%; font: bold 20px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #024e69; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 5px; }
.applyTopDate { font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #555; }
.applyTopPrice { text-align: right; font: normal 40px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; padding-right: 20px; color: #3ea6ce; vertical-align: middle; }
.applyTopPrice.oriPrice { color: #777 }
.applyTopPrice.earlyBird { color: #e01065; }
.applyTopPrice.memberPrice { color: #faaf05; }
.applyTopStatus { width: 100px; height: 24px; text-align: center; background: #3ea6ce; font: bold 15px 'Century Gothic', '微軟正黑體'; line-height: 24px; color: #fff; letter-spacing: 3px; position: absolute; top: 12px; right: -8px; }
.applyTopStatus.oriPrice { background: #777 }
.applyTopStatus.earlyBird { background: #e01065; }
.applyTopStatus.memberPrice { background: #faaf05; }

.applyInformationFillFormContainer { margin-top: 40px; }
.applyInfoFormRadio~label { border: none; border-radius: 0px; padding: 4px 0; width: 100%; font: normal 16px 'Century Gothic', '微軟正黑體'; background: #eee; }
.applyInfoFormRadio~label:hover { border: none; background: #024e69; color: #fff; }
.applyInfoFormRadio~label.ui-state-active, .applyInfoFormRadio~label.ui-state-active:hover { border: none; background: #024e69; color: #fff; }
.applyInformationFillFormContainer .formCustomStyle small { padding-top: 5px; display: block; font: bold 14px 'Century Gothic', '微軟正黑體'; }
.applyInfoFillFormParticipantTitle { margin: 15px -10px 0; border-bottom: solid 1px #cccccc; font: bold 20px 'Century Gothic', '微軟正黑體'; line-height: 30px; letter-spacing: 2px; text-align: center; color: #024e69; }
.applyInfoFillFormParticipantBoxContainer { }
.applyInfoFillFormParticipantBox { margin: 20px 0 10px; border-bottom: dashed 1px #ccc; padding-bottom: 20px; }
.applyInfoFillFormParticipantBoxContainer .applyInfoFillFormParticipantBox:last-child { border-bottom: none }
.applyInfoFillFormParticipantSubTitle { font: bold 15px 'Century Gothic', '微軟正黑體'; color: #999; }
.genderRadio { display: none; }
.genderRadio~label { border: none; border-radius: 0px; padding: 4px 0; width: 100%; font: normal 16px 'Century Gothic', '微軟正黑體'; text-align: center; background: #eee; cursor: pointer; }
.genderRadio~label.active, .genderRadio~label:hover { background: #024e69; color: #fff; }
.applyInformationFillFormTotalPriceContainer { margin-top: 20px; width: 100%; padding: 5px 15px; text-align: right; background: #eee; letter-spacing: 1px; }
.applyInformationFillFormTotalPriceTitle { display: inline-block; margin-right: 5px; font: bold 20px 'Century Gothic', '微軟正黑體'; color: #777; }
.applyInformationFillFormTotalPrice { font-size: 30px; color: #e01065; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> contact.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.applyInfoCheckContainer { }
.applyInformationCheckFormContainer { margin-top: 40px; }
.applyInformationCheckFormContainer .applyInfoFillFormParticipantTitle { margin: 15px 0px 0; }
.applyInfoCheckParticipantInfoBoxContainer { }
.applyInfoCheckParticipantInfoBox { margin: 0px 0 5px; padding: 15px 5px 10px; }
.applyInfoCheckParticipantInfoTitle { margin-bottom: 10px; font: bold 15px 'Century Gothic', '微軟正黑體'; color: #999; }
.applyInfoCheckParticipantInfoContent { font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #333; }
.applyInfoCheckParticipantInfoContent ul>li { padding: 10px 0; }
.applyInfoCheckParticipantInfoContent ul>li:last-child { padding-bottom: 0; }
.applyInfoCheckParticipantInfoSubTitle { display: inline-block; width: 50px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> apply_finish.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
.applyFinishContentContainer { margin: 20px auto 0px; max-width: 650px; min-height: 300px; font: normal 18px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #333; }
.applyFinishContentContainer span { }
.applyFinishContentContainer a { color: #078ca1; }
.applyFinishContentContainer a:hover { opacity: 0.6; }
.fontSize25 { font-size: 25px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> member_login.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.memberLoginFormContainer { font-family: 'Century Gothic', '微軟正黑體'; }
.memberLoginFormContainer .genderRadio~label { border: none; border-radius: 0px; padding: 4px 0; width: 100%; font: normal 16px 'Century Gothic', '微軟正黑體'; background: #eee; }
.memberLoginFormContainer .genderRadio~label:hover { border: none; background: #024e69; color: #fff; }
.memberLoginFormContainer .genderRadio~label.ui-state-active, .memberLoginFormContainer .genderRadio~label.ui-state-active:hover { border: none; background: #024e69; color: #fff; }
.memberInformationPartContainer{ }
.memberInformationBasicContainer{ width: 100%; }
.memberInformationPersonalContainer{
	width: 100%; 
}
.memberInformationStudentContainer{
	width: 100%; 
}
.memberInformationGroupContainer{
	width: 100%; 
}
.memberInformationGroupBoxContainer{
	width: 100%; 
}
.memberInformationGroupBox{
	width: 100%; 
}
.groupinfoBtnContainer .btnCustom-outline{
	font-family: 'Century Gothic', '微軟正黑體';
}
.memberFormPrivacyCheckContainer { font: normal 14px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #333; }
.memberFormPrivacyCheckContainer a { color: #078ca1; }
.memberFormPrivacyCheckContainer a:hover { opacity: 0.6; }
.memberNote{
	margin-top: 3px;
}
.memberCenterBtn { width: 80px; height: 80px; border-radius: 50%; background: rgba(0, 60, 79, 0.8); font: normal 12px 'Century Gothic', '微軟正黑體'; text-align: center; position: fixed; bottom: 50px; right: 50px; opacity: 0.6; transition: all 0.6s; z-index: 200; }
.memberCenterBtn:hover { opacity: 1; }
.memberCenterBtn a { width: 100%; height: 100%; border-radius: 50%; color: #fff; display: block; position: relative; padding-top: 12px; }
.memberCenterBtn i { display: block; font-size: 35px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> member_order_detail.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.orderDetailContentContainer { }
.orderDetailNoContainer { padding: 10px 10px; font: bold 18px 'Century Gothic', '微軟正黑體'; letter-spacing: 1px; color: #555; background: #eee; }
.orderDetailInfoContainer { padding: 15px 10px 0; font: normal 16px 'Century Gothic', '微軟正黑體'; line-height: 25px; }
.orderDetailInfoBox { padding: 5px 0; }
.orderDetailInfoTitle { display: inline-block; letter-spacing: 1px; width: 80px; color: #777; }
.orderDetailPayBtn { display: inline-block; margin: 0 0 0 10px; padding: 2px 5px; letter-spacing: 1px; position: relative; top: -2px; }
.orderDetailInfoContainer .applyInfoCheckParticipantInfoContent ul>li { padding: 5px 0; }


.memberFeeContentContainer{
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> link.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.linkContainer { }
.linkContentContainer { }
.linkBoxContainer { }
.linkBox { margin-bottom: 35px; }
.linkImg { margin: 0 20px 10px; box-shadow: 0px 0px 5px 1px rgba(255, 255, 255, 0); border-radius: 50%; overflow: hidden; transition: all 0.6s; }
.linkImg img { overflow: hidden; transition: all 0.6s; }
.linkBoxTitle { font: bold 17px 'Century Gothic', '微軟正黑體'; text-align: center; width: 100%; color: #076291; overflow: hidden; text-overflow: ellipsis; white-space:nowrap; }
.linkBoxTitle a { color: #076291; transition: all 0.6s;  width: 100%; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
.linkBox:hover .linkImg { box-shadow: 0px 0px 10px 2px rgba(7, 98, 145, 0.6); }
.linkBox:hover .linkImg img { transform: scale(1.14); }
.linkBox:hover  .linkBoxTitle a { opacity: 0.6; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> contact.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.contactContentContainer { }
.contactMap { }
.contactMap iframe { width: 100%; height: 400px; }
.contactInfoContainer { width: 90%; max-width: 600px; margin: 0 auto; padding: 15px; background: rgba(0, 60, 79, 0.8); position: relative; top: -60px; }
.contactInfoDec { border: solid 1px #fff; padding: 15px; }
.contactInfoBox { padding: 5px 0px; font: normal 16px 'Century Gothic', '微軟正黑體'; color: #fff; letter-spacing: 1px; }
.contactInfoTitle { font-weight: bold; display: inline-block; width: 50px; letter-spacing: 2px; }
.contactInfoContent { display: inline-block; }
.contactInfoContent a { color: #fff; }
.contactInfoBg { position: absolute; bottom: 20px; right: 30px; opacity: 0.8; }
.contactInfoBg img { width: 100px; }
.contactArriveContainer{
	margin-bottom: 30px;
	padding: 20px 40px 30px;
	background: #f3f3f3;
}
.contactArriveContainer .title{
	margin-bottom: 10px;
	font-size: 30px;
	font-weight: bold;
	/*color: #fff;
	text-shadow: 1px 1px 5px rgba(0,0,0,0.5)*/

}
.contactArriveContainer .content{
	font: normal 16px 'Century Gothic', '微軟正黑體';
}
.contactArriveContainer h5{
	margin-top: 15px;
	font: bold 20px 'Century Gothic', '微軟正黑體';
	color: #076291;

}
.contactArriveContainer p{
	margin-bottom: 8px;
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> privacy.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.privacyContainer .contentContainer h6,
.termsContainer .contentContainer h6 { font: bold 20px 'Century Gothic', '微軟正黑體'; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> include_footer.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.footer { position: absolute; bottom: 0; height: 100px; width: 100%; }
.footerLogo { width: 120px; margin: 0 auto; }
.footerLogo img { }
.footerNav { height: 60px; font: normal 16px 'Century Gothic', '微軟正黑體'; letter-spacing: 2px; line-height: 60px; }
.footerNav>ul { display: flex; justify-content: center; }
.footerNav>ul>li { padding: 0 6px; position: relative; }
.footerNav>ul>li::after { content: ''; position: absolute; width: 2px; height: 10px; background: #b0cddc; top: 25px; right: 0px; }
.footerNav>ul>li:last-child::after { display: none; }
.footerNav a { color: #003c4f; }
.footerNav a:hover { opacity: 0.6; }
.footerCopyright { height: 40px; margin: 0 5%; font: normal 13px 'Century Gothic', '微軟正黑體'; text-align: center; color: #076291; letter-spacing: 1px; line-height: 20px; }
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> include_gotop.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> include_service.php <<<----------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
.serviceCenterContainer { position: fixed; right: 20px; bottom: 50px; font-size: 35px;z-index: 1 }
.serviceCenterLine { width: 50px; height: 50px; position: relative; text-align: center; background: #44be29; border-radius: 50%; margin-bottom: 10px; opacity: 0.7; transition: all 0.6s; overflow: hidden; }
.serviceCenterLine:hover { opacity: 1; }
.serviceCenterLine a { color: #fff; display: block; }
.serviceCenterFB { width: 50px; height: 50px; position: relative; text-align: center; background: #086ff9; border-radius: 50%; margin-bottom: 10px; opacity: 0.7; transition: all 0.6s; overflow: hidden; }
.serviceCenterFB:hover { opacity: 1; }
.serviceCenterFB a { color: #fff; display: block; }
.serviceCenterContact { width: 50px; height: 50px; position: relative; text-align: center; background: #ce1785; border-radius: 50%; margin-bottom: 10px; opacity: 0.7; transition: all 0.6s; overflow: hidden; line-height: 50px; }
.serviceCenterContact:hover { opacity: 1; }
.serviceCenterContact a { color: #fff; display: block; }
.serviceCenterBtn { width: 50px; height: 45px; background: orange; line-height: 45px; text-align: center; border-radius: 50%; transition: all 0.5s; opacity: 0.7; }
.serviceCenterBtn:hover { opacity: 1; }
.serviceCenterBtn a { color: #fff; display: block; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> other <<<------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
.fontColorImportant { color: #ff9900; }
.fontColor333 { color: #333 }
.fontColorBlue { color: blue }
.fontSize20 { font-size: 20px; }
.textColorGreen { color: #1b8964; }
.textColorPink { color: #f93878; }
.textColorOrg { color: #faaf05; }
.textColorSubMain{
	color: #078ca1
}

/* -------------->>> ie-decide.php ie瀏覽器限制 <<<----------------*/
.modal_browse { display: none; position: fixed; z-index: 9999; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); }
.wrap { max-width: 800px; margin: 100px auto 0 auto; font-size: 1.2em; text-transform: capitalize; line-height: 1.5; text-align: center; background: #FFF4F4; padding: 50px 30px; }
.wrap .text { text-align: left; }
.wrap a { display: block; text-transform: capitalize; }
.wrap h2 { font-size: 19px; text-decoration: underline; color: #e25600; margin: 0; }
.wrap h3 { font-size: 10px; color: #aaa; margin: 0; }
.wrap img { margin: auto; }
.opacity0{
	opacity: 0;
}