@charset "utf-8";

/* desktop */
@media screen and (min-width: 942px){
	.ipad-portrait{display: none;}
	#m_controlBtn, #mobileBgLayer, #mobileNavWrap{
		display: none!important;
	}
	.fixed #headerTopZone{
		height: 75px;
	}
	.fixed #headerTopZone #logoWrap a{
		height: 48px;
	}
	#headerZone:not(.fixed) #headerTopZone #logoWrap a img.desktop{
		/* height: 56px; */
		/* width: 317px; */
	}
}
@media screen and (min-width: 1240px) {
	
}
@media screen and (min-width: 942px) and (max-width: 1150px){
	
	#menuZone #mainMenu>li .subLv > div.heading{
		width: 250px;
	}
	#menuZone #mainMenu>li .subLv > div.subLv2{
		width: calc(100% - 250px - 400px);
	}
	#menuZone #mainMenu>li .subLv > div.subLv3{
		width: 400px;
	}
	#menuZone #mainMenu>li .subLv > div.subLv2 ul ul{
		width: 400px;
	}
}
/*** tablet & desktop */
@media screen and (min-width: 768px) {
	#headerTopZone #logoWrap a img.desktop{
		display: block!important;	
	}
	.mobile{
		display: none!important;
	}
	#content table.no_style.desktop-60{
		width: 60%!important;
	}
	#sectionImgZone #bannerImg{
		min-height: 250px;
	}
}
/* tablet & mobile */
@media screen and (max-width: 941px){
	
	body.openMenu{
		overflow: hidden;
		padding-right: 15px;
	}
	#top_nav, #menuZone, #leftZone{
		display: none!important;
	}
	#headerTopZone{
		padding-right: 0;
		/* border-top: 3px solid #4291cf; */
	}
	#headerZone{
		border: 0;
	}
}
@media screen and (max-width: 1239px) {
	
	html {
		-webkit-text-size-adjust: 100%;
	  }
	 #leftZone{
		display: none!important;
	}
	 #menuZone #mainMenu>li>a{
		 font-size: 0.88888em;
	 }
	#menuZone #mainMenu>li{
		margin: 10px 16px;
	}
	#menuZone .container{
		padding: 0 10px;
	}
	#footerZone{
		display: block;
	}
	#footerZone>div{
		width: 100%!important;
	}
	#footerZone>div#rightFooter{
		text-align: left;
		padding-top: 15px;
		width: calc(100% - 50px)!important;
	}
	#footerZone>div#rightFooter>div {
		flex-wrap: wrap;
	}
	#footerZone>div#rightFooter>div a{
		margin-top: 10px;
	}
	#btmNavWrap{
		padding-bottom: 10px;
	}
	#btmNavZone{
		text-align: left;
	}
	#btmNavWrap a{
		margin-bottom: 5px;
	}
	#btmNavOuter{
		flex-wrap: wrap;
	}
	#social{
		order: 1;
		margin-bottom: 10px;
	}
	#btmNavZone{
		flex: 0 0 100%;
		order: 2;
	}
	#announcement-wrap .container>div.img{
		display: none!important;
	}
	#breadcrumbeWrap{
		padding-left: 0;
	}
	#contentWrap{
		width: 100%;
		padding-bottom: 30px!important;
	}
	#content li.leaf.blue .nodecontent{
		height: auto;
		min-height: 70px;
		width: auto;
	}
}
@media screen and (min-width: 1001px){
	
	#content .orgchart li.w-33{
		width: 33.3%;
	}
	#content .org_flex{
		display: flex;
		width: 100%;
	}
	#content .org_flex > div.w-75{
		flex: 0 0 75%;
	}
	#content .org_flex > div.w-25{
		flex: 0 0 25%;
	}
	#content .org_flex .orgchart li.root>.nodecontent{
		min-width: 200px;
	}
	
}
@media screen and (max-width: 1000px){
	
	#content .orgchart span.lb{
		display: none!important;
	}
	#content .orgchart li{
		display: block;
		width: 100%;
		padding: 5px;
	}
	#content .orgchart .nodecontent{
		display: block;
		width: 100%;
		padding: 10px;
		margin: 0!important;
		min-height: auto!important;
	}
	#content .orgchart li::before, #content .orgchart .nodecontent::after, #content .orgchart .nodecontent::before, #content .orgchart li.vertical > ul::before{
		display: none!important;
	}
	#content .orgchart ul{
		display: block;
		margin: 0 !important;
	}
	#content li.orange {
	    background-color: #F3C779;
	}
	#content li.purple {
	    background-color: #F7EEAB;
	}
	#content li.blue {
	    background-color: #C6E4F4;
	}
	#content li.lBlue{
		background-color: #E2F7F3;
	}
	#content .orgchart  ul.last > li{
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 0;
		padding-top: 0;
	}
	#content .orgchart  ul.last > li > div{
		border-bottom: 1px solid rgba(255,255,255,0.3);
		padding-top: 15px;
		padding-bottom: 15px;
	}
	#content .orgchart  ul.last > li:last-child > div{
		border-bottom: none;
	}
	#content li.leaf .nodecontent{
		width: 100%!important;
	}

}
/* iPad portrait*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

#headerTopZone #logoWrap a img.desktop{
		height:95%;	
	 }
}

/* tablet only */
@media screen and (min-width: 768px) and (max-width: 1239px) {
	
	 .cd{
		margin-bottom:15%;	
		width:700px;
		 white-space: nowrap;
		font-size:13.5px;
	 }
	.container{
		padding: 0 20px;
		max-width: 100%;
	}
	#middleBox.container{
		max-width: 1220px;
	}
	#headerTopZone{
		height: 80px;
	}
	#headerTopZone #logoWrap a{
		height: 44px;
	}
	
	.fixed #headerTopZone{
		height: 70px;
	}
	.fixed #headerTopZone #logoWrap a{
		height: 40px;
	}
	
	#announcement-wrap .container #aClose{
		right: 20px;
	}
	#sectionNmae div{
		padding-right: 50px;
	}
	#middleOuter{
		padding: 25px 0;
	}
	#breadcrumb, #contentWrap, #middleOuter.noLeft #contentWrap{
		padding-left: 30px;
		padding-right: 30px;
	}
	#contentWrap{
		padding-top: 20px;
	}
	h1{
		margin-bottom: 20px;
	}
	#content div.flexbox.two-col>div:nth-child(2n+1){
		padding-right: 10px;
	}
	#content div.flexbox.two-col>div:nth-child(2n){
		padding-left: 10px;
	}
	#content div.flexbox.three-col>div{
		width: 50%;
		margin-top: 20px;
	}
	#content div.flexbox.three-col>div:nth-child(-n+3){
		margin-top: 20px;
	}
	#content div.flexbox.three-col>div:nth-child(-n+2){
		margin-top: 0px;
	}
}
/* mobile only */
@media screen and (max-width: 767px) {
	.ipad-portrait{display: none;}
	body{
		font-size: 16px;
		padding-right: 0!important;
	}
	.fancybox-slide--iframe .fancybox-content{
		width: 100%!important;
	}
	.container{
		padding: 0 15px;
	}
	#headerTopZone #logoWrap a img.mobile{
		display: block!important;
	}
	.desktop{
		display: none!important;
	}
	#headerTopZone{
		height: 70px;
	}
	#headerTopZone #logoWrap a{
		height: 45px;
	}
	#m_controlBtn a.menuBtn{
		width: 60px;
		margin-left: 10px;
	}
	#m_controlBtn a:not(.menuBtn){
		width: 35px;
		height: 35px;
	}
	#backtotop{
		width: 35px;
		height: 35px;
		right: 10px;
		bottom: 10px;
	}
	#backtotop:before{
		width: 12px;
		height: 12px;
		left: 12px;
		top: 15px;
	}
	#announcement-wrap .container #aClose{
		right: 10px;
	}
	#searchZone .searchTxt a{
		width: 60px;
		height: 40px;
		background-size: 30px 30px;
	}
	#searchZone .searchTxt input{
		line-height: 40px;
		height: 40px;
	}
	#m_controlBtn .langWrap .mLangZone{
		top: 51px;
	}
	#sectionImgZone #bannerImg{
		min-width: 0;
		width: 161%;
	}
	#sectionImgZone:before{
		display: none;
	}
	.fancybox-slide--iframe .fancybox-content{
		max-height: calc(100vh - 150px);
	}
	#sectionImgZone #bannerImg:before{
		position: absolute;
		content: '';
		left: 0;
		top: 0;
		width: 100%;
		background: linear-gradient(to bottom, rgba(255,255,255,0) 10%, rgba(255,255,255,0.85) 55%);
		height: 100%;
	}
	#sectionNmae{
		width: 100%;
		left: 0;
		align-items: flex-end;
		font-size: 3.438em;
		min-width: 0;
	}
	#sectionNmae div{
		word-spacing: initial;
		padding: 15px 15px;
		text-align: center;
		width: 100%;
	}
	#middleContent{
		margin-top: 0;
		padding: 0;
		padding-bottom: 60px;
	}
	#breadcrumb, #contentWrap, #middleOuter.noLeft #contentWrap{
		padding: 0 15px!important;
	}
	#contentWrap, #middleOuter.noLeft #contentWrap{
		padding-top: 15px!important;
	}
	#middleOuter{
		padding: 20px 0 40px 0;
	}
	h1{
		margin-bottom: 15px;
		font-size: 1.875em;
	}
	#content .filterWrap{
		flex-wrap: wrap;
	}
	#content div.filterWrap>div{
		width: 100%;
		padding-right: 0;
		margin-bottom: 10px;
	}
	#content div.filterWrap>div:last-child{
		margin-bottom: 0;
	}
	#content div.filterWrap>div div.custom-select{
		width: 100%!important;
	}
	#content div.flexbox.two-col>div:nth-child(2n+1){
		padding-right: 5px;
	}
	#content div.flexbox.two-col>div:nth-child(2n){
		padding-left: 5px;
	}
	#content .pageWrap a:not(.cBtn).mobile_hidden{
		display: none!important;
	}
	#content .pageWrap a.cBtn{
		width: 35px;
		height: 35px;
		line-height: 35px;
	}
	#content .pageWrap a:not(.cBtn){
		width: 35px;
		height: 35px;
		line-height: 35px;
	}
	#content .pageWrap span{
		height: 35px;
		line-height: 26px;
	}
	#content .pageWrap a.cBtn:before{
		width: 10px;
		height: 10px;
	}
	#content .pageWrap a.cBtn.prevBtn:before{
		left: 12px;
		top: 12px;
	}
	#content .pageWrap a.cBtn.nextBtn:before{
		left: 12px;
		top: 12px;
	}
	#content .accordion-wrap .accordion .accordion-btn{
		padding-left: 10px;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	#content .accordion-wrap.milestone .accordion .accordion-btn{
		padding-left: 20px;
	}
	#content .accordion-wrap .accordion .accordion-content{
		padding: 10px;
	}
	#content .accordion-wrap .accordion .accordion-content .inner{
		padding-bottom: 10px;
	}
	#content .accordion-wrap .accordion:not(.btn-only) .accordion-btn:before{
		top: 15px;
	}
	#content .accordion-wrap.smart .accordion:not(.btn-only) .accordion-btn:before, #content .accordion-wrap.style2 .accordion:not(.btn-only) .accordion-btn:before, #content .accordion-wrap.career .accordion:not(.btn-only) .accordion-btn:before{
		   top: 50%;
		   margin-top: -6px;
    right: 33px;
	}
	#content .accordion-wrap.smart .accordion.active:not(.btn-only) .accordion-btn:before, #content .accordion-wrap.style2 .accordion.active:not(.btn-only) .accordion-btn:before, #content .accordion-wrap.career .accordion.active:not(.btn-only) .accordion-btn:before{
		   margin-top: -3px;
	}
	#content .accordion-wrap.milestone .accordion.active:not(.btn-only) .accordion-btn:before{
		margin-top: 1px;
	}
	#content div.flexbox.three-col{
		width: 100%;
		margin-left: 0;
	}
	#content div.flexbox.three-col>div{
		width: 100%;
		padding: 0;
		margin-top: 10px;
	}
	#content div.flexbox.three-col.video>div{
		margin-top: 15px;
	}
	#content div.flexbox.three-col>div:nth-child(-n+3){
		margin-top: 10px;
	}
	#content div.flexbox.reports>div{
		width: 100%!important;
		padding-right: 0!important;
		padding-left: 0!important;
		margin-top: 0!important;
	}
	#content div.flexbox.reports>div a{
		padding: 10px;
	}
	#content div.flexbox.reports>div:nth-child(4n), #content div.flexbox.reports>div:nth-child(4n-1){
		background-color: #f7f7f7;
	}
	#content div.flexbox.reports>div:nth-child(2n){
		background-color: #fff;
	}
	#content div.flexbox.reports>div a span.word{
		padding-left: 10px;
	}
	#content table.noBorder{
		width: 100%!important;
	}
	#content .data_stat_wrap ul {
		width: 100%!important;
		float: none;
		margin-bottom: 0;
		margin-top: 0;
	}
	#content .data_stat_wrap ul:first-child{
		margin-top: -15px;
	}
	#content .data_stat_wrap ul li{
		padding-right: 0;
	}
	#advSearchForm fieldset.fst1 table tr td{
		display: block;
		width: 100%!important;
	}
	#advSearchForm fieldset.fst1 table tr td:first-child{
		padding-bottom: 0;
	}
	#advSearchForm fieldset.fst1 table tr td:last-child{
		padding-top: 0;
	}
	#content img.to_right {
		float: none;
		padding-left: 0;
		display: block;
	}
	#content img.to_left {
		float: none;
		padding-right: 0;
		display: block;
	}
	#content img.to_right + ul, #content img.to_left + ul, #content ul{
		padding: 0!important;
	}
	#content .imgWrap.f_right, #content .imgWrap.f_left{
		float: none;
		margin-left: 0;
		margin-right: 0;
		text-align: center;
	}
}

@media screen and (max-width: 600px){
	
	#content div.flexbox.two-col>div{
		width: 100%!important;
		padding-right: 0!important;
		padding-left: 0!important;
		margin-top: 20px!important;
	}
	#content div.flexbox.two-col.btns>div{
		margin-top: 10px!important;
	}
	#content div.flexbox.two-col>div:first-child{
		margin-top: 0!important;
	}
	#sectionNmae.tender div.tender{
		font-size: 0.7em;
	}
}

@media screen and (max-width: 520px){
	
	#content div.sectionTopRight,#content div.sectionTopLeft{
		float: none;
		width: 100%;
		margin-left: 0;
		max-width: none;
	}
	#content div.sectionTopRight img,#content div.sectionTopLeft img{
		width: 100%;
		max-width: none;
	}
	#content div.sectionTopRight.video{
		width: 100%;
		height: 280px;
	}
	#sectionNmae.tender div.tender{
		font-size: 0.5em;
	}
}