@charset="utf-8";

.pc { }
.sp-only { display:none; }
@media screen and (max-width:600px){
  .pc { display:none; }
  .sp-only { display:block; }
}

.example-h1 {
  background-image:url(/gtec/fs/example/img/back.jpg);
  background-size:cover;
  background-position:center;
}
.example-h1_inner {}
.example-h1_title {
  font-size:50px;
  text-align:center;
  font-weight: bold;
  padding:50px 0;
  position:relative;
  color:#002060;
}
.example-h1_title p {
  font-size:18px;
  text-align:center;
}
.example-h1_title:before{
  content:"";
  display:block;
  position:absolute;
  top:50%;
  left:0;
  transform:translateY(-50%);
  background-image:url(/gtec/fs/example/img/back-icon01.svg);
  background-size:contain;
  background-repeat:no-repeat;
  max-width:21.875%;
  width:100%;
  height:80%;
}
.example-h1_title:after{
  content:"";
  display:block;
  position:absolute;
  top:50%;
  right:0;
  transform:translateY(-50%);
  background-image:url(/gtec/fs/example/img/back-icon02.svg);
  background-size:contain;
  background-repeat:no-repeat;
  max-width:29.166%;
  width:100%;
  height:90%;
}

.cont01 { background:#ffd13f; padding:50px 0; }
.cont01 .cont_block {
  display:flex;
  justify-content:space-between;
  align-items:center;
  position:relative;
  margin-bottom:50px;
}
.cont01 .cont_block:last-child { margin-bottom:0; }
.cont01 .cont_block:before {
  content:"";
  display:block;
  position:absolute;
  left:30px;
  bottom:0;
  width:calc(100% - 30px);
  height:2px;
  background:#fff;
}
.cont01 .cont_block .text {
  background:#fff;
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:60%;
  border-radius:30px;
  font-weight: bold;
  min-height:250px;
}
.cont01 .cont_block .text .tx01 { font-size:20px; }
.cont01 .cont_block .text .tx02 { color:#80350e; margin-top:20px; }
.cont01 .cont_block .check { width:35%; }
.cont01 .cont_block .check a { transition:all ease-out .4s; text-decoration:none; }
.cont01 .cont_block .check a:hover { opacity:.6; }
.cont01 .cont_block .check .check-img img { width:100%;  }
.cont01 .cont_block .check .school {
  background:#f1e3d3;
  color:#80350e;
  padding:5px 0;
  border-radius:40px;
  text-align:center;
  margin-top:10px;
  font-size:20px;
  font-weight: bold;
}
@media only screen and (max-width: 767px){
  .l-unit__box { padding:0 15px; }
  .example-h1_title { font-size:36px; }
  .example-h1_title p { font-size:14px; }
  .cont01 .cont_block .text .tx01,
  .cont01 .cont_block .check .school { font-size:16px; }
}
@media only screen and (max-width: 600px){
  .example-h1_title { z-index:10; }
  .example-h1_title:before { z-index:-1; max-width:40%; height:50%; top:70%; left:-10%; }
  .example-h1_title:after { z-index:-1; max-width:45%; height:60%; top:5%; right:-10%; transform:none; }
  
  .cont01 .cont_block { display:block; }
  .cont01 .cont_block .text,.cont01 .cont_block .check { width:100%; }
  .cont01 .cont_block .check a { display:block; padding:20px 0; }
  .cont01 .cont_block .check .check-img { text-align:center; }
  .cont01 .cont_block .check .check-img img { width:60%; }
  .cont01 .cont_block:before { left:0; width:100%; }
  .cont01 .cont_block .text { min-height:initial; }
  .cont01 .cont_block .text .tx02 { font-size:10px; }
}


.cont { background:#F1E3D3; padding:50px 0; }
.cont .cate { display:flex; }
.cont .cate li {
  color:#ff9933;
  font-weight: bold;
  margin-right:1em;
  font-size:16px;
}
.cont .cate li:last-child { margin-right:0; }
.cont .lead {
  font-size:20px;
  font-weight: bold;
  margin-top:10px;
}
.cont .school { display:flex; align-items:center; color:#0070c0; margin-top:10px; }
.cont .school p { font-size:16px; margin-left:1em; font-weight: bold; }
.cont .school .num {
  background:#d1d1d1;
  color:#000;
  border-radius:5px;
  padding:3px 0;
  min-width:100px;
  text-align:center;
  margin-left:1em;
  font-size:14px;
}

.cont .checkbox { background:#fff; padding:20px; margin-top:20px; font-size:18px; border-radius:15px; }
.cont .checkbox ul {}
.cont .checkbox ul li {
  position:relative;
  padding-left:1.5em;
  font-weight: bold;
}
.cont .checkbox ul li:before {
  content:"";
  display:block;
  width:0.8em;
  height:1em;
  background-image:url(/gtec/fs/example/img/checkmark.svg);
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  position:absolute;
  left:0;
  top:5px;
}
.cont .hs { margin-top:20px; }
.cont .cap { font-size:10px; margin-top:10px; }
.cont .arrow { text-align:right; margin:20px 13% 0 20px; }

@media only screen and (max-width: 767px){
  .cont .lead { font-size:16px; }
  .cont .school p,.cont .fukidashi .ttl { font-size:12px; letter-spacing:0.5px; }
  .cont .checkbox { font-size:14px; }
  .cont .school .num { font-size:10px; min-width:70px; }
}
@media only screen and (max-width: 600px){
  .cont .fukidashi.num3 { flex-wrap:wrap; justify-content:space-between; }
  .cont .fukidashi.num3 .num { width:32%; margin:0; }
  .cont .fukidashi.num3 .num:first-child { margin-left:0; }
  .cont .fukidashi.num3 .ttl { order:4; margin-top:10px; }
  .cont .fukidashi.num2 { flex-wrap:wrap; }
  .cont .fukidashi.num2 .ttl { order:3; margin-top:10px; }
  .cont .fukidashi.num2 .num:first-child { margin-left:0; }
  
  .cont .arrow { margin:10px 12% 0 10px; }  
  .cont .arrow img { width:10%; }
}