@charset "UTF-8";
/**************************************************
		index（TOP）
     -MainVisual
     -Contact

**************************************************/

/* ===== MainVisual ===== */
.visual.visual-one{
  background:#fff;
  position: relative;
  overflow-x: hidden;
  padding-top:13rem;
}
.visual-one .visual-content .visual-title .product-name-sub{
  font-size:3.5rem;
  display:block;
}
.visual-one .visual-content .description{
  font-size: 2.2rem;
  line-height: 1.7;
}
.visual-one .visual-content .points{
  gap:1.5rem;
  margin-right:5rem;
  width:87%;
}
.visual-one .visual-content .attention{
  margin-top:3rem;
}
.visual.visual-one .col-image{
  margin-right:0;
}
/*
.visual.visual-one .col-image img{
  animation: zoom 4s infinite ease;
  animation-direction: alternate;
  transform: scale(1) translate(0px);
}
*/
@media screen and (max-width:991px){
  .visual.visual-one .col-image{
    position: absolute;
    top:27rem;
    left:12%;
    width:80%;
  }
  .visual-one .visual-content .points{
    width:100%;
    margin-top:54rem;
    margin-right:0;
  }
}
@media screen and (max-width:768px){
.visual-one .visual-content .points{
  margin-top:42rem;
  }
}
@media screen and (max-width:480px){
  .visual-one .visual-content .visual-title{
    line-height:1.3;
    font-size:15vw;
    margin-bottom:2vw;
  }
  .visual-one .visual-content .visual-title .product-name-sub{
    font-size:7vw;
    line-height:1.4;
  }
  .visual-one .visual-content .description{
    font-size:5vw;
  }
  .visual.visual-one .col-image{
    top:55vw;
  }
  .visual-one .visual-content .points{
    margin-top:77vw;
  }
  .visual-one .visual-content .attention{
    font-size:4vw;
  }
}

.visual.visual-one .bg-shape{
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
  width: 100%;
}
.visual.visual-one .bg-shape img{
  width: 100%;
}
.visual.visual-one .circle-shape {
  position: absolute;
  top: -20%;
  left: -13%;
}


/* ===== Call To Action ===== */
.call-to-action{
  margin-top:7rem;
  padding:5rem 0;
  background:#C70100;
  color:#fff;
  line-height: 1.5;
}
.call-to-action01 .action-content .pix-btn{
  font-size:2.5rem;
  font-weight:bold;
  margin:2rem 0;
  padding-left:5rem;
  padding-right:5rem;
}
.call-to-action01 .action-content .pix-btn:hover{
  padding-left:7rem;
  padding-right:7rem;
}
@media (max-width:768px){
  .call-to-action01 .action-content .pix-btn{
    font-size:4.5vw;
  }
  .call-to-action p.attention{
    font-size:3.5vw;
  }
}

.call-to-action02{
  background:#F2F2F2;
}
.call-to-action02,
.call-to-action02 .action-content .title,
.call-to-action02 .action-content p{
  color:#000000;
}

.call-to-action02 .section-title{
  margin-bottom:3rem;
}
.call-to-action02 .section-title .title{
  margin-bottom:2rem;
  font-size:3.2rem;
}
.call-to-action02 .section-title p{
  font-size:2rem;
}

.call-to-action02 .action-content{
  justify-content:center;
  gap:4rem;
  align-items:stretch;
}
.call-to-action02 .action-content .contact-info-box{
  width:50%;
  background:#fff;
  padding:4rem 2rem;
  border-radius:20px;
}
.call-to-action02 .action-content .title,
.call-to-action02 .action-content .pix-btn,
.call-to-action02 .action-content p{
  font-size:2.5rem;
  line-height:1.4;
}
.call-to-action02 .action-content .title{
  font-weight:normal;
}
.call-to-action02 .action-content .pix-btn{
  margin:1.5rem 0;
  padding:1.4rem;
  width: 100%;
  background:#C70100;
  color:#fff;
  border:3px solid #fff;
  border-radius:53px;
}
.call-to-action02 .action-content .pix-btn i{
  margin-right:0.5rem;
}
.call-to-action02 .action-content .pix-btn:hover{
  background:transparent;
  color:#C70100;
  border:3px solid #C70100;
}
@media (max-width:768px){
  .call-to-action02 .action-content{
    flex-direction:column;
  }
  .call-to-action02 .action-content .title,
  .call-to-action02 .action-content .pix-btn,
  .call-to-action02 .action-content p{
    font-size:2rem;
  }
  .call-to-action02 .action-content .contact-info-box{
    width:100%;
    padding:2rem;
  }
  .call-to-action02 .section-title{
    padding:0 1rem;
  }
  .call-to-action02 .section-title p.attention{
    font-size:1.6rem;
  }
  .call-to-action02 .section-title .title{
    font-size:3rem;
  }
}

/* ===== Information ===== */
.information{
  padding:7rem 0;
}

/*ポータルサイトロゴのスライド（slick js使用）*/
.information .portal-logo-slide{
  width:100%;
}
.information .portal-logo-slide .slick-slider{
  padding-left:0;
}
.information .portal-logo-slide .slick-slider .slick-track{
  display: flex;
  align-items: center;
}
.information .portal-logo-slide .slick-slider li{
  text-align:center;
  height:5.5rem;
  margin:0 5rem;
  width:auto !important;
}
.information .portal-logo-slide .slick-slider li img{
  display:inline;
  height: 100%;
  width: auto;
  max-width: unset;
}
.information .portal-logo-slide .slick-slider li.andmore .flex-parents{
  height:100%;
  white-space:nowrap;
}
@media screen and (max-width:991px){
.information .portal-logo-slide .slick-slider li{
  height:4rem;
  margin:0 3vw;
  }
}
@media screen and (max-width:480px){
.information .portal-logo-slide .slick-slider li{
  height:9vw;
  margin:0 5vw;
  }
}

.information .container-two{
  margin-top:7rem;
}
.information .portalsite{
  text-align:center;
}
.information .portalsite h2{
  border-top:1px solid #707070;
  border-bottom:1px solid #707070;
  font-size: 2.5rem;
  padding:2rem 0;
  position:relative;
  margin-bottom:3rem;
}
.information .accordion .accordion-switch::before{
  color:#c70100;
  font-size:3.3rem;
  top:23%;
  left:3rem;
  right:unset;
}
.information .accordion .accordion-openarea{
  padding:1rem;
  padding-bottom:5rem;
  border-bottom:1px solid #707070;
}
@media screen and (max-width:991px){
  .information .accordion .accordion-switch{
    padding-left:3rem;
  }
}
@media screen and (max-width:768px){
  .information .portalsite h2{
    font-size:4vw;
  }
}
@media screen and (max-width:480px){
  .information .portalsite h2{
    font-size:5vw;
  }
}

.information .portalsite p{
  margin-bottom:1.5rem;
}
.information .portalsite h3{
  margin-top:3rem;
  background:#F2F2F2;
  padding:1.5rem 0;
}
.information .portalsite h3+p{
  margin-top:2rem;
}
.information .portalsite h3+p.attention{
  margin-top:0;
}

.bg-angle {
  background-image: linear-gradient(100deg, #4527a0 0%, #1976d2 100%);
  max-height: 700px;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  overflow: hidden;
}
.bg-angle:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-top: 200px solid transparent;
  border-left: 1900px solid #fff;
  border-bottom: 0px solid transparent;
}


/* ===== Features ===== */
.featured{
  margin-top:3rem;
}
.featured .section-title .title{
  display:inline-block;
  letter-spacing:1.5rem;
  padding-bottom:1rem;
  position:relative;
}
.featured .section-title .title .underline:after{
  display: block;
  content: "";
  border-bottom:3.5px solid #C70100;
  position:absolute;
  width:100%;
  left:-0.7rem;
  bottom:0;
}

.featured .feature-icons-list{
  align-items: stretch;
  gap:2rem;
  justify-content:center;
  flex-wrap:wrap;
}
.featured .feature-icons-list .saaspik-icon-box-wrapper{
  width:31%;
  background:#F2F2F2;
  padding:2.5rem 3.5rem;
  margin: 0;
}
.featured .feature-icons-list .saaspik-icon-box-wrapper h3{
  font-weight:bold;
}
.featured .saaspik-icon-box-icon img{
  max-height:55px;
}
@media screen and (max-width:768px){
  .featured .feature-icons-list{
    align-items: flex-start;
    flex-direction: column;
  }
  .featured .feature-icons-list .saaspik-icon-box-wrapper{
    width:100%;
  }
}

.featured .feature-info{
  margin-top:7rem;
}
.featured .feature-info .title{
  font-size:3rem;
  line-height:1.5;
}
.featured .feature-info.info01 .title{
  color:#C70100;
  margin-bottom:3rem;
}

.featured .feature-info-box{
  border:3px solid #000;
  border-radius:10px;
  padding:2rem;
  gap:1rem;
  justify-content:space-between;
  box-shadow:2px 3px 4px rgb(0, 0, 0, .2);
}
.featured .feature-info-box .title{
  line-height:1.4;
  font-size:2.8rem;
  display:flex;
  align-items:center;
  gap:0.5rem;
  margin-bottom:1rem;
  white-space:nowrap;
  text-align:left;
}
.featured .feature-info-box.info-box01 p.middle{
  font-size:2rem;
}
.featured .feature-info-box.info-box02 .big{
  font-size: 4.5rem;
  color: #C70100;
  white-space: nowrap;
  margin-top:1rem;
  margin-bottom:2rem;
  line-height:1;
}
.featured .feature-info-box .info-box-img{
  width:16rem;
}
.featured .feature-info-box .info-box-img:last-of-type{
  width:12rem;
}
.featured .feature-info-arrow{
  margin:3rem 0;
}
.featured .feature-info-box.info-box02{
  border-color:#C70100;
}
.featured .feature-info-box.info-box02 .info-box-img:first-of-type{
  width:19rem;
}
.featured .feature-info-box.info-box02 .info-box-img:last-of-type{
  width:14rem;
}
.featured .feature-info-box.info-box02 img.lblogo{
  width:26rem;
}
.featured .feature-info-box .attention{
  line-height:1.5;
}
@media screen and (max-width:991px){
  .featured .feature-info p{
    text-align:left;
  }
  .featured .feature-info-box .info-box-img{
    width:13rem;
  }
  .featured .feature-info-box .info-box-main{
    width:41rem;
  }
  .featured .feature-info-box .info-box-img:last-of-type{
    width:9rem;
  }
  .featured .feature-info-box.info-box01 .title{
    white-space:normal;
  }
  .featured .feature-info-box.info-box02 .info-box-img:first-of-type{
    width:15rem;
  }
  .featured .feature-info-box.info-box02 .info-box-main{
    width:38rem;
  }
  .featured .feature-info-box.info-box02 .title{
    display:inline;
  }
  .featured .feature-info-box.info-box02 img.lblogo{
    width:18rem;
    vertical-align:bottom;
  }
  .featured .feature-info-box.info-box02 .big{
    font-size:4rem;
    line-height:1.2;
    text-align:center;
  }
  .featured .feature-info-box.info-box02 .info-box-img:last-of-type{
    width:10.5rem;
  }
}
@media (max-width:768px){
  .featured .feature-info-box{
    flex-wrap:wrap;
    justify-content:center;
  }
  .featured .feature-info-box .info-box-img:first-of-type{
    order:1;
  }
  .featured .feature-info-box .info-box-img:last-of-type{
    order:2;
  }
  .featured .feature-info-box .info-box-main{
    order:3;
    width:80%;
  }
  .featured .feature-info-box.info-box02 .info-box-img:first-of-type{
    width:14rem;
    margin-bottom:1rem;
  }
  .featured .feature-info-box.info-box02 .big{
    white-space:normal;
  }
}

/* =====  ===== */