
  	.arrow-container  		{ position:relative; border: 1px solid #fff; width:80px; height:80px; padding:20px; margin-left:0; cursor:pointer; overflow:hidden; }
  	.arrow-container:hover 	{ position:relative; border: 1px solid #fff; padding:20px;}	

	div.arrow 			{ width:30px; height:30px; box-sizing:border-box;  /*  position: absolute; left: 50%; top: 50%;*/ cursor:pointer;
						    -webkit-transition: 0.2s ease-in-out;
						       -moz-transition: 0.2s ease-in-out;
						         -o-transition: 0.2s ease-in-out;
						            transition: 0.2s ease-in-out;}

  	div.arrow::before 	{ content: "";  display:block; width:100%; height:100%; border-width:2px 2px 0 0; border-style:solid; border-color:#333;
								    transition: 0.2s ease;
						      transform-origin: 100% 0; }

  	div.arrow:after 	{ content: ""; float:left; position:relative; top:-100%; width:100%; height:0%; border-width:0 1px 0 0; border-style:solid; border-color:#fafafa;
							         transform: rotate(45deg);
						      transform-origin: 100% 0;
							        transition: 0.2s ease; }

  	.arrow-container:hover div.arrow::after 	{ border-color:#333; height:180%;
  									 		 transform: rotate(45deg);}


  	.arrow-container:hover div.arrow::before  { border-color: #333;
    										 transform: scale(0.9);}

  	.arrow-container:hover div.arrow 			{ -webkit-transform: translate(10px, -10px);
    										 -moz-transform: translate(10px, -10px);
      										   -o-transform: translate(10px, -10px);
    										  -ms-transform: translate(10px, -10px);
    											  transform: translate(10px, -10px);}

  	div.left 	{ margin-top:0px;   left:5px; transform: rotate(-135deg) }
 	div.right 	{ margin-top:-7px; right:5px; transform: rotate(45deg)   }
  	
 	.ac-txt-sm { text-align:center; font-size:12px; text-transform:uppercase; color:#666; }


  	/* • For "news-inside.html / ports-detail"
   	------------------------------------------------------------------------- */
   	.main-detail { margin-bottom:50px; border-bottom:1px solid #ececec }
  	#body.news-inside .big-news-date,
  	#body.full-general .big-news-date { font-size:18px}
	/*#body.article .general {width:80%; margin: 0 auto;}
	#body.article #genc   { margin:0 auto; width:100%;}*/


  	#body.news-inside .arrow-blk,
  	#body.full-general .arrow-blk 				{ position:absolute; width:80px; height:80px; left:0px; top:0; z-index:100; margin-left:-100px; cursor:pointer; }

  	#body.news-inside .arrow-container,  	  	
	#body.news-inside .arrow-container:hover,
	#body.full-general .arrow-container,  	  	
	#body.full-general .arrow-container:hover  	{ width:80px; height:80px;}

	#body.news-inside div.arrow,
	#body.full-general div.arrow 				{ width:30px; height:30px;}

	#body.news-inside .arrow-blk:hover div.arrow::after,
	#body.full-general .arrow-blk:hover div.arrow::after 	{ border-color:#333; height:180%;
  									 							 transform: rotate(45deg);} 

	#body.news-inside .arrow-blk:hover div.arrow::before,
	#body.full-general .arrow-blk:hover div.arrow::before  { border-color: #333;
    										 					transform: scale(0.9);}
    #body.news-inside .arrow-blk:hover div.arrow,
    #body.full-general .arrow-blk:hover div.arrow 			{ -webkit-transform: translate(10px, -10px);
					    										 -moz-transform: translate(10px, -10px);
					      										   -o-transform: translate(10px, -10px);
					    										  -ms-transform: translate(10px, -10px);
					    											  transform: translate(10px, -10px);}

	/* ==========================================================================
	    Media Style
	============================================================================= */
	@media only screen and (max-width:1600px) {
  	#body.news-inside .arrow-blk,
  	#body.full-general .arrow-blk  			 { width:50px; height:50px; margin-left:-60px; }

  	#body.news-inside .arrow-container,  	
	#body.news-inside .arrow-container:hover,
	#body.full-general .arrow-container,  	
	#body.full-general .arrow-container:hover { width:50px; height:50px;}

	#body.news-inside div.arrow,
	#body.full-general div.arrow 			 { width:10px; height:10px;}
	}

	@media only screen and (max-width:1100px) {
  	#body.news-inside .arrow-blk,
  	#body.full-general .arrow-blk 			{ position:relative; width:100%; height:50px; left:0px; top:0; margin-left:-5px; margin-bottom:0; }
	#body.article .general {width:100%; margin: 0 auto;}

	.ac-txt-sm { display:inline; top:-22px; height:50px; left:-10px }

	#body.news-inside .arrow-container,
	#body.full-general .arrow-container { display:inline-block; }
	}

    @media only screen and (max-width:767px) {
	#body.news-inside .big-news-date,
	#body.full-general .big-news-date   { font-size:16px }

	#body .general .main-detail h2  { font-size:24px!important; color:ews }

	}