/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #sub1-3.sungshin_sub .titText
                { text-align        : center;           width               : 90%;              word-break          : keep-all;}
   #sub1-3 .articleWrap
                { padding           : 4em 0 10em;       background          : #f7f7f7;          gap                 : 1.6em;
                  overflow          : auto;             scroll-snap-type: y mandatory;}
   #sub1-3 .articleWrap .listWrap
                { width             : auto;             height              : auto;             display             : flex;
                  flex-direction    : column;           align-items         : flex-start;       justify-content     : flex-start;
                  gap               : 2.5em;              max-width           : 90%;              position            : relative;
                  
                 
  }
   #sub1-3 .articleWrap .listWrap .line
                { width             : 1px;              height              : 100%;             background          : #999999;
                  position          : absolute;         top                 : 0;                left                : 11em;}
   #sub1-3 .articleWrap .listWrap .line .circle
                { width             : 1em;              height              : 1em;              border-radius       : 50%;
                  border            : 5px solid #fff;   background          : #980000;          filter              : drop-shadow(0px 0px 3px #0000004d);
                  position          : absolute;         top                 : -0.5em;                left                : 50%;
                  transform         : translateX(-50%); transition          : .2s;}
                  
   #sub1-3 .articleWrap .listWrap .list
                { width             : 100%;             height              : auto;             display             : flex;
                  align-items       : flex-start;       justify-content     : flex-start;       opacity             : .3;
                  min-height        : 6em;              scroll-snap-align: start;}
   
   #sub1-3 .articleWrap .listWrap .list.on 
                { opacity           : 1;                transition          : .2s;}
   #sub1-3 .articleWrap .listWrap .list .listYearWrap
                { width             : 11em;             padding-top         : 2.5em;}
   #sub1-3 .articleWrap .listWrap .list .listYear
                { font-size         : 2.5em;            line-height         : 1em;              font-weight         : 800;
                  color             : #980000;          }                  
   #sub1-3 .articleWrap .listWrap .list .listYear.mob
                { display           : none;}                                 
   #sub1-3 .articleWrap .listWrap .list .listMonthWrap
                { width             : calc(100% - 14.5em); display             : flex;             flex-direction      : column;
                  align-items       : flex-start;       justify-content     : flex-start;       gap                 : 1.4em;
                  margin-left       : 3.5em;            border-top       : 1px solid #cccccc; padding-top      : 2.5em;                  
                  flex-grow         : 1;                padding-left        : 0.5em;}                             
   #sub1-3 .articleWrap .listWrap .list:first-child .listYearWrap
                { padding-top       : 0;}
   #sub1-3 .articleWrap .listWrap .list:first-child .listMonthWrap
                { border-top        : 0;                padding-top         : 0;}
   #sub1-3 .articleWrap .listWrap .list .listMonthWrap .listMonth
                { width             : auto;             height              : auto;             display             : flex;
                  align-items       : baseline;        justify-content     : flex-start;       }             
   #sub1-3 .articleWrap .listWrap .list .listMonthWrap .listMonth .month
                { width             : 5em;              font-weight       : 800;              line-height         : 1em;}     
   #sub1-3 .articleWrap .listWrap .list .listMonthWrap .listMonth .workWrap
                { width             : calc(100% - 5em); display             : flex;             flex-direction      : column;
                  align-items       : flex-start;       justify-content     : flex-start;       gap                 : 0.7em;}                     
   #sub1-3 .articleWrap .listWrap .list .listMonthWrap .listMonth .workWrap .work
                { line-height       : 1.4em;            word-break          : keep-all;}             
                


@media(max-width : 1024px){
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #sub1-3 .articleWrap
                { padding           : 4em 0 5em;}
   #sub1-3 .articleWrap .listWrap
                { gap               : 2em;}
   #sub1-3 .articleWrap .listWrap .list .listYearWrap,
   #sub1-3 .articleWrap .listWrap .list .listMonthWrap
                { padding-top       : 2em;}
   #sub1-3 .articleWrap .listWrap .list .listYear
                { font-size         : 2em;}  
    
}         

@media(max-width : 640px){
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #sub1-3 .articleWrap .listWrap
                { max-width         : 80%;              padding-bottom      : 3em;}
   #sub1-3 .articleWrap .listWrap .list
                { padding-left      : 2em;              min-height          : 12em;}                
   #sub1-3 .articleWrap .listWrap .list .listYearWrap
                { display           : none;}
   #sub1-3 .articleWrap .listWrap .list .listMonthWrap
                { width             : 100%;             margin-left         : 0;                padding-left        : 0;}  
   #sub1-3 .articleWrap .listWrap .line
                { left              : 0;}   
   #sub1-3 .articleWrap .listWrap .line .circle
                { border            : 3px solid #fff;}
   #sub1-3 .articleWrap .listWrap .list .listYear.mob
                { display           : block;            margin-bottom       : 0.5em;}                
                                 
}                              
                
                