@charset "utf-8";
.services {width: 100%;max-width: 960px;height:213px;margin: 0 auto; background: url(../images/services.jpg) no-repeat center;font-size: 16px;color: #2f2d2d;font-family: Khmer UI}
#p1 {padding:100px 0px 0 100px;line-height: 24px}
#p2 {padding:0 200px}
.readmore {width: 100%;max-width: 960px;margin: 0 auto;overflow: hidden;padding: 50px 0 88px 2px; font-family: Calibri; font-size: 16px;}
.case h2, .case p{padding: 0 20px;}
.case {width:225px; margin-right: 19px; background-color: #fff; height: 295px;}
.case h2 {font-size: 16px; font-weight: bold; margin-bottom: 15px;color:#2e2e2e;}
.case a {display: block; width: 130px; height:30px;margin: 15px 0 0 20px; border:2px solid #dcdcdc; text-align: center;color: #999999; line-height: 30px; font-size: 14px;}
.selected {background: #ed6c00; color: #fff; width: 225px; height: 295px;}
.selected a{color: #fff; border:2px solid #fff;}
.selected h2{color: #fff;}
.case span{
	border-left: 1px solid #ececec;
	border-right: 1px solid #ececec;
	border-bottom: 1px solid #ececec;
	display: block;
	height: 170px;
	padding-top: 20px;
  }
.selected span{
   border: none;
}
.first {}
#last {margin-right: 0}
iframe {
	position: absolute;
	/*display: none;*/
}

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }
.slide_container {
  margin-bottom: 50px;
  position: relative;
  float: left;
  width: 100%;
  }

.slide {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.slide li {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  }

 .slide img {
  display: block;
  position: relative;
  z-index: 1;
  height: auto;
  width: 100%;
  border: 0;
  }

.slide .caption {
  background-color: #ed6c00;
  bottom: 20px;
  color: #fff;
  display: block;
  font-size: 20px;
  height: 80px;
  left: 20%;
  margin: 0;
  max-width: none;
  padding: 30px 20px;
  position: absolute;
  text-shadow: none;
  width: 320px;
  z-index: 2;
  }

 .slide_nav {
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  bottom: 0px;
  right: 20%;
  opacity: 0.7;
  z-index: 3;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 61px;
  width: 38px;
  background: transparent url("../images/btn.png") no-repeat left top;
  margin: -45px 0 0 0;
  }

.slide_nav:active {
  opacity: 1.0;
  }

.slide_nav.next {
  left: auto;
  background-position: right top;
  right: 17%;
  }
.caption h4{
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 20px;
	}
.caption a{
  text-decoration: none;
  color: #fff;
}
.caption p{
  font-size: 18px;
  line-height: 20px;
}
/* PAD */
@media (min-width: 768px) and (max-width: 991px){
    .readmore{
        width: 96%;
        padding: 0;
        margin: 0 2% 40px;
    }
    #pad-last{
      margin-right: 0;
    }
    .slide .caption{
      left: 5%;
    }
    .visible-sm-mt40{
      margin-top: 40px;
      margin-bottom: 40px;
    }
    .case{
      width: 23%;
      margin-right: 2%;
    }
    .readmore img{
      width: 100%;
    }
    .case h2, .case p{
      padding: 0 5px;
    }
    .case a{
      margin-bottom: 20px;
    }
    .case{
      height: auto;
    }
    .case span{
      height: auto;
    }
}

/* PHONE */
@media (max-width: 767px){
    .readmore{
        width: 96%;
        padding: 0;
        margin: 0 2%;
    }
    #pad-last{
      margin-right: 0;
    }
    .slide .caption{
      left: 5%;
    }
    .visible-sm-mt40{
      margin-top: 40px;
      margin-bottom: 40px;
    }
    .slide_container{
      display: none;
    }
    .case{
      width: 48%;
      margin-right: 4%;
      margin-top: 15%;
    }
    .mb15-sm{
      margin-bottom: 15%;
    }
    .mr0-sm{
      margin-right: 0;
    }
    .case img{
      width: 100%;
    }
    .case h2, .case p{
      padding: 0 0 0 10px;
      font-size: 14px;
    }
    .case a{
      margin: 5px 0 0 10px;
      width: 50%;
      padding: 5px;
      font-size: 12px;
      line-height: 100%;
      height: auto;
    }
    .selected{
      height: auto;
    }
    .case{
      height: auto;
    }
}