@charset "utf-8";
/* CSS Document */
/*------------------------------------
            $Banner
------------------------------------*/
.banner{ 
	background: lightgray; 
	background-repeat: no-repeat;
    background-size: cover;
    background-position: right center;
    position: relative;
	height: 52vw; 
	background-image: url(../images/landing-main_2.jpg);
}


	.banner > .row{ height: 100%; }
	.banner-info {
	float: left;
	position: absolute;
	top: 43%;
	left: 29.5%;
	width: 800px;
	    /*padding-right: 40%;*/
	}
	
/*	.banner-info .title{
		    color: #282828;
			font-size:48px;
			font-family: 'Roboto', sans-serif;
			font-weight: 700;
			
		}*/

		
		
		.banner .playbutton{
	    position: absolute;
	    right: 30%;
	    top: 15%;
		width:10vw;
		height:20vw;
			}
			
		.banner .Bonus{
	    position: absolute;
	    right: 4.75%;
	    top: 37%;
		width:26vw;
		height:26vw;
			}
	
	
	 .banner-info .banner-button{
		    font-size: calc( 20.4px + 0.5vw); /*24-16*/
		    border: none;
		    background-color: #636363;
		    color: #fff;
		    padding-top: 10px;
    		padding-bottom: 10px;
		    padding-right: 30px;
		    padding-left: 30px;
		    min-height: 64px;
		}
		.banner-info .banner-button:focus{ outline: none; }
		.banner-info .banner-button:hover{ background-color: #fff; color: #666666; }
		.banner-info .banner-button:hover .icon{ fill: #666666; }
		.ct .banner-info .banner-button:hover{ background-color: #cccccc; }
	
	.Price {
		font-size: calc( 22px + 1vw); /*70-30*/
		color:#fff;
		font-weight:bold;
		line-height: 0.8;
	}

	.listPrice {
		font-size: calc( 14.4px + 0.3vw);
		color:#C3C3C3;
		text-decoration:line-through;
	}
			
	.number {	
	 list-style-type:none;
	 padding-left:60px;
	 font-weight:500;
	 line-height:1.2;
	 font-size: calc( 16px + 0.5vw); /*24-16*/
}



	.number span{
	font-style:italic; 
	font-size: calc( 32px + 0.5vw);
	font-weight:bold;
}

		
/*------------------------------------
            $PACK ITEM
------------------------------------*/
.Pack{ 
	 padding:20px;}
.PackThumb a{
	}
.PackThumb :hover{
	 fill:#282828;}

.item {	
	 list-style-type:none;
	 list-style-image:url(../images/check_2.png);background-repeat:no-repeat;
	 padding-left:60px;
	 font-size: calc( 14.4px + 0.5vw); /*24-16*/
}
.item span{
	font-style:italic; 
	font-size: calc( 16.4px + 0.5vw);
	font-weight:bold;
}


.item2 span{
	font-style:italic; 
	font-size: calc( 16.4px + 0.5vw);
	font-weight:bold;
}

.PackPrice{
	position:absolute;
	right:70px;
	bottom:40px;
	z-index:10;
	}
	
.PackPrice .Price {
	font-size: calc( 22px + 2.5vw); /*70-30*/
	color:#282828;
	font-weight:bold;
	}
.PackPrice .listPrice {
	font-size: calc( 14.4px + 0.5vw);
	text-decoration:line-through;
	}
.btn-lg{
	background-color:#ff9f00; border:none; border-radius:0; color:#fff; width:98%; font-weight:800;
}



.btn-red{
	background-color:#e70012; border:none; border-radius:0; color:#fff; width:98%; font-weight:800;
}


/*------------------------------------
            $Bonus
------------------------------------*/
.bonus{ 
	background: lightgray; 
	background-repeat: no-repeat;
    background-size: cover;
    background-position: right center;
    position: relative;
	height: 52vw; 
	background-image: url(../images/Bonus_BG.jpg);
}


	.bonus > .row{ height: 100%; }
	.bonus-info {
		float: right;
	    position: absolute;
	    top: 23%;
	    right: 27%;
		font-size: calc( 18px + 0.5vw); /*24-16*/
	    /*padding-right: 40%;*/
	}
	
/*	.banner-info .title{
		    color: #282828;
			font-size:48px;
			font-family: 'Roboto', sans-serif;
			font-weight: 700;
			
		}*/

		
	 .bonus-info .banner-button{
		    font-size: calc( 14.4px + 0.5vw); /*24-16*/
		    border: none;
		    background-color: #636363;
		    color: #fff;
		    padding-top: 10px;
    		padding-bottom: 10px;
		    padding-right: 30px;
		    padding-left: 30px;
		    min-height: 64px;
		}
		.bonus-info .bonus-button:focus{ outline: none; }
		.bonus-info .bonus-button:hover{ background-color: #fff; color: #666666; }
		.bonus-info .bonus-button:hover .icon{ fill: #666666; }
		.ct .bonus-info .bonus-button:hover{ background-color: #cccccc; }
		
		
	
	
	
	.icon-info {
		float: left;
	    position: absolute;
	    bottom: 18%;
	    left: 6.5%;
		font-size: calc( 18px + 0.5vw); /*24-16*/
	    /*padding-right: 40%;*/
	}
	
	
	.Index{
	position:absolute;
	right: 11%;
	top: 23%;
	width:14vw;
	height:10vw;
	}
	
	.Index .Price {
	font-size: calc( 22px + 2.5vw); /*70-30*/
	color:#282828;
	font-weight:bold;
	}
	.Index .listPrice {
	font-size: calc( 14.4px + 0.5vw);
	text-decoration:line-through;
	}
	
	.Index2{
	position:absolute;
	right: 13.5%;
	bottom: -5%;
	width:14vw;
	height:10vw;
	}
	
	.Index2 .Price {
	font-size: calc( 22px + 2.5vw); /*70-30*/
	color:#282828;
	font-weight:bold;
	}
	.Index2 .listPrice {
	font-size: calc( 14.4px + 0.5vw);
	text-decoration:line-through;
	}
	
	.Exclusive{
	background-color:#e8f6ff;
	text-align:center;
	position:absolute;
	left: 5%;
	top: 1%;
	width:15vw;
	border:1px solid #282828;
	font-size: calc( 18px + 0.275vw);
	padding:10px;}
