@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');

html, body { width:100%; height:100%; }
* { margin:0; padding:0; box-sizing:border-box; }
ul,ol,li { list-style:none; }
a, a:hover { text-decoration:none; color:inherit; }
body { font-family:"Noto Sans KR", sans-serif; font-weight:400; font-size:16px; }
table { table-layout:fixed; }

.nanum-pen-regular { font-family:"Nanum Pen Script", "Noto Sans KR"; font-weight:400; font-style:normal; }

.none { display:none !important; }
.scroll_area { height:100%; overflow-x:hidden; overflow-y:auto; }

.contents { position:relative; z-index:1; }

.site_wrap { position:relative; width:1280px; margin:0 auto; padding:40px 0; }

/* LEFT RIGHT 50P */
.flex2_img1_wrap { display:flex; align-items:center; width:100%; margin-bottom:20px; }
.flex2_img1_wrap .img_wrap { flex:1; }
.flex2_img1_wrap .img_wrap img { width:100%; }
.flex2_img1_wrap .txt_wrap { flex:1; width:100%; height:100%; padding-left:20px; line-height:42px; }
.flex2_img1_wrap .txt_wrap .room_info_flex:not(:first-child) { margin-top:16px; } 
.flex2_img1_wrap .img_slider_wrap { width:100%; margin-bottom:80px; }
.flex2_img1_wrap .img_slider_wrap .img_slider { width:100%; height:80px; }

/* POPUP */
.popup {
	position:fixed; padding:14px; width:380px; height:auto; background:#fff; border:1px solid #eee; border-radius:16px;
	box-shadow:10px 10px 5px 1px #00000088; -webkit-box-shadow:10px 10px 5px 1px #00000088; -moz-box-shadow:10px 10px 5px 1px #00000088;
/*
	box-shadow:0 0 5px 10px #00000088; -webkit-box-shadow:0 0 5px 10px #00000088; -moz-box-shadow:0 0 5px 10px #00000088;
*/
}
.popup .popup_content { margin-bottom:16px; width:100%; min-height:140px; font-family:"Nanum Pen Script", "Noto Sans KR"; font-size:24px; line-height:2; }
.popup .popup_btns { display:flex; width:100%; }
.popup .popup_btns .left_area { padding-right:4px; flex-grow:1; text-align:center; }
.popup .popup_btns .right_area { padding-left:4px; flex-basis:40%; flex-shrink:0; text-align:center; }
.popup .popup_btns .btn { padding:8px 0; width:100%; height:100%; background:#222; color:#fff; border-radius:16px; cursor:pointer; }

/* TOP LOGO */
.top_logo { position:fixed; top:8px; left:8px; opacity:0.8; z-index:10; }
.top_logo img { width:120px; }

/* Hamburgar MENU */
.h_menu { position:fixed; display:inline-block; top:20px; right:20px; width:40px; height:30px; cursor:pointer; z-index:12; }
.h_menu span {
	position:absolute; left:0; display:block; width:100%; height:6px; background:#fff; border:1px solid #000; border-radius:4px; opacity:1;
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-o-transform:rotate(0deg);
	transform:rotate(0deg);
	-webkit-transition:all .25s cubic-bezier(0.22, 0.61, 0.36, 1);
	-moz-transition:all .25s cubic-bezier(0.22, 0.61, 0.36, 1);
	-o-transition:all .25s cubic-bezier(0.22, 0.61, 0.36, 1);
	transition:all .25s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.h_menu span:nth-child(1) { top:0; }
.h_menu span:nth-child(2) { top:12px; }
.h_menu span:nth-child(3) { top:24px; }
.h_menu.open span:nth-child(1) { top:12px; -webkit-transform:rotate(135deg); -moz-transform:rotate(135deg); -o-transform:rotate(135deg); transform:rotate(135deg); }
.h_menu.open span:nth-child(2) { left:-60px; opacity:0; }
.h_menu.open span:nth-child(3) { top:12px; -webkit-transform:rotate(-135deg); -moz-transform:rotate(-135deg); -o-transform:rotate(-135deg); transform:rotate(-135deg); }
.h_menu_overlay {
	position:fixed; left:100%; top:0; width:100%; height:100%; text-align:center; z-index:11; overflow:hidden;
	-webkit-transition:left 0.5s ease; -moz-transition:left 0.5s ease; -o-transition:left 0.5s ease; transition:left 0.5s ease;
}
.h_menu_overlay.open { left:0; }

/* LEFT MENU */
.l_menu { position:absolute; top:0; right:0; padding-top:12px; width:300px; height:100%; background:linear-gradient(to bottom, #000, #444); color:#fff; }
.l_menu li { position:relative; display:block; padding:12px; width:100%; font-size:16px; line-height:20px; text-align:left; }
.l_menu > li { opacity:0; -moz-transform:translateY(-40px); -webkit-transform:translateY(-40px); transform:translateY(-40px); -webkit-transition:all 0.4s ease; -moz-transition:all 0.4s ease; transition:all 0.4s ease; }
.l_menu li a,
.l_menu li label { display:block; width:100%; color:#fff; -o-transition:all .3s linear; -webkit-transition:all .3s linear; -moz-transition:all .3s linear; transition:all .3s linear; cursor:pointer; }
.l_menu li label:after { content:"▼"; float:right; padding-right:20px; }
.l_menu li:hover > a,
.l_menu li:hover > label { color:#888; font-weight:900; }
.l_menu ul, 
.l_menu ul li ul { display:none; padding-top:12px; }
.l_menu li ul li:last-child { padding-bottom:0; }
.l_menu input[type='checkbox'].none:checked + ul { display: block; }
.open .l_menu > li { -moz-transform:translateY(0); -webkit-transform:translateY(0); transform:translateY(0); opacity:1; }
.open .l_menu > li:nth-child(1) { -webkit-transition-delay:500ms; transition-delay:500ms; }
.open .l_menu > li:nth-child(2) { -webkit-transition-delay:600ms; transition-delay:600ms; }
.open .l_menu > li:nth-child(3) { -webkit-transition-delay:700ms; transition-delay:700ms; }
.open .l_menu > li:nth-child(4) { -webkit-transition-delay:800ms; transition-delay:800ms; }
.open .l_menu > li:nth-child(5) { -webkit-transition-delay:900ms; transition-delay:900ms; }
.open .l_menu > li:nth-child(6) { -webkit-transition-delay:1000ms; transition-delay:1000ms; }
.open .l_menu > li:nth-child(7) { -webkit-transition-delay:1100ms; transition-delay:1100ms; }

/* MAIN IMAGE */
.main_img { position:relative; width:100%; height:100%; overflow:hidden; }
.main_img.main { background:url('../images/main_top.jpg') no-repeat center; background-attachment:fixed; background-size:cover; }
.main_img.about { background:url('../images/main_top.jpg') no-repeat center; background-attachment:fixed; background-size:cover; }
.main_img.room { background:url('../images/main_top.jpg') no-repeat center; background-attachment:fixed; background-size:cover; }

.main_img .main_txt { position:absolute; top:0; left:0; display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.main_img .main_txt .txt { font-size:80px; font-weight:900; color:#fff6a9; text-shadow:0 0 5px #ffa500, 0 0 15px #ffa500, 0 0 20px #ffa500, 0 0 40px #ffa500, 0 0 60px #ff0000, 0 0 10px #ff8d00, 0 0 98px #ff0000; animation:blink 12s infinite; -webkit-animation:blink 12s infinite; }

/* PAGE TITLE */
.page_title { font-size:36px; margin-bottom:40px; font-weight:900; }

/* ROOM INFO */
.room_info_wrap { display:flex; width:100%; margin-bottom:80px; }
.room_info_wrap .room_info_box { flex:1; position:relative; width:100%; padding:20px; cursor:pointer; }
.room_info_wrap .room_info_box .room_img { width:100%; border-radius:80px; overflow:hidden; }
.room_info_wrap .room_info_box .room_img img { width:100%; transition:all .5s linear; display:block; }
.room_info_wrap .room_info_box .room_info { padding:40px; padding-bottom:0; }
.room_info_wrap .room_info_box .room_title { margin-bottom:40px; font-size:28px; font-weight:900; transition:all .5s linear; }
.room_info_wrap .room_info_box .room_desc { transition:all .5s linear; }
.room_info_wrap .room_info_box .room_desc > div { font-size:20px; margin:8px 0; }
.room_info_wrap .room_info_box .room_info_hover { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; transition:all .5s linear; }
.room_info_wrap .room_info_box .room_info_hover .room_btn_detail { display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.room_info_wrap .room_info_box .room_info_hover .room_btn_detail .btn_detail {
	position:relative; padding:4px 8px; font-size:24px; color:#000; border:4px solid;
	box-shadow: 1px 1px 0px 0px, 2px 2px 0px 0px, 3px 3px 0px 0px, 4px 4px 0px 0px, 5px 5px 0px 0px;
}
.room_info_wrap .room_info_box:hover { background:#000000ee; color:#fff; }
.room_info_wrap .room_info_box:hover .room_info_hover { opacity:1; }
.room_info_wrap .room_info_box:hover .room_title { color:#fff; opacity:0.5; }
.room_info_wrap .room_info_box:hover .room_img img { opacity:0.5; scale:1.2; }
.room_info_wrap .room_info_box:hover .room_desc { color:#fff; opacity:0.5; }

/* ABOUT */

/* ROOM */
.room_info_flex { display:flex; width:100%; }
.room_info_flex > div:nth-child(1) { width:120px; font-weight:700; }
.room_info_flex > div:nth-child(2) { width:calc(100% - 120px); }

.img_slider img { width:128px; }
.img_slider > div { cursor:pointer; }
.img_preview_wrap { display:none; position:fixed; top:0; left:0; width:100%; height:100vh; background:#000000dd; z-index:10000; }
.img_preview_wrap .preview_wrap { margin:80px; width:calc(100% - 160px); height:calc(100% - 160px); }
.img_preview_wrap .preview_slider { position:relative; width:100%; height:100%; }
.img_preview_wrap .preview_slider .preview_img { width:calc(100vw - 160px); height:calc(100vh - 160px); }
.img_preview_wrap .preview_slider .preview_img img { width:100%; height:100%; object-fit:cover; }
.img_preview_wrap .preview_close { position:absolute; top:0; right:0; padding:10px; font-size:20px; color:#fff; cursor:pointer; z-index:1; }

/* RESERVATION */
.rsv_calendar { display:flex; margin:0 auto; width:100%; color:#2d2e2f; box-shadow:0px 15px 25px rgba(0, 0, 0, 0.1); border-radius:1em; }
.rsv_calendar .calendar_nav a { color:#2d2e2f; text-decoration:none; }
/*
.rsv_calendar .calendar_nav a:hover { color:#ee3c48; }
*/
.rsv_calendar h1 { margin:16px 0; font-size:2rem; font-weight:600; }
.rsv_calendar h2 { margin:16px 0; font-size:2rem; font-weight:300; }
.rsv_calendar h2 strong { font-weight:600; }
.rsv_calendar .subheading { letter-spacing:2px; margin-top:10px; font-size:1rem; font-weight:400; color:#ee3c48; }
.rsv_calendar .clr_highlight { color:#ee3c48; }
.rsv_calendar .calendar_notice {  }

.rsv_calendar section.calendar_left { flex:25%; background-color:#f9f9f9; box-shadow:1px 0px 0px #ececec; border-top-left-radius:1em; border-bottom-left-radius:1em; }
.rsv_calendar section.calendar_left .sidebar { padding:20px 30px; }
.rsv_calendar section.calendar_left .sidebar ul.calendar_events { list-style:none; padding:0; margin-bottom:30px; }
.rsv_calendar section.calendar_left .sidebar ul.calendar_events li { margin-left:0; margin-top:20px; }

.rsv_calendar section.calendar_right { flex:75%; }
.rsv_calendar section.calendar_right .calendar { padding:20px 30px; position:relative; }
.rsv_calendar section.calendar_right .calendar .calendar_nav { text-align:right; position:absolute; top:52px; right:30px; font-weight:500; }
.rsv_calendar section.calendar_right .calendar .calendar_nav a { border:1px solid #ececec; padding:.5rem .75rem; margin-left:-1px; }
.rsv_calendar section.calendar_right .calendar .calendar_row { display:flex; flex:1 1 0; }
.rsv_calendar section.calendar_right .calendar .calendar_day { width:100%; padding:.5rem .5rem; min-height:8em; border:1px solid #ececec; margin:-1px 0 0 -1px; }
.rsv_calendar section.calendar_right .calendar .calendar_day.day_name { min-height:0; border:none; }
.rsv_calendar section.calendar_right .calendar .calendar_day.sat { color:blue; }
.rsv_calendar section.calendar_right .calendar .calendar_day.sun { color:red; }
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_date { color:#000; text-align:right; font-size:1.25rem; font-weight:600; }
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event { margin-top:16px; font-size:14px; font-weight:400; }
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event a:hover { font-weight:bold; }
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event:first-child { margin-top:0; }
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event .badge { padding:2px 4px; border-radius:4px; }
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event.available .badge { background:lightgreen; cursor:pointer; }
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event.reservate .badge { background:skyblue; }
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event.complete .badge { background:lightsalmon; }
/*
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event.reservate .price,
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event.complete .price { text-decoration:line-through; }
*/
.rsv_calendar section.calendar_right .calendar .calendar_day .calendar_event.m_price { text-align:right; }
/*
.rsv_calendar section.calendar_right .calendar .calendar_day:hover .calendar_date { color:#ee3c48; cursor:pointer; }
*/
.rsv_calendar section.calendar_right .calendar .calendar_day.inactive .calendar_date { color:#999; font-weight:300; }
.rsv_calendar section.calendar_right .calendar .calendar_day.active .calendar_date { color:#ee3c48; }
.rsv_calendar section.calendar_right .calendar .calendar_day.weekend { background:#f9f9f9; }
.rsv_calendar .clear { clear:both; }

.rsv_accordion { position:relative; margin:50px 0; padding:32px; min-height:0; }
.rsv_accordion .ac_title { display:block; font-size:26px; font-weight:900; line-height:34px; background:#fefffa; cursor:pointer; }
.rsv_accordion .ac_div { position:relative; margin-top:14px; font-size:18px; line-height:30px; overflow:hidden; transform:translate(0, 0); transition:all 500ms ease; z-index:2; }
.rsv_accordion .ac_highlight { color:red; font-weight:bold; }
.rsv_accordion .ac_div,
.rsv_accordion ul li i:before,
.rsv_accordion ul li i:after { transition:all 0.25s ease-in-out; }
.rsv_accordion ul li { position:relative; padding:16px 0; border-top:1px dotted #dce7eb; }
.rsv_accordion ul li i { position:absolute; margin-top:9px; right:0; transform:translate(-6px, 0); }
.rsv_accordion ul li i:before{ content:""; position:absolute; background-color:#000; width:3px; height:16px; transform:translate(2px, 0) rotate(45deg); }
.rsv_accordion ul li i:after { content:""; position:absolute; background-color:#000; width:3px; height:16px; transform:translate(2px, 0) rotate(-45deg); }
.rsv_accordion ul li input[type=checkbox] { position:absolute; width:100%; height:100%; opacity:0; z-index:1; cursor:pointer; }
.rsv_accordion ul li input[type=checkbox]:checked ~ .ac_div { margin-top:0; max-height:0; opacity:0; transform:translate(0, 50%); }
.rsv_accordion ul li input[type=checkbox]:checked ~ i:before{ margin-top:9px; height:9px; transform:translate(2px, 0) rotate(45deg); }
.rsv_accordion ul li input[type=checkbox]:checked ~ i:after { margin-top:9px; height:9px; transform:translate(-2px, 0) rotate(-45deg);}
.rsv_accordion ul li:nth-of-type(1) { border-top:none; animation-delay:0.5s; }
.rsv_accordion ul li:nth-of-type(2) { animation-delay:0.75s; }
.rsv_accordion ul li:nth-of-type(3) { animation-delay:1s; }
.rsv_accordion ul li:last-of-type { padding-bottom:0; }
.rsv_accordion li { animation:bounce_in_up 1s ease both; }
.rsv_accordion .ac_table,
.rsv_accordion .ac_table_m { margin-top:20px; width:100%; border:0; border-collapse:collapse; }
.rsv_accordion .ac_table_m { display:none; }
.rsv_accordion .ac_table th,
.rsv_accordion .ac_table_m th,
.rsv_accordion .ac_table td,
.rsv_accordion .ac_table_m td { margin:0; padding:0.6rem; text-align:center; border:1px solid #aaa; background-clip:padding-box; scroll-snap-align:start; }
.rsv_accordion .ac_table th,
.rsv_accordion .ac_table_m th { background:#f8f8f8; }

.rsv_pop { visibility:hidden; opacity:0; position:absolute; padding:40px 20px 20px 20px; top:100px; right:20px; width:800px; background-color:#fff; -webkit-box-shadow:0px 5px 20px -5px rgba(0, 0, 0, 0.3); box-shadow:0px 5px 20px -5px rgba(0, 0, 0, 0.3); border-radius:4px; transition:all .4s ease; z-index:1000; }
.rsv_pop.on { visibility:visible; opacity:1; top:140px; }
.rsv_form { display:flex; width:100%; }
.rsv_form .form-chk-list > div { margin-bottom:12px; }
.rsv_form .form-chk-list > div:last-child { margin-bottom:0; }
.rsv_form .form-box { flex-basis:0; flex-grow:1; padding:8px; }
.rsv_form .form-box .form-chk-list { margin-top:20px; }
.rsv_form .form-close { position:absolute; top:4px; right:16px; font-size:28px; cursor:pointer; }
.rsv_form .form-group { position:relative; margin-bottom:18px; }
.rsv_form .form-group > div { position:relative; }
.rsv_form .form-control { display:block; padding:8px; width:100%; height:40px; background-color:#ebecee; border-radius:4px; border:none; -webkit-box-shadow:none; box-shadow:none; color:#3e485c; font-size:14px; }
.rsv_form .form-control::-webkit-input-placeholder { color:rgba(62, 72, 92, 0.3); }
.rsv_form .form-control:-ms-input-placeholder {color:rgba(62, 72, 92, 0.3); }
.rsv_form .form-control::placeholder { color:rgba(62, 72, 92, 0.3); }
.rsv_form input[type="date"].form-control:invalid { color:rgba(62, 72, 92, 0.3); }
.rsv_form select.form-control { padding:8px; -webkit-appearance:none; -moz-appearance:none; appearance:none; }
.rsv_form select.form-control+.select-arrow { position:absolute; right:0px; bottom:4px; width:32px; line-height:32px; height:32px; text-align:center; pointer-events:none; color:rgba(62, 72, 92, 0.3); font-size:14px; }
.rsv_form select.form-control+.select-arrow:after { content:'\279C'; display:block; -webkit-transform:rotate(90deg); transform:rotate(90deg); }
.rsv_form .form-label { display:inline-block; color:#3e485c; font-weight:700; margin-bottom:6px; margin-left:7px; }
.rsv_form .form-group.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10%; margin-bottom:0; }
.rsv_form .form-group.grid3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:7%; margin-bottom:0; }
.rsv_pop .form-btm { display:flex; align-items:center; margin-top:20px; width: 100%; }
.rsv_pop .form-btm > div { flex:1; text-align:left; }
.rsv_pop .form-btm > div:last-child { text-align:right; }
.rsv_pop .submit-btn { display:inline-block; color:#fff; background-color:#1e62d8; font-weight:700; padding:14px 30px; border-radius:4px; border:none; -webkit-transition:0.2s all; transition:0.2s all; cursor:pointer; }
.rsv_pop .submit-btn:hover,
.rsv_pop .submit-btn:focus { opacity:0.9; }
.rsv_pop .submit-btn:disabled { background-color:gray; }

/* RESERVATION CONFIRMATION */
.reserv_table { width:100%; background:#fff; -webkit-box-shadow:0px 5px 12px -12px rgba(0, 0, 0, 0.29); -moz-box-shadow:0px 5px 12px -12px rgba(0, 0, 0, 0.29); box-shadow:0px 5px 12px -12px rgba(0, 0, 0, 0.29); text-align:center; border-collapse:collapse; }
.reserv_table tbody th,
.reserv_table tbody td { padding:20px; font-size:14px; background:#fff; vertical-align:middle; border:2px solid #f8f9fd; }
.reserv_table tbody th.scope { background:#e8ebf8; }
.reserv_table .price_info { margin-bottom:6px; }
.required_txt { padding:8px 0; margin-bottom:20px; background:#efefef; font-size:22px; color:#ff2222; text-align:center; }
.total_reservation_info { margin:40px 0; width:100%; text-align:right; }
.total_reservation_info .price_info { font-size:24px; font-weight:bold; }
.paragraph { padding:20px; margin-bottom:20px; background:#efefef; border-radius:32px; line-height:2; }
.paragraph:last-child { margin-bottom:0; }
.paragraph .title { font-size:18px; font-weight:bold; }
.paragraph .ac_table,
.paragraph .ac_table_m { margin-top:20px; width:100%; border:0; border-collapse:collapse; }
.paragraph .ac_table_m { display:none; }
.paragraph .ac_table th,
.paragraph .ac_table_m th,
.paragraph .ac_table td,
.paragraph .ac_table_m td { margin:0; padding:0.6rem; text-align:center; border:1px solid #aaa; }

/* TRAVEL */
.trv_wrap { width:100%; }
.trv_flex { display:flex; width:100%; }
.trv_flex > div { flex:1; }
.trv_wrap .trv_img { width:100%; aspect-ratio:2/1; overflow:hidden; border-radius:16px; }
.trv_wrap .trv_img img { width:100%; height:100%; object-fit:cover; }
.trv_wrap .trv_desc { padding-left:16px; line-height:32px; }
.trv_wrap .trv_desc .trv_title { font-size:32px; font-weight:900; padding-bottom:20px; }
.trv_grid { margin-top:80px; display:grid; grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr; gap:20px; width:100%; }

/* FOOTER */
.footer { position:relative; padding:40px; background:linear-gradient(to right, #1a1c20, #2c3e50); color:#fff; }
.footer .site_wrap { padding:0; }
.footer .footer_wrap { display:flex; width:100%; }
.footer .footer_wrap .logo_area { width:120px; height:100%; }
.footer .footer_wrap .logo_area img { display:flex; align-items:center; justify-content:center; width:100px; filter:grayscale(1); }
.footer .footer_wrap .txt_area { }
.footer .footer_wrap .txt_area .txt { font-size:14px; line-height:26px; }

@-webkit-keyframes blink {
	20%,
	24%,
	55% { color:#111; text-shadow:none; }
	0%,
	19%,
	21%,
	23%,
	25%,
	54%,
	56%,
	100% { color:#fff6a9; text-shadow:0 0 5px #ffa500, 0 0 15px #ffa500, 0 0 20px #ffa500, 0 0 40px #ffa500, 0 0 60px #ff0000, 0 0 10px #ff8d00, 0 0 98px #ff0000; }
}
@keyframes blink {
	20%,
	24%,
	55% { color:#111; text-shadow:none; }
	0%,
	19%,
	21%,
	23%,
	25%,
	54%,
	56%,
	100% { color:#fff6a9; text-shadow:0 0 5px #ffa500, 0 0 15px #ffa500, 0 0 20px #ffa500, 0 0 40px #ffa500, 0 0 60px #ff0000, 0 0 10px #ff8d00, 0 0 98px #ff0000; }
}
@keyframes bounce_in_up {
	0%	{ transform:translateY(2000px); opacity:0; }
	60%	{ transform:translateY(0px); opacity:1; }
	80%	{ transform:translateY(10px); }
	100%{ transform:translateY(0); }
}
@-webkit-keyframes bounce_in_up {
	0%	{ -webkit-transform:translateY(2000px); opacity:0; }
	60%	{ -webkit-transform:translateY(0px); opacity:1; }
	80%	{ -webkit-transform:translateY(10px); }
	100%{ -webkit-transform:translateY(0); }
}

.scroll_area::-webkit-scrollbar { width:4px; height:4px; }
.scroll_area::-webkit-scrollbar-thumb { background:#444; border-radius:4px; }
.scroll_area::-webkit-scrollbar-track {	background:#666; }

/* CUSTOM CHECKBOX */
.chkbox_wrap input[type="checkbox"] { display:none; visibility:hidden; }
.chkbox_wrap *,
.chkbox_wrap *::before,
.chkbox_wrap *::after { box-sizing:border-box; }
.chkbox_wrap .btn_toggle { cursor:pointer; display:flex; align-items:center; transform-origin:50% 50%; transform-style:preserve-3d; transition:transform 0.14s ease; }
.chkbox_wrap .btn_toggle:active { transform:rotateX(30deg); }
.chkbox_wrap .btn_toggle input + div { position:relative; margin-right:8px; width:24px; height:24px; border:3px solid rgba(0, 0, 0, 0.2); border-radius:50%; }
.chkbox_wrap .btn_toggle input + div svg {
    position:absolute; display:block; width:24px; height:24px; left:-3px; top:-3px; right:-3px; bottom:-3px; z-index:1; transition:all 0.4s ease 0s;
	fill:none; stroke-width:3.6; stroke:#ddd; stroke-linecap:round; stroke-linejoin:round; stroke-dashoffset:124.6; stroke-dasharray:0 162.6 133 29.6;
}
.chkbox_wrap .btn_toggle input + div:before,
.chkbox_wrap .btn_toggle input + div:after { content:""; position:absolute; left:50%; top:50%; width:3px; height:16px; background:#ddd; border-radius:5px; }
.chkbox_wrap .btn_toggle input + div:before { opacity:0; transform:scale(0.3) translate(-50%, -50%) rotate(45deg); -webkit-animation:bounce_in_before_chk 0.3s linear forwards 0.3s; animation:bounce_in_before_chk 0.3s linear forwards 0.3s; }
.chkbox_wrap .btn_toggle input + div:after { opacity:0; transform:scale(0.3) translate(-50%, -50%) rotate(-45deg); -webkit-animation:bounce_in_after_chk 0.3s linear forwards 0.3s; animation:bounce_in_after_chk 0.3s linear forwards 0.3s; }
.chkbox_wrap .btn_toggle input:checked + div svg { stroke-dashoffset:162.6; stroke-dasharray:0 162.6 28 134.6; stroke:#000; transition:all 0.4s ease 0.2s; }
.chkbox_wrap .btn_toggle input:checked + div:before { opacity:0; transform:scale(0.3) translate(-50%, -50%) rotate(45deg); -webkit-animation:bounce_in_before_chk_dont 0.3s linear forwards 0s; animation:bounce_in_before_chk_dont 0.3s linear forwards 0s; }
.chkbox_wrap .btn_toggle input:checked + div:after { opacity:0; transform:scale(0.3) translate(-50%, -50%) rotate(-45deg); -webkit-animation:bounce_in_after_chk_dont 0.3s linear forwards 0s; animation:bounce_in_after_chk_dont 0.3s linear forwards 0s; }
@-webkit-keyframes bounce_in_before_chk {
	0%	{ opacity:0;	transform:scale(0.3) translate(-50%, -50%) rotate(45deg);	}
    50%	{ opacity:0.9;	transform:scale(1.1) translate(-50%, -50%) rotate(45deg);	}
    80%	{ opacity:1;	transform:scale(0.89) translate(-50%, -50%) rotate(45deg);	}
    100%{ opacity:1;	transform:scale(1) translate(-50%, -50%) rotate(45deg);		}
}
@keyframes bounce_in_before_chk {
	0%	{ opacity:0;	transform:scale(0.3) translate(-50%, -50%) rotate(45deg);	}
    50%	{ opacity:0.9;	transform:scale(1.1) translate(-50%, -50%) rotate(45deg);	}
    80%	{ opacity:1;	transform:scale(0.89) translate(-50%, -50%) rotate(45deg);	}
    100%{ opacity:1;	transform:scale(1) translate(-50%, -50%) rotate(45deg);		}
}
@-webkit-keyframes bounce_in_after_chk {
	0%	{ opacity:0;	transform:scale(0.3) translate(-50%, -50%) rotate(-45deg);	}
    50%	{ opacity:0.9;	transform:scale(1.1) translate(-50%, -50%) rotate(-45deg);	}
    80%	{ opacity:1;	transform:scale(0.89) translate(-50%, -50%) rotate(-45deg);	}
    100%{ opacity:1;	transform:scale(1) translate(-50%, -50%) rotate(-45deg);	}
}
@keyframes bounce_in_after_chk {
    0%	{ opacity:0;	transform:scale(0.3) translate(-50%, -50%) rotate(-45deg);	}
    50%	{ opacity:0.9;	transform:scale(1.1) translate(-50%, -50%) rotate(-45deg);	}
    80%	{ opacity:1;	transform:scale(0.89) translate(-50%, -50%) rotate(-45deg);	}
    100%{ opacity:1;	transform:scale(1) translate(-50%, -50%) rotate(-45deg);	}
}
@-webkit-keyframes bounce_in_before_chk_dont {
	0%	{ opacity:1;	transform:scale(1) translate(-50%, -50%) rotate(45deg);		}
    100%{ opacity:0;	transform:scale(0.3) translate(-50%, -50%) rotate(45deg);	}
}
@keyframes bounce_in_before_chk_dont {
	0%	{ opacity:1;	transform:scale(1) translate(-50%, -50%) rotate(45deg);		}
    100%{ opacity:0;	transform:scale(0.3) translate(-50%, -50%) rotate(45deg);	}
}
@-webkit-keyframes bounce_in_after_chk_dont {
	0%	{ opacity:1;	transform:scale(1) translate(-50%, -50%) rotate(-45deg);	}
    100%{ opacity:0;	transform:scale(0.3) translate(-50%, -50%) rotate(-45deg);	}
}
@keyframes bounce_in_after_chk_dont {
	0%	{ opacity:1;	transform:scale(1) translate(-50%, -50%) rotate(-45deg);	}
    100%{ opacity:0;	transform:scale(0.3) translate(-50%, -50%) rotate(-45deg);	}
}

/* Loader */
/*
.loader { position:relative; width:1em; height:1em; color:#000; font-size:48px; box-sizing:border-box; background-color:#000; border-radius:50%; transform:rotateX(-60deg) perspective(1000px); }
.loader:before,
.loader:after { content:''; position:absolute; display:block; box-sizing:border-box; top:0; left:0; width:inherit; height:inherit; border-radius:inherit; animation:flowerFlow 1s ease-out infinite; }
.loader:after { animation-delay:.4s; }
@keyframes flowerFlow {
	0% {
		opacity:1;
		transform:rotate(0deg);
		box-shadow:
			0 0 0 -.5em currentcolor,	0 0 0 -.5em currentcolor,	0 0 0 -.5em currentcolor,	0 0 0 -.5em currentcolor,
			0 0 0 -.5em currentcolor,	0 0 0 -.5em currentcolor,	0 0 0 -.5em currentcolor,	0 0 0 -.5em currentcolor;
	}
	100% {
		opacity:0;
		transform:rotate(180deg);
		box-shadow:
			-1em -1em 0 -.35em currentcolor,	0 -1.5em 0 -.35em currentcolor,		1em -1em 0 -.35em currentcolor,		-1.5em 0 0 -.35em currentcolor,
			1.5em -0 0 -.35em currentcolor,		-1em 1em 0 -.35em currentcolor,		0 1.5em 0 -.35em currentcolor,		1em 1em 0 -.35em currentcolor;
	}
}
*/
.loader_wrap { display:none; margin-right:20px; }
.loader { position:relative; width:8px; height:8px; font-size:8px; border-radius:50%; text-indent:-9999em; animation:mulShdSpin 1.1s infinite ease; transform:translateZ(0); }
@keyframes mulShdSpin {
	0%,
	100% {
		box-shadow:
			0 -13px 0 0 #000,				9px -9px 0 0 rgba(0,0,0, 0.2),	13px 0 0 0 rgba(0,0,0, 0.2),	9px 9px 0 0 rgba(0,0,0, 0.2),
			0 13px 0 0 rgba(0,0,0, 0.2),	-9px 9px 0 0 rgba(0,0,0, 0.2),	-13px 0 0 0 rgba(0,0,0, 0.5),	-9px -9px 0 0 rgba(0,0,0, 0.7);
	}
	12.5% {
		box-shadow:
			0 -13px 0 0 rgba(0,0,0, 0.7),	9px -9px 0 0 #000,				13px 0 0 0 rgba(0,0,0, 0.2),	9px 9px 0 0 rgba(0,0,0, 0.2),
			0 13px 0 0 rgba(0,0,0, 0.2),	-9px 9px 0 0 rgba(0,0,0, 0.2),	-13px 0 0 0 rgba(0,0,0, 0.2),	-9px -9px 0 0 rgba(0,0,0, 0.5);
	}
	25% {
		box-shadow:
			0 -13px 0 0 rgba(0,0,0, 0.5),	9px -9px 0 0 rgba(0,0,0, 0.7),	13px 0 0 0 #000,				9px 9px 0 0 rgba(0,0,0, 0.2),
			0 13px 0 0 rgba(0,0,0, 0.2),	-9px 9px 0 0 rgba(0,0,0, 0.2),	-13px 0 0 0 rgba(0,0,0, 0.2),	-9px -9px 0 0 rgba(0,0,0, 0.2);
	}
	37.5% {
		box-shadow:
			0 -13px 0 0 rgba(0,0,0, 0.2),	9px -9px 0 0 rgba(0,0,0, 0.5),	13px 0 0 0 rgba(0,0,0, 0.7),	9px 9px 0 0 #000,
			0 13px 0 0 rgba(0,0,0, 0.2),	-9px 9px 0 0 rgba(0,0,0, 0.2),	-13px 0 0 0 rgba(0,0,0, 0.2),	-9px -9px 0 0 rgba(0,0,0, 0.2);
	}
	50% {
		box-shadow:
			0 -13px 0 0 rgba(0,0,0, 0.2),	9px -9px 0 0 rgba(0,0,0, 0.2),	13px 0 0 0 rgba(0,0,0, 0.5),	9px 9px 0 0 rgba(0,0,0, 0.7),
			0 13px 0 0 #000,				-9px 9px 0 0 rgba(0,0,0, 0.2),	-13px 0 0 0 rgba(0,0,0, 0.2),	-9px -9px 0 0 rgba(0,0,0, 0.2);
	}
	62.5% {
		box-shadow:
			0 -13px 0 0 rgba(0,0,0, 0.2),	9px -9px 0 0 rgba(0,0,0, 0.2),	13px 0 0 0 rgba(0,0,0, 0.2),	9px 9px 0 0 rgba(0,0,0, 0.5),
			0 13px 0 0 rgba(0,0,0, 0.7),	-9px 9px 0 0 #000,				-13px 0 0 0 rgba(0,0,0, 0.2),	-9px -9px 0 0 rgba(0,0,0, 0.2);
	}
	75% {
		box-shadow:
			0 -13px 0 0 rgba(0,0,0, 0.2),	9px -9px 0 0 rgba(0,0,0, 0.2),	13px 0 0 0 rgba(0,0,0, 0.2),	9px 9px 0 0 rgba(0,0,0, 0.2),
			0 13px 0 0 rgba(0,0,0, 0.5),	-9px 9px 0 0 rgba(0,0,0, 0.7),	-13px 0 0 0 #000,				-9px -9px 0 0 rgba(0,0,0, 0.2);
	}
	87.5% {
		box-shadow:
			0 -13px 0 0 rgba(0,0,0, 0.2),	9px -9px 0 0 rgba(0,0,0, 0.2),	13px 0 0 0 rgba(0,0,0, 0.2),	9px 9px 0 0 rgba(0,0,0, 0.2),
			0 13px 0 0 rgba(0,0,0, 0.2),	-9px 9px 0 0 rgba(0,0,0, 0.5),	-13px 0 0 0 rgba(0,0,0, 0.7),	-9px -9px 0 0 #000;
	}
}
