@charset "utf-8";

.main section {position:relative;}
.main-section {position:relative; height:800px;}
.roll {position:absolute; width:100%; height:800px; text-align:left; overflow:hidden;}
.roll::after {content: '';background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 73.17%);width: 100%;height: 300px;position: absolute;opacity: .55;z-index:21;}
.roll .roll-in {position:absolute; width:100%;  height:800px; top:0;color:#fff;}
.roll .roll-in .roll-in-txt {position:absolute; z-index:5; text-align:left; z-index:5; }
.roll .roll-in .roll-in-txt .txt {display:block; font-size:16px; line-height:24px; letter-spacing:0 }
.roll .roll-in .roll-in-txt .tit {display:block; margin-top:35px; margin-bottom:15px}
.roll .roll-in .roll-in-txt .tit img {max-width:100%}
.roll .roll-in .img {position:absolute; top:0; width:100%; height:100%; z-index:1 }
.roll .roll-in .img img {height:100% }
.roll .roll-in.r1 .img img, .roll .roll-in.r2 .img img, .roll .roll-in.r3 .img img {display:none;position:absolute;bottom:0;top:auto;left:50%;transform:translateX(-50%);}
.roll .roll-in .more {display:block;margin-top:4px}
.roll .roll-in .more a {display:inline-block;font-size:12px; border-bottom:1px solid #8b8689; color:#fff; line-height:1.4; letter-spacing:0;}
.roll .roll-in.r1 .roll-in-txt .tit {margin:0}
.roll .roll-in.r1 .roll-in-txt {bottom:35%; text-align:center;}
.roll .roll-in.r1 .roll-in-txt .txt {margin:19px 0 21px 0}
.roll .roll-in.r1 .more a {display:inline-block; background:rgba(0,0,0,0.1); color:#fff; padding:0 30px; height:33px; font-size:14px; line-height:33px; border:1px solid #fff}
.roll .roll-in.r2 .roll-in-txt , .roll .roll-in.r3 .roll-in-txt ,  .roll .roll-in.r4 .roll-in-txt {bottom:15%}
.roll .roll-in .roll-in-txt ul:after {clear:both; display:block; content:"";}
.roll .roll-in .roll-in-txt ul li {float:left;}
.roll .roll-in.r2 .roll-in-txt ul li:nth-child(2) {margin:0 20px 0 33px; margin-top:34px }
.roll .roll-in.r2 .roll-in-txt ul li:last-child {margin-top:34px }
.roll .roll-in.r2 .roll-in-txt .tit {margin-top:35px; margin-bottom:6px}
.roll .roll-in.r1 .hidden-image {position:absolute; width:100%; height:100%; top:0px}
.roll .roll-in.r1 video, .roll .roll-in.r2 video, .roll .roll-in.r3 video{position:absolute; width:100%; bottom:0px;left:50%;transform:translateX(-50%);}
.roll .roll-in.r3 .roll-in-txt ul li:first-child  {margin-top:5px}
.roll .roll-in.r3 .roll-in-txt ul li:last-child  {margin-top:13px;}
.roll .roll-in.r3 .roll-in-txt ul li:nth-child(2) {margin:0 15px 0 18px }
.roll .roll-in.r4 .roll-in-txt ul li:nth-child(2)  {margin:21px 18px 0 43px}
.roll .roll-in.r4 .roll-in-txt ul li:last-child  {margin-top:27px}
.bts {position:absolute; bottom:24px; text-align:center; width:100%; margin:0 auto; z-index:50; line-height:1;}
.bts span.bt1 {display:inline-block;}
.bts span.bt1 a {box-shadow:1px 1px 1px inset}
.bts span a {display:inline-block; width:13px; height:13px; border-radius:50%; background:#808080; margin-right:8px; font-size:0; vertical-align:middle; text-indent:-9999px}
.bts span a.on {background:#fff}
.bts a:last-child {margin-right:0}
.bts span.bt2 {margin-left:7px}
.bts span.bt2 a {margin-right:0; padding:3.5px; border:1px solid #fff; border-radius:0; text-indent:0; opacity:1}
.bts span.bt2 a.stop {margin-right:-3px; background:url(../images/main/stop_bt_off.png) no-repeat transparent center}
.bts span.bt2 a.stop.on {margin-right:-3px; background:#fff url(../images/main/stop_bt_on.png) no-repeat center}
.bts span.bt2 a.play {margin-left:0; background:url(../images/main/play_bt_off.png) no-repeat transparent center}
.bts span.bt2 a.play.on {margin-left:0; background:#fff url(../images/main/play_bt_on.png) no-repeat center}
.main section.one-slide .bts span.bt1 {display:none;}
.bts .bt-sound-area {width:100%;max-width:1098px;margin:0 auto;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
.bts .bt-sound-area .bt-sound {width:29px;height:29px;background:url(../images/main/btn_sound_mute.png) no-repeat 0 0/ 100% auto;position:absolute;top:50%;right:0;transform:translateY(-50%);}
.bts .bt-sound-area .bt-sound.bt-sound-on {background:url(../images/main/btn_sound.png) no-repeat 0 0/ 100% auto;}
.bts .btn_dim {position:absolute;top:50%;right:40px;transform:translateY(-50%);z-index:100;background:transparent;color:#fff;outline:none;border:1px solid #fff;} /*테스트 -삭제 */
.bts .mouse {display:inline-block;vertical-align:middle;}

.main-tit  {position:relative; z-index:2; width:100%; margin:0 auto; text-align:center;padding-top:146px;}
.main-tit h2 {font-size:40px; margin-bottom:5px; color:#fff; font-weight:700;}
.main-tit p {font-size:16px; letter-spacing:0;font-weight:300;}
.main-section.business {display:flex;flex-direction:column;justify-content:center;box-sizing:border-box;}
.main-section.business .main-tit {padding-top:80px;}
.main-section.business {/*background:url(../images/main/mainsection2_bg.jpg) no-repeat center 0; */color:#fff}
.main-section.business ul {position:relative; margin:45px auto 0; z-index:2}
.main-section.business ul:after {clear:both; display:block; content:"";}
.main-section.business ul li {position:relative; float:left; width:32%; margin-left:2%; padding-top:17%; box-sizing:border-box}
.main-section.business ul li:first-child {margin-left:0}
.main-section.business ul li span {display:block;}
.main-section.business ul li .tit {font-size:22px;font-weight:400;line-height:1.6;color:#fff;padding:0;}
.main-section.business ul li .txt {font-size:14px; line-height:21px; margin-top:10px; letter-spacing:0;font-weight:300;}
.main-section.business ul li .img {position:absolute; top:0; left:0;}
.main-section.business ul li .img img {max-width:100%;}
.main-section.business ul li a {display:inline-block; font-size:13px; color:#fff; border-bottom:1px solid #fff; line-height:1.2; letter-spacing:0}
.main-section.business .bg {position:absolute; top:0; left:0;  width:100%; height:100%; background:url(../images/main/dot.png) 0 0 repeat; z-index:1 }
.dim {position:absolute; top:0; left:0;  width:100%; height:100%; background:#000; opacity:0; z-index:1 }
.dotbg {position:absolute; top:0; left:0;  width:100%; height:100%; background:url(../images/main/dot.png) 0 0 repeat; z-index:2 }

.building {height:1397px; background:#dbd9d6;}
.building .main-tit h2 {color:#333}
.building-area .btn-building-more {display:inline-block;border-bottom:1px solid #4c4c4c; font-size:14px; line-height:1.2; letter-spacing:0;position:absolute;top:-38px;left:50%;transform:translateX(-50%);}
.building-area div a {display:block; position:absolute; top:0; left:0; width:100%; height:100%; z-index:10; background:url(../images/common/blank.png) 0 0 repeat;}
.building-area {position:relative; margin:0 auto;position:relative;margin-top:58px;}
.building-area .bd-in {position:relative; width:100%; overflow:hidden; text-align:center}
.building-area .bd-in a {outline-offset:-1px;}/* 2016.07.06 추가 */
.building-area .bd-in .img {position:absolute; top:0; left:0; display:block; text-align:center;width:100%;}
.building-area .bd-in .img.over {z-index:5; opacity:0}
.building-area .bd-in .img img {width:100%;}
.building-area .bd-in .txt {position:absolute; display:block; width:100%; top:10px; left:0; font-size:17px; line-height:22px; color:#fff; z-index:8; text-align:left; padding:0 15px; box-sizing:border-box; letter-spacing:0}
.building-area .bd-in .txt strong {font-weight:normal; text-shadow: 0px 0px 7px black;}
.building-area .bd-in:hover strong {font-size:18px;}
.building-area .bd-in .txt span {display:none; font-size:16px;}
.building-area .bd-in:hover .txt span {display:block; margin-top:5px;line-height:20px} 
.building-area .bd-in:hover .txt {top:auto; bottom:15px !important;}
.building-area .bd1 {position:absolute; top:0; left:447px;}
.building-area .bd1.over {position:absolute; top:-20px; left:438px;}
.building-area .bd1 .bd-in .txt {top:119px; left:-15px}
.building-area .bd1 .bd-in strong {background:rgba(0,0,0,0.5); height:30px; line-height:30px; padding:0 19px 0 19px} 
.building-area .bd1 .bd-in {width:412px; height:374px; }
.building-area .bd1.over .bd-in {width:432px; height:402px;}
.building-area .bd1:hover .bd-in strong {background:none; padding:0; height:auto; line-height:auto}
.building-area .bd1:hover .bd-in .txt {top:auto; left:0}
.building-area .bd2 {position:absolute; top:124px; left:177px;}
.building-area .bd2.over {position:absolute; top:114px; left:167px;}
.building-area .bd2 .bd-in {width:250px; height:145px; }
.building-area .bd2.over .bd-in {width:270px; height:165px; }
.building-area .bd3 {position:absolute; top:173px; left:879px;}
.building-area .bd3.over {position:absolute; top:164px; left:870px;}
.building-area .bd3 .bd-in {width:269px; height:201px; }
.building-area .bd3.over .bd-in {width:289px; height:221px; }
.building-area .bd4 {position:absolute; top:289px; left:28px;}
.building-area .bd4.over {position:absolute; top:279px; left:18px;}
.building-area .bd4 .bd-in {width:399px; height:265px; }
.building-area .bd4.over .bd-in {width:419px; height:285px; }
.building-area .bd5 {position:absolute; top:394px; left:447px; z-index:10; }
.building-area .bd5.over {position:absolute; top:386px; left:437px; z-index:10}
.building-area .bd5 .bd-in {width:313px; height:160px; }
.building-area .bd5.over .bd-in {width:333px; height:180px; }
.building-area .bd5 img {display:block; text-align:center; margin:0 auto}
.building-area .bd6 {position:absolute; top:575px; left:-7px; z-index:10}
.building-area .bd6.over {position:absolute; top:566px; left:-18px; z-index:10}
.building-area .bd6 .bd-in {width:509px; height:301px; }
.building-area .bd6.over .bd-in {width:529px; height:321px;}
.building-area .bd7 {position:absolute; top:575px; left:522px; z-index:5}
.building-area .bd7.over {position:absolute; top:565px; left:512px; z-index:5}
.building-area .bd7 .bd-in {width:238px; height:364px; }
.building-area .bd7.over .bd-in {width:258px; height:384px;}
.building-area .bd8 {position:absolute; top:394px; left:780px; z-index:5}
.building-area .bd8.over {position:absolute; top:385px; left:771px; z-index:5}
.building-area .bd8 .bd-in {width:348px; height:494px; }
.building-area .bd8.over .bd-in {width:368px; height:514px;}

.vr {position:relative; width:100%; height:720px}
.vr .main-tit {position:initial; height:100%; box-sizing:border-box; text-shadow:1px 1px 1px #4c4c4c}
.vr canvas {position:absolute; left:0; top:0; bottom:0; z-index:400; }
.vr .main-tit a {display:block}
.vr .main-tit br {display:none}
.vr .main-tit h2 {position:absolute; z-index:200; top:100px; width:100%}
.vr .main-tit p {position:absolute; z-index:400; bottom:50px; width:100%; color:#fff}
.vrbt span:first-child {display:inline-block; color:#fff}
.vrbt span {font-size:30px;}
.vrbt.vrbg01 {position:absolute; z-index:300; top:0; left:0; width:33.3%; height:720px; line-height:720px}
.vrbt.vrbg02 {position:absolute; z-index:300; top:0; left:33.3%; width:33.3%; height:720px; line-height:720px}
.vrbt.vrbg03 {position:absolute; z-index:300; top:0; right:0; width:33.4%; height:720px; line-height:720px}
.vrbt .vrover {display:block; position:absolute; top:0; left:0; width:100%; height:720px; line-height:600px; font-size:30px; text-shadow:1px 1px 1px #4c4c4c; color:#fff; background-color: rgba(0,0,0,0.5 ); opacity:0}
.vrbt img {display:block; position:absolute; top:50%; left:50%; margin-top:-33px; margin-left:-33px; opacity:0}
.vrbt .vrover span {max-width:100%; margin:300px auto 0}
li.vrbg01 {position:absolute; z-index:100; top:0; left:0; width:33.3%; height:720px;background:url(../images/main/vr_bg01.png) no-repeat center}
li.vrbg02 {position:absolute; z-index:100; top:0; left:33.3%; width:33.3%; height:720px;background:url(../images/main/vr_bg02.png) no-repeat center}
li.vrbg03 {position:absolute; z-index:100; top:0; right:0; width:33.4%; height:720px;background:url(../images/main/vr_bg03.png) no-repeat center right}

.close-area {position:absolute; width:100%; height:60px; bottom:0; right:0; z-index:1000; display:none; opacity: 0; text-align:right;  }
.close-area.open {display:block; opacity: 1}
.close-area .text {position:absolute; right:50px; z-index:30; width:100%; line-height:59px }
.close-area .bg {width:100%; height:60px !important; background:#000; opacity:0.5}
.close-area span {display:inline-block; color:#fff; font-size:14px; margin-right:20px;padding-right:20px; line-height:1.4; vertical-align:middle; border-right:1px solid rgba(255,255,255,.1) }
.close-area span:first-child {font-size:16px;}
.close-area a.close {display:inline-block; color:#fff;vertical-align:middle; vertical-align:middle}
.close-area a.close:after {content:"×";font-size:20px; padding-left:10px; vertical-align:middle}

.link-area {position:relative; width:100%; height:618px; background:url(../images/main/link_bg.gif) no-repeat center 0 #fff; background-size:cover; z-index:5}/*2016-12-29*/
.link-area .cont {margin:0 auto; padding-top:125px}
.link-area .cont ul li {display:block; float:left}
.link-area .cont .type1 {padding:30px 0; background-color:rgba(237,237,237,0.5);position:relative;}
.link-area .cont .type1:after {content:""; display:block; clear:both}
.link-area .cont .type1 .news_tit {display:block; line-height:28px; padding-left:30px; font-size:20px; font-weight:700; }
.link-area .cont .type1 .btn_news_more {display:inline-block; border-bottom:1px solid #4c4c4c; font-size:12px; font-weight:400; line-height:1.2; letter-spacing:0;position:absolute;left:111px;top:40px;}
.link-area .cont .type1 li {width:34%; margin-top:25px; padding:0 40px; color:#4c4c4c; border-right:1px solid #ccc; box-sizing:border-box}
.link-area .cont .type1 li:first-child {width:33%; padding-left:30px}
.link-area .cont .type1 li:last-child {width:33%; border-right:none}
.link-area .cont .type1 li .tit {display:block; overflow:hidden; height:52px; line-height:28px; letter-spacing:0}
.link-area .cont .type1 li .txt {display:block; overflow:hidden; line-height:24px; margin-top:29px; font-size:15px; font-weight:300;}
.link-area .cont .type2 {width:100%; margin-top:40px; box-sizing:border-box}
.link-area .cont .type2:after {content:""; display:block; clear:both}
.link-area .cont .type2 a {display:block}
.link-area .cont .type2 li {text-align:center; width:32%; line-height:85px}
.link-area .cont .type2 .link1 {background:url(../images/main/ninebridge01.png) no-repeat center}
.link-area .cont .type2 .link2 {margin-left:2%; background:url(../images/main/ninebridge02.png) no-repeat center}
.link-area .cont .type2 .link3 {position:relative; height:89px; }
.link-area .cont .type2 .link3 .txt {padding-left:65px; color:#4c4c4c}
.link-area .cont .type2 .link3 .brochure {display:inline-block; position:absolute; left:0; height:89px; line-height:72px; background:url(../images/main/icon-ebrochure.png) no-repeat 10px center}
.link-area .cont .type2 .link3 .brochure .txt {display:inline-block; vertical-align:middle; font-size:16px; background:url(../images/common/w_icon4.png) no-repeat 65px 48px}
.link-area .cont .type2 .link3 .certificate {display:inline-block; position:absolute; right:20px; height:89px; line-height:72px; background:url(../images/main/icon-certificate.png) no-repeat 10px center}
.link-area .cont .type2 .link3 .certificate .txt {display:inline-block; vertical-align:middle; height:89px; font-size:16px; background:url(../images/main/more.png) no-repeat 65px 50px}
.link-area .cont .type2 .link1 .txt {padding-right:20px; font-size:16px; color:#fff; border-bottom:1px solid #fff; background:url(../images/common/w_icon.png) no-repeat right center}
.link-area .cont .type2 .link2 .txt {padding-right:20px; font-size:16px; color:#fff; border-bottom:1px solid #fff; background:url(../images/common/w_icon.png) no-repeat right center}
.link-area .cont .mb-bt {overflow: hidden;}/*2016-12-29*/
.link-area .cont .mb-bt li {width:32%; margin-top:40px; margin-left:2%}
.link-area .cont .mb-bt li:first-child {margin-left:0}
.link-area .cont .mb-bt li a {display:block; color:#666; height:40px; line-height:40px; font-size:16px; padding-left:20px;background:url(../images/main/plus.png) no-repeat 92% center; border:1px solid #bfbfbf}
.bgno {background:none !important}
.link-area .cont .link-certificate {position:relative;}
.link-area .cont .link-certificate .txt {padding-left:65px; color:#4c4c4c}
.link-area .cont .link-certificate .certificate {display:inline-block; position:absolute; top:23px; right:20px; height:89px; line-height:72px; background:url(../images/main/icon-certificate.png) no-repeat 10px center;border:0;padding-left:0;}
.link-area .cont .link-certificate .certificate .txt {display:inline-block; vertical-align:middle; height:89px; font-size:16px; background:url(../images/main/more.png) no-repeat 65px 50px}

@media all and (min-width:0\0) and (min-resolution:.001dpcm) {
	.roll .roll-in.r1 video {display:none !important}
	.roll .roll-in.r2 video {display:none !important}
	.roll .roll-in.r3 video {display:none !important}
	.roll .roll-in.r1 .img img {display:block;} 
	.roll .roll-in.r2 .img img {display:block;} 
	.roll .roll-in.r3 .img img {display:block;}
}

@media all and (min-width:1600px) {
	.main-section.business {background-size:cover}
	.vr {background-size:cover}
	.link-area {background-size:cover}
}

@media all and (min-width:1280px) {
	.roll .roll-in.r1 .roll-in-txt {width:1100px;margin:0 auto; left:50%; margin-left:-550px}
	.roll .roll-in .roll-in-txt {width:768px; left:15%}
	.main-section.business ul {max-width:1100px;}
	.main-section.business ul li .txt {height:100px}
	.link-area .cont  {max-width:1100px; }
	.building-area {max-width:1140px; }
	.roll {max-width:1920px}
	.bts {max-width:1920px}
}

@media all and (max-width:1279px) {
	./*roll .roll-in.r1 .roll-in-txt {width:768px;margin:0 auto; left:50%; margin-left:-384px; }
	.roll .roll-in .roll-in-txt {left:50px}*/
	.main-section.business ul {margin:45px 50px 0}
	.main-section.business ul li .txt {height:120px}
	.main-section.business ul li .img {width:99%}

	.link-area .cont {padding-left:50px; padding-right:50px; box-sizing:border-box}
	.link-area .cont .type1 .txt {height:68px; overflow:hidden}
	.link-area .cont .type2:after {content:""; display:block; clear:both}
	.link-area .cont .type2 .txt span {display:none}

	.building {height:1096px;}
	.building-area {max-width:768px; height:634px; box-sizing:border-box;}
	.building-area .bd1 {left:300px;}
	.building-area .bd1 .bd-in {width:278px; height:253px; }
	.building-area .bd2 {top:85px; left:120px;}
	.building-area .bd2 .bd-in {width:169px; height:98px; }
	.building-area .bd3 {top:117px; left:592px;}
	.building-area .bd3 .bd-in {width:182px; height:136px; }
	.building-area .bd4 {position:absolute; top:196px; left:19px;}
	.building-area .bd4 .bd-in {width:270px; height:179px; }
	.building-area .bd5 {position:absolute; top:267px; left:301px;}
	.building-area .bd5 .bd-in {width:212px; height:108px; }
	.building-area .bd6 {top:388px; left:-6px;}
	.building-area .bd6 .bd-in {width:344px; height:203px; }
	.building-area .bd7 {position:absolute; top:388px; left:351px;}
	.building-area .bd7 .bd-in {width:160px; height:245px; }
	.building-area .bd8 {position:absolute; top:267px; left:524px;}
	.building-area .bd8 .bd-in {width:235px; height:334px; }
	/*.building-area .bd1 .bd-in .img {margin-left:-212px}
	.building-area .bd2 .bd-in .img {margin-left:-153px}
	.building-area .bd3 .bd-in .img {margin-left:-239px}
	.building-area .bd4 .bd-in .img {margin-left:-200px}
	.building-area .bd5 .bd-in .img {margin-left:-240px}
	.building-area .bd6 .bd-in .img {margin-left:-173px}
	.building-area .bd7 .bd-in .img {margin-left:-246px}*/
	.building-area .bd-in .txt  span br {display:none}
	.building-area .bd2:hover .txt  span {display:none}
	.building-area .bd6:hover .txt  span {display:none}
	.building-area .bd1 .bd-in .txt {top:82px}
	.building-area .bd5 img {width:100%}
	.building-area  img {width:100%; height:100%}

	.roll .roll-in .img img {left:0; display:none}
	.roll .roll-in .img {width:100%; left:0; margin-left:0 !important; }
	.roll .roll-in.r1 .img img, .roll .roll-in.r2 .img img, .roll .roll-in.r1 .img3 img {display:none}
	.roll .roll-in.r1 .img {background-image:url(../images/main/main_rolling_n1.jpg?v20250808);background-repeat:no-repeat;background-position:center bottom 0 !important;background-size:cover !important } 
	/* .roll .roll-in.r2 .img {background:url(../images/main/main_rolling2.jpg) no-repeat center 0 !important;background-size:cover !important} 
	.roll .roll-in.r3 .img {background:url(../images/main/main_rolling3.jpg) no-repeat center 0 !important;background-size:cover !important} 
	.roll .roll-in.r4 .img {background:url(../images/main/main_rolling4.jpg) no-repeat center 0;background-size:cover }  */
	.roll .roll-in .roll-in-txt {left:50px}
	.roll .roll-in.r1 .roll-in-txt {left: 50%; margin-left: -177.5px;}/*2017-09-07*/
	.main-section.business ul {margin-left:50px; margin-right:50px}
	.bts .mouse {display:none !important}

	.vrbt span, .vrbt .vrover {font-size:25px}
}

@media all and (max-width:1024px) {
	.link-area .cont .type2 .link3 .brochure {background-position:5px center; background-size:30%}
	.link-area .cont .type2 .link3 .brochure .txt {padding-left:48px; font-size:15px; background-position:50px 48px}
	.link-area .cont .type2 .link3 .certificate {right:0; background-position:5px center; background-size:30%}
	.link-area .cont .type2 .link3 .certificate .txt {padding-left:48px; font-size:15px; background-position:50px 48px} 
	.link-area .cont .link-certificate .certificate {right:0; background-position:5px center; background-size:30%}
	.link-area .cont .link-certificate .certificate .txt {padding-left:60px; font-size:15px; background-position:60px 48px} 
}

@media all and (max-width:960px) {
	.link-area .cont .type2 .link1 {width:31%}
	.link-area .cont .type2 .link2 {width:31%}
	.link-area .cont .type2 .link3 {width:34%}
	.link-area .cont .type2 .link3 .brochure {background-position:5px center; background-size:30%}
	.link-area .cont .type2 .link3 .brochure .txt {padding-left:48px; font-size:15px}
	.link-area .cont .type2 .link3 .certificate {right:0; background-position:5px center; background-size:30%}
	.link-area .cont .type2 .link3 .certificate .txt {padding-left:48px; font-size:15px}
	.link-area .cont .link-certificate .certificate {right:0; background-position:5px center; background-size:30%}
	.link-area .cont .link-certificate .certificate .txt {padding-left:60px; font-size:15px}
}

@media all and (max-width:767px) {
	.roll .roll-in.r1 .roll-in-txt {width:100%; margin:0 auto; left:0}
	.main-section {height:100svh; min-height:480px}
	.roll {height:100svh}
	.roll .roll-in { height:100svh; }
	.roll .roll-in .roll-in-txt .tit img {width:100%; height:100%;}
	.roll .roll-in .roll-in-txt ul {display:none}
	.roll .roll-in.r2 .roll-in-txt , .roll .roll-in.r3 .roll-in-txt , .roll .roll-in.r4 .roll-in-txt  {bottom:15%}
	.roll .roll-in .roll-in-txt {left:15px}
	.roll .roll-in .roll-in-txt .tit {margin-top:0; margin-bottom:13px}
	.roll .roll-in.r1 .roll-in-txt .tit  {width:85%; margin:0 auto}
	.roll .roll-in.r1 .roll-in-txt .tit img {width:100%; max-width: 280px;}/*2017-09-07*/
	.roll .roll-in .roll-in-txt .txt {font-size:14px; line-height:18px; letter-spacing:0 }
	.roll .roll-in.r1 .roll-in-txt .txt {font-size:14px; line-height:16px}
	.roll .roll-in .more a {font-size:10px}
	.roll .roll-in .img img {height:auto }
	.roll .roll-in .roll-in-txt .tit {width:85%;}
	.roll .roll-in.r1 .img {background-image:url(../images/main/main_rolling_n1_m.jpg?v20250808);background-repeat:no-repeat;background-position:center bottom 0 !important;background-size:cover }
	.roll .roll-in.r1 video, .roll .roll-in.r2 video, .roll .roll-in.r3 video {object-fit:cover;}
	.bts .bt-sound-area {width:100%;max-width:100%;}
	.bts .bt-sound {width:25px;height:25px;background:url(../images/main/btn_sound_mute_m.png) no-repeat 0 0/ 100% auto;position:absolute;left:15px;right:auto;}
	.bts .bt-sound.bt-sound-on {background:url(../images/main/btn_sound_m.png) no-repeat 0 0/ 100% auto;}
	.bts .btn_dim {left:55px;right:auto;} /*테스트 -삭제 */

	.main-section.business .bg {display:none}
	.main-tit {padding:35px 15px 0; box-sizing:border-box}
	.main-tit h2 {font-size:30px; color:#333; margin-bottom:7px; line-height:1.2}
	.main-tit p {font-size:14px; line-height:18px}
	.main-section.business {display:block}
	.main-section.business .main-tit {padding-top:35px}
	.main-section.business {background:none; color:#4c4c4c;height:auto;}
	.main-section.business ul {margin:40px 15px 50px}
	.main-section.business ul li {float:none; width:100%; margin-left:0; padding-top:190px; margin-top:40px;}
	.main-section.business ul li:first-child {margin-top:0}
	.main-section.business ul li .tit {font-size:20px;color:#4c4c4c;}
	.main-section.business ul li .txt {font-size:16px; line-height:26px; height:auto; margin-top:3px }
	.main-section.business ul li .txt br {display:none}
	.main-section.business ul li .img {width:100%; text-align:center;}
	.main-section.business ul li a {font-size:12px; color:#4c4c4c; border-bottom:1px solid #4c4c4c; margin-top:18px;}
	.building {height:auto; padding-bottom:50px}
	.building .btn-building-more {font-size:13px;top:-56px;}
	.building-area {margin:0 auto; height:auto;margin-top:77px;}
	.building-area .bd-in {overflow:hidden; text-align:center; }
	.building-area .bd-in .img {display:none }
	.building-area .bd-in .img.over {display:none; opacity:0}
	.building-area .bd1 .bd-in, .building-area .bd2 .bd-in, .building-area .bd3 .bd-in, .building-area .bd4 .bd-in, .building-area .bd5 .bd-in, .building-area .bd6 .bd-in, .building-area .bd7 .bd-in, .building-area .bd8 .bd-in {width:100%; height:100%;margin:0 auto; }
	.building-area .bd1, .building-area .bd2, .building-area .bd3, .building-area .bd4, .building-area .bd5, .building-area .bd6, .building-area .bd7, .building-area .bd8 {position:relative; left:0; width:100%; text-align:center; margin:20px auto 0; top:0}
	.building-area .bd-in .txt {width:auto;top:auto;bottom:0;right:0;left:auto;padding:5px 10px;font-size:16px;letter-spacing:-0.02em;}
	.building-area .bd-in:hover .txt {bottom:0 !important;}
	.building-area .bd-in:hover strong {font-size:inherit;}
	.building-area .bd1 .bd-in { width:267px; height:265px; background:url(../images/main/building_n1_m.png?v20250319000000) no-repeat center 0; background-size:100%}
	.building-area .bd2 .bd-in { width:267px; height:175px; background:url(../images/main/building_n2_m.png?v20250319000000) no-repeat center 0; background-size:100%}
	.building-area .bd3 .bd-in { width:267px; height:175px; background:url(../images/main/building_n3_m.png?v20250319000000) no-repeat center 0; background-size:100%}
	.building-area .bd4 .bd-in { width:267px; height:175px; background:url(../images/main/building_n4_m.png?v20250319000000) no-repeat center 0; background-size:100%}
	.building-area .bd5 .bd-in { width:267px; height:175px; background:url(../images/main/building_n5_m.png?v20250319000000) no-repeat center 0; background-size:100%}
	.building-area .bd6 .bd-in { width:267px; height:175px; background:url(../images/main/building_n6_m.png?v20250319000000) no-repeat center 0; background-size:100%}
	.building-area .bd7 .bd-in { width:267px; height:380px; background:url(../images/main/building_n7_m.png?v20250319000000) no-repeat center 0; background-size:100%}
	.building-area .bd8 .bd-in { width:267px; height:350px; background:url(../images/main/building_n8_m.png?v20250319000000) no-repeat center 0; background-size:100%}
	.building-area .bd1 {margin:0 auto 0}
	.building-area .bd1 .bd-in strong {background:none;padding:0;}
	.building-area .bd1 .bd-in .txt {width:auto;top:auto;bottom:0;right:0;left:auto;padding:5px 10px;font-size:16px;letter-spacing:-0.02em;}
	.building-area .bd1 .bd-in:hover .txt {bottom:0 !important;}
	.building-area .bd1 .bd-in:hover strong {font-size:inherit;}
	.building-area .bd1:hover .bd-in .txt {left:auto;}

	.vr {height:700px; background:#dbd9d6}
	.vr .main-tit {padding:20px 15px 0; text-shadow:1px 1px 1px #000}
	.vr .main-tit h2 {position:static; width:100%; margin:0 auto; font-size:24px; color:#fff}
	.vr .main-tit p {display:none}
	.vr .main-tit ul li {display:none}
	.vrbt {display:block; position:absolute}
	.vrbt.vrbg01 {top:0; width:100%; height:233px; background:url(../images/main/vr_bg01.png) no-repeat center}
	.vrbt.vrbg02 {top:233px; left:0; width:100%; height:234px; background:url(../images/main/vr_bg02.png) no-repeat center}
	.vrbt.vrbg03 {top:466px; left:0; width:100%; height:233px; background:url(../images/main/vr_bg03.png) no-repeat center}
	.vrbt .vrover {height:233px; line-height:180px; font-size:24px}
	.vrbt:hover .vrover {display:block; opacity:1}
	.vrbt span:first-child {display:block; line-height:180px; text-align:center; font-size:24px}
	.vrbt span {display:block; text-align:center; width:100%; line-height:233px; color:#fff}
	.vrbt.vrover img {max-width:75%}
	.vrbt img {opacity:1; top:150px}

	.link-area {width:100%; height:auto; background-size:cover}
	.link-area .cont {padding:50px 15px 0px;}/*2016-12-29*/
	.link-area .cont ul li {margin-left:0;}
	.link-area .cont ul li a {color:#4c4c4c}
	.link-area .cont .type1 ul {width:100%}
	.link-area .cont .type1 li {display:none; border:none}
	.link-area .cont .type1 li:first-child {display:block; width:100%}
	.link-area .cont .type1 li .tit {height:26px}
	.link-area .cont .type2 li.link1 {text-align:left; width:100%; line-height:68px; padding-left:30px; background:url(../images/main/ninebridge01.png) no-repeat center; background-size:cover; box-sizing:border-box}
	.link-area .cont .type2 li.link2 {text-align:left; width:100%; line-height:68px; padding-left:30px; margin-top:10px; margin-left:0; background:url(../images/main/ninebridge02.png) no-repeat center; background-size:cover; box-sizing:border-box}
	.link-area .cont .type2 li.link3 {width:100%}
	.link-area .cont .type2 li a .txt {padding-right:20px; font-size:15px; margin-top:0;}
	.link-area .cont .type2 a {border-bottom:none}
	.link-area .cont .type2 .link1 .txt,
	.link-area .cont .type2 .link2 .txt {top:250px; font-size:16px}
	.link-area .cont .type2 .link3 .brochure {position:absolute; left:0; width:49%; height:89px; background:url(../images/main/icon-ebrochure.png) no-repeat 10px center}
	.link-area .cont .type2 .link3 .brochure .txt {font-size:16px; background:url(../images/common/w_icon4.png) no-repeat 48px 50px}
	.link-area .cont .type2 .link3 .certificate {position:absolute; left:0; width:49%; height:89px; background:url(../images/main/icon-certificate.png) no-repeat 10px center;text-align: left;}
	.link-area .cont .type2 .link3 .certificate .txt {font-size:16px; background:url(../images/main/more.png) no-repeat 48px 52px;margin-left:10px;padding-right:0px;}
	.link-area .cont .mb-bt li {width:100%; margin-top:20px;margin-left: 0;}
	.link-area .cont .mb-bt li a {display:block; color:#808080; height:35px; line-height:35px; font-size:12px; padding-left:4%;}
	.link-area .cont .mb-bt li:nth-child(odd) {margin-left:0}
	.link-area .cont .link-certificate {margin-top:23px;}
	.link-area .cont .link-certificate .certificate {position:static; height:89px; background:url(../images/main/icon-certificate.png) no-repeat 10px center;text-align: left;}
	.link-area .cont .link-certificate .certificate .txt {font-size:16px; background:url(../images/main/more.png) no-repeat 48px 52px;margin-left:10px;padding-right:0px; padding-left:48px;}
}

@media all and (max-width:400px) {
	.bratts {display:block}
	.building .main-tit p br {display:none}
	.link-area .cont .type2 .link1 .txt {font-size:14px}
	.link-area .cont .type2 .link2 .txt {font-size:14px}
}

@media all and (max-width:380px) {
	.main-section.business ul li {padding-top:175px}
}

@media all and (max-width:360px) {
	.main-section.business .main-tit  p .bratt {display:none}
	.link-area .cont .type2 .link3 .brochure {background-position:5px center}
	.link-area .cont .type2 .link3 .certificate {background-position:5px center}
	.footer-in .f-right ul.terms li {width:16%}
	.footer-in .f-right ul.terms li:nth-child(odd) {width:34%}
	.link-area .cont .link-certificate .certificate {background-position:5px center}
}

/* 메인 레이어팝업 2016-11-16 */
.layerPopWrap {position: fixed; top: 90px; left: 10px; width: 500px; z-index: 99999;}
.layerPopWrap .layerCont {position: relative; width: 480px; background: #FFF; border: 1px solid #DDD; font-size: 14px;}
.layerPopWrap .layerCont h2 {height: 54px; padding: 25px 30px 0 30px; font-size: 18px; font-weight: bold; background: url('../images/popup/layerPop_tit_bg.gif');}
.layerPopWrap .layerCont .cont {margin: 30px;}
.layerPopWrap .layerCont .cont dl {margin: 15px 0 30px;}
.layerPopWrap .layerCont .cont dl dt {font-weight: bold;}
.layerPopWrap .layerCont .cont .btnWrap {text-align: center;}
.layerPopWrap .layerCont .cont .btn_conView {display: inline-block; padding: 5px 20px; font-size: 13px; line-height: 20px; font-weight: bold; color: #FFF; background: #007bc3; border-radius: 5px;}
.layerPopWrap .layerCont .layerClose {position: absolute; top: 24px; right: 20px; display: block; width: 30px; height: 30px; font: 0/0 a; background: url('../images/popup/btn_close.gif') no-repeat 50% 50%;}

@media all and (max-width: 520px) {
	.layerPopWrap {left: 0px; width: 100%;}
	.layerPopWrap .layerCont {width: 95%; margin: 0 auto;}
	.layerPopWrap .layerCont h2 {height: 69px; padding: 10px 50px 0 15px;}
	.layerPopWrap .layerCont .layerClose {right: 10px;}
}


/* 메인 레이어팝업 2018-07-03 */
.infoLayerPop {position:fixed;top:170px;left:150px;width:600px;height:500px;z-index:99999}
.infoLayerPop .contArea {position:relative;overflow:hidden;}
.infoLayerPop .hideArea {position:absolute;top:-9999px;left:-9999px}
.infoLayerPop #btnInfoLayerPop {position:absolute;top:24px;right:20px;width:36px;height:36px}

@media all and (max-width: 640px) {
	.infoLayerPop {left: 0px; width: 100%;}
	.infoLayerPop .contArea {width: 96%; margin: 0 auto;}
	.infoLayerPop .contArea img {width:100%}

	.infoLayerPop #btnInfoLayerPop {top:2.4%;right:4.8%;width:24px;height:24px}
}

/* 2019-10-01 추가 */
#layerPop1001 {position:fixed;top:100px;left:50%;width:500px;height:80vh;margin-left:-750px;background:#fff;overflow:hidden;z-index:51; display:none; border: 1px solid #DDD; box-sizing: border-box;flex-direction:column;}
#layerPop1001 .layerCont {padding-bottom: 20px; font-size: 12px;display:flex;flex-direction:column;height:calc(100% - 39px);flex:1;overflow:hidden;}
#layerPop1001 .layerCont * {word-break:keep-all}
#layerPop1001 .layerCont h3 {margin:0 35px;padding:30px 0 10px;font-size:18px;line-height:1.5;letter-spacing:-0.08em; text-align: center;}
#layerPop1001 .layerCont h3 > span {display:block;font-weight:bold}
#layerPop1001 .layerCont > p {margin:10px 35px 20px;font-weight:400;}
#layerPop1001 .layerCont > div {position:relative;background:#f7f7f7;padding:20px 35px;border-top:1px solid #d8d8d8}
#layerPop1001 .layerCont > div:before {content:'';display:block;position:absolute;top:-3px;left:35px;width:90px;height:2px;background:#333}
#layerPop1001 .layerCont > div > ul > li+li {margin-top:10px}
#layerPop1001 .layerCont > div strong {display:inline-block;width:60px;padding-left:12px;text-indent:-12px;color:#8f6b4b;vertical-align:top}
#layerPop1001 .layerCont > div strong.txt {width:auto;text-indent:0;padding:0;margin-right:8px}
#layerPop1001 .layerCont > div p {display:inline-block;width:450px;font-weight:bold}
#layerPop1001 .layerCont > div strong.txt+p {width:430px;font-weight:normal}
#layerPop1001 .layerCont > div p > span {font-size:12px;font-weight:normal}
#layerPop1001 .layerCont .listBox {margin: 0; padding: 20px 35px; font-weight: 500; background: #f7f7f7; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8;flex:1;overflow-y:auto;}
#layerPop1001 .layerCont .itemCol {display:flex;}
#layerPop1001 .layerCont .itemCol > span {flex-shrink:0;}
#layerPop1001 .layerCont .btn_view {display:block;margin:0 auto;width:115px;height:29px;padding-top:5px;background:#916B4A;color:#fff;text-align:center;font-size:14px}
#layerPop1001 .layerBtnArea {height:31px;padding:7px 0 0 35px;border-top:1px solid #d8d8d8;font-size:14px;background:#f7f7f7;flex-shrink:0;}
#layerPop1001 .layerBtnArea:after {content:'';display:block;clear:both}
#layerPop1001 .layerBtnArea a, #layerPop1001 .layerBtnArea label {color:#555}
#layerPop1001 .layerBtnArea label {margin-right:5px}
#layerPop1001 .layerBtnArea > p {float:right;width:99px;text-align:center;border-left:1px solid #d8d8d8}
#layerPop1001 .layerCont .subList {padding-left:10px;}

#layerPop1001 .btnLayerClose2 {position:absolute;top:15px;right:15px;width:27px;height:27px;text-indent:-9999px;overflow:hidden;background:url(/kr/images/popup/btn_layer_close_180813.jpg) no-repeat 0 0}

@media all and (max-width:1500px) {
	#layerPop1001 {margin-left:-500px}
}

@media all and (max-width:1000px) {
	#layerPop1001 {left:20px;margin:0}
}

@media all and (max-width: 820px) {
	#layerPop1001 {position:absolute;left:50%;margin-left:-300px}
}

@media all and (max-width: 640px) {
	#layerPop1001 {position:absolute;width:90%;margin-left:0;transform:translateX(-50%); top: 60px;height:auto;}
	#layerPop1001 .layerCont {display:block;}
	#layerPop1001 .layerCont h3 {margin:0 35px;padding:35px 0 0;font-size:18px;line-height:24px;letter-spacing:-0.08em}
	#layerPop1001 .layerCont > div strong {display:block;width:auto;padding:0;text-indent:0}
	#layerPop1001 .layerCont > div p {display:block;width:auto}
	#layerPop1001 .layerCont > div strong.txt+p {width:auto}
	#layerPop1001 .layerCont {font-size:12px}
	#layerPop1001 .layerCont .listBox {padding-left: 90px; text-indent: -65px;overflow:hidden;}
	#layerPop1001 .layerCont .subList {text-indent:0;padding-left:4px;}

	#layerPop1001 .btnLayerClose2 {width:20px;height:20px;background-size:20px auto}
}
/* // 2019-10-01 추가 */


/* 2024-11-27 추가 */
#layerNotice {position:fixed;top:100px;left:50%;margin-left:-45%;z-index:1000;box-shadow: 5px 5px 10px rgba(0, 0, 0, .3);}
#layerNotice .blind {position:absolute;top:-99999px;left:-9999px;width:10px;height:10px;overflow:hidden}
#layerNotice .layerClose {position:absolute;top:22px;right:22px;width:23px;height:22px;overflow:hidden;background:url('https://cjtelenix.com/recruit/public/img/home/img_layer_close.png') no-repeat 0 0}
#layerNotice .layerClose > span {position:absolute;top:-9999px;height:-9999px;text-indent:-9999px}

@media screen and (min-width : 1170px){
	#layerNotice {margin-left:-585px}
}

@media screen and (min-width:471px) and (max-width:640px) {
	#layerNotice {margin-left:-208px}
}

@media screen and (max-width : 470px) {
	#layerNotice {width:90%}
	#layerNotice img {width:100%}
}

.layerPopIntro{padding:30px;background:#fff;}
.layerPopIntro .layerTitle{font-size:21px;color:#333;}
.layerPopIntro .layerLink{padding-left:40px;}
.layerPopIntro .layerLink > a{text-decoration:underline;}
.layerPopIntro .layerCont{margin:10px 0}

@media screen and (max-width : 470px) {
	.layerPopIntro{width:90%;box-sizing:border-box;}
	.layerPopIntro .layerTitle{font-size:18px;}
	.layerPopIntro > ul > li{padding-left:38px;text-indent:-38px;font-size:15px;}
	.layerPopIntro .layerLink{padding-left:38px;}
	.layerPopIntro .layerLink > a{font-size:15px;text-decoration:underline;}
}