@charset "utf-8";

:root{
    --color-bk:#393836;
    --color-gy01:#999999;
    --color-gy02:#eeeeee;
    --color-gy03:#cccccc;
    --color-bl01:#00b4c8;
    --color-bl02:#d9f4f7;
    --color-bl03:#1663ab;
    --color-bl04:#f2fbfc;
    --color-bl05:#003869;
    --color-pk01:#e97da1;
    --font-inter:"Inter", sans-serif;
}

/*home*/

body#home #eye-c{
    margin-bottom: 150px;
    margin-top: 100px
}

@media screen and (max-height: 900px) {
    body#home #eye-c {
        margin-bottom: 150px;
    }
}

@media screen and (min-height: 901px) and (max-height: 1000px) {
    body#home #eye-c {
        margin-bottom: 128px;
    }
}

body#home #eye-c .inner{
    max-width: 1400px;
    position: relative;
    min-height: 680px;
    padding: 0;
    display: flex;
    align-items: flex-start;
}

body#home #eye-c .logo-box{
    width: 280px;
    display: flex;
    justify-content: center;
    top: 20px;
    position: relative;
    height: 580px;
    align-items: center;
}

body#home #eye-c .logo-box h1{
    width: 196px;
    margin-top: -40px
}

body#home #eye-c .logo-box h1 img{
    width: 100%
}

body#home #eye-c .img-box{
    width: calc(100% - 320px);
    height: 600px;
    background: url('/wp/wp-content/themes/mercurop/img/top/eye-c_pc.jpg') center no-repeat;
    position: absolute;
    right: 20px;
    top: 20px;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    border-radius: 20px;
    background-size: cover;
    padding: 0 0 30px 100px;
    background-position-y: 51%;
}

@media screen and (max-height: 760px) {
    body#home #eye-c .img-box{
        height: 560px;
        background-position-y: 49%;
    }

    body#home #eye-c .logo-box{
    height: 540px;
}
}

body#home #eye-c .img-box br{
    display: none;
}

body#home #eye-c .img-box h2{
    font-size: 30px;
    line-height: 1;
    color: #fff;
    font-weight: 700
}

body#home #eye-c .img-box .glass{
    position: absolute;
    width: 140px;
    left: -80px;
    bottom: -40px
}

body#home #intro{
    margin-bottom: 140px
}

body#home #intro .inner{
    display: flex;
    gap: 130px;
    justify-content: center;
}

body#home #intro .inner .txt-box{
    width: 210px;
    font-size: 16px;
    order: 1;
    font-weight: 600;
    margin-left: 60px;
    line-height: 2.2;
    letter-spacing: 0.08em;
}

body#home #intro .inner .txt-box p+p{
    margin-top: 4.0rem
}

body#home #intro .inner .tit-box{
    order: 2;
    position: relative;
    width: 280px
}

body#home #intro .inner .tit-box h2{
    font-size: 30px;
    line-height: 6.8rem;
    letter-spacing: 0.12em;
    margin-top: -18px;
    font-weight: 700;
}

body#home #intro .inner .tit-box .wave{
    position: absolute;
    bottom:0;
}

body#home #intro .bird{
    position: absolute;
    bottom: 130px;
    right: 70px;
    width: 90px
}

body#home #faq .inner,
body#home #blog .inner,
body#home #information .inner{
    max-width: 920px
}

body#home #example .center-list a{
    width: 360px;
    height: 360px;
    background-color: #fff;
    border-radius: 100%;
    transition: 0.2s;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    scale: 0.8;
    position: relative;
}

body#home #example .center-list a:hover{
    opacity: 1
}

body#home #example .center-list .swiper-slide-active a{
    scale:1;  
}

body#home #example .center-list .swiper-slide.sl2 a img{
    margin-top: -50px
}

body#home #example .center-list a img{
    height: 150px;
    width: auto;
    margin-top: -40px;
}

body#home #example .center-list a h3{
    font-size: 18px;
    line-height: 2.8rem;
    font-weight: 600;
    position: absolute;
    bottom: 50px
}

body#home #prices .inner{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

body#home #prices .btns{
    margin-top: 50px
}


body#home .gallery-list{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 40px;
}


body#home #evidence .inner{
    max-width: 1000px
}

body#home #about .inner{
    max-width: 660px
}

body#home #about .inner .h-set+p{
    font-size: 14px;
    text-align: justify;
}

#campaign .slide-nav,
#voice .slide-nav{
    display: none;
}

body#water:not(.faq)  .main-head{
    color: #fff;
    margin-bottom: 20px
}

body#water:not(.faq) #breadcrumbs{
    background-color: var(--color-bl05);
}

body#water:not(.faq) .base.nb{
    padding-top: 0
}

body#water:not(.faq) #breadcrumbs,
body#water:not(.faq) #breadcrumbs a{
    color: #fff
}

body#water #eye-c{
    /*background: url('/wp/wp-content/themes/mercurop/img/pages/kv_water.jpg') center no-repeat;*/
    /*background-size: cover;*/
    /*animation: Grad 30s ease infinite;*/
    /*padding: 20px*/
}

@keyframes Grad {
    0%{background-position: 100% 50%;background-size: 150%;}
    50%{background-position: 100% 100%;background-size: 200%;}
    100%{background-position: 100% 50%;background-size: 150%;}
}

body#water #eye-c .inner{
    display: flex;
    justify-content: center;
    align-items: center;
    /*max-width: 1280px;*/
    max-width: 100%;
    height: 460px;
    overflow: hidden;
/*    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);*/
    /*box-shadow: 0 0 20px rgba(0,0,0,0.6);*/
    /*border-radius: 10px;*/
    /*padding: 20px;*/
}


body#water #eye-c .inner h2{
    position: absolute;
    color: #fff;
    font-weight: 600;
    font-size: 4rem;
    line-height: 1.6;
    z-index: 2
}

body#water #eye-c .inner div{
    background: url('/wp/wp-content/themes/mercurop/img/pages/kv_water.jpg') center no-repeat;
    background-size: cover;
    position: absolute;
    z-index: 1;
    /*width: calc(100% - 20px);*/
    height: 100%;
    max-width: 1280px;
    width: 100%;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    /*box-shadow: 0 0 20px rgba(0,0,0,0.6);*/
}

body#water #box1,body#water #box2,body#water #box3,body#water #box4{
    color: #fff;
    font-size: 16px;
}

body#water #box1{
    margin-top: 60px
}

body#water #box1 p{
    text-align: justify;
}

body#water #box1 .img-box{
    height: 460px;
    width: 640px;
    overflow: hidden;
    border-radius: 10px
}

/*body#water #box1 .img-box img{
    margin-top: -40px
}*/

body#water #box1 .inner,
body#water #box2 .inner,
body#water #box3 .inner,
body#water #box4 .inner{
    display: flex;
    align-items: center;
    flex-direction: column;
    max-width: 900px;
}

body#water #box2 h2,
body#water #box3 h2,
body#water #box4 h2{
    color: #fff
}

body#water #box1 .txt-box,
body#water #box2 .txt-box,
body#water #box3 .txt-box,
body#water #box4 .txt-box,
body#water #box4 .table-box{
    max-width: 720px;
    padding: 0 40px;
    margin-bottom: 30px
}

body#water .img-box.full{
    max-width: 50%;
    margin: 0 auto;
}

body#water #box1 .txt-box{
    margin-bottom: 40px;
}

body#water #box2 .img-box{
    overflow: hidden;
    border-radius: 6px
}

body#water #box3 .content-box{
    display: flex;
    gap: 20px;
    flex-direction: column;
}

body#water #box3 .content-box>li{
    padding: 40px;
    border-radius: 6px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

body#water #box3 .content-box li h3{
    color: var(--color-bl01);
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 30px
}

body#water #box3 .content-box li p{
    font-size: 16px;
    color: var(--color-bk);
    margin-bottom: 30px
}

body#water #box4 .txt-box h3{
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 10px;
    text-align: center;
}

body#water #box4 .txt-box p+h3{
    margin-top: 40px;
}

body#water #box4 .table-box{
    margin-bottom: 50px
}

body#water #box4 .line-table tr{
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

body#water #quality .inner{
    max-width: 880px;
    font-size: 16px
}

body#water #quality .inner .img-box{
    border-radius: 10px;
    overflow: hidden;
}

body#water #quality .inner .img-box+.txt-box{
    padding: 0 40px;
    margin-top: 50px
}

body#water #quality .inner .txt-box+.link-box{
    margin-top: 50px
}

#sdgs .inner{
    max-width: 880px;
    font-size: 16px
}

#selection .inner,
body#water #bottle .inner{
    max-width: 920px;
    font-size: 16px
}

#selection .img-box{
    border-radius: 10px;
    padding: 10px
}

#selection .txt-box{
    max-width: 680px;
    margin: 30px auto 0;
}

#selection .point-list{
    margin-bottom: 20px
}

body#water #bottle .img-box{
    overflow: hidden;
    height: 380px;
    border-radius: 10px;
}


body#water #bottle .btns{
    margin-top: 30px
}

body#product #server_list .inner{
    max-width: 980px
}

body#product #spec .inner{
    max-width: 1100px
}
body#product #spec .spec-box{
    display: flex;
    gap: 20px;
    justify-content: center;
}

body#product #spec .spec-box li{
    border: 1px solid var(--color-gy02);
    border-radius: 10px;
    overflow:hidden;
    width: calc(100% / 3);
    display: flex;
    flex-direction: column;
    padding-bottom: 20px
}

#spec .spec-top {
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--color-gy02);
  font-size: 12px
}

#spec .spec-top .color {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 10px;
}

#spec .spec-top .color-circle {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid transparent;
}

#spec .spec-top .color-circle[data-color="white"] { background-color: #FFF; border: 2px solid #ccc; }
#spec .spec-top .color-circle[data-color="black"] { background-color: #000; }
#spec .spec-top .color-circle[data-color="brown"]   { background-color: #764524; }

#spec .spec-top .color-circle.active {
  border: 2px solid var(--color-bl01);
}

body#product #spec .spec-box .spec-img{
    height: 220px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

body#product #spec .spec-box .spec-img img{
    height: auto;
    width: 50px;
}

body#product #spec .spec-box .spec3 .spec-img img{
    height: auto;
    width: 44px;
}

body#product #spec dl dt{
    padding:20px 20px 0;
    line-height: 1.7;
    font-weight: 700;
}

body#product #spec dl dd{
    border-bottom: 1px solid var(--color-gy02);
    padding:0 20px 20px;
    line-height: 1.7;   
}

body#product #spec .areaDesc .box .border_none{
    border-bottom: unset;
}

body#product #spec dl{
    text-align: center;
}

body#product #spec dl dt{
    font-weight: 700;
    font-size: 16px;
}

body#product #spec dl dd{
    font-size: 14px;
}

body#product #spec dl dd.line2{
    min-height: 72px;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.4
}

body#product #spec dl dd.line-ex{
    min-height: 53px;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.4
}

body#product #spec dl dd.line4{
    min-height: 122px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    line-height: 1.7
}

body#product #spec dl dd.line5{
    min-height: 140px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    line-height: 1.7
}

body#product #spec dl .txt-01{
    font-weight: 700;
    text-align: center;
    margin-top: 6px
}

body#product #spec dl .txt-01 p.notice{
    font-weight: 400;
    margin-top: 4px
}

body#product #spec dl dd.txt-01 span{
    font-size: 2.6rem;
    font-family: var(--font-inter);
}

body#product #spec .btns{
    width: 60%;
    margin-top: 20px
}

body#product #spec .mark{
    display: flex;
    justify-content: center;
    align-items: center;
}

body#product #spec .circle{ 
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 100%;
    border: 3px solid var(--color-bk);
    box-sizing: border-box;
    margin-top: 8px
}

body#product #spec .straight_line{
    height: 24px;
    margin-top: 8px
}

body#product #spec .straight_line:before{
    content: "";
    display: inline-block;
    height: 3px;
    width: 24px;
    background-color: var(--color-bk);
}

body#product #maintenance .mid{
    margin-top: 0
}

body#product #maintenance ul li:first-child{
    border-radius: 10px;
    overflow: hidden;
}

body#product #maintenance h4{
    font-size: 2.8rem;
    font-weight: 600;
    margin-bottom: 20px;
    text-align: center;
}

body#product #maintenance .link-box{
    margin-top: 30px
}

body#product #others .inner{
    max-width: 810px
}

body#product #others .center-list{
    gap: 20px;
}

body#product #others .center-list li{
    border: 1px solid var(--color-gy02);
    overflow: hidden;
    border-radius: 10px
}

body#product #others .center-list a{
    width: 280px;
    height: 380px;
    background-color: #fff;
}

body#product #others .center-list .img-box{
    height: auto
}

body#product #others .center-list .img-box img{
    width: 100%
}

body#product #others .center-list .info-box{
    padding: 20px 20px 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 100px
}

body#product #others .center-list .info-box h3{
    text-align: left;
    font-size: 15px;
    line-height: 1.2;
    font-weight: 600;
    margin-bottom: 20px;
    text-align: justify;
    margin-top: -4px
}

body#product #others .center-list .info-box img{
    width: 14px;
    height: 14px
}

body#faq #category .inner{
        max-width: 920px;
}

body#faq #category .date-box{
/*  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 30px;*/
  border-bottom:none;
}
/*body#faq #category .date-box li:nth-child(6),*/
body#faq #category .date-box li:last-child{
  border-bottom: 1px solid var(--color-gy02);
}

body.faq .cat-index .cat-box{
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 12px;
}

body.faq .cat-index .cat-box li a{
  /*border-bottom: 1px solid;
  font-weight: 600*/
      background-color: #fff;
    border: 1px solid var(--color-gy02);
    border-radius: 40px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 40px;
    color: var(--color-bk);
    padding-left: 20px;
    font-size: 12px;
    position: relative;
    font-weight: 500
}

body.faq .cat-index .cat-box li a img {
    right: 15px;
    position: absolute;
    right: 24px;
    width: 14px;
}

body.faq .cat-index .cat-box li a.select{
  border-bottom: none;
  opacity: 0.5;
  pointer-events: none;
}

.inquiry-btn-box{
  text-align: center;
  margin-top: 80px;
}

.inquiry-btn-box p{
  font-size: 16px;
  font-weight: 600
}

.inquiry-btn-box .btns{
  margin-top: 24px;
}

body.faq .caption{
  font-weight: 600;
  font-size: 24px;
  margin-bottom: 30px;
  text-align: center;
}

body.faq .caption.blue{
  color: var(--color-bl01);
}

body.product .mark_jdsa{
  width: 100px;
}

body.product .feature-box dd .space{
  margin-bottom: 20px;
}
/*
body#nankatsusc #prices .box-list{
  display: grid;
  grid-template-areas: "areaA areaB"
  "areaC areaC";
}

body#nankatsusc #prices .box-list .box:nth-child(1){
  grid-area: areaA;
}

body#nankatsusc #prices .box-list .box:nth-child(2){
  grid-area: areaB;
}

body#nankatsusc #prices .box-list .box:nth-child(3){
  grid-area: areaC;
}

body#nankatsusc #prices .box-list>li{
  width: 100%;
}

body#nankatsusc #prices .box-list .box:nth-child(3) .notice{
  text-align: center;
}*/

body#nankatsusc #prices .box-list{
    justify-content: center;
}

body#nankatsusc #pr .bnr{
  display: block;
  max-width: 400px;
  margin: 50px auto;
}

body#price #intro dl{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

body#price #intro .inner{
    max-width: 540px
}

body#price #intro .outer{
    border-radius: 10px;
    padding: 60px 0 80px;
    border: 2px solid var(--color-bl01)
}

body#price #intro .outer dt .round-cap,
body#price #intro .outer dt .mid{
    font-size: 14px
}

body#price #intro .outer dt .round-cap{
    height: auto;
    padding: 8px 20px 11px;
    margin-bottom: 2px
}

body#price #intro .outer dt{
    margin-bottom: 4px
}

body#price #intro .outer .mid{
    margin-top: 0
}

body#price #intro dl .mid {
    margin: 10px auto;
}

body#price #prices .inner{
    max-width: 980px;
}


body#price #prices .nom-center{
    font-size: 18px;
    margin-bottom: 50px
}

body#price #prices .plus-box .box{
        height: 380px;
        width: 50%
    }

body#price #prices .plus-box .box.nest .box-in{
    width: 100%;
    padding: 0 80px
}

body#price #prices .plus-box .box ul.notice{
    margin-top: 20px
}

body#price #prices .plus-box ul.notice{
    margin-top: 10px
}

body#price #intro dd{
    transform: scale(1.5);
}

body#price #support .inner{
    max-width: 620px;
}

body#price #support .box{
    padding: 40px 80px;
    background-color: var(--color-bl04);
    border-radius: 10px;
    margin-bottom: 20px
}

body#price #support .box .band-list+p{
    margin-top: 20px
}

body#price #support .box .mid{
    margin-top: 0
}

body#price #individual .inner{
    max-width: 980px;
}

body#price #individual .img-box{
        height: 280px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

body#price #individual .img-box>img,
body#price #individual .box-wrap2 .img-box>img{
    width: 70px;
    /*height: 260px*/
}

body#price #individual .box-wrap2 .img-box>img.slims{
    width: 62px;
}

body#price #individual .table-box table{
    min-width: 350px
}

body#price #individual h4.caption{
    margin-top: 20px;
    margin-bottom: 0;
    font-size: 20px
}

body#price #individual .box-wrap1,
body#price #individual .box-wrap2{
    padding: 30px 30px 0
}

body#price #individual .box-wrap2{
    display: flex;
    gap:20px;
        align-items: flex-end;
            justify-content: center;
}

body#price #individual .box-wrap2 .box-in{
    width: calc(50% - 20px)
}

body#price #individual .box-wrap1 .btns{
    max-width: 160px
}
body#price #individual .box-wrap2 .btns{
    max-width: 160px
}

body#price #individual h5{
    font-weight: 600;
    margin-bottom: 10px
}

body#price #individual th{
    width: 70%;
    box-sizing: border-box;
    padding-left: 15px
}

body#price #individual td{
    width: 30%
}

body#price #individual .table-box.color{
    border: none;
    font-size: 14px
}

body#price #individual .table-box.color tr td{
    border: 1px solid var(--color-gy02)
}

body#price #individual .price{
    margin-top: 26px;
    transform: scale(1.2);
}

body#price #simulation .inner{
    max-width: 920px;
}

body#price #simulation .step-box{
    margin-top: 50px
}

body#price #simulation li.step1 .round-cap,
body#price #simulation li.step2 .round-cap{
    width: 32%;
    position: absolute;
    top: -15px;
    padding:7px 0 9px;
    height: auto;
    font-size: 15px;
    line-height: 1;
}

body#price #simulation li{
    position: relative;
}

body#price #simulation li.step1,
body#price #simulation li.step2{
    padding-top: 40px
}

body#price #simulation h5{
    font-weight: 600;
    margin-bottom: 10px;
    font-size: 16px
}

body#price #simulation li.step1 dl,
body#price #simulation li.step2 dl{
    display: flex;
    margin-bottom: 30px;
    font-size: 16px;
    gap: 20px;
}

body#price #simulation li.step1 dl dt,
body#price #simulation li.step1 dl dd{
    display: flex;
    align-items: center;
}

body#price #simulation li.step1 dl .selectbox{
        margin: 0 6px;
        position: relative;
        display: flex;
        align-items: center;
        width: 80px; 
}

body#price #simulation li.step1 dl .select-type {
        font-weight: 700;
        font-size: 14px;
        background-color: #fff;
        border: 1px solid var(--color-gy02);
        width: 100%;
        height: 40px;
        padding-left: 16px;
        border-radius: 5px;
        position: relative;
        color: var(--color-bk);
    }
body#price #simulation li.step1 dl .selectbox:after {
        content: '';
        width: 6px;
        height: 6px;
        position: absolute;
        right: 14px;
        margin-top: -2px;
        border-top: solid 2px var(--color-bk);
        border-right: solid 2px var(--color-bk);
        transform: rotate(135deg);
        pointer-events: none;
    }

body#price #simulation li.step2 dl p{
    font-weight: 700;
    font-size: 14px;
    background-color: #fafafa;
    border: 1px solid var(--color-gy02);
    width: 100%;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    border-radius: 5px;
    position: relative;
    color: #999;
    cursor: pointer;
}

body#price #simulation li.step2 dl p.active{
    background-color: #666666;
    color: #fff
}

body#price #simulation li.result{
        width: 60%;
    margin-left: 20%;
}

body#price #simulation li.result .round-cap{
    padding:7px 0 9px;
    height: auto;
    font-size: 15px;
    line-height: 1;
    width: 220px;
    margin: 0 auto
}

body#price #simulation .nom-center{
    margin-bottom: 60px
}

body#price #simulation li.result .price{
    transform: scale(1.5);
    margin: 20px 0 30px;
    justify-content: center;
}

body#price #simulation li.result p.notice{
    font-size: 14px;
    text-align: center;
}

body#price #simulation li.result h5{
    text-align: center;
    margin-top: 30px
}

body#price #simulation li.result table{
    border: none;
    font-size: 14px;
        min-width: auto;
}

body#price #simulation li.result table th{
    padding-left: 20px;
    width: 60%
}

body#price #simulation li.result table td{
    width: 40%;
    text-align: center;
}

body#price #simulation li.result ul.notice{
    margin-top: 10px
}

body#price #response .inner{
    max-width: 920px;
}

body#price #response .box-list{
    margin-bottom: 30px
}

body#price #response .box-list>li{
    padding: 30px;
    text-align: left;
}

body#price #response .box-list>li p+p{
    margin-top: 10px
}

body#price #payment .inner{
    max-width: 920px;
}

body#price #payment .box-list>li {
    padding: 30px;
    text-align: left;
    overflow: visible;
}

body#price #payment .box-list>li .mid{
    margin-bottom: 10px
}

body#price #payment .box-list>li .sml{
    font-size: 16px;
    margin: 0px 0 20px
}

body#about .main-head{
    margin-bottom: 30px
}

body#about #intro{
    margin-top: 0
}

body#about #intro .inner{
    width: 870px
}

body#about #intro .two-column{
    justify-content: center;
    gap: 40px;
    width: 870px
}

body#about #intro li:last-child{
    display: flex;
    justify-content: center;
    align-items: flex-start;
        flex-direction: column;
}

body#about #intro h2{
    flex-wrap: wrap;
    gap: 5px 0;
    margin-left: 0;
    font-size: 24px;
    padding: 0
}

body#about #intro h2 span{
    background-color: #fff;
    color: var(--color-bl01); 
}

body#about #intro h2 span:first-child{
    padding-left: 10px;
    border-radius: 4px 0 0 4px
}

body#about #intro h2 span:nth-child(2){
    padding-right: 10px;
    border-radius: 0 4px 4px 0
}

body#about #intro h2 span:nth-child(3){
    padding-left: 10px;
    border-radius: 4px 0 0 4px
}

body#about #intro h2 span:last-child{
    padding-right: 10px;
    border-radius: 0 4px 4px 0
}

body#about #intro li:last-child p{
    color: #fff;
    font-size: 15px;
    font-weight: 600;
}

body#about .h-set.nm + .mid{
    margin-top: -20px
}

body#about #box1 .inner,
body#about #box2 .inner,
body#about #box3 .inner,
body#about #box4 .inner{
    max-width: 680px
}

body#about #box1 .txt-box,
body#about #box2 .txt-box,
body#about #box3 .txt-box,
body#about #box4 .txt-box{
    padding: 0 10%
}

body#about #box1 .link-box,
body#about #box2 .link-box,
body#about #box3 .link-box,
body#about #box4 .link-box{
    margin-top: 30px
}

body#about #box1 .in-box,
body#about #box2 .in-box,
body#about #box3 .in-box,
body#about #box4 .in-box{
    margin-bottom: 50px
}

body#about #box2 .band-list{
    margin-bottom: 10px
}

body#about section+section {
    margin-top: 80px;
}



body#company #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#company #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#company #intro .txt-box{
    max-width: 640px;
    margin: 0 auto
}

body#company .h-set.nm + .mid{
    margin-top: -20px
}

body#company #box1 .inner{
    max-width: 820px
}

body#company #box2 .inner,
body#company #box3 .inner,
body#company #box4 .inner{
    max-width: 660px
}

body#company #box1 .txt-box,
body#company #box3 .txt-box,
body#company #box4 .txt-box{
    padding: 0 10%
}

body#company #box1 .link-box,
body#company #box2 .link-box,
body#company #box4 .link-box{
    margin-top: 30px
}

body#company #box3 .link-box{
    margin-top: 50px
}

body#company #box2 .link-box{
    margin-top: 20px;
    padding-bottom: 0
}

body#company #box1 .in-box,
body#company #box2 .in-box,
body#company #box3 .in-box,
body#company #box4 .in-box{
    margin-bottom: 50px
}

body#company #box2 .band-list{
    margin-bottom: 10px
}

body#company section+section {
    margin-top: 80px;
}

body#company section+section {
    margin-top: 80px;
}

body#company .business{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
}

body#company .business li{
    padding: 30px;
    border-radius: 8px;
    background-color: var(--color-bl04);
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

body#company .business li .mid{
    font-size: 18px;
    margin-top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px
}

body#company #box1 .pm-list dd a{
    text-decoration: underline;
}

body#company #box2 .txt-box{
    font-size: 14px;
    display: flex;
    align-items: center;
    font-weight: 500;
}

body#company #box2 .txt-box p{
    text-align: center;
}

body#company #box4 .credo{
    border: 1px solid #00b4c8;
    width: 620px;
    margin: 60px auto 0
}

body#company #box4 .credo ul{
    padding: 30px 30px 50px;
    text-align: center;
}

body#company #box4 .credo ul .mid{
    margin-bottom: 0
}

body#company #box5 .inner{
    max-width: 660px
}

body#company #box5 .img-box{
    border-radius: 10px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 100px 0
}

body#company #box5 .img-box img{
    width: 50%;
}

body#company #box5 .img-box+ul{
    padding: 0 10%
}

body#company #box6 .nom-center{
    font-size: 16px;
}

body#eco #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#eco #intro .img-box.eco-m{
    max-width: 200px;
}

body#eco #intro .txt-box+.img-box{
    margin-top: 20px
}

body#eco #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#eco .pm-list{
    font-size: 14px
}

body#eco .pm-list dt{
    width: 30%;
}

body#eco .pm-list dd{
    width: 70%;
}

body#eco .txt-box{
    max-width: 640px;
    margin: 0 auto
}

body#eco .min{
    width: 200px;
    margin: 20px auto
}

body#eco .pm-list{
    max-width: 640px;
    margin: 0 auto 30px 
}

body#eco #box1 .inner,
body#eco #box2 .inner,
body#eco #box3 .inner,
body#eco #box4 .inner,
body#eco #box5 .inner{
    max-width: 660px;
}

body#eco #box1 .img-box,
body#eco #box2 .img-box,
body#eco #box3 .img-box,
body#eco #box4 .img-box,
body#eco #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 30px
}

body#eco #box1 .notice,
body#eco #box2 .notice,
body#eco #box3 .notice,
body#eco #box4 .notice,
body#eco #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#eco .outlo{
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: #00b4c8
}

body#quality #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#quality #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#quality #intro .sdgs{
    border-radius: 0;
    margin-top: 40px
}

body#quality #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#quality .txt-box{
    max-width: 640px;
    margin: 0 auto
}

body#quality .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#quality .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#quality .pm-list{
    max-width: 640px;
    margin: 0 auto 30px 
}

body#quality #box1 .inner,
body#quality #box2 .inner,
body#quality #box3 .inner,
body#quality #box4 .inner,
body#quality #box5 .inner{
    max-width: 660px;
}

body#quality #box1 .img-box{
    border-radius: 0px;
    overflow: hidden;
    margin: 40px auto 0
}

body#quality #box2 .img-box,
body#quality #box3 .img-box,
body#quality #box4 .img-box,
body#quality #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 30px
}

body#quality #box1 .notice,
body#quality #box2 .notice,
body#quality #box3 .notice,
body#quality #box4 .notice,
body#quality #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#quality .outlo{
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: #00b4c8
}

body#quality .round-cap.min{
    width: 40%;
    margin-top: 40px;
    margin-bottom: -30px;
    margin: 40px auto -30px
}

body#quality #box2 .two-column{
    background-color: var(--color-bl04);
    border-radius: 10px;
    padding: 30px;
    margin-top: 30px;
    width: calc(100% + 100px);
    margin-left: -50px;
    margin-bottom: 50px
}

body#quality #box2 .two-column .img-box{
    margin-bottom: 0
}

body#quality .mid.min{
    margin-top: 0;
    font-size: 18px;
    margin-bottom: 10px
}

body#quality .mid.min+.sml{
    margin-top: 10px
}

body#quality .link-box{
    margin-top: 30px;
    margin-bottom: 0
}

body#quality .link-box+.img-box{
    margin-top: 50px
}

body#quality .c-box{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 50px;
}

body#quality .link-box+.c-box{
    margin-top: 30px
}

body#quality .c-box>li {
    padding: 30px 30px 40px;
    border-radius: 8px;
    background-color: var(--color-bl04);
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

body#quality .inner-link{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 10px;
    width: 100%;
    margin-top: 30px;
}

body#quality .inner-link a{
    background-color: #fff;
    border: 1px solid var(--color-gy02);
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
}

body#factory #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#factory #intro .notice{
    margin-top: 20px
}

body#factory .lines{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
}

body#factory .lines.l2{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

body#factory .txt-box{
    max-width: 640px;
    margin: 0 auto
}

body#factory .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#factory .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#factory .round-cap.min{
    width: 120px;
    margin: 0px auto -40px;
/*    height: 30px;
    padding: 0;*/
    font-size: 16px
}

body#factory .pm-list{
    max-width: 640px;
    margin: 0 auto 30px 
}

body#factory #box1 .inner,
body#factory #box2 .inner,
body#factory #box3 .inner,
body#factory #box4 .inner,
body#factory #box5 .inner{
    max-width: 980px;
}

body#factory #box2 .inner{
    max-width: 1120px;
}

body#factory #box1 .img-box{
    overflow: hidden;
    border-radius: 10px;
    margin: 0 auto 20px
}

body#factory #box2 .img-box,
body#factory #box3 .img-box,
body#factory #box4 .img-box,
body#factory #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 30px
}

body#factory #box1 .notice,
body#factory #box2 .notice,
body#factory #box3 .notice,
body#factory #box4 .notice,
body#factory #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#factory .outlo{
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: #00b4c8;
}

body#factory .outlo p{
    margin-bottom: 40px
}

body#petbottle #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#petbottle #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#petbottle .txt-box{
    max-width: 680px;
    margin: 0 auto
}

body#petbottle .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#petbottle .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#petbottle .pm-list{
    max-width: 640px;
    margin: 0 auto 30px 
}


body#petbottle #box1 .img-box,
body#petbottle #box2 .img-box,
body#petbottle #box3 .img-box,
body#petbottle #box4 .img-box,
body#petbottle #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
}

body#petbottle #box1 .notice,
body#petbottle #box2 .notice,
body#petbottle #box3 .notice,
body#petbottle #box4 .notice,
body#petbottle #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#petbottle .lineup{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 40px;
}

body#petbottle .lineup li{
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    align-items: center;
    display: flex;
    flex-direction: column;
    text-align: center;
}

body#petbottle .lineup li .price{
    transform: scale(1.2);
}

body#petbottle .lineup li p.nom{
    margin-top: 20px;
    font-weight: 500
}

body#petbottle #box2 .nom{
    text-align: center;
}

body#petbottle #box2 .lb{
    max-width: 620px
}

body#petbottle #box2 .lb .nom{
    text-align: justify;

}

body#petbottle .link-box{
    margin-top: 30px;
    margin-bottom: 0
}

body#bottle #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#bottle #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#bottle .txt-box{
    max-width: 680px;
    margin: 0 auto
}

body#bottle .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#bottle .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#bottle .pm-list{
    max-width: 640px;
    margin: 0 auto 30px 
}
/*
body#bottle #box1 .inner,
body#bottle #box2 .inner,
body#bottle #box3 .inner,
body#bottle #box4 .inner,
body#bottle #box5 .inner{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
}*/

body#bottle #box1 .img-box,
body#bottle #box2 .img-box,
body#bottle #box3 .img-box,
body#bottle #box4 .img-box,
body#bottle #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    margin-bottom: 20px
}

body#bottle #box1 .img-box p,
body#bottle #box2 .img-box p,
body#bottle #box3 .img-box p,
body#bottle #box4 .img-box p,
body#bottle #box5 .img-box p{
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-color: #fff;
    border: 1px solid #00b4c8;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 20px;
    top: 20px;
    font-family: var(--font-inter);
    font-weight: 700;
    color: #00b4c8;
    font-size: 18px;
}

body#bottle #box1 .notice,
body#bottle #box2 .notice,
body#bottle #box3 .notice,
body#bottle #box4 .notice,
body#bottle #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#bottle .lines{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
}

body#bottle .q-box{
    background-color: var(--color-bl04);
    padding: 20px 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
        border-radius: 10px;
        margin-top: 30px
}

body#bottle .q-box .question{
    display: flex;
    width: 40px;
    height: 40px;
    background-color: var(--color-bl01);
    border-radius: 100%;
    color: #fff;
    font-family: "Inter";
    font-size: 20px;
    justify-content: center;
    align-items: center;
    font-weight: 800;
    /* margin-right: 24px; */

}

body#bottle #box3 .q-box{
    background-color: #fff
}

body#bottle #box3 .two-column .img-box{
    border: 1px solid var(--color-gy02);
    margin-bottom: 0
}

body#bottle .mid.min{
    margin-top: 10px;
    font-size: 18px;
    margin-bottom: 10px
}

body#bottle #box3 .mid.min{
    margin-bottom: 20px
}

body#bottle .link-box{
    margin-top: 30px;
    margin-bottom: 0
}

body#cock #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#cock #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#cock .txt-box{
    max-width: 680px;
    margin: 0 auto
}

body#cock .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#cock .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#cock .sml{
    margin-top: 0;
    margin-bottom: 4px;
    font-size: 20px
}

body#cock .b-price{
    font-size: 18px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
    color: #00b4c8
}

body#cock #box1 .inner,
body#cock #box2 .inner,
body#cock #box3 .inner,
body#cock #box4 .inner,
body#cock #box5 .inner{
/*    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;*/
}

body#cock #box2 .inner{
    max-width: 660px
}

body#cock #box1 .img-box,
body#cock #box2 .img-box,
body#cock #box3 .img-box,
body#cock #box4 .img-box,
body#cock #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    width: 100%;
    text-align: center;
}

body#cock #box1 .img-box img,
body#cock #box2 .img-box img,
body#cock #box3 .img-box img,
body#cock #box4 .img-box img,
body#cock #box5 .img-box img{
    width: 60%;
}

body#cock #box1 .notice,
body#cock #box2 .notice,
body#cock #box3 .notice,
body#cock #box4 .notice,
body#cock #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#cock #box2 .notice{
    margin-bottom: 30px
}

body#cock #box1 .notice li,
body#cock #box2 .notice li,
body#cock #box3 .notice li,
body#cock #box4 .notice li,
body#cock #box5 .notice li{
    overflow: visible;
    width: 100%;
    text-align: left;
}

body#cock .num-list{
    text-indent: -16px;
    padding-left: 16px;
    font-size: 16px;
    font-weight: 500
}

body#cock .riyou{
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 40px;
    margin-top: 30px
}

body#cock .riyou>li{
    padding: 30px;
    background-color: var(--color-bl04);
    border-radius: 10px;
    align-items: center;
    display: flex;
    flex-direction: column;
    text-align: center;
}

body#cock .riyou a{
    color: #00b4c8;
    text-decoration: underline;
}

body#cock .riyou .mid{
    margin-top: 0
}

body#cock .lineup li .price{
    transform: scale(1.2);
}

body#cock .lineup li p.nom{
    margin-top: 20px;
    font-weight: 500
}

body#cock #box2 .nom{
    text-align: center;
}

body#cock .link-box{
    margin-top: 30px;
    margin-bottom: 0
}

body#parts #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#parts #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#parts .txt-box{
    max-width: 680px;
    margin: 0 auto;
    text-align: justify;
}

body#parts #box1 .txt-box{
    max-width: 680px;
    margin-left: 0;
    width: 100%
}

body#parts .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#parts .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#parts .sml{
    margin-top: 0;
    margin-bottom: 4px;
    font-size: 20px
}

body#parts .b-price{
    font-size: 18px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
    color: #00b4c8
}

body#parts #box1 .inner,
body#parts #box2 .inner,
body#parts #box3 .inner,
body#parts #box4 .inner,
body#parts #box5 .inner{
    max-width: 980px;
}

body#parts #box1 .img-box,
body#parts #box2 .img-box,
body#parts #box3 .img-box,
body#parts #box4 .img-box,
body#parts #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px
}

body#parts #box1 .notice,
body#parts #box2 .notice,
body#parts #box3 .notice,
body#parts #box4 .notice,
body#parts #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#parts #box2 .notice{
    margin-bottom: 30px
}

body#parts #box1 .notice li,
body#parts #box2 .notice li,
body#parts #box3 .notice li,
body#parts #box4 .notice li,
body#parts #box5 .notice li{
    overflow: visible;
    width: 100%;
    text-align: left;
}

body#parts .num-list{
    text-indent: -16px;
    padding-left: 16px;
    font-size: 16px;
    font-weight: 500
}

body#parts .lines{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 60px;
    margin-top: 30px
}

body#parts .lines>li{
    /*padding: 30px;*/
    border-radius: 10px;
    align-items: center;
    display: flex;
    flex-direction: column;
    text-align: center;
}

body#parts .riyou a{
    color: #00b4c8;
    text-decoration: underline;
}

body#parts .riyou .mid{
    margin-top: 0
}

body#parts .lineup li .price{
    transform: scale(1.2);
}

body#parts .lineup li p.nom{
    margin-top: 20px;
    font-weight: 500
}

body#parts #box2 .nom{
    text-align: center;
}

body#parts .link-box{
    margin-top: 30px;
    margin-bottom: 0
}




body#csr #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#csr #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#csr .txt-box{
    max-width: 640px;
    margin: 0 auto
}

body#csr .txt-box a{
    text-decoration: underline;
    color: var(--color-bl01);
}

body#csr .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#csr .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#csr .sml{
    margin-top: 0;
    margin-bottom: 4px;
    font-size: 20px
}

body#csr .b-price{
    font-size: 18px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
    color: #00b4c8
}

body#csr #box1 .inner,
body#csr #box2 .inner,
body#csr #box3 .inner,
body#csr #box4 .inner,
body#csr #box5 .inner{
    max-width: 680px;
}

body#csr #box1 .img-box,
body#csr #box2 .img-box,
body#csr #box3 .img-box,
body#csr #box4 .img-box,
body#csr #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px;
    border: 1px solid var(--color-gy02);
}

body#csr #box1 .img-box{
    margin-bottom: 0px;
}

body#csr #box1 .img-box+.mid{
    margin-top: 30px
}

body#csr #box2 .tori{
    display: flex;
    flex-direction: column;
    gap: 60px;
}

body#csr #box2 .tori .mid{
    margin-top: 30px
}

body#csr #box2 .img-box.pb{
    padding: 40px;
}

body#csr #box1 .notice,
body#csr #box2 .notice,
body#csr #box3 .notice,
body#csr #box4 .notice,
body#csr #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#csr #box1 .notice{
    margin-top: 10px;
    text-align: center;
}

body#csr #box2 .notice{
    margin-bottom: 30px
}

body#csr #box1 .notice li,
body#csr #box2 .notice li,
body#csr #box3 .notice li,
body#csr #box4 .notice li,
body#csr #box5 .notice li{
    overflow: visible;
    width: 100%;
    text-align: left;
}

body#csr #box1 .band-cap,
body#csr #box2 .band-cap,
body#csr #box3 .band-cap,
body#csr #box4 .band-cap,
body#csr #box5 .band-cap{
flex-flow: column;
        gap: 6px;
        padding: 0;
        font-size: 2rem;
        background-color: unset;
        font-size: 14px;
        margin-left: 0;
        margin-top: 20px
}

body#csr .aco-box>li .answer .txt-box{
    font-size: 15px;
    font-weight: 400
}

body#csr .aco-box>li .answer{
    background-color: var(--color-bl04);
}

body#csr .nom-center{
    margin-top: 30px;
    font-size: 16px;
    font-weight: 500
}

body#csr .img-list{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    margin-bottom: 30px
}

body#csr .link-box+.img-box{
    margin-top: 60px
}

body#csr .img-list img{
    width: 150px
}

body#csr .bandl{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 18px;
    margin-top: 30px
}

body#csr .bandl li{
    white-space: nowrap;
    padding: 5px 20px 7px;
    background-color: var(--color-bl01);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
    border-radius: 4px
}
body#csr #box2 .aco-box{
    gap: 2px;
    margin-top: 30px
}
body#csr #box2 .aco-box li{
    border-radius: unset;
    border: unset;
}
body#csr #box2 .aco-box li .answer .txt-box:before{
    content: none;
}

body#csr #box2 .aco-box li .question{
    padding: 12px 20px;
}

body#csr #box2 .aco-box li .answer .txt-box{
    width: 100%;
    max-width: 100%
}

body#csr #box2 .aco-box li .answer .txt-box p{
    margin-left: 0;
    width: 100%
}

body#csr #box2 .aco-box li .question{
    background-color: var(--color-bl01);
    color:  #FFF;
}

body#csr #box2 .aco-box li .question:before {
    content: "";
    top: 50%;
    right: 24px;
    width: 6px;
    height: 6px;
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
    transform: translateY(-50%) rotate(135deg);
    transform-origin: center;
    border-radius: unset;
}

body#csr #box2 .aco-box li .question.close:before {
    transform: translateY(-50%) rotate(-45deg);
    margin-top:0;
}

body#csr #box2 .aco-box li .question span,
body#csr #box2 .aco-box li .answer .txt-box p{
    width: auto;
    margin-left: 0;
}

body#csr #box2 .aco-box li .answer .txt-box{
    display: grid;
    gap: 30px;
    justify-content: unset;
    border: unset;
}

body#csr #box2 .aco-box li .answer .txt-box h4{
    padding-bottom: 2px;
    border-bottom: 1px solid var(--color-gy02);
    margin-bottom: 20px;
}


body#delivery-business #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#delivery-business #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#delivery-business .txt-box{
    max-width: 680px;
    margin: 0 auto
}

body#delivery-business .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#delivery-business .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#delivery-business .sml{
    margin-top: 0;
    margin-bottom: 4px;
    font-size: 20px
}

body#delivery-business .b-price{
    font-size: 18px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
    color: #00b4c8
}

body#delivery-business #box1 .inner,
body#delivery-business #box2 .inner,
body#delivery-business #box3 .inner,
body#delivery-business #box4 .inner,
body#delivery-business #box5 .inner{
    max-width: 680px;
}

body#delivery-business #box1 .img-box,
body#delivery-business #box2 .img-box,
body#delivery-business #box3 .img-box,
body#delivery-business #box4 .img-box,
body#delivery-business #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px
}

body#delivery-business #box1 .notice,
body#delivery-business #box2 .notice,
body#delivery-business #box3 .notice,
body#delivery-business #box4 .notice,
body#delivery-business #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#delivery-business #box2 .notice{
    margin-bottom: 30px
}

body#delivery-business #box1 .notice li,
body#delivery-business #box2 .notice li,
body#delivery-business #box3 .notice li,
body#delivery-business #box4 .notice li,
body#delivery-business #box5 .notice li{
    overflow: visible;
    width: 100%;
    text-align: left;
}

body#delivery-business #box1 .kakusyu{
    display: flex;
    flex-direction: column;
    gap: 70px;
}

body#delivery-business #box1 .kakusyu .mid{
    margin-top: 30px
}

body#delivery-business #box1 .kakusyu .sml{
    text-align: left;
    font-size: 16px;
    margin-bottom: 20px
}


body#delivery-business .link-box{
    margin-top: 30px;
    margin-bottom: 0;
    padding-bottom: 0
}



body#agency .main-head{
    margin-bottom: 30px;
}

body#agency #intro{
    margin-top: 0;
}

body#agency #intro .inner{
    width: 870px
}

body#agency #intro .two-column{
    justify-content: center;
    gap: 40px;
    width: 870px
}

body#agency #intro .two-column li:first-child{
    width: 360px
}

body#agency #intro li:last-child{
    display: flex;
    justify-content: center;
    align-items: flex-start;
        flex-direction: column;
        width: calc(100% - 400px);
}

body#agency #intro h2{
    flex-wrap: wrap;
    gap: 5px 0;
    margin-left: 0;
    font-size: 24px;
    padding: 0;
    margin-bottom: 0
}

body#agency #intro h2 span{
    background-color: #fff;
    color: var(--color-bl01);  
}

body#agency #intro h2 span:first-child{
    padding-left: 10px;
    border-radius: 4px 0 0 4px
}

body#agency #intro h2 span:nth-child(2){
    padding-right: 10px;
    border-radius: 0 4px 4px 0
}

body#agency #intro h2 span:nth-child(3){
    padding-left: 10px;
    border-radius: 4px 0 0 4px
}

body#agency #intro h2 span:last-child{
    padding-right: 10px;
    border-radius: 0 4px 4px 0
}

body#agency #intro li:last-child p{
    color: #fff;
    font-size: 15px;
    font-weight: 600;
}

body#agency .txt-box{
    max-width: 680px;
    margin: 0 auto
}

body#agency .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#agency .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#agency .sml{
    margin-top: 0;
    margin-bottom: 4px;
    font-size: 20px
}

body#agency .b-price{
    font-size: 18px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
    color: #00b4c8
}

body#agency #box1 .inner,
body#agency #box2 .inner,
body#agency #box3 .inner,
body#agency #box4 .inner,
body#agency #box5 .inner,
body#agency #box6 .inner{
    max-width: 680px;
}

body#agency #box1 .inner{
    max-width: 980px
}

body#agency #box2 .inner{
    max-width: 1080px
}

body#agency #box3 .inner{
    max-width: 1080px
}

body#agency #box5 .inner{
    max-width: 980px
}

body#agency #box6 .inner{
    max-width: 740px
}

body#agency #box1 .img-box,
body#agency #box2 .img-box,
body#agency #box3 .img-box,
body#agency #box4 .img-box,
body#agency #box5 .img-box,
body#agency #box6 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px
}

body#agency #box1 .img-box{
    margin-bottom: 0;
}

body#agency #box1 .img-box img{
    width: 80%
}

body#agency #box1 .notice,
body#agency #box2 .notice,
body#agency #box3 .notice,
body#agency #box4 .notice,
body#agency #box5 .notice,
body#agency #box6 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#agency #box1 .notice{
    margin-top: 10px;
    margin-bottom: 20px
}

body#agency #box2 .notice{
    margin-bottom: 30px
}

body#agency #box1 .notice li,
body#agency #box2 .notice li,
body#agency #box3 .notice li,
body#agency #box4 .notice li,
body#agency #box5 .notice li,
body#agency #box6 .notice li{
    overflow: visible;
    width: 100%;
    text-align: left;
}

body#agency #box1 .kakusyu{
    display: flex;
    flex-direction: column;
    gap: 50px;
}

body#agency #box1 .kakusyu .sml{
    text-align: left;
    font-size: 16px;
    margin-bottom: 20px
}


body#agency .link-box{
    margin-top: 30px;
    margin-bottom: 0
}

body#agency .recommend{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
}

body#agency .recommend li{
    padding: 30px;
    border-radius: 8px;
    background-color: var(--color-bl04);
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

body#agency .recommend .band-cap{
    margin-bottom: 0;
    padding: 3px 4px 5px;
    line-height: 1
}

body#agency .recommend li .round-cap{
    max-width: 260px
}

body#agency .recommend li .mid{
    font-size: 16px;
    margin-top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 12px;
}

body#agency #box1 .img-box{
    text-align: center;
    border: 1px solid var(--color-gy02);
    padding: 30px
}

body#agency #box1 .inner .two-column{
    align-items: stretch;
}

body#agency #box2 .kig{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 40px
}

body#agency #box2 .kig li{
    border-radius: 10px;
    padding: 30px;
    background-color: #fff
}

body#agency #box2 .kig li .mid{
    margin-top: 0
}

body#agency #box2 .kig li .mid.min{
    letter-spacing: 0
}

body#agency #box3 .pt{
    gap: 40px;
    display: flex;
    flex-direction: column;
    margin-bottom: 50px;

}

body#agency #box3 .two-column{
    gap: 50px;
}

body#agency #box3 .two-column .img-box{
    margin-bottom: 0
}

body#agency #box3 .round-cap{
    margin: 0 auto;
    width: 140px
}

body#agency #box3 .mid{
    margin-top: 20px
}

body#agency #box4 .mid{
    margin-top: 0;
    line-height: 1
}

body#agency #box4 ul{
    margin-top: 50px
}

body#agency #box4 li{
    border-radius: 10px;
    padding: 40px;
    background-color: #fff
}


body#agency .lines{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-bottom: 50px
}

body#agency .lines li{
    border-radius: 10px;
    background-color: var(--color-bl04);
    padding: 40px
}

body#agency .lines .mid{
    margin-bottom: 14px
}

body#agency .lines .mid span{
    font-size: 70%
}

body#agency .round-cap.min{
    margin: 0px auto -40px;
    width: 140px
}

body#agency .local-q {
    display: flex;
    gap: 30px;
    flex-direction: column;
    margin-bottom: 50px
}

body#agency .local-q li{
    border-radius: 10px;
    padding: 30px 50px 40px;
    background-color: #fff
}

body#agency .local-q h3.mid{
    flex-direction: column;
    align-items: center;
    display: flex;
    margin-top: 0;
    margin-bottom: 10px
}

body#agency .local-q h3.mid:before{
    display: flex;
    width: 40px;
    height: 40px;
    background-color: var(--color-bl01);
    border-radius: 100%;
    color: #fff;
    font-family: "Inter";
    font-size: 20px;
    justify-content: center;
    align-items: center;
    font-weight: 800;
    top: 18px;
    margin-bottom: 4px;
    content: "Q"
}

body#agency .outlo {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: #00b4c8;
}

body#agency .outlo p+p{
    margin-top: 20px;
}




body#area #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#area #intro .notice{
    text-align: left;
    margin-top: 20px;
    margin-bottom: 0
}

body#area .txt-box{
    max-width: 720px;
    margin: 0 auto
}

body#area  .aco-box>li .answer .txt-box{
    font-size: 14px;
    cursor: unset;
}

#voice-main .inner{
    max-width: 880px
}

.main-column{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 40px;
    margin-bottom: 70px
}

.main-column dt .img-box{
    border-radius: 10px;
    overflow: hidden;
}

.main-column dd h3{
    font-size: 18px;
    font-weight: 500;
    color: #00b4c8;
    margin-bottom: 20px;
    text-align: center;
}

.main-column dd .datas{
    display: flex;
    flex-direction: column;
    gap: 10px;
    
}

.main-column dd .datas div{
    display: flex;
    border-radius: 10px;
    background-color: var(--color-bl04);
    padding: 20px;
    font-size: 14px;
}

.main-column dd .datas div dt{
    width: 120px;
}

.main-column dd .datas div dd{
    width: calc(100% - 120px)
}

.v-list{
    margin-bottom: 40px
}

.v-list li{
    font-size: 16px;
}

.v-list li h4{
    font-size: 18px;
    color: #00b4c8;
    font-weight: 600;
    margin-bottom: 20px;
    line-height: 1
}

.v-list li+li{
    padding-top: 40px;
    margin-top: 40px;
    border-top: 1px solid #e0e0e0
}

.v-list li.caution{
    text-align: right;
    font-size: 12px;
    padding-top: 20px;
}

.staff{
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 40px;
    border: 1px solid #e0e0e0;
    flex-direction: column;
}

.staff h5{
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 20px;
    text-align: left;
}

body#guide #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#guide #intro .notice{
    text-align: center;
    margin-bottom: 40px
}

body#guide #intro .txt-box{
    max-width: 640px;
    margin: 0 auto
}

body#guide .txt-box{
    /*max-width: 420px;*/
    margin: 0 auto
}

body#guide .img-box.min{
    width: 200px;
    margin: 20px auto
}

body#guide .img-box.min2{
    width: 400px;
    margin: 40px auto 0
}

body#guide .sml{
    margin-top: 0;
    margin-bottom: 4px;
    font-size: 16px
}

body#guide .b-price{
    font-size: 18px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
    color: #00b4c8
}

body#guide #box1 .inner,
body#guide #box2 .inner,
body#guide #box3 .inner,
body#guide #box4 .inner,
body#guide #box5 .inner{
    max-width: 680px;
}

body#guide #box1 .inner{
    max-width: 680px;
}

body#guide #box1 .img-box,
body#guide #box2 .img-box,
body#guide #box3 .img-box,
body#guide #box4 .img-box,
body#guide #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px;
    border: 1px solid var(--color-gy02);
}

body#guide #box2 .img-box{
    margin-bottom: 0
}

body#guide #box2 .mid{
    margin-top: 30px
}

body#guide #box2 .tori{
    display: flex;
    flex-direction: column;
    gap: 60px;
}

body#guide #box2 .tori .mid{
    margin-top: 30px
}

body#guide #box2 .img-box.pb{
    padding: 40px;
}

body#guide #box1 .notice,
body#guide #box2 .notice,
body#guide #box3 .notice,
body#guide #box4 .notice,
body#guide #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#guide #box1 .notice{
    margin-top: 10px
}

body#guide #box2 .notice{
    margin-bottom: 30px
}

body#guide #box1 .notice li,
body#guide #box2 .notice li,
body#guide #box3 .notice li,
body#guide #box4 .notice li,
body#guide #box5 .notice li{
    overflow: visible;
    width: 100%;
    text-align: left;
}

body#guide #box1 .band-cap,
body#guide #box2 .band-cap,
body#guide #box3 .band-cap,
body#guide #box4 .band-cap,
body#guide #box5 .band-cap{
flex-flow: column;
        gap: 6px;
        padding: 0;
        font-size: 2rem;
        background-color: unset;
        font-size: 14px;
        margin-left: 0;
        margin-top: 20px
}

body#guide .nom-center{
    margin-top: 30px;
    font-size: 16px;
    font-weight: 500
}

body#guide .img-list{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

body#guide .link-box+.img-box{
    margin-top: 60px
}

body#guide .img-list img{
    width: 150px
}

body#guide .bandl{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    font-weight: 600;
    font-size: 18px;
    margin-top: 30px
}

body#guide .bandl li{
    white-space: nowrap;
    padding: 4px;
    background-color: var(--color-bl01);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

body#guide .lines{
    /*display: grid;
    grid-template-columns: repeat(1, 1fr);*/
    display: flex;
    flex-direction: column;
    gap: 30px;
    /*margin-bottom: 50px*/
}

body#guide .lines .table-box table{
    min-width: auto;
    width: 70%;
    margin: 0 auto;
    font-size: 14px;

}

body#guide .lines .table-box table th{
    width: 50%;
    padding-left: 15px
}

body#guide .lines .table-box table td{
    text-align: center;
}

body#guide .lines>li{
    border-radius: 10px;
    background-color: #fff;
    padding: 40px
}

body#guide .lines>li .mid{
    margin-top: 20px
}

body#guide .lines>li .more-step{
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 30px;
    padding: 0 90px
}

body#guide .lines>li .more-step li{
    position: relative;
    text-align: center;
}

body#guide .lines>li .more-step li span{
    padding: 10px;
    background-color: #d1f2f6;
    border-radius: 4px;
    border: 1px solid #baedf2;
    margin-bottom: 10px;
    display: block;
    color: #00b4c8;
    font-weight: 600;
}

body#guide .lines>li .more-step li:after{
    content: "▼";
    color: #baecf2;
    display: block;
}

body#guide .lines>li .more-step li:last-child span{
    margin-bottom: 0
}

body#guide .lines>li .more-step li:last-child:after{
    display: none;
}

body#guide .lines>li .round-cap.min{
    width: 160px;
    margin-left: auto;
    margin-right: auto;
}

body#guide .lines>li .txt-box+.link-box{
    margin-top: 30px;
    margin-bottom: 0;
    padding-bottom: 0
}

body#guide .lines>li .txt-box+.txt-box{
    margin-top: 60px
}

body#guide .lines>li .sml{
    font-size: 16px;
    margin-top: 30px;
    margin-bottom: 16px
}

body#guide #box2>ul{
    display: flex;
    flex-direction: column;
    gap: 40px;
}

body#guide #box2 .box{
    display: flex;
    flex-direction: column;
    gap: 80px;
}

body#guide #box2 .txt-box+.link-box{
    margin-top: 40px;
    margin-bottom: 0;
    padding-bottom: 0
}

body#guide #box2 .color-box{
    border-radius: 10px;
    padding: 40px;
    background-color: var(--color-bl04);
    font-size: 14px;
    font-weight: 500;
    max-width: 400px;
    margin: 0 auto 40px
}

body#guide #box2 .color-box .sml{
    margin-bottom: 20px
}





body#mypage #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#mypage .notice{
    text-align: left;
    margin-bottom: 40px;
    margin-top: 10px
}

body#mypage .btns{
    margin-top: 0
}

body#mypage .txt-box{
    max-width: 420px;
    margin: 0 auto
}

body#mypage .sml{
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 20px
}

body#mypage #box1 .inner,
body#mypage #box2 .inner,
body#mypage #box3 .inner,
body#mypage #box4 .inner,
body#mypage #box5 .inner{
    max-width: 680px;
}

body#mypage #box1 .inner{
    max-width: 740px;
}

body#mypage #box1 .img-box,
body#mypage #box2 .img-box,
body#mypage #box3 .img-box,
body#mypage #box4 .img-box,
body#mypage #box5 .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px;
    border: 1px solid var(--color-gy02);
}

body#mypage #box2 .tori{
    display: flex;
    flex-direction: column;
    gap: 60px;
}

body#mypage #box2 .tori .mid{
    margin-top: 30px
}

body#mypage #box2 .img-box.pb{
    padding: 40px;
}

body#mypage #box1 .notice,
body#mypage #box2 .notice,
body#mypage #box3 .notice,
body#mypage #box4 .notice,
body#mypage #box5 .notice{
    font-size: 12px;
    margin-top: 20px
}

body#mypage #box1 .notice{
    margin-top: 10px
}

body#mypage #box2 .notice{
    margin-bottom: 30px
}

body#mypage #box1 .notice li,
body#mypage #box2 .notice li,
body#mypage #box3 .notice li,
body#mypage #box4 .notice li,
body#mypage #box5 .notice li{
    overflow: visible;
    width: 100%;
    text-align: left;
}

body#mypage #box1 .band-cap,
body#mypage #box2 .band-cap,
body#mypage #box3 .band-cap,
body#mypage #box4 .band-cap,
body#mypage #box5 .band-cap{
flex-flow: column;
        gap: 6px;
        padding: 0;
        font-size: 2rem;
        background-color: unset;
        font-size: 14px;
        margin-left: 0;
        margin-top: 20px
}

body#mypage .nom-center{
    margin-top: 30px;
    font-size: 16px;
    font-weight: 500
}

body#mypage .img-list{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

body#mypage .link-box+.img-box{
    margin-top: 60px
}

body#mypage .img-list img{
    width: 150px
}

body#mypage .bandl{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    font-weight: 600;
    font-size: 18px;
    margin-top: 30px
}

body#mypage .bandl li{
    white-space: nowrap;
    padding: 4px;
    background-color: var(--color-bl01);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

body#mypage .lines{
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 30px;
    margin-bottom: 50px
}

body#mypage .lines>li{
    border-radius: 10px;
    background-color: #fff;
    padding: 40px 20px
}

body#mypage .lines>li .mid{
    margin-top: 20px
}

body#mypage .lines>li .more-step{
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 20px
}

body#mypage .lines>li .more-step li{
    position: relative;
    text-align: center;
}

body#mypage .lines>li .more-step li span{
    padding: 10px;
    background-color: #d1f2f6;
    border-radius: 4px;
    border: 1px solid #baedf2;
    margin-bottom: 10px;
    display: block;
    color: #00b4c8;
    font-weight: 600;
}

body#mypage .lines>li .more-step li:after{
    content: "▼";
    color: #baecf2;
    display: block;
}

body#mypage .lines>li .more-step li:last-child span{
    margin-bottom: 0
}

body#mypage .lines>li .more-step li:last-child:after{
    display: none;
}

body#mypage .lines>li .round-cap.min{
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

body#mypage .lines>li .txt-box+.link-box{
    margin-top: 20px;
    margin-bottom: 0
}

body#mypage .lines>li .txt-box+.txt-box{
    margin-top: 40px
}

body#mypage .lines>li .sml{
    font-size: 16px;
    margin-top: 30px
}

body#mypage #box2>ul{
    display: flex;
    flex-direction: column;
    gap: 40px;
}

body#mypage #box2 .box{
    display: flex;
    flex-direction: column;
    gap: 40px;
}

body#mypage #box2 .txt-box+.link-box{
    margin-top: 20px;
    margin-bottom: 0
}

body#mypage #box2 .color-box{
    border-radius: 10px;
    padding: 20px;
    background-color: var(--color-bl04);
    margin-bottom: 20px
}






body#healthy #intro .img-box,
body#habit #intro .img-box,
body#baby #intro .img-box,
body#child #intro .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
    width: 100%;
    max-width: 780px;
}

body#healthy #intro h2,
body#habit #intro h2,
body#baby #intro h2,
body#child #intro h2{
    font-size: 24px;
    line-height: 1.8;
    margin-bottom: 40px;
    text-align: center;
    font-weight: 600
}

body#healthy #intro .txt-box,
body#habit #intro .txt-box,
body#baby #intro .txt-box,
body#child #intro .txt-box{
    max-width: 720px;
    text-align: justify;
    font-size: 16px;
    margin: 0 auto 
}

body#healthy .kansyu,
body#habit .kansyu,
body#baby .kansyu,
body#child .kansyu{
    max-width: 720px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 40px;
    border-radius: 10px;
    border: 1px solid var(--color-gy03);
    margin-top: 30px;
    font-size: 12px
}

body#healthy #outlo .kansyu,
body#habit #outlo .kansyu,
body#baby #outlo .kansyu,
body#child #outlo .kansyu{
    max-width: 450px;
    padding: 20px;
    flex-wrap: wrap;
}

body#healthy .kansyu .imgs,
body#habit .kansyu .imgs,
body#baby .kansyu .imgs,
body#child .kansyu .imgs{
    display: flex;
    gap: 20px;
    justify-content: center;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--color-gy03)
}

body#healthy .kansyu .imgs img,
body#habit .kansyu .imgs img,
body#baby .kansyu .imgs img,
body#child .kansyu .imgs img{
    width: 120px;
    height: 120px
}

body#healthy #outlo .kansyu .imgs img,
body#habit #outlo .kansyu .imgs img,
body#baby #outlo .kansyu .imgs img,
body#child #outlo .kansyu .imgs img{
    width: 80px;
    height: 80px
}

body#healthy .kansyu .imgs h3,
body#habit .kansyu .imgs h3,
body#baby .kansyu .imgs h3,
body#child .kansyu .imgs h3{
    font-size: 16px;
    font-weight: 500;
}

body#healthy #outlo .kansyu .imgs h3,
body#habit #outlo .kansyu .imgs h3,
body#baby #outlo .kansyu .imgs h3,
body#child #outlo .kansyu .imgs h3{
    font-size: 12px;
}

body#healthy .kansyu a,
body#habit .kansyu a,
body#baby .kansyu a,
body#child .kansyu a{
    color: var(--color-bl01);
    text-decoration: underline;
}

body#healthy .column-box,
body#habit .column-box,
body#baby .column-box,
body#child .column-box{
    max-width: 720px;
    margin: 0 auto
}

body#healthy .column-box p,
body#habit .column-box p,
body#baby .column-box p,
body#child .column-box p{
    font-size: 16px;
}

body#healthy .column-box p a,
body#habit .column-box p a,
body#baby .column-box p a,
body#child .column-box p a{
    color: var(--color-bl01);
    text-decoration: underline;
}

body#healthy .column-box p+p,
body#habit .column-box p+p,
body#baby .column-box p+p,
body#child .column-box p+p{
    margin-top: 16px
}

body#healthy .column-box .img-box,
body#habit .column-box .img-box,
body#baby .column-box .img-box,
body#child .column-box .img-box{
    max-width: 480px;
    border-radius: 10px;
    margin: 0 auto;
    overflow: hidden;
}

body#healthy .column-box p+.img-box,
body#habit .column-box p+.img-box,
body#baby .column-box p+.img-box,
body#child .column-box p+.img-box{
    margin-top: 30px
}

body#healthy .column-box .img-box+p,
body#habit .column-box .img-box+p,
body#baby .column-box .img-box+p,
body#child .column-box .img-box+p{
    margin-top: 30px
}

body#healthy .column-box p+.notice,
body#habit .column-box p+.notice,
body#baby .column-box p+.notice,
body#child .column-box p+.notice{
    margin-top: 20px
}

body#healthy h3.mid,
body#habit h3.mid,
body#baby h3.mid,
body#child h3.mid{
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px
}

body#healthy h3.meyasu,
body#habit h3.meyasu,
body#baby h3.meyasu,
body#child h3.meyasu{
    font-size: 20px;
    margin-bottom: 20px;
    text-align: center;
}

body#healthy h3.meyasu span,
body#habit h3.meyasu span,
body#baby h3.meyasu span,
body#child h3.meyasu span{
    font-size: 16px;
    font-weight: 600;
    display: inline-block;
    padding: 10px 30px;
    line-height: 1;
    background-color: #393836;
    border-radius: 4px;
    color: #fff;
    margin-bottom: 8px
}

body#healthy .link-box,
body#habit .link-box,
body#baby .link-box,
body#child .link-box{
    margin-top: 50px;
    margin-bottom: 0
}

body#healthy .line-box,
body#habit .line-box,
body#baby .line-box,
body#child .line-box{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 40px
}

body#healthy .line-box li,
body#habit .line-box li,
body#baby .line-box li,
body#child .line-box li{
    padding: 30px;
    border-radius: 10px;
    background-color: var(--color-bl04);
    width: calc(50% - 10px);
}

body#healthy .line-box li.full,
body#habit .line-box li.full,
body#baby .line-box li.full,
body#child .line-box li.full{
    width: 100%;
}

body#healthy .line-box dl,
body#habit .line-box dl,
body#baby .line-box dl,
body#child .line-box dl{
    display: flex;
    gap: 50px;
}

body#healthy .line-box dl dd,
body#habit .line-box dl dd,
body#baby .line-box dl dd,
body#child .line-box dl dd,
body#healthy .line-box dl dt,
body#habit .line-box dl dt,
body#baby .line-box dl dt,
body#child .line-box dl dt{
    width: 50%
}

body#healthy .line-box li .round-cap,
body#habit .line-box li .round-cap,
body#baby .line-box li .round-cap,
body#child .line-box li .round-cap{
    width: 200px;
    margin: 0 auto
}

body#healthy .line-box li .mid,
body#habit .line-box li .mid,
body#baby .line-box li .mid,
body#child .line-box li .mid{
    margin-top: 20px
}

body#healthy .band-list,
body#habit .band-list,
body#baby .band-list,
body#child .band-list{
    max-width: 50%;
    margin: 30px auto
}

body#healthy .riyuu,
body#habit .riyuu,
body#baby .riyuu,
body#child .riyuu{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    justify-content: center;
    max-width: 1060px;
    gap: 30px;
}

body#healthy .riyuu li,
body#habit .riyuu li,
body#baby .riyuu li,
body#child .riyuu li{
    background-color: #fff;
    border-radius: 10px;
    padding: 40px
}

body#healthy .riyuu li .round-cap,
body#habit .riyuu li .round-cap,
body#baby .riyuu li .round-cap,
body#child .riyuu li .round-cap{
    width: 70%;
    margin: 0 auto
}

body#healthy .riyuu li .mid,
body#habit .riyuu li .mid,
body#baby .riyuu li .mid,
body#child .riyuu li .mid{
    margin-top: 20px;
    margin-bottom: 30px
}

body#healthy .ryou,
body#habit .ryou,
body#baby .ryou,
body#child .ryou{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    justify-content: center;
    max-width: 720px;
    gap: 40px;
    margin-top: 50px
}

body#healthy .ryou li,
body#habit .ryou li,
body#baby .ryou li,
body#child .ryou li{
    background-color: var(--color-bl04);
    border-radius: 10px;
    padding: 40px
}

body#healthy .ryou li .mid,
body#habit .ryou li .mid,
body#baby .ryou li .mid,
body#child .ryou li .mid{
    margin-top: 0px;
    margin-bottom: 30px
}

body#healthy .color-box,
body#habit .color-box,
body#baby .color-box,
body#child .color-box{
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    margin-top: 50px
}

body#healthy .color-box .mid,
body#habit .color-box .mid,
body#baby .color-box .mid,
body#child .color-box .mid{
    margin-top: 0px;
    margin-bottom: 30px
}

body#lifestyle #intro .txt-box{
    max-width: 620px;
    text-align: justify;
    font-size: 16px;
    margin: 0 auto 
}

body#lifestyle .lifestyle-box{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 40px;
    margin-top: 50px
}

body#lifestyle .lifestyle-box .img-box{
    border-radius: 10px;
    margin-bottom: 20px;
    overflow: hidden;
}

body#lifestyle .lifestyle-box h3{
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 10px;
}

body#lifestyle .lifestyle-box h3+p {
    font-size: 12px;
    text-align: center;
}

body#campaign #intro .txt-box{
    max-width: 620px;
    text-align: justify;
    font-size: 16px;
    margin: 0 auto 
}

body#campaign .campaign-box{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 50px;
    margin-top: 50px
}

body#campaign .campaign-box .img-box{
    border-radius: 10px;
    margin-bottom: 20px;
    overflow: hidden;
}

body#campaign .campaign-box h3{
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 10px;
}

body#campaign .campaign-box h3+p {
    font-size: 14px;
    text-align: justify;
}


/* body#area */


#eye-c.nm .main-pic{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

#eye-c.nm .inner{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
}

#eye-c.nm h2{
    color:  #FFF;
    font-weight: 700;
    font-size: 2.4rem;
    display: flex;
    width: fit-content;
    margin: 0 auto 40px;
    background-color: var(--color-bl01);
    padding: 6px;
}

body#area #area-list .inner{
    max-width: 800px;
}

body#area .aco-box.area{
    gap: 2px;
}
body#area .aco-box.area li{
    border-radius: unset;
    border: unset;
}
body#area .aco-box.area li .answer .txt-box:before{
    content: none;
}

body#area .aco-box li .question{
    padding: 12px 20px;
}
/*body#area .aco-box li .answer .txt-box{
    padding: 20px 28px;
}*/

body#area .aco-box.area li .question{
    background-color: var(--color-bl01);
    color:  #FFF;
}

body#area .aco-box.area li .question:before {
    content: "";
    top: 50%;
    right: 24px;
    width: 6px;
    height: 6px;
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
    transform: translateY(-50%) rotate(135deg);
    transform-origin: center;
    border-radius: unset;
}

body#area .aco-box.area li .question.close:before {
    transform: translateY(-50%) rotate(-45deg);
    margin-top:0;
}

body#area .aco-box.area li .question span,
.body#area .aco-box.area li .answer .txt-box p{
    width: auto;
    margin-left: 0;
}

body#area .aco-box.area li .answer .txt-box{
    display: grid;
    gap: 30px;
    justify-content: unset;
    border: unset;
}

body#area .aco-box.area li .answer .txt-box h4{
    padding-bottom: 2px;
    border-bottom: 0.5px solid var(--color-gy02);
    margin-bottom: 20px;
}
body#area .aco-box.area .group_area{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    width: 100%;
    font-weight: 500;
}


body#area .aco-box.area .group_area li{
    border: none;
}

body#area #area-list .wrap-list{
    /*display: grid;
    grid-template-columns: 1fr 1fr;*/
    display: flex;
    flex-direction: column;
    gap: 10px;
}
/*body#area #area-list .map-pic{
    background-color: #FFF;
    display: grid;
    place-content: center;
}*/

body#area #area-list .map-pic img{
    width: 100%
}

body#product #maintenance .inner{
    max-width: 760px
}


body#maintenance .main-head,
body#self-maintenance .main-head,
body#maker-maintenance .main-head{
    margin-bottom: 60px
}

body#maintenance #intro .img-box,
body#self-maintenance #intro .img-box,
body#maker-maintenance #intro .img-box{
    width: 100%;
    max-width: 780px;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body#maker-maintenance #maker4 .inner{
    max-width: 900px
}

body#maintenance #intro h2,
body#self-maintenance #intro h2,
body#maker-maintenance #intro h2{
    font-size: 24px;
    line-height: 1.8;
    margin-bottom: 40px;
    text-align: center;
    font-weight: 600
}

body#maintenance .txt-box,
body#self-maintenance .txt-box,
body#maker-maintenance .txt-box{
    max-width: 720px;
    text-align: justify;
    font-size: 16px;
    margin: 0 auto 
}

body#maintenance .txt-box+.txt-box,
body#self-maintenance .txt-box+.txt-box,
body#maker-maintenance .txt-box+.txt-box{
    margin-top: 40px
}

body#maintenance .txt-box p+ul,
body#self-maintenance .txt-box p+ul,
body#maker-maintenance .txt-box p+ul{
    margin-top: 20px
}

body#maintenance .color-box,
body#self-maintenance .color-box,
body#maker-maintenance .color-box{
    padding: 40px;
    border-radius: 10px;
    background-color: var(--color-bl04);
    margin-top: 30px
}

body#maintenance .base.wb .color-box,
body#self-maintenance .base.wb .color-box,
body#maker-maintenance .base.wb .color-box{
    background-color: #fff;
}

body#maintenance .color-box .mid,
body#self-maintenance .color-box .mid,
body#maker-maintenance .color-box .mid{
    margin-top: 0px;
    margin-bottom: 30px
}

body#maintenance .img-box,
body#self-maintenance .img-box,
body#maker-maintenance .img-box{
    border-radius: 10px;
    overflow: hidden;
}

body#maintenance .img-box.min,
body#self-maintenance .img-box.min,
body#maker-maintenance .img-box.min{
    max-width: 400px;
    margin: 0 auto 30px
}

body#maintenance .txt-box+.img-box,
body#self-maintenance .txt-box+.img-box,
body#maker-maintenance .txt-box+.img-box{
    margin-top: 50px
}

body#maintenance .link-box,
body#self-maintenance .link-box,
body#maker-maintenance .link-box{
    margin-top: 40px;
    margin-bottom: 0
}

body#maintenance .grids,
body#self-maintenance .grids,
body#maker-maintenance .grids{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 50px;
    margin-top: 80px;
}

body#maintenance .grids+.link-box,
body#self-maintenance .grids+.link-box,
body#maker-maintenance .grids+.link-box{
    margin-top: 60px
}

body#maintenance .grids .mid,
body#self-maintenance .grids .mid,
body#maker-maintenance .grids .mid{
    margin-top: 20px
}

body#maintenance .time-line,
body#self-maintenance .time-line,
body#maker-maintenance .time-line{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 30px;
    margin-top: 50px
}

body#maintenance .time-line li,
body#self-maintenance .time-line li,
body#maker-maintenance .time-line li{
    font-size: 14px;
    white-space: nowrap;
    color: #00b4c8;
    width: 100%;
    font-weight: 500
}

body#maintenance .time-line span,
body#self-maintenance .time-line span,
body#maker-maintenance .time-line span{
    padding: 10px;
    border-radius: 4px;
    background-color: #00b4c8;
    color: #fff;
    width: 90%;
    font-size: 16px;
    display: inline-block;
    margin-right: 4px;
}

body#maintenance .table-wrap .thead th,
body#self-maintenance .table-wrap .thead th,
body#maker-maintenance .table-wrap .thead th{
    width: 10%;
}

body#maintenance .dekiru,
body#self-maintenance .dekiru,
body#maker-maintenance .dekiru{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    justify-content: center;
    max-width: 1120px;
    gap: 40px;
    margin-top: 50px
}

body#maintenance .dekiru li,
body#self-maintenance .dekiru li,
body#maker-maintenance .dekiru li{
    background-color: var(--color-bl04);
    border-radius: 10px;
    padding: 40px
}

body#maintenance .dekiru li .thumbnail,
body#self-maintenance .dekiru li .thumbnail,
body#maker-maintenance .dekiru li .thumbnail{
    margin-bottom: 20px;
    text-align: center;
}

body#maintenance .dekiru li .thumbnail img,
body#self-maintenance .dekiru li .thumbnail img,
body#maker-maintenance .dekiru li .thumbnail img{
    width: 30%
}

body#maintenance .dekiru li .mid,
body#self-maintenance .dekiru li .mid,
body#maker-maintenance .dekiru li .mid{
    margin-top: 0px;
    margin-bottom: 0px
}

body#maintenance .dekiru li .sml,
body#self-maintenance .dekiru li .sml,
body#maker-maintenance .dekiru li .sml{
    margin-top: 10px;
    margin-bottom: 20px
}

body#maintenance #maker3 .notice,
body#self-maintenance #maker3 .notice,
body#maker-maintenance #maker3 .notice{
    text-align: center;
    margin-top: 20px;
    margin-bottom: 40px
}


body#maintenance .local-q,
body#self-maintenance .local-q,
body#maker-maintenance .local-q{
    display: flex;
    gap: 30px;
    flex-direction: column;
    margin-bottom: 50px
}

body#maintenance .local-q li,
body#self-maintenance .local-q li,
body#maker-maintenance .local-q li{
    border-radius: 10px;
    padding: 30px;
    background-color: #fff
}

body#maintenance .local-q h3.mid,
body#self-maintenance .local-q h3.mid,
body#maker-maintenance .local-q h3.mid{
    border-radius: 10px;
    padding: 0px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 0;
    gap: 6px;
}

body#maintenance .local-q h3.mid:before,
body#self-maintenance .local-q h3.mid:before,
body#maker-maintenance .local-q h3.mid:before{
    display: flex;
    width: 40px;
    height: 40px;
    background-color: var(--color-bl01);
    border-radius: 100%;
    color: #fff;
    font-family: "Inter";
    font-size: 20px;
    justify-content: center;
    align-items: center;
    font-weight: 800;
    top: 18px;
    content: "Q"
}

body#maintenance .box-list,
body#self-maintenance .box-list,
body#maker-maintenance .box-list{
    margin: 60px auto
}

body#maintenance .box-list>li .txt-box,
body#self-maintenance .box-list>li .txt-box,
body#maker-maintenance .box-list>li .txt-box{
    font-size: 14px
}

body#maintenance .box-list>li,
body#self-maintenance .box-list>li,
body#maker-maintenance .box-list>li{
    width: calc(32.7% - 20px);
    font-size: 14px
}

body#maintenance .box-list .img-box,
body#self-maintenance .box-list .img-box,
body#maker-maintenance .box-list .img-box{
    border-radius: 0
}

body#maintenance .box-list>li .btns,
body#self-maintenance .box-list>li .btns,
body#maker-maintenance .box-list>li .btns{
    width: 100%;
}


body.campaign #intro .inner{
    max-width: 880px
}

body.campaign #intro .img-box{
    max-width: 840px;
    border-radius: 0px;
    overflow: hidden;
    margin: 0 auto 40px;
}

body.campaign .limit {
    font-size: 20px;
    color: #e97da1;
    font-weight: 600;
    padding: 5px 20px;
    border: 2px solid #e97da1;
    max-width: 360px;
    margin: 0 auto 60px;
    text-align: center;
    font-weight: 700
}

body.campaign .otoku{
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
    height: 30px;
    background-color: #e97da1;
    color: #fff;
    font-weight: 700;
    border-radius: 30px;
    max-width: 280px;
    margin: 0 auto 20px;
    padding: 9px 20px 11px;
    font-size: 20px;
    line-height: 1;
}

body.campaign .caption{
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 40px
}

body.campaign .caption p{
    font-size: 30px
}

body.campaign .caption span{
    color: #00b4c8;
}

body.campaign .plus{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 50px;
        align-items: stretch;
}

body.campaign .plus .lb,
body.campaign .plus .rb{
    width: 380px;
    border-radius: 10px;
    background-color: #f0fafb;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 20px;
    font-weight: 600;
    padding: 20px 40px
}

body.campaign .plus .lb{
    line-height: 1.4
}

body.campaign .plus .lb p span{
    display: inline-block;
    margin-top: 8px
}

body.campaign .plus .rb{
       justify-content: center;
}

body.campaign .plus .pl{
    display: flex;
    align-items: center;
}

body.campaign .plus .lb img,
body.campaign .plus .rb img{
    width: 110px;
}

body.campaign .plus .lb span,
body.campaign .plus .rb span{
    color: #00b4c8;
    font-weight: 700
}

body.campaign .plus .rb{
    flex-direction: column;
}

.lt-notice{
    font-size: 11px;
    font-weight: 400
}

body.campaign .plus .pl img{
    width: 30px
}

body.campaign .zenin{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    background-color: #f0fafb;
    box-sizing: border-box;
    padding: 40px;
}

body.campaign .sarani{
    display: flex;
    justify-content: center;
    align-items: center;
    top: -16px;
    background-color: #00b4c8;
    color: #fff;
    font-weight: 700;
    border-radius: 30px;
    max-width: 240px;
    margin: 0 auto 20px;
    padding: 9px 20px 11px;
    font-size: 15px;
    line-height: 1;
    position: absolute;
}

body.campaign .product-box .inner h3,
body.campaign .product-box .item-list .swiper-slide h4{
    font-weight: 700
}

body.campaign .product-box .inner h3 {
    font-size: 22px
}

body.campaign .zenin .out{
    display: flex;
    justify-content: center;
    align-items: center;
}

body.campaign .zenin h4{
    color: #00b4c8;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.4;
    margin-bottom: 20px
}

body.campaign .zenin h4 span{
    font-size: 16px;
    color: #393836;
    margin-top: 10px;
    display: inline-block;
}

body.campaign .zenin .out .txt-b{
    width: calc(100% - 380px)
}

body.campaign #intro .zenin .out .img-box{
    width: 320px;
    height: 180px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
    background-color: #fff;
    border-radius: 10px
}

body.campaign .zenin div .img-box img{
    width: 300px
}

body.campaign .product-box .item-list .swiper-slide{
    max-width: 220px
}

body.campaign img.logo_gd{
    width: 30px !important
}

body.campaign #intro .product-box .inner{
    padding: 40px
}

body.campaign #intro .product-box .img-box{
    margin-bottom: 20px
}

body.campaign #intro .product-box .item-list .swiper-slide .info-box{
    padding-top: 0
}

body.campaign .product-box{
    border-top: 4px dotted #e0e0e0;
    padding-top: 60px
}

body.campaign .kiyaku{
    border-top: 4px dotted #e0e0e0;
    padding-top: 60px;
    margin-top: 60px;
    font-size: 16px
}

body.campaign .kiyaku .notice{
    margin-top: 8px
}

body.campaign .kiyaku .line-cap{
    font-size: 20px;
    position: relative;
    display: flex;
    min-height: 40px;
    font-weight: 600;
    margin-bottom: 30px
}

body.campaign .kiyaku .line-cap:before{
    content: "";
    display: block;
    width: 8px;
    border-radius: 2px;
    background-color: #00b4c8;
    margin-right: 10px;
}

body.campaign .kiyaku .mini{
    color: #00b4c8;
    font-weight: 600;
    margin-bottom: 6px
}

body.campaign .kiyaku{
    letter-spacing: 0.4px
}

body.campaign .kiyaku span{
    color: #e97da1;
    font-weight: 600
}

body.campaign .kiyaku p+.mini,
body.campaign .kiyaku .notice+.mini,
body.campaign .kiyaku .dot-list+.mini{
    margin-top: 24px
}

body.campaign .kiyaku .dot-list{
    text-indent: -18px;
    padding-left: 18px
}


body#transfer .zenin{
    margin-top: 50px
}

body#transfer #intro .zenin .out .img-box{
    width: 330px;
    height: 220px;
    border-radius: 0;
}

body#transfer #intro .zenin .out .img-box img{
    width: 100%
}

body.campaign .kiki{
    display: flex;
    justify-content: center;
    align-items: center;
        border-top: 4px dotted #e0e0e0;
    padding-top: 60px;
    margin-top: 60px;
    flex-direction: column;
}

body.campaign .kiki h2{
    font-size: 24px;
    font-weight: 600
}

body.campaign .kiki .mashita{
    display: flex;
    justify-content: center;
    align-items: center;
    /*height: 30px;*/
    background-color: #00b4c8;
    color: #fff;
    font-weight: 700;
    border-radius: 30px;
    max-width: 280px;
    margin: 0 auto 20px;
    padding: 9px 20px 11px;
    font-size: 15px;
    line-height: 1;;
    margin-bottom: 10px
}

body.campaign .kiki .kimete{
    display: flex;
    flex-direction: column;
    margin-top: 30px;
    gap: 20px;
}

body.campaign .kiki .kimete>div{
    display: flex;
    border-radius: 10px;
    overflow: hidden;
    background-color: #f1fbfb;
    min-height: 240px
}

body.campaign .kiki .kimete>div dt,
body.campaign .kiki .kimete>div dd{
    width: 50%;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 0 40px;
    letter-spacing: 0
}

body.campaign .kiki .kimete>div dt{
    background-color: #e6f8fa;
}

body.campaign .kiki .kimete>div h3{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    background-color: #00b4c8;
    color: #fff;
    font-weight: 700;
    border-radius: 30px;
    max-width: 240px;
    margin: 0 auto 20px;
    padding: 9px 20px 11px;
    font-size: 15px;
    line-height: 1;;
    margin-bottom: 20px;
    width: 100px
}

body.campaign .kiki .kimete>div h3+h4{
    font-size: 20px;
    color: #00b4c8;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 20px
}

body.campaign .kiki .kimete>div dd .btns.common{
    margin-top: 30px
}

body.campaign .nagare{
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 4px dotted #e0e0e0;
    padding-top: 60px;
    margin-top: 60px;
    flex-direction: column;
}


body.campaign .nagare h2{
        font-size: 24px;
    font-weight: 600;
    margin-bottom: 30px
}

body.campaign .nagare ul.list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%
}

body.campaign .nagare ul.list>li {
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    overflow: hidden;
    background-color: #f1fbfb;
    padding: 40px
}

body.campaign .nagare ul.list>li h3{
    display: flex;
    font-size: 20px;
    color: #00b4c8;
    font-weight: 700;
        align-items: center;
        margin-bottom: 16px
}

body.campaign .nagare ul.list>li h3 span{
    display: flex;
    justify-content: center;
    align-items: center;
    /*height: 30px;*/
    background-color: #00b4c8;
    color: #fff;
    font-weight: 700;
    border-radius: 30px;
    max-width: 240px;
    margin: 0 10px 0 0;
    padding: 9px 20px 11px;
    font-size: 15px;
    line-height: 1;
    width: 100px;
}

body.campaign .nagare ul.list>li .notice{
    margin-top: 10px;
    line-height: 1.6
}

body.campaign .nagare ul.list>li a{
        color: var(--color-bl01);
    text-decoration: underline;
}

body.campaign .tokuten h2{
    font-size: 20px;
    line-height: 1;
    margin-bottom: 20px;
    font-weight: 700;
    text-align: center;
}

body.campaign .futari{
     display: flex;
    justify-content: center;
    align-items: center;
    border-top: 4px dotted #e0e0e0;
    padding-top: 60px;
    margin-top: 60px;
    flex-direction: column;   
}

body.campaign .futari h2,
body.campaign .imasenk h2,
body.campaign .atatte h2{
    font-size: 24px;
    line-height: 1;
    margin-bottom: 40px;
    font-weight: 700;
    text-align: center;
}

body.campaign .futari h2+div{
    text-align: center;
}

body.campaign .tokuten h3{
    font-size: 24px;
    font-weight: 700;
    text-align: center;
}

body.campaign .tokuten h3 span{
    color: #00b4c8
}

body.campaign .tokuten h3+div{
    margin-top: 30px
}

body.campaign .tokuten>ul{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 50px 20px;
    margin-top: 70px
}

body.campaign .tokuten>ul>li{
        display: flex;
    flex-direction: column;
    border-radius: 10px;
    background-color: #f1fbfb;
    padding: 40px;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    font-weight: 500
}

body.campaign .tokuten>ul>li:last-child p,
body.campaign .tokuten>ul>li:last-child .notice{
     letter-spacing: 0   
}

body.campaign .tokuten>ul>li h4{
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    /*height: 30px;*/
    background-color: #00b4c8;
    color: #fff;
    font-weight: 700;
    border-radius: 8px;
    max-width: 240px;
    padding: 9px 20px 11px;
    font-size: 15px;
    line-height: 1;
    width: 100px;
    top: -18px;
}

body.campaign .tokuten>ul>li span{
    color: #00b4c8;
    font-weight: 700
}

body.campaign .tokuten>ul>li .notice{
    margin-top: 10px
}

body.campaign .futari>ul{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 50px 20px;
    margin-top: 70px
}

body.campaign .futari>ul>li{
        display: flex;
    flex-direction: column;
    border-radius: 10px;
    background-color: #f1fbfb;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    font-weight: 500
}

body.campaign .futari>ul>li h3{
    position: absolute;
        display: flex;
    justify-content: center;
    align-items: center;
    /*height: 30px;*/
    background-color: #00b4c8;
    color: #fff;
    font-weight: 700;
    border-radius: 8px;
    max-width: 240px;
    padding: 9px 20px 11px;
    font-size: 15px;
    line-height: 1;
    width: 120px;
    top: -18px
}

body.campaign .futari>ul>li h4{
    min-height: 144px;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    padding-bottom: 30px;
    border-bottom: 1px solid #ccf0f4;
    width: 100%;
    padding-top: 40px;
}

body.campaign .futari>ul>li.two h4{
    flex-direction: column;
}

body.campaign .futari>ul>li h4 span,
body.campaign .futari>ul>li h5 span{
    color: #00b4c8;
    font-weight: 700
}

body.campaign .futari>ul>li h5{
    margin-top: 20px
}

body.campaign .futari>ul>li .ins{
    padding: 30px 40px 40px
}

body.campaign .futari>ul>li .a-box{
display: flex;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.4;
    align-items: center;
    justify-content: center;
}

body.campaign .futari>ul>li.first .a-box{
        margin-top: 40px;
    margin-bottom: 55px;
}

body.campaign .futari>ul>li .a-box img{
    width: 50px;
    margin-right: 10px
}

body.campaign .futari>ul>li .b-box{
    text-align: center;
    font-weight: 900;
    color: #00b4c8;
    line-height: 1;
    margin: 10px 0;
    font-size: 24px
}

body.campaign .futari>ul>li .notice{
    margin-top: 30px;
    line-height: 1.6
}

body.campaign .imasenk{
     display: flex;
    justify-content: center;
    align-items: center;
    border-top: 4px dotted #e0e0e0;
    padding-top: 60px;
    margin-top: 60px;
    flex-direction: column;   
}

body.campaign .imasenk ul{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 10px;
    width: 100%;
    /*margin-top: 20px*/
}

body.campaign .imasenk ul li{
    text-align: center;
    border-radius: 10px;
    background-color: #f1fbfb;
    position: relative;
    font-weight: 500;
    padding: 20px;
    line-height: 1;
    font-size: 16px;
    font-weight: 700
}

body.campaign .imasenk ul li span{
    color: #00b4c8;
}

body.campaign .atatte{
     display: flex;
    justify-content: center;
    align-items: center;
    border-top: 4px dotted #e0e0e0;
    padding-top: 60px;
    margin-top: 60px;
    flex-direction: column; 
}

body.campaign .atatte span{
    color: #00b4c8;
    font-weight: 700
}

#normal .inner{
    max-width: 980px;
}

#normal .inner dl{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 60px
}

#normal .inner dl dt,
#normal .inner dl dd{
    padding: 20px;
    border: 1px solid var(--color-gy02);
    margin-top: -1px
}

#normal .inner dl dt{
    width: 25%;
    background-color: #f5f5f5;
}

#normal .inner dl dd{
    width: 75%;
    margin-left: -1px
}

#normal .inner p+p,
#normal .inner p+ul,
#normal .inner p+ol{
    margin-top: 20px
}

#normal .inner p+h3,
#normal .inner ul+h3,
#normal .inner ol+h3{
    margin-top: 40px;
}

#normal .inner h3{
color: #00b4c8;
    font-weight: 600;
    margin-bottom: 10px;
    font-size: 20px
}

#normal .inner h4{
    font-size: 18px;
    margin-top: 20px;
    margin-bottom: 6px;
    font-weight: 600;
}

#normal .inner .dot-list{
    text-indent: -18px;
    padding-left: 18px
}



.sec-in-01, .area-cmn-01 {
    max-width: 900px;
}
.sec-in-01, .sec-in-02, .sec-in-03, .area-cmn-01, .area-cmn-04 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}



.mw_wp_form_confirm .s-input,.mw_wp_form_input .s-confirm {
    display: none
}

.mw_wp_form_confirm .dlist-form .detail {
    padding: 26px 30px
}

.mw_wp_form_confirm .btn-cmn-02[name="submitBack"]::after {
    left: 15px;
    right: auto;
    transform: rotate(-45deg) scaleX(-1)
}

.mw_wp_form .error {
    font-size: 12px;
    color: #ff7884
}

.area-form>div {
    margin-bottom: 50px
}

.area-form input {
    vertical-align: middle
}

.area-form .mwform-checkbox-field input,.area-form .mwform-radio-field input {
    position: relative;
    top: -1px;
    display: inline-block;
    width: 15px;
    height: 15px
}

.privacy-box{
    font-size: 14px;
}

.privacy-box a{
    color: #00b6ca;
    text-decoration: underline;
}

body#inquiry .txt-cmn-02.tc,
body#inquiry-business .txt-cmn-02.tc{
    text-align: center;
}

body#inquiry .txt-cmn-02.mbc,
body#inquiry-business .txt-cmn-02.mbc{
    margin-bottom: 30px;
    text-align: center;
}

body#inquiry .sec-in-01>.txt-cmn-02 {
    text-align: center
}

body#inquiry .mw_wp_form_input .area-form {
    margin-top: 120px
}

body#inquiry-business .dlist-form input[name="other"] {
    margin-top: 10px
}

body#inquiry-business .ttl-cmn-02.txt-color-bgr {
    margin: 80px 0 -30px
}

.area-form .line-dot-gy {
    margin-top: 50px;
    padding: 0
}

.apply-flow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 700px;
    margin: 0 auto 50px
}

.apply-flow li {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: calc(33.33% - 5px);
    max-width: 215px;
    height: 40px;
    color: #00b6ca;
    text-align: center;
    background: url(/wp/wp-content/themes/mercurop/img/ico_arrow_06_wh.svg) no-repeat right 50%;
    background-size: contain
}

.mw_wp_form_input .apply-flow li.input::after,.mw_wp_form_confirm .apply-flow li.confirm::after,.mw_wp_form_complete .apply-flow li.complete::after {
    background-image: url(/wp/wp-content/themes/mercurop/img/ico_arrow_06_bl.svg)
}

.mw_wp_form_input .apply-flow li.input,.mw_wp_form_confirm .apply-flow li.confirm,.mw_wp_form_complete .apply-flow li.complete {
    color: #fff;
    background-image: url(/wp/wp-content/themes/mercurop/img/ico_arrow_06_bl.svg)
}

.mw_wp_form_input .apply-flow li.input::before,.mw_wp_form_confirm .apply-flow li.confirm::before,.mw_wp_form_complete .apply-flow li.complete::before {
    content: "";
    position: absolute;
    top: -30px;
    left: 50%;
    display: block;
    width: 14px;
    height: 21px;
    background: url(/wp/wp-content/themes/mercurop/img/ico_drop_01.svg) no-repeat 50% 50%;
    background-size: contain;
    transform: translateX(-50%)
}

body#apply .dlist-form .ttl.ws,body#apply .dlist-form .detail.ws {
    background: #f0fafc
}


body#apply .dlist-form .detailbox {
    margin-top: 30px;
    padding: 30px;
    background: #fff;
    border-radius: 20px
}

body.confirm .dlist-form .detailbox {
    display: none!important
}

body#apply .dlist-form .detailbox,body#apply-child .dlist-form .detailbox,body#apply .dlist-form .plantype,body#apply .dlist-form .wstype {
    display: none
}

body#apply .dlist-form .detailbox .img {
    max-width: 300px;
    margin: 0 auto 30px
}

body#apply .dlist-form .plantype {
    margin-top: 30px
}

body#apply .dlist-form .plantype .special {
    margin: 20px 0;
    padding: 20px 0;
    border-top: 1px solid #f7f7f7;
    border-bottom: 1px solid #f7f7f7
}

body#apply input:disabled+.mwform-radio-field-text {
    color: #9e9e9e
}

body#apply .area-form .ttl-aco {
    position: relative;
    padding: 15px 30px;
    font-size: 18px;
    background: #f7f7f7;
    border: 1px solid #eee;
    cursor: pointer;
    transition: opacity 0.2s
}

body#apply .area-form .ttl-aco::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 30px;
    width: 18px;
    height: 18px;
    background: url(/wp/wp-content/themes/mercurop/img/ico_arrow_08_bl.svg) no-repeat 50% 50%;
    background-size: contain;
    transform: translateY(-50%);
    transition: transform 0.2s
}

body#apply .area-form .ttl-aco.is-open::after {
    transform: translateY(-50%) scaleY(-1)
}



.dlist-form {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 80px;
    line-height: 1.6;
    border: 1px solid #eee;
    border-top: none
}

.dlist-form .ttl,.dlist-form .detail {
    border-top: 1px solid #eee
}

.dlist-form .ttl {
    width: 300px;
    padding: 25px 0 25px 30px;
    font-weight: 600;
    font-size: 15px;
    /*color: #00b6ca*/
}

.dlist-form .ttl>span {
    position: relative;
    display: block
}

.dlist-form .detail {
    width: calc(100% - 300px);
    padding: 30px
}

.txt-cmn-03+.input-cmn-01 select,
.txt-cmn-03+.input-cmn-01 input{
    margin-top: 16px
}

.dlist-form select {
    padding: 5px 10px 7px;
    font-size: 15px;
    border-radius: 4px;
}

.dlist-form input[type="text"],.dlist-form input[type="email"],.dlist-form input[type="tel"],.dlist-form textarea,.mw_wp_form_confirm .dlist-form .input-cmn-01,.mw_wp_form_confirm .dlist-form .input-cmn-02 {
    display: block;
    width: 100%;
    padding: 10px
}

.mw_wp_form_input .dlist-form input[type="text"],.mw_wp_form_input .dlist-form input[type="email"],.mw_wp_form_input .dlist-form input[type="tel"],.mw_wp_form_confirm .dlist-form .input-cmn-01 {
    border: none;
    border: 1px solid #eee;
    /*border-bottom: 1px solid #9e9e9e;*/
    border-radius: 0;
    background-color: #fafafa;
}

.mw_wp_form_confirm .dlist-form .input-cmn-01,.mw_wp_form_confirm .dlist-form .input-cmn-02 {
    margin: 0 -10px;
    width: calc(100% + 20px);
    min-height: calc(1.8em + 20px);
    background: #e0e0e0
}

.mw_wp_form_input .dlist-form textarea,.mw_wp_form_confirm .dlist-form .input-cmn-02 {
    border: 1px solid #eee;
    border-radius: 3px;
    background-color: #fafafa
}

.mw_wp_form_input .dlist-form textarea{
    min-height: 200px
}

.dlist-form input[type="text"]:focus,.dlist-form input[type="email"]:focus,.dlist-form input[type="tel"]:focus,.dlist-form textarea:focus {
    border-color: #00b6ca;
    outline: none
}

.dlist-form .mwform-radio-field+input[type="hidden"]+input[type="text"],.dlist-form select+input[type="text"],.dlist-form input[type="text"]+input[type="text"] {
    display: block;
    margin-top: 10px
}

.mw_wp_form_confirm .btn-wrap-01 {
    margin-bottom: 50px;
    display: flex;
}

.mw_wp_form_confirm .btn-wrap-01 .btn-cmn-02[value="back"]{
    background-color: #00b4c8;
}

.dlist-form .txt-sub-01 {
    margin-top: 5px;
    font-size: 12px
}

.dlist-form input::placeholder,
.dlist-form textarea::placeholder {
    color: #bbb
}

.box-agree {
    margin-top: 60px;
    font-size: 16px;
    text-align: center;
    margin-bottom: -30px;
}

.box-agree .mwform-checkbox-field label, .box-agree .mwform-radio-field label{
    font-weight: 700 !important
}

.privacy-box{
    padding: 0 120px
}

h2.ttl-cmn-02{
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 10px;
    /*color: #00b6ca*/
}

h2.ttl-cmn-02.bbb{
    font-size: 22px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 20px;
    /*color: #00b6ca*/
}

.mark-required,.mark-any {
    position: absolute;
    top: 3px;
    right: 0;
    display: block;
    width: 50px;
    line-height: 1;
    padding: 2px 0 3px;
    font-size: 12px;
    text-align: center;
    background: #fff
}

.mark-required {
    color: #ff7884;
    border: 1px solid #ff7884
}

.mark-any {
    color: #00b6ca;
    border: 1px solid #00b6ca
}

.mw_wp_form_confirm .s-input,.mw_wp_form_input .s-confirm {
    display: none
}

.mw_wp_form_confirm .dlist-form .detail {
    padding: 26px 30px
}

.mw_wp_form_confirm .btn-cmn-02[name="submitBack"]::after {
    left: 15px;
    right: auto;
    transform: rotate(-45deg) scaleX(-1)
}

.mw_wp_form .error {
    font-size: 12px;
    color: #ff7884
}

.area-form>div {
    margin-bottom: 50px
}

.area-form input {
    vertical-align: middle
}

.area-form .mwform-checkbox-field input,.area-form .mwform-radio-field input {
    position: relative;
    top: -1px;
    display: inline-block;
    width: 15px;
    height: 15px
}

body#inquiry p.notice,
body#inquiry-business p.notice{
    text-align: center;
    pointer-events: none;
}

body#inquiry .sec-in-01>.txt-cmn-02,
body#inquiry-business .sec-in-01>.txt-cmn-02 {
    text-align: center
}

#autozip{
    display: none !important
}

body#inquiry .mw_wp_form_input .area-form {
    margin-top: 80px
}

body#inquiry-business .dlist-form input[name="other"] {
    margin-top: 10px
}

body#inquiry-business .ttl-cmn-02.txt-color-bgr {
    margin: 80px 0 -30px
}

.area-form .line-dot-gy {
    margin-top: 50px;
    padding: 0;
    margin-bottom: 70px
}

.apply-flow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 700px;
    margin: 0 auto 50px
}

.apply-flow li {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: calc(33.33% - 5px);
    max-width: 215px;
    height: 40px;
    color: #00b6ca;
    text-align: center;
    background: url(/wp/wp-content/themes/mercurop/img/ico_arrow_06_wh.svg) no-repeat right 50%;
    background-size: contain
}

.mw_wp_form_input .apply-flow li.input::after,.mw_wp_form_confirm .apply-flow li.confirm::after,.mw_wp_form_complete .apply-flow li.complete::after {
    background-image: url(/wp/wp-content/themes/mercurop/img/ico_arrow_06_bl.svg);
     font-weight: 600
}

.mw_wp_form_input .apply-flow li.input,.mw_wp_form_confirm .apply-flow li.confirm,.mw_wp_form_complete .apply-flow li.complete {
    color: #fff;
    background-image: url(/wp/wp-content/themes/mercurop/img/ico_arrow_06_bl.svg);
    font-weight: 600
}

.mw_wp_form_input .apply-flow li.input::before,.mw_wp_form_confirm .apply-flow li.confirm::before,.mw_wp_form_complete .apply-flow li.complete::before {
    content: "";
    position: absolute;
    top: -30px;
    left: 50%;
    display: block;
    width: 14px;
    height: 21px;
    /*background: url(/wp/wp-content/themes/mercurop/img/ico_drop_01.svg) no-repeat 50% 50%;*/
    background: url(/wp/wp-content/themes/mercurop/img/common/icon_drop_eg.svg) no-repeat;
    background-size: contain;
    transform: translateX(-50%)
}

body#apply .dlist-form .ttl.ws,body#apply .dlist-form .detail.ws {
    background: #f0fafc
}

body#apply .dlist-form .detail .sss{
    font-size: 13px;
    margin-top: -2px
}

body#apply .dlist-form .detailbox {
    margin-top: 30px;
    padding: 30px;
    background: #fff;
    border-radius: 20px
}

body.confirm .dlist-form .detailbox {
    display: none!important
}

body#apply .dlist-form .detailbox,body#apply-child .dlist-form .detailbox,body#apply .dlist-form .plantype,body#apply .dlist-form .wstype {
    display: none
}

body#apply .dlist-form .detailbox .img {
    max-width: 300px;
    margin: 0 auto 30px
}

body#apply .dlist-form .plantype {
    margin-top: 30px
}

body#apply .dlist-form .plantype .special {
    margin: 20px 0;
    padding: 20px 0;
    border-top: 1px solid #f7f7f7;
    border-bottom: 1px solid #f7f7f7
}

body#apply input:disabled+.mwform-radio-field-text {
    color: #9e9e9e
}

body#apply .area-form .ttl-aco {
    position: relative;
    padding: 15px 30px;
    font-size: 15px;
    background: var(--color-bl01);
    border: 1px solid #eee;
    cursor: pointer;
    color: #fff;
    transition: opacity 0.2s;
    margin-top: 20px;
    font-weight: 600;
}

body#apply .area-form .ttl-aco::after {
    /*content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 30px;
    width: 18px;
    height: 18px;
    background: url(/wp/wp-content/themes/mercurop/img/ico_arrow_08_bl.svg) no-repeat 50% 50%;
    background-size: contain;
    transform: translateY(-50%);
    transition: transform 0.2s*/
        content: "";
    top: 50%;
    right: 24px;
    width: 6px;
    height: 6px;
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
    transform: translateY(-50%) rotate(135deg);
    transform-origin: center;
    border-radius: unset;
}

body#apply .area-form .ttl-aco.is-open::after {
        transform: translateY(-50%) rotate(-45deg);
}

.box-terms {
    overflow-y: auto;
    padding: 40px;
    border: 1px solid #eee;
    border-top: none
}

.box-terms .ttl-cmn-04 {
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
    /*color: #00b6ca;*/
    text-indent: -14px;
    padding-left: 14px;
}

.box-terms .txt-cmn-02+.ttl-cmn-04{
    margin-top: 30px
}

.box-aco {
    display: none;
    font-size: 13px;
    line-height: 1.5
}

.box-aco .dot-list {
    text-indent: -13px;
    padding-left: 13px;
    margin-top: 6px
}

.box-aco a{
    pointer-events: none;
    color: var(--color-bk);
    text-decoration: none;
}

@media screen and (min-width: 600px) {
    body#apply .area-form .ttl-aco:hover {
        opacity:.7
    }
}


body#review #intro h3{
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
    text-align: center;
}

body#review #intro .notice{
    font-size: 12px;
    text-align: center;
}


body#review .review-list{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 40px;
    max-width: 880px;
    margin: 0 auto
}
body#review .review-list li .img-box{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px;
}

body#review .review-list li .info-box{
    padding: 0 30px
}

body#review .review-list li h3{
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
    text-align: justify;
}

body#review .review-list li h4{
    font-size: 13px;
    text-align: center;
}

body#about .two-column.w4-6 li:first-child{
    width: 360px
}

body#about .two-column.w4-6 li{
    width: calc(100% - 400px);
}

/*body#about #intro li:last-child p{
    width: 89%
}
*/

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

#campaign .slide-nav,
#voice .slide-nav{
    display: flex;
    margin-top: 40px
}


    body#home #eye-c{
        margin-top: 0
    }
    body#home #eye-c .inner{
        min-height: 100svh;
        justify-content: center;
    }

    body#home header .inner .ci{
        opacity: 1
    }

    body#home #eye-c .inner .sp-btn{
        position: fixed;
        border: 0.5px solid #fff;
        bottom: 5svh;
        width: 200px;
        height: 30px;
        display: flex !important;
        justify-content: center;
        align-items: center;
     border-radius: 20px;
        background-color: #00b4c8;
        color: #fff;
        font-weight: 600;
                transform: scale(1.2);
                font-size: 11px;
                z-index: 6
    }

    .swiper-button-next, .swiper-button-prev,.swiper-pagination{
        z-index: 5
    }

    body#home #eye-c .inner .sp-btn span{
        margin-top: -1px
    }
    body#home #eye-c .logo-box{
        display: none;
    }
    body#home #eye-c .img-box{
        width: 100%;
        border-radius: 0;
        right: 0;
        top: 0;
        height: 82svh;
        background: url('/wp/wp-content/themes/mercurop/img/top/eye-c_sp.jpg') center 80% no-repeat;
        background-size: cover;
        position: relative;
        background-position-y: 50%;
    }

    body#home #eye-c .img-box .glass{
        left: 20px;
        width: 32%;
        bottom: -8vw;
        z-index: 9
    }

    body#home #eye-c .img-box br{
        display: block;
    }

    body#home #eye-c .img-box:after{
        content: "";
        display: block;
        background: url(/wp/wp-content/themes/mercurop/img/common/wave4.png) no-repeat;
        background-size: cover;
        position: absolute;
        width: 100%;
        height: 6vw;
        top: auto;
        bottom: -1px;
        left: 0;
    }

    body#home #eye-c .img-box h2{
position: absolute;
        left: 44vw;
        font-size: 6vw;
        line-height: 9vw;
        bottom: 12vw;
        letter-spacing: 0.4vw;
    }

    body#home #eye-c{
        margin-bottom: 100px
    }

    body#home #intro .inner{
        flex-direction: column;
        gap: 40px;
        align-items: center;
    }

    body#home #intro .inner .tit-box{
        order: 1;
        width: 54vw
    }

/*    body#home #intro .inner .tit-box img{
        display: none;
    }*/

    body#home #intro .inner .tit-box h2{
        font-size: 5vw;
        line-height: 10vw;
        padding-left: 4vw;
    }

    body#home #intro .inner .txt-box{
        margin-left: 0;
        order: 2;
        font-size: 3.8vw;
        margin-bottom: 18vw;
        padding-left: 4vw;
        width: 54vw
    }

    body#home #example .inner{
        padding: 0
    }

    body#home #example .center-list a{
        width: 80%;
        margin-left: 10%;
        height: 80vw;

    }

    body#home #example .center-list a img{
        height: 40vw;
        width: auto;
        margin-top: -15vw;
    }

    body#home #example .slide-nav{
        margin-top: 40px
    }

    body#home #example .center-list a h3{
        font-size: 4.2vw;
        line-height: 6.8vw;
        bottom: 11vw;
    }

    body#home #evidence .inner{
        padding: 0
    }

    body#home #prices .btns{
        margin-top: 30px
    }

    body#water:not(.faq) .main-head{
        background-color: var(--color-bl04);
        margin-bottom: 0;
        color: var(--color-bl01);
    }

    body#water #eye-c{
        background: url('/wp/wp-content/themes/mercurop/img/pages/kv_water.jpg') center no-repeat;
        background-size: cover;
    }


    body#water:not(.faq)  #eye-c .inner{
        backdrop-filter: none;
        height: 400px
    }

    body#water:not(.faq)  #eye-c .inner div{
        background: none;
        box-shadow: none;
    }

    body#water:not(.faq)  #eye-c .inner h2{
        font-size: 22px;
        line-height: 1.8;
    }

    body#water:not(.faq)  #box1 .txt-box,
    body#water:not(.faq)  #box2 .txt-box,
    body#water:not(.faq)  #box3 .txt-box,
    body#water:not(.faq)  #box4 .txt-box,
    body#water:not(.faq)  #box4 .table-box{
        width: 100%;
        padding: 0;
        margin-bottom: 50px
    }

    body#water:not(.faq)  #box1 .img-box{
    position: relative;
    left: -40px;
    width: calc(100vw + 80px);
    height: auto;
    border-radius: 0;
    }

    /*body#water:not(.faq)  #box2 .img-box,
    body#water:not(.faq)  #box3 .content-box{
            width: calc(100% + 40px);
    }*/

    body#water:not(.faq)  #box3 .content-box>li{
        padding: 30px 20px
    }

    body#water:not(.faq)  #box3 .content-box>li .two-column,
    #maintenance .two-column{
            flex-direction: column;
    }

    body#water:not(.faq)  #box3 .content-box>li .two-column li,
    #maintenance .two-column li{
        width: 100%
    }

    body#water:not(.faq)  #box4 .txt-box h3{
        font-size: 13px
    }

    body#water:not(.faq)  #box4 .table-box{
        font-size: 12px
    }

    body#water #quality .inner{
        font-size: 12px
    }

    body#water #quality .inner .img-box+.txt-box{
        padding: 0;
        margin-top: 30px
    }

    body#water #quality .two-column,
    body#water #bottle .two-column{
        flex-direction: column;
    }

    body#water #quality .two-column li,
    body#water #bottle .two-column li{
        width: 100%
    }

    body#water #bottle .img-box{
        border-radius: 10px;
        height: 220px
    }

body#water .img-box.full{
    max-width: 100%
}

    #sdgs .card-box .two-column li:first-child{
        padding: 20px;
        background-color: #fff;
        border-radius: 10px;
        width: 100%;
        text-align: center;
    }

    #sdgs .card-box .two-column li img{
        width: 120px
    }

    #spec .sp-area{
        display: flex !important;
        gap: 20px;
    }

    #spec .spec-img{
        height: 200px;
        display: flex;
        justify-content: center;
        align-items: flex-end;
        margin-bottom: 16px
    }

    #spec .spec-img img{
        width: 50px
    }

    #spec .select-type{
        font-weight: 700;
        font-size: 14px;
        background-color: #fafafa;
        border: 1px solid  var(--color-gy02);
        width: 100%;
        height: 40px;
        padding-left:16px;
        border-radius: 5px;
        position: relative;
        color: var(--color-bk)
    }

    #spec .selectbox{
        position: relative;
        display: flex;
        align-items: center;
    }
    #spec .selectbox:after{
        content: '';
        width: 6px;
        height: 6px;
        position: absolute;
        right: 14px;
        margin-top: -2px;
        border-top: solid 2px var(--color-bk);
        border-right: solid 2px var(--color-bk);
        transform: rotate(135deg);
        pointer-events:none;
    }

    body#product #spec dl dd{
        padding: 0 0px 10px
    }

    body#product #spec dl dd{
        font-size: 12px
    }

    body#product #spec dl dd.txt-01 span{
        font-size: 20px
    }

    body#product #maintenance h4{
        font-size: 22px
    }

    body#product #others .center-list a{
        width: 100%;
    height: auto;
    }

    body#price #prices .plus-box{
        width: 100%;
        margin-bottom: 0;
        padding-bottom: 0
    }

    #merit .box-list>li h4{
        font-size: 13px
    }

      body#faq #category .date-box,
  body#faq #category .cat-index .cat-box{
    grid-template-columns: unset;
  }
  body#nankatsusc #prices .box-list{
    grid-template-areas: "areaA"
  "areaB"
  "areaC";
  }
  body#nankatsusc #prices .box-list .box:nth-child(3) .notice{
    text-align: left;
  }

  body#home #intro{
    margin-bottom: -30vw;
    position: relative;
  }

  body#home #intro .bird{
bottom: 66vw;
        right: auto;
        width: 20vw;
        left: 15vw;
  }

  body#home #intro .sprout{
position: absolute;
        width: 18vw;
        right: -12vw;
        top: -14vw;
  }

  body#home #about .inner .h-set+p{
font-size: 13px;
        line-height: 1.7;
  }

  body#home #about .inner .btn-box{
    margin-top: 30px
  }

  body#home .gallery-list{
    grid-template-columns: repeat(1,1fr);
    gap: 20px;
  }

  body#water #box1 .inner, body#water #box2 .inner, body#water #box3 .inner, body#water #box4 .inner{
    padding: 0 40px;
    font-size: 14px;
  }

  body#water #box4 .inner{
    font-size: 12px;
  }

  body#water #box2 .img-box,
  body#water #box3 .content-box,
  body#water #box4 .img-box{
    width: calc(100% + 40px);
  }

  body#water #box3 .content-box li h3{
    margin-bottom: 20px;
    font-size: 15px
  }

  body#water #box3 .content-box li p{
    font-size: 12px
  }

  body#water #box4 .inner .btns.cv{
    margin-top: 0;
            width: calc(100% + 30px);
        left: -15px;
  }

  body#water:not(.faq) .base.nb{
    padding-bottom: 40px
  }

  body#water #quality .inner{
    padding: 0 30px
  }

  body#water #quality .inner .txt-box+.link-box{
    padding: 0;
    margin-top: 30px
  }

  body#water #quality .inner .txt-box+.link-box .btns.common{
    width: 100%
  }

  #sdgs .inner{
    padding: 0 30px;
    font-size: 12px
  }

  #selection .inner, body#water #bottle .inner{
    font-size: 12px
  }

  body#product #spec dl dt{
    font-size: 14px
  }

  body#price #intro dl .mid{
    margin: -10px auto 5px
  }

  body#price #intro dd{
    transform: scale(1);
  }

  body#price #individual .img-box>img, body#price #individual .box-wrap2 .img-box>img{
    /*height: 140px*/
  }

  body#price #individual h4.caption{
    font-size: 15px
  }

  body#price #individual .box-wrap1 .btns{
    max-width: 140px;
  }

  body#price #individual .table-box table {
    min-width: calc(100vw - 100px);
}

body#price #individual .price{
        transform: scale(1);
}

body#price #individual .box-wrap2 .img-box>img.slims{
        /*height: 100px;*/
}

body#price #simulation .nom-center{
    text-align: left;
}

body#price #simulation h5{
    font-size: 14px
}

body#price #simulation li.step1 dl, body#price #simulation li.step2 dl{
    font-size: 12px
}

body#price #simulation li.step1 dl .selectbox{
    width: 60px
}

body#price #simulation li.step2 dl p{
    font-size: 13px
}

body#price #simulation li.result .price{
    transform: scale(1);
    margin-bottom: 20px
}

body#price #simulation li.result p.notice{
    font-size: 12px
}

body#price #simulation li.result{
    width: 100%;
    margin-left: 0
}

body#price #response .nom-center {
        text-align: left;
    }

    body#price #response .box-list>li{
        padding: 20px
    }

    body#price #prices .plus-box .box{
        min-height: 320px;
        width: 100%;
        height: auto;
        /*height: auto;*/
    }

    body#price #prices .plus-box .box.nest{
        margin-bottom: 0;
        padding-bottom: 0
    }

    body#price #prices ul.notice{
        margin-top: 10px
    }

    body#about .main-head{
        margin-bottom: 0
    }

    body#about .base.eg:before,
    body#about .base.eg:after,
    body#about .base.wb:before,
    body#about .base.wb:after{
        display: none;
    }

    body#about #intro .two-column{
        flex-direction: column;
    }

body#about #intro .two-column li{
    width: 100% !important
}

body#about #intro h2{
    font-size: 18px;
    margin-left: auto;
    margin-bottom: 30px
}

body#about #intro h2 span{
    border-radius: 4px !important
}

body#about #intro li:last-child p{
    font-size: 12px;
    width: 100%;
}

body#about section#intro+section#box1,
body#about section.box+section.box{
    margin-top: 0px
}


body#about section.box+section.base.box{
    margin-top: 30px
}

body#about section.box.base{
    padding-top: 0
}


body#about section.box .inner{
    padding: 0
}

body#about #intro .txt-box,body#about #box1 .txt-box, body#about #box2 .txt-box, body#about #box3 .txt-box, body#about #box4 .txt-box{
    padding: 0 30px
}


body#faq .main-head,
body.faq .main-head{
    margin-bottom: 30px
}

body#faq .date-box a,
body.faq .date-box a{
    align-items: flex-start;
    position: relative;
    justify-content: center;
    padding-right: 40px
}

body#faq .date-box a img,
body.faq .date-box a img{
    display: block;
    position: absolute;
    right: 0
}

body.faq .cat-index .cat-box{
    grid-template-columns: repeat(2, 1fr);
}

body.faq .cat-index .cat-box li{
    padding: 0 5px;
}

body.faq .caption{
    font-size: 18px;
    text-align: center;
    margin-bottom: 20px
}

.inquiry-btn-box p{
    font-size: 14px
}

body#company #intro .inner{
    padding: 0
}

 body#company #intro .two-column{
        flex-direction: column;
    }

body#company #intro .two-column li{
    width: 100% !important
}

body#company #intro h2{
    font-size: 18px;
    margin-left: auto;
    margin-bottom: 20px
}

body#company #intro li:last-child{
    padding: 0 30px
}

body#company #intro li:last-child p{
    font-size: 12px
}

body#company #box1 .txt-box,
body#company #box3 .txt-box,
body#company #box4 .txt-box{
    padding: 0
}

body#company #box2 .link-box{
    margin-top: 20px;
    /*margin-bottom: -20px*/
}

body#company #box1 .in-box,
body#company #box2 .in-box,
body#company #box3 .in-box,
body#company #box4 .in-box{
    margin-bottom: 20px
}

body#company #box2 .band-list{
    margin-bottom: 10px
}

body#company .business li{
    padding: 20px;
}

body#company .business li .mid{
    font-size: 15px;
    margin-bottom: 20px
}

body#company #box2 .txt-box{
    font-size: 12px;
}

body#company #box2 .txt-box p{
    text-align: justify;
}

body#company #box4 .credo{
    width: 100%;
    margin: 30px auto 0
}

body#company #box4 .credo ul{
    padding: 20px;
    text-align: justify;
}

body#company #box4 .credo .mid{
    text-align: left;
}

body#company #box4 .credo ul p{
    text-align: justify;
}

body#company #box5 .img-box{
    padding: 40px 0
}

body#company #box5 .mid{
    text-align: left;
    margin-bottom: 0;
    font-size: 12px
}

body#company #box5 p{
    font-size: 12px
}

body#company #box6 .nom-center{
    font-size: 12px;
}

body#quality .img-box.min2{
    width: 100%;
    margin-top: 40px
}

body#quality .img-box.min{
    width: 100px
}

body#quality .round-cap.min{
    margin: 30px auto -10px
}

body#quality #box2 .two-column{
    width: 100%;
    flex-direction: column;
    margin: 20px auto 40px
}

body#quality #box2 .two-column li{
    width: 100%
}

body#factory .lines,
body#factory .lines.l2{
    grid-template-columns: repeat(1, 1fr);
    gap: 50px;
}

body#factory .lines li,
body#factory .lines.l2 li{
    display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
}

body#factory .lines li:after,
body#factory .lines.l2 li:after{
    content: "▼";
    color: #baecf2;
    position: absolute;
            bottom: -40px;
        font-size: 20px;
}

body#factory .lines li:last-child:after{
    content: none;
}

body#factory .lines.l2 li:last-child:after{
    content: "▼";
    color: #baecf2;
    position: absolute;
            bottom: -40px;
        font-size: 20px;
}

body#factory .round-cap.min{
    margin-bottom: -20px
}

body#factory .outlo{
    font-size: 13px;
    text-align: left;
}

body#petbottle .lineup{
    grid-template-columns: repeat(1, 1fr);
}

body#petbottle .lineup li{
    width: 100%
}

body#bottle .lines li{
        position: relative;

}

body#bottle .txt-box{
    width: 100%
}

body#bottle .lines{
    grid-template-columns: repeat(1, 1fr);
    gap: 50px;
}

body#bottle .lines li:after{
    content: "▼";
    color: #baecf2;
    position: absolute;
            bottom: -40px;
        font-size: 20px;
        left: 50%;
        margin-left: -10px
}

body#bottle .lines li:last-child:after{
    content: none;
}

body#bottle .two-column{
    flex-direction: column;
}

body#bottle .two-column li{
    width: 100%
}

body#cock .two-column{
    flex-direction: column;
}

body#cock .two-column li{
    width: 100%
}

body#cock .num-list{
    font-size: 13px;
    text-indent: -13px;
    padding-left: 13px
}

body#parts .sml{
    font-size: 16px;
    margin-bottom: 16px
}

body#parts .lines{
    grid-template-columns: repeat(1, 1fr);
    gap: 40px;
}

body#csr .bandl{
    font-size: 13px;
    align-items: flex-start;
}

body#csr .nom-center{
    font-size: 13px;
    text-align: left;
    margin-bottom: 20px
}

body#csr #box2 .aco-box li .question span, body#csr #box2 .aco-box li .answer .txt-box p{
    margin-top: 0
}

body#csr #box2 .aco-box li .answer .txt-box p{
    margin-top: 0;
    font-size: 13px
}

body#csr .img-list{
    gap:10px;
    justify-content: flex-start;
    margin-bottom: 20px
}

body#csr .img-list img{
    width: 100px
}

body#delivery-business #box1 .kakusyu .sml{
    font-size: 13px;
    font-weight: 600
}

body#delivery-business #box1 .kakusyu .sml li+li{
    margin-top: 6px
}

body#agency .main-head{
    margin-bottom: 0
}

body#agency .base.eg:before, body#agency .base.eg:after{
    display: none;
}

body#agency #intro .two-column{
        flex-direction: column;
    }

body#agency #intro .two-column li{
    width: 100% !important
}

body#agency #intro h2{
    font-size: 18px;
    margin-left: auto;
    margin-bottom: 30px
}

body#agency #intro span{
    border-radius: 4px !important
}

body#agency #intro li:last-child p{
    font-size: 12px;
    width: 100%;
}

body#agency #intro.base{
    padding: 30px
}

body#agency #intro .band-cap{
    background-color: transparent;
}

body#agency #intro .band-cap span{
    background-color: #fff
}

body#agency .two-column{
    flex-direction: column;
}

body#agency .two-column li{
    width: 100%
}

body#agency #box2 .kig{
        grid-template-columns: repeat(1, 1fr);
}

body#agency .sml{
    font-size: 13px;
    margin-bottom: -10px
}

body#agency #box1 .img-box, body#agency #box2 .img-box, body#agency #box3 .img-box, body#agency #box4 .img-box, body#agency #box5 .img-box, body#agency #box6 .img-box{
    margin-bottom: 0
}

body#agency .pt{
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin-bottom: 50px
}

body#agency .lines {
    grid-template-columns: repeat(1, 1fr);
}

body#agency .lines .mid{
    margin-top: 50px
}

body#agency .lines .mid span{
    display: block;
}

body#agency .outlo{
    font-size: 13px;
    text-align: left;
}

body#home .plus-box .box.head-top .caption{
    margin-top: 20px
}

#eye-c.nm h2{
        flex-flow: column;
        gap: 6px;
        padding: 0;
        font-size: 2rem;
        background-color: unset;
    }
    #eye-c.nm h2 span{
        width: fit-content;
        background-color: var(--color-bl01);
        padding: 4px;
    }
    body#area .aco-box.area{
        font-size: 1.4rem;
    }
    body#area .aco-box.area li .question{
        justify-content: flex-start;
        padding: 10px;
        font-size: 1.4rem;
    }
    body#area .aco-box li .answer .txt-box{
        padding: 20px;
    }
    body#area .aco-box.area li .question span,
    body#area .aco-box.area li .answer .txt-box p{
        margin-top: 0;
    }
    body#area .aco-box.area li .answer .txt-box h4{
        font-size: 1.4rem;
    }

    body#area .aco-box.area .group_area{
        grid-template-columns: repeat(2, 1fr);
    }
    body#area #area-list .wrap-list{
        grid-template-columns: 1fr;
    }
    body#area #area-list .map-pic{
        margin-bottom: 20px;
    }

body#product .box-list>li .btns{
    width: 80%
}

body#product #spec dl dd.line5{
        min-height: 156px;
}

body#product #spec .btns{
    width: 100%
}


body.second #intro .img-box{
    max-width: 100% !important;
}

body#guide .lines{
    display: flex;
            flex-direction: column;
}

body#mypage .sml{
    font-size: 14px;
}

body.second #intro .txt-box{
    padding: 0 30px
}

body.second #intro .img-box{
    border-radius: 0 !important
}


body#healthy #intro h2,
body#habit #intro h2,
body#baby #intro h2,
body#child #intro h2{
    font-size: 18px;
}

body#healthy #intro .txt-box,
body#habit #intro .txt-box,
body#baby #intro .txt-box,
body#child #intro .txt-box{
    font-size: 12px;
}

body#healthy .kansyu,
body#habit .kansyu,
body#baby .kansyu,
body#child .kansyu{
    padding: 0px;
    border-radius: 0px;
    border: none;
    font-size: 10px
}

body#healthy .kansyu .imgs,
body#habit .kansyu .imgs,
body#baby .kansyu .imgs,
body#child .kansyu .imgs{
    margin-bottom: 20px;
    padding-bottom: 0px;
    border-bottom: none
}

body#healthy .kansyu .imgs img,
body#habit .kansyu .imgs img,
body#baby .kansyu .imgs img,
body#child .kansyu .imgs img{
    width: 80px;
    height: 80px
}

body#healthy .kansyu .imgs h3,
body#habit .kansyu .imgs h3,
body#baby .kansyu .imgs h3,
body#child .kansyu .imgs h3{
    font-size: 11px;
}

body#healthy .column-box p,
body#habit .column-box p,
body#baby .column-box p,
body#child .column-box p{
    font-size: 12px;
}

body#healthy .line-box dl,
body#habit .line-box dl,
body#baby .line-box dl,
body#child .line-box dl{
    flex-direction: column;
    gap: 0px;
}

body#healthy .line-box li,
body#habit .line-box li,
body#baby .line-box li,
body#child .line-box li{
    width: 100%
}

body#healthy .line-box dl dd,
body#habit .line-box dl dd,
body#baby .line-box dl dd,
body#child .line-box dl dd,
body#healthy .line-box dl dt,
body#habit .line-box dl dt,
body#baby .line-box dl dt,
body#child .line-box dl dt{
    width: 100%
}

body#healthy h3.meyasu,
body#habit h3.meyasu,
body#baby h3.meyasu,
body#child h3.meyasu{
    font-size: 16px;
}

body#healthy h3.meyasu span,
body#habit h3.meyasu span,
body#baby h3.meyasu span,
body#child h3.meyasu span{
    font-size: 13px;
}

body#healthy .band-list,
body#habit .band-list,
body#baby .band-list,
body#child .band-list{
    max-width: 80%;
}

body#healthy h3.mid,
body#habit h3.mid,
body#baby h3.mid,
body#child h3.mid{
    font-size: 15px;
}

body#healthy .riyuu,
body#habit .riyuu,
body#baby .riyuu,
body#child .riyuu{
    grid-template-columns: repeat(1,1fr);
}

body#healthy .ryou,
body#habit .ryou,
body#baby .ryou,
body#child .ryou{
    grid-template-columns: repeat(1,1fr);
    gap: 30px;
}

body#maintenance #intro h2,
body#self-maintenance #intro h2,
body#maker-maintenance #intro h2{
    font-size: 18px
}

body#maintenance .txt-box,
body#self-maintenance .txt-box,
body#maker-maintenance .txt-box{
    font-size: 12px;
}

body#maintenance #intro .txt-box,
body#self-maintenance #intro .txt-box,
body#maker-maintenance #intro .txt-box{
    padding: 0
}

body#maintenance #intro .color-box,
body#self-maintenance #intro .color-box,
body#maker-maintenance #intro .color-box{
    padding: 30px;
}

body#maintenance .color-box,
body#self-maintenance .color-box,
body#maker-maintenance .color-box{
    padding: 30px;
}

body#maintenance .grids,
body#self-maintenance .grids,
body#maker-maintenance .grids{
    grid-template-columns: repeat(1,1fr);
    gap: 40px;
    margin-top: 60px
}

body#maintenance .time-line,
body#self-maintenance .time-line,
body#maker-maintenance .time-line{
    grid-template-columns: repeat(2,1fr);
    gap: 10px;
    margin-top: 20px
}

body#maintenance .time-line li,
body#self-maintenance .time-line li,
body#maker-maintenance .time-line li{
    font-size: 11px;
}

body#maintenance .time-line span,
body#self-maintenance .time-line span,
body#maker-maintenance .time-line span{
    font-size: 13px;
    width: 90%;
    padding: 4px
}

body#maintenance .dekiru,
body#self-maintenance .dekiru,
body#maker-maintenance .dekiru{
    grid-template-columns: repeat(1,1fr);
    gap: 30px;
}

body#maintenance #maker3 .notice,
body#self-maintenance #maker3 .notice,
body#maker-maintenance #maker3 .notice{
    text-align: left;
}

body#maintenance .box-list,
body#self-maintenance .box-list,
body#maker-maintenance .box-list{
    flex-direction: column;
}

body#maintenance .box-list>li,
body#self-maintenance .box-list>li,
body#maker-maintenance .box-list>li{
    width: 100%
}

body.campaign .limit{
    font-size: 16px;
    padding: 10px;
    margin-bottom: 40px
}

body.campaign .otoku{
    margin-bottom: 10px
}

body.campaign .caption{
    font-size: 16px;
    margin-bottom: 30px;
    line-height: 1.5
}

body.campaign .plus{
    flex-direction: column;
}

body.campaign .plus .lb,
body.campaign .plus .rb{
    width: 100%;
    text-align: center;
    font-size: 16px;
    padding: 20px 10px
}

body.campaign .plus .lb{
    flex-direction: column-reverse;
}

body.campaign .plus .pl{
    margin: 8px 0;
    justify-content: center;
}

body.campaign .zenin{
    padding: 20px
}

body.campaign .zenin .out{
    flex-direction: column-reverse;
    width: 100%
}

body.campaign .zenin .out .txt-b{
    width: 100%
}

body.campaign #intro .zenin .out .img-box{
    width: 100%;
    margin-bottom: 10px
}

body.campaign .zenin h4{
    font-size: 20px;
    text-align: center;
}

body.campaign .product-box .item-list .swiper-slide{
    max-width: 300px
}

body.campaign #intro .product-box .inner{
    padding: 30px 10px
}

body.campaign #intro .product-box .inner h3{
    font-size: 16px;
    margin-bottom: 20px
}

body.campaign #intro .product-box .txt-box{
    padding: 0
}

body.campaign .kiyaku{
    font-size: 14px
}

body.campaign .kiyaku .line-cap{
    font-size: 16px;
    min-height: 30px
}

body#review #intro,
body.review.second #intro{
    margin-top: 40px
}

body#review #intro h3{
    font-size: 13px;
}

body#review #intro .notice{
    font-size: 10px
}

body#review .review-list{
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
}

body#review .review-list li .info-box{
    padding: 0
}

body#review .review-list li h3{
    font-size: 12px
}

.main-column{
    grid-template-columns: repeat(1,1fr);
    gap: 20px;
    margin-bottom: 40px
}

.main-column dd h3{
    font-size: 16PX
}

.main-column dd .datas div{
    font-size: 13px;
    padding: 10px 20px
}

.v-list li{
    font-size: 13px
}

.v-list li h4{
    font-size: 16px
}

.v-list li.caution{
    font-size: 11px
}

.v-list li+li{
padding-top: 25px;
    margin-top: 25px;
}

.staff{
    padding: 30px;
}

.staff h5{
    font-size: 16px
}

body#price #intro{
    margin-top: 40px
}

body#price #prices .plus-box .box.nest .box-in{
    padding: 40px;
}

body#price #prices .nom-center{
    margin-bottom: 30px
}


body#transfer #intro .zenin .out .img-box{
    width: auto;
    height: auto;
}

body#transfer #intro .zenin h4{
    font-size: 17px
}

body#transfer #intro .zenin h4 span {
    font-size: 14px
}

body.campaign .kiki h2{
    font-size: 17px
}

body.campaign .kiki .kimete>div{
    flex-direction: column;
}

body.campaign .kiki .kimete>div dt,
body.campaign .kiki .kimete>div dd{
    width: 100%;
    padding: 20px 30px
}

body.campaign .kiki .kimete>div dd{
    padding-bottom: 30px
}

body.campaign .kiki .kimete>div h3+h4{
    letter-spacing: 0;
    font-size: 16px
}

body.campaign .kiki .kimete>div dd .btns.common{
    margin-top: 16px
}

body.campaign .nagare h2{
    font-size: 18px
}

body.campaign .nagare ul.list>li{
    padding: 20px 30px 30px
}

body.campaign .nagare ul.list>li h3{
    flex-direction: column;
    font-size: 16px
}

body.campaign .nagare ul.list>li h3 span{
    margin: 0 0 20px
}

body.campaign .tokuten h2{
    font-size: 16px;
    margin-bottom: 16px;
}

body.campaign .tokuten h3{
    font-size: 22px;
}

body.campaign .tokuten>ul{
    grid-template-columns: repeat(1,1fr);
    gap: 40px 20px;
    margin-top: 40px;
}

body.campaign .tokuten>ul>li{
    padding: 30px
}

body.campaign .futari{
    padding-top: 40px;
    margin-top: 40px
}

body.campaign .futari h2,
body.campaign .imasenk h2,
body.campaign .atatte h2{
    font-size: 18px;
    margin-bottom: 20px;
    line-height: 1.5
}

body.campaign .futari>ul,
body.campaign .imasenk ul{
    grid-template-columns: repeat(1,1fr);
}

body.campaign .futari>ul{
    margin-top: 50px
}

body.campaign .imasenk ul{
    margin-top: 10px
}

body.campaign .imasenk ul li{
    line-height: 1.5
}

body.campaign .futari>ul>li h4{
    min-height: 100px
}

body.campaign .futari>ul>li .ins{
    padding: 30px
}

body.campaign .futari>ul>li .a-box{
    font-size: 18px
}

body.campaign .futari>ul>li.first .a-box{
    margin: 0
}

body.campaign .futari>ul>li .a-box p{
    width: 100%;
    text-align: center;
}

body.campaign .futari>ul>li .b-box{
    margin-bottom: 14px
}

body#privacy #intro,
body#commerce #intro,
body#aboutsite #intro{
    margin-top: 40px
}

#normal .inner h3{
    font-size: 18px
}

#normal .inner h4{
    font-size: 16px;
}

#normal .inner .dot-list{
    text-indent: -14px;
    padding-left: 14px
}

body#campaign .campaign-box{
   grid-template-columns: repeat(1,1fr); 
}

body#campaign .info-box{
    padding: 0 30px
}

#normal .inner dl{
    flex-direction: column;
}

#normal .inner dl dd,
#normal .inner dl dt{
    width: 100%
}

body.faq .cat-index .cat-box{
    grid-template-columns: repeat(1,1fr);
    gap: 0;
}

body.faq .cat-index .cat-box li+li{
    margin-top: -1px
}

body.faq .cat-index .cat-box li a{
border-radius: 0;
        background-color: transparent;
        border-left: none;
        border-right: none;
        font-size: 13px;
}

body.faq .cat-index .cat-box li a img {
    right: 15px;
    position: absolute;
    right: 24px;
    width: 14px;
}






body#apply main, body#inquiry main{
    margin-top: 140px;
    padding: 0 30px
}


 .apply-flow li {
        width: calc(33.33% - 3px);
        height: 21px;
        font-size: 11px
    }

    .dlist-form {
        display: block;
        margin: 0 -20px;
        border: none
    }

    .dlist-form .ttl,.dlist-form .detail {
        width: auto;
        padding: 20px;
        border: none
    }

    .dlist-form .ttl {
        padding-bottom: 0;
        font-size: 13px;
        color: #00b6ca
    }

    .dlist-form .detail {
        border-top: none
    }

    .area-form .ttl-cmn-02 {
        margin: 50px 0 20px
    }

    .box-agree {
        margin-top: 20px;
        font-size: 16px
    }

    body#apply .dlist-form .box-ws {
        padding: 20px;
        border-radius: 10px
    }

    .mwform-radio-field {
        padding: 10px 10px 15px;
        border-bottom: 1px solid #9e9e9e
    }

    .mwform-radio-field:first-of-type {
        border-top: 1px solid #9e9e9e
    }

    p+.mwform-radio-field {
        margin-top: 20px
    }

    .dlist-form .mwform-radio-field+input[type="hidden"]+input[type="text"] {
        margin-top: 20px
    }

    .dlist-form input::placeholder {
        letter-spacing: -.025em
    }

    body#inquiry .sec-in-01>.txt-cmn-02 {
        text-align: justify
    }

    body#apply .header .logo .link {
        pointer-events: none
    }

    body#apply .area-form .ttl-aco {
        padding: 10px 20px;
        font-size: 16px
    }

    body#apply .area-form .ttl-aco::after {
        right: 20px
    }

    .box-terms {
        padding: 20px
    }

    .line-dot-gy button,
    .s-input .txt-cmn-02+a{
        width: 100%
    }

    body#price #support .box{
        padding: 40px
    }

    .inquiry-btn-box{
        margin-top: 50px
    }

    body#eco.second #intro .txt-box{
        padding: 0
    }

    body#eco #intro .txt-box+.img-box.eco-m{
        max-width: 200px !important
    }

    body#eco .pm-list dt,
    body#eco .pm-list dd{
        width: 100%
    }

    body#inquiry p.notice{
    pointer-events: auto;
}

.box-aco a{
    pointer-events: auto;
        color: #00b6ca;
    text-decoration: underline;
}

.privacy-box{
    padding: 0
}

body#guide .lines>li .more-step{
    padding: 0
}

body#guide .lines .table-box table{
    width: 100%;
    font-size: 12px
}

body#about #intro .inner,
body#about #intro .two-column,
body#agency #intro .inner,
body#agency #intro .two-column{
    width: 100%;
    padding: 0 10px;
}

body#factory .lines .mid, body#factory .lines.l2 .mid{
    margin-bottom: 10px
}

body#eco .pm-list{
    font-size: 13px;
    margin-bottom: 10px
}

body#eco .outlo{
    font-size: 14px
}

body#csr #box2 .aco-box li .question{
    font-size: 13px
}

body#petbottle .lineup li .price{
    transition: scale(1)
}

body#petbottle .link-box{
    padding-left: 0;
    padding-right: 0
}

body#petbottle .link-box .btns.cv{
    font-size: 16px;
    width: 100%
}

body#product #others .center-list .info-box h3{
    font-size: 14px
}

body#maintenance .box-list>li .txt-box,
body#self-maintenance .box-list>li .txt-box,
body#maker-maintenance .box-list>li .txt-box{
    font-size: 12px;
    text-align: center;
}

body#maintenance .box-list>li .btns,
body#self-maintenance .box-list>li .btns,
body#maker-maintenance .box-list>li .btns{
    width: 80%
}

body#cock #box1 .img-box img,
body#cock #box2 .img-box img,
body#cock #box3 .img-box img,
body#cock #box4 .img-box img,
body#cock #box5 .img-box img{
    width: 100%
}

body.product .mark_jdsa{
    width: 80px;
    margin: 0 auto
}

body#price #individual .box-wrap2 .box-in{
    width: 50%
}

body#price #individual .table-box.color{
    font-size: 12px
}

body#price #simulation li.result table{
    font-size: 12px;
    letter-spacing: 0
}

body#company #box5 .img-box+ul{
    padding: 0;
    font-size: 13px
}
body#guide .lines>li{
    padding: 30px
}

body#guide .lines .table-box table td{
    letter-spacing: -1px
}

body#guide .lines>li .sml{
    font-size: 14px
}

body#guide #box2 .color-box{
    padding: 30px;
    font-size: 13px
}

body#guide #box2 .color-box .sml{
    font-size: 15px
}

section#voice-main{
    margin-top: -4VW
}

body#agency .recommend .band-cap{
    background-color: var(--color-bl01);
    display: inline-block;
    padding: 9px 20px 10px;
    border-radius: 4px
}

body#agency #box3 .two-column{
    gap: 30px;
}

body#commerce #normal .inner dl dt,
body#commerce #normal .inner dl dd{
    padding: 10px
}

body#commerce #normal .inner a{
    color: var(--color-bl01);
    text-decoration: underline;
}

body#agency #box3 .round-cap{
    font-size: 16px
}

body#healthy #outlo .kansyu,
body#habit #outlo .kansyu,
body#baby #outlo .kansyu,
body#child #outlo .kansyu{
    padding: 0;
}

body#healthy #outlo .kansyu .imgs img,
body#habit #outlo .kansyu .imgs img,
body#baby #outlo .kansyu .imgs img,
body#child #outlo .kansyu .imgs img{
    width: 60px;
    height: 60px
}

body#healthy #outlo .kansyu .imgs h3,
body#habit #outlo .kansyu .imgs h3,
body#baby #outlo .kansyu .imgs h3,
body#child #outlo .kansyu .imgs h3{
    width: calc(100% - 80px);
    font-size: 11px
}

body#healthy #outlo .kansyu .imgs,
body#habit #outlo .kansyu .imgs,
body#baby #outlo .kansyu .imgs,
body#child #outlo .kansyu .imgs{
    margin-bottom: 10px
}

}