관리 메뉴

moozi

안랩 index.html 본문

TIS_2016/주말반_5기

안랩 index.html

moozi 2016. 12. 17. 18:28

<!DOCTYPE html>

<html lang="ko">

<head>

    <meta charset="UTF-8">

    <title>안전해서 더욱 자유로운 세상 | AhnLab</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <style>

        .navbar-brand img{

            position: absolute;

            top:0;

            left:0;

        }

        .navbar-default {

            background-color: white;

            border-color: #e7e7e7;

        }

        .carousel-caption{

            color:#318BC9;            

            text-shadow: none;

            position: absolute;

            left:-170px;

            top:70px;

        }

        .bg1{

            background-color: #4E5A61;

            color:#dddddd;

        }

        .thumbnail{

            box-shadow: 5px 5px 5px darkgray;

        }

        footer{

            background-color: gray;

            padding:50px;

        }

        #myCarousel{

            padding-top:50px;

        }

        .topPadding{

            padding-top:100px;

        }

        @media screen and (max-width:767px){

            .carousel-inner img{

                height:300px !important;

            }

            

            .carousel-caption{

              position: absolute;

              left:100px;

              top:150px;             

            }

            

            .carousel-caption h2{

                font-size: 20px;

            }

            

            .carousel-caption p{

                display: none;

            }

            

            .topPadding2{

                padding-top: 50px;

            }

        }

 

    </style>

     <script type="text/javascript">

        // iframe resize. 서버에서만 동작. 게시판과 같은 도메인서만 동작.

        function autoResize(i)

        {

            (i).height=0;

            var iframeHeight=

            (i).contentWindow.document.body.scrollHeight;

            (i).height=iframeHeight+20;

        }

     </script>

     <script>

    $(document).ready(function(){

      // Add smooth scrolling to all links in navbar + footer link

      $(".navbar a, footer a[href='#myPage']").on('click', function(event) {


      // Make sure this.hash has a value before overriding default behavior

      if (this.hash !== "") {


        // Prevent default anchor click behavior

        event.preventDefault();


        // Store hash

        var hash = this.hash;


        // Using jQuery's animate() method to add smooth page scroll

        // The optional number (900) specifies the number of milliseconds it takes to scroll to the specified area

        $('html, body').animate({

          scrollTop: $(hash).offset().top

        }, 900, function(){


          // Add hash (#) to URL when done scrolling (default click behavior)

          window.location.hash = hash;

          });

        } // End if 

      });

    

//      $('.nav a').on('click', function(){

//          //탭을 클릭한 경우는 실행안함.

//          if($(this).is('.nav-tabs a')){

//              return;

//          }

//          $('.btn-navbar').click(); //bootstrap 2.x

//          $('.navbar-toggle').click() //bootstrap 3.x by Richard

//      });

    });

    </script>

</head>

<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="50">

     <nav class="navbar navbar-default navbar-fixed-top">

      <div class="container-fluid">

        <div class="navbar-header">

          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span> 

          </button>

          <a class="navbar-brand" href="#myPage">

            <img src="img/logo.png" alt="로고">

            </a>

        </div>

        <div class="collapse navbar-collapse" id="myNavbar">

          <ul class="nav navbar-nav navbar-right">

            <li><a href="#notice">Notice</a></li>

            <li><a href="#product">제품소개</a></li>

            <li><a href="#map">오시는길</a></li>

            <li><a href="#board">Board</a></li>

          </ul>

        </div>

      </div>

    </nav>

    <div id="myCarousel" class="carousel slide" data-ride="carousel">

      <!-- Indicators -->

      <ol class="carousel-indicators">

        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>

        <li data-target="#myCarousel" data-slide-to="1"></li>

        <li data-target="#myCarousel" data-slide-to="2"></li>

      </ol>


      <!-- Wrapper for slides -->

      <div class="carousel-inner" role="listbox">

        <div class="item active">

          <img src="img/title01.jpg" alt="타이틀1">

          <div class="carousel-caption">

            <h3>랜섬웨어의 모든것</h3>

            <p>어느 누구 보다 체계화된 정보</p>

          </div> 

        </div>


        <div class="item">

          <img src="img/title02.jpg" alt="타이틀2">

          <div class="carousel-caption">

            <h3>기대를 앞지른 진화</h3>

            <p>하이엔드급 지능형 위협대응 솔루션</p>

          </div> 

        </div>


        <div class="item">

          <img src="img/title03.jpg" alt="타이틀3">

          <div class="carousel-caption">

            <h3>상반기 키워드는 랜섬웨어 표적공격</h3>

            <p>보안위협 2016년 상반기 결산</p>

          </div> 

        </div>

      </div>


      <!-- Left and right controls -->

      <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">

        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>

        <span class="sr-only">Previous</span>

      </a>

      <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">

        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>

        <span class="sr-only">Next</span>

      </a>

    </div>

    

    <div class="bg1 topPadding" id="notice">

        <div class="container">

            <div class="row">

            <div class="col-md-3 col-sm-3 text-center">

                <h3>보안경보</h3>

                <img src="img/icon01.png" alt="보안경보">

            </div>

            <div class="col-md-6 col-sm-6">

               <h3 class="text-center topPadding2">Notice/Press</h3> 

                <ul class="nav nav-tabs">

                  <li class="active">

                      <a data-toggle="tab" href="#notice">Notice</a>

                  </li>

                  <li>

                      <a data-toggle="tab" href="#press">Press</a>

                  </li>

                </ul>


                <div class="tab-content">

                  <div id="notice" class="tab-pane fade in active">


                    [공지] AhnLab Safe Transaction 패치 안내2016.12.13<br>

                     [공지] V3 제품군(개인용/기업용) 12월..2016.12.05<br>

                     [공지] 안랩닷컴 보안 인증서 업그레이드 (11/15)2016.11.07<br>

                  </div>

                  <div id="press" class="tab-pane fade">


                    안랩, 한화S&amp;C ‘혼 클라우드(HONE Cloud..2016.12.01<br>

                     안랩, SW 코딩강사 교육 프로그램 ‘안..2016.12.01<br>

                     안랩, 미래학자 정지훈 교수 초청 특강 진행2016.12.0

                  </div>

                </div>


            </div>

            <div class="col-md-3 col-sm-3">

               <h3 class="topPadding2">V3 365클리닉</h3>

                <div class="row">

                    <div class="col-md-7">

                        V3 365 클리닉은 통합 보안부터

                        전문 클리닉 서비스까지

                        프리미엄 PC 보안 및

                        토털 PC 케어를 제공합니다.                    

                    </div>

                    <div class="col-md-5">

                        <img src="img/icon02.png"  style="width:100px;margin-top:20px;margin-left:-20px;"alt="제품이미지">

                    </div>

                </div>

            </div>

        </div>    

        </div>

    </div>

    

    <div class="container topPadding" id="product">

        <div class="row text-center">

        <h3>Product</h3>

          <div class="col-sm-3">

            <div class="thumbnail">

              <img src="img/product01.png" alt="제품1">

              <p><strong>MDS</strong></p>

              <p>지능형 위협 대응 솔루션</p><br>        

              <button class="btn btn-primary" data-toggle="modal"  data-target="#myModal">more</button>

                  <!-- Modal -->

                <div class="modal fade" id="myModal" role="dialog">

                  <div class="modal-dialog">


                    <!-- Modal content-->

                    <div class="modal-content">

                      <div class="modal-header">

                        <button type="button" class="close" data-dismiss="modal">&times;</button>

                        <h4><span class="glyphicon glyphicon-leaf"></span> MDS</h4>

                      </div>

                      <div class="modal-body">

                        <h4>AhnLab MDS는

                        '악성 파일 수집-분석-모니터링- 대응'의 종합 프로세스를 통해 APT(Advanced Persistent Threat) 등의 지능형 위협을 효과적으로 방어합니다.


                        </h4>

                        <img src="img/mds01.jpg" width="100%" alt="mds">

                      </div>

                      <div class="modal-footer">

                        <a href="http://download.ahnlab.com/kr/site/brochure/MDS_Brochure_kr.pdf" class="btn btn-danger">more</a>

                      </div>

                    </div>

                  </div>

                </div>

            </div>

          </div>

          <div class="col-sm-3">

            <div class="thumbnail">

              <img src="img/product02.png" alt="제품2">

              <p><strong>V3 Internet Security 9.0</strong></p>

              <p>진단율, 속도, 사전 방역까지 '차원'이 다르다! </p>

              <button class="btn btn-primary" data-toggle="modal"  data-target="#myModal2">more</button>

               <!-- Modal -->

                <div class="modal fade" id="myModal2" role="dialog">

                  <div class="modal-dialog">


                    <!-- Modal content-->

                    <div class="modal-content">

                      <div class="modal-header">

                        <button type="button" class="close" data-dismiss="modal">&times;</button>

                        <h4><span class="glyphicon glyphicon-leaf"></span> V3 Internet Security 9.0</h4>

                      </div>

                      <div class="modal-body">

                        <h4>기업용 통합 PC 보안 솔루션 AhnLab V3 Internet Security 9.0은

                        다차원 분석 플랫폼을 통해 다양한 보안 위협으로부터

                        기업의 클라이언트 PC를 안전하게 보호하며, 사전 방역 기능을 제공해

                        안전한 컴퓨팅 환경 구축에 기여합니다.


                        </h4>

                        <img src="img/v3security01.jpg" width="100%" alt="mds">

                      </div>

                      <div class="modal-footer">

                        <a href="http://download.ahnlab.com/kr/site/brochure/Brochure_V3%20Internet%20Security%209.0.pdf" class="btn btn-danger">more</a>

                      </div>

                    </div>

                  </div>

                </div>

              

            </div>

          </div>

          <div class="col-sm-3">

            <div class="thumbnail">

              <img src="img/product03.png" alt="제품3">

              <p><strong>간편인증</strong></p>

              <p>보안성과 편의성의 공존을 실현하다</p>

              <button class="btn btn-primary">more</button>

            </div>

          </div>

          <div class="col-sm-3">

            <div class="thumbnail">

              <img src="img/product04.png" alt="제품4">

              <p><strong>V3 365 클리닉</strong></p>

              <p>빠르다, 가볍다, 스마트하다!</p><br>

              <button class="btn btn-primary">more</button>

            </div>

          </div>

        </div>

    </div>

    

    <div class="container topPadding" id="map">

        <h3 class="text-center">오시는 길</h3>

        <div id="googleMap" style="width:100%;height:400px;"></div>


        <!-- Add Google Maps -->

        <script src="http://maps.googleapis.com/maps/api/js"></script>

        <script>

        var myCenter = new google.maps.LatLng(37.400227, 127.110805);


        function initialize() {

        var mapProp = {

        center:myCenter,

        zoom:16,

        scrollwheel:true,

        draggable:true,

        mapTypeId:google.maps.MapTypeId.ROADMAP

        };


        var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);


        var marker = new google.maps.Marker({

        position:myCenter,

        });


        marker.setMap(map);

        }


        google.maps.event.addDomListener(window, 'load', initialize);

        </script>


    </div>

    

    <div class="container topPadding" id="board">

        <h3 class="text-center">BOARD</h3>

        <iframe id="iframe1" src="http://pjs.dothome.co.kr/g5/bbs/board.php?bo_table=board01" width="100%" onload="autoResize(this)" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>

    </div>

    <footer class="text-center">

      <a class="up-arrow" href="#myPage" data-toggle="tooltip" title="TO TOP"><span class="glyphicon glyphicon-chevron-up"></span></a><br><br>

      <p>&copy;AhnLab. All rights resereved.</p> 

    </footer>

    

</body>

</html>

'TIS_2016 > 주말반_5기' 카테고리의 다른 글

join.html  (0) 2016.12.10
index.html  (0) 2016.12.10
bootstrap navbar 클릭시 닫히게 하기  (0) 2016.12.10
company.zip  (0) 2016.12.10
movie.zip  (0) 2016.12.03
Comments