/*RoomShow*/
.ProDisplayStand{display: flex; min-width: 300px; margin-bottom: 50px; margin-top: 40px; min-height: 44.2vw;}

/* .ProDisplayStand_Img{width: 66%; margin: 0 0 0 4%; width: 53%;} */
.ProDisplayStand_Img{width: 53%; max-width: 1120px; margin-left: auto;}

.ProDisplayStand_ImgFull{display: flex; width: 100%; height:100%; color: #808080;}
.ProDisplayStand_ImgBtn{display: flex; width: 5%; position: relative;}
.ProDisplayStand_ImgBtn > span{cursor: pointer; margin: auto; font-size: 50px; font-size: 2.6vw; user-select: none;
    position: absolute; top: 50%; transform: translate( 0px, -50%) scale(1); z-index: 2;}
.ProDisplayStand_ImgRoom{ width: 90%; height: 100%;}
.ProDisplayStand_ImgRoomShow{position: relative; display: flex; overflow: hidden; width: 100%; height:75%; margin: auto;}
.xProDisplayStand_ImgRoomShow > img{position: absolute; display: none; height: 90%; margin: auto; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(1);}
.ProDisplayStand_ImgRoomShow > img{position: absolute; display: none; margin: auto; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(1); height: 31.45vw; }
.xProDisplayStand_ImgRoomShow > video{ display: none; margin: auto; max-width: 90%;}
.ProDisplayStand_ImgRoomShow > video{ display: none; margin: auto; width: 53.46vw;}
.xProDisplayStand_ImgRoomShow > iframe{ display: none; margin: auto; max-width: 90%; width: 63vw; height: 35vw; width: 57.6vw; height: 31.5vw;}
.ProDisplayStand_ImgRoomShow > iframe{ display: none; margin: auto; width: 53.46vw; height: 31.45vw; }
.ProDisplayStand_ImgRoomShow > img.Show,.ProDisplayStand_ImgRoomShow > video.Show,.ProDisplayStand_ImgRoomShow > iframe.Show{display: block;}

.ProDisplayStand_ImgRoomList{position: relative; overflow: hidden; width: 100%; height:25%;}
/* .ProDisplayStand_ImgRoomListMove{position: absolute; display: flex; height: 100%; padding: 0 0 0 1vw; transition: all 0.1s;} */
.ProDisplayStand_ImgRoomListMove{position: absolute; display: flex; height: 100%; padding: 0 0 0 0; transition: all 0.1s;}

.ProDisplayStand_ImgRoomListMove.M2{transform: translate(-59vw, 0%) scale(1);}
.ProDisplayStand_ImgRoomListMove.M3{transform: translate(-118vw, 0%) scale(1);}
.ProDisplayStand_ImgRoomListMove.M4{transform: translate(-177vw, 0%) scale(1);}
.xProDisplayStand_ImgRoomListMove > img{ margin: auto 1vw auto 0vw; border: 1px solid #000; width: 11.4vw; width: 10.8vw;}
.xProDisplayStand_ImgRoomListMove > img.Lock{border: 1px solid #EADF8C;}

/* .ProDisplayStand_ImgRoomListMove > div{ margin: auto 1vw auto 0vw; border: 1px solid #000; width: 10.8vw; height: 10.8vw; display: flex; width: 8.05vw; height: 8.05vw;} */
.ProDisplayStand_ImgRoomListMove > div{ margin: auto 0.6vw auto 0vw; border: 1px solid #000; width: 10.8vw; height: 10.8vw; display: flex; width: 8.05vw; height: 8.05vw; max-width: 155px; max-height: 155px;}

.ProDisplayStand_ImgRoomListMove > div.Lock{border: 1px solid #EADF8C;}
.ProDisplayStand_ImgRoomListMove > div > img {width: 95%; margin: auto;}

/* .ProDisplayStand_Art{width: 27%; background-color: #1a1a1a; margin: 0 0 0 3%; width: 43%;} calc(100% - 100px);*/
.ProDisplayStand_Art{width: calc(43% - 47px); background-color: #1a1a1a; margin-left: 47px;}

/* .ProDisplayStand_ArtFull{ color: white; margin: 20px; word-wrap: break-word; margin: 2.5vw 2.5vw 2.5vw 5vw;} */
.ProDisplayStand_ArtFull{ color: white; margin: 20px; word-wrap: break-word; margin: 2.6vw 2.5vw 2.5vw 2.9vw;}

/* .ProDisplayStand_ArtFull > h1 {font-size: 36px; } */
.ProDisplayStand_ArtFull > h1 {font-size: 60px; margin: 0;}
/* .ProDisplayStand_ArtFull > p {margin: 1.5vw 0 2vw 0; font-size: 24px;} */
.ProDisplayStand_ArtFull > p {margin: 0vw 0 1.1vw 0; font-size: 24px; color: #EADF8C;}

/* .xProDisplayStand_ArtSpec{font-size: 20px; font-size: 1.04vw; text-indent: -28px; margin: 0px 0px 10px 28px;} */
/* .ProDisplayStand_ArtSpec{font-size: 20px; text-indent: -28px; margin: 0px 0px 10px 28px; } */
.ProDisplayStand_ArtSpec{font-size: 1rem; text-indent: -28px; margin: 0px 0px 42px 28px; }

.xProDisplayStand_ArtSpec > div { word-wrap: break-word;}
.ProDisplayStand_ArtSpec > div { margin-bottom: 0.5vw; }
.ProDisplayStand_ArtSpec > div > svg { font-size: 18px; color: #eadf8c; height: 1em; overflow: visible; vertical-align: -0.1em; margin-right: 10px; }
@media (max-width:1600px) {
    .ProDisplayStand_ArtFull > h1 {font-size: 34px; }
    .ProDisplayStand_ArtFull > p { font-size: 22px; }
    .ProDisplayStand_ArtSpec{ font-size: 18px; }
    .ProDisplayStand_ArtSpec > div { margin-bottom: 0.3vw; }
    .ProDisplayStand_ArtSpec > div > svg { font-size: 16px; }
}
@media (max-width:1200px) {
    .ProDisplayStand{display: block; height: auto;}
    .ProDisplayStand_Img{width: auto; height: 700px; height: 58.6vw; margin: 0 4% 0px 4%;}
    .ProDisplayStand_Art{width: auto; background-color: #1a1a1a; margin: 0 4% 0 4%;}

    .ProDisplayStand_ArtFull { margin: initial; padding: 35px 4%;}
    .ProDisplayStand_ArtFull > h1 { font-size: 30px; }
    .ProDisplayStand_ArtFull > p { font-size: 26px;}
    .ProDisplayStand_ArtSpec { font-size: 20px; }
    .ProDisplayStand_ArtSpec > div > svg { font-size: 18px; }

    .ProDisplayStand_ImgBtn > span { font-size: 40px; }

    .XXProDisplayStand_ImgRoomShow > iframe { height: 40vw; width: 90%;}

    .ProDisplayStand_ImgRoomShow > img { height: 90%; }
    .ProDisplayStand_ImgRoomShow > video{ width: 70vw;}
    .ProDisplayStand_ImgRoomShow > iframe{ width: 70vw; height: 41.18vw;}
}
@media (max-width:1000px) {
    .xProDisplayStand_Img { height: 58.8vw; }
    .ProDisplayStand_ImgRoomShow{ height: 100%; }
    .ProDisplayStand_ImgRoomList { display: none;}
}
@media (max-width:900px) {
    .ProDisplayStand_ArtFull > h1 { font-size: 30px;}
    .ProDisplayStand_ArtFull > p { font-size: 24px; }
    .ProDisplayStand_ArtSpec > div { margin-bottom: 5px; }
    .ProDisplayStand_ArtSpec > div > svg { font-size: 14px; }
    .ProDisplayStand_ArtSpec { font-size: 16px;}

    .ProDisplayStand_ImgBtn > span { font-size: 30px; }
}
@media (max-width:600px) {
    .ProDisplayStand_ArtFull > h1 { font-size: 24px;}
    .ProDisplayStand_ArtFull > p { font-size: 16px; }
    .ProDisplayStand_ArtSpec > div { margin-bottom: 5px; }
    .ProDisplayStand_ArtSpec > div > svg { font-size: 14px; }
    .ProDisplayStand_ArtSpec { font-size: 14px;}

    .ProDisplayStand_Img{height: 70vw;}
}
/*Pro1*/
.Pro1_Frame{ position: relative; height: 49.56vw; }
.Pro1_FrameTable_full{position: relative; width: 100%; height: 100%; z-index: 1;}
.Pro1_FrameTable_full > div{position: absolute; padding: 15px; word-wrap: break-word; color: white; width: 35%;}
.Pro1_FrameTable_full > div > h1{font-size: 42px; font-weight: 600;}
.Pro1_FrameTable_full > div > p{font-size: 18px; margin: 0;}

.Pro1xy{left: 10%; top: 10%; transform: translate(-10%, -10%) scale(1);}

.Pro1xy1{left: 5%; top: 10%; transform: translate(-5%, -10%) scale(1);}
.Pro1xy2{left: 50%; top: 10%; transform: translate(-50%, -10%) scale(1); text-align: center;}
.Pro1xy3{left: 95%; top: 10%; transform: translate(-95%, -10%) scale(1);}

.Pro1xy4{left: 5%; top: 50%; transform: translate(-5%, -50%) scale(1);}
.Pro1xy5{left: 50%; top: 50%; transform: translate(-50%, -50%) scale(1); text-align: center;}
.Pro1xy6{left: 95%; top: 50%; transform: translate(-95%, -50%) scale(1);}

.Pro1xy7{left: 5%; top: 90%; transform: translate(-5%, -90%) scale(1);}
.Pro1xy8{left: 50%; top: 90%; transform: translate(-50%, -90%) scale(1); text-align: center;}
.Pro1xy9{left: 95%; top: 90%; transform: translate(-95%, -90%) scale(1);}

.ProC{text-align: center;}

.Pro1_FrameBK_img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #000; background-repeat: no-repeat; background-size: cover; background-position: top center;}

@media (max-width:900px) {
    .Pro1_Frame { height: max-content; padding: 0px 0px 40px 0px;}
    .Pro1_FrameTable_full > div { position: initial; padding: 1rem 4%; transform: initial; width: 100% !important; text-align: initial;}
    .Pro1_FrameTable_full > div > h1{font-size: 25px}
    .Pro1_FrameTable_full{ min-height: 33.33vw; min-height: 10vw;}
    .Pro1_FrameBK_img{position: initial; padding: 50% 0 0 0;}

    .ProC{text-align: left !important;}
}
/*Pro2*/
.Pro_wMax1920Min300{ margin: 0 auto; min-width: 300px; }
.Pro2_Frame{ position: relative; height: 50vw; max-height: 960px; background-color: #d2d2d2; overflow: hidden; }
.Pro2_FrameTable_full{ position: relative; width: 100%; height: 100%; z-index: 1; }
.Pro2_FrameTable_full > div{
    position: absolute; height: max-content;
    word-wrap:break-word; color: white;
}/* padding: 15px; padding: 30px 4%; */
    .Pro2_FrameTableArt {z-index: 1; }
    .Pro2_FrameTableArt.C{ text-align: center;  }
    .Pro2_FrameTableArt.R{ text-align: right; }
    .Pro2_FrameTableArt > h1{ font-size: 42px; font-weight: 600;  }
    .Pro2_FrameTableArt > p{font-size: 18px; margin: 0; line-height: 1.75;}

    .Pro2_FrameTableImg{ text-align: center; width: 50%; }
    .Pro2_FrameTableImg > img{ width: 60%;}
.Pro2_FrameBK_img{ position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    background-color: #000;background-repeat: no-repeat;background-size: cover;background-position: top center;}
.Pro2_FrameBK_video{ position: absolute;
    top: 50%; left: 50%;
    min-width: 100%; min-height: 100%;
    width: auto; height: auto;
    z-index: 0;
    overflow: hidden;
    transform: translate(-50%, -50%) scale(1);
}


@media (max-width:1300px) {
    .Pro1_FrameTable_full > div > h1 , .Pro2_FrameTableArt > h1{ font-size: 32px; }
    .Pro2_FrameTableArt > p{font-size: 18px;}
}
@media (max-width:1000px) {
    .Pro1_FrameTable_full > div > h1 , .Pro2_FrameTableArt > h1{ font-size: 32px; }
    .Pro2_FrameTableArt > p{font-size: 18px;}
}
@media (max-width:900px) {
    .Pro2_Frame{ height: auto; max-height: none;}
    .Pro2_FrameTable_full {padding: 0px 0px 40px 0px;}
    .Pro2_FrameTable_full > div {position: initial; transform: none !important; max-width: none; width: 100% !important;  padding: 8% 4%;}
    .Pro2_FrameTableImg {max-width: 100% !important;}
    .Pro2_FrameTableImg > img { max-width: 100%; }
    .Pro2_FrameTableImg > video { padding: 4%; padding-bottom: 50px; max-width: none; max-height: 600px;}
    .Pro2_FrameTableArt { text-align: left !important; }
    .Pro2_FrameTableArt { padding: 0px 4%; margin-bottom: 40px; }
    .Pro1_FrameTable_full > div { color: white !important;}
    .Pro1_FrameTable_full > div > h1 , .Pro2_FrameTableArt > h1{ font-size: 28px; }
    .Pro1_FrameTable_full > div > p , .Pro2_FrameTableArt > p{ font-size: 18px; }

    .Pro1xy0{ transform: none !important;}
}
@media (max-width:600px) {
    .Pro2_FrameTableArt > h1{ font-size: 24px; }
    .Pro1_FrameTable_full > div > p , .Pro2_FrameTableArt > p{ font-size: 14px;  }
}
/*Background Video*/
.BackVideo { display: none;}
.BackVideo.Show { display: block; position: relative; overflow: hidden; height: 900px;
    -webkit-animation: load 1.5s 0.8s ease-out forwards; animation: load 1.5s 0.8s ease-out forwards;}
.Pro_TableCenter{
position: relative;
width: 100%; height: 100%; z-index: 1;
background-color: rgba(255, 255, 255, .1); background-color: transparent;
}
.Pro_TableCenter > div {
    position: absolute;
    text-align: center;
    word-wrap:break-word;
    padding: 15px; max-width: 60%; width: max-content;
}
.Pro_Center{
    top: 50%; left:50%; transform: translate(-50%, -50%) scale(1); color: white;
}
.Pro_Center > h1{ font-size: 60px; margin: 0 0 5px 0;}
.Pro_Center > h1 > p , .Pro_Center > p{ font-size: 30px; }

.Pro_Video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -1000;
    z-index: 0;
    overflow: hidden;
    -webkit-transform: translate(-50%, -50%) scale(1.05);
    transform: translate(-50%, -50%) scale(1.05);
    transform: translate(-50%, -50%) scale(1);
}

.FrameVideo { display: none;}
.FrameVideo.Show { display: block; position: relative; height: 56vw; max-height:800px;  min-height: 168px; .background: #d2d2d2;}
.YTif2{ position: absolute; margin: auto; top: 0; left: 0; right: 0; bottom: 0; padding: 3vw 4.5vw; max-width: 1200px; max-height: 700px; width: 100%; height: 100%;}


@media (max-width:900px) {
    .BackVideo.Show{ height: auto; }
    .Pro_TableCenter{ margin: 20px 0; }
    .Pro_TableCenter > div {
        position: relative;
        text-align: center;
        word-wrap:break-word;
        padding: 10px 15px; max-width: none; width: auto;
    }
    .Pro_Center{ top: auto; left: auto; transform: none; }
    .Pro_Video { position: relative; width: 100%; top: auto; left: auto; transform: none; }
    .YTif2{ padding: 6vw 9vw; padding: 0vw 9vw 6vw 9vw;}

    .Pro_Center > h1 { font-size: 30px; margin: 0 0 10px 0;}
    .Pro_Center > h1 > p, .Pro_Center > p { font-size: 18px; margin: 0 0 10px 0;}
}

@media (max-width:600px) {
    .YTif2{ padding: 2% 4%; padding: 0% 4% 6% 4%;}
    .Pro_TableCenter { margin: 0px; }
    .Pro_Center > h1 { font-size: 25px; margin: 0 0 5px 0;}
    .Pro_Center > h1 > p, .Pro_Center > p { font-size: 14px; margin: 0 0 5px 0;}
}
/*Frame Video*/
/**/
.Pro_X0Y5{ left:0%; top: 50%; transform: translate(-0%, -50%) scale(1);}
.Pro_X10Y5{ left:100%; top: 50%; transform: translate(-100%, -50%) scale(1);}

.Pro_X5Y0{ left:50%; top: 00%; transform: translate(-50%, -0%) scale(1);}
.Pro_X5Y10{ left:50%; top: 100%; transform: translate(-50%, -100%) scale(1);}