@charset "utf-8";

/* we_green-box */
.we_green-box {
  border: 2px solid #090;
  box-sizing: border-box;
  font-size: 16px;
  margin: 1rem 0 2rem;
  padding: 20px;
}

.we_green-box h5 {
  color: #090;
  font-size: 18px;
  margin: 0;
}

.we_green-box p {
  margin: 10px 0 0;
}

.we_green-box div {
  margin-left: 20px;
}


/* we_red-box */
.we_red-box {
  border: 2px solid #e60000;
  box-sizing: border-box;
  font-size: 16px;
  margin: 1rem 0 2rem;
}

.we_red-box h5 {
  background: #e60000;
  color: #fff;
  font-size: 20px;
  line-height: 1;
  margin: 0;
  padding:6px 0;
}

.we_red-box strong {
  color: #e60000;
}


/* we_blue-box */
.we_blue-box {
  border: 2px solid #06f;
  box-sizing: border-box;
  font-size: 13px;
  margin: 1rem 0 2rem;
  padding: 20px;
}

.we_blue-box h5 {
  color: #06f;
  font-size: 16px;
  margin: 0;
}

.we_blue-box p {
  margin: 10px 0 0;
}

.we_blue-box div {
  margin-left: 20px;
}


/* we_yellow-bg-box */
.we_yellow-bg-box {
  background-color:#ffffcc;
  border-radius: 6px;
  border: 1px solid #ff7d27;
  box-sizing: border-box;
  font-size: 16px;
  margin: 1rem 0 2rem;
  padding: 20px;
}

.we_yellow-bg-box h5 {
  color: #ff6600;
  font-size: 18px;
  margin: 0;
}

.we_yellow-bg-box ul {
  margin: 10px 0 0;
}

.we_yellow-bg-box li {
  list-style: disc;
}

.we_yellow-bg-box strong {
  color: #e60000;
}


/* we_green-bg-box */
.we_green-bg-box {
  background-color:#f2ffe5;
  border-radius: 6px;
  box-sizing: border-box;
  font-size: 16px;
  margin: 1rem 0 2rem;
  padding: 20px;
}

.we_green-bg-box h5 {
  color: #090;
  font-size: 18px;
  margin: 0;
}

.we_green-bg-box ul {
  margin: 10px 0 0;
  padding: 0;
}

.we_green-bg-box li {
  list-style: none;
  margin-top: 10px;
}

/* we_product-card */
.we_product-card {
  display: grid;
  grid-template: "lead lead" auto
  "image title" auto
  "image desc" 1fr
  "image button" auto / min(45%,316px) auto;
  gap: 10px 20px;
  border: 4px solid #e60000;
  box-sizing: border-box;
  font-size: 16px;
  margin: 1rem 0 2rem;
  max-width: 780px;
  padding: 15px;
}

.we_product-card img[src*="/img/p/"] {
  width: 100%;
  aspect-ratio: auto;
}

.we_product-card > a:not(.we_text-center) {
  grid-area: image;
}

.we_product-card > a:not(.we_text-center) img {
  width: 100%;
  aspect-ratio: auto;
}

.we_product-card a.we_text-center {
  grid-area: button;
  background-color: #fcc;
  color: #e60000 !important;
  display: block;
  font-size: 26px;
  font-weight: bold;
  overflow: hidden;
  padding: 15px 20px;
  width: 100%;
  box-sizing: border-box;
}

.we_product-card h5 {
  grid-area: title;
  font-size: 18px;
  line-height: 1.5;
  margin: 0;
}

.we_product-card h5 strong {
  font-size: 26px;
  color:#e60000;
}

.we_product-card span {
  grid-area: desc;
  font-size: 18px;
  display: block;
  padding: 5px 0;
  line-height: 1.2;
}

.we_product-card b {
  grid-area: lead;
  background-color: #e60000;
  color: #fff;
  display: block;
  font-size: 18px;
  padding: 10px;
  width: 100%;
  box-sizing: border-box;
}

.we_product-card strong {
  color: #ff7d27;
  font-size: 18px;
}


/* we_heading,we_title */
.we_heading,
.we_title {
  margin: 0;
  font-weight: bold;
}

.we_heading {
  font-size: 16px;
}

.we_title {
  font-size: 20px;
}


/* we_list */
.we_list {
  line-height: 1.8;
  margin: 1rem 0 2rem;
  padding: 0;
}

.we_list li {
  list-style:none;
  margin-bottom: 5px;
}

.we_list a {
  position: relative;
  padding-left: 20px;
}

.we_list a::before {
  background: #333;
  border-radius: 25%;
  content: "";
  height: 14px;
  left: 0;
  top: calc(50% - 7px);
  position: absolute;
  width: 14px;
}
.we_list a::after {
  border-top: 1px solid #f5f5f5;
  border-right: 1px solid #f5f5f5;
  content: "";
  height: 3px;
  position: absolute;
  bottom: 0;
  left: 4px;
  margin: auto;
  top: 0;
  transform: rotate(45deg);
  width: 3px;
}
.we_list a:hover {
  text-decoration: none;
}

/* we_ul */

:is(.we_ul,.we_ol) {
  margin-block: 1rem;
  padding-left: 0;
  &:is([class*="we_padding"]) {
    padding-block: 0;
  }
}

:is(.we_ul,.we_ol) :is(.we_ul,.we_ol) {
  margin-block: 0.5rem;
}

:is(.we_ul,.we_ol) li {
  list-style: none;
  position: relative;
}

:is(.we_ul,.we_ol) li::before {
  display: inline-block;
  position: absolute;
  left: 0;
}

.we_ul li {
  padding-left: 1.25em;
}

.we_ul li::before {
  content: '・';
}

.we_ol {
  counter-reset: we_ol_counter;
}

.we_ol li::before {
  counter-increment: we_ol_counter;
  font-variant-numeric: tabular-nums;
}

.we_ol > li {
  padding-left: 2.3ch;
}

.we_ol > li::before {
  content: counter(we_ol_counter) '.';
}

.we_ol:has(li:nth-child(10)) > li {
  padding-left: 3.5ch;
}

.we_ol > li > .we_ol > li {
  padding-left: 3.4ch;
}

.we_ol > li > .we_ol > li::before {
  content: '(' counter(we_ol_counter) ')';
}

.we_ol > li > .we_ol:has(li:nth-child(10)) > li {
  padding-left: 4.5ch;
}

.we_ol > li > .we_ol > li > .we_ol > li {
  padding-left: 2.3ch;
}

.we_ol > li  > .we_ol > li > .we_ol > li::before {
  content: counter(we_ol_counter, lower-roman) '.';
}

.we_ol > li > .we_ol > li > .we_ol:has(li:nth-child(7)) > li {
  padding-left: 3ch;
}

.we_ol > li > .we_ol > li > .we_ol:has(li:nth-child(8)) > li {
  padding-left: 3.4ch;
}

.we_ol > li > .we_ol > li > .we_ol:has(li:nth-child(18)) > li {
  padding-left: 4.2ch;
}

/* single-style */
.we_bg-yellow {
  background-color:#ff0;
}

.we_text-center {
  text-align:center;
}

.we_text-bold {
  font-weight: bold;
}

.we_column-2 {
  display: flex;
  align-items: center;
}


/* color */
.we_text-red {
  color: #e60000;
}

.we_text-blue {
  color: #06f;
}


/* padding */
.we_padding-10 {
  padding: 10px;
}

.we_padding-15 {
  padding: 15px;
}

/*以下より偽物注意表記*/
.we_all {
  max-width: 740px;
  width: 100%;
  margin: 0 0 30px;
}
.we_red_attention {
  border: none;
  margin: 0;
  padding: 5px 0;
  background: #e60000;
  display: flex;
  justify-content: center;
  align-items: center;
}
.we_red_attention_icon {
  height: 35px;
  margin: 0;
}
.we_red_attention_title {
  color: #fff;
  font-size: 24px;
  margin: 0;
  padding: 5px 0 0 15px;
  font-weight: bold;
}
.we_red_table {
  border: #e60000 solid 1px;
  font-weight: bold;
  display: flex;
}
.we_red_table_title {
  background: #e60000;
  color: #fff;
  display: flex;
  align-items: center;
  padding: 10px 30px;
  font-size: 17px;
  letter-spacing: 2px;
}
.we_red_table_text {
  margin: 10px 20px;
  flex: 1;
 }
.we_pink_title_text {
  margin: 0;
  border: none;
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  letter-spacing: 1px;
  text-align: center;
  background-color: #ff00ba;
  line-height: 40px;
  padding-top: 2px;
}
.we_container {
  margin: 40px 0 0;
}
.we_column {
  margin: 20px 0 0;
  width: 48%;
}
.we_column_title {
  margin: 0;
  color: #ff00ba;
  font-size: 17px;
  border-bottom: #ff00ba solid 3px;
  padding: 0 0 3px;
  line-height: 1.2;
  display: flex;
}
.we_column_text {
  border: none;
  margin: 10px 0 0;
}  
.we_column_container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.we_column_img {
  display: flex;
  justify-content: space-between;
  margin: 15px 0 0;
  font-size: 0;
  width: 100%;
}
.we_column_img_item {
  width: 48%;
}
.we_column_img_title {
  text-align: center; 
  border: none;
  margin: 0;
  padding: 3px 0;
  background: #ff00ba;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  letter-spacing: 2px;
  width: 100%;
  }
.we_text-red {
  color: #e60000;
}
.we_number {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  text-align: center;
  vertical-align: middle;
  box-sizing: border-box;
  background: #ff00ba;
  color: #fff;
  font-size: 14px;
  display: inline-block;
  margin: 0 3px 0 0;
  line-height: 20px;
}
.we_container_img {
  width: 740px;
  vertical-align: bottom;
}
.we_pink_container_img {
  width: 100%;
}
.we_red_attention_text {
  margin: 10px 0 10px;
  line-height: 1.5;
}
  .we_number_title{
    display: contents;
    font-size: 16px;
    line-height: 20px;
  }



@media screen and (max-width:599px) {
/*画面サイズが599pxからはここを読み込む*/

/* we_green-box */
.we_green-box {
  font-size: 14px;
  padding: 15px;
}

.we_green-box h5 {
  line-height: 1.4;
}

.we_green-box p {
  margin: 5px 0 0;
}

.we_green-box div {
  margin-left: 15px;
}


/* we_red-box */
.we_red-box {
  font-size: 14px;
}


/* we_blue-box */
.we_blue-box {
  font-size: inherit;
  padding: 15px;
}

.we_blue-box h5 {
  font-size: inherit;
  line-height: 1.4;
}

.we_blue-box p {
  margin: 5px 0 0;
}

.we_blue-box div {
  margin-left: 15px;
}


/* we_yellow-bg-box */
.we_yellow-bg-box {
  font-size: 14px;
  padding: 15px;
}

.we_yellow-bg-box ul {
  margin: 5px 0 0;
}


/* we_green-bg-box */
.we_green-bg-box {
  font-size: 14px;
  padding: 15px;
}

.we_green-bg-box ul {
  margin: 5px 0 0;
}

.we_green-bg-box li {
  margin-top: 5px;
}

/* we_product-card */
.we_product-card {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  padding: 10px;
}

.we_product-card a.we_text-center {
  font-size: 20px;
  padding: 10px;
}

.we_product-card h5 {
  font-size: 16px;
}

.we_product-card h5 strong {
  font-size: 22px;
}

.we_product-card p {
  margin: 0;
}

.we_product-card span {
  font-size: 18px;
}

.we_product-card b {
  font-size: 16px;
  line-height: 1.5;
  padding: 10px;
}


/* we_heading,we_title */
.we_heading {
  font-size: 16px;
}

.we_title {
  font-size: 20px;
}


/* we_list */
.we_list {
  margin: .5rem 0 2rem;
}


/* single-style */
.we_column-2 {
  align-items: flex-start;
}
  
/*以下より偽物注意表記*/
  .we_red_attention {
    padding: 0 20px;
  }
  .we_red_attention_icon {
    height: 25px;
    margin: 0;
  }
  .we_red_attention_title {
    font-size: 20px;
    padding: 0 0 0 15px
  }
  .we_attention_title {
    font-size: 20px;
  }
  .we_pink_container {
    margin: 0px;
    padding-bottom: 0px;
  }
  .we_pink_container img {
    width: 100%;
    height: auto;
  }
  .we_column {
    width:100%;
    margin: 20px 0 0
  } 
  .we_pink_title_text {
    padding: 0px;
    font-size: 18px;
    letter-spacing: 1px;
    height: 35px;
    line-height: 37px;
  }
  .we_red_table_title {
    font-size: 18px;
    padding: 10px 15px;
  }
  .we_red_table_text {
    font-size: 16px;
    line-height: 23px;
  }
  .we_column_title {
    font-size: 16px;
    line-height: 1;
    padding: 0 0 5px;
  }
  .we_column_img_title {
    font-size: 15px;
    letter-spacing: 3px;
    width: 100%;
  }
  .we_column_text {
    font-size: 15px;
    margin: 8px 0 0;
  }
  .we_number {
    width: 20px;
    height: 20px;
}
  .we_number_title{
    align-items: center;
    justify-content: left;
    font-size: 16px;
    line-height: 20px;
  }
  .we_column_img {
    margin: 10px 0 0;
  }
  .we_container {
    margin: 30px 0 0;
  }
}