

/*****
mdpNavi
*****/

.mdpNavi {
  margin-top: 3em;
  margin-bottom: 3em;
  border: 2px solid #00491e;
  display: flex;
}
.mdpNavi li {
  flex: 1;
}
.mdpNavi li:not(:last-child) {
  border-right: 1px solid #00491e;
}
.mdpNavi a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  height: 4em;
  background-color: #fff;
  font-size: 124%;
  font-weight: 600;
  font-feature-settings: "palt";
  color: #000;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  line-height: 1.25;
  transition: 0s;
}
.mdpNavi a br {
  display: none;
}
.mdpNavi a:hover {
  opacity: 1;
  background-color: #f0f0f0;
}

.mdpNavi li.is-active a {
  background-color: #00491e;
  color: #fff;
}
.mdpNavi li.is-active a::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 10px 0 10px;
  border-color: #00491e transparent transparent transparent;
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
}

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

  .mdpNavi {
    margin-top: 1em;
    margin-bottom: 2em;
    border: 2px solid #00491e;
  }
  .mdpNavi li {
    flex: 1;
  }
  .mdpNavi li:not(:last-child) {
    border-right: 1px solid #00491e;
  }
  .mdpNavi a {
    height: 4em;
    font-size: 100%;
  }

}

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

  .mdpNavi a br {
    display: inline;
  }
}


/*****
mdpVisual
*****/

.mdpVisual{
  text-align: center;
}

/*****
mdpLead
*****/

.mdpLead{
  font-feature-settings: "palt";
  font-size: 220%;
  font-weight: 600;
  color: #00491e;
}


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

  .mdpLead{
    font-size: 170%;
    line-height: 1.5;
  }
  .mdpLead br{
    display: none;
  }

}


/*****
mdpHeading
*****/

.mdpHeading {
  background-color: #00491e;
  font-family: 'Oswald', sans-serif;
  font-size: 200%;
  font-weight: 600;
  padding: 0.3em 1em;
  margin-bottom: 1em;
  color: #fff;
}
.mdpHeading span {
  display: inline-block;
  transform: skewX(-5deg);
}


.mdpTitle {
  font-size: 154%;
  font-feature-settings: "palt";
  border-bottom: 2px solid #00491e;
  color: #00491e;
  padding-bottom: 0.2em;
  margin-bottom: 1.5em;
}

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

  .mdpHeading {
    font-size: 154%;
  }

  .mdpTitle {
    font-size: 154%;
  }
}


/*****
mdpPickup
*****/

.mdpPickup {
  display: flex;
  padding-top: 1em;
}
.mdpPickup-visual {
  width: 45%;
  padding-right: 5%;
  font-feature-settings: "palt";
}
.mdpPickup-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-bottom: 1em;
}
.mdpPickup-heading-num {
  font-family: 'Oswald', sans-serif;
  font-size: 400%;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #00491e;
  transform: skewX(-5deg);
  line-height: 1;
  white-space: nowrap;
}
.mdpPickup-heading-name {
}
.mdpPickup-heading-title {
  text-align: right;
  line-height: 1;
}
.mdpPickup-heading-title span {
  display: block;
  font-size: 220%;
  font-weight: bold;
  color: #00491e;
}
.mdpPickup-heading-title small {
  display: block;
  font-family: 'Oswald', sans-serif;
  font-size: 139%;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #00491e;
  transform: skewX(-5deg);
  line-height: 1;
  white-space: nowrap;
  opacity: 0.4;
}
.mdpPickup-visual-img {
}

.mdpPickup-inner {
  flex: 1;
}

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

  .mdpPickup {
    display: block;
    padding-top: 1em;
  }
  .mdpPickup-visual {
    width: auto;
    max-width: 480px;
    margin: 0 auto;
    padding-right: 0;
  }

  .mdpPickup-inner {
    padding-top: 2em;
    flex: 1;
  }

}

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

  .mdpPickup-heading {
    flex-direction: row-reverse;
  }
  .mdpPickup-heading-num {
    font-size: 340%;
  }
  .mdpPickup-heading-title {
    text-align: left;
  }
  .mdpPickup-heading-title span {
    font-size: 170%;
  }
  .mdpPickup-heading-title small {
    font-size: 139%;
    line-height: 1;
  }

}



/*****
mdpTotal
*****/

.mdpTotal{
}

.mdpTotal-table {
  max-width: 640px;
  margin: 0 auto;
  white-space: nowrap;
}
.mdpTotal-table thead {
}
.mdpTotal-table thead tr {
  border-bottom: 2px solid #aaa;
}
.mdpTotal-table thead th {
  text-align: left;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  width: 30%;
}
.mdpTotal-table thead td {
  font-size: 220%;
  font-feature-settings: "palt";
  width: 40%;
}
.mdpTotal-table-heading {
  display: inline-block;
  background-color: #00491e;
  color: #fff;
  font-size: 154%;
  padding: 0.1em 1em;
}
.mdpTotal-table tbody tr {
  border-bottom: 1px solid #ccc;
}
.mdpTotal-table tbody th {
  font-size: 124%;
  text-align: left;
  padding: 0.56em 0;
}
.mdpTotal-table tbody td {
  font-size: 154%;
}


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

  .mdpTotal{
    font-feature-settings: "palt";
  }

  .mdpTotal-table thead th {
    width: 30%;
  }
  .mdpTotal-table thead td {
    font-size: 124%;
  }
  .mdpTotal-table-heading {
    font-size: 108%;
    padding: 0.1em 0.5em;
  }
  .mdpTotal-table tbody th {
    font-size: 93%;
  }
  .mdpTotal-table tbody td {
    font-size: 100%;
  }

}


/*****
mdpRecently
*****/

.mdpRecently * {
  pointer-events: none;
}

/*****
mdpSeparate
*****/

.mdpSeparate {
  display: flex;
  justify-content: space-between;
}
.mdpSeparate-item {
  width: 49%;
}

.mdpSeparate.is-reverse {
  flex-direction: row-reverse;
}

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

  .mdpSeparate {
    display: block;
  }
  .mdpSeparate-item {
    width: auto;
  }
  .mdpSeparate-item:not(:last-child) {
    padding-bottom: 2em;
  }

}



/*****
mdpMember
*****/

.mdpMember {
  font-feature-settings: "palt";
  background-color: #1c1c1c;
  color: #fff;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.mdpMember-heading {
  background-color: #00491e;
  color: #fff;
  padding: 0.8em 1em;
  font-feature-settings: "palt";
}
.mdpMember-heading-title {
  font-size: 154%;
}
.mdpMember-heading-text {
}

/*
data
*/

.mdpMember-data{
  background-color: #1c1c1c;
}
.mdpMember-data thead {
}
.mdpMember-data thead th{
  text-align: left;
  font-size: 93%;
  padding: 0.5em 0.8rem ;
}

.mdpMember-data tbody tr{
  border-top: 1px solid #333;
}
.mdpMember-data tbody th{
  text-align: left;
  padding: 0.5em 0.8rem;
  font-family: 'Oswald', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', sans-serif;
  font-weight: 600;
}

.mdpMember-data tbody th:nth-child(1){
  width: 4em;
}
.mdpMember-data tbody td:nth-child(3){
  width: 5em;
}
.mdpMember-data thead th:nth-child(3),
.mdpMember-data thead th:nth-child(4),
.mdpMember-data tbody td:nth-child(4),
.mdpMember-data tbody td:nth-child(5){
  width: 5em;
  text-align: center;
}


.mdpMember-card{
  white-space: nowrap;
  text-align: left;
}
.mdpMember-card span{
  display: inline-block;
  width: 1em;
  height: 1.5em;
  background-color: #ff0;
  transform: skewX(-10deg);
  margin-right: 2px;
}
.mdpMember-card span.mdpMember-card-y{
  background-color: #ff0;
}
.mdpMember-card span.mdpMember-card-r{
  background-color: #f00;
}


.mdpMember-manager {
  border-top: 1px solid #ddd;
  padding: 1em;
  display: flex;
  align-items: center;
}
.mdpMember-manager-title {
  font-size: 108%;
  font-weight: normal;
  padding-right: 1em;
}
.mdpMember-manager-name {
  font-size: 139%;
}

/*
ranking
*/

.mdpMember-ranking {
  background-color: #1c1c1c;
  color: #fff;
  font-feature-settings: "palt";
}
.mdpMember-ranking thead th{
  text-align: left;
  font-size: 124%;
  padding: 0.5em 0.8rem ;
  background-color: #333;
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #555;
}


.mdpMember-ranking tbody tr{
  border-top: 1px solid #333;
}
.mdpMember-ranking tbody th{
  text-align: left;
  padding: 0.5em 0.8rem;
  font-weight: normal;
  font-size: 124%;
}
.mdpMember-ranking tbody td{
  text-align: right;
  padding: 0.5em 2rem; 0.5em 1em
  font-weight: 600;
}

.mdpMember-ranking-num {
  display: inline-block;
  font-family: 'Oswald', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', sans-serif;
  font-weight: 600;
  text-align: center;
  font-size: 154%;
  transform: skewX(-6deg);
}


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

  .mdpMember {
  }
  .mdpMember-heading {
    font-size: 85%;
  }

  /*
  data
  */

  .mdpMember-data{
    font-size: 93%;
  }
}

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

  .mdpMember {
  }
  .mdpMember-heading {
    font-size: 100%;
  }
  .mdpMember-heading-title {
    font-size: 131%;
  }
  .mdpMember-heading-text {
    font-size: 93%;
  }

  /*
  data
  */

  .mdpMember-data{
    font-size: 100%;
  }
  .mdpMember-data thead th{
    text-align: left;
    font-size: 85%;
    padding: 0.5em 0.5rem ;
  }

  .mdpMember-data tbody th:nth-child(1){
    width: 4em;
  }
  .mdpMember-data tbody td:nth-child(3){
    width: 3.5em;
  }
  .mdpMember-data thead th:nth-child(3),
  .mdpMember-data thead th:nth-child(4),
  .mdpMember-data tbody td:nth-child(4),
  .mdpMember-data tbody td:nth-child(5){
    width: 3em;
    white-space: nowrap;
    text-align: center;
  }


  .mdpMember-card{
    white-space: nowrap;
    text-align: left;
  }
  .mdpMember-card span{
    width: 0.7em;
    height: 1em;
  }


  .mdpMember-manager-title {
    font-size: 100%;
  }
  .mdpMember-manager-name {
    font-size: 124%;
  }

  /*
  ranking
  */

  .mdpMember-ranking {
    background-color: #1c1c1c;
    color: #fff;
    font-feature-settings: "palt";
  }
  .mdpMember-ranking thead th{
    font-size: 108%;
  }


  .mdpMember-ranking tbody tr{
    border-top: 1px solid #333;
  }
  .mdpMember-ranking tbody th{
    font-size: 108%;
    font-weight: normal;
  }

}

/*****
mdpStats
*****/

.mdpStats{
  font-feature-settings: "palt";
  max-width: 640px;
  margin: 0 auto;
}
.mdpStats-data{
  background-color: #f0f0f0;
  pointer-events: none;
}

.mdpStats-data,
.mdpStats-data thead,
.mdpStats-data tbody,
.mdpStats-data tfoot,
.mdpStats-data tr,
.mdpStats-data th,
.mdpStats-data td{
  display: block;
}

.mdpStats-data thead tr{
  display: flex;
}
.mdpStats-data tbody tr{
  display: flex;
}


.mdpStats-data.is-reverse thead tr{
  flex-direction: row-reverse;
}
.mdpStats-data.is-reverse tbody tr{
  flex-direction: row-reverse;
}


.mdpStats-data thead{
  background-color: #00491e;
  color: #fff;
}

.mdpStats-data thead th{
  padding: 1em 0;
  text-align: center;
}
.mdpStats-data thead th:nth-child(2){
  background-color: #1c1c1c;
}

.mdpStats-data tbody tr {
  border-bottom: 1px solid #fff;
}
.mdpStats-data tbody th {
  background-color: #ddd;
  text-align: center;
  padding: 1em 0;
}
.mdpStats-data tbody td {
  padding: 0.5em 1em;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.mdpStats-data thead th:nth-child(1),
.mdpStats-data thead th:nth-child(3),
.mdpStats-data tbody td:nth-child(1),
.mdpStats-data tbody td:nth-child(3){
  width: 35%;
}
.mdpStats-data thead th:nth-child(2),
.mdpStats-data tbody th:nth-child(2){
  width: 30%;
}



.mdpStats-data-num {
  display: block;
  font-family: 'Oswald', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', sans-serif;
  font-weight: 600;
  text-align: center;
  font-size: 154%;
  transform: skewX(-6deg);
}

.mdpStats-graph {
  width: 100%;
  display: flex;
  align-items: center;
}
.mdpStats-graph-num {
  display: inline-block;
  width: 4em;
  font-family: 'Oswald', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', sans-serif;
  font-weight: 600;
  text-align: center;
  font-size: 124%;
  transform: skewX(-6deg) translateY(-0.1em);
  line-height: 1;
  white-space: nowrap;
}
.mdpStats-graph-bar {
  flex: 1;
  height: 1.5em;
  background-color: #fff;
  border: 1px solid #aaa;
  position: relative;
}
.mdpStats-graph-bar span{
  position: absolute;
  top: 0;
  width: 0%;
  height: 100%;
  background: #00491e;
}



.mdpStats-graph:not(.is-reverse) .mdpStats-graph-num{
  text-align: center;
}
.mdpStats-graph:not(.is-reverse) .mdpStats-graph-bar span{
  right: 0;
}

.mdpStats-graph.is-reverse {
  flex-direction: row-reverse;
}
.mdpStats-graph.is-reverse .mdpStats-graph-num{
  text-align: center;
}
.mdpStats-graph.is-reverse .mdpStats-graph-bar span{
  left: 0;
}




.mdpStats-data.is-reverse .mdpStats-graph{
  flex-direction:row-reverse;
}
.mdpStats-data.is-reverse .mdpStats-graph.is-reverse{
  flex-direction:row;
}
.mdpStats-data.is-reverse .mdpStats-graph:not(.is-reverse) .mdpStats-graph-bar span{
  left: 0;
  right: auto;
}
.mdpStats-data.is-reverse .mdpStats-graph.is-reverse .mdpStats-graph-bar span{
  left: auto;
  right: 0;
}

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

  .mdpStats-data thead th{
    padding: 1em 0.2em;
    text-align: center;
    font-size: 85%;
  }

  .mdpStats-data tbody tr {
  }
  .mdpStats-data tbody th {
    font-size: 77%;
    padding: 1em 0;
  }
  .mdpStats-data tbody td {
    padding: 1em 0.5em;
  }

  .mdpStats-data thead th:nth-child(1),
  .mdpStats-data thead th:nth-child(3){
    width: 35%;
  }

  .mdpStats-data-num {
    font-size: 124%;
  }

  .mdpStats-graph-num {
    font-size: 108%;
  }

}


/*****
mdpLink
*****/

.mdpLink {
  padding-left: 2em;
}
.mdpLink li {
  padding-bottom: 0.5em;
}
.mdpLink a {
  display: inline-block;
  font-size: 139%;
  font-feature-settings: "palt";
  font-weight: 600;
  color: #000;
  text-decoration: none;
  position: relative;
  padding-left: 1.0em;
  transition: 0s;
}
.mdpLink a:hover {
  text-decoration: underline;
  color: #00491e;
}
.mdpLink a::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  border-top: 2px solid #00491e;
  border-right: 2px solid #00491e;
  position: absolute;
  left: 0;
  top: 0.5em;
  transform: rotate(45deg) ;
}



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

  .mdpLink {
    padding-left: 0;
  }
  .mdpLink li {
    padding-bottom: 0.5em;
  }
  .mdpLink a {
    font-size: 124%;
  }
}

/*****
mdpChart
*****/

.mdpChart{
  padding-top: 3em;
}


/*******
btn
*******/

.mdpBtn {
  display: inline-block;
  padding: 40px 40px;
  width: 100%;
  background-color: #ff6000;
  color: #fff;
  border-radius: 10px;
  box-shadow: 0 3px 0 rgba(255, 96, 0, 0.5);
  text-align: center;
  font-size: 170%;
  font-feature-settings: "palt";
  font-weight: bold;
  text-decoration: none;
  position: relative;
}
.mdpBtn::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  position: absolute;
  right: 20px;
  top: 50%;
  margin-top: -6px;
  transform: rotate(45deg);
}


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

  .mdpBtn {
    padding: 25px 20px;
    font-size: 154%;
  }
  .mdpBtn::after {
    width: 6px;
    height: 6px;
    right: 15px;
    margin-top: -3px;
  }

}


/*****
mdpCv
*****/

.mdpCv{
  display: flex;
  justify-content: space-between;
}
.mdpCv-item{
  width: 48%;
  padding: 2em 0;
}

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


  .mdpCv{
    display: block;
  }
  .mdpCv-item{
    width: auto;
    padding: 1em 0;
  }

}

/*****
mdpPartner
*****/

.mdpPartner {
  display: flex;
  flex-wrap: wrap;
  margin-left: -2%;
  margin-bottom: -2%;
}
.mdpPartner li {
  width: 48%;
  margin-left: 2%;
  margin-bottom: 2%;
}
.mdpPartner.-trisect li {
  width: 31.3%;
}
.mdpPartner li.is-large {
  width: 98%;
}
.mdpPartner a {
}
.mdpPartner img {
  width: 100%;
  max-width: 100%;
  border: 1px solid #ddd;
}

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

  .mdpPartner.-trisect li {
    width: 48%;
  }

}


/*****
mdpRecruitHeading
*****/

.mdpRecruitHeading {
  background: url(../../img/bg08.png) no-repeat center center / cover;
  padding: 1.2em 2em;
  color: #fff;
  margin-bottom: 2em;
}
.mdpRecruitHeading-subTitle {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(20px,4.8vw, 30px);
  font-weight: 600;
  transform: skewX(-5deg);
}
.mdpRecruitHeading-title {
  font-size: clamp(14px,1.6vw, 16px);
  font-feature-settings: "palt";
  letter-spacing: 0.04em;
}

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

  .mdpRecruitHeading {
    padding: 0.8em 1.2em;
  }

}
