@font-face {
  font-family: 'NotoSansJP-Medium';
  src: url('../font/NotoSansJP-Medium.otf');
  font-weight: black;
}





@font-face {
  font-family: 'NotoSansJP-Black';
  src: url('../font/NotoSansJP-Black.otf');
  font-weight: black;
}





@font-face {
  font-family: 'NotoSansJP-Bold';
  src: url('../font/NotoSansJP-Bold.otf');
  font-weight: bold;
}





/* WebP未対応のブラウザ用のスタイル */





.no-webp .element {





  background-image: url("image.jpg");





}





/* WebP対応のブラウザ用のスタイル */





.webp .element {





  background-image: url("image.webp");





}





main {





  width: 100vw;





  margin: 0;





  padding: 0;





}





body {





  font-feature-settings: "palt";





}





img {





  width: 100%;





  height: auto;





  image-rendering: -webkit-optimize-contrast;





}





strong {





  font-weight: bold;





}











.wrapper {





  max-width: 930px;





  margin: 0 auto;





}





.yellow {





  color: #f0ee26;





}





.marker {
  font-weight: 700;
  background: url(../img/top/marker.png) repeat-x left bottom;
  background-size: auto 50%;
}





.pc_only {
  display: block;
}
.sp_only {
  display: none;
}











.btn {





  width: 100%;





  max-width: 450px;





}





.btn a {





  font-size: 22px;





  font-weight: bold;





  color: #119f42;





  padding: 17px 0;





  background: #fff;





  border-radius: 50px;





  border: 2px solid;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  justify-content: center;





  align-items: center;





  position: relative;





}





.btn a::after {





  content: "";





  position: absolute;





  right: 28px;





  width: 6px;





  height: 6px;





  border-top: 2px solid #119f42;





  border-right: 2px solid #119f42;





  top: 50%;





  transform: translateY(-50%) rotate(45deg);





  -webkit-transform: translateY(-50%) rotate(45deg);





  -ms-transform: translateY(-50%) rotate(45deg);





}











@media (min-width: 768px) {





  /*a[href*="tel:"] {





    pointer-events: none;





    cursor: default;





    text-decoration: none;





  }*/





}





@media (max-width: 1023px) {
  .wrapper {
    max-width: calc(100% - 50px);
  }
}

@media (max-width: 767px) {
  .wrapper {
    max-width: calc(100% - 30px);
  }
  .pc_only {
    display: none;
  }
  .sp_only {
    display: block;
  }
  .btn {
    width: 250px;
    margin: 0 auto;
  }
  .btn a {
    font-size: 16px;
    padding: 10px 0;
  }
  .btn a::after {
    right: 14px;
    width: 4px;
    height: 4px;
  }
}





@media (max-width: 374px) {





  .btn {





    width: 100%;





  }





}











.header {





  width: 100%;





  padding: 20px 0 26px;





}





.header_inner {
  display: flex;
  align-items: center;
}





.header_logo {





  width: 225px;





}





.header_cta.pc {





  margin-left: auto;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





}





.header_cta.sp {





  display: none;





}





.header_tel {





  width: 287px;





  height: 100%;





  text-align: right;





  margin-right: 20px;





}





.header_tel a {





  width: 100%;





  display: block;





  margin-bottom: 5px;





}





.header_tel p {





  font-size: 12px;





  font-family: 'NotoSansJP-Bold';





}





.header_mail {





  width: 250px;





  height: 55px;





  position: relative;





}





.header_mail::after {





  content: "";





  position: absolute;





  background: #983c0e;





  width: 100%;





  height: 100%;





  border-radius: 100px;





  top: 4px;





  left: 0;





}





.header_mail a {





  font-size: 18px;





  font-family: 'NotoSansJP-Bold';





  color: #fff;





  height: 100%;





  border-radius: 100px;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  justify-content: center;





  align-items: center;





  background: #f46337;





  position: relative;





  z-index: 2;





}





.header_mail a::after {





  content: "";





  position: absolute;





  right: 20px;





  width: 6px;





  height: 6px;





  border-top: 2px solid #fff;





  border-right: 2px solid #fff;





  top: 50%;





  transform: translateY(-50%) rotate(45deg);





  -webkit-transform: translateY(-50%) rotate(45deg);





  -ms-transform: translateY(-50%) rotate(45deg);





}





.header_mail a .fas {





  margin-right: 4px;





}











@media (min-width: 768px) {





  .header_mail a:hover {





    transform: translateY(4px);





    -webkit-transform: translateY(4px);





    -ms-transform: translateY(4px);





  }





}





@media (max-width: 1023px) {





  main {





    padding-top: calc((90 / 750) * 100vw);





  }





  .header {





    padding: 0;





    position: fixed;





    z-index: 10;





    background: #fff;





  }





  .header_logo {
    width: 32vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
  }





  .header_cta.pc {





    display: none;





  }





  .header_cta.sp {





    margin-left: auto;





    margin-right: -30px;





    display: -webkit-box;





    display: -ms-flexbox;





    display: flex;





    align-items: center;





  }





  .header_tel {





    width: calc((90 / 750) * 100vw);





    height: calc((90 / 750) * 100vw);





    margin: 0;





  }





  .header_tel a {





    font-size: 25px;





    color: #fff;





    display: -webkit-box;





    display: -ms-flexbox;





    display: flex;





    align-items: center;





    justify-content: center;





    background: #119f42;





    height: 100%;





  }





  .header_mail {





    width: calc((90 / 750) * 100vw);





    height: calc((90 / 750) * 100vw);





  }





  .header_mail::after {





    display: none;





  }





  .header_mail a {





    font-size: 25px;





    border-radius: 0;





  }





  .header_mail a::after {





    display: none;





  }











}





@media (max-width: 767px) {





  .header_cta.sp {





    margin-right: -15px;





  }





  .header_tel a {





    font-size: 15px;





  }





  .header_mail a {





    font-size: 15px;





  }





}

















.fv {





  width: 100vw;





  height: 645px;





  background-image: url(../img/top/fv_bg.jpg);





  background-size: cover;





  background-repeat: no-repeat;





  background-position: right;





  overflow: hidden;





}





.fv_inner {





  position: relative;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  height: 100%;





  align-items: center;





}





.fv_catch {





  width: 652px;





  height: auto;





  position: relative;





  z-index: 1;





}





.fv_family {





  position: absolute;





  bottom: 0;





  left: 580px;





  width: auto;





  height: 100%;





  object-fit: cover;





}





.fv_family img {
  width: auto;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}





@media (max-width: 1023px) {





  .fv_catch {





    width: calc((450 / 750) * 100vw);





  }





  .fv_family {





    height: calc(100% - 40px);





    left: calc((374 / 750) * 100vw);





  }





}





@media (max-width: 767px) {





  .fv {





    height: calc((518 / 750) * 100vw);





  }





  .fv_catch {





    width: calc((500 / 750) * 100vw);





  }





  .fv_family {





    height: calc(100% - 40px);





    left: calc((444 / 750) * 100vw);





  }





}























.cta {





  padding: 62px 0 92px;





  background-image: -moz-linear-gradient(-90deg, rgb(83, 183, 33) 0%, rgb(50, 171, 50) 22%, rgb(17, 159, 66) 100%);





  background-image: -webkit-linear-gradient(-90deg, rgb(83, 183, 33) 0%, rgb(50, 171, 50) 22%, rgb(17, 159, 66) 100%);





  background-image: -ms-linear-gradient(-90deg, rgb(83, 183, 33) 0%, rgb(50, 171, 50) 22%, rgb(17, 159, 66) 100%);





}





.cta_ttl {





  width: 620px;





  margin: 0 auto 24px auto;





}





.cta_box {





  background: #fff;





  padding: 50px 45px 50px;





  position: relative;





}





.cta_matsuo {





  position: absolute;





  right: 73px;





  top: -164px;





}





.cta_matsuo img {





  width: 183px;





}





.cta_matsuo p {





  font-size: 14px;





  font-family: 'NotoSansJP-Bold';





  position: absolute;





  right: calc(100% + 12px);





  bottom: 20px;





  white-space: nowrap;





}





.cta_amazon {





  background: #fcfaf0;





  padding: 26px 30px;





  margin-bottom: 32px;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  position: relative;





}





.cta_amazon::before {





  content: "";





  position: absolute;





  right: 0;





  bottom: -18px;





  left: 0;





  width: 0px;





  height: 0px;





  margin: auto;





  border-style: solid;





  border-color: #4eb524 transparent transparent transparent;





  border-width: 38px 85px 0 85px;





}





.amazon_present {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: flex-end;





  justify-content: space-between;





  width: 100%;





}





.amazon_card {





  width: 193px;





  margin-right: 25px;





  flex-shrink: 0;





}





.amazon_card img {





  box-shadow: 0px 3px 5.46px 0.54px rgba(2, 2, 2, 0.1);





  border-radius: 6px;





}





.present_desc {





  font-size: 19px;





  font-family: 'NotoSansJP-Bold';





  letter-spacing: 0.065em;





}





.present_body {





  font-size: 34px;





  font-family: 'NotoSansJP-Bold';





  font-weight: bold;





}





.present_body span {





  color: #c00f39;





}





.present_body .num {





  font-size: 75px;





}





.present_link {





  text-align: center;





}





.present_link a {





  font-size: 14px;





  font-family: 'NotoSansJP-Black';





  line-height: calc(20 / 14);





  color: #4eb524;





  text-decoration: underline;





  overflow: visible;





}





.present_link a img {





  width: 26px;





  margin-bottom: 2px;





}





.present_link a span {





  content: "";





  display: inline-block;





  width: 6px;





  height: 6px;





  border-top: 2px solid #4eb524;





  border-right: 2px solid #4eb524;





  transform: rotate(45deg);





  -webkit-transform: rotate(45deg);





  -ms-transform: rotate(45deg);





  margin-left: 2px;





  margin-bottom: 1px;





}





.yotsukado {





  position: absolute;





  width: 27px;





  height: 27px;





}





.yotsukado.leftTop {





  border-top: 2px solid #4eb524;





  border-left: 2px solid #4eb524;





  top: 0;





  left: 0;





}





.yotsukado.leftBottom {





  border-left: 2px solid #4eb524;





  border-bottom: 2px solid #4eb524;





  bottom: 0;





  left: 0;





}





.yotsukado.rightTop {





  border-top: 2px solid #4eb524;





  border-right: 2px solid #4eb524;





  top: 0;





  right: 0;





}





.yotsukado.rightBottom {





  border-right: 2px solid #4eb524;





  border-bottom: 2px solid #4eb524;





  right: 0;





  bottom: 0;





}











.cta_30min {





  width: 100%;





  height: 100px;





  margin-bottom: 35px;





  position: relative;





}





.cta_30min::after {





  content: "";





  position: absolute;





  background: #9a1339;





  width: 100%;





  height: 100%;





  border-radius: 100px;





  top: 5px;





  left: 0;





}





.cta_30min a {





  font-size: 40px;





  font-family: 'NotoSansJP-Black';





  color: #fff;





  padding: 12px 0 28px;





  background: #c00f39;





  border-radius: 100px;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  justify-content: center;





  align-items: flex-end;





  position: relative;





  z-index: 2;





}





.cta_30min a::after {





  content: "";





  position: absolute;





  right: 40px;





  width: 12px;





  height: 12px;





  border-top: 3px solid #fff;





  border-right: 3px solid #fff;





  top: 50%;





  transform: translateY(-50%) rotate(45deg);





  -webkit-transform: translateY(-50%) rotate(45deg);





  -ms-transform: translateY(-50%) rotate(45deg);





}





.cta_30min a .num {





  font-size: 1.5em;





  font-family: 'NotoSansJP-Bold';





}





.cta_btm {





  width: calc(100% - 30px);





  margin: 0 auto;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  justify-content: center;





}





.cta_tel,





.cta_mail {





  width: 500px;





  height: 66px;





  margin: 0 15px;





  position: relative;





}





.cta_tel::after,





.cta_mail::after {





  content: "";





  position: absolute;





  width: 100%;





  height: 100%;





  border-radius: 100px;





  top: 5px;





  left: 0;





}





.cta_tel::after {





  background: #101047;





}





.cta_mail::after {





  background: #983c0e;





}





.cta_tel a,





.cta_mail a {





  font-size: 24px;





  font-family: 'NotoSansJP-Bold';





  color: #fff;





  height: 100%;





  border-radius: 100px;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  justify-content: center;





  align-items: center;





  position: relative;





  z-index: 2;





}





.cta_tel a {





  background: #1a1a77;





}





.cta_mail a {





  background: #f46337;





}





.cta_tel a::after,





.cta_mail a::after {





  content: "";





  position: absolute;





  right: 30px;





  width: 9px;





  height: 9px;





  border-top: 3px solid #fff;





  border-right: 3px solid #fff;





  top: 50%;





  transform: translateY(-50%) rotate(45deg);





  -webkit-transform: translateY(-50%) rotate(45deg);





  -ms-transform: translateY(-50%) rotate(45deg);





}





.cta_tel a .fas {





  transform: rotate(90deg);





  -webkit-transform: rotate(90deg);





  -ms-transform: rotate(90deg);





  margin-right: 8px;





}





.cta_mail a .fas {





  margin-right: 8px;





}











@media (min-width: 768px) {





  .present_link a:hover {





    text-decoration: none;





  }





  .cta_30min a:hover,





  .cta_tel a:hover,





  .cta_mail a:hover {





    transform: translateY(5px);





    -webkit-transform: translateY(5px);





    -ms-transform: translateY(5px);





  }





}





@media (max-width: 1023px) {





  .cta_ttl {





    width: 100%;





    margin: 0;





  }





  .cta_matsuo {





    display: none;





  }





}





@media (max-width: 767px) {





  .cta {





    padding: 24px 0 40px;





  }





  .cta_ttl {





    width: 280px;





    margin: 0 auto 15px;





  }





  .cta_box {





    padding: 15px;





  }





  .cta_amazon {





    padding: 14px 17px;





    margin-bottom: 16px;





  }





  .cta_amazon::before {





    bottom: -9px;





    border-width: 19px 42px 0 42px;





  }





  .amazon_present {





    flex-flow: column;





    align-items: flex-start;





  }





  .amazon_card {





    width: 100px;





    margin-right: 10px;





  }





  .present_desc {





    font-size: 10px;





    line-height: 1.1;





    margin-bottom: 2px;





  }





  .present_body {





    font-size: 12.5px;





    margin-bottom: 4px;





  }





  .present_body .num {





    font-size: 27px;





  }





  .present_link {





    text-align: left;





  }





  .present_link a {





    font-size: 10px;





    display: -webkit-box;





    display: -ms-flexbox;





    display: flex;





    align-items: center;





    text-decoration: none;





  }





  .present_link a img {





    width: 10px;





    margin-bottom: 0;





    margin-right: 2px;





  }





  .present_link a span {





    width: 4px;





    height: 4px;





    border-top: 1px solid #4eb524;





    border-right: 1px solid #4eb524;





    margin-bottom: 0;





  }





  .yotsukado {





    width: 14px;





    height: 14px;





  }





  .yotsukado.leftTop {





    border-top: 1px solid #4eb524;





    border-left: 1px solid #4eb524;





  }





  .yotsukado.leftBottom {





    border-left: 1px solid #4eb524;





    border-bottom: 1px solid #4eb524;





  }





  .yotsukado.rightTop {





    border-top: 1px solid #4eb524;





    border-right: 1px solid #4eb524;





  }





  .yotsukado.rightBottom {





    border-right: 1px solid #4eb524;





    border-bottom: 1px solid #4eb524;





  }





  .cta_30min {





    height: 50px;





    margin-bottom: 18px;





  }





  .cta_30min::after {





    top: 3px;





  }





  .cta_30min a {





    font-size: 20px;





    padding: 8px 0 12px;





  }





  .cta_30min a::after {





    right: 20px;





    width: 6px;





    height: 6px;





    border-top: 2px solid #fff;





    border-right: 2px solid #fff;





  }





  .cta_btm {





    width: 100%;





  }





  .cta_tel,





  .cta_mail {





    width: 200px;





    height: 33px;





  }





  .cta_tel {





    margin: 0 7px 0 0;





  }





  .cta_mail {





    margin: 0 0 0 7px;





  }





  .cta_tel::after,





  .cta_mail::after {





    top: 2px;





  }





  .cta_tel a,





  .cta_mail a {





    font-size: 12px;





  }





  .cta_tel a::after,





  .cta_mail a::after {





    right: 15px;





    width: 5px;





    height: 5px;





    border-top: 2px solid #fff;





    border-right: 2px solid #fff;





  }





  .cta_tel a .fas,





  .cta_mail a .fas {





    margin-right: 4px;





  }





}





@media (max-width: 320px) {





  .cta_amazon {





    flex-flow: column;





    align-items: center;





  }





  .amazon_card {





    margin-right: 0;





    margin-bottom: 10px;





  }





  .amazon_present {





    align-items: center;





  }





}

















.about {





  padding: 100px 0;





}





.about_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.about_ttl {





  width: 760px;





  margin-bottom: 30px;





  position: relative;





}





.about_icon {





  position: absolute;





  width: 188px;





  right: 2px;





  top: -11px;





  z-index: -1;





}











.about_lead {





  margin-bottom: 55px;





}





.about_lead p {





  font-size: 24px;





  line-height: calc(34 / 24);





  text-align: center;





}





.about_youtube {





  width: 100%;





}





@media (max-width: 1023px) {





  .about_ttl {





    width: calc(760px * 0.85);





  }





}





@media (max-width: 767px) {





  .about {





    padding: 40px 0;





  }





  .about_ttl {





    width: 324px;





    margin-bottom: 15px;





  }





  .about_icon {





    width: 94px;





    top: 0;





    right: -9px;





  }





  .about_lead {





    margin-bottom: 15px;





  }





  .about_lead p {





    font-size: 14px;





    line-height: calc(40 / 28);





    text-align: justify;





  }





}





@media (max-width: 374px) {





  .about_ttl {





    width: 100%;





  }





  .about_icon {





    width: 74px;





    top: 0;





    right: -9px;





  }





}























.how {





  padding: 100px 0;





  background: #ecf7f1;





}





.how_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.how_ttl {





  width: 516px;





  margin-bottom: 45px;





}





.how_list {





  margin-bottom: 60px;





}





.how_list>li {





  border: 4px solid #119f42;





  padding: 41px;





  background: #fff;





  position: relative;





  margin-bottom: 30px;





}





.how_list>li:last-of-type {





  margin-bottom: 0;





}





.how_list .rbn {





  position: absolute;





  width: 85px;





  top: -19px;





  left: 41px;





}





.how_list h3 {





  font-size: 30px;





  font-family: 'NotoSansJP-Medium';





  border-bottom: 2px solid #119f42;





  padding-left: 100px;





  padding-bottom: 20px;





  margin-bottom: 30px;





}





.how_list h3 span {





  font-family: 'NotoSansJP-Black';





  color: #119f42;





}





.how_body {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





}





.how_img {





  width: 400px;





  margin-right: 30px;





  flex-shrink: 0;





}





.how_detail p {





  font-size: 18px;





  line-height: calc(28 / 18);





  text-align: justify;





}





@media (max-width: 1023px) {





  .how_img {





    width: 50%;





  }





  .how_ttl {





    width: calc(516px * 0.85);





  }





}





@media (max-width: 767px) {





  .how {





    padding: 40px 0;





  }





  .how_ttl {





    width: 261px;





    margin-bottom: 15px;





  }





  .how_list {





    margin-bottom: 15px;





  }





  .how_list>li {





    border: 2px solid #119f42;





    padding: 17px 15px 15px;





    margin-bottom: 24px;





  }





  .how_list .rbn {





    width: 42px;





    top: -9px;





    left: 15px;





  }





  .how_list h3 {





    font-size: 16px;





    border-bottom: 1px solid #119f42;





    padding-left: 44px;





    padding-bottom: 10px;





    margin-bottom: 16px;





  }





  .how_body {





    flex-flow: column;





  }





  .how_img {





    width: 100%;





    margin: 0 0 15px;





  }





  .how_detail p {





    font-size: 14px;





    line-height: calc(40 / 28);





  }

















}























.qa {





  width: 100%;





}





.qa_list>li {





  margin-bottom: 1px;





}





.qa_question {





  height: 80px;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  background: #119f42;





  position: relative;





  padding: 0 100px 0 106px;





  cursor: pointer;





}





.qa_question::before {





  content: "Q";





  font-size: 30px;





  font-family: futura-pt, sans-serif;





  font-weight: 600;





  color: #119f42;





  width: 56px;





  height: 56px;





  border-radius: 56px;





  background: #fff;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  justify-content: center;





  left: 30px;





  top: 50%;





  transform: translateY(-50%);





  -webkit-transform: translateY(-50%);





  -ms-transform: translateY(-50%);





  position: absolute;





}





.qa_question::after {





  content: "";





  position: absolute;





  top: 50%;





  transform: translateY(-50%);





  -webkit-transform: translateY(-50%);





  -ms-transform: translateY(-50%);





  width: 52px;





  height: 52px;





  background-image: url(../img/top/qa_icon.png);





  background-repeat: no-repeat;





  background-position: center;





  background-size: contain;





  right: 30px;





}





.qa_question p {





  font-size: 24px;





  line-height: calc(34 / 24);





  font-weight: bold;





  color: #fff;





}





.qa_question p span {





  font-size: 0.75em;





  font-weight: bold;





}





.qa_answer {





  display: none;





}





.qa_answer.active {





  display: block;





}

.qa_checkbox {
  display: none;
}

/* 追加：回答エリアを初期状態で非表示 */
.qa_answer {
  display: none;
}

/* 追加：クリック可能なことを示す */
.qa_question {
  cursor: pointer;
}


.qa_answer_inner {
  padding: 30px;
  background: #f7f7f7;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/* 追加：チェックボックスがチェックされた時の表示制御 */
.qa_checkbox:checked + .qa_question + .qa_answer {
  display: block;
}


.qa_matsuo {
  margin-right: 34px;
  text-align: center;
  flex-shrink: 0;
}





.qa_matsuo img {





  width: 56px;





  height: 56px;





  border-radius: 56px;





  margin-bottom: 7px;





}





.qa_matsuo p {





  font-size: 10px;





}





.qa_detail {





  padding: 28px;





  border: 2px solid #119f42;





  border-radius: 5px;





  position: relative;





  background: #fff;





}





.qa_detail:before {





  content: "";





  position: absolute;





  top: 32px;





  left: -20px;





  margin-top: -12px;





  border: 6px solid transparent;





  border-right: 14px solid #FFF;





  z-index: 2;





}





.qa_detail:after {





  content: "";





  position: absolute;





  top: 32px;





  left: -26px;





  margin-top: -14px;





  border: 8px solid transparent;





  border-right: 16px solid #119f42;





  z-index: 1;





}





.qa_detail p {





  font-size: 18px;





  line-height: calc(28 / 18);





}





.qa_detail p+p {





  margin-top: 23px;





}





.qa_detail a {





  color: #119f42;





  text-decoration: underline;





}





.qa_youtube {





  width: 100%;





  margin-bottom: 40px;





}





.qa_area {





  max-width: 400px;





  margin: 30px auto 0;





}





@media (max-width: 767px) {





  .qa_question {





    height: auto;





    padding: 15px 52px 15px 52px;





  }





  .qa_question::before {





    font-size: 15px;





    width: 28px;





    height: 28px;





    left: 15px;





  }





  .qa_question::after {





    width: 26px;





    height: 26px;





    right: 15px;





  }





  .qa_question p {





    font-size: 16px;





    line-height: calc(44 / 32);





  }





  .qa_answer_inner {





    padding: 15px;





  }





  .qa_matsuo {





    width: 45px;





    margin-right: 10px;





  }





  .qa_matsuo img {





    width: 100%;





    height: auto;





    border-radius: 0;





    margin-bottom: 5px;





  }





  .qa_matsuo p {





    display: none;





  }





  .qa_detail {





    padding: 15px;





    border: 1px solid #119f42;





  }





  .qa_detail:before {





    top: 24px;





    left: -10px;





    margin-top: -6px;





    border: 3px solid transparent;





    border-right: 7px solid #FFF;





  }





  .qa_detail:after {





    top: 24px;





    left: -13px;





    margin-top: -7px;





    border: 4px solid transparent;





    border-right: 8px solid #119f42;





  }





  .qa_detail p {





    font-size: 14px;





    line-height: calc(40 / 28);





  }





  .qa_detail p+p {





    margin-top: 15px;





  }





  .qa_youtube {





    margin-bottom: 15px;





  }





  .qa_area {





    width: 100%;





    margin: 15px 0 0;





  }























}

















.comics {





  padding: 100px 0;





}





.comics_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.comics_ttl {





  width: 640px;





  position: relative;





  margin-bottom: 20px;





}





.comics_icon {





  position: absolute;





  width: 97px;





  left: 100%;





  top: 50%;





  transform: translateY(-50%);





  -webkit-transform: translateY(-50%);





  -ms-transform: translateY(-50%);





}





.comics_list {





  max-width: 840px;





}





.comics_more {





  position: relative;





  height: 60px;





  overflow: hidden;





}





.comics_more .btn {





  margin: 0 auto;





}





.comics_more .btn a {





  background: #119f42;





  color: #fff;





  cursor: pointer;





}





.comics_more .btn a::after {





  display: none;





}





@media (max-width: 1023px) {





  .comics_ttl {





    width: calc(640px * 0.85);





  }





  .comics_icon {





    width: calc(97px * 0.85);





  }





}





@media (max-width: 767px) {





  .comics {





    padding: 40px 0;





  }





  .comics_ttl {





    width: auto;





    display: -webkit-box;





    display: -ms-flexbox;





    display: flex;





    align-items: center;





    justify-content: center;





    margin-bottom: 0;





  }





  .comics_ttl>img {





    width: 270px;





  }





  .comics_icon {





    position: static;





    width: 38px;





    margin-left: 6px;





    transform: unset;





    -webkit-transform: unset;





    -ms-transform: unset;





    flex-shrink: 0;





  }





}





@media (max-width: 374px) {





  .comics_ttl>img {





    width: 240px;





  }





}











.strength {





  padding: 100px 0;





  background: #f9fdfb;





}





.strength_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.strength_ttl {





  width: 550px;





  position: relative;





  margin-bottom: 45px;





}





.strength_list>li {





  border: 4px solid #119f42;





  padding: 41px;





  background: #fff;





  position: relative;





  margin-bottom: 30px;





}





.strength_list>li:last-of-type {





  margin-bottom: 0;





}





.strength_list .point {





  width: 69px;





  margin-right: 20px;





}





.strength_list h3 {





  font-size: 30px;





  font-family: 'NotoSansJP-Medium';





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  border-bottom: 2px solid #119f42;





  padding-bottom: 20px;





  margin-bottom: 30px;





}





.strength h3 span {





  font-family: 'NotoSansJP-Black';





  color: #119f42;





}





.strength .qa {





  margin-top: 30px;





}





.strength_body {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  flex-flow: column;





}





.strength_detail {





  margin-bottom: 30px;





}





.strength_detail p {





  font-size: 18px;





  line-height: calc(28 / 18);





  text-align: justify;





}





.strength_detail p+p {





  margin-top: 30px;





}





.strength_detail .border {





  font-weight: bold;





  color: #119f42;





  border-bottom: 1px solid;





}





.strength_body.col {





  flex-flow: row;





}





.strength_body.col .strength_img {





  width: 580px;





  margin: 0 40px 0 0;





}





@media (max-width: 1023px) {





  .strength_ttl {





    width: calc(550px * 0.85);





  }





  .strength_body.col {





    flex-flow: column;





  }





  .strength_body.col .strength_img {





    width: 100%;





    margin: 0 0 30px 0;





  }





  .strength_body.col .btn {





    margin: 0 auto;





  }





}





@media (max-width: 767px) {





  .strength {





    padding: 40px 0;





  }





  .strength_ttl {





    width: 245px;





    margin-bottom: 15px;





  }





  .strength_list>li {





    border: 2px solid #119f42;





    padding: 15px;





    margin-bottom: 15px;





  }





  .strength_list .point {





    width: 35px;





    margin-right: 8px;





  }





  .strength_list h3 {





    font-size: 16px;





    line-height: calc(40 / 32);





    border-bottom: 1px solid #119f42;





    padding-bottom: 10px;





    margin-bottom: 15px;





  }





  .strength_list h3.mgt {





    margin-top: -3px;





  }





  .strength .qa {





    margin-top: 15px;





  }





  .strength_detail {





    margin-bottom: 15px;





  }





  .strength_detail p {





    font-size: 14px;





    line-height: calc(40 / 28);





  }





  .strength_detail p+p {





    margin-top: 15px;





  }





  .strength_body.col {





    flex-flow: column;





  }





  .strength_body.col .strength_img {





    width: 100%;





    margin: 0 0 15px 0;





  }











}

















.report {





  padding: 100px 0;





  background: #f7f7f7;





}





.report_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.report_ttl {





  width: 388px;





  margin-bottom: 30px;





}





.report_img {





  margin-bottom: 30px;





}





.report_detail {





  margin-bottom: 30px;





}





.report_detail p {





  font-size: 18px;





  line-height: calc(28 / 18);





  text-align: justify;





}





.report .btn {





  margin-bottom: 20px;





}





.report_link {





  font-size: 18px;





  color: #119f42;





  text-decoration: underline;





}





@media (max-width: 1023px) {





  .report_ttl {





    width: calc(388px * 0.85);





  }





}





@media (max-width: 767px) {





  .report {





    padding: 40px 0;





  }





  .report_ttl {





    width: 165px;





    margin-bottom: 15px;





  }





  .report_img {





    margin-bottom: 15px;





  }





  .report_detail {





    margin-bottom: 15px;





  }





  .report_detail p {





    font-size: 14px;





    line-height: calc(40 / 28);





  }





  .report .btn {





    width: 300px;





    max-width: 100%;





    margin-bottom: 15px;





  }





  .report_link {





    font-size: 14px;





  }





}

















.area {





  padding: 100px 0;





}





.area_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.area_ttl {





  width: 283px;





}





@media (max-width: 767px) {





  .area {





    padding: 40px 0;





  }





  .area_ttl {





    width: 119px

  }





}

















.voice {





  padding: 100px 0;





  background: #f7f7f7;





  overflow: hidden;





}





.voice_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.voice_ttl {





  width: 406px;





  margin-bottom: 50px;





}





.voice_list {





  width: 100%;





  margin-bottom: 15px;





}





.voice_list>li {





  padding: 30px;





  position: relative;





  margin-bottom: 30px;





}





.voice_list>li::after {





  content: "";





  position: absolute;





  height: 100%;





  width: 100vw;





  background: #d0efde;





  top: 0;





}





.voice_list>li:nth-of-type(2n+1)::after {





  right: 0;





}





.voice_list>li:nth-of-type(2n)::after {





  left: 0;





}





.voice_list>li:last-of-type {





  margin-bottom: 0;





}





.voice_box {





  background: #fff;





  padding: 42px 30px 30px;





  position: relative;





  z-index: 1;





}





.voice_head {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  padding-bottom: 20px;





  margin-bottom: 30px;





  border-bottom: 2px solid #119f42;





}





.voice_img {





  width: 132px;





  margin-right: 12px;





  flex-shrink: 0;





}





.voice_catch {





  margin-bottom: 18px;





}





.voice_catch p {





  font-size: 30px;





  font-family: 'NotoSansJP-Medium';





  line-height: calc(36 / 30);





  white-space: nowrap;





}





.voice_catch p .black {





  font-family: 'NotoSansJP-Black';





  color: #119f42;





}





.voice_catch .fs {





  font-size: 14px;





}











.voice_profile p {





  font-size: 18px;





  font-weight: bold;





}





.voice_profile p span {





  font-size: 14px;





  font-weight: bold;





}





.voice_body {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.voice_detail {





  margin-bottom: 30px;





}





.voice_detail p {





  font-size: 18px;





  line-height: calc(28 / 18);





  text-align: justify;





}





.voice_note {





  margin-left: auto;





}





.voice_note p {





  font-size: 14px;





}





@media (max-width: 1023px) {





  .voice_catch p {





    white-space: normal;





  }





  .voice_catch br.pc_only {





    display: none;





  }





}





@media (max-width: 767px) {





  .voice {





    padding: 40px 0;





  }





  .voice_ttl {





    width: 203px;





    margin-bottom: 15px;





  }





  .voice_list>li {





    padding: 15px;





    position: relative;





    margin-bottom: 15px;





  }





  .voice_list>li:nth-of-type(2n+1)::after {





    right: -15px;





  }





  .voice_list>li:nth-of-type(2n)::after {





    left: -15px;





  }





  .voice_box {





    padding: 15px;





  }





  .voice_head {





    padding-bottom: 15px;





    margin-bottom: 15px;





    border-bottom: 1px solid #119f42;





  }





  .voice_img {





    width: 61px;





    margin-right: 6px;





  }





  .voice_catch {





    margin-bottom: 9px;





  }





  .voice_catch p {





    font-size: 16px;





    line-height: calc(40 / 32);





    white-space: normal;





  }





  .voice_catch .fs {





    font-size: 10px;





  }





  .voice_profile p {





    font-size: 14px;





  }





  .voice_profile p span {





    font-size: 10px;





  }





  .voice_detail {





    margin-bottom: 15px;





  }





  .voice_detail p {





    font-size: 14px;





    line-height: calc(40 / 28);





  }





  .voice_note p {





    font-size: 12px;





  }





}





@media (max-width: 374px) {





  .voice_catch br {





    display: none;





  }





}

















.price {





  padding: 100px 0;





}





.price_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.price_ttl {





  width: 280px;





  margin-bottom: 45px;





}





.price_box {





  width: 100%;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





  border: 4px solid #119f42;





  padding: 41px;





  margin-bottom: 54px;





}





.price_box h3 {





  font-size: 40px;





  src: url('../font/NotoSansJP-Medium.otf');





  color: #119f42;





  margin-bottom: 16px;





}





.price_box h3 .black {





  font-family: 'NotoSansJP-Black';





}





.price_sub {





  margin-bottom: 30px;





}





.price_sub p {





  font-size: 24px;





}





.price_detail {





  width: 100%;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





  padding: 20px 0 25px;





  background: #fcfaf0;





  margin-bottom: 30px;





}





.price_txt {





  font-size: 24px;





  font-family: 'NotoSansJP-Black';





  color: #119f42;





  margin-bottom: 6px;





  position: relative;





  display: table;





}





.price_txt::before,





.price_txt::after {





  content: "";





  position: absolute;





  width: 100px;





  height: 2px;





  top: 50%;





  background: #119f42;





  transform: translateY(-50%);





  -webkit-transform: translateY(-50%);





  -ms-transform: translateY(-50%);





}





.price_txt::before {





  right: calc(100% + 16px);





}





.price_txt::after {





  left: calc(100% + 16px);





}





.price_yen {





  font-size: 60px;





  font-family: futura-pt, sans-serif;





  font-weight: 600;





  color: #119f42;





  margin-bottom: 15px;





}





.price_yen .num {





  font-size: 70px;





  font-weight: 600;





}





.price_yen .tax {





  font-size: 24px;





  font-weight: 600;





}





.price_note {





  font-size: 18px;





}





.price_option {





  width: 100%;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  justify-content: space-between;





}





.price_option>div {





  width: calc((100% - 24px) / 2);





  text-align: center;





}





.price_option dt {





  font-size: 24px;





  font-weight: bold;





  background: #119f42;





  color: #fff;





  height: 52px;





  line-height: 52px;





}





.price_option dd {





  font-size: 24px;





  font-weight: bold;





  background: #ecf7f1;





  height: 52px;





  line-height: 52px;





}





.price_option dd .num {





  font-size: 34px;





  font-weight: bold;





}





.price_option dd span {





  font-size: 14px;





  margin-left: 5px;





}





@media (max-width: 1023px) {





  .price_ttl {





    width: calc(280px * 0.85);





  }





  .price_yen {





    font-size: 40px;





  }





  .price_yen .num {





    font-size: 60px;





  }





  .price_yen .tax {





    font-size: 20px;





  }





  .price_option dd {





    font-size: 20px;





  }





  .price_option dd .num {





    font-size: 30px;





  }





  .price_option dd span {





    font-size: 12px;





  }





}





@media (max-width: 767px) {





  .price {





    padding: 40px 0;





  }





  .price_ttl {





    width: 118px;





    margin-bottom: 15px;





  }





  .price_box {





    border: 2px solid #119f42;





    padding: 15px;





    margin-bottom: 15px;





  }





  .price_box h3 {





    font-size: 20px;





    margin-bottom: 10px;





  }





  .price_sub {





    margin-bottom: 14px;





  }





  .price_sub p {





    font-size: 14px;





    line-height: calc(40 / 28);





    text-align: center;





  }





  .price_detail {





    padding: 7px 0 10px;





    margin-bottom: 15px;





  }





  .price_txt {





    font-size: 16px;





    margin-bottom: 4px;





  }





  .price_txt::before,





  .price_txt::after {





    width: 38px;





    height: 1px;





  }





  .price_txt::before {





    right: calc(100% + 5px);





  }





  .price_txt::after {





    left: calc(100% + 5px);





  }





  .price_yen {





    font-size: 22px;





  }





  .price_yen .num {





    font-size: 28px;





  }





  .price_yen .tax {





    font-size: 10px;





  }





  .price_note {





    font-size: 10px;





  }





  .price_option {





    flex-flow: column;





  }





  .price_option>div {





    width: 100%;





  }





  .price_option dt {





    font-size: 14px;





    height: 26px;





    line-height: 26px;





  }





  .price_option dd {





    font-size: 14px;





    height: 26px;





    line-height: 26px;





  }





  .price_option dd .num {





    font-size: 17px;





  }





  .price_option dd span {





    font-size: 10px;





  }





}





@media (max-width: 374px) {





  .price_yen {





    font-size: 20px;





  }





  .price_yen .num {





    font-size: 25px;





  }





}

















.contact {





  padding: 100px 0;





}





.contact_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.contact_ttl {





  width: 346px;





  margin-bottom: 30px;





}





.contact_sub {





  margin-bottom: 30px;





}





.contact_sub p {





  font-size: 24px;





}





.contact_box {





  width: 100%;





  background-image: -moz-linear-gradient(-45deg, rgb(83, 183, 33) 0%, rgb(50, 171, 50) 22%, rgb(17, 159, 66) 100%);





  background-image: -webkit-linear-gradient(-45deg, rgb(83, 183, 33) 0%, rgb(50, 171, 50) 22%, rgb(17, 159, 66) 100%);





  background-image: -ms-linear-gradient(-45deg, rgb(83, 183, 33) 0%, rgb(50, 171, 50) 22%, rgb(17, 159, 66) 100%);





  padding: 30px;





}





.formrun {





  padding: 15px 15px 30px;





  background: #fff;





}





.formrun>dl {





  padding: 20px 0 15px;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  border-bottom: 1px solid #cccccc;





}





.formrun>dl:nth-of-type(2n+1) {





  background: #f7f7f7;





}





.formrun>dl:nth-of-type(2n) {





  background: #fff;





}





.formrun dt {





  width: 260px;





  height: 55px;





  margin-right: 30px;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  justify-content: flex-end;





  flex-shrink: 0;





}





.formrun label {





  font-size: 22px;





  font-weight: bold;





}





.formrun dd {





  width: 100%;





  max-width: 500px;



}



.formrun dd p {



  font-size: 22px;

  display: inline;



}



.formrun dd[type="checkbox"] {



  padding: 15px;



}





.formrun input,





.formrun select {





  font-size: 22px;





  padding: 13px 15px;





  width: 100%;





  border: 1px solid #cccccc;





  border-radius: 5px;





  margin-bottom: 5px;





  box-sizing: border-box;





}



.formrun input[type="checkbox"] {

  width: auto;

}



.formrun textarea {





  font-size: 22px;





  padding: 13px 15px;





  width: 100%;





  height: 150px;





  border: 1px solid #cccccc;





  border-radius: 5px;





  margin-bottom: 5px;





  box-sizing: border-box;





}





.formrun ::placeholder {





  color: #cccccc;





}





.formrun_btn {





  width: 375px;





  height: 66px;





  position: relative;





  margin: 30px auto 0;





}





.formrun_btn::after {





  content: "";





  position: absolute;





  background: #983c0e;





  width: 100%;





  height: 100%;





  border-radius: 100px;





  top: 5px;





  left: 0;





}





.formrun_btn button {





  font-size: 24px;





  font-family: 'NotoSansJP-Bold';





  background: #f46337;





  color: #fff;





  height: 100%;





  width: 100%;





  border: 0;





  border-radius: 50px;





  cursor: pointer;





  position: relative;





  z-index: 2;





}





.formrun_btn button::after {





  content: "";





  position: absolute;





  right: 30px;





  width: 9px;





  height: 9px;





  border-top: 3px solid #fff;





  border-right: 3px solid #fff;





  top: 50%;





  transform: translateY(-50%) rotate(45deg);





  -webkit-transform: translateY(-50%) rotate(45deg);





  -ms-transform: translateY(-50%) rotate(45deg);





}











.formrun .must {





  font-size: 12px;





  color: #fff;





  padding: 6px 12px;





  background: #c00f39;





  margin-left: 15px;





}





.formrun .optional {





  font-size: 12px;





  color: #fff;





  padding: 6px 12px;





  background: #1a1a77;





  margin-left: 15px;





}





.formrun .error {





  font-size: 20px;





  color: #c00f39;





}











@media (min-width: 768px) {





  .formrun_btn button:hover {





    transform: translateY(5px);





    -webkit-transform: translateY(5px);





    -ms-transform: translateY(5px);





  }





}





@media (max-width: 1023px) {





  .contact_ttl {





    width: calc(346px * 0.85);





  }





}





@media (max-width: 767px) {





  .contact {





    padding: 40px 0;





  }





  .contact_ttl {





    width: 148px;





    margin-bottom: 15px;





  }





  .contact_sub {





    margin-bottom: 15px;





  }





  .contact_sub p {





    font-size: 14px;





  }





  .contact_box {





    padding: 15px;





  }





  .formrun {





    padding: 10px 10px 17px;





  }





  .formrun>dl {





    padding: 15px 15px 10px;





    flex-flow: column;





  }





  .formrun dt {





    width: 100%;





    height: auto;





    margin: 0 0 6px;





    justify-content: flex-start;





  }





  .formrun label {





    font-size: 14px;





  }





  .formrun input,





  .formrun select {





    font-size: 14px;





    padding: 6px 7px;





  }





  .formrun textarea {





    font-size: 14px;





    padding: 6px 7px;





    height: 90px;





  }





  .formrun_btn {





    width: 250px;





    height: 40px;





    margin: 16px auto 0;





  }





  .formrun_btn::after {





    top: 3px;





  }





  .formrun_btn button {





    font-size: 16px;





  }





  .formrun_btn button::after {





    right: 15px;





    width: 5px;





    height: 5px;





    border-top: 2px solid #fff;





    border-right: 2px solid #fff;





  }





  .formrun .must {





    font-size: 10px;





    padding: 2px 4px;





    margin-left: 7px;





  }





  .formrun .optional {





    font-size: 10px;





    padding: 3px 6px;





    margin-left: 7px;





  }





  .formrun .error {





    font-size: 12px;





  }











}

















.media {





  padding: 100px 0;





  background: #ecf7f1;





}





.media_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.media_ttl {





  width: 626px;





  margin-bottom: 51px;





}





.media_list {





  width: 100%;





}





.media_list>li {





  width: 100%;





  border: 4px solid #119f42;





  padding: 41px;





  background: #fff;





  position: relative;





  margin-bottom: 30px;





}





.media_list>li:last-of-type {





  margin-bottom: 0;





}





.media_list h3 {





  font-size: 30px;





  font-weight: bold;





  height: 66px;





  line-height: 66px;





  text-align: center;





  background: #119f42;





  color: #fff;





  margin-bottom: 32px;





  position: relative;





}





.media_list h3::before,





.media_list h3::after {





  position: absolute;





  content: '';





  width: 0px;





  height: 0px;





  z-index: 1;





}





.media_list h3:before {





  top: 0;





  left: 0;





  border-width: 33px 0px 33px 20px;





  border-color: transparent transparent transparent #fff;





  border-style: solid;





}





.media_list h3:after {





  top: 0;





  right: 0;





  border-width: 33px 20px 33px 0px;





  border-color: transparent #fff transparent transparent;





  border-style: solid;





}





.media_youtube {





  width: 100%;





}





.media_collaboration,





.media_technique {





  width: 100%;





}





.media_collaboration .youtube,





.media_technique .youtube {





  margin: 0 8px;





  text-align: center;





}





.media_collaboration img,





.media_technique img {





  margin-bottom: 14px;





}





.media_collaboration p,





.media_technique p {





  font-size: 14px;





  color: #119f42;





  text-decoration: underline;





  white-space: nowrap;





}





.slick-dots {





  bottom: -30px;





}





.slick-dots li {





  margin: 0 6px;





  width: 9px;





  height: 9px;





}











.slick-dots li button:before,





.slick-dots li.slick-active button:before {





  background: #000;





  border-radius: 20px;





  width: 9px;





  height: 9px;





  content: "";





}





.slick-list {





  width: 100%;





  height: 100%;





}





.slick-track {





  height: 100%;





}





@media (max-width: 1023px) {





  .media_ttl {





    width: calc(626px * 0.85);





  }





}





@media (max-width: 767px) {





  .media {





    padding: 40px 0;





  }





  .media_ttl {





    width: 263px;





    margin-bottom: 11px;





  }





  .media_list>li {





    border: 2px solid #119f42;





    padding: 15px;





    margin-bottom: 15px;





  }





  .media_list h3 {





    font-size: 16px;





    height: 32px;





    line-height: 32px;





    margin-bottom: 15px;





  }





  .media_list h3:before {





    border-width: 18px 0px 18px 12px;





    top: -2px;





    left: -1px;





  }





  .media_list h3:after {





    border-width: 18px 12px 18px 0px;





    top: -2px;





    right: -1px;





  }





  .media_collaboration .youtube,





  .media_technique .youtube {





    margin: 0;





  }





  .media_collaboration img,





  .media_technique img {





    margin-bottom: 10px;





  }





  .media_collaboration p,





  .media_technique p {





    font-size: 12px;





    line-height: 1.5;





    white-space: normal;





    text-align: center;





  }





  .slick-dots li {





    margin: 0 6px;





    width: 4px;





    height: 4px;





  }





}

















.why {





  padding: 100px 0;





}





.why_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.why_ttl {





  width: 367px;





  position: relative;





  margin-bottom: 54px;





}





.why_icon {





  position: absolute;





  width: 164px;





  left: calc(100% + 6px);





  top: 50%;





  transform: translateY(-50%);





  -webkit-transform: translateY(-50%);





  -ms-transform: translateY(-50%);





}





.why_list {





  position: relative;





}





.why_list::before {





  content: "";





  position: absolute;





  right: 0;





  top: -20px;





  left: 0;





  width: 0px;





  height: 0px;





  margin: auto;





  border-style: solid;





  border-color: #119f42 transparent transparent transparent;





  border-width: 48px 90px 0 90px;





}





.why_list>li {





  background: #ecf7f1;





  padding: 45px;





}





.why_list h3 {





  font-size: 40px;





  font-family: 'NotoSansJP-Medium';





  line-height: calc(50 / 40);





  text-align: center;





  border-bottom: 2px solid #119f42;





  padding-bottom: 30px;





  margin-bottom: 30px;





}





.why_list h3 span {





  font-family: 'NotoSansJP-Black';





  color: #119f42;





}











.why_detail {





  margin-bottom: 30px

}





.why_detail p {





  font-size: 18px;





  line-height: calc(28 / 18);





  text-align: justify;





}





.why_detail p+p {





  margin-top: 30px;





}





.why_detail .border {





  font-weight: bold;





  color: #119f42;





  border-bottom: 1px solid;





}





.why_img {





  margin-bottom: 30px;





}





@media (max-width: 1023px) {





  .why_ttl {





    width: calc(367px * 0.85);





  }





  .why_icon {





    width: calc(164px * 0.85);





  }





}





@media (max-width: 767px) {





  .why {





    padding: 40px 0;





  }





  .why_ttl {





    width: 271px;





    margin-bottom: 25px;





  }





  .why_icon {





    display: none;





  }





  .why_list::before {





    top: -10px;





    border-width: 24px 45px 0 45px;





  }





  .why_list>li {





    padding: 28px 15px 15px;





  }





  .why_list h3 {





    font-size: 16px;





    line-height: calc(40 / 32);





    padding-bottom: 15px;





    margin-bottom: 15px;





  }





  .why_detail {





    margin-bottom: 15px

  }





  .why_detail p {





    font-size: 14px;





    line-height: calc(40 / 28);





  }





  .why_detail p+p {





    margin-top: 15px;





  }





  .why_img {





    margin-bottom: 15px;





  }





}

















.trouble {





  padding: 100px 0;





  background: #f7f7f7;





}





.trouble_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.trouble_ttl {





  width: 660px;





  position: relative;





  margin-bottom: 45px;





}





.trouble_list {





  width: 100%;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-wrap: wrap;





  justify-content: space-between;





}





.trouble_list>li {





  width: calc((100% - 30px) / 2);





  border: 4px solid #119f42;





  padding: 26px;





  background: #fff;





  position: relative;





  margin-bottom: 30px;





}





.trouble_list>li:last-of-type,





.trouble_list>li:nth-last-of-type(2) {





  margin-bottom: 0;





}





.trouble_list .case {





  width: 58px;





  margin-right: 12px;





}





.trouble_list h3 {





  font-size: 21px;





  font-family: 'NotoSansJP-Medium';





  line-height: calc(28 / 22);





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  border-bottom: 2px solid #119f42;





  padding-bottom: 20px;





  margin-bottom: 20px;





  white-space: nowrap;





}





.trouble h3 span {





  font-family: 'NotoSansJP-Black';





  color: #119f42;





}





.trouble_body {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





  flex-flow: column;





}





.trouble_img {





  margin-bottom: 20px;





}





.trouble_detail p {





  font-size: 18px;





  line-height: calc(28 / 18);





  text-align: justify;





}





@media (max-width: 1023px) {





  .trouble_list>li,





  .trouble_list>li:nth-last-of-type(2) {





    width: 100%;





    margin-bottom: 30px;





  }





}





@media (max-width: 767px) {





  .trouble {





    padding: 40px 0;





  }





  .trouble_ttl {





    width: 290px;





    margin-bottom: 15px;





  }





  .trouble_list>li,





  .trouble_list>li:nth-last-of-type(2) {





    width: 100%;





    border: 2px solid #119f42;





    padding: 15px;





    margin-bottom: 15px;





  }





  .trouble_list .case {





    width: 35px;





    margin-right: 10px;





  }





  .trouble_list h3 {





    font-size: 16px;





    line-height: calc(40 / 32);





    border-bottom: 1px solid #119f42;





    padding-bottom: 10px;





    margin-bottom: 15px;





    white-space: normal;





  }





  .trouble_img {





    margin-bottom: 15px;





  }





  .trouble_detail p {





    font-size: 14px;





    line-height: calc(40 / 28);





  }





}





@media (max-width: 374px) {





  .trouble_ttl {





    width: 270px;





  }





  .trouble_list h3 br {





    display: none;





  }





}

















.helps {





  padding: 100px 0;





  background: #ecf7f1;





}





.helps_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





}





.helps_ttl {





  width: 810px;





  position: relative;





  margin-bottom: 30px;





}





.helps_list {





  width: 100%;





}





.helps_list>li {





  position: relative;





  margin-bottom: 30px;





}





.helps_list>li:last-of-type {





  margin-bottom: 0;





}





.helps_list>li a {





  border: 4px solid #119f42;





  padding: 41px;





  background: #fff;





  display: block;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  align-items: center;





}





.helps_list>li a .num {





  font-size: 22px;





  font-weight: bold;





  text-align: center;





  color: #fff;





  width: 40px;





  height: 40px;





  line-height: 40px;





  border-radius: 40px;





  background: #119f42;





  display: block;





  margin-right: 8px;





  flex-shrink: 0;





}





.helps_list>li p {





  font-size: 22px;





  font-weight: bold;





  line-height: calc(24 / 22);





  color: #119f42;





}





@media (max-width: 1023px) {





  .helps_ttl {





    width: calc(810px * 0.85);





  }





}





@media (max-width: 767px) {





  .helps {





    padding: 40px 0;





  }





  .helps_ttl {





    width: 338px;





    margin-bottom: 15px;





  }





  .helps_list>li {





    margin-bottom: 15px;





  }





  .helps_list>li a {





    border: 2px solid #119f42;





    padding: 15px;





  }





  .helps_list>li a .num {





    font-size: 11px;





    width: 20px;





    height: 20px;





    line-height: 20px;





    margin-right: 5px;





  }





  .helps_list>li p {





    font-size: 16px;





    line-height: calc(40 / 32);





  }





}





@media (max-width: 374px) {





  .helps_ttl {





    width: 100%;





  }





}











.footer {





  padding: 45px 0;





}





.footer_inner {





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





  justify-content: center;





}





.footer a {





  font-size: 14px;





  color: #119f42;





  text-decoration: underline;





}





.footer_logo {





  width: 260px;





}





.footer_copyright {





  font-size: 14px;





  line-height: calc(24 / 14);





  text-align: center;





}





@media (max-width: 767px) {





  .footer {





    padding: 30px 0;





  }





  .footer a {





    font-size: 10px;





  }





  .footer_logo {





    width: 130px;





    margin-bottom: 3px;





  }





  .footer_copyright {





    font-size: 10px;





    line-height: calc(32 / 20);





  }





}

















.btmcta {





  position: fixed;





  bottom: 0;





  right: 0;





  width: 435px;





  padding: 20px 30px;





  background: rgba(255, 255, 255, 0.6);





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  flex-flow: column;





  align-items: center;





  z-index: 10;





}





.btmcta_ttl {





  width: 340px;





}





.btmcta_box {





  width: 100%;





}





.btmcta_30min,





.btmcta_tel,





.btmcta_mail {





  width: 100%;





  height: 66px;





  position: relative;





  margin-bottom: 25px;





}





.btmcta_30min::after,





.btmcta_tel::after,





.btmcta_mail::after {





  content: "";





  position: absolute;





  width: 100%;





  height: 100%;





  border-radius: 100px;





  top: 5px;





  left: 0;





}





.btmcta_30min::after {





  background: #9a1339;





}





.btmcta_tel::after {





  background: #101047;





}





.btmcta_mail::after {





  background: #983c0e;





}





.btmcta_30min a,





.btmcta_tel a,





.btmcta_mail a {





  font-size: 24px;





  font-family: 'NotoSansJP-Bold';





  color: #fff;





  height: 100%;





  border-radius: 100px;





  display: -webkit-box;





  display: -ms-flexbox;





  display: flex;





  justify-content: center;





  align-items: center;





  position: relative;





  z-index: 2;





}





.btmcta_30min a {





  font-size: 30px;





  padding: 6px 0 15px;





  align-items: baseline;





  background: #c00f39;





  box-sizing: border-box;





}





.btmcta_30min a .num {





  font-size: 1.5em;





  font-family: 'NotoSansJP-Bold';





}





.btmcta_tel a {





  background: #1a1a77;





}





.btmcta_mail a {





  background: #f46337;





}





.btmcta_tel a .fas {





  transform: rotate(90deg);





  -webkit-transform: rotate(90deg);





  -ms-transform: rotate(90deg);





  margin-right: 8px;





}





.btmcta_mail a .fas {





  margin-right: 8px;





}



.disclaimer{

  margin-top: 16px;

}











@media (min-width: 768px) {





  .btmcta_30min a:hover,





  .btmcta_tel a:hover,





  .btmcta_mail a:hover {





    transform: translateY(5px);





    -webkit-transform: translateY(5px);





    -ms-transform: translateY(5px);





  }





}











@media (max-width: 1800px) {





  .btmcta {





    width: 300px;





    padding: 10px 20px;





  }





  .btmcta_ttl {





    width: 200px;





  }





  .btmcta_30min,





  .btmcta_tel,





  .btmcta_mail {





    height: 44px;





    margin-bottom: 15px;





  }





  .btmcta_30min a,





  .btmcta_tel a,





  .btmcta_mail a {





    font-size: 16px;





  }





  .btmcta_30min a {





    font-size: 18px;











  }





}





@media (max-width: 1530px) {





  .btmcta {





    display: none;





  }





}

















.js-modal-youtube {





  position: relative;





  display: block;





  cursor: pointer;





}





.js-modal-youtube::before {





  content: "";





  position: absolute;





  top: 50%;





  left: 50%;





  transform: translate(-50%, -50%);





  -webkit-transform: translate(-50%, -50%);





  -ms-transform: translate(-50%, -50%);





  width: 84px;





  height: 60px;





  background-image: url(../img/top/yt_icon_mono_light.png);





  background-size: 100%;





  opacity: .90;





  transition: .5s;





}





.js-modal-youtube:hover::before {





  background-image: url(../img/top/yt_icon_rgb.png);





}





@media (max-width: 767px) {





  .js-modal-youtube::before {





    width: 42px;





    height: 30px;





  }





}

.qa_checkbox {
  display: none;
}

.qa_answer {
  display: none;
}

.qa_answer_inner {
  padding: 30px;
  background: #f7f7f7;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/* チェックボックスがチェックされた時の表示制御 */
.qa_checkbox:checked + .qa_question + .qa_answer {
  display: block;
}

/* 質問部分のカーソルスタイル追加 */
.qa_question {
  cursor: pointer;
}