@charset "UTF-8";
/* Reset and base styles */
html {
	scroll-padding-top: 130px;
}
@media (max-width:1280px) {
	html {
		scroll-padding-top:76px;
	}
}

body {
	font-family: "Noto Serif JP", serif;
	line-height: 1.6;
	color: #29375B;
	font-weight: 500;
}
@media (max-width: 768px) {
	body {
		font-size:clamp(12px,3.7vw,16px);
	}
}

h2, h3, h4, span {
  letter-spacing: 1.5px;
}
.fw_b {
    font-weight: bold;
}
.text_und {
    text-decoration: underline;
}
.ta_c{
	text-align: center;
}
.ta_r{
	text-align: right;
}
.ta_l{
	text-align: left;
}

.f_l{
	float:left;
}
.f_r{
	float:right;
}
.clearfix{
	zoom:100%;
}
.clearfix:after{
	content:"";
	clear:both;
	height:0;
	display:block;
	visibility:hidden;
}

strong {
  background: linear-gradient(transparent 60%, #FFED88 60%);
  padding: 0 2px;
}

.blue {
  color: #17298D;
}


/*リンクホバー*/
a:hover,a:hover img{
	opacity:0.8;
	filter:alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}
a.none:hover,a.none:hover img{
	opacity:1.0;
	filter:alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}

img{
	max-width: 100%;
	height: auto;
	width /***/:auto;
	line-height: 0;
}

.container {
  width: 1080px;
  margin: 0 auto;
  padding: 96px 0;
}
@media (max-width: 1280px) {
  .container {
    width: calc(100% - 80px);
    padding: 80px 0;
  }
}
@media (max-width: 1080px) {
  .container {
    padding: 64px 0;
  }
}
@media (max-width: 640px) {
  .container {
    width: calc(100% - 48px);
  }
}
@media (max-width: 400px) {
  .container {
    width: calc(100% - 32px);
  }
}

.main_box {
  margin-top: 72px !important;
}

.front-new-page {
  margin-top: 123px;
}
@media (max-width: 1280px) {
  .front-new-page {
    margin-top:78px;
  }
}
@media (max-width: 768px) {
  .front-new-page {
    margin-top: 76px;
  }
}
@media (max-width: 640px) {
  .front-new-page {
    margin-top: 64px;
  }
}

.sp_on{
	display: none;
}
@media (max-width: 768px) {
	.sp_on{
		display: block;
	}
	br.sp_on,
	img.sp_on{
		display:inline;
	}
  .sp_none {
    display: none;
  }
}

hr.border {
    clear: both;
    display: block;
    height: 1px;
    border-left: none;
    border-right: none;
    border-top: none;
    border-bottom: 1px dotted #d9d9d9;
}

.img_full img{
	width:100%;
}


/*************************************************
Header styles
*************************************************/
/*header{
	height:105px;
}*/
.header {
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}
.header .logo {
  height: auto !important;
  padding: 0 !important;
  line-height: 1 !important;
	display: block;
	margin:0;
}
.header .logo img{
	max-height:52px;
}
.header .container {
  padding: 0;
}
.header .head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
}
.header .head > a {
  line-height: 1;
}
.header .btn-box {
  display: flex;
}
.header .btn-box .btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 220px;
  height: 52px;
  margin-left: 16px;
  border-radius: 52px;
  text-decoration: none;
  text-align: center;
  transition: all 0.3s ease;
	padding:0;
}
.header .btn-box .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}
.header .btn-box .btn span {
  color: #fff;
  font-weight: bold;
  font-size: 13px;
  padding-left: 26px;
}
.header .btn-box .btn p {
  color: #fff;
  font-weight: bold;
  font-size: 18px;
}
.header .btn-box .contact-btn {
  background: #F8A100;
}
.header .btn-box .contact-btn span {
  background: url(../img-top/icon-contact-btn.svg) no-repeat top 2px left;
}
.header .btn-box .line-btn {
  background: #06C655;
}
.header .btn-box .line-btn span {
  background: url(../img-top/icon-line-btn.svg) no-repeat top 3px left;
}
.header .nav-box {
  background: #17298D;
}
.header .nav-box .header-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height:52px;
}
.header .nav-box .header-container .nav {
  margin: 0 auto;
  background: #17298D;
}
.header .nav-box .header-container .nav .nav-list {
  display: flex;
  justify-content: center;
  list-style: none;
  gap: 32px;
}
.header .nav-box .header-container .nav .nav-list li {
  cursor: pointer;
  padding-right: 36px;
  border-right: 1px solid #fff;
}
.header .nav-box .header-container .nav .nav-list li:last-child {
  border: 0;
  padding: 0;
}
.header .nav-box .header-container .nav .nav-list li .nav-link {
  cursor: pointer;
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  transition: color 0.3s ease;
  position: relative;
}
.header .nav-box .header-container .nav .nav-list li .nav-link::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 0;
  height: 2px;
  background: #fff;
  transition: width 0.3s ease;
}
.header .nav-box .header-container .nav .nav-list li .nav-link:hover::after {
  width: 100%;
}
.header .nav-box .header-container .nav .nav-list li .nav-link.active {
  color: #2c5aa0;
}
.header .nav-box .header-container .nav .nav-list li .nav-link.active::after {
  width: 100%;
}
.header .nav-box .header-container .hamburger {
  display: none;
}
.header .pc {
  display: flex;
}
.header .sp {
  display: none;
}
.header .nav-list {
  position: relative;
}
.header .nav-list > li {
  cursor: pointer;
}
.header .nav-list > li:hover > div {
  opacity: 1;
  visibility: visible;
}
.header .nav-list > li > div {
  display: flex;
  justify-content: space-between;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: 40px;
  left: 0;
  background: #fff;
  padding: 24px 32px;
  width: 100%;
  z-index: 1000;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.header .nav-list > li > div a {
  text-decoration: none;
  color: #17298D;
}
.header .nav-list > li > div .cat-box {
  width: 260px;
}
.header .nav-list > li > div .cat-box .cat {
  display: block;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 12px;
  padding-left: 20px;
  background: url(../img-top/icon-fnav.svg) no-repeat top 8px left;
  background-size: 10px;
}
.header .nav-list > li > div .flex {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: calc(100% - 260px);
}
.header .nav-list > li > div .flex div {
  width: calc((100% - 48px) / 3);
}
.header .nav-list > li > div .flex div.full-box {
  width: 100%;
  margin-top: 20px;
}
.header .nav-list > li > div .flex div.full-box:first-child {
  margin-top: 0;
}
.header .nav-list > li > div .flex div.full-box ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.header .nav-list > li > div .flex div.full-box ul::after {
  display: block;
  content: "";
  width: calc((100% - 48px) / 3);
}
.header .nav-list > li > div .flex div.full-box ul li {
  width: calc((100% - 48px) / 3);
}
.header .nav-list > li > div .flex div p {
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  padding: 8px 12px;
  background: #17298D;
}
.header .nav-list > li > div .flex div ul {
  list-style: none;
}
.header .nav-list > li > div .flex div ul li {
  margin-top: 8px;
  padding: 0 !important;
}
.header .nav-list > li > div .flex div ul li a {
  color: #29375B;
  font-size: 18px;
  font-weight: bold;
  padding-left: 16px;
  background: url(../img-top/icon-fnav.svg) no-repeat top 7px left;
  background-size: 10px;
}
@media (max-width: 1280px) {
  .header .pc {
    display: none;
  }
  .header .sp {
    display: flex;
    justify-content: center;
  }
  .header .btn-box {
    width: calc(100% - 80px);
    margin: 0 auto;
    justify-content: space-between;
  }
  .header .btn-box .btn {
    width: calc((100% - 16px) / 2);
    margin: 0;
  }
  .header .tel-box {
    width: calc(100% - 80px);
    margin: 32px auto 24px;
    padding: 24px;
    background: #fff;
  }
  .header .nav-box {
    height: 0;
  }
	.header .nav-box .header-container {
		height: auto;
	}
  .header .nav-box .header-container .nav {
    position: fixed;
    top: 78px;
    right: -100%;
    width: 100%;
    height: calc(100vh - 78px);
    transition: left 0.3s ease;
    box-shadow: 0;
    overflow: auto;
  }
  .header .nav-box .header-container .nav.active {
    right: 0;
    z-index: 9999;
  }
  .header .nav-box .header-container .nav.active .nav-list {
    width: calc(100% - 80px);
    padding: 40px 0;
    margin: 0 auto;
    gap: 0;
  }
  .header .nav-box .header-container .nav.active .nav-list li {
    border-right: 0;
  }
  .header .nav-box .header-container .nav.active .nav-list li .nav-link {
    width: 100%;
    border: 0;
    padding: 0;
  }
  .header .nav-box .header-container .nav.active .nav-list li .nav-link:hover::after {
    display: none;
  }
  .header .nav-box .header-container .nav .nav-list {
    flex-direction: column;
    padding: 40px 20px;
    gap: 20px;
  }
  .header .nav-box .header-container .nav .nav-list .nav-link {
    font-size: 1.1rem;
    padding: 15px 0;
    border-bottom: 1px solid #eee;
  }
  .header .nav-box .header-container .hamburger {
    position: absolute;
    width: 63px;
    height: 63px;
    top: 7px;
    right: 16px;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    gap: 8px;
    padding: 20px 16px;
    background: #17298D;
    box-sizing: border-box;
  }
  .header .nav-box .header-container .hamburger .hamburger-line {
    width: 31px;
    height: 2px;
    background: #fff;
    transition: all 0.3s ease;
  }
  .header .nav-box .header-container .hamburger.active .hamburger-line:nth-child(1) {
    transform: rotate(45deg) translate(8px, 7px);
  }
  .header .nav-box .header-container .hamburger.active .hamburger-line:nth-child(2) {
    opacity: 0;
  }
  .header .nav-box .header-container .hamburger.active .hamburger-line:nth-child(3) {
    transform: rotate(-45deg) translate(7px, -6px);
  }
  .header .nav-list {
    position: relative;
  }
  .header .nav-list > li {
    position: relative;
    padding: 0 0 24px;
    margin-bottom: 24px;
    border: 0;
    border-bottom: 1px solid #fff;
  }
  .header .nav-list > li::before {
    position: absolute;
    content: "";
    width: 12px;
    height: 20px;
    top: 5px;
    right: 24px;
    background: url(../img-top/icon-more.svg) no-repeat center;
    background-size: cover;
  }
  .header .nav-list > li.menu-link::before {
    position: absolute;
    content: "";
    width: 12px;
    height: 20px;
    top: 6px;
    right: 24px;
    background: url(../img-top/icon-more.svg) no-repeat center;
    background-size: cover;
    transform: rotate(90deg);
    transition: transform 0.3s ease;
  }
  .header .nav-list > li.menu-link.active::before {
    position: absolute;
    content: "";
    width: 12px;
    height: 20px;
    top: 6px;
    right: 24px;
    background: url(../img-top/icon-more.svg) no-repeat center;
    background-size: cover;
    transform: rotate(-90deg);
  }
  .header .nav-list > li.active > div {
    flex-wrap: wrap;
    opacity: 1;
    max-height: -moz-max-content;
    max-height: max-content; /* 十分大きな数値にしておく */
    padding: 10px 0;
  }
  .header .nav-list > li.active:hover > div {
    opacity: 1;
    visibility: visible;
  }
  .header .nav-list > li:hover > div {
    visibility: visible;
    opacity: 1 !important;
  }
  .header .nav-list > li > div {
    position: relative;
    top: 0;
    max-height: 0;
    overflow: hidden;
    visibility: visible;
    transition: max-height 0.4s ease, padding 0.3s ease;
    box-shadow: none;
    padding: 0 0; /* 初期は高さゼロに */
    background: none;
  }
  .header .nav-list > li > div a {
    text-decoration: none;
    color: #17298D;
  }
  .header .nav-list > li > div .cat-box {
    width: 100%;
  }
  .header .nav-list > li > div .cat-box .cat {
    display: block;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    margin-top: 12px;
    background: url(../img-top/icon-more.svg) no-repeat center left 24px;
    background-size: 10px;
    background-color: rgba(255, 255, 255, 0.1);
    padding: 16px 24px 16px 48px;
  }
  .header .nav-list > li > div .flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }
  .header .nav-list > li > div .flex div {
    width: 100%;
    background: rgba(255, 255, 255, 0.1);
    padding: 16px;
    margin-top: 16px;
  }
  .header .nav-list > li > div .flex div.full-box ul li {
    width: 100%;
    margin: 8px 0;
  }
  .header .nav-list > li > div .flex div p {
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    padding-bottom: 12px;
    margin-bottom: 12px;
  }
  .header .nav-list > li > div .flex div ul {
    list-style: none;
  }
  .header .nav-list > li > div .flex div ul li {
    margin: 8px 0;
    padding: 0 !important;
  }
  .header .nav-list > li > div .flex div ul li a {
    color: #fff;
    font-size: 16px;
    padding-left: 16px;
    background: url(../img-top/icon-more.svg) no-repeat top 6px left;
    background-size: 8px;
  }
}
@media (max-width: 768px) {
	header{
		height:auto;
	}
  .header .container {
    width: calc(100% - 32px);
    padding: 0;
  }
  .header .head {
    height: 76px;
    padding: 0;
  }
  .header .head h1.logo a img {
    width: auto;
    height: 48px;
	  vertical-align: top;
  }
  .header .nav-box .header-container .nav {
    top: 76px;
    height: calc(100vh - 75px);
  }
  .header .nav-box .header-container .hamburger {
    width: 76px;
    height: 76px;
    top: 0;
    right: 0;
    gap: 11px;
    padding: 24px 20px;
  }
  .header .nav-box .header-container .hamburger .hamburger-line {
    width: 37px;
  }
  .header .nav-box .header-container .hamburger.active .hamburger-line:nth-child(1) {
    transform: rotate(45deg) translate(12px, 10px);
  }
  .header .nav-box .header-container .hamburger.active .hamburger-line:nth-child(3) {
    transform: rotate(-45deg) translate(8px, -6px);
  }
}
@media (max-width: 560px) {
  .header .btn-box {
    flex-wrap: wrap;
  }
  .header .btn-box .btn {
    width: 100%;
    margin-bottom: 16px;
  }
  .header .btn-box .btn:last-child {
    margin-bottom: 0;
  }
}
@media (max-width: 480px) {
  .header .head {
    padding: 0;
    height: 64px;
  }
  .header .head h1.logo a img {
    width: auto;
    height: 44px;
  }
  .header .nav-box .header-container .nav {
    top: 64px;
    height: calc(100vh - 64px);
  }
  .header .nav-box .header-container .nav.active .nav-list {
    width: calc(100% - 48px);
    padding: 32px 0 16px;
  }
  .header .nav-box .header-container .nav.active .nav-list li {
    padding: 0 0 20px;
  }
  .header .nav-box .header-container .hamburger {
    width: 64px;
    height: 64px;
    padding: 21px 16px;
    gap: 8px;
  }
  .header .nav-box .header-container .hamburger .hamburger-line {
    width: 32px;
  }
  .header .nav-box .header-container .hamburger.active .hamburger-line:nth-child(1) {
    transform: rotate(45deg) translate(8px, 6px);
  }
  .header .btn-box,
  .header .tel-box {
    width: calc(100% - 48px);
  }
}



/*************************************************
SPフッターボタン
*************************************************/
.sp-cta-box {
  display: none;
}
@media (max-width: 1200px) {
	.front-new-page .sp-cta-box {
    	display: flex;
	}
  .sp-cta-box {
    position: fixed;
    justify-content: space-between;
    width: 100%;
    height: 72px;
    left: 0;
    bottom: 0;
    background: #fff;
    z-index: 12;
  }
  .sp-cta-box .btn {
    text-align: center;
    width: calc((100% - 2px) / 3);
    padding: 12px 8px;
    text-decoration: none;
	border-radius: 0;
  }
  .sp-cta-box .btn img {
    width: 24px;
    height: auto;
    margin: 0 auto 8px;
  }
  .sp-cta-box .btn p {
    display: block;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
  }
  .sp-cta-box .btn.contact-btn {
    background: #F8A100;
  }
  .sp-cta-box .btn.line-btn {
    background: #06C655;
  }
  .sp-cta-box .btn.tel-btn {
    background: #17298D;
  }
}
@media (max-width: 640px) {
	.sp-cta-box {
		display: flex;
	}
}
@media (max-width: 400px) {
  .sp-cta-box {
    height: 88px;
  }
  .sp-cta-box .btn {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .sp-cta-box .btn p {
    line-height: 1.2;
  }
}



/*************************************************
Main content
*************************************************/
main {
  margin-top: 177px;
}
@media (max-width: 1280px) {
  main {
    margin-top: 108px;
  }
}
@media (max-width: 768px) {
  main {
    margin-top: 76px;
  }
}
@media (max-width: 480px) {
  main {
    margin-top: 64px;
  }
}



/*************************************************
TOP - MV section
*************************************************/
.mv {
  position: relative;
  height: 100%;
  overflow: hidden;
  color: white;
  text-align: center;
  padding: 0 10%;
}
.mv .mv-slider {
  display: flex;
  gap: 20px;
  transition: transform 0.5s ease;
  height: 100%;
  position: relative;
  max-width: 1056px;
  margin: 0 auto;
}
.mv .mv-slider .slide {
  min-width: 80%;
  flex-shrink: 0;
  overflow: hidden;
  height: 100%;
  position: relative;
  transition: transform 0.5s ease;
}
.mv .mv-slider .slide img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.mv .mv-slider .slide img.sp {
  display: none;
}
.mv .mv-slider .slide a {
  display: block;
  width: 100%;
  height: 100%;
}
.mv .slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  color: white;
  font-size: 0;
  width: 56px;
  height: 56px;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10;
}
.mv .slider-arrow.slider-prev {
  left: 20px;
  background: url(../img-top/ixon-swiper-left.svg) no-repeat;
}
.mv .slider-arrow.slider-next {
  right: 20px;
  background: url(../img-top/ixon-swiper-right.svg) no-repeat;
}
.mv .slider-controls {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
  z-index: 10;
}
.mv .slider-controls .slider-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 0;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
  background: rgba(23, 41, 141, 0.5);
}
.mv .slider-controls .slider-dot.active {
  background: #17298D;
}
@media (max-width: 1360px) {
  .mv {
    padding: 0;
  }
}
@media (max-width: 1280px) {
  .mv {
    padding: 0 0 32px;
  }
  .mv .mv-slider {
    max-width: 100%;
    padding-bottom: 56px;
  }
  .mv .mv-slider .slide {
    width: 100%;
    min-width: 100%;
  }
  .mv .slider-controls {
    bottom: 24px;
  }
  .mv .slider-arrow {
    top: auto;
    bottom: -24px;
  }
}

@media (max-width: 960px) {
  .mv .mv-slider .slide img.pc {
    display: none;
  }
  .mv .mv-slider .slide img.sp {
    display: block;
  }
}



/*************************************************
TOP - Campaign banners
*************************************************/
.campaign-banners {
  overflow: hidden;
  padding: 64px 0 80px;
  background: url(../img-top/deco-bnr-left.svg), url(../img-top/deco-bnr-right.svg);
  background-position: top 86px left, top 86px right;
  background-repeat: no-repeat;
}
.campaign-banners .container {
  position: relative;
  padding: 0;
}
.campaign-banners .head {
  display: flex;
  align-items: baseline;
  margin-bottom: 32px;
}
.campaign-banners .head h2 {
  font-size: 40px;
  margin-right: 20px;
}
.campaign-banners .head span {
  font-size: 20px;
  font-weight: bold;
}
.campaign-banners .banner-grid {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 0 auto;
}
.campaign-banners .banner-grid .campaign-banner {
  position: relative;
  width: calc((100% - 32px) / 2);
  height: auto;
  line-height: 0;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.campaign-banners .banner-grid .campaign-banner img {
  width: 100%;
  height: auto;
}
.campaign-banners .banner-grid .campaign-banner:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
@media (max-width: 1440px) {
  .campaign-banners {
    background: none;
  }
  .campaign-banners .container::before, .campaign-banners .container::after {
    position: absolute;
    content: "";
    width: 156px;
    height: 14px;
    top: 26px;
  }
  .campaign-banners .container::before {
    left: -180px;
    background: url(../img-top/deco-bnr-left.svg) no-repeat center;
  }
  .campaign-banners .container::after {
    right: -180px;
    background: url(../img-top/deco-bnr-right.svg) no-repeat center;
  }
}
@media (max-width: 1280px) {
  .campaign-banners .container::before {
    display: none;
  }
  .campaign-banners .container::after {
    right: -40px;
    background: url(../img-top/deco-bnr-right.svg) no-repeat center;
  }
}
@media (max-width: 640px) {
  .campaign-banners {
    padding: 40px 0 24px;
  }
  .campaign-banners .container {
    padding: 0;
  }
  .campaign-banners .head {
    display: block;
  }
  .campaign-banners .banner-grid .campaign-banner {
    width: 100%;
    margin-bottom: 16px;
  }
}
@media (max-width: 400px) {
  .campaign-banners .head {
    margin-bottom: 24px;
  }
  .campaign-banners .head h2 {
    font-size: 32px;
  }
  .campaign-banners .head span {
    font-size: 15px;
  }
}



/*************************************************
TOP - どう学ぶか
*************************************************/
.learn-box {
  overflow: hidden;
  background: url("../img-top/bg.png") no-repeat center center;
  background-size: cover;
  position: relative;
  border-top: 1px solid #17298D;
  border-bottom: 1px solid #17298D;
}
.learn-box .container {
  padding: 80px 0;
}
.learn-box::after {
  position: absolute;
  content: "How to learn";
  width: 100%;
  color: #005BA6;
  font-size: 96px;
  font-weight: 900;
  opacity: 0.3;
  right: -16px;
  bottom: -36px;
  text-align: right;
}
.learn-box .flex-content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 64px;
  margin: 0 auto;
}
.learn-box .flex-content img {
  width: 472px;
  height: 320px;
  -o-object-fit: cover;
     object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  border: #17298D 1px solid;
}
.learn-box .flex-content .txt-box > span {
  color: #17298D;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 1px;
}
.learn-box .flex-content .txt-box h2 {
  font-size: 28px;
  font-weight: 900;
}
.learn-box .flex-content .txt-box h2 .blue {
  color: #17298D;
}
.learn-box .flex-content .txt-box h2 .font-36 {
  font-size: 36px;
}
.learn-box .flex-content .txt-box h2 .font-40 {
  font-size: 40px;
}
.learn-box br.sp {
  display: none;
}
@media (max-width: 1180px) {
  .learn-box::after {
    font-size: 80px;
    bottom: -32px;
  }
  .learn-box .flex-content {
    gap: 40px;
  }
  .learn-box .flex-content img {
    width: 380px;
    height: 240px;
  }
  .learn-box .flex-content .txt-box h2 {
    font-size: 24px;
  }
  .learn-box .flex-content .txt-box h2 .font-36 {
    font-size: 28px;
  }
  .learn-box .flex-content .txt-box h2 .font-40 {
    font-size: 32px;
  }
}
@media (max-width: 980px) {
  .learn-box::after {
    font-size: 64px;
    bottom: -24px;
  }
  .learn-box .flex-content {
    display: block;
    text-align: center;
    gap: 40px;
  }
  .learn-box .flex-content img {
    width: 60%;
    height: 100%;
  }
  .learn-box .flex-content .txt-box {
    margin-top: 40px;
  }
}
@media (max-width: 768px) {
  .learn-box .flex-content img {
    width: 100%;
    height: 100%;
  }
}
@media (max-width: 560px) {
  .learn-box .container {
    padding: 24px 0 80px;
  }
  .learn-box .flex-content .txt-box span {
    font-size: 14px;
  }
  .learn-box .flex-content .txt-box h2 {
    font-size: 18px;
  }
  .learn-box .flex-content .txt-box h2 .font-36 {
    font-size: 26px;
  }
  .learn-box .flex-content .txt-box h2 .font-40 {
    font-size: 26px;
  }
}
@media (max-width: 420px) {
  .learn-box br.sp {
    display: block;
  }
  .learn-box::after {
    width: 372px;
    font-size: 56px;
  }
}



/*************************************************
TOP - 3つの力
*************************************************/
.three-powers {
  background: linear-gradient(135deg, #EDF1F8 0%, #FFFFFF 100%);
}
.three-powers .container {
  padding: 100px 0 0;
}
.three-powers br.sp {
  display: none;
}
.three-powers .head h2 {
  font-size: 36px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 24px;
  padding-top: 28px;
  background: url(../img-top/icon_three-powers.svg) no-repeat top center;
}
.three-powers .head h2 .font-48 {
  font-size: 48px;
}
.three-powers .head p {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 64px;
}
.three-powers .powers-grid {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  z-index: 2;
}
.three-powers .powers-grid .power-card {
  position: relative;
  width: calc((100% - 48px) / 3);
  background: #fff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.three-powers .powers-grid .power-card .power-icon {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  top: 0;
  left: 0;
  color: #fff;
  font-size: 32px;
  font-weight: bold;
  background: #17298D;
}
.three-powers .powers-grid .power-card img {
  width: 100%;
  height: auto;
}
.three-powers .powers-grid .power-card .txt {
  padding: 36px;
}
.three-powers .powers-grid .power-card .txt h3 {
  color: #17298D;
  font-size: 24px;
  font-weight: bold;
  padding: 25px 0 8px;
  background: url(../img-top/icon-h3.svg) no-repeat top center;
  text-align: center;
}
.three-powers .powers-grid .power-card .txt p {
  font-size: 16px;
  font-weight: bold;
  padding-top: 32px;
  background: url(../img-top/icon-power-card.svg) no-repeat top center;
  text-align: left;
}
.three-powers .evidence-box {
  position: relative;
  padding: 132px 0 32px;
  background: #EEF2F8;
  margin-top: -36px;
  z-index: 1;
}
.three-powers .evidence-box::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 96px;
  bottom: -96px;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  background: #EEF2F8;
}
.three-powers .evidence-box p {
  font-size: 32px;
  font-weight: bold;
  text-align: center;
}
.three-powers .evidence-box p .font-36 {
  font-size: 36px;
}
.three-powers .answer-box {
  text-align: center;
  background: linear-gradient(90deg, #29539B 0%, #193056 100%);
}
.three-powers .answer-box .container {
  padding: 192px 0 96px;
}
.three-powers .answer-box h3 {
  color: #fff;
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 24px;
}
.three-powers .answer-box h3 .font-40 {
  font-size: 40px;
}
.three-powers .answer-box p {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
}
.three-powers .answer-box .img-box {
  display: flex;
  justify-content: space-between;
  margin-top: 48px;
}
.three-powers .answer-box .img-box img {
  width: calc((100% - 64px) / 5);
}
.three-powers .answer-box .img-box img:nth-child(even) {
  padding-top: 32px;
}
.three-powers .answer-box .img-box img:nth-child(odd) {
  padding-bottom: 32px;
}
.three-powers .answer-box .pc {
  display: flex;
}
.three-powers .answer-box .sp {
  display: none;
}
@media (max-width: 1080px) {
  .three-powers .powers-grid .power-card .txt {
    padding: 24px;
  }
  .three-powers .powers-grid .power-card .txt h3 {
    font-size: 20px;
  }
  .three-powers .powers-grid .power-card .txt p {
    font-size: 15px;
  }
}
@media (max-width: 880px) {
  .three-powers .container {
    padding: 64px 0 0;
  }
  .three-powers .head h2 {
    font-size: 32px;
    margin-bottom: 16px;
  }
  .three-powers .head h2 .font-48 {
    font-size: 40px;
  }
  .three-powers .head p {
    font-size: 18px;
    margin-bottom: 48px;
  }
  .three-powers .powers-grid .power-card {
    width: 100%;
    margin: 0 auto 24px;
  }
  .three-powers .powers-grid .power-card .power-icon {
    display: none;
  }
  .three-powers .powers-grid .power-card > img {
    display: none;
  }
  .three-powers .powers-grid .power-card .txt {
    padding: 32px;
  }
  .three-powers .powers-grid .power-card .txt h3 {
    font-size: 24px;
  }
  .three-powers .powers-grid .power-card .txt p {
    font-size: 16px;
  }
  .three-powers .powers-grid .power-card .txt p br {
    display: none;
  }
  .three-powers .evidence-box {
    padding: 80px 0 24px;
    margin-top: -64px;
  }
  .three-powers .evidence-box::after {
    height: 64px;
    bottom: -64px;
  }
  .three-powers .evidence-box p {
    font-size: 20px;
  }
  .three-powers .evidence-box p .font-36 {
    font-size: 28px;
  }
  .three-powers .answer-box .container {
    padding: 120px 0 64px;
  }
  .three-powers .answer-box h3 {
    font-size: 28px;
    margin-bottom: 24px;
  }
  .three-powers .answer-box h3 .font-40 {
    font-size: 32px;
  }
  .three-powers .answer-box p {
    font-size: 18px;
    text-align: left;
  }
}
@media (max-width: 640px) {
  .three-powers .container {
    padding: 48px 0 0;
  }
  .three-powers .head h2 {
    font-size: 20px;
    margin-bottom: 16px;
  }
  .three-powers .head h2 .font-48 {
    font-size: 24px;
  }
  .three-powers .head p {
    text-align: left;
    font-size: 15px;
    margin-bottom: 32px;
  }
  .three-powers .head p br {
    display: none;
  }
  .three-powers .powers-grid .power-card .txt {
    padding: 24px;
  }
  .three-powers .powers-grid .power-card .txt h3 {
    font-size: 20px;
  }
  .three-powers .powers-grid .power-card .txt p {
    font-size: 15px;
  }
  .three-powers .evidence-box {
    padding: 80px 40px 24px;
    margin-top: -64px;
    box-sizing: border-box;
  }
  .three-powers .evidence-box::after {
    left: 0;
    height: 40px;
    bottom: -40px;
  }
  .three-powers .evidence-box p {
    font-size: 18px;
  }
  .three-powers .evidence-box p .font-36 {
    font-size: 24px;
  }
  .three-powers .evidence-box p br {
    display: none;
  }
  .three-powers .answer-box .img-box img {
    width: calc((100% - 64px) / 3);
  }
  .three-powers .answer-box img:nth-child(even) {
    padding-top: 0;
    padding-bottom: 16px;
  }
  .three-powers .answer-box img:nth-child(odd) {
    padding-top: 16px;
    padding-bottom: 0;
  }
  .three-powers .answer-box .pc {
    display: none;
  }
  .three-powers .answer-box .sp {
    display: flex;
  }
}
@media (max-width: 480px) {
  .three-powers br.sp {
    display: block;
  }
  .three-powers .answer-box .container {
    padding: 96px 0 48px;
  }
  .three-powers .answer-box h3 {
    font-size: 24px;
    margin-bottom: 16px;
  }
  .three-powers .answer-box h3 .font-40 {
    font-size: 28px;
  }
  .three-powers .answer-box p {
    font-size: 15px;
  }
  .three-powers .answer-box .img-box img {
    width: calc((100% - 16px) / 3);
  }
}
@media (max-width: 360px) {
  .three-powers .answer-box .container {
    padding: 80px 0 24px;
  }
  .three-powers .answer-box h3 {
    font-size: 20px;
  }
  .three-powers .answer-box h3 .font-40 {
    font-size: 24px;
  }
  .three-powers .answer-box h3 br {
    display: none;
  }
}



/*************************************************
TOP - 問合せ 
*************************************************/
#cta-box {
  background: url(../img-top/cta-bg.jpg) no-repeat;
  background-size: cover;
  text-align: center;
}
#cta-box .container {
  padding: 56px 0;
}
#cta-box h2 {
  font-size: 32px;
  font-weight: 700;
  padding-top: 40px;
  margin-bottom: 40px;
  color: white;
  background: url(../img-top/deco_cta.svg) no-repeat top center;
}
#cta-box h2 .font-36 {
  font-size: 36px;
}
#cta-box h2 br.sp {
  display: none;
}
#cta-box .flex-box {
  display: flex;
  justify-content: space-between;
}
#cta-box .flex-box .box {
  padding: 32px 32px 24px;
  background: #fff;
}
#cta-box .flex-box .box h3 {
  color: #17298D;
  font-size: 24px;
  font-weight: bold;
  padding-bottom: 16px;
  border-bottom: 1px #D9D9D9 solid;
  text-align: center;
}
#cta-box .flex-box .box h3 br.sp {
  display: none;
}
#cta-box .flex-box .tel-box {
  width: 370px;
}
#cta-box .flex-box .tel-box a {
  display: block;
  color: #29375B;
  font-size: 40px;
  font-weight: bold;
  padding-left: 42px;
  background: url(../img-top/icon-tel.svg) no-repeat top 12px left;
  text-decoration: none;
  margin: 8px 0;
}
#cta-box .flex-box .tel-box div {
  display: flex;
}
#cta-box .flex-box .tel-box div span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 74px;
  height: 25px;
  border-radius: 2px;
  color: #fff;
  font-size: 14px;
  background: #17298D;
}
#cta-box .flex-box .tel-box div p {
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  margin-left: 12px;
}
#cta-box .flex-box .contact-box {
  width: calc(100% - 394px);
}
#cta-box .flex-box .contact-box div {
  display: flex;
  justify-content: space-between;
  margin-top: 24px;
}
#cta-box .flex-box .contact-box div .btn {
  position: relative;
  display: block;
  width: calc((100% - 16px) / 2);
  padding: 20px 0;
  border-radius: 120px;
  text-decoration: none;
  text-align: center;
  transition: all 0.3s ease;
}
#cta-box .flex-box .contact-box div .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}
#cta-box .flex-box .contact-box div .btn::after {
  position: absolute;
  content: "";
  width: 10px;
  height: 16px;
  top: calc(50% - 8px);
  right: 28px;
  background: url(../img-top/icon-more.svg) no-repeat center;
}
#cta-box .flex-box .contact-box div .btn span {
  color: #fff;
  font-weight: bold;
  font-weight: 14px;
  padding-left: 26px;
}
#cta-box .flex-box .contact-box div .btn p {
  color: #fff;
  font-weight: bold;
  font-size: 22px;
}
#cta-box .flex-box .contact-box div .contact-btn {
  background: #F8A100;
}
#cta-box .flex-box .contact-box div .contact-btn span {
  background: url(../img-top/icon-contact-btn.svg) no-repeat top 2px left;
}
#cta-box .flex-box .contact-box div .line-btn {
  background: #06C655;
}
#cta-box .flex-box .contact-box div .line-btn span {
  background: url(../img-top/icon-line-btn.svg) no-repeat top 3px left;
}
@media (max-width: 1280px) {
  #cta-box .flex-box {
    flex-wrap: wrap;
  }
  #cta-box .flex-box .tel-box {
    width: 100%;
    margin-bottom: 24px;
  }
  #cta-box .flex-box .tel-box a {
    display: inline-block;
    background: url(../img-top/icon-tel.svg) no-repeat top 16px left;
  }
  #cta-box .flex-box .tel-box div {
    justify-content: center;
  }
  #cta-box .flex-box .contact-box {
    width: 100%;
  }
}
@media (max-width: 800px) {
  #cta-box h2 {
    font-size: 28px;
  }
  #cta-box h2 .font-36 {
    font-size: 32px;
  }
  #cta-box h2 br.sp {
    display: block;
  }
  #cta-box .flex-box {
    flex-wrap: wrap;
  }
  #cta-box .flex-box .box h3 br.sp {
    display: block;
  }
  #cta-box .flex-box .tel-box {
    width: 100%;
    margin-bottom: 24px;
  }
  #cta-box .flex-box .tel-box a {
    display: inline-block;
    background: url(../img-top/icon-tel.svg) no-repeat top 16px left;
  }
  #cta-box .flex-box .tel-box div {
    justify-content: center;
  }
  #cta-box .flex-box .contact-box {
    width: 100%;
  }
  #cta-box .flex-box .contact-box div {
    flex-wrap: wrap;
  }
  #cta-box .flex-box .contact-box div .btn {
    width: 100%;
    margin-bottom: 16px;
  }
  #cta-box .flex-box .contact-box div .btn:last-child {
    margin: 0;
  }
}
@media (max-width: 530px) {
  #cta-box h2 {
    font-size: 20px;
  }
  #cta-box h2 .font-36 {
    font-size: 24px;
  }
  #cta-box .flex-box {
    flex-wrap: wrap;
  }
  #cta-box .flex-box .box {
    padding: 24px;
  }
  #cta-box .flex-box .box h3 {
    font-size: 20px;
    padding-bottom: 12px;
  }
  #cta-box .flex-box .box h3 br {
    display: block;
  }
  #cta-box .flex-box .tel-box {
    width: 100%;
    margin-bottom: 24px;
  }
  #cta-box .flex-box .tel-box a {
    display: inline-block;
    background: url(../img-top/icon-tel.svg) no-repeat top 16px left;
  }
  #cta-box .flex-box .tel-box div {
    justify-content: center;
  }
  #cta-box .flex-box .contact-box {
    width: 100%;
  }
  #cta-box .flex-box .contact-box div {
    flex-wrap: wrap;
  }
  #cta-box .flex-box .contact-box div .btn {
    width: 100%;
    margin-bottom: 16px;
  }
  #cta-box .flex-box .contact-box div .btn::after {
    display: none;
  }
}
@media (max-width: 400px) {
  #cta-box .flex-box .box {
    padding: 24px;
  }
  #cta-box .flex-box .box h3 {
    font-size: 18px;
  }
  #cta-box .flex-box .tel-box a {
    display: inline-block;
    font-size: 32px;
  }
  #cta-box .flex-box .tel-box div span {
    height: 25px;
    font-size: 13px;
  }
  #cta-box .flex-box .tel-box div p {
    font-size: 15px;
  }
  #cta-box .flex-box .contact-box div {
    margin-top: 24px;
  }
  #cta-box .flex-box .contact-box div .btn span {
    font-size: 14px;
  }
  #cta-box .flex-box .contact-box div .btn p {
    font-size: 20px;
  }
}



/*************************************************
TOP - 学び方の違い比較
*************************************************/
.new-comparison {
  background: linear-gradient(135deg, #FFF5E3 0%, #FFFFFF 100%);
}
.new-comparison .container {
  padding: 96px 0 40px;
}
.new-comparison .head {
  padding-top: 56px;
  text-align: center;
  background: url(../img-top/deco-head.svg) no-repeat top center;
}
.new-comparison .head span {
  color: #17298D;
  font-size: 18px;
  font-weight: bold;
}
.new-comparison .head h2 {
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 24px;
}
.new-comparison .head h3 {
  color: #17298D;
  font-size: 32px;
}
.new-comparison .head p {
  font-size: 20px;
  font-weight: bold;
}
.new-comparison .head .font-24 {
  font-size: 24px;
}
.new-comparison .head .font-32 {
  font-size: 32px;
}
.new-comparison .comparison-box {
  display: flex;
  justify-content: space-between;
  margin: 80px 0 64px;
}
.new-comparison .comparison-box .box {
  position: relative;
  width: calc((100% - 456px) / 2);
  text-align: center;
  border-radius: 8px;
  padding: 50px 24px 32px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
}
.new-comparison .comparison-box .box h3 {
  position: absolute;
  width: calc(100% - 48px);
  top: -28px;
  padding: 12px;
  border-radius: 56px;
  color: #fff;
  font-size: 20px;
  background: #898989;
  box-sizing: border-box;
}
.new-comparison .comparison-box .box h3::before {
  position: absolute;
  content: "";
  width: 32px;
  height: 16px;
  left: calc(50% - 16px);
  bottom: -8px;
  background: #898989;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.new-comparison .comparison-box .box div {
  margin-bottom: 24px;
  padding-bottom: 26px;
  border-bottom: #D9D9D9 1px solid;
}
.new-comparison .comparison-box .box div:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.new-comparison .comparison-box .box div span {
  color: #898989;
  font-size: 15px;
  font-weight: bold;
}
.new-comparison .comparison-box .box div p {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3C3C3C;
  font-size: 24px;
  font-weight: bold;
}
.new-comparison .comparison-box .main {
  width: 408px;
}
.new-comparison .comparison-box .main h3 {
  background: #17298D;
}
.new-comparison .comparison-box .main h3::before {
  background: #17298D;
}
.new-comparison .comparison-box .main h3::after {
  position: absolute;
  content: "";
  width: 136px;
  height: 24px;
  top: -20px;
  left: calc(50% - 68px);
  background: url(../img-top/deco-comparison.svg) no-repeat center;
}
.new-comparison .comparison-box .main div {
  margin-bottom: 24px;
  padding-bottom: 20px;
}
.new-comparison .comparison-box .main div span {
  color: #0046C8;
}
.new-comparison .comparison-box .main div p {
  display: block;
  color: #29375B;
  font-size: 28px;
}
.new-comparison .comparison-box .main div p strong {
  background: linear-gradient(transparent 70%, #FFED88 70%);
  padding: 0 2px;
}
.new-comparison .comparison-box .main div .font-24 {
  font-size: 24px;
}
@media (max-width: 1080px) {
  .new-comparison .container {
    padding: 80px 0 40px;
  }
  .new-comparison .head p {
    font-size: 18px;
  }
  .new-comparison .comparison-box {
    flex-wrap: wrap;
    margin: 80px 0 0;
  }
  .new-comparison .comparison-box .box {
    width: calc((100% - 32px) / 2);
    margin-bottom: 64px;
  }
  .new-comparison .comparison-box .box div p br {
    display: none;
  }
  .new-comparison .comparison-box .main {
    width: 100%;
  }
  .new-comparison .comparison-box .main div p br {
    display: block;
  }
}
@media (max-width: 660px) {
  .new-comparison .container {
    padding: 64px 0 0;
  }
  .new-comparison .head span {
    font-size: 18px;
  }
  .new-comparison .head h2 {
    font-size: 32px;
    margin-bottom: 16px;
  }
  .new-comparison .head p {
    font-size: 16px;
    text-align: left;
  }
  .new-comparison .comparison-box {
    flex-wrap: wrap;
    margin: 64px 0 0;
  }
  .new-comparison .comparison-box .box {
    width: calc((100% - 16px) / 2);
    margin-bottom: 64px;
    padding: 32px 12px 16px;
  }
  .new-comparison .comparison-box .box h3 {
    width: calc(100% - 24px);
    font-size: 16px;
    padding: 8px;
  }
  .new-comparison .comparison-box .box div {
    margin-bottom: 12px;
    padding-bottom: 12px;
  }
  .new-comparison .comparison-box .box div span {
    font-size: 14px;
  }
  .new-comparison .comparison-box .box div p {
    height: auto !important;
    font-size: 18px;
  }
  .new-comparison .comparison-box .main {
    width: 100%;
  }
  .new-comparison .comparison-box .main h3 {
    font-size: 20px;
  }
  .new-comparison .comparison-box .main div p {
    font-size: 24px;
  }
  .new-comparison .comparison-box .main div .font-24 {
    font-size: 20px;
  }
}
@media (max-width: 480px) {
  .new-comparison .head span {
    font-size: 15px;
  }
  .new-comparison .head h2 {
    font-size: 28px;
  }
  .new-comparison .comparison-box {
    flex-wrap: wrap;
    margin: 64px 0 0;
  }
  .new-comparison .comparison-box .box {
    width: calc((100% - 16px) / 2);
    margin-bottom: 64px;
    padding: 20px 12px 16px;
  }
  .new-comparison .comparison-box .box h3 {
    left: 0;
    width: 100%;
    font-size: 12px;
    padding: 8px;
  }
  .new-comparison .comparison-box .box div {
    margin-bottom: 8px;
    padding-bottom: 8px;
  }
  .new-comparison .comparison-box .box div span {
    font-size: 12px;
    letter-spacing: normal;
  }
  .new-comparison .comparison-box .box div p {
    font-size: 16px;
  }
  .new-comparison .comparison-box .main {
    width: 100%;
    padding: 40px 12px 16px;
  }
  .new-comparison .comparison-box .main h3 {
    font-size: 20px;
  }
  .new-comparison .comparison-box .main div p {
    font-size: 24px;
  }
  .new-comparison .comparison-box .main div .font-24 {
    font-size: 20px;
  }
}

.teacher-box {
  padding-top: 56px;
  background: url(../img-top/deco-head.svg) no-repeat top center;
  text-align: center;
}
.teacher-box h3 {
  color: #17298D;
  font-size: 32px;
  font-weight: bold;
}
.teacher-box p {
  font-size: 20px;
  font-weight: bold;
}
.teacher-box .font-24 {
  font-size: 24px;
}
.teacher-box .font-32 {
  font-size: 32px;
}
.teacher-box .img-box {
  display: flex;
  justify-content: space-between;
  margin: 48px 0;
}
.teacher-box .img-box img {
  width: calc((100% - 64px) / 5);
}
.teacher-box .img-box img:nth-child(even) {
  padding-top: 32px;
}
.teacher-box .img-box img:nth-child(odd) {
  padding-bottom: 32px;
}
.teacher-box .point-box {
  padding: 56px 72px;
  background: url(../img-top/deco-point-left.svg), url(../img-top/deco-point-right.svg);
  background-position: top left, top right;
  background-repeat: no-repeat;
}
.teacher-box .point-box p {
  color: #17298D;
  font-size: 32px;
}
@media (max-width: 1080px) {
  .teacher-box .point-box {
    padding: 36px 72px;
    background: url(../img-top/deco-point-left.svg), url(../img-top/deco-point-right.svg);
    background-position: center left, center right;
    background-repeat: no-repeat;
    background-size: 56px;
  }
  .teacher-box .point-box p {
    font-size: 24px;
  }
  .teacher-box .point-box p br {
    display: none;
  }
}
@media (max-width: 640px) {
  .teacher-box h3 {
    font-size: 28px;
  }
  .teacher-box p {
    font-size: 18px;
    text-align: left;
  }
  .teacher-box p br {
    display: none;
  }
  .teacher-box .font-24 {
    font-size: 20px;
  }
  .teacher-box .font-32 {
    font-size: 24px;
  }
  .teacher-box .img-box img {
    width: calc((100% - 32px) / 3);
  }
  .teacher-box .img-box img:nth-child(1), .teacher-box .img-box img:nth-child(5) {
    display: none;
  }
  .teacher-box .point-box {
    margin: 32px 0 48px;
    padding: 16px 72px;
    background: url(../img-top/deco-point-left.svg), url(../img-top/deco-point-right.svg);
    background-position: center left, center right;
    background-repeat: no-repeat;
    background-size: 40px;
  }
  .teacher-box .point-box p {
    font-size: 20px;
  }
}
@media (max-width: 480px) {
  .teacher-box h3 {
    font-size: 24px;
  }
  .teacher-box .point-box {
    margin: 32px 0 48px;
    padding: 40px 0;
    background: url(../img-top/deco-point-top.png), url(../img-top/deco-point-bottom.png);
    background-position: top center, bottom center;
    background-repeat: no-repeat;
  }
  .teacher-box .point-box p {
    font-size: 20px;
    text-align: center;
  }
}



/*************************************************
TOP - 教育方針と体制づくり・代表の言葉
*************************************************/
.new-system {
  background: linear-gradient(135deg, #EDF1F8 0%, #FFFFFF 100%);
	margin-top:24px;
}
.new-system .head {
  padding-top: 56px;
  text-align: center;
  background: url(../img-top/deco-head.svg) no-repeat top center;
}
.new-system .head span {
  color: #17298D;
  font-size: 18px;
  font-weight: bold;
}
.new-system .head h2 {
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 24px;
}
.new-system .head h3 {
  color: #17298D;
  font-size: 32px;
}
.new-system .head p {
  font-size: 20px;
  font-weight: bold;
}
.new-system .head p br {
  display: none;
}
.new-system .head .font-24 {
  font-size: 24px;
}
.new-system .head .font-32 {
  font-size: 32px;
}
.new-system .box {
  padding: 24px;
  margin: 64px 0 80px;
  background: #fff;
  text-align: center;
}
.new-system .box .inner {
  padding: 64px 24px;
  border: 2px #D3E0F2 solid;
}
.new-system .box .inner > p {
  font-size: 20px;
  font-weight: bold;
}
.new-system .box .inner .head-box span {
  display: block;
  width: 100%;
  color: #17298D;
  font-size: 16px;
  font-weight: bold;
}
.new-system .box .inner .head-box h3 {
  display: inline-block;
  font-size: 28px;
  font-weight: bold;
  background: url(../img-top/deco-side-left.svg), url(../img-top/deco-side-right.svg);
  background-position: left bottom, right bottom;
  background-repeat: no-repeat;
  padding: 0 144px;
}
.new-system .box .inner .point-box {
  margin: 16px 0 12px;
  padding: 20px 80px;
  background: url(../img-top/deco-point-left.svg), url(../img-top/deco-point-right.svg);
  background-position: top left, top right;
  background-repeat: no-repeat;
  background-size: 48px 140px;
}
.new-system .box .inner .point-box p {
  font-size: 32px;
  font-weight: bold;
}
.new-system .box .inner .point-box p br.sp {
  display: none;
}
.new-system .box .inner .point-box .font-36 {
  font-size: 36px;
}
.new-system .box .inner .point-box strong {
  color: #17298D;
}
.new-system .container > img {
  width: 100%;
  height: auto;
}
.new-system .teacher-box {
  position: relative;
  z-index: 2;
  padding-bottom: 40px;
}
.new-system .teacher-box::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 204px;
  left: 0;
  bottom: 0;
  background: linear-gradient(90deg, #EAD16E 0%, #EF9B00 100%);
  z-index: -1;
}
.new-system .teacher-box .container {
  padding: 0;
}
.new-system .img-sp,
.new-system .modal,
.new-system .sp-box {
  display: none;
}
.new-system .video-head {
  margin: 80px 0 40px;
}
.new-system .video-box {
  width: 100%;
  height: auto;
}
.new-system .video-box video {
  width: 100%;
  height: auto;
}
@media (max-width: 1080px) {
  .new-system .box .inner > p {
    font-size: 18px;
  }
  .new-system .box .inner .point-box p {
    font-size: 26px;
  }
  .new-system .box .inner .point-box .font-36 {
    font-size: 30px;
  }
}
@media (max-width: 840px) {
  .new-system .head {
    padding-top: 56px;
    background: url(../img-top/deco-head.svg) no-repeat top center;
  }
  .new-system .head h2 {
    font-size: 32px;
    margin-bottom: 16px;
  }
  .new-system .head p {
    font-size: 18px;
  }
  .new-system .head p br {
    display: block;
  }
  .new-system .box {
    margin: 48px 0;
  }
  .new-system .box .inner {
    padding: 64px 24px;
  }
  .new-system .box .inner > p {
    display: none;
  }
  .new-system .box .inner .head-box span {
    display: inline-block;
    width: auto;
    font-size: 16px;
    background: url(../img-top/deco-side-left.svg), url(../img-top/deco-side-right.svg);
    background-position: left bottom, right bottom;
    background-repeat: no-repeat;
    background-size: 64px;
    padding: 0 80px;
  }
  .new-system .box .inner .head-box h3 {
    display: inline-block;
    font-size: 28px;
    background: none;
    padding: 0;
  }
  .new-system .box .inner .point-box {
    margin: 16px 0 0;
    padding: 40px 0;
    background: url(../img-top/deco-point-top.png), url(../img-top/deco-point-bottom.png);
    background-position: top center, bottom center;
    background-repeat: no-repeat;
    background-size: 80px;
  }
  .new-system .box .inner .point-box p {
    font-size: 24px;
  }
  .new-system .box .inner .point-box p br.sp {
    display: block;
  }
  .new-system .box .inner .point-box .font-36 {
    font-size: 28px;
  }
}
@media (max-width: 640px) {
  .new-system .head {
    padding-top: 56px;
    background: url(../img-top/deco-head.svg) no-repeat top center;
  }
  .new-system .head h2 {
    font-size: 32px;
    margin-bottom: 16px;
  }
  .new-system .head p {
    font-size: 18px;
  }
  .new-system .head p br {
    display: block;
  }
  .new-system .box {
    padding: 8px;
  }
  .new-system .box .inner {
    padding: 32px 16px;
  }
  .new-system .box .inner > p {
    display: none;
  }
  .new-system .box .inner .head-box span {
    display: inline-block;
    width: auto;
    font-size: 15px;
    background: url(../img-top/deco-side-left.svg), url(../img-top/deco-side-right.svg);
    background-position: left bottom, right bottom;
    background-repeat: no-repeat;
    background-size: 64px;
    padding: 0 80px;
  }
  .new-system .box .inner .head-box h3 {
    display: inline-block;
    font-size: 24px;
    background: none;
    padding: 0;
  }
  .new-system .box .inner .point-box {
    margin: 16px 0 0;
    padding: 40px 0;
    background: url(../img-top/deco-point-top.png), url(../img-top/deco-point-bottom.png);
    background-position: top center, bottom center;
    background-repeat: no-repeat;
    background-size: 80px;
  }
  .new-system .box .inner .point-box p {
    font-size: 20px;
  }
  .new-system .box .inner .point-box .font-36 {
    font-size: 24px;
  }
  .new-system .img-pc {
    display: none;
  }
  .new-system .img-sp {
    display: block;
    line-height: 1;
  }
  .new-system .img-sp .img {
    width: 100%;
  }
  .new-system .img-sp .flex {
    display: flex;
    justify-content: space-evenly;
  }
  .new-system .img-sp .flex a {
    width: calc((100% - 80px) / 3);
  }
  .new-system .img-sp .flex img {
    width: 100%;
  }
  .new-system .modal {
    display: none; /* 最初は非表示 */
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(25, 48, 86, 0.9);
    justify-content: center;
    align-items: center;
  }
  .new-system .modal.active {
    display: flex;
  }
  .new-system .modal .modal-content {
    width: 90%;
    position: relative;
  }
  .new-system .modal .modal-content img {
    width: 100%;
  }
  .new-system .modal .close {
    cursor: pointer;
    position: absolute;
    width: 56px;
    height: 56px;
    right: calc(50% - 28px);
    bottom: 72px;
    color: #fff;
    font-size: 17px;
    text-align: center;
  }
  .new-system .modal .close span {
    display: block;
    height: 64px;
    font-size: 48px;
  }
  .new-system .teacher-box {
    display: none;
  }
  .new-system .sp-box {
    display: block;
    margin-top: 48px;
  }
  .new-system .sp-box .head p {
    color: #29375B;
    font-size: 20px;
    margin-bottom: 16px;
  }
  .new-system .sp-box .head p:last-child {
    margin-bottom: 0;
  }
  .new-system .sp-box .head .font-24 {
    color: #29375B;
    font-size: 24px;
  }
  .new-system .video-head {
    margin: 40px 0 24px;
  }
}
@media (max-width: 480px) {
  .new-system .head h2 {
    font-size: 24px;
    margin-bottom: 16px;
  }
  .new-system .head p {
    font-size: 15px;
  }
  .new-system .box {
    margin: 32px 0;
  }
  .new-system .box .inner .head-box span {
    font-size: 14px;
  }
  .new-system .box .inner .head-box h3 {
    font-size: 20px;
  }
  .new-system .box .inner .point-box p {
    font-size: 16px;
  }
  .new-system .box .inner .point-box .font-36 {
    font-size: 20px;
  }
}
@media (max-width: 400px) {
  .new-system .sp-box .head p {
    font-size: 18px;
  }
  .new-system .sp-box .head .font-24 {
    font-size: 22px;
  }
}



/*************************************************
TOP - 保護者さまからの声
*************************************************/
.new-voice {
  background: url(../img-top/bg.png) no-repeat center;
  background-size: cover;
  border-top: #17298D 1px solid;
  border-bottom: #17298D 1px solid;
}
.new-voice .head {
  text-align: center;
  padding: 56px 0;
  background: url(../img-top/deco-head.svg), url(../img-top/deco-head.svg);
  background-position: top center, bottom center;
  background-repeat: no-repeat;
}
.new-voice .head h2 {
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 24px;
}
.new-voice .head .font-40 {
  font-size: 40px;
}
.new-voice .head p {
  font-size: 20px;
  font-weight: bold;
}
.new-voice .box-wrapper {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.new-voice .voice-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 48px;
}
.new-voice .voice-box .box {
  width: calc((100% - 32px) / 2);
  height: auto;
  border: #17298D 1px solid;
  padding: 32px;
  margin-bottom: 32px;
  background: #fff;
  box-sizing: border-box;
}
.new-voice .voice-box .box:nth-last-child(1), .new-voice .voice-box .box:nth-last-child(2) {
  margin-bottom: 0;
}
.new-voice .voice-box .box .flex {
  display: flex;
  align-items: center;
  padding: 0 56px;
  background: url(../img-top/deco-point-left.svg), url(../img-top/deco-point-right.svg);
  background-position: top left, top right;
  background-repeat: no-repeat;
  background-size: 40px 120px;
  margin-bottom: 24px;
}
.new-voice .voice-box .box .flex img {
  width: 120px;
  height: 120px;
  margin-right: 24px;
}
.new-voice .voice-box .box .flex div span {
  font-size: 16px;
  font-weight: bold;
}
.new-voice .voice-box .box .flex div h3 {
  font-size: 32px;
  font-weight: bold;
}
.new-voice .voice-box .box p {
  font-size: 16px;
  font-weight: bold;
}
@media screen and (min-width: 1080px) {
  .new-voice .voice-box .swiper-button-next,
  .new-voice .voice-box .swiper-button-prev,
  .new-voice .voice-box .swiper-pagination {
    display: none !important;
  }
}
@media (max-width: 1080px) {
  .new-voice .voice-box {
    display: block;
  }
  .new-voice .voice-box .swiper-wrapper {
    display: flex;
    justify-content: space-between;
    flex-wrap: initial;
    padding-bottom: 56px;
  }
  .new-voice .voice-box .box {
    width: 100%;
    margin-bottom: 32px;
  }
  .new-voice .voice-box .box:nth-last-child(1), .new-voice .voice-box .box:nth-last-child(2) {
    margin-bottom: 32px;
  }
  .new-voice .voice-box .box .flex {
    justify-content: center;
    width: 420px;
    margin: 0 auto 24px;
  }
  .new-voice .voice-box .swiper-button-prev,
  .new-voice .voice-box .swiper-button-next {
    position: absolute;
    width: 56px;
    height: 56px;
    top: auto;
    bottom: 0;
    z-index: 2;
  }
  .new-voice .voice-box .swiper-button-prev::after,
  .new-voice .voice-box .swiper-button-next::after {
    display: none;
  }
  .new-voice .voice-box .swiper-button-prev {
    background: url(../img-top/ixon-swiper-left.svg) no-repeat;
  }
  .new-voice .voice-box .swiper-button-next {
    background: url(../img-top/ixon-swiper-right.svg) no-repeat;
  }
  .new-voice .voice-box .swiper-pagination {
    bottom: 16px;
    z-index: 1;
  }
  .new-voice .voice-box .swiper-pagination span {
    width: 12px;
    height: 12px;
    margin: 0 8px;
    background: #17298D;
  }
}
@media (max-width: 640px) {
  .new-voice .head p {
    text-align: left;
  }
  .new-voice .head p br {
    display: none;
  }
  .new-voice .voice-box .box {
    padding: 24px;
  }
  .new-voice .voice-box .box .flex {
    width: 100%;
    padding: 40px 0;
    background: url(../img-top/deco-point-top.png), url(../img-top/deco-point-bottom.png);
    background-repeat: no-repeat;
    background-position: top center, bottom center;
  }
  .new-voice .voice-box .box .flex img {
    width: 80px;
    height: 80px;
  }
  .new-voice .voice-box .box .flex div span {
    font-size: 15px;
  }
  .new-voice .voice-box .box .flex div h3 {
    font-size: 24px;
  }
  .new-voice .voice-box .box p {
    font-size: 15px;
  }
}
@media (max-width: 560px) {
  .new-voice .head h2 {
    font-size: 24px;
  }
  .new-voice .head h2 .font-40 {
    font-size: 32px;
  }
  .new-voice .head p {
    font-size: 16px;
  }
}
@media (max-width: 480px) {
  .new-voice .head h2 {
    font-size: 20px;
  }
  .new-voice .head h2 .font-40 {
    font-size: 28px;
  }
}



/*************************************************
TOP - 教師の質
*************************************************/
.new-plan {
  background: linear-gradient(0deg, #FFF5E3 0%, #FFFFFF 100%);
}
.new-plan .head {
  text-align: center;
  padding: 56px 0;
  background: url(../img-top/deco-head.svg), url(../img-top/deco-head.svg);
  background-position: top center, bottom center;
  background-repeat: no-repeat;
}
.new-plan .head h2 {
  font-size: 32px;
  margin-bottom: 24px;
}
.new-plan .head .font-40 {
  font-size: 40px;
}
.new-plan .head p {
  font-size: 20px;
  font-weight: bold;
}
.new-plan .plan-box {
  margin: 48px 0 0;
  padding: 56px 24px 40px;
  background: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  text-align: center;
}
.new-plan .plan-box h3 {
  font-size: 36px;
  margin-bottom: 40px;
}
.new-plan .plan-box small {
  display: block;
  font-size: 16px;
  font-weight: bold;
  margin-top: 8px;
}
.new-plan .plan-box .more-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  width: 320px;
  height: 72px;
  border-radius: 72px;
  text-decoration: none;
  background: #17298D url(../img-top/icon-more-btn.svg) no-repeat center right 24px;
  margin: 32px auto 0;
  transition: all 0.3s ease;
}
.new-plan .plan-box .more-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}
.new-plan .plan-box .box {
  position: relative;
  padding: 64px 32px 32px;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  margin-bottom: 24px;
}
.new-plan .plan-box .box::before {
  position: absolute;
  content: "";
  width: 100px;
  height: 16px;
  top: 32px;
  left: calc(50% - 50px);
  background: url(../img-top/icon-h3.svg) no-repeat top center;
}
.new-plan .plan-box .box p {
  color: #17298D;
  font-size: 32px;
  font-weight: bold;
}
.new-plan .plan-box .box .font-20 {
  font-size: 20px;
}
.new-plan .plan-box .box .font-24 {
  font-size: 24px;
}
.new-plan .plan-box .box .font-36 {
  font-size: 36px;
}
.new-plan .plan-box .sky {
  background: linear-gradient(0deg, #E3F9FF 0%, #FFFFFF 100%);
}
.new-plan .plan-box .blue {
  background: linear-gradient(0deg, #E6F0FF 0%, #FFFFFF 100%);
}
.new-plan .plan-box .orange {
  background: linear-gradient(0deg, #FFEAD8 0%, #FFFFFF 100%);
}
.new-plan .teacher-box {
  position: relative;
  padding: 0;
  background: none;
  z-index: 1;
}
.new-plan .teacher-box::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 432px;
  left: 0;
  bottom: 0;
  background: linear-gradient(90deg, #29539B 0%, #193056 100%);
  z-index: -1;
}
.new-plan .teacher-box .container {
  padding-top: 0;
}
.new-plan .teacher-box h3 {
  display: inline-block;
  padding: 0 152px;
  font-size: 36px;
  background: url(../img-top/deco-side-left.svg), url(../img-top/deco-side-right.svg);
  background-position: left bottom, right bottom;
  background-repeat: no-repeat;
}
.new-plan .teacher-box .point-w-box {
  padding: 24px 104px;
  text-align: left;
  background: url(../img-top/deco-point-w-left.svg), url(../img-top/deco-point-w-right.svg);
  background-position: center left, center right;
  background-repeat: no-repeat;
}
.new-plan .teacher-box .point-n-box {
  padding: 0 104px;
  text-align: left;
}
.new-plan .teacher-box p {
  color: #fff;
  font-size: 24px;
}
.new-plan .teacher-box .font-32 {
  font-size: 32px;
}
.new-plan .teacher-box .font-40 {
  font-size: 32px;
}
.new-plan .teacher-box .line {
  text-decoration: underline;
}
@media (max-width: 768px) {
  .new-plan {
    display: none;
  }
}



/*************************************************
TOP - コース一覧
*************************************************/
.new-course {
  background: #FFF5E3;
}
.new-course .container {
  padding: 80px 0;
}
.new-course .head {
  text-align: center;
}
.new-course .head h2 {
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 24px;
  display: inline-block;
  padding: 0 152px;
  background: url(../img-top/deco-side-left.svg), url(../img-top/deco-side-right.svg);
  background-position: left bottom, right bottom;
  background-repeat: no-repeat;
}
.new-course .head p {
  font-size: 20px;
  font-weight: bold;
}
.new-course .course-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 64px 0 48px;
}
.new-course .course-box .box {
  width: calc((100% - 96px) / 4);
  background: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
}
.new-course .course-box .box img {
  display: flex;
  margin: -24px auto 0;
}
.new-course .course-box .box h3 {
  color: #17298D;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin: 16px 0 24px;
}
.new-course .course-box .box ul {
  list-style: none;
}
.new-course .course-box .box ul li {
  border-top: #E3E3E3 1px solid;
}
.new-course .course-box .box ul li:last-child {
  border-bottom: #E3E3E3 1px solid;
}
.new-course .course-box .box ul li a {
  display: block;
  color: #29375B;
  font-size: 16px;
  font-weight: bold;
  padding: 16px 56px 16px 20px;
  text-decoration: none;
  background: url(../img-top/icon-course-box-btn.svg) no-repeat center right 12px;
  transition: all 0.3s ease;
}
.new-course .course-box .box ul li a:hover {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.new-course .course-detail-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.new-course .course-detail-box .box {
  width: calc((100% - 48px) / 3);
  background: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  padding: 32px 36px;
  box-sizing: border-box;
}
.new-course .course-detail-box .box h3 {
  color: #17298D;
  font-size: 24px;
  font-weight: bold;
  border-bottom: #E3E3E3 1px solid;
  margin-bottom: 16px;
  padding-bottom: 12px;
}
.new-course .course-detail-box .box ul {
  list-style: none;
}
.new-course .course-detail-box .box ul li {
  font-size: 16px;
  font-weight: bold;
  padding-left: 24px;
  margin-bottom: 8px;
  background: url(../img-top/icon-course-detail-box.svg) no-repeat center left;
}
.new-course .course-detail-box .box ul li:last-child {
  margin-bottom: 0;
}
@media (max-width: 1080px) {
  .new-course {
    display: none;
  }
}



/*************************************************
TOP - 無料体験授業
*************************************************/
.new-guidance {
  background: linear-gradient(0deg, #EDF1F8 0%, #FFFFFF 100%);
}
.new-guidance .head {
  padding-top: 56px;
  text-align: center;
  background: url(../img-top/deco-head.svg) no-repeat top center;
}
.new-guidance .head span {
  color: #17298D;
  font-size: 18px;
  font-weight: bold;
}
.new-guidance .head h2 {
  color: #17298D;
  font-size: 40px;
  margin-bottom: 24px;
}
.new-guidance .head h2 br.sp {
  display: none;
}
.new-guidance .head p {
  font-size: 20px;
  font-weight: bold;
}
.new-guidance .head .font-28 {
  font-size: 28px;
}
.new-guidance .head .font-40 {
  font-size: 40px;
}
.new-guidance .guidance-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 64px;
}
.new-guidance .guidance-box .box {
  width: calc((100% - 48px) / 3);
  background: #FFFFFF;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  margin-bottom: 24px;
}
.new-guidance .guidance-box .box img {
  width: 100%;
  height: auto;
}
.new-guidance .guidance-box .box h3 {
  font-size: 20px;
  font-weight: bold;
  padding: 48px 24px 24px;
  text-align: center;
  background: url(../img-top/icon-h3.svg) no-repeat top 24px center;
}
.new-guidance .contact-box {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.new-guidance .contact-box .btn {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 348px;
  height: 84px;
  border-radius: 80px;
  text-decoration: none;
  text-align: center;
  margin: 0 16px;
  transition: all 0.3s ease;
}
.new-guidance .contact-box .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}
.new-guidance .contact-box .btn span {
  width: 100%;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
}
.new-guidance .contact-box .btn p {
  width: 100%;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
}
.new-guidance .contact-box .btn::after, .new-guidance .contact-box .btn::before {
  position: absolute;
  content: "";
}
.new-guidance .contact-box .btn::before {
  width: 40px;
  height: 40px;
  top: calc(50% - 20px);
  left: 24px;
}
.new-guidance .contact-box .btn::after {
  width: 36px;
  height: 36px;
  top: calc(50% - 18px);
  right: 24px;
}
.new-guidance .contact-box .contact-btn {
  background: #F8A100;
}
.new-guidance .contact-box .contact-btn::before {
  background: url(../img-top/icon-contact-btn.svg) no-repeat top 6px left 4px;
  background-size: 32px;
}
.new-guidance .contact-box .contact-btn::after {
  background: url(../img-top/icon-more-btn-contact.svg) no-repeat;
}
.new-guidance .contact-box .line-btn {
  background: #06C655;
}
.new-guidance .contact-box .line-btn::before {
  background: url(../img-top/icon-line-btn.svg) no-repeat top left;
  background-size: 40px;
}
.new-guidance .contact-box .line-btn::after {
  background: url(../img-top/icon-more-btn-line.svg) no-repeat;
}
@media (max-width: 1280px) {
  .new-guidance .guidance-box {
    margin-top: 48px;
  }
  .new-guidance .guidance-box .box img {
    display: none;
  }
  .new-guidance .guidance-box .box h3 {
    font-size: 18px;
  }
}
@media (max-width: 1080px) {
  .new-guidance .head h2 br.sp {
    display: block;
  }
  .new-guidance .guidance-box {
    margin-top: 48px;
  }
  .new-guidance .guidance-box .box {
    width: calc((100% - 24px) / 2);
  }
}
@media (max-width: 768px) {
  .new-guidance .head {
    padding-top: 56px;
    text-align: center;
    background: url(../img-top/deco-head.svg) no-repeat top center;
  }
  .new-guidance .head span {
    font-size: 24px;
  }
  .new-guidance .head h2 {
    font-size: 32px;
  }
  .new-guidance .head p {
    font-size: 18px;
    text-align: left;
  }
  .new-guidance .head p br {
    display: none;
  }
  .new-guidance .head .font-28 {
    font-size: 24px;
  }
  .new-guidance .head .font-40 {
    font-size: 32px;
  }
  .new-guidance .guidance-box .box {
    width: 100%;
  }
  .new-guidance .contact-box {
    flex-wrap: wrap;
    margin: 0;
  }
  .new-guidance .contact-box .btn {
    width: 100%;
    margin: 16px 0 0;
  }
}
@media (max-width: 480px) {
  .new-guidance .head h2 {
    font-size: 24px;
  }
  .new-guidance .head h2 .font-40 {
    font-size: 28px;
  }
}



/*************************************************
TOP - 対応エリア
*************************************************/
.new-area {
  position: relative;
  background: url(../img-top/area-bg.jpg) no-repeat;
  background-size: cover;
  z-index: 1;
}
.new-area::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 240px;
  left: 0;
  bottom: 0;
  background: linear-gradient(90deg, #EAD16E 0%, #EF9B00 100%);
  z-index: -1;
}
.new-area .flex {
  display: flex;
  justify-content: space-between;
}
.new-area .flex .left {
  width: 664px;
  text-align: center;
}
.new-area .flex .left .head {
  padding-top: 56px;
  text-align: center;
  background: url(../img-top/deco-head.svg) no-repeat top center;
}
.new-area .flex .left .head h2 {
  color: #17298D;
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 48px;
}
.new-area .flex .left .box {
  padding: 24px;
  background: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
}
.new-area .flex .left .box h3 {
  color: #17298D;
  font-size: 32px;
  font-weight: bold;
  border-bottom: #E3E3E3 1px solid;
  padding-bottom: 16px;
  margin-bottom: 16px;
}
.new-area .flex .left .box div span {
  font-size: 24px;
  font-weight: bold;
  padding: 0 16px;
}
.new-area .flex .left .box p {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  padding: 16px;
  background: #17298D;
  margin-top: 32px;
}
.new-area .flex .left .box .font-24 {
  font-size: 24px;
}
@media (max-width: 1080px) {
  .new-area .flex .left .head h2 {
    font-size: 32px;
    margin-bottom: 32px;
  }
  .new-area .flex .left .box h3 {
    font-size: 24px;
  }
  .new-area .flex .left .box div span {
    font-size: 18px;
    padding: 0 12px;
  }
  .new-area .flex .left .box p {
    margin-top: 16px;
    font-size: 18px;
  }
  .new-area .flex .left .box .font-24 {
    font-size: 20px;
  }
  .new-area .flex .right img {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .new-area {
    display: none;
  }
}



/*************************************************
TOP - 体験授業の流れ
*************************************************/
.new-flow {
  position: relative;
  background: linear-gradient(0deg, #FFF5E3 0%, #FFFFFF 100%);
  z-index: 1;
}
.new-flow::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 340px;
  background: url(../img-top/flow-bg.jpg) no-repeat top center;
  background-size: cover;
  z-index: -1;
}
.new-flow .head {
  padding-top: 56px;
  text-align: center;
  background: url(../img-top/deco-head.svg) no-repeat top center;
}
.new-flow .head h2 {
  color: #17298D;
  font-size: 36px;
  font-weight: bold;
  margin-bottom: 48px;
}
.new-flow .flow-box {
  padding: 40px;
  background: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
}
.new-flow .flow-box .box {
  display: flex;
  align-items: center;
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: #D9D9D9 1px solid;
}
.new-flow .flow-box .box:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border: 0;
}
.new-flow .flow-box .box .left {
  width: 120px;
  border-right: #17298D 1px solid;
  padding-right: 32px;
  margin-right: 40px;
  text-align: center;
}
.new-flow .flow-box .box .left span {
  color: #17298D;
  font-size: 22px;
  font-weight: bold;
}
.new-flow .flow-box .box .left p {
  color: #17298D;
  font-size: 56px;
  font-weight: bold;
}
.new-flow .flow-box .box .right h3 {
  color: #17298D;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 8px;
}
.new-flow .flow-box .box .right p {
  font-size: 15px;
  font-weight: 600;
}
@media (max-width: 768px) {
  .new-flow {
    display: none;
  }
}



/*************************************************
よくあるご質問
*************************************************/
.new-faq {
  background: url("../img-top/bg.png") no-repeat center center;
  background-size: cover;
  position: relative;
  border-top: 1px solid #17298D;
  border-bottom: 1px solid #17298D;
  text-align: center;
}
.new-faq .container {
  padding: 80px 0;
}
.new-faq h2 {
  display: inline-block;
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 40px;
  padding-left: 64px;
  background: url(../img-top/icon-faq.svg) no-repeat center left;
}
.new-faq .faq-list {
  text-align: left;
}
.new-faq .faq-list .faq-item {
  border: #17298D 1px solid;
  background: #fff;
  margin-bottom: 24px;
  overflow: hidden;
  transition: all 0.6s ease;
}
.new-faq .faq-list .faq-item:hover {
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}
.new-faq .faq-list .faq-item.active .faq-toggle {
  transform: rotate(180deg);
  transition: all 0.6s ease;
}
.new-faq .faq-list .faq-item.active .faq-answer {
  max-height: 200px;
  opacity: 1;
  transition: all 0.6s ease;
}
.new-faq .faq-list .faq-item .faq-question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 25px 30px;
  cursor: pointer;
  transition: background-color 0.6s ease;
}
.new-faq .faq-list .faq-item .faq-question h3 {
  width: 100%;
  color: #17298D;
  font-size: 20px;
  font-weight: bold;
}
.new-faq .faq-list .faq-item .faq-toggle {
  width: 24px;
  height: 12px;
  transition: transform 0.3s ease;
  margin-left: 20px;
  background: url(../img-top/icon-faq-more.svg) no-repeat;
}
.new-faq .faq-list .faq-item .faq-answer {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  border-top: #E3E3E3 1px solid;
  margin: 0 32px;

  transition: all 0.3s ease;
}
.new-faq .faq-list .faq-item .faq-answer p {
  padding: 12px 0 25px;
  margin: 0;
  font-size: 15px;
  font-weight: 600;
}
@media (max-width: 768px) {
  .new-faq h2 {
    font-size: 32px;
  }
  .new-faq .faq-list .faq-item .faq-question {
    padding: 20px 24px;
  }
  .new-faq .faq-list .faq-item .faq-question h3 {
    font-size: 18px;
  }
}
@media (max-width: 480px) {
  .new-faq .container {
    padding: 48px 0;
  }
  .new-faq h2 {
    font-size: 26px;
    margin-bottom: 32px;
    padding: 48px 0 0;
    background: url(../img-top/icon-faq.svg) no-repeat top center;
  }
}



/*************************************************
フッター
*************************************************/
footer {
    background-color: #f9f9f9;
}
.footer .container {
  padding: 64px 0 16px;
}
.footer .fnav > ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  list-style: none;
}
.footer .fnav > ul > li {
  width: calc((100% - 40px) / 4);
}
.footer .fnav > ul > li p {
  display: block;
  color: #29375B;
  font-size: 20px;
  font-weight: bold;
  text-decoration: none;
  border-bottom: #E3E3E3 1px solid;
  padding-bottom: 12px;
  margin-bottom: 12px;
}
.footer .fnav > ul > li .snav {
  list-style: none;
}
.footer .fnav > ul > li .snav a {
  display: block;
  color: #29375B;
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
  padding-left: 14px;
  background: url(../img-top/icon-fnav.svg) no-repeat top 6px left;
  margin-bottom: 8px;
}
.footer .small-nav {
  border-top: #E3E3E3 1px solid;
  margin-top: 40px;
  padding-top: 16px;
}
.footer .small-nav ul {
  display: flex;
  justify-content: center;
  list-style: none;
}
.footer .small-nav ul li {
  padding: 0 12px;
}
.footer .small-nav ul li a {
  color: #29375B;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
}
.footer small {
  display: block;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  padding: 16px;
  background: #17298D;
  text-align: center;
}
@media screen and (max-width: 640px) {
	.footer {
		margin-bottom: 72px;
		background-color: #fff;
	}
	#top .footer{
    	background-color: #f9f9f9;
	}
}

@media screen and (max-width: 1080px) {
  .footer .container {
    padding: 40px 0 16px;
  }
  .footer .fnav > ul {
    flex-direction: column;
  }
  .footer .fnav > ul > li {
    width: 100%;
    border-bottom: #E3E3E3 1px solid;
  }
  .footer .fnav > ul > li p {
    position: relative;
    cursor: pointer;
    padding: 16px;
    border: 0;
    margin: 0;
  }
  .footer .fnav > ul > li p .fnav-toggle {
    position: absolute;
    display: block;
    width: 21px;
    height: 12px;
    top: 26px;
    right: 24px;
    transition: transform 0.3s ease;
    margin-left: 20px;
    background: url(../img-top/icon-faq-more.svg) no-repeat;
  }
  .footer .fnav > ul > li .snav {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    margin: 0 16px;
  }
  .footer .fnav > ul > li.active .snav {
    max-height: 500px;
    border-top: #E3E3E3 1px solid;
    padding: 16px 0;
  }
  .footer .fnav > ul > li.active p .fnav-toggle {
    transform: rotate(180deg);
    transition: all 0.6s ease;
  }
  .footer .small-nav {
    border: 0;
    margin-top: 0;
    padding-top: 8px;
  }
}
@media screen and (max-width: 640px) {
  .small-nav ul {
    flex-wrap: wrap;
    margin: 12px 0;
  }
  .small-nav ul li {
    width: 100%;
    margin-top: 12px;
  }
  .small-nav ul li:first-child {
    margin-top: 0;
  }
}
@media screen and (max-width: 480px) {
  .footer .container {
    padding: 16px 0;
  }
}



/*************************************************
子ページ共通
*************************************************/
#wrapper {
  margin-top: 150px;
}
@media (max-width: 1280px) {
	#wrapper {
	  margin-top: 100px;
	}
}
@media (max-width: 768px) {
	#wrapper {
	  margin-top:76px;
	}
}
@media (max-width: 480px) {
	#wrapper {
	  margin-top:64px;
	}
}

.h2_area {
    padding: 5px 0 0 0;
    max-width: 1130px;
    margin: 0 auto 10px;
    text-align: right;
    font-size: 12px;
}
@media (max-width: 768px) {
	.h2_area {
		display: none;
	}
}

#contents {
    padding: 0 10px 30px;
	box-sizing: border-box;
    margin:0 auto;
	max-width: 1150px;
	display: flex;
	flex-direction: row-reverse;
	gap:15px;
	justify-content: center;
}
@media (max-width: 960px) {
	#contents {
		gap:0;
	}
}
@media (max-width: 768px) {
	#contents {
		padding: 1.8% 0 30px;
	}
}

#main{
	width:calc(100% - 270px);
	max-width:860px;
	/*color:#000;*/
}
@media (max-width: 960px) {
	#main{
		width:100%;
	}
}
@media (max-width: 768px) {
	#main{
		color:#29375B;
	}
	#main a{
		color: #122a88;
		text-decoration: underline;
	}
}

/*パンクズ*/
#bread_crumb {
	font-size: 12px;
	padding-bottom:3px;
	margin-top:-5px;
	height:30px;
}
#bread_crumb a{
	color:#17489c;
	text-decoration:underline;
}
#bread_crumb a:hover{
	opacity:1.0;
	filter:alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	color:#17489c;
	text-decoration:none;
}
#bread_crumb li {
	display: inline-block;
	color:#666;
}
#bread_crumb li.sub {
	padding-left: 5px;
}
#bread_crumb li.sub:before {
	letter-spacing: 5px;
    content: ">";
}
@media (max-width: 768px) {
	#bread_crumb{
		display: none;
	}
}



/*************************************************
サイドバー
*************************************************/
#side{
	width:255px;
}
@media (max-width: 960px) {
	#side{
		display: none;
	}
}
.side_menu1{
	margin-bottom:8px;
}
.side_title {
    background: url(../img/side/menu3.jpg) center top no-repeat;
    color: #fff;
    font-size: 15px;
    line-height: 33px;
    font-weight: bold;
    padding: 2px 0 0 15px;
	margin-top:15px;
}
.side_title a {
    text-decoration: none;
    color: #fff;
}
.side_title a:hover{
	text-decoration:underline;
	opacity:1.0;
	filter:alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}
.side_title img {
    vertical-align: middle;
    padding-left: 5px;
	top:-3px;
	position: relative;
}
.side_menu3 li {
    background: url(../img/side/menu_bg.jpg) center top no-repeat;
    line-height: 33px;
    padding: 2px 0 0 25px;
}
.side_menu3 li:hover{
	background:url(../img/side/menu_bg_hover.jpg) center top no-repeat;
}
.side_menu3 li a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: block;
}
.side_menu3 li a:hover{  
	color:#af4848;
	text-decoration:underline;
	opacity:1.0;
	filter:alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}
.side_menu5 {
    margin-top: 15px;
    padding-left: 5px;
}
.side_menu6 {
    margin-top: 6px;
    padding-left: 5px;
}
.side_menu6 a {
    background: url(../img/side/button3.png) center top no-repeat;
    display: block;
    width: 257px;
    height: 92px;
    text-indent: -9999px;
}
.side_menu6 a:hover{
	opacity: .8;
}
.side_menu7 {
    margin: 12px 0 15px;
    padding-left: 5px;
}
.side_menu7 a {
    background: url(../img/side/button4.png) center top no-repeat;
    display: block;
    width: 241px;
    height: 71px;
    text-indent: -9999px;
}
.side_menu7 a:hover{
	opacity: .8;
}



/*************************************************
コンテンツ下部バナー
*************************************************/
.common_announce{
	margin:40px auto;
	max-width: 790px;
}
.common_announce p{
}
.common_announce img{
	display:block;
	max-width: 100%;
}
.common_announce .p1 {
	text-align: center;
}
.common_announce .p1 a{
	display: inline-block;
	text-indent: -9999px;
}
.common_announce .p2 {
	margin-top: 10px;
	background:url(../img/common/announce.png) center top/contain no-repeat;
	width:100%;
	max-width:792px;
	box-sizing: border-box;
	aspect-ratio:792/199;
	position: relative;
}
.common_announce .p2 a{
	background: url(../img/common/announce_button3.png) center top/contain no-repeat;
	display: block;
	width:43.41772151898734%;
	max-width: 343px;
	aspect-ratio:343/33;
	text-indent: -9999px;
	position: absolute;
	top:75%;
	left:3.0379746835443%;
}
.common_announce .p2 a:hover{
	background-position: center bottom;
}
@media (max-width: 768px) {
	.common_announce{
		display: none;
	}
}



/*************************************************
サブジェクトメニュー
*************************************************/
.subject_menu{
	max-width:795px;
	padding-bottom:40px;
	margin:0 auto;
}
.subject_menu .title_menu{
	background-color:#726356;
	color:#fff;
	font-size:17px;
	padding:5px 5px 2px 10px;
}
.subject_menu table{
	table-layout:fixed;
	width:100%;
}
.subject_menu table td{
	background: url(../img/common/icon2.jpg) right center no-repeat;
	padding:9px 20px 7px 10px;
	border:solid 1px #cecece;
	text-align:left;
	vertical-align:middle;
	font-size:14px;
}
.subject_menu table td.nasi{
	background: none;
}
.subject_menu table td a:hover{
	color:#af4848;
	text-decoration:underline;
}
.subject_menu table td a:visited{
	color:#7A1683;
}
@media (max-width: 768px) {
	.subject_menu{
		margin:40px 5px 0;
		padding:0;
		background: url(../img/common/bg1.jpg) 0 0 repeat;
	}
	.subject_menu .title_menu{
		font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
		letter-spacing: 0;
	}
	.subject_menu table{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		padding:10px 10px 12px;
		gap:8px;
	}
	.subject_menu tbody,
	.subject_menu tr {
		display: contents;
	}
	.subject_menu table td{
		padding:0;
		background: #fff;
		text-align: center;
		border-color:#dbdbdb;
		box-shadow: 0px 4px 2px -1px rgba(117, 117, 117, 0.3);
		vertical-align: middle;
	}
	.subject_menu table td a{
		display: flex;
		width:100%;
		height:100%;
		justify-content: center;
		align-items: center;
		padding: 1em 2%;
		box-sizing: border-box;
		color:#3a3a3a !important;
		text-decoration: none !important;
		font-size: 95%;
	}
}



/*************************************************
ページャー
*************************************************/
/*お便り紹介*/
.page_navi {
    text-align: center;
    margin-bottom: 30px;
    font-size: 16px;
    padding-top: 10px;
}
.page_navi li {
    margin-right: 8px;
    display: inline-block;
}
.page_navi li span{
    color: #fff;
    background-color: #3f8097;
    display: inline-block;
    padding: 3px 10px;
    border: solid 1px #949494;
}
.page_navi li a {
    background-color: #eaeaea;
    color: #1a1a1a;
    display: inline-block;
    padding: 3px 10px;
    border: solid 1px #949494;
}
@media (max-width: 768px) {
	.page_navi {
		padding: 0 0 5%;
		font-size: 131%;
	}
	.page_navi li{
		box-sizing: border-box;
		margin-bottom: 1.5%;
	}
	.page_navi li span {
		border: solid 1px #ccc;
		padding: 0.5em 0.8em;
	}
	.page_navi li a {
		border: solid 1px #ccc;
		background-color: #e6e6e6;
		padding: 0.5em 0.8em;
		color: #1a1a1a !important;
		text-decoration: none !important;
	}
}

/*SP用(お便り紹介詳細)*/
.page_nav_s {
    margin: 4% 2% 7%;
    position: relative;
}
.page_nav_s li.next {
    width: 33%;
    float: right;
}
.page_nav_s li.list {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 30%;
	height:54px;
}
.page_nav_s li.prev {
    width: 33%;
    float: left;
}
.page_nav_s li a {
    border: solid 1px #ccc;
    color: #1a1a1a !important;
    background-color: #e6e6e6;
    display: block;
    padding: 0.9em 0;
    text-decoration: none !important;
    text-align: center;
}

/*NEWS*/
#pageNavi{
	margin:20px 0;
}
#pageNavi .pages,
#pageNavi .current,
#pageNavi .extend,
#pageNavi a{
	display:block;
	float:left;
	margin-left:3px;
	color:#fff;
	padding:0 8px;
	background:#122a88;
	line-height:20px;
	text-decoration:none;
	border-radius:2px;
}
#pageNavi previouspostslink,
#pageNavi nextpostslink{
	display:block;
	float:left;
	margin-left:3px;
}
#pageNavi a:hover {
	background: #09C;
}
#pageNavi .pages,
#pageNavi .current{
	background:#ccc;
}
#pageNavi:before,
#pageNavi:after {
	content:"";
	display:block;
	overflow:hidden;
}
#pageNavi:after {clear:both;}
#pageNavi {zoom:1;}



/*************************************************
テキスト
*************************************************/
/*ページタイトル*/
#page_ttl{
	background: url(../img/ttl/sp/page_ttl_top.jpg) center top no-repeat, url(../img/ttl/sp/page_ttl_bottom.jpg) center bottom no-repeat, url(../img/ttl/sp/page_ttl_y.jpg) center top repeat-y;
	background-size: 100% auto, 100% auto, 100% auto;
    font-size: 36px;
    font-weight: bold;
    color: #003791;
    line-height: 44px;
    padding: 15px 20px 9px 25px;
    margin-bottom: 10px;
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	display: flex;
	align-items: center;
}
#page_ttl span{
	display: block;
	background:url(../img/ttl/page_ttl_icon.jpg) 5px center no-repeat #003791;
	height:28px;
	line-height:28px;
	color:#fff;
	font-size:16px;
	font-family: "Noto Serif JP", serif;
	padding:0 10px 0 28px;
	margin:-7px 15px 0 -25px;
	letter-spacing: inherit;
}
#page_ttl .no_icon{
	background:#003791;
	padding:0 15px;
}
@media (max-width: 768px) {
	#page_ttl{
		font-size: 175%;
		padding: 2.9% 3% 2.2% 4%;
		line-height: 1.2;
		margin-bottom: 3%;
		font-family: "Noto Serif JP", serif;
	}
	#page_ttl span{
		display: none;
	}
	#page_ttl .sp_ok{
		display:block;
		font-size:15px;
		margin:-5px 5px 0 -15px;
	}
}

/*共通タイトル(紺帯)*/
.common_title,
.common_title2,
.title01{
	background: url(../img/ttl/common_ttl.jpg) 0 0 repeat;
    color: #fff;
    font-weight: bold;
    font-size: 19px;
    height: 38px;
    line-height: 40px;
    padding-left: 13px;
    margin-bottom: 18px;
	max-width:833px;
	box-sizing: border-box;
	letter-spacing: normal;
	position: relative;
}
.common_title:before,
.common_title2:before,
.title01:before{
		content:'';
		display: block;
		width:5px;
		height:0;
    	padding-top:18px;
		position: absolute;
		left:0;
		top:0;
		bottom:0;
		margin:auto 0;
		background: rgba(255,255,255,0.5);
}
.common_title.has_btn{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-right:4px;
}
.common_title_btn{
    background: url(../img/common/btn_list.png) center top no-repeat;
    display: block;
    width: 140px;
    height: 29px;
    text-indent: -9999px;
}
.common_title_btn:hover{
	background-position: center bottom;
	opacity: 1;
}
@media (max-width: 768px) {
	.common_title {
		margin: 3% 0 1.8%;
		color: #fff;
		font-size:clamp(17px,3.5vw,19px);
		font-weight: bold;
		padding: 2.5% 1% 2.1% 0.5em;
		height:auto;
		line-height: 1.6;
	}
	.common_title:before{
		width:5px;
    	padding-top:1.2em;
	}
	.cont1 .common_title {
		width:calc(100% + 32px);
		margin-left:-16px;
	}
	.cont2 .common_title {
		width:calc(100% + 16px);
		margin-left:-8px;
	}
	
	.common_title.has_btn{
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding:4px 4px 4px 3%;
	}
	.common_title.has_btn p{
		font-size:clamp(16px,4.5vw,20px);
	}
	.common_title_btn{
		background: url(../img/common/sp/btn_list.png) center top/contain no-repeat;
		width: 32.5%;
		max-width:134px;
		height: auto;		
		aspect-ratio:247/69;
	}
	
	.common_title2{
		background: #122B88;
		border-radius: 5px;
		margin: 5% 0 3% 0;
		font-size:clamp(16px,3.7vw,19px);
		line-height: 1.6;
		padding: 1.5% 2% 1.5% 3%;
		height:auto;
	}
	.common_title2:before{
		display: none;
	}
	.title01{
		border-radius: 3px;
		font-size:clamp(14px,3.6vw,16px);
		margin-bottom:10px;
	}
	.title01:before{
		width:2.5px;
    	padding-top:1.8em;
	}
}

.common_title3{
	background: url(../img/ttl/common_ttl.jpg) 0 0 repeat;
    color: #fff;
    font-weight: bold;
    font-size: 23px;
    height: 48px;
    line-height: 48px;
    padding-left: 13px;
    margin-bottom: 18px;
	box-sizing: border-box;
	letter-spacing: normal;
	position: relative;	
}
.common_title3:before{
	content:'';
	display: block;
	width:5px;
	height:0;
	padding-top:40px;
	position: absolute;
	left:0;
	top:0;
	bottom:0;
	margin:auto 0;
	background: rgba(255,255,255,0.5);
}
@media (max-width: 768px) {
	.common_title3 {
		margin: 3% 0 1.8%;
		color: #fff;
		font-size: 125%;
		font-weight: bold;
		padding: 2.5% 1% 2.1% 0.5em;
		height:auto;
		line-height: 1.6;
	}
	.common_title3:before{
		width:5px;
    	padding-top:1.2em;
	}
}

/*投稿タイトル1*/
.ttl1{
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 15px;
    padding: 8px 8px 8px 15px;
    background:#f8f8f8;
	color: #29375B;
	position: relative;
	box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.07);
}
.ttl1:before{
	content:'';
	display: block;
	background:#2b2e7d;
	width:5px;
	height:80%;
	position: absolute;
	left:0;
	top:0;
	bottom:0;
	margin:auto 0;
}
/*投稿タイトル2(1の差分)*/
.ttl2{
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 15px;
    padding:4px 1em;
    background:#fff;
	color: #29375B;
	position: relative;
	border:solid 1px #e6e6e6;
}
.ttl2:before{
	content:'';
	display: block;
	background:#2b2e7d;
	width:5px;
	height:80%;
	position: absolute;
	left:0;
	top:0;
	bottom:0;
	margin:auto 0;
}

/*アコーディオン*/
.acc_trg{
	cursor: pointer;
}
.ttl2.acc_trg:after{
	content:'';
    display: block;
    width:20px;
	height:20px;
	position: absolute;
	right:10px;
	top:0;
	bottom:0;
	margin:auto 0;
    background: url(../img/common/ico_plus.png) 0 0/cover no-repeat;
}
.ttl2.acc_trg.is-open:after{
    background: url(../img/common/ico_minus.png) 0 0/cover no-repeat;
}

@media (max-width: 768px) {
	.ttl1{
		font-size:clamp(15px,3.8vw,17px);
		padding: 10px 10px 10px 15px;
	}
	.ttl1:before{
		width:4px;
		height:74%;
	}
	.ttl2{
		font-size:clamp(15px,3.8vw,17px);
		padding: 10px 10px 10px 15px;
		background: #f8f8f8;
	}
	.ttl2:before{
		width:4px;
		height:65%;
	}
	.ttl2.acc_trg{
		font-size: 115%;
		padding: 3.5% 3% 3% 3%;
		border-top: 1px solid #eee;
		border-bottom: 1px solid #eee;
	}
	.ttl2.acc_trg:before{
		width:6px;
		height:50%;
	}
}

.ttl3{
	background-color: #005a66;
    color: #fff;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 23px;
    line-height: 31px;
    padding-left: 15px;
    margin-bottom: 10px;
	letter-spacing:0;
	font-weight: 500;
}
@media (max-width: 768px) {
	.ttl3{
		padding: 0.3rem 0.7rem;
		font-size: 1.14rem;
		margin-bottom: 0.7rem;
	}
}

/*formタイトル*/
.ttl4{
	background: url(../img/common/bg1.jpg) 0 0 repeat;
    font-weight: bold;
    font-size: 17px;
    line-height:1.4;
	padding:7px 10px 7px 13px;
    margin-bottom: 8px;
	position: relative;
}
.ttl4:before{
	content:'';
	display: block;
	background:#2b2e7d;
	width:6px;
	height:70%;
	position: absolute;
	left:0;
	top:0;
	bottom:0;
	margin:auto 0;
}
@media (max-width: 768px) {
	.ttl4{
		padding: 0.5rem 0.7rem;
		font-size: 1.14rem;
		margin-bottom: 0.7rem;
	}
	.ttl4:before{
		width:5px;
		height:90%;
	}
}

/*横線+下線（家庭教師募集）*/
.ttl5{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-weight: bold;
	border-bottom:1.5px solid #d4d4d4;
	position: relative;
	padding:5px 10px 0 10px;
	font-size:20px;
	color:#343434;
	letter-spacing: 0;
	margin-bottom:10px;
}
.ttl5:before{
	content:'';
	display: block;
	background:#2b2e7d;
	width:6px;
	height:70%;
	position: absolute;
	left:0;
	top:0;
	bottom:0;
	margin:auto 0;
}
@media (max-width: 768px) {
	.ttl5{
		font-family: "Noto Serif JP", serif;
		background: url(../img/ttl/ttl5.jpg) 0 0 repeat;
		padding:10px 10px 10px 15px;
		border:0;
		color: #29375B;
	}
	.ttl5:before{
		width:5px;
	}
}


/*通常テキスト*/
.txt1{
    padding-left: 1em;
	line-height: 1.7;	
}
@media (max-width: 768px) {
	.txt1{
		padding-left: 0;
	}
}

.txt2{
	padding:0 0.5em;
}
@media (max-width: 768px) {
	.txt2{
		padding: 0;
	}
}

.txt3{
	text-align: center;
}
@media (max-width: 768px) {
	.txt3{
		text-align: left;
	}
}

/*インデント*/
.txt_indent1{
    text-indent: 1em;	
}
@media (max-width: 768px) {
	.txt_indent1{
		text-indent: 0;	
	}
}
.ind3{
	padding-left:3em;
	text-indent: -3em;
}

/*weight*/
.bold{
	font-weight: bold;
}

/*サイズ*/
.fs_s{
	font-size:14px;
}

/*色*/
.red {
    color: #aa1021;
}
.red2 {
    color: #dd2326;
}
.navy{
	color:#29375B;
}
.green {
    color: #0b868d;
}
.green2 {
    color: #007180;
}

/*PC：黒　SP：紺*/
.cl01{
	color:#000;
}
.cl02{
	color:#030000;
}
@media (max-width: 768px) {
	.cl01,
	.cl02{
		color:#29375B;
	}	
}

/*フォントファミリー*/
.ff_maru{
	font-family: "M PLUS Rounded 1c", sans-serif;
}
.ff_yugo{
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

/*line-height*/
.lh0{
	line-height:0;
}



/*************************************************
ボタン
*************************************************/
.btn {
    display: inline-block;
    position: relative;
    padding: 0.15em 1em 0.2em;
    vertical-align: middle;
    text-align: center;
    text-decoration: none !important;
    border-radius: 3px;
    font-style: normal;
    font-weight: normal;
    box-shadow: inset 0 -2px 0px rgba(0, 0, 0, .1);
}
.btn-blu {
    margin-right: 3%;
    color: #fff !important;
    border: 1px solid rgba(0, 0, 0, .1);
    background: #122b88;
    font-size: 92%;
}



/*************************************************
BOX
*************************************************/
.cont1{
	padding-left:1em;
}
@media (max-width: 768px) {
	.cont1 {
		padding:0 1em;
	}
}

.cont2{
	padding:0 1em;
}
@media (max-width: 768px) {
	.cont2 {
		padding:0 0.5em;
	}
}

.cont3{
	padding:0 10px;
}

.cont4{
	padding:0 1em;
}
@media (max-width: 768px) {
	/*SP時のみ余白なし*/
	.cont4{
		padding:0;
	}
	
	/*SP時のみ余白*/
	.cont5{
		padding:0 0.5em;
	}
}

/*縁ありグレー（志望校別 傾向と対策single）*/
.box1{
    padding: 20px;
    background: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin-bottom: 20px;
}
@media (max-width: 768px) {
	.box1{
		padding: 20px 10px;
	}
}

/*背景色*/
.bg_gray{
	background: #f5f5f5;
}



/*************************************************
DL
*************************************************/
/*個人情報DL*/
.dl1 dt {
    background: url(../img/ttl/dl1_ttl.jpg) center top no-repeat;
    padding: 6px 1.5em 4px;
    font-weight: bold;
}
.dl1 dd {
    padding: 8px 0 25px 1.5em;
    font-size: 15.5px;
}
@media (max-width: 1150px) {
	.dl1 dt {
		background: url(../img/ttl/dl1_ttl2.jpg) center top no-repeat;
		background-size: 100% 100%;
	}
}
@media (max-width: 768px) {
	.dl1 dt {
		padding: 2.2% 2% 1.7% 3.3%;
		font-size:clamp(12px,3.7vw,16px);
	}
	.dl1 dd {
		padding: 1.5% 3% 2.5% 4%;
		font-size:clamp(11.5px,3.5vw,15.5px);
	}
}



/*************************************************
UL
*************************************************/
/*報道・News*/
.ul1 li {
    border-bottom: 1px dotted #ddd;
    padding: 18px 10px 16px 15px;
	display: flex;
	gap:20px;
}
.ul1_day{
	flex-shrink: 0;
}
.ul1_ttl a{
    text-decoration: none;
}
@media (max-width: 768px) {
	.ul1{
		margin-bottom:30px;
	}
	.ul1 li {
		padding: 3% 4px;
		border-bottom: dotted 1px #ddd;
		flex-direction: column;
		gap:0;
	}
	.ul1_day{
		letter-spacing: 1.5px;
	}
	.ul1_ttl a{
		text-decoration: underline;
		display: block;
	}
}



/*************************************************
テーブル
*************************************************/
/*会社概要*/
.tb1 {
	width:100%;
    max-width: 833px;
	border-collapse: collapse;
}
.tb1 th {
    vertical-align: top;
    padding: 13px 5px 11px 10px;
    text-align: left;
    border-top: solid 1px #e5e5e5;
    border-bottom: solid 1px #e5e5e5;
    border-left: solid 1px #e5e5e5;
    width: 170px;
    background-color: #f6f6f6;
}
.tb1 td {
    vertical-align: top;
    padding: 13px 25px 11px 25px;
    text-align: left;
    border-top: solid 1px #e5e5e5;
    border-bottom: solid 1px #e5e5e5;
    border-right: solid 1px #e5e5e5;
}
@media (max-width: 768px) {
	.tb1{
		font-size:clamp(12px,3.7vw,16px);
	}
	.tb1 th {
		vertical-align: top;
		padding:1em 0.5em;
		border-color:#ccc;
		width: 5em;
		background-color: #e5e5e5;
	}
	.tb1 td{
		padding:1em 0.5em;
		border-color:#ccc;
		border-right:1px solid #ccc;
	}
}

/*志望校別 傾向と対策*/
.tb2{
    width: 100%;
    table-layout: fixed;
    margin-bottom: 22px;
}
.tb2 td {
    padding: 2px 5px;
    text-align: center;
    border: solid 1px #ccc;
    font-size: 14px;
}
.tb2 tr:nth-of-type(2n) td{
	background: #f5f5f5;	
}
@media (max-width: 768px) {
	.tb2,
	.tb2 *{
		display: block;
	}
	.tb2 td {
		padding:0;
		border: solid 1px #e0e0e0;
		border-bottom:0;
		background: none !important;
	}
	.tb2 a{
		padding: 2.6% 2% 2.3%;
		color: #000 !important;
		text-decoration: none !important;
		font-weight: bold;
		font-size: 107%;
	}
	.tb2 tr:nth-of-type(2n + 1) td:nth-of-type(2n + 1),
	.tb2 tr:nth-of-type(2n) td:nth-of-type(2n){
		background:#e0e0e0 !important;
	}
}

/*エリア別受験動向*/
.tb3{
    max-width: 810px;
	width:100%;
    table-layout: fixed;
	margin:18px auto 20px;
}
.tb3 th {
    text-align: center;
    background: #ddd;
}
.tb3 thead th {
    background: #C0C0C0;
}
.tb3 th,
.tb3 td {
    padding: 10px 5px;
    vertical-align: middle;
    text-align: center;
    border: 1px solid #aaa;
}
.tb3 tr.spacer th,
.tb3 tr.spacer td {
    padding: 3px !important;
    border: none !important;
}
.tb3 .lev1 td {
    background: #e5eafd;
}
.tb3 .lev2 td {
    text-align: left;
    background: #cdd6fb;
}
.tb3 .lev3 td {
    background: #bcc9fd;
}
@media (max-width: 768px) {
	.tb3{
		margin-bottom: 4%;
		font-size: 78%;
		line-height: 1.45;
		border-collapse: collapse;
	}
	.tb3 thead th {
		background: #ddd;
	}
	.tb3 th{
		font-weight: bold;
	}
	.tb3 .lev2 td {
		text-align:center;
	}
}

/*画像付き一覧*/
.table01{
	width:100%;
    margin-bottom: 50px;
	table-layout: fixed;
}
.table01 td {
    padding: 8px 0;
    font-size: 15px;
    text-align: center;
	vertical-align:top;
    border: 1px solid #eee;
}
.table01 a {
    text-decoration: underline;
	display: block;
	padding:0 8px;
}
.table01 .img {
	width:100%;
    display: block;
    margin:0 auto 8px;
	aspect-ratio:190/125;
	box-sizing: border-box;
}
.table01 .img img {
    width:100%;
	aspect-ratio:190/125;
    object-fit: cover;
}
@media (max-width: 768px) {
	.table01 {
		width: 94%;
		margin:0 auto 5%;
		border-collapse: collapse;
		border-top: 1px solid #ddd;
		border-left: 1px solid #ddd;
	}
	.table01 tr {
		display: flex;
		flex-wrap: wrap;
	}
	.table01 td {
		width: 50%;
		box-sizing: border-box;
		padding: 0;
		line-height: 1.4;
		border:0;
		border-right: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		font-size:clamp(12px,3vw,16px);
	}
	.table01 a {
		padding:8px;
	}
}



/*************************************************
投稿記事
*************************************************/
.post_day{
    font-size: 14px;
    color: #666666;
    margin-bottom: 10px;
    padding-right: 10px;
	text-align: right;
}
.post_img{
	float:left;
	margin:0 20px 10px 0;
	width:220px;
}
@media (max-width: 768px) {
	.post_day{
		display: none;
	}
	.post_img{
		display: none;
	}
}

#edit_area p{
	margin-bottom:0.75em;
}
.link_box a{
	text-decoration: underline;
	color:#333;
}
.link_box a:hover{
	text-decoration:none;
}



/*************************************************
目次（プラグイン自動出力）
*************************************************/
#ez-toc-container{
	width:100%;
	box-sizing: border-box;
}
#ez-toc-container a{
	color:#444;
	text-decoration: none;
}



/*************************************************
共通テンプレート
*************************************************/
/*common_price.php*/
.common_price_announce{
	margin-top:40px;
}
#common_price_txt{
	max-width: 780px;
	margin:5px auto 30px;
}
@media (max-width: 768px) {
	#common_price_txt{
		padding:5px 10px 0;
	}
}

/*common_nagare.php*/
#common_nagare{
	padding-top:30px;
}
#common_nagare_info{
	text-align: center;
	margin-bottom:15px;
}
#common_nagare_ul{
	display: flex;
	gap:12px;
	flex-wrap: wrap;
	max-width: 785px;
	margin:0 auto;
}
#common_nagare_ul li{
	width:calc(100% / 3 - 24px / 3);
	box-sizing: border-box;
	border:solid #818181;
	border-width:4px 1px 1px 1px;
}
#common_nagare_ul figure{
	margin:0;
}
#common_nagare_ul p{
	font-size: 14px;
    line-height: 23px;
	padding:8px;
	color:#000;
}
@media (max-width: 768px) {
	#common_nagare{
		padding-top:15px;
	}
	#common_nagare_info{
		padding:5px;
	}
#common_nagare_ul{
	gap:8px 20px;
	padding:0 4px;
}
#common_nagare_ul li{
	width:calc(50% - 10px);
	position: relative;
}
#common_nagare_ul li:nth-of-type(2n - 1):after{
	content:'';
	display: block;
	width:16px;
	height:28px;
	background: url("../img/common/flow_arrow.jpg") 0 0/contain no-repeat;
	position: absolute;
	top:0;
	bottom:0;
	right:-20px;
	margin:auto 0;
}
#common_nagare_ul p{
	font-size:clamp(12px,2.5vw,16px);
    line-height: 1.6;
	padding:0 5px 5px;
	color:#333;
}
}



/*************************************************
家庭教師募集
*************************************************/
#ent_ttl{
	padding:0 0 10px 10px;
}
.ent_txt{
	padding:0 0 20px 20px;
}
#ent_box{
	background: url(../img/entry/img02.jpg) center 0/100% no-repeat;
	aspect-ratio:830/234;
	position: relative;
	margin:0 10px 20px;
}
#ent_box a{
	display: block;
	position: absolute;
	right:2px;
	bottom:2px;
}
#ent_flow{
	padding:5px 10px;
	margin-bottom:10px;
}
.ent_txt2{
	font-size:14px;
	padding:0 10px 40px;
}
@media (max-width: 768px) {
	#ent_ttl{
		padding:0 0 10px 0;
	}
	.ent_txt{
		padding:0 10px 20px;
	}
	#ent_box{
		background: url(../img/entry/sp/img02.jpg) center 0/100% no-repeat;
		aspect-ratio:76/23;
		margin:0 0 20px;
		padding-bottom:8%;
	}
	#ent_box a{
		right:0;
		left:0;
		bottom:0;
		margin:0 auto;
		width:98%;
		max-width: 733px;
	}
	#ent_flow{
		padding:0;
		margin-bottom:30px;
	}
}



/*************************************************
コース（子ページ）
*************************************************/
/*タイトル周り*/
#cc_ttl img{
	width:100%;
}
#cc_info_wrap{
	background: url(../img/course/info.jpg) 0 bottom repeat-x;
	box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
	padding:6px 10px 12px;
	margin-bottom:30px;
}
#cc_info{
	background-color: #fff; /* 背景色 */
	background-image: linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%), /* 点線1の色 */
		linear-gradient(180deg, #bdbdbd 1.5px, transparent 1.5px); /* 点線2の色と太さ */
	background-size: 6px 100%, /* 点線1のサイズ */
				   100% 1.7em; /* 点線2のサイズ */
	line-height: 1.7em; /* 文字の高さ */
	padding-bottom: 1.5px; /* 最終行の下にも罫線を引く */
}
#cc_info p{
	border-top:2px solid #FFF;
}
@media (max-width: 768px) {
	#cc_info_wrap{
		background: url(../img/course/info_sp.jpg) 0 bottom repeat-x;
		box-shadow:none;
		margin-bottom:0;
		padding:4px 10px 20px;
	}
	#cc_info{
		background:none;
		padding-bottom:0;
		line-height:1.6;
	}
	#cc_info .blue{
		color:#076baf;
	}
}

/*画像+テキスト*/
.cc_flex01{
	display: flex;
	gap:15px;
}
.cc_flex01_fgr{
	width:36%;
	flex-shrink:0;
	margin:0;
}
.cc_thum{
	margin-bottom:8px;
}
@media (max-width: 768px) {
	.cc_flex01{
		display: block;
	}
	.cc_flex01_fgr{
		float:left;
		margin:0 8px 8px 0;
		width:40%;
	}
	.cc_thum{
		width:40%;
		margin:0 8px 8px 0;
	}
}

/*合格率は*/
.cc_box01{
	background: url(../img/course/bg_dot.jpg) 0 0 repeat;
	padding-bottom:15px;
}
.cc_box01_ttl{
	padding:15px;
}
.cc_box01_div{
	margin:0 25px 0;
	background: #fff;
	padding:10px 20px;
}
@media (max-width: 768px) {
	.cc_box01{
		background:#fef5ec;
		padding-bottom:12px;
	}
	.cc_box01_ttl{
		padding:15px 7px;
	}
	.cc_box01_div{
		margin:0 8px 0;
		background: #fff;
		padding:10px 8px;
	}
}

/*どのように学習を進めていくか*/
.cc_box02{
	background: url(../img/course/bg_grd.jpg) 0 0 repeat-x;/*水色グラデ*/
}
.cc_box02_txt{
	padding:15px;
}
.cc_ul01{
	display: flex;
	flex-wrap: wrap;
	gap:5px;
	padding-bottom:35px;
	background: url(../img/course/arrow.jpg) center bottom no-repeat;
}
.cc_ul01 li{
	width:calc(25% - 15px/4);
	box-sizing: border-box;
	border:1px solid #ddd;
}
.cc_ul01 figure{
	margin-bottom:8px;
	aspect-ratio:196/138;
}
.cc_ul01 figure img{
	width:100%;
	height:100%;
	object-fit: cover;
}
.cc_ul01 p{
	padding:0 8px 8px;
	font-size:clamp(10px,1.1vw,15px);
}
@media (max-width: 960px) {
	.cc_ul01 p{
		font-size:clamp(12px,1.5vw,15px);
	}
}
@media (max-width: 768px) {
	.cc_box02{
		background: url(../img/course/bg_grd_sp.jpg) 0 0 repeat-x;/*水色グラデ*/
	}
	.cc_box02_txt{
		padding:5px 8px 8px;
	}
	.cc_ul01{
		padding-bottom:30px;
		background: url(../img/course/arrow.jpg) center bottom/160px no-repeat;
	}
	.cc_ul01 li{
		width:calc(50% - 5px/2);
	}
	.cc_ul01 figure{
		margin-bottom:5px;
		aspect-ratio:35/22;
	}
	.cc_ul01 p{
		font-size:clamp(12px,3.4vw,18px);
	}
}

/*カリキュラムご紹介*/
.cc_crc_ul{
	padding:10px;	
}
.cc_crc_ul li{
	margin-bottom:10px;
}
.cc_crc_ul a{
	display: flex;
	border:1.5px solid #71c5d2;
}
.cc_crc_ul li a:hover{
	opacity: inherit;
	background: #f3ffff;
}
.cc_crc_l{
	width:306px;
	flex-shrink: 0;
	background: url(../img/course/crc.png) calc(100% - 12px) calc(100% - 10px) no-repeat;
	padding-bottom:20px;
	position: relative;
}
.cc_crc_l:after{
	content:'';
	display: block;
	width:82px;
	height:82px;
	position: absolute;
	top:-15px;
	bottom:0;
	right:40px;
	margin:auto 0;
}
.i01 .cc_crc_l:after{background: url(../img/course/i01.png) 0 0 no-repeat;}
.i02 .cc_crc_l:after{background: url(../img/course/i02.png) 0 0 no-repeat;}
.i03 .cc_crc_l:after{background: url(../img/course/i03.png) 0 0 no-repeat;}
.i04 .cc_crc_l:after{background: url(../img/course/i04.png) 0 0 no-repeat;}
.i05 .cc_crc_l:after{background: url(../img/course/i05.png) 0 0 no-repeat;}
.i06 .cc_crc_l:after{background: url(../img/course/i06.png) 0 0 no-repeat;}
.i07 .cc_crc_l:after{background: url(../img/course/i07.png) 0 0 no-repeat;}
.i08 .cc_crc_l:after{background: url(../img/course/i08.png) 0 0 no-repeat;}
.i09 .cc_crc_l:after{background: url(../img/course/i09.png) 0 0 no-repeat;}
.i10 .cc_crc_l:after{background: url(../img/course/i10.png) 0 0 no-repeat;}

.cc_crc_l p{
	color:#71c5d2;
	line-height:1.6;
	display: flex;
	align-items: center;
	min-height:100px;
	height:100%;
	padding-left:15px;
}
.cc_crc_r{
	width:calc(100% - 306px);
	box-sizing: border-box;
	border-left:1.5px dotted #71c5d2;
	background: url(../img/course/crc02.png) calc(100% - 10px) center no-repeat;
	color:#000;
	padding:10px 50px 10px 10px;
	line-height: 1.2;
}
.cc_crc_r dt{
	font-weight: bold;
	margin-bottom:8px;
}
.cc_crc_r dd{
	font-size: 15px;
	padding:0 0 0 15px;
	margin-bottom:6px;
}
.cc_crc_r dd:last-of-type{
	margin-bottom:0;
}
.cc_crc_r dd:before{
	content:'';
	display:inline-block;
	width:10px;
	height:10px;
	background:#f1aa3e; 
	position: relative;
	left:-10px;
	top:-1px;
}
@media (max-width: 768px) {
	.cc_crc_ul{
		padding:8px 5px 10px;	
	}
	.cc_crc_ul li{
		margin-bottom:5px;
	}
	.cc_crc_ul a{
		display: block;
		background:#f3ffff; 
		text-decoration: none !important;
	}
	.cc_crc_l{
		width:100%;
		box-sizing: border-box;
		background: url(../img/course/sp/crc.jpg) 0 bottom/contain no-repeat;
		padding:10px 10px 5px;
	}
	.cc_crc_l:after{
		display:none;
	}
	.cc_crc_l p{
		display: block;
		min-height:auto;
		height:auto;
		padding:0;
		color:#3da7b8;
		font-size:clamp(14px,3.8vw,16px);
	}
	.cc_crc_l br{
		display: none;
	}
	.cc_crc_r{
		width:100%;
		color: #29375B;
		border-left:0;
		background:none;
		font-size:92%;
		padding:10px 50px 10px 5px;
	}
	.i01 .cc_crc_r{background: url(../img/course/sp/i01.jpg) right 0/400px no-repeat;}
	.i02 .cc_crc_r{background: url(../img/course/sp/i02.jpg) right 0/400px no-repeat;}
	.i03 .cc_crc_r{background: url(../img/course/sp/i03.jpg) right 0/400px no-repeat;}
	.i04 .cc_crc_r{background: url(../img/course/sp/i04.jpg) right 0/400px no-repeat;}
	.i05 .cc_crc_r{background: url(../img/course/sp/i05.jpg) right 0/400px no-repeat;}
	.i06 .cc_crc_r{background: url(../img/course/sp/i06.jpg) right 0/400px no-repeat;}
	.i07 .cc_crc_r{background: url(../img/course/sp/i07.jpg) right 0/400px no-repeat;}
	.i08 .cc_crc_r{background: url(../img/course/sp/i08.jpg) right 0/400px no-repeat;}
	.i09 .cc_crc_r{background: url(../img/course/sp/i09.jpg) right 0/400px no-repeat;}
	.i10 .cc_crc_r{background: url(../img/course/sp/i10.jpg) right 0/400px no-repeat;}
	.cc_crc_r dd{
		font-size:102%;
		padding-left:10px;
	}
	.cc_crc_r dd:before{
		width:9px;
		height:9px;
		left:-5px;
	}
}

/*カリキュラム例*/
.cc_ex_num{
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#000;
	font-weight: bold;
	font-size:19.5px;
	display: flex;
	align-items: center;
	margin-bottom:8px;
}
.cc_ex_num span{
	font-size:120%;
}
.cc_ex_num:before,
.cc_ex_num:after {
  content: "";
  background-color: #000; /* 線の色 */
  height: 2px; /* 線の高さ */
  width: 25px; /* 線の長さ */
}
.cc_ex_num:before {
  margin-right:0; /* 文字との余白 */
  transform: rotate(70deg); /* 傾ける */
}
.cc_ex_num:after {
  margin-left:0; /* 文字との余白 */
  transform: rotate(-70deg); /* 傾ける */
}
.cc_ex_box{
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
	padding:10px;
	border-radius: 4px;
	background: #f5f6f8;
	margin-bottom:20px;
}
.cc_ex_ttl{
	width:calc(100% + 10px);
	margin-bottom:10px;
}
.cc_ex_ans{
	border:1px solid #88dec5;
	border-radius: 4px;
	background: #fff;
	padding:10px;
}
.cc_ex_ans:before{
	content:'';
	display: block;
	width:60px;
	height:60px;
	float:left;
	background: url(../img/course/check.jpg) 0 0/cover no-repeat;
	margin:0 10px 5px 0;
}
.cc_ex_ans .ff_maru{
	font-size: 105%;
	letter-spacing: 0;
	color:#336fad;
	font-weight: 700;
}
@media (max-width: 768px) {
	.cc_ex_num{
		font-size:18px;
		margin-bottom:0px;
		padding-left:5px;
	}
	.cc_ex_num:before,
	.cc_ex_num:after {
	  width: 20px; /* 線の長さ */
	}	
	.cc_ex_box{
		box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
		padding:5px 5px 8px;
		border-radius:0;
		margin-bottom:15px;
	}
	.cc_ex_ttl{
		width: 100%;
		margin-bottom:0;
	}
	.cc_ex_ans{
		padding:15px 10px;
	}
	.cc_ex_ans:before{
		width:12%;
		max-width:60px;
		aspect-ratio:1/1;
		height:auto;
		margin:0 4px 5px 0;
	}
	.cc_ex_ans p:first-of-type:before{
		content:'【四谷進学会からの回答】';
		font-size:clamp(12px,3.6vw,16px);
		position: relative;
		left:-0.5em;
		font-family: "M PLUS Rounded 1c", sans-serif;
		color:#336fad;
		display: block;
	}
	.cc_ex_thum{
		float:right;
		width:38%;
		max-width:288px;
		margin:0 0 5px 5px;
	}
}

/*アフターフォロー*/
#cc_af{
	margin:40px auto 0;
	border:1px solid #8a837d;
	border-top:3px double #8a837d;
	border-bottom:3px double #8a837d;
}
#cc_af_dl{
	display: flex;
	gap:10px 0;
	flex-wrap: wrap;
	align-items: stretch;
	background: url(../img/course/af_img.jpg) 10px 0 no-repeat;
	min-height:167px;
	padding:17px 10px 17px 25%;
	box-sizing: border-box;
	font-size:clamp(12px,1.4vw,16px);
	margin-bottom:20px;
}
#cc_af_dl.type02{background: url(../img/course/af_img02.jpg) 10px 0 no-repeat;}
#cc_af_dl dt{
	background: url(../img/course/af_dt.png) 0 0 no-repeat #293088;
	color:#fff;
	width:13em;
	box-sizing: border-box;
	padding:0.3em 10px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
}
#cc_af_dl dd{
	border:1px solid  #293088;
	margin-left:auto;
	padding:5px 10px;
	box-sizing: border-box;
	width:calc(100% - 13em);
	color:#000;
	display: flex;
	align-items: center;
}
.cc_af_txt{
	padding:0 20px 20px;
}
@media (max-width: 768px) {
	#cc_af{
		margin:30px 5px 0;
		box-sizing: border-box;
	}
	#cc_af_dl{
		display: none;
	}
	.cc_af_txt{
		padding:0 10px 10px;
	}
}

/*合格体験*/
.cc_taiken{
	background: url(../img/course/taiken_bg.jpg) 0 0/100% repeat-y;
	padding:10px;
	border-top:1px solid #8a837d;
}
.cc_taiken:before{
	content:'';
	display: block;
	width:100%;
	max-width:758px;
	aspect-ratio:758/61;
	background: url(../img/course/taiken_jr.png) 0 0/100% no-repeat;
	margin:0 auto 10px;
}
.cc_taiken.junior:before{background: url(../img/course/taiken_jr.png) 0 0/100% no-repeat;}
.cc_taiken.high:before{background: url(../img/course/taiken_high.png) 0 0/100% no-repeat;}
.cc_taiken.middle:before{background: url(../img/course/taiken_mdl.png) 0 0/100% no-repeat;}
.cc_taiken.medical:before{background: url(../img/course/taiken_mdc.png) 0 0/100% no-repeat;}
.cc_taiken.taiken:before{background: url(../img/course/taiken_anq.png) 0 0/100% no-repeat;}
.cc_taiken ul{
	display: flex;
	gap:6px;
	justify-content: center;
	text-align: center;
}
.cc_taiken_fgr{
	border: solid 1px #dfd9d1;
    box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 1px 1px 10px 0px rgba(0,0,0,0.1);
    -webkit-box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.1);
	margin-bottom:10px;
}
.cc_taiken ul p{
	line-height:1.3;
}
.cc_taiken_area{
	margin-right:1em;
}
@media (max-width: 768px) {
	.cc_taiken{
		padding:5px 15px 5px;
	}
	.cc_taiken.junior:before{
		margin:0 auto 5px;
		width:calc(100% + 40px);
		margin-left:-20px;
	}
	.cc_taiken_ttl{
		margin-bottom:5px;		
	}
	.cc_taiken ul{
		background:url(../img/course/taiken_click.png) center bottom/182px no-repeat;
		padding-bottom:35px;
	}
	.cc_taiken ul li:last-of-type{
		display:none;
	}
	.cc_taiken_fgr{
		border:0;
		box-shadow:none;
		margin-bottom:5px;
	}
	.cc_taiken ul p{
		font-size:clamp(12px,3vw,16px);
	}
	.cc_taiken_area{
		margin-right:0;
	}
}

/*保護者の皆様へ*/
#cc_msg{
	margin:30px 0 0;
	background: url(../img/course/junior/msg_ttl.jpg) 0 0/contain no-repeat;
}
#cc_msg.mid{
	background: url(../img/course/middle/msg_ttl.jpg) 0 0/contain no-repeat;
}
#cc_msg.no_photo{
	background: none;
}
#cc_msg.no_photo #cc_msg_ttl{
	background:#e45825;
	color:#fff;
	font-size: clamp(18px, 2vw, 40px);
	padding:5px 10px;
	margin-bottom: 25px;
	letter-spacing: 0;
}
.cc_mdg_txt01{
	padding:8.5% 42% 40px 20px;
	line-height: 31px;
}
#cc_msg_grd{
	background: -webkit-linear-gradient(rgba(254,254,254,1) 0%, rgba(252,251,249,1) 50%, rgba(247,242,236,1) 100%);
	background: -o-linear-gradient(rgba(254,254,254,1) 0%, rgba(252,251,249,1) 50%, rgba(247,242,236,1) 100%);
	background: linear-gradient(rgba(254,254,254,1) 0%, rgba(252,251,249,1) 50%, rgba(247,242,236,1) 100%);
}
.cc_msg_ttl02{
	padding:0 30px 20px;
}
.cc_msg_dl {
	padding:0 30px;
}
.cc_msg_dl dt{
	color:#1f2f53;
	border-bottom:1px solid #1f2f53;
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: bold;
	font-size:22px;
	position: relative;
	padding-left:12px;
	padding-bottom:2px;
	margin-bottom:10px;
	line-height:1.2;
}
.cc_msg_dl dt:before{
	content:'';
	display: block;
	width:7px;
	height:1em;
	position: absolute;
	top:0px;
	left:0;
	background:#1f2f53;
	border-radius: 3px;
}
.cc_msg_dl dd{
	padding:0 10px 30px;
}
@media (max-width: 768px) {
	#cc_msg,
	#cc_msg.mid,
	#cc_msg.no_photo{
		margin:20px 0 0;
		background: linear-gradient(to bottom,  rgba(247,242,236,1) 1%,rgba(252,251,249,1) 13%,rgba(254,254,254,1) 46%,rgba(252,251,249,1) 88%,rgba(247,242,236,1) 100%);
	}
	#cc_msg_ttl{
		background:#e45825;
		color:#fff;
		font-size:clamp(20px,4vw,22px);
		padding:5px 10px;
	}
	.cc_mdg_txt01{
		padding:10px;
		line-height:1.6;
	}
	#cc_msg_grd{
		background:none;
	}
	.cc_msg_ttl02{
		padding:0 10px 10px;
	}
	.cc_msg_dl {
		padding:0 10px;
	}
	.cc_msg_dl dt{
		font-size:clamp(16px,2.5vw,22px);
		margin-bottom:5px;
	}
	.cc_msg_dl dt:before{
		width:5px;
		height:1.2em;
		top:-1px;
	}
	.cc_msg_dl dd{
		padding:0 0 15px;
	}	
}

/*medical_追加分*/
.cc-step-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    background: #f7f3ea;
    border: 2px dotted #aaaaaa;
    padding: 6px;
	color:#000;
}
.cc-step-list .cc-step-item {
    padding: 3px 14px;
    font-size: 14px;
    line-height: 1.6;
}
@media (max-width: 768px) {
  .cc-step-list {
      grid-template-columns: repeat(2, 1fr);
	  color:#29375B;
	}
}
    
/*univ_追加分*/
.cc-step-list02 {
    display: block;
    background: #fee6c0;
    border: 2px dotted #646464;
    padding: 6px;
	color:#000;
}
.cc-step-list02 p{
	padding: 1.5%;
}
@media (max-width: 768px) {
  .cc-step-list02 {
	  color:#29375B;
	}
}



/*************************************************
カリキュラム（子ページ）
*************************************************/
#crc_ttl{
	border-bottom:2px solid #7f9bc7;
	margin:0 0 10px;
	line-height: 0;
}
#crc_ttl img{
	width:100%;
}
.crc_wrap{
	border:1.5px solid #86d1d7;
	margin:-8px 0 35px;
}
.crc_top{
	background:#f3ffff; 
	padding:10px;
}
.crc_top_icon{
	float:left;
	width:90px;
	padding:0 15px 5px 5px;
}
.crc_btn{
	padding:5px 0 0;
}
@media (max-width: 768px) {
	.crc_wrap{
		border:0;
		margin:0 0 20px;
	}
	.crc_top{
		border:1px solid #7eccd7;
	}
}

.crc_middle{
	padding:10px 10px 0;
	border-top:1.5px solid #86d1d7;
}
.crc_dl{
	display: flex;
	border:1.5px solid #0f9c98;
	border-radius: 12px;
	overflow: hidden;
	gap:20px;
	line-height:1.2;
	margin:0 0 15px;
}
.crc_dl dt{
	display: flex;
	gap:10px;
	font-weight: bold;
	flex-shrink: 0;
}
.crc_dl_dt01{
	display: block;
	background:#0f9c98;
	border-radius:0 10px 10px 0;
	color:#fff;
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	letter-spacing: 0;
	padding:7px 10px 2px;
}
.crc_dl_dt02{
    color: #0aa095;
	padding:5px 10px;
}
.crc_dl dd{
	display: flex;
	gap:0 20px;
	flex-wrap:wrap;
	padding:5px 10px;
}
.crc_dl dd b{
    color: #0aa095;
}
@media (max-width: 768px) {
	.crc_middle{
		border:1px solid #e0e0e0;
	}
	.crc_dl{
		display:block;
		border:1px solid #0f9c98;
		border-radius: 5px;
	}
	.crc_dl dt{
		justify-content: space-between;
		background:#0f9c98;
	}
	.crc_dl_dt02{
		color:#fff;
	}
	.crc_dl dd{
		display: block;
	}
	.crc_dl dd p{
		display: inline;
		margin-left:1em;
	}
	.crc_dl dd p:first-of-type{
		margin-left:0;
	}
}

.crc_dl02{
	display: flex;
	gap:5px;
	padding:0 0 15px 10px;
}
.crc_dl02 dt{
	flex-shrink: 0;
	font-weight:bold;
}
.crc_dl02 dt:before{
	display: inline-block;
	content:'';
	width:10px;
	height:10px;
	background: #f1aa3e;
	position: relative;
	top:-2px;
	margin-right:5px;
}
.crc_dl02 dt:after{
	content:'／';
}
@media (max-width: 768px) {
	.crc_dl02{
		display:block;
		padding:0 0 10px;
	}
	.crc_dl02 dt{
		font-size:18px;
	}
	.crc_dl02 dt:after{
		display: none;
	}
}

.crc_tb_wrap{
	border: dotted #a0a0a0;
	border-width:1.5px 0;
	padding:15px 5px;
	margin-bottom:15px;
}
.crc_tb{
    width: 100%;
    font-size: 14px;
    line-height: 23px;
}
.crc_tb th {
    font-weight: bold;
    text-align: left;
}
.crc_tb th.th1 {
    width: 171px;
}
.crc_tb th.th2 {
    width: 68px;
}
.crc_tb th.th3 {
    width: 130px;
}
.crc_tb td {
    background-color: #f1f1f1;
    border: solid 4px #fff;
}
.crc_tb td.c {
    text-align: center;
    padding: 8px 0 6px;
}
.crc_tb td.lf {
    text-align: left;
    padding: 8px 5px 6px 12px;
}
.td_p1 {
    padding: 0 8px;
}
.td_p1 .left {
    float: left;
}
.td_p1 .right {
    float: right;
}
@media (max-width: 768px) {
	.crc_tb_wrap{
		border:0;
		padding:0;
	}
	.crc_tb,
	.crc_tb *{
		width: 100%;
		box-sizing: border-box;
		display: block;
		border:0;
		padding: 0 !important;
		text-align: left;
	}
	.crc_tb th{
		display: none;
	}
	.crc_tb td{
		background: #fff;
		border:solid #cbcbcb;
		border-width:1px 1px 0;
		display: flex;
		align-items: stretch;
	}
	.crc_tb_txt{
		border-bottom:1px solid #cbcbcb !important;
		margin-bottom:8px;
	}
	.crc_tb td p{
    	padding: 1% 1% 1% 2% !important;
	}
	.crc_tb_day p span{
		float:none !important;
		display: inline;
	}
	.crc_tb td:before{
		display: block;
		background:#f1f1f1;
		width:6em;
		flex-shrink: 0;
		border-right: solid 1px #cbcbcb;
		font-weight: bold;
    	padding: 1% 1% 1% 2%;
		text-align: left;
		box-sizing: border-box;
	}
	.crc_tb_day:before{content:'開始時間';}
	.crc_tb_time:before{content:'時間数';}
	.crc_tb_kamoku:before{content:'教科';}
	.crc_tb_txt:before{content:'授業内容';}
}



/*************************************************
授業開始までの流れ
*************************************************/
#pf_step{
	padding:30px 20px;
}
.pf_step_dl{
	padding:0 0 30px 98px;
	background: url(../img/price-flow/step1.jpg) 0 0 no-repeat;
}
.pf_step_dl:nth-of-type(2){
	background: url(../img/price-flow/step2.jpg) 0 0 no-repeat;
}
.pf_step_dl:nth-of-type(3){
	background: url(../img/price-flow/step3.jpg) 0 0 no-repeat;
}
.pf_step_dl:nth-of-type(4){
	background: url(../img/price-flow/step4.jpg) 0 0 no-repeat;
}
.pf_step_dl dt{
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#554a42;
	font-weight: bold;
	font-size:26px;
	border-bottom:1.5px dotted #d5d5d5;
	line-height:1.4;
	padding:8px 0 0;
	margin-bottom:10px;
}
.pf_step_dl dt span{
	font-size:80%;
	letter-spacing: 0;
}
#pf_step_txt01{
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#38398c;
	font-size:18px;
	font-weight: bold;
	background:#f3f3f3; 
	text-align: center;
	padding:5px;
	line-height:1.2;
}
#pf_step_txt02{
	font-size:15px;
	color: #00215c;
}
.pf_step_btn{
	background: url(../img/price-flow/bg.jpg) 0 0 repeat;
	display: flex;
	justify-content: center;
	align-items: center;
	padding:5px;
}
#pf_step_point{
	margin:20px 0 0;
	background: url(../img/price-flow/bg.jpg) 0 0 repeat;
	padding:15px;
	position: relative;
}
#pf_step_txt03{
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:18px;
	font-weight:600;
	color:#353535;
	padding:0 0 5px;
}
#pf_point_btn{
	position: absolute;
	right:15px;
	top:2px;
}
#pf_point_fgr{
	text-align: center;
	margin:0;
}
#pf_point_fgr img{
	width:100%;
}
@media (max-width: 1059px) {
	#pf_step_txt03{
		padding:0;
	}
	#pf_point_btn{
		position:relative;
		right:auto;
		top:auto;
		text-align: right;
		margin-bottom:5px;
	}
}
@media (max-width: 768px) {
	#pf_step{
		padding:15px 5px 0;
	}
	.pf_step_dl{
		padding:0 5px 20px 55px;
		background:none !important;
		position: relative;
	}
	.pf_step_dl:before{
		content:'';
		display: block;
		width:45px;
		height:calc(100% - 22px);
		position: absolute;
		top:0;
		left:0;
		background-color:#6099c6;
		background-image: url(../img/price-flow/sp/step1.jpg);
		background-position: center;
		background-size: 100%;
		background-repeat: no-repeat;
		border-radius: 8px;
	}
	.pf_step_dl:nth-of-type(2):before{
		background-image: url(../img/price-flow/sp/step2.jpg);
	}
	.pf_step_dl:nth-of-type(3):before{
		background-image: url(../img/price-flow/sp/step3.jpg);
	}
	.pf_step_dl:nth-of-type(4):before{
		background-image: url(../img/price-flow/sp/step4.jpg);
	}
	.pf_step_dl:after{
		content:'';
		display: block;
		width:45px;
		height:10px;
		position: absolute;
		bottom:10px;
		left:0;
		background: url(../img/price-flow/sp/step_arrow.jpg) center/100% no-repeat;
	}
	.pf_step_dl:last-of-type:after{
		display:none;
	}
	.pf_step_dl dt{
		font-size:clamp(20px,4vw,26px);
		padding:2px 0 0;
		margin-bottom:5px;
	}
	.pf_step_dl dd{
		padding-bottom:5px;
	}
	#pf_step_txt01{
		font-size:clamp(14px,3.7vw,18px);
		text-align:left;
		padding:6px 6px 2px;
		line-height:1.4;
	}
	#pf_step_txt02{
		font-weight: bold;
	}	
	#pf_step_point{
		margin:10px 0 0;
		padding:10px;
	}
	#pf_step_txt03{
		font-size:clamp(18px,4.8vw,20px);
		text-align: center;
	}
	#pf_point_btn{
		text-align:center;
		width:90%;
		max-width: 340px;
		margin:0 auto 5px;
	}
	#pf_point_fgr img{
		max-width:603px;
	}
}

#pf02{
	max-width:800px;
	margin:0 auto;
	box-sizing: border-box;
	padding:0 10px;
}
#pf02_ttl{
	border:1.5px solid #cbc9c6;
	font-size:22px;
	font-weight: bold;
	color:#282723;
	background:#f9f9f1;
	text-align: center;
	line-height:1.2;
	padding:10px;
}
#pf02 div{
	border:1.5px solid #cbc9c6;
	border-top:0;
	padding:10px;
}
#pf02_fgr{
	float: left;
	margin:0 10px 0 0;
}
@media (max-width: 768px) {
	#pf02{
		padding:0 5px;
	}
	#pf02_ttl{
		border-width:1px;
		font-size:clamp(18px,5vw,22px);
		text-align:left;
		padding:8px;
	}
	#pf02 div{
		border-width:1px;
		padding:8px 6px;
	}
	#pf02_fgr{
		float: left;
		margin:0 5px 0 0;
		width:40%;
		max-width:290px;
	}
}


/*************************************************
選ばれる理由
*************************************************/
#fr_ttl01{
	margin-bottom:12px;
}
#fr_dl_wrap{
	display: flex;
	flex-wrap: wrap;
	gap:16px;
	margin-bottom:34px;
}
.fr_dl{
	width:calc(50% - 8px);
	background:#edf6f5; 
	border-radius: 3px;
}
.fr_dl dt{
	border-radius: 3px;
	background: linear-gradient(to bottom right, rgba(102,167,205,1) 1%, rgba(114,181,222,1) 50%, rgba(84,163,238,1) 51%, rgba(61,159,220,1) 51%, rgba(84,163,238,1) 51%, rgba(59,154,217,1) 100%);
	color:#fff;
	font-size:clamp(18px,2vw,24px);
	font-weight:bold;
	text-align: center;
}
.fr_dl dd{
	padding:15px 15px 20px;
	box-sizing: border-box;
	min-height:184px;
}
@media (max-width: 960px) {
	.fr_dl dt{
		font-size:clamp(18px,5vw,24px);
	}
}
@media (max-width: 768px) {
	#fr_ttl01{
		margin-bottom:0;
		line-height: 0;
	}
	#fr_dl_wrap{
		gap:10px;		
		flex-direction: column;
		background: #f9f9f9;
		padding-top:5px;
		padding-bottom:8px;
		margin-bottom:25px;
	}
	.fr_dl{
		width:100%;
		background: #e5eff0;
	}
	.fr_dl dd{
		padding:15px 15px;
		min-height:inherit;
	}
}

#fr02{
	max-width:800px;
	margin:0 auto 50px;
}
.fr_reason{
	background: url("../img/first-reason/fr02_a.jpg") right 0 no-repeat #fefdfb;
}
#fr_reason02{
	background: url("../img/first-reason/fr02_b.jpg") right 0 no-repeat #fefdfb;
}
#fr_reason03{
	background: url("../img/first-reason/fr02_c.jpg") right 0 no-repeat #fefdfb;
}
.fr_reason:after{
	content:'';
	display: block;
	width:calc(100% - 20px);
	border-top:1.5px dotted #c0c0be;
	margin:25px auto 0;
}
.fr_reason:last-of-type:after{
	display:none;
}
.fr_reason_ttl{
	font-size:28px;
	color:#5b3e08;
	font-weight: bold;
	background: url("../img/first-reason/i_crown.jpg") 10px 15px no-repeat;
	padding:8px 0 10px 60px;
}
.fr_ul{
	padding:0 140px 10px 65px;
}
.fr_ul li{
	position: relative;
	margin:0 0 5px;
}
.fr_ul li:before{
	content:'';
	display: block;
	width:6px;
	height:6px;
	background: #5b3e08;
	border-radius: 5px;
	position: absolute;
	top:0.6em;
	left:-1em;
}
@media (max-width: 768px) {
	#fr02{
		margin:0 auto 5%;
	}
	.fr_reason{
		border-top:1px dotted #c0c0be;
		background:#fefdfb !important;
		padding:0 5px 10px;
	}
	.fr_reason:after{
		display:none;
	}
	.fr_reason_ttl{
		font-size:clamp(20px,5vw,28px);
		background: url("../img/first-reason/i_crown.jpg") 5px center/8% no-repeat;
		padding:5px 0 5px calc(8% + 10px);
	}
	.fr_ul{
		padding:0 0 10px 1.5em;
	}
	.fr_ul li:before{
		width:5px;
		height:5px;
		top:0.65em;
	}
}

.fr_voice{
	padding:0 20px 0 50px;
}
.fr_voice_ttl{
	background: #cde7f4;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding:2px 10px;
	margin-bottom:5px;
}
.fr_voice_ttl p{
	background: url("../img/first-reason/i_click.jpg") 0 0 no-repeat;
	height:28px;
	padding-left:27px;
	font-size: 15px;
    color: #4d4d4d;
	letter-spacing:0;
	line-height: 28px;
}
.fr_voice_ul{
	display: flex;
}
.fr_voice_ul li{
	width:25%;
	text-align: center;
}
@media (max-width: 768px) {
	.fr_voice{
		padding:0 5px;
	}
	.fr_voice_ttl img{
		height:27px;
	}
	.fr_voice_ttl p{
		background: url("../img/first-reason/sp/i_click.jpg") 0 center/contain no-repeat;
		height:27px;
		text-indent:100%;
		overflow: hidden;		
		padding-left:0;
		line-height: 27px;
	}
	.fr_voice_ul li{
		width:calc(100% / 3);
	}
	.fr_voice_ul li:last-of-type{
		display: none;
	}
}

#fr03{
	max-width: 780px;
	margin:0 auto;
}
#fr_ttl03{
	margin-bottom: 15px;
}
#fr03_dl_wrap{
	position: relative;
}
#fr03_dl_wrap:after{
	content:'';
	display: block;
	background: url(../img/first-reason/fr03img.png) 0 0/contain no-repeat;
	height:625px;
	aspect-ratio:208/625;
	position: absolute;
	right:15px;
	top:0;
	bottom:0;
	margin:auto 0;
}
.fr03_dl{
	background: #f6fbfe;
	padding:10px 230px 10px 15px;
	margin-bottom:5px;
}
.fr03_dl dt{
	color:#5e4939;
	font-size:24px;
	font-weight:600;
	text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
	  -1px 1px 0 #FFF, 1px -1px 0 #FFF,
	  0px 1px 0 #FFF,  0-1px 0 #FFF,
	  -1px 0 0 #FFF, 1px 0 0 #FFF;
}
.fr03_ul {
	padding-left:1em;
}
.fr03_ul li{
	text-indent: -1em;
}
.fr03_ul li:before{
	content:'・';
}
@media (max-width: 768px) {
	#fr03_dl_wrap{
		padding:0 5px;
	}
	#fr03_dl_wrap:after{
		display:none;
	}
	.fr03_dl{
		padding:8px 25% 8px 5px;
		font-size:clamp(14px,3.5vw,16px);
		position: relative;
		overflow: hidden;
		background: #f0fafc;
	}
	.fr03_dl:before{
		content:'';
		display:block;
		width:40%;
		aspect-ratio:300/266;
		background-image: url("../img/first-reason/sp/fr03_dl1.jpg");
		background-position:center;
		background-size:contain;
		background-repeat:  no-repeat;
		position: absolute;
		top:0;
		right:0;
		z-index:1;
	}
	.fr03_dl:nth-of-type(2):before{
		background-image:url("../img/first-reason/sp/fr03_dl2.jpg");
	}
	.fr03_dl:nth-of-type(3):before{
		background-image:url("../img/first-reason/sp/fr03_dl3.jpg");
	}
	.fr03_dl:nth-of-type(4):before{
		background-image:url("../img/first-reason/sp/fr03_dl4.jpg");
		aspect-ratio:300/308;
	}
	.fr03_dl:nth-of-type(5):before{
		background-image:url("../img/first-reason/sp/fr03_dl5.jpg");
	}
	.fr03_dl:nth-of-type(6):before{
		background-image:url("../img/first-reason/sp/fr03_dl6.jpg");
	}
	.fr03_dl dt{
		font-size:clamp(18px,4vw,24px);
		position: relative;
		z-index: 2;
		padding-left:10px;
	}
	.fr03_dl dd{
		position: relative;
		z-index: 2;
	}
}


/*************************************************
無料体験授業のご案内
*************************************************/
#trial_flex1{
    color: #000;
}
.trial_flex1_note{
    color: #444444;
    font-size:87%;
}
#trial_flex1_fgr{
	float:right;
	margin:0 0 10px 10px;
	width:32.7%;
	max-width:274px;
}
.trial_txt1{
	margin-bottom:8px;
    color: #000;
}
@media (max-width: 768px) {
	#trial_flex1{
		padding:0 10px;
		display: block;
		font-size:clamp(14px,3.7vw,16px);
		color: #29375B;
	}
	.trial_flex1_note{
		color: #999;
		font-weight: bold;
		line-height: 1.4;
	}
	#trial_flex1_fgr{
		margin-right:-10px;
		width:40%;
	}
	.trial_txt1{
		margin-bottom:1.5%;
		color: #29375B;
	}
}

.trial_dl{
	border-top:1.5px solid #a6a6a6;
	position: relative;
    color: #000;
}
.trial_dl:before{
	content:'';
	display: block;
	width:30px;
	height:calc(100% - 20px);
	position: absolute;
	top:0;
	left:0;
	background: -webkit-linear-gradient(rgba(253,253,243,1) 1%, rgba(252,242,200,1) 100%);
	background: -o-linear-gradient(rgba(253,253,243,1) 1%, rgba(252,242,200,1) 100%);
	background: linear-gradient(rgba(253,253,243,1) 1%, rgba(252,242,200,1) 100%);
}
.trial_dl:after{
	content:'';
	display: block;
	width:30px;
	height:20px;
	position: absolute;
	bottom:0;
	left:0;
	aspect-ratio: 2;
	clip-path: polygon(50% 100%,100% 0,0 0);
	background: -webkit-linear-gradient(rgba(252,242,200,1) 1%, rgba(249,239,199,1) 100%);
	background: -o-linear-gradient(rgba(252,242,200,1) 1%, rgba(249,239,199,1) 100%);
	background: linear-gradient(rgba(252,242,200,1) 1%, rgba(249,239,199,1) 100%);
}
.trial_dl:last-of-type:before{
	height:100%;
}
.trial_dl:last-of-type:after{
	display: none;
}
.trial_dl dt{
	position: relative;
	z-index: 9;
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: bold;
	font-size:22px;
	padding:10px 0 8px;
}
.trial_dl_num{
	font-family: "Noto Serif JP", serif;
	color:#a47a6a;
	font-size:120%;
	display: inline-block;
	width:30px;
	text-align: center;
	margin-right:10px;
}
.trial_dl dd{
	padding:0 0 30px 40px;
}
.trial_dl dd figure{
	margin:0;
}
#trial_dl_2{
	background: url(../img/trial/trial_dl_2.jpg) right 8px/230px no-repeat;
	padding-right:220px;
}
#trial_dl_4 dd{
	padding-bottom:10px;
}
.trial_dl_note{
	font-size:14px;
}
@media (max-width: 768px) {
	.trial_dl{
		border-top:1.5px solid #c9c9c9;
	}
	.trial_dl:before{
		left:5px;
	}
	.trial_dl:after{
		left:5px;
	}
	.trial_dl dt{
		font-size:clamp(18px,4.5vw,22px);
		padding:0 5px;
	}
	.trial_dl_num{
		font-size:140%;
	}	
	.trial_dl dd{
		padding:0 10px 10px 45px;
		color: #29375B;
	}
	#trial_dl_2{
		background: url(../img/trial/trial_dl_2.jpg) right 0/45% no-repeat;
		padding-right:10px;
	}
	#trial_dl_2 dd:before{
		content:'';
		display:block;
		width:40%;
		padding-top:35%;
		float:right;
	}
}
#trial_bottom{
	background: url(../img/trial/trial_bottom02.jpg) calc(100% - 15px) 70px/270px 148px no-repeat #f6f6f6;
	max-width: 839px;
	margin:20px auto 20px;
}
#trial_bottom_ttl img{
	width:100%;
}
#trial_bottom_txt{
	padding:0 295px 15px 20px;
	color:#000;
	min-height:148px;
}
#trial_bottom03{
	background: url(../img/trial/trial_bottom03.jpg) 0 0/100% no-repeat;
	aspect-ratio:839/291;
	position: relative;
}
#trial_bottom03 a{
	display: block;
	width:43.2657926102503%;
	aspect-ratio:363/41;
	text-indent: -9999px;
	background: url(../img/common/announce_button1.jpg) 0 0/cover no-repeat;
	position: absolute;
	top:56.3573883161512%;
	left:4.64839094159714%;
}
#trial_bottom03 #trial_btn02{
	background: url(../img/common/announce_button2.jpg) 0 0/cover no-repeat;
	left:51.96662693682956%;
}
@media (max-width: 768px) {
	#trial_bottom{
		background: #f6f6f6;
		max-width: 839px;
		margin:20px auto 20px;
	}
	#trial_bottom_ttl{
		line-height: 0;
	}
	#trial_bottom_txt{
		background: url(../img/trial/sp/trial_bottom02.jpg) right 0/100% no-repeat #f6f6f6;
		padding:0 10px 15px;
		color: #29375B;
	}
	#trial_bottom_txt:before{
		content:'';
		display:block;
		width:42%;
		padding-top:30%;
		float:right;
	}
}



/*************************************************
看板家庭教師（詳細）
*************************************************/
#pickup_top{
    box-sizing: border-box;
    background: #edf4f7 url(../img/pickup/bg05.png) center top/cover no-repeat;
    padding: 15px 35px 15px 20px;
    font-size: 16px;
    line-height: 25px;
	display: flex;
	flex-direction:row-reverse;
	gap:10px;
	justify-content: space-between;
	margin-bottom:20px;
}
#pickup_thum{
    width: 196px;
    height: 270px;
    border: 2px solid white;
	flex-shrink: 0;
	background: #ccc;
}
#pickup_thum img{
    width:100%;
    height:100%;
	object-fit: cover;
}
#pickup_data{
	margin-right:auto;
}
#pickup_single_name {
    padding-top: 10px;
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 17px;
    padding-left: 5px;
    padding-bottom: 2px;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#pickup_single_name span {
    color: #005a66;
    font-size: 19px;
    font-weight: bold;
}
.pickup_dl{
	display:inline-block;
	margin-right:40px;
	margin-bottom:10px;	
}
.pickup_dl dt{
	display:inline-block;
	background: #005a66;
    color: white;
    padding: 2px 5px;
    margin-right: 5px;
}
.pickup_dl dd{
	display:inline-block;
}
#pickup_single_tb{
	width:100%;
	table-layout: fixed;
	margin-top:10px;
}
#pickup_single_tb th {
    width: 126px;
    border: 1px solid #7f8080;
    background: #f0f0f0;
    padding: 10px 0 10px 10px;
}
#pickup_single_tb td {
    border: 1px solid #7f8080;
    background: white;
    padding: 10px 5px 10px 10px;
    vertical-align: top;
}
#pickup_single_tb li {
    text-indent: -1em;
    margin-left: 1em;
}
#pickup_single_tb li::before {
    content: "・";
}
#pickup_message_ul li+li{
	border-top: 1px dashed #7f8080;
}
#pickup_message_ul li{
	padding: 15px 5px;
	overflow: hidden;
}
.pickup_message_imgwrap{
	float: left;
}
.pickup_message_contents{
	margin-left: 177px;
	font-size: 14px;
}
.pickup_msg_title{
	font-size: 19px;
	font-weight: bold;
}
.pickup_msg_title::before{
	content: "「";
}
.pickup_msg_title::after{
	content: "」";
}
#pickup_youtube {
	background: #e6e6e5;
	padding: 34px;
	text-align: center;
}
#pickup_youtube iframe{
    max-width: 100%;
}
.single-pickup .common_announce{
	margin-top:0;
}
@media (max-width: 768px) {
	#pickup_top{		
		background: #edf4f7 url(../img/pickup/sp/bg05.png) center top/cover no-repeat;
		width:97.3%;
		margin:0 auto 20px;
		padding: 0.5rem;
		gap:20px;
	}
	#pickup_thum{
		width:30%;
		height:auto;
		aspect-ratio:116/165;
	}
	#pickup_data{
		width:calc(70% - 20px);
	}
	#pickup_single_name {		
		font-size: 1.2rem;
		padding: 0.6rem 0;
		margin-bottom: 0.5rem;
	}
	#pickup_single_name span {
		font-size: 1.34rem;
	}
	.pickup_dl{
		display:flex;
		margin-right:0;
		margin-bottom:0;
		border-right:1px solid #005a66;
		width:100%;
		font-size:90%;
	}
	.pickup_dl:first-of-type{
		border-top:1px solid #005a66;
	}
	.pickup_dl dt{
		padding:0;		
		margin-right:0;
		box-sizing: border-box;
		width:30%;
		border-bottom:1px solid #fff;
		text-align: center;
		font-weight:bold;
	}
	.pickup_dl:last-of-type dt{
		border-bottom:1px solid #005a66;
	}
	.pickup_dl dd{
		width:70%;
		box-sizing: border-box;
		padding:0 0 0 0.4rem;
		background: #fff;
		border-bottom:1px solid #005a66;
	}
	
	
#pickup_single_tb{
	width:100%;
	table-layout: fixed;
	margin-top:10px;
}
#pickup_single_tb th {
    width: 126px;
    border: 1px solid #7f8080;
    background: #f0f0f0;
    padding: 10px 0 10px 10px;
}
#pickup_single_tb td {
    border: 1px solid #7f8080;
    background: white;
    padding: 10px 5px 10px 10px;
    vertical-align: top;
}
#pickup_single_tb li {
    text-indent: -1em;
    margin-left: 1em;
}
#pickup_single_tb li::before {
    content: "・";
}
#pickup_message_ul li+li{
	border-top: 1px dashed #7f8080;
}
#pickup_message_ul li{
	padding: 15px 5px;
	overflow: hidden;
}
.pickup_message_imgwrap{
	float: left;
}
.pickup_message_contents{
	margin-left: 177px;
	font-size: 14px;
}
.pickup_msg_title{
	font-size: 19px;
	font-weight: bold;
}
.pickup_msg_title::before{
	content: "「";
}
.pickup_msg_title::after{
	content: "」";
}
#pickup_youtube {
	background: #e6e6e5;
	padding: 34px;
	text-align: center;
}
#pickup_youtube iframe{
    max-width: 100%;
}
.single-pickup .common_announce{
	margin-top:0;
}
}



/*************************************************
看板家庭教師（一覧）
*************************************************/
.pickup_area {
    display: flex;
    width: 100%;
    padding: 0;
    margin: 0 0 2.75%;
	gap:0 2.75%;
}
.pickup_area li {
    position: relative;
    width:31.5%;
    background:#edf4f7  url(../img/pickup/bg01.png) center top no-repeat;
    padding: 15px 0 70px;
    border: none;
    margin: 0;
}
.pickup_img {
    width: 196px;
    height: 270px;
    margin: 0 auto;
    border: 2px solid white;
	background: #ccc;
}
.pickup_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pickup_name {
    padding: 10px 0 2px 22px;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    font-size: 17px;
    vertical-align: bottom;
}
.pickup_name span {
    color: #005a66;
    font-size: 19px;
}
.pickup_list_message {
    padding: 0 10px 2px 22px;
}
.pickup_list_message p {
    margin: 0;
    font-size: 16px;
    line-height: 25px;
}
.pickup_btnarea {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    aspect-ratio:279/68;
}
.pickup_btnarea a {
    display: block;
    margin: 0 auto;
}
.pickup_btnarea img {
    aspect-ratio:279/68;
}
@media (max-width: 768px) {
	.pickup_txt{
		font-size: clamp(14px,3.7vw,16px)
	}
	.pickup_area {
		width: 95%;
		margin: 0 auto 4%;
		font-feature-settings: "palt";
		gap:0 4%;
	}
	.pickup_area li {
		position: relative;
		width: 48%;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
		padding: 3.5% 0 11%;
		font-size: 0.92rem;
		line-height: 1.65;
	}
	.pickup_img {
		width: 72.3%;
		height:auto;
		margin: 0 auto 3%;
		border: 2px solid white;
		aspect-ratio:68/91;
	}
	.pickup_name {
		padding: 0 0 0 4%;
		font-weight: bold;
		font-size: 1em;
	}
	.pickup_name span {
		font-size: 1.1em;
	}
	.pickup_list_message {
		width: 95%;
		margin: 0 auto 2%;
		padding:0;
	}
	.pickup_list_message p {
		font-size: 0.92rem;
	}
}

.pickup_area .detail {
    display: none;
}
.detail {
    margin: 27px 15px 0;
    overflow: auto;
    font-size: 16px;
    line-height: 25px;
	background:#fffaf6;
	border:1.5px solid #005a66;
	padding:15px 0;
	box-sizing: border-box;
	position: relative;
}
.detail_header {
    margin: 0 0 5px;
	padding:10px 25px;
}
.detail_header dl {
    display: inline-block;
    font-size: 16px;
    line-height: 26px;
    margin-right: 40px;
}
.detail_header dl dt {
    display: inline-block;
    background: #005a66;
    color: white;
    padding: 2px 5px;
    margin-right: 5px;
}
.detail_header dl dd {
    display: inline-block;
}
.detail_content {
    margin: 0px auto 10px;
	padding:0 25px;
}
.detail_content table {
    width: 100%;
}
.detail_content th {
    width: 116px;
    border: 1px solid #7f8080;
    background: #f0f0f0;
    padding: 10px;
}
.detail_content td {
    border: 1px solid #7f8080;
    background: white;
    padding: 10px;
    vertical-align: top;
}
.detail_content td li {
    text-indent: -1em;
    margin-left: 1em;
}
.detail_content td li::before {
    content: "・";
}
.detail_wrap{
    position: relative;
    width: 100%;
    padding: 1px 0;
	box-sizing: border-box;
	top:-24px;
}
.detail_wrap::after {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-left:  11.5px solid transparent;  /* 底辺 23px の半分 */
  border-right: 11.5px solid transparent;
  border-bottom: 29px solid #005a66;        /* 等しい二辺 = ボーダー色 */
  top: 0px;                               /* 配置は用途に合わせて調整 */
  left: 50%;
  transform: translateX(-50%);
}
.detail_wrap::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  /* 斜辺の比から1.5px分だけ内側へ縮める */
  border-left:  calc(11.5px - 1.16px) solid transparent;
  border-right: calc(11.5px - 1.16px) solid transparent;
  border-bottom: calc(29px - 1.5px) solid #FFFAF6; /* 塗り色 */
  top: 3px;  /* ::after より 1.5px 上にずらす */
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
.detail_wrap.index0::after,
.detail_wrap.index0::before {
	left: 15%;
}
.detail_wrap.index2::after,
.detail_wrap.index2::before {
	left:85%;
}
.detail_close_wrap {
    position: absolute;
    top: -7px;
    right: -11px;
	z-index: 99;
	cursor: pointer;
}
.detail_close_wrap span {
    display: block;
    width: 73px;
    height: 73px;
    background: url(../img/pickup/icon_close.png) center top no-repeat;
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
}
.detail_btn{
	text-align: center;
}
.pickup_list_point {
    margin: 20px auto 10px;
}
@media (max-width: 768px) {
	.detail_header {
		margin: 0 0 5px;
		padding:0 10px;
	}
	.detail_header dl {
		margin: 0.1rem 0.3rem 0.1rem 0;
		font-size:clamp(12px,3.5vw,14px);
	}
	.detail_content {
		margin: 0px auto 10px;
		padding:10px 10px 0;
		font-size:clamp(12px,3.5vw,14px);
	}
	.detail_content table,
	.detail_content tbody,
	.detail_content tr,
	.detail_content th,
	.detail_content td{
		display: block;
		width:100%;
		text-align: left;
		border:0;
		box-sizing: border-box;
	}	
	.detail_content table{
		border-right: 1px solid #7f8080;
		border-left: 1px solid #7f8080;	
		border-top: 1px solid #7f8080;		
	}
	.detail_content th {
		border-bottom: 1px solid #7f8080;
		padding: 0.4rem;
	}
	.detail_content td {
		border-bottom: 1px solid #7f8080;
		padding: 0.4rem;
	}
	.detail_wrap::after {
	  border-left:  6.5px solid transparent;  /* 底辺 23px の半分 */
	  border-right: 6.5px solid transparent;
	  border-bottom: 15px solid #005a66;        /* 等しい二辺 = ボーダー色 */
	  top: 14px;                               /* 配置は用途に合わせて調整 */
	}
	.detail_wrap::before {
	  border-left:  calc(6.5px - 1.16px) solid transparent;
	  border-right: calc(6.5px - 1.16px) solid transparent;
	  border-bottom: calc(15px - 1.5px) solid #FFFAF6; /* 塗り色 */
	  top: 16px;  /* ::after より 1.5px 上にずらす */
	}
	.detail_wrap.index0::after,
	.detail_wrap.index0::before {
		left: 25%;
	}
	.detail_wrap.index1::after,
	.detail_wrap.index1::before {
		left:75%;
	}
	.detail_close_wrap {
		top:7px;
		right:1px;
	}
	.detail_close_wrap span {
		width: 2.8rem;
		height:2.8rem;
		background: url(../img/pickup/sp/icon_close.png) center top no-repeat;
		background-size: 100% auto;
	}
	.pickup_list_point {
		margin: 0.7rem auto;
	}
	.pickup_list_point dt {
		width: 64%;
	}
}



/*************************************************
エリア別受験動向（詳細）
*************************************************/
.areaPoint_text {
    font-weight: bold;
}
.areaLink {
    padding: 0 20px;
    margin-bottom: 20px;
	display: flex;
}
.areaLink1 {
    background: url(../img/common/listmark_red.gif) 0 50% no-repeat;
    padding-left: 10px;
    padding-right: 30px;
}
.area_child .cont2 p {
    margin: 0 0 0.75em 0;
}
.area_child .common_title p{
	margin:0;
}
.area_child .cont2 img {
    padding-left: 7px;
    padding-bottom: 5px;
}
.areaInt_text {
    padding: 0 20px;
}
@media (max-width: 768px) {
	.areaLink {
		display:block;
		margin-bottom:2%;
    	padding-left: 5px;
    	padding-right: 0;
	}
	.areaLink li{
		margin-bottom:2%;
	}
	.area_child .cont2 img {
		max-width: 100%;
		width: auto;
		padding: 0 0 2.5%;
		float: none;
		display: block;
	}
	.areaInt_text {
		padding: 0 1% 2%;
		margin:0;
	}
}

/*23区テーブル*/
.area_ttl{
    padding: 10px;
    font-weight: bold;
    color: #fff;
    background: #036;
}
.area_inner{
	margin-bottom:20px;
    max-width: 765px;
	padding-left:8px;
}
.area_child .area_inner{
	margin:0 auto 20px;
	padding-left:0;
	padding-top:20px;
}
.area_tb{
	border-collapse: separate;
    border-spacing: 1px;
    text-align: center;
    line-height: 1.5;
    margin-left: auto;
    margin-right: auto;
    max-width: 765px;
	width:100%;
	table-layout: fixed;
}
.area_tb td {
    padding: 10px;
    vertical-align: top;
    border-bottom: 1px solid #ccc;
    background: #eee;
}
.area_tb a{
	text-decoration: underline;
}
@media (max-width: 768px) {
	.area_ttl{
		background-color: #f3f7ff;
		border: solid 1px #a4b2e0;
		font-weight: bold;
		padding: 1.8% 2% 1.5% 2%;
		border-radius: 3px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		color:#29375B;
		font-size:clamp(14px,3.7vw,16px);
		margin-bottom:8px;
	}
	.area_inner{
		max-width:100%;
		padding:0 5px;
	}
	.area_tb{
		border-collapse:collapse;
	}
	.area_tb td {
		border:1px solid #ddd;;
		font-weight: 500;
	}
	.area_tb a{
		font-weight: bold;
	}
}

.area_price_announce{
	margin-top:40px;
}
#area_price{
    background: url(../img/area/area_price.jpg) left top no-repeat;
    margin:0 auto;
    padding: 47px 0 0 135px;
    height: 35px;
    font-size: 14px;
	max-width:788px;
	height:79px;
	box-sizing: border-box;
}
@media (max-width: 768px) {
	#area_price{
		background: url(../img/area/sp/area_price.jpg) left top/contain no-repeat;
		padding:0;
		height:auto;
		aspect-ratio:714/114;
		text-indent: -9999px;
		margin:0 10px;
	}
}



/*************************************************
エリア別受験動向（一覧）
*************************************************/
.areaNavi{
	display: flex;
	margin-bottom:20px;
}
@media (max-width: 768px) {
	.areaNavi{
		display: block;
	}
	.areaNavi li {
		padding: 8px;
		margin-bottom:10px;
		border: 1px solid #eee;
	}
	.areaNavi img{
		display:none;
	}
	.areaNavi a{
		display: block;
		padding: 3% 0;
		color: #fff !important;
		font-size: 1.1em;
		font-weight: bold;
		text-align: center;
		text-decoration: none !important;
		text-shadow: 1px 1px 1px #ff920a;
		background: #ff920a;
		background: -moz-linear-gradient(top, #ff920a 0%, #ffaf4b 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff920a), color-stop(100%, #ffaf4b));
		background: -webkit-linear-gradient(top, #ff920a 0%, #ffaf4b 100%);
		background: -o-linear-gradient(top, #ff920a 0%,#ffaf4b 100%);
		background: -ms-linear-gradient(top, #ff920a 0%,#ffaf4b 100%);
		background: linear-gradient(to bottom, #ff920a 0%, #ffaf4b 100%);		
	}
	.areaNavi2 a{
		text-shadow: 1px 1px 1px #7cbc0a;
		background: #7cbc0a;
		background: -moz-linear-gradient(top, #7cbc0a 0%, #9dd53a 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7cbc0a), color-stop(100%, #9dd53a));
		background: -webkit-linear-gradient(top, #7cbc0a 0%, #9dd53a 100%);
		background: -o-linear-gradient(top, #7cbc0a 0%,#9dd53a 100%);
		background: -ms-linear-gradient(top, #7cbc0a 0%,#9dd53a 100%);
		background: linear-gradient(to bottom, #7cbc0a 0%, #9dd53a 100%);	
	}
	.areaNavi3 a{
		text-shadow: 1px 1px 1px #2cafe3;
		background: #2cafe3;
		background: -moz-linear-gradient(top, #2cafe3 0%, #49c0f0 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2cafe3), color-stop(100%, #49c0f0));
		background: -webkit-linear-gradient(top, #2cafe3 0%, #49c0f0 100%);
		background: -o-linear-gradient(top, #2cafe3 0%,#49c0f0 100%);
		background: -ms-linear-gradient(top, #2cafe3 0%,#49c0f0 100%);
		background: linear-gradient(to bottom, #2cafe3 0%, #49c0f0 100%);
	}
	.areaNavi1 a:before{
		content:'中学受験 近年の動向';	
	}
	.areaNavi2 a:before{
		content:'高校受験 近年の動向';	
	}
	.areaNavi3 a:before{
		content:'大学受験 近年の動向';	
	}
}



/*************************************************
注目校インタビュー（一覧）
*************************************************/
.schdb_ul{
	list-style: none;
	padding:0 6px 30px;
	display: flex;
	gap:20px;
	flex-wrap: wrap;
}
.schdb_ul li{
	background: #f8f8f8;
    border: 1px solid #ddd;
	width:calc(50% - 10px);
	box-sizing: border-box;
}
.schdb_ul a{
	display: flex;
	width:100%;
	height:100%;
	justify-content: space-between;
	align-items: center;
}
.schdb_ul p{
	padding:0.5em;
}
.schdb_ul figure{
	width:160px;
	height:100px;
	background: #fff;
	margin:0;
	flex-shrink: 0;
}
.schdb_ul figure img{
	width:100%;
	height:100%;
	object-fit: cover;
}
@media (max-width: 768px) {
	.schdb_ul{
		padding:0 0 40px;
	}
	.schdb_ul li{
		background: #f8f8f8;
		border: 1px solid #ddd;
		width:100%;
	}
	.schdb_ul a{
		text-decoration: none !important;
	}
	.schdb_ul figure{
		width:140px;
		height:88px;
	}
}



/*************************************************
注目校インタビュー（詳細）
*************************************************/
.schdb_box {
    background-color: #f2f7ff;
    padding: 30px 30px 30px 33px;
}
.schdb_topimg{
    margin-bottom: 5%;
    border: 1px solid #ddd;
	background: url(../img/schdb/bg.jpg) center top repeat-y;
	display: none;
	justify-content: space-between;
	align-items: center;
}
.schdb_topimg p{
	color: #122a88;
    font-weight: bold;
    font-size:clamp(18px,4vw,20px);
	padding:0 0.5em;
}
.schdb_topimg figure{
	height:89px;
	margin:0;
}
.schdb_topimg figure img{
	height:89px;
}
.schdb_inner{
	padding-top:15px;
	padding-left: 28px;
	margin-bottom:20px;
}
.schdb_inner p{
	margin-bottom:0.75em;
}
.schdb_thum{
	float:right;
	margin:15px 0 20px 20px;
	width:250px;
}
.schdb_btns{
	margin-top:40px;
}
.schdb_btns p{
	margin-bottom:20px;
}
.schdb_btns p:last-of-type{
	margin-bottom:0;
}
.schdb_btn img{
	max-width:240px;
	width:45%;
}

/*アコーディオン*/
.schdb_ttl{
    font-weight: bold;
    font-size: 16px;
    padding: 8px 8px 8px 15px;
    background:#f8f8f8;
	color: #29375B;
	position: relative;
	box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.07);
	cursor: pointer;
	margin-top:10px;
}
.schdb_ttl:before{
	content:'';
	display: block;
	background:#2b2e7d;
	width:5px;
	height:80%;
	position: absolute;
	left:0;
	top:0;
	bottom:0;
	margin:auto 0;
}
.schdb_ttl:after{
	content:'';
    display: block;
    width:20px;
	height:20px;
	position: absolute;
	right:10px;
	top:0;
	bottom:0;
	margin:auto 0;
    background: url(../img/common/ico_plus.png) 0 0/cover no-repeat;
}
.schdb_ttl.is-open:after{
    background: url(../img/common/ico_minus.png) 0 0/cover no-repeat;
}
@media (max-width: 768px) {
	.schdb_topimg{
		display: flex;
	}
	.schdb_box {
		background:none;
		padding: 20px 8px;
	}
	.schdb_inner{
		padding-top:0;
		padding-left:0;
		margin-bottom:30px;
	}
	.schdb_thum{
		float:none;
		margin:0 0 10px;
		width:100%;
	}	
	.schdb_btns{
		margin-top:20px;
	}
	.schdb_btns p{
		margin-bottom:10px;
	}
	.schdb_btns p:last-of-type{
		margin-bottom:0;
	}

	/*アコーディオン*/
	.schdb_ttl{
		margin-bottom:10px;
		margin-top:0;
		padding: 5% 10px 4.6%;
		background: #f3f7ff;
		border: 1px solid #a6b3e1;
		border-radius: 3px;
		box-shadow: none;
	}
	.schdb_ttl:before{
		display: none;
	}
}


/*************************************************
塾フォロー（詳細）
*************************************************/
@media (max-width: 768px) {
	.subject_child strong{
		font-weight: bold;
		margin: 3% 0 2%;
		font-size:clamp(14px,3vw,16px);
		padding: 1.5% 1% 1.2% 3%;
		background: #f0f0f0;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		display: inline-block;
		width: 97%;
	}
	.single-jyuku #edit_area strong{
		color:#D1213C;
		font-size:16px;
	}
}



/*************************************************
志望校別 傾向と対策（一覧）
*************************************************/
.result_ttl{
	font-size: 20px;
    font-weight: bold;
    padding: 8px 10px 8px 12px;
	border: solid 3px #389ef2;
    color: #389ef2;
	margin-bottom:0.75em;
	background-image: url(../img/result/ico_plus_b.png);
	background-position:calc(100% - 10px) center;
	background-repeat: no-repeat;
	background-size:20px;
	cursor: pointer;
}
.result_ttl#high{
	border-color:#63b42b;
    color:#63b42b;
	background-image: url(../img/result/ico_plus_g.png);
}
.result_ttl#univ{
	border-color:#e63231;
    color:#e63231;
	background-image: url(../img/result/ico_plus_r.png);
}
.result_ttl#medical{
	border-color:#37485c;
    color:#37485c;
	background-image: url(../img/result/ico_plus_b2.png);
}
.result_ttl.is-open {
	background-image: url(../img/result/ico_minus_b.png);
}
.result_ttl#high.is-open{
	background-image: url(../img/result/ico_minus_g.png);
}
.result_ttl#univ.is-open{
	background-image: url(../img/result/ico_minus_r.png);
}
.result_ttl#medical.is-open{
	background-image: url(../img/result/ico_minus_b2.png);
}

/*アコーディオン*/
.result_box_inner{
	padding:0 10px 40px;
}
@media (max-width: 768px) {
	.result_ttl{
		font-size:clamp(14px,3.7vw,17px);
	}
	.result_box_inner{
		padding:0 0 40px;
	}
}

.result_ttl2{
	background: url(../img/ttl/result_ttl2.jpg) left 7px no-repeat;
    font-size: 18px;
    padding-left: 18px;
	margin-bottom:0.75em;
}
@media (max-width: 500px) {
	.result_ttl2{
		background: url(../img/result/sp/result_ttl2.jpg) center top no-repeat;
		background-size: 100% auto;
		font-size: 117%;
		padding: 1.2% 0 1% 11%;
		font-weight: bold;
		margin-bottom:0;
	}
}

/*検索エリア（※SPのみ表示）*/
#result_search{
	background:url(../img/common/bg1.jpg) 0 0 repeat #f6f6f6;
	padding:10px;
	margin-bottom:20px;
}
#result_search_ttl{
	background: url(../img/result/sp/search_ico.jpg) left center/22px no-repeat;
    font-weight: bold;
	font-size:clamp(16px,3.7vw,18px);
    padding:0 0 5px 25px;
}
#result_search input[type="text"]{
	width: 100%;
    font-size: 105%;
    padding: 1.5% 1%;
    border: solid 1px #7f8080;
	box-sizing: border-box;
}
#result_search input[type="submit"]{
    background: url(../img/result/sp/search_btn.png) center top no-repeat;
    background-size: 100% auto;
	display: inline-block;
    width: 41%;
	max-width:200px;
	aspect-ratio:313 / 81;
    border: none;
    text-indent: -9999px;
	height:auto;
}



/*************************************************
志望校別 傾向と対策（詳細）
*************************************************/
.result_face{
	float:right;
	margin:0 0 10px 20px;
	background:url(../img/result/result_face_bg.png) no-repeat;
	padding:10px;
}
.result_h1{
    color: #122b88;
    font-size: 20px;
    font-weight: bold;
	letter-spacing:1.5px; 
}
.result_h2{
    font-weight: bold;
    font-size: 1.2em;
	margin-bottom:15px;
	color: #29375B;	
}
.result_comment p{
	margin-bottom: 0.75em;	
}
.result_name{
	padding-top: 10px;
    border-top: 1px dotted #ddd;
    font-weight: bold;
    text-align: right;
}
@media (max-width: 768px) {
	.result_face{
		float:none;
		margin:0 0 10px;
		background:none;
		text-align: center;
	}
	.result_h2{
		font-size:clamp(14px,3.7vw,16px);
	}
	.result_comment strong{
		color: #FF353A;
	}
}

.result_table{
    width: 100%;
    table-layout: fixed;
	margin-bottom:20px;
}
.result_table td {
    text-align: center;
    border: solid 1px #ddd;
    font-size: 14px;
}
.result_table tr:nth-of-type(2n) td{
	background: #f5f5f5;	
}
.result_table td a {
    display: block;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    white-space: nowrap;
}
@media (max-width: 768px) {
	.result_table{
		border-bottom:1px solid #eee;
	}
	.result_table,
	.result_table *{
		display: block;
	}
	.result_table td {
		padding:0;
		border: solid 1px #eee;
		border-bottom:0;
		background: #fff !important;
	}
	.result_table a{
		padding: 2.5% 0;
		color: #333 !important;
		text-decoration: none !important;
		font-weight: bold;
		font-size: 107%;
	}
	.result_table tr:nth-of-type(2n + 1) td:nth-of-type(2n + 1),
	.result_table tr:nth-of-type(2n) td:nth-of-type(2n){
		background:#f8f8f8 !important;
	}
}



/*************************************************
検索結果
*************************************************/
#search_ul{
	padding:0 10px;
}
#search_ul a{
	color: #122a88;
    text-decoration: underline;	
}
#search_ul li{
	background: url(../img/common/arrow.gif) left center no-repeat;
    background-size: auto auto;
    padding-left:25px;
	margin-top:10px;
    font-size: 110%;
}
.search_modoru {
    padding: 10% 10px 3%;
    font-weight: bold;
}
.search_modoru a {
	color: #122a88;
    border: solid 2px #122a88;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    text-decoration: none;
    padding: 0.5em 1em;
}



/*************************************************
お便り紹介
*************************************************/
/*一覧ページ*/
.msg_ul{
	display: flex;
	flex-wrap: wrap;
	gap:10px;
	margin-bottom:50px;
	padding:0 5px;
}
.msg_ul li{
	width:calc(25% - 30px / 4);
}
.msg_ul a{
	width:100%;
	background: #f9f9f9;
	box-sizing: border-box;
	padding:5px;
	display: block;
}
.msg_fgr{
	width:100%;
	background: #fff;
	aspect-ratio:680/378;
	margin:0 0 5px;
}
.msg_fgr img{
	object-fit: cover;
	object-position: top;
	width:100%;
	height:100%;
}
.msg_ttl{
    font-size: 14px;
    line-height: 20px;
    text-decoration: underline;
    margin: 5px 0 0;
	text-align: center;
}
.msg_txt{
	padding:0 0 30px 1em;
	background: url(../img/message/msg_bd.jpg) 0 bottom no-repeat;
}
@media (max-width: 768px) {
	.msg_ul{
		gap:8px;
		padding:0 5px;
		margin-bottom:20px;
	}
	.msg_ul li{
		width:calc(50% - 4px);
	}
	.msg_ul a{
		background:#f0f0f0;
	}
	.msg_ttl{
		text-decoration: none;
		font-size:clamp(12px,3.5vw,14px);
    	line-height: 1.4;
	}
	.msg_txt{
		padding:0 1em 30px;
		background: url(../img/message/sp/msg_bd.jpg) 0 bottom/100% no-repeat;
	}
}

/*詳細ページ*/
#msg_single{
    padding: 20px 15px 15px;
    border: solid 1px #eaeaea;
    background-color: #f7f7f7;
    border-radius: 5px;
	margin-bottom:20px;
}
#msg_single_ttl{
    border-top: solid 1px #d2c8bd;
    border-bottom: solid 1px #d2c8bd;
    padding: 14px 0 12px;
	margin-bottom:15px;
}
#msg_single_ttl_text{
	color: #cc3333;
    font-weight: bold;
    font-size: 19px;	
}
#msg_single_ttl_text2{
	color: #666666;
    font-size: 14px;
    padding-top: 4px;
    padding-left: 10px;
}
#msg_content{
	padding:0 5px 15px;
}
#msg_img{
	background: url(../img/message/img_bg.jpg) left top no-repeat;
    width: 250px;
    height: 169px;
    padding: 20px;
}
#msg_img img {
    width: 100%;
    height: 100%;
}
#msg_img_txt{
	text-align: center;
    width: 290px;
    font-size: 13px;
    color: #333333;
    line-height: 13px;
}
#msg_koushi{
	text-align: right;
}
@media (max-width: 768px) {
	#msg_single{
		padding: 10px 5px 15px;
		background: #f0f0f0;
	}
	#msg_single_ttl{
		border-top: solid 1px #e1e0e0;
		border-bottom: solid 1px #e1e0e0;
		padding: 10px 5px;
		margin-bottom:15px;
	}
	#msg_single_ttl_text2{
		padding:4px 0 0;
		color: #29375B;
		font-size:clamp(12px,3.7vw,16px);
	}
	#msg_img{
		background: url(../img/message/sp/img_top.jpg) center top no-repeat, url(../img/message/sp/img_bottom.jpg) center bottom no-repeat, url(../img/message/sp/img_y.jpg) center top repeat-y;
		background-size: 100% auto, 100% auto, 100% auto;
		padding: 6% 8.5% 6%;
		margin-top: 2%;
		width:auto;
		height:auto;
	}
	#msg_img img {
		height: auto;
	}
	#msg_img_txt{
		text-align: center;
		width:100%;
		font-size:100%;
		line-height: 1.6;
	}
	#msg_koushi{
		padding:20px 10px 0;
	}
	#msg_koushi a{
		color: #122a88;
    	text-decoration: underline;
	}
}



/*************************************************
合格実績
*************************************************/
#pf_menu_wrap{
	background: #e0edf5;
	border-radius: 5px;
	padding:12px 15px 8px;
}
#pf_menu_img{
	padding-left:5px;
	margin-bottom:4px;
}
#pf_menu{
	display: flex;
	gap:7px;
}
@media (max-width: 768px) {
	#pf_menu_wrap{
		background:#DDEAF2;
		border-radius:0;
		padding:0 0 2%;
	}
	#pf_menu_img{
		padding-left:0;
		margin-bottom:0;
	}
	#pf_menu{
		width: 98%;
		margin: 0 auto;
		padding: 1% 1% 0 1%;
		gap:0;
		flex-wrap:wrap;
	}
	#pf_menu li{
		width: 50%;
	}
}

.pf_area_name{
	display: inline-block;
    padding: 2px 12px 2px;
    border-radius: 5px;
    text-align: center;
    font-size: 19px;
    font-weight: bold;
    background-color: #CCC;
	box-sizing: border-box;
    color: #FFFFFF;
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    margin-bottom: 15px;
	
}
@media (max-width: 768px){
	.pf_area_name{
		padding: 0.2em 0.5em;
		text-align: center;
		font-size:clamp(16px,3.7vw,19px);
	}
}
.pf_area_name_kantou{background-color:#E44F51;}
.pf_area_name_kansai{background-color:#FF7A97;}
.pf_area_name_hokuriku{background-color:#EE8F25;}
.pf_area_name_toukai{background-color:#0aa095;}
.pf_area_name_cyubu{background-color:#ee8f25;}
.pf_area_name_cyugoku{background-color:#3eb3d7;}
.pf_area_name_sikoku{background-color:#81d211;}
.pf_area_name_kyushu{background-color:#d3aeef;}
.pf_area_name_tohoku{background-color:#51c0cb;}
.pf_area_name_hokkaido{background-color:#37ace7;}
.pf_area_name_kaigai{background-color:#a15909;}

.pf_city_name{
	color: #076BAF;
    font-weight: bold;
    font-size: 18px;
    background-color: #f7f7f7;
    padding: 12px 0 8px 12px;
    margin: 0 0 5px 0;
    border-top: 1px solid #E44F51;
}
@media (max-width: 768px){
	.pf_city_name{
		padding: 2% 0 2% 2%;
		margin: 0 0 2% 0;
		font-size: 3.7vw;
		letter-spacing: 0em;
	}
}

.pf_ul01{
	display: flex;
	flex-wrap: wrap;
	gap:6%;
}
.pf_ul01 li{
	font-size:clamp(14px,1.4vw,16px);
	width:calc(88% / 3);
	background: url(../img/performance/li-c-bg.png) no-repeat;
    height: 49px;
	line-height:1.2;
    padding: 14px 0 0 33px;
    font-weight: bold;
	box-sizing: border-box;
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
@media (max-width: 768px){
	.pf_ul01{
		display: flex;
		flex-wrap: wrap;
		gap:10px 2%;
	}
	.pf_ul01 li{
		width:48%;
		background: url(../img/performance/sp/li-c-bg.jpg) left center no-repeat;
		padding: 2% 0 1% 1.2em;
		border-bottom: 1px dashed #CCC;
		height:auto;
		font-size: 3.7vw;
		font-size:clamp(12px,3.7vw,16px);
		font-family: "Noto Serif JP", serif;
	}
}

.pf_ul02{
	display: flex;
	flex-wrap: wrap;
	gap:5px 0;
	margin-bottom:40px;
}
.pf_ul02 li{
	width:25%;
    font-size: 13px;
	font-size:clamp(12px,1vw,13px);
    padding-top: 6px;
    padding-left: 24px;
	line-height:1.2;
    min-height: 25px;
    background: url(../img/performance/li-a-bg.png) no-repeat;
	box-sizing: border-box;
	font-weight:500;
}
@media (max-width: 768px){
	.pf_ul02{
		gap:5px 2%;
		margin-bottom:20px;
	}
	.pf_ul02 li{
		width: 48%;
		background: url(../img/performance/sp/li-a-bg.jpg) left center no-repeat;
		padding: 1% 0 0.5% 7%;
		font-size: 90%;
		letter-spacing: -0.05em;
	}	
}



/*************************************************
サイトマップ
*************************************************/
.sitemap_ttl,
.sitemap_ttl2,
.sitemap_ttl3,
.sitemap_ttl4{
	font-weight: bold;
    font-size: 20px;
	border-bottom:1.5px solid #cbcbcb;
	margin-bottom:20px;
}
.sitemap_ttl:before,
.sitemap_ttl2:before,
.sitemap_ttl3:before,
.sitemap_ttl4:before{
	content:'■';
	font-size:14px;
	color:#8bcab7;
	position: relative;
	top:-2px;
	margin-right:8px;
}
.sitemap_ttl2:before{
	color:#ff9092;
}
.sitemap_ttl3:before{
	color:#5a87c3;
}
.sitemap_ttl4:before{
	color:#f8e28e;
}
@media (max-width: 768px) {
	.sitemap_ttl,
	.sitemap_ttl2,
	.sitemap_ttl3,
	.sitemap_ttl4{
		font-size: 110%;
		margin-bottom:15px;
	}
}

.sitemap_ul{
	list-style: none;
	padding-left:15px;
	margin-bottom:40px;
}
.sitemap_ul li {
    background: url(../img/sitemap/icon.jpg) left 6px no-repeat;
    padding-left: 20px;
    margin-bottom: 8px;
}
.sitemap_ul a {
    color: #333;
}
.sitemap_ul a:hover {
    color: #af4848;
	opacity: 1;
}
@media (max-width: 768px) {
	.sitemap_ul li {
		background: url(../img/sitemap/sp/icon.jpg) left 7px/10px no-repeat;
	}
}



/*************************************************
FAQ
*************************************************/
.faq_ul{
	display: flex;
	background-color: #f8fcff;
	padding:18px 0;
	max-width: 820px;
	flex-wrap: wrap;
}
.faq_ul li{
    background: url(../img/faq/icon.jpg) left 5px no-repeat;
    padding-left: 23px;
    margin-left: 28px;
}
.faq_ul a {
    color: #2e3180;
}
.faq_ul a:hover {
    color: #4549bf;
    border-bottom: 1px solid #4549bf;
    padding-bottom: 1px;
}
@media (max-width: 768px) {
	.faq_ul{
		background:#ddeaf2;
		width:calc(100% + 16px);
		box-sizing: border-box;
		margin-left:-8px;
		padding:2% 0;
	}
	.faq_ul li{
		background:none;
		padding-left:0;
		margin-left:0;
		width:50%;
	}
	.faq_ul a{
		display: block;
    	background: url(../img/faq/sp/button1.jpg) 0 0/contain no-repeat;
		width:100%;
		aspect-ratio:380/123;
		text-indent: -9999px;
	}
	.faq_ul a:hover{
		border:0;
    	padding-bottom:0;
		opacity: inherit;
	}
	.faq_ul .faq_menu2{
    	background: url(../img/faq/sp/button2.jpg) 0 0/contain no-repeat;	
	}
	.faq_ul .faq_menu3{
    	background: url(../img/faq/sp/button3.jpg) 0 0/contain no-repeat;	
	}
	.faq_ul .faq_menu4{
    	background: url(../img/faq/sp/button4.jpg) 0 0/contain no-repeat;	
	}
}

.faq_area:before{
	content:'';
	display: block;
	width:100%;
	aspect-ratio:86/6;
	background: url(../img/faq/title1.jpg) 0 0/contain no-repeat;
	margin-bottom:10px;
}
.faq_area#menu2:before{
	background-image: url(../img/faq/title2.jpg);
}
.faq_area#menu3:before{
	background-image: url(../img/faq/title3.jpg);
}
.faq_area#menu4:before{
	background-image: url(../img/faq/title4.jpg);
}
@media (max-width: 768px) {
	.faq_area:before{
		aspect-ratio:760/119;
		background: url(../img/faq/sp/title1.jpg) 0 0/contain no-repeat;
		margin-bottom:0;
	}
	.faq_area#menu2:before{
		background-image: url(../img/faq/sp/title2.jpg);
	}
	.faq_area#menu3:before{
		background-image: url(../img/faq/sp/title3.jpg);
	}
	.faq_area#menu4:before{
		background-image: url(../img/faq/sp/title4.jpg);
	}
}

.faq_dl{
	padding:0 25px 0 20px;
	margin-bottom: 30px;
	font-weight: 500;
}
.faq_dl dt {
	border:2px solid #e5e5e5;
	padding:8px 20px 8px 40px;
	background: url(../img/faq/q.jpg) 8px 10px no-repeat #f7f7f7;
}
.faq_dl dd {
	border:2px solid #e5e5e5;
	border-top:0;
	margin-bottom: 15px;
	padding:8px 20px 8px 40px;
	background: url(../img/faq/a.jpg) 8px 10px no-repeat #f8fcff;
}
@media (max-width: 768px) {
	.faq_dl{
		padding:0 15px;
		margin-bottom: 20px;
	}
	.faq_dl dt {
		border:1px solid #e5e5e5;
		padding:8px 20px 8px 35px;
		background: url(../img/faq/sp/q.jpg) 8px 10px/17px no-repeat #ebebeb;
	}
	.faq_dl dd {
		border:1px solid #e5e5e5;
		border-top:0;
		margin-bottom: 12px;
		padding:8px 20px 8px 35px;
		background: url(../img/faq/sp/a.jpg) 8px 10px/17px no-repeat #f3f8fc;
	}
}



/*************************************************
料金とシステム
*************************************************/
.price-box,
.price-box2{
    text-align: center;
    padding: 12px;
    margin: 0 0 15px;
    background: #F7F4E1;
	max-width:833px;
	box-sizing: border-box;
}
.price-box2 {
    background: #e5f3fd;
}
.price_fgr{
	max-width:833px;
}
.price_ttl,
.price_ttl2{
    font-size: 22px;
    color: #fff;
    padding: 2px;
    background: #E45825;
    font-family: "游ゴシック", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Verdana, Arial, sans-serif;
	font-weight: 500;
}
.price_ttl2{
    color: #000;
    background: #e5f3fd;
}
.price_txt{
    font-size: 32px;
    font-weight: bold;
    font-family: "游ゴシック", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Verdana, Arial, sans-serif;
}
.price_txt span {
    font-size: 18px;
}
.price_txt_s{
	color: #C2272D;
	font-size:80%;
}
@media (max-width: 768px) {
	.price .common_title {
		margin-bottom:5px;
	}
	.price_fgr{
		width:calc(100% + 32px);
		margin-left:-16px;
	}
}



/*************************************************
5つの強みと特徴
*************************************************/
.f_st_wrap1{
	max-width:832px;
	margin:0 auto;
	padding:0 1em;
	box-sizing: border-box;
}
.f_st_wrap2{
	padding-left:77px;
}
.f_st_flex1{
	display: flex;
	gap:10px;
}
.f_st_flex1 figure{
	width:38%;
	max-width:288px;
	flex-shrink: 0;
	margin-bottom:0;
}
@media (max-width: 768px) {
	.f_st_wrap1{
		padding:0 10px;
	}
	.f_st_wrap2{
		padding-left:0;
	}
	.f_st_flex1 figure{
		display: none;
	}
}

.f_st_dl{
	border:1px solid #d2d2d2;
}
.f_st_dl dd{
	padding:8px;
	display: flex;
	gap:10px;
}
.f_st_dl dd figure{
	width:32.5%;
	max-width:234px;
	flex-shrink: 0;
	margin:0;
}
.f_st_dl_flex{
	display: flex;
	gap:12px;
}
.f_st_dl_flex .f_st_dl{
	width:calc(50% - 6px);
}
.f_st_dl_flex dd{
	padding:8px 1em;
}
.f_st_dd_lank{
	justify-content: center;
}
.f_st_dd_lank p{
	max-width:630px;
	font-size:15px;
}
@media (max-width: 768px) {
	.f_st_dl dd{
		font-size:clamp(12px,3.5vw,16px);
		padding:8px 5px;
	}
	.f_st_dl_flex{
		flex-direction: column;
		gap:10px;
	}
	.f_st_dl_flex .f_st_dl{
		width:100%;
	}
	.f_st_dl_flex dd{
		padding:8px;
		font-size:clamp(12px,3.7vw,16px);
	}
}

.f_st_btn_ul{
	list-style: none;
	display: flex;
	justify-content: center;
}

#f_st_last{
	background: url("../img/first-strengths/f_st17.jpg") 0 0/contain no-repeat;
	max-width:860px;
	padding:16.5% 5.2% 4% 38%;
	box-sizing: border-box;
	margin-top:-50px;
}
@media (max-width: 768px) {
	#f_st_last{
		background: url("../img/first-strengths/sp/f_st17.jpg") 0 0/100% auto no-repeat;
		padding:14% 1em 2em;
		margin-top:0;
		font-size:clamp(12px,3.5vw,16px);
		width:calc(100% + 20px);
		box-sizing: border-box;
		margin-left:-10px;
	}
	#f_st_last:before{
		content:'';
		display:block;
		width:40%;
		padding-top:33%;
		float:left;
	}
	.f_st_full{
		width:calc(100% + 20px);
		margin-left:-10px;
	}
}



/*************************************************
四谷進学会の理念
*************************************************/
#first_img{
	max-width:180px;
	float:left;
	margin-right:5px;
}
@media (max-width: 768px) {
	#first_img{
		width: 41%;
	}
}

#first_gokaku p{
	margin-bottom:8px;
}

.first-video-box {
    padding: 24px 36px 0;
}
.first-video-box video {
    width: 100%;
    height: auto;
}
@media (max-width: 768px) {
	.first-video-box {
    	padding: 24px 10px 0;
	}
}



/*************************************************
会社概要
*************************************************/
#company_map {
    border: none;
    max-width: 592px;
	width:100%;
    height: 290px;
    margin-top: 6px;
}



/*************************************************
子ページ（フルサイズ）
*************************************************/
/*パンクズ*/
#contents_full #bread_crumb{
	max-width:1130px;
	margin:-5px auto 0;
	padding:0 10px 3px;
}
.full01 {
    max-width: 1021px;
    margin: 0 auto;
}



/*************************************************
オンライン授業
*************************************************/
#online_ttl{
	padding:10px;
	text-align: center;
}
@media (max-width: 768px) {
	#online_ttl{
		padding:5px;
	}
}

#online01{
	max-width:1030px;
	margin:10px auto 50px;
	display: flex;
	gap:15px;
	justify-content: flex-end;
}
#online01 figure{
	flex-shrink: 0;
}
@media (max-width: 768px) {
	#online01{
		margin:5px auto 15px;
	}
}

#online02{
	background:#086baf;
	color:#fff;
	text-align: center;
	padding:40px 0;
}
#online_ttl02{
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-weight: bold;
	font-size:clamp(1.375rem, 1.148rem + 1.14vw, 2rem);
	letter-spacing: 0;
	line-height:1.4;
	margin-bottom:20px;
}
#online02_txt{
	margin-bottom:30px;
	display: flex;
	justify-content: center;
}
#online02_txt p{
	position: relative;
}
#online02_txt a{
	display: inline-block;
	position: absolute;
	width:154px;
	aspect-ratio:154/189;
	top:-30px;
	right:-240px;
	background: url(../img/online/btn.png) 0 0/cover no-repeat;
	text-indent: -9999px;
}
#online02_txt a:hover{
	background: url(../img/online/btn_on.png) 0 0/cover no-repeat;
	opacity: 1;
}
@media (max-width: 1040px) {
	#online02_txt a{
		top:-30px;
		right:-160px;
		background: url(../img/online/btn.png) 0 0/cover no-repeat;
		text-indent: -9999px;
	}
}
@media (max-width: 870px) {
	#online02_txt{
		padding-right:160px;
	}
	#online02_txt a{
		top:-30px;
		right:-160px;
		background: url(../img/online/btn.png) 0 0/cover no-repeat;
		text-indent: -9999px;
	}
}
@media (max-width: 768px) {
	#online02{
		border-radius:25px;
		padding:3.7% 0;
	}
	#online_ttl02{
		margin-bottom:10px;
	}
	#online02_txt{
		padding-right:0;
		margin-bottom:20px;
	}
	#online02_txt p{
		display: flex;
		text-align: left;
		gap:5px;
	}
	#online02_txt p br{
		display: none;
	}
	#online02_txt a,
	#online02_txt a:hover{
		position:relative;
		width:30%;
		max-width:154px;
		aspect-ratio:226/279;
		top:auto;
		right:auto;
		background: url(../img/online/sp/btn.jpg) 0 0/contain no-repeat;
		flex-shrink: 0;
	}
}

#online02_txt2{
	padding:20px 0 0;
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-size:clamp(1.25rem, 0.75rem + 2.5vw, 2.625rem);
	font-weight: bold;
	line-height:1.4;
}
#online02_txt2 span{
	letter-spacing: 0;
	font-size:75%;
}
@media (max-width: 768px) {
	#online02_txt2{
		padding:2.5% 0 0;
	}
}

#online03_fgr:before{
	content:'';
	display:block;
	line-height: 0;
	width: 60px;
	aspect-ratio: 1/cos(30deg);
	clip-path: polygon(50% 70%,100% 0,0 0);
	background:#086baf;
	margin:-1px auto 20px;
}
@media (max-width: 768px) {
	#online03_fgr:before{
		width:5%;
		max-width: 60px;
		min-width:20px;
		margin-bottom:15px;
	}
}

#online03_sido{
	max-width:1014px;
	margin:0 auto 70px;
	padding:10px;
}
.online_ttl03{
	font-size:clamp(1.125rem, 0.511rem + 3.07vw, 2.813rem);
	text-align: center;
	padding:0 10px;
	letter-spacing: 0;
	color:#000;
}
#online03_flx{
	display: flex;
	gap:20px;
	align-items: center;
}
#online03_txt span{
	font-size: 13px;
}
#online03_btn{
	padding-top:5px;
}
#online03_flx_r{
	width:51%;
	flex-shrink: 0;
}
@media (max-width: 768px) {
	#online03_sido{
		background:#ed8d26;
		margin:0 auto 30px;
	}
	.online_ttl03{
		color:#fff;
		padding:0 5px 5px;
	}
	#online03_flx{
		gap:15px;		
		flex-direction: column-reverse;
	}
	#online03_flx_l{
		background: #fff;
		border-radius: 10px;
		padding:10px;
	}
	#online03_flx_r{
		width:100%;
		display: flex;
		gap:5px;
		align-items: center;
	}
}

#online04 {
	max-width:1150px;
	margin:0 auto;
	padding:0 10px;
}
#online04 h2{
	line-height:0;
}
#online04_box{
	background:#f2f7fb;
	padding:30px;
}
.online04_dl_wrap{
	display:flex;
	max-width:1020px;
	margin:0 auto;
	gap:10px;
}
.online04_dl_wrap:nth-of-type(2){
	padding-left:19.63%;
	padding-top:10px;
}
.online04_dl_wrap:before{
	content:'';
	display: block;
	width:250px;
	aspect-ratio:1/1;
	align-items: flex-start;
	background: url(../img/online/i01.jpg) center center/cover no-repeat #fff;
	border-radius:500px;
	box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
	flex-shrink: 0;
}
.online04_dl_wrap:nth-of-type(2):before{
	background: url(../img/online/i02.jpg) 0 0/cover no-repeat;
}
.online04_dl{
	padding-top:10px;
}
.online04_sp{
	display:none;
}
.online04_dl dd{
	padding:5px 0 0 20px;
}
@media (max-width: 1200px) {
	.online04_dl_wrap:nth-of-type(2){
		padding:20px 0 0;
	}
	.online04_dl_wrap:before{
		width:24.50980392156863%;
	}
}
@media (max-width: 1024px) {
	#online04_box {
		padding:0 20px 30px;
	}
	.online04_dl_wrap:before{
		display: none;
	}
	.online04_dl{
		padding-top:0;
	}
	/*.online04_dl dt{
		text-align: center;
	}*/
	.online04_pc{
		display: none;
	}
	.online04_sp{
		display: inline;
		max-width:600px;
		width:100%;
	}
	.online04_dl dd{
		padding:0;
	}
}
@media (max-width: 768px) {
	#online04{
		padding:0;
	}
	#online04_box {
		padding:0 10px 30px;
	}
	.online04_dl_wrap:nth-of-type(2){
		padding:0;
	}
}

#online05{
	background: url(../img/online/bg.png) 0 0 repeat;
	padding:30px 10px 20px;
	margin-top:40px;
}

.online_ttl04{
	background:url(../img/online/bg_title.jpg) 0 0 repeat;
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	color:#fff;
	font-size:clamp(1.5rem, 0.955rem + 2.73vw, 3rem);
	line-height:1.2;
	letter-spacing: 0;
	font-weight: 600;
	text-align: center;
	padding:0.5em 10px 0.35em;
}

#online06_txt01{
	font-size:clamp(1.25rem, 1.068rem + 0.91vw, 1.75rem);
	text-align: center;
	color:#046cb5;
	font-weight: bold;
	padding:60px 0 50px;
}
.online_video_wrap{
	max-width:640px;
	margin:0 auto;
	
}
.online_video{
	aspect-ratio:64/36;
	width:100%;
	height:auto;
	margin-bottom:80px;
}
@media (max-width: 768px) {
	#online06_txt01{
		color:#046cb5;
		padding:10px 0 5px;
		display: flex;
		gap:5px;
		justify-content: center;
		align-items: center;
	}
	#online06_txt01:before,
	#online06_txt01:after{
		content:'▼';
		font-size:90%;
	}
	.online_video{
		margin-bottom:20px;
	}
}

#online_cap_ul{
	max-width:990px;
	margin:0 auto;
}
#online_cap_ul li{
	display: flex;
	gap:25px;
	margin-bottom:20px;
}
.online_cap_fgr{
	width:42%;
	max-width:413px;
	margin:0;
	flex-shrink: 0;
}
.online_dl dt{
	font-weight: bold;
	font-size:30px;
	margin:10px 0 5px;
	color:#000;
}
.online_dl p{
	font-size:80%;
	border-top: dashed 2px #006699;
	margin-top: 15px;
    padding-top: 5px;
}
@media (max-width: 768px) {
	#online_cap_ul li{
		gap:10px;
		flex-direction: column;
		border-bottom: dashed 1px #006699;
		padding-bottom: 5%;
	}
	#online_cap_ul li:last-of-type{
		border:0;
		padding-bottom: 0;
	}
	.online_cap_fgr{
		width:100%;
		max-width:721px;
		text-align: center;
	}
	.online_dl dt{
		display: none;
	}
	.online_dl p{
		font-size:100%;
		border:0;
		margin:0;
		padding:0;
		color: #096cb0;
	}
	
}

#online_kankyo{
	border:solid 3px #076baf;
	border-radius: 3px;
    max-width: 710px;
	margin: 50px auto;
	padding: 5px 20px 10px 20px;
    box-sizing: border-box;
}
.online_kankyo_ttl{
	font-size:38px;
	color:#076baf;
}
#online_kankyo_dl dt{
	color:#076baf;	
}
#online_kankyo_dl dd{
	margin-bottom:10px;
}
@media (max-width: 768px) {
	#online_kankyo{
		border:solid 2px #076baf;
		background:#f2f2f2;
		padding:0 4% 2% 4%;
		margin:0 auto 30px;
	}
	.online_kankyo_ttl{
		font-size:22px;
		font-weight: bold;
	}
	#online_kankyo_dl dd{
		margin-bottom:0;
	}
}

.online_step_ttl{
	padding:30px 0;
	max-width:1079px;
	margin:0 auto;
}
#online_step_b_ttl{
	background: url(../img/online/nami.jpg) center 0/contain no-repeat;
	padding-top:calc(1.4% + 30px);
	margin:40px auto 0;
}
.online_step_ol{
	display: flex;
	gap:10px;
	max-width:770px;
	margin:0 auto;
	padding:10px;
}
.online_step_ol li{
	width:calc(100% / 3 - 20px/3);
	box-sizing: border-box;
	border:4px solid #1d2c51;
	border-radius: 15px;
	background:#fffff3;
	padding:40px 12px 12px;
	position: relative;
	min-height:200px;
}
.online_step_ol li:before{
	content:'';
	display: block;
	width:77px;
	aspect-ratio:77/55;
	background: url(../img/online/step_a1.jpg) center 0/cover no-repeat;
	position:absolute;
	top:-23px;
	right:0;
	left:0;
	margin:0 auto;
}
.online_step_ol li:nth-of-type(2):before{background: url(../img/online/step_a2.jpg) center 0/cover no-repeat;}
.online_step_ol li:nth-of-type(3):before{background: url(../img/online/step_a3.jpg) center 0/cover no-repeat;}
.online_step_ol_b li:before{background: url(../img/online/step_b1.jpg) center 0/cover no-repeat;}
.online_step_ol_b li:nth-of-type(2):before{background: url(../img/online/step_b2.jpg) center 0/cover no-repeat;}
.online_step_ol_b li:nth-of-type(3):before{background: url(../img/online/step_b3.jpg) center 0/cover no-repeat;}
.online_step_ol_b li:nth-of-type(4):before{background: url(../img/online/step_b4.jpg) center 0/cover no-repeat;}

.online_step_ol_b{
	max-width:1023px;
	margin-bottom:40px;
}
.online_step_ol_b li{
	width:calc(25% - 30px/4);
	border:4px solid #018355;
	font-size:14px;
}
.online_step_ol_b h4{
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-weight: bold;
	color:#e65a29;
	letter-spacing: 0;
	font-size:18px;
	text-align: center;
	margin-bottom:5px;
}
.online_step_ol_b h4 span{
	letter-spacing: -0.1em;
}
@media (max-width: 768px) {	
	.online_step_ttl{
		padding:10px 0;
	}
	#online_step_b_ttl{
		background: url(../img/online/sp/nami.jpg) center 0/contain no-repeat;
		padding-top:calc(2.23% + 15px);
		margin:20px auto 0;
	}
	.online_step{
		overflow-x: scroll;
	}
	.online_step_b{
		margin-bottom:30px;
	}
	.online_step_ol{
		max-width:none;
		padding:20px 10px 10px;	
	}
	.online_step_ol:after{
		content: "";
		flex: 0 0 1px;
	}
	.online_step_ol li{
		width:90%;
		border-width:2.5px;
		min-height:auto;
		flex-shrink: 0;
	}
	.online_step_ol li:before{
		width:100px;
		aspect-ratio:98/41;
		top:-17px;
	}
	.online_step_ol_b{
		margin-bottom:0;
	}
	.online_step_ol_b li{
		min-height:220px;
	}
	.online_step_ol li:before{background: url(../img/online/sp/step_a1.jpg) center 0/cover no-repeat;}
	.online_step_ol li:nth-of-type(2):before{background: url(../img/online/sp/step_a2.jpg) center 0/cover no-repeat;}
	.online_step_ol li:nth-of-type(3):before{background: url(../img/online/sp/step_a3.jpg) center 0/cover no-repeat;}
	.online_step_ol_b li:before{background: url(../img/online/sp/step_b1.jpg) center 0/cover no-repeat;}
	.online_step_ol_b li:nth-of-type(2):before{background: url(../img/online/sp/step_b2.jpg) center 0/cover no-repeat;}
	.online_step_ol_b li:nth-of-type(3):before{background: url(../img/online/sp/step_b3.jpg) center 0/cover no-repeat;}
	.online_step_ol_b li:nth-of-type(4):before{background: url(../img/online/sp/step_b4.jpg) center 0/cover no-repeat;}
	
	.online_step_ol_b li:first-of-type{background:#fffff3 url(../img/online/sp/step_b1_bg.jpg) center calc(100% + 1px)/150px no-repeat;}
	.online_step_ol_b li:last-of-type{background:#fffff3 url(../img/online/sp/step_b4_bg.jpg) center calc(100% + 1px)/150px no-repeat;}
}

#online_price{
	max-width:810px;
	padding:50px 10px 30px;
	margin:0 auto;
}
#online_price .price_ttl,
#online_price .price_ttl2{
	font-family: "Noto Serif JP", serif;
}
#online_price .price_ttl2{
	color: #29375B;
}
@media (max-width: 768px) {	
	#online_price{
		padding:30px 10px 30px;
	}
	#online_price .price_ttl,
	#online_price .price_ttl2{
		font-family: "Noto Serif JP", serif;
	}
	#online_price .price_ttl2{
		color: #29375B;
	}
	#online_price .price_fgr{
		width:100%;
		margin-left:0;
	}
}

#online_bn{
	background: url(../img/online/bg.png) 0 0 repeat;
	padding:25px 10px 20px;	
}
#online_bn figure{
	margin-bottom:5px;
}

#online_form{
	max-width:830px;
	margin:0 auto;
	padding:50px 10px;
}
@media (max-width: 768px) {
	#online_form{
		padding:40px 10px;
	}
}



/*************************************************
フォーム
*************************************************/
.form_box table{
	width:100%;
	margin-bottom:45px;
	table-layout: fixed;
}
.form_box table th{
	text-align:left;
	vertical-align:middle;
	padding:13px;
	width:216px;
	background-color:#f6f6f6;
	border: solid 1px #878787;
	border-right:none;
}
.form_box table th.row2 .req{
	margin-top: -.7em;
}
.form_box table td{
	text-align:left;
	vertical-align:middle;
	padding:13px;
	border: solid 1px #878787;
}
.form_box .req{
	color:#fff;
	float:right;
	background-color:#b82d2d;
	font-size:12px;
	padding:1px 5px 0;
	display:inline-block;
	line-height:17px;
	margin-top:5px;
}
.form_box .req.req2{
	margin-top:15px;
}

.form_box .nini{
	color:#fff;
	float:right;
	background-color:#808080;
	font-size:12px;
	padding:1px 5px 0;
	display:inline-block;
	line-height:17px;
	margin-top:5px;
}
.form_box .left{
	float:left;
}
form input{
	height:1.8em;
	border:solid 1px #cacaca;
	vertical-align:middle;
	padding-left:5px;
	font-size:16px;
	box-sizing: border-box;
}
::-webkit-input-placeholder{
	color:#fff;
}
form .ip1{
	max-width:281px;
	width:100%;
}
form .ip2{
	max-width:269px;
	width:100%;
}
form .ip3{
	max-width:94px;
	width:100%;
}
form .ip4{
	width:100%;
}
form .s_r{
	padding-right:4px;
}
form .p1{
	padding:5px 0;
}
form textarea {
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	border:solid 1px #cacaca;
	max-width: 553px;
	width:100%;
	box-sizing: border-box;
	height: 227px;
	resize:none;
	padding:3px;
}
form select{
	border:solid 1px #cacaca;
	padding:3px 5px 6px;
}
.wpcf7-list-item{
	padding-right:25px;
}
form .kakunin{
	margin-top:10px;
	background:#fae1e1;
	text-align:center;
	height:74px;
}
form .s1{
	padding-left:5px;
	font-size:14px;
}
form .s2{
	padding-left:5px;
}
form .kakunin {
	line-height:26px;
}
form .kakunin .k_p1{
	padding-top:15px;
}
form .kakunin .k_p2{
	font-weight:bold;
}
form .kakunin input{
	margin-right:3px;
	vertical-align:middle;
}
form .kakunin .req2{
	color:#da0000;
}
form .kakunin input{
	width:18px;
	height:18px;
	margin-right:5px;
}
form .kakunin span.wpcf7-list-item {
    display: inline-block;
    margin: 0;
	padding:0;
	background-color:#fae1e1;
}
.form_btn_wrap{
	display: flex;
	justify-content: center;
	position: relative;
}
.wpcf7-spinner {
	position: absolute;
	top:30px;
	left:0;
	right:0;
	margin:0 auto;
}
form input.submit_button{
	width:239px;
	height:63px;
	cursor:pointer;
	text-indent:-9999px;
	display:block;
	border:none;
	background:url(../img/form/next.jpg) left top no-repeat;
	margin:10px auto 0;
}
form input.submit_button:disabled{
	background:url(../img/form/next.jpg) left top no-repeat;
	cursor:default;
	opacity:0.5;
	filter:alpha(opacity=50);
	-ms-filter: "alpha( opacity=50 )";
}
form input.back{
	width:239px;
	height:63px;
	cursor:pointer;
	text-indent:-9999px;
	display:inline-block;
	border:none;
	background:url(../img/form/back.jpg) left top no-repeat;
	margin:10px 0;
}
form input.submit{
	width:239px;
	height:63px;
	cursor:pointer;
	text-indent:-9999px;
	display:inline-block;
	border:none;
	background:url(../img/form/submit.jpg) left top no-repeat;
	margin:10px 0;
}

.form_box .cont2{
	padding-left:25px;
}

.doui_box {
	padding-top:7px;
}
.doui_box .box{
    border: solid 1px #ccc;
    overflow-y: scroll;
    height: 173px;
    margin: 0 auto;
}
.doui_box .box2 {
	background-color:#f7f7f7;
    padding: 10px 20px;
}
.doui_box .box2 dt{
	font-weight:bold;
}
.doui_box .box2 dd{
	border-bottom:dashed 1px #d9d9d9;
	padding-bottom:15px;
	margin-bottom:15px;
}
.form_box .rink_button{
	text-align:right;
	padding-right:25px;
	padding-top:10px;
}
.form_box .rink_button a{
	color:#0f237c;
	font-weight:bold;
}
.form_box .rink_button a:hover{
	color:#b82d2d;
	font-weight:bold;
	border-bottom:solid 1px #b82d2d;
	opacity:1.0;
	filter:alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}
form .wpcf7c-conf {
    background-color: #e7effe;
    color: black;
    border: 1px solid #cacaca;
}
form span.wpcf7-list-item {
    margin: 0;
}
form .ul1 {
	padding-right:10px;
	margin:0;
}
form .ul1 li{
	padding:0;
	border:0;
}
form .ul1 li.li1{
	padding:0 0 5px;
	border-bottom:solid 1px #E5E5E5;
	margin-bottom:10px;
}
@media (max-width: 768px) {
	.form_box table,
	.form_box table tr,
	.form_box table tbody,
	.form_box table th,
	.form_box table td{
		width:100% !important;
		display: block;
		box-sizing: border-box;
	}
	.form_box table{
		border-bottom: solid 1px #ccc;
		margin-bottom:20px;
	}
	.form_box table th{
		border: solid 1px #ccc;
		padding: 1.5% 3% 1.2%;
		background-color: #ededed;
	}
	.form_box table td{
		border: solid 1px #ccc;
		border-width:0 1px;
		padding:2%;
	}
	table.table_layout .req,
	table.table_layout .nini {
		float: left;
		margin: 1% 2% 0 0;
	}
	.form_box table th.row2 .req{
		margin-top:1%;
	}
	.form_box table th.row2 br{
		display: none;
	}
	.form_box table input[type="text"],
	.form_box table input[type="email"],
	.form_box table textarea,
	.form_box select {
		padding: 1.5% 2%;
		font-size: 110%;
		border: solid 1px #e5e5e5;
		border-radius: 3px;
	}
	.form_box table input[type=radio],
	.form_box table input[type=checkbox] {
		width: 20px;
		height: 20px;
		vertical-align: middle;
	}
	.form_box .left{
		float:none;
	}
	.form_box .cont2 {
		padding:0;
	}
	.doui_box .box {
		height: 294px;
	}
	.doui_box .box2 {
		background-color: #f7f7f7;
		padding: 1.5% 2%;
	}
	.form_box .rink_button {
		padding-right: 10px;
	}
	form div.kakunin {
		padding:0 1% 3%;
		margin-top: 1.5%;
	}
	form .ip1,
	form .ip2{
		max-width:100%;
	}
	form input#pref {
		width: 50%;
	}
	form .kakunin p.k_p2 {
		padding: 0.5% 0 0;
		font-size: 125%;
		font-weight: bold;
	}
	.form_btn_wrap p{
		width: 100%;		
	}
	form input.submit {
		background: url(../img/form/sp/submit.jpg) center top no-repeat;
		background-size: 100% auto;
		width: 100%;
		margin: 3.5% 0 0;
		border: none;
		height: 0;
		padding-top: 15%;
	}
	form input.submit:disabled {
		opacity: 0.5;
		filter: alpha(opacity=50);
		-ms-filter: "alpha( opacity=50 )";
		cursor: default;
	}
}



/*************************************************
はじめてプロ家庭教師をご検討される皆様へ
*************************************************/
#fc_ttl{
	margin:0 0 15px;
}
#fc01{
    max-width:960px;
	margin:0 auto 20px;
	padding:0 10px;
}
#fc01_fgr{
	float:left;
	width: 35%;
	margin:0 15px 5px 0;
}
@media (max-width: 768px) {
	#fc_ttl{
		margin:0;
		line-height:0;
	}
	#fc01{
		padding:0;
		margin-bottom:10px;
	}
	#fc01_fgr{
		width:46%;
		max-width:360px; 
		margin:0 15px 5px 0;
	}
	#fc01_div{
		font-size:clamp(15px,3.5vw,16px);
		padding:5px 8px 0;
	}
}

#fc_ttl02{
	margin:0 0 10px;
}
.fc_txt01{
	text-align: center;
	padding:0 8px 10px;
}
#fc_dl_wrap{
	display: flex;
	background:#f1faf9;
	padding:0 25px 10px;
	gap:25px;
	justify-content: center;
	box-sizing: border-box;
	max-width:890px;
	margin:15px auto 5px;
}
.fc_dl{
	width:calc(100% / 3 - 50px / 3);
	position: relative;
}
.fc_dl dt{
	color:#198889;
	font-weight: 600;
	font-size:20px;
	border-bottom:1.5px solid #198889;
	padding:10px 90px 0 10px;
}
.fc_dl dd{
	background: #fff;
}
.fc_dl dd p{
	background:url(../img/first-character/check.jpg) 10px 12px no-repeat;
	padding:5px 10px 0 30px;
}
.fc_dl dd p:last-of-type{
	padding-bottom:5px;
}
.fc_dl:after{
	content:'';
	display: block;
	width:86px;
	height:97px;
	background:url(../img/first-character/fc_dl01.png) 0 0/cover no-repeat;
	position: absolute;
	top:-20px;
	right:-15px;
}
.fc_dl:nth-of-type(2):after{
	background:url(../img/first-character/fc_dl02.png) 0 0/cover no-repeat;
}
.fc_dl:nth-of-type(3):after{
	background:url(../img/first-character/fc_dl03.png) 0 0/cover no-repeat;
}
.fc_txt02{
	font-size: 15px;
	text-align: center;
	padding:0 8px 0;
	text-indent: -1em;
    margin-left: 1em;
	margin-bottom:30px;
}
@media (max-width: 940px) {
	.fc_txt01,
	.fc_txt02{
		text-align:left;
	}
	.fc_txt01 .sp_none{
		display: none;
	}
}
@media (max-width: 900px) {
	#fc_dl_wrap{
		display:block;
		background:#f1f5f6;
		padding:0 15px 20px;
		margin:0 auto 5px;
	}
	.fc_dl{
		width:100%;
	}
	.fc_dl dt{
		font-size:clamp(18px,4vw,20px);
		padding:10px 5px 0;
	}
	.fc_dl dd{
		background:url(../img/first-character/sp/fc_dl01.jpg) right 0/contain no-repeat #fff;
		padding:5px 0;
	}
	.fc_dl:nth-of-type(2) dd{
		background:url(../img/first-character/sp/fc_dl02.jpg) left 0/contain no-repeat #fff;
		padding-left:110px;
	}
	.fc_dl:nth-of-type(3) dd{
		background:url(../img/first-character/sp/fc_dl03.jpg) right 0/contain no-repeat #fff;
	}
	.fc_dl dd p{
		background:url(../img/first-character/sp/check.jpg) 15px 10px/16px no-repeat;
		padding:5px 10px 0 35px;
		line-height: 1.4;
	}
	.fc_dl dd p:last-of-type{
		padding-bottom:5px;
	}
	.fc_dl:after{
		display: none;
	}
}
@media (max-width: 450px) {
	.fc_dl:nth-of-type(2) dd{
		padding-left:26.5%;
	}
	.fc_txt02{
		font-size:92%;
		margin-bottom:10px;
	}
}

#fc_ttl03{
	padding:20px 15px;
}
#fc_dl02_wrap{
	display: flex;
	padding:0 4px 20px;
}
.fc_dl02{
	width:25%;
	box-sizing: border-box;
	padding:0.8% 0.9%;
}
.fc_dl02 dd{
	padding:8px 0 0;
	font-size:clamp(12px,1.5vw,16px);
}
.fc_dl02_pu{
	border:dashed 2px #bababa;
	background:#fffce6;
}
@media (max-width: 768px) {
	#fc_ttl03{
		padding:10px 15px 5px;
	}
	#fc_dl02_wrap{
		padding:0 4px 0;
		flex-wrap: wrap;
	}
	.fc_dl02{
		width:50%;
		padding:1.2%;
	}
	.fc_dl02 dd{
		padding:5px;
		font-size:clamp(12px,3vw,16px);
	}
}

#fc_merit{
	max-width:920px;
	margin:0 auto;
}
#fc_ttl04{
	padding:20px 0;
	position: relative;
	line-height: 0;
}
#fc_ttl04:before{
	content:'';
	display: block;
	width: 70px;
	aspect-ratio: 1;
	clip-path: polygon(0 70%, 102% 0, 61% 70%);
	background:#fdf8b2;
	position: absolute;
	top:-20px;
	right:18.5%;
	z-index: 0;
}
#fc_ttl04 img{
	position: relative;
	z-index: 1;
}
@media (max-width: 960px) {
	#fc_ttl04{
		padding:20px 10px;
	}
}
@media (max-width:768px) {
	#fc_ttl04{
		padding:0;
	}
	#fc_ttl04:before{
		display:none;
	}
}

#fc_merit_flx{
	display: flex;
	gap:20px;
}
#fc_merit_flx.clearfix:after{
	display: none;
}
#fc_merit_fgr{
	width:39%;
	flex-shrink: 0;
}
#fc_merit_dl dd{
	padding:10px 0 0;
}
#fc_merit_fgr02{
	padding:10px 0 40px;
}
@media (max-width: 960px) {
	#fc_merit_flx{
		padding:0 10px;
	}
	#fc_merit_fgr02{
		padding:10px 10px 15px;
	}
}
@media (max-width:768px) {
	#fc_merit_flx{
		display:block;
		padding:0;
	}
	#fc_merit_flx.clearfix:after{
		display: block;
	}
	#fc_merit_fgr{
		width:44.3%;
		float:right;
		margin:0 0 5px 5px;
	}
	#fc_merit_dl {
		padding:10px 0 0 10px;
	}
	#fc_merit_dl dt{
		width:calc(55.7% - 15px);
	}
	#fc_merit_dl dt img{
		max-width:100%;
		width:300px;
	}
	#fc_merit_dl dd{
		padding:5px 0 0;
	}
	#fc_merit_fgr02{
		padding:15px 10px 15px;
	}
}

#fc_hikaku{
	background: url("../img/first-character/hikaku_bg.jpg")	0 0 repeat;
}
#fc_ttl05{
	padding:25px 15px;
	line-height: 0;
}
#fc_hikaku_fgr{
	overflow: hidden;
	height:416px;
	position: relative;
	margin:0;
}
#fc_hikaku_fgr img{
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	width: 1470px; /* 固定幅 */
	max-width:1470px;
	line-height: 0;
}
#fc_hikaku_txt{
	display: flex;
	justify-content: center;
	position: relative;
	margin-top:-3em;
	padding:0 10px 25px;
}
@media (max-width:768px) {
	#fc_ttl05{
		padding:0;
	}
	#fc_hikaku_fgr{
		height:auto;
	}
	#fc_hikaku_fgr img{
		position:relative;
		left:0;
		transform:none;
		width:100%;
	}
	#fc_hikaku_txt{
		display:block;
		margin-top:0;
		padding:5px 10px 20px;
		background: url("../img/first-character/sp/hikaku_bg.jpg")	0 0/100% repeat-y;
	}
}

#fc_teacher{
	max-width:980px;
	margin:0 auto;
	padding:30px 10px 40px;
}
#fc_teacher_ul{
	display: flex;
	flex-wrap: wrap;
	gap:20px 15px;
	padding:20px 0;
}
#fc_teacher_ul li{
	width:calc(50% - 15px/2);
	display: flex;
}
#fc_teacher_ul figure{
	width:33%;
	max-width:158px;
	flex-shrink: 0;
	margin:0;
}
.fc_teacher_dl dt{
	border-bottom:1.5px solid #404040;
	padding:10px 10px 2px;
	font-size:18px;
	font-weight: bold;
	position: relative;
}
.fc_teacher_reki{
	font-size:clamp(12px,1.5vw,15.5px);
	font-weight: normal;
	position: absolute;
	bottom:5px;
	right:20px;
}
.fc_teacher_reki span{
	display: inline-block;
	background:#122b80;
	color:#fff;
	letter-spacing: 0;
	padding:0 5px;
	margin-right:8px;
}
.fc_teacher_dl dd{
	padding:10px 10px 0;
	font-size:15px;
	color:#404040;
}
@media (max-width:960px) {
	.fc_teacher_dl dt{
		padding:0px 10px 2px;
	}
	.fc_teacher_reki{
		right:0;
	}
	.fc_teacher_reki span{
		margin-right:4px;
	}
}
@media (max-width:768px) {
	#fc_teacher{
		padding:30px 10px 20px;
	}
	#fc_teacher_ul{
		gap:10px;
		padding:10px 0 15px;
	}
	#fc_teacher_ul li{
		width:100%;
		box-sizing: border-box;
		background: url("../img/first-character/sp/bg.jpg") 0 0 repeat;
		padding:5px;
	}
	.fc_teacher_dl dt{
		padding:5px 10px 2px;
		font-size:clamp(16px,3vw,18px);
	}
	.fc_teacher_reki{
		font-size:clamp(12px,2vw,15.5px);
		right:20px;
	}
	.fc_teacher_dl dd{
		padding:8px 5px 0 10px;
		font-size:clamp(12px,2.8vw,15.5px);
		color:#29375B;
	}
}

#fc_teacher_txt{
	background: #f3f3f3;
	max-width:900px;
	margin:0 auto 30px;
	padding:10px 30px 10px 15px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap:30px;
}
#fc_teacher_txt a{
	display: flex;
	width:10em;
	flex-shrink: 0;
	background:#2e3191;
	color:#fff;
	border-radius: 4px;
	text-align: center;
	padding:3px 0;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	justify-content: center;
	align-items: center;
	gap:5px;
}
#fc_teacher_txt a:before{
	content:'';
	display: block;
	width:12px;
	aspect-ratio:12/8;
	background: url("../img/first-character/arrow.jpg") 0 0/cover no-repeat;
}
@media (max-width:768px) {
	#fc_teacher_txt{
		padding:10px;
		display:block;
		width:calc(100% + 20px);
		margin-left:-10px;
		margin-bottom:20px;
	}
	#fc_teacher_txt p{
		margin-bottom:8px;
	}
	#fc_teacher_txt a{
		width:95%;
		border-radius: 6px;
		padding:6px 0;
		font-weight: bold;
		margin:0 auto;
	}
	#fc_teacher_txt a:before{
		width:14px;
	}
}

.fc_teacher_ttl{
	max-width:940px;
	margin:0 auto 10px;
}
.fc_teacher_grid{
	display:grid;
	grid-template-columns:67% 1fr;
	grid-template-rows:auto auto auto;
	gap:10px;
	max-width:920px;
	margin:0 auto 40px;
}
.fc_teacher_grid>div{
	background: url("../img/first-character/hikaku_bg.jpg")	0 0 repeat;
}
.fc_teacher_item1{
	grid-column:1;
	grid-row:1;
}
.fc_teacher_item2{
	grid-column:1;
	grid-row:2;
}
.fc_teacher_item3{
	grid-column:2;
	grid-row:1 / 3;
	background: url("../img/first-character/img02.jpg")	center center/cover no-repeat !important;
}
.fc_teacher_item4{
	grid-column:1 / 3;
	grid-row:3;
}
.fc_teacher_grid_ttl{
	padding:10px 10px 8px 15px;
	font-weight: bold;
	font-size:22px;
	letter-spacing: 0;
}
.fc_teacher_grid_ttl strong{
	background:#fff7ae;
}
.fc_teacher_grid_txt{
	padding:0 10px 20px 20px;
}
.fc_teacher_item3 img{
	width:100%;
	height:100%;
	object-fit: cover;
	display:block;
}
.fc_teacher_txt02{
	background: url("../img/first-character/hikaku_bg.jpg")	0 0 repeat;	
	max-width:920px;
	margin:0 auto;
	padding:15px 10px 20px 20px;
	box-sizing: border-box;
}
@media (max-width:768px) {
	.fc_teacher_grid{
		display:block;
		margin-bottom:15px;
	}
	.fc_teacher_grid>div{
		margin-bottom:10px;
		background: url("../img/first-character/sp/hikaku_bg.jpg")	0 0/100% repeat;
	}
	.fc_teacher_grid_ttl{
		padding:10px 5px 8px 10px;
		font-size:clamp(16px,4.2vw,22px);
	}
	.fc_teacher_grid_txt{
		padding:0 10px 10px;
	}
	.fc_teacher_txt02{
		background: url("../img/first-character/sp/hikaku_bg.jpg")	0 0/100% repeat;
		padding:15px 10px 10px;
	}
}

#fc_sido{
	background: url("../img/first-character/sp/bg2.jpg") 0 0 repeat;
	padding:0 0 35px;
}
.fc_sido_ttl{
	padding:15px 10px;
	line-height:0;
}
#fc_sido_top{
	background: url("../img/first-character/img03.jpg") 10px 0 no-repeat;
	max-width:980px;
	margin:0 auto 20px;
	min-height:164px;
	padding:0 10px 0 330px;
	box-sizing: border-box;
}
@media (max-width:768px) {
	#fc_sido{
		padding:0 0 15px;
	}
	.fc_sido_ttl{
		padding:0;
	}
	#fc_sido_top{
		background: url("../img/first-character/sp/img03.jpg") 0 0/100% no-repeat;
		min-height:auto;
		padding:10px;
		margin:0 auto 5px;
	}
	#fc_sido_top:before{
		content:'';
		display: block;
		float:right;
		width:45%;
		padding-top:23%;
	}
}

#fc_tabset{
	max-width:942px;
	margin:0 auto;
	padding:0 5px ;
}
#fc_tabs{
	display: flex;
	gap:2px;
}
#fc_tabs li{
	width:calc(25% - 6px/4);
}
#fc_tabs a{
	display: block;
	background:#6dc6c6;
	border-radius: 3px 3px 0 0;
	text-align: center;
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#fff;
	font-weight: bold;
	font-size:clamp(16px,2.5vw,22px);
	padding:5px 0 0;
}
#fc_tabs .on{
	background:#0b868d;
}
@media (max-width:768px) {
	#fc_tabs a{
		line-height:1;
		font-size:clamp(12px,3.5vw,22px);
		padding:7px 0 5px;
	}
}

.panels{
	border:1px solid #b1b1b1;
	background: #fff;
	padding:20px;
}
.panel{
	display: none;
}
#panel1{
	display: block;
}
.panel_top{
	display: flex;
	flex-wrap: wrap;
	gap:5px 30px;
	margin-bottom:10px;
}
.panel_top_dl{
	display: flex;
	gap:5px;
}
.panel_top_dl dt{
	display: flex;
	font-weight: bold;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-size:120%;
	background: url("../img/first-character/i_maru.png") 0 6px no-repeat;
	padding:0 0 0 25px;
	flex-shrink: 0;
}
.panel_top_dl dd{

	padding-top:2px;
}
@media (max-width:768px) {
	.panels{
		padding:10px 5px;
	}
	.panel_top{
		gap:5px 15px;
	}
	.panel_top_dl{
		gap:3px;
	}
	.panel_top_dl dt{
		font-size:clamp(14px,3vw,18px);
		background: url("../img/first-character/i_maru.png") 0 4.5px/1em no-repeat;
		padding:0 0 0 1.2em;
	}
	.panel_top_dl dd{
		padding-top:0;
		font-size:clamp(13px,2.8vw,16px);
	}
}

.panel_middle{
	border:dotted #bbb;
	border-width:1.5px 0;
	padding:10px 0;
	margin-bottom:10px;
}
.panel_ttl{
	font-weight: bold;
	color:#ac3024;
	font-size:clamp(16px,3vw,20px);
	letter-spacing: 0;
	margin-bottom:0px;
}
.panel_ttl:before{
	content:'▼';
	font-size:80%;
	position: relative;
	top:-1px;
}
.panel_ul{
	display: flex;
	gap:5px;
	margin-bottom:5px;
}
.panel_ul li{
	background:#f5feff;
	padding:5px 10px;
	box-sizing: border-box;
	flex-shrink: 0;
	font-size:clamp(14px,2vw,16px);
}
.panel_ul .li1{
	width:8em;
}
.panel_ul .li2{
	width:6em;
}
.panel_ul .li3{
	width:5em;
	text-align: center;
}
.panel_ul .li4{
	width:10em;
	text-align: center;
	font-size:90%;
}
.panel_ul .li5{
	flex:1;
	font-size:90%;
	margin-right:auto;
}
.panel_ul_head li{
	text-align: left !important;
	padding:0 !important;
	font-size: 100% !important;
	background: none;
}
@media (max-width:768px) {
	.panel_ul{
		display: grid;
		grid-template-columns:40% 1fr 1fr;
		gap:0;
		border:solid #ccc;
		border-width:1px 0 0 1px;
	}
	.panel_ul_head{
		display: none;
	}
	.panel_ul li{
		border:solid #ccc;
		border-width:0 1px 1px 0;
		width:100% !important;
		display:flex;
		align-items:center;
		justify-content: center;
		line-height: 1.5;
	}
	.panel_ul .li1{
		grid-column:1;
		grid-row:1;
	}
	.panel_ul .li2{
		grid-column:2;
		grid-row:1;
	}
	.panel_ul .li3{
		grid-column:3;
		grid-row:1;
	}
	.panel_ul .li4{
		grid-column:1;
		grid-row:2;
	}
	.panel_ul .li5{
		grid-column:2/4;
		grid-row:2;
		text-align:left;
		background: #fff;
		justify-content:flex-start;
	}
}

.panel_txt{
	padding-left:0.5em;
}
@media (max-width:768px) {
	.panel_txt{
		padding-left:2px;
	}
}

.fc_try_ttl{
	padding:0 10px 25px;
	line-height: 0;
}
.fc_try_ttl:before{
	content:'';
	display: inline-block;
	width: 200px;
	aspect-ratio: 1/0.15;
	clip-path: polygon(50% 100%,100% 0,0 0);
	background:#f5f5f5;
	margin-top:-1px;
	margin-bottom:10px;
}
@media (max-width:768px) {
	.fc_try_ttl{
		padding:0 0 20px;
	}
	.fc_try_ttl:before{
		width:33%;
		margin-top:-1px;
	}
}

#fc_try01{
	display: flex;
}
#fc_try01_fgr{
	width:26%;
	margin:0 15px 0 0;
	flex-shrink: 0;
}
#fc_try01_r p{
	margin-bottom:20px;
}
#fc_try_point{
	position: relative;
}
#fc_try_point figure{
	margin:0;
}
#fc_try_point figure img{
	width:100%;
}
#fc_try_point a{
	display: block;
	position:absolute;
	top:6%;
	right:5%;
	width:22.16216216216216%;
}
#fc_try_point a img{
	width:100%;
}
@media (max-width:1060px) {
	#fc_try01{
		padding:0 10px;
	}
	#fc_try01_fgr{
		margin-left:-10px;
	}
}
@media (max-width:768px) {
	#fc_try01{
		display:block;
	}
	#fc_try01_fgr{
		float:left;
		width:35%;
		margin-bottom:2px;
	}
	#fc_try01_r p{
		margin-bottom:0;
	}
	#fc_try_point{
		clear: both;
		padding-top:3.80710659898477%;
	}
	#fc_try_point a{
		display: block;
		position:absolute;
		top:6%;
		right:1%;
		width:38.3248730964467%;
	}
}

#fc_try02{
	background:url("../img/first-character/sp/bg2.jpg") 0 0 repeat;
	max-width:960px;
	margin:40px auto 50px;
}
#fc_try02_inner{
	max-width:795px;
	margin:0 auto;
	padding:10px 10px 20px;
}
#fc_try02_inner p{
	margin-bottom:15px;
}
#fc_try02_inner figure{
	margin:0;
}
@media (max-width:768px) {
	#fc_try02{
		margin:15px auto 0;
	}
	#fc_try02_inner{
		padding:10px 10px 10px;
	}
}



/*************************************************
コース一覧
*************************************************/
main.page {
  margin-top: -25px;
}
main.page #bread_crumb {
  padding: 16px 0;
	height:auto;
	display: block;
}
main.page #bread_crumb ul {
  list-style: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 40px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.437;
}
@media (max-width: 1280px) {
  main.page #bread_crumb ul {
    width: calc(100% - 80px);
    max-width: none;
    padding: 0;
  }
}
@media (max-width: 640px) {
  main.page #bread_crumb ul {
    width: calc(100% - 48px);
  }
}
@media (max-width: 400px) {
  main.page #bread_crumb ul {
    width: calc(100% - 32px);
  }
}
main.page #bread_crumb ul li {
  position: relative;
  color: #29375b;
  z-index: 1;
}
main.page #bread_crumb li.sub{
	padding-left:0;
}
main.page #bread_crumb li.sub:before {
	display: none;
}
main.page #bread_crumb ul li:not(:last-child)::after {
  content: "›";
  margin-left: 12px;
  color: #29375b;
}
main.page #bread_crumb ul li a {
  color: #17298d;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
main.page #bread_crumb ul li a:hover {
  opacity: 0.75;
}
main.page .page-mv {
  background: #f1f4f9;
  padding: 64px 0 72px;
  text-align: center;
}
main.page .page-mv .container {
  padding-top: 0;
  padding-bottom: 0;
}
main.page .page-mv h2 {
  color: #29375b;
  font-size: 40px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.437;
  margin-bottom: 12px;
  margin-bottom: 24px;
  padding-top: 28px;
  background: url(../img-top/icon_three-powers.svg) no-repeat top center;
}
main.page .page-mv p {
  color: #29375b;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
}
@media (max-width: 640px) {
  main.page .page-mv {
    padding: 48px 0 56px;
  }
  main.page .page-mv h2 {
    font-size: 28px;
    margin-bottom: 12px;
  }
  main.page .page-mv p {
    font-size: 16px;
  }
}
main.page .page-contents {
  background: #fff;
}
main.page .page-contents .container {
  padding-top: 80px;
  padding-bottom: 80px;
}
@media (max-width: 1080px) {
  main.page .page-contents .container {
    padding-top: 64px;
    padding-bottom: 64px;
  }
}
@media (max-width: 480px) {
  main.page .page-contents .container {
    padding-top: 48px;
    padding-bottom: 48px;
  }
}
main.page .course-detail {
  text-align: center;
  padding: 56px 0;
  background-image: url(../img-top/deco-head.svg), url(../img-top/deco-head.svg);
  background-position: top center, bottom center;
  background-repeat: no-repeat;
}
main.page .course-detail p {
  color: #29375b;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.78;
  margin-bottom: 16px;
}
main.page .course-detail p:last-child {
  margin-bottom: 0;
}
@media (max-width: 640px) {
  main.page .course-detail {
    margin-bottom: 40px;
  }
  main.page .course-detail p {
    font-size: 16px;
    text-align: left;
  }
}
main.page .course-box {
  margin-top: 64px;
}
@media (max-width: 480px) {
  main.page .course-box {
    margin-top: 80px;
  }
}
main.page .course-box .box {
  position: relative;
  padding: 64px;
  margin-bottom: 40px;
}
@media (max-width: 768px) {
  main.page .course-box .box {
    padding: 48px;
  }
}
@media (max-width: 560px) {
  main.page .course-box .box {
    padding: 32px;
  }
}
@media (max-width: 480px) {
  main.page .course-box .box {
    padding: 104px 24px 24px;
  }
}
main.page .course-box .box:last-child {
  margin-bottom: 0;
}
main.page .course-box .box.box-elementary {
  background: #FFFDE6;
}
main.page .course-box .box.box-junior {
  background: #F1F4F9;
}
main.page .course-box .box.box-high {
  background: #F1F9F1;
}
main.page .course-box .box.box-refusal {
  background: #FFF4F2;
}
main.page .course-box .box.box-refusal .course-list {
  grid-template-columns: repeat(1, 1fr);
}
main.page .course-box .box .course {
  display: flex;
  align-items: flex-start;
  gap: 40px;
  margin-bottom: 48px;
}
@media (max-width: 900px) {
  main.page .course-box .box .course {
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 24px;
  }
}
main.page .course-box .box .course .img-box {
  flex-shrink: 0;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  overflow: hidden;
}
main.page .course-box .box .course .img-box img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
@media (max-width: 900px) {
  main.page .course-box .box .course .img-box {
    width: 160px;
    height: 160px;
  }
}
@media (max-width: 480px) {
  main.page .course-box .box .course .img-box {
    position: absolute;
    width: 120px;
    height: 120px;
    top: -32px;
  }
}
main.page .course-box .box .course .txt-box span {
  display: block;
  color: #17298d;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 4px;
}
main.page .course-box .box .course .txt-box span br {
  display: none;
}
@media (max-width: 640px) {
  main.page .course-box .box .course .txt-box span br {
    display: block;
  }
}
@media (max-width: 480px) {
  main.page .course-box .box .course .txt-box span {
    font-size: 16px;
  }
}
main.page .course-box .box .course .txt-box h3 {
  color: #29375b;
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 12px;
}
@media (max-width: 480px) {
  main.page .course-box .box .course .txt-box h3 {
    font-size: 24px;
  }
}
main.page .course-box .box .course .txt-box p {
  color: #29375b;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  text-align: left;
}
@media (max-width: 900px) {
  main.page .course-box .box .course .txt-box p {
    text-align: left;
  }
}
main.page .course-box .box .course-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}
@media (max-width: 900px) {
  main.page .course-box .box .course-list {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
main.page .course-box .box .course-list a {
  display: block;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
  padding: 32px;
  text-decoration: none;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}
main.page .course-box .box .course-list a:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
  transform: translateY(-2px);
}
@media (max-width: 480px) {
  main.page .course-box .box .course-list a {
    padding: 20px;
  }
}
main.page .course-box .box .course-list a h4 {
  color: #17298d;
  font-size: 24px;
  font-weight: 700;
  padding-left: 48px;
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: #E3E3E3 1px solid;
  background: url(../img-top/icon-course-box-btn.svg) no-repeat top 2px left;
  background-size: 36px;
}
@media (max-width: 480px) {
  main.page .course-box .box .course-list a h4 {
    font-size: 18px;
    padding-left: 32px;
    background: url(../img-top/icon-course-box-btn.svg) no-repeat top 4px left;
    background-size: 24px;
  }
}
main.page .course-box .box .course-list a p {
  color: #29375b;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  margin: 0;
}
main.page .page-nav {
  padding: 48px 0;
  background: #F1F4F9;
}
main.page .page-nav .container {
  padding-top: 0;
  padding-bottom: 0;
}
main.page .page-nav ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 24px;
  list-style: none;
}
@media (max-width: 768px) {
  main.page .page-nav ul {
    gap: 16px;
  }
}
main.page .page-nav ul li {
  width: calc((100% - 48px) / 3);
}
@media (max-width: 960px) {
  main.page .page-nav ul li {
    width: calc((100% - 24px) / 2);
  }
}
@media (max-width: 768px) {
  main.page .page-nav ul li {
    width: 100%;
  }
}
main.page .page-nav ul li a {
  display: block;
  color: #17298d;
  font-size: 18px;
  font-weight: 700;
  padding: 16px 16px 16px 56px;
  background: #fff url(../img-top/icon-course-box-btn.svg) no-repeat top 16px left 16px;
  background-size: 28px;
  text-decoration: none;
  transition: all 0.3s ease;
}
main.page .page-nav ul li a:hover {
  opacity: 0.5;
  transition: all 0.3s ease;
}
main.page #cta-box .container br.sp {
  display: none;
}
@media (max-width: 480px) {
  main.page #cta-box .container br.sp {
    display: block;
  }
}
main.page #cta-box .container h2 {
  color: #fff;
  font-size: 32px;
  margin-bottom: 24px;
}
@media (max-width: 640px) {
  main.page #cta-box .container h2 {
    font-size: 24px;
  }
}
main.page #cta-box .container > p {
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 40px;
}
@media (max-width: 640px) {
  main.page #cta-box .container > p {
    font-size: 18px;
  }
}



/*************************************************
width
*************************************************/
.w100p{
	width:100%;
}



/*************************************************
余白
*************************************************/
.mb0{margin-bottom:0 !important;}
.mb5{margin-bottom:5px;}
.mb10{margin-bottom:10px;}
.mb15{margin-bottom:15px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}

.mr15{margin-right: 15px}

.ml20{margin-left:20px;}

.mt0{margin-top:0;}
.mt20{margin-top:20px;}
.mt40{margin-top:40px;}

