html {
  height: 100%;
  overflow-x: hidden;
}
 
@font-face {
font-family: 'myfont';
src: url(font/font3.otf);
}
body {
 height: 100%;
  margin: 0;
font-family: 'myfont';
}

h1 {
  font-size: 50px;
   font-weight: normal;
}

h2{
  font-size:40px;
}


p {
  color: #ffffee;
  font-size: 15px;
}

ul li, ol li {
 padding: 0px;
  list-style-type: none!important;
}

hr {
height: 3px;
margin:30px 0;
background-color: #333;
 border: none;
}

/* 背景を黒くしたいときはヘッダー以外でも使われる最強のヘッダー */
header {
  background-color: #333333;
  color: #ffffff;
font-size: 40px;
padding :20px;
 position: relative;
text-align: center;
}

header.tab {
text-align: left;
}

img.tab{
width: 100px;
}


.none{
display:none;
}

.btn{
padding: 30px;margin: 40px 0;
text-align: center;
background-color: #fff;
border-radius: 100vh;
display: block;
color: #333;
font-size: 30px;
text-decoration: none;
}

.nadeshiko {
  background-color:#ffb7d2;
  color: #fff;
  padding: 20px;
}

.buildlist{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 20px;
  row-gap: 20px;
}

.img{
width:100%;
border-radius:15px;
}