/* --共通設定--*/
body {
margin:auto;
}

a img:hover{border:2px solid #cccc99;}
.box {
border:2px solid #666666;
}
.book {
   background-color:#ffffff;
   }
.opac { background-image: url(../BCG_060.gif);
   border-top:1px dotted #666666;
}   

 @media screen and (min-width: 768px) {
  /* --PC表示--*/
  
   body
 {
 width:1000px;
 }
  
   /*index.htm(トップページ)*/
#toppage 
{
max-width:750px;
}

footer {
width:100%;
height:auto;

}
div.footer1 {
float:right;
	
}

 
  /*Roma-p1.htm*/
/*説明文字指定*/ 
p.guide
{
margin-top:10px;
color:#0000cc;
font-weight: bold;
}

.book {
height:220px;
}
 
/*画像リスト*/
.cssgrid {
    text-align: center;
    margin-top: 100px;
    width: 90%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    grid-auto-rows: 1fr;
    grid-gap: 0.5em;
    padding: 1em 0.5em 0;
    margin: 0;
    align-items: stretch;

}

.cssgrid > div.box {
    overflow: visible;
    min-width: 0;
    padding: 0;
    font-size: 90%;
    vertical-align: top;
}

}

    
@media screen and (max-width: 767px) {
 /* --スマホ表示--*/
   /*index.htm(トップページ)*/
div.first img 
 {
 width:100%;
 height:auto;
 }
 
.footer1 {
padding:5px;
}

  /*Roma-p1.htm*/
 div.book   {
 text-align:center;
  }

}