/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/


/* setting 1213 */
<style>
* {}

:root {
  /* Default (mobile-first) variables */
  --primary-color: #ff4757; /* red color */
  --main-font-size: 16px;
  --font-size-h1: 3rem;
  --box-padding: 3rem;
    --box-radius: 1.5rem;
}


.bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / 1, 1));
}
.white { color: #fff;}
.black { color: 000;}
  .jig-np-section {
        display: flex;
    margin: 0 auto;
  }
  .jig-np-inner {
    display: flex;
    max-width: 1140px;
    width: 100%;
      gap: 16px;
  }
  
.jig-np-section ul {
    padding-left: 1.5rem;
    color: #ff6c2a;
    font-size: 1.3rem;
    display: flex;
    flex-flow: column; 
    gap: 1rem;
      margin: 0;
}

  
.jig-np-h1 {
  font-size: var(--font-size-h1);
    line-height: 1em;
        text-shadow: 1px 1px 2px black;
  margin: 0;
  color: inherit;
  }
.jig-np-h1-sub {}
.jig-np-h2 {
  font-size: 2rem;
    line-height: 1.2em;
  margin: 0;
  color: inherit;
  }
.jig-np-h2-sub {}
.jig-np-h3 {
    font-size: 1.5rem;
    line-height: 1.4em;
  margin: 0;
  color: inherit;
  }
  
.jig-np-center {
  text-align: center;
  }

.jig-np-flexchildrencenter {
  justify-content: center;
}

.jig-np-flexitemcenter {
  display:flex;
  justify-self: center;
}
  
  
.jig-np-text {}
.jig-np-box-container {
      display: flex;
  gap: 16px;
      justify-content: center;
  }
  
    .jig-np-box-container.column, .flexcolumn  {
       flex-flow: column wrap;
  }
 
  
  .jig-np-box-container.row,
.jig-np-box-item.row {
    flex-flow: row wrap;
  }
 
 
   
   .jig-np-box-item  {
  flex: 1 1 435px;       
  max-width: 100%; 
     display: flex; 
     gap: 1.5rem;
    justify-content: center;
/*     align-items: center; */
}

.two-columns .jig-np-box-item {
/*     flex: 1 1 100%;
    width: 50%; */
}
  
   .four-column  .jig-np-box-item  {
  flex: 1 1 100%;       
  max-width: 25%;       
}

   .three-column  .jig-np-box-item  {
  flex: 1 1 100%;       
  max-width: 31%;       
}




.jig-np-box-item {}
.jig-np-box-title {}
.jig-np-box-text {}


.row-number-11 {position: relative; }
.row-number-11:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.65);
    z-index: 0;
}

.row-number-11 > .row-fluid {
      z-index: 2;
    position: relative;
}

.jig-np-box-button  {
  display: flex;
}


.jig-np-box-button a {
/*     background: #0001ef;
    color: #fff; */
    font-size: 1.5rem;
    padding: 0.75rem 2rem;
    border-radius: 1.5rem;
}

.jig-np-box-button.button1 a {
    background: #0001ef;
    color: #fff;
}

.jig-np-box-button.button1 a:hover {
    background: #0001EC
    color: #fff;
  border: 1px solid rgba(232, 232, 232, 0.55);
}


.jig-np-box-button.button2 a {
    background: transparent;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.jig-np-box-button.button2 a:hover {
    background: #ffffff1f;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.4);
}


/* start of sections */

.section-1 .jig-np-inner {
    gap: 2rem;
}

.section-1 .content-box {
    background: rgb(131 129 129 / 20%);
    padding: var(--box-padding);
    border-radius: var(--box-radius);
    color: #fff;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* .section-1 ul {
    padding-left: 1.5rem;
    color: #ff6c2a;
    font-size: 1.3rem;
    display: flex;
    flex-flow: column;
    gap: 1rem;
} */

.section-1 ul li {}

.section-1  .button-box {
    max-width: 43rem;
    margin: 0 auto;
}

.section-2 {
    max-width: 55rem;
}

.section-3 {} 

.section-3 .real-issue {
    border-left: 3px solid #0001ef;
    padding: 0 0 0 1.25rem;
      gap: 0.25rem;
}


.section-4 .care-list .jig-np-box-item {
  gap: 8px;
}


@media (max-width: 1024px) {
/*     .jig-np-box-item {
        min-width: 48%;
    } */
}

@media (max-width: 500px) {
  
  :root {
  /* Default (mobile-first) variables */
  --primary-color: #ff4757; /* red color */
  --main-font-size: 16px;
      --font-size-h1: 2.3rem;
  --box-padding: 1.5rem;
    --box-radius: 1rem;
}

  
/*     .jig-np-box-item {
        min-width: 100%;
    } */
}  


</style>