This commit is contained in:
myname 2024-10-28 17:39:23 +09:00
commit 8473e49937
11 changed files with 265 additions and 10 deletions

View File

@ -3,7 +3,8 @@
<script type="text/javascript"> <script type="text/javascript">
function moveUrl(){ function moveUrl(){
location.href = $("#slct_site option:selected").val(); var href = $("#slct_site option:selected").val();
window.open(href)
} }
</script> </script>
@ -25,7 +26,7 @@
<div class="site_wrap"> <div class="site_wrap">
<select id="slct_site" class="slct_site" title="관련사이트 선택"> <select id="slct_site" class="slct_site" title="관련사이트 선택">
<option value="">관련사이트 바로가기</option> <option value="">관련사이트 바로가기</option>
<option value="http://www.kofair.or.kr/goMain.do">공정거래조정원</option> <option value="http://www.kofair.or.kr">공정거래조정원</option>
<option value="http://ftc.go.kr/">공정거래위원회</option> <option value="http://ftc.go.kr/">공정거래위원회</option>
<option value="https://www.data.go.kr/">국가지식정보통합검색시스템</option> <option value="https://www.data.go.kr/">국가지식정보통합검색시스템</option>
<option value="http://groupopni.ftc.go.kr/">기업집단정보포탈</option> <option value="http://groupopni.ftc.go.kr/">기업집단정보포탈</option>

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 KiB

View File

@ -0,0 +1,169 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>한국공정거래조정원 온라인분쟁조정시스템 > 분쟁조정 안내 > 오시는 길</title>
<!-- css -->
<link rel="stylesheet" href="/kofair_case_seed/css/reset.css">
<link rel="stylesheet" href="/kofair_case_seed/css/font.css">
<link rel="stylesheet" href="/kofair_case_seed/usr/style/common.css">
<link rel="stylesheet" href="/kofair_case_seed/usr/style/layout.css">
<link rel="stylesheet" href="/kofair_case_seed/usr/style/style.css">
<link rel="stylesheet" href="/kofair_case_seed/usr/style/info.css">
<!-- js -->
<script src="/kofair_case_seed/script/lib/jquery-3.5.0.js"></script>
<script src="/kofair_case_seed/usr/scripts/common.js"></script>
<script src="/kofair_case_seed/usr/scripts/layout.js"></script>
<script src="/kofair_case_seed/usr/scripts/info.js"></script>
</head>
<body>
<div class="mask"></div>
<div class="wrap sub">
<div data-include-path="/kofair_case_seed/usr/layout/_header.html"></div>
<div class="contents sub">
<div class="sub_visual">
<h2>분쟁조정 안내</h2>
</div>
<div class="inner">
<!-- lnb -->
<div class="lnb">
<p class="title">분쟁조정 안내</p>
<ul class="lnb_menu">
<li>
<a href="#none" class="lnb_menu_title">분쟁조정 안내 <i class="icon lnb_slide_toggle"></i></a>
<ul class="lnb_sub_menu">
<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>
<a href="#none" class="lnb_menu_title">자주하는 질문 <i class="icon lnb_slide_toggle"></i></a>
<ul class="lnb_sub_menu">
<li><a href="#">조정신청 관련 질문</a></li>
<li><a href="#">절차진행 관련 질문</a></li>
<li><a href="#">(성립/불성립)절차종료 관련 질문</a></li>
<li><a href="#">(기타)절차종결 관련 질문</a></li>
</ul>
</li>
<li class="active">
<a href="#none" class="lnb_menu_title">오시는 길</a>
</li>
<li>
<a href="#none" class="lnb_menu_title">공지사항</a>
</li>
<li>
<a href="#none" class="lnb_menu_title">뉴스레터 <i class="icon lnb_slide_toggle"></i></a>
<ul class="lnb_sub_menu">
<li><a href="#">뉴스레터 자료</a></li>
<li><a href="#">뉴스레터 서비스</a></li>
</ul>
</li>
</ul>
</div>
<!-- //lnb -->
<div class="sub_content">
<!-- page_location -->
<ul class="page_location">
<li><i class="icon home"></i></li>
<li>분쟁조정 안내</li>
<li>오시는 길</li>
</ul>
<!-- //page_location -->
<h3 class="sub_con_tit">오시는 길</h3>
<p class="sub_con_sub_tit">한국공정거래조정원의 위치 및 오시는 길을 알려드립니다.</p>
<div class="directions_content">
<div class="map_area" id="mapArea" style="width:100%;height:500px;"></div>
<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=6b7b045541e183038c5aba6fe4e5e879"></script>
<script>
var mapContainer = document.getElementById('mapArea'), // 지도를 표시할 div
mapOption = {
center: new kakao.maps.LatLng(37.560897, 126.973709), // 지도의 중심좌표
level: 3 // 지도의 확대 레벨
};
// 지도를 표시할 div와 지도 옵션으로 지도를 생성합니다
var map = new kakao.maps.Map(mapContainer, mapOption);
// 마커가 표시될 위치입니다
var markerPosition = new kakao.maps.LatLng(37.560897, 126.973709);
// 마커를 생성합니다
var marker = new kakao.maps.Marker({
position: markerPosition
});
// 마커가 지도 위에 표시되도록 설정합니다
marker.setMap(map);
</script>
<div class="map_box">
<img src="/kofair_case_seed/usr/images/info/logo.png" alt="">
<ul class="adress_ul">
<li>
<p class="title">주소</p>
<span>서울 중구 세종대로 39 상공회의소회관 9층</span>
</li>
<li>
<p class="title">전화</p>
<span>1588-1490</span>
</li>
</ul>
</div>
<!-- 지하철 이용 시 -->
<b class="title orange_border blue_border">지하철 이용 시</b>
<div class="item_list">
<div class="icon_box">
<i class="icon subway"></i>
</div>
<ul>
<li><span class="subway_text subway_1">1</span>호선 서울역 3번 출구 : YTN 방향 도보 5분</li>
<li><span class="subway_text subway_2">2</span>호선 시청역 9번 출구 : 삼성본관방향 도보 5분</li>
<li><span class="subway_text subway_4">4</span>호선 회현역 5번 출구 : 숭례문방향 도보 5분</li>
</ul>
</div>
<!-- 버스 이용 시 -->
<b class="title orange_border blue_border">버스 이용 시</b>
<div class="item_list">
<div class="icon_box">
<i class="icon bus"></i>
</div>
<ul>
<li>- 서울역 YTN 빌딩 앞 : 149, 151, 152, 162, 202, 500, 501, 502, 503, 505, 056, 701, 702, 703</li>
<li>- 염천교 : 163, 261, 262, 263, 604, 7017</li>
<li>- 시청앞 : 150, 1711, 406, 408, 421, 504, 507, 603, 700, 7019, 7011, 7022</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div data-include-path="/kofair_case_seed/usr/layout/_footer.html"></div>
</div>
</body>
</html>

View File

@ -85,6 +85,13 @@ function header() {
} }
}); });
$(".m_sub_depth02").each(function(idx,itm){
var subMenuLength = $(itm).find("li").length;
if(subMenuLength == 0){
$(itm).hide();
}
})
} }

View File

@ -125,7 +125,7 @@ input:disabled, input:read-only{background:#f8f9fa;border:1px solid #d8d8d8;}
/* sub layout */ /* sub layout */
.wrap.sub .footer{margin:80px 0 0 0;} .wrap.sub .footer{margin:80px 0 0 0;}
.sub_visual{display:flex;margin:0 0 30px 0;height:160px;background:url(/kofair_case_seed/usr/images/layout/sub_visual.jpg) no-repeat left center;justify-content:center;align-items:center;box-shadow:inset 0 2px 10px 1px rgba(0,0,0,0.1);} .sub_visual{display:flex;margin:0 0 30px 0;height:160px;background:url(/kofair_case_seed/usr/images/layout/sub_visual.jpg) no-repeat center center;background-size:cover;justify-content:center;align-items:center;box-shadow:inset 0 2px 10px 1px rgba(0,0,0,0.1);}
.sub_visual h2{font-size:3.5rem;font-weight:bold;color:#2a378b;} .sub_visual h2{font-size:3.5rem;font-weight:bold;color:#2a378b;}
.contents.sub .inner{display:flex;justify-content:space-between;align-items:flex-start;} .contents.sub .inner{display:flex;justify-content:space-between;align-items:flex-start;}

View File

@ -73,7 +73,7 @@
.notice_content .tab:first-child{position:relative;padding:0 27px 0 0;} .notice_content .tab:first-child{position:relative;padding:0 27px 0 0;}
.notice_content .tab:first-child::after{position:absolute;content:"";width:8px;height:8px;border-radius:100%;background:#888;right:0;top:50%;transform:translateY(-50%);} .notice_content .tab:first-child::after{position:absolute;content:"";width:8px;height:8px;border-radius:100%;background:#888;right:0;top:50%;transform:translateY(-50%);}
.notice_content .tab.active{color:#333;text-decoration:underline;text-underline-offset:10px;text-decoration-thickness:5px;} .notice_content .tab.active{color:#333;text-decoration:underline;text-underline-offset:10px;text-decoration-thickness:5px;}
.notice_content .tab_content{display:none;margin:44px 0 0 0;} .notice_content .tab_content{display:none;height:206px;margin:44px 0 0 0;}
.notice_content .tab_content.active{display:block;width:100%;} .notice_content .tab_content.active{display:block;width:100%;}
.notice_content .tab_content .btn_plus{position:absolute;left:387px;top:16px;background:#fff;} .notice_content .tab_content .btn_plus{position:absolute;left:387px;top:16px;background:#fff;}
.notice_content .tab_content .btn_plus i{margin:-2px -0.9px 0 0;} .notice_content .tab_content .btn_plus i{margin:-2px -0.9px 0 0;}

View File

@ -33,6 +33,26 @@
.process_content .box.gray_border.gray_fill.terms_info{padding:40px;text-align:left;} .process_content .box.gray_border.gray_fill.terms_info{padding:40px;text-align:left;}
.process_content .terms_info p{font-size:1.7rem;font-weight:400;color:#666;line-height:1.5;margin:10px 0 0 0;} .process_content .terms_info p{font-size:1.7rem;font-weight:400;color:#666;line-height:1.5;margin:10px 0 0 0;}
/* 오시는 길 */
.map_area{width:100%;height:330px;}
.map_box{display:flex;background:#f4f5f7;border-radius:0 0 5px 5px;padding:30px 90px;align-items:center;}
.map_box .adress_ul{position:relative;display:flex;padding:0 0 0 60px;margin:0 0 0 60px;align-items:flex-start;gap:60px;}
.map_box .adress_ul::after{position:absolute;content:"";width:1px;height:40px;background:#d8d8d8;top:50%;left:0;transform:translateY(-50%);}
.map_box .adress_ul .title{font-size:2.3rem;}
.map_box .adress_ul span{font-size:1.9rem;color:#666;}
.directions_content .title.blue_border.orange_border{display:block;margin:60px 0 30px 0;}
.directions_content .item_list{display:flex;align-items:center;gap:30px;}
.directions_content .icon_box{width:130px;height:110px;background:#f4f5f7;border-radius:5px;}
.directions_content .icon_box .subway{display:inline-block;width:100%;height:100%;background:url(/kofair_case_seed/usr/images/info/icon_subway.png) no-repeat center;}
.directions_content .icon_box .bus{display:inline-block;width:100%;height:100%;background:url(/kofair_case_seed/usr/images/info/icon_bus.png) no-repeat center;}
.directions_content .item_list ul{display:flex;flex-direction:column;font-size:1.7rem;font-weight:300;gap:6px;}
.directions_content .subway_text{display:inline-flex;width:24px;height:24px;margin:0 4px 0 0;font-weight:400;color:#fff;border-radius:100%;justify-content:center;align-items:center;}
.directions_content .subway_text.subway_1{background:#263c96;}
.directions_content .subway_text.subway_2{background:#35a142;}
.directions_content .subway_text.subway_4{background:#2b99d9;}
/* ==================== 테블릿 ==================== */ /* ==================== 테블릿 ==================== */
@media screen and (max-width: 1199px){ @media screen and (max-width: 1199px){
.news_service .text_explain{font-size:3.4rem;margin:80px 0;} .news_service .text_explain{font-size:3.4rem;margin:80px 0;}
@ -53,6 +73,18 @@
.system_info ul{font-size:3.4rem;padding:0 0 0 40px;margin:40px 0 0 0;} .system_info ul{font-size:3.4rem;padding:0 0 0 40px;margin:40px 0 0 0;}
.system_info .sub_info_ul li{padding:0 0 0 30px;} .system_info .sub_info_ul li{padding:0 0 0 30px;}
/* 오시는 길 */
.map_box{padding:30px;}
.map_box img{display:none;}
.map_box .adress_ul{display:flex;padding:0;margin:0;flex-direction:column;gap:30px;}
.map_box .adress_ul::after{display:none;}
.map_box .adress_ul li{display:flex;align-items:center;gap:30px;}
.map_box .adress_ul li .title,.map_box .adress_ul li span{font-size:3.2rem;}
.directions_content .item_list{padding:0 40px;}
.directions_content .icon_box{display:none;}
.directions_content .item_list ul{font-size:3.4rem;gap:20px;}
.directions_content .subway_text{width:48px;height:48px;}
} }
/* ==================== 모바일 ==================== */ /* ==================== 모바일 ==================== */
@ -74,6 +106,16 @@
.system_info ul{font-size:1.7rem;padding:0 0 0 20px;margin:20px 0 0 0;} .system_info ul{font-size:1.7rem;padding:0 0 0 20px;margin:20px 0 0 0;}
.system_info .sub_info_ul li{padding:0 0 0 15px;margin:0 0 0 10px;} .system_info .sub_info_ul li{padding:0 0 0 15px;margin:0 0 0 10px;}
/* 오시는 길 */
.map_box{padding:15px;}
.map_box .adress_ul{gap:8px;}
.map_box .adress_ul li{gap:15px;}
.map_box .adress_ul li .title,.map_box .adress_ul li span{font-size:1.6rem;}
.directions_content .title.blue_border.orange_border{margin:30px 0 15px 0;}
.directions_content .item_list{padding:0 20px;}
.directions_content .item_list ul{font-size:1.7rem;gap:10px;}
.directions_content .subway_text{width:24px;height:24px;}
} }
@media screen and (max-width: 500px){ @media screen and (max-width: 500px){

View File

@ -74,6 +74,7 @@ html{font-size:62.5%;}
/* footer */ /* footer */
.footer{width:100%;background:#d0d1d3;padding:40px 0 35px 0;font-size:1.7rem;font-weight:400;color:#585858;} .footer{width:100%;background:#d0d1d3;padding:40px 0 35px 0;font-size:1.7rem;font-weight:400;color:#585858;}
.footer .logo{display:inline-block;}
.footer_content{display:flex;margin:40px 0 0 0;align-items:flex-end;justify-content:space-between;} .footer_content{display:flex;margin:40px 0 0 0;align-items:flex-end;justify-content:space-between;}
.footer_info{line-height:1.7;} .footer_info{line-height:1.7;}
.footer_info p:first-child{margin:0 0 16px 0;} .footer_info p:first-child{margin:0 0 16px 0;}
@ -172,6 +173,17 @@ html{font-size:62.5%;}
.mobile_header .header_util button i{height:100%;background-size:auto 100%;} .mobile_header .header_util button i{height:100%;background-size:auto 100%;}
.mobile_header .header_util .btn_menu i{background-size:100% auto;} .mobile_header .header_util .btn_menu i{background-size:100% auto;}
.mobile_header .all_menu_wrap .btn_menu_close{width:32px;height:32px;}
.mobile_header .all_menu_wrap .btn_menu_close i{background-size:100% auto;}
.mobile_header .all_menu_wrap .top_area{height:63px;padding:0 30px;}
.m_menu_depth01{height:48.5px;padding:0 16px;font-size:1.8rem;}
.m_sub_menu>li{padding:10px 32px;border-top:1px solid #d8d8d8;}
.m_sub_menu .title{height:40px;font-size:1.7rem;}
.m_sub_menu .m_sub_depth02{font-size:1.7rem;gap:17px 0;margin:10px 0 0 0;padding:0 0 21px;}
.m_sub_menu .m_sub_depth02 li{width:100%;padding:0 0 0 10px;}
.m_sub_menu .m_sub_depth02 li::after{width:4px;height:4px;top:9.5px;}
/* footer */ /* footer */
.footer{padding:30px 0;} .footer{padding:30px 0;}
.footer .m_logo{width:70%;} .footer .m_logo{width:70%;}

View File

@ -226,13 +226,15 @@
/* duet_calendar */ /* duet_calendar */
.calendar .duet-date__dialog-content{position:relative;padding:25px 23px 54px 23px;} /* 달력 박스 */ .calendar .duet-date__dialog-content{position:relative;padding:25px 23px 54px 23px;} /* 달력 박스 */
.calendar .duet-date__table{border-top:0;}
.calendar .duet-date__mobile{position:unset;} .calendar .duet-date__mobile{position:unset;}
.calendar .duet-date__select span,.calendar .duet-date__header{font-size:1.8rem;} /* 달력 select, button */ .calendar .duet-date__select span,.calendar .duet-date__header{font-size:1.8rem;} /* 달력 select, button */
.calendar .duet-date__select-label svg{width:20px;height:20px;margin:3px 0 0 0;} /* 달력 select 아이콘 */ .calendar .duet-date__select-label svg{width:20px;height:20px;margin:3px 0 0 0;} /* 달력 select 아이콘 */
.calendar .duet-date__prev, .calendar .duet-date__next{width:26px;height:26px;background:transparent;border:1px solid #d8d8d8;border-radius:5px;} /* 달력 이전, 다음 버튼 */ .calendar .duet-date__prev, .calendar .duet-date__next{width:26px;height:26px;background:transparent;border:1px solid #d8d8d8;border-radius:5px;} /* 달력 이전, 다음 버튼 */
.calendar .duet-date__prev::before,.calendar .duet-date__next::before{font-size:1.8rem;} /* 달력 이전, 다음 버튼 아이콘 */ .calendar .duet-date__prev::before,.calendar .duet-date__next::before{font-size:1.8rem;} /* 달력 이전, 다음 버튼 아이콘 */
.calendar .duet-date__table-header{font-size:1.5rem;} /* 달력 요일 */ .calendar .duet-date__table-header{font-size:1.5rem;padding:10px 0;background:#fff;text-align:center;} /* 달력 요일 */
.calendar .duet-date__table thead tr,.calendar .duet-date__table tbody{border-bottom:1px solid #d8d8d8;} /* 달력 요일 밑줄 */ .calendar .duet-date__table thead tr,.calendar .duet-date__table tbody{border-bottom:1px solid #d8d8d8;} /* 달력 요일 밑줄 */
.calendar .duet-date__table tbody tr td{height:auto;padding:0;border-bottom:0;}
.calendar .duet-date__table tbody tr:first-child td{padding:4px 0 0 0;} .calendar .duet-date__table tbody tr:first-child td{padding:4px 0 0 0;}
.calendar .duet-date__table tbody tr:last-child td{padding:0 0 6px 0;} .calendar .duet-date__table tbody tr:last-child td{padding:0 0 6px 0;}
.calendar .duet-date__day{height:36px;font-size:1.5rem;color:#333;} /* 달력 날짜 */ .calendar .duet-date__day{height:36px;font-size:1.5rem;color:#333;} /* 달력 날짜 */
@ -242,10 +244,6 @@
.calendar .duet-date__day[aria-pressed=true],.calendar .duet-date__day:focus{background:#2870ed;color:#fff;} /* 달력 날짜 선택 */ .calendar .duet-date__day[aria-pressed=true],.calendar .duet-date__day:focus{background:#2870ed;color:#fff;} /* 달력 날짜 선택 */
.calendar .duet-date__close{display:flex !important;position:absolute;width:26px;height:26px;border:1px solid #d8d8d8;border-radius:5px;background:#fff;right:25px;bottom:15px;opacity:1 !important;} /* 달력 닫기 */ .calendar .duet-date__close{display:flex !important;position:absolute;width:26px;height:26px;border:1px solid #d8d8d8;border-radius:5px;background:#fff;right:25px;bottom:15px;opacity:1 !important;} /* 달력 닫기 */
/* 2870ed / e3edfe */
/* ==================== 테블릿 ==================== */ /* ==================== 테블릿 ==================== */
@media screen and (max-width: 1199px){ @media screen and (max-width: 1199px){
@ -395,6 +393,21 @@
.search_wrap .calendar_term .duet-date__input{font-size:3rem;} .search_wrap .calendar_term .duet-date__input{font-size:3rem;}
.calendar .duet-date__dialog{background:rgba(0,0,0,0.8);bottom:0;position:fixed;right:0;top:0;transform:translateZ(0);transform-origin:bottom center;}
.calendar .duet-date__dialog-content{position:fixed;width:100%;max-width:100%;min-height:60vh;padding:50px 50px 100px 50px;bottom:0;}
.calendar .duet-date__select span, .calendar .duet-date__header{font-size:3.6rem;margin-right:0;}
.calendar .duet-date__header{margin:0 0 32px 0;}
.calendar .duet-date__select-label{padding:0 16px;}
.calendar .duet-date__select-label svg{width:40px;height:40px;}
.calendar .duet-date__table thead tr,.calendar .duet-date__table tbody tr{display:table-row;}
.calendar .duet-date__table thead tr th,.calendar .duet-date__table tbody tr td{display:table-cell;font-size:3rem;padding:20px 0;}
.calendar .duet-date__table tbody tr td{height:80px;}
.calendar .duet-date__table td .duet-date__day{width:60px;height:60px;font-size:2.8rem;}
.calendar .duet-date__prev, .calendar .duet-date__next,.calendar .duet-date__close{width:52px;height:52px;}
.calendar .duet-date__close{bottom:22px;right:50px;}
.calendar .duet-date__prev svg, .calendar .duet-date__next svg,.calendar .duet-date__close svg{width:40px;height:40px;}
} }
@ -510,6 +523,17 @@
.is-active .duet-date__dialog-content{position:absolute;} .is-active .duet-date__dialog-content{position:absolute;}
.calendar .duet-date__close{bottom:auto;top:12px;} .calendar .duet-date__close{bottom:auto;top:12px;}
.calendar .duet-date__dialog-content{position:fixed;width:100%;max-width:100%;min-height:44vh;padding:25px 25px 50px 25px;bottom:0;}
.calendar .duet-date__select span, .calendar .duet-date__header{font-size:1.8rem;}
.calendar .duet-date__header{margin:0 0 16px 0;}
.calendar .duet-date__select-label{padding:0 8px;}
.calendar .duet-date__select-label svg{width:20px;height:20px;}
.calendar .duet-date__table thead tr th,.calendar .duet-date__table tbody tr td{font-size:1.5rem;padding:10px 0;}
.calendar .duet-date__table tbody tr td{height:40px;}
.calendar .duet-date__table td .duet-date__day{width:30px;height:30px;font-size:1.4rem;}
.calendar .duet-date__prev, .calendar .duet-date__next,.calendar .duet-date__close{width:26px;height:26px;}
.calendar .duet-date__close{bottom:11px;right:25px;}
.calendar .duet-date__prev svg, .calendar .duet-date__next svg,.calendar .duet-date__close svg{width:20px;height:20px;}
.search_wrap li{font-size:1.6rem;gap:10px;} .search_wrap li{font-size:1.6rem;gap:10px;}
.search_wrap .calendar_term{width:calc(100% - 50px);} .search_wrap .calendar_term{width:calc(100% - 50px);}