@charset "utf-8";


html, body {position:relative; width:100%; height:100%;}
#wrap {position:relative; width:100%; height:100%;}
.flex {width:100%; max-width:1200px; height:auto; margin:0 auto;}

@media all and (max-width:1280px){
.flex {width:94%;}
}
.f_logo {text-align:center;}


/* 본문바로가기 */
#accessibility {position:relative; width:100%; z-index:1000; overflow:hidden;}
#accessibility a {display:block; width:1px; height:1px; margin:0 -1px -1px 0; font-size:0; line-height:0; overflow:hidden; text-align:center;}
#accessibility a:focus, #skipNavWrap a:hover, #skipNavWrap a:active {width:auto; height:22px; margin:0; padding-top:10px; font-weight:bold; font-size:12px; color:#fff; background:#474747;}



/* header */
#header {background:#fff;}
.header {position:relative; height:105px;}
.header > h1 {width:200px; height:105px; margin:0 auto; padding-top:23px; text-align:center;}
.header > h1 img {width:100%;}
.header > .blog,
.header > .link {display:block; position:absolute;}
.header > .blog {top:37px; left:0; width:140px; height:30px; display:none;}
.header > .link {top:45px; right:0;}
.header > .link > li {float:left; padding:0 20px; background:url('/images/common/top_lnk_bar.png') no-repeat 0 1px;}
.header > .link > li.fst {padding-left:0; background:none;}
.header > .link > li.lst {padding-right:0;}
.header > .link > li > a {display:block;}
.header > .open_mn {display:none; position:absolute; right:0; z-index:1005; background:url('/images/common/bt_menu.png') no-repeat 0 0;}
#header .open_mn.on {background-image:url('/images/common/bt_menu_close.png');}

@media all and (max-width:1024px){
.header {height:95px;}
.header > h1 {width:186px; padding-top:20px;}
.header > .link {display:none;}
.header > .blog,
.header > .open_mn {top:25px; width:45px; height:45px; text-indent:-9999px;}
.header > .blog {background:url('/images/common/bt_blog_bg.png') no-repeat 0 0;}
.header > .blog img {display:none;}
.header > .open_mn {display:block;}
}

@media all and (max-width:768px){
.header {height:80px;}
.header > h1 {width:172px; padding-top:15px;}
.header > h1 img {width:180px;}
.header > .blog,
.header > .open_mn {top:18px;}
}



/* gnb */
@media all and (min-width:1025px){
#gnb {clear:both; display:block !important; position:relative; left:0 !important; width:100%; height:50px !important; background-color:#777; z-index:1001;}
#gnb .inr {position:absolute; top:0; left:0; width:100%; z-index:1003; overflow:hidden;}
#gnb .inr.ov {background:url('/images/common/web_gnb_bg1.png') repeat-x 0 0;}
#gnb .inr.ov .navi > li > a {color:#393939;}
/*#gnb .inr.ov .navi > li.on > a {color:#ff8035;}*/


#nav {position:relative; margin:0 auto; width:100%; max-width:1200px; z-index:1004;}
#nav h2 {display:none;}
.navi {height:50px;}
.navi > li {float:left; width:14.285%;}
.navi > li > a {display:block; height:50px; padding-top:15px; font-size:18px; color:#fff; text-align:center;}
.navi > li > a:hover,
.navi > li.ov > a {color:#ff8035 !important;}

.navi .sm {display:none; position:absolute; top:50px; left:0; width:100%; height:206px;}
.navi .sm > div {position:absolute; width:23.75%; height:127px; margin-top:0; padding:42px 125px 0 0; color:#fff; background:url('/images/common/web_gnb_img.png') no-repeat right bottom; text-align:right;}
.navi .sm > div p {font-size:21px; letter-spacing:-0.06em;}
.navi .sm > div span {display:inline-block; margin-top:7px; font-weight:normal; font-family:Lato; font-size:17px; font-weight:400; letter-spacing:0; text-transform:uppercase;}

.navi .sm > ul {float:right; width:76.25%; height:206px; margin-left:23.75%;}
.navi .sm > ul > li {float:left; width:17.3%; margin-top:13px; margin-left:2.7%;}
.navi .sm > ul > li > a {display:block; height:42px; padding-top:12px; font-size:16px; color:#373737; border-bottom:1px solid #333;}
.navi .sm > ul > li > a[target="_blank"] {background:url('/images/common/blank_1.png') no-repeat right center;}
.navi .sm > ul > li > a:focus,
.navi .sm > ul > li > a:hover,
.navi .sm > ul > li.ov > a,
.navi .sm > ul > li.on > a {color:#ff8035; border-color:#ff8035; background:url('/images/common/web_gnb_sm_on.png') no-repeat right center;}
.navi .sm > ul > li.ov > a[target="_blank"]:hover,
.navi .sm > ul > li > a[target="_blank"]:hover {background-image:url('/images/common/blank_2.png') !important;}
.navi .sm > ul > li > ul {display:none;}

#blind {position:absolute; left:0 !important; top:0; width:100%; height:0; background:#fff url('/images/common/web_gnb_bg2.png') repeat-y center 50px; opacity:1; z-index:1002;}
}


@media all and (max-width:1024px){
#gnb {display:none; position:absolute; left:100%; top:0; width:240px;}
#gnb .inr {width:100%; background:#ececec; -webkit-opacity:1; -moz-opacity:1; -ms-opacity:1; -o-opacity:1; opacity:1; filter:alpha(opacity=100); z-index:1001;}
#nav {}
#nav h2 {display:block; height:130px; padding:30px 0 0 20px; font-size:22px; line-height:30px; background:#6eae21;}
#nav h2 span {display:block; position:relative; padding-top:15px; color:#fff;}
#nav h2 span:before {content:""; display:block; position:absolute; top:0; width:62px; border-top:1px solid #fff; }
.navi {border-top:1px solid #fff;}
.navi > li {border-bottom:1px solid #fff; background:#535353 url('/images/common/mob_gnb_arr.png') no-repeat 210px 1px;}
.navi > li > a {display:block; height:46px; padding-top:15px; padding-left:20px; font-weight:600; font-size:16px; color:#fff;}
.navi > li.ov,
.navi > li.on {background-color:#3da1cb; background-position:210px -46px;}

.navi .sm {background:#fff;}
.navi .sm > div {display:none;}
.navi .sm > ul {display:none;}
.navi .sm > ul > li {background:#ebf5fa url('/images/common/mob_gnb_bl2.png') no-repeat 20px 17px;}
.navi .sm > ul > li > a {display:block; padding:11px 0 12px 35px; border-bottom:1px dotted #ccc;}
.navi .sm > ul > li > a[target="_blank"] > span {display:inline-block; padding-right:15px; background:url('/images/common/blank_1.png')no-repeat right 3px;}
.navi .sm > ul > li > a:hover span,
.navi .sm > ul > li.ov > a,
.navi .sm > ul > li.on > a {text-decoration:underline;}

.navi .sm > ul > li > ul {display:none; padding:0 0 8px; background:#fff; /*background:#e7f4f9;*/}
.navi .sm > ul > li > ul > li {padding-top:8px;}
.navi .sm > ul > li > ul > li {padding-left:10px;}
.navi .sm > ul > li > ul > li > a {display:block; padding-left:35px; line-height:22px; background:url('/images/common/mob_gnb_bl3.png') no-repeat 25px center;}
.navi .sm > ul > li > ul > li > a:hover,
.navi .sm > ul > li > ul > li.on > a {text-decoration:underline; color:#3da1cb;}

#blind {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:url('http://www.ulleung.go.kr/design/ula/img/common/web_gnb_bg1.png') repeat 0 0; z-index:1000;}
}


/* footer */
#footer {padding:30px 0 40px; color:#fff; background-color:#777; text-align:center;}
.footer {}
.footer > ul {display:inline-block;}
.footer > ul > li {float:left; padding:5px 15px;}
.footer > ul > li.link02 {background:#505050;}
.footer > ul > li.link04 {background:url('/images/common/bot_lnk_bar.png') no-repeat 0 6px;}
.footer > ul > li > a {display:block; color:#fff;}
.footer > div {padding-top:15px; line-height:22px;}
.footer > div > p > br {display:none;}
.footer > div > p > strong {font-weight:600;}
.footer > p {padding-top:15px; font-size:11px; letter-spacing:0;}

@media all and (max-width:768px){
.footer > div > p {font-size:13px;}
}

@media all and (max-width:480px){
#footer {padding:20px 0 30px;}
.footer {width:94%; margin:0 auto;}
.footer > ul {display:block;}
.footer > ul > li {float:left; width:48.5%; margin-bottom:15px; margin-left:3%;  padding:8px 0; border:1px solid #bbb;}
.footer > ul > li.link01,.footer > ul > li.link03 {margin-left:0;}
.footer > ul > li.link04 {background:none;}
.footer > ul > li > a {}
.footer > div > p {font-size:13px; letter-spacing:-0.05em; text-align:left;}
.footer > div > p:first-child {padding-bottom:12px; margin-bottom:12px; border-bottom:1px dashed #bbb;}
.footer > div > p > br {display:block;}
.footer > div > p > span {display:none;}
.footer > p {padding-top:20px;}

}