๐Ÿ“‘ ๊ฐœ์ธ ํ™œ๋™ ๋ชจ์Œ์ง‘ ๐Ÿ“‘/๐Ÿ‘ฉ๐Ÿป‍๐Ÿ’ป `23 -`24 ๋™๊ณ„ ๋ชจ๊ฐ์ฝ” ๐Ÿ‘ฉ๐Ÿป‍๐Ÿ’ป

[`23 - `24 ๋™๊ณ„ ๋ชจ๊ฐ์ฝ”] Bit๋‘˜๊ธฐ 4ํšŒ์ฐจ ๊ฐœ์ธ ๋ฆฌ๋ทฐ

lrycro_ 2024. 1. 22. 22:00

[ # 4ํšŒ์ฐจ ์ •๋ณด ]

  • 2024๋…„ 1์›” 22์ผ 19:00 - 22:00
  • Discord ์˜์ƒ ํ†ตํ™”๋กœ ์˜จ๋ผ์ธ ์Šคํ„ฐ๋”” ํšŒ์˜ ์ง„ํ–‰

[ # 4ํšŒ์ฐจ ๊ฐœ์ธ ๋ชฉํ‘œ ]

๋™์•„๋ฆฌ ํ™ˆํŽ˜์ด์ง€ FE - ์ปค๋ฎค๋‹ˆํ‹ฐ ๊ฒŒ์‹œํŒ ๋ฉ”์ธ ํŽ˜์ด์ง€ ๋งŒ๋“ค๊ธฐ


[ # 4ํšŒ์ฐจ ๊ฐœ์ธ ํ™œ๋™ ๋‚ด์šฉ ]

<!-- community.html -->

<!DOCTYPE html>
<html lang="ko">
<head>
    <!-- Basic -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <!-- Mobile Metas -->
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <!-- Site Metas -->
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <link rel="shortcut icon" href="images/logo_regular.png" type="">

    <title> ARGOS </title>

    <!-- bootstrap core css -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />

    <!-- fonts style -->
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet">

    <!--owl slider stylesheet -->
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" />

    <!-- font awesome style -->
    <link href="css/font-awesome.min.css" rel="stylesheet" />

    <!-- Custom styles for this template -->
    <link href="css/style.css" rel="stylesheet" />
    <!-- responsive style -->
    <link href="css/responsive.css" rel="stylesheet" />

</head>
<body class="sub_page">

    <div class="hero_area">

        <div class="hero_bg_box">
            <div class="bg_img_box">
                <img src="images/hero-bg.png" alt=""></div>
            </div>

            <!-- header section starts -->
            <header class="header_section">
                <div class="container-fluid">
                    <nav class="navbar navbar-expand-lg custom_nav-container ">
                        <a class="navbar-brand" href="index.html">
                            <span>
                                ARGOS
                            </span>
                        </a>

                        <button
                            class="navbar-toggler"
                            type="button"
                            data-toggle="collapse"
                            data-target="#navbarSupportedContent"
                            aria-controls="navbarSupportedContent"
                            aria-expanded="false"
                            aria-label="Toggle navigation">
                            <span class=""></span>
                        </button>

                        <div class="collapse navbar-collapse" id="navbarSupportedContent">
                            <ul class="navbar-nav  ">
                                <li class="nav-item ">
                                    <a class="nav-link" href="index.html">Home</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="education.html">๊ต์œก ํ™œ๋™</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="history.html">ํ™œ๋™ ๊ธฐ๋ก</a>
                                </li>
                                <li class="nav-item active">
                                    <a class="nav-link" href="community.html">๊ฒŒ์‹œํŒ
                                        <span class="sr-only">(current)</span>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="https://open.kakao.com/o/sIllhT5f">๊ฐ€์ž… ๋ฌธ์˜</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" href="#">
                                        <i class="fa fa-user" aria-hidden="true"></i>
                                        Login</a>
                                </li>
                                <form class="form-inline">
                                    <button class="btn  my-2 my-sm-0 nav_search-btn" type="submit">
                                        <i class="fa fa-search" aria-hidden="true"></i>
                                    </button>
                                </form>
                            </ul>
                        </div>
                    </nav>
                </div>
            </header>
            <!-- end header section -->
        </div>

    <!-- community section -->
    
    <section class="community_section layout_padding">
        <div class="community_container">
            <div class="cotainer">
                <div class="heading_container heading_center">
                    <h2>
                        ARGOS <span>COMMUNITY</span>
                    </h2>
                    <p>
                        Hack the world for everyone
                    </p>
                </div>
                
                <div class="community_board_wrap">
                    <div>
                        <div class="community_board">
                            <div class="title">
                                <a href="notice_list.html" class="name">๊ณต์ง€์‚ฌํ•ญ</a>
                                <a href="notice_list.html" class="more"><img src="images/right_arrow.png" alt="๋”๋ณด๊ธฐ"></a>
                            </div>
                            <div class="list">
                                <ul>
                                    <li>
                                        <a href="notice_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                    <li>
                                        <a href="notice_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                    <li>
                                        <a href="notice_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                    <li>
                                        <a href="notice_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                    <li>
                                        <a href="notice_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="community_board">
                            <div class="title">
                                <a href="welcome_list.html" class="name">๊ฐ€์ž…์ธ์‚ฌ</a>
                                <a href="welcome_list.html" class="more"><img src="images/right_arrow.png" alt="๋”๋ณด๊ธฐ"></a>
                            </div>
                            <div class="list">
                                <ul>
                                    <li>
                                        <a href="welcome_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                    <li>
                                        <a href="welcome_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                    <li>
                                        <a href="welcome_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                    <li>
                                        <a href="welcome_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                    <li>
                                        <a href="welcome_view.html">๊ธ€ ์ œ๋ชฉ์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค.</a>
                                        <span>2003.06.25</span>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="btn-box">
                    <a href="welcome_write.html">
                        Write
                    </a>
                </div>

            </div>
        </div>
    </section>


    <!-- end community section -->

    <!-- info section -->

    <section class="info_section layout_padding2">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-lg-3 info_col">
                    <div class="info_contact">
                        <h4>
                            Address
                        </h4>
                        <div class="contact_link_box">
                            <a href="https://map.naver.com/p/entry/place/21033930?c=15.00,0,0,0,dh" target="_blank">
                                <i class="fa fa-map-marker" aria-hidden="true"></i>
                                <span>
                                    ๋Œ€์ „๊ด‘์—ญ์‹œ ์œ ์„ฑ๊ตฌ ๋Œ€ํ•™๋กœ 99 (์ถฉ๋‚จ๋Œ€ํ•™๊ต) ๊ณต๊ณผ๋Œ€ํ•™ 5ํ˜ธ๊ด€
                                </span>
                            </a>
                            </a>
                            <a href="">
                                <i class="fa fa-envelope" aria-hidden="true"></i>
                                <span>
                                    we.represent.argos@gmail.com
                                </span>
                            </a>
                        </div>
                    </div>
                    <div class="info_social">
                        <a href="">
                        <i class="fa fa-facebook" aria-hidden="true"></i>
                        </a>
                        <a href="https://www.instagram.com/cnu_argos/" target="_blank">
                            <i class="fa fa-instagram" aria-hidden="true"></i>
                        </a>
                    </div>
                </div>
                <div class="col-md-6 col-lg-2 mx-auto info_col">
                    <div class="info_link_box">
                        <h4>
                            Links
                        </h4>
                        <div class="info_links">
                            <a class="active" href="index.html">
                                Home
                            </a>
                            <a class="" href="education.html">
                                ๊ต์œก ํ™œ๋™
                            </a>
                            <a class="" href="history.html">
                                ํ™œ๋™ ๊ธฐ๋ก
                            </a>
                            <a class="" href="https://open.kakao.com/o/sIllhT5f">
                                ๊ฐ€์ž… ๋ฌธ์˜
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- end info section -->

    <!-- jQery -->
    <script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
    <!-- popper js -->
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous">
    </script>
    <!-- bootstrap js -->
    <script type="text/javascript" src="js/bootstrap.js"></script>
    <!-- owl slider -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js">
    </script>
    <!-- custom js -->
    <script type="text/javascript" src="js/custom.js"></script>
    <!-- Google Map -->
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCh39n5U-4IoWpsVGUHWdqB6puEkhRLdmI&callback=myMap">
    </script>
    <!-- End Google Map -->

</body>
</html>

 

/* style.css */

.community_board_wrap {
  padding: 50px 0;
  background: #fff;
}

.community_board_wrap > div {
  width: 90%;
  min-width: 1000px;
  max-width: 1200px;
  margin: 0 auto;
  font-size: 0;
}

.community_board {
  display: inline-block;
  width: 48%;
  border: 2px solid #00bbf0;
  border-radius: 20px;
}

.community_board a {
  color: #000;
}

.community_board a:hover {
  font-weight: 600;
}

.community_board_wrap > div > div:nth-child(even) {
  margin-left: 4%;
}

.community_board .title {
  position: relative;
  padding: 20px;
  margin-left: 10px;
}

.community_board .title a {
  display: inline-block;
  vertical-align: middle;
  color: #00bbf0;
}

.community_board .title a:hover {
  color: #007fa4;
}

.community_board .name {
  font-size: 30px;
  font-weight: 600;
  letter-spacing: -1px;
}

.community_board .more {
  position: absolute;
  top: 15px;
  right: 30px;
}

.community_board .more img {
  width: 50px;
}

.community_board .list {
  border-top: 1px solid #66addb;
  padding: 20px;
}

.community_board .list ul li {
  margin-top: 10px;
  font-size: 0;
}

.community_board .list ul li:first-child {
  margin-top: 0;
}

.community_board .list a,
.community_board .list span {
  display: inline-block;
  vertical-align: middle;
}

.community_board .list a {
  width: 80%;
  text-align: left;
  margin-left: -30px;
  font-size: 14px;
}

.community_board .list span {
  width: 20%;
  text-align: right;
  margin-left: 10px;
  font-size: 12px;
  color: #777;
}

.community_section .btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 45px;
}

.community_section .btn-box a {
  display: inline-block;
  padding: 10px 45px;
  background-color: #00bbf0;
  color: #ffffff;
  border-radius: 5px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  border: none;
}

.community_section .btn-box a:hover {
  background-color: #007fa4;
}