@charset "UTF-8";

/*-------------------塾名のスタイル変更------------------------*/
#topAccess + div .heading.block_header_4 .h {
    font-family: 'Noto Sans JP', "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
    color: var(--i_txt_color);
    font-size: 27px!important;
    text-shadow: 2px 2px 1px #d3d3d3;
}

@media screen and (max-width:450px) {
    #topAccess + div .heading.block_header_4 .h {
        font-size: 6vw!important;
    }
}

/*-----------------------------見出し飾り統一---------------------------------*/
.heading.block_header_1::after {
    width: 155px;
    height: 17px;
    top: 46px;
    background-position-x: -18px;
}

.heading.block_header_1.align-center::after {
    left: 50%;
    transform: translateX(-50%);
}

.heading.block_header_1::after {
    position: absolute;
    content: "";
    background-image: url(/common/upload_data/manabikko-schoolcom/image/20221030035935.png);
    background-size: cover;
    background-repeat: no-repeat;
}

/*-------------相談会・説明会・体験学習デザイン変更---------------------------*/
#conference + section .heading.block_header_1::after{
	display:none;
}

#conference + section .heading.block_header_1 p{
	background-color: var(--i_btn_color);
	color: #fff!important;
	padding: 5px 15px!important;
	text-align: center;
	text-shadow: 2px 3px 0 #df5a00;
	box-shadow: 7px 7px 0 #ffca54;
	position: relative;
}

/*-----------------------------月謝の背景---------------------------------*/
#monthly-fee + section {
	background-color: rgb(244, 247, 241);
}


/*-----------------------------塾の特徴カードデザイン変更---------------------------------*/
@media screen and (max-width:520px){
	#topCramSchool + div .inner_item {
		width: 100% !important;
		margin-left:0 !important;
	}
}

@media screen and (min-width:521px) and (max-width:1150px) {
	#topCramSchool + div .inner_item {
		width:46% !important;
		margin-left:4% !important;
	}
}

#topCramSchool + div .heading.block_header_4 .h {
	color: var(--i_txt_color);
	background: linear-gradient(transparent 60%, #ffee7a 60%);
	display: inline-block;
}

#topCramSchool + div .inner_item_img{
	position:relative;
	margin-bottom:20px;
}

@media screen and (max-width:520px) {
	#topCramSchool + div .inner_item_img{
		margin-bottom:7.5vw;
	}
}

@media screen and (min-width:521px) and (max-width:1150px) {
	#topCramSchool + div .inner_item_img{
		margin-bottom:3vw;
	}
}


#topCramSchool + div .inner_item:nth-of-type(1) .inner_item_img::before{
	content:"01";
}

#topCramSchool + div .inner_item:nth-of-type(2) .inner_item_img::before{
	content:"02";
}

#topCramSchool + div .inner_item:nth-of-type(3) .inner_item_img::before{
	content:"03";
}

#topCramSchool + div .inner_item:nth-of-type(4) .inner_item_img::before{
	content:"04";
}

#topCramSchool + div + #topCramSchool + div .inner_item:nth-of-type(1) .inner_item_img::before{
	content:"05";
}

#topCramSchool + div + #topCramSchool + div  .inner_item:nth-of-type(2) .inner_item_img::before{
	content:"06";
}

#topCramSchool + div + #topCramSchool + div  .inner_item:nth-of-type(3) .inner_item_img::before{
	content:"07";
}

#topCramSchool + div + #topCramSchool + div  .inner_item:nth-of-type(4) .inner_item_img::before{
	content:"08";
}

#topCramSchool + div + #topCramSchool + div  .heading.block_header_1::after {
	display:none;
}


#topCramSchool + div .inner_item .inner_item_img::before{
	position:absolute;
	content:"01";
	width:40px;
	height:40px;
	max-width: 60px;
	max-height: 60px;
	color:#fff;
	background-color: #122b88;
	border-radius:50%;
	bottom:-20px;
	left:50%;
	transform:translateX(-50%);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1;
	letter-spacing: 0.1rem;
}

@media screen and (max-width:520px) {
	#topCramSchool + div .inner_item .inner_item_img::before{
		width: 15vw;
		height: 15vw;
		bottom:-7.5vw;
		font-size: 5vw;
	}
}

@media screen and (min-width:521px) and (max-width:1150px) {
	#topCramSchool + div .inner_item .inner_item_img::before{
		width: 6vw;
		height: 6vw;
		bottom:-3vw;
		font-size: 2.2vw;
	}
}

/*-----------------------------塾の特徴の丸画像デザイン変更---------------------------------*/
#topCramSchool2 + div .inner_item{
	padding: 20px 0 0 0;
}

@media screen and (max-width: 860px) {
	#topCramSchool2 + div .inner_item{
		padding: 10vw 0 0 0;
	}
}

#topCramSchool2 + div .inner_item_img {
	padding-top: 80%;
	width: 80%;
	margin-bottom: -40px;
}

#topCramSchool2 + div .inner_item_img img {
	border:4px solid var(--i_btn_color);
}

#topCramSchool2 + div .heading.block_header_4 {
	position: relative;
	top: -280px;
}

@media screen and (max-width:480px) {
	#topCramSchool2 + div .heading.block_header_4 {
		position: relative;
		top: -70vw;
	}
}

@media screen and (min-width:481px) and (max-width: 860px) {
	#topCramSchool2 + div .heading.block_header_4 {
		position: relative;
		top: -34vw;
	}
}

#topCramSchool2 + div .heading.block_header_4 .h {
	width: 36vw;
	max-width: 280px;
	background-color: var(--i_btn_color);
	color: #fff;
	padding: 5px;
	text-align: center;
	font-size: 25px!important;
	text-shadow: 2px 3px 0 #df5a00;
	box-shadow: 7px 7px 0 #ffca54;
	position: relative;
}

@media screen and (max-width:375px) {
	#topCramSchool2 + div .heading.block_header_4 .h {
		width: 63vw;
		font-size: 20px!important;
		left: 20px;
	}
}

@media screen and (min-width:376px) and (max-width:480px) {
	#topCramSchool2 + div .heading.block_header_4 .h {
		width: 62vw;
		font-size: 25px!important;
		left: 20px;
	}
}

@media screen and (min-width:481px) and (max-width: 680px) {
	#topCramSchool2 + div .heading.block_header_4 .h {
		width: 42vw;
		font-size: 22px!important;
	}
}

/*-----------------------------Blog背景にペンのや消しゴムのイラスト---------------------------------*/
@media screen and (max-width: 670px) {
	#topBlog + div.pb80{
		padding-top: 110px!important;
		padding-bottom: 100px!important;
	}
}

#topBlog + div >  .content_wrapper::before{
	position:absolute;
	content:"";
	background-image:url("/common/upload_data/manabikko-schoolcom/image/20221031070001.png");
	background-size:cover;
	background-repeat:no-repeat;
	width:150px;
	height:150px;
	top:0;
	left:0;
	z-index: -1;
}

@media screen and (max-width: 670px) {
	#topBlog + div >  .content_wrapper::before{
		top:-80px;
		left:10px;
		width:80px;
		height:80px;
	}
}

@media screen and (min-width:671px) and (max-width: 800px) {
	#topBlog + div >  .content_wrapper::before{
		top:-40px;
		left:10px;
		width:100px;
		height:100px;
	}
}

@media screen and (min-width:801px) and (max-width: 990px) {
	#topBlog + div >  .content_wrapper::before{
		top:-50px;
		left:10px;
		width:100px;
		height:100px;
	}
}

#topBlog + div > .content_wrapper .heading.block_header_1::before{
	position:absolute;
	content:"";
	background-image:url("/common/upload_data/manabikko-schoolcom/image/20221031070003.png");
	background-size:cover;
	background-repeat:no-repeat;
	width:150px;
	height:186px;
	top:0;
	right:0;
	z-index: -1;
}

@media screen and (max-width: 670px) {
	#topBlog + div > .content_wrapper .heading.block_header_1::before{
		top:-90px;
		right:0;
		width:80px;
		height:100px;
	}
}

@media screen and (min-width:671px) and (max-width: 800px) {
	#topBlog + div > .content_wrapper .heading.block_header_1::before{
		top:-40px;
		right:0;
		width:100px;
		height:125px;
	}
}

@media screen and (min-width:801px) and  (max-width: 990px) {
	#topBlog + div > .content_wrapper .heading.block_header_1::before{
		top:-50px;
		right:0;
		width:100px;
		height:125px;
	}
}

#topBlog + div > .content_wrapper::after{
	position:absolute;
	content:"";
	background-image:url("/common/upload_data/manabikko-schoolcom/image/20221031070004.png");
	background-size:cover;
	background-repeat:no-repeat;
	width:150px;
	height:150px;
	right:0;
	bottom:-78px;
	z-index: -1;
}

@media screen and (max-width: 670px) {
	#topBlog + div > .content_wrapper::after{
		width:80px;
		height:80px;
		right:20px;
		bottom:-90px;
	}
}

@media screen and (min-width:671px) and  (max-width: 990px) {
	#topBlog + div > .content_wrapper::after{
		width:100px;
		height:100px;
		right:20px;
		bottom:-78px;
	}
}

/*-----------------------------タイトル左右に斜め線---------------------------------*/
.heading.block_header_1 .diagonal_line {
    position: relative;
    margin: 0 40px;
}

.heading.block_header_1 .diagonal_line::before,
.heading.block_header_1 .diagonal_line::after{
    content:"";
    border-top: 3px solid #122b88;
    height: 0;
    width: 40px;
    display: block;
    padding: 0!important;
    position: absolute;
    top: 26%;
}

.heading.block_header_1 .diagonal_line::before{
    transform: rotate(45deg)!important;
    left: -50px;
}

.heading.block_header_1 .diagonal_line::after{
    transform: rotate(135deg)!important;
    right: -50px;
}

@media screen and (max-width: 800px){
    .heading.block_header_1 .diagonal_line::before,
    .heading.block_header_1 .diagonal_line::after{
        width: 30px;
        top: 22%;
    }

    .heading.block_header_1 .diagonal_line::before{
        left: -35px;
    }

    .heading.block_header_1 .diagonal_line::after{
        right: -35px;        
    }

}

/*-----------------------------見出しにクレヨン波線---------------------------------*/
.heading.block_header_1 p {
    padding-bottom:30px!important;
}

.heading.block_header_1::after{
    position:absolute;
    content:"";
    background-image:url("/common/upload_data/manabikko-schoolcom/image/20221030035935.png");
    background-size:cover;
    background-repeat: no-repeat;
}

.heading.block_header_1.align-center::after{
    left: 50%;
    transform: translateX(-50%);
}

.heading.block_header_1.align-left::after{
    left:0;
}

#topNews + div .heading.block_header_1::after{
    width: 155px;
    height: 17px;
    top: 46px;
    background-position-x: -18px;
}

@media screen and (max-width: 800px){
    #topNews + div .heading.block_header_1::after{
        width: 118px;
        height: 13px;
        top: 46px;
        background-position-x: -18px;
    }
}

#con01 + div .heading.block_header_1::after{
    width: 179px;
    height: 17px;
    top: 46px;
    background-position-x: -5px;
}

@media screen and (max-width: 800px){
    #con01 + div .heading.block_header_1::after{
        width: 135px;
        height: 13px;
        top: 46px;
        background-position-x: -5px;
    }
}

#topCourse + section .heading.block_header_1::after{
    width: 179px;
    height: 17px;
    top: 46px;
    background-position-x: -5px;
}

@media screen and (max-width: 800px){
    #topCourse + section .heading.block_header_1::after{
        width: 135px;
        height: 13px;
        top: 46px;
        background-position-x: -5px;
    }
}

#para01 + section .heading.block_header_1::after{
    width: 224px;
    height: 16px;
    top: 48px;
}

@media screen and (max-width: 800px){
    #para01 + section .heading.block_header_1::after{
        width: 224px;
        height: 16px;
        top: 48px;
    }
}

@media screen and (max-width: 591px){
    #para01 + section .heading.block_header_1::after{
        width: 224px;
        height: 16px;
        top: 80px;
    }
}

#topCramSchool + div .heading.block_header_1::after{
    width: 155px;
    height: 16px;
    top: 46px;
    background-position-x: -16px;
}

@media screen and (max-width: 800px){
    #topCramSchool + div .heading.block_header_1::after{
        width: 107px;
        height: 12px;
        top: 46px;
        background-position-x: -20px;
    }
}

#topFaq + div .heading.block_header_1::after{
    width: 259px;
    height: 18px;
    top: 46px;
    background-position-x: 1px;
}

@media screen and (max-width: 800px){
    #topFaq + div .heading.block_header_1::after{
        width: 180px;
        height: 13px;
        top: 48px;
        background-position-x: 1px;
    }
}

#topBlog + div .heading.block_header_1::after{
    width: 224px;
    height: 16px;
    top: 48px;
}

@media screen and (max-width: 800px){
    #topBlog + div .heading.block_header_1::after{
        width: 224px;
        height: 16px;
        top: 48px;
    }
}

@media screen and (max-width: 486px){
    #topBlog + div .heading.block_header_1::after{
        width: 224px;
        height: 16px;
        top: 80px;
    }
}

#topAccess + div .heading.block_header_1::after{
    width: 155px;
    height: 17px;
    top: 46px;
    background-position-x: -18px;
}

@media screen and (max-width: 800px){
    #topAccess + div .heading.block_header_1::after{
        width: 109px;
        height: 12px;
        top: 46px;
        background-position-x: -18px;
    }
}

/*-----------------------------MV下にペンのライン---------------------------------*/
#topLine + section .inner_item_img a{
	pointer-events: none;
}

#topLine + section .content_wrapper{
	padding:0!important;
	max-width:initial!important;
}

/*-----------------------------見出しにペンのアイコン---------------------------------*/
#con01 + div .inner_item .inner_item_txt .h{
	position:relative;
	display: inline-block;
	margin-left: 20px;
}

#con01 + div .inner_item .inner_item_txt .h::before{
	content:"";
	position:absolute;
	background-image:url("/common/upload_data/manabikko-schoolcom/image/20221029110823.png");
	background-size:cover;
	width:20px;
	height:18px;
}

#con01 + div .inner_item:nth-of-type(1) .inner_item_txt .h::before{
	top:11px;
	left:-25px;
}
#con01 + div .inner_item:nth-of-type(2) .inner_item_txt .h::before{
	top:11px;
	left:-15px;
}
#con01 + div .inner_item:nth-of-type(3) .inner_item_txt .h::before{
	top:11px;
	left:-25px;
}


@media screen and (max-width: 700px) {
	#con01 + div .inner_item:nth-of-type(1) .inner_item_txt .h::before{
		top:8px;
		left:-25px;
	}
	#con01 + div .inner_item:nth-of-type(2) .inner_item_txt .h::before{
		top:8px;
		left:-25px;
	}

	#con01 + div .inner_item:nth-of-type(3) .inner_item_txt .h::before{
		top:7px;
		left:-25px;
	}
}

@media screen and (min-width: 701px) and (max-width:1239px) {
	#con01 + div .inner_item:nth-of-type(1) .inner_item_txt .h::before{
		top:11px;
		left:-2vw;
	}
	#con01 + div .inner_item:nth-of-type(2) .inner_item_txt .h::before{
		top:11px;
		left:-1.8vw;
	}

	#con01 + div .inner_item:nth-of-type(3) .inner_item_txt .h::before{
		top:11px;
		left:-2vw;
	}
}

@media screen and (min-width: 1240px) {
	#con01 + div .inner_item:nth-of-type(1) .inner_item_txt .h::before{
		top:11px;
		left:-25px;
	}
	#con01 + div .inner_item:nth-of-type(2) .inner_item_txt .h::before{
		top:11px;
		left:-13px;
	}

	#con01 + div .inner_item:nth-of-type(3) .inner_item_txt .h::before{
		top:11px;
		left:-25px;
	}
}
/*-----------------------------平均月謝で毎日通塾に文言追加---------------------------------*/
.inner_item_txt_note{
	font-size: 1.2rem;
	margin:10px 0 0;
	text-align:left;
}

/*-----------------------------画像の角を丸く---------------------------------*/
#topIntroduction + section .inner_item_img img,
#topLinkCard01 + div .inner_item_img,
#topCramSchool + div .inner_item_img img,
#topCourse + section .inner_item_img img,
#topCourse2 + section .inner_item_img img,
#con01 + div .inner_item_img > img{
	border-radius: 5px;
}

#topLinkCard01 + div .inner_item_txt .pwrap{
	border-radius: 0 0 5px 5px;
}


/*-----------------------------2連バナーの背景色変更---------------------------------*/
#topLinkCard01 + .composite_box01.block_images_11 .inner_item_txt .heading{
      background-color: #A8E173 !important;
}