@font-face{
font-family:"Nanum Gothic";
src:url('/fonts/NanumGothic.eot');
src:url('/fonts/NanumGothic.eot?#iefix') format('embedded-opentype'),
url('/fonts/NanumGothic.woff') format('woff'),
url('/fonts/NanumGothic.ttf') format('truetype');
url('/fonts/NanumGothic.svg#NanumGothic') format('svg')
src:local(※), url('/fonts/NanumGothic.woff') format('woff');
}
@font-face{
font-family:"Nanum Myeongjo";
src:url('/fonts/NanumMyeongjo.eot');
src:url('/fonts/NanumMyeongjo.eot?#iefix') format('embedded-opentype'),
url('/fonts/NanumMyeongjo.woff') format('woff'),
url('/fonts/NanumMyeongjo.ttf') format('truetype');
url('/fonts/NanumMyeongjo.svg#NanumMyeongjo') format('svg')
src:local(※), url('/fonts/NanumMyeongjo.woff') format('woff');
}

/** 공통영역 **/
#container {background:url('/site/img/archi/bak_container.gif') center top repeat-y;}
#divLeft {position:relative;float:left;width:731px;border-top:solid 1px #d7d7d7;overflow-x:hidden;}
#divRight {position:relative;float:right;width:249px;border-top:solid 1px #d7d7d7;}
#divLeft img {display:block;}
#divRight img {display:block;}
.divTitleL {margin:35px 0 0 30px;}
.divTitleR {margin:28px 20px 0 20px;}
.margin30 {margin:30px 30px 30px 30px;}
.margin20 {margin:20px 20px 20px 20px;}
.padding30 {padding:30px 30px 30px 30px;}
.padding20 {padding:20px 20px 20px 20px;}
.divBannerT {border-bottom:solid 1px #d7d7d7;}
.btnPrev {float:right;height:24px;}
.btnNext {float:right;height:24px;border-left:solid 1px #d7d7d7;}
.divCount {float:right;margin:4px 10px 0 0;font-family:gulim;font-size:12px;line-height:1.5em;letter-spacing:0;}
.divMore {float:right;color:#909294;}
.divBannerR {padding:25px 20px 25px 20px;border-top:solid 1px #d7d7d7;}
.divBannerL {margin:20px 0 0 0;padding:25px 20px 0 20px;border-top:solid 1px #d7d7d7;}
.divSmartIN {padding:25px 20px 25px 20px;border-top:solid 1px #d7d7d7;}
.divSmartIN .text {margin:8px 0 0 0;font-size:11px;color:#999;}
.divSmartIN .search {margin:12px 0 0 0;}
.divSmartIN .search input {width:160px;height:32px;}
.orderOn {float:right;margin:0 0 0 20px;padding:4px 0 0 15px;background:url(/site/img/archi/ico_check.gif) left center no-repeat;font-weight:bold;}
.orderOff {float:right;padding:4px 0 0 20px;color:#72777a;}
.iconCompany {float:left;padding:0 5px 5px 0;}

/** 만화로 보는 건축이야기 - 하단 리스트 부분 **/
.divListToon {height:124px;margin:43px 0 0 0;}
.divListToon .btnPrevT {float:left;width:41px;height:124px;margin:0 9px 0 0;line-height:124px;text-align:right;cursor:pointer;}
.divListToon .btnNextT {float:left;width:41px;height:124px;margin:0 0 0 9px;line-height:124px;cursor:pointer;}
.divListToon .divLT {float:left;width:630px;overflow:hidden;}
.divListToon #listWebtoon {width:4000px;}
.divListToon .listBox {float:left;width:102px;height:104px;padding:10px 10px 10px 10px;border:solid 2px #FFFFFF;}
.divListToon .listBox_o {float:left;width:102px;height:104px;padding:10px 10px 10px 10px;border:solid 2px #0091f2;}
.divListToon .title {width:102px;margin:10px 0 0 0;text-align:center;font-family:gulim;font-size:12px;font-weight:bold;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.divListToon .content {width:102px;margin:5px 0 0 0;text-align:center;font-family:gulim;font-size:12px;color:#909294;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.divListToon .image {width:102px;height:61px;background-color:#d8d9d9;overflow:hidden;}

/** 건축 AtoZ - 오른쪽 리스트 부분 **/
.divAtoZ .divMargin {margin:0 0 0 30px;}
.divAtoZ .Height_28 {height:28px;}
.divAtoZ .Height_30 {height:30px;}
.divAtoZ .fromCenter {margin:0 0 0 15px;}
.divAtoZ .pTitle {margin:0 0 0 30px;height:64px;}
.divAtoZ .pTitle_2 {margin:0 0 0 15px;height:64px;}
.divAtoZ .QnAList {height:36px;font-family:gulim;font-size:13px;color:#434851;letter-spacing:0;}
.divAtoZ .AtoZList {width:319px;padding:17px 0 0 0;border:solid 1px #d7d7d7;border-top:solid 0px #ffffff;}
.subCopy {margin:10px 0 0 0;font-family:dotum;font-size:11px;color:#909294;line-height:16px;}
.tit_R {margin:28px 20px 28px 20px;}

.remoteBtn {float:left;height:33px;}

/** 건축사 찾기 - 검색부분 **/
.divSearchL {height:80px;margin:25px 30px 0 30px;border:solid 1px #d7d7d7;border-bottom:solid 0px #fff;background:#f3f3f3;}
.divSearchL .area {float:left;width:300px;height:50px;margin:15px 0 0 25px;border-right:solid 1px #d7d7d7;}
.divSearchL .area .input {float:left;margin:0 6px 0 0;}
.divSearchL .area .input input {width:75px;height:24px;padding:0 0 0 5px;line-height:24px;cursor:pointer;}
.divSearchL .area .text {margin:10px 0 0 0;color:#72777a;font-size:11px;}
.divSearchL .mater {float:left;width:300px;height:50px;margin:15px 0 0 25px;border-right:solid 1px #d7d7d7;}
.divSearchL .mater .input {float:left;margin:0 6px 0 0;}
.divSearchL .mater .input input {width:250px;height:24px;padding:0 0 0 5px;}
.divSearchL .mater .text {margin:10px 0 0 0;color:#72777a;font-size:11px;}
.divSearchL .company {float:left;width:300px;height:50px;margin:15px 0 0 40px;}
.divSearchL .company .input {float:left;margin:0 0 0 0;}
.divSearchL .company .input input {width:185px;height:24px;padding:0 0 0 5px;}
.divSearchL .company .btn {float:left;margin:0 6px 0 0;}
.divSearchL .company .text {margin:10px 0 0 0;color:#72777a;font-size:11px;}
.divSearchLine {height:30px;margin:0 30px 0 30px;border:solid 1px #d7d7d7;background:#f7f8f9;}
.divSearchMap {position:relative;height:245px;margin:0 30px 0 30px;border:solid 1px #778b9d;border-top:solid 0px #fff;background:#91b1cf;}
.divSearchMap .container {margin-left:250px;}
.divSearchMap .container .contain {position:relative;width:225px;margin:0 auto;overflow:hidden;}
.divSearchMap .container .contain .mark {position:absolute;top:-30px;left:160px;}
.divSearchMap .sido {position:absolute;top:-30px;left:-1px;}
.divSearchMap .gugun {position:absolute;top:-30px;left:40px;}
.divSearchMap .dong {position:absolute;top:-30px;left:81px;}
.divSearchMap .title {width:116px;height:20px;background:url(/site/img/archi/img_lineCurved.gif) no-repeat;font-size:11px;font-weight:bold;padding:9px 0 0 15px;color:#434851;}
.divSearchMap .content {width:115px;height:240px;padding:5px 0 0 5px;border:solid 1px #d7d7d7;background:#fff;letter-spacing:0;overflow-y:auto;color:#72777a;}
.divSearchMap .content .list {padding:5px 0 0 8px;cursor:pointer;}
.divSearchMap .content .list_o {padding:5px 0 0 8px;cursor:pointer;font-weight:bold;color:#0091fe;}
.divSearchLine2 {height:30px;background:url(/site/img/archi/bak_line_1.gif) center bottom no-repeat;}

/** 건축사 찾기 - 리스트 부분 1 **/
.divListArchi {height:153px;margin:20px 30px 0 30px;background:url(/site/img/archi/bak_line_1.gif) center bottom no-repeat;}
.divListArchi .divLogo {float:left;width:170px;}
.divListArchi .divLogo .logo {position:relative;width:160px;height:100px;border:solid 1px #e7e7e7;margin:0 0 8px 10px;font-family:gulim;font-size:14px;font-weight:bold;color:#262626;}
.divListArchi .divLogo .smart {position:absolute;top:-4px;left:10px;}
.divListArchi .divLogo .hit1{float:left;margin:0 5px 0 10px;}
.divListArchi .divLogo .hit2{float:left;height:20px;padding:4px 10px 0 0;background:url(/site/img/archi/bak_memoRight.gif) top right repeat-x;font-family:gulim;font-size:13px;letter-spacing:0;}
.divListArchi .divLogo .heart1{float:left;margin:0 5px 0 10px;}
.divListArchi .divLogo .heart2{float:left;height:20px;padding:4px 10px 0 0;background:url(/site/img/archi/bak_memoRight.gif) top right repeat-x;font-family:gulim;font-size:13px;letter-spacing:0;}
.divListArchi .divContent {float:left;width:390px;}
.divListArchi .divContent .name {margin:5px 0 8px 30px;font-family:gulim;font-size:14px;font-weight:bold;color:#434851;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.divListArchi .divContent .tel {margin:12px 0 8px 30px;letter-spacing:0;font-family:gulim;font-size:12px;color:#666666;line-height:1.5em;}
.divListArchi .divContent .port {margin:5px 0 0 30px;letter-spacing:0;font-family:gulim;font-size:12px;}
.divListArchi .divContent .port .list {float:left;width:60px;height:40px;margin:0 5px 0 0;overflow:hidden;}
.divListArchi .divIcon {float:right;width:100px;}
.divListArchi .divIcon .icon {margin:10px 0 0 0;text-align:right;}
.divListArchi .divIcon .icon img {margin:0 5px 0 0;}

/** 건축사 찾기 - 리스트 부분 2 **/
.divListArchi2 {height:70px;margin:20px 30px 0 30px;background:url(/site/img/archi/bak_line_1.gif) center bottom no-repeat;}
.divListArchi2 .divName {float:left;width:170px;}
.divListArchi2 .divName .name {margin:0 0 8px 10px;font-family:gulim;font-size:14px;font-weight:bold;color:#262626;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.divListArchi2 .divName .hit1 {float:left;margin:0 5px 0 10px;}
.divListArchi2 .divName .hit2 {float:left;height:20px;padding:4px 10px 0 0;background:url(/site/img/archi/bak_memoRight.gif) top right repeat-x;font-family:gulim;font-size:13px;letter-spacing:0;}
.divListArchi2 .divName .heart1 {float:left;margin:0 5px 0 10px;}
.divListArchi2 .divName .heart2 {float:left;height:20px;padding:4px 10px 0 0;background:url(/site/img/archi/bak_memoRight.gif) top right repeat-x;font-family:gulim;font-size:13px;letter-spacing:0;}
.divListArchi2 .divContent {float:left;width:390px;}
.divListArchi2 .divContent .tel {margin:3px 0 0 30px;letter-spacing:0;font-family:gulim;font-size:12px;color:#434851;}
.divListArchi2 .divContent .address {margin:8px 0 0 30px;letter-spacing:0;font-family:gulim;font-size:12px;color:#434851;}
.divListArchi2 .divIcon {float:right;width:100px;}
.divArchiText {float:left;margin:4px 10px 0 10px;font-family:gulim;font-size:12px;line-height:1.5em;color:#72777a;}

/** 건축사 찾기 - 우측 리스트 부분 **/
.divListR {margin:0 0 11px 0;}
.divListR .img {float:left;width:70px;overflow-x:hidden;}
.divListR .title {float:left;width:128px;margin:0 0 0 10px;font-family:gulim;font-size:13px;line-height:1.5em;}

/** 건축사 찾기 - 상세보기(VIEW) 부분 **/
.divListArchiView {height:184px;padding:35px 30px 0 30px;background:url(/site/img/archi/bak_line_2.gif) center bottom no-repeat;}
.divListArchiView .divLogo {float:left;width:170px;}
.divListArchiView .divLogo .logo {position:relative;width:160px;height:100px;border:solid 1px #d7d7d7;margin:0 0 8px 10px;font-family:gulim;font-size:14px;font-weight:bold;color:#262626;}
.divListArchiView .divLogo .smart {position:absolute;top:-4px;left:10px;}
.divListArchiView .divLogo .hit1{float:left;margin:0 5px 0 10px;}
.divListArchiView .divLogo .hit2{float:left;height:20px;padding:4px 10px 0 0;background:url(/site/img/archi/bak_memoRight.gif) top right repeat-x;font-family:gulim;font-size:13px;letter-spacing:0;}
.divListArchiView .divLogo .heart1{float:left;margin:0 5px 0 10px;}
.divListArchiView .divLogo .heart2{float:left;height:20px;padding:4px 10px 0 0;background:url(/site/img/archi/bak_memoRight.gif) top right repeat-x;font-family:gulim;font-size:13px;letter-spacing:0;}
.divListArchiView .divContent {float:left;width:390px;}
.divListArchiView .divContent .name {margin:5px 0 8px 30px;font-family:NanumGothic;font-size:18px;font-weight:bold;color:#262626;}
.divListArchiView .divContent .tel {margin:17px 0 0 30px;letter-spacing:0;font-family:gulim;font-size:12px;color:#434851;line-height:1.6em;}
.divListArchiView .divIcon {float:right;width:100px;}
.divListArchiView .divIcon .icon {margin:10px 0 0 0;text-align:right;}
.divListArchiView .divIcon .icon img {margin:0 5px 0 0;}

.divSearchLine3 {height:1px;background:url(/site/img/archi/bak_line_1.gif) center top no-repeat;}
.smart {position:absolute;top:-4px;left:10px;}

/** 건축사 메인 - 건축사 목록 부분 **/
.divListArchiMain {float:left;width:335px;height:108px;padding:10px 0 10px 0;border-bottom:solid 1px #d7d7d7;}
.divListArchiMain .divLogo {float:left;width:150px;margin:0 0 0 0;}
.divListArchiMain .divLogo .logo {position:relative;width:150px;height:90px;margin:0 0 0 0;font-family:gulim;font-size:12px;font-weight:bold;color:#262626;}
.divListArchiMain .divLogo .smart {position:absolute;top:-14px;left:10px;}
.divListArchiMain .divContent {float:left;width:180px;}
.divListArchiMain .divContent .name {margin:10px 0 4px 15px;font-family:gulim;font-size:13px;font-weight:bold;color:#262626;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.divListArchiMain .divContent .tel {margin:13px 0 0 15px;letter-spacing:0;font-family:gulim;font-size:12px;color:#959595;line-height:1.6em;}

.divSearchLine .title {float:left;width:116px;height:20px;background:url(/site/img/archi/img_lineCurved.gif) no-repeat;font-size:11px;font-weight:bold;padding:9px 0 0 15px;color:#434851;}

/** 자재사 메인 - 자재목록 부분 **/
.divListMater {height:117px;margin:0 30px 0 30px;border-bottom:solid 1px #d7d7d7;}
.divListMater .divImage {position:relative;float:left;width:157px;}
.divListMater .divImage .logo {position:relative;width:160px;height:100px;border:solid 1px #d7d7d7;margin:0 0 8px 10px;font-family:gulim;font-size:14px;font-weight:bold;color:#262626;}
.divListMater .divImage .smart {position:absolute;top:-4px;left:10px;}
.divListMater .divImage .hit1{float:left;margin:0 5px 0 10px;}
.divListMater .divImage .hit2{float:left;height:20px;padding:4px 10px 0 0;background:url(/site/img/archi/bak_memoRight.gif) top right repeat-x;font-family:gulim;font-size:13px;letter-spacing:0;}
.divListMater .divImage .heart1{float:left;margin:0 5px 0 10px;}
.divListMater .divImage .heart2{float:left;height:20px;padding:4px 10px 0 0;background:url(/site/img/archi/bak_memoRight.gif) top right repeat-x;font-family:gulim;font-size:13px;letter-spacing:0;}
.divListMater .divContent {float:left;width:360px;}
.divListMater .divContent .name {margin:12px 0 8px 20px;font-family:gulim;font-size:14px;font-weight:bold;color:#262626;}
.divListMater .divContent .tel {margin:12px 0 0 20px;letter-spacing:0;font-family:gulim;font-size:12px;color:#434851;line-height:1.6em;}
.divListMater .divContent .port {margin:5px 0 0 20px;letter-spacing:0;font-family:gulim;font-size:12px;}
.divListMater .divContent .port .list {float:left;width:60px;height:40px;margin:0 5px 0 0;overflow:hidden;}
.divListMater .divCom {position:relative;float:right;width:130px;font-size:11px;}
.divListMater .divCom .icon {margin:0 0 0 5px;text-align:left;line-height:1.6em;color:#434851;}

.listFindMa {margin:30px 0 30px 30px;}
.listFindMa ul {width:100%;}
.listFindMa li {float:left;position:relative;width:208px;height:263px;vertical-align:top;margin-right:20px;margin-bottom:20px;display:block;border:1px solid #d7d7d7;overflow:hidden;box-shadow: 1px 1px 3px #d8d8d8;}
.listFindMa li .img_thumb {float:left;  width:208px; height:164px; }
.listFindMa li .tit_thumb {float:left;  padding:5px 0 0 10px; font-weight:bold; overflow:hidden; width:100%;letter-spacing:0;color:#999;}
.listFindMa li .tit_thumb .heart { position:absolute; top:168px; right:0px; width:60px; vertical-align:middle;}
.listFindMa li .text_thumb{ float:left; padding:0px 0px 0px 10px;  color:#707070; overflow:hidden;  display:block;}
.listFindMa li .text_thumb .date { position:absolute; top:223px; right:9px; width:60px; vertical-align:middle;letter-spacing:0;}

/** 자재사 찾기 - 우측 리스트 부분 **/
.divListM {margin:0 0 11px 0;}
.divListM .img {float:left;width:60px;height:60px;overflow:hidden;}
.divListM .title {float:left;width:138px;margin:0 0 0 10px;font-family:gulim;font-size:13px;line-height:1.5em;}
.icoMCate {cursor:pointer;}

.divMater_Best { float:left; margin:0 0 0 30px;}
.divMater_Best .MaTitleL {margin:35px 0 20px 0;}
.divMater_Best  ul {float:left;  padding-bottom:20px;}
.divMater_Best  li {float:left; position:relative; width:212px; height:152px; vertical-align:top; margin-right:23px; margin-bottom:20px; display:block;text-overflow:ellipsis;overflow:hidden;white-space:nowrap; }
.divMater_Best  li a.over {position:absolute; bottom:0px; left:0px;  background:url(/html/img/mater/img_bestbg.png) repeat-x ; padding:10px 0px 0px 10px; width:202px; height:20px; color:#fff; }
.divMater_Best  li a:hover  {width:202px; height:142px;  background:url(/html/img/mater/img_bestbg01.png) repeat; padding:none; font-size:0px; display:inline;}

.divMater_Exh {float:left; margin:0px 0 0 30px;}
.divMater_Exh .MaTitleL {margin:0 0 20px 0; }
.divMater_Exh ul {float:left; border:1px solid #d5d5d5; width:916px;  margin-bottom:20px; }
.divMater_Exh li {float:left;   border-right:1px solid #d5d5d5;  height:137px; }
.divMater_Exh li:last-child {border-right:none;}

.divMater_List {float:left; margin:0px 0 0 30px;}
.divMater_List .MaTitleL {margin:20px 0 20px 0; }
.divMater_List .category_area { position:relative; border-top:2px solid #35353f; border-left:1px solid #d5d5d5; border-right:1px solid #d5d5d5;  width:916px;  margin-bottom:20px; overflow:hidden; }
.divMater_List .category_area  h3 {padding: 15px 0px 10px 25px;  font-size:12px; color:#434851; border-bottom:1px solid #d5d5d5;}
.divMater_List .category_area ul {width:100%;  }
.divMater_List .category_area li {float:left; width:22.16%; border-right:1px solid #d5d5d5; padding:12px 0px 10px 25px;   border-bottom:1px solid #d5d5d5;}
.divMater_List .category_area li:last-child {border-right:none; } 

.divMater_List .category_area  p{position:absolute;  top:0px; right:20px;   height:23px;  font-family:tahoma;  font-size:11px;}
.divMater_List .category_area  .btn_pre { position:absolute; top:-2px; right:23px; display:block; width:23px; height:23px; background:url(/html/img/mater/ico_pre.png) no-repeat; text-indent:-9999px;}
.divMater_List .category_area  .btn_next { position:absolute; top:-2px; right:0px; display:block; width:23px; height:23px; background:url(/html/img/mater/ico_next.png) no-repeat; text-indent:-9999px;}
.divMater_List .category_area  .slide_Num { position:absolute; top:15px; right:75px; display:block;  }
.divMater_List .view-options li{float:left; padding:4px 0 0 20px;color:#72777a;}
.divMater_List .view-options li.on {float:left;padding:4px 0 0 15px;background:url(/site/img/archi/ico_check.gif) left center no-repeat;font-weight:bold;}

.divMater_List .Ma_list {margin-bottom:30px; overflow:hidden; float:left; }
.divMater_List .Ma_list ul {width:100%;margin:12px 0px 20px 0px; }
.divMater_List .Ma_list li {float:left;position:relative;width:212px;height:263px;vertical-align:top;margin-right:20px;margin-bottom:20px;display:block;border:1px solid #d7d7d7;overflow:hidden;box-shadow: 1px 1px 3px #d8d8d8;}
.divMater_List .Ma_list li .img_thumb {float:left;  width:212px; height:164px; }
.divMater_List .Ma_list li .tit_thumb {float:left;  padding:5px 0 0 10px; font-weight:bold; overflow:hidden; width:100%;letter-spacing:0;color:#999;}
.divMater_List .Ma_list li .tit_thumb .heart { position:absolute; top:170px; right:0px;  width:60px; vertical-align:middle;}
.divMater_List .Ma_list li .text_thumb{ float:left; padding:0px 0px 0px 10px;  color:#707070; overflow:hidden;  display:block;}
.divMater_List .Ma_list li .text_thumb .date { position:absolute; top:223px; right:9px; width:60px; vertical-align:middle;letter-spacing:0;}





