@charset "UTF-8";
/*---------------------------
contents
----------------------------*/
.acms-admin-btn-action-group {
  margin: 0;
  margin-bottom: 0.5rem;
}

.acms-admin-revison-admin {
  margin-bottom: 3rem;
}

/*---------------------------
news
----------------------------*/
#news {
  max-width: 1000px;
  margin: auto;
}
#news .inner {
  text-align: left;
}
@media screen and (max-width: 767px) {
  #news .inner {
    max-width: 90%;
  }
}
#news .inner h1 {
  margin-bottom: 0.5rem;
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  #news .inner h1 {
    font-size: 1.1rem;
  }
}
#news .inner .date {
  margin-bottom: 1.5rem;
}
#news .inner .col {
  border-bottom: 1px solid #ccc;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 20px;
}
@media screen and (max-width: 767px) {
  #news .inner .col {
    grid-template-columns: 1fr;
    gap: 10px;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
  }
}
#news .inner .col h2,
#news .inner .col h3 {
  margin-bottom: 1rem;
}
#news .inner .col h2 {
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  #news .inner .col h2 {
    font-size: 1.1rem;
  }
}
#news .inner .col h3 {
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  #news .inner .col h3 {
    font-size: 1rem;
  }
}
#news .inner .col p {
  margin-bottom: 1rem;
}
#news .inner .news-pagination {
  margin-bottom: 2rem;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px;
}
#news .inner .news-pagination span,
#news .inner .news-pagination a {
  display: block;
  padding: 0.7rem 1rem;
  line-height: 1;
}
#news .inner .news-pagination span {
  background-color: #00bcc5;
  color: #fff;
}
#news .inner .news__txt {
  line-height: 2;
}
#news .inner .news__btn {
  border-top: 1px solid #ccc;
  padding-top: 1rem;
  margin-top: 2rem;
  margin-bottom: 2rem;
}
#news .row {
  text-align: left;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
#news .row .main {
  width: 75%;
}
#news .row .main h1 {
  margin-bottom: 1rem;
  font-size: 1.4rem;
}
#news .row .main .date {
  margin-bottom: 1.5rem;
}
#news .row .main .col {
  width: 100%;
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #ccc;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  text-align: left;
  position: relative;
}
#news .row .main .col:hover {
  background: #eee;
}
#news .row .main .col .img {
  width: 20%;
}
#news .row .main .col .txt {
  width: 75%;
}
#news .row .main .col .txt span {
  display: block;
  margin-bottom: 1rem;
  font-size: 1rem;
}
#news .row .main .col .txt span i {
  display: inline-block;
  background: #00bcc5;
  color: #fff;
  text-align: left;
  font-style: normal;
  line-height: 1rem;
  padding: 0.2rem 0.5rem;
  margin-right: 10px;
}
#news .row .main .col .txt h2 {
  font-size: 1.8rem;
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  #news .row .main .col .txt h2 {
    font-size: 1.1rem;
    margin-bottom: 1rem;
  }
}
#news .row .main .col a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
#news .row .side {
  width: 20%;
}
#news.event .title {
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #ccc;
}
#news.event .title h2 {
  font-size: 1.6rem;
  color: #b17156;
}

/*---------------------------
works
----------------------------*/
#works.office .inner .stitle .row .txt h2 span {
  color: #00bcc5;
}
#works.office .inner .stitle .row .txt p {
  margin-bottom: 2rem;
}
#works.office .inner .pnav ul li a span {
  color: #00bcc5;
}
#works.office .inner .pnav ul li a:hover {
  background-color: #00bcc5;
  color: #fff;
}
#works.office .inner .pnav ul li a:hover span {
  color: #fff;
}
#works.office .inner .box h3 span {
  color: #00bcc5;
}
#works.medicalcare .inner .stitle .row .txt h2 span {
  color: #6ab352;
}
#works.medicalcare .inner .pnav ul li a span {
  color: #6ab352;
}
#works.medicalcare .inner .pnav ul li a:hover {
  background-color: #6ab352;
  color: #fff;
}
#works.medicalcare .inner .pnav ul li a:hover span {
  color: #fff;
}
#works.medicalcare .inner .box h3 span {
  color: #6ab352;
}
#works.fd .inner .stitle .row .txt h2 span {
  color: #a5574d;
}
#works.fd .inner .pnav ul li a span {
  color: #a5574d;
}
#works.fd .inner .pnav ul li a:hover {
  background-color: #a5574d;
  color: #fff;
}
#works.fd .inner .pnav ul li a:hover span {
  color: #fff;
}
#works.fd .inner .box h3 span {
  color: #a5574d;
}
#works.consulting .inner .stitle .row .txt h2 span {
  color: #bc993b;
}
#works.consulting .inner .pnav ul li a span {
  color: #bc993b;
}
#works.consulting .inner .pnav ul li a:hover {
  background-color: #bc993b;
  color: #fff;
}
#works.consulting .inner .pnav ul li a:hover span {
  color: #fff;
}
#works.consulting .inner .box h3 span {
  color: #bc993b;
}
#works.consulting .inner .box .btn {
  margin-top: 2rem;
}
#works.consulting .inner .box .btn a {
  background-color: #bc993b;
  color: #fff;
  padding: 1rem 3rem;
  text-decoration: none;
}
#works.consulting .inner .box .zoom {
  width: 70%;
  margin-left: auto;
}
@media screen and (max-width: 767px) {
  #works.consulting .inner .box .zoom {
    width: 100%;
  }
}
#works.consulting .inner .box .zoom .col {
  width: 100%;
  margin-bottom: 1.5rem;
}
#works.communication .inner .stitle .row .txt h2 span {
  color: #9f77b0;
}
#works.communication .inner .pnav ul li a span {
  color: #9f77b0;
}
#works.communication .inner .pnav ul li a:hover {
  background-color: #9f77b0;
  color: #fff;
}
#works.communication .inner .pnav ul li a:hover span {
  color: #fff;
}
#works.communication .inner .box h3 span {
  color: #9f77b0;
}
#works.event .inner .stitle .row .txt h2 span {
  color: #b17656;
}
#works.event .inner .stitle .row .txt .col {
  display: block;
}
#works.event .inner .stitle .row .txt .col span {
  width: 100%;
  display: block;
  margin-bottom: 1rem;
  font-weight: bold;
}
#works.event .inner .stitle .row .txt .col a {
  width: 100%;
  display: block;
  font-size: 1.2rem;
}
#works.event .inner .pnav ul li a span {
  color: #b17656;
}
#works.event .inner .pnav ul li a:hover {
  background-color: #b17656;
  color: #fff;
}
#works.event .inner .pnav ul li a:hover span {
  color: #fff;
}
#works.event .inner .box h3 span {
  color: #b17656;
}
@media screen and (max-width: 767px) {
  #works .inner {
    max-width: 90%;
  }
}
#works .inner .title {
  margin-bottom: 4rem;
  text-align: left;
}
#works .inner .title span {
  display: block;
  margin-bottom: 1rem;
  font-size: 1.8rem;
}
@media screen and (max-width: 767px) {
  #works .inner .title span {
    font-size: 1.1rem;
  }
}
#works .inner .row .col {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 2.5rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid #ccc;
  text-align: left;
}
#works .inner .row .col .img {
  width: 22%;
}
@media screen and (max-width: 767px) {
  #works .inner .row .col .img {
    width: 20%;
  }
}
#works .inner .row .col .txt {
  width: 73%;
}
@media screen and (max-width: 767px) {
  #works .inner .row .col .txt {
    width: 75%;
  }
}
#works .inner .row .col .txt h2 a {
  text-decoration: none;
  display: block;
  font-size: 1.2rem;
  margin-bottom: 1.5rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  #works .inner .row .col .txt h2 a {
    font-size: 1rem;
    margin-bottom: 3rem;
  }
}
#works .inner .row .col .txt h2 a span {
  font-family: "Oswald", sans-serif;
  font-weight: lighter;
  font-size: 2.6rem;
  margin-bottom: 1rem;
  display: block;
  letter-spacing: 2px;
  vertical-align: sub;
}
@media screen and (max-width: 767px) {
  #works .inner .row .col .txt h2 a span {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 1.6rem;
  }
}
#works .inner .row .col .txt ul li {
  list-style: none;
  border-bottom: 1px solid #ccc;
}
#works .inner .row .col .txt ul li:last-child {
  border-bottom: none;
}
#works .inner .row .col .txt ul li a {
  display: block;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 1rem 0;
  text-decoration: none;
  background-image: url(../img/common/icon_arrow.png);
  background-repeat: no-repeat;
  background-position: 98% center;
}
#works .inner .row .col .txt ul li a span {
  font-family: "Oswald", sans-serif;
  font-weight: bold;
  width: 7%;
  font-size: 1.2rem;
}
@media screen and (max-width: 767px) {
  #works .inner .row .col .txt ul li a span {
    margin-left: -1.5rem;
    margin-right: 1rem;
  }
}
#works .inner .row .col .txt ul li a:hover {
  background-color: #eee;
}
#works .inner .row .col .txt > p {
  margin-bottom: 1.5rem;
}
#works .inner .row .col .txt > a {
  display: block;
  border: 1px solid #ccc;
  padding: 1.5rem;
  background-image: url(../img/common/icon_arrow.png);
  background-repeat: no-repeat;
  background-position: 98% center;
  text-decoration: none;
}
#works .inner .row .col .txt > a:hover {
  background-color: #eee;
}
#works .inner .row .col:nth-of-type(1) .txt h2 span {
  color: #00bcc5;
}
#works .inner .row .col:nth-of-type(1) .txt ul span {
  color: #00bcc5;
}
#works .inner .row .col:nth-of-type(2) .txt h2 span {
  color: #75ab60;
}
#works .inner .row .col:nth-of-type(2) .txt ul span {
  color: #75ab60;
}
#works .inner .row .col:nth-of-type(3) .txt h2 span {
  color: #ce8281;
  letter-spacing: 1px;
}
#works .inner .row .col:nth-of-type(3) .txt ul span {
  color: #ce8281;
}
#works .inner .row .col:nth-of-type(4) .txt h2 span {
  color: #d1ac4b;
}
#works .inner .row .col:nth-of-type(4) .txt ul span {
  color: #d1ac4b;
}
#works .inner .row .col:nth-of-type(5) .txt h2 span {
  color: #846bbf;
}
#works .inner .row .col:nth-of-type(5) .txt ul span {
  color: #846bbf;
}
#works .inner .row .col:nth-of-type(6) .txt h2 span {
  color: #9e7456;
}
#works .inner .row .col:nth-of-type(6) .txt ul span {
  color: #9e7456;
}
#works .inner .smenu {
  margin-bottom: 3rem;
}
#works .inner .smenu ul {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
  #works .inner .smenu ul {
    flex-wrap: wrap;
  }
}
#works .inner .smenu ul li {
  width: 16%;
  list-style: none;
}
@media screen and (max-width: 767px) {
  #works .inner .smenu ul li {
    width: 49.5%;
    margin-bottom: 3px;
  }
}
#works .inner .smenu ul li a {
  display: block;
  background: #ccc;
  color: #000;
  text-decoration: none;
  padding: 0.7rem 1rem;
}
@media screen and (max-width: 767px) {
  #works .inner .smenu ul li a {
    padding: 0.5rem;
  }
}
#works .inner .smenu ul li.on a {
  background-color: #999;
  color: #fff;
}
#works .inner .smenu ul li:nth-of-type(1).on a {
  background-color: #00bcc5;
}
#works .inner .smenu ul li:nth-of-type(2).on a {
  background-color: #6ab352;
}
#works .inner .smenu ul li:nth-of-type(3).on a {
  background-color: #a5574d;
}
#works .inner .smenu ul li:nth-of-type(4).on a {
  background-color: #bc993b;
}
#works .inner .smenu ul li:nth-of-type(5).on a {
  background-color: #9f77b0;
}
#works .inner .smenu ul li:nth-of-type(6).on a {
  background-color: #b17656;
}
#works .inner .pnav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 3rem;
}
#works .inner .pnav ul li {
  width: 49%;
  border: 1px solid #ccc;
  list-style: none;
  margin-bottom: 8px;
}
@media screen and (max-width: 767px) {
  #works .inner .pnav ul li {
    width: 100%;
  }
}
#works .inner .pnav ul li:nth-of-type(odd) {
  margin-right: 2%;
}
@media screen and (max-width: 767px) {
  #works .inner .pnav ul li:nth-of-type(odd) {
    margin-right: 0;
  }
}
#works .inner .pnav ul li a {
  display: block;
  position: relative;
  padding: 1rem;
  padding-left: 10%;
  text-align: left;
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  #works .inner .pnav ul li a {
    padding: 0.5rem 1rem;
    padding-left: 15%;
  }
}
#works .inner .pnav ul li a span {
  position: absolute;
  top: 1rem;
  left: 10px;
  font-size: 1.6rem;
  font-weight: bold;
  font-family: "Oswald", sans-serif;
}
@media screen and (max-width: 767px) {
  #works .inner .pnav ul li a span {
    top: 0.5rem;
    font-size: 1.2rem;
  }
}
#works .inner .stitle {
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  #works .inner .stitle {
    margin-bottom: 2rem;
  }
}
#works .inner .stitle .row {
  margin-bottom: 2rem;
}
#works .inner .stitle .row .img {
  width: 18%;
}
#works .inner .stitle .row .txt {
  width: 77%;
  text-align: left;
}
#works .inner .stitle .row .txt h2 {
  font-size: 1.2rem;
  padding-bottom: 1.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #ccc;
}
@media screen and (max-width: 767px) {
  #works .inner .stitle .row .txt h2 {
    font-size: 1rem;
  }
}
#works .inner .stitle .row .txt h2 span {
  font-family: "Oswald", sans-serif;
  font-size: 3rem;
  margin-right: 10px;
  vertical-align: middle;
  font-weight: normal;
  letter-spacing: 1px;
  display: block;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  #works .inner .stitle .row .txt h2 span {
    font-size: 1.6rem;
  }
}
#works .inner .stitle .row .txt p {
  font-size: 1.2rem;
}
@media screen and (max-width: 767px) {
  #works .inner .stitle .row .txt p {
    font-size: 1rem;
  }
}
#works .inner .stitle .btxt {
  line-height: 1.8rem;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #works .inner .stitle .btxt {
    line-height: 1.2rem;
  }
}
#works .inner .top_img {
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  #works .inner .top_img {
    display: none;
  }
}
#works .inner .box {
  border-bottom: 1px solid #ccc;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}
#works .inner .box h3 {
  margin-bottom: 2rem;
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  #works .inner .box h3 {
    font-size: 1.1rem;
  }
}
#works .inner .box h3 span {
  display: inline-block;
  font-size: 2.6rem;
  font-family: "Oswald", sans-serif;
  font-weight: normal;
  width: 7%;
  vertical-align: middle;
}
@media screen and (max-width: 767px) {
  #works .inner .box h3 span {
    font-size: 1.6rem;
    font-weight: bold;
    width: 15%;
  }
}
#works .inner .box > .row {
  margin-bottom: 2.5rem;
}
#works .inner .box > .row .img {
  width: 25%;
}
@media screen and (max-width: 767px) {
  #works .inner .box > .row .img {
    width: 100%;
    margin-bottom: 1rem;
  }
  #works .inner .box > .row .img img {
    width: 100%;
    height: auto;
  }
}
#works .inner .box > .row .txt {
  width: 70%;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #works .inner .box > .row .txt {
    width: 100%;
  }
}
#works .inner .box > .row .txt span {
  display: block;
  font-weight: bold;
  margin-bottom: 1rem;
  font-size: 1.4rem;
  line-height: 1.8rem;
}
@media screen and (max-width: 767px) {
  #works .inner .box > .row .txt span {
    font-size: 1.1rem;
    line-height: 1.5rem;
  }
  #works .inner .box > .row .txt span br {
    display: none;
  }
}
#works .inner .box > .row.wide {
  margin-bottom: 0;
}
#works .inner .box > .row.wide .txt {
  width: 100%;
  margin-bottom: 2rem;
}
#works .inner .box > .row.wide .img {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
#works .inner .box > .row.wide .img .col {
  flex-wrap: wrap;
  padding-bottom: 0;
  margin-bottom: 10px;
  border-bottom: none;
}
#works .inner .box > .row.wide .img .col img {
  width: 100%;
  height: auto;
}
#works .inner .box > .row.wide .img .col p {
  width: 100%;
  padding-top: 0.3rem;
  display: block;
  text-align: center;
}
#works .inner .box > .row.wide .img.col2 .col {
  width: 48%;
}
#works .inner .box > .row.wide .img.col3 .col {
  width: 31%;
}
@media screen and (max-width: 767px) {
  #works .inner .box > .row.wide .img.col3 .col {
    width: 48%;
  }
}
#works .inner .box .exp > .row .col .txt {
  width: 75%;
}
#works .inner .box .exp > .row .col .txt span {
  display: block;
  margin-bottom: 1rem;
  font-weight: bold;
  font-size: 1.4rem;
}
#works .inner .box .exp > .row .col .img {
  width: 20%;
  border: 1px solid #ccc;
}
#works {
  /*---------------------------
    event
    ----------------------------*/
}
#works.event .inner p {
  border: 1px solid #ccc;
  font-size: 2rem;
  padding: 2rem;
  text-align: center;
}

/*---------------------------
company
----------------------------*/
#company {
  margin-bottom: 4rem;
}
#company .inner {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
  #company .inner {
    flex-wrap: wrap;
    max-width: 90%;
  }
}
#company .inner .main {
  width: 820px;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #company .inner .main {
    width: 100%;
    margin-bottom: 2rem;
  }
}
#company .inner .main h2 {
  font-size: 1.6rem;
  margin-bottom: 3rem;
  letter-spacing: 10px;
}
@media screen and (max-width: 767px) {
  #company .inner .main h2 {
    font-size: 1.2rem;
    margin-bottom: 1.5rem;
  }
}
#company .inner .main table {
  width: 100%;
  text-align: left;
}
#company .inner .main table tr:nth-of-type(odd) {
  background: #e5e5e5;
}
@media screen and (max-width: 767px) {
  #company .inner .main table tr:nth-of-type(odd) {
    background: #fff;
  }
}
#company .inner .main table tr:nth-of-type(odd) th {
  background: #00a9b1;
}
@media screen and (max-width: 767px) {
  #company .inner .main table tr:nth-of-type(odd) th {
    background: #00bcc5;
  }
}
#company .inner .main table tr th {
  width: 20%;
  padding: 1.5rem 1rem;
  background: #00bcc5;
  font-weight: 500;
  vertical-align: top;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #company .inner .main table tr th {
    width: 100%;
    display: block;
  }
}
#company .inner .main table tr td {
  padding: 1.5rem 1rem;
}
@media screen and (max-width: 767px) {
  #company .inner .main table tr td {
    width: 100%;
    display: block;
  }
}
#company .inner .main table tr td .row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
#company .inner .main table tr td .row .col {
  width: 48%;
}
#company .inner .main .img_col2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 1.5rem 0;
}
#company .inner .main .img_col2 img {
  width: 100%;
}
#company .inner .main #outline table tr th {
  width: 15%;
}
@media screen and (max-width: 767px) {
  #company .inner .main #outline table tr th {
    width: 100%;
    padding: 0.5rem;
  }
}
#company .inner .main #outline table tr td {
  width: 85%;
}
@media screen and (max-width: 767px) {
  #company .inner .main #outline table tr td {
    width: 100%;
    padding: 0.5rem;
  }
}
#company .inner .main #outline table tr td.address {
  line-height: 1.6rem;
}
@media screen and (max-width: 767px) {
  #company .inner .main #outline table tr td .row {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) {
  #company .inner .main #outline table tr td .row .col {
    width: 100%;
    margin-bottom: 1rem;
  }
}
#company .inner .main #outline table tr td dl > div {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 10px;
}
#company .inner .main #greeting {
  margin-bottom: 4rem;
}
#company .inner .main #greeting .row {
  margin-bottom: 2rem;
}
#company .inner .main #greeting .row .img {
  width: 35%;
}
@media screen and (max-width: 767px) {
  #company .inner .main #greeting .row .img {
    width: 100%;
    margin-bottom: 1rem;
  }
  #company .inner .main #greeting .row .img img {
    width: 100%;
    height: auto;
  }
}
#company .inner .main #greeting .row .txt {
  width: 60%;
}
@media screen and (max-width: 767px) {
  #company .inner .main #greeting .row .txt {
    width: 100%;
  }
}
#company .inner .main #greeting .txt {
  width: 100%;
}
#company .inner .main #greeting .name {
  text-align: right;
  margin-top: 3rem;
}
@media screen and (max-width: 767px) {
  #company .inner .main #greeting .name img {
    max-width: 80%;
    height: auto;
  }
}
#company .inner .main #vision h2 {
  border-bottom: 1px solid #ccc;
  padding-bottom: 2rem;
}
#company .inner .main #vision .row .col {
  width: 100%;
  padding-left: 10%;
  position: relative;
  border-bottom: 1px solid #ccc;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  #company .inner .main #vision .row .col {
    padding-left: 15%;
  }
}
#company .inner .main #vision .row .col h3 {
  font-size: 1.6rem;
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  #company .inner .main #vision .row .col h3 {
    font-size: 1.3rem;
    margin-bottom: 1.5rem;
  }
}
#company .inner .main #vision .row .col h4 {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
}
#company .inner .main #vision .row .col span {
  display: block;
  margin-bottom: 1rem;
  font-size: 1.6rem;
  color: #00bcc5;
}
@media screen and (max-width: 767px) {
  #company .inner .main #vision .row .col span {
    font-size: 1.3rem;
  }
}
#company .inner .main #vision .row .col ul {
  margin-left: 1.5rem;
}
#company .inner .main #vision .row .col:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  font-family: "Oswald", sans-serif;
  font-size: 3rem;
  color: #00bcc5;
}
@media screen and (max-width: 767px) {
  #company .inner .main #vision .row .col:before {
    font-size: 2.6rem;
  }
}
#company .inner .main #vision .row .col:nth-of-type(1):before {
  content: "01";
}
#company .inner .main #vision .row .col:nth-of-type(2):before {
  content: "02";
}
#company .inner .main #vision .row .col:nth-of-type(3):before {
  content: "03";
}
#company .inner .main #vision .row .col:nth-of-type(4):before {
  content: "04";
}
#company .inner .main #vision .row .col.rinen {
  margin-bottom: 3rem;
  padding-left: 0;
  border-bottom: none;
}
#company .inner .main #vision .row .col.rinen:before {
  display: none;
}
@media screen and (max-width: 767px) {
  #company .inner .main #history table tr:nth-of-type(odd) {
    background-color: #fff;
  }
}
#company .inner .main #history table tr th {
  width: 35%;
}
@media screen and (max-width: 767px) {
  #company .inner .main #history table tr th {
    width: 100%;
    padding: 1rem;
  }
}
@media screen and (max-width: 1024px) {
  #company .inner .main #history table tr td {
    padding: 1rem;
  }
}
#company .inner .main #access #map01,
#company .inner .main #access #map02,
#company .inner .main #access #map03 {
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #ccc;
}
#company .inner .main #access #map01:last-child,
#company .inner .main #access #map02:last-child,
#company .inner .main #access #map03:last-child {
  border-bottom: none;
}
#company .inner .main #access #map01 .row,
#company .inner .main #access #map02 .row,
#company .inner .main #access #map03 .row {
  margin-bottom: 2rem;
}
#company .inner .main #access #map01 .row .img,
#company .inner .main #access #map02 .row .img,
#company .inner .main #access #map03 .row .img {
  width: 25%;
}
#company .inner .main #access #map01 .row .txt,
#company .inner .main #access #map02 .row .txt,
#company .inner .main #access #map03 .row .txt {
  width: 70%;
}
#company .inner .main #access #map01 .row .txt:wide,
#company .inner .main #access #map02 .row .txt:wide,
#company .inner .main #access #map03 .row .txt:wide {
  width: 100%;
}
#company .inner .main #access #map01 .maparea,
#company .inner .main #access #map02 .maparea,
#company .inner .main #access #map03 .maparea {
  position: relative;
  width: 100%;
  padding-top: 300px;
  overflow: hidden;
}
#company .inner .main #access #map01 .maparea iframe,
#company .inner .main #access #map02 .maparea iframe,
#company .inner .main #access #map03 .maparea iframe {
  width: 100%;
  height: 400px;
  position: absolute;
  top: -150px;
  left: 0;
  width: 100%;
  height: calc(100% + 150px + 150px);
  pointer-events: none;
}
#company .inner .main #qualification h3 {
  padding: 0.5rem;
  background-color: #00bcc5;
  color: #fff;
}
#company .inner .main #qualification table {
  margin-bottom: 4rem;
}
#company .inner .main #qualification table tr {
  border-bottom: 1px solid #ccc;
}
#company .inner .main #qualification table tr th {
  padding: 0.5rem;
}
#company .inner .main #qualification table tr td {
  padding: 0.5rem;
}
#company .inner .main #qualification table.person_list tr th:nth-of-type(1) {
  width: 25%;
  border-right: 1px solid #fff;
}
#company .inner .main #qualification table.person_list tr th:nth-of-type(2) {
  width: 50%;
  border-right: 1px solid #fff;
}
#company .inner .main #qualification table.person_list tr th:nth-of-type(3) {
  width: 25%;
}
@media screen and (max-width: 767px) {
  #company .inner .main #qualification table.person_list tr th {
    display: table-cell;
  }
}
#company .inner .main #qualification table.person_list tr td:nth-of-type(1), #company .inner .main #qualification table.person_list tr td:nth-of-type(2) {
  border-right: 1px solid #ccc;
}
@media screen and (max-width: 767px) {
  #company .inner .main #qualification table.person_list tr td {
    display: table-cell;
  }
  #company .inner .main #qualification table.person_list tr td:nth-of-type(1) {
    width: 25%;
  }
  #company .inner .main #qualification table.person_list tr td:nth-of-type(2) {
    width: 50%;
  }
  #company .inner .main #qualification table.person_list tr td:nth-of-type(3) {
    width: 25%;
  }
}
#company .inner .main #safety > .txt {
  margin-bottom: 4rem;
}
#company .inner .main #safety .row .col {
  width: 100%;
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 1px solid #ccc;
}
@media screen and (max-width: 767px) {
  #company .inner .main #safety .row .col {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
#company .inner .main #safety .row .col .img {
  width: 40%;
}
@media screen and (max-width: 767px) {
  #company .inner .main #safety .row .col .img {
    width: 100%;
    margin-bottom: 1rem;
  }
  #company .inner .main #safety .row .col .img img {
    width: 100%;
    height: auto;
  }
}
#company .inner .main #safety .row .col .txt {
  width: 55%;
}
@media screen and (max-width: 767px) {
  #company .inner .main #safety .row .col .txt {
    width: 100%;
  }
}
#company .inner .main #safety .row .col .txt .title {
  margin-bottom: 2.5rem;
  font-size: 2rem;
}
@media screen and (max-width: 767px) {
  #company .inner .main #safety .row .col .txt .title {
    font-size: 1.4rem;
    margin-bottom: 1.5rem;
  }
}
#company .inner .main #safety .row .col .txt .title span {
  display: inline-block;
  margin-right: 10px;
  font-size: 4rem;
  color: #00bcc5;
  font-family: "Oswald", sans-serif;
  vertical-align: middle;
}
@media screen and (max-width: 767px) {
  #company .inner .main #safety .row .col .txt .title span {
    font-size: 2rem;
    vertical-align: baseline;
  }
}
#company .inner .main #safety .dclaration .col {
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #ccc;
}
#company .inner .main #safety .dclaration .col span {
  font-size: 1.8rem;
  font-weight: bold;
  display: block;
  margin-bottom: 1.5rem;
  letter-spacing: 5px;
  color: #00bcc5;
}
@media screen and (max-width: 767px) {
  #company .inner .main #safety .dclaration .col span {
    font-size: 1.2rem;
    margin-bottom: 1rem;
  }
}
#company .inner .main #safety .dclaration .col p {
  line-height: 1.8rem;
}
#company .inner .main #safety .dclaration .col .name {
  text-align: right;
  padding-top: 1rem;
}
#company .inner .main #safety .bottom {
  text-align: right;
}
#company .inner .main #social .row .col {
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #ccc;
}
#company .inner .main #social .row .col h3 {
  font-size: 1.6rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  #company .inner .main #social .row .col h3 {
    font-size: 1.2rem;
  }
}
#company .inner .main #social .row .col .txt {
  margin-bottom: 2rem;
}
#company .inner .main #social .row .col .img {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
  #company .inner .main #social .row .col .img {
    flex-wrap: wrap;
  }
}
#company .inner .main #social .row .col .img img {
  margin-bottom: 10px;
}
@media screen and (max-width: 767px) and (max-width: 320px) {
  #company .inner .main #social .row .col .img img {
    /*sp 320*/
    width: 100%;
    height: auto;
  }
}
#company .inner .side {
  width: 210px;
}
@media screen and (max-width: 767px) {
  #company .inner .side {
    width: 100%;
  }
}
#company .inner .side h2 {
  padding: 1rem;
  background-color: #008898;
  color: #fff;
}
#company .inner .side ul li {
  list-style: none;
}
#company .inner .side ul li a {
  display: block;
  padding: 1.5rem 0;
  border-bottom: 1px solid #ccc;
  text-align: left;
  text-decoration: none;
  font-size: 1rem;
  line-height: 1.2rem;
}
@media screen and (max-width: 767px) {
  #company .inner .side ul li a {
    padding: 0.7rem 0;
  }
}
#company .inner .side ul li a:hover {
  background-color: #00bcc5;
  padding: 1.5rem 1rem;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #company .inner .side ul li a:hover {
    padding: 0.7rem 0.5rem;
  }
}
#company .inner .side ul li.on a {
  background-color: #00bcc5;
  padding: 1.5rem 1rem;
  color: #fff;
  border-bottom: none;
}
@media screen and (max-width: 767px) {
  #company .inner .side ul li.on a {
    padding: 0.7rem 0.5rem;
  }
}

/*---------------------------
performance
----------------------------*/
@media screen and (max-width: 767px) {
  #performance .inner {
    max-width: 90%;
  }
}
#performance .inner p {
  font-size: 1.2rem;
  margin-bottom: 2rem;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #performance .inner p {
    font-size: 1rem;
  }
}
#performance .inner .img {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  #performance .inner .img img {
    width: 50%;
    height: auto;
  }
  #performance .inner .img img:last-child {
    display: none;
  }
}
#performance .inner .row .col {
  width: 100%;
  margin-bottom: 4rem;
}
#performance .inner .row .col h3 {
  background-color: #00bcc5;
  color: #fff;
  padding: 1rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  #performance .inner .row .col h3 {
    padding: 0.5rem;
  }
}
#performance .inner .row .col h4 {
  background: #999;
  padding: 1rem;
  text-align: left;
  color: #fff;
  letter-spacing: 4px;
}
#performance .inner .row .col table {
  width: 100%;
  text-align: left;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  #performance .inner .row .col table {
    display: block;
    border: 1px solid #ccc;
    border-top: none;
  }
}
@media screen and (max-width: 767px) {
  #performance .inner .row .col table tbody {
    width: 100%;
    display: block;
  }
}
#performance .inner .row .col table tr {
  border-bottom: 1px solid #e5e5e5;
}
#performance .inner .row .col table tr:nth-of-type(even) {
  background-color: #e5e5e5;
}
@media screen and (max-width: 767px) {
  #performance .inner .row .col table tr:last-child {
    border-bottom: none;
  }
}
@media screen and (max-width: 767px) {
  #performance .inner .row .col table tr {
    width: 100%;
    display: block;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
  }
}
#performance .inner .row .col table tr td {
  padding: 1rem;
}
@media screen and (max-width: 767px) {
  #performance .inner .row .col table tr td {
    display: block;
  }
}
#performance .inner .row .col table tr td:nth-of-type(1) {
  width: 15%;
}
@media screen and (max-width: 767px) {
  #performance .inner .row .col table tr td:nth-of-type(1) {
    width: 100%;
    padding: 1rem;
    padding-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  #performance .inner .row .col table tr td:nth-of-type(2) {
    width: 100%;
    padding: 1rem;
    padding-top: 0.2rem;
  }
}

/*---------------------------
recruit
----------------------------*/
#recruit .inner {
  text-align: left;
}
@media screen and (max-width: 767px) {
  #recruit .inner {
    max-width: 90%;
  }
}
#recruit .inner h3 {
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  #recruit .inner h3 {
    font-size: 1.2rem;
  }
}
#recruit .inner h3.line {
  border-bottom: 1px solid #ccc;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}
#recruit .inner h3 span {
  color: #999;
  margin-left: 20px;
  font-size: 1.2rem;
}
@media screen and (max-width: 767px) {
  #recruit .inner h3 span {
    font-size: 0.8rem;
  }
}
#recruit .inner .info {
  margin-bottom: 3rem;
}
#recruit .inner .info p {
  font-size: 1.6rem;
  line-height: 2rem;
  letter-spacing: 4px;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  #recruit .inner .info p {
    font-size: 1.1rem;
    letter-spacing: 1px;
  }
}
#recruit .inner .info .img {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 2rem;
}
#recruit .inner .info .img img {
  margin: auto;
}
#recruit .inner .message {
  margin-bottom: 3rem;
}
#recruit .inner .message .row .col {
  width: 100%;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid #ccc;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
#recruit .inner .message .row .col .img {
  width: 15%;
}
@media screen and (max-width: 767px) {
  #recruit .inner .message .row .col .img {
    width: 20%;
  }
}
#recruit .inner .message .row .col .txt {
  width: 80%;
}
@media screen and (max-width: 767px) {
  #recruit .inner .message .row .col .txt {
    width: 75%;
  }
}
#recruit .inner .message .row .col .txt span {
  font-weight: bold;
  font-size: 1.2rem;
  display: block;
  margin-bottom: 1rem;
  color: #00bcc5;
}
#recruit .inner .row .col {
  width: 48%;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .col {
    width: 100%;
    margin-bottom: 0.5rem;
  }
}
#recruit .inner .row .main {
  width: 820px;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .main {
    width: 100%;
    margin-bottom: 1rem;
  }
}
#recruit .inner .row .main h2 {
  font-size: 1.6rem;
  margin-bottom: 3rem;
  letter-spacing: 10px;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .main h2 {
    font-size: 1.2rem;
    margin-bottom: 1.5rem;
  }
}
#recruit .inner .row .main #req table tr td span {
  font-weight: bold;
  display: block;
}
#recruit .inner .row .main #req .entry {
  margin-top: 4rem;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .main #req .entry {
    margin-top: 2rem;
  }
}
#recruit .inner .row .main #req .entry p {
  margin-bottom: 2rem;
  text-align: center;
}
#recruit .inner .row .main #req .entry p span {
  font-family: "Oswald", sans-serif;
  font-size: 2.4rem;
  display: inline-block;
  color: #227fd0;
  margin-right: 10px;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .main #req .entry p span {
    margin-right: 0;
    margin-bottom: 1rem;
    font-size: 1.6rem;
    display: block;
    width: 100%;
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .main #req .entry .row a {
    display: block;
    margin-bottom: 0.5rem;
  }
}
#recruit .inner .row .main #welfare > .row {
  margin-bottom: 2rem;
}
#recruit .inner .row .main #welfare > .row > .col {
  width: 100%;
  margin-bottom: 2rem;
  padding-left: 2rem;
  background-image: url(../img/recruit/icon_arrow.png);
  background-repeat: no-repeat;
  background-position: left 10px;
}
#recruit .inner .row .main #welfare > .row > .col h3 {
  font-size: 1.4rem;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid #ccc;
  color: #00bcc5;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .main #welfare > .row > .col h3 {
    font-size: 1.2rem;
  }
}
#recruit .inner .row .main #welfare .event h3 {
  font-size: 1.4rem;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid #ccc;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .main #welfare .event h3 {
    font-size: 1.2rem;
  }
}
#recruit .inner .row .main #welfare .event p {
  margin-bottom: 1rem;
}
#recruit .inner .row .main #welfare .event > .row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
#recruit .inner .row .main #welfare .event > .row > .col {
  width: 48%;
}
#recruit .inner .row .main #welfare .event > .row > .col img {
  width: 100%;
  height: auto;
}
#recruit .inner .row .side {
  width: 210px;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .side {
    width: 100%;
  }
}
#recruit .inner .row .side h2 {
  padding: 1rem;
  background-color: #008898;
  color: #fff;
}
#recruit .inner .row .side ul li {
  list-style: none;
}
#recruit .inner .row .side ul li a {
  display: block;
  padding: 1rem 0;
  border-bottom: 1px solid #ccc;
  text-align: left;
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .side ul li a {
    padding: 1rem 0;
  }
}
#recruit .inner .row .side ul li a:hover {
  background-color: #00bcc5;
  padding: 1rem 1rem;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #recruit .inner .row .side ul li a:hover {
    padding: 1rem 1rem;
  }
}
#recruit .inner .row .side ul li.on a {
  background-color: #00bcc5;
  padding: 1rem 1rem;
  color: #fff;
  border-bottom: none;
}
#recruit .inner table {
  width: 100%;
  text-align: left;
}
#recruit .inner table tr:nth-of-type(odd) {
  background: #e5e5e5;
}
@media screen and (max-width: 767px) {
  #recruit .inner table tr:nth-of-type(odd) {
    background: #fff;
  }
}
#recruit .inner table tr:nth-of-type(odd) th {
  background: #00a9b1;
}
@media screen and (max-width: 767px) {
  #recruit .inner table tr:nth-of-type(odd) th {
    background: #00bcc5;
  }
}
#recruit .inner table tr th {
  width: 20%;
  padding: 1.5rem 1rem;
  background: #00bcc5;
  font-weight: 500;
  vertical-align: top;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #recruit .inner table tr th {
    width: 100%;
    display: block;
    padding: 1rem 1rem;
  }
}
#recruit .inner table tr td {
  padding: 1.5rem 1rem;
}
@media screen and (max-width: 767px) {
  #recruit .inner table tr td {
    width: 100%;
    display: block;
    padding: 1.5rem 0;
  }
}
#recruit .inner table tr td .row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
#recruit .inner table tr td .row .col {
  width: 48%;
}
#recruit .contact {
  background-image: url(../img/recruit/recruit_contact_bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 4rem 0;
  text-align: center;
  margin-top: 4rem;
}
@media screen and (max-width: 767px) {
  #recruit .contact {
    padding: 2rem 0.5rem;
  }
}
#recruit .contact .box {
  max-width: 1100px;
  margin: auto;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  padding: 3rem 3rem;
}
@media screen and (max-width: 767px) {
  #recruit .contact .box {
    padding: 1.5rem;
    flex-wrap: wrap;
  }
}
#recruit .contact .box .txt {
  width: 65%;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #recruit .contact .box .txt {
    width: 100%;
    margin-bottom: 1rem;
  }
}
#recruit .contact .box .txt span {
  display: block;
  margin-bottom: 0.5rem;
  font-family: "Oswald", sans-serif;
  color: #00bcc5;
  font-size: 2.4rem;
}
@media screen and (max-width: 767px) {
  #recruit .contact .box .txt span {
    font-size: 1.4rem;
    margin-bottom: 0.8rem;
    text-align: center;
  }
}
#recruit .contact .box .btn {
  width: 30%;
}
@media screen and (max-width: 767px) {
  #recruit .contact .box .btn {
    width: 100%;
  }
}
#recruit .contact .box .btn a {
  display: block;
  background-color: #00bcc5;
  color: #fff;
  padding: 1rem;
  text-align: center;
  text-decoration: none;
}

/*---------------------------
contact
----------------------------*/
#contact {
  margin-bottom: 4rem;
}
#contact .inner {
  max-width: 900px;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #contact .inner {
    max-width: 90%;
  }
}
#contact .inner h2 {
  background: #00bcc5;
  padding: 1rem;
  text-align: left;
  margin-bottom: 3rem;
  font-size: 1.4rem;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #contact .inner h2 {
    font-size: 1.2rem;
    text-align: center;
  }
}
#contact .inner .tel {
  margin-bottom: 3rem;
}
#contact .inner .tel span a {
  display: block;
  font-size: 2rem;
  margin-bottom: 1rem;
  text-decoration: none;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  #contact .inner .tel span a {
    pointer-events: auto;
  }
}
#contact .inner .mail > p {
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  #contact .inner .mail > p {
    margin-bottom: 1.5rem;
  }
}
#contact .inner .mail dl > div {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#contact .inner .mail dl > div dt {
  width: 25%;
  padding: 10px 0;
  position: relative;
}
@media screen and (max-width: 640px) {
  #contact .inner .mail dl > div dt {
    /*sp*/
    width: 100%;
  }
}
#contact .inner .mail dl > div dt span {
  display: block;
  position: absolute;
  top: 15px;
  right: 0px;
  background: orange;
  color: #fff;
  padding: 0.3rem 0.7rem;
  font-size: 0.6rem;
  line-height: 0.6rem;
  letter-spacing: 2px;
}
#contact .inner .mail dl > div dd {
  width: 70%;
  padding: 10px 0px;
}
@media screen and (max-width: 640px) {
  #contact .inner .mail dl > div dd {
    /*sp*/
    width: 100%;
  }
}
#contact .inner .mail dl > div dd input[type=text],
#contact .inner .mail dl > div dd input[type=email],
#contact .inner .mail dl > div dd input[type=tel] {
  border: 1px solid #ccc;
  padding: 0.5rem;
  width: 100%;
  box-sizing: border-box;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
#contact .inner .mail dl > div dd textarea {
  padding: 0.5rem;
  width: 100%;
  height: 160px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
#contact .inner .mail dl > div dd .error-text {
  color: red;
}
#contact .inner .mail .btn {
  padding: 2rem 0;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
}
#contact .inner .mail .btn input[type=submit] {
  width: 100%;
  background: #00bcc5;
  padding: 1rem;
  border: none;
  color: #fff;
  font-size: 1.2rem;
  letter-spacing: 5px;
  display: block;
  margin: 0 0.2rem;
  box-sizing: border-box;
}
@media screen and (max-width: 767px) {
  #contact .inner .mail .btn input[type=submit] {
    font-size: 1rem;
  }
}
#contact .inner .mail .btn input[type=submit].check {
  max-width: 40%;
}
@media screen and (max-width: 767px) {
  #contact .inner .mail .btn input[type=submit].check {
    max-width: 100%;
  }
}
#contact .inner .mail .btn input[type=submit].back {
  width: 90%;
  background: #ccc;
  margin-right: 1rem;
}
@media screen and (max-width: 767px) {
  #contact .inner .mail .btn input[type=submit].back {
    width: 100%;
    margin-right: 0;
    margin-bottom: 0.5rem;
  }
}
#contact .inner .mail .btn input[type=submit].finish {
  width: 90%;
}
#contact .inner .mail .btn form {
  width: 40%;
}
@media screen and (max-width: 767px) {
  #contact .inner .mail .btn form {
    width: 50%;
  }
}

.snow-monkey-form {
  max-width: 1100px;
  margin: 0 auto;
}
.snow-monkey-form .smf-form--simple-table {
  display: block;
}
.snow-monkey-form .smf-item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 24px;
  border: none;
}
@media (max-width: 767px) {
  .snow-monkey-form .smf-item {
    flex-direction: column;
  }
}
.snow-monkey-form .smf-item__col--label {
  width: 240px;
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 32px;
  padding-top: 0;
  box-sizing: border-box;
}
@media (max-width: 767px) {
  .snow-monkey-form .smf-item__col--label {
    width: 100%;
    padding-right: 0;
    padding-top: 0;
    margin-bottom: 10px;
    justify-content: flex-start;
    gap: 16px;
  }
}
.snow-monkey-form .smf-item__label__text {
  font-size: 16px;
  color: #333;
}
.snow-monkey-form .smf-item__description {
  background-color: #f39c12;
  color: #fff;
  font-size: 11px;
  font-weight: bold;
  padding: 4px 12px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.snow-monkey-form .smf-item__col--controls {
  flex-grow: 1;
  width: 100%;
}
.snow-monkey-form .smf-text-control__control,
.snow-monkey-form .smf-textarea-control__control {
  width: 100%;
  border: 1px solid #ccc;
  padding: 12px 16px;
  font-size: 16px;
  background-color: #fff;
  border-radius: 0;
  box-sizing: border-box;
  color: #333;
  transition: border-color 0.3s ease;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.snow-monkey-form .smf-text-control__control:focus,
.snow-monkey-form .smf-textarea-control__control:focus {
  outline: none;
  border-color: #00bcd4;
}
.snow-monkey-form .smf-text-control__control::-moz-placeholder, .snow-monkey-form .smf-textarea-control__control::-moz-placeholder {
  color: #999;
}
.snow-monkey-form .smf-text-control__control::placeholder,
.snow-monkey-form .smf-textarea-control__control::placeholder {
  color: #999;
}
.snow-monkey-form .smf-textarea-control__control {
  min-height: 180px;
  resize: vertical;
}
.snow-monkey-form .smf-action {
  text-align: center;
  margin-top: 56px;
}
.snow-monkey-form .smf-action .smf-button-control__control,
.snow-monkey-form .smf-action button,
.snow-monkey-form .smf-action input[type=submit] {
  background-color: #00bcc5 !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
  padding: 18px 80px;
  font-size: 16px;
  font-weight: bold;
  border-radius: 0;
  cursor: pointer;
  transition: opacity 0.3s ease;
  letter-spacing: 0.05em;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
}
.snow-monkey-form .smf-action .smf-button-control__control:hover,
.snow-monkey-form .smf-action button:hover,
.snow-monkey-form .smf-action input[type=submit]:hover {
  opacity: 0.8;
}

/* -------------------------------------
 * Snow Monkey Forms: テキスト切り替え（フォーム外側に配置する場合）
 * ------------------------------------- */
body:has(.snow-monkey-form[data-screen=confirm]) .text-input-only, body:has(.snow-monkey-form[data-screen=complete]) .text-input-only {
  display: none;
}
body:has(.snow-monkey-form[data-screen=input]) .text-confirm-only, body:has(.snow-monkey-form[data-screen=complete]) .text-confirm-only {
  display: none;
}

/*---------------------------
pp
----------------------------*/
#pp .inner {
  text-align: left;
}
@media screen and (max-width: 767px) {
  #pp .inner {
    max-width: 90%;
  }
}
#pp .inner > p {
  margin-bottom: 2rem;
}
#pp .inner .col {
  margin-bottom: 3rem;
}
#pp .inner .col h2 {
  margin-bottom: 1rem;
  font-weight: bold;
}
#pp .inner .col ul {
  list-style-type: decimal;
  margin-left: 1.5rem;
  padding: 1rem 0;
}
#pp .inner .col ul li,
#pp .inner .col ul ol {
  padding-left: 0.5rem;
}
#pp .inner .col ul.s1 {
  margin-left: 3rem;
}
@media screen and (max-width: 767px) {
  #pp .inner .col ul.s1 {
    margin-left: 1.5rem;
  }
}
#pp .inner .col ul.s2 {
  margin-left: 5rem;
}
@media screen and (max-width: 767px) {
  #pp .inner .col ul.s2 {
    margin-left: 3rem;
  }
}