@charset "utf-8";

/* common */
body, input, select, option, textarea { font-family:Apple SD Gothic Neo,'맑은 고딕','Malgun Gothic','나눔고딕',NanumGothic,'돋움',Dotum,'굴림',Gulim,sans-serif; font-size:14px; line-height:1.25em; color:#494949; -webkit-text-size-adjust:none; }
body { overflow:hidden; }

a { text-decoration:none; color:#000;}
.hidden { position:absolute; visibility: hidden; font-size: 0; width: 0; height: 0; line-height: 0;}
.textCut, .textCut1 { display:block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}

input[type="text"], input[type="button"], input[type="submit"], input[type="password"], input[type="search"], textarea {-webkit-appearance:none;
	-webkit-border-radius:0; -moz-border-radius:0; border-radius:0;
}

body { background-color:#111111;}

.logo span { background-image:url('https://s3.ap-northeast-2.amazonaws.com/img.podgate.com/webimg/v2.adpick/ir_layout.png?1');background-repeat:no-repeat;-webkit-background-size:278px 100px;display:inline-block;overflow:hidden;white-space:nowrap;text-indent:-9999px;}

/* retina display */
@media screen and (-webkit-min-device-pixel-ratio:2){
	.logo span { background-image:url('https://s3.ap-northeast-2.amazonaws.com/img.podgate.com/webimg/v2.adpick/ir_layout@2x.png?1');}
}

.logo span { width:147px; height:34px; background-position:0 -66px;}

/*@keyframes obj1 {
    0% { top:70px;}
    50% { top:100px;}
    100% { top:70px;}
}*/

@keyframes obj3 {
    0% { bottom:-130px;}
    50% { bottom:-100px;}
    100% { bottom:-130px;}
}

#wrap { margin:0 auto; }
#header { height:74px; background-color:#fff}
#contents { position:absolute; left:0; top:74px; bottom:0; right:0; overflow:hidden }
.logobar { padding-top:26px; }
.logobar .logo { display:block; width:147px; margin:0 auto; }

.obj { position:absolute; left:50%;}
.obj1 { left:10%; top:70px; width:104px;
	/*animation-name:obj1;
	animation-duration:8s;
	animation-delay:2s;
	animation-iteration-count:infinite;*/
}
.obj2 { top:470px; width:2434px; margin-left:-1217px}
.obj3 { bottom:-130px; margin-left:-25px;
	animation-name:obj3;
	animation-duration:4s;
	animation-delay:3s;
	animation-iteration-count:infinite;
}
.obj3 img { width:700px;}

.msg { position:relative; z-index:999; padding:150px 5% 0 5%; color:#fff; text-align:center}
.msg .title { font-size:4em; line-height:1.4; font-weight:100;}
.msg .txt { font-size:2.4em; line-height:1.4; font-weight:100;}
.msg .btn_goadpick { display:inline-block; margin-top:15px; font-size:1.8em; padding:2% 3%; color:#fff; background-color:#37bc9b;
	border-radius:5px;
}

/*@keyframes obj1m {
    0% { top:25px;}
    50% { top:50px;}
    100% { top:25px;}
}*/

@keyframes obj3m {
    0% { bottom:-120px;}
    50% { bottom:-90px;}
    100% { bottom:-120px;}
}

@media screen and (max-width:767px) ,screen and (max-height:700px){

	.logo span { width:70px; height:18px; background-position:0 -47px;}

	#contents { top:35px;}

	.logobar { padding-top:10px;}
	.logobar .logo { width:70px;}

	#header { height:35px;
		-webkit-box-shadow:0 0 1px rgba(255,255,255,.5);
		-moz-box-shadow:0 0 1px rgba(255,255,255,.5);
		box-shadow:0 0 1px rgba(255,255,255,.5);
		background: rgb(47,47,47);
	    background: -moz-linear-gradient(top, rgba(47,47,47,1) 0%, rgba(34,34,34,1) 100%);
	    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(47,47,47,1)), color-stop(100%,rgba(34,34,34,1)));
	    background: -webkit-linear-gradient(top, rgba(47,47,47,1) 0%,rgba(34,34,34,1) 100%);
	    background: -o-linear-gradient(top, rgba(47,47,47,1) 0%,rgba(34,34,34,1) 100%);
	    background: -ms-linear-gradient(top, rgba(47,47,47,1) 0%,rgba(34,34,34,1) 100%);
	    background: linear-gradient(to bottom, rgba(47,47,47,1) 0%,rgba(34,34,34,1) 100%);
	    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2f2f2f', endColorstr='#222222',GradientType=0 );
    }

    .msg { padding-top:100px; font-size:.6em;}

    .obj1 { left:10%; top:55px; width:32px;
    	/*animation-name:obj1m;*/
    }
    .obj1 img {width:32px;}

    .obj2 { top:auto; bottom:-525px; margin-left:-608px}
    .obj2 img { width:1217px}
    .obj3 { bottom:-120px; margin-left:-106px;
    	animation-name:obj3m;
    }
    .obj3 img { width:400px}
}