/* CSS Document */

	
/*----- over 1024px ----*/
	
	.l_container{
		position: relative;
		display: block;
		margin:0 auto;
		padding:120px 0 0 0;
		width:94vw;
		max-width:1024px;
		min-height: 163vh;		
		z-index:-1;
		color:#fff;
		line-height: 1.8em;
	}	
			
	.r_tcon{
		position: absolute;
		display: block;
		width:588px;
		height:auto;
		padding-bottom:144px;
	}	
		
	.l_tcon{
		position: absolute;
		display: block;
		width:314px;
		height:auto;	
		right:0;
		padding-bottom:144px;
	}	
		
	.spc{
		margin-right:36px;
	}
	
    .topics_link{color: #ffdc94;}	
	
	.thumb_box{
		position: relative;
		width:274px;
		height:274px;
		display: block;
		background:#333;
		overflow: hidden;
		float:left;
		margin-top:32px;
		border:1px solid #666;
		box-shadow: 0px 4px 6px #222;
				
	}
    		
	.thumbtext{
		width:258px;
		height:120px;
		padding:8px;
		display: block;
		z-index:11100;
		display: block;
		background:rgba(0,0,0,0.6);
		position: absolute;
		bottom: 0;
		color:#fff;
		line-height:1.6em;
		text-align: justify;
		text-align-last: left;
	}
	
	.image_w{
		width:274px;
		height:auto;
		display: block;
		position: absolute;
		margin: auto;
		left:0;
		top:0;
		z-index:1101;
	}

	.image_h{
		width:274px;
		height:auto;
		display: block;
		position: absolute;
		margin:auto;
		left:0;
		right:0;
		top:0;
		bottom:0;
		z-index:1101;
	} 
    
	.topics_link{color: #ffdc94;}
    
	.topics_date{
		font-size: 1.05vw;
		font-weight: bold;
		color: #ffe295;
		display: block;
		margin: 1vw 0 .5vw 0;
        }
    
	.topics_title{
		font-size: 1.15vw;
		font-weight: bold;
		color: #ffffff;
		display: block;
		margin: 1vw 0 .5vw 0;
        }
    
	.topics {
        font-size: 32px;
        width: 100%;
        display: block;
        color: #fff;
        line-height: 1.0em;
        font-family: 'Bad Script', cursive;
        border-bottom: 0.1vw solid #fff;
        margin: 0 0 16px 0;
        padding-top: 16px 0 0 0s;
        z-index: 2003;
           
    } 
	
	
    .mline{display: block;display: block;position: relative;width: 100%;word-break: break-all;transition: 0.7s;opacity: 0.1;margin-top:32px;}
    .mspan{font-weight: bold;color: #ffe295;margin-top:8px;display: block;position: relative;transition: 0.6s}
    .mlink{font-weight: nomal;color: #ccf;margin:8px 0;display: block;transition: 0.6s;position: relative;}
    .mlink:hover{font-weight: bold;color: #66f;}
    .ma{opacity: 1;margin-top:12px;}	

	
	
	
	
	
	
	@media (max-width:1023px){
		
		.l_container{font-size:16px;}
		
		.r_tcon{
			position: absolute;
			display: block;
			width:600px;
			height:auto;
			padding-bottom:144px;
		}



		.l_tcon{
			position: absolute;
			display: block;
			width:calc( 100% - 616px );
			height:auto;	
			right:0;
			padding-bottom:144px;
		}


	}	
	
	
	
	
	@media (max-width:800px){		
	
		.r_tcon{
			position: absolute;
			display: block;
			width:438px;
			height:auto;
			padding-bottom:144px;
			padding-top:96px;
		}



		.l_tcon{
			position: absolute;
			display: block;
			width:calc( 100% - 506px );
			height:auto;	
			right:0;
			padding-bottom:144px;
			padding-top:96px;
		}

		.thumb_box{
			position: relative;
			width:204px;
			height:204px;
			display: block;
			background:#333;
			overflow: hidden;
			float:left;
			margin-top:26px;
			border:1px solid #666;
			box-shadow: 0px 4px 6px #222;

		}



		.thumbtext{
			width:206px;
			height:86px;
			padding:8px;
			display: block;
			z-index:11100;
			display: block;
			background:rgba(0,0,0,0.6);
			position: absolute;
			bottom: 0;
			color:#fff;
			line-height:1.5em;
			text-align: justify;
			text-align-last: left;
		}




		.image_w{
			width:214px;
			height:auto;
			display: block;
			position: absolute;
			margin: auto;
			left:0;
			top:0;
			z-index:1101;
		}



		.image_h{
			width:214px;
			height:auto;
			display: block;
			position: absolute;
			margin:auto;
			left:0;
			right:0;
			top:0;
			bottom:0;
			z-index:1101;
		} 

		.spc{
			margin-right:24px;
		}			

		.ttitle{font-size:14px;color:#fff;word-break: break-all;word-wrap: break-word;width:198px;}	
	
	}	
	
	
		
	
	
	
	
	
	@media (max-width:767px){
		
		.l_container{font-size:16px;padding-top:144px;}
		
		.r_tcon{
			position: relative;
			display: block;
			width:94vw;
			max-width: 478px;
			min-width: 300px;
			height:auto;
			margin:0 auto;
			padding-bottom:144px;
		}



		.l_tcon{
			position: relative;
			display: block;
			width:94vw;
			max-width: 478px;
			min-width: 300px;
			height:auto;	
			right:0;
			padding-bottom:144px;
		}


	}	
	
	
	@media (max-width:506px){
	
		.l_container{font-size:20px;padding-top:144px;margin:0 auto;max-width: 310px;width:94vw;}

		.r_tcon{
			position: relative;
			display: block;
			width:308px;
			height:auto;
			margin:0 auto;
			padding-bottom:144px;
		}



		.l_tcon{
			position: relative;
			display: block;
			width:310px;
			height:auto;	
			right:0;
			padding-bottom:144px;
		}
		
		
	.thumb_box{
			position: relative;
			width:304px;
			height:304px;
			display: block;
			background:#333;
			overflow: hidden;
			float:left;
			margin-top:26px;
			border:1px solid #666;
			box-shadow: 0px 4px 6px #222;

		}



		.thumbtext{
			width:302px;
			height:131px;
			padding:8px;
			display: block;
			z-index:11100;
			display: block;
			background:rgba(0,0,0,0.6);
			position: absolute;
			bottom: 0;
			color:#fff;
			line-height:1.5em;
			text-align: justify;
			text-align-last: left;
		}




		.image_w{
			width:304px;
			height:auto;
			display: block;
			position: absolute;
			margin: auto;
			left:0;
			top:0;
			z-index:1101;
		}



		.image_h{
			width:304px;
			height:auto;
			display: block;
			position: absolute;
			margin:auto;
			left:0;
			right:0;
			top:0;
			bottom:0;
			z-index:1101;
		} 

		.spc{
			margin-right:0px;
		}			


		.ttitle{font-size:20px;color:#fff;word-break: break-all;word-wrap: break-word;width:284px;line-height: 1.6em;}			
		
	}
	
	


