@charset "utf-8";
/* latest version 20110201 */
/* ************************************** *
 * in-wrap 컨텐츠 가로사이즈 조정
 * ************************************** */
.in-wrap { width: 1200px; min-width: 1200px; margin: 0 auto;}





/* ************************************** *
 * common layout
 * ************************************** */
::selection { background: #b4b4b4;}
.img-max { max-width: 100%;}
.img-ct-max { display: block; max-width: 100%; margin: 0 auto;}
.responsive { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%);}
.responsive-h { position: absolute; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -o-transform: translate(0,-50%);}
.inquiry-pop,
.bg-body { display: none; z-index: 500; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5);}





/* ************************************** *
 * header layout
 * ************************************** */
/* header */
#header { z-index: 150; overflow: visible !important; position: absolute; top: 0; width: 100%; min-width: 1200px; height: 158px; background: url('image-renew/bg-header.png') repeat-x left top;}
#header .header-in { position: relative; width: 1200px; margin: 0 auto;}
#header h1 { padding: 23px 0; text-align: center;}
/* gnb : 글로벌네비게이션 메뉴 */
#gnb .gnb-call { position: absolute; top: 27px; left: 0; width: 160px; text-align: center;}
#gnb .gnb-call p:nth-of-type(1) { font-size: 14px; font-weight: bold; color: #333; letter-spacing: -0.03em;}
#gnb .gnb-call p:nth-of-type(2) { font-size: 23px; font-weight: 700; color: #7849d0;}
#gnb .gnb-branch { position: absolute; top: 28px; right: 0;}
#gnb .gnb-branch div { position: relative;}
#gnb .gnb-branch button { display: block; width: 150px; line-height: 40px; padding-left: 15px; border: 1px solid #4e4e4e; font-size: 14px; background: url('image/bg_branch_arr.gif') no-repeat right 15px center; text-align: left; letter-spacing: -0.03em;}
#gnb .gnb-branch .branch-box { z-index: 300; display: none; position: absolute; top: 42px; left: 0; width: 150px; border: 1px solid #d5d5d5; box-sizing: border-box; background: #fff;}
#gnb .gnb-branch .branch-box li a { display: block; font-size: 13px; line-height: 38px; padding-left: 15px; border-top: 1px solid #d5d5d5; color: #555; background-position: right 20px center;}
#gnb .gnb-branch .branch-box li:first-child a { border-top: 0;}
#gnb .gnb-branch .branch-box li a:hover { font-weight: bold; background: url('image/bg_arr_branch.gif') no-repeat; background-position: right 15px center;}
/* lnb : 네비게이션 메뉴 */
#lnb { z-index: 200; position: relative; width: 100%;}
#lnb .lnb-navi > li { float: left; width: 20%; text-align: center;}
#lnb .lnb-navi > li > a { display: block; line-height: 58px; font-weight: 500; font-size: 18px; color: #fff; letter-spacing: -0.04em;}
#lnb .lnb-navi > li > a:hover,
#lnb .lnb-navi > li.on > a { color: #9f8fe9; background: #222;}
#lnb .lnb-dep2 { display: none; z-index: 200; height: 322px; padding-top: 20px; box-sizing: border-box;}
#lnb .lnb-navi > li.on .lnb-dep2 { background: #222;}
#lnb .lnb-dep2 > li a { display: block; font-size: 15px; color: #fff; line-height: 38px;}
#lnb .lnb-dep2 > li a:hover { text-decoration: underline; color: #aa7dfe;}





/* ************************************** *
 * main layout
 * ************************************** */
/* 공통 */
h2.tit-main { display: inline-block; margin: 70px auto 40px; border-bottom: solid 1px #333; font-size: 30px; color: #333; text-transform: uppercase; line-height: 1.2em;}
h3.tit-main-board { border-bottom: solid 1px #aaa; padding-bottom: 10px; margin-bottom: 23px; font-size: 16px; font-weight: bold; color: #444; letter-spacing: -0.05em;}
h3.tit-main-board span { padding-right: 10px; color: #9f8fe9; letter-spacing: 0;}
/* 메인비주얼 */
.main-visual { overflow: hidden; max-height: 500px; min-width: 1200px; text-align: center;}
.main-visual img { max-width: 100%;}
/* 커리큘럼 */
.curriculum li { position: relative; float: left; width: 30.33%; margin: 1.5%; background-size: cover !important; background-position: left bottom !important;}
.curriculum li:nth-of-type(1) { background: url('image-renew/bg-hair-curr.jpg') no-repeat;}
.curriculum li:nth-of-type(2) { background: url('image-renew/bg-makeup-curr.jpg') no-repeat;}
.curriculum li:nth-of-type(3) { background: url('image-renew/bg-nail-curr.jpg') no-repeat;}
.curriculum li:nth-of-type(4) { background: url('image-renew/bg-esthetic-curr.jpg') no-repeat;}
.curriculum li:nth-of-type(5) { background: url('image-renew/bg-special-curr.jpg') no-repeat;}
.curriculum li:nth-of-type(6) { background: url('image-renew/bg-college-curr.jpg') no-repeat;}
.curriculum li a { display: block; width: 100%; height: 300px; border: solid 7px rgba(255,255,255,.2); box-sizing: border-box; transition: all .1s ease-in-out; -webkit-transition: all .1s ease-in-out; -ms-transition: all .1s ease-in-out;}
.curriculum li a:hover { border: solid 7px rgba(255,255,255,1)}
.curriculum li div { position: absolute; left: 9%; top: 20%;}
.curriculum li h3 { font-size: 23px; color: #333; letter-spacing: -0.05em;}
.curriculum li p { padding-top: 15px; font-size: 15px; color: #555; line-height: 1.7em; letter-spacing: -0.03em;}
/* 질문과 답변 */
.cs-wrap { margin: 100px 0 50px;}
.qna-box { position: relative; float: left; width: 320px;}
.qna-box .btn-more { position: absolute; top: 5px; right: 0; font-size: 13px; color: #939393;}
/* 작은롤링 */
.mini-rolling { float: left; width: 420px; padding-bottom: 30px; margin: 0 70px;}
/* 고객센터 */
.cs-center { float: left; width: 320px; text-align: center;}
.cs-center { display: table; margin: 0 auto;}
.cs-center li { float: left; margin: 0 10px;}
.cs-center li a { display: block; width: 140px; height: 180px; box-sizing: border-box; padding-top: 110px; font-size: 15px; font-weight: bold;}
.cs-center li.btn-cs-blog a { background: #39ac40 url('../image-renew/common/btn-quick-navertalk.png') no-repeat center 20px; color: #fff;}
.cs-center li.btn-cs-kakao a { background: #ffd334 url('image-renew/bg-cs-kakao.png') no-repeat center 30px; color: #3c1d1d;}
.cs-center .call-box p:nth-of-type(1) { margin-top: 40px; font-size: 14px; color: #7849d0;}
.cs-center .call-box p:nth-of-type(2) { margin-bottom: 15px; font-size: 37px; font-weight: 700;}
.cs-center .call-box a { display: inline-block; line-height: 36px; padding: 0 25px; border: solid 1px #aaa; font-size: 14px; color: #444;}
.cs-center .call-box a:hover { border: solid 1px #7953c0; background: #7953c0; color: #fff;}
/* 뉴스 */
.news-box li { float: left; width: 31.33%; margin: 0 1%; box-sizing: border-box; padding: 25px; border: solid 1px #ddd;}
.news-box li .img-box { overflow: hidden; max-width: 100%; height: 250px; border: solid 1px #dbdbdb; box-sizing: border-box;}
.news-box li .img-box i { display: block; height: 100%; transform: scale(1,1); transition: all 0.3s ease-out 0s;}
.news-box li .img-box:hover i { transform: scale(1.1,1.1);}
.news-box li a { display: block;}
.news-box li a .p-subject { padding-top: 25px; overflow: hidden; max-height: 50px; font-size: 18px; color: #222; letter-spacing: -0.03em; line-height: 1.4em;}
.news-box li a .p-con { padding: 15px 0; font-size: 14px; color: #555; letter-spacing: -0.03em; line-height: 1.7em;}
.news-box li a .p-date { font-size: 14px; color: #888; letter-spacing: -0.03em;}
/* 포트폴리오 */
.portfolio-wrap { position: relative;}
.portfolio-wrap .btn-more { position: absolute; top: 85px; right: 0; font-size: 13px; color: #939393;}
.portfolio-box li { float: left; width: 22%; margin: 0 1.5%; text-align: center;}
.portfolio-box li .img-box { overflow: hidden; max-width: 100%; height: 200px; border: solid 1px #dbdbdb; box-sizing: border-box;}
.portfolio-box li .img-box i { display: block; height: 100%; transform: scale(1,1); transition: all 0.3s ease-out 0s;}
.portfolio-box li .img-box:hover i { transform: scale(1.1,1.1);}
.portfolio-box li a { display: block;}
.portfolio-box li a .p-subject { padding-top: 15px; font-size: 16px; color: #333; letter-spacing: -0.03em; word-break: break-all; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.no-img { position: relative; width: 100%; height: 100%; background: #eee; text-align: center;}
.no-img span { position: absolute; top: 50%; left: 50%; color: #797979; font-weight: bold; font-size: 15px; letter-spacing: 0; text-transform: uppercase; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%);}
/* 게시판 */
.board-wrap { margin-top: 100px;}
.board-wrap > ul > li { position: relative; float: left; width: 29.33%; margin: 0 2%;}
.board-wrap .btn-more { position: absolute; top: 5px; right: 0; font-size: 13px; color: #939393;}
.qna-box li,
.board-wrap > ul > li li { margin-bottom: 8px; padding-left: 11px; background: url('image/ico_list_dot.gif') no-repeat left center;}
.qna-box li a,
.board-wrap > ul > li li a { font-size: 14px; color: #555; letter-spacing: -0.03em;}
.qna-box li a:hover,
.board-wrap > ul > li li a:hover { text-decoration: underline;}





/* ************************************** *
 * sub layout
 * ************************************** */
/* 컨텐츠영역 */
#container { z-index: 1; width: 100%; padding-top: 158px;}
#content { width: 1200px; min-height: 500px; margin: 0 auto;}
#content h2.h2_stle { padding: 60px 0 20px 0; margin-bottom: 40px; font-size: 38px; background:url('image/bg_stle_line.gif') no-repeat bottom center; font-weight: lighter; letter-spacing: -0.075em; text-align: center;}





/* ************************************** *
 * footer layout
 * ************************************** */
/* family-rolling */
.family-link-wrap { min-width: 1200px; width: 100%; padding: 15px 0; margin-top: 80px; background: #f1f1f1; border-top: 1px solid #3e3e3e;}
.family-rolling { padding: 0 40px; box-sizing: border-box; text-align: center;}
.family-rolling a { display: block;}
.family-rolling img { border-top: solid 1px #e6e6e6; border-right: solid 1px #bebebe; border-bottom: solid 1px #bebebe; border-left: solid 1px #e6e6e6; box-sizing: border-box;}
/* footer */
#footer { width: 100%; padding: 30px 0; border-top: 1px solid #d8d8d8; z-index: 20; letter-spacing: -0.03em;}
#footer .in-wrap { position: relative;}
#footer .foo-logo { float: left; margin: 5px 35px 0 0;}
#footer .foo-add { float: left;}
#footer .foo-links { margin-bottom: 10px;}
#footer .foo-links li { float: left; margin-right: 20px;}
#footer .foo-links li a { display: block; font-size: 15px; color: #333;}
#footer .foo-links li a:hover { text-decoration: underline;}
#footer address { font-size: 14px; color: #747474; line-height: 1.7em;}
#footer address span { margin-right: 20px;}
#footer address a { color: #7849d0;}
#footer .copyright small { font-size: 13px; color: #747474;}
#footer .btn-top { z-index: 50; position: absolute; top: 0; right: 0;}
#footer .btn-top a { font-size: 15px; font-weight: bold; color: #444;}
#footer .btn-top a:hover { position: relative; top: 1px;}
#footer .btn-top span { color: #9f8fe9;}
/* quick */
#quick { position: fixed; z-index: 500; bottom: 60px; right: 5%;}
#quick img { width: 70px;}
#quick li { margin: 10px 0;}

 /* footer_modal */
.policy_pop { padding:30px; text-align:left;}
.policy_pop h1, .emailReject_pop h1 { padding-bottom:20px; margin-bottom:30px; border-bottom:dotted 1px #333; font-weight:bold; font-size:20px; letter-spacing:-0.05em; text-align:center;}
.policy_pop .privacy_box { width:540px; height:320px; overflow-y:scroll;}
.policy_pop .privacy_box h2 { color:#7849d0; font-size:16px; font-weight:bold; letter-spacing:-0.05em; line-height:2.0em;} /* 포인트컬러변경 */
.policy_pop .privacy_box p { font-size:13px; color:#434343; letter-spacing:-0.05em; line-height:1.5em; padding-bottom:20px;}
.policy_pop .privacy_box .list li { padding:0 0 5px 0; color:#797979; font-size:13px; letter-spacing:-0.05em; line-height:1.4em;}

.emailReject_pop { padding:30px; text-align:left;}
.emailReject_pop .privacy_box { width:440px; height:120px;}
.emailReject_pop .privacy_box h2 { color:#910d40; font-size:16px; font-weight:bold; letter-spacing:-0.05em; line-height:2.0em;} /* 포인트컬러변경 */
.emailReject_pop .privacy_box p { font-size:13px; color:#434343; letter-spacing:-0.05em; line-height:1.5em; padding-bottom:20px;}

/* css3 버튼공통 */
.btn_comment_save input { display:inline-block; width:125px; height:32px; padding-left:20px; margin-top:-2px; border:0; font-size:13px; font-weight:bold; background:url('./image/btn_comment_save.gif') no-repeat; color:#2a2a2a; letter-spacing:-0.075em; vertical-align:middle;}

/* CSS 버튼 기본 */
.btn { font-weight:400; position:relative; display:inline-block; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; text-align:center; white-space:nowrap; border-width:1px; border-style:solid; border-color:transparent; background-image:none; -o-user-select:none;}
.btn { border-radius: 3px; min-width:34px;}
.btn.active, .btn:active { outline:0; background-image: none; -webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125); box-shadow:inset 0 3px 5px rgba(0,0,0,.125);}
.btn { -webkit-transition: all .1s ease-in-out; -moz-transition: all .1s ease-in-out; -ms-transition: all .1s ease-in-out; -o-transition: all .1s ease-in-out;}

/* CSS 버튼 크기 */
.btn_small { font-size:11px; padding:0 10px; line-height:20px; min-width:40px; height:22px;}
input.btn_small,
button.btn_small { font-size:11px; padding:0 10px; line-height:20px; min-width:40px; height:24px; vertical-align:top;}
.btn_medium { font-size:13px; padding:0 10px; line-height: 28px; height: 30px;}
input.btn_medium,
button.btn_medium { font-size:13px; padding:0 10px; line-height: 28px; height: 32px; vertical-align:top;}
.btn_large { font-size:14px; padding:0 20px; line-height:32px; height:34px;}
input.btn_large,
button.btn_large { font-size:14px; padding:0 20px; line-height:32px; height:36px; vertical-align:top;}
.btn_grand { font-size:16px; padding:0 16px; line-height:46px; min-width:100px; height:48px;}
input.btn_grand,
button.btn_grand { font-size:16px; padding:0 16px; line-height:46px; min-width:136px; height:48px; vertical-align:top;}

/* CSS 버튼 색상 */
.btn_white { font-weight:bold; border-color:#dee0e3; background:#fefeff; color:#727374;}

/* active 상태 속성 */
.btn_white.active,
.btn_white.disabled,
.btn_white.disabled.active,
.btn_white.disabled:active,
.btn_white.disabled:focus,
.btn_white.disabled:hover,
.btn_white:active,
.btn_white:focus,
.btn_white:hover,
.btn_white[disabled],
.btn_white[disabled].active,
.btn_white[disabled]:active,
.btn_white[disabled]:focus,
.btn_white[disabled]:hover{ color:#2b2f33; border-color:#bfc8d1; background:#f3f3f9;}