/* sub visual */
#sub_visual {position: relative; width: 100%; height: 340px; background-repeat: no-repeat; background-position: center center;}
#sub_visual .inner {position: relative; height: 100%;}
#sub_visual .inner .visu_tit {position: absolute; top: 170px; left: 0; font-size: 48px; font-weight: 900; color: #fff;}
.sub_visual01 {background-image: url(../images/sub/sub_visual01.jpg);}
/* .sub_visual02 {background-image: url(../images/sub/sub_visual02.jpg);} */
.sub_visual02{margin-top:140px; height: auto !important;}
.sub_visual03{margin-top:140px; height: auto !important; }
.sub_visual04{margin-top:70px; height: auto !important; overflow: hidden;}
.sub_visual05{margin-top:70px; height: auto !important;overflow: hidden;}
/* .sub_visual03 {background-image: url(../images/sub/sub_visual03.jpg);} */
/* .sub_visual04 {background-image: url(../images/sub/sub_visual04.jpg);}
.sub_visual05 {background-image: url(../images/sub/sub_visual05.jpg);} */
.sub_visual06 {background-image: url(../images/sub/sub_visual06.jpg);}
.sub_visual07 {background-image: url(../images/sub/sub_visual07.jpg);}
#sub_visual .search_wrap {position: absolute; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,0.6);}
.change_p{color: #fff; position: absolute; font-size: 18px; font-weight: 400;word-break: keep-all;right: calc(100% + 20px); top: 15px;    width: fit-content;}
/* sub common */
#sub_contents {padding: 100px 0;}



/* sub tab menu */
.sub_tab {position: absolute; bottom: 0; left: 0; right: 0; width: 100%; background-color: rgba(0,0,0,0.6);}
.sub_tab ul:after {display: block; clear: both; *zoom: 1; content: '';}
.sub_tab li {float: left; box-sizing: border-box; width: 50%;}
.sub_tab li a {position: relative; display: block; height: 60px; line-height: 60px; font-weight: 500; color: rgba(255,255,255,0.3); text-align: center;}
.sub_tab li a:before {visibility: hidden; opacity: 0; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 4px; background-color: #345bd4; transition: all 0.3s ease-in-out; content: '';}
.sub_tab li.active a {color: #fff;}
.sub_tab li.active a:before {visibility: visible; opacity: 1;}


/* list paging */
.listPage {margin: 30px 0 0 0; width: 100%; padding-top: 30px; font-size: 0; text-align: center; border-top: 1px solid #ddd;}
.listPage button {border:0; vertical-align:top; display:inline-block; height:40px; text-indent: -9999px; width:40px;}
.listPage .btnPrev {background:url(../images/sub/paging_prev.png) no-repeat center;}
.listPage ul {vertical-align:top; display: inline-block; margin: 0 50px; overflow: hidden; }
.listPage li { float: left; margin: 0 10px; }
.listPage li:hover a {font-weight: 700;}
.listPage li.on a {font-weight: 700; color:#fff; background:#364e9a;}
.listPage li a {display: block; font-family: 'Montserrat'; font-size: 16px; font-weight: 300; color:#666; text-align: center; width:40px; height:40px; line-height:40px; transition: all 0.3s ease-in-out;}
.listPage .btnNext {background:url(../images/sub/paging_next.png) no-repeat center;}


.chk_box input {display: none;}
.chk_box label {display: block; cursor: pointer;}
.chk_box label:after {display: block; clear: both; *zoom: 1; content: '';}
.chk_box label span {position: relative; float: left; box-sizing: border-box; border: 1px solid #bbb;}
.chk_box label span:before {visibility: hidden; opacity: 0; position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; transition: visibility,opacity 0.3s ease-in-out; content: '';}
.chk_box label p {float: left;}
.chk_box input[type="checkbox"] + label span {width: 22px; height: 22px;}
.chk_box input[type="checkbox"] + label p {margin: 0 0 0 15px; height: 22px; line-height: 22px; color: #666;}
.chk_box input[type="checkbox"]:checked + label span:before {visibility: visible; opacity: 1; width: 12px; height: 12px; background-color: #364e9a;}
.chk_box input[type="radio"] + label span {width: 24px; height: 24px; border-radius: 50%;}
.chk_box input[type="radio"] + label p {margin: 0 0 0 10px; height: 24px; line-height: 24px; color: #333;}
.chk_box input[type="radio"]:checked + label span:before {visibility: visible; opacity: 1; width: 14px; height: 14px; background-color: #364e9a; border-radius: 50%;}

.chk_wrap:after {display: block; clear: both; *zoom: 1; content: '';}
.chk_wrap .chk_box {float: left;}
.chk_wrap .chk_box + .chk_box {margin: 0 0 0 30px;}

.btns {margin: 25px 0 0; font-size: 0; text-align: center;}
.btns button {display: inline-block; width: 380px; height: 60px; font-size: 16px;}
.btns button + button {margin: 0 0 0 10px;}
.btns .btn_ok {color: #fff; background-color: #364e9a; border: 1px solid #364e9a;}


/* 리스트 탑 */
.board_top {display: block; position: relative; margin: 0 0 30px; width: 100%; padding: 0 0 10px; border-bottom: 1px solid #333;}
.board_top:after {display: block; clear: both; *zoom: 1; content: '';}
.board_top .num {float: left; height: 46px; line-height: 46px; font-weight: 900; color: #333;}
.board_top .prd_tit {float: left; height: 46px; line-height: 46px; font-size: 32px; color: #333;}
.board_top .prd_tit span {display: inline-block; margin: 0 0 0 15px; font-size: 16px; font-weight: 400; color: #999; vertical-align: top;}
.board_top .prd_tit span em {color: #666;}
.board_top select {float: right; width: 180px; height: 46px; padding: 0 45px 0 20px; border: 1px solid #ddd; background: url(../images/sub/arrow_select_bk.png) no-repeat 150px center;}
.board_top button {float: right; width: 180px; height: 46px; transition: all 0.3s ease-in-out;}
.board_top .btn_all_delete {color: #333; background-color: #fff; border: 1px solid #ddd;}
.board_top .btn_all_delete:hover {color: #fff; background-color: #333; border: 1px solid #333;}
.board_top .btn_list {font-family: 'Montserrat'; font-weight: 500; color: #364e9a; background-color: #fff; border: 1px solid #364e9a;}
.board_top .btn_list:hover {color: #fff; background-color: #364e9a;}

/* 오피스 리스트 */
.office_list {min-height: 450px;}
.office_list:after {display: block; clear: both; *zoom: 1; content: '';}
.office_list li {position: relative; float: left; width: 280px; margin: 30px 0 0 20px;}
.office_list li:nth-child(4n + 1) {margin: 30px 0 0 0; clear: both;}
.office_list li:nth-child(-n + 4) {margin-top: 0;}
.office_list li a {display: block; position: relative;}
.office_list .label {display: block; position: absolute; top: 10px; left: 10px; width: 70px; height: 22px; line-height: 22px; font-size: 12px; font-weight: 500; text-align: center; color: #fff; background-color: #364e9a; z-index: 1;}
.office_list .img_box {position: relative; overflow: hidden; width: 100%;}
.office_list .img_box:before {display: block; padding-top: 100%; content: '';}
.office_list .img_box img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; vertical-align: top; transition: all 0.3s ease-in-out;}
.office_list .txt_box {padding: 15px 10px 25px;}
.office_list .txt_box .tit {display: block; margin: 0 0 10px; font-weight: 500; color: #333;}
.office_list .txt_box .add {display: block; font-size: 14px; color: #666;}
.office_list .txt_box .subway {display: block; font-size: 14px; color: #999;}
.office_list .txt_box .price {margin: 10px 0 0 0; line-height: 22px; font-size: 13px; color: #666;}
.office_list .txt_box .price em {display: block; line-height: 22px; font-size: 14px; color: #333;
    transform: translate(0,-4px);
}
.office_list li a:hover .img_box img {transform: scale(1.1);}
.office_list .btn_delete {position: absolute; top: 10px; right: 10px; width: 22px; height: 22px; background: rgba(0,0,0,0.3) url(../images/sub/btn_delete.png) no-repeat center center; text-indent: -9999px; border-radius: 50%;}

/* 오피스 상세 */
.sale_top:after {display: block; clear: both; *zoom: 1; content: '';}
.sale_top .img_area {float: left; width: 480px;}
.sale_top .img_area .gallery-top .swiper-slide img {vertical-align: top;}
.sale_top .img_area .gallery-thumbs {margin: 8px 0 0 0; height: 114px;}
.sale_top .img_area .gallery-thumbs .swiper-slide {background-color: #fff;}
.sale_top .img_area .gallery-thumbs .swiper-slide img {opacity: 0.2; width: 114px; height: 114px; vertical-align: top; cursor: pointer; transition: opacity 0.3s ease-in-out;}
.sale_top .img_area .gallery-thumbs .swiper-slide-thumb-active img {opacity: 1;}
.sale_top .location_area {position: relative; float: right; width: 680px; height: 602px;}
.sale_top .location_area .map {box-sizing: border-box; width: 100%; height: 350px; border: 1px solid #ddd;}
.sale_top .location_area .map iframe {width: 100%; height: 100%; vertical-align: top;}
.sale_top .location_area .address {padding: 25px 0 0 20px;}
.sale_top .location_area .address li {margin: 5px 0 0 0;}
.sale_top .location_area .address li:first-child {margin: 0;}
.sale_top .location_area .address li:after {display: block; clear: both; *zoom: 1; content: '';}
.sale_top .location_area .address li span {float: left; width: 100px; font-weight: 500; color: #888;}
.sale_top .location_area .address li p {float: left; width: calc(100% - 100px); color: #333;}
.sale_top .location_area .com_info {position: absolute; bottom: 0; left: 0; right: 0; width: 100%; height: 114px; background-color: #eff0f2;}
.sale_top .location_area .com_info > div {position: absolute; top: 50%; transform: translateY(-50%);}
.sale_top .location_area .com_info .txt_box {left: 40px;}
.sale_top .location_area .com_info .txt_box strong {font-size: 20px; font-weight: 400; color: #333;}
.sale_top .location_area .com_info .txt_box p {margin: 5px 0 0 0; font-size: 20px; font-weight: 600; color: #333;}
.sale_top .location_area .com_info .btn_box {right: 40px;}
.sale_top .location_area .com_info .btn_box button {position: relative; float: left; width: 100px; height: 74px; margin: 0 0 0 10px;}
.sale_top .location_area .com_info .btn_box button p {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; line-height: 1.4; font-weight: 500; text-align: center;}
.sale_top .location_area .com_info .btn_box .btn_add {background-color: transparent; border: 1px solid #364e9a;}
.sale_top .location_area .com_info .btn_box .btn_add p {color: #364e9a;}
.sale_top .location_area .com_info .btn_box .btn_inquiry {background-color: #364e9a; border: 1px solid #364e9a;}
.sale_top .location_area .com_info .btn_box .btn_inquiry p {color: #fff;}

.section {margin: 70px 0 0;}
.section .section_tit {display: block; padding: 0 0 15px; font-size: 26px; font-weight: 600; color: #333; border-bottom: 1px solid #333;}
.section .section_tit span {display: inline-block; margin: 0 0 0 15px; font-weight: 400; color: #999;}
.section .note_box {position: relative; margin: 20px 0 0 0; min-height: 400px; background-color: #eff0f2;}
.section .note_box p {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; color: #666; text-align: center; }

.table_type01 {width: 100%;}
.table_type01 tr {height: 60px; border-bottom: 1px solid #ddd;}
.table_type01 tr th {padding: 0 20px; font-weight: 400; color: #888; text-align: left; background-color: #eff0f2;}
.table_type01 tr th em {display: inline-block; color: #ff3939; vertical-align: middle;}
.table_type01 tr td {padding: 8.5px 20px; color: #333;}
.table_type01 tr td input {width: 380px; height: 43px; padding: 0 20px; color: #333; border: 1px solid #bbb;}
.table_type01 tr td select {width: 280px; height: 43px; padding: 0 40px 0 20px; color: #333; border: 1px solid #bbb; background: url(../images/sub/arrow_select_gray.png) no-repeat 248px center;}
.table_type01 tr td textarea {width: 100%; height: 140px; padding: 20px; color: #333; border: 1px solid #bbb; vertical-align: top;}
.table_type01 .hope_area > div:after {display: block; clear: both; *zoom: 1; content: '';}
.table_type01 .hope_area > div select {float: left; margin: 0 0 0 20px;}
.table_type01 .hope_area > div select:first-child {margin: 0;}
.table_type01 .hope_area > input {display: block; margin: 10px 0 0 0; width: 880px;}
.table_type01 .float_td input {float: left;}
.table_type01 .float_td .chk_wrap {float: left; margin: 10px 0 0 20px;}
.table_type01 .float_td .unit {float: left; margin: 0 0 0 20px; line-height: 43px; color: #333;}

/* 공유 오피스 상세 */
.board_view .price_area {margin: 40px 0 0; box-sizing: border-box; width: 100%; height: 100px; border: 10px solid #f6f6f6; text-align: center;}
.board_view .price_area p {height: 80px; line-height: 80px; font-weight: 500; color: #888;}
.board_view .price_area p em {display: inline-block; margin: 0 0 0 15px; font-weight: 400; color: #333;}
.board_view .price_area p span {display: inline-block; margin: 0 0 0 10px; font-weight: 400; color: #999;}

/* 사무실 내놓기 */
.bnn_top {overflow: hidden; height: 200px;position: relative;}
.bnn_top .txt_box {float: left; box-sizing: border-box; width: 100%; height: 200px; padding: 55px 0 0 80px; background-color: #364e9a;}
.bnn_top .txt_box strong {display: block; font-family: 'Montserrat'; font-size: 42px; font-weight: 700; color: #fff;}
.bnn_top .txt_box p {color: #fff;}
.bnn_top > strong {position: absolute;display: block; font-family: 'Montserrat'; font-size: 56px; font-weight: 700; color: #fff;vertical-align: top;top: 60px; right: 60px;}

.terms_box {margin: 20px 0 0 0; overflow-y: scroll; box-sizing: border-box; width: 100%; height: 240px; padding: 25px 30px; border: 1px solid #bbb;}
.terms_box table {margin: 0 0 15px; width: 100%; border: 1px solid #ddd;}
.terms_box table tr {border-bottom: 1px solid #ddd;}
.terms_box table th {padding: 10px 20px; font-size: 14px; font-weight: 400; color: #333; text-align: left; background-color: #eff0f2;}
.terms_box table td {padding: 10px 20px; line-height: 1.7; font-size: 14px; color: #666;}
.terms_box p {line-height: 1.7; font-size: 14px; color: #666;}
.terms_agree {margin: 15px 0 0 0;}
.terms_agree:after {display: block; clear: both; *zoom: 1; content: '';}
.terms_agree .chk_box {float: right;}

/* 관심매물 */
.tab_contents .office_list li {transform: scale(1); transition: all 0.2s ease-in-out;}



/* 회사소개 */
.company_top {position: relative;}
.company_top img {vertical-align: top;}
.company_top .txt_box {position: absolute; top: 110px; right: 0; box-sizing: border-box; width: 570px; height: 430px; padding: 60px 0 60px 80px; background-color: #364e9a;}
.company_top .txt_box strong {display: block; position: relative; padding: 0 0 25px; margin: 0 0 24px; font-size: 32px; font-weight: 900; color: #fff;}
.company_top .txt_box strong:before {display: block; position: absolute; bottom: 0; left: 0; width: 100px; height: 1px; background-color: #fff; content: '';}
.company_top .txt_box p {line-height: 1.7; color: #fff;}
.company_top .txt_box p + p {margin: 10px 0 0;}
.company .section .section_tit {margin: 0 0 30px; font-size: 32px;}
.company .num_list > li:after {display: block; clear: both; *zoom: 1; content: '';}
.company .num_list > li + li {margin: 90px 0 0;}
.company .num_list .title {float: left; width: 300px; line-height: 38px; font-size: 26px; color: #333;}
.company .num_list .title span {display: inline-block; margin: 0 8px 0 0; line-height: 38px; font-family: 'Montserrat'; font-size: 20px; font-weight: 700; color: #364e9a; vertical-align: top;}
.company .num_list .title.ft_20 {position: relative; box-sizing: border-box; padding: 0 0 0 40px; line-height: 30px; font-size: 20px;}
.company .num_list .title.ft_20 span {position: absolute; top: 0; left: 0; line-height: 30px;}
.company .num_list .con_wrap {float: left; width: calc(100% - 300px); padding: 5px 0 0;}
.company .num_list .con_wrap .txt {margin: 0 0 30px; line-height: 1.6; color: #666;}
.consulting_box:after {display: block; clear: both; *zoom: 1; content: '';}
.consulting_box > li {position: relative; float: left; box-sizing: border-box; margin: 10px 0 0; width: 260px; height: 180px; border: 8px solid #dbefff; border-radius: 30px; background-color: #fff;}
.consulting_box > li > div {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; text-align: center;}
.consulting_box > li > div strong {display: block; font-size: 30px; font-weight: 900; color: #3694dc;}
.consulting_box > li > div p {font-weight: 500; color: #3694dc;}
.consulting_box .blue_box {margin: 0 40px; width: 280px; height: 200px; background-color: #3694dc; border: 0;}
.consulting_box .blue_box:before {display: block; position: absolute; top: 50%; transform: translateY(-50%); left: -56px; width: 56px; height: 18px; background: url(../images/sub/arrow_blue_l.png) no-repeat 0 0; content: ''; z-index: 1;}
.consulting_box .blue_box:after {display: block; position: absolute; top: 50%; transform: translateY(-50%); right: -56px; width: 56px; height: 18px; background: url(../images/sub/arrow_blue_r.png) no-repeat 0 0; content: ''; z-index: 1;}
.consulting_box .blue_box div strong {font-family: 'Montserrat'; font-size: 40px; font-weight: 700; color: #fff;}
.consulting_box .blue_box div p {color: #fff;}
.total_service {position: relative; margin: 0 0 0 250px; width: 380px; padding: 30px 0 0 0;}
.total_service strong {display: block; box-sizing: border-box; width: 380px; height: 380px; line-height: 340px; font-size: 30px; color: #364e9a; text-align: center; border: 20px solid #e9ebf0; background-color: #fff; border-radius: 50%;}
.total_service ul {position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%;}
.total_service ul li {position: absolute; width: 148px; height: 148px; line-height: 148px; font-size: 22px; font-weight: 600; color: #fff; text-align: center; border-radius: 50%;}
.total_service ul li:nth-child(1) {top: 0; left: -35px; background-color: #5374d9; box-shadow: 10px 10px 20px rgba(80,107,192,0.5);}
.total_service ul li:nth-child(2) {top: 0; right: -35px; background-color: #3694dc; box-shadow: 10px 10px 20px rgba(54,148,220,0.5);}
.total_service ul li:nth-child(3) {top: 205px; right: -100px; background-color: #62b3f2; box-shadow: 10px 10px 20px rgba(98,179,242,0.5);}
.total_service ul li:nth-child(4) {top: 326px; left: 115px; background-color: #5c8ae7; box-shadow: 10px 10px 20px rgba(92,126,231,0.5);}
.total_service ul li:nth-child(5) {top: 205px; left: -100px; background-color: #35b7ed; box-shadow: 10px 10px 20px rgba(53,183,237,0.5);}
.service_table {width: 100%;}
.service_table thead tr {height: 44px;}
.service_table th {font-size: 14px; font-weight: 500; color: #fff; text-align: center;}
.service_table th:nth-child(1) {background-color: #364e9a;}
.service_table th:nth-child(2) {background-color: #365ba7;}
.service_table th:nth-child(3) {background-color: #3671bb;}
.service_table th:nth-child(4) {background-color: #3686ce;}
.service_table th:nth-child(5) {background-color: #3694dc;}
.service_table tbody tr {height: 100px; border-bottom: 1px solid #ddd;}
.service_table td {line-height: 1.7; color: #333; text-align: center;}
.company .num_list02 > li + li {margin: 25px 0 0;}
.company .num_list02 .con_wrap .txt {margin: 0;}
.company .num_list02 .con_wrap .txt + .txt {margin: 15px 0 0;}
.company .num_list02 .con_wrap .txt span {display: inline-block; font-weight: 500; vertical-align: top;}
.company .num_list02 .con_wrap .txt .green_bus {color: #0ca74f;}
.company .num_list02 .con_wrap .txt .village_bus {color: #51a622;}
.company .num_list02 .con_wrap .txt .subway_2 {color: #3b9f37;}
.company .num_list02 .con_wrap .txt .subway_7 {color: #5b692e;}
.company .num_list02 .con_wrap .txt .subway_9 {color: #b39627;}
.map_area {margin: 50px 0 0; width: 100%; height: 460px;}
.map_area iframe {width: 100%; height: 100%; vertical-align: top;}



/* 이용약관, 개인정보처리방침 */
.data {min-height: 200px;}
.data .article_tit {display: block; margin: 30px 0 10px; font-size: 18px; font-weight: 500; color: #333;}
.data .article_tit:first-child {margin: 0 0 10px;}
.data .article_tit + .article_tit {margin-top: 0;}
.data p {line-height: 1.7; color: #666; word-break: keep-all;}
