/*********
*******************************************:
注意 スマホ、タブレットファースト
@media screen and (min-width: rem);
30rem=480px以上/基本48rem=768以上/59rem=944px以上/基本64rem=1024以上/特殊65rem=1040以上
remについて＜1px=0.05rem。100px=5rem ablogのデフォ設定 例：9rem=180px＞
キーカラー：#264875 #0048A9 #003379
color:#2B2B2B;
該当ページ：コース紹介や学校行事、証明書発行など、イレギュラーなページ構成にあてたcss
*******************************************:
*********/


.pageTopBox1{
   margin: 0 0 1rem; 
}
.p_indent{text-indent: 1em;}
.P_mawarikomiR{
    margin: 0 0 0.6rem 0;

}
.mawarikomi_Release::after{
    content: "";
    display: block;
    clear: both;
}


/****************************************************/
/*開智未来教育活動助成金趣意書*/
/****************************************************/
.kifushyui{font-size:1rem;font-weight:700;}
.kifushyui > span.span1{
    display:block; padding: 0rem 0rem 0rem 2.6rem;
}
.kifushyui span{display: block;}
.kifushyui > span.span2{
    text-align:center; padding: 1rem 0rem; 0rem 0rem;
}
.kifushyui > span.span3{
    text-align:left; padding: 1rem 0rem 1rem 2rem;
}
.kifushyui > span.span4{
    text-align:center;
}

.kifushyuiImg img{display: block; margin: 0 auto;}

@media screen and (min-width: 48rem) {
.kifushyui{font-size:1.2rem;font-weight:700;}
.kifushyuiImg{width: 5.5rem;}
.P_mawarikomiR{
    float:right;
    margin: 1rem 0 1rem 1rem;
}

.kifushyuiImg{width: 13.5rem;}
}
@media screen and (min-width: 64rem) {

}

/****************************************************/
/*開智未来教育活動助成金趣意書*/
/****************************************************/
/*校長メッセージ*/
.buck-visual-Uentry { /*未使用　背景画像セットで改良が必要　.mainや.acms-containerBで調整必要　*/
    background: no-repeat;
    background-size: cover;
    background-position: top;
}

/* ------------------------------
　　施設紹介　マップ用
------------------------------ */
#argMap img{ display: none;}
#argMap {
    margin: 1.5rem 0;
    height: 15rem;
    background: url("../images/kousya1.jpg") center top / contain no-repeat ;    
}

@media screen and (min-width: 48rem) {
#argMap img{ display:block;}
#argMap {
    margin: 2rem 0;
    height: 25rem;
    background: url("../images/kousya1.jpg") center top / contain no-repeat ;   
}

}
@media screen and (min-width: 64rem) {
#argMap {
    height:auto;
	margin: 2rem 0;
    max-width:645px;
	background: url(../images/kousya1.jpg) 0 0 no-repeat;
}
}

/* ------------------------------
　　中等部　コース紹介
------------------------------ */
.headerBox1M{ margin: 3.5rem 0 2rem;}/*二個目のヘッダー用*/
.headerBox1{
    text-align: center;
    padding: 1rem 1.5rem;
    background-color: #254D85;
    width: 100%;
    box-sizing: border-box;
}
.headerBox1 > h1 {
    position: relative;
    padding: 0.4rem 0 0.15rem !important ;
    margin: 0 0 0.6rem 0 !important ;
    font-weight: bold !important ;
    font-size: 1.4rem !important ;
    color: #fff !important ;
}
    .headerBox1 > h1 span.midashirow1{
        font-size:0.6rem ;
        font-weight: normal;
        margin-top: 0.5rem;
        display: block;
        letter-spacing: 0.2rem;
    }
.headerBox1 > h1::before {
    position: absolute;
    border-bottom: 1px solid #fff;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    content: '';
}
.headerBox1_p1 {font-size: 1.1rem}
.headerBox1_p2 {font-size: 0.9rem}
.headerBox1 > p{color: #fff;}

.j_course1Box1{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;          
    -ms-flex-wrap    : wrap;
    flex-wrap        : wrap;
    padding: 0 !important ;
    margin: 1.5rem 0rem 0rem !important ;
}
.j_course1Box1 li{width: 100%; display:block; padding: 3.2rem 0rem 1.7rem;}
.j_course1Box1 li:nth-child(2){width: 100%; padding: 0rem 0rem 0rem;}
.j_course1Box1 > li > h2{
    border:none !important ;
    margin: 0 !important ;
    padding:3.5rem 0 0 0 !important ;
    font-size: 1.2rem !important ;
}
.j_course1,.j_course2,.S_course1,.S_course2 {position: relative;}
.j_course1 span.SpanText1,.S_course1 span.SpanText1 {font-size: 0.6rem; display: block;}
.S_course1 span.SpanText2,.S_course2 span.SpanText2 {font-size: 1rem; display: block;}
.j_course1::before {
    position: absolute;
    top:-6rem;
    left: -1.1rem;
    transform: scale(0.4);
}
    .j_course1::before {
        content: url(../images/img122.webp);
    }
.S_course1::before {
    position: absolute;
    top:-4rem;
    left: -4.1rem;
    transform: scale(0.4);
}
    .S_course1::before {
        content: url(../images/img133.webp);
    }
.j_course2::before {
    position: absolute;
    top:-4rem;
    left: -1.2rem;
    transform: scale(0.4); 
}
    .j_course2::before {
        content: url(../images/img123.webp);
    }
.S_course2::before {
    position: absolute;
    top:-4rem;
    left: -1.2rem;
    transform: scale(0.4); 
}
    .S_course2::before {
        content: url(../images/img134.webp);
    }

@media screen and (min-width: 48rem) {
.headerBox1M{ margin: 4.5rem 0 2.5rem;}
.headerBox1{
    padding: 1.7rem 2.7rem;
}
.headerBox1 > h1 {
    padding: 0.5rem 0 2rem !important ;
    margin: 0 0 1rem 0 !important ;
    font-weight: bold !important ;
    font-size: 2rem !important ;
}
    .headerBox1 > h1 span.midashirow1{
        margin-top: -0.3rem;
        font-size: 0.7rem ;
    }    
.headerBox1_p1 {font-size: 1.5rem}
.headerBox1_p2 {font-size: 1.1rem}
.j_course1Box1{
    -webkit-flex-wrap: nowrap;          
    -ms-flex-wrap    : nowrap;
    flex-wrap        : nowrap;
    padding: 0 !important ;
    margin: 1.5rem 0rem  0rem !important ;
}
.j_course1Box1 li{width: 50%; display:block; padding: 1.5rem 1.2rem 1rem 0rem;}
.j_course1Box1 li:nth-child(2){width: 50%; padding: 1.5rem 0rem 0rem 1.2rem;}
.j_course1Box1 > li > h2{
    padding:0 0 0 5rem  !important ;
    font-size: 1.1rem !important ;
}
.j_course1::before {
    top:-3.5rem;
    left: -8.5rem;
    transform: scale(0.2);
}
.S_course1::before {
    top:-3.5rem;
    left: -10.2rem;
    transform: scale(0.18);
}
.j_course2::before {
    top:-3.5rem;
    left: -8.5rem;
    transform: scale(0.2); 
}
.S_course2::before {
    top:-3.5rem;
    left: -8.4rem;
    transform: scale(0.18); 
}
}

@media screen and (min-width: 64rem) {
.headerBox1M{ margin: 12rem 0 3rem;}
.headerBox1{
    padding: 2rem 4rem;
}
.headerBox1 > h1 {
    padding: 0.5rem 0 2rem !important ;
    margin: 0 0 2rem 0 !important ;
    font-weight: bold !important ;
    font-size: 2rem !important ;
}
    .headerBox1 > h1 span.midashirow1{
        font-size: 1.1rem ;
        margin-top: -0.5rem;
    }    
.headerBox1_p1 {font-size: 2rem}
.headerBox1_p2 {font-size: 1.2em}
.j_course1Box1 li{width: 50%; display:block; padding: 2.6rem 1.5rem 1.5rem 0rem;}
.j_course1Box1 li:nth-child(2){width: 50%; padding: 2.6rem 0rem 0rem 1.5rem;}
.j_course1Box1 > li > h2{
    padding:0 0 0 10rem  !important ;
    font-size: 1.5rem !important ;
}
.j_course1 span.SpanText1,.S_course1 span.SpanText1 {font-size: 0.7rem; display: block;}
.S_course1 span.SpanText2,.S_course2 span.SpanText2 {font-size: 1rem; display: block;}
.j_course1::before {
    top:-2.5rem;
    left: -6.5rem;
    transform: scale(0.4);
}
.S_course1::before {
    top:-2.2rem;
    left: -7.5rem;
    transform: scale(0.36); 
}
.j_course2::before {
    top:-1.8rem;
    left: -6.5rem;
    transform: scale(0.4);
}
.S_course2::before {
    top:-2rem;
    left: -6.5rem;
    transform: scale(0.36); 
}
}
@media screen and (min-width: 65rem) {
.j_course1Box1 > li > h2{
    font-size: 1.7rem !important ;
}    
}


/* ------------------------------
　　学校行事　3カラム for PC
------------------------------ */
.fbox3{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    padding: 1.5rem 0 0 0 !important;
    margin: 2rem 0 2rem 0 !important;
    list-style: none;
    gap: 30px 3px;
}
.fbox3Second{margin-top: 2.5rem !important;}
.fbox3_inner{
    width:  calc((100% / 2) - 6px); 
    display: block;
    padding:0;
    margin: 0;
    min-height: 10rem;
    position: relative;
    box-sizing: border-box;
}
    .fbox3_inner::before{
        font-size: 10rem;
        position: absolute;
        top: -3rem;
        right: 0%;
        z-index: 10;
        opacity: 0.07;
        color: #264875;
        transform: rotate(-10deg);
        -moz-transform: rotate(-10deg);
        -webkit-transform: rotate(-10deg);
    }
    .m4::before{
        content: "4";
    }
    .m5::before{
        content: "5";
    }
    .m6::before{
        content: "6";
    }
    .m7::before{
        content: "7";
    }
    .m8::before{
        content: "8";
    }
    .m9::before{
        content: "9";
    }
    .m10::before{
        content: "10";
    }
    .m11::before{
        content: "11";
    }
    .m12::before{
        content: "12";
    }
    .m1::before{
        content: "1";
    }
    .m2::before{
        content: "2";
    }
    .m3::before{
        content: "3";
    }
ul.j_event{
    padding:1rem 0rem 1rem;
    margin: 0;
    list-style: none;
    position: relative;
}
ul.j_event li{position: relative;}
ul.j_event li::after{
      content: "";
      position: absolute;
      left: 0.3rem;
      top: 0.8rem;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      -moz-border-radius: 50%;
      -webkit-border-radius: 50%;
      background-color:#003379;
}
ul.j_event li:first-child::after{content: none;}
ul.j_event li:first-child {
    position: absolute;
    right:0.5rem;
    top:-2.2rem;
    font-size: 1rem;
    z-index: 20;
    padding: 0; margin: 0;
}
    h2.tuki{
        color: #003379;/*94FF00*/
        padding: 0;
        margin: 0;
        border-bottom: 2px solid #003379;/*94FF00*/
        transform: rotate(5deg);
        -moz-transform: rotate(5deg);
        -webkit-transform: rotate(5deg);
    }
ul.j_event li:nth-child(n+2){
    z-index: 30;
    padding:0.3rem 0.5rem 0.1rem 1rem;
    letter-spacing:0.07rem;
    font-size: 0.8rem;
}

@media screen and (min-width: 48rem) {
.fbox3{
    padding: 2rem 0 0 0 !important;
    margin: 3rem 0 2.7rem 0 !important;
    gap: 20px 10px;
}
.fbox3Second{margin-top: 4rem !important;}
.fbox3_inner{
    width:  calc((100% / 2.88) - 20px); 
}
    .fbox3_inner::before{
        font-size: 11rem;
        top: -2.5rem;
        right: 10%;
    }
ul.j_event{
    padding:1.3rem 0rem 1.3rem;
}
ul.j_event li::after{
      left: -0.3rem;
      top: 0.7rem;
      width: 7px;
      height: 7px;
}
ul.j_event li:first-child {
    right: 2.5rem;
    top:-2.5rem;
    font-size: 1.2rem;
}

ul.j_event li:nth-child(n+2){
    letter-spacing:0.1rem;
    font-size: 0.9rem;
}
}
@media screen and (min-width: 64rem) {
.fbox3{
    padding: 2.5rem 0 3rem 0 !important;
    margin: 3.5rem 0 3.5rem 0 !important;
    gap: 20px 15px;
}
.fbox3Second{margin-top: 5.2em !important;}
.fbox3_inner{
    width:  calc((100% / 2.88) - 30px); 
}
    .fbox3_inner::before{
        font-size: 16rem;
        top: -5rem;
        right: 15%;
    }
ul.j_event{
    padding:1.5rem 0rem 0rem 2rem;
}
ul.j_event li::after{
      left: -0rem;
      top: 0.9rem;
      width: 8px;
      height: 8px;
}
ul.j_event li:first-child {
    right: 4rem;
    top:-3.5rem;
    font-size: 1.5rem;
}

ul.j_event li:nth-child(n+2){
    font-size: 1rem;
}
}
span.attention01{
    background-color: #003379;
    color: #fff;
    padding: 0.1rem 0.2rem;
}
span.attention02{
    background-color: #003379;
    color: #fff;
    padding: 0.25rem 0.45rem;
}
/* ------------------------------
　　学校行事 生徒の一日　レイアウトボックス　4、３、２カラム for PC
------------------------------ */
.fboxXimg{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none;
    font-size: 0.7rem;
    letter-spacing: 0.06rem;
}
.fboxXimg_gapTopMargin{margin-top: 0 !important;}
.fboxXimg_gapTopMargin2_5{margin-top: 1.5rem !important;}
.fb4img{
    gap: 10px;
}
.fb3img{
    gap: 10px;
}
.fb2img{
    gap: 10px;
}
    .fb2img_rowgap{
    gap: 0.7rem 10px ;
    }
.fb1img{
    gap: 0px;
}
.fboxXimg li{
    display: block;
    padding:0 0 0.8rem 0;
    margin: 0;
    box-sizing: border-box; font-size: 0.6rem;
}
.fboxXimg li img{
    border-radius: 5px;
}
.fboxXimg li span.cap1{/*画像キャプション*/
    display: block;
    padding: 0.2rem 0 0 0;
}
.fboxXimg li span.cap2{/*画像キャプション*/
    padding: 0.2rem 0 0 0; font-size: 0.7rem;
        display: block;
}
.fboxXimg_text1{text-align: center;}
.fb4img li{
    width:  calc((100% / 2) - 20px); 
}
.fb3img li{
    width:  calc((100% / 1)) - 20px); 
}
.fb2img li{
    width:  calc((100% / 1)) - 20px); 
}
.fb1img li{
    width:  calc(100% / 1); 
}
@media screen and (min-width: 48rem) {
.fboxXimg_gapTopMargin{margin-top: 10px !important;}
.fboxXimg_gapTopMargin2_5{margin-top: 3rem !important;}
.fboxXimg li span.cap1{display: block; padding: 0.5rem 0.5rem 0 0; font-size: 0.9rem;}
.fboxXimg li span.cap2{
    padding: 0.5rem 0.5rem 0 0; font-size: 0.9rem;
}
.fboxXimg_text1{ font-size: 1.3rem;}
.fb4img li{
    width:  calc((100% / 2) - 20px); 
}
.fb3img li{
    width:  calc((100% / 3) - 20px); 
}
.fb2img li{
    width:  calc((100% / 2) - 20px); 
}
    .fb2img_rowgap{
    gap: 2rem 10px ;
    }
}
@media screen and (min-width: 64rem) {
.fboxXimg{font-size: 0.8rem;}
.fboxXimg_gapTopMargin2_5{margin-top: 4rem !important;}
.fboxXimg li span.cap1{display: block; font-size: 1rem;}
.fboxXimg_text1{ font-size: 1.4rem;}
.fb4img li{
    width:  calc((100% / 4) - 20px); 
}
.fb3img li{
    width:  calc((100% / 3) - 20px); 
}
.fb2img li{
    width:  calc((100% / 2) - 20px); 
}
    .fb2img_rowgap{
    gap: 2.5rem 10px ;
    }
}

/****************************************************/
/*各種証明書の発⾏について*/
/****************************************************/
.certi_section1 h3{
    color:#003379;
    font-size: 1.1rem;
}
.certi_h4{font-size: 1rem; margin-bottom: -0.5rem; margin-top: 1.5rem;}
.certi_section1 p{font-size: 0.8rem;}

.certi_top{padding: 1rem 0 0;}
.certi_a1 {text-decoration:underline; font-size: 1.0rem; color:#003379; }
.certi_a2 {text-decoration:underline; color:#0BB300; }
.certi_span1{padding-left: 1.0rem;}
.certi_span2{padding-left: 0.4rem;}
.certi_span3{padding-left: 1.4rem;}
.certi_span4{padding-left: 2rem;}



.certi_section1 table.certi_tbl01 th {
    background: #003379;
    border: solid 1px #ccc;
    color: #fff;
    padding: 0.3rem;
    font-size: 0.8rem;
}
.certi_section1 table.certi_tbl01 td {
    border: solid 1px #ccc;
    padding: 0.7rem 0.4rem;
    text-align: center;
    font-size: 0.8rem;
}
.certi_section1 table.certi_tbl01 {
    display: block;
    overflow-x: scroll;
    white-space: nowrap;
}

.certi_list-9 {
    list-style-type:none;
    padding: 0;
    margin: 0;
}
.certi_list-9 li {
    padding: .5rem;
}
.certi_list-9 li:not(:last-child) {
    border-bottom: 1px solid #ccc;
}
.tbl01Width70 {width: 100%;}


@media screen and (min-width: 48rem) {
.certi_section1 h3{font-size: 1.2rem;}
.certi_h4{font-size: 1.2rem; margin-bottom: -1rem; margin-top: 2rem;}
.certi_section1 p{font-size: 0.9rem;}
.certi_top{padding: 3rem 0 0;}
    .certi_section1 table.certi_tbl01 th {
        padding: 0.6rem;
        font-size: 1rem;
        font-size: 0.9rem;
    }
    .certi_section1 table.certi_tbl01 td {
        padding: 1rem 0.7rem;
        font-size: 0.9rem;
    }
.tbl01Width70 {width: 80%;}
}


@media screen and (min-width: 64rem) {
.certi_h4{font-size: 1.3rem; margin-bottom: -1rem; margin-top: 3rem;}
.certi_section1 p{font-size:1rem;}
.certi_top{padding: 4rem 0 0;}
.certi_a1 {font-size: 1.2rem;}
.certi_span1{padding-left: 1.2rem;}
.certi_span2{padding-left: 0.6rem;}
.certi_span3{padding-left: 1.7rem;}
.certi_span4{padding-left: 3rem;}
    
    .certi_section1 table.certi_tbl01 th {
        font-size: 1rem;
    }
    .certi_section1 table.certi_tbl01 td {
        font-size: 1rem;
    }
    .certi_section1 table.certi_tbl01 {
        display:block;
        overflow-x:visible;
        white-space:normal;
    }
.tbl01Width70 {width: 70%;}
    
.certi_list-9 li {
    padding: .5rem;
}
    
}