/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #subNav_3Tier
                { width             : 100%;             height              : auto;             display             : flex;             align-items         : flex-end;         
                  justify-content   : flex-end;         font-size           : 16px;             font-family         : "Noto Sans Kr";   aspect-ratio        : 1920 / 515;
                  position          : relative;         min-height          : 400px;            z-index             : 20;}
   #subNav_3Tier .subTopImage
                { width             : 100%;             height              : 100%;             object-fit          : cover;            position            : absolute;     
                  top               : 0;                left                : 0;                z-index             : 1;    }
   #subNav_3Tier .subTopImage.tab,
   #subNav_3Tier .subTopImage.mobile
                { display           : none;}
   #subNav_3Tier .wrap
                { width             : 90%;              height              : 65px;             display             : flex;             align-items         : center;
                  justify-content   : flex-start;       background          : #00000080;        max-width           : 1600px;           z-index             : 2;                }                          
   #subNav_3Tier .wrap .subMenuWrap
                { width             : auto;             height              : 100%;             display             : flex;             align-items         : center;
                  justify-content   : center;}             
   #subNav_3Tier .wrap .subMenuWrap .homeWrap
                { width             : auto;             height              : 100%;             display             : flex;             align-items         : center;
                  justify-content   : center;           background          : #000;             aspect-ratio        : 1 / 1;}
   #subNav_3Tier .wrap .subMenuWrap .homeWrap a 
                { width             : 100%;             height              : 100%;             display             : flex;             align-items         : center;
                  justify-content   : center;}
   #subNav_3Tier .wrap .subMenuWrap .homeWrap a img
                { width             : auto;             height              : 40%;              object-fit          : contain;}                                                             
   #subNav_3Tier .wrap .subMenuWrap .navWrap
                { width             : auto;             height              : 100%;             width               : 200px;}
   #subNav_3Tier .wrap .subMenuWrap .navWrap .current
                { width             : auto;             display             : flex;             align-items         : center;           justify-content     : space-between;
                  height            : 100%;             padding             : 0 1em;            border-right        : 1px solid #ffffff4d;
                  cursor            : pointer;}
   #subNav_3Tier .wrap .subMenuWrap .navWrap .current p
                { line-height       : 1em;              color               : #fff;          word-break         : keep-all;         line-height         : 1.2em;}                            
   #subNav_3Tier .wrap .subMenuWrap .navWrap .current .iconWrap
                { width             : 1em;              height              : 1em;             display             : flex;             align-items         : center;
                  justify-content   : center;           position            : relative;}         
   #subNav_3Tier .wrap .subMenuWrap .navWrap .current .iconWrap svg
                { color             : #fff;             position            : absolute;         top                 : 50%;              left                : 50%;
                  transform         : translate(-50%,-50%); transition      : .2s;}             
   #subNav_3Tier .wrap .subMenuWrap .navWrap:hover .current .iconWrap svg.none      
                { opacity           : 0;                transition          : .2s;}
       
   #subNav_3Tier .wrap .subMenuWrap .navWrap .navListWrap
                { width             : auto;             height              : auto;             display             : flex;             flex-direction      : column;
                  align-items       : flex-start;       justify-content     : flex-start;       background          : #fff;             border              : 1px solid #E4E4E4;
                  box-shadow          : 3px 3px 7px rgba(0, 0, 0, .1);    
                  opacity           : 0;                pointer-events      : none;}              
   #subNav_3Tier .wrap .subMenuWrap .navWrap:hover .navListWrap   
                { opacity           : 1;                pointer-events      : auto;             transition          : .2s;}                
   #subNav_3Tier .wrap .subMenuWrap .navWrap .navListWrap .navList
                { margin-bottom     : 1em;            line-height         : 1.2em;              font-weight         : 300;              transition          : .2s;
                  width             : 100%;           padding             : 0 1em;            word-break          : keep-all;}                 
   #subNav_3Tier .wrap .subMenuWrap .navWrap .navListWrap .navList:first-child
                { margin-top        : 1.1em;}
   #subNav_3Tier .wrap .subMenuWrap .navWrap .navListWrap .navList:hover
                { color             : #00a5e5;          transition          : .2s;}
                  
@media(max-width:1024px){                 
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #subNav_3Tier
                { font-size         : 14px;             aspect-ratio        : 1 / 0.4;          min-height          : 350px;}
   #subNav_3Tier .wrap
                { width             : 100%;             max-width           : 900px;            height              : 50px;}              
   #subNav_3Tier .subTopImage.tab
                { display           : block;}
   #subNav_3Tier .subTopImage.pc,
   #subNav_3Tier .subTopImage.mobile
                { display           : none;}        
}                

@media(max-width:767px){                 
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #subNav_3Tier .wrap
                { padding           : 0 10px;}
   #subNav_3Tier .wrap .subMenuWrap .homeWrap
                { display           : none;}


}

@media(max-width:640px){                 
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #subNav_3Tier
                { font-size         : 13px;             aspect-ratio        : 1 / 0.6;            min-height          : unset;          max-height          : 350px;}
   #subNav_3Tier .wrap
                { height            : 40px;}
   #subNav_3Tier .subTopImage.mobile
                { display           : block;}
   #subNav_3Tier .subTopImage.pc,
   #subNav_3Tier .subTopImage.tab
                { display           : none;} 
   #subNav_3Tier .wrap .subMenuWrap
                { width             : 100%;             justify-content     : flex-start;}
   #subNav_3Tier .wrap .subMenuWrap .navWrap
                { width             : 50%;}
  
   #subNav_3Tier .wrap .subMenuWrap .navWrap:hover .current .iconWrap svg.none
                { opacity           : 1;}
   #subNav_3Tier .wrap .subMenuWrap .navWrap .current.second
                { border-right      : none;}               
   #subNav_3Tier .wrap .subMenuWrap .navWrap.on .current .iconWrap svg.none 
                { opacity           : 0;                transition          : .2s;}
   #subNav_3Tier .wrap .subMenuWrap .navWrap:hover .navListWrap
                { opacity           : 0;                pointer-events      : none;}
   #subNav_3Tier .wrap .subMenuWrap .navWrap.on .navListWrap
                { opacity           : 1;                pointer-events      : auto;             transition          : .2s;}              

}