@charset "utf-8";
/* CSS Document */

body {
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	padding:0;
	background:#fff;
	color:#000;
	text-align:center;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
	font-smoothing: antialiased;
	font-family: 'Roboto';
	}
div, ul, h1, h2, h3, h4, h5, li, p, img, form, input, textarea {margin:0;padding:0;}
header, section, footer, aside, nav, main, article, figure {display: block;}
table, tr, td {border:0;}
a{outline: none; color:#333; text-decoration:none;}
a:hover {outline: none; text-decoration:none;}
img {border:none; height:auto;}
li {list-style:none;}
*{box-sizing:border-box;}
.clearall{
	clear:both;
	font-size:1px;
	line-height:1px;
	height:1px;
	}

/************ FONTS ************/	

@font-face {
    font-family: 'Roboto Cn';
    src: url('Roboto-BoldCondensed.woff2') format('woff2'),
        url('Roboto-BoldCondensed.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
	}

@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Bold.woff2') format('woff2'),
        url('Roboto-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
	}

@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Medium.woff2') format('woff2'),
        url('Roboto-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
	}

@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Regular.woff2') format('woff2'),
        url('Roboto-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
	}


/*-----------------------
MAIN CSS START
------------------------*/
.container{
	width:970px;
	margin:0 auto;
	padding:0;
	position:relative;
	}
.overflow{overflow:hidden;}

.fl{float:left;}
.fr{float:right;}

.hide-desk{display:none;}

/* SECTION */
.section{
	float:left;
	width:100%;
	background:url(../images/bg.jpg) center top no-repeat;
	background-size:cover;
	height: 100vh;
    overflow-x: hidden;
    padding-bottom: 50px;
	}
.logo{
	display:block;
	margin:20px auto 0;
	}
.home-tx1{
	font-size:20px;
	line-height:28px;
	color:#fff;
	margin-top:15px;
	letter-spacing:0.3px;
	}
.home-bx{
	display:inline-block;
	vertical-align:top;
	max-width:630px;
	width:100%;
	border-radius:8px;
	background:#fff;
	margin-top:25px;
	}
ul.hm-bx-lst{
	width:100%;
	float:left;
	}
ul.hm-bx-lst li{
	width:33.3%;
	float:left;
	border-right:1px solid #bcbcbc;
	border-bottom:1px solid #bcbcbc;
	padding:12px 10px 8px;
	text-align:center;
	}
ul.hm-bx-lst li:last-child{border-right:none;}
ul.hm-bx-lst li p{font-size:15px;line-height:17px;}
ul.hm-bx-lst li span{
	font-size:20px;
	line-height:26px;
	font-weight:500;
	}
.hm-bx-inr{
	float:left;
	width:100%;
	padding:15px 50px;
	}
.hm-bx-hd{
	font-size:36px;
	line-height:44px;
	font-family: 'Roboto Cn';
	font-weight:bold;
	}
.home-prd{
	display:block;
	margin:15px auto 10px auto;
	max-width:100%;
	}
.timer-tx{
	display:inline-block;
	vertical-align:middle;
	background:#ff0000;
	padding:5px 15px;
	border-radius:5px;
	color:#fff;
	font-size:17px;
	line-height:22px;
	margin-top:10px;
	position:relative;
	}
.clk-icn{
	display:inline-block;
	vertical-align:middle;
	margin:-3px 3px 0 6px;
	}
.timer-tx:before{
	content:'';
	position:absolute;
	left:30px;
	bottom:-8px;
	border-top:10px solid #ff0000;
	border-left:8px solid transparent;
	border-right:8px solid transparent;
	}
.btn{
	max-width:482px;
	width:100%;
	display:inline-block;
	vertical-align:top;
	background:#2aaa00;
	border:2px solid #4f931d;
	border-radius:10px;
	color:#fff;
	margin-top:20px;
	padding:5px 10px 10px;
	-webkit-appearance:none;
	outline:none;
	cursor:pointer;
	box-shadow:0px 2px 5px 2px rgba(0,0,0,0.2);
	-webkit-box-shadow:0px 2px 5px 2px rgba(0,0,0,0.2);
	}
.btn span{
	font-size:40px;
	line-height:50px;
	text-shadow:0px 2px 2px #48811e;
	-webkit-text-shadow:0px 2px 2px #48811e;
	height:93px;
	font-weight:bold;
	}
.btn small{
	display:block;
	margin:0 auto;
	font-size:18px;
	line-height:22px;
	}
.promote-tx{
	font-size:12px;
	line-height:17px;
	color:#b5b5b5;
	padding:15px;
	}
.spons-tx{
	font-size:24px;
	line-height:28px;
	font-weight:bold;
	padding:15px;
	border-bottom:1px solid #e0e0e0;
	}
.brnd-log{
	display:inline-block;
	vertical-align:middle;
	margin:20px 15px 0;
	max-width:130px;
	}
.rules-tx{
	font-size:16px;
	line-height:20px;
	color:#9e9e9e;
	display:block;
	margin-top:20px;
	text-decoration:underline;
	}


/*----------------------
POP UP CSS
------------------------*/
.pop-body{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    background: rgba(0,0,0,0.8);
    z-index: 99;
    /*display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;*/
	overflow: auto;
	}	
.pop-mid{
	width: 100%;
    padding: 40px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
	}
.popBox{
    width: 100%;
    max-width: 670px;
    background: #fff;
    padding:20px 0 30px;
    position: relative;
    border-radius: 12px;
	}	
.cross{
    position: fixed;
    top:0;
    right:0px;
	width:34px;
	height:34px;
	background:#333;
    cursor: pointer;
    z-index: 3;
	line-height:30px;
	text-align:center;
	border: 1px solid #808080;
	}	
.cross img{
	display:inline-block;
	vertical-align:middle;
	}
.cong-tx{
	font-size:17px;
	line-height:21px;
	color:#01a20a;
	display:inline-block;
	vertical-align:top;
	position:relative;
	padding:0 0 20px 30px;
	}
.cong-tx span{
	font-weight:bold;
	}
.pop-tik{
	position:absolute;
	left:0;
	top:0;
	}
.pop-hd{
	float:left;
	width:100%;
	padding-top:15px;
	border-top:1px solid #ebebeb;
	font-size:28px;
	line-height:34px;
	font-weight:bold;
	}
.clam-tx{
	font-size:16px;
	line-height:20px;
	font-weight:500;
	display:inline-block;
	vertical-align:middle;
	margin-top:10px;
	}
.clam-tx img{
	display:inline-block;
	vertical-align:middle;
	margin:-4px 8px 0;
	}
.clam-tx p{
	display:inline-block;
	vertical-align:middle;
	}
.pop-prd{
	display:block;
	margin:15px auto 0;
	max-width:80%;
	}
.pop-frm{
	padding:0 70px;
	}
.pop-fld-bx{
	float:left;
	width:100%;
	border:1px solid #959595;
	border-radius:4px;
	height:49px;
	position:relative;
	margin-top:12px;
	overflow:hidden;
	}
.pop-inp-fld{
	-webkit-appearance:none;
	outline:none;
	font-size:15px;
	line-height:20px;
	color:#000;
	border:none;
	width:100%;
	height:100%;
	padding:0 0 0 40px;
	font-family: 'Roboto';
	}
.pop-fld-icn{
	position:absolute;
	left:10px;
	top:14px;
	}
.upd-tx{
	float:left;
	background:#ffee8d;
	padding:5px 15px;
	border-radius:5px;
	font-size:17px;
	line-height:22px;
	margin-top:20px;
	position:relative;
	}
.upd-tx:before{
	content:'';
	position:absolute;
	left:30px;
	bottom:-8px;
	border-top:10px solid #ffee8d;
	border-left:8px solid transparent;
	border-right:8px solid transparent;
	}

.pop-frm .btn{margin-top:30px;}


/*----------------------
THANKYOU CSS
------------------------*/
.thank-sec{
	float:left;
	width:100%;
	background:#f7f7f8;
	padding-bottom:60px;
	}
.thnk-strp{
	background:#e9f7e8;
	padding:10px 0;
	float:left;
	width:100%;
	margin-top:15px;
	position:relative;
	z-index:1;
	}
.thnk-cong-tx{
	float:left;
	width:100%;
	}
.thnk-cong-tx span{color:#189b0e;}
.thnk-tik{
	display:inline-block;
	vertical-align:top;
	margin-top:2px;
	}
.thnk-cong-tx p{
	font-size:17px;
	line-height:26px;
	display:inline-block;
	vertical-align:top;
	width:calc(100% - 150px);
	}
.thnk-inr{
	background:#fff;
	padding:0 70px 50px;
	box-shadow:0px 3px 10px 0px rgba(0,0,0,0.1);
	}
.thnk-inr .clam-tx{
	font-size:26px;
	line-height:32px;
	vertical-align:top;
	max-width:630px;
	width:100%;
	margin-top:20px;
	}
.thnk-inr .clam-tx p{
	width:calc(100% - 150px);
	}
.thnk-inr .clam-tx img{
	vertical-align:top;
	margin:15px 8px 0;
	}
.chance-bx{
	border-radius:10px;
	border:2px solid #69bb2c;
	margin-top:40px;
	padding:0px 20px 30px;
	background:#f8fff7;
	}
.chance-tx{
	display:inline-block;
	vertical-align:top;
	background:#03940c;
	padding:3px 15px;
	color:#fff;
	text-transform:uppercase;
	font-size:15px;
	line-height:20px;
	border-radius:3px;
	margin-top:-15px;
	}
.chance-bx-inr{
	display:flex;
	-webkit-display:flex;
	align-items:center;
	-webkit-align-items:center;
	justify-content:space-between;
	-webkit-justify-content:space-between;
	padding:20px 0 25px;
	}
.thnk-prd-bx{
	width:35%;
	background:#fff;
	border:1px solid #cfcfcf;
	border-radius:6px;
	padding:20px;
	}
.thnk-prd-img{
	display:inline-block;
	vertical-align:top;
	max-width:100%;
	}
.thnk-prd-info{
	width:61%;
	text-align:left;
	}
.prd-info-hd{
	font-size:21px;
	line-height:26px;
	font-weight:bold;
	}
.prd-info-tx{
	font-size:16px;
	line-height:24px;
	margin-top:15px;
	}
.star{
	display:block;
	margin:2px 0 0;
	}
.thnk-prc-info{
	float:left;
	width:100%;
	display:flex;
	-webkit-display:flex;
	align-items:center;
	-webkit-align-items:center;
	justify-content:space-between;
	-webkit-justify-content:space-between;
	}
.thnk-prc-bx{
	width:50%;
	margin-top:15px;
	}
.ret-prc{
	font-size:15px;
	line-height:20px;
	color:#707070;
	}
.ret-prc span{
	position:relative;
	}
.ret-prc span:after{
	content:'';
	position:absolute;
	left:0;
	top:10px;
	width:calc(100% + 10px);
	margin-left:-5px;
	transform:rotate(-10deg);
	-webkit-transform:rotate(-10deg);
	border-top:1px solid #f00;
	}
.fr-sh{
	font-size:15px;
	line-height:20px;
	margin-top:5px;
	}
.fr-sh span{
	font-size:17px;
	font-weight:bold;
	}
.thnk-btn-bx{
	width:49%;
	margin-top:20px;
	}
.thnk-btn{
    width: 100%;
	height:60px;
    display: inline-block;
    vertical-align: top;
    background: #2aaa00;
    border: 2px solid #4f931d;
    border-radius: 10px;
    color: #fff;
    box-shadow: 0px 2px 5px 2px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0px 2px 5px 2px rgba(0,0,0,0.2);
	text-align:center;
	font-size:24px;
	line-height:55px;
	font-weight:bold;
	text-shadow: 0px 2px 2px #48811e;
    -webkit-text-shadow: 0px 2px 2px #48811e;
	}
.stk-tx{
	font-size:14px;
	line-height:18px;
	background:url(../images/stck-tik.png) left 4px no-repeat;
	display:inline-block;
	vertical-align:top;
	padding-left:25px;
	}
.stk-tx span{color:#01a20a;}

/*-----------------------
		Pulse
------------------------*/
.pulse {
	animation-name: pulse;
	-webkit-animation-name: pulse;
	animation-duration: 1.5s;
	-webkit-animation-duration: 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	}
@keyframes pulse {
0% {transform: scale(0.9);}
50% {transform: scale(1);}
100% {transform: scale(0.9);}
}

@-webkit-keyframes pulse {
0% {-webkit-transform: scale(0.95);}
50% {-webkit-transform: scale(1);}
100% {-webkit-transform: scale(0.95);}
}


/*-----------------------
		Media
------------------------*/

@media only screen and (max-width:980px){
.container{width:750px;}

.thnk-inr{padding:0 25px 30px;}
.fr-sh span{font-size:16px;}
}

@media only screen and (max-width:767px){
.hide-mob{display:none;}
.hide-desk{display:block;}
.container{width:100%; padding:0 15px; max-width:600px; box-sizing:border-box;}

.home-bx{ margin-top:15px;}
.section{padding-bottom:30px;}
.logo{width:130px; margin: 10px auto 0;}
.home-tx1{font-size:16px; line-height:24px; margin-top: 10px;}
ul.hm-bx-lst li span{font-size:18px; line-height:22px;}
.hm-bx-inr{padding:15px;}
.hm-bx-hd{font-size:25px; line-height:32px;}
.home-prd{margin:15px auto 0;}
.timer-tx{padding: 5px 8px; font-size: 14px; line-height:20px;}
.clk-icn{margin: -3px 3px 0 6px; width:15px;}
.btn span{font-size:30px; line-height:40px;}
.btn small{font-size:14px; line-height:18px;}
.promote-tx{font-size:11px; line-height:15px; padding:12px 0;}
.spons-tx{font-size:18px; line-height:22px; padding:5px 5px 10px;}
.brnd-log{margin:10px 6px 0;max-width: 85px;}
.rules-tx{font-size:14px; line-height:20px; margin-top:15px;}

/*----------------------
POP UP CSS
------------------------*/
.pop-mid{ padding:20px 10px;}
.popBox{padding:15px 0 25px;}
.cong-tx{font-size:13px; line-height:19px; padding:0 5px 15px 25px; margin-left:0px; text-align:left;}
.pop-tik{width:20px; top:0;}
.pop-hd{font-size:22px; line-height:28px; padding-top:15px;}
.clam-tx{font-size:14px; line-height:18px;}
.pop-prd{max-width:85%;}
.pop-frm{padding:0 20px;}
.pop-fld-bx{margin-top:10px;}
.upd-tx{padding:5px 8px; font-size:12px; line-height:18px;}
.pop-frm .btn{margin-top:20px;}

/*----------------------
THANKYOU CSS
------------------------*/
.thank-sec{padding-bottom:30px;}
.thnk-cong-tx p{font-size:16px; line-height:23px; width:calc(100% - 30px); text-align:left;}
.thnk-inr{padding: 0 15px 25px;}
.thnk-inr .clam-tx{padding:0 40px; position:relative; margin-top:20px;}
.thnk-inr .clam-tx p{width:100%; font-size:15px; line-height:22px;}
.thnk-inr .clam-tx img{position:absolute; top:5px; margin-top:5px;}
.thnk-inr .clam-tx img:first-child{left:0px;}
.thnk-inr .clam-tx img:last-child{right:0px;}
.chance-bx{padding:0px 15px 25px; margin-top:30px;}
.chance-tx{padding:3px 10px;}
.chance-bx-inr, .thnk-prc-info{flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.thnk-prd-bx, .thnk-prd-info, .thnk-prc-bx, .thnk-btn-bx{width:100%;}
.chance-bx-inr{padding:10px 0 20px;}
.thnk-prd-bx{margin-top:20px;}
.thnk-prd-info{text-align:center;} 
.star{margin:5px auto 0;}
.prd-info-tx{font-size:15px; line-height:22px; text-align:left;}


.stk-tx{text-align:left;}
}