/* CSS Document */
@media screen and (max-width: 1800px)  {    
        .mother{
        width: 100%;
    height:500px;
}       
}
@media screen and (max-width: 1650px)  {

   .title-right img{
    width: 80%;
    margin-left: 20%;
}  
}
@media screen and (max-width: 1500px)  {
    .mother{
        width: 100%;
    height:450px;
} 
}
@media only screen and (max-width: 1440px) {   
    .title-right{
       top: 20px; 
    }
  .title-right img{
    width: 70%;
    margin-left: 30%;
}  
}
@media screen and (max-width: 1280px)  {
     .mother{
        width: 100%;
    height:400px;
}
          .nav-text1{
        font-size: 19px;
    }
      .title-right{
       top: 20px; 
    }
  .title-right img{
    width: 64%;
    margin-left: 36%;
}
      .Atext{
    font-size: 26px;
}  
    }
@media screen and (max-width: 1200px)  { 
     .mother{
        width: 100%;
    height:350px;
}
  .title-right img{
    width: 60%;
    margin-left: 40%;
}
    .Agift-text{
    font-size: 18px;
}
    .Agift1_bg,.Agift2_bg,.Agift3_bg,.Agift4_bg{
    padding: 5px;
}
}
@media screen and (min-width: 1100px)  {
    .title-right-mobile{
        display: none;
    }
}
@media screen and (max-width: 1100px)  {
    .title-right{
        display: none;
    }
    .title-right-mobile{
        display:block;
           position:absolute;
        width: 80%;
        margin: 0 10%;
    }
    .mother{
     background: url("images/bg_mother_mobile.jpg") bottom center no-repeat;
    background-size: 100% auto;
    height:1080px;
}
      .nav-text li{
        font-size: 18px;
        margin-top: 20px;
        margin-left: 10px;
    } 
  }
@media screen and (min-width: 768px) and (max-width: 991px){ 
    .boxCpic3_mt{
        margin-top: 30px;
    }
     .Agift1_bg:before,.Agift2_bg:before,.Agift3_bg:before,.Agift4_bg:before{
        background-size: 80%;
        width: 54px;
        height: 54px;
    }
     .boxB-title{
        margin-top: 10px;
        font-size: 17px;
    font-weight: 600;
    } 
    .AgiftM{
    display: block;
}
            .Agift-text{
          display: block;
             font-weight: bold;
        text-align: left;
            padding: 10px 0;
                height: 120px;
}
    .Agift{
       display: none; 
    }
}
@media screen and (max-width: 990px)  {
    .mother{
    height:980px;
}
   .title-right-mobile{
        width: 70%;
        margin: 0 15%;
    } 
    .date{
    font-size: 36px;
}
    .Agift{
    font-size: 16px;
    font-weight: bold;
}
    .Agift img{
        width: 90%;
    }
       .Atext{
           font-size: 24px;
    letter-spacing: -2px;
}
    .img-1{
    background: url("images/boxC_ribbon.png") no-repeat;
    background-size: 70%;
    width: 207px;
    height: 144px;
    right: -35px;
   bottom: -50px;
    z-index: 99;
}
    .icon{
        background-size: 80%;
}
  .copyright{
	padding:10px;
	font-size: 1rem;
}
    }
@media screen and (max-width: 950px)  {
     .mother{
    height:900px;
}
}
@media screen and (max-width: 910px)  {
   .nav-text li{
        font-size: 16px;
        margin-left: 5px;
    }
     }
@media screen and (max-width: 880px)  {
        .mother{
    height:820px;
}  
    .copy_block{
        display: block;
    }
}
@media screen and (max-width: 815px)  {
       .mother{
    height:800px;
}  
}
@media screen and (max-width: 770px)  {
       .mother{
    height:750px;
}  
    #nav {
        display: none; 
    } 
    .Atable{
        width: 94%;
        margin: 0 3%;
    }
        .Agift img{
        width: 169px;
    }    
    .date{
    font-size: 30px;
}
    .triangle-right {
  border-top: 12px solid transparent;
  border-left: 24px solid #c62221;
  border-bottom: 12px solid transparent;
    margin: 0 20px;
}
     .Atext{
           font-size: 22px;
    letter-spacing: -2px;
}
    .icon{
        width: 24px;
    height: 24px;
        background-size: 70%;
}
    .img-1{
        display: none;
}
    .notice{
    padding: 10px 20px ;
}
    .sidebar img{
        width: 120px;
    }
  }
@media screen and (max-width: 767px)  {  
    .button_bg{
  width: 30%;
        margin: 0 35%;
}
    .Atext{
        width: 100%;
        text-align: center;
    }
    .Agift1_bg,.Agift2_bg,.Agift3_bg,.Agift4_bg{
        margin: 10px;
}
    .Agift-text{
    font-size: 22px;
}
}
@media screen and (max-width: 720px)  {
        .mother{
    height:700px;
    } 
}
@media screen and (max-width: 650px)  {
        .mother{
    height:630px;
    } 
    .Atext{
        font-size: 24px;
}
}
@media screen and (max-width: 600px)  {
        .mother{
    height:650px;
             background-color: #f9d1d2;
}  
    .title-right-mobile{
        width: 90%;
        margin: 0 5%;
    }
    .button_bg{
  width: 40%;
        margin: 0 30%;
}
}
@media screen and (max-width: 550px)  {
         .mother{
    height:600px;
} 
     .ns img{
        width: 300px;
      margin-top: 10px;
    }     
        .date{
    font-size: 26px;
}
    .triangle-right {
  border-top: 10px solid transparent;
  border-left: 20px solid #c62221;
  border-bottom: 10px solid transparent;
    margin: 0 10px;
}
     .Atext{
           font-size: 20px;
    letter-spacing: -2px;
}   
    .icon{
        width: 22px;
    height: 22px;
        background-size: 70%;
}
     .img-1{
         background-repeat: no-repeat;
           background-size: 70%;
    }
}
@media screen and (max-width: 500px)  { 
         .mother{
    height:550px;
} 
  .button_bg{
  width: 50%;
        margin: 0 25%;
}
  }
@media screen and (max-width: 450px)  {
         .mother{
    height:500px;
}   
      .Atitle{
    margin-top: -30px;
} 
         .date{
    font-size: 24px;
}
    .triangle-right {
  border-top: 8px solid transparent;
  border-left: 16px solid #c62221;
  border-bottom: 8px solid transparent;
    margin: 0 5px;
}
 .title02_up {
    margin-top: -35px;
}
}
@media screen and (max-width: 420px)  {
           .mother{
    height:470px;
}
    #nav{
    height: 40px;
  }
    .ns img{
        width: 200px;
      margin-top: 5px;
    }
  .date{
    font-size: 22px;
}
    .triangle-right {
  border-top: 8px solid transparent;
  border-left: 16px solid #c62221;
  border-bottom: 8px solid transparent;
    margin: 0 5px;
}
    .icon{
        width: 22px;
    height: 22px;
        background-size: 70%;
}
    .Atitle img{
        width: 100%;
    }
         .text-s{
    font-size: 14px;
}
    .btn-CP{    
    padding: 5px 20px;
    font-size: 24px;         
        border-radius: 10px;
}
}
@media screen and (max-width: 400px)  {
           .mother{
    height:450px;
}  
}
@media screen and (max-width: 380px)  {
      .mother{
    height:430px;
}
 .button_bg{
  font-size: 24px;
}   
     .title02_up {
    margin-top: -22px;
}
}
@media screen and (max-width: 350px)  {
      .mother{
    height:380px;
}
    .ns img{
        width: 160px;
      margin-top: 5px;
    }
      .button_bg{
 font-size: 22px;
}
    .btn-CP{    
    padding: 5px 10px;
    font-size: 22px; 
}
}
@media screen and (max-width: 300px)  {
      .mother{
    height:330px;
}
  .button_bg{
width: 60%;
      margin: 0 20%;
      font-size: 22px;
}    
       .text-s{
    font-size: 12px;
} 
}
@media screen and (max-width: 285px)  {
      .mother{
    height:300px;
}
    .ns img{
        width: 140px;
      margin-top: 5px;
    }
      .btn-CP{    
    padding: 5px 10px;
    font-size: 18px; 
}
}
@media screen and (max-width: 270px)  {
     .mother{
    height:280px;
}
     .button_bg{
      font-size: 18px;
}  
}