@charset "utf-8";

/* common css reset */
a,abbr,acronym,address,applet,article,aside,audio,b,bdi,bdo,big,blockquote,body,button,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,header,hgroup,h1,h2,h3,h4,h5,h6,html,i,iframe,img,input,ins,kbd,label,legend,li,map,mark,menu,nav,object,ol,p,pre,q,rp,rt,ruby,s,samp,section,select,small,span,strike,strong,summary,sub,sup,table,tbody,td,textarea,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;font-size:100%;border:0;vertical-align:baseline}
input,select,textarea{color:#000;padding:0;margin:0}
.blind{position:absolute !important;font-size:0 !important;visibility:hidden !important}
legend, caption, hr{display:none}
ol,ul{list-style:none;}
a{text-decoration:none}
a:hover{text-decoration:none}
img{vertical-align:top}
/* common css reset */
.blind{position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;overflow:hidden}

/* skip navigation */
.skip_navi{position:absolute;top:0;left:0;width:0;height:0;z-index:1000}
.skip_navi a{position:absolute;top:-999px;white-space:nowrap}
.skip_navi a:focus{top:0;color:#fff;font-size:11px;background:#000;padding:5px}

/* 웹폰트로더 로딩 후 폰트 적용 */
body{position:relative;width:100%;height:100%;background:#fff;font-family:"맑은 고딕", sans-serif}
html.wf-active body{font-family:"Noto Sans KR", sans-serif}

/* 스프라이트 이미지 */
.logo a > span,
.btn > span,
.intro_top .title_01 span,
.intro_app_1 .post_list li a:hover .border,
.intro_app_2 .intro_swiper .slick-prev, .intro_app_2 .intro_swiper .slick-next,
.intro_app_2 .intro_swiper .slick-dots li{color:transparent;white-space:nowrap;overflow:hidden;font-size:0;background:url(../images2/spr_intro_app_171019.png) no-repeat;background-size:1200px 990px}

/* layout */
.cont{position:relative;width:980px;margin:0 auto}
.intro_app_2{position:relative;width:100%;height:820px;background-color:#fff;text-align:center;overflow:hidden;padding-top:50px;padding-bottom:50px;}
.intro_app_2 .title_01{display:inline-block;color:#fff;font-size:22px;letter-spacing:-1px;line-height:28px;font-weight:normal;border-bottom:1px solid #fff;padding-top:60px}
.intro_app_2 .bg_phone {
	display:block;z-index:2;position:absolute;top:70px;right:-75px;
	width:610px;height:730px;background:url(../images2/core_function_phone.png) no-repeat 0 0;
}
.bg_phone { position: absolute; top: 70px; right: 460px!important; }
.intro_app_2 .intro_swiper {
	z-index:2;position:absolute;right:-75px;margin:137px 0 0
}
/* Text position 값 위치 조정 */
.intro_app_2 .intro_swiper .slide_txt {
	z-index:10;position:absolute;top:-4px;width:100%;text-align:center;
}
.intro_app_2 .intro_swiper .slide_txt .txt {
	display:block;color:#fff;font-size:28px;line-height:1.3;letter-spacing:-2px;outline:none;cursor:default;
}
.intro_app_2 .intro_swiper .slide_txt .txt > em{display:block;color:#ffff00;font-size:72px;line-height:86px;font-style:normal;font-weight:300;letter-spacing:-5px;padding-bottom:20px;margin-left:-5px;}
.intro_app_2 .intro_swiper .slide_txt .txt > em > strong{font-weight:400}
.intro_app_2 .intro_swiper .slide_txt .txt > i{font-size:24px;font-style:normal;font-weight:300}
.intro_app_2 .intro_swiper .slide_txt .txt .br{display:block}
.intro_app_2 .intro_swiper .slide_image{float:left;margin:10px 688px 0 0;width:299px;z-index:1;}
.intro_app_2 .intro_swiper .slide_image .img{position:relative;width:299px;height:531px;background:#fff;outline:none;}
.intro_app_2 .intro_swiper .slide_image .slick-list:after{
	content:'';display:block;position:absolute;left:0;right:0;top:0;bottom:0;
}
.intro_app_2 .intro_swiper .slick-prev, .intro_app_2 .intro_swiper .slick-next{
	z-index:99;position:absolute;top:50%;width:68px;height:133px;margin-top:-100px;outline:none;cursor:pointer
}
/* 화살표 위치 조정 */
.intro_app_2 .intro_swiper .slick-prev{left: -260px;background-position:-410px -690px}
.intro_app_2 .intro_swiper .slick-prev:hover{background-position:-410px -840px}
.intro_app_2 .intro_swiper .slick-next{right:-790px;background-position:-500px -690px}
.intro_app_2 .intro_swiper .slick-next:hover{background-position:-500px -840px}
/* 4개 아이콘 position 값 위치 조정 */
.intro_app_2 .intro_swiper .slick-dots {
	position:absolute;left:665px;bottom:80px;z-index:10;text-align:left;
	display: inline-block!important; width: 480px; height: 40px;
}
.intro_app_2 .intro_swiper .slick-dots li {
	cursor:pointer;display:inline-block;width:90px;height:150px;margin-right:24px;background-repeat:no-repeat;margin-top:10px;
}
.intro_app_2 .intro_swiper .slick-dots li:first-child{background-position:0 -670px}
.intro_app_2 .intro_swiper .slick-dots li:first-child + li{background-position:-100px -670px}
.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li{background-position:-200px -670px}
.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li + li{background-position:-300px -670px}
.intro_app_2 .intro_swiper .slick-dots li:first-child.slick-active{background-position:0 -820px}
.intro_app_2 .intro_swiper .slick-dots li:first-child + li.slick-active{background-position:-100px -820px}
.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li.slick-active{background-position:-200px -820px}
.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li + li.slick-active{background-position:-300px -820px}
.intro_app_2 .intro_swiper .slick-dots li > button{display:block;text-indent:-9999px}

/* 모바일 기준 : 768px */
@media only screen and (max-width : 768px) {
/*
	#wrap{min-width:320px}
  .android_device #wrap, .ios_device #wrap{padding-bottom:56px}
	.cont{width:100%}
	.logo a > span,
	.btn > span,
	.intro_top .title_01 span,
	.intro_app_1 .post_list .icon,
	.intro_app_2 .intro_swiper .slick-prev, .intro_app_2 .intro_swiper .slick-next,
	.intro_app_2 .intro_swiper .slick-dots li{display:block;color:transparent;white-space:nowrap;overflow:hidden;background:url(http://md.egloos.com/img/introduce/m_spr_intro_app_170802.png) no-repeat;background-size:400px 280px}
	.intro_app_2{height:auto;padding-top:27px}
	.intro_app_2:after{content:'';display:block;position:absolute;left:0;right:0;bottom:0;height:90px;background:#49c0f8}
	.intro_app_2 .title_01{display:none}
	.intro_app_2 .bg_phone{top:125px;left:50%;margin-left:-97px;width:255px;height:400px;background-size:255px 400px}
	.intro_app_2 .intro_swiper{position:relative;right:auto;width:290px;height:490px;padding-top:125px;margin:0 auto}
	.intro_app_2 .intro_swiper .slide_txt{top:0;left:0;right:0;width:290px;max-height:125px}
	.intro_app_2 .intro_swiper .slide_txt .txt{font-size:16px;letter-spacing:-1px;line-height:1.2;text-align:center;padding:0}
	.intro_app_2 .intro_swiper .slide_txt .txt > em{font-size:28px;line-height:32px;letter-spacing:-2px;font-weight:400;padding:3px 0 5px}
	.intro_app_2 .intro_swiper .slide_txt .txt > i{font-size:12px;line-height:18px}
	.intro_app_2 .intro_swiper .slide_txt .txt .br{display:inline}
	.intro_app_2 .intro_swiper .slide_image{width:160px;margin:33px 67px 0  0}
	.intro_app_2 .intro_swiper .slide_image .img{width:160px;height:295px}
	.intro_app_2 .intro_swiper .slide_image .img img{width:160px}
	.intro_app_2 .intro_swiper .slick-prev, .intro_app_2 .intro_swiper .slick-next{width:34px;height:67px;margin-top:-40px}
	.intro_app_2 .intro_swiper .slick-prev{left:-66px;background-position:-260px -100px}
	.intro_app_2 .intro_swiper .slick-prev:hover{background-position:-260px -100px}
	.intro_app_2 .intro_swiper .slick-next{right:-66px;background-position:-305px -100px}
	.intro_app_2 .intro_swiper .slick-next:hover{background-position:-305px -100px}
	.intro_app_2 .intro_swiper .slick-dots{left:-80px;bottom:-160px;width:320px;height:90px;text-align:center}
	.intro_app_2 .intro_swiper .slick-dots:after{content:'';position:absolute;top:-10px;left:50%;margin-left:-12px;display:block;width:0px;height:0px;border-top:none;border-bottom:13px solid #49c0f8;border-right: 12px solid transparent;border-left: 12px solid  transparent}
	.intro_app_2 .intro_swiper .slick-dots li{display:inline-block;width:45px;height:61px;margin:15px 10px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child{background-position:-200px -215px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li{background-position:-250px -215px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li{background-position:-300px -215px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li + li{background-position:-350px -215px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child.slick-active{background-position:0 -215px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li.slick-active{background-position:-50px -215px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li.slick-active{background-position:-100px -215px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li + li.slick-active{background-position:-150px -215px}
	.intro_app_2 .intro_swiper .slick-dots li:after{content:'';position:absolute;left:50%;top:-28px;display:block;width:6px;height:6px;background:#0c82ba;border-radius:3px;}
	.intro_app_2 .intro_swiper .slick-dots li:first-child:after{margin-left:-18px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li:after{margin-left:-8px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li:after{margin-left:2px}
	.intro_app_2 .intro_swiper .slick-dots li:first-child + li + li + li:after{margin-left:12px}
	.intro_app_2 .intro_swiper .slick-dots li.slick-active:after{background:#fff}
*/
}