@charset "utf-8";


/*------------------------------------------ */
/*--------------- BLUEAPP------------------- */
/*------------------------------------------ */

* { box-sizing:border-box; word-break:keep-all;  }
body { font-family:'klavika_regular', 'NanumBarunGothic', sans-serif; }
.location, .request { display:none; }

#wrapper { width:100%; margin-top:-1px; }

/* common */
.bg { background-position:50% 50%; background-repeat:no-repeat; background-size:cover; }
.inner { max-width:990px; margin:0 auto; }

/* top_down_common */
.top_down { height:500px; background-color:#333; color:#999; display:none; width:100%; position:relative; z-index: 9999; }
.top_down .inner { padding-top:60px; height:90px; }
.top_down .title { font-size:1.625em; line-height:1em; font-weight:500; color:#fff; width:200px; padding-top:3px; margin-right:40px;  }
.top_down .txt { font-size:0.813em; line-height:1.50em; font-weight:500; width:515px; margin-right:40px;  }
.top_down .txt .top { font-size:1.250em; color:#fff; line-height:1.875em;  }
.top_down .info { font-size:0.875em; width:195px; }
.top_down .info .stress { color:#FFF; background:url(../images/info_dash.png) no-repeat 15px 4px; padding-right:20px; display:inline-block; }
.top_down .close { margin-left:932px; float: inherit; }
.top_down .close a { background-color:#fff; width:60px; height:60px; position:absolute; bottom:0; margin-right:0; z-index:1; }

/* location */
.location .map { width:100%; height:350px; background:#CCC; }

/* request */
.request .title { height:100px; border-bottom:#CCC 1px solid; }
.request .txt { height:102px; border-bottom:#CCC 1px solid; }
.request .info { height:102px; border-bottom:#CCC 1px solid; }
.request .info a { text-decoration:underline;}

.request .forms { padding-top:40px; }
.request .forms .iptxt { border-radius:0; }
.request .forms .input01 { width:240px; padding-right:40px; }
.request .forms .input02 { width:555px; height:250px; padding-right:40px; }
.request .forms .input03 { width:160px; }

.request .forms .submit button p { margin-left:-25px; font-size:0.938em; }
.request .forms .submit button { background:url(../images/btn_request.png) no-repeat 140px 24px #1968b3; width:198px; border-radius:0; }
.request .forms .submit button:hover { background:url(../images/btn_request.png) no-repeat 140px 24px #1e77cb;  }


/* main_visual */
.bx-viewport, .bx-wrapper{ position:absolute; width:100%; height:100% !important; top:0; left:0; border:0; margin-bottom:inherit; }
.slideFull { position:absolute;	height:100%; width:100%; top:0; left:0; }
#slide1 {background:url(../images/banner_01.jpg)center center no-repeat;}
#slide2 {background:url(../images/banner_02.jpg)center center no-repeat;}
#slide3 {background:url(../images/banner_03.jpg)center center no-repeat;}
#slide1, #slide2, #slide3 { width:100%; height:100%; -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover;
                            background-size:cover; margin:0; padding:0; background-position:50% 50%;}

#container { height:100%; width:100%; }
#container .top_gap { height: 60px;}
.main_inner { width:100%; height:100%; display:table; /* min-height:750px; */ position:absolute; }
.main_inner .banner_copy { text-align:center; color:#fff; vertical-align:middle; display:table-cell; }
.main_inner .banner_copy .copy_l { font-weight:600; font-size:60px; line-height:55px; }
.main_inner .banner_copy .line { background:rgba(255,255,255,0.7); width:50px; height:2px; margin:25px auto 20px; }
.main_inner .banner_copy .copy_s { font-weight:normal; font-size:24px; color:rgba(255,255,255,0.7) } 


/* header */
#header { /* position:fixed; top:0; */ position:absolute;  /* background-color:#212326; */ background-color:rgba(0,0,0,0.9); z-index:1; }
#header .inner h1 a { background:url(../images/logo_App.png) no-repeat; width:160px; height:50px; display:block; text-indent:-10000px; padding:0; } 
#header .inner ul { padding:20px 0;}

#header .lnb ul li a { color:#FFF; font-size:1.000em; line-height:34px; display:block; padding-left:23px;
                       webkit-transition:all 0.1s ease-in-out-out; 
                       -moz-transition:all 0.1s ease-in-out; 
                       -o-transition:all 0.1s ease-in-out; 
                       transition:all 0.1s ease-in-out; }
#header .lnb ul li a:hover { color:#1d73c5; }

#header .lnb .lnb01 a:hover { background:url(../images/lnb01_ov.png) }
#header .lnb .lnb02 a:hover { background:url(../images/lnb02_ov.png) }
#header .lnb .lnb03 a:hover { background:url(../images/lnb03_ov.png) }

#header .inner .gnb { text-align:center; padding-top:14px; }
#header .inner .gnb .line { color:rgba(166,167,168,0.4); padding:0 8px; font-weight:lighter; font-size:0.500em; }
#header .inner .gnb a { font-size:0.688em; }
#header .inner .gnb a:hover { color:#fff; }

/* nav */
nav.navbar {display:none;}

/* snb */
.left_area { width:270px; margin-top:80px; }
.left_line { width:100%; height:4px; background:#000; }
.left_bg { background:url(../images/left_bg.png) no-repeat 13% 75%; }
.left { float: left;}


/* about */
@media (min-width:1280px) and (max-width:10000px){ 
	
	/* about */
	.left_bg { background:url(../images/left_bg.png) no-repeat 38% 75%; }

}


/* sub - common */
.top_bg { width:100%; height:370px; background-repeat:no-repeat; background-size:cover; background-position:center top; }


/* 01_about */
.top_bg_about { background-image:url(../images/top_bg_about.png); }

.contents { padding:75px 0 120px 0; width:685px; color:#666; font-size:0.938em; line-height:1.625em; }
.contents .about ul li { float:left; width:33.333%; }
.contents .about ul li:nth-child(3n) { margin-right:0; }

.contents .mTitle { color:#000; font-size:0em; font-weight:600; line-height:0.938em; letter-spacing:-0.04em; padding-bottom:30px; }
.contents .txt_box { width:80%; border-top:#000 1px solid; padding:40px 0 0 25px; background:url(../images/img_about02.png) no-repeat 0 44px; margin-top:80px; }
.contents .txt_box h4 { font-style:italic; font-size:1.500em; color:#000; font-weight:bold; letter-spacing:-0.04em; padding-bottom:30px; }


/* 02_solution */
.top_bg_solution { background-image:url(../images/top_bg_solution.png); }

.solution { padding-bottom:0;}
.solution a { text-decoration:underline; }
.solution p { letter-spacing:-0.5px; }

.solution p.contact {font-size:18px; margin-top:10px; padding:10px; text-align: center; background:#f9f9f9;}
.solution p.contact span.txt1 {font-size:14px;color:#4A4A4A}
.solution p.contact strong { color:#1d73c5;font-weight:300}



.img_solution01 { background:url(../images/img_solution01.png); width:270px; height:150px; background-size: 80%; background-position: 50% 0; background-repeat: no-repeat; }
.img_solution02 { background:url(../images/img_solution02.png); width:270px; height:170px; }
.img_solution03 { background:url(../images/img_solution03.png); width:270px; height:150px; }

.solution_txt { border-top:#000 1px solid; margin-top:50px; }
.solution_txt ul li { border-bottom:#e5e5e5 1px solid; padding:25px 15px 30px; }
.solution_txt ul li:after { content:""; display:block; clear:both; }
.solution_txt p { width:50%; float:left; padding-right:40px; }
.solution_txt .txt_m { color:#000; font-size:1em; font-weight:bold; line-height:40px; }

.solution_txt_list { padding-left:10px;}
.solution_txt_list li { border-bottom:0 !important; padding:3px 0 3px 10px !important; position:relative; }
.solution_txt_list li:before { content:"-"; display:inline-block; position:absolute; left:0; font-weight:600; }
 

/* 03_works */
/*
.contents_works { padding:50px 0 120px 0; position:relative; width:740px; color:#666; font-size:0.938em; line-height:1.625em; }
.list a { font-size:1.750em; font-weight:bold; color:#000; padding-left:40px; background:url(../images/works_list_minus.png) no-repeat 0px 10px;
                       webkit-transition:all 0.1s ease-in-out-out; 
                       -moz-transition:all 0.1s ease-in-out; 
                       -o-transition:all 0.1s ease-in-out; 
                       transition:all 0.1s ease-in-out;  }
.list a:hover { color:#1968b3; background:url(../images/works_list_plus.png) no-repeat 0px 10px; }
.list ul li { padding-bottom:30px; width:100% }
.list .date { font-size:0.875em; padding:7px 0 0 40px; } 
.list .date .line { color:#ccc; font-size:0.625em; padding:0 7px; }
 
.sorting { position:fixed; margin-left:600px; border-left:#e5e5e5 1px solid; line-height:1.75em; } 
.sorting ul li { color:#999; font-size:1em; font-family:'klavika_regular';  padding-left:10px; border-left:rgba(255,255,255,0) 1px solid; margin-left:-1px; }
.sorting ul li:hover,
.sorting .active { cursor:pointer; color:#1968b3; border-left:#1968b3 1px solid; }
*/

/* works_detail */
/*
.works_detail-title { color:#FFF; padding-top:275px; }
.works_detail-title h4 { font-size:40px; margin-bottom:8px; }
.works_detail-title .date { color:rgba(255,255,255,0.8); font-size:16px; } 
.works_detail-title .date .line { color:#ccc; font-size:0.625em; padding:0 7px; }

.share { display:none; color:rgba(255,255,255,0.8); }
.share img { vertical-align:middle; }
.share a { opacity:0.6; filter:alpha(opacity=60); padding:5px; }
.share a:hover { opacity:1; filter:alpha(opacity=100); }

.detail_img { padding:60px 0 100px 0;}
.detail_img img { width:100%; height:100%; }

.works_detail-nav { background-color:#f5f5f5; border-top:#dbdbdb 1px solid; height:165px; }
.works_detail-nav .inner { height:130px; border-left:#dbdbdb 1px solid;}
.works_detail-nav ul li { float:left; height:120px; border-right:#dbdbdb 1px solid; width:33.2333%; text-align:center; display:table; }
.works_detail-nav ul li a { color:rgba(0,0,0,0.6); font-size:14px; font-weight:bold; padding-top:50px; width:90px; display:table-cell; vertical-align:middle;
                                       background-repeat:no-repeat; background-position:10px 0px; text-align:center; }
.works_detail-nav ul li a:hover { color:rgba(0,0,0,1); }
.works_detail-nav .prev { background:url(../images/prev_arrow.png) no-repeat center 25px; }
.works_detail-nav .list { background:url(../images/list.png) no-repeat center 25px; }
.works_detail-nav .next { background:url(../images/next_arrow.png) no-repeat center 25px; }
*/

/* 02_works */
.top_bg_works { background-image:url(../images/top_bg_works.png); height:270px; }
#container .sorting { padding:0 0 0 20px; display: flex; }
#container .sorting h3 a { font-size:0.875em; font-family: 'klavika_medium'; letter-spacing:-0.03em; color:#000; padding:0 40px 20px 0; background:url(../images/sorting_chk_plus.png) no-repeat 175px 12px;
                           webkit-transition: all 0.1s ease-in-out-out; 
                           -moz-transition: all 0.1s ease-in-out; 
                           -o-transition: all 0.1s ease-in-out; 
                           transition: all 0.1s ease-in-out;     
						                        }
.works-category-btn-active { color:#1268b3 !important;  background:url(../images/sorting_chk_minus.png) no-repeat 175px 12px !important; }

#container .sorting .category { float:left; color:#666; font-size:0.875em; position:relative; padding:10px 0 55px 0; }
#container .sorting .category ul { float:left; width:165px; padding-right:28px; }

/*#container .sorting .category ul li { display:none;}*/
#container .sorting .category ul h4 { position:relative; height:20px; margin-bottom:20px; cursor:pointer; }
#container .sorting .category ul h4 .title { position:absolute; background-color:#FFF; color:#000; padding-right:6px; font-size: 14px;}
#container .sorting .category ul h4 .line { position:absolute; height:1px; width:100%; background:#cfcfcf; margin-top:9px; }
#container .sorting .category ul li { padding:4px 0;  /* display:none; > h3 click event */ }

#container .sorting .category input[type="checkbox"] { display:none; }
#container .sorting .category input[type="checkbox"] + label { display:inline-block; height:15px; cursor: pointer; padding-left:25px; background:url(../images/chk_box.png) no-repeat 0 0; }
#container .sorting .category input[type="checkbox"]:checked + label { background:url(../images/chk_box.png) no-repeat 0 -15px; }


/* 02_works_paging */
#container .paging { margin-top: 10px; }
#container .paging p { float:left; }
#container .paging a { display:block; width:32px; height:19px; text-indent:-10000px; opacity:0.3; filter:alpha(opacity=30); }
#container .paging a:hover { opacity:1; filter:alpha(opacity=100); }

#container .paging .arrow_left a { background:url(../images/arrow_paging.png) no-repeat 0 0; }
#container .paging .arrow_right a { background:url(../images/arrow_paging.png) no-repeat -32px 0; }

#container .paging .num { color:#000; font-size:1.625em; margin-top:-5px; padding:0 46px;  }
#container .paging .num .on { color:#1268b3; }


/* 02_works_list */
#container .works_top_line { height:1px; background:#000; }
#container .works_list { padding:40px 0 80px 0; }
#container .works_list ul li { float:left; margin:0 38px 30px 0; position:relative; }

#container .works_list .more_data { position:absolute; width:305px; height:220px; padding:20px; background:rgba(0,0,0,.7); z-index:999; display: none;}
#container .works_list .more_data .info { color:rgba(255,255,255,.8); margin-top:50px; text-align:center; }
#container .works_list .more_data .info .date { color:#fff; font-size:0.938em; }

#container .works_list .thumbnail_box { position:relative; box-shadow: box-shadow:0px 0px 10px 1px rgba(0, 0, 0, 0.1); }
#container .works_list .thumbnail a { display:block; width:305px; height:220px; overflow:hidden; border:1px #eee solid;}
#container .works_list .thumbnail a img {position: relative; width:100%; height:100%; }

.work_tip { font-size:.8rem; color:#999; text-align:right; }
.work_tip span {background:#FF882D; color:#fff}


/* 02_works_detail */
#container .works_detail { display:none; /*works_list_Clicl_Event  */ }

.snb { width:200px; color:#000; }
.snb h2 { font-size:1.625em; font-weight:600; margin-top:-7px; }

 
/* footer */
#footer { height:48px; background-color:#000; font-family:Arial, Helvetica, sans-serif; font-size:0.625em; color:#808080; position:fixed; bottom:0; width:100%;}

#footer .copy { line-height:48px; }

#footer .link .link_menu { padding:17px 15px 17px;
                  -webkit-transition:all 0.3s ease-in-out; 
                  -moz-transition:all 0.3s ease-in-out; 
                  -o-transition:all 0.3s ease-in-out; 
                  transition:all 0.3s ease-in-out; 
				  position:relative;}

#footer .link .link_menu:hover { background-color:#1a1a1a; 
                        -webkit-transition:all 0.3s ease-in-out; 
                        -moz-transition:all 0.3s ease-in-out; 
                        -o-transition:all 0.3s ease-in-out; 
                        transition:all 0.3s ease-in-out;}

#footer .link .btn-familysite { display:block; height:14px; background:url(../images/icon_familysite.png) no-repeat 70px -14px; padding:0 20px 0 0; line-height:16px;
                    -webkit-transition:all 0.3s ease-in-out; 
                    -moz-transition:all 0.3s ease-in-out; 
                    -o-transition:all 0.3s ease-in-out; 
                    transition:all 0.3s ease-in-out; }

#footer .link .select_list { background:rgba(0,0,0,0.6);  width:110px; bottom:48px; position:absolute; font-family:'klavika_regular'; display:none; right:0px; }
#footer .link .select_list li a { color:#fff; height:40px; padding:13px 0 0 12px; font-size:1.250em; display:block; background-image:none; line-height:normal; }
#footer .link .select_list li a:hover { background:#1268b3; }

#footer .link_m { display:none; }


/* ko1 */
.disp-n { display:none !important; }
.disp-b { display:block !important; }

.banner_paging li {	cursor:pointer; }
.iptxt {outline-style:none}

#header .inner .gnb a.over { color:#fff; }

.works-category-div .sorting .category ul li { display:none; }

.forms .item textarea, .forms .item input { position:relative; width:100%; /* height:3.125em; vertical-align:middle; */ padding:13px 20px 11px 20px;
                                            background:#494b4d; display:inline-block; z-index:0; overflow:hidden; font-size:0.875em;
                                            font-family:'klavika_regular','NanumBarunGothicLight',sans-serif !important; border:0; color:#fff; outline-style:none; }

.forms .item textarea:focus, .forms .item input:focus { background:#595a5c; }
.forms .item textarea {	height:210px; border:0; resize:none; overflow:auto; }

.empty { width:305px; height:266px; }
.mix{ display:none; }

#header .lnb .lnb01 a.active { color:#1d73c5;background:url(../images/lnb01_ov.png) }
#header .lnb .lnb02 a.active { color:#1d73c5;background:url(../images/lnb02_ov.png) }
#header .lnb .lnb03 a.active { color:#1d73c5;background:url(../images/lnb03_ov.png) }
#header .lnb .lnb04 { margin: -30px 0px 15px 19px; }
#header .lnb .lnb04_text { font-size: 8px; letter-spacing: 1px; }


.sub-page-menu-fix { position:fixed; top:auto; }


/*=====================================

mobile

=====================================*/

@media (max-width:768px) {
	
	/* common */
	.sub-page-menu-fix { position:inherit !important; }
	#header .inner ul { padding:15px 0 20px; }
	
	/* main */
	.main_inner .banner_copy .copy_l { font-size:46px; line-height:50px; }
	
	/* sub */
	.top_bg { height:300px; }
	
	/* 01.about */
	.left_bg { background:none; }
	.left_area { display:none; }
	.contents { float:inherit; margin:0 auto; width:inherit !important; padding:10% 5% 15% !important; }
	
	/* 03.works */
	.sorting { margin-left:570px; }
	.contents_works { width:100%; padding:5%; margin-top:60px; }
	.list a,
	.list .date { padding-left:30px; }
	
	/*
	.works_detail-title { padding:210px 0 0 20px; }
	.works_detail-title h4 { font-size:36px; }
	*/

	/* nav */
	.navbar { padding:0 !important; background-color:#1968b3 !important; }
	.navbar .logo { margin-top:6px; padding:0; }
	.navbar-collapse { background-color:#fff; text-align:center; }
	.navbar-nav { box-shadow:0px 0px 18px 1px rgba(0, 0, 0, 0.1); background-color:#333; padding:1% 0; }
	.navbar-light .navbar-nav .nav-link { color:#fff !important; }
	.navbar-light .navbar-toggler { border:0 !important; float:right; font-size:28px; color:#fff; margin:14px 10px 0 0; height:inherit; }
	.navbar-light .navbar-toggler:hover, 
	.navbar-light .navbar-toggler:focus { background-color:inherit !important; outline:0 !important; }
	
	/* footer */
	#footer {  padding:0 2% 0 3%; }
	
}

@media (max-width:426px) {
	
	/* nav */
	.navbar-nav { padding:3% 0; }	
	
	/* main */
	.main_inner .banner_copy { padding-bottom:10rem; }
	.main_inner .banner_copy .line { margin:5% auto 4%; }
	.main_inner .banner_copy .copy_l { font-size:20px; line-height:20px; }
	.main_inner .banner_copy .copy_s { font-size:12px; }
	
	/* con */
	.contents { padding:10% 5% 45% !important; }
	.contents .mTitle { }	
	.contents .about ul li { float:inherit; width:100%; }
	.contents .txt_box { width:inherit; margin-top:40px; }
	.solution_txt p { width:inherit; float:inherit; }
	.solution_txt .txt_m { line-height:20px; }
	#container { margin-top:60px; }
	.top_bg { height:150px; }
	
	/* works */
	.contents_works { width:inherit; padding:5% 5% 20%; margin-top:0; }
	.list { border-top:1px #ddd solid; margin-top:8%; }
	.list ul li { padding:1em 0; border-bottom:1px #ddd dotted; }
	.list a { font-size:1.2em; }
	.list a, .list .date { padding-left:0; background:none; }
	.sorting { margin-left:0; position:inherit; }
	
	/*
	.works_detail-nav { margin-bottom:48px; }
	.works_detail-nav ul li a { background-size:40% !important; }
	.works_detail-title { padding:0; text-align:center; }
	.works_detail-title h4 { font-size:24px; }
	.works_detail-title .date { float:inherit; }
	*/
	
	.top_bg_works { display:table; }
	.top_bg_works .inner { display:table-cell; vertical-align:middle; }
	.detail_img { padding:0; }
	
		
	/* footer */
	#footer { height:100px; text-align:center; padding-top:20px; }
	#footer .copy { float:inherit; }
	#footer .link { display:none; }
	#footer .link_m { display:block; text-align:center; }
	#footer .link_m a { display:inline-block; border:1px rgba(255,255,255,0.2) solid; padding:5px 10px; margin:0 1px; }
		
	
}