/*--Track Your Order--*/
.page-bg{min-height:calc(100vh - 450px);padding:100px 0 180px 0}
.page-bg .maxtitle{font-size:36px;color:var(--333);text-align:center;margin-bottom:60px}
.page-bg .page-main-box{max-width:400px;width:100%;margin:0 auto}
.page-main-box .title{font-size:18px;color:var(--333)}
.page-main-box .input-text-box:nth-child(2){margin-top:15px}
.page-main-box .button-box{width:100%}

/*--Track Your Order end--*/

/*--payment-successful--*/
.payment-succ-box{min-height:calc(100vh - 400px)}
.payment-succ-box .custome-succ-box{max-width:750px;width:100%;margin:0 auto;padding:100px 0 160px 0;text-align:center}
.custome-succ-box .pay-icomm{font-size:120px;color:var(--333)}
.custome-succ-box .title{font-size:18px;color:var(--333);margin-top:20px}

.payment-succ-ol{padding-left: 20px;text-align: left;margin-top: 30px;}
.payment-succ-ol .payment-succ-li{font-size: 16px; line-height: 22px; list-style: decimal; text-align: left;margin-bottom: 10px;color: var(--333);}
.payment-succ-ol .payment-succ-li .payment-b{color: var(--orange);}
.payment-succ-ol .payment-succ-li .payment-alink{color: var(--orange); text-decoration: none; border-bottom: 1px solid var(--orange);}
.payment-succ-ol .payment-succ-li .payment-alink:hover{color: var(--orangeH);border-bottom: 1px solid var(--orangeH);}
.custome-succ-box .button-box{padding: 0 40px;margin-top: 60px;}
.custome-succ-box .link-b{background: var(--orange);margin-left: 20px;}
.custome-succ-box .link-b:hover{background: var(--orangeH);}
/*--payment-successful end--*/

/*--Unsubscribe--*/
.unsubscribe-bg {padding: 80px 0px;}
.unsubscribe-bg .main {padding: 10px 10px;}
.unsubscribe-main-box {max-width: 760px;min-width: 400px;margin: 0 auto;padding: 60px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
.unsubscribe-main-box .unsubscribe-title{color:var(--blue);text-transform:uppercase;font-size:24px}
.unsubscribe-main-box .unsubscribe-txt{margin-top:20px}
.unsubscribe-main-box .unsubscribe-txt .txt{margin-right:10px;color:var(--999);font-size:16px}
.unsubscribe-main-box .unsubscribe-txt .txt-email{color:var(--blue);font-size:18px}
.unsubscribe-ul{overflow:hidden;margin-top:20px}
.unsubscribe-ul .unsubscribe-li{overflow:hidden;margin-bottom:20px;width:100%}
.unsubscribe-ul .unsubscribe-li:last-child{margin-bottom:0}
.unsubscribe-ul .unsubscribe-li .radio-label{margin:0;width:100%}
.unsubscribe-ul .unsubscribe-li .txt{color:var(--999);font-size:16px;line-height:16px;width:calc(100% - 28px)}
.unsubscribe-main-box .btn-group .button-box{width:200px}



.unsubscribe-success-box {max-width: 760px;min-width: 400px;margin: 0 auto;padding: 60px;text-align: center;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
.unsubscribe-success-box .icomm{color:var(--blue);font-size:90px}
.unsubscribe-success-box .txt{margin-top:20px;color:var(--333);font-size:16px}
.unsubscribe-success-box .txt-email{margin-top:10px;color:var(--blue);font-size:18px}
.unsubscribe-success-box .txt-did{margin-top:40px;color:var(--333);font-size:16px}
.unsubscribe-success-box .btn-group .button-box{max-width:300px;width:100%;margin-top:20px}

/*--Unsubscribe end--*/




/****************** Affiliate */

/* banner */
.affiliate-banner-box{ position: relative; width: 100%;  overflow: hidden;}
.affiliate-banner-box .pic-box{ position: relative;width: 100%; aspect-ratio: 1920/600;  z-index: 1; font-size: 0; line-height: 0; overflow: hidden;}
.affiliate-banner-box .pic-box img{width: 100%; height: 100%; object-fit: cover;}

.affiliate-banner-box .text-box{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2; text-align: center;}
.affiliate-banner-box .text-box .title{font-size: 36px; color: #fff;}
.affiliate-banner-box .text-box .txt{font-size: 16px; color: #fff; margin-top: 10px;}
.affiliate-banner-box .text-box .btn{display: inline-block; height: 48px; text-align: center; font-size: 16px; color: #fff; line-height: 48px; background: var(--blue); text-decoration: none; border-radius: 24px; padding: 0 30px; margin-top: 30px;}
.affiliate-banner-box .text-box .btn:hover{background: var(--blueH);}

/* commission */

.commission-box{ background: #f8f8f8; padding: 40px 0;}
.commission-box .commission-ul{  display: grid;grid-row-gap: 20px;grid-column-gap: 20px; grid-template-columns: repeat(5,1fr);}

.commission-box .commission-ul .commission-li .title{ font-size: 30px; color: var(--blue); margin-bottom: 10px;}
.commission-box .commission-ul .commission-li .txt{ font-size: 16px; color: #000;white-space: nowrap;}

/* Special */
.blo-max-title{font-size: 36px; color: #000; text-align: center;}

.special-box{padding: 120px 0;}
.special-box .special-ul{ margin-top: 80px; display: grid;grid-row-gap: 0;grid-column-gap: 60px; grid-template-columns: repeat(4,1fr);}
.special-box .special-ul .special-li{width: 100%;display: inline-flex;align-items: self-start;justify-content: center;}

.special-box .special-ul .special-li .icomm{font-size: 40px; color: #000; margin-right: 20px;}
.special-box .special-ul .special-li .tetx-box{ }
.special-box .special-ul .special-li .tetx-box .title{ font-size: 16px; color: #000; margin-bottom: 0;}
.special-box .special-ul .special-li .tetx-box .txt{ font-size: 14px; color: #999; }


/* Why HiCOZY */
.whyhi-box{ background: linear-gradient(180deg, #f1f6f6, #fbfbfb 53%); padding: 80px 0;}
.whyhi-box .moretxt{max-width: 1000px; margin:40px auto; text-align: center; line-height: 24px;}
.whyhi-box .whyhi-img-box{max-width: 750px; margin: 40px auto 0 auto;}
.whyhi-box .whyhi-img-box img{width: 100%;}


/* How It Works */
.howworks-box{ padding: 80px 0; text-align: center;}
.howworks-box .howworks-ul{padding: 80px 0; display: grid;grid-row-gap: 0;grid-column-gap: 20px; grid-template-columns: repeat(4,1fr);}
.howworks-box .howworks-ul .howworks-li{ text-align: center; position: relative;}
.howworks-box .howworks-ul .howworks-li .icomm{ font-size: 48px; }
.howworks-box .howworks-ul .howworks-li .icomm *{ font-family: 'icomoon' !important;}
.howworks-box .howworks-ul .howworks-li .txt{max-width: 250px; margin: 18px auto ; font-size: 16px; color: #000; line-height: 24px; height: 48px; }
.howworks-box .howworks-ul .howworks-li .num{font-size: 18px; color: #000;}
.howworks-box .howworks-ul .howworks-li .icomm-right{ position: absolute; font-size: 16px; color: #666; top: 50%; transform: translateY(-50%); right: 0;}
.howworks-box .btn{display: inline-block; height: 48px; line-height: 48px; padding: 0 30px; font-size: 16px; color: #fff; background: var(--blue); border-radius: 24px; text-decoration: none;}
.howworks-box .btn:hover{ background: var(--blueH);}












/* Affiliate END *******************/





.btn{
    -moz-transition: all ease-out .3s;
    -webkit-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all ease-out .3s;
    transition: all .3s ease-out
}


@media (max-width:720px){
    .affiliate-banner-box{ background: #f8f8f8; position: relative; width: 100%; aspect-ratio:inherit; overflow: hidden;}
    .affiliate-banner-box .pic-box{ position: relative;width: 100%; aspect-ratio: 390/280;  z-index: 1; font-size: 0; line-height: 0; overflow: hidden;}

    .affiliate-banner-box .text-box{position: static; transform: translate(0,0); padding: 60px 0;}

    .affiliate-banner-box .text-box .title{font-size: 24px; color: #000;}
    .affiliate-banner-box .text-box .txt{font-size: 16px; color: #000; }
    .affiliate-banner-box .text-box .btn{display: inline-block; height: 48px; text-align: center; font-size: 16px; color: #fff; line-height: 48px; background: var(--blue); text-decoration: none; border-radius: 24px; padding: 0 30px; margin-top: 30px;}

    .commission-box { padding: 0 40px 80px 40px;}
    .commission-box .commission-ul{  grid-row-gap: 40px;grid-column-gap:0; grid-template-columns: repeat(1,1fr);}

    .blo-max-title{font-size: 24px; }

    .special-box{padding: 80px 0;}
    .special-box .special-ul{ margin-top: 40px; display: grid;grid-row-gap: 40px;grid-column-gap:0; grid-template-columns: repeat(1,1fr);}
    .special-box .special-ul .special-li{ justify-content: flex-start;}

    .howworks-box{ padding: 80px 0; text-align: center;}
    .howworks-box .howworks-ul{padding: 40px 0; display: grid;grid-row-gap: 20px;grid-column-gap: 0; grid-template-columns: repeat(1,1fr);}
    .howworks-box .howworks-ul .howworks-li{ border: 1px solid #eee; border-radius: 5px; padding: 20px 0;}
    .howworks-box .howworks-ul .howworks-li .icomm-right{ display: none; }
}