/* sub.css */
/* --------- common (모든 sub에 공통) ------------------------------------------------- */
.blind { position:inherit; }
.inner { width:1200px; margin:0 auto; }
.inner900 { width:900px; margin:0 auto; }
.cf:after { content:""; display:block; clear:both; }
[lang='en'] { font-family:'Titillium', 'Noto Sans KR', sans-serif }
.alignL { text-align:left; }
section { overflow:hidden; position:relative; width:100%; padding:50px 0; box-sizing:border-box; transition:all .25s; }
.pattern_bg {padding:50px 0; background:url(/images/pattern_bg.png)repeat;}

/* 서브 퀵메뉴 */
.sub_quick_menu {position:relative; width:1200px; margin:0 auto;}
.sub_quick_menu ul {z-index:500; position:absolute; right:-100px; top:200px;}
.sub_quick_menu ul li a {display:block; width:80px; height:80px; text-align:center; border:1px solid #909090; border-bottom:0; background:#fff; box-sizing:border-box;}
.sub_quick_menu ul li a img {margin:5px 0 6px;}
.sub_quick_menu ul li a span {display:block;}

.sub_quick_menu ul li.top a {height:30px; color:#fff; line-height:28px; border-bottom:1px solid #909090; background:#ff6a12;}
.sub_quick_menu ul li.top a i {line-height:28px;}

/* 서브비쥬얼배너 */
.sub_visual { position:relative; width:100%; height:350px; margin-bottom:50px; box-sizing:border-box; }
.sub_visual:after { content:""; position:absolute; left:0; top:0; width:100%; height:350px; backgrousub_bg.png)no-repeat; opacity: .2; box-sizing:border-box;}
.sub_visual p { padding-top:170px; font-family:'Noto Sans KR', sans-serif; font-size:30px; text-align:center; color:#fff; }

/* agree */
.agree { position:relative; margin-bottom:50px;}
.agree_bg { background-image: linear-gradient(120deg, #9fbee6 0%, #398cff 100%);}
.agree textarea { width:100%; height:1000px; margin-bottom:50px; padding:20px; color:#666; border:1px solid #e0e0e0; line-height:20px; resize:none; box-sizing:border-box;}

/* btn */
.btn {display:block; text-align:center; margin-bottom:50px; }
.btn button { display:inline-block; width:162px; height:42px; text-align:center; line-height:40px; border:1px solid #e0e0e0; border-radius:20px; background:#fff; transition:all .25s; }
.btn button + button { margin-left:10px; }
.btn button:hover { border-color:#ff6a12; background:#ff6a12; color:#fff; }

/* sub_gnb */
.sub_gnb { z-index:1; position:absolute; left:0; bottom:0; width:100%; height:50px; border-top:1px solid rgba(225,225,225,.3); background:rgba(255,255,255,.1); box-sizing:border-box; }
.sub_gnb .inner > div { float:left; position:relative; height:50px; color:#fff; line-height:50px; border-left:1px solid rgba(225,225,225,.3); box-sizing:border-box;}
.sub_gnb .inner > div.home span { display:block; overflow:hidden; width:49px; color:#fff; box-sizing:border-box; }
.sub_gnb .inner > div.home span a { display:block; overflow:hidden; text-align:center; box-sizing:border-box; }
.sub_gnb .inner > div.home span i { font-size:20px; line-height:49px; color:#fff; }
.sub_gnb .inner > div.depth span { display:block; padding:0 27px; text-align:center; box-sizing:border-box;}
.sub_gnb .inner > div.depth span a { display:block; overflow:hidden; text-align:center; box-sizing:border-box; }
.sub_gnb .inner > div.depth span i { padding-left:5px; line-height:49px; }
.sub_gnb .inner > div:last-child { width:185px; border-right:1px solid rgba(225,225,225,.3); cursor:pointer; }

.sub_gnb .inner .sub_menu { z-index:100; display:none; position:relative; margin-top:-1px; border:1px solid #dadada; border-top:0; }
.sub_gnb .inner .sub_menu span {border-bottom:1px solid #dadada; background:#fff;}
.sub_gnb .inner .sub_menu span:last-child {border-bottom:0;}
.sub_gnb .inner .sub_menu span:hover {background:#f9f9f9;}

/* notice */
.notice .search { position:relative; height:42px; margin-bottom:25px; }
.notice .search .btn { float:left; margin-bottom:25px; }
.notice .search .btn button { display:inline-block; width:162px; height:42px; text-align:center; line-height:40px; border:1px solid #e0e0e0; border-radius:20px; background:#fff; transition:all .25s; }
.notice .search .btn button:hover {border-color:#ff6a12; background:#ff6a12;}

.notice .search .search_btn { float:right; position:relative; height:42px; margin-bottom:25px; }
.notice .search .search_btn input { width:275px; height:42px; padding:0 10px; border:1px solid #e1e1e1; border-radius:20px; background:#fff; }
.notice .search .search_btn button { position:absolute; right:0; top:0; width:42px; height:42px; border-radius:0 20px 20px 0; }

.notice table { table-layout:fixed; margin-bottom:50px; border-top:1px solid #ff6a12; }
.notice table tr { border-bottom:1px solid #e0e0e0; }
.notice table th { padding:15px; font-family:'Noto Sans KR', sans-serif; text-align:center; background:#f9f9f9; box-sizing:border-box; }
.notice table td { padding:15px; font-family:'Noto Sans KR', sans-serif; text-align:center; box-sizing:border-box; }
.notice table .num { width:80px; padding:15px; }
.notice table .title { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left; box-sizing:border-box; }
.notice table .title a:hover { color:#ff6a12; }
.notice table .name { width:90px; }
.notice table .date { width:115px; }
.notice table .check { width:90px; }

/* view */
.view table { border-top:1px solid #ff6a12; }
.view table th { padding:15px; font-family:'Noto Sans KR', sans-serif; text-align:center; border-bottom:1px solid #efefef; background:#f9f9f9; box-sizing:border-box; }
.view table th input { width:300px; height:30px; font-size:15px; vertical-align:middle;}
.view table .title { width:90%; text-align:left; }
.view .txt { padding:30px 20px; border-bottom:1px solid #efefef; line-height:20px;}
.view .txt img { max-width:100%; }
.view .tag { margin-bottom:50px; padding:20px; border-bottom:1px solid #ff6a12; }

/* paging */
.paging { margin-bottom:50px; text-align:center; }
.paging a { display:inline-block; width:30px; height:30px; margin:0 2px; font-family:'Noto Sans KR', sans-serif; text-align:center; font-size:12px; line-height:30px; color:#666; border:1px solid #efefef; box-sizing:border-box; transition:all .25s; }
.paging a.page.selected { color:#fff; border-color:#ff6a12; background:#ff6a12; }
.paging a:hover { color:#fff; border-color:#ff6a12; background:#ff6a12; }
.paging i { display:inline; line-height:30px; }

/* board */
.board table { position:relative; width:900px; margin:0 auto 50px; border:1px solid #dadada; box-sizing:border-box; }
.board table tr { border-bottom:1px solid #dadada; }
.board table tr th { position:relative; width:53px; font-size:20px; text-align:center; color:#4e4e4e; border-right:1px solid #dadada; box-sizing:border-box; }
.board table tr td { padding:6px; box-sizing:border-box; }
.board table tr td.post_num { width:400px; border-right:1px solid #dadada; }
.board table tr td.post_num input { width:284px; }
.board table tr td .txt_a { width:100%; height:40px; font-size:15px; border:0;}
.board table tr td .capcha { margin-right:4px;}
.board table tr td button { width:100px; height:40px; font-size:15px; color:#fff; border:1px solid #dadada; background:#ff6a12; box-sizing:border-box; transition:all .25s; vertical-align:bottom;}
.board table tr td button:hover {background:#ff8c12;}
.board table tr td select { width:100%; height:40px; font-size:15px; color:#757575; border:0; }
.board table tr td textarea { width:100%; height:200px; font-size:15px; border:0; resize:none; }

.board .policy { width:900px; margin:0 auto 50px; box-sizing:border-box;}
.board .policy .checkbox { margin-bottom:5px;}
.board .policy .checkbox label { color:#666;}
.board .policy .policy_txt { overflow-y:hidden; height:200px; padding:15px 10px; border:1px solid #dadada; background:#f1f1f1; box-sizing:border-box; }
.board .policy .policy_txt p { margin:0 0 15px 3px; font-size:15px; }
.board .policy .policy_txt textarea { position:relative; width:100%; height:140px; line-height:20px; padding:0; color:#666; border:0; background:none; resize:none; }

/* board02 */
.board02 table { position:relative; width:900px; margin:0 auto 50px; border-top:1px solid #ff6a12; box-sizing:border-box; }
.board02 table tr { border-bottom:1px solid #e0e0e0; }
.board02 table tr th { position:relative; width:90px; text-align:center; background:#f9f9f9; box-sizing:border-box; }
.board02 table tr td { padding:6px; box-sizing:border-box; }
.board02 table tr td .txt_a { width:100%; height:37px; border-color:#d8d8d8;}
.board02 table tr td textarea { width:100%; height:200px; border-color:#d8d8d8; resize:none; }

.board02 .policy { width:900px; margin:0 auto 50px; box-sizing:border-box;}
.board02 .policy .checkbox { margin-bottom:5px;}
.board02 .policy .checkbox label { color:#666;}
.board02 .policy .policy_txt { overflow-y:hidden; height:200px; padding:15px 10px; border:1px solid #dadada; background:#f1f1f1; box-sizing:border-box; }
.board02 .policy .policy_txt p { margin:0 0 15px 3px; font-size:15px; }
.board02 .policy .policy_txt textarea { position:relative; width:100%; height:140px; line-height:20px; padding:0; color:#666; border:0; background:none; resize:none; }

/* snb */
.snb { position:relative; width:1200px; height:50px; margin:0 auto 50px; border-top:3px solid #1f3e6f; box-sizing:border-box; }
.snb ul li { float:left; width:calc(100% / 6); height:50px; line-height:50px; text-align:center; box-sizing:border-box; transition:all .25s;}
.snb ul li a { display:block; width:100%; height:100%; border:1px solid #a5a5a5; border-top:0; border-right:0; background:#eefaff; box-sizing:border-box; }
.snb ul li:last-child a { border-right:1px solid #a5a5a5; }
.snb ul li a:hover { background:#c5e2ef; }
.snb ul li a.act { border-bottom-color:#fff; background:#fff; }

/* --------- 파일명=클래스명 ------------------------------------------------- */
/* sub_visual */
.sub_visual.qna, .sub_visual.qna_view, .sub_visual.board_qna, .sub_visual.board_complaint, .sub_visual.review, .sub_visual.review_view, .sub_visual.board_review { background-image: linear-gradient(-225deg, #B6CEE8 0%, #F578DC 100%); }
.sub_visual.chain, .sub_visual.board_chain {background-image: linear-gradient(120deg, #01ad7d 0%, #ffe21e 100%);}
.board_computer, .sub_visual.board_upgrade, .sub_visual.board_monitor, .sub_visual.board_data, .sub_visual.board_network, .sub_visual.board_maintenance {background-image: linear-gradient(to right, #ff6a12 0%, #ffcc12 100%);}
.sub_visual.info, .sub_visual.price {background-image: linear-gradient(120deg, #5c9aff 0%, #8fdcff 100%);}
.sub_visual.modify { background-image: linear-gradient(-225deg, #FFE29F 0%, #FFA99F 48%, #FF719A 100%); }

/* tel */
.sub_visual.tel { margin-bottom:0; background-image: linear-gradient(-225deg, #FFE29F 0%, #FFA99F 48%, #FF719A 100%);}

.tel { padding:50px 0; background:#925e5e; }
.tel .consumer { position:relative; text-align:center; }
.tel .consumer p { font-size:60px; font-weight:bold; color:#fff; }
.tel .consumer p img { margin-top:-10px; }
.tel .consumer span { display:block; margin-bottom:10px; font-size:15px; color:#fff; }
.tel .btn {margin-bottom:0;}

/* service_price */
.service_price .price_table { margin-bottom:50px; }
.service_price .price_table h3 { margin:20px 0; font-size:25px; line-height:40px; text-align:center; color:#003348; }
.service_price .price_table h4 { margin-top:30px; color:#004d6d; font-size:20px; line-height:30px; text-indent:20px; }
.service_price .price_table span {display:block; padding-bottom:5px; color:#ff6a12;}
.service_price .price_table table { width:100%; margin-bottom:10px; border:1px solid #dadada; }
.service_price .price_table table tr { height:30px; }
.service_price .price_table table tr th { height:40px; font-size:15px; text-align:center; color:#fff; border-right:1px solid #dadada; background:#1f3e6f; }
.service_price .price_table table tr td { height:30px; padding:5px 10px; border-top:1px solid #dadada; border-right:1px solid #dadada; }

/* service_info */
.service_info .info_table { margin-bottom:50px; }
.service_info .info_table table { table-layout:fixed; width:100%; margin-bottom:20px; border:1px solid #dadada;}
.service_info .info_table tr { height:150px; border-bottom:1px dashed #dadada; box-sizing:border-box; }
.service_info .info_table tr td { position:relative; border-right:1px dashed #dadada; padding:30px 0; text-align:center; box-sizing:border-box; }
.service_info .info_table tr div span { display:block; margin-top:20px; font-size:16px; text-align:center; }

.service_info .info_table .info_hover { position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.5); opacity:0; cursor:pointer; transition:all .25s; }
.service_info .info_table .info_hover.act { opacity:1; }
.service_info .info_table .info_hover a { display:block; width:120px; height:40px; margin:62px auto; color:#fff; line-height:40px;background:#ff6a12; transition:all .25s; }
.service_info .info_table .info_hover a:hover { background:#ff5f00; }

.service_info .info_table .txt p { position:relative; margin-bottom:10px; font-size:15px; }
.service_info .info_table .txt p i { color:#ff6a12; margin-right:3px; }

/* modify
.board02 p { float:right; margin-bottom:10px; color:#ff6a12; }
.board02 span { color:#ff6a12; } */