@import "animate.css";


*{box-sizing:border-box}

html,body,h1,h2,h3,h4,h5,h6,div,ol,ul,li,p,a,span,strong,em,i,b,img,button,a{font-style:normal;line-height:1;margin:0;padding:0;font-size:100%}

html,body{height:100%}

body{font-weight:400;color:#464646}
body *:focus{outline-width:1px;outline-style:dashed}

/*
h1{line-height:1.1}
h2{line-height:1.2}
h3{line-height:1.3}
h4{line-height:1.4}
h5{line-height:1.5}
h6{line-height:1.6}
*/

li{list-style:none}

img{max-width:100%;border:0}

form{}
input{}

input[type="text"]{}
input[type="search"]{}
input[type="file"]{}
input[type="submit"]{}
input[type="button"]{}

textarea{}
button{display:inline-block;vertical-align:middle;background:none;border:0;cursor:pointer}

a{text-decoration:none;color:#464646}
a:link,a:visited{color:#464646}
a:focus,a:hover,a:active{color:#333333}

.skip{position:fixed;top:-1px;left:-1px;width:1px;height:1px;overflow:hidden}

.wheel{overflow:hidden}

#cyberTour{position:relative;width:100%;height:100%}

.wheel #cyberTour{height:auto}

#cyberTour .scene{position:relative;height:100%;height:770px;overflow:hidden}

#cyberTour .outer-bg,
#cyberTour .inner-bg{overflow:hidden;height:100%;background:no-repeat;background-size:cover}

/* layer 0 */
#layer-scene0 .outer-bg{background-image:url(../img/intro/bg-blur.png)}
#layer-scene0 .inner-bg{background-image:url(../img/intro/bg-map.png)}

#layer-scene0 .top-content{height:25%}
#layer-scene0 .bottom-content{height:13%}

#layer-scene0 .top-content .content-bg,
#layer-scene0 .bottom-content .content-bg{height:100%;background:url(../img/intro/bg-vertical.png) repeat-y 50% 0}

#layer-scene0 .middle-content{height:250px;overflow:hidden}
#layer-scene0 .middle-content .content-bg{height:181px;margin:30px auto 0;background:url(../img/intro/middle-text.png) no-repeat 50% 50%;background-size:auto 100%}

#layer-scene0 .animate-mouse{padding-top:30px}
#layer-scene0 .animate-mouse .mouse{height:30px;overflow:hidden;background:url(../img/common/mouse.png) no-repeat 50% 0;background-size:auto 100%}
#layer-scene0 .animate-mouse .animator{position:relative;background-repeat:no-repeat;background-position:50% 0;background-size:auto 100%}
#layer-scene0 .animate-mouse .animator.ani-1{height:6px;margin-top:7px;background-image:url(../img/common/mouse-wheel.png)}
#layer-scene0 .animate-mouse .animator.ani-2{height:16px;margin-top:7px;opacity:0.5;background-image:url(../img/common/mouse-arrow.png)}
#layer-scene0 .animate-mouse .animator.ani-3{height:16px;margin-top:-5px;background-image:url(../img/common/mouse-arrow.png)}

#layer-scene0 .animate-mouse .animator.ani-1{animation:ani-1 1000ms infinite}
#layer-scene0 .animate-mouse .animator.ani-2{animation:ani-2 1000ms infinite}
#layer-scene0 .animate-mouse .animator.ani-3{animation:ani-3 1000ms infinite}

/* [S] 한곳 이상에서 쓰임 */
.button{height:65px;padding-right:25px;font-weight:600;font-size:18px;border-radius:7px;background:#2194dd;transition:all 150ms ease-out;box-shadow:5px 5px 30px -10px #000;color:#fff}
.button:hover{background:#1e85c6}
.button .icon{display:inline-block;width:64px;height:65px;vertical-align:middle;background:no-repeat 50% 50%}
.button-card .icon{background-image:url(../img/ui/button-icon-card.png)}
.button-slide .icon{background-image:url(../img/ui/button-icon-slide.png)}
.button-marker .icon{background-image:url(../img/ui/button-icon-map.png)}
.button-menu .icon{background-image:url(../img/ui/button-icon-menu.png)}
.button-close{width:50px;height:50px;box-shadow:none}
.button-close .icon{width:50px;height:50px;background-image:url(../img/ui/button-icon-close.png)}

.category-x{padding-left:20px}
.category-0 .icon{background-image:url(../img/ui/category-0.png)}
.category-1 .icon{background-image:url(../img/ui/category-1.png)}
.category-2 .icon{background-image:url(../img/ui/category-2.png)}
.category-3 .icon{background-image:url(../img/ui/category-3.png)}
.category-4 .icon{background-image:url(../img/ui/category-4.png)}

#pushControl{z-index:60;position:absolute;bottom:20px;right:20px}
#pushControl .button{margin-left:10px;font-weight:700;background:#fff;color:#288bca}
#pushControl .button:hover{background:#fff}

#loadCategory{z-index:60;position:absolute;top:20px;right:20px}
#loadCategory .button{margin-left:10px}
#loadCategory .button.ov{background:#fff;color:#288bca}

.scrollbar{z-index:40;position:absolute;top:25%;right:20px;width:8px;height:50%;overflow:hidden}
.scrollbar .scroll-ground{position:relative;height:100%;border-radius:50px;background:url(../img/vr/bg-scrollbar.png)}
.scrollbar .scroll-ground button{position:absolute;width:100%;height:20%;border-radius:25px;background:#fff}

.nmarker{position:relative;width:34px;height:43px;background:url(../img/ui/marker-default.png) no-repeat;transition:all 150ms ease-out}
.nmarker.active{background:url(../img/ui/marker-active.png) no-repeat}

.infowindow{display:none;position:absolute;bottom:35px;left:50%;width:212px;height:286px;margin-left:-104px;background:url(../img/ui/infowindow.png) no-repeat;background-size:100% auto}
.infowindow .inner{position:relative;padding-top:20px;margin:1.84% 3.38% 0 1.57%}

.infowindow .inner .grap{position:relative;width:127px;padding-top:127px;margin:0 auto;overflow:hidden;border-radius:100%}
.infowindow .inner .grap .obj,
.infowindow .inner .grap .obj .item{position:absolute;top:0;left:0;width:100%}
.infowindow .inner .grap .obj .item img{width:127px;height:127px}

.infowindow .inner strong{display:block;margin:15px 10px 0;text-align:center;line-height:1.3;font-weight:700;font-size:17px}
.infowindow .inner strong span{display:block;line-height:1.3}
.infowindow .inner p{margin:10px 10px 0;font-size:14px;text-align:center;line-height:1.4}
.infowindow .inner p span{display:block;line-height:1.4}

.infowindow .inner .control{position:absolute;top:0;left:0;width:100%}
.infowindow .inner .control button{position:absolute;top:70px;width:29px;height:29px;transition:all 100ms ease-out}
.infowindow .inner .control .next{right:17px;background:url(../img/ui/button-circle-default.png) no-repeat}
.infowindow .inner .control .next:hover{background:url(../img/ui/button-circle-active.png) no-repeat}

.infowindow .inner .page{display:none;margin-top:20px;text-align:center}
.infowindow .inner .page button{width:8px;height:8px;border-radius:100%;background-color:#b2b2b2}
.infowindow .inner .page button.ov{background-color:#2194dd}

.infowindow .nmarker_exit{position:absolute;top:10px;right:10px;font-size:18px;color:#000}

#markerView_infowindow_41 strong{font-size:16px}
#markerView_infowindow_35 strong span,
#markerView_infowindow_41 strong span{display:inline}

.resetTour{cursor:pointer}

/* [E] */


#layer-scene1{background:#3799d7 url(../img/common/bg-screen.png) no-repeat 50% 50%;background-size:cover}

#pushSlider,#slideView,#cardView,#markerView{width:100%;height:100%}

#pushSlider{position:relative}
#pushSlider .button-card{}
#pushSlider .button-slide{display:none}
#pushSlider .button-marker{}

#slideView{position:relative;z-index:50}

#slideView .outer-bg{background-image:url(../img/main/bg-map.png)}
#slideView .inner-bg{background-image:url(../img/common/map-pattern.png);background-repeat:repeat}

#slideView .top-content{position:absolute;top:0;left:0;width:25%;height:33.33%}
#slideView .top-content .identity{position:absolute;top:0;left:0;width:80%;height:80%;background:url(../img/main/top-text.png) no-repeat 50% 50%;background-size:67% auto}

#slideView .middle-content{margin:110px 0 0 0}
#slideView .middle-content .content-header{text-align:center}
#slideView .middle-content .content-header .text,
#slideView .middle-content .content-header .mouse,
#slideView .middle-content .content-header .animator{display:inline-block;vertical-align:middle}
#slideView .middle-content .content-header .text{width:131px;height:19px;background:url(../img/main/bold-regular.png) no-repeat 50% 0;background-size:auto 100%}
#slideView .middle-content .content-header .mouse{width:21px;height:30px;margin-left:10px;overflow:hidden;background:url(../img/common/mouse.png) no-repeat 50% 0;background-size:auto 100%}
#slideView .middle-content .content-header .animator{position:relative;background-repeat:no-repeat;background-size:auto 100%}
#slideView .middle-content .content-header .animator.ani-1{display:block;height:6px;margin-top:7px;background-image:url(../img/common/mouse-wheel.png);background-position:50% 0}
#slideView .middle-content .content-header .animator.ani-2{width:16px;height:28px;margin-left:5px;opacity:0.5;background-image:url(../img/common/mouse-arrow-right.png)}
#slideView .middle-content .content-header .animator.ani-3{width:16px;height:28px;margin-left:-9px;background-image:url(../img/common/mouse-arrow-right.png)}

#slideView .middle-content .content-header .animator.ani-1{animation:ani-1 1000ms infinite}
#slideView .middle-content .content-header .animator.ani-2{animation:ani-2 1000ms infinite}
#slideView .middle-content .content-header .animator.ani-3{animation:ani-3 1000ms infinite}

#slideView .middle-content .content-body{position:relative;margin-top:100px;background:url(../img/main/slider-horizen.png) repeat-x 0 50%}
#slideView .middle-content .content-body .obj{position:relative;width:100000px;margin-left:-50000px;text-align:center}
#slideView .middle-content .content-body .obj:after{content:"";display:block;clear:both}
#slideView .middle-content .content-body .item{position:relative;display:inline-block;width:200px;height:200px;margin:0 50px}
#slideView .middle-content .content-body .item-table{display:table;width:100%;height:100%}
#slideView .middle-content .content-body .item-cell{display:table-cell;width:100%;height:100%;vertical-align:middle;text-align:center}
#slideView .middle-content .content-body .item .thumb{display:inline-block;position:relative;width:100%;height:100%}
#slideView .middle-content .content-body .item .thumb .circle{position:relative;overflow:hidden;width:100%;height:100%;border-radius:100%}
#slideView .middle-content .content-body .item .thumb .circle img{position:absolute;top:50%;left:50%;max-width:none;width:200px;height:200px;margin:-100px 0 0 -100px}
#slideView .middle-content .content-body .item .thumb .inner-circle,
#slideView .middle-content .content-body .item .thumb .outer-circle{position:absolute;top:50%;left:50%;border-radius:100%;border:solid #fff}
#slideView .middle-content .content-body .item .thumb .inner-circle{width:120%;height:120%;margin:-60% 0 0 -60%;border-width:4px}
#slideView .middle-content .content-body .item .thumb .outer-circle{width:145%;height:145%;margin:-72.5% 0 0 -72.5%;border-width:1px;opacity:0.5}

#slideView .middle-content .content-body .item .thumb{width:0%;height:0%;opacity:0}

#slideView .middle-content .content-body .item .circle-ready{}
#slideView .middle-content .content-body .ready .circle-ready{position:absolute;top:50%;left:50%;width:12px;height:12px;margin:-5px 0 0 -5px;border-radius:100%;background:#fff;opacity:1}
#slideView .middle-content .content-body .ready .circle-ready:before{content:"";position:absolute;top:50%;left:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:100%;background:#fff;opacity:0.3}

#slideView .middle-content .content-body .active{}
#slideView .middle-content .content-body .active .thumb{width:100%;height:100%;opacity:1}
#slideView .middle-content .content-body .active .circle-ready{opacity:0}

#slideView .middle-content .content-body .item .pt{position:absolute;top:265px;left:50%;width:300%;margin-left:-150%;text-align:center;color:#fff}
#slideView .middle-content .content-body .item .pt strong{display:block;font-weight:700;font-size:24px;letter-spacing:-1px;margin-bottom:12px}
#slideView .middle-content .content-body .item .pt p{margin-bottom:20px;font-size:18px}
#slideView .middle-content .content-body .item .pt button{width:135px;height:43px;margin:0 3px;background-repeat:no-repeat;background-size:100% auto}
#slideView .middle-content .content-body .item .pt .button-pano{background-image:url(../img/ui/button-pano-default.png)}
#slideView .middle-content .content-body .item .pt .button-pano:hover{background-image:url(../img/ui/button-pano-active.png)}
#slideView .middle-content .content-body .item .pt .button-map{background-image:url(../img/ui/button-map-default.png)}
#slideView .middle-content .content-body .item .pt .button-map:hover{background-image:url(../img/ui/button-map-active.png)}

#slideView .middle-content .content-body .item .pt{}
#slideView .middle-content .content-body .ready .pt{top:140px}
#slideView .middle-content .content-body .ready .pt strong{font-size:18px}
#slideView .middle-content .content-body .ready .pt p,
#slideView .middle-content .content-body .ready .pt button{display:none}
#slideView .middle-content .content-body .active .pt{display:block;top:265px}

#cardView{position:absolute;top:0;left:0;overflow:hidden}
#cardView .obj{position:relative;width:100%;height:100%}
#cardView .obj:after{content:"";display:block;clear:both}
#cardView .item{position:relative;float:left;width:25%;height:33.33%;background:url(../img/vr/bg-box.png) no-repeat;background-size:cover}
#cardView .item a{display:block;position:relative;overflow:hidden;width:100%;height:100%;color:#fff}
#cardView .item .identifer{position:absolute;top:0;left:0;width:80%;height:80%;background:url(../img/vr/identifer.png) no-repeat 50% 50%;background-size:67% auto}
#cardView .item .thumb{height:100%;background:no-repeat 50% 50%;background-size:cover}
#cardView .item .thumb:before{content:"";display:block;width:100%;height:100%;background:url(../img/vr/bg_vertical-pattern.png) repeat-x 0 100%}
#cardView .item .thumb img{display:none}

#cardView .item .pt{z-index:10;display:table;border-spacing:20px;position:absolute;top:0;left:0;width:100%;height:100%;margin:-100% 0 0 -100%;overflow:hidden;background:url(../img/vr/bg-card-hover.png)}
#cardView .item .pt .inner{display:table-cell;position:relative;width:100%;padding:0 15px;vertical-align:middle;text-align:center;border:1px solid #fff}
#cardView .item .pt .inner i{position:absolute;top:15px;left:15px;padding-bottom:5px;font-size:18px;font-style:italic;border-bottom:2px solid #fff}
#cardView .item .pt .inner strong{display:block;margin-top:30px;font-size:24px}
#cardView .item .pt .inner strong span{display:block;line-height:1.4}
#cardView .item .pt .inner p{margin-top:15px;line-height:1.3;font-size:18px}
#cardView .item .pt .inner p span{display:block;line-height:1.3}

#cardView .item .info{z-index:10;position:absolute;bottom:0;left:0;width:100%;overflow:hidden}
#cardView .item .info .inner{position:relative;width:100%;padding:0 10px 20px 70px;vertical-align:middle}
#cardView .item .info .inner i{position:absolute;top:0;left:25px;padding-bottom:5px;font-size:18px;font-style:italic;border-bottom:2px solid #fff}
#cardView .item .info .inner strong{display:block;font-size:24px}
#cardView .item .info .inner strong span{display:block;line-height:1.4}
#cardView .item .info .inner p{margin-top:15px;line-height:1.3;font-size:18px}





#markerView{position:absolute;top:0;left:0;overflow:hidden;background:url(../img/vr/bg-map.png) no-repeat 50% 50%;background-size:cover}

#markerView .top-content{z-index:40;position:absolute;top:0;left:0;width:25%;height:33.33%}
#markerView .top-content .identity{position:absolute;top:0;left:0;width:80%;height:80%;background:url(../img/vr/identifer.png) no-repeat 50% 50%;background-size:67% auto}

#map{width:100%;height:100%}


#mapMenuOpen,
#mapMenuClose{z-index:40;position:absolute;top:20px;right:20px}

#mapMenu{z-index:100;position:absolute;top:0;right:-306px;width:316px;height:100%;background:url(../img/ui/bg-menu.png) repeat-y}
#mapMenu .title{height:80px;padding:40px 0 0 35px}
#mapMenu .title strong{font-weight:600;font-size:18px;color:#fff}

#mapMenu .grap{position:relative;height:80%;margin-left:10px;overflow:hidden}
#mapMenu .grap .obj{position:relative}
#mapMenu .grap .obj .item{margin-left:30px;border-bottom:1px solid #6ab3e3}
#mapMenu .grap .obj .item a{display:block;padding:10px 10px 10px 30px;margin-left:-30px;font-weight:500;font-size:15px;color:#fff}
#mapMenu .grap .obj .item a.ov,#mapMenu .grap .obj .item a:hover{background-color:#1e85c6}

#mapMenu .grap .obj .item .thumb{display:inline-block;width:36px;height:36px;margin-right:7px;vertical-align:middle;overflow:hidden;border-radius:100%;border:2px solid #79cae8}
#mapMenu .grap .obj .item .thumb img{height:55px}

#mapMenu .scrollbar{top:3%;height:90%}

#mapZoom{z-index:40;position:absolute;top:50%;right:20px;margin-top:-76px}
#mapZoom button{display:block;transition:all 150ms ease-out}

#mapZoom .button-in{width:49px;height:45px;border-bottom:1px solid #bdbdbd;background:url(../img/ui/button-zoom-default.png) no-repeat 0 0}
#mapZoom .button-in:hover{background-image:url(../img/ui/button-zoom-active.png)}

#mapZoom .button-out{width:49px;height:49px;background:url(../img/ui/button-zoom-default.png) no-repeat 100% 100%}
#mapZoom .button-out:hover{background-image:url(../img/ui/button-zoom-active.png)}


@media(min-height:768px){

#slideView .middle-content{z-index:60;position:absolute;top:50%;left:0;width:100%;margin-top:-270px}

}

#vrView{display:none;position:absolute;top:100%;left:0;width:100%;height:100%;background:#3799d7 url(../img/common/bg-screen.png) no-repeat 50% 50%;background-size:cover}
#vrViewClose{z-index:200;position:absolute;top:20px;right:20px}

#vrMenu{z-index:200;position:absolute;bottom:200px;left:0;right:0;width:100%;text-align:center}
#vrMenu button{position:relative;padding:10px 15px;margin-left:10px;font-weight:400;font-size:14px;border-radius:5px;background:url(../img/ui/cvr-pattern.png);color:#fff}
#vrMenu button:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:5px;border:1px solid #fff;opacity:0.5}
#vrMenu button:first-child{margin-left:0}
#vrMenu button:hover{background:#ef9b3b}

#vrChangeBlock,
#krpano{position:relative;width:100%;height:100%;border:0}

#krpano #krpanoSWFObject *{box-sizing:content-box}

#mapView{display:none;position:absolute;top:100%;left:0;width:100%;height:100%;background:#3698d6}
#mapViewClose{z-index:200;position:absolute;top:20px;right:20px}
#mapChangeBlock{position:relative;width:100%;height:100%}