@charset "UTF-8";

/*-- ALL ------------------------------
------------------------------------------*/
*{box-sizing:border-box;}
html{overflow-x:hidden;font-size:62.5%;}
body{font-family:"游ゴシック体", "Yu Gothic", YuGothic, sans-serif;font-size:18px;line-height:1.45;color:#000;font-weight:500;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;word-break:break-all;}
.mb0{margin-bottom:0!important}
.mb5{margin-bottom:5px!important}
.mb10{margin-bottom:10px!important}
.mb15{margin-bottom:15px!important}
.mb20{margin-bottom:20px!important}
.mb25{margin-bottom:25px!important}
.mb30{margin-bottom:30px!important}
.mb35{margin-bottom:35px!important}
.mb40{margin-bottom:40px!important}
.mb45{margin-bottom:45px!important}
.mb50{margin-bottom:50px!important}
.mb60{margin-bottom:60px!important}
.mb65{margin-bottom:65px!important}
.mb70{margin-bottom:70px!important}
.mb75{margin-bottom:75px!important}
.mb80{margin-bottom:80px!important}
.mb90{margin-bottom:90px!important}
.mb100{margin-bottom:100px!important}
.mb115{margin-bottom:115px!important}
.mb140{margin-bottom:140px!important}
.center{text-align:center;}
.txt_right{text-align: right;}
a{display: block;transition:all .2s;}
a:hover{opacity:.85;}
.hover:hover{opacity:.85}
.sp{display:none;}
.break_pc{display:block;}
.break_sp{display:contents;}
.txt_shadow{text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;}
p{margin:0 0 40px 0;font-size:18px;line-height:1.65;}
.mb0{margin-bottom:0;}
.lh_none{line-height:0}
.bold{font-weight:700;}
.highlight{background:-webkit-linear-gradient(transparent 50%,#f9ff9c 50%,#f9ff9c 80%,transparent 80%);background:-o-linear-gradient(transparent 50%,#f9ff9c 50%,#f9ff9c 80%,transparent 80%);background:linear-gradient(transparent 50%,#f9ff9c 50%,#f9ff9c 80%,transparent 80%);padding-bottom:5px;}
.highlight02{background:-webkit-linear-gradient(transparent 95%,#000 50%,#000 100%,transparent 0%);background:-o-linear-gradient(transparent 95%,#000 50%,#000 100%,transparent 0%);background:linear-gradient(transparent 95%,#000 50%,#000 100%,transparent 0%);padding-bottom:2px;}
:root{
  --grey: #f3f3f1;
  --purple: #563cfd;
  --green: #f6fbfb;
  --blue: #00adbe;
  --yellow: #e07f19;
  --green2: #42b5a9;
  --black: #020202;
  --white: #ffffff;
  --cl-text: #464851;
  --f-mincho: "ヒラギノ明朝 ProN","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","MS P明朝",MS PMincho,serif !important;
}
.lt-spa { letter-spacing: -2px; }
.lt-spa-1 { letter-spacing: -0.5px; }
.cl_green { color: var(--green2); }
.cl_white { color: var(--white); }
.cl_blue { color: var(--blue); }
.cl_yellow { color: var(--yellow); }
.size14 { font-size: 14px; }
.size15 { font-size: 15px; }
.size24 { font-size: 24px; }
.size30 { font-size: 30px; }
.size48 { font-size: 48px; }
.size60 { font-size: 60px; }
.f-mincho { font-family: var(--f-mincho); }
.fw-normal { font-weight: normal; }

.fc_blue{
  color: #00adbe;;
}

/*-- header --------------------------------
------------------------------------------*/
.sec_header{
  width: 100%;
  background: #fff;
  height: 80px;
  position: relative;
}
.sec_header:before{
  position: absolute;
  width: 100%;
  height: 11px;
  bottom: -11px;
  left: 0;
  right: 0;
  background: url(../images/shadow_h.png) repeat-x;
  content: "";
}
.sec_header h1{
  display: flex;
  align-items: center;
  height: 80px;
}
/*-- /header -------------------------------
------------------------------------------*/

/*-- fv ------------------------------------
------------------------------------------*/
.sec_fv{
  background: url(../images/fv_bg.jpg) no-repeat center;
  min-height: 880px;
}
/*-- /fv -----------------------------------
------------------------------------------*/

/*-- cta -----------------------------------
------------------------------------------*/
.cta{
  padding: 66px 0 56px 0;
}
.cta.bottom{
  padding: 106px 0 90px 0;
}
.cta .cta_box{
  background: #39adc0;
  padding: 10px;
  box-sizing: border-box;
  margin-bottom: 30px;
}
.cta .cta_box .bg_w_cta{
  background: #fff;
  padding: 30px 50px 25px 50px;
}
.cta .cta_box .cta_list{
  position: relative;
}
.cta .cta_box .cta_list img{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.cta .cta_box .cta_list ul{
  max-width: 520px;
  margin: 0 auto 0;
}
.cta .cta_box .cta_list ul li{
  font-size: 22px;
  background: url(../images/check.png) no-repeat center left, url(../images/border.png) repeat-x bottom;
  padding-left: 40px;
  margin-bottom: 17px;
  letter-spacing: -2px;
}
.cta .btn_cta{
  -webkit-box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.35);
  -moz-box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.35);
  box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.35);
  border-radius: 10px;
}
/*-- /cta ----------------------------------
------------------------------------------*/

/*-- sec01 ---------------------------------
------------------------------------------*/
.sec01{
  padding: 90px 0 96px 0;
  background: #225057 url(../images/pc_sec01_bg.jpg) no-repeat center top;
  position: relative;
}
.sec01 .sec01_list{
  max-width: 650px;
  margin-bottom: 67px;
}
.sec01 .sec01_list li{
  background: rgba(255, 255, 255, .8);
  font-size: 30px;
  display: flex;
  height: 80px;
  align-items: center;
  padding: 0 15px;
}
.sec01 .sec01_list li:not(:last-child){
  margin-bottom: 10px;
}
.sec01 .sec01_list li span{
  background: url(../images/dot.png) no-repeat left center;
  padding-left: 40px;
  letter-spacing: -1px;
  line-height:1.1;
}
.sec01 .sec01_box{
  background: #fff;
  padding: 40px 0 36px 0;
}
.sec01 .sec01_box .txt{
  font-size: 36px;
}
.sec01 .sec01_arr{
  position: absolute;
  bottom: -40px;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  z-index: 2;
}
/*-- /sec01 --------------------------------
------------------------------------------*/

/*-- sec02 ---------------------------------
------------------------------------------*/
.sec02{
  padding: 94px 0 80px 0;
  background: url(../images/pc_sec02_bg.png) no-repeat;
  position: relative;
  z-index: 1;
  background-size: cover;
}
.sec02_box{
  padding: 15px 0;
  background: #055057;
}
.sec02_box p{
  font-size: 36px;
  color: #fff;
  line-height: 1.4;
}
/*-- /sec02 --------------------------------
------------------------------------------*/

/*-- sec03 ---------------------------------
------------------------------------------*/
.sec03{
  padding: 100px 0 80px 0;
  background: #d9ebed;
  position: relative;
  z-index: 1;
}
.sec03 h2{
  margin-bottom: 170px;
}
.d_flex_step{
  display: flex;
  /*--
  justify-content: space-between;
  --*/
  justify-content: space-around;
  gap: 10px;
  position: relative;
}
.d_flex_step:before{
  width: 80%;
  height: 10px;
  background: #00adbe;
  z-index: 1;
  position: absolute;
  top: -70px;
  left: 0;
  right: 0;
  content: "";
  margin: 0 auto;
}
.d_flex_step dl{
  background: #fff;
  padding: 20px 10px;
  position: relative;
  flex: 1;
}
.d_flex_step dl dt{
  margin-bottom: 5px;
  text-align: center;
}
.d_flex_step dl dt img{
}
.d_flex_step dl:before{
  width: 0px;
  height: 0px;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-bottom: 22px solid #fff;
  position: absolute;
  top: -22px;
  left: 0;
  right: 0;
  content: "";
  margin: 0 auto;
}
.d_flex_step dl:after{
  width: 80px;
  height: 80px;
  position: absolute;
  top: -105px;
  left: 0;
  right: 0;
  content: "01";
  margin: 0 auto;
  background: #00adbe;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: var(--f-mincho);
  font-weight: 700;
  font-size: 30px;
  border-radius: 50px;
  z-index: 2;
  line-height: 0;
}
.d_flex_step dl:nth-child(2):after{content: "02";}
.d_flex_step dl:nth-child(3):after{content: "03";}
.d_flex_step dl:nth-child(4):after{content: "04";}
.d_flex_step dl:nth-child(5):after{content: "05";}
.d_flex_step dl .ttl{
  line-height: 1.2;
  color: var(--blue);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 72px;
  margin-bottom: 15px;
  text-shadow: -1px -1px 3px #fff, 1px 1px 3px #fff;
}
/*--
.d_flex_step dl .ttl.first{
  padding-top: 15px;
}
  --*/
.d_flex_step dl .txt{
  line-height: 1.5;
  margin-top: 10px;
}
/*-- /sec03 --------------------------------
------------------------------------------*/

/*-- sec04 ---------------------------------
------------------------------------------*/
.sec04{
  padding: 93px 0 115px 0;
}
.sec04 .sec04_box{
  margin-top: 70px;
}
.sec04 .sec04_box dl{
  border: 2px solid #cdcdcd;
  padding: 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.sec04 .sec04_box dl:not(:last-child){
  margin-bottom: 35px;
}
.sec04 .sec04_box dl dd{
  width: calc(100% - 326px);
}
/*-- /sec04 --------------------------------
------------------------------------------*/

/*-- sec05 ---------------------------------
------------------------------------------*/
.sec05{
  padding: 100px 0 92px 0;
  background: #d9ebed;
  position: relative;
  z-index: 1;
}
.sec05 .sec05_box.bg01{
  background: url(../images/sec05_box_bg.jpg) no-repeat center;
}
.sec05 .sec05_box.bg02{
  background: url(../images/sec05_box_bg02.jpg) no-repeat center;
}
.sec05 .sec05_box.bg03{
  background: url(../images/sec05_box_bg03.jpg) no-repeat center;
}
.sec05 .sec05_box .inner{
  display: flex;
  justify-content: flex-end;
}
.sec05 .sec05_box.bg02 .inner{
  justify-content: flex-start;
}
.sec05 .sec05_box .inner .sec05_wrap{
  max-width: 545px;
}
.sec05 .sec05_box .inner h3{
  padding-top: 15px;
  text-align: left;
}
.sec05_time{
  padding: 58px 24px 60px 30px;
  background: #fff;
}
.sec05_time dl{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.sec05_time dl:before{
  height: 100%;
  width: 4px;
  background: #535353;
  position: absolute;
  left: 182px;
  top: 0;
  content: "";
}
.sec05_time dl dd{
  width: 188px;
  text-align: right;
}
.sec05_time dl dt{
  width: calc(100% - 188px);
  position: relative;
  z-index: 2;
}
.sec05_time dl dt .txt{
  padding-left: 226px;
}
.sec05_time dl dt .title{
  color: var(--blue);
  font-weight: 600;
}
.sec05_time dl dt .title02{
  color: var(--blue);
  font-weight: 600;
  font-size: 24px;
}
/*-- /sec05 --------------------------------
------------------------------------------*/

/*-- sec06 ---------------------------------
------------------------------------------*/
.sec06{
  padding: 100px 0 0 0;
  position: relative;
  z-index: 1;
}
.sec06_step dl{
  background: #eeeeee;
}
.sec06_step dl dt{
  float: left;
}
.sec06_step dl dd{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
}
.sec06_step dl dd .ttl{
  width: calc(100% - 300px);
  padding-left: 30px;
  font-size: 30px;
  font-weight: 700;
  color: var(--blue);
}
/*-- /sec06 --------------------------------
------------------------------------------*/

/*-- sec07 ---------------------------------
------------------------------------------*/
.sec07{
  background: #eeeeee;
  padding: 112px 0 107px 0;
  position: relative;
  z-index: 1;
}
.sec07_qa dl:not(:last-child){
  margin-bottom: 40px;
}
.sec07_qa dl dt{
  background: #185057;
  padding: 27px 30px;
  font-size: 24px;
  color: var(--white);
  position: relative;
  font-weight: 700;
}
.sec07_qa dl dt .ttl_q{
  font-size: 30px;
  font-family: var(--f-mincho);
  padding-right: 15px;
  font-weight: 700;
}
.sec07_qa dl dd{
  padding: 27px 30px;
  background: #fff;
}
.sec07_qa dl dd p{
  display: flex;
  align-items: flex-start;
}
.sec07_qa dl dd .ttl_a{
  font-size: 30px;
  font-family: var(--f-mincho);
  padding-right: 15px;
  color: var(--blue);
  font-weight: 700;
}
/*-- /sec07 --------------------------------
------------------------------------------*/

/*-- footer --------------------------------
------------------------------------------*/
.footer {
  margin-top: 116px;
  background: #ebebeb;
  padding: 120px 0 0 0;
}

.footer .inner {
  padding-bottom: 110px;
}

.footer .copyright {
  background: #011517;
  text-align: center;
  color: #fff;
  padding: 30px 0;
}

.footer .copyright p {
  font-size: 13px;
}

.footer .footerNav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 30px;
}

.footer .footerNav .footerNav__item {
  background-color: #fff;
  position: relative;
  height: 80px;
  line-height: 42px;
  font-size: 18px;
  border-radius: 6px;
  padding: 18px 18px 18px 75px;
}

.footer .footerNav .footerNav__item::before {
  display: inline-block;
  position: absolute;
  content: '';
  height: 38px;
  width: 50px;
  background-repeat: no-repeat;
  background-size: contain;
  left: 18px;
}

.footer .footerNav .footerNav__item::after {
  display: inline-block;
  position: absolute;
  content: '';
  width: 10px;
  height: 20px;
  right: 18px;
  top: 30px;
  background-image: url("../images/btn-arrow.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.footer .footerNav .footerNav__item--building::before {
  background-image: url("../images/building.svg");
}

.footer .footerNav .footerNav__item--id::before {
  background-image: url("../images/id.svg");
}

.footer .footerNav .footerNav__item--dict::before {
  background-image: url("../images/dict.svg");
}

.footer .footerNav .footerNav__item--balloon::before {
  background-image: url("../images/balloon.svg");
}
.footer a{
  text-decoration: none;
  color: #222;
}
.footer__privacy{
  display: inline-block;
}
/*-- /footer -------------------------------
------------------------------------------*/

/*-- cta_fixed_pc --------------------------
------------------------------------------*/
#cta_fixed_pc{
  position: fixed;
  bottom: 100px;
  right: 30px;
  z-index: 999;
  width: auto;
  padding: 0;
  background: #39adc0;
  padding: 10px;
}
#cta_fixed_pc .wrapp_cta{
  background: #e4f3f5 url(../images/cta_fixed_bg.png) no-repeat top right;
  padding: 15px;
}
#cta_fixed_pc .ttl_tab{
  display: none;
}
/*-- /cta_fixed_pc -------------------------
------------------------------------------*/

/*-- /pagetop ------------------------------
------------------------------------------*/
.pagetop{display:none;position:fixed;bottom:20px;right:30px;z-index:9999;}
.pagetop a{position:relative;display:block;width:50px;height:50px;background-color:#21aebd;border-radius:50%;filter:alpha(opacity=100);-moz-opacity:1;opacity:1;}
.pagetop a:before{position:absolute;content:"";border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:12px solid #fff;top:50%;right:50%;transform:translateX(50%)translateY(-60%);}
.pagetop a:hover{display:block;text-align:center;color:#fff;font-size:12px;text-decoration:none;filter:alpha(opacity=70);-moz-opacity:0.7;opacity:0.7;}
.pagetop a:link,.pagetop a:visited{color:#fff;}
/*-- /pagetop ------------------------------
------------------------------------------*/