@charset "utf-8"; /* default PC */
/* animation */
.animation {
  opacity:0;
  position:relative;
  top:40px;
  transition:.5s;
}

.animation.active {
  opacity:1;
  top:0;
  transition:.5s;
}

/* nav */
#g-navi .navi-list li a {
  text-shadow:#FFF 1px 1px 20px, #E4E9F1 -1px 1px 20px, #E4E9F1 1px -1px 20px, #E4E9F1 -1px -1px 20px, #E4E9F1 1px 1px 20px, #E4E9F1 -1px 1px 20px;
}

#g-navi .navi-list li.btn a {
  text-shadow:none;
}

.shadow #g-navi .navi-list li a {
  text-shadow:none;
}

/* main-view */
.main-view,
.splide__track {
  height:85svh;
  min-height:550px;
  position:relative;
}

#splide01-slide01,
#splide01-slide02,
#splide01-slide03,
#splide01-slide04 {
  position:relative;
}

#splide01-slide01::before,
#splide01-slide02::before,
#splide01-slide03::before,
#splide01-slide04::before {
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  content:"";
  display:block;
  height:100%;
  width:100%;
}


#splide01-slide01::before {
  background-image:url(../image/contents/home/index_slider_05.jpg);
  background-position:center bottom;
}

#splide01-slide02::before {
  background-image:url(../image/contents/home/index_slider_02.jpg);
  background-position:center 8%;
}

#splide01-slide03::before {
  background-image:url(../image/contents/home/index_slider_04.jpg);
  background-position:center bottom;
}

#splide01-slide04::before {
  background-image:url(../image/contents/home/index_slider_03.jpg);
}

button.splide__toggle {
  -webkit-appearance:none;
          appearance:none;
  background:none;
  border:none;
  height:27px;
  padding:0;
  width:27px;
}

/* インスタ */
#home #sb_instagram #sbi_images {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
}

#home #sb_instagram #sbi_images .sbi_item {
  width:calc((100% - 10px * 4) / 5);
}

/* contents */
.header {
  background-color:transparent;
}

#contents .inner {
  max-width:1750px;
}

#contents .bg-blue h2,
#contents .bg-blue h2 .en-ttl {
  color:#FFF;
}

#contents h2.main .en-ttl {
  font-size:70px;
}

#contents h2.main .en-ttl.small {
  text-transform:unset;
}

#contents .txt-3box {
  margin-right:45px;
  width:calc(100% / 3 - 30px);
}

#contents .bg-blue p {
  color:#FFF;
  font-weight:500;
}

#contents .txt-3box.end {
  margin-right:0;
}

#contents .link-btn {
  font-size:20px;
  max-width:523px;
  padding:22px 10px;
}

#contents .bg-blue .link-btn {
  border-color:#FFF;
  color:#FFF;
}

#contents .bg-blue .link-btn::after {
  border-left:7px solid #FFF;
}

#contents .bg-blue .link-btn:hover {
  opacity:.5;
}

#contents .top-reason .reason-box {
  margin-bottom:60px;
}

#contents .top-reason .reason-box .img-box {
  border:4px solid #C09520;
  margin-bottom:30px;
  position:relative;
}

#contents .top-reason .reason-box .main-txt {
  font-size:26px;
  letter-spacing:.05em;
  text-align:center;
}

#contents .top-reason .reason-box .sub-ttl {
  background-color:#C09520;
  clip-path:polygon(0 0, 100% 0%, 86% 100%, 0% 100%);
  color:#FFF;
  font-size:25px;
  font-style:italic;
  font-weight:600;
  left:-1px;
  letter-spacing:.05em;
  max-width:fit-content;
  padding:7px 45px 7px 25px;
  position:absolute;
  top:-1px;
  width:100%;
}

#contents .top-reason .reason-box .sub-ttl .num {
  font-size:140%;
  margin-left:10px;
}

#contents .top-product {
  padding:80px 0;
}

#contents .top-product .product-box {
  margin-bottom:60px;
}

#contents .top-product .news-category {
  gap:0;
  margin:0 auto 45px;
  max-width:1600px;
  padding:0 55px;
}

#contents .top-product .news-category .news-cat-ttl {
  width:180px;
}

#contents .top-product .news-category ul {
  width:calc(100% - 180px);
}

#contents .top-recruit .recruit-box {
  gap:40px 30px;
}

#contents .top-recruit .inner {
  max-width:1400px;
}

#contents .top-recruit .recruit-box .txt-4box {
  margin:0;
  width:calc((100% - 30px * 2) / 3);
}

#contents .top-recruit p {
  letter-spacing:.1em;
}

#contents .top-recruit .link-bnr {
  border:4px solid #C09520;
  position:relative;
}

#contents .top-recruit .link-bnr .bnr-ttl {
  background-color:#C09520;
  bottom:0;
  font-size:22px;
  letter-spacing:.1em;
  margin-bottom:0;
  max-width:165px;
  padding:11px 5px 7px;
  position:absolute;
  right:0;
  text-align:center;
  width:100%;
}

#contents .top-recruit .link-bnr .bnr-ttl.long {
  max-width:237px;
}

#contents .top-news {
  background:url(../image/contents/home/bg_news.jpg) no-repeat center / cover;
  padding:80px 0;
}

#contents .top-news .inner {
  background-color:#FFF;
  max-width:1400px;
  padding:50px 80px 60px;
}

#contents .top-news .news-contents {
  display:none;
  margin-bottom:50px;
}

#contents .top-news .news-contents.active {
  display:block;
}

#contents .news-category {
  align-items:center;
  background-color:#F1F4FD;
  display:flex;
  flex-wrap:wrap;
  gap:0 35px;
  justify-content:center;
  margin-bottom:35px;
}

#contents .news-category .news-cat-ttl {
  font-size:22px;
  font-weight:500;
  letter-spacing:.1em;
  margin-bottom:0;
}

#contents .news-category ul.style-none li {
  border:2px solid #314FA5;
  color:#314FA5;
  font-weight:500;
  letter-spacing:.05em;
  line-height:1.1em;
  max-width:max-content;
  padding:6px 10px;
  text-align:center;
  transition:.3s;
  width:100%;
}

#contents .news-category ul.flex.start {
  gap:10px;
  justify-content:flex-start;
  margin:25px 0;
  padding:0;
}

#contents .news-category ul.style-none li.active,
#contents .news-category ul.style-none li.btn-active {
  background-color:#314FA5;
  color:#FFF;
  pointer-events:none;
}

@media (hover: hover) {
  #contents .news-category ul.style-none li:hover {
    background-color:#314FA5;
    color:#FFF;
    cursor:pointer;
    transition:.3s;
  }
}

#contents .bnr-area {
  padding:70px 0;
}

#contents .bnr-area .bnr-box {
  margin:0 auto;
  max-width:1153px;
}

#contents .bnr-area .link-bnr {
  align-items:center;
  background-color:#314FA5;
  border:4px solid #314FA5;
  color:#FFF;
}

#contents .bnr-area .link-bnr .bnr-ttl {
  font-size:26px;
  letter-spacing:.1em;
  line-height:1em;
  margin-bottom:0;
}

#contents .bnr-area .link-bnr .bnr-ttl .en-txt {
  display:block;
  font-size:70%;
  line-height:1em;
  margin-top:30px;
}

#contents .link-area {
  background:url(../image/contents/home/bg_link_area.jpg) no-repeat center / cover;
  padding:80px 0;
}

#contents .link-area .inner {
  max-width:1640px;
}

#contents .link-area .txt-3box {
  background-color:#FFF;
}

#contents .link-area .link-bnr {
  align-items:center;
  background-color:#314FA5;
  color:#FFF;
  display:flex;
  font-size:30px;
  font-weight:500;
  height:100%;
  letter-spacing:.1em;
  padding:40px 22px 40px 110px;
  position:relative;
}

#contents .link-area .link-bnr:hover {
  opacity:.6;
}

#contents .link-area .link-bnr.contact {
  align-items:flex-start;
  background-color:#C09520;
  flex-direction:column;
  justify-content:center;
}

#contents .link-area .link-bnr::before {
  background:url(../image/base/ico_online.svg) no-repeat center / contain;
  bottom:0;
  content:"";
  display:block;
  height:34px;
  left:50px;
  margin:auto;
  position:absolute;
  top:0;
  width:34px;
}

#contents .link-area .link-bnr.demo::before {
  background-image:url(../image/base/ico_demo.svg);
}

#contents .link-area .link-bnr.contact::before {
  background-image:url(../image/base/ico_contact.svg);
}

#contents .link-area .link-bnr .sub-txt {
  font-size:60%;
  letter-spacing:.05em;
  line-height:1em;
  margin-bottom:17px;
}

@media screen and (max-width: 1600px) {
  #contents .link-area .link-bnr {
    font-size:28px;
  }
}

@media screen and (max-width: 1500px) {
  #contents .link-area .link-bnr::before {
    left:30px;
  }

  #contents .link-area .link-bnr {
    font-size:26px;
    padding:40px 22px 40px 80px;
  }

  #contents .bnr-area .bnr-box {
    max-width:1000px;
  }

  #contents .top-reason .reason-box .main-txt {
    font-size:25px;
  }
}

@media screen and (max-width: 1400px) {
  #contents .top-reason .reason-box .main-txt {
    font-size:23px;
  }

  #contents .link-btn {
    font-size:18px;
    max-width:400px;
    padding:18px 10px;
  }

  #contents h2.main .en-ttl {
    font-size:60px;
  }

  .main-view,
  .splide__track {
    height:75svh;
    min-height:520px;
  }
}

@media screen and (max-width: 1300px) {
  #contents .top-recruit .recruit-box .txt-4box {
    width:calc((100% - 24px * 2) / 3);
  }

  #contents .top-reason .reason-box .img-box {
    margin-bottom:20px;
  }

  #contents .link-area .link-bnr::before {
    height:28px;
    width:28px;
  }

  #contents .link-area .link-bnr .sub-txt {
    font-size:64%;
    margin-bottom:10px;
  }

  #contents .link-area .link-bnr {
    font-size:23px;
    padding:40px 22px 40px 75px;
  }

  #contents .top-news .inner {
    padding:50px 50px 60px;
  }

  #contents .top-recruit .link-bnr .bnr-ttl {
    font-size:20px;
  }

  #contents .top-recruit .recruit-box {
    gap:40px 24px;
  }

  #contents .news-category ul.style-none li {
    font-size:17px;
  }

  #contents .top-reason .reason-box .sub-ttl {
    font-size:21px;
    padding:6px 40px 6px 20px;
  }

  #contents .top-reason .reason-box .main-txt {
    font-size:17px;
  }

  #contents .txt-3box {
    margin-right:24px;
    width:calc(100% / 3 - 16px);
  }
}

/* view-1140 notePC,Tablet */
@media screen and (max-width: 1140px) {
  #contents .top-product {
    padding:70px 0;
  }

  #contents .top-news,
  #contents .link-area {
    padding:70px 0;
  }

  #contents h2.main .en-ttl {
    font-size:45px;
  }

  #contents .link-area .link-bnr.contact {
    padding:28px 22px 28px 75px;
  }

  #contents .link-area .flex {
    gap:30px 0;
  }

  #contents .bnr-area .link-bnr .bnr-ttl .en-txt {
    margin-top:20px;
  }

  #contents .bnr-area .link-bnr .bnr-ttl {
    font-size:20px;
  }

  #contents .top-news .inner {
    padding:45px 30px 50px;
  }

  #contents .news-category ul.flex.start {
    margin:0;
  }

  #contents .top-news .news-category ul.flex.start {
    justify-content:center;
  }

  #contents .top-recruit .link-bnr .bnr-ttl {
    font-size:18px;
    max-width:150px;
  }

  #contents .top-recruit .link-bnr .bnr-ttl.long {
    max-width:200px;
  }

  #contents .link-btn {
    font-size:16px;
    max-width:300px;
    padding:12px 10px;
  }

  #contents .top-product .news-category ul {
    width:100%;
  }

  #contents .top-product .news-category,
  #contents .news-category {
    display:block;
    padding:20px 20px 30px;
  }

  #contents .top-product .news-category .news-cat-ttl,
  #contents .news-category .news-cat-ttl {
    font-size:20px;
    margin-bottom:12px;
    text-align:center;
    width:auto;
  }

  #contents .news-category ul.style-none li {
    font-size:15px;
  }

  #contents .top-reason .reason-box {
    gap:30px 0;
    justify-content:center;
  }

  #contents .reason-box .txt-3box,
  #contents .link-area .txt-3box {
    width:calc(100% / 2 - 16px);
  }

  #contents .reason-box .txt-3box:nth-child(2),
  #contents .link-area .txt-3box:nth-child(2) {
    margin-right:0;
  }
}

/* view-959 Mobile,Tablet */
@media screen and (max-width: 959px) {
  #home #sb_instagram #sbi_images .sbi_item {
    width:calc((100% - 10px * 3) / 4);
  }

  #contents .link-area .link-bnr .sub-txt {
    margin-bottom:7px;
  }

  #contents .link-area .link-bnr::before {
    height:25px;
    left:22px;
    width:25px;
  }

  #contents .link-area .link-bnr.contact {
    padding:26px 22px 23px 60px;
  }

  #contents .link-area .link-bnr {
    font-size:20px;
    padding:35px 22px 35px 60px;
  }

  #contents .bnr-area .bnr-box {
    gap:30px;
    max-width:500px;
  }

  #contents .bnr-area .bnr-box .img-2box {
    width:35%;
  }

  #contents .bnr-area .bnr-box .img-2box-txt {
    margin-left:40px;
    width:calc(65% - 40px);
  }

  #contents .top-recruit .recruit-box .txt-4box {
    width:calc((100% - 24px * 1) / 2);
  }

  #g-navi .navi-list li a {
    text-shadow:none;
  }

  .main-view,
  .splide__track {
    height:65svh;
    min-height:480px;
  }

  button.splide__toggle {
    bottom:23px;
  }
}

@media screen and (max-width: 767px) {
  #contents .link-area .flex {
    margin:0 auto;
    max-width:500px;
  }

  #contents .top-reason .reason-box {
    gap:50px 0;
    margin:0 auto 50px;
    max-width:500px;
  }

  #contents .reason-box .txt-3box,
  #contents .link-area .txt-3box {
    margin:0;
    width:100%;
  }
}

/* view-559 Mobile */
@media screen and (max-width: 559px) {
  #home #sb_instagram #sbi_images .sbi_item {
    width:calc((100% - 10px * 2) / 3);
  }

  #contents .bnr-area {
    padding:60px 0;
  }

  #contents .top-news,
  #contents .link-area {
    padding:60px 0;
  }

  #contents .top-product {
    padding:60px 0;
  }

  #contents .link-area .flex {
    gap:20px 0;
  }

  #contents .link-area .link-bnr::before {
    height:23px;
    left:25px;
    width:23px;
  }

  #contents .link-area .link-bnr.contact {
    padding:23px 22px 20px 65px;
  }

  #contents .link-area .link-bnr .sub-txt {
    font-size:70%;
  }

  #contents .bnr-area .link-bnr .bnr-ttl .en-txt {
    margin-top:17px;
  }

  #contents .bnr-area .link-bnr .bnr-ttl {
    font-size:19px;
  }

  #contents .top-news .news-category ul.flex.start {
    gap:5px;
  }

  #contents .top-product .news-category,
  #contents .news-category {
    padding:17px 10px 25px;
  }

  #contents .top-recruit .link-bnr .bnr-ttl {
    font-size:17px;
    max-width:200px;
  }

  #contents .top-recruit .recruit-box {
    gap:30px 24px;
  }

  #contents .top-recruit .recruit-box .txt-4box {
    text-align:center;
    width:100%;
  }

  #contents .top-product .product-box {
    margin-bottom:50px;
  }

  #contents .news-category ul.style-none li {
    font-size:14px;
    padding:5px;
  }

  #contents .top-product .news-category .news-cat-ttl,
  #contents .news-category .news-cat-ttl {
    font-size:18px;
  }

  #contents .link-btn {
    font-size:15px;
    max-width:100%;
    padding:10px;
  }

  #contents .top-reason .reason-box {
    gap:40px 0;
    margin-bottom:40px;
  }

  #contents .top-reason .reason-box .sub-ttl {
    font-size:17px;
  }

  contents .top-reason .reason-box .main-txt {
    font-size:21px;
  }

  #contents h2.main .en-ttl {
    font-size:40px;
  }

  #contents .link-area .link-bnr {
    font-size:19px;
    padding:30px 22px 30px 65px;
  }

  #contents .top-news .inner {
    padding:40px 15px 50px;
  }

  .main-view,
  .splide__track {
    height:60svh;
    min-height:330px;
  }

  #contents .txt-3box {
    margin-right:0;
    width:100%;
  }

  #contents .top-product .news-category .news-cat-ttl {
    width:100%;
  }

  #contents .top-product .news-category ul {
    width:100%;
  }

  #contents .top-product .news-category {
    padding:20px 15px 25px;
  }
}