body { background-color: white; margin:0; } header { background-color:#eeffff; position: fixed; width:100%; } header ul{ float:right; margin:0; padding-left:0; } header li{ display:inline-block; } header li a{ display: flex; align-items: center; font-weight: bold; color: #2b3a62; height:80px; font-size:20px; padding:0 20px; } header h3 { margin:10px 20px; display:inline-block; } .main{ padding-top:50px; } .content{ margin:50px 10%; } h1 { color: #0000cc; background-color:red; font-size: 40px; text-align: center; text-decoration: blink; border:5px dashed white; } h2 { font-size: x-large; color: #1E90FF; padding-left:10px; border-bottom:1px dashed #dddddd; border-left:30px solid #dddddd; } h3 { font-size:35px; } p { font-size: large; color: #000000; text-indent: 1em; } address { text-align: right; } .main a:link { text-decoration: underline; } .main a:visited { color: #000080; text-decoration: underline; } a:hover { background-color: #eeeeee; } a:active { color: #0000ff; } .hoge {color:#ffccff} p.piyo {color:#ffccff} .imgs{ text-align:center; } .text { width:90%; margin:0 auto; } .calender { margin-top:50px; } table { font-size:20px; width:90%; margin:0 auto; text-align:center; border:2px solid red; } th{ width:12%; height:80px; } .calender .ho { color:red; } .calender th:first-child { color:red; } .calender th:last-child { color:blue; } .calender .day th{ color:black; } .calender .day th:first-child { background:red; } .calender .day th:nth-child(2) { background: pink; } .calender .day th:nth-child(3) { background: orange; } .calender .day th:nth-child(4) { background: aqua; } .calender .day th:nth-child(5) { background: saddlebrown; } .calender .day th:nth-child(6) { background: yellow; } .calender .day th:last-child { background: blue; } .GG{ text-align:center; list-style: none; margin: 30px 0 100px 0; } .GG li{ float:right; height: 208px; width:295; margin-bottom: 100px; list-style-image: url("GG-1.png"); } .GG p { display:none; font-size:25px; } .GG-icon{ background-position: left 0; } .GG .icon:hover { list-style-image: url(GG-2.png); } .GG .icon:hover + p { display:block; } .GG .icon:active { list-style-image: url(GG-3.png); } .GG .icon:active + p { color:blue; } .box1 div { margin:0; padding:0; } .box1 .green { background:green; height:12ex; width:6ex; float:left; } .box1 .white { background:white; height:12ex; width:6ex; float:left; } .box1 .red { background:red; height:12ex; width:6ex; float:right; } .check{background-color: red;color: red} @media screen and (max-width: 960px){ header li a{ font-size:14px; height:60px; } header img{ height:60px; } .main{ padding-top:35px; } header h3 { font-size:25px; } } @media screen and (max-width:740px){ header { text-align: center; } header img{ display: inline-block; text-align: left; margin-left:0; } header ul{ display:block; float:none; text-align:center; } .main{ padding-top:100px; } } @media print{ h1{ color:black; background:none; border-color:black; } h2{ color:black; } }