MOBILE

사이트 바로가기

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta name="description" content="웹 퍼블리셔를 위한 정보 공유 사이트입니다.">
    <meta name="keywords" content="웹스토리보이,웹퍼블리셔,웹표준,웹접근성">  
    <title>경주월드</title>
    
    <!-- style -->
    <link rel="stylesheet" href="assets/css/reset.css">
    <link rel="stylesheet" href="assets/css/style.css">
    <link rel="stylesheet" href="assets/css/unslider.css">
    <link rel="stylesheet" href="assets/css/unslider-dots.css">
    
    <!-- icon -->
    <link rel="shortcut icon" href="assets/img/gw_72.png">
    <link rel="apple-touch-icon" href="assets/ico/icon_60.png">
	<link rel="apple-touch-icon" sizes="76x76" href="assets/img/gw_72.png"> 
	<link rel="apple-touch-icon" sizes="120x120" href="assets/img/gw_114.png"> 
	<link rel="apple-touch-icon" sizes="152x152" href="assets/img/gw_144.png"> 
   
    
    <!-- script -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="assets/js/unslider-min.js"></script>
    <script src="//stephband.info/jquery.event.move/js/jquery.event.move.js"></script>
    <script src="//stephband.info/jquery.event.swipe/js/jquery.event.swipe.js"></script>
    <script>
		jQuery(document).ready(function($) {
			$('.slider').unslider({
                autoplay: true,
                delay: 3000,
                speed: 500
            });
		});
	</script>
</head>
<body>
        <header>
            <h1><img src="assets/img/h1_logo.png" alt="경주월드" width="156"></h1>
         <nav>
            <ul class="clearfix">
                <li>
                    <a href="amuse.html">
                        <img src="assets/img/nav1.png" alt="경주월드 바로가기" width="88">
                    </a>
                </li>
                <li>
                    <a href="california.html">
                        <img src="assets/img/nav2.png" alt="캘리포니아비치 바로가기" width="88">
                    </a>
                </li>
                <li>
                    <a href="serabal.html">
                        <img src="assets/img/nav3.png" alt="서라벌청소년수련원 바로가기" width="88">
                    </a>
                </li>
            </ul>
        </nav>
            
        </header>
        <section id="contents">
           <div class="banner">
               <img src="assets/img/ban1.png" alt="Fun & Splash">
           </div>
           <!-- //banner -->
           <div class="event">
               <h3><span><img src="assets/img/event2.png" alt="event" width="52"></span></h3>
               <div class="slider">
                   <ul>
                       <li><a href="#"><img src="assets/img/slider1.png" alt="배너1"></a></li>
                       <li><a href="#"><img src="assets/img/slider2.png" alt="배너2"></a></li>
                       <li><a href="#"><img src="assets/img/slider3.png" alt="배너3"></a></li>
                   </ul>
               </div>
           </div>
           <!-- //event -->
           
           <div class="notice">
               <ul>
                   <li><a href="#">2017년 7월 24일 운영시간</a></li>
               </ul>
               <span class="more"><a href="#"><img src="assets/img/more.png" alt="더보기" width="31"></a></span>
               
           </div>
            <!-- //notice -->
        </section>
        <footer>
            <a href="#"><img src="assets/img/footer1.png" alt="운영시간" width="63"></a>
            <a href="#"><img src="assets/img/footer2.png" alt="오시는 길" width="63"></a>
            <a href="#"><img src="assets/img/footer3.png" alt="피시버전" width="63"></a>
            <address>
                Copyright © 2017 Gyeongju World Resort <br>All Right Reserved
            </address>
            
        </footer>
</body>
</html>

					
/* row */
.row{
    padding: 25px 15px;
}

/* header */
header { }
header h1 {
    background: url(../img/h1_bg1.gif) repeat-x; 
    text-align: center; 
    padding-top: 3px; 
    height: 40px;
}
header{
    position: relative;
}
header.amuse h1{
    background: url(../img/h1_bg4.gif) repeat-x;
    padding-top: 10px;
    height: 33px;
}
header.california h1{
    background: url(../img/h1_bg3.gif) repeat-x;
    padding-top: 10px;
    height: 33px;
}

header.serabal h1{
    background: url(../img/h1_bg5.gif) repeat-x;
    padding-top: 10px;
    height: 33px;
}
header .left{
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 6px;
    margin-left: 10px;
}
header .right{
    position: absolute;
    top: 0;
    right: 0;
    margin-top: 6px;
    margin-right: 10px;
}

/* nav */
nav {
    background: url(../img/h1_bg2.gif);
    height: 81px;
}
nav li {
    float: left; 
    width: 33.3333%; 
    text-align: center; 
    padding-top: 7px; 
    background: url(../img/h1_bar.gif) no-repeat right top;
}
nav li:last-child{background: none;}

/* banner */
.banner img{
    width: 100%;
    display: block;
}
/* event */
.event {position: relative;}
.event h3 {background: url(../img/menu_bg.gif) repeat-x; height: 30px; margin-bottom: 20px;}
.event h3 span {background: #fff; display: inline-block; padding: 5px 30px; border-radius: 5px 5px 0 0; position: absolute; left: 50%; top: 10px; margin-left: -150px; }
.event .slider {text-align: center; padding: 10px 10px 25px 10px;}
.event .slider img {max-width: 300px; width: 100%;}
.event .unslider-nav {position: absolute; left: 50%; top: 15px; background: none; margin-left: -30px; }
/* event */
/*
.event {}
.event h3 {
    background: url(../img/menu_bg.gif) repeat-x; height: 30px;
    margin-bottom: 20px;

}
.event h3 span{
    background: #fff;
    display: inline-block;
    padding: 5px 30px;
    border-radius: 5px 5px 0 0;
    margin-left: 10%;
    position: absolute;
    left: 50%;
    top: 10px;
    margin-left: -250px;
}
.event .slider{
    text-align: center;
    padding: 10px 10px 25px 10px;
}
.event .slider img{
    max-width: 300px;
    width: 100%;
}
.event .unslider-nav{
    position: absolute;
    left: 50%;
    top: 15px;
    background: none;
    margin-left: -30px;
}
*/


/* notice */
.notice {
    position: relative;
    background: url(../img/more_bg.gif) repeat-x;
    height: 31px;
}
.notice li {
    background: url(../img/more_btn.png) no-repeat 3px 4px;
    background-size: 23px;
    padding-left: 23px;
}
.notice li a{
    display: block;
    padding: 5px 5px 5px 8px;
}
.notice .more{
    position: absolute;
    right: 9px;
    top: 0;
}
.notice .more a{
    background: url(../img/more_bg_bar.gif) no-repeat left top;
    padding: 9px 5px 4px 20px;
    display: block;
}

/* footer */
footer {
    background: #d1d1d1 url(../img/footer_bg.gif) repeat-x;
    text-align: center;
    padding: 20px 0 20px 0;
}

/* sub-menu */
.sub-menu {
    background: url(../img/menu_bg.gif) repeat-x center top;
    height: 35px;
}
.sub-menu li{
    float: left;
    width: 25%;
    text-align: center;
    padding-top: 10px;
}
.sub-menu.menu02 li{
    float: left;
    width: 50%;
    text-align: center;
    padding-top: 10px;
    
} 
/* table-style1 */

.table-style1{}
.table-style1 table{
    width: 100%;
    text-align: center;
    border-top:2px solid #f03e18;
}
.table-style1 table thead tr th{
    background: #f0f0f0;
    border-bottom: 1px solid #cecece;
    border-right: 1px solid #cecece;
    padding: 10px 12px;
}
.table-style1 table tbody tr th {
    border-bottom: 1px solid #cecece;
    border-right: 1px solid #cecece;
    padding: 10px 12px;
}
.table-style1  table tbody tr td {
    border-bottom: 1px solid #cecece;
    border-right: 1px solid #cecece;
    padding: 10px 12px;
}
.table-style1 table .last{ 
    border-right:0;
}
.table-style1 table .fz10{
    font-size: 10px;
}
.table-style1 table .dash{
    border-bottom-style:dashed;
}
.table-style1 table .pa05{
    padding: 5px 2px;
}
.table-style1 table .sale{
    background: red;
    color: #fff;
}
.table-style1 table .red{
    color: red;
}
.contents .row{
    position: relative;
}
.contents .row a img{
    position: absolute;
    top:55px;
    right: 15px;
    
}
/* check */
.check{position:relative; border:2px solid #f03e18; margin-top:30px; border-radius:10px; }
.check h2{
    height: 35px;
    background-color: #f7f7f7;
    border-radius:10px 10px 0 0; 
    border-bottom: 1px solid #cecece;
}
.check h2 img{
    position: absolute;
    top: 11px;
    left: 11px;
}
.check ul{
    padding: 25px 15px;
}

.check ul li{
    background:url(../img/charge_dot.gif) no-repeat 0px 10px;
    padding: 3px  10px;
    margin-left: 3px;

}

.amusefee  {
    text-align:center; 
    margin-top:20px; 
}
/* table-style1 */
/*
.table-style1 { }
.table-style1 table {width: 100%; text-align: center; border-top:2px solid #f03e18;}
.table-style1 table thead tr th {background: #f0f0f0; border-bottom: 1px solid #cecece; border-right: 1px solid #cecece; padding: 10px 12px}
.table-style1 table tbody tr th {border-bottom: 1px solid #cecece; border-right: 1px solid #cecece; padding: 10px 12px}
.table-style1 table tbody tr td {border-bottom: 1px solid #cecece; border-right: 1px solid #cecece; padding: 10px 12px}
.table-style1 table tbody tr td .last {border-right: 0;}
.table-style1 table tbody tr td .fz10 {font-size: 10px;}
.table-style1 table .dash {border-bottom-style: dashed;}
.table-style1 table .pa05 {padding: 5px 2px;}

.table-style1 table .sale{background: red; color: #fff; }
.table-style1 table .red{color: red;}
*/

/* date */
.date{
    text-align: center;
    margin-top: 20px;
}
.time{
    text-align: center;
    margin-bottom: 20px;
}
.time img{
    vertical-align: -4px;
}

.time span{
    background: url(../img/time_bg.gif) no-repeat;
    color: #fff;
    font-weight: bold;
    width: 136px;
    height: 22px;
    display: inline-block;
    padding-top: 2.2px;
}
/* cal_tit */
.cal_tit {
    position: relative;
    border-top: 1px solid #ccd0d1;
    border-bottom: 1px solid #ccd0d1;
    padding: 7px 0;
    text-align: center;
}
.cal_tit span{
    font-size: 16px;
    font-weight: bold;
    
}
.cal_tit .cal_left{
    position: absolute;
    top: 0px;
    left: 0;
    border-right: 1px solid #ccd0d1;
    width: 60px;;
    height: 100%;

}
.cal_tit .cal_right{
    position: absolute;
    top: 0px;
    right: 0;
    border-left: 1px solid #ccd0d1;
    width: 60px;
    height: 100%;

}
.cal_tit .cal_left img{
    padding-top:13px;
}
.cal_tit .cal_right img{
    padding-top:13px;
}

/* calender */
.calender{
    background-color: #f0f0f0;
    padding: 10px 20px;
}
.calender .cal_season{
    text-align: right;

}
.calender .cal_season img{
    margin-left: 3px;
}

/* table-style2 */
.table-style2 table{
    width: 100%;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;

}
.table-style2 table thead tr th{
    padding: 10px 0px;
    font-weight: bold;

}
.table-style2 table tbody{
    background-color: #fff;
        border: 1px solid #ccd0d1;
}
.table-style2 table tbody tr td{
    padding: 10px 0px;
    border-bottom: 1px solid #ccd0d1;
    border-right: 1px solid #ccd0d1;
}
.table-style2 table tbody .blue{
    background-color: #D9E5FF;
}
.table-style2 table tbody .yellow{
    background-color: #FAF4C0;
}

/*table-style3 */

.table-style3{}
.table-style3 table{
    width: 100%;
    text-align: center;
    border-top:2px solid  #408200;
}
.table-style3 table thead tr th{
    background: #f0f0f0;
    border-bottom: 1px solid #cecece;
    border-right: 1px solid #cecece;
    padding: 10px 12px;
}
.table-style3 table tbody tr th {
    border-bottom: 1px solid #cecece;
    border-right: 1px solid #cecece;
    padding: 10px 12px;
}
.table-style3  table tbody tr td {
    border-bottom: 1px solid #cecece;
    border-right: 1px solid #cecece;
    padding: 10px 12px;
}
.table-style3 table .last{ 
    border-right:0;
}

.check.checkbox02{
    margin-top: 15px;
    margin-bottom: 15px;
    border: 2px solid #408200;
    border-radius: 15px;
}
.check.checkbox02 h2{
    height: 35px;
    background-color: #f7f7f7;
    border-radius:15px 15px 0 0; 
    border-bottom: 1px solid #cecece;
}
.check.checkbox02 ul{
    padding: 5px;
}

.reservation li em{
    font-weight: bold;
}
.reservation li {
    background: url(../img/charge_dot.gif) no-repeat;
    padding: 3px 0 3px 10px;
    background-position: 0 9px;
}
/*
.check{position:relative; border:2px solid #f03e18; margin-top:30px; border-radius:10px; }
.check h2{
    height: 35px;
    background-color: #f7f7f7;
    border-radius:10px 10px 0 0; 
    border-bottom: 1px solid #cecece;
}
.check h2 img{
    position: absolute;
    top: 11px;
    left: 11px;
}
.check ul{
    padding: 25px 15px;
}

.check ul li{
    background:url(../img/charge_dot.gif) no-repeat 0px 10px;
    padding: 3px  10px;
    margin-left: 3px;

}
*/
		
@charset "UTF-8";

/* 여백 초기화 */
body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,legend,li,ol,p,select,table,td,textarea,th,ul,figure,figcaption{margin:0;padding:0}

/* 테투리 초기화 */
fieldset,img{border:0 none}

/* 리스트 스타일 초기화 */
dl,ul,ol,menu,li{list-style:none}

/* quotes 초기화 */
blockquote, q{quotes: none}
blockquote:before, blockquote:after,q:before, q:after{content:'';content:none}

/* 정렬 초기화 */
input,select,textarea,button{vertical-align:middle}

/* 버튼 초기화 */
button{border:0 none;background-color:transparent;cursor:pointer}

/* 배경 속성 초기화 */
body{background:#fff;direction:ltr;-webkit-text-size-adjust:none}

/* 폰트 초기화 */
body,th,td,input,select,textarea,button{font-size:12px;line-height:1.7;font-family:"나눔 고딕","Nanum Gothic","맑은 고딕","Malgun Gothic",dotum,"돋움",sans-serif;color:#222;}

/* 제목 폰트 초기화 */
h1,h2,h3,h4,h5,h6 {font-size: 12px; font-weight:normal;}

/* 링크 초기화 */
a{color:#222;text-decoration:none}
a:hover{color:#118eff;text-decoration:none}
a:active{background-color:transparent}

/* 폰트 스타일 초기화 */
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal}

/* 반응형 이미지 */
video {width: 100%;}

/* 테이블 초기화 */
table {border-collapse: collapse; border-spacing: 0;}

/* ir 효과 */
.ir {width:0; height:0; overflow:hidden; font-size:0; line-height:0; 
position:absolute; left:0; top:0; }
.ir_pm{display:block;overflow:hidden;font-size:1px;line-height:0;text-indent:-9999px}
.ir_wa{display:block;overflow:hidden;position:relative;width:100%;height:100%;z-index:-1}
.show{display:block}
.hide{display:none}


/* clearfix */
.clearfix {*zoom:1;}
.clearfix:before, .clearfix:after {display: block; content: ''; line-height: 0;}
.clearfix:after {clear: both;}





/* Padding, Margin */
.pt00 {padding-top: 0px !important;}
.pt05 {padding-top: 5px !important;}
.pt10 {padding-top: 10px !important;}
.pt15 {padding-top: 15px !important;}
.pt20 {padding-top: 20px !important;}
.pt25 {padding-top: 25px !important;}
.pt30 {padding-top: 30px !important;}
.pt35 {padding-top: 35px !important;}
.pt40 {padding-top: 40px !important;}
.pt45 {padding-top: 45px !important;}
.pt50 {padding-top: 50px !important;}
.pt55 {padding-top: 55px !important;}
.pt60 {padding-top: 60px !important;}

.pl00 {padding-left: 0px !important;}
.pl05 {padding-left: 5px !important;}
.pl10 {padding-left: 10px !important;}
.pl15 {padding-left: 15px !important;}
.pl20 {padding-left: 20px !important;}
.pl25 {padding-left: 25px !important;}
.pl30 {padding-left: 30px !important;}
.pl35 {padding-left: 35px !important;}
.pl40 {padding-left: 40px !important;}
.pl45 {padding-left: 45px !important;}
.pl50 {padding-left: 50px !important;}
.pl55 {padding-left: 55px !important;}
.pl60 {padding-left: 60px !important;}

.pr00 {padding-right: 0px !important;}
.pr05 {padding-right: 5px !important;}
.pr10 {padding-right: 10px !important;}
.pr15 {padding-right: 15px !important;}
.pr20 {padding-right: 20px !important;}
.pr25 {padding-right: 25px !important;}
.pr30 {padding-right: 30px !important;}
.pr35 {padding-right: 35px !important;}
.pr40 {padding-right: 40px !important;}
.pr45 {padding-right: 45px !important;}
.pr50 {padding-right: 50px !important;}
.pr55 {padding-right: 55px !important;}
.pr60 {padding-right: 60px !important;}

.pb00 {padding-bottom: 0px !important;}
.pb05 {padding-bottom: 5px !important;}
.pb10 {padding-bottom: 10px !important;}
.pb15 {padding-bottom: 15px !important;}
.pb20 {padding-bottom: 20px !important;}
.pb25 {padding-bottom: 25px !important;}
.pb30 {padding-bottom: 30px !important;}
.pb35 {padding-bottom: 35px !important;}
.pb40 {padding-bottom: 40px !important;}
.pb45 {padding-bottom: 45px !important;}
.pb50 {padding-bottom: 50px !important;}
.pb55 {padding-bottom: 55px !important;}
.pb60 {padding-bottom: 60px !important;}

.mt00 {margin-top: 0px !important;}
.mt05 {margin-top: 5px !important;}
.mt10 {margin-top: 10px !important;}
.mt15 {margin-top: 15px !important;}
.mt20 {margin-top: 20px !important;}
.mt25 {margin-top: 25px !important;}
.mt30 {margin-top: 30px !important;}
.mt35 {margin-top: 35px !important;}
.mt40 {margin-top: 40px !important;}
.mt45 {margin-top: 45px !important;}
.mt50 {margin-top: 50px !important;}
.mt55 {margin-top: 55px !important;}
.mt60 {margin-top: 60px !important;}

.ml00 {margin-left: 0px !important;}
.ml05 {margin-left: 5px !important;}
.ml10 {margin-left: 10px !important;}
.ml15 {margin-left: 15px !important;}
.ml20 {margin-left: 20px !important;}
.ml25 {margin-left: 25px !important;}
.ml30 {margin-left: 30px !important;}
.ml35 {margin-left: 35px !important;}
.ml40 {margin-left: 40px !important;}
.ml45 {margin-left: 45px !important;}
.ml50 {margin-left: 50px !important;}
.ml55 {margin-left: 55px !important;}
.ml60 {margin-left: 60px !important;}

.mr00 {margin-right: 0px !important;}
.mr05 {margin-right: 5px !important;}
.mr10 {margin-right: 10px !important;}
.mr15 {margin-right: 15px !important;}
.mr20 {margin-right: 20px !important;}
.mr25 {margin-right: 25px !important;}
.mr30 {margin-right: 30px !important;}
.mr35 {margin-right: 35px !important;}
.mr40 {margin-right: 40px !important;}
.mr45 {margin-right: 45px !important;}
.mr50 {margin-right: 50px !important;}
.mr55 {margin-right: 55px !important;}
.mr60 {margin-right: 60px !important;}

.mb00 {margin-bottom: 0px !important;}
.mb05 {margin-bottom: 5px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb25 {margin-bottom: 25px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb35 {margin-bottom: 35px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb45 {margin-bottom: 45px !important;}
.mb50 {margin-bottom: 50px !important;}
.mb55 {margin-bottom: 55px !important;}
.mb60 {margin-bottom: 60px !important;}