@charset "UTF-8"; 

/* 세레모니페이지 S */
.ceremonyWrap {position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; background:rgba(0,0,0,0.8);}
.ceremony {position:absolute; top:50%; left:50%; width:1000px; margin:-280px 0 0 -500px;}
.vidArea video {}
.txtArea {position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; background:rgba(19,48,91,0.8);}
.txtArea .table_cell {color:#fff; text-shadow:0 2px 2px rgba(0,0,0,0.5); word-break:keep-all; font-weight:600; box-sizing:border-box;}
.txtArea .table_cell h1 {font-size:6rem; padding:0 0 30px;}
.txtArea .table_cell h1 span {display:block; padding:0 10px;}
.txtArea .table_cell h1 span:first-child {font-family: 'Nanum Brush Script'; font-weight:400;}
.txtArea .table_cell h1 span:last-child {font-size:7rem;}
.txtArea .table_cell p {font-size: 1.5rem;margin:10px 0 0;}
.txtArea .table_cell h1.imgTitle {width: 50%;margin:0 auto;}
.skipCeremony .btnSkip {position:absolute;bottom:20px; right:20px; background:#fff; border-radius:5px; padding:10px 25px ; font-size:1rem; color:#111; font-weight:600;}
.skipCeremony .btnToday {position:absolute;top:-40px; right:0px; font-size:1rem; color:#fff;}

@media screen and (max-width:1280px) {
    .txtArea .table_cell h1 {font-size:4rem;}
    .txtArea .table_cell h1 span:last-child {font-size:5rem;}
    .txtArea .table_cell p {font-size:1.25rem;}
}
@media screen and (max-width:1000px) {
    .ceremony {width:90%; position:relative; margin:100px auto 0; left:auto; top:auto;}
    .skipCeremony .btnSkip {bottom:-60px; right:0;}
}
@media screen and (max-width:820px) {

    .txtArea .table_cell h1 {font-size:2.5rem;}
    .txtArea .table_cell h1 span:last-child {font-size:3rem;}
    .txtArea .table_cell h1.imgTitle {width: 60%;}
    .txtArea .table_cell p {font-size:1.025rem; font-weight:400; margin-top:0;}
}
@media screen and (max-width:540px) {
    .txtArea .table_cell {width:100%;}
    .txtArea .table_cell h1 {font-size:2rem;}
    .txtArea .table_cell h1 span:last-child {font-size:2.5rem;}
    .txtArea .table_cell p {font-size:0.85rem;}
}
/* 세레모니페이지 E */

.main_header .header_logo {background-image:url(../images/logo_header_main.png)}
.main_header .gnb_wrap {background:transparent}
.main_header .gnb_menu .depth1 {background:transparent}
.main_header .gnb_menu .depth1 a{color:#fff;}
.main_header .gnb_menu.on {background:transparent}
.main_header .gnb_wrap:before {display:none}

.mainContents{position:relative; margin:0 auto; max-width:1280px;}
.mainContents h2{color:#000; font-size:30px; margin-bottom:10px}
.mainContents .content{max-width:100%; margin:0 auto;}

@font-face {
    font-family: 'KOTRA_BOLD-Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10-21@1.1/KOTRA_BOLD-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


.main_visual {position:relative; width:100%; margin-top:-140px;}
.main_visual .visual_wrap {position:relative; margin:0 auto; max-width:1280px;}
.main_visual .visual_txt {margin-top:160px; color:#fff}
.main_visual .visual_txt .subject{font-size:52px; margin-right:15px; font-family:"KOTRA_BOLD-Bold";}
.main_visual .visual_txt .point {color:#fce524; font-size:58px; font-family:"Makgeolli";}
.main_visual .visual_txt .point img {width:auto; display:inline-block;}
.main_visual .visual_txt .txt_b{font-size:30px; font-weight:500; line-height:30px; margin-top:30px;}
.main_visual .visual_txt .txt_s{font-size:30px; font-weight:300; line-height:30px;}

.main_visual .visual_txt center iframe {margin-top:30px;}

.main_visual .btn_movie{position:absolute; z-index:50; top:420px; display:block; width:140px; height:50px; background:#00125d url(../images/ic_movie.png) no-repeat 136px; border-radius:3px; padding:0 20px}
.main_visual .btn_movie span{color:#fff; line-height:50px; font-size:18px}
.main_visual .btn_brochure_kor{position:absolute; z-index:50; top:420px; left:200px; display:block; width:180px; height:50px; background:#00125d url(../images/ic_download.png) no-repeat 193px; border-radius:3px; padding:0 35px 0 20px;}
.main_visual .btn_brochure_kor span{color:#fff; line-height:50px; font-size:18px}
.main_visual .btn_brochure_eng{position:absolute; z-index:50; top:420px; left:450px; display:block; width:180px; height:50px; background:#00125d url(../images/ic_download.png) no-repeat 193px; border-radius:3px; padding:0 35px 0 20px;}
.main_visual .btn_brochure_eng span{color:#fff; line-height:50px; font-size:18px}

.visual01{width:100%; height:800px; background-image:url(../images/main_visual01.jpg); background-size:cover; background-position:center;}
.visual02{width:100%; height:800px; background-image:url(../images/main_visual02.jpg); background-size:cover; background-position:center;}
.visual03{width:100%; height:800px; background-image:url(../images/main_visual03.jpg); background-size:cover; background-position:center;}

.bx-wrapper {position:relative; margin-bottom:60px; padding:0; overflow:hidden;}
.bx-wrapper img {width:100%; display:block;}
.bxslider {margin:0; padding:0;}
.bx-viewport {-webkit-transform: translatez(0);}
.bx-wrapper {width:100%; height:800px;}
.bx-wrapper .bx-controls-auto {position:absolute; bottom:0; left:50%; margin-left:20px; z-index:99;}
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {margin:0 3px;}
.bx-wrapper .bx-controls-auto a {width:20px;height:20px;display:block;color:#bbb; text-indent:-9999px;}
.bx-wrapper .bx-controls-auto a:before {display:block; font-size:24px; width:20px; height:20px; line-height:20px; font-family:'xeicon'; text-indent:0;}
.bx-wrapper .bx-controls-auto a.bx-start:before {content:'\ea3f';}
.bx-wrapper .bx-controls-auto a.bx-stop:before {content:'\ea3c';}
.bx-wrapper .bx-controls-auto a.active:before {color:#00125d;}
.bx-wrapper .bx-pager {position:absolute; bottom:0; left:50%; margin-left:-75px; z-index:99;}
.bx-wrapper .bx-pager {text-align:center;}
.bx-wrapper .bx-pager.bx-default-pager a {border:3px solid #c9c9c9; text-indent:-9999px; display:block; width:14px; height:14px; margin:0 5px; /*outline:0;*/ -moz-border-radius:30px; -webkit-border-radius:30px; border-radius:30px;}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {border:3px solid #ff6545; background:#ff6545;}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {display:inline-block; vertical-align:bottom;}
.bx-wrapper .bx-pager-item {font-size:0; line-height:0;}

/* 보도자료 */
ul.press {max-width:1280px; margin:0 auto; overflow:hidden;}
ul.press:after {content:""; display:block; clear:both;}
ul.press li {float:left; width:25%;}
ul.press li a {display:block;}
ul.press li a:hover {text-decoration:none;}
ul.press li dl {position:relative; margin:0; padding:30px 25px;}
ul.press li dl:before {content:""; display:block; position:absolute; top:50%; left:0; width:1px; height:130px; margin-top:-60px; background-color:#d9d9d9;}
ul.press li dl dt {color:#333; font-size:20px; font-weight:500; display:inline-block; height:84px; line-height:28px; overflow:hidden;; display:-webkit-box; -webkit-box-orient:vertical; text-overflow:ellipsis; word-break:break-all; box-sizing:border-box; -webkit-line-clamp:3;}
ul.press li dl dd {margin-top:10px; color:#898989; font-weight:normal;}

/* 사업 */
.work {position:relative; display:table; width:100%; margin:40px 0;}
.work div {float:left; width:23.5%; margin-left: 2%;}
.work div:first-child{margin-left:0;}
.work div .btn_view{display:block; width:120px; height:40px; background:#00125d url(../images/ic_arrow2.png) no-repeat 130px; margin-top:20px; border-radius:30px; padding:0 20px}
.work div .btn_view span{color:#fff; line-height:38px;}
.work dl dt{color:#000; font-size:24px; font-weight:400; margin:30px 0 6px 0;}
.work dl dd{margin-left:12px; font-size:18px;}
.work dl dd:before{display:block; content:''; position:absolute; width:4px; height:4px; background-color:#000; margin-top:11px; margin-left:-12px;}

.img1 {position: relative;}
.img1:hover::after {content: "수소산업거점지구"; position: absolute; top:50%; left:140px; transform: translate(-50%, -50%); color: #fff; background-color: rgba(0, 0, 0, 0.5); padding: 5px; }
.img2 {position: relative; }
.img2:hover::after{content: "일렉드로겐오토밸리"; position: absolute; top : 50%; left:140px; transform: translate(-50%, -50%); color: #fff; background-color: rgba(0, 0, 0, 0.5); padding: 5px; }
.img3 {position: relative; }
.img3:hover::after  {content: "R&D비즈니스밸리"; position: absolute; top : 50%;left: 140px; transform: translate(-50%, -50%); color: #fff; background-color: rgba(0, 0, 0, 0.5); padding: 5px; }
.img4 {position: relative;}
.img4:hover::after  {content: "KTX 울산역 복합특화지구"; position: absolute; top : 50%;left:140px; transform: translate(-50%, -50%); color: #fff; background-color: rgba(0, 0, 0, 0.5); padding: 5px; }


/* 공지사항 */
.cneter_con {margin:40px 0;}
.cneter_con .board,.cneter_con .service{position:relative; /*width:50%; float:left;*/}
.board .tab_area{display:block; margin:0 0 10px 0; line-height:1.333; overflow:hidden; border-left:1px solid #00125d;}
.board .tab_area ul{width:100%; text-align:center;}
.board .tab_area li{float:left; vertical-align:top; text-align:center; color:#000; cursor:pointer;}
.board .tab_area li > a{display:block; height:50px; line-height:50px; border:1px solid #00125d; border-left:none; font-size:18px;}
.board .tab_area li > a.On{background:#00125d; color:#fff; font-weight:800;}

.board .tabBody ul li{position:relative; padding: 5px 110px 10px 18px; text-align:left; width:100%;}
.board .tabBody ul li:before{display:block; content:''; position:absolute; left:0; top:50%; width:4px; height:4px; background-color:#000; margin-top:-2px;}
.board .tabBody ul li a {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height:30px; line-height:30px; border:none; font-size:16px;}
.board .tabBody ul li a:hover{text-decoration:underline;}
.board .tabBody ul li .date{position:absolute; top:4px; right:3px; color:#999;}

/* 서비스바로가기 */
/*.cneter_con .service{border-left:1px solid #e1e1e1;}*/
.cneter_con .service .ser_top{margin-top:40px}
.cneter_con .service ul li {float:left; width:16.666%; text-align:center;}
.cneter_con .service ul li a {display:inline-block; width:100%;}
.cneter_con .service ul li a:hover,
.cneter_con .service ul li a:active,
.cneter_con .service ul li a:focus {text-decoration:none;}
.cneter_con .service ul li a p {margin-top: 15px;font-size: 20px;color: #333;}
.cneter_con .service ul li a:hover p,
.cneter_con .service ul li a:active p,
.cneter_con .service ul li a:focus p {color:#0E75B3;}
 .cneter_con .service ul li a:before{ display:block; width:100%; height:70px; content: '';} 
.cneter_con .service .bg1 a:before{background:url(../images/main_ser_01_1.png) no-repeat center;}
.cneter_con .service .bg2 a:before{background:url(../images/main_ser_02.png) no-repeat center;}
.cneter_con .service .bg3 a:before{background:url(../images/main_ser_03.png) no-repeat center;}
.cneter_con .service .bg4 a:before{background:url(../images/main_ser_04.png) no-repeat center;}
.cneter_con .service .bg5 a:before{background:url(../images/main_ser_05.png) no-repeat center;}
.cneter_con .service .bg6 a:before{background:url(../images/main_ser_06_1.png) no-repeat center;}
.cneter_con .service .bg7 a:before{background:url(/s/media/data.do?mediaId=MEDIA_00000000001034) no-repeat center;}

/* 투자안내 */
.main_link{height:180px; background:url(../images/main_link_bg.jpg) no-repeat; background-size:cover; margin-bottom:30px;}
.main_link .body_wrap{position:relative; margin:0 auto; max-width:1280px;}
.main_link .title{position:absolute; display:block; top:40px; width:250px; height:90px; color:#fff}
.main_link .title b{font-size:32px; display:block; font-weight:800;}
.main_link .link{position:relative; padding-top:45px; list-style:none; text-align:right;}
.main_link .link:after{display:block; visibility:hidden; clear:both; content: '';}
.main_link .link li{position: relative;display: inline-block;}
.main_link .link li + li{margin-left:115px;}
.main_link .link li a{position:relative; font-size:24px; line-height:26px; font-weight:500; color:#fff;}
.main_link .link li a:before{display:inline-block; position:relative; z-index:1; width:90px; height:90px; border-radius:50px; margin-right:17px; vertical-align:middle; content: '';}
.main_link .link .link1 a:before{background:#fff url(../images/main_link_01.png) no-repeat center;}
.main_link .link .link2 a:before{background:#fff url(../images/main_link_02.png) no-repeat center;}
.main_link .link .link3 a:before{background:#fff url(../images/main_link_03.png) no-repeat center;}

/* 미디어쿼리 적용 */
@media screen and (max-width:1420px) {
	.main_link{height:240px;}
	.main_link .body_wrap,.main_visual .visual_wrap{padding:0 15px}
	.main_link .title{position:relative; width:100%; margin:0 auto; text-align:center}
	.main_link .link{text-align:center;}
	.main_link .link li + li{margin-left: 50px;}
	.main_link .link li a{font-size:18px;}
	.main_link .link li a:before{width:78px; height:78px;}
	.main_link .link .link1 a:before,.main_link .link .link2 a:before,.main_link .link .link3 a:before{background-size:50px;}
}

@media screen and (max-width:1050px) {
	.main_visual .visual_txt {margin-top:120px; color:#fff;}
	.main_visual .btn_movie{top:340px;}
	.main_visual .btn_brochure_kor{top:340px;}
	.main_visual .btn_brochure_eng{top:340px;}
}

@media screen and (max-width:920px) {
	.cneter_con .board,.cneter_con .service {padding-bottom:0;}
	.cneter_con .service ul li {width:33.333%; margin-bottom:30px;}
}

@media screen and (max-width:830px) {
	ul.press{border-bottom:1px solid #d9d9d9;}
	ul.press li {width:50%;}
	ul.press li dl {position:relative; padding:20px; overflow:hidden; border-top:1px solid #d9d9d9; border-right:1px solid #d9d9d9;}
	ul.press li dl.line{border-right:none;}
	ul.press li dl dd {margin-top:5px;}

	.cneter_con .board,.cneter_con .service{width:100%; /*min-height:309px;*/}
	.cneter_con .service{border-left:0;}
  
  	.work div {width:46%; margin-bottom:30px; margin-left:2%; }
	.work div:first-child {margin-left:2%;}
}

@media screen and (max-width:767px) {
	.main_link{height:auto;}
	.main_link .title{height:120px;}
	.main_link .link{padding-left:30px; text-align:left;}
	.main_link .link li{width:100%; margin-bottom:20px;}
	.main_link .link li + li{margin-left:0;}
	.main_link .link li + li + li{margin-bottom:40px;}
}



@media screen and (max-width:640px) {
	.mainContents h2{font-size:24px;}
	.main_visual{height:380px;}
	.visual01,.visual02,.visual03{height:380px;}
	.bx-wrapper {height:380px;}
	.main_visual .visual_txt{margin-top:90px;}
	.main_visual .visual_txt .subject{font-size:17px; letter-spacing:-0.1em;}
	.main_visual .visual_txt .point {font-size:23px; line-height:32px;}
	.main_visual .visual_txt .txt_b{font-size:20px; line-height:18px; margin-top:20px;}
	.main_visual .visual_txt .txt_s{font-size:20px; line-height:18px;}
  	.main_visual .visual_txt center iframe {display:none; margin-top:0;}
	.main_visual .btn_movie{top:240px; left:22%; width:120px; height:42px; background:#00125d url(../images/ic_movie.png) no-repeat 116px;}
	.main_visual .btn_movie span{line-height:42px; font-size:16px;}
	.main_visual .btn_brochure_kor{top:300px; left:10px; width:140px; height:42px; background:#00125d url(../images/ic_download.png) no-repeat 150px; padding:0 35px 0 10px;}
	.main_visual .btn_brochure_kor span{line-height:42px; font-size:16px;}
	.main_visual .btn_brochure_eng{top:300px; left:200px; width:140px; height:42px; background:#00125d url(../images/ic_download.png) no-repeat 150px; padding:0 35px 0 10px;}
	.main_visual .btn_brochure_eng span{line-height:42px; font-size:16px;}

	
	.work {margin:40px 0;}
	ul.press li {width:100%;}
	ul.press li dl dt {font-size:18px; height:inherit; line-height:20px; overflow:unset; display:block; text-overflow:unset; -webkit-line-clamp:unset; }
	ul.press li dl dd{font-size:13px;}
	ul.press li dl.line{border-right:1px solid #d9d9d9;}
	.work div{margin-left:0; margin-bottom:30px}
	.work div:last-child{margin-bottom:0}
	.work div,.work div img{width:100%;}
	.work dl dt{margin:10px 0 6px 0;}
	.cneter_con .board,.cneter_con .service{/*min-height:290px;*/}
	.cneter_con .service .bg1 a:before,.cneter_con .service .bg2 a:before,.cneter_con .service .bg3 a:before,.cneter_con .service .bg4 a:before,.cneter_con .service .bg5 a:before,.cneter_con .service .bg6 a:before, .cneter_con .service .bg7 a:before {background-size:45px;}
}

@media screen and (max-width:540px) {
	.main_visual .visual_txt .point img {margin-top:10px;}
}

@media screen and (max-width:480px) {
}

@media screen and (max-width:380px) {
  .main_visual .btn_brochure_kor {width:120px; background: #00125d url(../images/ic_download.png) no-repeat 129px;padding: 0 35px 0 5px;}
  .main_visual .btn_brochure_kor span {font-size:14px;}
  .main_visual .btn_brochure_eng {left:180px; width:120px; background: #00125d url(../images/ic_download.png) no-repeat 129px;padding: 0 35px 0 5px;}
  .main_visual .btn_brochure_eng span {font-size:14px;}
}

/* 카드뉴스 및 홍보영상 추가 */
.rowgroup {display:inline-block; width:100%; margin:40px 0;}
.rowgroup .inner {display:flex; flex-wrap:wrap; justify-content:space-between; }
.rowgroup .inner > .leftBox {width:61%; float:left; padding-right:40px;}
.rowgroup .inner > .rightBox {width:39%;}

/*카드뉴스*/
.cardNews {position:relative; border:1px solid #d9d9d9; padding:36px 39px; border-radius:20px; margin-bottom:50px;}

.News_list {margin-top:24px;}
.News_list ul {overflow:hidden;}
.News_list ul:after {content:''; display:block; visibility:hidden; clear:both;}
.News_list li {display:inline-block; float:left;}
.News_list li a {display:block;}
.News_list li a img {width:100%; height:145px; object-fit: fill;}

.cardNews .btn_more {display:inline-block; position:absolute; right:40px; top:36px; width:42px; height:42px; background:#9ca3b6; border-radius:50%; text-align:center}
.cardNews .btn_more:before {content:''; position:absolute; left:50%; top:50%; margin-top:-6px; margin-left:-6px; width:13px; height:13px; background:url(/s/media/data.do?mediaId=MEDIA_00000000001059) no-repeat;}

.cardNews .News_list li {width:calc(33.33% - 20px); margin:0 0 0 30px;}
.cardNews .News_list li:first-child {margin-left:0;}

.mainSNS {display:flex;flex-wrap:wrap;justify-content: flex-start;position:relative; /*width:46.30rem;*/ align-items:center; letter-spacing:0;}
.mainSNS h2 {font-size:24px; margin: 0 50px 0 30px;}

.mainSNS h2 em {color:#ed1f24;}
.mainSNS h2 span {display:block; font-size:20px;}
.mainSNS h2:before {content:""; position:absolute; display:inline-block; top:25%; left:300px; width:1px; height:52px; margin-top:-10px; background-color:#d9d9d9;}

.mainSNS .links {display:flex; flex-wrap:nowrap; justify-content:end; align-items:center; margin-left: 40px;}
.mainSNS .links li + li {margin-left:1.5rem;}
.mainSNS .links a {display:block; position:relative; text-indent:-999px; width:46px; height:46px; background:url(/s/media/data.do?mediaId=MEDIA_00000000001058) no-repeat 0 50%; overflow:hidden; transition:.3s margin; -webkit-transition:.3s margin;}
.mainSNS .links a.blog {background-position-x:0;}
.mainSNS .links a.facebook {background-position-x:-67px;}
.mainSNS .links a.instagram {background-position-x:-133px;}
.mainSNS .links a.linkedin {background-position-x:-201px;}
.mainSNS .links a.youtube {background-position-x:-268px;}  


/*유투브*/
.media_area {position:relative; z-index:9; border:1px solid #d9d9d9; padding:39px; border-radius:20px;}
.youtubebox {position:relative;display:flex;}
.youtubebox .youtubevideo {display:flex !important; align-items:center; justify-content:center; width:100%; height:288px; border-radius:25px;}

.youtubebox .youtubevideo img {height:100%; border-radius:25px;}
.youtubebox a .cate {display:block; position:absolute; top:15px; left:15px; width:46px; height:46px; background:url(/s/media/data.do?mediaId=MEDIA_00000000001058) no-repeat -268px 50%; z-index:1; overflow:hidden; text-indent:-999px; border-radius:100%;}

@media screen and (max-width:1200px) {
	.mainSNS h2 {margin: 0 30px 20px 20px;}
	.mainSNS h2 span {display:inline-block; margin-left:20px;}
	.mainSNS h2:before {display:none;}
	.mainSNS .links {margin-left:20px;}
	.mainSNS .links li + li {margin-left:1rem;}	
}	

@media screen and (max-width:900px) {
	.rowgroup .inner > .leftBox {width:100%; float:none; padding-right:0px;}	
	.rowgroup .inner > .rightBox {width:100%;}
	.mainSNS h2 {margin: 0 50px 0 30px;}
	.mainSNS h2:before {content:""; position:absolute; display:inline-block; top:25%; left:400px; width:1px; height:42px; margin-top:-10px; background-color:#d9d9d9;}
	.mainSNS {margin-bottom:50px;}
	
	.youtubebox .youtubevideo {height:388px;}
}

@media screen and (max-width:758px) {
	.mainSNS h2:before {display:none;}
}	

@media screen and (max-width:540px) {
	.cardNews .News_list li:last-child {display:none;}
	.cardNews .News_list li {width:calc(50% - 20px);}
	.youtubebox .youtubevideo {height:260px;}
}

@media screen and (max-width:453px) {
	.mainSNS h2 span {display:block; margin-left:0px; margin-bottom:10px;}	
}

@media screen and (max-width:380px) {
	.media_area {padding:29px;}
	.youtubebox .youtubevideo {height:188px;}	
}

.popupArea{position: relative; max-width: 1280px; margin: 0 auto;}