@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

/* main.css 반응형 */
/* ----------------------------------------- PC 크기 -------------------------------------------- */
/* 퀵메뉴 */
.quick_menu {position:relative; width:1200px; margin:0 auto; opacity:0;}
.quick_menu ul {z-index:500; position:absolute; right:-200px; top:200px;}
.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;}
.quick_menu ul li a img {margin:5px 0 6px;}
.quick_menu ul li a span {display:block;}

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

/* 메인비쥬얼배너 */
.main_visual { overflow:hidden; position:relative; width:100%; height:800px; font-family:'Noto Sans KR', sans-serif; }
.main_visual .visual_txt { overflow:hidden; position:absolute; top:160px; left:50%; transform:translateX(-50%); }
.main_visual .visual_txt dl dt { font-size:50px; text-shadow:0 0 5px rgba(0,0,0,.2); color:#fff; }
.main_visual .visual_txt dl dd { margin:5px 0; font-size:35px; color:#fff; }
.main_visual .slide01 dl { opacity:0; margin-top:100px; text-align:center; }
.main_visual .slide02 dl { opacity:0; margin-top:100px; text-align:center; }
.main_visual .slide03 dl { opacity:0; margin-top:1000px; text-align:center; }

.main_visual .visual_txt p { position:relative; padding-bottom:4px; margin-bottom:30px; font-size:20px; text-shadow:0px 0px 5px rgba(0,0,0,.2); color:#fff; }
.main_visual .visual_txt p span { display:block; width:40px; height:2px; margin:3px auto 0; background:#fff; }
.main_visual .visual_txt a { display:block; width:162px; height:38px; margin:80px auto 0; line-height:38px; text-align:center; color:#fff; border:1px solid #fff; border-radius:20px; background:rgba(0,0,0,.3); transition:all .25s; }
.main_visual .visual_txt a:hover { border-color:#ff6a12; background:#ff6a12; }

.main_visual .bx-wrapper .bx-pager { top:740px; }
.main_visual .bx-wrapper .bx-pager.bx-default-pager a { width:20px; height:20px; background:url(/images/visual_page_btn.png)no-repeat; }
.main_visual .bx-wrapper .bx-pager.bx-default-pager a:hover, .main_visual .bx-wrapper .bx-pager.bx-default-pager a.active, .main_visual .bx-wrapper .bx-pager.bx-default-pager a:focus { background:url(/images/visual_page_btn_on.png)no-repeat; }

/* 컴홈 안내 */
.info {height:434px; background:url(/images/info_bg.png)no-repeat left top; }
.info .title { margin-bottom:30px; text-align:center; }
.info .title span { font-weight:bold; }
.info .title h2 { margin-bottom:10px; font-size:40px; font-weight:bold; font-family:'Noto Sans KR', sans-serif; }
.info .title p { font-size:15px; line-height:20px; }

.info .contents { position:relative; width:1100px; margin:0 auto; }
.info .contents > div { float:left; position:relative; top:50px; width:200px; height:200px; padding:20px; border:1px solid #c3c3c3; background:#fff; opacity:0; box-sizing:border-box;}
.info .contents > div + div { margin-left:25px; }
.info .contents > div p { font-size:20px; text-align:center; }
.info .contents > div p span { display:block; width:14px; height:2px; margin:8px auto 0; background:#333; }
.info .contents > div .info_ico { width:150px; height:150px; margin:0 auto; border-radius:50%; }
.info .contents > div .info_ico p { margin-top:30px; }

/* 인사말 */
.greeting {padding:0; background:url(/images/section_01.jpg)no-repeat center center fixed; }
.greeting .contents { float:left; overflow:hidden; position:relative; left:-30px; width:50%; margin-right:20px; padding:40px; text-align:right; border:1px solid #eaeaea; border-radius:2px; background:#fff url(/images/greeting_pattern.png)no-repeat 7% -130px; opacity:0; box-sizing:border-box; }
.greeting .contents h2 { margin-bottom:20px; font-size:40px; font-family:'Noto Sans KR', sans-serif; }
.greeting .contents p { margin-bottom:10px; font-size:15px; line-height:30px; }
.greeting .contents p:last-child { margin-bottom:0px; }

.greeting .img { overflow:hidden; position:relative; right:-30px; width:48%; opacity:0; box-sizing:border-box; }
.greeting .img div:first-child { margin-bottom:20px; }
.greeting .img div { overflow:hidden; width:100%; height:299.5px; padding:20px; border:1px solid #eaeaea; border-radius:2px; background:#fff; box-sizing:border-box; }
.greeting .img div p {overflow:hidden; width:100%; height:100%;}
.greeting .img div p img {width:100%;}

/* 요금안내 가기 */
.go_price { padding:0; background:url(/images/section_bg02.jpeg)no-repeat 50% 50% fixed; }
.go_price > div > div { position:relative; width:320px; height:320px; margin:0 auto; padding-top:40px;  text-align:center; background:#fff; border-radius:50%; opacity:0; box-sizing:border-box; transition:all .25s; }
.go_price > div > div p { margin:20px 0; font-size:16px; }
.go_price > div > div p span { color:#ff6a12; }
.go_price > div > div a { display:block; width:100px; height:30px; margin:0 auto; text-align:center; border:1px solid #333; border-radius:20px; line-height:28px; box-sizing:border-box; transition:all .25s; }
.go_price > div > div a:hover { color:#fff; border-color:#ff6a12; background:#ff6a12; }

/* 빠른접수 */
.reserve { padding:0;}
.reserve .reserve_bg01 { float:left; overflow:hidden; position:relative; width:50%; height:650px; background:#ff9100; box-sizing:border-box; }
.reserve .reserve_bg02 { float:right; overflow:hidden; position:relative; width:50%; height:650px; background-image: linear-gradient(to right, #ff9100 0%, #F9C122 100%); background-size:cover; box-sizing:border-box; }
.reserve .reserve_inner { position:relative; width:1200px; margin:0 auto; }
.reserve .reserve_inner .title { position:absolute; top:50px; margin-bottom:30px; }
.reserve .reserve_inner .title span { color:#fff; font-weight:bold; }
.reserve .reserve_inner .title h2 { margin-bottom:10px; font-size:40px; font-weight:bold; font-family:nanumsquareb; color:#fff;  }
.reserve .reserve_inner .title p { font-size:15px; line-height:20px; color:#fff; }

.reserve .reserve_inner .reserve_table { position:absolute; left:-30px; top:180px; width:800px; padding:20px; background:#fff; opacity:0; box-sizing:border-box;  }
.reserve .reserve_inner .reserve_table table { width:100%; margin-bottom:5px; border:1px solid #dadada; box-sizing:border-box; }
.reserve .reserve_inner .reserve_table table tr { border-bottom:1px solid #dadada; }
.reserve .reserve_inner .reserve_table table tr th { position:relative; width:53px; font-size:20px; text-align:center; color:#4e4e4e; border-right:1px solid #dadada; box-sizing:border-box; }
.reserve .reserve_inner .reserve_table table tr td { padding:6px; box-sizing:border-box; }
.reserve .reserve_inner .reserve_table table tr td.post_num { width:320px; border-right:1px solid #dadada; }
.reserve .reserve_inner .reserve_table table tr td.post_num input { width:204px; }
.reserve .reserve_inner .reserve_table table tr td .txt_a { width:100%; height:40px; font-size:15px; border:0;}
.reserve .reserve_inner .reserve_table table tr td .capcha { margin-right:4px;}
.reserve .reserve_inner .reserve_table table tr td button { width:100px; height:40px; font-size:15px; color:#fff; border:1px solid #dadada; background:#ff6a12; box-sizing:border-box; vertical-align:bottom; transition:all .25s; }
.reserve .reserve_inner .reserve_table table tr td button:hover {background:#ff8c12;}
.reserve .reserve_inner .reserve_table table tr td select { width:100%; height:40px; font-size:15px; color:#757575; border:0; }
.reserve .reserve_inner .reserve_table table tr td textarea { width:100%; height:133px; font-size:15px; border:0; resize:none; }

.reserve .reserve_inner .btn { position:absolute; left:0; top:560px; width:162px; height:42px; }
.reserve .reserve_inner .btn button { width:100%; line-height:38px; color:#fff; border:1px solid #fff; border-radius:20px; background:none; transition:all .25s; }
.reserve .reserve_inner .btn button:hover { color:#ff6a12; background:#fff; }
	/* 서비스접수현황 */
.reserve .current_inner { position:absolute; right:0px; top:0; width:380px; }
.reserve .current_inner .current { position:absolute; right:-30px; top:180px; width:380px; height:366.25px; padding:20px; background:#fff; opacity:0; box-sizing:border-box; }
.reserve .current_inner .current .current_slide table { table-layout:fixed; border-top:1px solid #333; border-bottom:1px solid #333; }
.reserve .current_inner .current .current_slide table tr td { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height:32px; padding:8px; border-bottom:1px solid #dadada; box-sizing:border-box; }
.reserve .current_inner .current .current_slide table tr:last-child td { border-bottom:0; }
.reserve .current_inner .current .current_slide table tr td.address { width:250px; }

.reserve .bx-wrapper { margin-bottom:40px; }
.reserve .bx-wrapper .bx-pager { top:310px; }
.reserve .bx-wrapper .bx-pager.bx-default-pager a { width:20px; height:20px; background:url(/images/visual_page_btn.png)no-repeat; }
.reserve .bx-wrapper .bx-pager.bx-default-pager a:hover, .reserve .bx-wrapper .bx-pager.bx-default-pager a.active, .reserve .bx-wrapper .bx-pager.bx-default-pager a:focus { background:url(/images/visual_page_btn_on.png)no-repeat; }

/* 고객센터&롤링게시판 */
	/* 고객센터 */
.rolling_notice { background:url(/images/section_bg03.jpg)no-repeat; }
.rolling_notice .consumer { position:relative; text-align:center; }
.rolling_notice .consumer p { font-size:60px; font-weight:bold; color:#fff; }
.rolling_notice .consumer p img { margin-top:-10px; }
.rolling_notice .consumer span { display:block; margin-bottom:5px; font-size:15px; color:#fff; }
	/* 컴퓨터수리리뷰 */
.rolling_notice .review { float:left; position:relative; width:590px; padding:20px; margin:50px 20px 50px 0; background:#fff; box-sizing:border-box; }
.rolling_notice .review .title { position:relative; width:100%; margin-bottom:20px; }
.rolling_notice .review .title h2 { position:relative; font-size:24px; color:#ff6a12; }
.rolling_notice .review .title h2:before { content:""; display:block; position:absolute; left:-30px; top:10px; width:20px; height:3px; background:#ff6a12; }
.rolling_notice .review .title a { position:absolute; right:0; top:5px; font-size:18px; transition:all .25s; }
.rolling_notice .review .title a:hover { transform:rotate(180deg); }

.rolling_notice .review table { table-layout:fixed; border-top:1px solid #333; border-bottom:1px solid #333; }
.rolling_notice .review table tr td { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height:32px; padding:8px; border-bottom:1px solid #aeaeae; box-sizing:border-box;}
.rolling_notice .review table tr:last-child td { border-bottom:0; }
.rolling_notice .review table tr td.date { width:95px; }
.rolling_notice .review table tr td.address { width:415px; }

.rolling_notice .bx-wrapper { margin-bottom:40px; }
.rolling_notice .bx-wrapper .bx-pager { top:275px; }
.rolling_notice .bx-wrapper .bx-pager.bx-default-pager a { width:20px; height:20px; background:url(/images/visual_page_btn.png)no-repeat; }
.rolling_notice .bx-wrapper .bx-pager.bx-default-pager a:hover, .rolling_notice .bx-wrapper .bx-pager.bx-default-pager a.active, .rolling_notice .bx-wrapper .bx-pager.bx-default-pager a:focus { background:url(/images/visual_page_btn_on.png)no-repeat; }
	/* 체인점 */
.rolling_notice .chain { float:right; position:relative; width:590px; padding:20px; margin:50px 0; background:#fff; box-sizing:border-box; }
.rolling_notice .chain .title { position:relative; width:100%; margin-bottom:20px; }
.rolling_notice .chain .title h2 { position:relative; color:#ff6a12; font-size:24px; }
.rolling_notice .chain .title h2:before { content:""; display:block; position:absolute; left:-30px; top:10px; width:20px; height:3px; background:#ff6a12; }
.rolling_notice .chain .title a { position:absolute; right:0; top:5px; font-size:18px; transition:all .25s; }
.rolling_notice .chain .title a:hover { transform:rotate(180deg); }

.rolling_notice .chain table { table-layout:fixed; border-top:1px solid #333; border-bottom:1px solid #333; }
.rolling_notice .chain table tr td { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height:32px; padding:8px; border-bottom:1px solid #aeaeae; box-sizing:border-box;}
.rolling_notice .chain table tr:last-child td { border-bottom:0; }
.rolling_notice .chain table tr td.name { width:40px; }
	/* 수리안내 퀵메뉴 */
.rolling_notice .info_quick { position:relative; width:800px; margin:0 auto; box-sizing:border-box; transition:all 25s; }
.rolling_notice .info_quick ul li { display:block; position:relative; float:left; width:160px; height:100px; }
.rolling_notice .info_quick ul li + li:before { content:""; position:absolute; left:0; top:0; width:2px; height:100px; background:rgba(255,255,255,.2); }
.rolling_notice .info_quick ul li img { display:block; text-align:center; margin:0 auto 3px; }
.rolling_notice .info_quick ul li a { display:block; text-align:center; color:#fff; }
.rolling_notice .info_quick ul li a:hover { color:#ff6a12; }