@charset "utf-8";
/* CSS Document */

body { margin:0 auto; padding:0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; }

#container { position:absolute; width:300px; height:250px; overflow:hidden; top:0px; left:0px; background-color:#dfdfdf; display:none; }

/*-------------------*/
/*     C L A S S     */
/*-------------------*/
.adSize { position:absolute; top: 0px; left: 0px; width:300px; height:250px; }
.photoSize1a {position:absolute;top: 10px;left: -220px;width: 517px;height: 463px;}
.photoSize1b {position:absolute;top: 18px;left: -207px;width: 517px;height: 463px;}
.photoSize1c {position:absolute;top: 17px;left: -231px;width: 517px;height: 463px;}
.photoSize2 {position:absolute;top: 0px;width: 300px;height: 350px;}
.photoSize3 {position:absolute;top: 0px;width: 450px;height: 250px;}
.hideElm { display: none; }
.btn { cursor: pointer; }
.defPos { position: absolute; top: 0px; left: 0px; }
.anchorCenter { -webkit-transform-origin: center center; transform-origin: center center; }


/*-------------*/
/*     I D     */
/*-------------*/
/* Border */
#border { box-sizing: border-box; border: 1px solid #000; }

/* Frame 1 */
#pillow1 { background: url(pillow.png) no-repeat; background-size: 100%; }
#pillow2 { background: url(pillow.png) no-repeat; background-size: 100%; }
#pillow3 { background: url(pillow.png) no-repeat; background-size: 100%; }

/* Images */
#logo1, #logo2, #logo3 { background: url(logo.png) no-repeat; background-size: 100%; }
#logo4 { background: url(logo2.png) no-repeat; background-size: 100%; }

/* bg */
#bg {background: url(bg.jpg) no-repeat;background-size: 100%;top: 0px;left: 0x;}
#bg1 {background: url(bg1.jpg) no-repeat;background-size: 100%;top: 0px;left: 0x;}
#bg2 {background: url(bg2.jpg) no-repeat;background-size: 100%;top: 0px;left: 0x;}
#bg3 {background: url(bg3.jpg) no-repeat;background-size: 100%;top: 0px;left: 0x;}
#conditions { background: url(conditions.png) no-repeat; background-size: 100%; }

/* Text */
#text1 { background: url(text1.png) no-repeat; background-size: 100%; }
#text2 { background: url(text2.png) no-repeat; background-size: 100%; }
#text3 { background: url(text3.png) no-repeat; background-size: 100%; }
#save { background: url(save.png) no-repeat; background-size: 100%; }
#price { background: url(price.png) no-repeat; background-size: 100%; }

#mask1, #mask2, #mask3{
    width: 300px;
    height: 250px;
    top: 0px;
    left: 0px;
    background-color: #000;
    overflow: hidden;
    position: absolute;
}

#frame1, #frame2, #frame3 { top: -1px; left: -1px; }

/* CTA */
#cta {top: 0px; left: 0px}
#cta_out {background: url(cta_out.png) no-repeat;background-size: 100%;top: 0px; left: 0px;}
#cta_over {background: url(cta_over.png) no-repeat;background-size: 100%;top: 0px; left: 0px;opacity: 0;}