@charset "utf-8";

/* base ------------------------*/
#wrapper { position:relative; overflow:hidden; }
.inner { width:100%; max-width:1000px; margin:0 auto; }

/* common------------------------*/
#content { padding-bottom:70px; }

 nav .nav_sp_menu span {
    font-size: .5em;
  }

.instruction_book {
	font-family:
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
    "メイリオ", "Meiryo","游ゴシック", "Yu Gothic", YuGothic,s
    Osaka, sans-serif;
}

/* bg */
.bg_blue { background:#dbeffc; }
.bg_hogan { background:url("../img/bg_hogan.png") repeat; margin-top:30px; padding:60px 80px 80px; position:relative; }
.bg_hogan::before { content:""; position:absolute; top:0; left:0;
	border-bottom:5em solid transparent; border-left:5em solid #dceffd; }

/* check_list */
.check_list { margin-top:25px; }
.check_list li { padding-left:30px; font-size:1.125em; position:relative; }
.check_list li + li { margin-top:30px; }

/* instruction ---------------- */
.instruction_book { margin-top:0; padding:10px 0 30px; background:#dceffd; }
.instruction_book .book_list + .book_list { margin-top:60px; }

.instruction_book .book_list .img_box { width:20%; }
.instruction_book .book_list .lead_box { position: relative; width:75%; }

.book_d { margin-top:20px; padding:20px 52px 40px; border:1px solid #7d7d7d; }

/* marker */
.sugaku_marker { background: linear-gradient(transparent 65%, #b8d2ed 65%); }
.eigo_marker { background: linear-gradient(transparent 65%, #f1ccd8 65%); }
.rika_marker { background: linear-gradient(transparent 65%, #cbdbbe 65%); }
.shakai_marker { background: linear-gradient(transparent 65%, #ddc3dc 65%); }
.kokugo_marker { background: linear-gradient(transparent 65%, #f5d3b9 65%); }
.joho_marker { background: linear-gradient(transparent 65%, #e5e5e5 65%); }


/* ================================================================
  レスポンシブ
=================================================================== */
/* 959以下 (タブレット以下) */
@media screen and (max-width:959px) {
	
	body { font-size:15px; }
	.inner { max-width:100%; width: auto; margin: 0 15px; }

	/* bg_hogan */
	.bg_hogan { padding:40px; }
	.bg_hogan::before { border-bottom:2em solid transparent; border-left:2em solid #dceffd; }
}

/* 767以下 (タブレット以下) */
@media only screen and (max-width: 767px) {
    nav .nav_sp_menu a.is_open::after {
        font-size: .5em;
    }
}

/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width:599px){
	
	body { font-size:14px; }

	/* common ---------------- */
	#contents { margin-top:50px; }

	/* bg_hogan */
	.bg_hogan { padding:40px 15px; }

	/* instruction ---------------- */

	.instruction_book .bg_hogan { margin-top:30px; padding:40px 15px; }
	.instruction_book .book_list .img_box { width:60%; margin:auto; }

	.instruction_book .book_list .lead_box { width:100%; margin-top:30px; }
	.instruction_book .book_list .lead_box .ttl span { font-size:1.6em; }

	.book_d { padding:10px 15px 25px; }
}

/* ================================================================
共通テストページ
=================================================================== */
/* lead_box */
.kyotsutest .instruction_book .lead_box .text_button > li span {
	padding : 1em 3em;
	border : 1px solid #3174ba;
	margin: 0.5em;
	font-weight: 600;
	display: inline-block;
	background: #dceffd;
}

.kyotsutest .instruction_book .book_list .lead_box .ttl span { display:block; font-size:1.875em; color:#333; }
.kyotsutest .instruction_book .book_list .lead_box .icon { display:block; margin-bottom: 1.5em; }
.kyotsutest .instruction_book .book_list .lead_box .icon span {
	background-color:#3174ba;
	color: #fff;
	padding: 5px 15px;
	font-size:1.875em;
	border-radius: 10px;
}
.kyotsutest .instruction_book .book_list .lead_box .icon_eigo span { background-color:#de4f84; }
.kyotsutest .instruction_book .book_list .lead_box .icon_rika span { background-color:#4db459; }
.kyotsutest .instruction_book .book_list .lead_box .icon_shakai span { background-color:#a34796; }
.kyotsutest .instruction_book .book_list .lead_box .icon_kokugo span { background-color:#ea5f0c; }
.kyotsutest .instruction_book .book_list .lead_box .icon_joho span { background-color:#3c3c3c; }

/* check_list */
.kyotsutest .check_list li::before { 
   position:absolute;
   content:"";
   width:7px;
   height:12px;
   border-right:2px solid #3174ba;
   border-bottom:2px solid #3174ba;
   display:inline-block;
   left:0;
   top:0.3em;
   transform:rotateZ(45deg);
}

.kyotsutest .check_list_eigo li::before { border-right:2px solid #de4f84; border-bottom:2px solid #de4f84; }
.kyotsutest .check_list_rika li::before { border-right:2px solid #4db459; border-bottom:2px solid #4db459; }
.kyotsutest .check_list_shakai li::before { border-right:2px solid #a34796; border-bottom:2px solid #a34796; }
.kyotsutest .check_list_kokugo li::before { border-right:2px solid #ea5f0c; border-bottom:2px solid #ea5f0c; }
.kyotsutest .check_list_joho li::before { border-right:2px solid #3c3c3c; border-bottom:2px solid #3c3c3c; }

/* text_button */
.kyotsutest .naiyou_box .text_button {
	display: flex;
    flex-wrap: wrap;
}

.kyotsutest .naiyou_box .text_button > li {
	position: relative;
    width:25%;
}

.kyotsutest .naiyou_box .text_button > li a {
	display: block;
    position: relative;
    padding : 1em 2em;
	border : 1px solid #3174ba;
	margin: 0.5em;
	background: #fff;
    text-decoration: none;
    text-align: center;
}

.kyotsutest .naiyou_box .text_button > li a span {
	font-weight: 600;
}

.kyotsutest .naiyou_box .text_button > li a:hover {
	background: #dceffd;
}

/* 改訂マーク */
.kyotsutest .naiyou_box .text_button li span.kaitei {
	display: block;
	position: absolute;
	content: "";
	top: 8px;
    left: 8px;
	width: 3em;
	aspect-ratio: 1 / 1;
	background: linear-gradient(to top left, transparent 50%, #ffda5e 50%);
	pointer-events: none;
	z-index: 1;
}

.kyotsutest .naiyou_box .text_button li span.kaitei > span {
	display: inline-block;
	color: #d80707;
	font-weight: 600;
	font-size: 0.8em;
	margin: 5px 0 0 3px;
	transform: rotate(-45deg);
}

/* スマホ対応 */
@media screen and (max-width:599px){
  .kyotsutest .instruction_book .book_list .lead_box .icon span {
	font-size:1.55em;
	}
	
  .kyotsutest .instruction_book .book_list .lead_box .text_button {
	  text-align: center;
	}
	
  .kyotsutest .check_list li { 
	font-size: 1.1em;
	}
	
  .kyotsutest .instruction_book .book_list .lead_box .ttl span {
	font-size:1.5em;
	}
    
  .kyotsutest .naiyou_box .text_button > li {
        width:100%;
    }
	
}