   .fa-x-twitter,
   .fa-youtube {
       font-size: 1.25rem;
   }

   .picup .card-text {
       text-align: left;
   }

   h2,
   h2.title {
       padding-bottom: 0.4rem;
       font-size: 1.75rem;
       margin-bottom: 1rem !important;
       font-weight: 700 !important;
   }

   .picup .card .card-image img {
       transition: transform 0.3s ease-in-out;
       /* 拡大・縮小時のスムーズさを設定 */
       transform: scale(1);
       max-width: 100%;
       height: auto;

       /* 初期サイズ */
   }

   .picup .card:hover .card-image img {
       transform: scale(1.1);
       transition-duration: .3s;
       transition: transform .6s ease;

       /* overflow: hidden; */
   }

   .picup .card-image {
       margin-bottom: 0.5rem;
       height: auto;
       display: flex;
       justify-content: center;
       align-items: center;

       /* overflow: hidden; */
   }

   .picup .card-text {
       color: #3b3b3b;
       /*font-size: 1rem !important;*/
   }

   .picup .card-body {
       line-height: normal;
   }

   @media (min-width: 576px) {
       section#main-banner {
           margin-bottom: 5rem;
       }
   }


   @media (min-width: 768px) {
       section#main-banner {
           margin-bottom: 3rem;
       }

       .picup .card-text {
           font-size: 1rem !important;
       }
   }

   @media (min-width: 992px) {
       section#main-banner {
           margin-bottom: 4rem;
       }
   }


   @media (min-width: 1200px) {
       section#main-banner {
           margin-bottom: 5rem;
       }
   }

   .card-blue02 {
       background-color: #d0e2f2 !important;
       background-color: transparent !important;
   }

   #quick_search:focus::placeholder {
       color: transparent;
   }

   .side-tech,
   .side-x {
       height: 280px;
       overflow-y: scroll;

       font-size: 1rem;
       font-size: 0.875rem;
       border: 1px solid #ebedef;
       border: 1px solid #cfd5e4;
       padding: 0 1rem;
       font-weight: 400;
       background-color: #F8F9FA;


       border: 1px solid #dee2e6;
       background-color: #f9f9f9;
       background-color: #f5f5f5;
       background-color: #EBEDEF;
       border: none;
       border-bottom: 1px solid #EBEDEF;
   }

   .side-tech .row,
   .side-x .row {
       display: flex;
       flex-direction: column;
       border-bottom: 1px dotted #999999;
       padding: 0;
       padding: 1rem;
       /*padding-bottom: 0;*/
       position: relative;
       transition: all 0.3s ease;
   }

   .side-tech .row:hover,
   .side-x .row:hover {
       background-color: rgba(0, 0, 0, .075);
   }

   .side-tech .row a,
   .side-x .row a {
       word-break: break-all;
       /*font-weight: 500;*/
       z-index: 0;
       color: #3b3b3b;
       display: flex;
   }

   .side-tech .row a:after,
   .side-x .row a:after {
       background: none !important;
       margin: 0;
       content: "";
   }

   .side-tech .row p,
   .side-x .row p {
       font-size: 0.9rem;
       margin-bottom: 0;
   }

   .side-tech-title,
   .side-x-title {
       font-weight: 500;
       margin-bottom: 0;

   }

   .side-tech-img,
   .side-x-img {
       margin: 0.75rem 0;
       margin-bottom: 0;
       margin-top: 0;
       margin-right: 1rem;

       width: 100px;
       height: 90px;
       overflow: hidden;
       border-radius: 8px;
       flex-shrink: 0;
   }

   .side-tech-img img,
   .side-x-img img {
       border-radius: 16px;
       border-radius: 8px;
       /*border-radius: 0.25rem;*/
       /*max-width: 100%;*/
       /*max-width: 100px;
                            max-width: 90px;*/
       width: 100%;
       height: 100%;
       object-fit: cover;
       border-radius: 8px;
   }

   .side-tech .row p.side-tech-title {
       font-weight: 600;
       /*font-size: 1.1rem;*/
       margin-bottom: 1rem;
   }

   .side-x-txt img {
       max-width: 1em;
       height: auto;
       vertical-align: middle;
       margin: 0 2px;
   }

   .side-tech .row:last-child .side-tech-text,
   .side-x .row:last-child .side-x-txt {
       border: none;
   }

   .side-tech-link p,
   .side-x-link p {
       font-size: 0.875rem;
       text-align: right;
       font-weight: 500;
       margin-bottom: 0;
   }

   .side-tech .row a {
       flex-direction: column;
   }

   .side-tech-head {
       display: flex;
       margin-bottom: 1rem;
   }

   .side-tech-text {
       display: -webkit-box;
       -webkit-line-clamp: 3;
       /* ← 最大行数を指定 */
       -webkit-box-orient: vertical;
       overflow: hidden;
       text-overflow: ellipsis;
   }

   @media (min-width: 992px) {

       .side-tech .row,
       .side-x .row {
           padding: 1.25rem;
       }

       .side-tech-img,
       .side-x-img {
           /*max-width: 150px;
                                max-width: 120px;*/
           /*width: 120px;
                                height: 90px;*/
           width: 150px;
           width: 140px;
           height: 100px;
       }

       .side-tech-text {
           display: block;
           -webkit-line-clamp: unset;
           -webkit-box-orient: initial;
           overflow: visible;
       }
   }


   footer .footer-banner {
       display: none !important;
   }

   @media (min-width: 769px) {
       ul.tab li.btn {
           min-width: auto;
           padding: 0.375rem 0.5rem;
           padding: 0.375rem 0.6rem;
       }
   }

   @media (min-width: 992px) {

       .pl-xl-2r {
           padding-left: 1.5rem !important;
       }

       .pr-xl-2r {
           padding-right: 1.5rem !important;
       }
   }

   @media (min-width: 1200px) {

       .pl-xl-2r {
           padding-left: 2rem !important;
       }

       .pr-xl-2r {
           padding-right: 2rem !important;
       }
   }


   /* menu main lgのみ */

   @media (min-width: 991.98px) {
       header {
           box-shadow: 0 1px 4px 0 rgb(0 0 0 / 14%);
           z-index: 1000;
       }
   }

   @media (min-width: 768px) {

       section#main-banner {

           border-bottom: 1px solid #eee;

       }
   }
