@charset "utf-8";
/* ---------- 레이아웃 스타일 ---------- */


/* wrap */
#wrap{position:relative; width:100%; padding-top:100px; overflow:hidden; box-sizing:border-box}
#wrap:after{content:''; display:block; clear:both}

/* header */
#header{position:absolute; top:0; right:0; left:0; height:100px; background-color:#fff; z-index:9}

/* header */
.header_top{position:relative; width:1200px; height:100px; margin:0 auto}
.header_top .logo{position:absolute; top:23px; left:0; z-index:99999}
.header_top .logo a{display:block; width:196px; height:52px; background:url("../images/common/logo.png") no-repeat 50% 50%; background-size:196px 52px; transition:all .30s ease}

.header_top .local_util{position:absolute; top:29px; right:0; z-index:3}
.header_top .local_util:after{content:''; display:block; clear:both}

.header_top .member{display:block; position:relative; float:left; max-width:225px; height:40px; line-height:40px; margin-right:18px; color:#101010; font-size:14px; letter-spacing:-0.2px; font-weight:normal; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.header_top .member strong{color:#101010; font-weight:normal}

.header_top .util{float:left}
.header_top .util_list li{position:relative; float:left; margin-left:18px}
.header_top .util_list li:first-child{margin-left:0}
.header_top .util_list li a{display:block; height:40px; line-height:40px; letter-spacing:-1px; font-size:14px; color:#101010; font-weight:normal; box-sizing:border-box}
.header_top .util_list li i{margin-top:-2px; margin-right:5px; font-size:24px; vertical-align:middle}

.header_top .util_list li.allmenu a{padding-left:26px}
.header_top .util_list li.allmenu a strong{font-weight:normal}
.header_top .util_list li.allmenu a span{content:''; position:absolute; left:0; width:20px; height:2px; background:#101010; transition:all .30s ease}
.header_top .util_list li.allmenu a span:nth-child(1){top:13px}
.header_top .util_list li.allmenu a span:nth-child(3){top:25px}
.header_top .util_list li.allmenu a strong:after{content:''; position:absolute; left:0; top:19px; width:20px; height:2px; background:#101010; transition:all .30s ease}


/* allmenu */
.allmenu_btn{display:none; position:absolute; top:17px; right:10px; z-index:99999}
.allmenu_btn .allmenu_toggle{display:block; position:relative; width:46px; height:46px; border:1px solid #fff; box-sizing:border-box}
.allmenu_btn .allmenu_toggle:before,
.allmenu_btn .allmenu_toggle:after{content:''; position:absolute; left:50%; width:22px; height:2px; background:#101010; margin-left:-11px; transition:all .20s ease}
.allmenu_btn .allmenu_toggle:before{top:12px}
.allmenu_btn .allmenu_toggle:after{bottom:12px}
.allmenu_btn .allmenu_toggle strong{display:block; position:absolute; top:21px; left:50%; width:14px; height:2px; margin-left:-11px; background:#101010; transition:all .20s ease}
.allmenu_btn .allmenu_toggle.active strong{display:none}
.allmenu_btn .allmenu_toggle.active:before{transform: translateY(0.9rem) rotate(-45deg); top:8px}
.allmenu_btn .allmenu_toggle.active:after{transform: translateY(0.9rem) rotate(45deg); bottom:34px}

.allmenu{display:none; position:absolute; left:0; top:0; width:100%; background:#101010; z-index:9999}
.allmenu.active{display:block}
.allmenu .allmenu_top{position:relative; height:80px; background:#fff}
.allmenu .allmenu_inner{position:relative; padding:30px 20px 0; z-index:99999}
.allmenu .util{position:relative}
.allmenu .util:after{content:''; display:block; clear:both}
.allmenu .util .core{display:flex; align-items:center; position:relative; min-height:40px; margin:0 0 15px; box-sizing:border-box}
.allmenu .util .core:after{content:''; display:block; clear:both}
.allmenu .util .core .account{position:relative; line-height:145%; color:#fff; font-family:gwb; font-size:18px; font-weight:normal; letter-spacing:-1px}
.allmenu .util .core .account strong{font-weight:normal}
.allmenu .util .core .global{position:absolute; right:0; top:0; display:block; padding:8px 15px; line-height:135%; border:1px solid #313131; font-size:14px; color:#fff; letter-spacing:-0.8px; border-radius:120px}
.allmenu .util .core .global i{margin-top:-2px; margin-right:5px; font-size:24px; vertical-align:middle}
.allmenu .util .core .global span{vertical-align:middle}
.allmenu .util .sign{position:relative; border:1px solid #313131}
.allmenu .util .sign:before{content:''; position:absolute; left:50%; top:50%; width:1px; height:20px; margin-top:-10px; background:#313131}
.allmenu .util .sign:after{content:''; display:block; clear:both}
.allmenu .util .sign li{position:relative; float:left; width:50%}
.allmenu .util .sign li a{display:block; padding:15px 0; line-height:135%; color:#fff; font-size:14px; font-weight:normal; text-align:center; letter-spacing:-1px; box-sizing:border-box}
.allmenu .util .sign li a i{margin-top:-2px; margin-right:5px; font-size:24px; vertical-align:middle}
.allmenu .util .sign li a span{vertical-align:middle}

#allmenu_gnb{position:relative; margin-top:20px}
#allmenu_gnb .menu{position:relative; border-bottom:1px solid #313131; margin-left:-20px; margin-right:-20px}
#allmenu_gnb .menu > li{border-top:1px solid #313131}
#allmenu_gnb .menu > li > a{display:block; position:relative; padding:15px 50px 15px 20px; line-height:165%; color:#fff; font-family:gwb; font-size:22px; font-weight:300; letter-spacing:-1px; cursor:pointer; transition:all .30s ease}
#allmenu_gnb .menu > li.depth_sub > a:after{content:'\e941'; position:absolute; right:25px; top:50%; margin-top:-11px; line-height:135%; font-family:xeicon; font-size:18px; font-weight:300; transform:rotate(0deg); transition:all .35s ease}
#allmenu_gnb .menu > li.depth_sub.active > a:after{transform:rotate(-180deg)}

#allmenu_gnb .depth2{display:none}
#allmenu_gnb .depth2 > li{border-top:1px solid #404040}
#allmenu_gnb .depth2 > li > a{display:block; position:relative; padding:15px 50px 15px 20px; line-height:165%; background:#303030; color:#fff; font-family:gwb; font-size:20px; font-weight:normal; letter-spacing:-1px; cursor:pointer; transition:all .30s ease}

#allmenu_gnb .depth3{display:block; padding:20px 0; background:#222224; border-top:1px solid #404040}
#allmenu_gnb .depth3:after{content:''; clear:both; display:block}
#allmenu_gnb .depth3 > li{float:left; width:50%; padding-left:20px; box-sizing:border-box}
#allmenu_gnb .depth3 > li > a{display:inline-block; position:relative; padding:8px 0 8px 15px; line-height:135%; color:#fff; font-family:gwb; font-size:16px; font-weight:normal; letter-spacing:-1px; cursor:pointer; transition:all .30s ease}
#allmenu_gnb .depth3 > li > a:before,
#allmenu_gnb .depth3 > li > a:after{content:''; position:absolute; left:0; top:0; background:#808080}
#allmenu_gnb .depth3 > li > a:before{left:0; top:15px; width:1px; height:6px}
#allmenu_gnb .depth3 > li > a:after{left:0; top:20px; width:7px; height:1px}

.allmenu_open{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(255,255,255,.5); z-index:100}
.allmenu_open.active{display:block}



/* gnb */
#gnb{position:absolute; top:0; left:0; width:100%; height:100px; z-index:2}

#gnb .gnb_inner{position:relative; height:100px; text-align:center}

#gnb .gnb_inner:after{content:''; display:block; clear:both}
#gnb .gnb_menu{display:inline-block; margin-left:-305px; overflow:hidden}
#gnb .gnb_menu > li{float:left; text-align:center}
#gnb .gnb_menu > li > a{display:block; height:100px; margin:0 25px; padding-top:25px; color:#101010; letter-spacing:-1px; font-family:gwb; font-size:22px; font-weight:300; transition:all .30s ease; box-sizing:border-box}
#gnb .gnb_menu > li > a span{display:inline-block; position:relative; padding:5px 0; line-height:165%}
#gnb .gnb_menu > li:hover > a{color:#3f0b9f}

#gnb .gnb_depth{display:none; position:absolute; left:0; top:100px; width:100%; background:#fff; border-top:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0; z-index:90}
#gnb .gnb_depth.active{display:block}
#gnb .gnb_depth .depth_wrap{position:relative; width:1200px; margin:0 auto; box-sizing:border-box}
#gnb .gnb_depth .depth_wrap .inner{padding:40px 0}

#gnb .gnb_depth .depth2_list{display:flex; justify-content:center; margin-left:-55px; overflow:hidden; box-sizing:border-box}
#gnb .gnb_depth .depth2_box{margin-left:55px}
#gnb .gnb_depth .depth2_box .depth2_tit{display:block; transition:all .30s ease}
#gnb .gnb_depth .depth2_box .depth2_tit .tit{display:block; position:relative; line-height:150%; font-family:gwb; font-weight:300; font-size:20px; color:#101010; letter-spacing:-1px; box-sizing:border-box; transition:all .30s ease}
#gnb .gnb_depth .depth2_list > li:hover .depth2_box .depth2_tit .tit{color:#3f0b9f}

#gnb .gnb_depth .depth3_list > li{margin-top:8px}
#gnb .gnb_depth .depth3_list > li:first-child{margin-top:20px}
#gnb .gnb_depth .depth3_list > li > a{display:inline-block; position:relative; padding:4px 0; line-height:150%; color:#808080; font-family:gwb; font-weight:300; font-size:18px; letter-spacing:-1px; box-sizing:border-box; transition:all .30s ease}
#gnb .gnb_depth .depth3_list > li > a:hover{color:#3f0b9f}
#gnb .gnb_depth .depth3_list > li > a:before{content:''; position:absolute; left:50%; bottom:0; width:0; height:1px; background:#3f0b9f; transition:all .30s ease}
#gnb .gnb_depth .depth3_list > li > a:hover:before{width:100%; margin-left:-50%}


/* container */
#mcontainer{position:relative}
#mcontainer:after{content:''; display:block; clear:both}
#scontainer{position:relative}
#scontainer:after{content:''; display:block; clear:both}


/* main contents */
#mcontents{position:relative}
#mcontents:after{content:''; display:block; clear:both}
#mcontents .mcontents_inner{position:relative; min-height:600px; box-sizing:border-box}
#mcontents .dev_contents{position:relative}


/* sub contents */
#scontents{position:relative}
#scontents:after{content:''; display:block; clear:both}
#scontents .scontents_inner{position:relative; min-height:600px; box-sizing:border-box}
#scontents .scontents_inner:after{content:''; display:block; clear:both}
#scontents .dev_contents{position:relative; width:1200px; margin:0 auto; padding:80px 0; box-sizing:border-box}


/* footer */
#footer{position:relative; padding-bottom:50px; background:#101010}
#footer:after{content:''; display:block; clear:both}

/* footer_fnb */
.footer_fnb{position:relative; height:auto; background:#101010; border-bottom:1px solid #494a4d}
.footer_fnb .fnb_inner{position:relative; width:1200px; margin:0 auto; box-sizing:border-box}
.footer_fnb .fnb_area{position:relative; padding:80px 0}
.footer_fnb .fnb_area > ul:after{content:''; display:block; clear:both}
.footer_fnb .fnb_area > ul > li{float:left; width:20%; height:318px; padding:0 30px; border-left:1px solid rgba(255,255,255,.1); box-sizing:border-box}
.footer_fnb .fnb_area > ul > li:last-child{border-right:1px solid rgba(255,255,255,.1)}
.footer_fnb .fnb_area > ul > li > .in_box > a{display:block; position:relative; padding:0 0 15px; color:#fff; line-height:100%; font-size:28px; font-family:gwb; font-weight:normal; text-align:center; letter-spacing:-2.5px}
.footer_fnb .fnb_area > ul > li > .in_box > a span{display:block}
.footer_fnb .fnb_area .depth2{padding:10px 0}
.footer_fnb .fnb_area .depth2 > li a{display:block; position:relative; padding:5px 0; color:rgba(255,255,255,.6); line-height:155%; font-size:18px; font-family:gwb; font-weight:normal; text-align:center; letter-spacing:-1px; transition:all .30s ease}
.footer_fnb .fnb_area .depth2 > li a:after{content:''; position:absolute; left:-31px; top:0; width:1px; height:0; background:#fff; transition:all .20s ease}
.footer_fnb .fnb_area .depth2 > li a:hover{color:rgba(255,255,255,1)}
.footer_fnb .fnb_area .depth2 > li a:hover:after{height:100%}
.footer_fnb .fnb_area .depth3{position:relative; padding:5px 0 8px; box-sizing:border-box}
.footer_fnb .fnb_area .depth3 > li > a{display:block; position:relative; padding:2px 0; padding-left:12px; text-align:left; color:rgba(255,255,255,.6); letter-spacing:-0.8px; font-size:13px; line-height:150%; transition:all .30s ease}
.footer_fnb .fnb_area .depth3 > li > a span{font-weight:normal; letter-spacing:normal}
.footer_fnb .fnb_area .depth3 > li > a:hover{color:rgba(255,255,255,1)}
.footer_fnb .fnb_area .depth3 > li > a:before,
.footer_fnb .fnb_area .depth3 > li > a:after{content:''; position:absolute; background:rgba(255,255,255,.4)}
.footer_fnb .fnb_area .depth3 > li > a:before{left:0; top:6px; width:1px; height:6px}
.footer_fnb .fnb_area .depth3 > li > a:after{left:0; top:12px; width:6px; height:1px}

.footer_fnb .mblock{padding:35px 20px 0; text-align:center}
.footer_fnb .mblock .mguide{display:inline-block; color:#909090}

/* footer_contents */
.footer_contents{position:relative; width:1200px; margin:0 auto; padding-top:82px; box-sizing:border-box}
.footer_contents .f_fnmk_logo{display:block; position:absolute; left:0; top:30px; width:196px; height:52px; background:url("../images/common/f_fnmk_logo.png") 50% 50% no-repeat; background-size:196px 52px}
.footer_contents .f_muse_logo{display:block; position:absolute; right:81px; top:37px; width:159px; height:38px; background:url("../images/common/f_muse_logo.png") 50% 50% no-repeat; background-size:159px 38px}

/* footer_link */
.footer_link{position:relative; margin-bottom:12px; height:61px; box-sizing:border-box}
.footer_link .link_service:after{content:''; display:block; clear:both}
.footer_link .link_service li{position:relative; float:left; padding:0 20px; box-sizing:border-box}
.footer_link .link_service li:after{content:''; position:absolute; right:0; top:50%; width:1px; height:14px; margin-top:-7px; background:#494a4d}
.footer_link .link_service li:first-child{padding-left:0}
.footer_link .link_service li:last-child:after{display:none}
.footer_link .link_service li a{display:inline-block; height:60px; line-height:60px; letter-spacing:-0.2px; font-size:15px; font-weight:normal; color:#909090; transition:all .20s ease}
.footer_link .link_service li a:hover{color:#fff}
.footer_link .link_site{position:absolute; top:12px; right:0}
.footer_link .site_jump{position:relative}
.footer_link .site_jump .jump_toggle{display:block; position:relative; width:240px; height:45px; margin:0; padding-left:20px; padding-right:45px; text-align:left; background-color:#303030; cursor:pointer; border:1px solid #909090; box-sizing:border-box}
.footer_link .site_jump .jump_toggle:after{content:''; position:absolute; right:22px; top:50%; width:12px; height:7px; margin-top:-3.5px; background:url("../images/common/jumpsite_arrow.png") 50% 50% no-repeat; background-size:12px 7px; transition:all .30s ease}
.footer_link .site_jump .jump_toggle > span{display:inline-block; color:#e0e0e0; font-size:14px; line-height:43px; letter-spacing:-0.2px}
.footer_link .site_jump .jump_toggle.active:after{transform:rotate(-180deg)}
.footer_link .site_jump .jump_list{display:none; position:absolute; right:0; bottom:45px; width:100%; max-height:325px; padding:0 15px; overflow-y:auto; border:1px solid #909090; border-bottom:none; background:#303030; box-sizing:border-box; z-index:9}
.footer_link .site_jump .jump_list ul{border-top:1px solid #fff; padding:10px 0}
.footer_link .site_jump .jump_list ul:first-child{border-top:none}
.footer_link .site_jump .jump_list ul li{padding:5px 0}
.footer_link .site_jump .jump_list a{display:inline-block; font-size:14px; color:#909090; letter-spacing:-0.8px; line-height:150%; transition:all .20s ease}
.footer_link .site_jump .jump_list a:hover{color:#fff}

/* footer_info */
.footer_info{position:relative}
.footer_info .address{position:relative}
.footer_info .address:after{content:''; display:block; clear:both}
.footer_info .address li{margin-bottom:3px; color:#707070; letter-spacing:-0.2px; line-height:150%; font-size:14px; box-sizing:border-box}
.footer_info .address li:last-child{margin-bottom:0}
.footer_info .address i{font-style:normal}
.footer_info .address a{color:#fff}
.footer_info .copyright{position:absolute; right:0; bottom:0; color:#707070; font-weight:normal; font-size:13px; line-height:150%; letter-spacing:-0.2px}


/* sfocus */
.sfocus{position:relative; border-top:1px solid #e0e0e0; box-sizing:border-box}
.sfocus:after
{
    content:''; position:absolute; left:0; top:0; width:100%; height:150px; background:#000;
    background:-webkit-linear-gradient(-0deg, rgba(0,0,0,0), rgba(0,0,0,0.3)); background:-moz-linear-gradient(-0deg, rgba(0,0,0,0), rgba(0,0,0,0.3)); background:linear-gradient(0deg, rgba(0,0,0,0), rgba(0,0,0,0.3));
    display:none
}

.sfocus .sfocus_top{position:relative; width:1200px; margin:0 auto; padding-top:30px}
.sfocus .sfocus_visual{position:relative; height:400px; background-size:cover; background-position:50% 50%; background-repeat:no-repeat; transition:all .30s ease}
.sfocus .sfocus_visual.intro{background-image:url("../images/common/sfocus_visual_intro.jpg")}
.sfocus .sfocus_visual.activity{background-image:url("../images/common/sfocus_visual_activity.jpg")}
.sfocus .sfocus_visual.member{background-image:url("../images/common/sfocus_visual_member.jpg")}
.sfocus .sfocus_visual.education{background-image:url("../images/common/sfocus_visual_education.jpg")}
.sfocus .sfocus_visual.news{background-image:url("../images/common/sfocus_visual_news.jpg")}
.sfocus .sfocus_visual.utility{background-image:url("../images/common/sfocus_visual_utility.jpg")}


/* current_location */
.current_location{position:relative; min-height:34px; z-index:1}
.current_location .location_hero{position:relative; padding-left:40px}
.current_location .location_hero .home{display:flex; align-items:center; justify-content:center; position:absolute; top:0; left:0; width:34px; height:34px; background:rgba(0,0,0,.4); border-radius:50%; box-sizing:border-box}
.current_location .location_hero .home:after{content:'\e902'; color:#fff; font-family:xeicon; font-size:18px}

.current_location .location_hero > ul:after {content:''; display:block; clear:both}
.current_location .location_hero > ul > li{position:relative; float:left; height:34px; box-sizing:border-box}

.current_location .location_hero > ul > li .deth{display:block; padding:0; height:34px; line-height:34px; letter-spacing:-0.8px; font-size:16px; color:#fff; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.current_location .location_hero > ul > li span.deth{margin-left:0; padding:0 20px 0 5px}
.current_location .location_hero > ul > li span.deth:after{content:'\e93e'; display:flex; align-items:center; position:absolute; right:0; top:0; height:34px; color:rgba(255,255,255,.5); font-family:xeicon; font-size:14px; font-weight:300}
.current_location .location_hero > ul > li span.deth span{display:none}
.current_location .location_hero > ul > li span.deth span.active{display:block}
.current_location .location_hero > ul > li:last-child span.deth:after{display:none}

.current_location .location_hero > ul > li button.deth{position:relative; width:100%; margin-left:5px; padding:0 40px 0 0; color:#fff; letter-spacing:-0.8px; border:0; border-radius:0; background:none; cursor:pointer; box-sizing:border-box}
.current_location .location_hero > ul > li button.deth:after{content:'\e941'; position:absolute; right:0; top:0; width:34px; height:34px; color:#fff; font-family:xeicon; font-size:10px; font-weight:300; border:1px solid #dadada; border-radius:50%; box-sizing:border-box; transform:rotate(0deg); transition:all .30s ease}
.current_location .location_hero > ul > li.active button.deth:after{transform:rotate(-180deg)}
.current_location .location_hero > ul > li button.deth span{display:none}
.current_location .location_hero > ul > li button.deth span.active{display:block}


.current_location .dynamic_depth{display:none; position:absolute; top:100%; left:8px; z-index:8}
.current_location .dynamic_depth .dynamic_list{display:none; margin-top:5px; background:#fff; padding:10px 0; border:1px solid #101010}
.current_location .dynamic_depth .dynamic_list li a{display:block; position:relative; line-height:150%; color:#101010; padding:6px 25px; font-size:14px; font-weight:normal; letter-spacing:-0.8px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; transition:all .30s ease}
.current_location .dynamic_depth .dynamic_list li a:hover{color:#3f0b9f}
.current_location .dynamic_depth .dynamic_list.active{display:block}


/* page_tit */
.page_tit{display:flex; justify-content:center; margin-top:35px; box-sizing:border-box}
.page_tit .tit{display:block; line-height:135%; font-family:gwb; font-size:48px; color:#fff; font-weight:normal; letter-spacing:-2.5px; transition:all .30s ease}
.page_tit .tit .eng{top:-6px; position:relative; font-family:gmk; font-size:46px; font-weight:300}
.page_tit:after{content:''; clear:both; display:block}


/* expand_content */
.expand_photo_message{width:1200px; margin:0 auto}
.expand_board{background:#fff}
.expand_board .board_inner{width:1200px; margin:0 auto; padding:80px 0; box-sizing:border-box}