@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:#ffffff; display:none; }

/*-------------------*/
/*     C L A S S     */
/*-------------------*/
.adSize { position:absolute; top: 0px; left: 0px; width:300px; height:250px; }
.adSize2 { position:absolute; bottom: 0px; left: 0px; width:330px; height:250px; }
.adSize3 { position:absolute; bottom: 0px; left: 0px; width:385px; height:250px; }
.lineSize { position:absolute; top: 57px; left: 0px; width:217px; height:1px; background-color: #00495E}
.logoSize1 { position:absolute; top: 50px; left: 79px; width:143px; height:143px;}
.photoSize {position:absolute;top: 143px; left: 0px; width: 400px;height: 600px;}
.hideElm { display: none; }
.btn { cursor: pointer; }
.defPos { position: absolute; top: 0px; left: 0px; }
.anchorCenter { -webkit-transform-origin: center center; transform-origin: center center; }
.riderSize { position:absolute; width: 96px; height: 90px; }
.mobileSize { position:absolute; width: 122px; height: 168px; }

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

/* Images */

/* bg */
#bg1_a {background: url(bg1_a.jpg) no-repeat;background-size: 100%;top: 0px;left: 0px;}
#bg1_b {background: url(bg1_b.jpg) no-repeat;background-size: 100%;top: 0px;left: 0px; opacity: 0;}
#bg2_a {background: url(bg2_a.jpg) no-repeat;background-size: 100%;top: 0px;left: 0px;}
#bg2_b {background: url(bg2_b.jpg) no-repeat;background-size: 100%;top: 0px;left: 0px; opacity: 0;}
#bg3_a {background: url(bg3_a.jpg) no-repeat;background-size: 100%;top: 0px;left: 0px;}
#bg3_b {background: url(bg3_b.jpg) no-repeat;background-size: 100%;top: 0px;left: 0px; opacity: 0;}
#hoverState {background: url(hoverState.png) no-repeat;background-size: 100%;top: 0px;left: 0px; opacity: 0;}
#bg2 {left: -30px;}
#bg3 { left:-76px; }

/* Texts */
#f1_t1 { background: url(f1_t1.png) no-repeat; background-size: 100%; }

#f2_t1 { background: url(f2_t1.png) no-repeat; background-size: 100%; }
#f2_t2 { background: url(f2_t2.png) no-repeat; background-size: 100%; }

#f3_t1 { background: url(f3_t1.png) no-repeat; background-size: 100%; }
#f3_t2 { background: url(f3_t2.png) no-repeat; background-size: 100%; }


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


/* Frames */
#frame1, #frame2, #frame3, #resolved { top: -1px; right: 0px; overflow: hidden;}
#frame1, #frame2, #frame3 {clip-path: inset(0px 0px 0px 0px);}