@charset "UTF-8";
img {
  display:block;width:100%;height:auto;
}
.link-box {
  width:100%;height:auto;
}
.link-box > a {
  display:flex;align-items:center;justify-content:space-between;
  width:100%;height:80px;padding:0 30px;box-sizing:border-box;
  background:linear-gradient(to right,#42A5F5,#FAAEB9);
  font-weight:bold;color:#fff;border-radius:50vh;
}
.link-box-text {
  line-height:1.6;
}
.link-box-sub {
  font-size:1.2rem;
}
.link-box a > img {
  width:30px;height:auto;
}
#entry {
  z-index:1;
}
/*----------------------------------------------------
  loading
----------------------------------------------------*/
#loading {
  position: fixed;
  top:0;left:0;bottom:0;
  width:100%;height:100%;
  z-index:99999;
  background:#fff;
  text-align:center;
}
#loading img {
  width:100%;max-width:280px;height:auto;margin:0 auto;
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
}
/*----------------------------------------------------
  main-img
----------------------------------------------------*/
#main-img {
  width:100%;height:60vh;
  position:relative;
  display:flex;justify-content:space-between;align-items:center;justify-content:center;
}
.main-img {
  width:100%;max-width:1200px;margin:0 auto;height:auto;
  display:flex;justify-content:space-between;
}
.title {
  display:flex;flex-direction:column-reverse;
}
.title h2 {
  display:flex;align-items:center;
  font-size:1.4rem;font-weight:normal;
  padding-left:16px;box-sizing:border-box;
}
.title h2::before {
  display:block;content:'';
  width:26px;height:1px;background:#ccc;margin-right:8px;
}
.title > div {
  display:flex;align-items:center;
  margin-bottom:5px;
}
.title > div::before {
  display:block;content:'';width:10px;height:10px;
  background:linear-gradient(45deg,#42A5F5,#FAAEB9);
  border-radius:50vh;
  margin-right:8px;
}
.title > div > img {
  height:26px;width:auto;
}
.main-nav {
  display:flex;align-items:center;list-style:none;
}
.main-nav > li {
  height:48px;border-bottom:1px solid #ccc;margin-left:40px;
}
.main-nav > li > a {
  height:48px;
  display:flex;justify-content:space-between;align-items:center;
  padding:0 20px;
}
.main-nav > li > a > i {
  margin-left:6px;
}
/*----------------------------------------------------
  about
----------------------------------------------------*/
#about {
  width:100%;height:auto;
  padding-bottom:200px;
  position:relative;
  background-color: #fff;
}
.about {
  width:100%;max-width:1200px;margin:0 auto;height:auto;
}
.about-cols {
  width:100%;height:auto;
  display:flex;justify-content:space-between;
  position:relative;
}
.about-cols:nth-of-type(n+2) {
  margin-top:200px;
}
.about-img {
  width:100vw;height:auto;
  margin-left: calc(50% - 50vw);
  position:relative;
}
.about-img-bg {
  position:absolute;
  bottom:-15%;left:5%;
  width:100%;height:100%;
  background-size: 20px 20px;
  background-image: radial-gradient(#C9E5FC 10%, transparent 10%), radial-gradient(#C9E5FC 10%, transparent 10%);
  background-position: 0 0 ,10px 10px;
}
.about-img2 {
  width:100vw;height:auto;
  margin-right: calc(50% - 50vw);
  position:relative;z-index:1;
}
.about-img > img,.about-img2 > img,.about-img3 > img {
  width:100%;height:auto;
  position:relative;z-index:2;
}
.about-img-dx {
  position:absolute;z-index:2;
  bottom:-20%;right:25%;
  width:50%;height:auto;
}
.about-list {
  width:100vw;height:auto;
  margin-left: calc(50% - 50vw);
  position:relative;
  display:flex;flex-wrap:wrap;
}
.about-list > img {
  display:block;width:calc(100%/3);height:auto;
}
.about-inner {
  width:75%;height:auto;
  padding:0 50px;box-sizing:border-box;
  position:relative;z-index:1;
}
.about-inner h3 {
  margin-bottom:10px;
}
.about-inner_lead {
  width:100%;height:auto;
  padding-bottom:10px;
  margin-bottom:20px;
  position:relative;
}
.about-inner_lead > p {
  font-size:3rem;font-weight:bold;
  line-height:1.4;
}
.about-inner_lead::after {
  content:'';
  position:absolute;
  left:-50px;
  bottom:-5px;
  width:0%;
  height:2px;
  background:#ccc;
  z-index:-1;
  transition: all 1s;
}
.about-cols:nth-of-type(2) .about-inner_lead::after {
  left:0;
}
.about-inner_lead.isUnderline:after {
  width:calc(100% + 50px);
}
.about-inner_text > p:not(:last-child) {
  margin-bottom:16px;
}
/*----------------------------------------------------
  business
----------------------------------------------------*/
#business {
  width:100%;height:auto;
  padding:200px 0;
  position:relative;
  background:#f8f8f8;
}
.business {
  width:100%;max-width:1200px;margin:0 auto;height:auto;
  position:relative;
}
.business-title {
  position:absolute;
  top:-260px;left:0;
  width:100%;height:auto;
}
.business-title > h2 {
  width:35%;height:auto;
}
.business-title_lead {
  padding:30px;box-sizing:border-box;
  font-size:2.4rem;font-weight:bold;
}
.business-cols {
  width:100%;height:auto;
  display:flex;justify-content:space-between;
  padding-top:50px;
}
.business-inner {
  width:45%;height:auto;
}
.business-inner > ul {
  width:100%;height:auto;
}
.business-inner > ul > li {
  width:100%;height:auto;
  box-sizing:border-box;
}
.business-inner > ul > li:nth-child(2n) {
  padding-left:50px;
}
.business-inner > ul > li:nth-child(3) {
  padding-left:100px;
}
.business-name {
  width:100%;height:auto;
  display:flex;align-items: center;
  border-bottom:1px solid #B9BBC3;
  padding-bottom:10px;
}
.business-number {
  font-size:4.6rem;line-height:1;
}
.business-name-cols {
  margin-left:20px;
  line-height:1.6;
}
.business-name-cols > span {
  display:block;font-size:1.2rem;color:#42A5F5;
}
.business-name-cols > p {
  font-size:1.6rem;font-weight:bold;
}
.business-img {
  width:50%;height:auto;
  display:flex;justify-content:center;align-items:center;
  position:relative;
}
.business-img > svg {
  width:100%;height:auto;
}
.circle-wrap {
    position:absolute;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    width:40%;
    height:0;
    padding-top:40%;
    border:#eee 2px solid;
    border-radius:50vh;
}
.circle-frame {
    position: absolute;
    top: -8px;
    left: calc(50% - 8px);
    width: 16px;
    height: calc(50% + 8px);
    transform-origin: center bottom;
    transform:rotate(0deg);
    animation:rotate 10s linear infinite;
}
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.circle {
  width:16px;
  height:16px;
  border-radius:50vh;
  background:linear-gradient(to right,#42A5F5,#FAAEB9);
  mix-blend-mode:overlay;
}
.business-logo {
  width:30%;height:auto;
  position:absolute;
  top:50%;left:48%;
  transform:translate(-50%,-50%);
}
.business-inner > ul {
  width:100%;list-style:none;
}
.business-inner > li {
  margin-bottom:20px;
  padding-bottom:10px;
}
.business-inner-text {
  padding:20px;box-sizing:border-box;
}
/*----------------------------------------------------
  company
----------------------------------------------------*/
#company {
  width:100%;height:auto;
  padding-bottom:200px;
  position:relative;z-index:1;
  background:#f8f8f8;
}
#company::after {
  display:block;content:'';
  width:100%;height:70%;
  background:#fff;
  position:absolute;
  bottom:0;left:0;
}
.company-img {
  width:90%;max-width:1536px;
  height:auto;margin-left:auto;
  position:relative;z-index:1;
  margin-bottom:80px;
}
.company-text {
  width:60%;height:auto;
  position:absolute;top:70%;left:-9%;
  transform:translate(0,-50%);
  mix-blend-mode:color-dodge;
}
.company {
  width:100%;max-width:1200px;margin:0 auto;height:auto;
  position:relative;z-index:1;
}
.company-cols {
  width:100%;height:auto;
  display:flex;justify-content:space-between;
}
.company-title {
  width:35%;height:auto;
}
.company-title > h2 {
  width:70%;height:auto;margin-bottom:50px;
}
.company-title_lead {
  font-size:2rem;font-weight:bold;
  padding:0 10px;box-sizing:border-box;
}
.company-cols > dl {
  width:65%;height:auto;
  display:flex;flex-wrap:wrap;
}
.company-cols > dl > dt {
  width:150px;height:auto;
  padding:20px 16px;box-sizing:border-box;
  color:#969AA5;font-size:1.2rem;
}
.company-cols > dl > dt:nth-of-type(n+2),
.company-cols > dl > dd:nth-of-type(n+2) {
  border-top:1px solid #eee;
}
.company-cols > dl > dd {
  width:calc(100% - 150px);height:auto;
  padding:20px 16px;box-sizing:border-box;
  font-weight:bold;
}
@media screen and (max-width:1360px) {
}
@media screen and (max-width:1280px) {
  .main-img {
    width:90%;max-width:initial;
  }
  .about,.business,.company {
    width:90%;
  }
}
@media screen and (max-width:1024px) {
  .about,.business,.company {
    width:70%;
  }
  .about-cols {
    flex-direction:column;
  }
  .about-img {
    width:85vw;
  }
  .about-inner {
    width:100%;
    margin-top:80px;
    padding:0;
  }
  .about-inner_lead.isUnderline:after {
    width:100%;
  }
  .about-inner_lead::after {
    left:0;
  }
  .about-cols:nth-of-type(2) {
    flex-direction:column-reverse;
  }
  .business-title > h2 {
    width:60%;
  }
  .business-title_lead,.company-title_lead {
    font-size:3rem;
  }
  .business-cols {
    flex-direction:column;
  }
  .business-img {
    width:70%;margin:0 auto;
  }
  .business-inner {
    width:100%;
    margin-top:50px;
  }
  #company::after {
    height:90%;
  }
  .company-cols {
    flex-direction:column;
  }
  .company-title {
    width:100%;margin-bottom:50px;
  }
  .company-title > h2 {
    width:60%;
  }
  .company-cols > dl {
    width:100%;
  }
}
@media screen and (max-width:896px) {
  .main-img {
    flex-direction:column;
  }
  .title {
    margin-bottom:20px;
  }
  .main-nav {
    justify-content:center;
  }
  .main-nav > li:first-child {
    margin-left:0;
  }
  .main-img_cols_list {
    margin-top:50px;
  }
  .main-img_cols_list > img {
    width:calc(100%/2);
  }
  .business-title_lead,.company-title_lead {
    font-size:2.4rem;
  }
}
@media screen and (max-width:786px) {
  .about,.business,.company {
    width:80%;
  }
}
@media screen and (max-width:680px) {
  .main-nav {
    flex-direction:column;
  }
  .main-nav > li,.main-nav > li:first-child {
    margin-left:auto;
  }
  .about,.business,.company {
    width:85%;
  }
  .business-title > h2,.company-title > h2 {
    width:70%;
  }
  .business-cols {
    padding-top:0;
  }
  .business-inner > ul > li:nth-child(2n),
  .business-inner > ul > li:nth-child(3) {
    padding-left:0;
  }
  #business {
    padding-bottom:100px;
  }
  #company::after {
    height:85%;
  }
  .company-img::after {
    display: block;content:'';
    width:100%;height:0;
    padding-top:70%;
  }
  .company-img > img {
    width:100%;height:100%;
    object-fit:cover;object-position:right;
    position:absolute;top:0;left:0;
  }
  .company-text {
    width:90%;
  }
}
@media screen and (max-width:480px) {
  .main-img {
    padding-top:60px;
  }
  .title h2 {
    justify-content:center;
  }
  .title > div {
    justify-content:center;
  }
  .title > div > img {
    width:70%;height:auto;
  }
  #about {
    padding-bottom:100px;
  }
  .about-cols:nth-of-type(n+2) {
    margin-top:100px;
  }
  .about-img,.about-img2 {
    position:relative;
  }
  .about-img::after,.about-img2::after {
    display: block;content:'';
    width:100%;height:0;
    padding-top:80%;
  }
  .about-img > img,.about-img2 > img {
    width:100%;height:100%;
    object-fit:cover;
    position:absolute;top:0;left:0;
  }
  .about-cols:nth-of-type(1) .about-img > img {
    object-position:right;
  }
  .about-inner_lead > p {
    font-size:2.6rem;
  }
  #business { 
    padding:100px 0;
  }
  .business-title {
    position: relative;
    top:initial;left:initial;
  }
  .business-title_lead, .company-title_lead {
    font-size:1.8rem;
  }
  .business-title_lead br,.company-title_lead br {
    display:none;
  }
  .business-title_lead {
    padding:30px 0;
  }
  .business-img {
    width:85%;
  }
  .business-number {
    font-size:3rem;
  }
  .business-name-cols {
    margin-left:10px;
  }
  .business-name-cols > span {
    font-size:1rem;
  }
  .business-name-cols > p {
    font-size:1.4rem;
  }
  .business-inner-text {
    padding:10px 0 40px 0;
  }
  #company {
    padding-bottom:100px;
  }
  #company::after {
    height:92.5%;
  }
  .company-title_lead {
    padding:0;
  }
  .company-img {
    margin-bottom:50px;
  }
  .company-title > h2 {
    margin-bottom:30px;
  }
  .company-title {
    margin-bottom:30px;
  }
  .company-cols > dl {
    flex-direction:column;
  }
  .company-cols > dl > dt,
  .company-cols > dl > dd {
    width:100%;
  }
  .company-cols > dl > dt {
    padding-bottom:10px;
    padding-top:30px;
  }
  .company-cols > dl > dd {
    border-top: 1px solid #eee;
    padding-bottom:10px;
    margin-bottom:10px;
  }
  .company-cols > dl > dd > ul {
    padding-left:16px;box-sizing:border-box;
  }
}
