@charset "utf-8"; /* submenu -wide04 */
/*@latest 2022.06.24 jra */
/*@latest 2022.07.04 jra */
/*@latest 2022.07.19 jra */


/* sub visual */
#sub_visual { width: 100%; height: auto; float: left; overflow: hidden; position: relative; background: #000; transition: all 1s; line-height: 250px; text-align: center; } 
#sub_visual img {width: 100%; min-height: 100%; display: block; width: 100%; min-height: 100%; opacity: 0.9; display: block; position: absolute; left: -999px; right: -999px; bottom: -999px; top: -999px; margin: auto;} 
#sub_visual .bluebg { min-height: 80px; width: 100%; max-width: 1300px; margin: 30px auto 0; height: 100%; color: white; position: relative; text-align: left; vertical-align: middle; } 
#sub_visual .sub_titbox { width: 100%; margin: 0 auto; box-sizing: border-box; display: inline-block; text-align: center; } 
#sub_visual .sub_titbox .bTitle { font-size: 30px; line-height: 120%; letter-spacing: -0.5px; font-weight: 600; color: white; width: 100%; max-width: 1300px; margin: 0 auto; padding: 0 15px; box-sizing: border-box; } 
#sub_visual .sub_titbox .bContent { display: block; width: 100%; max-width: 1300px; margin: 20px auto 0; box-sizing: border-box; padding: 0 15px; font-size: 16px; font-weight: 400; color: white; line-height: 150%; clear: both; } 

@media (max-width:990px){
 #sub_visual { line-height: normal; } 
 #sub_visual .bluebg { margin: 30px 0;} 
 }

@media (min-width:800px) and (max-width:990px){
 #sub_visual .sub_titbox .bTitle { font-size: 30px; } 
 }

@media (max-width:799px){
 #sub_visual { line-height: normal; } 
 #sub_visual .sub_titbox .bTitle { font-size: 25px; font-weight: 400; } 
 }

@media (max-width:599px){
 #sub_visual img { opacity: 0.8; } 
 #sub_visual .sub_titbox .bContent { font-size: 15px; margin-top: 10px; word-break: keep-all; } 
 }

/* layout */
.sub_div_wrap { width: 100%; float: left; margin: 0 auto; box-sizing: border-box; position: relative; } 

@media (min-width:991px){
 .subMenu,
 .subCon { width: 100%; } 
 }

@media (max-width:990px){
 .subMenu { display: none; } 
 }


/* sub Menu */
.subMenu { height: 60px; line-height: 60px; margin: 0 auto; box-sizing: border-box; position: relative; margin-top: -60px; border-top: 1px solid rgba(255, 255, 255, 0.3); } 
.subMenu h3.menuNm { display: none; } 
.subMenu .slidebar { display:none; } 

/* sub Contents */
.subCon { float: left; width: 100%; position: relative; box-sizing: border-box; margin-bottom: 30px; border-top: 1px solid #efefef; } 

/* sub location */
.subCon .location { box-sizing: border-box; max-width: 1300px; margin: 0 auto; } 
.subCon .location>li {float: left;list-style: none;position: relative;} 
.subCon .location>li>a {color: #fff;opacity: 0.8;border-width: 0;box-sizing: border-box;display: inline-block;vertical-align: middle;position: relative;} 
.subCon .location>li:nth-child(4)>a { font-weight: 600; } 
.subCon .location > li ul {width: 100%;opacity: 0;padding: 0;background: #f9f9f9;box-sizing: border-box;position: absolute;z-index: 1;} 
.subCon .location>li ul>li {list-style: none;position: relative;min-width: 100%;line-height: 40px;border: 1px solid rgb(224 224 224);border-width: 0 1px 0;box-sizing: border-box;} 
.subCon .location>li ul>li:last-child {
    border-width: 0 1px 1px;
} 
.subCon .location > li ul li a { width: 100%; padding: 0 35px 0 15px; margin: 10px 0; border-width: 0; box-sizing: border-box; display: inline-block; color: #333; font-size: 16px; line-height: 140%; word-break: keep-all; vertical-align: middle; } 
.subCon .location > li ul li.deepest>a { color: #3b4624; font-weight: 600; } 
.subCon .location > li ul li>ul li a { padding: 0 15px; font-size: 15.5px; } 
.subCon .location > li ul li>ul>li.deepest>a { color: #3b4624; font-weight: 600; } 
.subCon .location>li ul li a span.bull { display: none; } 
.subCon .location>li ul li:not(.deepest)>a:hover { text-decoration: underline; } 
.subCon .location>li ul>li>a>span:after { content: ""; width: 10px; height: 10px; border: 1px solid rgba(0,0,0,0.8); border-width: 0 1px 1px 0; position: absolute; right: 18px; opacity: 0.6; top: 14px; transform: rotate(-45deg); } 
.subCon .location>li ul>li.deepest>a>span:after { content: ""; } 
.subCon .location li a{word-wrap: break-word;word-break: keep-all;text-overflow: ellipsis;}

/*unactive 2depts's 3depts menu ul*/
.subCon .location>li ul li ul {position: absolute;top: 0;left: 100%;} 


/* 3 depts open (not active page) */
.subCon h4.tit { font-size: 18px; box-sizing: border-box; padding-bottom: 15px; display: block; width: 100%; max-width: 1300px; margin: 0 auto; } 
.subCon>div { width: 100%; display: block; clear: both; box-sizing: border-box; max-width: 1300px; margin: 0 auto; } 


/* 메뉴 클릭시 서브메뉴 드롭다운 */
.subCon .location>li.selected>ul {visibility: visible;overflow: visible;opacity: 1;transform: rotateX(0) rotateY(0);} 
.subCon .location>li ul>li.selected>ul { visibility: visible; opacity: 1; transform: rotateX(0) rotateY(0); } 
 


 
@media (min-width:991px) { /* .subCon .location>li ul li:not(.deepest):hover ul { display: block!important; } */
 .subCon .location { margin-top: -61px; height: 60px; } 
 .subCon .location>li {height: 60px;line-height: 60px;width: auto;max-width: 33%;border-right: 1px solid rgba(255, 255, 255, 0.3);} 
 .subCon .location>li>a {width: 100%;font-size: 17px;padding: 0 60px 0 15px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} 
 .subCon .location>li:not(.home)>a:after { content: ""; width: 10px; height: 10px; border: 1px solid rgba(255, 255, 255, 0.9); border-width: 0 0 1px 1px; position: absolute; font-weight: 600; opacity: 0.6; transform: rotate(-45deg); right: 17px; top: 22px; } 
 .subCon .location>li:nth-child(2)>a:after { content: ""; border-width: 1px 1px 0 0; top: 27px; border-color: rgba(255, 255, 255, 0.9); } 
 .subCon .location>li.home { min-width: auto; color: #fff; border-left: 1px solid rgba(255, 255, 255, 0.3); } 
 .subCon .location>li.home:before { content: "\f015"; font-family: FontAwesome; border: rgba(255, 255, 255, 0.2); border-width: 0 1px; float: left; padding: 0 20px; font-size: 20px; } 
 .subCon .location>li.home a { width: 60px; height: 60px; font-size: 0; margin: 0 0 0 -60px; padding: 0; } 
 .subCon .location>li ul>li:not(:first-child) ul{border-top: 1px solid rgb(224 224 224);}
 
 /* hover fx*/
 .subCon .location>li>ul {visibility: hidden;opacity: 0;transition: 0.5s cubic-bezier(0, 0, 0.2, 1);transform: rotateX(-90deg) rotateY(0);transform-origin: 0 0;} 
 /* .subCon .location>li:hover>ul { display: block; visibility: visible; opacity: 1; transform: rotateX(0) rotateY(0); } */
 .subCon .location>li>ul:hover>li { display: block; } 
 .subCon .location>li ul>li>ul {visibility: hidden;opacity: 0;/* transition: 0.5s ease-in-out; */transform: rotateX(0) rotateY(-90deg);transform-origin: 0 0;} 
 /* .subCon .location>li ul>li:hover>ul { visibility: visible; opacity: 1; transform: rotateX(0) rotateY(0); } */
 
 .subCon h4.tit { font-size: 22px; padding: 100px 0 30px; margin-bottom: 20px; text-align: center; border-bottom: 1px solid #ddd; } 
 }

@media (max-width:990px){
 .subCon { border-top: none;} 
 .subCon .location {top: -50px;left: 0;height: 40px;line-height: 40px;width: 100%;overflow: hidden;background: #f9f9f9;border-bottom: 1px solid #f0f0f0;} 
 .subCon .location>li {float: left;font-size: 15px;background-size: 10px;padding: 0;vertical-align: middle;border-right: 1px solid #dcdde2;height: 40px;overflow: hidden;position: static;width: calc(33.333% - 17px);} 
 .subCon .location>li>a {position: relative;padding: 0 32px 0 10px;line-height: 40px;float: left;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 100%;box-sizing: border-box; color:#000;} 
 .subCon .location>li>a:after {content: "";width: 7px;height: 7px;padding: 0;display: inline-block;border: 1px solid #7b7e97;border-width: 0 1px 1px 0;transform: rotate(225deg);float: right;position: absolute;right: 13px;top: 50%;margin-top: -1px;color: #333;} 
 .subCon .location>li:nth-child(2) ~ li >a:after {transform: rotate(45deg);margin-top: -5px;} 
 .subCon .location li.home a:after { display:none; } 
 .subCon .location li.home {background: url("/sample/template/wide/wide002/img/home.png")no-repeat 0px 0px;font-size: 0;background-position: center;position: relative;width: 47px;} 
 .subCon .location li.ftbd { font-weight: 800; } 
 .subCon .location li:last-child:after { display: none; } 
 .subCon .location>li>ul {display: none;/* position: absolute; */z-index: 18;left: 0;top: 40px;width: 100%;max-height: calc(60vh - 40px);overflow-y: scroll!important;padding: 7px 0px;background: #fff;box-shadow: 0 6px 9px rgb(0 0 0 / 10%); opacity:1;} 
 .subCon h4.tit { padding: 30px 10px 10px; } 
 .subCon>div { padding: 0 10px; } 
 .subCon .location>li>ul>li { border: none; background: #fff; border-bottom: 1px solid #e5e5e5; border-radius: 0; float: left; width: 100%; } 
 .subCon .location>li>ul>li>a { padding: 13px 30px 13px 46px; font-weight: 500; font-size: 15px; width: 100%; box-sizing: border-box; line-height: 140%; margin:0; display:block; color: #3b4624; } 
 .subCon .location>li>ul>li>a:focus { outline: auto; border: 1px solid #333 !important; } 
 .subCon .location>li>ul>li>ul { padding: 10px 30px 10px 35px; border-bottom: 1px solid #eee; border-top: none; float: left; } 
 .subCon .location>li>ul>li.selected>a { font-weight: 600; background: #3b4624; } 
 .subCon .location>li>ul li ul { display: none; background: #f7f7f7; opacity:1; } 
 .subCon .location>li ul>li>a>span:after { right: 18px; top: 16px; transform: rotate(45deg); } 
 .subCon .location>li>ul>li.selected>a>span:after { opacity:1; border-color: #fff; top: 22px; transform: rotate(-135deg); } 
 .subCon .location>li ul li ul { border:none; position: relative; top: 0; left: 0; margin-left: 0; } 
 .subCon .location>li>ul>li>ul li a {padding-bottom: 7px;font-weight: 400;display: block;color: #333;padding: 7px 10px;font-size: 15px;letter-spacing: -0.5px;border: none;line-height: 140%;  margin:0;} 
 .subCon .location>li ul li:not(.deepest):hover ul { display: none; } 
 .subCon .location>li ul li:not(.deepest)>a:hover { text-decoration: none; } 
 .subCon .location>li>ul>li.selected>a { color: #ffff; } 
 .subCon .location>li ul>li:last-child{border-bottom:0;}
 .subCon .location>li ul>li{border-right:0;}
 .subCon .location>li:nth-child(4){border-right:0;}
}


@media (max-width:599px) {
 .subCon .location li:after { font-size: 11px; padding: 0; margin-left: 7px; } 
 }


/* sub Visual : none */

.sub_visual_None~.inner #sub_visual { height: 60px; } 
.sub_visual_None~.inner #sub_visual .sub_titbox .bTitle { display: none; } 
.sub_visual_None~.inner #sub_visual .sub_titbox .bContent { display: none; } 
.sub_visual_None~.inner .sub_div_wrap { border-top: 1px solid #efefef; } 
.sub_visual_None~.inner .sub_div_wrap .subMenu { margin-top: -1px; background: rgba(0, 0, 0, 0.5); } 

@media (max-width:990px){
 .sub_visual_None~.inner #sub_visual { height: 38px; } 
 }
