/*@media screen 
Smartphones (portrait and landscape) ----------- */

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	  
	div#wrapper{
			width:100%; 
			min-height:100%;
			margin:5 5; 
			margin-left:1%;
			background-color:#fff;
			padding:0 10px; 
			border-top:1px #BF6000 solid;
			font-size:1.5em; 
  	}
	div#middlewCommon {
			width:90%;
	}
	div#middlecontentwDetail {
			width:90%;
	}
	div#middlewRelate{
		width:90%;
	}
	div#rightcontentwSearch{
			width:90%;
	}
	div#middlewAddRelated{
		width:90%;
	}
	
	div#rightside{
	  		display:none;
  	}
	div#leftside{
	  		display:none;
  	}
	div#pageTop > #pageTopWrap {
		height:70px;
	}
	div#pageTop > #pageTopWrap > #pageTopLogo{
		display:none;
	}
	div#submenu{
		font-size :1.2em; 
  	}
	
	
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
	  
	  div#wrapper{
			width:100%; 
			min-height:100%;
			margin:5 5; 
			margin-left:1%;
			background-color:#fff;
			padding:0 10px; 
			border-top:1px #BF6000 solid;
			font-size:1.5em; 
  	}
	div#middlewCommon {
			width:90%;
	}
	div#middlecontentwDetail {
			width:90%;
	}
	div#middlewRelate{
		width:90%;
	}
	div#rightcontentwSearch{
			width:90%;
	}
	div#middlewAddRelated{
		width:90%;
	}
	
	div#rightside{
	  		display:none;
  	}
	div#leftside{
	  		display:block;
  	}
	div#pageTop > #pageTopWrap {
		height:70px;
	}
	div#pageTop > #pageTopWrap > #pageTopLogo{
		display:none;
	}
	div#submenu{
		font-size :1.2em; 
  	}

}

/*
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {

	div#wrapper 			{ width:320px; }
	div#wrapper{
			width:100%; 
			min-height:100%;
			margin:5 5; 
			margin-left:1%;
			background-color:#fff;
			padding:0 10px; 
			border-top:1px #BF6000 solid;
			font-size:1.5em; 
  	}
	div#middlewCommon {
			width:90%;
	}
	div#middlecontentwDetail {
			width:90%;
	}
	div#middlewRelate{
		width:90%;
	}
	div#rightcontentwSearch{
			width:90%;
	}
	div#middlewAddRelated{
		width:90%;
	}
	
	div#rightside{
	  		display:none;
  	}
	div#leftside{
	  		display:none;
  	}
	div#pageTop > #pageTopWrap {
		height:70px;
	}
	div#pageTop > #pageTopWrap > #pageTopLogo{
		display:none;
	}
	div#submenu{
		font-size :1.2em; 
  	}
}

*/