@charset "UTF-8";
@media screen and (max-width: 1080px){
  .contents{
    width: 1080px !important;
  }
}
.container {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 16px;
}
/*topview*/
.area_view {
  margin: 0 auto;
  display: flex;
}
.area_view .container{
  max-width: 1250px;
  margin: 0 auto;
  padding: 0;
} 
.area_view .img {
  display: flex;
}
.area_view .img img{
  width: 100%;
  max-width: 1080px;
}
/*navi*/
.area_navi{
  padding: 40px 0;
  background: #FFDE51;
}
.area_navi .head{
  text-align: center;
}
.area_navi .head .ttl{
  border-radius: 12px;
  background: #FFF500;
  margin: 0;
  padding: 12px 30px;
  font: 500 26px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  color: #000;
  letter-spacing: .12em;
  display: inline-block;
  box-shadow: 1px 1px 4px rgb(122 15 15 / 40%);
}
/*list_navi*/
.list_navi {
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  margin: 0;
  padding: 0;
}
.list_navi >li {
  list-style-type: none;
  background: #ffffff;
  width: 30%;
  display: flex;
  justify-content: center;
  text-align: center;
  border-radius: 6px;
  margin: 3px;
  position: relative;
}
.list_navi >li:hover {
  background: #64BED9;
}
.list_navi a {
  border-radius: 6px;
  padding: 12px 30px 20px 30px;
  align-items: center;
  text-decoration: auto;
}
.list_navi a::after{
  position: absolute;
  content: '';
  bottom: 0px;
  right: 48%;
  width: 12px;
  height: 12px;
  transform: translatey(-50%);
  background: url(../images/yaji.svg) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
.list_navi a .sub{
  margin: 0;
  font: 500 16px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  color: #2d8ba8;
  letter-spacing: .12em;
}
.list_navi a .ttl{
  margin: 0;
  font: 500 16px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  color: #34484E;
  letter-spacing: .12em;
}
.list_navi a .sub:hover,
.list_navi a .ttl:hover{
  color: #fff;
}
/*all*/
.frame{
  background: #64BED9;
}
.setting{
  background: #fff;
  border-radius: 50px;
  padding: 60px 0;
}
.area_search .container,
.area_voice .container,
.area_point .container,
.area_schedule .container,
.area_investigate .container,
.area_worksheet .container,
.area_qa .container{
  padding: 60px 0 0;
}
.area_search,
.area_voice,
.area_point,
.area_schedule,
.area_investigate,
.area_worksheet,
.area_qa {
  margin: 0 60px;
}
.area_search .head,
.area_voice .head,
.area_point .head,
.area_schedule .head,
.area_investigate .head,
.area_worksheet .head,
.area_qa .head {
  text-align: center;
}
.area_search .head .ttl .en,
.area_voice .head .ttl .en,
.area_point .head .ttl .en,
.area_schedule .head .ttl .en,
.area_investigate .head .ttl .en,
.area_worksheet .head .ttl .en,
.area_qa .head .ttl .en {
  color: #64BED9;
  margin: 0;
  font: 400 60px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.area_search .head .ttl .ja,
.area_voice .head .ttl .ja,
.area_point .head .ttl .ja,
.area_schedule .head .ttl .ja,
.area_investigate .head .ttl .ja,
.area_worksheet .head .ttl .ja,
.area_qa .head .ttl .ja {
  color: #1D1D1D;
  margin: 0;
  font: 400 24px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
/*search*/
.area_search .head .ttl .description{
  color: #1D1D1D;
  margin: 36px 0 0;
  font: 400 18px / 1.8em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.area_search .head .ttl .description strong{
  color: #1D1D1D;
  margin: 36px 0 0;
  font: 500 18px / 1.8em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
  position: relative;
  z-index: 1;
}
.area_search .head .ttl .description strong::before{
  position: absolute;
  content: "";
  width: 100%;
  height: 12px;
  left: 0;
  bottom: 0;
  z-index: -1;
  border-bottom: 8px solid #FFF67E;
}
.area_search .btnarea{
  margin: 40px 0 0;
  display: flex;
  justify-content: center;
}
.area_search .btnarea .btn{
  border-radius: 50px;
  text-decoration: auto;
  flex: 1;
  box-shadow: 0 2px 8px rgb(0 0 0 / 12%);
  color: #fff;
  background: #64BED9;
  border: 2px solid #FFF67E;
  letter-spacing: .12em;
  max-width: 400px;
  padding: 24px 12px 24px 0;
  font: 500 24px / 1em "Zen Kaku Gothic New", sans-serif;
  position: relative;
}
.area_search .btnarea .btn::after {
  position: absolute;
  content: '';
  top: 38px;
  right: 40px;
  width: 32px;
  height: 26px;
  transform: translatey(-50%);
  background: url(../images/triangle_wh.svg) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
.area_search .btnarea .btn::before {
  position: absolute;
  content: '';
  top: 0;
  left: 30%;
  width: 165px;
  height: 40px;
  transform: translatey(-50%);
  background: url(../images/click_text.svg) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
.area_search .body{
  margin: 48px 0 0;
}
.emphasis{
  text-align: center;
  background: #FFFBD3;
}
.emphasis .main{
  color: #64BED9;
  margin: 50px 0 0;
  padding: 20px;
  font: 500 24px / 1.8em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
  border-bottom: 1px dotted #64BED9;
}
.list_emphasis{
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  margin: 0;
  padding: 64px 100px 0;
}
.list_emphasis >li {
  padding: 42px 40px 30px;
  width: 100%;
  list-style-type: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #fff;
  border: 4px solid #64BED9;
  border-radius: 20px;
}
.list_emphasis >li.emphasis_1,
.list_emphasis >li.emphasis_2,
.list_emphasis >li.emphasis_3{
  position: relative;
}
.list_emphasis >li.emphasis_1::before,
.list_emphasis >li.emphasis_2::before,
.list_emphasis >li.emphasis_3::before{
  position: absolute;
  content: '';
  top: -3%;
  left: 20px;
  width: 80px;
  height: 80px;
  transform: translatey(-50%);
  z-index: 0;
}
.list_emphasis >li.emphasis_1::before{
  background: url(../images/emphasis_1.svg) no-repeat center center !important;
  background-size: contain !important;
}
.list_emphasis >li.emphasis_2::before{
  background: url(../images/emphasis_2.svg) no-repeat center center !important;
  background-size: contain !important;
}
.list_emphasis >li.emphasis_3::before{
  background: url(../images/emphasis_3.svg) no-repeat center center !important;
  background-size: contain !important;
}
.list_emphasis >li+li {
  margin: 48px 0 0;
}
.list_emphasis .img{
  width: 100%;
  text-align: center;
}
.list_emphasis .img img{
  width: 100%;
}
.list_emphasis .description{
  text-align: center;
  margin: 0 0 16px;
  font: 500 18px / 1.6em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.list_emphasis .keyword{
  margin: 20px 0 0;
}
.list_emphasis .sono1,
.list_emphasis .sono2{
  margin: 0;
  font: 500 16px / 1.8em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.list_emphasis .sono2 span{
  position: relative;
  z-index: 1;
}
.list_emphasis .sono2 span::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 12px;
  left: 0;
  bottom: 0;
  z-index: -1;
  border-bottom: 8px solid #FFF67E;
}
/*area*/
.area_search .area .description{
  text-align: center;
  color: #1D1D1D;
  margin: 28px 0 0;
  font: 500 18px / 1.8em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.list_area{
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  margin: 24px 0 0;
  padding: 0;
}
.list_area >li {
  list-style-type: none;
  width: 30%;
  text-align: center;
  position: relative;
}
.list_area a {
  text-decoration: auto;
  align-items: center;
  display: flex;
  justify-content: center;
  text-align: center;
  border-radius: 6px;
  margin: 8px;
  padding: 20px 30px 20px 30px;
  position: relative;
  border: 4px solid #64BED9;
  box-shadow: 3px 3px 0px rgb(228, 209, 82);
  background: #FCFDFF;
}
.list_area a::after {
  position: absolute;
  content: '';
  top: 32px;
  right: 12px;
  width: 32px;
  height: 32px;
  transform: translatey(-50%);
  background: url(../images/triangle_ye.svg) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
.list_area .ttl {
  margin: 0;
  font: 500 16px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  color: #64BED9;
  letter-spacing: .12em;
}
/*voice*/
.area_voice .head{
  padding: 0 0 36px;
  border-bottom: 3px solid #64BED9;
  position: relative;
}
.area_voice .head::before{
  position: absolute;
  content: '';
  top: 62%;
  left: 10%;
  width: 100px;
  height: 120px;
  transform: translatey(-50%);
  background: url(../images/img_1.png) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
.area_voice .head::after{
  position: absolute;
  content: '';
  top: 62%;
  right: 10%;
  width: 100px;
  height: 120px;
  transform: translatey(-50%);
  background: url(../images/img_2.png) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
.area_voice .body{
  margin: 32px 0 0;
}
/*list_intro*/
.list_intro {
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  margin: 0;
  padding: 0 60px;
}
.list_intro > li {
  width: 45%;
  list-style-type: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 10px;
}
.list_intro article{
  background: #ECF8FC;
  border-radius: 20px;
  padding: 20px;
}
.list_intro .img {
  text-align: center;
  margin: 12px 0 0;
}
.list_intro .img img{
  width: 50%;
}
.list_intro .text{
  text-align: center;
}
.list_intro .text .intro{
  margin: 0;
  font: 500 16px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  color: #000;
  letter-spacing: .12em;
}
.list_intro .text .intro span{
  margin: 0;
  font: 500 16px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  color: #64BED9;
  letter-spacing: .12em;
}
/*list_real*/
.list_real{
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  margin: 0;
  padding: 24px 90px 0;
}
.list_real >li {
  padding: 24px 40px 30px;
  width: 100%;
  list-style-type: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 20px;
  background: #FFDE51;
}
.list_real >li+li {
  margin: 24px 0 0;
}
.list_real >li .ttl{
  text-align: center;
  margin: 0;
  font: 500 24px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  color: #000;
  letter-spacing: .12em;
}
.list_real article{
  margin: 12px 0 0;
  background: #fff;
  width: 100%;
  display: flex;
  justify-content: center;
  text-align: center;
}
.list_real .NT_1,
.list_real  .ES_1 {
  width: 50%;
  padding: 12px 12px 40px;
}
.list_real .name{
  margin: 0;
  background: #64BED9;
  color: #fff;
  border-radius: 16px;
  font: 500 16px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.list_real .feature{
  margin: 12px 0 0;
  color: #64BED9;
  font: 500 16px / 1.4em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.list_real .description{
  margin: 12px 0 0;
  color: #232323;
  font: 400 13px / 2.2em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
  text-align: left;
}
/*list_point*/
.list_point {
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  margin: 0;
  padding: 0 60px;
}
.list_point > li {
  list-style-type: none;
  margin: 0 24px;
}
.list_point article{
  display: flex;
  align-items: center;
}
.list_point .img img{
  width: 100%;
}
.list_point .text{
  width: 120%;
  margin: 0 20px;
}
.list_point .text .point{
  display: inline-block;
  border-radius: 16px;
  margin: 0;
  padding: 0 8px;
  color: #fff;
  background: #D84D8A;
  font: 400 11px / 2em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.list_point .text .ttl{
  margin: 10px 0 0;
  color: #20748D;
  font: 500 20px / 1em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.list_point .text .ttl span{
  z-index: 1;
  position: relative;
}
.list_point .text .ttl span::before{
  position: absolute;
  content: "";
  width: 100%;
  height: 12px;
  left: 0;
  bottom: 0;
  z-index: -1;
  border-bottom: 8px solid #FFF67E;
}
.list_point .text .ttl strong{
  color: #20748D;
  font: 600 24px / 1em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.list_point .text .description{
  margin: 20px 0 0;
  color: #4E4B4B;
  font: 400 13px / 2.2em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
  text-align: left;
}
/*schedule*/
.list_schedule {
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  margin: 0;
  padding: 36px 0 0;
}
.list_schedule >li {
  padding: 20px;
  width: 36%;
  list-style-type: none;
}
.list_schedule li.schedule_1,
.list_schedule li.schedule_2,
.list_schedule li.schedule_3,
.list_schedule li.schedule_4 {
    position: relative;
}
.list_schedule li.schedule_1::before {
  background: url(../images/flow_number1.svg) no-repeat center center !important;
  background-size: contain !important;
}
.list_schedule li.schedule_2::before {
  background: url(../images/flow_number2.svg) no-repeat center center !important;
  background-size: contain !important;
}
.list_schedule li.schedule_3::before {
  background: url(../images/flow_number3.svg) no-repeat center center !important;
  background-size: contain !important;
}
.list_schedule li.schedule_4::before {
  background: url(../images/flow_number4.svg) no-repeat center center !important;
  background-size: contain !important;
}
.list_schedule li.schedule_1::before, .list_schedule li.schedule_2::before, .list_schedule li.schedule_3::before, .list_schedule li.schedule_4::before {
  position: absolute;
  content: '';
  top: 24px;
  left: 0;
  width: 70px;
  height: 30px;
  transform: translatey(-50%);
  z-index: 0;
}
.list_schedule .img img {
  width: 100%;
}
.list_schedule .ttl {
  text-align: center;
  border-radius: 24px;
  padding: 6px;
  margin: 0;
  color: #fff;
  letter-spacing: 0.12em;
  font: 500 16px / 1.4em "Zen Kaku Gothic New", sans-serif;
  background: #52A8B7;
}
.list_schedule .description {
  margin: 12px 0 0;
  letter-spacing: 0.12em;
  font: 400 12px / 2em "Zen Kaku Gothic New", sans-serif;
  color: #424445;
}
.area_investigate .body{
  margin: 32px 0 0;
  position: relative;
}
.area_investigate .body::before{
  position: absolute;
  content: '';
  right: 10%;
  width: 70px;
  height: 70px;
  transform: translatey(-50%);
  background: url(../images/img_3.png) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
.area_investigate .body::after{
  position: absolute;
  content: '';
  left: 10%;
  width: 70px;
  height: 70px;
  transform: translatey(-50%);
  background: url(../images/img_4.png) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
/*investigate*/
.list_investigate {
  display: flex;
  flex-flow: wrap;
  margin: 20px 90px;
  padding: 50px;
  border: 3px solid #48A5C1;
  border-radius: 24px;
}
.list_investigate >li {
  list-style-type: none;
  padding: 10px 20px 10px 0;
  display: flex;
}
.list_investigate .img {
  margin: 0 12px 0 0;
}
.list_investigate .img img {
    width: 18px;
    height: 18px;
}
.list_investigate .ttl{
  margin: 0;
  color: #403838;
  letter-spacing: 0.12em;
  font: 500 18px / 1em "Zen Kaku Gothic New", sans-serif;
}
.list_investigate .description{
  margin: 0;
  color: #424445;
  letter-spacing: 0.12em;
  font: 400 14px / 2em "Zen Kaku Gothic New", sans-serif;
}
/*worksheet*/
.area_worksheet .body{
  display: flex;
  align-items: center;
  padding: 0 100px;
}
.area_worksheet .img img{
  width: 64%;
  margin: 0 40px 0 0;
}
.area_worksheet .text {
  width: 100%;
  margin: 0 0 0 -140px;
}
.area_worksheet .text .ttl{
  color: #20748D;
  font: 500 24px / 1em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
  margin: 0 0 24px;
}
.area_worksheet .text .ttl strong{
  position: relative;
}
.area_worksheet .text .ttl strong::before{
  position: absolute;
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #D84D8A;
  top: -8px;
  left: 10px;
}
.area_worksheet .description{
  color: #403838;
  font: 400 20px / 1em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
  margin: 15px 0 0;
  display: flex;
  align-items: center;
}
.area_worksheet .btnarea{
  margin: 40px 0 0;
  display: flex;
}
.area_worksheet .btnarea .btn{
  border-radius: 50px;
  text-decoration: auto;
  flex: 1;
  border: 2px solid #48A5C1;
  color: #48A5C1;
  background: #FFF038;
  letter-spacing: .12em;
  max-width: 400px;
  padding: 18px 12px 18px 0;
  font: 500 24px / 1em "Zen Kaku Gothic New", sans-serif;
  position: relative;
  display: flex;
  justify-content: center;
}
.area_worksheet .btnarea .btn::after {
  position: absolute;
  content: '';
  top: 31px;
  right: 32px;
  width: 32px;
  height: 26px;
  transform: translatey(-50%);
  background: url(../images/triangle_wh.svg) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
/*q&a*/
.area_qa .body{
  margin: 42px 0 0;
}
.list_qa {
  margin: 0;
  padding: 0 120px;
}
.list_qa >li {
  list-style-type: none;
}
.list_qa >li+li {
  padding: 18px 0 0;
}
.list_qa article {
  background: #FAFFFF;
  border: 3px solid #64BED9;
  padding: 22px 30px 36px;
  box-shadow: 4px 4px 0px rgb(101 190 217);
}
.list_qa .q .ttl{
  display: flex;
  align-items: center;
  border-bottom: 1px dotted #64BED9;
  font: 600 18px / 1.8em "Zen Kaku Gothic New", sans-serif;
  color: #403838;
  letter-spacing: 0.10em;
  padding: 0px 0 8px;
  margin: 0;
}
.list_qa .a .description{
  font: 500 13px / 1.8em "Zen Kaku Gothic New", sans-serif;
  color: #333;
  letter-spacing: 0.2em;
  margin: 12px 0 0;
}
/*end*/
.area_end {
  background: #fff;
  padding: 50px 0 100px;
}
.area_end .description{
  text-align: center;
  color: #1D1D1D;
  margin: 36px 0 0;
  font: 400 18px / 1.8em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
}
.area_end .description strong{
  color: #1D1D1D;
  margin: 36px 0 0;
  font: 500 18px / 1.8em 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: .12em;
  position: relative;
  z-index: 1;
}
.area_end .description strong::before{
  position: absolute;
  content: "";
  width: 100%;
  height: 12px;
  left: 0;
  bottom: 0;
  z-index: -1;
  border-bottom: 8px solid #FFF67E;
}
.area_end .btnarea{
  margin: 40px 0 0;
  display: flex;
  justify-content: center;
}
.area_end .btnarea .btn{
  border-radius: 50px;
  text-decoration: auto;
  flex: 1;
  box-shadow: 0 2px 8px rgb(0 0 0 / 12%);
  color: #fff;
  background: #64BED9;
  border: 2px solid #FFF67E;
  letter-spacing: .12em;
  max-width: 400px;
  padding: 24px 12px 24px 0;
  font: 500 24px / 1em "Zen Kaku Gothic New", sans-serif;
  position: relative;
  text-align: center;
}
.area_end .btnarea .btn::before{
  position: absolute;
  content: '';
  top: 0;
  left: 30%;
  width: 165px;
  height: 40px;
  transform: translatey(-50%);
  background: url(../images/click_text.svg) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}
.area_end .btnarea .btn::after{
  position: absolute;
  content: '';
  top: 38px;
  right: 40px;
  width: 32px;
  height: 26px;
  transform: translatey(-50%);
  background: url(../images/triangle_wh.svg) no-repeat center center !important;
  background-size: contain !important;
  z-index: 0;
}