@media screen and (min-width:320px) and (max-width:959px) {
  /*--------------------- #challenge ---------------------*/
  .storyLink {
    padding-top: 0;
  }
  
  /*--------------------- #clgBox ---------------------*/
  .active.boxTop{
    padding-top: 50%;
  }
  .active.boxTop02{
    padding-top: 65%;
  }
  .clgBox {
    margin: 0;
    padding: 0;
    width: 100%;
  }
  .clgImg {
    padding-bottom: 52%;
  }
  .clgImg.lastBtm {
    padding-bottom: 65%;
  }
  .boxInr {
    margin: 0;
    padding: 30px 10px;
    width: 100%;
  }
  .clgBox .head02 {
    font-size: 20px;
    line-height: 1.8;
  }
  .clgBox .head02 span {
    font-size: 16px;
    line-height: 1;
  }
  .clgBox .head02 small {
    font-size: 16px;
    margin: 0 3px;
  }
  /*--------------------- .flt ---------------------*/
  .fltBox {
    margin: 10px 0!important;
  }
  .fltLimg {
    float: none;
    margin: 10px 0!important;
  }
  .fltRimg {
    float: none;
    margin: 10px 0!important;
  }
  .fltRimg {
    width: 100%;
  }
  .fltLimg {
    width: 100%;
  }
  .fltLtxt {
    float: none;
    font-size: 14px;
    margin: 0;
    width: 100%;
  }
  .fltRtxt {
    float: none;
    font-size: 14px;
    margin: 10px 0!important;
    width: 100%;
  }
  .fltLtxt.clm2 { width: 100%; }
  .fltRtxt.clm2 { width: 100%; }
  
  img.img  {
    width: 100%;
    margin-bottom: 20px!important;
  }
  
  
  
  /*--------------------- .middle ---------------------*/
  img.middleImg {
    margin-bottom: 40px;
    width: 100%;
  }
  .middleTxt {
    margin-left: 0;
    width: 100%;
  }
  /*
  .fixedImg {
    padding-top: 60px;
    position: fixed;
    opacity: 0;
    transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
  }
  .active .fixedImg {
    padding: 0;
  }
  */
  .fixedImg {
    padding-top: 60px;
    position: static;
    opacity: 1;
    transition-duration: 0;
    -moz-transition-duration: 0;
    -webkit-transition-duration: 0;
    -o-transition-duration: 0;
    -ms-transition-duration: 0;
  }
  .active .fixedImg {
    padding-top: 60px;
  }
 
  
  /*
  .gallery_area .sections {
    padding: 0;
  }
  .img_gallery img {
    width: 100%;
  }
  .img_gallery.fixed {
  }
  .img_gallery.fixed img {
    position: fixed;
    top: 66px;
  }
  */
  
  
  .imgBox img {
    margin-bottom: 20px;
  }
  
}



@media screen and (min-width:960px) and (max-width:1199px) {
  .boxInr {
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .clgBox {
    width: 100%;
  }
  .fltBox img {
    width: 45%;
  }
  img.middleImg {
    width: 45%;
  }
  .fixedImg {
    right: 0;
  }
  .active.boxTop{
    padding-top: 5%;
  }
  .active.boxTop02{
    padding-top: 5%;
  }
  
  /*
  .gallery_area .sections {
    padding: 20px;
  }
  .img_gallery img {
    width: 100%;
  }
  */
  
  
}