@charset "utf-8";
/* CSS Document */
@import url("default.css");
#wrap { position:relative; min-width:980px; background:#fff; }
#wrap.main { background:url(../images/top_bg.jpg) no-repeat center 0; }
#header { position:relative; height:70px; width:980px; margin:0 auto; overflow:hidden; }
#header h1 { position:absolute; top:5px; left:5px; width:130px; }
#header h1 a { display:block; height:50px; background:url(../images/logo.png) no-repeat 0 0; text-indent:-9999px; }
#header .menu { position:absolute; top:22px; left:147px; width:130px; width:39px; }
#header .menu a { display:block; height:28px; background:url(../images/menu_top.png) no-repeat 0 0; text-indent:-9999px; }
#header .menu a:hover {background:url(../images/menu_top.png) no-repeat -39px 0; }
#header .sns { position:absolute; top:24px; right:20px; background:url(../images/sns_link.png) no-repeat right -52px; height:26px; }
#header .sns.m-sns { background:url(../images/sns_link.png) no-repeat right 0; }
#header .sns a { display:inline-block; *zoom:1; *display:inline; width:27px; height:26px; margin:0 0 0 11px; text-indent:-9999px; *text-indent:0; *font-size:0; *line-height:0; *overflow:hidden; }
#header .sns a.fb:hover { background:url(../images/sns_link.png) no-repeat 0 -26px; }
#header .sns a.tw:hover { background:url(../images/sns_link.png) no-repeat -38px -26px; }

.sub_tit { position:absolute; top:24px; right:110px; width:275px; }
.sub_tit .name { position:absolute; top:0; left:0; width:59px; height:30px; line-height:30px; border-right:1px solid #e4b3c0; font-size:18px; color:#000; }
.sub_tit .tit { position:absolute; top:-2px; left:70px; width:220px; height:30px; line-height:16px; color:#727272; }

.sub_tit02 { position:relative; height:30px; line-height:30px; background:#9c9c9c; font-size:18px; width:94%; padding:0 3%; color:#000; display:none; }

#ph_area { position:relative; height:480px; width:980px; margin:0 auto; }
#ph_area .tit { position:absolute; top:24px; left:19px; }
#ph_area .phs { position:absolute; top:108px; left:0px; width:100%; height:500px; }
#ph_area .phs li { position:absolute; width:123px; height:127px; background:url(../images/p_ph_bg.png) no-repeat 0 0; }
#ph_area .phs li.po01 { top:0; left:423px; }
#ph_area .phs li.po02 { top:0; left:635px; }
#ph_area .phs li.po03 { top:0; left:847px; }
#ph_area .phs li.po04 { top:110px; left:105px; }
#ph_area .phs li.po05 { top:110px; left:317px; }
#ph_area .phs li.po06 { top:110px; left:529px; }
#ph_area .phs li.po07 { top:110px; left:741px; }
#ph_area .phs li.po08 { top:220px; left:0px; }
#ph_area .phs li.po09 { top:220px; left:212px; }
#ph_area .phs li.po10 { top:220px; left:424px; }
#ph_area .phs li.po11 { top:220px; left:636px; }
#ph_area .phs li.po12 { top:220px; left:848px; }
#ph_area .phs li .ph { position:absolute; top:0; right:0; width:106px; height:110px; }
#ph_area .phs li .ph .name { position:absolute; top:89px; right:0; width:42px; height:21px; background:url(../images/p_ph_tx_bg.png); color:#fff; text-align:center; line-height:21px; }
#ph_area .phs li .ph .txt { position:absolute; top:0; right:0; width:88px; height:92px; background:#343434; padding:9px; line-height:18px; display:none; color:#fff; }
#ph_area .phs li .ph:hover .txt { display:block; }

#con_list { position:relative; background:url(../images/contents_bg.png) no-repeat center 0; }
#con_list .wrap { position:relative; width:980px; margin:0 auto; padding:80px 0 40px; *zoom:1; }
#con_list .wrap:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }

#con_list .wrap .column01 { position:relative; float:left; width:180px; }
#con_list .wrap .column01 .menu { position:relative; margin-bottom:60px; width:52px; height:37px; background:url(../images/menu_cont.gif) no-repeat 0 0; }

#con_list .wrap .column02 { position:relative; float:left; width:324px; min-height:580px; border-left:1px solid #e4859d; padding:5px 0 5px 35px; }
#con_list .wrap .column02.first { margin-right:80px; }

#con_list .wrap dl { position:relative; margin-bottom:30px; line-height:18px; }
#con_list .wrap dl dt { font-size:15px; color:#000; }
#con_list .wrap dl dt a { color:#000; }
#con_list .wrap dl dd { color:#fff; }
#con_list .wrap dl dd a { color:#fff; }

#con_list .wrap li { position:relative; margin-bottom:30px; }
#con_list .wrap li a { display:block; color:#fff; *zoom:1; }
#con_list .wrap li a:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }
#con_list .wrap li a span { float:left; }
#con_list .wrap li a span.name { width:28%; font-size:25px; }
#con_list .wrap li a span.tit { width:70%; font-size:15px; line-height:19px; letter-spacing:-1px; }
#con_list .wrap li a span.tit:hover { text-decoration:underline; }
#con_list .wrap li a span.tit em { display:block; font-size:12px; margin-top:5px; }

#footer { position:relative; background:#f8f8f8; text-align:center; padding:3px 0 50px; }
#footer a { display:inline-block; *zoom:1; *display:inline; padding:0 10px; }
#footer a.first { background:url(../images/f_copyright_bar.gif) no-repeat right 12px; }

#sub_menu { position:relative; background:#ebebeb; padding:7px 0 4px; }
#sub_menu .wrap { position:relative; width:980px; margin:0 auto; }
#sub_menu .wrap ul { position:relative; *zoom:1; }
#sub_menu .wrap ul:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }
#sub_menu .wrap ul li { position:relative; float:left; display:inline; font-size:14px; color:#961e3c; line-height:22px; padding:0 3px 0 4px; }
#sub_menu .wrap ul li.last { background:url(../images/sm_line.gif) no-repeat 0 5px; }
#sub_menu .wrap ul li a { display:inline-block; *zoom:1; *display:inline; color:#961e3c; line-height:22px; padding:0 6px; }
#sub_menu .wrap ul li a:hover, #sub_menu .wrap ul li a.on { border:1px solid #d6d6d6; background:#fff; border-radius:5px; padding:0 5px; line-height:20px; text-decoration:none; }

#sub_contents { position:relative; }
#sub_contents .wrap { position:relative; width:980px; margin:0 auto; padding:40px 0; }

.profile { position:relative; *zoom:1; }
.profile:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }
.profile .ph { position:relative; float:left; width:44%; margin:0 0 0 4%; }
.profile .ph img { width:100%; }
.profile .tx { position:relative; float:right; width:42%; margin:0 4% 0 0; color:#000; }
.profile .tx .tit { position:relative; font-size:30px; text-align:center; margin-bottom:85px; font-family:NanumGothicBold, sans-serif; letter-spacing:-2px; }
.profile .tx .name { position:relative; font-size:18px; text-align:center; margin-bottom:85px; }
.profile .tx .list { position:relative; }

.con_arrow { position:relative; width:100%; text-align:center; margin-top:25px; }
.con_arrow a { display:inline-block; *zoom:1; *display:inline; width:48px; height:48px; text-indent:-9999px; margin:0 2px; *text-indent:0; *font-size:0; *line-height:0; *overflow:hidden; }
.con_arrow a.pre { background:url(../images/con_arrow.gif) no-repeat 0 0; }
.con_arrow a.next { background:url(../images/con_arrow.gif) no-repeat -51px 0; }
.con_arrow a.pre:hover { background:url(../images/con_arrow.gif) no-repeat 0 -48px; }
.con_arrow a.next:hover { background:url(../images/con_arrow.gif) no-repeat -51px -48px; }

.route { position:relative; *zoom:1; }
.route:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }
.route .tx { position:relative; float:left; width:40%; color:#000; }
.route .tx dt { font-size:24px; font-family:NanumGothicBold, sans-serif; margin-bottom:20px; }
.route .tx dd { font-size:18px; line-height:30px; }
.route .tx dd a.google { display:inline-block; *zoom:1; *display:inline; width:59px; height:67px; background:url(../images/bt_view-googlemap.jpg) no-repeat 0 0; text-indent:-9999px; text-align:left; margin-top:20px; }
.route .tx dd span { white-space:nowrap;}
.route .tx dd a.googles { display:inline-block; *zoom:1; *display:inline; width:23px; height:31px; background:url(../images/bt_view-googlemap.gif) no-repeat 0 0; text-indent:-9999px; text-align:left; margin-top:20px; }
.route .map { position:relative; float:right; width:50%; text-align:right; }
.route .map img { width:100%; border:2px solid #999; }

.story { position:relative; *zoom:1; }
.story:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }
.story .ph { position:relative; float:left; width:14%; margin:0 0 0 4%; }
.story .ph img { width:100%; }
.story .tx { position:relative; float:right; width:72%; margin:0 4% 0 0; font-size:14px; line-height:30px; color:#363636; }
.story .tx h3 { font-size:24px; font-family:NanumGothicBold, sans-serif; color:#000; }
.story .tx h4 { font-size:18px; color:#bf4b68; font-weight:normal; }
.story .tx em.fn { position:relative; color:#bb2a5d; text-decoration:underline; padding-right:17px; }
.story .tx em.fn a { display:block; position:absolute; top:-3px; right:0; width:15px; height:15px; background:url(../images/ic_plus.gif) no-repeat 0 0; text-indent:-9999px; }

.participation { position:relative; *zoom:1; }
.participation:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }
.participation .tit { position:relative; float:left; width:18%; margin:0 0 0 4%; font-size:24px; font-family:NanumGothicBold, sans-serif; color:#000; }
.participation .tx { position:relative; float:right; width:70%; margin:0 4% 0 0; font-size:14px; line-height:30px; color:#363636; }
.participation .tx .name { position:relative; font-size:18px; text-align:right; margin-bottom:20px; }

.explanatory-note { position:absolute; top:0; left:0; width:100%; height:100%; z-index:99; background:#f7f7f7; display:none; }
.explanatory-note .wrap { position:relative; width:980px; margin:0 auto; padding-top:65px; }
.explanatory-note .wrap .close { position:absolute; top:0; right:0; display:block; width:39px; height:39px; background:url(../images/bt_exp-note_close.gif) no-repeat 0 0; text-indent:-9999px; z-index:1; }
.explanatory-note .wrap .tit { position:relative; float:left; width:18%; margin:0 0 0 4%; font-size:24px; font-family:NanumGothicBold, sans-serif; color:#000; padding-top:15px; }
.explanatory-note .wrap .tx { position:relative; float:right; width:70%; margin:0 4% 0 0; }

.intro-note { position:absolute; top:0; left:0; width:100%; height:100%; z-index:99; background:#f7f7f7; display:none; }
.intro-note .wrap { position:relative; width:980px; margin:0 auto; padding-top:65px; }
.intro-note .wrap .close { position:absolute; top:0; right:0; display:block; width:39px; height:39px; background:url(../images/bt_exp-note_close.gif) no-repeat 0 0; text-indent:-9999px; z-index:1; }
.intro-note .wrap .tit { position:relative; float:left; width:18%; margin:0 0 0 4%; font-size:24px; font-family:NanumGothicBold, sans-serif; color:#000; padding-top:15px; }
.intro-note .wrap .tx { position:relative; float:right; width:70%; margin:0 4% 0 0; }

.intro-note .wrap .tx { position:relative; float:right; width:72%; margin:0 4% 0 0; font-size:14px; line-height:30px; color:#363636; }
.intro-note .wrap .tx h3 { font-size:24px; font-family:NanumGothicBold, sans-serif; color:#000; }
.intro-note .wrap .tx h4 { font-size:18px; color:#bf4b68; font-weight:normal; }
.intro-note .wrap .tx em.fn { position:relative; color:#bb2a5d; text-decoration:underline; padding-right:17px; }
.intro-note .wrap .tx em.fn a { display:block; position:absolute; top:-3px; right:0; width:15px; height:15px; background:url(../images/ic_plus.gif) no-repeat 0 0; text-indent:-9999px; }


.layer {display:none; position:fixed; _position:absolute; top:0; left:0; width:100%; height:100%; z-index:100; }
.layer .bg {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.5; filter:alpha(opacity=50); }
.layer .pu_con { position:absolute; top:50%; left:50%; width:70%; margin-left:-25%; background-color:#f5f5f5; border:1px solid #bcbcbc; z-index:10; padding:1px; }
.layer .pu_con a.pu_close { position:absolute; top:5px; right:5px; display:block; width:22px; height:22px; background:url(../images/bt_pu_close.gif) no-repeat 0 0; z-index:1; text-indent:-9999px; }
.layer .pu_con .word { position:relative; background:#7b7b7b; color:#fff; padding:0 15px; height:30px; line-height:30px; }
.layer .pu_con .exp { position:relative; padding:10px; color:#3c3c3c; line-height:20px; }

ul.profile-list { position:relative; display:table; width:100%; *zoom:1; }
ul.profile-list:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }
ul.profile-list li { position:relative; display:inline-block; float:left; padding:7px 0; vertical-align:top; width:60%; font-size:14px; line-height:18px; }
ul.profile-list li.year { width:20%; }
ul.profile-list li.age { width:20%; }

ul.exp-note-list { position:relative; display:table; width:100%; border-bottom:1px solid #eaa9c0; }
ul.exp-note-list li { position:relative; display:inline; float:left; padding:7px 0; vertical-align:top; width:80%; font-size:14px; line-height:18px; color:#000; padding:15px 0 5px; border-bottom:1px solid #dedede; margin-bottom:-1px; *zoom:1; }
ul.exp-note-list li:after { content: "."; clear:both; display:block; height:0; visibility:hidden; }
ul.exp-note-list li.name { color:#c10044; padding:15px 1% 5px; font-weight:normal; text-align:left; vertical-align:top; width:18%; border:0;}
ul.exp-note-list em.pm { float:left; width:20%; color:#c10044; text-align:center; }
ul.exp-note-list span { float:left; width:80%; }
#toTop { display:none; position:fixed; bottom:0; right:0; width:100%; overflow:hidden; height:43px; line-height:43px; color:#fff; background:url(../images/gotop_bg.png); text-align:center; font-size:14px; font-weight:bold; z-index:100}

@media screen and (max-width:800px) {
#wrap { width:100%; min-width:700px; }
#header { position:relative; width:100%; }
#header h1 { left:20px; }
#header .menu { left:160px; }
#ph_area { position:relative; width:630px; margin:0 auto; height:570px; }
#ph_area .tit { position:absolute; top:24px; left:0; width:100%; text-align:center; }
#ph_area .phs { position:absolute; top:190px; left:0px; width:100%; height:500px; }
#ph_area .phs li.po01 { top:0; left:72px; }
#ph_area .phs li.po02 { top:0; left:210px; }
#ph_area .phs li.po03 { top:0; left:348px; }
#ph_area .phs li.po04 { top:0; left:486px; }
#ph_area .phs li.po05 { top:110px; left:0; }
#ph_area .phs li.po06 { top:110px; left:138px; }
#ph_area .phs li.po07 { top:110px; left:276px; }
#ph_area .phs li.po08 { top:110px; left:414px; }
#ph_area .phs li.po09 { top:220px; left:72px; }
#ph_area .phs li.po10 { top:220px; left:210px; }
#ph_area .phs li.po11 { top:220px; left:348px; }
#ph_area .phs li.po12 { top:220px; left:486px; }
#con_list .wrap { position:relative; width:100%; }
#con_list .wrap .column01 { position:relative; float:left; width:25%; padding:0 0 0 10%; }
#con_list .wrap .column02 { position:relative; float:right; width:45%; padding:0 10% 0 5%; min-height:0; }
#con_list .wrap .column02.first { margin-right:0; padding-top:5px; }

#sub_menu .wrap { width:94%; padding:0 3%; }
#sub_contents .wrap { width:92%; padding:40px 4%; }
.profile .ph {  width:40%; margin:0; }
.profile .tx { width:55%; margin:0; }
.profile .tx .tit { margin-bottom:40px; }
.profile .tx .name { margin-bottom:40px; }

.route .tx { width:30%; }
.route .map { width:60%; }

.story .ph { width:20%; margin:0; }
.story .tx { width:75%; margin:0; }

.participation .tit { width:25%; margin:0; }
.participation .tx { width:70%; margin:0; }

.explanatory-note .wrap { width:92%; padding:45px 4% 0; }
.explanatory-note .wrap .tit { width:20%; margin:0; }
.explanatory-note .wrap .tx { width:75%; margin:0; }
	
.intro-note .wrap { width:92%; padding:45px 4% 0; }
.intro-note .wrap .tit { width:20%; margin:0; }
.intro-note .wrap .tx { width:75%; margin:0; }

}
@media screen and (max-width:480px) {
#wrap { width:100%; min-width:310px; }
#header { position:relative; width:100%; }
#header h1 { left:10px; }
#header .menu { left:150px; }
.sub_tit { display:none; }
#ph_area { position:relative; width:100%; height:170px; }
#ph_area .tit { position:absolute; top:35px; left:0; width:100%; text-align:center; }
#ph_area .tit img { height:85px; }
#ph_area .phs { display:none; }
#con_list .wrap .column01 .menu { display:none; }
#con_list .wrap .column01 { width:84%; padding:0 8%; }
#con_list .wrap .column02 { width:84%; padding:0 8%; border:0; }

#footer img { height:30px; }

.sub_tit02 { display:block; }

#sub_contents .wrap { padding:25px 0; }
#sub_menu .wrap ul { margin-left:-4px; }

.profile .ph { width:100%; }
.profile .tx { width:100%; }
.profile .tx .tit { margin:25px 0; }
.profile .tx .name { margin-bottom:25px; }

.route .tx { width:100%; margin-bottom:20px; }
.route .tx dt { margin-bottom:10px; }
.route .map { width:100%; text-align:center; }

.story .ph { width:100%; margin:0 0 20px 0; }
.story .ph img { width:50%; }
.story .tx { width:100%; margin:0; }

.participation .tit { width:100%; margin:0 0 20px 0; }
.participation .tx { width:100%; margin:0; }

.explanatory-note .wrap { padding:30px 4% 0; }
.explanatory-note .wrap .tit { width:100%; margin:0 0 20px 0; }
.explanatory-note .wrap .tx { width:100%; margin:0; }

.intro-note .wrap { padding:30px 4% 0; }
.intro-note .wrap .tit { width:100%; margin:0 0 20px 0; }
.intro-note .wrap .tx { width:100%; margin:0; }
	
ul.profile-list li { width:58%; }
ul.profile-list li.year { width:22%; }

ul.exp-note-list li { width:70%; }
ul.exp-note-list li.name { width:28%; }
}