@charset "utf-8";

/* CSS Document */
body {
	margin                  : 0;
	padding                 : 0;
	font-family             : "微软雅黑", "Microsoft YaHei", "微軟正黑體", "Microsoft JhengHei", "Lucida Grande", "Tahoma", "Verdana", "Arial", "sans-serif", "新細明體", "PMingLiU";
	-webkit-text-size-adjust: 100%;
	overflow-y              : scroll;
}

a {
	outline        : none;
	text-decoration: none;
}

img {
	border: 0;
}

/*inner_center 寬1024 置中*/
/*pc_hide 在網頁版隱藏 需包在外面*/
/*phone_hide 在手機版隱藏 需包在外面*/
.loading {
	position        : fixed;
	top             : 0;
	left            : 0;
	width           : 100%;
	background-color: #efefef;
	z-index         : 500;
}

.loading_css {
	position         : absolute;
	top              : 0;
	right            : 0;
	bottom           : 0;
	left             : 0;
	margin           : auto;
	border           : 3px solid #da464f;
	border-right     : 3px solid #fff;
	border-bottom    : 3px solid #fff;
	height           : 50px;
	width            : 50px;
	border-radius    : 50%;
	-webkit-animation: loading_css 1s infinite linear;
	-moz-animation   : loading_css 1s infinite linear;
	-o-animation     : loading_css 1s infinite linear;


	animation: loading_css 1s infinite linear;
}

@-webkit-keyframes loading_css {
	from {
		-webkit-transform: rotate(0deg);
	}

	to {
		-webkit-transform: rotate(360deg);
	}
}

@-moz-keyframes loading_css {
	from {
		-moz-transform: rotate(0deg);
	}

	to {
		-moz-transform: rotate(360deg);
	}
}

@-o-keyframes loading_css {
	from {
		-o-transform: rotate(0deg);
	}

	to {
		-o-transform: rotate(360deg);
	}
}

@keyframes loading_css {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

.float {
	float: left;
}

.clear {
	clear: left;
}

.animate_top {
	margin-top: 10%;
	opacity   : 0;
}

.animate_left {
	margin-left: 10%;
	opacity    : 0;
}

/*按鈕模組 module_btn*/
.module_btn {
	cursor          : pointer;
	border-radius   : 5px;
	background-color: #ffffff;
	border          : 2px solid #da464f;
	display         : inline-block;
	color           : #343434;
}

.module_btn:hover {
	border          : 2px solid #da464f;
	background-color: #da464f;
	color           : #ffffff;
}

.module_btn2 {
	cursor          : pointer;
	border-radius   : 5px;
	background-color: #da464f;
	color           : #ffffff !important;
	display         : inline-block;
}

.module_btn2:hover {
	background-color: #e05a67;
	color           : #ffffff;
}

.module_btn2 img {
	margin-bottom: -12px;
	margin-right : 8px;
}

/*文字垂直置中*/
.vertical {
	display: table;
	height : 100%;
	width  : 100%;
}

.vertical .cell {
	display       : table-cell;
	vertical-align: middle;
}

/*回頂端*/
#gotop {
	width              : 55px;
	height             : 55px;
	background-image   : url(../img/top.png);
	background-size    : 100%;
	background-position: center;
	display            : none;
	position           : fixed;
	right              : 20px;
	bottom             : 20px;
	cursor             : pointer;
	z-index            : 50;
}

#gotop:hover {
	background-image: url(../img/top_click.png);
}

/*回頂端 結束*/
/*menu*/
.menu_cornerBox {
	position: absolute;
	top     : 15px;
	right   : 10px;
}
.menu_socialBox {
	position: relative;
	display: inline-block;
	margin-right: 15px;
}
.menu_socialBox a:not(:last-child) {
	margin-right: 8px;
}
.menu_socialBox a img {
	position: relative;
	width: 31px;
	height: auto;
}
.menu_select {
	position           : absolute;
	-webkit-appearance : none;
	/*for chrome*/
	appearance         : none;
	-moz-appearance    : none;
	background-color   : #f1f1f1;
	color              : #9a9898;
	border-radius      : 5px;
	border             : none;
	background-image   : url(../img/down.png);
	background-repeat  : no-repeat;
	background-position: center right;
	background-size    : 25px 13.33px;
	width              : 200px;
	height             : 31px;
	padding            : 0px 34px 0px 5px;
	font-size          : 13px;
	letter-spacing     : 0.7px;
	vertical-align: top;
}

.menu_select::-ms-expand {
	display: none;
}

/*menu_phone*/
.menu_phone {
	position: fixed;
	width   : 100%;
	top     : 0;
	z-index : 100;
}

.menu_phone .top {
	position        : absolute;
	top             : 0;
	width           : 100%;
	height          : 64px;
	/*border-bottom : 6px solid #bf4f4f; */
	background-color: #da464f;
}

.menu_phone .top .logo {
	position: absolute;
	top     : 9px;
	left    : 20px;
	height  : 45px;
}

.menu_phone .top .menu {
	position: absolute;
	top     : 13px;
	right   : 20px;
	width   : 36px;
	cursor  : pointer;
}

.menu_phone .bottom {
	display         : none;
	position        : absolute;
	top             : 64px;
	width           : 100%;
	height          : calc(100% - 64px);
	overflow        : auto;
	background-color: #ffffff;
}

.menu_phone .menu_cornerBox {
	position: relative;
	top: 0;
	right: initial;
	width: 100%;
}
.menu_phone .menu_socialBox {
	width: 100%;
	margin-right: 0;
	text-align: right;
}
.menu_phone .menu_select {
	position: relative;
	top     : auto;
	right   : auto;
	width   : 100%;
	padding : 0px 2.5% 0px 2.5%;
	margin  : 10px 0 0 0;
}

.menu_phone .h_li {
	color         : #444040;
	width         : 98%;
	padding       : 10px 1%;
	margin        : 0 auto;
	border-bottom : #d1d1d1 1px solid;
	font-size     : 18px;
	letter-spacing: 1px;
}

.menu_phone .level2 {
	display: none;
}

.menu_phone .level2 .h_li {
	background-color: #d1d1d1;
	color           : #ffffff;
}

.menu_phone .level2 a .h_li {
	background-color: #ededed;
	color           : #444040;
}

/*footer*/
.footer {
	z-index : 6;
	position: relative;
}

.footer .top {
	text-align      : center;
	background-color: #ffffff;
	width           : 100%;
}

.footer .top img {
	/*height: 104px;*/
	margin: 0 3%;
}

.button_label02 {
	margin-bottom: 1% !important;
}

.footer .bottom {
	background-color: #272727;
	color           : #ffffff;
	line-height     : 28px;
}

.footer a {
	color: #ffffff;
}

/*修改區*/
.footer .footer_add {
	border-bottom : 1px solid #ffffff;
	margin-bottom : 20px;
	padding-bottom: 20px;
}

.footer_add_title {
	margin-bottom: 15px;
}

.footer_add_left {
	float: left;
	width: 45%;
}

.footer_add_right {
	float: right;
	width: 45%;
}

.footer_add_g {
	background-image   : url(../img/footer_addicon.png);
	background-repeat  : no-repeat;
	background-position: 0px 8px;
	background-size    : 11px 11px;
	padding            : 0 0 0 20px;
	margin-bottom      : 10px;
}

.footer .footer_add p {
	text-align: center;
	font-size : 15px;
	margin    : 0;
}

.footer .footer_add p span {
	padding: 0 1em;
}

/*修改區end*/
.content {
	position: relative;
	width   : 100%;
}

.width100 {
	width: 100%;
}

.font_margin {
	margin-top: 0.5%;
}

/*wrap的overflow: hidden 是為了banner的圖加的若不加 會有x捲軸*/
.wrap {
	overflow: hidden;
}

.join_btn {
	color        : #0caed7;
	border-bottom: #0caed7 solid 1px;
	cursor       : pointer;
}

.join_btn img {
	padding-left : 2px;
	margin-bottom: -2px;
}

@media screen and (min-width: 1000px) {
	/*如果使用者之視窗寬度 >= 1000px，將會再載入這裡的 CSS。 電腦*/

	.inner_center {
		width   : 1000px;
		margin  : 0 auto;
		position: relative;
	}

	/*統一內距*/
	.general_padding {
		margin  : auto;
		width   : 980px;
		padding : 30px 10px;
		position: relative;
	}

	/*按鈕模組 module_btn*/
	.module_btn {
		padding  : 9px 19px 8.5px 19px;
		min-width: 90px;
	}

	.module_btn2 {
		padding  : 2px 13px 8px 12px;
		min-width: 103px;
		margin   : 5px;
	}

	.module_btn2 img {
		height: 35px;
	}

	/*menu_pc*/
	.menu_pc {
		position        : fixed;
		width           : 100%;
		/*border-bottom : solid 3px #bf4f4f;*/
		top             : 0;
		background-color: #da464f;
		z-index         : 100;
	}

	.menu_pc .inner_center {
		position: relative;
		height  : 96px;
	}

	.menu_pc .logo {
		position: absolute;
		top     : 14px;
		left    : 10px;
		/*width : 90px;*/
		height  : 50px;
	}

	.menu_pc .btn_div {
		position      : absolute;
		bottom        : 11px;
		right         : 10px;
		font-size     : 15px;
		letter-spacing: 0.7px;
	}

	.menu_pc .btn_div a {
		color: #444040 !important;
	}

	.menu_pc .btn_div .btn {
		color   : #ffffff !important;
		display : inline-block;
		padding : 0px 11px 0px 5px;
		position: relative;
	}

	.menu_pc .btn_div .btn:not(:last-child) {
		border-right: #ffffff solid 1px;
	}

	.menu_pc .btn_div .btn>a {
		color: #ffffff !important;
	}

	.menu_pc .btn_div .btn .drift {
		position        : absolute;
		top             : 15px;
		left            : -33px;
		font-size       : 13px;
		background-color: #ffffff;
		color           : #666666;
		width           : 190px;
		border-bottom   : #b5b5b6 2px solid;
		border-left     : #b5b5b6 2px solid;
		border-right    : #b5b5b6 2px solid;
		display         : none;
	}

	.menu_pc .btn_div .btn>div {
		position: absolute;
		top     : 16px;
		left    : 0px;
		width   : 100%;
		height  : 20px;
	}

	.menu_pc .btn_div .btn .drift div {
		background-color: #ededed;
		padding         : 10px 20px 10px 7px;
		border-bottom   : #b5b5b6 1px solid;
	}

	.menu_pc .btn_div .btn .drift>a>div {
		background-color: #ffffff !important;
		color           : #666666;
		text-align      : right;
	}

	.menu_pc .btn_div .btn .drift>a>div:hover {
		text-shadow: 0 0 1px #666666, 0 0 1px #666666;
	}

	.menu_pc .btn_div .btn:hover .drift {
		display: block;
	}

	.menu_phone {
		display: none;
	}

	.pc_hide {
		display: none;
	}

	.phone_hide {
		display: block;
	}

	.inner_bg {
		height             : 189px;
		background-image   : url(../img/inner_bg.png);
		background-position: center;
		background-repeat  : no-repeat;
	}

	.wrap {
		width     : 100%;
		margin-top: 96px;
	}

	/*footer*/
	.footer .bottom .general_padding {
		padding: 30px 10px 30px 10px !important;
	}

	/*.footer .bottomLogo01{
	position: absolute;
	width: 290px;
	bottom: 23px;
	right:20px;
}*/
	/*.footer .logo2_815{
	position: absolute;
	width: 145px;
	top: 22px;
	right:12px;
}*/
	.footer .logo_place {
		position: absolute;
		bottom  : 13px;
		right   : 0px;
	}

	.footer .logo_place img {
		height: 107px;
	}

	.join_btn {
		width         : 79.45px;
		padding-bottom: 3px;
	}

	.join_btn img {
		width: 8px;
	}

	.button_label02 {
		width: 86px;
	}

	.button_label03 {
		width: 57px;
	}

	/*電腦版結束*/
}

@media screen and (max-width: 999px) {

	/*如果使用者之視窗寬度 <= 999px，將會再載入這裡的 CSS。手機板*/
	.inner_center {
		width   : 100%;
		margin  : 0 auto;
		position: relative;
	}

	/*統一內距*/
	.general_padding {
		width  : 94%;
		padding: 20px 3%;

		position: relative;
	}

	.module_btn {
		padding  : 8px 19px 8.5px 19px;
		min-width: 70px;
	}

	.module_btn2 {
		padding  : 3px 11px 8.5px 11px;
		min-width: 90px;
		margin   : 3px;
	}

	.module_btn2 img {
		height: 30px;
	}

	.menu_pc {
		display: none;
	}

	.pc_hide {
		display: block;
	}

	.phone_hide {
		display: none;
	}

	.inner_bg {
		background-image   : url(../img/inner_bg.png);
		background-position: center;
		background-repeat  : no-repeat;
		background-size    : 128.4%;
		padding-top        : 18.7%;
	}

	.wrap {
		width     : 100%;
		margin-top: 64px;
	}

	/*footer*/
	.footer {}

	/*.logo_815{
	width: 98%;
	height: auto !important;
	max-width: 349.55px;
}*/
	/*footer*/
	.footer .bottom .general_padding div {
		max-width: 313px;
		margin   : auto;
	}

	/*.footer .bottomLogo01{
	position: relative;
	width: 100%;
	max-width: 322px;
	margin:15px auto 0 auto;
	display: block;

}*/
	/*.logo2_815{
	position: relative;
	width: 100%;
	max-width: 160px;
	margin:15px auto 0 auto;
	display: block;	
}*/
	.footer .logo_place {
		width     : 100%;
		margin-top: 15px !important;
		text-align: center;
	}

	.footer .logo_place img {
		height: 73px;
	}

	/*修改區*/
	.footer_add_left,
	.footer_add_right {
		width: 100%;
		float: none;
	}

	.footer .footer_add {
		padding-bottom: 15px;
		margin-bottom : 15px !important;
	}

	.footer_add_g {
		padding-bottom: 10px;
	}

	.footer_add_title {
		margin-bottom: 10px !important;
	}

	/*修改區end*/
	.join_btn {
		width         : 68.36px;
		padding-bottom: 2.4px;
	}

	.join_btn img {
		width: 6px;
	}

	.button_label02 {
		width: 86px;
	}

	.button_label03 {
		width: 57px;
	}

	/*手機版結束*/
}