/* reset */
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean");
@import url("https://cdn.andar-publish.com/assets/styles/gilroy-font.css");

* {
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
}

a {
    text-decoration: none;
    outline: none;
    color: inherit;
    cursor: pointer;
}

ul,
li {
    list-style: none;
}

/* 기기 표시 구분 */
.pc,
.wp {
    display: block;
}

.mo,
.mp {
    display: none;
}

.prd_detail {
    text-align: left;
}

img {
    max-width: 100%;
}

/* text-align */
/* 텍스트 정렬 */

.text-center {
    text-align: center;
}

.fw_300,
.fw300 {
    font-weight: 300;
}

.fw_400,
.fw400 {
    font-weight: 400;
}

.fw_500,
.fw500 {
    font-weight: 500;
}

.fw_600,
.fw600 {
    font-weight: 600;
}

.fw_700,
.fw700 {
    font-weight: 700;
}

.fw_800,
.fw800 {
    font-weight: 800;
}

/* font-size (주력형) */
/* 주력형, 일반형의 폰트사이즈가 다르니 확인하기 */

.fs_l {
    font-size: 45px;
    letter-spacing: -2.5px;
    line-height: 1.3;
}

.fs_m {
    font-size: 35px;
    letter-spacing: -1px;
    line-height: 1.3;
}

.fs_s {
    font-size: 25px;
    letter-spacing: -0.8px;
    line-height: 1.5;
}

.fs_ss {
    font-size: 20px;
    letter-spacing: -0.3px;
    line-height: 1.6;
}

/* 단서조항 */

.common_notice {
    width: 90%;
    font-size: 20px;
    letter-spacing: -0.3px;
    line-height: 1.6;
    margin: 30px auto 0 5%;
}

/* star_mark */
/* 일부 별표 마크를 위해 추가( 수정 필요..? ) */

.star_mark {
    position: relative;
}

.star_mark.sm_left {
    padding-left: 15px;
}

.star_mark.sm_right {
    padding-right: 15px;
}

.star_mark.sm_left:before {
    content: "*";
    display: block;
    position: absolute;
    top: 4px;
    left: 0;
}

.star_mark.sm_right:after {
    content: "*";
    display: block;
    position: absolute;
    top: 4px;
    right: 0;
}

.noto {
    font-family: "NotoSansKR", Malgun Gothic, "맑은 고딕", Dotum, "돋움", sans-serif;
}

.swiper-container-horizontal > .swiper-pagination-bullets {
    bottom: 0;
    position: absolute;
    text-align: center;
}

.iv-hidden {
    display: none !important;
}

.iv-tab-toggle {
    border-bottom: solid 1px #c8cbd2;
}

.iv-tab-toggle h1 {
    position: relative;
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
    margin: 0;
    letter-spacing: -0.02em;
    padding: 36px 50px 36px 2px;
    cursor: pointer;
    color: #212326;
}

.iv-tab-toggle h1::after {
    content: "";
    display: inline-block;
    position: absolute;
    width: 48px;
    height: 48px;
    top: 50%;
    right: 2px;
    transform: translateY(-50%);
    background: url(https://cdn.andar-publish.com/assets/images/template/etc/ic_toggle_open.png) no-repeat 0 0 / contain;
}

.iv-tab-toggle h1.active::after {
    /*background: url(https://cdn.andar-publish.com/assets/images/template/etc/ic_toggle_close.png) no-repeat 0 0 / contain                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          */
    transform: translateY(-50%) rotate(180deg);
}

.iv-tab-toggle.iv-tab-size-guide h1::after {
    /*background: url(https://cdn.andar-publish.com/assets/images/template/etc/ic_toggle_plus.png) no-repeat 0 0 / contain;*/
    background: url(https://cdn.andar-publish.com/assets/images/template/etc/ic_toggle_plus.png) no-repeat center / 80%;
}

.iv-tab-toggle.prd_info h1 {
    font-weight: 400;
    color: #777;
}

.toggle-desc {
    letter-spacing: -0.8px;
    display: none;
    position: relative;
    padding: 40px 88px;
    border-top: solid 1px #c8cbd2;
}

a {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.ac_fs_l {
    font-size: 40px;
}

.ac_fs_s {
    font-size: 28px;
}

.info_wrap_hidden_description {
    display: none;
}

.connected_board_wrapper, .layout_FW24 {
    font-family: "Gilroy", "Noto Sans KR", Malgun Gothic, "맑은 고딕", Dotum, "돋움", sans-serif;
}

.detail_video01 {
    width: 100%;
}

.layout_24FW .prev-detail-component {
    padding: 40px 56px;
}

.etc_wrapper {
    font-size: 0;
}

@media screen and (max-width: 590px) {
    .pc,
    .wp {
        display: none;
    }

    .mo,
    .mp {
        display: block;
    }

    .common_notice {
        font-size: 15px;
        letter-spacing: -0.8px;
        width: 90%;
        margin: 15px auto 0 5%;
    }

    .star_mark.left {
        padding-left: 8px;
    }

    .star_mark.right {
        padding-right: 8px;
    }

    /* font-size (주력형) */
    .fs_l {
        font-size: 31px;
        line-height: 1.3;
        letter-spacing: -1.5px;
    }

    .fs_m {
        font-size: 22px;
        line-height: 1.35;
        letter-spacing: -1.2px;
    }

    .fs_s {
        font-size: 17px;
        line-height: 1.5;
        letter-spacing: -0.6px;
    }

    .fs_ss {
        font-size: 15px;
        letter-spacing: -0.8px;
    }

    .iv-tab-toggle h1 {
        font-size: 18px;
        letter-spacing: -0.02em;
        padding: 18px 4.5%;
    }

    .toggle-desc {
        padding: 0 0 40px;
    }

    .iv-tab-toggle h1::after {
        width: 24px;
        height: 24px;
        right: 16px;
    }

    .ac_fs_l {
        font-size: 23px;
    }

    .ac_fs_s {
        font-size: 16px;
    }

    .prev-detail-component {
        padding: 0;
    }
}