@charset "utf-8";
/* CSS Document */

/*web*/
@media only screen and (max-width: 1100px) {
	#sub{min-width:inherit;}
	#sub .sub_wrap{width:98%;}
	#sub .sub_wrap .leftmenu{width:20%;}
	#sub .sub_wrap .leftmenu h2{width:100%;}
	#sub .sub_wrap .sub_contents{width:78%;}
	#sub .sub_wrap .leftmenu li a.over{background:url(../images/sub/lnb_up_icon.gif) no-repeat 92% center;}
	#sub .sub_wrap .leftmenu li a.down{background:url(../images/sub/lnb_down_icon.gif) no-repeat 92% center;}
	#sub .sub_wrap .leftmenu li a.left{background:url(../images/sub/lnb_right_icon.gif) no-repeat 92% center;}
	/*joinus*/
	.joinus ul{width:95%;}

}

@media only screen and (max-width:980px) {
	/*login*/
	.login .sub_wrap{width:98%;}
	.login .login_box .login_input{ padding:40px 50px; }
	.add_service a em{padding:20px 0 0 50%; }
	.add_service a.add_01{background:url(../images/sub/service_icon_01.png) no-repeat 10% center #fff;}
	.add_service a.add_01:hover{background:url(../images/sub/service_icon_01_over.png) no-repeat 10% center #01479d; }
	.add_service a.add_02{background:url(../images/sub/service_icon_02.png) no-repeat 10% center #fff;}
	.add_service a.add_02:hover{background:url(../images/sub/service_icon_02_over.png) no-repeat 10% center #01479d;}
	.add_service div{background:url(../images/sub/service_icon_03.png) no-repeat 10% center #fff;width:33%; height:90px;  display:inline-block; flaot:right; float:right;border-radius: 4px; -moz-border-radius:4px; -webkit-border-radius:4px; border-bottom:2px solid #dcdddf;}
	.add_service div p{font-size:20px; font-weight:400; color:#01479d; font-style:italic; margin:20px 0 0 40%; }
	.add_service div span{font-size:13px; font-weight:200; color:#787878; font-style:200; margin:5px 0 0  40%; letter-spacing:0;}
}

@media only screen and (max-width:870px) {
	.login .login_box .login_input{ padding:40px 40px; }
	.add_service div{background:url(../images/sub/service_icon_03.png) no-repeat 5% center #fff;width:32%; }
	.add_service div span{font-size:13px; font-weight:200; color:#787878; margin:5px 0 0  40%; letter-spacing:-1px;}
	/*joinus*/
	.joinus ul li{width:50%; margin-bottom:15px; }
	.joinus ul li.second .line{background-image:none;}
	.typebox>li{width:100%;}
	.typebox li li>span{font-size:18px;}
	/*laststep*/
	.login_title_last h2{float:none;}
	.login_title_last{background-image:none;}
	/*픽토그램*/
	.cont .process li{margin-right:5px;}
	/*추가_171208*/
	.cont .pictogram img{width:95%;}
}

/*Tablet*/
@media only screen and (max-width:800px) {
	#sub .sub_wrap{width:92%;}
	#sub .sub_wrap .leftmenu{display:none;}
	#sub .sub_wrap .sub_contents{width:100%;}
	.iframe{min-width:inherit !important;}
	table .pc_colgroup{display:none;}
	table .m_colgroup{display:table-column-group ;}
	/*table_list*/
	table.list thead{display:table-header-group;}
	table.list tbody{display:table-row-group;}
	table.list tr{display:table-row;}
	table.list th, table.list td{display:none !important;}
	table.list .m_view{display:table-cell !important;}
	/*write*/
	.write thead, .write  tbody, .write tr, .write th, .write td{display:block;}
	table.write .m_none{display:none;}
	table.write th br{display:none;}
	table.write input[type="text"]{width:96%; margin-top:5px; }
	table.write th, table.write td{ line-height:45px;}
	table.write th{ text-align:left; padding-left:20px;}
	table.write .textarea{height:inherit;}
	table.write .file_input_td{height:inherit; line-height:inherit; padding:10px;}
	/*login*/
	.login .login_box{height:fit-content;}
	.login .login_box:after{clear:both; display:block; content:"";}
	.login .login_box .login_input{width:100%;}
	.login .login_box .login_service{width:100%;}
	.add_service a.add_01{background:url(../images/sub/service_icon_01.png) no-repeat 20% center #fff;}
	.add_service a.add_01:hover{background:url(../images/sub/service_icon_01_over.png) no-repeat 20% center #01479d; }
	.add_service a.add_02{background:url(../images/sub/service_icon_02.png) no-repeat 20% center #fff;}
	.add_service a.add_02:hover{background:url(../images/sub/service_icon_02_over.png) no-repeat 20% center #01479d;}
	.add_service a{width:100%; font-size:24px; margin-bottom:10px;}
	.add_service a em{width:inherit; padding:inherit; height:90px; line-height:90px; margin-left:40%;}
	.add_service div{width:100%; background:url(../images/sub/service_icon_03.png) no-repeat 20% center #fff;}
	.add_service div p{font-size:28px;display:inline-block; float:left;}
	.add_service div span{font-size:15px;margin:inherit;display:inline-block; float:left; padding:30px 0 0 10px;}
	/*joinus*/
	.typebox>li{width:100%;}
	.typebox li li>span{font-size:18px;}
	/*inputbox*/
	.inputArea label, .inputArea .title{width:30%; }
	#list_order_title{width:28%;}
	.inputArea input{ width:70%;}
	.inputArea select{ width:70%;}
	.calender input{width:25% !important;}
	.btnArea_input{width:100%; }
	.btnArea_input:after{clear:both; display:block; content:"";}
	.btnArea_input a{width:49%; height:40px; line-height:40px; display:inline-block; box-sizing:border-box;}
	.column a{width:32% !important;}
	.column a.white_btn{float:left !important;}
	.btnArea_input a span{height:40px; line-height:40px; }
	.btnArea_input a.black_btn{float:left;}
	.btnArea_input a.white_btn{float:right;}
	/*graph*/
	.graphArea{display:none;}
	.m_graphArea{display:inherit; width:100%; height:200px;  border:1px solid #01479d;border-radius: 4px; -moz-border-radius:4px; -webkit-border-radius:4px; display:inline-block; background:url(../images/sub/graph.png) no-repeat 20% center #fff; margin-top:20px;  box-sizing:border-box;}
	.m_graphArea p{display:inline-block; margin:55px 0 0 40%; font-size:18px; font-weight:200; color:#000; height:28px; line-height:28px;}
	.m_graphArea p span{ font-weight:500; color:#01479d; margin-right:5px;}
	/* Tab style 01 */
	.tab_wrap{position:relative;}
	.tab_st01_mobile{display:block;width:100%;height:43px;margin-bottom:10px;padding:0 10px;border:1px solid #e6e6e6;box-sizing:border-box;background: url(../images/sub/icon_infor_next.png) 98% 50% no-repeat;}
	.tab_st01_mobile.on{background: url(../images/sub/icon_infor_prev.png) 98% 50% no-repeat;}
	.tab_st01_mobile a{display:block;width:100%;line-height:43px; font-size:15px;}
	.tab_st01{display:none;position:absolute;top:43px;left:0;border-width:0;}
	.tab_st01 li, .tab_st01.fourth li{float:none;width:100%;border:1px solid #e6e6e6;margin-top:-1px;background-color:#fff;}
	.tab_st01 li.tab_left{}
	.tab_st01 li:hover, .tab_st01 li.on{background-color:#be3f4e;border-color:#be3f4e;}
	.tab_st01 li.on a{ color:#fff !important;}
	/* 평가 */
	.quest{width:100%; box-sizing:border-box; margin-bottom:20px; overflow-x:hidden; }
	.quest .quest_l{width:100%; float:none;}
	.quest .quest_r{width:100%; padding-left:0; padding-top:20px; margin-top:20px; border-left:none; border-top:1px solid #e6e6e6;}
	.quest .quest_r .sub_btn_wrap{width:100%;}
	.quest .quest_r .sub_btn_wrap .appraisal{float:left; width:60%; margin-right:5px;}
	/*픽토그램*/
	.cont .pictogram_02{ float:none;display:inline-block; width:100%; margin:20px auto !important; text-align:center;}
	.cont .pictogram_02 img{display:inline-block; text-align:center;}
	.cont .cont_list{display:inline-block; width:100%; margin:0 auto; text-align:center;}
	.cont .cont_list li{margin-left:0;}
	.cont .process li{width:18%;}
	.cont .process li img{width:100%; display:inline-block;}
	.cont .process.fourd li{width:24%;}	
	.location{display:none;}
	/*추가_171208*/
	.cont .pictogram .pc_view{display:none;}
	.cont .pictogram .mb_view{display:block;}
	.cont .pictogram .mb_view img{width:inherit; margin:0 auto;display:table-header-group;}
	.ocrt_01 li{width:48%;}
	/*추가_171211*/
	.mobile_table{display:block;}
	.pc_table{display:none;}
	/*서브네비게이션 삭제*/
	#sub .sub_wrap .navigation{display:none;}
	.picture li img{width:100% !important;}
	.picture_02 li img{width:100% !important;}
}

@media only screen and (max-width:650px) {
	.add_service a.add_01{background:url(../images/sub/service_icon_01.png) no-repeat 10% center #fff;}
	.add_service a.add_01:hover{background:url(../images/sub/service_icon_01_over.png) no-repeat 10% center #01479d; }
	.add_service a.add_02{background:url(../images/sub/service_icon_02.png) no-repeat 10% center #fff;}
	.add_service a.add_02:hover{background:url(../images/sub/service_icon_02_over.png) no-repeat 10% center #01479d;}
	.add_service a{width:100%; font-size:24px; margin-bottom:10px;}
	.add_service a em{width:inherit; padding:inherit; height:90px; line-height:90px; margin-left:30%;}
	.add_service div{width:100%; background:url(../images/sub/service_icon_03.png) no-repeat 10% center #fff;}
	.add_service div p{font-size:28px;display:inline-block; float:left;  margin:20px 0 0 30%;}
	.add_service div span{font-size:15px;margin:inherit;display:inline-block; float:left; padding:35px 0 0 10px;}
	/*사이트맵추가*/
	.sitemap:after{clear:both; display:block; content:"";}
	.sitemap>ul.full{width:96%;}
	.sitemap>ul{width:46%; margin-right:2%;height:inherit; float:left; border-bottom:1px solid #c8c8c8; margin-bottom:30px; }
	.sitemap ul.long{ height:inherit;}
	/*픽토그램*/
	.cont .process li{width:30%;}
	.cont .process.fourd{width:100%; margin:0 auto; display:inline-block; text-align:center;}
	.cont .process.fourd li{width:35%;}
	
	.list_pictogram>li{ width:95%;}
	.list_pictogram ul{display:inline-block; width:70%;}
	.list_pictogram ul li.title{font-size:18px; font-weight:400; color:#2963aa;  margin:0 0 12px 0; display:inline-block;}
	.list_pictogram_02>li{ width:95%;}
	.list_pictogram_02 ul{display:inline-block; width:70%;}
	.list_pictogram_02 ul li.title{font-size:18px; font-weight:400; color:#2963aa;  margin:0 0 12px 0; display:inline-block;}
}

@media only screen and (max-width:530px) {
	.board .all_board p{float:inherit;}
	.board .tsearchArea{float:left; margin-top:10px; width:100%;}
	.board .tsearchArea .inputbox, .board .tsearchArea select{width:100%;}
	.board .tsearchArea select{height:40px;}
	.board .tsearchArea .searchbox{width:99%; height:40px; margin-top:10px;}
	.board .tsearchArea .searchbox input{ width:85% !important; height:40px;}
	.board .tsearchArea .searchbox a{width:40px; height:40px; }
	.board .tsearchArea .searchbox a img{ margin:12px 0 0 12px;}
	/*login*/
	.login .login_box .login_service{padding:30px;}
	.add_service a.add_01{background:url(../images/sub/service_icon_01.png) no-repeat 5% center #fff;}
	.add_service a.add_01:hover{background:url(../images/sub/service_icon_01_over.png) no-repeat 5% center #01479d; }
	.add_service a.add_02{background:url(../images/sub/service_icon_02.png) no-repeat 5% center #fff;}
	.add_service a.add_02:hover{background:url(../images/sub/service_icon_02_over.png) no-repeat 5% center #01479d;}
	.add_service a{width:100%; font-size:20px; margin-bottom:10px;}
	.add_service a em{width:inherit; padding:inherit; height:90px; line-height:90px; margin-left:35%;}
	.add_service div{width:100%; background:url(../images/sub/service_icon_03.png) no-repeat 5% center #fff;}
	.add_service div p{font-size:26px;display:inline-block; float:left;  margin:20px 0 0 25%;}
	.add_service div span{font-size:15px;margin:inherit;display:inline-block; float:left; padding:32px 0 0 10px;}
	/*joinus*/
	.joinus{display:none !important; }
	.typebox>li.type_01{background:url(../images/sub/joinus_type_01.png) no-repeat 12% center #fff;}
	.typebox>li.type_02{background:url(../images/sub/joinus_type_02.png) no-repeat 12% center #fff;}
	.typebox>li.type_03{background:url(../images/sub/joinus_type_03.png) no-repeat 12% center #fff;}
	.typebox>li.type_04{background:url(../images/sub/joinus_type_04.png) no-repeat 12% center #fff;}
	.typebox li li{ display:inline-block; margin:30px 0 0 42%;}
	.typebox li li>span{font-size:15px;}
	/*inputbox*/
	.btnArea_input a{width:100%; margin:0 0 10px 0 !important; }	
	.column a{width:100% !important;}
	/*graph*/
	.m_graphArea{background:url(../images/sub/graph.png) no-repeat 10% center #fff; }
	.m_graphArea p{ margin:55px 0 0 35%; font-size:17px;}
	.cont .iconArea a{width:100%; padding:30px 30px !important; margin-bottom:10px;}
	.cont .iconArea a span{width:60%;}
	/*용어사전*/
	.dictionary .mobile_select{display:block; }
	.dictionary .mobile_select .inputbox {width:84% !important; float:left;}
	.dictionary .mobile_select #list_order{width:100% !important; float:left; font-size:16px;}
	.dictionary .mobile_select .black_btn{ float:right; width:10%;height:38px !important; line-height:38px !important; }
	.dictionary .mobile_select .black_btn span{ height:38px !important; line-height:38px !important; }
	.dictionary .dic_table{display:none;}
	.dictionary .mobile_select .tsearchArea{margin:0 0 10px 0 !important;}
	
	.list_pictogram ul{display:inline-block; width:60%;}
	.list_pictogram>li{ width:inherit;}
	.list_pictogram_02 ul{display:inline-block; width:60%;}
	.list_pictogram_02>li{ width:inherit;}
}
	

/*mobile*/
@media only screen and (max-width:490px) {
	#sub .sub_wrap{width:90%;}
	.login .login_box .login_input .input_box input{width:80%;}
	.add_service div.add_03 span{display:none;}
	.add_service div.add_03 p{ margin-left:35%;}
	.add_service a{font-size:18px;}
	.inputArea label, .inputArea .title{width:100%;}
	#list_order_title{width:100%; margin-bottom:5px;}
	.inputArea input{ width:100%;}
	.inputArea select{ width:100%;}
	.calender input{width:80% !important; margin-bottom:5px !important;}
	/*graph*/
	.m_graphArea{background-image:none; }
	.m_graphArea p{ margin:45px 10% 0 10%; font-size:18px; }
	/*용어사전*/
	.dictionary .mobile_select{display:block;}
	.dictionary .mobile_select .inputbox {width:80% !important; float:left;}
	.dictionary .mobile_select #list_order{width:100% !important; float:left; font-size:16px;}
	.dictionary .mobile_select .black_btn{ float:right; width:12%;height:38px !important; line-height:38px !important; text-align:center; }
	.dictionary .mobile_select .black_btn span{ height:38px !important; line-height:38px !important; text-align:center;}
	.dictionary .dic_table{display:none;}
	/*사이트맵추가*/
	.sitemap ul.full ul.depth_02{width:50%;}
	/*픽토그램*/
	.cont .pictogram_02 img{width:90%;}
	table.write .input_line{padding-bottom:5px;}
	table.write .input_line input[type="text"]{width:85% !important;}
	/*추가_171208*/
	.cont .pictogram .mb_view img{width:95%;}
	.ocrt_01 li{width:95%;}
	/*추가_171211*/
	.paging a.no_bg{width:27px;}
	.paging a{margin: 0 5px !important;}
	.paging a.no_bg img{width:100%;}
}

@media only screen and (max-width:400px) {
	.typebox>li{background-image:none !important;}
	.typebox li li{ margin:30px 0 0 10%; width:90%;}
	/*사이트맵추가*/
	.sitemap>ul.full{width:100%;}
	.sitemap>ul{width:100%;  }
	.sitemap ul.full ul.depth_02{width:45%;}
	
	.list_pictogram{ text-align:center;}
	.list_pictogram ul{width:inherit;}
	.list_pictogram>li>img{float:none; margin:20px 30px 12px 30px;}
	.list_pictogram_02{ text-align:center;}
	.list_pictogram_02 ul{width:inherit;}
	.list_pictogram_02>li>img{float:none; margin:20px 30px 12px 30px;}
}

@media only screen and (max-width:390px) {
	.board .tsearchArea .searchbox input{ width:82% !important; height:40px;}
	.board .tsearchArea .searchbox a{width:40px; height:40px; }
	.board .tsearchArea .searchbox a img{ margin:12px 0 0 12px;}
	/*용어사전*/
	.dictionary .mobile_select .inputbox {width:78% !important;}
	.dictionary .mobile_select .black_btn{  width:14%; }
	/*픽토그램*/
	.cont .process li{width:40%;}
}

@media only screen and (max-width:350px) {
	.login .login_box .login_service li a{margin:0 0 0 0;}
	.login .login_box .login_service li{margin-bottom:20px;}
	.add_service a{font-size:16px;}
    .add_service a em { margin-left:40%;}
	.add_service div.add_03 p{ margin-left:40%;}
	.typebox li li p{height:inherit;}
	.typebox>li.type_02{height:253px;}
	.typebox li.type_02 li p{width:130px;}
	.typebox li li>span{width:90%;}
	.typebox>li{height:253px;}
	table.write th, table.write td{height:inherit;}
	#sub .sub_wrap .navigation{float:none !important; display:block !important;}
	#sub .sub_wrap .navigation:after{clear:both; display:block; content:"";}
	.board .tsearchArea .searchbox input{width:75% !important;}
	/*추가_171211*/
	.paging a.no_bg{width:27px;}
	.paging a{margin: 0 4px !important;}
	.paging a.no_bg img{width:100%;}
}