@charset "shift-jis";
/* CSS Document */


/* 大阪初芝学園 トップページ専用CSS
--------------------------------------------------------------------------
【共通】
◎メイン使用色
　 （メインブルー）#0063A4　
   （文字色）#333333　
--------------------------------------------------------------------------
--------------------------------------------------------------------------
11px = 85%		12px = 93%		13px = 100%		14px = 108%
15px = 116%		16px = 123.1%	17px = 131%		18px = 138.5%
19px = 146.5%	20px = 153.9%	21px = 161.6%	22px = 167%
23px = 174%		24px = 182%		25px = 189%		26px = 197%
-------------------------------------------------------------------------- */


@media all and (max-width: 576px) {
	#mainimage .inner {
		width: 100%;
	}
}

/* ----------------------------------------------------------------------
学校リンク
------------------------------------------------------------------------- */

#schoolLink{
	background-image: url(./img/bg-schoollink.gif);
	padding-top: 20px;
	padding-bottom: 20px;
	margin-bottom: 10px;
}

#schoolLink p{
	text-align: center;
	margin-bottom: 10px;
}

#schoolLink li{
	float: left;
	width: 16.1%;
	margin-right: 3px;
	margin-left: 2px;
}

@media all and (max-width: 576px) {
	
	#schoolLink{
		width: 100%;
		padding: 0;
		margin-bottom: 6.25%;
	}
	
	#schoolLink .inner {
		width: 100%;
	}
}



/* ----------------------------------------------------------------------
ニュース
------------------------------------------------------------------------- */

/* 背景ブルー枠 */
#news{
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #BFBBA2;
	margin-bottom: 10px;
}

#newsBG{
	background-image: url(./img/img-index_03.jpg);
	background-repeat: no-repeat;
	background-position: 0px center;
	width:90%;
	min-width: 1000px; /* 最小幅 */
	max-width: 1300px; /* 最大幅 */
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

/* 背景白枠 */
#newsBox{
	background-color: #ffffff;
	height: 120px;
	width: 82%;
	overflow-x: hidden;
	overflow-y: scroll;
	padding: 10px;
	margin-left: 16.5%;
}

#news dt{
	font-weight: bold;
}

#news dd{
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px dotted #999;
}
#news dd .title {
	font-weight: bold;
}


@media all and (max-width: 576px) {
	
	/* 背景ブルー枠 */
	#news{
		width: 100%;
		margin-top: -4.25%;/* 2% */
		margin-bottom: 6%;
	}

	#newsBG{
		background-image: url(./img/img-index_03.jpg);
		background-repeat: no-repeat;
		background-position: 6% top;
		background-size: 30% auto;
		width:100%;
		padding-top: 18%;
		min-width: 1px; /* 最小幅 */
	}

	/* 背景白枠 */
	#newsBox{
		width: 90.5%;
		height: auto;
		margin: 0 auto;
		overflow-x: hidden;
		overflow-y: auto;
		padding: 4.4%;
		box-sizing: border-box;
	}

}


/* ----------------------------------------------------------------------
メインコンテンツ
------------------------------------------------------------------------- */

.maininnner{
	overflow: auto;/* customScroll */
	height: 250px;
}


/*--------------------
	お知らせ
--------------------*/

#Topics{
	background-color: #FFF;
	float: left;
	width: 75%;
	padding: 0.76%;
	margin-right: 10px;
	border: 1px solid #CCCCCC;

}
#Topics h2{
	margin-bottom: 20px;
	margin-top: 10px;
}

#Topics #Topics-Element {
	padding: 0 10px;
}

#Topics li{
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
	background-image: url(./common/img/icon-yajirushi-black.gif);
	background-repeat: no-repeat;
	background-position: 0px 3px;
	margin-bottom: 20px;
	line-height: 1.4em;
	padding-left: 10px;
	font-size: 93%;
	padding-bottom: 5px;
}


#Topics .icon-redyajirushi{
	float: right;
}


/*--------------------
	学園ブログ
--------------------*/

#Gakuenblog{
	background-color: #FFF;
	float: left;
	width: 37%;
	margin-right: 10px;
	border: 1px solid #CCCCCC;
	padding-top: 10px;
	padding-right: 0.76%;
	padding-bottom: 28px;
	padding-left: 0.76%;
}

#Gakuenblog h2{
	margin-bottom: 20px;
	margin-top: 10px;
}

#Gakuenblog #gakuenblog-Element {
	padding: 0 10px;
}

#Gakuenblog #gakuenblog-Element li{
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
	background-image: url(./common/img/icon-link.gif);
	background-repeat: no-repeat;
	background-position: 0px 3px;
	margin-bottom: 20px;
	line-height: 1.4em;
	padding-left: 20px;
	font-size: 93%;
	padding-bottom: 5px;
}

#Gakuenblog #gakuenblog-Element li:last-child {
	margin-bottom: 0;
}


/* バナー */
#bn{
	float: right;
	width: 19%;
}

#bn p{
	margin-bottom: 5px;
}

.bn-pdf{
	font-size: 85%;
	text-align: center;
	margin-top: 20px;
}


@media all and (max-width: 576px) {
	
	.maininnner{
		height: 250px;
		margin-right: -5px;/* スクロールバー位置調整 */
	}

	/*--------------------
	お知らせ
	--------------------*/
	
	#Topics{
		float: none;
		width: 100%;
		margin-bottom: 6.8%;
		padding: 4.4%;
		margin-right: 0;
		border: 1px solid #CCCCCC;
		box-sizing: border-box;
	}
	
	#Topics h2{
		margin-top: 0;
		margin-bottom: 5%;
	}

	#Topics #Topics-Element,
	#Gakuenblog #gakuenblog-Element {
		padding: 0 10px 0 5px;
	}
	
	#Topics li,
	#Gakuenblog #gakuenblog-Element li {
		padding-bottom: 0.7em;
		margin-bottom: 0.7em;
	}
	
	#Topics .icon-redyajirushi{
		margin-top: 1.5em;
	}

	
	/*--------------------
		学園ブログ
	--------------------*/
	
	#Gakuenblog{
		float: none;
		width: 100%;
		margin-bottom: 17.2%;
		padding: 4.4%;
		margin-right: 0;
		border: 1px solid #CCCCCC;
		box-sizing: border-box;
	}

	#Gakuenblog h2{
		margin-top: 0;
		margin-bottom: 5%;
	}

	#Gakuenblog #gakuenblog-Element {
		padding: 0 10px 0 5px;
	}


	/* バナー */
	#bn{
		float: none;
		width: 255px;
		margin: 0 auto;
		padding-bottom: 14.75%;
	}

	#bn p + p {
		margin-top: 4%;
		margin-bottom: 0;
	}

}



/*--------------------
	カスタムスクロール
--------------------*/


.mCSB_scrollTools {
	width: 10px; /* スクロールデザインの幅 */
}

.mCSB_inside>.mCSB_container {
	margin-right: 10px; /* スクロールデザインの幅 */
}

.mCSB_scrollTools .mCSB_draggerRail {
	background: #dcdcdc;
	width: 10px;
	border-radius: 0;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	width: 10px;
	background: #c0c0c0;
	border-radius: 0;
	padding: 0;
	margin: 0;
	border-radius: 20px;
}

.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
	background: #ccc;
}

/* スクロールの箱の高さ*/
.scroll_window1 {
	max-height: 230px;
	height: 230px;
	overflow-y: hidden;
	border: 1px solid #ccc;
}

.scroll_inner {
	padding: 1rem 4%;
}

@media all and (min-width: 768px) {
	
	.scroll_inner {
		padding: 1rem 2%;
	}
}