@charset "UTF-8";
@media screen and (min-width: 769px) {
  header .logo a.logo_black {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  header .logo a.logo_black {
    display: none;
  }
  header.scroll .logo a.logo_white {
    display: none;
  }
  header.scroll .logo a.logo_black {
    display: block;
  }
}

h2.ttl_lead {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
}
h2.ttl_lead .en {
  font-size: min(72 / 1320 * 100vw, 72px);
  color: #fff;
  letter-spacing: 0.06em;
}
h2.ttl_lead .jp {
  font-size: min(32 / 1320 * 100vw, 32px);
  font-family: "ZenKakuGothicNew-Bold", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 700;
  position: absolute;
  bottom: 12px;
}
@media screen and (max-width: 768px) {
  h2.ttl_lead .en {
    font-size: min(46 / 375 * 100vw, 46px);
  }
  h2.ttl_lead .jp {
    font-size: min(28 / 375 * 100vw, 28px);
    bottom: 0.4em;
  }
}

.company_nav {
  margin-top: min(120 / 1320 * 100vw, 120px);
}
.company_nav dl {
  background: #F6F4F2;
  padding: min(60 / 1320 * 100vw, 60px) min(80 / 1320 * 100vw, 80px) min(65 / 1320 * 100vw, 65px);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.company_nav dl dt {
  width: min(180 / 1320 * 100vw, 180px);
  font-weight: bold;
}
.company_nav dl dt p {
  font-size: min(36 / 1320 * 100vw, 36px);
  font-family: "Inter", "ZenKakuGothicNew-Medium", sans-serif;
  color: #0075B3;
  font-weight: 900;
  letter-spacing: 0.05em;
  line-height: 1;
}
.company_nav dl dt p + span {
  margin-top: min(10 / 1320 * 100vw, 10px);
  font-family: "ZenKakuGothicNew-Bold", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 700;
}
.company_nav dl dd {
  width: min(700 / 1320 * 100vw, 700px);
  position: relative;
}
.company_nav dl dd ul {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.company_nav dl dd ul li {
  width: min(320 / 1320 * 100vw, 320px);
}
.company_nav dl dd::before {
  content: "";
  display: block;
  position: absolute;
  left: -3em;
  width: 1px;
  height: 100%;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAHElEQVR4AWIy1tf9zwAFTGcvXmaEshmYYAwQDQAAAP//GRSOKQAAAAZJREFUAwBy+QQHN0kbgQAAAABJRU5ErkJggg==) repeat;
}
.company_nav a {
  position: relative;
  font-size: min(18 / 1320 * 100vw, 18px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  border-bottom: solid 1px #d9d9d9;
  padding: min(15 / 1320 * 100vw, 15px) 0px;
}
.company_nav a::after {
  content: "";
  display: block;
  position: absolute;
  content: "";
  display: inline-block;
  width: min(16 / 1320 * 100vw, 16px);
  height: min(16 / 1320 * 100vw, 16px);
  -webkit-mask: url(../img/common/icon_arrow.svg);
          mask: url(../img/common/icon_arrow.svg);
  background-color: #332F2D;
  -webkit-mask-size: 100%;
          mask-size: 100%;
  vertical-align: middle;
  position: absolute;
  right: 0;
}
@media screen and (max-width: 768px) {
  .company_nav a::after {
    width: min(12 / 375 * 100vw, 12px);
    height: min(12 / 375 * 100vw, 12px);
  }
}
.company_nav a::after {
  top: min(25 / 1320 * 100vw, 25px);
  right: min(7 / 1320 * 100vw, 7px);
  width: min(16 / 1320 * 100vw, 16px);
  height: min(16 / 1320 * 100vw, 16px);
  background-color: #fff;
}
.company_nav a::before {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  background: #332F2D;
  border-radius: 50px;
  vertical-align: middle;
  width: min(32 / 1320 * 100vw, 32px);
  height: min(32 / 1320 * 100vw, 32px);
}
.company_nav a small {
  margin-left: -0.5em;
}
.company_nav a.active {
  opacity: 0.4;
  pointer-events: none;
}
.company_nav a:hover {
  width: min(324 / 1320 * 100vw, 324px);
  padding-left: min(4 / 1320 * 100vw, 4px);
}
@media screen and (max-width: 768px) {
  .company_nav {
    margin-top: min(70 / 375 * 100vw, 70px);
  }
  .company_nav dl {
    padding: min(45 / 375 * 100vw, 45px) min(20 / 375 * 100vw, 20px) min(40 / 375 * 100vw, 40px);
  }
  .company_nav dl dt {
    width: 100%;
  }
  .company_nav dl dt p {
    font-size: min(32 / 375 * 100vw, 32px);
  }
  .company_nav dl dt p + a {
    margin-top: min(5 / 375 * 100vw, 5px);
  }
  .company_nav dl dt p + a:hover {
    width: auto;
  }
  .company_nav dl dd {
    width: 100%;
  }
  .company_nav dl dd ul li {
    width: 100%;
    margin-top: 0;
  }
  .company_nav dl dd::before {
    display: none;
  }
  .company_nav a {
    font-size: min(16 / 375 * 100vw, 16px);
    padding: min(14 / 375 * 100vw, 14px) 0px min(10 / 375 * 100vw, 10px);
  }
  .company_nav a::after {
    top: min(25 / 375 * 100vw, 25px);
    right: min(5 / 375 * 100vw, 5px);
    width: min(10 / 375 * 100vw, 10px);
    height: min(10 / 375 * 100vw, 10px);
  }
  .company_nav a::before {
    width: min(20 / 375 * 100vw, 20px);
    height: min(20 / 375 * 100vw, 20px);
  }
  .company_nav a small {
    margin-left: -0.8em;
  }
  .company_nav a:hover {
    width: auto;
    padding-left: 0;
  }
}

.message .area_kv {
  background: url("../img/kv/message_bg.jpg") no-repeat center top;
  background-size: 1920px auto;
  background-attachment: fixed;
}
@media screen and (min-width: 1921px) {
  .message .area_kv {
    background-size: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .message .area_kv {
    background-size: 1500px auto;
  }
}
@media screen and (max-width: 768px) {
  .message .area_kv {
    background: url("../img/kv/message_bg_sp.jpg") no-repeat center top;
    background-size: 100%;
    background-attachment: fixed;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    height: min(320 / 375 * 100vw, 320px);
  }
}
.message main {
  padding-top: min(90 / 1320 * 100vw, 90px);
}
@media screen and (max-width: 768px) {
  .message main {
    padding: min(65 / 375 * 100vw, 65px) 0 0;
  }
}

#area_message {
  padding: min(84 / 1320 * 100vw, 84px) 0 0;
  margin-bottom: min(90 / 1320 * 100vw, 90px);
}
#area_message .box_wrap {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#area_message .box_wrap .box_txt {
  width: 59.1666666667%;
}
#area_message .box_wrap .box_txt .ttl_lead {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#area_message .box_wrap .box_txt dl dt {
  font-family: "ZenKakuGothicNew-Bold", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 700;
  color: #0075B3;
  font-size: min(28 / 1320 * 100vw, 28px);
  margin-top: min(26 / 1320 * 100vw, 26px);
}
#area_message .box_wrap .box_txt dl dd {
  font-size: min(18 / 1320 * 100vw, 18px);
  margin-top: min(15 / 1320 * 100vw, 15px);
}
#area_message .box_wrap .box_ceo {
  width: 33.3333333333%;
  margin-top: min(40 / 1320 * 100vw, 40px);
}
#area_message .box_wrap .box_ceo .name {
  font-size: min(28 / 1320 * 100vw, 28px);
  text-align: center;
  margin-top: min(14 / 1320 * 100vw, 14px);
}
#area_message .box_wrap .box_ceo .name small {
  font-size: min(16 / 1320 * 100vw, 16px);
  display: block;
}
#area_message .box_wrap .box_ceo .comment {
  position: relative;
  display: inline-block;
  width: min(400 / 1320 * 100vw, 400px);
  margin-top: min(15 / 1320 * 100vw, 15px);
  padding: min(27 / 1320 * 100vw, 27px);
  border-radius: 28px;
  background-color: rgba(0, 117, 179, 0.1);
  text-align: left;
  font-size: min(16 / 1320 * 100vw, 16px);
}
#area_message .box_wrap .box_ceo .comment::after {
  content: "";
  position: absolute;
  top: 0;
  right: min(23 / 1320 * 100vw, 23px);
  border-style: solid;
  border-width: 0 12px 10px 12px;
  border-color: transparent transparent rgba(0, 117, 179, 0.1);
  translate: -50% -100%;
  -webkit-transform: skew(55deg);
          transform: skew(55deg);
  -webkit-transform-origin: bottom;
          transform-origin: bottom;
}
#area_message .box_wrap .box_ceo .comment::before {
  content: "";
  display: block;
  position: absolute;
  top: -1.2em;
  left: min(23 / 1320 * 100vw, 23px);
  -webkit-mask: url("../img/common/icon_quote.svg");
          mask: url("../img/common/icon_quote.svg");
  -webkit-mask-size: min(36 / 1320 * 100vw, 36px) min(30 / 1320 * 100vw, 30px);
          mask-size: min(36 / 1320 * 100vw, 36px) min(30 / 1320 * 100vw, 30px);
  background-color: rgba(0, 117, 179, 0.41);
  width: min(36 / 1320 * 100vw, 36px);
  height: min(30 / 1320 * 100vw, 30px);
}
@media screen and (max-width: 768px) {
  #area_message {
    padding: min(60 / 375 * 100vw, 60px) 0 0;
    margin-bottom: min(60 / 375 * 100vw, 60px);
  }
  #area_message .box_wrap .box_txt {
    width: 100%;
  }
  #area_message .box_wrap .box_txt dl dt {
    font-size: min(24 / 375 * 100vw, 24px);
    margin-top: min(26 / 375 * 100vw, 26px);
  }
  #area_message .box_wrap .box_txt dl dd {
    font-size: min(16 / 375 * 100vw, 16px);
    margin-top: min(15 / 375 * 100vw, 15px);
  }
  #area_message .box_wrap .box_ceo {
    width: 100%;
    margin-top: min(40 / 375 * 100vw, 40px);
  }
  #area_message .box_wrap .box_ceo p {
    width: 88.0597014925%;
    margin: 0 auto;
  }
  #area_message .box_wrap .box_ceo .name {
    font-size: min(24 / 375 * 100vw, 24px);
    margin-top: min(14 / 375 * 100vw, 14px);
  }
  #area_message .box_wrap .box_ceo .name small {
    font-size: min(14 / 375 * 100vw, 14px);
  }
  #area_message .box_wrap .box_ceo .comment {
    width: 100%;
    margin-top: min(15 / 375 * 100vw, 15px);
    padding: min(20 / 375 * 100vw, 20px);
    font-size: min(14 / 375 * 100vw, 14px);
  }
  #area_message .box_wrap .box_ceo .comment::after {
    right: min(23 / 375 * 100vw, 23px);
  }
  #area_message .box_wrap .box_ceo .comment::before {
    left: min(20 / 375 * 100vw, 20px);
    -webkit-mask-size: min(30 / 375 * 100vw, 30px) min(25 / 375 * 100vw, 25px);
            mask-size: min(30 / 375 * 100vw, 30px) min(25 / 375 * 100vw, 25px);
    width: min(30 / 375 * 100vw, 30px);
    height: min(25 / 375 * 100vw, 25px);
  }
}

.about_loop {
  position: relative;
  z-index: 999;
}
.about_loop .loop_img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 min(80 / 1320 * 100vw, 80px);
}
.about_loop .ul_img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-animation: loop-slide 85s infinite linear 1s both;
          animation: loop-slide 85s infinite linear 1s both;
  gap: 0 min(80 / 1320 * 100vw, 80px);
  position: relative;
}
.about_loop .ul_img li {
  width: min(674 / 1320 * 100vw, 674px);
  line-height: 1;
  white-space: nowrap;
  position: relative;
}
.about_loop .ul_img li .img {
  -webkit-box-shadow: 3px 3px 20px 0px rgba(0, 0, 0, 0.1);
          box-shadow: 3px 3px 20px 0px rgba(0, 0, 0, 0.1);
  position: relative;
}
.about_loop .ul_img li .deco {
  position: absolute;
}
.about_loop .ul_img li.loop01 {
  width: min(580 / 1320 * 100vw, 580px);
}
.about_loop .ul_img li.loop01 .img {
  margin-top: min(70 / 1320 * 100vw, 70px);
}
.about_loop .ul_img li.loop01 .deco {
  width: min(66 / 1320 * 100vw, 66px);
  left: 1.2em;
  bottom: -2em;
  animation: jump 6s ease-in-out infinite reverse;
}
.about_loop .ul_img li.loop02 {
  width: min(480 / 1320 * 100vw, 480px);
}
.about_loop .ul_img li.loop02 .img {
  margin-top: min(40 / 1320 * 100vw, 40px);
}
.about_loop .ul_img li.loop02 .deco {
  width: min(56 / 1320 * 100vw, 56px);
  left: 1em;
  bottom: -0.5em;
  -webkit-animation: kurun 7s ease-in-out infinite;
          animation: kurun 7s ease-in-out infinite;
}
.about_loop .ul_img li.loop03 {
  width: min(372 / 1320 * 100vw, 372px);
}
.about_loop .ul_img li.loop03 .img {
  margin-top: min(94 / 1320 * 100vw, 94px);
}
.about_loop .ul_img li.loop03 .deco {
  width: min(64 / 1320 * 100vw, 64px);
  right: 0.75em;
  bottom: -0.8em;
  animation: kakukaku 6s steps(1, end) infinite reverse;
}
.about_loop .ul_img li.loop04 {
  width: min(494 / 1320 * 100vw, 494px);
}
.about_loop .ul_img li.loop04 .deco {
  width: min(48 / 1320 * 100vw, 48px);
  left: -0.4em;
  bottom: -1.8em;
  animation: jump 6s ease-in-out infinite reverse;
}
.about_loop .ul_img li.loop05 {
  width: min(580 / 1320 * 100vw, 580px);
}
.about_loop .ul_img li.loop05 .img {
  margin-top: min(70 / 1320 * 100vw, 70px);
}
.about_loop .ul_img li.loop05 .deco {
  width: min(62 / 1320 * 100vw, 62px);
  right: 0.9em;
  top: -2.1em;
  -webkit-animation: kurun 6s ease-in-out infinite;
          animation: kurun 6s ease-in-out infinite;
}
.about_loop .ul_img li.loop06 {
  width: min(480 / 1320 * 100vw, 480px);
}
.about_loop .ul_img li.loop06 .img {
  margin-top: min(40 / 1320 * 100vw, 40px);
}
.about_loop .ul_img li.loop06 .deco {
  width: min(62 / 1320 * 100vw, 62px);
  right: 0.7em;
  bottom: -1em;
  -webkit-animation: kakukaku 5s steps(1, end) infinite;
          animation: kakukaku 5s steps(1, end) infinite;
}
.about_loop .ul_img li.loop07 {
  width: min(494 / 1320 * 100vw, 494px);
}
.about_loop .ul_img li.loop07 .img {
  margin-top: min(80 / 1320 * 100vw, 80px);
}
.about_loop .ul_img li.loop07 .deco {
  width: min(48 / 1320 * 100vw, 48px);
  right: 0.6em;
  top: -1.6em;
  -webkit-animation: kakukaku 7s steps(1, end) infinite;
          animation: kakukaku 7s steps(1, end) infinite;
}
@media screen and (max-width: 768px) {
  .about_loop {
    margin-top: 1.8em;
  }
  .about_loop .loop_img {
    gap: 0 min(40 / 375 * 100vw, 40px);
  }
  .about_loop .ul_img {
    gap: 0 min(40 / 375 * 100vw, 40px);
  }
  .about_loop .ul_img li.loop01 {
    width: min(290 / 375 * 100vw, 290px);
  }
  .about_loop .ul_img li.loop01 .img {
    margin-top: min(35 / 375 * 100vw, 35px);
  }
  .about_loop .ul_img li.loop01 .deco {
    width: min(33 / 375 * 100vw, 33px);
    left: 1.2em;
    bottom: -1.4em;
    animation: jump 6s ease-in-out infinite reverse;
  }
  .about_loop .ul_img li.loop02 {
    width: min(240 / 375 * 100vw, 240px);
  }
  .about_loop .ul_img li.loop02 .img {
    margin-top: min(20 / 375 * 100vw, 20px);
  }
  .about_loop .ul_img li.loop02 .deco {
    width: min(28 / 375 * 100vw, 28px);
    left: 1em;
    bottom: -0.5em;
    -webkit-animation: kurun 7s ease-in-out infinite;
            animation: kurun 7s ease-in-out infinite;
  }
  .about_loop .ul_img li.loop03 {
    width: min(186 / 375 * 100vw, 186px);
  }
  .about_loop .ul_img li.loop03 .img {
    margin-top: min(47 / 375 * 100vw, 47px);
  }
  .about_loop .ul_img li.loop03 .deco {
    width: min(32 / 375 * 100vw, 32px);
    right: 0.75em;
    bottom: -0.8em;
    animation: kakukaku 6s steps(1, end) infinite reverse;
  }
  .about_loop .ul_img li.loop04 {
    width: min(247 / 375 * 100vw, 247px);
  }
  .about_loop .ul_img li.loop04 .deco {
    width: min(32 / 375 * 100vw, 32px);
    left: -0.4em;
    bottom: -1.2em;
    animation: jump 6s ease-in-out infinite reverse;
  }
  .about_loop .ul_img li.loop05 {
    width: min(290 / 375 * 100vw, 290px);
  }
  .about_loop .ul_img li.loop05 .img {
    margin-top: min(35 / 375 * 100vw, 35px);
  }
  .about_loop .ul_img li.loop05 .deco {
    width: min(31 / 375 * 100vw, 31px);
    right: 0.9em;
    top: -1.6em;
    -webkit-animation: kurun 6s ease-in-out infinite;
            animation: kurun 6s ease-in-out infinite;
  }
  .about_loop .ul_img li.loop06 {
    width: min(240 / 375 * 100vw, 240px);
  }
  .about_loop .ul_img li.loop06 .img {
    margin-top: min(20 / 375 * 100vw, 20px);
  }
  .about_loop .ul_img li.loop06 .deco {
    width: min(31 / 375 * 100vw, 31px);
    right: 0.7em;
    bottom: -1em;
    -webkit-animation: kakukaku 5s steps(1, end) infinite;
            animation: kakukaku 5s steps(1, end) infinite;
  }
  .about_loop .ul_img li.loop07 {
    width: min(247 / 375 * 100vw, 247px);
  }
  .about_loop .ul_img li.loop07 .img {
    margin-top: min(40 / 375 * 100vw, 40px);
  }
  .about_loop .ul_img li.loop07 .deco {
    width: min(28 / 375 * 100vw, 28px);
    right: 0.6em;
    top: -1.4em;
    -webkit-animation: kakukaku 7s steps(1, end) infinite;
            animation: kakukaku 7s steps(1, end) infinite;
  }
}

@-webkit-keyframes loop-slide {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@keyframes loop-slide {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}
@-webkit-keyframes kakukaku {
  0%, 2% {
    -webkit-transform: rotateZ(10deg);
            transform: rotateZ(10deg);
  }
  3%, 5% {
    -webkit-transform: rotateZ(-10deg);
            transform: rotateZ(-10deg);
  }
  6%, 100% {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
  }
}
@keyframes kakukaku {
  0%, 2% {
    -webkit-transform: rotateZ(10deg);
            transform: rotateZ(10deg);
  }
  3%, 5% {
    -webkit-transform: rotateZ(-10deg);
            transform: rotateZ(-10deg);
  }
  6%, 100% {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
  }
}
@-webkit-keyframes kurun {
  0%, 70% {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
  }
  71% {
    -webkit-transform: rotateZ(90deg);
            transform: rotateZ(90deg);
  }
  72% {
    -webkit-transform: rotateZ(180deg);
            transform: rotateZ(180deg);
  }
  73% {
    -webkit-transform: rotateZ(270deg);
            transform: rotateZ(270deg);
  }
  74%, 100% {
    -webkit-transform: rotateZ(360deg);
            transform: rotateZ(360deg);
  }
}
@keyframes kurun {
  0%, 70% {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
  }
  71% {
    -webkit-transform: rotateZ(90deg);
            transform: rotateZ(90deg);
  }
  72% {
    -webkit-transform: rotateZ(180deg);
            transform: rotateZ(180deg);
  }
  73% {
    -webkit-transform: rotateZ(270deg);
            transform: rotateZ(270deg);
  }
  74%, 100% {
    -webkit-transform: rotateZ(360deg);
            transform: rotateZ(360deg);
  }
}
@-webkit-keyframes jump {
  0%, 70% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  73% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
  }
  76% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  79% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
  }
  82%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes jump {
  0%, 70% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  73% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
  }
  76% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  79% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
  }
  82%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
#area_thought {
  padding: min(50 / 1320 * 100vw, 50px) 0 0;
  position: relative;
  margin-top: calc(66px + 0px);
  padding-top: min(30 / 1320 * 100vw, 30px);
  position: relative;
  background: #fff;
}
#area_thought::before {
  content: "";
  display: block;
  width: 1920px;
  height: 66px;
  background: url(../img/common/curve_white.png) no-repeat center top;
  background-size: 100%;
  position: absolute;
  top: -65px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (max-width: 1380px) {
  #area_thought {
    margin-top: calc(min(66 / 1320 * 100vw, 66px) + 0px);
  }
  #area_thought::before {
    width: min(1920 / 1320 * 100vw, 1920px);
    height: min(66 / 1320 * 100vw, 66px);
    top: calc(min(65 / 1320 * 100vw, 65px) * -1);
  }
}
@media screen and (max-width: 768px) {
  #area_thought {
    margin-top: calc(7.4666666667vw + 0px);
  }
  #area_thought::before {
    width: 100vw;
    height: auto;
    aspect-ratio: 750/56;
    background: url(../img/common/curve_white_sp.png) no-repeat center top;
    background-size: 100%;
    top: -7.4666666667vw;
  }
}
#area_thought {
  margin-top: -15em;
}
@media screen and (max-width: 1380px) {
  #area_thought {
    margin-top: -15em;
  }
}
@media screen and (max-width: 768px) {
  #area_thought {
    margin-top: -7.5em;
  }
}
#area_thought #box_thought {
  position: relative;
  top: min(100 / 1320 * 100vw, 100px);
}
@media screen and (max-width: 768px) {
  #area_thought #box_thought {
    top: min(40 / 375 * 100vw, 40px);
  }
}
#area_thought .box_wrap {
  position: relative;
  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;
  margin-top: min(227 / 1320 * 100vw, 227px);
  padding: min(220 / 1320 * 100vw, 220px) 0 min(315 / 1320 * 100vw, 315px);
}
#area_thought .box_wrap .deco01, #area_thought .box_wrap .deco02 {
  position: absolute;
  width: min(425 / 1320 * 100vw, 425px);
  height: min(309 / 1320 * 100vw, 309px);
}
#area_thought .box_wrap .deco01 {
  bottom: min(-30 / 1320 * 100vw, -30px);
  bottom: 0;
  left: min(-199 / 1320 * 100vw, -199px);
}
#area_thought .box_wrap .deco02 {
  top: min(-61 / 1320 * 100vw, -61px);
  top: 0;
  right: min(-197 / 1320 * 100vw, -197px);
}
@media screen and (max-width: 1650px) {
  #area_thought .box_wrap .deco01 {
    bottom: 6em;
  }
  #area_thought .box_wrap .deco02 {
    top: 2em;
  }
}
@media screen and (max-width: 768px) {
  #area_thought .box_wrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: min(40 / 375 * 100vw, 40px);
    padding: min(90 / 375 * 100vw, 90px) 0 min(75 / 375 * 100vw, 75px);
  }
  #area_thought .box_wrap .deco01, #area_thought .box_wrap .deco02 {
    width: min(180 / 375 * 100vw, 180px);
    height: min(136 / 375 * 100vw, 136px);
    z-index: 2;
  }
  #area_thought .box_wrap .deco01 {
    top: min(70 / 375 * 100vw, 70px);
    bottom: inherit;
    left: min(-10 / 375 * 100vw, -10px);
    -webkit-transform: rotate(-50deg);
            transform: rotate(-50deg);
  }
  #area_thought .box_wrap .deco02 {
    bottom: min(30 / 375 * 100vw, 30px);
    top: inherit;
    right: min(-20 / 375 * 100vw, -20px);
  }
}
#area_thought .circle_thought {
  position: relative;
  width: 53.2828282828%;
  width: 100%;
  z-index: 0;
}
#area_thought .circle_thought h2.ttl_lead .jp {
  font-size: min(28 / 1320 * 100vw, 28px);
}
#area_thought .circle_thought p {
  color: #000;
  font-family: "ZenKakuGothicNew-Bold", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 700;
  font-size: min(24 / 1320 * 100vw, 24px);
  text-align: center;
  margin-top: min(30 / 1320 * 100vw, 30px);
}
#area_thought .circle_thought .bg-circle {
  position: absolute;
  background-size: 100%;
  background-position: center;
  z-index: -1;
  width: min(800 / 1320 * 100vw, 800px);
  width: clamp(min(540 / 1320 * 100vw, 540px), 58vw, min(844 / 1320 * 100vw, 844px));
  height: clamp(min(540 / 1320 * 100vw, 540px), 58vw, min(844 / 1320 * 100vw, 844px));
}
@media screen and (max-width: 1650px) {
  #area_thought .circle_thought .bg-circle {
    width: clamp(min(540 / 1320 * 100vw, 540px), 50vw, min(844 / 1320 * 100vw, 844px));
    height: clamp(min(540 / 1320 * 100vw, 540px), 50vw, min(844 / 1320 * 100vw, 844px));
  }
}
@media screen and (max-width: 768px) {
  #area_thought .circle_thought {
    position: relative;
    width: 100%;
    width: min(512 / 375 * 100vw, 512px);
    height: min(512 / 375 * 100vw, 512px);
  }
  #area_thought .circle_thought h2.ttl_lead .jp {
    font-size: min(24 / 375 * 100vw, 24px);
  }
  #area_thought .circle_thought p {
    font-size: min(18 / 375 * 100vw, 18px);
    margin-top: 20px;
  }
  #area_thought .circle_thought .bg-circle {
    width: min(512 / 375 * 100vw, 512px);
    height: min(512 / 375 * 100vw, 512px);
    margin: 0 calc(50% - min(256 / 375 * 100vw, 256px));
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }
  #area_thought .circle_thought::after {
    width: min(512 / 375 * 100vw, 512px);
    height: min(512 / 375 * 100vw, 512px);
    margin: 0 calc(50% - min(256 / 375 * 100vw, 256px));
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }
}
#area_thought .center-logo {
  -webkit-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
          box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  width: min(215 / 1320 * 100vw, 215px);
  height: min(215 / 1320 * 100vw, 215px);
  line-height: 1;
  z-index: 2;
}
#area_thought .center-logo img {
  width: min(162 / 1320 * 100vw, 162px);
  height: min(80 / 1320 * 100vw, 80px);
}
#area_thought .center-logo p {
  margin-top: min(17 / 1320 * 100vw, 17px);
  font-size: min(20 / 1320 * 100vw, 20px);
  font-family: "ZenKakuGothicNew-Bold", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  #area_thought .center-logo {
    width: min(180 / 375 * 100vw, 180px);
    height: min(180 / 375 * 100vw, 180px);
    max-width: 240px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: absolute;
  }
  #area_thought .center-logo img {
    width: min(128 / 375 * 100vw, 128px);
    height: min(62 / 375 * 100vw, 62px);
    width: 78.0487804878%;
    height: auto;
  }
  #area_thought .center-logo p {
    margin-top: min(17 / 375 * 100vw, 17px);
    font-size: min(14 / 375 * 100vw, 14px);
  }
}
#area_thought .circle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #fff;
  border-radius: 50%;
  aspect-ratio: 1/1;
}
#area_thought .box_policy {
  bottom: min(50 / 1320 * 100vw, 50px);
  left: 0;
}
#area_thought .box_policy h2.ttl_lead {
  color: #0075B3;
}
#area_thought .box_policy h2.ttl_lead .en {
  color: rgba(0, 117, 179, 0.08);
}
#area_thought .box_policy .bg-circle {
  background: url("../img/company/message/policy_bg.png") no-repeat center;
  background-size: 100%;
}
@media screen and (max-width: 768px) {
  #area_thought .box_policy {
    bottom: 0;
    left: 0;
  }
}
#area_thought .box_vision {
  top: min(50 / 1320 * 100vw, 50px);
  right: 0;
}
#area_thought .box_vision h2.ttl_lead {
  color: #EE442B;
}
#area_thought .box_vision h2.ttl_lead .en {
  color: rgba(238, 68, 43, 0.08);
}
#area_thought .box_vision .bg-circle {
  background: url("../img/company/message/vision_bg.png") no-repeat center;
  background-size: 100%;
}
@media screen and (max-width: 768px) {
  #area_thought .box_vision {
    top: 0;
    right: 0;
  }
  #area_thought .box_vision .bg-circle {
    top: inherit;
  }
}

.outline .area_kv {
  background: url("../img/kv/outline_bg.jpg") no-repeat center top;
  background-size: 1920px auto;
  background-attachment: fixed;
}
@media screen and (min-width: 1921px) {
  .outline .area_kv {
    background-size: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .outline .area_kv {
    background-size: 1500px auto;
  }
}
@media screen and (max-width: 768px) {
  .outline .area_kv {
    background: url("../img/kv/outline_bg_sp.jpg") no-repeat center top;
    background-size: 100%;
    background-attachment: fixed;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    height: min(320 / 375 * 100vw, 320px);
  }
}
.outline main {
  padding-top: min(90 / 1320 * 100vw, 90px);
}
@media screen and (max-width: 768px) {
  .outline main {
    padding: min(65 / 375 * 100vw, 65px) 0 0;
  }
}
@media screen and (min-width: 769px) {
  .outline .tel {
    pointer-events: none;
  }
}
@media screen and (max-width: 768px) {
  .outline .tel {
    color: #0075B3;
    text-decoration: underline;
  }
}

#area_outline {
  padding: min(80 / 1320 * 100vw, 80px) 0 min(120 / 1320 * 100vw, 120px);
}
@media screen and (max-width: 768px) {
  #area_outline {
    padding: min(60 / 375 * 100vw, 60px) 0 min(90 / 375 * 100vw, 90px);
  }
}
#area_outline .box_wrap {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#area_outline .box_wrap .box_txt {
  width: 50%;
}
@media screen and (max-width: 768px) {
  #area_outline .box_wrap .box_txt {
    width: 100%;
  }
}
#area_outline .box_wrap .box_txt .ttl_lead {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#area_outline .box_wrap .box_txt .ttl_lead + span {
  font-size: min(14 / 1320 * 100vw, 14px);
  display: block;
  text-align: right;
}
@media screen and (max-width: 768px) {
  #area_outline .box_wrap .box_txt .ttl_lead + span {
    font-size: min(14 / 375 * 100vw, 14px);
  }
}
#area_outline .box_wrap .box_txt .dl_list {
  border-top: dotted 1px #c8c8c8;
}
#area_outline .box_wrap .box_txt .dl_list .box_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: dotted 1px #c8c8c8;
  padding: min(15 / 1320 * 100vw, 15px) 0;
}
#area_outline .box_wrap .box_txt .dl_list .box_list dt {
  font-family: "ZenKakuGothicNew-Bold", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 700;
  width: 20%;
}
#area_outline .box_wrap .box_txt .dl_list .box_list dd {
  width: 80%;
  margin: 0;
}
@media screen and (max-width: 768px) {
  #area_outline .box_wrap .box_txt .dl_list .box_list {
    padding: min(11 / 375 * 100vw, 11px) 0;
  }
  #area_outline .box_wrap .box_txt .dl_list .box_list dt {
    width: 30%;
  }
  #area_outline .box_wrap .box_txt .dl_list .box_list dd {
    width: 70%;
  }
}
#area_outline .box_wrap .box_photo {
  position: relative;
}
#area_outline .box_wrap .box_photo .object01 {
  position: absolute;
  top: min(-70 / 1320 * 100vw, -70px);
  right: min(-60 / 1320 * 100vw, -60px);
  width: min(384 / 1320 * 100vw, 384px);
  height: min(384 / 1320 * 100vw, 384px);
}
#area_outline .box_wrap .box_photo .object02 {
  position: absolute;
  bottom: min(-40 / 1320 * 100vw, -40px);
  right: min(-60 / 1320 * 100vw, -60px);
  width: min(536 / 1320 * 100vw, 536px);
  height: min(216 / 1320 * 100vw, 216px);
}
#area_outline .box_wrap .box_photo .photo_outline {
  opacity: 0;
  -webkit-transform: translateY(30px);
          transform: translateY(30px);
}
#area_outline .box_wrap .box_photo figcaption {
  font-size: min(14 / 1320 * 100vw, 14px);
  text-align: right;
  margin-top: min(10 / 1320 * 100vw, 10px);
}
#area_outline .box_wrap .box_photo .photo01 {
  width: min(270 / 1320 * 100vw, 270px);
  margin: 0 auto;
}
#area_outline .box_wrap .box_photo .box_picture {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#area_outline .box_wrap .box_photo .photo02 {
  width: min(190 / 1320 * 100vw, 190px);
}
#area_outline .box_wrap .box_photo .photo02 figcaption {
  font-size: min(14 / 1320 * 100vw, 14px);
  text-align: center;
}
#area_outline .box_wrap .box_photo .photo03 {
  width: min(276 / 1320 * 100vw, 276px);
  margin-top: min(55 / 1320 * 100vw, 55px);
  margin-left: min(50 / 1320 * 100vw, 50px);
}
#area_outline .box_wrap .box_photo .photo04 {
  width: min(262 / 1320 * 100vw, 262px);
  margin-top: min(40 / 1320 * 100vw, 40px);
}
@media screen and (max-width: 768px) {
  #area_outline .box_wrap .box_photo {
    width: 100%;
    margin-top: min(70 / 375 * 100vw, 70px);
  }
  #area_outline .box_wrap .box_photo .object01 {
    top: min(-50 / 375 * 100vw, -50px);
    right: 0;
    width: 68.6567164179%;
    height: min(230 / 375 * 100vw, 230px);
  }
  #area_outline .box_wrap .box_photo .object02 {
    bottom: -1.5em;
    left: min(100 / 375 * 100vw, 100px);
    width: min(321 / 375 * 100vw, 321px);
    width: 95.8208955224%;
    height: min(129 / 375 * 100vw, 129px);
  }
  #area_outline .box_wrap .box_photo figcaption {
    font-size: min(12 / 375 * 100vw, 12px);
  }
  #area_outline .box_wrap .box_photo .photo01 {
    width: 54.328358209%;
    margin: 0;
  }
  #area_outline .box_wrap .box_photo .photo02 {
    width: 38.2089552239%;
    margin-top: min(10 / 375 * 100vw, 10px);
  }
  #area_outline .box_wrap .box_photo .photo02 figcaption {
    font-size: min(12 / 375 * 100vw, 12px);
  }
  #area_outline .box_wrap .box_photo .photo03 {
    width: 55.5223880597%;
    margin-top: min(35 / 375 * 100vw, 35px);
  }
  #area_outline .box_wrap .box_photo .photo04 {
    width: 52.5373134328%;
    margin-top: min(20 / 375 * 100vw, 20px);
  }
}

#area_history {
  padding: min(50 / 1320 * 100vw, 50px) 0 0;
  position: relative;
  background: #fff;
  margin-top: calc(66px + 0px);
  padding-top: min(30 / 1320 * 100vw, 30px);
  position: relative;
  background: #fff;
}
#area_history::before {
  content: "";
  display: block;
  width: 1920px;
  height: 66px;
  background: url(../img/common/curve_white.png) no-repeat center top;
  background-size: 100%;
  position: absolute;
  top: -65px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (max-width: 1380px) {
  #area_history {
    margin-top: calc(min(66 / 1320 * 100vw, 66px) + 0px);
  }
  #area_history::before {
    width: min(1920 / 1320 * 100vw, 1920px);
    height: min(66 / 1320 * 100vw, 66px);
    top: calc(min(65 / 1320 * 100vw, 65px) * -1);
  }
}
@media screen and (max-width: 768px) {
  #area_history {
    margin-top: calc(7.4666666667vw + 0px);
  }
  #area_history::before {
    width: 100vw;
    height: auto;
    aspect-ratio: 750/56;
    background: url(../img/common/curve_white_sp.png) no-repeat center top;
    background-size: 100%;
    top: -7.4666666667vw;
  }
}
@media screen and (max-width: 768px) {
  #area_history {
    padding: min(40 / 375 * 100vw, 40px) 0 0;
  }
}
#area_history .ttl_lead .en {
  color: rgba(0, 117, 179, 0.08);
}
#area_history .history_anchor {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 6.5em;
  padding-top: min(40 / 1320 * 100vw, 40px);
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  gap: min(20 / 1320 * 100vw, 20px);
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.4s ease, visibility 0.4s ease;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
#area_history .history_anchor li a {
  font-size: min(16 / 375 * 100vw, 16px);
  font-family: "Inter", "ZenKakuGothicNew-Medium", sans-serif;
  font-weight: 900;
  color: #0075B3;
  background: #fff;
  padding: min(8 / 1320 * 100vw, 8px) min(27 / 1320 * 100vw, 27px);
  border: solid 2px #ccc;
  border-radius: 50px;
}
#area_history .history_anchor li a.current {
  background: #0075B3;
  color: #fff;
  border-color: #0075B3;
}
@media screen and (min-width: 769px) {
  #area_history .history_anchor li a:hover {
    background: #0075B3;
    color: #fff;
    border-color: #0075B3;
  }
}
#area_history .history_anchor.js-hidden {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  -webkit-transition-delay: 0s, 0.4s;
          transition-delay: 0s, 0.4s;
}
#area_history .history_anchor.js-fixed {
  position: fixed;
  top: min(10 / 1320 * 100vw, 10px);
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 999;
}
@media screen and (max-width: 768px) {
  #area_history .history_anchor {
    top: 5em;
    padding-top: min(30 / 375 * 100vw, 30px);
    width: 100%;
    gap: min(7 / 375 * 100vw, 7px);
  }
  #area_history .history_anchor li a {
    font-size: min(12 / 375 * 100vw, 12px);
    padding: min(8 / 375 * 100vw, 8px) min(10 / 375 * 100vw, 10px);
  }
  #area_history .history_anchor.js-hidden {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    -webkit-transition-delay: 0s, 0.4s;
            transition-delay: 0s, 0.4s;
  }
  #area_history .history_anchor.js-fixed {
    position: fixed;
    top: min(30 / 375 * 100vw, 30px);
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 100%;
  }
}
#area_history .box_history {
  position: relative;
  padding-top: min(30 / 1320 * 100vw, 30px);
  margin-top: min(110 / 1320 * 100vw, 110px);
}
#area_history .box_history::before, #area_history .box_history::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 117, 179, 0)), color-stop(5%, rgb(0, 117, 179)), to(rgba(0, 117, 179, 0)));
  background-image: linear-gradient(0deg, rgba(0, 117, 179, 0), rgb(0, 117, 179) 5% 95%, rgba(0, 117, 179, 0));
  width: min(4 / 1320 * 100vw, 4px);
}
#area_history .box_history::before {
  height: calc(100% - min(10 / 1320 * 100vw, 10px));
}
@media screen and (max-width: 768px) {
  #area_history .box_history {
    padding-top: min(20 / 375 * 100vw, 20px);
    margin-top: min(50 / 375 * 100vw, 50px);
  }
  #area_history .box_history::before, #area_history .box_history::after {
    left: min(8 / 375 * 100vw, 8px);
    right: auto;
  }
  #area_history .box_history::before {
    height: calc(100% - min(20 / 375 * 100vw, 20px));
    width: min(4 / 375 * 100vw, 4px);
  }
}
#area_history .ol_history {
  position: relative;
  padding-bottom: min(100 / 1320 * 100vw, 100px);
}
#area_history .ol_history::after {
  content: "";
  display: block;
  clear: both;
}
#area_history .ol_history > li {
  width: 50%;
  position: relative;
  list-style: none;
}
#area_history .ol_history > li::before {
  content: "";
  display: block;
  position: absolute;
  width: min(17 / 1320 * 100vw, 17px);
  height: min(17 / 1320 * 100vw, 17px);
  background: #ECF8FF;
  border: 3px solid #0075B3;
  border-radius: 50%;
  position: absolute;
  top: min(7 / 1320 * 100vw, 7px);
  z-index: 10;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#area_history .ol_history > li h3 {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-transition: 1000ms linear;
  transition: 1000ms linear;
  color: #0075B3;
  font-family: "Inter", "ZenKakuGothicNew-Medium", sans-serif;
  font-weight: 900;
  font-size: min(28 / 1320 * 100vw, 28px);
  line-height: 1;
  position: relative;
}
#area_history .ol_history > li h3::after {
  content: "";
  display: block;
  position: absolute;
  top: min(16 / 1320 * 100vw, 16px);
  height: 2px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfUAAAABCAYAAADHPDeqAAAABHNCSVQICAgIfAhkiAAAAChJREFUOE9jZCjddJqh28+UAQRG2aPhMJoGRtPAaBoYTQOjaWDIpgEAiFT1EZ0HMzkAAAAASUVORK5CYII=) repeat;
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -webkit-transform-origin: center right;
          transform-origin: center right;
}
#area_history .ol_history > li h3 + ul li {
  position: relative;
  font-size: min(18 / 1320 * 100vw, 18px);
  margin-top: min(10 / 1320 * 100vw, 10px);
}
#area_history .ol_history > li h3 + ul li span {
  margin-left: 0.8em;
  display: block;
}
#area_history .ol_history > li h3 + ul li span::before {
  content: "";
  display: block;
  position: absolute;
  top: 15px;
  left: 0;
  background: #0075B3;
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
#area_history .ol_history > li.left {
  padding-top: min(60 / 1320 * 100vw, 60px);
}
#area_history .ol_history > li.left::before {
  right: -0.5em;
  top: min(70 / 1320 * 100vw, 70px);
}
#area_history .ol_history > li.left h3::after {
  width: min(486 / 1320 * 100vw, 486px);
  right: min(12 / 1320 * 100vw, 12px);
}
#area_history .ol_history > li.left ul {
  padding-right: min(60 / 1320 * 100vw, 60px);
}
#area_history .ol_history > li.right {
  float: right;
  padding-top: min(-30 / 1320 * 100vw, -30px);
}
#area_history .ol_history > li.right::before {
  left: -0.5em;
}
#area_history .ol_history > li.right h3 {
  padding-left: min(60 / 1320 * 100vw, 60px);
}
#area_history .ol_history > li.right h3::after {
  width: min(36 / 1320 * 100vw, 36px);
  left: min(12 / 1320 * 100vw, 12px);
}
#area_history .ol_history > li.right h3 + ul {
  padding-left: min(60 / 1320 * 100vw, 60px);
}
@media screen and (min-width: 769px) {
  #area_history .ol_history > li.y1967 {
    padding-top: 0;
  }
  #area_history .ol_history > li.y1967::before {
    right: -0.5em;
    top: min(10 / 1320 * 100vw, 10px);
  }
  #area_history .ol_history > li.y1971 {
    padding-top: min(-30 / 1320 * 100vw, -30px);
  }
  #area_history .ol_history > li.y1991 .img {
    width: min(216 / 1320 * 100vw, 216px);
    height: min(40 / 1320 * 100vw, 40px);
    padding-top: min(15 / 1320 * 100vw, 15px);
  }
  #area_history .ol_history > li.y2010 {
    padding-top: 0;
    margin-top: min(-40 / 1320 * 100vw, -40px);
  }
  #area_history .ol_history > li.y2010 .img {
    display: block;
    width: min(155 / 1320 * 100vw, 155px);
    height: min(86 / 1320 * 100vw, 86px);
    margin: min(15 / 1320 * 100vw, 15px) 0;
  }
}
@media screen and (max-width: 768px) {
  #area_history .ol_history {
    position: relative;
    padding-bottom: 0;
  }
  #area_history .ol_history > li {
    width: 100%;
  }
  #area_history .ol_history > li::before {
    width: min(17 / 375 * 100vw, 17px);
    height: min(17 / 375 * 100vw, 17px);
    top: min(4 / 375 * 100vw, 4px);
  }
  #area_history .ol_history > li::after {
    top: min(12 / 375 * 100vw, 12px);
  }
  #area_history .ol_history > li.right, #area_history .ol_history > li.left {
    padding-right: 0;
    padding-top: min(40 / 375 * 100vw, 40px);
    float: none;
  }
  #area_history .ol_history > li.right h3, #area_history .ol_history > li.left h3 {
    padding-left: min(40 / 375 * 100vw, 40px);
  }
  #area_history .ol_history > li.right h3::after, #area_history .ol_history > li.left h3::after {
    width: min(12 / 375 * 100vw, 12px);
    top: min(10 / 375 * 100vw, 10px);
    right: 0;
    left: min(18 / 375 * 100vw, 18px);
  }
  #area_history .ol_history > li.right h3 + ul, #area_history .ol_history > li.left h3 + ul {
    padding-left: min(40 / 375 * 100vw, 40px);
  }
  #area_history .ol_history > li.right::before, #area_history .ol_history > li.left::before {
    top: min(42 / 375 * 100vw, 42px);
    left: 0;
  }
  #area_history .ol_history > li h3 {
    font-size: min(24 / 375 * 100vw, 24px);
  }
  #area_history .ol_history > li h3 + ul li {
    font-size: min(16 / 375 * 100vw, 16px);
    line-height: 1.75;
    margin-top: min(10 / 375 * 100vw, 10px);
  }
  #area_history .ol_history > li h3 + ul li span {
    margin-left: 0.8em;
    display: block;
  }
  #area_history .ol_history > li h3 + ul li span::before {
    top: min(12 / 375 * 100vw, 12px);
    left: 0;
    width: min(6 / 375 * 100vw, 6px);
    height: min(6 / 375 * 100vw, 6px);
  }
  #area_history .ol_history > li.y1991 .img {
    width: min(166 / 375 * 100vw, 166px);
    height: min(31 / 375 * 100vw, 31px);
    margin-top: min(15 / 375 * 100vw, 15px);
    padding-left: min(40 / 375 * 100vw, 40px);
  }
  #area_history .ol_history > li.y2010 .img {
    width: min(119 / 375 * 100vw, 119px);
    height: min(66 / 375 * 100vw, 66px);
    margin: min(15 / 375 * 100vw, 15px) 0;
  }
}

#area_office {
  background: #fff;
  padding-top: min(170 / 1320 * 100vw, 170px);
}
@media screen and (max-width: 768px) {
  #area_office {
    padding-top: min(70 / 375 * 100vw, 70px);
  }
}
#area_office .ttl_lead .en {
  color: rgba(0, 117, 179, 0.08);
}
#area_office .box_map {
  background: rgba(0, 117, 179, 0.08);
  margin-top: min(55 / 1320 * 100vw, 55px);
}
#area_office .box_map .map {
  position: relative;
}
#area_office .box_map .map .line {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 10;
}
#area_office .box_map .map .line .square {
  display: block;
  width: min(17 / 1320 * 100vw, 17px);
  height: min(18 / 1320 * 100vw, 18px);
  background: currentColor;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
#area_office .box_map .map .line.red-line {
  color: #EE442B;
  bottom: min(165 / 1320 * 100vw, 165px);
  right: min(582 / 1320 * 100vw, 582px);
  width: min(44 / 1320 * 100vw, 44px);
}
#area_office .box_map .map .line.red-line .horizontal {
  display: block;
  height: 2px;
  background: currentColor;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  width: 100%;
}
#area_office .box_map .map .line.blue-line {
  color: #0075B3;
  bottom: min(155 / 1320 * 100vw, 155px);
  left: min(525 / 1320 * 100vw, 525px);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: min(29 / 1320 * 100vw, 29px);
}
#area_office .box_map .map .line.blue-line .vertical {
  display: block;
  width: 2px;
  background: currentColor;
  height: min(30 / 1320 * 100vw, 30px);
}
#area_office .box_map .map .line.blue-line .diagonal {
  display: block;
  width: 2px;
  height: min(38 / 1320 * 100vw, 38px);
  background: currentColor;
  -webkit-transform-origin: left top;
          transform-origin: left top;
  -webkit-transform: rotate(-128deg);
          transform: rotate(-128deg);
  position: absolute;
  top: min(1 / 1320 * 100vw, 1px);
  left: min(15 / 1320 * 100vw, 15px);
}
#area_office .box_map .map .box_btn {
  height: min(53 / 1320 * 100vw, 53px);
  position: absolute;
}
#area_office .box_map .map .box_btn a {
  background: #fff;
  color: #000;
}
#area_office .box_map .map .box_btn a span {
  position: relative;
  padding-left: min(14 / 1320 * 100vw, 14px);
}
#area_office .box_map .map .box_btn a span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: min(12 / 1320 * 100vw, 12px);
  height: min(8 / 1320 * 100vw, 8px);
  border: min(8 / 1320 * 100vw, 8px) solid transparent;
  border-left: min(8 / 1320 * 100vw, 8px) solid #0075B3;
}
#area_office .box_map .map .box_btn.office_btn {
  width: min(133 / 1320 * 100vw, 133px);
  bottom: min(150 / 1320 * 100vw, 150px);
  right: min(450 / 1320 * 100vw, 450px);
}
#area_office .box_map .map .box_btn.office_btn::before {
  background: #EE442B;
  border: none;
}
#area_office .box_map .map .box_btn.office_btn a {
  border: solid 1px #EE442B;
}
#area_office .box_map .map .box_btn.office_btn a span::before {
  border-left: min(8 / 1320 * 100vw, 8px) solid #EE442B;
}
#area_office .box_map .map .box_btn.factory_btn {
  width: min(330 / 1320 * 100vw, 330px);
  bottom: min(300 / 1320 * 100vw, 300px);
  right: min(350 / 1320 * 100vw, 350px);
}
#area_office .box_map .map .box_btn.factory_btn::before {
  background: #0075B3;
  border: none;
}
#area_office .box_map .map .box_btn.factory_btn a {
  border: solid 1px #0075B3;
}
#area_office .box_map .map .box_btn.gallery_btn {
  width: min(330 / 1320 * 100vw, 330px);
  bottom: min(230 / 1320 * 100vw, 230px);
  right: min(350 / 1320 * 100vw, 350px);
}
#area_office .box_map .map .box_btn.gallery_btn::before {
  background: #0075B3;
  border: none;
}
#area_office .box_map .map .box_btn.gallery_btn a {
  border: solid 1px #0075B3;
}
@media screen and (max-width: 768px) {
  #area_office .box_map {
    margin-top: min(30 / 375 * 100vw, 30px);
  }
  #area_office .box_map .inner {
    padding: 0;
  }
  #area_office .box_map .map img {
    width: 100%;
    height: 100%;
    min-height: min(375 / 375 * 100vw, 375px);
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: 42% center;
       object-position: 42% center;
  }
  #area_office .box_map .map .line {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    z-index: 1;
  }
  #area_office .box_map .map .line .square {
    width: 4vw;
    height: 2vw;
  }
  #area_office .box_map .map .line.red-line {
    bottom: 24%;
    right: 39%;
    width: 11%;
  }
  #area_office .box_map .map .line.blue-line {
    bottom: 22%;
    left: 44%;
    width: min(29 / 375 * 100vw, 29px);
  }
  #area_office .box_map .map .line.blue-line .square {
    width: 3vw;
    height: 3vw;
  }
  #area_office .box_map .map .line.blue-line .vertical {
    display: block;
    width: 2px;
    background: currentColor;
    height: 4vw;
  }
  #area_office .box_map .map .line.blue-line .diagonal {
    height: 5vw;
    height: 7vw;
    -webkit-transform: rotate(-143deg);
            transform: rotate(-143deg);
    top: min(1 / 375 * 100vw, 1px);
    left: min(15 / 375 * 100vw, 15px);
  }
  #area_office .box_map .map .box_btn {
    height: auto;
    font-size: min(12 / 375 * 100vw, 12px);
    line-height: 1.25;
    text-align: left;
    z-index: 2;
  }
  #area_office .box_map .map .box_btn a span {
    padding: 0 min(14 / 375 * 100vw, 14px) 0 min(20 / 375 * 100vw, 20px);
    font-size: min(12 / 375 * 100vw, 12px);
    line-height: 1.25;
    text-align: left;
  }
  #area_office .box_map .map .box_btn a span::before {
    top: min(10 / 375 * 100vw, 10px);
    left: min(5 / 375 * 100vw, 5px);
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    width: min(10 / 375 * 100vw, 10px);
    height: min(5 / 375 * 100vw, 5px);
    border: 5px solid transparent;
    border-left: 5px solid #0075B3;
  }
  #area_office .box_map .map .box_btn.office_btn {
    width: 23.7333333333%;
    height: 7%;
    bottom: 23%;
    right: 16.5%;
  }
  #area_office .box_map .map .box_btn.office_btn a span::before {
    top: min(4 / 375 * 100vw, 4px);
    border-left: 5px solid #EE442B;
  }
  #area_office .box_map .map .box_btn.factory_btn {
    width: 43.2%;
    height: 11%;
    bottom: 50%;
    right: 13%;
  }
  #area_office .box_map .map .box_btn.gallery_btn {
    width: 43.2%;
    height: 11%;
    bottom: 35%;
    right: 13%;
  }
  #area_office .box_map .map .button a {
    position: absolute;
    bottom: 0;
    right: 0;
    width: min(32 / 375 * 100vw, 32px);
    height: min(32 / 375 * 100vw, 32px);
    background: #332F2D;
    z-index: 100;
    -webkit-transition: 0.4s cubic-bezier(0.2, 0.6, 0.3, 1.1);
    transition: 0.4s cubic-bezier(0.2, 0.6, 0.3, 1.1);
  }
  #area_office .box_map .map .button a::before, #area_office .box_map .map .button a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background: #fff;
  }
  #area_office .box_map .map .button a::before {
    width: 2px;
    height: 50%;
  }
  #area_office .box_map .map .button a::after {
    width: 50%;
    height: 2px;
  }
}
#area_office .box_area .box_wrap {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: min(70 / 1320 * 100vw, 70px) 0;
  border-bottom: dotted 1px #332F2D;
}
#area_office .box_area .box_wrap h3 {
  font-size: min(24 / 1320 * 100vw, 24px);
  font-family: "ZenKakuGothicNew-Bold", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 700;
  line-height: 1;
  position: relative;
}
#area_office .box_area .box_wrap h3::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: #0075B3;
  width: min(6 / 1320 * 100vw, 6px);
  height: min(22 / 1320 * 100vw, 22px);
}
#area_office .box_area .box_wrap h3 span {
  margin-left: min(15 / 1320 * 100vw, 15px);
}
#area_office .box_area .box_wrap .box_photo {
  width: min(400 / 1320 * 100vw, 400px);
}
#area_office .box_area .box_wrap .box_access p {
  margin-top: min(30 / 1320 * 100vw, 30px);
}
#area_office .box_area .box_wrap .box_access .box_btn {
  width: min(224 / 1320 * 100vw, 224px);
  height: min(51 / 1320 * 100vw, 51px);
  margin-top: min(30 / 1320 * 100vw, 30px);
}
#area_office .box_area .box_wrap .box_access .box_btn a {
  background: #fff;
  color: #332F2D;
  border: solid 1px #332F2D;
}
#area_office .box_area .box_wrap .box_access .box_btn a span {
  position: relative;
  padding-left: 24px;
}
#area_office .box_area .box_wrap .box_access .box_btn a span::before {
  content: "";
  display: block;
  position: absolute;
  width: min(11 / 1320 * 100vw, 11px);
  height: min(15 / 1320 * 100vw, 15px);
  display: inline-block;
  -webkit-mask: url("../img/company/outline/pin.svg");
          mask: url("../img/company/outline/pin.svg");
  background-size: contain;
  background-color: #0075B3;
  -webkit-mask-size: 100%;
          mask-size: 100%;
  vertical-align: middle;
  left: -0.1em;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
#area_office .box_area .box_wrap .box_access .box_btn::before {
  background: #332F2D;
  border: 1px solid #fff;
}
#area_office .box_area .box_wrap#office h3::before {
  background: #EE442B;
}
#area_office .box_area .box_wrap#office .box_btn span::before {
  background-color: #EE442B;
}
@media screen and (max-width: 768px) {
  #area_office .box_area .box_wrap {
    padding: min(35 / 375 * 100vw, 35px) 0;
  }
  #area_office .box_area .box_wrap h3 {
    font-size: min(20 / 375 * 100vw, 20px);
  }
  #area_office .box_area .box_wrap h3::before {
    width: min(6 / 375 * 100vw, 6px);
    height: min(22 / 375 * 100vw, 22px);
  }
  #area_office .box_area .box_wrap h3 span {
    margin-left: min(10 / 375 * 100vw, 10px);
  }
  #area_office .box_area .box_wrap .box_photo {
    width: 100%;
    margin-top: min(24 / 375 * 100vw, 24px);
  }
  #area_office .box_area .box_wrap .box_access p {
    margin-top: min(30 / 375 * 100vw, 30px);
    letter-spacing: -0.01em;
  }
  #area_office .box_area .box_wrap .box_access .box_btn {
    width: min(198 / 375 * 100vw, 198px);
    height: min(44 / 375 * 100vw, 44px);
    margin-top: min(30 / 375 * 100vw, 30px);
  }
  #area_office .box_area .box_wrap .box_access .box_btn a span {
    position: relative;
    padding-left: 24px;
  }
  #area_office .box_area .box_wrap .box_access .box_btn a span::before {
    width: min(11 / 375 * 100vw, 11px);
    height: min(15 / 375 * 100vw, 15px);
  }
}
/*# sourceMappingURL=company.css.map */