@charset "UTF-8";

/*========================================================
 *  category.php用                                        
 ========================================================*/
/*=================================================================*/
/* box100c 枠　20200612 20211010                                   */
/* header部分とメイン部の間に余白を作る                            */
/* ipad縦、ipad横、横サイズがipadサイズ範囲内の画面を分けて定義    */
/*=================================================================*/



@media only screen 
  and (device-width: 768px)
  and (orientation: portrait)
  and (-webkit-min-device-pixel-ratio: 1)
    {
      /* iPad 縦 CSS */
      .box100c {
    	width:98%;
        margin: 0 auto;
    	/*background-color:#FFFFFF;*/
    	display:block;
	    vertical-align:top;
    	text-align:center;
	    height: 95%;
        min-height: 100vh;
        padding: 85px 0 0 0;
        overflow: auto;
		-webkit-overflow-scrolling: auto;
        overflow-scrolling: auto;
     /*   -webkit-overflow-scrolling: touch;*/
    }
}


@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 1) /*-webkit-min-device-pixel-ratio*/
  /*and (resolution: 326dpi) */ /*ipad mini を除外*/
  
  /*and (device-width: 1024px)*/
  /*and (orientation: landscape)*/
  /*and (-webkit-min-device-pixel-ratio: 1)*/
  
    {
      /* iPad 横 CSS */
      .box100c {
    	width:100%;
        margin: 0 auto;
    	/*background-color:#FFFFFF;*/
    	display:block;
	    vertical-align:top;
    	text-align:center;
	    height: 95%;
        min-height: 100vh;
        padding: 85px 0 0 0;
        /*overflow: auto;*/
    /*    -webkit-overflow-scrolling: touch;*/
		  
        -webkit-overflow-scrolling: auto;
        overflow-scrolling: auto;
        overflow: auto;
  
        }
		
}


/*  768x1024のipadを、上記処理にて画面開始位置をずらしているが、          */
/*  このサイズ範囲のスマホ横向き画面が含まれてしまう為、以下で除外する    */



@media only screen 
  and (min-width: 769px)  /*横向き769以上*/
  and (max-width: 1023px) 
  and (orientation: landscape)

    {
      /* iPhone-x 375x812,896x414 横 CSS */
      .box100c {
    	width:100%;
        margin: 0 auto;
    	/*background-color:#FFFFFF;*/
    	display:block;
	    vertical-align:top;
    	text-align:center;
	    height: 95%;
        min-height: 100vh;
        padding: 0px 0 0 0;
        /*overflow: auto;*/
    /*    -webkit-overflow-scrolling: touch;*/
		  
        -webkit-overflow-scrolling: auto;
        overflow-scrolling: auto;
        overflow: auto;
  
        }
		
}
	



@media only screen 
  and (width: 768px)  /*横向き768*/
  and (orientation: landscape)

    {
      .box100c {
    	width:100%;
        margin: 0 auto;
    	/*background-color:#FFFFFF;*/
    	display:block;
	    vertical-align:top;
    	text-align:center;
	    height: 95%;
        min-height: 100vh;
        padding: 0px 0 0 0;
        /*overflow: auto;*/
    /*    -webkit-overflow-scrolling: touch;*/
		  
        -webkit-overflow-scrolling: auto;
        overflow-scrolling: auto;
        overflow: auto;
  
        }
		
}


