@@include("../../html/include/meta.html", {"pageTitle" : "영상갤러리 - Shorts", "ROOT":"../"})
@@include("../../html/include/header.html",{"ROOT":"../"})

<div class="container">
    <nav class="breadcrumb">
        <ol>
            <li><a href="detail.html">홈</a></li>
            <li><a href="../clips/clips.html">영상갤러리</a></li>
            <li><span>Shorts</span></li>
        </ol>
    </nav>
</div>

<div class="sub-main container" id="main">

    <aside class="left-nav">
        @@include("../../html/include/search_box.html")
        @@include("../../html/include/left_menu.html", {"active": "clips", "subActive": "shorts"})
    </aside>

    <main class="page-contents">

        <div class="contents-box">
            <header class="contents-header">
                <h2 class="contents-title">Shorts</h2>
            </header>

            <ul class="common-list shorts">

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-01.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금, 내고 싶은 사람만 내면 안되나요?</a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-02.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금은 도대체 왜?
                                국가에서 운영하는거죠?</a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-03.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금공단 쉽게
                                취업하는 꿀팁?! </a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-04.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금 3인방의
                                🏠 Home🏠 댄스챌린지</a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-05.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">199X년생부터 국민연금
                                을 하나도 못 받는다고?!</a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-06.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">유럽 vs 우리나라
                                국민연금 급여 차이는?</a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-07.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금 기금수익률을
                                더 높일 수 있는 방법은? </a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-08.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금 기금투자
                                믿을 수 있나요? </a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-09.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금 3인방의
                                💝사랑스러워 💝챌린지 </a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-10.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금! 부부 모두
                                가입하면? #Shorts
                            </a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-11.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금 3인방의
                                🥰날 바라바라봐🥰 챌린지
                            </a>
                        </h4>
                    </div>
                </li>

                <li class="item">
                    <figure class="thumbnail">
                        <a class="thumbnail-link" href="detail.html">
                            <img class="thumbnail-img" src="../assets/images/ex/shorts-12.jpg" alt="">
                        </a>
                    </figure>
                    <div class="item-content">
                        <h4 class="item-title">
                            <a href="detail.html">국민연금 걱정🥰...은
                                No!2023년 말 기준
                            </a>
                        </h4>
                    </div>
                </li>


            </ul>
        </div>

        @@include("../../html/include/pagination.html")

    </main>
</div>

@@include("../../html/include/footer.html")
@@include("../../html/include/tail.html")