@charset "utf-8";
@import"/common/css/base.css";
@import"/common/css/contents.css";

/*--------------------------------------------------------------------*/
/* 東大に本気で合格したいあなたへ
/* 京大入試問題の真実
--------------------------------------------------------------------- */

/* override
--------------------------------------------------------------------- */
#main div.section {
	margin-bottom: 50px;
}

@media screen and (max-width:480px) {
	#main div.section {
		margin-bottom: 30px;
	}
}

/* common
--------------------------------------------------------------------- */
#main.tokusetsu { padding:0 40px; }

#main.tokusetsu .mb25 { margin-bottom: 25px; }
.tokusetsu .mt30 { margin-top:30px; }

@media screen and (max-width:768px) {
	.tokusetsu .no-tb {
		display: none;
	}
	
	#main.tokusetsu .pht_right.tb_w40 {
		width: 40%;
	}
}
@media screen and (max-width:480px) {
	#main.tokusetsu .pht_right.sp_w100 {
		float: none;
		width: 100%;
		margin: 0 0 1em 0;
	}
}

/*--- h3 茶色見出し ---*/
.tokusetsu .h3_brown {
	margin-bottom: 25px;
	padding: 5px 15px;
	background:#752B24;
	color:#fff;
	font-size:160%;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
@media screen and (max-width:480px){
	.tokusetsu .h3_brown {
		margin-bottom: 15px;
		font-size: 2rem;
		line-height: 1.4;
	}
}


/*--- L型デザイン見出しベース（茶色） ---*/
.tokusetsu .lmidashi {
	margin-bottom: 20px;
	border-bottom: 2px solid #752B24;
	font-size: 130%;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
.tokusetsu .lmidashi span {
	display: inline-block;
	margin-bottom: 2px;
	padding: 5px 0 3px 16px;
	border-left: 10px solid #752B24;
	line-height: 1.4;
}
@media screen and (max-width:480px){
	.tokusetsu .lmidashi {
		margin-bottom: 10px;
		font-size: 1.8rem;
	}
	.tokusetsu .lmidashi span {
		padding-left: 8px;
		border-left-width: 8px;
	}
	.tokusetsu .lmidashi .no-pc {
		display: inline;
	}
}

/*--- 丸付き見出し ---*/
.marumidashi {
	margin-bottom: 0.8em;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.4;
	text-indent: -1.4em;
	margin-left: 1.4em;
}
.marumidashi:before {
	content: "\25CF"; /* ● */
	margin-right: 0.4em;
	vertical-align: middle;
}

/*--- テキスト ---*/
.tokusetsu .con_txt { padding:0 20px; }
@media screen and (max-width:480px){
	.tokusetsu .con_txt { padding: 0; }
}


/* メイン
--------------------------------------------------------------------- */
.tokusetsu h2 { margin-bottom:25px; }
.tokusetsu .lead {
	margin: 40px 0!important;
	color: #666;
	font-size: 160%;
	text-align: center;
	line-height: 2;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
@media screen and (max-width:580px){
	.tokusetsu .lead { font-size:140%; line-height:1.5; }
}
@media screen and (max-width:480px){
	.tokusetsu .lead {
		font-size: 1.9rem;
		line-height: 1.5;
	}

}

/* 東大入試に必要な学力とは？
--------------------------------------------------------------------- */
.tokusetsu .math_pink { margin: 30px 0; padding: 15px; line-height: 200%; font-weight: bold; background-color: #FFDFDF; }
.tokusetsu .math_gray { margin: 30px 0; padding: 15px; background-color: #E0E0E0; }
.tokusetsu .math_gray .math_ttl {
	border: solid 2px #555;
	padding: 3px 8px;
	margin-bottom: 15px;
	display: inline-block;
	font-size: 17px;
}
.tokusetsu .answer_img{ width: 300px;}
@media screen and (max-width:480px){
	.tokusetsu .answer_img{ width: 100%;}
	.tokusetsu .sp_small{font-size: 85%;}
}

/* 京大入試に必要な学力とは？
--------------------------------------------------------------------- */
.tokusetsu .math_55 { font-weight: bold; color: #CC0000; background-color: #FFDDDD; }
.tokusetsu .math_class { font-weight: bold; color: #006600; background-color: #D8FDC4; }


/* 特選Vクラス
--------------------------------------------------------------------- */
/*--- L型デザイン見出し---*/
#vclass .lmidashi {
	border-bottom-color: #00873c;
}
#vclass .lmidashi span {
	border-left-color: #00873c;
}

/*--- 丸付き見出し ---*/
#vclass .marumidashi {
	color: #00873c;
}

/*--- 科目紹介 ---*/
#vclass .subject_frame {
	border: 3px solid #00873c;
	margin-bottom: 25px;
	padding: 15px 20px 10px;
	position: relative;
}
#vclass .subject_frame:last-child {
	margin-bottom: 45px;
}

#vclass .subject_frame .subject_name {
	font-size: 115%;
	background: url("/university/common/images/tokusetsu/tokusetsu_class_icon.png") no-repeat left top 50%;
	padding-left: 45px;
	margin-bottom: 0.6em;
}

#vclass .subject_frame .koma {
	position: absolute;
	top: 17px;
	right: 20px;
	padding: 4px 7px 2px;
	color: #fff;
	font-size: 90%;
	font-weight: bold;
	line-height: 1.0;
	background-color: #00873c;
}

#vclass .subject_frame .koma + p {
	font-size: 95%;
}

#vclass .subject_frame dl dt {
	display: inline-block;
	float: left;
	margin-right: 1em;
	padding: 2px;
	border: 2px solid #00873c;
	color: #00873c;
	line-height: 1.0;
	font-size: 95%;
	font-weight: bold;
}
#vclass .subject_frame dl dd {
	margin-left: 4em;
	margin-bottom: 0.7em;
	font-size: 95%;
}
#vclass .subject_frame dl dd.letter3 {
	margin-left: 5em;
}

@media screen and (max-width:480px){
	#vclass .subject_frame {
		margin-bottom: 20px;
		padding: 15px 15px 10px;
	}
	#vclass .subject_frame:last-child {
		margin-bottom: 35px;
	}
	#vclass .subject_frame .subject_name {
		font-size: 1.8rem;
	}
#vclass .subject_frame .koma {
		position: static;
		margin-bottom: 0.8em;
		padding: 7px 8px 5px;
		font-size: 100%;
	}
	#vclass .subject_frame dl dt {
		display: block;
		float: none;
		margin: 0 0 0.5em 0;
		padding: 4px 8px;
		font-size: 1.5rem;
	}
	#vclass .subject_frame dl dd,
	#vclass .subject_frame dl dd.letter3 {
		margin-left: 0;
	}
}


/* 55段階個別指導
--------------------------------------------------------------------- */
/*--- L型デザイン見出し---*/
#kobetsu55 .lmidashi {
	border-bottom-color: #bf000a;
}
#kobetsu55 .lmidashi span {
	border-left-color: #bf000a;
}

/*--- 丸付き見出し ---*/
#kobetsu55 .marumidashi {
	color: #bf000a;
}

/*--- 段階別学習 ---*/
#kobetsu55 .dankaibetsu {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	counter-reset: dankaibetsu-counter;
	margin-bottom: 10px;
}
#kobetsu55 .dankaibetsu li {
	box-sizing: border-box;
	width: 415px;
	margin-bottom: 25px;
	padding: 24px 20px 20px 24px;
	font-size: 95%;
	border: 3px solid #bf000a;
	background-color: #fef1e9;
	position: relative;
}
#kobetsu55 .dankaibetsu li:before {
	content: counter(dankaibetsu-counter);
	counter-increment: dankaibetsu-counter;
	position: absolute;
	top: 0;
	left: 0;
	padding: 5px 7px;
	color: #fff;
	font-weight: bold;
	line-height: 1.0;
	background-color: #bf000a;
}

#kobetsu55 .dankaibetsu li .pht_right {
	margin: 0 0 0 0.8em;
}
@media screen and (max-width:768px){
	#kobetsu55 .dankaibetsu li {
		width: 48%;
	}
	#kobetsu55 .dankaibetsu li img {
		max-width: 50%;
	}
	#kobetsu55 .dankaibetsu li:first-child img {
		max-width: 60%;
	}
}

@media screen and (max-width:480px){
	#kobetsu55 .dankaibetsu li {
		width: 100%;
		margin-bottom: 15px;
	}
	#kobetsu55 .dankaibetsu li .pht_right {
		float: right;
		width: auto;
	}
}


/*--- 55段階個別指導が強い理由 ---*/
/* ラベル見出し */
#kobetsu55 .labelmidashi {
	margin-bottom: 1.5em;
	padding: 0.6em 0;
	border: 2px solid #bf000a;
	font-size: 100%;
	color: #bf000a;
	line-height: 1.0;
}
#kobetsu55 .labelmidashi span {
	margin-right: 1.2em;
	padding: 0.6em 1.5em;
	background-color: #bf000a;
	color : #fff;
}
@media screen and (max-width:480px){
	#kobetsu55 .labelmidashi {
		padding: 0 0 0.8em;
		text-align: center;
		font-size: 1.7rem;
	}
	#kobetsu55 .labelmidashi span {
		display: block;
		margin: 0 0 0.8em;
	}
}

/* イメージ画像 */
@media screen and (max-width:480px){
	#main img.img_tokusetsu_kobetsu55_kiban {
		max-width: 40%;
		margin-left: 10px;
	}
}


/*--- 理由3つ ---*/
#kobetsu55 .reason1 {
	display: flex;
	justify-content: space-between;
	margin-bottom: 40px;
}
#kobetsu55 .reason1 li {
	width: 31.5%;
	border: 1px solid #f60;
}
#kobetsu55 .reason1 li dt {
	padding: 3px 0;
	color: #fff;
	font-weight: bold;
	text-align: center;
	background-color: #f60;
}
#kobetsu55 .reason1 li dd {
	padding: 15px 20px;
	font-size: 95%;
}
@media screen and (max-width:480px){
	#kobetsu55 .reason1 {
		display: block;
		margin: 0 10px 25px;
	}
	#kobetsu55 .reason1 li {
		width: 100%;
		margin-bottom: 15px;
	}
	#kobetsu55 .reason1 li dd {
		padding: 15px;
	}
}


/* インタビュー
--------------------------------------------------------------------- */
.voice {
	margin-bottom: 40px;
}
@media screen and (max-width:480px){
	.voice {
		margin-bottom: 30px;
	}
}


/*--- プロフィール ---*/
.voice_prof {
	background-color: #5caad5;
	height: 225px;
	position: relative;
	margin-bottom: 20px;
}
.voice_prof:after {
	clear: both;
	content: "";
	display: block;
	height: 0;
}
.voice_prof .interviewee dt {
	float: left;
	margin-right: 35px;
}
.voice_prof .interviewee dd {
	color: #fff;
}
.voice_prof .interviewee .univ {
	display: inline-block;
	margin: 35px 0 27px;
	padding: 3px 7px;
	color: #5caad5;
	background-color: #fff;
	font-weight: bold;
}
.voice_prof .interviewee .course {
	margin-top: 25px;
	font-size: 90%;
}
@media screen and (max-width:768px){
	.voice_prof {
		height: auto;
	}
	.voice_prof .interviewee dt {
		margin-right: 15px;
		width: 40%;
	}
	.voice_prof .interviewee .univ {
		margin: 15px 0;
	}
	.voice_prof .interviewee .course {
		margin-top: 15px;
	}
}
@media screen and (max-width:480px){
	.voice_prof {
		height: auto;
		padding-bottom: 15px;
		margin-bottom: 15px;
	}
	.voice_prof .interviewee dt {
		float: none;
		margin-right: 0;
		width: 100%;
	}
	.voice_prof .interviewee dt img {
		width: 100%;
	}
	.voice_prof .interviewee dd {
		margin: 15px 15px 0 15px;
	}
	.voice_prof .interviewee .univ {
		margin: 15px 15px 0 15px;
		padding: 2px 7px;
	}
	.voice_prof .interviewee .course {
		margin-top: 10px;
	}
}

/* インタビュアープロフィール */
.voice_prof .interviewer {
	position: absolute;
	bottom: 10px;
	right: 10px;
	padding: 10px;
	font-size: 80%;
	background-color: #fff;
	width: 200px;
	box-sizing: border-box;
}
.voice_prof .interviewer dt {
	float: left;
	margin-right: 10px;
}
.voice_prof .interviewer .interviewer_prof {
	margin-top: 0.3em;
	font-size: 85%;
	line-height: 1.2;
}
@media screen and (max-width:768px){
	.voice_prof .interviewer {
		position: static;
		clear: both;
		padding: 10px 0 0 0;
		width: 100%;
	}
}
@media screen and (max-width:480px){
	.voice_prof .interviewer {
		position: static;
		margin: 15px auto 0;
		padding: 10px;
		width: 92%;
		font-size: 1.3rem;
		line-height: 1.4;
	}
	.voice_prof .interviewer .interviewer_prof {
		margin-top: 0.2em;
	}
}

/*--- サブタイトル ---*/
.voice .voice_subtitle {
	font-size: 120%;
	font-weight: bold;
	color: #752b24;
	margin: 2em 0 1em;
}
.voice .voice_subtitle:first-child {
	margin-top: 0;
}
@media screen and (max-width:480px){
	.voice .voice_subtitle {
		font-size: 1.8rem;
		line-height: 1.6;
	}

}

/*--- インタビュー記事 ---*/
.voice p {
	margin-left: 3em;
	text-indent: -3em;
	line-height: 1.7;
}
.voice p span {
}
.voice_interviewer {
	color: #1b87af;
}

.voice .voice_photo {
	float: right;
	text-indent: 0;
	margin-left: 20px;
}
@media screen and (max-width:480px){
	.voice .voice_photo {
		float: none;
		margin-left: 0;
		text-align: center;
	}
}


/* 対策クラスのご案内
--------------------------------------------------------------------- */
.tokusetsu .taisaku_class_area .h3_brown {
	margin-bottom: 0;
}

.tokusetsu .taisaku_class_area .h3_brown + .con_txt {
	border: 1px solid #752B24;
	padding-top: 18px;
}

.tokusetsu .taisaku_class { width:635px; margin:30px auto; }
.tokusetsu .taisaku_class li { float:left; width:205px; margin-right:10px; }
.tokusetsu .taisaku_class li:last-child { margin:0; }

@media screen and (max-width:720px){
	.tokusetsu .taisaku_class { width:100%; }
	.tokusetsu .taisaku_class li { width:32%; margin-right:2%; }
}
@media screen and (max-width:480px){
	.tokusetsu .taisaku_class_area .h3_brown + .con_txt {
		padding: 15px 15px 0;
	}
	
	.tokusetsu .taisaku_class li { width:100%; float:none; margin:0 0 10px; text-align:center; }
}
