@charset"utf-8";
/* CSS Document */
 *, body {
	margin: 0;
	padding: 0;
	font-family:'Noto Sans TC',"微軟正黑體", Microsoft JhengHei, Arial, helvetica;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
	line-height: 150%;
	letter-spacing: .1em;
}
body {
	background: #f2f5fa;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	min-height: 100vh;
}
.body_m{
	overflow: hidden;
}
a {
	outline: none;
	hlbr: expression(this.onFocus=this.blur());
	text-decoration: none;
}
a:hover {
	text-decoration: none;
	color: #fff;
}
img,  a img {
	border: none;
	vertical-align: middle;
}
ul, ol {
	margin: 0;
	padding: 0;
}
.clearfix:before,  .clearfix:after {
	display: table;
	line-height: 0;
	content:"";
}
.clearfix:after {
	clear: both;
}
.flex{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	align-items: center;
}
.noflex{
	-webkit-box-flex: none;
	-moz-box-flex: none;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
}
.flex1{
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}
.wrap{
	flex-wrap: wrap;
}
.align-center{
	align-items: center;
}
.mt-3{
	margin: 30px auto 0 auto !important
}
.info_overlay{
	display: none;
	width: 100%;
	height: 100%;
	position: fixed;
	background: rgba(0, 0, 0, .8);
	z-index: 1;
}
.info_overlay.block{
	display: block;
}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
	-webkit-appearance: none;
}
input[type="number"]{
	background: transparent;
	-moz-appearance: textfield;
}
select.form-control{
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	padding: 5px 25px 5px 15px;
	background: url("../images/arrow.png") no-repeat 95% center transparent;
}
.gPageBefore {
	position: fixed;
	z-index: 1003;
	width: 100%;
	height: 100%;
	top: 0;
	-webkit-transform-origin: left top;
	transform-origin: left top;
	transition-duration: .5s;
	transition-property: transform, width;
	width: 100%;
	overflow: hidden;
	transition-delay: 0s, .3s;
	background: #fff;
	-webkit-transform: skewX(0deg);
	transform: skewX(0deg);
	right: 0;
}
.gPageBefore.isLoaded {
	width: 0;
	-webkit-transform: skewX(10deg);
	transform: skewX(10deg);
}
.gPageAfter {
	position: fixed;
	z-index: 1002;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	-webkit-transform-origin: left top;
	transform-origin: left top;
	-webkit-transform: skewX(-10deg);
	transform: skewX(-10deg);
	transition-duration: .5s;
	transition-property: transform, width;
	width: 0;
	overflow: hidden;
	transition-delay: 0.3s, 0s;
	background: #fff;
}
.gPageAfter.isShow {
	width: 100%;
	-webkit-transform: skewX(0deg);
	transform: skewX(0deg);
}
[data-animation] {
	opacity: 0;
}
[data-animation="after"] {
	opacity: 1;
	transition-duration: .5s;
	transition-property: opacity;
}
[data-delay=".1s"] {
	transition-delay: .1s;
}
[data-delay=".2s"] {
	transition-delay: .2s;
}
[data-delay=".3s"] {
	transition-delay: .3s;
}
[data-delay=".4s"] {
	transition-delay: .4s;
}
[data-delay=".5s"] {
	transition-delay: .5s;
}
.md-radio label{
	line-height: 1.3;
}
.google_btn.sm{
	height: 30px;
	width: 30px;
}
.google_btn.sm .btn_content{
	padding: 0;
}
.google_btn.sm i{
	font-size: 12px;
}
.bg_white{
	background: #fff;
	border-top: 1px solid #c8ced3;
}
/*loading*/
@-webkit-keyframes load{ 0%{ opacity: 1; } 100%{ opacity: 0.2; }}
.loading{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0,.5);
	z-index: 9999;
}
.loadEffect {
	position: relative;
	width: 100px;
	height: 100px;
}
.loadEffect span {
	display: inline-block;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fff;
	position: absolute;
	-webkit-animation: load 1.04s ease infinite;
}
.loadEffect span:nth-child(1){
	left: 0;
	top: 50%;
	margin-top:-8px;
	-webkit-animation-delay:0.13s;
}
.loadEffect span:nth-child(2){
	left: 14px;
	top: 14px;
	-webkit-animation-delay:0.26s;
}
.loadEffect span:nth-child(3){
	left: 50%;
	top: 0;
	margin-left: -8px;
	-webkit-animation-delay:0.39s;
}
.loadEffect span:nth-child(4){
	top: 14px;
	right:14px;
	-webkit-animation-delay:0.52s;
}
.loadEffect span:nth-child(5){
	right: 0;
	top: 50%;
	margin-top:-8px;
	-webkit-animation-delay:0.65s;
}
.loadEffect span:nth-child(6){
	right: 14px;
	bottom:14px;
	-webkit-animation-delay:0.78s;
}
.loadEffect span:nth-child(7){
	bottom: 0;
	left: 50%;
	margin-left: -8px;
	-webkit-animation-delay:0.91s;
}
.loadEffect span:nth-child(8){
	bottom: 14px;
	left: 14px;
	-webkit-animation-delay:1.04s;
}
/*autocomplete*/
.autocomplete {
	position: absolute;
	border: 1px solid #d4d4d4;
	border-bottom: none;
	border-top: none;
	z-index: 99;
	top: 100%;
	left: 0;
	right: 0;
	background: white;
}
.autocomplete div {
	padding: 10px;
	cursor: pointer;
	background-color: #fff;
	border-bottom: 1px solid #d4d4d4;
}
.autocomplete div:hover {
	background-color: #e9e9e9;
}
/** header **/
header.app-header{
	width: 100%;
	background: rgba(56, 65, 185, 0.9);
	position: fixed;
	top: 0;
	left: 0;
	height: auto;
	z-index: 99;
	transition-duration: .3s;
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05), 0 1px 1px rgba(0, 0, 0, 0.05);
}
.inside{
	width: 1260px;
	margin: 0 auto;
}
.logo{
	padding: 0 15px;
}
.logo a{
	display: block;
	width: 150px;
	height: 80px;
	/* width: 210px;
	height: 80px; */
	/* background:  url(../images/grandmall_logo_2022.png) no-repeat center center; */
	background:  url(../images/amego_add_text001.svg) no-repeat center center;
	background-size: 100%;
	text-indent:-9999px;
}
#trigger-overlay, .overlay-close {
	display: none;
}
.link {
	margin: 0 15px;
}
.link nav ul{
	list-style: none;
	display: flex;
}
.link nav ul li{
	display: flex;
}
.link nav ul li a{
	position: relative;
	font-size: 17px;
	font-weight: bold;
	color:#fff;
	padding: 6px 20px;
	margin: 0 0 0 20px;
	z-index: 1;
}
.link nav ul li a.login:after, .link nav ul li a.logout:after{
	display: none;
}
.link nav ul li a:after {
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	right: 50%;
	bottom: -3px;
	height: 3px;
	opacity: 0;
	background-color: #f3dd23;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
}
.link nav ul li a:hover:after {
	left: 1%;
	right: 1%;
	opacity: 1;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
}
.link nav ul li a.login:hover {
    color: #000;
}
.link nav ul li a, .link nav ul li a.login:before {
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.link nav ul li a.login:hover:before, .link nav ul li a.logout:hover:before{
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.link nav ul li a.login:before ,.link nav ul li a.logout:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: -1;
	opacity: 0;
	-webkit-transform: scale3d(0.7, 1, 1);
	transform: scale3d(0.7, 1, 1);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s, background .4s;
	transition: transform 0.4s, opacity 0.4s, background .4s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.link nav ul li a.login:hover:before{
	background: #f3dd23;
}
.link nav ul li a.logout:hover:before{
	background: #f44235;
}
.link nav ul li a.logout {
	margin: 0;
	color: #f44235;
	font-size: 1rem;
	border: 1px solid #f44235;
	padding: 3px 15px;
	line-height: 30px;
}
.link nav ul li a.logout:hover{
	color: #fff;
}
.login_user {
	display: flex;
	align-items: center;
	color: #ffcb31;
	font-size: 1rem;
	margin: 2px 10px 0 0;
	line-height: 0;
}
.login_user span{
	border-radius: 50%;
	width: 30px;
	height: 30px;
	margin: 0 15px 0 10px;
	overflow: hidden;
}
.login_user b{
	max-width: 100px;
	overflow : hidden;
	text-overflow : ellipsis;
	white-space : nowrap;
}
.login_user img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/*body*/
.header-fixed .app-body{
	overflow: inherit;
	margin: 80px 0 0 0;
}
/** footer **/
html:not([dir="rtl"]) .sidebar-lg-show.sidebar-fixed .app-footer{
	justify-content: center;
	margin: 0;
}
footer.app-footer{
	width: 100%;
	padding: 0;
	border-top: 1px solid #ccc;
	background: #f0f3f5;
}
.app-footer div{
	width: 100%;
	text-align: center;
	padding: 5px 0;
	background: #f0f3f5;
}
.app-footer div.footer_link{
	padding: 10px;
	background: #fff;
}
.app-footer div.footer_link a{
	color: #3674D9;
	padding: 0 10px
}
.app-footer div.footer_link a:hover{
	text-decoration: underline;
}
/** index **/
/** banner **/
/*舊的*/
.banner {
	position: relative;
	width: 100%;
	overflow: hidden;
}
.banner img{
	width: 100%;
	max-width: 100%;
	transition-duration: 0.5s;
	transition-property: opacity;
}
.b_text{
	position: absolute;
	left: 10%;
	top: 50%;
        transform: translateY(-50%);
	z-index: 9;
	color:#fff;
	width: 420px;
}
.b_text h2{
	font-size: 47px;
	padding: 0 0 15px 0;
	border-bottom: 1px solid #fff;
}
[data-animation="after"] .b_text h2 {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	transition-duration: 1s;
	transition-property: transform, opacity;
	transition-delay: 0.3s;
}
.b_text p {
	font-size: 19px;
	margin: 20px 0;
}
.button{
	position: relative;
	overflow: hidden;
	display: block;
	max-width: 100%;
	width: 230px;
	padding: 12px;
	background-color: #242993;
	border: 0;
	font-size: 19px;
	font-weight: bold;
	text-align: center;
	color: #fff;
	border-radius:50px;
}
.button > span {
	position: relative;
	z-index: 1;
	transition: 0.2s;
}

.button:hover {
	background: #000;
	color: #fff;
        text-decoration: none;
}
.button:hover > span{
	letter-spacing: 0.5rem;
	transition: .5s;
}
@keyframes cmnbtnAnim01-ro {
	0% {
		transform-origin: left top;
		transform: scaleX(0.0);
	}
	100% {
		transform-origin: left top;
		transform: scaleX(1.0);
	}
}
[data-animation="after"] .b_text p {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	transition-duration: 1s;
	transition-property: transform, opacity;
	transition-delay: .5s;
}
[data-animation="after"] .banner > img {
	opacity: 1;
}
.fadeIn {
	-webkit-transform: translateY(30px);
	transform: translateY(30px);
}
.machine{
	position: absolute;
	z-index: 3;
	opacity: 1;
	right: 12%;
	bottom: 0;
	-webkit-transform: translateX(1000px);
	transform: translateX(1000px);
	transition-duration: .5s;
	transition-property: transform, opacity;
	transition-delay: 1s;
}
[data-animation="after"] .machine, [data-animation="after"] .cloud {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.cloud{
	position: absolute;
	right: 0;
	top: 15%;
	z-index: 1;
	-webkit-transform: translateX(1000px);
	transform: translateX(1000px);
	transition-duration: .8s;
	transition-property: transform, opacity;
	transition-delay: 1s;
}
/*新的*/
.index_banner{
	position: relative;
	display: flex;
	align-items: center;
	z-index: 15;
	width: 100%;
	height: 900px;
	overflow: hidden;
	background: #eee;
}
.index_banner img{
	max-width: 100%;
}
.banner_invoice{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.i_bg {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	transition-property: all;
	transition-duration: 1.2s;
	transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.invoice_active {
	background-position: 50% 100%;
}
.invoice_bg{
	background-position: 50% 100%;
	filter: blur(5px);
	transform: scale(1.05);
}
.active .invoice_active {
	transition-delay: 1s;
	background-position: 50% 0%;
}
.active .invoice_bg {
	transition-delay: 1s;
	background-position: 50% 50%;
	transform: scale(1);
	filter: blur(0px);
}
.computer{
	position: absolute;
	right: 0;
	bottom: 0;
}
.machine_s {
	position: absolute;
	right: 20%;
	bottom: 0;
	z-index: 1;
}
.index_banner_txt{
	position: relative;
	width: 700px;
	background: #fff;
	padding: 50px;
	left: 10%;
}
.index_banner_txt h3{
	font-size: 17px;
	font-weight: bold;
	padding: 8px 30px;
	display: inline-block;
	background: #fff38c;
	color: #000;
}
.index_banner_txt h2 {
	color: #242993;
	font-size: 45px;
	line-height: 1;
	font-weight: bold;
	margin: -35px 0 21px 0;
}
.index_banner_txt h2 span{
	font-size: 91px;
	line-height: 1;
	color: #da0000;
}
.index_banner_txt h4 span{
	color: #fff;
	font-size: 17px;
	display: inline-block;
	padding: 8px 15px;
	background: #242993;
	border-radius: 10px;
	margin: 0 10px 10px 0;
	min-width: 160px;
	text-align: center;
}
.index_banner_txt p{
	margin: 10px 0;
	font-size: 18px;
}
.index_banner_txt a{
	display: inline-block;
	width: 300px;
	max-width: 90%;
	color: #242993;
	margin: 20px 0 0 0;
	padding: 8px 20px;
	font-size: 17px;
	text-align: center;
	border-radius: 10px;
	border:1px solid #242993;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
}
.index_banner_txt a:hover{
	color: #fff;
	background: #000;
}
.mb_show_table {
	display: none;
}
/** layout **/
.container-fluid{
	height: 100%;
}
.sidebar .nav-title{
	color: #000;
	font-size: .9rem;
	margin: 0;
	background: #f2f2f2;
}
/*support*/
.support{
	width: 100%;
	padding: 30px;
	background: #242993;
}
.support h2{
	font-size: 31px;
	color: #f2e683;
	text-align: center;
}
.support img{
	margin: 10px 30px 10px 0 ;
}

/** content **/
.service{
	padding: 20px 0;
	-webkit-transform: translateX(-100px);
	transform: translateX(-100px);
	transition-duration: .5s;
	transition-property: transform, opacity;
	transition-delay: .3s;
	background: #fff;
}
.service[data-animation="after"] {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.service ul{
	list-style: none;
}
.service ul li {
	width: 33%;
	padding: 2%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	transition: all 0.5s ease-in-out, left 0s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out, left 0s ease-in-out;
}
.service ul li img{
	display: block;
	margin: 0 auto 15px auto;
}
.service ul li:hover{
	background: #fff;
	box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1);
}
.service ul li .s_text{
	margin: 0 0 0 20px;
}
.service ul li h3{
	font-size: 21px;
	font-weight: bold;
	text-align: center;
	margin: 0 0 2% 0;
}
/*plan*/
.bg_orange{
	padding: 40px 0;
	background:#ffce3d;
}
.plan_img{
	list-style: none;
	display: flex;
	flex-wrap: wrap;
}
.plan_img li{
	width: 30%;
	margin: 0 5% 0 0;
}
.plan_img li:nth-child(3){
	margin: 0;
}
.plan_img li img{
	max-width: 100%;
}
.plan_memo {
	padding: 30px 0 0 25px;
}
.plan {
	background: #fff;
	position: relative;
	padding: 50px 0;
}
.plan h1{
	font-size: 31px;
	color: #242993;
	font-weight: bold;
}
.plan h2 {
	font-size: 23px;
	color: #666;
	margin: 15px 0 40px 0;
	font-weight: bold;
}
.plan h3{
	font-size: 23px;
	font-weight: bold;
}
.plan ul{
	padding: 0 0 0 22px;
}
.plan p, .plan ul li{
	font-size: 16px;
	line-height: 1.7;
	margin: 0 0 5px 0;
}
.plan_text{
	width: 50%;
}
.plan_pic{
	width: 50%;
}
.plan_pic img{
	max-width: 100%;
}

/*advantage*/
.advantage{
	text-align: center;
	padding: 40px 0;
}
.advantage h1{
	margin: 0 0 40px 0;
}
.advantage ul{
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 20px 0 0 0;
}
.advantage ul li{
	padding: 15px;
	width: 32%;
	margin: 0 2% 2% 0;
	border-radius: 5px;
}
.advantage ul li img{
	display: block;
	margin: 0 auto;
	width: 100px;
	max-width: 100%;
}
.advantage ul li:nth-child(3n){
	margin: 0 0 2% 0;
}
.advantage ul li > span{
	font-weight: bold;
	color: #242993;
	display: block;
	font-size: 21px;
}
.advantage ul li h2 {
	font-size: 22px;
	margin: 15px 0;
	padding: 0 0 10px 0;
	color: #333;
	font-weight: bold;
}
.advantage ul li p{
	text-align: left;
	color: #666;
}
.dowload.plan_27001{
	position: relative;
	background: url(../images/27001.jpg) no-repeat center center;
	background-size: cover;
}
.dowload.plan_27001:before{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: block;
	background: rgba(56, 65, 185, 0.8);
	content: " ";
}
.dowload.plan_27001 h1 {
	margin: 0 0 30px 0;
}
.dowload.plan_27001 p {
	width: 80%;
	margin: 10px auto;
	padding: 0;
}
/*first*/
.first{
	position: relative;
	padding: 50px 0;
	background: #fff;
}
.first_tit{
	text-align: center;
}
.first_tit h3{
	color: #242993;
}
.first_tit h1{
	margin: 0 0 20px 0;
}
.first ul li .ico p {
	font-size: 23px;
	margin: 0;
	line-height: 1;
}
.first ul{
	width: 100%;
	list-style: none;
	display: flex;
	margin: 50px 0 0 0;
}
.first ul li{
	width: 30%;
	margin: 0 2% 0 0;
	background-color: #fff;
	border-radius: 4px;
	text-align: center;
}
.first ul li.arrow{
	position: relative;
	width: 3%;
	margin: 0;
	background: transparent;
}
.first ul li.arrow:before {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 20px;
	height: 40px;
	background: url(../images/step_arrow.png) center center no-repeat;
	background-size: cover;
	content: "";
}
.first ul li .ico{
	display:block;
	text-align: center;
	position: absolute;
	top: -40px;
	left: 30px;
	width: 64px;
	height: 64px;
	background: #000;
	color: #fff;
	border-radius: 100%;
	z-index: 1;
}
.first ul li .ico span{
	font-size: 13px;
}
.first ul li .ico p{
	font-size: 25px;
	margin: 0;
}
.first ul li .first_img {
	padding: 30px 30px 0 30px;
}
.first ul li .first_img img{
	max-width: 100%;
}
.first ul li .first_text{
	padding: 20px;
}
.first ul li .first_text h1 {
	font-size: 25px;
	font-weight: 800;
}
.first ul li .first_text p{
	text-align: left;
	font-size: 15px;
	line-height: 170%;
	margin: 15px 0 0 0;
}
.first ul li .first_text .fadeIn{
	margin: 30px auto 10px auto;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}
.dowload{
	display: flex;
	align-items: center;
	text-align: center;
	color:#fff;
	width: 100%;
	height: 300px;
	background:url(../images/download.jpg) no-repeat center center;
	background-size: cover;
}
.dowload h1{
	width: 100%;
}
.dowload p{
	width: 40%;
	line-height: 170%;
	margin: 20px auto;
	padding: 0 0 0 60px;
}
.d_btn{
	width: 100%;
}
.d_btn .button{
	margin: 0 auto;
}
/** top **/
#top {
	position: fixed;
	display: block;
	width: 50px;
	height: 50px;
	z-index: 99;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	right: 10px;
	bottom: 10px;
	background-color: #242993;
	color: #fff;
	text-align: center;
	line-height: 60px;
	font-size: 15px;
	}
#top::before {
	display: block;
	content: "";
	position: absolute;
	left: 19px;
	top: 13px;
	width: 11px;
	height: 11px;
	border-right: 1px solid #fff;
	border-top: 1px solid #fff;
	-ms-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#top:hover {
	border: 1px solid #242993;
	background: #fff;
	color:#242993;
}
#top:hover::before {
	border-right: 1px solid #242993;
	border-top: 1px solid #242993;
}
/** login **/
.login_page{
	width: 100%;
	margin: 80px 0 0 0;
	background: url(../images/login_banner2.jpg) no-repeat center top;
	background-size: cover;
}
.login_page:before{
	content: " ";
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #232683;
	background: -moz-linear-gradient(left, #232683 0%, #5b7dc9 100%);
	background: -webkit-linear-gradient(left, #232683 0%, #5b7dc9 100%);
	background: linear-gradient(to right, #232683 0%, #5b7dc9 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#232683', endColorstr='#5b7dc9',GradientType=1 );
	opacity: .8;
}
.login_box{
	width: 100%;
	position: relative;
	border-radius: 8px;
	padding: 30px;
	background: #fff;
	border: 1px solid #e2e2e2;
	box-shadow: 0 10px 45px 0 hsla(0,0%,64.3%,.3);
	-webkit-animation: fadein .3s ease-in-out;
	animation: fadein .3s ease-in-out;
}
.set_box .col-form-label{
	width: 140px;
}
.set_box .group{
	margin: 0 15px 0 0;
}
.set_box .group , .col-btn{
	flex: 1;
}
.login_box h2, .set_box h2{
	position: relative;
	font-size: 31px;
	text-align: center;
	padding: 0 0 15px 0;
	margin: 0 0 15px 0;
}
.login_box h2:after ,.set_box h2:after {
	background-color: #232683;
	content: '';
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
	width: 66px;
	height: 2px;
}
.login_box p, .set_box p{
	text-align: center;
	color:#666;
	font-size: 17px;
	margin: 5px 0 0 0;
}
.login_box ul{
	list-style: none;
	margin: 40px 0 0 0;
}
.login_box ul li{
	position: relative;
	margin: 0 0 30px 0;
}
.login_box ul li a {
	display: block;
	width: 100%;
	color: #fff;
	font-size: 21px;
	text-align: center;
	border-radius: 8px;
	overflow: hidden;
	line-height: 60px;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.05);
	box-shadow: 0 0 10px rgba(0,0,0,.05);
	transition: -webkit-transform .6s cubic-bezier(.23, 1, .32, 1);
	transition: transform .6s cubic-bezier(.23, 1, .32, 1);
	transition: transform .6s cubic-bezier(.23, 1, .32, 1), -webkit-transform .6s cubic-bezier(.23, 1, .32, 1);
}
.login_box ul li a span{
	z-index: 2;
	position: relative;
}
.login_box ul li a:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	z-index: 0;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: left center;
	transform-origin: left center;
	-webkit-transition: all .8s cubic-bezier(.19,1,.22,1);
	transition: all .8s cubic-bezier(.19,1,.22,1);
	-webkit-transition-timing-function: cubic-bezier(.19,1,.22,1);
	transition-timing-function: cubic-bezier(.19,1,.22,1);
}
.login_box ul li a.facebook:before{
	background: #243b68;
}
.login_box ul li a.line:before{
	background: #008e00;
}
.login_box ul li a:hover{
	-webkit-transform: scale(1.02);
	transform: scale(1.02);
}
.login_box ul li a:hover:before {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}
.login_box ul li a i{
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	line-height: 60px;
	width: 80px;
	height: 60px;
	text-align: center;
}
.login_box ul li a.facebook i{
	background: #243b68;
}
.login_box ul li a.line i{
	background: #008e00;
}
.login_box ul li a.facebook{
	background: #3a5998;
}
.login_box ul li a.line{
	background: #00b900;
}
.login_btn a {
	display: inline-block;
	width: 29%;
	margin: 0 1% 0 0;
	font-size: 16px;
	max-width: 100%;
	padding: 8px 15px;
	text-align: center;
	border-radius: 5px;
}
.login_btn a.sign_btn{
	border: 1px solid #242993;
	color: #242993;
}
.login_btn a.submit_btn{
	width: 38%;
	border: 1px solid #242993;
	background: #242993;
	color: #fff;
	margin: 0;
}
.login_btn a.secondary-btn{
	border: 1px solid #ccc;
	color: #ccc;
}
/** inside_page **/
.bg_gray{
	background: #f2f5fa;
}
.inside_page{
	width: 100%;
	padding: 0 0 80px 0;
}
.breadcrumb{
	margin: 0;
}
.breadcrumb a{
	color: #20a8d8;
}
.breadcrumb a:hover{
	text-decoration: underline;
}
.breadcrumb-item.active{
	color: #000;
}
.card-title{
	font-size: 1.8rem;
	margin-bottom: 1rem;
}
.card_tit{
	font-size: 1.3rem;
	margin-bottom: 1rem;
}
.table.white-space-nowrap{
	white-space: nowrap;
}
.form-control, .table th, .table td {
	font-size: 14px;
}
.form-inline .form-group{
	margin: 0 1rem .5rem 0;
}
.form-inline .form-group.short_input input{
	width: 125px;
}
.card-footer p, .card-footer ol li, .card-footer ul li{
	font-size: .95rem;
	line-height: 1.7;
}
.card-footer ul li, .card-footer ol li{
	margin: 0 0 5px 0;
}
.card-footer img{
	max-width: 100%;
}
.card-footer .recommend li{
	font-size: .9rem;
	margin: 0 0 5px 0;
}
.table-th img {
	max-width: 100%;
}
.card-cover {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 2;
	background: rgba(0, 0, 0, 0.5);
}
.card-cover:before{
	width: 100%;
	height: 100%;
	content:"請先完成前面步驟，完成後請聯繫客服";
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
	color: #fff;
	font-family:'Noto Sans TC',"微軟正黑體", Microsoft JhengHei, Arial, helvetica;
}
/** setting **/
.set_box{
	margin: 50px auto;
}
.set{
	margin: 30px 0;
	font-size: 1.1rem;
}
.set .form-group.row{
	justify-content: center;
	min-height: 45px;
}
.user_img{
	display: inline-block;
	border-radius: 100%;
	width: 45px;
	height: 45px;
	overflow: hidden;
}
.user_img img{
	max-width: 100%;
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.user_btn{
	display: inline-flex;
	align-items: center;
	width: 200px;
	padding: 5px;
	font-size: 14px;
	font-weight: 400;
	color: #fff;
	border-radius: 8px;
	justify-content: center;
	-webkit-transition: all .5s;
	transition: all .5s;
}
.user_btn i{
	font-size: 25px;
	margin: 0 10px 0 0;
	font-weight: initial;
}
.fb_btn{
	background: #4267b2;
	color: #fff;
	border: 1px solid #29487d;
}
.fb_btn:hover{
	background: #274072;
}
.line_btn{
	background: #08bf5b;
	color: #fff;
	border: 1px solid #08bf5b;
}
.line_btn:hover{
	background: #079045;
}
.sub-title{
	color: #242993;
	position: relative;
	font-size: 21px;
	font-weight: 600;
	padding: 0 0 15px 0;
	margin: 10px 0 15px 0;
}
.circle{
	border-radius: 100%;
	padding: 1px 5px;
}
.progressbar{
	margin-bottom: 30px;
	overflow: hidden;
	display: flex;
	list-style: none;
	counter-reset: step;
}
/*使用說明*/
.info_nav{
	display: none;
	position: relative;
	color: #fff;
	cursor: pointer;
	min-width: 50px;
	padding: 0.25rem 0;
	left: 1%;
	top: 1%;
	z-index: 1;
}
.info_nav i {
	font-size: 15px;
	display: block;
	text-align: center;
}
.info_nav span{
	font-size: 12px;
	margin: 10px 0 0 0;
}
.info_btn {
	list-style: none;
	display: flex;
	margin: 40px 0;
}
.info_btn li{
	flex:1;
	margin: 0 0.8% 0 0;
}
.info_btn li a {
	display: flex;
	border: 1px solid;
	border-radius: 5px;
	padding: 8px 12px;
	align-items: center;
	justify-content: center;
}
.info_btn li a i {

	margin: 0 10px 0 0;
}
.info_btn li a p b{
	font-weight: bold;
}
.info_btn li a p{
	margin: 0;
}
.info_btn li a:hover, .info_btn li a.active{
	background: #20a8d8;
	color: #fff;
}
.info_btn li a:hover i,.info_btn li a.active i{
	color: #fff;
}
.info_step_block{
	margin: 20px 0;
}
.L{
	width: 220px;
	background: #fff;
	margin: 0 30px 0 0 ;
}
.R{
	width:calc(100% - 250px);
}
.sub_menu{
	box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12);
}
.sub_menu .sub_tit{
	color: #000;
	text-align: left;
	font-size: 16px;
	padding: 8px 7px;
	background: #f3dd23;
}
.sub_menu .sub_tit span{
	display: inline-block;
	font-size: 13px;
	background: #f44235;
	color: #fff;
	padding: 2px 6px;
	border-radius: 50px;
	margin: 0 5px 0 0;
}
.sub_menu ul {
	list-style: none;
}
.sub_menu ul li{
	margin: 0;
}
.sub_menu ul li a{
	display: flex;
	align-items: center;
	color: #333;
	padding: 10px 20px;
	border-bottom: 1px solid #efefef;
}
.sub_menu ul li a:before{
	width: 5px;
	height: 1px;
	content: " ";
	display: inline-block;
	background: #333;
	margin: 0 10px 0 0;
}
.sub_menu ul li a.active{
	background: #595757;
	color: #fff;
}
.sub_menu ul li a.active:before{
	background: #fff;
}
.step_block{
	width: 49%;
	margin: 0 2% 2% 0;
	background: #efefef;
}
.step_block:nth-child(2n) {
	margin: 0 0 2% 0;
}
.step_tit{
	background: #242993;
	color: #fff;
	font-size: 19px;
	padding: 10px 15px;
}
.step_tit span{
	background: #f44235;
	display: inline-block;
	padding: 3px 10px;
	margin: 0 10px 0 0 ;
	font-size: 15px;
	border-radius: 50px;
}
.step_content {
	padding: 30px;
}
.step_content a{
	border-radius: 50px;
	padding: 6px 10px;
	color: #242993;
	width: 150px;
	display: block;
	text-align: center;
	margin: 0 0 0 auto;
	border: 1px solid #242993;
}
.info-title {
	font-size: 25px;
	font-weight: 600;
	margin: 15px 0 25px 0;
	text-align: center;
}
/*progress*/
.fq_tit{
	border-bottom: 1px solid;
	color: #242993;
	font-size: 23px;
	font-weight: bold;
	padding: 0 0 15px 0;
}
.process{
	margin: 50px 0 0 0;
}
.process ul.process_step {
	list-style: none;
	margin: 40px 0 0 0;
}
ul.process_step li {
	position: relative;
	width: 32%;
	padding: 26px 10px 21px;
	margin: 0 2% 0 0;
	text-align: center;
	border-radius: 16px;
	border: solid 2px #d7dce3;
	background-color: #f5f7f9;
}
ul.process_step li:nth-child(3){
	margin: 0;
}
ul.process_step li:after {
	margin-top: -6px;
	position: absolute;
	right: -48px;
	top: 50%;
	width: 71px;
	height: 12px;
	background: url(../images/progress_line.png) no-repeat left top;
	background-size: 71px auto;
	content: "";
	z-index: 10;
}
ul.process_step li:nth-child(3):after{
	display: none;
}
ul.process_step li .step_top {
	font-size: 1.2rem;
	font-weight: bold;
	position: relative;
	padding: 0 0 10px 0;
}
ul.process_step li .step_top:after {
	margin-left: -12px;
	position: absolute;
	transform: translateX(-50%);
	left: 50%;
	bottom: 0;
	width: 24px;
	height: 2px;
	background: #242993;
	content: "";
}
ul.process_step li h3 {
	font-size: 1.3rem;
}
.red_border{
	color: #f00;
	margin: 20px 0;
	text-align: center;
}
.process .button{
	margin: 0 auto 50px auto;
}
/*progressbar*/
.progressbar li {
	position: relative;
	color: #20a8d8;
	flex: 1;
	margin: 20px 0;
	text-align: center;
}
.progressbar li:before {
	content: counter(step);
	counter-increment: step;
	width: 24px;
	height: 24px;
	display: block;
	font-size: 12px;
	color: #20a8d8;
	background: #fff;
	border: 1px solid #20a8d8;
	border-radius: 25px;
	margin: 0 auto 10px auto;
}
.progressbar li:after {
	content: '';
	width: 100%;
	height: 2px;
	background: #fff;
	position: absolute;
	left: -50%;
	top: 9px;
	z-index: -1;
}
.progressbar li:first-child:after {
	content: none;
}
.progressbar li.active:before, .progressbar li.active:after {
	background: #20a8d8;
	color: #fff;
}
/** content **/
.info_title{
	width: 100%;
	margin: 2rem 0;
}
.info_area {
	width: 48%;
	margin: 60px 4% 0 0;
}
.info_area_step .info_area{
	width: 48%;
	margin: 0 4% 0 0;
}
.info_area_step .info_area:nth-child(2){
	margin: 0;
}
.info_area:nth-child(2){
	margin: 60px 0 0 0;
}
.info_area a{
	display: block;
	background: #fff;
	color: #108ccf;
	padding: 30px;
	border-radius: 5px;
	border: 1px solid #108ccf;
	-webkit-transition: all .5s;
	transition: all .5s;
}
.info_area a:hover{
	background:#108ccf;
	color: #fff;
}
.info_area.wrong a{
	color: #f00;
	border: 1px solid #f00;
}
.info_area.wrong a:hover {
	background:#f00;
	color: #fff;
}
.info_area.right a{
	color: #4dbd74;
	border: 1px solid #4dbd74;
}
.info_area.right a:hover {
	background:#4dbd74;
	color: #fff;
}
.info_area.wrong a:hover i ,.info_area.right a:hover i{
	color: #fff;
}
.info_area h2 {
	font-size: 33px;
	font-weight: 600;
	text-align: center;
	margin: 20px 0;
}
.info_area i{
	font-size: 100px;
	margin: 0 auto;
	display: block;
	text-align: center;
}
.info_area ul{
	width: 300px;
	display: block;
	margin: 0 auto;
}
.info_area ul li{
	font-size: 17px;
	font-weight: 500;
	margin: 0 0 10px 0;
}
/*info_help_block*/
.info_help_block{
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}
.info_help_block li{
	width: 32%;
	margin: 2% 2% 0 0;
	background: #fff;
	border-radius: 3px;
	padding: 30px;
}
.info_help_block li:nth-child(3n){
	margin: 2% 0 0 0;
}
.info_help_block li h3{
	font-size: 23px;
	color: #1ba2e6;
	padding-bottom: 12px;
	border-bottom: 1px solid #d7dde0;
}
.info_help_block ul{
	list-style: none;
}
.info_help_block ul li{
	width: 100%;
	padding: 0 0 0 30px;
	margin: 1rem 0;
}
.info_help_block ul li:before {
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 7px;
	height: 7px;
	position: absolute;
	top: 8px;
	left: 0;
	border-style: solid;
	border-color: #1ba2e6;
	border-width: 2px 2px 0 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
.info_help_block a{
	border: 1px solid #1ba2e6;
	display: block;
	text-align: center;
	border-radius: 3px;
	padding: 9px 10px;
	width: 170px;
	margin: 30px auto 0 auto;
}
.info_help_block a:hover{
	background: #1ba2e6;
}
/** info **/
.info_text{
	width: 100%;
	height: 250px;
	margin: 0 auto;
	background:#000 url(../images/ins_banner.jpg) no-repeat top center;
	background-size: cover;
	position: relative;
}
.info_text:after {
	content: " ";
	background: rgb(0,0,0,.5);
	width: 100%;
	height: 250px;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
}
.info_text h1{
	text-align: center;
	font-weight: bold;
	padding: 30px 0;
	margin: 0;
	color: #fff;
	z-index: 2;
}
.info_text p{
	font-size: 19px;
	text-align: center;
	color: #fff;
	z-index: 2;
	margin: 0 0 10px 0;
}
.info_text a{
	color: #f3dd23;
}
.info_block{
	margin: 60px auto;
}
.info_block ul{
	width: 100%;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	margin: 20px 0;
}
.info_block ul li {
	position: relative;
	width: 32%;
	margin: 0 2% 4% 0;
	background: #fff;
	padding: 30px;
	box-shadow: 0 1px 15px rgba(0,0,0,.08);
	border-radius: 8px;
}
.info_block ul li:nth-child(3n){
	margin: 0 0 4% 0;
}
.info_block ul li i {
	position: absolute;
	top: -10%;
	left: 50%;
	transform: translateX(-50%);
	background: #fff;
	border: 1px solid #444;
	border-radius: 100%;
	font-size: 19px;
	text-align: center;
	width: 50px;
	height: 50px;
	line-height: 50px;
}
.info_block ul li h2 {
	font-weight: 600;
	text-align: center;
	margin: 0 0 30px 0;
	padding: 15px 0;
	color: #444;
	border-bottom: 1px solid #444;
}
.info_block ul li p{
	display: flex;
	align-items: center;
}
.info_block ul li p:before{
	content:" ";
	display: inline-block;
	width: 10px;
	height: 1px;
	margin: 0 10px 0 0;
	background: #20a8d8;
}
.info_block ul li p a{
	color: #3841b9;
}
.info_block ul li p:hover{
	position: relative;
	left: 1px ;
	top:1px;
}
.faq_top{
	width: 100%;
	background:#f8f8f8;
}
.check_step{
	padding: 0 0 20px 20px;
}
.check_step li{
	line-height: 170%;
}
/*check_list*/
.check_text{
	margin: 20px 0 30px 0;
}
.check_text p{
	font-size: 17px;
	line-height: 180%;
}
.modal {
	top: 50%;
	left: 50%;
	right: auto;
	bottom: auto;
	transform: translate(-50%, -50%);
	z-index: 9999;
	width: 95%;
}
.modal-title{
	font-size: 17px;
}
.modal-body{
	padding: 1.5rem;
}
.modal-body p{
	font-size: 15px;
	margin: 0;
}
.modal-body img{
	width: 100%;
	max-width: 400px;
	margin: 20px auto;
	display: block;
}
.modal-footer{
	padding: .5rem;
}
/*user*/
.user_block{
	width: 49%;
	display: inline-block;
	background: #fff;
	padding: 30px;
	margin: 2% 2% 0 0;
	border: 1px solid #efefef;
	-webkit-transition: .3s;
	transition: .3s;
}
.user_block:hover{
	background: #f7fcff;
}
.user_block:nth-child(2n){
	margin: 2% 0 0 0;
}
.user_block h4{
	font-weight: bold;
	font-size: 30px;
	text-align: center;
	margin: 0 0 30px 0;
}
.user_block h4 span{
	padding: 0 24px 0 0;
}
.user_block h4 span:after {
	content: " ";
	display: block;
	width: 1px;
	height: 30px;
	background-color: #000;
	position: absolute;
	top: 50%;
	right: 12px;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: background-color .3s ease;
	-o-transition: background-color .3s ease;
	transition: background-color .3s ease;
}
.user_block p {
	font-size: 1.1rem;
	color: #888;
	font-weight: 350;
}
.user_block p a:hover{
	color: #242993;
	text-decoration: underline;
}
.user_block ul{
	padding: 0 0 0 20px;
}
.logo_img{
	text-align: center;
	margin: 0 0 30px 0;
}
.logo_img img{
	max-width: 100%;
	max-height: 70px;
}
.user_block .btn, .m_block .btn{
	width: 100%;
	text-align: center;
}
.user_block .btn .button, .m_block .btn .button {
	display: inline-block;
	background: #fff;
	color: #242993;
	border: 1px solid #242993;
	font-weight: 500;
}
.user_block .btn .button:hover, .m_block .btn .button:hover{
	background: #242993;
	color: #fff;
}
.user_block .fadeIn, .m_block .fadeIn{
	-webkit-transform: translateY(0px);
	 transform: translateY(0px);
}
.m_block{
	margin: 60px 0 0 0;
	font-size: 17px;
}
.m_block .no, .m_block .have{
	width: 48%;
	margin: 0 4% 0 0;
	padding: 30px;
	border:1px solid #242993;
	border-radius: 5px;
	background:#fff;
	-webkit-transition: .3s;
	transition: .3s;
}
.m_block .no:hover, .m_block .have:hover{
	background: #f9f9f9;
}
.m_block .have{
	margin: 0;
}
.m_block a {
	color: #666;
}
.m_block a:hover{
	color: #666;
}
.m_block h2{
	font-weight: 600;
	font-size: 30px;
	text-align: center;
	color: #242993;
	margin: 0 0 20px 0;
}
.m_block ul {
	padding: 0 0 5px 22px;
}
.m_block a ul li {
	color: #108ccf;
	font-size: 16px;
}
/*step*/
.step {
	counter-reset: flag;
	padding: 0;
	margin: 30px 0;
}
.step ul {
	width: 100%;
	display: flex;
	position: relative;
	list-style: none;
	margin: -24px 0 0 0;
}
.step ul li{
	width: 14%;
}
.step.moeaca1_1 ul li{
	width: 20%;
}
.step.einvoice ul li{
	width: 16.6%;
}
.step.einvoice2 ul li{
	width: 33.3%;
}
.step.invoice ul li{
	width: 25%;
}
.step.width50 ul li{
	width: 50%;
}
.step ul li a{
	display: block;
	color: #3841b9;
}
.step ul li a b {
	display: inline-block;
	text-align: center;
	border: 2px solid;
	line-height: 21px;
	font-size: 17px;
	font-weight: 400;
	padding: 5px 10px;
	margin: 0 10px 0 0;
	background: #fff;
}
.step ul li a.active b{
	background: #3841b9;
	color: #fff;
}
.step ul li a p{
	margin: 10px 0;
}
.progress{
	height: 5px;
	z-index: -1;
	background:#ccc;
}
.progress-bar{
	background: #3841b9;
}
/*step_link*/
.step_link{
	display: flex;
	width: 100%;
}
.step_link a{
	display: inline-block;
	min-width: 300px;
	max-width: 100%;
	color: #3841b9;
	padding: 7px 10px;
	text-align: center;
	border: 1px solid #3841b9;
	border-radius: 5px;
}
.step_link a:hover, .step_link a.active{
	background:#3841b9;
	color: #fff;
}
/*rootwizard*/
#rootwizard .pager {
	padding: 0 15px;
	margin: 20px 0;
	text-align: center;
	list-style: none;
	clear: both;
}
#rootwizard .pager li {
	display: inline;
}
#rootwizard .pager .disabled>a, #rootwizard .pager .disabled>a:hover, #rootwizard .pager .disabled>a:focus, #rootwizard .pager .disabled>span {
	color: #777;
	cursor: not-allowed;
	background-color: #fff;
}
#rootwizard .pager .previous>a, #rootwizard .pager .previous>span {
	float: left;
}
#rootwizard .pager li>a, #rootwizard .pager li>span {
	display: inline-block;
	padding: 5px 14px;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 15px;
}
#rootwizard .pager .next>a, #rootwizard .pager .next>span {
	float: right;
}
#rootwizard  .pager li > a:hover, #rootwizard  .pager li > a:focus {
	text-decoration: none;
	background: #3841b9;
	color: #fff;
}
.tab-content{
	background: #fff;
	border: 1px solid #c8ced3;
}
.tab-pane{
	width: 100%;
}
 /* tab */
.tab-group {
	width: 100%;
	position: relative;
	margin: 20px 0 0 0;
}
.tab-group section {
	display: none;
	height: 0;
	padding: 30px;
	overflow: hidden;
	background: #fff;
	border: 1px solid #eee;
	border-radius: 0 0 10px 10px;
	transition: opacity 0.4s ease, height 0.4s ease;
}
.tab-group section.active {
	display: block;
	height: auto;
	overflow: visible;
}
.tab-group section img{
	max-width: 100%;
}
.tab-group section p {
	line-height: 160%;
	margin: 0 0 10px 0;
}
.tab-nav {
	list-style: none;
	padding: 0;
	height: 50px;
	overflow: hidden;
}
.tab-nav li {
	display: inline-block;
}
.tab-nav li a {
	top: 1px;
	position: relative;
	display: block;
	float: left;
	border-radius: 10px 10px 0 0;
	background: #efefef;
	line-height: 2em;
	padding: 5px 20px;
	width: 300px;
	text-align: center;
	text-decoration: none;
	color: grey;
	margin-top: .5em;
	margin-right: 1px;
	transition: background .2s ease, line-height .2s ease, margin .2s ease;
}
.tab-nav li.active a {
	background: #242993;
	color: white;
	line-height: 2.5em;
	margin-top: 0;
}
.query_table{
	width: 100%;
	max-width:600px;
	text-align: center;
}
.query_table a:hover{
	color: #20a8d8;
	text-decoration: underline;
}
.app_img{
	padding: 0 0 0 22px;
	align-items: flex-start;
}
.app_img p{
	font-size: 15px;
}
.tab-group section .app_img img{
	max-width: 300px;
}
/*ntbt 受理機關*/
ul.ntbt {
	display: flex;
	list-style: none;
	margin: 20px 0;
	padding: 0 0 0 30px;
}
ul.ntbt li{
	width: 20%;
	padding: 1%;
}
ul.ntbt li a{
	color: #fff;
	display: block;
	text-align: center;
	padding: 6px 15px;
	background: #20a8d8;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
}
ul.ntbt li a:hover{
	background: #1b8eb7;
	color: #fff;
}
/*info*/
.info_tit{
	font-weight: bold;
	text-align: center;
	font-size: 29px;
	margin: 30px 0;
}
.file_content .info_tit img {
	max-width: 40px;
	margin: 0 15px 0 0;
	display: inline-block;
}
.tab-pane h2, .tab-pane h4{
	margin: 20px 0;
}
.tab-pane p{
	font-size: 17px;
	line-height: 170%;
}
.tab-pane ul, .tab-pane ol{
	padding: 0 0 0 30px;
}
.tab-pane img {
	position: relative;
	min-width: 300px;
	width: 90%;
	max-width: 700px;
	margin: 0 0 2rem 0;
}
.tab-pane a{
	display: inline-block;
}
.tab-pane a img{
	cursor: zoom-in;
}
.tab-pane a:hover{
	color: #20a8d8;
	text-decoration: underline;
}
.tab-pane a.btn:hover{
	color: #fff;
}
.tab-pane .flex{
	flex-wrap: wrap;
	align-items: flex-start;
}
.half{
	display: inline-block;
	width: 49%;
	padding: 1%;
	background: #fff;
	margin: 0 2% 2% 0;
	font-size: 0;
}
.half:nth-child(2n){
	margin: 0 0 2% 0;
}
.half h2 {
	font-size: 25px;
}
.half span{
	display: inline-block;
	margin: 5px;
	text-align: center;
}
.intro, .apply, .first_intro ,.pass, .e_login{
	color: #fff;
	padding: 0.3rem 1rem;
	border-radius: 10px;
	margin: 0 5px;
}
.first_intro{
	background: #3bc0d9;
}
.intro{
	background: #f09015;
}
.apply{
	background: #c85461;
}
.pass{
	background: #27bc85;
}
.e_login{
	background: #009fb8;
}
.gray_line{
	width: 100%;
	height: 1px;
	background: #efefef;
	margin: 0 0 20px 0;
}
.step_memo{
	background: #efefef;
	padding: 30px;
	margin: 20px 0 0 0;
}
.step_memo ul{
	padding: 0 0 0 30px;
}
.step_memo ul li{
	margin: 0 0 5px 0;
}
/*-----nav-tabs------*/
.nav-tabs .nav-link{
	padding: 0.6em 1.18em;
}
/*-----table------*/
.table-th-right th{
	text-align: right;
}
.table-gray th{
	background: #efefef;
}
.table.width100 th{
	width: 116px;
	min-width: 116px;
}
.table.primary th{
	background: #f0f9fc;
}
.table.success th{
	background: #f0fff5;
}
.table_textarea{
	width: 100%;
	margin: 10px 0;
	border:1px solid #ccc;
	padding: 5px 10px;
	resize:none;
}
.table_download .btn{
	float: right;
}
.table_download .text-center .btn{
	float: none;
}
.bg_td{
	background: #f1f1f1;
}
.bg_td input{
	background: transparent;
}
/*edit*/
.add_input {
	width: 79%;
}
/*file_content*/
.file_content{
	margin: 20px 0;
	padding: 30px;
	background: #fff;
	border: 1px solid #c8ced3;
	width: 100%;
}
.file_content h2{
	margin: 20px 0;
}
.file_content p{
	font-size: 17px;
	line-height: 170%;
}
.file_content img{
	width: 700px;
	max-width: 100%;
	display: block;
	margin: 0 auto;
}
.file_content a:hover{
	color: #20a8d8;
	text-decoration: underline;
}
.file_content ul {
	width: 50%;
	display: inline-block;
	list-style: disc;
	padding: 20px 30px;
}
.file_content ul li{
	display: flex;
	font-size: 1rem;
	margin: 0 0 10px 0;
}
.file_content .line{
	align-items: flex-start;
}
.file_content .line_img{
	margin: 0 10px 0 0;
}
.file_content .line_img img,  .line_img img{
	width: 80px;
	margin: 0;
	max-width: 100%;
}
.file_content .line a{
	width: 100%;
}
.map{
	width: 50%;
	padding: 30px;
}
.map iframe{
	width: 100%;
	height: 330px;
}
.file_content .service_banner img{
	width: 100%;
}
.service_banner{
	position: relative;
}
.service_banner p {
	width: 90%;
	text-align: center;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 1;
	color: #fff;
	transform: translate(-50%, -50%);
	font-size: 1.5rem;
	font-weight: 600;
}
.half_service{
	position: relative;
	width: 50%;
}
/*-----faq------*/
.accordion .item{
	background: #fff;
	margin: 0 0 20px 0;
	box-shadow: 0 1px 1px 0 rgba(60,75,100,.14), 0 2px 1px -1px rgba(60,75,100,.12), 0 1px 3px 0 rgba(60,75,100,.2);
}
.faq_tit a {
	display: block;
	font-size: 19px;
	color: #20a8d8;
	font-weight: bold;
}

.track_R .accordion-collapse.collapse:before {
	content: "";
	color: #f9f9f9;
}
.faq_tit a:before , .collapse:before{
	content: "Q：";
	font-weight: bold;
	display: inline-block;
}
.collapse:before , .collapsing:before{
	font-size: 19px;
	display: block;
	content: "A：";
	margin: 0 0 10px 0;
}
.collapse, .faq_tit, .collapsing{
	padding: 20px;
}
.collapse, .collapsing{
	display: flex;
}
.collapse, .collapsing{
	background: #f9f9f9;
	border-top: 2px solid #20a8d8;
	-webkit-transition: all .1s;
	-o-transition: all .1s;
	-ms-transition: all .1s;
	transition: all .1s;
}
.collapse div, .collapsing div{
	flex: 1;
}
.collapse p , .collapsing p{
	margin: 0 0 5px 0;
}
.collapse ol, .collapse ul{
	padding: 10px 22px;
}
.collapse ol li, .collapse ul li{
	margin: 0 0 5px 0;
}
.faq_more {
	width: 300px;
	display: inline-block;
	margin: 30px 0 0 0;
}
.faq_more:hover{
	background: #242993;
	color: #fff;
}
.faq_catagory{
	padding: 0px;
	margin: 40px 0;
}
.faq_catagory ul{
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: center;
}
.faq_catagory ul li {
	position: relative;
	width: 24%;
	margin: 0 2% 2% 0;
	font-size: 19px;
	padding: 30px;
	background: #fff;
	box-shadow: 0 20px 60px -30px rgba(0,0,0,.1);
}
.faq_catagory ul li:nth-child(4n){
	margin: 0 0 2% 0;
}
.faq_catagory ul li h3{
	font-size: 22px;
	padding: 0 0 10px 0;
	margin: 0 0 20px 0;
	border-bottom: 1px solid #20a8d8;
}
.faq_catagory ul li p{
	font-size: 14px;
	line-height: 160%;
	color: #666;
	text-align: left;
}
.faq_catagory ul li a{
	width: 100%;
	display: block;
	color: #20a8d8;
	background: #fff;
	border-radius: 4px;
	text-align: center;
}
.faq_catagory ul li a i{
	display: block;
	font-size: 35px;
	border-radius: 100%;
	color: #20a8d8;
	margin: 0 auto 20px auto;
}
/*.faq_catagory ul li a:hover, .faq_catagory ul li a.selected{
	background: #20a8d8;
	color: #fff;
}
.faq_catagory ul li a:hover i, .faq_catagory ul li a.selected i{
	color: #fff;
}*/
.accordion h1{
	font-size: 21px;
	font-weight: bold;
	padding: 0 0 0 10px;
	margin: 0 0 30px 0;
	border-left: 4px solid #242993;
}
.faq_search {
	background: #fff;
	padding: 30px;
	margin: 30px 0;
}
.faq_input{
	position: relative;
	max-width: 600px;
	margin: 0 auto;
}
.faq_input i {
	position: absolute;
	font-size: 19px;
	color: #666;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.faq_input input{
	padding: 10px 30px;
}
/*return*/
.quantity {
	border: 1px solid;
	line-height: 1;
}
.quantity span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 3px;
	font-size: 23px;
	line-height: 1;
	cursor: pointer;
}
.less{
	border-right: 1px solid #000;
}
.plus{
	border-left: 1px solid #000;
}
input.number {
	flex: 1;
	border: 0;
	border-radius: 0;
	text-align: center;
}
.product{
	background: #fff;
	border-radius: 4px;
	padding: 30px;
}
.product a h2{
	font-size: 19px;
	height: 88px;
	overflow: hidden;
	color: #000;
	margin: 15px 0;
}
.product a .price{
	color: #f00;
	font-size: 23px;
	font-weight: bold;
}
.pd_img{
	position: relative;
	width: 100%;
	overflow: hidden;
}
.pd_img img{
	max-width: 100%;
}
.product a:hover img{
	opacity: .8;
}
/*cart*/
.cart_step{
	width: 100%;
	margin: 0 0 30px 0;
}
.cart_step ul{
	position: relative;
	padding: 0;
}
.cart_step ul:before {
	position: absolute;
	content: '';
	height: 1px;
	background: #efefef;
	top: 30%;
	left: 15%;
	right: 15%;
	z-index: 1;
}
.cart_step li {
	position: relative;
	flex: 1;
	display: block;
	font-size: 15px;
	text-align: center;
	align-items: center;
	justify-content: center;
	z-index: 1;
}
.cart_step li:after {
	content: '';
	width: 100%;
	height: 1px;
	background: #efefef;
	position: absolute;
	top: 26%;
	left: 50%;
	z-index: 1;
	display: none;
}
.cart_step li.active::after {
	display: block;
	background: #666;
}
.cart_step li:last-child.active::after{
	display: none;
}
.cart_step li span {
	position: relative;
	display: flex;
	color: #fff;
	width: 45px;
	height: 45px;
	font-size: 15px;
	margin: 0 auto;
	border-radius: 100%;
	align-items: center;
	justify-content: center;
	background: #efefef;
	z-index: 2;
}
.cart_step li.active span{
	color: #fff;
	background: #666
}
.cart_step li p{
	color: #ccc;
	font-size: 19px;
	margin: 10px 0;
}
.cart_step li.active p{
	color: #000;
	font-weight: bold;
}
.cart_step li.active p span{
	background: #666;
	color: #fff;
}
/*購物車*/
.cart_area{
	width: 100%;
}
.cart_table{
	width: 100%;
	display: table;
}
.table_row{
	position: relative;
	display: table-row;
	padding: 10px 0;
}
.table_row:nth-child(odd) {
	background: #fcfafa;
}
.table_row.th:nth-child(odd){
	background:none;
}
.cell.th{
	font-size: 17px;
	border-top: 1px solid #888;
	border-bottom: 1px solid #888;
}
.cell{
	text-align: center;
	display: table-cell;
	padding: 12px 10px;
}
.cell.left{
	text-align: left;
}
.cell.top{
	vertical-align: top;
}
.cart .table .row.th{
	background: #666;
	color: #fff;
}
.cell.img{
	width: 140px;
}
.cell.img img{
	max-width: 100%;
}
.cell.name {
	text-align: left;
	width: 30%;
}
.cell.name a {
	font-size: 19px;
	color: #2a2a2a;
}
.cell.num{
	width: 15%;
}
.cell .quantity input{
	width: 80px;
}
.cell.select{
	width: 8%;

}
.cell.delete a{
	color: #f00;
	font-size: 17px;
}
.cart_msg{
	text-align: left;
	margin: 0 0 10px 0;
}
.total{
	padding: 15px;
	border-top: 1px solid #efefef;
}
.total li , .pay .total li{
	display: block;
	margin: 0 0 10px 0;
	text-align: right;
}
.total li span {
	min-width: 90px;
	color: #f00;
	display: inline-block;
	font-size: 21px;
}
.total_memo{
	width: 100%;
	padding: 15px;
	background: #efefef;
}
.total_memo a{
	text-decoration: underline;
}
.total_memo p{
	line-height: 170%;
}
.total_memo ul {
	list-style: disc;
	padding: 20px 0 10px 30px;
}
.total_memo ul li{
	margin: 0 0 10px 0;
}
.total_memo h3{
	margin: 10px 0;
}
/*-----pager------*/
.total {
	margin: 15px 0;
}

/* system_alert_list_new */
.button_all_div {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	align-content: center;
	margin: 0 0 -15px 0;
}
.button_all_div01 {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	margin: 5px;
}
.edit_div ,.add_div ,.trash_div {
	display: flex;
	justify-content: flex-end;
	margin: 10px;
}
.check_div,.cancel_div {
	display: flex;
	justify-content: center;
	margin: 10px;
}
.finger {
	cursor: pointer;
}
.add_btn,.edit_btn,.trash_btn {
	border-radius: 50%;
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.check_btn,.cancel_btn {
	border-radius: 10px;
	width: 125px;
	height: 55px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.main_box {
	padding: 10px;
}
.mail_info {
	display: flex;
	align-items: center;
	padding: 0px 0 15px 0;
	border-bottom: 1px solid #efefef;
}
.mail_info h6 ,.email_set_show h6{
	width: 15%;
}
.mail_info_txt p {
	font-size: 14px;
	margin: 0;
}
.email_set_show{
	display: flex;
	align-items: center;
	margin: 10px 0;
	padding: 10px 0 0 0;
}
.email_set_box {
	width: 100%;
	padding: 20px;
	border-radius: 25px;
	border: 1px solid #efefef;
	box-shadow: 1px 2px #cdcdcd;
}

@media screen and (max-width:1600px) {
	.col-form-label {
		font-size: .9rem;
		padding: 0 5px;
	}
}
@media screen and (max-width:1500px) {
	.col-form-label {
		font-size: .9rem;
		padding: 0 4px;
	}
}
@media screen and (max-width:1440px) {
	.col-form-label{
		padding: 0 2px;
		font-size: 14px;
	}
	.link nav ul li a{
		margin: 0;
	}
	.index_banner_txt h2 {
		font-size: 43px;
		margin: -30px 0 21px 0;
	}
	.index_banner_txt h2 span {
		font-size: 87px;
	}
	.form-control, .table th, .table td {
		font-size: 13px;
	}
}
@media screen and (max-width:1415px) {
	.col-form-label {
		font-size: 14px;
		padding: 0 1px;
	}
}
@media screen and (max-width:1400px) {
	.table-responsive-xxl{
		display: block;
		width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		-ms-overflow-style: -ms-autohiding-scrollbar;
	}
	.table-responsive-xxl th, .table-responsive-xxl td {
		white-space: nowrap;
	}
	.main .container-fluid{
		padding: 0 20px;
	}
	.link nav ul li a{
		font-size: 17px;
		padding: 6px 12px;
	}
	.col-form-label{
		font-size: .80rem;
		padding: 0;
	}
	/*index_banner*/
	.index_banner{
		height: 700px;
	}
	.index_banner_txt {
		width: 600px;
		padding: 30px;
		left: 2%;
	}
}
@media screen and (max-width:1366px) {
	.index_banner_txt h2 {
		font-size: 40px;
		margin: -30px 0 21px 0;
	}
}
@media screen and (max-width:1280px) {
	.banner .bg img{
		max-width: 1500px;
	}
	.inside {
		width: 100%;
	}
	.logo a {
		width: 170px;
		height: 80px;
	}
	.link nav ul li a{
		padding: 6px 15px;
	}
	.machine {
		width: 40%;
	}
	.cloud {
		right: 0;
		top: 18%;
		width: 14%;
	}
	footer img {
		width: 220px;
	}
	.info p {
		margin: 0 0 5px 0;
	}
	.dowload p {
		width: 40%;
		padding: 0;
	}
	.col-form-label {
		font-size: .8rem;
	}
}
@media screen and (max-width:1259px) {
	.col-form-label {
		font-size: .75rem;
	}
}
@media screen and (max-width:1200px) {
	.logo a {
		width: 130px;
		height: 70px;
	}
	.link nav ul li a {
		padding: 6px 10px;
		font-size: 16px;
		margin: 0 0 0 12px;
	}
	.login_user,.link nav ul li a.logout{
		font-size: 14px;
	}
	.link nav ul li a.logout{
		margin: 0 10px 0;
		padding: 6px 10px;
		line-height: 20px;
	}
}
@media screen and (max-width:1080px) {
	.link nav ul li a {
		padding: 6px 8px;
		font-size: 15px;
		margin: 0 0 0 5px;
	}
	.product {
		padding: 10px;
	}
}
@media screen and (max-width:1024px) {
	.logo a {
		width: 120px;
		height: 80px;
	}
	.padding15{
		padding: 0 15px;
	}
	/*menu*/
	header .link {
		margin: 0;
		padding: 0;
	}
	.link nav ul li a {
		padding: 6px;
		font-size: 14px;
		margin: 0 0 0 5px;
	}
	/*banner*/
	.banner {
		margin: 0;
	}
	.banner .bg img{
		max-width: 1300px;
	}
	.b_text h2 {
		font-size: 33px;
	}
	.b_text p {
		font-size: 17px;
	}
	.first ul li{
		margin: 0 1%;
	}
	.first ul li .first_text h1{
		font-size: 19px;
	}
	.service ul li h3 {
		font-size: 17px;
		margin: 0 0 4% 0;
	}
	/*index_banner*/
	.computer {
		width: 35%;
	}
	.machine_s {
		width: 25%;
	}
	.index_banner_txt {
		width: 475px;
	}
	.index_banner_txt h2 {
		font-size: 31px;
		margin: 0 0 15px 0;
	}
	.index_banner_txt h2 span {
		font-size: 65px;
	}
	.index_banner_txt h4 span {
		font-size: 17px;
	}
	.index_banner_txt p {
		font-size: 17px;
	}
	/*login*/
	.login_box{
		padding: 25px;
	}
	.ins_banner {
		margin: 80px 0 0 0;
	}
	.col-form-label{
		font-size: 15px;
		padding: 0 2px;
	}
	/*plan*/
	.plan{
		padding: 50px 30px;
	}
	/*info*/
	.info_text p{
		font-size: 16px;
	}
	.info_item li span {
		font-size: 35px;
	}
	.info_item li p {
		font-size: 17px;
	}
	.half {
		height: 370px;
	}
	.info_area{
		width: 50%;
		padding: 0 15px;
		margin: 20px 0 0 0;
	}
	.info_area:nth-child(2) {
		margin: 20px 0 0 0;
	}
	.info_area h2 {
		font-size: 31px;
	}
	.info_area_step {
		padding: 0 15px;
	}
	.info_area.wrong, .info_area.right{
		width: 49%;
		margin: 0 2% 0 0;
		padding: 0;
	}
	.info_area.right, .info_area.right:nth-child(2){
		width: 49%;
		margin: 0;
	}
	.m_block{
		margin: 15px;
	}
	.m_block ul{
		margin: 0 0 1rem 0;
	}
	.m_block h2 {
		font-size: 23px;
	}
	.m_block p, .m_block a ul li{
		font-size: 15px;
	}
	.m_block a ul li {
		color: #108ccf;
	}
	.table-responsive-xl{
		position: relative;
	}
	/*table*/
	.table-responsive-xl::-webkit-scrollbar {
		width: 5px;
		background:#efefef;
	}
	.table-responsive-xl::-webkit-scrollbar-thumb {
		background-color: rgba(0,0,0,.3);
	}
	.product a h2 {
		font-size: 18px;
		height: 45px;
		overflow: hidden;
		color: #000;
		margin: 15px 0;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		white-space: normal;
	}
	.col-md-2 {
		flex: auto;
		max-width: 25%;
	}
}
@media screen and (max-width: 834px) {
	.logo a {
		width: 90px;
		height: 55px;
	}
	.link nav ul li a {
		padding: 5px;
		font-size: 12px;
		margin: 0 0 0 5px;
	}
	.login_user, .link nav ul li a.logout {
		font-size: 12px;
	}
	.login_user{
		margin: 2px 5px 0 0;
	}
}
@media screen and (max-width: 820px) {
	header.app-header{
		z-index: 9999;
	}
	.header-fixed .app-body {
		margin: 50px 0 0 0;
	}
	.sidebar{
		height: calc(100vh - 50px);
	}
	button.navbar-toggler {
		position: relative;
		left: 5px;
		top: 1%;
		z-index: 1;
		min-width: 58px;
	}
	button.navbar-toggler i{
		font-size: 12px;
		display: block;
		text-align: center;
	}
	button.navbar-toggler span{
		font-size: 12px;
		margin: 10px 0 0 0;
	}
	/*header*/
	.logo {
		text-align: left;
		padding: 0 0 0 10px;
	}
	.logo a {
		width: 70px;
		height: 50px;
		display: inline-block;
	}
	.login_user span{
		margin: 0 5px;
	}
	.login_user b {
		max-width: 45px;
		overflow: hidden;
		display: block;
	}
	.link {
		display: flex;
		padding: 0 10px 0 0;
		margin: 0;
	}
	.link nav ul li a {
		font-size: 12px;
		margin: 0;
		padding: 6px 8px;
	}
	.link a {
		font-size: 15px;
		margin: 0;
	}
	.login_user {
		margin: 0 5px 0 0;
		font-size: 12px;
	}
	.link nav ul li a.logout {
		padding: 6px;
		margin: 0 5px;
		font-size: 12px;
		line-height: 1;
		display: inline-block;
	}
	/*index*/
	/*banner*/
	.banner .bg img{
		width: 1000px;
	}
	.b_text {
		width: 49%;
		top: 42%;
	}
	.machine {
		right: 12%;
	}
	.b_text h2 {
		font-size: 21px;
	}
	.b_text p{
		margin: 10px 0;
		font-size: 15px;
	}
	/*index_banner*/
	.index_banner {
		height: 500px;
	}
	.support img {
		margin: 20px 25px 20px 0;
		max-width: 110px;
	}
	/*service*/
	.service ul li h3 {
		font-size: 17px;
		margin: 0 0 2% 0;
		line-height: 150%;
	}
	.first{
		padding: 30px 15px;
	}
	.first ul{
		flex-wrap: wrap;
	}
	.first ul li {
		width: 29.3%;
	}
	.dowload p {
		width: 60%;
	}
	.button{
		width: 180px;
		padding: 10px;
		font-size: 15px;
	}
	/*plan*/
	.plan_memo {
		padding: 30px 20px 0 40px;
	}
	.plan_text, .plan_pic {
		width: 100%;
	}
	.advantage ul li{
		width: 49%;
		margin: 0 2% 0 0;
	}
	.advantage ul li:nth-child(2n){
		margin: 0 0 2% 0;
	}
	/*login*/
	.set_box .form-group.row{
		flex-wrap: nowrap
	}
	.login_box p, .set_box p {
		font-size: 15px;
	}
	/*info*/
	.info_nav{
		display: block;
	}
	.L {
		display: none;
		position: fixed;
		z-index: 1019;
		height: 95%;
		overflow-y: scroll;
		top: 50px;
		left: 0;
		padding: 0 0 30px 0;
	}
	.L.block{
		display: block;
	}
	.L.block .sub_menu{
		box-shadow: none;
	}
	.R {
		width: 100%;
	}
	.step_content {
		padding: 30px 21px;
	}
	.info_btn li a{
		padding: 6px 13px;
	}
	.info_btn li a i {
		margin: 0 4px 0 0;
		font-size: 22px;
	}
	.info_btn li a p b {
		display: block;
	}
	/*layout*/
	.step ul li a p{
		font-size: 13px;
	}
	.inside.flex.wrap.mt-3{
		margin: 0;
	}
	.inside_page{
		margin: 0;
	}
	.info_item li {
		width: 100%;
		height: auto;
		margin: 0;
	}
	.half ,.half:nth-child(even){
		height: auto;
		width: 100%;
	}
	.half:last-child {
		margin: 0 0 20px 0;
	}
	/*info*/
	.info_text{
		height: 220px;
		padding: 0 15px;
	}
	.info_text:after{
		height: 220px;
	}
	.info_text p{
		font-size: 15px;
		margin: 0 0 5px 0;
	}
	.info_area, .info_area:nth-child(2){
		width: 50%;
		margin: 20px 0 0 0;
	}
	.info_area h2 {
		font-size: 21px;
	}
	.info_help_block li h3{
		font-size: 22px;
	}
	/*footer*/
	.app-footer{
		text-align: center;
	}
	/*user*/
	.user_block ,.user_block:nth-child(2n){
		width: 100%;
		padding: 15px;
		margin: 4% 0 0 0;
	}
	.login_page {
		margin: 50px 0 0 0;
	}
	.m_block .no, .m_block .have {
		width: 100%;
		margin: 0 0 4% 0;
	}
	.card-body {
		padding: 1rem;
	}
	.card-footer p, .card-footer ol li, .card-footer ul li {
		font-size: 14px;
		line-height: 1.7;
	}
	.col-form-label{
		padding: 0 5px;
		text-align: right !important;
	}
	.file_content ul{
		width: 100%;
		padding: 30px;
	}
	.map{
		width: 100%;
		padding: 15px;
	}
	.service_banner p{
		font-size: 19px;
	}
	.dowload.plan_27001{
		height: 450px;
	}
	.faq_catagory ul {
		flex-wrap: wrap;
	}
	.faq_catagory ul li{
		width: 49%;
		margin: 0 2% 2% 0;
	}
	.faq_catagory ul li:nth-child(even){
		margin: 0 0 2% 0;
	}
	.cart_step li span{
		width: 35px;
		height: 35px;
		font-size: 17px;
	}
	/*cart*/
	.cart_step li p{
		font-size: 15px;
	}
	.cart_area .table_row.th{
		display: none;
	}
	.cart_area .table_row {
		position: relative;
		display: block;
		margin: 10px 0;
		clear: both;
	}
	.cart_area .cell {
		display: flex;
		line-height: 150%;
		padding: 0 0 10px 0;
		text-align: left;
		font-size: 15px;
	}
	.cart_area .cell.img {
		width: 35%;
		margin: 50px 5px 0 10px;
		float: left;
	}
	.cart_area .cell.img img {
		width: 100%;
	}
	.cart_area .cell.name {
		position: absolute;
		top: 0;
		width: 100%;
		height: 52px;
		padding: 10px;
		overflow: hidden;
	}
	.cart_area .cell.name a {
		font-size: 17px;
		font-weight: bold;
		height: 22px;
		overflow: hidden;
	}
	.cart_area .cell.data {
		width: 60%;
		padding: 3px 5px;
	}
	.cart_area .cell.data:before {
		text-align: right;
		content: attr(data-th) "：";
		font-weight: bold;
		width: 60px;
		min-width: auto;
		display: inline-block;
		color: #2a2a2a;
		font-size: 12px;
		margin: 0 10px 0 0;
	}
	.cart_area .cell.num {
		margin: 50px 0 0 0;
	}
	.cart_area .cell.delete {
		width: 100%;
		padding: 0 10px 10px 0;
		text-align: right;
		display: block;
	}
	.total{
		padding: 15px;
		border: 0;
		border-top: 1px solid #efefef;
	}
	.total_memo{
		font-size: 16px;
		line-height: 170%;
	}
	.total_memo ul li{
		font-size: 15px;
	}
	.total_memo p.text-center{
		text-align: left;
	}
	.quantity span, .cell .quantity input {
		height: 33px;
	}
	.cell .quantity input{
		width: 55px;
	}
	.noorder{
		margin: 0;
	}
	.cart_list .cell.img{
		width: 13%;
	}
	.cart_list .cell.num {
		margin: 40px 0 0 0;
	}
}
@media screen and (max-width: 768px) {
	.mail_info h6, .email_set_show h6 {
		width: 20%;
	}
	.col-md-2 {
		flex: auto;
		max-width: 100%;
	}

	/* Tabels */
	.table-rwd {
		min-width: 100%;
	}

	.table-light {
		display: none !important;
	}

	.table-rwd tr {
		display: block;
		border: 1px solid #ddd;
		margin-top: 5px;
	}

	.table-rwd td {
		text-align: left;
		font-size: 15px;
		overflow: hidden;
		width: 100%;
		display: block;
	}

	.table-rwd td:before {
		content: attr(data-th) " : ";
		display: inline-block;
		text-transform: uppercase;
		font-weight: bold;
		margin-right: 10px;
	}

	/*當RWD的時候.table-bordered 會有兩條線，所以針對.table-bordered去做修正*/
	.table-rwd.table-bordered td,.table-rwd.table-bordered th,.table-rwd.table-bordered {
			border: 0;
	}

	.pc_show_tadle {
		display: none;
	}
	.mb_show_table {
		display: flex;
		border-bottom: 1px solid #f0f3f5;
	}

	/* vendor_list_mb_show */
	.status_vendor_list_mb_show {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 10px;
		width: 130px;
	}

	.vendor_list_mb_show01 {
		display: flex;
		flex-direction: column;
		padding: 10px 5px;
		width: 65%;
	}

	.vendor_list_mb_show02 {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 70px;
	}
	.card-body .mb_show_table:nth-child(2n) {
		background-color: #dce5f74e;
	}
}
@media screen and (max-width: 767px) {
	/*header*/
	button.navbar-toggler{
		left: 2%;
	}
	.logo.flex1{
		flex: none;
		display: inline-block;
		margin: 0 auto;
		padding: 0;
	}
	.logo a {
		width: 110px;
		height: 50px;
	}
	.link a {
		padding: 6px 10px;
		margin: 0 0 0 15px;
		font-size: 15px;
	}
	button.navbar-toggler{
		position: absolute;
	}
	/*nav*/
	#hamburger {
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.hamburger:hover {
		cursor: pointer;
	}
	.hamburger .line {
		width: 28px;
		height: 2px;
		background-color: #ecf0f1;
		display: block;
		margin: 6px auto;
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	#hamburger.is-active {
		animation: smallbig 0.6s forwards;
	}
	@keyframes smallbig{
		0%, 100%{
			-webkit-transform: scale(1);
			-ms-transform: scale(1);
			-o-transform: scale(1);
			transform: scale(1);
		}
		50%{
			-webkit-transform: scale(0);
			-ms-transform: scale(0);
			-o-transform: scale(0);
			transform: scale(0);
		}
	}
	#hamburger.is-active .line:nth-child(1),  #hamburger.is-active .line:nth-child(2), #hamburger.is-active .line:nth-child(3){
		-webkit-transition-delay: 0.2s;
		-o-transition-delay: 0.2s;
		transition-delay: 0.2s;
	}
	#hamburger.is-active .line:nth-child(2){
		opacity: 0;
	}
	#hamburger.is-active .line:nth-child(1){
		-webkit-transform: translateY(13px) rotate(45deg);
		-ms-transform: translateY(13px) rotate(45deg);
		-o-transform: translateY(13px) rotate(45deg);
		transform: translateY(13px) rotate(45deg);
	}
	#hamburger.is-active .line:nth-child(3){
		-webkit-transform: translateY(-3px) rotate(-45deg);
		-ms-transform: translateY(-3px) rotate(-45deg);
		-o-transform: translateY(-3px) rotate(-45deg);
		transform: translateY(-3px) rotate(-45deg);
	}
	#trigger-overlay {
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		top: 0;
		right: 2%;
		z-index: 999999;
		color: #fff;
		width: 50px;
		height: 50px;
		padding: 0;
	}
	.overlay {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background: rgba(56, 65, 185, 1)
	}
	.overlay ul {
		position: relative;
		list-style: none;
		display: block;
		padding: 0 15px;
		margin: 0 auto;
		flex-wrap: wrap;
	}
	.overlay ul li {
		width: 100%;
		margin:0 0 15px 0;
		justify-content: center;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}
	.link nav ul li a {
		width: 100%;
		margin: 0;
		text-align: center;
		font-size: 25px;
		line-height: 1;
		font-weight: 300;
		display: block;
		color: #fff;
		-webkit-transition: color 0.2s;
		transition: color 0.2s;
	}
	.link nav ul li a:after{
		display: none;
	}
	.link nav ul li.last{
		order:-1;
		border-bottom:1px solid #fff;
		padding: 0 0 15px 0;
		margin: 0 0 30px 0;
	}
	.link nav ul li a.logout {
		width: 90px;
		text-align: center;
		line-height: 22px;
		color: #fff;
		font-size: 1rem;
		background: #f44235;
	}
	/* Effects */
	.overlay-hugeinc {
		opacity: 0;
		visibility: hidden;
		-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
		transition: opacity 0.5s, visibility 0s 0.5s;
	}
	.overlay-hugeinc.open {
		opacity: 1;
		visibility: visible;
		-webkit-transition: opacity 0.5s;
		transition: opacity 0.5s;
	}
	.overlay-hugeinc nav {
		width: 100%;
		-webkit-perspective: 1200px;
		perspective: 1200px;
		position: relative;
		top: 20%;
		height: 80%;
	}
	.overlay-hugeinc nav ul {
		opacity: 0.4;
		-webkit-transform: translateY(-25%) rotateX(35deg);
		transform: translateY(-25%) rotateX(35deg);
		-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
		transition: transform 0.5s, opacity 0.5s;
	}
	.overlay-hugeinc.open nav ul {
		opacity: 1;
		-webkit-transform: rotateX(0deg);
		transform: rotateX(0deg);
	}
	.overlay-hugeinc.close nav ul {
		-webkit-transform: translateY(25%) rotateX(-35deg);
		transform: translateY(25%) rotateX(-35deg);
	}
	/*menu*/
	.navbar-toggle{
		display: inline-block;
		width: 70px;
		position: fixed;
		top: 2px;
		right: 2px;
		color: #fff;
		font-size: 15px;
		line-height: 1.2;
		padding: 3px;
		cursor: pointer;
		background-color: transparent;
		background-image: none;
		border: 1px solid transparent;
		transition: all 0.3s ease-in-out;
	}
	.navbar-toggle i{
		font-size: 21px;
	}
	/*banner*/
	.banner .bg img {
		width: 1100px;
	}
	.b_text {
		top: 30%;
		width: 70%;
	}
	.b_text h2 {
		font-size: 25px;
	}
	.b_text p {
		font-size: 15px;
	}
	.machine {
		width: 70%;
		right: -6%;
	}
	.cloud {
		right: 0;
		top: 24%;
		width: 23%;
	}
	.user_block .btn {
		width: 200px;
		padding: 8px;
		font-size: 17px;
	}
	/*服務內容*/
	.service ul li{
		width: 100%;
		flex-wrap: wrap;
	}
	.service ul li img{
		margin: 0 auto;
	}
	.service ul li h3 {
		margin: 0 0 3% 0;
	}
	.service ul li .s_text {
		width: 100%;
		margin: 10px 0 0 0;
		padding: 0 15px;
	}
	.s_text h3{
		text-align: center;
	}
	.first_tit h1{
		font-size: 27px;
	}
	.first ul li {
		width: 100%;
		margin: 0 0 50px 0;
	}
	.first ul li.arrow {
		width: 100%;
		margin: 0 0 40px 0;
	}
	.first ul li.arrow:before{
		left: 43%;
		transform: rotate(90deg) translate(-50%, -50%);
		-webkit-transform: rotate(90deg) translate(-50%, -50%);
	}
	.dowload{
		padding: 0 15px;
	}
	.dowload p {
		width: 100%;
	}
	/*footer*/
	footer img {
		width: 200px;
		margin: 0 auto;
	}
	.info {
		margin: 10px 0 0 0;
		text-align: center;
		width: 100%;
	}
	.nav-tabs{
		white-space: nowrap;
		overflow-x: scroll;
		overflow-y: hidden;
		flex-wrap: nowrap;
	}
	.inside_page{
		margin: 0;
	}
	/*login*/
	.set_box{
		padding: 30px 15px;
	}
	.set_box .form-group.row .col-form-label {
		width: 132px;
		text-align: right!important;
	}
	.login_box{
		margin: 15px 0;
		padding: 0;
	}
	.login_btn{
		display: flex;
		flex-wrap: wrap;
	}
	.login_btn a {
		width: 49%;
		display: inline-block;
		margin: 0 0 0 2%;
	}
	.login_btn a.float_l{
		float: none;
		margin: 0;
	}
	.login_btn a.submit_btn {
		width: 100%;
		order: -1;
		margin: 0 0 10px 0;
	}
	/*check_list*/
	.check_text {
		margin: 0 0 30px 0;
	}
	.check_text p{
		font-size: 15px;
	}
	/*plan*/
	.plan {
		padding: 30px 15px;
	}
	.plan_img li {
		width: 100%;
		margin: 0;
	}
	.plan h1 {
		font-size: 26px;
	}
	.plan h2 {
		font-size: 21px;
		color: #666;
		margin: 10px 0 30px 0;
	}
	.plan h3 {
		font-size: 17px;
	}
	.plan_pic{
		margin: 20px 0 0 0;
	}
	.advantage h1{
		font-size: 27px;
	}
	.advantage ul li, .advantage ul li:nth-child(2n) ,.advantage ul li:nth-child(3n){
		width: 100%;
		margin: 0 0 4% 0;
	}
	.dowload.plan_27001{
		height: 600px;
	}
	.dowload.plan_27001 h1{
		font-size: 22px;
	}
	.dowload.plan_27001 p{
		width: 95%;
		font-size: 15px;
		text-align: left;
	}
	/*faq*/
	.faq_catagory ul li{
		padding: 15px;
	}
	.faq_catagory ul li h3 {
		font-size: 15px;
		margin: 0 0 10px 0;
	}
	.faq_catagory ul li p{
		font-size: 12px;
	}
	.faq_search{
		padding: 15px;
	}
	.faq_search h3{
		font-size: 19px;
	}
	/*info*/
	.info_nav{
		left: 2%;
		position: absolute;
	}
	.info_btn{
		flex-wrap: wrap;
	}
	.info_btn li {
		flex: none;
		width: 49%;
		margin: 0 2% 2% 0;
	}
	.info_btn li:nth-child(even) {
		margin: 0 0 2% 0;
	}
	.step_block, .step_block:nth-child(2n){
		width: 100%;
		margin: 0 0 4% 0;
	}
	/*info_block*/
	.info_tit {
		margin: 15px;
	}
	.info_text{
		height: 300px;
		padding: 0 15px;
	}
	.info_text:after {
		height: 300px;
	}
	.info_text h1 {
		padding: 30px 0 20px 0;
		font-size: 27px;
	}
	.info_text p {
		font-size: 15px;
		text-align: left;
	}
	.info_block ul li, .info_block ul li:nth-child(3n) {
		width: 100%;
		margin: 0 0 10% 0;
	}
	.tab-pane p{
		font-size: 15px;
		word-break: break-all;
	}
	/*info_area*/
	.info_area,.info_area_step .info_area, .info_area:nth-child(2) ,.info_area.right, .info_area.right:nth-child(2){
		width: 100%;
		margin: 15px 0 0 0;
	}
	.info_area a{
		padding: 20px;
	}
	.info_area h2{
		font-size: 23px;
	}
	.info_area ul{
		padding: 0 0 0 20px
	}
	.info_area ul li{
		font-size: 15px;
	}
	.info_help_block li{
		width: 100%;
		margin: 0 0 4% 0;
	}
	/*info_step*/
	.step {
		margin: 50px 15px 30px 15px;
	}
	.step ul{
		white-space: nowrap;
		overflow-x: scroll;
		overflow-y: hidden;
		flex-wrap: nowrap;
	}
	.step ul li, .step.einvoice ul li, .step.moeaca1_1 ul li, .step.invoice ul li, .step.einvoice2 ul li, .step.width50 ul li{
		width: 200px;
	}
	.step ul li a p {
		font-size: 15px;
		margin: 10px 30px 10px 0px;
	}
	.info_step li, .info_step li:nth-child(3n) {
		width: 100%;
		margin: 0 0 40px 0;
	}
	/*user*/
	.user_block p {
		font-size: 1rem;
	}
	.user_block h4 {
		font-size: 25px;
	}
	.user_block .btn {
		margin: 0 auto;
		display: block;
	}
	/*moeaca*/
	.m_block .no, .m_block .have{
		width: 100%;
		margin: 0 0 4% 0;
		padding: 15px;
	}
	.m_block h2{
		font-size: 19px;
	}
	.m_block a ul li{
		font-size: 14px;
	}
	.m_block p{
		font-size: 14px;
	}
	.m_block ul{
		margin: 0 0 15px 0;
	}
	.button{
		padding: 8px;
	}
	/*tab rootwizard*/
	.tab-pane h2 {
		margin: 0 0 20px 0;
	}
	/*service*/
	.file_content{
		padding: 15px;
	}
	.file_content ul {
		list-style: disc;
		padding: 15px;
		background: #f9f9f9;
		font-size: .9rem;
	}
	.file_content ul li{
		font-size: .9rem;
	}
	/*edit*/
	..material_input{
		font-size: 14px;
	}
	.card-title{
		font-size: 1.5rem;
	}
	.form_top .form-group label {
		min-width: 118px;
	}
	.form_top .form-inline .form-group .group.inline-block{
		width: auto;
	}
	.form-group.short_input {
		width: auto;
		display: inline-block;
		margin: 0 0 1rem 0;
	}
	.form_top .form-inline .form-group.short_input select{
		margin: 0 0 10px 0;
	}
	.form_top .form-inline .form-group.short_input .group input{
		width: 148px;
	}
	textarea.form-control {
		width: 100%;
	}
	.col-form-label{
		text-align: left !important;
	}
	.group.inline-block.add_input {
		width: 100%;
		margin: 10px 0 0 0;
	}
	.mobile-nowrap{
		white-space: nowrap;
	}
	.card-footer h3{
		font-size: 19px;
	}
}
@media screen and (max-width: 600px) {
	.index_banner {
		height: 720px;
	}
	.index_banner_txt {
		width: 90%;
		padding: 20px;
		left: 50%;
		transform: translateX(-50%);
	}
	.index_banner_txt a {
		width: 100%;
		max-width: 80%;
		margin: 20px auto;
		display: block;
	}
	.support img {
		max-width: 130px;
	}
	.s-month .form-inline .form-group {
		margin: 0 0 1rem 0 !important;
	}
}

@media screen and (max-width: 540px) {
	.table-rwd-540{
		min-width: 100%;
	}

	tr.tr-only-hide {
		display: none !important;
	}

	.table-rwd-540 tr{
		display: block;
		margin-top: 5px;
	}

	.table-rwd-540 td {
		text-align: left !important;
		font-size: 15px;
		overflow: hidden;
		width: 100%;
		display: -webkit-inline-box;
		border: 0;
	}

	.table-rwd-540 td:before {
		content: attr(data-th) " : ";
		display: inline-block;
		text-transform: uppercase;
		font-weight: bold;
		margin-right: 10px;
		color: #000;
	}

	.table-rwd-540.table-bordered td,.table-rwd-540.table-bordered th,.table-rwd-540.table-bordered{
		border:0;
	}

	.table-rwd-540 tbody:nth-child(2n) {
		background-color: #dce5f74e;
	}
}

@media screen and (max-width: 480px) {
	.index_banner {
		height: 630px;
	}
	.index_banner_txt h2 {
		font-size: 33px;
	}
	.index_banner_txt h2 span {
		font-size: 55px;
	}
	.index_banner_txt h3 {
		font-size: 15px;
		padding: 8px 15px;
	}
	.index_banner_txt h4 span {
		font-size: 15px;
		min-width: 150px;
	}
	.index_banner_txt p {
		font-size: 15px;
		margin: 5px 0;
	}
	.mbw-100{
		width: 100% !important;
	}
}
@media screen and (max-width: 425px) {
	.index_banner_txt h2 {
		font-size: 26px;
	}
}
@media screen and (max-width: 418px) {
	.index_banner_txt h2 {
		font-size: 25px;
	}
}
@media screen and (max-width: 414px) {
	/* header icon */
	button.navbar-toggler i {
		font-size: 16px;
	}
	button.navbar-toggler span {
		font-size: 14px;
		margin: 5px 0 0 0;
	}
	.mb-show-icon {
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
	}
	/*index_banner*/
	.index_banner{
		height: 590px;
		padding: 20px 0;
		align-items: flex-start;
	}
	.index_banner_txt h2 {
		font-size: 25px;
	}
	.computer {
		width: 55%;
	}
	.machine_s {
		width: 45%;
		right: 50%;
	}
	.service_banner p {
		font-size: 17px;
	}
	.form_top .form-inline .form-group .group.short_input{
		width: 164px;
	}
	.mb_show h3 {
		display: flex;
		flex-direction: column;
	}
	.form_top .form-group label {
		min-width: 100px;
	}
}
@media screen and (max-width: 390px) {
	.index_banner_txt h2 {
		font-size: 24px;
	}
	.index_banner_txt h4{
		display: flex;
	}
	.index_banner_txt h4 span{
		min-width: 48%;
	}
}
@media screen and (max-width: 375px) {
	/*index*/
	.index_banner_txt h2 {
		font-size: 21px;
	}
	.index_banner_txt h2 span {
		font-size: 51px;
	}
	.index_banner_txt h3 {
		display: block;
		text-align: center;
		font-size: 14px;
		padding: 8px 6px;
	}
	.index_banner_txt h4 span {
		min-width: 135px;
	}
	.support h2{
		margin: 0 0 20px 0;
	}
	.support img {
		max-width: 48%;
		margin: 20px 1% 20px 0;
	}
	.breadcrumb{
		font-size: 12px;
	}
	.form_top .form-inline .form-group .group.short_input {
		width: 145px;
	}
	.form_top .form-inline .form-group.short_input .group input{
		width: 142px;
	}
	.sub-title{
		font-size: 19px;
	}
	/*login*/
	.login_box p, .set_box p{
		font-size: 13px;
	}
	.login_box ul {
		margin: 20px 0 0 0;
	}
	.card-title {
		font-size: 1.4rem;
	}
	/*faq*/
	.faq_catagory ul li h3 {
		font-size: 13px;
	}
	/*info*/
	.tab-pane h2{
		font-size: 1.5rem;
	}
	.user_block h4 {
		font-size: 23px;
	}
	.m_block h2{
		font-size: 17px;
	}
	.info_tit{
		font-size: 25px;
	}
	.info_btn li a {
		padding: 6px;
	}
	.info_btn li a i {
		font-size: 17px;
	}
	/*file*/
	.file_content ul li {
		font-size: .88rem;
	}
	.file_content .line p , .service_banner p {
		font-size: 15px;
	}
	/*plan*/
	.plan h3{
		font-size: 15px;
	}
	.plan p, .plan ul li {
		font-size: 14px;
	}
	.advantage ul li h2{
		font-size: 19px;
	}

	/* Table */
	.mb_show_table {
		flex-direction: column;
		align-items: center;
	}
	.vendor_list_mb_show01 {
		padding: 10px 50px;
		width: 100%;
	}
	.vendor_list_mb_show02 .google_btn {
		margin-bottom: 15px;
	}

}
@media screen and (max-width: 360px) {
	.index_banner_txt h2 span {
		font-size: 45px;
	}
	.index_banner_txt h4 span {
		min-width: 130px;
	}
}
@media screen and (max-width: 320px) {
	/*index*/
	.index_banner {
		height: 505px;
	}
	.index_banner_txt h2 {
		font-size: 18px;
	}
	.index_banner_txt h2 span {
		font-size: 39px;
	}
	.index_banner_txt h3 {
		font-size: 12px;
		padding: 8px 6px;
		margin: 0 0 10px 0;
	}
	.index_banner_txt h4 span{
		padding: 8px;
		font-size: 13px;
		min-width: 110px;
	}
	.index_banner_txt p {
		font-size: 13px;
		margin: 3px 0;
	}
	.support h2 {
		font-size: 27px;
	}
	.support img {
		max-width: 47%;
		margin: 15px 1% 15px 0;
	}
	/*header*/
	.logo a {
		width: 120px;
		height: 50px;
	}
	nav a {
		font-size: 15px;
	}
	.link a {
		padding: 3px 8px;
		margin: 0 0 0 10px;
		font-size: 12px;
	}
	/*服務內容*/
	.service ul li .s_text{
		font-size: 15px;
	}
	.service ul li h3 {
		font-size: 18px;
		font-weight: bold;
	}
	.login_btn a {
		width: 47%;
	}
	.form_top .form-inline .form-group .group.short_input {
		width: 116px;
	}
	/*faq*/
	.faq_catagory ul li a {
		width: 80px;
		padding: 17px 0;
	}
	.faq_catagory ul li a i {
		font-size: 19px;
	}
	.faq_catagory ul li {
		font-size: 12px;
	}
	.cart_area .cell.data {
		width: 100%;
	}

	/* Table */
	.vendor_list_mb_show01 {
		padding: 10px 25px;
	}
}

/*20220617新增*/
.credit_note_color {
	background-color: #ffcb3142;
}

/*vendor_setting 20220622新增*/

.table.width250 th {
	width: 250px;
}

.setting_tit_btn {
	padding: 10px 20px;
	color: #fff;
	background-color: #20a8d8;
	border-radius: 5px;
	width: 210px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 0 15px 0;
}

/*20220817_開立發票合併頁*/
.print_posi,.bread_posi {
	position: relative;
}
.print_status {
	color: #fff;
	background-color: #4dbd74;
	padding: 2px 15px;
	border-radius: 5px;
	text-align: center;
	position: absolute;
	right: 15px;
}
.print_status_red {
	color: #fff;
	background-color: #f86c6b;
	padding: 2px 15px;
	border-radius: 5px;
	text-align: center;
	position: absolute;
	right: 15px;
}

.ani_blink {
	animation: aBlink 500ms infinite;
	-webkit-animation: aBlink 500ms infinite;
}
@keyframes aBlink {
	from { background-color: #f86c6b; }
	50% { background-color: #fd4646; }
	to { background-color: #f86c6b; }
}
.print_fix_top {
	position: fixed;
	width: 90%;
	z-index: 1;
	top: 80px;
	border-radius: 0;
	right: 0;
}
.print_status01 {
	color: #fff;
	background-color: #4dbd74;
	padding: 2px 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
}
.form-group .md-radio label {
	padding: 0 1px 0 25px;
}
.inp_bt_flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.inv_type_select {
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	border: 2px solid #20a8d8;
	color: #20a8d8;
	margin: 0 5px;
	cursor: pointer;
	width: 70px;
	height: 60px;
}
.inv_type_select span {
		font-size: 12px;
}

.inv_type_select .icon_size {
	font-size: 23px !important;
	margin-bottom: -7px;
}

.md-radio label.label_none:before, .md-radio label.label_none:after {
	display: none;
}
.form-group .md-radio label.label_none {
	padding: 0;
}

.md-radio input[type="radio"]:checked + label.label_none:before {
	border-color: #337ab7;
	animation: ripple 0.2s linear forwards;
	display: none;
}

.md-radio input[type="radio"]:checked + label.label_none:after {
	transform: scale(1);
	display: none;
}

.md-radio input[type="radio"]:checked + label .inv_type_select {
	color: #fff;
	background-color: #20a8d8;
}

.inv_type_flex {
	display: flex;
	align-items: center;
}

.inv_type_active {
	color: #fff;
	background-color: #20a8d8;
}

.inv_type_show {
	display: flex;
}

.card_show_amount {
	/* display: flex;
	align-items: flex-end; */
	padding: 10px;
	background-color: #fff;
	border-radius: 2px;
	border: none;
	box-shadow: 0 1px 5px rgb(0 0 0 / 20%), 0 2px 2px rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%);
}
.right_amount {
	flex: 1 1 auto;
}

.inv_add_footer_2box {
	display: flex;
}

.left_show , .right_show {
	width: 50%;
	margin: 5px;
}

.left_show .card.m-top {
	margin: -6px 0 0 0;
}

.left_amount p {
	width: 50%;
}

.left_amount {
	display: flex;
	flex-wrap: wrap;
	padding: 0 15px;
}

.right_amount .card {
	margin: 0 !important;
}

.total_amount_show {
	flex: 1 1 auto;
	text-align: end;
}

.total_amount_show .fs-6 {
	padding: 10px;
	font-size: 19px;
	font-weight: bold;
}

.buyer_identifier_posi {
	position: relative;
}

.a_posit_buyer_btn {
	position: absolute;
	top: 0;
	right: 0;
}
.select_buyer_btn {
	background-color: #4c54c0 !important;
	color: #fff;
	cursor: pointer !important;
	display: flex;
	align-items: center;
	justify-content: center;
}

.show_buyer_name {
	width: 100%;
	height: 345px;
	overflow-y: scroll;
}

.show_buyer_name ul li {
	border-top: 1px solid #e6e6e6;
	padding: 10px 10px 0;
	cursor: pointer;
}
.show_buyer_name ul li:first-child {
	border-top: 0;
}

.show_buyer_name ul li:nth-child(2n) {
	background-color: #20a8d80f;
}

.show_buyer_name ul li:hover {
	background-color: #c1e7f4;
}

.show_buyer_name ul li p {
	margin: 5px 0;
}

.uniform_number {
	padding: 5px;
	color: #fff;
	background-color: #20a8d8;
	border-radius: 5px;
}
.city_add_inp {
	position: absolute;
	top: 6px;
	color: #66717b;
	font-size: 16px;
}
.padding_left_155 {
	padding-left: 155px;
}

/*新版熱感應機說明頁*/
.flex_show {
	display: flex;
	align-items: center;
	margin: 0 0 10px 0;
}
.flex_show p {
	margin: 0;
}
.print_status_01 {
	color: #fff;
	background-color: #4dbd74;
	padding: 2px 15px;
	border-radius: 5px;
	text-align: center;
	width: 155px;
}
.print_status_02 {
	color: #fff;
	background-color: #f86c6b;
	padding: 2px 15px;
	border-radius: 5px;
	text-align: center;
	width: 155px;
}

@media screen and (max-width: 1366px) {
	.setting_tit_btn {
		width: 235px;
	}
	.pd_inp_width {
		width: 200px;
	}
	.sequence_inp_width {
		padding: 0 !important;
	}
	.nums_inp_width,.unit_inp_width {
		width: 45px;
		padding: 0.375rem 0 !important;
	}
}
@media screen and (max-width: 1280px) {
	.print_fix_top {
		width: 85%;
		top: 80px;
	}
}
@media screen and (max-width: 1200px) {
	.print_fix_top {
		width: 85%;
		top: 70px;
	}
}
@media screen and (max-width:1199px) {
	.print_status01 {
		color: #fff;
		background-color: #4dbd74;
		padding: 2px 5px;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 5px;
		margin: 5px 0 0 0;
		position: absolute;
		top: -10px;
	}
}

@media screen and (max-width:1080px) {
	.inv_add_footer_2box {
		flex-direction: column;
	}
	.left_show, .right_show {
		width: 100%;
		margin: 0 0 10px 0;
	}
}
@media screen and (max-width:1024px) {
	.print_fix_top {
		width: 82%;
		top: 80px;
	}
}
@media screen and (max-width:991px) {
	.print_fix_top {
		width: 100%;
		top: 80px;
	}
}
@media screen and (max-width:820px) {
	.print_fix_top {
		width: 100%;
		top: 50px;
	}
}
@media screen and (max-width:800px) {
	.inv_type_flex {
		flex-wrap: wrap;
		padding: 0;
	}
	.print_fix_top {
		position: fixed;
		width: 100%;
		z-index: 1;
		top: 50px;
	}
}
@media screen and (max-width:768px) {
	.setting_tit_btn {
		width: 245px;
	}
	.pd_inp_width {
		width: 100%;
	}
	.flex_two_td {
		width: 100%;
	}
}
@media screen and (max-width:642px) {
	.nums_inp_width,.unit_inp_width {
		width: 100%;
		padding: 0.375rem 0 !important;
	}
	.mail_info {
		flex-direction: column;
	}
}
@media screen and (max-width:480px) {
	.bread_noshow_mb {
		display: none;
	}
}
@media screen and (max-width:430px) {
	.left_amount p {
		width: 100%;
	}
}
@media screen and (max-width:414px) {
	.inv_type_select .icon_size {
		font-size: 22px !important;
		margin-bottom: -7px;
	}

	.show_buyer_name {
		height: 460px;
	}

	.md-radio {
		margin: 8px 2px;
	}
}