html {
  box-sizing: border-box;
}

body {
  font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif';
}

:root {
  --topleader: #0084CA;
  --miraihakken: #36B449;
  --kimiseminar: #F1592A;
  --competition: #009380;
}

h1 {
  font-size: 30px;
  text-align: center;
}

h2 {
  font-size: 30px;
  text-align: center;
}

p{
  margin: 0;
}

#wrapper {
  width: 1000px;
  margin: 0 auto;
}

.mv_txt_box{
  margin: 25px 0;
}

.mv_under_txt{
font-size: 18px;
}

.mv_under_ttl{
  font-size: 30px;
  text-align: center;
  font-weight: bold;
}

.coaching-ttl-box{
  background-color: #009380;
  margin: 60px 0;
  padding: 20px;
}

.coaching-ttl{
  color: white;
  text-align: center;
  font-size: 45px;
  font-weight: bold;
}

.coaching-ttl-txt{
  color: white;
  font-size: 18px;
}

.splide {
  margin-bottom: 50px;
}

/* タイトル */
.content-ttl-container {
  display: flex;
  align-items: center;
  justify-content: space-around;
  font-size: 1.5rem;
  position: relative;
  width: 1000px;
  margin-bottom: 30px;
  height: 80px;
  background-color: white;
  overflow: hidden;
  border: 2px solid;
  border-radius: 5px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

.ttl-left {
  z-index: 1;                   
  color: white;
  font-weight: bold;
  font-size: 1.5rem;
}

.ttl-right {
  z-index: 1;
  color: black;
  font-size: 1.5rem;
}

.content-detail-box{
  display: flex;
  align-items: center;
  padding: 30px 0;
}

.content-detail-txt{
  font-size: 18px;
}

.content-ttl-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.content-ttl-container.topleader{
  border-color: var(--topleader);
}
.content-ttl-container.topleader::before {
  background: linear-gradient(135deg, var(--topleader) 50%, white 50%);
}
.content-ttl-container.miraihakken {
  border-color: var(--miraihakken);
}
.content-ttl-container.miraihakken::before {
  background: linear-gradient(135deg, var(--miraihakken) 30%, white 30%);
}
.content-ttl-container.kimiseminar {
  border-color: var(--kimiseminar);
}
.content-ttl-container.kimiseminar::before {
  background: linear-gradient(135deg, var(--kimiseminar) 43%, white 43%);
}
.content-ttl-container.competition {
  border-color: var(--competition);
}
.content-ttl-container.competition::before {
  background: linear-gradient(110deg, var(--competition) 45.5%, white 45.5%);
}


/* トップリーダー */
.kouza-container{
  font-family: serif;
}

.kouza-img {
  width: 280px;
  height: 230px;
  display: block;
}

.kouza-profile {
  text-align: left;
  padding: 5px 15px;
  font-size: 12px;
}

#topleader-splide .kouza-profile {
  background-color: #000;
  color: #fff;
  height: 90px;
  width: 250px;
}

#topleader-splide .kouza-content-ttl {
  height: 80px;
}

.kouza-profile-name {
  font-size: 20px;
}

.kouza-teacher-name {
  font-size: 14px;
}

.kouza-content-ttl {
  padding: 20px 5px;
  font-size: 18px;
  font-weight: bold;
}

.kouza-upper-container {
  position: relative;
}

.kouza-upper-container::before {
  content: "";
  display: block;
  height: 15px;
}

.content-detail-box:first-child{
  margin-bottom: 30px;
}

#topleader-splide .kouza-upper-container::before {
  background-color: var(--topleader);
  width: 280px;
}

.kouza-middle-container {
  text-align: left;
}

.kouza-content-detail{
  line-height: 1.5;
  font-size: 16px;
  letter-spacing: -0.5px;
  font-weight: normal;
  margin-bottom: 60pxw;
}

.kouza-keyword {
  text-align: left;
  font-size: 16px;
  font-weight: bold;
}

.keyword-container {
  position: relative;
  margin-top: 35px;
}

.keyword-container::before {
  content: "キーワード";
  font-size: 16px;
  padding: 0 10px;
  border-radius: 9999px;
  color: #fff;
  position: absolute;
  top: -30px;
  left: 0;
}

#topleader-splide .keyword-container::before {
  background-color: var(--topleader);
}

.column{
  display: flex;
}

.column-cnt{
  width: 70%;
  padding: 0.5rem;
  margin: 5px auto;
}

.column-cnt.topleader{
  border: var(--topleader) solid 2px;
}

.column-cnt.mirai{
  border: var(--miraihakken) solid 2px;
  position: relative;
}

.column-cnt.seminar{
  border: var(--kimiseminar) solid 2px;
}

.column-cnt .-ribbon{
  font-weight: bold;
  width: 37%;
  color: white;
  padding: 0.1rem;
  text-align: center;
  margin: 0.3rem 0;
}

.column-cnt .-ribbon.topleader{
  background: var(--topleader);
}

.column-cnt .-ribbon.mirai{
  background: var(--miraihakken);
}

.column-cnt .-ribbon.seminar{
  background: var(--kimiseminar);
}

.column-cnt .-name{
  font-size: 2rem;
  font-weight: bold;
}

.column-cnt .-box{
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.column-cnt .-img{
  width: 24%;
}

.column-cnt .-copy{
  font-size: 1.8rem;
  font-weight: bold;
  margin: 0.5rem 0;
}

.column-cnt .-copy.mirai{
  color: var(--miraihakken);
}

.column-cnt .-copy.seminar{
  color: var(--kimiseminar);
}

.column-cnt .-ttl{
  font-size: 1.2rem;
  font-weight: bold;
  padding: 0.3rem;
  margin: 0.5rem 0;
}

.column-cnt .-ttl.topleader{
  border-left: var(--topleader) 0.8rem solid;
}

.column-cnt .-ttl.mirai{
  border-left: var(--miraihakken) 0.8rem solid;
}

.column-cnt .-ttl.seminar{
  border-left: var(--kimiseminar) 0.8rem solid;
}

.column-cnt .-icon{
  position: absolute;
  width: 22%;
  top: -40px;
  right: -104px;
}



/* 未来発見講座 */
#miraihakken-splide .kouza-profile {
  background-color: #fff;
  color: #000;
  height: 90px;
}

#miraihakken-splide .keyword-container::before {
  background-color: var(--miraihakken);
}

/* 君の未来を考えるセミナー */
#kimiseminar-splide .kouza-upper-container::before {
  background-color: var(--kimiseminar);
  width: 280px;
}

#kimiseminar-splide .kouza-upper-container::after {
  background-color: var(--kimiseminar);
  content: "";
  width: 281px;
  height: 15px;
  position: absolute;
  top: 216px;
  left: -1px;
  transform: rotate(5deg);
}

#kimiseminar-splide .keyword-container::before {
  background-color: var(--kimiseminar);
}

#kimiseminar-splide .kouza-img {
  clip-path: polygon(0 0, 100% 0, 100% 94%, 0 87%);
}

.seminar_top_txt{
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
  padding: 23px 0;
}

.seminar_top_txt span{
  background-color: var(--kimiseminar);
  color: white;
  padding: 0.5rem;
}

#kimiseminar-splide .kouza-profile {
  padding: 2px 5px;
  font-size: 12px;
  width: 270px;
  height: 90px;
}


/* 志作文コンクール */

.competition-box{
  margin: 30px 0;
}

.competition-theme{
  text-align: center;
  position: relative;
}

.competition-theme-icon{
  position: absolute;
  width: 12%;
  left: 275px;
  top: 74px;
}

.competition-theme-img{
  width: 43%;
}

.competition-ttl-txt{
  font-size: 23px;
  font-weight: bold;
  text-align: center;
}

.competition-ttl-txt span{
  color: #009380;
}

.system-detail-box{
  display: flex;
  align-items: center;
}

.system-detail-box img{
  width: 40%;
}

.event-ttl-container {
  display: flex;
  align-items: center;
  justify-content: space-around;
  font-size: 25px;
  position: relative;
  width: 1000px;
  border: 2px solid;
  margin: 15px 0;
}

.event-ttl-container.gakubu{
  border-color:#132b88;
}

.event-ttl-container.science{
  border-color:#23ac39;
}

.event-ttl-container.english{
  border-color:#00a1e9;
}

.event-ttl-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.event-ttl-container.gakubu::before {
  background: linear-gradient(90deg, #132b88 40%, white 30%);
}

.event-ttl-container.science::before {
  background: linear-gradient(90deg, #23ac39 40%, white 30%);
}

.event-ttl-container.english::before {
  background: linear-gradient(90deg, #00a1e9 40%, white 30%);
}

.event-ttl-left {
  z-index: 1;                   
  color: white;
  font-weight: bold;
}

.event-ttl-right {
  z-index: 1;
}

.event-ttl-right.gakubu {
  color: #132b88;
  font-size: 1.2rem;
}

.event-ttl-right.science {
  color: #23ac39;
  font-size: 1.2rem;
}

.event-ttl-right.english {
  color: #00a1e9;
  font-size: 1.2rem;
}

.event-acc-btn{
  cursor: pointer;
  text-align: center;
  text-decoration: underline;
}

.event-acc-science-btn{
  cursor: pointer;
  text-align: center;
  text-decoration: underline;
}

.event-gakubu-detail{
  flex-wrap: wrap;
  justify-content: space-around;
  display: none;
}

.event-gakubu-detail.show{
  display: flex;
}

.event-science-detail{
  flex-wrap: wrap;
  justify-content: space-around;
  display: none;
}

.event-science-detail.show{
  display: flex;
}

.event-gakubu-cnt{
  display: flex;
  border: #000 solid 2px;
  width: 22%;
  font-size: 0.8rem;
  padding: 0.5rem;
  margin: 5px auto;
  align-items: center;
}

.event-gakubu-cnt img{
  width: 33%;
  height: 100%;
  object-fit: contain;
}

.event-gakubu-cnt .-box{
  padding: 0.5rem;
}

.event-gakubu-cnt .-ttl{
  font-size: 0.9rem;
  font-weight: bold;
}

.event-gakubu-cnt .-name{
  font-size: 1rem;
  font-weight: bold;
}

.event-science-detail.show{
  display: flex;
}

.event-science-cnt{
  display: flex;
  align-items: center;
  justify-content: center;
  border: #23ac39 solid 2px;
  width: 47%;
  font-size: 1rem;
  padding: 0.5rem;
  margin: 5px auto;
}

.event-science-cnt img{
  width: 15%;
  height: 100%;
  object-fit: contain;
}

.event-science-cnt .-info{
  font-size: 0.8rem;
}

.event-science-cnt .-box{
  padding-left: 1.5rem;
}

.event-science-cnt .-ribbon{
  font-weight: bold;
  background: #23ac39;
  width: 37%;
  color: white;
  padding: 0.3rem;
  text-align: center;
  margin: 0.3rem 0;
}

.event-science-cnt .-ttl{
  font-size: 1.2rem;
  font-weight: bold;
  border-left: #23ac39 0.8rem solid;
  padding: 0.3rem;
}

.event-science-cnt .-name{
  font-size: 1.2rem;
  font-weight: bold;
}

.english-box{
  display: flex;
}

/* 合格体験記 */
/* 
.competition-box.taikenki{
  display: flex;
  justify-content: space-around;
}

.taikenki-box{
  border: #009380 2px solid;
  width: 25%;
  padding: 0.3rem;
  margin: 0.2rem;
  position: relative;
}

.taikenki-box .-student{
  display: flex;
  align-items: center;
  justify-content: center;
}

.taikenki-box .-unibersity{
  color: #009380; 
  font-size: 1.4rem;
  font-weight: bold;
}

.taikenki-box .-name{
  font-size: 0.9rem
}

.taikenki-box .-name span{
  font-size: 1.4em;
  font-weight: bold;
}

.taikenki-box .-img{
  width: 40%;
}

.taikenki-box .-txt{
  font-size: 1rem;
  padding: 0.5rem 0;
  text-indent: 1rem;
}

.taikenki-icon{
  position: absolute;
  width: 43%;
  top: -44px;
  right: -14px;
  z-index: 1;
} */

.cnt-margin{
  margin: 85px auto;
  border: black 1px dashed;
  width: 1000px;
}

.splide__arrow--next {
  position: absolute;
  top: 35%;
  right: -6%;
}

.splide__arrow--prev {
  position: absolute;
  top: 35%;
  left: -6%;
}