@charset "utf-8";

/* CSS Document */
.topicPathWrap h2 {
  margin: 0 auto 15px;
  padding: 10px 15px 0;
  width: 100%;
  max-width: var(--outerWidth);
  font-weight: bold;
  font-size: 2.2rem;
  line-height: 1.4;
  text-align: left;
}

.topicPathWrap h4 {
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 2;
}

.topicPathWrap p {
  font-size: 1.2rem;
  line-height: 1.8;
}

.topicPathWrap td span {
  color: #333 !important;
}

.moreBlock {
  display: none;
}

.contentRegion {
  width: 100%;
  overflow: hidden;
}
.omoi{
  background: linear-gradient(to top, rgb(var(--naviUsuBlue)) 0px, rgb(var(--naviUsuBlue)) 7px, rgba(255, 255, 255, 0) 7px);
}

/* ------ .indexGuidance --------------*/
/* page tab */

.indexGuidance span{
color: #f7a324;
}

.topicPathWrap .tabNavi {
  margin: 0 auto 15px;
  padding: 0 0 0 10px;
  width: calc(100% - 20px);
  max-width: var(--outerWidth);
  border-bottom: 1px solid rgba(59, 112, 210, 1);
}

.topicPathWrap .tabNavi ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 auto;
}

.topicPathWrap .tabNavi li {
  position: relative;
  cursor: pointer;
  text-align: center;
  font-size: 1.5rem;
  font-weight: bold;
  border-radius: 0.75rem 0.75rem 0 0;
}

.topicPathWrap .tabNavi li:last-child {
  justify-self: end;
}

.topicPathWrap .tabNavi li::after {
  content: '';
  z-index: 2;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(59, 112, 210, 1);
  border-radius: 0.75rem 0.75rem 0 0;
  border-bottom: 0;
  transform: scale(1, 0);
  transform-origin: center bottom;
}

.topicPathWrap .tabNavi a {
  position: relative;
  z-index: 3;
  display: grid;
  place-content: center;
  padding: 3px 10px;
  height: 100%;
  font-weight: bold;
  line-height: 1.2;
}

.topicPathWrap .tabNavi a[href*="s-kyogikai.com"] {
  margin: 5px;
  padding: 3px 1.75em 3px 5px;
  height: calc(100% - 10px);
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 57.73 57.73"><path fill="rgba(255,255,255,1)" fill-rule="evenodd" d="M10.82,0V46.9H57.73V0Zm42.4,42.39H15.33V4.51H53.22ZM4.51,10.82H0V57.73H46.9V53.22H4.51ZM26.38,35.18,39.69,21.87v9.7H44V14.43H26.83v4.29H36.3L23.23,32Z" /></svg>') calc(100% - 0.5em) center / 1em auto no-repeat, #904890;
  border-radius: 0.5rem;
  color: #fff;
  font-size: 1.3rem;
}

.topicPathWrap .tabNavi .location {
  background: #fff;
  border: solid 1px rgba(59, 112, 210, 1);
  border-bottom: 0;
}

.topicPathWrap .tabNavi .location a {
  position: relative;
  cursor: default;
  color: rgba(59, 112, 210, 1);
  font-weight: bold;
}

.topicPathWrap .tabNavi .location::after {
  content: '';
  top: 100%;
  width: 100%;
  height: 5px;
  background: #fff;
  border-radius: 0;
  transform: scale(1, 1);
}

.topicPathWrap .tabNavi .location span {
  position: relative;
  z-index: 2;
}

.contentRegionInner {
  margin: 0 auto 4em;
  padding-bottom: 4em;
  /* 方眼紙模様に必須のスタイル */
  background-image: linear-gradient(0deg, transparent calc(100% - 1px), #eeece1 calc(100% - 1px)),
                    linear-gradient(90deg, transparent calc(100% - 1px), #eeece1 calc(100% - 1px));
  background-size: 16px 16px;
  background-repeat: repeat;
  background-position: center center;
}
.contentRegionInner.detail{
  margin: 0 10px;
}
/* ------ mainTitle ------ */
.mainTitle {
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  margin: 0 auto 30px;
  padding-top: 30px;
  width: calc(100% - 30px);
}

.mainTitle>.inner {
  position: relative;
  display: inline-block;
}

.mainTitle .title {
  background: #fff;
  border-radius: 1.5rem;
  padding: 30px 1.5rem;
  padding-top: 50px;
  margin-bottom: 30px;
  border: 2px solid #d1d9e2;
}
.mainTitle .title::before{
  content: '';
  z-index: 3;
  top: -16px;
  right: 31%;
  width: 134px;
  height: 80px;
  background: url(../../../img/page/guidance/clip.png) center / contain no-repeat;
  background-size: contain;
}
.mainTitle .title::after{
  content: '';
  z-index: 3;
  top: 7px;
  right: 72%;
  width: 132px;
  height: 96px;
  background: url(../../../img/page/guidance/pencil.png) center / contain no-repeat;
  background-size: contain;
}

.mainTitle h3 {
  margin: 0 auto 1.5rem;
  font-size: 3rem;
  text-align: center;
}

.mainTitle .ttlLine {
  position: relative;
  background: linear-gradient(to top, rgb(var(--naviCream)) 0px, rgb(var(--naviCream)) 7px, rgba(255, 255, 255, 0) 7px);
}

.mainTitle .ttlLine::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  transition: all 0.5s;
}

.mainTitle ul {
  display: flex;
  justify-content: center;
  gap: 5px;
  margin: 0 auto;
  max-width: 800px;
  padding: 50px 0 40px;
}

.mainTitle ul li {
  position: relative;
  padding: 5px 5px 5px 1.25em;
  color: #333;
  font-weight: bold;
  line-height: 1.3;
  display: inline-block;
  z-index: 5;
}
/* .mainTitle ul li::after{
  content: '';
  display: inline-block;
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 2px;
  background-color: #f7a324;
} */
.mainTitle ul li span::before{
  content: '';
  left: -6%;
  top: -5px;
  width: 2.5em;
  height: 2.5em;
  background: url(../../../img/page/guidance/reten.png) center / contain no-repeat;
  z-index: 1;
}
.mainTitle ul li.inFree::before{
  content: '';
  left: 40%;
  top: -36px;
  width: 2.5em;
  height: 2.5em;
  background: url(../../../img/page/guidance/inFree.png) center / contain no-repeat;
}
.mainTitle ul li.parent::before{
  content: '';
  left: 35%;
  top: -36px;
  width: 2.5em;
  height: 2.5em;
  background: url(../../../img/page/guidance/parent.png) center / contain no-repeat;
}
.mainTitle ul li.mousikomi_irane::before{
  content: '';
  left: 35%;
  top: -36px;
  width: 2.5em;
  height: 2.5em;
  background: url(../../../img/page/guidance/mousikomi_irane.png) center / contain no-repeat;
}


.mainTitle .title figure {
  float: left;
  padding: 10px 10px 10px 0;
  width: 50%;
  max-width: 230px;
}

.mainTitle .title figure img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.mainTitle .title div {
  display: table;
  width: 100%;
}

.chigai {
  margin: 2.5em auto;
}

.chigai h4 {
  text-align: center;
  color: #f7a324;
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 1em;
}

.chigai dl {
  margin: 1em auto;
}

.chigai dt {
  font-weight: bold;
  position: relative;
  color: #f7a324;
  font-size: 1.3rem;
  line-height: 1.5;
}

.chigai dd {
  font-size: 1.2rem;
  line-height: 1.5;
  color: #333;
}

.chigai dd+dt {
  margin-top: 1em;
}


/* ------ areaList Large ------ */
.contentRegion .areaList {
  margin: 0 auto 4em;
  padding: 5px 10px;
  background: #fff4bf;
}

.contentRegion .areaList ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  margin: 0 auto;
}

.contentRegion .areaList li {
  background: #dedede;
  border: solid 3px #e5e5e5;
  border-radius: 0.5rem;
  box-sizing: border-box;
  margin: 5px 1%;
  min-height: 50px;
  width: 23%;
  text-align: center;
  font-size: 15px;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
}

.contentRegion .areaList li a {
  background: #fff;
  display: grid;
  place-content: center;
  padding: 3px;
  width: 100%;
  height: 100%;
  border-radius: 0.3rem;
}

.contentRegion .areaList li:nth-child(1) a {
  color: #32ade2;
}

.contentRegion .areaList li:nth-child(2) a {
  color: #60b051;
}

.contentRegion .areaList li:nth-child(3) a {
  color: #32a8a0;
}

.contentRegion .areaList li:nth-child(4) a {
  color: #a2c639;
}

.contentRegion .areaList li:nth-child(5) a {
  color: #fcb646;
}

.contentRegion .areaList li:nth-child(6) a {
  color: #e8623b;
}

.contentRegion .areaList li:nth-child(7) a {
  color: #eea4b9;
}

.contentRegion .areaList li:nth-child(8) a {
  color: #e08653;
}

/* ------ inqTxt ------ */
.contentRegionWrap .inqTxt{
  margin: 0 auto;
  padding: 1px 2em 2em;
  max-width: 900px;
  background: rgb(var(--naviUsuGray))
}

.contentRegionWrap .inqTxt dt{
  margin: 2em auto 1em;
  text-align: center;
  font-weight: bold;
}

.contentRegionWrap .inqTxt dd{
 line-height: 1.6;
 font-size: 1.3rem;
}

.contentRegionWrap .inqTxt a{
  text-decoration: underline;
 }
 


/* ------ forTeacherBtn ------ */
.forTeacherBtn {
  margin: 2em auto;
  text-align: right;
  padding: 0 15px;
}

.forTeacherBtn a {
  color: #f7a324;
  position: relative;
  font-size: 1rem !important;
  line-height: 1.2;
}

.forTeacherBtn a::after {
  content: '';
  top: 35%;
  right: 10px;
  width: 0.8em;
  height: 0.8em;
  border-bottom: solid 2px #f7a324;
  border-right: solid 2px #f7a324;
  transform: translate(0, -50%) rotate(45deg);
}

.forTeacherBtn a span {
  font-size: 1.2rem;
  font-weight: bold;
  margin-right: 2em;
}


/* ------ areaList small ------ */
.contentRegion .areaList {
  min-width: auto;
  justify-content: flex-start;
  margin: 0 auto;
}

.contentRegion .areaList li span {
  text-shadow: none;
  font-size: 0.8rem;
  line-height: 1.2;
  font-weight: normal;
}


/* ------ regionArticle ------ */
.regionArticle {
  margin: 0 auto 60px;
  position: relative;
}
.regionArticle.pen{
  position: relative;
}
.regionArticle.pen::before {
  content: '';
  z-index: 3;
  top: -2px;
  right: 16px;
  width: 70px;
  height: 100px;
  background: url(../../../img/page/guidance/pencil.png) center / contain no-repeat;
}

.regionArticle section {
  margin: 4em auto;
  padding-top: 35px;
  padding-left: 15px;
  background: #fff;
  border: solid 1px #e5e5e5;
  border-right: solid 5px #e5e5e5;
  border-bottom: solid 5px #e5e5e5;
  position: relative;
  border-radius: 0.5rem;
}
.regionArticle section::before{
  content: "";
    top: 10px;
    left: 0;
    width: 30px;
    height: calc(100% - 20px);
    background: radial-gradient(#e5e5e5 35%, rgba(255, 255, 255, 0) 38%) center top / 30px 30px repeat-y;
}


.regionArticle section.cancelBox {
  background-color: #f0f0f0;
  background-image: repeating-linear-gradient(-45deg, #fff, #fff 7px, transparent 0, transparent 14px);
  position: relative;
}

.regionArticle section.cancelBox::after {
  content: '中止';
  top: 40%;
  right: calc(50% - 2em);
  width: 100px;
  height: 1em;
  font-weight: bold;
  font-size: 2.5rem;
  color: #ff6e6e;
  text-align: center;
}


.regionArticle section.cancelBox a:link {
  pointer-events: none;
}

.regionArticle section.cancelBox .moreBtn {
  display: none;
}

.regionArticle section.cancelBox .sectionInner {
  opacity: 0.5;
}

.regionArticle section.cancelBox .eventDetail {
  display: none;
  word-break: break-all;
}

.regionArticle div {
  padding: 0 0 8px;
}

.regionArticle div.leftBlock {
  padding: 0;
}

/* ------ school Block ------ */
.rightArea {
  margin-top: 1em;
}

.moreBlock .mainBlock {
  padding: 10px 0;
}

.moreBlock .mainBlock .access p {
  line-height: 1.5;
  margin-bottom: 2em;
  padding: 0 10px;
}

.access div {
  padding: inherit;
}
.access {
  border: 5px solid #ffeacb;
  border-radius: 1.5em;
  padding: 10px!important;
  padding-bottom: 30px!important;
}
/*areaMenu*/
h3.areaMenu {
  position: relative;
  padding: .5em .7em;
  border-radius: 10px;
  color: #fff;
  text-align: center;
  font-size: 19px;
}

h3.areaMenu#area01 {
  background: #32ade2;
}
h3.areaMenu#area01::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-top: 11px solid #32ade2;
}

h3.areaMenu#area02 {
  background: #60b051;
}
h3.areaMenu#area02::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-top: 11px solid #60b051;
}

h3.areaMenu#area03 {
  background: #32a8a0;
}
h3.areaMenu#area03::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-top: 11px solid #32a8a0;
}

h3.areaMenu#area04 {
  background: #a2c639;
}
h3.areaMenu#area04::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-top: 11px solid #a2c639;
}

h3.areaMenu#area05 {
  background: #fcb646;
}
h3.areaMenu#area05::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-top: 11px solid #fcb646;
}

h3.areaMenu#area06 {
  background: #e8623b;
}
h3.areaMenu#area06::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-top: 11px solid #e8623b;
}

h3.areaMenu#area07 {
  background: #eea4b9;
}
h3.areaMenu#area07::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-top: 11px solid #eea4b9;
}

h3.areaMenu#area08 {
  background: #e08653;
}
h3.areaMenu#area08::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-top: 11px solid #e08653;
}

.areaWrap+.areaWrap {
  margin-top: 60px;
}

.schoolBlock {
  position: relative;
}

/*tag*/
.regionArticle .eventTab,
.regionArticle .areaTag {
  position: absolute;
  bottom: calc(100% + 2px);
  right: 0;
  padding: 0;
}

.regionArticle .areaTag {
  right: auto;
  left: 0;
}

.regionArticle .eventTab span,
.regionArticle .areaTag span {
  display: inline-block;
  color: #fff;
  background: #9f9f9f;
  border-radius: 3px 3px 0 0;
  font-size: 1.2rem;
  font-weight: bold;
  padding: 0.6em 2em;
}

.regionArticle .eventTab span.LAevent3 {
  background: #4fc482;
}

.regionArticle .eventTab span.LAevent4 {
  background: #ff5685;
}

.regionArticle .eventTab span.LAevent7 {
  background: #09b3cc;
}

.regionArticle .eventTab span.LAevent8 {
  background: #9a5097;
}

.regionArticle .eventTab span.LAevent9 {
  background:  #f7a324;
}

.regionArticle .eventTab span.LAevent10 {
  background:#156ad1;
}
.regionArticle .areaTag span {
  padding: 0.6em 2em;
  margin-right: 10px;
}

.regionArticle .sectionInner {
  padding: 0 20px;

}

.regionArticle .sectionInner.none {
  padding: 20px 20px 60px;
  text-align: center;
  line-height: 1.7;
}

.regionArticle .sectionInner span {
  border-radius: 30px;
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 1em;
}

.regionArticle span.prefecturalTag01,
.regionArticle span.prefecturalTag1 {
  background: #32ade2;
  color: #fff;
}

.regionArticle span.prefecturalTag02,
.regionArticle span.prefecturalTag2 {
  background: #60b051;
  color: #fff;
}

.regionArticle span.prefecturalTag03,
.regionArticle span.prefecturalTag3 {
  background: #32a8a0;
  color: #fff;
}

.regionArticle span.prefecturalTag04,
.regionArticle span.prefecturalTag4 {
  background: #a2c639;
  color: #fff;
}

.regionArticle span.prefecturalTag05,
.regionArticle span.prefecturalTag5 {
  background: #fcb646;
  color: #fff;
}

.regionArticle span.prefecturalTag06,
.regionArticle span.prefecturalTag6 {
  background: #e8623b;
  color: #fff;
}

.regionArticle span.prefecturalTag07,
.regionArticle span.prefecturalTag7 {
  background: #eea4b9;
  color: #fff;
}

.regionArticle span.prefecturalTag08,
.regionArticle span.prefecturalTag8 {
  background: #e08653;
  color: #fff;
}

.regionArticle .sectionInner span.cityTag {
  background: #9f9f9f;
  color: #fff;
  padding: auto 1em;
}

.eventInfo p {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  align-items: baseline;
  font-size: 15px;
  font-weight: bold;
}

.eventInfo p.theme{
  margin: 0;
}

.themeTag {
  text-align: left;
}

.eventInfo img{
  width: 200px;
  border-radius: 1rem;
  z-index: 1;
}
.eventInfo.detail img{
  margin-left: 50px;
}
.themeTag p span {
  display: inline-block;
  padding: 0.5em 0.8em;
  margin-right: 0.5em;
}

.themeTag p span.theme1 {
  /* 女子高校生フェア */
  background-color: #ff99cc;
  color: #fefefe;
}

.themeTag p span.theme2 {
  /* グローバル系フェア */
  background-color: #338833;
  color: #fefefe;
}

.themeTag p span.theme3 {
  /* 理工系フェア */
  background-color: #6699ff;
  color: #fefefe;
}

.themeTag p span.theme4 {
  /* 福祉系フェア */
  background-color: #f86624;
  color: #fefefe;
}

.themeTag p span.theme5 {
  /* 自力進学フェア */
  background-color: #fa7466;
  color: #fefefe;
}

.themeTag p span.theme6 {
  /* 理工系 医療系フェア */
  background-color: #6699ff;
  color: #fefefe;
}

.themeTag p span.theme7 {
  /* グローバル進学×サイエンスフェア */
  background-color: #ffc20c;
  color: #fefefe;
}


/*eventInfo*/

.eventInfo{
  border-bottom: 1px dashed #b5b5b5;
}

.eventInfo p {
  font-size: 15px;
  font-weight: bold;
}

/*p.theme a,
p.theme a span.enki, 
.eventInfo p.theme a span.cancel{
	font-size: 15px ;
	font-weight: bold;
}
.cancel, .enki{
	display: flex;
	align-items: baseline;
}
.cancel .date, .enki .date{
	text-decoration: line-through solid #d91c24  1px;
}
 span.enki_label,  span.cancel_label{
	background: #ffd2d5;
	border: 1px #d91c24 solid;
	border-radius: 3px;
	color: #d91c24;
	display: inline-block;
	padding: 0.2em !important;
	margin-right: 0.5em;
}*/
.eventInfo,
.eventInfo .cancel {
  align-items: center;
  padding-top: 10px!important;
  /* border-bottom:1px dashed #b5b5b5; */
}
.cancel{
  position: relative;
}
.cancel::before{
  content: '';
  z-index: 3;
  top: -101px;
  right: 79%;
  width: 36px;
  height: 80px;
  background: url(../../../img/page/guidance/calendar_head.png) center / contain no-repeat;
  background-size: contain;
}
.dateBox{
  width: fit-content;
  margin: 0 auto;
  position: relative;
}
.dateBox p.date,
.cancel p.date {
  align-items: center;
  font-size: 2.5rem;
  line-height: 1.5;
  text-align: center;
  position: relative;
  margin: 0 1em;
  background-color: #fff;
  width: 3.5em;
  height: 83px;
  border: 2px solid #f7a324;
  border-top: 12px solid #f7a324;
  border-radius: 10px;
  position: absolute;
  top: 16px;
  left: 40px;
  z-index: 100!important;
}
.cancel p.date{
  top: -64px;
  left: -15px;
}
.cancel p.date::before{
  content: '';
  z-index: 3;
  top: -54px;
  right: 35%;
  width: 36px;
  height: 80px;
  background: url(../../../img/page/guidance/calendar_head.png) center / contain no-repeat;
  background-size: contain;
}
.cancel p.date.detail::before{
  content: none;
}
.date.detail{
  align-items: center;
  font-size: 2.5rem;
  line-height: 1.5;
  text-align: center;
  position: relative;
  margin: 0 1em;
  background-color: #fff;
  width: 3.5em;
  height: 83px;
  border: 2px solid #f7a324;
  border-top: 12px solid #f7a324;
  border-radius: 10px;
  position: absolute;
  top: -55px;
  left: -172px;
  z-index: 100 !important;
}


.dateBox.detail p.date{
  height: 83px;
  top: -130px;
  margin: 0 auto;
  left: -45px;
}
.dateBox.detail img{
  margin-left: 45px;
}
.calendar{
  position: relative;
  right: 100px;
  bottom: 33px;
}

.calendar::before{
  content: '';
    z-index: 3;
    top: -25px;
    right: 36%;
    width: 36px;
    height: 80px;
    background: url(../../../img/page/guidance/calendar_head.png) center / contain no-repeat;
    background-size: contain;
}
.calendar.detail::before{
  left: -25px;
  top: -173px
}
/*.dateBox p.date::before, .cancel p.date::before{
  content: '';
  position: absolute;
	top: -15%;
	left: calc(100% + 15px);
	width: 2px;
	height: calc(100% + 15px);
	border-radius: 3px;
	background: #b5b5b5;
}*/
.eventInfo p.date span.week_text {
  font-size: 1.5rem;
}

.eventInfo_left {
  justify-content: center;
  display: flex;
  flex-direction: column;
  margin-left: 20px;
  position: relative;
  width: 277px;
}

.eventInfo_left::before {
  content: '';
  position: absolute;
  top: -10%;
  right: calc(100% + 20px);
  width: 2px;
  height: calc(100% + 5px);
  border-radius: 3px;
  background: #b5b5b5;
}
.eventInfo_left.detail{
  display: block;
}
/* contact */
.contact {
  padding-left: 20px!important;
  position: relative;
}
.contact::before{
display: none;
}
ul.accessicon{
  padding-left: 20px!important;

}
ul.accessicon.address{
  position: relative;
}
ul.accessicon.address::before{
  content: "";
  height: 35px;
  width: 30px;
  bottom: -20%;
  left: -7%;
  background: url(../../../img/page/guidance/address.webp) left no-repeat;
  background-size: contain;
}
ul.accessicon.inaccess{
  position: relative;
  z-index: 10;
}
ul.accessicon.inaccess::before{
  content: "";
  height: 35px;
  width: 30px;
  bottom: 18%;
  left: -7%;
  background: url(../../../img/page/guidance/access.webp) left no-repeat;
  background-size: contain;
}

.contact ul {
  padding: 0;
  margin: 1.5em auto;
}

.contact li {
  margin: 0.5em auto;
  font-size: 1.2rem;
}

.contact li a {
  border: 1px #9f9f9f solid;
  padding: 0.1em 0.5em;
  border-radius: 3px;
  margin-left: 1em;
  color: #9f9f9f;
  display: inline-block;
  margin: 0.5em 0 0 1em;
}
.accesstext{
  width: 100%;
}

.ttlDeco {
  text-align: center;
  line-height: 2;
  font-size: 15px;
  font-weight: bold;
  margin: 0 auto 1.5em 0.5em;
  position: relative;
  padding: 1.5rem;
  text-align: center;
}

/*アイコン仮で入れた*/
.ttlDeco::after {
  content: '';
  width: 22px;
  height: 22px;
}

.ttlDeco.h5school::after {
  bottom: 30%;
  left: 22%;
  background: url("../../../img/page/guidance/icn_ttl_school.svg") left no-repeat;
}

.ttlDeco.h5access::after {
  bottom: 30%;
  left: 33%;
  background: url("../../../img/page/guidance/icn_ttl_access.svg") left no-repeat;
}

/*アイコン仮で入れたend*/
/*.ttlDeco::before{
	position: absolute;
	bottom: 12px;
	left: calc(50% - 15px);
	width: 30px;
	height: 3px;
	content: '';
	border-radius: 3px;
	background: #000;
}
.ttlDeco.area01::before, .ttlDeco.area1::before {
    background: #acd4e3;
}
.ttlDeco.area02::before, .ttlDeco.area2::before {
    background: #afe5a4;
}
.ttlDeco.area03::before, .ttlDeco.area3::before {
    background: #a4d6d1;
}
.ttlDeco.area04::before, .ttlDeco.area4::before {
    background: #c6db7e;
}
.ttlDeco.area05::before, .ttlDeco.area5::before {
    background: #ffdbae;
}
.ttlDeco.area06::before, .ttlDeco.area6::before {
    background: #e8b5a9;
}
.ttlDeco.area07::before, .ttlDeco.area7::before {
    background: #ffe1e9;
}
.ttlDeco.area08::before, .ttlDeco.area8::before {
    background: #e8b9a1;
}*/


/* ------ schoolAll ------ */
.schoolAll {
  margin: 0 auto 2.5em;
  width: 100%;
}

.moreDetail .schoolAll {
  width: 90%;
}

.schoolAll p {
  margin-bottom: 2em;
}

.schoolAll h6#schoolList {
  padding: 1em;
  padding-left: 50px;
  font-size: 1.2rem;
  font-weight: bold;
  position: relative;
  cursor: pointer;
  margin-top: 2em;
  border-radius: 1rem;
  top: 10px;
}

.schoolAll h6.list01,
.schoolAll h6.list1 {
  background: #acd4e3;
}

.schoolAll h6.list02,
.schoolAll h6.list2 {
  background: #afe5a4;
}

.schoolAll h6.list03,
.schoolAll h6.list3 {
  background: #a4d6d1;
}

.schoolAll h6.list04,
.schoolAll h6.list4 {
  background: #c6db7e;
}

.schoolAll h6.list05,
.schoolAll h6.list5 {
  background: #ffdbae;
}

.schoolAll h6.list06,
.schoolAll h6.list6 {
  background: #e8b5a9;
}

.schoolAll h6.list07,
.schoolAll h6.list7 {
  background: #ffe1e9;
}

.schoolAll h6.list08,
.schoolAll h6.list8 {
  background: #e8b9a1;
}

.schoolAll h6#schoolList::before {
  pointer-events: none;
  position: absolute;
  top: 50%;
  right: 35px;
  content: '';
  margin-top: -7px;
  width: 2px;
  height: 15px;
  background: #333;
  transition: all 0.35s 0;
  transform-origin: center center;
}

.schoolAll h6#schoolList::after {
  pointer-events: none;
  position: absolute;
  top: 50%;
  right: 28px;
  content: '';
  margin-top: -1px;
  width: 16px;
  height: 2px;
  background: #333;
  transition: all 0.35s 0;
  transform-origin: center center;
}

.schoolAll h6#schoolList.close::before {
  display: none;
}

.dataForm {
  background:#f5f5f5;
  border-bottom-right-radius:1rem;
  border-bottom-left-radius: 1rem;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  padding-top: 20px;
}

.dataForm li {
  padding:0.2rem 1em;
  font-size: 1.2rem;
  line-height: 1.2;
}

.dataForm li a.aLine01,
.dataForm li a.aLine1 {
  border-bottom: 2px #acd4e3 solid;
}

.dataForm li a.aLine02,
.dataForm li a.aLine2 {
  border-bottom: 2px #afe5a4 solid;
}

.dataForm li a.aLine03,
.dataForm li a.aLine3 {
  border-bottom: 2px #a4d6d1 solid;
}

.dataForm li a.aLine04,
.dataForm li a.aLine4 {
  border-bottom: 2px #c6db7e solid;
}

.dataForm li a.aLine05,
.dataForm li a.aLine5 {
  border-bottom: 2px #ffdbae solid;
}

.dataForm li a.aLine06,
.dataForm li a.aLine6 {
  border-bottom: 2px #e8b5a9 solid;
}

.dataForm li a.aLine07,
.dataForm li a.aLine7 {
  border-bottom: 2px #ffe1e9 solid;
}

.dataForm li a.aLine08,
.dataForm li a.aLine8 {
  border-bottom: 2px #e8b9a1 solid;
}

/* ------ pdfBtn ------ */
.pdfBtn {
  margin-top: 3em;
  text-align: center;
}

.pdfBtn span {
  border: 2px #fff solid;
  box-shadow: 2px 2px 0 #9f9f9f;
  color: #fff;
  font-size: 1.5rem !important;
  position: relative;
  padding: 10px 40px 10px 50px !important;
}

.pdfBtn span::before {
  content: "";
  background: url('/new/_app/_webroot/img/page/guidance/icn_pdf.svg') left no-repeat;
  width: 50%;
  height: 22px;
  left: 14%;
  top: 22%;
}

.pdfBtn span:hover {
  box-shadow: 0 0 0;
  transform: translate(2px, 2px);
  opacity: unset !important;
}

.pdf01 span,
.pdf1 span {
  background: #32ade2;
}

.pdf02 span,
.pdf2 span {
  background: #60b051;
}

.pdf03 span,
.pdf3 span {
  background: #32a8a0;
}

.pdf04 span,
.pdf4 span {
  background: #a2c639;
}

.pdf05 span,
.pdf5 span {
  background: #fcb646;
}

.pdf06 span,
.pdf6 span {
  background: #e8623b;
}

.pdf07 span,
.pdf7 span {
  background: #eea4b9;
}

.pdf08 span,
.pdf8 span {
  background: #e08653;
}

.readMore {
  cursor: pointer;
  font-weight: bold;
  position: relative;
  border: 1px solid;
  padding: 0.5em 25px 0.5em 10px;
  cursor: pointer;
  width: 80%;
  margin: 0 auto 2.5em;
  text-align: center;
}

.readMore::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  width: 10px;
  height: 10px;
  border-left: 2px solid #333;
  border-bottom: 2px solid #333;
  transform-origin: center center;
  transition: all .25s 0s;
  transform: translate(0, -50%) rotate(-45deg);
}

.readMore:hover {
  color: #f7a324;
  border: 1px solid #f7a324;
}

.readMore:hover::before {
  border-left: 2px solid #f7a324;
  border-bottom: 2px solid #f7a324;
}

.schoolBlock.hide {
  display: none;
}

.readMore .closeTxt {
  display: none;
}

.readMore.open .closeTxt {
  display: inline;
}

.readMore.open .openTxt {
  display: none;
}

.readMore.open::before {
  transform: translate(0, -50%) rotate(-225deg);
}

.readMore.hide {
  display: none;
}

.regionArticle .leftBlock h5 {
  margin: 0 auto 10px;
  font-size: 1.2rem;
  line-height: 1.625;
  font-weight: bold;
}

.eventDetail {

  margin: 1em auto;
  background: #f4f4f4;
  padding: 2em;
  font-size: 1.2rem !important;
}


/* ------ moreBlock ------ */
.regionArticle .moreBlock {
  padding-top: 0;
  border-bottom: 1px solid #e5e5e5;
}

.regionArticle .moreBtn {
  cursor: pointer;
  margin: 0 auto;
  padding: 5px;

  text-align: center;
  transition: all 0.25s 0s;
}

.regionArticle .moreBtn span {
  pointer-events: none;
  position: relative;
  padding-right: 44px;
  display: inline-block;
  font-size: 1.3rem;
}

.regionArticle .moreBtn span::before {
  pointer-events: none;
  position: absolute;
  top: 50%;
  right: 0;
  content: '';
  margin-top: -4px;
  width: 8px;
  height: 8px;
  border-left: 1px solid #333;
  border-bottom: 1px solid #333;
  transform-origin: center center;
  transition: all .25s 0s;
}

.regionArticle .moreBtn.close span::before {
  transform: rotate(135deg);
}

.regionArticle .moreBtn.open span::before {
  transform: rotate(-45deg);
}

.regionArticle .moreBtn:hover {
  opacity: 0.75;
}

.regionArticle .newTav {
  margin: 1em;
}

.regionArticle .newTav a {
  color: #f7a324;
  float: right;
  position: relative;
  /*margin-top: 1.5em;*/
}

.regionArticle .newTav a::before {
  content: "";
  background: url('/new/_app/_webroot/img/page/guidance/icn_tab.svg') center center no-repeat;
  width: 20%;
  height: 100%;
  left: -30%;
  top: 50%;
  margin-top: -0.6em;
}


/* ------ forTeacher ------ */
.forTeacher {
  position: relative;
  padding: 4em 0;
}

.forTeacher::before {
  content: "";
  background: url('/new/_app/_webroot/img/page/guidance/img_forteacher.jpg') center center no-repeat;
  background-size: cover;
  width: 100%;
  height: 300px;
  position: absolute;
}

.forTeacher::after {
  content: "";
  background: rgba(255, 255, 255, 0.4);
  width: 100%;
  min-height: 100%;
  opacity: 0.5;
  top: 0;
}

.teacherText {
  position: relative;
  padding: .5em 2em;
  z-index: 5;
}

.teacherText h4 {
  margin: 0 auto;
}

.teacherText p {
  margin: .5em auto;
  color: #090909;
}

.teacherText .point li {
  background: rgba(247, 163, 36, 0.8);
  color: #fff;
  font-size: 1.2rem;
  margin: 1em auto;
  padding: .65em;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.teacherText .point li span {
  font-weight: bold;
  font-size: 2rem;
  margin: 0 .2em;
}

.forTeacher .mail {
  position: relative;
  z-index: 5;
  background: #f7a324;
}

.forTeacher .mail p {
  padding: 1em;
  color: #fff;
}

.forTeacher .mail .mailBtn {
  margin: 1em auto;
  text-align: center;
}

.forTeacher .mail .mailBtn a {
  background: #fff;
  box-shadow: 0 5px 10px 0 rgb(0 0 0 / 15%);
  border-radius: 5px;
  padding: 1.2em .5em 1.2em 2em;
  position: relative;
  display: inline-block;
  width: 55%;
  margin: -1.2em auto;
}

.forTeacher .mail .mailBtn a span {
  position: relative;
}

.forTeacher .mail .mailBtn a span::before {
  content: "";
  background: url('/new/_app/_webroot/img/page/guidance/icn_mail.svg') left no-repeat;
  width: 100%;
  height: 85%;
  left: -20%;
}

.sectionInner.none {
  margin: 1em auto 3em;
  padding: 1em;
}

.sectionInner.none p {
  margin: 1em auto;
}

.sectionInner.none .noneText {
  font-size: 15px;
  font-weight: bold;
  text-align: center;
}

.regionArticle div.areaInner {
  padding: 0 10px;
}

.mousikomiBtn{
  width: 235px;
  margin: 20px auto;
  top: 40px;
  position: relative;
}
.mousikomiBtn.detail{
  width: 233px;
}
.mousikomiBtn a{
  display: block;
  background-color: #ea5a5a;
  color: #fff;
  width: 235px;
  padding: 20px 60px;
  border-radius: 35px;
  font-weight: 700;
  position: relative;
  text-align: center;
  margin-bottom: 20px;
}
.mousikomiBtn.detail a{
  width: 233px;
}
.mousikomiBtn a::before{
  content: "";
  border: 8px solid transparent;
  border-left-color: #fff;
  left: 0.8rem;
  top: calc(50% - 8px);
  position: absolute;
}
.regionArticle.pen::before{
  top: -41px;
  right: -5px;
  width: 36px;
  height: 148px;
}
.regionArticle.pen.detail::before{
  right: 9px;
}

.regionArticle.pen.detail::before{
  right: -4px;

}
.list03.menu1 span{
  position: relative;
}
.list03 span::before{
  content: "";
  bottom: -1%;
  left: -4%;
  height: 39px;
  width: 61px;
  background-size: contain;
}
.list03.menu1 span::before{
  left: -63px;
  bottom: -68%;
  background: url(../../../img/page/guidance/icn_menu1.webp) left no-repeat;
  background-size: contain;
}
.list03.menu2 span::before{
  background: url(../../../img/page/guidance/icn_menu2.webp) left no-repeat;
  background-size: contain;
}
.list03.menu3 span::before{
  background: url(../../../img/page/guidance/icn_menu3.webp) left no-repeat;
  background-size: contain;
}
.list03.menu4 span::before{
  background: url(../../../img/page/guidance/icn_menu4.webp) left no-repeat;
  background-size: contain;
}
.list03.menu5 span::before{
  background: url(../../../img/page/guidance/icn_menu5.webp) left no-repeat;
  background-size: contain;
}
.list03.menu6 span::before{
  background: url(../../../img/page/guidance/icn_menu6.webp) left no-repeat;
  background-size: contain;
}
.list03.menu7 span::before{
  background: url(../../../img/page/guidance/icn_menu7.webp) left no-repeat;
  background-size: contain;
}
.list03.menu8 span::before{
  background: url(../../../img/page/guidance/icn_menu8.webp) left no-repeat;
  background-size: contain;
}
.mapstyle{
 margin: 0 auto;
}


/* ------------------------ PC.css ------------------------ */


@media screen and (min-width:768px) {
  .topicPathWrap p {
    font-size: 1.3rem;
  }

  .topicPathWrap .areaList ul,
  .topicPathWrap .forTeacherBtn,
  .topicPathWrap .regionArticle,
  .topicPathWrap .forTeacher,
  .topicPathWrap .mainTitle {
    max-width: 900px;
    margin: 0 auto;
  }

  .topicPathWrap h2 {
    margin: 0 auto;
    padding: 15px 50px 30px;
    font-size: 3rem;
  }

  .topicPathWrap .tabNavi ul {
    grid-template-columns: 1fr 1fr 240px;
  }

  .topicPathWrap .tabNavi li {
    font-size: 2rem;
  }

  .topicPathWrap .tabNavi li:last-child {
    justify-self: end;
  }

  .topicPathWrap .tabNavi a {
    padding: 20px 5px 10px;
  }

  .topicPathWrap .tabNavi a br {
    display: none;
  }

  .topicPathWrap .tabNavi a[href*="s-kyogikai.com"] {
    padding: 5px 1.75em 5px 0.5em;
    font-size: 1.6rem;
  }

  .regionArticle .areaTag span{
    padding: 0.6em 2em;
    margin-right: 1px;
  }
.eventInfo, .eventInfo .cancel {
    display: flex;
    align-items: center;
    padding-top: 20px;
    padding-left: 150px;
  }
.eventInfo.detail .cancel {
    display: block;
  }
  .eventInfo img{
    width: 215px;
  }

  .BlockflexPc{
    display: flex;
  }

  .access{
    padding: inherit;
  }

  .regionArticle .newTav{
    margin: 1em;
    height: 20px;
  }
  /* ------ mainTitle ------ */
  .mainTitle {
    width: 100%;
    padding-top: 60px;
  }

  .mainTitle ul {
    gap: 15px;
    padding: 60px 0;
  }

  .mainTitle ul li {
    padding: 12px 12px 12px 1.5em;
  }

  .mainTitle ul li.inFree::before{
    left: 42%;
  }

  .mainTitle ul li.parent::before{
    left: 39%;
  }
  .mainTitle ul li.mousikomi_irane::before{
    left: 39%;
  }

  .mainTitle .title figure {
    padding: 0 10px 10px 0;
  }

  .mainTitle .title div {
    padding: 0 1em;
  }

  .mainTitle .title div p {
    line-height: 2.2;
  }

  .chigai {
    width: 70%;
  }

  .chigai li span {
    margin-left: 2.5em;
  }

  .chigai li span::before {
    width: 50px;
    height: 50px;
    background-size: 30px;
    top: -75%;
    margin-left: -2.5em;
  }
  .schoolflexPc{
    column-gap: 0rem;
  }

  /* ------ school Block ------ */
  .schoolBlock .sectionInner {
    padding: 0 40px;
  }

  .schoolBlock h5 {
    font-size: 20px;
    text-align: center;
  }

  .mainArea {
    display: flex;
    flex-direction: column;
  }

  .mainArea img{
    width: 200px;
  }

  .schoolBlock .mainBlock {
    text-align: center;
  }

  .eventInfo p.theme {
    flex-direction: column;
  }

  .eventInfo p.theme span {
    width: fit-content;
  }

  .eventDetail {
    width: 100%;
  }

  .pdfBtn {
    margin: 4em auto 0;
  }


  /* contact table */
  .contact {
    text-align: left;
  }

  /*アイコン仮で入れた*/
  .ttlDeco.h5school::after {
    bottom: 34%;
    left: 28%;
  }

  .ttlDeco.h5access::after {
    bottom: 33%;
    left: 40%;
  }

  /*アイコン仮で入れたend*/


  /* ------ schoolAll ------ */
  .dataForm {
    text-align: left;
    grid-template-columns: 1fr 1fr;
  }

  .dataForm li a {
    line-height: 2;
  }

  /* ------ forTeacherBtn ------ */
  .topicPathWrap .forTeacherBtn {
    margin: 2em auto;
  }

  .forTeacherBtn a {
    width: 50%;
    padding: 0.8em !important;
  }

  .contentRegion .areaList li {
    font-size: 20px !important;
  }

  .forTeacherBtn a {
    font-size: 14px !important;
  }

  .forTeacherBtn a span {
    font-size: 15px;
  }

  .forTeacherBtn a::after {
    top: 45%;
  }

  /* ------ regionArticle ------ */
  /* .eventInfo_left{
    flex-direction: unset;
  }*/
  /*.pclayout_event {
        display: flex;
    flex-direction: column;
  }*/

  /* ------ forTeacher ------ */
  .forTeacher {
    display: flex;
  }

  .forTeacher::before {
    width: 60%;
    height: 400px;
  }

  .teacherText {
    padding: 1.5em 2em;
  }

  .teacherText h4 {
    text-align: center;
    font-size: 20px;
  }

  .teacherText p {
    margin: 2em auto 0;
    width: 80%;
  }

  .teacherText .point li {
    margin: 1.5em auto;
    width: 80%;
  }

  .forTeacher .mail {
    width: 70%;
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  .forTeacher .mail p {
    padding: 2em;
  }

  .forTeacher .mail .mailBtn a {
    font-size: 15px;
    width: 100%;
    padding: 1.2em 2em 1.2rem 4em;
  }

  .sectionInner.none {
    margin: 5em auto;
  }

  .sectionInner.none p {
    text-align: center;
  }

.regionArticle.pen::before {
  content: '';
  z-index: 3;
  top: 15px;
  right: -30px;
  width: 87px;
  height: 107px;
  background: url(../../../img/page/guidance/pencil.png) center / contain no-repeat;
}
.mainTitle .title::after{
  content: '';
  z-index: 3;
  top: 37px;
  right: 0%;
  width: 108px;
  height: 128px;
  background: url(../../../img/page/guidance/pencil.png) center / contain no-repeat;
  transform: rotate(-40deg);
  background-size: contain;
}
.mainTitle .title::before{
  right: 41.5%;
  top: 7px;
  width: 148px;
  height: 80px;
}

.dateBox p.date,
.cancel p.date{
  height: 95px;
}
.cancel p.date{
  height: 90px;
  top: -59px;
  left: -31px;
}
.dateBox p.date.detail{
  top: -173px;
  left: -183px;
}
.calendar::before{
  right: 30%;
}
.schoolAll{
  width: 70%;
}
.list03 span::before{
  content: "";
  bottom: -9%;
  left: -3%;
  height: 56px;
  width: 76px;
  background-size: contain;
}
.list03.menu1 span::before{
  left: -271px;
  background: url(../../../img/page/guidance/icn_menu1.webp) left no-repeat;
  background-size: contain;
  bottom: -80%;
}

.mousikomiBtn{
  width: 185px;
}
.mousikomiBtn a{
  width: 185px;

}

.list03.menu1.detail span::before{
  left: -71px;
}
.calendar.detail::before{
  left: -133px;
  top: -95px;
}
.contact {
  padding-left: 63px !important;
  position: relative;
}
.contact::before{
  display:block;
  content: "";
  z-index: 3;
  top: 21px;
  right: 4%;
  width: 120px;
  height: 164px;
  background: url(../../../img/page/guidance/map_girl.webp) center / contain no-repeat;
  background-size: contain;
}

ul.accessicon.address::before{
  width: 35px;
  bottom: -9%;
  left: -5%;
}
ul.accessicon.inaccess::before{
  width: 35px;
  bottom: 9%;
  left: -5.1%;
}
.accesstext{
  width: 500px;
  margin: 0!important;
}
.cancel::before{
  right: 54%;
}
}
/* ------------------------ detail.css ------------------------ */
.contentRegion.detail {
  padding: 1em;
}
.eventInfo_left.detail{
  width: 100%;
}
.detail .contact ul:first-child {
  margin-top: -0.5em;
}

.accessDetail p {
  font-size: 1.2rem !important;
  margin-bottom: 3em;
  text-align: left;
}

.schoolAll p.attention {
  font-size: 1.2rem;
}

.date.detail{
  top: -56px ;
  left: -169px ;
}
.cancel .date.detail{
  top: -147px;
  left: 102px;
}
<<<<<<< .working
.date.detail{
  top: -56px ;
  left: -169px ;
}
||||||| .merge-left.r1853
.date.detail{
  top: -56px !important;
  left: -303px !important;
}
=======
>>>>>>> .merge-right.r1854
.cancel .date.detail{
  top: -147px;
  left: 102px;
}
/*アイコン仮で入れた*/
.contentRegion.detail .ttlDeco.h5school::after {
  left: 11%;
}

.contentRegion.detail .ttlDeco.h5access::after {
  left: 31%;
}
.cancel::before {
  display:none;
}
/*アイコン仮で入れたend*/

@media screen and (min-width:768px) {
  .contentRegion.detail .eventInfo {
    max-width: 100%;
  }

  .contentRegion.detail .eventInfo p.date {
    font-size: 20px;
    text-align: left
  }

  /*アイコン仮で入れた*/
  .contentRegion.detail .ttlDeco.h5school::after {
    left: 30%;
  }

  .contentRegion.detail .ttlDeco.h5access::after {
    left: 40%;
  }

  /*アイコン仮で入れたend*/
  .mousikomiBtn a{
    padding: 20px 10px;
  }
  .eventInfo.detail .cancel{
    padding-left: 55px;
  }
  .cancel p.date.detail{
    height: 80px;
    top: -55px;
    left: -170px;
  }
  .dateBox.detail p.date {
    left: -151px;
    top: -54px;
}
}