﻿#company article.page {
  padding-top: 10.2rem;
}
#company article.page h1.vertical_head {
  top: 14rem;
}
@media screen and (max-width: 768px) {
  #company article.page {
    padding-top: 5rem;
  }
  #company article.page h1.vertical_head {
    top: 10rem;
  }
}

#company .page_visual .visual {
  margin: 0 auto 0 0;
  width: 155.8rem;
}
@media screen and (max-width: 768px) {
  #company .page_visual .visual {
    height: 18rem;
    -o-object-fit: cover;
    object-fit: cover;
    width: 29.2rem;
  }
}

.common.left_line_head {
  margin-bottom: 8.2rem;
  padding-left: 20rem;
}
@media screen and (max-width: 768px) {
  .common.left_line_head {
    padding-left: 10rem;
    margin-bottom: 5rem;
  }
}
.common.left_line_head .jp {
  position: relative;
}
.common.left_line_head .jp::before {
  content: '';
  position: absolute;
  top: 50%;
  left: -10rem;
  transform: translateY(-50%);
  width: 6rem;
  height: 1px;
  background-color: #333;
}

.common.left_line_head .en {
  margin-top: 2rem;
}

.inner {
  width: 152.2rem;
  margin: 0 auto;
}

#philosophy {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  flex-direction: row-reverse;
  justify-content: space-between;
  margin-top: 10rem;
  padding-right: 33.8rem;
  position: relative;
  background: url(../images/home/greeting_bg.svg) right 13rem bottom 30rem/78rem auto no-repeat;
}
@media screen and (max-width: 768px) {
  #philosophy {
    margin-top: 8rem;
    padding: 0 3rem;
    background-size: 38rem auto;
    background-position: center bottom 30rem;
  }
}
.content_body {
  line-height: 1.9;
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .content_body {
    font-size: 1.556rem;
  }
}
#philosophy .content_body {
  width: 84rem;
  padding-left: 20rem;
}
@media screen and (max-width: 768px) {
  #philosophy .content_body {
    width: calc(100% - 10rem);
    padding-left: 0;
  }
}

.content_body p {
  margin-top: 2rem;
}

.philosophy_img {
  width: 100%;
  margin-top: 190px;
}
@media screen and (max-width: 768px) {
  .philosophy_img {
    margin-top: 90px;
  }
}
.philosophy_img img {
  width: 100%;
  max-width: 646px;
}

#message {
  margin-top: 20rem;
}
@media screen and (max-width: 768px) {
  #message {
    margin-top: 10rem;
  }
}
.message_wrap {
  display: flex;
  flex-direction: row-reverse;
  gap: 10rem;
}
@media screen and (max-width: 768px) {
  .message_wrap {
    flex-direction: unset;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0 3rem;
  }
}
.message_content {
  width: calc(100% - 368px - 10rem);
  padding-right: 20rem;
}
@media screen and (max-width: 768px) {
  .message_content {
    width: 100%;
    padding-right: 0;
    margin-bottom: 5rem;
  }
}
.message_content h3 {
  margin-bottom: 2.867rem;
  line-height: 1.47;
}

.message_photo {
  width: 100%;
  max-width: 368px;
  padding-left: 25rem;
}
@media screen and (max-width: 768px) {
  .message_photo {
    max-width: 100%;
    padding-left: 0;
  }
}
.message_photo span {
  display: block;
  margin-top: 3rem;
  font-family: "Hiragino Mincho ProN","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E",serif;
  font-size: 2.667rem;
}
@media screen and (max-width: 768px) {
  .message_photo span {
    font-size: 2rem;
  }
}

.message_photo .message_photo_inner {
  margin-bottom: 40px;
}

.message_photo .message_photo_inner span {
  display: block;
  margin-top: 3rem;
  font-size: 1.333em;
}
@media screen and (max-width: 768px) {
  .message_photo .message_photo_inner span {
    font-size: 1em;
  }
}

#outline {
  margin-top: 20rem;
}
@media screen and (max-width: 768px) {
  #outline {
    margin-top: 10rem;
    padding: 0 3rem;
  }
}

.dlist_outline {
  width: 100%;
  max-width: 930px;
  margin: 6rem auto 0;
}
@media screen and (max-width: 768px) {
  .dlist_outline {
    max-width: 100%;
    padding: 0;
    margin-top: 5rem;
  }
}
.dlist_outline div {
  display: flex;
  gap: 5rem;
}
@media screen and (max-width: 768px) {
  .dlist_outline div {
    flex-wrap: wrap;
    gap: 1rem;
  }
}
.dlist_outline dt, .dlist_outline dd {
  border-bottom: solid 1px #333;
  padding: 4rem 3rem 3rem 2rem;
  line-height: 1.75;
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .dlist_outline dt, .dlist_outline dd {
    font-size: 1.556rem;
  }
}
.dlist_outline dt {
  width: 258px;
}

.dlist_outline dd {
  width: calc(100% - 258px - 5rem);
  max-width: 632px;
}
@media screen and (max-width: 768px) {
  .dlist_outline dt, .dlist_outline dd {
    width: 100%;
    max-width: 100%;
    padding: 1rem 1rem 1rem 1rem;
  }
  .dlist_outline dd {
    border-bottom: 0;
    padding-bottom: 3rem;
  }
}
.list_outline_content {
  padding-left: 20px;
  list-style: disc;
}

#story {
  margin-top: 20rem;
}
@media screen and (max-width: 768px) {
  #story {
    margin-top: 10rem;
  }
}
.story_wrap {
  display: flex;
  flex-direction: row-reverse;
  gap: 10rem;
}
@media screen and (max-width: 768px) {
  .story_wrap {
    flex-wrap: wrap;
    gap: 6rem;
  }
}
.story_content {
  width: calc(100% - 368px - 10rem);
  padding-right: 20rem;
}
@media screen and (max-width: 768px) {
  .story_content {
    width: 100%;
    padding: 0 3rem;
  }
}
.list_story {
  position: relative;
  margin-top: 6.8rem;
}
.list_story::before {
  content: '';
  position: absolute;
  top: 0;
  left: 17px;
  display: block;
  width: 1px;
  height: 98%;
  background-color: #333;
}
@media screen and (max-width: 768px) {
  .list_story::before {
    height: 95%;
  }
}
.list_story li {
  position: relative;
  z-index: 1;
  display: flex;
  line-height: 1.75;
  font-size: 2rem;
  margin-bottom: 2.667rem;
}
@media screen and (max-width: 768px) {
  .list_story li {
    font-size: 1.556rem;
  }
}
.list_story li div {
  padding-top: 5px;
}
@media screen and (max-width: 768px) {
  .list_story li div {
    padding-top: 0;
  }
}
.list_story li div.year {
  width: 200px;
}
@media screen and (max-width: 1023px) {
  .list_story li div.year {
    width: 140px;
  }
}
@media screen and (max-width: 768px) {
  .list_story li div.year {
    width: 85px;
  }
}
.list_story li div.data {
  width: calc(100% - 200px - 2rem - 34px);
}
@media screen and (max-width: 1023px) {
  .list_story li div.data {
    width: calc(100% - 140px - 2rem - 34px);
  }
}
@media screen and (max-width: 768px) {
  .list_story li div.data {
    width: calc(100% - 80px - 2rem - 34px);
  }
}

.list_story li::before {
  content: '';
  position: relative;
  top: 0;
  left: 0;
  display: inline-block;
  width: 34px;
  height: 34px;
  border: solid 1px #333;
  border-radius: 100%;
  margin-right: 2rem;
  background-color: #fff;
}
@media screen and (max-width: 768px) {
}

.story_content h3 {
  margin-bottom: 2.867rem;
  line-height: 1.47;
}

.story_photo {
  width: 100%;
  max-width: 368px;
  padding-left: 25rem;
}
@media screen and (max-width: 768px) {
  .story_photo {
    max-width: 100%;
    padding: 0 3rem;
  }
}


#access {
  margin-top: 20rem;
}
@media screen and (max-width: 768px) {
  #access {
    margin-top: 10rem;
  }
}
.access_header_img {
  width: 100%;
  margin-bottom: 10rem;
}
.access_header_img img {
  width: 100%;
}

.access_wrap {
  padding: 0 20rem;
  margin-top: 10.667rem;
}
@media screen and (max-width: 768px) {
  .access_wrap {
    padding: 0 3rem;
    margin-top: 5rem;
  }
}
.access_item {
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  gap: 10rem;
  margin-bottom: 10.667rem;
}
@media screen and (max-width: 768px) {
  .access_item {
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 5rem;
  }
}
.access_map {
  width: 50%;
}
@media screen and (max-width: 768px) {
  .access_map {
    width: 100%;
  }
}
.access_map iframe {
  aspect-ratio: 610/428;
  width: 100%;
  height: 100%;
}
.access_info {
  width: calc(100% - 50% - 10rem);
  line-height: 1.9;
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .access_info {
    width: 100%;
    margin-bottom: 3rem;
    font-size: 1.556rem;
  }
}

.access_info a {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #333;
}
.access_info a img {
  width: 20px;
}