<!-- color animate -->
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<script type="text/javascript">
    var crud = {};
</script>
<script type="text/javascript" src="<?= WEVEN_ASSET_WEB_PATH ?>js/bm2/crud/admin/CrudList.js"></script>
<script type="text/javascript">
    crud.list = new CrudList();

    $(function(){
        $('#familySite').change(function(){
            var selectedVal = $(this).val();
            if(selectedVal != ''){
                window.open("about:blank").location.href = selectedVal;
            }
        })
    })

</script>

<style>
    .main_visual_wrap .main_visual_title .font_helve{line-height: 0;}
    .main_visual_wrap .main_visual_desc .font_helve{line-height: 0;}

    .event_info_list_con{}
    .event_info_list{overflow: hidden; font-size:0px; font-size:0rem; line-height:0px; line-height:0.0rem; margin-bottom: 30px;}
    .event_info_list:last-child{margin-bottom: 0 !important;}
    .event_info_list .event_info_title{font-size:25px; font-size:2.5rem; line-height:31px; line-height:3.1rem; letter-spacing: -0.06em; font-weight: 700; color:#000; margin-bottom: 15px;}
    .event_info_list .event_info{}
    .event_info_list .event_info > span{font-size:40px; font-size:4.0rem; line-height:46px; line-height:4.6rem; letter-spacing: -0.06em; font-weight: 700; color:#000;}
    .event_info_list .event_info .font_helve{letter-spacing: -0.02em; font-weight: 500;}

    .reservation{padding-bottom: 250px;}
    .reservation .common_title_con{margin-bottom: 70px;}
    .reservation .consulting_title_con{margin-bottom: 50px;}
    .consulting_title{font-size: 60px; font-size: 6.0rem; line-height: 80px; line-height: 8.0rem; font-weight: 700; word-break: keep-all;}
    .consulting_desc{font-size: 27px;  font-size: 2.7rem;  line-height: 44px;  line-height: 4.4rem;  letter-spacing: -0.02em;  font-weight: 400;  color: #000;  word-break: keep-all;}

    .btn_style_0_con{font-size:0; line-height:0; text-align: center; display: inline-flex; align-items: center; justify-content: center;  width:200px; height:200px; border-radius:50%; overflow: hidden; background-color:#000;}
    .btn_style_0_con .btn_style_0{text-align: center; box-sizing: border-box; }
    .btn_style_0_con .btn_style_0 span.text{font-size:28px; font-size:2.8rem; line-height:38px; line-height:3.8rem; letter-spacing: -0.06em; color:#ffdf5d; font-weight:700;
        display:block; margin-bottom:15px;}
    .btn_style_0_con .btn_style_0 span.arrow{display:block;}

    .site_btn_con{position: fixed; z-index: 10; right: 33px; bottom:63px;}
    .site_btn_con .site_btn{display: inline-block; text-align: center;}
    .site_btn_con .site_btn img{width: 30px;}
    
    @media all and (min-width: 992px){
        .site_btn_con{right: 55px; bottom:90px;}
        .site_btn_con .site_btn img{width: auto;}    
    }

    @media all and (min-width: 1200px){
        .site_btn_con{right: 105px; bottom:140px;}
    }
    
    @media all and (min-width: 1920px){
        .event_info_list{margin-bottom: 13px;}
        .event_info_list .event_info_title{float: left; min-width: 180px; font-size:41px; font-size:4.1rem; line-height:47px; line-height:4.7rem; margin-bottom: 0; margin-right: 22px; margin-top: 1px;}
        .event_info_list .event_info{overflow: hidden;}
        .event_info_list .event_info > span{font-size:41px; font-size:4.1rem; line-height:50px; line-height:5.0rem;}
        .event_info_list .event_info > span.font_helve{font-size:44px; font-size:4.4rem;}
    }

    @media all and (min-width: 2300px){
        .site_btn_con{right: calc((100% - 2100px) / 2 + 5px ); bottom:260px;}
    }
</style>

<!--header-->
<div class="col-12 header_wrap">
    <div class="col-12 col-center mw-2300">
        <div class="col-12 pr20 pl20 pr-md-50 pl-md-50 pr-lg-100 pl-lg-100">
            <div class="col-12 header_con">
                <div class="col-0 logo_con">
                    <a href="[WEB_ROOT]" class="logo">
                        <img src="[RESOURCE::img/logo.png]" alt="WEBEES">
                    </a>
                </div>
                <div class="col-0 fontsize0 family_site_con">
                    <div class="show vm mr25 family_site_title">
                        <span class="font_helve">Family Site</span>
                    </div>
                    <div class="show vm">
                        <select name="family_site" id="familySite">
                            <option value="">패밀리 사이트</option>
                            <option value="https://www.webees.kr/">웨비즈 대표 웹사이트</option>
                            <option value="http://wbuilder.co.kr/app_wbuilder/">스마트 에디터 웹사이트</option>
                            <!--
                            <option value="http://www.bluestream.co.kr/">블루스트림 웹사이트</option>
                            <option value="http://wlabs.co.kr/">블루스트림 랩 웹사이트</option>
                            -->
                        </select>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="col-12 popup_wrap" id="requestPop">
    <div class="col-12 fr popup_con">
        <div class="col-12 tr popup_close_btn_con">
            <a href="javascript:scrollPopupEvent.closePopup('#requestPop');" class="show popup_close_btn">
                <img src="[RESOURCE::img/popup_close_icon.png]" alt="상담예약 닫기">
            </a>
        </div>
        <div class="col-12 popup_contents_con scroll_con" data-mcs-theme="my-theme">
            <div class="col-12 pb150 pb-md-80 pr20 pr-md-120 pl20 pl-md-120">
                <div class="mb55 mb-md-73 popup_title">
                    <h3 class="mb25 mb-md-41">상담예약</h3>
                    <div class="mb10 mb-md-13 h_subtitle3">
                        웨비즈 웹사이트 제작에 관련해서 궁금하신점이 있으세요?
                    </div>
                    <div class="h_desc3">
                        전화번호 또는 카카오톡 아이디만 남겨주시면 빠른시간안에 답변드리겠습니다.<br>
                        빠른 상담을 원하시면 <span class="point0 font_helve">02.2025.4322</span>로 연락주세요.
                    </div>
                </div>
                <form class="mb60 mb-md-86 popup_form" action="[WEB_ROOT]request_manage/mergeData.json" method='post' name="crud_merge" enctype="multipart/form-data">
                    <div class="popup_form_input_con">
                        <input type="text" class="popup_form_input font_helve" name="tel" id="popup_tel" placeholder="전화번호 또는 카카오톡 아이디를 입력해주세요.">
                        <label for="popup_tel"></label>
                        <a href="javascript:void(0)" onclick="sendData();" class="popup_form_submit">
                            상담예약
                        </a>
                    </div>
                </form>
                <div class="col-12 contact_item_con">
                    <div class="col-12 mb45 mb-md-55 contact_item">
                        <div class="col-0 mr30 mr-md-40 contact_icon">
                            <img src="[RESOURCE::img/navertalk.png]" alt="네이버 톡톡">
                        </div>
                        <div class="over-hidden contact_text">
                            <div class="mb13 title">
                                네이버 톡톡
                            </div>
                            <div class="mb8 desc">
                                네이버 톡톡을 활용하여 웨비즈에 궁금하신 사항이나<br class="hidden show-md"/> 질문을 남겨주세요.
                            </div>
                            <!-- Talk Talk Banner Script start -->
                            <script type="text/javascript" src="https://partner.talk.naver.com/banners/script"></script>
                            <div class="talk_banner_div"  ></div>
                            <!-- Talk Talk Banner Script end -->
                            <a href="javascript:void(0)" onclick="javascript:window.open('http://talk.naver.com/w4xv8v?ref=http%3A%2F%2Fwebees.com%2Fpage%2Fservice', 'talktalk', 'scrollbars=1, resizable=1, width=486, height=745');return false;" class="show">
                                <div class="col-0 pr69 button">
                                    상담하기
                                    <hr class="button_line">
                                    <div class="bottom_bg_box"></div>
                                    <div class="top_bg_box"></div>
                                    <div class="arrow"></div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="col-12 contact_item">
                        <div class="col-0 mr30 mr-md-40 contact_icon">
                            <img src="[RESOURCE::img/kakao.png]" alt="카카오 플러스 친구">
                        </div>
                        <div class="over-hidden contact_text">
                            <div class="mb10 title">
                                카카오 플러스 친구
                            </div>
                            <div class="mb14 desc">
                                카카오 플러스 친구를 활용하여 웨비즈에 궁금하신 사항이나<br class="hidden show-md"/> 질문을 남겨주세요.
                            </div>
                            <div class="button">플러스 친구 아이디 <span class="point0 font_helve">webees</span></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="col-12 request_pop_dim"></div>

<!--main_visual_wrap-->
<div class="col-12 mb100 mb-md-120 main_visual_wrap">
    <div class="col-12 col-center mw-2300">
        <div class="col-12 pr20 pl20 pr-md-50 pl-md-50 pr-lg-100 pl-lg-100">
            <div class="col-12 mb40 main_visual_title_con">
                <div class="mb81 landing_btn_style_0_con">
                    <div class="tc landing_btn_style_0" style="width: 150px;">
                        웨비즈 이벤트
                    </div>
                </div>
                <div class="col-12 mb25 main_visual_title">
                    <div>웨비즈 오픈기념</div>
                    <div class="point0">
                        홈페이지 제작비용 <span class="font_helve fontweight500">50%</span> 할인 이벤트!
                    </div>
                </div>
                <div class="col-12 main_visual_desc">
                    <div>
                        스마트에디터 기반 신개념 웹제작 서비스 웨비즈가 오픈기념으로<br/>
                        웹사이트 <span class="fontweight500">제작비용을 <span class="font_helve">50%</span> 할인</span>해주는 <span class="fontweight500">기간한정 이벤트</span>를 진행합니다.<br/>
                        이벤트에 참여해 제작비용 <span class="fontweight500"><span class="font_helve">49</span>만원</span>으로 나만의 반응형 홈페이지를 제작하세요.
                    </div>
                </div>
            </div>
            <ul class="col-12 event_info_list_con">
                <li class="event_info_list">
                    <div class="event_info_title">
                        이벤트기간
                    </div>
                    <div class="event_info">
                        <span class="font_helve">2020</span><span>년 </span><span class="font_helve">05</span><span>월 </span> <span class="font_helve">17</span><span>일 </span><span class="font_helve">24:00</span><span>까지</span>
                    </div>
                </li>
                <li class="event_info_list">
                    <div class="event_info_title">
                        참여방법
                    </div>
                    <div class="event_info">
                        <span>이벤트기간 내 상담예약 신청</span>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>

<!--section-->
<div class="col-12 section reservation">
    <div class="col-12 col-center mw-2300">
        <div class="col-12 pr20 pl20 pr-md-50 pl-md-50 pr-lg-100 pl-lg-100">
            <div class="col-12">
                <div class="col-12 common_title_con">
                    <div class="line_over_hidden_box">
                        <div class="common_title_line"></div>
                    </div>
                    <div class="text_over_hidden_box">
                        <div class="common_title">
                            <span>상세히 상담해드리겠습니다!</span>
                        </div>
                    </div>
                </div>
                <div class="col-12 tc consulting_con">
                    <div class="col-12 consulting_title_con">
                        <div class="mb25 consulting_title point0">
                            지금 바로 상담예약을 진행하세요!
                        </div>
                        <div class="consulting_desc">
                            웹제작과 관련해서 궁금하시거나 상담이 필요하시면<br/>
                            웨비즈 전문 컨설턴트가 언제든 도와드리겠습니다.
                        </div>
                    </div>
                    <div class="col-12 tc">
                        <div class="show vm mr25 btn_style_0_con">
                            <a href="javascript:scrollPopupEvent.onOpenPopup('#requestPop');" class="btn_style_0">
                                <span class="text">
                                    간편<br/>
                                    상담신청
                                </span>
                                <span class="arrow">
                                    <img src="[RESOURCE::img/landing/btn_style_0_arrow.png]" alt="상담신청">
                                </span>
                            </a>
                        </div>
                        <div class="show vm btn_style_0_con">
                            <a href="[WEB_ROOT]" class="btn_style_0">
                                <span class="text">
                                    대표사이트<br/>
                                    바로가기
                                </span>
                                <span class="arrow">
                                    <img src="[RESOURCE::img/landing/btn_style_0_arrow.png]" alt="대표사이트 바로가기">
                                </span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!--site btn-->
<div class="col-0 site_btn_con">
    <a href="[WEB_ROOT]" class="site_btn" id="moveToWebeesBtn">
        <img src="[RESOURCE::img/landing/webees_symbol.png]" alt="webees">
    </a>
</div>

<!--top btn-->
<div class="col-0 top_btn_con">
    <a href="javascript:void(0)" class="top_btn" id="moveToTopBtn">
        <img src="[RESOURCE::img/landing/top_btn_arrow.png]" alt="top">
    </a>
</div>