@charset "utf-8";

/* ■ 基本パーツ ======================================================================= */
/* セクションラッパー */
main section {
  padding: 52px 0 0;
  /* 基準テキストサイズ */
  font-size: 16px;
  color: #555555;
}

main section a {
  color: #181b39;
}

main section a:link {
  text-decoration: underline;
}

main section a:hover {
  color: #181b39;
  text-decoration: none;
}

/* 中タイトル */
section h2 {
  position: relative;
  margin: 0 0 2.2em;
  font-size: 32px;
  color: #181b39;
  font-weight: 700;
  line-height: 1.0em;
}

/* 中タイトル　ルビ */
section h2:after {
  content: attr(data-text-ruby);
  position: absolute;
  display: block;
  bottom:-2.65em;
  font-size: 14px;
  font-weight: 700;
}

/* 小タイトル */
section h3 {
  font-size: 18px;
  line-height: 1.35em;
  margin: 0 0 0.6em;
  color: #181b39;
  font-weight: 700;
}

/* 小タイトル2 */
section h4.dot_title:before {
  content: "・";
}

/* 段落ベース */
section p {
  line-height: 1.58em;
  margin: 0 0 1.5em 0;
}

/* リード文 */
section p.leadtxt {
  font-size: 24px;
  margin: 0 0 0.55em 0;
  color: #181b39;
  font-weight: 700;
}

/* 外部リンク */
.othersite_link {
  display: inline-block;
  position: relative;
  padding-right: 28px;
}

.othersite_link:before {
  content: "";
  display: block;
  width: 11px;
  height: 8px;
  border: 1px solid #181b39;
  border-top: 3px solid #181b39;
  background-color: #ffffff;
  position: absolute;
  right: 6px;
  top: 2px;
}

.othersite_link:after {
  content: "";
  display: block;
  width: 11px;
  height: 8px;
  border: 1px solid #181b39;
  border-top: 3px solid #181b39;
  background-color: #ffffff;
  position: absolute;
  right: 0;
  top: 7px;
}

/* ドットつきリスト（UL） */
ul.list_dot {
  margin: 0 0 1.5em 1em;
}

ul.list_dot li {
  list-style-type: "・";
}

/* ドットつきリスト（DL） */
dl.list_dot {
  margin: 0 0 1.5em 0;
}

dl.list_dot dd {
  display: list-item;
  list-style-type: "・";
  margin: 0 0 0 1em;
}

/* 数字リスト（OL 0～9対応） */
ol.list_singlenum {
  margin: 0 0 1.5em 1.5em;

}

ol.list_singlenum li {
  list-style-type: decimal;

}

/* 画像:PC時最大50%; */
.img_half{
  width:100%;
  height:auto;
  margin:0.35em 0 0 0;
}

/* PC用 1291px～ */
@media screen and (min-width:1291px) {

  /* セクションラッパー */
  main section {
    font-size: 18px;
    /* 基準テキストサイズ */
  }

  /* 中タイトル */
  section h2 {
    position: relative;
    margin-bottom: 120px;
    font-size: 42px;
    color: #181b39;
    font-weight: 700;
    line-height: 1.0em;
  }

  /* 小タイトル */
  section h3 {
    font-size: 24px;
    line-height: 1.35em;
    margin: 0 0 0.1em;
  }

  /* 段落ベース */
  section p {
    line-height: 1.65em;
    margin: 0 0 1.75em 0;
  }

  /* テキストリンク */
  section p a {
    color: #555555;
  }

  /* リード文 */
  section p.leadtxt {
    font-size: 35px;
    margin: 0 0 2.5em 0;
    color: #181b39;
    font-weight: 700;
  }

  /* コンテンツ主文 */
  .contents_leadttxt {
    margin-bottom: 3.25em;
  }

  /* 外部リンク */
  .othersite_link:before {
    width: 11px;
    height: 8px;
    right: 7px;
    top: 4px;
  }

  .othersite_link:after {
    width: 11px;
    height: 8px;
    right: 0;
    top: 10px;
  }

  /* ドットつきリスト（UL） */
  ul.list_dot {
    margin: 0 0 1.75em 1em;
  }

  /* ドットつきリスト（DL） */
  dl.list_dot {
    margin: 0 0 1.75em 0;
  }

  dl.list_dot dd {
    margin: 0 0 0 1em;
  }

  /* 数字リスト（OL 0～9対応） */
  ol.list_singlenum {
    margin: 0 0 1.75em 1.5em;
  }

  /* 画像:最大50%; */
.img_half{
  width:50%;
  height:auto;
}
}

/* ■ ぱんくずリスト ======================================================================= */
#breadcrumb {
  padding: 45px 0 30px 0;
}

#breadcrumb ul {
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  line-height: 1.75em;
}

#breadcrumb ul li {
  position: relative;
  display: inline-block;
  margin: 0 0 0.5em;
  padding: 0 3.2em 0 0;
  color: #181b39;
  font-weight: 700;
}

#breadcrumb ul li:after {
  content: "";
  display: block;
  width: 1px;
  height: 1em;
  position: absolute;
  right: 1.6em;
  top: 4px;
  bottom: 0;
  background-color: #555555;
}

#breadcrumb ul li:last-child {
  padding: 0;
}

#breadcrumb ul li:last-child:after {
  display: none;
}

#breadcrumb ul li a {
  display: inline-block;
  position: relative;
  color: #555555;
  font-weight: 300;
  text-decoration: none;
}

/* PC用 1291px～ */
@media screen and (min-width:1291px) {
  #breadcrumb {
    padding: 115px 0 63px 0;
  }

  #breadcrumb ul {
    font-size: 11px;
    line-height: 1.75em;
  }
}

/* ■ About Us ======================================================================= */
/* Message */
.ceo_sign {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  font-size: 14px;
}

.ceo_sign img {
  display: inline-block;
  margin: 0 0 0 0.85em;
  width: 168px;
}

/* 会社概要 */
dl.overview_list {
  margin: 0 0 1.5em;
}

dl.overview_list dt {
  width: 5em;
  text-align: justify;
  text-align-last: justify;
}

dl.overview_list dd {
  margin: 0 0 1.6em 0;
}

/* PC用 1291px～ */
@media screen and (min-width:1291px) {

  /* Message */
  .ceo_sign {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    font-size: 18px;
  }

  .ceo_sign img {
    display: inline-block;
    margin: 0 0 0.25em 0.6em;
  }

  /* 会社概要 */
  dl.overview_list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 1.75em;
  }

  dl.overview_list dt {
    width: 5.4em;
    padding: 2px 0;
  }

  dl.overview_list dd {
    width: calc(100% - 5.4em);
    padding: 2px 0 2px 2.25em;
    margin: 0;
  }
}

/* ■ Business ======================================================================= */
/* PC用 特殊テキスト 1601px～ */
@media screen and (min-width:1601px) {
  #business_reason p span {
    display: block;
  }
}

/* ■ Sustainability ======================================================================= */

/* PC用 1291px～ */
/* 画像:最大50%; */
.img_half.propulsion_organization{
  max-width:450px;
  margin-bottom:0.5em;

}
.img_half.sdgs_logo{
  max-width:450px;
  margin-bottom:0.5em;

}
.img_half.crsp_logo{
  max-width:450px;
  margin-bottom:0.5em;

}
/* ■ Terms of Use ======================================================================= */


/* ■ News ======================================================================= */
.newslist {
  width: 100%;
}

.newslist li {
  margin-bottom: 46px;
}

.newslist li a {
  display: block;
  width: 100%;
  text-decoration: none !important;
}

.newslist li a img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 5px;
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
}

.newslist li h3 {
  margin: 0;
  line-height: 1.4em;
  font-weight: 700;
}

.newslist li span {
  display: block;
  width: 100%;
}

/* PC用 1601px～ */
@media screen and (min-width:1601px) {
  .newslist {
    display: flex;
    flex-wrap: wrap;
  }

  .newslist li {
    width: 48%;
    margin: 0 4% 1.75em 0;
    display: flex;
    flex-direction: column;
  }

  .newslist li:nth-child(2n) {
    margin: 0 0 1.75em 0;
  }

  .newslist li h3 {
    font-weight: 700;
  }
}

/* PC用 1934px～ */
@media screen and (min-width:1939px) {
  .newslist li {
    width: 30.96%;
    margin: 0 3.56% 1.75em 0;
    display: flex;
  }

  .newslist li:nth-child(2n) {
    margin: 0 3.56% 1.75em 0;
  }

  .newslist li:nth-child(3n) {
    margin: 0 0 1.75em 0;
  }

  .newslist li a {
    display: flex;
    flex-wrap: wrap;
  }
}

/* ■ contact ======================================================================= */
input[type=text],
input[type=email],
input[type=tel] {
  width: 100%;
  padding: 7px;
  background: none;
  border: 1px solid #707070;
  border-radius: 8px;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-family: inherit;
  font-size: inherit;
  line-height: 2em;
}

input[type=button],
input[type=submit],
button {
  width: 100%;
  padding: 14px;
  border-radius: 8px;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-family: inherit;
  font-size: inherit;
  line-height: 2em;
  background-color: #99a8c5;
  color: rgba(255, 255, 255, 0.4);
}

input[type=checkbox] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  width: 20px;
  height: 20px;
  border: 1px solid #707070;
  border-radius: 5px;
  background-color: rgba(255, 255, 255, 1);
  transition: background-color .2s;
}

input[type=checkbox]:checked {
  width: 20px;
  height: 20px;
  border: 1px solid #181b39;
  border-radius: 5px;
  background-color: rgba(24, 27, 57, 1);
  transition: background-color .2s;
}

input[type=checkbox]:before {
  content: "";
  display: block;
  position: absolute;
  width: 14px;
  height: 6px;
  left: 0;
  right: 0;
  top: 0;
  bottom: 4px;
  margin: auto;
  transform: rotate(-45deg);
  border-bottom: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  opacity: 0;
  transition: opacity .2s;
}

input[type=checkbox]:checked:before {
  opacity: 1;
  transition: opacity .2s;
}

textarea {
  width: 100%;
  height: 10em;
  padding: 7px;
  border: 1px solid #707070;
  border-radius: 8px;
  line-height: 1.5em;
}

#contact_contact {
  display: flex;
  flex-direction: column;
}

#contact_image img {
  width: 100%;
  margin: 0 0 50px;
  border-radius: 8px;
  overflow: hidden;
}

#contact_form {
  position: relative;
}

#contact_form form {
  display: flex;
  flex-direction: column;
}

.contact_type-1,
.contact_type-2,
.contact_type-3,
.contact_type-4,
.contact_type-5,
.contact_type-6,
.contact_type-7 {
  display: block;
  margin: 0 0 2.4em 0;
}

#contact_form form h3 {
  position: relative;
  margin-bottom: 0.6em;
  font-size: 16px;
}

#contact_form form h3.contact_hissu:after {
  content: "必須";
  display: inline-block;
  width: 3em;
  margin-left: 0.5em;
  border-radius: 5px;
  background-color: #181b39;
  font-size: 14px;
  color: #ffffff;
  font-weight: 300;
  letter-spacing: 0.1em;
  text-align: center;
}

.contact_namearea {
  display: flex;
  justify-content: space-between;
}

.contact_namearea li {
  width: calc((100% - 20px) / 2);
}

.contact_data {
  order: 1;
}

.contact_type {
  order: 0;
}

.mwform-checkbox-field {
  display: block;
  margin-bottom:0.5em;
}

.mwform-checkbox-field label {
  display: flex;
  align-items: center;
  width: 100%;
}

.mwform-checkbox-field-text {
  display: block;
  width: calc(100% - 20px);
  padding: 0 0 0 10px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3em;
  color: #181b39;
}

.chkbox_text {
  margin: 0;
  padding: 0.175em 0 1em 30px;
  line-height: 1.5em;
}

.contact_sendarea {
  order: 2;
  padding: 56px 0 0 0;
}

.contact_type-0 {
  display: flex;
  align-items: center;
  width: 100%;
  position: absolute;
  bottom: 94px;
}

.contact_data span.error {
  font-size: 14px;
  color: #ff0000;
}

input[type=submit].send_unlocked {
  background-color: #181b39;
  color: rgba(255, 255, 255, 1);
  cursor: pointer;
}

input[type=submit].send_unlocked:hover {
  color: #99a8c5;
}

/* PC用 1758px～ */
@media screen and (min-width:1758px) {

  input[type=text],
  input[type=email],
  input[type=tel] {
    padding: 11px;
  }

  #contact_contact {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
  }

  .contact_type-1,
  .contact_type-2,
  .contact_type-3,
  .contact_type-4,
  .contact_type-5,
  .contact_type-6,
  .contact_type-7 {
    display: block;
    margin: 0 0 1.5em 0;
  }

  #contact_contact h2 {
    width: 100%;
  }

  #contact_image {
    width: 46.9%;
  }

  #contact_image p {
    margin-bottom: 5.1em;
  }

  #contact_form {
    width: 48%;
  }

  #contact_form form h3 {
    font-size: 18px;
    margin-bottom: 0.5em;
  }

  #contact_form form h3.contact_hissu:after {
    width: 3em;
    margin-left: 0.5em;
    padding-top: 1px;
    border-radius: 5px;
    position: relative;
    top: -2px;
    font-size: 14px;
    line-height: 1.7em;
  }

  .contact_namearea li {
    width: calc((100% - 10px) / 2);
  }

  .mwform-checkbox-field-text {
    font-size: 18px;
  }

  .contact_type-0 {
    bottom: 84px;
  }
}

/* ■ 404 ======================================================================= */
.backtoppage {
  margin: 180px 0 150px 0;
  margin: 180px 0 0px 0;
  text-align: center;
}

.backtoppage a {
  display: inline-block;
  padding: 19px 92px;
  background-color: #181b39;
  border-radius: 5px;
  overflow: hidden;
  font-size: 14px;
  color: #ffffff;
  text-decoration: none !important;
  transition: color .2s linear;
}

.backtoppage a:hover {
  color: #99a8c5;
}

/* ■ ブレイクポイント ======================================================================= */
/* TAB用744px～ */
@media screen and (min-width:744px) {}

/* PC用 1291px～ */
@media screen and (min-width:1291px) {}

/* PC用 1934px～ */
@media screen and (min-width:1939px) {}