@charset "utf-8";

/* style-written-application.css
 * おまかせプラン ver.7 - v1.0.0
 * 2022-09-01
 * **************************************************
 * Written Application
 * **************************************************
 */

/* Written Application
------------------------------------------------------------------- */

/* Content */
.written-application .content__inner {
  margin: 70px auto 0 auto;
  padding: 0 50px;
  max-width: 1250px;
}

/* Table */
.app-table {
  width: 100%;
  border: 1px solid #d7d7d7;
  border-collapse: collapse;
}
.app-table thead th {
  padding: 6px 10px;
  border-right: 1px solid #d7d7d7;
  background-color: #3bb5e2;
  font-size: 1.5em;
  color: #fff;
  text-align: center;
  vertical-align: middle;
}
.app-table thead th:nth-child(2),
.app-table thead th:nth-child(3) {
  width: 120px;
}
.app-table thead th:nth-child(4) {
  width: 90px;
}
.app-table tbody th {
  padding: 6px 10px;
  width: 40%;
  border-top: 1px solid #d7d7d7;
  border-right: 1px solid #d7d7d7;
  background-color: #ffffff;
  font-size: 1.5em;
  font-weight: 500;
  text-align: left;
  vertical-align: middle;
}
.app-table td {
  padding: 6px 10px;
  border-top: 1px solid #d7d7d7;
  border-right: 1px solid #d7d7d7;
  background-color: #fff;
  font-size: 1.5em;
  text-align: left;
  line-height: 1.6;
  vertical-align: middle;
}
.app-table td:nth-child(2),
.app-table td:nth-child(3),
.app-table td:nth-child(4) {
  text-align: center;
}
.app-table .app-btn,
.app-table .examp-btn {
  display: block;
  padding: 1px 5px;
  -webkit-border-radius: 100vh;
  border-radius: 100vh;
  font-weight: bold;
  text-decoration: none; 
  transition: all 0.5s 0s ease;
}
.app-table .app-btn {
  border: 1px solid #e088cc;
  background-color: #e088cc;
  color: #fff;
}
/* PPT */
.app-table .app-btn[href$=".pptx"],
.app-table .app-btn[href$=".ppt"] {
  border-color: #ef582a;
  background-color: #ef582a;
}
/* Excel */
.app-table .app-btn[href$=".xlsx"],
.app-table .app-btn[href$=".xls"] {
  border-color: #7ec95d;
  background-color: #7ec95d;
}
/* Word */
.app-table .app-btn[href$=".docx"],
.app-table .app-btn[href$=".doc"] {
  border-color: #0058a6;
  background-color: #0058a6;
}
.app-table .examp-btn {
  border: 1px solid #f2f2f2;
  background-color: #f2f2f2;
  color: #000;
}
.app-table .app-btn:hover {
  background-color: #fff;
  color: #e088cc;
}
.app-table .app-btn[href$=".pptx"]:hover,
.app-table .app-btn[href$=".ppt"]:hover {
  color: #ef582a;
}
.app-table .app-btn[href$=".xlsx"]:hover,
.app-table .app-btn[href$=".xls"]:hover {
  color: #7ec95d;
}
.app-table .app-btn[href$=".docx"]:hover,
.app-table .app-table .app-btn[href$=".doc"]:hover {
  color: #0058a6;
}
.app-table .examp-btn:hover {
  border: 1px solid #000;
  background-color: #fff;
}

@media screen and (max-width: 767px) {
  /* Written Application
  ------------------------------------------------------------------- */

  /* Content */
  .written-application .content__inner {
    margin: 40px 0 0 0;
    padding: 0 15px;
    max-width: none;
  }

  /* Table */
  .app-table thead th:nth-child(2),
  .app-table thead th:nth-child(3) {
    width: 80px;
  }
  .app-table thead th:nth-child(4) {
    width: 70px;
  }
  .app-table thead th {
    padding: 3px 5px;
    font-size: 1.5em;
  }
  .app-table tbody th {
    padding: 3px 5px;
    width: 30%;
    font-size: 1.5em;
    line-height: 1.4;
  }
  .app-table td {
    padding: 3px 5px;
    font-size: 1.4em;
  }
}