/*     722165 : 타이틀 텍스트      */
@font-face {
font-family: 'GmarketSansBold';
src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@keyframes fadeIn {
0% {
transform: scale(1);
opacity: 1;		
}
60% {
transform: scale(1.1);	
}
80% {
transform: scale(1.1);
opacity: 1;	
}	
100% {
transform: scale(1.1);
opacity: 1;	
}		
}

@-webkit-keyframes fadeIn {
0% {
-webkit-transform: scale(1);
opacity: 1;		
}
60% {
-webkit-transform: scale(1.1);
}
80% {
-webkit-transform: scale(1.1);
opacity: 1;	
}	
100% {
-webkit-transform: scale(1.1);
opacity: 1;	
}		
}

@-webkit-keyframes text-focus-in {
0% {
-webkit-filter: blur(12px);
filter: blur(12px);
opacity: 0;
}

100% {
-webkit-filter: blur(0px);
filter: blur(0px);
opacity: 1;
}
}

@keyframes text-focus-in {
0% {
-webkit-filter: blur(12px);
filter: blur(12px);
opacity: 0;
}

100% {
-webkit-filter: blur(0px);
filter: blur(0px);
opacity: 1;
}
}
.text-focus-in { -webkit-animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) 0.5s both; animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) 0.5s both; }
.btn_ov{-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; padding: 15px 50px 15px 50px; border: 91cff2px solid #4c5a6a!important; border-radius: 5px!important; background: #91cff2!important; color: #fff!important; }
.btn_ov:hover{-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; background:#4c5a6a!important; border: 2px solid #4c5a6a!important; color: #fff!important; border-radius:0px!important; }
.wrap { display:flex; align-items:center; }
.under_line{position: relative;}
.under_line:before{width: 100%; height: 1px; background: #333;  position: absolute; content: ''; bottom: -2px;}
.under_line2{position: relative;}
.under_line2:before{width: 100%; height: 1px; background: #46aaa4;  position: absolute; content: ''; bottom: -2px;}
.under_line3{position: relative;}
.under_line3:before{width: 100%; height: 1px; background: #505e6d;  position: absolute; content: ''; bottom: -2px;}
.index_line{width: 100px;  height: 2px; background: #fff; opacity: 0.2}
.index_color_sub{color: #fff !important; text-shadow: 1px 2px 1px rgba(000,000,000,0) }	
.index_line2{width: 100px;  height: 2px; background: #fff; opacity: 0.2}
.index_color_sub2{color: #333!important; text-shadow: 1px 2px 1px rgba(000,000,000,0) }		
.line_w100{width: 100%; height: 1px; background: #eee;}
.index_w1200,.index_1200{max-width: 1200px; margin: 0 auto;}
.main1_bg{ animation-name: fadeIn; animation-fill-mode: forwards; -webkit-animation-name: fadeIn; animation-duration: 4.5s; -webkit-animation-duration: 4.5s; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; }

.max_h_sub { height: 900px; overflow: hidden; position: relative; width: 100%; }
.main1_bg { width: 100%; margin: 0 auto; position: relative; height: 900px; margin-top: 0px; text-align: center; padding-top: 50px; }
.new_main_text { text-align: left; position: absolute; bottom: 15%; left: 20%; overflow: hidden; z-index: 10; }

.max50px { overflow: hidden !important; }

.sub_color { color: #676057 !important; }
.sub_btns { width: 100%; display: inline-block; background: #7f6a60 !important; height: auto; color: #fff; }

.on_cyss { width: 200px; height: 200px; border-radius: 50%; background:rgba(50, 147, 218, 0.2); position: absolute; bottom: 20%; left: 15%; z-index: 1 }

.map{max-width:100%;}
.map>img{width:100%;}

.cu_t_wrap { width: 96%; height: auto; margin-left: 2%; display: inline-block; border-top: 1px solid #fafafa; padding-top: 20px; padding-bottom: 30px; }
#bo_cate #bo_cate_on { z-index: 2; color: #ffa63b; position: relative; }
#bo_cate #bo_cate_on:before { z-index: 2; position: absolute; width: 100%; height: 3px; background: #ffa63b; bottom: 0px; left: 0px; content: ''; }
#bo_cate ul { text-align: center; }
#bo_cate ul:after { display: block; visibility: hidden; clear: both; content: "" }
#bo_cate li { margin-bottom: -1px; width: auto; margin: 0.1%; display: inline-block; }
#bo_cate a { display: block; position: relative; margin-left: -1px; height: 50px; padding: 0 35px 0 35px; line-height: 50px; padding-top: 0px; background: #fafafa; color: #888; text-align: center; cursor: pointer; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; font-family: 'Pretendard-Light'; }
#bo_cate a:hover { display: block; position: relative; margin-left: -1px; height: 50px; line-height: 50px; padding-top: 0px; background: #fafafa; color: #888; text-align: center; cursor: pointer; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
#bo_cate a:focus,
#bo_cate a:hover,
#bo_cate a:active { text-decoration: none }

.bg_img1 { background: url(/img_up/shop_pds/prana11/build/option/peu-ra-na-i-bi-in-hu-gwa_-sang-dan01743481558.jpg) 75%; background-size: cover; }

.warts { max-width: 1100px; margin: 0 auto; }
.warts2 { width: 100%; padding: 5%; background: #fff; display: inline-block; }

.box_info { width: 49%; float: left; margin: 0.15%; }
.box_info1 { height: 60px; line-height: 60px; width: 100%; background: #f1f1f1; text-align: center; font-size: 18px; }
.box_info2 { height: 60px; line-height: 60px; background: rgba(255, 255, 255, 0.3); text-align: center; font-size: 18px; }

.info_texts { width: 100%; height: auto; padding: 10px 30px 0px 10px; }

.cy_icons { width: 3px; height: 3px; background: #333; line-height: 80px; float: left; margin-right: 20px; margin-top: 18px; }

.box_ft2 { width: 100%; max-width: 1200px; margin: 0 auto; display: block; }
.box_ft2_warp { width: 100%; display: inline-block; height: auto; background: #f1f1f1; height: auto; }

.ft_allscs2 { float: left; width: 50%; padding: 5% 5% 0% 5%; }
.line_addressss { width: 100%; height: 1px; background: #444; opacity: 0.1; }

#tabssbs { overflow: auto; width: 100%; list-style: none; margin: 0; padding: 0; }
#tabssbs li { width: 50%; margin: 0px; padding: 0px; float: left; text-align: center; height: 60px; line-height: 60px; }
#tabssbs a { width: 100%; background: #f1f1f1; color: #333; float: left; line-height: 60px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; height: 60px; text-decoration: none; }
#tabssbs a:hover { background: #333; color: #fff; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
#tabssbs a:focus { outline: 0; }
#tabssbs #current a { background: #000; text-shadow: none; color: #fff; }

#content_2 { padding: 0px; }

.sub_plus_title3 { width: 100%; padding: 5px 5px 5px 10px; color: #fff; font-size: 18px; float: left; border-radius: 10px; }

.bus1 { background: #50a232; padding: 2px 8px 2px 8px; border-radius: 5px; float: left; color: #fff; }
.bus2 { background: #385ab0; padding: 2px 8px 2px 8px; border-radius: 5px; float: left; color: #fff; }

.nomberss { float: left; width: 20px; height: 20px; background: #fff; color: #000; }
.boxxx { width: 100%; height: auto; display: inline-block; padding: 20px; }
.img_mas { margin-top: -10px; }

.btn_boxs2 { width: 100%; margin: 1%; height: 60px; line-height: 60px; border: 0px; text-align: center; float: left; position: relative; }
.btn_boxs2:before { content: " + "; position: absolute; right: 20px; top: 0px; text-align: center; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
.btn_boxs2:hover:before { content: " ↓ "; position: absolute; right: 15px; top: 0px; text-align: center; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease; transition: all 0.5s ease; }
.ov_eff { overflow: hidden; }

.contactw { width: 100%; height: auto; display: inline-block; background: linear-gradient(90deg, #f7f7f7 50%, #f7f7f7 50%); margin-top: -10px; }
.contact { max-width: 1200px; margin: 0 auto; }

.contactw .map {max-width:100%;}
.contactw .map >img {width:100%;}

.cons_t1 { width: 50%; float: left; }
.cons_t2 { width: 50%; padding-left: 5%; float: left; position: relative; }

.index_color3 { color: #4c5e6e; }

.nomss { font-family: 'GmarketSansBold'; }

.tit_foots { float: left; padding-right: 20px }
.tit_foots2 { float: left; }

.btn_boxs3 { width: 40%; margin: 1%; height: 50px; border-radius: 30px; line-height: 50px; border: 2px #46aba6 solid; text-align: center; float: left; position: relative; }
.btn_boxs3:before { content: " + "; position: absolute; right: 20px; top: 0px; text-align: center; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
.btn_boxs3:hover:before { content: " → "; position: absolute; right: 15px; top: 0px; text-align: center; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; 
-o-transition: all 0.5s ease; transition: all 0.5s ease; }

/* 탭 전체 스타일 */
.tabs { margin-top: 0px; padding-bottom: 40px; background-color: #f7f7f7; width: 100%; margin: 0 auto; }

/* 탭 스타일 */
.tab_item { width: calc(100%/2); height: 50px; background-color: #f8f8f8; line-height: 50px; font-size: 16px; text-align: center; color: #4c5a6a; display: block; float: left; text-align: center; font-weight: bold; transition: all 0.2s ease; }
.tab_item:hover { opacity: 0.75; }

/* 라디오 버튼 UI삭제*/
input[name="tab_item"] { display: none; }

/* 탭 컨텐츠 스타일 */
.tab_content { display: none; padding: 0px 0px 0; clear: both; overflow: hidden; }

/* 선택 된 탭 콘텐츠를 표시 */
#all:checked~#all_content,
#programming:checked~#programming_content,
#design:checked~#design_content { display: block; }

/* 선택된 탭 스타일 */
.tabs input:checked+.tab_item { background-color: #4c5a6a; color: #fff; }

.map__2516465__{display:block !important;}
.map__2516465__ iframe {width:100%;vertical-align:top}
.map__2516465__ p {display:none;margin:0;padding:1em 0;font-size:13px}
.map__2516465__ .build_preview__2516465__ {display:table;width:100%}
.map__2516465__ .build_preview__2516465__ .inner__2516465__ {display:table-cell;height:450px;border:1px solid #ddd;background:#f8f8f8;text-align:center;vertical-align:middle}
.map__2516465__ .build_preview__2516465__ .inner__2516465__ .subject__2516465__ {display:block;font-size:16px;font-weight:bold}
.map__2516465__ .build_preview__2516465__ .inner__2516465__ .exp_text__2516465__ {display:block;margin-top:10px;font-weight:normal;font-size:13px;color:#777}


@media all and (max-width:900px) {
.max50px { height: auto; }
.max_h_sub { height: 600px; }
.main1_bg { height: 600px; }
.new_main_text { bottom: 10%; left: 10%; }

.on_cyss { bottom: 15%; left: 5%; }
.tabs iframe{width:auto;}

.bo_cate_sel { width: 100%; padding: .8em .4em; padding-left: 12px; border: 1px solid #eee; background: url(/img_up/shop_pds/prana11/build/option/1741843516_5487.png) no-repeat 99% 50%; background-size: 20px; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 16px; color: #000; margin-top: 3px; }
.bo_sch select { width: 100%; padding: .8em .4em; padding-left: 12px; border: 1px solid #eee; background: url(/skin/board/sub/img/baseline_keyboard_arrow_down_black_18dp.png) no-repeat 99% 50%; background-size: 20px; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 16px; color: #000; margin-top: 3px; }
.bo_cate_sel:hover { border-color: #ddd; }
.bo_cate_sel:focus { border-color: #ddd; }

.warts { max-width: 1300px; width: 95%; }

.box_info { width: 48%; border: 1px solid #f9f9f9; }
.box_info1 { width: 100%; font-size: 14px; }
.box_info2 { font-size: 14px; }

.info_texts { padding: 10px 30px 0px 30px; }

.cy_icons { margin-right: 3px; margin-top: 15px; }

.ov_hs { max-height: 350px; }

.box_ft2 { width: 95%; }
.box_ft2_warp { background: #fff; }

.ft_allscs2 { width: 100%; padding: 5% 5% 5% 5%; border-bottom: 1px solid #fafafa; }

.contactw { width: 95%; display: block; margin: 0 auto; background: linear-gradient(90deg, #f7f7f7 100%, #f7f7f7 0%); }

.cons_t1 { width: 100%; display: block; text-align: left; }
.cons_t2 { width: 100%; padding-left: 0%; }

.btn_boxs3 { width: 48%; border-radius: 5px; }

}



@media all and (min-width:1024px) {
.boxxx { padding:50px }
}

