.tate { writing-mode: tb-rl; width:150px; background-color:darkturquoise; color:white;} .size1{font-size:150%;} .size{font-size:300%; transform: scale(1.5, 1); margin-top:100px; } div{ display: flex; flex: 1; } main{ flex: 1; } .syousai{text-align:right;position:relative;right:190px;bottom:25px;} .midasi{background-color:darkturquoise; color:white;} th{border-style:solid;border-color:darkturquoise; color:darkturquoise;} .sub{font-size:220%;} .sub2{border-style:solid;} .sub1{font-size:80%;} .sub3{font-size:150%;} body{background-color:lavender;} h1 { padding: 1rem 2rem; border-top: 6px double #000; border-bottom: 6px double #000; background: #094; -webkit-box-shadow: 5px 5px 0 #007032; box-shadow: 5px 5px 0 #007032; text-align:center; } h2{ background: linear-gradient(transparent 70%, #a7d6ff 70%); } nav ul{ margin: 0 auto; padding: 0; text-align: center; } nav ul li{ display: inline-block; position: relative; padding-right: 15px; margin-right: 10px; } nav ul li a::after, nav ul li a::before { display: block; content: ”; position: absolute; } nav ul li a::after { top: 10%; right: 0; width: 13px; height: 13px; background-color: #ccc; border-radius: 100%; } nav ul li a.current::after, nav ul li a:hover:after{ background-color: #3498db; } nav ul li a::before { z-index: 2; top: 40%; right: 5px; width: 5px; height: 5px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } nav ul li a{ text-decoration: none; color:#aaa; display: inline-block; width: 100%; } nav ul li a.current{ color:#555; } nav ul li a:hover{ color:#555; }