@charset "utf-8";
:root{
  /* Base Font Size 1.0rem = 10px */
  font-size: 10px;

  /* フォントカラー */
  --color-base: #002246;
  --color-wht: #fff;
  --color-grn: #bdf02c;
  --color-org: #f15a24;
  --color-sky: #d7e9f7;
  --ff: "Noto Sans JP", sans-serif;
  --ff-serif: "Noto Serif JP", serif;
  --ff-en: "Inter", sans-serif;
}
/* 320対応（374以下は、ルートベースフォントサイズを9pxに） */
@media screen and (max-width: 374px){
    :root{
        font-size: 8px;
    }
}
*, *::before, *::after {
  box-sizing: border-box;
}
html{
  scroll-behavior: smooth;
}
body {
  position: relative;
  background: var(--color-lightred);
  font-family: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
  font-size: 1.6rem;
  line-height: 1.8;
  color: var(--color-base);
  overflow-x: hidden;
}
:lang(en),
.en {
  font-family: "Inter", sans-serif;
}

img{
  width: 100%;
  height: auto;
}
p{
  position: relative;
  text-align: justify;
  font-size: 1.6rem;
}

a,
a:hover,
a:hover img {
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  text-decoration: none;
}
a:hover img{opacity: 0.85;}
ul,ol{
  padding-inline-start: 0;
  list-style-position: inside;
}
.wrapper,
.wrap_min{
  max-width: 1280px;
  width: 92.1875%;
  margin-inline: auto;
}
.wrap_min{max-width: 980px;}

.item_container,
.item_container_r{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.item_container_r{
  flex-direction: row-reverse;
}
.itembox02{width: 48%;}
.itembox03{width: 30%;}
.itembox04{width: 23%;}

.pc_case{display: block;}
.sp_case{display: none;}

@media (max-width: 768px) {
  .pc_case{display: none;}
  .sp_case{display: block;}
  .itembox02,.itembox03{width: 100%;}
}
@media (min-width: 751px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}

/* ==============================
    共通設定
=============================== */
.sec{
  padding-block: 80px;
}
.font_s{font-size: 1.4rem;}
.text_c{text-align: center;}
.text_r{text-align: right;}
.mb10{margin-bottom: 10px!important;}
.mb20{margin-bottom: 20px!important;}
.mb30{margin-bottom: 30px!important;}
.mb60{margin-bottom: 60px!important;}
.bg_wht{background: var(--color-wht);}
.col_blue{color: var(--color-blue);}
.col_org{color: var(--color-org);}
.col_yel{color: var(--color-yel);}
.col_darkblue{color: var(--color-darkblue);}

@media (max-width: 768px) {
  .sec{padding-block: 50px;}
}

/* ==============================
    header
=============================== */
header{
  position: relative;
  background: url(../images/bg_fv.webp) no-repeat center center /cover;
}
.fv_img{
  max-width: 1200px;
  width: 94%;
  height: auto;
  margin: 0 auto;
}

@media (max-width: 768px) {
  header{
    position: relative;
    background: url(../images/bg_fv_sp.webp) no-repeat center center /cover;
    padding: 20px 0 30px;
  }
}



/* ==============================
    タイトル
=============================== */
.visuall_hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
.en {
  font-family: "Inter", sans-serif;
}

.title_icon{
  text-align:center;
  font-family: var(--ff-en);
  font-size: 1.8rem;
  font-weight: 900;
  line-height: 1.2;
  margin-bottom: 20px;
}
.title_icon::before{
  content:"";
  background:url(../images/title_icon.svg) no-repeat center / contain;
  display:block;
  width:80px;
  height:50px;
  margin:0 auto 8px;
}
.title_main{
  text-align: center;
  font-size: clamp(3.6rem, 5vw, 6.0rem);
  font-weight: 600;
  line-height: 1.5;
}
.title_main span{
  display: block;
  font-size: clamp(2rem, 4vw, 3.6rem);
  font-style: italic;
  line-height: 1.2;
}
.sabtit_c{
  text-align: center;
  font-size: clamp(2rem, 4vw, 3.6rem);
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 30px;
}

@media (max-width: 768px) {
  .title_icon{margin-bottom: 5px;}
}

/* ==============================
    logo_slider
=============================== */
.tit_logolist{
  text-align: center;
  font-size: 2.4rem;
  font-weight: 700;
  margin-top: 20px;
}
.tit_logolist span{font-size: 1.7rem;}

.logo_slider {overflow: hidden;}
.logo_track {
  background: var(--color-wht);
  display: flex;
  width: max-content;
  animation: scroll 20s linear infinite;
}
.logo_list {
  display: flex;
  list-style: none;
  padding: 20px 0;
}
.logo_list li {margin-right: 40px;}
.logo_list img {height: 50px;}

/* アニメーション */
@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}


/* ==============================
    担当者におすすめ
=============================== */
#osusume{
  position: relative;
  background: url(../images/bg_osusume.gif) center/cover no-repeat;
  padding:60px 0 120px;
  clip-path: polygon(0 0, 100% 0, 100% 85%, 50% 100%, 0 85%);
  z-index: 3;
}
.title_osusume_img{
  display: block;
  max-width: 500px;
  height: auto;
  margin: 0 auto 10px;
}
.bg_wht_r{
  position: relative;
  background: var(--color-wht);
  border-radius: 12px;
  padding: clamp(40px, 4vw, 60px) clamp(30px, 12vw, 150px);
}
.bg_wht_r li{
  position: relative;
  list-style: none;
  font-size: 2.0rem;
  font-weight: 500;
  line-height: 1.8;
  padding-left: 40px;
  margin-bottom: 10px;
}
.bg_wht_r li:last-of-type{
  margin-bottom: 0;
}
.bg_wht_r li::before{
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  width: 30px;
  height: 40px;
  background: url(../images/icon_check.svg) no-repeat;
}
.osusume_img{
  position: absolute;
  right: 0;
  bottom: 0;
  width: 25%;
  height: auto;
}

#osusume_answer{
  position: relative;
  background: url(../images/bg_osusume02.gif) no-repeat top center / cover;
  margin-top: -120px;
  padding: 200px 0 140px;
  z-index: 0;
}
#osusume_answer .wrapper{
  position: relative;
  padding-bottom: 140px;
}
.tit_osusume_answer img{
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  max-width: 790px;
  width: 100%;
  height: auto;
  z-index: 1;
}
.answer_people{
  position: absolute;
  bottom: 18%;
  right: 0;
  width: 33%;
  height: auto;
}


@media (max-width: 768px) {
  #osusume{
    padding: 40px 0 160px;
    clip-path: polygon(0 0, 100% 0, 100% 85%, 50% 95%, 0 85%);
  }
  #osusume_answer .wrapper{
    padding-bottom: 60px;
  }
  .bg_wht_r{padding: 30px 10px 30px 20px;}
  .bg_wht_r li::before{top: 0;}

  .osusume_img,
  .answer_people{
    display: none;
  }

  #osusume_answer{
    background: url(../images/bg_osusume02_sp.gif) no-repeat top center / cover;
    margin-top: -160px;
    padding: 140px 0 0;
  }
  .tit_osusume_answer img{
    position: absolute;
    top: 0;
    bottom: auto;
  }
}

/* ==============================
    講師紹介
=============================== */
#coach{
  background: url(../images/bg_coach.gif) no-repeat center center / cover;
  padding: 60px 0;
}
#coach .title_main{
  margin-bottom: 110px;
}
.coachbox{
  position:relative;
  display: flex;
  align-items:flex-start;
  max-width: 1280px;
  width: 100%;
  margin: auto;
}
.coachbox_img{
  position: relative;
  width:40%;
  margin-right:-80px;
  z-index: 2;
}
.coachbox_img img{
  width:100%;
  height:auto;
  margin-top: 10%;
}
.coachbox_text{
  background:var(--color-sky);
  width:60%;
  font-size: 1.8rem;
  padding:60px 60px 60px 120px;
}
.coach_name{
  font-size: 4.8rem;
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: 30px;
}
.list_square{
  list-style: square;
  padding-left:1em;
  margin-bottom: 30px;
}

@media (max-width: 768px) {
  #coach{
    background: url(../images/bg_coach.gif) no-repeat top center / 100%;
    padding: 40px 0 0;
  }
  #coach .title_main{
    margin-bottom: 30px;
  }

  .coachbox{
    flex-direction:column;
  }
  .coachbox_img{
    width:100%;
    margin-right:0;
  }
  .coachbox_img img{margin-top: 0;}
  .coachbox_text{
    width:100vw;
    margin-left:calc(50% - 50vw);
    margin-top:-160px;
    padding:180px 20px 40px 20px;
  }
}

/* ==============================
    講師紹介
=============================== */
#curriculum{
  background: url(../images/bg_curriculum.png) no-repeat top center / cover;
}
#curriculum .title_main{
  margin-bottom: 30px;
}
#curriculum h3{
  text-align: center;
  font-size: 2.0rem;
  font-weight: 600;
  margin-bottom: 80px;
}

.cur_box{margin-bottom: 60px;}
#curriculum dl{
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
#curriculum dt{
  display: flex;
  align-items: center;
  width: 350px;
  background: var(--color-grn);
  font-family: var(--ff-en);
  font-size: 3.6rem;
  font-weight: 600;
  line-height: 1.4;
  padding: 5px 15px;
}
#curriculum dt span{
  font-size: 2.4rem;
}
#curriculum dt > div{
  position: relative;
  letter-spacing: 0.1em;
  margin-right: 15px;
  padding-right: 20px;
}
#curriculum dt > div::after{
  content: "";
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  background: var(--color-base);
  width: 1px;
  height: 30px;
}
#curriculum dt > div span{
  font-family: var(--ff);
  font-size: 2.0rem;
}
#curriculum dd{
  width: calc(100% - 350px);
  padding-left: 20px;
}
.cur_time{
  display: inline-block;
  background: var(--color-base);
  border-radius: 5px;
  color: var(--color-wht);
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.05em;
  padding: 4px 10px;
}
.cur_time span{
  font-family: var(--ff-en);
  font-size: 3.2rem;
  font-weight: 600;
}
#curriculum h4{
  font-size: 3.6rem;
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 10px;
}
#curriculum h4 span.pc_case{
  display: inline-block;
}
.cur_timetable:first-child{
  width: 35%;
}
.cur_timetable:last-child{
  width: 62%;
}
.cur_table{
  width: 100%;
  border-collapse: collapse;
}
.cur_table th,
.cur_table td{
  border: 1px solid var(--color-base);
  vertical-align: middle;
  padding: 8px 20px;
}
.cur_table th{
  width: 7em;
  background: var(--color-sky);
  text-align: center;
  font-size: 2.0rem;
  font-weight: 500;
  line-height: 1.3;
}
.cur_table td{
  width: calc(100% - 7em);
  background: var(--color-wht);
  text-align: left;
  font-size: 1.8rem;
  line-height: 1.5;
}
.cur_table tr:first-of-type th{background: #c5ddef;}
.cur_table tr:first-of-type td{
  background: var(--color-sky);
  text-align: center;
  font-size: 2.0rem;
  font-weight: 500;
}

@media (max-width: 768px) {
  .cur_box:last-child{margin-bottom: 0;}
  .cur_timetable:first-child,
  .cur_timetable:last-child{
    width: 100%;
  }
  .cur_timetable:first-child{margin-bottom: 10px;}
  #curriculum h3{
    text-align: left;
    font-size: 1.7rem;
    margin-bottom: 10px;
  }

  #curriculum dt{
    width: 260px;
    font-size: 2.4rem;
    padding: 5px 10px;
  }
  #curriculum dt > div{
    margin-right: 10px;
    padding-right: 10px;
  }
  #curriculum dt span{font-size: 1.8rem;}
  #curriculum dd{
    width: calc(100% - 260px);
    padding-left: 5px;
  }
  .cur_time{font-size: 1.7rem;}
  .cur_time span{font-size: 2.0rem;}
  #curriculum h4{font-size: 2.4rem;}
  #curriculum h4 span.pc_case{display: none;}
  .cur_table th, .cur_table td{padding: 8px 15px;}
  .cur_table th{width: 25%;}
  .cur_table td{width: 75%;}
}

/* ==============================
    参加者の声
=============================== */
.voice_wrap {
  position: relative;
  overflow: hidden;
  margin-top: 60px;
}
.voice_track {
  display: flex;
  gap: 30px;
  width: max-content;
  cursor: grab;
}
.voice_track:active {
  cursor: grabbing;
}
.voice_box {
  flex: 0 0 60%;
  max-width: 980px;
  border-radius: 10px;
  display: block;
  background: rgba(215,233,247,0.5);
  border: 2px solid var(--color-base);
  padding: 20px;
  transition: transform .4s ease;
}
#voice .voice_box h3{
  text-align: center;
  font-size: 2.8rem;
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: 20px;
}
.tit_voice{
  font-size: 2.4rem;
  font-weight: 500;
  margin-bottom: 20px;
}
.tit_voice span{
  display: block;
  width: 100%;
  border-bottom: 1px solid var(--color-base);
  padding-bottom: 3px;
  margin-bottom: 2px;
}

.item_voice:first-child{width: 40%;}
.item_voice:last-child{width: 58%;}



@media (max-width: 768px) {
  .voice_track {
    width: 100%;
  }
  .voice_box {
    flex: 0 0 95%;
    max-width: 95%;
  }
  .item_voice:first-child,
  .item_voice:last-child{
    width: 100%;
  }
  #voice .voice_box h3{
    font-size: 2.2rem;
  }
  .tit_voice{
    font-size: 1.8rem;
  }
  .tit_voice span{
    display: contents;
  }
  #voice .voice_box p{
    font-size: 1.4rem;
  }
}

/* ==============================
    補助金活用サポート
=============================== */
#aid{
  background: url(../images/bg_aid.gif) no-repeat top center / cover;
}
#aid .title_main{margin-bottom: 60px;}
#aid h3{
  text-align: center;
  font-size: 3.6rem;
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 40px;
}
#aid h3 span{
  display: inline-block;
  background: var(--color-grn);
  padding: 5px 10px;
  margin-right: 5px;
}
.aid_pointtxt{
  text-align: center;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.8;
}
.border_b{
  display: block;
  max-width: 480px;
  width: 100%;
  border-bottom: 2px dashed var(--color-base);
  padding-bottom: 5px;
  margin: 0 auto 5px;
}
#aid .item_container{
  margin: 40px auto 20px;
}
#aid .itembox02 p{
  font-size: 1.8rem;
}
.wht_box{
  background: var(--color-wht);
  border-radius: 8px;
  padding: 30px 40px;
}
.title_aid_case{
  background: var(--color-grn);
  border-radius: 25px;
  text-align: center;
  font-size: 2.4rem!important;
  font-weight: 500;
  line-height: 50px;
  margin-bottom: 20px;
}
.aid_price{
  width: 100%;
  display: flex;
  align-items: center;
}
.aid_price dt,
.aid_price dd{
  text-align: center;
}
.aid_price dt{
  width: 45%;
  color: var(--color-wht);
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.5;
}
.aid_price dd{
  width: 55%;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.4;
}

.aid_price dt span{
  display: block;
  font-size: 1.4rem;
  line-height: 1.5;
}
.bg_org,
.bg_nvy{
  display: block;
  border-radius: 4px;
  padding: 8px 0;
}
.bg_org{background: var(--color-org);}
.bg_nvy{background: var(--color-base);}
.col_org{color: var(--color-org);}
.col_nvy{color: var(--color-base);}

.aid_price dd b{font-size: 2.4rem;}
.aid_price dd span{font-size: 3.6rem;}
.aid_price dd span.price_big{
  font-size: 6.0rem;
  font-weight: 600;
  line-height: 1.0;
}
.sankaku{position: relative;}
.sankaku::after{
  content: "";
  position: absolute;
  bottom: -20px;
  left: 50%;
  transform: translateX(-50%);
  background: #6c95c7;
  height: calc(tan(60deg) * 20px / 2);
  width: 40px;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

@media (max-width: 768px) {
  #aid .title_main{margin-bottom: 30px;}
  #aid h3{
    font-size: 2.6rem;
    line-height: 1.8;
  }
  #aid h3 span{
    display: block;
    line-height: 1.5;
    padding: 10px 5px;
  }
  .aid_pointtxt{font-size: 2.0rem;}
  #aid .itembox02:first-child{
    margin-bottom: 20px;
  }
  .wht_box{padding: 30px 20px;}
  .aid_price dt{font-size: 2.1rem;}

}


/* ==============================
    補助金活用サポート
=============================== */
#about{
  background: url(../images/bg_about.gif) no-repeat center center / cover;
}
#about .title_main{
  margin-bottom: 60px;
}
.about_item {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}
.about_list dt {
  width: 30%;
  background: var(--color-grn);
  border-radius: 25px;
  text-align: center;
  font-size: 2.8rem;
  line-height: 50px;
  white-space: nowrap;
}
.about_list dd{
  width: 70%;
  font-size: 2.6rem;
  line-height: 1.5;
  padding-left: 30px;
}
.about_list dd span{
  font-size: 2.0rem;
}

@media (max-width: 768px) {
  .about_item {
    flex-direction: column;
    align-items: flex-start;
  }
  .about_list dt,
  .about_list dd {
    width: 100%;
  }
  .about_list dt {
    font-size: 2.4rem;
    margin-bottom: 10px;
  }
  .about_list dd {
    text-align: center;
    font-size: 2.0rem;
    padding-left: 0;
  }
  .about_list dd span{
    font-size: 1.6rem;
  }
}

/* ==============================
    お申し込み
=============================== */
#entry{
  background: url(../images/bg_entry.webp) no-repeat top center / cover;
}
.tit_entry{
  color: var(--color-wht);
  text-align: center;
  font-size: 3.6rem;
  font-weight: 600;
  line-height: 1.6;
  text-shadow:
  0 0 8px #fff,
  0 0 16px rgba(0,150,255,0.7),
  0 0 30px rgba(0,150,255,0.5),
  0 2px 6px rgba(0,0,0,0.5);
}
a.btn_entry,
a.btn_entry:visited,
a.btn_headentry,
a.btn_headentry:visited{
  display: block;
  max-width: 500px;
  width: 84%;
  background: var(--color-grn);
  border-radius: 50px;
  line-height: 80px;
  color: var(--color-base);
  text-align: center;
  font-size: 4.0rem;
  font-weight: 600;
  margin: 30px auto 60px;
}
a.btn_headentry{
  position: absolute;
  top: 20px;
  right: 30px;
  max-width: 280px;
  font-size: 3.0rem;
  border-radius: 30px;
  line-height: 54px;
  margin: auto;
}
a.btn_entry:hover,
a.btn_headentry:hover{
  background: #6c95c7;
  color: var(--color-wht);
}

.tit_closing{
  color: var(--color-grn);
  text-align: center;
  font-size: 2.8rem;
  line-height: 1.2;
}
.entry_closingday{
  color: var(--color-grn);
  text-align: center;
  font-family: var(--ff-en);
  font-size: 7.2rem;
  font-weight: 800;
  letter-spacing: 0.05em;
}
.entry_closingday b{font-size: 2.4rem;}
.entry_closingday span{
  font-family: var(--ff);
  font-size: 2.4rem;
  font-weight: 700;
}
.capacity{
  display: block;
  border: 1px solid var(--color-wht);
  max-width: 300px;
  width: 84%;
  text-align: center;
  color: var(--color-wht);
  font-size: 2.4rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
  margin:  0 auto;
}
.capacity span{
  font-family: var(--ff-en);
  font-size: 4.8rem;
  font-weight: 800;
}
.sponsor{
  color: var(--color-wht);
  text-align: center;
  font-size: 1.6rem;
  margin-top: 40px;
}


@media (max-width: 768px) {
  #entry{
    background: url(../images/bg_entry_sp.webp) no-repeat top center / cover;
  }
  #entry .title_icon{margin-bottom: 30px;}
  .tit_entry{font-size: 2.4rem;}
  a.btn_entry,
  a.btn_entry:visited{
    border-radius: 30px;
    font-size: 2.6rem;
    line-height: 60px;
  }
  .sponsor{font-size: 1.3rem;}
  a.btn_headentry{display: none;}
}