@import url("../../css/common/icon.css");
@import url("../../css/common/skill-icon.css");
@import url("../../css/common/button.css");

/* common */
body{ font-family: "Pretendard", "GmarketSans", sans-serif;}

.sr-only{
position: absolute !important;
display: inline-block !important;
width: 1px;
height: 1px;
padding: 0;
  margin: -1px; /* 화면 바깥으로 밀어내기 위해 음수 마진 사용 */
overflow: hidden;
  clip: rect(0, 0, 0, 0); /* 일부 브라우저 호환성 확보 */
    border: 0;
}

.clearfix::after {
    content: "";
    display: block;
    clear: both;
}

[class*="title"]{font-weight: bold;}

/* text */
.small-text{font-size: 2rem;}

/* title */
.con-title{font-size: 2.5rem;}
.solid-title{border-bottom:1px solid #fff;padding-bottom: 3rem;margin-bottom: 3rem;}

/* desc */
.desc{word-wrap: break-word; word-break: keep-all;}
.desc-title{font-weight: bold;}
.desc-title:after{content:''; display:inline-block;}

/* list */

.full-list,.full-list > li,
.full-list > li > .link,.full-list .desc p {max-width: 100%; width: 100%;}

.full-list > li *{color:#fff}
.full-list > li > .link{position:relative; display: flex;
 padding: 5rem 0;
border-top: 2px solid #fff;
}
.full-list .link-title{color:#fff;font-size: 4rem; font-family: "GmarketSans";}
.full-list .num{margin-right: 10px;}
.full-list .desc{word-wrap: break-word; word-break: keep-all;}
.full-list .desc p{}

.img-box,.img-inner,.img-inner img{max-width:100%; width: 100%;}
.lst-con{}
.lst-con .img-inner img{ }

/* info-row */
.info-row{display: flex; margin: 2rem 0; align-items: center;}

/* tultip */

.tultip{border:1px solid #fff;padding: 0.5rem; font-size: 1.5rem; font-weight: normal;}


/* skip-card */
.skip-card{
    position: absolute;
    /* height: 500px; */
    z-index: 2;
    display:flex;
    align-items: center;
    justify-content: center;
    gap: 3rem;
}
.skip-card .link{
    width: 100%;
    max-width:45rem;
    /* height: 50rem; */
    color: #333;
    border: 3px solid #333;
    border-radius: 3rem;
    overflow: hidden;
 }

 .skip-card .link-inner{position: relative;
padding: 5rem 4rem; width: 100%; height: 100%; z-index:2}

.skip-card .link .title{
    font-weight: 600;
    font-family: "GmarketSans";
    font-size: 4.8rem;
    position: relative;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

/* bg & icon */
.skip-card .icon,.skip-card .bg{display:inline-block;background-position: center center;  background-size: 100%; background-repeat: no-repeat; }
/* icon */
.skip-card .icon{width: 50px;height: 50px;/* position:relative; */margin-right: 1rem;}

.skip-card .icon.icon01{background-image: url("../../img/main/whoiam_small.png");}
.skip-card .icon.icon02{background-image: url("../../img/main/portfolio_small.png");}
.skip-card .icon.icon03{background-image: url("../../img/main/contact_small.png");}

.skip-card .icon.icon04{}
.skip-card .icon.icon05{}
.skip-card .icon.icon06{}


/* bg */
.skip-card .bg{width: 250px;height: 250px;
    position: absolute;pointer-events: none;z-index: 0;}


.skip-card .bg.bg01{background-image: url("../../img/main/whoiam_big.png");}
.skip-card .bg.bg02{background-image: url("../../img/main/portfolio_big.png");}
.skip-card .bg.bg03{background-image: url("../../img/main/contact_big.png"); }

@media screen and (max-width: 1500px) {

    .skip-card .link{max-width: 35rem;}
    .skip-card .link .title{font-size: 3.0rem;}
}



@media screen and (max-width: 900px) {

    .skip-card {flex-wrap: wrap;}
    .skip-card .link{height: 25rem;  min-width: 20rem;}
    .skip-card .link-inner{padding: 3rem;}
}