@charset "UTF-8";
/* reset */
* { box-sizing:border-box; -moz-box-sizing:border-box; --webkit-box-sizing:border-box; -webkit-tap-highlight-color : transparent !important; }
*,
*::before,
*::after {font-family: 'Pretendard', "Apple SD Gothic Neo", Sans-serif, -apple-system, serif !important; letter-spacing: -0.05em; word-spacing: normal; }
html { position: relative; padding: 0; margin: 0;}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video { margin:0; padding:0; border:0;  font:inherit; vertical-align:baseline; }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,#header { display:block }
blockquote,q { quotes:none }
blockquote:before,blockquote:after,q:before,q:after { content:''; content:none }
table { border-collapse:collapse; border-spacing:0 }
table { padding:0; border:0 }
th,td { padding:0 }
body,html { -webkit-text-size-adjust:none;  height:100% }
body { position: relative; margin: 0; padding: 0; background:var(--body-bg); word-wrap:break-word; }
fieldset,img { border:0 none }
html, h1, h2, h3, h4, h5, h6, form, fieldset, img { margin: 0; padding: 0; border: 0 }
img { vertical-align:unset }
a { text-decoration:none; cursor:pointer; color:var(--common_txt); }
a:active,a:hover { text-decoration:none }
input,select,textarea,button { color:var(--common_txt); vertical-align:top; cursor:auto }
button { border:0 none; padding:0; background-color:transparent; cursor:pointer }
address,caption,cite,code,dfn,em,var { font-style:normal; font-weight:500 }
legend,caption { visibility:hidden; overflow:hidden; position:absolute; top:0; left:0; width:1px; height:1px; font-size:0; line-height:0 }
textarea { resize:none; outline:none }
input { outline:none }
input[type=text]::-ms-clear { display:none }
input[type='file'] { --webkit-appearance:button; background:transparent; border-radius:0; border:0; cursor:pointer }
input {background-color: var(--common_input_bg);color: var(--common_txt);border: 1px solid #ccc;padding: 5px;}
input:focus {outline: none;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 500px var(--common_input_bg) inset !important;-webkit-text-fill-color: var(--common_txt) !important;}
body { -ms-overflow-style:none; }
/* Chrome, Safari, Edge, Opera */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
/* Firefox */
input[type="number"] { -moz-appearance: textfield; }
.bold { font-weight: bold !important; }
input[type="date"] {position: relative;cursor: pointer;}
input[type="date"]::-webkit-calendar-picker-indicator {position: absolute;right: 5px;appearance: none;-webkit-appearance: none;-moz-appearance: none;background-image: var(--ico_inp_date);background-position: center;background-repeat: no-repeat;background-size: 18px;cursor: pointer;}
button { background: inherit; border:none; box-shadow:none; border-radius:0; padding:0; overflow:visible; cursor:pointer }
input, button { border-radius: 0; border: 0; }
body, p, ul { padding:0; margin:0; }
a, em { text-decoration:none; }
em { font-style: unset; font-weight: normal}
input[type=button] { outline:none; cursor:pointer;}

/* .note-editable 부모를 제외하고 list-style 제거 */
dl:not(.note-editable *):not(.bv_main_inner *):not(.tbl_content_main *),
ul:not(.note-editable *):not(.bv_main_inner *):not(.tbl_content_main *),
ol:not(.note-editable *):not(.bv_main_inner *):not(.tbl_content_main *),
menu:not(.note-editable *):not(.bv_main_inner *):not(.tbl_content_main *),
li:not(.note-editable *):not(.bv_main_inner *):not(.tbl_content_main *) {
    list-style: none;
}
/* 기본적으로 ul, ol도 제외 */
ul:not(.note-editable *):not(.bv_main_inner *):not(.tbl_content_main *),
ol:not(.note-editable *):not(.bv_main_inner *):not(.tbl_content_main *) {
    list-style: none;
}

/* custom */
.scroll_hide{ overflow: hidden !important; }
.width-limit { width:1280px; margin:0 auto; }
.pc { display:block; }
.mo { display:none; }
.none { display:none; }
.ellipsis1 { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-wrap:break-word; }
.ellipsis2 { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; }
.ellipsis3 { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; word-wrap:break-word; }
.pt-10 { padding-top: 10px !important; }
.pt-20 { padding-top: 20px !important; }
.pb-10 { padding-bottom: 10px !important; }
.pb-20 { padding-bottom: 20px !important; }
.mt-20 { margin-top: 20px !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-40 { margin-bottom: 40px !important; }
.mb-50 { margin-bottom: 50px !important; }

/* 설명 히든 */
.exp_txt { position: absolute; clip: rect(0 0 0 0); width: 1px; height: 1px; margin: -1px; overflow: hidden; }

/* 헤더  */
header { background: var(--body-bg); }
.h_cont_flex { display: flex; flex-direction: column; justify-content: center; }
.header_logo { padding: 20px 0; border-bottom: 1px solid var(--common_opc_border); text-align: center; }
.header_logo a { display: inline-block; width: 164px; height: 94px; position: relative; }
.header_logo a .logo_bg { width: 100%; height: 100%; background: var(--h-logo) no-repeat; background-size: contain; }
.nav { width: 770px; margin: 0 auto; }
.nav .menu ul { display: flex; justify-content: space-between; align-items: center; font-size: 20px; font-weight: 600; color: var(--common_txt); padding: 40px 0; }
header.fix { position: fixed; top: 0; left: 0; right: 0; border-bottom: 1px solid var(--common_opc_border); width: 100%; height: 64px; z-index: 1000; }
header.fix .h_cont_flex { display: flex; flex-direction: unset; justify-content: space-between; align-items: center; width: 1280px; margin: 0 auto; }
header.fix .header_logo { border-bottom: unset; padding: unset; }
header.fix .header_logo a { display: inline-block; width: 70px; height: 39px; position: relative; }
header.fix .nav .menu ul { display: flex; justify-content: space-between; align-items: center; font-size: 20px; font-weight: 600; color: var(--common_txt); padding: 20px 0; }
/* 헤더  */


/* 푸터 */
.foot_bn_wrap {min-width: 1280px; width: 100%; height: 190px; display: flex; justify-content: center; align-items: center; }
.foot_bn_bg { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
.foot_bn_thumb_wrap { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; }
.foot_bn_thumb_wrap .thumb { width: 100%; height: 190px; background-position: center center; background-size: cover; background-repeat: no-repeat; max-height: 190px; }
.foot_main { background: var(--foot_bg); min-width: 1280px; }
.foot_flex { display: flex; justify-content: space-between; align-items: center; width: 1280px; margin: 0 auto; }
.foot_nav { padding: 40px 0; display: flex; column-gap: 50px; font-size: 17px; color: var(--foot_li_txt); }
.foot_nav li a { color: var(--foot_li_txt); line-height: 18px; }
.foot_nav li a.cr { text-decoration: none; }
.def_lang_select_wrap select { border: none; outline: none; font-size: 15px; background: var(--foot_bg); cursor: pointer; color: var(--foot_li_txt); }
/* 푸터 */


/* 로그인 폼 */
.login_form_wrap { width: 1280px; margin: 50px auto 100px; background: #FFF; }
.login_form_inner { width: 600px; margin: 0 auto; background: #FFF; }
.form_tt { margin-top: 50px; margin-bottom: 20px; padding-bottom: 45px; border-bottom: 2px solid var(--def-pp-deep); }
.form_tt h3 { text-align: center; font-size: 32px; color: var(--def-pp-deep) }
.login_form_start { padding: 0 35px 40px 35px; border-bottom: 2px solid var(--def-pp-deep); }
.form_item_inp { width: 100%; position: relative; }
.login_form_start .form_item_inp input { width: 100%; position: relative; outline: none; padding: 20px 25px; border: 1px solid var(--common_opc_border); border-radius: 30px; background: #FFF; color: var(--common_txt); font-size: 14px; }
.login_form_chk_flex { width: 100%; display: flex; align-items: center; column-gap: 20px; }
.cus_chkbox_wrap input[type="checkbox"] { display: none; }
.cus_chkbox_wrap label { display: flex; align-items: center; cursor: pointer; font-size: 16px; position: relative; padding-left: 25px; }
.cus_chkbox_wrap label::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; border: 2px solid #d9d9d9; border-radius: 50%; background-color: white; transition: background 0.2s ease-in-out; display: flex; align-items: center; justify-content: center; }
.cus_chkbox_wrap input[type="checkbox"]:checked + label::before { background-color: white; }
.cus_chkbox_wrap input[type="checkbox"]:checked + label::after { content: ""; position: absolute; left: 5.5px; top: 50%; transform: translateY(-50%); width: 10px; height: 10px; background-color: var(--def-pp-deep); border-radius: 50%; transition: all 0.2s ease-in-out; }

.login_form_submit{width: 250px; margin: 0 auto;}
.login_form_submit button{width: 100%; height: 60px; border-radius: 30px; background: var(--def-pp-deep); color: #FFF; font-size: 20px; font-weight: 400}
.login_form_sublink{text-align: center;}
.login_form_sublink ul{ display: flex; justify-content: center; align-items: center;}
.login_form_sublink ul li:not(:last-child){ padding-right: 13px; margin-right: 13px; border-right: 1px solid var(--common_opc_border); }
.login_form_sublink ul li a{ color: var(--common_txt_opc); font-size: 16px;}
/* 로그인 폼 */

/* 회원 가입 */
#join_section .readonly{background: var(--input_readonly_bg)}
#join_section .login_form .readonly .form_text .input input{color: var(--common_txt_opc); background:var(--input_readonly_bg)}

.login_form { width:580px; padding-top:0 !important; border:1px solid var(--common_light_border); display:inline-block; background-color:var(--common_input_bg); border-radius:5px; }
.login_form.no_line { border:0px solid; background-color:#F5F6F8; }
.login_form.no_line h1 { font-size:40px; font-weight:400; line-height: 68px; text-align: center; }
.login_form .form .form_text { position: relative; padding:10px 70px 0 70px; }
.login_form .form .form_text .login_h3 { float:left; font-size:14px; color: var(--common_txt_opc); }
.login_form .form .form_text .login_radio { float:left; height:16px; width:16px; margin-top: 0}
.login_form .form_id { padding:30px 0px 0px 0px; }
.login_form .button_area { padding:10px 70px 30px 70px; }
.email_login_btn { background:var(--email_login_btn_bg); color: #FFF; border-radius:5px; border: none; cursor: pointer; margin-top: 25px; width:440px; height:50px; }
.email_login_btn.active { background-color:var(--def-pp-deep) }
.login_form .button_area_text { padding-bottom: 25px; display: flex; align-items: center; justify-content: center }
.login_form .button_area_text > a { display: block; font-size: 14px; font-weight: 400; color:var(--common_txt_opc); padding:20px; }
.login_form_logo { text-align: center }
.login_form_logo h1 { margin-bottom: 25px; }
.login_form_logo h1 img { width: 73px; }
.login_form_logo h1 > a{display: inline-block}
.kplay_logo_bg{width: 75px; height: 40px; background-image: var(--h-logo); background-repeat: no-repeat; background-size: contain; background-position: center; margin: 0 auto}
.up_cont_tt h2 a .kplay_logo_bg{width: 70px;}
.foot_end_row_flex_item > a .kplay_logo_bg{width: 65px; height: 20px;}
.login_form_banner { width:580px; height:187px; padding-top:50px; display:inline-block; }
.login_form .form .form_title.join_complete { color:var(--common_txt); }

.join { font-size:14px; font-weight: 400; line-height: 16px; text-align: left; }
.join .form { margin-top:0; border-bottom: 1px solid var(--common_light_border); }
.join .last { margin-top:0; border-bottom: none; }
.join .form .form_text { position:relative; padding:10px 100px 0 25px; margin-bottom:1px;; height:45px; color:var(--common_txt_opc);  font-size: 14px; font-weight: 400; line-height: 19.07px; }
.join .form .form_text .join_h3 { float:left; font-size:14px; padding-top:5px; color: var(--common_txt); font-weight: 400; line-height: 16px; text-align: left; }
.join .form .form_text .join_radio { float:left; height:20px; width:20px; }
.join .form .input { overflow:hidden; position:relative; display:block; padding:0 10px; border:0px; width:100%; height:36px; font-size:1.4rem; }
.join .join_text { height:45px; color:#AAAAAA; margin-top: 5px }
.join .join_text.confirm_radio_wrap { padding-top: 10px }
.join .join_text .join_h3 { font-size:13px; padding-top:3px; color: var(--common_txt); font-weight: 400; line-height: 16px; text-align: left; }
.join_bottom { }

.line-text { display: flex; align-items: center; text-align: center; margin: 65px 0 40px 0; font-size:14px; color: var(--common_txt_opc); }
.line-text::before,
.line-text::after { content: ""; flex: 1; border-bottom: 1px solid var(--common_opc_border); }
.line-text:not(:empty)::before { margin-right: 10px; }
.line-text:not(:empty)::after { margin-left: 10px; }
.google_join_btn { width:580px; padding: 8px 0; display: flex; align-items: center; justify-content: center; border-radius: 24px; border: 1px solid #E0E0E0; background-color:white; color: #000;}
.google_join_btn > img { margin-right: 7px }
.google_join_span { font-size: 15px; font-weight: 400; }
.btn_dup_check { right:10px; float: right; position: absolute; width: 89px; top: 9px; height: 30px; border-radius: 5px; border: 1px solid var(--input_vali_inline_btn_border); z-index:101; background: var(--input_vali_inline_btn_bg); color: var(--common_txt_opc)}
.btn_dup_check.active { color:var(--input_vali_inline_btn_active_txt); background: var(--input_vali_inline_btn_active_bg); cursor: default }

/* 회원 가입 */

/* 툴팁 스타일 */
.tooltip { position: absolute; top: 65px; left: 50%; transform: translateX(-50%); background-color: var(--def-pp-deep); color: #fff; padding: 8px 12px; border-radius: 6px; font-size: 12px; white-space: nowrap; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, transform 0.3s ease; z-index: 5000; }
.tooltip::after { content: ""; position: absolute; top: -12px; left: 50%; transform: translateX(-50%) rotate(180deg); border-width: 6px; border-style: solid; border-color: var(--def-pp-deep) transparent transparent transparent; }
#h_app_ico_btn:hover .tooltip.kmarket { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(-5px); }
.tooltip.cal { top: 45px; }
#h_cal_btn:hover .tooltip.cal { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(-5px); }
.tooltip.active { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(-5px); }
#capslock_tooltip.tooltip { top: 50px; }
#capslock_tooltip.tooltip.login_v { top: 55px; left: 15%; }
/* 툴팁 스타일 */


/* pc - default right widget */
#layout_widget_right_container { width: 100% }
.btn_hidden { visibility: hidden; opacity: 0; }
.btn_visible { visibility: visible; opacity: 1; }
.pc_main_top_bn_swiper_cont.swiper-container { width: 100%; overflow: hidden; }
.pc_main_top_bn_swiper_cont .swiper-wrapper { display: flex; transition: transform 0.3s ease; }
.pc_main_top_bn_swiper_cont .swiper-slide { flex-shrink: 0; width: 100%; }
.pc_b_list_bn_swiper_cont.swiper-container { width: 100%; overflow: hidden; }
.pc_b_list_bn_swiper_cont .swiper-wrapper { display: flex; transition: transform 0.3s ease; }
.pc_b_list_bn_swiper_cont .swiper-slide { flex-shrink: 0; width: 100%; }
.pc_main_bottom_bn_swiper_cont.swiper-container { width: 100%; overflow: hidden; }
.pc_main_bottom_bn_swiper_cont .swiper-wrapper { display: flex; transition: transform 0.3s ease; }
.pc_main_bottom_bn_swiper_cont .swiper-slide { flex-shrink: 0; width: 100%; }

/* 이용약관, 개인정보처리방침 css 24.12.02 */
.tbl_content_inner { max-width: 830px; margin: 0 auto; }
.tbl_content_main { max-height: 800px; overflow-y: auto; }
.tbl_content_main p{ color: var(--common_txt)}
.tbl_content_tt { margin: 30px 0; text-align: center; }
.tbl_content_tt h3 { font-size: 25px; font-weight: bold; color: var(--common_txt)}
.tbl_content_main::-webkit-scrollbar { width: 3px; }
.tbl_content_main::-webkit-scrollbar-thumb { background-color: gray; border-radius: 10px; }
.tbl_content_main::-webkit-scrollbar-thumb:hover { background-color: darkgray; }
.tbl_content_main::-webkit-scrollbar-track { background: transparent; }
.tbl_content_main::-webkit-scrollbar-button { display: none; }
/* 이용약관, 개인정보처리방침 css 24.12.02 */

@media screen and (max-width:1400px) { }
@media screen and (max-width:1280px) { }
@media screen and (max-width:1024px) { }

/* MOBILE */
@media screen and (max-width:768px) { }
@media screen and (max-width:480px) { }
@media screen and (max-width:360px) { }
@media screen and (max-width:280px) { }