/* =============================================
 bxslider CUSTOM
============================================= */
/* photo */
.bxslider li.bx_photo1{background-image: url("../img/mvbg01.jpg");}
.bxslider li.bx_photo2{background-image: url("../img/mvbg02.jpg");}
.bxslider li.bx_photo3{background-image: url("../img/mvbg03.jpg");}
.bxslider li{
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    /*border-top-left-radius: 45px;*/
}

@media print, screen and (max-width:768px) {
  .bxslider li{
    background-position: bottom right;
    border-top-left-radius: 0;
  }
  .bxslider li.bx_photo2{background-image: url("../img/mvbg02_sp.jpg");}
}

/* 縦100% */

.bx-viewport, .bx-wrapper {
    position:relative;
    width:100%;
    height:100% !important;
    top:0;
    left:0;
}

.bxslider, .bxslider li{
    height: 100% !important;
}

.bx-wrapper .bx-viewport{
    border: none !important;
}

/* 画像 横100% */
.bxslider img{
  width: 100% !important;
  height: auto !important;
}

/* 白枠、シャドウ削除 */
.bx-wrapper {
  margin: 0 !important;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  border: none !important;
  background: none !important;
}

/* 配置
.main_visual {
  padding-left:0;
}

@media print, screen and (max-width:1532px) {
  .main_visual  {
    padding-left:0;
  }
}


@media print, screen and (max-width:768px) {
  .main_visual {
    padding-left:0;
  }
}*/

/* ページネーション */
.bx-default-pager {
  display:none;
  position:relative;
  /*top:650px;
  left:0;*/
  padding-bottom:125px; /* MV下部からのパディング */
}

.bx-wrapper .bx-pager.bx-default-pager a {
  background: #FFF;
}

.bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus, .bx-wrapper .bx-pager.bx-default-pager a:hover
{
 background: #E8D608;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover {
  background: #E8D608;
}

.bx-wrapper .bx-pager-item {
  margin-top:4px;
  display: inline-block;
}

@media print, screen and (max-width:768px) {
  .bx-default-pager {
     padding-bottom:70px;
  }
   .bx-wrapper .bx-pager-item {
    margin-left:10px;
  }

  .bx-wrapper .bx-pager.bx-default-pager a {
    width:10px;
    height:10px;
    border-radius: 5px;
  }
}


/* =============================================
 HERO AREA
============================================= */
#hero_area{
    position:relative;
    width:100%;
    height:100%;
    /*top:0;
    left:0;*/
}
@media print, screen and (max-width:768px) {
#hero_area{
    top:0;
    bottom:0;
}
}

/* 大見出し ====================== */
.main_copy{
  position: absolute;
  max-width: 1500px;
  height:75%;
  color:#292929;
  z-index: 988;
  top: 0; right: 0; bottom: 0; left: 0; /*中央寄せ*/
  margin: auto; /*中央寄せ*/
    /* width: 640px;
    height: 220px;
    margin-top:12%;
    margin-left:10%;*/
}

.main_copy dl {margin:0;padding:0;}
.main_copy dt {width:236px;margin:0 0 50px 0;padding:11px 15px;font-size:16px;font-weight:600;text-align:center;line-height:100%;letter-spacing:0.5em;color:#FFF;
    background: #0089E9; /* fallback for old browsers */
    background: -webkit-linear-gradient(left, #0089E9 0% 40%, #38C3D7 60% 100%);
    background: linear-gradient(to left, #0089E9 0% 40%, #38C3D7 60% 100%);
}
.main_copy dt span {font-size:27px;font-family: 'Montserrat';}
.main_copy dd {margin:0 0 30px 0;padding:0;font-size:18px;font-weight:500;letter-spacing:-0.05em;}
.main_copy dd span {
    background: #0089E9; /* fallback for old browsers */
    background: -webkit-linear-gradient(left, #0089E9 0% 40%, #38C3D7 60% 100%);
    background: linear-gradient(to left, #0089E9 0% 40%, #38C3D7 60% 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.main_copy dd a {
    width:35%;padding:1em;
    display:block;
    letter-spacing:0.2em;
    text-align:center;
    color:#FFF;
    border-radius: 40px;
    background: #0089E9; /* fallback for old browsers */
    background: -webkit-linear-gradient(left, #0089E9 0% 40%, #38C3D7 60% 100%);
    background: linear-gradient(to left, #0089E9 0% 40%, #38C3D7 60% 100%);
}
.main_copy dd a:hover {text-decoration:none;opacity: 0.6; transition: 0.2s;}
.main_copy ul {display:flex;list-style: none;margin:0;padding:0;}
.main_copy li {background:#FFF;border:3px solid #0089E9;color:#0089E9;font-size:21px;font-weight:500;letter-spacing:0.1em;opacity: 0.7;border-radius: 100%;width:180px;height:180px;text-align:center;padding-top:70px;margin:20px 20px 0 0;}


@media print, screen and (max-width:768px) {
  .main_copy {height:65%;}
  .main_copy dt {width:180px;margin:0 0 30px 0;padding:11px 15px;font-size:12px;}
  .main_copy dt span {font-size:20px;}
  .main_copy dd {font-size:14px;}
  .main_copy dd.font45 {font-size:30px !important;font-weight:600;}
  .main_copy dd a {width:60%;}
  .main_copy li {font-size:16px;width:140px;height:140px;padding-top:55px;margin:10px 10px 0 0;}
}

img[src$=".svg"] {
    width: 100%;
}



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


#feature {background:#F2F8FB;padding:30px 0 80px 0;}
#operation {background:#FFFFFF;padding:0 0 30px 0;}
#flow {background:#269CEB;padding:50px 0 30px 0;}
#about {background:#FFFFFF;}
#function {background:#F2F8FB;padding:50px 0 100px 0;}
#plan {background:#FFFFFF;padding:0 0 30px 0;}
#aboutus {background:#F2F8FB;padding:50px 0;}
#qa {background:#FFFFFF;}

@media print, screen and (max-width:768px) {
    #feature {padding:20px 0 60px 0;}
    #operation {margin-top:10px !important;}
    #flow {padding:30px 0 30px 0;}
    #about {margin-top:10px !important;}]
    #function {padding:20px 0 60px 0;}
    #plan {margin-top:10px !important;}
    #aboutus {padding:30px 0;}
    #qa {margin-top:10px !important;}
}

#do_trial {
    background: #0089E9; /* fallback for old browsers */
    background: -webkit-linear-gradient(left, #0089E9 0% 40%, #38C3D7 60% 100%);
    background: linear-gradient(to left, #0089E9 0% 40%, #38C3D7 60% 100%);
    font-size: 30px;
    text-align: center;
    position: relative;
    font-weight:500;
}
#do_trial p {
    margin-bottom:0;
}
#do_trial a {color:#FFF;width:100%; height:100%;display:block;padding:50px;}
#do_trial a:hover {text-decoration: none;opacity: 0.6; transition: 0.2s;}
#do_trial::before {
   content: "";
   color: #08A0DC;
   width: 335px;
   height: 73px;
   background:url(../img/baloon.png) no-repeat;
   position: absolute;
   font-weight:bold;
   font-size: 18px;
   top:-20px;
   left:0;
   right:0;
   margin: auto;
}
#do_trial span {border:2px solid #FFF;padding:0 5px;border-radius: 100%;}

.do_trial_bnr { font-size: 20px; text-align: center; position: relative;font-weight:500;}
.do_trial_bnr a {
    background: #0089E9; /* fallback for old browsers */
    background: -webkit-linear-gradient(left, #0089E9 0% 40%, #38C3D7 60% 100%);
    background: linear-gradient(to left, #0089E9 0% 40%, #38C3D7 60% 100%);
    color:#FFF;
    width:100%;
    height:100%;
    display:block;
    padding:20px;
    border-radius: 50px;
}
.do_trial_bnr a:hover {text-decoration: none;opacity: 0.6; transition: 0.2s;}

#do_trial_foot {
    background: #0089E9; /* fallback for old browsers */
    background: -webkit-linear-gradient(left, #0089E9 0% 40%, #38C3D7 60% 100%);
    background: linear-gradient(to left, #0089E9 0% 40%, #38C3D7 60% 100%);
    font-size: 30px;
    text-align: center;
    position: relative;
    padding:80px;
    font-weight:500;
}
#do_trial_foot a {color:#FFF;width:55%; display:block;margin:0 auto;padding:40px;border:4px solid #FFF;border-radius: 70px;}
#do_trial_foot a:hover {text-decoration: none;opacity: 0.6; transition: 0.2s;}
#do_trial_foot span {border:2px solid #FFF;padding:0 5px;border-radius: 100%;}

@media print, screen and (max-width:768px) {
  #do_trial {font-size: 26px;}
  #do_trial a {padding:50px 10px;}
  #do_trial_foot {font-size: 24px;}
  #do_trial_foot {padding:60px 2%;}
  #do_trial_foot a {width:96%;padding:30px 15px;}
}



.top_column {letter-spacing:0em;position:relative;overflow:hidden;padding-right:10px;padding-left:10px;padding-bottom:20px;}
.top_column dl {background:#FFF;height:100%;padding:20px 20px 10px 20px;box-shadow:0 0 8px 0 rgba(0, 0, 0, .1);}
.top_column dt {margin:0 0 15px 0;padding:0;font-size:22px;color:#292929;text-align:center;}
.top_column dd {margin:0;padding:0;font-size:15px;color:#292929;position: relative;display: block;}
.top_column dd a {text-align:center;display: block;}
.top_column dd a:link,.top_column dd a:visited {color:#0089E9 !important;}
.top_column dl.color1 {background:#9ECCDA;border:none;border-radius:20px;padding-bottom:0;}
.top_column dl.color2 {background:#D0DD70;border:none;border-radius:20px;padding-bottom:0;}
.top_column dl.color3 {background:#DBBFE0;border:none;border-radius:20px;padding-bottom:0;}
.top_column dl.color4 {background:#F6D375;border:none;border-radius:20px;padding-bottom:0;}
.top_column dl.color5 {background:#BDECD8;border:none;border-radius:20px;padding-bottom:0;}
.top_column dl.color6 {background:#EAEAEA;border:none;border-radius:20px;padding-bottom:0;}
.top_column dl.color7 {background:#FFCBDC;border:none;border-radius:20px;padding-bottom:0;}
.top_column dl.color8 {background:#CDDDFD;border:none;border-radius:20px;padding-bottom:0;}
.top_column dl.color1 dt,.top_column dl.color2 dt,.top_column dl.color3 dt,.top_column dl.color4 dt,.top_column dl.color5 dt,.top_column dl.color6 dt,.top_column dl.color7 dt,.top_column dl.color8 dt {font-size:17px !important;}

.top_column label{
    margin: 2px 15%;
    padding-left: 20px;
    position: relative;
    font-weight:normal;
}
.top_column label::before{
    box-sizing: border-box;
    content: '\f00c';
    display: block;
    color:#0089E9;
    font-family: "Font Awesome 5 Free";
    height: 52px;
    position: absolute;
    left: 0;
    top: 0;
    font-weight:bold;
}

@media print, screen and (max-width:768px) {
    .top_column dl {padding:20px 10px 10px 10px;}
    .top_column label{margin: 2px 12%;}
}

.img_ope {position: relative;}
.img_ope::after {content:"";position: absolute;width:159px;height:228px;right:-50px;bottom:-50px;background:url(../img/operation_img.png) no-repeat;}

@media print, screen and (max-width:768px) {
    .img_ope::after {display:none;}
}

.img_flow {padding:30px;background:#FFF;border:1px solid #CCC;}

.clo_about {margin-bottom:30px;position:relative;}
.clo_about_no {
    width:80px;
    color:#FFF;
    text-align:center;
    font-size:8px;
    font-family: 'Montserrat';
    letter-spacing:0.05em;
    line-height: 16px;
    margin:0 0 0 20px;
    padding:23px 0 12px 0;
    position:relative;
    background: #0089E9; /* fallback for old browsers */
    background: -webkit-linear-gradient(top, #0089E9 0% 40%, #3FC5DA 60% 100%);
    background: linear-gradient(to top, #0089E9 0% 40%, #3FC5DA 60% 100%);
    z-index:50;
}
.clo_about_no span {font-size:35px;font-weight:500;letter-spacing:0.1em;}
.clo_about_img {width:510px;height:366px;position:relative;margin-top:-50px;z-index:40;}
.clo_about_txt {height:366px;border:1px solid #CFD6D9;position:relative;margin-top:-340px;margin-left:40px;z-index:30;}
.clo_about_txt dt {margin-top:40px;margin-left:520px;margin-bottom:20px;font-size:26px;color:#0089E9;}
.clo_about_txt dd {margin-left:520px;margin-bottom:40px;font-size:16px;line-height:200%;}
.clo_about_txt label{
    padding-left: 30px;
    position: relative;
    font-weight:normal;
}
.clo_about_txt label::before{
    box-sizing: border-box;
    content: '\f00c';
    display: block;
    color:#0089E9;
    font-family: "Font Awesome 5 Free";
    height: 52px;
    position: absolute;
    left: 0;
    top: 0;
    font-weight:bold;
}

@media print, screen and (max-width:768px) {
  .clo_about_img {width:100%;height:auto;margin-top:-50px;}
  .clo_about_txt {height:auto;margin-top:0px;margin-left:0px;}
  .clo_about_txt dt {margin-top:20px;margin-left:20px;font-size:26px;}
  .clo_about_txt dd {margin-bottom:20px;margin-left:20px;}
}




.wrap{
  margin:40px 0 30px 0;
}
table {
  border-collapse: collapse;
  margin: 23px 0 0 0;
  padding: 0;
  width: 100%;
  min-width:900px;
  table-layout: fixed;
}
thead th{
  padding: 1em 1.2em;
  border-right: 1px solid #E1E7E9;
  border-bottom: 1px solid #E1E7E9;
}
table tr {
  background-color: #fff;
  padding: .35em;
}
table tr:nth-child(even){
  background-color: #F2F8FB;
}
table td {
  padding: .7em;
  font-size: 16px;
  font-weight:600;
  text-align: center;
  border-top :1px solid #E1E7E9;
  border-right: 1px solid #E1E7E9;
  border-bottom: 1px solid #E1E7E9;
}
table th {
  font-size: 16px;
  font-weight:600;
}
i{
  font-size: 16px;
}
.plan1{
  background: #0089E9;
  line-height:220%;
  position: relative;
}
.plan1::before{
    content: 'FREE';
    display: block;
    color:#FFF;
    font-family: "Montserrat";
    width:100%;
    height: 23px;
    line-height: 23px;
    position:absolute;
    background: #007ED6;
    text-align: center;
    border-bottom: 1px solid #E1E7E9;
    left: 0;
    top: -23px;
    font-weight:500;
}
.plan1_i{
  color:#0089E9;
}
.plan5{
  background: #F97916;
}
.plan5_i{
  color:#F97916;
}
.plan6{
  background: #21d7de;
}
.plan6_i{
  color:#2bd7de;
}
.plan4{
  background: #F9AC22;
}
.plan4_i{
  color:#EF9900;
}
.plan3{
  background: #48C9A0;
}
.plan3_i{
  color:#2CA982;
}
.plan2{
  background: #20C9D0;
}
.plan2_i{
  color:#14AFB5;
}
.price{
  color: #fff;
  font-weight: 600;
  font-size: 16px;
  text-align: center;
  margin-bottom:10px
}
.price span {
    font-size: 24px;
    font-family: 'Montserrat';
    letter-spacing:0.05em;
}
.btn{
  background:#fff;
  color:#000;
  padding: 5px;
  display:block;
  border-radius: 0;
  text-decoration:none;
  font-size:14px;
}

@media screen and (max-width: 991px) {
  .wrap{
     overflow-x: scroll;
  }
}


.plan_txt1 {
    background: #0089E9; /* fallback for old browsers */
    background: -webkit-linear-gradient(left, #0089E9 0% 40%, #38C3D7 60% 100%);
    background: linear-gradient(to left, #0089E9 0% 40%, #38C3D7 60% 100%);
    font-size: 32px;
    line-height:130%;
    color:#FFF;
    text-align: center;
    position: relative;
    border-radius: 10px;
    padding:30px;
    font-weight:500;
}
.plan_txt2 {
    font-size: 18px;
    text-align: center;
    position: relative;
    border:1px solid #D9DEDF;
    border-radius: 10px;
    padding:30px;
    font-weight:500;
}
.plan_txt2 label{padding-left: 50px;position:relative;}
.plan_txt2 label::before{
    box-sizing: border-box;
    content: '\f00c';
    display: block;
    color:#FFF;
    background:#0089E9;
    font-family: "Font Awesome 5 Free";
    width: 30px;
    height: 30px;
    border-radius: 100%;
    position: absolute;
    left: 0;
    top: 0;
    font-weight:bold;
}

@media screen and (max-width: 768px) {
    .plan_txt1 { padding:30px 15px; }
    .plan_txt2 label::before {line-height:30px;}
}


.aboutus1 {width:60%;margin-top:30px;margin-left:30%;background:#269CEB;position:relative;}
.aboutus1 dl {color:#FFF;width:60%;margin-left:35%;padding:30px;}
.aboutus1 dt {font-size:22px;line-height:150%;}
.aboutus1 dd {font-size:16px;line-height:200%;}
.aboutus1::after {
   content: "";
   display:inline-block;
   width:85%;
   height:472px;
   background:url(../img/aboutus_img1.jpg) no-repeat left top;
   background-size:contain;
   position:absolute;
   top:-30px;
   left:-50%;
}
.aboutus2 {width:60%;margin-top:30px;margin-left:10%;background:#269CEB;position:relative;}
.aboutus2 dl {color:#FFF;width:60%;margin-left:0%;padding:30px;}
.aboutus2 dt {font-size:22px;line-height:150%;}
.aboutus2 dd {font-size:16px;line-height:200%;}
.aboutus2::after {
   content: "";
   display:inline-block;
   width:85%;
   height:472px;
   background:url(../img/aboutus_img2.jpg) no-repeat right top;
   background-size:contain;
   position:absolute;
   top:-30px;
   right:-50%;
}
.aboutus3 {width:60%;margin-top:30px;margin-left:30%;background:#269CEB;position:relative;}
.aboutus3 dl {color:#FFF;width:60%;margin-left:35%;padding:30px;}
.aboutus3 dt {font-size:22px;line-height:150%;}
.aboutus3 dd {font-size:16px;line-height:200%;}
.aboutus3::after {
   content: "";
   display:inline-block;
   width:85%;
   height:472px;
   background:url(../img/aboutus_img3.jpg) no-repeat left top;
   background-size:contain;
   position:absolute;
   top:-30px;
   left:-50%;
}
.aboutus4 {width:60%;margin-top:30px;margin-left:10%;background:#269CEB;position:relative;}
.aboutus4 dl {color:#FFF;width:60%;margin-left:0%;padding:30px;}
.aboutus4 dt {font-size:22px;line-height:150%;}
.aboutus4 dd {font-size:16px;line-height:200%;}
.aboutus4::after {
   content: "";
   display:inline-block;
   width:85%;
   height:472px;
   background:url(../img/aboutus_img4.jpg) no-repeat right top;
   background-size:contain;
   position:absolute;
   top:-30px;
   right:-50%;
}
.aboutus3 dd a,.aboutus4 dd a {border:2px solid #fff;text-align:center;font-size:14px;padding:15px 30px;border-radius:40px;color:#FFF;}


@media print, screen and (max-width:991px) {
  .aboutus1 {width:90%;margin-left:5%;}
  .aboutus1 dl {width:100%;margin-left:0%;padding-top:50%;}
  .aboutus1::after {width:100%;left:-6%;}

  .aboutus2 {width:90%;margin-left:5%;}
  .aboutus2 dl {width:100%;margin-left:0%;padding-top:50%;}
  .aboutus2::after {width:100%;right:-6%;}
    
  .aboutus3 {width:90%;margin-left:5%;}
  .aboutus3 dl {width:100%;margin-left:0%;padding-top:50%;}
  .aboutus3::after {width:100%;left:-6%;}

  .aboutus4 {width:90%;margin-left:5%;}
  .aboutus4 dl {width:100%;margin-left:0%;padding-top:50%;}
  .aboutus4::after {width:100%;right:-6%;}
}

@media print, screen and (max-width:768px) {
    .aboutus1 dt,.aboutus2 dt,.aboutus3 dt,.aboutus4 dt {font-size:20px;}
}


.acd-label{ font-size:18px;padding: 20px 20px 20px 75px;background:#F2F8FB;border-radius:10px;position: relative;}
.acd-label::before { content:'Q';font-size:20px;background:#0089E9;color:#FFF;width:34px;height:34px;padding:2px 9px;border-radius: 100%;font-family: 'Montserrat';font-weight:500;position: absolute;left:20px;top:20px;}

.acd-content{ font-size:16px;padding: 0 20px;margin-bottom: 20px;}
.acd-content p {padding-left:55px;position: relative;}
.acd-content p::before { content:'A';font-size:20px;background:#17C7C8;color:#FFF;width:34px;height:34px;padding:3px 10px;border-radius: 100%;font-family: 'Montserrat';font-weight:500;position: absolute;left:0;top:0;}

@media print, screen and (max-width:768px) {
    .acd-content p {padding-bottom:30px;}
    .acd-label::before {line-height:28px;}
    .acd-content p::before {line-height:28px;}
}


#f_contact {text-align:center;font-size:19px;}

.to_zero {border:1px solid #B1B1B1;text-align:center;font-size:14px;margin-top:30px;padding:20px;border-radius:40px;}
.to_zero a {width:100%;display:block;}
.to_zero a:link,.to_zero a:visited {color:#858585;}




/* scroll-header ====================== */

.fix-header {
	width: 100%;
	top: -110px;
	left: 0;
	position: fixed;
	opacity:0;
	z-index:999999;
}
.fix-header #head {
	width: 100%;
	position:relative;
	top:auto;
}
.fix-header #gl_nav {
	width: 100%;
	position:relative;
	top:auto;
    background:#02153F;
}