body {
 	 font-family: "Nunito", sans-serif;
	 color: #783818;
	 background-image: url("image/bg.png");
	 background-repeat: repeat-y;
	 background-color: #fffcf2;
	 overflow-y: hidden;
}

.container {  
     display: grid;
     grid-template-columns: 0.5fr 700px 0.5fr;
     grid-template-rows: 1fr 1fr 1fr;
     gap: 0px 0px;
     grid-auto-flow: row;
     grid-template-areas:
         "menu-l main"
         "menu-l main"
         "menu-l main";
	 margin: 7em;
	 gap: 21px;
	 text-align: center;
	 justify-content: center;
	 display: flex;
}

.menu-r { 
     grid-area: menu-r;
}

.main { grid-area: main; }

.menu-l { 
     grid-area: menu-l;
	 margin-left: 8.4em;
	 width: 135px;
	 z-index: 1;
}

.main {
	 padding: 21px;
	 background-color: #fffef2;
	 border: 10px solid transparent;
	 border-image: url("image/border.png") 12 round;
	 border-radius: 1em;
	 background-image: url("image/main2.png");
	 height: 400px;
	 overflow: scroll;
	 overflow-x: hidden;
	 z-index: 1;
	 width: 39em;
}