.color-box{display: flex; justify-content: flex-start;}
    .color-box > div{}
    .color-box > div.pink{margin-left: 20px;}
    .color-box > div > p{width: 250px; height: 100px; border-radius: 0 20px 0 0;}
    .color-box > div.blue > p{background: #275cac;}
    .color-box > div.pink > p{background: #f14d4e;}
    .color-box > div > span.tit{font-size:18px; color: #333; display:block; padding: 15px 0 0 0;}
    .color-box > div > span.con{font-size:16px; color: #333; display:block; padding: 10px 0 0 0;}
  
    @media all and (max-width:680px){
      .color-box{flex-flow: wrap;}
      .color-box > div{width: 100%;}
      .color-box > div > p{width: 100%;}
      .color-box > div.pink{margin-left: 0px;}
      .color-box > div.pink > p{margin-top: 20px;}
    }