/ * oshikuma */
@charset "utf-8";
html{
	font-size:16px;
}
body {
	background-color: #ffffff;
    width: 1000px;
    margin: 0 auto;
    min-height: 100vh;
    <! border: 2px solid red; /* 外枠のスタイルを指定 */>
    border: 2px solid red; /* 外枠のスタイルを指定 */
    display: grid;

    grid-template:
        "... ...... ...... ...... ...... ...... ...... ..." 20px
        "... oyana  oyana  oyana  oyana  oyana  updat  ..." 40px
        "... ...... ...... ...... ...... ...... ...... ..."  2px
        "... hosna  hosna  hosna  hosna  hosna  photo  ..." 60px
        "... ...... ...... ...... ...... ...... photo  ..."  2px
        "... messa  messa  messa  messa  messa  photo  ..."160px
        "... ...... ...... ...... ...... ...... photo  ..."  2px
        "... date   date   teiki  teiki  teiki  photo  ..." 30px
        "... date   date   ...... ...... ...... photo  ..."  2px
        "... date   date   tukihi tukihi tukihi photo  ..."140px
        "... ...... ...... ...... ...... ...... photo  ..."  2px
        "... place  place  basyo  basyo  basyo  photo  ..." 40px
        "... place  place  ...... ...... ...... photo  ..."  2px
        "... place  place  jyusy  jyusy  jyusy  photo  ..." 60px
        "... ...... ...... ...... ...... ...... photo  ..."  2px
        "... build  build  build  map    map    photo  ..."210px
        "... ...... ...... ...... ...... ...... photo  ..."  2px
        "... footer footer ...... ...... ...... photo  ..."100px
        "... ...... ...... ...... ...... ...... ...... ..." 2px
        / auto 120px 2px 100px 2px 540px 220px auto;
	}
 
/* 親病院名 */
	oyaname {
    	grid-area: oyana;
    	background-color: rgba(0, 0, 0, 0); 
    	font-size: 1.8rem;
		font-weight: bold;
		color: #000080;
		font-family: "HG丸ｺﾞｼｯｸM-PRO";
		padding-left: 20PX;
	}

/* 更新日 */
	update {
    	grid-area: updat;
    	/* background-color: #ffff80; */
    	font-size: 1.0rem;
		font-weight: bold;
		color:#8b0000;
		font-family: "HG丸ｺﾞｼｯｸM-PRO";
	}

/* 病院名—ロゴ */
	hosname {
    	grid-area: hosna;
    	/* background-color: #ffff99; */
    	font-size: 1.0rem;
		font-weight: bold;
		color: #000000;
		font-family: "HG丸ｺﾞｼｯｸM-PRO";
		padding-left: 20PX;
	}

/* 案　内 */
	nav {
    	grid-area: messa;
    	/* background-color: #ffcc33; */
		line-height: 10px; 
		margin-top: 0x;
		margin-bottom:0px;
    	font-size: 1.2rem;
		font-weight: bold;
		color:#000000;
		font-family: "HG丸ｺﾞｼｯｸM-PRO";
		padding-left: 20PX;
	}

/* 開　院—ロゴ */
	date {
    	grid-area: date;
    	/* background-color: #ffccff; */
		padding-top: 10px;
	}

/* 定期開院日 */
	teiki {
    	grid-area: teiki;
    	/* background-color: #eeee00; */
    	line-height: 1px;
    	font-weight: bold;
		margin-top: 0px;
		margin-bottom:0px;
    	font-size: 1.5rem;
		color:#0000ff;
		font-family: "HG丸ｺﾞｼｯｸM-PRO";
	}

/* 開院月日 */
	tukihi {
    	grid-area: tukihi;
    	/* background-color: #eeeeee; */
    	line-height: 10px; 
		margin-top: 0px; 
		margin-bottom:0px;
    	font-size: 1.8rem;
		color:#FF6600;
		font-family: "HGS創英角ﾎﾟｯﾌﾟ体";
	}

/* 場　所—ロゴ */
	place {
    	grid-area: place;
    	/* background-color: #ffccff; */
		padding-top: 10px; 
	}

/* 開催場所 */
	basyo {
    	grid-area: basyo;
    	/* background-color: #eeffff; */
    	text-align:left;
    	line-height: 0px; 
		margin-top: 0px; 
		margin-bottom: 0px;
    	font-size: 1.8rem;
    	font-weight: bold;
		color:#0000ff;
		font-family: "HG丸ｺﾞｼｯｸM-PRO";
	}

/* 住所など */
	jyusyo {
    	grid-area: jyusy;
    	/* background-color: #eeeeee; */
    	line-height: 10px; 
		margin-top: 0px; 
		margin-bottom:0px;
    	font-size: 1.2rem;
    	font-weight: bold;
		color:#000000;
		font-family: "HG丸ｺﾞｼｯｸM-PRO";
	}

/* 建屋画像 */
	build {
    	grid-area: build;
    	/* background-color: #00ffe9; */
	}

/* 地　図 */
	map {
    	grid-area: map;
    	/* background-color: #ff00e9; */
 	}

/* ボタンロゴ */
	footer {
    	grid-area: footer;
    	background-color: rgba(0, 0, 0, 0); 
		padding-left: 20PX;
	}

/* 病院・おもちゃ画像 */
	photo {
    	grid-area: photo;
    	<! background-color: #ffffe9;>
	   	font-size: 1.2rem;
    	font-weight: bold;
		color:#000000;
		font-family: "HG丸ｺﾞｼｯｸM-PRO";
	}
}

@media screen and (max-width: 767px) {
	body {
		grid-template-rows:
			"oyaname" 20px
			"update " 20px
			"hosname"
			"nav    " 70px
			"date   " 30px
			"teiki  "
			"tukihi " 50px
			"place  "
			"basyo  " 20px
			"jyusyo " 30px
			"build  "
			"map    " 105px
			"photo  "
			"footer " 50px;
	}
}

