/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   .xi_sub      { width             : 100%;             height              : auto;             display             : flex;             flex-direction      : column;
                  align-items       : center;           justify-content     : center;           font-size           : min(1.6vw,16px);  font-family         : "Noto Sans kr";
                  margin            : 0 0 6em;}
   .xi_sub .wrap
                { width             : 95%;             height              : auto;             display             : flex;             flex-direction      : column;
                  align-items       : center;           justify-content     : center;           max-width           : 1100px;}                  
   .xi_sub .wrap .pageName
                { line-height       : 1em;              margin       : 2em 0 1.5em;              font-weight         : 600;              font-size           : 2.5em;
                  color             : #333;}
   .xi_sub .wrap img
                { width             : 100%;             height              : auto;}                   
   
   .xi_sub .wrap .caution_box             
                { width             : 100%;             height              : auto;             padding             : 1em;  
                  border            : 1px #c1d4dd solid; background         : #e6f1f6;          margin-top          : 1em;} 
   .xi_sub .wrap .caution_box pre
                { white-space       : pre-wrap;         font-family         : "Noto Sans kr";   font-size           : inherit;
                  font-weight       : 300;              color               : #555;}
   .xi_sub .wrap .tabWrap
                { width             : 100%;             height              : auto;             display             : flex;             flex-direction      : column;
                  align-items       : center;           justify-content     : flex-start;       gap                 : 1.5em;}
   .xi_sub .wrap .tabWrap .tabBtnWrap
                { width             : 100%;             height              : auto;             display             : flex;             flex-wrap           : wrap;
                  align-items       : stretch;          justify-content     : center;           gap                 : 1em;              }
   .xi_sub .wrap .tabWrap .tabBtnWrap .tabBtn
                { line-height       : 1em;              padding             : 1em 0;            cursor              : pointer;          transition          : .2s;
                  color             : #555;             border              : 1px solid #ddd;   font-weight         : 500;              font-size           : 1.2em;
                  text-align        : center;           word-break          : keep-all;         display             : flex;             align-items         : center;
                  justify-content   : center;}
   .xi_sub .wrap .tabWrap .tabBtnWrap .tabBtn.on
                { background        : #002d45;          color               : #fff;             pointer-events      : none;         }
   .xi_sub .wrap .tabWrap .tabBtnWrap .tabBtn:hover
                { background        : #005f70;          color               : #fff;             transition          : .2s;}
   .xi_sub .wrap .tabWrap .tabContentWrap
                { width             : 100%;             height              : auto;}
   .xi_sub .wrap .tabWrap .tabContentWrap .tabContent
                { width             : 100%;             height              : auto;             display             : none;}
   .xi_sub .wrap .tabWrap .tabContentWrap .tabContent.on
                { display           : flex;}
   .xi_sub .wrap .tabWrap .tabContentWrap .tabContent img
                { opacity           : 0;                }
   .xi_sub .wrap .tabWrap .tabContentWrap .tabContent.on img                 
                { opacity: 0;                /* 처음은 안 보이게 */
                  animation: fadeIn 0.3s linear forwards;}
   
      
   .xi_sub#sub2-6 .wrap .tabWrap .tabBtnWrap .tabBtn
                { min-width         : 15em;}
   .xi_sub#sub3-1 .wrap .tabWrap .tabBtnWrap .tabBtn
                { width             : calc(calc(100% - 6em) / 7);}             
                
                

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}                
     
   

@media(max-width:1024px){
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   .xi_sub      { font-size         : min(2.5vw,14px);} 
   
   .xi_sub#sub2-6 .wrap .tabWrap .tabBtnWrap .tabBtn
                { width             : calc(calc(100% - 2em) / 3);   min-width         : unset;}
    
}                  


@media(max-width:640px){
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   .xi_sub      { font-size         : max(10px,3vw);    margin-bottom       : 5em;} 
   .xi_sub .wrap .pageName
                { font-size         : 1.6em;} 
   .xi_sub .wrap .tabWrap .tabBtnWrap
                { gap               : 0.5em;}                
   .xi_sub .wrap .tabWrap .tabBtnWrap .tabBtn
                { font-size         : 1em;}    
   .xi_sub#sub2-6 .wrap .tabWrap .tabBtnWrap .tabBtn
                { width             : calc(calc(100% - 1em) / 3);   min-width         : unset;}                
   .xi_sub#sub3-1 .wrap .tabWrap .tabBtnWrap .tabBtn
                { width             : calc(calc(100% - 3em) / 7);}              
                            
}  



@media(max-width:300px){
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */           
   .xi_sub#sub3-1 .wrap .tabWrap .tabBtnWrap .tabBtn
                { width             : calc(calc(100% - 1.5em) / 4);}              
                            
}