body {
    margin: 0pt;
    padding: 0pt;
    font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro",
		 "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",
		 "HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
    font-size: min(12pt, max(9pt, 3.5vmax));
    background-image: url("../Image/QR_sembatsu2025.png");
    background-size: 96px;
    background-repeat: no-repeat;
    background-position: bottom right;
}

h1 {
    margin: 0pt;
    padding: 10pt 20pt 0pt;
    border: solid #dff;
    border-width: 0px 0px 4px 0px;
    background-image: url("../Image/AJSembatsu_Title.jpg");
    background-repeat: no-repeat;
    background-size: 100%;
    color: #008;
    font-family: sans-serif;
    text-align: center;
    font-size: max(min(3.2vmax, 32pt), 18pt);
    width: calc(max(800px, min(100%, 1200px)) - 40pt);
}

h1 .date, h1 .place {
    margin: 0pt;
    padding: 0pt;
    text-align: right;
    font-size: 50%;
}

.attendee, .record, .progress {
    margin: 6pt 0pt;
    padding: 0em 1em;
    border: solid #00f;
    border-width: 0px 0px 1px 0px;
}

h2 {
    position: sticky;
    top: 0;
    margin: 0pt;
    padding: 0pt;
    background-color: #fff;
    font-family: sans-serif;
}

/*
.attendee h2:before {
    content: '';
    display: inline-block;
    width: 36px;
    height: 36px;
    background-image: url("../Image/Tokkikki/Post.gif");
    background-size: contain;
    vertical-align: middle;
    margin-right: .5em;
}
 */

@media screen and (max-width: 600px) {
    body {
	background-color: #fff;
    }

    h1 {
	padding: 5pt 0pt 0pt;
	font-size: max(min(3.2vmax, 18pt), 15pt);
	width: max(200px, min(100%, 600px));
    }

    h1 .date, h1 .place {
	margin: 0pt;
	padding: 0pt;
	text-align: right;
	font-size: 60%;
    }
}