@charset "utf-8";
/* acaS Document */
/*기본 스타일 설정*/
.container,
.container a,.container p,.container span,.container div,.container button,.container label,
.container li, .container dd, .container dt,
.container td,.container th,
.container h1,.container h2,.container h3,.container h4,.container h5,.container h6{
letter-spacing:-0.0333em; word-spacing:-0.075em;
}
.pc_show{display:block !important;}
.m_show{display:none !important;}

#header{
    position: relative;
    z-index: 5;
    /*그림자가 가려져서 넣은 임시 코드입니다.*/
}

/*1200px 가운데 정렬 기본 컨테이너*/
/*.container {
    width: 1200px;
    margin: 0 auto;
    font-size: 16px;
    color: #333;    
}*/
.clear:after{
    display: block;
    content: '';
    clear: both;
}

input[type=text]::-ms-clear {
    /*익스플로러 인풋박스 X버튼 삭제*/
    display:none;
}

/**************shopon************/


/***********/
/*기본스타일*/


/*Edge 배경픽스 버그 해결*/
@supports ( -ms-accelerator:true )
{
    html{
        overflow: hidden;
        height: 100%;    
    }
    body{
        overflow: auto;
        height: 100%;
    }
}




.wrap{
    width: 100%;
}

.container.inner{
    margin: 0 auto;
    width: 1200px;
    text-align: center;
}

.clear:after{
    content: '';
    clear: both;
    display: block;
    visibility: hidden;
}

.fl-l{
    float: left;
    width: 560px;
}
.fl-r{
    float: right;
    width: 560px;
}

/*기본스타일 End*/
/***********/
.go-top-wrap{
    position: fixed;
    bottom: 60px;
    right: 40px;
}
.go-top{
    display: block;
    color: rgba(60,60,60,.5) !important;
    background-color: rgba(0,0,0,0.05);
    text-align: center;
    font-size: 20px;
    padding: 1em 1.2em;
	width:115px;box-sizing:border-box;
    border-radius: 10px;
    transition: .5s;
    transition-property: background, color;
}
.go-top:hover{
    color: rgba(255,255,255,.8) !important;
    background-color: rgba(0,0,0,.2);
    transition: .5s;
    transition-property: background, color;
}
a.blog{
    display: block;
    width: 65px;
    height: 64px;
    font-size: 13px;
    line-height: 64px;
    text-align: center;
    color: white;
    margin-top: 5px;
}
/*****HeroArea*****/
.top{
    padding: 1px 0;
}



.b2b_visual{
    background-image: url(/data/skin/beauty/images/b2b/b2b.jpg);
    background-repeat: no-repeat;
    color: white;
    background-color: #071524;
    background-position: bottom center;
    position: relative;
    height:870px;
    /*z-index: 5;*/
}
.b2b_visual .page-title{
    position:absolute;
    text-align: left;
    top:240px;
	left:50%;
	white-space: nowrap;
	transform:translate(-50%);
}
.b2b_visual .page-title p{
    font-size: 60px;
    font-weight: 300;
    margin-right: 15px;
    color:#FFF;
    display: block;
    line-height: 1.8;
	width:100%;text-align:center;
	margin-top:100px;
}
.page-title span{
    font-size: 136px;
    font-weight: bold;
    line-height: 0.27;
    color:#FFF;
    display: block;
	text-align:center;
	padding-top:60px;
}
.apply a {
   display: block;
    font-size: 22px;
    font-weight: 500;
    box-sizing: border-box;
    background-color: white;
    color: #333;
    border-radius: 2em;
    position: absolute;
    bottom: 260px;
    width: 340px;
    height: 69px;
    padding: 0 45px;
	left:50%;
	transform:translate(-50%);

}
.apply a:hover .icon.arrow-right{
	margin-right:0px;
}
.apply span {
        vertical-align: middle;
    display: inline-block;
    height: 29px;
    float: left;
    margin-right: 2px;
    line-height: 69px;
    text-align: center;
}
.icon.arrow-right {
    display: block;
    width: 29px;
    height: 69px;
    background: url(/data/skin/beauty/images/b2b/icon_arrow_right_medium.png) no-repeat center;
    float: right;
	margin-right:-15px;
	transition:all .3s;
}
a.white_border{padding:0 45px !important;}
.icon.arrow-right.white{
	    background: url(/data/skin/beauty/images/b2b/icon_arrow_right_medium_white.png) no-repeat center;

}
/*****visual Area :: End*****/

/*****섹션공통*****/
.top-down-130{
    padding: 130px 0;
}
.overview{
    margin-bottom: 100px;
}
.keyvisual{
    margin-top: -15px;
}
.titles{
    text-align: left;
    font-size: 0;
    overflow: hidden;
}
.title{
    font-size: 0;
    overflow: hidden;
    display: inline-block;
}
/*.titles .number, .titles .title{
    float: left;
}*/

.titles .number{
    display:inline-block;
    text-align: left;
}
.title h2{
    font-size: 60px;
    font-weight: 600;
    position: relative;
    display: inline-block;
	vertical-align:baseline;
}
.title h2:after{
    content:"";
    position: absolute;
    width:36px;
    height:4px;
    background: #2979ff;
    left:10px;
    top:-12px;
}
.titles h3{
    /*clear: both;*/
    font-size: 30px;
    font-weight: 400;
    margin-bottom: 25px;
    color: #333;
    margin-top: 65px;
    text-align: left;
}
.titles p{
    font-size: 20px;
    line-height: 32px;
    font-weight: 300;
    color: ##63656a;

}
.tel p{
    font-size:20px;

}
.tel p strong{
    font-size: 25px;
    font-weight: bold;
    margin-right:20px;
}
/*가운데정렬*/
.titles.center{
    margin: 0 auto;
    text-align: center;
}
.titles.center .box{
    display: inline-block;
    
}

/*****섹션공통 :: End*****/

/*섹션네비게이션*/
.navigation{
    box-shadow: 0px 1px 5px 3px #d9dce0;
    display: inline-block;
    width: 100%;
}
.navigation ul{
    background-color: white;
    text-align: center;
    vertical-align: middle;
}
.navigation li{
    display: inline-block;
    padding: 50px 0;
}
.navigation li a{
    font-size: 22px;
    font-weight: 400;
    line-height: 0.8;
}
.navigation li:first-child ~ li:before{
    content: '';
    display: inline-block;
    width: 1px;
    height: 15px;
    background-color: #e9ecef;
    margin: 0 25px;
}

/*섹션네비게이션::End*/


/**************************/
/*********section1*********/
#section1{
    background-color: #FFF;
}
#section1 .container{
    background-color: #FFF;
    position:relative;
}

#section1 .keyvisual{
    height: 560px;
    width: 560px;
    background: url(/data/skin/beauty/images/b2b/sect1.jpg)no-repeat;
    margin-right:40px;
}

#section1 .titles .number{
    background: url(/data/skin/beauty/images/b2b/title_num01.png)no-repeat;
    margin-right:45px;
    margin-bottom: -9px;
    width:106px;
    height:148px;
    
}
#section1 .tel{
    border:1px solid #f8f8f8;
    height: 120px;
    line-height: 120px;
    background: url(/data/skin/beauty/images/b2b/sect1_tel.png)no-repeat;
}
#section1 .tel p{
    font-size:20px;
}
#section1 .tel p strong{
    font-size: 25px;
    font-weight: bold;
    margin-right:20px;
}

#section1 .titles a.black_border {
    width: 425px;
    height: 70px;
	border: 3px solid #555;
    line-height: 64px;
    font-size: 22px;
    font-weight: 600;
    padding: 0 100px;
    display: inline-block;
    text-align: center;
    color: #333;
	position:relative;
}
#section1 .titles a.black_border span{position:absolute;left:50%;transform:translate(-70%);}
#section1 .titles a.black_border:hover .icon.arrow-right{margin-right:0;}
/*********section1 end*********/
/******************************/


/**************************/
/*********section2*********/
#section2{
    background-color: #ccd8e7;

}
#section2 .title{
    width:600px;

}
#section2 .keyvisual{
    height: 560px;
    width: 560px;
    background: url(/data/skin/beauty/images/b2b/sect2.jpg)no-repeat;
    margin-left:80px;
}

#section2 .titles .number{
    background: url(/data/skin/beauty/images/b2b/title_num02.png)no-repeat;
    margin-bottom: -1px;
    width:139px;
    height:146px;
    margin-right:15px;
}

#section2 .titles h2{
    font-size: 55px;

}

#section2 .contents h3{
    font-size: 20px;
    text-align:left;
    position:relative;
    margin-bottom:30px;
}
#section2 .contents h3:after{
    content:"";
    width:982px;
    height:1px;
    background: #b5c9e2;
    display: inline-block;
    position: absolute;
    bottom:0;
    margin-left:25px;
}
#section2 .contents ul{
    width:1200px;
    font-size: 0;
    overflow: unset;
}
#section2 .contents ul li{
    display:inline-block;
    width:213px;
    height:104px;
    background:#fff;
    border-radius: 5px;
    padding:19px;
    text-align: center;
    font-size: 20px;
    box-shadow: 2px 2px 2px 2px rgba(0,0,0,.05)
}
#section2 .contents ul li + li{
    margin-left:30px;
}
#section2 .contents ul li address{
    color:#8fb9ff  ;
    margin-bottom: 10px;
    font-weight: 500;
}
#section2 .overview {
    margin-bottom: 60px;
}
/*********section2 end*********/
/******************************/

#section3{
    clear:both;
    background-color: #2979ff;
}

#section3 .keyvisual{
    height: 560px;
    width: 560px;
    background: url(/data/skin/beauty/images/b2b/sect3.jpg)no-repeat;
    margin-left:40px;
}

#section3 .titles .number{
    background: url(/data/skin/beauty/images/b2b/title_num03.png)no-repeat;
    margin-bottom: -1px;
    width:137px;
    height:146px;
    margin-right:15px;
}
#section3 .title h2,
#section3 .titles > p ,
#section3 .titles h3{
    color:#fff;
}
#section3 .title h2:after{
    background: #7cadff;
}
#section3 .tel{
    height: 120px;
    line-height: 120px;
     background: url(/data/skin/beauty/images/b2b/sect3_tel.png)no-repeat;
}
#section3 .tel p{
    color: #FFF
}
#section3 .original{
    width:1200px;
    height:393px;
    background: url(/data/skin/beauty/images/b2b/sect3_bg.png)no-repeat;
    margin-top:60px;
    padding-top:40px;
    padding-left:57px;
}
#section3 .original .title{

    height:110px;
    display: block;
    text-align: left;
    font-size:20px;
    border-bottom: 1px solid #e6e7e8;
	width:43%;
}
#section3 .original .title h3{
    font-weight: 500;
    margin-bottom:10px;
}
#section3 .original .title p{
    font-weight: 300;
    line-height: 1.4;
}
/*********section3 end*********/
/******************************/


#section4{
    clear:both;
    background-color: #2979ff;
}
#section4 .contents,
#section4 .history{
    padding:0 77px;
}
#section4 .titles .number{
    background: url(/data/skin/beauty/images/b2b/title_num04.png)no-repeat;
    margin-bottom: -1px;
    width:145px;
    height:146px;
    margin-right:15px;
}
#section4 .keyvisual{
    height: 560px;
    width: 560px;
    background: url(/data/skin/beauty/images/b2b/sect4.jpg)no-repeat;
    margin-right:40px;
}

#section4 .title h2:after{
    background: #7cadff;
}
#section4 h2, #section4 h3,
#section4 p{
    color: white;
    
}
#section4 .tel{
    height: 120px;
    line-height: 120px;
     background: url(/data/skin/beauty/images/b2b/sect3_tel.png)no-repeat;
}
#section4 .titles a.white_border{
	width: 450px;
    height: 70px;
    border: 3px solid #c8ddff;
    line-height: 64px;
    font-size: 22px;
    font-weight: 500;
    padding: 0 100px;
	display:inline-block;
	margin-top:-5px;
	text-align:center;
	color:#fff;
	position:relative;
}
#section4 .titles a.white_border span{position:absolute;left:55%;transform:translate(-60%);width:100%;}
#section4 .titles a.white_border:hover .icon.arrow-right{margin-right:0;}
/*********section4 end*********/
/******************************/
#section5{
    background: #fff;
}
#section5 .container{
    padding:0 77px;
}
#section5 .titles{
    text-align:center;
    margin-bottom:48px;
}

#section5 .title p{
    font-size:30px;
    font-weight:400;
}
#section5 .title p.sub_tit{
    font-size:20px;
    font-weight:300;
    margin-top:55px;
}
#section5 .title h3{text-align:center;margin-top:45px;}
#section5 .titles .number{
    background: url(/data/skin/beauty/images/b2b/title_num04.png)no-repeat;
    margin-bottom: -1px;
    width:144px;
    height:146px;
    margin-right:15px;
}
#section5 .contents{
    width:1035px;
    background: #FFF;
    
}
#section5 .contents #oneyear{
    float: none;
    margin-top: 0;
    margin: 0 auto;
	width: 992px;
}
/*1년 12번의 기회*/
#oneyear{float:right; width:992px; text-align:center; margin-top:20px;}

#oneyear .banners-wrap{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	flex-wrap: wrap;	
	margin:-2px 0 0 -2px;
}
#oneyear .banners-wrap .bnr{
	position:relative;
	width:329px;
	height:115px;
	margin:2px 0 0 2px;
}
#oneyear .banners-wrap .bnr a{
	display:block;
	width:100%;
	height:100%;
}
#oneyear .banners-wrap .bnr a i{
	display:block;
	width:100%;
	height:100%;
	background-color:rgba(255,255,255,0.9);
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	box-sizing:border-box;
	opacity:0;
	transition:opacity, 0.3s;
}
#oneyear .banners-wrap .bnr a i:hover{
	opacity:1;
	transition:opacity, 0.3s;
}
#oneyear .banners-wrap .bnr a i:hover:after{
	transform:translateY(0);
	transition:0.6s;
}
#oneyear .banners-wrap .bnr a i:after{
	content:'';
	display:block;
	width:148px;
	height:53px;
	background-image:url("../images/asset/button_barGray_shadow.png");
	background-repeat:no-repeat;
	background-position:center;
	position:absolute;
	top:39px;
	left:91px;
	transform:translateY(5px);
}
#section5 .contents p.bot{
     font-size:20px;
    text-align: center;
    font-weight: 300;
    margin:100px 0;
    line-height: 32px;
}
#section5 .contents .shortcut{margin-top:100px;}
#section5 .contents .shortcut a + a{
     margin-left:3px;
}


#section5 .contents .num p strong{
     font-size:20px;
    font-weight:500;
}
#section5 .contents .hire,
#section5 .contents .work_con {
    margin:0 auto;
}
#section5 .contents .hire  thead tr th{
    height:40px;
    background:#e9ecef;
    border:1px solid #d6dadd;
    font-size:20px;
    text-align:center;
}
#section5 .contents .hire  tbody tr td{
    height:108px;
    font-size:20px;
    font-weight:300;
    border:1px solid #d6dadd;
    text-align:center;
}

#section5 .contents .work_con tr{
    height:40px;
    border:1px solid #d6dadd;
    
}
#section5 .contents .work_con tr th{
    width:190px;
    background:#e9ecef;
    padding-left:30px;
    font-size:20px;
}

#section5 .contents .work_con tr td{
    width:680px;
    border:1px solid #d6dadd;
    padding-left:30px;
    font-size:20px;
    font-weight:300;
}
#section5 .contents .num .in20{
    text-indent: 20px;
    margin-bottom:10px;
}
#oneyear td{border: solid 1px #d7dbe0 !important;}
/*************section5END***************/

/**********section6 start****************/


#section6{
    clear:both;
    background-color: #f0f2f4;
}
#section6 .contents,
#section6 .history{
    padding:0 77px;
}
#section6 .titles .number{
    background: url(/data/skin/beauty/images/b2b/title_num04.png)no-repeat;
    margin-bottom: -1px;
    width:147px;
    height:146px;
    margin-right:15px;
}
#section6 .keyvisual{
    height: 560px;
    width: 560px;
    background: url(/data/skin/beauty/images/b2b/sect6.jpg)no-repeat;
    margin-left:40px;
}
#section6 .titles p{
    position: relative;
}

#section6 .title h2:after{
    background: #2979ff;
}
#section6 .titles .faq_tel {
    width:411px;
    height:177px;
    padding-top:20px;
    border-top:1px solid #c4ceda;
}
#section6 .titles .faq_tel .red{
    color: #F00;
}
#section6 .titles .faq_tel .big{
    font-size:34px;
    font-weight:500;
    display: inline-block;
    height: 45px;
    margin-bottom: 10px;
    margin-right:38px;
}
#section6 .titles .faq_tel tr td{
    vertical-align: bottom;
    font-size: 19px;
    font-weight: 400;
    margin-right: 20px;

}
#section6 .titles .faq_tel tr td a{
    padding-right:8px;
}
#section6 .titles .faq_tel ul li{
   float: left;
    width:50%;
    font-size:20px;
    font-weight: 300;
}
#section6 .titles .faq_tel ul li:first-child{
    font-size:37px;
    font-weight: bold;
 
    color: #F00;
}

#section6 .tel{
    margin: 0 auto;
}
#section6 .tel ul{
    background: black;
    display: inline;
    font-size: 0;
}
#section6 .tel ul li{
    width:598px;
    height: 80px;
    display: inline-block;
    background: #fff;
    margin-bottom:4px; 
    font-size: 20px;
    font-weight: 300;
    text-align: left;
    line-height:80px;
    color: #333;
    padding-left:60px;
}
#section6 .tel ul li a
{margin-left:20px;}
#section6 .tel ul li + li{
    margin-left:4px; 
}
#section6 .tel ul li:nth-child(2n+1){
    margin-left:0 5px; 
	
}

#section6 .tel ul li strong{
    font-size: 25px;
    font-weight: bold;
    position: relative;
	margin-right:5px;
}

#section6 button{
    background: #2979ff;
    color: #fff;
    font-weight: bold;
    font-size: 22px;
    width: 554px;
    height:70px;
    margin-top: 100px;
    transition: 0.7s;
}

#section6 button:hover{
    box-shadow: inset 0px -7px 0px 0px rgba(0,0,0,.2);
    
}





/*푸터와 위 섹션간 기본 공백:공통*/
.footer-top-space{
    width: 100%; height: 80px; text-align: center; overflow: hidden; clear: both;
}
