@charset "UTF-8";
.boxHalloweenWrap .activeLearning2025Box {
  background: linear-gradient(138.7deg, #c4e5ff 23.82%, #bdddffba 60.25%), url(../../images/index/bg_2025_webshutugan.jpg) no-repeat, #FFF;
  padding: 0 50px;
  font-weight: 700;
  background-size: cover;
  position: relative;
  /* mix-blend-mode: multiply; */
}
.boxHalloweenWrap .activeLearning2025Link {
  width: 100%;
  padding-top:35px;
}
.boxHalloweenWrap .boxHalloweenTitile {
  text-align: left;
  font-weight: 700;
  font-size: 3.15rem;
  color: #b40000;
  width: 100%;
  line-height: 3.5rem;
}
.boxHalloweenWrap .boxHalloweenTitile span {
  display:inline-block;
  font-size: 2.5rem;
}

.boxHalloweenWrap .boxHalloweenTitile span.redBox{
  background-color:#C71A27;
  font-size: 2rem;
  padding:0.5rem 1rem;
  color: #ffffff;
  margin-right: 1rem;
  position: relative;
  bottom: 1rem;
  /* color:#ffff21; */
  width: 100%;
  border-radius: 0.5em;
  margin-bottom: 0.5em;
}
.boxHalloweenWrap .boxHalloweenTitile small{
  font-size: 2rem;
  color: #313131;
  position: relative;
  bottom: 0.2rem;
}
.boxHalloweenWrap .p01,
.boxHalloweenWrap .p02 {
  text-align: center;
  font-size: 1.35rem;
  margin-top: 0.8em;
  width: 600px;
  margin-bottom: 0.5em;
}
.boxHalloweenWrap .p01 span,
.boxHalloweenWrap .p02 span{
  display: inline;
  background: linear-gradient(transparent 60%, #FFF70080 60%);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  color:#c71a27;
}
.boxHalloweenWrap .boxHalloweenWhite {
  background-color: #ffffffc7;
  border-radius: 20px;
  padding: 15px;
  color: #004ea2;
  margin-top: 15px;
}
.boxHalloweenWrap .boxHalloweenWhite .title01 {
  font-size: 2.14rem;
  text-align: center;
  margin-bottom: 1rem;
  width: 607px;
}
.boxHalloweenWrap .boxHalloweenWhite .title01 span {
  display: block;
  font-size: 1.42rem;
  margin-bottom: 0.5em;
}
.boxHalloweenWrap .boxHalloweenWhite dl {
  display: flex;
  align-items: center;
}
.boxHalloweenWrap .boxHalloweenWhite dl:nth-child(n+2) {
  margin-top: 9px;
}
.boxHalloweenWrap .boxHalloweenWhite dl dt {
  font-size: 1.285rem;
  color: #fff;
  background-color: #004ea2;
  border-radius: 10em;
  width: 125px;
  height: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.boxHalloweenWrap .boxHalloweenWhite dl dd {
  font-size: 1.428rem;
  padding-left: 20px;
}
.boxHalloweenWrap .txt_border {
  background: linear-gradient(transparent 50%, #FFF70080 50%);
}
.boxHalloweenWrap .boxHalloweenWhite dl:nth-of-type(1) dd {
  font-size: 1.785rem;
}
.boxHalloweenWrap .btn_area {
  display: flex;
  justify-content: center;
  margin-top: 46px;
  width: 600px;
}
.boxHalloweenWrap .btn_area a {
  width: 60%;
  background-color: #004ea2;
  border-radius: 10em;
  color: #ffffff;
  position: relative;
  padding: 10px 0;
  background-image: url(https://catalina.ed.jp/wp-content/themes/catalina-hs/images/course/course01-icn-arrow01.png);
  background-repeat: no-repeat;
  background-position: 94% center;
  background-size: auto auto;
  padding-left: 55px;
}
.boxHalloweenWrap .btn_area a img {
  width: 73px;
  position: absolute;
  left: 29px;
  bottom: 3px;
  border:1px solid #004ea2;
}
.boxHalloweenWrap .btn_area a span:nth-of-type(1) {
  font-size: 1.5rem;
}
.boxHalloweenWrap .btn_area a span:nth-of-type(2) {
  display: block;
  font-size: 1.07rem;
}
.boxHalloweenWrap .btn_area a:nth-of-type(2) span {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.boxHalloweenWrap .img {
  width: 250px;
  position: absolute;
  right: 99px;
  top: 225px;
}
.boxHalloweenWrap .img img{width: 160px;display:block;margin:auto;}
.boxHalloweenWrap .img p {
  position: absolute;
  top: 205px;
  z-index: 3;
  border-radius: 10em;
  width: 100%;
  color: #004ea2;
  background-color: #fff;
  border: 1px solid #004ea2;
  padding: 0.5rem;
  text-align: center;
}

/* 外側（青い枠） */
.boxHalloweenWrap .img p::before {
  content: "";
  position: absolute;
  top: -19px; /* 本体からの距離 */
  left: 50%;
  transform: translateX(-50%);
  border-width: 0 19px 19px 19px; /* ←三角を大きく */
  border-style: solid;
  border-color: transparent transparent #004ea2 transparent;
  z-index: 2;
}

/* 内側（白背景） */
.boxHalloweenWrap .img p::after {
  content: "";
  position: absolute;
  top: -17px; /* beforeより1px下 */
  left: 50%;
  transform: translateX(-50%);
  border-width: 0 17px 17px 17px; /* 外側より1px小さくして枠を細く */
  border-style: solid;
  border-color: transparent transparent #fff transparent;
  z-index: 3;
}

.boxHalloweenWrap .btn_area .txt_border {
  background: linear-gradient(transparent 25%, #FFF70080 0%);
}
.boxHalloweenWrap .boxHalloweenWhite dl:nth-of-type(1) dd br {
  display: none;
}

#web_syutugan .examinfo2025Boxes{display:flex;margin-top: 15px;}

#web_syutugan .examinfo2025Boxes div{height:auto;margin: 0 auto;/* display: flex; */padding: 0px;}
#web_syutugan .box_2025suisen h3,
#web_syutugan .box_2025ippan h3{font-size: 1.8rem;padding: 10px;}
#web_syutugan .about p.day{display:flex;margin: auto;padding: 10px;align-content: center;align-items: center;}
#web_syutugan .about p.day span.title{margin:0;padding: 10px;width: 8rem;position: inherit;display: inline-block;vertical-align: middle;}
.activeLearning2025Box p.day span:nth-of-type(2){font-size: 1rem;}
@media only screen and (max-width:1470px) and (min-width:751px) {
  .boxHalloweenWrap .boxHalloweenTitile span.redBox{
    padding:0.5rem;
    bottom:0px;
}
  .boxHalloweenWrap .boxHalloweenTitile span{
    font-size:2rem;
  }
  .boxHalloweenWrap .p01,
 .boxHalloweenWrap .p02{
    font-size:1.2rem;
   text-align:left;
   padding-left:2%;
   width:65%;
   margin-top: 0rem;
  }
   .boxHalloweenWrap .img {
    /* width: 211px; */
    position: absolute;
    right: 85px;
    top: 210px;
  }
  .boxHalloweenWrap .img img{
    width: 60%;
  }
   .boxHalloweenWrap .btn_area{
    width:65%;
  }
  .boxHalloweenWrap .img p {
     top: 189px;
  }   
  .boxHalloweenWrap .btn_area a{
     width:80%;
}
  .boxHalloweenWrap .btn_area a span:nth-of-type(1){
font-size:1.3rem;
  }
  .boxHalloweenWrap .p01 br{
display:none;
  }
  .boxHalloweenWrap .boxHalloweenTitile {
    font-size: 2.5rem;
  }  
}
@media only screen and (max-width: 1423px) and (min-width: 750px){
#web_syutugan .box_2025ippan{
margin:0 auto!important;}
}
@media only screen and (max-width:1410px) and (min-width:751px) {
    .boxHalloweenWrap .img {
    /* width: 211px; */
    position: absolute;
    right: 85px;
    top: 210px;
  }
     .boxHalloweenWrap .img p {
     top: 207px;
      position:inherit;
      display:block;
  }
       .boxHalloweenWrap .img p::before,
            .boxHalloweenWrap .img p::after{
              display: none;
            }
  #web_syutugan .about p.day{
    flex-direction:column;
    width:100%;
  }
  #web_syutugan .about p.day span.title{
   width:100%;
    display:block;
    padding:5px;
    margin-bottom:5px;
    border-radius:999px;
  }
}
@media only screen and (max-width:1200px) and (min-width:751px) { 
  .boxHalloweenWrap .btn_area a:nth-of-type(1) img {
    
  }
  .boxHalloweenWrap .btn_area a:nth-of-type(1) {
    padding-left: 2rem;
  }
  .boxHalloweenWrap .btn_area a:nth-of-type(2) {
    padding-left: 0.5rem;
  }
  .boxHalloweenWrap .btn_area a:nth-of-type(2) span {
    /*
    background-image: url("../../images/index/halloween2025/ico-instagram.png");
    background-repeat: no-repeat;
    background-position: 3% center;
    background-size: 1.2em;
    padding-left: 2em;
    */
    display: inline-flex;
  }
  .boxHalloweenWrap .btn_area a:nth-of-type(2) span:nth-of-type(1) {
    font-size: 0.8rem;
    padding-left: 2.4em;
  }
  .boxHalloweenWrap .btn_area a img {
    width: 60px;
    left: 11px;
  }
  .boxHalloweenWrap .img {
    width: 210px;
    position: absolute;
    right: 75px;
    top: 215px;
    }
  .boxHalloweenWrap .boxHalloweenTitile{
line-height:3rem;
  }
    .boxHalloweenWrap .img p {
     top: 162px;
  }
  .boxHalloweenWrap .boxHalloweenWhite{
margin-top:1rem;
  }
  .boxHalloweenWrap .boxHalloweenTitile span.redBox{
    font-size:1.8rem;
    padding:0rem 0.8rem;
    margin-bottom:1rem;
  }
  #web_syutugan .examinfo2025Boxes{
margin-top:30px;
}
}

/* @media only screen and (max-width:1180px) and (min-width:751px) { 
  .boxHalloweenWrap .boxHalloweenWhite dl:nth-of-type(1) dd br {
    display: block;
  }
  .boxHalloweenWrap .img .dPc {
    display: none!important;
  }
  .boxHalloweenWrap .img .dSp {
    display: block!important;
  }
  .boxHalloweenWrap .img {
        width: 240px;
        position: absolute;
        right: 58px;
        top: 204px;
    }
  .boxHalloweenWrap .img img{
    top: 250px;
    }
  .boxHalloweenWrap .p01 {
    margin-bottom: 1.2em;
  }
  .boxHalloweenWrap .activeLearning2025Box {
    min-height: 671px;
  }
 
  .boxIndexTop .ulTopSlide {
    overflow: visible;
  }
} */


@media only screen and (max-width:750px) {
  .boxHalloweenWrap .activeLearning2025Box {
    width: 100%;
    padding: 0 5% 5% 5%;
    min-height: auto;
  }
  .boxHalloweenWrap .boxHalloweenTitile {
    width: 100%;
    font-size: 9vw;
    margin-bottom: 1rem;
    line-height:2.8rem;
    text-align: center;
  }
  .boxHalloweenWrap .boxHalloweenTitile small{
     font-size: 5.5vw;
  }
  .boxHalloweenWrap .boxHalloweenTitile span.redBox{
    font-size: 5vw;
    padding: 1vw 2vw;
    margin-right:5px;
    bottom:0px;
    margin-bottom: 20px;
    text-align: center;
}
  .boxHalloweenWrap .boxHalloweenTitile span {
    font-size: 6vw;
    padding-bottom:1rem;
  }
  .boxHalloweenWrap .p01,
  .boxHalloweenWrap .p02{
   width:100%;
    font-size:1.2rem;
    text-align:left;
  }
  .boxHalloweenWrap .boxHalloweenWhite {
    padding: 6%;
  }
  .boxHalloweenWrap .boxHalloweenWhite .title01 {
    width: 100%;
    font-size: 4.71vw;
  }
  .boxHalloweenWrap .boxHalloweenWhite .title01 span {
    font-size: 2.85vw;
  }
  .boxHalloweenWrap .boxHalloweenWhite dl dt {
    font-size: 2.8vw;
    width: 5.5em;
    height: 1.8em;
    padding-top: 1px;
  }
  .boxHalloweenWrap .boxHalloweenWhite dl dd {
    font-size: 3.42vw;
    width: calc(100% - 6em);
    text-align: left;
    padding-left: 10px;
  }
  .boxHalloweenWrap .boxHalloweenWhite dl:nth-of-type(1) dd {
    font-size: 4.4vw;
    line-height: 1.21;
  }
  .boxHalloweenWrap .btn_area {
    display: block;
    width: 100%;
    margin-top: 3.5vw;
  }
  .boxHalloweenWrap .btn_area a {
    width: 100%;
    display: block;
    background-size:2em;
    background-position: 95% center;
  }
  .boxHalloweenWrap .btn_area a span:nth-of-type(1) {
    font-size: 5vw;
  }
  .boxHalloweenWrap .btn_area a span:nth-of-type(2) {
    font-size: 2.14vw;
  }
  .boxHalloweenWrap .btn_area a img {
    display: none;
  }
  .boxHalloweenWrap .btn_area a:nth-of-type(1) {
    padding-left: 0;
    margin-bottom: 0.6rem;
  }
  .boxHalloweenWrap .btn_area a:nth-of-type(2) {
    padding-left: 0;
    height: 8.52vw;
  }
  .boxHalloweenWrap .btn_area a:nth-of-type(2) span {
    background-image: url("../../images/index/halloween2025/ico-instagram.png");
    background-repeat: no-repeat;
    background-position: 3% center;
    background-size: 1.2em;
    padding-left: 2em;
    display: inline-flex;
    letter-spacing: 0;
  }
  .boxHalloweenWrap .img,
  .boxHalloweenWrap .img p{
      position:inherit;
      display:block;
      width: 100%;
  }
  .boxHalloweenWrap .img{
margin-top:40px;
  }
  .boxHalloweenWrap .img p{
    margin: 0.5em auto;
}
  .boxHalloweenWrap .boxHalloweenWhite dl:nth-of-type(1) dd br {
    display: block;
  }
    #web_syutugan > p{
font-size:8vw;
    margin-top:9vw;
    text-shadow: 2px 2px 20px #004ea2;
    }
  #web_syutugan .examinfo2025Boxes,
  #web_syutugan .about p.day{
flex-direction:column;
  }
   #web_syutugan .about p.day{
     gap:0.5rem;
     background-color: white;
     width: 90%;
     border-radius: 20px;
     margin-top: 10px;
     margin-left:5%;
}
  .activeLearning2025Box p.day span:nth-of-type(2){
    color: #004ea2;
  }
  #web_syutugan .examinfo2025Boxes div{
    margin-bottom:1rem!important;
  }
  #web_syutugan .about p.day span.title{display:block;width:100%;font-size: 4.56vw;border-radius: 999px;/* background-color: white; *//* color: #064ea5; */}
         .boxHalloweenWrap .img p::before,
            .boxHalloweenWrap .img p::after{
              display: none;
            }
}