@charset "utf-8";

/*
 * --------------------------------------------------------------------------
 * descript : 레이아웃
 * --------------------------------------------------------------------------
 * version	: 2.0.0
 * author	: Park HyeonJeong
 * update	: 2019.01.13
 * --------------------------------------------------------------------------
 */

 /*
 * ==========================================================================
 * Table of Contents
 * ==========================================================================
 * 1.0 - 전체 프로젝트에 필요한 클래스(#wrap, .inner, .full, #main-container, #sub-container 등)
 * 2.0 - 해더
 * 3.0 - 서브 비주얼
 * 4.0 - 페이지 네비게이션
 * 5.0 - 풋터
 * 6.0 - 공통(진료시간, 고객센터, 오시는길)
 * --------------------------------------------------------------------------
 */

/* --------------------------------------------------------------------------
   1.0 전체 프로젝트에 필요한 클래스(#wrap, .inner, .full, #main-container, #sub-container 등)
   -------------------------------------------------------------------------- */
body{font-family:'Noto Sans KR','NanumSquare', sans-serif; font-size:13px; line-height:1; letter-spacing:-0.2px; font-weight:100;}

#wrap{position:relative; width:100%; min-width:320px;}

#main-container{}
#sub-container{min-height:300px;}

.full{position:relative; width:100%; height:inherit; box-sizing:border-box;}
.inner{position:relative; width:100%; max-width:1400px; height:inherit; margin:0 auto;  box-sizing:border-box;}
.automation{position:relative; width:100%; height:inherit; box-sizing:border-box; text-align:center;}


a:hover{text-decoration:none;}
/**::before{position:absolute; display:none; content:'';}
*::after{position:absolute; display:none; content:'';}*/

html {color:#fff; min-height:100%;background:url(/assets/img/web/bak_body.jpg) no-repeat 50% 50% fixed #000; background-size:cover;}
html[data-menu-1st="ABOUT"] {background-image:url(/assets/img/web/sub/bak_body_about.jpg);}
html[data-menu-1st="WORKS"] {background-image:url(/assets/img/web/sub/bak_body_works.jpg);}

*[class^='ico-']:before {content:""; display:inline-block; width:19px; height:17px; vertical-align:middle; background:no-repeat 50% 50%; background-size:contain; margin-right:10px;}
*.ico-fax:before {background-image:url(/assets/img/web/ico_contact_01.png);}
*.ico-tel:before {background-image:url(/assets/img/web/ico_contact_02.png);}
*.ico-mail:before {background-image:url(/assets/img/web/ico_contact_03.png);}

/* --------------------------------------------------------------------------
   2.0 해더
   -------------------------------------------------------------------------- */

#header {position:relative; height:110px; -webkit-transition: all .3s; transition: all .3s; z-index:10;}
#header.over {background:#404041;}
#header.open {position:fixed; top:0; left:0; right:0; background:#d72c33; height:auto; bottom:0; z-index:30;}
#logo {position:absolute; top:40px; left:40px; z-index:10;}
#logo .open-logo {display:none;}
.open #logo {display:none;}
.over #logo .open-logo {display:inline;}
.over #logo .close-logo {display:none;}

#btn_gnb {position:absolute; top:29px; left:50%; margin-left:-44px; width:88px; height:52px; background:url(/assets/img/web/ico_gnb_none.png) no-repeat 50% 50%; overflow:hidden; text-indent:-999px; -webkit-transition: all .3s; transition: all .3s; z-index:1;}
.over #btn_gnb {background-image:url(/assets/img/web/ico_gnb_over.png);}
.open #btn_gnb {background-image:url(/assets/img/web/ico_gnb_close.png);}
#gnb {position:relative; padding-top:110px;}
.open #gnb {height:100%; box-sizing:border-box;}
#gnb_detail {display:none; position:relative; max-width:1290px; height:100%; margin:0 auto; font-family:'NanumSquare';}
.open #gnb_detail {display:block;}
#gnb_detail .frame {display:table; position:absolute; table-layout:fixed; width:100%; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); z-index:0;}
#gnb_detail  .frame > * {display:table-cell; vertical-align:top; padding: 10px; box-sizing:border-box;}

.gnb + .gnb {padding-top:40px;}
.gnb li + li, .gnb .lnb {padding-top:20px;}
.gnb a {display:inline-block; position:relative; color:#fff; font-weight:100;}
.gnb span {display:inline-block; position:relative;}
.gnb > a {font-size:70px;}
.gnb .lnb > a {font-size:50px; font-weight:600;}

.gnb .lnb span:before {content:""; display:block; position:absolute; left:-5px; height:12px; top:50%; margin-top:-6px; background:url(/assets/img/web/img_over_gnb.png) no-repeat 100% 50%; width:0px; -webkit-transition: all .3s; transition: all .3s;}
.gnb .lnb a:hover > span:before {width:100%; padding-right:25px; }
.gnb .lnb a > span:after {content:""; display:none; position:absolute; line-height:2.5em; white-space:nowrap; font-size:25px; top:0; left:100%; margin-left:35px; color:#DC1C24; -webkit-text-shadow:2px 2px 0 #323132, 2px -2px 0 #323132, -2px 2px 0 #323132, -2px -2px 0 #323132, 2px 0px 0 #323132, 0px 2px 0 #323132, -2px 0px 0 #323132, 0px -2px 0 #323132, 2px 2px 2px #323132; text-shadow:2px 2px 0 #323132, 2px -2px 0 #323132, -2px 2px 0 #323132, -2px -2px 0 #323132, 2px 0px 0 #323132, 0px 2px 0 #323132, -2px 0px 0 #323132, 0px -2px 0 #323132, 2px 2px 2px #323132; -webkit-transition: all .3s; transition: all .3s;}
.gnb .lnb a:hover > span:after {display:block;}
.gnb .lnb a[data-text*="OVERVIEW"]:hover > span:after {content:"지에이오앤";}
.gnb .lnb a[data-text*="OUR PARTNERS"]:hover > span:after {content:"협력업체";}
.gnb .lnb a[data-text*="HISTORY OF PROJECT"]:hover > span:after {content:"시공실적";}
.gnb .lnb a[data-text*="PORTFOLIO"]:hover > span:after {content:"포트폴리오";}
#gnb_info {width:42.32%;}
#gnb_info .section + .section {padding-top:70px;}
#gnb_info .title {font-size:70px; font-weight:100;}
#gnb_info .title img {max-height:70px;}
#gnb_info .txt {font-size:20px; padding-top:30px; font-weight:100; line-height:1.5; font-family:'Noto Sans KR';}
#gnb_info a { color:#fff;}

.body-content {overflow:hidden;}

@media all and (max-width:1200px) {
	.gnb > a {font-size:50px;}
	#gnb_info .txt {font-size:15px;}
	#gnb_info .title {font-size:50px;}
	#gnb_info .title img {max-height:51px;}
	#gnb_info .section + .section {padding-top:50px;}
	.gnb .lnb > a {font-size:40px;}
	.gnb .lnb a > span:after {font-size:20px;}
}
@media all and (max-width:1000px) {
	#gnb_detail .frame {display:block; position:relative; top:auto; -webkit-transform:translateY(0); transform:translateY(0); height:100%; overflow:auto;}
	#gnb_detail .frame > * {display:block; width:auto;}
	#gnb_detail .frame #gnb_list {width:100%; overflow:hidden;}
	#gnb_detail .frame #gnb_info {display:table; padding:50px 0; width:100%; table-layout:fixed;}
	#gnb_detail .frame #gnb_info .section {display:table-cell; width:50%; padding:0 10px; box-sizing:border-box;}
	#gnb_detail .frame #gnb_info .txt p {word-break:keep-all;}
}

@media all and (max-width:640px){
	#logo {left:10px; top:50%; max-width:33.33%; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
	#gnb {padding-top:70px;}
	#header {height:70px;}
	#btn_gnb {top:10px; left:auto; right:10px; margin-left:0;}

	.gnb > a {font-size:30px;}
	#gnb_info .txt {font-size:15px;}
	#gnb_info .title {font-size:30px;}
	#gnb_info .title img {max-height:30px;}
	#gnb_info .section + .section {padding-top:30px;}
	.gnb .lnb > a {font-size:25px;}
	.gnb .lnb a > span:after {display:none !important;}
}
@media all and (max-width:400px){
	#gnb_detail .frame #gnb_info,
	#gnb_detail .frame #gnb_info .section {display:block; width:auto;}
	#gnb_detail .frame #gnb_info .section {padding:10px;}
	#gnb_detail .frame #gnb_info .section + .section {padding-top:25px;}
	#gnb_detail .frame #gnb_info .section .txt {padding-top:10px;}
}

/* --------------------------------------------------------------------------
   5.0 푸터
   -------------------------------------------------------------------------- */

#footer {text-align:center; color:#404041; font-size:14px; line-height:1.8; padding-bottom:50px; opacity:0; -webkit-transition: .4s; transition: .4s;}
#sub-container[style] + #footer {opacity:1;}
#footer a {color:#404041;}
#footer .footer-info span {display:inline-block; position:relative; vertical-align:middle; padding:0 10px;}
#footer .footer-info span + span:before {content:""; display:block; position:absolute; top:50%; left:0; margin-top:-4px; width:1px; height:8px; background:#404041;}
#footer .footer-info span em:after {content:" : ";}

/* --------------------------------------------------------------------------
   6.0 공통 (퀵 메뉴)
   -------------------------------------------------------------------------- */
#quick-customer {position:fixed; top:0; bottom:0; right:0; width:0; background:#404041; -webkit-transition: all .3s; transition: all .3s; z-index:20;}
#quick-customer.open {width:350px;}
#quick-customer:before {content:""; display:block; position:absolute; top:0; bottom:0; left:0; width:1px; background:#ec1c24; z-index:0;}
#quick-customer .toggle-quick {display:block; position:absolute; left:-44px; top:50%; margin-top:-105px; width:45px; height:210px; background:url(/assets/img/web/btn_quick_off.png) no-repeat 100% 50%; background-size:contain; z-index:1;}
#quick-customer.open .toggle-quick {background-image:url(/assets/img/web/btn_quick_on.png);}
#quick_customer_form {display:table; width:350px; height:100%; overflow:auto;}
#quick_customer_form .inner {display:table-cell; padding:30px; vertical-align:middle;}
#quick_customer_form h3 {font-weight:100; font-family:'NanumSquare'; font-size:35px; color:#ec1c24;}
#quick_customer_form * + h3 {padding-top:25px;}
#quick_customer_form p {font-size:13px; font-weight:100; line-height:1.4; padding-top:10px; margin-right:-10px;}
#quick_customer_form fieldset {padding: 7px 0;}
#quick_customer_form fieldset.radio-box {padding:20px 0;}
#quick_customer_form input[type="radio"] {display:none;}
#quick_customer_form input[type="radio"] + label {display:inline-block; position:relative; min-width:83px; padding:5px 0 5px 20px; vertical-align:middle; box-sizing:border-box; cursor:pointer;}
#quick_customer_form input[type="radio"] + label:before {content:""; display:block; position:absolute; width:14px; height:14px; box-sizing:border-box; border:1px solid #fff; border-radius:100%; top:50%; margin-top:-7px; left:0;}
#quick_customer_form input[type="radio"] + label:after {content:""; display:none; position:absolute; width:8px; height:8px; background:#ec1c24; left:3px; top:50%; margin-top:-4px; border-radius:100%;}
#quick_customer_form input[type="radio"]:checked + label:after {display:block;}
#quick_customer_form input[type="text"],
#quick_customer_form textarea {display:block; width:100%; font-size:12px; color:#000; box-sizing:border-box; background:#fff; resize:none; font-family:'Noto Sans KR','NanumSquare', sans-serif;}
#quick_customer_form input[type="text"] {height:30px; padding:0 15px;}
#quick_customer_form textarea {padding:15px; height:150px;}
#quick_customer_form input::placeholder,
#quick_customer_form textarea::placeholder {font-size:12px; color:#969696; font-family:'Noto Sans KR','NanumSquare', sans-serif;}
#quick_customer_form .jfilestyle {position:relative; padding-right:80px; box-sizing:border-box;}
#quick_customer_form .jfilestyle input[type="text"] {width:100% !important;}
#quick_customer_form .jfilestyle .focus-jfilestyle  {position:absolute; width:80px; top:0; right:0; bottom:0; background:#c8c8c8; font-size:10px; color:#000; text-align:center; cursor:pointer;}
#quick_customer_form div.jfilestyle label {height:auto; line-height:30px; color:#000; background:#c8c8c8; font-size:10px;}
#quick_customer_form .jfilestyle .focus-jfilestyle * {cursor:pointer;}
#quick_customer_form button {display:block; height:30px; text-align:center; width:100%; background:#ec1c24; color:#fff; cursor:pointer; font-size:13px;}
#quick_customer_form button.kakao {background:#f3c811; color:#2d1e0a; font-weight:600;}
#quick_customer_form .txt p {font-size:15px;}

@media all and (max-width:640px) {
	#quick-customer .toggle-quick {width:30px; height:145px; margin-top:-72px; left:-29px;}
}
@media all and (max-width:395px) {
	#quick-customer.open {width:290px;}
	#quick_customer_form {width:290px;}
	#quick_customer_form .inner {padding:20px;}
}
@media all and (max-height:850px) {
	#quick_customer_form {display:block;}
	#quick_customer_form .inner {display:block; height:auto;}
}