@charset "utf-8";

#cavitation01 ul li {
    width: calc((100% - 120px) / 4);
    position: relative;
}

.cavitation_num {
    text-align: center;
    color: #fe929f;
    font-size: 68px;
    line-height: 1;
    margin-top: 30px;
    margin-bottom: 10px
}

#cavitation01 .hr01 {
    width: 1px;
    background-color: #fe929f;
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    left: -20px;
}

#cavitation02 ul {
    margin-top: 40px
}

.cabi-div{
width: 440px;
    margin-right: 50px;
    }
#cavitation02 ul li {
    width: 242px;
    overflow: visible;
    position: relative
}

#cavitation02 ul li .imgbox:after {
    content: "";
    background: url(//www.beppu-hanakago.jp/wp/wp-content/themes/hanakago2021/lib/css/../images/common/arrow02_right_pink.png);
    background-size: 100%;
    width: 18px;
    height: 30px;
    display: block;
    position: absolute;
    top: calc(50% - 15px);
    right: -23px;
    z-index: 99
}

#cavitation02 ul li:last-of-type .imgbox:after {
    display: none
}

#cavitation02 ul li .p {
    text-align: center
}

.cavitation03List01 {
    border-width: 1px;
    border-style: solid;
    padding: 40px
}

.cavitation03List01 li h3,.cavitation04List01 li h3 {
    background: url(//www.beppu-hanakago.jp/wp/wp-content/themes/hanakago2021/lib/css/../images/cavitation/point01.png) no-repeat left top;
    background-size: 60px;
    padding-left: 70px;
    font-size: 28px;
    letter-spacing: .1em;
    height: 72px;
    padding-top: 35px
}

[data-element-id] .cavitation03List01 li .sp h3,[data-element-id] .cavitation04List01 li .sp h3{
  height: auto;
  font-size: 20px;
  padding-bottom: 25px;
}

.cavitation03List01 li:nth-of-type(2) h3,.cavitation04List01 li:nth-of-type(2) h3 {
    background-image: url(//www.beppu-hanakago.jp/wp/wp-content/themes/hanakago2021/lib/css/../images/cavitation/point02.png)
}

.cavitation04List01 li:nth-of-type(3) h3 {
    background-image: url(//www.beppu-hanakago.jp/wp/wp-content/themes/hanakago2021/lib/css/../images/cavitation/point03.png)
}

.cavitation04List01 li:nth-of-type(4) h3 {
    background-image: url(//www.beppu-hanakago.jp/wp/wp-content/themes/hanakago2021/lib/css/../images/cavitation/point04.png)
}

.cavitation03List01 li .p,.cavitation04List01 li .p {
    padding-left: 70px
}

.cavitation03List01 li+li {
    margin-top: 30px
}

.cavitation04List01 li+li {
    margin-top: 10px
}

.cavitation04List01 {
    margin: 50px 0;
    position: relative
}

.cavitation04List01 li:nth-of-type(1),.cavitation04List01 li:nth-child(2) {
    padding-right: 600px
}

.cavitation04_pic01 {
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
}

.cavitation05List01 li {
    width: 420px
}

.cavitation05List01 li h2 {
    font-size: 28px;
    line-height: 1.8;
    margin-bottom: 10px
}

.cavitation05List01 li .em02 {
    font-size: 18px
}

.cavitation05List01 li .table02 {
    margin-top: 20px
}

.cavitation05_pic01 {
    margin-top: 40px
}

.cavitation05_pic01 .item{
  position: relative;
}

.cavitation05_pic01 .item .tit {
    position: absolute;
    bottom: 5px;
    right: 5px;
    color: #fff;
    font-weight: 500;
    text-shadow: 0 0 5px BLACK;
    font-size: 15px;
    letter-spacing: -1px;
}

.cavitation05_pic01.sp {
    display: none
}

.cavitation05_pic01.sp .item .tit {
    font-size: 8px;
    letter-spacing: -1px;
}

[data-element-id] .cavitation05_pic01.sp {
    display: flex;
    flex-direction: column;
}

#cavitation05 {
    position: relative;
    overflow: visible
}

#cavitation05:before {
    content: "";
    background: url(//www.beppu-hanakago.jp/wp/wp-content/themes/hanakago2021/lib/css/../images/common/box01_before.png);
    width: 242px;
    width: 203px;
    position: absolute;
    top: -30px;
    transform: scale(-1,1)
}

#cavitation05:after {
    background: url(//www.beppu-hanakago.jp/wp/wp-content/themes/hanakago2021/lib/css/../images/common/box01_after.png);
    position: absolute;
    right: 0;
    bottom: 0
}

#cavitation06 {
    margin-top: 60px
}

#cavitation06 h2 {
    text-align: center;
    margin-bottom: 30px
}

@media only screen and (max-width: 768px) {
    #cavitation01 ul li {
        width:100%;
        margin-right: 0;
        margin-left: 0;padding-top: 30px;
    }
    
    #cavitation01 .hr01 {
        width: 100%;
        height: 1px;
        top: 0px;
        left: 0;
    }

    #cavitation02 ul li {
        width: 49%
    }

    #cavitation02 ul li:nth-of-type(n+3) {
        margin-top: 20px
    }

    .cavitation03List01 {
        padding: 5vw
    }

    .cavitation03List01 li h3 {
        height: auto;
        font-size: 20px;
        line-height: 1.4;
        padding-top: 0
    }

    /* .cavitation04_image div {
        width: calc(100%/3)
    } */

    .cavitation04_pic01 {
        position: relative;
        top: auto;
        right: auto;
        margin-top: 20px;
        width: 100%;
    }

    .cavitation04List01 {
        margin: 30px 0
    }

    .cavitation04List01 li {
        padding: 0 !important
    }

    .cavitation04List01 li h3 {
        font-size: 20px
    }
    
    .cavitation05_pic01 .item .tit{
      font-size: 8px;
      
    }

    #cavitation06 .p {
        text-align: left
    }

    #cavitation02 ul li:nth-of-type(2n) .imgbox:after {
        display: none
    }

    #cavitation02 ul li .imgbox:after {
        right: -13px
    }

    /* .cavitation05_pic01 {
        display: none
    } */

    .cavitation05_pic01.sp {
        display: block
    }
}

.cabi03box .fead-mv{
  width: 32%;
}

.cabi-mi{
  font-size: 20px;
    margin: 8px auto 10px;
}

@media only screen and (max-width: 599px) {
.cabi-div {
    margin-right: 0px;
}

.cabi03box{
  display: block;
  width: 100%;
}

.cabi03box .fead-mv {
    width: 100%;
    margin: 0 auto 30px;
}

.pl-0{
  padding-left: 0 !important;
}
}