@charset "utf-8";



/*見出し*/
.m1{
font-size: 15px;
font-weight: bold;
line-height:170%;
margin-top:20px;
			}
.tai {                 /*見出しタイトル*/
font-size: 20px;
margin-top: 5px;
			}
.iro {                 /*完売お知らせ*/
color: #8f14cc;
}

			
/*シナリオ集自体の紹介*/
.info{
width:700px;
border: solid #455765;
border-width:1px 0px 1px 0px;
margin: 40px auto 40px auto;
padding-bottom:20px;
			}
			
.cover{                                /*シナリオ集の表紙*/
width:100%;
margin: 10px auto;
			}
			
.nav3 {                                /*値段などのリスト*/
width:550px;
margin: 20px auto;
justify-content: space-evenly;         /*等間隔配置*/
			}	

.infobun {
width:600px;
margin:0 auto 30px auto;
  text-align: justify;                 /*文字列均等配置*/
  text-justify: auto;                  /*文字列均等配置*/
  font-size:13px;
  line-height:170%;                    /*行間隔*/
  padding:0 25px;
			}

			

/* グリッド配置とデザイン、画像左 */
.parent-h { 
display: grid; 
width:700px;
grid-template-columns: 220px 480px; 
grid-template-rows: 50px 1fr 50px; 
grid-column-gap: 0px;
grid-row-gap: 0px; 
margin-bottom: 0px;
background-color: #eae9ef;
border-radius: 10px;
padding: 10px 0px 0px 0px;
}
.midashi-h { 
			grid-area: 1 / 2 / 2 / 3; }
			
[class^="midashi"] {                    /* midashiが付くヤツまとめて指定 */
  font-size: 16px;
  font-weight: bold;
  border: none;
  padding: 18px 15px 0px 15px;
  text-align: left;
  vertical-align: middle;
						} 
.sakuka-h {                             /* がぞう左 */
			grid-area: 1 / 1 / 4 / 2; }
			
[class^="sakuka"] {	                    /* sakukaが付くヤツまとめて指定 */
  padding: 0px;
  margin: 0 10px 10px 10px;
  vertical-align: middle;
						} 
.nakami-h {                              /* なかみ左 */
			grid-area: 2 / 2 / 3 / 3;}
			
[class^="nakami"] {	                    /* nakamiが付くヤツまとめて指定 */
			font-size: 13px;
  padding: 5px 15px 15px 15px;
  text-align: left;
  line-height:160%;
  text-align: justify;                 /*文字列均等配置*/
  text-justify: auto;                  /*文字列均等配置*/
						} 
.rink-h {
  grid-area: 3 / 2 / 4 / 3; 
  text-align: right;
  padding-bottom: 0px;
						} 
			
/* グリッド配置とデザイン、画像が右 */
.parent { 
display: grid; 
width:700px;
grid-template-columns: 480px 220px; /* グリッドの大きさ、横*/
grid-template-rows: 50px 1fr 50px; /* グリッドの大きさ、縦*/
grid-column-gap: 0px;
grid-row-gap: 0px; 
background-color: #fff;
border-radius: 10px;
padding: 10px 0px 0px 0px;
}
			
			
.sakuka {/* サークルカット*/
			grid-area: 1 / 2 / 4 / 3;
			} 
.nakami { /* 説明分*/
			grid-area: 2 / 1 / 3 / 2; 
}
			
.rinku { /* 下部リンク*/
			grid-area: 3 / 1 / 4 / 2; 
			} 

						
.betuuri {                              /* 別売り */
display: grid; 
width:700px;
grid-template-columns: 220px 480px; 
grid-template-rows: 1fr; 
grid-column-gap: 0px;
grid-row-gap: 0px; 
}
.b-gazou { grid-area: 1 / 1 / 2 / 2; 
margin:10px
							} 
.nakami-b { grid-area: 1 / 2 / 2 / 3; } 
				
				
				
/* スマホサイズ */
@media screen and (max-width: 768px) {

.info,.nav3,.infobun {
 width:auto;
overflow: hidden;                 /* 親をはみ出ない */
					}
.tanomu{
width:100%;
  overflow: hidden;                 /* 親をはみ出ない */
					}
						
					/* スマホサイズのグリッド配置 サクカ右 */
.parent { 
display: grid; 
width:100%;
grid-template-columns: 100%; 
grid-template-rows: 50px 1fr auto 50px;
grid-column-gap: 0px;
grid-row-gap: 0px; 
}
[class^="midashi"] { grid-area: 1 / 1 / 2 / 2; 
  padding: 15px 15px 15px 18px;
} 
.sakuka { grid-area: 2 / 1 / 3 / 2; 
  padding: 2px;
							} 
.nakami { grid-area: 3 / 1 / 4 / 2; 
} 
.rinku { grid-area: 4 / 1 / 5 / 2; } 
			
						
/* スマホサイズのグリッド配置 サクカ左*/
.parent-h { 
display: grid; 
width:100%;
grid-template-columns: 100%; 
grid-template-rows: 50px 1fr auto 50px; 
grid-column-gap: 0px;
grid-row-gap: 0px; 
}
.sakuka-h { grid-area: 2 / 1 / 3 / 2; 
  padding: 2px;
							} 
.nakami-h { grid-area: 3 / 1 / 4 / 2; 
  padding: 15px 15px 15px 20px;
							} 
.rinku-h { grid-area: 4 / 1 / 5 / 2; } 
			
				
/* スマホサイズのグリッド配置 別売り*/
.betuuri{
width:100%;
grid-template-columns: 100%; 
grid-template-rows: auto auto; 
grid-column-gap: 0px;
grid-row-gap: 0px; 
				}
.b-gazou{ grid-area: 1 / 1 / 2 / 2;
				}
.nakami-b{ grid-area: 2 / 1 / 3 / 2;
				}
			}