/*
Theme Name:MONAD child
Theme URI:https://tcd-theme.com/tcd110
Description:WordPressテーマ「MONAD」の子テーマ
Template:monad_tcd110
Author:TCD
Author URI:https://tcd-theme.com/
Version:1.0
*/
 
/*
  ここから下にCSSを追記してください。
*/
 
/* カレンダーをヘッダー画像の右下に重ねる（PC） */
#header_slider_container {
  position: relative;
}
#csw {
  position: absolute;
  bottom: 40px;
  right: 40px;
  z-index: 100;
  max-width: 380px;
  background: rgba(255,255,255,0.97);
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}
/* content_builderのoverflow解除 */
#content_builder {
  overflow: visible !important;
}
/* 病気一覧グリッド */
#disease-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
}
/* 病気グリッドの余分な要素を非表示 */
#disease-grid p,
#disease-grid br {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  grid-column: 1 / -1 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* PC対応 */
@media (min-width: 768px) {
  header#header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 200 !important;
    background: #fff !important;
    padding-top: 16px !important;
  }
  header#header .logo_text,
  header#header #global_menu a {
    color: #333 !important;
  }
  #header_slider_container {
    margin-top: 110px !important;
  }
  /* サービス一覧：PC4列 */
  .service_list {
    display: flex !important;
    flex-wrap: wrap !important;
  }
  #cb_content_2 .cb_service_list .service_list .item {
    width: calc(25% - 23px) !important;
    box-sizing: border-box !important;
  }
  #cb_content_2 .cb_service_list .service_list .item:nth-child(4n) {
    margin-right: 0 !important;
  }
}
/* スマホ対応 */
@media (max-width: 767px) {
  #csw {
    position: relative !important;
    bottom: auto !important;
    right: auto !important;
    left: auto !important;
    margin: 20px auto !important;
    max-width: 340px !important;
  }
  #disease-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  /* サービス一覧：スマホ2列 */
  .service_list {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
  }
  #cb_content_2 .cb_service_list .service_list .item {
    width: calc(50% - 20px) !important;
    box-sizing: border-box !important;
  }
  /* カードの画像サイズ統一 */
  .service_list .item .image_wrap {
    aspect-ratio: 4/3 !important;
    overflow: hidden !important;
  }
  .service_list .item .image_wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
}