@charset "utf-8";


/* -----------------------------------------------------------
main
------------------------------------------------------------*/
@media screen and (min-width:768px) {
  .sp {
    display: none!important;
  }
}
@media screen and (max-width:767px) {
  .pc {
    display: none!important;
  }
  #main {
    margin-top:60px;
  }
}


/* -----------------------------------------------------------
slick slide
------------------------------------------------------------*/
/* カルーセル */
.carousel-wrap {
  overflow: hidden;
  position: relative;
}
.carousel-wrap .slick-slide {
  overflow: hidden;
}
.slider-container {
  display: none;
  position: relative;
	padding:32px 0 0;
}
.slider-container.initialized {
  display:block;
}
.slick-list {
  margin-right: -15px;
}
.slick-slide {
  margin: 0 15px 0 0;
}
.slick-slide img {
  margin:auto;
}
.slick-txt {
  margin:0.5em 0 0;
  display: block;
  line-height: 1.4;
  text-align: center;
}

/* 以下、削除・確認 */
.slick-prev:before {
  content:"";
  position: absolute;
  top:0;
  bottom:0;
  left:-20px;
  margin:auto;
  background: url(../img/slide-prev.png) no-repeat 0 0;
  width:24px;
  height:40px;
}
.slick-next:before {
  content:"";
  position: absolute;
  top:0;
  bottom:0;
  right:-20px;
  margin:auto;
  background: url(../img/slide-next.png) no-repeat 0 0;
  width:24px;
  height:40px;
}
.slider-arrow {
  position: absolute;
  top: 50%;
  height: 36px;
  margin-top: -15px;
  color: #27B8B8;
  line-height: 36px;
  font-size: 28px;
  cursor: pointer;
  z-index: 10;
}
.slider-prev {
	left: 0;
	background: url(../img/arrow-prev.png)no-repeat 0 0;
	background-size: 34px 60px;
	top: 50%;
	width: 34px;
	height: 60px;
	margin-top:-30px;
	z-index: 11;
}
.slider-next {
  right: 0;
	background: url(../img/arrow-next.png)no-repeat 0 0;
	background-size: 100%;
	top: 50%;
	width: 34px;
	height: 60px;
	margin-top:-30px;
	z-index: 11;
}
.slider-arrow:hover {
opacity:0.7;
}


/*--------------------------------------------
home
----------------------------------------------*/
#home-mv {
  margin:12px auto;
  padding:0 2%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
  position: relative;
}
#home-mv img {
  position: absolute;
  top: 0;
  left: 0;
  right:0;
  margin:auto;
  width: 96%;
  object-fit: cover;
  z-index: -1;
  border-radius: 2em;
}
.home-mv-inner {
  padding-top:4.5em;
  line-height: 1.2;
  width: 1200px;
  max-width:100%;
  margin: 0 auto;
  text-align: center;
  position: relative;
}
.home-mv-inner * {
  color: #fff;
}
.home-mv-catch {
  line-height: 1.2;
  font-weight: bold;
  margin-bottom:0.8em;
  width:100%;
  letter-spacing: 0.15em;
  text-shadow: 0 0 8px rgba(0,85,170,0.5)
}
.home-mv-txt {
  width: 100%;
  font-weight: 500;
  letter-spacing: 0.25em;
  position: relative;
  text-shadow: 0 0 7px rgba(0,85,170,1)
}
#top-nav {
  max-width:1200px;
  width: 94%;
  margin:-4.8rem auto 0;
  background-color: #fff;
  border-radius: 1rem;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
  position: relative;
  z-index: 1;
}
#top-nav ul {
  display: flex;
  justify-content: space-around;
  align-items: center;
  align-content: center;
  line-height: 1.2;
}
#top-nav ul,
.top-nav a {
  position: relative;
  z-index: 1;
}
.top-nav-ttl {
  text-align: center;
  color: #0055AA;
  font-weight: bold;
  padding:0 1em;
}
.top-nav {
  position: relative;
  background-size: 1.6em!important;
}
.top-nav a {
  color: #222;
  font-weight: bold;
  display: flex;
  align-items: center;
  align-content: center;
  line-height: 1.2;
  letter-spacing: 0.1em;
  font-size: 1.5rem;
}
.top-nav1 {
  background: url(../img/common/top-nav1.svg)no-repeat 0 center;
}
.top-nav2 {
  background: url(../img/common/top-nav2.svg)no-repeat 0 center;
}
.top-nav3 {
  background: url(../img/common/top-nav3.svg)no-repeat 0 center;
}
.top-nav4 {
  background: url(../img/common/top-nav4.svg)no-repeat 0 center;
}
.top-nav5 {
  background: url(../img/common/top-nav5.svg)no-repeat 0 center;
}
.top-chara {
  position: absolute;
  right: 0;
  bottom:-4%;
  width:274px;
  max-width:22.8%;
  max-height: 209px;
  height: calc(209/1440*100vw);
  z-index: 2;
}
.bg-top {
  position: relative;
}
.bg-top:before {
  content:"";
  position: absolute;
  top:-5rem;
  left:0;
  width:100%;
  height: calc(100% + 5rem);
  background: linear-gradient(to bottom,  #f8f3f3 0%,#ffffff 100%);
  z-index: -2;
}
.bg-top.bg-lb:before {
  background: #E9F3FD;
}
.bg-top.bg-lb {
  border-radius: 0 clamp(4rem, 8vw, 11rem);
}

.lower .bg-top:before {
  top:-20rem;
}
.top-case-ttl {
  text-align: center;
  font-size: 3.2rem;
  margin-bottom:1.5em;
  letter-spacing: 0.06em;
  line-height: 1.6;
}
/* .lower #top-nav ul {
  justify-content: center;
} */

.lower .top-chara {
  right: 2%;
  bottom: 0;
  width: 220px;
  top: 0;
  margin: auto;
  align-items: center;
  display: flex;
  justify-content: center;
  height: calc(160 / 1440 * 100vw);
}
.lower .top-chara img {
  max-height: 200px;
  max-width:180px;
}

@media screen and (min-width:768px) and (max-width:1400px) {
  .top-case-ttl {
    font-size: calc(30/1200*100vw);
  }
  .home-mv-catch {
     font-size: calc(38/1400*100vw);
  }
  .home-mv-txt {
     font-size: calc(22/1400*100vw);
  }
}

@media screen and (min-width:768px) and (max-width:1280px) {
  .top-chara {
    width:calc(209/1000*100vw);
  }
  .top-nav a,
  .top-nav-ttl {
    font-size: calc(15/1280*100vw);
  }


}

@media screen and (min-width:768px) {
  .home-mv-catch {
    font-size: 4.2rem;
  }
  .home-mv-txt {
    font-size: 2.7rem;
  }
  #home-mv, .home-mv-inner, .home-mv-img {
    height: calc(480/1400*100vw);
    max-height: 520px;
  }
  .top-nav a {
    padding:2.5rem 1.5rem 2.5rem 2.8rem;
  }
  #top-nav {
    padding:0 12% 0 2%;
  }
  /*
  .lower .topnav {
    padding-right:2%;
  }
  .lower #top-nav {
    padding-right:2%;
  }
  .lower #top-nav ul {
    justify-content: center;
    gap:0 1%;
  } */
  .top-nav:before {
    content:"";
    position: absolute;
    top:0;
    bottom:0;
    right:0;
    margin:auto;
    width:1px;
    height: 65%;
    background-color: #D8E2E3;
  }
}

@media screen and (max-width:767px) {
  .home-mv-catch {
    font-size: 4.5vw;
  }
  .home-mv-txt {
    font-size: 2.8vw;
  }
  #home-mv, .home-mv-inner, .home-mv-img {
      height: calc(380/767*100vw);
  }
  .home-mv-inner {
    padding-top: 3em;
  }
  .top-nav a {
    padding: 1em 1em 1em 3em;
    font-size: 1em;
    white-space: nowrap;
    color: #444;
  }
  #top-nav {
    padding:1em 0 0;
    margin-top:0;
  }
  #top-nav ul {
    flex-wrap:wrap;
    justify-content: flex-start;
  }
  .top-nav-ttl {
    width:100%;
    font-size: 1.1em;
  }
  .top-nav {
    width:50%;
    background-position: 1em center;
    border-bottom:1px solid #D8E2E3;
  }
  .top-chara {
    bottom: 6%;
    max-width: 40%;
  }
  .lower .top-chara{
    height: calc(180 / 767 * 100vw);
    justify-content:flex-end;
  }
  .lower .top-chara img {
    max-height: 100px;
  }
  .top-nav4 {
    border-bottom:none;
  }
  .top-case-ttl {
    font-size: 2rem;
    margin: 1rem 0 3rem;
  }
  #home-mv img {
    border-radius: 2rem;
  }
  #top-case {
    padding-bottom:8rem;
  }
}

/* -----------------------------------------------------------
	home
------------------------------------------------------------*/
.txt * {
  font-size: 1em;
}
.ttl-wave {
  margin:0 auto;
  padding-bottom:1.5em;
  text-align: center; 
  position: relative;
}
.ttl-wave:after {
  content:"";
  position: absolute;
  bottom:0;
  left:0;
  right: 0;
  margin:auto;
  background:url(../img/common/ttl-wave.svg)no-repeat center 0;
  background-size: 12rem;
  width:100%;
  height: 1em;
}
.home-menu li {
  background-color: #fff;
  border-radius: 1em;
  border:4px solid #27B8B8;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.16);
  overflow: hidden;
}
.home-menu img {
  width:100%;
}
.home-menu li a {
  display: block;
  color: #222;
}
.home-menu-flex {
  display: flex;
  flex-wrap:wrap;
}
.home-menu02 li {
  margin-bottom:2em;
}
.home-menu02 li a {
  padding:3.3% 3.3%;
  color: #222;
}
.home-menu-flex figure {
  width:43%;
}
.home-menu-flex-txt {
  width:57%;
  padding-left:5%;
  margin-top: 0.5em;
}
.home-menu-ttl {
  color: #27B8B8;
  text-align: center;
  margin:0;
}
.home-menu p {
  margin:0;
  line-height: 1.4;
}
p.home-menu-sub {
  margin:0;
  line-height: 1.4;
  padding:1em 1.5rem 1.3em;
  border-top:2px solid rgba(39,184,184,0.3);
}
.home-menu-flex-txt p {
  margin-top:1em;
}
.bg-customer {
  position: relative;
}
.bg-customer:before {
  content:"";
  position: absolute;
  top:0;
  left:0;
  background: linear-gradient(to bottom,  rgba(47,199,199,0.5) 0%,rgba(255,255,255,1) 100%);
  width:100%;
  height: 60%;
}
.home-customer {
  display: flex;
  gap: 0 1.5%;
}
.home-customer li {
  width:21%;
  background-color: #fff;
  border-radius: 10px;
  padding: 0;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.15);
  position: relative;
  overflow: hidden;
}
.home-customer li img {
  width:100%;
}
.home-customer-ttl {
  text-align: center;
  padding:1rem;
  color: #27B8B8;
}
.home-customer-txt {
  padding:0 1rem 1.5em;
  font-size: 92%;
  line-height: 1.6;
  margin:0;
  color: #555;
}
.home-topics-ttl-area {
  border-top:1px solid #ddd;
  margin:0;
  position: relative;
}
.home-topics-ttl-area:before {
  content:"";
  position: absolute;
  left:0;
  top:0;
  width:32px;
  height: 6px;
  border-radius: 0 0 4px 4px;
  background-color: #27B8B8;
}
.home-topics-en {
  margin-right: 1em;
  font-weight: 500;
  line-height: 1.3;
  vertical-align: middle;
}
.home-topics-jp {
  font-size: 70%;
}
.btn-more a {
  color: #333;
  padding:2rem 5rem 2rem 2rem;
  background:url(../img/common/btn-more.svg)no-repeat right center;
  background-size:2.4em;
}

.gm-style .review-box {
  display: none!important;
}

/* label
------------------------------------------------------------*/
.day-label {
  display: flex;
}
.day-label .day {
  width:6em;
}
.day-label .label {
  min-width:8em;
}
.day-cate {
  display: flex;
  flex-wrap:wrap;
}
.day {
  font-size: 94%;
  color: #666;
  font-weight: bold;
  margin-right: 1em;
  margin-top: 0.1em;
}
.label {
  font-size:12px;
  padding:3px 1.5em;
  color:#fff;
  background-color: #707070;
  border-radius: 10em;
  line-height: 1;
  text-align:center;
  height:2em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.topics-archive a {
  color: inherit;
  display: block;
}
.topics-archive dl {
  border-bottom:1px solid #ddd;
}

@media screen and (min-width:768px) {
  .ttl-wave {
    font-size: 3.8rem;
  }
  .ttl-wave.l {
    font-size:4.2rem;
  }
  .ttl-wave.m {
    font-size: 3.6rem;
  }
  .ttl-wave.s {
    font-size: 3.2rem;
  }
  .ttl-wave.mb {
    margin-bottom:4rem;
  }
  .home-menu01 ul {
    display: flex;
    flex-wrap:wrap;
    margin:0 -1.5% -2.5em;
  }
  .home-menu li {
    margin:0 1.5% 2.5em;
  }
  .home-menu01 li {
    width:30.333%;
  }
  .home-menu-ttl {
    font-size: 2.6rem;
    height: 3.2em;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap:wrap;
    line-height: 1.2;
  }
  .home-customer-ttl {
    font-size: 2.2rem;
  }
  .topics-archive dl {
    display: flex;
    padding:2.5rem 0;
  }
  .topics-archive dt {
    width:14em;
  }
  .topics-archive dd {
    width:calc(100% - 14em);
    padding-left:1em;
  }
  .home-topics-en {
    font-size: 1.6em;
  }
}

@media screen and (min-width:768px) and (max-width:1400px) {
  .ttl-wave {
    font-size: calc(38/1200*100vw);
  }
  .ttl-wave.s,
  .footer-map-ttl {
    font-size: calc(32/1200*100vw);
  }
  .home-customer-ttl {
    font-size:calc(18/1100*100vw);
  }
}

@media screen and (max-width:767px) {
  #home-menu {
    padding-bottom:6rem;
  }
  .home-menu01 li {
    width:100%;
  }
  .home-menu01 li + li {
    margin-top:2.5em;
  }
  .home-menu01 li,
  .home-customer li {
     border-radius: 0.8em;
  }
  .home-menu-ttl {
    font-size: 2.2rem;
    padding:0.7em 0.5em 0.5em;
  }
  .home-menu li {
    border-radius: 1em;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.16);
  }
  .home-menu01 figure img {
    height: 160px;
    width: 100%;
    object-fit: cover;
  }
  .home-customer {
    flex-wrap:wrap;
    gap:0;
    justify-content: space-between;
  }
  .home-customer li {
    width:48%;
    border-width:3px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.16);
  }
  .home-customer li {
    margin-bottom:2.5rem;
  }
  .home-customer li:last-of-type {
    margin-bottom:0;
  }
  .home-topics-en {
    font-size: 2.8rem;
  }
  .topics-archive dl {
    padding:1rem 0;
  }
  .topics-archive dd {
    padding:1rem 0 0;
  }
  .topics-archive {
    padding-top:0;
  }
  .ttl-wave {
    font-size: 2.6rem;
  }
  .ttl-wave.m {
    font-size: 2.4rem;
  }
  .ttl-wave.s {
    font-size: 2.2rem;
  }
  .ttl-wave.mb {
    margin-bottom:2rem;
  }
  .ttl-wave:after {
    background-size: 8rem;
  }
}


/* footer-map
------------------------------------------------------------*/
#footer-map {
  margin-bottom:3rem;
}
.footer-map-ttl .kana {
  font-size: 60%;
  font-weight: normal;
}
.map-area {
  border-radius: 6rem;
}
.footer-map dt {
  font-size: 1.1em;
  font-weight: bold;
}
.footer-map-tel {
  margin-bottom:3rem;
}
.footer-map-tel img {
  max-width:244px;
  height: 2.8rem;
}
.area-detail {
  font-size: 90%;
}
.footer-area-qualification {
  font-size: 90%;
}
/* .map-area {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}
.map-area iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
} */
.map-area iframe {
  border-radius: 6rem;
  overflow: hidden;
  width:100%;
}

.map-area {
  position: relative;
  /* はみ出した部分を切り取る */
  overflow-y: hidden;
  width: 100%;
  padding-top: 75%;
}

.map-area iframe {
  position: absolute;
  /* クチコミ部分の高さ分、Google マップを上にずらす */
  top: -150px;
  left: 0;
  width: 100%;
  /*
    「Google マップを上にずらした分（例: 150px） × 2」
    Google マップ自体の高さを広げてあげます

    *「×2」をしてあげないと、赤色のマップピンが上側にずれます
  */
  height: calc(100% + (150px * 2));
}


.footer-map dl {
  padding:1em 1rem;
  border-bottom:1px solid #ccc;
}
.footer-map dl:first-of-type {
  border-top:1px solid #ccc;
}
.free-call {
  margin-left:1em;
}
.footer-map dd {
  color: #555;
}

@media screen and (min-width:768px) {
  .footer-map {
    display: flex;
    justify-content: space-between;
    padding-left:5%;
  }
  .footer-map-detail {
    width:48%;
  }
  .footer-map-img {
    width:52%;
  }
  .footer-map-ttl {
    margin-bottom: 0.4em;
    color: #333;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.4;
  }
  .footer-map dl {
    display: flex;
  }
  .footer-map dt {
    width:6em;
  }
  .footer-map dd {
    width:calc(100% - 7em);
  }
}
@media screen and (max-width:767px) {
  .footer-map,
  .footer-map-ttl,
  .footer-map-tel {
    padding-left:1rem;
    padding-right: 1rem;
  }
  .footer-map-tel img {
    height: 2.3rem;
  }
  .footer-map-ttl {
    margin-bottom: 0.4em;
    font-size: 2.5rem;
  }
  .footer-map dt {
    margin-bottom:0.3em;
    font-size: 1.8rem;
  }
  .footer-map-img {
    margin:3rem 0 2rem;
  }
  .footer-map-img iframe {
    border-radius: 2rem;
  }
}



/* cta
------------------------------------------------------------*/
.cta-area {
  text-align: center;
  background: url(../img/common/bg-cta.jpg)no-repeat 0 center;
  background-size: cover;
  position: relative;
}
.cta-area * {
  text-decoration: none;
  color: #fff;
}
.cta-inner {
  max-width:920px;
  margin:0 auto;
}
.cta-area .tel-txt {
  font-size: 90%;
}
.cta-txt {
  font-weight: bold;
  line-height: 1.4;
}
.cta-ttl,
.cta-ttl * {
  font-weight: bold;
  margin: 0 auto 1.2em;
  line-height: 1;
  color: #fff;
  letter-spacing: 0.06em;
}
.cta-btn {
  display: flex;
  justify-content: center;
  position: relative;
  text-align: center;
}
.cta-btn li {
  background-color: #fff;
  border-radius: 1em;
  padding:2em 3.5rem;
  display: flex;
  align-items: center;
  align-content: center;
  line-height: 1.2;
}
.cta-btn li.cta-btn-mail {
  padding:2em 4.5em;
}
.cta-btn a, .cta-btn * {
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  line-height: 1.3;
  text-decoration: none;
}

@media screen and (min-width:768px) {
  .cta-ttl {
    font-size: 3.7rem;
  }
  .cta-txt {
    font-size: 1.5em;
    margin:2.5rem auto 3rem;
  }
  .cta-ttl,
  .cta-ttl * {
      font-size:4rem;
  }
  .cta-btn {
      justify-content: space-between;
      gap:0 2%;
  }
  .cta-btn li {
      width: 48%;
      max-width:446px;
  }
}

@media screen and (min-width:768px) and (max-width:1400px) {
   .cta-ttl {
    font-size: calc(40/1400*100vw);
    margin: 0 0 2rem;
    }
    .cta-txt {
      font-size: calc(24/1400*100vw);
    }
    .cta-area {
      padding:4rem;
    }
    .cta-btn {
      max-width:85%;
      margin:0 auto;
    }
    .cta-area:before {
      background-size: calc(175 / 1400 *100vw);
      background-position:2% 110%;
    }
    .cta-area:after {
      background-size: calc(198 / 1400 *100vw);
      background-position:100% 110%;
    }
}

/* cta SP
----------------------------------------------*/
@media screen and (max-width:767px) {
  .inner {
    padding:2rem 0 1rem;
    width:90%;
  }
  .cta-area {
    padding:5rem 2rem;
  }
  .cta-btn {
    display: block;
    width:90%;
    margin:0 auto;
  }
  .cta-ttl {
    font-size: 2rem;
  }
  .cta-ttl, .cta-ttl * {
    margin-bottom:1.5em;
  }
  .cta-btn li + li {
    margin-top:2rem;
  }
  .cta-btn li {
    padding: 2em 5rem;
  }
  .cta-btn li.cta-btn-mail {
    padding: 2em 8rem;
  }
}


/* -----------------------------------------------------------
lower
------------------------------------------------------------*/
#kv,
.kv-inner {
  position: relative;
}
#kv * {
  color: #fff;
}
#kv {
  background: url(../img/common/bg-kv.jpg) no-repeat center center;
  background-size: cover;
}
#kv.kv2 {
  background: url(../img/common/bg-kv2.jpg) no-repeat center top;
  background-size: cover;
}
#kv {
  position: relative;
  margin:12px auto;
  padding: 0 2%;
  width:100%;
  z-index: 1;
}
#kv, .kv-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  line-height: 1;
  position: relative;
}
.kv-img {
  position: absolute;
  top: 0;
  left: 0;
  right:0;
  margin:auto;
  width: 96%;
  object-fit: cover;
  border-radius: 2.5rem;
  z-index: -2;
}
.kv-inner {
  width: 1120px;
  max-width: 90%;
  margin: auto;
  text-align: center;
}
.kv-inner {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  line-height: 1.2;
  flex-wrap: wrap;
}
.kv-ttl {
  line-height: 1.2;
  font-weight: bold;
  text-align: center;
  color: #fff;
  position: relative;
  margin: 1em 0 0 0;
  padding-bottom:1.5em;
}
.kv-ttl:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  background: url(../img/common/ttl-wave.svg) no-repeat center 0;
  background-size: 12rem;
  width: 100%;
  height: 1em;
}
.kv-icn {
  position: absolute;
  top:3rem;
  left:0;
  font-size: 2.6rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.kv-icn img {
  width:80px;
  vertical-align: middle;
  margin-right:0.5em;
}
.ttl-accent,
.ttl-bd-line {
  position: relative;
  text-align: center;
  font-size: 3.6rem;
  margin-bottom: 1.7em;
  letter-spacing: 0.06em;
  line-height: 1.8;
}
.ttl-accent.mb {
  margin-bottom:2em;
}
.ttl-accent.l {
  font-size:3.6rem;
}
.ttl-accent:after {
  content:"";
  position: absolute;
  bottom:-0.8em;
  left:0;
  right: 0;
  margin:auto;
  background: url(../img/common/ttl-accent.svg)no-repeat bottom center;
  background-size:contain;
  width:1.7em;
  height: 1em;
}
.top-read {
  background-color: #fff;
  padding:2em 3% 2em 4%;
  margin-bottom:1em;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.15);
  margin-top:9rem;
}
.box-round {
  border-radius: 3rem;
}
.top-read figcaption {
  text-align: center;
}
.ttl-read {
  border-bottom:6px dotted #A9D4EA;
  line-height: 1.6;
  padding-bottom:0.5em;
  margin-bottom:1em;
}
.bg-box {
  background-color: #5FCACA;
  border-radius: 7rem;
}
.box-f {
  background-color: #fff;
  border-radius: 4rem;
  padding:4em 3%;
}
.box-inner {
  max-width:1280px;
  margin:0 auto;
  width:95%;
}
.marker {
  background: linear-gradient(transparent 60%, #fcf48e 0%);
  font-weight: bold;
}
.marker.b{
  background: linear-gradient(transparent 60%, #B9D8EF 0%)!important;
}
.mark, mark {
  background: linear-gradient(transparent 60%, #ffff66 0%)!important;
  font-weight: bold;
  color:#333;
}
mark.has-black-color {
  color:#333!important;
}
.consultation-area .check li {
  border-bottom:2px dotted #ccc;
  padding-bottom:0.6em;
  padding-top:0.2em;
  margin-top:0.3em;
  line-height: 1.8;
}
.consultation-area .check {
  margin:1rem 0 0;
}
.check li {
  padding:1rem 1rem 1rem 2.5em;
  background: url(../img/common/icn-check.svg)no-repeat 0 0.2em;
}
.ar-b {
  text-align: center;
  margin:auto;
  width:0;
  height:0;
  border-style:solid;
  border-width: 60px 100px 0 100px;
  border-color: #F8E35E transparent transparent transparent;
}
.ttl-solution {
  text-align: center;
  line-height: 1.8;
}
.ttl-solution span {
  border-bottom:6px solid #F8E35E;
  font-size: 1em;
}
.feature-box {
  margin:0 0 6rem;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}
.feature-box:last-of-type {
  margin:0;
}
.ttl-dot {
  border-bottom:8px dotted #056FC0;
  padding-bottom:0.6em;
  margin-bottom:0.6em;
}
.ttl-dot.lb {
  border-color: #A9D4EA;
}
.feature-box figure img {
  border-radius: 1.6em;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.feature-box figure {
  position: relative;
}
.feature-box figure:after {
  content: "";
  position: absolute;
  right: -3rem;
  top: 5rem;
  width: 74%;
  height: 28rem;
  background-color: #27B8B8;
  border-radius: 1.6em;
}
.check li {
  line-height: 1.6;
}
.feature-box .check li {
  margin-bottom:0.5em;
  letter-spacing: 1px;
}
.feature-box .check li:last-of-type {
  margin-bottom:0;
}
.support-box {
  border:4px solid #2A8EC6;
  border-radius: 1.6rem;
  padding:3.5rem 1.5% 2rem 4%;
  margin:3rem 0 4rem;
  position: relative;
}
.support-box.mb1 {
  margin-bottom:1em;
}
.support-ttl {
  background-color: #2A8EC6;
  display: inline-block;
  padding:0.3em 1.5em;
  min-width:8.5em;
  border-radius: 0.3em;
  color: #fff;
  font-weight: bold;
  font-size: 1.5em;
  margin:0;
  text-align: center;
  letter-spacing: 0.06em;
  position: absolute;
  top: -2rem;
  left: -4px;
}
.support-list li {
  margin-bottom:0.3em;
}
.support-other {
  margin:5px 0 0;
  font-size: 95%;
}
.read-tc {
  text-align: center;
  font-size: 1.2em;
}
.flow-box-area {
  border:5px solid rgba(58,189,190,0.5);
  border-radius: 1.6rem;
  margin-bottom:5rem;
  position: relative;
}
.flow-box-area:before {
  content:"";
  position: absolute;
  left:0;
  right:0;
  bottom:-40px;
  margin:auto;
  width:0;
  height:0;
  border-style:solid;
  border-width: 36px 60px 0 60px;
  border-color: #F8E35E transparent transparent transparent;
}
.flow-box-area:last-of-type,
.flow-box-area.last {
  margin-bottom:0;
}
.flow-box-area:last-of-type:before,
.flow-box-area.last:before {
  content:none;
  border:none;
  background: none;
}
.flow-box {
  width:1100px;
  max-width:96%;
  margin:0 auto;
  padding:3rem 0 3rem 2%;
}
.ttl-box {
  background-color: #333;
  display: inline-block;
  padding:0.4em 1.2em;
  border-radius: 0.2em;
  color: #fff;
  margin-bottom:1em;
}
.flow-box .ttl-box{
  display: block;
  max-width:520px;
}
.flow-box p {
  font-size: 110%;
}
.txt-s {
  font-size: 95%!important;
}
.img-round {
  border-radius: 1.6rem;
}
.bd-line {
  border-bottom:0.25em solid #C7E8F9;
  line-height: 1.8;
}
.ttl-bd-line {
  line-height: 2;
}
.customer-wrap {
  background-color: #F9F2D7;
  background-color: #5FCACA;
}
.bd-g {
  border: 5px solid #3ABDBE;
}
.bd-c {
  border: 5px solid #ccc;
}
.customer-ttl {
  padding:0.4em 0 0.4em 4.5rem;
  background:url(../img/common/icn-check-green.svg)no-repeat 0 0.35em;
  background-size:1.3em;
  border-bottom:0.2em solid #F0F0F0;
  max-width:390px;
  margin-bottom:1rem;
}
.ba-col2 {
  display: flex;
  justify-content: space-between;
  gap:0 5.5%;
  margin:2rem 0 1rem;
  position: relative;
}
.ba-col2:after {
  content:"";
  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right: 0;
  margin:auto;
  width:128px;
  height: 74px;
  background: url(../img/common/ar-after.svg)no-repeat center;
  background-size:contain;
}
.ba-col2 figure {
  position:relative;
}
.ba-col2 figure:first-of-type:after {
  content:"";
  position: absolute;
  bottom:2rem;
  left:2rem;
  background: url(../img/common/before.svg)no-repeat;
  width:84px;
  height: 26px;
  background-size:contain;
}
.ba-col2 figure:last-of-type:after {
  content:"";
  position: absolute;
  bottom:2rem;
  left:2rem;
  background: url(../img/common/after.svg)no-repeat;
  width:84px;
  height: 26px;
  background-size:contain;
}
.customer-col2 {
  max-width:900px;
  margin:0 auto;
  width:94%;
  border-bottom:1px solid #ddd;
  padding:3rem 0;
}
.customer-col2:first-of-type {
  padding-top:0;
}
.ba-col2 img {
  border:8px solid #fff;
  box-shadow:0 0 10px rgba(0, 0, 0, 0.15);
}
.bg-ttl {
  background: linear-gradient(to right, rgba(5, 111, 192, 1) 0%, rgb(0 74 158) 100%);
  padding:0.4em 1em 0.4em;
  color: #fff;
  border-radius: 0.6rem;
  margin:0;
}
.customer-point {
  max-width:820px;
  margin:0 auto;
  width:100%;
}
.cs-img {
  text-align: center;
  margin:2rem auto;
}
.bg-ttl {
  margin-bottom:0.5em;
}
.cs-img img,
img.bd-img {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  border: 6px solid #fff;
}
a.more {
  color: #004DA1;
  background:url(../img/common/flow-ar.svg)no-repeat 0 center;
  background-size:1.2em;
  padding:0.3em 0 0.3em 1.5em;
}
.inner {
  max-width:920px;
  width:94%;
  margin:0 auto;
}
.inner2 {
  max-width:1120px;
  margin:0 auto;
  width:94%;
}
.container .inner,
.container .inner2 {
  width:100%;
}
.mat .inner {
  width:90%;
}
.choose-ttl {
  background: linear-gradient(to right, rgba(5, 111, 192, 1) 0%, rgb(0 74 158) 100%);
  color: #fff;
  text-align: center;
  padding:0.5em 1em 0.4em;
  border-radius: 0 0 0.3em 0.3em;
  margin-bottom:1rem;
}
.choose-box figure img {
  border-radius: 1.6rem 1.6rem 0 0;
}
.choose-appeal {
  border:8px solid #0055AA;
  border-radius: 1.6rem;
  text-align: center;
  padding:2em 1rem 2rem;
  margin-bottom:3rem;
}
.ttl-choose-appeal {
  color: #DE3636;
}
.choose-img {
  max-width:647px;
  width:90%;
  margin:2rem auto;
}
.choose-bottom p.m {
  font-size: 1.1em;
}
.area-wrap {
  background: url(../img/common/bg-area.jpg)no-repeat center 0;
  background-size:cover;
}
.area-top {
  max-width:1100px;
  margin:0 auto;
}
.area-top .in {
  width:70%;
  max-width:760px;
}
.area-top figure {
  width:30%;
  padding-left:5%;
  margin-top:-30%;
}
.ttl-area-top {
  font-weight: bold;
  border-bottom:2px solid #ccc;
  padding:0 0 0.3em;
  font-size: 2em;
  line-height: 1.4;
}
.area-wrap .ttl-wave {
  margin-bottom:3rem;
}
.area-bottom {
  border:2px solid #056FC0;
  border-radius: 0.3em;
  background:#fff;
}
.ttl-area-bottom {
  background:#056FC0;
  font-size: 1.4em;
  text-align: center;
  padding:0.3em;
  color:#fff;
}
.area-bottom-box {
  padding:1.5rem 2em;
  border-bottom: 1px solid #ccc;
}
.area-ttl {
  font-size: 2.2rem;
  color: #056FC0;
  margin-bottom:0.5em;
}
.areas{
  display: flex;
  flex-wrap: wrap;
  gap: 0 12px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.areas li{
  white-space: nowrap;
  font-size: 14px;
  line-height: 1.6;
}
.area-lead {
  font-weight: bold;
}
.service-area{
  margin-top:4rem;
}
.customer-service {
  background-color: #f9f4cb;
}
.welfare-flow {
  max-width:820px;
  width:90%;
  margin:3rem auto 0;
}
.customer-box {
  max-width:1024px;
  margin:4rem auto;
}
.customer-box .bg-ttl {
  margin-bottom:3rem;
}
.customer-flex p {
  font-size: 1.1em;
}
.solution-box {
  border:5px solid #3ABDBE;
  border-radius: 2rem;
  padding:3rem 4%;
  margin:5rem 0;
  position: relative;
}
.solution-case {
    background-color: #5FCACA;
    display: inline-block;
    padding: 0.3em 1.5em;
    min-width: 5em;
    border-radius: 0.3em;
    color: #fff;
    font-weight: bold;
    font-size: 1.7em;
    margin: 0;
    text-align: center;
    letter-spacing: 0.06em;
    position: absolute;
    top: -1.5rem;
    left: 4%;
    line-height: 1.2;
}
.solution-txt .ttl-dot {
  padding:0.8em 0 0.3em;
}
.solution-txt p {
  font-size: 1.1em;
  line-height: 2;
  margin:0;
}
.solution-txt .list-dot li {
  font-size: 1.1em;
  margin-bottom:0.5em;
}
.ttl-appeal {
  font-size: 1.7em;
  font-weight: bold;
}
.ttl-appeal span {
  font-size: 1em;
  border-bottom: 6px solid #F8E35E;
}
.ls {
  letter-spacing: 0.06em;
}

@media screen and (min-width:768px) {
  #kv, .kv-inner,
  .kv-img {
    height: calc(280 / 1400 * 100vw);
    min-height: 280px;
    height: 280px;
  }
  .kv-ttl {
    font-size: 3.8rem;
  }
  .kv-ttl.s {
    font-size: 3.6rem;
  }
  .top-read .flex-txt {
    width:57%;
    padding-top:1rem;
  }
  .top-read .flex-img {
    width:40.21%;
  }
  .ttl-read {
    font-size: 1.6em;
  }
  .ttl-read.l {
    font-size: 2.8rem;
  }
  .ttl-read.xl {
    font-size: 3rem;
  }
  .check.flex-pc {
    gap:0 3%;
  }
  .check.flex-pc li {
    width:47%;
    font-size: 2rem;
  }
  .check li {
    font-size: 2rem;
  }
  .ttl-solution {
    font-size: 3.5rem;
  }
  .ttl-solution.m {
    font-size: 3rem;
  }
  .ttl-dot {
    font-size:1.9em;
  }
  .feature-box .flex-txt {
    width:57%;
  }
  .feature-box figure {
    width:44%;
    padding-left: 6%;
    margin-bottom:4rem;
  }
  .feature-area,
  .support-area,
  .case-area,
  .customer-wrap,
  .customer-service,
  .choose-wrap {
    margin-bottom:10rem;
  }
  .support-list {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-content: flex-start;
  }
  .support-list li {
    width: 25%;
    font-size: 1.8rem;
  }
  .support-list.flex2 li {
    width:50%;
  }
  .flow-box,
  .choose-area {
    display: flex;
    justify-content: space-between;
  }
  .flow-box .flow-img {
    width:30%;
  }
  .flow-box .flow-detail {
    width:70%;
    padding-left:4%;
  }
  .ttl-box { 
    font-size: 2.4rem;
  }
  .support-flex {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-content: flex-start;
    gap:0 3%;
    margin-top:2rem;
  }
  .support-flex .support-box {
    width:48%;
    margin:1.5rem 0;
  }
  .bg-ttl {
    font-size: 3rem;
  }
  .bg-ttl.s {
    font-size: 2.2rem;
  }
  .bg-ttl.m,
  .choose-ttl,
  .ttl-choose-appeal {
    font-size: 2.6rem;
  }
  .customer-ttl {
    font-size: 2.6rem;
  }
  .choose-area {
    gap:0 3%;
    flex-wrap:wrap;
  }
  .choose-box {
    width:47%;
    margin-bottom:2rem;
  }
  .customer-point p {
    font-size: 1.1em;
  }
  .choose-txt {
    font-size: 2.4rem;
  }
  .choose-ttl {
    display: flex;
    height: 3.5em;
    justify-content: center;
    align-items: center;
    align-content: center;
  }
  .area-lead {
    padding-left:1em;
    margin:0;
  }
  .customer-flex .customer-txt {
    width:57%;
  }
  .customer-flex figure {
    width:40%;
  }
  .reverse figure {
    order:2;
  }
  .lh2 {
    line-height: 2.5;
  }
  .solution-flex .solution-txt {
    width:56%;
  }
  .solution-flex figure {
    width:38%;
  }
  .solution-area p {
    font-size: 110%;
    line-height: 2.2;
  }

}

@media screen and (max-width:767px) {
  #kv, .kv-inner, .kv-img {
    height: 140px;
  }
  #kv {
    background-position:center bottom;
    background-size:160%;
  }
  .kv-ttl {
    margin: 1.5em 0 0;
    font-size: 2.2rem;
  }
  .kv-ttl.s {
    font-size: 2rem;
  }
  .kv-inner {
    padding:3rem 0;
  }
  .kv-img {
    border-radius: 1.5rem;
  }
  .kv-icn img {
    width: 1.5em;
  }
  .kv-icn {
    font-size: 1em;
    top:2rem;
  }
  .kv-ttl:after {
    background-size:8rem;
  }
  .lower .top-chara {
    bottom:0;
    top:inherit;
  }
  .top-chara {
    max-width:26%;
  }
  .ttl-accent, .ttl-bd-line {
    font-size: 1.4em;
  }
  .bd-g {
    border-width:3px;
  }
  .box-round {
    border-radius: 2rem;
  }
  .bg-box {
    border-radius: 3rem;
  }
  .ar-b {
    border-width:30px 50px 0 50px;
  }



}



/* -----------------------------------------------------------
	privacy
------------------------------------------------------------*/

/* -----------------------------------------------------------
	character
------------------------------------------------------------*/
.chara-kv {
  max-width:440px;
  text-align:right;
  margin:0 0 0 auto;
}
.chara-table {
  width: 100%;
  margin-top: 4rem;
  border-collapse: collapse;
  border-radius: 2rem 0 0 2rem;
  overflow: hidden;
}
.chara-table th,
.chara-table td {
  padding:1em 1.5em;
  line-height: 1.8;
}
.chara-table th {
  background-color: #a5e3db;
  border-bottom:1px solid #fff;
  text-align: left;
  width:20%;
}
.chara-table td {
  border-bottom:1px solid #3ABDBE;
}
.chara-table tr:first-of-type td {
  border-top:1px solid #3ABDBE;
}
.chara-body p {
  font-size: 110%;
}

/* 以下削除 */
.local-menu {
  background-color: #F0F4FA;
}
.local-menu ul{
  display: flex;
  align-items: center;
  height: 60px;
}
.local-menu a {
  font-weight: 500;
  font-size: 96%;
}
.local-menu li {
  position: relative;
  padding-right:2em;
}
.local-menu li:after {
  content:"";
  position: absolute;
  top:0;
  bottom:0;
  margin:auto;
  right:1em;
  width:1px;
  height: 1em;
  background-color: #CCCCCC;
}
.read-ttl,
.single-detail h1,
.single-detail .ttl {
  font-size: 1.8em;
  line-height: 1.6;
  border-bottom:12px dotted #9FCCF0;
  padding-bottom:0.4em;
  margin-bottom:0.5em;
}
.read-ttl.l {
  font-size: 2.2em;
}
.detail-txt p {
  line-height: 2;
}
.mat,
.radius {
  border-radius: 1em;
}
.ttl-gray,
.ttl-white {
  background-color: #E4E4E4;
  color: #222;
  padding: 0.3em 1em 0.3em 2em;
  margin:2em 0 1em;
  position: relative;
}
.ttl-white {
  background-color: #fff;
}
.ttl-gray:before {
  content:"";
  position: absolute;
  top: 0.6em;
  left: 0.6em;
  background:url(../img/common/triangle.svg)no-repeat 0 0;
  background-size:contain;
  width:1em;
  height:1em;
}
.ttl-white:before {
  background:url(../img/common/triangle.svg)no-repeat 0 0;
}
.ttl-gray.mt0,
.mat .ttl-gray:first-of-type,
.ttl-white.mt0,
.mat .ttl-white:first-of-type {
  margin-top:0;
}
.ttl-center {
  text-align: center;
  margin:0 auto;
}
.ttl-center.mt {
  margin-top:0.8em;
  margin-bottom:0.5em;
}
.bg-grid {
  background:url(../img/common/bg-grid.jpg)repeat 0 0;
}
.ttl-under {
  position: relative;
  padding-bottom: 0.6em;
  margin: 0.1em 0 0.6em;
  font-size: 180%;
  text-align: center;
}
.ttl-under.s {
  font-size: 130%;
  margin-top:1em;
}
.ttl-under:before {
  content:"";
  position: absolute;
  bottom:0;
  left:0;
  width:100%;
  height: 8px;
  background-color: #27B8B8;
  border-radius: 10em;
}
.ecoscrach-case-txt p {
  line-height: 1.4;
  margin:0 0 0.5em;
}
.ttl-eco {
  margin-bottom:1em;
}
.faq-area .faq-box:first-of-type {
  margin-top:0;
}
.faq-box {
  margin:3rem 0;
}
.faq-box dt {
  background: url(../img/common/ar-open.svg)no-repeat 97% 40%;
  background-size:1.2em;
  background-color: #27B8B8;
  border-radius: 0.5em;
  height: 70px;
  padding:0.3em 1em 0.3em 9rem;
  color: #fff;
  font-weight: bold;
  display: flex;
  align-items: center;
  align-content: center;
  line-height:1.3;
  position: relative;
}
.faq-box dd {
  display: none;
  padding:0.6em 0 0.6em 9rem;
  margin:2rem 0 4rem 0;
  position: relative;
}
.faq-box dt:before,
.faq-box dd:before {
  content:"";
  position: absolute;
  left:3rem;
  width:100%;
  height: 100%;
}
.faq-box dt:before,
.faq-box dd:before {
  background-size:4rem auto!important;
}

.faq-box dt:before {
  background: url(../img/common/q.svg)no-repeat 0 center;
  top:0;
  bottom:0;
  margin:auto;
}
.faq-box dd:before {
  background: url(../img/common/a.svg)no-repeat 0 0;
  top:0;
}
.faq-box dt.active {
  background-image: url(../img/common/ar-close.svg);
  background-position:97% 55%;
}
.ac-btn:hover {
  cursor: pointer;
}
#item-bottom {
  background:url(../img/common/bg-mark.svg) no-repeat 0 40%;
  background-size: auto 80%;
}
#item-bottom p {
  line-height: 2.4;
}
#item-bottom .ttl-dot {
  margin-bottom:2em;
}
.case-bottom .case-bottm-txt {
  width:65%;
  padding-right: 5%;
}
.case-bottom {
  margin:3em 0;
}
.item-related-txt {
  width:70%;
  padding-left:5%;
}
.item-related figure {
  width:30%;
}
.item-related a {
  display: flex;
  width:100%;
}
.item-related-area {
  background-color: #FFCF00;
  border-radius: 1em;
  padding:0 2rem 4rem;
}
.ttl-side {
  margin:0 auto;
  text-align: center;
}
.ttl-side span {
  position: relative;
}
.item-related li {
  background-color: #fff;
  padding:1em;
}
.item-related p {
  text-decoration: none;
  color: #333;
  font-size: 95%;
  margin:5px 0 0;
  line-height: 1.4;
}
.item-related-ttl {
  font-size: 1.9rem;
  color: #004DA1;
  text-decoration: underline;
}
.img-one {
  margin:2em auto;
  text-align: center;
}
.w750 {
  max-width:767px;
}
.spec-info-area p {
  font-size: 95%;
  line-height: 1.4;
}
.spec-info-area .spec-info-ttl {
  font-size: 115%;
  text-align: center;
  margin:0.5em 0;
}
.spec-info-area figure img {
  margin: 0 auto;
  text-align: center;
  max-width:206px;
}
.spec-info-area figure {
  margin: 0 auto;
  text-align: center;
  width:100%;
  position: relative;
}
.spec-info-area .zoom {
  background: url(../img/common/icn-zoom.svg)no-repeat right bottom;
  background-size:30px;
}

.bg-navy {
  background-color: #004DA1;
}
.bg-pink {
  background-color: #FC96B3;
}
.ttl-gray + .ttl-bg {
  margin-top:1em;
} 
.ttl-bg i {
  margin:0 1.5em 0 0;
  display: inline-block;
  vertical-align: 0.5em;
}
.ttl-bg i img {
  vertical-align: middle;
}
.dw-link {
  color: #004DA1;
  font-weight: bold;
  text-decoration: underline;
}
.ai, .pdf {
  width:30px;
  vertical-align: middle;
  margin-right:1em;
}
.ttl-left {
  position: relative;
  padding:0.1em 0.8em;
  margin:1.6em 0 1.2em;
}
.ttl-left:before {
  content:"";
  position: absolute;
  top:0;
  left:0;
  width:8px;
  height: 100%;
  background-color: #004DA1;
  border-radius: 8px;
}
.ttl-label {
  display: inline-block;
  line-height: 1;
  color: #009DE8;
  border:2px solid #009DE8;
  font-weight: bold;
  padding:0.5em 1em;
  text-align: center;
  vertical-align: middle;
  margin:-0.5em 0 0 0.5em;
}
.bd {
  border-bottom:1px solid #ddd;
  padding:0 0 1.5em;
}
.bg-img {
  background-color: #F0F0F0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding:5%;
  max-width:800px;
  margin:0 auto;
}
.bg-img img {
  width:90%;
  max-width:640px;
  margin:0 auto;
  text-align: center;
}
.short {
  max-width:800px;
  margin:0 auto;
  width:90%;
}
.list-box {
  border-radius: 1em;
  padding:2rem;
}
.bg-mark {
  background:url(../img/common/bg-mark.svg) no-repeat 0 40%;
  background-size:auto 80%;
}

.price-txt .l {
  font-size: 180%;
  line-height: 2;
  display: inline-block;
}
p.price-txt  {
  margin-bottom:0;
}
.box {
  padding:1em 1.5em;
  border-radius: 0.5em;
}
.box.pa {
  padding-top:2em;
  padding-bottom:2em;
}
p.price-txt {
  line-height: 1;
}
.txt-s {
  font-size: 88%;
}
.txt-l {
  font-size: 130%!important;
}
.brend {
  mix-blend-mode: multiply;
}
.icn-sha {
  width:2.5em;
  margin:0 0.5em;
  vertical-align: middle;
}
.w80 {
  width:70%;
  text-align: center;
  margin:auto;
}
.border {
  border:4px solid #DDDEDF;
}
.kind-box {
  background-color: #F0F4FA;
  border: 1px solid #ddd;
  padding:1.5em 1.5em 2em;
  margin:2.5em 0;
}
.kind-box-inner {
  max-width:1100px;
  margin:0 auto;
}
.kind-ttl {
  line-height: 1;
  padding:0.2em 0.8em;
  text-align: center;
  background-color: #fff;
  border:1px solid #707070;
  margin-bottom:0.5em;
}
.kind-box-dm.tate img {
  max-width:154px;
}
.kind-box-img .block {
  margin-top:8px;
}
.kind-box-txt p img {
  width:100%;
}
.feature-list {
  padding:1rem 2rem;
  background-color: #F0F4FA;
  border-radius: 1em;
}
.feature-list:last-of-type {
  border-bottom:0;
}
.feature-list .list-number {
  align-items: center;
  border-bottom:1px solid #ccc;
  padding:1em;
}
.feature-list .list-number:last-of-type {
  border-bottom:0;
}
.list-number dt {
  font-weight: bold;
  color: #333;
}
.list-number dd {
  color: #333;
}
.local-btn {
  display: flex;
  justify-content: center;
}
.local-btn li {
  max-width:340px;
  width:50%;
  margin:0 1.5%;
  display: flex;
  text-align: center;
}
.ttl-ac {
  margin:0;
  padding:0.8em 1.5em;
  text-align: left;
  color: #fff;
  font-size: 200%;
  background: url(../img/common/ar-open.svg) no-repeat 96% center;
  background-color: #009DE8;
  font-size: 180%;
  background-size: 1.1em;
}
.ttl-ac.active {
  background-image: url(../img/common/ar-close.svg);
  background-position: 96% 55%;
}
.ttl-ac:hover {
  cursor: pointer;
}
.kind-inner {
  max-width:1100px;
  width:95%;
  margin:2em auto;
}
.kind-inner.mt0 {
  margin-top:0;
}
.kind-accordion {
  border: 2px solid #009DE8;
  margin-bottom:3em;
  background:#fff;
}
.kind-flex {
  display: flex;
  flex-wrap:wrap;
  align-items: center;
}
.kind-flex li {
  width:33.3333%;
  display: flex;
  align-items: center;
  align-content: center;
  border:1px solid #ccc;
}
.folding1 figure {
  width:105px;
}
.folding2 figure,
.folding3 figure,
.folding5 figure {
  width:178px;
}
.kind-flex p {
  margin:0;
  font-size: 140%;
  font-weight: bold;
  color: #222;
}
.folding4 li,
.folding6 li {
  width:100%;
  padding:1em 2em;
}
.folding4 p {
  font-size: 95%;
}
.folding6 p {
  font-size: 100%;
}
.folding-txt {
  padding:1em 2em;
}
.folding-txt p+p {
  margin-top:1em;
}
.ttl-arrow {
  background: url(../img/common/ttl-arrow.svg)no-repeat center bottom;
  background-size:cover!important;
  width:100%;
  height: calc(170/1400*100vw);
  max-height: 180px;
  color: #fff;
  margin:0 auto;
  text-align: center;
  letter-spacing: 0.06em;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 0.8em;
  margin-bottom:calc(-30/1450*100vw);
  z-index: 1;
  position: relative;
}
.ttl-arrow.lb {
  background: url(../img/common/ttl-arrow-lb.svg)no-repeat center bottom;
}
.product-menu {
  display: flex;
  flex-wrap:wrap;
  margin: 0 -1%;
}
.product-menu li {
  background-color: rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.16) 5px 5px 10px;
  margin: 0px 1% 2em;
  border-radius: 1em;
  padding: 1.5% 1.5% 1.7em;
}
.product-menu li a {
  display: block;
  color: #222;
}
.product-menu-ttl {
  font-size: 1.4em;
  margin: 0.5em 0 0.5em;
}
.product-menu p {
  margin:0;
  font-size: 95%;
}
.case-template figure {
  margin:auto;
  text-align: center;
}
.needs-area {
  display: flex;
  flex-wrap:wrap;
}
.needs-area li {
  margin-bottom:2em;
}
.needs-area li figure {
  background-color:#FFFADC;
  padding:2em;
  margin:0 auto 1em;
  text-align: center;
}
.needs-ttl {
  color: #004DA1;
  font-size: 1.4em;
  margin: 0.5em 0 0.5em;
}
.txt-m {
  font-size: 94%;
}
.case-variable {
  max-width:732px;
  margin:0 auto;
}
.case-variable li {
  margin-bottom:1.5em;
}
.design-info-area {
  border:4px solid #ddd;
  border-radius: 0.8em;
  max-width:1200px;
  margin:0 auto;
}
.design-info-flex {
  max-width:1100px;
  margin:0 auto;
}
.faq-detail {
  margin:0 0 1em;
}
.faq-detail dt {
  font-weight: bold;
  background-color: #F0F4FA;
  padding:0.4em 1em;
  font-size: 108%;
}
.faq-detail dd {
  font-size: 95%;
  color: #555;
  padding-left:1.2em;
}
.card-menu {
  display: flex;
  flex-wrap:wrap;
  margin: 0 -1.5%;
}
.card-menu li {
  background-color: rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.16) 5px 5px 10px;
  border-radius: 1em;
}
.card-menu li {
  border-radius: 0.8em;
}
.card-menu figure,
.card-menu figure img {
  border-radius: 0.8em 0.8em 0 0;
}
.card-menu li,
.card-menu li a {
  display: block;
  color: #222;
}
.card-menu li .card-menu-ttl {
  color: #004DA1;
  font-size: 1.5em;
  margin:0 0 0.5em;
}
.card-menu p {
  font-size: 95%;
  line-height: 1.5;
}
.card-menu-in {
  padding:1em 1.5em 1em;
}
.company01 {
  background:url(../img/company/company01.jpg)no-repeat right 0;
  background-size:cover;
}
.mat-dot {
  position:relative;
  border-radius: 0.8em;
}
.mat-dot:before {
  content:"";
  position: absolute;
  top:1.5em;
  left:1.5em;
  border:6px dotted #CDD5DD;
  width:calc(100% - 3em);
  height: calc(100% - 3em);
}
.ttl-tc-dot {
  position: relative;
  margin:0 auto 1em;
}
.ttl-tc-dot {
  font-size: 240%;
  text-align: center;
  padding-bottom:3rem;
}
.ttl-tc-dot.s {
  font-size: 200%;
}
.ttl-bd-dot {
  position: relative;
}
.ttl-tc-dot.l {
  font-size: 300%;
}
.ttl-tc-dot:after,
.ttl-bd-dot:after {
  content:"";
  position: absolute;
  bottom:1.1em;
  left:0;
  right: 0;
  margin:auto;
  width:18rem;
  border-bottom:14px dotted #BFD2E7;
}
.ttl-tc-dot:after {
  bottom:0;
}
.ttl-tc {
  text-align: center;
  margin:0 auto 1.3em;
}
.company01 p {
  line-height: 2;
}
.company01 p + p {
  margin-top:2em;
}
.pat4 {
  background-image: url(../img/common/pat4.png);
  background-repeat: repeat;
  background-position: center;
}
.philosophy-txt p {
  width:50%;
  margin:6em 0 0 auto;
}
.company04 {
  position: relative;
}
.company04  {
  background: url(../img/company/kv.png)no-repeat center bottom;
  background-size:auto;
}
.facility-area {
  gap:0 1%;
  color: #666;
}
.tel-box {
  padding: 1em 2em;
  text-align: center;
  margin:2em auto 0;
  max-width:650px;
  border-radius: 0.8em;
  font-weight: bold;
  font-size: 110%;
  line-height: 1.3;
}
.tel-box .l {
  font-size: 250%;
  vertical-align: -7px;
}
.ttl-underline {
  font-size: 140%;
  border-bottom:1px solid #ccc;
  margin:2em 0 0.8em;
  padding-bottom:0.5em;
}
.s .note-book dt {
  font-size: 120%;
}
.table-link {
  display: flex;
  flex-wrap:wrap;
}
.table-link li {
  width:33.3333%;
  border:1px solid #ccc;
  padding:0.5em 1em;
  font-size: 95%;
}
.ttl-line {
  border-top:4px solid #004DA1;
  border-bottom:1px solid #004DA1;
  padding:0.6em 1em;
  margin:3em 0 0.8em;
  font-size: 160%;
}
.icn-file,
.icn-file img {
  width:2em;
  vertical-align: middle;
  display: inline-block;
}
.icn-file {
  margin-right:0.5em;
}
.ttl-lb {
  font-size: 120%;
  margin:1.5em 0 0.5em;
  color: #009DE8;
}
.note {
  border:1px solid #ccc;
  align-items: center;
  align-content: center;
  line-height: 1;
  margin:3.5rem 0;
}
.bd {
  border-bottom:1px solid #ccc;
}
.img-area {
  max-width:640px;
  margin:0 auto;
}
.img-area {
  max-width:100%;
}
.bnr-area {
  max-width:1000px;
  margin:0 auto;
}
.pat2 {
  background: url(../img/common/pat2.jpg)repeat 0 center;
  background-size:100%;
}

.img-box {
  border:1px solid #ccc;
  padding:2rem 3rem 3rem;
  margin-bottom:3rem;
}
.img-box p {
  font-weight: bold;
}
.box-bd {
  border:1px solid #ccc;
  padding:2rem 4rem;
}
.single-nav {
  display: flex;
  justify-content: center;
  margin:5em auto 14rem;
  text-align: center;
  gap:0 1.5%;
}
.nav-prev .btn01,
.nav-archive .btn01,
.nav-next .btn01 {
  background-image:none!important;
}

/* sitemap
-----------------------------*/
#sitemap .sitemap-area {
  width:30%;
}
.sitemap-flex {
  justify-content: space-around;
  margin-bottom:2em;
}
#sitemap a {
  text-decoration: none;
  color:#222;
}
@media screen and (min-width: 768px) {
  .chara-box {
  display: flex;
  gap: 30px;
  border-radius: 4rem;
  padding: 4em 7%;
  background: #eef8f8;
  border:6px solid #fff;
  }
}
@media screen and (max-width: 767px) {
  .chara-box {
   border-radius: 2rem;
    padding: 2em 4%;
    background: #eef8f8;
    border:3px solid #fff;
  }
  .txt-l {
    font-size: 120%!important;
  }
  .chara-table th,
  .chara-table td {
    width:100%;
    display: block;
  }
  .chara-table {
     border-radius: 0;
  }
  .ttl-dot {
    font-size: 1.4em;
    border-width:5px;
  }
}



@media screen and (min-width: 768px) {
.anchor {
  display:block;
  margin-top:-100px;
  padding-top:100px;
  }
  .col3 li {
    width:31%;
  }
  .col4 li {
    width:23%;
  }

  .detail-txt {
    width: 62%;
  }
  .detail-img {
    width: 34%;
  }
  .detail-txt2 {
    width: 55%;
  }
  .detail-img2 {
    width: 42%;
  }
  .ttl-gray,
  .ttl-white {
    font-size: 3.4rem;
  }
  .ttl-center {
    padding:1em 0;
    font-size: 4.5rem;
  }
  .ttl-center.s {
    font-size: 3rem;
  }
  .ttl-arrow {
    font-size: 4rem;
  }
  .faq-area {
    margin-bottom:5rem;
  }
  .col3-1,
  .col4-1 {
    justify-content: space-between;
  }
  .col3-1 figure,
  .col3-1 .flex-img {
    width:34%;
  }
  .col3-1 .flex-txt {
    width:62%;
  }
  .col4-1 figure,
  .col4-1 .flex-img {
    width:26%;
  }
  .col4-1 .flex-txt {
    width:72%;
  }
  .w3-1 {
    width:30%;
  }
  .w3-2 {
    width:65%;
  }
  .ttl-check,
  .ttl-bd {
    font-size: 3.1rem;
  }
  .ttl-bd.s {
    font-size: 2.6rem;
  }
  .reverse.col3-1 figure,
  .reverse.col3-1 .flex-img {
    order:2;
  }
  .check-point .col2-center {
    margin-top:-1em;
  }
  .col2-center {
    gap:0 6%;
    align-items: center;
  }
  .col2-center {
    justify-content: center;
  }
  .col2-center figure {
    width:33.333%;
  }
  .col2-center .flex-txt {
    width:33.333%;
  }
  .col2 figure,
  .col2 .flex-txt {
    width:48%;
  }
  .case-area {
    flex-wrap:wrap;
  }
  .case-box {
    width:48%;
  }
  .ecoscratch-case {
    align-items: center;
  }
  .ecoscrach-case-txt {
    width:58%;
    padding-left:5%;
  }
  .ecoscrach-case figure {
    width:62%;
    margin-right: -5%;
  }
  .faq-box dt {
    font-size: 2.2rem;
  }
  .case-bottom {
    align-items: flex-end;
  }
  .col3-area {
    margin:0 -1.5%;
  }
  .col3 {
    width:30.333%;
    margin:0 1.5%;
  }

  .item-flex figure {
    width:42%;
  }
  .item-flex-txt {
    width:58%;
    padding-left:4%;
  }
  .ttl-left { 
    font-size: 3rem;
  }
  #item-bottom  {
    padding-top:11rem;
  }
  .detail-area {
    display: flex;
    justify-content: space-between;
  }
  .detail-area .flex-txt {
    width:55%;
  }
  .detail-area .flex-img {
    width:42%;
  }
  .ttl-l {
    margin:0 auto;
    font-size: 3.2rem;
  }
  .kind-box-inner {
    display: flex;
    justify-content: space-between;
    gap:0 3%;
  }
  .kind-box-dm {
    width:19%;
    display: flex;
    align-items: center;
    align-content: center;
    line-height: 1;
  }
  .kind-box-txt p {
    margin-bottom:0;
  }
  .kind-box-txt {
    width:40%;
  }
  .kind-box-img {
    width:41%;
    margin-top:2em;
    text-align: center;
  }
  .kind-ttl {
    font-size: 2.7rem;
  }
  .kind-box-dm.yoko {
    display: flex;
    flex-wrap:wrap;
    align-items: center;
  }
  .product-menu li {
    width: 23%;
  }
  .reverse figure {
    order:2;
  }
  .detail-flex .order1 {
    order:1;
  }
  .detail-flex .order2 {
    order:2;
  }
  .design-info-main {
    width:43%;
  }
  .design-info-sub {
    width:54%;
    padding:3rem;
  }
  .card-menu li {
    width:30%;
    margin:0 1.5% 2em;
  }
  .case-bottom figure {
    width:35%
  }
  .item-related li {
    width:48%;
  }
  #item-option .-mt {
    margin-top:-1em;
  } 
  .list-number dt {
    width:33%;
    font-size: 130%;
  }
  .list-number dd {
    width:67%;
    padding-left:2em;
    font-size: 94%;
  }
  .half-flex .half {
    width:48%;
    margin:1.5em 0;
  }
  .half-flex .ttl-normal {
    margin:0.8em 0 0.5em;
  }
  .ttl-normal {
    font-size: 130%;
  }
  .folding4 li figure {
    width:40%;
    text-align: center;
    margin:auto;
  }
  .folding6 li figure {
    width:50%;
    text-align: center;
    margin:auto;
  }
  .note-book {
    padding:2em;
  }
  .note-book dt {
    width:20%;
    font-size: 135%;
    font-weight: bold;
    text-align: center;
  }
  .note-book dd {
    width:80%;
    padding-left:5%;
    position: relative;
  }
  .note-book dd:before {
    content:"";
    position: absolute;
    left:1em;
    top:0;
    bottom:0;
    margin:auto;
    width:1px; 
    height: 100%;
    background-color: #ccc;
  }
}

@media screen and (min-width: 768px) and (max-width: 1280px) {
  .ttl-check, .ttl-bd, .ttl-gray {
    font-size: calc(34/1400*100vw);
    border-width:calc(10/1280*100vw);
  }
  .ttl-under  {
    font-size: calc(32/1400*100vw);
  }
  .ecoscratch-case figure {
    width:90%;
  }
  .ttl-dot-bottom, .ttl-dot-bottom span {
    font-size: calc(42/1400*100vw);
  }
  .kind-ttl {
    font-size: calc(28/1400*100vw);
  }
  .read-ttl.l {
    font-size: 1.8em;
  }
  .ttl-bd br {
    display: none;
  }
 
}

@media screen and (max-width: 1280px) {
  .ttl-check, .ttl-bd {
    border-width:calc(10/1280*100vw);
  }
  .ttl-under:before {
    height: calc(9/1280*100vw);
  }
  .faq-box dt {
    height: 60px;
    font-size: 1.25em;
  }
  .read-ttl br {
    display: none;
  }
  .read-ttl, .single-detail h1, .single-detail .ttl {
    border-width:10px;
  }
  .ttl-arrow {
    font-size: 3rem;
  }
}


/* lower PC
------------------------------------------------------------*/
@media screen and (min-width: 768px) {
/* lower common
-----------------------------*/
  .ttl-tc {
    font-size: 4.5rem;
  }
  .ttl-tc.m {
    font-size: 3.8rem;
  }
  .local-menu {
    display: flex;
    justify-content: center;
    gap:0 1.5%;
  }
  .note .note-dt {
    width:28%;
    text-align: center;
    white-space: nowrap;
    padding:1rem;
    font-weight: bold;
  }
  .note .note-dd {
    width:72%;
    position: relative;
    font-size: 1.4rem;
    padding:2.5rem 2rem 1rem 3%;
    line-height: 1.8;
  }
  .note .note-dd:before {
    content:"";
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    margin:auto;
    width:1px;
    height:85%;
    background-color: #ccc;
  }
  .ttl01-gray {
    font-size: 2.4rem;
    margin:1em 0 1rem;
  }
  .ttl01-gray.mt0 {
    margin-top:0;
  }
  .w48 {
    width:48%;
  }
  .w30 {
    width:30%;
  }
  .w70 {
    width:70%;
  }
  .w35 {
    width:35%;
  }
  .w65 {
    width:65%;
  }
  .w400 {
    max-width:400px;
    margin:auto;
    text-align: center;
  }
}


/* -----------------------------------------------------------
lower レスポンシブ
------------------------------------------------------------*/




@media screen and (min-width: 768px) and (max-width: 1300px) {

}

@media screen and (max-width: 1200px) {
  .card-menu-in {
    padding-left:1em;
    padding-right:1em;
  }
  .in > .ttl-left:nth-child(1) {
    margin-top:1em;
  }
}

@media screen and (min-width: 768px) and (max-width: 1000px) {

}

/* 750以下 lower
------------------------------------------------------------*/

@media screen and (max-width: 750px) {
  .anchor {
    display: block;
    margin-top: -60px;
    padding-top: 60px;
  }
  .local-menu {
    overcustomer-x: scroll;
    white-space: nowrap;
    width:100%;
  }
  .local-menu ul{ 
    height: 40px;
  }
  .local-menu li {
    white-space: nowrap;
  }
  .local-menu a {
    height:40px;
    width:100%;
    margin:0 auto 8px;
    font-size: 1.2rem;
  }
  .ai, .pdf, .icn-file {
    width: 20px;
  }
  .pa2 {
    padding:1em;
  }
  .icn-file {
    display: block;
  }
  .detail-flex {
    flex-wrap: wrap;
  }
  .detail-txt {
    order:2;
    width:100%;
  }
  .detail-img {
    order:1;
    width:100%;
    margin-bottom:1em;
  }
  .read-ttl, .single-detail h1, .single-detail .ttl {
    font-size: calc(38/750*100vw);
  }
  .read-ttl.l {
    font-size: calc(40/750*100vw); 
  }
  .read-ttl, .single-detail h1, .single-detail .ttl,
  .ttl-dot-bottom:before {
    border-width:8px;
  }
  .ttl-center {
    padding:1em 0;
    font-size: 2.4rem;
  }
  .ttl-under {
    font-size: 2rem;
  }
  .case-variable li {
    width:48%;
    margin:0 1% 1em;
  }
  .faq-box dt {
    padding:5px 3rem 5px 4rem;
    font-size: 1.1em;
    min-height: 54px;
    height: 100%;
    background-size:1.1em;
  }
  .faq-box dt:before, .faq-box dd:before {
    left:8px;
    background-size:2.5rem !important;
  }
  .faq-box dd {
    padding-left:4rem;
    margin-bottom:0;
  }
  .faq-box {
    margin: 1.5em 0;
  }
  #faq .in {
    padding-top:0;
    padding-bottom:0;
  }
  .ttl03 {
    font-size: 1.4em;
  }
  .bd-c {
    border-width:3px;
  }
  .box-f {
    border-radius: 1.5rem;
    padding:2em 3%;
  }
  .item-related li + li {
    margin-top:1em;
  }
  .item-related-ttl {
    font-size: 1.5rem;
  }
  .item-related-area {
    padding-bottom:3rem;
  }
  #case-study .fs22 {
    font-size: 1em!important;
    text-align: left!important;
  }
  .ttl-left .ttl-label {
    font-size: 80%;
    display: inline-block;
    margin-top: 8px;
  }
  .price-txt .l {
      font-size: 130%;
  }
  .btn-template {
    margin:auto;
  }
  .folding-map-table th {
    width:40%;
  }
  .folding-map-case .pa {
    padding:0;
  }
  .sp-figure {
    width:65%;
    margin:1.5em auto 0;
  }
  .detail-area {
    display:flex;
    flex-wrap: wrap;
  }
  .detail-area .flex-txt  {
    order:2;
  }
  .detail-area .flex-img  {
    order:1;
    margin-bottom:1em;
  }
  .img-area.w80 {
    width:100%;
  }
  .kind-box-inner {
    text-align: center;
  }
  .kind-box-dm {
    margin-bottom:1em;
  }
  .kind-box-dm img {
    max-width:70%;
    margin:auto;
  }
  .kind-ttl {
    font-size: 1.7rem;
    padding:0.4em;
    margin-bottom:1em;
  } 

  .sp-mb2 {
    margin-bottom:2.5em;
  }
  .feature-list {
    padding:0;
  }
  .half-flex .ttl-normal {
    margin: 0.8em 0 0.5em;
  }
  #item-bottom {
    background:none;
  }
  .btn-nav {
    font-size: 1.5rem;
  }
  .kind-flex p {
    font-size: 1.3rem;
    line-height: 1.2;
  }
  .folding1 figure {
    width: 50px;
  }
  .kind-flex li {
    height: 70px;
  }
  .ttl-ac {
    font-size: 1.8rem;
    padding-left:1.5rem;
    padding-right: 2em;
  }
  .folding2 li {
    width:50%;
    height: 75px;
  }
  .folding2 figure, .folding3 figure, .folding5 figure {
    width:100px;
  }
  .folding3 li {
    width:100%;
    height: 75px;
  }
  .folding4 li,.folding6 li {
    flex-wrap: wrap;
    height: 100%;
  }
  .folding4 figure, .folding4 .folding-txt,
  .folding6 figure, .folding6 .folding-txt {
    width:100%;
    padding-left:0;
    padding-right:0;
  }
  .folding4 p, .folding6 p {
    line-height: 1.4; 
  }
  .folding4 li, .folding6 li {
    padding:1em;
  }
  .ttl-arrow {
    height: 70px;
    margin-bottom: calc(-30 / 750 * 100vw);
    font-size: 2rem;
  }
  .option-box {
    padding:1em;
  }
  .option-box-txt {
    margin-top:1rem;
  }
  .option-box .btn01 {
    margin-bottom:1em;
  }
  .note-book {
    padding:1em;
  }
  .note-book dt {
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    padding-bottom:0.5em;
  }
  .note-book dd {
    padding-top:5%;
    position: relative;
    border-top:1px solid #ccc;
  }
  .note {
    position: relative;
  }
  .note .note-dt {
    padding:2rem 1rem 0;
    font-weight: bold;
  }
  .note .note-dd {
    padding:1rem;
  }
  .check-box {
    padding:2rem 2rem;
  }
  .ttl-left, .ttl-left * {
    font-size: 1.9rem;
  }
  .ttl-left {
    margin-bottom:1em;
  }
  .ttl-left:before {
    width:5px;
  }
  .ttl-blue,
  .ttl-gray,
  .ttl-white {
    margin:0 0 1em;
  }
  .ttl-tc {
    font-size: 2.5rem;
    margin-bottom:3rem;
  }
  .ttl-tc.m {
    font-size: 2rem;
  }
  .ttl-tc-dot {
    font-size:1.6em;
  }
  .ttl-tc-dot.l {
    font-size: 2.4rem;
  }
  .ttl-tc-dot.s {
    font-size: 2rem;
  }
  .ttl-bd-dot img {
    max-width:90%;
    margin:0 auto 1rem;
  }
  .ttl-tc-dot:after, .ttl-bd-dot:after {
     background: radial-gradient(circle farthest-side, #BFD2E7, #BFD2E7 60%, transparent 60%, transparent);
     background-size: 12px;
     content: '';
     display: inline-block;
     height: 12px;
     width: 12rem;
     border: none;
  }
  .mat-dot {
    padding:0.5em;
  }
  .mat-dot:before {
    top: 0.5em;
    left: 0.5em;
    width: calc(100% - 1em);
    height: calc(100% - 1em);
    border-width:4px;
    border-radius: 0.5em;
  }
  .philosophy-txt p {
    width: 85%;
    margin: 4em 0 0 auto;
  }
  .company04 {
    background-size: auto 80%;
  }
  .facility-area li {
    font-size: 1.2rem;
    line-height: 1.3;
  }
  .facility-area {
    margin:0 0 2em;
  }
  #contact-wrap .in {
    width:100%;
  }
  .ttl-line {
    font-size: 1.2em;
  }
  .sp-w60 {
    width:60%;
    margin:auto;
  }
  .bg-mark {
    background-size: 50%;
  }
  #sitemap a {
    display: block;
    line-height: 1.6;
  }
  /* table-scroll */
  .table-scroll table.type01 {
    display: block;
    width: 100%;
    min-width: 600px;
  }
  .table-scroll {
    overcustomer-x: auto;
    white-space: nowrap;
    -webkit-overcustomer-scrolling: touch;
    padding-bottom: 2rem;
  }
  .box-shadow {
    padding: 2rem 2rem 1rem;
  }
  .ecoscrach-case-txt {
    width:90%;
    margin:0 auto;
  }

  

/* wp
-----------------------------*/
  .wp-pagenavi a, .wp-pagenavi span{
    width:2em;
    height:2em;
    border-radius: 2em;
    margin:5px;
    font-size: 1.4rem;
  }
}

/* news 
--------------------------------------------*/
.news-archive dl {
  border-bottom:1px solid #ddd;
}
.news-archive dl:first-of-type {
  border-top:1px solid #ddd;
}
.news-archive a {
  color:#666;
  font-weight: 500;
  text-decoration: none;
}

/* -----------------------------------------------------------
	blog
------------------------------------------------------------*/

.headline {
  font-size: 140%;
  margin: -1em 0 1em;
}
.category-flex {
  display: flex;
  flex-wrap:wrap;
  gap:0 1%;
  margin:1rem 0 2rem;
}
.category-flex li {
  margin-top:1rem;
}
.category-flex a {
  color:#005397;
  background-color: #fff;
  border:1px solid #005397;
  border-radius: 10em;
  font-weight: 500;
  padding:1rem 2em;
  min-width:8em;
  text-decoration: none;
  display: inline-block;
  text-align: center;
}
.current-cat a {
  background:#005397;
  border-color:#005397;
  color:#fff;
}

.category-column .category-all a, 
.category-news .category-all a {
  background:#0054ac;
  color: #fff;
}
.category-flex a,
.category-flex span {
  font-size: 1.4rem;
}
.archive-day {
  color:#8F9DA2;
  font-size: 1.4rem;
  background-size:0.9em auto;
  margin:1rem 0 0.5rem;
}
.archive-ttl {
  font-weight: bold;
  line-height: 1.4;
  margin-top:1em;
}
.cate-flex {
  display: flex;
  flex-wrap:wrap;
  gap:5px;
  margin:0;
}
.blog-label {
  padding:0.6rem 2rem;
  font-size:1.3rem;
  border-radius: 10em;
  border:1px solid #707070;
  color:#707070;
  font-weight: 500;
  text-decoration: none;
  line-height: 1;
}
.cat-item-none {
  display: none;
}
.category-flex ul.children {
  display: none;
}


/* -----------------------------------------------------------
	single
------------------------------------------------------------*/
.single-outer {
  max-width:880px;
  margin:0 auto;
  position: relative;
  z-index: 1;
  padding-top:2rem;
}
.single-wrap .label {
  width:auto;
  font-size: inherit;
  line-height: 1;
}
.single-wrap .ttl-blue  {
  position: relative;
  z-index: 1;
}
.ttl span {
  display: block;
}
#blog .single-detail h1,
.ttl {
  margin: 0.8em 0 1em;
  position: relative;
  line-height: 1.4;
}
.single-ttl {
  background-color: #939AA2;
  display:inline-block;
  padding:0 1em;
  margin-bottom:3rem;
}
.single-ttl * {
  color:#fff;
  font-weight: bold;
  display:inline-block;
}
.single-ttl dd {
  position: relative;
  padding-left:2em;
}
.single-ttl dd:after {
  content:"";
  position: absolute;
  left:1rem;
  top:0;
  bottom:0;
  margin:auto;
  background-color: #fff;
  width:1em;
  height: 1px;
}
.single-ttl dd {
  font-size: 2.2rem;
}
.single-wrap figure {
  margin:0 0 2rem;
}
.block-wrap .block-area {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  line-height: 1;
}
.block-wrap .block-area:nth-child(odd) figure {
  order:1;
}
.block-area figure {
  width:50%;
}
.block-area .block-txt {
  width:50%;
  padding:0 5%;
}
.block-txt p {
  font-size: 110%;
  text-align: center;
  font-weight: 500;
  line-height: 2;
}
.ttl02 {
  margin: 5rem 0 0.7em;
  padding-bottom: 1.5rem;
  position: relative;
  line-height: 1.3;
  border-bottom: 4px solid #ddd;
}
.ttl02:before {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 5em;
  height: 4px;
  background: #005397;
}
.ttl03 {
  margin: 1.2em 0;
  font-size: 1.6em;
  padding-left: 0.9em;
  position: relative;
}
.ttl03:before {
  content:"";
  position: absolute;
  top:0;
  left:0;
  width:7px;
  height: 100%;
  background-color: #27b8b8;
  border-radius: 3px;
}
.ttl03:first-of-type {
  margin-top:1em;
}
.line-hr {
  border:none;
  border-bottom:1px solid #ccc;
  margin:5em 0;
}

.cate-day {
  display: flex;
  align-items: center;
}
.cate-day .archive-day {
  margin-right:1em;
}
.single-wrap .cate-day .label {
  margin-left:0;
}
.cate-day a,
.label a {
  text-decoration: none;
  color:#fff;
  width:100%;
}
.wp-block-image {
  margin-bottom:2em;
}
.single-detail a {
  color:#0054AC;
}
.single-detail .link {
  padding:1em 2em;
  border:3px solid #ddd;
  width:100%;
  text-decoration: none;
  font-weight: bold;
  margin:2rem 0;
}
.day-cate .cate + span {
  margin-left:8px;
}

/* single　ブロックエディタ
------------------------------------------------- */

.single-detail h2 {
  font-weight: bold;
  border-bottom: 6px dotted #9FCCF0;
  padding: 1.5rem 1rem 1.2rem 0;
  line-height: 1.2;
  margin: 3em 0 1em;
  position: relative;
}
.single-detail h3 {
  padding: 0;
  position: relative;
  margin: 1.5em 0 0.5em;
  line-height: 1.4;
  font-weight: bold;
  background-color: #deeefb;
  background-color: #3BB3EC;
  color: #fff;
  padding: 0.4em 0.6em 0.3em;
  line-height: 1.2;
  position: relative;
  border-radius: 4px;
}
.single-detail h3.ttl01 {
  background: none;
  border-bottom:none;
}
.single-detail .wp-block-quote {
  margin:0;
}
.single-detail .wp-block-quote.has-background.space {
  padding:4%;
  margin-bottom:1em;
}
.wp-block-list li {
  padding-left:1.1em;
  margin:0 0 1em;
  line-height: 1.6;
  position: relative;
}
.wp-block-list li:before {
  content:"●";
  position: absolute;
  left:0;
  top:0.25em;
  color:#3BB3EC;
  font-size: 1.2rem;
}
.wp-block-quote .has-background {
  border-radius: 1em;
}


/* SNS　投稿シェアボタン */
.single-detail .addtoany_content {
  margin: 0 auto 1rem;
  text-align: right;
}
.kv-thumb img {
  height: auto;
}

/* toc 記事のブロックエディタ リセット
------------------------------------------------- */

/* original */
#ez-toc-container {
  width:100%;
}
#rtoc-mokuji-widget-wrapper * {
  font-family:'Noto Sans JP',sans-serif;
}
.simpletoc,
#rtoc-mokuji-widget-wrapper.rtoc-mokuji-content {
  background-color: #f0f0f0;
  padding:5% 4% 2%;
  margin:4rem 0 5rem;
}
#rtoc-mokuji-title button {
  display: none;
}
#ez-toc-container .ez-toc-title,
h2.simpletoc-title,
#rtoc-mokuji-title span {
  text-align: center;
  margin:0 auto 0.8em;
  font-weight: bold;
  letter-spacing: 0.1em;
  color: #61A0DF;
  font-weight: bold;
  font-size: 2.4rem;
  padding: 0.5rem 3em;
  line-height: 1;
  position: relative;
}
#ez-toc-container a {
  color: #61A0DF!important;
}
#ez-toc-container {
  border-color:#ddd;
  padding:2% 4% 4%;
}
.ez-toc-title-container {
  margin:0 auto;
  width:12em;
  display: block;
}
h2.simpletoc-title:before {
  content:none;
  background-color: none;
}
.rtoc-mokuji-content #rtoc-mokuji-title {
  text-align: center;
}
.rtoc-mokuji a,
.simpletoc-list a {
  color:#61a0df!important;
  font-weight: 500;
  text-decoration:none;
  font-size: 95%;
  position: relative;
}
.simpletoc-list li,
.rtoc-mokuji li {
  margin:0 0 0.5em 0;
  color:#61a0df!important;
  list-style:inside;
}
.simpletoc-list ul,
.rtoc-mokuji ul {
  margin:0.5em 1em;
}
ul.rtoc-mokuji.level-1 {
  padding:2rem 0;
  max-width:600px;
  margin:0 auto;
}
ul.simpletoc-list {
  max-width:600px;
  margin:0 auto;
}
.single-detail figure {
  margin-top:1em;
  margin-bottom:1em;
}

/* single-detail youtube */
.wp-block-embed__wrapper {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
}

.wp-block-embed__wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

/* wp管理画面 */
body.wp-admin .wp-list-table #last_modified {
  width: 14%;
}
body.wp-admin .wp-list-table td .date_same {
  color: transparent;	/* 文字は透明にして、見かけ上は非表示 */
}
body.wp-admin .wp-list-table td .date_same:before {
  content: "（更新なし）";
  color: #a1a0a0; /* 若干薄い色で文字表示*/
}
.single-wrap .bgf {
  border-radius: 1.5em;
}

.single .liquid-speech-balloon-avatar::after {
  top:inherit;
  bottom:0;
}
.single .liquid-speech-balloon-avatar {
    width: 7em;
    height: 7em;
}
.single .wp-block-separator {
  margin:3em 0;
}

/*works*/
.single-works .wp-block-image img {
  padding:5px;
  background: #ffffff;
    border: 1px solid #ececec;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
    border-radius: 0.5em;
}

/* blog */
.blog-archive {
  display: flex;
  flex-wrap:wrap;
  margin:6rem -1.5%;
}
.blog-archive li {
  width:30%;
  margin:0 1.5% 2em;
}
.blog-archive li img {
  object-fit: cover;
  width:100%;
  height: auto;
  padding: 5px;
  background: #ffffff;
  border: 1px solid #ececec;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
  border-radius: 0.5em;
}

@media screen and (min-width:768px) {
  .news-archive dl {
    padding:2rem;
    display: flex;
  }
  .news-archive dt {
    width:10.5em;
    display: flex;
  }
  .news-archive dd {
    width:calc(100% - 13em);
    padding-top:4px;
  }
  .single-wrap {
    padding:6rem 0 10rem;
  }
  .single-wrap {
    padding-left:5%;
    padding-right:5%;
  }
  .ttl02 {
    font-size: 3rem;
  }
  .ttl02.s {
    font-size: 2.4rem;
  }
  #blog .single-detail h1,
  .ttl,
  .ttl * {
    font-size: 3.4rem;
  }
  .ttl.m {
    font-size: 3rem!important;
  }
  .ttl.s {
    font-size: 2.4rem!important;
  }
  .single-detail {
    margin:1rem 0 8rem;
  }
  .single-nav {
    margin:12rem auto 10rem;
  }
  .single-nav {
    margin:6rem auto 5rem;
  }
  .single-detail h2 {
    font-size: 2.8rem;
  }
  .single-detail h3 {
    font-size: 2.4rem;
  }

}


@media screen and (max-width:1300px) {
  .ttl-bg,
  .single-detail h1,
  .ttl {
    font-size: calc(34/1400*100vw);
  }
  .blog-archive li {
    margin-bottom:3rem;
  }
}

@media screen and (max-width:767px) {
  .news-archive dl {
    padding:1rem;
  }
  .news-archive dt,
  .day-cate {
    display: flex;
    flex-wrap:wrap;
  }
  .news-archive dd {
    margin-top:1rem;
  }
  .single-detail h1,
  .ttl {
    margin-top:3rem;
  }
  .ttl-bg, .single-detail h1, .ttl, .single-detail h1 * {
    font-size: 1.8rem;
    line-height: 1.4;
  }
  .single-detail h1, .ttl {
    padding-top:1em;
  }
  .triangle {
    background-position:0.3em 0.6em;
  }
  .ttl.s {
    font-size: 1.8rem;
  }
  .ttl02 {
    font-size: 1.7rem;
  }
  .single-ttl dd {
    font-size: 1.6rem;
  }
  .single-ttl dd {
    padding-left:1em;
  }
  .single-ttl dd:after{
    left:0;
    width:0.8em;
  }
  .single-detail h1,
  .ttl {
    margin-top:0;
    font-size: 1.8rem;
    padding:2rem 0 1.5rem;
  }
  .ttl.s {
    font-size: 1.8rem;
  }
  .block-wrap {
    padding-top:2rem;
  }
  .block-wrap .block-area {
    display: block;
  }
  .block-txt p {
    margin-bottom:0;
    font-size: 1.3rem;
    line-height: 1.6;
    text-align: left;
  }
  .block-area figure,
  .block-area .block-txt {
    padding:0;
    width:100%;
  }
  .single-nav {
    margin:3rem auto 5rem;
  }
  .single-nav li {
    width:33.333%;
  }
  .nav-prev .btn01, .nav-archive .btn01, .nav-next .btn01 {
    background-image: none !important;
    font-size: 1.3rem;
    height: 40px;
    padding:0;
  }
  .arrow::before {
    width:7px;
    height:7px;
  }
  .blog-archive {
    margin:0 -2%;
  }
  .blog-archive li {
    width: 47%;
  }
  .blog-archive p {
    color: #555;
  }
  .day-cate .cate {
    padding-left:0.5em;
    padding-right: 0.5em;
  }
  .blog-archive figure img {
    object-fit: cover;
    width: 100%;
    max-height: 220px;
    height: calc(220 / 750 * 100vw);
  }
  .blog-label {
    padding: 0.3rem 0.5rem;
    font-size: 1.1rem;
  }
  .blog-archive-ttl br {
    display: none;
  }
  .blog-archive-ttl {
    font-size: 1em;
    font-feature-settings: "palt"
  }
  .single-outer {
    padding-top:0;
    width:90%;
  }
  #blog .single-outer {
    padding-top:2rem;
  }
  .cate-flex {
    margin:1rem 0;
  }
  .block-area {
    margin-bottom:2rem;
  }
  .single-wrap .container {
    padding-bottom:3rem;
  }
  .single-wrap {
    padding-top:2rem;
    padding-bottom:4rem;
  }
  .category-flex li {
    margin:5px;
  }
  .category-flex a {
    font-size: 1.3rem;
    padding:0.45rem 1rem;
    min-width: inherit;
  }
  .category-flex a, .category-flex span {
    font-size: 1.3rem;
    min-width:auto;
  }
  .wp-block-columns.right .wp-block-column:first-of-type {
    order:2;
  }
  .wp-block-columns.left .wp-block-column:nth-child(2) {
    order:1;
  }
  .wp-block-columns .wp-block-quote {
    margin:0;
  }
  .single-detail h2 {
    font-size: 1.9rem;
    margin-top:2em;
  }
  .single-detail h3 {
    font-size: 1.6rem;
  }
  .single-detail .sol-ttl {
    font-size: 160%;
  }
  .single-detail .order2 {
    order:2;
  }
}


/* -----------------------------------------------------------
	form
------------------------------------------------------------*/

#contact {
  padding: 8rem 0 10rem;
  position: relative;
}
.privacy-link {
  text-align: center;
}
.privacy-area {
  border: 1px solid #ccc;
  padding: 20px;
  text-align: left;
  font-size: 1.5rem;
  line-height: 1.6;
  margin-top: 1em;
  color: #666;
}
.contact-wrap .privacy-area {
  font-size: 1.4rem;
}
.accept-box {
  margin: 0 auto;
  text-align: center;
}
.td-radio {
  display: flex;
}
.flex-th .th {
  line-height: 1.4;
}
.contact-wrap th, .contact-wrap td {
  padding: 1.5rem 1rem;
}
.contact-wrap option, .contact-wrap textarea, .contact-wrap input[type="number"], .contact-wrap input[type="email"], .contact-wrap input[type="tel"], .contact-wrap input[type="text"], .contact-wrap input[type="option"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  border-radius: 5px;
  outline: 0;
  margin: 0;
  padding: 1rem;
  border: 1px solid #ccc;
  font-weight: normal;
  background: #fff;
  color: #555;
  width: 100%;
}
.submit-btns {
  margin: 2rem auto;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.submit-btns button[type="submit"], .submit-btns input[type="submit"], .submit-btns input[type="button"] {
  cursor: pointer;
  appearance: inherit;
  border:none;
}
.submit-btns [type=button] {
  background: #777;
  border-color:#777;
  color:#fff;
}
button, input, select, textarea {
  background: 0;
  /* border: 0; */
  border-radius: 0;
  font: inherit;
  outline: 0;
}
input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}
.contact-wrap label {
  margin: 0.3em 1em 0.3em 0;
  display: inline-block;
  display: table;
  vertical-align: middle;
  align-items: center;
  position: relative;
}
.contact-wrap input[type="radio"] + span {
  margin:2px 0 0 5px;
}
.contact-wrap input {
  vertical-align: middle;
}
.contact-wrap label span,
.wpcf7-acceptance span {
  display: inline-block;
  /* line-height: 1; */
}
.wpcf7-acceptance span {
  vertical-align: middle;
}
.contact-wrap button {
  border-radius: 48px;
  width: 202px;
  height: 48px;
}
.contact-wrap button, .contact-wrap button:hover, .contact-wrap button:active, .contact-wrap button:focus {
  background: #F57700;
  color: #fff;
}

.contact-wrap .wq-Form .wq-TextInput.wq-size-normal {
  width: 100%;
}
.contact-wrap .wq-Form .wq-TextInput.wq-size-normal {
  width: 100%;
}
.contact-wrap select:hover, .contact-wrap label:hover, input[type="radio"]:hover, input[type="checkbox"]:hover, .accept-box *:hover {
  cursor: pointer;
}

/* radio */
input[type="radio"] {
  width: 18px;
  height: 18px;
  border-radius: 100px;
  position: relative;
  vertical-align: sub;
}
input[type="radio"]::before,
input[type="radio"]::after{
  content: "";
  display: block;
  border-radius: 50%;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
}
input[type="radio"]::before {
  background-color: #fff;
  border: 1px solid #ccc;
  height: 18px;
  width: 18px;
  left: 0px;
}
input[type="radio"]::after {
  background-color: #585858;
  opacity: 0;
  height: 10px;
  width: 10px;
  left: 4px;
}
input[type="radio"]:checked::after {
  opacity: 1;
}
.contact-wrap .flex-td {
  display: flex;
}
.contact-wrap .flex-td div {
  margin: 0 5px 0 0;
}
input[type="text"], input[type="tel"], textarea, select,
input[type="password"] {
  padding: 0.6em 1rem;
  border: 1px solid #ccc;
  background-color: #fff;
  border-radius: 5px;
}
textarea {
  width: 100%;
}
.required {
  border-radius: 3px;
  font-size: 1.1rem;
  font-weight: bold;
  padding: 0.3rem 0.5rem 0.3rem;
  color: #fff;
  text-align: center;
  line-height: 1.3;
  background-color: #d9534f;
  width: 3em;
  margin-right:1rem;
}
.nini {
  border-radius: 3px;
  font-size: 1.1rem;
  font-weight: bold;
  padding: 0.3rem 0.5rem 0.3rem;
  color: #fff;
  text-align: center;
  line-height: 1.3;
  background-color: #f5b555;
  width: 3em;
  margin-right:1rem;
}
.contact-wrap .th {
  /* width: calc(100% - 3em); */
  letter-spacing: 0.1em;
}
.contact-wrap table.type01 th {
  width: 28%;
}
.check_btn label {
  display: inline-block;
  line-height: 1em;
}
.contact-wrap label::before, .contact-wrap label::after {
  content: "";
  display: block;
  border-radius: 50%;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
}
.contact-wrap option:focus, .contact-wrap textarea:focus, .contact-wrap input:focus,
.contact-wrap select:focus  {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.contact-wrap input[type="checkbox"]:focus::before {
  border-color: #66afe9;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.contact-wrap input[type="radio"]:focus {
  box-shadow:none;
}
.contact-wrap input[type="radio"]:focus::before {
  border-radius: 10em;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.contact-wrap input[type="file"] {
  padding: 1.5rem;
  border: 1px solid #ddd;
  width: 100%;
}

/* select */
select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.select-box{
	position:relative;
  display:inline-block;
}
.select-box::after{
		position: absolute;
	  content:'▼';
		top: 25%;
		right: 4%;
		color: #333;
    pointer-events: none;
	}
.wpcf7-select{
	box-sizing:border-box;
	-webkit-appearance: none;
  -moz-appearance: none;
   appearance: none;
   padding-right:2em;
   color:#333;
}

/**/
input[type="checkbox"] {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input[type="checkbox"] {
  cursor: pointer;
  padding-left: 24px;
  vertical-align: 6px;
  position: relative;
}

input[type="checkbox"]::before, input[type="checkbox"]::after {
  content: "";
  display: block;
  position: absolute;
}

input[type="checkbox"]::before {
  content:"";
  position: absolute;
  background-color: #fff;
  border: 1px solid #bbb;
  width: 20px;
  height: 20px;
  /* transform: translateY(-50%); */
  top: 1px;
  bottom:0;
  margin:auto;
  left: 0;
  border-radius: 3px;
}
input[type="checkbox"]::after {
  border-bottom: 3px solid #585858;
  border-left: 3px solid #585858;
  opacity: 0;
  height: 8px;
  width: 13px;
  transform: rotate(-45deg);
  top: 0;
  bottom:0;
  margin:auto;
  left: 4px;
  content: "";
  position: absolute;
}
input[type="checkbox"]:checked::after {
  opacity: 1;
} 
.contact-wrap [type=submit] {
  width: 300px;
  margin: 10px 5px;
  color: #fff;
  border: 0;
  border-radius: 8px;
  height: 70px;
  font-weight: bold;
}
.contact-wrap button[type="submit"], .contact-wrap input[type="submit"] {
  cursor: pointer;
}
.submit-btns {
  margin: 3em auto;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  gap:0 10px;
}
.contact-wrap th {
  background-color: #F0F0EF;
  position: relative;
  padding: 1em 2%;
  text-align: left;
}
.contact-wrap th,
.contact-wrap td {
  border-bottom: 1px solid #ccc;
  border-color:#ccc;
}
.contact-wrap tr:first-of-type th,
.contact-wrap tr:first-of-type td {
  border-top: 1px solid #dccdb8;
  border-color:#ccc;
}
.contact-wrap td {
  padding: 1.5em 2%;
  background: #FFF;
}


/* contact7 reset
------------------------------------------------------------*/
.contact-wrap .wpcf7-spinner {
  width:0;
  margin:0;
  display: none;
}

.wpcf7-list-item {
  margin:0;
}
.p-postal-code {
  width:6em!important;
  height: 3em;
}
.p-locality {
  width:100%!important;
}
label.w100 {
  width:100%!important;
  white-space: nowrap;
}
.flex-ad {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 0 5px;
}
.contact-wrap label.c-yubin,
.contact-wrap label.c-address {
    margin-left:0;
    margin-right:0;
}
.c-flex .last.has-free-text {
  display: flex;
}
.contact-wrap .c-flex label {
  width:4em;
}
.c-flex {
  display: flex;
  align-items: center;
}
.accept-area {
  margin: 2em 0;
  padding:2rem;
  border:1px solid #ccc;
}
.select-wrap .wpcf7-date  {
  margin-right:1em;
}
.flex-th p {
  margin:0;
}
.flex-th .th {
  font-weight: bold;
  font-size: 1.1em;
  vertical-align: middle;
}

.contact-wrap .flex-th {
  background-color: #f0f0f0;
  border-radius:0.3em;
  margin-bottom:0.5em;
}

.form-txt {
  color: #666;
  line-height:1.6;
  font-size: 0.94em;
  margin:0.5em 0;
}
.contact-wrap .temp {
  padding:1.5rem;
  background-color: #fff;
  border:1px solid #ddd;
}
.form-txterea-txt {
  margin-bottom:2em;
}
.form-txterea-txt p {
  margin-bottom:0;
}
.txtarea-ttl,
.form-bottom-check {
  font-weight: bold;
}

.form-bottom-check span {
  vertical-align: middle;
}
.form-address {
  margin:0.5em 0 0 0;
}
.form-bottom-check * {
  letter-spacing: 0;
}

/* 767以下 form blog
------------------------------------------------------------*/
@media screen and (min-width:768px) {

/* form */
  .flex-th {
    display: flex;
    align-items: center;
    align-content: center;
    line-height: 1.2;
  }
  .contact-wrap th {
      width: 25%;
  }
  .contact-wrap td {
      width: 70%;
      text-align: left;
  }
  .submit-btns button:hover, .submit-btns input:hover {
      opacity: 0.9;
  }
  .contact-wrap .read-txt {
    text-align: center;
  }
  .thanks-txt p {
    font-size:106%;
    line-height:2.5;
    text-align: center;
  }
  #contact {
    padding: 8rem 0 10rem;
    position: relative;
  }
  .contact-wrap .flex-th {
    padding:0.9em;
  }
  .contact-wrap dl {
    padding:0.8em 0;
  }
}


@media screen and (min-width: 960px) {
  .contact-wrap dd {
      padding: 1rem 0;
  }
}


@media screen and (max-width:767px) {
  .submit-btns {
    margin: 1em auto;
  }
  /* form */
  .contact-wrap th, .contact-wrap td {
    width: 100%;
    display: block;
    text-align: left;
  }
  .flex-th {
    padding: 1rem 0;
  }
  .contact-wrap th {
    padding: 0;
  }
  .contact-wrap th, .contact-wrap td {
    border-bottom: 1px solid #ccc;
  }
  .contact-wrap td {
    padding-left: 0;
    padding-top: 1rem;
    padding-bottom: 2rem;
    padding-right: 0;
  }
  .contact-wrap tr:first-of-type td {
    border-top:none;
  }
  .form-main {
    margin:3rem 0 0;
  }
  .contact-wrap [type=submit] {
    width: 240px;
    height: 54px;
  }
  .contact-wrap label {
    display: flex;
  }
  .contact-wrap .flex-th {
    padding:0.6em;
  }
  .contact-wrap dl {
    padding:1em 0;
  }
  .contact-wrap .flex-th {
    margin-bottom:1em;
  }
  .form-bottom-check {
    display: flex;
    align-items: center;
    margin:1em 0;
  }
  .form-bottom-check * {
    line-height: 1.6;
  }
}



/* -----------------------------------------------------------
	animation
------------------------------------------------------------*/

.fadeLeft {
  animation-name: ani01;
  }
  @keyframes ani01 {
  0% {
  opacity: 0;
  -webkit-transform: translateX(-12%);
  -ms-transform: translateX(-12%);
  transform: translateX(-12%);
  }
  60% {
	opacity: 1;
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
  }
  }

/* -----------------------------------------------------------
	inview
------------------------------------------------------------*/
.inviewupdown {
  opacity: 0;
  height: 8.58vw;
}
.inviewupdown.updown {
  opacity: 1;
}
.inviewfadeInUp.delay {
  transition-delay: .5s;
}
.inviewfadeInUp {
opacity:0;
transform:translate(0,15%);
transition: 0.7s ease;
}
.fadeInUp {
opacity:1;
transform:translate(0, 0);
}
.inviewfadeInRight {
opacity:0;
transform:translate(10%,0);
transition:0.5s ease;
}
.fadeInRight {
opacity:1;
transform:translate(0, 0);
}
.inviewfadeInDown {
opacity:0;
transform:translate(0,-30%);
transition:0.5s ease;
}
.fadeInDown {
opacity:1;
transform:translate(0, 0);
}
.inviewfadeInLeft {
opacity:0;
transform:translate(-10%,0);
transition:0.5s ease;
}
.fadeInLeft {
opacity:1;
transform:translate(0, 0);
}
.inviewfadeIn {
opacity:0;
transition:0.5s ease;
}
.fadeIn {
opacity:1;
}

@media screen and (max-width:767px) {
  .inviewupdown {
    height:11vw;
  }
  .updown span {
   font-size: clamp(44px,calc(44/767*100vw),44px);
  }

}


/*------------------------------------------------------------*/
/* wp reset
------------------------------------------------------------*/
.page-block .wp-block-columns {
  margin-bottom:0;
}
.page-block .btn-blue .wp-block-button__link {
  padding:0;
  background:none;
}
.wp-block-columns.feature-wrap,
.wp-block-columns .pat,
.wp-block-columns .bg-grid {
  padding-left:5%;
  padding-right:5%;
}
.page-block .wp-block-columns.feature-wrap .in,
.page-block .wp-block-columns .in {
  flex-grow: 0.9!important;
}
.wp-block-columns .bg-mark .container {
  flex-basis: 90%!important;
}
.bg-mark .container {
  flex-basis: 95%!important;
}
@media (max-width: 781px) {
  .page-block .bgf.mat {
    padding-left:5%;
    padding-right:5%;
  }
  .wp-block-columns.bg-mark .container{
    padding-left:5%;
    padding-right:5%;
  }
  .page-block .container .in {
    padding-left:0;
    padding-right:0;
    width:100%;
  }
  .folding-map-case .container .in {
    width:90%;
  }
  .wp-block-buttons>.wp-block-button {
    margin:auto;
  }
  .wp-block-button__link {
    font-size: 1em;
  }
  .page-block .folding-map-case .bgf.mat {
    padding:0;
  }
  
}


@media screen and (min-width:768px) {
  .page-block .order2 {
    order:2!important;
  }
}


@media screen and (max-width:767px) {
  .single-area .addtoany_list.a2a_kit_size_32 a:not(.addtoany_special_service)>span {
    height: 26px;
    line-height: 26px;
    width: 26px;
  }
  .ecoscrach-case-txt {
    width:100%;
  }
  .ecoscratch-case {
    width:90%;
    margin:auto;
  }
  .container .short {
    width:100%;
  }

}


/*------------------------------------------------------------*/
/* case slide1
------------------------------------------------------------*/
#slide-wrap {
  margin:auto;
  max-width:1000px;
  width:100%;
}
.slide-in {
  border:1px solid #ccc;
  margin:0 auto 1em;
}
#slider1 {
  max-width:910px;
  width:90%;
  margin:0 auto;
}
.slide-txt {
  margin:1em 0 2em;
}
.slide-item .ttl-normal {
  margin-bottom:0.8em;
}
#slide-wrap .slick-slide  {
  height: auto;
}
.slide-item{
    width: 100%;
}
#thumbnail_slider {
  margin:0 -8px;
}
#thumbnail_slider .slick-slide { 
  margin:0 8px;
}
.thumbnail-item {
  border:1px solid #ccc;
  box-sizing: border-box;
}
.slick-current.slick-active .thumbnail-item {
  border:3px solid #009DE8;
}
.thumbnail-item img{
  width: 90%;
  margin: 0 auto;
}
.thumbnail-item:hover{
cursor: pointer;
}
#thumbnail_slider .slick-prev,
#thumbnail_slider .slick-next{
  width:40px;
  height: 40px;;
}
#thumbnail_slider .slick-prev {
  left: -40px;
}
#thumbnail_slider .slick-next {
  right: -40px;
}
#thumbnail_slider .slick-prev:before, 
#thumbnail_slider .slick-next:before {
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  margin:auto;
  left:0;
  background:url(../img/common/prev.svg)no-repeat 0 0;
  background-size:40px 40px!important;
  width:40px;
  height: 40px;;
  opacity: .75;
}
.slick-next:before {
  background:url(../img/common/next.svg)no-repeat 0 0; 
  right:0;
  left:inherit;
}

/* -----------------------------------------------------------
  popup
------------------------------------------------------------*/
/* popup */
.popup-link,
.popup-gallery1 a,
.popup-gallery2 a,
.popup-gallery3 a,
.popup-gallery4 a {
  text-decoration: none;
}
.mfp-arrow-right:before {
  border-left:none!important;
}
.mfp-arrow-left:after {
  border-left:none!important;
}
.mfp-arrow-left:before {
  border-right: none!important;
}
.mfp-close {
  font-size:2em;
}

/* popup youtube
------------------------------------------------- */
.mfp-bg{
  opacity: 0;
  transition: opacity 0.5s;
}
.mfp-bg.mfp-ready{
  opacity: 0.8;
}
.mfp-bg.mfp-removing{
  opacity: 0;
}
.mfp-wrap .mfp-content{
  opacity: 0;
  transition: opacity 0.5s;
}
.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}
.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}

/* ギャラリー
------------------------------------------------- */
/* オーバーレイ 初期状態 */
.mfp-fade.mfp-bg {
  opacity: 0;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  transition: all .3s ease-out;
}
/* オーバーレイ 表示アニメーション */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: .8;
}
/* オーバーレイ 非表示アニメーション */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}
/* コンテンツ 初期状態 */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  transition: all .3s ease-out;
}
/* コンテンツ 表示アニメーション */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
/* コンテンツ 非表示アニメーション */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}
.fuchinori .mfp-figure {
  padding:2em;
}
.fuchinori .mfp-wrap .mfp-img {
  background-color: #fff;
  padding-right:1em;
  padding-left:1em;
  margin-bottom:1em;
}
.fuchinori .mfp-figure:after {
  content:none!important;
}
.fuchinori .mfp-figure .mfp-bottom-bar {
  padding-left:2em;
}
@media screen and (max-width: 750px) {
  .mfp-container {
    padding: 0 10px;
  }
  #thumbnail_slider {
    margin:0 -3px;
  }
  #thumbnail_slider .slick-slide {
    margin: 0 3px;
  }
}