*{
  /* font-family: a-otf-ud-shin-go-pr6n, sans-serif!important; */
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  font-style: normal;
}
.loader-base{
background-color: #fff;
position:absolute;
top: 0;
left:0;
width: 100%;
height: 100%;
z-index: 50;
}

.swiper{
  position: relative;
  overflow: hidden;
}
.swiper-slide img{
  display: block;
  width: 100%;
}
.swiper-button-next{
background: url(../img/icon_direct.png) no-repeat;
text-indent: -9999px;
right: -20px!important;
transform: translate(50%,0);
filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.2));
}
.swiper-button-prev{
  background: url(../img/icon_direct.png) no-repeat;
  text-indent: -9999px;
  left: -20px!important;
  transform: translate(-50%,0) rotate(-180deg);
  filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.2));

  }
/* ページネーション */
.swiper-pagination{
  bottom: -35px!important;
}
.swiper-pagination-bullet{
  width: 12px!important;
  height:12px!important;
  filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.2));
}
.swiper-pagination-bullet-active{
  background: #f00!important;
}

h2{
  font-weight: 800!important;
}

.wrapper{
  overflow: hidden;
  width: 100%;
}


.content-area{
  position:relative;
  overflow: hidden;
}

.content-area__inner{
  padding:0;

}

.container{
  width:1200px;
  margin: auto;
  position: relative;
}

.hero-section{
  padding:150px 0px;
  margin-bottom:100px;
}
.hero-section .container .img-bg{
  /* content:"";
  background:url(../img/img_bgicon.png) center center no-repeat;
  background-size:100%; */
  display: block;
  width: 1620px;
  position: absolute;
  top:0%;
  left:50%;
  transform: translate(-50%,0%);
  z-index: 0;
}
.hero-section .container .img-circle-left{
  display: block;
  width: 956px;
  position: absolute;
  top:-140%;
  left:-60%;
  z-index: 0;
}
.hero-section .container .img-circle-right{
  display: block;
  width: 956px;
  position: absolute;
  top:16%;
  right:-75%;
  z-index: 0;
}
.hero-logo{
  display: block;
  position: relative;
  z-index: 5;
  margin: 0 auto 5%;
  width:26%;
}
.hero-catch{
  display: block;
  position: relative;
  z-index: 5;
  margin:0 auto 4%;
}
.hero-state{
  display: block;
  position: relative;
  font-size: 24px;
  z-index: 5;
  text-align: center;
  margin:0 auto 1%;
  width:48%;
  border-bottom:1px solid #999 ;
}
.hero-state img{
  height: 34px;
  display: block;
  margin:0px auto 10px;
}
.hero-link{
  display: flex;
  flex-wrap: wrap;
  position: relative;
  z-index: 5;
  margin: auto;
  width:50%;
}
.hero-link li{
  display: block;
  position: relative;
  z-index: 5;
  margin: auto;
  width:40%;
}
.hero-link li.qr{
  width:14%;
}
.hero-link li img{
width: 100%;
}
.hero-sns{
  text-align: center;
  margin:3% auto 0;
}
.hero-sns a{
  color: #d70c19;
  padding: 0.5em 2em;
  border-radius: 10px;
  border:1px solid #d70c19;
  margin-right:5px;
  display: inline-block;
  position: relative;
  z-index:1;
}
.hero-banner{
  text-align: center;
  margin:3% auto 0;
  display: flex;
  justify-content: center;
}
.hero-banner a{
  position: relative;
  z-index:1;
  width:400px;
  display: block;
  border:1px solid #d70c19;
}
.hero-banner img{
  width:100%;
  display: block;
}


/* sectionのデフォルトスタイル */

.section-style{

}
.section-style .container{
position: relative;
}
.section-style .flex-block{
  display: flex;
  align-items: center;
  padding-left: 5%;
}
.section-style .flex-block__phone{
  text-align: center;
  width: 320px;
  padding:12px 17px;
  background: url("../img/img_smartphone.png") no-repeat;
  background-size: contain;
  position: relative;
  z-index: 10;
}
.section-style .flex-block__phone .swiper{
  border-radius:30px;
}
.section-style .flex-block__text{
  text-align: center;
  width:60%;
}
.section-style .flex-block__text h3 img{
  height: 50px;
}
.section-style .flex-block__text h4{
  font-size: 25px;
  font-weight: 700;
}
.section-style .flex-block__text p{
  margin-top: 1.5em;
}

/* news */

.function-news-section .container .img-circle{
  display: block;
  width: 956px;
  position: absolute;
  top:-5%;
  left:-55%;
  z-index: 0;
}

/* mission */

.function-mission-section .container .img-circle{
  display: block;
  width: 956px;
  position: absolute;
  top:-5%;
  right:-55%;
  z-index: 0;
}

/* present book */

.function-presentbook-section .container .img-circle{
  display: block;
  width: 956px;
  position: absolute;
  top:-5%;
  left:-55%;
  z-index: 0;
}

/*  */

.present-list{
background-color: #f1f1f1;
padding:100px 0 60px;
margin:-60px auto 0;
pointer-events: none;
}
.present-list h3{
text-align: center;
font-weight: 700;
line-height: 1.4;
font-size:26px;
margin:0 0 1em;
}

.present-list h3 strong{
  color:#d70c19;
  font-weight: 700;
}
.swiper-present-list{
  width:1200px;
  margin: auto;
  overflow: visible!important;
}
.swiper-present-list .swiper-wrapper{
  transition-timing-function: linear;
  overflow: visible;
}
.swiper-present-list .swiper-slide{
  align-items: center;
}
.swiper-present-list .swiper-slide img{
  display: block;
  margin:0 auto;
}

/* service-link */

.service-link-section{
  padding:150px 0;
  margin-top:160px;
  position: relative;
  border-top:1px solid #ddd;
}
.service-link-section__list{

  width: 1100px;
  padding:0 50px;
  margin: auto;
}
.service-link-section__item{
  width: 100%;
  display: flex;
  margin-bottom:60px;
  align-items: flex-start;
}
.service-link-section__item .item-thumb{
  display: block;
  border: 1px solid #ddd;
  border-radius: 20px;
  width:30%;
  overflow: hidden;
  box-shadow: 0 0 10px rgb(0,0,0,0.2);
}
.service-link-section__item .item-thumb img{
  display: block;
  width:100%;
}
.service-link-section__item .item-text{
  padding-left:2em;
  box-sizing: border-box;
  width:68%;
}
.service-link-section__item .item-text h4{
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom:0.5em;
}
.service-link-section__item .item-text p{
  line-height: 1.6;
}
.service-link-section__item .item-text .btn{
  display: inline-block;
  padding:0.3em 2em;
  margin-top: 0.8em;
  background-color: #d70c19;
  border-radius: 10px;
  font-size: 95%;
  color:#fff;
}

.service-link-section .img-circle{
  display: block;
  width: 956px;
  position: absolute;
  top:200px;
  right:-600px;
  /* transform: translate(50%,0); */
  z-index: 0;
}


/*  */

.product-section{
  background:#d70c19;
  color:#fff;
  padding:100px;
  z-index: 10;
  position: relative;
}
.product-section .container{
  width:900px;
}

.product-section .product-section-data{
  width:700px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.product-section .product-section-data li{
  width:49.5%;
  padding:0.5em 0;
  border-bottom:1px solid #fff ;
}
.product-section .product-section-data li:first-child{
  width:100%;

}
.product-section .product-section-data h5{
  color:#ffbdbd;
}

.product-section__applink{
  display: flex;
  width:600px;
  margin:60px auto 0;
  justify-content: space-between;
}
.product-section__applink li{
  display: block;
  width: 49%;
}
.product-section__applink li img{
  display: block;
  width:100%;
}

.product-section__linklist{
  margin-top:60px;
  display: flex;
  justify-content: center;
}
.product-section__linklist a{
  color: #fff;
  padding: 0.5em 2em;
  border-radius: 10px;
  border:1px solid #fff;
  margin-right:5px;
  display: block;
}

.product-section__linklist li:last-child a{
  margin-right:0px;
}

.product-section__rights{
  text-align: center;
  font-size: 90%;
  margin-top:8%;
  color:#ddd;
}

.anim-hover{
  transition:all 0.3s;
}

.anim-hover:hover{
  opacity: 0.7;
}
ul.asterisk{
  font-size:90%;
  color: #888;
}
ul.asterisk li::before{
  content:'※';
}
ul.asterisk li{
  text-indent:-1em;
  padding-left:1em;
}

.btn-scrolltop{
  position: fixed;
  bottom:20px;
  right:20px;
  z-index:100;
  width:60px;
}
.btn-scrolltop img{
  display: block;
  width: 100%;
}



/* ------------------- */
/* ------------------- */
/* ------------------- */
/* ------------------- */




@media (max-width:767px) {

  .wrapper{
    position: relative;
  }
  .section-style.flex-reverse .flex-block{
    flex-direction: column-reverse;
  }
  .container{
    width:100%;
  }

  /* hero */

  .hero-section{
    padding:20vw 0px;
    margin-bottom:10vw;
  }
  .hero-section:after{
    content:"";
    background:url(../img/img_bgicon_sp.png) center center no-repeat;
    background-size:100%;
    display: block;
    width: 100%;
    padding-top:100%;
    position: absolute;
    top:0%;
    left:0%;
    transform: translate(0%,0%);
    z-index: 0;
  }
  .hero-section .container .img-circle-left{
    width: 100vw;
    top:-180%;
    left:-60%;
  }
  .hero-section .container .img-circle-right{
    width: 100vw;
    top:16%;
    right:-85%;
  }
  .hero-logo{
    width:30vw;
  }
  .hero-catch{
    height:11vw;
  }
  .hero-state{
    font-size: 4vw;
    width:65%;
  }
  .hero-state img{
    height: 5vw;
    margin:0px auto 2vw;
  }
  .hero-link{
    width:70%;
    margin-top: 5vw;
  }
  .hero-link li{
    width:48%;
  }
  .hero-link li.qr{
    display: none;
  }
  .hero-link li img{
  width: 100%;
  }
  .hero-sns a{
    font-size:3vw;
  }
  .hero-banner{
    width:80%;
  }
  .hero-banner a{
    width:100%;
  }
  .hero-banner img{
    width:100%;
    display: block;
  }

  /* sectionのデフォルトスタイル */
  .section-style{
    margin-top: 15vw;
  }
  .section-style .flex-block{
    display: flex;
    flex-direction:column;
    padding-left: 0%;
  }
  .section-style .flex-block__phone{
    width: 50vw;
    padding:1.8vw 2.3vw;
    box-sizing: border-box;
  }
  .section-style .flex-block__phone .swiper{
    border-radius:4vw;
  }
  .section-style .flex-block__text{
    width:84%;
    margin-top:10vw;
  }
  .section-style .flex-block__text h3 img{
    height: 6vw;
    margin-bottom:2vw;
  }
  .section-style .flex-block__text h4{
    font-size: 4.5vw;
    line-height: 1.3;
  }
  .section-style .flex-block__text p{
    margin-top: 1.5em;
    text-align: left;
  }
  .section-style .flex-block__text p br{
    display: none;
  }

  /* news */

  .function-news-section .container .img-circle{
    width: 100vw;
    top:5vw;
    left:-55%;
  }

  /* mission */

  .function-mission-section .container .img-circle{
    width: 100vw;
    top:5vw;
    right:-55%;
  }

  /* present book */
  .function-presentbook-section .container .img-circle{
    width: 100vw;
    top:5vw;
    left:-55%;
  }

  /* present list */

  .present-list{
    padding:6vw 0;
    margin:8vw auto 0;
  }
  .present-list h3{
    font-size:3.8vw;
  }
  .swiper-present-list{
    width:100%;
    margin: auto;
    overflow: visible!important;
  }
  .swiper-present-list .swiper-wrapper{
    transition-timing-function: linear;
    overflow: visible;
  }
  .swiper-present-list .swiper-slide{
    align-items: center;
  }

  /* service-link */

  .service-link-section{
    position: relative;
    padding:20vw 0;
    margin-top:20vw;
    position: relative;
    border-top:1px solid #ddd;
    z-index: 10;
  }
  .service-link-section__list{
    width: 84%;
    padding:0;
  }
  .service-link-section__item{
    display: block;
    margin-bottom:13vw;
  }
  .service-link-section__item:last-child{
    margin-bottom:0;
  }
  .service-link-section__item .item-thumb{
    display: block;
    border: 1px solid #ddd;
    border-radius: 20px;
    width:90%;
    margin:auto;
  }
  .service-link-section__item .item-thumb img{
    display: block;
    width:100%;
  }
  .service-link-section__item .item-text{
    padding-left:0;
    width:100%;
    box-sizing: border-box;
    margin-top:4vw;
  }
  .service-link-section__item .item-text h4{
    font-size: 4vw;
    text-align: center;
  }
  .service-link-section__item .item-text p{
    line-height: 1.6;
  }
  .service-link-section__item .item-text .btn{
    display: block;
    margin: 1em auto 0;
    width: 60%;
    text-align: center;
  }

  .service-link-section .img-circle{
    display: block;
    width: 100vw;
    position: absolute;
    top:200px;
    right:-600px;
    /* transform: translate(50%,0); */
    z-index: 0;
  }


  /*  */

  .product-section{
    background:#d70c19;
    color:#fff;
    padding:15vw 13vw;
    z-index: 10;
    position: relative;
  }
  .product-section .container{
    width:100%;
  }

  .product-section .product-section-data{
    width:100%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .product-section .product-section-data li{
    width:100%;
    padding:0.5em 0;
    border-bottom:1px solid #ddd ;
    text-align: center;
  }
  .product-section .product-section-data li:first-child{
    width:100%;

  }
  .product-section .product-section-data h5{
    color:#ffbdbd;
  }

  .product-section__applink{
    display: flex;
    width:100%;
    margin:60px auto 0;
    justify-content: space-between;
  }
  .product-section__applink li{
    display: block;
    width: 49%;
  }
  .product-section__applink li img{
    display: block;
    width:100%;
  }

  .product-section__linklist{
    margin-top:60px;
    display: flex;
    justify-content: center;
  }
  .product-section__linklist a{
    color: #fff;
    padding: 0.5em 2em;
    border-radius: 10px;
    border:1px solid #fff;
    font-size: 3vw;
  }

  .anim-hover:hover{
    opacity: 1;
  }

  .btn-scrolltop{
    position: fixed;
    bottom:90px;
    right:15px;
    z-index:100;
    width:10vw;
  }

}
