@charset "utf-8";
@import ur("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap");

/* 초기화 */
html {overflow-y:scroll;height:100%;min-width:320px}
body {margin:0;padding:0;font-size:0.75em;background:#f5f0ea;height:100%;font-family:'Noto Sans KR','Malgun Gothic', dotum, sans-serif}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family:'Noto Sans KR','Malgun Gothic', dotum, sans-serif}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-size:1em;font-family:'Noto Sans KR','Malgun Gothic', dotum, sans-serif}
button {cursor:pointer}
input[type=text], input[type=password], input[type=submit], input[type=image], button {font-size:1em;-webkit-appearance:none}
textarea, select {font-size:1em;font-family:'Noto Sans KR','Malgun Gothic', dotum, sans-serif}
textarea {border-radius:0;-webkit-appearance:none;font-family:'Noto Sans KR','Malgun Gothic', dotum, sans-serif}
select {margin:0;background:none;font-family:'Noto Sans KR','Malgun Gothic', dotum, sans-serif}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {
color:#000;
text-decoration:none;
-webkit-tap-highlight-color: transparent;
outline:none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
ul,li,dl,dt,dd {padding:0;margin:0}
ul {list-style:none}

*,:after,:before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;width:100%;height:0}
#hd_pop h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops img {max-width:100%;height:auto}
.hd_pops_con {}
.hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right}
.hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff}

/* 상단 레이아웃 */
#hd {position:relative;background:#212020}
#hd:after {display:block;visibility:hidden;clear:both;content:""}
#hd_h1 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}

#logo {padding:10px 10px;height:60px;text-align:center}
#logo img {vertical-align:middle;margin-top:5px;max-height:100%;width:auto}
#gnb_open {position:absolute;top:10px;left:10px;padding:0 10px;height:40px;width:40px;border:0;background-size:70%;color:#fff;background:none;font-size:2em}
#gnb {display:none;background:#efefef;position:fixed;top:0;left:0;z-index:99999;width:100%;max-width:400px;height:100%;overflow-y:auto;
-webkit-box-shadow:0 0 5px rgba(55,55,5,0.4);
-moz-box-shadow:0 0 5px rgba(55,55,5,0.4);
box-shadow:0 0 5px rgba(55,55,5,0.4)}

#gnb_1dul {background:#fff}
#gnb_1dul a {display:block;color:#000}
.gnb_1dli {position:relative;line-height:40px}
.gnb_1dli button {position:absolute;top:5px;right:0;width:40px;height:40px;overflow:hidden;border:0;font-size:1.2em;background:#fff;background:url(../img/mobile/gnb_bg2.png) no-repeat 50% 50%;text-indent:-9999px}
.gnb_1dli button.btn_gnb_cl {background:url(../img/mobile/gnb_bg.png) no-repeat 50% 50%}
.gnb_1da {padding:5px 20px;border-bottom:1px solid #eee;font-weight:bold;font-size:1.2em;}
.gnb_2dul {display:none;background:#fafafa}
.gnb_2da {padding-left:30px}
#gnb_close {display:block;position:absolute;right:8px;top:10px;z-index:99;font-weight:bold;margin:0;height:40px;width:40px;border:0;color:#bfb8b2;font-size:2em;background:transparent}

#gnb_empty {padding:20px 0;color:#fff;text-align:center;line-height:2em}
#gnb_empty a {display:inline;text-decoration:underline}

#hd_sch {text-align:center;padding:12px 55px 12px 15px;background:#212020}
#hd_sch h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}
#hd_sch form {position:relative;padding-right:40px}
#hd_sch #sch_stx {width:100%;height:38px;margin-left:40px;background:#464646;border:0;color:#fff}
#hd_sch #sch_submit {position:absolute;top:0;left:0;width:40px;height:38px;border:0;border-radius:3px;cursor:pointer;color:#a6a5a5;background:#464646;font-size:1.25em}

#user_btn {position:absolute;top:10px;right:10px;padding:0 10px;height:40px;width:40px;border:0;color:#fff;font-size:1.8em;background:none;letter-spacing:-0.1em}
#user_menu {display:none;position:fixed;top:0;right:0;width:100%;height:100%;overflow-y:auto;z-index:9999;background:#efefef;text-align:center}
#user_close {display:block;position:absolute;right:8px;top:10px;z-index:99;font-weight:bold;margin:0;height:40px;width:40px;border:0;color:#bfb8b2;font-size:1.8em;background:transparent}

#snb_cnt span {display:inline-block;float:right;padding:0 7px;height:18px;margin-top:3px;line-height:18px;font-size:12px;background:#da22f5;border-radius:20px;color:#fff}

#hd_nb {background:#fff;margin-top:10px;border-bottom:1px solid #e1e1e1}
#hd_nb:after {display:block;visibility:hidden;clear:both;content:""}
#hd_nb li {width:50%;float:left;text-align:center;line-height:25px;font-size:1.083em;font-weight:bold}
#hd_nb li a {display:block;color:#717171;text-align:left;padding:10px 15px}
#hd_nb li i {font-size:14px;margin-right:10px;color:#a5a8ac}
#hd_nb .hd_nb1 {border-right:1px solid #efefef;border-bottom:1px solid #efefef}
#hd_nb .hd_nb2 {border-bottom:1px solid #efefef}
#hd_nb .hd_nb3 {border-right:1px solid #efefef}

/* 텍스트 크기 조절 */
#text_size {margin:10px 0;text-align:center;display:inline-block;padding:7px 20px;background:#e6e7e9;border-radius:25px;height:48px}
#text_size button {margin:0 5px;border:0;background:none;height:35px;width:35px;border-radius:50%}
#text_size button.select {background:#fff;border-bottom:1px solid #bbb;
-webkit-box-shadow:0 0 5px rgba(100,80,100,0.2);
-moz-box-shadow:0 0 5px rgba(100,100,100,0.2);
box-shadow:0 0 5px rgba(100,100,100,0.2)}
.ts_up {font-size:1.167em !important}
.ts_up2 {font-size:1.3em !important}

/* 중간 레이아웃 */
#wrapper {}
#wrapper:after {display:block;visibility:hidden;clear:both;content:""}
#container {position:relative;height:100vh;background-color:#dfd4c8;overflow:hidden; }
#sub_container {position:relative;height:100vh;background-color:#f5f0ea;overflow:hidden; }
#container:after {display:block;visibility:hidden;clear:both;content:""}
#container_title {font-size:1.2em;font-weight:bold;height:50px;padding:10px 15px;line-height:30px;background:#fff;color:#333;
-webkit-box-shadow:0 0 10px rgba(181, 181, 181, 0.4);
-moz-box-shadow:0 0 10px rgba(181, 181, 181, 0.4);
box-shadow:0 0 10px rgba(181, 181, 181, 0.4);
}
#container_title a {display:inline-block;margin-right:5px}
.top {position:relative}
.btn_top {position:absolute;top:0px;right:10px;z-index:999;padding:8px 0}
.btn_top li {display:inline-block}
.btn_top a,.btn_top button,.btn_top .btn_submit {}
.btn_top .btn_cancel,.btn_top .btn_b01 {border:1px solid #aaa;background:none;color:#666;line-height:28px;background:#fff}
.fixed {position:fixed;top:0;right:0;z-index:999}
.fixed.btn_bo_user {right:10px}
#container_title.fixed {width:100%}

/* 하단 레이아웃 */
#ft {background:#222;padding:0px 20px 20px}
#ft h1 {width:0;height:0;font-size:0;line-height:0;overflow:hidden}
#ft p {margin:0;padding:10px 0;line-height:1.8em}

#ft_copy {padding:10px;line-height:2em;text-align:center;color:#777}
#ft_copy #ft_company {text-align:center}
#ft_copy #ft_company a {display:inline-block;padding:0 10px;line-height:1em;border-left:1px solid #333;color:#fff}
#ft_copy #ft_company a:first-child {border:0}
.ft_cnt {font-weight:normal;color:#e3e3e3;line-height:2em;text-align:center}
.ft_cnt h2 {width:0;height:0;font-size:0;line-height:0;overflow:hidden}
#ft_copy b {color:inherit}
#ft_copy a {color:inherit;text-decoration:none}

#top_btn {position:fixed;bottom:10px;right:15px;width:50px;height:50px;line-height:36px;border:2px solid #d2d2d2;border-radius:50%;background:#fff;color:#d2d2d2;text-align:center;font-size:15px;z-index:99;
-webkit-box-shadow:1px 2px 5px rgba(191, 191, 191, 0.4);
-moz-box-shadow:1px 2px 5px rgba(191, 191, 191, 0.4);
box-shadow:1px 2px 5px rgba(191, 191, 191, 0.4)}
#top_btn i {font-size:1.4em}
#top_btn:hover {background:#3b8afb;border-color:#3b8afb;color:#fff}
#device_change {display:block;line-height:40px;border-radius:5px;background:#302e2e;color:#777;font-size:1em;text-decoration:none;text-align:center}

/* 게시물 선택복사 선택이동 */
#copymove {}
.copymove_current {float:right;color:#ff3061}
.copymove_currentbg {background:#f4f4f4}
#copymove .tbl_head01 {margin-top:10px}
#copymove td {background:#fff}
#copymove .win_btn {margin:10px}

/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;width:0;height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;width:1px !important;height:1px !important;font-size:0 !important;line-height:0 !important;overflow:hidden}

/* 본문 바로가기 */
.to_content a {z-index:100000;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0;overflow:hidden}

/* 이미지 등비율 리사이징 */
.img_fix {width:100%;height:auto}

/* 캡챠 자동등록(입력)방지 기본 -pc */
#captcha {position:relative}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#captcha #captcha_img {height:40px;border:1px solid #898989;vertical-align:top;padding:0;margin:0}
#captcha #captcha_mp3 {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;width:40px;height:40px;background:url('../../../img/captcha2.png') no-repeat;text-indent:-999px;border-radius:3px}
#captcha #captcha_reload {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha2.png') no-repeat 0 -40px;text-indent:-999px;border-radius:3px}
#captcha #captcha_key {margin:0 0 0 3px;padding:0 5px;width:90px;height:40px;border:1px solid #ccc;background:#fff;font-size:1.333em;font-weight:bold;text-align:center;border-radius:0;vertical-align:top}
#captcha #captcha_info {display:block;margin:3px 0 5px;font-size:0.95em;letter-spacing:-0.1em}

/* 캡챠 자동등록(입력)방지 기본 - mobile */
#captcha.m_captcha audio {display:block;margin:0 0 5px}

/* 구글리캡챠 크기 조정 scale */
#captcha.recaptcha {width:213px;height:55px;overflow:hidden}
#rc-imageselect, .g-recaptcha {transform:scale(0.7);-webkit-transform:scale(0.7);transform-origin:0 0;-webkit-transform-origin:0 0}

/* ckeditor 태그 기본값 */
#bo_v_con ul {display:block;list-style-type:disc;margin-top:1em;margin-bottom:1em;margin-left:0;margin-right:0;padding-left:40px}
#bo_v_con ol {display:block;list-style-type:decimal;margin-top:1em;margin-bottom:1em;margin-left:0;margin-right:0;padding-left:40px}
#bo_v_con li {display:list-item}

/*단축키일람 */
.cke_sc {text-align:right}
.btn_cke_sc {background:#333;color:#fff;padding:5px;border:none}
.cke_sc_def {margin:0 0 5px;padding:10px;border:1px solid #ccc;background:#f7f7f7;text-align:center}
.cke_sc_def dl {margin:0 0 5px;text-align:left;zoom:1}
.cke_sc_def dl:after {display:block;visibility:hidden;clear:both;content:""}
.cke_sc_def dt, .cke_sc_def dd {float:left;margin:0;padding:5px 0;border-bottom:1px solid #e9e9e9}
.cke_sc_def dt {width:50%;font-weight:bold}
.cke_sc_def dd {width:50%}
.btn_cke_sc_close {background:#333;padding:5px;border:none;color:#fff}

/* 버튼 */
.btn {display:inline-block;padding:0 5px;height:30px;line-height:30px;border-radius:3px}
a.btn01 {display:inline-block;background:#ddd;color:#444;text-decoration:none;vertical-align:middle}
a.btn01:focus, a.btn01:hover {text-decoration:none}
button.btn01 {display:inline-block;margin:0;padding:7px;border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none}
a.btn02 {display:inline-block;border:1px solid #3b3c3f;background:#4b545e;color:#fff;text-decoration:none;vertical-align:middle}
a.btn02:focus, .btn02:hover {text-decoration:none}
button.btn02 {display:inline-block;margin:0;padding:7px;border:1px solid #3b3c3f;background:#4b545e;color:#fff;text-decoration:none}

.btn_confirm {text-align:center} /* 서식단계 진행 */

.btn_submit {border:0;background:#3a8afd;color:#fff;cursor:pointer;border-radius:3px}
.btn_submit:hover {background:#2375eb}
.btn_close {border:1px solid #dcdcdc;cursor:pointer;border-radius:3px;background:#fff}
a.btn_close {text-align:center;line-height:50px}

a.btn_cancel {display:inline-block;background:#ddd;color:#444;text-decoration:none;vertical-align:middle}
button.btn_cancel {display:inline-block;border:1px solid #ccc;background:#fafafa;color:#000;vertical-align:top;text-decoration:none}
a.btn_frmline, button.btn_frmline {display:inline-block;padding:0 5px;border:0;background:#fff;border:1px solid #3a8afd;color:#3a8afd;letter-spacing:-0.1em;text-decoration:none;vertical-align:top} /* 우편번호검색버튼 등 */
button.btn_frmline {font-size:1em}

/* 게시판용 버튼 */
a.btn_b01,.btn_b01 {display:inline-block;background:#3a8afd;color:#fff;border-radius:3px;padding:10px;border:0;text-decoration:none;vertical-align:middle}
.btn_b01:hover, .btn_b01:hover {}
a.btn_b02, .btn_b02 {display:inline-block;background:transparent;color:#fff;border:0;border-radius:3px;padding:10px;text-decoration:none;vertical-align:middle}
a.btn_b02:hover, .btn_b02:hover {}
a.btn_b03, .btn_b03 {display:inline-block;line-height:28px;border:0;background:transparent;color:#bababa;text-decoration:none;vertical-align:middle}
a.btn_b03:hover, .btn_b03:hover {}
a.btn_admin {display:inline-block;color:#d13f4a;font-size:1.4em;text-decoration:none;vertical-align:middle} /* 관리자 전용 버튼 */
a.btn_admin:focus, a.btn_admin:hover {}
.fix_btn {position:fixed;z-index:99;bottom:65px;right:15px;background:#3a8afd;width:50px;height:50px;color:#fff;text-align:center;border-radius:50% !important;font-size:1.8em;line-height:50px !important;-webkit-box-shadow:1px 2px 5px rgba(191, 191, 191, 0.4);
-moz-box-shadow:1px 2px 5px rgba(191, 191, 191, 0.4);
box-shadow:1px 2px 5px rgba(191, 191, 191, 0.4)}
a.btn,.btn {line-height:35px;width:30px;height:35px;padding:0 5px;text-align:center;font-weight:bold;border:0;font-size:1.4em;
-webkit-transition:background-color 0.3s ease-out;
-moz-transition:background-color 0.3s ease-out;
-o-transition:background-color 0.3s ease-out;
transition:background-color 0.3s ease-out}


/* 기본테이블 */
.tbl_wrap {margin:0 10px 10px}
.tbl_wrap table {width:100%;border-collapse:collapse;border-spacing:0}
.tbl_wrap caption {padding:10px 0;color:#4b8b99;font-weight:bold;text-align:left}

.tbl_head01 {}
.tbl_head01 caption {padding:0 0 10px;color:#777;text-align:left}
.tbl_head01 thead th {padding:12px 0;border:1px solid #d8dbdf;background:#f7f7f9;color:#383838;font-size:0.95em;text-align:center;letter-spacing:-0.1em}
.tbl_head01 thead a {color:#383838}
.tbl_head01 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head01 tfoot th {border-top:1px solid #666;border-bottom:1px solid #666;background:#484848;color:#fff}
.tbl_head01 tfoot td {border-color:#e3e3e5;background:#484848;color:#fff;font-weight:bold;text-align:center}
.tbl_head01 tbody {text-align:left}
.tbl_head01 tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9}
.tbl_head01 td {padding:5px;border:1px solid #e7e9ec;border-top:0;line-height:1.5em;word-break:break-all}

.tbl_head02 {}
.tbl_head02 caption {padding:0 0 10px;color:#777;text-align:left}
.tbl_head02 thead th {padding:5px 0;border-top:1px solid #d1dee2;border-bottom:1px solid #d1dee2;background:#e5ecef;color:#383838;font-size:0.95em;text-align:center;letter-spacing:-0.1em}
.tbl_head02 thead a {color:#383838}
.tbl_head02 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head02 tfoot th {border-top:1px solid #666;border-bottom:1px solid #666;background:#484848;color:#fff}
.tbl_head02 tfoot td {background:#484848;color:#fff;font-weight:bold;text-align:center}
.tbl_head02 tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9}
.tbl_head02 td {padding:5px 3px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;line-height:1.4em;word-break:break-all}

/* 기본리스트 */
.list_01 ul {}
.list_01 li {border-bottom:1px solid #e5ecee;padding:15px}
.list_01 li:after {display:block;visibility:hidden;clear:both;content:""}
.all_chk {padding:15px;border-bottom:1px solid #e8eaee;background:#fff}

/* 기본폼 */
.form_01 .write_div {margin-bottom:10px;position:relative}
.form_01 li {margin:0 0 10px;position:relative;list-style:none}
.form_01 textarea, .frm_input {border:1px solid #806753;background:#fff;color:#000;vertical-align:middle;padding:5px;border-radius:0;box-shadow:none}
.form_01 textarea {width:100%;height:100px}
.frm_input {height:45px}
.full_input {width:100%} 
.form_01 .frm_file {display:block;margin-bottom:5px;width:100%}
.form_01 select {height:40px;background-color:#fff}
.form_01 .frm_info {font-size:0.92em;color:#6d5847;text-align:left;margin:3px 0 10px;display:block;line-height:1.3em;letter-spacing:-0.02em;}

/* 자료 없는 목록 */
.empty_table {padding:100px 0 !important;color:#777;text-align:center}
.empty_list {padding:20px 0 !important;text-align:center}

/* 필수입력 */
.required, textarea.required {background-image:url('../img/require.png') !important;background-repeat:no-repeat  !important;background-position:right top !important}

/* 테이블 항목별 정의 */
.td_board {width:120px;text-align:center}
.td_category {width:80px;text-align:center}
.td_chk {width:30px;text-align:center}
.td_date {width:60px;text-align:center}
.td_datetime {width:150px;text-align:center}
.td_group {width:100px;text-align:center}
.td_mb_id {width:100px;text-align:center}
.td_mng {width:80px;text-align:center}
.td_name {width:100px;text-align:left}
.td_nick {width:100px;text-align:center}
.td_num {width:50px;text-align:center}
.td_numbig {width:80px;text-align:center}
.td_stat {width:60px;text-align:center}

.txt_active {color:#5d910b}
.txt_done {color:#e8180c}
.txt_expired {color:#999}
.txt_rdy {color:#8abc2a}

/* 새창 기본 스타일 */
.new_win {position:relative;background:#fff}
.new_win #win_title {font-size:1.3em;height:50px;line-height:30px;padding:10px 20px;background:#fff;color:#000;-webkit-box-shadow:0 1px 10px rgba(0,0,0,.1);
-moz-box-shadow:0 1px 10px rgba(0,0,0,.1);
box-shadow:0 1px 10px rgba(0,0,0,.1)}
.new_win #win_title .sv {font-size:0.75em;line-height:1.2em}
.new_win_con {}

.new_win .win_ul {margin-bottom:15px;padding:0 20px}
.new_win .win_ul:after {display:block;visibility:hidden;clear:both;content:""}
.new_win .win_ul li {float:left;background:#fff;text-align:center;padding:0 10px;border:1px solid #d6e9ff;border-radius:30px;margin-left:5px}
.new_win .win_ul li:first-child {margin-left:0}
.new_win .win_ul li a {display:block;padding:8px 0;color:#6794d3}
.new_win .win_ul .selected {background:#3a8afd;border-color:#3a8afd;position:relative;z-index:5}
.new_win .win_ul .selected a {color:#fff;font-weight:bold}
.new_win .win_desc {position:relative;margin:10px;border-radius:5px;font-size:1em;background:#f2838f;color:#fff;line-height:50px;text-align:left;padding:0 20px}
.new_win .win_desc i {font-size:1.2em;vertical-align:baseline}
.new_win .win_desc:after {content:"";position:absolute;left:0;top:0;width:4px;height:50px;background:#da4453;border-radius:3px 0 0 3px}

.new_win .win_total {float:right;display:inline-block;line-height:30px;font-weight:normal;font-size:0.75em;color:#3a8afd;background:#f6f6f6;padding:0 10px;border-radius:5px}
.new_win .new_win_con {padding:20px}
.new_win .new_win_con:after {display:block;visibility:hidden;clear:both;content:""}
.new_win .new_win_con2 {margin:20px 0}

.new_win .win_btn {clear:both;padding:10px 0 30px;text-align:center}
.new_win .win_btn a {display:inline-block;height:45px;line-height:40px;font-weight:bold}
.new_win .cert_btn {text-align:center}
.new_win .btn_close {width:60px;height:45px;overflow:hidden;cursor:pointer}
.new_win .btn_submit {padding:0 20px;height:45px;font-weight:bold;font-size:1.083em}

/* 검색결과 색상 */
.sch_word {color:#fff;background:#ff005a;padding:2px 4px;margin:0 2px}

/* 사이드뷰 */
.sv_wrap {display:inline-block;position:relative;font-weight:normal;line-height:20px}
.sv_wrap .sv {z-index:1000;width:100px;display:none;margin:5px 0 0;font-size:0.92em;background:#333;text-align:left;
-webkit-box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2)}
.sv_wrap .sv:before {content:"";position:absolute;top:-6px;left:15px;width:0;height:0;border-style:solid;border-width:0 6px 6px 6px;border-color:transparent transparent #333 transparent}
.sv_wrap .sv a {display:inline-block;width:100px;margin:0;padding:0 10px;line-height:30px;font-weight:normal;color:#bbb}
.sv_wrap .sv a:hover {background:#000;color:#fff}
.sv_member {color:#333;font-weight:bold}
.sv_on {display:block !important;position:absolute;top:23px;left:0px;width:auto;height:auto}
.sv_nojs .sv {display:block}

/* 페이징 */
.pg_wrap {clear:both;display:block;padding:10px 0;text-align:center}
.pg_wrap:after {display:block;visibility:hidden;clear:both;content:""} 
.pg {text-align:center}
.pg_page, .pg_current {display:inline-block;vertical-align:middle;background:#eee;border:1px solid #eee}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_page {color:#959595;font-size:1.083em;height:30px;line-height:28px;padding:0 5px;min-width:30px;text-decoration:none;border-radius:3px}
.pg_page:hover {background-color:#fafafa}
.pg_start {text-indent:-999px;overflow:hidden;background:url('../img/btn_first.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_prev {text-indent:-999px;overflow:hidden;background:url('../img/btn_prev.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_end {text-indent:-999px;overflow:hidden;background:url('../img/btn_end.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_next {text-indent:-999px;overflow:hidden;background:url('../img/btn_next.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_start:hover,.pg_prev:hover,.pg_end:hover,.pg_next:hover {background-color:#fafafa}

.pg_current {display:inline-block;background:#3a8afd;border:1px solid #3a8afd;color:#fff;font-weight:bold;height:30px;line-height:30px;padding:0 10px;min-width:30px;border-radius:3px}

.section_1 {
	position:relative;
	margin:0 auto;
	width:88%;
	color:#70523c;
	padding:20px 0 15px 0;
	display:table;
}
.section_1 a {
	color:#70523c;
}
.coffeebeanBox {
	float:left;
	font-size:18px;
	font-weight:bold;
}
.coffeebeanBox img {
	height:22px;
	margin-top:-2px;
}
.nickBox {
	float:right;
	font-size:18px;
	font-weight:bold;
}
.nickBox img {
	height:24px;
	margin-top:-5px;
}

.section_2 {
	position:relative;
	margin:0 auto;
	width:85%;
	padding:0 0 20px 0;
}
.adBox {
	display:inline-block;
	width:100%;
	height:50px;
	line-height:50px;
	/* background: linear-gradient(90deg, #9b897b, #7d6350, #9b897b, #7d6350); */
	background: linear-gradient(270deg, #b09c8c, #5f4b3d, #b09c8c, #5f4b3d);
    background-size: 800% 800%;
    -webkit-animation: ss_banner 6s ease infinite;
    -moz-animation: ss_banner 6s ease infinite;
    -o-animation: ss_banner 6s ease infinite;
    animation: ss_banner 6s ease infinite;
	border-radius:8px;
	text-align:center;
	font-size:16px;
	font-weight:bold;
	color:#fff;
}
.adBox span {
	color:#f9d5b6;
}
.section_3 {
	position:relative;
	display:table;
	width:90%;
	margin:0 auto;
	height:60px;
}
.shelf {
	position:absolute;
	bottom:-5px;
	width:100%;
	display:table;
}
.shelf li {
	float:left;
	position:relative;
	width:14.2857%;
	height:65px;
	text-align:center;
}
.shelf img {
	width:50px;
}
.shelf li:nth-child(1) div.cup_sticker { /* 첫번째 컵 */
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	margin-top:-25px;
}
.shelf li:nth-child(1) div.cup_sticker img {
	width:55px;
}
.shelf li:nth-child(2) div.cup_sticker { /* 두번째 컵 */
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	margin-top:-30px;
}
.shelf li:nth-child(2) div.cup_sticker img {
	width:55px;
}
.shelf li:nth-child(3) div.cup_sticker { /* 세번째 컵 */
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	margin-top:-30px;
}
.shelf li:nth-child(3) div.cup_sticker img {
	width:55px;
}
.shelf li:nth-child(4) div.cup_sticker { /* 네번째 컵 */
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	margin-top:-25px;
}
.shelf li:nth-child(4) div.cup_sticker img {
	width:55px;
}
.shelf li:nth-child(5) div.cup_sticker { /* 다섯번째 컵 */
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	margin-top:-25px;
}
.shelf li:nth-child(5) div.cup_sticker img {
	width:67px;
}
.shelf li:nth-child(6) div.cup_sticker { /* 여섯번째 컵 */
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	margin-top:-25px;
}
.shelf li:nth-child(6) div.cup_sticker img {
	width:55px;
}
.shelf li:nth-child(7) div.cup_sticker { /* 일곱번째 컵 */
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	margin-top:-25px;
}
.shelf li:nth-child(7) div.cup_sticker img {
	width:55px;
}
.leftBox {
	position:absolute;
	top:50%;left:0%;transform:translate(0%,-50%);
	z-index:100;
	left:30px;
}
.leftBox img {
	width:50px;
	margin-bottom:8px;
	filter: drop-shadow(-2px -2px 5px rgba(200,200,200,0.2)) drop-shadow(2px 2px 5px rgba(0,0,0,0.2));
}
.rightBox {
	position:absolute;
	top:50%;transform:translate(0%,-50%);
	z-index:100;
	right:30px;
}
.rightBox li {
	position:relative;
	margin-bottom:8px;
}
.rightBox img {
	width:50px;
	filter: drop-shadow(-2px -2px 5px rgba(200,200,200,0.2)) drop-shadow(2px 2px 5px rgba(0,0,0,0.2));
}
.rightBox div.right_shot {
	position:absolute;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
.rightBox div.right_shot img {
	width:32px;
	filter: none;
}
.rightBox div.right_whipping {
	position:absolute;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
.rightBox div.right_whipping img {
	width:32px;
	filter: none;
}
.rightBox div.right_time {
	position:absolute;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
.rightBox div.right_time img {
	width:32px;
	filter: none;
}
.myitem {
	position:absolute;
	top:-7px;
	right:-12px;
	width:20px;
	height:20px;
	border-radius:20px;
	background-color:#89592f;
	color:#fff;
	font-size:10px;
	line-height:20px;
	text-align:center;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.section_3 {
		height:80px;
	}
	.shelf li {
		height:80px;
	}
	.shelf img {
		width:70px;
	}
	.shelf li:nth-child(1) div.cup_sticker img { /* 첫번째 컵 */
		width:75px;
	}
	.shelf li:nth-child(2) div.cup_sticker img { /* 두번째 컵 */
		width:75px;
	}
	.shelf li:nth-child(3) div.cup_sticker img { /* 세번째 컵 */
		width:75px;
	}
	.shelf li:nth-child(4) div.cup_sticker img { /* 네번째 컵 */
		width:75px;
	}
	.shelf li:nth-child(5) div.cup_sticker img { /* 다섯번째 컵 */
		width:87px;
	}
	.shelf li:nth-child(6) div.cup_sticker img { /* 여섯번째 컵 */
		width:75px;
	}
	.shelf li:nth-child(7) div.cup_sticker { /* 일곱번째 컵 */
		margin-top:-18px;
}
	.shelf li:nth-child(7) div.cup_sticker img { /* 일곱번째 컵 */
		width:70px;
	}
	.leftBox {
		left:50px;
	}
	.leftBox img {
		width:70px;
		margin-bottom:12px;
	}
	.rightBox {
		right:50px;
	}
	.rightBox li {
		margin-bottom:12px;
	}
	.rightBox img {
		width:70px;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffeebeanBox {
		font-size:15px;
	}
	.coffeebeanBox img {
		height:20px;
		margin-top:-2px;
	}
	.nickBox {
		font-size:15px;
	}
	.nickBox img {
		height:20px;
		margin-top:-5px;
	}
	.adBox {
		font-size:13px;
	}
	.shelf li:nth-child(1) div.cup_sticker { /* 첫번째 컵 */
		margin-top:-28px;
	}
	.shelf li:nth-child(2) div.cup_sticker { /* 두번째 컵 */
		margin-top:-33px;
	}
	.shelf li:nth-child(3) div.cup_sticker { /* 세번째 컵 */
		margin-top:-32px;
	}
	.shelf li:nth-child(4) div.cup_sticker { /* 네번째 컵 */
		margin-top:-26px;
	}
	.shelf li:nth-child(5) div.cup_sticker img { /* 다섯번째 컵 */
		width:62px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.adBox {
		font-size:12px;
	}
	.section_3 {
		height:30px;
	}
	.shelf li {
		height:45px;
	}
	.shelf img {
		width:35px;
	}
	.shelf li:nth-child(1) div.cup_sticker { /* 첫번째 컵 */
		margin-top:-25px;
	}
	.shelf li:nth-child(1) div.cup_sticker img {
		width:40px;
	}
	.shelf li:nth-child(2) div.cup_sticker { /* 두번째 컵 */
		margin-top:-30px;
	}
	.shelf li:nth-child(2) div.cup_sticker img {
		width:40px;
	}
	.shelf li:nth-child(3) div.cup_sticker { /* 세번째 컵 */
		margin-top:-30px;
	}
	.shelf li:nth-child(3) div.cup_sticker img {
		width:40px;
	}
	.shelf li:nth-child(4) div.cup_sticker { /* 네번째 컵 */
		margin-top:-25px;
	}
	.shelf li:nth-child(4) div.cup_sticker img {
		width:40px;
	}
	.shelf li:nth-child(5) div.cup_sticker img { /* 다섯번째 컵 */
		width:47px;
	}
	.shelf li:nth-child(6) div.cup_sticker img { /* 여섯번째 컵 */
		width:40px;
	}
	.shelf li:nth-child(7) div.cup_sticker img { /* 여섯번째 컵 */
		width:40px;
	}
	.coffeebeanBox {
		font-size:14px;
	}
	.coffeebeanBox img {
		height:18px;
		margin-top:-2px;
	}
	.nickBox {
		font-size:14px;
	}
	.nickBox img {
		height:18px;
		margin-top:-5px;
	}
}
.kingBox {
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	bottom:40px;
	width:300px;
	height:120px;
}
.kingBox li {
	text-align:center;
	font-weight:bold;
	color:#5a4940;
	line-height:100%;
}
.kingBox li:nth-child(2) {
	font-size:16px;
	margin-top:7px;
}
.kingBox li:nth-child(3) {
	font-size:24px;
	margin-top:4px;
}
.kingBox li:nth-child(1) img {
	width:30%;
}
.kingBox li:nth-child(1) img.king_smile {
	-webkit-animation-name:king_smile;animation:king_smile 1s linear infinite;
}
.kingBox img {
	width:15% !important;
	margin-bottom:8px;
}
/* ===== index ===== */
.smile_txt { /* ㅋㅋㅋ */
	position:absolute;top:50%;left:0%;transform:translate(0%,-50%);
	overflow:hidden;
}
.smile_txt li {
	float:left;
	width:12.5%;
	height:12.5%;
}
.smile_txt img {
	width:95%;
	height:95%;
}
.smile_txt img.txt_1 {
	-webkit-animation-name:txt_2;animation:txt_2 0.1s linear infinite;
}
.smile_txt img.txt_2 {
	-webkit-animation-name:txt_2;animation:txt_2 0.2s linear infinite;
}
.smile_txt img.txt_3 {
	-webkit-animation-name:txt_2;animation:txt_2 0.25s linear infinite;
}
.smile_txt img.txt_4 {
	-webkit-animation-name:txt_2;animation:txt_2 0.15s linear infinite;
}
.saucer { /* 커피컵받침 */
	position:absolute;
	width:300px;
	height:300px;
	top:50%;left:50%;transform:translate(-50%,-50%);
}
.saucer img {
	width:100%;
}
.cup { /* 손잡이+컵 */
	position:absolute;
	width:300px;
	height:300px;
	top:50%;left:50%;transform:translate(-50%,-50%);
}
.cup img {
	width:100%;
	-webkit-animation-name:swing_cup;animation:swing_cup 1s linear infinite;
}
.coffee { /* 그라데이션 커피 */
	position:absolute;
	width:190px;
	height:190px;
	top:50%;left:50%;transform:translate(-50%,-50%);
	border-radius:250px;
	background: linear-gradient(270deg, #b28850, #996c33, #81511c, #774423);
    background-size: 800% 800%;
    -webkit-animation: coffee 3s ease infinite;
    -moz-animation: coffee 3s ease infinite;
    -o-animation: coffee 3s ease infinite;
    animation: coffee 3s ease infinite;
}
.smileking { /* 웃고 있는 왕 */
	position:absolute;
	width:110px;
	height:135px;
	top:48.5%;left:49.2%;transform:translate(-50%,-50%);
}
.smileking img {
	width:110%;
	-webkit-animation-name:king;animation:king 0.5s linear infinite;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.saucer { /* 커피컵받침 */
		width:450px;
		height:450px;
	}
	.cup { /* 손잡이+컵 */
		width:450px;
		height:450px;
	}
	.coffee { /* 그라데이션 커피 */
		width:290px;
		height:290px;
	}
	.smileking { /* 웃고 있는 왕 */
		width:150px;
		height:170px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.saucer { /* 커피컵받침 */
		width:250px;
		height:250px;
	}
	.cup { /* 손잡이+컵 */
		width:250px;
		height:250px;
	}
	.coffee { /* 그라데이션 커피 */
		width:160px;
		height:160px;
	}
	.smileking { /* 웃고 있는 왕 */
		width:80px;
		height:95px;
	}
}

/* ===== 1 커피 콘텐츠 ===== */
.coffeeCon_1 { /* 커피 콘텐츠 전체박스 */
	position:absolute;
	top:55%;left:50%;transform:translate(-50%,-50%);
	width:330px;
	height:330px;
}
.coffeeCon_1 .coffeeEnd {
	position:absolute;
	left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_1 .coffeeEnd img {
	height:100%;
}
.coffeeCon_1 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_1 .coffeeBase img {
	height:100%;
}
.coffeeCon_1 .coffeeCover { /* 커피 내용물 위에 커피모양 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_1 .coffeeCover img {
	height:100%;
}
.coffeeCon_1 .coffeeLiq ul {
	position:absolute;
	bottom:40px;
	left:50%;transform:translate(-50%,0);
	width:200px;
	height:65%;
}
.coffeeCon_1 .coffeeLiq li {
	width:100%;
	position:relative;
}
.coffeeCon_1 .coffeeLiq li:nth-child(1) {
	height:32%;
}
.coffeeCon_1 .coffeeLiq li:nth-child(1) div {
	position:absolute;
	width:100%;
	background-color:#f3c99d;
	bottom:0;
}
.coffeeCon_1 .coffeeLiq li:nth-child(2) {
	height:32%;
}
.coffeeCon_1 .coffeeLiq li:nth-child(2) div {
	position:absolute;
	width:100%;
	background-color:#e4b47e;
	bottom:0;
}
.coffeeCon_1 .coffeeLiq li:nth-child(3) {
	height:36%;
}
.coffeeCon_1 .coffeeLiq li:nth-child(3) div {
	position:absolute;
	width:100%;
	background-color:#ae825c;
	bottom:0;
}
.coffeeCon_1 .shot li:nth-child(1) div {
	background-color:#e2ac82 !important;
}
.coffeeCon_1 .shot li:nth-child(2) div {
	background-color:#cb9768 !important;
}
.coffeeCon_1 .shot li:nth-child(3) div {
	background-color:#916b4c !important;
}

/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.coffeeCon_1 { /* 커피 콘텐츠 전체박스 */
		top:56%;
		width:450px;
		height:450px;
	}
	.coffeeCon_1 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_1 .coffeeLiq ul {
		bottom:55px;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffeeCon_1 { /* 커피 콘텐츠 전체박스 */
		top:53%;
		width:260px;
		height:260px;
	}
	.coffeeCon_1 .coffeeLiq ul {
		bottom:30px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.coffeeCon_1 { /* 커피 콘텐츠 전체박스 */
		top:52%;
		width:230px;
		height:230px;
	}
}


/* ===== 2 커피 콘텐츠 ===== */
.coffeeCon_2 { /* 커피 콘텐츠 전체박스 */
	position:absolute;
	top:55%;left:50%;transform:translate(-50%,-50%);
	width:330px;
	height:330px;
}
.coffeeCon_2 .coffeeEnd { /* 완성된 커피 2 */
	position:absolute;
	top:45%;
	left:50%;transform:translate(-50%,-50%);
	height:360px;
}
.coffeeCon_2 .coffeeEnd img {
	height:100%;
}
.coffeeCon_2 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_2 .coffeeBase img {
	height:100%;
}
.coffeeCon_2 .coffeeCover { /* 커피 내용물 위에 커피모양 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_2 .coffeeCover img {
	height:100%;
}
.coffeeCon_2 .coffeeLiq ul {
	position:absolute;
	bottom:85px;
	left:50%;transform:translate(-50%,0);
	width:200px;
	height:50%;
}
.coffeeCon_2 .coffeeLiq li {
	width:100%;
	position:relative;
}
.coffeeCon_2 .coffeeLiq li:nth-child(1) {
	height:40%;
}
.coffeeCon_2 .coffeeLiq li:nth-child(1) div {
	position:absolute;
	width:100%;
	background-color:#edddac;
	bottom:0;
}
.coffeeCon_2 .coffeeLiq li:nth-child(2) {
	height:60%;
}
.coffeeCon_2 .coffeeLiq li:nth-child(2) div {
	position:absolute;
	width:100%;
	background-color:#7a4c42;
	bottom:0;
}
.coffeeCon_2 .shot li:nth-child(1) div {
	background-color:#d7c08c !important;
}
.coffeeCon_2 .shot li:nth-child(2) div {
	background-color:#623d35 !important;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.coffeeCon_2 { /* 커피 콘텐츠 전체박스 */
		top:56%;
		width:450px;
		height:450px;
	}
	.coffeeCon_2 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_2 .coffeeLiq ul {
		bottom:125px;
	}
	.coffeeCon_2 .coffeeEnd { /* 완성된 커피 2 */
		top:42%;
		height:480px;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffeeCon_2 { /* 커피 콘텐츠 전체박스 */
		top:55%;
		width:260px;
		height:260px;
	}
	.coffeeCon_2 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_2 .coffeeLiq ul {
		bottom:70px;
	}
	.coffeeCon_2 .coffeeEnd { /* 완성된 커피 2 */
		height:300px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.coffeeCon_2 { /* 커피 콘텐츠 전체박스 */
		top:54%;
		width:240px;
		height:240px;
	}
	.coffeeCon_2 .coffeeEnd { /* 완성된 커피 2 */
		height:260px;
	}
}

/* ===== 3 커피 콘텐츠 ===== */
.coffeeCon_3 { /* 커피 콘텐츠 전체박스 */
	position:absolute;
	top:55%;left:50%;transform:translate(-50%,-50%);
	width:300px;
	height:310px;
}
.coffeeCon_3 .coffeeEnd { /* 완성된 커피 3 */
	position:absolute;
	top:45%;
	left:50%;transform:translate(-50%,-50%);
	height:360px;
}
.coffeeCon_3 .coffeeEnd img {
	height:100%;
}
.coffeeCon_3 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:310px;
}
.coffeeCon_3 .coffeeBase img {
	height:100%;
}
.coffeeCon_3 .coffeeCover { /* 커피 내용물 위에 커피모양 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_3 .coffeeCover img {
	height:100%;
}
.coffeeCon_3 .coffeeLiq ul {
	position:absolute;
	bottom:70px;
	left:50%;transform:translate(-50%,0);
	width:200px;
	height:55%;
}
.coffeeCon_3 .coffeeLiq li {
	width:100%;
	position:relative;
}
.coffeeCon_3 .coffeeLiq li:nth-child(1) {
	height:32%;
}
.coffeeCon_3 .coffeeLiq li:nth-child(1) div {
	position:absolute;
	width:100%;
	background-color:#eae5d0;
	bottom:0;
}
.coffeeCon_3 .coffeeLiq li:nth-child(2) {
	height:32%;
}
.coffeeCon_3 .coffeeLiq li:nth-child(2) div {
	position:absolute;
	width:100%;
	background-color:#886040;
	bottom:0;
}
.coffeeCon_3 .coffeeLiq li:nth-child(3) {
	height:36%;
}
.coffeeCon_3 .coffeeLiq li:nth-child(3) div {
	position:absolute;
	width:100%;
	background-color:#473430;
	bottom:0;
}
.coffeeCon_3 .shot li:nth-child(1) div {
	background-color:#e6e1c8 !important;
}
.coffeeCon_3 .shot li:nth-child(2) div {
	background-color:#73441e !important;
}
.coffeeCon_3 .shot li:nth-child(3) div {
	background-color:#27100c !important;
}

/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.coffeeCon_3 { /* 커피 콘텐츠 전체박스 */
		top:56%;
		width:550px;
		height:450px;
	}
	.coffeeCon_3 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_3 .coffeeLiq ul {
		width:400px;
		bottom:100px;
	}
	.coffeeCon_3 .coffeeEnd { /* 완성된 커피 3 */
		top:42%;
		height:480px;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffeeCon_3 { /* 커피 콘텐츠 전체박스 */
		top:54%;
		width:250px;
		height:250px;
	}
	.coffeeCon_3 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_3 .coffeeLiq ul {
		bottom:53px;
	}
	.coffeeCon_3 .coffeeEnd { /* 완성된 커피 3 */
		height:300px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.coffeeCon_3 { /* 커피 콘텐츠 전체박스 */
		top:52%;
		width:220px;
		height:220px;
	}
	.coffeeCon_3 .coffeeLiq ul {
		bottom:49px;
	}
	.coffeeCon_3 .coffeeEnd { /* 완성된 커피 3 */
		height:250px;
	}
}


/* ===== 4 커피 콘텐츠 ===== */
.coffeeCon_4 { /* 커피 콘텐츠 전체박스 */
	position:absolute;
	top:55%;left:50%;transform:translate(-50%,-50%);
	width:300px;
	height:310px;
}
.coffeeCon_4 .coffeeEnd { /* 완성된 커피 4 */
	position:absolute;
	top:45%;
	left:50%;transform:translate(-50%,-50%);
	height:360px;
}
.coffeeCon_4 .coffeeEnd img {
	height:100%;
}
.coffeeCon_4 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:310px;
}
.coffeeCon_4 .coffeeBase img {
	height:100%;
}
.coffeeCon_4 .coffeeCover { /* 커피 내용물 위에 커피모양 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_4 .coffeeCover img {
	height:100%;
}
.coffeeCon_4 .coffeeLiq ul {
	position:absolute;
	bottom:30px;
	left:50%;transform:translate(-50%,0);
	width:200px;
	height:65%;
}
.coffeeCon_4 .coffeeLiq li {
	width:100%;
	position:relative;
}
.coffeeCon_4 .coffeeLiq li:nth-child(1) {
	height:32%;
}
.coffeeCon_4 .coffeeLiq li:nth-child(1) div {
	position:absolute;
	width:100%;
	background-color:#ebe7d3;
	bottom:0;
}
.coffeeCon_4 .coffeeLiq li:nth-child(2) {
	height:32%;
}
.coffeeCon_4 .coffeeLiq li:nth-child(2) div {
	position:absolute;
	width:100%;
	background-color:#dfcda3;
	bottom:0;
}
.coffeeCon_4 .coffeeLiq li:nth-child(3) {
	height:36%;
}
.coffeeCon_4 .coffeeLiq li:nth-child(3) div {
	position:absolute;
	width:100%;
	background-color:#52403d;
	bottom:0;
}
.coffeeCon_4 .shot li:nth-child(1) div {
	background-color:#e6e1c8 !important;
}
.coffeeCon_4 .shot li:nth-child(2) div {
	background-color:#d7c08c !important;
}
.coffeeCon_4 .shot li:nth-child(3) div {
	background-color:#27100c !important;
}

/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.coffeeCon_4 { /* 커피 콘텐츠 전체박스 */
		top:56%;
		width:450px;
		height:450px;
	}
	.coffeeCon_4 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_4 .coffeeLiq ul {
		bottom:40px;
	}
	.coffeeCon_4 .coffeeEnd { /* 완성된 커피 4 */
		top:42%;
		height:480px;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffeeCon_4 { /* 커피 콘텐츠 전체박스 */
		top:54%;
		width:250px;
		height:250px;
	}
	.coffeeCon_4 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:250px;
	}
	.coffeeCon_4 .coffeeLiq ul {
		bottom:25px;
	}
	.coffeeCon_4 .coffeeEnd { /* 완성된 커피 4 */
		height:300px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.coffeeCon_4 { /* 커피 콘텐츠 전체박스 */
		top:54%;
		width:235px;
		height:235px;
	}
	.coffeeCon_4 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_4 .coffeeEnd { /* 완성된 커피 4 */
		height:250px;
	}
}

/* ===== 5 커피 콘텐츠 ===== */
.coffeeCon_5 { /* 커피 콘텐츠 전체박스 */
	position:absolute;
	top:54%;left:50%;transform:translate(-50%,-50%);
	width:330px;
	height:340px;
	overflow:hidden;
}
.coffeeCon_5 .coffeeEnd { /* 완성된 커피 5 */
	position:absolute;
	top:50%;
	left:50%;transform:translate(-50%,-50%);
	height:340px;
}
.coffeeCon_5 .coffeeEnd img {
	height:100%;
}
.coffeeCon_5 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:340px;
}
.coffeeCon_5 .coffeeBase img {
	height:100%;
}
.coffeeCon_5 .coffeeCover { /* 커피 내용물 위에 커피모양 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_5 .coffeeCover img {
	height:100%;
}
.coffeeCon_5 .coffeeLiq ul {
	position:absolute;
	bottom:120px;
	left:50%;transform:translate(-50%,0);
	width:200px;
	height:26%;
}
.coffeeCon_5 .coffeeLiq li {
	width:100%;
	position:relative;
}
.coffeeCon_5 .coffeeLiq li:nth-child(1) {
	height:50%;
}
.coffeeCon_5 .coffeeLiq li:nth-child(1) div {
	position:absolute;
	width:100%;
	background-color:#8f694b;
	bottom:0;
}
.coffeeCon_5 .coffeeLiq li:nth-child(2) {
	height:50%;
}
.coffeeCon_5 .coffeeLiq li:nth-child(2) div {
	position:absolute;
	width:100%;
	background-color:#52403d;
	bottom:0;
}
.coffeeCon_5 .shot li:nth-child(1) div {
	background-color:#73441e !important;
}
.coffeeCon_5 .shot li:nth-child(2) div {
	background-color:#27100c !important;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.coffeeCon_5 { /* 커피 콘텐츠 전체박스 */
		top:54%;
		width:480px;
		height:480px;
	}
	.coffeeCon_5 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_5 .coffeeLiq ul {
		width:300px;
		bottom:165px;
	}
	.coffeeCon_5 .coffeeEnd { /* 완성된 커피 5 */
		top:50%;
		height:480px;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffeeCon_5 { /* 커피 콘텐츠 전체박스 */
		top:51%;
		width:260px;
		height:260px;
	}
	.coffeeCon_5 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:260px;
	}
	.coffeeCon_5 .coffeeLiq ul {
		bottom:90px;
	}
	.coffeeCon_5 .coffeeEnd { /* 완성된 커피 5 */
		height:260px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.coffeeCon_5 { /* 커피 콘텐츠 전체박스 */
		top:50%;
		width:220px;
		height:220px;
	}
	.coffeeCon_5 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_5 .coffeeLiq ul {
		bottom:80px;
	}
	.coffeeCon_5 .coffeeEnd { /* 완성된 커피 5 */
		height:200px;
	}
}

/* ===== 6 커피 콘텐츠 ===== */
.coffeeCon_6 { /* 커피 콘텐츠 전체박스 */
	position:absolute;
	top:53%;left:50%;transform:translate(-50%,-50%);
	width:300px;
	height:310px;
}
.coffeeCon_6 .coffeeEnd { /* 완성된 커피 6 */
	position:absolute;
	top:50%;
	left:50%;transform:translate(-50%,-50%);
	height:300px;
}
.coffeeCon_6 .coffeeEnd img {
	height:100%;
}
.coffeeCon_6 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:310px;
}
.coffeeCon_6 .coffeeBase img {
	height:100%;
}
.coffeeCon_6 .coffeeCover { /* 커피 내용물 위에 커피모양 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_6 .coffeeCover img {
	height:100%;
}
.coffeeCon_6 .coffeeLiq ul {
	position:absolute;
	bottom:20px;
	left:50%;transform:translate(-50%,0);
	width:200px;
	height:55%;
}
.coffeeCon_6 .coffeeLiq li {
	width:100%;
	position:relative;
}
.coffeeCon_6 .coffeeLiq li:nth-child(1) {
	height:50%;
}
.coffeeCon_6 .coffeeLiq li:nth-child(1) div {
	position:absolute;
	width:100%;
	background-color:#8f694b;
	bottom:0;
}
.coffeeCon_6 .coffeeLiq li:nth-child(2) {
	height:50%;
}
.coffeeCon_6 .coffeeLiq li:nth-child(2) div {
	position:absolute;
	width:100%;
	background-color:#52403d;
	bottom:0;
}
.coffeeCon_6 .shot li:nth-child(1) div {
	background-color:#73441e !important;
}
.coffeeCon_6 .shot li:nth-child(2) div {
	background-color:#27100c !important;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.coffeeCon_6 { /* 커피 콘텐츠 전체박스 */
		top:56%;
		width:450px;
		height:450px;
	}
	.coffeeCon_6 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_6 .coffeeLiq ul {
		width:300px;
		bottom:30px;
	}
	.coffeeCon_6 .coffeeEnd { /* 완성된 커피 6 */
		top:50%;
		height:420px;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffeeCon_6 { /* 커피 콘텐츠 전체박스 */
		top:54%;
		width:250px;
		height:250px;
	}
	.coffeeCon_6 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_6 .coffeeLiq ul {
		bottom:15px;
	}
	.coffeeCon_6 .coffeeEnd { /* 완성된 커피 6 */
		height:240px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.coffeeCon_6 { /* 커피 콘텐츠 전체박스 */
		top:53%;
		width:220px;
		height:220px;
	}
	.coffeeCon_6 .coffeeEnd { /* 완성된 커피 6 */
		height:200px;
	}
}

/* ===== 7 커피 콘텐츠 ===== */
.coffeeCon_7 { /* 커피 콘텐츠 전체박스 */
	position:absolute;
	top:52%;left:50%;transform:translate(-50%,-50%);
	width:370px;
	height:370px;
}
.coffeeCon_7 .coffeeEnd { /* 완성된 커피 7 */
	position:absolute;
	top:52%;
	left:50%;transform:translate(-50%,-50%);
	height:360px;
}
.coffeeCon_7 .coffeeEnd img {
	height:100%;
}
.coffeeCon_7 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:370px;
}
.coffeeCon_7 .coffeeBase img {
	height:100%;
}
.coffeeCon_7 .coffeeCover { /* 커피 내용물 위에 커피모양 */
	position:absolute;
	bottom:0;left:50%;transform:translate(-50%,0);
	height:100%;
}
.coffeeCon_7 .coffeeCover img {
	height:100%;
}
.coffeeCon_7 .coffeeLiq ul {
	position:absolute;
	bottom:20px;
	left:50%;transform:translate(-50%,0);
	width:200px;
	height:45%;
}
.coffeeCon_7 .coffeeLiq li {
	width:100%;
	position:relative;
}
.coffeeCon_7 .coffeeLiq li:nth-child(1) {
	height:32%;
}
.coffeeCon_7 .coffeeLiq li:nth-child(1) div {
	position:absolute;
	width:100%;
	background-color:#ebe7d3;
	bottom:0;
}
.coffeeCon_7 .coffeeLiq li:nth-child(2) {
	height:32%;
}
.coffeeCon_7 .coffeeLiq li:nth-child(2) div {
	position:absolute;
	width:100%;
	background-color:#dfcda3;
	bottom:0;
}
.coffeeCon_7 .coffeeLiq li:nth-child(3) {
	height:36%;
}
.coffeeCon_7 .coffeeLiq li:nth-child(3) div {
	position:absolute;
	width:100%;
	background-color:#52403d;
	bottom:0;
}
.coffeeCon_7 .shot li:nth-child(1) div {
	background-color:#e6e1c8 !important;
}
.coffeeCon_7 .shot li:nth-child(2) div {
	background-color:#d7c08c !important;
}
.coffeeCon_7 .shot li:nth-child(3) div {
	background-color:#27100c !important;
}

/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.coffeeCon_7 { /* 커피 콘텐츠 전체박스 */
		top:56%;
		width:450px;
		height:450px;
	}
	.coffeeCon_7 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:100%;
	}
	.coffeeCon_7 .coffeeLiq ul {
		bottom:20px;
	}
	.coffeeCon_7 .coffeeEnd { /* 완성된 커피 7 */
		top:48%;
		height:420px;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffeeCon_7 { /* 커피 콘텐츠 전체박스 */
		top:52%;
		width:250px;
		height:250px;
	}
	.coffeeCon_7 .coffeeBase { /* 제일 밑에/위에 커피내용물이 올라옴 */
		height:250px;
	}
	.coffeeCon_7 .coffeeLiq ul {
		bottom:15px;
	}
	.coffeeCon_7 .coffeeEnd { /* 완성된 커피 7 */
		height:280px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.coffeeCon_7 { /* 커피 콘텐츠 전체박스 */
		top:52%;
	}
	.coffeeCon_7 .coffeeEnd { /* 완성된 커피 7 */
		height:240px;
	}
}


.w100 {
	width:100%;
	background-color:#f5f0e9;
}
.hei_100per {
	height:100%;
}
.invisible {
	display:none;
}

/* ===== 서버 점검중 ===== */
.error_wrap { position:relative;width:100%;height:100vh;background-color:#fff;text-align:center; }
.error { width:100%;height:auto;position:absolute;top:50%;left:0%;transform:translate(0%,-50%); }
.error div:nth-child(1) img { width:60%; } /* 서버 점검중 텍스트 이미지 */
.error div:nth-child(1) img.error_3 { width:100%; } /* 서버 점검중 텍스트 이미지 */
.error  img.king { width:40%;margin-top:50px; } /* 서버 점검중 텍스트 이미지 */
.error ul {
	width:90%;
	margin:25px auto;
}
.error li {
	float:left;
	width:50%;
}
.error a > img {
	width:97%;
}
.error li:nth-child(2) {
	text-align:right;
}
@media (max-width: 767px) {
.error { height:auto; }
.error div:nth-child(1) img { width:75%; } /* 서버 점검중 텍스트 이미지 */
}

 /* ===== 휘핑 추가 / 샷 추가 / 시간 단축 ===== */
.coffee_popWrap {
	position:absolute;
	z-index:500;
	width:100%;
	height:100vh;
	background-color:rgba(0,0,0,0.25);
}
/* ===== 샷 추가 ===== */
.down_coffeebean {
	position:absolute;
}
.down_coffeebean img {
	width:100%;
}

/* ===== 시간 단축 ===== */
.coffee_popWrap_2 {
	position:absolute;
	z-index:500;
	width:100%;
	height:100vh;
}
.shot_time_back {
	position:absolute;
	width:100%;
	height:100vh;
	background-color:rgba(0,0,0,0.2);
}
.time {
	position:absolute;
	width:130px;
	height:130px;
	top:50%;left:50%;transform:translate(-50%,-50%);
}
.time img {
	width:100%;
}
.time_arrow {
	position:absolute;
	width:260px;
	height:260px;
	top:50%;left:50%;transform:translate(-50%,-50%);
}
.time_arrow img {
	width:100%;
}

/* ========== 휘핑추가 1 ========== */
.whipBox_1 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
	position:absolute;
	width:200px;
	height:390px;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
img.whip_1 { /* 휘핑 등장 */
	position:absolute;
	width:100%;
	top:5px;
	left:0;
	opacity:0;
	 -webkit-transform-origin:bottom center;-ms-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-name:whipIn_1;animation:whipIn_1 0.8s  0.5s linear forwards;
}
img.cupIn { /* 컵 등장 */
	position:absolute;
	width:100%;
	top:0;
	left:50%;
	opacity:0;
	transform:translate(-50%,0);
	-webkit-animation-name:cupIn_1;animation:cupIn_1 0.5s linear forwards;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.whipBox_1 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
		width:350px;
		height:660px;
	}
	img.whip_1 { /* 휘핑 등장 */
		top:-5px;
	}
}
/* ========== 휘핑추가 2 ========== */
.whipBox_2 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
	position:absolute;
	width:260px;
	height:430px;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
img.whip_2 { /* 휘핑 등장 */
	position:absolute;
	width:100%;
	top:-3px;
	left:0;
	opacity:0;
	 -webkit-transform-origin:bottom center;-ms-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-name:whipIn_1;animation:whipIn_1 0.8s  0.5s linear forwards;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.whipBox_2 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
		width:450px;
		height:760px;
	}
	img.whip_2 { /* 휘핑 등장 */
		top:-13px;
	}
}
/* ========== 휘핑추가 3 ========== */
.whipBox_3 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
	position:absolute;
	width:220px;
	height:370px;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
img.whip_3 { /* 휘핑 등장 */
	position:absolute;
	width:100%;
	top:0px;
	left:0;
	opacity:0;
	 -webkit-transform-origin:bottom center;-ms-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-name:whipIn_1;animation:whipIn_1 0.8s  0.5s linear forwards;
}
img.whip_3_line { /* 컵 라인 */
	position:absolute;
	width:180px;
	top:95px;
	left:50%;
	opacity:0;
	transform:translate(-50%,-50%);
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.whipBox_3 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
		width:420px;
		height:760px;
	}
	img.whip_3 { /* 휘핑 등장 */
		top:-13px;
	}
	img.whip_3_line { /* 컵 라인 */
		position:absolute;
		width:370px;
		top:168px;
		left:50%;
		opacity:0;
		transform:translate(-50%,-50%);
	}
}

/* ========== 휘핑추가 4 ========== */
.whipBox_4 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
	position:absolute;
	width:260px;
	height:390px;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
img.whip_4 { /* 휘핑 등장 */
	position:absolute;
	width:100%;
	top:-14px;
	left:0;
	opacity:0;
	 -webkit-transform-origin:bottom center;-ms-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-name:whipIn_1;animation:whipIn_1 0.8s  0.5s linear forwards;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.whipBox_4 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
		width:480px;
		height:720px;
	}
	img.whip_4 { /* 휘핑 등장 */
		top:-39px;
	}
}

/* ========== 휘핑추가 5 ========== */
.whipBox_5 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
	position:absolute;
	width:290px;
	height:320px;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
img.whip_5 { /* 휘핑 등장 */
	position:absolute;
	width:100%;
	top:28px;
	left:0;
	opacity:0;
	 -webkit-transform-origin:bottom center;-ms-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-name:whipIn_1;animation:whipIn_1 0.8s  0.5s linear forwards;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.whipBox_5 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
		width:540px;
		height:600px;
	}
	img.whip_5 { /* 휘핑 등장 */
		top:42px;
	}
}

/* ========== 휘핑추가 6 ========== */
.whipBox_6 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
	position:absolute;
	width:230px;
	height:280px;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
img.whip_6 { /* 휘핑 등장 */
	position:absolute;
	width:100%;
	top:85px;
	left:0;
	opacity:0;
	 -webkit-transform-origin:bottom center;-ms-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-name:whipIn_2;animation:whipIn_2 0.8s  0.5s linear forwards;
}
img.whip_6_line { /* 컵 라인 */
	position:absolute;
	width:271px;
	top:62px;
	left:50%;
	opacity:0;
	transform:translate(-50%,-50%);
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.whipBox_6 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
		width:350px;
		height:420px;
	}
	img.whip_6_line { /* 컵 라인 */
	width:415px;
	top:86px;
}
	img.whip_6 { /* 휘핑 등장 */
		top:128px;
	}
}

/* ========== 휘핑추가 7 ========== */
.whipBox_7 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
	position:absolute;
	width:245px;
	height:390px;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
img.whip_7 { /* 휘핑 등장 */
	position:absolute;
	width:100%;
	top:35px;
	left:0;
	opacity:0;
	 -webkit-transform-origin:bottom center;-ms-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-name:whipIn_1;animation:whipIn_1 0.8s  0.5s linear forwards;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.whipBox_7 { /* 컵과 휘핑 위치를 위한 박스 - width값과 height값이 완료되었을때와 동일해야 함 */
		width:350px;
		height:600px;
	}
	img.whip_7 { /* 휘핑 등장 */
		top:39px;
	}
}

/* 설정 */
.setting_box { /* 전체 설정박스의 위치 설정 */
	position:absolute;top:50%;left:50%;
	transform:translate(-50%,-50%);
	width:92%;
}
.setting_box div.setting_title_txt { /* 설정 타이틀 */
	display:table;
	width:100%;
	height:70px;
	color:#584a3f;
	font-weight:500;font-size:30px;line-height:100%;
	text-align:center;
}
.setting_box div.setting_title_txt img {  /* 설정 타이틀 이미지 */
	width:60px;
	margin-top:-5px;
}
.setting_option {   /* 배경음 등 라운드 박스 */
	width:92%;
	margin:0 auto;
	display:table;
	border:1px solid #b2a89f;
	border-radius:10px;
	padding:20px 30px;
}
.setting_option li { 
	float:left;
	width:50%;
	height:48px;
	padding-bottom:8px; 
}
.setting_option li:nth-child(odd) { 
	text-align:left;
	padding:8px 0 10px 0;
	color:#816651;font-size:18px;font-weight:700;
}
.setting_option li:nth-child(even) { 
	text-align:right;
	padding:5px 0 0 0;
}
.setting_option li:nth-child(even) img { 
	width:110px;
}
.setting_accountBox {  /* 접속계정 라운드 박스 */
	width:92%;
	margin:12px auto 10px auto;
	border:1px solid #b2a89f;
	border-radius:10px;
	padding:20px 30px;
	display:table;text-align:center;
	font-size:20px;font-weight:700; 
}
.setting_account { /* 접속계정 타이틀 */
	border-bottom:1px solid #d2c9c2;
	width:100%;
	padding-bottom:10px;
	margin-bottom:10px;
	display:table;text-align:center;
	color:#5b4a42;
}
.setting_ing { 
	width:100%;
	display:table;
}
.setting_ing li { 
	float:left;
	font-size:14px; 
}
.setting_ing li:nth-child(1) { 
	width:35%;
	text-align:left;
	padding:8px 0 5px 0;
	color:#5a493f;
}
.setting_ing li:nth-child(2) { 
	width:65%;
	text-align:right;
}
.setting_ing a { 
	display:inline-block;
	width:85px;height:32px;
	padding-top:8px;
	background-color:#ae9d8d;
	border:1px solid #75695d;
	text-align:center;
	font-size:13px; 
	color:#fff;font-weight:700;
	border-radius:20px;
	line-height:100%;
}
.setting_link { /* 문의하기 등의 텍스트 링크 */
	width:96%;
	margin:10px auto;
	text-align:center;
}
.setting_link a { 
	display:inline-block;
	text-decoration:underline;
	font-size:14px;color:#816852;
}
span.blank { display:inline-block;width:30px; }

@media (max-width: 400px) {
	.setting_box div.setting_title_txt { /* 설정 타이틀 */
		height:55px;
		font-size:26px;
	}
	.setting_box div.setting_title_txt img {  /* 설정 타이틀 이미지 */
		width:50px;
		margin-top:-5px;
	}
	.setting_accountBox {  /* 접속계정 라운드 박스 */
		padding:15px 20px;
		font-size:18px
	}
	.setting_ing li { font-size:13px; }
	.setting_ing li:nth-child(1) { padding:7px 0 5px 0; width:35%; }
	.setting_ing a { padding-top:7px;font-size:12px;width:78px;height:30px;line-height:100%; }
	.setting_link { margin:8px auto;  }
	.setting_link a { font-size:12px; }
}
@media (max-width: 340px) {
	.setting_option li:nth-child(even) img { 
		width:96px;
	}
	.setting_ing {padding:10px 0px 0px 10px; }
	.setting_ing li { font-size:12px; }
	.setting_ing a { width:67px; }
	span.blank { width:15px; }
	.setting_link { margin:8px auto 3px auto;  }
}
/* ===== 하단 네비 ===== */
.navi {
	position:fixed;
	background-color:#e0d4c8;
	bottom:0;
	width:100%;
	height:70px;
}
.navi li {
	float:left;
	width:25%;
	text-align:center;
	padding:15px 0 0 0;
	color:#735843;
	font-weight:bold;
	opacity:0.45;
}
.navi img {
	width:30px;
	margin-bottom:1px;
}
.navi li.on {
	opacity:1;
}

.brandBox { /* 파이샵 카테고리 감싸고 있는 배경 */
	position:absolute;
	width:88%;
	height:70%;
	top:50%;
	left:50%;transform:translate(-50%,-50%);
}
.brandBox li { /* 카테고리 리스트 */
	float:left;
	position:relative;
	width:31%;
	height:30%;
	border:1px solid #d0d0d0;
	border-radius:12px;
	margin-bottom:10px;
}
.brandBox li:nth-child(2), .brandBox li:nth-child(5), .brandBox li:nth-child(8) {
	margin:0 3.5%;
}
.brandBox img {
	position:absolute;
	width:80%;
	height:auto;
	top:50%;
	left:50%;transform:translate(-50%,-50%);
}
@media (min-width: 767px) {
	.brand { /* 코인리스트 */
	
	}
}

/* === 뒤로 가기 === */
.page_before { position:absolute;top:75px;left:4%;z-index:90; }
.page_before img { width:18px; }

.brandName {
	text-align:center;
	font-size:24px;
	font-weight:bold;
	width:75%;
	line-height:28px;
	margin:10px auto 25px auto;
	color:#70523c;
	word-break:break-all;
}
@media (max-width: 360px) {
	.brandName {
		font-size:20px;
	}
}

/* ============================= 제품 리스트 */
.cfList_wrap {
	width:88%;
	overflow-y:scroll;
	margin:0 auto;
	height:calc(100% - 190px);
}
.cfList_wrap ul {
	float:left;
	margin:0 auto 15px auto;
	width:50%;
	display:table;
	height:370px !important;
}
.cfList_wrap li {
	text-align:center;
}
.cfList_wrap li:nth-child(1) img {
	border:1px solid #b2a89e;
	width:88%;
	border-radius:10px;
}
.cfList_wrap li:nth-child(1)  {
	margin-bottom:7px;
}
.cfList_wrap li:nth-child(2)  {
	color:#996c33;
	padding:0 5px;
	font-size:13px;
}
.cfList_wrap li:nth-child(3)  {
	color:#70523c;
	font-size:16px;
	font-weight:bold;
}
.cfList_wrap li:nth-child(3) img {
	width:14px;
	margin-top:-3px;
}

@media (max-width: 520px) {
	.cfList_wrap ul {
		margin:0 auto 10px auto;
		height:225px !important;
	}
}
@media (max-width: 330px) {
	.cfList_wrap ul {
		margin:0 auto 12px auto;
		height:185px !important;
	}
}

/* === 제품 상세 ===*/
.coffee_view_wrap {
	width:88%;
	overflow-y:scroll;
	margin:0 auto;
	height:calc(100% - 100px);
}
.coffee_view_name {
	font-size:24px;
	text-align:center;
	font-weight:bold;
	width:75%;
	line-height:28px;
	margin:10px auto 15px auto;
	color:#996c33;
	word-break:break-all;
}
.coffee_view_price {
	width:100%;
	text-align:center;
	font-size:20px;
	font-weight:bold;
	margin-bottom:10px;
	color:#70523c;
}
.coffee_view_price img {
	width:17px;
	margin-top:-5px;
}
.coffee_view_img {
	width:100%;
	text-align:center !important;
	display:table;
}
.coffee_view_img img {
	border:1px solid #e5e5e5;
	width:90%;
}
.coffee_view_btn {
	width:100%;
	text-align:center;
}
.coffee_view_btn a {
	width:80%;
	display:inline-block;
	background-color:#806753;
	color:#fff;
	font-size:22px;
	font-weight:bold;
	text-align:center;
	border-radius:200px;
	height:50px;
	line-height:46px;
	margin:20px 0;
}
.coffee_view_content {
	padding:0 10px;
	margin-top:10px;
	color:#434343;
}
@media (max-width: 360px) {
	.coffee_view_name {
		font-size:20px;
	}
}

/* 빈잔 들어오는 애니 */
.coffee_1_empty { /* 첫번째 잔 */
}
.coffee_1_empty img {
	position:absolute;
	width:175px;
	height:auto;
	top:53.5%;
	left:50%;
	z-index:550;
}
/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.coffee_1_empty img { /* 첫번째 잔 */
		width:240px;
		top:54.5%;
		left:50%;
		z-index:550;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
	.coffee_1_empty img { /* 첫번째 잔 */
		width:135px;
		top:51.5%;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	.coffee_1_empty { /* 첫번째 잔 */
		width:120px;
		top:50.5%;
	}
}

/* 내 원두 */
.backLayer {
	position:absolute;
	top:0;
	width:100%;
	height:100vh;
	background-color:rgba(0,0,0,0.7);
	z-index:650;
}
.mybean_box { /* 내 원두 박스 위치설정 */
	position:absolute;top:50%;left:50%;
	transform:translate(-50%,-50%);
	width:92%;
	height:75%;
}
.mybean_box div.mybean_title_img {
	width:100%;
	text-align:center;
	height:50px;
}
.mybean_box div.mybean_title_img img { /* 내 원두 타이틀 이미지 */
	height:70px;
}
.mybean_box div.mybean_title_txt { /* 내 원두 타이틀 */
	display:table;
	position:relative;
	width:92%;
	margin:0 auto;
	height:50px !important;
	color:#fff;
	background-color:#8a7d70;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	font-weight:500;font-size:22px;line-height:100%;
	text-align:center;
}
.mybean_box div.mybean_title_txt span {
	width:100%;
	position:absolute;
	top:50%;left:50%;transform:translate(-50%,-50%);
}
.mybeanBox {   /* 실제 리스트 박스 */
	width:92%;
	margin:0 auto;
	display:table;
	border:1px solid #b2a89f;
	background-color:#fff;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	padding:5px 15px 20px 15px;
	height:75%;
}
.mybeanBox ul {
	height:100%;
	overflow-y:scroll;
	overflow-x:hidden;
}
.mybeanBox li {
	float:left;
	position:relative;
	height:48px;
	border-bottom:1px solid #e0d5c9;
}
.mybeanBox span {
	display:inline-block;
	position:absolute;top:50%;left:0%;transform:translate(0%,-50%);
}
.mybeanBox li:nth-child(3n+1) {
	width:20%;
	color:#a29589;
	font-size:10px;
}
.mybeanBox li:nth-child(3n+2) {
	width:59%;
}
.mybeanBox li:nth-child(3n) {
	width:21%;
	text-align:right !important;
}
.mybeanBox li:nth-child(3n) span {
	right:5px;
}
.layerClose {
	width:100%;
	text-align:center;
	height:40px;
}
.layerClose img {
	height:100%;
	margin-top:5px;
}
@media (max-width: 400px) {
	.mybean_box div.mybean_title_txt { /* 내 원두 타이틀 */
		height:55px;
		font-size:18px;
	}
}

/*  */
.section_3N {
	position:relative;
	display:table;
	width:90%;
	margin:0 auto;
	height:60px;
}
.shelfN {
	position:absolute;
	bottom:-7px;
	width:100%;
	height:60px;
}
.shelfN li {
	float:left;
	position:relative;
	width:14.2857%;
	height:60px;
	text-align:center;
}
.shelfN img {
	width:30px;
	height:auto;
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	bottom:0;
}
.shelfN li:nth-child(1) img.sticker {
	left:25%;
	opacity:0;
	filter: drop-shadow(-3px -3px 2px rgba(200,200,200,0.2)) drop-shadow(3px 3px 3px rgba(0,0,0,0.2));
}
.shelfN li:nth-child(2) img.sticker {
	left:15% !important;
	opacity:0;
	filter: drop-shadow(-3px -3px 2px rgba(200,200,200,0.2)) drop-shadow(3px 3px 3px rgba(0,0,0,0.2));
}
.shelfN li:nth-child(3) img.sticker {
	left:25%;
	opacity:0;
	filter: drop-shadow(-3px -3px 2px rgba(200,200,200,0.2)) drop-shadow(3px 3px 3px rgba(0,0,0,0.2));
}
.shelfN li:nth-child(4) img.sticker {
	left:10% !important;
	opacity:0;
	filter: drop-shadow(-3px -3px 2px rgba(200,200,200,0.2)) drop-shadow(3px 3px 3px rgba(0,0,0,0.2));
}
.shelfN li:nth-child(5) img.sticker {
	left:5% !important;
	opacity:0;
	filter: drop-shadow(-3px -3px 2px rgba(200,200,200,0.2)) drop-shadow(3px 3px 3px rgba(0,0,0,0.2));
}
.shelfN li:nth-child(6) img.sticker {
	left:15% !important;
	opacity:0;
	filter: drop-shadow(-3px -3px 2px rgba(200,200,200,0.2)) drop-shadow(3px 3px 3px rgba(0,0,0,0.2));
}
.shelfN li:nth-child(7) img.sticker {
	left:15% !important;
	opacity:0;
	filter: drop-shadow(-3px -3px 2px rgba(200,200,200,0.2)) drop-shadow(3px 3px 3px rgba(0,0,0,0.2));
}
.shake_once { -webkit-animation-name:shake_once;animation:shake_once 1s linear forwards; }
.shake_repeat { -webkit-animation-name:shake_repeat;animation:shake_repeat 1s linear infinite; }
.shelfN li:nth-child(2) img { /* 두번째 컵 */
	width:37px !important;
	height:auto;
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	bottom:0;
}
.shelfN li:nth-child(3) img { /* 세번째 컵 */
	width:34px !important;
	height:auto;
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	bottom:0;
}
.shelfN li:nth-child(4) img { /* 네번째 컵 */
	width:40px !important;
	height:auto;
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	bottom:0;
}
.shelfN li:nth-child(5) img { /* 다섯번째 컵 */
	width:50px !important;
	height:auto;
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	bottom:0;
}
.shelfN li:nth-child(6) img { /* 여섯번째 컵 */
	width:40px !important;
	height:auto;
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	bottom:0;
}
.shelfN li:nth-child(7) img { /* 일곱번째 컵 */
	width:40px !important;
	height:auto;
	position:absolute;
	left:50%;transform:translate(-50%,0%);
	bottom:0;
}

/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	.shelfN li:nth-child(2) img.sticker {
		left:25% !important;
	}
	.shelfN li:nth-child(4) img.sticker {
		left:25% !important;
	}
	.shelfN li:nth-child(5) img.sticker {
		left:25% !important;
	}
	.shelfN li:nth-child(6) img.sticker {
		left:25% !important;
	}
	.shelfN li:nth-child(7) img.sticker {
		left:25% !important;
	}
}
/* 360px 정도 */
@media (max-width: 375px) {
}
/* 320px 정도 */
@media (max-width: 340px) {
	.section_3N {
		height:50px;
	}
	.shelfN img {
		width:24px;
	}
	.shelfN li:nth-child(2) img { /* 두번째 컵 */
		width:32px !important;
	}
	.shelfN li:nth-child(2) img.sticker { /* in_tobottom2 효과일 때는 꼭 필요함 */
		bottom:0;
	}
	.shelfN li:nth-child(3) img { /* 세번째 컵 */
		width:30px !important;
	}
	.shelfN li:nth-child(4) img { /* 네번째 컵 */
		width:34px !important;
	}
	.shelfN li:nth-child(5) img { /* 다섯번째 컵 */
		width:42px !important;
	}
	.shelfN li:nth-child(6) img { /* 여섯번째 컵 */
		width:32px !important;
	}
	.shelfN li:nth-child(7) img { /* 일곱번째 컵 */
		width:32px !important;
	}
}

/* ========== 아이템 수령 ========== */
/* 전체박스 */
.get_box { 
	position:absolute;
	width:100%;
	top:50%;left:50%;transform:translate(-50%,-50%);
	overflow:hidden;
	text-align:center;

}
/* 아이템 / 원두나 타임 */
.get_itemBox { 
	position:relative;
	width:100%;height:300px;
}
.get_item { 
	position:absolute;
	width:100%;top:0;left:50%;transform:translate(-50%,0%);
	-webkit-animation-name:fadeInUp_item;animation:fadeInUp_item 0.5s ease-in 0.5s forwards;
}
.get_item img {
	width:75%;
}
/* 아이템 / 상점 제품 */
.get_itemBox_co { 
	position:relative;
	width:100%;
	height:370px;
}
.get_item_co { 
	position:absolute;
	width:100%;top:0;left:50%;transform:translate(-50%,0%);
	-webkit-animation-name:fadeInUp_item;animation:fadeInUp_item 0.5s ease-in 0.5s forwards;
	font-size:26px;
	font-weight:bold;
	color:#f5f0e9;
}
.get_item_co_title {
	position:relative;
	height:90px;
}
.get_item_co_title span {
	position:absolute;
	display:inline-block;
	width:90%;
	left:50%;top:50%;
	transform:translate(-50%,-50%);
}
.get_item_co_img {
	position:relative;
	height:250px;
	background:url('/0_v1_img/itemget_square.png') center 0 no-repeat;
	background-size:auto 250px;
}
.get_item_co_img img {
	position:absolute;
	width:100%;top:50%;left:50%;transform:translate(-50%,-50%);
	height:170px;
	width:auto;
}
/* .get_item img */
.get_num img { width:80px;margin-left:-30px; }
.get_num img:nth-child(1) { margin-left:15px; }

@media (min-width: 768px) {
	/* 아이템 / 상점 제품 */
	.get_itemBox_co { 
		height:530px;
	}
	.get_item_co { 
		font-size:34px;
	}
	.get_item_co_title {
		height:100px;
	}
	.get_item_co_title span {
		width:90%;
	}
	.get_item_co_img {
		height:400px;
		background-size:auto 400px;
	}
	.get_item_co_img img {
		height:280px;
	}
}

/* 769px와 1024px 사이 */
@media all and (min-width:768px) and (max-width:1024px) { 
	/* 아이템박스 */
	.get_itemBox { 
		height:420px;
	}
	.get_item img {
		width:450px;
	}
	/* .get_item img */
	.get_num img { width:110px;margin-left:-40px; }
	.get_num img:nth-child(1) { margin-left:15px; }
}
/* 360px 정도 */
@media (max-width: 375px) {
	/* 아이템박스 */
	.get_itemBox { 
		height:260px;
	}
}
/* 320px 정도 */
@media (max-width: 340px) {
	/* 아이템박스 */
	.get_itemBox { 
		height:230px;
	}
	.get_num img { width:70px;margin-left:-25px; }
}

/* ========== 친구초대 ========== */
.friends_inviteN {
	width:90%;
	margin:0 auto 0 auto;
}
.friends_inviteN li {
	float:left;
	width:100%;
	position:relative;
}
.friends_inviteN li:nth-child(1) {
	text-align:center;
	border-bottom:1px solid #e0d4c8;
	padding-bottom:20px;
	margin-bottom:25px;
}
.friends_inviteN li:nth-child(1) img.img_1 {
	width:40%;
	margin-bottom:10px;
}
.friends_inviteN li:nth-child(1) img.img_2 {
	width:90%;
}
.friends_inviteN li:nth-child(1) img.img_3 {
	width:100%;
	margin-top:5px;
}
.friends_inviteN li:nth-child(2) {
	width:37%;
	height:45px;
	font-size:18px;
	font-weight:bold;
	letter-spacing:-0.05em;
}
.friends_inviteN li:nth-child(2) span {
	position:absolute;top:50%;left:0%;transform:translate(0%,-50%);
}
.friends_inviteN li:nth-child(2) img {
	width:28px;
	margin-top:-3px;
}
.friends_inviteN li:nth-child(3) {
	width:63%;
	font-size:19px;
	height:45px;
	line-height:34px;
	font-weight:bold;
	letter-spacing:-0.05em;
	background-color:#f7f3ed;
	border:1px solid #af9c8c;
	padding:0 10px 0 10px;
}
.friends_inviteN li:nth-child(3) input {
	width:120px !important;
	-webkit-tap-highlight-color: transparent;
	outline:none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	border:0; background:#f7f3ed; text-align:center;
}
.friends_inviteN li:nth-child(3) a { /* 복사/만들기 버튼 */
	float:right;
	display:inline-block;
	border-radius:100px;
	font-size:15px;
	font-weight:700;
	color:#f5f0ea;
	width:70px;
	height:30px;
	line-height:30px;
	background-color:#806753;
	text-align:center;
	margin:7px 0 0 0;
}
.friends_inviteN li:nth-child(4) {
	width:70%;
	height:28px;
	line-height:28px;
	font-size:18px;
	font-weight:bold;
	letter-spacing:-0.05em;
	margin-top:10px;
}
.friends_inviteN li:nth-child(4) img {
	width:26px;
	margin-top:-5px;
}
.friends_inviteN li:nth-child(5) {
	width:25%;
	height:28px;
	line-height:28px;
	font-size:18px;
	font-weight:bold;
	letter-spacing:-0.05em;
	text-align:right;
	margin-top:10px;
}
.friends_inviteN li:nth-child(6) {
	width:70%;
	height:28px;
	line-height:28px;
	font-size:18px;
	font-weight:bold;
	letter-spacing:-0.05em;
	margin-top:5px;
}
.friends_inviteN li:nth-child(6) img {
	width:26px;
	margin-top:-5px;
}
.friends_inviteN li:nth-child(7) {
	width:25%;
	height:28px;
	line-height:28px;
	font-size:18px;
	font-weight:bold;
	letter-spacing:-0.05em;
	text-align:right;
	margin-top:5px;
}
.friends_inviteN li:nth-child(8) {
	margin-top:15px;
	margin-bottom:5px;
}
.friends_inviteN li:nth-child(8) a { 
	float:right;
	display:inline-block;
	border-radius:100px;
	font-size:18px;
	font-weight:700;
	color:#f5f0ea;
	width:100%;
	height:50px;
	line-height:46px;
	background-color:#806753;
	text-align:center;
	margin:-5px 0 0 0;
}
.friends_inviteN li:nth-child(9) {
	font-size:12px;
	color:#434343;
	margin-top:10px;
	margin-bottom:20px;
}
@media (max-width: 410px) { 
	.friends_inviteN {
		margin:0px auto 0 auto;
	}
	.friends_inviteN li:nth-child(1) {
		margin-bottom:15px;
		padding-bottom:15px;
	}
	.friends_inviteN li:nth-child(1) img {
		width:85%;
	}
	.friends_inviteN li:nth-child(2) {
		font-size:16px;
		width:40%;
		height:38px;
	}
	.friends_inviteN li:nth-child(2) img {
		width:20px;
		margin-top:-3px;
	}
	.friends_inviteN li:nth-child(3) {
		width:60%;
		height:38px;
		line-height:30px;
		font-size:14px;
		margin-bottom:10px;
		padding:0 8px;
	}
	.friends_inviteN li:nth-child(3) input {
		width:80px !important;
	}
	.friends_inviteN li:nth-child(3) a { 
		font-size:13px;
		width:50px;
		height:30px;
		line-height:28px;
		margin:3px 0 0 0;
	}
	.friends_inviteN li:nth-child(4) {
		font-size:16px;
		margin-bottom:0px;
	}
	.friends_inviteN li:nth-child(4) img {
		width:24px;
		margin-top:-3px;
	}
	.friends_inviteN li:nth-child(5) {
		font-size:16px;
		margin-bottom:0px;
	}
	.friends_inviteN li:nth-child(6) {
		font-size:16px;
		margin-top:0px;
		margin-bottom:10px;
	}
	.friends_inviteN li:nth-child(6) img {
		width:24px;
		margin-top:-3px;
	}
	.friends_inviteN li:nth-child(7) {
		margin-top:0px;
		font-size:16px;
		margin-bottom:10px;
	}
	.friends_inviteN li:nth-child(8) a { 
		font-size:16px;
		height:40px;
		line-height:40px;
	}
	.friends_inviteN li:nth-child(9) {
		font-size:11px;
		color:#434343;
		margin-bottom:10px;
		letter-spacing:-0.07em;
		margin-top:3px;
	}
	.friends_inviteN li:nth-child(8) {
		margin-top:5px;
		margin-bottom:5px;
	}
}

/* 출석체크 */
.attend_box { 
	position:absolute;
	width:90%;
	top:50%;left:50%;transform:translate(-50%,-50%);
	text-align:center;
}
.attend_inbox {
	background-color:#fff;
	padding-top:1px;
}
.attend_round {
	position:relative;
	display:table;
	border:4px solid #4e2c2c;
	border-radius:10px;
	/* padding:55px 15px 15px 15px; */
	padding:95px 15px 45px 15px;
	margin:40px 20px 0 20px;
}
.attend_round li {
	position:relative;
	float:left;
	width:20%;
	text-align:center;
	/* margin:10px 0 0 0; */
	margin:20px 0 0 0;
}
.attend_round img {
	width:80%;
}
.attend_title {
	position:absolute;
	width:125px;
	top:-10px;left:50%;transform:translate(-50%,0);
	text-align:center;
}
.attend_title img {
	width:125px;
}
.king_title {
	position:absolute;
	top:4px;left:50%;transform:translate(-50%,0);
}
.king_title img {
	width:65px;
}
.attend_btn {
	height:60px;
	width:100%;
	/* background:url('/0_v1_img/attend_yellow.png') 0 bottom repeat-x; */
	text-align:center;
}
.attend_btn a {
	display:inline-block;
	background-color:#4e2c2c;
	color:#fff;
	text-align:center;
	font-size:18px;
	font-weight:700;
	width:200px;
	height:50px;
	line-height:50px;
	border-radius:30px;
	margin-top:25px;
}
.btn_gray {
	background-color:#bbbbbb !important;
	color:#e7e7e7 !important;
}
.stamp {
	position:absolute;
	top:0;
	width:100%;
	z-index:600;
}

/* 로그인 */
.qz_login_wrap { position:relative;width:100%;height:100vh;background-color:#f5f0ea;text-align:center;overflow:hidden; }
.loginBox {
	position:absolute;
	width:80%;
	top:50%;left:50%;
	transform:translate(-50%,-50%);
}
.login_img img { width:85%; }
.login_start_txt { font-size:30px;font-weight:700;color:#60271b; }
.login_alert { font-size:16px;color:#5b3a3a;margin-top:30px; }

@media (max-width: 400px) {
	.login_alert { font-size:14px;color:#5b3a3a;margin-top:20px; }
}
/* 회원가입 약관 */
.member_title_logo2 { width:100%;text-align:center;border-bottom:1px solid #fec32c;margin:0 auto; }
.member_title_logo2 img { width:60px;margin:-10px 0 10px 0; }
.member_title_logo3 { width:93%;text-align:center;border-bottom:0px solid #a59281;margin:0 auto; }
.member_title_logo3 img { width:75px;margin:-10px 0 25px 0; }
.member_tarea { height:140px !important;border:1px solid #b2a89e !important; }
@media (max-width: 400px) {
	.frm_info { font-size:12px !important;}
}
@media (max-width: 375px) {
	.member_title_logo2 img { width:50px;margin:-10px 0 10px 0; }
	.member_title_logo3 img { width:60px;margin:5px 0 15px 0; }
	.member_tarea { height:120px !important;border:1px solid #b2a89e !important; }
	.frm_info { font-size:11px !important;}
}
.new_btnBox { padding-bottom:0px !important;display:table;width:100%; }
.new_btnBox li { float:left;width:50%; }
.new_btnBox li:nth-child(1) { text-align:left; }
.new_btnBox li:nth-child(2) { text-align:right; }
.new_btnBox li:nth-child(1) a {  display:inline-block;width:98%;background:#ddd;color:#444;text-decoration:none;vertical-align:middle;border-radius:3px;font-size:14px;font-weight:400;text-align:center !important;height:40px;line-height:40px; }
.new_btnBox li:nth-child(2) button.btn_submit {  display:inline-block;width:98% !important;text-decoration:none;vertical-align:middle;border-radius:3px;background-color:#806753 !important;color:#f5f0ea !important;font-size:14px !important;font-weight:400 !important;text-align:center !important;height:40px !important;line-height:40px !important; }
.member_title_logo { width:100%;text-align:center;border-bottom:1px solid #a69382; }
.member_title_logo img { width:100px;margin:0 0 20px 0; }
.member_txt1 { margin:20px 0 20px 0 !important;font-size:14px !important;color:#5b412d !important; }
@media (max-width: 375px) {
	.new_btnBox { padding-bottom:0px !important;display:table;width:100%; }
	.member_txt1 { font-size:11px !important;letter-spacing:-0.02em; }
}

/* 회원가입 완료 */
.intro_wrap { position:relative;width:100%;height:100vh;background-color:#f5f0e9;overflow:hidden; }
.intro3 { 
	position:absolute;
	width:100%;
	top:50%;left:0%;transform:translate(0%,-50%);
}
/* 상단 텍스트 */
.intro3_txt { position:relative;width:100%; }
.intro3_txt li { width:100%;text-align:center;font-size:20px;font-weight:400;letter-spacing:-0.05em;line-height:130%; }
.intro3_txt li:nth-child(1) { font-size:38px;font-weight:700; }
.intro3_txt li:nth-child(2), .intro3_txt li:nth-child(4), .intro3_txt li:nth-child(6) { margin-top:10px; }
.intro3_txt li:nth-child(3), .intro3_txt li:nth-child(5) { font-size:28px;font-weight:700; }

/* 인트로 1 - 하단 이미지 */  
.intro3_img { position:relative;text-align:center;width:100%;margin-top:20px; }
.intro3_img  img { width:30% !important;-webkit-animation-name:king_smile;animation:king_smile 1s linear infinite; }
.intro3_btn { position:relative;width:100%;text-align:center;margin-top:30px; }
.intro3_btn  img { width:180px !important; }
.attend_close img {
	width:40px;
	margin-top:7px;
}
.coffee_rain {
	position:absolute;
	z-index:500;
	width:100%;
	height:100vh;
	top:0;
}

/* 친구초대 */
.fri_invite_wrap {
	width:620px;
	margin:0 auto;
	text-align:center;
}
.fri_invite_in_1 li {
	font-size:14px;
}
.fri_invite_in_1 li:nth-child(1) {
	margin-top:40px;
}
.fri_invite_in_1 li:nth-child(1) div { /* 커피킹 */
	width:150px;
	height:150px;
	margin:0 auto;
	background:url('/0_v1_img/king_target.png') 0 0 no-repeat;
	background-size:cover;
}
.fri_invite_in_1 li:nth-child(1)  img {
	width:95px;
	margin-top:12px;
	-webkit-animation-name:king_smile;animation:king_smile 1s linear infinite;
}
.fri_invite_in_1 li:nth-child(2) {  /* ...님이 보낸 */
	font-size:20px;
	padding-top:20px;
}
.fri_invite_in_1 li:nth-child(2) span {
	font-weight:bold;
}
.fri_invite_in_1 li:nth-child(3) {  /* 500파이를 받으세요 */
	font-size:30px;
	font-weight:bold;
	padding-top:5px;
}
.fri_invite_in_1 li:nth-child(3) img {
	width:45px;
	margin-top:-10px;
}
.fri_invite_in_1 li:nth-child(3) span {
	color:#bf3900;
}
.fri_invite_in_1 li:nth-child(4) { /* ~ 받을수 있어요 */
	font-size:18px;
	line-height:28px;
	font-weight:bold;
	padding-top:25px;
}
.fri_invite_in_1 li:nth-child(4) br.br_mo {
	display:none;
}
.fri_invite_in_1 li:nth-child(5) { /* 상품들 사진 */
	border-top:0px solid #d8d8d8;
	border-bottom:0px solid #d8d8d8;
	margin-top:35px;
	padding:20px 0 0 0;
}
.fri_invite_in_1 li:nth-child(5) img {
	width:120px;
}

.fri_invite_in_2 {
	width:450px;
	margin:0 auto;
}
.fri_invite_in_2 li {
	font-size:14px;
	letter-spacing:-0.02em;
}
.fri_invite_in_2 li:nth-child(1) { /* 친구의 초대코드 */
	text-align:left;
	background-color:#fff;
	border-radius:30px;
	height:55px;
	font-size:16px;
	letter-spacing:-0.04em;
	font-weight:bold;
	line-height:52px;
	padding:0 10px 0 35px;
	margin:50 0 0 0;
}
.fri_invite_in_2 li:nth-child(1) a {  /* 친구의 초대코드 '복사'버튼 */
	display:inline-block;
	float:right;
	background-color:#52413e;
	border-radius:30px;
	font-size:15px;
	font-weight:bold;
	height:40px;
	line-height:41px;
	margin-top:7px;
	padding:0 15px;
	color:#f5f0ea;
}
.fri_invite_in_2 li:nth-child(2) { /* 초대코드 입력하고 가입하기 */
	margin-top:20px;
}
.fri_invite_in_2 li:nth-child(2) img {
	width:49%;
}
.fri_invite_in_2 li:nth-child(3) { /* 이용안내 */
	margin-top:60px;
	text-align:left;
	line-height:24px;
}
.fri_invite_in_2 li:nth-child(3) span {
	display:inline-block;
	margin-bottom:10px;
	font-size:16px;
	font-weight:bold;
}
.fri_invite_in_2 li:nth-child(4) { /* 초대코드 입력방법 타이틀 */
	margin-top:60px;
	text-align:left;
	line-height:24px;
	font-size:16px;
	font-weight:bold;
}
.fri_invite_in_2 li:nth-child(5) {
	margin-top:20px;
}
.fri_invite_in_2 li:nth-child(5) img {
	width:100%;
}

@media (max-width: 768px) {
	.fri_invite_wrap {
		width:90%;
	}
	.fri_invite_in_1 li:nth-child(2) {  /* ...님이 보낸 */
		font-size:18px;
		padding-top:20px;
	}
	.fri_invite_in_1 li:nth-child(3) {  /* 500파이를 받으세요 */
		font-size:26px;
	}
	.fri_invite_in_1 li:nth-child(3) img {
		width:34px;
		margin-top:-10px;
	}
	.fri_invite_in_1 li:nth-child(4) { /* ~ 받을수 있어요 */
		font-size:15px;
		line-height:24px;
		padding-top:10px;
		letter-spacing:-0.05em
	}
	.fri_invite_in_1 li:nth-child(5) { /* 상품들 사진 */
		margin-top:10px;
		padding:15px 0;
	}
	.fri_invite_in_1 li:nth-child(5) img {
		width:70px;
	}

	.fri_invite_in_2 {
		width:100%;
	}
	.fri_invite_in_2 li {
		font-size:12px;
	}
	.fri_invite_in_2 li:nth-child(1) { /* 친구의 초대코드 */
		margin:20 0 0 0;
	}
	.fri_invite_in_2 li:nth-child(2) { /* 초대코드 입력하고 가입하기 */
		margin-top:15px;
	}
	.fri_invite_in_2 li:nth-child(3) { /* 이용안내 */
		margin-top:30px;
	}
	.fri_invite_in_2 li:nth-child(4) { /* 초대코드 입력방법 타이틀 */
		margin-top:30px;
	}
}

@media (max-width: 380px) {
	.fri_invite_in_1 li:nth-child(3) {  /* 500파이를 받으세요 */
		font-size:20px !important;
	}
	.fri_invite_in_1 li:nth-child(3) img {
		width:32px;
		margin-top:-10px;
	}
	.fri_invite_in_1 li:nth-child(4) { /* ~ 받을수 있어요 */
		font-size:14px;
		line-height:22px;
		padding-top:7px;
	}
	.fri_invite_in_1 li:nth-child(4) br.br_mo {
		display:block;
	}
	.fri_invite_in_1 li:nth-child(5) img {
		width:60px;
	}
	.fri_invite_in_2 li {
		font-size:11px;
	}
	.fri_invite_in_2 li:nth-child(1) { /* 친구의 초대코드 */
		font-size:14px;
		padding:0 10px 0 18px;
		margin:20 0 0 0;
	}
	.fri_invite_in_2 li:nth-child(1) a {  /* 친구의 초대코드 '복사'버튼 */
		font-size:14px;
	}
	.fri_invite_in_2 li:nth-child(2) { /* 초대코드 입력하고 가입하기 */
		margin-top:15px;
	}
	.fri_invite_in_2 li:nth-child(2) img {
		width:45%;
	}
}
#main_wave_conut_1 { width:90%;margin:0 auto;height:70px; }
#main_wave_conut_1 div { width:25%;  }
#main_wave_conut_1 img { width:100%;height:100%; }

@media (min-width: 461px) {
	#main_wave_conut_1 { height:110px !important; }
}
@media (max-width: 460px) {
	#main_wave_conut_1 { height:80px !important; }
}
@media (max-width: 400px) {
	#main_wave_conut_1 { height:65px !important; }
}

.member_editBox {   /* 배경음 등 라운드 박스 */
	width:92%;
	margin:0 auto;
	display:table;
	border:1px solid #b2a89f;
	border-radius:10px;
	padding:20px 20px;
}
.member_edit  {
	width:100%;
	margin:0 auto;
	display:table;
}
.member_edit li {
	position:relative;
	float:left;
	height:45px;
	border-bottom:1px solid #eeeeee;
	line-height:42px;
}
.member_edit li:nth-child(odd) {
	width:30%;
	font-size:16px;
	font-weight:bold;
}
.member_edit li:nth-child(6) input {
	height:34px;
}
.member_edit li:nth-child(even) {
	font-size:14px;
	width:70%;
}
.member_edit li.hei_long {
	height:80px;
}
.member_edit span.member_edit_info {
	position:absolute;
	display:inline-block;
	margin-top:-16px;
	font-size:12px;
}
.member_edit li:last-child {
	width:100%;
	text-align:center;
	border-bottom:0px solid #eeeeee;
}
.member_edit button.mb_edit_btn {
	display:inline-block;
	width:85px;height:32px;
	background-color:#ae9d8d;
	border:1px solid #75695d;
	text-align:center;
	font-size:13px; 
	color:#fff;font-weight:700;
	border-radius:20px;
	line-height:30px;
	margin:0 3px;
}
.member_edit button.mb_cancel_btn {
	display:inline-block;
	width:85px;height:32px;
	background-color:#9e9e9e;
	border:1px solid #666666;
	text-align:center;
	font-size:13px; 
	color:#fff;font-weight:700;
	border-radius:20px;
	line-height:30px;
	margin:0 3px;
}
@media (max-width: 400px) {
.member_edit li {
		height:40px;
		line-height:30px;
	}
.member_edit li:nth-child(odd) {
		width:28%;
		font-size:13px;
	}
.member_edit li:nth-child(even) {
		font-size:12px;
		width:72%;
	}
	.member_edit li.hei_long {
		height:70px;
	}
	.member_edit span.member_edit_info {
		margin-top:-12px;
	}
	.member_edit li:last-child {
		width:100%;
		text-align:center;
		border-bottom:0px solid #eeeeee;
	}
}

/* 회원가입 약관 */
.confirm_logo { width:100%;text-align:center;margin:25px 0 15px 0; }
.confirm_logo img { width:100px;margin:30px 0; }

.confirm_txt { width:88%;border-top:2px solid #d4ccc5;margin:0 auto;font-size:18px;padding:30px 0 0 0;text-align:center; }
.confirm_txt span { font-weight:700; }
span.confirm_nick { display:inline-block;border:2px solid #5a4941; }
.confirm_box {  width:85%;margin:0 auto 30px auto !important;border-bottom:2px solid #d4ccc5;display:table; }
.confirm_box li { float:left; }
.confirm_box li:nth-child(1) { width:25%;font-size:16px;font-weight:700;line-height:100%;padding:26px 0 0 10px; }
.confirm_box li:nth-child(2) { width:75%;padding:10px 0 10px 10px; }
.confirm_box li:nth-child(2) span {  width:100%;padding:10px;height:45px !important; }

.confirm_btnbox {  width:88%;margin:0 auto !important; }
.confirm_btnbox li { float:left; }
.confirm_btnbox li:nth-child(1) { width:50%;text-align:right; }
.confirm_btnbox li:nth-child(2) { width:50%;text-align:left; }
.btn_member_cancel { 
	display:inline-block;
	width:85px;height:32px;
	background-color:#9e9e9e;
	border:1px solid #666666;
	text-align:center;
	font-size:13px; 
	color:#fff;font-weight:700;
	border-radius:20px;
	line-height:30px;
	margin:0 3px;
}
.btn_member_out { 
	display:inline-block;
	width:85px;height:32px;
	background-color:#ae9d8d;
	border:1px solid #75695d;
	text-align:center;
	font-size:13px; 
	color:#fff;font-weight:700;
	border-radius:20px;
	line-height:30px;
	margin:0 3px;
}
.item_popBox {
	position:absolute;
	top:50%;left:50%;transform:translate(-50%,-50%);
	width:80%;
	margin:0 auto;
}
.item_pop_1 {
	background-color:#efe8e0;
	border-radius:50px;
}
.item_pop_1 li {
	text-align:center;
}
.item_pop_1 li:nth-child(1) img {
	width:50%;
	margin:30px 0 10px 0;
}
.item_pop_1 li:nth-child(2) {
	font-size:30px;
	font-weight:bold;
	color:#5a4940;
}
.item_pop_1 li:nth-child(3) {
	font-size:15px;
	color:#5a4940;
}
.item_pop_1 li:nth-child(4)  a {
	display:inline-block;
	width:220px;
	height:40px;
	line-height:38px;
	border-radius:30px;
	margin:60px auto 35px 0;
	background-color:#5a4941;
	color:#f5f0ea;
	font-size:15px;
}
.item_pop_1 li:nth-child(4)  a > img {
	width:24px;
	margin:-5px 0 0 5px;
}
.item_pop_2 {
	text-align:center;
}
.item_pop_2 img {
	width:35px;
	margin:15px auto 0 auto;
}

/* 심사용 */
.main_box_ss { /* 전체 설정박스의 위치 설정 */
	position:absolute;top:52%;left:50%;
	transform:translate(-50%,-50%);
	width:100%;
}
.mainKing_ss { /* 맨위 KING 사이즈 */
	width:85px;
	margin:0 auto 15px auto;
	text-align:center;
}
.mainKing_ss img {
	width:100%;
}
.maincafe_ss {
	width:100%;
	display:table;
	background-color:#e9e1d7;
}
.maincafe_title_ss {
	display:table;
	width:75%;
	margin:25px auto 20px auto;
}
.maincafe_title_ss li {
	float:left;
	width:50%;
}
.maincafe_title_ss li:nth-child(1) {
	color:#3c2010;
	font-size:17px;
	font-weight:bold;
}
.maincafe_title_ss li:nth-child(2) { /* 추천카페 더보기 */
	color:#a29081;
	text-align:right;
	font-size:13px;
	line-height:30px;
}
/* 메인 - 카페 리스트 */
.maincafe_list_ss {
	display:table;
	width:85%;
	margin:0 auto 20px auto;
}
.maincafe_info_ss {
	display:table;
	float:left;
	width:38%;
	margin:0 6%;
	text-align:center;
	color:#8d7766;
	font-size:10px;
}
.maincafe_info_ss img.cafeImg {
	width:100%;
	border-radius:10px;
	margin-bottom:5px;
}
.maincafe_info_ss img.cafeStar {
	width:12px;
	margin:0 1px;
}
.maincafe_info_ss span {
	color:#70523c;
	font-size:14px;
	letter-spacing:-0.05em;
	font-weight:bold;
}
/* 메인 - 카페 리스트 */

/* 서브 - 카페 리스트 */
.maincafe_list_sss {
	display:table;
	width:90%;
	margin:0 auto 20px auto;
}
.maincafe_info_sss {
	display:table;
	float:left;
	width:39%;
	margin:0 5%;
	text-align:center;
	color:#8d7766;
	font-size:10px;
}
.maincafe_info_sss img.cafeImg {
	width:100%;
	border-radius:10px;
	margin-bottom:5px;
}
.maincafe_info_sss img.cafeStar {
	width:12px;
	margin:0 1px;
}
.maincafe_info_sss span {
	color:#70523c;
	font-size:14px;
	letter-spacing:-0.06em;
	font-weight:bold;
}
/* 서브 - 카페 리스트 */
.mainBanner_ss {
	width:90%;
	margin:20px auto 15px auto;;
}
.mainBanner_ss li {
	float:left;
	width:33.333333333%;
	text-align:center;
	border-right:1px solid #e5dfda;
	padding:3px 0;
	color:#70523c;
	font-size:13px;
	font-weight:bold;
}
.mainBanner_ss li:nth-child(3) {
	border-right:0 !important;
}
.mainBanner_ss img {
	width:35px;
	margin-top:8px;
}
@media (max-width: 350px) {
	.mainKing_ss { /* 맨위 KING 사이즈 */
		width:70px;
	}
	.mainBanner_ss {
		width:90%;
		margin:15px auto 10px auto;;
	}
	.maincafe_info_ss span {
		font-size:12px;
	}
	.maincafe_info_sss span {
		font-size:12px;
	}
}

/* ===== 하단 네비 ===== */
.navi_ss {
	position:fixed;
	background-color:#e0d4c8;
	bottom:0;
	width:100%;
	height:70px;
}
.navi_ss li {
	float:left;
	width:20%;
	text-align:center;
	padding:15px 0 0 0;
	color:#735843;
	font-weight:bold;
	opacity:0.45;
}
.navi_ss img {
	width:30px;
	margin-bottom:1px;
}
.navi_ss li.on {
	opacity:1;
}
.cafeDbox {
	width:85%;
	margin:0 auto;
	height:calc(100% - 150px);
	overflow:hidden;
	overflow-y:scroll;
	text-align:center;
}
.cafeCon_1 li:nth-child(1) {
	font-size:22px;
	font-weight:bold;
	color:#70523c;
	padding:10px 0 0 0;
}
.cafeCon_1 li:nth-child(3) {
	font-size:16px;
	color:#70523c;
	padding:5px 0 0 0;
}
.cafeCon_1 li:nth-child(4) {
	font-size:14px;
	color:#70523c;
	padding:0;
}
.cafeCon_1 li:nth-child(2) img {
	width:18px;
}
.cafeCon_2 {
	margin-top:10px;
}
.cafeCon_2 li {
	text-align:left;
	background:url('/0_v1_img/icon_smile.png') 0 3px no-repeat;
	background-size:14px;
	padding:0 0 3px 20px;
	color:#7d5f47;
	font-size:12px;
}
.cafeCon_2 li:nth-child(1){
	background:none;
	padding:0 0 10px 0;
}
.cafeCon_2 li:nth-child(1) img {
	width:40px;
}
.cafeCon_3 {
	width:100%;
	text-align:center;
	margin-top:20px;
}
.cafeCon_3 img {
	width:90%;
	margin-bottom:10px;
}
.cafeCon_4 {
	width:100%;
	margin-top:30px;
}
.cafeCon_4 li:nth-child(1){
	padding:0 0 10px 0;
	text-align:left;
}
.cafeCon_4 li:nth-child(1) img {
	width:40px;
}
.cafeCon_4 li:nth-child(2) {
	width:100%;
	height:200px;
	overflow:hidden;
	margin-bottom:10px;
}

button.btn_clogin {display:inline-block;height:35px;border-radius:0;line-height:33px;font-size:12px;border:0;background:#a29587;color:#fff;text-decoration:none;vertical-align:top}
/* 회원가입 화면 버튼 등 */

/* 공통 */
.txt_cDb { color:#59493f; }
.mg_t10 { margin-top:10px; }
.opa_4 { opacity:0.4; }
.smile { -webkit-animation-name:smile;animation:smile 0.5s linear forwards; }
.swing { -webkit-animation-name:swing;animation:swing 0.5s linear forwards; }
.swing_keep { -webkit-animation-name:swing;animation:swing 0.5s linear infinite; }
.king_smile { -webkit-animation-name:king_smile;animation:king_smile 0.5s linear infinite; }
.king_smile_once { -webkit-animation-name:king_smile;animation:king_smile 0.7s linear forwards; }
.king_smile_login { -webkit-animation-name:king_smile;animation:king_smile 1s linear infinite; }
.whipIn_2 { -webkit-animation-name:whipIn_2;animation:whipIn_2 0.5s linear forwards; }
.flt_right { float:right; }

iframe.iframe_pop { position:absolute;top:0;left:0;z-index:1000;width:100%;height:100vh;border:0;background-color:rgba(0,0,0,0); }