* {
  margin: 0;
  padding: 0;
}

.Summary-title {
  background: linear-gradient(#eb9a1b, #e95d22);
  color: white;
  font-weight: bold;
}

.Summary,
.Summary-title {
  justify-items: start;
  align-content: center;
  margin-bottom: 1px;
  padding-left: 7px;
  display: block;
  overflow-wrap: break-word;
}
/* @media (min-width: 820px) {
  .Summary1,
  .Summary3,
  .Summary5 {
    background-color: #f0f0f0;
    display: flex;
  } */

  .Summary1,
  .Summary3,
  .Summary5 {
    background-color: #f0f0f0;
    display: flex;
  }
  
  .Summary2,
  .Summary4 {
    background-color: white;
    display: flex;
  }

  @media (hover: hover) {
    .Summary1:hover,
    .Summary2:hover,
    .Summary3:hover,
    .Summary4:hover,
    .Summary5:hover {
      background-color: #dfdfdf;
    }
  }

/* @media (max-width: 768px) {
  .Summary1,
  .Summary2,
  .Summary3,
  .Summary4,
  .Summary5 {
    flex-flow: column;
  }

  @media (hover: hover) {
    .Summary-1:hover,
    .Summary-2:hover,
    .Summary-3:hover,
    .Summary-4:hover,
    .Summary-5:hover,
    .Summary-6:hover,
    .Summary-7:hover,
    .Summary-8:hover,
    .Summary-9:hover,
    .Summary-10:hover {
      background-color: #dfdfdf;
    }
  }

  .Summary-1,
  .Summary-3,
  .Summary-5,
  .Summary-7,
  .Summary-9 {
    background-color: #f0f0f0;
    display: flex;
  }

  .Summary-2,
  .Summary-4,
  .Summary-6,
  .Summary-8 .Summary-10 {
    background-color: white;
    display: flex;
  }
} */



#contents-1 {
  clear: both;
  overflow: hidden;
  background: #fff; /*背景色*/
  padding: 3%; /*ボックス内の余白*/
  margin-top: 40px; /*ボックスの上に空けるスペース。コンテンツとメインメニューの間のスペースになる。*/
  margin-left: 50px;
  margin-right: 50px;
  border-radius: 10px; /*角丸のサイズ*/
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); /*影の設定。右に、下に、広げる幅、rgbaは色で0,0,0は黒、0.2は透明度20%の事。*/
  min-height: 500px;
}


h2{
  background: linear-gradient(#eb9a1b, #e95d22);
    position: relative;
    font-family: 'Pacifico', cursive;
    width: 100%;
    font-weight: bold;
    text-align: center;
    color: #ffffff;
    display: block;
    align-items: center;
    overflow: hidden;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
   
}

@media (max-width: 450px) {

  #contents-1 {
    width: 95%;
    clear: both;
    overflow: hidden;
    background: #fff; /*背景色*/
    padding: 3%; /*ボックス内の余白*/
    margin-top: 40px; /*ボックスの上に空けるスペース。コンテンツとメインメニューの間のスペースになる。*/
    margin-left: 9px;
    /* margin-right: 20px; */
    border-radius: 10px; /*角丸のサイズ*/
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); /*影の設定。右に、下に、広げる幅、rgbaは色で0,0,0は黒、0.2は透明度20%の事。*/
    min-height: 500px;
  }
}