@charset "utf-8";

html, body {
    margin: 0px;
    padding: 0px;
   }
   body {
    font-family: "Alumni Sans Pinstripe", serif;
    font-size: 1em;
    color: #333333;
    line-height:1.8em;
    background-color: rgb(252, 246, 238);
    }
 
 a{text-decoration: none;}
 a:link {color: #333333;}

 #container{
    /*background-color: rgb(3, 1, 46);*/
    margin: 0 auto;
    width: 100%;
    max-width :558px;
    height: 2263px;
    background-image: url(png/haikei.png);
    background-size:cover;
 }

 #keyvisual{
   display: flex;
   position: relative;
   /* display: flex;
    background-image: url(png/yasuda.png);
   background-repeat: no-repeat;
   background-position: 50px 10px;
   position: relative;
   height: 400px;
   border: solid 1px;  領域を見せるやつ*/
}

.mein{
   padding-left: 112px;
   padding-top: 55px;
   height: 470px;
}
.mein2{
   width: 56px; height: 29px;
   margin: 107px -195px;
}
.mein3{
   margin: 60px -5px;
}
.dai{
    font-family: "Kaisei Opti", serif;
    font-weight: 400;
    font-style: normal;
    writing-mode: vertical-lr;
    font-size: 36px;
    margin: 95px 0px 0px -44px;
}
.dai2{
   font-family: "Kaisei Opti", serif;
    font-weight: 400;
    font-style: normal;
    writing-mode: vertical-lr;
    font-size: 36px;
    margin: 150px 0px 0px -305px;
}

#moji{
   width: 100%; 
   font-family: "Kaisei Opti", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;
}
.moji1{
   margin: -31px 0px 0px 190px;
}
.moji2{
   margin: 2px 0px 0px 160px;
}
.moji3{
   margin: 3px 0px 0px 160px;
}
.moji4{
   margin: 4px 0px 0px 160px;
}
.moji5{
   margin: 4px 0px 0px 230px;
}
.moji6{
   margin: 2px 0px 0px 170px;
}

#mokuji{
   display: flex;
   position: relative;
   /*border: solid 1px;*/
}
.usi2{
   width: 340px; height: auto;
   position: absolute;
   top: 28px;
   right: 110px;
}
.mokuji1{
   width: 340px; height: auto;
   padding-top:140px;
   padding-left: 110px;
}
#mokuji2{
   width: 100%; 
   font-family: "Kaisei Opti", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 11px;
    margin: -14px 0px 0px 111px;
}
#cooking{
   width: 100%; 
   /*border: solid 1px;*/
   position: relative;
}
.usu{
   width: 365px; height: auto;
   margin-top: -70px;
   margin-left: 97px;
}

.cook1{
   font-family: "Kaisei Opti", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    position: absolute;
    top: 80px;
    right: 120px;
}
.resipi1{
   width: 127px; height: 44px;
   position: absolute;
   top: 145px;
   right: 120px;
}
.cook2{
   font-family: "Kaisei Opti", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    position: absolute;
    top: 300px;
    right: 315px;
}
.resipi2{
   width: 127px; height: 44px;
   position: absolute;
    top: 365px;
    right: 310px;
}
.cook3{
   font-family: "Kaisei Opti", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    position: absolute;
    top: 537px;
    right: 113px;
}
.resipi3{
   width: 127px; height: 44px;
   position: absolute;
   top: 605px;
   right: 120px;
}
.cook4{
   font-family: "Kaisei Opti", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;  
    position: absolute;
    top: 760px;
    right: 300px; 
}
.resipi4{
   width: 127px; height: 44px;
   position: absolute;
   top: 825px;
   right: 310px; 
}
.cook{
   width: 305px; height: 865px;
   position: absolute;
   top: 50px;
   right: 125px;
}
.yama{
   width: 360px; height: auto;
   position: absolute;
   top: -17px;
   right: 97px;
}
#sita{
   display: flex;
   position: relative;
   /*border: solid 1px;*/
}
.rogo{
   width: 98px; height: 51px;
   margin: -50px 0px 0px 230px;
}
.usi{
   width: 350px; height: auto;
   position: absolute;
   top: -148px;
   right: 100px;
}