@charset "utf-8";
/**
 * @package    WCF
 * @version    6.1

 * @subpackage wcl.class
 * OUTLINE:	トップページのスタイルを適用するスタイルシート
 */
/************************************************************************************************************************************
 TOP
 ************************************************************************************************************************************/
/*mv*/
.mv {
  width: 100%;
  max-width: 1920px;
  height: 881px;
  margin: 0 auto;
  background-image: url("../img/top/top_bg01.jpg");
  background-position: center top;
  position: relative;
}
.mv .catchcopy {
  padding-left: 170px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.mv .catchcopy h1 {
  position: absolute;
  top: 0;
  left: 0;
}
.mv .catchcopy p {
  font-size: 46px;
  color: rgb(255, 255, 255);
  text-shadow: 0px 0px 4px #1eacef;
  font-weight: bold;
  letter-spacing: .4em;
  line-height: 1.5;
  white-space: nowrap;
  text-align: left;
  display: inline-block;
}
@media screen and (max-width: 760px) {
  .mv {
    height: auto;
    margin-bottom: 50px;
    padding: 100px 0;
    background-image: url("../img/top/top_mv_sp.jpg");
    -webkit-background-size: cover;
    background-size: cover;
    text-align: center;
  }
  .mv .catchcopy {
    padding-left: 60px;
    position: relative;
    top: auto;
    left: auto;
    display: inline-block;
    transform: none;
  }
  .mv .catchcopy h1 {
    width: 40px;
  }
  .mv .catchcopy p {
    font-size: 22px;
    text-align: left;
  }
}
/*news*/
.top_news {
  width: 100%;
  max-width: 1920px;
  height: 265px;
  margin: 0 auto;
  background-image: url("../img/top/top_bg02.jpg");
  background-position: center top;
}
.top_news .inner_box {
  max-width: 1120px;
}
.top_news .news_box {
  width: 884px;
  height: 50px;
  margin: 0 0 0 auto;
  padding: 42px 50px;
  display: flex;
  align-items: flex-end;
  background-color: #ffffff;
}
.top_news .news_box ul {
  width: calc(100% - 220px);
  margin-right: 20px;
  font-size: 14px;
}
.top_news .news_box ul li {
  padding-bottom: 15px;
  padding-left: 100px;
  border-bottom: solid 1px #cccccc;
}
.top_news .news_box ul li .date {
  width: 100px;
  margin-left: -100px;
  display: inline-block;
}
.top_news .news_box .btn {
  width: 200px;
}
@media screen and (max-width: 760px) {
  .top_news {
    height: auto;
    background: none;
  }
  .top_news .news_box {
    width: 100%;
    height: auto;
    margin: 0 0 50px 0;
    padding: 0;
    display: block;
  }
  .top_news .news_box ul {
    width: 100%;
    margin: 0 0 20px 0;
  }
  .top_news .news_box ul li {
    margin-bottom: 10px;
    padding-bottom: 10px;
    padding-left: 0;
  }
  .top_news .news_box ul li .date {
    width: auto;
    margin-left: 0;
    display: block;
  }
  .top_news .news_box .btn {
    width: 200px;
    margin: 0 auto;
  }
}
/*company*/
.top_company {
  width: 100%;
  max-width: 1920px;
  height: 665px;
  margin: 0 auto;
  padding: 1px 0;
  background-image: url("../img/top/top_bg03.jpg");
  background-position: center top;
}
.top_company .inner_box {
  max-width: 1440px;
  height: 665px;
  background-image: url("../img/top/top_company_bg.png");
  -webkit-background-size: contain;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative;
}
.top_company .box {
  width: 500px;
  height: 220px;
  padding: 80px 50px;
  text-align: center;
  color: #ffffff;
  background-color: rgba(1, 45, 134, 0.9);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.top_company .box h2 {
  margin-bottom: 20px;
  letter-spacing: 0.3em;
}
.top_company .box p {
  margin-bottom: 25px;
  letter-spacing: 0.3em;
}
.top_company .box p img {
  display: none;
}
.top_company .box .btn li {
  width: 200px;
  height: 50px;
  margin: 0 5px;
  display: inline-block;
}
.top_company .box .btn li a {
  width: 100%;
  height: 100%;
  line-height: 50px;
  background-image: url("../img/top/top_company_btn.png");
  -webkit-background-size: cover;
  background-size: cover;
  color: #ffffff;
  display: block;
}
@media screen and (max-width: 760px) {
  .top_company {
    height: auto;
    margin-bottom: 50px;
    background: none;
  }
  .top_company .inner_box {
    height: auto;
    background: none;
  }
  .top_company .box {
    width: calc(90% - 1em);
    height: auto;
    margin: 0 auto;
    padding: 1em;
    position: static;
    transform: none;
  }
  .top_company .box p {
    font-size: 14px;
    letter-spacing: normal;
  }
  .top_company .box p img {
    width: 100%;
    margin-bottom: 1em;
    display: block;
  }
  .top_company .box .btn li {
    margin: 0 auto 10px auto;
    display: block;
  }
}
/*access*/
.top_access {
  width: 100%;
  max-width: 1920px;
  height: 847px;
  margin: 0 auto;
  background-image: url("../img/top/top_bg04.jpg");
  background-position: center top;
}
.top_access .inner_box {
  max-width: 1600px;
  padding-top: 110px;
}
.top_access h2 {
  margin-bottom: 40px;
  font-size: 24px;
  letter-spacing: 0.4em;
  text-align: center;
}
.top_access h2 img {
  margin: 0 auto 10px auto;
  display: block;
}
.top_access .map {
  margin-bottom: 40px;
}
.top_access .map:after {
  content: '';
  display: block;
  clear: both;
}
.top_access .map li {
  width: 50%;
  height: 400px;
  float: left;
}
.top_access .map li iframe {
  width: 100%;
  height: 100%;
  border: none;
}
.top_access .btn {
  text-align: center;
}
@media screen and (max-width: 760px) {
  .top_access {
    height: auto;
    margin-bottom: 50px;
    background: none;
  }
  .top_access .inner_box {
    padding-top: 0;
  }
  .top_access .map li {
    width: 100%;
    height: 250px;
    float: none;
  }
}
/*business*/
.top_business {
  width: 100%;
  max-width: 1920px;
  height: 500px;
  margin: 0 auto;
  background-image: url("../img/top/top_bg05.jpg");
  background-position: center top;
}
.top_business .inner_box {
  max-width: 1120px;
  padding-top: 145px;
}
.top_business .box {
  width: 410px;
  height: 203px;
  margin: 0 20px 0 auto;
  padding: 30px;
  border: solid 2px #ffffff;
}
.top_business .box h2 {
  margin: -45px 0 30px 0;
  font-size: 24px;
  letter-spacing: 0.2em;
  text-align: center;
}
.top_business .box h2 img {
  margin: 0 auto 10px auto;
  display: block;
}
.top_business .box p {
  margin-bottom: 30px;
  letter-spacing: 0.1em;
  text-align: center;
}
.top_business .box p img {
  display: none;
}
.top_business .box .btn {
  text-align: center;
}
@media screen and (max-width: 760px) {
  .top_business {
    height: auto;
    margin-bottom: 50px;
    background: none;
  }
  .top_business .inner_box {
    padding-top: 0;
  }
  .top_business .box {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    border: none;
  }
  .top_business .box h2 {
    margin-top: 0;
  }
  .top_business .box p {
    letter-spacing: normal;
  }
  .top_business .box p img {
    width: 90%;
    margin: 0 auto 1em auto;
    display: block;
  }
}
/*contact*/
.top_contact {
  padding: 80px 0;
}
.top_contact .inner_box {
  max-width: 1120px;
  display: flex;
}
.top_contact .text {
  width: 50%;
  text-align: center;
}
.top_contact .text h2 {
  margin-bottom: 30px;
  font-size: 24px;
  letter-spacing: 0.2em;
  text-align: center;
}
.top_contact .text h2 img {
  margin: 0 auto 10px auto;
  display: block;
}
.top_contact .link {
  width: 50%;
  text-align: center;
}
.top_contact .link li + li {
  margin-top: 30px;
}
@media screen and (max-width: 760px) {
  .top_contact {
    margin-bottom: 50px;
    padding: 0;
  }
  .top_contact .inner_box {
    display: block;
  }
  .top_contact .text, .top_contact .link {
    width: 100%;
  }
  .top_contact .text {
    margin-bottom: 40px;
  }
}