z-index「ボックスの重なり順」

<style type="text/css">
.c_yellow{
  z-index    : 0;
  position   : relative;
  width      : 300px;
  height     : 200px;
  border     : 10px solid yellow;
  background : rgba(255, 255, 0, 0.7);
}
.c_blue{
  z-index    : 1;
  position   : absolute;
  top        : 40px;
  left       : 20px;
  width      : 150px;
  height     : 100px;
  border     : 10px solid blue;
  background : rgba(0, 0, 255, 0.7);
}
.c_green{
  z-index    : 3;
  position   : absolute;
  top        : 70px;
  left       : 75px;
  width      : 150px;
  height     : 100px;
  border     : 10px solid green;
  background : rgba(0, 128, 0, 0.7);
}
.c_red{
  z-index    : 2;
  position   : absolute;
  top        : 10px;
  left       : 110px;
  width      : 150px;
  height     : 100px;
  border     : 10px solid red;
  background : rgba(255, 0, 0, 0.7);
}

<!-- html -->
<div class="c_yellow">
  <div class="c_blue"></div>
  <div class="c_green"></div>
  <div class="c_red"></div>
</div>