Newer
Older
2020-c119073-taka / style.css
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;
	}
}