@charset "utf-8";
/*---------- ページ全体の指定 ----------*/
/*--文字sans-serif指定しないとサファリでメイリオならず--*/
body {
  display: grid;
  grid-template-columns: 1fr 30px 600px 30px 300px 30px 1fr;
  grid-template-rows: [headercolor]auto [header]auto [globalnavi]auto [row-breadcrumb]40px [sutema]50px [clearfix]400px [article-aside]auto [footer]auto;
  background-color: #f3f3f3;
  z-index: -1;
  margin: 0;
  font-family: "メイリオ", sans-serif;
  color: #1c1c1c;
  text-size-adjust: none;
  -webkit-text-size-adjust: none; /*スマホでスライダーを配置したときに、スライダー内の文字サイズが大きくなる（解決まで激消耗）だが手元の書籍に書いてあった（汗）https://cly7796.net/blog/smartphone/when-you-place-a-slider-in-the-smartphone-site-character-size-increases/*/
}

.fa-tiktok{
	color: #000000;
	border-radius: 25%;
/*	background: linear-gradient(90deg, #FE2C55 0%, #FE2C55 50%, #25F4EE 50%, #25F4EE 100%);*/
	opacity: 0.7;
margin-left: 2px;
}
	/*赤系color: #FD6481;*/
	/*緑系color: #25F4EE;*/
.x{
	height: 18px;
	width: 18px;
	vertical-align: sub;
	filter: invert(1);
	background: #f3f3f3;
	border-radius: 50%;
	
}
#pageBody .mainVisual ul li a {
  font-size: 20px;
}
.aka {
  color: #FF7474;
}
.row-breadcrmb {
  display: inherit;
  grid-column: 3/-3;
  grid-row: row-breadcrumb;
  padding: 5px;
  font-size: 14px;
  align-items: center;
}
.breadcrumb {
  margin: 0;
  padding: 0;
  list-style: none;
}
.breadcrumb li {
  display: inline; /*横に並ぶように*/
  list-style: none;
  font-weight: bold; /*太字*/
}
.breadcrumb li:after {
  /* ▶を表示*/
  content: '＞';
  padding: 0 .3em;
  color: gray;
}
.breadcrumb li:last-child:after {
  content: '';
}
.breadcrumb li a {
  text-decoration: none;
  color: gray;
}
.breadcrumb li:first-child a:before {
  /*家アイコン*/
  font-weight: normal;
  font-size: 1.1em;
  /*  color: #2e7fea;*/
}
.breadcrumb li a:hover {
  text-decoration: underline;
}
.sutema {
  display: inherit;
  grid-column: 3/-3;
  grid-row: sutema;
  align-items: center;
  color: #9E0000;
  font-size: 15px;
  padding: 0 5px;
}
img {
  max-width: 100%;
  height: auto;
  border: 0;
  vertical-align: bottom;
}
.white { /*超重要：他のパーツにgrid-rowを設定しないと効かない*/
  grid-column: 2/-2;
  grid-row: 1/-1;
  background-color: #ffffff;
  z-index: -1;
}
.white-character{
	color: #ffffff;
}
.fa-paperclip {
  color: #29C8AD;
  margin-right: 8px;
}
/*更新するボタン*/
#koushinbotan {
  display: inline;
  border-radius: 5px;
  color: #3B3A3A;
  padding: 2px 10px;
  font-size: 12px;
  border: 1px solid #9A9A9A;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(209, 209, 209, 1));
  cursor: pointer;
}
#koushinbotan:hover {
  background-image: linear-gradient(180deg, rgba(209, 209, 209, 1), rgba(255, 255, 255, 1));
}
.headercolor {
  grid-column: 1/-1;
  grid-row: headercolor;
  display: grid;
  grid-template-columns: inherit;
}
.headercolor-inner {
  grid-column: 3/-3;
}
header {
  grid-column: 1/-1;
  grid-row: header;
  display: grid;
  grid-template-columns: inherit;
}
.header-inner {
  grid-column: 3/-3;
}
.globalnavi {
  grid-column: 1/-1;
  grid-row: globalnavi;
  display: grid;
  grid-template-columns: inherit;
  grid-template-rows: auto;
}
.clearfix{
grid-column: 3/4;
  grid-row: 6;  
    font-size: 14px;
}
.clearfix li{

}
.clearfix li a{
    display: block;
    padding-left: 5px;
}
article {
  grid-column: 3;
  grid-row-start: article-aside;
}
aside {
  grid-column: 5;
  grid-row-start: 6;/*超絶重要：値が6（数値）だけだと位置が正しくてもstickiyが効かない。最初と最後をセットで記述。*/
    grid-row-end: 8;
}
footer {
  grid-column: 1/-1;
  grid-row: -2/-1;
  display: grid;
  grid-template-columns: inherit;
  grid-template-rows: auto;
}
#footer-inner {
  grid-column: 3/-3;
}
/*---------- 上部グローバル横ナビ（横並びリスト） ----------*/
/*ulがcolorでなくimageのため、.globalnaviが必要*/
.globalnavi {
  background-image: linear-gradient(white, white, #f3f3f3);
  border-top: 1px solid #017a94;
  border-bottom: 1px solid silver;
  box-shadow: 0px 6px 3px -3px rgba(0, 0, 0, 0.1);
}
/*グローバルナビを上部に固定する*/
.globalnavi {
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  z-index: 100;
  opacity: 0.95;
}
.globalnavi ul {
  display: grid;
  grid-template-columns: inherit;
}
.globalnavi ul {
  grid-column: 3/-3;
  padding: 0;
  margin: 0;
  list-style-type: none;
  background-image: linear-gradient(white, white, #f3f3f3);
  display: flex;
  /*justify-content: space-between;を設置すると等間隔になりhover時に余分な隙間が出るので記述しない。*/
}
/*等間隔にするにはwithにパーセント*/
.globalnavi li {
  color: #666666;
  border-right: 1px solid silver;
  text-align: center;
  flex: 1 1 auto;
}
.globalnavi li a {
  text-decoration: none;
  font-size: 13.5px;
  color: #3a3a3a;
  padding: 8px 0;
  display: block;
}
.globalnavi li a:hover {
  color: white;
  background-image: linear-gradient(#12d5fe, #01a0c2);
}
.globalnavi li:first-child {
  border-left: 1px solid silver;
}
.globalnavi li:first-child a {
  padding-left: 1px;
}
/*グローバルナビ内ホームボタン*/
.globalnavi .fa-home, .globalnavi .fa-arrow-up {
  margin: 0;
  padding: 0;
  font-size: 20px;
  line-height: 0;
  vertical-align: middle;
}
.border {
  border: 1px solid #D7D7D7;
}
.bsbb {
  box-sizing: border-box;
}
.mikakudo {
  margin: 0;
}
.mikakudo a img {
  margin: 30px 0 -20px;
}
.mikakudo a:hover img {
  box-shadow: 1px 1px 12px rgba(0, 0, 0, .65);
}
.topic .fa-twitter {
  color: #55acee;
}
figure {
  margin: 0;
}
/*イエローマーカー*/
.mkYL {
  background: linear-gradient(rgba(255, 255, 255, 0) 40%, #F7FD9B 70%);
}
/*ブルーマーカー*/
.mkbl {
  background: linear-gradient(rgba(255, 255, 255, 0) 40%, #d4fff5 70%);
}
/*ピンクマーカー*/
.mkpnk {
  background: linear-gradient(rgba(255, 255, 255, 0) 40%, #ffd4f3 70%);
}
/*ぶら下げインデント*/
.indentback {
  display: flex;
  align-items: baseline; /*超重要*/
}
.icon {
  margin-right: 8px;
}
#stickyunit {
    display: block;
  position: -webkit-sticky;
  position: sticky;
   top: 50px;
   height: auto;
}
blockquote {
  margin: 0;
}
/*ページ先頭ボタン*/
#page_top {
  width: 70px;
  height: 70px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #cccccc;
  opacity: 0.6;
  border-radius: 3px;
  z-index: 10;
}
#page_top a {
  position: relative;
  display: block;
  width: 70px;
  height: 70px;
  text-decoration: none;
}
#page_top a::before {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f062';
  font-size: 40px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 5px;
  bottom: 0;
  right: 10px;
  left: 0;
  margin: auto;
  text-align: center;
}

.lead {
  margin-top: 0;
  line-height: 270%;
}
.px18 {
  font-size: 18px;
}
.px12 {
  font-size: 12px;
}
/*リンク*/
a:link {
  color: #0080c0;
  text-decoration: underline;
}
a:hover {
  color: #0080c0;
}
a:visited {
  color: #0080c0;
}
/*テーブル*/
table {
  border-collapse: collapse;
  width: 100%;
  font-size: 13px;
}
td {
  text-align: center;
  border: 1px solid #cccccc;
  margin: 0;
  padding: 0;
}
th {
text-align: center;
border: 1px solid #cccccc;
font-weight: normal;
}
/*超重要追従部分はsectionのみ。（他のネストがあってはいけない）*/
section {
  padding-top: 50px; /*ヘッダーバーの高さ*/
}
/*sectionに合わせてarticleのmargin-topを-50pxにしている*/

article h2 {
  margin: 0;
  padding: 10px;
  line-height: 110%;
  font-size: 15px;
  text-align: left;
  color: #0f0f0f;
  width: 100%;
  border-left: 5px solid #F27169;
  border-bottom: 1px solid silver;
  border-top: 1px solid #f2f2f2;
  border-right: 1px solid silver;
  font-weight: normal;
  background-image: linear-gradient(#ffffff, #e9e9e9);
  box-sizing: border-box;
  border-radius: 2px;
}
article h3 {
  margin-top: 2em;
  margin-bottom: 0.5em;
  text-align: left;
  padding: 10px;
  border-left: 5px solid #01838a;
  font-size: 15px;
  color: #2c2c2c;
  box-sizing: border-box;
  line-height: 1.5em;
  background-color: #F5F5F5;
  border-bottom: 1px dashed #B7B5B5;
  border-top: 1px dashed #B7B5B5;
  border-right: 1px dashed #B7B5B5;
  border-radius: 2px;
  font-weight: bold;
}
h6 {
  margin: 0;
  padding: 0;
  font-size: 14px;
}
/*retioバナー*/
.happyoulink {
  width: 100%;
  border: 3px solid #F3DDDD;
  text-align: center;
  border-radius: 5px;
  box-sizing: border-box
}
.happyoulink img {
  padding: 1em;
  max-width: 100%;
  box-sizing: border-box;
}
.happyoulink a:hover {
  opacity: 0.6;
}
#sikenbi .bookkakomu, #index .bookkakomu, #miyazakisensei .bookkakomu, #mizuno .bookkakomu {
  border-bottom: none;
}
#index .bookkakomu a {
  color: #0080C0;
}
.bookkakomu {
  margin-bottom: 10px;
  border-bottom: 1px dotted silver;
  padding-bottom: 20px;
  padding-top: 20px;
  display: flex;
}
.bookkakomu:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.bookleft {
  width: 25%;
}
.bookleft img {
  border: 1px solid #dddddd;
}
.bookleft-nonakamikensaku {
  width: 25%;
}
.bookleft-nonakamikensaku img {
  border: 1px solid #dddddd;
}
.bookleft-thumbnail {
  width: 100%;
  margin: 5px 0;
}
.bookright {
  width: 75%;
  margin-left: 10px;
}
#index .bookright {
  padding-left: 20px;
  box-sizing: border-box;
}
.bookright h4 {
  margin: 0;
  padding: 0;
  line-height: 1.5;
}
.bookright .pagelist ul li {
  padding-left: 15px;
  text-indent: -15px;
  line-height: 1.5;
  font-size: 13px;
  padding-top: 10px;
}
/*なか見検索（inline-blockにしてpad調整するか）*/
.nakami {
  display: block;
  padding-left: 5px;
  line-height: 1em;
}
/*なか見検索文字カラー*/
.colororange {
  color: darkorange;
  display: inline;
  font-weight: bold;
}
.colorred {
  color: red;
  display: inline;
  font-weight: bold;
}
.colorblue {
  color: #4169e1;
  display: inline;
  font-weight: bold;
}
.pagelist ul {
  margin: 0;
  padding: 0;
}
.pagelist li {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 1.5;
  padding-top: 15px;
}
.pagelist .sample a {
  color: red;
}
.pagelist li a {
  color: olive;
}
.pagelist li::before {
  content: "▶";
  padding-right: 5px;
  color: dimgray;
  font-size: 10px;
}
/*-------文字色・赤-------*/
.red {
  color: #FF7474;
  display: inline;
}
/*-------太字・文字色・赤-------*/
.redbold {
  color: red;
  font-weight: bold;
  display: inline;
}
.gray {
  color: gray;
}
/*-------hrのボーダー0-------*/
hr {
  border: 0;
}
/*-------ユーチューブのレスポンシブ-------*/
.movie-wrap {
  position: relative;
  padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
  height: 0;
  overflow: hidden;
}
.movie-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#gouhi .movie-wrap {
  margin-top: 20px;
}
#mizuno .movie-wrap {
  margin-top: 20px;
}
#index .movie-wrap {
  margin-top: 20px;
}
/*---------snsボタン----------*/
.share {
  margin: 20px 0 10px 0;
}
.share ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}
.share li {
  width: 25%;
  border-right: 5px solid #ffffff;
  box-sizing: border-box;
}
.share li:last-child {
  border: none;
}
.share li a {
  display: block;
  color: #ffffff;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  border-radius: 3px;
  opacity: 0.7;
}
.share li a:hover {
  opacity: 1;
}
.share-tw {
  background-color: #55acee;
}
.share-fb {
  background-color: #3b5998;
}
.share-hate {
  background-color: #00A4DE;
}
.share-line {
  background-color: #00B900;
}
.fa-hatena::before {
  content: "B!";
  font-family: Verdana;
  font-weight: bold;
}
.my-big {
  font-size: 1em;
  margin-right: 5px;
}
.fa-youtube {
  vertical-align: middle;
  font-size: 13px;
  margin-left: 1px
}
.topic .fa-youtube {
  font-size: 18px;
}
/*-------ヘッダーの最上部カラーバーh1--------*/
.headercolor {
  padding: 3px 0px;
  font-weight: normal;
  background-image: linear-gradient(#01bbe2, #017a94);
}
.headercolor h1 {
  font-size: 10px;
  padding: 0;
  margin: 0;
  font-weight: normal;
  color: white;
}
/*---------- タイトル(左)とmade,更新時刻（右） ----------*/
.header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 76px;
}
.headerleft {
  display: flex;
}
.headerleft a {
  background: -webkit-linear-gradient(45deg, rgba(255, 165, 117, 1) 0%, rgba(229, 61, 93, 1) 50%, rgba(194, 49, 134, 1) 70%, rgba(156, 56, 187, 1) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-decoration: none;
  font-size: 36px;
  font-weight: bold;
  padding-top: 5px;
  /*親要素【headerleft】をflexにすればpaddingで高さ調整可能。*/
}
.headerleft a:hover {
  text-shadow: 0 0 25px rgba(156, 56, 187, 0.5);
}
.headerright {
  text-align: right;
  font-size: 13px;
  margin: 0;
}
.headerright .made {
  font-size: 12px;
  margin: 0 -12px 0 0;
  line-height: 1;
}
.headerright .koushin {
  font-size: 12px;
  margin: 0;
  padding: 8px 0 0 0;
  line-height: 1;
}
.made span {
  color: #143CA0;
  font-size: 18px;
  font-weight: bold;
}
/*---------トピックスとスポンサーリンクを囲む---------*/
.clearfix {
  display: flex;
  justify-content: space-between;
}
/*---------- スポンサーリンク ----------*/
.admawarikomimigi {
  width: 336px;
  text-align: center;
}
.sponsered-bar {
  padding: 10px;
  line-height: 1.1;
  font-size: 15px;
  text-align: left;
  color: #0f0f0f;
  width: 100%;
  border-left: 5px solid #F27169;
  border-bottom: 1px solid silver;
  border-top: 1px solid #f2f2f2;
  border-right: 1px solid silver;
  font-weight: normal;
  right: inherit;
  background-image: linear-gradient(#ffffff, #e8e8e8);
  box-sizing: border-box;
  border-radius: 2px;
}
.font13px {
  font-size: 13px;
}
/*ファーストビューアドセンスの位置*/
.adsaisho {
  margin-top: 20px;
  width: 336px;
  height: 280px;
  margin-left: auto;
  margin-right: auto;
}
/*トピック*/
.topicsblock {
  width: 234px;
}
.topics-bar {
  margin-bottom: 0px;
  padding: 10px;
  line-height: 1.1;
  font-size: 15px;
  text-align: left;
  color: #0f0f0f;
  width: 100%;
  border-left: 5px solid #F27169;
  border-bottom: solid 1px silver;
  border-top: 1px solid #f2f2f2;
  border-right: solid 1px silver;
  font-weight: normal;
  background-image: linear-gradient(white, #efefef);
  box-sizing: border-box;
  border-radius: 2px;
}
ol.topic {
  margin-left: 20px;
  margin-top: 20px;
  margin-right: 0px;
  margin-bottom: 0px;
  padding: 0;
}
ol.topic li {
  line-height: 2.5;
}
ol.topic li a {
  text-decoration: none;
  color: #323232;
}
ol.topic li a:hover {
  color: #0080C0;
  text-decoration: underline;
}
ol.topic li img {
  vertical-align: middle;
}
/*リストの7個目以降を少しグレーにする
.topic li:nth-child(n + 7) a {
  color: #494949;
}*/
#sec2013 img, #sec2014 img, #sec2012 img {
  vertical-align: middle;
}
/*---------- 左カラム ----------*/
article {
  font-size: 13px;
  line-height: 2.5;
  letter-spacing: 1px;
  box-sizing: border-box;
  margin-top: -50px;/*sectionではなくarticleで制御*/
}
p {
    margin: 20px 0;
  padding-left: 0px;
  line-height: 250%;
  letter-spacing: 1px;
  padding-right: 0px;
  font-size: 14px;
}
#goukakuten p {
  line-height: 1.5;
  padding: 5px;
}
/*---------- 右カラム ----------*/
aside {
  padding: 0;
  margin: 0;
  text-align: left;
  line-height: 160%;
  letter-spacing: 1px;
  font-size: 13px;
}
/*---------- 右カラム人気講師リスト ----------*/
.asideninkikoushi ul {
  margin: 20px 0;
  padding: 10px;
  list-style: none;
  background-color: #eae5da;
}
.asideninkikoushi li a {
  display: block;
  text-decoration: none;
  color: #3a3a3a;
  padding: 0;
  margin-top: 10px;
  background-color: white;
}
.asideninkikoushi li:first-child a {
  margin-top: 0;
}
.asideninkikoushi li a:hover {
  opacity: 0.7;
}
.asideninkikoushi li a img {
  border: none;
}
.asideninkikoushi img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}
/*講師写真とテキスト重ねる*/
.asideninkikoushi .text {
  padding: 5px 10px;
  background-color: rgba(0, 0, 0, 0.4);
  color: #ffffff;
  width: 100%;
  box-sizing: border-box;
}
.asideninkikoushi a {
  position: relative;
}
.asideninkikoushi .text {
  position: absolute;
  bottom: 0;
  left: 0;
}
#index .asideninkikoushi .text {
  padding: 5px;
  width: 60%;
  left: 40%;
  text-align: center;
}
aside h3, .yobikou h3 {
  margin-bottom: 20px;
  padding: 10px;
  line-height: 110%;
  font-size: 15px;
  text-align: left;
  color: #0f0f0f;
  width: 100%;
  border-left: 5px solid #F27169;
  border-bottom: solid 1px silver;
  border-top: 1px solid #f2f2f2;
  border-right: solid 1px silver;
  font-weight: normal;
  background-image: linear-gradient(white, #efefef);
  box-sizing: border-box;
  border-radius: 2px;
}
aside h3:nth-child(1), .yobikou h3:nth-child(1) {
  margin-top: 0;
}
/*---- asideのセンタリング ----*/
.centering {
  text-align: center;
}
.tophappyou p {
  display: inline-block;
}
/*---------- article最下部のアドセンス ----------*/
.adsaigonikohidariclearfix {
  margin: 43px 0 0 0;
  padding: 0;
  height: 250px;
  width: 100%;
}
.adsaigonikohidariclearfix::after {
  content: "";
  display: block;
  clear: both;
}
.adsaigonikohidari {
  margin: 0;
  padding: 0;
  float: left;
}
/*---------- 体験談ページ文章を枠で囲む ----------*/
.kakomu {
  border: 1px solid #C0C0C0;
  max-width: 100%;
  text-align: left;
  margin-top: 40px;
  padding: 20px;
}
/*---------- フロムAテーブル ----------*/
table.chihou {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 10px;
}
td.chihou {
border: 1px solid silver;
font-size: 13px;
background-color: #eeeeee;
color: #2a2a2a;
background-position: center bottom;
padding-top: 8px;
padding-bottom: 8px;
text-align: center;
background-image: linear-gradient(#ffffff, #ebebeb);
}
th.chihoutakufudo {
  border: 1px solid silver;
  font-size: 13px;
  text-align: center;
}
td.chihoutakufudo {
  font-size: 13px;
  color: maroon;
  margin: 0;
  padding: 0;
  border-right: 1px solid silver;
}
td.chihoutakufudo a {
  color: maroon;
  display: block;
  text-decoration: none;
  padding: 8px 5px;
  margin: 0;
  text-align: center;
}
td.chihoutakufudo a:hover {
  background-color: #ffd6ac;
}
/**/
.koushi {
  color: white;
  margin-left: 2px;
  margin-bottom: 2px;
  width: 163px;
  font-weight: bold;
  background-image: url(img/green.gif);
  background-repeat: repeat-x;
  background-color: lime;
}
.mizuno {
  margin-top: 15px;
  margin-left: 15px;
  margin-bottom: 10px;
  margin-right: 15px;
}
/*宮嵜先生のページ*/
.miyazakifirst {
  margin-top: 8px;
  margin-left: 15px;
  margin-right: 15px;
  float: left;
}
.miyazakilast {
  margin-top: 8px;
  margin-left: 15px;
  margin-right: 15px;
  float: left;
  margin-bottom: 10px;
}
.grayandbold {
  font-weight: bold;
  background-color: #ebebeb;
}
.shunin img {
  width: 100%;
  margin: 15px 0px 0px;
  vertical-align: bottom;
}
/*必要書類ページ*/
.shorui {
    margin: 20px 0;
  font-size: 14px;
  text-align: left;
}
.shorui li {
  font-size: 14px;
  text-align: left;
  line-height: 2.5em;
}
/* 『フッターレスポ／右』の設定 */
.adslot_2 {
  display: inline-block;
  width: 300px;
  height: 250px;
}
/* 米印のリスト */
ul.kome {
  margin: 0;
  padding: 0;
}
ul.kome li {
  display: flex;
  list-style-type: none;
  font-size: 14px;
  line-height: 1.4em;
  padding-top: .5em;
  padding-bottom: 1em;
}
@media (min-width:1231px) {
  body {
    grid-template-columns: 1fr 30px 230px 30px 600px 30px 300px 30px 1fr;
       grid-template-rows: [headercolor]auto [header]auto [globalnavi]auto [row-breadcrumb]40px [sutema]50px [article-aside]auto [footer]auto;
  }
    .topicsblock{
        width: 100%
    }
    .admawarikomimigi{
        display: none;
        width: 100%;
        margin-top: 20px;
    }
  article {
    grid-column: 5;
      grid-row: 6;
  }
  aside {
    grid-column: 7;
  }
    
  .clearfix { /*高さを設定しないとstickyの挙動がおかしい*/
    grid-column: 3/4;
    grid-row: 6/7;
    position: sticky;
    height: 600px;
    top: 50px;
    display: block;
  width: 100%;
  }
.clearfix{
    flex-direction: column;
    }
    /*追従ハイライトのトピックス（もくじ）ここから*/
.topicsblock nav li {
}
.topicsblock nav li:last-child {
  border-bottom: none;
}
.topicsblock nav li a {
  display: block;
  color: #333333;
  background: #FFFFFF;
  text-decoration: none; /*グレー背景が移動スピード*/
  transition: all 0.1s ease;
}
.topicsblock nav li a:hover {
  background-color: #f3f3f3;
  text-decoration: none;
  opacity: 1;
  /*border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;*/
}
.topicsblock nav li.current a {
  background-color: #f3f3f3;
        font-weight: bold;
}
/*トピックス（もくじ）ここまで*/
}

@media (max-width: 599px) {
  article {
    font-size: 16px;
  }
  article #pageBody .mainVisual ul li a {
    font-size: 20px;
  }
  /*〇月を非表示*/
  .koushinbi {
    display: none;
  }
  p {
    font-size: 16px;
    line-height: 2;
  }
  /*試験日翌日以降の日時と曜日をブロック化*/
  .sokuhoujikoku span {
    display: block;
  }
  .adslot_2 {
    display: none;
  }
  /* 米印のリスト */
  ul.kome li {
    font-size: 16px;
  }
}
/* 必要書類ページ画像 */
img.hituyoushorui {
  margin-top: 10px;
}
/*トップと試験日で使用のキャンペーンテーブル*/
.campaign {
  font-size: 14px;
  font-weight: normal;
  border: 1px solid silver;
  border-top: 1px solid white;
  text-align: left;
  padding: 10px 10px 10px 15px;
}
.campaign a {
  color: #FF7474;
  text-decoration: underline;
}
#sikenbi .campaign {
  font-weight: normal;
  border: 1px solid silver;
}
.returntotop {
  margin: 10px 0;
  text-align: right;
}
#returntotop {
  margin: 10px 0;
  text-align: right;
}
/*---------- フッター ----------*/
footer {
  margin-top: 10px;
  padding-top: 20px;
  padding-bottom: 5px;
  font-size: 12px;
  border-top: 1px dashed #999999;
  line-height: 150%;
  clear: both;
  bottom: auto;
  right: auto;
}
#footerlist-inner {
  box-sizing: border-box;
  margin-right: auto;
  margin-left: auto;
  text-align: left;
}
#footerlist ul {
  margin: 0;
  padding: 0;
}
#footerlist ul li {
  display: inline;
  padding-right: 20px;
}
#footerlist ul li a {
  text-decoration: none;
  color: #2b2b2b;
  font-weight: bold;
}
/*---------- コピーライト ----------*/
#copyright-inner {
  box-sizing: border-box;
  margin-right: auto;
  margin-left: auto;
  text-align: right;
  margin-top: 20px;
}
#copyright-inner p {
  font-size: 12px;
  line-height: 1;
  margin: 12px 0;
}
.googlecentering {
  text-align: center;
  margin: 20px auto 0;
  height: 75px;
}
@media (max-width:599px) {
  .googlecentering {
    margin: 43px 0;
    height: auto;
  }
}
/*asideのグーグルセンタリング*/
aside .googlecentering {
  text-align: center;
  margin: 20px 0;
  height: 600px;
}
/*★★★★★★★レスポンシブ・ipad（幅100％）設定★★★★★★★*/
@media(min-width:680px) and (max-width:1010px) {
  body {
    grid-template-columns: auto 30px 600px 30px auto;
    grid-template-rows: [headercolor]auto [header]auto [globalnavi]auto [row-breadcrumb]40px [sutema]60px [clearfix]400px [article]auto [aside]auto [footer]auto;
  }
    
  article {
    grid-column: 3/-3;
    grid-row: article;
  }
  article{
    margin-top: 0;
  }
    section{/*画面上からのスペース*/
        padding-top: 12px;
    }
  aside {
    grid-column: 3;
    grid-row: aside;
  }
  .globalnavi ul {
    grid-column: 2/-2;
  }
  .header-inner, .headercolor-inner {
    grid-column: 2/-2;
  }
  #footer-inner {
    grid-column: 3/-3;
  }
  .globalnavi {
    position: static;
  }
  .asideninkikoushi ul {
    display: flex;
    justify-content: space-between;
  }
  .asideninkikoushi ul li {
    width: 49%;
    box-sizing: border-box;
  }
  .asideninkikoushi ul li a {
    margin-top: 0;
  }
  /*↓ipadの背景bodyとheaderここから↓*/
  header {
    background-color: white;
    background-image: none;
  }
  /*↑ipadの背景bodyとheaderここまで↑*/
  .globalnavi ul {
    flex-wrap: wrap;
  }
  /*ipad6列2行の等分*/
  .globalnavi ul li {
    width: 16%; /*100/6=16*/
  }
  /*--セルの右にボーダーだが、行の最初のセルだけ左にボーダー--*/
  .globalnavi li:first-child {
    border-left: 1px solid silver;
  }
  .globalnavi li:nth-child(7) {
    border-left: 1px solid silver;
  }
  /*--2行のうち、上の行の6個のセルの下にボーダー--*/
  .globalnavi li:nth-child(-n+6) {
    border-bottom: 1px solid silver;
  }
  .globalnavi li a {
    font-size: 13px;
    padding: 6px 0;
  }
  .globalnavi li:last-child a {}
}
/*★★★★★★★レスポンシブiphone★★★★★★★*/
@media(min-width:1010px) and (max-width:1230px)
  {
	  body{
  grid-template-rows: [headercolor]auto [header]auto [globalnavi]auto [row-breadcrumb]40px [sutema]50px [clearfix]auto [article-aside]auto [footer]auto;
	  }
    article{margin-top: 0;}
    section:first-child{
      padding-top: 0;
    }
    
}
  
/*★★★★★★★レスポンシブiphone★★★★★★★*/
@media (max-width: 679px) {
  body {
    background-color: #ffffff;
    grid-template-columns: 1% 98% 1%;
    grid-template-rows: [header]auto [row-breadcrumb]40px [sutema]50px [headercolor]auto [clearfix]auto [gap]40px [article]auto [aside]auto [gap2]25px [footer]auto;
  }
  header {
    grid-column: 1/-1;
    grid-row: header;
  }
  .row-breadcrmb {
    padding: 5px 10px;
  }
  .sutema {
    grid-row: sutema;
    align-items: center;
    padding: 10px;
  }
  .white {
    grid-column: 1/-1;
  }
  .headercolor {
    grid-column: 1/-1;
    grid-row: headercolor;
    margin: 0;
    padding: 0;
    background-image: none;
  }
  .headercolor-inner {
    padding: 10px 0;
  }
  .header-inner {
    grid-column: 1/-1;
  }
    .clearfix{
            grid-column: 2/-2;
    grid-row: clearfix;
    }
  article {
    grid-column: 2/-2;
    grid-row-start: article;
    margin: 0;
  }
section:first-child{
  padding-top: 43px;
  }
  aside {
    grid-column: 2/-2;
    grid-row: aside;
  }
  footer {
    grid-column: 2/-2;
    grid-row: -2/-1;
  }
  .headerleft {
    position: fixed;
    top: 0;
    justify-content: flex-start;
    padding-left: 10px;
    margin-top: 0;
    background-color: #ffffff;
    width: 100%;
    z-index: 200;
  }
  body.open .headerleft {
    border-bottom: 1px solid #dddddd;
  }
  .headerleft a {
    font-size: 25px;
    line-height: 1;
    padding: 10px 0 8px
  }
  .headerright {
    margin: 55px 13px 0 0;
  }
  .adobefonts {
    font-size: 37px;
  }
  .headerright .made {
    padding-top: 10px;
  }
  .header-inner {
    height: auto;
  }
  .headercolor h1 {
    color: black;
    font-size: 15px;
    padding: 0 10px;
  }

  #page_top {
    opacity: 0.4;
  }
  /*-----グローバルナビ-----*/
  .globalnavi {
    position: fixed;
    height: 150vh;
    grid-column: 1/-1;
    grid-row: 1/-1;
    z-index: 100;
    background-color: rgba(255, 255, 255, 1.0);
    width: 200px;
    margin-left: -200px;
    transition: /*margin-left*/ all 0.3s /*ease-out*/ ;
    background-image: none;
    opacity: 1;
    border-top: 0;
  }
  body.open .globalnavi {
    margin-left: 0;
  }
  .globalnavi ul {
    display: block;
    margin: 80px auto 0;
    background-image: none;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
  }
  .globalnavi ul li {
    border-right: none;
    background-color: rgba(255, 255, 255, 1.0);
  }
  .globalnavi ul li a {
    background-color: rgba(255, 255, 255, 1.0);
    color: darkslategray;
    padding: 10px;
    border: none;
    border-bottom: 1px dashed #A9A9A9;
    text-align: left;
  }
  .globalnavi li:first-child a {
    padding-left: 10px;
  }
  .globalnavi li:first-child {
    border-left: none;
  }
  .globalnavi ul li a:hover {
    background-image: none;
    color: darkslategray;
    background-color: lightcyan;
  }
  /*-----トグルボタン-----*/
  .toggle-btn {
    display: block;
    position: fixed;
    top: 7px;
    right: 8px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    border: none;
    background-color: transparent;
    z-index: 200;
  }
  .toggle-btn span {
    position: absolute;
    display: block;
    left: 0;
    width: 25px;
    height: 3px;
    background-color: #000000;
    transition: all 0.3s;
    border-radius: 4px;
  }
  .toggle-btn span:nth-child(1) {
    top: 5px;
  }
  .toggle-btn span:nth-child(2) {
    top: 13px;
  }
  .toggle-btn span:nth-child(3) {
    top: 21px;
  }
  .open .toggle-btn span {
    background-color: #000000;
  }
  .open .toggle-btn span:nth-child(1) {
    transform: translateY(8px) rotate(-45deg); /*横棒の幅（高さ）を変えたらY交差の位置の数値も同時に変える*/
  }
  .open .toggle-btn span:nth-child(2) {
    opacity: 0;
  }
  .open .toggle-btn span:nth-child(3) {
    transform: translateY(-8px) rotate(45deg);
  }
  body.open .toggle-btn {
    z-index: 200;
  }
  body.open .pagecover {
    grid-column: 1/-1;
    grid-row: 1/-1;
    z-index: 50;
    transition: all 0.3s;
    background-color: rgba(0, 0, 0, 0.6);
  }
  .pagecover { /*戻るとき*/
    grid-column: 1/-1;
    grid-row: 1/-1;
    z-index: -1;
    transition: all 0.3s;
    background-color: transparent;
  }
  body.open .site {
    border-bottom: 1px solid #dddddd;
  }
  aside .googlecentering {
    text-align: center;
    margin: 20px 0;
    height: auto;
  }
  /*-----ヘッダー-----*/
  header {
    border-bottom: 1px solid teal;
    padding-bottom: 15px;
  }
  /*フロート(display-flex=親要素)解除*/
  .header-inner, .clearfix {
    display: block;
  }
  /*-----目次とアドセンスのセンタリング--------*/
  .topicsblock, .admawarikomimigi {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
  .topicsblock {
    font-size: 16px;
  }
  .topics0auto {
    width: 260px;
    margin: 0 auto;
  }
  .topicsblock ol li a {
    display: inline-block;
  }
  /*-----スマホアドセンスの高さ制御--------*/
  .adsaisho {
    margin: 43px 0 0;
    padding: 0 5px;
    width: 100%;
    box-sizing: border-box;
  }
  /* SNSのシェアボタン */
  .share ul span {
    display: none;
  }
  .my-big {
    font-size: 2em;
    padding: 5px 5px;
    margin-right: 0;
  }
  /*-----h2見出し-----*/
  article h2 {
    line-height: 150%;
    padding-top: 8px;
    padding-bottom: 6px;
  }
  article h2 span, article h3 span {
    display: block;
  }
  /*-----h3見出し-----*/
  /*----最初のアドセンス----*/
  .admawarikomimigi {
    margin-top: 20px;
  }
  /*-----フッターの制御--------*/
  #footer-inner {
    margin: 0;
    padding: 0 0 10px 0;
  }
  .adsaigonikohidari {
    float: none;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
  }
  /*書籍の紹介。テキスト・試験日・トップで使用*/
  .bookleft {
    font-size: 14px;
    width: 30%;
    text-align: center;
  }
  .bookright {
    width: 70%;
  }
  .bookright h4 {
    font-size: 13px;
  }
  .bookleft-thumbnail {
    float: none;
    width: 100%;
    padding-top: 10px;
  }
  /*なか見検索文字カラー2色*/
  .nakami {
    padding-left: 0;
  }
  .bookleft-nonakamikensaku {
    width: 30%;
    text-align: center;
  }
}
/*★★★★★★★レスポンシブ★★★★★★★*/
@media (max-width: 1010px) {
  /* 1010以下はスマホで表示させない */
  .spnone {
    display: none;
  }
  .crear {
    margin: 20px 0;
  }
}
/*★★★★★★★レスポンシブ★★★★★★★*/
@media (min-width: 680px) {
  /*-----トグル（メニュー）ボタンを表示させない--------*/
  .toggle-btn {
    display: none;
  }
  #menu {
    display: block !important;
  }
  .white {
    grid-column: 2/-2;
    grid-row: 1/-1;
    background-color: #ffffff !important;
  }
}
/*★★★★★★★レスポンシブ★★★★★★★*/
@media (max-width: 374px) {
  .nakami {
    font-size: 12px;
  }
  .bookright {
    font-size: 11px;
  }
  .headerright .made {
    font-size: 11px;
  }
  #footerlist-inner ul {
    margin-bottom: 30px;
  }
  #copyright-inner p {
    font-size: 11px;
  }
}
@media (max-width: 320px) {
  article h2, .sokuhoutime caption {
    font-size: 13px;
  }
  .made span {
    font-size: 15px;
  }
}