/* A A A : A : A : A : */ #TitleMenu_LeftLogo_3_tier { width : 100%; height : auto; display : flex; align-items : center; justify-content : center; position : absolute; top : 0; left : 0; font-family : "Noto Sans Kr"; font-size : min(1.6vw, 17px); z-index : 100; transition : background .2s, color .2s, border .2s; border-bottom : 1px solid #fff; color : #fff;} #TitleMenu_LeftLogo_3_tier:hover, #TitleMenu_LeftLogo_3_tier.on { color : #000; background : #fff; border-bottom : 1px solid #ddd; transition : background .2s, color .2s, border .2s;} #TitleMenu_LeftLogo_3_tier .wrap { width : 98%; height : auto; display : flex; align-items : center; justify-content : flex-end; max-width : 1280px;} #TitleMenu_LeftLogo_3_tier .wrap .innerWrap { width : 100%; height : 100%; display : flex; justify-content : space-between; align-items : center;} #TitleMenu_LeftLogo_3_tier .wrap .logoWrap { width : auto; display : flex; align-items : flex-start; flex-grow : 1;} #TitleMenu_LeftLogo_3_tier .wrap .logoWrap a { width : 100%; height : auto; max-width : 60px;} #TitleMenu_LeftLogo_3_tier .wrap .logoWrap a img { width : 100%; height : auto; } #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap { width : auto; height : 120px; display : flex; align-items : center; justify-content : center;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .subNavWrapBack { width : 100%; height : auto; position : absolute; top : 100%; left : 0; background : #fff; opacity : 0; pointer-events : none; transition : .2s; border-bottom : 1px solid #ddd;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap:hover .subNavWrapBack { opacity : 1; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi { width : auto; height : 100%; display : flex; align-items : center; justify-content : center; cursor : default; } #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .mainNavLi_p { width : 100%; height : 100%; display : flex; align-items : center; justify-content : center; position : relative; padding : 0 1.2em; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .mainNavLi_p::after { content : ""; width : 100%; height : min(0.2em,4px); background : #0080ffb3; position : absolute; bottom : 0; left : 0; opacity : 0; pointer-events : none; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi:hover .mainNavLi_p::after { opacity : 1; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap { width : 100%; height : auto; display : flex; align-items : stretch; justify-content : center; position : absolute; top : 100%; left : 0; background : #fff; border-top : 1px solid #ddd; opacity : 0; pointer-events : none; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi:hover .subNavWrap { opacity : 1; pointer-events : auto; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap { width : 95%; height : auto; display : flex; align-items : stretch; justify-content : center; max-width : 1200px; } #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .leftWrap { width : 25%; height : auto; display : flex; flex-direction : column; align-items : flex-start; justify-content : flex-start; max-width : 300px; padding : min(4em,60px) 2em; border-right : 1px solid #ddd;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .leftWrap .linkWrap { width : auto; height : auto; display : inline-flex; flex-direction : column; align-items : flex-end; justify-content : center;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .leftWrap .subTitle { font-size : 2.3em; line-height : 1em; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .subWrap .subTitleLink { font-size : 1.1em; line-height : 1em; display : flex; align-items : center; justify-content : center; margin-top : 1.8em; font-weight : 500; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .subWrap .subTitleLink:hover { color : #0080ff; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .subWrap .subTitleLink span { background : #0080ff; color : #fff; line-height : inherit; padding : 0.2em 0.2em 0.23em;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .subWrap .subTitleLink p { width : 1.2em; height : 1.2em; display : flex; align-items : center; justify-content : center; border-radius : 50%; background : #0080ff; color : #fff;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .subWrap .subTitleLink p svg { font-size : 0.8em;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap { width : 75%; height : auto; display : flex; flex-direction : column; align-items : flex-start; justify-content : flex-start; max-width : 900px; padding : min(4em,60px);} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subTitleLink { display : none;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap { width : 100%; height : auto; display : flex; flex-wrap : wrap; gap : 2em 4em; align-items : center; justify-content : flex-start;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap.auto { height : auto;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList { width : auto; display : flex; flex-direction : column; font-size : 1.15em; line-height : 1em; align-items : flex-start; justify-content : flex-start; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList a { width : auto; transition : .2s; display : block;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList a:hover { color : #0080ffb3; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList.column { border-left : 2px solid #000; padding-left : 1em;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList.column .subMenuListWrapColumn { width : 100%; display : flex; flex-direction : column; align-items : flex-start; justify-content : flex-start; font-size : inherit; padding : 0.7em 0;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList.column .subMenuListWrapColumn .subMenuList { width : 100%; font-size : inherit; margin-bottom : 1.2em; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList.column .subMenuListWrapColumn .subMenuList:last-child { margin-bottom : 0;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList .thirdMenuListWrap { width : 100%; display : flex; flex-direction : column; align-items : flex-start; justify-content : center; padding-left : 0.2em; margin-top : 1em;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList .thirdMenuListWrap li { font-size : max(14px,0.75em); margin-bottom : 1em; line-height : 1em; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList .thirdMenuListWrap li:last-child { margin-bottom : 0;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList .thirdMenuListWrap li a { line-height : 1em; color : #666; transition : .2s; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList .thirdMenuListWrap li a:hover { color : #0080ffb3; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap { width : auto; display : flex; align-items : center; justify-content : flex-end; flex-grow : 1;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .divisionWrap { width : auto; display : flex; align-items : center; justify-content : center;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap #siteMap { width : 19px; height : 17px; display : flex; flex-direction : column; align-items : flex-end; justify-content : space-between; cursor : pointer;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap #siteMap span { width : 100%; height : 2px; background : #fff; display : block; transition : .2s;} #TitleMenu_LeftLogo_3_tier:hover .wrap .btnWrap #siteMap span, #TitleMenu_LeftLogo_3_tier.on .wrap .btnWrap #siteMap span { background : #000; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap #siteMap span:nth-child(2) { width : 80%;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .trans_lng { color : inherit; margin : 0 1.2em; line-height : 1em; font-weight : 500;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .contact { width : auto; height : auto; display : flex; align-items : center; justify-content : center; line-height : 1em; background : #00b8ff; color : #fff; padding : 0.55em 0.95em; border-radius : 7px; transition : .2s; font-size : max(12px,0.9em); font-weight : 500; overflow : hidden; position : relative; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .contact:hover { background : #0080ff; transition : .2s;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .contact img { height : 1.2em;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .contact::after { content : ''; width : 20px; height : 290px; left : 0%; bottom : 0%; transition : 0.3s; position : absolute; background-color : #fff; transform : rotate(45deg); animation-name : qnabackLink_ani; animation-duration : 3.5s; animation-delay : 0s; animation-timing-function: linear; animation-fill-mode : both; animation-iteration-count: infinite; background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 50%, rgba(255,255,255,0) 100%); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.7) 50%,rgba(255,255,255,0) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.7) 50%,rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 ); } @keyframes qnabackLink_ani { 0% { left : 0; bottom : -100%; } 70% { left : 500%; bottom : -1000%; } 100% { left : 500%; bottom : -1000%; } } #TitleMenu_LeftLogo_3_tier .wrap .btnWrap #mobileNavBtn { font-size : 2em; line-height : 1em; display : none;} /* 영어버전 메뉴 */ #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] { font-size : min(1.5vw, 15px); } #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .innerWrap { flex-wrap : wrap;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .logoWrap { width : 100%; justify-content : center; align-items : flex-end; height : 110px; padding-bottom : 5px;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .mainNavWrap { width : 80%; flex-grow : 1; margin-right : 1em; height :90px;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .mainNavWrap .mainNavLi .mainNavLi_p { text-align : center; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .leftWrap .subTitle, #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap .subMenuList a { line-height : 1.2em;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subMenuListWrap { grid-template-columns : repeat(3,calc(100% / 3));} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .btnWrap { width : auto; flex-grow : unset;} /* 사이트맵 */ #TitleMenu_LeftLogo_3_tier #siteMapWrap { width : 100%; height : 100vh; display : flex; align-items : center; justify-content : center; background : #fff; position : fixed; top : 0; left : 0; color : #000; opacity : 0; pointer-events : none; transition : .2s;} #TitleMenu_LeftLogo_3_tier #siteMapWrap.siteMapOn { opacity : 1; pointer-events : auto; transition : .2s;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap { width : 95%; height : 100%; display : flex; flex-direction : column; align-items : center; justify-content : flex-start; max-width : 1200px; padding : 3em 0;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .topWrap { width : 100%; height : auto; display : flex; align-items : center; justify-content : space-between; } #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .topWrap p { font-size : 2em; line-height : 1em; font-weight : 700; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .topWrap #siteMapCloseBtn { width : 2em; height : 2em; position : relative; cursor : pointer;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .topWrap #siteMapCloseBtn::before { content : ""; width : 1px; height : 100%; display : block; background : #777; position : absolute; top : 0; left : 50%; transform : translateX(-50%) rotate(45deg);} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .topWrap #siteMapCloseBtn::after { content : ""; width : 1px; height : 100%; display : block; background : #777; position : absolute; top : 0; left : 50%; transform : translateX(-50%) rotate(-45deg);} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap { width : 100%; height : auto; display : flex; align-items : flex-start; justify-content : center; margin-top : 4em; overflow : auto;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap { width : 100%; height : auto; display : flex; align-items : stretch; justify-content : center; min-height : 40vh;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList { width : calc(100% / 8); height : auto; display : flex; flex-direction : column; align-items : center; justify-content : flex-start; border-right : 1px solid #ddd;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList:last-child { border-right : none;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .centerWrap { width : auto; display : flex; align-items : flex-start; justify-content : flex-start; flex-direction : column; max-width : 80%;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList p { color : #0080ff; font-weight : 600; line-height : 1em; margin-bottom : 1.5em; font-size : 18px; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier[data-nav-mode='en'] #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList p { line-height : 1.2em; height : 2.4em; display : flex; align-items : center; justify-content : center;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .mapSubListWrap { width : 100%; height : auto; display : flex; flex-direction : column; align-items : flex-start; justify-content : flex-start; margin-bottom : 1.2em; } #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .mapSubListWrap .mapSubList, #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .mapSubListWrap .mapSubList a { font-weight : 400; color : #666; font-size : 16px; word-break : keep-all; line-height : 1.2em;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .mapSubListWrap .mapSubList a:hover { color : #0080ffb3;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .mapSubListWrap .mapSubList .mapThirdListWrap { width : 100%; height : auto; display : flex; flex-direction : column; align-items : flex-start; justify-content : flex-start; padding-left : 0.2em; margin : 0.1em 0 0.2em;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .mapSubListWrap .mapSubList .mapThirdListWrap .mapThirdList { margin-bottom : 0.2em; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .mapSubListWrap .mapSubList .mapThirdListWrap .mapThirdList a { color : #666666; font-weight : 400; font-size : 14px; word-break : keep-all;} #TitleMenu_LeftLogo_3_tier #siteMapWrap .wrap .mapListWrap .mapMainListWrap .mapMainList .mapSubListWrap .mapSubList .mapThirdListWrap .mapThirdList a:hover { color : #0080ffb3;} /* 모바일 메뉴 */ #TitleMenu_LeftLogo_3_tier #mobNavWrap { width : 100%; height : 100vh; display : none; flex-direction : column; align-items : center; justify-content : flex-start; position : fixed; top : 0; right : -100%; background : #fff; transition : .3s; color : #000;} #TitleMenu_LeftLogo_3_tier #mobNavWrap.navOn { right : 0; transition : .3s;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop { width : 100%; height : 90px; display : flex; align-items : center; justify-content : center; border-bottom : 1px solid #ddd;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap { width : 100%; height : 100%; display : flex; align-items : center; justify-content : space-between; padding : 0 min(2.2em,35px);} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .mobNavLogo { width : auto; height : 80%; display : flex; align-items : center; justify-content : center;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .mobNavLogo img { width : auto; height : 100%; object-fit : contain;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .topRightWrap { width : auto; height : 100%; display : flex; align-items : center; justify-content : flex-end;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .topRightWrap .trans_lngWrap { width : auto; height : auto; display : flex; align-items : stretch; justify-content : center; margin-right : 2em;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .topRightWrap .trans_lngWrap .mob_trans_lng { color : #777777; line-height : 1em;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .topRightWrap .trans_lngWrap .mob_trans_lng.active { color : #0080ff;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .topRightWrap .trans_lngWrap .line { width : 2px; height : auto; display : flex; margin : 0 0.5em; background : #e5e5e5;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .topRightWrap #mobNavCloseBtn { width : 2em; height : 2em; position : relative; cursor : pointer;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .topRightWrap #mobNavCloseBtn::before { content : ""; width : 1px; height : 100%; display : block; background : #777; position : absolute; top : 0; left : 50%; transform : translateX(-50%) rotate(45deg);} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap .topRightWrap #mobNavCloseBtn::after { content : ""; width : 1px; height : 100%; display : block; background : #777; position : absolute; top : 0; left : 50%; transform : translateX(-50%) rotate(-45deg);} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap { width : 100%; height : auto; padding : min(2.2em,35px); overflow : auto;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap { width : 100%; height : auto; font-size : 1.1em;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList { width : 100%; height : auto; } #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavMain { width : 100%; height : 3.2em; line-height : 1em; display : flex; align-items : center; justify-content : space-between; padding : 0 1em; font-weight : 700;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavMain svg { transition : .2s; } #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavMain.active svg { transform : rotate(180deg); transition : .2s; } #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap { width : 100%; height : 0; overflow : hidden; transition : .2s;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavSubList { width : 100%; height : auto; transition : .2s;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavSub { width : 100%; height : 3.2em; line-height : 1em; display : flex; align-items : center; justify-content : space-between; padding : 0 1em; background : #f7f7f7; color : #666; transition : .2s; font-weight : 500;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavSub.active { color : #0080ff;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavSub svg { transition : .2s; } #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavSub.active svg { color : #666; transform : rotate(180deg); transition : .2s; } #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavThirdListWrap { width : 100%; height : auto; padding : 0 1em; height: 0; overflow : hidden; transition : .2s;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavThirdListWrap .mobNavThirdList { font-size : max(12px,0.85em); padding-bottom : 0.5em;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavThirdListWrap .mobNavThirdList:first-child { padding-top : 0.3em;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavThirdListWrap .mobNavThirdList:last-child { padding-bottom : 1em;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap .mobNavMainListWrap .mobNavMainList .mobNavSubListWrap .mobNavThirdListWrap .mobNavThirdList a { line-height : 2em; color : #666666;} @media(max-width:1200px) { /* A A A : A : A : A : */ #TitleMenu_LeftLogo_3_tier .wrap { max-width : 1100px;} #TitleMenu_LeftLogo_3_tier .wrap .logoWrap { width : auto; flex-grow : unset;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .mainNavLi_p { padding : 0 1em;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .subNavWrapBack { transition : unset;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap:hover .subNavWrapBack { transition : unset;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .leftWrap { display : none;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap { width : 100%;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap.otium { padding : 0 0 min(4em,60px);} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap .subTitleLink { display : flex; margin : min(3em,40px) 0;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap { flex-direction : column; align-items : flex-start; justify-content : center; flex-grow : unset; width : auto;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .divisionWrap { margin-bottom : 0.7em;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .trans_lng { margin-right : 0; margin-left : 1em; } /* 영어버전 메뉴 */ #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .logoWrap { height : 90px; padding-bottom : 0;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .logoWrap a { max-width : 50px;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .mainNavWrap { height : 90px;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .mainNavWrap .mainNavLi .subNavWrap .subNavInnerWrap .rightWrap { padding : min(4em,45px);} } @media(max-width : 1024px){ /* A A A : A : A : A : */ #TitleMenu_LeftLogo_3_tier, #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] { font-size : min(2.3vw,15px); height : 90px;} #TitleMenu_LeftLogo_3_tier:hover { background : none; color : #fff; border-bottom : 1px solid #fff;} #TitleMenu_LeftLogo_3_tier.on:hover { background : #fff; color : #000; border-bottom : 1px solid #ddd;} #TitleMenu_LeftLogo_3_tier .wrap { width : 95%; height : 100%; justify-content : space-between;} #TitleMenu_LeftLogo_3_tier .wrap .logoWrap { height : 100%; align-items : center;} #TitleMenu_LeftLogo_3_tier .wrap .logoWrap a { width : auto; height : 70%; max-width : unset;} #TitleMenu_LeftLogo_3_tier .wrap .logoWrap a img { width : auto; height : 100%; object-fit : contain;} #TitleMenu_LeftLogo_3_tier .wrap .mainNavWrap { display : none;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap #mobileNavBtn { display : block;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .divisionWrap, #TitleMenu_LeftLogo_3_tier .wrap .btnWrap .contact { display : none;} #TitleMenu_LeftLogo_3_tier #mobNavWrap { display : flex;} #TitleMenu_LeftLogo_3_tier #siteMapWrap, #TitleMenu_LeftLogo_3_tier #siteMapWrap.siteMapOn { display : none;} /* 영어버전 메뉴 */ #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .innerWrap { flex-wrap : unset;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .logoWrap { width : auto; height : 100%; align-items : center;} #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] .wrap .btnWrap { width : auto; } } @media(max-width : 640px){ /* A A A : A : A : A : */ #TitleMenu_LeftLogo_3_tier, #TitleMenu_LeftLogo_3_tier[data-nav-mode="en"] { font-size : min(3.5vw,14px); height : 60px;} #TitleMenu_LeftLogo_3_tier .wrap .btnWrap #mobileNavBtn { color : #f7f7f7;} #TitleMenu_LeftLogo_3_tier.on .wrap .btnWrap #mobileNavBtn { color : #000;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop { height : 60px;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavTop .topWrap { padding : 0 1.2em;} #TitleMenu_LeftLogo_3_tier #mobNavWrap .mobNavListWrap { padding : 1.2em;} }