@charset "utf-8";
@import url(topbanner.css);

/*desktop Purchase start*/
.versionTypeClass{
	box-sizing: border-box;	
}
.versionTypeClass:hover{
    border: 1px solid rgba(255,255,255,0.5) !important;
    border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
    border-bottom: none !important;	
	}
.versionTypeClassChecked_1{background:#0084ff !important; font-weight:600;}
.versionTypeClassChecked_2{background: #5944c7 !important;font-weight:600;}
.versionTypeClassChecked_3{background: #8623b7 !important;font-weight:600;}
.versionTypeClassChecked_4{font-weight:600;}

.pd_btns2 a{
text-shadow: 1px 1px 2px #08653E;
background-color: #0AAB68;
border: solid 1px #0A7B4C;
}
.pd_btns2 a:hover{
background-color: #0D9A5F;
}


.toptop_banner .links {color: #fff !important; visibility: hidden;}
.toptop_banner .links a {color: #fff !important;}
.toptop_banner .links a:hover {color: #f60 !important;}

em {font-style:italic; font-size:0.8em;}

h1{line-height:1.5em !important;}

.sec_intro_a, .sec_intro_b, .sec_intro_c, .sec_intro_d, .sec_intro_e, .sec_intro_f {
	bottom:5%;
	box-sizing: border-box;
	width:100%;
	padding:1em 10em 1em 10em;
	text-align:center;
}
.sec_intro_f {
    position: absolute;

}
.main_section_1, .main_section_2, .main_section_3, .main_section_4, .main_section_5, .main_section_6{
	height:10em;
	border-bottom:1px solid #CCC;
	
}
.main_section_6 {
    position: relative;
    clear: both;
    width: 100%;
}

.sec_description{
	padding: 1em 3em 1em 3em;
}
.learning_area{
	width:95%;
	margin: 0 auto;
}
.intro_left {margin-top:1em !important; text-align:center;}
.intro_middle{padding-top:1em; width:45%;}
.intro_middle a{text-decoration:underline !important;}
.intro_right {width:35%;}
.section_learning{
	box-sizing:border-box; 
	display:block;
	width:33%;
	padding:0.8em;
	float:left;
}
.block-box{
    border-radius: 5px;
    border: 1px solid #ccc;
    padding: 1em 1em 1em 1em;
	height:360px;;
}


.block-box h3{
	margin-bottom:0.5em;
	text-align:center;
}
.block-box p{
	margin-top:1em;
	line-height:1.5em;
	padding-bottom: 1.5em;
} 
.play_small {margin:-2em 0 0 1em;}

.piller_area{
	width:100%;
	margin: 0 auto;
}
.section_pillar{
	box-sizing:border-box; 
	display:block;
	width:20%;
	padding:0.5em;
	float:left;
}
.section_pillar .pillar_item{
	color:#fff;
	font-size:1.4em;
	line-height:1.4em;
	padding:0.3em 0.5em 0.5em 0.5em;
	height:80px;
	background-repeat:no-repeat;
	background-position:right top;
	background-size: 100% 100%;
	text-shadow: 1px 1px 2px rgba(0,0,0,.7);
}
.p0{cursor:pointer;}
.p1{background:#751f6a; background-image:url(../img/p0.png); cursor:pointer;}
.p2{background:#3f347a; background-image:url(../img/p0.png); cursor:pointer;}
.p3{background:#024c8d; background-image:url(../img/p0.png); cursor:pointer;}
.p4{background:#01708a; background-image:url(../img/p0.png); cursor:pointer;}
.p5{background:#009b86; background-image:url(../img/p0.png); cursor:pointer;}
.p6{background:#0E95BD; background-image:url(../img/p0.png); cursor:pointer;}
.cms_app{
	vertical-align:middle;
	margin-right:0.5em !important;
	margin-left:0.5em;
}
h1 .h1_sub {
    font-size: 0.7em;
    margin-left: 1em;
    vertical-align: text-top;
    color: #333333;
	font-weight:400;
}
.bulletPoint p{
	margin-bottom: 0em !important;
}

.tablebuy {
    color: #FFF;
    margin-top: 5px;
    margin-bottom: 5px;
}
.tablebuy a {
    display: block;
    width: 80%;
    height: 2em;
    margin: 0 auto;
    background-color: #09F;
    border-radius: 3px;
    font-size: 1em;
    line-height: 2em;
    color: #FFF;
    text-decoration: none;
}
.tableprice_discount {
    font-size: 16px;
    color: #C30;
}
.tableprice_ori {
    font-size: 14px;
    color: #666;
    text-decoration: line-through;
}

.on_768{
	display:none;
}
.de_p1{width:15% !important;}
.de_p2{width:85% !important;}
.back_top{
	z-index:999;
	position:fixed;
	bottom:3em;
	right:1em;	
}
.quick_nav {
    font-size: 0.8em;
	text-align: right;
    height: 1.5em;
    padding-top: 1.5em;
	margin-right:3em;
    margin-bottom: 1em;
    clear: right;
}
.gototop{
	float:right;
}
.include_ver{
    display: block;
    float: left;
    padding: 0.2em 1.5em 0.2em 1.5em;
    font-size: 0.9em;
    color: #fff;
    background: #666;
    margin-right: 0.5em;
}

.compare_btn{
	background:rgba(33, 143, 255, 1);
	color:#fff !important;
    border-radius: 4px;
    padding: 6px;
    font-size: 14px;
    font-weight: 400;
	text-align: center;
    margin: 10px 40px 10px 40px;
	display:block;
}
.compare_btn:hover{
	background:rgba(33, 143, 255, 0.8);
}

.more_btn{
	background:rgba(246, 139, 53, 1);
	color:#fff !important;
    border-radius: 4px;
    padding: 6px;
    font-size: 14px;
    font-weight: 400;
	text-align: center;
    /*margin: 10px 20px 10px 20px;*/
	display:block;
	
}
.more_btn:hover{
	background:rgba(246, 139, 53, 0.8);
}
.title_label{
    BACKGROUND: #FB0C00;
    font-size: 0.4em;
    font-weight: 600;
    padding: 0.1em 0.8em;
    border-radius: 0.3em;
    color: #fff;
    vertical-align: top;	
	
}
.box_bar{
	color:#666;
	padding:0 0.5em 0 0.5em;
	font-size:8px;
	vertical-align:text-top;
	
}

ul h3{padding-bottom:0.5em;}

.one_column_ul {
    width: 70%;
    margin: 0 auto 2em auto;
}
.one_column_ul li {
    width: 100%;
    margin-right: 0px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: auto;
    padding: 0 1em 0 1em;
    list-style: none;
    text-align: center;
}

.two_c_fix{
	width:80%;
}





@media screen and (min-width: 768px) and (max-width: 1200px) {
.sec_intro_a, .sec_intro_b, .sec_intro_c, .sec_intro_d, .sec_intro_e, .sec_intro_f {

	padding:1em 5em 1em 5em;

}
/*.sec_intro_f {
    width: 80%;
    position: absolute;
    bottom: 0% !important;
    padding: 1em;
}*/	
.section_pillar .pillar_item{
	font-size:1.1em;
	padding:0.5em 0.5em 0.5em 0.5em;
	height:80px;
	font-weight:600;

}	
.block-box p{
	font-size:0.9em;
	line-height:1.4em;
} 
.play_small {
	font-size:0.8em;
}
.section_learning{
	padding:0.2em;
}
.block-box h3{
	font-size:0.9em;	
}
.block-box{
	padding: 0.7em;
	height:350px;
}
.de_p1{width:25% !important;}
.de_p2{width:75% !important;}
}

@media screen and (max-width: 768px) {
.seemore{font-size:0.7em; font-weight:600;}
.two_c_fix{
	width:95%;
}
.one_column_ul {
    width: 95%;
}
.sec_intro_a, .sec_intro_b, .sec_intro_c, .sec_intro_d, .sec_intro_e, .sec_intro_f {
	padding:2em;
}
.main_section_1, .main_section_2, .main_section_3, .main_section_4, .main_section_5, .main_section_6 {
    height: initial; border-bottom: none;
}
.b_fix{font-size:1.2em;}
.intro_middle{width:75%;}
.intro_right{width:95%;}	

.sec_intro_a {
	background-image:url(../img/p0.png);
	background-repeat: no-repeat;
    background-position: top right;
    background-color: #751f6a;}
.sec_intro_b {
	background-image:url(../img/p0.png);
	background-repeat: no-repeat;
    background-position: top right;
    background-color: #3f347a;}
.sec_intro_c {
	background-image:url(../img/p0.png);
	background-repeat: no-repeat;
    background-position: top right;
    background-color: #024c8d;}
.sec_intro_d {
	background-image:url(../img/p0.png);
	background-repeat: no-repeat;
    background-position: top right;
    background-color: #01708a;}
.sec_intro_e {
	background-image:url(../img/p0.png);
	background-repeat: no-repeat;
    background-position: top right;
    background-color: #009b86;}
.sec_intro_f {
    width: auto;
    position: inherit;
    bottom: 30%;
    padding: 1em;
	background-image:url(../img/p0.png);
	background-repeat: no-repeat;
    background-position: top right;
    background-color: #0E95BD;
	
}

.hide_768{
	display:none;
}
.on_768{
	display:block;
}
.bottom_text{
    font-size: 0.8em !important;
    margin-left: 7em !important;
    line-height: 1em !important;
}	

.piller_area{
	width:100%;
}
.section_pillar{
	width:100%;
	padding:0.05em;

}
.section_pillar .pillar_item{
	font-size:1em;
	padding:0.5em 1em 0.5em 1em;
	height:auto;
	background-image: initial;
}
h1 .h1_sub {
	display:block;
    font-size: 0.7em;
    padding: 0.5em 0 0.5em 0;
	line-height: 1.5em;
}

.section_learning {
	width:100%;
}
.block-box{
	height:auto;
}
.block-box p{
	font-size:0.9em;
	line-height:1.6em;
} 
.play_small {
	font-size:0.8em;
}

.de_p2{font-size: 1.1em !important;}

.btn_bottom {margin-top: 2.5em !important;	}
}

@media screen and (max-width: 600px) {
.intro_middle{width:95%;}
.intro_right{width:95%;}	
.hide_768{display:none;}
.piller_area{display:none;}
.sec_intro_a h3 {
	line-height:1.3em !important;
}
.sec_intro_b h3 {
	line-height:1.3em !important;
}
.sec_intro_c h3 {
	line-height:1.3em !important;
}
.sec_intro_d h3 {
	line-height:1.3em !important;
}
.sec_intro_e h3 {
	line-height:1.3em !important;
}
.sec_intro_f h3 {
	line-height:1.3em !important;
}
.on_768{
	display:none;
}

.bottom_text{
    font-size: 1em !important;
    margin-left: 6em !important;
    line-height: 1.5em !important;
}

.bottom_box{
	width:95% !important;
	margin-bottom:1em;
}

.two_column_ul li {
    font-size: 0.9em;
}
.three_column_ul li {
    font-size: 0.9em;
}

li p {
	line-height:1.6em;
}
.de_p1{width:25% !important;}
.de_p2{width:75% !important; font-size: 1.1em !important;}
}
.c_new{
	color:#fff;
	background:#900;
	padding:0 0.4em 0 0.4em;
	border-radius:2px;
	font-size:0.8em;
}


.block-box img {
    width: 100%;
}
