a {
    color:#999999 ;
    text-decoration: none;
  }
  a:hover{
    color: #4d4d4d;;
  }

  


@media screen and (min-width:768px) {
    body {
    background-color:#fffffc;
    font-family:"游明朝体","游明朝","serif";
  }
 p{display: inline-block; 
   font-size:11pt;
   width: 48.8vw;
   letter-spacing: 0.1em;
   line-height: 1.8em;
   margin-top: -3.98vw;
   margin-left: 0.8vw;
   margin-bottom: 0vw;
     
 }
    p1{display: inline-block; 
   font-size:11pt;
   width: 24vw;
   letter-spacing: 0.1em;
   line-height: 2.2em;
   margin-top: -3.98vw;
   margin-left: 0.8vw;
   margin-bottom: 0vw;
     
 }
    p2{display: inline-block; 
   font-size:11pt;
   width: 48.8vw;
   letter-spacing: 0.1em;
   line-height: 2.2em;
   margin-top: 0vw;
   margin-left: 0.8vw;
   margin-bottom: 4.95vw;
     
 }
    p3{display: inline-block; 
   font-size:11pt;
   width: 48.8vw;
   letter-spacing: 0.1em;
   line-height: 1.8em;
   margin-top: 55.22vw;
   margin-left: 0.8vw;
   margin-bottom: 0vw;
     
 }
p4{display: inline-block; 
   font-size:11pt;
   width: 36.3vw;
   letter-spacing: 0.1em;
   line-height: 1.8em;
   margin-top: 55.22vw;
   margin-left: 0.8vw;
   margin-bottom: 0vw;
     
 }
 #name{width:24vw;
        display: block; 
        margin-top: 0.8vw;
        margin-left: 0.8vw;
        margin-right: 25.66vw;
        margin-bottom: 7.94vw;
    }
    }
 #menu1{width:12.33vw;
    display: block; 
    margin-top: 0.8vw;
    margin-left: 0vw;}
 #menu2{width:20.35vw;
    display: block; 
    margin-top: 0.8vw;
    margin-left: 0vw;}
        #menu{width: 0px;
            display: block; 
            margin: auto;}
            #instagram{height:2vw;
                display: block; 
                margin-top: 2.7vw;
                margin-left: 5vw;}
#taiyo{width: 3.73vw;
       height: 3.73vw;
            display: block;
            margin-top:0.8vw;
      margin-left: 0vw;}
 

 .app {
         width: 100vw;
         height: 100vh;
         border: 0px solid blue;
         display: flex;
         flex-direction: column;
           }        
 .header {
         height:15vw;
         background-color:transparent;
         box-sizing:border-box;
         border: 0px solid blue;
         position:sticky;
         top: 00px;
         display:flex;
         flex-direction:row;
         flex-grow:1;
            
           }
.main {
         display: flex;
         flex-direction: column;
         flex-grow:1;
           }
 
 
.myChangeImage{
    position:relative;
    z-index: 0;
    border: 0px solid blue;
    width:98.4vw;
    display: block;
    margin-left:0vw;
    margin-top:0vw;
    
}
.myChangeImagesp{
    position:relative;
    z-index: 0;
    border: 0px solid blue;
    width:85vw;
    display: none;
    margin-left:0vw;
    margin-top:0vw;
    
}

.myChangeImage img{
    position:absolute;
    z-index: 1;
    border: 0px solid blue;
    top: 0;
    left: 0;
    width:98.4vw;
    display: block;
    margin: auto;
    margin-left:0.8vw;
    margin-top:0vw;
    animation: ChangeImage 30s infinite;
    opacity: 0;
}

@keyframes ChangeImage{
    0%{ opacity: 0;}
    10%{ opacity: 1;}
    20%{ opacity: 1;}
    30%{ opacity: 0;}
    100%{ opacity: 0;}
}

.myChangeImage img:nth-of-type(1) {
     animation-delay: 0s;
}
.myChangeImage img:nth-of-type(2) {
    animation-delay: 6s;
}
.myChangeImage img:nth-of-type(3) {
    animation-delay: 12s;
}
.myChangeImage img:nth-of-type(4) {
    animation-delay: 18s;
}
.myChangeImage img:nth-of-type(5) {
    animation-delay: 24s;
}


.content {
         display: flex;
         flex-direction: row;
         flex-grow: 1;
         border: 0px solid blue;
           }
.pp {
         display: flex;
         flex-direction: row;
         flex-grow: 1;
         border: 0px solid blue;
           }

#left1{width: 49.2vw;
    display: block;
    border: 1px gray;
    margin: auto;
    margin-bottom:2vw;
    margin-left:0.8vw;
    margin-right:0vw;
    margin-top: 5vw;
     }
 #right1{width:49.2vw;
    display: block;
    border: 1px gray;
    margin: auto;
    margin-bottom:2vw;
    margin-left:0vw;
    margin-right:0vw;
    margin-top: 5vw;
       }
#left{width: 49.2vw;
    display: block;
    border: 1px gray;
    margin: auto;
    margin-bottom:2vw;
    margin-left:0.8vw;
    margin-right:0vw;
    margin-top: 0px;
     }
 #right{width:49.2vw;
    display: block;
    border: 1px gray;
    margin: auto;
    margin-bottom:2vw;
    margin-left:0vw;
    margin-right:0vw;
    margin-top: 0px;
       }

 
 .footer {
    height: 15vw;
    background-color:transparent;
    box-sizing: border-box;
    border: 0px solid blue;
    position: sticky;
    top: 00px;
       
      }
 
 
 
 @media screen  and ( max-width:768px) {
     body {
    background-color:#fffffc;
    font-family:"游明朝体","游明朝","serif";
  }
     .pp {
         display: flex;
         flex-direction: column;
         flex-grow: 1;
         border: 0px solid blue;
           }
 p{display: none; 
   font-size:11pt;
   width: 48.8vw;
   letter-spacing: 0.1em;
   line-height: 1.8em;
   margin-top: -3.98vw;
   margin-left: 0.8vw;
   margin-bottom: 0vw;
     
 }
    p1{display: none; 
   font-size:11pt;
   width: 24vw;
   letter-spacing: 0.1em;
   line-height: 2.2em;
   margin-top: -3.98vw;
   margin-left: 0.8vw;
   margin-bottom: 0vw;
     
 }
    p2{display: none; 
   font-size:11pt;
   width: 48.8vw;
   letter-spacing: 0.1em;
   line-height: 2.2em;
   margin-top: 0vw;
   margin-left: 0.8vw;
   margin-bottom: 4.95vw;
     
 }
    p3{display: inline-block; 
   font-size:9.5pt;
   width: 96.13vw;
   letter-spacing: 0.1em;
   line-height: 1.8em;
   margin-top: 0vw;
   margin-left: 1.93vw;
   margin-bottom: 0vw;
     
 }
p4{display: inline-block; 
   font-size:9.5pt;
   width: 96.13vw;
   letter-spacing: 0.1em;
   line-height: 1.8em;
   margin-top: 164.87vw;
   margin-left: 1.93vw;
   margin-bottom: 0vw;
     
 }
 
     
 #name{width: 50.45vw;
    display: block; 
    margin-left:4.45vw;
    margin-top: 7.34vw;
    margin-bottom:17.18vw;
    }
#menu1{width:0px;
    display:none; 
    margin: auto;
    position: absolute;
    top:10px;
    right:auto;}
     #menu2{width:0vw;
    display: none; 
    margin-top: 3vw;
    margin-left: 0vw;}
    #menu{width: 7.84vw;
        display: block; 
        margin-left:1.93vw;
        margin-top: 7.34vw;
        margin-bottom:17.18vw;
        }
     #taiyo{width: 7.84vw;
            height: 7.84vw;
        display: block; 
        margin-left:25.97vw;
        margin-top: 7.34vw;
        margin-bottom:17.18vw;
        }
        #instagram{width: 00px;
            display: none; 
            margin: auto;
            position: absolute;
            top:10px;
            right:auto;}
  

  .header {
          height: 100px;
          background-color:transparent;
          box-sizing: border-box;
          border: 0px solid blue;
          position: sticky;
          top: 00px;
             
            }
  
  .main {
          display: flex;
          flex-direction: column;
          flex-grow:1;
            }
  
 
  .content {
          display: flex;
          flex-direction: column;
          flex-grow: 1;
            }
.myChangeImagesp{
    position:relative;
    z-index: 0;
    border: 0px solid blue;
    width:96.13vw;
    display: block;
    margin-left:0vw;
    margin-top:vw;
    
}
.myChangeImage{
    position:relative;
    z-index: 0;
    border: 0px solid blue;
    width:96.13vw;
    display: none;
    margin-left:0vw;
    margin-top:0vw;
    
}

.myChangeImagesp img{
    position:absolute;
    z-index: 1;
    border: 0px solid blue;
    top: 0;
    left: 0;
    width:96.13vw;
    display: block;
    margin: auto;
    margin-left:1.93vw;
    margin-top:14.75vw;
    animation: ChangeImage 30s infinite;
    opacity: 0;
}

@keyframes ChangeImagesp{
    0%{ opacity: 0;}
    10%{ opacity: 1;}
    20%{ opacity: 1;}
    30%{ opacity: 0;}
    100%{ opacity: 0;}
}

.myChangeImagesp img:nth-of-type(1) {
     animation-delay: 0s;
}
.myChangeImagesp img:nth-of-type(2) {
    animation-delay: 6s;
}
.myChangeImagesp img:nth-of-type(3) {
    animation-delay: 12s;
}
.myChangeImagesp img:nth-of-type(4) {
    animation-delay: 18s;
}
.myChangeImagesp img:nth-of-type(5) {
    animation-delay: 24s;
}

.content {
         display: flex;
         flex-direction:column;
         flex-grow: 1;
         border: 0px solid blue;
           }

#left1{width: 96.13vw;
    display: block; 
    border: 0px gray;
    margin: auto;
    margin-bottom:10vw;
    margin-left:1.93vw;
    margin-right:0vw;
    margin-top: 7.96vw;
     }
 #right1{width:96.13vw;
    display: block; 
    border: 0px gray;
    margin: auto;
    margin-bottom:10vw;
    margin-left:1.93vw;
    margin-right:0vw;
    margin-top: 0vw;
       }
#left{width: 96.13vw;
    display: block;
    border: 0px gray;
    margin: auto;
    margin-bottom:10vw;
    margin-left:1.93vw;
    margin-top: 0px;

 
 
 }
 #right{width:96.13vw;
    display: block;
    border: 0px gray;
    margin: auto;
    margin-bottom:10vw;
    margin-left:1.93vw;
    margin-top: 0px;

 
 
 }


  
   .footer {
    height: 15vw;
    background-color:transparent;
    box-sizing: border-box;
    border: 0px solid blue;
    position: sticky;
    top: 00px;
       
      }
  
 }