@charset "utf-8";

/* 작성자: 황희진(grigo0704@naver.com) / 작성일: 2020년 11월 30일  / 버전 0.2 */
/* 작성자: 최용 / 작성일: 2020년 12월 01일  / 색상 및 투명도 수정  */


/* RESET */
* { padding: 0; margin: 0; border: 0; outline: 0; box-sizing: border-box; }
:focus { outline: 0; }
html { width: 100%; height: 100%; -webkit-text-size-adjust: none; }
body { width: 100%; height: 100%; font: normal 14px/120% 'Nanum Square', 'Malgun Gothic', sans-serif; }
h1, h2, h3, h4, h5, h6 { display: inline-block; font-family: 'Nanum Square', 'Malgun Gothic', sans-serif; }
i, em, address { font-style: normal; }
input, select, textarea, button, label { font-family: inherit; font-size: 100%; vertical-align: middle; outline: none; -webkit-appearance: none; }
input::-webkit-inner-spin-button { display: none; }
input::-webkit-clear-button { display: none; }
input::-ms-clear { display: none; }
textarea { resize: none; }
label { cursor: pointer; }
fieldset, img, iframe { border: none; }
img { vertical-align: top; outline: none; }
a { color: inherit; text-decoration: none; }
menu, li { list-style: none; }
button { font-family: inherit; padding: 0; margin: 0; border: 0; cursor: pointer; vertical-align: middle; background: none; }
caption { width: 0; height: 0; font-size: 0; line-height: 0; overflow: hidden; visibility: hidden; }
hr { display: none; }
table { width: 100%; border-spacing: 0; border-collapse: collapse; }
th { text-align: center; vertical-align: middle; }
td { text-align: left; }
mark { background: none; }

::-webkit-input-placeholder { /* WebKit browsers */ font-size: 12px; color:#b0b0b0; text-transform:none; }
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ font-size: 12px; color:#b0b0b0; text-transform:none; opacity:1; filter: alpha(opacity=100); }
::-moz-placeholder { /* Mozilla Firefox 19+ */ font-size: 12px; color:#b0b0b0; text-transform:none; opacity:1; filter: alpha(opacity=100); }
:-ms-input-placeholder { /* Internet Explorer 10+ */ font-size: 12px; color:#b0b0b0; text-transform:none; }


.hide { display: none !important; }

.tl { text-align: left !important; }
.tr { text-align: right !important; }
.tc { text-align: center !important; }



/************************************** HEAD TITLE **************************************/

h1 { display: block; overflow: hidden; width: 200px; height: 30px; background: url("../img/ci.png") no-repeat center 50%; background-size: 100%; text-indent: -9999px; margin: auto; margin-bottom: 10px; }
h1 a { display: block; width: 100%; height: 100%; }

h2 { display: block; height: 40px; color: #fff; font-weight: 700; font-size: 40px; line-height: 40px; text-align: center; text-shadow: 0 0 5px rgba(0,0,0,0.5); }
h2 i { display: inline-block; height: 38px; line-height: 38px; font-weight: 900; border-bottom: 1.5px solid #fff; padding-right: 5px; }

h3 { display: block; overflow: visible; color: #fff; font-size: 40px; font-weight: 700; line-height: 120%; text-shadow: 0 0 5px rgba(0,0,0,1); }






/************************************** BUTTON **************************************/

/* BT_TXT */
.btTxt { display: block; overflow: hidden; height: 80px; line-height: 80px; color: #fff; font-size: 24px; font-weight: 700; text-align: center; text-shadow: 0 0 5px rgba(0,0,0,0.5); border: 1px solid rgba(0,0,0,0.3); border-radius: 3px; background-color: #CA1421; padding: 0 30px; box-shadow: 0 5px 5px rgba(0,0,0,0.3); }
.btTxt:active { box-shadow: none; }

/*<--20201204*/
/* BT_ID */
.btID { position: relative; display: block; overflow: hidden; width: 45px; height: 60px; color: #b0b0b0; font-size: 12px; text-indent: -9999px; border: 1px solid #fff; border-radius: 2px; background: rgba(0,0,0,0.8) url("../img/bt_id.png") no-repeat center 50%; background-size: 30px; box-shadow: 0 3px 5px rgba(0,0,0,0.5); opacity: 0.5; }
.btID::before { position: absolute; left: 50%; margin-left: -3px; top: 2px; content: ""; display: block; width: 6px; height: 2px; border-radius: 1px; background-color: #fff; }
.btID:hover { opacity: 1; }
/*20201204-->*/

/* BT_MENU */
.btMenu { display: inline-block; overflow: hidden; width: 180px; height: 180px; color: #fff; font-size: 24px; font-weight: 700; text-align: center; text-shadow: 0 0 5px rgba(0,0,0,0.5); border: 1px solid rgba(256,256,256,0.1); border-radius: 3px; padding-top: 80px; box-shadow: 0 0 15px rgba(0,0,0,0.5); vertical-align: middle; margin: 10px; }
.btMenu.new { background: #154C93 url("../img/bt_new.png") no-repeat center 30px; background-size: 70px; }
.btMenu.reserv { background: #865AAD url("../img/bt_reserv.png") no-repeat center 30px; background-size: 70px; }
.btMenu:disabled { background-color: #121212; opacity: 0.8; }

/* BT_CLOSE */
.btClose { display: inline-block; overflow: hidden; width: 40px; height: 40px; background: none; }
.btClose i { position: relative; display: block; width: 40px; height: 40px; text-indent: -9999px; }
.btClose i::before { position: absolute; top: 50%; margin-top: -20px; left: 50%; margin-left: -0.5px; content: ""; display: block; width: 1px; height: 40px; border-radius: 0.5px; background-color: #fff; transform: rotate(-135deg); }
.btClose i::after { position: absolute; top: 50%; margin-top: -20px; left: 50%; margin-left: -0.5px; content: ""; display: block; width: 1px; height: 40px; border-radius: 0.5px; background-color: #fff; transform: rotate(-45deg); }

/* BT_FIND */
.btFind { display: inline-block; overflow: hidden; width: 35px; height: 35px; background: none; }
.btFind i { position: relative; display: block; width: 35px; height: 35px; margin: auto; }

/* BT_DATE */
.btDate { display: inline-block; overflow: hidden; width: 50px; height: 50px; text-indent: -9999px; background: url("../img/ico_date.png") no-repeat center 50%; background-size: 20px; }

/* BT_MORE */
.btMore { display: block; overflow: hidden; width: 150px; height: 40px; color: #b0b0b0; font-size: 12px; text-align: center; border-radius: 20px; background-color: #fff; box-shadow: 0 3px 5px rgba(0,0,0,0.05); margin: 30px auto 0 auto; }

/* BT_RESET */
.btReset { display: inline-block; overflow: hidden; height: 40px; line-height: 41px; color: #fff; font-size: 12px; border-radius: 20px; background: #000 url("../img/ico_reset_wt.png") no-repeat calc(100% - 15px) 50%; background-size: 15px; padding: 0 35px 0 20px; opacity: 0.5; }
/* BT_RESET */

/* BT_NEXT */
.btNext { display: inline-block; overflow: hidden; width: 40px; height: 40px; vertical-align: middle; }
.btNext i { position: relative; display: block; overflow: hidden; width: 100%; height: 100%; text-indent: -9999px; }
.btNext i::before { position: absolute; right: 50%; top: 50%; margin-top: -3.5px; content: ""; display: block; overflow: hidden; width: 6px; height: 6px; border-top: 2px solid #000; border-right: 2px solid #000; transform: rotate(45deg); }

/* BT_PREV */
.btPrev { display: inline-block; overflow: hidden; width: 40px; height: 40px; vertical-align: middle; }
.btPrev i { position: relative; display: block; overflow: hidden; width: 100%; height: 100%; text-indent: -9999px; }
.btPrev i::before { position: absolute; left: 50%; top: 50%; margin-top: -3.5px; content: ""; display: block; overflow: hidden; width: 6px; height: 6px; border-top: 2px solid #000; border-right: 2px solid #000; transform: rotate(-135deg); }




/************************************** FORM **************************************/

/* BG */
.bg { display: block; overflow: hidden; width: auto; height: 100%; background: url("../img/bg_new_241120.jpg") no-repeat left 50%; background-size: auto 100%; animation: bg linear 50s infinite alternate; }
@keyframes bg { from { background-position: left 50%; } to { background-position: right 50%; } }

/* INPUT */
.input { position: relative; display: inline-block; overflow: visible; height: 50px; vertical-align: middle; }
.input input { display: block; width: 100%; height: 100%; line-height: 50px; color: #000; font-size: 16px; text-align: left; border: 1px solid rgba(0,0,0,0.2); border-radius: 3px; background-color: #fff; padding: 0 15px; }
.input input:-ms-input-placeholder { color:#b0b0b0; }
.input input:focus { border-color: #8400ff; box-shadow: 0 0 5px rgba(0,0,0,0.1); }
.input input:disabled { background-color: #f0f0f0; }

.input .btDate { position: absolute; top: 0; right: 0; }
.input .btDate ~ input { padding-right: 50px; }


/* SELECT */
.select { position: relative; display: inline-block; height: 50px; vertical-align: middle; }
.select > select { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; display: block; width: 100%; height: 100%; line-height: 50px; color: #505050; font-size: 12px; padding: 0 10px; opacity: 0; }
.select > select:focus ~ label { border-color: #8400ff; box-shadow: 0 0 5px rgba(0,0,0,0.1); }
.select > label { position: relative; display: block; overflow: hidden; width: 100%; height: 100%; line-height: 50px; text-align: left; color: #303030; font-size: 16px; border: 1px solid rgba(0,0,0,0.2); border-radius: 3px; background-color: #fff; padding: 0 40px 0 15px; }
.select > label::before { position: absolute; right: 15px; top: 50%; margin-top: -6px; content: ""; display: block; overflow: hidden; width: 7px; height: 7px; border-top: 1px solid #000; border-right: 1px solid #000; transform: rotate(135deg); opacity: 0.3; }


/* CHECK */
.check { position: relative; display: block; height: 50px; vertical-align: middle; }
.check input { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 5; display: block; width: 100%; height: 100%; opacity: 0; }
.check label { position: relative; display: block; overflow: hidden; height: 50px; line-height: 50px; color: #121212; font-size: 16px; font-weight: 700; text-align: left; padding-left: 40px; }
.check label::before { position: absolute; left: 0; top: 50%; margin-top: -12.5px; content: ""; display: block; width: 25px; height: 25px; border-radius: 50%; background-color: rgba(0,0,0,0.1); }
.check label::after { position: absolute; left: 5px; top: 50%; margin-top: -7px; content: ""; display: block; overflow: hidden; width: 12px; height: 7px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: rotate(135deg); }
.check input:checked ~ label { color: #000; font-weight: 700; }
.check input:checked ~ label::before { background-color: #8400ff; }
.check input:disabled ~ label { opacity: 0.5; }




/************************************** OBJECT **************************************/

/* SEARCH */
.search { position: relative; display: block; width: 420px; border: 5px solid red; box-shadow: 0 0 15px rgba(0,0,0,0.5); margin: 50px auto 150px auto; }
.search input { width: 100%; height: 60px; line-height: 60px; color: #fff; font-size: 20px; border: 1px solid #000; background-color: rgba(0,0,0,0.5); padding: 0 60px 0 20px; }
.search input::-webkit-input-placeholder { font-size: 16px; color: rgba(256,256,256,0.4); text-transform: none; }
.search input:-moz-placeholder { font-size: 16px; color: rgba(256,256,256,0.4); text-transform: none; opacity: 1; filter: alpha(opacity=100); }
.search input::-moz-placeholder { font-size: 16px; color: rgba(256,256,256,0.4); text-transform:none; opacity: 1; filter: alpha(opacity=100); }
.search input:-ms-input-placeholder { font-size: 16px; color: rgba(256,256,256,0.4); text-transform: none; }
.search input:focus ~ .drop { display: block; }
.search .btFind { position: absolute; right: 15px; top: 50%; margin-top: -17.5px; }
.search .drop { position: absolute; top: 100%; left: 0; right: 0; z-index: 100; display: none; overflow: auto; width: 100%; max-height: 220px; border: 1px solid #000; border-top: 0; background-color: rgba(0,0,0,0.5); box-shadow: 0 5px 15px rgba(0,0,0,0.3); padding: 10px 0; }
.search .drop::-webkit-scrollbar{ width: 5px; }
.search .drop::-webkit-scrollbar-track { background-color: rgba(0,0,0,0.5); }
.search .drop::-webkit-scrollbar-thumb { background-color: rgba(256,256,256,0.1); }
.search .drop::-webkit-scrollbar-thumb:hover { background: rgba(256,256,256,0.3); }
.search .drop::-webkit-scrollbar-button:start:decrement,
.search .drop::-webkit-scrollbar-button:end:increment { display: none; }
.search .drop li { display: block; color: #fff; font-size: 14px; text-align: left; padding: 15px 20px; }
.search .drop li:hover { background-color: rgba(0,0,0,0.5); }



/* FORM */
.form { position: relative; display: block; }
.form::before { position: absolute; top: 0; right: 0; content: ""; display: block; width: 5px; height: 5px; border-radius: 50%; background-color: #8400ff; }
.form::after { position: absolute; top: 0; right: 10px; content: "필수입력항목"; display: block; color: #b0b0b0; font-size: 12px; }
.form dt { position: relative; display: block; float: left; width: 20%; height: 50px; line-height: 50px; color: #121212; font-size: 16px; font-weight: 700; text-align: left; margin-top: 30px; }
.form dt.sure::before { position: absolute; top: 1px; right: 5px; content: ""; display: block; width: 5px; height: 5px; border-radius: 50%; background-color: #8400ff; }
.form dd { display: inline-block; width: 80%; text-align: left; margin-top: 30px; }
.form dd .input { width: 100%; }
.form dd .select { width: 50%; }
.form dd.tel .select { width: 30%; }
.form dd.tel .input { width: 30%; margin-left: 5%; }
.form dd.tel .input input { text-align: center; }



/* AGREE */
/* .agree { display: block; border-top: 1px solid rgba(0,0,0,0.1); background-color: rgba(0,0,0,0.02); margin: 80px 0 40px 0; } */
.agree { display: block; border-top: 1px solid rgba(0,0,0,0.1); background-color: rgba(0,0,0,0.02); margin: 40px 0 40px 0; }	/* 20220321 홍민기 margin 수정*/
.agree li { display: block; border-bottom: 1px solid rgba(0,0,0,0.1); }
.agree .tit { position: relative; display: block; overflow: hidden; width: 100%; height: 100%; line-height: 50px; text-align: left; color: #121212; font-size: 14px; font-weight: 700; padding: 0 40px 0 20px; }
.agree .tit::before { position: absolute; right: 20px; top: 50%; margin-top: -7px; content: ""; display: block; overflow: hidden; width: 7px; height: 7px; border-top: 3px solid #000; border-right: 3px solid #000; transform: rotate(135deg); opacity: 0.5; }
.agree .tit.on::before { margin-top: -5px; transform: rotate(-45deg); }
.agree .con { display: none; overflow-x: hidden; overflow-y: auto; width: 100%; max-height: 350px; text-align: left; color: #303030; font-size: 14px; line-height: 24px; background-color: rgba(0,0,0,0.03); padding: 20px; }
.agree .con::-webkit-scrollbar{ width: 5px; }
.agree .con::-webkit-scrollbar-track { background-color: rgba(0,0,0,0.02); }
.agree .con::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,0.1); }
.agree .con::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.3); }
.agree .con::-webkit-scrollbar-button:start:decrement,
.agree .con::-webkit-scrollbar-button:end:increment { display: none; }


/* COUNT */
.count { display: block; color: #505050; font-size: 16px; text-align: left; padding-bottom: 20px; color: #000; font-weight: 900; }
.count b { color: #000; font-weight: 900; }
.count strong { color: #5A00FF; font-weight: 900; }


/* TABLE */
.table { table-layout: fixed; border-collapse: separate; border-top: 2px solid #000; border-bottom: 1px solid #000; }
.table th { height: 40px; color: #808080; font-size: 14px; font-weight: 700; text-align: left; background-color: #fff; padding: 0 10px; }
.table td { color: #121212; font-size: 14px; text-align: left; border-bottom: 1px solid #fff; border-top: 1px solid #eaeaea; padding: 10px; }
.table td b { font-weight: 900; }
.table td .btTxt { width: 100%; height: 40px; line-height: 40px; color: #8400ff; font-size: 14px; text-shadow: none; padding: 0; border-color: #8400ff; background-color: #fff; }
.table td .btTxt.ok { color: #fff; border-color: #b0b0b0; background-color: #b0b0b0; box-shadow: none; }
.table td.noData { color: #b0b0b0; text-align: center; background: url("../img/bg_nodata.png") no-repeat center 30px; background-size: 50px; padding: 100px 0 30px 0; }




/* CALENDER */
.calendar { position: fixed; top: 50%; left: 50%; margin: -200px 0 0 -180px; z-index: 900; display: block; overflow: hidden; width: 360px; height: 420px; border-radius: 3px; background-color: #fff; padding: 20px; animation: calendar ease-out 0.3s forwards; }
@keyframes calendar { from { transform: scale(1.2,1.2); } to { transform: scale(1,1); } }
.calendar .month { position: relative; display: block; height: 40px; line-height: 42px; color: #505050; font-size: 14px; font-weight: 700; text-align: center; padding: 0 50px; margin-bottom: 10px; }
.calendar .month .btPrev { position: absolute; left: 0; top: 50%; margin-top: -20px; }
.calendar .month .btNext { position: absolute; right: 0; top: 50%; margin-top: -20px; }

.calendar .day { display: block; overflow: hidden; width: 40px; height: 40px; line-height: 42px; color: #505050; font-size: 14px; font-weight: 700; text-align: center; border-radius: 50%; align-self: center; margin: auto; }
.calendar .day:hover { background-color: #f5f5f5; cursor: default; }
.calendar .day.on { color: #fff !important; background-color: #8400ff; }

.calendar ul { display: block; overflow: hidden; width: 100%; font-size: 0; }
.calendar li { display: flex; float: left; width: calc(100% / 7); height: calc(100% / 5); color: #b0b0b0; font-size: 12px; font-weight: 700; text-align: center; }
.calendar li:nth-of-type(7n) { color: #0000ff; }
.calendar li:nth-of-type(7n) .day { color: #0000ff; }
.calendar li:nth-of-type(7n + 1) { color: #ff0000; }
.calendar li:nth-of-type(7n + 1) .day { color: #ff0000; }
.calendar li.today .day { text-decoration: underline; }
.calendar li.off .day { opacity: 0.3; }
.calendar li.off .day:hover { background: none; }

.calendar ul.week { height: 30px; }
.calendar ul.week li { display: inline-block; line-height: 30px; }

.calendar .btns { position: absolute; left: 0; right: 0; bottom: 0; text-align: left; padding: 20px; padding-top: 0; }
.calendar .btns .btToday { display: inline-block; width: 60px; height: 40px; line-height: 40px; color: #808080; font-size: 12px; text-align: center; border: 1px solid #dfdfdf; border-radius: 3px; }
.calendar .btns .btTxt { float: right; height: 40px; line-height: 40px; font-size: 12px; box-shadow: none; }






/************************************** SCREEN **************************************/

section { position: fixed; top: 0; bottom: 0; left: 0; z-index: 100; display: flex; overflow: hidden; width: 100%; height: 100%; text-align: center; background: rgba(0,0,0,0.3) url("../img/bg_dot.png"); }
section .content { display: inline-block; font-size: 0; text-align: center; align-self: center; margin: auto; }

/* MAIN */
section.main .btID { position: absolute; top: -100px; left: 20px; transition: all 0.3s; }/*20201204*/
section.main .btReset { position: absolute; top: -100px; right: 20px; transition: all 0.3s; }
section.main .btMenu { display: none; }
section.main .select { display: block; width: 360px; height: 60px; border-top: 5px solid #CA1421; margin-top: 50px; }
section.main .select label { line-height: 60px; color: #fff; font-size: 20px; border: 0; background: none; }
section.main .select label::before { margin-top: -6px; border-top: 2px solid #fff; border-right: 2px solid #fff; opacity: 1; }
section.main .select ~ .select { border-top: 1px solid #000; border-bottom: 5px solid #CA1421; margin-top: 0; }
section.main .select ~ .btFind { width: 80px; height: 65px; border-radius: 10%; background-color: red; box-shadow: 0 5px 10px rgba(0,0,0,0.5); margin-top: 50px; }
section.main .select ~ .btFind i::before { border-color: #fff; }
section.main .select ~ .btFind i::after { background-color: #fff; }

section.main .btTxt { display: inline-block; margin-top: 30px;}


section.main .hello { display: none; overflow: hidden; width: calc(100% - 20px); height: 170px; line-height: 150%; color: #fff; font-size: 16px; margin: 50px 10px; }
section.main .hello strong { display: block; overflow: hidden; width: 100%; height: 70px; line-height: 60px; color: #fff; font-size: 30px; font-weight: 700; border-top: 5px solid #fff; border-bottom: 5px solid #fff; margin-bottom: 30px; animation: name 0.3s forwards; }
@keyframes name { from { padding-top: 60px; } to { padding: 0; } }

section.main.on .btID  { top: 20px; }/*20201204*/
section.main.on .btReset { top: 20px; }
section.main.on .btMenu { display: inline-block; }
section.main.on .search { display: none; }
section.main.on .select { display: none; }
section.main.on .select ~ .btTxt { display: none; }
section.main.on .hello { display: block; }

/* PAPER */
section.paper { flex-direction: column; background-color: #fff; z-index: 200; transition: all 0.3s ease; }
section.paper .title { flex: none; display: table; overflow: hidden; width: 100%; height: 300px; text-align: left; }
section.paper .title .wrap { display: table-cell; width: 100%; height: 100%; text-align: left; vertical-align: bottom; padding: 50px; }
section.paper .title p { display: block; overflow: visible; color: #fff; font-size: 18px; font-weight: 500; line-height: 140%; text-shadow: 0 0 5px rgba(0,0,0,1); padding-top: 20px; }
section.paper .btClose { position: absolute; top: 10px; right: 10px; }
section.paper .content { flex: auto; position: relative; display: block; overflow: auto; align-self: stretch; margin: 0; padding: 50px; }
section.paper .content::-webkit-scrollbar { display: none; }
section.paper .btns { flex: none; display: flex; overflow: hidden; width: 100%; padding: 50px; padding-top: 0; }
section.paper .btns .btTxt { flex: 1; }


/* PAPER : NEW */
section.paper.new { right: 100%; left: auto; }
section.paper.new .title { background: url("../img/bg_new_241120.jpg") no-repeat center 50%; background-size: 100%; }
section.paper.new .title .wrap { background-color: rgba(0,0,0,0.3); }
section.paper.new .btns .btTxt { background-color: #154C93; }
section.paper.new.on { right: 0; }


/* PAPER : RESERV */
section.paper.reserv { left: 100%; }
section.paper.reserv .title { background: url("../img/bg_new_241120.jpg") no-repeat center 50%; background-size: 100%; }
section.paper.reserv .title .wrap { background-color: rgba(0,0,0,0.3); }
section.paper.reserv .btns .btTxt { background-color: #865AAD; }
section.paper.reserv.on { left: 0; }


/* POPUP */
article.popup { position: fixed; top: 0; bottom: 0; left: 0; z-index: 500; display: table; overflow: hidden; width: 100%; height: 100%; text-align: center; background-color: rgba(0,0,0,0.6); padding: 50px; }
article.popup .btClose { position: absolute; top: 10px; right: 10px; }
article.popup .btTxt { height: 50px; line-height: 50px; font-size: 20px; }
article.popup .wrap { display: table-cell; width: 100%; height: 100%; text-align: center; vertical-align: middle; padding: 50px; }
article.popup .pop { position: relative; display: inline-block; text-align: center; padding: 40px; animation: pop 0.3s forwards; }
@keyframes pop { from { margin-top: 100px; } to { margin-top: 0; } }
article.popup .pop p { color: #fff; font-size: 16px; line-height: 150%; padding: 20px; }

article.popup .pop.box { text-align: left; background-color: #fff; }
article.popup .pop.box .btClose { opacity: 0.5; }
article.popup .pop.box .btClose i::before,
article.popup .pop.box .btClose i::after { background-color: #000; }
article.popup .pop.box p { color: #505050; }

article.popup .pop.box .form { padding-bottom: 30px; }
article.popup .pop.box .form::before,
article.popup .pop.box .form::after { display: none; }
article.popup .pop.box .form dt { float: none; width: 100%; height: auto; line-height: 100%; }
article.popup .pop.box .form dt:first-of-type { margin: 0; }
article.popup .pop.box .form dd { display: block; width: 100%; margin-top: 10px; }


/************************************** RSS 추가 **************************************/
.btTxt.m { height: 40px; line-height: 40px; color: #fff; background-color: #d40823; }
.agree table th{ border:1px solid #909090;border-bottom:none;padding:5px 0px; font-size:13px;color:#909090;}
.agree table th:nth-child(2){border-left:none;border-right:none;}
.agree table td{border:1px solid #909090;padding:5px;padding-left: 10px; font-size:13px;color:#909090;}
.agree table td:nth-child(1){border-right:none;}
.agree table td:nth-child(2){border:1px solid #909090;}
.agree table td:nth-child(3){border-left:none;}
.agree table td:nth-child(3) span.lead{font-size:12pt;color: #000; font-weight: 900; }

/* POPUP */
div.popup { position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: table; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); z-index: 900; }
div.popup .wrap { position: relative; display: table-cell; width: 100%; height: 100%; text-align: center; vertical-align: middle; padding: 10px; }
div.popup .btClose { position: absolute; top: 50px; right: 50px; }

div.popup .popBox { position: relative; display: inline-block; overflow: hidden; text-align: center; border-radius: 3px; background-color: #fff; padding: 20px; padding-top: 10px; box-shadow: 0 0 10px rgba(0,0,0,0.1); margin: auto; animation: popupBox 0.3s ease forwards; }
@keyframes popupBox { from { margin-top: 100px; opacity: 0; } to { margin-top: 0; opacity: 1; } }
div.popup .popBox .btClose { position: absolute; top: 10px; right: 10px; }
div.popup .popBox .btClose i:before,
div.popup .popBox .btClose i:after { background-color: #000; }
div.popup .popBox h6 { display: block; color: #505050; font-size: 20px; font-weight: 700; line-height: 24px; text-align: left; padding: 10px 50px 10px 0; }
div.popup .popBox h6 + p { padding-top: 0; }
div.popup .popBox p { display: block; color: #707070; font-size: 14px; line-height: 16px; text-align: left; padding: 10px 0; }
div.popup .popBox .input { display: block; width: 100%; border-color: #eaeaea; margin: 0; margin-bottom: 10px; }
div.popup .popBox .input input[type="password"] { width: 100%; }

div.popup .popBox .tap { height: 40px; }
div.popup .popBox .tap li i { height: 40px; line-height: 40px; font-size: 13px; border-bottom: 1px solid #505050; padding: 0 20px; }
div.popup .popBox .tap li.on i { color: #000; border: 1px solid #505050; border-bottom: 0; }

div.popup .popBox .scroll { display: block; overflow-x: hidden; overflow-y: scroll; height: 200px; }

div.popup .popBox .btns { clear: both; width: 100%; height: 40px;}
div.popup .popBox .btTxt { display: inline-block; overflow: hidden; height: 40px; color: #fff; font: 700 14px/40px 'Nanum Square'; text-shadow: 0 0 3px rgba(0,0,0,0.5); text-align: center; border-radius: 3px; background-color: #CA1421; padding: 0 15px; vertical-align: middle; }
div.popup .popBox .btns .btTxt:first-child { background-color: #b0b0b0; }


/* COLOR */
.loading .bgr { background-color: #808080 !important; } 
.loading .bgr.hsR { background-color: #d2081e !important; }
.loading .bgr.hsB { background-color: #004f98 !important; }
.loading .bgr.hsY { background-color: #f9b000 !important; }
.loading .bgr.g { background-color: #319559 !important; }
.loading .bgr.b { background-color: #0094d2 !important; }

.popup.loading { z-index: 9999; }
.popup.loading .spinner { display: inline-block; height: 40px; text-align: center; font-size: 0; }
.popup.loading .spinner > div { background-color: #fff; height: 100%; width: 5px; display: inline-block; margin: 0 2px;  -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; animation: sk-stretchdelay 1.2s infinite ease-in-out; }
.popup.loading .spinner .rect1 { -webkit-animation-delay: -1.2s; animation-delay: -1.2s; }
.popup.loading .spinner .rect2 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }
.popup.loading .spinner .rect3 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; }
.popup.loading .spinner .rect4 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }
.popup.loading .spinner .rect5 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }
.popup.loading .spinner .rect6 { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; }
.popup.loading .spinner .rect7 { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; }
.popup.loading .spinner .rect8 { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; }
.popup.loading .spinner .rect9 { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; }

@-webkit-keyframes sk-stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4); transform: scaleY(0.4); }  
  20% { -webkit-transform: scaleY(1.0); transform: scaleY(1.0); }
}
@keyframes sk-stretchdelay {
	0%, 40%, 100% {
		-webkit-transform: scaleY(0.4);
		transform: scaleY(0.4);
	} 20% {
		-webkit-transform: scaleY(1.0);
		transform: scaleY(1.0);
	}
}


/* KIOSK 방문경로 버튼 - 20220316 홍민기 추가*/
.btVisitPath { display: inline-block; overflow: hidden; height: 50px; color: #fff; font-size: 20px; font-weight: 700; text-align: center; text-shadow: 0 0 5px rgba(0,0,0,0.5); border-radius: 3px; background-color: #7fbaca; padding: 0 20px; box-shadow: 0 5px 5px rgba(0,0,0,0.3); float: left; margin-right: 10px; margin-bottom: 10px;}
.btVisitPath:active { box-shadow: none; }

.check.visit {display: inline-block; margin-right:20px; width:200px;}
.check.visit label { position: relative; display: block; overflow: hidden; height: 50px; line-height: 50px; color: #121212; font-size: 14px; font-weight: 700; text-align: left; padding-left: 40px; }
#rsrvtVisitPath {height: 180px;}