@charset "utf-8";

body{margin: 0; padding: 0; background-size: cover; background-position:center; font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important;}

/* login page */
body#login {overflow:hidden; font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important;}
/*.avatar{width: 100px; height: 100px; border-radius: 50%; position: absolute; top: -50px; left: calc(50% - 50 px);}*/
.avatar{width: auto; position: absolute; top: -50px; left: 20px;}
h1{margin: 0; padding: 0 0 20px; text-align: center; font-size: 22px;}
.login-box{width: 320px; height: 480px; background: rgba(0, 0, 0, 0.7); color: #fff; top: 50%; left:50%; position:absolute; transform: translate(-50%, -50%); box-sizing: border-box; padding: 70px 30px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.17); border-radius: 15px; font-size: 22px !important;}
.login-box h1 {font-size: 22px !important; margin-top:0px !important;}
.login-box p{margin: 0; padding: 0;}
.login-box input{width: 100%; margin-bottom: 20px;}
.login-box input[type="text"], input[type="password"] {border: none; border-bottom: 1 px solid #fff; background: transparent; outline: none; height: 40px; color: #fff; font-size: 16px;}
.login-box input[type="submit"] {border: none; outline: none; height: 40px; background: #1c8adb; color: #fff; font-size: 18px; border-radius: 20px;}
.login-box input[type="submit"]:hover {cursor: pointer; background: #c81b14; color: #fff;}
.login-box a{text-decoration: none; font-size: 14px; color: #fff;}
.login-box a:hover {color: #39dc79;}
.img_title {position:absolute; top:27px; left:30px; z-index:10;}

/* main page */
.jbTitle {text-align: center;}
.jbMenu {text-align: center; background-color: yellow; padding: 30px 0px; width: 100%;}
.jbFixed {position: fixed; top: 0px; right: 0; left: 0; box-shadow: 0 0 6px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.20);}

.com_tit {width: 100%; position: relative; height: 120px; overflow: hidden;}
.com_tit .bg {width: 100%; height: 120px;position: relative; display: block; background-image: linear-gradient(to right,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);}
.com_tit .ps {position: absolute; top: -150px; left: 50%; margin-left: -960px; z-index: 1; animation: topBg 3s;}
@keyframes topBg {0%{ transform: scale(1.2);}100%{transform: scale(1);}}
.img_tel {position:absolute; top:0px; right:0px; z-index:10;}

.top_wrap {height:280px;}

.user_tit {background: url(../img/Main/main_bg.gif) repeat-x 0px -100px; height:100px; z-index: 10;}
.user_info {position: relative; margin: 0 auto; width: 1270px; padding-top: 20px;}
.user_info ul {overflow:hidden; margin: 0; background: rgba(255,255,255,.8); height: 60px; line-height: 60px;}
.user_info ul li {float:left; font-size: 25px; text-align:center;}
.bgbro  {background: #a29382; color:#fff; width:10%;}

.content_wrap {margin-bottom: 73px;}

.option {position: relative; margin: 0 auto; width: 1270px; padding-top: 50px; overflow:hidden;}

.l-cho {width:70%; float:left;}
.l-cho .cho_form {width: 100%; font-size:12px; }
.l-cho .cho_form > thead > tr > th {font-size:13px; color:#9b867a; font-weight:500; background:#faf9f5; text-align:center; padding:10px 0; border: 1px solid #aa9c8e; border-top: 2px solid #aa9c8e; border-bottom: 2px solid #aa9c8e; border-left: 0;}
.l-cho .cho_form > thead > tr > th:last-child {border-right: 0;}
.l-cho .cho_form > tbody {border-bottom: 2px solid #aa9c8e;}
.l-cho .cho_form > tbody > tr > th, .l-cho .cho_form > tbody > tr > td {border: 1px solid #aa9c8e; height:40px; line-height:20px; background: #fff;}
.l-cho .cho_form > tbody > tr > th {padding: 0px; background: #faf9f5; font-size: 12px; color: #000; text-align: center; font-weight:normal; border-left: 0;}
.l-cho .cho_form > tbody > tr > td {color:#000;}
.l-cho .cho_form > tbody > tr > td:last-child {border-right:0px;}
.l-cho .cho_form > tbody > tr > td {text-align:center;}
.prt_btn { margin-top: 20px; text-align: center; width: 100%; clear: both; display: inline-block;}
.prt_btn a {font-size: 18px; color:#fff; display:inline-block; border: 1px solid #333; height:60px; line-height:60px; background: #333; width:30%;}

.input_rdo, .input_chk {display: inline-block; position: relative; font-size: 16px; cursor: pointer;}
.input_rdo input, .input_chk input {position: absolute; top: 0; padding: 0; margin: 0; width: 20px; height: 20px; appearance: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; opacity: 0;}
.input_rdo i, .input_chk i {padding-left: 22px; font-style: normal;}
.input_rdo i:before, .input_rdo i:after, .input_chk i:before, .input_chk i:after {position: absolute;}
.input_rdo i:before, .input_chk i:before {content: ''; top: 0; left: 0; width: 20px; height: 20px; border: 1px solid #999; background: #fff;}
.input_rdo i:before {border-radius: 100%;}
.input_chk input:checked + i:after {content: ''; width: 12px; height: 6px; top: 5px; left: 4px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg);}
.input_chk input:checked + i:before {background: #e32c51; border-color: #e32c51;}
.input_rdo input:checked + i:after {content: ''; top: 5px; left: 5px; width: 10px; height: 10px; margin: auto; background: #e32c51; border-radius: 100%;}
.input_rdo input:disabled + i, .input_chk input:disabled + i {cursor: default;}
.input_chk input:disabled + i:before {opacity: 0.2; background-color: #ddd; border-color: #333;}
.input_chk input:disabled:checked + i:before {opacity: 0.2; background-color: #333; border-color: #333;}

.r-con {width:27%; float:right; margin-top: 18px; height:auto; position: absolute; right: 0; bottom: 0; top: 50px;}
.user_set {position: absolute; top: 0;}
.user_set .cho_form {width: 100%; font-size:12px; overflow:hidden; overflow-y:auto; max-height:473px; display: inline-block; border-right: 1px solid #3c3937;}
.user_set .cho_form > thead > tr > th {font-size: 14px; color: #fff; font-weight: 500; background: url(../img/Main/cho_bg.jpg) repeat-x 0px 0px; text-align: center; padding: 20px 0; border: 1px solid #3c3937;}
.user_set .cho_form > tbody > tr > th, .user_set .cho_form > tbody > tr > td {border: 1px solid #3c3937; height:40px; line-height:20px; background: #fff;}
.user_set .cho_form > tbody > tr > th {padding: 0px;background: #faf9f5; font-size: 12px; color: #000; text-align: center; font-weight:normal;}
.user_set .cho_form > tbody > tr > td {color:#000; text-align:left; padding-left:10px;}
.user_set .cho_form > tbody > tr > td:last-child {border-right:0;}
.user_set .cho_form > tfoot > tr > th, .user_set .cho_form > tfoot > tr > td {border: 1px solid #3c3937; height:40px; line-height:20px; background: #fff;}
.user_set .cho_form > tfoot > tr > th {padding: 0px;background: #faf9f5; font-size: 12px; color: #000; text-align: center; font-weight:normal;}
.user_set .cho_form > tfoot > tr > td {color:#000; font-size: 14px;}
.user_set .cho_form > tfoot > tr > td span {font-size: 16px;}
.user_set .cho_form > tfoot > tr > td {text-align:center;}

.orderFixed {position: fixed; top: 110px; width:343px; box-shadow: 0 0 6px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.20);}
.cho_tit {font-size: 14px; color: #fff; font-weight: 500; background: url(../img/Main/cho_bg.jpg) repeat-x 0px 0px; text-align: center; padding: 20px 0; border: 1px solid #3c3937;}
.cho_foot {font-size: 14px; border: 1px solid #3c3937; height:40px; line-height:40px; background: #faf9f5;color:#000; margin-top: -4px; text-align:center;}
.cho_foot span {font-size: 16px;}
.foot_btn {border: 1px solid #a29382; height:50px; line-height:50px; background: #a29382; margin-top:5px; text-align:center;}
.foot_btn a {font-size: 18px; color:#fff; display:block;}

.footer-wrap {padding: 16px 0px 16px; height: 118px; width: 100%; background-color: #000; position: relative;}
.footer-wrap img {margin-left: 40px; display: inline-block;}


.l-cho .sign_form {width: 100%; font-size:12px; }
.l-cho .sign_form > thead > tr > th {font-size:13px; color:#9b867a; font-weight:500; background:#faf9f5; text-align:center; padding:10px 0; border: 1px solid #aa9c8e; border-top: 2px solid #aa9c8e; border-bottom: 2px solid #aa9c8e; border-left: 0;}
.l-cho .sign_form > thead > tr > th:last-child {border-right: 0;}
.l-cho .sign_form > tbody > tr > th, .l-cho .sign_form > tbody > tr > td {border: 1px solid #aa9c8e; height:40px; line-height:20px; background: #fff;}
.l-cho .sign_form > tbody > tr > th {padding: 0px; background: #faf9f5; font-size: 12px; color: #000; text-align: center; font-weight:normal;}
.l-cho .sign_form > tbody > tr > td {color:#000; text-align:center;}

.l-cho .signin_form {width: 100%; font-size:14px; margin-top:20px;}
.l-cho .signin_form > tbody > tr > th, .l-cho .signin_form > tbody > tr > td {border: 0px solid #aa9c8e; height:40px; line-height:20px; background: #fff;}
.l-cho .signin_form > tbody > tr > th {padding: 0px; background: #faf9f5; font-size: 12px; color: #000; text-align: center; font-weight:normal;}
.l-cho .signin_form > tbody > tr > td {color:#000; text-align:center;}

.l-cho .signfo_form {width: 100%; font-size:12px; margin-top:20px;}
.l-cho .signfo_form > tbody > tr > th, .l-cho .signin_form > tbody > tr > td {border: 0px solid #aa9c8e; height:40px; line-height:20px; background: #fff;}
.l-cho .signfo_form > tbody > tr > th {padding: 0px; background: #faf9f5; font-size: 12px; color: #000; text-align: center; font-weight:normal;}
.l-cho .signfo_form > tbody > tr > td {color:#000; text-align:left;}

.user_rich {padding: 10px; background: #fff; border-radius: 10px; margin-top: 10px}
.user_rich p {}
.user_rich p a {color: #333; font-size: 18px; line-height: 50px; display: block; padding-left:30px;}
.user_rich p a .fa-building {}
.user_rich p a .fa-angle-double-right {padding-left:10px;}
.user_rich p a:hover {color: #fff; background:#a29382; text-decoration:none; border-radius: 10px;}

.logout {position:absolute; right: -100px; top: 40px;}
.logout a {padding: 10px 20px; border-radius: 10px; background: #333; color:#fff;}


/* login */
.gray-bg {background-color: #f3f3f4;}
.middle-box {height: 400px; width: 300px; position: absolute; top: 50%; left: 50%; margin-top: -250px; margin-left: -150px; z-index: 100; text-align:center;  font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important;}
.login-ttl {margin-top: 20px; font-size: 26px; font-weight: 600; margin-bottom: 10px; font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important; letter-spacing:-1px;}
.form-group {margin-bottom: 15px;}
.form-con {background-color: #fff; background-image: none; border: 1px solid #e5e6e7; border-radius: 1px; color: inherit; display: block; padding: 6px 12px; transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s; width: 100%; font-size: 14px; line-height: 1.42857143; height: 38px; font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important;}
.form-con:focus {border-color: #66afe9;}
.btn-primary {background-color: #3498DB; border-color: #258CD1; color: #fff; font-weight: normal; text-align: center; vertical-align: middle; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; padding: 8px 14px; font-size: 14px; line-height: 1.42857143; border-radius: 3px; margin-bottom: 15px; display: block; font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important;}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {background-color: #217DBB; border-color: #1C699D; color: #fff; font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important;}
.btn-sm {color: inherit; border: 1px solid #d2d2d2;background: #fff;border-radius: 3px;padding: 5px 10px; font-size: 12px; line-height: 1.5;display: block; width: 100%;margin-bottom: 0; font-weight: normal; text-align: center; vertical-align: middle; touch-action: manipulation; cursor: pointer; font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important;}
.text-muted {color: #888; font-family: "Noto Sans CJK KR", "Noto Sans KR", 'Noto Sans EOT', SimHei, Sans-serif !important;}
.fg-se {font-size:14px; color:#3498db; margin-bottom: 10px; display: block;}
.fg-se:hover {color:#1d6fa5;}

.login-box input.input_login{
  background-color: #f6f6f6;
  border: none;
  color: #0d0d0d;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 5px;
  width: 85%;
  border: 2px solid #f6f6f6;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;
  box-sizing:border-box;
  width:100%;
  height:auto;
}

.login-box .input_login:focus{
  background-color: #fff;
  border-bottom: 2px solid #3f51b5;
}


input[type=text]:placeholder ,input[type=password]:placeholder{
  color: #cccccc;
}

.btn_login{
	background-color:#3f51b5;
	width:50%;
	margin:0 auto;
}
/* ============================================================
   업성 푸르지오 레이크시티 추가분
   퍼스티어 레이아웃을 그대로 쓰되, 이 현장에만 필요한 것만 덧붙인다.
   ============================================================ */

/* 로고 이미지가 준비되기 전까지 글자로 대신한다 */
.img_title .txt_logo {color:#fff; font-size:26px; font-weight:700; letter-spacing:-1px; text-shadow:0 2px 6px rgba(0,0,0,.5); line-height:1.2;}
.img_title .txt_logo small {display:block; font-size:13px; font-weight:400; letter-spacing:0; opacity:.9;}
body#login .img_title .txt_logo {text-align:left;}

/* 로그인 화면 배경 (비주얼 이미지가 없을 때) */
body#login {background:#2b2724 url(../img/Main/main_bg.gif) repeat; }
body#login .carousel-inner {position:fixed; top:0; left:0; width:100%; height:100%;
  background:linear-gradient(135deg, #3a342e 0%, #1d1a17 100%);}

/* 견적 안내 문구 */
.notice_box {border:1px solid #aa9c8e; background:#faf9f5; padding:14px 18px; margin-bottom:14px; font-size:13px; line-height:1.7; color:#5b5149;}
.notice_box strong {color:#a2321f;}

/* 그룹 하단 유의사항 */
.l-cho .grp_note {font-size:12px; color:#7a736b; padding:8px 10px 14px; line-height:1.7;}

/* 비활성 항목 */
.l-cho .cho_form > tbody > tr.off > td {background:#f4f2ef; color:#b3aba2;}
.l-cho .cho_form > tbody > tr.on > td {background:#fbf7ef;}
.l-cho .cho_form td.tal {text-align:left; padding-left:10px;}
.l-cho .cho_form td.tar {text-align:right; padding-right:10px;}
.l-cho .cho_form td.rmk {text-align:left; padding-left:8px; font-size:11px; color:#7a736b;}

/* 우측 선택품목 패널
   .user_set 은 절대배치라 폭을 주지 않으면 내용만큼만 줄어든다.
   내부 표도 inline-block 이면 같은 일이 생겨 첫 화면에서만 좁게 나온다. */
.r-con .user_set {width:100%;}
.user_set .cho_form {display:table; width:100%; max-height:none; overflow:visible; border-right:0;}
.pick_wrap {max-height:380px; overflow-y:auto; background:#fff; border:1px solid #3c3937; border-top:0;}
.pick_wrap .cho_form > tbody > tr > th,
.pick_wrap .cho_form > tbody > tr > td {border-left:0; border-right:0;}
.pick_wrap .cho_form > tbody > tr > td.pick_empty {text-align:center; padding:26px 10px; color:#7a736b;}
.orderFixed {top:16px;}

/* 저장 실패했을 때만 보인다 */
.save_err {display:none; font-size:12px; color:#a8342a; line-height:1.6; margin:8px 2px 0;}

/* 그룹 유의사항 — 표 안에 넣으면 rowspan 과 어긋나므로 표 아래에 따로 둔다 */
.note_list {border:1px solid #aa9c8e; border-top:0; background:#faf9f5; padding:14px 18px;
            font-size:12px; color:#5b5149; line-height:1.8;}
.note_list dt {font-weight:600; color:#9b867a; margin-top:10px;}
.note_list dt:first-of-type {margin-top:0;}
.note_list dd {margin:0 0 2px 0;}

/* 비고 열은 줄바꿈을 허용해 폭을 넓게 쓴다 */
.l-cho .cho_form td.rmk {font-size:12px; line-height:1.6; word-break:keep-all; white-space:normal;}

/* 우측 선택품목 */
.user_set .cho_form > tbody > tr > td.pick_nm {font-size:12px; line-height:1.5; padding:6px 10px;}
.user_set .cho_form > tbody > tr > td.pick_pr {text-align:right; padding-right:10px; white-space:nowrap;}
.cho_foot.total {background:#a29382; color:#fff; font-size:15px;}
.cho_foot.total span {font-size:18px; font-weight:700;}

/* 견적서 (미리보기 · 인쇄) */
.quote_head {text-align:center; padding:10px 0 18px;}
.quote_head h2 {font-size:26px; margin:0 0 6px; letter-spacing:-1px;}
.quote_head p {margin:0; font-size:13px; color:#5b5149;}
.quote_disc {border:1px solid #c9a24d; background:#fdf8ec; color:#7a5c14; padding:10px 14px; font-size:13px; text-align:center; margin-bottom:16px;}
.quote_info {width:100%; font-size:13px; margin-bottom:14px;}
.quote_info th {background:#faf9f5; border:1px solid #aa9c8e; height:36px; width:14%; font-weight:500;}
.quote_info td {border:1px solid #aa9c8e; height:36px; text-align:center;}
.quote_sum {width:100%; font-size:14px; margin-top:14px;}
.quote_sum th {background:#faf9f5; border:1px solid #aa9c8e; height:44px; width:34%;}
.quote_sum td {border:1px solid #aa9c8e; height:44px; text-align:right; padding-right:14px; font-weight:700;}

@media print {
  .top_wrap, .r-con, .prt_btn, .notice_box, .logout {display:none !important;}
  .l-cho {width:100% !important; float:none !important;}
  .option {width:100% !important; padding-top:0 !important;}
}