@charset "UTF-8";
/*********************************************
 * 
 * GENERAL STYLING
 *
**********************************************/
html,
body {
  overflow-x: hidden;
}

html {
  font-size: 100%;
}

body {
  position: relative;
  font-family: "メイリオ", Meiryo, YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  color: #001D42;
  line-height: 1.75;
}

img {
  max-width: 100%;
  height: auto;
}

/*********************************************
 * 
 * COMMON
 *
**********************************************/
/* Heading */
.siteTtl {
  width: 200px;
}
@media (max-width: 680px) {
  .siteTtl {
    width: 120px;
  }
}

.sectionTtl {
  font-size: 2.375rem;
  font-weight: bold;
  color: #154577;
  text-align: center;
  padding-bottom: 120px;
}
@media (max-width: 680px) {
  .sectionTtl {
    font-size: 1.625rem;
    padding-bottom: 64px;
  }
}

.contentTtl {
  font-size: 1.75rem;
  font-weight: bold;
  color: #154577;
  text-align: center;
}
@media (max-width: 680px) {
  .contentTtl {
    font-size: 1.375rem;
  }
}

/*********************************************
 * 
 * header
 *
**********************************************/
.header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background-color: #154577;
}
@media (max-width: 680px) {
  .header {
    padding: 8px;
  }
}
.header_navList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.25rem;
  font-weight: bold;
  color: white;
}
.header_navList a {
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}
.header_navList a:first-of-type {
  margin-right: 32px;
}
@media (max-width: 680px) {
  .header_navList {
    display: none;
  }
}

@media (any-hover: hover) {
  .header_navList a:hover {
    color: #CCCCCC;
  }
}
.header.top {
  background-color: transparent;
}

/*********************************************
 * 
 * nav
 *
**********************************************/
.mainNav {
  margin: 0 auto 160px;
  width: 700px;
  padding-top: 176px;
}
@media (max-width: 680px) {
  .mainNav {
    display: none;
  }
}
.mainNav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.mainNav a {
  display: inline-block;
  position: relative;
}
.mainNav a::after {
  position: absolute;
  left: 0;
  bottom: -8px;
  content: "";
  width: 0;
  height: 5px;
  display: block;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  background-color: #154577;
}
@media (any-hover: hover) {
  .mainNav a:hover::after {
    width: 100%;
  }
}
.mainNav img {
  width: 45px;
  height: 45px;
  display: block;
  margin: 0 auto 8px;
}
.mainNav p {
  font-size: 1.25rem;
  font-weight: bold;
  color: #154577;
  text-align: center;
}

.mainNav.top {
  padding-top: 0;
}

/*********************************************
 * 
 * hamburgerMenu
 *
**********************************************/
.hamburger {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10;
}
@media (max-width: 680px) {
  .hamburger {
    display: block;
  }
}
.hamburger_btn {
  position: fixed;
  top: 0;
  right: 0;
  width: 52px;
  height: 52px;
  background-color: #154577;
  z-index: 30;
  cursor: pointer;
}
.hamburger_btn span {
  position: absolute;
  width: 32px;
  height: 2px;
  background-color: #ffffff;
  -webkit-transition: all 400ms;
  transition: all 400ms;
  -webkit-transform: translateX(10px) translateY(25px);
          transform: translateX(10px) translateY(25px);
}
.hamburger_btn span:nth-child(1) {
  -webkit-transform: translateX(10px) translateY(15px);
          transform: translateX(10px) translateY(15px);
}
.hamburger_btn span:nth-child(3) {
  -webkit-transform: translateX(10px) translateY(35px);
          transform: translateX(10px) translateY(35px);
}
.hamburger_btn.open span:nth-of-type(1) {
  -webkit-transform: translateX(10px) translateY(25px) rotate(-35deg);
          transform: translateX(10px) translateY(25px) rotate(-35deg);
}
.hamburger_btn.open span:nth-of-type(2) {
  visibility: hidden;
  -webkit-transition: all 0.1s;
  transition: all 0.1s;
}
.hamburger_btn.open span:nth-of-type(3) {
  -webkit-transform: translateX(10px) translateY(25px) rotate(35deg);
          transform: translateX(10px) translateY(25px) rotate(35deg);
}
.hamburger_menu {
  position: fixed;
  top: 0;
  right: -120%;
  width: 100vw;
  height: 100vh;
  background-color: rgba(85, 87, 108, 0.85);
  -webkit-transition: all 400ms ease-out;
  transition: all 400ms ease-out;
  overflow: auto;
  z-index: 20;
  padding: 84px 32px 32px;
  text-align: right;
}
.hamburger_menu li {
  border-bottom: #ffffff solid 1px;
}
.hamburger_menu li:nth-child(1) {
  border-top: #ffffff solid 1px;
}
.hamburger_menu li a {
  display: inline-block;
  font-size: 1.25rem;
  color: #ffffff;
  padding: 32px;
  width: 100%;
}
.hamburger_menu.open {
  right: 0;
}

/*********************************************
 * 
 * goTop
 *
**********************************************/
.goTop {
  position: fixed;
  z-index: 10;
  right: 16px;
  bottom: 16px;
}
.goTop a {
  display: block;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  padding-top: 9px;
  background-color: white;
  border: 2px solid #154577;
  text-align: center;
  font-weight: bold;
  line-height: 1;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.goTop a:focus-visible {
  background-color: #CCCCCC;
}
.goTop_arrow {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0 10px;
  border-top: 2px solid #154577;
  border-left: 2px solid #154577;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  position: relative;
}
.goTop_arrow:last-of-type {
  top: -12px;
}
.goTop_text {
  color: #154577;
  position: relative;
  top: -23px;
  font-size: 0.75rem;
}

@media (any-hover: hover) {
  .goTop a:hover {
    background-color: #CCCCCC;
  }
}
@media (hover: none) {
  .goTop a:active {
    background-color: #55576C;
  }
}
/*********************************************
 * 
 * main
 *
**********************************************/
main {
  max-width: 960px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}
@media (max-width: 680px) {
  main {
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 160px;
  }
  main.top {
    padding-top: 0;
  }
}

/*********************************************
 * 
 * footer
 *
**********************************************/
.footer {
  margin-top: 200px;
  background-color: #154577;
  padding: 32px;
  color: white;
  /* アドレス */
}
@media (max-width: 680px) {
  .footer {
    padding: 16px;
    margin: 120px auto 0;
    text-align: center;
  }
}
.footer_container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 680px) {
  .footer_container {
    display: block;
  }
}
.footer_addArea > li:first-child {
  font-size: 1.25rem;
}
.footer_logo {
  width: 230px;
  padding-bottom: 16px;
}
.footer_link img {
  width: 180px;
  margin-top: 16px;
}

/* コピーライト */
.copyArea {
  margin-top: 16px;
  text-align: center;
}

/*********************************************
 * 
 * MAIN VISUAL
 *
**********************************************/
.MV {
  position: relative;
  width: 100vw;
  height: 80vh;
  margin-bottom: 64px;
}
@media (max-width: 680px) {
  .MV {
    height: 60vh;
  }
}
.MV div {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: 0;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-animation-name: MV_slide;
          animation-name: MV_slide;
  -webkit-animation-duration: 24s;
          animation-duration: 24s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
.MV div:first-of-type {
  background-image: url(../img/MV/mv1.jpg);
}
.MV div:nth-of-type(2) {
  background-image: url(../img/MV/mv2.jpg);
  -webkit-animation-delay: 8s;
          animation-delay: 8s;
}
.MV div:last-of-type {
  background-image: url(../img/MV/mv3.jpg);
  -webkit-animation-delay: 16s;
          animation-delay: 16s;
}
@-webkit-keyframes MV_slide {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  38% {
    opacity: 1;
  }
  48% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes MV_slide {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  38% {
    opacity: 1;
  }
  48% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.MV::after {
  content: "";
  display: block;
  width: 100vw;
  height: 98px;
  background-image: url(../img/MV/MVbottom.svg);
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  bottom: -1px;
  left: -1px;
  right: -1px;
  margin: auto;
  background-position: bottom;
}
.MV p {
  position: absolute;
  width: 100%;
  text-align: center;
  padding-top: 200px;
  font-size: 1.875rem;
  line-height: 2;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
}
@media (max-width: 680px) {
  .MV p {
    font-size: 1.125rem;
  }
}

/*********************************************
 * 
 * BUKKEN INFO
 *
**********************************************/
.label {
  display: inline-block;
  padding: 0 6px;
  background-color: #FFD700;
  font-size: 0.9rem;
}

.bukken {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.bukken_box {
  width: calc(50% - 16px);
  border: 1px #154577 solid;
  padding: 16px;
  margin-bottom: 32px;
}
@media (max-width: 680px) {
  .bukken_box {
    width: 100%;
  }
}
.bukken_box a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.bukken_text {
  width: calc(50% - 8px);
}
.bukken_text p {
  margin-bottom: 8px;
}
.bukken_text p:nth-of-type(2) {
  font-weight: bold;
}
.bukken_text p:nth-of-type(5) {
  font-weight: bold;
  color: red;
}
.bukken_img {
  width: calc(50% - 8px);
}

/*********************************************
 * 
 * BUKKEN DATA
 *
**********************************************/
.bukkenData > .contentTtl {
  text-align: left;
}
.bukkenData_container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  margin-top: 32px;
  margin-bottom: 32px;
}
.bukkenData dl {
  display: grid;
  grid-template-columns: 1fr 2fr;
}
.bukkenData dl:nth-of-type(1) {
  border-top: 1px solid #55576C;
}
.bukkenData dl:nth-of-type(2) {
  border-top: 1px solid #55576C;
}
@media (max-width: 680px) {
  .bukkenData dl:nth-of-type(2) {
    border-top: none;
  }
}
.bukkenData dt,
.bukkenData dd {
  padding: 16px;
  border-bottom: 1px solid #55576C;
}
.bukkenData dt {
  background: #eee;
}
.bukkenData_img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.bukkenData_img img {
  width: calc(50% - 16px);
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  margin-bottom: 32px;
}
@media (max-width: 680px) {
  .bukkenData_img img {
    width: 100%;
  }
}

/*********************************************
 * 
 * const
 *
**********************************************/
.const {
  text-align: center;
  font-size: 1.25rem;
  padding-bottom: 18%;
}
@media (max-width: 680px) {
  .const {
    padding: 30% 0;
  }
}

/*********************************************
 * 
 * company
 *
**********************************************/
.greeting {
  max-width: 822px;
  margin: 0 auto 200px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media (max-width: 680px) {
  .greeting {
    display: block;
    margin-bottom: 120px;
  }
}
.greeting_txt {
  width: calc(60% - 16px);
  font-family: "Noto Serif JP", serif;
}
@media (max-width: 680px) {
  .greeting_txt {
    width: 100%;
  }
}
.greeting_txt p {
  margin-bottom: 32px;
}
@media (max-width: 680px) {
  .greeting_txt p {
    margin-bottom: 16px;
  }
}
.greeting_txt p:nth-of-type(1) {
  margin-top: 32px;
}
@media (max-width: 680px) {
  .greeting_txt p:nth-of-type(1) {
    margin-top: 16px;
  }
}
.greeting_txt p:nth-of-type(4) {
  text-align: right;
  font-family: "Yuji Mai", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.25rem;
}
.greeting_img {
  width: calc(40% - 16px);
}
@media (max-width: 680px) {
  .greeting_img {
    width: 60%;
    height: auto;
    margin: 0 auto;
  }
}

.profile {
  max-width: 640px;
  margin: 0 auto 200px;
}
@media (max-width: 680px) {
  .profile {
    margin-bottom: 120px;
  }
}
.profile_container {
  padding-top: 64px;
}
@media (max-width: 680px) {
  .profile_container {
    padding-top: 16px;
  }
}
.profile dl {
  display: grid;
  grid-template-columns: 140px auto;
  border-bottom: 1px solid #55576C;
}
.profile dl:nth-of-type(1) {
  border-top: 1px solid #55576C;
}
.profile dt {
  text-align: right;
}
.profile dt,
.profile dd {
  padding: 16px;
}

.access {
  background-color: rgba(21, 69, 119, 0.18);
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
  padding-top: 64px;
  padding-bottom: 64px;
}
.access_container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  padding-top: 64px;
}
@media (max-width: 680px) {
  .access_container {
    padding-top: 16px;
  }
}
@media (max-width: 680px) {
  .access_container {
    display: block;
  }
}
@media (max-width: 680px) {
  .access_container .address {
    text-align: center;
  }
}
.access_container .address li {
  padding-bottom: 16px;
}
.access_container .address img {
  max-width: 300px;
}
.access_container .map {
  position: relative;
  width: 100%;
  padding-top: 80%;
  height: 0;
  margin-right: 32px;
}
.access_container .map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.access_btn {
  padding-top: 32px;
  text-align: center;
}
.access_btn a {
  display: inline-block;
  padding: 16px;
  background-color: #154577;
  color: white;
  font-weight: bold;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.access_btn a:focus-visible {
  background-color: #CCCCCC;
}

@media (any-hover: hover) {
  .access_btn a:hover {
    background-color: #55576C;
  }
}
/*********************************************
 * 
 * Business
 *
**********************************************/
.businessContents {
  margin-bottom: 200px;
}
@media (max-width: 680px) {
  .businessContents {
    margin-bottom: 120px;
  }
}
.businessContents_container {
  padding-top: 64px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 680px) {
  .businessContents_container {
    padding-top: 16px;
    display: block;
  }
}
.businessContents_box {
  width: calc(50% - 16px);
  background-color: rgba(21, 69, 119, 0.1);
  border: 3px solid #154577;
  border-radius: 10px;
  padding: 32px;
}
@media (max-width: 680px) {
  .businessContents_box {
    width: 100%;
  }
  .businessContents_box:nth-child(1) {
    margin-bottom: 32px;
  }
}
.businessContents_box p {
  margin-bottom: 16px;
}
.businessContents_box p span {
  font-weight: bold;
}
.businessContents_box img {
  margin: 0 auto;
  display: block;
  padding-bottom: 32px;
}
@media (max-width: 680px) {
  .businessContents_box img {
    width: 130px;
  }
}

.work {
  margin-bottom: 200px;
}
@media (max-width: 680px) {
  .work {
    margin-bottom: 120px;
  }
}
.work_container {
  height: 700px;
  max-width: 540px;
  overflow-y: scroll;
  overflow-x: auto;
  display: block;
  border: 3px solid #154577;
  margin: 32px auto 0;
}
@media (max-width: 680px) {
  .work_container {
    margin-top: 16px;
    height: 500px;
  }
}
.work_container table {
  border-collapse: collapse;
  width: 100%;
}
.work_container tr:nth-of-type(even) {
  background-color: rgba(21, 69, 119, 0.1);
}
.work_container th {
  text-align: center;
  position: sticky;
  top: 0;
  right: 0;
  left: 0;
  background-color: #154577;
  color: white;
  font-weight: bold;
}
.work_container th,
.work_container td {
  padding: 8px 16px;
  white-space: nowrap;
}
.work_container tr > td:nth-child(4) {
  text-align: right;
}

.RCP_container {
  display: grid;
  gap: 32px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  margin-top: 32px;
}
@media (max-width: 680px) {
  .RCP_container {
    margin-top: 16px;
  }
}

.RCP_box {
  background-color: #EDEEF0;
  padding: 16px;
}
.RCP_box > h4 {
  font-size: 1.25rem;
  font-weight: bold;
  color: #154577;
  text-align: left;
}
.RCP_box > h4 span {
  font-size: 2.75rem;
  font-weight: bold;
  padding-right: 8px;
}
.RCP_box p {
  padding-bottom: 16px;
}
.RCP_box p .fa-square-check {
  padding-right: 6px;
  font-weight: bold;
  color: skyblue;
  font-size: 1.2rem;
}

.RCP_img {
  text-align: center;
  padding-bottom: 16px;
}

/*********************************************
 * 
 * contactLink　お問い合わせリンク
 *
**********************************************/
.contactLink {
  margin-top: 136px;
  text-align: center;
  padding: 32px;
  background-color: #FBDF53;
  letter-spacing: 0.1rem;
}
.contactLink_tel {
  display: block;
  font-size: 1.5rem;
  color: #55576C;
  font-weight: bold;
}
.contactLink_btn {
  margin-top: 16px;
  display: inline-block;
  padding: 8px 16px;
  background-color: #154577;
  font-size: 1.5rem;
  color: white;
  font-weight: bold;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.contactLink_btn:focus-visible {
  background-color: #55576C;
}
.contactLink p {
  font-weight: bold;
  margin-top: 16px;
  font-size: 1.5rem;
  color: #55576C;
}

@media (any-hover: hover) {
  .contactLink_btn:hover {
    background-color: #55576C;
  }
}
@media (max-width: 680px) {
  .contactLink_tel {
    font-size: 1.25rem;
  }
  .contactLink_btn {
    font-size: 1.125rem;
  }
  .contactLink > p {
    font-size: 1.125rem;
  }
}
/*********************************************
 * 
 * contact
 *
**********************************************/
.contact {
  max-width: 600px;
  margin: 0 auto 200px;
}
.contact_item {
  margin-bottom: 32px;
}
.contact_item label {
  display: inline-block;
  margin-bottom: 3px;
}
.contact_item span {
  margin-left: 8px;
  padding: 0 3px;
  background-color: #154577;
  font-size: 0.875rem;
  color: white;
}
.contact_item input[type=text],
.contact_item input[type=tel],
.contact_item input[type=email],
.contact_item textarea {
  width: 100%;
  padding: 12px;
  background-color: #EDEEF0;
}
.contact_btn {
  text-align: center;
}
.contact_btn p {
  padding: 32px 0;
}
.contact_btn p a {
  font-weight: bold;
  display: inline-block;
}
.contact_btn input[type=submit] {
  display: inline-block;
  padding: 12px 20px;
  background-color: #154577;
  color: white;
  font-weight: bold;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.contact_btn input[type=submit]:focus-visible {
  background-color: #CCCCCC;
}

@media (any-hover: hover) {
  .contact_btn input:hover {
    background-color: #55576C;
  }
  .contact_btn a:hover {
    background: #CCCCCC;
  }
}
/*********************************************
 * 
 * policy
 *
**********************************************/
.policy {
  max-width: 680px;
  margin: 0 auto;
}
.policy h3 {
  padding-top: 32px;
}
.policy .address {
  margin: 64px 0;
}

/*********************************************
 * 
 * thanks
 *
**********************************************/
.thanks {
  height: 40vh;
  text-align: center;
  font-size: 1.25rem;
}
.thanks p {
  margin-bottom: 32px;
}
.thanks a {
  padding: 8px 16px;
  background-color: #154577;
  color: #ffffff;
}
@media (max-width: 680px) {
  .thanks {
    height: 60vh;
    padding-top: 30%;
  }
}/*# sourceMappingURL=style.css.map */