@charset "@charset "utf-8";
html,body{overflow-y:hidden;}
#totalWrap{overflow:hidden;position:relative;width:100%;height:100%;min-height:0;}

/*공통

.ir{background:url(../img/ir.png) no-repeat;}
.break{display:block;line-height:1;}
.no_txt{font-size:0;line-height:0;}
button{background:none;}*/

/************************/

#wrapper{position:relative; overflow:hidden;}
.wrap{position:relative;width:1200px;margin:0 auto;}


#intro{display:none; z-index:700; position:relative; overflow:hidden;}
.cyber_intro { position:relative; height:100vh;}

@keyframes bg_mo {
    from {transform: scale(1.1,1.1);}
    to {transform: scale(1,1);}
}
.bg_intro { position:absolute; top:0; left:0; bottom:0; right:0; width:100%; height:100%; animation:bg_mo 8s linear; background:url(../img/bg_intro1.jpg) no-repeat center top; animation-direction: alternate-reverse; animation-iteration-count: infinite;}
.box_intro { position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); text-align:center; color:#fff;}
.box_intro .p_desc1 { margin:60px 0 15px 0;}
.box_intro .p_desc2 { font-family:"Nanum Myeongjo"; font-size:80px; letter-spacing:-0.2em;}
.box_intro .p_desc2 .em { color:#ff7906;}
.box_intro .p_desc3 { margin:20px 0 55px 0; font-size:17px; line-height:1.4em;}
.box_intro .btn_intro a { border:4px solid #fff; display:inline-block; width:230px; padding:20px 0 20px 40px; box-sizing:border-box; color:#fff; font-size:20px; margin:0 10px; background:url(../img/icon_ar_off.png) no-repeat 90% center; text-align:left; transition: all .3s ease;}
.box_intro .btn_intro a:hover { border:4px solid #f58220; color:#ff7906; background:url(../img/icon_ar_over.png) no-repeat 90% center;}


#header{position:absolute;top:0;left:0;width:160px;height:100%;}

/*카테고리메뉴*/
#gnb{position:relative;height:100%;background:#2d7cb5;z-index:600;}
#gnb h1{height:160px;background:#f58220 url(../img/sub_logo.png) no-repeat center;font-size:0;line-height:0;}
#gnb ul li { z-index:50;}
#gnb ul li button{width:100%; height:300px; padding:20px; box-sizing:border-box; text-align:left;color:#fff; font-size:30px; font-family:"Nanum Myeongjo";}
#gnb ul li button > .em{font-size:15px; display:block; font-family:"Nanum Square"; margin-bottom:5px;}
#gnb ul li.btn1{ height:310px;}
#gnb ul li.btn1 button {background:#349751; z-index:100;}
#gnb ul li.btn1 i { background:url(../img/icon_t1.png) no-repeat center; display:block; width:44px; height:44px; margin-top:5px;}
#gnb ul li.btn1 button.on { box-shadow:0 5px 0 rgba(82,82,82,0.3);}
#gnb ul li.btn2 button {background:#2d7cb5; z-index:80;}
#gnb ul li.btn2 i { background:url(../img/icon_t2.png) no-repeat center; display:block; width:44px; height:47px; margin-top:5px;}

/*리스트메뉴제어버튼*/
#lnb_on_off{position:absolute;top:50%; margin-top:-40px;left:200px;overflow:hidden;z-index:5;}
#lnb_on_off button{width:26px;height:86px;background:#5e6575;font-size:0;line-height:0;}
#lnb_on_off span{display:block;position:absolute;top:50%;left:50%;margin:-8px 0 0 -6px;width:11px;height:17px;background-image:url(../img/bg_btn_close.png); transition:all 0.3s}

/*리스트메뉴*/
#lnb{position:absolute;top:0;left:160px;width:200px;height:100%;background:#349751;box-shadow:5px 0 0 rgba(82,82,82,0.3);z-index:5}
#lnb .p_desc { color:#fff; padding:70px 0 0 20px; height:90px; line-height:22px;}
#lnb .grap {display:none;}
#lnb .grap a{display:block;padding:20px 10px; box-sizing:border-box; margin:0 20px;border-bottom:1px solid rgba(255,255,255,0.2);color:#fff;cursor:pointer;}
#lnb .grap a:first-child {border-top:1px solid rgba(255,255,255,0.2);}
#lnb .grap a:after{display:inline-block;vertical-align:middle;height:105%;content:'';}
#lnb .grap a.on,
#lnb .grap a.active{ margin:0;}

.type1 #lnb { background:#349751;}
.type1 #lnb .grap a span{display:inline-block; width:40px;}
.type1 #lnb .grap a.on,
.type1 #lnb .grap a.active{padding-left:30px;background-color:#118433; background-image:url(../img/icon_menu.png); background-repeat:no-repeat; background-position:90% center;}

.type2 #lnb { background:#2d7cb5;}
.type2 #lnb .grap { padding-top:160px;}
.type2 #lnb .grap a { text-align:center;}
.type2 #lnb .grap a span{display:block; color:#ffdc51; margin-bottom:5px;}
.type2 #lnb .grap a.on,
.type2 #lnb .grap a.active{ background-color:#0f66a4;}

.map_position { position:relative; z-index:100 !important;}

.map_point1 { z-index:120 !important; width:40px; height:36px; background:url(../img/icon_map1.png) no-repeat center top; color:#349651; text-align:center; padding-top:12px; letter-spacing:-0.5px; font-weight:600;} /* 영월 10경 마커 */
.map_point5 { z-index:120 !important; width:40px; height:36px; background:url(../img/icon_map2.png) no-repeat center top; color:#2c89cc; text-align:center; padding-top:12px; letter-spacing:-0.5px; font-weight:600;} /* 추천코스 마커 */
.map_point2 { z-index:120 !important; width:40px; height:36px; background:url(../img/icon_map3.png) no-repeat center top; color:#ff0000; text-align:center; padding-top:12px; letter-spacing:-0.5px; font-weight:600;} /* 선택 마커 */
/*.map_point3 { z-index:120 !important; width:147px; height:85px; background:url(../img/img_dir1_off.png) no-repeat center top; color:#ff0000; text-align:center; padding-top:12px; letter-spacing:-0.5px; font-weight:600;}
.map_point4 { z-index:120 !important; width:147px; height:85px; background:url(../img/img_dir1_on.png) no-repeat center top; color:#ff0000; text-align:center; padding-top:12px; letter-spacing:-0.5px; font-weight:600;}*/

.box_point { z-index:110 !important; border:1px solid #349651; background:#fff; padding:3px 6px 2px 6px; font-size:12px; font-family:"Nanum Barun Gothic"; letter-spacing:-0.05em; color:#349651; position:relative; left:-50%; margin-left:35px;}
.tour_view {width:258px;padding:20px; position:absolute;}
.tour_view h1 { font-size:18px; color:#000; padding-bottom:13px;}
.tour_view h1 span { border-right:1px solid #ddd; padding-right:10px; margin-right:10px;}
.tour_view .img { height:153px;}
.tour_view .img img { width:100%; height:100%;}
.tour_view .btn { padding-top:13px;}
.tour_view .btn a { display:inline-block; width:80px; padding:5px 0; text-align:center; color:#4b4b4b; font-size:14px; border:1px solid; border-color:#e5e5e5 #c7c7c7 #c7c7c7 #e5e5e5; margin-right:6px;}
.tour_view .btn a:last-child { margin-right:0;} 
.tour_view .btn_close {background:url(../img/icon_close.png) no-repeat center; width:16px; height:16px; display:block; font-size:0; position:absolute; top:20px; right:20px;}


@media all and (max-width:1000px){
.wrap{ width:100%;}
}
@media all and (max-width:800px){
.box_intro { width:80%;}
.box_intro h1 img { width:100%;}
.box_intro .p_desc1 { margin:30px 0 15px 0;}
.box_intro .p_desc1 img { width:100%; max-width:360px;}
.box_intro .p_desc2 { font-size:45px;}
.box_intro .p_desc3 { font-size:14px;}
.box_intro .btn_intro a { border:1px solid #fff; width:130px; padding:10px 0 10px 10px; font-size:15px; text-align:left; margin:0; background:url(../img/icon_ar_off.png) no-repeat 90% center; background-size:20px;}
.box_intro .btn_intro a:hover { border:1px solid #f58220; background:url(../img/icon_ar_over.png) no-repeat 90% center; background-size:20px;}

#header{width:50px;}
#gnb h1{height:50px;background:#f58220 url(../img/sub_logo.png) no-repeat center; background-size:90%;}
#gnb ul li button{ height:250px; padding:10px; text-align:center;font-size:18px; line-height:1.1em; word-break: break-all;}
#gnb ul li button > .em { display:none !important;}
#gnb ul li button > .m_block { display:block;}
#gnb ul li.btn1{ height:210px;}
#gnb ul li.btn1 i { background:url(../img/icon_t1.png) no-repeat center; background-size:100%; width:30px; height:30px; margin:5px auto;}
#gnb ul li.btn2 i { background:url(../img/icon_t2.png) no-repeat center; background-size:100%; width:30px; height:33px; margin:5px auto;}

#lnb_on_off{left:90px;}

#lnb{left:50px;width:90px;}
#lnb.on { left:50px !important;}
#lnb .p_desc { padding:20px 0 20px 10px; height:auto; line-height:1.1em; font-size:12px;}
#lnb .grap a{padding:5px; margin:0 5px; font-size:12px;}

.type1 #lnb .grap a span{display:block; width:auto;}
.type2 #lnb .grap { padding-top:20px;}
}
@media all and (max-width:500px){
.box_intro { margin-top:-60px;}
.box_intro .p_desc2 .em { display:block;}
.box_intro .p_desc3 .m_block { display:block;}
}