﻿@charset "utf-8";
@import url("../../resources/css/base.css");


/* ====== 뷰어 ====== */
body {background: url('../../resources/images/bg_patterns.png') repeat;}

.viewerwrap{position:relative;}

.viewerwrap header{position:relative; height:60px; background:#596c9e; text-align:center;
-webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
}
.viewerwrap header .sta{position:absolute; top:12px; left:20px;}
.viewerwrap header .util{position:absolute; top:16px; right:20px; z-index:10;}
.viewerwrap header h2{padding:0 180px; color:#fff; text-align:center; line-height:1.2; position:relative; top:50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); overflow:hidden; font-family:NanumGothicBold,'새굴림'; font-size:18px;}


.viewerwrap .viewer_container {position:relative; width:100%;}
.viewerwrap .viewer_container:after{display:block;clear:both;content:''}

.viewerwrap .viewer_prevImg_button{display:block; position:absolute; width:65px; height:65px; z-index:50;} 
.viewerwrap .viewer_nextImg_button{display:block; position:absolute; width:65px; height:65px; z-index:50;}


.leftwrap{float:left; position:relative; width:180px; z-index:20;}
.imagewrap{float:left; position:relative; z-index:10;}
.imagewrap .image_area {position:relative; z-index:5; overflow:hidden; width:100%; height:100px; }
.imagewrap #viewLoading{position:absolute;	left:0;	top:0; text-align:center; width:32px; height:32px;}
.rightwrap{float:left; position:relative; width:180px; z-index:20;}

.leftwrap .viewer_tree{position:relative; width:180px; background:#fff; -webkit-box-shadow: 4px 0 8px rgba(0,0,0,.4); -moz-box-shadow: 4px 0 8px rgba(0,0,0,.4); box-shadow: 4px 0 8px rgba(0,0,0,.4); overflow:auto;}
.rightwrap .viewer_tree{position:relative; width:180px; background:#fff; -webkit-box-shadow: -4px 0 8px rgba(0,0,0,.4); -moz-box-shadow: -4px 0 8px rgba(0,0,0,.4); box-shadow: -4px 0 8px rgba(0,0,0,.4); overflow:auto;}

.leftwrap .viewer_tree .viewer_tree_sub {height:100%;width:165px; margin:0 10px 0 5px; overflow:auto}

.tree_scroll{overflow:auto; padding:10px 20px;}
.viewer_tree .tree_tit{margin:15px 5px 5px 5px; overflow:auto;line-height:1.4; vertical-align:middle; background:url('../../resources/images/viewer/bullet1.png') no-repeat 0 3px; padding:0 0 0 15px; font-size:14px; font-weight:bold; color:#492e1c;}

.rightwrap .ori_txt {padding:10px ; line-height:1.4; overflow:auto; font-size:16px;}

.viewer_left_button{dispaly:block; position:absolute; z-index:100;}
.viewer_right_button{dispaly:block; position:absolute; z-index:100;}

.viewerwrap .control{position:relative; bottom:0; left:0; width:100%; height:59px; border-top:solid 1px #d2d2d2; z-index:10;
background: #ededed; /* Old browsers */
background: -moz-linear-gradient(top,  #ededed 0%, #d9d9d9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ededed 0%,#d9d9d9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ededed 0%,#d9d9d9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#d9d9d9',GradientType=0 ); /* IE6-9 */
}
.control_page{float:left; margin:0 5px;}
.control_page:after{display:block;clear:both;content:''}
.control_page_bg{height:34px; padding:0 10px; background:url('../../resources/images/viewer/bg_num.png') no-repeat left top; font-family:NanumGothicBold,'새굴림'; color:#333; font-size:14px; line-height:34px;}
.viewerwrap .control nav{position:absolute; left:50%; top:13px; margin:0 0 0 -255px;}
.viewerwrap .control nav:after{display:block;clear:both;content:''}
.viewerwrap .control a{float:left; display:block; width:42px; height:34px;}
.viewerwrap .control a.mgo{width:35px; height:34px; background:url('../../resources/images/viewer/btn_control_page.png') no-repeat;}
.viewerwrap .control a.mgo:hover{background:url('../../resources/images/viewer/btn_control_page_on.png') no-repeat;}
.viewerwrap .control a.m1{background:url('../../resources/images/viewer/viewer_control1.png') no-repeat;}
.viewerwrap .control a.m2{background:url('../../resources/images/viewer/viewer_control2.png') no-repeat;}
.viewerwrap .control a.m3{background:url('../../resources/images/viewer/viewer_control3.png') no-repeat;}
.viewerwrap .control a.m4{background:url('../../resources/images/viewer/viewer_control4.png') no-repeat;}
.viewerwrap .control a.m5{background:url('../../resources/images/viewer/viewer_control5.png') no-repeat;}
.viewerwrap .control a.m6{background:url('../../resources/images/viewer/viewer_control6.png') no-repeat;}
.viewerwrap .control a.m7{background:url('../../resources/images/viewer/viewer_control7.png') no-repeat;}
.viewerwrap .control a.m8{background:url('../../resources/images/viewer/viewer_control8.png') no-repeat;}
.viewerwrap .control a.m9{background:url('../../resources/images/viewer/viewer_control9.png') no-repeat;}
.viewerwrap .control a.m1:hover{background:url('../../resources/images/viewer/viewer_control1_on.png') no-repeat;}
.viewerwrap .control a.m2:hover{background:url('../../resources/images/viewer/viewer_control2_on.png') no-repeat;}
.viewerwrap .control a.m3:hover{background:url('../../resources/images/viewer/viewer_control3_on.png') no-repeat;}
.viewerwrap .control a.m4:hover{background:url('../../resources/images/viewer/viewer_control4_on.png') no-repeat;}
.viewerwrap .control a.m5:hover{background:url('../../resources/images/viewer/viewer_control5_on.png') no-repeat;}
.viewerwrap .control a.m6:hover{background:url('../../resources/images/viewer/viewer_control6_on.png') no-repeat;}
.viewerwrap .control a.m7:hover{background:url('../../resources/images/viewer/viewer_control7_on.png') no-repeat;}
.viewerwrap .control a.m8:hover{background:url('../../resources/images/viewer/viewer_control8_on.png') no-repeat;}
.viewerwrap .control a.m9:hover{background:url('../../resources/images/viewer/viewer_control9_on.png') no-repeat;}


/* ====== 팝업 ====== */
.popwrap{background:#fff; z-index:1100; -webkit-box-shadow: 4px 4px 8px rgba(0,0,0,.6); -moz-box-shadow: 4px 4px 8px rgba(0,0,0,.6); box-shadow: 4px 4px 8px rgba(0,0,0,.6);}
.pophead{position:relative; padding:10px;}
.pophead .tit{font-family:NanumGothicBold,'새굴림'; font-size:1.3em; color:#fff; line-height:1.4; padding:0 70px 0 0}
.pophead .btn_close{position:absolute; top:10px; right:10px;}
.pophead.sj_head{background:#ab485c}
.pophead.sj_head .tit{padding:0 0 0 22px; font-family:NanumGothic,'새굴림'; background:url('../../resources/images/viewer/bullet_sj.png') no-repeat 0 2px;}
.pophead.sj_head .arrow{position:absolute; top:-17px; right:30px;}
.popcontent_sj{border:solid 4px #ab485c; border-top:none;overflow: auto; padding:20px 19px 10px 19px;}
.pop_overlay{position:fixed; top:0; left:0; width:100%; height:100%; background:#000; z-index:1000; opacity:.3; display:none;}

table.info{width:100%; line-height:1.8; font-family:새굴림,'New Gulim';}
table.info caption{/*visibility:hidden;*/ display:none}
table.info th{padding:4px 0; vertical-align:top; text-align:left}
table.info td{padding:4px 0 0 10px; vertical-align:top; text-align:left}

.link_des h4{margin:10px 0 0 5px;height:34px;font-weight:bold; background:url('../../resources/images/viewer/link_bar.png') no-repeat; text-indent:-999px}
.link_des ul{margin:0 0 0 5px;background-color:#fff}
.link_des ul li{padding:5px;border-top:dotted 1px #d6d6d6;}
.link_des ul li:first-child { border-top:none;}