/* -------------- font ------------- */
/*-- font-family: 'Montserrat', sans-serif; --*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500;600;800&display=swap');

/*-- font-family: 'Noto Sans KR', sans-serif; --*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;500;700&display=swap');

/*-- font-family: 'Poppins', sans-serif; --*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;700&family=Roboto:wght@300;400;700&display=swap');

/*-- 'Spoqa Han Sans Neo Fonts', sans-serif; --*/
@import url('//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css');


/* intro 배너 font */
@font-face {
    font-family: 'Gmarket Sans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


/* --------------------------------- */
body{
    font-size: 16px;
    color: #333;
    overflow: hidden;
    -webkit-text-size-adjust: none;
}

.numFont{
    font-family: 'Spoqa Han Sans Neo';
    font-weight: normal;
}

/* Chrome, Safari, Edge, Opera */
input {
    -webkit-appearance: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

/* select style */
select{
    /*ios대응*/
    appearance: none;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
}

select{
    padding: 0 35px 0 8px;
    border-radius: 4px;
    background: url('/assets/images/front/widget/common/img/selectArrow.png') no-repeat;
    background-position-x: 90%;
    background-position-y: 50%;
}
[type="checkbox"]{
    /*display: none;*/
}
/*[type="checkbox"]~label{*/
/*display: inline-block;*/
/*padding-left: 30px;*/
/*line-height: 24px;*/
/*background: url('/assets/bigissue/images/icon/btnCheckOff.png') center left no-repeat;*/
/*cursor: pointer;*/
/*}*/
[type="checkbox"]~label span{
    font-size: 16px;
    font-weight: 400;
}

/*-- 체크박스 스타일 --*/
.checkStyle{
    vertical-align: middle;
}
.checkStyle input[type='checkbox'],
.checkStyle input[type='radio']{
    /* 실제 checkbox or radio 없애기 */
    /* radio style도 필요하여 추가함. */
    display: none;
}
.checkStyle input[type='checkbox'] + label::before,
.checkStyle input[type='radio'] + label::before{
    /* 가짜 checkbox or radio 만들기 */
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: middle;
}
.checkStyle input[type="checkbox"] ~ label:before,
.checkStyle input[type="radio"] ~ label:before{
    background: url("/assets/images/front/common/icon/btnCheck.svg") no-repeat;
}
.exchangeWrap .checkStyle input[type="checkbox"] ~ label:before{
    margin-bottom: 2px;
}
.checkStyle input[type="checkbox"] ~ label.btnLarge:before{
    background: url("/assets/images/front/common/icon/btnCheckLarge.svg") no-repeat;
}
.checkStyle input[type="checkbox"]:checked ~ label:before,
.checkStyle input[type="radio"]:checked ~ label:before{
    background: url("/assets/images/front/common/icon/btnCheckClicked.svg") no-repeat;
}
.checkStyle input[type="checkbox"] ~ label,
.checkStyle input[type="checkbox"]:checked ~ label,
.checkStyle input[type="radio"] ~ label,
.checkStyle input[type="radio"]:checked ~ label{
    background: none;
}
.checkStyle input[type="checkbox"] ~ label span,
.checkStyle input[type="radio"] ~ label span{
    vertical-align: middle;
    font-size: 14px;
    color: #333;
}


/* 차트 데이터 없을 경우 */
.noChart{
    margin-top: 100px;
    text-align: center;
    color: #bdbdbd;
    font-weight: 100;
}
body{
    min-height: auto;
    margin: 0;
}
a{
    color: inherit;
    text-decoration: none;
}
textarea{
    line-height: 1.8;
    border: 1px solid #e0e0e0;
}
input{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    border:1px solid #e0e0e0;
    -webkit-appearance: none;
    -moz-appearance: none;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset;
}

.clear:after{
    content: '';
    display: block;
    clear: both;
}
.hide{ 
    display: none;
}
.show{
    display: block;
}
.warning{
    color: #EB5757;
}
.pass{
    color: #2F80ED;
}
.hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}
.ellipsis1{
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis; /* 여러 줄 자르기 추가 스타일 */
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}

/*-- 접근성 위한 숨김 텍스트 --*/
.ir_so {
    overflow: hidden;
    position: absolute;
    width: 0;
    height: 0;
    line-height: 0;
    text-indent: -9999px;
}




/*---------- Link V3 : Widget ----------*/
/*-- 위젯 : 공통 --*/
iframe {
    border: none;
}

#wrap {
    min-width: 360px;
    overflow: hidden;
}

#widget #publish_link_widget_iframe_main {
    width: 100%;
}

#widgetWrap {
    max-width: 700px;
    height: 150px;
    position: relative;
    font-family: 'Noto Sans KR', sans-serif;
    margin : 0 auto auto;
    /*margin: 0 auto;*/
    border: 1px solid #f5f5f5;
    /*box-sizing: border-box;*/
}

#widgetWrap .title {
line-height: 133%;
color: #333333;
}

#widgetWrap .bold {
font-weight: 700;
}

#widgetWrap input {
border: none;
border-radius: 0;
}

button {
all: unset;
}

#widgetWrap input:focus {
outline: none;
}

#widgetWrap .widgetInner .verticalType {
position: relative;
}

#widgetWrap .verticalType .closeBtn {
position: absolute;
top: 16px;
right: 16px;
cursor: pointer;
}

#widgetWrap .closeBtnWrap {
position: absolute;
top: 16px;
right: 16px;
cursor: pointer;
z-index: 10;
}

#widgetWrap .closeBtn.hide {
display: none;
}

.red {
color: #eb5757;
}

.blue {
color: #2f80ed;
}

.ellipsis {
display: inline-block;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}


/*-- 버튼 공통 : 비활성화 --*/
#widgetWrap .btnLight,
#widgetWrap .btnDark {
    width: 100%;
    text-align: center;
    border-radius: 6px;
    cursor: pointer;
}

#widgetWrap .btnLight {
    background-color: #e0e0e0;
}

button span {
    color: #ffffff;
}

#widgetWrap input[type="text"],
#widgetWrap input[type="email"],
#widgetWrap input[type="number"]{
    color: #333;
}


/*-- 버튼 공통 : 활성화 --*/
.btnDark {
    width: 100%;
    height: 26px;
    text-align: center;
    border-radius: 6px;
    background-color: #5d5fef;
    cursor: pointer;
}

#widgetWrap .widgetRewardWrap.excess .rewardInputArea input[type="number"] {
    color: #ff4343;
}

#widgetWrap .widgetRewardWrap.excess .rewardInputArea {
    border-bottom: 1px solid #ff4343;
}