/* --------- sec_main --------- */
	.sec_main{
		background:#FAFAFA;
	}
	.sec_main .container{
		padding:160px 0 70px;
	}
	.content_wrap{
		position: relative;
		margin-top: 70px;
		padding-left: 4px;
		opacity: 0;
		-webkit-animation:fadefromdown .7s .3s forwards;
		-o-animation:fadefromdown .7s .3s forwards;
		animation:fadefromdown .7s .3s forwards;
	}
/* --------- END sec_main --------- */
/* --------- box --------- */
	.content_box{		
		display: inline-block;
		width: 50%;		
		margin-left:-4px;
	}
	.content_box:nth-child(3){
		margin-left: 0;
	}
	.row{
		width: 100%;
		/*padding-left: 4px;*/
	}
	.row .pic,
	.row .content{
		display: inline-block;
		width: 50%;
		max-width: 300px;
		height: 0;
		padding-bottom: 50%;
		vertical-align: top;
		background-size: cover;
	}
	.row .pic{
		position: relative;
		box-shadow: 0 0 0 0px rgba(255,172,0,0) inset;
		-webkit-transition: all .5s ease;
		   -moz-transition: all .5s ease;
		    -ms-transition: all .5s ease;
		     -o-transition: all .5s ease;
		        transition: all .5s ease;
	}
	.row .pic:after{
		content:"READ MORE";
		display: block;
		width: 120px;
		height: 27px;
		text-align: center;
		font-size: 1.2em;
		letter-spacing: 2px;
		line-height: 5em;
		font-family: 'PT Sans', sans-serif;
		font-weight: bold;
		text-transform: uppercase;
		position: absolute;
		background:url('../img/icon/icon_plus.png') center center no-repeat;
		left: calc(50% - 120px / 2);
		top: calc(50% - 27px);
		opacity: 0;
		color:transparent;
	}
	.row .content{
		padding:40px 53px calc(50% - 40px);
		box-sizing: border-box;
		background: white;
		position: relative;
	}
	.row .content span{
		margin:10px 0;
	}
	.row .pic:last-child,
	.row .content:last-child{
		margin-left: -4px;
	}
	#row_large{
		display: inline-block;
		width: 75%;
		margin-left: 0px;
	}
	#row_large .pic{
		max-width: none;
		width: 66.66666%;
		padding-bottom: 66.66666%;
		box-shadow: 0 0 0 315px rgba(255,172,0,0) inset;
	}
	#row_large .content{
		max-width: none;
		width: 33.33333%;		
		padding:21% 53px calc(66.66666% - 21%);
		/*background: #707064;*/
		background: #989892;
	}

	.row_verticle{
		display: inline-block;
		width: 25%;
		margin-left: -4px;
		position: absolute;
		top: 0;
	}
	.row_verticle .pic,
	.row_verticle .content{
		width: 100%;
		padding-bottom: 100%;
	}
	.row_verticle .pic:last-child,
	.row_verticle .content:last-child{
		margin-left: 0;
	}
	.row_verticle .content{
		padding-bottom: calc(100% - 40px);
	}

	.row:hover .pic,
	#row_large:hover .pic{
		box-shadow: 0 0 0 315px rgba(188,177,122,.7) inset;
	}
	.row:hover .pic:after{
		opacity: 1;
		color:white;
	}
/* --------- END box --------- */
/* --------- box_arrow --------- */
	.content:before{
		content:"";
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		/*background: #aaa;*/
		position: absolute;
	}
	.row:first-child .content:before{
		top: 55%;
		right: -14px;
		border-width: 15px 0 15px 15px;
		border-color: transparent transparent transparent white;
		z-index: 2;
	}
	.row:last-child .content:before{
		top: 55%;
		left: -14px;
		border-width: 15px 15px 15px 0;
		border-color: transparent white transparent transparent;
	}

	#row_large .content:before{
		top: calc(50% - 15px);
		left: -14px;
		border-width: 15px 15px 15px 0;
		border-color: transparent #989892 transparent transparent;
	}
	.row_verticle .content:before{
		top: -14px;
		left: calc(50% - 15px);
		border-width: 0 15px 15px 15px;
		border-color: transparent transparent white transparent;
	}
/* --------- END box_arrow --------- */
/* --------- txt --------- */
	.content a>h3{
		font-weight: 500;
		font-size: 1.25em;
		line-height: 1.5em;
		width: 100%;
		overflow : hidden;
		text-overflow : ellipsis;
		white-space : nowrap;
		-webkit-transition: color .25s ease;
		   -moz-transition: color .25s ease;
		    -ms-transition: color .25s ease;
		     -o-transition: color .25s ease;
		        transition: color .25s ease;
	}
	.content a>h3:hover{
		color:#FFB933;
	}
	.content span{
		display: block;
		font-size: 1em;
		line-height: 1.5em;
		width: 100%;
		height: 7.7em;
		margin:10px 0;
		overflow : hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 5;
		-webkit-box-orient: vertical;
	}
	.content .date{
		width: auto;
		height: auto;
		font-size: .875em;
		letter-spacing: 2px;
		display: inline-block;
	}
	.content .icon_share{
		display: inline-block;
		width: 13px;
		float: right;
		-webkit-filter: grayscale(100%) brightness(60%); /* Chrome, Safari, Opera */
		filter: grayscale(100%) brightness(60%);
		-webkit-transition: all .5s ease;
		   -moz-transition: all .5s ease;
		    -ms-transition: all .5s ease;
		     -o-transition: all .5s ease;
		        transition: all .5s ease;
	}
	.content .icon_share img{
		width: 100%;
	}
	#row_large .content .icon_share{
		-webkit-filter: grayscale(100%) brightness(130%); /* Chrome, Safari, Opera */
		filter: grayscale(100%) brightness(130%);
	}
	.content .icon_share:hover,
	#row_large .content .icon_share:hover{
		-webkit-filter: none; /* Chrome, Safari, Opera */
		filter: none;
	}
/* --------- END txt --------- */
/* --------- pagination --------- */
	.page_dots{
		margin-top:70px;
		text-align: center;
	}
	.page_dots a{
		display: inline-block;
		margin-left: 20px;
		width: 8px;
		height: 8px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		background:#646464;
		border:1px solid #646464;
	}
	.page_dots a:first-child{
		margin-left: 0;
	}
	.page_dots a:hover{
		background:rgba(0,0,0,.4);
	}
	.page_dots a.active{
		background:transparent;		
	}
/* --------- END pagination --------- */
/* --------- RWD --------- */
	@media only screen and (max-width: 1250px){
		.row .content{
			padding: 35px 35px calc(50% - 35px);
		}
		.row_verticle .content{
			padding-bottom: calc(100% - 35px);
		}
		.content p{
			height: 4.6em;
			-webkit-line-clamp: 3;
		}
	}
	@media only screen and (max-width: 980px){
		#row_large{
			width: 100%;
		}
		.row_verticle{
			position: relative;
			width: 100%;
			margin-left:0;
		}
		.row_verticle .pic,
		.row_verticle .content{
			display: inline-block;
			width: 50%;
			padding-bottom: 50%;
		}
		.row_verticle .content:last-child{
			margin-left: -4px;
			padding-bottom: calc(50% - 35px)
		}
		.row_verticle .content:before{
			top:55%;
			left:-14px;
			border-width: 15px 15px 15px 0;
			border-color: transparent white transparent transparent;
		}
		.row .content,
		.row .pic{
			max-width: none;
		}
		.content_box{
			display: block;
			width: 100%;
			margin-left: 0;
		}

		.content p{
			height: 9em;
			-webkit-line-clamp: 5;
		}
	}
	@media only screen and (max-width: 768px){		
		#row_large .content{	
			padding:10% 53px calc(66.66666% - 10%);
		}
	}
	@media only screen and (max-width: 680px){
		.row .pic,
		.row .content, 
		#row_large .pic,
		#row_large .content,
		.row_verticle .pic,
		.row_verticle .content{
			width: 100%;
			display: block;
			margin-left: 0;
			padding-bottom: 100%;
		}
		.row .pic:last-child,
		.row .content:last-child{
			margin-left: 0;
		}
		.content p{
			height: 4.6em;
			-webkit-line-clamp: 3;
		}
		#row_large .content,
		.row_verticle .content,
		.row .content{
			padding-bottom: calc(50% - 35px);
		}


		#row_large .content:before,
		.row_verticle .content:before,
		.row:first-child .content:before,
		.row:last-child .content:before{
			top:-14px;
			left: calc(50% - 15px);
			border-width: 0 15px 15px 15px;
			border-color: transparent transparent white transparent;
		}
		#row_large .content:before{
			border-color: transparent transparent #989892 transparent;
		}
		.content_box{
			/*background:white;*/
		}
		.content_box .row:first-child{
			position: relative;
			height: 130vw;
		}
		.content_box .row:first-child .content{
			position: absolute;
			top:87vw;
		}
		.content_box .row:first-child .pic{
			position: absolute;
			top:0;
		}
	}
	@media only screen and (max-width: 480px){
		#row_large .content,
		.row_verticle .content:last-child,
		.row .content{
			padding-bottom: calc(70% - 35px);
		}
		.content_box .row:first-child{
			height: 146vw;
		}
		.content_box .row:first-child .content{
			top:86vw;
		}
	}
	@media only screen and (max-width: 360px){
		#row_large .content,
		.row_verticle .content:last-child,
		.row .content{
			padding-bottom: calc(85% - 35px);
		}
		.content_box .row:first-child{
			height: 157vw;
		}
		.content_box .row:first-child .content{
			top:85vw;
		}
	}

/* --------- END RWD --------- */
