@charset "utf-8";
/* CSS Document */
/* 出願状況ページのCSS　★進学希望調査ページのCSSと共通している部分を、高校受験共通のCSSに転記したい */

/* ------------------------------------------
  出願状況トップページ
------------------------------------------ */

.jyuken_top_box h4{
    padding: 1rem;
    background: #eee;
}

.jyuken_top_lead {
    padding: 1rem .5rem;
}
.jyuken_top_lead p{
    font-size: 1rem;/*0.875rem*/
    margin-bottom: 1rem;
    text-indent: 1rem;
    line-height: 1.7rem;
}
/*
    @media screen and (min-width:480px){
        .jyuken_top_lead p{
            font-size: 1rem;
        }
    }
*/

.jyuken_top_lead p:last-child{
    margin-bottom: 0;
}
.jyuken_top_lead strong{
    font-weight: bold;
    line-height: 1.7rem;
}


.jyuken_top_box ul li a p {
    font-size: clamp(15px,3.369vw,17px);
}
.jyuken_top_box ul li a p .jyulen_top_place{
    font-size: clamp(12px,2.481vw,17px);
}

.jyuken_top_box .jyuken_top_ul .syutsugan_status{
    margin-top: 2px;
    font-size: 0.8em;
    font-weight: bold;
}



.jyuken_top_box ul.previous_data{
    margin-top: 0.5rem;
    border: none;
    width: 100%;
    display:grid;
    grid-template-columns: repeat(auto-fit,minmax(8rem,1fr));
}
.jyuken_top_box ul:not(.previous_data) li:before {
    content: "";
    position: absolute;
    top: 41%;
	right: 1rem;
	width: 10px;
	height: 10px;
	border-top: 2px solid #002f7b;
	border-right: 2px solid #002f7b;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
    @media screen and (min-width: 540px){
        .jyuken_top_box ul:not(.previous_data) li:before {
            right: 1.5rem;
        }
    }

.jyuken_top_box ul.previous_data li{
    border: none;
}
.jyuken_top_box ul.previous_data li:before{
    border: none;
}

.jyuken_top_box ul.previous_data li a{
    padding: 1rem;
    text-align: center;
}

.bairitsu_pattern_midashi{
    margin-bottom: 2px;
	padding:0.5rem 1rem;
	color:red;
    border: 2px solid red;
    line-height: 1.7rem;
    font-weight: bold;
    letter-spacing: .06em;
}

/* 画像コピー等の禁止処理 */
.no_content_copy body{
    pointer-events: none;
    /* @media print{display: none !important;} */
}

.no_content_copy img{
    pointer-events: none;
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -moz-touch-callout:none;
    -moz-user-select:none;
    user-select:none;
    /* @media print{display: none !important;} */
}
/* ★ここまで、進学希望調査ページのCSSと共通している部分 */

/* ここから、出願状況ページのみで使用しているCSS */
/*-----------------------------
  入試日程と速報予定
*-----------------------------*/
.syutsugan .juken_table-wrapper .table-01{
    border-collapse: collapse;
    margin-bottom: 32px;
}
.syutsugan .juken_table-wrapper .table-01 th,
.syutsugan .juken_table-wrapper .table-01 td{
    border: 1px solid #999;
}

.syutsugan .juken_table-wrapper .table-01 th{
    background: #002f7b;
    color: #fff;
    padding: 1.5em;
    font-size: 1rem;
    font-weight: 600;
    vertical-align: middle;
    line-height: 1.4;
}

.syutsugan .juken_table-wrapper .table-01 .month,
.syutsugan .juken_table-wrapper .table-01 .day{
    text-align: center;
    vertical-align: middle;
    padding: 4px;
    font-size: 0.875rem;
}

.syutsugan .juken_table-wrapper .table-01 td p,
.syutsugan .juken_table-wrapper .table-01 .prompt-report a{
    padding: 0.5rem;
    line-height: 1.4;
    font-size: 0.9375rem;
}

.syutsugan .juken_table-wrapper .table-01 .prompt-report a{
    display: block;
    background: #eee;
    color: #002f7b;
}
    /* 公開前の表示　.prompt-reportに　クラス名.pre-openを追加すると、リンク無効に */
    .syutsugan .juken_table-wrapper .table-01 .pre-open a{
        pointer-events: none;
        color: #666;
    }

#list__public_general,#list__public_admission,#list__private{
    padding-top: 3rem;
    margin-top: -3rem;
} 

#list__public_general.logout,#list__public_admission.logout,#list__private.logout{
    padding-top: calc(3rem + 280px);
    margin-top: calc(-3rem - 280px);
} 

@media screen and (min-width:768px){
    .syutsugan .juken_table-wrapper .table-01 th{
        font-size: 1.125rem;
    }

    .syutsugan .juken_table-wrapper .table-01 .month,
    .syutsugan .juken_table-wrapper .table-01 .day{
        font-size: 1rem;
    }

    .syutsugan .juken_table-wrapper .table-01 td p,
    .syutsugan .juken_table-wrapper .table-01 .prompt-report a{
        font-size: 1rem;
    }
}

@media screen and (min-width:834px){
    #list__public_general,#list__public_admission,#list__private,
    #list__public_general.logout,#list__public_admission.logout,#list__private.logout{
        padding-top: 0;
        margin-top: 0;
    }
}

/* ------------------------------------------
  詳細ページ (ディレクトリ名はstatus)
------------------------------------------ */
                .syutsugan_status h2{
                    margin-top: 0;
                }                
                .syutsugan_status h4{
                     background: #002f7b;
                    color: #fff;
                    font-size: 18px;
                    padding: 1.5rem 1rem;
                    position: relative;
                }                
                
                
    /*-----------------------
    　ステータスリンクのスタイル
    -------------------------*/
                .syutsugan_status .status_list{
                    width: 100%;
                    display: grid;
                    grid-template-columns:repeat(auto-fit, minmax(178px, 1fr));
                    align-items: stretch;
                    margin-bottom: 2rem;
                    gap:12px;
                }
                
                         @media screen and (min-width:768px){
                            .syutsugan_status .status_list{
                                width: 94%;
                                grid-template-columns:repeat(auto-fit, minmax(110px, 1fr));
                                gap:0;/*gapで横の余白つくると矢印になり、0だと矢羽根に*/
                                
                            }
                        }
                
                /*リンクボタンの共通スタイル*/
                .syutsugan_status .status_list li.status_listitem a{
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    gap:8px;
                    padding: 8px 8px;
                    height: 100%;
                    font-weight: 600;
                    color: #002f7b;
                    position: relative;
                    border: 1px solid #999;
                }

                .syutsugan_status .status_list li.status_listitem p{
                    line-height: 1.3;
                }

                /*必要に応じて折り返し*/
                .syutsugan_status .status_list li.status_listitem p,
                .syutsugan_status .status_list li.status_listitem time{
                    white-space: pre-wrap;
                    word-break: keep-all;
                }

                        @media screen and (min-width:768px){
                                .syutsugan_status .status_list li.status_listitem a{
                                    flex-direction: column;
                                    border: none;
                                    justify-content: flex-start;
                                    text-align: center;
                                    padding: 8px 2px 8px 24px;
                                }
                            }      
                        @media screen and (min-width:834px){
                                .syutsugan_status .status_list li.status_listitem a{
                                    flex-direction: row;
                                }
                            }      

            /*　区分(「受付初日」等)と日付のレイアウト切り替え　*/
                .syutsugan_status .status_list li.status_listitem a .linkinner{
                    width: 100%;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    gap:4px;
                    position: relative;
                    font-size: 15px;
                    font-weight: 600;
                }
                
                        @media screen and (min-width:480px){
                                .syutsugan_status .status_list li.status_listitem a .linkinner{
                                    flex-direction: column;
                                    align-items: flex-start;
                                }
                            }      
                        @media screen and (min-width:768px){
                                .syutsugan_status .status_list li.status_listitem a .linkinner{
                                    flex-direction: column;
                                    align-items: center;
                                    min-width: 4em;
                                    /*max-width: 5.5em;*/
                                    text-align: center;
                                }
                            }      
                
                .syutsugan_status .status_list li.status_listitem.status_listitem time{
                    display: block;
                    font-size: 0.8125rem;
                    font-weight: 400;
                }

                /*下向き小さい三角矢印*/
                .syutsugan_status .status_list li.status_listitem::after{
                    z-index: 2;
                    position: absolute;
                    bottom:-9px;
                    left:50%;
                    transform: translateX(-50%);
                    content: "";
                    display: block;
                    width: 10px;
                    height: 5px;
                    clip-path: polygon(0 0,100% 0,50% 100%);
                    background: #999;
                }
                .syutsugan_status .status_list li.status_listitem:last-child::after{
                    display: none;
                }

                
                        /*右向き小さい三角矢印*/
                         @media screen and (min-width:400px){

                            .syutsugan_status .status_list li.status_listitem::after{
                                z-index: 2;
                                position: absolute;
                                top:50%;
                                bottom: inherit;
                                left:inherit;
                                transform: translate(0,-50%);/*translateY(-50%);*/
                                right: -9px;
                                content: "";
                                display: block;
                                width: 5px;
                                height: 10px;
                                clip-path: polygon(0 0,100% 50%,0 100%);
                                background: #999;
                            }
                            .syutsugan_status .status_list li.status_listitem:last-child::after{
                                display: none;
                            }
                             
                            .syutsugan_status .status_list li.status_listitem.active::after{
                                background: #002f7b;
                            }
                        }
                

                /*矢羽根の先端の三角形*/
                         @media screen and (min-width:768px){
                            .syutsugan_status .status_list li.status_listitem::before{
                                z-index: 1;
                                position: absolute;
                                top:0;
                                transform: translateY(0);
                                right: -16px;/*calc(-16px - 1px)*/
                                content: "";
                                display: block;
                                width: 16px;
                                height: 100%;
                                clip-path: polygon(0 0,100% 50%,0 100%);
                                background: #999;
                            }

                            .syutsugan_status .status_list li.status_listitem::after{
                                z-index: 2;
                                position: absolute;
                                top:0;
                                transform: translateY(0);
                                right: calc(-16px + 1px);/*-16px*/
                                content: "";
                                display: block;
                                width: 16px;
                                height: 100%;
                                clip-path: polygon(0 0,100% 50%,0 100%);
                                background: #fff;
                            }
                            .syutsugan_status .status_list li.status_listitem:last-child::after{
                                display: block;
                            }
                             
                        }



        /*　.open【閲覧可能】リンクのスタイル 　*/
                .syutsugan_status .status_list li.status_listitem.status_listitem.open a{
                    border-top: 1px solid #002f7b;
                    border-right: 1px solid #002f7b;
                    border-bottom: 1px solid #002f7b;
                    border-left: 1px solid #002f7b;
                    background: #d8edf8;
                    color: #002f7b;
                }
                
                        @media screen and (min-width:768px){
                                .syutsugan_status .status_list li.status_listitem.status_listitem.open a{
                                    border-left: none;
                                    border-right: none;
                                }     
                                .syutsugan_status .status_list li.status_listitem.status_listitem.open a:hover{
                                    opacity: 1;
                                    background: #002f7b;
                                    color: #fff;
                                }                  

                                .syutsugan_status .status_list li.status_listitem.status_listitem.open:first-of-type a{
                                    border-left: 1px solid #002f7b;
                                    padding-left: 12px;
                                }
                            
                                .syutsugan_status .status_list li.status_listitem.open::before{
                                    background: #002f7b;
                                }
                                .syutsugan_status .status_list li.status_listitem.open::after{
                                    background: #d8edf8;
                                }
                                .syutsugan_status .status_list li.status_listitem.open:has(a:hover)::before{
                                    background: #d8edf8;
                                }
                            
                                .syutsugan_status .status_list li.status_listitem.open:has(a:hover)::after{
                                    background: #002f7b;
                                }
                            
                    }      
                
        /* .active【選択中】リンクのスタイル */  
                .syutsugan_status .status_list li.status_listitem.status_listitem.active a{
                    border-top: 1px solid #002f7b;
                    border-bottom: 1px solid #002f7b;
                    background: #002f7b;
                    color: #fff;
                }
                .syutsugan_status .status_list li.status_listitem.active::after{
                    background: #002f7b;
                }
                .syutsugan_status .status_list li.status_listitem.active::before{
                    background: #d8edf8;
                }
                .syutsugan_status .status_list li.status_listitem.status_listitem.active a:hover{
                    opacity: 1;
                }
                
        /* .none【非活性】リンクのスタイル */ 
                .syutsugan_status .status_list li.status_listitem.none a{
/*
                    pointer-events: none;
*/
                    border-top: 1px solid #999;
                    border-bottom: 1px solid #999;
                    color: #999;
                }

                /*丸数字のカウント*/
                .syutsugan_status .status_list li.status_listitem{
                    counter-increment: number;
                    position: relative;
                }

                .syutsugan_status .status_list li.status_listitem.none a:hover{
                   opacity: 1;
                }

        /*丸数字のスタイル*/ 
                .syutsugan_status .status_list li.status_listitem a .circle{
                    display: block;
                    width: 24px;
                    height: 24px;
                    aspect-ratio:1/1;
                    background: #002f7b;
                    border: 1px solid #002f7b;/*1px solid #fff*/
                    border-radius: 50%;
                    position: relative;
                }
                .syutsugan_status .status_list li.status_listitem a .circle::after{
                    position: absolute;
                    display: block;
                    content: counter(number);
                    color: #fff;
                    font-size: 12px;
                    font-weight: 600;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%,-50%);
                }

                .syutsugan_status .status_list li.status_listitem a:hover .circle{
                    border: 1px solid #fff;
                }
                .syutsugan_status .status_list li.status_listitem a:hover .circle::after{
                    color: #fff;
                }

        /*【選択中】丸数字のスタイル*/ 
                .syutsugan_status .status_list li.status_listitem.active a .circle{
                    border:1px solid #fff;
                }
                .syutsugan_status .status_list li.status_listitem a .circle::after{
                    position: absolute;
                    display: block;
                    content: counter(number);
                    color: #fff;
                    font-size: 12px;
                    font-weight: 600;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%,-50%);
                }
                
        /*【非活性】丸数字のスタイル*/ 
                .syutsugan_status .status_list li.status_listitem.none a .circle{
                    border:1px solid #999;
                    background: none;
                }
                   
                .syutsugan_status .status_list li.status_listitem.none a .circle::after{
                    /*color: #fff;*/
                    color: #999;
                }



    /*-----------------------
    　倍率上位校リスト、SNSリンク
    -------------------------*/

    .snsbtn-toplistbtn__wrap {
        display: flex; 
        justify-content: flex-start; 
        align-items: flex-start; 
        gap: 1rem; 
        margin: 16px auto; 
        padding:0 16px; 
        flex-direction: column-reverse;
    }
        @media screen and (min-width:768px) {
            .snsbtn-toplistbtn__wrap {
                justify-content: space-between; 
                flex-direction: row;
            }
        }

    /*-----------------------
    　倍率上位校リスト
    -------------------------*/
    .toplist__wrap {
        width: min(100%,862px);
      }

          @media screen and (min-width:768px) {
          .toplist__wrap {
              width: min(96%,600px);
              }
          }

      .toplist__wrap input {
        display: none; /*チェックボックスを隠す*/
      }
      /*バー部分*/
      .toplist__wrap label {
        cursor :pointer;
        display: block;
        text-decoration: none;
        color: #fff;
        font-size: 1em;
        border-radius: 999px;
        line-height: 1;
        position: relative;
        z-index: 0;
        padding: 10px 16px;
        background-color: #555;
        transition: all .2s;
      }
      .toplist__wrap label:hover{
          opacity: 0.6;
      }    
          @media screen and (min-width:768px) {
              .toplist__wrap label {
                  font-size: 1.125em;
                  padding: 10px 24px;
              }
          }

      /*開いたらボタンの形を変える*/
      .toplist__wrap input[type=checkbox]:checked + label:before{
          content:"";
          display:block;
          width: 100%;
          height: 20px;
          background: #555;
          position: absolute;
          bottom: 0;
          left: 0;
          z-index: -1;
      }
      /*デフォルトは非表示*/
      .toplist__wrap #toplist__imgwrap {
        display: none;
        margin: 0;
        padding: 0;
        margin-bottom: 1px;
      }
      /*開いたときに表示*/
      #toplist__btn:checked ~ #toplist__imgwrap {
        display: block;
      }
      .toplist__wrap #toplist__imgwrap img{
        height: 0;
        overflow-y: hidden;
        transition: padding-bottom 0.5s, padding-top 0.5s; /*閉じるときのアニメーション*/
        -webkit-transition: padding-bottom 0.5s, padding-top 0.5s
        -moz-transition: padding-bottom 0.5s, padding-top 0.5s;
        -ms-transition: padding-bottom 0.5s, padding-top 0.5s;
        -o-transition: padding-bottom 0.5s, padding-top 0.5s;
      }
      #toplist__btn:checked ~ #toplist__imgwrap img{
       width: 100%; 
       height: auto;
        object-fit: contain;
        opacity: 1;
        margin-bottom: 20px;
      }
      /*閉じた状態のボタンの矢印描画*/
      .toplist__wrap label:after{
        content:"";
        display:block;
        width:8px;
        height:8px;
        border-top: #fff 2px solid;
        border-right: #fff 2px solid;
        position:absolute;
        right: 16px;
        top: 50%;
        transition: .1s linear;
        -webkit-transform: translateY(-50%) rotate(45deg);
        -ms-transform: translateY(-50%) rotate(45deg);
        transform: translateY(-50%) rotate(45deg);
        margin: auto;
      }
      /*開いた状態のボタンの矢印描画*/
      .toplist__wrap input[type=checkbox]:checked + label:after{
        content:"";
        display:block;
        width:8px;
        height:8px;
        border-top: #fff 2px solid;
        border-right: #fff 2px solid;
        position:absolute;
        right: 16px;
        top: 50%;
        -webkit-transform: translateY(-50%) rotate(135deg);
        -ms-transform: translateY(-50%) rotate(135deg);
        transform: translateY(-50%) rotate(135deg);
        margin: auto;
      }

/* .top__list {
    width: 100%;
    margin-bottom: 40px;
    padding: 0 8px;
}
.toplist__title {
    font-size: 14px;
    font-weight: bold;
    padding: 8px 60px 8px 24px; 
    position: relative;
    cursor: pointer;
}                
.toplist__imgwrap {
    display: none;
}
                
                
.toplist__frame {
    margin: 10px 0;
    border: 1px solid #002f7b;
    background: #d8edf8;
    position: relative;
}   
                
 .toplist__frame .toplist__imgwrap{                               
    font-size: clamp(14px, 1.95cqw, 18px);
    padding: 0 16px 16px; 
    position: relative;
    cursor: pointer;
}
                
                
                
.toplist__title:before {
    content: "";
    position: absolute;
    top: 50%; 
    right: 1rem;
    width: 8px;
    height: 8px;
    border-top: 2px solid #002f7b;
    border-right: 2px solid #002f7b;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg) translateY(-50%);
    transition: all 0.2s linear;
    transform-origin: center;
}
                
.toplist__frame.is-open .toplist__title:before {
    transform-origin: top;
    -webkit-transform: rotate(135deg) translateY(-50%);
    transform: rotate(135deg) translateY(-50%);
}
                
                @media screen and (min-width:768px){
                    .table__headline-area{
                        position: relative;
                    }
                    .toplist__frame{
                            position: absolute;
                            top: 16px;
                            right: 16px;
                            margin: 0;
                            transform-origin: top;
                        }
                } */
                
    .iconwrap{
        display: flex;
        gap:1rem;
        margin-bottom: 1rem;
    }

/*------------------------
一覧（出願状況TOP）へ戻るリンク
------------------------*/
.syutsugan_status .back_syutsugan-top{
    width: 100%;
    text-align: right;
}

.syutsugan_status .back_syutsugan-top a{
    color: #002f7b;
    font-size: 0.875em;
    margin-top: 16px;
    margin-bottom: 16px;
    padding: 0 8px;
    display: inline-block;
}
.syutsugan_status .back_syutsugan-top a:after{
    content: "";
    display: inline-block;
    margin-left: 8px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #002f7b;
    border-right: 1px solid #002f7b;
    transform: rotate(45deg);
}

/*　.headline-area内　*/
.syutsugan_status .headline-area{
    display: flex;
    flex-direction: column;
}
.syutsugan_status .headline-area .back_syutsugan-top a{
    align-self: flex-end;
    margin-top:0;
    margin-bottom: 1rem;
}

/*　.syutsugan_linkwrap内　*/
.syutsugan_status .syutsugan_linkwrap{
    display: flex;
    margin-top: 1rem;
    justify-content: flex-end;
}