@charset "utf-8";
/* Author oopblog.com */
/* reset */
html,body,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,big,cite,code,del,dfn,em,font,img,ins,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,ul,ol,li,dl,dt,dd,table,caption,tbody,tfoot,thead,tr,th,td,fieldset,fo7m,label,legend,input,button,textarea,select{margin:0;padding:0}
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{display:block;margin:0;padding:0}
legend{display:block;overflow:hidden;position:absolute;width:1px;height:1px;font-size:1px;line-height:0;text-indent:-999em;white-space:nowrap; }
fieldset,img,table,caption,tbody,tfoot,thead,tr,th,td,button,hr{border:0 none}
img{vertical-align:middle}
body li{*vertical-align:top}
ul li{list-style:none; padding:0; margin:0;}
table{border-collapse:collapse}
caption{visibility:hidden;overflow:hidden;width:0;height:0;font-size:0;line-height:0;}
button{overflow:visible;border:0 none;cursor:pointer}
button::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="reset"]::-moz-focus-inner {padding: 0;border: 0 none}
body{position:relative;line-height:18px;font-size:12px;font-family:"나눔고딕",Nanum Gothic,"맑은고딕",Malgun Gothic,'돋움',dotum,Verdana,AppleGothic,Arial,Helvetica,sans-serif; color:#616161; }
a { text-decoration:none; color:#616161}
em { font-style:normal }
input[type="text"],
input[type="password"] ,
textarea { font-size:12px;font-family:"나눔고딕",Nanum Gothic,'돋움',dotum,Verdana,AppleGothic,Arial,Helvetica,sans-serif; }
select { font-size:12px;font-family:"맑은고딕",Malgun Gothic,"나눔고딕",Nanum Gothic,'돋움',dotum,Verdana,AppleGothic,Arial,Helvetica,sans-serif; }


/**************************************************************************************************************
	공통
**************************************************************************************************************/
.blind{overflow:hidden;position:absolute;top:-1px;left:-1px;width:1px;height:1px;padding:0;margin:0;font-size:0;line-height:0;background:none;}
.mb10 { margin-bottom:10px !important }
.mb20 { margin-bottom:20px !important }
.mb30 { margin-bottom:30px !important }
.mb40 { margin-bottom:40px !important }
.mb50 { margin-bottom:50px !important }
.mb70 { margin-bottom:70px !important }
.pd_top28 { padding-top:28px !important }
.pd_left34 { padding-left:34px !important }
.pd0 { padding:0 !important }
.mgb_0 { margin-bottom:0 !important }
.f_green01 { color:#00561f !important }
.pd_left20 { padding-left:20px !important }
.pd_left22 { padding-left:22px !important }
.mg_bot { margin-bottom:15px !important }
.mg_bot50 { margin-bottom:50px !important }
.mg_bot25 { margin-bottom:25px !important }
.txt_center { text-align:center !important }
.txt_left { text-align:left !important }
.f12 { font-size:12px !important }
.f_gray { color:#92969b !important }
.mb12 { margin-bottom:12px !important }

body,html { height:100% }
body { min-width:320px }
#header { position:fixed; left:0; top:0; z-index:5000; width:100%; height:71px; background:url(../img/common/bg_top.png) repeat-x 0 0; }
#head { max-width:1300px; margin:0 auto; position:relative }
h1 { padding:15px 0 0 15px; }
#gnb { position:absolute; right:0; top:0; }
#gnb ul li { float:left; margin-left:10px }
#gnb ul li a { display:block; padding:0 20px; height:65px; line-height:63px; font-size:15px; color:#505050; }
#gnb ul li.m1 a:hover,
#gnb ul li.m1.active a { color:#fff; background:#234f9a; }
#gnb ul li.m2 a:hover,
#gnb ul li.m2.active a { color:#fff; background:#29a6e8; }
#gnb ul li.m3 a:hover,
#gnb ul li.m3.active a { color:#fff; background:#b1cc00; }
#gnb ul li.m4 a:hover,
#gnb ul li.m4.active a { color:#fff; background:#f13c6f; }
#gnb ul li.m5 a:hover,
#gnb ul li.m5.active a { color:#fff; background:#33b294; }
#gnb ul li.m6 a:hover,
#gnb ul li.m6.active a { color:#fff; background:#f1ab3c; }


#gnb_m ul li a {  display:block; padding:0 20px; height:65px; line-height:63px; font-size:15px; color:#505050; }
#gnb_m ul li.m1 a:hover,
#gnb_m ul li.m1.active a { color:#fff; background:#234f9a; }
#gnb_m ul li.m2 a:hover,
#gnb_m ul li.m2.active a { color:#fff; background:#29a6e8; }
#gnb_m ul li.m3 a:hover,
#gnb_m ul li.m3.active a { color:#fff; background:#b1cc00; }
#gnb_m ul li.m4 a:hover,
#gnb_m ul li.m4.active a { color:#fff; background:#f13c6f; }
#gnb_m ul li.m5 a:hover,
#gnb_m ul li.m5.active a { color:#fff; background:#33b294; }
#gnb_m ul li.m6 a:hover,
#gnb_m ul li.m6.active a { color:#fff; background:#f1ab3c; }

#gnb_m { display:none; position:absolute; left:0; top:56px; width:100%; height:auto; background:#333; display:none; }
#gnb_m ul { overflow:hidden; }
#gnb_m ul li { float:left; width:50%; margin-left:0 } 
#gnb_m ul li a { height:50px; line-height:50px; text-align:center; color:#fff; border-bottom:1px solid #666;  }
#gnb_m ul li:nth-child(even) a { border-left:1px solid #666; }




.section { padding-top:65px; margin-top:-65px }

/* Rolling */
#main_rolling .rolling_box {  }
#main_rolling .rolling_box .img01 { background-image:url(../img/main01.jpg); background-position:50% bottom; }
#main_rolling .rolling_box .img02 { background-image:url(../img/main02.jpg) }
#main_rolling .rolling_box .img03 { background-image:url(../img/main03.jpg) }
#main_rolling .rolling_box .img04 { background-image:url(../img/main04.jpg) }
#main_rolling .rolling_box > div {  height:814px; position:relative; background-position:50% 50%; background-repeat:no-repeat; transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%;  background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
#main_rolling .rolling_box > div .txt { text-align:center; padding-top:240px; max-width:810px; margin:0 auto; }
#main_rolling .rolling_box > div .txt img { width:95% }
#main_rolling .bx-controls { display:none }
.sns_box { height:143px; overflow:hidden; max-width:830px; margin:0 auto; margin-top:-143px; position:relative; z-index:100; }
.sns_box p { float:left; width:33.33%; text-align:center; }
.sns_box p img { width:90%; }


/* 섹션 관련 */
.section_title { height:134px; background:#e3e3e3; }
.section_title .left_box { width:40%; float:left; background:url(../img/bg_section01.gif); height:134px; position:relative }
#business .section_title .left_box { background:url(../img/bg_section02.gif); }
#partner .section_title .left_box { background:url(../img/bg_section03.gif); }
#sns .section_title .left_box { background:url(../img/bg_section04.gif); }
#customer .section_title .left_box { background:url(../img/bg_section05.gif); }
.section_title .left_box p { position:absolute; right:123px; top:37px; height:53px; }
.section_title .right_box { width:60%; float:left; }
.section_title .right_box p { line-height:25px; font-size:15px; color:#666666; padding:15px 20px }

.section_cont { padding-top:45px;  }
.content { max-width:1300px; margin:0 auto; }

/************************************************************************************************************************
	01. CATEGORY
************************************************************************************************************************/
#category .tab_box { border:1px solid #d9d9d9; margin:0 10px }
#category .tab_box ul { display:table; width:100%; border-collapse:collapse; }
#category .tab_box ul li { display:table-cell; } 
#category .tab_box ul li a { display:block; height:62px; line-height:50px; padding-top:12px; font-size:17px; color:#999; text-align:center; }
#category .tab_box ul li a:hover,
#category .tab_box ul li.on a { color:#0b6589; background:url(../img/tab_box_on.gif) repeat-x 0 bottom; }
#category .tab_cont { padding:40px } 
#category .tab_cont:after { clear:both; display:block; content:''; }
#category .tab_cont ul li { float:left; width:10%; margin-bottom:32px; }
#category .tab_cont ul li a { display:block; white-space:nowrap; overflow:hidden; width:90%; height:36px; line-height:35px; font-size:15px; color:#575757; border:1px solid #1885c8; border-radius:40px; text-align:center; }
#category .tab_cont > div { display:none }
#category .tab_cont > div.on { display:block }



/************************************************************************************************************************
	02. business
************************************************************************************************************************/
#business .tab_box {   }
#business .tab_box > ul { padding-right:1px; position:relative; }
#business .tab_box > ul:after { display:block; content:''; clear:both; }
#business .tab_box > ul > li { float:left; width:33.333333%; }
#business .tab_box > ul > li .btn1 { padding-left:1px; display:block; }
#business .tab_box > ul > li .btn1 a { position:relative; display:block; background:#f7f7f7; border:1px solid #e3e3e3; height:50px; padding-top:12px; font-size:14px; color:#818181; text-align:center; white-space:nowrap;  }
#business .tab_box > ul > li .btn1 a em { display:block; color:#bababa; font-size:18px; padding-top:4px;}
#business .tab_box > ul > li.on .btn1 a .arrow { position:absolute; left:50%; bottom:-13px; width:26px; height:13px; background:url(../img/biz_tab_box_arrow.png) no-repeat 0 0; margin-left:-13px; }
#business .tab_box > ul > li.on .btn1 a  { background:#234f9a; border-color:#234f9a; color:#fff; }
#business .slide_box { position:absolute; left:0; top:100px; width:100%; visibility:hidden; }
#business .slide_box .bx-wrapper { width:800px; margin:0 auto; position:relative }
#business .slide_box .bx-viewport ul li div { border:1px solid #ccc; }
#business .slide_box img { width:100%;  }
#business .slide_box .bx-pager { display:none }
#business .slide_box .bx-prev { position:absolute; left:-50px; top:45%; width:32px; height:52px; background:url(../img/biz_btn_prev.png) no-repeat 0 0; text-indent:-9999px; }
#business .slide_box .bx-prev:hover { background:url(../img/biz_btn_prev_on.png) no-repeat 0 0; }
#business .slide_box .bx-next { position:absolute; right:-50px; top:45%; width:32px; height:52px; background:url(../img/biz_btn_next.png) no-repeat 0 0; text-indent:-9999px; }
#business .slide_box .bx-next:hover { background:url(../img/biz_btn_next_on.png) no-repeat 0 0; }
#business .content { min-height:700px; }

#business .tab_box > ul > li.on .slide_box { visibility:visible;  }

/************************************************************************************************************************
	03. partner
************************************************************************************************************************/
#partner { margin-bottom:40px }
.partner_list ul:after { display:block; content:''; clear:both; }
.partner_list ul li { float:left; width:16.6666%; }
.partner_list ul li span { display:block; padding:0 6px; }
.partner_list ul li em { display:block; height:42px; line-height:42px; margin-bottom:32px; text-align:center; font-size:13px; color:#414141; }
.partner_list ul li img { width:100%; border:1px solid #cfcfcf; box-sizing:border-box; }
.partner_list_btn { text-align:right; padding-right:6px }
.partner_list_btn a { display:inline-block; height:32px; line-height:31px; padding:0 20px; background:#e9e9e9; border:1px solid #d8d8d8; font-size:15px; color:#666666; font-weight:bold }


/************************************************************************************************************************
	04. sns
************************************************************************************************************************/
#sns .section_cont { background:#f4f4f4; padding-bottom:40px }
#sns .phone_box { width:443px; height:825px; background:url(../img/sns/bg03.jpg) no-repeat 0 0; float:left; }
#sns .phone_box .rolling { width:368px; height:652px; padding:73px 0 0 27px; position:relative }
#sns .rolling_box:after { display:block; content:''; clear:both }
#sns .sns_rolling_box { max-width:930px; margin:0 auto; }
#sns .bx-pager { display:none; }
#sns .bx-controls-direction .bx-prev { position:absolute; top:387px; left:-40px; width:24px; height:40px; background:url(../img/sns/btn_prev.png) no-repeat 0 0; text-indent:-9999px; }
#sns .bx-controls-direction .bx-next { position:absolute; top:387px; right:-90px; width:24px; height:40px; background:url(../img/sns/btn_next.png) no-repeat 0 0; text-indent:-9999px; }



#sns .phone_detail_box { float:left; padding:182px 0 0 95px; width:390px; }
#sns .phone_detail_box .phone_info_box { height:280px; padding-left:15px }
#sns .phone_detail_box .phone_info_box .info { display:none }
#sns .phone_detail_box .phone_info_box .info .txt01 { height:80px }
#sns .phone_detail_box .phone_info_box .info .txt02 { font-size:42px; color:#484848; line-height:46px; font-weight:bold; margin-bottom:25px; }
#sns .phone_detail_box .phone_info_box .info .txt03 { font-size:17px; color:#5f5f5f; line-height:20px; margin-bottom:9px; }
#sns .phone_detail_box .phone_info_box .info.on { display:block }
#sns .phone_detail_box .detail_btn_box ul li { float:left; width:85px; margin-right:10px }
#sns .phone_detail_box .detail_btn_box ul li a { display:block; padding-top:53px; text-align:center; color:#a6a6a6; font-size:14px }
#sns .phone_detail_box .detail_btn_box ul li.btn01 { margin-right:15px }
#sns .phone_detail_box .detail_btn_box ul li.btn01 a { background:url(../img/sns/rolling_btn01_off.png) no-repeat 50% 0; }
#sns .phone_detail_box .detail_btn_box ul li.btn02 a { background:url(../img/sns/rolling_btn02_off.png) no-repeat 50% 0; }
#sns .phone_detail_box .detail_btn_box ul li.btn03 a { background:url(../img/sns/rolling_btn03_off.png) no-repeat 50% 5px; }
#sns .phone_detail_box .detail_btn_box ul li.btn04 a { background:url(../img/sns/rolling_btn04_off.png) no-repeat 50% 5px; }

#sns .phone_detail_box .detail_btn_box ul li.btn01.on a,
#sns .phone_detail_box .detail_btn_box ul li.btn01 a:hover { background:url(../img/sns/rolling_btn01_on.png) no-repeat 50% 0; }
#sns .phone_detail_box .detail_btn_box ul li.btn02.on a,
#sns .phone_detail_box .detail_btn_box ul li.btn02 a:hover{ background:url(../img/sns/rolling_btn02_on.png) no-repeat 50% 0; }
#sns .phone_detail_box .detail_btn_box ul li.btn03.on a,
#sns .phone_detail_box .detail_btn_box ul li.btn03 a:hover { background:url(../img/sns/rolling_btn03_on.png) no-repeat 50% 5px; }
#sns .phone_detail_box .detail_btn_box ul li.btn04.on a,
#sns .phone_detail_box .detail_btn_box ul li.btn04 a:hover { background:url(../img/sns/rolling_btn04_on.png) no-repeat 50% 5px; }



/************************************************************************************************************************
	05. customer
************************************************************************************************************************/
#customer { }
#customer .customer_desc { font-size:20px; color:#dd9524; text-shadow:1px 1px 1px #fff; }
#customer .section_cont { background:#edf0e1; padding-bottom:100px }
.customer_form_box { max-width:930px; margin:0 auto; }
.customer_form_box .inner_box { padding:0 10px }
.customer_form_box dl { overflow:hidden; margin-bottom:16px }
.customer_form_box dl dt { float:left; width:10%; font-size:14px; color:#d43e23; font-weight:bold; line-height:32px; }
.customer_form_box dl dd { float:left; width:90%; }
.customer_form_box dl dd div { border:1px solid #dbdecf; padding:0 10px; background:#fff; }
.customer_form_box dl dd input { width:100%; height:32px; border:0; margin:0; line-height:32px; font-size:14px; color:#aaad9f; background:#fff; }
.customer_form_box dl dd textarea { resize:none; width:100%; height:375px; border:0; padding:10px 10px 0 0; margin:0; line-height:18px; font-size:14px; color:#aaad9f; background:#fff; }
.customer_form_box dl dd .btn_form_send { display:block; height:38px; font-size:18px; text-align:center; line-height:37px; color:#fff; background:#d13328; border-radius:3px }

/* FOOTER */
#footer_wrap { padding:25px 0 35px; background:#fff; border-top:1px solid #e5e5e5; }
#footer { max-width:1280px; margin:0 auto; overflow:hidden; padding:0 10px; }
#footer .sitemap_box { float:left; margin-bottom:15px }
#footer .sitemap_box ul { overflow:hidden; margin-bottom:11px }
#footer .sitemap_box ul li { float:left; margin-left:30px; }
#footer .sitemap_box ul li:first-child { margin-left:0 }
#footer .sitemap_box ul li a { font-size:14px; color:#4a4a4a; }
#footer .sitemap_box .address { font-size:14px; color:#888888; }
#footer .sns_footer { float:right; } 
#footer .sns_footer li { float:left; margin-left:11px }


/* ETC */
.section_1 { z-index:1000; }
.section_2 { z-index:900; }
.section_3 { z-index:800; }
.section_4 { z-index:700; }
.section_5 { z-index:600; }
.section_6 { z-index:500; }

/* 레이어 팝업 */
.layer_sms { display:none; width:510px; background:#f8fbff; border-radius:4px; }
.layer_sms .tit_box { height:47px; line-height:46px; background:#e3e9f0; border-bottom:1px solid #d2d9e2; border-radius:4px 4px 0 0; }
.layer_sms .tit_box .tit { font-size:21px; color:#515a65; text-align:center; }
.layer_sms .btn_close { position:absolute; right:17px; top:11px; }
.text_box { padding:25px; }
.text_box textarea { border:1px solid #e8e8e8; background:#f8f8f8; width:100%; height:166px; box-sizing:border-box; resize:none; }
.layer_sms .inp_box { padding:0 25px; margin-bottom:20px; overflow:hidden; }
.layer_sms .inp_box p { float:left; margin-right:6px; }
.layer_sms .inp_box p input { height:16px; line-height:16px; border:1px solid #a3a3a3; max-width:64px; }
.layer_sms .inp_box p select { height:18px; line-height:16px; border:1px solid #a3a3a3; max-width:64px; }
.layer_sms .desc_box { color:#757c84; padding:0 25px 35px 25px;  border-bottom:1px solid #e5e8ed; }
.layer_sms .btn_box { text-align:center; padding:15px 0 35px; }
.layer_sms .btn { display:inline-block; height:31px; width:110px; line-height:30px; text-align:center; border-radius:4px; font-size:14px; color:#717171; }
.layer_sms .btn.btn_blue { background:#077cc4; border:1px solid #077cc4; color:#fff; }
.layer_sms .btn.btn_white { background:#fff; border:1px solid #d8d9da; }
.layer_sms .send_sms { padding:30px 0; font-size:14px; color:#757c84; text-align:center; }
.layer_sms .send_sms strong { color:#444a51; }

.btn_menu { position:absolute; right:0; top:0; display:none; }


@media all and (max-width:1000px) { 
	#sns .sns_rolling_box { padding-top:215px; position:relative }
	#sns .phone_box { float:none; margin:0 auto; }
	#sns .phone_detail_box { float:none; padding:30px 0 0 0; margin:0 auto;}
	#sns .phone_detail_box .phone_info_box { position:absolute; top:0; left:50%; width:320px; margin-left:-210px  }
	
}

@media all and (max-width:900px) { 
	#header { height:62px; background-position:0 bottom; }
	h1 img { width:220px }
	.btn_menu { display:block; }
	#gnb { display:none; }
	
	#main_rolling .rolling_box > div { height:600px }
	#main_rolling .rolling_box > div .txt { padding-top:150px }
	.section_title .left_box p { left:7px; }
	.section_title .right_box p  { line-height:20px; font-size:13px }
	#category .tab_cont ul li { float:left; width:20%; margin-bottom:20px }
	#business .tab_box > ul > li .btn1 a  { font-size:11px; letter-spacing:-1px }
	
	.partner_list ul li { width:33.33333% }
	.partner_list ul li em { height:30px; line-height:32px; margin-bottom:12px; font-size:12px }
	
	#business .content { padding:0 15px; max-width:1270px; min-height:400px; }
	#business .tab_box > ul > li { float:none; width:100%; margin-bottom:15px; position:relative; height:64px; }
	#business .tab_box > ul > li.on { height:auto }
	#business .tab_box > ul > li .btn1 { margin-bottom:20px }
	#business .slide_box { position:static }
	#business .slide_box .bx-next { right:10px; top:35%; }
	#business .slide_box .bx-prev { left:10px; top:35% }
}

@media all and (max-width:700px) { 
	#category .tab_box ul li.w700 { display:none }
	.customer_form_box dl dt { width:20%; }
	.customer_form_box dl dd { width:80%; }
}

@media all and (max-width:500px) { 
	.section_title .left_box p { height:40px;  }
	.section_title .left_box p img { height:100%; }
	.section_title .right_box p  { line-height:15px; font-size:11px; padding:10px 15px; letter-spacing:-1px }
	#category .tab_box ul li.w500 { display:none }
	#category .tab_cont  { padding:15px }
	#category .tab_cont ul li { width:25% }
	#sns .bx-controls-direction .bx-prev { left:-30px }
	#sns .bx-controls-direction .bx-next { right:-77px }
	#sns .phone_box { width:280px; height:542px; background-size:280px 542px; }
	#sns .phone_box .rolling { width:231px; height:355px; padding:70px 0 0 18px; position:relative }
	#sns .phone_box .rolling img { width:231px }
	#sns .phone_box .bx-controls-direction { display:none }
	#sns .phone_detail_box { max-width:320px; margin:0 auto; }
	#sns .phone_detail_box .phone_info_box { width:300px; margin:0; left:15px; padding:0 }
	#sns .phone_detail_box .phone_info_box .info .txt02 { font-size:25px }
	#sns .phone_detail_box .phone_info_box .info .txt03 { font-size:12px }
	#sns .phone_detail_box .detail_btn_box ul li { width:80px; margin:0 !important ; }
	#sns .phone_detail_box .detail_btn_box ul:after { display:block; content:''; clear:both }
	#sns .phone_detail_box .detail_btn_box ul li a { font-size:11px }
	#sns .phone_detail_box .phone_info_box .info .txt01 { height:70px }
	#sns .phone_detail_box .phone_info_box .info .txt02 { margin-bottom:0 }
	#sns .sns_rolling_box { padding-top:175px }	
	#customer .customer_desc  { font-size:12px; }
	.customer_form_box dl dd textarea { height:150px }
}

@media all and (max-width:400px) { 
	h1 img { width:170px; padding-top:6px }
	#main_rolling .rolling_box > div { height:300px }
	#main_rolling .rolling_box > div .txt { padding-top:90px }
	.sns_box { margin-top:-70px; height:70px; }
	#category .tab_box ul li a { height:42px; line-height:30px; padding-top:6px; font-size:12px }
	#category .tab_cont ul li { margin-bottom:6px; width:33.33%; }
	#category .tab_cont ul li a{ width:90%; font-size:10px; height:24px; line-height:24px; }
}






@media all and (max-width:640px) {
	.sns_box p { width:50%; }
	.sns_box p:last-child { display:none }
	/*
	#main_rolling .rolling_box > div { height:450px }
	#main_rolling .rolling_box > div .txt { padding-top:100px }
	*/
}

@media all and (max-width:480px) {	/* width 320px 기준 */
	
}