@charset "utf-8";

.l-content .section1 {
 background-color: #ffcc00;
 padding: 0 20px 60px 20px;
}

.l-content .section2 {
 background-color: #1e1e1e;
 padding: 80px 20px 60px 20px;
}

.l-content .m-container {
 max-width: 1440px;
}

.l-content .m-cols-flex {
 display: flex;
 column-gap: 40px;
 align-items: center;
}

.l-content .m-cols-flex.flex-row .m-col-4 {
 width: 40%;
}

.l-content .m-cols-flex.flex-row .m-col-8 {
 width: 60%;
}

.l-content .m-cols-flex.flex-img {
 align-items: flex-start;
}

.l-content .text-intro {
 background-color: #FFFFFF;
 padding: 30px 50px;
 border-radius: 70px;
 border: 2px solid #000;
}

.l-content .box_code {
 background-color: #efefef;
 font-size: 18px;
 padding: 0 0 20px 0;
}

.l-content .img-edit {
 width: 90%;
}

.l-content .m-table-responsive {
 height: 87%;
}

.l-content .m-table {
 height: 100%;
}

.l-content .text-bg {
 font-weight: bold;
 background-color: #ffcc00;
}

.l-content .m-border-edit {
 border-radius: 70px;
 overflow: hidden;
 display: flex;
 flex-direction: column;
}

.l-content .h2-edit {
 display: inline-block;
}

.l-content .product {
 background-color: #ffffff;
 color: #333333;
 border: 1px solid #dedede;
 padding: 20px;
 text-align: center;
}

.l-content .product:hover {
 opacity: 0.9;
 cursor: pointer;
 border: 1px solid #ff730a;
}

.l-content .product:hover a {
 color: #ff730a;
}

.l-content .product .name {
 display: block;
 height: 26px;
 overflow: hidden;
 text-overflow: ellipsis;
 width: 100%;
 white-space: nowrap;
 font-weight: bold;
 font-size: 18px;
 margin: 0 0 20px 0
}

.l-content .product .part {
 font-size: 16px;
 height: 50px;
}

.l-content .product .price {
 padding: 0 0 20px 0;
 color: #dd0000;
 font-weight: bold;
 font-size: 20px;
}

.l-content .product .ship {
 display: block;
 font-size: 16px;
 font-weight: bold;
}

.l-content .product .ship img {
 vertical-align: middle;
 margin-right: 10px;
}


.responsive .l-content .m-btnLink--default.m-btn--edit,
.responsive .l-content .m-btnLink--strong.m-btn--edit,
.responsive .l-content .m-btnLink--conversion.m-btn--edit {
 margin: 20px 20px 0 0;
 width: 30% !important;
}

@media screen and (max-width: 1038px) {

 .responsive .l-content .m-btnLink--default.m-btn--edit,
 .responsive .l-content .m-btnLink--strong.m-btn--edit,
 .responsive .l-content .m-btnLink--conversion.m-btn--edit {
  width: 40% !important;
 }
}

@media screen and (max-width: 991px) {
 .l-content .m-cols-flex.flex-row .m-col-4 {
  width: 50%;
 }

 .l-content .text-intro {
  padding: 30px;
  border-radius: 30px;
  margin-bottom: 30px;
 }
}

@media screen and (max-width: 921px) {

 .responsive .l-content .m-btnLink--default.m-btn--edit,
 .responsive .l-content .m-btnLink--strong.m-btn--edit,
 .responsive .l-content .m-btnLink--conversion.m-btn--edit {
  width: 100% !important;
 }

 .l-content .m-btn-list-order {
  display: flex;
  flex-direction: column;
 }

 .l-content .m-btn-list-order .m-btnLink--default {
  order: 2;
 }

 .l-content .m-btn-list-order .m-btnLink--strong {
  order: 1;
 }
}

@media screen and (max-width: 767px) {
 .l-content .m-cols-flex {
  flex-direction: column;
  grid-row-gap: 20px;
 }

 .l-content .section2 {
  background-color: #1e1e1e;
  padding: 30px 20px 60px 20px;
 }

 .l-content .section1 {
  background-color: #ffcc00;
  padding: 0 20px 30px 20px;
 }

 .l-content .box_code {
  font-size: 16px;
 }

 .l-content .m-table-responsive {
  height: 100%;
 }

 .l-content .m-border-edit {
  border-radius: 23px;
 }

 .l-content .m-cols-flex.flex-row .m-col-4 {
  width: 70%;
 }

 .l-content .m-cols-flex.flex-row .m-col-8 {
  width: 100%;
  margin-bottom: 30px;
 }
}

@media screen and (max-width: 480px) {
 .l-content .m-cols-flex.flex-row .m-col-4 {
  width: 100%;
 }
}