@charset "utf-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;600;700;900&display=swap");
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/variable/pretendardvariable.css");
@font-face {
    font-family: 'GyeonggiTitleM';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/GyeonggiTitleM.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* reset */
@media all {
    body {margin: 0;}
	.ik_wrap * {margin: 0; padding: 0; outline: none; box-sizing: border-box;}
    .ik_wrap {
        line-height: 1; font-size: 10px; font-weight: 400;
        color: #000; font-family: "Noto Sans KR", sans-serif !important;
        word-wrap: break-word; word-break: keep-all;
    }
    .ik_wrap :is(h1, h2, h3, h4, h5, h6) {
        margin: 0; font-family: "Noto Sans KR", sans-serif !important;
        line-height: 1;
    }
    .ik_wrap :is(ul, ol) {list-style: none; margin: 0; padding: 0;}
    .ik_wrap a {
        outline: 0; text-decoration: none; color: #000;
        font-family: "Noto Sans KR", sans-serif !important;
    }
    .ik_wrap a:focus {outline: none;}
    .ik_wrap :is(figure, dl, dd, input[type="radio"], input[type="checkbox"]) {margin: 0; padding: 0;}
    .ik_wrap img {border: none; outline: none; max-width: 100%;}
    .ik_wrap p {
        margin: 0; padding: 0;
        word-wrap: break-word; word-break: keep-all;
    }

    :root {
        --main-color : #549175;
        --main-color2 : #231815;
    }
}

.ik_wrap .Gyg {font-family: 'GyeonggiTitleM', sans-serif !important; letter-spacing: 3px;}
.ik_wrap .Ptd {
    font-family: "Pretendard Variable", Pretendard, -apple-system,
      BlinkMacSystemFont, system-ui, sans-serif !important;
  }

.ik_wrap header {
    position: relative; width: 100%;
    background: var(--main-color);
    padding: 1.8em 15px;
}
.ik_wrap .containerV1 {width: 100%; max-width: 1200px; margin: 0 auto;}

@media (max-width: 1230px) {
    .ik_wrap .containerV1 {padding: 0 15px;}
}

.ik_wrap header .containerV1 {
    display: flex; justify-content: space-between; align-items: center;
    position: relative; z-index: 2; padding: 0; gap: 30px;
}
.ik_wrap header .containerV1 h1 {color: #fff; font-weight: bold; font-size: 1em; width: 22.8em;}

.ik_wrap header select {
    width: 170px; height: 30px; border-color: #b7b6b6;
    padding: 5px 15px; font-size: 12px; color: #959595;
    background: #fff;
    /* -webkit-appearance: none;
        -moz-appearance: none;
            appearance: none; */
}

@media (max-width: 991px) {
    .ik_wrap header select {width: 150px;}
}

.ik_news_frame {width: 100%; max-width: 1920px; margin: 0 auto;}
.ik_news_frame .banner_box {
    width: 100%; padding: 5.2em 0;
    background: url(./img/webzine_bg.jpg) no-repeat center center / cover;
}
.ik_news_frame .banner_box .containerV1 {display: flex; gap: 15em; align-items: center;}
.ik_news_frame .banner_box .containerV1 .text_box .symbol {
    display: flex; gap: 6.3em; margin-bottom: 5.8em;
}
.ik_news_frame .banner_box .containerV1 .text_box .symbol .img_box {
    display: flex; flex-direction: column; gap: 2.8em; text-align: center;
}
.ik_news_frame .banner_box .containerV1 .text_box .symbol .img_box h3 {
    font-size: max(18px, 2.5em); color: #000; line-height: 1.2; font-weight: bold;
}
.ik_news_frame .banner_box .containerV1 .text_box .symbol h2 {
    font-weight: 600; font-size: 5.5em; color: #000; line-height: 1.3;
    margin-top: 0.3em;
}

.ik_news_frame .banner_box .link_box {display: flex; align-items: center; gap: 1.8em;}
.ik_news_frame .banner_box .link_box a {
    display: flex; width: 100%; max-width: 128px;
    height: 40px; color: #fff; text-align: center;
    align-items: center; justify-content: center;
    font-weight: bold; border-radius: 40px;
    background: #808080; font-size: 15px;
}
.ik_news_frame .banner_box .link_box a:first-child {background: #f29da6;}
.ik_news_frame .banner_box .link_box a:nth-child(2) {background: var(--main-color2);}


.ik_list_frame {
    padding: 12.2em 0 12.8em;
    background: url(./img/webzine_list_bg.jpg) no-repeat top center / cover;
}
.ik_list_frame .list_title {
    position: relative; color: #000; font-size: 25px;
    font-weight: bold; display: flex; align-items: center; gap: 8px;
    margin-bottom: 1.8em;
}
.ik_list_frame .list_title span {
    background: url(./img/webzine_icon.png) no-repeat center center / cover;
    width: 1.52em; height: 1.52em;
}

.ik_list_frame .itemBox {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 7.4em 3.5em;
}
.ik_list_frame .itemBox .item a {
    display: flex; align-items: center; text-align: center;
    line-height: 1.3; flex-direction: column;
}
.ik_list_frame .itemBox .item a .img {margin-bottom: 1.4em; position: relative;}
.ik_list_frame .itemBox .item a h5 {
    font-size: max(14px, 1.8em); font-weight: 550; color: #000;
    margin-bottom: 3px;
}
.ik_list_frame .itemBox .item a .hover_box {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 99.5%; z-index: 2;
    background: rgba(0,0,0,0.5);
    display: flex; align-items: center; justify-content: center;
    
    opacity: 0; visibility: hidden; transition: 0.3s;
}
.ik_list_frame .itemBox .item a .hover_box > article {
    border-radius: 50%; background: rgba(255,255,255,0.4);
    width: 13.6em; height: 13.6em; text-align: center;
    display: flex; align-items: center; justify-content: center;

    opacity: 0; transition: 0.3s 0.1s; transform: translateY(10%);
}
.ik_list_frame .itemBox .item a .hover_box > article h4 {color: #fff; font-size: 16px; font-weight: 400;}

/* hover */
.ik_list_frame .itemBox .item a:hover .hover_box {opacity: 1; visibility: visible;}
.ik_list_frame .itemBox .item a:hover .hover_box > article {opacity: 1; transform: translateY(0%);}


@media (max-width: 991px) {
    .ik_news_frame .banner_box .containerV1 {flex-direction: column; gap: 6em;}
    .ik_news_frame .banner_box .containerV1 .text_box .symbol {margin-bottom: 5em;}
    .ik_news_frame .banner_box .link_box {justify-content: center;}

    .ik_list_frame .itemBox {grid-template-columns: repeat(4, 1fr);}
}

@media (max-width: 768px) {
    .ik_news_frame .banner_box .containerV1 .text_box .symbol {
        gap: 3em; align-items: center; flex-direction: column;
    }
    .ik_news_frame .banner_box .containerV1 .text_box .symbol img {
        width: 100%; max-width: 150px;
    }
    .ik_news_frame .banner_box .containerV1 .text_box .symbol h2 {margin-top: 0;}
    .ik_news_frame .banner_box .containerV1 .text_box .symbol h2 br {display: none;}

    .ik_list_frame .itemBox {grid-template-columns: repeat(3, 1fr);}
}

@media (max-width: 680px) {
	.ik_wrap {font-size: 8px;}
    .ik_news_frame .banner_box .link_box {flex-direction: column; max-width: 350px; width: 100%; gap: 2.5em;}
    .ik_news_frame .banner_box .link_box a {max-width: 100%;}
    .ik_list_frame .itemBox {grid-template-columns: repeat(2, 1fr);}
}

@media (max-width: 580px) {
	.ik_wrap {font-size: 6px;}
    /* .ik_news_frame .banner_box .text_box p.text1 br {display: none;} */
}