@charset "utf-8";

@import url("./xeicon.css");
@import url("./slick.css");
@import url("./swiper.min.css");
@import url("./common.css?v=250811");

@font-face {
    font-family:'NotoSans';
    font-style:normal;
    font-weight:300;
    src:url(fonts/NotoSansCJKkr-DemiLight.eot);
    src: local(☺),
    url(fonts/NotoSansCJKkr-DemiLight.eot?#iefix) format('embedded-opentype'),
    url(fonts/NotoSansCJKkr-DemiLight.woff) format('woff');
}
@font-face {
    font-family:'NotoSans';
    font-style:normal;
    font-weight:400;
    src:url(fonts/NotoSansCJKkr-Regular.eot);
    src: local(☺),
    url(fonts/NotoSansCJKkr-Regular.eot?#iefix) format('embedded-opentype'),
    url(fonts/NotoSansCJKkr-Regular.woff) format('woff');
}
@font-face {
    font-family:'NotoSans';
    font-style:normal;
    font-weight:600;
    src:url(fonts/NotoSansCJKkr-Medium.eot);
    src: local(☺),
    url(fonts/NotoSansCJKkr-Medium.eot?#iefix) format('embedded-opentype'),
    url(fonts/NotoSansCJKkr-Medium.woff) format('woff');
}
@font-face {
    font-family:'NotoSans';
    font-style:normal;
    font-weight:700;
    src:url(fonts/NotoSansCJKkr-Bold.eot);
    src: local(☺),
    url(fonts/NotoSansCJKkr-Bold.eot?#iefix) format('embedded-opentype'),
    url(fonts/NotoSansCJKkr-Bold.woff) format('woff');
}

* {margin:0; padding:0; box-sizing:border-box; -webkit-text-size-adjust:none;}
body,html {width:100%; min-width:320px; min-height:100vh; font-family:'NotoSans',sans-serif; color:#333; font-weight:400; letter-spacing:-.5px; line-height:1.4;}
body {position:relative;}
a {font-family:inherit; text-decoration:none; color:inherit;}
em, i, address {font-style:normal;}
h1, h2, h3, h4, h5, h6 {font-size:100%;}
ul, ol {list-style:none;}
ul, ol:after {content:''; display:block; clear:both;}
b, strong {font-weight:700;}
img {border:0; vertical-align:top;}
table {width:100%; table-layout:fixed; border-collapse:collapse; border-spacing:0; border:0;}
caption, summary {width:0; height:0; line-height:0; font-size:0; visibility:hidden;}
input, textarea, select, button {font-family:inherit; appearance:none; -webkit-appearance:none;}
iframe {border:none;}
button {font-size:inherit; border:0; box-shadow:none; cursor:pointer; background:transparent;}
input[type="text"]:disabled {background:#eee; opacity:1;}
input[type="text"],input[type="password"],input[type="number"],input[type="tel"],input[type="email"],
input[type="button"],input[type="submit"],input[type="reset"] {height:40px; padding:0 10px; border:solid 1px #cfcfcf; border-radius:0;}
input[type="file"] {position:absolute; left:0; top:0; width:1px; height:1px; margin-left:-1px; vertical-align:top; opacity:0; cursor:pointer; z-index:10;}
textarea {width:100%; height:200px; line-height:1.5em; padding:12px; border:solid 1px #cfcfcf; resize:none; border-radius:0;}
select {width:100%; height:40px; padding:0 30px 0 10px; border:1px solid #cfcfcf; color:#333; background:#fff url('../images/input_select.png')right center no-repeat; background-size:24px; border-radius:0;} 
select::-ms-expand {display:none; background-color:transparent; border:0;}

::-webkit-input-placeholder {color:#888;}
::-moz-placeholder {color:#888;}
:-ms-input-placeholder {color:#888;}


/* --------------------------------------------------------------------------------------------------------
	Fast Class
----------------------------------------------------------------------------------------------------------- */
.ac {text-align:center !important;}
.ar {text-align:right !important;}
.al {text-align:left !important;}
.aj {text-align:justify !important;} 
.at {vertical-align:top !important;}
.am {vertical-align:middle !important;}

.fl {float:left !important;}
.fr {float:right !important;}

.mw100 {max-width:100%;}
.w50 {width:50% !important;}
.w100 {width:100% !important;}

.mt0 {margin-top:0 !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt30 {margin-top:30px !important;}
.mt60 {margin-top:60px !important;}
.ml10 {margin-left:10px !important;}
.mb0 {margin-bottom:0 !important;}
.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb40 {margin-bottom:20px !important;}
.pt10 {padding-top:10px !important;}
.pt30 {padding-top:30px !important;}
.pb0 {padding-bottom:0 !important;}
.pb20 {padding-bottom:20px !important;}

.f-red {color:#e50032 !important;}
.f-blue {color:#5477d1 !important;}
.f-dgry {color:#666 !important;}
.f-gray {color:#999 !important;}

.f-s {font-size:12px;}

.mo-view {display:none !important}

/* --------------------------------------------------------------------------------------------------------
	Input(checkbox/radio)
----------------------------------------------------------------------------------------------------------- */
input[type="checkbox"], input[type="radio"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); border:0;}
input[type="radio"] + label, input[type="checkbox"] + label {position:relative;	margin-right:15px; cursor:pointer;} 
input[type="checkbox"] + label:before, input[type="radio"] + label:before {content:''; display:inline-block; width:20px; height:20px; margin:-3px 10px 0 0; text-align:center; line-height:20px; background:#fff; border:1px solid #cbcdcc; border-radius:2px; vertical-align:middle; cursor:pointer;}
input[type="radio"] + label:before {width:22px; height:22px; border-radius:50%; box-sizing:border-box;}
input[type="checkbox"]:checked + label:before {content:'\e929'; font-family:'xeicon'; font-size:23px; color:#111; line-height:19px; font-weight:600;}
/* input[type="radio"]:checked + label:before {content:''; box-sizing:border-box;} */
input[type="radio"]:checked + label:after {content:''; position:absolute; left:5px; top:6px; width:12px; height:12px; background:#333; border-radius:10px; /* transform:translateY(-50%); */}
/* input[type="radio"]:focus + label, input[type="checkbox"]:focus + label {outline:1px dotted #999;} //2023-01 수정: 코드오류 없게 전체주석처리*/

/* --------------------------------------------------------------------------------------------------------
	Button
----------------------------------------------------------------------------------------------------------- */
.btn-wrap {margin:40px 0 0; text-align:center;}
button[class^="btn-"] {display:inline-block; text-align:center; vertical-align:middle;}
.btn-wrap button[class^="btn-"] + button[class^="btn-"] {margin-left:8px;}
.btn-wish {position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); margin-top: 98px; margin-left: 90px; width:24px; height:24px; background:url('../images/ico_heart.png') 0 0 no-repeat; font-size:0;}
.btn-wish.on {background-position:0 bottom;}

.btn-darkB {width:100%; height:58px; border:1px solid #000; color:#000; font-size:18px; font-weight:600;}
.btn-dark {min-width:210px; height:58px; background:#000; color:#fff; font-size:18px; font-weight:600;}
.btn-darkR {min-width:250px; height:50px; background:#202020; color:#fff; font-size:18px; font-weight:600; border-radius:4px;}
.btn-blu {min-width:140px; height:44px; padding:0 12px; background:#69748a; color:#fff; border-radius:2px;}
.btn-gry {min-width:250px; height:30px; padding:0 7px; background:#a5a5a5; color:#fff; border-radius:5px;} /* 2023-04-13 수정 */
.btn-lightgray {min-width:250px; height:30px; padding:0 7px; background:#d4d4d4; color:#f1f1f1; border-radius:5px;} /* 2023-04-21 추가 */
.btn-pink {min-width:250px; height:30px; padding:0 7px; background:#ff5697; color:#fff; border-radius:5px;} /* 2023-04-13 수정 */
.btn-org {min-width:195px; height:50px; background:#fb6e38; color:#fff; border-radius:2px;}
.btn-more {min-width:180px; height:47px; background:#fafafa; border:1px solid #e6e6e6; color:#333;} /* 2023-01 수정: border-radius 제거 */
.btn-more:after {content:'\e941'; font-family:xeicon; font-size:16px; margin-left:10px; color:#666; vertical-align:middle;}

/* --------------------------------------------------------------------------------------------------------
	Table
----------------------------------------------------------------------------------------------------------- */
.tbl-list thead th {padding:14px 0; border:1px solid #e9e0ce; background:#f1ede5;}
.tbl-list tbody	th {background:#f1ede5; font-weight:600;}
.tbl-list tbody	td, .tbl-list tbody	th {padding:15px 6px; border:1px solid #e9e0ce;}

.tbl-list.type2 tbody td, .tbl-list.type2 tbody th {padding:20px 6px; text-align:center;}
.tbl-list.type2 tbody td .al {padding-left:20px;}

.bbs-list {border-top:2px solid #666;}
.bbs-list thead	th, .bbs-list tbody	td {padding:15px 5px; border-bottom:1px solid #d0cfd5; text-align:center;}

.tbl-data th, .tbl-data td {padding:8px 15px; text-align:center; background:#fafafa; border:1px solid #e1e1e1; color:#666; font-weight:500;}
.tbl-data td {text-align:left; padding-left:30px; background:#fff;}


/* Responsive */
@media all and (max-width:1024px) { /* 2023-01 수정: 현재 반응형 분기에 맞춰 기준값 변경 */
	input[type="checkbox"] + label:before, input[type="radio"] + label:before {width:18px; height:18px; margin:-1px 8px 0 0; line-height:18px; vertical-align:top;}
	input[type="radio"] + label:before {width:20px; height:20px; line-height:20px;}
	input[type="checkbox"]:checked + label:before {font-size:20px;}
	input[type="radio"]:checked + label:after {left:6px; top:50%; width:8px; height:8px; transform:translateY(-50%);}
	.btn-wrap {margin:20px 0 0;}
	.btn-dark {height:45px; font-size:15px;}
	.btn-wish {margin-top: 50px; margin-left: 55px;}
	.btn-more {height:41px;} /* 2023-01 반응형별 디자인에 맞춰 모바일 사이즈에서만 적용되게 @media all and (max-width:767px)로 min-width:100% 코드 이동 */
	.btn-more:after {font-size:14px;}
    /* .btn-gry {height:65px;} //2023-04-13 숨김 */
    /* .btn-pink {height:80px;} //2023-04-13 숨김 */

	.tbl-list thead th {padding:12px 0;}
	.tbl-list tbody	td {padding:12px 12px;}
	.tbl-data th, .tbl-data td {padding:6px 8px;}
	.tbl-list.type2 tbody td, .tbl-list.type2 tbody th {padding:12px 5px; text-align:center;}
	.tbl-list.type2 tbody td .al {padding-left:6px;}
	.bbs-list thead	th, .bbs-list tbody	td {padding:12px 2px;}

    .pc-view {display:none !important}
    .mo-view {display:block !important}
}

@media all and (max-width:800px) {
	.btn-wrap.col2 button {min-width:auto; width:48.5%; height:40px;}
	.btn-blu.full {width:100%; height:40px; font-size:14px;}
}

/* 2023-01 추가 */
@media all and (max-width:767px) {
	.btn-more {min-width:100%;}
}

.blind {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); border:0;}
.check-custom input[type="checkbox"] + label:before {content:''; display:inline-block; width:20px; height:20px; margin:-3px 10px 0 0; text-align:center; line-height:20px; background:#fff; border:1px solid #cbcdcc; border-radius:50%; vertical-align:middle; cursor:pointer;}
.check-custom input[type="checkbox"]:checked + label:before {content:''; background: transparent url('../images/ico_checked_pink.png') no-repeat; background-size: 100%; border: 1px solid transparent;}