/*
	2021/07/28
*/

html.active
{
	overflow: hidden;
}

body
{
	background: #212428;
}

input[type="file"]
{
	display: none;
}

/*1***    Class    *****/
.Notice
{
	color: red;
	text-align: left;
	font-size: 3.466vw;
}

.NoData /* 沒有資料 */
{
	color: #FFFFFF;
	text-align: center;
	font-size: 4.266vw;
}

.DevicePc
{
	display: none;
}

.DeviceMobile
{
	display: block;
}

/*************** 共同 ***************/
/*1***     input select textarea     *****/
.Sel,.Textarea
{
	background: #FFFFFF;
	border-radius: 1.333vw;
	width: 100%;
}

.Ipt,.Sel,.Textarea
{
	position: relative;
}

.Ipt
{
	border-bottom: 1px solid #FFFFFF;
	width: fit-content;
}

.Sel select,.Textarea textarea
{
	padding: 1.333vw;
}

.Ipt input,.Sel select,.Textarea textarea
{
	color: #FFFFFF;
	font-size: 4.533vw;
	display: block;
	width: 100%;
	min-height: 6.66vw;
}

.Ipt input
{
	padding: 0;
}

.Ipt input::placeholder,.Textarea textarea::placeholder
{
	color: #585858;
	font-size: 3.466vw;
}

.Sel select
{
	color: black;
}

.SelDecro
{
	background: #E5C25B;
	border-top-right-radius: 1.333vw;
	border-bottom-right-radius: 1.333vw;
	position: absolute;
	top: calc(50%);
	right: 0;
	transform: translateY(-50%);
	pointer-events: none;
	width: 10.666vw;
	height: 10.666vw;
}

.SelDecro::after
{
	border-top: 2.666vw solid #342305;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	width: 0;
	height: 0;
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	pointer-events: none;
}

.Textarea textarea
{
	width: 100%;
	resize: vertical;
	padding: 2.666vw;
	min-height: 21.333vw;
}

/*1***     checkbox     *****/
.CheckBox
{
	display: flex;
	align-items: center;
	justify-content: center;
}

.CheckIpt
{
	background: white;
	border: 1px solid #808080;
	display: block;
	border-radius: 1px;
	position: relative;
	margin: 0 2.666vw 0 0 !important;
	width: 3.2vw;
	height: 3.2vw;
}

.CheckIpt::after
{
	border: solid #808080;
	content: '';
	position: absolute;
	left: calc(50% - 1px);
	top: .8vw;
	width: .8vw;
	height: 1.866vw;
	border-width: 0 2px 2px 0;
	-webkit-transform: rotate(45deg) translateX(-50%);
	-ms-transform: rotate(45deg) translateX(-50%);
	transform: rotate(45deg) translateX(-50%);
	display: none;
}

.CheckIpt:checked::after
{
	display: block;
}

.CheckText
{
	color: #808080;
	flex: 1;
	font-size: 3.733vw;
}

/*1***     Radiobox     *****/
.RadioBox
{
	display: flex;
	align-items: center;
	justify-content: center;
}

.RadioIpt
{
	background: white;
	border: 1px solid #808080;
	border-radius: 999rem;
	width: 5.33vw;
	height: 5.33vw;
	position: relative;
	margin: 0 2.666vw 0 0 !important;
}

.RadioIpt:checked
{
	background: #E5C25B;
}

.RadioText
{
	color: #808080;
	font-size: 3.733vw;
}

/*1***     form     *****/
.FormBox
{
	width: 100%;
}

.FormRow
{
	width: 100%;
	text-align: center;
}

.FormRow:not(:last-child)
{
	margin: 0 0 30px 0;
}

.FormTit
{
	color: #BCBDD9;
	width: 100%;
	font-size: 19px;
	margin: 0 0 10px 0;
}

.FormCont
{
	width: 100%;
}

.FormCont .Ipt
{
	border: 1px solid #746F8B;
	background: #333333;
	border-radius: 5px;
	width: 100%;
}

.FormCont .Ipt input
{
	color: #FFFFFF;
	text-align: center;
	min-height: 10.7vw;
}

.FormCont .Ipt input::placeholder
{
	color: #CCCCCC;
}

.jumpMsgBtn.login
{
	background: #00AB06;
}

.jumpMsgBtn.has
{
	background: #808080;
}

.jumpMsgBtn.register
{
	background: #B876F2;
}

/*1***     彈窗     *****/
.PopBox
{
	width: 100%;
	position: fixed;
	height: 100vh;
	top: 0;
	left: 0;
	z-index: 1000;
	transition: all 5s;
	opacity: 0;
	display: none;
}

.PopBox.active
{
	opacity: 1;
	animation: popAni .5s;
	display: block;
}

@keyframes popAni
{
	from
	{
		opacity: 0;
	}

	to
	{
		opacity: 1;
	}
}

.PopContainer
{
	background: #212428;
	border: 1px solid #707070;
	width: calc(100% - 6.66vw);
	position: absolute;
	border-radius: 4vw;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 13;
}

.PopBox.small .PopContainer
{
	width: calc(100% - 25.333vw);
}

.PopTop
{
	text-align: center;
	width: 100%;
	position: relative;
}

.PopTit
{
	color: #FFFFFF;
	font-size: 8vw;
	width: 100%;
	padding: 4vw 2.666vw;
}

.PopBox.small .PopTit
{
	font-size: 4.533vw;
}

.PopX
{
	color: #FFFFFF;
	border-radius: 1.333vw;
	position: absolute;
	top: 50%;
	right: 2.666vw;
	transform: translateY(-50%);
	z-index: 1;
	font-size: 3.733vw;
	width: 6.4vw;
	height: 6.4vw;
	line-height: 6.4vw;
}

.PopContBox
{
	width: 100%;
	word-break: break-all;
	padding: 5.33vw;
}

.PopCont
{
	width: 100%;
	overflow-y: auto;
	padding: 0 8vw;
	/* max-height: 60vh; */
	max-height: 50vh;
}

.PopCont::-webkit-scrollbar
{
	background: transparent;
	width: 1.333vw;
	border-radius: 999rem;
}

.PopCont::-webkit-scrollbar-thumb
{
	background: #3a3a3a;
	border-radius: 999rem;
}

.PopMsg
{
	color: #FFFFFF;
	text-align: center;
	font-size: 4.533vw;
}

.PopBox.msg .PopMsg
{
	padding: 5.33vw 0 0 0;
}

.PopBtnBox
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	text-align: center;
	padding: 4vw 16vw;
}

.PopBox.msg .PopBtnBox
{
	padding: 4vw 16vw 8vw 16vw;
}

.PopBtnBox.one
{
	justify-content: center;
}

.PopBtn
{
	background: #00AB06;
	width: fit-content;
	border-radius: 2.666vw;
}

.PopBox.small .PopBtn
{
	border-radius: 1.333vw;
}

.PopBtn.cancel
{
	background: #707070;
}

.PopBtnTxt
{
	color: white;
	width: 100%;
	display: block;
	height: 100%;
	min-width: 20vw;
	font-size: 5.6vw;
	padding: 1.333vw;
}

.PopBox.small .PopBtnTxt
{
	font-size: 4vw;
	padding: 1.066vw 1.333vw;
	min-width: 14.4vw;
}

.PopImg
{
	width: auto;
	max-width: 100%;
}

.PopBg
{
	width: 100%;
	position: absolute;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	z-index: 12;
}

/*1***     按鈕     *****/
/*2**    ㄟ妳    ****/
.BtnAny
{
	background: #00AB06;
	color: white;
	width: fit-content;
	text-align: center;
	padding: 1.333vw 2.666vw;
	font-size: 4.266vw;
}

/*1***     共同     *****/
.Container
{
	width: 100%;
	padding: 13.33vw 0 0 0;
	min-height: calc(100vh - 36.8vw);
}

.Container.index_0,
.Container.info_0,
.Container.newbie_0,
.Container.guide_0
{
	padding: 0;
}

/*1***     Header     *****/
header
{
	background: rgba(0,0,0,.6);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
}

.headerContainer
{
	width: 100%;
	text-align: center;
	position: relative;
}

.headerName
{
	color: #FFFFFF;
	width: fit-content;
	margin: 0 auto;
	width: 54.666vw;
}

.headerBtnMenu
{
	width: 9.333vw;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 5.33vw;
	z-index: 99;
}

/*1***     Menu     *****/
.menuBox
{
	width: 100%;
	position: fixed;
	top: 0;
	transition: all .5s;
	z-index: 100;
	right: -100%;
}

.menuBox.active
{
	right: 0;
}

.menuInner
{
	background: #212428;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: column;
	margin: 0 0 0 auto;
	overflow-y: auto;
	overflow-x: hidden;
	height: 100vh;
	width: 66.666vw;
	padding: 0 0 4vw 0;
}

.menuTop
{
	width: 100%;
	padding: 0 0 26.666vw 0;
}

.menuBot
{
	position: relative;
	width: 100%;
}

.menuBg
{
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
}

/*2**    Menu-X    ****/
.menuBtnX
{
	width: 5.33vw;
	margin: 1.333vw 1.333vw 2.666vw auto;
}

/*2**    Menu-社群    ****/
.menuSocialBtnBox
{
	border-bottom: 1px solid #5D5D5D;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	padding: 4vw 0;
}

.menuSocialBtn
{
	width: 8vw;
}

.menuSocialBtn:not(:last-child)
{
	margin: 0 4vw 0 0;
}

/*2**    Menu-選單    ****/
.menuListBox
{
	width: 100%;
	margin: 0 0 8vw 0;
}

.menuList
{
	border-bottom: 1px solid #5D5D5D;
	width: 100%;
	text-align: center;
}

.menuListTit
{
	color: #FFFFFF;
	font-size: 4.266vw;
	padding: 4.533vw 0;
}

/*2**    Menu-綁定/會員中心    ****/
.menuStatusBox
{
	width: 100%;
}

.menuStatus
{
	border: 1px solid #FFFFFF;
	width: fit-content;
	display: flex;
	align-items: center;
	justify-content: center;
	word-break: break-all;
	margin: 0 auto;
	padding: 2.666vw 5.33vw 2.666vw 2.666vw;
}

.menuStatusPic
{
	width: 5.33vw;
	margin: 0 8vw 0 0;
}

.menuStatusTxt
{
	color: #FFFFFF;
	font-size: 4.266vw;
}

/*2**    Menu-語系    ****/
.menuLangBox
{
	width: 100%;
}

/*3*   Menu-語系-目前語言   ***/
.menuLang
{
	border: 1px solid #FFFFFF;
	width: fit-content;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	border-radius: 2.666vw;
	padding: 1.333vw 2.666vw;
}

.menuLangTxt
{
	color: #FFFFFF;
	font-size: 4.266vw;
	margin: 0 2.666vw 0 0;
}

.menuLangDecro
{
	border-color: transparent transparent #FFFFFF transparent;
	width: 0;
	height: 0;
	content: '';
	border-style: solid;
	pointer-events: none;
	z-index: 2;
	border-width: 0 2.4vw 3.733vw 2.4vw;
}

/*3*   Menu-語系-選單   ***/
.menuLangListBox
{
	background: rgba(33,36,40,38);
	position: absolute;
	bottom: 12vw;
	left: 100%;
	transition: all .5s;
	z-index: 100;
	width: 48vw;
}

.menuLangListBox.active
{
	left: 50%;
	transform: translateX(-50%);
}

.menuLangList
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	word-break: break-all;
	padding: 2.666vw;
}

.menuLangList:not(:last-child)
{
	margin: 0 0 1px 0;
}

.menuLangListSel
{
	border: 1px solid #FFFFFF;
	background: #212428;
	border-radius: 999rem;
	width: 6.66vw;
	height: 6.66vw;
}

.menuLangList.active .menuLangListSel
{
	position: relative;
}

.menuLangList.active .menuLangListSel::after
{
	background: #04D4F4;
	border-radius: 999rem;
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 1;
	width: 3.466vw;
	height: 3.466vw;
}

.menuLangListTxt
{
	color: #FFFFFF;
	flex: 1;
	text-align: center;
	font-weight: bold;
	font-size: 4.266vw;
}

/*1***     login     *****/
.loginBox
{
	width: 100%;
	padding: 16vw 10.666vw 8vw 10.666vw;
}

.loginForeWordBox
{
	text-align: center;
	margin: 0 0 2.666vw 0;
}

.loginForeWord
{
	color: #FFFFFF;
	font-size: 4vw;
}

.loginGuide
{
	color: #707070;
	text-align: center;
	font-size: 3.2vw;
	margin: 0 0 12vw 0;
}

.loginPlatBox
{
	border: 1px solid #707070;
	border-radius: 2.666vw;
	width: 100%;
}

.loginPlatBox.active
{
	border-radius: 4vw 4vw 0 0;
}

.loginPlatBtnBox
{
	width: 100%;
}

.loginPlatBtn
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 3.466vw 6.66vw;
}

.loginPlatBtn:not(:last-child)
{
	border-bottom: 1px solid #707070;
}

.loginPlatBtnPic
{
	width: 5.86vw;
	margin: 0 3.2vw 0 0;
}

.loginPlatBtnTit
{
	color: #FFFFFF;
	word-break: break-all;
	font-size: 4vw;
}

.loginPlatMore
{
	border-top: 1px solid #707070;
	color: #FFFFFF;
	text-align: center;
	word-break: break-all;
	padding: 3.466vw 0;
	font-size: 4vw;
}

.loginPlatMore:hover
{
	background: #00AB06;
}

/*1***     彈窗2     *****/
.jumpMsgBox.style2 .jumpMsgContainer
{
	background: linear-gradient(to bottom,#606065,#343338) !important;
	box-shadow: 0 3px 6px 0 #000000 !important;
	border: unset !important;
}

.jumpMsgBox.style2 .jumpMsgTop
{
	background: #000000 !important;
}

.jumpMsgBox.style2 .jumpMsgTit
{
	padding: 12px 10px !important;
}

.jumpMsgBox.style2 .jumpMsgContent
{
	width: calc(100% - 80px);
	margin: 25px 40px 15px 40px !important;
}

.jumpMsgBox.style2 .jumpMsgBtnBox
{
	padding: 45px 40px 20px 40px !important;
}

.jumpMsgBox.style2 .jumpMsgBtnCell:not(:last-child)
{
	margin: 0px 20px 0 0 !important;
}

.jumpMsgBox.style2 .jumpMsgBtnTxt
{
	font-weight: bold;
	padding: 12px 16px !important;
	font-size: 18px !important;
}

.jumpX
{
	color: #FFFFFF;
	font-weight: bold;
	position: absolute;
	top: 0;
	right: 10px;
	z-index: 2;
	font-size: 20px;
}

/*1***     Index     *****/
.indexBox
{
	width: 100%;
	padding: 0 0 8vw 0;
}

/*2**    Index-上方圖片    ****/
.indexBg
{
	width: 100%;
}

.indexBg video
{
	width: 100%;
}

/*2**    Index-介紹    ****/
.indexInfBox
{
	width: 100%;
	display: flex;
	align-items: stretch;
	justify-content: flex-start;
	white-space: nowrap;
	overflow-x: auto;
	padding: 8vw 0 6.66vw 6.66vw;
}

.indexInfBlock
{
	border: 1px solid #3E4044;
	background: #282B2F;
	box-shadow: 15px 15px 10px 0 rgba(0,0,0,.16);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	border-radius: 1.333vw;
	min-width: 32vw;
	padding: 0 2.133vw 1.066vw 2.133vw;
}

.indexInfBlock:not(:last-child)
{
	margin: 0 8vw 0 0;
}

.indexInfPic
{
	width: 10.133vw;
	padding: 4vw 0;
}

.indexInfTit
{
	color: #FFFFFF;
	text-align: center;
	word-break: break-word;
	width: 100%;
	white-space: normal;
	font-size: 3.2vw;
}

/*2**    Index-block    ****/
.indexBlockBox
{
	width: 100%;
	padding: 0 6.66vw;
}

.indexBlock
{
	width: 100%;
}

.indexBlock:not(:last-child)
{
	margin: 0 0 8vw 0;
}

.indexBlockTopic
{
	color: #FFFFFF;
	width: 100%;
	font-size: 4.266vw;
	margin: 0 0 6.66vw 0;
}

.indexBlockCont
{
	width: 100%;
}

/*3*   Index-抽獎   ***/
.indexDrawBox
{
	display: flex;
	align-items: stretch;
	justify-content: flex-start;
	white-space: nowrap;
	overflow-x: auto;
	margin: 0 auto;
	width: calc(100% - 10.666vw);
}

.indexDraw
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: column;
	min-width: 50%;
	width: 50%;
	padding: 0 8vw
}

.indexDraw:not(:first-child)
{
	position: relative;
}

.indexDraw:not(:first-child)::after
{
	background: #707070;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	z-index: 1;
	content: '';
	display: block;
	width: 1px;
	height: 70%;
}

.indexDrawImg
{
	width: 20vw;
	margin: 0 auto 4vw auto;
}

.indexDrawInfo
{
	color: #FFFFFF;
	border-top: 1px solid #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
	flex: 1;
	word-break: break-all;
	white-space: normal;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	width: 100%;
	font-size: 3.2vw;
	padding: 2.666vw 0;
}

/*3*   Index-盲盒   ***/
.indexGoodsBox
{
	width: 100%;
}

.indexGoodsPicBox
{
	width: 61.333vw;
	margin: 0 auto;
}

.indexGoodsPic
{
	width: 100%;
}

.indexGoodsPicTit
{
	color: #FFFFFF;
	text-align: center;
	font-size: 3.466vw;
	margin: 0 0 6.66vw 0;
}

.indexGoodsDetailBox
{
	border: 1px solid #707070;
	border-radius: 2.666vw;
	text-align: center;
	margin: 0 auto;
	width: calc(100% - 10.666vw);
}

.indexGoodsDetailRow
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	word-break: break-all;
}

.indexGoodsDetailRow:not(:last-child)
{
	border-bottom: 1px solid #707070;
}

.indexGoodsDetailPackage0,.indexGoodsDetailTxt
{
	flex: 1;
	padding: 2.666vw 1.333vw;
}

.indexGoodsDetailPackage0
{
	border-right: 1px solid #707070;
}

.indexGoodsDetailTit,.indexGoodsDetailTxt
{
	font-size: 3.733vw;
}

.indexGoodsDetailTit
{
	color: #FFFFFF;
}

.indexGoodsDetailTxt
{
	color: #FFF67B;
	border-left: 1px solid #707070;
}

.indexGoodsDetailTotal
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	padding: 2.133vw 0;
}

.indexGoodsDetailTotalTxt
{
	color: #FFFFFF;
	font-size: 3.733vw;
}

.indexGoodsDetailTotalImg
{
	width: 5.86vw;
	margin: 0 2.666vw;
}

/*1***     會員中心     *****/
/*2**    會員中心-inf    ****/
.CenterInfBox
{
	width: calc(100% - 4.266vw);
	word-break: break-all;
	border-radius: 1.333vw;
	padding: 5.33vw 2.666vw;
	margin: 0 auto 5.33vw auto;
}

.CenterInfTit
{
	color: #FFFFFF;
	font-size: 4.266vw;
}

.CenterInfBot
{
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

.CenterInfLink,.CenterInfName
{
	font-size: 4.266vw;
}

.CenterInfLink
{
	color: #FFFFFF;
	flex: 1;
}

.CenterInfName
{
	color: #FFFFFF;
	padding: 0 0 0 1.333vw;
}

/*2**    會員中心-tab    ****/
.CenterTabBox,.CenterCont
{
	margin: 0 auto;
	width: calc(100% - 6.933vw);
}

.CenterTabBox
{
	border: 1px solid #707070;
	border-bottom: unset;
	border-radius: 4vw 4vw 0 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.CenterTab
{
	flex: 1;
	text-align: center;
}

.CenterTab.active
{
	background: #00AB06;
}

.CenterTab:first-child
{
	border-radius: 4vw 0 0 0;
}

.CenterTab:last-child
{
	border-radius: 0 4vw 0 0;
}

.CenterTab:not(:last-child)
{
	border-right: 1px solid #707070;
}

.CenterTabTxt
{
	color: #FFFFFF;
	font-size: 3.733vw;
	padding: 1.866vw 0;
}

/*2**    會員中心-cont    ****/
.CenterCont
{
	border: 1px solid #707070;
	box-shadow: 15px 15px 10px rgba(0,0,0,.16);
	text-align: center;
	position: relative;
	border-radius: 0 0 4vw 4vw;
	padding: 2.133vw;
	min-height: calc(100vh - 103.2vw);
}

.CenterCont .NoData
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 2;
}

/*3*   會員中心-cont-Item   ***/
.CenterItemBox
{
	width: 100%;
	display: flex;
	align-items: stretch;
	justify-content: flex-start;
	flex-wrap: wrap;
	margin: 0 0 -1.6vw 0;
}

.CenterItem
{
	border: 1px solid #707070;
	box-shadow: 10px 10px 10px rgba(0,0,0,.16);
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: column;
	word-break: break-all;
	border-radius: 4vw;
	width: calc((100% - 1.6vw)/2);
	margin: 0 0 1.6vw 0;
}

.CenterItem:not(:nth-child(2n))
{
	margin: 0 1.6vw 1.6vw 0;
}

.CenterItemPic
{
	width: 59%;
	margin: 0 auto;
	padding: 8vw 0;
}

.CenterItemInf
{
	border-top: 1px solid #707070;
	width: 100%;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: column;
	flex: 1;
}

.CenterItemName
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.CenterItemNameIcon
{
	width: 4.533vw;
	margin: 0 1.333vw 0 0;
}

.CenterItemNameTxt
{
	color: #FFFFFF;
	font-size: 3.733vw;
}

/*3*   會員中心-cont-資訊   ***/
.CenterDataBox
{
	width: 100%;
	padding: 2.666vw;
}

.CenterDataList
{
	text-align: left;
	word-break: break-all;
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
}

.CenterDataList:not(:last-child)
{
	margin: 0 0 2.666vw 0;
}

.CenterDataCell0,.CenterDataCell1
{
	color: #FFFFFF;
	font-size: 3.4666vw;
}

.CenterDataCell0
{
	max-width: 32vw;
	margin: 0 1.333vw 0 0;
}

.CenterDataCell1
{
	flex: 1;
}

/*1***     抽獎紀錄     *****/
.drawrcdBox
{
	padding: 8vw 0;
}

.drawrcdBox .CenterItemInf
{
	padding: 1.6vw 0;
}

.drawrcdItemCountBox,.drawrcdItemWin
{
	width: 100%;
	margin: 2.666vw 0;
}

.drawrcdItemCountBox
{
	color: #FB2A30;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	flex-wrap: wrap;
}

.drawrcdItemCountNum
{
	font-size: 3.733vw;
}

.drawrcdItemCountUnit
{
	transform: scale(.9);
	font-size: 3.2vw;
}

.drawrcdItemCountUnit:not(:first-child)
{
	margin: 0 1.066vw 0 0;
}

.drawrcdItemWin
{
	color: #FFFFFF;
	flex: 1;
	font-size: 3.2vw;
}

.drawrcdItemStatus
{
	border: 1px solid #FB2A30;
	width: fit-content;
	text-align: center;
	margin: 0 auto;
	border-radius: 999rem;
	padding: 0 2.133vw;
	min-width: 16vw;
}

.drawrcdItemStatus.ed
{
	background: #707070;
	border: unset;
}

.drawrcdItemStatus.ing
{
	background: #FB2A30;
	border: unset;
}

.drawrcdItemStatusTxt
{
	color: #FFFFFF;
	font-size: 3.2vw;
}

/*1***     購買紀錄     *****/
.goodsrcdBox
{
	padding: 8vw 0;
}

.goodsrcdBox .CenterItemInf
{
	border-top: unset;
	padding: 2.666vw 0 4vw 0;
}

.goodsPrize
{
	color: #FFF67B;
	margin: 4vw 0 0 0;
	font-size: 5.33vw;
}

/*1***     抽獎專區     *****/
.drawBox
{
	width: 100%;
	padding: 5.33vw 0 9.333vw 0;
}

/*2**    抽獎專區-共同-tab    ****/
.DrawTabBox
{
	width: 100%;
	display: flex;
	align-items: stretch;
	justify-content: center;
	text-align: center;
	margin: 0 0 8vw 0;
}

.DrawTab
{
	border: 1px solid #707070;
	border-radius: 2.666vw;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.DrawTab:not(:last-child)
{
	margin: 0 3.466vw 0 0;
}

.DrawTab.active
{
	background: #00AB06;
	border: unset;
}

.DrawTabTxt
{
	color: #FFFFFF;
	font-size: 4.266vw;
	padding: 2.666vw 1.333vw;
	min-width: 26.666vw;
}

/*2**    抽獎專區-共同-block    ****/
.DrawBlockBox
{
	width: 100%;
	padding: 0 13.33vw;
}

.DrawBlock
{
	border: 1px solid #707070;
	border-radius: 2.666vw;
	width: 100%;
}

.DrawBlock:not(:last-child)
{
	margin: 0 0 5.33vw 0;
}

.DrawBlockTopic
{
	border-bottom: 1px solid #707070;
	color: #FFFFFF;
	text-align: center;
	width: 100%;
	font-size: 3.733vw;
	padding: 1.066vw 0;
}

.DrawBlockCont
{
	width: 100%;
}

/*2**    抽獎專區-item    ****/
.drawItem
{
	text-align: center;
	word-break: break-all;
	width: 70%;
	margin: 0 auto;
	padding: 0 0 6.66vw 0;
}

.drawItem:not(:last-child)
{
	position: relative;
}

.drawItem:not(:last-child)::after
{
	background: #E1E1E1;
	display: block;
	content: '';
	width: 100%;
	height: 1px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
	z-index: 1;
}

.drawItemPic
{
	width: 52.35%;
	margin: 0 auto;
	padding: 5.33vw 0;
}

.drawItemName
{
	color: #FFFFFF;
	border-top: 1px solid #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
	margin: 0 auto;
	width: fit-content;
	min-width: 26.666vw;
	font-size: 3.733vw;
	padding: 2.666vw 0;
}

.drawItemCountBox
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 4vw auto;
}

.drawItemCount
{}

.drawItemCountNum
{
	color: #FB2A30;
	font-size: 5.6vw;
}

.drawItemCountUnit
{
	color: #FFFFFF;
	font-size: 3.2vw;
}

.drawItemBtn
{
	background: #00AB06;
	text-align: center;
	width: fit-content;
	border-radius: 999rem;
	margin: 0 auto;
	min-width: 27.2vw;
}

.drawItemBtnTxt
{
	color: #FFFFFF;
	padding: .533vw 0;
	font-size: 4.266vw;
}

/*2**    抽獎專區-登記    ****/
.drawFillBox
{
	width: 100%;
}

.drawFill
{
	width: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	margin: 0 0 2.666vw 0;
}

.drawFillTit
{
	color: #FFFFFF;
	font-size: 4.533vw;
	margin: 0 1.333vw 0 0;
}

.drawFill .Ipt
{
	flex: 1;
}

.drawFillNotice
{
	color: #707070;
	text-align: center;
	width: 100%;
	font-size: 3.2vw;
}

/*1***     禮物     *****/
.giftrcdBox
{
	padding: 8vw 0;
}

.giftrcdBox .CenterItemInf
{
	border-top: unset;
	padding: 2.666vw 0 4vw 0;
}

.giftrcdStatus
{
	color: #EB1034;
	text-align: center;
	font-size: 4.3478vw;
}

.giftrcdStatus.win
{
	color: #FFF67B;
}

.giftrcdBtn0
{
	background: #00AB06;
	color: #FFFFFF;
	text-align: center;
	border-radius: 999rem;
	margin: 0 auto;
	padding: 2px 0;
	min-width: 165px;
	font-size: 6.0386vw;
}

.giftrcdKind
{
	color: #FFF67B;
	margin: 4vw 0 0 0;
	font-size: 5.33vw;
}

.giftrcdItemCountBox
{
	color: #FB2A30;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	flex-wrap: wrap;
}
.giftrcdItemCountUnit
{
	transform: scale(.9);
	font-size: 3.2vw;
}

.giftrcdItemCountUnit:not(:first-child)
{
	margin: 0 1.066vw 0 0;
}

.giftrcdPrice
{
	color: #FFF;
	text-align: center;
	font-size: 4.3478vw;
}

/*1***     中獎名單     *****/
.winlistBox
{
	width: 100%;
	padding: 5.33vw 0 9.333vw 0;
}

.winlistItem
{
	text-align: center;
	word-break: break-all;
	margin: 0 auto;
	width: 70%;
	padding: 0 0 4vw 0;
}

.winlistItem:not(:last-child)
{
	position: relative;
}

.winlistItem:not(:last-child)::after
{
	background: #707070;
	display: block;
	content: '';
	width: 100%;
	height: 1px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
	z-index: 1;
}

.winlistItemPic
{
	width: 78%;
	margin: 0 auto;
	padding: 5.33vw 0;
}

.winlistItemName
{
	color: #FFF67B;
	margin: 5.33vw 0;
	font-size: 5.86vw;
}

.winlistItemTit
{
	color: #FFFFFF;
	font-size: 4.8vw;
}

.winlistItemTxt
{
	color: #FFFFFF;
	font-size: 4.8vw;
}

/*1***     購買     *****/
.goodsBox
{
	width: 100%;
	text-align: center;
	padding: 1.333vw 0 8vw 0;
}

.goodsTopBox
{
	width: 100%;
	padding: 0 0 5.333vw 0;
}

/*2**    購買-logo    ****/
.goodsLogoBox
{
	width: 61.333vw;
	margin: 0 auto;
}

.goodsLogo
{
	width: 100%;
}

/*2**    購買-產品    ****/
.goodsLeftBox
{
	width: 100%;
}

.goodsPro
{
	color: #FFFFFF;
	width: 100%;
	font-size: 3.466vw;
	margin: 0 0 8vw 0;
}

/*2**    購買-敘述    ****/
.goodsForeBox
{
	color: #FFFFFF;
	margin: 0 auto;
	word-break: break-all;
	width: 85%;
	font-size: 3.2vw;
}

/*2**    購買-數量    ****/
.goodsAmountBox
{
	background: #282B2F;
	border: 1px solid #3E4044;
	box-shadow: 15px 15px 10px 0 rgba(0,0,0,.2);
	margin: 5.33vw auto;
	width: 78%;
	padding: 2.133vw;
}

.goodsAmountNum
{
	display: flex;
	align-items: center;
	justify-content: center;
}

.goodsAmountNum0
{
	color: #FFFFFF;
	font-size: 4.266vw;
	margin: 0 1.333vw 0 0;
}

.goodsAmountNum1
{
	color: #FFF67B;
	font-size: 5.33vw;
}

.goodsAmountName
{
	color: #FFFFFF;
	font-size: 3.2vw;
}

.goodsAmountTit
{
	color: #FFFFFF;
	font-size: 3.2vw;
}

/*2**    購買-未來公售    ****/
.goodsFutureBox
{
	color: #FFFFFF;
	font-size: 3.733vw;
}

/*2**    購買-折扣    ****/
.goodsCodeBox
{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin: 3.2vw auto 4.533vw auto;
	width: 72%;
}

.goodsCodeTit,
.goodsCodeBox .Ipt input
{
	font-size: 3.466vw;
}

.goodsCodeTit
{
	color: #FFFFFF;
	width: fit-content;
	font-size: 3.2vw;
}

.goodsCodeBox .Ipt
{
	flex: 1;
	margin: 0 13.33vw 0 4vw;
}

.goodsCodeBtnApply
{
	background: #E1E1E1;
	justify-self: flex-end;
	width: fit-content;
}

.goodsCodeBtnApplyTxt
{
	color: #707070;
	font-size: 3.2vw;
	padding: .533vw 2.133vw;
}

/*2**    購買-購買    ****/
.goodsActBtnBox
{
	width: 100%;
}

.goodsActBtn
{
	background: #00AB06;
	width: fit-content;
	margin: 0 auto;
	border-radius: 1.333vw;
}

.goodsActBtnTxt
{
	color: #FFFFFF;
	font-size: 4.266vw;
	min-width: 21.333vw;
	padding: .533vw 1.333vw;
}

/*2**    購買-尚未開放    ****/
.goodsActNoYetBox
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.goodsActNoYet
{
	color: #FFFFFF;
	font-size: 4.266vw;
	margin: 0 2.666vw 0 0;
}

.goodsActNoYetCheck .active,
.goodsActNoYetCheck.active .original
{
	display: none;
}

.goodsActNoYetCheck.active .active
{
	display: block;
}

.goodsActNoYetCheck i
{
	color: #FFF67B;
	font-size: 4.266vw;
}

/*2**    購買-Opensea連結    ****/
.goodsOpenLinkBox
{
	width: 100%;
	text-align: center;
	margin: 3.2vw 0 0 0;
}

.goodsOpenLink
{
	color: #2081e2;
	font-size: 6.03vw;
}

/*2**    購買-獎項資訊    ****/
.goodsLevelBox
{
	border: 1px solid #707070;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 80%;
	border-radius: 2.666vw;
	margin: 2.666vw auto 6.66vw auto;
}

.goodsLevelBlock
{
	flex: 1;
	word-break: break-all;
}

.goodsLevelBlock:not(:last-child)
{
	border-right: 1px solid #707070;
}

.goodsLevelTit,.goodsLevelTxt
{
	font-size: 3.2vw;
	padding: 3.2vw 0;
}

.goodsLevelTit
{
	color: #FFFFFF;
	border-bottom: 1px solid #707070;
}

.goodsLevelTxt
{
	color: #FFFFFF;
}

/*2**    購買-相同版面內容    ****/
.goodsBlockBox
{
	width: 100%;
	padding: 0 3.466vw;
}

.goodsBlock
{
	width: 100%;
}

.goodsBlock:not(:last-child)
{
	margin: 0 0 5.33vw 0;
}

.goodsBlockTopic
{
	color: #FFFFFF;
	text-align: left;
	width: 100%;
	font-size: 4.266vw;
	margin: 0 0 4.266vw 0;
}

.goodsBlockCont
{
	width: 100%;
}

/*2**    購買-相同版面內容-稀有度    ****/
.goodsRareBox
{
	width: 100%;
}

/*3*   購買-相同版面內容-稀有度-Tab   ***/
.goodsRareTabBox
{
	border: 1px solid #707070;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 2.666vw 2.666vw 0 0;
}

.goodsRareTab
{
	flex: 1;
	padding: 1px 0;
}

.goodsRareTab:first-child
{
	border-radius: 2.666vw 0 0 0;
}

.goodsRareTab:last-child
{
	border-radius: 0 2.666vw 0 0;
}

.goodsRareTab:not(:last-child)
{
	border-right: 1px solid #707070;
}

.goodsRareTab.active
{
	background: #00AB06;
}

.goodsRareTabTxt
{
	color: #FFFFFF;
	font-size: 3.2vw;
}

/*3*   購買-相同版面內容-稀有度-項目   ***/
.goodsRareItemBox
{
	border: 1px solid #707070;
	border-top: unset;
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	place-content: flex-start;
	border-radius: 0 0 2.666vw 2.666vw;
	padding: 3.2vw 3.2vw 0 3.2vw;
	min-height: 86.666vw;
}

.goodsRareItem
{
	width: calc((100% - 6.4vw)/3);
	margin: 0 0 3.2vw 0;
}

.goodsRareItem:not(:nth-child(3n))
{
	margin: 0 3.2vw 3.2vw 0
}

/*2**    購買-相同版面內容-獎勵金    ****/
.goodsDetailBox
{
	border: 1px solid #707070;
	border-radius: 2.666vw;
	text-align: center;
	margin: 0 auto;
	width: 75%;
}

.goodsDetailRow
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	word-break: break-all;
}

.goodsDetailRow:not(:last-child)
{
	border-bottom: 1px solid #707070;
}

.goodsDetailPackage0,.goodsDetailTxt
{
	flex: 1;
	padding: 2.666vw 1.333vw;
}

.goodsDetailPackage0
{
	border-right: 1px solid #707070;
}

.goodsDetailTit,.goodsDetailTxt
{
	font-size: 3.733vw;
}

.goodsDetailTit
{
	color: #FFFFFF;
}

.goodsDetailTxt
{
	color: #FFF67B;
	border-left: 1px solid #707070;
}

.goodsDetailTotal
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	padding: 2.133vw 0;
}

.goodsDetailTotalTxt
{
	color: #FFFFFF;
	font-size: 3.733vw;
}

.goodsDetailTotalImg
{
	width: 5.86vw;
	margin: 0 2.666vw;
}

/*2**    購買-相同版面內容-即將購買    ****/
.goodsFillBox .PopTit
{
	padding: 5.33vw 2.666vw 1.333vw 2.666vw;
	font-size: 6.13vw;
}

.goodsFillBox .PopContainer
{
	border-radius: 8vw;
}

.goodsFillRow
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 6.66vw 0;
}

.goodsFillTit,.goodsFillUnit
{
	font-size: 6.13vw;
}

.goodsFillTit
{
	color: #FFFFFF;
}

.goodsFillRow .Ipt
{
	width: 10.666vw;
	margin: 0 1.333vw;
}

.goodsFillUnit
{
	color: #FFFFFF;
}

.goodsFillCoinBox
{
	width: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.goodsFillCoinPic
{
	width: 5.33vw;
}

.goodsFillCoinNum
{
	color: #FFFFFF;
	margin: 0 2.666vw;
	font-size: 8.533vw;
}

.goodsFillCoinName
{
	color: #FFFFFF;
	font-size: 6.4vw;
}

.goodsFillBox .PopBtnBox
{
	padding: 0 16vw 5.33vw 16vw;
}

/*2**    購買-相同版面內容-動畫    ****/
.goodsAniBox .PopCont
{
	padding: 0;
	max-height: fit-content;
}

/*2**    購買-相同版面內容-最終結果    ****/
.goodsResultBox .PopTit
{
	padding: 4vw 2.666vw 2.666vw 2.666vw;
}

.goodsResultBox .PopContainer
{
	border-radius: 8vw;
}

.goodsResultSubTit
{
	color: #FFFFFF;
	word-break: break-all;
	text-align: center;
	font-size: 8.533vw;
	margin: 0 0 6.66vw 0;
}

.goodsResultListBox
{
	width: 100%;
}

.goodsResultList
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.goodsResultList:not(:last-child)
{
	margin: 0 0 5.33vw 0;
}

.goodsResultListTit,.goodsResultListUnit,
.goodsResultListNum
{
	font-size: 7.46vw;
}

.goodsResultListTit
{
	color: #FFFFFF;
}

.goodsResultListNum
{
	color: #FFF67B;
	flex: 1;
	text-align: right;
	margin: 0 5.33vw 0 2.666vw;
}

.goodsResultListUnit
{
	color: #FFFFFF;
}

/*2**    購買-相同版面內容-填寫信箱    ****/
.goodsEmailBox .goodsFillRow .Ipt
{
	width: auto;
	flex: 1;
}

/*1***     商城 指南 新手-共同     *****/
.Main0Box
{
	padding: 20vw 0 8vw 0;
	min-height: calc(100vh - 51.466vw);
}

.Main0Container
{
	background: rgba(18,1,40,.6);
	box-shadow: 0 0 6px 13px rgba(0,0,0,.2);
	margin: 0 auto;
	position: relative;
	width: calc(100% - 10.666vw);
}

.Main0Inner
{
	border-image: linear-gradient(to right,#CA16C3 0%,#3B0370 30%,#3B0370 70%,#00E0FC 100%) 1;
	border-style: solid;
	position: relative;
	width: 100%;
	border-width: 1.333vw;
	min-height: calc(100vh - 67.466vw);
	padding: 6.66vw 2.666vw 21.333vw 2.666vw;
}

.Main0Cont
{
	color: #FFFFFF;
	text-align: center;
	font-size: 3.733vw;
	line-height: 8vw;
}

.Main0Block
{
	width: 100%;
}

.Main0BlockPr
{
	width: 100%;
	word-break: break-all;
}

.Main0BlockPr:not(:last-child)
{
	margin: 0 0 9.333vw 0;
}

.Main0BlockPr.small:not(:last-child)
{
	margin: 0 0 2.666vw 0;
}

.Main0BlockPr .highlight
{
	color: #41FF41;
}

.Main0BlockPr .title
{
	font-size: 4.266vw;
}

.Main0BlockPr .link
{
	color: #04D4F4;
}

.Main0BtnBox
{
	width: calc(100% - 5.33vw);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	bottom: 5.33vw;
}

.Main0Btn
{
	color: #ffffff;
	position: absolute;
	bottom: 0;
	z-index: 2;
	font-size: 8vw;
}

.Main0Btn:first-child
{
	left: 0;
}

.Main0Btn:last-child
{
	right: 0;
}

.Main0Decro,.Main0Dcro1,.Main0Dcro2
{
	position: absolute;
}

.Main0Decro
{
	z-index: 1;
	left: 50%;
	transform: translateX(-50%);
	bottom: -2.9333vw;
	width: 45.333vw;
}

.Main0Dcro1,.Main0Dcro2
{
	width: 10.666vw;
}

.Main0Dcro1
{
	top: 4vw;
	left: 4vw;
}

.Main0Dcro2
{
	right: 4vw;
	bottom: 4vw;
}

.MainPicBox
{
	width: calc(100% - 10.666vw);
	margin: 0 auto;
}

.MainPic img
{
	width: auto;
	max-width: 100%;
	margin: 0 auto;
}


.MainPic:not(:last-child)
{
	margin: 0 auto 4vw auto;
}

/*1***     商城     *****/
.infoBox
{
	width: 100%;
}

.infoPointBox
{
	width: 100%;
	word-break: break-all;
	position: relative;
}

.infoPointBox::after
{
	background: #10A4D6;
	content: '';
	display: block;
	width: 1px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	height: 100%;
	top: 2.666vw;
}

.infoPointBlock
{
	position: relative;
	line-height: initial;
	width: 37.866vw;
}

.infoPointBlock.main
{
	margin: 0 auto;
	z-index: 5;
	width: 44.266vw;
}

.infoPointBlock:not(.main)
{
	margin: 0 auto;
	padding: 0 4vw 0 0;
}

.infoPointBlock:not(.main):nth-child(2n-1)
{
	padding: 0 0 0 4vw;
}

.infoPointBlock:not(.main)::after
{
	background: #10A4D6;
	content: '';
	display: block;
	height: 1px;
	position: absolute;
	right: 0;
	z-index: 1;
	top: -2.666vw;
	width: 24vw;
}

.infoPointBlock:not(.main):nth-child(2n-1)::after
{
	left: 0;
}

.infoPointBlockTopic
{
	position: relative;
}

.infoPointBlockTopicImg
{
	filter: drop-shadow(0 0 6px rgba(0,0,0,.5));
	width: 100%;
}

.infoPointBlockTopicTxt
{
	color: #FFFFFF;
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 2;
	font-size: 4.266vw;
}

.infoPointBlock.main .infoPointBlockTopicTxt
{
	font-size: 4.8vw;
}

.infoPointBlockTit
{
	color: #41FF41;
	margin: 0 0 2.133vw 0;
	font-size: 3.2vw;
}

.infoPointBlock.main .infoPointBlockTxt
{
	text-align: right;
	font-size: 3.733vw;
}

.infoPointBlockTxt
{
	color: #FFFFFF;
	font-size: 3.2vw;
}

/*1***     新手     *****/
.newbieBox
{
	width: 100%;
}

/*1***     RoadMap     *****/
.mapBox
{
	width: 100%;
}

.mapBox.Main0Box
{
	padding: 10vw 0 8vw 0;
}

/*1***     gift     *****/
.giftBox
{
	width: 100%;
	padding: 20px 0;
}

.giftCont
{
	border: 1px solid #707070;
	margin: 0 auto;
	border-radius: 20px;
	width: calc(100% - 80px);
	padding: 15px;
}

.giftList
{
	color: #FFFFFF;
	text-align: center;
	font-size: 16px;
}

.giftList:not(:last-child)
{
	margin: 0 0 10px 0;
}

.giftCont .NoData
{
	padding: 50px 0;
}

/*1***     Footer     *****/
footer
{
	border-top: 1px solid #464749;
	background: #1C1C1C;
	width: 100%;
	padding: 2.666vw 0;
}

.footerContainer
{
	width: 100%;
}

/*2**    Footer-白皮書    ****/
.footerWhitepp
{
	width: 18.666vw;
	margin: 0 auto;
}

/*2**    Footer-社群    ****/
.footerSocialBtnBox
{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	padding: 2.666vw 0;
}

.footerSocialBtn
{
	width: 4vw;
}

.footerSocialBtn:not(:last-child)
{
	margin: 0 1.333vw 0 0;
}

/*2**    Footer-declare    ****/
.footerDeclare
{
	width: 100%;
	text-align: center;
	word-break: break-all;
}

.footerDeclare > div
{
	color: #FFFFFF;
	font-size: 3.2vw;
}