/*PC表示*/
@media (min-width: 801px) {
.hidari{
 width:240px;
 height:100vh;
 margin:0;
 padding:0 4px 0 0;
 overflow-x:hidden;
 overflow-y:hidden;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #2196F3;     /* 文字色指定 */
}
.d1{
 text-align:left;
 border:double;
 margin:30px;
 padding: 40px;
border-color: #ff00ff;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #ffffff;     /* 文字色指定 */
background-image:url(./img/mainbg.bmp);
 }
.d2{
 text-align:center;
 border:double;
 margin:30px;
border-color: #ff00ff;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #ffffff;     /* 文字色指定 */
background-image:url(./img/mainbg.bmp);
 }
}

/*スマホ表示*/
@media (max-width: 800px) {
.hidari{
 width:100px;
 height:100vh;
 margin:0;
 padding:0 4px 0 0;
 overflow-x:hidden;
 overflow-y:hidden;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #2196F3;     /* 文字色指定 */
}
.d1{
 text-align:left;
 border:double;
 margin:10px;
 padding: 10px;
border-color: #ff00ff;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #ffffff;     /* 文字色指定 */
background-image:url(./img/mainbg.bmp);
 }
.d2{
 text-align:center;
 border:double;
 margin:10px;
border-color: #ff00ff;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #ffffff;     /* 文字色指定 */
background-image:url(./img/mainbg.bmp);
 }
}

html,body{
  padding:0;
  margin:0;
}
 img{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
    }
.menu{
	height:3%;
	width:100%
	padding:10px 0 5px 0;
	margin:0 auto 0 auto;

    border-width: 1px;
    border-style: solid;
    border-color: #ffffff;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #2196F3;     /* 文字色指定 */
background-image:url(logo.bmp);
}
.base{
  display:flex;
  flex-direction:row;
  width:100vw;
  height:100vh;
  overflow:hidden;

}

.migi{
 overflow-x:hidden;
 overflow-y:scroll;
 height:100%;
 width:100%;
 flex:1;
    border-width: 3px;
    border-style: solid;
    border-color: #cc4343;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #2196F3;     /* 文字色指定 */

}
.novel{
	width:222px;
	padding:10px 0 5px 0;
	margin:0 auto 0 auto;
	text-align:center;
    border-width: 3px;
    border-style: solid;
    border-color: #ffffff;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #2196F3;     /* 文字色指定 */
background-image:url(./img/mainbg.bmp);
}
.bg{
background-image:url(b1.bmp);
}

.d3{
 text-align:center;
 border:double;
 margin:30px;

 width:50%;
border-color: #33cccc;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #ffffff;     /* 文字色指定 */
background-image:url(./img/mainbg.bmp);
 }
.c1{
 border:double;
 margin:10px;
border-color: #ff00ff;
 text-align:center;
 font-size: 16px;    /* 文字サイズ指定 */

background-image:url(./img/mainbg.bmp);
}
.date1{
 text-align:left;
 margin: 0px 1200px 0px 0px;
 padding: 0px;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #ffffff;     /* 文字色指定 */
 }
.top1{
 text-align:center;
 margin: 0px 0px 0px 0px;
 padding: 50px 0px 0px 0px;
 font-size: 20px;    /* 文字サイズ指定 */
    color: #ffffff;     /* 文字色指定 */
 }