@charset "UTF-8";
/* Scss Document */
@import url(/src/css/reset.css);
body {
  font-family: "Noto Serif JP", serif !important; }

#lp_ucla {
  background: #fefdfc;
  font-family: ryo-gothic-plusn,"Helvetica Neue", Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 1.8em;
  letter-spacing: 0.8pt;
  color: #3e3a39;
  /* パソコンで見たときは"pc"のclassがついた画像が表示される */
  /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
  /*----------- custom -----------*/
  /*===========
  cvarea
  =============*/ }
  #lp_ucla header {
    padding: 25px 0; }
  #lp_ucla h1::before {
    display: none; }
  #lp_ucla p {
    margin-bottom: 0;
    font-family: "Noto Serif JP", serif; }
  #lp_ucla a {
    color: #564226; }
  #lp_ucla .pc {
    display: block !important; }
  #lp_ucla .sp {
    display: none !important; }
  @media only screen and (max-width: 750px) {
    #lp_ucla .pc {
      display: none !important; }
    #lp_ucla .sp {
      display: block !important; } }
  #lp_ucla .small {
    font-size: 13px;
    color: #323232; }
  #lp_ucla h2 {
    font-size: 25px;
    font-weight: 600;
    padding: 15px 0;
    text-align: center;
    position: relative;
    margin-top: 30px; }
    #lp_ucla h2 span {
      font-size: 20px; }
  #lp_ucla h2::after {
    content: "";
    display: block;
    width: 20%;
    height: 3px;
    background-color: #3e3a39;
    margin: 0 auto;
    margin-top: 15px; }
  @media (min-width: 200px) and (max-width: 770px) {
    #lp_ucla .fv_line {
      font-size: 19px; }
    #lp_ucla h2 {
      font-size: 20px; }
    #lp_ucla h3 {
      font-size: 20px;
      font-weight: 900; } }
  #lp_ucla h3 {
    font-size: 26px;
    font-weight: 900;
    line-height: 1.5em; }
  #lp_ucla h4 {
    font-size: 18px;
    font-weight: bold; }
    #lp_ucla h4 span {
      font-size: 13px;
      font-weight: normal; }
  #lp_ucla .font-gold {
    color: #927c56; }
  #lp_ucla .font-blue {
    color: #0087ae; }
  #lp_ucla .font-pink {
    color: #ff7372; }
  #lp_ucla .bold {
    font-weight: bold; }
  #lp_ucla .pick {
    font-size: 27px; }
  #lp_ucla .marker_yellow {
    background: linear-gradient(transparent 60%, #ff6 60%); }
  #lp_ucla .main_img2 {
    background: url("../images/bg.png") no-repeat center bottom;
    background-color: rgba(255, 255, 255, 0.3);
    background-blend-mode: lighten;
    background-size: cover;
    width: 100%;
    /*		height: 480px;*/
    display: flex;
    justify-content: center;
    align-items: center; }
    @media (min-width: 200px) and (max-width: 770px) {
      #lp_ucla .main_img2 .main_img2 {
        height: 120px; }
      #lp_ucla .main_img2 .title2 {
        padding: 15px;
        line-height: 22px;
        font-weight: 700;
        font-size: 22px; }
        #lp_ucla .main_img2 .title2 span {
          font-size: 15px; } }
  #lp_ucla .day {
    color: #024424;
    font-weight: bold;
    font-size: 18px;
    text-align: center; }
  #lp_ucla .cast {
    font-size: 16px;
    text-align: center;
    line-height: 1.3em; }
  #lp_ucla #bg_blue {
    background: #edf2eb;
    z-index: -99; }
  #lp_ucla .stepbar {
    max-width: 750px;
    margin: 0 auto;
    width: 100%; }
  #lp_ucla .stepbar .stepbarwrap {
    margin: 2em 0;
    position: relative; }
  #lp_ucla .stepbar .stepbarwrap .steptitle {
    display: inline-flex;
    align-items: center; }
  #lp_ucla .stepbar .stepbarwrap .steptitle .stepcircle {
    display: inline-block;
    width: 1em;
    height: 1em;
    content: "";
    border-radius: 50%;
    background-color: #024424;
    border: 2px solid #024424; }
  #lp_ucla .stepbar .stepbarwrap .steptitle .stepnum {
    padding-left: 1em;
    font-size: 1em;
    color: #024424; }
  #lp_ucla .stepbar .stepbarwrap .steptxt {
    padding-left: 2em; }
  #lp_ucla .stepbar .stepbarwrap .steptxt .steptxt-title {
    margin: 0.5em 0;
    font-weight: bold;
    font-size: 1.2em; }
  #lp_ucla .stepbar .stepbarwrap .steptxt .steptxt-txt {
    font-size: 16px; }
  #lp_ucla .push {
    font-weight: bold;
    line-height: 2em; }
  #lp_ucla .stepbar .stepbarwrap .stepline {
    width: 2px;
    height: calc(100% + 1em);
    background-color: #024424;
    position: absolute;
    top: 1em;
    left: 0.4em; }
  #lp_ucla .stepbarwrap:last-of-type .stepline:last-of-type {
    display: none; }
  @media screen and (max-width: 960px) {
    #lp_ucla .stepbar {
      width: 90%; } }
  #lp_ucla .logo {
    /*        img {max-width: 250px;
            width: 100%;
            margin: 0 auto;}*/
    /* ロゴの最大サイズを定義し、一貫性を保つ */
    /* ロゴアイテムの最小幅を設定し、小さい画面での折り返しを制御 */
    /* 小さい画面での調整 (例: 2列表示) */
    /* 中間画面での調整 (例: 3列表示) */
    /* 大きい画面での調整 (例: 5列表示) */ }
    #lp_ucla .logo .logo-img {
      max-width: 200px;
      /* ロゴの最大幅を調整 */
      max-height: 100px;
      /* ロゴの最大高さを調整 */
      object-fit: contain;
      /* アスペクト比を保ちつつ、指定されたサイズに収める */
      width: 100%;
      /* 親要素の幅に合わせて拡大縮小 */
      height: auto;
      /* 高さを自動調整 */ }
    #lp_ucla .logo .logo-item {
      flex-basis: 200px;
      /* 各ロゴアイテムの基準幅 (ロゴの最大幅より少し大きめに設定) */
      flex-grow: 1;
      /* スペースがある場合に拡大 */
      flex-shrink: 1;
      /* スペースがない場合に縮小 */ }
    @media (max-width: 575.98px) {
      #lp_ucla .logo {
        /* Extra small devices */ }
        #lp_ucla .logo .logo-item {
          flex-basis: 40%;
          /* 2列表示にするために調整 (2つで80%、余白で残りを消費) */ } }
    @media (min-width: 576px) and (max-width: 991.98px) {
      #lp_ucla .logo {
        /* Small and Medium devices */ }
        #lp_ucla .logo .logo-item {
          flex-basis: 25%;
          /* 3列表示にするために調整 (3つで75%、余白で残りを消費) */ } }
    @media (min-width: 992px) {
      #lp_ucla .logo {
        /* Large devices and up */ }
        #lp_ucla .logo .logo-item {
          flex-basis: 15%;
          /* 5列表示にするために調整 (5つで75%、余白で残りを消費) */ } }
  #lp_ucla .cv_area {
    background: #fff684;
    width: 100%;
    text-align: center;
    padding: 40px 0; }
    #lp_ucla .cv_area .btn,
    #lp_ucla .cv_area a.btn,
    #lp_ucla .cv_area button.btn {
      width: 90%;
      font-size: 1.3rem;
      font-weight: 700;
      line-height: 1.5;
      position: relative;
      display: inline-block;
      padding: 1rem 4rem;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;
      text-align: center;
      vertical-align: middle;
      text-decoration: none;
      letter-spacing: 0.1em;
      color: #ffffff;
      border-radius: 0.5rem;
      background: #ff324a;
      font-family: "Noto Serif JP", serif; }
    #lp_ucla .cv_area a.btn--red.btn--cubic {
      border-bottom: 5px solid #9f000c; }
    #lp_ucla .cv_area a.btn--red.btn--cubic:hover {
      margin-top: 3px;
      border-bottom: 2px solid #9f000c; }
    #lp_ucla .cv_area a.btn--radius {
      border-radius: 100vh; }
    #lp_ucla .cv_area .fa-position-right {
      position: absolute;
      top: calc(50% - .5em);
      right: 1rem; }
  #lp_ucla .blue_back {
    background: #EBF4F9;
    margin: 20px 0;
    padding: 20px 0; }
  #lp_ucla .circle {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    line-height: 50px;
    text-align: center;
    background: #927c56;
    margin: 0 auto; }
    #lp_ucla .circle span {
      color: #FFFFFF;
      font-weight: 900;
      font-size: 20px; }
  #lp_ucla .three_title {
    color: #927c56;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 10px;
    margin-top: 5px; }
  #lp_ucla .pickup .subtitle {
    font-size: 17px;
    font-weight: 700; }
  #lp_ucla .pickup .title {
    color: #927c56;
    font-size: 16px;
    font-weight: 500;
    border-bottom: 1px solid #927c56;
    padding-bottom: 5px; }
  #lp_ucla .point2 {
    background: #E9F3FB;
    border: 1px solid #024424;
    border-radius: 10px;
    padding: 15px;
    line-height: 1.8em; }
    #lp_ucla .point2 .title {
      font-size: 20px;
      font-weight: 900;
      color: #024424; }
    #lp_ucla .point2 .subtitle {
      font-size: 14px;
      color: #024424;
      border-bottom: 1px solid #024424; }
  #lp_ucla table.scholarship {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 20px; }
  #lp_ucla table.scholarship th, #lp_ucla table td {
    padding: 10px 0;
    padding-left: 5px; }
  #lp_ucla table.scholarship tr:nth-child(odd) {
    background-color: #eee; }
  #lp_ucla .box {
    border: 1px solid #BCBCBC;
    border-radius: 10px;
    padding: 15px; }
  #lp_ucla .row-eq-height {
    display: flex;
    flex-wrap: wrap; }
  #lp_ucla .subtitle {
    font-size: 18px;
    font-weight: bold;
    margin-top: 15px;
    padding-bottom: 5px;
    border-bottom: 1px solid #155182; }
  #lp_ucla ul.ranking {
    list-style: none;
    padding: 0;
    margin: 0; }
    #lp_ucla ul.ranking i {
      padding-right: 1em;
      color: #927c56; }
  #lp_ucla .point_icon {
    color: #927c56;
    font-size: 500%; }
  #lp_ucla .design08 {
    width: 100%;
    text-align: center;
    border-collapse: collapse;
    border-spacing: 0; }
  #lp_ucla .design08 th {
    padding: 10px;
    background: #778ca3;
    border: solid 1px #666666;
    color: #ffffff; }
  #lp_ucla .design08 td {
    padding: 10px;
    border: solid 1px #666666;
    vertical-align: middle; }
  #lp_ucla .design08 td.first {
    background: #e9faf9; }
  #lp_ucla .zi_box {
    background: #ebe7df;
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    padding: 15px;
    margin-top: 15px; }
    #lp_ucla .zi_box .small {
      font-size: 16px; }
  #lp_ucla #price_area .price_main {
    font-size: 30px;
    font-weight: bold;
    color: #e80000;
    text-align: center; }
  #lp_ucla #Member .table_design03 {
    border-collapse: collapse;
    width: 100%;
    max-width: 700px;
    margin: 0 auto; }
  #lp_ucla #Member .table_design03 th, #lp_ucla #Member .table_design03 td {
    border-bottom: 2px solid #c1c7c6;
    padding: 1em; }
  #lp_ucla #Member .table_design03 th {
    border-bottom: 2px solid #024424;
    font-weight: bold;
    text-align: left;
    width: 50%;
    min-width: 4em; }

/* page */
footer {
  margin-top: 30px;
  background: #024424 !important;
  color: #FFFFFF;
  padding: 10px;
  font-size: 10px;
  text-align: center;
  padding-bottom: 180px; }