@charset "utf-8";

/* layout */
/* dHead */
#dHead {}
#dHead .headBG {position:fixed; top:0; width:100%; height:36px; background:#fff; z-index:9; /*box-shadow:0px 2px 3px #666666;*/ border-bottom:1px solid #666666;}
#dHead h1 {position:fixed; width:100%; top:10px; left:20px; z-index:10; opacity:0; filter:alpha(opacity=0); transition:opacity 0.3s ease-in-out;}
#dHead h1.active {opacity:1; filter:alpha(opacity=100); transition:opacity 0.3s ease-in-out;}
#dHead h1 img {width:140px; }
#dHead .top {display:none;}

#mMenu {display:block; position:fixed; width:100%; top:6px; right:4px; z-index:10; text-align:right;}
.gnbTotal {display:none; position:fixed; top:36px; width:100%; z-index:9; text-align:right; background:#fff;}
.gnbTotal a {display:block; padding:10px 5px; font-weight:600; color:#333; border-bottom:#e5e5e5 1px solid;}
.gnbTotal a:hover {color:#0250ef;}

#dHead .btn-scroll {text-align:center;}
#dHead .btn-scroll a {position:fixed; left:50%; width:100px; margin-left:-50px; font-family:"Gotham"; font-size:9px; font-weight:bold; line-height:13px; text-align:center; opacity:0; filter:alpha(opacity=0); transition:opacity 0.3s ease-in-out; z-index:6;}
#dHead .btn-scroll a.up {top:13.5%; padding-top:30px; color:#fff; background:url("../images/icon/icon_btnline.png") no-repeat center 0; background-size:1px 20px;}
#dHead .btn-scroll a.up.active {opacity:1; filter:alpha(opacity=100); transition:opacity 0.3s ease-in-out;}
#dHead .btn-scroll a.down {bottom:6.25%; color:#ed1c24;  padding-bottom:30px; background:url("../images/icon/icon_btnline_btm.png") no-repeat center bottom; background-size:1px 20px;}
#dHead .btn-scroll a.down.active {opacity:1; filter:alpha(opacity=100); transition:opacity 0.3s ease-in-out;}
#dHead .navi-bar {display:none; position:fixed; top:50%; right:5%; overflow:hidden; width:19px; height:177px; margin-top:-63px; text-align:center; background:url("../images/icon/icon_btnline.png") repeat-y center top; z-index:5;}



/* dBody */
.section {position:relative; display:table; width:100%; height:1080px; background-size:cover; background-position:50%;}
.content {position:relative; display:table-cell; overflow:hidden; width:100%; margin:0 auto; text-align:center; vertical-align:middle;}

/* popup request */
.request-area {position:absolute; top:0; left:0; display:none; overflow-y:auto; width:100%; min-width:320px; background:url('../images/mobile/flux_main_m01.jpg') no-repeat 50%; background-size:cover; text-align:center; z-index:9;}

/* fp-nav */
.fp-nav {position:fixed; top:50%; z-index:8;}
.fp-nav.right {right:80px;}
.fp-nav ul li {position:relative; display:block;}
.fp-nav ul li a {position:relative; display:block; overflow:hidden; width:19px; height:49px; background:url('../images/icon/nav_tab.png') no-repeat 50% 0; z-index:1; cursor:pointer;}
.fp-nav ul li a.active {background:url('../images/icon/nav_tab_on.png') no-repeat 50% 0;}

.fp-controlArrow.fp-prev, .fp-controlArrow.fp-next {width:35px; height:35px; background-size: 100% 100%; }

/* 모바일 기준으로 작업 */
/* main mobile */
#section0 {background-image:url('../images/mobile/bajidan_m01.png');}
#section1 {background-image:url('../images/mobile/bajidan_m02.png');}
#section2 {background-image:url('../images/mobile/bajidan_m03.png');}
#section3 {background:#e6eef1;}
#section4 {background:#000;}
#section6 {background:#fff;}

.section h2 {position:relative; top:50px; font-size:28px; line-height:35px; letter-spacing:-0.5px; opacity:1; filter:alpha(opacity=0);}
.section h2 img {width:22px;}
.section .txt {position:relative; top:0px; margin:20px 25px 0; font-size:18px; line-height:25px; opacity:0; filter:alpha(opacity=0);}

/* index */
#section0 h1 {font-size:30px;}
#section0 h2 {top:0; margin-top:10px; font-size:48px; text-shadow:2px 2px 2px #333333;}


#section1 h1 {font-size:28px;}
#section1 h2 {font-size:20px; line-height:30px; padding-top:21px; letter-spacing:-1px;}


/* services */
#section2 {color:#FFF;}
#section2 h2 {top:0; left:-200px; margin-top:50px;}
#section2 .txt {font-size:20px; top:0; left:200px;}
#section2 ul {width:90%; margin:0 auto; padding:30px 0px 140px;}
#section2 li {float:left; width:33%; text-align:center;}
#section2 li img {width:80%;}
#section2 li h3 {font-size:13px; font-weight:bold; padding:12px 10px 8px;}
#section2 li span {font-size:11px; }



.fp-slidesNav.bottom{ 	bottom: 160px; }

/* works */
#section3 h2 {top:20%; left:0; padding-top:50px; color:#333333;}
#section3 .txt {top:25%; left:-300px;}
#section3 ul.sublist {width:80%; margin:0 auto; padding-top:30px; text-align:center;}
#section3 ul.sublist > li {width:100%; text-align:center;}
#section3 ul.sublist > li img {width:80%;}

/* history */
#section4 h2 {top:20%; left:0; padding-top:50px; margin-top:50px;}
#section4 .txt {top:300px; left:-300px;}
#section4 ul.sublist { margin:0 auto; padding:10px 0 50px;}
#section4 ul.sublist h3 { color:#d2aa0a; font-size:18px; margin-top:14px;}
#section4 ul.sublist > li {width:100%; text-align:center;}
#section4 ul.sublist > li > ul {clear:both; margin-top:10px; padding-left:0%;}
#section4 ul.sublist > li > ul > li {clear:both; font-size:11px; text-align:center; line-height:20px; letter-spacing:-0.5px;}

.fp-slidesNav.bottom { bottom: 30px; }
#section4 #fp-nav ul li a span,
#section4 .fp-slidesNav ul li a span {background:#fff;}

/* map */
#section6 .content {padding-top:35px; color:#333333;}
#section6 h2 {color:#333333; top:20%;}
#section6 h3 {width:90%; margin:0 auto; margin-top:10px; font-size:16px; text-align:left; font-weight:normal;}
#section6 ul {width:90%; margin:0 auto; padding-top:0;}
#section6 li {text-align:left; padding-right:20px; font-size:12px; font-weight:bold; letter-spacing:-0.5px; line-height:16px;}
#section6 li:last-child {padding-right:0px;}
#section6 .maps {margin-top:15px;}
#section6 #glMap {width:90%; height:60%;}


#section6 .location {width:230px; margin:0 auto; text-align:left;}
#section6 .location h3 {position:relative; top:50px; margin:15px 0 15px; padding-bottom:12px; color:#f01e39; font-family:"Gotham"; font-size:13px; line-height:13px; border-bottom:1px solid #6d6d6d; opacity:0; filter:alpha(opacity=0);}
#section6 .location ul {position:relative; top:50px; font-weight:bold; font-family:"Gotham-Light"; opacity:0; filter:alpha(opacity=0);}
#section6 .location ul li {overflow:hidden; margin:6px 0; font-size:8px; line-height:18px; vertical-align:middle;}
#section6 .location ul li strong {float:left; display:block; width:12px; margin:0 15px 0 5px;}
#section6 .location ul li span {float:left; display:block; width:185px; opacity:0.7; filter:alpha(opacity=70);}
#section6 .location ul li span a {color:#ffffff;}
#section6 .location ul li strong img {width:12px; margin-top:2px;}
#section6 .location ul li.address strong img {margin-top:7px;}
#section6 .location .location-right img {width:65px;}

/* request */
.request-area .btn-close {position:absolute; top:65px; left:50%; margin-left:-13px;}
.request-area .btn-close img {width:26px;}
.request-area h3 {margin:125px 0 0; font-size:11px; color:#f01e39; font-family:"Gotham"; letter-spacing:0.5px; opacity:0.9; filter:alpha(opacity=90);}
.request-area .txt {margin:30px 25px; font-size:25px; line-height:32px; color:#fff; opacity:1; filter:alpha(opacity=100);}
.request-area .txt span {display:block;}
.request-area .txt .comment {margin:20px 0 0; color:#8e8e90; font-size:10px; line-height:14px;}
.request-area form {font-size:11px;}
.request-area form ul {width:270px; margin:0 auto; overflow:hidden;}
.request-area form ul li {margin-bottom:5px;}
.request-area form ul li label {position:absolute; left:-5000px; width:0; height:0; font-size:0; line-height:0; text-indent:-5000px; visibility:hidden; overflow:hidden;}
.request-area form ul li input {width:250px; padding:10px; color:#222; font-weight:bold; border:0; background:url("../images/main/bg_input.png") repeat;}
.request-area form textarea {width:250px; height:opacity:0; filter:alpha(opacity=0);; padding:10px; font-weight:bold; border:0; background:url("../images/main/bg_input.png") repeat; color:#222222;}
.request-area form .checkbox {width:270px; margin:5px auto 0; text-align:left; opacity:0.6; filter:alpha(opacity=60);}
.request-area .btn-area {margin:20px 0;}
.request-area .postBtn img {width:120px;}

.dTail {position:absolute; bottom:0; width:100%; height:40px; background:#333333; z-index:9;}
.dTail h1 {margin-top:10px; width:100%; z-index:10; text-align:center; color:#999999; font-size:12px; font-weight:bold; }

#dTail {}
#dTail .tailBG {position:fixed; bottom:0; width:100%; height:80px; background:#333333; z-index:9;}
#dTail h1 {position:fixed; bottom:30px; width:100%; z-index:10; text-align:center; color:#999999; font-size:12px; font-weight:bold;}

/* main table */
@media (min-width:641px) {
	#dHead .headBG {position:fixed; top:0; width:100%; height:86px; background:#fff; z-index:9; box-shadow:0px 2px 3px #666666;}
	#dHead h1 {position:fixed; top:34px; left:20px; z-index:10; opacity:0; filter:alpha(opacity=0); transition:opacity 0.3s ease-in-out;}
	#dHead h1.active {opacity:1; filter:alpha(opacity=100); transition:opacity 0.3s ease-in-out;}
	#dHead h1 img {
	width: 190px;
}
	#dHead .top {display:inline-block; position:fixed; top:40px; right:10px; z-index:10; opacity:0; filter:alpha(opacity=0); transition:opacity 0.3s ease-in-out;}
	#dHead .top.active {width:60%; opacity:1; filter:alpha(opacity=100); transition:opacity 0.3s ease-in-out;}
	#dHead .top li {float:right; height:35px; margin:0 10px 5px 10px; font-family:'맑은 고딕','NanumSquare','Gotham'; color:#333333;}

	#mMenu {display:none;}
	.gnbTotal {display:none;}


	#dHead .top {top:38px; right:5%;}
	#dHead .top.active {width: 80%;}
	#dHead .top li {float:right; font-size:16px; font-weight:bold;}
	#dHead .top img {width:43px;}
	#dHead .btn-scroll a {font-size:12px; line-height:16px;}
	#dHead .btn-scroll a img {height:40px;}
	#dHead .btn-scroll a.up {margin-top:10px; background-size:1px 40px;}
	#dHead .btn-scroll a.down {margin-bottom:10px; background-size:1px 40px; background-position:center bottom}
	#dHead .navi-bar {display:block;}

	.fp-nav.right {right:5%;}

	.fp-controlArrow.fp-prev, .fp-controlArrow.fp-next {width:45px; height:45px;}

	#section0 {background-image:url('../images/main/bajidan_img01.png');}
	#section1 {background-image:url('../images/main/bajidan_img02.png');}
	#section2 {background-image:url('../images/main/bajidan_img03.png');}
	#section3 {background:#e6eef1;}
	#section4 {background:#000;}
	#section6 {background:#fff;}

	.content {min-width:641px;}
	/* .section {min-height:481px;} */
	.section h2 {width:100%; font-size:48px; line-height:60px;}
	.section h2 img {width:47px;}
	.section .txt {padding:0 70px; font-size:24px; line-height:30px}
	/* .section .txt span {display:block;} */

	#section2 h2 {font-size:48px; line-height:60px;}
	#section2 li h3 {font-size:16px; padding:12px 0px 8px;}
	#section2 li img {width:140px;}
	#section2 li span {font-size:12px; }

	#section3 h2 {top:20%; left:0; margin-top:40px; color:#333333;}
	#section3 ul.sublist {width:100%; margin:0 auto; padding-top:60px;}
	#section3 ul.sublist > li {float:left; width:25%; text-align:center;}

	.fp-slidesNav.bottom { bottom:100px; }

	/* history */
	#section4 h2 {top:20%; left:0;margin-top:100px; }
	#section4 ul.sublist {width:100%;margin:0 auto;  padding-top:0;}
	#section4 ul.sublist h3 { color:#d2aa0a; font-size:24px; margin-top:0px;}
	#section4 ul.sublist > li {float:left; width:100%; text-align:center;}
	#section4 ul.sublist > li > ul { margin-top:10px; padding-left:0%;}
	#section4 ul.sublist > li > ul > li { font-size:12px; text-align:center; line-height:28px; letter-spacing:-0.5px;}


	#section6 .content {padding-top:0; color:#333333;}
	#section6 h2 {color:#333333; padding-bottom:30px;}
	#section6 h3 {width:80%; margin:0 auto; margin-top:10px; font-size:20px; text-align:left; font-weight:normal;}
	#section6 ul {width:80%; margin:0 auto; padding-top:10px;}
	#section6 li {float:left; text-align:center; padding-right:20px; font-size:14px; font-weight:bold; letter-spacing:-0.5px;}
	#section6 li:last-child {padding-right:0px;}
	#section6 #glMap {width:80%;}

	.dTail {position:absolute; bottom:0; width:100%; height:60px; background:#333333; z-index:9;}
	.dTail .tailBG {}
	.dTail h1 {margin-top:20px; width:100%; z-index:10; text-align:center; color:#999999; font-size:12px; font-weight:bold; }

	#section6 .location {width:80%; max-width:1040px; min-width:641px; margin:0 auto; text-align:left;}
	#section6 .location h3 {margin:70px 0 30px; padding-bottom:30px; font-size:25px; border-bottom:1px solid #6d6d6d;}
	#section6 .location .location-left {float:left; width:40%; margin-left:40px;}
	#section6 .location .location-right {float:right; width:40%; margin-right:40px;}
	#section6 .location ul li {margin:6px 0; font-size:12px; line-height:22px;}
	#section6 .location ul li strong {width:30px; margin:3px 0 0;}
	#section6 .location ul li strong img {width:20px; margin-top:0;}
	#section6 .location ul li span {line-height:28px;}
	#section6 .location ul li.address strong img {margin-top:11px;}
	#section6 .location ul li.address span {line-height:24px;}
	#section6 .location .location-right img {width:100px;}

	/* request */
	.request-area {width:100%; min-width:640px; padding:103px 0; background:url('../images/main/flux_main_bg01.jpg') no-repeat 50%; background-size:cover;}
	.request-area .btn-close {position:absolute; top:80px; left:50%; margin-left:-13px;}
	.request-area .btn-close img {width:26px;}
	.request-area h3 {margin:30px 0; font-size:13px;}
	.request-area .txt {font-size:35px; line-height:50px;}
	.request-area .txt span {display:block;}
	.request-area .txt span.pc-inline {display:inline;}
	.request-area .txt .comment {margin:20px 0 30px; font-size:14px; line-height:18px;}
	.request-area form ul {width:500px; margin:0 auto; overflow:hidden;}
	.request-area form ul li {float:none; margin:5px;}
	.request-area form ul li input {width:475px; height:30px; padding:10px; font-size:15px;}
	.request-area form textarea {width:475px; height:100px; padding:10px; font-size:15px;}
	.request-area form .checkbox {width:490px; margin:10px auto 20px; padding:0 10px; text-align:left; font-size:14px;}
	.request-area form .checkbox label {font-size:14px;}
	.request-area .postBtn img {width:150px;}
}



/* main pc */
@media (min-width: 961px) {
	/* 공통적용 */
	#dHead .headBG {position:fixed; top:0; width:100%; height:86px; background:#fff; z-index:9; box-shadow:0px 0px 3px #666666;}
	#dHead h1 {position:fixed; top:30px; left:20px; z-index:10; opacity:0; filter:alpha(opacity=0); transition:opacity 0.3s ease-in-out;}
	#dHead h1.active {opacity:1; filter:alpha(opacity=100); transition:opacity 0.3s ease-in-out;}
	#dHead h1 img {}
	#dHead .top {display:inline-block; position:fixed; top:35px; right:25px; z-index:10; opacity:0; filter:alpha(opacity=0); transition:opacity 0.3s ease-in-out;}
	#dHead .top.active {width:60%; opacity:1; filter:alpha(opacity=100); transition:opacity 0.3s ease-in-out;}
	#dHead .top li {float:right; height:35px; margin:0 10px 5px 10px; font-family:'맑은 고딕','NanumSquare','Gotham'; color:#333333;}

	#mMenu {display:none;}
	.gnbTotal {display:none;}

	#dHead .btn-scroll a {font-size:16px; font-weight:normal; line-height:20px;}

	.fp-controlArrow.fp-prev, .fp-controlArrow.fp-next {width:70px; height:70px; }

	.content {min-width:960px;}
/*
	.section {min-height:768px;}
	.section h2 {font-size:60px; line-height:90px;}
	.section h2 img {width:61px;}
	.section .txt {min-width:940px; padding:0 70px; font-size:18px; line-height:28px;}
	.section .txt span {display:block;}
	
	#section2 h2 {font-size:90px; line-height:90px;}
*/

	.section h2 {position:relative; top:50px; font-size:56px; line-height:35px; letter-spacing:-0.5px; opacity:0; filter:alpha(opacity=0);}
	.section h2 img {width:22px;}
	.section .txt {position:relative; top:50px; margin:30px 25px 0; font-size:38px; font-weight:bold; line-height:44px; opacity:0; filter:alpha(opacity=0);}

	/* index */
	#section0 h1 {font-size:48px; margin-top:60px; }
	#section0 h2 {top:20; font-size:96px; margin-top:40px; text-shadow:2px 2px 2px #333333;}
	#section0 .txt {top:0; margin-top:70px;}

            #section0 ul.sublist {  margin:0 auto; padding-top:60px;}
            #section0 ul.sublist h3 { color:#d2aa0a; font-size:26px; margin-top:0px;}
	#section0 ul.sublist > li { width:100%;  text-align:center;  }
	#section0 ul.sublist > li > ul {clear:both; margin-top:20px; padding-left:0%;}
	#section0 ul.sublist > li > ul > li { font-size:16px;  line-height:20px;  letter-spacing:-0.5px;}

	#section1 h1 {font-size:56px;}
	#section1 h2 {font-size:52px; line-height:60px; padding-top:42px;}

            

	/* SERVICES */
	#section2 {color:#FFFFFF;}
	#section2 h2 {top:0; left:-200px; }
	#section2 .txt {top:0; left:200px; font-size:28px; }
	#section2 ul {width:80%; max-width:1024px; margin:0 auto; padding:40px; 20px;}
	#section2 li {float:left; width:33%; text-align:center;}
	#section2 li h3 {font-size:24px; font-weight:bold; padding:16px 0px 12px;}
	#section2 li span {font-size:14px; font-weight:bold;}


	.fp-slidesNav.bottom{ 	bottom: 50px; }

	/* team work */
	#section3 h2 {top:0; left:0PX; margin-top:100px; color:#333333;}
	#section3 .txt {top:100px; left:-100px;}
	#section3 ul.sublist {width:80%; margin:0 auto; padding:40px 10px ;}
	#section3 ul.sublist > li {float:left; padding:10px 0px ; text-align:center;}
		


	/* history */
	#section4 h2 {top:0; left:0PX; margin-top:200px;}
	#section4 .txt {top:300px; left:-300px;}
	#section4 ul.sublist {width:80%;  margin:0 auto; padding-top:60px;}
	#section4 ul.sublist h3 { color:#d2aa0a; font-size:36px; margin-top:0px;}
	#section4 ul.sublist > li { width:50%;  text-align:center;  }
	#section4 ul.sublist > li > ul {clear:both; margin-top:30px; padding-left:0%;}
	#section4 ul.sublist > li > ul > li { font-size:16px;  line-height:20px;  letter-spacing:-0.5px;}

	#section4 .fp-slidesNav.bottom { bottom: 100px; }
	#section4 #fp-nav ul li a span,
	#section4 .fp-slidesNav ul li a span {background:#fff;}

	/* map */
	#section6 .content {padding-top:35px; color:#333333;}
	#section6 h2 {color:#333333; ;}
	#section6 h3 {width:80%; margin:0 auto; margin-top:10px; font-size:20px; text-align:left; font-weight:normal;}
	#section6 ul {width:80%; margin:0 auto; padding-top:10px;}
	#section6 li {float:left; text-align:center; padding-right:16px; font-size:15px; line-height:20px; letter-spacing:-0.5px;}
	#section6 li:last-child {padding-right:0px;}

	#section6 #glMap {height:400px;}

	.dTail {position:absolute; bottom:0; width:100%; height:80px; background:#333333; z-index:9;}
	.dTail .tailBG {}
	.dTail h1 {margin-top:20px; width:100%; z-index:10; text-align:center; color:#999999; font-size:12px; font-weight:bold; }


	/* map */
	#section6 .location {min-width:768px;}
	#section6 .location h3 {margin:100px 0 40px; padding-bottom:30px; font-size:30px;}
	#section6 .location .location-left {min-width:250px; margin-left:30px;}
	#section6 .location .location-right {min-width:250px; margin-right:30px;}
	#section6 .location .location-right ul li {margin:0 0 20px;}
	#section6 .location ul li {margin:15px 0; font-size:14px;}
	#section6 .location ul li strong {width:27px; margin:0 10px 0 5px;}
	#section6 .location ul li strong img {width:24px;}
	#section6 .location ul li span {width:265px;}
	#section6 .location .location-right img {width:134px;}

	/* request */
	.request-area {min-width:900px;}
	.request-area .btn-close {top:103px; margin-left:-18px;}
	.request-area .btn-close img {width:36px;}
	.request-area h3 {margin:60px 0; font-size:15px;}
	.request-area .txt {font-size:56px; line-height:76px;}
	.request-area .txt .comment {margin:25px 0 50px; font-size:16px; line-height:20px;}
	.request-area form ul {width:890px;}
	.request-area form ul li {float:left; margin:5px;}
	.request-area form ul li input {width:415px;}
	.request-area form textarea {width:860px; height:180px;}
	.request-area form .checkbox {width:880px; margin:15px auto 20px;}
	.request-area .postBtn img {width:200px;}

}