관광정보 api template

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>관광정보</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/start/jquery-ui.css">
    <script src="http://code.jquery.com/jquery-1.12.1.min.js"></script>
    <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
</head>
<body>

    <div class="container">
        <div class="jumbotron text-center">
            <h1>한국관광지정보</h1>
        </div>
        <div class="main">
            <form onsubmit="return false;" class="form-inline">
                <select name="areaCode" id="areaCode" class="form-control">
                    <option value="">지역코드</option>
                </select>
            </form>
        </div>
        <div class="list">
            <table class="table">
                <thead class="thead-dark">
                    <tr>
                        <th>사진</th>
                        <th>관광지명</th>
                        <th>주소</th>
                        <th>연락처</th>
                        <th>경도</th>
                        <th>위도</th>
                    </tr>
                </thead>
                <tbody>

                </tbody>
            </table>
        </div>

    </div>


    <div id="pop" style="display: none;">
        <h2 id="detail-title" class="detail-info"></h2>
        <p>주소: <span id="detail-addr" class="detail-info"></span></p>
        <p>전화: <span id="detail-tel" class="detail-info"></span></p>
        <p>좌표: <span id="detail-mapxy" class="detail-info"></span></p>
        <p>설명: <span id="detail-overview" class="detail-info"></span></p>
        <p><img id="detail-pic" src="" class="detail-img" style="max-width: 90%;"></p>
    </div>


    <script>

    </script>
</body>
</html>