@media print, screen and (min-width: 768px) {
  .under .code__inner:not(:first-of-type) {
    margin-top: 70px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code__inner:not(:first-of-type) {
    margin-top: 50px;
  }
}

.under .code__contents {
  counter-increment: num;
}

@media print, screen and (min-width: 768px) {
  .under .code__contents:not(:first-of-type) {
    margin-top: 60px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code__contents:not(:first-of-type) {
    margin-top: 40px;
  }
}

.under .code--img {
  width: 100%;
  text-align: right;
}

@media print, screen and (min-width: 768px) {
  .under .code--img img {
    width: 225px;
    height: 60px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--img img {
    width: 150px;
    height: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .under .under--list01.code-3r li {
    padding-left: 40px;
  }
}

@media only screen and (max-width: 767px) {
  .under .under--list01.code-3r li {
    padding-left: 30px;
  }
}

.under .under--list01.code-3r li:before {
  content: "3R*:";
}

@media print, screen and (min-width: 768px) {
  .under .code--list01 li,
  .under .code--list02 li,
  .under .code--list03 li,
  .under .code--list04 li,
  .under .code--list05 li,
  .under .code--list06 li,
  .under .code--list07 li,
  .under .code--list08 li,
  .under .code--list09 li,
  .under .code--list10 li {
    padding-left: 40px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--list01 li,
  .under .code--list02 li,
  .under .code--list03 li,
  .under .code--list04 li,
  .under .code--list05 li,
  .under .code--list06 li,
  .under .code--list07 li,
  .under .code--list08 li,
  .under .code--list09 li,
  .under .code--list10 li {
    padding-left: 30px;
  }
}

.under .code--list01 li::before {
  content: "1-" counter(num);
}

.under .code--list02 li::before {
  content: "2-" counter(num);
}

.under .code--list03 li::before {
  content: "3-" counter(num);
}

.under .code--list04 li::before {
  content: "4-" counter(num);
}

.under .code--list05 li::before {
  content: "5-" counter(num);
}

.under .code--list06 li::before {
  content: "6-" counter(num);
}

.under .code--list07 li::before {
  content: "7-" counter(num);
}

.under .code--list08 li::before {
  content: "8-" counter(num);
}

.under .code--list09 li::before {
  content: "9-" counter(num);
}

@media print, screen and (min-width: 768px) {
  .under .code--list10 li {
    padding-left: 45px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--list10 li {
    padding-left: 40px;
  }
}

.under .code--list10 li::before {
  content: "10-" counter(num);
}

.under .code--text01 {
  position: relative;
  margin-bottom: 30px;
}

@media print, screen and (min-width: 768px) {
  .under .code--text01 {
    padding-left: 75px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--text01 {
    padding-left: 65px;
  }
}

.under .code--text01::before {
  position: absolute;
  top: 0;
  left: 0;
}

.under .code--text02 {
  position: relative;
  margin-bottom: 30px;
}

@media print, screen and (min-width: 768px) {
  .under .code--text02 {
    padding-left: 80px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--text02 {
    padding-left: 70px;
  }
}

.under .code--text02::before {
  position: absolute;
  top: 0;
  left: 0;
}

.under .code--text01::before,
.under .code--text02::before {
  content: "Article " counter(num);
}

.under .code--link01 {
  position: relative;
  color: #555;
  line-height: 1.5;
}

@media print, screen and (min-width: 768px) {
  .under .code--link01 {
    font-size: 14px;
    padding-left: 20px;
    margin-top: 25px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--link01 {
    font-size: 12px;
    padding-left: 15px;
    margin-top: 20px;
  }
}

.under .code--link01::before {
  content: '\0203b';
  position: absolute;
  top: 0;
  left: 0;
}

.under .code--link01 a {
  position: relative;
  text-decoration: underline;
  padding-right: 15px;
  -webkit-transition: .1s linear;
  transition: .1s linear;
}

.under .code--link01 a::before {
  content: '';
  background: url(/cmn/img/icon-blank.svg) no-repeat;
  position: absolute;
  width: 10px;
  height: 10px;
  right: 0;
}

@media print, screen and (min-width: 768px) {
  .under .code--link01 a::before {
    top: 4px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--link01 a::before {
    top: 2px;
  }
}

@media print, screen and (min-width: 768px) {
  .under .code--link01 a:hover {
    opacity: .75;
    text-decoration: none;
  }
}

@media print, screen and (min-width: 768px) {
  .under .code--link01 a:hover::before {
    opacity: .75;
  }
}

.under .code--end {
  text-align: right;
  line-height: 1.8;
}

@media print, screen and (min-width: 768px) {
  .under .code--end {
    margin-top: 60px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--end {
    margin-top: 45px;
  }
}

@media print, screen and (min-width: 768px) {
  .under .code--tableArea {
    margin-top: 40px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--tableArea {
    margin-top: 35px;
  }
}

.under .code--tableArea p {
  font-weight: bold;
  line-height: 1.3;
  margin-bottom: 10px;
}

@media only screen and (max-width: 767px) {
  .under .code--tableArea p {
    font-size: 15px;
  }
}

.under .code--tableArea table {
  width: 100%;
}

.under .code--tableArea table th, .under .code--tableArea table td {
  line-height: 1.8;
  vertical-align: top;
}

.under .code--tableArea table th {
  font-weight: normal;
}

@media print, screen and (min-width: 768px) {
  .under .code--tableArea table th {
    width: 85px;
  }
}

@media only screen and (max-width: 767px) {
  .under .code--tableArea table th {
    width: 75px;
  }
}