#wrap .lineup-WDmini .sec-main .main-block .product-ttl { width: 100%; max-width: 560px; }
#wrap .lineup-WDmini .sec-main .main-block .img-house { width: 100%; max-width: 426px; }
#wrap .lineup-detail .sec-main .main-block .block-head { width: 50%; padding: 0 50px; }
#wrap .lineup-detail .sec-plan .plan-list {  margin: auto; padding-top: 80px; }
#wrap .lineup-detail .sec-plan .plan-list .plan-box { width: 30%; }
#wrap .lineup-detail .sec-plan .plan-list .plan-box .image img { max-height: 700px; }
#wrap .lineup-detail .sec-plan .plan-list .plan-box .plan-image { max-width: 450px; }
#wrap .lineup-detail .sec-plan .plan-list .plan-box .plan-image-right { margin-left: auto; margin-right: 0; }

#wrap .lineup-WDmini .sec-quality { background-color: #E7E7E7; }
#wrap .lineup-WDmini .sec-support { background-color: #C6D2DF; }
#wrap .lineup-WDmini .sec-support .sec-ttl::before,
#wrap .lineup-WDmini .sec-quality .sec-ttl::before { content: url("../../assets/img/woodbox/bungalow/logo.svg"); max-width: 394px; }
.spec_list li .wrap .blue { color: #006C8C; }
.spec_list li .wrap h3 { border-color: #006C8C; }

#wrap .lineup-WDmini .sec-support .support-list .box .inner-num { background-color: #006C8C; }
#wrap .lineup-WDmini .sec-support .support-list .box .inner-txt .ttl { color: #006C8C; }
#wrap .lineup-WDmini .sec-support .support-list .box .inner-txt .ttl .span { background-color: #006C8C; }

.plans { padding: 120px 0; }
.plans .slider { position: relative; margin: auto; max-width: 1200px; width: 94%; }
.plans .slider_wrap { margin: 0 auto; max-width: 1000px; width: calc(100% - 130px); }
.plans .slider .arw { margin: auto; width: 60px; height: auto; top: 0; bottom: 0; position: absolute; cursor: pointer; }
.plans .slider .arw.prev { left: 0; transform: rotate(-180deg); }
.plans .slider .arw.next { right: 0; }
.plans .slide { margin: 0 16px; }
.plans .slide .ttl { font-size: 35px; font-weight: 600; padding-bottom: 2rem; }
.plans .slide .ttl span,
.plans .slide .ttl small { display: inline-block; vertical-align: middle; }
.plans .slide .ttl small { font-size: 18px; padding-left: 1rem; }
.plans .slide .info { padding-top: 60px; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
.plans .slide .info .caption { font-size: 17px; padding-bottom: 1.5rem; font-weight: 600; }
.plans .slide .info .left { max-width: 570px; width: calc(100% - 200px); }
.plans .slide .info .left .txt { line-height: 180%; }
.plans .slide .info .right { width: 185px; }
.plans .slide .info .right .size { font-size: 12px; }

.plans .slide.plan2 .info .col { width: 66%; display: flex; flex-wrap: wrap; }
.plans .slide.plan2 .info .col .box { width: 43%; margin-right: 3rem; }
.plans .slide.plan2 .info .col .size { width: 100%; padding-top: 3rem; font-size: 11px; }
.plans .slide.plan2 .info .txt { font-size: 13px; text-align: justify; }
.plans .slide.plan2 .info .col.pic { width: 30%; }
.plans .slide.plan2 .info .col img { width: 100%; }

.plans .slider .slick-dots { padding-top: 30px; position: unset; }
.plans .slider .slick-dots li { border-radius: 50%; width: 12px; height: 12px; border: 1px solid #000; background-color: #fff; margin: 0 12px; }
.plans .slider .slick-dots li button { display: none; }
.plans .slider .slick-dots li.slick-active { background-color: #000; }

/* -------------------------------------------- tablet */

@media screen and (max-width: 1100px) {
    #wrap .lineup-detail .sec-plan .plan-list .plan-box { width: 44%; }
    
}

/* -------------------------------------------- sp */

@media screen and (max-width: 767px) {

    #wrap .lineup-detail .sec-main .main-block .block-head { width: 100%; padding: 0 14%; }

    #wrap .lineup-detail .sec-plan .plan-list .plan-box .box-ttl { display: none; }
    #wrap .lineup-detail .sec-plan .plan-list .plan-box { width: 100%; padding: 0; }
    #wrap .lineup-detail .sec-plan .plan-list .plan-box .image img { width: 80%; max-width: none; }

    #wrap .lineup-WDmini .sec-support .sec-ttl::before, 
    #wrap .lineup-WDmini .sec-quality .sec-ttl::before { max-width: 262px; display: block; margin: auto; }

    .plans { padding: 60px 0; }
    .plans .slider_nav { padding-top: 30px; display: flex; justify-content: center; align-items: center; }
    .plans .slider .arw { width: 30px; position: static; margin: 0 30px; }
    .plans .slider_wrap { width: 100%; }

    .plans .slide { margin: 0 5px; }
    .plans .slide .info { display: block; padding-top: 40px; }
    .plans .slide .info .left,
    .plans .slide .info .right { width: 100%; }
    .plans .slide .info .right { padding-top: 16px; }
    .plans .slide .info .txt { font-size: 13px !important; text-align: justify; }
    .plans .slide .info .txt br { display: none; }
    .plans .slide .ttl { font-size: 24px; }
    .plans .slide .ttl small { font-size: 14px; }

    .plans .slide.plan2 .info .caption { padding-bottom: 1rem; }
    .plans .slide.plan2 .info .col { padding-top: 0; width: 100% !important; display: block; }
    .plans .slide.plan2 .info .col .box { width: 100%; padding-top: 2rem; }
    .plans .slide.plan2 .info .col.col.pic { text-align: center; }
    .plans .slide.plan2 .info .col.col.pic img { max-width: 420px; margin: auto; }

    .plans .slider .slick-dots { padding: 0; }
    .plans .slider .slick-dots li { width: 10px; height: 10px; margin: 0 8px; }
}