2023/10/23 퀵메뉴, 용어해설 팝업

This commit is contained in:
subsub 2023-10-23 09:38:18 +09:00
parent 55873b445c
commit 902c3fda89
15 changed files with 604 additions and 3 deletions

View File

@ -106,6 +106,26 @@ footer address p:first-child{margin-bottom: 8px;}
.error_wrap .error_btn {text-align:center;}
.error_page .error_btn button {background-color:#1b6fcd; color: #fff; padding: 8px 25px; font-size: 16px;}
/* quick menu */
.quick_menu_wrap{position:fixed;top:50%;right:8%;transform:translateY(-50%);z-index:20;}
.quick_menu_wrap .quick_title{width:85px;height:35px;border-radius:5px 5px 0 0;background-color:#ea5404;color:#fff;font-size:18px;font-weight:500;text-align:center;line-height:33px;margin:0 auto;}
.quick_menu_wrap .quick_ul{width:110px;border-radius:5px;box-shadow:0 0 5px rgba(0,0,0,0.2);padding:10px 10px 20px 10px;box-sizing:border-box;}
.quick_menu_wrap .quick_li{font-size:16px;font-weight:400;text-align:center;letter-spacing:-0.45px;margin:0 0 10px 0;transition:all 0.15s ease-in-out;}
.quick_menu_wrap .quick_li:last-child{margin:0 0 0 0;}
.quick_menu_wrap .quick_li i{display:block;width:100%;height:50px;text-align:center;background-repeat:no-repeat;background-position:center;margin:0 0 5px 0;transition:all 0.15s ease-in-out;}
.quick_menu_wrap .quick_li .icon_quickmenu_glossary{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_glossary.png);background-position:calc(50% + 8px) center;}
.quick_menu_wrap .quick_li .icon_quickmenu_adj_case{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_adj_case.png);background-position:calc(50% + 10px) center;}
.quick_menu_wrap .quick_li .icon_quickmenu_apl_form{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_apl_form.png);}
.quick_menu_wrap .quick_li .icon_quickmenu_progress_case{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_progress_case.png);background-position:calc(50% + 8px) center;}
.quick_menu_wrap .quick_li .icon_quickmenu_fee{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_fee.png);background-position:calc(50% + 2px) center;}
.quick_menu_wrap .quick_li:hover{color:#ea5404;transition:all 0.15s ease-in-out;font-weight:500;}
.quick_menu_wrap .quick_li:hover .icon_quickmenu_glossary{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_glossary_hover.png);}
.quick_menu_wrap .quick_li:hover .icon_quickmenu_adj_case{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_adj_case_hover.png);}
.quick_menu_wrap .quick_li:hover .icon_quickmenu_apl_form{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_apl_form_hover.png);}
.quick_menu_wrap .quick_li:hover .icon_quickmenu_progress_case{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_progress_case_hover.png);}
.quick_menu_wrap .quick_li:hover .icon_quickmenu_fee{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_fee_hover.png);}
@media all and (max-width: 1280px){
/* header */
.header_inner .nav_wrap{padding: 0 15px;}

View File

@ -9,15 +9,30 @@
.btn_down_pdf{display: inline-block; width: 20px; height: 20px; background-image: url(/kccadrPb/usr/image/btn_down_pdf.png); background-repeat: no-repeat; background-position: center;}
.popup_cont{padding: 40px 30px; box-sizing: border-box; border: 1px solid #cccccc; border-top: 0; background-color: #fff; border-radius: 0 0 5px 5px;}
.popup_cont .page{margin-top: 30px;}
.popup_search{width: 100%; margin-bottom: 15px;}
.popup_search select{width: 150px; height: 35px; border: 1px solid #d5d5d5; border-radius: 5px; padding-left: 14px; font-size: 16px; color: #222;
background-image: url(/kccadrPb/usr/image/icon_cont_select.png); background-repeat: no-repeat; background-position: calc(100% - 15px) center; margin-right: 3px; color: #555;}
.popup_search select{width: 150px; height: 35px; border: 1px solid #d5d5d5; border-radius: 5px; padding-left: 14px; font-size: 16px; color: #222;background-image: url(/kccadrPb/usr/image/icon_cont_select.png); background-repeat: no-repeat; background-position: calc(100% - 15px) center; margin-right: 3px; color: #555;}
.popup_search input[type="text"]{height: 35px; border: 1px solid #d5d5d5; border-radius: 5px; font-size: 15px; padding-left: 10px; box-sizing: border-box;}
.popup_search button{min-width: 60px; height: 35px; margin-left: 7px; font-size: 17px; vertical-align: middle;}
.popup_cont .popup_search.type02{display:flex;border:1px solid #dbdcdd;background-color:#f1f2f4;border-radius:5px;text-align:center;align-items:center;justify-content:center;padding:5px 10px;box-sizing:border-box;}
.popup_cont .popup_search.type02 .search_title{font-size:16px;font-weight:500;margin:0 10px 0 0;}
.popup_cont .popup_search.type02 input{height:30px;}
.popup_cont .popup_search.type02 input::placeholder{font-size:14px;}
.popup_cont .popup_search.type02 button{min-width:60px;height:30px;font-size:16px;font-weight:500;color:#fff;background-color:#ea5404;border-radius:5px;}
.popup_cont .popup_tab_wrap{border:1px solid #d5d5d5;border-radius:5px;margin:0 0 15px 0;}
.popup_cont .popup_tab_wrap .tab_ul{display:flex;align-items:center;}
.popup_cont .popup_tab_wrap .tab_ul .tab_li{position:relative;height:45px;}
.popup_cont .popup_tab_wrap .tab_ul .tab_li::after{position:absolute;content:"";width:1px;height:70%;background-color:#d5d5d5;top:50%;transform:translateY(-50%);}
.popup_cont .popup_tab_wrap .tab_ul .tab_li .tab{width:100%;height:100%;font-size:15px;}
.popup_cont .popup_tab_wrap .tab_ul .tab_li.on .tab{background-color:#ea5404;color:#fff;}
.popup_cont .popup_tab_wrap .tab_ul .tab_li.on .tab::after{position:absolute;content:"";width:100%;height: 100%;border:1px solid #ea5404;left:-1px;top:-1px;z-index:1;border-radius: 5px;}
.result_text{font-size: 15px;font-weight:400;}
.result_text span{color:#0352a9;}
.popup_tbType01{width: 100%; text-align: left; border-top: 1px solid #000; border-bottom: 1px solid #ccc; margin-bottom: 20px;}
.popup_tbType01 tr{border-bottom: 1px solid #e5e5e5;}
.popup_tbType01 th,.popup_tbType01 td{height: 40px; vertical-align: middle; font-size: 16px; text-align: left; padding: 12px 0; box-sizing: border-box;}
@ -95,6 +110,23 @@
.loading_info_popup .info_wrap p{display: block; text-align: left; margin-bottom: 10px; font-size: 17px;}
.loading_info_popup .info_wrap p:last-child{margin-bottom: 0;}
/* 저작권 용어사전 */
.glossary_popup{width:740px;}
.glossary_popup .tab_li{width: calc((100% - 60px)/10);}
.glossary_popup .popup_tab_content{display:flex;max-height:400px;justify-content:space-between;align-items:stretch;}
.glossary_popup .glossary_left_area{width:150px;}
.glossary_popup .glossary_left_area ul{max-height:372px;height:100%;border:2px solid #dbdcdd;margin:8px 0 0 0;padding:0 10px;border-radius:5px;box-sizing:border-box;overflow-y:auto;}
.glossary_popup .glossary_left_area ul button{position:relative;width:100%;height:40px;border-bottom:1px dashed #e5e5e5;text-align:left;font-size:15px;padding:0 0 0 10px;}
.glossary_popup .glossary_left_area ul li:last-child button{border-bottom: 0;}
.glossary_popup .glossary_left_area ul .on button{color:#0352a9;font-weight:600;}
.glossary_popup .glossary_left_area ul button::after{position:absolute;content:"";width:5px;height:5px;border-radius:100%;background-color:#0352a9;left:0;top:18px;}
.glossary_popup .glossary_right_area{width:calc(100% - 170px);height:100%;max-height:400px;margin:25px 0 0 0;}
.glossary_popup .glossary_right_area dl{height:365px;border-top:2px solid #000;border-bottom:1px solid #e5e5e5;}
.glossary_popup .glossary_right_area dl dt{display:flex;height:45px;padding:0 20px;background-color:#f3f3f3;font-size:18px;font-weight:500;align-items:center;line-height:1.4;}
.glossary_popup .glossary_right_area dl dt p{position:relative;}
.glossary_popup .glossary_right_area dl dt p::after{position:absolute;content:"";width: 100%;height:8px;background-color:#ea5404;opacity:0.15;left:0;bottom:0;}
.glossary_popup .glossary_right_area dl dd{max-height:calc(100% - 75px);padding:15px 20px;line-height: 1.5;font-size:16px;font-weight:300;overflow-y:auto;}
@media all and (max-width: 640px){
.popup_wrap{width: 90%; max-width: 90% !important; max-height: 90vh; left: 50% !important; top: 50% !important; transform: translate(-50%,-50%); overflow-y: scroll;}
}

View File

@ -41,6 +41,7 @@
</a>
<div class="menu">
<ul class="dep01">
<li><a href="/kccadrPb/usr/sub_glossary.html">퀵메뉴, 용어해설 팝업</a></li>
<li><a href="/kccadrPb/usr/history_read_ask.html">조정사건 기록 열람 신청</a></li>
<li><a href="/kccadrPb/usr/history_read_ask_list.html">조정사건 기록 열람 신청 목록</a></li>
<li><a href="/kccadrPb/usr/history_read_detail_post.html">조정사건 기록 열람 신청 상세(우편발송)</a></li>

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -83,6 +83,10 @@ $(document).ready(function () {
tooltip();
accessibilityFocus();
popupboardCaptionToggle();
$('.popup_tab_wrap .tab_ul .tab_li,.glossary_left_area ul li').on('click',function(){
$(this).addClass('on').siblings().removeClass('on');
});
});
function popupboardCaptionToggle(){

View File

@ -0,0 +1,544 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>저작권 전자조정시스템 > 전자조정 신청 > 조정신청</title>
<!-- css -->
<link rel="stylesheet" href="/kccadrPb/usr/css/reset.css">
<link rel="stylesheet" href="/kccadrPb/usr/css/font.css">
<link rel="stylesheet" href="/kccadrPb/usr/css/common.css">
<link rel="stylesheet" href="/kccadrPb/usr/css/content.css">
<link rel="stylesheet" href="/kccadrPb/usr/css/content_media.css">
<link rel="stylesheet" href="/kccadrPb/usr/css/popup.css">
<!-- script -->
<script src="/kccadrPb/usr/script/jquery-3.5.0.js"></script>
<script src="/kccadrPb/usr/script/common.js"></script>
<script src="/kccadrPb/usr/script/content.js"></script>
<script src="/kccadrPb/usr/script/popup.js"></script>
</head>
<body>
<div class="mask"></div>
<!-- 저작권 용어사전 -->
<div class="tooltip-wrap">
<div class="popup_wrap glossary_popup" tabindex="0" data-tooltip-con="glossary_popup" data-focus="glossary_popup" data-focus-prev="glossary_popup_close">
<div class="popup_tit">
<p>저작권 용어해설</p> <button class="btn_popup_close tooltip-close" data-focus="glossary_popup_close" title="팝업 닫기"><i></i></button>
</div>
<div class="popup_cont">
<div class="popup_search type02">
<p class="search_title">용어검색</p>
<input type="text" placeholder="검색어를 입력해주세요" title="용어 검색어 입력">
<button type="button" class="btnTYpe01">조회</button>
</div>
<div class="popup_tab_wrap">
<ul class="tab_ul">
<li class="tab_li on"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab"></button></li>
<li class="tab_li"><button type="button" class="tab">기타</button></li>
</ul>
</div>
<div class="popup_tab_content">
<div class="glossary_left_area">
<p class="result_text">전체 : <span class="t_bold">6,178</span></p>
<ul>
<li class="on"><button type="button">조정절차</button></li>
<li><button type="button">조정절차</button></li>
<li><button type="button">조정절차</button></li>
<li><button type="button">조정절차</button></li>
<li><button type="button">조정절차</button></li>
<li><button type="button">조정절차</button></li>
<li><button type="button">조정절차</button></li>
<li><button type="button">조정절차</button></li>
</ul>
</div>
<div class="glossary_right_area">
<dl>
<dt>
<p>조정제도</p>
</dt>
<dd><p>저작권 분쟁 당사자의 조정 신청이 있는 경우 전문가로 구성된 조정부가 분쟁을 신속하고 공정하게 해결해 주는 제도로서, 판결을 대신하여 분쟁을 종국적으로 해결하는 대체적 분쟁해결제도(ADR, Alternative Dispute Resolution) 중 하나입니다. 한국저작권위원회는 1988년부터 조정업무를 수행하여 왔으며, 저작물 이용 등으로 발생하는 다양한 저작권 침해 관련 분쟁을 해결하고 있습니다. 2020.08.05.부터 시행된 개정 저작권법에 의하여 한국저작권위원회 조정부는 ①“조정부가 제시한 조정안을 어느 한쪽 당사자가 합리적인 이유 없이 거부한 경우” 또는 ② “분쟁조정 예정가액이 1천만원 미만인 경우”에 해당할 때, 직권으로 조정을 갈음하는 결정(직권조정결정)을 할 수 있습니다.</p></dd>
</dl>
</div>
</div>
<div class="btn_wrap">
<button type="button" class="btnType03 tooltip-close">닫기</button>
</div>
</div>
</div>
</div>
<!-- //저작권 용어사전 -->
<div class="skip_menu">
<a href="#sub" class="contGo" title="본문 바로가기">본문 바로가기</a>
</div>
<div class="quick_menu_wrap">
<div class="quick_title">
<p>퀵메뉴</p>
</div>
<ul class="quick_ul">
<li class="quick_li">
<a href="#none" data-tooltip="glossary_popup"><i class="icon_quickmenu_glossary"></i>용어해설</a>
</li>
<li class="quick_li">
<a href="#none"><i class="icon_quickmenu_adj_case"></i>조정사례</a>
</li>
<li class="quick_li">
<a href="#none"><i class="icon_quickmenu_apl_form"></i>신청서 작성</a>
</li>
<li class="quick_li">
<a href="#none"><i class="icon_quickmenu_progress_case"></i>사건진행</a>
</li>
<li class="quick_li">
<a href="#none"><i class="icon_quickmenu_fee"></i>수수료 조회</a>
</li>
</ul>
</div>
<!-- header -->
<header>
<div class="gnb_wrap">
<div class="inner">
<div class="site">
<img src="/kccadrPb/usr/image/common/gnb_logo.png" alt="한국저작권위원회">
<a href="https://www.copyright.or.kr/main.do">바로가기</a>
</div>
<div class="area_right">
<a href="#">로그인</a>
<a href="#">회원가입</a>
<div class="btn_util">
<button class="btn_minus" title="글자 축소"></button>
<button class="btn_plus" title="글자 확대"></button>
</div>
</div>
</div>
</div>
<div class="header">
<div class="header_inner">
<h1 class="logo"><a href="/kccadrPb/usr/index.html"><img src="/kccadrPb/usr/image/common/top_logo.png" alt="저작권 전자조정시스템 Copyright Electronic Coordination System"></a></h1>
<div class="nav_wrap">
<nav id="menu">
<ul class="depth01">
<li class="depth01_li"><a href="#" class="menu_link">전자조정 안내</a>
<ul class="depth02">
<li><a href="#">조정의 개념 및 효력</a></li>
<li><a href="#">조정 대상</a></li>
<li><a href="#">조정 절차</a></li>
<li><a href="#">조정 비용</a></li>
<li><a href="#">신청안내</a></li>
</ul>
</li>
<li class="depth01_li"><a href="#" class="menu_link">전자조정 신청</a>
<ul class="depth02">
<li><a href="#">조정 신청</a></li>
<li><a href="#">간편 조정 신청</a></li>
<li><a href="#">조정신청 대리인 신청</a></li>
<li><a href="#">조정신청 취하</a></li>
<li><a href="#">조정 경정 신청</a></li>
</ul>
</li>
<li class="depth01_li"><a href="#" class="menu_link">사례/통계</a>
<ul class="depth02">
<li><a href="#">조정사건조회</a></li>
<li><a href="#">조정사례조회</a></li>
<li><a href="#">조정통계</a></li>
</ul>
</li>
<li class="depth01_li"><a href="#" class="menu_link">정보마당</a>
<ul class="depth02">
<li><a href="#">공지사항</a></li>
<li><a href="#">조정제도 안내 게시판</a></li>
<li><a href="#">관련법조항 게시판</a></li>
<li><a href="#">묻고답하기</a></li>
</ul>
</li>
<li class="depth01_li"><a href="#" class="menu_link">마이페이지</a>
<ul class="depth02">
<li><a href="#">개인정보관리</a></li>
<li><a href="#">분쟁조정현황</a></li>
<li><a href="#">대리인정보관리</a></li>
<li><a href="#">분쟁조정문의</a></li>
</ul>
</li>
</ul>
</nav>
</div>
<div class="area_right">
<button class="btn_search" title="검색영역 열기"></button>
<button class="btn_menu" title="전체메뉴 열기"></button>
</div>
</div>
</div>
</header>
<!-- //header -->
<!-- 전체메뉴 -->
<div class="full_menu">
<div class="inner">
<h1 class="logo"><img src="/kccadrPb/usr/image/common/top_logo.png" alt="저작권 전자조정시스템 Copyright Electronic Coordination System"></h1>
<ul class="depth01">
<li class="depth01_li"><a href="#" class="menu_link">전자조정 안내</a>
<ul class="depth02">
<li><a href="#">조정의 개념 및 효력</a></li>
<li><a href="#">조정 대상</a></li>
<li><a href="#">조정 절차</a></li>
<li><a href="#">조정 비용</a></li>
<li><a href="#">신청안내</a></li>
</ul>
</li>
<li class="depth01_li"><a href="#" class="menu_link">전자조정 신청</a>
<ul class="depth02">
<li><a href="#">조정 신청</a></li>
<li><a href="#">간편 조정 신청</a></li>
<li><a href="#">조정신청 대리인 신청</a></li>
<li><a href="#">조정신청 취하</a></li>
<li><a href="#">조정 경정 신청</a></li>
</ul>
</li>
<li class="depth01_li"><a href="#" class="menu_link">사례/통계</a>
<ul class="depth02">
<li><a href="#">조정사건조회</a></li>
<li><a href="#">조정사례조회</a></li>
<li><a href="#">조정통계</a></li>
</ul>
</li>
<li class="depth01_li"><a href="#" class="menu_link">정보마당</a>
<ul class="depth02">
<li><a href="#">공지사항</a></li>
<li><a href="#">조정제도 안내 게시판</a></li>
<li><a href="#">관련법조항 게시판</a></li>
<li><a href="#">묻고답하기</a></li>
</ul>
</li>
<li class="depth01_li"><a href="#" class="menu_link">마이페이지</a>
<ul class="depth02">
<li><a href="#">개인정보관리</a></li>
<li><a href="#">분쟁조정현황</a></li>
<li><a href="#">대리인정보관리</a></li>
<li><a href="#">분쟁조정문의</a></li>
</ul>
</li>
</ul>
<button class="btn_close" title="전체메뉴 닫기"></button>
</div>
</div>
<!-- //전체메뉴 -->
<!-- 모바일메뉴 -->
<div id="m_menu">
<ul class="depth01">
<li class="depth01_li"><button class="menu_tit">전자조정 안내</button>
<ul class="depth02">
<li><a href="#">조정의 개념 및 효력</a></li>
<li><a href="#">조정 대상</a></li>
<li><a href="#">조정 절차</a></li>
<li><a href="#">조정 비용</a></li>
<li><a href="#">신청안내</a></li>
</ul>
</li>
<li class="depth01_li"><button class="menu_tit">전자조정 신청</button>
<ul class="depth02">
<li><a href="#">조정 신청</a></li>
<li><a href="#">간편 조정 신청</a></li>
<li><a href="#">조정신청 대리인 신청</a></li>
<li><a href="#">조정신청 취하</a></li>
<li><a href="#">조정 경정 신청</a></li>
</ul>
</li>
<li class="depth01_li"><button class="menu_tit">사례/통계</button>
<ul class="depth02">
<li><a href="#">조정사건조회</a></li>
<li><a href="#">조정사례조회</a></li>
<li><a href="#">조정통계</a></li>
</ul>
</li>
<li class="depth01_li"><button class="menu_tit">정보마당</button>
<ul class="depth02">
<li><a href="#">공지사항</a></li>
<li><a href="#">조정제도 안내 게시판</a></li>
<li><a href="#">관련법조항 게시판</a></li>
<li><a href="#">묻고답하기</a></li>
</ul>
</li>
<li class="depth01_li"><button class="menu_tit">마이페이지</button>
<ul class="depth02">
<li><a href="#">개인정보관리</a></li>
<li><a href="#">분쟁조정현황</a></li>
<li><a href="#">대리인정보관리</a></li>
<li><a href="#">분쟁조정문의</a></li>
</ul>
</li>
</ul>
<button class="btn_close" title="모바일메뉴 닫기"></button>
</div>
<!-- //모바일메뉴 -->
<!-- snb -->
<div class="cont_nav">
<div class="inner">
<button class="home" title="메인으로 이동" onclick="location.href='./index.html'"></button>
<div class="snb_wrap">
<button class="snb_tit" title="하위메뉴 열기">전자조정 신청</button>
<ul class="snb_depth">
<li><a href="#">전자조정 안내</a></li>
<li><a href="#">전자조정 신청</a></li>
<li><a href="#">사례/통계</a></li>
<li><a href="#">정보마당</a></li>
<li><a href="#">마이페이지</a></li>
</ul>
</div>
<div class="snb_wrap">
<button class="snb_tit" title="하위메뉴 열기">조정신청 목록</button>
<ul class="snb_depth">
<li><a href="#">전자조정 안내</a></li>
<li><a href="#">전자조정 신청</a></li>
<li><a href="#">사례/통계</a></li>
<li><a href="#">정보마당</a></li>
<li><a href="#">마이페이지</a></li>
</ul>
</div>
</div>
</div>
<!-- //snb -->
<!-- cont -->
<div class="cont_wrap sub02_1" id="sub">
<div class="inner">
<div class="cont_tit">
<h2>조정신청 목록</h2>
</div>
<!-- list_top -->
<div class="list_top">
<!-- <p>총 건수 : <span>204</span>건</p> -->
<div class="tab_wrap">
<button type="button" class="tab on">전체</button>
<button type="button" class="tab">신청</button>
<button type="button" class="tab">진행</button>
<button type="button" class="tab">접수</button>
</div>
<div class="list_util">
<label for="subSearch">검색조건 선택</label>
<select name="" id="subSearch" class="subSearch">
<option value="subSearch01" selected>조정번호</option>
<option value="subSearch02">접수기간</option>
<option value="subSearch03">신청인명</option>
<option value="subSearch04">피신청인명</option>
<option value="subSearch05">신청내용</option>
<option value="subSearch06">조정상태</option>
</select>
<div class="select_wrap">
<select name="" id="">
<option value="">제출완료</option>
<option value="">작성중</option>
<option value="">보완요청</option>
</select>
</div>
<div class="sel_date">
<input type="text" class="startDate inp" title="검색시작일" id="startDate01" name="startDate01" value="" data-datecontrol="true">
<div class="calendar_in" id="calendarName_startDate" style="z-index: 9;">
<button type="button" value="달력 팝업 열기" onclick="return calendarOpen('startDate01-lry','',this)" class="btn_cal"></button>
<div id="startDate01-lry" class="calendarPop" style="display: none;">
<iframe id="startDate01-ifrm" name="startDate01-ifrm" class="calendar-frame" src="/kccadrPb/usr/mini_calendar.html" title="달력 팝업" frameborder="0" scrolling="no"></iframe>
</div>
</div> ~ <input type="text" class="endDate inp" title="검색종료일" id="endDate" name="endDate" value="" data-datecontrol="true">
<div class="calendar_in" id="calendarName_endDate" style="z-index: 9;">
<button type="button" value="달력 팝업 열기" onclick="return calendarOpen('endDate-lry','',this)" class="btn_cal"></button>
<div id="endDate-lry" class="calendarPop" style="display: none;">
<iframe id="endDate-ifrm" name="endDate-ifrm" class="calendar-frame" src="/kccadrPb/usr/mini_calendar.html" title=" 달력 팝업" frameborder="0" scrolling="no"></iframe>
</div>
</div>
</div>
<div class="input_wrap">
<label for="subSearchTxt">검색어 입력</label>
<input type="text" class="search_input" id="subSearchTxt" placeholder="검색어를 입력하세요">
</div>
<button class="btn_search">검색</button>
</div>
</div>
<!-- //list_top -->
<!-- list -->
<div class="tb_list01">
<table>
<caption>조정신청 목록 : 번호, 접수일자, 신청인, 피신청인, 대리인, 신청내용, 조정상태등의 정보제공</caption>
<colgroup>
<col style="width: 80px;">
<col style="width: 15%;">
<col style="width: 12%;">
<col style="width: 12%;">
<col style="width: 12%;">
<col style="width: auto;">
<col style="width: 15%;">
</colgroup>
<thead>
<tr>
<th scope="col">번호</th>
<th scope="col">접수일자</th>
<th scope="col">신청인</th>
<th scope="col">피신청인</th>
<th scope="col">대리인</th>
<th scope="col">신청내용</th>
<th scope="col">조정상태</th>
</tr>
</thead>
<tbody>
<tr>
<td class="td_num">5</td>
<td class="td_date">
<span class="read_only m_th_text">접수일자</span>
<p>2018-03-03</p>
</td>
<td class="td_subscriber">
<span class="m_th_text">신청인</span>
<p>홍길동</p>
</td>
<td class="td_respondent">
<span class="m_th_text">피신청인</span>
<p>고길동 외 2명</p>
</td>
<td class="td_deputy">
<span class="m_th_text">대리인</span>
<p>장두식</p>
</td>
<td class="td_tit">
<span class="read_only m_th_text">신청내용</span>
<a href="/kccadrPb/usr/sub02_1_list_detail.html">음악저작물 이용에 따른 분쟁</a>
</td>
<td class="td_status">
<span class="read_only m_th_text">조정상태</span>
<p class="status_write">작성중</p>
</td>
</tr>
<tr>
<td class="td_num">4</td>
<td class="td_date">
<span class="read_only m_th_text">접수일자</span>
<p>2018-03-03</p>
</td>
<td class="td_subscriber">
<span class="m_th_text">신청인</span>
<p>홍길동</p>
</td>
<td class="td_respondent">
<span class="m_th_text">피신청인</span>
<p>고길동 외 2명</p>
</td>
<td class="td_deputy">
<span class="m_th_text">대리인</span>
<p>장두식</p>
</td>
<td class="td_tit">
<span class="read_only m_th_text">신청내용</span>
<a href="/kccadrPb/usr/sub02_1_list_detail.html">음악저작물 이용에 따른 분쟁</a>
</td>
<td class="td_status">
<p class="status_smc">제출완료</p>
</td>
</tr>
<tr>
<td class="td_num">3</td>
<td class="td_date">
<span class="read_only m_th_text">접수일자</span>
<p>2018-03-03</p>
</td>
<td class="td_subscriber">
<span class="m_th_text">신청인</span>
<p>홍길동</p>
</td>
<td class="td_respondent">
<span class="m_th_text">피신청인</span>
<p>고길동 외 2명</p>
</td>
<td class="td_deputy">
<span class="m_th_text">대리인</span>
<p>장두식</p>
</td>
<td class="td_tit">
<span class="read_only m_th_text">신청내용</span>
<a href="/kccadrPb/usr/sub02_1_list_detail.html">음악저작물 이용에 따른 분쟁</a>
</td>
<td class="td_status">
<a href="#none" data-tooltip="scrq_popup" class="status_scrq" tabindex="0">보완요청</a>
</td>
</tr>
</tbody>
</table>
</div>
<!-- //list -->
<!-- 하단 버튼 -->
<div class="btn_wrap btn_layout01">
<button class="btnType09" onclick="confirm('작성 중인 조정신청서를 삭제하고 다시 작성 하시겠습니까?')">등록</button>
</div>
<!-- //하단 버튼 -->
<!-- page -->
<div class="page">
<button class="btn_page_first" title="첫 페이지 이동"><i></i></button>
<button class="btn_page_prev" title="이전 페이지 이동"><i></i></button>
<button class="on" title="1 페이지 이동">1</button>
<button title="2 페이지 이동">2</button>
<button title="3 페이지 이동">3</button>
<button title="4 페이지 이동">4</button>
<button title="5 페이지 이동">5</button>
<button title="6 페이지 이동">6</button>
<button title="7 페이지 이동">7</button>
<button title="8 페이지 이동">8</button>
<button title="9 페이지 이동">9</button>
<button title="10 페이지 이동">10</button>
<button class="btn_page_next" title="다음 페이지 이동"><i></i></button>
<button class="btn_page_last" title="마지막 페이지 이동"><i></i></button>
</div>
<!-- //page -->
</div>
</div>
<!-- //cont -->
<!-- footer -->
<footer>
<div class="inner">
<div class="area_top">
<ul class="site">
<li><a href="/">개인정보처리방침</a></li>
<li><a href="/">이메일무단수집거부</a></li>
<li><a href="/">고객서비스헌장</a></li>
<li><a href="/">저작권정책</a></li>
</ul>
<div class="site_go">
<label for="site_select">관련사이트 선택</label>
<select name="" id="site_select">
<option value="">관련사이트 바로가기</option>
</select>
<button class="btn_go" title="사이트 이동">GO</button>
</div>
</div>
<h1 class="logo"><a href="/kccadrPb/usr/index.html"><img src="/kccadrPb/usr/image/common/footer_logo.png" alt="저작권 전자조정시스템 Copyright Electronic Coordination System"></a></h1>
<address>
<p>진주 [52852] 경상남도 진주시 충의로 19, 1/2/5층 ☎ 대표번호 055.792.0000</p>
<p>서울 [04323] 서울특별시 용산구 후암로 107, 5/16층 ☎ 대표번호 02.2669.0010</p>
</address>
</div>
</footer>
<!-- //footer -->
</body>
</html>