@charset "UTF-8N";#main,.catch{justify-content:center}.catch,.txt{
			display:flex;border:1px solid silver;background-color:#fff8f0;height:50px;
}.contain,.cover{object-fit:contain;object-fit:contain}.container{
			width : 410px;margin : 0.5em auto;
}.catch{
			font-size:1.3em;line-height:50px;
}#main{
			margin-top:10px;display:flex;align-items:center;border:1px solid silver;height:390px;width : 410px;
}#sub{
			margin : 8px 0px;padding:0;width:100%;height:96px;display:grid;grid-template-columns:repeat(4,1fr);gap:2px
}#sub li{
			border:1px solid silver;
}.txt{
			margin-bottom:8px;justify-content:center;align-items:center
}.contain{
			width : 410px;height:388px;
}.cover{
			vertical-align:bottom;width:94px;height:94px;
}.version{
			height:auto;width:inherit;line-height:1.6;font-size:1em; margin-bottom: 0.5em;
}.bn{
			color:#fff;padding-top:.5em;padding-right:.4em;
}

.col{
			  
  display: grid;
  grid-template-columns: repeat(4, 1fr);/*calc(410px / 4);*/
  grid-template-rows: 35px 40px;
  gap: 6px 3px;
  grid-auto-flow: row;
  grid-template-areas:
    "si si si si si"
    "n n-1 s c-a c-b";
  width: 410px;  
}

.si{
			grid-area: si; 
    grid-auto-flow: column;
    background-color: #fff8f0;
}

.n { grid-area: n; }

.n-1 { grid-area: n-1; }

.s { grid-area: s; }

.c-a { grid-area: c-a; }

.c-b { grid-area: c-b; }

.col *{
  border: 1px solid #c0c0c0;
  marginn: 8px 0px;
  left: 0;
  width: 100%;
  height: 100%;
  display: grid;
  align-items: center;
  justify-content: center;
}

.ding{
  background-color : #ffa4a4;
}

.example{
  border : medium none;
}
/* コメント */