@charset "utf-8";

/* ctiで使用しているcss */

/* --------------------------------------------------------
section #
-------------------------------------------------------- */
.curled-box{
  margin-bottom: 20px;
  padding: 10px 20px;
  width: fit-content;
  background-color: #339999;
}

.flexBox-wrap{
  justify-content: center;
  gap: 2px;
}

.list{
  margin: 50px 0;
}

.list01 ul li{
  padding: 5px;
  width: 49%;
  background-color: #E7FAD8;
}

.list02 ul li{
  padding: 5px;
  width: 49%;
  background-color: #D8EFFA;
}

.list03 ul li{
  padding: 5px;
  width: 49%;
  background-color: #F7EADB;
}

.list04 ul li{
  padding: 5px;
  width: 100%;
  background-color: #FFFFCC;
}

/* =============================================================
  スマホ表示 (979px以下に適用)
============================================================= */
@media screen and (max-width: 979px){}



/* =============================================================
  PC表示 (980px以上に適用)
============================================================= */

@media screen and (min-width: 980px) {
section{
  max-width: 830px;
}
.attention{
  margin-top: 10px;
  padding-left: 40px;
}

.curled-box{
  margin-bottom: 20px;
  padding: 10px 20px;
  width: fit-content;
  background-color: #339999;
}

.flexBox-wrap{
  justify-content: flex-start;
  gap: 2px;
}

.list{
  margin: 20px 0 50px;
}

.list ul{
  margin: 0 0 0 auto;
  max-width: 810px;
}

.list01 ul li{
  padding: 10px;
  width: 33%;
  height: 70px;
  background-color: #E7FAD8;
}

.list02 ul li{
  padding: 10px;
  width: 33%;
  height: 70px;
  background-color: #D8EFFA;
}

.list03 ul li{
  padding: 10px;
  width: 33%;
  height: 70px;
  background-color: #F7EADB;
}

.list04 ul li{
  padding: 10px;
  width: 33%;
  height: 70px;
  background-color: #FFFFCC;
}

}