@charset "UTF-8";
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,th,p,a,li,td,b,i,div,textarea{  font-family: 'AlbertSans', "Lucida Grande", "Lucida Sans Unicode", "Arial", serif; line-height: 1.2; font-size: inherit; color: inherit;}
.dft_pw{ width: 100%; max-width: 1200px; margin-right: auto;  margin-left: auto; }
#footer .dft_pw{max-width: 1400px;}
.footer_block_share p{ color: #333;}

.dft_btn_plain{ display: block; padding: 12px 13px; border-radius: 10px; font-size: .2rem; font-weight: 700; color: #333 !important; text-align: center; border: 1px solid #ccc;}
.dft_btn_primary{ display: block; padding: 12px 13px; border-radius: 10px; font-size: .2rem; font-weight: 700; color: #fff !important; text-align: center; border: 1px solid transparent; background: radial-gradient(circle, #FC8B1C 0%, #FF5857 100%); background-size: 200% 100%;}
.dft_btn_primary2{ display: block; padding: 12px 13px; border-radius: 10px; font-size: .2rem; font-weight: 700; color: #FF7F21 !important; text-align: center; border: 1px solid transparent; background: #FF7F2126;}

.dft_btn_plain:hover{ text-decoration: none; border-color: #333;}
.dft_btn_primary:hover{ text-decoration: none; animation: gradientMarquee 1s infinite linear; box-shadow:0 5px 10px rgba(0, 0, 0, .25); transform: translateY(-2px); transition:all .2s cubic-bezier(0.165, 0.84, 0.44, 1);}
.dft_btn_primary2:hover{ text-decoration: none; background: #FF7F21; color: #fff !important;}
.dft_flex{ display: flex; justify-content: space-around; align-items: center;}

@keyframes gradientMarquee{
   0% { background-position: 100% 0; }
 100% { background-position: -100% 0;}
}




body{background: url(../pricing/img/bg.jpg) top center no-repeat; background-size:contain;}
.title{ width: 90%; max-width: 9.8rem; font-size: .6rem; color: #000; font-weight: 800; margin: .9rem auto .4rem auto; text-align: center;}
.purchase_switch{ display: flex;align-items: center; width: max-content; margin: 0 auto .4rem auto;}
.switch_btn{ width: 42px; height: 24px; border-radius: 56px; margin:0 10px; background: #FF7F21; overflow: hidden; cursor: pointer;}
.switch_btn p{ margin: 3px; width: 18px; height: 18px; border-radius: 100%;background-color: #fff; transition: transform .3s ease-in-out; transform: translateX(17px);}
.switch_on p{ transform: translateX(0);}
.purchase_switch span{ cursor: pointer; font-size: .16rem; color: #999;}
.purchase_switch .purchase_switch_active{ color:#000;}
.purchase_switch img{ margin-left: 5px;}

.purchase_wrap{ display: flex; color:#333;}
.purchase_item{ padding: .3rem; margin:0 .15rem; border: 1px solid #ccc; border-radius: 20px; background-color: #fff;}
.purchase_item h2{font-size: .4rem; font-weight: 700;}
.purchase_item>p{ margin: 10px auto; font-size: .16rem;}
.purchase_price{ font-size: .4rem; font-weight: 700; color: #333;display: flex; align-items: baseline;}
.purchase_price>span{ font-size: .16rem; font-weight: 400; color: #666;}
.purchase_price>p{margin-top: 10px; font-size: .16rem; color: #666; font-weight: 400; margin-left: 5px;}
.purchase_price_full{ width: max-content; margin-top: 10px; color: #999; font-size: .24rem; font-weight: 700; position: relative;}
.purchase_price_full>span{ font-size: .16rem; font-weight: 400;}
.purchase_price_full::after{ content: ""; border-top: 2px solid #999; display: block; width: 100%; position: absolute;
 top: .15rem; transform: rotate(5.67deg);}

.purchase_item ul{padding-top: .2rem; border-top: 1px dashed #ccc;}
.purchase_item ul li{ margin: .2rem 0; padding-left: .25rem; font-size: .16rem; color: #666; background: url(../pricing/img/purchase_li2.png) left center no-repeat; background-size: .16rem auto; position: relative;}
.buy_now_btn{ margin: .2rem auto .3rem auto;}
.purchase_item_free .buy_now_btn{margin-top:.6rem;}
.purchase_item_basic{ border-color:#FF9141; box-shadow: 0px 0px 10px 0px #A3450033; background: linear-gradient(180deg, #FF7F21 -62.21%, #FFFFFF 12.84%);}



.plan_detail{  margin: 1.2rem auto; text-align: center;}
.plan_detail h2{ font-size: .4rem; font-weight: 800; color: #000;}
.table_main{ margin-top: .4rem; padding:.3rem; box-shadow: 0px 0px 20px 0px #0000001A; border-radius: .3rem; background-color: #fff; overflow: hidden;}
.plan_detail table{ width: 100%; border-collapse: collapse; border-spacing: 0; }
th, td {padding: 10px .2rem; text-align: center; font-size: .14rem; font-weight: 700;}
.table_title th{ padding: .25rem; font-size: .2rem; font-weight: 700; background:none; border-radius: 8px 8px 0 0;}
table td:nth-child(1),table th:nth-child(1) {text-align: left;}
table td:nth-child(3),table th:nth-child(3) {background: #FFF9F5;}
table td:nth-child(1)>div{border-bottom: 1px dashed #ccc; padding-bottom: 10px; display: inline-block; font-weight: 500;}
table th{ color:#111111; background: #FF7F211A; border-radius: 8px;}
 
.faq h2{ font-size: .3rem; font-weight: 600; color: #000; text-align: center;}
.faq_item{ padding: .2rem .4rem; margin-top: 10px; background-color: #fff; border-radius: 20px; border: 1px solid #E6E6E6; position: relative;}
.faq_item::after{ content: "\e901"; font-family: "iconfont"; font-size: 14px; position: absolute; right: .4rem; top: .2rem;}


.faq_item>b{ display: block; font-size: .18rem; font-weight: 700; cursor: pointer;}
.faq_item_text { margin-top: .2rem; font-size: .16rem; font-weight: 500; color: #666; display: none;}
.faq_item_active::after{ transform:rotate(-180deg);}
.faq_item_active .faq_item_text{ display: block;}





/*checkout completed */
.checkout_completed{ width: 100%; height: 100%; z-index: 9; position: fixed; top: 0; left: 0; background: rgba(0,0,0,.8); display: none;}
.checkout_completed_main{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: .2rem; background: #fff; text-align: center; padding: .5rem;}
.checkout_completed_main h2{font-size: .24rem; font-weight: 600; margin:.2rem .4rem;}
.checkout_completed_main p{ max-width:4.2rem; margin: 0 auto; font-size: .14rem; font-weight: 500;}
.checkout_completed_main .checkout_completed_btn{width: 80%; margin: .3rem auto;}



/*checkout_popup */
.checkout_popup{ width: 100%; height: 100%; z-index: 9; position: fixed; top: 0; left: 0; background: rgba(0,0,0,.8);display: none;}
.checkout_popup_main{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: .2rem;  display: flex; justify-content: space-between; overflow: hidden; align-items: stretch; color:#333; background-color: #fff; }
.checkout_popup input{ padding: 5px 10px; border-radius: 5px; border: 1px solid #2C67FF;}
.checkout_popup_detail{ max-width: 3.1rem; padding:0.2rem .3rem; background-color: #FFF3E9;}
.checkout_popup_close, .checkout_completed_close{ position: absolute; right: 15px; top: 5px; font-size: .26rem; color:#666; z-index: 2; cursor: pointer;}
.popup_tab{ margin-top: .2rem; display: flex; justify-content: space-between; border-bottom: 1px solid #ccc; font-size: .16rem; cursor: pointer;}
.popup_tab>div{ width: 50%; padding-bottom: .2rem; text-align: center; }
.popup_tab span{  padding: 3px 10px; border-radius: .2rem; font-size: .14rem; color: #FF7F21; background: #FFD1AE;}

.popup_tab .popup_tab_active{ border-bottom: 2px solid  #FF7F21;}
.popup_price_block{ padding: .15rem; margin: .2rem 0; border-radius: 10px; font-size: .14rem; background-color: #fff;}
.popup_price_item p{ display: flex; justify-content: space-between; margin: .15rem 0;}
.popup_price_item{border-bottom: 1px dashed #ccc;}
.popup_price_item:nth-last-of-type(1){ border: none;}
.popup_current_price p{ margin-top: 20px;}
.coupon_icon{ width: 15px; vertical-align: middle; margin-right: 5px; opacity: 0.5;}
.due_today{ font-weight: bold;}
.popup_coupon_add{ display: block; margin: .15rem 0; color: #2C67FF;}

.popup_coupon input{ width: 60%;}
.popup_coupon .popup_coupon_button{ width:.8rem; height: .3rem; line-height: .3rem; color:#fff; background-color:#2C67FF; border-radius: 5px; text-align: center;}
.popup_coupon_button:hover{ background-color: #2352CC; text-decoration: none;}
.popup_coupon .loading{ width: .2rem; vertical-align: middle; margin-left: 5px; display: none;}

.popup_price_item .popup_coupon_enter{ margin-bottom: .15rem; display: none;}
.popup_price_item .popup_coupon_enter_show{ display: block;}
.popup_coupon_enter>div{ display: flex; justify-content: space-between;}

.checkout_popup_note{ font-size: 12px;}
.checkout_popup_note a{ color: #FF7F21;}
.email_wrap{ display: flex; align-items: center;}
.email_main>p{ margin-bottom: .2rem; font-size: .16rem; font-weight: 500; }
.email_main .checkout_button{margin-top: .2rem;}

.popup_payment{ display: none;}
.popup_payment, .email_wrap{ width: 3.1rem; height:5.3rem; padding:.5rem .3rem .1rem .3rem; position: relative; overflow: auto;}

.checkout_button{ display: block; border-radius: 10px; background: #2C67FF; color: #fff !important; font-size: .18rem; font-weight: 700; padding: 10px; text-align: center; cursor: pointer;}
.checkout_button:hover{ background-color: #2352CC; text-decoration: none;}

#payment_loading{ width: 26px; margin-left: 5px; vertical-align: middle; display: none;}
#payment-form{margin: .3rem 0; min-height: 2.7rem;}

.email_input{ width: calc(100% - .3rem); font-size: .16rem; height: 40px; border-radius: 10px; border-color:  #666;}
.checkout_popup .error,.error_msg{ border-color:#FF3333; color: #FF3333;}
.checkout_popup .error_msg{ margin-top: 5px; display: none;}
.loading_payment{ width: 100%; height: 70%; position: absolute; top: 20%; left: 0; z-index: 1; display: flex; justify-content: center; align-items: center;}
.loading_payment img{ display: block; width: .7rem; margin-bottom: 10px;}



.tips{ display: inline-block; position: relative; z-index: 2;}
.tips_icon{ font-size: 14px; font-style: normal; margin: 0 10px;}
.tips_icon::after{content: "\e911"; font-family: "iconfont"; }
.tips p{ width: 240px; position: absolute; left: -120px; background-color: #fff; border: 1px solid #E6E6E6; border-radius: 5px;font-size: .14rem; padding: 15px 10px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); text-align: center;}
.tips p::before {content: ""; display: inline-block; border: 8px solid transparent; border-bottom-color: #fff; position: absolute; top: -16px; left: 130px;}
.tips:hover p{ display: block;}
.tips p{ display: none;}

.highlight{ color: #FF7F21;}
.icon_support{ width: 16px; height:16px; border-radius: 100%; display: block; margin: 0 auto; background: url(../pricing/img/right.svg) no-repeat;}


.banner_early_bird{ position: relative;}
.banner_early_bird>img{ width: 100%;}
.countdown{ display: flex; justify-content: center; position: relative; bottom: 1.3rem;}
.countdown_item{ text-align: center;}
.countdown_item span{display: block; width: .6rem; height: .35rem; margin:0 auto 5px auto; line-height: .35rem; font-size: .2rem; background: url(../pricing/img/countdown_bg.png) no-repeat;  background-size: contain;}
.countdown_item  b{font-size: 12px; font-weight: 400; color:#412C14;}
.countdown_item1{height: .35rem; line-height: .35rem; font-size: .2rem; margin: 0 .1rem;}

@media screen and (max-width: 1400px) {
    .dft_pw{ padding-left: 0; padding-right: 0;}
	.countdown{ bottom: 0; margin-bottom: 20px;}
}
@media screen and (max-width: 980px) {
    .dft_pw{ width: 90%; padding: 0 5%;}
	.purchase_wrap{ display: block;}
	.purchase_item{ margin-top: 20px;}
}

