/* 2020/08/30 */
html    {
           font-size:18px;   /* base font-size */
           }
body   {
       width:100%;
       max-width:900px;  
       font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
       font-weight: 500;
       background:url("yuenimg/edo_chidori_03_300.jpg"); 
       background-color:lightslategray;
       background-repeat:repeat; 
       background-attachment:fixed;
       margin:0px auto 0px auto;
       text-align:center;
       }
#div_root {
       background:url("yuenimg/hantoumei_04.png");
       width:100%;
      }
h1    {
       color:black;
       font-size:2.0rem;
       text-align:center;
       letter-spacing:5px;
       width:100%;
       margin:10px auto 10px autox;
/*
       text-shadow:1px 1px 0 aliceblue, -1px -1px 0 aliceblue,
                         -1px 1px 0 aliceblue,  1px -1px 0 aliceblue,
                          0px 1px 0 aliceblue,  0 -1px 0 aliceblue,
                         -1px 0 0 aliceblue, 1px 0 0 aliceblue;
*/

       text-shadow:2px 2px 0 aliceblue, -2px -2px 0 aliceblue,
                         -2px 2px 0 aliceblue,  2px -2px 0 aliceblue,
                          0px 2px 0 aliceblue,  0 -2px 0 aliceblue,
                         -2px 0 0 aliceblue, 2px 0 0 aliceblue;
       font-family:'Monotype Corsiva','CourierNewPS-BoldItalicMT';
       }  
h2     {
       color:gold;
       font-size:2.5rem;
       text-align:left;
       letter-spacing:5px;
       padding:6px 2px 2px 12px;
       width:90%;
       margin:0px auto 20px 30px;  
       text-indent:20px;
       border-radius:4px;       
       text-shadow:2px 2px 2px black; 
       }
h4   {
       color:lightblue;
       font-size:1.2rem;
       text-align:left;
       width:100%;
       background:url("yuenimg/akaicon2.jpg"); 
       background-repeat:no-repeat;
       background-position:2px 2px;
       margin:10px auto 10px 10px;  
       text-indent:35px;
       }
h6   {
       color:ivory;
       font-size:1.0rem;
       display:flex;
       justify-content:flex-end;
       margin:5px 20px 15px auto; 
       }
p {
    text-indent:1.0rem;
    }

#div_text , #div_text2 {
       width:95%;
       padding:5px 10px 5px 10px;  
       text-align:center;
       margin:2px auto 2px auto;
       }
#div_text p {
       width:100%;
       font-size:1.0rem;
       text-align:left;
       text-indent:12px;
       color:ivory;
       padding:0px;
       }
#div_text a {
      color:orange;
      }

/* photo picture frame */
#div_frame1 ,  #div_frame2 {
    width:80%;
    margin:50px auto;
    }
#div_frame1 img , #div_frame2 img {
    width:100%;
    border:2px ridge gray;
    border-radius:8px;
    margin:10px auto;
    box-shadow:2px 0px 5px black;
    }
#div_frame2 img {
    width:80%;
    }
#div_frame1 p , #div_frame2 p {
    width:93%;
    color:ivory;
    margin:5px auto 5px 5px;
    text-align:left;
    text-shadow:1px 0px 0px black;
    }
#div_frame1 p a , #div_frame2 p a {
    color:pink;
    text-decoration:none;
    }
#span_u {
    border-style:solid;
    border-color:gray;
    border-width:0px 0px 2px 0px;
    }
#span_u2 {
    border-style:double;
    border-color:gold;
    border-width:0px 0px 4px 0px;
    }
#frame1 {
    position:relative;
    width:100%;
    height:0;
    padding-top:75%;
    }  
#frame1 iframe {
    position:absolute;
    top:0; left:0;
    width:100%;
    height:100%;
    }
/* modoru */
#modoru  {
      width:10%;
      margin:0px auto 10px 20px;
      float:left;
      text-align:center;
      font-size:1.2rem;
      font-weight:bold;
      padding:2px;
      }
#modoru a:link , #modoru a:visited , #return a:link , #return a:visited { 
      display:block;
      text-decoration:none; 
      border:2px ridge ivory;
      color:ivory;
      text-shadow:1px 1px 0px black; 
      border-radius:5px;
      }
#textright , #text_right  {
     color:white;
     text-align:right;
     margin-right:50px;
     font-size:1.0rem;
     }

/*------------------ mobile responsive ------------------------------*/
@media screen and (max-width: 414px) { 
      h1 {
             width:95%;
             font-size:1.2rem;
           }
      h2 {
             width:95%;
             font-size:1.2rem;
           }
h6   {
        font-size:0.8rem;
       }
#div_text , #div_text2 {
             width:95%;
             padding:2px;  
            }
#div_frame1 , #div_frame2 {
             width:90%;          
           }
#div_frame1 p , #div_frame2 p {
    width:98%;
           }
#modoru  {
      width:15%;
           }
}
/* --------------------------------------------------------------------- */