정보광장 작업중

src/main/resources/static/css/info-form.css

@@ -0,0 +1,13 @@
+#info_file_table th:first-child {
+    text-align: left;
+}
+#info_file_table td:first-child {
+    text-align: left;
+}
+
+#info_file_table th:last-child {
+    text-align: right;
+}
+#info_file_table td:last-child {
+    text-align: right;
+}

src/main/resources/templates/html/business-inner/special-cargo.html

@@ -12,7 +12,7 @@
     <div class="col-lg-3">
     </div>
     <div class="col-lg-6">
-        <p class="fw-bold text-center">(주)국제종합물류는 특별한 조건의 서비스를 필요로 하는 특수화물이나 프로젝트 화물은 화물의 특성과 운송조건에 따라 맟춤형 으로 서비스 합니다</p>
+        <p class="fw-bold text-center">(주)국제종합물류는 특별한 조건의 서비스를 필요로 하는 특수화물이나 프로젝트 화물은 화물의 특성과 운송조건에 따라 맞춤형 으로 서비스 합니다</p>
     </div>
     <div class="col-lg-3">
     </div>

src/main/resources/templates/html/info-inner/info-container.html

@@ -0,0 +1,328 @@
+<div class="row">
+    <div class="col-md-2">
+    </div>
+    <div class="col-md-8">
+        <nav class="navbar navbar-expand-lg navbar-light bg-light">
+            <div class="container-fluid">
+                <div class="collapse navbar-collapse">
+                    <ul class="navbar-nav d-flex justify-content-between w-100">
+                        <li class="nav-item">
+                            <a aria-current="page" class="nav-link" href="#">컨테이너 규격(내외장 치수,중량)</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">컨테이너 분류(용도)</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">항공컨테이너 규격</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav>
+    </div>
+    <div class="col-md-2">
+    </div>
+</div>
+<div class="row">
+    <div class="col-md-2">
+    </div>
+    <div class="col-md-8 table-responsive">
+        <h5 class="text-left fw-bold mt-5">Dry Container (20',40',40HC,45')</h5>
+        <table class="table table-bordered table-striped text-center">
+            <thead>
+                <tr>
+                    <th scope="col" colspan="2">구 분</th>
+                    <th scope="col">20ft</th>
+                    <th scope="col">40ft</th>
+                    <th scope="col">40ft HC</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td rowspan="3">내부치<br/>(mm)</td>
+                    <td>길이</td>
+                    <td>5,455</td>
+                    <td>11,544</td>
+                    <td>11,544</td>
+                </tr>
+                <tr>
+                    <td>폭</td>
+                    <td>2,290</td>
+                    <td>2,286</td>
+                    <td>2,290</td>
+                </tr>
+                <tr>
+                    <td>높이</td>
+                    <td>2,262</td>
+                    <td>2,216</td>
+                    <td>2,538</td>
+                </tr>
+                <tr>
+                    <td rowspan="2">개구부치수<br/>(mm)</td>
+                    <td>폭</td>
+                    <td>2,286</td>
+                    <td>2,286</td>
+                    <td>2,286</td>
+                </tr>
+                <tr>
+                    <td>높이</td>
+                    <td>2,227</td>
+                    <td>2,182</td>
+                    <td>2,491</td>
+                </tr>
+                <tr>
+                    <td colspan="2">내부용적(CBM)</td>
+                    <td>28,300</td>
+                    <td>58,500</td>
+                    <td>67,300</td>
+                </tr>
+                <tr>
+                    <td rowspan="3">중량<br/>(KG)</td>
+                    <td>자체중량</td>
+                    <td>2,960</td>
+                    <td>4,240</td>
+                    <td>4,800</td>
+                </tr>
+                <tr>
+                    <td>최대적재중량</td>
+                    <td>21,040</td>
+                    <td>26,280</td>
+                    <td>25,680</td>
+                </tr>
+                <tr>
+                    <td>총 중량</td>
+                    <td>24,000</td>
+                    <td>30,520</td>
+                    <td>30,480</td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+    <div class="col-md-2">
+    </div>
+</div>
+
+<hr class="featurette-divider">
+
+<div class="row">
+    <div class="col-md-2">
+    </div>
+    <div class="col-md-8 table-responsive">
+        <h5 class="text-left fw-bold mt-5">Open Top Container (20',40')</h5>
+        <table class="table table-bordered table-striped text-center">
+            <thead>
+                <tr>
+                    <th scope="col" colspan="2">구 분</th>
+                    <th scope="col">20ft</th>
+                    <th scope="col">40ft</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td rowspan="3">내부치<br/>(mm)</td>
+                    <td>길이</td>
+                    <td>5,900</td>
+                    <td>12,020</td>
+                </tr>
+                <tr>
+                    <td>폭</td>
+                    <td>2,354</td>
+                    <td>2,344</td>
+                </tr>
+                <tr>
+                    <td>높이</td>
+                    <td>2,367</td>
+                    <td>2,356</td>
+                </tr>
+                <tr>
+                    <td rowspan="2">개구부치수<br/>(mm)</td>
+                    <td>폭</td>
+                    <td>-</td>
+                    <td>-</td>
+                </tr>
+                <tr>
+                    <td>높이</td>
+                    <td>-</td>
+                    <td>-</td>
+                </tr>
+                <tr>
+                    <td colspan="2">내부용적(CBM)</td>
+                    <td>32,800</td>
+                    <td>66,400</td>
+                </tr>
+                <tr>
+                    <td rowspan="3">중량<br/>(KG)</td>
+                    <td>자체중량</td>
+                    <td>2,400</td>
+                    <td>4,020</td>
+                </tr>
+                <tr>
+                    <td>최대적재중량</td>
+                    <td>28,280</td>
+                    <td>34,480</td>
+                </tr>
+                <tr>
+                    <td>총 중량</td>
+                    <td>30,480</td>
+                    <td>34,500</td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+    <div class="col-md-2">
+    </div>
+</div>
+
+<hr class="featurette-divider">
+
+<div class="row">
+    <div class="col-md-2">
+    </div>
+    <div class="col-md-8 table-responsive">
+        <h5 class="text-left fw-bold mt-5">Reefer Container (20',40',40HC,45')</h5>
+        <table class="table table-bordered table-striped text-center">
+            <thead>
+            <tr>
+                <th scope="col" colspan="2">구 분</th>
+                <th scope="col">20ft</th>
+                <th scope="col">40ft</th>
+                <th scope="col">40ft HC</th>
+            </tr>
+            </thead>
+            <tbody>
+            <tr>
+                <td rowspan="3">내부치<br/>(mm)</td>
+                <td>길이</td>
+                <td>5,455</td>
+                <td>11,544</td>
+                <td>11,544</td>
+            </tr>
+            <tr>
+                <td>폭</td>
+                <td>2,290</td>
+                <td>2,286</td>
+                <td>2,290</td>
+            </tr>
+            <tr>
+                <td>높이</td>
+                <td>2,262</td>
+                <td>2,216</td>
+                <td>2,538</td>
+            </tr>
+            <tr>
+                <td rowspan="2">개구부치수<br/>(mm)</td>
+                <td>폭</td>
+                <td>2,286</td>
+                <td>2,286</td>
+                <td>2,286</td>
+            </tr>
+            <tr>
+                <td>높이</td>
+                <td>2,227</td>
+                <td>2,182</td>
+                <td>2,491</td>
+            </tr>
+            <tr>
+                <td colspan="2">내부용적(CBM)</td>
+                <td>28,300</td>
+                <td>58,500</td>
+                <td>67,300</td>
+            </tr>
+            <tr>
+                <td rowspan="3">중량<br/>(KG)</td>
+                <td>자체중량</td>
+                <td>2,960</td>
+                <td>4,240</td>
+                <td>4,800</td>
+            </tr>
+            <tr>
+                <td>최대적재중량</td>
+                <td>21,040</td>
+                <td>26,280</td>
+                <td>25,680</td>
+            </tr>
+            <tr>
+                <td>총 중량</td>
+                <td>24,000</td>
+                <td>30,520</td>
+                <td>30,480</td>
+            </tr>
+            </tbody>
+        </table>
+    </div>
+    <div class="col-md-2">
+    </div>
+</div>
+
+<hr class="featurette-divider">
+
+<div class="row">
+    <div class="col-md-2">
+    </div>
+    <div class="col-md-8 table-responsive">
+        <h5 class="text-left fw-bold mt-5">Flat Rack Container (20',40')</h5>
+        <table class="table table-bordered table-striped text-center">
+            <thead>
+            <tr>
+                <th scope="col" colspan="2">구 분</th>
+                <th scope="col">20ft</th>
+                <th scope="col">40ft</th>
+            </tr>
+            </thead>
+            <tbody>
+            <tr>
+                <td rowspan="3">내부치<br/>(mm)</td>
+                <td>길이</td>
+                <td>5,624</td>
+                <td>11,786</td>
+            </tr>
+            <tr>
+                <td>폭</td>
+                <td>2,236</td>
+                <td>2,236</td>
+            </tr>
+            <tr>
+                <td>높이</td>
+                <td>2,243</td>
+                <td>1,968</td>
+            </tr>
+            <tr>
+                <td rowspan="2">개구부치수<br/>(mm)</td>
+                <td>폭</td>
+                <td>-</td>
+                <td>-</td>
+            </tr>
+            <tr>
+                <td>높이</td>
+                <td>-</td>
+                <td>-</td>
+            </tr>
+            <tr>
+                <td colspan="2">내부용적(CBM)</td>
+                <td>27,900</td>
+                <td>51,900</td>
+            </tr>
+            <tr>
+                <td rowspan="3">중량<br/>(KG)</td>
+                <td>자체중량</td>
+                <td>2,900</td>
+                <td>5,870</td>
+            </tr>
+            <tr>
+                <td>최대적재중량</td>
+                <td>27,580</td>
+                <td>28,130</td>
+            </tr>
+            <tr>
+                <td>총 중량</td>
+                <td>30,480</td>
+                <td>34,000</td>
+            </tr>
+            </tbody>
+        </table>
+    </div>
+    <div class="col-md-2">
+    </div>
+</div>
+
+

src/main/resources/templates/html/info-inner/info-form.html

@@ -0,0 +1,94 @@
+<div class="row">
+    <div class="col-md-2">
+    </div>
+    <div class="col-md-8">
+        <nav class="navbar navbar-expand-lg navbar-light bg-light">
+            <div class="container-fluid">
+                <div class="collapse navbar-collapse">
+                    <ul class="navbar-nav d-flex justify-content-between w-100">
+                        <li class="nav-item">
+                            <a aria-current="page" class="nav-link" href="#">무역업고유번호 신청</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">수출입계약 및 신용장 개설</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">수출입 승인</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">수출입 통관 (수출입신고,관세,관세환급)</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav>
+        <nav class="navbar navbar-expand-lg navbar-light bg-light">
+            <div class="container-fluid">
+                <div class="collapse navbar-collapse">
+                    <ul class="navbar-nav d-flex justify-content-between w-100">
+                        <li class="nav-item">
+                            <a aria-current="page" class="nav-link" href="#">외환,무역금융</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">수출대금 결제</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">기타서식</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">무역관련 각종계약서</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#">무역관련 증명서</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav>
+    </div>
+    <div class="col-md-2">
+    </div>
+</div>
+<div class="row mt-5">
+    <div class="col-md-2">
+    </div>
+    <div class="col-md-8">
+        <table class="table table-bordered table-striped text-center" id="info_file_table">
+            <thead>
+            <tr>
+                <th scope="col">서식</th>
+                <th scope="col">다운로드</th>
+            </tr>
+            </thead>
+            <tbody>
+            <tr>
+                <td>무역업고유번호 신청</td>
+                <td><a href="" class="icon-link"><i class="fas fa-file-excel"></i></a></td>
+            </tr>
+            <tr>
+                <td>무역업고유번호 신청서</td>
+                <td><a href="" class="icon-link"><i class="fas fa-file-pdf"></i></a></td>
+            </tr>
+            <tr>
+                <td>무역업고유번호시청사항 변경통보서</td>
+                <td><a href="" class="icon-link"><i class="fas fa-file-word"></i></a></td>
+            </tr>
+            <tr>
+                <td>선광 CFS 수출화물 입고증</td>
+                <td><a href="" class="icon-link"><i class="fas fa-file-word"></i></a>
+                    <a href="" class="icon-link"><i class="fas fa-file-excel"></i></a>
+                </td>
+            </tr>
+            <tr>
+                <td>관세사 위임장</td>
+                <td><a href="" class="icon-link"><i class="fas fa-file-word"></i></a>
+                    <a href="" class="icon-link"><i class="fas fa-file-excel"></i></a>
+                    <a href="" class="icon-link"><i class="fas fa-file-pdf"></i></a>
+                </td>
+            </tr>
+            </tbody>
+        </table>
+    </div>
+    <div class="col-md-2">
+    </div>
+</div>

src/main/resources/templates/html/info-inner/vol-cal.html

@@ -0,0 +1,105 @@
+<div class="row py4">
+    <div class="col-lg-2">
+    </div>
+    <div class="col-lg-8">
+        <div class="p-5 mb-4 bg-body-tertiary rounded-3">
+            <div class="container-fluid py-5">
+                <h4 class="fw-bold">CBM 이란?</h4>
+                <p class=" fs-10">'Cubic Meter'의 약자로 가로,세로,높이가 각 1M인 부피를 환산하는 단위입니다. 컨테이너 적재능력은 중량과 부피로 가늠이 되는데 중량은 Ton,Kg으로,
+                부피는 CBM으로 표시하고 있습니다. 컨테이너 최대 적재 부피는 그 내장 Size에 의해 결정이 되지만 컨테이너 내,외장 Size는 운송 단위 규격화를 위해 국제적으로 통일 되어있습니다.
+                (제작사에 따라 무시할 정도의 근소한 차이는 있음)</p>
+            </div>
+        </div>
+    </div>
+    <div class="col-lg-2">
+    </div>
+</div>
+<div class="row">
+    <div class="col-lg-2">
+    </div>
+    <div class="col-lg-8">
+        <p class="fw-bold text-center">컨테이너 내장 Size의 최소치입니다. 어느 선사의 컨테이너라도 아래의 수치를 정용하면 무리가 없을 것입니다.</p>
+    </div>
+    <div class="col-lg-2">
+    </div>
+</div>
+<div class="row">
+    <div class="col-lg-2">
+    </div>
+    <div class="col-lg-8">
+        <table class="table table-bordered table-striped text-center">
+            <thead>
+            <tr>
+                <th scope="col">내장 Size</th>
+                <th scope="col">길이 / 폭 / 높이 / CBM</th>
+            </tr>
+            </thead>
+            <tbody>
+            <tr>
+                <td>20ft(Dry)</td>
+                <td>5.8M / 2.3M / 2.3M / 30.682</td>
+            </tr>
+            <tr>
+                <td>40ft(Dry)</td>
+                <td>12M / 2.3M / 2.3M / 63.480</td>
+            </tr>
+            </tbody>
+        </table>
+    </div>
+    <div class="col-lg-2">
+    </div>
+</div>
+<div class="row">
+    <div class="col-lg-2">
+    </div>
+    <div class="col-lg-8">
+        <p class="mt-1">* 위 표의 CBM은 실제 화물을 적재하면 나올 수 있는 수치가 아닙니다. 화물 적재 시 빈곳이 생기기 떄문인데, 이는 화물의 외장 Size에 달려있습니다. 예를 들어 화물을
+        포장한 후의 외장 높이가 1.2M를 넘게 되면 컨테이너 내 2단 적재가 안되므로, 화물을 많이 적재할 수 없습니다.</p>
+        <p class="mt-1">* 일반적으로 화물의 단위당 용적(CBM)이 작을수록 많이 적재할 수 있습니다. 책상 사이즈와 라면이Box Size가 있다면 라면Box 사이즈가 화물을 더 많이 적재하 수 있습니다.
+        그러나 책상 Size나 더 큰 화물이라도 컨테이너의 내장사이즈를 고려하고 포장을 제작하였다면 문제는 달라집니다.</p>
+    </div>
+    <div class="col-lg-2">
+    </div>
+</div>
+<div class="row">
+    <div class="col-lg-4 offset-lg-2">
+        <table class="table table-bordered table-striped text-center">
+            <thead>
+            <tr>
+                <th scope="col">측정 단위</th>
+                <th scope="col"><button></button></th>
+            </tr>
+            </thead>
+            <tbody>
+            <tr>
+                <td>20ft(Dry)</td>
+                <td>5.8M / 2.3M / 2.3M / 30.682</td>
+            </tr>
+            <tr>
+                <td>40ft(Dry)</td>
+                <td>12M / 2.3M / 2.3M / 63.480</td>
+            </tr>
+            </tbody>
+        </table>
+    </div>
+    <div class="col-lg-4">
+        <table class="table table-bordered table-striped text-center">
+            <thead>
+            <tr>
+                <th scope="col">내장 Size</th>
+                <th scope="col">길이 / 폭 / 높이 / CBM</th>
+            </tr>
+            </thead>
+            <tbody>
+            <tr>
+                <td>20ft(Dry)</td>
+                <td>5.8M / 2.3M / 2.3M / 30.682</td>
+            </tr>
+            <tr>
+                <td>40ft(Dry)</td>
+                <td>12M / 2.3M / 2.3M / 63.480</td>
+            </tr>
+            </tbody>
+        </table>
+    </div>
+</div>

src/main/resources/templates/html/info-plaza.html

@@ -11,20 +11,53 @@
     <link href="https://getbootstrap.com/docs/5.0/examples/carousel/" rel="canonical">
     <!-- Bootstrap core CSS -->
     <link href="/css/bootstrap.min.css" rel="stylesheet">
+    <!-- Font Awesome -->
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
     <!-- swiper CSS-->
     <link href="https://unpkg.com/swiper/swiper-bundle.min.css" rel="stylesheet">
 
 
     <!-- Custom styles for this template -->
     <link href="/css/index.css" rel="stylesheet">
+    <link href="/css/info-form.css" rel="stylesheet">
 </head>
 <body>
 <header th:include="html/common/header">
 </header>
 <main>
+    <div class="carousel slide" data-bs-ride="carousel" id="myCarousel">
+        <!--<div class="carousel-indicators">
+            <button aria-label="Slide 1" data-bs-slide-to="0" data-bs-target="#myCarousel" type="button"></button>
+            <button aria-label="Slide 2" data-bs-slide-to="1" data-bs-target="#myCarousel" type="button"></button>
+            <button aria-label="Slide 3" data-bs-slide-to="2" data-bs-target="#myCarousel" type="button"></button>
+        </div>-->
+        <div class="carousel-inner">
+            <div class="carousel-item active">
+                <svg aria-hidden="true" class="bd-placeholder-img" focusable="false" height="100%"
+                     preserveAspectRatio="xMidYMid slice" width="100%" xmlns="http://www.w3.org/2000/svg">
+                    <rect fill="#777" height="100%" width="100%"/>
+                </svg>
 
+                <div class="container">
+                    <div class="carousel-caption">
+                        <h1>정보광장</h1>
+                        <p>The Master of Global Logistics</p>
+                        <p>
+                            <button class="btn btn-primary"  th:onclick="changeInner('inner_form')">서식자료</button>
+                            <button class="btn btn-primary"  th:onclick="changeInner('inner_container')">컨테이너제원</button>
+                            <button class="btn btn-primary"  th:onclick="changeInner('inner_multi')">체적계산기</button>
+                            <button class="btn btn-primary"  th:onclick="changeInner('inner_global')">물류정보</button>
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="container marketing" id="inner_form" th:include="html/info-inner/info-form" style="display: none"></div>
+    <div class="container marketing container-fluid" id="inner_container" th:include="html/info-inner/info-container" style="display: none"></div>
+    <div class="container marketing container-fluid" id="inner_vol" th:include="html/info-inner/vol-cal"></div>
 </main>
-
+<hr class="featurette-divider">
 <footer class="footer" th:include="html/common/footer">
 
 </footer>