.mainContainer > section.memberCT:not(:has(.tabBtnBlock)){
	margin-top:0;
}

form:has(.memberCT) > section+section{
	margin-top:5%;
}

.memberCT,
.resultCT {
	margin: 0 2.5%;
}

/*********************************** 無滑動頁籤按鈕(居中) start *****************************************/
.tabBtnBlock ul li {
	width: 13.5%;
}
/*********************************** 無滑動頁籤按鈕(居中) end *****************************************/

.memberCT .ctBlock {
	margin-top: 10px;
}

.memberCT .ctBlock fieldset .ct .info {
	padding: 0 3em;
}

/********************************** 居中表單 start *********************************************/
.centerColumn fieldset .info p{
	margin:0;
	line-height: 1.8em;
}
.centerColumn fieldset .info p+p{
	margin-top:1em;
}

.centerColumn .ct {
	display: flex;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	width: 400px;
	margin-top: 3%;
	margin-left: auto;
	margin-right: auto;
}
.centerColumn fieldset .ct .item,
.centerColumn fieldset .ct .errorGroup{
	width: 80%;
	max-width: 400px;
}
.centerColumn.login fieldset .ct .item{
	width: 82%;
}

.centerColumn.openAccount .ct {
	width: 500px;
}
.centerColumn.openAccount fieldset .ct .item{
	width: 100%;
	max-width: none;
}
.centerColumn.openAccount fieldset .ct .item .itemCT .mobileMsg{
	white-space: nowrap;
}

.centerColumn fieldset .ct .errorGroup{
	margin-top:5%;
}

@media screen and (min-width: 1023px) {
	
	.centerColumn fieldset .ct .item {
		display: flex;
	}
	.centerColumn fieldset .ct .item > label {
		padding-left: 0;
	}
	.centerColumn fieldset .ct .item .itemCT {
		width: calc(100% - 100px);
	}
	.centerColumn fieldset .ct .item .itemCT .inputWrapper {
		width: 100%;
	}
	.centerColumn.openAccount fieldset .ct .item .itemCT > .inputWrapper {
		width: 180px;
	}
	.centerColumn.openAccount fieldset .ct .item .itemCT .inputWrapper.mobile,
	.centerColumn.openAccount fieldset .ct .item .itemCT .inputWrapper.code{
		width: 32%;
		flex-shrink: 0;
	}
	
}

.centerColumn fieldset .info {
	text-align: center;
	margin-top: 3%;
	line-height: 1.8em;
}
.centerColumn .ct .item + .item {
	margin-top: 5%;
}

.centerColumn.transfer .ct,
.centerColumn.verify .ct,
.centerColumn.changePW .ct,
.centerColumn.unsubscribe .ct {
	width: 420px;
}
.centerColumn.openAccount .ct .item > label,
.centerColumn.transfer .ct .item > label,
.centerColumn.verify .ct .item > label,
.centerColumn.changePW .ct .item > label,
.centerColumn.unsubscribe .ct .item > label {
	width: 120px;
}
.centerColumn.login .account {
	width: calc(100% - 105px);
}

.centerColumn.ajaxCheck .inputWrapper label{
	font-size: 12px;
	display: none;
}
.centerColumn.ajaxCheck .inputWrapper label.show{
	display: block;
}

.centerColumn.ajaxCheck .systemMsg {
	position: relative;
	width:100%;
	color: #c33;
	font-size: 12px;
	font-weight: bold;
	margin: 0.5em 0 0;
	padding-left:1.6em;
	white-space: nowrap;
	display: none;
}
.centerColumn.ajaxCheck .systemMsg.show{
	display: block;
}
.centerColumn.ajaxCheck .systemMsg:before {
	position: absolute;
	left:0;
	top:0;
	content: "!";
	display: block;
	width: 1.4em;
	height: 1.4em;
	border-radius: 50%;
	padding: 0.1em 0;
	text-align: center;
	background: #c33;
	color: #fff;
	font-weight: bold;
}

/**************** CheckMail start *********************/
.centerColumn.CheckMail fieldset .ct .item{
	width:100%;
}
/**************** CheckMail end *********************/

/**************** OTP start *********************/
.centerColumn.OTP fieldset .ct .item{
	width:100%;
}
.centerColumn.OTP fieldset .ct .item .itemCT .inputWrapper{
	width:140px;
}

.centerColumn.OTP fieldset .ct .item .itemCT{
	display: flex;
	flex-wrap:wrap;
	align-items: flex-start;
}
.OTP .itemCT > *+*{
	margin-left:0.5em;
}

.OTP .formBtn{
	width:84px;
	padding:0.4em;
}

.OTP .time{
	color:#C33;
	margin-top:0.25em;
	white-space: nowrap;
}
/**************** OTP end *********************/

.psLink {
	margin: 2% auto 0;
	text-align: center;
}
.psLink a {
	margin: 0 0.5em;
	text-decoration: underline;
}
.psLink a:hover {
	text-decoration: none;
}
/********************************** 居中表單 end *********************************************/

/********************************** 網路購物金明細 start *********************************************/
.couponBlock {
	margin: 0 auto 3em;
	width: 600px;
}

/**************** tab start ******************/
.couponBlock > ul {
	display: flex;
}
.couponBlock > ul li {
	flex: 1 1 0px; /* IE 的 flex-basis 必須加上單位 */
	overflow: hidden;
	cursor: pointer;
	border: 1px solid #ccc;
	font-weight: normal;
	text-align: center;
	padding: 0.5em;
	background: #fff;
	color: #666;
	transition: all 0.2s;
}
.couponBlock > ul li:not(:last-child) {
	border-right: 0;
}
.couponBlock > ul li:first-child,
.couponBlock > ul li:last-child {
	border-radius: 4px;
}
.couponBlock > ul li:first-child {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.couponBlock > ul li:last-child {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.couponBlock > ul li:hover {
	background: #eee;
}
.couponBlock > ul li.active {
	border-color: #999;
	background: #999;
	color: #fff;
}
.couponBlock > ul li.active + li {
	border-left-color: transparent;
}
/**************** tab end ******************/

/**************** tabCTBlock start ******************/
.couponBlock .tabCTBlock {
	margin-top: 1.2em;
}
.couponBlock .tabCT {
	display: none;
}
.couponBlock .tabCT.active {
	display: block;
}
.couponBlock .tabCT > p {
	font-size: 1.14em;
	font-weight: bold;
	margin: 0 0 0 1.14em;
}
.couponBlock .tabCT .table {
	margin-top: 1.4em;
}
/**************** tabCTBlock end ******************/

.coupon .statement ul {
	margin-top: 1em;
}
.coupon .statement img {
	display: block;
	max-width: 100%;
}
/********************************** 網路購物金明細 end *********************************************/

/********************************** 加入會員 & 會員資料查詢 start *********************************************/
.memberData:after {
	content: "";
	clear: both;
	display: block;
}
.memberData fieldset {
	float: left;
	width: 65%;
}
.memberData fieldset + fieldset {
	width: 32%;
	margin-left: 3%;
	margin-top: 0;
}
.memberData fieldset.newInfo .ct {
	line-height: 1.8em;
}
.memberData fieldset .ct .item > label {
	position: relative;
	width: 10em;
	padding-left: 2.4em;
}
.memberData fieldset .ct .item > label.required:before {
	position: absolute;
	content: "*";
	left: 1.5em;
	top: 0;
}

.memberTypeN {
	display: none;
}
.memberTypeN.show {
	display: block;
}

.memberType label,
.subscribe label {
	cursor: pointer;
}
.memberType + .memberType,
.subscribe + .subscribe {
	margin-left: 1.5em;
}

.item.birth .inputWrapper {
	width: 12%;
}

.inputWrapper.account,
.inputWrapper.password{
	width: 187px;
}

.inputWrapper.companyName,
.inputWrapper.companyId{
	width: calc(100% - 10em - 20px);
}

.item.nameGender .itemCT {
	display: inline-block;
	overflow: hidden;
	width: calc(100% - 12em);
}
.item.nameGender .itemCT .ng {
	float: left;
}
.item.nameGender .itemCT .ng.ng_name {
	width: calc(100% - 20em);
}
.item.nameGender .itemCT .ng.ng_gender {
	width: 17em;
	margin-left: 5%;
}
.item.nameGender .itemCT .ng.ng_gender label {
	cursor: pointer;
	margin-left: 2.5%;
}

.inputWrapper.name {
	width: 100%;
}
.inputWrapper.name + .hintTxt {
	margin-left: 0;
}

.inputWrapper.tel {
	width: calc((100% - 10em - 20px) - 100px);
}
.inputWrapper.ext {
	width: 60px;
}

.inputWrapper.companyTypeSelect,
.inputWrapper.companyTypeOther,
.inputWrapper.addressPre {
	width: calc((100% - 10em - 20px) / 4);
}
.inputWrapper.companyTypeOther {
	display: none;
}
.inputWrapper.companyTypeOther.show {
	display: inline-block;
}
.inputWrapper.addressDetail {
	width: calc((100% - 14em - 20px) / 2.07);
}
.inputWrapper.addressDetail + .hintTxt {
	display: block;
	margin-left: 12em;
}

/************** 手機 start *****************/
.mobileVerify{
	display: inline-flex;
	align-items: flex-start;
	width:calc(100% - 10.5em);
}

.inputWrapper.mobile,
.inputWrapper.code {
	width: 22%;
}
.inputWrapper.code,
.mobileMsg{
	margin:0 0.4em;
}

.mobileVerify.sent .getCode,
.mobileVerify.success .getCode,
.mobileVerify:not(.sent) .inputWrapper.code,
.mobileVerify:not(.sent) .checkCode,
.mobileVerify label.error{
	display: none;
}
.mobileVerify label.error.show{
	display: block !important;
}

.mobileVerify button{
	color: #fff;
	background: #999;
	border: none;
	border-radius: 3px;
	display: inline-block;
	padding: 0.1em 0.4em;
	margin: 0 0.4em;
	line-height: 1.6em;
	cursor: pointer;
	white-space: nowrap;
}
.mobileVerify button:hover {
	background: #666;
}

.mobileMsg{
	margin-top: 0.2em;
}
.mobileMsg.alert{
	color:#C33;
}
/************** 手機 end *****************/

/************** 隱藏 加入會員之 會員類別 市話 詳細地址 start *****************/
/*
.memberData:has(.memberType) fieldset .ct .item:has(.memberType),
.memberData:has(.memberType) fieldset .ct .item:has(.tel),
.memberData:has(.memberType) fieldset .ct .item .addressDetail,
.memberData:has(.memberType) fieldset .ct .item .addressDetail+.hintTxt{
	display: none;
}
.memberData:has(.memberType) fieldset .ct .item .zoneCode{
	position: relative;
	top: 0.25em;
}
*/
/************** 隱藏 加入會員之 會員類別 市話 詳細地址 end *****************/

/*************** 會員狀態 start ******************/
fieldset.status .ct .item > label {
	width: 16em;
	display: inline-block;
}
/*************** 會員狀態 end ********************/

/*************** btmFormBtn start ********************/
.btmFormBtn {
	text-align: center;
}
.btmFormBtn label {
	display: block;
	line-height: 1.6em;
	cursor: pointer;
}
.btmFormBtn label + .formBtn {
	margin-top: 1em;
}

.btmFormBtn.forgetPW{
	display: flex;
	justify-content: center;
}
.btmFormBtn.forgetPW a{
	width:12em;
}
.btmFormBtn.forgetPW a+a{
	margin-left:0.5em;
}

.btmFormBtn a:hover{
	color:#FFF;
}
/*************** btmFormBtn end ********************/

/********************** 會員服務約定條款 start ***************************/
.termContainer h1 {
	border-radius: 3px;
	color: #fff;
	background: #ccc;
	padding: 10px 20px;
	font-size: 12px;
}
/********************** 會員服務約定條款 end ***************************/

/********************** 結果頁 start ***************************/
.resultCT {
	text-align: center;
	color: #333;
}
.resultCT .icon {
	margin: 0 auto;
	width: 139px;
	height: 124px;
	background: url(../images/memberResult.png) no-repeat;
	background-size: cover;
	opacity: 0;
	transform: scale(0);
	animation: showResultIcon 1.5s cubic-bezier(0.82, 0.29, 0.29, 1.5) 0s forwards;
}
.resultCT .icon.success {
	background-position: center top;
}
.resultCT .icon.fail {
	background-position: center bottom;
}
@keyframes showResultIcon {
	to {
		opacity: 1;
		transform: scale(1);
	}
}

.resultCT p {
	line-height: 1.6em;
}
.resultCT .title {
	font-weight: bold;
	font-size: 16px;
}
/********************** 結果頁 end ***************************/
/********************************** 加入會員 & 會員資料查詢 end *********************************************/

/********************************** 取消訂閱電子報 start *********************************************/
.unsubscribe .att {
	font-size: 12px;
}
/********************************** 取消訂閱電子報 end *********************************************/

/*********************************** 表格樣式 start ************************************/
.table {
	margin-top: 10px;
}
.table .table_icon {
	display: inline-block;
	margin-left: 0.8rem;
	width: 1.2rem;
	height: 1.2rem;
	vertical-align: middle;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url(../images/table_icon_qa_sq.svg);
	transition: 0.3s;
}
.table .table_icon:hover {
	opacity: 0.4;
}

/*********************************** 表格樣式 end ************************************/

@media screen and (max-width: 1023px) {
	
	.memberCT,
	.resultCT,
	.btmFormBtn {
		margin: 0 10px;
	}

	.memberCT .ctBlock fieldset .ct .info {
		padding: 0 10px;
	}
	
	/********************************** 居中表單 start *********************************************/
	.centerColumn .ct,
	.centerColumn.openAccount .ct,
	.centerColumn.transfer .ct,
	.centerColumn.verify .ct,
	.centerColumn.changePW .ct,
	.centerColumn.unsubscribe .ct {
		width: auto;
	}
	.centerColumn .ct{
		margin-top:5%;
	}
	
	.centerColumn .ct .item + .item {
		margin-top: 4%;
	}
	.centerColumn .ct .item > label,
	.centerColumn.openAccount .ct .item > label,
	.centerColumn.transfer .ct .item > label,
	.centerColumn.verify .ct .item > label,
	.centerColumn.changePW .ct .item > label,
	.centerColumn.unsubscribe .ct .item > label {
		display: block;
		width: auto;
		padding-left: 0;
	}
	.centerColumn .ct .item .itemCT {
		display: block;
	}
	.centerColumn .ct .item .itemCT .inputWrapper {
		width: 100%;
	}
	
	.centerColumn.openAccount .ct .item .itemCT .inputWrapper.mobile {
		width: calc((100% - 6em) / 2);
	}
	.centerColumn.openAccount .ct .item .itemCT .inputWrapper.code {
		width: calc((100% - 7em) / 2);
	}
	
	.centerColumn .ct .item .itemCT .verifyP {
		margin-top: 2%;
		display: block;
	}
	
	.centerColumn.ajaxCheck .systemMsg {
		white-space: normal;
	}
	
	/**************** OTP start *********************/
	.centerColumn.OTP fieldset .ct .item .itemCT .inputWrapper{
		width:calc(100% - 100px);
	}
	/**************** OTP end *********************/
	
	.psLink {
		margin: 5% auto 10%;
	}
	/********************************** 居中表單 end *********************************************/

	/*********************************** 無滑動頁籤按鈕(居中) start *****************************************/
	.tabBtnBlock ul li {
		width: 30%;
	}
	.tabBtnBlock ul li:nth-child(3) {
		padding-right: 0;
	}
	/*********************************** 無滑動頁籤按鈕(居中) end *****************************************/

	/********************************** 網路購物金明細 start *********************************************/
	.couponBlock {
		width: auto;
	}

	/**************** tabCTBlock start ******************/
	.couponBlock .tabCT .table {
		margin-top: 0.5em;
	}
	/**************** tabCTBlock end ******************/
	/********************************** 網路購物金明細 end *********************************************/

	/********************************** 加入會員 & 會員資料查詢 start *********************************************/
	.memberData fieldset {
		float: none;
		width: auto;
	}
	.memberData fieldset + fieldset {
		width: auto;
		margin-left: 0;
		margin-top: 3%;
	}
	.memberData fieldset .ct .item > label {
		width: auto;
		display: block;
		padding-left: 0;
	}
	.memberData fieldset .ct .item > label.required:before {
		position: static;
		content: "* ";
	}
	.item.birth .inputWrapper {
		width: calc(33% - 1.5em);
	}
	.inputWrapper.account,
	.inputWrapper.password,
	.inputWrapper.companyName,
	.inputWrapper.companyId,
	.inputWrapper.companyTypeSelect,
	.inputWrapper.companyTypeOther,
	.inputWrapper.addressDetail {
		width: 100%;
	}

	.item.nameGender .itemCT {
		display: inline-block;
		width: 100%;
	}
	.item.nameGender .itemCT .ng {
		float: none;
		display: block;
	}
	.item.nameGender .itemCT .ng.ng_name {
		width: auto;
	}
	.item.nameGender .itemCT .ng.ng_gender {
		width: auto;
		margin-left: 0;
		margin-top: 2%;
	}

	.inputWrapper.tel {
		width: 65%;
	}
	.inputWrapper.ext {
		width: calc(35% - 3em);
	}
	.inputWrapper.addressPre {
		width: calc(50% - 1.2em);
	}
	.inputWrapper.companyTypeOther,
	.inputWrapper.addressDetail {
		margin-top: 5px;
	}
	.inputWrapper.addressDetail + .hintTxt{
		margin-left: 0;
	}

	.btmFormBtn label {
		text-align: left;
	}
	.btmFormBtn label + .formBtn {
		margin-top: 5%;
	}
	/********************************** 加入會員 & 會員資料查詢 end *********************************************/

	/*********************************** 表格樣式 start ************************************/
	.table td i {
		padding: 0.2em 0.5em;
		margin-right: 5px;
		background: #ccc;
		color: #fff;
		border-radius: 3px;
		min-width: 5em;
		text-align: center;
	}
	/*********************************** 表格樣式 end ************************************/
}


@media screen and (max-width: 767px) {
	
	/********************************** 加入會員 & 會員資料查詢 start *********************************************/
	/************** 手機 start *****************/
	fieldset:not(.contact) .ct .item .itemCT.mobileVerify{
		display: flex;
		flex-wrap: wrap;
	}

	.inputWrapper.mobile{
		width:calc((100% - 6em) / 2);
	}
	.inputWrapper.code {
		width:calc((100% - 7em) / 2);
	}

	.mobileVerify:not(.success) .mobileMsg{
		width:100%;
		margin:0.2em 0 0;
	}
	.mobileVerify.sent .mobileMsg{
		margin-left:calc((100% - 5.4em) / 2);
	}
	/************** 手機 end *****************/
	/********************************** 加入會員 & 會員資料查詢 end *********************************************/
	
}