@charset "utf-8";

/* ******************** default ******************** */

/* 폰트 */
@import "../../../font/NanumSquareNeo.css";

/* root */
@import "../../common/color";

/* mixin */ 
@import "../../mixin/ui-mixin";

/* common */ 
@import "../../common/common";


/* ******************** 공통 요소 ******************** */

/* header */
@import "../../common/header";

/* footer */
@import "../../common/footer";

/* fix-btn */ 
@import "../../common/fixed-btn";


/* ******************** component ******************** */

/* input */ 
@import "../../component/input-style";

/* 컨텐츠 공용 타이틀 */
@import "../../component/title-style";

/* btn-style */ 
@import "../../component/button-style.scss";

/* normal table */ 
@import "../../component/vertical-table.scss";


/* ******************** sub-common ******************** */ 

/* sub-banner */ 
@import "../common/_sub-banner";

/* sub-tab */ 
@import "../common/_sub-tab";

/* sub-common-cont */
@import "../common/_sub-cont";


/* ******************** 창업보육센터 ******************** */

/* banner */ 
@import "./_banner";



.cont-banner {
  background-image: url(../../../img/sub/portal-intro/bic/cont_banner.webp); 
}

.objective {
  ul { 
    display: table; width: 100%; table-layout: fixed; border-spacing: 15px 0; 
    li { 
      display: table-cell; vertical-align: middle; width: 33.3%; text-align: center; padding: 30px 0; border-radius: 0 0 15px 15px; background: #f2f5f6; border-top: 3px solid var(--line-color);
      .tit { font-size: 1.8rem; font-weight: 600; padding: 20px 0 10px;}
      .txt { font-size: 1.4rem; font-weight: 500; word-break: keep-all; color: #555;}
      img { width: 35px; }
      &:nth-child(2) {
        img { width: 50px; }
      }
    }
  }
}

@media (max-width: 820px) {
  .objective {
    ul {
      li {
        .tit {font-size:1.5rem}
        .txt {font-size:1.4rem}
        img {width:35px}
        &:nth-child(2) {
          img { width:45px}
        }
      }
    }
  }
}

@media (max-width: 630px) {
  .objective {
    ul {
      li {width:100%; display: block; margin-bottom: 10px; }
    }
  }
}

/* bi */
.bi-process {
  position: relative;
  ul {
    width:100%;
    li {
      position: relative; float:left; width:calc(25% - 13px); text-align: center; background: #f2f5f6; padding: 30px 0; border-top: 3px solid var(--line-color); border-radius: 0 0 15px 15px;
      &:not(:last-child) { margin-right: 15px;}
      &:not(:last-child):before { content: ''; position: absolute; top: 50%; right: -32px; margin-top: -25px; width:50px; height:50px; z-index:1;
        background-image: url('../../../img/sub/portal-intro/bic/bic_plus.svg');
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
      }
      &:nth-child(3):before { background-image: url('../../../img/sub/portal-intro/bic/bic_arr.svg'); }
      .title {
        position:relative;font-size:2rem; letter-spacing: -0.05em; color: #5d72cb; font-weight: 900; padding-bottom:40px;
        &:before { content: ''; position: absolute; bottom: 19px; left:50%; width: 24px; height: 2px; border-radius: 10px; background:#b9c2cb; margin-left: -12px;}
      }
      .sub-title {font-size:1.5rem; letter-spacing:-0.05em; color:#3a3a3a; font-weight:600; padding-bottom:10px;}
      .text {font-size:1.3rem; color:#767676; }
    }
  }
}

@media (max-width: 680px) {
  .bi-process {
    ul {
      li {
        .title {font-size: 1.6rem;}
        .text {font-size: 1.2rem; word-break: keep-all;}
        .sub-title {word-break: keep-all; font-size: 1.4rem; padding-bottom: 5px;}
      }
    }
  }
}


/* 입주 업체 지원제도 */
.process {
  ul {
    li {
      float: left; position:relative; width: calc(14% - 2px); text-align: center; margin-right:5px; font-size:1.3rem; font-weight:500; line-height: 1.7;
      &:last-child {margin:0;}
      &:after {content:''; position:absolute; top:10px; left:0; width:100%; height: 110%; background: #eef1f4;z-index: -1;border-top: 3px solid var(--line-color) }
      span { position:relative; top:-1px; font-weight:600; padding: 2px 0 0; background:var(--main-color); color: #fff; border-radius: 50%;font-size:1rem; margin: 0 auto 10px; width: 20px; height: 20px; display: block; z-index: 2;}
    }
  }
}

@media (max-width:1024px) {
  .process {
    ul {
      li {
        font-size: 1.2rem;
      }
    }
  }
}

@media (max-width: 960px) {
  .process {
    ul {
      li {
        width: calc(25% - 6px); margin-bottom: 40px;
      }
    }
  }
}

@media(max-width:768px) {
  .bi-process {
    position: relative;
    ul {
      width:100%;
      li {
        width:calc(33.3% - 10px);
        &:nth-child(3), &:last-child { 
          margin-right:0;
        }        
        &:nth-child(3) {
          &:before {
            content:none;
          }
        } 
        &:last-child {
          margin-top:20px; width:100%;
          &:before {
            content: ''; position: absolute; top:-37px; width:50px; height:50px; z-index:1; left:47%;
            background-image: url('../../../img/sub/portal-intro/bic/bic_arr.svg');
            background-size: 100%;
            background-repeat: no-repeat;
            background-position: center;
            transform:rotate(90deg)
          }
        }      
      }
    }
  }
}

@media (max-width: 575px) {
  .process {
    ul {
      li {
        width: calc(33% - 3px); margin-bottom: 30px; font-size: 1.1rem;
        &:nth-child(3n) { margin-right: 0; }
      }
    }
  }
  .bi-process {
    ul {
      li {
        width:calc(33.3% - 4px);
        min-height:180px; 
        &:nth-child(1), &:nth-child(2) {
          margin-right:5px;
          &:before {
            content:none;
          }
        } 
        &:last-child {
          min-height:auto;
          &:before {
            left:45%
          }
        }      
      }
    }
  }
}