/* media screen max-width: 1200px미만 ----------*/
@media screen and (max-width: 1200px) {

    body {
      font-family: 'paybooc-Medium';
      background: #FFF5F5;
    }
    
    .bg2 {
      visibility: hidden;    
    }
    .dogsm {
      padding: 0;
      color: orangered;
      font-family: 'paybooc-Medium';
      line-height:25px; 
      font-weight: 900;
      margin-top: 3px;  
      margin-bottom: 7px;
    }
    .title {
      font-family: 'paybooc-Medium';
        font-weight:900;
        font-size:20px;
        line-height:25px; 
        text-align:center; 
        color:#ff0077;
      
    }
    
    .subtitle {
      font-family: 'paybooc-Light';
        font-size:14px;
        font-weight:700;   
        line-height:21px;     
        text-align:center; 
        color:rgb(71, 71, 71);
        background:#ffedf1;
         width:290px;
         border:#ffe1e7 solid 11px;
        display:block; border-radius:10px;
        margin:0 auto 20px;
        padding:10px 10px 0;  
    }
    
    .dog2 {
      position: absolute;  
      top:5px;
      left:50%;
      transform: translate(-50%, 0);
      margin: 0 auto;
      width: 110px;
      }
    .section {  
      width: 290px;
      margin:70px auto -10px;
    }
   
  .messagediv {
    background: #ffdae6;
    padding-top: 10px;
    width: 95%;
    border-radius: 10px;
    margin:10px auto;
    display: block;
    border:dotted 3px rgb(255, 132, 88);
  } 
    
  .file-upload {
    background-color: #ffe4df;
    width: 290px;
    height: 80%;
    border-radius: 10px;
    border: solid 0 #f6f7fa;
    margin: 0 auto;
    padding: 20px;
  }
  .drag-text h3 {
    font-weight: 900;    font-size:20px;
    text-transform: uppercase;
    color: #ff7149;
    padding: 60px 0;
  }
  .remove-image {
    width: 100%;
    margin:0 auto 0; display:block;
    color: #fff;
    background: #ff80a9;
    border: none;
    padding: 10px;
    border-radius: 5px;
    transition: all .2s ease;
    outline: none;
    text-transform: uppercase;
    font-weight: 500; font-size:16px;
   }
    
  
   #loading {
    background: transparent;
    width: 45%;
    height: 45%;
    display: block;
    position: absolute;
    top:40%;
    left:50%;
    transform: translate(-50%, -60%);
    border: 10px solid white;
    opacity: 0.8;
   }
   .loader {
    display: block;
    width: 100%;
    height: 10%;
    background-color: white;
    position: relative;
    animation-name: example;
    animation-duration: 0.7s;
    animation-iteration-count:infinite;
    animation-direction: alternate;
   }
   @keyframes example {
    0%   {background-color:white; left:0; top:0;} 
    100% {background-color:white; left:0; top:60%;  height: 40%;
    }
   }
  
  .result-message {
    width: 100%;
    margin-bottom:5px;
    color: #ff7149;
    font-weight: 900;
    font-size:14px;
    padding:0 35px;
  }
  .result-smessage {
    width: 100%;
    display:block; 
    margin:auto;
    color: #5dab6d;
    padding: 0 0 10px;
    font-weight: 900; 
    font-size:17px;
  }
  .file-upload-image {
    width: 100%;
    margin: auto;
    padding: 5px;
    border-radius: 50%;
  }
  .image-upload-wrap {
    margin: 5px;
    position: relative;
    object-fit: contain;
    border-radius: 10px;
    border: 5px dashed pink;
    background-color: #ffffff;
  }
  .file-upload-content{
    margin-bottom: -5px;
  }
  #label-container {
      width: 95%;
      margin: 0 auto;
  }  
  
  .bar-container{
     width: 100%;   
     height: 40px;
  
  }
  .percent-text {
    margin:3px 0 0 20px;
   font-size: 17px;
   color: #ff0077;
   font-weight:500;
   font-family: 'paybooc-ExtraBold';
  }  
  
    
    
  }