@charset "UTF-8";
@import url("global.css");
#bodyarea {
  margin-bottom: 120px;
}
#bodyarea .text {
  text-align: justify;
  margin-bottom: 60px;
}
#bodyarea .block {
  -webkit-border-radius: 6px;
  border-radius: 6px;
  overflow: hidden;
}
#bodyarea .block + .block {
  margin-top: 20px;
}
#bodyarea .block dt {
  display: flex;
  align-items: flex-start;
  padding: 25px 60px 25px 30px;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #F5F5F5;
  position: relative;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  -webkit-transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
#bodyarea .block dt:hover {
  cursor: pointer;
  background-color: #E4EED9;
}
#bodyarea .block dt.openheader {
  background-color: #E4EED9;
}
#bodyarea .block dt.openheader::after {
  content: "-";
}
#bodyarea .block dt::after {
  content: "+";
  position: absolute;
  z-index: 2;
  right: 25px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  line-height: 1;
  font-size: 30px;
  font-family: "Lexend", "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
  color: #6E6E6E;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  -webkit-transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
#bodyarea .block dt > i {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  line-height: 34px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  background-color: #2F984E;
  color: #FFF;
  margin-right: 15px;
  font-size: 1.125em;
  font-family: "Lexend", "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
#bodyarea .block dt > span {
  display: block;
  font-weight: 700;
  font-size: 1.125em;
}
#bodyarea .block dt > span br {
  display: none;
}
#bodyarea .block dd {
  display: flex;
  align-items: flex-start;
  width: 100%;
  padding: 0 60px 30px 30px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #E4EED9;
}
#bodyarea .block dd > i {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  line-height: 34px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  background-color: #FFF;
  color: #2F984E;
  margin-right: 15px;
  font-size: 1.125em;
  font-family: "Lexend", "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
#bodyarea .block dd .box {
  flex-grow: 1;
  text-align: justify;
}
#bodyarea .block dd .box > p + p,
#bodyarea .block dd .box > p + ul {
  margin-top: 1em;
}
#bodyarea .block dd .box > p + .morebtn {
  margin-top: 2em;
}
#bodyarea .block dd .box ul {
  margin-left: 10px;
}
#bodyarea .block dd .box ul.dot > li {
  text-indent: -14px;
  padding: 3px 0 3px 14px;
}
#bodyarea .block dd .box ul.dot > li::before {
  content: "";
  width: 6px;
  height: 6px;
  display: inline-block;
  margin-right: 8px;
  border-radius: 5px;
  background-color: #2F984E;
  vertical-align: 2px;
  text-indent: 0;
}

/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-1 ( 1600px )
 
------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-2 ( 1300px )
 
------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-3 ( 959px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 959px) {
  #bodyarea {
    margin-bottom: 90px;
  }
  #bodyarea .text {
    margin-bottom: 45px;
  }
  #bodyarea .block {
    -webkit-border-radius: 4px;
    border-radius: 4px;
  }
  #bodyarea .block + .block {
    margin-top: 15px;
  }
  #bodyarea .block dt {
    padding: 20px 55px 20px 20px;
  }
  #bodyarea .block dt::after {
    right: 20px;
    width: 26px;
    height: 26px;
    font-size: 26px;
  }
  #bodyarea .block dt > i {
    width: 30px;
    line-height: 30px;
  }
  #bodyarea .block dd {
    padding: 0 60px 25px 20px;
  }
  #bodyarea .block dd > i {
    width: 30px;
    line-height: 30px;
  }
  #bodyarea .block dd .box ul {
    margin-left: 7px;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-4 ( 644px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 644px) {
  #bodyarea {
    margin-bottom: 65px;
  }
  #bodyarea .text {
    margin-bottom: 30px;
  }
  #bodyarea .block {
    -webkit-border-radius: 3px;
    border-radius: 3px;
  }
  #bodyarea .block + .block {
    margin-top: 10px;
  }
  #bodyarea .block dt {
    align-items: center;
    padding: 20px 40px 20px 15px;
  }
  #bodyarea .block dt::after {
    right: 15px;
    width: 20px;
    height: 20px;
    font-size: 20px;
  }
  #bodyarea .block dt > i {
    width: 26px;
    line-height: 26px;
    margin-right: 10px;
  }
  #bodyarea .block dt > span br {
    display: block;
  }
  #bodyarea .block dd {
    padding: 0 40px 25px 15px;
  }
  #bodyarea .block dd > i {
    width: 26px;
    line-height: 26px;
    margin-right: 10px;
  }
  #bodyarea .block dd .box > p + .morebtn {
    margin-top: 1.5em;
  }
  #bodyarea .block dd .box ul {
    margin-left: 2px;
  }
  #bodyarea .block dd .box ul.dot > li::before {
    margin-right: 6px;
  }
}
