﻿@charset "utf-8";
#main-wrap > * { z-index: 1; }

/* 전략물자 우려거래자 메인  ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* 비주얼영역 */
/* #main-wrap {position:relative; width:100%; height:100%; max-height:1000px; background:url('../images/main/visualBG.jpg') center center no-repeat; background-size:cover;} */
#main-wrap {display: flex; position:relative; width:100%; min-height: 100vh; background:url('../images/main/visualBG.jpg') center bottom no-repeat; background-size:cover; flex-direction: column;}
#main-wrap::after { content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4)); }

@media all and (max-width: 1200px){
}

@media all and (max-width: 1025px){
	#main-wrap {max-height:100%;}
}

@media all and (max-width: 769px){
}

@media all and (max-width: 481px){
}


/* 팝업창영역 */
#topPopWrap {position:relative; top:0; left:0; width:100%; height:100px; background:rgba(7,15,8,0.3); overflow:hidden;}
#topPopWrap > ul {width:1200px; height:70px; margin:15px auto; overflow:hidden;}
#topPopWrap > ul > li {position:relative; float:left; height:70px; box-sizing:border-box; padding:5px 10px 5px 85px; overflow:hidden;}
#topPopWrap > ul > li:nth-child(1) {background:url('../images/common/icn_commonPop01.png') 5px center no-repeat;}
#topPopWrap > ul > li:nth-child(2) {background:url('../images/common/icn_commonPop02.png') 5px center no-repeat;}
#topPopWrap > ul > li:nth-child(3) {background:url('../images/common/icn_commonPop03.png') 5px center no-repeat;}
#topPopWrap > ul.popNum1 > li {width:100%;}
#topPopWrap > ul.popNum1 > li > p {width:92%;}
#topPopWrap > ul.popNum2 > li {width:600px;}
#topPopWrap > ul.popNum2 > li:nth-child(2) {border-left:1px solid rgba(255,255,255,0.3);}
#topPopWrap > ul.popNum2 > li > p {width:83%;}
#topPopWrap > ul.popNum3 > li {width:33.3%;}
#topPopWrap > ul.popNum3 > li:nth-child(2) {border-left:1px solid rgba(255,255,255,0.3); border-right:1px solid rgba(255,255,255,0.3);}
#topPopWrap > ul.popNum3 > li > p {width:76%;}
#topPopWrap > ul > li > strong {display:block; color:#fff; font-size:17px; letter-spacing:-1.2px; margin-bottom:8px; word-break:keep-all; overflow:hidden;}
#topPopWrap > ul > li > p {font-size:13px; color:#dadada; line-height:18px; word-break:keep-all;}
#topPopWrap > ul > li > span {position:absolute; right:10px; bottom:5px; display:inline-block;}
#topPopWrap > ul > li > span a {display:inline-block; color:#fff; padding:2px 5px; font-size:12px; background:#252c40; border-radius:3px;}

@media all and (max-width: 1200px){
	#topPopWrap {min-width:970px;}
	#topPopWrap > ul {width:970px;}
	#topPopWrap > ul > li {padding:5px 5px 5px 80px;}
	#topPopWrap > ul.popNum3 > li > p {width:76.8%; letter-spacing:-1.5px;}
	#topPopWrap > ul > li > strong {font-size:15px;}
	#topPopWrap > ul > li > p {font-size:12px;}
	#topPopWrap > ul > li > span {right:5px;}
	#topPopWrap > ul > li > span a {font-size:11px;}
}

@media all and (max-width: 1025px){
	#topPopWrap {min-width:100%; height:auto; top:54px;}
	#topPopWrap > ul {width:100%; height:auto; margin:0 auto;}
	#topPopWrap > ul > li {float:none; height:70px; padding:12px 10px;}
	#topPopWrap > ul > li:nth-child(1) {background:none;}
	#topPopWrap > ul > li:nth-child(2) {background:none;}
	#topPopWrap > ul > li:nth-child(3) {background:none;}
	#topPopWrap > ul.popNum3 > li {width:100%;}
	#topPopWrap > ul.popNum3 > li:nth-child(2) {border-top:1px solid rgba(255,255,255,0.3); border-bottom:1px solid rgba(255,255,255,0.3);}
	#topPopWrap > ul.popNum3 > li > p {width:100%; margin-top:5px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
	#topPopWrap > ul > li > strong {width:80%; font-size:15px; margin-bottom:0;}
	#topPopWrap > ul > li > span {right:10px; bottom:0; top:9px;}
}

@media all and (max-width: 769px){
}

@media all and (max-width: 481px){
}


/* 콘텐츠영역 */
.contMain { display: flex; position: relative; width:100%; flex: 1; align-items: center; justify-content: center; flex-wrap: wrap; overflow:hidden;}
.contMain .map_wrap {  width: 100%; height: 100%; }
.contMain .map_wrap object { width: 100%; max-height: 780px; }
.contMain .info_wrap { position: absolute; width: 100%; max-width: 1260px; transform: translateY(-150px); }
.contMain .info_wrap h2 { font-size: 65px; letter-spacing: -0.2px; color: #fff; line-height: 1.2em; font-weight: 600; }
.contMain .search_wrap {  position: absolute; width: 100%; max-width: 1260px; bottom: 50px; }
.contMain .search_wrap * { border: none; outline: none; }
.contMain .search_wrap .search_detail { display: inline-flex; padding: 0.8em 2em 0.8em 1.2em; margin-bottom: 10px; background: transparent url('../images/btnIcn/btn_arrRight.png') no-repeat center right 0.8em; background-size: 8px; color: #ffffff; border: 2px solid #ffffff; border-radius: 50rem; justify-content: center; align-items: center; transition: all 0.2s; }
.contMain .search_wrap .search_detail:hover { background: rgba(255, 255, 255, 0.1) url(../images/btnIcn/btn_arrRight.png) no-repeat center right 0.8em ; background-size: 8px; }
.contMain .search_wrap .search { display: flex;  height: 80px;box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px; }
.contMain .search_wrap .search input { flex: 1; padding: 16px; font-size: 22px; color: #aaa; }
.contMain .search_wrap .search button { display: inline-flex; width: 80px; height: 100%; font-size: 30px; background: #f5821f; color: #fff; cursor: pointer; align-items: center; justify-content: center; }
.contMain .search_wrap .search button:hover { background: #ff8822; }

@media all and (max-width: 1200px){
}

@media all and (max-width: 1025px){
	.contMain .info_wrap h2 { font-size: 52px; }
	.contMain .search_wrap .search { height: 70px; }
	.contMain .search_wrap .search button { width: 70px; }
	.contMain .search_wrap .search input { font-size: 20px; }
}

@media all and (max-width: 769px){
	.contMain .info_wrap h2 { font-size: 40px; }
	.contMain .search_wrap .search { height: 65px; }
	.contMain .search_wrap .search button { width: 65px; }
	.contMain .search_wrap .search button i { font-size: 22px; }
	.contMain .search_wrap .search input { font-size: 18px; }
}

@media all and (max-width: 481px){
	.contMain .info_wrap h2 { font-size: 26px; text-align: center; }
	.contMain .search_wrap { top: 50%; }
	.contMain .search_wrap .search_detail { font-size: 14px; }
	.contMain .search_wrap .search { height: 50px; }
	.contMain .search_wrap .search button { width: 50px; }
	.contMain .search_wrap .search button i { font-size: 16px; }
	.contMain .search_wrap .search input { font-size: 20px; }
}



/* 대상품목조회 */
.searchMN {width:100%; box-sizing:border-box; padding:30px; text-align:center; margin:0; border-radius:8px; background:rgba(0,0,0,0.3); overflow:hidden;}
.searchMN h2 {font-size:18px; line-height:1.2; font-weight:500; color:#fff; text-align:left; margin-bottom:20px; word-break:keep-all;}
.searchMN .search-area {width:100%; height:50px; background:#fff; overflow:hidden;}
.searchMN .search-area > div {float:left; position:relative;}
.searchMN .search-area > div:after {display:block; content:""; position:absolute; top:28%; right:0; width:1px; height:24px; background:#e5e5e5;}
.searchMN .search-area > div select {border:none; width:200px; height:50px; font-size:16px; font-weight:500; appearance:none; -webkit-appearance:none; box-sizing:border-box; padding:0 20px 0 15px; background:url('../images/main/select_arr.png') right 20px center no-repeat;}
.searchMN .search-area > div select::-ms-expand {display:none; background:url('../images/main/select_arr.png') right center no-repeat;}
.searchMN .search-area > label {float:left; width:calc(100% - 250px);}
.searchMN .search-area > label input {width:100%; height:50px; font-size:15px; box-sizing:border-box; padding:0 20px; border:none;}
.searchMN .search-area > button {float:right; width:50px; height:50px; border:none; background:none; cursor:pointer;}
.searchMN .search-area > button i {font-size:22px;}

@media all and (max-width: 1200px){
}

@media all and (max-width: 1025px){ 
}

@media all and (max-width: 769px){
	.searchMN {width:100%; padding:25px 20px;}
	.searchMN > div.search-area {height:101px; padding:0;}
	.searchMN > div.search-area > div {width:100%; box-sizing:border-box; border-bottom:1px solid #e5e5e5;}
	.searchMN > div.search-area > div select {width:100%;}
	.searchMN > div.search-area > label {width:calc(100% - 50px);}
	.searchMN > div.search-area > label input {padding:0 15px;}
}

@media all and (max-width: 481px){
}


/* 문의 */
.inquiryMN * {word-break:keep-all;}
.inquiryMN {float:left; display:table; width:calc(100% - 550px); height:290px; text-align:center; color:#fff;}
.inquiryMN > div {display:table-cell; vertical-align:middle; box-sizing:border-box; padding:0 15px;}
.inquiryMN > div h4 {font-size:32px; line-height:1.2; font-weight:500; margin-bottom:20px; text-shadow:1px 1px 10px rgba(0,0,0,0.3);}
.inquiryMN > div dl {margin-top:20px; overflow:hidden;}
.inquiryMN > div dl dt {display:inline; font-size:32px; line-height:42px; font-weight:500; text-shadow:1px 1px 10px rgba(0,0,0,0.3);}
.inquiryMN > div dl dd {display:inline; font-size:42px; line-height:42px; letter-spacing:0; font-weight:bold; margin-left:10px; text-shadow:1px 1px 10px rgba(0,0,0,0.3);}

@media all and (max-width: 1200px){
	.inquiryMN > div dl dt {font-size:28px;}
	.inquiryMN > div dl dd {font-size:30px;}
}

@media all and (max-width: 1025px){
	.inquiryMN {float:none; width:100%; height:auto; margin-bottom:40px;}
}

@media all and (max-width: 769px){
}

@media all and (max-width: 590px){
	.inquiryMN > div h4 {font-size:28px;}
}

@media all and (max-width: 481px){
	.inquiryMN > div dl dt {display:block; font-size:22px; line-height:1.2;}
	.inquiryMN > div dl dd {font-size:20px;  line-height:1.6; margin:0;}
}


/* 배너 */
.bannerMN {float:left; width:360px; height:290px; margin:0 20px; overflow:hidden;}
.bannerMN > span {display:block; width:100%; height:100%; border-radius:10px; overflow:hidden;}
.bannerMN > span a {display:block;}

@media all and (max-width: 1200px){
}

@media all and (max-width: 1025px){
	.bannerMN {float:none; margin:0 auto 40px auto;}
}

@media all and (max-width: 769px){
}

@media all and (max-width: 481px){
	.bannerMN {float:none; width:100%; height:auto;}
	.bannerMN img {width:100%; height:auto;}
}


/* 방문자 수 */
.visitCountMN {float:right; width:150px; height:290px; border-radius:10px; background:rgba(0,0,0,0.3); overflow:hidden;}
.visitCountMN li {display:table; width:80%; height:145px; margin:0 auto; box-sizing:border-box; padding:10px 0;}
.visitCountMN li:nth-child(2) {border-top:1px solid rgba(255,255,255,0.2);}
.visitCountMN li div {display:table-cell; vertical-align:middle; text-align:center; color:#fff;}
.visitCountMN li div > strong {font-size:28px; font-weight:bold; letter-spacing:0;}
.visitCountMN li div > p {font-size:16px; margin-top:10px;}

@media all and (max-width: 1200px){
}

@media all and (max-width: 1025px){
	.visitCountMN {float:none; width:100%; height:120px; box-sizing:border-box; padding:10px 0;}
	.visitCountMN li {float:left; width:50%; height:100px;}
	.visitCountMN li:nth-child(2) {border-top:none; border-left:1px solid rgba(255,255,255,0.2);}
}

@media all and (max-width: 769px){
}

@media all and (max-width: 481px){
}


/* 주요동향-현지동향-정책자료 */
.boardMN {width:1200px; margin:0 auto; color:#fff; padding:30px 0; overflow:hidden;}
.boardMN > li {float:left; width:calc((100% - 60px) / 3);}
.boardMN > li:nth-child(2) {margin:0 30px;}
.boardMN > li > h3 {font-size:18px; font-weight:500; margin-bottom:6px; cursor:pointer;}
.boardMN > li > h3 i {margin-left:10px;}
.boardMN > li > ul {width:100%; height:158px; overflow:hidden;}
.boardMN > li > ul > li {margin-top:8px; overflow:hidden;}
.boardMN > li > ul > li > p {float:left; width:calc(100% - 85px);}
.boardMN > li > ul > li > p a {display:block; color:#fff; width:100%; font-size:15px; line-height:22px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.boardMN > li > ul > li > p a:hover {text-decoration:underline;}
.boardMN > li > ul > li > p a > em {display:inline-block; width:50px; height:22px; font-style:normal; font-size:12px; line-height:22px; text-align:center; border-radius:2px; margin-right:10px;}
.boardMN > li > ul > li > span {display:block; float:right; width:85px; text-align:right; letter-spacing:0; opacity:0.8;}

/* 주요동향-현지동향-정책자료 포인트색상 */
.bdPoint1 {background:#005aa0;}
.bdPoint2 {background:#f08200;}
.bdPoint3 {background:#d6000f;}

@media all and (max-width: 1200px){
	.boardMN {width:970px;}
}

@media all and (max-width: 1025px){
	.boardMN {width:100%; box-sizing:border-box; padding:30px 20px;}
	.boardMN > li {float:none; width:100%;}
	.boardMN > li:nth-child(2) {margin:15px 0; box-sizing:border-box; padding:15px 0; border-top:1px solid rgba(255,255,255,0.2); border-bottom:1px solid rgba(255,255,255,0.2);}
	.boardMN > li > ul {height:auto; max-height:158px;}
}

@media all and (max-width: 769px){
}

@media all and (max-width: 481px){
}

/* 하단영역 - 메인 */
/* .footerMain {  }
.footerMain * { color: #fff; }
.footerMain .footerCmn { display: flex; padding: 25px 0; align-items: flex-end; flex-wrap: wrap; justify-content: space-between; line-height: 1.6em; }
.footerMain .footerCmn ul { display: flex; gap: 10px; justify-content: flex-end; }
.footerMain .footerCmn ul li { display: inline-flex; position: relative; align-items: center; }
.footerMain .footerCmn ul li + li { padding-left: 10px; }
.footerMain .footerCmn ul li + li::before { content: ""; display: inline-block; position: absolute; width: 1px; height: 0.8em; left: 0; background: #fff ; opacity: .3; }
.footerMain .footerCmn ul li strong {color: #f5821f;}
@media all and (max-width: 1400px){
}

@media all and (max-width: 1025px){
}

@media all and (max-width: 769px){
}

@media all and (max-width: 481px){
} */

/* 레이어팝업 - 메인 */
.layerPopup {position:absolute; background:#fff; z-index:999999; box-shadow:0 0 10px rgba(0,0,0,0.2);}
.layerPopup > div {width:100%; font-size:16px; box-sizing:border-box; padding:5px; overflow:hidden;}
.layerPopup > dl {padding:10px; font-size:13px; color:#fff; background:#1f1f3c; overflow:hidden;}
.layerPopup > dl > dt {float:left; cursor:pointer;}
.layerPopup > dl > dd {float:right; cursor:pointer;}

@media all and (max-width: 769px){
	.layerPopup {width:80% !important; height:auto !important; left:50% !important; transform:translate(-50%);}
	.layerPopup img {width:100% !important; height:auto !important;}
	
	#layer_0 {top:90px !important; left:15% !important; transform:translate(-15%);}
	#layer_1 {top:120px !important;}
	#layer_2 {top:150px !important; left:40% !important; transform:translate(-40%);}
	#layer_3 {top:170px !important; left:25% !important; transform:translate(-25%);}
	#layer_4 {top:200px !important; left:60% !important; transform:translate(-60%);}
}

