@charset "utf-8";

html, body{
    height: 100%;
}

#wrap{
    width:100%;
    margin: 0 auto;
}

/*banner s*/
#banner{
    height:1026px;
    background:url(../images/room/banner.jpg) no-repeat center center/cover;
}
#banner .inner{
    height:1200px;
    position:relative;
}
#banner .inner a{
    position:absolute;
}
#banner .inner a:first-child{
    top:13%;
    left:1%;
}
#banner .inner a:nth-child(2){
    top:30%;
    left:1%;
}
#banner .inner a:nth-child(3){
    top:17%;
    left:50%;
}
#banner .inner a:nth-child(4){
    top:19.5%;
    right:1%;
}
#banner .inner a:nth-child(5){
    top:60%;
    left:13%;
}
#banner .inner a:nth-child(6){
    top:70%;
    left:45%;
}
#banner .inner a:nth-child(7){
    top:18%;
    left:10%;
}
#banner .inner a:nth-child(8){
    top:16.5%;
    left:17%;
}
#banner .inner a:nth-child(9){
    top:30%;
    left:48%;
}
#banner .inner a:nth-child(10){
    top:26.5%;
    left:54.5%;
}
#banner .inner a:nth-child(11){
    top:23.5%;
    left:65.5%;
}
#banner .inner a:nth-child(12){
    top:27.5%;
    right:4%;
}

/*cont1 s*/
#cont1{
    height:1108px;
    background:url(../images/room/cont1_bg.jpg) no-repeat center 0/cover;
}
#cont1 .inner .ttl{
    text-align:center;
    padding:100px 0 90px 0;
}

#cont1 .rooms > div{
    float:left;
    width:368px;
    height:295px;
    margin:0 30px 0 0;
    border-radius:20px;
    border:6px solid rgba(255,255,255,0);
    overflow:hidden;
    transition:all 0.4s;
    -webkit-transition:all 0.4s;
    -moz-transition:all 0.4s;
}
#cont1 .rooms > div:hover{
    border:6px solid #4f92b5;
}
#cont1 .rooms .r3{
    margin:0;
}
#cont1 .rooms .r4,
#cont1 .rooms .r5{
    margin:30px 30px 0 0;
}
#cont1 .rooms .r6{
    margin:30px 0 0 0;
}

#cont1 .rooms > div a{
    display:block;
    width:100%;
    height:100%;
    position:relative;
}
#cont1 .rooms > div a img{
    width:100%;
    height:100%;
    position:absolute;
}
#cont1 .rooms > div a img:first-child{
    transition:all 0.4s;
    -webkit-transition:all 0.4s;
    -moz-transition:all 0.4s;
}
#cont1 .rooms > div a img:last-child{
    opacity:0;
    transition:all 0.4s;
    -webkit-transition:all 0.4s;
    -moz-transition:all 0.4s;
}
#cont1 .rooms > div:hover a img:first-child{
    transform:scale(1.05);
}
#cont1 .rooms > div:hover a img:last-child{
    opacity:1;
}