/*
Theme Name: Neve Child
Theme URI: https://themeisle.com/themes/neve/
Template: neve
Author: ThemeIsle
Author URI: https://themeisle.com
Description: Neve is a super fast, easily customizable, multi-purpose theme. It’s perfect for blogs, small business, startups, agencies, firms, e-commerce shops (WooCommerce storefront) as well as personal portfolio sites and most types of projects. A fully AMP optimized and responsive theme, Neve will load in mere seconds and adapt perfectly on any viewing device. While it is lightweight and has a minimalist design, the theme is highly extendable, it has a highly SEO optimized code, resulting in top rankings in Google search results. Neve works perfectly with Gutenberg and the most popular page builders (Elementor, Brizy, Beaver Builder, Visual Composer, SiteOrigin, Divi). Neve is also WooCommerce ready, responsive, RTL & translation ready. Look no further. Neve is the perfect theme for you!
Tags: blog,custom-logo,e-commerce,rtl-language-support,grid-layout,one-column,two-columns,custom-background,custom-colors,custom-header,custom-menu,featured-image-header,featured-images,flexible-header,full-width-template,sticky-post,theme-options,threaded-comments,translation-ready,accessibility-ready,wide-blocks,block-styles,footer-widgets,portfolio,left-sidebar,right-sidebar
Version: 3.8.16.1734521902
Updated: 2024-12-18 20:38:22

*/


/* 1. 基本レイアウト設定 */
.header {
    display: none;
}

.title {
    display: none;
}
.nv-page-title-wrap,
.nv-big-title,
.nv-page-title {
    display: none;
}

/* 2. コンテナ設定 */
body.post-type-archive-judicial-exam .neve-main > .container {
    max-width: 860px;
    margin: 0 auto;
    width: 100%;
    float: none;
}

body.post-type-archive-judicial-exam .content-area {
    width: 860px;
    margin: 0 auto;
    float: none;
    padding: 2rem;
    background-color: #f8f9fa;
}

/* 3. 比較表のスタイル */
.comparison-table {
    position: relative;
    width: 100%;
    overflow-x: auto;
    margin-bottom: 2rem;
    -webkit-overflow-scrolling: touch;
    display: block;
}

.comparison-table table {
    width: 100%;
    border-collapse: collapse;
    min-width: 1100px;
    table-layout: fixed;
}

/* 最初の列のスタイル */
.comparison-table th:first-child,
.comparison-table td:first-child {
    white-space: nowrap;  /* 最初の列は折り返さない */
    width: 25px;         /* 幅を25pxに固定 */
    min-width: 25px;     /* 最小幅も25pxに設定 */
}

.comparison-table th,
.comparison-table td {
    padding: 0.2rem;
    border: 1px solid #dee2e6;
    text-align: left;
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: normal;  /* その他の列は折り返す */
}

.comparison-table th {
    background-color: #f8f9fa;
    font-weight: bold;
    position: sticky;
    top: 0;
}
.rank-first,
.rank-second,
.rank-third {
    text-align: center;
    vertical-align: middle;
}

.rank-first img,
.rank-second img,
.rank-third img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}


/* 4. 検索エリア設定 */
.search-title-container {
    width: 100%;
    max-width: 860px;
    margin: 0px auto;
    background-color: #ff0000;
    padding: 0px;
}

.search-title-pc,
.search-title-sp {
    color: #ffffff;
    margin: 5px;
    text-align: center;
}

/* PC用タイトル */
.search-title-pc {
    font-size: 32px;
    line-height: 1.2;
    display: block;
}

/* スマホ用タイトル */
.search-title-sp {
    display: none;
    font-size: 21px;
    line-height: 1.2;
}

/* PC表示時の設定 */
@media screen and (min-width: 432px) {
    .search-title-container {
     padding: 1px 1px;
    }
}

/* スマホ表示時の設定 */
@media screen and (max-width: 431px) {
    .search-title-container {
        padding: 10px 0;
    }
    .search-title-pc {
        display: none;
    }
    .search-title-sp {
        display: block;
    }
}

/* フォーム要素とボタン設定 */
.custom-search-form {
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.search-field-group {
    margin-bottom: 1.5rem;
}

.search-field-title {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    color: #333;
}

/* ボタンとフォーム要素 */
.search-button-group {
    display: flex;
    gap: 0rem;
    margin-top: 0rem;
    justify-content: center;
}

.radio-group,
.checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.1rem;
}

.radio-label,
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    cursor: pointer;
}

/* PCでのボタン設定 */
button.search-submit,
button.search-reset {
    padding: 0.5rem 2rem;
    border: none;
    border-radius: 5px;
    font-size: 1rem;
    cursor: pointer;
    transition: background-color 0.3s;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: auto;
    min-width: 120px;
}

button.search-submit {
    background-color: #4CAF50;
    color: white;
}

button.search-reset {
    background-color: #f8f9fa;
    color: #333;
    border: 1px solid #dee2e6;
}

button.search-submit:hover {
    background-color: #45a049;
}

button.search-reset:hover {
    background-color: #e9ecef;
}

/* スマホでのフォーム要素調整 */
@media screen and (max-width: 431px) {
    .radio-group,
    .checkbox-group {
        flex-direction: row;
        gap: 6px;
		flex-wrap: wrap; 
    }

    .radio-label,
    .checkbox-label {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        padding: 4px 0;
    }

    .search-button-group {
        display: flex;
        flex-direction: column;
        gap: -5px;
        margin-top: 0px;
        width: 100%;
    }

    button.search-submit,
    button.search-reset {
        width: 100%;
        padding: 12px;
        border-radius: 4px;
        font-size: 18px;
    }

    .search-field-title {
        margin-bottom: 8px;
        margin-top: 20px;
    }
}

/* ボタンとフォーム要素 */
.search-button-group {
    display: flex;
    gap: 1rem;
    margin-top: 2rem;
    justify-content: center;
}

.radio-group,
.checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}

.radio-label,
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}

button.search-submit,
button.search-reset {
    padding: 0.5rem 2rem;
    border: none;
    border-radius: 5px;
    font-size: 1rem;
    cursor: pointer;
    transition: background-color 0.3s;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: auto;
    min-width: 120px;
}

button.search-submit {
    background-color: #4CAF50;
    color: white;
}

button.search-reset {
    background-color: #f8f9fa;
    color: #333;
    border: 1px solid #dee2e6;
}

button.search-submit:hover {
    background-color: #45a049;
}

button.search-reset:hover {
    background-color: #e9ecef;
}

/* スマホでのフォーム要素調整 */
@media screen and (max-width: 431px) {
    .radio-group,
    .checkbox-group {
        flex-direction: row;
        gap: 0rem; /* 間隔を0.1remから0.25remに変更 */
        flex-wrap: wrap;
    }
    .radio-label,
    .checkbox-label {
        display: flex;
        align-items: center;
        gap: 0rem; /* 間隔を0.25remに変更 */
        font-size: 14px;
        padding: 4px 0;
    }
    .search-button-group {
        display: flex;
        flex-direction: column;
        gap: 0.5rem; /* 間隔を10pxから0.5remに変更 */
        margin-top: 0px;
        width: 100%;
    }
    button.search-submit,
    button.search-reset {
        width: 100%;
        padding: 5px;
        border-radius: 4px;
        font-size: 16px;
    }
    .search-field-title {
        margin-bottom: 8px;
        margin-top: 20px;
    }
}

/* 5. 検索結果エリア */
.search-results-summary {
    padding: 1rem;
    background: #e9f5e9;
    border: 1px solid #4CAF50;
    border-radius: 8px;
    margin-bottom: 2rem;
    text-align: center;
}

.post-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.post-list article {
    background: #ffffff;
    border-radius: 8px;
    padding: 1.5rem;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.entry-thumbnail {
    text-align: center;
    margin: 0 auto 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.entry-thumbnail a {
    display: flex;
    justify-content: center;
    width: 100%;
}

.entry-thumbnail img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.entry-title {
    font-size: 1.5rem;
    color: #2c3e50;
    margin-bottom: 0.5rem;
    text-align: center;
    width: 100%;
}

.entry-title a {
    text-decoration: none;
    color: inherit;
}

.entry-title a:hover {
    text-decoration: underline;
    color: #4CAF50;
}

.entry-content {
    text-align: center;
    width: 100%;
    color: #555;
}

.pagination {
    margin-top: 2rem;
    text-align: center;
}

.pagination a,
.pagination span {
    padding: 0.5rem 1rem;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    margin: 0 0.25rem;
    text-decoration: none;
    color: #333;
    display: inline-block;
}

.pagination a:hover {
    background-color: #4CAF50;
    color: white;
}


/* 6. 学校詳細セクションのスタイル */
.school-section {
   margin-bottom: 3rem;
}

.school-title-bar {
   background-color: #00BFA5;
   padding: 5px;
   height: 80px;
   display: flex;
   align-items: center;
   margin-bottom: 2rem;
}

.school-title-bar h3 {
   color: #ffffff;
   font-size: 38px;
   margin: 0;
   display: flex;
   align-items: center;
	margin-left: 10px; /* テキストの左側にスペースを追加 */
   margin-top: 0px; /* テキストを下に下げる */
}

.rank-number {
   background: #ffffff;
   color: #00BFA5;
   width: 48px;
   height: 48px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-left: 10px;
   font-size: 48px;
}

.school-content {
   padding: 0 1rem;
}

/* 7. レーダーチャート セクション */
.radar-chart {
    margin: 2rem 0;
}

.elementor-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

/* PC表示用レイアウト */
.radar-chart-container {
    flex: 0 0 50%;
    box-sizing: border-box;
    padding: 10px;
}

.review-table-container {
    flex: 0 0 30%;
    box-sizing: border-box;
    padding: 10px;
}

/* レーダーチャートSVG設定 */
.radar-chart svg {
    width: 320px;
    height: 291px;
}

/* レーダーチャートの色設定 */
.radar-chart-aria path {
    fill: #d1fff9;
    fill-opacity: 0.3;
    stroke: #00937f;
    stroke-width: 1;
}

.radar-chart-grid path {
    stroke: #dce5eb;
    stroke-width: 1;
}

.radar-chart-point circle {
    fill: #00937f;
}

/* 評価表のスタイル */
.review-table {
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
}

.review-table th {
    width: 70%;
    background-color: #2c3e50;
    color: #ffffff;
    padding: 8px;
    text-align: left;
}

.review-table td {
    width: 30%;
    padding: 8px;
    text-align: center;
}

.review-stars {
    color: #FFD700;
}

/* 総合評価 */
.total-label {
    background-color: #f8f9fa;
    font-weight: bold;
}

.total-score {
    font-weight: bold;
}

/* スマートフォン表示設定 */
@media screen and (max-width: 431px) {
    .elementor-container {
        flex-direction: column;
    }
    
    .radar-chart-container,
    .review-table-container {
        flex: 0 0 100%;
        width: 100%;
    }
    
    .radar-chart svg {
        width: 100%;
        height: auto;
    }
    
    .review-table {
        font-size: 14px;
    }
    
    .review-table th {
        padding: 6px;
    }
}

/* 8. YouTubeセクション */
.youtube-container {
        width: 100%;
        height: 0;
        padding-bottom: 56.25%; /* 16:9 アスペクト比 */
        position: relative;
    }
    
    .youtube-wrapper {
        position: absolute;
        top: 0;
        left: 47%; /* 左から50% */
        transform: translateX(-50%); /* 左に50%移動 */
        width: 100%;
        height: 100%;
    }
    
    iframe {
        width: 100%;
        height: 100%;
        border: 0;
    }

/* 9. 無料体験セクション */
.free-trial-section {
    border: 5px solid #FF0000;
    padding: 10px;
    margin-bottom: 0px;
}

.trial-header {
    background: #FF0000;
    text-align: center;
    padding: 20px;
    margin: 10px;
}
.trial-header p {
    display: none; /* 空の段落を非表示にする */
}
.trial-header h4 {
    color: #ffffff;
    font-size: 150%;
    margin: 0;
}

.trial-features {
    padding: 0 50px;
    list-style: none;
}

.trial-features li {
    font-size: 150%;
    font-weight: bold;
    color: #0066CC;
    padding: 10px 0;
}

.trial-button {
    text-align: center;
    margin: 50px 0;
}

.green-button {
    display: inline-block;
    background-color: #77C501;
    color: #fff;
    padding: 20px 40px;
    margin-bottom: 0px;
    text-decoration: none;
    font-size: 1.4em;
    font-weight: 700;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    transition: opacity 0.3s;
}

.green-button:hover {
    opacity: 0.8;
}

/* 10. レスポンシブ設定 */
@media screen and (max-width: 859px) {
    /* コンテナ幅の調整 */
    .search-title-container {
        width: auto;
        margin: 0 0px;
    }

    .search-title-pc {
        font-size: 28px;
    }

    body.post-type-archive-judicial-exam .content-area {
        width: calc(100% - 30px) !important;
        margin: 0 15px !important;
    }

    .youtube-container {
        margin: 2rem 15px;
    }
}

@media screen and (max-width: 768px) {
    /* レーダーチャート画像切り替え */
    .radar-chart .pc-image {
        display: none;
    }

    .radar-chart .sp-image {
        display: block;
    }
}

@media screen and (max-width: 431px) {
    /* スマホ表示全般の調整 */
    .search-title-container {
        margin: 0 10px;
        padding: 5px 15px;
        display: flex;
        align-items: center;
        min-height: 70px;
    }

    .search-title-pc {
        display: none;
    }

    .search-title-sp {
        display: block;
        font-size: 24px;
        line-height: 1.3;
        width: 100%;
    }

    body.post-type-archive-judicial-exam .content-area {
        padding: 1rem !important;
        width: calc(100% - 20px) !important;
        margin: 0 10px !important;
    }

    /* フォーム要素のスマホ調整 */
    .radio-group,
    .checkbox-group {
        flex-direction: column;
    }

    /* ボタンのスマホ調整 */
    .search-button-group button.search-submit,
    .search-button-group button.search-reset {
        width: 100%;
        margin: 0.5rem 0;
    }

    /* YouTubeコンテナのスマホ調整 */
    .youtube-container {
        margin: 1.5rem 10px;
    }

    /* 無料体験セクションのスマホ調整 */
    .trial-features {
        padding: 0 20px;
    }

    .trial-features li {
        font-size: 120%;
    }

    .green-button {
        font-size: 1.2em;
        padding: 15px 30px;
    }
}