/* Scss Document */
/******************************************************/
.know_flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  width: calc(100% - 200px);
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 0 200px; }

.know {
  width: calc((100% - 50px)/2);
  max-width: 600px;
  margin-bottom: 100px; }
  .know.blue h3 {
    border-left: 3px solid #00B1ED; }
    .know.blue h3 small {
      color: #00B1ED; }
  .know.blue h4 {
    background-color: #00B1ED; }
  .know h3 {
    font: 4.0rem/1.0em 'Noto Sans JP', sans-serif;
    font-weight: 500;
    width: 100%;
    padding: 0 0 0 25px;
    border-left: 3px solid #FCC800;
    margin-bottom: 50px; }
    .know h3 small {
      color: #FCC800;
      font: 1.5rem/1.0em 'Oswald', sans-serif;
      font-weight: 500;
      display: block;
      margin: 20px 0 0; }
  .know h4 {
    width: fit-content;
    font: 2.0rem/1.0em 'Noto Sans JP', sans-serif;
    font-weight: 700;
    background-color: #FCC800;
    color: #fff;
    padding: 5px 15px;
    margin: 15px 0 0; }
  .know p {
    margin: 15px 0 35px;
    font: 1.5rem/1.8em 'Noto Sans JP', sans-serif;
    font-weight: 500;
    text-align: justify;
    text-justify: inter-ideograph; }
  .know img {
    width: 100%; }

.know_box {
  width: 100%;
  max-width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between; }
  .know_box div {
    width: calc((100% - 50px)/2);
    max-width: 600px; }

@media (max-width: 1280px) {
  .know_flex {
    width: calc(100% - 120px);
    max-width: 1280px;
    margin: 0 20px 0 100px;
    padding: 0 0 200px; }

  .know_box div {
    width: calc((100% - 30px)/2);
    max-width: 600px; } }
/*max-width:1280px*/
@media (max-width: 1024px) {
  .know_flex {
    display: block;
    width: calc(100% - 40px);
    max-width: 600px;
    margin: 0 auto;
    padding: 40px 0 200px; }

  .know {
    width: 100%;
    max-width: 600px;
    margin-bottom: 100px; }

  .know_box {
    display: block; }
    .know_box div {
      width: 100%;
      max-width: 600px; } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .know h3 {
    font: 3.5rem/1.0em 'Noto Sans JP', sans-serif;
    font-weight: 500;
    padding: 0 0 0 20px; }
    .know h3 small {
      margin: 13px 0 0; } }
/*max-width:768px*/
@media (max-width: 480px) {
  .know h3 {
    font: 3.0rem/1.0em 'Noto Sans JP', sans-serif;
    font-weight: 500;
    padding: 0 0 0 20px; }
    .know h3 small {
      margin: 13px 0 0; }
  .know h4 {
    font: 1.8rem/1.0em 'Noto Sans JP', sans-serif;
    font-weight: 700;
    padding: 3px 15px 5px;
    margin: 8px 0 0; }
  .know p {
    margin: 10px 0 35px; } }
/*max-width:480px*/
