/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #division3ASub 
                { width             : 100%;             height              : auto;             display             : flex;
                  background-image  : url("../../Image/division3ASub_back.jpg");
                  background-size   : cover;
                  background-position : center bottom;
                  background-repeat : no-repeat;                                                                                                                                }
   #division3ASub h2
                { font-size         : 0;                line-height         : 0;                                                                                                }
   
   #division3ASub .division3ASub_Box
                { width             : calc(100% / 3);   height              : auto;            text-align           : center;           padding             : 5% 0;  
                  transition        : .4s;                                                                                                                                      }
   #division3ASub .division3ASub_Box:hover
                { background        : #00000057;        transition          : .4s;                                                                                              }
   #division3ASub .division3ASub_Box.borderBox
                { border-left       : 1px solid #ffffff29; border-right     : 1px solid #ffffff29;                                                                              }
   #division3ASub .division3ASub_Box .division3ASub_icon    
                { width             : 100%;             height              : auto;                                                                                             }       
   #division3ASub .division3ASub_Box .division3ASub_icon img
                { width             : calc(25px + 1.6vw); height            : auto;            transition          : .8s;                                                       }              
   #division3ASub .division3ASub_Box:hover .division3ASub_icon .jello
                { -webkit-animation: jello-horizontal 0.9s both;
                   animation: jello-horizontal 0.9s both;                                                                                                                       }
   #division3ASub .division3ASub_Box:hover .division3ASub_icon .rotate
                { transform         : rotateY(360deg);  transition          : .8s;}
   #division3ASub .division3ASub_Box:hover .division3ASub_icon .bounce
                { -webkit-animation: bounce-top 0.9s both;
                    animation: bounce-top 0.9s both;                                                                                                                          }
   
   #division3ASub .division3ASub_Box .division3ASub_Tit
                { width             : 100%;             height              : auto;             font-size           : calc(12px + 0.5vw); color             : #fff000;   
                  padding-top       : 2%;               pointer-events      : none;                                                                                             }
   #division3ASub .division3ASub_Box .division3ASub_Text             
                { width             : 100%;             height              : auto;             font-size           : calc(12px + 0.3vw); color             : #fff;
                  font-weight       : 300;              pointer-events      : none;                                                                                             }
                
                
                
@-webkit-keyframes jello-horizontal {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
            transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
            transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@keyframes jello-horizontal {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
            transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
            transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@-webkit-keyframes bounce-top {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
  25% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
  50% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
  75% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
 
}
@keyframes bounce-top {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
  25% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
  50% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
  75% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
 
  }
 
}

@media (max-width:940px)  {
/* **************************************************************************************************************************************************************************** */
/*                                                                                                                                                                              */
/*                                                                                                                                                                              */
/*                                                                             1단 배경 Fixed                                                                                   */
/*                                                                                                                                                                              */
/*                                                                                                                                                                              */
/* **************************************************************************************************************************************************************************** */
/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
   #division3ASub 
                { flex-direction    : column;                                                                                                                                   }
   #division3ASub .division3ASub_Box
                { width             : 100%;                                                                                                                                     }
   #division3ASub .division3ASub_Box
                { border-left       : none;             border-right        : none;             border-top          : 1px solid #ffffff29; 
                  border-left       : 1px solid #ffffff29;                                                                                                                      }
                
                
                
 }               
                