/*
 *  MEMO : 프로젝트 내부 공통 스타일 파일입니다.
 * 작성자 : 윤정
 * 작성일 : 2021/03/29.
*/
@charset "utf-8";
/* 전체 : U+0020-007E
특수문자 : U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E
영문 : U+0041-005A(대문자), U+0061-007A(소문자)
숫자 : U+0030-0039
ex )
unicode-range: U+0041-005A, U+0061-007A;
*/


@charset "utf-8";
/* font index */
@font-face {
  font-family: 'font-b';
  font-style: normal;
  font-weight: 700;
  src: url(/fonts/Pretendard-Bold.woff2) format('woff2'), url(/fonts/Pretendard-Bold.woff) format('woff'), url(/fonts/Pretendard-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'font-eb';
  font-style: normal;
  font-weight: 900;
  src: url(/fonts/Pretendard-Black.woff2) format('woff2'), url(/fonts/Pretendard-Black.woff) format('woff'), url(/fonts/Pretendard-Black.ttf) format('truetype');
}
@font-face {
  font-family: 'font-sb';
  font-style: normal;
  font-weight: 600;
  src: url(/fonts/Pretendard-SemiBold.woff2) format('woff2'), url(/fonts/Pretendard-SemiBold.woff) format('woff'), url(/fonts/Pretendard-Black.ttf) format('truetype');
}
@font-face {
  font-family: 'font-l';
  font-style: normal;
  font-weight: 300;
  src: url(/fonts/Pretendard-Light.woff2) format('woff2'), url(/fonts/Pretendard-Light.woff) format('woff'), url(/fonts/Pretendard-Light.ttf) format('truetype');
}
@font-face {
  font-family: 'font-m';
  font-style: normal;
  font-weight: 500;
  src: url(/fonts/Pretendard-Medium.woff2) format('woff2'), url(/fonts/Pretendard-medium.woff) format('woff'), url(/fonts/Pretendard-Medium.ttf) format('truetype');
}

@font-face {
  font-family: 'font-r';
  font-style: normal;
  font-weight: 400;
  src: url(/fonts/Pretendard-Regular.woff2) format('woff2'), url(/fonts/Pretendard-Regular.woff) format('woff'), url(/fonts/Pretendard-Regular.ttf) format('truetype');
}

body,th,td,select,button, div, span {font-family:"font-m", sans-serif; font-size:16px; color:#3C3D46; line-height: 1.4;}
label,input,textarea{font-size: 14px; font-family:"font-m", sans-serif;}

:root{
	--main-color : #FF465F;
	--txt-basic : #3C3D46;
	--txt-sub : #777;
	--txt-deepgray : #9192A7;
}


/* 대표 컬러 설정 */
.essential{color:var(--main-color); padding-left: 5px;}
.primary_color{color:var(--main-color);}

/* 폰트 */
.txt_r{font-family: 'font-r' !important;}
.txt_m{font-family: 'font-m' !important;}
.txt_bold{font-family: 'font-b';}
h1{font-size: 24px; font-family: 'font-b'; color: var(--txt-basic);}
h2{font-size: 22px; font-family: 'font-b'; color: var(--txt-basic);}
h3{font-size: 20px; font-family: 'font-b'; color: var(--txt-basic);}
h4{font-size: 18px; font-family: 'font-b'; color: var(--txt-basic);}
h5{font-size: 16px; font-family: 'font-b'; color: var(--txt-basic);}
h6{font-size: 14px; font-family: 'font-b'; color: var(--txt-basic);}
/* txt */
.txt_lh_1{line-height: 1.4;}
.txt_lh_2{line-height: 1.6;}

/* 라인 */
hr{width: 100%; height: 0; border: 0; border-bottom: 1px solid #E3E6EE;margin: 0;}
hr.space{background: #eee; width: 100%; height:5px; border-bottom: 0; margin: 0;}

.ease, button, a{transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;}


/* button custom : s */
/* only colors */
button.btn_primary_line:disabled{border: none; color: #999;}
button.btn_primary{border:1px solid var(--main-color); background:var(--main-color); color: #fff; box-sizing: border-box;}
button.btn_gray_line{border:1px solid #ddd; background: #fff; color:var(--main-color); box-sizing: border-box;}
button.btn_green{border:1px solid #00ad7d; background:#00ad7d; color: #fff; box-sizing: border-box;}

/* only shape */
button.btn_full_basic{border-radius:8px; width:100%; height:50px; display: flex; align-items: center; justify-content: center; font-family:'font-b'; box-sizing: border-box; font-size:16px;}
button.btn_basic{border-radius:8px; padding:10px 25px; font-family:'font-b'; box-sizing: border-box; font-size:16px; display: flex; align-items: center; gap:8px; justify-content: center;}
button.btn_sm{border-radius:8px; padding:8px 18px; font-family:'font-m'; box-sizing: border-box; font-size:14px; display: flex; align-items: center; gap:8px; justify-content: center;}
button.btn_img{border-radius:8px; padding:10px 10px; font-family:'font-b'; box-sizing: border-box; font-size:16px; display: flex; align-items: center; gap:8px; justify-content: center;}

button img{width:24px;}

/* 폼 관련 */
textarea{width:100%; height:100px; padding:10px 16px; border: 1px solid #DDDFE9; resize: none; box-sizing: border-box;-webkit-appearance: none; border-radius:8px;}
::-webkit-input-placeholder {color:#C7C8D5;}/* WebKit, Blink, Edge */
:-moz-placeholder {color:#C7C8D5; opacity:1;} /* Mozilla Firefox 4 to 18 */
::-moz-placeholder {color:#C7C8D5; opacity:  1;}/* Mozilla Firefox 19+ */
:-ms-input-placeholder {color:#C7C8D5;}/* Internet Explorer 10-11 */
select{border:1px solid #ddd; vertical-align:middle; width:100%; /*height:44px;*/ box-sizing:border-box; padding:0 32px 0 15px; background:#fff url('../images/arrow_dropdown.png') no-repeat calc(100% - 14px) 50%; background-size:16px auto; -webkit-appearance: none;  -webkit-border-radius:8px; -moz-appearance: none; appearance: none; box-sizing: border-box;}
select::-ms-expand {display: none; /* remove default arrow in IE 10 and 11 */}
select:focus > option:checked {background: #fff !important;}
select[multiple]:focus option:checked {background: red linear-gradient(0deg, red 0%, red 100%);}
.select_auto{width:auto; height:auto;padding-left: 0;border:0;background: url('/images/arrow_align.png') no-repeat calc(100% - 10px) 50%; background-size: 9px;}
.slt_active_line{border:1px solid #FF4F82; color:#FF4F82; border-radius: 5px;background: url('/images/arrow_more.png') no-repeat calc(100% - 10px) 50%; background-size: 12px;text-indent: 14px;height: 40px;}
select:disabled{background:#f5f5f5;}
button:disabled{background:#f5f5f5; cursor:default;}


/* input style */
/* input{text-indent:14px; border-radius:8px; width:100%; height:44px; box-sizing:border-box; border: 1px solid #DDDFE9;}
input[type='text'],input[type='tel'],input[type='email'],input[type='password'],input[type='submit'],input[type='search'] {-webkit-appearance:none; -webkit-border-radius:8px; height:50px; box-sizing:border-box; border:1px solid #DDDFE9; border-radius:8px; text-indent:14px;}
input:checked[type='checkbox'] {background-color:#666; -webkit-appearance:checkbox} button,input[type='button'],input[type='submit'],input[type='reset'],input[type='file'] {-webkit-appearance:button; border-radius:0}
input[type='search']::-webkit-search-cancel-button {-webkit-appearance:none}
input.pw_type{font-family: 'sans-serif';}
input.input_calendar{background:#fff url('../images/ic_calendar.png') no-repeat calc(100% - 15px) 50%; background-size:20px auto;} */

/* input[type="checkbox"] {display:none;}
input[type="checkbox"] + label {cursor:pointer; display:inline-block; margin-right:0px; color: #000; font-size: 14px;}
input[type="checkbox"] + label span {display:inline-block; width:20px; height:20px; margin:0px 10px 0 0; vertical-align:middle; background:url('/images/checkbox.png') right center no-repeat; cursor:pointer; background-size:20px;}
input[type="checkbox"]:checked + label span {background:url('../images/checkbox_checked.png') right center no-repeat; background-size:20px;}
input[type='checkbox']:disabled + label span{display:inline-block; width:20px; height:20px; margin:-3px 8px 0 0; vertical-align:middle; background:url('/images/checkbox_disabled.png') right center no-repeat; cursor:pointer; background-size:20px;}
input[type='checkbox']:disabled + label{color:#A0A0A0;} */

/* input[type="radio"] {display:none;}
input[type="radio"] + label {cursor:pointer; display:inline-block; font-size:14px; color: #000;}
input[type="radio"] + label span {display:inline-block; width:22px; height:22px; margin:0px 10px 0 0; vertical-align:middle; background:url('../images/radio.png') right center no-repeat; cursor:pointer; background-size:22px;}
input[type="radio"]:checked + label span {background:url('../images/radio_checked.png') right center no-repeat; background-size:22px;}
input[type='radio']:disabled + label span{display:inline-block; width:22px; height:22px; margin:-3px 8px 0 0; vertical-align:middle; background:url('../images/radio_disabled.png') right center no-repeat; cursor:pointer; background-size:22px;}
input[type='radio']:disabled + label{color:#A0A0A0;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;} */

.btn_checkType input[type="checkbox"] + label{box-sizing:border-box; font-size:14px; color:#626B80; border: 1px solid #E9E9E9; border-radius:8px; padding:10px; margin-right: 5px;}
.btn_checkType input[type="checkbox"]:checked + label{color:#5675EC; font-weight: bold; border: 1px solid #5675EC;}

.btn_radioType input[type="radio"] + label{box-sizing:border-box; font-size:14px; color:#2D2E88; border: 1px solid #2D2E88; border-radius:3px; padding:10px 30px;}
.btn_radioType input[type="radio"]:checked + label{color:#fff; font-weight:bold; border: 1px solid #2D2E88; background:#2D2E88;}

/* 스위치 체크박스 */
.switch {position:relative; display:inline-block; width:40px; height:24px;}
.switch2 input[type="checkbox"] + span{transition:0.1s ease-out;width: 40px; height:24px;position:relative; display:inline-block;background:url('/images/switch_off.png') no-repeat;background-size:40px; }
.switch2 input[type="checkbox"]:checked + span{transition:0.1s ease-in;width: 40px; height:24px;position:relative; display:inline-block;background:url('/images/switch_on.png') no-repeat;background-size: 40px; }

.check_slider {position:absolute; cursor:pointer; height:14px; width:34px; top:0; left:0; right:0; bottom:0; background-color:#ddd; -webkit-transition:.4s; transition: .4s; border-radius: 24px;}
.check_slider:before {position: absolute; content: ""; height: 22px; width:22px; left:-1px; bottom:-4px; background: #999; -webkit-transition: .4s; transition: .4s; border-radius: 50%;}
input:checked + .check_slider {background-color: #CCD0ED; height:14px;}
input:focus + .check_slider {box-shadow: 0 0 1px #757575;}
input:checked + .check_slider:before {-webkit-transform: translateX(14px); -ms-transform: translateX(14px); transform: translateX(14px); background:#0114A7;}

/* modal 공통 레이아웃 */
/* .modal{background:#fff; position:fixed; border-radius:10px; width:400px; height:auto; z-index:10002; top:50%; left: 50%; transform: translate(-50%, -50%); display: none; box-sizing: border-box;} */
.modal .modal_container{position:relative; padding:0 20px 30px 20px; box-sizing:border-box;}
.modal .scroll_container{height:500px; overflow-y: auto; padding-right: 10px; box-sizing: border-box;}
.modal .modal_title{display: flex; justify-content: space-between; align-items: center; padding: 20px; box-sizing: border-box;}
.modal .md_btn_close{cursor:pointer; width:20px;}
.md_overlay{position:fixed; width: 100%; height: 100%; top:0; left:0; background: rgba(0,0,0,.5); opacity: 0; visibility: hidden; z-index:10001}



/* 대표 wrap */
.body{box-sizing: border-box; min-height: 500px; padding-top:85px;}
.main_body{background: #fff;}
.main_body .body{ box-sizing: border-box; padding-top:0px; }
/* .main_body footer{ box-sizing: border-box; padding-top:0px;} */
.inner_wrap{width:1200px; margin: 0 auto;}
.inner_mid_wrap{width:800px; margin: 0 auto;}
.inner_sm_wrap{width:350px; margin: 0 auto;}

.w_100p{width:100% !important;}

.ic_12{width:12px; height: 12px;}
.ic_16{width:16px;}
.ic_24{width:24px;}
.ic_36{width:36px;}

/* ------------------------------------------------------------------------------------------------------------- */
header{width:100%; /* min-width:1200px; */ background: #fff; box-sizing: border-box; position: fixed; z-index:1000; left:0; top:0; padding: 0 10%; box-shadow:0 3px 5px 1px rgb(0 0 0 / 6%);}
.header_inner{display: flex; justify-content: space-between; align-items:center; height:80px; position: relative;}
header .header_logo{width:150px; overflow: hidden; position: relative; float: left;}
header .header_logo img{width:100%;}
.header_right{display:flex; align-items:center; gap:30px;}
.header_right a{font-size:16px; color: #878992;}
.session_status{display:flex; align-items:center; gap:8px; color:#626B80; font-size:14px;}
.session_status_label{color:#878992;}
.session_countdown{color:#2D2E88; font-family:'font-b'; min-width:48px; text-align:right;}
.session_expired{color:#E35252; font-family:'font-b';}
/* .btn_session_extend{display:inline-flex; align-items:center; padding:8px 14px; border:1px solid #D5D9E4; border-radius:8px; color:#4D5768 !important; font-size:14px !important; line-height:1; transition:all .15s ease;}
.btn_session_extend:hover{background:#F6F8FB; border-color:#B8C1D4; color:#2F3746 !important;} */

footer{width:100%; padding:40px 0 50px; background:#fff; margin-top: 100px; border-top: 1px solid #ddd;}
footer .footer_menu{display:flex; gap: 20px;}
footer .footer_menu li a{color:var(--txt-basic); font-size:16px;}
footer .footer_menu li.point a{font-weight: bold;}
footer .footer_logo{width: 120px;}
footer .footer_logo img{width: 100%;}
footer .footer_top{display: flex; justify-content:space-between; align-items: center;}
footer .footer_info{display: flex; flex-direction: column; gap:3px; margin-top: 30px;}
footer .footer_info >div{color:var(--txt-sub); font-size: 14px; display: flex; gap:4px 6px; align-items: center;}
footer .footer_info >div span{font-size: 10px; color:var(--txt-sub);}
footer p{ color: #878992; margin-top: 40px; font-size: 13px;}


/* paging ui */
.paging{margin-top:40px; display:flex; justify-content: center;}
.paging>ul{display:flex; margin: 0 auto; align-items: center; justify-content:center; gap:4px;}
.paging li{font-size:16px; color:#9D9999; background:#fff; cursor:pointer; width:38px; height:38px; display: flex; gap:4px; align-items: center; justify-content: center;}
.paging li img{width:38px; display: block;}
.paging li.active{border-radius: 5px; color:var(--main-color); font-family:'font-b'; border-radius:3px;}
.paging li:hover.active{color:var(--main-color); font-family:'font-b';}
.paging li:hover{background:#F2F3F6;}
.paging li.btn_area{display:flex; gap:6px; background: transparent; width: auto;}

/* board */
.board_list th{font-size:14px; font-family: 'font-b'; padding: 10px 0; text-align: center; background: #fff; border-bottom:1px solid var(--txt-basic);}
.board_list td{background:#fff; border-bottom:1px solid #ddd; font-size:13px; color:var(--txt-basic); height: 70px; text-align: center;}
.board_list td, .board_list th{font-size: 14px; padding: 10px; line-height:1.3;}
.board_list td span{font-size: 14px; color:var(--txt-sub);}


/* group */
.group_between{display:flex; justify-content: space-between; align-items: center;}