@charset "utf-8";

/*=====================================
common
=====================================*/

html {
  font-size: 62.5%;
}
body {
  font-size: 1.4em;
}

#mainContent {
	width: 1062px;
	overflow: inherit;
}
#mainContent::after {
  content: "";
  display: block;
  clear: both;
}

.ocWrap2021 {
	width: 1062px;
	color: #333333;
  margin: 0 auto;
}

.ocWrap2021 * {
	box-sizing: border-box;
}

.searchMainArea {
	padding: 0 42px 100px;
}

.searchMainArea section + section {
	margin-top: 120px;
}

.searchMainArea a {
	color: #333;
	transition: 0.2s linear;
}

.searchMainArea a:hover {
	color: #FF9600;
	text-decoration: none;
}


/*=====================================
header
=====================================*/

.header2021 {
	width: 1062px;
	margin: 0 auto;
}

.header2021 a {
	color: #333;
}

.header2021 .abv {
	position: relative;
	height: 90px;
}

.header2021 .abv > p,
.header2021 .abv > div {
	position: absolute;
}

.header2021 .abv .logo {
	width: auto;
	top: 30px;
	left: 20px;
}

.header2021 .abv .topLink {
	top: 0;
	right: 0;
}

.header2021 .abv .topLink a {
	font-size: 12px;
}

.header2021 .abv .bloc-search {
	width: 300px;
	top: 30px;
  left: 370px;
}

.header2021 .abv .bloc-search input {
	width: 240px;
	outline: none;
}

.header2021 .abv .bloc-search a.search-button {
	background: #C7C7C7 url(https://school.js88.com/img/common/icon-search.png) no-repeat right 10px center;
  width: 16px;
  height: 12px;
  color: white;
  font-size: 16px;
  padding: 12px 0 10px 22px !important;
  text-align: left;
}

.header2021 .abv .link {
	top: 30px;
  right: 0;
}

.header2021 .abv .link a:nth-child(1) {
	background: url(icon1.gif) no-repeat center top;
}

.header2021 .abv .link a:nth-child(2) {
	background: url(icon2.gif) no-repeat center top;
}

.header2021 .abv .link a:nth-child(3) {
	background: url(icon3.gif) no-repeat center top;
}

.header2021 .abv .link a  {
	display: inline-block;
  width: 120px;
  font-size: 11px;
  text-align: center;
  height: 50px;
  padding-top: 26px;
  position: relative;
}

.header2021 .abv .link a .num {
	position: absolute;
	top: -10px;
  right: 20px;
	background: #ff0000;
  border-radius: 50%;
  color: white;
  font-weight: bold;
  width: 25px;
  height: 25px;
  display: block;
  line-height: 1;
  padding-top: 8px;
  box-sizing: border-box;
}

.header2021 .btm {
	display: flex;
	justify-content: space-between;
	border-top: 1px solid #C7C7C7;
  border-bottom: 1px solid #C7C7C7;
  padding: 10px 20px;
  text-align: center;
  margin-bottom: 20px;
}

.header2021 .btm a {
	font-family: "Hiragino Mincho ProN W6", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.header2021 .btm ul {
	width: 40%;
	display: flex;
}

.header2021 .btm ul:first-child li a {
	font-size: 17px;
	padding: 5px 16px 0;
	display: flex;
  flex-direction: column;
  justify-content: center;
}

.header2021 .btm ul:first-child li:first-child {
	border-left: 1px solid #C7C7C7;
}

.header2021 .btm ul:first-child li {
	border-right: 1px solid #C7C7C7;
	display: block;
}

.header2021 .btm ul:last-child {
	flex-wrap: wrap;
	width: 60%
}

.header2021 .btm ul:last-child li {
	margin-left: 40px;
}


/*========== section title ==========*/

.searchMainArea p.secttl {
	font-size: 14px;
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	color: #8C8C8C;
	text-align: center;
  border-bottom: 1px solid #C7C7C7;
  margin-bottom: 50px;
  padding-bottom: 30px;
	line-height: 1;
}

.searchMainArea p.secttl span {
	color: #333;
	font-size: 40px;
	font-family: "Hiragino Mincho ProN W6", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	padding-bottom: 21px;
	display: block;
	font-weight: bold;
}


/*========== link box ==========*/

ul.list {
	display: flex;
	flex-wrap: wrap;
}

ul.list li {
	font-size: 18px;
	margin-bottom: 20px;
}

ul.list.row4 li {
	margin-right: 19px;
}

ul.list.row4 li:nth-of-type(4n) {
	margin-right: 0px;
}

ul.list li a {
	display: block;
	padding: 14px 0;
	text-align: center;
	border: 1px solid #707070;
	width: 230px;
	transition: 0.2s linear
}

ul.list li a:hover {
	border-color: #FF9600;
	opacity: .7;
}

ul.list li.short a {
  line-height: 1.2;
  padding: 7px 0;
}


/*=====================================
search box
=====================================*/

.mv {
	background: url(/oc2021/mv.jpg) no-repeat left top;
	width: 100%;
	height: 450px;
	position: relative;
	margin-bottom: 40px;
	background-size: contain;
}

.mv .searchArea {
	background:rgba(255,255,255,0.7);
	padding: 26px;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
}

.searchTbl {
  width: 100%;
  border-collapse: separate;
  table-layout: fixed;
}

.searchTbl td {
  border: 1px solid #C7C7C7;
  border-right: none;
}

.searchTbl td:first-child {
  border-radius: 3px 0 0 3px;
}

.searchTbl td:last-child {
  border-radius: 0 3px 3px 0;
  border-right: 1px solid #C7C7C7;
  width: 100px !important;
  background: #3C58A2 url(https://school.js88.com/img/common/icon-search.png) no-repeat right 15px center;
}

.searchTbl td:last-child a {
  display: block;
  color: white;
  font-size: 16px;
  padding-left: 20px;
  padding: 10px 10px 10px 20px;
  text-decoration: none;
}

div:not(.searchArea.all) .searchTbl td:nth-child(4) {
	width: 190px;
}

div:not(.searchArea.all) .searchTbl td:nth-child(5) {
	width: 250px;
}

.searchTbl td p {
  background: #3C58A2;
  color: white;
  display: inline-block;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  padding: 5px 2px;
}

.searchTbl td p.letter2 {
  padding: 9px 2px;
}

.searchTbl td p.sfont {
	padding: 4px 2px 0 2px;
	font-size: 10px;
}

.searchTbl td > div  {
  display: flex;
  height: 48px;
}

.searchTbl td div div,
.searchTbl td div .calenderCell  {
  font-size: 14px;
  color: #333;
  width: 100%;
  padding-top: 12px;
  padding-left: 10px;
  cursor: pointer;
}

.searchTbl td div div.open,
.searchTbl td div .calenderCell.open {
  border-bottom: 4px solid #ff0000;
}

.searchTbl td div .calenderCell {
	position: relative;
	color: #C7C7C7;
	border: none;
	outline: none;
	padding-top: 0;
}

.calenderdiv span {
	position: relative;
}

.calenderdiv span::after {
	position: absolute;
	top: 14px;
	right: 10px;
	content: "▼";
	font-size: 14px;
}

.calenderdiv span:first-of-type::before {
	position: absolute;
  left: -6px;
  content: "～";
  top: 14px;
  z-index: 10;
	font-size: 14px;
}

.ocWrap2021 .searchArea .inner {
  position: relative;
}

.ocWrap2021 .pulldownArea {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 100;
  width: 100%;
}

.ocWrap2021 .pulldownArea .areaInner {
  position: relative;
}

.ocWrap2021 .pulldownArea .areaInner .listwrap {
  position: absolute;
  border: 1px solid #C7C7C7;
  border-top: none;
  top: 0;
  background: white;
  display: flex;
  box-shadow: 2px 2px 2px #C7C7C7;
}
.adjust_height.listwrap {
  width: max-content;
  height: 450px;
  overflow-y: auto;
}
.ocWrap2021 .pulldownArea .areaInner .listwrap ul.cate {
	height: fit-content;
}
.detail ul.cate_jobgenre li.jobgroup,
.detail2 ul.cate_jobgenre li.jobgenre,
.adjust_height ul.cate li:nth-child(1) {
	font-size: 16px !important;
	font-weight: bold;
}
.detail ul.cate_jobgenre li.jobgenre,
.adjust_height ul.cate li:nth-child(n+2),
.adjust_height .detail2 ul li.job {
  text-indent: 1em;
}

/*------ プルダウン位置 ------*/
.ocWrap2021 .searchArea .pulldownArea .areaInner .listwrap:nth-child(1) {left: 0;}
.ocWrap2021 .searchArea .pulldownArea .areaInner .listwrap:nth-child(2) {left: 156px;}
.ocWrap2021 .searchArea .pulldownArea .areaInner .listwrap:nth-child(3) {left: 313px;}
.ocWrap2021 .searchArea .pulldownArea .areaInner .listwrap:nth-child(4) {left: 470px;}
.ocWrap2021 .searchArea .pulldownArea .areaInner .listwrap:nth-child(5) {left: 660px;}

/*------ すべてプルダウン位置 ------*/
.ocWrap2021 .searchArea.all .pulldownArea .areaInner .listwrap:nth-child(2) {left: 303px;}
.ocWrap2021 .searchArea.all .pulldownArea .areaInner .listwrap:nth-child(3) {left: 606px;}


/*------ プルダウン　セル設定 ------*/
.ocWrap2021 .pulldownArea .areaInner .listwrap ul.cate li,
.ocWrap2021 .pulldownArea .areaInner .listwrap .detail ul li,
.ocWrap2021 .pulldownArea .areaInner .listwrap .detail2 ul li {
  padding: 10px;
  font-size: 14px;
  cursor: pointer;
  min-width: 120px;
}

.ocWrap2021 .pulldownArea .areaInner .listwrap ul.cate li:hover,
.ocWrap2021 .pulldownArea .areaInner .listwrap .detail ul li:hover,
.ocWrap2021 .pulldownArea .areaInner .listwrap .detail2 ul li:hover {
  background: #3C58A2;
  color: white;
}

.ocWrap2021 .pulldownArea .areaInner .listwrap .detail,
.ocWrap2021 .pulldownArea .areaInner .listwrap .detail2 {
  border-left: 1px solid #C7C7C7;
}


/*------ プルダウン　カレンダー周り設定 ------*/

.ui-datepicker {
	background: white;
	text-align: center;
	color: #333;
	border: 1px solid #C7C7C7;
  box-shadow: 2px 2px 2px #c7c7c7;
}

.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding-top: 5px;
	margin-bottom: 10px;
}

.ui-datepicker-title {
	font-size: 15px;
	font-family: "Hiragino Mincho ProN W6", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	border-bottom: 2px dotted #1981E8;
	display: inline-block;
}

.ui-datepicker-title span.ui-datepicker-month {
	font-size: 24px;
}

.ui-datepicker .ui-datepicker-header a {
	color: #C7C7C7;
	position: absolute;
	top: 14px;
	border: 1px solid #C7C7C7;
	padding: 4px 15px;
  font-size: 10px;
}

.ui-datepicker .ui-datepicker-header a.ui-datepicker-prev {
	left: 10px;
}

.ui-datepicker .ui-datepicker-header a.ui-datepicker-next {
	right: 10px;
}

table.ui-datepicker-calendar {
	width: 300px;
	text-align: center;
	color: #333;
	box-sizing: border-box;
}

table.ui-datepicker-calendar th span {
	font-size: 12px;
}

table.ui-datepicker-calendar th:nth-of-type(6) span {
	color: #1981E8;
}

table.ui-datepicker-calendar th:nth-of-type(7) span {
	color: #FF0000;
}

table.ui-datepicker-calendar {
	font-size: 15px;
}

table.ui-datepicker-calendar .past {
	color: #C7C7C7;
}

table.ui-datepicker-calendar th {
	text-align: center;
	font-weight: normal;
}

table.ui-datepicker-calendar td {
	padding: 9px 0;
	line-height: 1.2;
}

table.ui-datepicker-calendar td span {
	font-size: 12px;
}

table.ui-datepicker-calendar td span span {
	font-size: 10px;
}

table.ui-datepicker-calendar td a {
	color: #333;
}


/*------ keyword検索窓 ------*/

.ocWrap2021 .bloc-search {
	width: 840px;
	margin: 0 auto;
}

.ocWrap2021 .bloc-search input[type="text"] {
	width: 780px;
  height: 38px;
  outline: none;
}

.ocWrap2021 .bloc-search input::placeholder {
  color: #C7C7C7;
  font-size: 18px;
}

.ocWrap2021 .bloc-search a.search-button {
	background: #3C58A2 url(https://school.js88.com/img/common/icon-search.png) no-repeat right 10px center;
	width: 102px;
	height: 48px;
	color: white;
	font-size: 16px;
	padding: 12px 0 10px 22px !important;
  text-align: left;
}


/*=====================================
anchor link
=====================================*/

.searchMainArea ul.anchor {
	display: flex;
	justify-content: space-around;
	margin-bottom: 120px;
}

.searchMainArea ul.anchor li {
	font-family: "Hiragino Mincho ProN W6", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-size: 15px;
	position: relative;
}

.searchMainArea ul.anchor li span {
	font-size: 18px;
}

.searchMainArea ul.anchor li::after {
	position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  border-right: 1px solid #8C8C8C;
  border-bottom: 1px solid #8C8C8C;
  transform: rotate(45deg);
  right: -30px;
  top: calc(50% - 8px);
}

/*=====================================
Search by deviation value(dai)
=====================================*/

section.dai .figLeft {
	display: flex;
}

section.dai .figLeft figure {
	padding-right: 40px;
	margin: 0;
}

section.dai ul.list li {
	margin-right: 19px
}

section.dai ul.list li a {
	width: 220px;
}

section.dai ul.list li:nth-of-type(3n) {
	margin-right: 0px;
}



/*=====================================
Search from photos・videos
=====================================*/

section.photo p.secttl {
	border-bottom: none;
	margin-bottom: 18px;
	padding-bottom: 0px;
}

section.photo ul.tab {
	display: flex;
	justify-content: space-around;
}

section.photo ul.tab li {
	font-size: 30px;
	font-family: "Hiragino Mincho ProN W6", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: bold;
  width: 50%;
  text-align: center;
  padding-bottom: 25px;
  line-height: 1;
  border-bottom: 1px solid #C7C7C7;
	cursor: pointer;
}

section.photo ul.tab li.on {
	border-bottom: 3px solid #3C58A2;
}

.tabCnt .cell {
	display: none;
	overflow: hidden;
	padding: 50px 0px;
}

.tabCnt .cell.show {
	display: block;
}

.tabCnt .cell ul.list li {
	font-size: 16px;
}

.tabCnt .cell ul.list li a {
	width: 135px;
	padding: 10px;
}

.tabCnt .cell div,
.tabCnt .cell ul {
	float: left;
}

.tabCnt .cell div:first-child {
	width: 250px;
	margin-right: 6px;
}

.tabCnt .cell div:last-child {
	width: 286px;
	margin-left: 6px;
	float: right;
}

.tabCnt .cell ul.list2 {
	display: flex;
	flex-wrap: wrap;
	width: 430px;
}

.tabCnt .cell ul.list2 li {
	width: 135px;
	text-align: center;
	margin: 0 10px 10px 0;
}

.tabCnt .cell ul.list2 li:nth-child(3n) {
	margin-right: 0;
}

.tabCnt .cell ul.list2 li a {
	display: block;
	padding: 5px 0;
	font-size: 16px;
	border: 1px solid #707070;
	transition: 0.2s linear
}

.tabCnt .cell ul.list2 li a:hover {
	border-color: #FF9600;
	opacity: .7;
}


/*=====================================
Search from location
=====================================*/

.mapArea {
	background: url(https://school.js88.com/oc2021/map.gif) no-repeat center top;
	position: relative;
	height: 500px;
}

.mapArea > ul {
	position: absolute;
	width: 160px;
	overflow: hidden;
}

.mapArea ul li ul li {
	float: left;
	margin-right: 12px;
}

.mapArea ul li ul li a {
	font-size: 14px;
}

/*========== pref position ==========*/

.mapArea > ul:nth-child(1) {
	top: 10px;
  right: 120px;
}
.mapArea > ul:nth-child(2) {
	top: 120px;
  right: 180px;
}
.mapArea > ul:nth-child(3) {
	top: 230px;
  right: 150px;
}
.mapArea > ul:nth-child(4) {
	top: 70px;
  left: 390px;
  width: 120px;
}
.mapArea > ul:nth-child(5) {
  top: 180px;
  left: 350px;
  width: 120px;
}
.mapArea > ul:nth-child(6) {
	bottom: 120px;
	left: 510px;
  width: 120px;
}
.mapArea > ul:nth-child(7) {
	bottom: 20px;
	left: 370px;
	width: 140px;
}
.mapArea > ul:nth-child(8) {
	top: 120px;
	left: 140px;
}
.mapArea > ul:nth-child(9) {
	bottom: 140px;
	left: 140px;
	width: 130px;
}


/*========== pref colour ==========*/

.mapArea > ul p {
	margin-bottom: 10px;
	width: 100%;
	font-size: 14px;
	position: relative;
}
.mapArea > ul p::before,
.mapArea > ul p::after {
	content: "";
	position: absolute;
	border-bottom: 1px solid transparent;
  right: 0;
}
.mapArea > ul p::before {
	width: 20px;
  bottom: 10px;
}
.mapArea > ul p::after {
  width: 6px;
  bottom: 12px;
  transform: rotate(45deg);
}
.mapArea > ul:nth-child(1) p {
	color: #F59795;
	border-bottom: 3px solid #F59795;
	width: 100px;
}
.mapArea > ul:nth-child(2) p {
	color: #F9A75D;
	border-bottom: 3px solid #F9A75D;
}
.mapArea > ul:nth-child(3) p {
	color: #D4E05A;
	border-bottom: 3px solid #D4E05A;
}
.mapArea > ul:nth-child(4) p {
	color: #FFDE4E;
	border-bottom: 3px solid #FFDE4E;
}
.mapArea > ul:nth-child(5) p {
	color: #A9DBF7;
	border-bottom: 3px solid #A9DBF7;
}
.mapArea > ul:nth-child(6) p {
	color: #9CD19C;
	border-bottom: 3px solid #9CD19C;
}
.mapArea > ul:nth-child(7) p {
	color: #61A9C9;
	border-bottom: 3px solid #61A9C9;
}
.mapArea > ul:nth-child(8) p {
	color: #F9B9F7;
	border-bottom: 3px solid #F9B9F7;
}
.mapArea > ul:nth-child(9) p {
	color: #C797C4;
	border-bottom: 3px solid #C797C4;
}

.mapArea > ul p a:not(:hover) {color: inherit;}

/* arrow colour */
.mapArea > ul:nth-child(1) p::before, .mapArea > ul:nth-child(1) p::after {border-color: #F59795;}
.mapArea > ul:nth-child(2) p::before, .mapArea > ul:nth-child(2) p::after {border-color: #F9A75D;}
.mapArea > ul:nth-child(3) p::before, .mapArea > ul:nth-child(3) p::after {border-color: #D4E05A;}
.mapArea > ul:nth-child(4) p::before, .mapArea > ul:nth-child(4) p::after {border-color: #FFDE4E;}
.mapArea > ul:nth-child(5) p::before, .mapArea > ul:nth-child(5) p::after {border-color: #A9DBF7;}
.mapArea > ul:nth-child(6) p::before, .mapArea > ul:nth-child(6) p::after {border-color: #9CD19C;}
.mapArea > ul:nth-child(7) p::before, .mapArea > ul:nth-child(7) p::after {border-color: #61A9C9;}
.mapArea > ul:nth-child(8) p::before, .mapArea > ul:nth-child(8) p::after {border-color: #F9B9F7;}
.mapArea > ul:nth-child(9) p::before, .mapArea > ul:nth-child(9) p::after {border-color: #C797C4;}



/*=====================================
Search by date
=====================================*/

.caleArea {
	padding-left: 20px;
}

.css_schoolapi {
	overflow: hidden;
}

.css_schoolapi .calender_wrap {
	float: left;
}

.calender_head2 {
	text-align: center;
	margin-bottom: 32px;
}

.calender_head2 .this_month {
	font-size: 15px;
	font-family: "Hiragino Mincho ProN W6", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	border-bottom: 2px dotted #1981E8;
	display: inline-block;
}

.calender_head2 .this_month span {
	font-size: 24px;
}

.calender_content2 table {
	width: 300px;
	text-align: center;
	color: #333;
}

.calender_content2 table .saturday {
	color: #1981E8;
}

.calender_content2 table .sunday {
	color: #FF0000;
}

.calender_content2 table .week {
	font-size: 15px;
}

.calender_content2 table .week .past {
	color: #C7C7C7;
}

.calender_content2 table td {
	padding: 9px 0;
	line-height: 1.2;
}

.calender_content2 table .week td span {
	font-size: 12px;
}

.calender_content2 table .week td span span {
	font-size: 10px;
}

/*---------- bx-slider ----------*/

.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 60%;
	width: 50px;
	height: 50px;
  text-indent: -9999px;
  z-index: 9999;
}

.bx-wrapper {
	box-shadow: none;
}

.bx-wrapper .bx-prev,
.bx-wrapper .bx-next {
	background: #98A8C4CC;
	border-radius: 50%;
	position: relative;
}

.bx-wrapper .bx-prev {
	left: -55px;
}

.bx-wrapper .bx-next {
	right: -55px;
}

.bx-wrapper .bx-prev::after,
.bx-wrapper .bx-next::after {
	position: absolute;
	content: "";
	width: 12px;
	height: 12px;
	border: 3px solid transparent;
}

.bx-wrapper .bx-prev::after {
	border-left-color: white;
	border-bottom-color: white;
	top: 16px;
	left: 20px;
	transform: rotate(45deg);
}

.bx-wrapper .bx-next::after {
	border-right-color: white;
	border-bottom-color: white;
	top: 16px;
	right: 20px;
	transform: rotate(-45deg);
}


/*=====================================
Search by type
=====================================*/

section.type ul {
	padding: 0 40px;
	display: flex;
	justify-content: space-between;
}

section.type ul li {
	height: 240px;
	width: 20%;
	text-align: center;
	position: relative;
}

section.type ul li:nth-child(4) {
	width: 30%;
}

section.type ul li:nth-child(1) a {
	background: url(/oc2021/fig1.jpg) no-repeat center top;
}

section.type ul li:nth-child(2) a {
	background: url(/oc2021/fig2.jpg) no-repeat center top;
}

section.type ul li:nth-child(3) a {
	background: url(/oc2021/fig3.jpg) no-repeat center top;
}

section.type ul li:nth-child(4) a {
	background: url(/oc2021/fig4.jpg) no-repeat center top;
}

section.type ul li a {
	display: block;
	width: 100%;
  height: 100%;
}

section.type ul li a:hover {
	opacity: .7;
}

section.type ul li p {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	font-size: 18px;
	font-family: "Hiragino Mincho ProN W6", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}


/*=====================================
Search for open campus
=====================================*/

section.others .subttl {
	font-size: 30px;
	font-family: "Hiragino Mincho ProN W6", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: bold;
	margin-bottom: 20px;
}

section.others ul.list +p.subttl {
	margin-top: 40px;
}



/*==========================================================================

#53056　高校を探す

==========================================================================*/

/*=====================================
bxslider
=====================================*/

.slideArea {
	padding: 0 42px;
	margin-bottom: 150px;
}

.bx-wrapper .bx-controls-direction a {
	top: calc(50% - 10px);
}

.slideArea .bx-wrapper .bx-prev {
	left: 0;
	
}
.slideArea .bx-wrapper .bx-next {
	right: 0;
}

.slideArea .bx-wrapper .bx-pager.bx-default-pager a {
	background: #CCCCCC;
}

.slideArea .bx-wrapper .bx-pager.bx-default-pager a:hover,
.slideArea .bx-wrapper .bx-pager.bx-default-pager a.active,
.slideArea .bx-wrapper .bx-pager.bx-default-pager a:focus {
	background: #FF0000
}

.slideArea .bx-pager-item + .bx-pager-item {
	margin-left: 6px;
}


/*=====================================
Search by school name
=====================================*/

.searchMainArea section.sclName p.secttl,
.searchMainArea section.news p.secttl {
	border-bottom: none;
	margin-bottom: 0;
}

/*=====================================
Search from the entrance exam
=====================================*/

section.exam .figLeft {
	display: flex;
	align-items: flex-start
}

section.exam .figLeft figure {
	padding-right: 40px;
	margin: 0;
}

section.exam ul.list li {
	margin-right: 30px
}

section.exam ul.list li a {
	width: 335px;
}

section.exam ul.list li:nth-of-type(2n) {
	margin-right: 0px;
}


/*=====================================
Search by occupation
=====================================*/

section.occ ul.jobList {
  border-collapse: collapse;
  display: flex;
  flex-wrap: wrap;
  border-right: 1px solid #707070;
  border-bottom: 1px solid #707070;
}

section.occ ul.jobList a {
  display: block;
  padding: 14px 0;
  text-align: center;
  border: 1px solid #707070;
  border-bottom: none;
  border-right: none;
  transition: 0.2s linear;
	width: 25%;
	height: 120px;
	background-repeat: no-repeat;
	background-size: 110px auto;
	background-position: left top 10px;
}

section.occ ul.jobList a:hover {
  border: 1px solid #FF9600;
  border-bottom: none;
  border-right: none;
}

section.occ ul.jobList a:nth-child(1) {background-image: url(/scl_sen/img/joblist/genre01.png);}
section.occ ul.jobList a:nth-child(2) {background-image: url(/scl_sen/img/joblist/genre02.png);}
section.occ ul.jobList a:nth-child(3) {background-image: url(/scl_sen/img/joblist/genre03.png);}
section.occ ul.jobList a:nth-child(4) {background-image: url(/scl_sen/img/joblist/genre04.png);}
section.occ ul.jobList a:nth-child(5) {background-image: url(/scl_sen/img/joblist/genre05.png);}
section.occ ul.jobList a:nth-child(6) {background-image: url(/scl_sen/img/joblist/genre06.png);}
section.occ ul.jobList a:nth-child(7) {background-image: url(/scl_sen/img/joblist/genre07.png);}
section.occ ul.jobList a:nth-child(8) {background-image: url(/scl_sen/img/joblist/genre08.png);}
section.occ ul.jobList a:nth-child(9) {background-image: url(/scl_sen/img/joblist/genre09.png);}
section.occ ul.jobList a:nth-child(10) {background-image: url(/scl_sen/img/joblist/genre10.png);}
section.occ ul.jobList a:nth-child(11) {background-image: url(/scl_sen/img/joblist/genre11.png);}
section.occ ul.jobList a:nth-child(12) {background-image: url(/scl_sen/img/joblist/genre12.png);}
section.occ ul.jobList a:nth-child(13) {background-image: url(/scl_sen/img/joblist/genre13.png);}
section.occ ul.jobList a:nth-child(14) {background-image: url(/scl_sen/img/joblist/genre14.png);}
section.occ ul.jobList a:nth-child(15) {background-image: url(/scl_sen/img/joblist/genre15.png);}
section.occ ul.jobList a:nth-child(16) {background-image: url(/scl_sen/img/joblist/genre16.png);}
section.occ ul.jobList a:nth-child(17) {background-image: url(/scl_sen/img/joblist/genre17.png);}
section.occ ul.jobList a:nth-child(18) {background-image: url(/scl_sen/img/joblist/genre18.png);}
section.occ ul.jobList a:nth-child(19) {background-image: url(/scl_sen/img/joblist/genre19.png);}
section.occ ul.jobList a:nth-child(20) {background-image: url(/scl_sen/img/joblist/genre20.png);}
section.occ ul.jobList a:nth-child(21) {background-image: url(/scl_sen/img/joblist/genre21.png);}
section.occ ul.jobList a:nth-child(22) {background-image: url(/scl_sen/img/joblist/genre22.png);}

section.occ ul.jobList li {
	position: relative;
}

section.occ ul.jobList li span {
	position: absolute;
  right: 10px;
  top: 20px;
  width: 50%;
  background: white;
  font-size: 18px;
}

section.occ ul.jobList a:nth-child(8) li span,
section.occ ul.jobList a:nth-child(16) li span {
	top: 10px;
}


/*=====================================
Search by occupation
=====================================*/

section.senphoto .cell {
	overflow: hidden;
}

section.senphoto .cell div,
section.senphoto .cell ul {
	float: left;
}

section.senphoto .cell div:first-child {
	width: 250px;
	margin-right: 6px;
}

section.senphoto .cell div:last-child {
	width: 286px;
	margin-left: 6px;
	float: right;
}

section.senphoto .cell ul.list2 {
	display: flex;
	flex-wrap: wrap;
	width: 430px;
}

section.senphoto .cell ul.list2 li {
	width: 135px;
	text-align: center;
	margin: 0 10px 10px 0;
}

section.senphoto .cell ul.list2 li:nth-child(3n) {
	margin-right: 0;
}

section.senphoto .cell ul.list2 li a {
	display: block;
	padding: 8px 0;
	font-size: 16px;
	border: 1px solid #707070;
	transition: 0.2s linear
}

section.senphoto .cell ul.list2 li a:hover {
	border-color: #FF9600;
	opacity: .7;
}


/*=====================================
Search from seniors
=====================================*/

section.seniors ul {
	padding: 0 40px;
	display: flex;
	/*justify-content: space-between;*/
}

section.seniors ul li {
	height: 280px;
	width: 33%;
	text-align: center;
	position: relative;
}

section.seniors ul li a {
	display: block;
	width: 100%;
  height: 100%;
  font-weight: bold;
  transition: 0.2s linear;
}

section.seniors ul li a:hover {
	opacity: .7;
}

section.seniors ul li:nth-child(1) a {
	background: url(ob1.jpg) no-repeat center top;
}

section.seniors ul li:nth-child(2) a {
	background: url(ob2.jpg) no-repeat center top;
}

section.seniors ul li:nth-child(3) a {
	background: url(ob3.jpg) no-repeat center top;
}

section.seniors ul li p {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	font-size: 18px;
}


/*=====================================
Search from seniors
=====================================*/

section.news ul.arrowList {
	margin-bottom: 40px;
}

section.news ul.arrowList li {
	margin-bottom: 10px;
}

section.news ul.arrowList li::before {
	content: "＞";
	margin-right: 15px;
	font-size: 15px;
}

section.news ul.arrowList li a {
	font-size: 16px;
}

section.news a.moreBtn {
	display: block;
	width: 200px;
	text-align: center;
	border: 1px solid #707070;
	font-size: 20px;
	padding: 10px 0;
	margin: 0 auto;
}

section.news a.moreBtn:hover {
	border: 1px solid #FF9600;
}

/*=====================================
Search by qualification
=====================================*/

.qualifications ul.list li:nth-child(8) a {
	font-size: 15px;
        line-height: 28.8px;
}
.qualifications ul.list li:nth-child(16) a  {
	font-size: 12px;
        line-height: 28.8px;
}
.qualifications ul.list li:nth-child(21),
.qualifications ul.list li:nth-child(22) {
	margin-bottom: 0;
}