/* 인덱스 레이아웃 */
#idx_wrapper{min-width:1100px; width:100%; margin:0 auto;}

/* 메인슬라이더 */
#visual{width:100%; min-width:1100px; position:relative; overflow:hidden;}
a{cursor:pointer}
#slogan{position:relative; z-index:10; width:800px; top:110px; margin:0 auto; font-size:1em; text-align:left;}
#slogan p{opacity:0; position:absolute; color:#FFF; text-shadow:0px 0px 5px #202020; line-height:1.5em;}
#slogan dib{display:block;}
#slogan .slg1{top:50px; font-size:2.5em; font-weight:600;}
#slogan .slg2{top:150px; font-size:1.5em;}
#slogan .slg3{top:200px; font-size:2.5em; font-weight:600;}
#slogan .slg3 strong{display:inline-block; background:#0A0401; color:#FFCC00; text-shadow:none; padding:0 5px; border-radius:2px}
#slogan .slg4{top:300px; font-size:1.5em;}
#slogan span{font-family:'Nanum Gothic', sans-serif, dotum;}

.sliderbx{z-index:1; width:100%; height:645px; left:0; top:0; padding:0; margin:0;}
.sliderbx li{width:100%; height:100%; background-position:50% 50%; background-repeat:no-repeat; background-size:cover;}
.sliderbx li:nth-child(1){background-image:url(../img/main/mvisual01.jpg)}
.sliderbx li:nth-child(2){background-image:url(../img/main/mvisual02.jpg)}
.sliderbx li:nth-child(3){background-image:url(../img/main/mvisual03.jpg)}

#visual div.bx-pager{ position:absolute; bottom:30px; left:50%; transform:translateX(-50%); z-index:2;}
#visual div.bx-pager div{ float:left; margin:0 3px;}
#visual div.bx-pager div a{ 
	display:block; width:12px; height:12px; text-indent:-9999px; border-radius:9px; background:#FFF;
	}
#visual div.bx-pager div a.active{background:#FEB609; width:24px;}
#visual div.bx-controls-direction a{
	display:block; width:40px; height:40px; border-bottom:2px solid #FFF; border-left:2px solid #FFF; border-radius:0 0 0 5px; text-indent:-9999px;
	position:absolute; top:50%; /*margin-top:-20px;*/
	} /*좌우버튼동시선택*/
#visual a.bx-prev{ transform:translateY(-50%) rotate(45deg); left:20px;}
#visual a.bx-next{ transform:translateY(-50%) rotate(-135deg); right:20px;}	
#visual div.bx-controls-auto{position:absolute; width:40px; top:30px; z-index:2; left:50%; margin-left:470px;}
#visual div.bx-controls-auto a{
	float:left; margin-right:3px; width:12px; height:12px; border-radius:9px; color:#FFF; text-align:center; line-height:12px; font-size:12px; text-indent:-9999px;
	} /*플레이스탑버튼동시선택*/
#visual div.bx-controls-auto a.bx-start{background:url(../img/common/btn_play.png) no-repeat 50% 50% #4C5365;}
#visual div.bx-controls-auto a.bx-stop{background:url(../img/common/btn_stop.png) no-repeat 50% 50% #4C5365;}

/* 인덱스 컨텐츠 */
#idx_container{z-index:4;position:relative;width:100%; min-width:1100px; margin:0 auto; text-align:center; background:#fff;font-size:1em;}

/* 인포 */
.info{background:url(../img/main/main_infobg.jpg) no-repeat 50%/cover; color:#fff; padding:65px 0; font-size:1.2em;}
.info .en1{font-family: 'Satisfy', cursive; font-size:2.5em; line-height:1.5em; color:#ffcc00; letter-spacing:0; }
.info .en2{font-family: 'Satisfy', cursive; display:inline-block; padding:5px 20px; border-bottom:1px solid #36261e; background:#0A0401; border-radius:50px;}
.info .slg1{font-size:1.5em; line-height:1.5em; margin:20px 0px;}

/* 타이틀 */
h2.tit{background:url(../img/common/logo_icon.png) 50% 0 no-repeat; padding-top:30px; font-size:1.7em; line-height:1.5em; letter-spacing:0; 
	color:#2F1E13; font-family: 'PT Sans Narrow', sans-serif; margin-bottom:10px;}
span.tit{display:inline-block; color:#666; font-size:1em; line-height:1.5em; letter-spacing:-1px; margin-bottom:50px;}
span.tit p{font-size:1.5em; line-height:2em; font-weight:600;}
span.tit p.call{font-size:1.3em; color:#333;}
span.tit p.call strong{color:#9E773A; font-size:1.5em; background:url(../img/common/phone2.png) no-repeat 3px 50%/auto 80%; padding-left:20px; font-weight:600;l}

/* 컨테이너 공통 */
.idx{padding:50px 0; font-size:1.2em;}
/* 스페셜렌탈 */
.sr ul li{display:inline-block; width:15%; margin:0 10px; vertical-align:top;}
.sr ul li img{display:block; width:95%; border-radius:50%; margin-bottom:20px;}
/*설지사례*/
.vtc{background:#EFEFEF;}
.vtc ul{width:1100px; margin:0 auto;}
.vtc ul li{position:relative; float:left; width:20%; height:400px; background-position:50% 0; background-repeat:no-repeat; background-size:auto 100%;}
.vtc ul li:nth-child(1){background-image:url(../img/main/ic_vtc_img1.jpg);}
.vtc ul li:nth-child(2){background-image:url(../img/main/ic_vtc_img2.jpg);}
.vtc ul li:nth-child(3){background-image:url(../img/main/ic_vtc_img3.jpg);}
.vtc ul li:nth-child(4){background-image:url(../img/main/ic_vtc_img4.jpg);}
.vtc ul li:nth-child(5){background-image:url(../img/main/ic_vtc_img5.jpg);}
.vtc ul li span{position:absolute; bottom:0; width:100%; left:0; height:110px; z-index:10; background:rgba(0,0,0,0.8); font-size:0.9em; color:#fff;}
.vtc ul li span p{font-size:1.3em; line-height:2em; font-weight:600; margin-bottom:10px; padding-top:10px;}
.vtc ul li span p:after{content:""; display:block; margin:0 auto; width:30px; height:1px; background:#fff;}
.vtc ul li .over{position:absolute; width:100%; height:100%; opacity:0; transition:all 0s;
				 background-position:50% 0; background-repeat:no-repeat; background-size:auto 100%;}
.vtc ul li:nth-child(1) .over{background-image:url(../img/main/ic_vtc_img1_over.jpg);}
.vtc ul li:nth-child(2) .over{background-image:url(../img/main/ic_vtc_img2_over.jpg);}
.vtc ul li:nth-child(3) .over{background-image:url(../img/main/ic_vtc_img3_over.jpg);}
.vtc ul li:nth-child(4) .over{background-image:url(../img/main/ic_vtc_img4_over.jpg);}
.vtc ul li:nth-child(5) .over{background-image:url(../img/main/ic_vtc_img5_over.jpg);}
.vtc ul li:hover .over{opacity:1; transition:all 0.5s;}
/* 진행절차 */		
.proc{}
.proc ul{width:1100px; margin:0 auto;}
.proc ul li{display:inline-block; height:130px; vertical-align:top;}
.proc ul li.step{width:20%; text-align:left; font-size:1em;}
.proc ul li.step p{font-size:1.2em; padding:5px 0; border-radius:5px; background:#2F1E13; color:#fff; margin-bottom:10px; text-align:center;}
.proc ul li.arrow{width:5%; text-align:center; background:url(../img/common/arrow.png) no-repeat 50%/50% auto;}

.bp{border-top:1px solid #E3E3E3; background:#2F1E13;}
.bp h2.tit{color:#fff; background:none; padding-top:0;}
.bp span.tit{ color:rgba(255,255,255,0.5); margin-bottom:20px;}
.bp li{display:inline-block; width:150px; height:40px; line-height:40px; text-align:center; border:1px solid rgba(255,255,255,0.5); background:#fff;}
.bp li img{width:90%; height:auto;}

/* 서브비주얼 */
#subvisual{width:100%; min-width:1160px; height:400px; position:relative; background:url(../img/main/svisual01.jpg) no-repeat 50%/cover; overflow:hidden;}
#subvisual #slogan .tit{font-size:2.3em; top:100px;}

/* 퀵메뉴 */
#quick{position:fixed; right:10px; top:200px; z-index:900; font-size:1.2em;}
#quick li{position:relative; display:block; right:0; width:120px; height:120px; background:#000; border-radius:50%; overflow:hidden;
		  margin-bottom:5px; transition:all 0.5s;}
#quick li div{position:absolute; width:100%; text-align:center; top:50%; transform:translateY(-50%); color:#fff;}
#quick li span{opacity:0; transition:all 0.5s;}
#quick li span{opacity:1;}

#quick .call p{font-size:1.5em; line-height:1.2em; font-weight:600; color:#FFCC00; letter-spacing:-0.5px; font-weight:bold;}
#quick .blog{}
#quick .venu{}


@media all and (max-width:768px){
	
	#idx_wrapper, #visual, #idx_container, #subvisual{width:100%; min-width:320px;}
	#slogan, .info .inner, .idx ul{width:90%; margin:0 auto;}
	
	#slogan{position:absolute; letter-spacing:-1px; top:50px; left:50%; transform:translateX(-50%); opacity:0;}
	#slogan dib{display:inline;}
	#slogan p{position:relative; opacity:1;}

	#slogan .slg1{font-size:1.5em; top:20px;}
	#slogan .slg2{font-size:1.2em; top:25px;}
	#slogan .slg3{font-size:1.5em; top:45px;}
	#slogan .slg4{font-size:1.2em; top:60px;}
	
	.sliderbx{height:500px;}

	#subvisual{height:200px;}
	#container_title{margin-top:40px; font-size:1.8em; font-weight:600; text-align:left;}
	#container_title span{ display:none;}
	
	#quick{display:none;}
	
	.info .en1{font-size:2em;}
	.info .slg1{font-size:1.15em; text-align:left;}
	.info .slg2{font-size:0.85em; text-align:left;}
	
	h2.tit{font-size:1.2em; background:url(../img/common/logo_icon.png) no-repeat 50% 0/8px auto; padding-top:20px;}
	span.tit{font-size:0.9em;}
	span.tit p{font-size:1em;}
	
	.sr ul li{display:block; width:100%; vertical-align:middle;}
	.sr ul li img{display:inline-block; width:35%;}
	.sr ul li span{display:inline-block; width:60%; padding-left:5%; height:100%; text-align:left; line-height:1.5em;}
	
	.vtc ul li{float:none; width:100%; height:150px; background-size:100% auto;}
	.vtc ul li span{width:40%; height:100%; letter-spacing:-1px;}
	.vtc ul li span p{padding-top:25px;}
	.vtc ul li .over{background-size:100% auto;}
	
	.proc ul{width:80%; margin:0 auto;}
	.proc ul li{display:block; height:auto;}
	.proc ul li.step{padding-bottom:20px;}
	.proc ul li.step, .proc ul li.arrow{ width:100%; font-size:0.9em;}
	.proc ul li.arrow{background:none;}
	
	.bp li{width:30%;}
	

	
}
