@charset "utf-8";
/* CSS Document */


/* ==== BACK BUTTON ==== */

.back_container{
	position:absolute;
	top:0;
	left:0;
	right:auto;
	width:47%;
	min-width:363px;
	height:84px;
	z-index:1000;
	visibility:hidden; 
	background-color:transparent;
	}

.head_driver{
	position:relative;
	float:left;
	width:16%;
	min-width:240px;
	height:100%;
	visibility:visible;
	background-color:transparent;
	}

.back_head{
	position:relative;
	float:left;
	width:80px;
	height:84px;
	visibility:visible;
	background-color:#E8E6E3;
	}

#back_btn{
	position:absolute; 
	width:36px; 
	height:36px; 
	top:22px; 
	left:25%;
	border:solid 2px #27303D;
	border-radius:23px;
	outline:0;
	cursor:pointer;
	background-image:url(../images_main/LX_arrow_B.png);
	background-position:center;
	background-size:70%;
	background-repeat:no-repeat;
	background-color:transparent;
	-moz-transition:all 0.2s ease-in-out;
	-webkit-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	-ms-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
	}

#back_btn:hover{
	background-color:rgba(95, 190, 200, 0.4);
	-moz-transition:all 0.2s ease-in-out;
	-webkit-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	-ms-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
	}

.back_head p{
	position:absolute;
	bottom:0;
	left:17%;
	font-family:"quicksandregular";
	font-size:15px;
	text-align:center;
	line-height:20px;
	font-weight:normal;
	font-style:normal;
	color:#27303D;
	}
/* ====================== */

.main_body{
	position:relative;
	overflow:auto;
	width:100%;
	height:100%;
	max-width:1440px;
	margin-left:auto;
	margin-right:auto;
	padding:0 0 0 0;
	background-color:rgba(225, 235, 255, 0.7);
	background-image:url(../images_main/point_pattern.png);
	background-size:5px;
	}

.head_poster{
	position:absolute;
	overflow:hidden;
	width:100%;
	height:350px;
	top:0;
	background-color:black;
	}

.post_title{
	position:relative;
	overflow:hidden;
	width:60%;
	height:auto;
	max-height:70px;
	min-width:280px;
	padding:10px 20px 5px 20px;
	margin-left:auto;
	margin-right:auto;
	margin-top:90px;
	background:rgba(49, 100, 200, 0.7);
	}

.post_title h2{
	font-family:"gasaltregular";
	font-size:26px;
	letter-spacing:1px;
	line-height:22px;
	font-weight:normal;
	font-style:normal;
	color:white;
	}

.post_body{
	position:relative;
	overflow:hidden;
	width:60%;
	height:auto;
	padding:20px 20px 35px 20px;
	min-width:280px;
	max-width:960px;
	margin-left:auto;
	margin-right:auto;
	background-color:#E8E6E3;
	font-family:"quicksandregular";
	font-size:17px;
	line-height:22px;
	font-weight:normal;
	font-style:normal;
	text-align:justify;
	box-shadow:0px 0px 7px #222;
	-moz-box-shadow:0px 0px 7px #222;
	-webkit-box-shadow:0px 0px 7px #222;
	-o-box-shadow:0px 0px 7px #222;
	-ms-box-shadow:0px 0px 7px #222;
	}

.pubbdate{
	font-size:12px;
	position:relative;
	margin-bottom:5px;
	right:0;
	width:auto;
	height:auto;
	text-align:right;
	color:#999;
	}

.post_body ol{
	position:relative;
	width:auto;
	height:auto;
	background-color:transparent;
	}

.post_body ol li{
	font-family:"quicksandregular";
	list-style:decimal;
	list-style-position:inside;
	padding:2px 17px 2px 17px;
	color:#403483;
	}

.post_body a{
	text-decoration:none;
	color:#60B;
	background-color:#B3EFFF;
	}


/* === VIDEO or IMAGE in the head of TEXT BODY === */
.headimage{
	position:relative;
	overflow:hidden;
	width:100%;
	height:0;
	padding-bottom:45%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:15px;
	background-color:transparent;
	}

.headimage img{
	position:absolute;
	width:100%;
	height:auto;
	margin:auto;
	top:0;
	right:0;
	bottom:0;
	left:0;
	}

.headvideo{
	position:relative;
	overflow:hidden;
	width:100%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:20px;
	background-color:black;
	}

.headvideo video[poster]{
	position:relative;
	width:100%;
	height:auto;
	}

#main_video{
	position:relative;
	width:100%;
	height:auto;
	}


/* === TEXT Images === */
.pict_news_LX, .pict_news_RX{
	position:relative;
	overflow:hidden;
	width:42%;
	height:200px;
	min-width:230px;
	margin:5px 9px 10px 9px;
	background-color:black;
	}

.pict_news_LX img, .pict_news_RX img{
	postion:absolute;
	width:100%;
	height:auto;
	top:50%;
	margin-top:-25%;
	}
	
.pict_news_LX{
	float:left;
	}

.pict_news_RX{
	float:right;
	}

.pict_news_MID{
	position:relative;
	overflow:hidden;
	width:90%;
	height:0;
	padding-bottom:60%;
	margin:0 auto 10px auto;
	background-color:transparent;
	}
	
.pict_news_MID img{
	position:absolute;
	width:70%;
	height:auto;
	margin:auto;
	top:0;
	right:0;
	bottom:0;
	left:0;
	}


@media screen and (orientation: portrait) and (max-width: 640px){
	
	.back_container{
		width:15%;
		min-width:100px;
		left:auto;
		right:0;
		}
	
	.head_driver{
		display:none;	
		}
	
	.back_head{
		float:right;
		height:72px;
		width:78px;
		}
	
	#back_btn{
		top:13px;
		}
	
	.back_head p{
		left:12%;
		line-height:14px;
		}
	
	.post_title{
		width:90%;
		padding:10px 16px 5px 16px;
		}
	
	.post_body{
		width:90%;
		padding:20px 16px 35px 16px;
		}			
	}


@media screen and (orientation: landscape) and (max-width: 780px){
	
	.post_title{
		width:80%;
		}
	
	.post_body{
		width:80%;
		}	
	}


@media screen and (max-width: 640px){
	.pict_news_LX, .pict_news_RX{
		float:none;
		width:90%;
		height:0;
		padding-bottom:60%;
		margin-left:auto;
		margin-right:auto;
		}

	.pict_news_MID{
		padding-bottom:80%;
		}
		
	.pict_news_MID img{
		width:98%;
		}
	}












