* {
  box-sizing: border-box;
}
	iframe {
			width: 100%;
      height:100%;
      }
      .iframe-wrap {
            display: block; padding: 30px; overflow: hidden; position: relative;word-wrap: break-word; 
            border:none;
      }
.item1 {
  grid-row:1/3;
  font-size:40px;
}
.item2 {
  grid-column: 2 / 3;
  }
    .grid-container {
  display: grid;
  grid-template-columns: 30% auto ;
  gap: 10px;
}

.grid-container > div {
  padding: 5px;
   border:1px solid black;
     font-family:helvetica;
}
.ja {
  margin:5px;
}

a.ja {
  font-size:13px;
}
body {
    font-size:15px;
       font-family:ms pgothic;
         background-image:url("https://i.pinimg.com/736x/83/de/75/83de75958dee0230fb2deaccf220d8e9.jpg");
}

.header {
  border:2px solid black;
  border-bottom:1px solid black;
  width:700px;
       margin: 0 auto;
             background-image:url("https://i.pinimg.com/736x/90/d3/00/90d3005323637cd050d29c61f246d64c.jpg");
        background-position: center;
       }
       h1 {
          filter: drop-shadow(0px 2px #000) drop-shadow(0 -1px #000) drop-shadow(2px 0 #000) drop-shadow(-1px 0 #000);
color:white; 
padding:5px;
position:relative;
top:15px;
       }
.column {
  float: left;
  height:282px;
          overflow: hidden;

}
.column.side {
  width: 98px;
    border:2px solid black;
  border-top:none;
  border-right:1px solid black;
     background:rgba(125, 50, 110, 0.56);
}
.column.middle {
  width: 602px;
    border:2px solid black;
  border-top:none;
border-left:none;
   background:rgba(255, 255, 255, 0.56);
   overflow-y:scroll;
}
.row::after {
  content: "";
  display: table;
  clear: both;
}
.row {
        width:700px;
             margin: 0 auto;

}
a {
  text-decoration:none;
  color:white;
  font-size:25px;
  padding:5px;
  transition: .5s;
}
a:hover {
letter-spacing: 2px;
}
p {
  padding:5px;
}
img {
  margin:0;
  float: left;
}