﻿@charset "utf-8";
 img {
     border: none;
   }


.shadow,.shadow_2{
overflow: hidden;
position: relative;
display: flex;
z-index: 20;
flex-direction: column;
justify-items: center;
align-items: center;
width:500px;height: 500px;
background-color:#fff;
box-shadow: 2px 5px 10px 1px #444;
}
.white_back{background-color: rgba(255,255,255,.7)}
.blue_back{background-color: rgba(215, 231, 231, 0.7)}
.pink_back{background-color: rgba(243, 178, 175, 0.7)}

.maru{border-radius: 50%;}









.content_shadow{
position: relative;
display: flex;
align-items: center;
justify-content: center;
z-index: 21;
width: 500px;
height: 500px;
background-color: #fff;
}

.fontb{background-color:rgba(255, 255, 255, 0.5);
    cursor:pointer;
    position: absolute;
    display: flex;
    z-index: 33;
    font-size: 0.7rem;
    line-height: 1rem;
 bottom:0;
text-shadow:1px 1px 1px#fff;
}
.fontt{background-color:rgba(255, 255, 255, 0.5);
    cursor:pointer;
    position: absolute;
    top:0;
    left: 0;
    display: flex;
    z-index: 33;
    font-size: 0.7rem;
    line-height: 1rem;
    text-shadow:1px 1px 1px#fff;
}
.fontm{background-color:rgba(255, 255, 255, 0.5);
     position: absolute;
       z-index: 33;
    font-size: 0.7rem;
    line-height: 1rem;
 bottom:0;
    text-shadow:1px 1px 1px#fff;
}
/*--------------*/





.box_shadow_80{
    position:absolute;
    left:10%;
width:80%;height:80%;box-shadow: 2px 5px 10px 1px #000;}

.box_shadow_80:active{
    position:absolute;
    left:10%;
width:80%;height:80%;box-shadow: 0 0 0 0 #000;}



.c_80_shadow:active{
box-shadow: 0 0 0 0 #000;}




/*--------------*/
.c_80_shadow{display: flex;
    align-items: center;
    margin-left:12.5%;
    width:75%;height:80%;box-shadow: 2px 5px 10px 1px #000;}
    .c_80_shadow:active{
 box-shadow: 0 0 0 0 #000;}

 .c_35_shadow{display: flex;
    align-items: center;
    margin-left:12.5%;
    width:75%;height:35%;box-shadow: 2px 5px 10px 1px #000;}
    .c_35_shadow:active{
 box-shadow: 0 0 0 0 #000;}

 .c_90_shadow{display: flex;
    align-items: center;
    margin-left:12.5%;
    width:85%;height:56.6%;box-shadow: 2px 5px 10px 1px #000;}
    .c_90_shadow:active{
 box-shadow: 0 0 0 0 #000}

.kadomaru{border-radius:20px 20px;}
.Tp_shadow{box-shadow: 2px 5px 10px 1px #000;}
.Tp_shadow:active{box-shadow: 0 0 0 0 #000;}


.RHT{direction: rtl;}
.scroll::-webkit-scrollbar{

    z-index: 25;
    position: relative;
    width: 20px;
    }
   .scroll::-webkit-scrollbar-track{
    z-index: 25;
    position: relative;
    background-color: #e4e4e4;
    border-radius: 100px;
    }

    .scroll::-webkit-scrollbar-thumb{
    z-index: 25;
    position: relative;
    border-radius: 100px;
    background-image: linear-gradient(180deg, #ebc0e8 0%, #a7ccf0 99%);
    box-shadow: inset 2px 2px 5px 0 rgba(#fff, 0.5);}

.TpA,.TpB,.TpC,.TpD,.TpE,.TpF,.TpG,.TpH,.TpI,
.TpJ,.TpK,.TpL,.TpM,.TpN,.TpO,.TpP,.TpQ,.TpR
     {
        position: relative;
        display: flex;
        z-index: 25;
        margin: 0.5%;
        width: 99%;
        height: 99%;}

        .NOS{  box-shadow: 0 0 0 0 #444;
                }

.trans{background-color: rgba(255,255 ,255,.5);
 }

.cover_all{
    position: relative;
    z-index: 20;
    width:100%;height: 100%;
    overflow:hidden ; 
    display: flex;
    justify-items: center;
    align-items: center;}
/*----------検証--------------------------------------------*/
    .cover_YouTube{
        position: relative;
        z-index: 20;
        width:100%;height: 100%;
        overflow:hidden ; 
        display: flex;
        flex-direction: column;
        justify-items: center;
    }
    .youtube {
        width: 100%;
        padding-top: 56.25%;
        position: relative;
      }
      
      .youtube iframe  {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }
    
/*------------------------------------------------------*/
/*----TpA-------------------------------------------*/



/*.cover_all{background-color: #fff;}
.A1,.B1,.C1,.D1,.E1,.F1,.G1,.H1,.I1,.L1,.K1,.L1,.M1,.N1,.O1,.P1,.Q1,.R1,.S1,.C1_shadow,.A1_shadow{background-color: #4928dd;}
.A1,.B2,.C2,.D2,.E2,.F2,.G2,.H2,.I2,.L2,.K2,.L2,.M2,.N2,.O2,.P2,.Q2,.R2,.S2,.C2_shadow,.A2_shadow{background-color: #4b3e81;}
.A2,.B3,.C3,.D3,.E3,.F3,.G3,.H3,.I3,.L3,.K3,.L3,.M3,.N3,.O3,.P3,.Q3,.R3,.S3,.C3_shadow,.A3_shadow{background-color: #7f7f87;}
.A3,.B4,.C4,.D4,.E4,.F4,.G4,.H4,.I4,.L4,.K4,.L4,.M4,.N4,.O4,.P4,.Q4,.R4,.S4,.C4_shadow,.A4_shadow{background-color: #dd7928;}
.A4,.B5,.C5,.D5,.E5,.F5,.G5,.H5,.I5,.L5,.K5,.L5,.M5,.N5,.O5,.P5,.Q5,.R5,.S5,.C5_shadow,.A5_shadow{background-color: #6e4f34;}
.A5,.B6,.C6,.D6,.E6,.F6,.G6,.H6,.I6,.L6,.K6,.L6,.M6,.N6,.O6,.P6,.Q6,.R6,.S6,.C6_shadow,.A6_shadow{background-color: #7d7d78;}
.A6,.B7,.C7,.D7,.E7,.F7,.G7,.H7,.I7,.L7,.K7,.L7,.M7,.N7,.O7,.P7,.Q7,.R7,.S7,.C7_shadow,.A7_shadow{background-color: #28dd92;}
.A7,.B8,.C8,.D8,.E8,.F8,.G8,.H8,.I8,.L8,.K8,.L8,.M8,.N8,.O8,.P8,.Q8,.R8,.S8,.C8_shadow,.A8_shadow{background-color: #42866a;}
.A8,.B9,.C9,.D9,.E9,.F9,.G9,.H9,.I9,.L9,.K9,.L9,.M9,.N9,.O9,.P9,.Q9,.R9,.S9,.C9_shadow,.A9_shadow{background-color: #84918c;}
.A9,.B10,.C10,.D10,.E10,.F10,.G10,.H10,.I10,.L10,.K10,.L10,
.M10,.N10,.O10,.P10,.Q10,.R10,.S10,.P4_scl{background-color: #ddbc28;}
.A11,.B11,.C11.D11,.E11,.F11,.G11,.H11,.I11,.L11,.K11,.L11,
.M11,.N11,.O11,.P11,.Q11,.R11,.S11 ,.P1_center{background-color: #4b3e81;}*/


.active{ box-shadow: 2px 5px 10px 1px #444;}
.active:active{ box-shadow: 1px 1px 1px 1px #444;}

.A1_shadow{
position: absolute;
z-index: 23;
left:2.5%;top:10%;
width:30%;height: 19.9%;
overflow-x:hidden ; 
display: flex;
justify-items: center;
align-items: center; 
box-shadow: 2px 5px 10px 1px #444; 
}
.A2_shadow{position: absolute;
    z-index: 23;
    left:35%;top:10%;
    width:30%;height: 19.9%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center; 
     box-shadow: 2px 5px 10px 1px #444;
   }
.A3_shadow{
    position: absolute;
    z-index: 23;
    left:67.5%;top:10%;
    width:30%;height: 19.9%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center;  
    box-shadow: 2px 5px 10px 1px #444;
}
.A4_shadow{
    position: absolute;
    z-index: 23;
    left:2.5%;top:39.9%;
    width:30%;height: 19.9%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 
     box-shadow: 2px 5px 10px 1px #444;
}
.A5_shadow{position: absolute;
    z-index: 23;
    left:35%;top:39.9%;
    width:30%;height: 19.9%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 
     box-shadow: 2px 5px 10px 1px #444;
}
.A6_shadow{position: absolute;
    z-index: 23;
    left:67.5%;top:39.9%;
    width:30%;height: 19.9%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center;
     box-shadow: 2px 5px 10px 1px #444; 
}
.A7_shadow{
    position: absolute;
    z-index: 23;
    left:2.5%;top:69.8%;
    width:30%;height: 19.9%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center;  
    box-shadow: 2px 5px 10px 1px #444;
}
.A8_shadow{position: absolute;
    z-index: 23;
    left:35%;top:69.8%;
    width:30%;height: 19.9%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center;
    box-shadow: 2px 5px 10px 1px #444;
}
.A9_shadow{position: absolute;
    z-index: 23;
    left:67.5%;top:69.8%;
    width:30%;height: 19.9%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center; 
     box-shadow: 2px 5px 10px 1px #444;
}

.A1_shadow:active,.A2_shadow:active,.A3_shadow:active,
.A4_shadow:active,.A5_shadow:active,.A6_shadow:active,
.A7_shadow:active,.A8_shadow:active,.A9_shadow:active{
     box-shadow: 2px 5px 10px 1px #444;
}









/*---------------------------------------*/



.a1{
width: 3rem; height: 3rem;
background-size:cover;
float: left;
margin: 0.5rem;
/*background-color: #c0e1eb;*/
box-shadow: 2px 3px 5px 1px #444;
border-radius: 50%;
border: 0; /* 枠線を削除 */
}
.a1:active{
    box-shadow: 0 0 0 0 #444;
     }



.A1{
    position: absolute;
    z-index: 23;
    left:0;top:0;
    width:33%;height: 33%;
    overflow-x:hidden ; 
    display: flex;
    justify-items: center;
    align-items: center; 
    }
    .A2{position: absolute;
        z-index: 23;
        left:33%;top:0;
        width:33%;height: 33%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
       }
    .A3{
        position: absolute;
        z-index: 23;
        left:66%;top:0;
        width:33%;height: 33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
    .A4{
        position: absolute;
        z-index: 23;
        left:0;top:33%;
        width:33%;height: 33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
    .A5{position: absolute;
        z-index: 23;
        left:33%;top:33%;
        width:33%;height: 33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
    .A6{position: absolute;
        z-index: 23;
        left:66%;top:33%;
        width:33%;height: 33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
    .A7{
        position: absolute;
        z-index: 23;
        left:0;top:67%;
        width:33%;height: 33%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
    }

    .A7_maru{
        position: absolute;
        z-index: 23;
        left:5%;top:70%;
        width:28%;height: 28%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
        border-radius: 50%;
    }








    .A8{position: absolute;
        z-index: 23;
        left:33%;top:67%;
        width:33%;height: 33%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center;
    }
    .A9{position: absolute;
        z-index: 23;
        left:66%;top:67%;
        width:33%;height: 33%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
    }
/*------------------------------------*/








.A10{
    position: absolute;
    z-index: 23;
    left:0;top:50%;
    width:33%;height: 33%;
    overflow-x:hidden ; 
    display: flex;
    justify-items: center;
    align-items: center; 
    
    }

    .A11{
        position: absolute;
        z-index: 23;
        left:33%;top:0;
        width:60%;height: 45%;
        overflow-x:hidden ; 
        overflow-y:auto;
        display: flex;
        flex-direction: column;
        justify-items: center;
   
        
        }
    
        .A12{
            position: absolute;
            z-index: 23;
            left:33%;top:50%;
            width:60%;height: 45%;
            overflow-x:hidden ; 
            display: flex;
            flex-direction: column;
            justify-items: center;
         
            
            }
        
.A1_a{
position: absolute;
z-index: 23;
left:0;top:17%;
width:33%;height: 33%;
overflow-x:hidden ; 
display: flex;
justify-items: center;
align-items: center; 
                
}
                





.A2_a{position: absolute;
    z-index: 23;
    left:33%;top:0;
    width:67%;height: 33%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center; 
   }
.A5_a{position: absolute;
    z-index: 23;
    left:33%;top:33%;
    width:67%;height: 34%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 
}
.A8_a{position: absolute;
    z-index: 23;
    left:33%;top:67%;
    width:67%;height: 33%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center;
}

.XX{position: absolute;
     z-index: 23;
    left:5%;top:68%;
    width:30%;height: 30%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center;
/*background-color: #ebc0e8;*/ }
/*--TpB-----------------------------------------------------------------------------*/
    .B1{position: absolute;
        z-index: 23;
        left:0;top:0;
        width:50%;height:50%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center;
   }
    
    .B2{position: absolute;
        z-index: 23;
        left:50%;top:0;
        width:50%;height:50%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
}
    .B3{position: absolute;
        z-index: 23;
        left:0;top:50%;
        width:50%;height:50%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
}
    .B4{position: absolute;
        z-index: 23;
        left:50%;top:50%;
        width:50%;height: 50%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
 }

/*--TpC-----------------------------------------------------------------------------*/
.C1{
position: absolute;
z-index: 23;
left:0;top:0;
width:50%;height: 33%;
overflow:hidden ;
display: flex;
justify-items: center;
align-items: center; }
.C2{position: absolute;
z-index: 23;
 left:50%;top:0;
 width:50%;height: 33%;
overflow:hidden ; 
display: flex;
justify-items: center;
align-items: center; 
 }
.C3{position: absolute;
z-index: 23;
left:0;top:33%;
width:50%;height: 34%;
overflow:hidden ; 
display: flex;
justify-items: center;
align-items: center; 
}
.C4{position: absolute;
z-index: 23;
left:50%;top:33%;
width:50%;height: 34%;
overflow:hidden ;
display: flex;
justify-items: center;
align-items: center; 
}
.C5{position: absolute;
z-index: 23;
left:0;top:67%;
width:50%;height: 33%;
overflow:hidden ; 
display: flex;
justify-items: center;
align-items: center;
}
.C6{position: absolute;
z-index: 23;
left:50%;top:67%;
 width:50%;height: 33%;
overflow:hidden ;
                  display: flex;
justify-items: center;
align-items: center; 
}

/*--shadow--------------------------------------------*/

.C1_shadow:active,.C2_shadow:active,.C3_shadow:active,
.C4_shadow:active,.C5_shadow:active,.C6_shadow:active
{box-shadow: 1px 1px 1px 1px #444;}






.C1_shadow{
position: absolute;
z-index: 23;
left:3.33%;top:2.5%;
width:45%;height: 30%;
overflow:hidden ;
display: flex;
justify-items: center;
align-items: center; 
box-shadow: 2px 5px 10px 1px #444;}

.C2_shadow{position: absolute;
z-index: 23;
left:51.66%;top:2.5%;
width:45%;height: 30%;
overflow:hidden ; 
display: flex;
justify-items: center;
align-items: center;  
 box-shadow: 2px 5px 10px 1px #444;
}
.C3_shadow{position: absolute;
z-index: 23;
left:3.33%;top:35%;
width:45%;height: 30%;
overflow:hidden ; 
display: flex;
justify-items: center;
align-items: center; 
  box-shadow: 2px 5px 10px 1px #444;
}
.C4_shadow{position: absolute;
z-index: 23;
left:51.66%;top:35%;
width:45%;height: 30%;
overflow:hidden ;
display: flex;
justify-items: center;
align-items: center;
  box-shadow: 2px 5px 10px 1px #444; 
}

.C5_shadow{position: absolute;
z-index: 23;
left:3.33%;top:67.5%;
width:45%;height: 30%;
overflow:hidden ; 
display: flex;
justify-items: center;
align-items: center; 
 box-shadow: 2px 5px 10px 1px #444;
}

.C6_shadow{position: absolute;
z-index: 23;
left:51.66%;top:67.5%;
width:45%;height: 30%;
overflow:hidden ;
display: flex;
justify-items: center;
align-items: center; 
  box-shadow: 2px 5px 10px 1px #444;
}

.C6_shadow_2{/*--468x60--*/
    position: absolute;
    z-index: 23;
    left:5%;top:75%;
    width:89%;height: 12%;
    overflow:hidden ;
    display: flex;
    justify-items: center;
    align-items: center; 
      box-shadow: 2px 5px 10px 1px #444;
    }

    .C6_shadow_2:active{/*--468x60--*/
            box-shadow: 1px 1px 1px 1px #444;
        }
    





/*--TpC-----------------------------------------------------------------------------*/
.E1{
    position: absolute;
    z-index: 23;
    left:0;top:0;
    width:66%;height: 66%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center; 

    }
    .E2{position: absolute;
        z-index: 23;
        left:66%;top:0;
        width:50%;height: 66%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
 }
    .E3{position: absolute;
        z-index: 23;
        left:0;top:66%;
        width:66%;height: 34%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
}
    
    .E4{position: absolute;
        z-index: 23;
        left:66%;top:66%;
        width:34%;height: 34%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
   }
/*-----E---------------------------------------------*/

.E5{
    position: absolute;
    z-index: 23;
    left:0;top:0;
    width:50%;height: 66%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center; 

    }
    .E6{position: absolute;
        z-index: 23;
        left:50%;top:0;
        width:50%;height: 66%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
 }
    .E7{position: absolute;
        z-index: 23;
        left:0;top:66%;
        width:100%;height: 34%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
}
.E7_column{position: absolute;
    z-index: 23;
    left:0;top:66%;
    width:100%;height: 34%;
    overflow:hidden ; 
    display: flex;
    flex-direction: column;
 
 
}
.E8{position: absolute;
    z-index: 23;
    left:0;top:67%;
    width:100%;height: 28%;
    overflow:hidden ; 
    display: flex;
    justify-items: center;
    align-items: center; 
background-color: rgba(255,255,255,.5);}








/*-----H---------------------------------------------*/

.H1{
    position: absolute;
    z-index: 23;
    left:0;top:0;
    width:50%;height: 33%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center; 

    }
    .H2{position: absolute;
        z-index: 23;
        left:50%;top:0;
        width:50%;height: 33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
 }
    .H3{position: absolute;
        z-index: 23;
        left:0;top:33%;
        width:50%;height: 66%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
}
    
    .H4{position: absolute;
        z-index: 23;
        left:50%;top:33%;
        width:50%;height: 66%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
   }














    
/*--TpI-----------------------------------------------------------------------------*/
.I1{
    position: absolute;
    z-index: 23;
    left:0;top:0;
    width:33%;height: 66%;
    overflow:hidden ;
              display: flex;
    justify-items: center;
    align-items: center; 
    }
    .I2{position: absolute;
        z-index: 23;
        left:33%;top:0;
        width:66%;height: 66%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
}
    .I3{position: absolute;
        z-index: 23;
        left:0;top:66%;
        width: 33%;height: 33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center;
}
    
    .I4{position: absolute;
        z-index: 23;
        left:33%;top:66%;
        width:66%;height: 33%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center;
    }

 /*--TpK-----------------------------------------------------------------------------*/ 

 .K1{
    position: absolute;
    z-index: 23;
    left:0;top:0;
    width:100%;height: 50%;
    overflow:hidden ;
    display: flex;
    justify-items: center;
    align-items: center; 
        }
.K1_scl{
position: absolute;
z-index: 23;
left:0;top:0;
width:95%;height: 45%;
overflow-x:hidden ;
overflow-y:auto ;
display: flex;
justify-items: center;
align-items: center; 
}







    .K2{position: absolute;
        z-index: 23;
        left:0;top:50%;
        width:95%;height: 45%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
 }




 /*--TpL2-----------------------------------------------------------------------------*/ 

 .L4{
    position: absolute;
    z-index: 23;
    left:0;top:0;
    width:100%;height: 66%;
    overflow:hidden ;
    display: flex;
    justify-items: center;
    align-items: center; 

    }
    .L3{position: absolute;
        z-index: 23;
        left:0;top:66%;
        width:100%;height: 34%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
 }

     /*--Tp0-----------------------------------------------------------------------------*/ 
     .O1{position: absolute; z-index: 23;
        left:15%;top:15%;
        width:70%;height:70%;
        overflow:hidden ;
        display: flex;
        justify-items: center;
        align-items: center; /*background-color: #ebc0e8;*/
     
}

.O1_2{position: absolute; z-index: 23;
    left:15%;top:15%;
    width:70%;height:50%;
    overflow:hidden ;
    display: flex;
    justify-items: center;
    align-items: center; /*background-color: #ebc0e8;*/
 
}

.O2{position: absolute; z-index: 23;
    left:5%;top:5%;
    width:90%;height:70%;
    overflow:hidden ;
    display: flex;
    justify-items: center;
    align-items: center; /*background-color: #ebc0e8;*/
 
}





     /*--TpP-----------------------------------------------------------------------------*/ 
        .P1{
            position: absolute; z-index: 23;
            left:0;top:5%;
            width:50%;height:33%;
            overflow:hidden ;
            display: flex;
            justify-items: center;
            align-items: center; /*background-color: #ebc0e8;*/
    }




        
    .P1_sd{
        position: absolute; z-index: 23;
        left:5%;top:5%;
        width:40%;height:40%;
        overflow:hidden ;
        display: flex; 
        box-shadow: 2px 5px 10px 1px #000;
        justify-items: center;
        align-items: center; /*background-color: #ebc0e8;*/
}


        .P1_center{
            position: absolute; z-index: 23;
            left:5%;top:20%;
            width:40%;height:40%;
            overflow:hidden ;
            display: flex;
            justify-items: center;
            align-items: center; /*background-color: #ebc0e8;*/
    }
        .P2{position: absolute; z-index: 23;
            left:0%;top:33%;
            width:50%;height:34%;
            overflow:hidden ;
            display: flex;
            justify-items: center;
            align-items: center; 
}
.P2_yoko{position: absolute; z-index: 30;
        left:0%;top:48%;
        width:10%;height:10%;
        overflow:hidden ;
        display: flex;
        justify-items: center;
        align-items: center; 
}
.P3{position: absolute; z-index: 23;
            left:0;top:67%;
            width:50%;height:26%;
            overflow:hidden ; 
                     display: flex;
            justify-items: center;
            align-items: center;
}
.P3_shadow{
    position: absolute; z-index: 23;
    left:6.6%;top:67%;
    width:40%;height:26.6%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 
      box-shadow: 2px 5px 10px 1px #444;
}
.P3_shadow:active{
      box-shadow: 1px 1px 1px 1px #444;}
.P5_shadow{position: absolute;
    z-index: 23;
    left:53.3%;top:67%;
    width:40%;height:26.6%;
    overflow:hidden ;
    display: flex;
    justify-items: center;
    align-items: center;  
    box-shadow: 2px 5px 10px 1px #444;
    /*background-color: #ebc0e8;*/
    }
 .P5_shadow:active{
        box-shadow: 1px 1px 1px 1px #444;}


.P3_scl{
        position: absolute; z-index: 23;
        left:0;top:67%;
        width:50%;height:30%;
        overflow-x:hidden ; 
        overflow-y:auto ; 
        display: flex;
        justify-items:start;
     
}
.P3_1{position: absolute; z-index: 23;
    left:0%;top:67%;
    width:16.6%;height:16.6%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center;
}
.P3_2{position: absolute; z-index: 23;
    left:16.8%;top:67%;
    width:16.6%;height:16.6%;
    overflow:hidden ; 
     display: flex;
    justify-items: center;
    align-items: center;
}
.P3_3{position: absolute; z-index: 23;
    left:33.6%;top:67%;
    width:16.6%;height:16.6%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center;
}
.P3_4{position: absolute; z-index: 23;
    left:0;top:83.6%;
    width:50%;height:23%;
    overflow:hidden ; 
    display: flex;
     justify-items: center;
    align-items: center;
}
.P4{position: absolute; z-index: 23;
left:50%;top:0%;
width:50%;height:41.6%;
overflow:hidden ; 
display: flex;
justify-items: center;
align-items: center; 
}
.P4_sd{position: absolute; z-index: 23;
    left:55%;top:5%;
    width:40%;height:33.2%;
    box-shadow: 2px 5px 10px 1px #000;
    overflow:hidden ; 
    display: flex;
    justify-items: center;
    align-items: center; 
    }
.P4_scl{position: absolute; z-index: 23;
left:50%;top:5%;
width:46%;height:55%;
display: flex;
justify-items: center;
align-items: center; 
}
.P5{position: absolute;
z-index: 23;
left:50%;top:67%;
width:50%;height:26%;
overflow:hidden ;
display: flex;
justify-items: center;
align-items: center; 
/*background-color: #ebc0e8;*/
}




.P6{position: absolute; z-index: 23;
    left:50%;top:0%;
    width:50%;height:100%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center;
}
.P6_scl{position: absolute; z-index: 23;
    left:50%;top:0%;
    width:46%;height:90%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center;
}







.P7{position: absolute; 
    z-index: 23;
    left:0;top:0;
    width:47%;height:66%;
    overflow:hidden ;
    display: flex;
    justify-items: center;
    align-items: center; 
}
.P7_scl{
position: absolute; 
z-index: 23;
left:0%;top:0%;
width:47%;height:66%;
overflow-x:hidden ; 
overflow-y:auto ; 
display: flex;
justify-items:start;
}







.P8{position: absolute; 
    z-index: 23;
    left:17%;top:68%;
    width:30%;height:30%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 
}
.P9{position: absolute; 
    z-index: 23;
    left:0;top:0;
    width:100%;height:66.6%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 
    /*background-color:blue*/;
}
.P9_under{position: absolute; 
    z-index: 23;
    left:0;top:66.7%;
    width:100%;height:33.4%;
    overflow:hidden ; 
    display: flex;
    justify-items: center;
    flex-direction: column 
    /*background-color:blue*/;
}




.P10{position: absolute; 
    z-index: 23;
    left:18%;top:12.2%;
    width:64%;height:42.6%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 

}

.P10_shadow{position: absolute; 
    z-index: 23;
    left:25%;top:16.85%;
    width:50%;height:33.3%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 
    box-shadow: 2px 5px 10px 1px #444;

}

.P10_shadow:active{
    box-shadow: 1px 1px 1px 1px #444;}













.P10_tp_shadow{position: absolute; 
    z-index: 23;
    left:22%;top:10%;
    width:64%;height:49%;
    overflow:hidden ; 
             display: flex;
    justify-items: center;
    align-items: center; 
    box-shadow: 2px 5px 10px 1px #000
}
.P10_tp_shadow:active{
    box-shadow: 0px 0px 0px 0px #000
}






  /*--TpP-----------------------------------------------------------------------------*/           


.Q1{
    position: absolute;
    z-index: 23;
    left:8%;top:0;
    width:33%;height:33%;
    overflow:hidden ; 
    display: flex;
    justify-items: center;
    align-items: center; 
    
    }
    .Q2{position: absolute;
        z-index: 23;
        left:8%;top:33%;
        width:33%;height:33%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center;
       }
    .Q3{position: absolute;
        z-index: 23;
        left:8%;top:66%;
        width:33%;height:33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
    
   
    .Q4{position: absolute;
        z-index: 23;
        left:58%;top:0;
        width:33%;height:33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
    .Q5{position: absolute;
        z-index: 23;
        left:58%;top:33%;
        width:33%;height:33% ;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center;
    }
    .Q6{position: absolute;
        z-index: 23;
        left:58%;top:66%;
        width:33%;height:33%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center;
    }
    
    /*--RpP-----------------------------------------------------------------------------*/           

.R1{
    position: absolute;
    z-index: 23;
    left:25%;top:5%;
    width: 25%;height: 30%;
    overflow:hidden ; 
    display: flex;
    justify-items: center;
    align-items: center;
    font-size: 0.8rem;
    line-height: 1rem;

    }
    .R2{position: absolute;
        z-index: 23;
        left:25%;top:37.5%;
        width:25%;height:25%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
       }
    .R3{position: absolute;
        z-index: 23;
        left:25%;top:65%;
        width:25%;height:30%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
     .R4{position: absolute;
        z-index: 23;
        left:25%;top:75%;
        width:25%;height:25%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
    .R5{position: absolute;
        z-index: 23;
        left:50%;top:5%;
        width:25%;height:30% ;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center;
    }
    .R6{position: absolute;
        z-index: 23;
        left:50%;top:37.5%;
        width:25%;height:25%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    } 
    .R7{position: absolute;
        z-index: 23;
        left:50%;top:65%;
        width:25%;height:30% ;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center; 
    }
    /*------------------------------------------*/
    .R8{position: absolute;
        z-index: 23;
        left:37%;top:75%;
        width:25%;height:25%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items: center;
    } 
    .R9{position: absolute;
        z-index: 23;
        left:37.5%;top:35%;
        width:25%;height:30%;
        overflow:hidden ;
                  display: flex;
        justify-items: center;
        align-items: center; 
       
    }
/*----------------------------------------------------------*/




    .R10{position: absolute;
        z-index: 23;
        left:25%;top:0;
        width:50%;height:100%;
        overflow:hidden ; 
                 display: flex;
        justify-items: center;
        align-items:center; }
 
        .R11{position: absolute;
            z-index: 23;
            left:25%;top:12.5%;
            width:50%;height:75%;
            overflow:hidden ; 
                     display: flex;
            justify-items: center;
            align-items:center; }    
    
    
    
    
    
    
        .S1{position: absolute;
        z-index: 23;
        left:14%;top:14%;
        width:71%;height:50%;
        overflow:hidden ; 
        display: flex;
        justify-items: center;
        align-items:center; }

        .S4{position: absolute;
            z-index: 23;
            left:0;top:70%;
            width:50%;height:30%;
            overflow:hidden ; 
            display: flex;
            justify-items: center;
            align-items:center; }
/*--------1:0.666-------------------------------------------------*/
    .S7{position: absolute;
            z-index: 23;
            left:50%;top:70%;
            width:50%;height:30%;
            overflow:hidden ; 
            display: flex;
            justify-items: center;
            align-items:center; }
  .S7_shadow{position: absolute;
            z-index: 23;
            left:55.5%;top:72%;
            width:39%;height:26%;
            overflow:hidden ; 
            display: flex;
            justify-items: center;
            align-items:center; 
            box-shadow: 2px 5px 10px 1px #444;}
    .S7_shadow:active{
                box-shadow: 1px 1px 1px 1px #444;}



/*--------------------------------------------------------------*/


         .S5{position: absolute;
            z-index: 23;
            left:30%;top:8.4%;
            width:40%;height:33.2%;
            display: flex;
            justify-items: center;
            align-items:center; }
         .S2{position: absolute;
            z-index: 22;
            left:27.5%;top:8.4%;
            width:45%;height:37.35%;
                  display: flex;
            justify-items: center;
            align-items:center; }
            .S6{position: absolute;
                z-index: 23;
                left:30%;top:54.1%;
                width:40%;height:33.25%;
                 display: flex;
                justify-items: center;
                align-items:center; }
            .S3{position: absolute;
                z-index: 22;
                left:27.5%;top:54.1%;
                width:45%;height:37.35%;
                display: flex;
                justify-items: center;
                align-items:center; }

/*--new25-------------------------------------------------*/
                .NA1{position: absolute;
                    z-index: 23;
                    left:6.25%;top:6.25%;
                    width:25%;height:25%;
                     display: flex;
                    justify-items: center;
                    align-items:center;}

                    .NA1W{position: absolute;
                        z-index: 23;
                        left:6.25%;top:6.25%;
                        width:56.25%;height:56.25%;
                         display: flex;
                        justify-items: center;
                        align-items:center;}
                    .NA2{position: absolute;
                    z-index: 23;
                     left:37.5%;top:6.25%;
                     width:25%;height:25%;
                     display: flex;
                    justify-items: center;
                    align-items:center; 
                   }
                   .NA2W {position: absolute;
                    z-index: 23;
                     left:37.5%;top:6.25%;
                     width:56.25%;height:56.25%;
                     display: flex;
                    justify-items: center;
                    align-items:center; 
                   }

                    .NA3{position: absolute;
                    z-index: 23;
                    left:68.75%;top:6.25%;
                    width:25%;height:25%;
                    display: flex;
                    justify-items: center;
                    align-items:center;
                 
                 }

                    .NA4{position: absolute;
                    z-index: 23;
                    left:6.25%;top:37.55%;
                    width:25%;height:25%;
                     display: flex;
                    justify-items: center;
                    align-items:center; 
                }
                
                    .NA5{position: absolute;
                    z-index: 23;
                     left:37.5%;top:37.5%;
                     width:25%;height:25%;
                     display: flex;
                    justify-items: center;
                    align-items:center;  
                 }
                
                    .NA6{position: absolute;
                    z-index: 23;
                    left:68.75%;top:37.5%;
                    width:25%;height:25%;
                    display: flex;
                    justify-items: center;
                    align-items:center;
                 }
                
                    .NA7{position: absolute;
                        z-index: 23;
                        left:6.25%;top:68.75%;
                        width:25%;height:25%;
                         display: flex;
                        justify-items: center;
                        align-items:center;
                   }
                       
                        .NA8{position: absolute;
                        z-index: 23;
                         left:37.5%;top:68.75%;
                         width:25%;height:25%;
                         display: flex;
                        justify-items: center;
                        align-items:center;
                     }
                    
                        .NA9{position: absolute;
                        z-index: 23;
                        left:68.75%;top:68.75%;
                        width:25%;height:25%;
                        display: flex;
                        justify-items: center;
                        align-items:center;}

/*-------------------------------------*/
.NB1{position: absolute;
    z-index: 23;
    left:5.58%;top:5.88%;
    width:41.16%;height:41.16%;
     display: flex;
    justify-items: center;
    align-items:center;}
    .NB2{position: absolute;
    z-index: 23;
    left:52.92%;top:5.88%;
    width:41.16%;height:41.16%;
    display: flex;
    justify-items: center;
    align-items:center;}
   .NB3{position: absolute;
    z-index: 23;
    left:6.25%;top:53.26%;
    width:41.16%;height:41.16%;
    display: flex;
    justify-items: center;
    align-items:center;}
    .NB4{position: absolute;
    z-index: 23;
    left:52.92%;top:53.26%;
    width:41.16%;height:41.16%;
    display: flex;
    justify-items: center;
    align-items:center;}
   .NC1{position: absolute;
        z-index: 23;
        left:31.25%;top:5.88%;
        width:64.68%;height:41.16%;
         display: flex;
        justify-items:center;
        align-items:center;}
        .NC1_350_240{position: absolute;
            z-index: 23;
            left:31.25%;top:5.88%;
            width:64.68%;height:44.35%;
             display: flex;
            justify-items:center;
            align-items:center;
        background-color: #ebc0e8;}
        .NC2{position: absolute;
        z-index: 23;
        left:5.88%;top:23.52%;
        width:23.52%;height:23.52%;
        display: flex;
        justify-items: center;
        align-items:center;}
    
        .NC3{position: absolute;
            z-index: 23;
            left:31.25%;top:53.88%;
            width:64.68%;height:41.16%;
             display: flex;
            justify-items:flex-end;
            align-items:center;}
        
            
            .NC4{position: absolute;
                z-index: 23;
                left:5.88%;top:71.58%;
                width:23.52%;height:23.52%;
                display: flex;
                align-items:center;
         }


         .NC7{position: absolute;
            z-index: 23;
            left:5.88%;top:37.5%;
            width:23.52%;height:23.52%;
            display: flex;
            justify-items: center;
            align-items:center;}

            .NC8{position: absolute;
                z-index: 23;
                left:31.25%;top:31.25%;
                width:64.68%;height:41.16%;
                 display: flex;
                justify-items:flex-end;
                align-items:center;}


         .ND1{position: absolute;
            z-index: 23;
            left:20%;top:20%;
            width:60%;height:60%;
            display: flex;
            align-items:center;
     }

     .NE1{position: absolute;
        z-index: 23;
        left:0;top:0;
        width:100%;height:70%;
        display: flex;
        align-items:center;
 }

 .NE2{position: absolute;
    z-index: 23;
    left:0;top:75%;
    width:100%;height:20%;
    display: flex;
    align-items:center;
}
.NE3{position: absolute;
    z-index: 23;
    left:5%;top:75%;
    width:20%;height:20%;
    display: flex;
    align-items:center;
}               
.NE4{position: absolute;
    z-index: 23;
    left:30%;top:75%;
    width:70%;height:20%;
    display: flex;
    align-items:center;
}      













     /*-20250129-NEW--start----------------------------------------------------*/






.text-shadow{text-shadow:2px 2px 2px#444; }
.text-shadow:active{text-shadow:0 0 0#444;}

.box-shadow{ box-shadow: 2px 5px 10px 1px #444;}
.box-shadow:active{ box-shadow:0 0 0 0 #444;}

.p_top {position: absolute; top:-20%;left:0;}  
.pm_top { position: absolute; top: -12%;left:0;}  
.pw_top {position: absolute; top: -9%;left:0;}  










/*-20250129-NEW--end-------------------------------------------------------*/





/*---この位置keep----------------------------------------------------*/
    .scroll{display: flex;
        flex-direction: column;
        text-align: left;
        justify-items:start;
        align-items:start; 
        overflow-y: auto;
        padding: 10px; 
        font-size: 0.7rem;
        line-height: 1rem;
       }
    


  

    @media screen and (max-width: 599px){
        .shadow,.shadow_2{
            width:90vw;
            height: 90vw;
          }
                      .content_shadow{
                width: 90vw;
                height: 90vw;
           }









    }
    