p.lead {
           text-align: center;
           font-size: 18px;
           font-weight: bold;
           color: #fff;
           background-color: #000;
           border-radius: 999px;
           padding: 10px;
       }

       p.ui_title {
           font-size: 18px;
           border-bottom: 1px solid #000;
           margin-bottom: 10px;
       }

       .servie_list {
           display: flex;
           flex-wrap: wrap;
           gap: 2.5rem;
       }

       .servie_list .col {
           width: calc(20% - 2rem);
           height: auto;
           margin: 0 0 3rem 0;
           display: flex;
           flex-direction: column;
       }

       .servie_list .col.hide_item {
           display: none;
       }

       .servie_list .col figure {
           height: 140px;
           border: 1px solid #eee;
           padding: 5px;
           display: flex;
           flex-direction: column;
           justify-content: center;
           border-radius: 5px;
       }

       .servie_list .col figure img {
           object-fit: contain
       }

       .servie_list .col .service_title {
           width: 100%;
           height: 100px;
           padding: 1rem 0;
           line-height: 1.4;
           flex-grow: 0;
           font-size: 18px;
           text-align: center;
           font-weight: bold;
           font-feature-settings: "palt";
       }

       .servie_list .col .service_txt {
           flex-grow: 2;
       }

       .servie_list .col .service_txt p {
           padding-bottom: 1rem;
           text-align: justify;
       }

       .servie_list .col .dlb_btn_w100 {
           width: 100%;
       }



       .search_area .category_search_box {
           width: 100%;
           display: flex;
           gap: 1rem;
           margin-bottom: 2rem;
           font-feature-settings: "palt";

       }

       .search_area .category_search_box label {
           display: flex;
           width: 20%;
           height: 80px;
           align-items: center;
           justify-content: center;
           background-color: #ddd;
           color: #000;
           text-align: center;
           line-height: 1.2;
           cursor: pointer;
           border-radius: 5px;
           transition: 0.5s;
       }

       .search_area .category_search_box input {
           display: none;
       }

       .search_area .category_search_box label span {
           color: #333;
           display: flex;
           align-items: center;
           justify-content: center;
           width: 100%;
           height: 100%;
       }

       .search_area .category_search_box label input:checked+span {
           display: flex;
           height: 80px;
           color: #FFF;
           background: #ca4e4e;
           border-radius: 5px;
           transition: 0.5s;
       }

       .search_area .category_search_box label:hover {
           background-color: #ccc;
       }


       .search_area .tag_search_box {
           width: 100%;
           display: flex;
           flex-wrap: wrap;
           gap: 1rem;
           margin-bottom: 5rem;
           font-feature-settings: "palt";

       }

       .search_area .tag_search_box label {
           display: block;
           padding: 1rem 2rem;
           justify-content: center;
           background-color: #ddd;
           color: #000;
           text-align: center;
           line-height: 1.2;
           cursor: pointer;
           border-radius: 5px;
           transition: 0.5s;
           flex-grow: 1;
       }

       .search_area .tag_search_box input {
           display: none;
       }

       .search_area .tag_search_box label span {
           color: #333;

       }

       .search_area .tag_search_box label input:checked+span {
           display: block;
           padding: 1rem 2rem;
           color: #FFF;
           background: #ffad3a;
           border-radius: 5px;
           transition: 0.5s;
           margin-top: -1rem;
           margin-bottom: -1rem;
           margin-left: -2rem;
           margin-right: -2rem;
       }

       .search_area .tag_search_box label:hover {
           background-color: #ccc;
       }



       .service_genre {
           background-color: #eee;
           text-align: center;
           font-size: 12px;
           padding: 0.3px;
           margin-bottom: 3px;
           border-radius: 999px;
       }


       @media only screen and (max-width: 690px) {
           p.lead {
               font-size: 16px;
               border-radius: 5px;
               padding: 2rem .5rem;
           }

           .list .col {
               width: 100%;
               margin-top: 0;
           }

           .servie_list .col figure {
               height: 180px;
               padding: 1rem;
           }

           .servie_list .col figure img {
               height: 160px;
               width: 100%;
               object-fit: contain;
           }

           .search_area .category_search_box {
               flex-wrap: wrap;
               justify-content: left;
               gap: 1rem;
           }

           .search_area .category_search_box label {
               width: calc(33.3% - .7rem);
           }

           .search_area .tag_search_box label {
               padding: 1rem;


           }

           .search_area .tag_search_box label input:checked+span {
               padding: 1rem;

               margin-top: -1rem;
               margin-bottom: -1rem;
               margin-left: -1rem;
               margin-right: -1rem;
           }


       }