@charset "utf-8";

/* not data */
.not-data {display:table; width:100%; height:200px;}
.not-data p {display:table-cell; vertical-align: middle;}
@media only screen and (max-width:450px) {
    .not-data p {text-align: center;}
}

/* search bar */
.table-wrap {position:relative; width:100%;}
.table-wrap .search-bar {position:relative; width:100%; padding:32px 0; background-color:#f9f9f9; border:1px solid #e5e5e5; border-top:2px solid #171c61; display:table; margin-bottom:50px;}
.table-wrap .search-bar .search-box {position:relative;  display:table-cell; vertical-align:middle; height:auto; margin:0 auto; text-align:center;}
.table-wrap .search-bar .search-box input {width:400px; height:48px; border:2px solid #282828; box-sizing:inherit; text-align:left; text-indent:4px;}
.table-wrap .search-bar .search-box button {margin-top:1px; width:60px; height:48px; background-color:#464e5b; color:#fff; vertical-align: top; box-sizing:inherit; border:2px solid #3d4450; }
.table-wrap .search-bar .search-box button span {font-size:3rem; line-height:48px;}

.table-wrap .basic-search-bar {position:relative; width:100%; padding:24px 0; background-color:#fafafa; border:1px solid #e5e5e5; display:table; margin-bottom:50px;}
.table-wrap .basic-search-bar .search-box {position:relative;  display:table-cell; vertical-align:middle; height:auto; margin:0 auto; text-align:center;}
.table-wrap .basic-search-bar .search-box select {padding-left:10px; width:120px; height:38px; line-height:38px; background-color:#fff; vertical-align:text-top; border:1px solid #a4a4a4;}
.table-wrap .basic-search-bar .search-box input {width:280px; height:38px; border:1px solid #a4a4a4; box-sizing:inherit; text-align:left; text-indent:4px; vertical-align:top;}
.table-wrap .basic-search-bar .search-box button {width:auto; height:38px; padding-left:16px; padding-right:16px; background-color:#595a5e; color:#fff; vertical-align:text-top; box-sizing:inherit; border:1px solid #595a5e; font-weight:400;}
.table-wrap .basic-search-bar .search-box button span {font-size:2.4rem; line-height:38px;}

@media only screen and (max-width:600px) {
    .table-wrap .search-bar {margin-bottom:30px;}
    .table-wrap .search-bar .search-box input {width:70%;}
    .table-wrap .search-bar .search-box button {width:54px;}

    .table-wrap .basic-search-bar .search-box select, .table-wrap .basic-search-bar .search-box input, .table-wrap .basic-search-bar .search-box button {width:90%; margin-bottom:4px;}
    .table-wrap .basic-search-bar .search-box button {margin-bottom:0;}
}

@media only screen and (max-width:450px) {
    .table-wrap .search-bar .search-box input {width:68%;}
    .table-wrap .search-bar .search-box button {width:48px;}
}

/* nav */
.table-wrap .basic-header {position:relative; width:100%;}
.basic-header .total {float:left;}
.basic-header .total p, .basic-header .search-txt p {display:inline-block; letter-spacing: 0;}
.basic-header .total p span, .basic-header .search-txt p span {font-weight:600; color:#222;}
.basic-header .total p span.fw300 {font-weight:300;}


.basic-bnav ul {text-align:center;}
.basic-bnav ul li {display:inline-block; cursor:pointer; margin-right:4px; padding:8px 15px; border:1px solid #e1e1e1;}
.basic-bnav ul li a {display:block; text-decoration:none; padding:8px 15px; color:#565656;}
.basic-bnav ul li.disabled {color:#c4c4c4; background-color:#f0f0f0; cursor:default;}
.basic-bnav ul li.active {background-color:#285943; border: 1px solid #244f3c; color:#fff; cursor:default;}

.basic-bnav ul li.active, .basic-bnav ul li:not(.disabled):hover {background:#335a84; border:1px solid #335a84; color:#fff;}
.basic-bnav ul li:not(.disabled):hover a {color:#fff;}

@media screen and (max-width: 600px) {
    .basic-header .total, .basic-header .search-txt {width:100%;}
    .basic-bnav ul li.pc-view {display:none;}
}

/* plist grid design */
.basic-plist {position:relative; width:100%; margin:10px 0 40px 0; overflow:hidden;}
.basic-plist ul li.plist-grid {position:relative; width:50%; float:left; margin-bottom:60px;}
.basic-plist ul li.plist-grid:last-child {margin-bottom:30px;}
.plist-grid:nth-child(2n - 1) {padding:0 30px 0 0;}
.plist-grid:nth-child(2n) {padding:0 0 0 30px;}

.plist-grid-wrap {border:1px solid #e9e9e9; text-align:center; padding:20px 20px}
.plist-grid-wrap .grid-img {width:100%; text-align:center; padding:0 0;}
.plist-grid-wrap .grid-img img{max-width:500px; max-height:300px;}
.plist-grid-wrap h2 {text-align:center; color:#345391;}

.plist-grid-wrap2 {border:1px solid #e9e9e9; text-align:center; }
.plist-grid-wrap2 .grid-img {width:100%; text-align:center; padding:40px 0;}
.plist-grid-wrap2 .grid-img img{max-width:300px; max-height:180px;}
.plist-grid-wrap2 h2 {text-align:center; color:#345391;}


ol.list-dot {width:100%; padding:40px 20px;}
ol.list-dot li {position:relative; display:block; width:100%; padding:0 0 6px 16px; text-align:left; line-height:1.3;}
ol.list-dot li:last-child {padding:0 0 0 16px;}
ol.list-dot li span {position:absolute; top:0; left:0;}
.plist-grid-wrap a {position:relative; display:inline-block; padding:2px 18px 2px 18px; border:1px solid #464e5b; margin-top:10px;}
.plist-grid-wrap a:hover {background-color:#464e5b; color:#fff;}
.plist-grid-wrap a span {padding-left:6px;}

.plist-grid-wrap2 a {position:relative; display:inline-block; padding:2px 18px 2px 18px; border:1px solid #464e5b; margin-top:10px;}
.plist-grid-wrap2 a:hover {background-color:#464e5b; color:#fff;}
.plist-grid-wrap2 a span {padding-left:6px;}

@media screen and (max-width:768px) {
	.plist-grid-wrap .grid-img img{max-width:300px; max-height:200px;}
}

@media screen and (max-width: 600px) {
    .basic-plist ul li.plist-grid {width:100%;}
	.plist-grid:nth-child(2n - 1) {padding:0;}
	.plist-grid:nth-child(2n) {padding:0;}

	.plist-grid-wrap .grid-img {padding:20px 0;}
	ol.list-dot {padding:40px 14px 20px 14px;}
	ol.list-dot li {padding:0 0 2px 12px;}
}

/* detail view */
.content-item {margin-bottom:20px;}
.content-item .back-link {position:relative; display:inline-block; padding:4px 24px 4px 14px; border:1px solid #464e5b; margin-top:1px;}
.content-item .back-link span {padding-right:14px;}
.content-item .back-link:hover {background-color:#464e5b; color:#fff;}

/* nav 2-2 세부 */
.content-header-bg {position:relative; width:100%; height:400px; background:url('../business/1/img_top_bg.jpg') no-repeat; background-size:cover;}
.content-header-bg p {position:absolute; bottom:0; left:0; width:100%; padding:30px 40px; background-color:rgba(0, 0, 0, .6); color:#fff; font-weight:600;}
.content-item p.bg-city {position:relative; padding:0 0 40px 0;}
.content-item p.bg-city:after {content:""; position:absolute; left:0; bottom:0; width:100%; height:100px; background:url('../business/1/img_city_back.png') repeat; background-size:auto 100px; opacity:.9;}

/* 이미지 컨테이너 */
.image-container {
	width: 100%;
	height: auto;
	position: relative;
}
/* 이미지 스타일 */
.responsive-image {
	width: 100%;
	height: auto;
	object-fit: cover; /* 이미지 비율을 유지하며 꽉 채우기 */
}


.detail-info {display:flex; width:100%; position:relative;}
.detail-info .detail-left {text-align:center; width:50%; float:left;}
.detail-info .detail-right {width:50%; float:left;}
.detail-info .detail-left img {max-width:400px; max-height:300px; text-align:center;}

.detail-info .detail-right .product-sort {padding:2px 20px; color:#fff; background-color:#464e5b; }
.detail-info .detail-right > h2 {color:#345391;}
.detail-info .detail-right > p {color:#333; font-weight:400;}
.detail-info .detail-right ol.list-dot {padding:40px 0 0 0;}

.detail-info .detail-right .btn-group {width:100%; position:relative; padding:40px 0 0 0;}
.btn-group ul li {float:left; display:inline-block; width:33.3333%;}
.btn-group ul li:nth-child(1) {padding:0 10px 0 0;}
.btn-group ul li:nth-child(2) {padding:0 5px 0 5px;}
.btn-group ul li:nth-child(3) {padding:0 0 0 10px;}
.btn-group ul li a {display:block; padding:12px 12px; background-color:#464e5b; color:#fff; border:1px solid #404753; text-align:center;}
.btn-group ul li a span {padding-right:6px;}

.size-wrap {position:relative; width:100%; text-align:center;}
.size-wrap img {max-width:60%;}
.table-dl dl {display:flex; position:relative; width:100%;}
.table-dl dl dt, .table-dl dl dd {float:left; display:inline-block; padding:16px 0; text-align:center; text-align:left; border-left:1px solid #cdcdcd; border-bottom:1px solid #cdcdcd;}
.table-dl dl:before,
.table-dl dl:after {content:""; display:block; clear:both;}
.table-dl dl:first-child dt, .table-dl dl:first-child dd {border-top:1px solid #cdcdcd;}

.table-dl dl dt {width:30%; background-color:#f0f2f7;}
.table-dl dl dd {width:70%; border-right:1px solid #cdcdcd;}
.table-dl dl dt label, .table-dl dl dd label {position:relative; display:block; width:100%; line-height:1.3; padding:0 20px 6px 20px;}
.table-dl dl dt label b, .table-dl dl dd label b {font-weight:400;}
.table-dl dl dt label:last-child, .table-dl dl dd label:last-child {padding:0 20px 0 20px;}

@media screen and (max-width:900px) {
	.detail-info .detail-left {width:40%;}
	.detail-info .detail-right {width:60%;}
	.detail-info .detail-left img {max-width:300px; max-height:240px; text-align:center;}
}

@media screen and (max-width:768px) {
	.detail-info {display:block;}
	.detail-info .detail-left, .detail-info .detail-right {width:100%;}
	.detail-info .detail-left {margin-bottom:40px;}
}

@media screen and (max-width:450px) {
	.table-dl dl dt {width:32%;}
	.table-dl dl dd {width:68%;}
	.table-dl dl dt label, .table-dl dl dd label {padding:0 10px 6px 10px;}
	.table-dl dl dt label:last-child, .table-dl dl dd label:last-child {padding:0 10px 0 10px;}
	.btn-group ul li {width:50%;}
	.btn-group ul li:nth-child(1) {padding:0 5px 0 0;}
	.btn-group ul li:nth-child(2) {padding:0 0 0 5px;}
	.btn-group ul li:nth-child(3) {padding:0 5px 0 0;}
	.btn-group ul li a {padding:8px 20px; text-align:left;}
	.size-wrap img {max-width:80%;}
}

/* detail - technology */
.technology-wrap {position:relative; width:100%;}
.technology-wrap ul li {width:33.33333%; float:left; margin-bottom:50px; min-height:380px;}
.technology-wrap ul li:nth-child(n+4) {margin-bottom:0;}

.technology-wrap ul li:nth-child(3n-2) {padding:0 20px 0 0;}
.technology-wrap ul li:nth-child(3n -1) {padding:0 10px 0 10px;}
.technology-wrap ul li:nth-child(3n) {padding:0 0 0 20px;}

.technology-wrap .technology-item {width:100%;}
.technology-wrap .technology-item .img-wrap {width:100%;}
.technology-wrap .technology-item .img-wrap img {width:100%;}

.technology-wrap .technology-item h2 {padding:40px 0 6px 0; color:#345391;}


@media screen and (max-width:768px) {
	.technology-wrap ul li {width:50%; min-height:320px;}
	.technology-wrap ul li:nth-child(n+4) {margin-bottom:50px;}
	.technology-wrap ul li:nth-child(n+5) {margin-bottom:0;}

	.technology-wrap ul li:nth-child(3n-2) {padding:unset;}
	.technology-wrap ul li:nth-child(3n -1) {padding:unset;}
	.technology-wrap ul li:nth-child(3n) {padding:unset;}

	.technology-wrap ul li:nth-child(2n -1) {padding:0 14px 0 0;}
	.technology-wrap ul li:nth-child(2n) {padding:0 0 0 14px;}
}

@media screen and (max-width:600px) {
	.technology-wrap ul li:nth-child(2n -1) {padding:0 5px 0 0;}
	.technology-wrap ul li:nth-child(2n) {padding:0 0 0 5px;}
}

@media screen and (max-width:450px) {
	.technology-wrap ul li {width:100%; min-height:auto;}
	.technology-wrap ul li:nth-child(n+5) {margin-bottom:50px;}
	.technology-wrap ul li:last-child {margin-bottom:0;}

	.technology-wrap .technology-item h2 {padding:20px 0 6px 0;}
}