@charset "UTF-8";
/**
 * トレーニング情報
 *
 * 01. トレーニング情報ヘッダー
 *
 */
/* ==========================================================================
   01. トレーニング情報ヘッダー
   ========================================================================== */

.top_catch {
  margin-bottom: 30px;
  font-size: 16px;
}

#training_mainv {
  background: url(../img/training_main.png) no-repeat 40%;
  background-size: cover;
  position: relative;
  padding: 100px 0;
  height:600px;
  margin-top: -130px;
}

#training_mainv h1 {
  color: #ffffff;
  text-align: center;
  font-size: 70px;
  font-size: 7.0rem;
  font-family: "M PLUS Rounded 1c", sans-serif;
  margin-bottom: 80px;
}

@media screen and (max-width: 767px) {
  #training_mainv h1 {
    font-size: 37px;
    font-size: 3.7rem;
  }
}

.training_note {
  font-size: 50px;
  font-size: 5.0rem;
  line-height: 0.5;
  font-family: "M PLUS Rounded 1c", sans-serif;
}

.training_lead {
  text-align: center;
  margin: 80px auto 0;
  width: 50%;
  color: #ffffff;
  text-align: center;
  line-height: 2.0;
  font-family: "M PLUS Rounded 1c", sans-serif;
}

@media screen and (max-width: 767px) {
.training_lead {
 margin: 120px auto 0;
  width: 90%;
}
.training_note {
  font-size: 25px;
  font-size: 2.5rem;
}
  }


.training_catch {
  color: #ffffff;
  text-align: center;
  font-size: 25px;
  font-size: 2.5rem;
  font-family: "M PLUS Rounded 1c", sans-serif;
}

.training_catch_box {
  text-align: center;
  background-color: #F3F5F6;
  border-radius: 5px;
}

.main-visual_top {
    position: relative;
}

.main-visual_bottom {
  background-color: #ffffff;
  color: #666;
  width: 50%;
  margin: 0 auto;
  border-radius: 15px;
  position: absolute;
  left: 25%;
  top: 340px;
}


.main-visual_approach {
       max-width: 1280px;
      text-align: center;
      margin: 0 auto;
      padding: 180px 0 0;
line-height: 3;
    font-size: 20px;
}

@media screen and (max-width: 767px) {
.main-visual_approach {
font-size: 1.6rem;
font-size: 16px;
  text-align: left;
    padding: 350px 0 0;
}
}

.training_container {
      max-width: 1280px;
      margin: 0 auto;
      padding-bottom: 40px;
        font-size: 16px;
  font-size: 1.6rem;
  line-height: 2.0;
  font-family: "M PLUS Rounded 1c", sans-serif;
}

.last_box_bottom {
  padding-bottom: 150px;
  margin-top: -30px;
}

.training_container_inner p {
  padding: 0 20px;
}

.training_subtitle {
      border-radius: 5px;
      font-size: 21px;
}

.training_container_inner {
    margin: 50px 0;
}

.training_container_inner_row {
    display: flex;
    justify-content: center;
    width: 100%;
    gap: 24px;
}


@media screen and (max-width: 767px) {
.training_container_inner p {
  padding: 10px;
}

.training_subtitle {
  padding-top: 20px;
}

.training_container_inner {
    margin: 25px 0;
}
.training_container_inner_row {
 flex-direction: column;
 padding: 10px;
}
.description {
  margin: 20px;
}
.last_box_bottom {
  padding-bottom: 120px;
}
}


.training_container_inner h3 {
    margin-bottom: 15px;
    font-size: 30px;
    font-size: 3rem;
    font-weight: bold;
    color: #006fd6;
}

@media screen and (max-width: 767px) {
  .training_container_inner h3 {
        color: #333;
  }
}


.training_row_content h3 {
    margin-bottom: 15px;
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
    text-align: center;
    margin: 40px 0 20px;
}

.training_row_content p {
 line-height: 3;
 font-size: 16px;
}

.training_notes {
  font-size: 10px;
}

@media screen and (max-width: 767px) {
.vimeo {
position: relative;
height: 0;
padding: 0 0 56.25%;
overflow: hidden;
margin: 0 20px;
}
.vimeo iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}
.thick_characters {
  font-weight:600;
}

.cource_detail_list {
  margin: 0px 10px 10px 10px;
}

.cource_detail_list li {
  color:#555;
  margin-left: 20px;
}


.cource_attention_list {
  margin: 20px;
}

.training_catch_box {
  padding: 60px;
  margin-bottom: 80px;
}

@media screen and (max-width: 767px) {
.training_catch_box {
  padding: 20px;
  margin-bottom: 60px;
}
}

.training_under_catch {
  margin-top: 40px;
  text-align: center;
  font-size: 30px;
  font-size: 3.0rem;
  font-family: "M PLUS Rounded 1c", sans-serif;
  color: #006fd6;
}

.training_under_explain {
  text-align: center;
  font-size: 25px;
  font-size: 2.5rem;
  font-family: "M PLUS Rounded 1c", sans-serif;
}

#training_video {
  text-align: center;
  margin: -40px auto 40px;  
}

.button_list_top {
  margin-top: 140px;
}

.training_button_list {
  display: flex;
  justify-content: center;
  width: 100%;
  gap: 24px;
}


.training_button_item {
  max-width: calc((100% - 48px) / 4); 
  flex: 1;
  display: flex;
  justify-content: center;
}

.training_button_link {
  border:#006fd6 2px solid;
  border-radius: 10px;
  padding: 20px;
  width: 100%;
  text-align: center;
}

.training_button_item a {
       text-decoration: none;
  }

.training_navi_list {
  display: flex;
  justify-content: center;
  border-bottom: 1px solid #ddd;
  padding-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .training_navi_list {
  padding-bottom: 40px;
  margin-top: -70px;
}
}

.training_navi_list_item {
  max-width: calc((100% - 48px) / 4); 
  flex: 1;
  display: flex;
  justify-content: center;
  font-size: 20px;
}

@media screen and (max-width: 767px) {
.training_navi_list_item {
  max-width: calc((100%) / 4); 
  font-size: 16px;
}
.training_button_list {
  flex-direction: column;
}
.training_button_item {
  margin: 0 20px;
  max-width:100%; 
}
}

.training_navi_list_box {
  margin-top: 180px;
}

.arrow_r_b {
  position: relative;
  display: inline-block;
  padding-left: 22px;
  text-decoration: none;
}

@media screen and (max-width: 767px) {
 .training_navi_list_box {
  margin-top: 140px;
} 
.arrow_r_b {
  padding-left: inherit;
}
}

.arrow_r_b:before {
  content: '';
  width: 16px;
  height: 16px;
  background: #006fd6;
  border-radius: 50%;
  position: absolute;
  /* top: 0; */
    top: 30%;
  right: -34px;
  margin: auto;
}

.arrow_r_b:after {
  content: '';
  width: 5px;
  height: 5px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  transform: rotate(135deg);
  position: absolute;
  top: -3px;
  right: -29px;
  bottom: 0;
  margin: auto;
}

@media screen and (max-width: 767px) {
  .arrow_r_b:before {
  /* top: 0; */
  top: auto;
  bottom: -25px;
  right: 30%;
  margin: auto;
}
.arrow_r_b:after {
  top: auto;
 right: 38%;
 bottom: -20px;
}
}

html {
	scroll-behavior: smooth;
  color: #1a1a1a;
}

.instructor {
  background: #f3f5f6;
    padding: 0 10px;
    border-radius: 5px;
    margin-top: 10px;
    display: inline-block;
    width: 85px;
}

.instructor_box {
  display:flex;
  padding: 10px;
}

@media screen and (max-width: 767px) {
  .instructor_box {
    justify-content: center;
    align-items: center; 
    flex-direction: column;
  }
}

.instructor_box img {
  border:#F3F5F6 2px solid;
}

.training_faq dt {
  padding: 10px;
  font-weight: bold;
}

.training_faq dd {
  padding: 0px 10px 10px 27px;
  margin-left:20px;
}

.training_faq dt:before {
    content: 'Q.';
    color: #bdc4c4;
    display: inline-block;
    font-size: 2rem;
    letter-spacing: .04em;
    margin-right: 14px;
}

.training_row_content {
max-width: calc((100% - 20px) / 2);
  background-color: #F3F5F6;
  border-radius: 15px;
  padding: 20px 40px 40px;
  text-align: center;
}

@media screen and (max-width: 767px) {
.training_row_content {
    max-width: 100%;
    margin: 0 10px;
    padding: 20px;
    text-align: left;
}
}

.training_container_detail {
  padding: 40px;
  border-radius: 15px;
  border: 1px solid #ddd;
}

@media screen and (max-width: 767px) {
.training_container_detail {
  padding: 20px;
}
}

.training_container_detail_gray {
  background-color: #F3F5F6;
  padding: 50px;
  border-radius: 15px;
}

.totaltime {
  margin-top: 20px;
}

.training_fee {
margin-top: 70px;
}