/* ===== Webサイト全体のスタイル ===== */
/* html */
html {
  height: 100%;
  overflow-x: hidden;
}
 
@font-face {
font-family: 'myfont';
src: url(font/font.ttf);
}

/* body */
body {
 height: 100%;
  margin: 0;
font-family: 'myfont';
}

h1 {
  font-size: 50px;/* フォントの大きさ */
}

h2
  font-size:40px;
}


p {
  color: #ffffee;/* フォントの色 */
  font-size: 15px;/* フォントの大きさ */
}

.title {
  color: #222222;/* フォントの色 */
}

ul li, ol li {
 padding: 0px;
  list-style-type: none!important;/*ポチ消す*/
}

hr {
height: 5px;
background-color: #ff5050;
 border: none;
 width: 100%;
}

.big {
 width: 100%;
}

.icon {
 float: left;
}

.menu {
  background-color: #ffb3e3;
margin-top: 70px;
  position: fixed;
 width: 100%;
display: flex;
justify-content: center;
color: #ffffff;
z-index:10000;
}


.btn{
padding:  20px;
  color: #fff;
font-size: 20px;
  background-color: #ffb3e3;
   border-radius: 100vh;
text-decoration:none;
}

.siro{
  color: #fff;
text-decoration:none;
}


.new {
  background-color: #222222;
  color: #ffffff;
}

.new2 {
  background-color: #222222;
  color: #ffffff;
   overflow:auto;    
justify-content:space-between;
}


.title {
  color: #ffffff;
padding: 20px;
}

.main {
  background-color: #ffffff;
  color: #222222;
}

.gazou {
background: linear-gradient(to bottom right, #9bcafd,#75a5fe);
  color: #222222;
  height: 100%;
}


.pink {
  background-color: #ffb3e3;
  color: #ffffff;
  padding: 20px;
}

.oped { 
background-color: #ffffff;
 background-image: url(img/two.png);
background-repeat: no-repeat;
background-size: 40%;
background-position:  right bottom;
  color: #222222;
float: left;
bottom: 0px;
}

.left {
  padding: 20px;
float: left;
bottom: 0px;
}

.cen {
flex-wrap: nowrap;
 padding: 20px;
margin: 15px;
}

.two {
bottom: 10px;
}

.koru{
background-image: url(img/こるてぃ.png);
background-repeat: no-repeat;
 background-size: contain;
 background-position: 50%;
  background-color: #222222;
  color: #ffffff;
padding: 10px;
}

.kuma{
background-image: url(img/くまのす.png);
background-repeat: no-repeat;
 background-size: contain;
 background-position: 50%;
  background-color: #4c4c4c;
  color: #ffffff;
padding: 10px;
}

.hiya{
background-image: url(img/ひや.png);
background-repeat: no-repeat;
 background-size: contain;
 background-position: 50%;
  background-color: #222222;
  color: #ffffff;
padding: 10px;
}


.boxes{
padding: 5%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 20px;
  row-gap: 80px;
}
.box {
  aspect-ratio: 16 / 9;
}

.fuchi{
padding: 1em;
display: inline-block; 
}