/*
 * 20230703 Maromaro
 * 最新のSCSSファイルが無いのでCSSで作成している
 * 誤ってコンパイルさせて本番アップさせないようにCSSファイルで記述
*/

/* ----------------------------------------------------------------------------
* Table Of Content
*
* 学科詳細ページ
*   DEPARTMENT FOCUSが一番最後の時
*   特設ページはこちら
*   目指す将来
*   FOCUS
*     .item2
*   その他スタイル
* 学科一覧ページ
*   一覧リストスタイル
*   一覧リストカラー
*   Sub-Curriculum
*   ページ下部スペースアキ
----------------------------------------------------------------------------*/


/* ----------------------------------------------------------------------------
* 学科詳細ページ
----------------------------------------------------------------------------*/
/*--------------------------------------
 * DEPARTMENT FOCUSが一番最後の時
 * →下部スペースにアキができるための調整スタイル
-------------------------------------- */
#course .course_top .topics.topics_bottom_space {
  margin-bottom: 0;
  padding-bottom: 80px;
}

@media only screen and (max-width: 768px), print{
  #course .course_top .topics.topics_bottom_space {
    padding-bottom: 30px;
  }
}


/*--------------------------------------
 * 特設ページはこちら
-------------------------------------- */
.main_block .special_page {
  margin-top: 50px;
}

#course .course_top .main_block .special_page {
  text-align: center;
}

#course .course_top .main_block .special_page .ttl {
  font-size: 18px;
  text-align: center;
  display: inline-block;
}

#course .course_top .main_block .special_page .ttl .sp {
  display: none;
}

#course .course_top .main_block .special_page .ttl:before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 1em;
  background-color: #252525;
  -webkit-transform: rotate(-20deg);
  transform: rotate(-20deg);
  margin-right: 0.8em;
  position: relative;
  bottom: -0.1em;
}

#course .course_top .main_block .special_page .ttl:after {
  content: "";
  display: inline-block;
  width: 3px;
  height: 1em;
  background-color: #252525;
  -webkit-transform: rotate(20deg);
  transform: rotate(20deg);
  margin-left: 0.8em;
  position: relative;
  bottom: -0.1em;
}

@media only screen and (max-width: 768px), print{
  #course .course_top .main_block .special_page .ttl {
    font-size: 14px;
  }
  #course .course_top .main_block .special_page .ttl .sp {
    display: block;
  }
}


/*--------------------------------------
 * 目指す将来
-------------------------------------- */
#course .course_top .job .job_wrap {
  background-color: #FFF;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: top;
  -ms-flex-align: top;
  align-items: top;
  padding: 20px 20px 10px 20px;
  margin-bottom: 30px;
}

#course .course_top .job .job_wrap .item {
  width: 48%;
}

#course .course_top .job .job_wrap .item .row2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: top;
  -ms-flex-align: top;
  align-items: top;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#course .course_top .job .job_wrap .item ul li {
  text-indent: 0;
}

#course .course_top .job .job_wrap .item .row2 li {
  width: 48%;
}

#course .course_top .job .job_wrap .item .row2 li::before {
  top: 7px;
}


@media only screen and (max-width: 768px), print{
  #course .course_top .job .job_wrap {
    display: block;
  }
  #course .course_top .job .job_wrap .item {
    width: 100%;
    margin-bottom: 10px;
  }

  #course .course_top .job .job_wrap .item .row2 {
    display: block;
  }

  #course .course_top .job .job_wrap .item .row2 li {
    width: 100%;
  }
}


/* --------------------------------------
 * FOCUS
--------------------------------------*/
/* .item2 */
@media only screen and (min-width: 769px){
  #course .course_top .topics .item2  .item {
    position: static;
  }
  .topics .item2 .item .info_area {
    padding: 0 25px 25px 0 !important;
  }
}
@media only screen and (max-width: 768px), print{
  #course .course_top .topics .item2  .item {
    position: static;
  }
  .topics .item2 .item .info_area {
    padding: 0 0 25px 0 !important;
  }
}

/* --------------------------------------
 * その他スタイル
--------------------------------------*/
@media only screen and (min-width: 769px){
  #course .pc-white-space-nowrap{
    white-space: nowrap;
  }
}

/* ----------------------------------------------------------------------------
* 学科一覧ページ
----------------------------------------------------------------------------*/
/* --------------------------------------
 * 一覧リストスタイル
--------------------------------------*/
#course .course_lists li{
  padding: 10px !important;
}

#course .course_lists li.wide_col{
  width: 100%;
}

#course ul.course_lists li h3{
  padding: 0;
}

#course ul.course_lists li h3::before{
  content: none !important;
}

#course ul.course_lists li h3 a{
  padding: 0.9em 3em 0.9em 1em;
  color: #252525;
  border: solid 2px #ccc;
  position: relative;
  font-size: 18px;
  display: flex;
  align-items: center;
  text-align: left;
}

#course ul.course_lists li h3 a.anchor_border_none{
  border: 0;
}

/* #course .english .course_top .inner li:before, #course .english .course_top .inner .list_item:before {
  content: none !important;
} */

#course ul.course_lists li h3 a::before{
  display: block;
  content: "";
  position: absolute;
  border: solid 1px #252525;
  border-radius: 50%;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  right: 10px;
  width: 20px;
  height: 20px;
}

#course ul.course_lists li h3 a::after{
  display: block;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  right: 17px;
  content: "\f105";
  font-family: "FontAwesome";
  font-size: 15px;
}

/* --------------------------------------
 * 一覧リストカラー
--------------------------------------*/
#course ul.course_lists li.color_1 h3>a{
  border-color: #EA6176;
}
#course ul.course_lists li.color_2 h3>a{
  border-color: #00A040;
}
#course ul.course_lists li.color_3 h3>a{
  border-color: #C20051;
}
#course ul.course_lists li.color_4 h3>a{
  border-color: #0062B1;
}
#course ul.course_lists li.color_5 h3>a{
  border-color: #f4c200;
}
#course ul.course_lists li.color_6 h3>a{
  border-color: #0098d8;
}
#course ul.course_lists li.color_7 h3>a{
  border-color: #7fbe26;
}
#course ul.course_lists li.color_8 h3>a{
  border-color: #EB6100;
}
#course ul.course_lists li.color_9 h3>a{
  border-color: #f29600;
}
#course ul.course_lists li.color_10 h3>a{
  border-color: #90529c;
}
#course ul.course_lists li.color_11 h3>a{
  border-color: #003984;
}
#course ul.course_lists li.color_12 h3>a{
  border-color: #c20051;
}
#course ul.course_lists li.color_13 h3>a{
  border-color: #868905;
}
#course ul.course_lists li.color_14 h3>a{
  border-color: #EB6100;
}
#course ul.course_lists li.color_15 h3>a{
  border-color: #0097E0;
}
#course ul.course_lists li.color_16 h3>a{
  border-color: #00B097;
}


/* --------------------------------------
 * Sub-Curriculum
--------------------------------------*/
#course .sec_4 {
  /* padding-top: 100px; */
}

#course .sec_4 > .inner {
  margin-top: 30px;
  padding-top: 30px;
  padding-bottom: 30px;
  border-top: dotted 1px #333;
}

#course .sec_4 h2{
  white-space: nowrap;
}

#course .sec_4 ul.course_lists li h3 a{
  font-weight: normal;
}

#course .sec_5 {
  margin-top: 30px;
}

#course .sec_5 > .inner {
  padding-top: 30px;
  padding-bottom: 30px;
  border-top: dotted 1px #333;
}

#course .course_note {
  margin-top: 30px;
}

#course .course_note p {
  font-size: 14px;
}

#course .course_note  .course_note__list {
    display: block;
    margin-left: 25px;
    width: calc(100% - 25px);
}

#course .course_note  .course_note__list li {
  width: 100%;
  list-style: disc;
  padding: 0;
  font-size: 14px;
}

/* --------------------------------------
 * ページ下部スペースアキ
 * ※アキがなかったため追加
--------------------------------------*/
#course .sec_bottom_space{
  padding-bottom: 40px;
  margin-bottom: 40px;
}


@media only screen and (max-width: 768px), print{
  #course .sec_bottom_space{
    padding-bottom: 30px;
    margin-bottom: 30px;
  }
}

#about .sec_1 h2 {
  max-width: 512px;
  margin: 0 auto 30px;
}

#about .sec_1 p {
  max-width: 512px;
  margin: 0 auto;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 1.8;
}

.contents .cont__under__header {
  padding-top: 65px;
  position: relative;
}

#about .sec_1 {
  padding: 80px 0 80px;
}

@media only screen and (max-width: 768px), print {
  .contents .cont__under__header {
    padding-top: 0;
  }
}