.ccolumn {
  overflow: hidden;
  max-width: 100%;
  display: flex;
}
.cmain {
  max-width: 100%;
  flex: 1;
  background: none;
  padding: 0;
}
.csub {
  width: 55%;
  background: none;
  padding: 0;
  margin-top:200px;
}
.csub img{
  width:100%;height:auto;
}






@media screen and (max-width: 767px) {
  .ccolumn {
    display: block;
  }
  .cmain {
    width: 100%;
  }
  .csub {
    width: 100%;
    margin-top:10px;
  }
}









.col2{
	max-width: 100%;
	margin:0 auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}
.col2 > div{
	width: 50%;
	padding: 1px;
	font-size:.8em;
	overflow: hidden;
}


.col2 img{
	width:100%;height:auto;
}

.col2 > div > div{
	overflow: hidden;
}



@media screen and (max-width: 960px) {
.col2 > div{
		width: 33.33333%;
	}
}
@media screen and (max-width: 480px) {
.col2 > div{
		width: 50%;
	}
}








.col_2{
	max-width: 100%;
	margin:0 auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}
.col_2 > div{
	width: 20%;
	padding: 1px;
	font-size:.8em;
	overflow: hidden;
}


.col_2 img{
	width:100%;height:auto;
}

.col_2 > div > div{
	overflow: hidden;
}



@media screen and (max-width: 960px) {
.col_2 > div{
		width: 50%;
	}
}
@media screen and (max-width: 480px) {
.col_2 > div{
		width: 50%;
	}
}















.col3{
	max-width: 60%;
	margin:0 auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}
.col3 > div{
	width: 33%;
	padding: 10px;
	font-size:.8em;
	overflow: hidden;
}


.col3 img{
	width:100%;height:auto;
}

.col3 > div > div{
	overflow: hidden;
}



@media screen and (max-width: 960px) {
.col3 > div{
		width: 33.33333%;
	}
}
@media screen and (max-width: 480px) {


.col3{
	max-width: 99%;
}

.col3 > div{
		width: 33%;
	}
}


















.col_4{
	max-width: 90%;
	margin:0 auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}




.col_4 > div{
	width: 20%;
	padding: 10px;
	font-size:.8em;
	overflow: hidden;
}


.col_4 img{
	width:100%;height:auto;
}

.col_4 > div > div{
	overflow: hidden;
}






@media screen and (max-width: 960px) {
	.col_4 > div{
		width: 33.33333%;
	}
}
@media screen and (max-width: 480px) {
	.col_4 > div{
		width: 50%;
	}
}




.col4{
	max-width: 98%;
	margin:0 auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}
.col4 > div{
	width: 25%;
	padding: 10px;
	font-size:.8em;
	overflow: hidden;
}

.col4 span{
	display:block;font-size:12px;margin-top:-5px;	margin-bottom:30px;
}

.col4 img{
	width:100%;height:auto;
}

.col4 > div > div{
	overflow: hidden;
}



@media screen and (max-width: 960px) {
.col4 > div{
		width: 33.33333%;
	}
}
@media screen and (max-width: 480px) {
.col4 > div{
		width: 50%;
	}
}





.colt4{
	max-width: 98%;
	margin:0 auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}
.colt4 > div{
	width: 25%;
	padding: 10px;
	font-size:.8em;
	overflow: hidden;
}

.colt4 span{
	display:inline-block;font-size:12px;margin-top:-5px;	margin-bottom:30px;
}

.colt4 img{
	width:100%;height:auto;
}

.colt4 > div > div{
	overflow: hidden;
}



@media screen and (max-width: 960px) {
.colt4 > div{
		width: 33.33333%;
	}
}
@media screen and (max-width: 480px) {
.colt4 > div{
		width: 50%;
	}
}







