@charset "utf-8";


#wrapper {width:100%;}


#header {width:100%;background:#fff; border-top: 3px solid #FEB300;}
#header > .inner {position:relative;width: 1200px;height: 80px;margin:0 auto;box-sizing: border-box;}
#header > .inner:after {content:"";display:block;height:0;clear:both;}

#header .logo {float:left;padding-top: 18px;}
#header .logo a {display:block;width:187px;height: 46px;background:url(/phtrauma/resources/homepage/main/images/common/logo.png) no-repeat center center;background-size:cover;text-indent:-9999px;}

#gnb {float:right; /* padding-right:105px;*/}
#gnb .gnb_list {padding-top:25px; padding-right:50px; float:left;}
#gnb .gnb_list .dep1 {position:relative;float:left;margin-left:55px;}
#gnb .gnb_list .dep1:hover .dep2_list_wrap {display:block;}
#gnb .gnb_list .dep1:hover .dep1_txt {color:#027FFF;text-decoration:none;}
#gnb .gnb_list .dep1:hover:after {content:"";position:absolute;bottom:0;left:50%;margin-left:-25px;right:0;display:inline-block;width:50px;height:3px;background:#027FFF;}
#gnb .gnb_list .dep1_txt {display:block;height:55px;color:#212121;font-size:18px;color:#333;font-weight: bold;}
#gnb .gnb_list .dep2_list_wrap {display:none;}
#gnb .gnb_list .dep2_list {position:absolute;top:100%;left:50%;width:160px;padding:10px 0;margin-left:-80px;border-radius:8px;background:#fff;text-align:center;box-sizing:border-box;z-index:10;}
#gnb .gnb_list .dep2_list .dep2:first-child {border-top:0;}
#gnb .gnb_list .dep2_list .dep2 .dep2_txt {display:block;padding:6px 10px;color:#555;}

/*#gnb .gnb_list .dep1_txt:hover {color:#027FFF;text-decoration:none;}
#gnb .gnb_list .dep1_txt:hover:after {content:"";position:absolute;bottom:0;left:50%;margin-left:-25px;right:0;display:inline-block;width:50px;height:3px;background:#027FFF;}*/
#gnb .gnb_list .dep2_list .dep2 .dep2_txt.active {color:#000;text-decoration:underline;}
#gnb .gnb_list .dep1_txt.active + div {display:block;}

#gnb .gnb_other_btn {padding-top:20px; float:right;}
/* #gnb .gnb_other_btn a {display:block;width:40px;height:40px;text-indent: -9999px;} 
#gnb .gnb_other_btn .pc_login {background: url(/sites/phtrauma/images/common/ico_login.png) no-repeat 50% 50% #027FFF;}
#gnb .gnb_other_btn .pc_logout {background: url(/sites/phtrauma/images/common/ico_logout.png) no-repeat 50% 50% #027FFF;}*/
#gnb .gnb_other_btn .pc_login, #gnb .gnb_other_btn .pc_logout {display:block;font-size: 14px;background: #FEB300;padding: 8px 10px;border-radius: 3px;font-weight: 600;}

/* 모바일 */
#mobileMenu {display:none;}
.mobile_other_btn {display:none}





/* footer */
#footer {width:100%;background:#fff;border-top: 1px solid #ccc;overflow:hidden;}
.f_inner {position:relative;width:1200px;margin:0 auto;padding:0 30px;box-sizing: border-box;}
.f_nav {float:left;width:40%;padding-top:20px;}
.f_nav a {display:inline-block;color:#555;font-size:14px;}
.f_nav .cut {display:inline-block;margin:-2px 6px 0 12px;width:1px;height:12px;background:#b3b3b3;vertical-align:middle;}
.f_nav .highlight {color:#d42a2a;}

.f_info {float:right;width:60%;padding:20px 0;text-align: right;}
.f_info p {color:#888;font-size:14px;word-break: keep-all;word-wrap:break-word;}
.f_info p .space {display:inline-block;width:15px;}
.f_info .f_msg {padding-top:20px;}

.m_cut {display:none;}


/*동영상*/
#board .bbs_view_default .video_wrap {text-align:center;margin:15px auto 0;padding-bottom:15px;border-bottom:1px solid #eee;}



/* 테블릿 */
@media screen and ( max-width:1024px ){
    
   #wrapper {min-width:320px;overflow:hidden;}

	#header {position:relative;}
	#header > .inner {width: 100%;height:60px;padding:0 3%;}

	#header .logo {/* padding: 13px 0 12px; */padding-top: 7px;}
	

	#gnb .gnb_list {display:none;}
	#gnb .gnb_other_btn{display:none;}

	#mobileMenu {position:fixed;top:0;right:-250px;width:250px;bottom:0;background:#fff;z-index:900;}
    #mobileMenu .mobile_menu_close {position:absolute;top:10px;left:-20px;width:13px; height: 13px;}
    
    .mobile_menu_top {height:50px;background:#253072;}
    .mobile_menu_top.login_on {height:50px;}
    .mobile_menu_top.login_on + .mobile_menu_list_wrap {top:50px;}
    .mobile_menu_top > a {display:inline-block;height:50px;padding:0 10px;line-height:50px;}
    .mobile_menu_top > a img {vertical-align:middle;}
    .mobile_menu_top .login_btn, .mobile_menu_top .mypage {color:#fff;font-size:1em;}
    
    .mobile_menu_list_wrap {position:absolute;top:0;bottom:0;width:100%;background:#fff;overflow-y:auto;}
    .mobile_menu_list .dep1 {border-bottom:1px solid #ccc;}
    .mobile_menu_list .dep1_txt {display:block;padding:0 20px;width:100%;height:50px;font-size:1em;font-weight:bold;text-align:left;word-break:keep-all;background:url(../images/common/view-next.png) no-repeat 95% center;border-bottom:1px solid #ccc;}
    
    .mobile_menu_list .dep1_sub_menu {display:none;background:#fff;overflow-y:auto;}
	.mobile_menu_list .dep1.active .dep1_sub_menu {display:block;}
    .mobile_menu_list .dep1_sub_menu .dep2_txt {display:block;width:100%;padding:12px 12px 12px 30px;background: url(/sites/phtrauma/images/common/dot-list.png) no-repeat 15px 50%;font-size:0.875em;color:#666;background-color:#f5f5f5;line-height:1.2;text-align:left;box-sizing:border-box;word-break:keep-all;}
  
	.mobile_other_btn {position:absolute;display:block;top:10px;right:0;z-index:12;overflow: hidden;}
	.mobile_other_btn a {display:inline-block; float:left; text-decoration: none;}
    .mobile_other_btn .m_all_menu_btn {width:40px;height:40px;background:url(../images/common/ico-menu-m.png) no-repeat center;text-indent:-9999px;}
    .mobile_other_btn .m_login, .mobile_other_btn .m_logout {font-size: 0.875em;padding: 10px 0 0 20px;margin-right:8px;border-radius: 3px;font-weight: 600;color: #005b9a;}
	.mobile_other_btn .m_login {background: url(../images/common/icon_login.png) no-repeat 0% 100%;}
	.mobile_other_btn .m_logout {background: url(../images/common/icon_login.png) no-repeat 0% 100%;}
	.mobile_menu_bg {position:fixed;display:none;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.4);z-index:890;}

    
    



    


    
}



/* 모바일 */
@media screen and ( max-width:768px ){

	#header .logo {padding-top: 6px;}
	#header .logo a {width: 150px;background-size: contain;}

	.f_inner {width:100%;padding:10px;}
	.f_nav {float:none;width: 100%;padding-top:0;}
	.f_info {float:none;width: 100%;text-align:left;padding:10px 0 0;}
	.f_info p {font-size:0.875em;}
  
	.m_cut {display:block;}

	#topGo {bottom:3%;right:3%;}
	#topGo a {width:50px;height:50px;line-height:50px;font-size:12px;}

}



@media screen and ( max-width:320px ){
  
		.f_nav .cut {margin: -2px 6px 0 8px;}
}