@charset "utf-8";

#wrapper { overflow: hidden; }

body {
  margin:0; padding:0;
  font-size:16px; color:#383630; line-height: 1.875; font-weight:500;
  -webkit-font-smoothing:antialiased;
  font-family:
    "Noto Sans JP", "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", "Meiryo",
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
    letter-spacing: 0.8px;
  }

/* common------------------------*/
.mt5 { margin-top: .5em; }
.mt10 { margin-top: 1em; }
.mt15 { margin-top: 1.5em; }
.mt20 { margin-top: 2em; }
.mt30 { margin-top: 3em; }
.mb10 { margin-bottom: 1em; }

.left   { text-align:left; }
.center { text-align:center; }
.right  { text-align:right; }

.bold   { font-weight:bold; }

p.txt { font-size: 1.12em; color:#383630; font-weight: 500; }

a:visited { color: #383630!important; }

.small { font-size: .85em!important; }

.flex { display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.flex-between { -webkit-justify-content:space-between; justify-content:space-between; }
.flex-center { -webkit-justify-content:center; justify-content:center; }

/* main ------------- */
.mv { position: relative; }

/* button */
.button { position:relative; z-index: 0; display:inline-block; overflow:hidden; min-width:260px;
  padding:.7em 3em .6em 3em; text-align:center; }
.button.icon:before { content:""; display:inline-block; width:1.2em; height:1.2em; margin:.3em .5em 0 0; vertical-align:top; background:no-repeat center / 100%; }

/* btn */
[class^="btn-"] a {
  position:relative; display:inline-block; min-width:220px; padding:23px 42px 23px 35px; border-radius:50px; text-align:center; font-weight:bold;
}
[class^="btn-"] a::before {
	content:""; position:absolute; top:50%; right:15px; width:7px; height:7px; margin-top:-3px; border-width:2px 2px 0 0; border-style:solid; -webkit-transform:rotate(45deg); transform:rotate(45deg);
}

.btn-line-arrow a { min-width:auto; padding:0 0 0.2em 0!important; color:#0f5784!important; border-bottom:1px solid #fadd69; border-radius:0; }
.btn-line-arrow a::before { display:none; }
.btn-line-arrow a span { position:relative; display:inline-block; padding-left:2em; text-align:left; }
.btn-line-arrow a span::before, .btn-line-arrow a span::after { content:""; position:absolute; }
.btn-line-arrow a span::before { top:50%; left:0; width:23px; height:23px; margin-top:-12px; border-radius:50%; background-color:#fadd69; }
.btn-line-arrow a span::after {
	top:50%; left:7px; width:7px; height:7px; margin-top:-4px; border-width:2px 2px 0 0; border-style:solid; border-color:#0c99f1; -webkit-transform:rotate(45deg); transform:rotate(45deg);
}


/* link-area */
.link-area > li { padding-top: 5.5em; }
.link-area > li:first-child { padding-top: 2em; }
.link-area .ttl { font-size: 1.325em; font-weight: bold; letter-spacing: 2px; }
.link-area .ttl .big { padding-right: .15em; font-size: 1.45em; }

.link-area .link{ display: block; width: 100%; margin: auto; padding: 2.5% 5% 1%; background: #fff; box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.1); border-radius: 0.9em; overflow: hidden; position: relative; }
.link-area > li:nth-child(odd) .link { margin-left: 0; }
.link-area > li:nth-child(even) .link { margin-right: 0; }
.link-area > li:nth-child(odd) .link-img::before { right:0; }
.link-area > li:nth-child(even) .link-img::before { left:0; }

.link-area .link:hover { color: #383630; }
.link-area .link::before { content: ""; display: block; position: absolute; left: 0; top: 0; 
  width: 0; height: 0; 
  border-style: solid; border-width: 4em 4em 0 0; border-color: #0075c1 transparent transparent transparent;  }
.link-area .link::after { content: ""; display: block; position: absolute; left: 0; top: 0; 
  width: 11.1em; height: 6em; 
  border-style: solid; border-width: 3px; border-color: #0075c1 transparent transparent transparent; 
  transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }
.link-area { padding: 1em 0 6em; }
.link-img { position: relative; }
.link-img::before { position: absolute; content: ''; width: 646px; height: 407px; z-index: -1;
  background-image: url(../img/top/teacher_bg.png); top:2.5em; background-repeat: no-repeat; }

.link-area .button { font-weight: bold; }
.link-area .link:hover .button .button-line::after { width: 13em; }
.link-area .link .button .button-line::after {  display: block; content: "";  position: absolute; left: 3.5em;  bottom: .15em; width: 0px;  height: 2px;  background: #0075c1;  -webkit-transition: all .3s;  transition: all .3s; }

.link-area .link .txt { margin: 1em 0; }

/* teacher */
.link-area .teacher .ttl { color: #0075c1; }

/* student */
.link-area .student .link-img::before { top:4em; background-image: url(../img/top/student_bg.png); }
.link-area .student .link::before, .link-area .student .link::after { border-color: #74bf00 transparent transparent transparent; }
.link-area .ttl { color: #74bf00; }


/* others */
.link-area .others .link-img::before {  top:3em; background-image: url(../img/top/others_bg.png); }
.link-area .others .link::before,.link-area .others .link::after { border-color: #dd6e01 transparent transparent transparent; }
.link-area .others .ttl { color: #dd6e01; }

/* button ------------- */
.link-area .button { min-width: auto; }
.link-area .link .button .button-line { margin-left: .9em; }

.c_arrow { display: block; width: 2.85em; height: 2.85em; margin: auto;
  position: absolute; top: 0; left: 0; bottom: 0; border-radius: 50%; }
.c_arrow::before,
.c_arrow::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; margin: auto; }
.c_arrow::before { left: 0; width: 1.1em; height: 2px; background: #fff;}
.c_arrow::after { left: 0.6em;
    width: 0.65em;
    height: 0.65em;
  border-top: 2px solid #fff; border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/* teacher */
.link-area .c_arrow { right: auto; }
.link-area .teacher .c_arrow { background: rgb(49,139,227); background: linear-gradient(180deg, rgba(49,139,227,1) 0%, rgba(4,190,254,1) 100%); }
.link-area .teacher .link:hover .button .button-line{ color: #0075c1; }

/* student */
.link-area .student .c_arrow { background: rgb(116,191,0); background: linear-gradient(180deg, rgba(116,191,0,1) 0%, rgba(180,219,0,1) 100%); }
.link-area .student .link:hover .button .button-line { color: #74bf00; }
.link-area .student .link .button .button-line::after { background: #74bf00; }

/* others */
.link-area .others .c_arrow { background: rgb(221,110,1); background: linear-gradient(180deg, rgba(221,110,1,1) 0%, rgba(255,126,0,1) 100%); }
.link-area .others .link:hover .button .button-line{ color: #dd6e01; }
.link-area .others .link .button .button-line::after { background: #dd6e01; }

.link-area a:link { color:#383630; -webkit-transition:all .3s; transition:all .3s; text-decoration: none; }

/* ================================================================
  レスポンシブ
=================================================================== */
/* 600以上(PC・タブレット) */
@media screen and (min-width: 600px) {

  .link-area .link { width: 65%; }
  .link-img { width: 32%; margin: auto; }
  .link-img::before { width: 25em; }


  .link-area > li:nth-child(even) .link-img { margin-right: auto; margin-bottom: 0; text-align: center; }
  .link-area > li:nth-child(even) .link { order:2; }
  .link-area > li { display:-webkit-box; display:flex; flex-wrap:wrap; -webkit-box-pack:justify; justify-content:space-between; }

}

/* 768以上(PC・タブレット) */
@media screen and (min-width: 768px) {
  
  

}

/* 960以上(PC) */
@media screen and (min-width: 960px) {
    
  .link-area .link { width: 62%; }
  .link-img { width: 34%; margin: auto; }
  .link-img::before { width: 30em; height: 20em; }
  .link-area > li:nth-child(odd) .link { margin-left: 0; margin-right: 4%; }
  .link-area > li:nth-child(even) .link { margin-left: 4%; margin-right: 0; }
  .link-area > li:nth-child(odd) .link-img { margin-left: 0; margin-right: 0; }
  .link-area > li:nth-child(even) .link-img { margin-left: 0; margin-right: 0; }
  .others .link {  margin-right: 8%; }
  .others .link-img { width: 30%; }
}

/* 1025px以上(PC) */
@media screen and (min-width: 1025px) {
}

/* .link-img::before {  width: 34em;  height: 22em;} */

/* 1200px以上(PC) */
@media screen and (min-width: 1200px) {
  .link-img::before {  width: 646px;  height: 407px; }
}

/* 1400px以上(PC) */
@media screen and (min-width: 1400px) {

.link-area .link { padding: 2em 5em; }
.link-img::before {  width: 646px;  height: 407px; }

}

/* 1200以下 (タブレット横以下) */
@media screen and (max-width: 1200px) {
.link-area .pc_only { display: none; }
.link-area > li { padding-top: 4em; }
.link-img::before { background-size: 100%; }
}

/* ================================================================
  タブレット
=================================================================== */
/* 1024以下 (タブレット横以下) */
@media screen and (max-width: 1024px) {


}

/* 959以下 (タブレット以下) */
@media screen and (max-width: 959px) {
  .link-area > li { padding-top: 3em; }
  .link-area .link { padding: 3% 4% 1% 5%; }
  .link-area .link::before { border-width: 3em 3em 0 0; }
  .link-area .link::after { width: 9.1em; height: 6em; }
  .link-area .ttl { font-size: 1.4em; }
  .link-area p { font-size: .9em; }
  .others .link-img {  width: 21%; }
  .link-area > li.others:nth-child(odd) .link-img::before { margin: auto auto auto 0; right: -2em; }
}


/* 767以下 (タブレット以下) */
@media screen and (max-width: 767px) {
  .link-area > li {
      padding-top: 2em;
  }
}

/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width: 599px){

  .link-area .link {  padding: 1.5em 2em 0; }
  .link-img { display: none;  }
  .others .link-img { width: 55%; }
  .link-area > li.others:nth-child(odd) .link-img::before { right: -4em; }
  .link-area { padding-top: 2em; padding-bottom: 0; }
  .link-area .ttl { font-size: 1.3em; }
  .link-area .link { padding: 1.5em 2em 1em; }
  .link-area .link::before { border-width: 2.5em 2.5em 0 0; }
  .link-area .link::after { width: 8.1em; }
  .link-area > li:nth-child(odd) .link-img::before { right:-2em; }
  .link-area > li:nth-child(even) .link-img::before { left: -2em; }
  .link-area .others .link-img::before { top: 4em; }
    
  [class^="btn-"] a { padding:13px 42px 13px 35px; }
  .btn-line-arrow a { font-size:.88em; }
  .btn-line-arrow a span::before { width:20px; height:20px; margin-top:-10px; }
  .btn-line-arrow a span::after { width:6px; height:6px; margin-top:-3px; }
    
}

.important_box { margin-top: 3em; }

/* 20231116 */
.sub_box { position:relative; width: 100%; padding: 30px; margin:1em 0; background-color: #fff8eb; border: 5px solid #db4848; border-radius: 0.9em; }
.sub_box .sub_ttl { font-weight: 600; color: #db4848; font-size: 1.5em; margin-bottom: 0.5em; }

.sub_box .subtxt { line-height: 1.8em; color: #222; font-weight: 600; font-size: 1.12em; }

.about { padding: 2%; }
.about_ttl > span.logo { margin-right: 1em; }
.about_ttl { margin-bottom: 20px; }

@media only screen and (max-width: 767px) {
    .about { padding: 5% 0; }
    .sub_box { padding: 20px; }
}

/* 20231120 */
.bnr_box { position:relative; padding:30px; border-radius: 0.9em; background-color: #fff5ee; box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.1); }
.bnr_box ul li { width: 48%; margin: 0 1%; }
.bnr_box ul li a img { border-radius: 0.9em; border: 2px solid #ee883e; }
.bnr_box .bnr_ttl { margin-bottom: 1.5em; position:relative; z-index: 0; }
.bnr_box .bnr_ttl span { display:inline-block; font-weight: 600; font-size: 1.45em; padding: 5px 15px; color: #ee883e; }
.bnr_box ul li a:hover { color: #fff; opacity: 0.8; }

@media screen and (max-width: 599px){
    .bnr_box { margin-top: 2em; padding:15px; }
    .bnr_box ul li { width: 100%; }
    .bnr_box ul li:nth-child(n) { margin-bottom: 10px; }
}

/* 20241220 */
/* button02 */
.btnBox { margin: 1.4% 0 5.4%; }

.button02 { display: inline-block; min-width: 520px; padding: 1.1em 1.7em; font-size: 1.45em; 
  color: #fff!important; text-decoration: none!important; border-radius: 0.5em; position: relative; background: linear-gradient(90deg, #dd6e01 0%, #ffa903 100%); font-weight: bold; box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.1); }
.button02:hover { color: #fff; opacity: 0.8; }
.button02 > span { display: inline-block; text-align: left; line-height: 1.5; }
.button02::after,
.button02::before { content: ""; position: absolute; top: 0; right: 1.7em; bottom: 0; margin: auto; }
.button02::after {  width: .9em; height: 2px; background: #fff; }
.button02::before { width: 8px; height: 8px; 
  border-top: 2px solid #fff; border-right: 2px solid #fff; 
  -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.button02:visited { color: #fff!important; }

@media screen and (max-width: 599px){
  .btnBox { margin: 5.4% 0; } 
  /* button */
  .button02 { width: 100%!important; min-width: 0; padding: 1.25rem 1.5rem; } 
}