@charset "UTF-8";
/*====================================================================
最小サイズ　想定端末　iPhone SE の縦構え（Portrait）　 320×568px
====================================================================*/

html {
-webkit-text-size-adjust: 100%;
}

body {
	margin: 0px;
	padding: 0px;
	font-family: 'M PLUS 1p', sans-serif;
	font-size: 16px;
}

body a {
	cursor: pointer;
	text-decoration: none;
}

label {
	cursor: pointer;
}

.screen-reader-text {
	display: none;
}
h1,h2,h3,h4,h5,h6,h7 {
	font-size: 1em;
}

#wrapper {
	position: relative;
	margin: 0px auto;
	padding: 0px;
}

article {
	position: relative;
	top: 130px;
	max-width: 1500px;
	margin: 0 0 150px 0;
	padding: 0;
	box-sizing: border-box;
}

section {
	margin: 0 0 20px 0;
	padding: 10px 20px;
}
section:after, section:before {
    content: "";
    clear: both;
    display: block;
}


.inner {
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 15px;
}
@media screen and (min-width:768px){
	.inner {
		padding-inline: 34px;
	}
}

.grecaptcha-badge {
	display: none !important;
}
/*------------------- ヘッダー設定 ------------------------*/
header {
	position: absolute;
	top: 0;
	width: 100%;
	height: 130px;
	background-color: #21489C;
}
header > div {
	max-width: 1500px;
    position: relative;
    margin: 0 auto;
    padding: 0;
}


/*------------------- オレンジタブ設定 ------------------------*/
#orange_tabs {
    position: absolute;
    right: 10px;
    height: 40px;
    width: 280px;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-evenly;
}
#orange_tabs a {
    width: 130px;
    height: 35px;
    box-sizing: border-box;
    background-color: #ffffff;
    border-radius: 0 0 8px 8px;
    color: #FF9700;
    text-decoration: none;
    text-align: center;
	font-size: 115%;
	font-weight: 500;
	line-height: 2;
}


/*------------------- ヘッダーロゴ設定 ------------------------*/
#kotogakuen_logo {
	position: absolute;
	left: 20px;
	top: 30px;
}
#kotogakuen_logo a{
	display: block;
	text-indent: 101%;
	overflow: hidden;
	white-space: nowrap;
	width: 210px;
	height: 70px;
	background-image: url("../images/header/logo.png");
	background-repeat: no-repeat;
    background-size: 95%;
    background-position: left bottom;
} 




/*------------------- スマートフォンメニュー設定 ------------------------*/
/*=============================
トグルアイコン設定 1000
=============================*/
#toggle_icon {
    position: absolute;
	z-index: 1000;
    right: 20px;
    top: 65px;
    height: 50px;
    width: 50px;
    border: 3px solid #ffffff;
    box-sizing: border-box;
    margin: 0px;
    padding: 8px;
    transition: all .5s;
}
.btn-trigger {
    position: relative;
    width: 28px;
    height: 27px;
    cursor: pointer;
    box-sizing: border-box;
}
.btn-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #ffffff;
    border-radius: 3px;
}
.btn-trigger, .btn-trigger span {
  display: inline-block;
  transition: all .5s;
  box-sizing: border-box;
}
.btn-trigger span:nth-of-type(1) {
    top: 0;
}
.btn-trigger span:nth-of-type(2) {
    top: 12px;
}
.btn-trigger span:nth-of-type(3) {
    bottom: 0;
}

/*=============================
トグルアイコンの変化設定
=============================*/
.active .btn-trigger span:nth-of-type(1) {
  -webkit-transform: translateY(12px) rotate(-45deg);
  transform: translateY(12px) rotate(-45deg);
  background-color: #b3b3b3;
}
.active .btn-trigger span:nth-of-type(2) {
  opacity: 0;
}
.active .btn-trigger span:nth-of-type(3) {
  -webkit-transform: translateY(-12px) rotate(45deg);
  transform: translateY(-12px) rotate(45deg);
  background-color: #b3b3b3;
}
.active #toggle_icon {
    top: 10px;
	right: 10px;
    border: 3px solid #b3b3b3;
	border-radius: 50%;
}

/*=============================
トグルリスト設定 500
=============================*/
nav#togglemenu {
    z-index: 500;
    display: block;
    position: fixed;
    top: 0;
    right: -280px;
    bottom: 0;
    width: 280px;
    overflow-x: hidden;
    overflow-y: auto;
    transition: all .5s;
    opacity: 0;
	background-color: #21489C;
}
.active nav#togglemenu {
	right: 0;
	opacity: 1;
}


/*=============================
#nav_mask設定 300
=============================*/
#nav_mask {
	z-index: 300;
    display: none;
    transition: all .5s;
}
.active #nav_mask {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .8;
    cursor: pointer;
}


/*=============================
トグルリストの中身設定
=============================*/
.nav_inner ul {
	margin: 60px 0;
	padding: 0;
}
.nav_inner ul li {
	margin: 0;
	padding: 20px;
	list-style: none;
}
.nav_inner ul li+li {
	border-top: 1px solid #ffffff;
}
.nav_inner ul li a {
	text-decoration: none;
	color: #ffffff;
}

.nav_inner ul li.current-menu-item a {
	color: #FFFF00;
}

/*------------------- グローバルメニュー設定 ------------------------*/
	#globalmenu {
		display: none;
	}
	#globalmenu div {
		display: block;
		position: absolute;
        top: 80px;
        left: 300px;
		z-index: 1;
		width: 100%;
		max-width: 1100px;
	}
	#globalmenu .menu {
        display: flex;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        height: 2rem;
	}
	#globalmenu .menu > li {
		list-style: none;
		margin: 0;
		padding: 0 0.5rem;
	}
	#globalmenu .menu li#menu-item-42,
	#globalmenu .menu li#menu-item-48,
	#globalmenu .menu li#menu-item-47 {
		min-width: 12rem;
	}
	#globalmenu .menu li#menu-item-15,
	#globalmenu .menu li#menu-item-54,
	#globalmenu .menu li#menu-item-53,
	#globalmenu .menu li#menu-item-545 {
		min-width: 6rem;
	}

/*↓全てのリスト・リンク共通↓*/
	#globalmenu li {
        list-style: none;
        position: relative;
    }
	#globalmenu .menu li a {
        color: #fff;
        display: block;
        height: 2.5rem;
        line-height: 2.5rem;
        text-align: center;
        text-decoration: none;
        transition: .5s;
        }
	#globalmenu .menu li.current-menu-item a {
		color: #FFFF00;
	}
	
	#globalmenu .menu li.current-menu-item ul.sub-menu li a {
    color: #ffffff;
}
	
	#globalmenu .menu > li+li {
		border-left: 1px solid #fff;
    }
	#globalmenu .menu > li:first-child::before {
		content: none;
	}
	/*↑全てのリスト・リンク共通↑*/

	#globalmenu li li {
    height: 0;
    overflow: hidden;
    transition: all .5s;
}
	#globalmenu li li a {
    border-top: 1px solid #D2DFE9;
	background-color: #21489C;
    color: #fff;	
}
	#globalmenu li:hover > ul > li {
    height: 2.5rem;
    overflow: visible;
}

	#globalmenu ul.sub-menu {
    margin: 0px;
	padding: 0px;
	list-style: none;
	display: flex;
	flex-direction: column;
	}

	#globalmenu li li a:hover {
	color: #21489C;
	background-color: #EBF3FF;
	}

/*------------------- scrollupボタン ------------------------*/

#scrollbutton > div {
	position: fixed;
	height: 40px;
	width: auto;
	right: 30px;
	bottom: 30px;
	z-index: 20000;
}
#scrollup {
    position: absolute;
    right: 0;
    bottom: 10px;
	width: 40px;
	height: 40px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
	background-color: rgba(55,105,212,0.80);
	box-sizing: border-box;
	border-radius: 100%;
}
#scrollup a {
	display: block;
	width: 100%;
	height: 100%;
}
#scrollup a span {
	position: absolute;
	top: 40%;
	left: 25%;
	width: 15px;
	height: 15px;
	border: 2px solid;
    border-color: #ffffff #ffffff transparent transparent;
    transform: rotate(-45deg);
}




/*------------------- フッター設定 ------------------------*/
footer {
    position: relative;
    bottom: 0;
    width: 100%;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
    background-color: #21489C;
}
footer > div {
	max-width: 1500px;
    position: relative;
    margin: 0 auto;
    padding: 0;
}

footer a,
footer small {
    color: #ffffff;
	text-decoration: none;
}
footer small {
	font-size: 112.5%;
}
address {
    color: #ffffff;
	font-style: normal;
	font-weight: 500;
	line-height: 1.5;
	margin: 0 0 40px 0;
}
#schoolname {
	font-size: 187.5%;
}
.adr,
.strechable {
	font-size: 125%;
}

#footermenu ul {
	margin: 0 0 60px 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}
#footermenu ul li {
	list-style: none;
    box-sizing: border-box;
	padding: 2px 1rem;
	margin: 0 0 10px 0;
}
#footermenu ul li:first-child {
	padding-left: 0;
}
#footermenu ul li+li {
	border-left: 1px solid #D8D8D8;
	}
#footermenu ul li.current-menu-item a {
	color: #FFFF00;
}


/*------------------- トップの学年別メニュー設定　sidebar-top.php ------------------------*/
h4.grade {
	background-color: #FF9700;
	font-size: 180%;
	color: #fff;
	text-align: center;
	line-height: 1;
	height: 60px;
	margin: 0;
	padding: 15px 0;
	box-sizing: border-box;
}

h4.grade span {
	font-size: 20px;
}
.list_grade {
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: top 60px center;
	background-size: cover;
	height: 240px;
}
#grade_e1 {
	background-image: url("../images/common/21831309_1200.jpg");
}
#grade_e4 {
	background-image: url("../images/common/31864852_1200.jpg");
}
#grade_j {
	background-image: url("../images/common/14914984_1200.jpg");
}
#grade_s {
	background-image: url("../images/common/19844392_1200.jpg");
}

#grades .sb_gradelist {
	margin: 0 0 20px 0;
	padding: 0;
}
#grades .sb_gradelist ul {
	list-style: none;
	text-align: center;
	margin: 0;
	padding: 0;
}
#grades .sb_gradelist ul li {
	margin: 0;
	padding: 0.5em 0;
}
#grades .sb_gradelist ul li {
	border-bottom: 1px solid #dddddd;
}
#grades .sb_gradelist ul li a {
	color: #666666;
}


/*オプションクラスの背景薄赤*/
#tab_lists ul.menu li:first-of-type,
#grades .sb_gradelist ul li:first-of-type,
.menu-item-439,
.menu-item-243,
.menu-item-440,
.menu-item-247,
.menu-item-255,
.menu-item-444,
.menu-item-441,
.menu-item-442,
.menu-item-246,
.menu-item-244,
.menu-item-488,
.menu-item-489,
.menu-item-479,
.menu-item-487,
.menu-item-468,
.menu-item-478,
.menu-item-486,
.menu-item-469,
.menu-item-480,
.menu-item-490,
.menu-item-494,
.menu-item-495,
.menu-item-941,
.menu-item-1253,
.menu-item-1254
 {
	background-color: #ffefef;
}
/*クラス指導の背景薄青*/
.menu-item-132,
.menu-item-131,
.menu-item-130,
.menu-item-92,
.menu-item-102,
.menu-item-148,
.menu-item-149,
.menu-item-899,
.menu-item-900 {
	background-color: #EBF3FF;
}

/*個別指導の背景薄緑*/
.menu-item-111,
.menu-item-443,
.menu-item-110,
.menu-item-109,
.menu-item-91,
.menu-item-145,
.menu-item-456,
.menu-item-1252
{
	background-color: #F1FFEE;
}




/*------------------- 体験授業バナー ------------------------*/
#trial_banner a > div {
	margin: 0;
	padding: 10px;
	border: 1px solid #666666;
	background-image: url("../images/home/trial_banner.jpg");
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: right bottom 50px;
	background-size: 60%;
}
#trial_left {
	max-width: 450px;
}
#trial_banner h4 {
	color: #1753BC;
	font-size: 94%;
	margin: 0;
	padding: 0;
	text-align: center;
}
#trial_banner span {
    margin: 4px;
    padding: 10px;
	box-sizing: border-box;
	color: #FFFF00;
	font-size: 200%;
	font-weight: bold;
    text-align: center;
    line-height: 1;
	background-color: #1753BC;
	border-radius: 8px;
    display: inline-block;
}

#trial_banner h5 {
	color: #fff;
	background-color: #1753BC;
	margin: 10px 0 0 0;
	padding: 4px;
	text-align: center;
}
#trial_banner h5::after {
	display: inline-block;
	content: '▶︎';
	font-size: 50%;
}


/*------------------- 高桐学園からのお知らせ ------------------------*/
#news_topics {
	background-color: #e9e9e9;
	margin: 20px 0px;
}
#news_topics h2 {
	font-size: 150%;
	background-image: none;
	text-align: left;
	margin: 0 0 10px 0;
	padding: 0;
}
#news_topics h3 {
	text-decoration: underline;
	color: #666666;
	margin: 0;
	padding: 0;
}
#news_topics .date {
	color: #666666;
	margin: 0;
	padding: 0;
}
.news {
	margin: 0 0 20px 0;
	padding: 0;
}
#goto_news_archive {
	background-color: #DCEAFF;
	margin: 0;
	padding: 10px;
}
#goto_news_archive span {
	color: #21489C;
}
#goto_news_archive span::after {
	content: '>>';
	display: inline-block;
}


/*------------------- 4つのバナーエリアsidebar-to_othersの設定 ------------------------*/
#others {
	padding-bottom: 50px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
#others a {
	margin: 4px;
	padding: 0;
	box-sizing: border-box;
	display: block;
	text-indent: 101%;
	white-space: nowrap;
	overflow: hidden;
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: center center;
	width: 280px;
	height: 110px;
	background-size: contain;
    box-shadow: 0 8px 8px -8px hsl(200 50% 20% / 40%);	
}
#to_britannia {
	background-image: url("../images/common/britannia.svg");
}
#to_shodo {
	background-image: url("../images/common/shodokyoshitsu.svg");
}
#to_eiken {
	background-image: url("../images/common/eiken.svg");
}
#to_honyomi {
	background-image: url("../images/common/honyomi.svg");
}

#to_science {
	background-image: url("../images/home/science2022.jpg");
}


/*------------------- sb_pcの設定 ------------------------*/
#sb_pc {
	display: none;
}



/*------------------- コース個別ページの下部きまりエリア ------------------------*/
#banner_form a {
	text-decoration: none;
    transition: all .5s;
}
#banner_form a:hover {
    transform: translate(1px, 1px);
}
#to_form {
	color: #fff;
	text-align: center;
	background-color: #FF9700;
	height: 100px;
	max-width: 500px;
	margin: 0 auto;
	padding: 20px 10px;
	box-sizing: border-box;
	position: relative;
    border-radius: 8px;
	box-shadow: 0 8px 8px -8px hsl(200 50% 20% / 40%);
}
#to_form h6 {
	margin: 0;
	padding: 0;
}
#to_form h7 {
	font-size: 150%;
	margin: 0;
	padding: 0;
	font-weight: bold;
}
#to_form div {
	position: absolute;
	top: 45%;
	right: 5px;
}


/*------------------- sidebar-tabの設定 ------------------------*/
#tab_lists {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#sbtab_ele1,
#sbtab_ele4,
#sbtab_junior,
#sbtab_high {
	width: 23%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
.sbtab_trigger {
	background-color: #FF9700;
	color: #ffffff;
	margin: 0;
	padding: 10px 4px;
	line-height: 1;
	font-size: 80%;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
}
.sbtab_trigger::before {
	display: inline-block;
	content: '▶︎';
	font-size: 50%;
}
.sbtab_trigger span {
	display: none;
}
.sbtab_close {
	color: #ffffff;
	background-color: #FF9700;
	padding: 15px;
	margin: 0;
}
#sbtab_ele1,
#sbtab_ele4,
#sbtab_junior,
#sbtab_high {
	position: relative;
}
#ele1_list,
#ele4_list,
#junior_list,
#high_list {
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    margin: 0;
    padding: 0;
    z-index: 1000;
	text-align: center;
	}
#tab_lists ul {
	margin: 0;
	padding: 0;
}
#tab_lists li {
	list-style: none;
	margin: 0;
	padding: 15px;
	font-size: 125%;
}
#tab_lists li + li {
    border-top: 1px solid #dddddd;
}
#tab_lists li a {
	color: #666666;
}

/*=============================
#tab_mask設定
=============================*/
#tab_mask {
  display: none;
  transition: all .5s;
}
#tab_mask.masked {
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #222222;
  opacity: 0.8;
  cursor: pointer;
}




/*------------------- 個別ページ上部画像の設定 ------------------------*/
.page_image {
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: top 30px center;
	background-size: cover;
	min-height: 200px;
}
.page_image h2 {
	color: #ffffff;
	background-color: #21489C;
	margin: 0;
	padding: 10px;
	font-size: 150%;
	line-height: 1;
	box-sizing: border-box;
	letter-spacing: 0.1rem;
}
.sin_margin {
	margin: 0;
}







/*------------------- メディア切替 ------------------------*/
/*====================================================================
想定端末　小型のAndroid の縦構え（Portrait）　 360×640px
====================================================================*/
@media screen and (min-width:360px) {
    #kotogakuen_logo a{
        width: 220px;
        background-size: 100%;
    } 
	.sbtab_trigger {
		font-size: 100%;
	}
}/*360×640px*/


/*====================================================================
想定端末　iPhone 6~8 の縦構え（Portrait）　 375×667px
====================================================================*/
@media screen and (min-width:375px) {
    #orange_tabs {
        padding: 0px 20px;
        }
    #toggle_icon {
        right: 30px;
        }
	#kotogakuen_logo {
		left: 30px;
        }
	#trial_banner h4 {
		font-size: 115%;
		}
	#trial_banner span {
		font-size: 240%;
		}
	#to_form div {
		right: 20px;
		}
}/*375×667px*/

/*====================================================================
想定端末　pixel2 の縦構え（Portrait）　 411×731px
====================================================================*/
@media screen and (min-width:411px){
	#trial_banner span {
		font-size: 180%;
		}
	#trial_banner span {
		font-size: 280%;
		}
}/*411×731px*/

/*====================================================================
想定端末　iPhone XR, 11, XsMax の縦構え（Portrait）　 414×896px
====================================================================*/
@media screen and (min-width:414px){
}/*414×896px*/




/*====================================================================
想定端末　Surface Duo の縦構え（Portrait）　540×720px
====================================================================*/
@media screen and (min-width:540px){
}


/*↑ここまでスマホ縦（Portrait）
==============================================================================================================================================
↓ここからスマホ横（Landscape）*/

/*====================================================================
想定端末　iPhoneSE の横構え（Landscape）　 568×320px
====================================================================*/
@media screen and (min-width:568px){
	section {
		padding: 10px 50px;
	}
section#goal {
	margin: 0;
	padding: 10px 50px 0px 50px;
}
	#sidebar_lists {
		display: flex;
		justify-content: space-evenly;
		flex-wrap: wrap;
	}
	#grades .sb_gradelist {
		width: 48%;
		margin: 0 4px 10px 4px;
	}
	.strechable {
		display: inline;
		padding-right: 0.5em;
		}
	.page_image {
		height: 300px;
	}
}


/*====================================================================
想定端末　小型のAndroid の横構え（Landscape）　 640×360px
====================================================================*/
@media screen and (min-width:640px){
      #trial_banner a > div {
          background-position: right center;
      }
}


/*====================================================================
想定端末　iPhone 6~8 の横構え（Landscape）　667×375px
====================================================================*/
@media screen and (min-width:667px){
	footer {
		padding: 20px 50px;
	}
}

/*====================================================================
想定端末　iPhone 6~8Plus の横構え（Landscape）　736×414px
====================================================================*/
@media screen and (min-width:736px){
	.sbtab_trigger span {
          display: inline;
          margin-right: 0.5em;
	}
}
/*====================================================================
想定端末　iPhone X, Xs,11Pro の横構え（Landscape）　812×375px
====================================================================*/
@media screen and (min-width:812px){
}/*812×375px*/


/*↑ここまでスマホ横（Landscape）
==============================================================================================================================================
↓ここからタブレット縦（Portrait）*/

/*====================================================================
想定端末　iPad 9.7inch, 10.2inch の縦構え（Portrait） 768×1024px
====================================================================*/
@media screen and (min-width:768px) and (min-height:500px) {
}

/*====================================================================
想定端末　iPad Air, iPad Pro 10.5inch の縦構え（Portrait） 834×1112px
====================================================================*/
@media screen and (min-width:834px) and (min-height:500px) {



}/*834×1112px*/




/*====================================================================
想定端末　iPad Pro 11inch の縦構え（Portrait） 834×1169px
====================================================================*/
@media screen and (min-width:834px) and (orientation: portrait) {

}/*834×1169px*/




/*====================================================================
想定端末　iPad Pro 12.9inch の縦構え（Portrait） 1024×1366px
====================================================================*/
@media screen and (min-width:1024px) {
	#others a {
		width: 220px;
		height: 80px;
	}
  }/*1024×1366px*/

/*↑ここまでタブレット縦（Portrait）
==============================================================================================================================================
↓ここからタブレット横（Landscape）*/






/*====================================================================
想定端末　iPad 9.7inch, 10.2inch の横構え（Landscape） 1024×768px
====================================================================*/
@media screen and (min-width:1024px) and (orientation: landscape) {
		#grades .sb_gradelist {
		width: 23%;
		}
		.page_image {
		height: 400px;
		background-position: center center;
		}
}/*1024×768px*/




/*====================================================================
想定端末　iPad Air, iPad Pro 10.5inch の横構え（Landscape） 1112×834px
====================================================================*/
@media screen and (min-width:1112px) {



}/*1112×834px*/




/*====================================================================
想定端末　iPad Pro 11inch の横構え（Landscape） 1169×834px
====================================================================*/
@media screen and (min-width:1169px) {
}/*1169×834px*/





/*====================================================================
想定端末　iPad Pro 12.9inch の横構え（Landscape） 1366×1024px
====================================================================*/
@media screen and (min-width:1366px) {
}/*1366×1024px*/








/*↑ここまでタブレット横（Landscape）
==============================================================================================================================================
↓ここからPC　＝  マウスポインターがあるという前提、hoverの発想アリ 　*/

/*====================================================================
想定端末　小型のモニター 幅1367px以上
====================================================================*/
@media screen and (min-width:1367px) {
	#toggle_icon,
	#grades,
	#sbtab_area {
		display: none;
	}
	#globalmenu {
		display: block;
	}
	article {
		display: flex;
		margin: 0 auto 150px auto;
	}
	#sb_pc {
		display: block;
		margin: 20px 0 0 0;
		padding: 0;
}
	#sbpc_lists {
        display: flex;
        width: 280px;
        flex-wrap: wrap;
	}
	.sbpc_gradelist {
		width: 100%;
	}
	#sbpc_lists .sbpc_gradelist {
	margin: 0 0 20px 0;
	padding: 0;
    }
    #sbpc_lists .sbpc_gradelist ul {
        list-style: none;
        text-align: center;
        margin: 0;
        padding: 0;
    }
    #sbpc_lists .sbpc_gradelist ul li {
        margin: 0;
        padding: 0.5em 1em;
    }
    #sbpc_lists .sbpc_gradelist ul li {
        border-bottom: 1px solid #dddddd;
    }
    #sbpc_lists .sbpc_gradelist ul li a {
        color: #666666;
		text-decoration: none;
    }
	#sbpc_lists .sbpc_gradelist ul li:first-of-type,
    #sbpc_lists #menu-item-439,
    #sbpc_lists #menu-item-243,
	#sbpc_lists #menu-item-440, 
    #sbpc_lists #menu-item-246,
    #sbpc_lists #menu-item-244, 
	#sbpc_lists #menu-item-444, 
	#sbpc_lists #menu-item-441, 
	#sbpc_lists #menu-item-442,
	#sbpc_lists #menu-item-246,
	#sbpc_lists #menu-item-478,
	#sbpc_lists #menu-item-479,
	#sbpc_lists #menu-item-468,
	#sbpc_lists #menu-item-469,
	#sbpc_lists #menu-item-480,
	#sbpc_lists #menu-item-489,
	#sbpc_lists #menu-item-488,
	#sbpc_lists #menu-item-487,
	#sbpc_lists #menu-item-486,
	#sbpc_lists #menu-item-490,
	#sbpc_lists #menu-item-495,
	#sbpc_lists #menu-item-494
	{
         background-color: #ffefef;
    }
	#sbpc_lists #menu-item-132, 
	#sbpc_lists #menu-item-131, 
	#sbpc_lists #menu-item-130,
	#sbpc_lists #menu-item-92,
	#sbpc_lists #menu-item-102,
	#sbpc_lists #menu-item-148,
	#sbpc_lists #menu-item-149,
	#sbpc_lists #menu-item-899,
	#sbpc_lists #menu-item-900 {
        background-color: #EBF3FF;
	}	
	#sbpc_lists #menu-item-111,
    #sbpc_lists #menu-item-443,
 	#sbpc_lists #menu-item-91,
	#sbpc_lists #menu-item-145, 
	#sbpc_lists #menu-item-456 {
        background-color: #F1FFEE;
    }
    #sbpc_lists .sbpc_gradelist ul li a:hover {
		color: #FF9700;
		text-decoration: underline;
	}
	
	#pc_right {
		width: 1100px;
		padding: 0;
		margin: 20px 0 0 20px;
	}
	#scrollbutton > div {
		right: 50px;
	}
}