@import url("padStyle_basic.css");

@charset "utf-8";

.wrap {position:relative; width:100%; max-width:1280px; height:100%; overflow:hidden;}
.go_index {display:block; position:absolute; width:120px; height:60px; left:128px; z-index:99;}
/*Movie Play*/

.main_movie {position:relative; overflow:hidden; width:1280px; height:610px; background:url(../images/movie_sample_gal.jpg) no-repeat left top;}
.main_movie_play {position:relative; overflow:hidden; width:1280px; height:610px; background:url(../images/movie_sample_3_gal.jpg) no-repeat left top;}
.main_movie_click {width:1280px; height:410px;}
.navigation{
	position:absolute;
	bottom:0;
	width:1152px;
	height:132px;
	z-index:2;
	padding-left:128px;
	left:0;
	background:url(../images/timeline_background_bg.png) repeat-x left top;
}
.navigation .playBar{position:absolute; height:1px; top:97px; z-index:3;}
.navigatiion .background {width:1024px; margin-left:128px;}
.navigation .location {overflow:hidden; position:absolute; top:90px; margin-left:25px; z-index:4;  }
.navigation .location img{float:left; display:block; margin-right:64px;}
.navigation .location .last{float:left; display:block; margin-right:0;}
.navigation .tlOpen {background:url(../images/bg_tl_open.png) no-repeat 0 0;}
.navigation .tlClose {background:url(../images/bg_tl_close.png) no-repeat 0 0;}
.navigation .tlOpen,
.navigation .tlClose {position:absolute; top:7px; left:50%; margin-left:-41px;}
.navigation .tlOpen a,
.navigation .tlClose a {display:block; width:82px; height:25px; text-indent:-9999px;}

.nav_pop1{display:none; position:absolute; z-index:10; top:-35px; left:185px;}
.nav_pop2{display:none; position:absolute; z-index:10; top:-35px; left:276px;}
.nav_pop3{display:none; position:absolute; z-index:10; top:-35px; left:355px;}
.nav_pop4{display:none; position:absolute; z-index:10; top:-35px; left:513px;}
.nav_pop5{display:none; position:absolute; z-index:10; top:-35px; left:582px;}
.nav_pop6{display:none; position:absolute; z-index:10; top:-35px; left:671px;}
.nav_pop7{display:none; position:absolute; z-index:10; top:-35px; left:826px;}
.nav_pop8{display:none; position:absolute; z-index:10; top:-35px; left:897px;}
.nav_pop9{display:none; position:absolute; z-index:10; top:-35px; left:987px;}

.navigation_ver{display:none;}	



/*Loading Bar*/
.loading_bar {position:absolute; top:35%; left:50%; margin-left:-58px; width:115px; height:117px; background:url(../images/loading_bar.png) no-repeat top left;}
.loading_bar .loading_step {position:absolute; margin:11px 0 0 9px;}
.loading_percent {display:block; position:absolute; width:100%; top:40px; text-align:center; font-size:2.6em; color:rgba(255,255,255,0.7);}
.loading_text {display:block; position:absolute; width:100%; top:70px; text-align:center; font-size:0.5em; color:rgba(255,255,255,0.7);}


/* Right Floating Menu */
.right_float_bg {position:absolute; width:181px; height:467px; top:20px; right:0; background:url(../images/slide_bg.png) no-repeat top left;}
.close_float {display:block; position:absolute; top:5px; right:5px; width:15px; height:15px;}
.direction_arrow {position:absolute; width:18px; top:180px; left:5px;}
.direction_arrow img {margin-bottom:10px;}
.direction_view {position:absolute; width:18px; top:190px; left:5px; display:none;}
.float_imagelist {position:absolute; width:120px; height:363px; top:76px; right:20px; overflow:hidden;}
.float_imagelist li {width:100%; margin-bottom:14px;}


/* 플로팅메뉴 숨김 
.right_float_bg {right:-160px;}
.direction_view {display:block;}
.direction_arrow  {display:none;} */


/* 팝업 무비 */
.ver_movie_pop {position:absolute; width:890px; height:627px; top:50%; left:50%; margin-left:-445px; margin-top:-314px; background-color:#3d3d3d; z-index:100;}
.popup_title {position:relative; width:860px; height:58px; margin:0 auto; margin-bottom:18px; border-left:1px solid #5498b3;}
.popup_title img{position:absolute; bottom:0; margin-left:7px;}
.popup_closebtn {display:block; position:absolute; width:15px; height:15px; right:10px; top:36px;}
.movie_view {position:relative; width:860px; margin:0 auto 20px auto;}
.movie_view img {max-width:100%;}
.arrow_left,.arrow_right {display:block; position:absolute; width:40px; height:40px; top:50%; margin-top:-20px;}
.arrow_right {right:0;}
.popup_pause {display:block; position:absolute; width:65px; height:40px; top:50%; margin-top:-20px; left:50%; margin-left:-33px;}
.movie_bar {position:absolute; width:800px; height:32px; bottom:25px; left:30px; background:url(../images/popup_playbar.png) no-repeat top left;}
.movie_progress {position:relative; width:277px; height:7px; margin:12px 0 0 14px; background-color:#5498b3;}
.bar_time {position:absolute; width:39px; height:20px; right:0; margin:-21px -19px 0 0;background:url(../images/progress_time.png) no-repeat top left;}
.bar_time span {display:block; height:17px; line-height:17px; text-align:center; font-size:0.7em;}
.popup_sub_title {position:relative; width:860px; margin:0 auto;}



/*페이스북 팝업*/
.facebook_wrap {position:absolute; width:453px; height:612px; top:50%; left:50%; margin:-306px 0 0 -226px; background-color:#3d3d3d; z-index:110;}
.facebook_title {width:100%; margin-bottom:30px;}
.facebook_title a {position:absolute; top:22px; right:13px; width:19px; height:19px;}
.facebook_list_title {width:100%; margin-left:15px; margin-bottom:14px;}
.facebook_list_photo {position:relative; width:417px; height:244px; margin:0 auto;}
.facebook_list_photo li {float:left; width:90px; height:90px; margin:0 7px 33px 7px;}
.facebook_list_photo li span {display:block; position:relative; width:100%; height:12px; color:#fff; font-size:0.7em; text-align:center; margin-bottom:13px;}
.fb_pagenation {display:block; width:50px; height:10px; margin:0 auto; font-size:0.7em; color:#FFF;}
.fb_pagenation img {float:left;}
.fb_pagenation .page_num {float:left; width:40px; height:10px; text-align:center; margin-top:-8px;}
.fb_pagenation .page_num span{color:#878787;}
.facebook_select_title {width:433px; border-top:1px solid #545454; padding-top:26px; padding-left:5px; margin:10px auto 15px auto; clear:both;}
.fb_select_list {position:relative;width:405px; margin:0 auto; }
.fb_select_list img {float:left;}
.fb_select_list .selection_img {margin-right:11px; border:1px solid #5498b3; }
.fb_btn {position:relative; width:127px; margin:130px auto 0 auto; clear:both;}
.modal_bg {position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.7); z-index:50;}


/*Memorial Hall Main and Navi*/
.memorial_main {position:relative; height:610px; padding-left:128px; background:url(../images/memorial_hall_gal.jpg) no-repeat left top;}
.memorial_navi_wrap {position:absolute; top:0; left:0; height:283px; margin-left:128px;}
.memorial_main a {display:block; float:left; height:283px;}
.memorial_navi_01 {width:215px;}
.memorial_navi_02 {width:196px;}
.memorial_navi_03 {width:195px;}
.memorial_navi_04 {width:191px;}
.memorial_navi_05 {width:227px;}
.memorial_navi_01:hover,.memorial_navi_01:active {background:url(../images/memorial_hall_over.jpg) no-repeat 0 0;}
.memorial_navi_02:hover,.memorial_navi_02:active {background:url(../images/memorial_hall_over.jpg) no-repeat -215px 0;}
.memorial_navi_03:hover,.memorial_navi_03:active {background:url(../images/memorial_hall_over.jpg) no-repeat -411px 0;}
.memorial_navi_04:hover,.memorial_navi_04:active {background:url(../images/memorial_hall_over.jpg) no-repeat -606px 0;}
.memorial_navi_05:hover,.memorial_navi_05:active {background:url(../images/memorial_hall_over.jpg) no-repeat -797px 0;}

/*Memorial Hall Text*/
.main_text_wrap {position:absolute; top:327px; right:32px; width:563px; height:261px;}
.main_text_wrap .text_scroll_bar {position:absolute; top:0px; right:0; width:11px; height:11px; margin-right:-16px; z-index:10;}
.main_text {position:relative; top:0; right:0; width:543px; height:261px;  padding-right:30px; border-right:1px solid #444548; overflow-y:scroll;}
.main_text p {font-size:0.85em; color:#fff; margin-bottom:15px;}
.main_text h2 {margin:10px 0 20px 0; font-size:2.5em; color:#fff; margin-bottom:40px;}
.main_text span {position:absolute; top:20px; right:30px; font-size:0.7em; color:#fff;}

/* 아산의 생애 */
.asanlife_main,.asanlife_main2 {position:relative; width:1280px; height:610px; background:url(../images/asan_life_img_gal.jpg) no-repeat center top;}
.asanlife_contents {position:relative; width:1280px; height:480px; top:154px;}
.asanlife_contents .close_btn {position:absolute; top:0; right:0;}
.asan_tab_wrap {position:absolute; width:521px; height:380px; top:47px; right:150px;}
.asan_tab_menu {margin-bottom:50px;}
.asan_tab_menu a {display:block; width:250px; height:36px; float:left;}
.asan_tab_menu .tab1_01 {background:url(../images/asan_life_tab_02_on.png) no-repeat left top;}
.asan_tab_menu .tab1_02 {background:url(../images/asan_life_tab_01.png) no-repeat left top;}
.asan_tab_menu .tab2_01 {background:url(../images/asan_life_tab_02.png) no-repeat left top;}
.asan_tab_menu .tab2_02 {background:url(../images/asan_life_tab_01_on.png) no-repeat left top;}
.asan_tab_conbox {position:absolute; width:501px; height:309px; overflow:hidde; padding-right:20px; clear:both; overflow-y:scroll;}
.asan_tab_conbox h2 {margin:10px 0 0 0; font-size:1.5em; color:#fff;}
.asan_tab_conbox p {font-size:0.85em; color:#fff; margin-top:20px;}
.asan_tab_wrap .text_scroll_bar {position:absolute; top:51px; right:0; margin-right:-6px; z-index:10;}
.asan_tab_wrap .scrollArea {width:521px; height:305px; margin-top:10px; border-right:1px solid #444548;}
.asan_tab_conbox img.lhthumb {display:block;}
.asan_tab_conbox img.lhthumbVer {display:none;}

/* 도서로 보는 아산 */
.book_main {position:relative; width:1280px; height:634px; background:url(../images/book_hor_img_gal.jpg) no-repeat left top;}
.book_main a {position:absolute;}
.book_main .book1 {width:178px; height:226px; top:177px; left:228px;}
.book_main .book2 {width:178px; height:226px; top:177px; left:443px;}
.book_main .book3 {width:178px; height:226px; top:177px; left:658px;}
.book_main .book4 {width:178px; height:226px; top:177px; left:875px;}
.book_main .close {width:40px; height:40px; top:154px; right:0; background:url(../images/btn_close_box.png) no-repeat 0 0;}
.book_main .book_list_btn {width:152px; height:152px; top:453px; left:917px;}



/* 도서로 보는 아산 팝업 */
.book_pop_bg {position:relative; width:800px; height:468px; top:50%; left:50%; margin-left:-400px; margin-top:-234px; background-color:#3d3d3d;}
.book_pop_head {position:relative; width:766px; height:52px; margin-left:15px; margin-bottom:18px; border-left:1px solid #5498b3;}
.book_pop_head span {position:absolute; margin-left:11px; bottom:0; font-size:1.5em; color:#fff;}
.book_pop_close {position:absolute; right:0; bottom:4px;}
.book_list_wrap {position:relative; width:750px; height:368px;  margin-left:15px; border-right:1px solid #646464;}
.book_list {position:absolute; width:729px; height:368px; overflow-y:scroll;}
.book_list_scrollbar {position:absolute; top:0; right:-6px; width:11px; height:11px;}
.b_bookList { width:100%; text-align:center; color:#5498b3; border-bottom:2px solid #5498b3; }
.book_list th { padding:10px 0 10px 0; color:#5498b3; border-bottom:1px solid #a2a2a2; border-top:1px solid #fff;  font-size:0.8em;}
.book_list td { padding:5px 12px 5px 12px; border-bottom:1px solid #3b5d6b; font-size:0.75em; }
.book_list .title { text-align:left; color:#FFF; }


/* 사진으로 만나는 아산 */
.photo_main .close {position:absolute; width:40px; height:40px; top:154px; right:0; background:url(../images/btn_close_box.png) no-repeat 0 0;}
.photo_main {position:relative; height:100%; padding-top:204px; background:url(../images/photo_life_img_gal.jpg) no-repeat left top, url(../images/sub02_bg_photo_gal.jpg) repeat-y left top;  overflow:auto}
.photo_wrap {position:relative; top:0; left:148px; width:999px;}
.photo_wrap .photo_list {position:relative; width:100%; height:100%; top:0; left:0;}
.photo_wrap .photo_list li {float:left; margin:0 15px 15px 0;}
.photo_wrap .photo_list li img {max-width:100%;}
.photo_wrap .photo_list li.photo_5 {position:relative;  margin-top:-165px;}
.photo_wrap .photo_list li.photo_10 {margin-left:-1000px; margin-top:165px;}

/* 사진으로 만나는 아산 팝업*/
.photo_popup {position:relative; margin:80px auto 0 auto; width:374px; text-align:center;}
.photo_popup .photo_big_close {position:absolute; top:0; right:0;}


/* 영상으로 만나는 아산*/
.movie_main .close {position:absolute; width:40px; height:40px; top:154px; right:0;}
.movie_main {position:relative; height:610px; background:url(../images/movie_meet_img_gal.jpg) no-repeat left top;}
.movie_wrap {position:relative; top:200px; left:0; width:1280px; height:433px;}
.movie_player_bg {position:relative; height:394px; /* background:url(../images/movie_player_bg_gal.png) no-repeat center center; */}
.movie_player_bg .mm_player {position:relative; width:480px; height:320px; margin:0 auto;}
.movie_player_bg .mm_player .play_btn {position:absolute; width:65px; height:40px; top:50%; left:50%; margin-left:-32px; margin-top:-20px;}
.movie_player_bg .mm_player .mm_player_bar {position:absolute; bottom:7px; left:13px; width:455px; height:32px; background:url(../images/movie_meet_playbar.png) no-repeat left top;}
.movie_player_bg .mm_player .mm_player_bar .mm_player_progress {position:absolute; width:100px; height:8px; background-color:#5498b3; top:12px; left:14px; z-index:100;}
.movie_player_bg .mm_player .mm_player_bar .mm_player_bigview_btn {position:absolute; width:16px; height:16px; top:8px; right:13px;}
.movie_player_bg .mm_title,.movie_player_bg .mm_sub_title {display:block; margin:0 auto; width:480px; text-align:center; font-size:1.5em; color:#fff; margin-top:15px;}
.movie_player_bg .mm_sub_title {font-size:0.8em; color:#5498b3; margin-top:2px;}
.movie_wrap .movie_step {position:relative; width:970px; height:21px; margin:0 auto 0 auto; border-top:1px solid #4a4e51;}
.movie_wrap .movie_step .mm_progress_handle {position:absolute; top:0; left:35px; width:11px; height:11px; margin-top:-6px;}
.movie_wrap .movie_step span {float:left; width:242px; height:20px; font-size:0.7em; color:rgba(255,255,255,.5);  margin-top:2px;}
.movie_wrap .movie_step span:nth-child(1) {color:rgba(255,255,255,1);}



/* 아산의 명언 */
.say_main .close {position:absolute; width:40px; height:40px; top:154px; right:0; background:url(../images/btn_close_box.png) no-repeat 0 0;}
.say_main {position:relative; height:634px; background:url(../images/saying_img_gal.jpg) no-repeat left top;}
.say_wrap {position:relative; top:203px; left:0; width:984px; height:431px; margin:0 148px;}
.say_wrap .type_01 {font-size:1.2em;}
.say_wrap .type_02 {font-size:0.6em;}
.say_wrap .type_03 {font-size:2.4em; letter-spacing:-0.06em;}
.say_wrap .type_04 {font-size:2.8em; letter-spacing:-0.06em;}
.say_wrap .type_05 {font-size:3.2em; letter-spacing:-0.06em;}
.say_wrap .color_white20 {color:rgba(255,255,255,.2);}
.say_wrap .color_white30 {color:rgba(255,255,255,.3);}
.say_wrap .color_white40 {color:rgba(255,255,255,.4);}
.say_wrap .color_white50 {color:rgba(255,255,255,.5);}
.say_wrap .color_white80 {color:rgba(255,255,255,.8);}
.say_wrap .color_white100 {color:rgba(255,255,255,1);}
.say_wrap .color_blue40 {color:rgba(84,152,179,.4);}
.say_wrap .color_blue50 {color:rgba(84,152,179,.5);}
.say_wrap .color_blue70 {color:rgba(84,152,179,.7);}
.say_wrap .color_blue100 {color:rgba(84,152,179,1);}
.say_wrap .text_pos {position:relative; line-height:3.3em; padding-right:10px; font-family:"Modern H Ecolight",AppleGothic,"dotum",dotum;}

/* 0613수정- 아산의 명언 */
/* .word_scroll {overflow:hidden; position:absolute; width:100%; top:370px; z-index:10; }
.word_scroll .left{display:block; float:left; }
.word_scroll .right{display:block; float:right;}
 */
span.gpLeft{display:block; position:absolute; top:370px; left:0; z-index:10;}
span.gpLeft a {display:block;}
span.gpRight{display:block; position:absolute; top:370px; right:0; z-index:10;}
span.gpRight a {display:block;}


/* 아산의 명언 팝업 */
.say_main .tag_pop_wrap {position:absolute; width:750px; height:440px; top:50%; left:50%; margin-left:-375px; margin-top:-220px; background-color:#3d3d3d; z-index:100;}
.say_pop_close {position:absolute; right:14px; top:14px;}
.say_main .tag_pop_wrap .tag_pop_contents {position:relative; width:690px; height:380px; margin:30px; margin-top:0;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_left {position:absolute; width:321px; height:380px; left:0;  margin-top:30px;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_left .tag_pop_player_bar {position:absolute; width:309px; height:32px; left:6px; bottom:7px; background:url(../images/saying_popup_playerbar.png) no-repeat top left;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_left .tag_pop_player_bar .tag_pop_player_progress {position:absolute; width:100px; height:8px; background-color:#5498b3; top:12px; left:14px; z-index:100;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_right {position:absolute; width:339px; height:380px; right:0;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_right p {font-size:0.7em; color:#bebdbd; margin:0 5px; line-height:1.8em;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_right .title_line {position:absolute; top:0; leftwidth:1px; height:62px;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_right h1 {position:relative; height:62px; font-size:1.5em; color:#fff; margin:0 5px 20px 5px; padding-left:9px; border-left:1px solid #5498b3; font-weight:normal;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_right h1 span{position:absolute; bottom:0;}
.say_main .tag_pop_wrap .tag_pop_contents .tag_con_right h2 {font-size:0.8em; color:#fff; margin:0 5px 10px 5px;  padding-left:9px; font-weight:normal;}



/*footer*/
footer { padding-left:32px; height:38px; line-height:38px; color:#414141; font-size:0.6em; background:#000; }

/*add for error*/
.wrap .error_box{background:url(../images/error_pad.gif) no-repeat left top; width:1024px; height:634px;}

/* PDF Layer Popup 2012.10.29 추가 */
#pdfPopLayer {background:url(../images/bg_pdf_pop.gif) no-repeat 0 0; width:368px; height:210px; position:absolute; top:50%; left:50%; margin:-105px 0 0 -184px; }
#pdfPopLayer p.close {position:absolute; top:22px; right:26px;}
#pdfPopLayer h2 {font-size:0; position:absolute; top:63px; left:26px;}
#pdfPopLayer div.btnGroup {position:absolute; top:150px; left:26px;}
#pdfPopLayer div.btnGroup ul {*zoom:1;}
#pdfPopLayer div.btnGroup ul:after {content:""; display:block; clear:both;}
#pdfPopLayer div.btnGroup ul li {float:left; display:inline; padding-right:5px;}

div.historySec {width:500px; height:2975px; background:url(../images/life_profile_06.png) no-repeat 0 0;}