@charset "UTF-8";

/* ↓PC（横幅640px超）の場合 */
html {
  /* 1rem = 1pxと定義 */
  font-size: 1px;
}

/* ↓スマホ（横幅640px以上）の場合 */


@media screen and (max-width: 640px) {
  html {
    /* 1rem = 1.5pxと再定義 */
    font-size: .80px;
  }

}

body {
  font-size: 16rem;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  min-width: 375px;
  position: relative;
  margin: 0 auto;
}

.en {
  font-family: 'Poppins', sans-serif;
}



/*fv
================================================*/

#fv {
  margin-bottom: calc(100px + 8em);
  position: relative;
}

#fv::before {
  content: "";
  display: block;
  width: 100%;
  padding-top: 102%;
  background: url(../../images/2025/bg_fv.png) center center no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
}

#fv_inner {
  position: relative;
  z-index: 10;
  max-width: calc(752px + 10%);
  padding: 0 5%;
  margin: 0 auto;
}


#fv h1 {
  padding-top: 10em;
  font-size: 16rem;
  margin: 0 0 -15%;
}

#fv h1 img {
  width: 100%;
  height: auto;
}

#date_fv {
  font-size: 55rem;
  font-weight: 900;
  font-style: italic;
  text-align: center;
  vertical-align: middle;
  color: #0C4AAE;
  margin: 0 0 1.3em;
}

#date_fv span {
  font-size: 18rem;
}

#date_fv i img {
  vertical-align: middle;
  padding: 0 .25em;
}


@media screen and (max-width:500px) {
  #date_fv {
    font-size: 41.25px;
  }

  #date_fv span {
    font-size: 13.5px;
  }
}

#txt_fv h2 {
  color: #0C4AAE;
  font-size: 34rem;
  font-weight: 900;
  text-align: center;
  margin: 0 0 .7em;
}

#txt_fv h2 span {
  display: inline-block;
  margin: 0 0 .25em;
  line-height: 1.5;
}

#txt_fv p {
  font-weight: 500;
  text-align: center;
  color: #353535;
  line-height: 1.5;
  font-size: 18rem;
}



@media screen and (max-width:500px) {
  #txt_fv h2 {
    font-size: 24px;
  }

  #txt_fv p {
    font-size: 16px;
  }

  #fv::before {
    padding-top: 255%;
    background: url(../../images/2025/bg_fv_s.png) center center no-repeat;
    background-size: cover;

  }
}

@media screen and (max-width:470px) {
  #txt_fv h2 {
    font-size: 24px;
  }

  #fv {
    margin-bottom: 118px;
  }

}

/*studentsworks
================================================*/

.bg_works_01 {
  width: 100%;
  padding-top: 48%;
  background: url(../../images/2025/bg_works.png) center center no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-67%);
}



.bg_works_03 {
  width: 15.34%;
  padding-top: 30%;
  background: url(../../images/2025/bg_works_03.png) center center no-repeat;
  background-size: cover;
  position: absolute;
  bottom: 0;
  left: 0;
  transform: translateY(73%);
  z-index: 1;
}

.bg_works_04 {
  width: 10.44%;
  padding-top: 49%;
  background: url(../../images/2025/bg_works_04.png) center center no-repeat;
  background-size: cover;
  position: absolute;
  bottom: 0;
  right: 0;
  transform: translateY(35%);
  z-index: 1;
}


#studentsworks {
  background: #0AAB93;
  position: relative;
  z-index: 21;
}


#studentsworks::before {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  padding: 5%;
  background: url(../../images/2025/bg_t.png) center center no-repeat;
  background-size: cover;
  top: 0;
  transform: translateY(-99.5%);
}

/*
#studentsworks::after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    padding: 5%;
    background: url(../../images/2025/bg_b.png) center center no-repeat;
    background-size: cover;
    bottom: 0;
    transform: translateY(99.5%);
}
*/
.studentsworks_inner {
  max-width: calc(1160px + 10%);
  margin: 0 auto 0;
  padding: 0 5%;
  position: relative;
  z-index: 5;
}

#archive2023 .inner {
  max-width: calc(752px + 10%);
  padding: 0 5%;
  margin: 0 auto 110px;
}

#studentsworks h2,
#contact h2,
#archive2023 h2,
#contactform h2 {
  margin: 0 0 5em;
}

#studentsworks h2 span,
#contact h2 span,
#archive2023 h2 span,
#contactform h2 span {
  display: block;
  text-align: center;
  font-weight: 900;
  color: #fff;
  line-height: 1;
  position: relative;
}

#archive2023 h2 span {
  color: #0C4AAE;
}

#archive2023 h2+p,
#contactform h2+p {
  font-size: 18rem;
  line-height: 1.8;
  margin: 0 0 1.5em;
  text-align: center;

}

#studentsworks h2 span:nth-of-type(1),
#contact h2 span:nth-of-type(1),
#archive2023 h2 span:nth-of-type(1),
#contactform h2 span:nth-of-type(1) {
  font-size: 80rem;
  color: #0AAB93;
  text-shadow: 1px 1px 0px rgba(255, 255, 255, .5), -1px 1px 0px rgba(255, 255, 255, .5), 1px -1px 0px rgba(255, 255, 255, .5), -1px -1px 0px rgba(255, 255, 255, .5);
  transform: translateY(50%);
  z-index: 1;
}

#archive2023 h2 span:nth-of-type(1) {
  color: #fff;
  text-shadow: 1px 1px 0px rgba(12, 74, 174, .5), -1px 1px 0px rgba(12, 74, 174, .5), 1px -1px 0px rgba(12, 74, 174, .5), -1px -1px 0px rgba(12, 74, 174, .5);
}

#studentsworks h2 span:nth-of-type(2),
#contact h2 span:nth-of-type(2),
#archive2023 h2 span:nth-of-type(2),
#contactform h2 span:nth-of-type(2) {
  font-size: 56rem;
  z-index: 2;
  margin: 0 0 .5em;
}

#studentsworks h2 span:nth-of-type(3),
#contact h2 span:nth-of-type(3),
#archive2023 h2 span:nth-of-type(3),
#contactform h2 span:nth-of-type(3) {
  font-size: 30rem;
}

#flow {
  margin: 0 auto 80px;
}

#flow ol {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto 60px;
}

#flow ol>li {
  display: flex;
  flex-direction: column;
  width: calc((100% - 32px*3)/4);
  background: #fff;
  border-radius: 24px;
  padding: 24px;
  margin: 0 32px 0 0;
}

#flow ol>li:nth-of-type(2n-1) {
  transform: translateY(-32px);
}

#flow ol>li:nth-of-type(4n) {
  margin: 0;
}

#flow ol>li img {
  width: 100%;
  height: auto;
}

#flow ol>li figure {
  width: 78.9%;
  margin: 0 auto 16px;
}

#flow ol>li h3 {
  color: #0C4AAE;
  text-align: center;
  font-weight: 900;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin: 0 0 .5em;
}

#flow ol>li h3 span {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

#flow ol>li h3 span:nth-of-type(1) {
  font-size: 36rem;
}

#flow ol>li h3 span:nth-of-type(2) {
  font-size: 20rem;
  padding-left: .5em;
}

#flow ol>li p {
  font-size: 16rem;
  line-height: 1.7;
  color: #353535;
}

#flow ol+p {
  font-size: 18rem;
  text-align: center;
  margin: 0 auto 1.5em;
  line-height: 1.7;
  color: #fff;
}

@media screen and (max-width:950px) {

  #studentsworks h2 span:nth-of-type(1),
  #contact h2 span:nth-of-type(1),
  #archive2023 h2 span:nth-of-type(1),
  #contactform h2 span:nth-of-type(1) {
    font-size: 60rem;
  }

  #studentsworks h2 span:nth-of-type(2),
  #contact h2 span:nth-of-type(2),
  #archive2023 h2 span:nth-of-type(2),
  #contactform h2 span:nth-of-type(2) {
    font-size: 42rem;
  }

  #studentsworks h2 span:nth-of-type(3),
  #contact h2 span:nth-of-type(3),
  #archive2023 h2 span:nth-of-type(3),
  #contactform h2 span:nth-of-type(3) {
    font-size: 22.5rem;
  }

  #flow ol>li {
    width: calc((100% - 32px*1)/2);
    margin: 0 32px 32px 0;
  }

  #flow ol>li:nth-of-type(2n-1) {
    transform: translateY(0);
  }

  #flow ol>li:nth-of-type(2n),
  #flow ol>li:nth-of-type(4n) {
    margin: 0 0 32px;
  }
}

@media screen and (max-width:750px) {

  #studentsworks h2 span:nth-of-type(1),
  #contact h2 span:nth-of-type(1),
  #archive2023 h2 span:nth-of-type(1),
  #contactform h2 span:nth-of-type(1) {
    font-size: 56px;

  }

  #studentsworks h2 span:nth-of-type(2),
  #contact h2 span:nth-of-type(2),
  #archive2023 h2 span:nth-of-type(2),
  #contactform h2 span:nth-of-type(2) {
    font-size: 36px;
  }

  #studentsworks h2 span:nth-of-type(3),
  #contact h2 span:nth-of-type(3),
  #archive2023 h2 span:nth-of-type(3),
  #contactform h2 span:nth-of-type(3) {
    font-size: 21px;
  }
}

#archive2023 h2 {
  margin-bottom: 2.5em;
}

@media screen and (max-width:450px) {
  #hidden_box {
    overflow: hidden;
  }

  #studentsworks h2,
  #works h2 {
    width: calc(100% + 10%) !important;
    margin: 0 auto 2.5em !important;
    overflow: hidden;
    padding-top: 55px;
  }

  #studentsworks #flow h2 span:nth-of-type(1),
  #studentsworks #works h2 span:nth-of-type(1) {
    font-size: 56px;
    white-space: nowrap;
    position: absolute;
    left: 50%;
    transform: translateX(-50%) translateY(-55%);
    ;
  }

  #studentsworks #flow h2 span:nth-of-type(2),
  #studentsworks #works h2 span:nth-of-type(2),
  #studentsworks #flow h2 span:nth-of-type(3),
  #studentsworks #works h2 span:nth-of-type(3) {
    width: 100%;
    left: -5%;
  }

  #studentsworks h2 span:nth-of-type(2),
  #contact h2 span:nth-of-type(2),
  #archive2023 h2 span:nth-of-type(2),
  #contactform h2 span:nth-of-type(2) {
    font-size: 36px;
  }

  #studentsworks h2 span:nth-of-type(3),
  #contact h2 span:nth-of-type(3),
  #archive2023 h2 span:nth-of-type(3),
  #contactform h2 span:nth-of-type(3) {
    font-size: 24px;
    line-height: 1.4;
    font-weight: 900;
  }

  .bg_works_01 {
    padding-top: 52%;
    background: url(../../images/2025/bg_works_s.png) center center no-repeat;
    background-size: cover;
    transform: translateY(-67%);
  }

  #flow ol {
    margin: 0;
  }

  #flow ol>li {
    width: calc((100%)/1);
    margin: 0 0 16px;
    padding: 24px 16px;
    border-radius: 16px;
  }

  #flow ol>li:nth-of-type(2n-1) {
    transform: translateY(0);
  }

  #flow ol>li:nth-of-type(2n),
  #flow ol>li:nth-of-type(4n) {
    margin: 0 0 16px;
  }

  #flow ol ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }

  #flow ol ul>li {
    display: flex;
    flex-direction: column;
  }

  #flow ol ul>li:nth-of-type(1) {
    width: 33.8%;
  }

  #flow ol ul>li:nth-of-type(2) {
    width: 60.6%;
  }

  #flow ol>li h3 {
    margin: 0 0 16px;
    justify-content: left;
  }

  #flow ol>li h3 span:nth-of-type(1) {
    font-size: 36px;
  }

  #flow ol>li h3 span:nth-of-type(2) {
    font-size: 20px;
  }

  #flow ol>li p {
    font-size: 14px;
    line-height: 1.7;
  }

  #flow ol>li p a {
    text-decoration: underline !important;
  }

  #flow ol+p {
    font-size: 18px;
  }

  #contact {
    margin-bottom: 80px !important;
  }

  #archive2023 h2+p {
    font-size: 18px;
  }

  #studentsworks h2,
  #contact h2,
  #archive2023 h2,
  #contactform h2 {
    margin: 0 0 2.5em;
  }

  #archive2023 .inner {
    margin-bottom: 80px !important;
  }

  #flow ol>li figure {
    width: 100%;
    margin: 0;
  }

}


.youtube_wrap {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
}

.youtube_modal {
  display: block;
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding-top: 56.25%;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid #2C66B1;
}


.youtube_modal::after {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  background: url(../../images/2025/ico_play.png) center center no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}


.dammy .youtube_modal::after {
  display: none;
}

.youtube_modal iframe,
.youtube_modal a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}

.youtube_modal img {
  display: block;
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
}

.card_work {
  display: flex;
  flex-wrap: wrap;
}

.card_work li {
  display: flex;
  flex-direction: column;
  width: calc((100% - 1.25% * 8) / 4);
  margin: 0 1.25% 3em;
}

@media screen and (max-width:950px) {
  .card_work li {
    width: calc((100% - 1.25% * 6) / 3);
  }
}

@media screen and (max-width:750px) {
  .card_work li {
    width: calc((100% - 1.25% * 4) / 2);
  }
}

@media screen and (max-width:450px) {
  .card_work li {
    width: calc((100% - 1.25% * 2) / 1);
    margin-bottom: 44px;
  }
}

.card_cat {
  position: relative;
}

.card_cat.is-hide {
  display: none;
}



.card_work h3 {
  font-size: 16rem;
  font-weight: 500;
  color: #fff;
  text-align: center;
  margin: .75em 0;
}

.card_work .txt_cat {
  color: #fff;
  font-size: 12px;
  text-align: center;
}

.card_work .txt_cat span {
  display: inline-block;
  padding: 2px 24px;
  line-height: 1.7;
  border-radius: 16px;
  border: 1px solid #fff
}

.card_work .txt_area {
  font-weight: 500;
  font-size: 14px;
  text-align: center;
  margin: 0 0 16px;
  color: #fff;
}

.btn_c a,
.btn_a a {
  display: block;
  width: 93%;
  margin: 0 auto 1.3em;
  color: #fff;
  font-size: 16rem;
  font-weight: 500;
  text-align: center;
  border: 2px solid #fff;
  border-radius: 32px;
  padding: .75em;
  line-height: 1;
  box-shadow: 0.3em 0.3em 0 #fff;
  transition: .3s;
}

.btn_c a:hover,
.btn_a a:hover {
  opacity: .5;
}

.btn_c a:hover,
.btn_a a:hover,
.btn_c a:active,
.btn_a a:active {
  box-shadow: 0.1em 0.1em 0 #fff;
  transform: translateY(0.1em) translateX(0.1em);

}

.btn_c a {
  background: #0C4AAE;
}

.btn_a a {
  background: #EF9D5B;
}

.search-box {
  text-align: center;
  margin: 0 0 0px;
}

.search-box li {
  display: inline-block;
  margin: 0 .5em 2em;
}

.search-box input {
  display: none;
}

.search-box label {
  font-weight: 400;
  font-size: 14rem;
  cursor: pointer;
  color: #fff;
  border: 1px solid #0C4AAE;
  border-radius: 32px;
  line-height: 1;
  padding: .25em 2em .35em;
  text-align: center;
  transition: .3s;
  background: #0C4AAE;
}

.search-box label:hover {
  opacity: .5;
}

.search-box .checked-label {
  /* ここにラジオボタンがチェックされたときのスタイルを指定します */
  /* 例: バックグラウンドカラーやフォントの色を変更 */
  background-color: #fff;
  color: #0C4AAE;
  border: 1px solid #0C4AAE;
}

.lity {
  background: rgba(12, 74, 174, .9);
  z-index: 9999;
}

.lity-close,
.lity-close:hover {
  position: fixed;
  top: 40px;
  right: 40px;
  width: 60px;
  height: 60px;
  padding-top: 60px;
  overflow: hidden;
  background: url(../../images/2025/nav_c.png) center center no-repeat;
  background-size: cover;
  cursor: pointer;
  transform: translateX(0%) translateY(0%) !important;
}


@media screen and (min-width:1200px) {

  .lity-close,
  .lity-close:hover {
    transform: translateX(881%) translateY(-535%);
  }

  .lity-close:hover {
    transform: translateX(881%) translateY(-535%) scale(120%);
  }
}

@media screen and (max-width:1199px) {



  .lity-close:hover {
    transform: translateX(0) translateY(0) scale(120%);
  }
}

@media screen and (max-width:500px) {
  .card_work h3 {
    font-size: 16px;
  }

  .lity-close,
  .lity-close:hover {
    position: fixed;
    top: 16px;
    right: 12px;
  }
}

@media screen and (max-width:470px) {
  .card_work h3 {
    font-size: 20px;
    margin: 16px 0;
  }

  .btn_c a,
  .btn_a a {
    font-size: 16px;
  }

  .search-box label {
    font-size: 13px;
  }

  .search-box {
    text-align: left;
    margin: 0 0 20px;
  }
}

/*company
================================================*/

.bg_company_01 {
  content: "";
  display: block;
  width: 100%;
  padding-top: 90%;
  background: url(../../images/2025/bg_company_01.png) center center no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  transform: translateY(-75%);
  z-index: 1;
}

#participatingcompany {
  position: relative;
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 64.9%, rgba(0, 48, 71, 1) 64.9%, rgba(0, 48, 71, 1) 100%);
  z-index: 2;
}

#participatingcompany::before {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  padding: 5%;
  background: url(../../images/2025/bg_t.png) center center no-repeat;
  background-size: cover;
  top: 65%;
  transform: translateY(-100%);
}

.participatingcompany_inner {
  max-width: calc(1160px + 10%);
  padding: 4em 5%;
  margin: 0 auto;
  position: relative;
  z-index: 10;
}

#participatingcompany h2 {
  margin: 0 0 5em;
}

#participatingcompany h2 span {
  display: block;
  text-align: center;
  font-weight: 900;
  color: #0C4AAE;
  line-height: 1;
  position: relative;
}

#participatingcompany h2 span:nth-of-type(1) {
  font-size: 80rem;
  color: #fff;
  text-shadow: 1px 1px 0px rgba(0, 48, 71, 1), -1px 1px 0px rgba(0, 48, 71, 1), 1px -1px 0px rgba(0, 48, 71, 1), -1px -1px 0px rgba(0, 48, 71, 1);
  transform: translateY(35%);
  z-index: 1;
}

#participatingcompany h2 span:nth-of-type(2) {
  font-size: 56rem;
  z-index: 2;
  margin: 0 0 .1em;
}

#participatingcompany h2 span:nth-of-type(3) {
  font-size: 30rem;
}



@media screen and (max-width:1119px) {
  #participatingcompany h2 span:nth-of-type(1) {
    font-size: 60rem;
  }

  #participatingcompany h2 span:nth-of-type(2) {
    font-size: 42rem;
  }

  #participatingcompany h2 span:nth-of-type(3) {
    font-size: 22.5rem;
  }

}

@media screen and (max-width:850px) {
  #participatingcompany h2 span:nth-of-type(1) {
    font-size: 45rem;
  }

  #participatingcompany h2 span:nth-of-type(2) {
    font-size: 31.5rem;
  }

  #participatingcompany h2 span:nth-of-type(3) {
    font-size: 16.875rem;
  }

}

@media screen and (max-width:515px) {
  #participatingcompany h2 span:nth-of-type(1) {
    font-size: 33.75rem;
  }

  #participatingcompany h2 span:nth-of-type(2) {
    font-size: 23.625rem;
  }

  #participatingcompany h2 span:nth-of-type(3) {
    font-size: 16.875rem;
  }

}

.box {
  border: 4px solid #0C4AAE;
  border-radius: 32px;
  padding: 2.5em 0;
  background: #fff;
}

.box ul {
  text-align: center;
}

.box li {
  display: inline-block;
  margin: 0 2.5em 2.5em;
  font-size: 16rem;
  font-weight: 500;
  color: #0C4AAE;
}

.box p {
  margin: 0 4em 0 0;
  font-size: 12rem;
  font-weight: 500;
  color: #0C4AAE;
  text-align: right;
}


/*contact
================================================*/
#contact {
  background: #0AAB93;
  position: relative;
  z-index: 21;
  margin: 0 auto 10%;
}

.contact_col_inner {
  max-width: calc(1160px + 10%);
  margin: 0 auto;
  padding: 0 5% 4em;
  text-align: center;
  color: #fff;
  position: relative;
  z-index: 10;
}

#contact h2 {
  margin-bottom: 2.5em;
}


#contact p {
  font-size: 18rem;
  font-weight: 500;
  margin: 0 auto 2.5em;
}


.btn_cta {
  margin: 0 auto;
  max-width: 375px;
}

.btn_cta a {
  display: block;
  font-weight: 600;
  font-size: 20rem;
  border: 2.5px solid #fff;
  color: #fff;
  text-align: center;
  border-radius: 18px;
  padding: 24rem 0;
  max-width: 300px;
  box-shadow: 0.3em 0.3em 0 #fff;
  transition: .3s;
  background: #0C4AAE;
  transform: translateX(-.15em);
  margin: 0 auto;
}

#archive2023 .btn_cta a {
  border: 2.5px solid #152F58;
  box-shadow: 0.3em 0.3em 0 #152F58;
}

.btn_cta a:hover {
  opacity: .5;
}

.btn_cta a:hover,
.btn_cta a:active {
  box-shadow: 0.1em 0.1em 0 #fff;
  transform: translateY(0.1em) translateX(0.1em);
}

.bg_contact_01 {
  content: "";
  display: block;
  width: 42%;
  padding-top: 32%;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-40%);
  background: url(../../images/2025/bg_contact_01.png) center center no-repeat;
  background-size: cover;
  z-index: 4;
}

.bg_contact_02 {
  content: "";
  display: block;
  width: 100%;
  padding-top: 57%;
  position: absolute;
  bottom: 0;
  transform: translateY(45%);
  background: url(../../images/2025/bg_contact_02.png) center center no-repeat;
  background-size: cover;
  z-index: 6;
  pointer-events: none;
}

.bg_contact_03 {
  content: "";
  display: block;
  width: 100%;
  padding-top: 15%;
  position: absolute;
  bottom: 0;
  transform: translateY(29%);
  background: url(../../images/2025/bg_b.png) center center no-repeat;
  background-size: cover;
  z-index: 1;
}

#archive2023 {
  position: relative;
  z-index: 20;
}

@media screen and (max-width:640px) {
  .bg_contact_01 {
    transform: translateY(-100%);
  }

  #contact p {
    font-size: 18px;
    line-height: 1.7;
    margin: 0 auto 24px;
  }

  .contact_col_inner {
    padding: 0 5% 90px;
  }

  .bg_contact_02 {
    padding-top: 82%;
    transform: translateY(39%);
    background: url(../../images/2025/bg_contact_02_s.png) center center no-repeat;
    background-size: cover;
    pointer-events: none;
  }
}

/*info
================================================*/

#info {
  position: relative;
}

.bg_info_04 {
  content: "";
  display: block;
  width: 32%;
  padding-top: 86%;
  position: absolute;
  right: 0;
  top: 0;
  transform: translateY(-85%);
  background: url(../../images/2025/bg_info_04.png) center center no-repeat;
  background-size: cover;
  z-index: 1;
  pointer-events: none;
}

.info_col_inner {
  max-width: calc(882px + 10%);
  margin: 0 auto;
  padding: 0 5% 80px;
  position: relative;
  z-index: 10;
}

.col_03 {
  display: flex;
  flex-wrap: wrap;
  max-width: 544px;
  padding: 32px;
  margin: 0 auto;
  background: #fff;
  border-radius: 48px;
  justify-content: center;
}

.col_03 li {
  display: flex;
  flex-direction: column;
  width: calc(100% / 2);
  text-align: center;
}

.col_03 li img {
  width: 100%;
  height: auto;
}

.col_03 li:nth-of-type(1) img {
  width: 53%;
  padding: 10% 0 0;
}

.col_03 li:nth-of-type(2) img {
  width: 69%;
  padding: 20% 0 0;
}

.col_03 li:nth-of-type(3) img {
  width: 46.42%;
  padding: 10% 0 0;
}

.col_03 li h3 {
  font-weight: bold;
  font-size: 18rem;
  color: #0C4AAE;
  margin: 0 0 1em;
}

@media screen and (max-width:420px) {
  .col_03 li:nth-of-type(2) img {
    padding: 0;
  }

  .col_03 li {
    width: 100%;
    margin: 0 0 5em;
  }

  .btn_cta,
  .btn_cta a {
    max-width: 100% !important;
    font-size: 20px;
  }

  .bg_info_04 {
    width: 22.2%;
    padding-top: 50%;
    transform: translateY(-65%);
    background: url(../../images/2025/bg_info_04_s.png) center center no-repeat;
    background-size: cover;
  }

  .info_col_inner {
    margin-bottom: 40px !important;
    padding-bottom: 0 !important;
  }

  .col_03 li h3 {
    font-size: 18px;
  }

  .col_03 li:nth-of-type(1) img {
    padding: 0;
  }

  .col_03 li:nth-of-type(2) img {
    padding: 8% 0 0;
  }
}

/*note_col
================================================*/
#note_col {
  max-width: calc(882px + 10%);
  padding: 0 5%;
  margin: 0 auto 0;
  position: relative;
  z-index: 50;
}

#note_col h3 {
  font-weight: bold;
  font-size: 24rem;
  color: #fff;
  margin: 0 0 1em;
  text-align: center;
}

#note_col ul {
  padding: 0 0 0 1.5em;
}

#note_col li {
  list-style-type: disc;
  margin: 0 0 .5em;
  line-height: 1.5;
  color: #fff;
  font-size: 16rem;
}

#note_col li a {
  color: #fff;
}

#note_col li:nth-last-of-type(1) {
  margin: 0;
}

#note_col a {
  color: #148BFA;
  text-decoration: underline;
}

@media screen and (max-width:420px) {
  #note_col h3 {
    font-size: 18px;
    margin: 0 0 24px;
  }

  #note_col li {
    font-size: 14px;
  }
}

/*footer
================================================*/

#colophon {
  width: 100%;
  font-size: 14rem;
  background: #0AAB93;
  padding: 1.5em 5%;
}

#colophon p {
  text-align: center;
  color: #fff;
  font-size: 14rem;
}

.bk_b {
  background: #0C4AAE;
  padding: 80px 0 80px;
}

@media screen and (max-width:420px) {
  #colophon {
    font-size: 14px;
  }

  html {
    margin-top: 0 !important;
  }
}


/*nav
================================================*/
/* ===========================================
   ハンバーガーメニュー
   =========================================== */
#site-navigation {
  position: fixed !important;
  top: 0 !important;
  bottom: 0 !important;
  right: 0 !important;
  left: 0 !important;
  margin: auto !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(12, 74, 174, .9) !important;
  z-index: 7000 !important;
  transform: translate(100%) !important;
  transition: transform 0.3s ease !important;
}

#site-navigation.active {
  transform: translate(0%) !important;
}

#site-navigation ul {
  max-width: calc(1160px + 10%) !important;
  padding: 0 5% !important;
  margin: auto !important;
  font-size: 37.5rem !important;
  line-height: 1 !important;
  width: 100% !important;
  height: 9em !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  right: 0 !important;
  left: 0 !important;
}

#site-navigation li {
  position: relative !important;
}

#site-navigation li::after {
  content: "" !important;
  display: block !important;
  width: 62.5px !important;
  height: 2px !important;
  background: #fff !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  transform: translate(1px) !important;
}

#site-navigation a {
  display: block !important;
  font-weight: 900 !important;
  font-size: 37.5rem !important;
  line-height: 1 !important;
  padding: 1em 0 !important;
  color: #fff !important;
}

#btn_nav {
  position: fixed !important;
  top: 40px !important;
  right: 40px !important;
  width: 60px !important;
  height: 60px !important;
  background: url(../../images/2025/nav_o.png) center center no-repeat !important;
  background-size: 100% auto !important;
  z-index: 8000 !important;
  cursor: pointer !important;
}

#btn_nav.active {
  background: url(../../images/2025/nav_c.png) center center no-repeat !important;
  background-size: 100% auto !important;
}



@media screen and (max-width:640px) {
  #site-navigation {
    overflow-y: auto;
  }

  .bk_b {
    padding: 48px 0;
  }

  #site-navigation a {
    font-size: 30px;
    line-height: 1.4;
  }

  #site-navigation ul {
    font-size: 30px;
    height: 17em;
  }

  #btn_nav {
    position: fixed;
    top: 16px;
    right: 12px;
  }
}

/*お問い合わせページ
================================================*/
#contactform {
  background: #0AAB93;
  color: #fff;
  padding: 11.9em 0 80px;
  position: relative;
  z-index: 2;
}

.contactform_inner {
  max-width: calc(480px + 10%);
  padding: 0 5%;
  margin: 0 auto;
  position: relative;
  z-index: 10;
}

.bg_contact_top01 {
  content: "";
  display: block;
  width: 100%;
  padding-top: 28%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../../images/2025/contact_t.png) center center no-repeat;
  background-size: cover;
  z-index: 3;
}

.bg_contact_top02 {
  content: "";
  display: block;
  width: 45%;
  padding-top: 84%;
  position: absolute;
  top: 0;
  right: 0;
  background: url(../../images/2025/bg_contact_top02.png) center center no-repeat;
  background-size: cover;
  z-index: 3;
}

form.sent ul,
form.sent #privacy,
form.sent input[type="submit"] {
  display: none;
}



.contactform_inner>p {
  text-align: center;
  font-size: 18rem;
  font-weight: 500;
  line-height: 1.5;
  margin: 0 0 5em;
}

.entry-title {
  display: none;
}

#form {
  font-size: 16px;
  margin: 0 0 4.6em;
}

#form li {
  font-size: 16px;
  margin: 0 0 2.3em;
}

#form li span {
  display: block;
  line-height: 1.5;
  margin: 0 0 1.25em;
}

#form li span input,
#form li span select,
#form li span textarea {
  display: block;
  width: 100%;
  background: #fff;
  padding: 0.75em 1em;
  color: #0C4AAE;
  border: 1px solid #0C4AAE;
  border-radius: 16px;
}

#form li span select {
  max-width: 340px;
}

#form li span select::-ms-expand {
  display: none;
  /* デフォルトの矢印を非表示(IE用) */
}

#form li span select {
  -webkit-appearance: none;
  appearance: none;
  /* デフォルトの矢印を非表示 */
  background-image: url("../img/arrow_select.png");
  background-position: right 16px center;
  background-repeat: no-repeat;
  background-size: 22px 14px;
}

#form li span textarea {
  height: 280px;
}

#privacy .content {

  height: 260px;
  border: 1px solid #0C4AAE;
  padding: 32rem 16rem 32rem 20rem;
  color: #0C4AAE;
  border-radius: 16px;
  background: #fff;
  margin: 0 0 4.6em;

}

.mCS-my-theme.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #0C4AAE;
  width: 12px;
  opacity: 1 !important;
}

.mCS-my-theme.mCSB_scrollTools .mCSB_draggerRail {
  background-color: white;
}

#privacy h3 {
  text-align: center;
  font-size: 20rem;
  font-weight: 600;
  margin: 0 0 1.5em;
  line-height: 1.5;
}

#privacy>p {
  text-align: right;
  font-size: 14rem;
  font-weight: 400;
  line-height: 1.5;
  margin: 0 0 1.25em;
}

#privacy dt {
  font-size: 16rem;
  font-weight: 600;
  margin: 0 0 0.75em;
  line-height: 1.5;
}

#privacy dd {
  font-size: 14rem;
  font-weight: 400;
  margin: 0 0 1.5em;
  line-height: 2.5;
}

input[type="submit"] {

  display: block;
  margin: 0 auto;
  max-width: 300px;
  width: 93%;
  margin: 0 auto 1.3em;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  border: 2px solid #fff;
  border-radius: 18px;
  padding: .75em;
  line-height: 1;
  box-shadow: 0.3em 0.3em 0 #fff;
  transition: .3s;
  background: #0C4AAE;
}

.wpcf7-not-valid-tip {
  color: yellow;
}

/*bits
================================================*/

.pc_none {
  display: none !important;
}


.sp_none {
  display: block !important;
}


@media screen and (max-width:640px) {
  .pc_none {
    display: block !important;
  }

  .sp_none {
    display: none !important;
  }

  .inline {
    display: inline !important;
  }
}

/*
@media screen and (max-width:640px) {
  dl {
    display: flex;
    flex-wrap: wrap;
  }
  dt,
  dd {
    display: flex;
    flex-direction: column;
  }
}
*/

.card-content {
  position: relative;
  margin-top: 6px;
  padding-top: 12px;
}


/* ===========================================
   いいね機能のスタイル
   =========================================== */
.like-wrapper {
  display: flex;
  flex-direction: column;
  width: 35px;
  justify-content: right;
  gap: 3px;
  position: absolute;
  right: 0;
  top: 0;
}

.like-button {
  width: 35px;
  height: 35px;
  padding: 0;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  justify-content: right;
}

.like-button:hover {
  transform: scale(1.1);
}

.like-button:active {
  transform: scale(0.95);
}

.like-button.loading {
  opacity: 0.7;
  cursor: not-allowed;
}

.like-button.liked {
  cursor: not-allowed;
}

.like-icon {
  width: 35px;
  height: 35px;
  object-fit: contain;
}

.like-counter {
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #fff;
  text-align: center;
  justify-content: center;
  width: 100%;
}

.like-count {
  font-weight: 500;
  color: #fff;
}

.new-icon-wrapper {
  width: 56px;
  height: 56px;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-8px) translateX(-8px);
  z-index: 100;
}

.new-icon-wrapper img {
  width: 100%;
  height: 100%;
}

/* ソートコントロールのスタイル */
.sort-controls {
  margin-bottom: 20px;
  text-align: right;
  padding: 10px 0;
}

.sort-controls a {
  padding: 8px 16px;
  text-decoration: none;
  border-radius: 4px;
  font-size: 14px;
  transition: all 0.3s ease;
}

.sort-controls a:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* レスポンシブ対応 */
@media screen and (max-width: 640px) {
  .sort-controls * {
    font-size: 12px !important;
  }
}
