@import url(./header.css);

/* top mv start */

.top-mv {
 background: url(../img/bg/building.png), linear-gradient(to bottom, var(--orange-light) 0% 90%, var(--orange) 90% 100%);
 background-repeat: repeat-x, no-repeat;
 background-position: center 95%, top;
 background-size: auto 250px, cover;
 height: 100vh;
 max-height: 800px;
 padding-top: 0 !important;
 padding-bottom: 20px !important;
}

.top-mv .inner {
 height: 100%;
}

.top-mv .imgbox.sp {
 display: none;
}

.top-mv .container--top {
 height: 80%;
 /* display: flex;
 flex-direction: column;
 justify-content: center; */
 padding-top: 140px;
}

.top-mv .container--top .main_ttl {
   margin-bottom: 40px;
   line-height: 70px;
   font-weight: 400;
}

.top-mv .container--top .main_ttl .txt-small{
 font-size: 60px;
 color: var(--orange);
}

.top-mv .container--top .main_ttl .txt-small2 {
   font-size: 74px;
}

.top-mv .container--top .main_ttl .text-large {
 font-size: 83px;
 color: var(--orange);
}

.top-mv .container--top .main_ttl .text-large--1::after {
 content: "";
 display: inline-block;
 width: 84px;
 aspect-ratio: 1/1;
 background: url(../img/icon/beginner.png) no-repeat;
 background-position: center;
 background-size: contain;
 vertical-align: middle;
}

.top-mv .container--top .main_ttl .text-large--2 {
 color: var(--orange);
}

.top-mv .container--top .sub_ttl {
   display: inline-block;
   font-size: 50px;
   position: relative;
   padding-bottom: 10px;
   color: #000;
   top: -15px;
   margin-right: 15px;
}

.top-mv .container--top .sub_ttl::after {
 content: "";
 width: 100%;
 height: 15px;
 background: url(../img/line-wave-black.png) no-repeat;
 background-position: center;
 background-size: contain;
 position: absolute;
 left: 0;
 bottom: 0;
}

.top-mv .container--top .list {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: 20px;
}

.top-mv .container--top .list .item {
 width: 160px;
 aspect-ratio: 1 / 1;
 background: url(../img/bg/circle.png) no-repeat;
 background-position: center;
 background-size:contain;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 font-size: 25px;
 text-align: center;
 padding: 20px;
 color: #7180D8;
 position: relative;
}

.top-mv .container--top .list .item:nth-child(1), .top-mv .container--top .list .item:nth-child(2) {
 font-size: 30px;
}

.top-mv .container--top .list .item::before {
 position: absolute;
top: 5px;
left: 10px;
 color: #000;
 font-weight: bold;
}

.top-mv .container--top .list .item--1::before {
 content: "";
 width: 25px;
 height: 50px;
 background: url(../img/top/top-mv/one.png) no-repeat;
 background-size: 100% auto;
}

.top-mv .container--top .list .item--2::before {
 content: "";
 width: 35px;
 height: 50px;
 background: url(../img/top/top-mv/two.png) no-repeat;
 background-size: 100% auto;
}

.top-mv .container--top .list .item--3:before {
 content: "";
 width: 30px;
 height: 50px;
 background: url(../img/top/top-mv/three.png) no-repeat;
 background-size: 100% auto;
}

.top-mv .container--bottom {
 height: 20%;
}

.top-mv .container--bottom {
   display: flex;
   align-items: flex-end;
   gap: 190px;
   max-width: 1000px;
}

.top-mv .container--bottom .member {
 position: relative;
 z-index: 1;
}

.top-mv .container--bottom .member .txtbox {
   height: 100px;
   width: 180px;
   font-size: 11px;
   aspect-ratio: 2 / 1;
   text-align: center;
   color: #fff;
   background: url(../img/bg/ribbon-orange.png) no-repeat;
   background-position: center;
   background-size: 100% 100%;
   padding: 20px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   position: relative;
   z-index: 1;
   font-family: toppan-bunkyu-midashi-go-std, sans-serif;
   font-weight: 600;
}

.top-mv .container--bottom .member .txtbox .text-large {
 font-size: 20px;
}

.top-mv .container--bottom .member .imgbox {
   position: absolute;
   max-width: 300px;
   right: -150px;
   bottom: -20px;
   z-index: -1;
}

.top-mv .list-cont, .top-mv .list {
 display: flex;
 align-items: center;
 gap: 20px;
 font-size: 32px;
}

.top-mv .list-cont {
 margin-bottom: 20px;
}

.top-mv .list .item {
 background: #fff;
 padding: 4px 8px;
 border-radius: 8px;
 color: var(--orange);
}

.top-mv .list-cont p {
 color: #fff;
 font-size: 32px;
}

.top-mv .container--bottom .member-info_desc{
   color: #fff;
   font-family: tbudgothic-std, sans-serif;
   font-size: 12px;
   font-weight: 100;
   line-height: 25px;
}

.top-mv .list-cont.pc{
 display: flex;
}

.top-mv .list-cont .list{
    width: auto;
}

.top-mv .list-cont.sp{
 display: none;
}

.top-mv .container--bottom .member-info_desc .sp {
 display: none;
}

/* top mv end */

/* concern start */

.concern .section_ttl .text-orange {
 display: inline-block;
 position: relative;
 z-index: 1;
}

.concern .section_ttl .text-orange::after {
 content: "";
 width: 102%;
 height: 40px;
 background: url(../img/line-wave-yellow.png) no-repeat;
 background-position: center;
 background-size: contain;
 position: absolute;
 left: 0;
 bottom: -25px;
 z-index: -1;
}

.concern .flex-box {
 align-items: center;
 justify-content: center;
 padding: 20px;
}

.concern .flex-box .txtbox, .concern .flex-box .imgbox {
 width: 50%;
}

.concern .flex-box .txtbox {
 min-width: 500px;
}

.concern .list .item {
 padding-left: 40px;
 position: relative;
 font-size: 26px;
 margin-bottom: 16px;
 font-family: a-otf-jun-pro, sans-serif;
 font-weight: 600;
}

.concern .list .item::before {
 content: "";
 display: block;
 width: 36px;
 height: 36px;
 background: url(../img/icon/checkbox.png) no-repeat;
 background-position: center;
 background-size: contain;
 position: absolute;
 top: 50%;
 left: 0;
 transform: translateY(-50%);
}

.concern .imgbox {
 max-width: 300px;
}

.concern .txtbox--bottom {
 background: var(--orange);
 color: #fff;
 padding: 15px 20px;
 text-align: center;
 font-size: 26px;
}

/* concern end */

/* moment start */
.moment {
 background: url(../img/top/moment/bg.png) no-repeat;
 background-position: center;
 background-size: 100% 100%;
 padding-bottom: 100px;
}

.moment .section_ttl .text-orange {
 display: inline-block;
 position: relative;
 z-index: 1;
}

.moment .section_ttl .text-orange::after {
 content: "";
 width: 102%;
 height: 40px;
 background: url(../img/line-wave-white.png) no-repeat;
 background-position: center;
 background-size: contain;
 position: absolute;
 right: 0;
 bottom: -25px;
 z-index: -1;
}

.moment .txtbox {
 text-align: center;
 margin-bottom: 30px;
 font-family: a-otf-gothic-mb101-pr6n, sans-serif;
 font-weight: 600;
 line-height: 30px;
}

.imgbox--sp {
 display: none;
}
/* moment end */

/* seminar start */
.seminar .cards {
 display: flex;
 flex-wrap: wrap;
 gap: 40px;
 margin-bottom: 50px;
 position: relative;
}

.seminar .card {
 width: 30%;
 aspect-ratio: 1.1 / 1;
 flex-grow: 1;
 background: url(../img/bg/card.png) no-repeat;
 background-position: center;
 background-size: 100% 100%;
 padding: 20px 28px;
}

.seminar .card_img {
 width: 50px;
 height: 50px;
 margin: 0 auto 20px
}

.seminar .card_ttl {
 font-size: 25px;
 text-align: center;
 color: var(--orange);
 margin-bottom: 16px;
}

.seminar .card .card_desc {
 font-family: a-otf-gothic-mb101-pr6n, sans-serif;
 font-weight: 600;
 font-size: 16px;
 line-height: 30px;
}

.seminar .btn_box {
 display: flex;
 gap: 20px;
}

.seminar .btn_box .btn {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 10px;
 width: 50%;
 text-align: center;
 color: #fff;
 background-color: var(--maroon);
 padding: 10px 20px;
 border-radius: 8px;
 font-size: 30px;
}

.seminar .btn_box .btn--1 img {
 width: 40px;
 height: 40px;
 object-fit: contain;
 object-position: center;
}

.seminar .btn_box .btn--2 img {
 width: 30px;
 height: 30px;
 object-fit: contain;
 object-position: center;
}
/* seminar end */

/* schedule start */

.schedule {
 background: var(--orange-light);
}

.schedule .cards {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
   padding: 30px;
   background: #fff;
}

.schedule .cards .card {
 flex-grow: 1;
 flex-basis: 48%;
 background: #fff;
 padding: 15px 10px 15px 40px;
 position: relative;
 overflow: hidden;
 border-radius: 8px;
 border: 2px solid #000;
 display: flex;
 gap: 20px;
 align-items: center;
}

.schedule .cards .fullSeat_card {
 flex-grow: 1;
 flex-basis: 48%;
 background: #cacaca;
 padding: 15px 10px 15px 40px;
 position: relative;
 overflow: hidden;
 border-radius: 8px;
 border: 2px solid #000;
 display: flex;
 gap: 20px;
 align-items: center;
}

.schedule .cards .fullSeat_card.inactive-link {
   pointer-events: none;
   cursor: default;
}

.schedule .cards .card_date {
   width: 90px;
   text-align: center;
   position: relative;
   height: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   line-height: 35px;
}

.schedule .cards .card_date::after {
 content: "";
 display: block;
 width: 4px;
 height: 100%;
 background: url(../img/line-dashed.png) no-repeat;
 background-position: center;
 background-size: 4px 100%;
 position: absolute;
 top: 0;
 right: -5px;
}

.schedule .cards .card_date p {
 font-family: century-gothic-std, sans-serif;
 font-weight: bold;
}

.schedule .cards .card_info p {
 font-family: tbudgothic-std, sans-serif;
 font-weight: 600;
}

.schedule .cards .card_date p, .schedule .cards .card_info p {
 font-size: 15px;
}

.schedule .cards .card_date p {
 font-size: 30px;
}

.schedule .cards .card_date .num-large {
 font-size: 42px;
 font-family: century-gothic-std, sans-serif;
 font-weight: bold;
}

.schedule .cards .card_date .text-small {
 font-size: 14px;
 font-family: fot-rodin-pron, sans-serif;
}

.schedule .cards .card_info .text-large {
 font-size: 21px;
 font-family: 'ShinRetroMaruGothic';
 font-weight: 400;
 color: #333;
 margin-bottom: 5px;
}

.schedule .cards .card_info .venue,
.schedule .cards .card--online .card_info .venue {
 font-family: tbudgothic-std, sans-serif;
}

.schedule .cards .card_info .time {
   margin-bottom: 4px;
   font-family: arial-nova, sans-serif;
   font-weight: 400;
   font-size: 16px;
}

.schedule .cards .card_info .time span {
 display: inline-block;
 background: var(--grey-dark);
 color: #fff;
 padding: 4px 6px;
 margin-right: 8px;
 font-size: 12px;
 font-family: toppan-bunkyu-midashi-go-std, sans-serif;
}

.schedule .cards .card_info .venue span {
 display: inline-block;
 background: var(--grey-dark);
 color: #fff;
 padding: 4px 6px;
 margin-right: 8px;
 font-size: 12px;
 font-family: toppan-bunkyu-midashi-go-std, sans-serif;
}

.schedule .cards .card--online .card_info .venue {
 color: red;
}

.schedule .cards .fullSeat_card .card_info .fullSeat {
 color: red;
 padding: 4px 6px;
 margin-right: 8px;
 font-size: 15px;
 font-family: toppan-bunkyu-midashi-go-std, sans-serif;
}

.schedule .cards .card.empty {
 visibility: hidden;
}

.schedule .cards .card--sapporo::before {
   content: "札幌";
   color: #fff;
   width: 40px;
   height: 100%;
   padding: 8px;
   background-color: var(--blue);
   position: absolute;
   top: 0;
   left: 0;
   writing-mode: vertical-rl;
   text-orientation: mixed; display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
   font-family: toppan-bunkyu-midashi-go-std, sans-serif;
}

.schedule .cards .card--asahikawa::before {
   content: "旭川";
   color: #fff;
   width: 40px;
   height: 100%;
   padding: 8px;
   background-color: var(--pink);
   position: absolute;
   top: 0;
   left: 0;
   writing-mode: vertical-rl;
   text-orientation: mixed; display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
   font-family: toppan-bunkyu-midashi-go-std, sans-serif;
}

.schedule .cards .card--kitami::before {
   content: "北見";
   color: #fff;
   width: 40px;
   height: 100%;
   padding: 8px;
   background-color: var(--green);
   position: absolute;
   top: 0;
   left: 0;
   writing-mode: vertical-rl;
   text-orientation: mixed; display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
   font-family: toppan-bunkyu-midashi-go-std, sans-serif;
}

.schedule .cards .card--hakodate::before {
   content: "函館";
   color: #fff;
   width: 40px;
   height: 100%;
   padding: 8px;
   background-color: var(--yellow);
   position: absolute;
   top: 0;
   left: 0;
   writing-mode: vertical-rl;
   text-orientation: mixed; display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
   font-family: toppan-bunkyu-midashi-go-std, sans-serif;
}

.schedule .cards .card--online::before {
   content: "オンライン";
   color: #fff;
   width: 40px;
   height: 100%;
   padding: 8px;
   background-color: var(--grey-dark);
   position: absolute;
   top: 0;
   left: 0;
   writing-mode: vertical-rl;
   text-orientation: mixed;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
   font-family: toppan-bunkyu-midashi-go-std, sans-serif;
}

.schedule .cards .card--empty {
   visibility: hidden;
   border: none;
   background: none;
   box-shadow: none;
   pointer-events: none;
}
/* schedule end */

@media screen and (max-width: 1366px) {
   .top-mv {
      background-position: center 100%, top;
      height: 680px;
      max-height: 800px;
      min-height: 680px;
   }

   .top-mv .list-cont {
      margin-bottom: 10px;
   }

   .schedule .cards .card_info .venue {
      font-size: 17px;
   }

   .schedule .cards .card_info .time {
      font-size: 19px;
   }

   .schedule .cards .card--online .card_info .venue {
      font-size: 14px;
   }

   .top-mv .container--bottom .member .imgbox {
      max-width: 280px;
      right: -120px;
   }

   .top-mv .container--bottom {
      gap: 235px;
   }

   .top-mv .container--top {
      padding-top: 125px;
   }

   .top-mv .container--top .sub_ttl {
      font-size: 50px;
   }

   .top-mv .container--top .main_ttl .txt-small {
      font-size: 60px;
   }

   .top-mv .container--top .main_ttl .txt-small2 {
      font-size: 74px;
   }

   .top-mv .container--top .main_ttl .text-large {
      font-size: 83px;
   }

   .top-mv .container--top .list .item--1::before {
      width: 25px;
   }

   .top-mv .container--top .list .item--2::before {
      width: 35px;
   }

   .top-mv .container--top .list .item--3:before {
      width: 30px;
   }

   .top-mv .container--top .list .item:nth-child(1), .top-mv .container--top .list .item:nth-child(2) {
      font-size: 33px;
      line-height: 40px;
   }

   .top-mv .container--top .list .item {
      width: 166px;
      font-size: 27px;
      line-height: 35px;
   }

   .top-mv .container--top .main_ttl {
      margin-bottom: 0px;
   }

   .top-mv .container--top .list {
      padding-right: 50px;
   }

   .top-mv .container--bottom .member .txtbox {
    height: 95px;
    font-size: 11px;
   }

   .top-mv .list-cont, .top-mv .list {
    font-size: 27px;
   }

   .top-mv .list-cont p {
    font-size: 27px;
   }
}

@media (max-width: 1200px) {
 /* top mv start 1200px */

 .top-mv .container--top .main_ttl, .top-mv .container--top .list {
 width: 100%;
 max-width: 800px;
 margin: 0 auto 30px;
 }

 .top-mv .container--top .main_ttl {
 width: fit-content;
 }

 .top-mv .container--top .list {
 margin-bottom: 0;
 padding-right: 0;
 }
 
 .top-mv .container--top .main_ttl .txt-small {
 font-size: 52px;
 }

 .top-mv .container--top .main_ttl .text-large {
 font-size: 60px;
 }

 .top-mv .container--top .main_ttl .text-large--1::after {
 width: 79px;
 }

 .top-mv .container--top .sub_ttl {
 font-size: 44px;
 margin-right: 0;
 top: 0;
 }

 .top-mv .container--top .list .item {
 width: 130px;
 font-size: 18px;
 }

 .top-mv .container--top .list .item:nth-child(1), .top-mv .container--top .list .item:nth-child(2) {
 font-size: 24px;
 }

 .top-mv .container--top .list .item:nth-child(3) {
 font-size: 18px;
 }

 .top-mv .container--top .list .item::before {
 top: -10px;
 }

 .top-mv .container--top .list .item{
 top: -10px;
 }

 .top-mv .container--bottom {
 width: 100%;
 max-width: 800px; 
 margin: 0 auto;
 gap: 150px;
 }

   .top-mv {
      background-position: center 93%, top;
   }

 .top-mv .container--bottom .member .txtbox {
 height: 112px;
 }

 .top-mv .list-cont, .top-mv .container--bottom .list {
 font-size: 20px;
 gap: 10px;
 }

.top-mv .list-cont .list {
    width: 262px;
 }

 .top-mv .container--bottom .member-info {
 width: 100%;
 }

 /* top mv end 1200px */

 /* concern start 1200px */
 /* concern end 1200px */

 /* moment start 1200px */
 /* moment end 1200px */

 /* seminar start 1200px */
 /* seminar end 1200px */
 
 /* schedule start 1200px */
 /* schedule end 1200px */
}

@media (max-width: 900px) {
 /* top mv start 900px */

 .top-mv .container--top .main_ttl {
 width: fit-content;
 margin-left: auto;
 margin-right: auto;
 }

 .top-mv .container--top .main_ttl .txt-small {
 font-size: 46px;
 }

 .top-mv .container--top .main_ttl .text-large {
 font-size: 52px;
 }

 .top-mv .container--top .main_ttl .text-large--1::after {
 width: 47px;
 }

 .top-mv .container--top .sub_ttl {
 font-size: 35px;
 }

 .top-mv .container--top .main_ttl, .top-mv .container--top .list {
 max-width: 690px;
 }

 .top-mv .list-cont{
 font-size: 18px;
 }

 .top-mv .list-cont p {
   font-size: 25px;
}
 

 /* top mv end 900px*/

 /* concern start 900px */
 .concern .list .item {
 font-size: 20px;
 }

 .concern .flex-box .txtbox {
 min-width: 380px;
 }

 .concern .txtbox--bottom {
 font-size: 20px;
 }
 /* concern end 900px */

 /* moment start 900px */
 /* moment end 900px */

 /* seminar start 900px */
 .seminar .cards {
 flex-wrap: wrap;
 justify-content: center;
 }

 .seminar .card {
 width: 48%;
 flex-grow: unset;
 padding: 15px 15px 15px 30px;
 }

 .schedule .cards .card--online::before,
 .schedule .cards .card--asahikawa::before,
 .schedule .cards .card--kitami::before,
 .schedule .cards .card--sapporo::before {
 width: 30px;
 font-size: 16px;
 }
 /* seminar end 900px */
 
 /* schedule start 900px */
 .schedule .cards .card_date p, .schedule .cards .card_info p {
 font-size: 16px;
 }

 .schedule .cards .card_info .text-large {
 font-size: 20px;
 }
 /* schedule end 900px*/

 .top-mv .container--bottom .member-info_desc .pc {
    display: none;
}

}

@media (max-width: 768px) {
 /* top mv start 768px */

 .top-mv {
 background: url(../img/bg/building.png), linear-gradient(to bottom, var(--orange-light) 0% 70%, var(--orange) 70% 100%);
 background-repeat: repeat-x, no-repeat;
 background-position: center 80%, top;
 background-size: auto 250px, cover;
 height: 100vh;
 min-height: 800px;
 padding-bottom: 80px !important;
 }

 .top-mv .inner {
 display: flex;
 flex-direction: column;
 justify-content: space-between;
 }

 .top-mv .imgbox.sp {
 display: block;
 position: absolute;
 left: 0;
 bottom: 60px;
 width: 50%;
 max-width: 250px;
 z-index: 2;
 }

 .top-mv .container--top {
 height: 70%;
 }

 .top-mv .container--top .sub_ttl {
 display: block;
 font-size: 32px;
 }

 .top-mv .container--top .sp-block {
 display: block;
 }

 .top-mv .container--top .list .item {
 padding: 15px;
 font-size: 16px;
 }

 .top-mv .container--top .list .item:nth-child(1), .top-mv .container--top .list .item:nth-child(2) {
 font-size: 19px;
line-height: 22px;
 }

 .top-mv .container--top .list .item:nth-child(3) {
   font-size: 15px;
   line-height: 20px;
 }

 .top-mv .container--top .main_ttl {
 text-align: center;
 margin-bottom: 25px;
 line-height: unset;
 }

 .top-mv .container--top .main_ttl .txt-small {

 font-size: 40px;
 }

 .top-mv .container--top .main_ttl br {
 display: none;
 }

 .top-mv .container--top .main_ttl .text-large {
 font-size: 44px;
 }

 .top-mv .container--top .main_ttl .text-large--2 {
 display: block;
 }

 .top-mv .container--top .list .item {
 width: 110px;
 }

 .top-mv .container--top .list .item--1::before{
 width: 23px;
 height: 42px;
 left: 6px;
 }
 
 .top-mv .container--top .list .item--2::before{
 width: 31px;
 height: 40px
 }
 
 .top-mv .container--top .list .item--3::before{
 width: 28px;
 height: 43px;
 top: 2px;
 left: 2px;
 }

 .top-mv .container--bottom {
 position: relative;
 width: 50%;
 flex-direction: column;
 align-items: flex-end;
 height: unset;
 gap: 15px;
 margin: unset;
 margin-left: auto;
 margin-bottom: 20px;
 gap: 10px;
 }

 .top-mv .container--bottom .member {
 position: static;
 }

 .top-mv .container--bottom .member .txtbox .text-large {
 font-size: 16px;
 }

 .top-mv .container--bottom .member .txtbox {
 background: url(../img/bg/ribbon-white.png) no-repeat;
 aspect-ratio: 2 / 1;
 text-align: center;
 color: #000;
 background-position: center;
 background-size: 100% 100%;
 padding: 10px;
 padding-right: 19px;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 position: relative;
 z-index: 1;
 height: 97px;
 width: unset;
 }

 .top-mv .container--bottom .member .imgbox {
 display: none;
 }

 .top-mv .list-cont.pc {
    display: none;
 }
 .top-mv .list-cont .list  {
    width: unset;
 }

 .top-mv .container--bottom {
 align-items: flex-start;
 margin-bottom: 0;
 }

 .top-mv .container--bottom .member {
 margin: unset;
 }

 .top-mv .container--bottom .member-info {
 width: 100%;
 }

 .top-mv .list-cont.sp {
 display: flex;
 justify-content: center;
 margin-bottom: 0;
 position: absolute;
 left: 0;
 bottom: 0;
 padding: 10px 3%;
 width: 100vw;
 background: var(--orange-light);
 height: 60px;
 z-index: 6;
 }

 .top-mv .list-cont.sp .list .item {
 background: var(--orange);
 color: #fff;
 z-index: 8;
 font-size: 16px;
 }

 .top-mv .list-cont.sp p {
 color: var(--orange);
 font-size: 16px;
 }

 /* top mv end 768px */

 /* concern start 768px */
 .concern .list .item {
 font-size: 18px;
 }

 .concern .flex-box .txtbox {
 min-width: 370px;
 }

 .concern .list .item::before {
 padding-left: 35px;
 width: 30px;
 height: 30px;
 }

 .concern .txtbox--bottom,
 .seminar .card_ttl {
 font-size: 18px;
 }
 /* concern end 768px */

 /* moment start 768px */
 .moment {
 background: url(../img/top/moment/bg-sp-1.png) no-repeat;
 background-size: 100% 100%;
 background-position: center;
 padding-bottom: 75px !important;
 }
 /* moment end 768px */

 /* seminar start 768px */
 /* seminar end 768px */
 
 /* schedule start 768px */
 .schedule .cards {
 flex-direction: column;
 }

 .schedule .cards .card {
 width: 100%;
 max-width: 400px;
 margin: 0 auto;
 padding-left: 30px;
 }

 .schedule .cards .card.empty {
 display: none;
 }
 /* schedule end 768px */

 .seminar .btn_box {
   flex-direction: column;
   align-items: center;
 }
}

@media (max-width: 680px) {
 /* top mv start 680px */

 /* top mv end 680px */

 /* concern start 680px */
 .concern .list .item,
 .seminar .card_ttl {
font-size: 30px;
text-align: start;
margin-bottom: 0;
margin-top: 20px;
 }

 .concern .list .item:last-child {
 margin-bottom: 0;
 }

 .concern .txtbox--bottom {
 font-size: 18px;
 }
 /* concern end 680px */

 /* moment start 680px */

 .moment .imgbox {
 display: none;
 }

 .moment .txtbox {
text-align: center;
font-size: 14px;
 }

 .moment .txtbox p br {
   display: none;
 }

 .moment .txtbox span {
 display: block;
 }

 .moment .txtbox br {
 display: none;
 }

 .moment .imgbox--sp {
 display: flex;
 flex-direction: column;
 align-items: center;
 }

 .moment .imgbox--sp .img-item {
 margin-bottom: 20px;
 }

 .moment .imgbox--sp .img_ttl {
 font-size: 18px;
 width: fit-content;
 margin: 0 auto;
 margin-bottom: 16px;
 position: relative;
 }

 .moment .imgbox--sp .img_ttl::before {
 content: "";
 display: inline-block;
 width: 20px;
 height: 2px;
 background: #000;
 position: absolute;
 top: 50%;
 left: -24px;
 transform: translateX(-50%);
 }

 .moment .imgbox--sp .img_ttl::after {
 content: "";
 display: inline-block;
 width: 20px;
 height: 2px;
 background: #000;
 position: absolute;
 top: 50%;
 right: -40px;
 transform: translateX(-50%);
 }

 .moment .imgbox--sp .img_cont {
 width: 100%;
 max-width: 400px ;
 }

 .moment .imgbox--sp .img_cont img {
 width: 100%;
 height: 100%;
 }
 /* moment end 680px */

 /* seminar start 680px */
 .seminar .card_img {
    width: 50px;
    height: 50px;
    margin: unset;
    position: absolute;
    right: 25px;
}
 /* seminar end 680px */
 
 /* schedule start 680px */
 /* schedule end 680px */
}

@media (max-width: 576px) {
 /* top mv start 576px */
 .top-mv {
background: url(../img/bg/building.png), linear-gradient(to bottom, var(--orange-light) 0% 70%, var(--orange) 70% 100%);
background-repeat: repeat-x, no-repeat;
background-position: center 70%, top;
background-size: auto 150px, cover;
 height: 100vh;
 min-height: 745px;
 padding-bottom: 80px !important;
 }

 .top-mv .container--top {
 padding-top: 85px;
 }

 .top-mv .container--top .sub_ttl {
 font-size: 24px;
 width: fit-content;
 margin: 0 auto;
 padding: 0 4px 8px;
 }

 .top-mv .container--top .main_ttl .txt-small {
 font-size: 32px;
 }

 .top-mv .container--top .main_ttl .text-large {
 font-size: 36px;
 }

 .top-mv .container--top .main_ttl .text-large--1::after {
 width: 40px;
 }

 .top-mv .container--top .main_ttl {
 margin-bottom: 15px;
 }

 .top-mv .container--top .list {
 gap: 10px;
 justify-content: center;
 }

 .top-mv .container--top .list .item {
 font-size: 14px;
 width: 103px;
 padding: 10px;
 }

 .top-mv .container--top .list .item::before {
 top: 7px;
 left: 10px;
 }

 .top-mv .container--top .list .item--1:before {
 width: 15px;
 }

 .top-mv .container--top .list .item--2:before {
 width: 21px;
 }

 .top-mv .container--top .list .item--3:before {
 width: 18px;
 }

 .top-mv .imgbox.sp {
 width: calc(100% - 260px);
 max-width: 210px;
 left: 2.2%;
 }

 .top-mv .container--bottom {
 width: 250px;
 padding-left: 10px;
 }
 
.top-mv .container--bottom .member-info_desc {
   font-size: 12px;
   line-height: 20px;
}

 .top-mv .container--bottom .member .txtbox {
   width: 170px;
   padding: 10px 4px;
   padding-right: 18px;
   aspect-ratio: unset;
   height: unset;
   font-size: 12px;
 }

 .top-mv .container--bottom .member .txtbox .text-large {
 font-size: 14px;
 }

 .top-mv .list-cont.sp .list .item, .top-mv .list-cont.sp p {
 font-size: 16px;
 }
 /* top mv end 576px */

 /* concern start 576px */
 .concern .flex-box {
 position: relative;
 }

 .concern .flex-box .txtbox {
 width: 100%;
 min-width: unset;
 }

 .concern .list .item::before {
 top: 0;
 transform: translateY(0);
 }

 .concern .flex-box .imgbox {
 position: absolute;
 top: 0;
 right: 20px;
 width: 100px;
 height: 100px;
 }

 .concern .txtbox--bottom .sp {
 display: block;
 }
 /* concern end 576px */

 /* moment start 576px */

 .moment .section_ttl .sp {
 display: block;
 }

 .moment .section_ttl .text-orange::after {
 height: 15px;
 right: 0;
 bottom: -5px;
 }
 /* moment end 576px */

 /* seminar start 576px */

 .seminar .card, .seminar .btn_box {
 max-width: 400px;
 margin: 0 auto;
 }

 .seminar .card {
 width: 100%;
 aspect-ratio: unset;
padding: 20px;
 }

 .seminar .btn_box {
 flex-direction: column;
 }

 .seminar .btn_box .btn {
 width: 100%;
 font-size: 25px;
 }
 /* seminar end 576px */
 
 /* schedule start 576px */
  .schedule .cards .card_date p {
   font-size: 25px;
 }
  .schedule .cards .card_info p {
   font-size: 12px;
 }

.schedule .cards .card_info .text-large {
   font-size: 20px;
}

.schedule .cards .card_date {
    width: 70px;
}

.schedule .cards .card_info .time span,
.schedule .cards .card_info .venue span {
    font-size: 8px;
}

.schedule .cards .card_info .time, .schedule .cards .card_info .venue {
   font-size: 12px;
}
.schedule .cards .card--online .card_info .venue {
   font-size: 12px;
}
 /* schedule end 576px */

  footer .my-60 {
   margin-bottom: 0;
  }

 footer .inner {
   display: flex;
   flex-direction: column-reverse;
   gap: 20px;
 }

 footer .sp {
   display: block;
 }

 footer .txtbox p {
    font-size: 18px;
 }
}

@media (max-width: 440px) {
 /* top mv start 400px */

 .top-mv {
 padding-bottom: 74px !important;
 }

 .top-mv .container--top .sub_ttl {
 font-size: 32px;
 }

 .top-mv .container--top .main_ttl .txt-small {
font-size: 40px;
 }
 
.top-mv .container--top .main_ttl .txt-small2 {
font-size: 42px;
}

 .top-mv .container--top .main_ttl .text-large {
 font-size: 42px;
 }

 .top-mv .container--bottom {
width: 50%;
height: 25%;
align-items: center;
margin-bottom: 0;
 }
 
 .top-mv .container--bottom .member-info_desc {
font-size: 9px;
position: relative;
z-index: 3;
padding: 8px;
max-width: unset;
line-height: 15px;
padding: 0 0 10px;
 }

 .top-mv .container--bottom .member-info_desc .sp {
    display: block;
 }

 .top-mv .container--bottom .member-info_desc .pc {
   display: none;
 }

 .top-mv .imgbox.sp {
   z-index: 0;
   left: 0;
   width: 100%;
   max-width: 185px;
 }

 .top-mv .list-cont.sp {
 height: 74px;
 }

 .top-mv .list-cont.sp .list .item, .top-mv .list-cont.sp p {
 font-size: 14px;
 }
 /* top mv end 400px */

 /* concern start 400px */
 .concern .flex-box {
 flex-direction: column-reverse;
 gap: 20px;
 }

 .concern .list .item {
 font-size: 14px;
 padding-left: 35px;
 min-height: 30px;
 margin-bottom: 0;
 margin-top: 0;
 }

 .concern .list .item::before, .top-mv .container--top .list .item--1::before, .top-mv .container--top .list .item--2::before, .top-mv .container--top .list .item--3::before {
 top: 3px;
 }

 .concern .list .item::before {
 top: 0;
 width: 20px;
 height: 20px;
 }
 /* concern end 400px */

 /* moment start 400px */
 /* moment end 400px */

 /* seminar start 400px */
 /* seminar end 400px */
 
 /* schedule start 400px */
 /* schedule end 400px */
}

@media (max-width: 400px) {
 /* top mv start 400px */
 /* top mv end 400px */

 /* concern start 400px */
 /* concern end 400px */

 /* moment start 400px */
 /* moment end 400px */

 /* seminar start 400px */
 /* seminar end 400px */
 
 /* schedule start 400px */
 /* schedule end 400px */
}

@media (max-width: 380px) {

 .top-mv .container--top .list .item {
 font-size: 12px;
 width: 95px;
 }

 .concern .list .item::before, .top-mv .container--top .list .item--1::before, .top-mv .container--top .list .item--2::before, .top-mv .container--top .list .item--3::before {
 top: 0;
 }

 .schedule .cards .card_date p, .schedule .cards .card_info p {
 font-size: 12px;
 margin-bottom: 0;
 }

 .schedule .cards .card_info .time {
   margin-bottom: 5px;
 }

 .schedule .cards .card_info .text-large {
 font-size: 18px;
 }

 .schedule .cards .card_date {
 width: 35px;
 }

 .schedule .cards .card_date .num-large {
 font-size: 22px;
 }

 .schedule .cards .card_date {
    line-height: 23px;
 }
}

@media (max-width: 320px) {

 .schedule .cards .card {
 flex-direction: column;
 gap: 10px;
 padding-left: 40px;
 }

 .schedule .cards .card_date {
 flex-direction: row;
 justify-content: flex-start;
 width: 100%;
 }

 .schedule .cards .card_date::after {
 content: "";
 position: absolute;
 left: 0;
 bottom: -5px;
 width: 100%;
 border-bottom: 2px dashed #CFCFCF;
 background: unset;
 }

 .schedule .cards .card_info {
 width: 100%;
 }
}

@media (max-width: 375px) and (max-height: 667px) {
   .top-mv {
      min-height: 667px;
   }

   .top-mv .container--top {
      padding-top: 90px;
   }

   .top-mv .container--top .sub_ttl {
      font-size: 25px;
   }

   .top-mv .container--top .main_ttl .txt-small {
      font-size: 30px;
   }

   .top-mv .container--top .main_ttl .txt-small2 {
      font-size: 30px;
   }

   .top-mv .container--top .main_ttl .text-large {
      font-size: 30px;
   }

   .top-mv .imgbox.sp {
      max-width: 175px;
   }

   .top-mv .list-cont .list {
      gap: 6px;
   }

   .top-mv .list-cont.sp .list .item, .top-mv .list-cont.sp p {
      font-size: 18px;
   }

    .moment {
      background: url(../img/top/moment/bg-sp-2.png) no-repeat;
      background-size: 200% 100%;
      background-position: center;
   }

   .moment .txtbox {
      font-size: 13px;
   }

   footer .txtbox p {
      font-size: 13px;
   }
}