/* ===== 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;
}

.fukidashi{
font-size: 60px;
padding: 25px;
background-color: #ffffff;
border-radius: 100px;
}

.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;
}

.yozorairo {
background: linear-gradient(to bottom left, #5c4378,#292638); 
padding:5%;
}

.reimuiro {
  background-color: #ff584d;
  padding: 20px;
}

.marisairo {
  background-color: #ffd65c;
  padding: 20px;
}


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

.sukitoruiro {
background: linear-gradient(to bottom, #f2fcff,#b3ccff); 
color: #222222;
}

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


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