/*
 공통 css_new
 최초작성일 : 2016-03-17
 최종수정일 : 2016-03-17

 @author : back hee yeon(libe90@commercelab.co.kr)
 @since : 2016-03-17 libe90
 @since : 2016-05-11 libe90 로그인 페이지 폰트 css ng->ngb로 변경,고객센터 주석에 맞춰서 로그아웃, info 위치조정
 @since : 2016-05-30 sukjada81 프랜차이즈 동기화
 @since : 2016-06-03 libe90 작은화면에서 하단 잘리는 오류 수정
*/
/* ==========================================================================
   layout styles
   ========================================================================== */
body { word-wrap:break-word;word-break:break-all;text-align:left; background:url(../img/background_patten.gif) repeat}
header, footer { display: block; margin:0; padding:0; }
header{position:relative; z-index:500; margin-bottom:-65px; background:#125da8;width:100%; height:65px; box-shadow:0px 2px 2px rgba(0,0,0,0.3); text-align:center;}
header a.icon {display:block; width:70px; height:65px; background:url("../img/common.png") no-repeat;position:absolute; top:0px}
header a.icon.home {left:0px; background-position:-520px 0px}
header a.icon.home:hover {background-position:-520px -65px}
header a.icon.back {left:70px; background-position:-590px 0px}
header a.icon.back:hover {left:70px; background-position:-590px -65px}
/*2014-04-26 ssk 싱크커머스 상단에 예약화면(reservation) 이동 버튼 추가*/
header a.icon.reservation {width:69px; left:137px; background-position:-450px -130px; border-right:1px solid #6fa1d4}
header a.icon.reservation:hover {left:137px; background-position:-519px -130px}

header a.icon.favorite {right:0px; background-position:-730px 0px}
header a.icon.favorite:hover , header a.icon.favorite.on {background-position:-730px -65px}
header a.icon.favorite_on {right:0px; background-position:-730px -350px}
header a.icon.favorite_on:hover , header a.icon.favorite_on.on {background-position:-730px -415px}

header a.icon.todo {display:none; right:70px; background-position:-660px 0px}
header a.icon.todo:hover {background-position:-660px -65px}
header a.icon.logout {right:70px; background-position:-450px 0px}
header a.icon.logout:hover {background-position:-450px -65px}

header a.icon.cs-center {right:70px; background:url("../img/common/header_control_cscenter.png") center no-repeat; }
header a.icon.setting {right:0px; background:url("../img/common/header_control_setup.png") center no-repeat; }

header .login_info{position:absolute;top:23px;right:140px;color:#fff; font-size:15px;}
header .login_info:after {content:""; display:block; width:2px; background:url("../img/common.png") -327px 0 no-repeat; position:absolute; top:-23px; left:-20px}
header .login_info span {font-family:ngb; color:#fff}

header .search-box-default {width:180px; position:absolute; top:12px; left:220px;}

header h1{height:65px;width:252px;margin:0 auto; text-indent:-10000px;font-size:0}

/*footer{position:relative; margin-top:-35px; width:100%; height:35px; background-color:#f1f1f1; color:#292929; text-align:center; font-size:11px; line-height:35px;}*/
/* footer 창 사이즈가 작을때 따라 올라가는 문제 해결 */
footer {position: fixed; padding-top:15px; bottom:0; left:0; width:100%; height:47px; border-top:0;	background:#07315b; z-index:10000; font-size:11px; color:#fff; text-align:center; box-shadow:0 -2px 2px rgba(0,0,0,0.3);}

div.wrapper {width:100%; height:100%; min-height:805px; /* min-height:770px; - script */}

div.s_wrapper {width:100%; height:100%; min-height:830px; background-color:#fff;}

article.contents {position:relative; padding:85px 35px 65px; background-color:#fff;}
article.contents:after {content:""; display:block; clear:both;}

.layout_contetns {position:relative; padding:85px 35px 0; background-color:#fff;}
.layout_contetns:after , .half_wrap:after {display:block; clear:both; content:"";}

div.wrapper2{width:100%; height:100%; min-height:805px;  /* min-height:770px; - script */}


/* ==========================================================================
   Login styles
   ========================================================================== */
section.login_wrap {position:relative; width:100%; height:100%;}
section.login_wrap:before {position:relative; display:inline-block; width:0.01%; height:100%; vertical-align:middle; content:"";}/*@since : 2016-04-20 sukjada81 헤어샵과 동기화 */
section.login_wrap .login_inner {display:inline-block; position:relative; z-index:2; vertical-align:middle;  width:584px; left:50%; margin:10px 0 0 -292px; _height:503px;}/*2016-05-10 ssk 헤어샵과 동기화(로그인 화면 크기 조절시 가운데 정렬하기 위해)*/
/*section.login_wrap .login_inner {position:absolute; width:550px;}*/
section.login_wrap .login_inner > h2 {font-size:30px;text-align:center;color:#AAD1F8/*background:url("../img/login_title.png") no-repeat*/; width:580px; height:32px; margin:auto; margin-bottom:35px}/*2016-04-19 ssk 로그인페이지 메인 로고 text로 변경*/
section.login_wrap .box{ width:584px; height:251px; position:relative; padding:65px 0 0 75px; background:#125da8; box-shadow:0 2px 2px rgba(0,0,0,0.3)}
section.login_wrap .box p{}
section.login_wrap .box p.pw {margin-top:18px;}
section.login_wrap .box p span{display:inline-block;font:18px ngb; color:#fff;padding-right:8px; vertical-align:middle;}
section.login_wrap .box p input[type=text],
section.login_wrap .box p input[type=password]{width:228px;height:32px;padding:0 10px;border:none;background-color:#fff;}
section.login_wrap .box p.info{overflow:hidden; padding-left:85px;margin-top:28px; font:14px ngb; color:#fff;}
section.login_wrap .box p.info input[type=checkbox]{ margin:-2px 0 0 0; vertical-align:middle;}
/*section.login_wrap .box p.btn_find_pw { margin-top:28px; padding:15px 20px 0 0; text-align:right}*/
section.login_wrap .box a.btn_find_pw {font:14px ngb; color:#fff;}
section.login_wrap .box a.btn_find_pw:hover {color:#fff}
section.login_wrap .box a.btn_find_pw:before{display:inline-block; width:1px; height:13px;margin:0 14px; margin-top:-3px; vertical-align:middle; background:#fff; content:"";}
section.login_wrap .box p.btn{position:absolute; top:64px; right:75px; padding:0;}
.btn_login{color:#fff; width:104px; height:82px; text-align:center; font:18px/82px ngb; background-color:#004386; padding:0px; border:none}
section.login_wrap .login_inner .alert{ color:#fff; text-align:center; margin-left:-75px;}

section.login_wrap .modal .modal-dialog{color: white;width:300px;height:200px;position:static;position:absolute}
section.login_wrap .modal .modal-dialog .modal-content{background-color:white;width:300px;height:200px;position:static}

div.wrapper.main-align {text-align:center; min-height:initial;}
div.wrapper.main-align:after {content:""; display:inline-block; width:0.01%; height:100%; vertical-align:middle;}
div.wrapper2.main-align {text-align:center; min-height:initial;}
div.wrapper2.main-align:after {content:""; display:inline-block; width:0.01%; height:100%; vertical-align:middle;}

/* ==========================================================================
   main styles
   ========================================================================== */
/*section.main_btn{position:relative; margin:0 auto; padding:148px 0 0; width:1225px; height:580px;}*/
section.main_btn{position:relative; margin:0 0 0 0; display:inline-block; z-index:2; vertical-align:middle; _padding:180px 0 0;}
section.main_btn .swiper-container {width:1225px; height:580px;}
section.main_btn ul{overflow:hidden; padding-left:48px;}
section.main_btn ul li {float:left; margin-top:22px; margin-bottom:22px; padding-right:43px; width:293px; height:250px; text-align:center; background:url(../img/icon_plus.png) no-repeat 100% center; box-sizing:border-box;}
/*section.main_btn ul li {float:left;margin:37px 38px 0 0;}*/
section.main_btn ul li:nth-child(4n),
section.main_btn ul li:last-child{ width:250px; background:none;}
section.main_btn ul li a {display:block; position:relative; width:250px; height:250px; z-index:20;}
section.main_btn ul li a:after {display:none; position:absolute; top:0px; left:0px; width:240px; height:238px; content:"";}

.slide_paging_wrap .mainArrowBtn {background:url("../img/arrow.png"); position:absolute; top:35%;width:10px; height:52px; cursor:pointer}
.slide_paging_wrap .mainArrowBtn.left {z-index: 999;top:46%;width:48px;height:82px;background:url("../img/btn_big_pre.png");left:0px;}
.slide_paging_wrap .mainArrowBtn.right {z-index: 999;top:46%;width:48px;height:82px;background:url("../img/btn_big_next.png");right:0px;}

section.main_btn ul li a span {display:none; height:0px; width:0px; /* position:absolute; width:240px; height:238px; background:rgba(166,200,243,0.2); z-index:10; border-radius:18px; top:0px; left:0px */}

@media screen and (max-width: 1260px) {
	section.main_btn{padding-left:50px;padding-right:50px; width:auto;}
}


/* ==========================================================================
   환경설정 styles
   ========================================================================== */
section.set_btn{position:relative; margin:0 auto; padding:148px 0 0; width:1120px;}
section.set_btn ul {overflow:hidden; }
section.set_btn ul li { float:left;width:242px; height:253px; margin:37px 38px 0 0;}
section.set_btn ul li a {display:block; position:relative; outline:none;}
section.set_btn ul li a:after {display:none; position:absolute; top:0px; left:0px; width:240px; height:238px; content:"";}

.slide_paging_wrap .set_arrow_btn {background:url("../img/arrow.png"); position:absolute; top:35%;width:10px; height:52px; cursor:pointer}
.slide_paging_wrap .set_arrow_btn.left {z-index: 999;top:39%;width:37px;height:64px;background:url("../img/btn_big_pre.png");left:0px;}
.slide_paging_wrap .set_arrow_btn.right {z-index: 999;top:39%;width:37px;height:64px;background:url("../img/btn_big_next.png");right:0px;}

@media screen and (max-width: 1260px) {
	section.set_btn{padding-left:50px;padding-right:50px; width:auto;}
}


/* ==========================================================================
   페이징 styles
   ========================================================================== */
.paginations>.active>a,
.paginations>.active>span,
.paginations>.active>a:hover,
.paginations>.active>span:hover,
.paginations>.active>a:focus,
.paginations>.active>span:focus{
	z-index:2;
	color:#125da8 !important;
	cursor:default;
	border-color:#ddd;
}
