index.html

<div class="body">

  <div class="dropdown">
    <div class="dropdown__content">
      
      <div class="content">
        <div class="content__item">
          <input type="checkbox" />
          Item 1
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 2
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 3
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 4
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 5
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 6
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 7
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 8
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 9
        </div>
        <div class="content__item">
          <input type="checkbox" />
          Item 10
        </div>
      </div>
      
    </div>
    <div class="dropdown__button">
      <button>Apply</button>
    </div>
  </div>
  
</div>

index.scss

body {
  margin: 0;
  
  font: 14px/1.5 normal Helvetica, Arial, sans-serif;
  color: #333;
}

.body {
  box-sizing: border-box;
  padding: 2rem;
  height: 100vh;
  background: rgba(0,0,0,.8);
}

.dropdown {
  display: flex;
  flex-flow: column nowrap;
  position: absolute;
  left: 50%;
  min-width: 30vw;
  transform: translateX(-50%);
  background: #fff;
  max-height: 200px; // demo
  overflow: hidden;
  box-shadow: 0 2px 6px 1px rgba(0,0,0,.8);
}

.dropdown__content {
  flex: 1 1 auto;
  min-height: 30vh;
  overflow: hidden;
  overflow-y: auto;
}

.dropdown__button {
  position: relative;
  
  flex: 1 0 auto;
  padding: .5rem;
  
  box-shadow: 0 -12px 14px -10px rgba(0,0,0,.7); // point 1
}

button {
  box-sizing: border-box;
  width: 100%;
  padding: .5rem;
  color: #fefefe;
  background: #666;
  font-size: 16px;
  border: 0 none;
}

.content {
  position: relative; // point 2
  padding-bottom: 1rem; // point 3
  
  &:after {
    content: "";
    position: absolute;
    z-index: 1; // point 4
    left: 0; right: 0; bottom: 0; 
    height: 1rem; // point 5
    background: #fff;
  }
}

.content__item {
  padding: .5rem;
  
  &:nth-child(odd) {
    background-color: #eee;
  }
}