@charset "utf-8";
.topArea { position:relative; background:#000;  z-index:1;}
.topArea .bx-wrapper { position:relative; z-index:1;}
.topLogo { position:absolute; width:30.4%; max-width:580px; left:50%; top:46%; margin:-15.2% 0 0 -15.2%; z-index:5; }
.topLogo img { position:absolute; left:0; top:0; opacity:0; filter: alpha(opacity=0;); }
.topTitle { position:absolute; width:39.6%; max-width:760px; left:50%; top:50%; margin:-15.1% 0 0 -19.8%; z-index:5; -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; }
.topTitle .topTitle01, .topTitle .topTitle02, .topTitle .topTitle_cycle { position:absolute; left:0; top:0; width:100%; vertical-align:top; opacity:0; filter: alpha(opacity=0;); }
.topTitle02{left:20px;}
.main .topLink { top:auto; bottom:12%;}
.topLink { position:absolute; width:100%; left:0; top:60%; text-align:center; z-index:5; -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;}
.topLink li { display:inline; margin:0 20px; }
.topLink li a { display:inline-block; color:#fff; font-size:18px; line-height:30px; padding-right:40px; background:url(../images/common/link_arrow.png) right 0 no-repeat;}
.topLink li a:hover, .topLink li a:focus {background-position:right bottom;}
.topLink li span { font-weight:700;}
.pageTitle {background:url(../images/common/patten_01.gif); padding:80px 0; text-align:center; font-size:15px; line-height:1.35em; color:#fff; font-weight:300; }
.pageTitle div { display:block; margin-bottom:2%; }
.pageTitle div img { width:76%; max-width:600px; vertical-align:top;}
.pageTitle a { display:inline-block; margin:0 3px; color:#fff;}
.pageTitle a span { font-weight:700; }
.pageTitle .dot { display:inline-block; width:4px; height:2px; vertical-align:middle; background:#fff;}

/*.effect1,.effect2, .effect3,*/
 .effect4 {opacity:0;}

/* 2021 tit txt */
#wrap.sub .wrapper {line-height:normal;}
#contents .top .wrapper {
	padding-top:280px;
}

.tit1 {
	font-size: 60px;
	letter-spacing: -0.24px;
	font-family: 'Noto Sans CJK KR';
	font-weight:700;
	margin-bottom:20px;
	color:#000;
	line-height:normal;
}
.tit2 {
	font-size: 72px;
	letter-spacing: -0.24px;
	font-family: 'Noto Sans CJK KR';
	font-weight:700;
	color:#000;
	margin-bottom:50px;
}
#wrap.sub .tit3 {
	font-size:22px;
	letter-spacing: -0.24px;
	font-family: 'Noto Sans CJK KR';
	font-weight:400;
	color:#a40000;
	margin-bottom:150px;
}
.tit4 {
	font-size:30px;
	font-weight:700;
	letter-spacing:-0.15px;
	color:#000;
	margin-bottom:20px;
	font-family: 'Noto Sans CJK KR';
}
.tit4_1 {
	font-size:18px;
	font-weight:400;
	letter-spacing:-0.15px;
	color:#000;
	margin-bottom:20px;
	font-family: 'Noto Sans CJK KR';
	line-height:1.3;
}
/* 2021 tit txt end */

.conArea { /*background:url(../images/common/con_bg.jpg) center top repeat;*/  }
.listNav { text-align:center; margin:5.5% 0;}
.listNav li { display:inline; padding:0 20px 0 26px; background:url(../images/common/listNav_dot.gif) left 6px no-repeat;}
.listNav li:first-child {padding-left:20px; background:none;}
.listNav li a { display:inline-block; color:#898b8a; font-size:18px; line-height:30px;-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;}
.listNav li a:hover, .listNav li a:focus { color:#ad1a1a; }
.listNav li.active a { color:#000;}
.listNav li span { font-weight:700;}

.title_line { display:block; width:15px; margin:0 auto 35px;}
.title_line .line {display:inline-block; width:1px; height:80px; background:#000; margin:0 0 20px 7px;}
.title_line .dotRed {display:inline-block; width:7px; height:7px; border:4px solid #f63c3c; border-radius:100%; vertical-align:middle; margin:0 !important;}

.portfolio_list { width:96%; max-width:1820px; margin:0 auto; }
.portfolio_list:after {content:"";display:block;clear:both;}
.portfolio_list li { float:left; display:inline-block; width:23%; padding:0 1% 5%; text-align:center;}
.portfolio_list li span { display:block;}
.portfolio_list .portfolio_img { position:relative;}
.portfolio_list .portfolio_img01 { width:97.72%;background-image:url(../images/portfolio/list_bg01.png); background-repeat:no-repeat; background-size:100% }
.portfolio_list .portfolio_img01 img { width:89.07%; vertical-align:top; padding:4.2% 6.7% 30.4% 4.2%;}
.portfolio_list .portfolio_img02 { position:absolute; width:31.17%; background-image:url(../images/portfolio/list_bg02.png);background-repeat:no-repeat; background-size:100% auto; right:0; bottom:6%; z-index:5;}
.portfolio_list .portfolio_img02 img { width:68.87%; vertical-align:top; padding: 15.1% 12.3% 68.8% 18.9%;} 
.portfolio_list a { display:block; color:#666; font-size:14px; line-height:20px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.portfolio_list li a:hover, .portfolio_list li a:focus { transform:scale(1.05);-webkit-transform:scale(1.05);-moz-transform:scale(1.05);-o-transform:scale(1.05);}

.portfolio_more { padding:5% 0; text-align:center;}
.portfolio_more a { display:inline-block; font-size:15px; line-height:1.3em; color:#9fa1a0; padding:10px 30px; border:1px solid #9fa1a0; border-radius:2px;}
.portfolio_more a:hover, .portfolio_more a:focus { background:#a40000; border:1px solid #8c0000; color:#fff;}

/* 2021 portfolio */
#wrap.sub .portfolio_newlist2 li {
	width:25%;
	padding:0 0.5px 0;
	box-sizing:border-box;
	position:relative;
	margin-bottom:60px;
}
#wrap.sub .portfolio_newlist2 li:nth-child(2n) {
	margin-left:-1.0px;
}
#wrap.sub .portfolio_newlist2 li:nth-child(4n) {
	margin-left:-2.0px;
}
#wrap.sub .portfolio_newlist2 li:nth-child(4n+3) {
	margin-left:-1.0px;
}
#wrap.sub .portfolio_newlist2 .pf_newlist .txt {
	position:relative;
	color:#000;
	margin-top:15px;
	font-family: 'Noto Sans CJK KR';
	font-weight:200;
	font-size:20px;
	letter-spacing:-0.24px;
	transform: skew(-0.03deg);
	display:inline-block;
}
#wrap.sub .portfolio_newlist2 li a {
	position:relative;
	width:100.8%;
	height:100%;
	display:block;
}
.portfolio_newlist2 .img_wrap1 {
	background-color:transparent;
}
.portfolio_newlist2 .img_wrap2 {
	background-color:#000;
}
.portfolio_newlist2 .img_wrap .img {
	padding-bottom:65%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity:0.7;
	transition: opacity 0.5s ease-in-out;
}

.portfolio_newlist2 .img_wrap .img:hover{
	opacity: 1;
}
.portfolio_newlist2 .img_wrap1 {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	z-index:10;
	height:50px;
}
.portfolio_newlist2 .img_wrap1 img {
	width:auto;
	height:100%;
}
.portfolio_newlist2 .img_wrap1 .img {
	opacity:1;
}

.portlist_nav {
	text-align:left;
	margin:40px 0 20px;
}
.portlist_nav a {
	display:inline-block;
	color:#686868;
	font-size:18px;
	transition: all 0.5s ease-in-out;
	font-family: 'Noto Sans CJK KR';
	font-weight:200;
	margin-right:60px;
	cursor:pointer;
}
.portlist_nav a.on {
	font-family: 'Noto Sans CJK KR';
	font-weight:400;
	border-bottom:1px solid #686868;
}

/* 더보기 추가 css */

.portlist{
    overflow: hidden;
	position: relative;
    
    
}

.portfolio_newlist2{
    margin: 0;
    transition: max-height 1s ease !important;
}

.transAll03{
    cursor: pointer;
	font-size: 14px;
}

/* .portfolio_newlist2::after{
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 80px;
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%)
} */







/* 2021 project */
.project_link {
	margin-bottom:20px;
}
.project_link a {
	margin-right:30px;
	display:inline-block;
}
.project_link a img {
	width:30px;
}
.project {
	margin-bottom:120px;
}
.project iframe {
	width:100%;
	height:calc(100vh + 100px);
	margin-top:-50px;
}
/* 2021 project end */


/* 2021 price */
.maintenance .txt_con {
	position:relative;
}
.txt_link {
	position:absolute;
	top:0;
	left:0;
}
.txt_link.sticky {
	position:fixed;
	top:140px;
	left:80px;
}
.txt_link li {
	margin-bottom:5px;
}
.txt_link li a {
	font-size:30px;
	letter-spacing:-0.6px;
	font-weight:300;
	color:#000;
	font-family: 'Noto Sans CJK KR';
	opacity:0.4;
}
.txt_link li.on a {
	font-weight:700;
	opacity:1;
}
.txt_wrapper {
	width:1000px;
	margin-left:42.5%;
	transform:translateX(0);
	margin-bottom:60px;
}
.txtbox_table {
	width:100%;
    border-collapse: collapse;
	border-top:3px solid #a40000;
}
.txtbox_table th {
	border-bottom:1px solid #a40000;
	font-weight:normal;
	text-align:left;
	color:#a40000;
}
.txtbox_table td {
	border-bottom:1px solid #d9d9d9;
	color:#000;
}
.txtbox_table th, 
.txtbox_table td {
	font-size:15px;
	letter-spacing:-0.6px;
	padding : 10px;
	font-family: 'Noto Sans CJK KR';
}

/* 2021 price end */


/* price */
.priceArea { margin:3% 0;}
.dotRed { display:inline-block; width:7px; height:7px; border:4px solid #f63c3c; border-radius:100%; vertical-align:middle; margin-right:3px; }
.priceArea:after {content:"";display:block;clear:both;}
.price_con { float:right; width:98%; max-width:1770px; border-collapse:collapse;}
.price_con th { padding-right:3%; font-weight:300; color:#000; font-size:32px; line-height:42px; text-align:left; padding-bottom:30px;}
.price_con th strong { font-family: 'Raleway', sans-serif; font-size:1.1em; font-weight:700;}
.price_con th .line { display:block; width:1px; height:80px; background:#000; margin:0 13px 20px;}
.price_con th .dotRed { display:block; margin:0 7px 20px; }
.price_con td { position:relative; padding-right:3%; vertical-align:top; font-size:13px; line-height:20px;}
.price_app01 { font-size:15px; color:#000; margin-bottom:15px;}
.price_list { padding-left:1.2em;}
.price_list li { list-style:decimal; font-size:13px; color:#888; line-height:18px; margin-bottom:3px;   }
.openDate { padding:30px 0; color:#888; line-height:18px; }
.price_app02 { padding:15px; text-align:center; background:#eee;   }
.price_app02 img { vertical-align:middle; margin-right:20px;}
.price_app02 div { display:inline; font-size:16px; color:#000;}
.price_app03 { padding:60px 0; }
.price_app03_div {position:relative; padding-left:50px; border-left:1px solid #000; color:#000; }

.price_info { position:relative; text-align:center; border-top:1px solid #a40000; width:90%; max-width:420px; z-index:2;}
.price_info dt { padding:30px 0; border-bottom:1px solid #b3b3b3;}
.price_info dt .price { display:inline-block; font-size:48px; line-height:42px; font-weight:600; color:#111; vertical-align:middle; margin:10px 5px 0;}
.price_info dt sup { color:#111; font-size:18px; }
.price_info dt sub { color:#111; font-size:14px; vertical-align:bottom; }
.price_info ul { width:84%; margin:0 auto;}
.price_info li { font-size:15px; line-height:20px; padding:20px 0; border-top:1px solid #b3b3b3;}
.price_info li:first-child { border-top:none;}
.price_info li.line2 { padding:40px 0; }
.price_info .btn { padding:30px 0;border-top:1px solid #b3b3b3;}
.price_info .btn a { display:block; width:80%; max-width:360px; margin:0 auto; color:#fff; font-size:17px; line-height:24px; background:#a40000; padding:16px 0; border-radius:4px; -webkit-transition: all 0.15s ease-in-out; -moz-transition: all 0.15s ease-in-out; -ms-transition: all 0.15s ease-in-out; -o-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out;}
.price_info .btn a span { font-weight:bold; }
.price_info .btn a:hover, .price_info .btn a:focus { font-size:18px; }

.maxBorder01 { position:absolute; width:98%; max-width:520px; left:-9%; top:0; height:100% ; border:5px solid #a40000; border-bottom:none; z-index:1;}
.maxBorder02 { position:absolute; width:98%; max-width:520px; left:-9%; top:0; height:calc(100% - 5px);height:-webkit-calc(100% - 5px);height:-moz-calc(100% - 5px); border:5px solid #a40000; border-top:none; z-index:1;}

.price_check { padding:0 !important; }
.price_check div {margin-top:5%; padding:3% 0; border-top:1px solid #000;  border-bottom:1px solid #000;  }
.price_check div:after {content:"";display:block;clear:both;}
.price_check dl { float:left; width:50%;}
.price_check dl dt { margin-bottom:5%; font-size:30px; line-height:36px; color:#000;}
.price_check dl dt strong { font-weight:700; text-transform:uppercase; }
.price_check dl dt span { display:block; font-size:12px; line-height:20px;}

.price_m {}
.price_m > dl { padding:10px;}
.price_m dl .title { font-size:32px; line-height:42px; padding:0 0 0 5%; border-bottom:1px solid #ccc;}
.price_m dl .title a { display:block; color:#000;}
.price_m dl .title strong { font-family: 'Raleway', sans-serif; font-size:1.1em; font-weight:700;}
.price_m dl .title .line { display:block; width:1px; height:20px; background:#000; margin:0 0 0 14px;}
.price_m dl .title .dotRed { display:block; margin:0 0 10px 7px; }
.price_m dl .con {  border-bottom:1px solid #ccc; padding:5%; }
.price_m dl .price_app01 { display:block; line-height:1.5em;}
.price_m .price_app02 { margin-top:5%;}
.price_m .price_app02 img { display:block; width:70%; max-width:320px; margin:0 auto 10px; }
.price_m .price_app02 div { display:block; font-size:13px; line-height:16px; }
.price_m .price_app03 { padding:6% 0;}
.price_m .price_app03_div { padding-left:30px;}
.price_m .price_info li.line2 { padding:20px 0;}
.price_m .price_info { width:100%; max-width:800px; margin:0 auto; }
.price_m .price_check { margin:10px !important; padding:5% 0 2% !important;  border-top:1px solid #000;  border-bottom:1px solid #000;}
.price_m .price_check dl { float:none; width:90%; padding:0 5%; margin:0 0 6% 0;}
.price_m .price_check dl dt { font-size:20px; line-height:26px; margin-bottom:3%;}

/* edit */
.editArea {}
.edit_con { float:right; width:98%; max-width:1770px;}
.editArea:after, .edit_con:after { content:"";display:block;clear:both;}
.edit_con01 { float:left; width:45%; margin-right:5%;}
.edit_con02 { float:left; width:50%;}
.edit_con01 dt { font-size:1.65em; line-height:1.5em; color:#fff; text-align:center; padding:12px 0; background:#a40000;}
.edit_con01 dd { margin-bottom:8%;}
.editTable { width:100%; border-collapse:collapse; }
.editTable th { font-size:14px; font-weight:400;}
.editTable th[scope="col"] {  padding:18px 0; background:#f8f8f8; border-bottom:1px solid #a40000; border-left:1px solid #c5c5c5;}
.editTable th[scope="col"]:first-child { border-left:none;}
.editTable th[scope="row"] { padding:12px 20px; border-bottom:1px solid #c5c5c5;}
.editTable td { padding:12px 20px; font-size:14px; border-bottom:1px solid #c5c5c5; border-left:1px solid #c5c5c5;}
.editTable td.center { text-align:center;}

.map {}
.map dt { font-size:36px; line-height:42px; color:#000; margin-bottom:2%;}
.map dt strong { font-weight:700;}
.map dd { font-size:14px; line-height:20px; color:#000;}
.mapFrame { position:relative; width:calc(100% - 2px); width:-webkit-calc(100% - 2px); width:-moz-calc(100% - 2px); height:500px; margin:5% 0; overflow:hidden; border:1px solid #ccc; }
.mapFrame > a { position:absolute; display:inline-block; background:url(../images/common/gnb_bg.png); color:#fff; padding:5px 10px; right:0; bottom:0;  z-index:5;}
.mapFrame > div { position:absolute; left:50%; top:50%; margin:-250px 0 0 -750px; z-index:1; }

.charge { width:96%; max-width:790px; }
.charge dt { font-size:20px; line-height:26px; color:#636363; border-bottom:1px solid #c4c4c4; padding:0 0 5px 10px; margin-bottom:1%;}
.charge dt span { color:#000; }
.charge dd { font-size:15px; line-height:24px; color:#636363; padding-left:10px; margin-bottom:5%;}
.charge dd span { color:#000;}

.gongzond_logo { position:relative; background:#a40000; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding:5% 0 0; }
.gongzond_logo .topLogo { position:relative; left:auto; top:0; margin:0 auto;  }
.gongzond_logo .topLogo .topLogo01 { position:relative;}

.history { position:relative;}
.history_first { margin-top:5%;}
.history_second { padding-top:5%;}
.history_line { position:absolute; width:1px; height:100%; left:50%; top:0; margin-left:-1px; background:#333; opacity:.1; filter: alpha(opacity=10;); z-index:1;}
.history_dot { position:relative; display:block; width:7px; height:7px; background:#fff; border:4px solid #f63c3c; border-radius:100%; vertical-align:middle; margin:0 auto; z-index:2;}
.history dl { padding:30px 0 60px; text-align:center; font-size:15px;}
.history dl dt { font-size:2.6em; line-height:1.5em; font-weight:700;}
.history dl dd { line-height:1.5em;}

.history_first dl { color:#fff;}

/* payment */
.pay_con { width:96%; max-width:600px;margin:0 auto 5%; }
.pay_con h3 {  font-size: 36px; line-height: 42px;color: #000; margin-bottom:5%; text-align:center;}
.payTable { width:100%; border-collapse:collapse;border-top:1px solid #c5c5c5; margin-bottom:3%; }
.payTable th { font-size:14px; font-weight:400;}
.payTable th[scope="row"] { padding:12px 20px 12px 0; border-bottom:1px solid #c5c5c5; text-align:right;}
.payTable td { padding:12px 20px; font-size:14px; border-bottom:1px solid #c5c5c5; border-left:1px dotted #c5c5c5;}
.box {padding:5px 8px; border:1px solid #ccc; height:28px; font-family: "NanumBarunGothic", "Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial;}
.box:hover, .box:focus { padding:4px 7px;  border:2px solid #a40000;}
.payTable input[type=text], .payTable input[type=number], .payTable input[type=email], .payTable input[type=tel] {padding:5px 8px; border:1px solid #ccc; line-height:18px; margin-right:10px;}
.payTable input[type=text]:hover, .payTable input[type=text]:focus,
.payTable input[type=number]:hover, .payTable input[type=number]:focus,
.payTable input[type=email]:hover, .payTable input[type=email]:focus,
.payTable input[type=tel]:hover, .payTable input[type=tel]:focus
{ padding:4px 7px; border:2px solid #a40000;}
.app_btn { display:inline-block;  font-family: "NanumBarunGothic", "Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial; color:#fff; font-size:20px; line-height:1.35em; background:#000; padding:12px 50px; border-radius:4px; border:none; -webkit-transition: all 0.15s ease-in-out; -moz-transition: all 0.15s ease-in-out; -ms-transition: all 0.15s ease-in-out; -o-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out;}
.app_btn:hover, .app_btn:focus { padding:12px 46px 12px 54px; cursor:pointer;}

@media \0screen { /* IE8 웹폰트 설정*/

}
@media  (min-width: 1921px){
.portfolio_newlist2 li a {
	width:100.62%;
}
}

@media  (max-width: 1420px){

/* edit */
.edit_con01 { width:47%; margin-right:3%;}
.edit_con01 dt { font-size:1.35em; padding:10px 0;}
.edit_con01 dd { margin-bottom:7%;}
.editTable th { font-size:13px;}
.editTable th[scope="col"] { padding:13px 5px;}
.editTable th[scope="row"] { padding:10px 5px;}
.editTable td { padding:10px 5px; font-size:13px; }

.map dt { font-size:24px; line-height:32px;}
.map dd { font-size:13px; line-height:18px; }
.mapFrame { height:360px; }

.charge dt { font-size:20px; line-height:26px; padding:0 0 5px 5px; margin-bottom:1%;}
.charge dd { font-size:13px; line-height:22px; padding-left:5px; margin-bottom:5%;}

}

@media  (max-width: 1366px){

/* 2021 price */
.txt_link li a {
	font-size:25px;
}
.txt_wrapper {
	width:780px;
	margin-left:35.5%;
}

}

@media  (max-width: 1280px){

.portfolio_list li {width:31%; padding:0 1.15% 5%; }

.price_info dt { padding:20px 0; border-bottom:1px solid #b3b3b3;}
.price_info dt .price { font-size:36px; line-height:32px;margin:10px 5px 0;}
.price_info dt sup {font-size:16px; }
.price_info dt sub {font-size:12px;}
.price_info ul { width:94%;}
.price_info li { font-size:13px; line-height:18px;}
.price_info .btn a { width:92%; font-size:15px; line-height:20px; padding:16px 0;}
.price_info .btn a:hover, .price_info .btn a:focus { font-size:16px;}

/* edit */
.edit_con01 dt { font-size:1.35em; padding:10px 0;}
.edit_con01 dd { margin-bottom:7%;}
.editTable th { font-size:13px;}
.editTable th[scope="col"] { padding:13px 5px;}
.editTable th[scope="row"] { padding:10px 5px;}
.editTable td { padding:5px 5px; font-size:12px; }

.map dt { font-size:24px; line-height:32px;}
.map dd { font-size:13px; line-height:18px; }
.mapFrame { height:360px; }

.charge dt { font-size:20px; line-height:26px; padding:0 0 5px 5px; margin-bottom:1%;}
.charge dd { font-size:13px; line-height:22px; padding-left:5px; margin-bottom:5%;}

}

@media  (max-width: 1024px){


.title_line .line { height:40px; margin:0 0 10px 7px;}

.price_con th {  font-size:24px; line-height:32px; padding-bottom:20px;}
.price_con th .line { height:60px; margin:0 13px 20px;}
.price_con th .dotRed {  margin:0 7px 20px; }
.price_app01 { font-size:15px; color:#000; margin-bottom:15px;}
.price_list { padding-left:1.2em;}
.price_list li {font-size:12px;line-height:16px; margin-bottom:3px;   }
.price_app02 img { width:32%; max-width:320px; margin-right:20px; }
.price_app02 div { display:inline; font-size:13px; line-height:15px; }

/* edit */
.edit_con { float:none; width:90%; margin:0 auto;} 
.edit_con01 { float:none; width:100%; margin:0 auto 10%;}
.edit_con02 { float:none; width:100%; margin:0 auto;}
.edit_con01 dt { font-size:1.5em; padding:12px 0;}
.edit_con01 dd { margin-bottom:5%;}
.editTable th { font-size:13px;}
.editTable th[scope="col"] { padding:13px 5px;}
.editTable th[scope="row"] { padding:8px 5px;}
.editTable td { padding:8px 5px; font-size:13px; }


/* 2021 tit txt */
#wrap.sub .wrapper {line-height:normal;}
#contents .top .wrapper {
	padding-top:220px;
}
.tit1 {
	font-size: 50px;
}
.tit2 {
	font-size: 62px;
}
#wrap.sub .tit3 {
	margin-bottom:90px;
}
.tit4 {
	font-size:30px;
	font-weight:700;
	letter-spacing:-0.15px;
	color:#000;
	margin-bottom:20px;
	font-family: 'Noto Sans CJK KR';
}
.tit4_1 {
	font-size:18px;
	font-weight:400;
	letter-spacing:-0.15px;
	color:#000;
	margin-bottom:20px;
	font-family: 'Noto Sans CJK KR';
	line-height:1.3;
}
/* 2021 tit txt end */
/* 2021 portfolio */

#wrap.sub .portfolio_newlist2 li {
	width:33.333%;
}
#wrap.sub .portfolio_newlist2 li a {
	width:100%;
}
#wrap.sub .portfolio_newlist2 li:nth-child(2n) {
	margin-left:0;
}
#wrap.sub .portfolio_newlist2 li:nth-child(4n+3) {
	margin-left:0;
}
#wrap.sub .portfolio_newlist2 .pf_newlist .txt {
	font-size:16px;
}

/* 2021 portfolio end */


/* 2021 project */
.project iframe {
	height: calc(95vw + 0px);
}
/* 2021 project end */


/* 2021 price */
.txt_link {
	position:relative;
}
.txt_link li {
	float:left;
	margin-right:20px;
}
.txt_link li a {
	font-size:30px;
}
.txt_link.sticky {
	top:100px;
	left:0;
	width:100%;
	padding:20px 0;
	padding-left:80px;
	background-color:#fff;
	z-index:1;
}
.txt_wrapper {
	width:100%;
	margin-left:0;
	margin-top:70px;
}
/* 2021 price end */


}

@media  (max-width: 769px){

.topLogo {  width:46%; margin:-23% 0 0 -23%;}
.topTitle {width:50%;  margin:-15.1% 0 0 -25%;}
.topLink { top:70%; }
.main .topLink { top:auto; bottom:12%;}
.topLink li { display:inline; margin:0 10px; }
.topLink li a { font-size:15px; line-height:20px; padding-right:30px; background-size:20px 40px;}

.pageTitle { padding:10% 0;}
.pageTitle div {margin-bottom:4%; }

.listNav { margin:6% 0 8%;}
.listNav li {  padding:0 14px 0 20px;}
.listNav li:first-child {padding-left:14px;}
.listNav li a { font-size:15px; line-height:20px;}

.portfolio_list { width:94%; }
.portfolio_list li {width:47%; padding:0 1.5% 7%; }
.portfolio_list a {  font-size:13px; line-height:1.5em;}

.gongzond_logo { padding:8% 0 0; }
.history_first { margin-top:8%;}
.history_second { padding-top:8%;}
.history dl { padding:30px 0 60px; text-align:center; font-size:15px;}
.history dl dt { font-size:2.2em; line-height:1.5em;}
.history dl dd { line-height:1.5em;}

.pay_con { margin:0 auto 8%; }
.pay_con h3 {  font-size: 24px; line-height: 32px;}
.payTable { margin-bottom:5%; }
.payTable th { letter-spacing:-0.01em;}

/* 2021 */
#contents .top .wrapper {
	padding-top:180px;
}

/* 2021 end */

/* 2021 tit */
.tit1 {
    font-size: 30px;
}
.tit2 {
    font-size: 42px;
}
#wrap.sub .tit3 {
	font-size:18px;
}
.tit4 {
	font-size:20px;
}
/* 2021 tit end */

/* 2021 portfolio */
.portlist_nav a {
	margin-right:20px;
}
#wrap.sub .portfolio_newlist2 li {
	margin-bottom:50px;
}
#wrap.sub .portfolio_newlist2 .pf_newlist .txt {
	font-size:12px;
	margin-top:7px;
}
#wrap.sub .portfolio_newlist2 .img_wrap1 img {
	height:60%;
}
/* 2021 portfolio end */

/* 2021 price */
.txt_link.sticky {
	top:60px;
}
.txt_link li a {
	font-size:22px;
}
.txtbox_table th,
.txtbox_table td {
	font-size:13px;
}
/* 2021 price end */

}

@media  (max-width: 560px){

.title_line { margin:0 auto 20px}
.title_line .line { height:20px; margin:0 0 0 7px;}

.topLogo { width:60%; margin:-30% 0 0 -30%;}
.topTitle {width:70%;  margin:-15.1% 0 0 -35%;}
.topLink { top:75%; }
.main .topLink { top:auto; bottom:15%;}
.topLink li { display:inline; margin:0 8px; }
.topLink li a { font-size:13px; line-height:16px; padding-right:24px; background-size:16px 32px;}

.listNav li {  padding:0 4px 0 8px; background-size:4px 2px; background-position:left 8px;}
.listNav li:first-child {padding-left:4px;}
.listNav li a { font-size:13px; line-height:18px; letter-spacing:-0.01em;}

.portfolio_list { width:96%; }
.portfolio_list a {  font-size:12px;}

.price_m dl .title { font-size:26px; line-height:36px; padding:0 0 0 2%;}
.price_m dl .title .line { margin:0 0 0 13px;}
.price_m dl .title .dotRed { margin:0 0 8px 6px;}
.price_m dl .price_app01 { font-size:13px; letter-spacing:-0.5px;}
.price_m dl .con { padding:5% 2%;}
.price_m .price_check dl { float:none; width:96%; padding:0 2%; margin:0 0 5% 0;}

/* eidt */
.edit_con { width:96%;}
.edit_con01 dt { font-size:1.5em; padding:12px 0;}
.editTable th { font-size:12px; line-height:15px; letter-spacing:-0.5px;}
.editTable th[scope="col"] { padding:10px 5px;}
.editTable th[scope="row"] { padding:8px 5px;}
.editTable td { padding:8px 5px; font-size:12px; letter-spacing:-0.5px;  line-height:15px;}

.map dt { font-size:24px; line-height:32px;}
.map dd { font-size:13px; line-height:18px; }
.mapFrame { height:260px; }


/* 2021 tit */
.tit1 {
    font-size: 16px;
	margin-bottom:10px;
}
.tit2 {
    font-size: 20px;
	margin-bottom:30px;
}
#wrap.sub .tit3 {
	font-size:13px;
	margin-bottom:50px;
}
.tit4 {
	font-size:15px;
}
.tit4_1 {
	font-size:12px;
}
/* 2021 tit end */

/* 2021 portfolio */
#contents .top .wrapper {
	padding-top:120px;
}
.portlist_nav a {
	font-size:14px;
	margin-right:15px;
}
#wrap.sub .portfolio_newlist2 .pf_newlist .txt {
	font-size:10px;
	margin-top:5px;
}
#wrap.sub .portfolio_newlist2 li, .portfolio_newlist2 .pf_newlist1 {
	width:50%;
	margin-bottom:20px;
}
/* 2021 portfolio end */

/* 2021 project */
.project .frame_back {
	background-color:#333;
}
.project iframe {
	margin-top:0;
    height: calc(180vw );
}
.project_link {
	margin-bottom:10px;
}
.project_link a {
	margin-right:10px;
}
.project_link a img {
	width:20px;
}
/* 2021 project end */


/* 2021 price */
.txt_link li {
	margin-right:10px;
	display:inline-block;
	float:inherit;
}
.txt_link li a {
	font-size:15px;
	letter-spacing: -0.6px;
}
.txt_link.sticky {
	padding-left:10px;
}
.txt_link.sticky li {
	margin-right:5px;
}
.txt_link.sticky li a {
	font-size:11px;
}
.txtbox_table th, .txtbox_table td {
    font-size: 12px;
	padding:5px;
	border-right:1px solid #d9d9d9;
}
.txtbox_table th:last-child, .txtbox_table td:last-child {
	border-right:none;
}
/* 2021 price end */

}

@media  (max-width: 420px){
.main .topLink { top:auto; bottom:12%;}
.pageTitle { font-size:13px;} 
.pageTitle div {margin-bottom:5%; }
.portfolio_text { font-size:10px; line-height:1.3em; height:2.6em;}
}

@media  (max-width: 360px){

}

@media  (max-width: 340px){

}

@import url(https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css);

.topTitle{
	width: 100%;
	max-width: 100%;
	color: #fff;
	text-align: center;
	margin: 0;
	left: 0;
	top: 35%;
	font-family: 'Nanum Barun Gothic', sans-serif;
	letter-spacing: -3px;
}

.topTitle>div{
	line-height: 1;
	font-size: 60px;
}

.topTitle .tit1{
	font-weight: 100;
	font-size: 70px;
}

.topTitle .tit2{
	font-weight: bold;
}

.topLink{
	top: 55%;
}

@media (max-width: 1280px){
	.topTitle>div{
		line-height: 1;
		font-size: 40px;
	}

	.topTitle .tit1{
		font-size: 50px;
	}
}

@media (max-width: 768px){
	.topTitle>div{
		line-height: 1;
		font-size: 30px !important;
	}

	.topTitle .tit2{
		font-size: 20px !important;
	}

	.topLink{
		top: 60%;
	}
}