@charset "UTF-8";
/*
    [제목] 핀업 뷰 페이지 CSS
    [생성일] 2020-04-17
    [내용] 핀업 뷰 페이지 에 있는 레이아웃 스타일을 포함하고 있음.
    [비고] CSS 작성시 핀업 디자인팀 내부에 규정하고 있는 CSS 작성 규칙를 준수하여 작성할 것.
*/

/*-- S : 페이지 스타일 --*/
/*이벤트*/
.board_view .cm_tit { margin-bottom:30px; overflow:hidden; }
.board_view.event_view .cm_tab.text_style { float:right; margin-top:5px; }
.board_view.event_view .btn_list { float:right; width:64px; height:35px; margin:30px 0 0 15px ; font-size:15px; line-height:33px; text-align:center; }


/*고객센터*/
.board_view.help_list .btn_list { float:right; width:64px; height:35px; margin:30px 0 0 15px ; font-size:15px; line-height:33px; text-align:center; }
.board_view.help_list .cm_table_wrap tbody td div { width:1148px; overflow:hidden; }
.board_view.help_list .cm_table_wrap tbody td div a { display:inline; word-break:break-all; }


/*회원가입, 아이디/비밀번호 찾기, 회원 정보 수정, 회원탈퇴*/
.accounts_view { width:940px; float:left; }
.accounts_view .contents01{ width:940px; padding:20px 0 0 0; }
.accounts_view .cm_tit { display:block; width:auto; margin-bottom:30px; clear:left; }
.accounts_view .cm_subtit { display:block; width:auto; margin-bottom:30px; clear:left; }
.accounts_view .cm_txt { display:block; }
.accounts_view .line { display:block; width:100%; height:1px; margin-top:20px; border:0; background:#ddd; }

.accounts_view .cm_bn { height:auto; }
.accounts_view .cm_bn  a { display:block; width:100%; height:auto; }
.accounts_view .cm_table_wrap { width:770px; margin:50px auto 0 auto; border:0; }
.accounts_view .cm_table_wrap tbody { border:0; }
.accounts_view .cm_table_wrap tbody th { padding:12px 0 0 0; border:0; background:#fff; font:500 17px 'Noto Sans KR'; line-height:30px!important; vertical-align:top; text-align:left; letter-spacing:-1px; }
.accounts_view .cm_table_wrap tbody td { padding:10px 0; border:0; }
.accounts_view .cm_table_wrap tbody td .cm_smtxt { display:block; margin-top:5px; }
.accounts_view .cm_table_wrap tbody td .cm_form { margin:0; }
.accounts_view .cm_table_wrap tbody td .timer { display:inline; width:35px; margin:0 10px; color:#666; text-align:center; }
.accounts_view .cm_table_wrap tbody td .btn_resubmit { display:inline-block; width:95px; height:45px; border:1px solid #ddd; border-radius:5px; color:#555; font-size:15px; line-height:45px;}
.accounts_view .cm_table_wrap tbody td .btn_submit { display:block; float:right; width:140px; height:45px; margin-left:10px; border-radius:5px; font-size:15px; line-height:45px;}
.accounts_view .cm_table_wrap tbody td .box_txt { display:inline-block; width:11px; height:45px; text-align:center; line-height:40px; vertical-align:middle; overflow:hidden; }
.accounts_view .cm_table_wrap tbody td input[type=checkbox] + label { margin:0; }
.accounts_view .cm_table_wrap tbody td input[type=radio] + label { margin:0; }
/*
.accounts_view input[type=checkbox] { display:none; }
.accounts_view input[type=checkbox] + label { position:relative; display:inline-block; padding-left:28px; font-size:13px; line-height:20px; box-sizing:border-box; }
.accounts_view input[type=checkbox] + label:before { position:absolute; content:''; top:1px; left:0; width:24px; height:24px; background:url('/images/Common/ic-check.png') no-repeat 0 0; }
.accounts_view input[type=checkbox]:checked + label:before { background-position:0 -40px; }
.accounts_view input[type=checkbox] + label + input[type=checkbox] + label { margin-left:20px !important; }

.accounts_view input[type=radio] { display:none; }
.accounts_view input[type=radio] + label { position:relative; display:inline-block; padding-left:28px; font-size:13px; line-height:20px; box-sizing:border-box; }
.accounts_view input[type=radio] + label:before { position:absolute; content:''; top:1px; left:0; width:18px; height:18px; background:url('/images/Common/ic-check.png') no-repeat -18px 0; }
.accounts_view input[type=radio]:checked + label:before { background-position:-18px -18px; }
.accounts_view input[type=radio] + label + input[type=radio] + label { margin-left:50px }
*/
.accounts_view input[type=checkbox] { display:none; }
.accounts_view input[type=checkbox] + label { display:inline-block; position:relative; padding-left:34px; color:#777; font-size:15px; line-height:24px; overflow:hidden; cursor:pointer; }
.accounts_view input[type=checkbox] + label:before { display:block; content:''; position:absolute; top:0; left:0; width:24px; height:24px; background:url('/images/Common/ic-check.png') no-repeat; }
.accounts_view input[type=checkbox]:checked + label { color:#222; }
.accounts_view input[type=checkbox]:checked + label:before { background-position:0 -24px; }

.accounts_view input[type=checkbox].sm_style + label { padding-left:21px; font-size:13px; line-height:16px; cursor:pointer; }
.accounts_view input[type=checkbox].sm_style + label:before { width:16px; height:16px; background:url('/images/Common/ic-smallcheck.png') no-repeat;  }
.accounts_view input[type=checkbox].sm_style:checked + label:before { background-position:0 -16px; }


.accounts_view input[type=radio] { display:none; }
.accounts_view input[type=radio] + label { display:inline-block; position:relative; padding-left:34px; color:#777; font-size:15px; line-height:24px; overflow:hidden; cursor:pointer; }
.accounts_view input[type=radio] + label:before { display:block; content:''; position:absolute; top:0; left:0; width:24px; height:24px;  background:url('/images/Common/ic-radio.png') no-repeat; }
.accounts_view input[type=radio]:checked + label { color:#222; }
.accounts_view input[type=radio]:checked + label:before { background-position:0 -24px; }

.accounts_view input[type=radio].sm_style + label { padding-left:21px; font-size:13px; line-height:20px; }
.accounts_view input[type=radio].sm_style + label:before { top:2px; width:16px; height:16px; background:url('/images/Common/ic-smallradio.png') no-repeat; }
.accounts_view input[type=radio].sm_style:checked + label:before { background-position:0 -16px; }

.accounts_view .box_flex {  display:-webkit-box; display:-ms-flexbox; display:flex; flex-wrap:nowrap; gap:0 10px; width:570px; }
.accounts_view .box_flex  .cm_form.text01 { -webkit-flex:1 1 50%; -ms-flex:1 1 50%; flex:1 1 50%; height:45px; }

.accounts_view .box_chk { color:#666; font-size:14px; line-height:30px; vertical-align:middle; }
.accounts_view .box_chk .box_agreement { display:inline-block; margin-right:10px; }
.accounts_view .box_chk .box_agreement input[type=checkbox] { margin-top:-2px; vertical-align:middle; }
.accounts_view .box_chk .box_agreement input + label{ cursor:pointer; }

.accounts_view .box_chk .box_agreement input[type=radio] { margin-top:-2px; vertical-align:middle; }
.accounts_view .box_chk .box_agreement input[type=radio] + label { color:#666; font-size:14px; }
.accounts_view .box_chk .box_agreement label.on_write { display:inline-block; width:90px; }

.accounts_view .box_info { margin-top:5px; color:#999; font-size:13px; font-weight:normal; line-height:20px; letter-spacing:-1px; }
.accounts_view .btn_view, .accounts_wrap .btn_out { display:inline-block; padding:0; color:#999; font-size:13px; }
.accounts_view .btn_view .im, .accounts_wrap .btn_out .im{ margin:-1px 0 0 2px; }

.accounts_view .argeement_wrap  { margin-top:50px; padding:20px 115px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; box-sizing:border-box; }
.accounts_view .argeement_wrap + .argeement_wrap { border-top:0; }
.accounts_view .argeement_wrap .box_agreement{ display:block; height:30px; box-sizing:border-box; }
.accounts_view .argeement_wrap .box_agreement input[type=checkbox] + label .btn_view { margin-left:15px; }

.accounts_view .btn_join { display:block; width:348px; height:50px; margin:50px auto 80px auto; border-radius:10px; font-size:18px; line-height:50px; }
.accounts_view .btn_leave { display:block; width:348px; height:50px; margin:50px auto 0 auto; border-radius:10px; font-size:18px; line-height:50px; }
.accounts_view .btn_kakao { display:block; width:170px; height:45px; border-radius:5px; background:#fee500; color:#222; font-size:15px; font-weight:bold; line-height:45px; }
.accounts_view .btn_kakao .im { margin:0 6px 0 0; font-size:100%; vertical-align:middle; }

.accounts_view .box_noti { position:relative; padding:25px; margin-top:20px; background:#f8f8f8; box-sizing:border-box; }
.accounts_view .box_noti .cm_txt { display:block; width:100%; margin-bottom:10px; font-size:23px; text-align:center; }
.accounts_view .box_noti .txt { display:block; margin-bottom:15px; font:600 17px 'Noto Sans KR'; }
.accounts_view .box_noti .smtxt { display:block; font:500 14px/22px 'Noto Sans KR'; }
.accounts_view .box_noti .btn_connect { position:absolute; top:25px; right:50px; width:140px; height:40px; border-radius:8px; background:#222; background-image:-webkit-linear-gradient(top bottom, #454545 0%, #222 100%); background-image:-webkit-gradient(linear, left top, left bottom, from(#454545), to(#222)); background-image:linear-gradient(to bottom,#454545,#222); font-size:14px; text-align:center; line-height:40px;}
.accounts_view .box_noti .btn_connect.gr_navy {  background:#2e2e72; background-image:-webkit-linear-gradient(top bottom, #2e2e72 0%, #222259 100%); background-image:-webkit-gradient(linear, left top, left bottom, from(#2e2e72), to(#222259)); background-image:linear-gradient(to bottom,#2e2e72,#222259);}

.accounts_view .box_coupon_info .tit { display:block; margin-bottom:10px; font-weight:500; font-size:17px; }
.accounts_view .box_coupon_info .desc { color:#555; font-size:14px; line-height:normal; }

.accounts_view.join_account { float:none;}
.accounts_view.join_account .contents01 { width:940px; min-height:calc(100vh - 367px); }
.accounts_view.join_account .sns_wrap { width:100%; height:auto; border-bottom:1px solid #ddd; overflow:hidden; }
.accounts_view.join_account .cm_tit { float:left; width:auto; }
.accounts_view.join_account .cm_btn_sns { float:right; margin:0 0 20px 0; clear:right; }
.accounts_view.join_account .cm_btn_sns .btn_sns { height:45px; padding:0; border-radius:5px; }
.accounts_view.join_account .cm_btn_sns .btn_sns.circle { float:left; width:100px; height:100px; margin:40px 0 0 45px; border-radius:50%; background:url('/images/Common/btn_sns_join.png') no-repeat 0 0; overflow:hidden; }
.accounts_view.join_account .cm_btn_sns .btn_sns.circle a { display:block; width:100%; height:100%; }
.accounts_view.join_account .cm_btn_sns .btn_sns.circle:nth-child(1) { margin-left:0; }
.accounts_view.join_account .cm_btn_sns .btn_sns.circle:nth-child(2) { background-position: -100px 0; }
.accounts_view.join_account .cm_btn_sns .btn_sns.circle:nth-child(3) { background-position: -200px 0; }
.accounts_view.join_account .cm_btn_sns .btn_sns.circle:nth-child(4) { background-position: -300px 0; }

.accounts_view.join_account .box_btn { text-align:center; }
.accounts_view.join_account .box_btn a { display:inline-block; width:290px; height:60px; margin:0 10px; font-size:23px; font-weight:600; line-height:60px; }


.accounts_view.find_account { float:none; margin:0 auto; }
.accounts_view.find_account .contents01{ padding:0 0 80px 0; }
.accounts_view.find_account .cm_tit { margin:135px 0 0 0; }
.accounts_view.find_account .cm_tab { width:100%; margin-top:50px; }
.accounts_view.find_account .cm_table_wrap { width:600px; }

.accounts_view.member_info .btn_save { display:block; width:348px; height:50px; margin:50px auto 0 auto; border-radius:10px; font-size:18px; line-height:50px; }
.accounts_view.member_info .cm_btn_sns { width:100%; }
.accounts_view.member_info .cm_btn_sns li { float:left; width:135px; height:45px; padding:0; margin-right:10px; }
.accounts_view.member_info .cm_btn_sns li:last-child { margin-right:0; }
.accounts_view.member_info .cm_btn_sns li .btn_sns { display:block; width:100%; height:100%; border-radius:8px; text-align:center; overflow:hidden; }
.accounts_view.member_info .cm_btn_sns li .btn_sns .cm_smtxt { display:block; margin-top:20px; }
.accounts_view.member_info .cm_filter_wrap.block02 { margin:30px auto; }
.accounts_view.member_info .cm_filter_wrap.block02 .cm_subtit{ width:770px; padding:10px 0; margin:0 auto; cursor:pointer; }
.accounts_view.member_info .cm_filter_wrap.block02 .box_detail { width:770px; padding-bottom:30px; margin:0 auto; border-top:1px solid #ddd; }
.accounts_view.member_info .cm_filter_wrap.block02 .box_detail .btn_save { margin-top:20px; }
.accounts_view.member_info .cm_filter_wrap.block02 .box_detail input[type=radio] + label { margin-right:20px; }
.accounts_view.member_info .cm_filter_wrap.block02 .cm_table_wrap { margin-top:30px; }
.accounts_view.member_info .cm_filter_wrap.block02 .cm_table_wrap th,
.accounts_view.member_info .cm_filter_wrap.block02 .cm_table_wrap td { background-color:transparent; }
.accounts_view.member_info .cm_filter_wrap.block02 .cm_table_wrap td.birth .cm_form_wrap{ width:245px; }
.accounts_view.member_info .cm_filter_wrap.block02 .cm_table_wrap td.birth .text01{ text-align:center; padding-right:30px; }
.accounts_view.member_info .cm_filter_wrap.block02 .cm_table_wrap td.birth .cm_btn_ic { right:10px; }

.accounts_view.member_info .cm_filter_wrap.block02 .cm_table_wrap td.address input { margin-bottom:10px; }
.accounts_view.member_info .cm_filter_wrap.block02 .cm_table_wrap td.address .box_info { margin-top:0px; }

.accounts_view.member_info .box_btn { width:100%; height:47px; padding-right:85px; margin:50px auto 0 auto; background:#f8f8f8; text-align:right; line-height:47px; box-sizing:border-box; }

.accounts_view.member_leave .box_noti { padding:0 85px; margin-top:50px; box-sizing:border-box; }
.accounts_view.member_leave .box_noti .cm_txt { text-align:left; }
.accounts_view.member_leave .box_info { margin-top:30px; font-size:14px; line-height:23px; }
.accounts_view.member_leave .box_btn { width:100%; height:47px; padding-left:85px; margin:50px auto 0 auto; background:#f8f8f8; text-align:left; line-height:47px; box-sizing:border-box; }
.accounts_view.member_leave .box_btn .agreement { margin-right:10px; }
.accounts_view.member_leave .box_btn .agreement + label { font-size:17px; }
.accounts_view.member_leave .cm_table_wrap .cm_form.textarea { margin-top:10px; height:110px; }


/*휴면계정 해제*/
.accounts_view.quiescence_view { float:none; position:relative; margin:0 auto; }
.accounts_view.quiescence_view .loading_wrap { display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(255,255,255,0.5); overflow:hidden; z-index:10; }
.accounts_view.quiescence_view .loading_wrap .loading_img { position:relative; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:100px; height:101px; }

.accounts_view.quiescence_view .contents01 { width:940px; margin-bottom:120px }

.accounts_view.quiescence_view .box_logo { overflow:hidden; }
.accounts_view.quiescence_view .box_logo img { display:block; float:left; }
.accounts_view.quiescence_view .box_logo .tit { display:block; float:left; font:700 30px ' Noto Sans KR'; }
.accounts_view.quiescence_view .box_logo .txt { display:block; padding-top:20px; font:500 16px/22px 'Noto Sans KR'; clear:both; }

.accounts_view.quiescence_view .box_means { margin-top:50px; }
.accounts_view.quiescence_view .box_means .means_detail { border-top:2px solid #ddd; }
.accounts_view.quiescence_view .box_means .means_detail .summary { position:relative; padding:8px 30px; border-bottom:1px solid #ddd; font-size:20px; font-weight:600; overflow:hidden; }
.accounts_view.quiescence_view .box_means .means_detail .summary small { display:block; font-size:15px; font-weight:500; }
.accounts_view.quiescence_view .box_means .means_detail .summary .im { position:absolute; right:20px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); font-size:90%; }

.accounts_view.quiescence_view .box_means .means_detail .cont { display:none; padding:50px 85px; overflow:hidden; }
.accounts_view.quiescence_view .box_means .means_detail:last-child .cont { border-bottom:1px solid #ddd; }
.accounts_view.quiescence_view .box_means .means_detail .cont .cm_table_wrap { margin-top:0; }
.accounts_view.quiescence_view .box_means .means_detail .cont p { font:500 16px/22px 'Noto Sans KR'; }
.accounts_view.quiescence_view .box_means .means_detail .cont .cm_btn_line { width:240px; height:45px; margin-top:20px; border-radius:10px; font-size:18px; line-height:43px; }
.accounts_view.quiescence_view .box_means .means_detail .cont .cm_btn_line { width:240px; height:45px; margin-top:20px; border-radius:10px; font-size:18px; line-height:43px; }
.accounts_view.quiescence_view .box_means .means_detail .cont .cm_subtit { margin-bottom:20px; font-weight:600; }
.accounts_view.quiescence_view .box_means .means_detail .cont .box_noti { border-radius:10px; background:#f8f8f8; }
.accounts_view.quiescence_view .box_means .means_detail .cont .box_noti b { display:inline-block; margin-bottom:5px; font-size:18px; font-weight:600; }

.accounts_view.quiescence_view .box_means .means_detail:hover{ border-top:2px solid #2e2e72; }
.accounts_view.quiescence_view .box_means .means_detail.on { border-top:2px solid #2e2e72; }
.accounts_view.quiescence_view .box_means .means_detail.on .cont { display:block; }
.accounts_view.quiescence_view .box_noti .smtxt{ font-size:17px; line-height:26px; text-align:center; }

.accounts_view.quiescence_view .btn_move { display:block; width:348px; height:50px; margin:50px auto 80px auto; border-radius:10px; font-size:18px; line-height:50px; }
.accounts_view.quiescence_view .box_btn { display:block; width:520px; height:50px; margin:80px auto; overflow:hidden; }
.accounts_view.quiescence_view .box_btn .btn_change { float:left; width:250px; height:50px; margin-right:20px; border-radius:10px; font-size:18px; line-height:50px; }
.accounts_view.quiescence_view .box_btn .btn_change:last-of-type { margin-right:0; }


/*회원가입*/
.join_view { min-height:calc(100vh - 466px); }
.join_view .contents01 { width:820px; padding:50px 0 80px; margin:0 auto; }

.join_view .box_noti { position:relative; padding:25px; margin-top:20px; background:#f8f8f8; border-radius:10px; box-sizing:border-box; }
.join_view .box_noti .btn_connect { display:inline-block; color:#777; font-size:13px; line-height:20px; }
.join_view .box_noti .btn_connect .im { margin:-2px 0 0 3px; color:#ccc; font-size:100%; vertical-align:middle; }

.join_view .box_btn { display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:center; gap:20px; }
.join_view .box_btn .btn_sns { -webkit-flex:1; -ms-flex:1; flex: 1; height:55px; padding:15px; border-radius:10px; background:#f8f8f8; text-align:center; }
.join_view .box_btn .btn_sns span { vertical-align:text-bottom; line-height:25px; }
.join_view .box_btn .btn_sns .ic { display:inline-block; width:25px; height:25px; margin-right:5px; vertical-align:text-bottom; background:url('/images/Join/ic_btn_sns.png') no-repeat; }
.join_view .box_btn .btn_sns .ic.naver { background-position-x:0; }
.join_view .box_btn .btn_sns .ic.facebook { background-position-x:-25px; }
.join_view .box_btn .btn_sns .ic.google { background-position-x:-50px; }
.join_view .box_btn .btn_sns .ic.apple { background-position-x:-75px; }
.join_view .box_btn .ts_btn { display:block; width:290px; border-radius:5px; font-size:15px; line-height:45px; text-align:center; }

.join_view .box_table { width:100%; table-layout:fixed; border-collapse: separate !important; border-spacing: 0 20px !important; }
.join_view .box_table .box_row .box_th { font-weight:400; line-height:45px; text-align:left; vertical-align:top; }
.join_view .box_table .box_row .box_td .cm_form.text01 { width:100%; height:45px; margin:0; line-height:45px; }
.join_view .box_table .box_row .box_td .cm_form.text01:-webkit-autofill,
.join_view .box_table .box_row .box_td .cm_form.text01:-webkit-autofill:hover,
.join_view .box_table .box_row .box_td .cm_form.text01:-webkit-autofill:focus,
.join_view .box_table .box_row .box_td .cm_form.text01:-webkit-autofill:active { transition:background-color 5000s ease-in-out 0s; -webkit-transition:background-color 9999s ease-out; -webkit-box-shadow:0 0 0px 1000px white inset !important; -webkit-text-fill-color: #999 !important; }

.join_view .box_table .box_row .box_td .box_phone { display:-webkit-box; display:-ms-flexbox; display:flex; gap:10px; }
.join_view .box_table .box_row .box_td .box_phone > * { display:-ms-flexbox; -webkit-flex:1; -ms-flex:1; flex: 1; width:auto; height:45px; margin:0; }
.join_view .box_table .box_row .box_td .box_phone > .box_timer { display:-ms-flexbox; -webkit-flex:0 0 auto; -ms-flex:0 0 auto; flex: 0 0 auto; height:45px; margin:0; text-align:right; line-height:45px; }
.join_view .box_table .box_row .box_td .box_phone .cm_btn  { display:-ms-flexbox; -webkit-flex:0 0 120px; -ms-flex:0 0 120px; flex: 0 0 120px; width:120px; border-radius:5px; font-size:15px; cursor:pointer; }
.join_view .box_table .box_row .box_td .box_phone .cm_btn.bg_bk  { border:0; }

.join_view .box_table .box_row .box_td .box_agreement { position:relative; margin-top:15px; overflow:hidden; }
.join_view .box_table .box_row .box_td .box_agreement:first-child { margin-top:0; color:#222; }
.join_view .box_table .box_row .box_td .box_agreement input { display:none; }
.join_view .box_table .box_row .box_td .box_agreement input + label { display:inline-block; position:relative; padding-left:34px; color:#777; font-size:15px; line-height:24px; overflow:hidden; cursor:pointer; }
.join_view .box_table .box_row .box_td .box_agreement input + label:before { display:block; content:''; position:absolute; top:0; left:0; width:24px; height:24px; background:url('/images/Common/ic-check.png') no-repeat; }
.join_view .box_table .box_row .box_td .box_agreement input:checked + label { color:#222; }
.join_view .box_table .box_row .box_td .box_agreement input:checked + label:before { background-position:0 -24px; }
.join_view .box_table .box_row .box_td .box_agreement .btn_view { position:absolute; top:2px; right: 0; color:#777; font-size:13px; line-height:20px; }
.join_view .box_table .box_row .box_td .box_agreement .btn_view .im { margin:-2px 0 0 5px; color:#ccc; font-size:11px; vertical-align:middle; }

.join_view .btn_join { display:block; width:320px; height:45px; margin:25px auto 0; border:0; border-radius:5px; font-size:15px; text-align:center; }


/*로그인*/
.login_view { position:relative; }
.login_view .cm_form { margin-left:0; }
.login_view .box_logo { overflow:hidden; }
.login_view .box_logo img { display:block; float:left; }
.login_view .box_logo .tit { display:block; float:left; font:700 30px ' Noto Sans KR'; }
.login_view .box_logo .txt { display:block; padding-top:20px; font:500 16px/22px 'Noto Sans KR'; clear:both; }
.login_view .box_logo .txt .cm_smtxt{ font-size:14px; }

.login_view .box_login { float:left; width:417px; margin:40px 0 10px 0; overflow:hidden; }
.login_view .box_login .box_input { display:block; float:left; width:305px; }
.login_view .box_login .box_input input { width:305px; height:45px; padding:0 15px; line-height:45px; box-sizing:border-box; overflow:hidden; }
.login_view .box_login .btn_submit { display:block; float:right; width:100px; height:100px; border:0; border-radius:5px; background:#222; color:#fff; font-size:18px; font-family:'Noto Sans KR'; text-align:center; cursor:pointer; }
.login_view .cm_btn_sns { float:right; width:386px; margin-top:40px; clear:right; }

.login_view .box_login.find { float:none; }
.login_view .box_login.find input[type = 'checkbox'] { margin-right:5px; vertical-align:middle; }
.login_view .box_login.find .box_find { float:right; font-size:13px; }
.login_view .box_login.find .box_find a { color:#999; font-size:15px; line-height:20px; margin:0 5px; vertical-align:middle; }

.login_view .box_bn { width:100%; margin-top:30px; clear:both; overflow:hidden; }
.login_view .box_bn a { display:block; width:100%; height:auto; }
.login_view .box_bn img{ display:block; width:100%; height:auto; }


/*리딩 랜딩 로그인, 회원가입 */
.popup_account { position:relative; }
.popup_account .contents01 { width:353px; height:auto; padding:50px 0 30px 0; }
.popup_account .box_logo { height:26px; font-size:18px; font-weight:bold; line-height:26px; text-align:center; }
.popup_account .box_logo img { display:inline-block; float:none; width:auto; height:100%; vertical-align:bottom; }
.popup_account .cm_btn_sns { float:none; width:320px; }
.popup_account .line_division { display:block; width:100%; height:20px; position:relative; color:#999; font-size:13px; line-height:20px; text-align:center; }
.popup_account .line_division:before { display:block; content:''; position:absolute; top:10px; left:0; width:160px; height:1px; background:#ddd; }
.popup_account .line_division:after { display:block; content:''; position:absolute; top:10px; right:0; width:160px; height:1px; background:#ddd; }

.popup_account input[type = 'checkbox'] { display:none; }
.popup_account input[type = 'checkbox'] + label { display:inline-block; position:relative; padding-left:25px; font-size:15px; line-height:22px; cursor:pointer; }
.popup_account input[type = 'checkbox'] + label:before { display:block; content:''; position:absolute; top:2px; left:0; width:18px; height:18px; background:url('/images/Common/ic_check.png') no-repeat 0 0; }
.popup_account input[type = 'checkbox']:checked + label:before { background:url('/images/Common/ic_check.png') no-repeat 0 -18px; }

.popup_account input[type = 'checkbox'].cm_chk { display:none; }
.popup_account input[type = 'checkbox'].cm_chk + label { display:inline-block; position:relative; padding-left:34px; color:#777; font-size:15px; line-height:24px; overflow:hidden; cursor:pointer; }
.popup_account input[type = 'checkbox'].cm_chk + label:before { display:block; content:''; position:absolute; top:0; left:0; width:24px; height:24px; background:url('/images/Common/ic-check.png') no-repeat; background-size:cover; }
.popup_account input[type = 'checkbox'].cm_chk:checked + label { color:#222; }
.popup_account input[type = 'checkbox'].cm_chk:checked + label:before { background-position:0 -24px; }

.popup_account .box_input input:disabled { background:#ededed; }

.popup_account .box_input .cm_form.text01 { float:none; width:100%; height:45px; font-size:13px; margin-left:0; }
.popup_account .box_input small { display:block; margin-top:5px; }
.popup_account .box_input .box_certify { position:relative; overflow:hidden; }
.popup_account .box_input .box_certify .cm_form.text01 { float:left; width:calc(100% - 90px); }
.popup_account .box_input .box_certify .cm_form.text01.wide { width:100%; }
.popup_account .box_input .box_certify .cm_form.text01.certify { padding-right:57px; }
.popup_account .box_input .box_certify .timer { position:absolute; right:110px; top:0; color:#999; font-size:15px; line-height:45px; }
.popup_account .box_input .box_certify small { float:left; }
.popup_account .box_input .box_certify .btn_check { display:block; float:left; width:75px; height:46px; margin-left:15px; border-radius:5px; font-size:15px; line-height:44px; text-align:center; }

.popup_account .box_login { float:none; width:auto; margin:0; overflow:hidden; }
.popup_account .box_login .box_find { float:right; font-size:15px; line-height:22px; }

.popup_account .box_agree { position:relative; border:1px solid #ddd; border-top:2px solid #222; overflow:hidden; }
.popup_account .box_agree > div { position:relative; padding:15px; overflow:hidden; }
.popup_account .box_agree > ul { position:relative; padding:15px; overflow:hidden; }
.popup_account .box_agree > ul li { position:relative; margin-top:12px; overflow:hidden; }
.popup_account .box_agree > ul li:first-child { margin-top:0;}

.popup_account .box_agree .cm_smtxt { position:absolute; right:15px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); }
.popup_account .box_agree input[type = 'checkbox'] + label { display:inline-block; position:relative; padding-left:25px; font-size:13px; line-height:22px; }
.popup_account .box_agree .agree_all .ic_arrow { position:absolute; right:15px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); color:#999; font-size:80%; }
.popup_account .box_agree .agree_desc { border-top:1px solid #ddd; }
.popup_account .box_agree .agree_desc label { margin-top:12px; }
.popup_account .box_agree .agree_desc label:first-of-type {  margin-top:0; }
.popup_account .box_agree .agree_desc .cm_smtxt { right:0 }
.popup_account .box_agree .agree_desc .cm_smtxt .im { font-size:90%; vertical-align:middle; }

.popup_account .box_agree .agree_desc > ul li { margin-top:12px; }
.popup_account .box_agree .agree_desc > ul li:first-child { margin-top:0; }

.popup_account .box_phone { display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-flex-wrap:nowrap; justify-content:space-between; gap:0 10px; }
.popup_account .box_phone .cm_form.text01 { -webkit-flex:0 0 calc(100% - 130px); -ms-flex:0 0 calc(100% - 130px); flex:0 0 calc(100% - 130px); width:calc(100% - 130px); height:45px; margin:0; }
.popup_account .box_phone .btn_phone { -webkit-flex:0 0 120px; -ms-flex:0 0 120px; flex:0 0 120px; width:120px; height:45px; border-radius:5px; font-size:15px; font-weight:bold; }

.popup_account .cm_btn_bg { display:block; width:100%; height:45px; font-size:18px; font-weight:500; line-height:45px; }
.popup_account .cm_btn_line { display:block; width:100%; height:45px; margin:0 auto; font-size:18px; font-weight:500; line-height:45px; }
.popup_account .cm_btn_line.small {width:141px; }

.popup_account .btn_join { width:100%; height:45px; border-radius:5px; font-size:15px; font-weight:bold; }

.popup_account a.cm_color_bl { text-decoration:underline; }
.popup_account a.cm_color_bl { text-decoration:underline; }

/* 랜딩 SNS 로그인*/
.popup_account .cm_btn_sns.quick { display:block; width:100%; line-height:45px; text-align:center; }
.popup_account .cm_btn_sns.quick li { height:55px; padding:5px 20px; margin-bottom:20px; border-radius:10px; box-sizing:border-box; cursor:pointer; }
.popup_account .cm_btn_sns.quick li:last-child { margin-bottom:0; }
.popup_account .cm_btn_sns.quick .btn_naver { background:#03c75a; color:#fff; }
.popup_account .cm_btn_sns.quick .btn_facebook { background:#1877f2; color:#fff; }
.popup_account .cm_btn_sns.quick .btn_google { border:solid 1px #ddd; background:#fff; color:#222; }
.popup_account .cm_btn_sns.quick .btn_apple { background:#222; color:#fff; }
.popup_account .cm_btn_sns.quick .btn_email { background:#ccc; color:#222; }
.popup_account .cm_btn_sns.quick .ic { display:block; float:left; position:absolute; width:22px; height:22px; margin-top:11px; background:url(/images/Join/ic_sns.png) no-repeat 0 0; }
.popup_account .cm_btn_sns.quick .ic.naver { background-position:0 0; }
.popup_account .cm_btn_sns.quick .ic.facebook { background-position:0 -22px; }
.popup_account .cm_btn_sns.quick .ic.google { background-position:0 -44px; }
.popup_account .cm_btn_sns.quick .ic.apple { background-position:0 -66px; }
.popup_account .cm_btn_sns.quick .ic.email { background-position:0 -88px; }


/*약관 관련*/
.information_view .box_desc { margin-top:50px; font-size:13px; line-height:22px; letter-spacing:-0.5px; }
.information_view .box_desc .tit { margin:50px 0 5px; font-size:18px; font-weight:600; line-height:22px; }
.information_view .box_desc .tit + .txt{ margin-top:20px !important; }
.information_view .box_desc .subtit { margin:25px 0 10px; font-size:15px; font-weight:600; }
.information_view .box_desc .cm_color_navy { color:#381d96; font-weight:600; }
.information_view .box_desc .txt a { display:inline-block; color:#2e2e72; margin-left:5px; }
.information_view .box_desc .txt.add a { margin-left:10px; color:#999; }
.information_view .box_desc .cm_table_wrap { width:100%; margin:10px 0; }
.information_view .box_desc .cm_table_wrap th { font-size:15px; vertical-align:middle; }
.information_view .box_desc .cm_table_wrap td { font-size:14px; }


/*환불 관련*/
.refund_view .contents01 { width:940px; padding:50px 0 0 0; }
.refund_view .box_step { width:100%; text-align:center; }
.refund_view .box_step li { display:inline-block; vertical-align:middle; }
.refund_view .box_step .step { width:234px; height:60px; background:url('/images/Subpage/bg_off.png') no-repeat center; background-size:contain; color:#222; font:600 20px/60px 'Noto Sans KR'; }
.refund_view .box_step .step.on { background-image:url('/images/Subpage/bg_on.png'); }
.refund_view .box_step .ic_arrow { width:27px; height:60px; background:url('/images/Subpage/arrow.png') no-repeat center center; }

.refund_view .box_noti { padding:30px; margin:30px 0; background:#f8f8f8; color:#333; font-size:18px; font-weight:600; text-align:center; }
.refund_view .box_noti .cm_txt { display:block; width:100%; margin-bottom:10px; font-size:23px; text-align:center; }
.refund_view .box_noti .txt { display:block; margin-bottom:5px; font:600 17px 'Noto Sans KR'; }
.refund_view .box_noti .smtxt { display:block; font:500 14px/22px 'Noto Sans KR'; }

.refund_view .box_survey .tit { display:inline-block; padding:0 0 20px 0; font-size:18px; font-weight:600; }
.refund_view .box_survey .txt { display:inline-block; width:100%; padding:5px 10px; color:#666; font-size:15px; }
.refund_view .box_survey input[type= radio] { margin-right:5px; vertical-align:middle; }
.refund_view .box_survey textarea { width:100%; height:80px; padding:10px; margin-top:10px; border:1px solid #ddd; color:#999; font:500 14px/18px 'Noto Sans KR'; box-sizing:border-box; resize:vertical; }

.refund_view .box_btn { margin:50px; text-align:center; }
.refund_view .box_btn input[type=button] { display:inline-block; float:none; width:120px; height:35px; font-size:15px; line-height:35px; text-align:center; vertical-align:middle; }
.refund_view .box_btn .btn_reset { margin-right:15px; line-height:33px; }

.refund_view .cm_table_wrap.table_write tbody th { font-size:15px; letter-spacing:0px; }
.refund_view .cm_table_wrap.table_write tbody td { font-size:15px; }
.refund_view .cm_table_wrap.table_write tbody td .cm_form { display:inline-block; height:25px; padding:0 10px; margin:0 10px 0 0 ; font-size:14px; line-height:25px; vertical-align:middle; }
.refund_view .cm_table_wrap.table_write tbody td .txt { display:inline-block; }
.refund_view .cm_table_wrap.table_write tbody td input[type=checkbox] { margin:0 5px 0 20px; vertical-align:middle; }
.refund_view .cm_table_wrap.table_write tbody td input[type=checkbox] + label { margin:0;}
.refund_view .cm_table_wrap.table_write tbody td .btn_account { display:inline-block; width:85px; height:25px; border:0; border-radius:3px; font-size:12px; line-height:25px; text-align:center; vertical-align:middle; cursor:pointer; }
.refund_view .cm_table_wrap.table_write tbody td .box_refund_noti { margin-top:10px; color:#999; font-size:14px; line-height:18px; }

.refund_view .box_info { color:#999; font-size:14px; line-height:22px; }
.refund_view .box_info .tit { margin-bottom:10px; font-weight:500; font-size:17px; }
.refund_view .box_info .txt { margin-bottom:5px; }


/* 마이페이지-회원 정보 */
.mypage_view { float:left; width:940px; min-width:unset; }
.mypage_view .contents01 { width:940px; padding:0 0 0 0; }
.mypage_view .cm_tit { display:block; margin-bottom:30px;}
.mypage_view .cm_txt { display:block; }
.mypage_view .line { display:block; width:100%; height:1px; margin-top:20px; border:0; background:#ddd; }
.mypage_view .cm_form_wrap { width:auto; margin:100px auto 0 auto; text-align:center; height:auto;  }
.mypage_view .cm_form_wrap .cm_form { display:inline-block; margin:0; vertical-align:middle; }
.mypage_view .cm_form_wrap .btn_submit { display:inline-block; width:120px; height:45px; margin:0 0 0 15px; border-radius:5px; font-size:15px; line-height:45px; vertical-align:middle; }
.mypage_view .cm_form_wrap .cm_smtxt { display:inline-block; margin-top:12px; }

.mypage_view .cm_table_wrap tbody td { font-size:15px; }
.mypage_view .cm_table_wrap .cm_attached_wrap .tit { padding-top:0; padding-left:30px; text-align:left; }
.mypage_view .cm_table_wrap .cm_attached_wrap .tit .cm_txt a:hover { text-decoration:underline; }
.mypage_view .cm_table_wrap.qna { margin-bottom:50px; }
.mypage_view .cm_table_wrap.answer { margin-bottom:50px; margin-top:-1px; }
.mypage_view .cm_table_wrap.answer thead { border-top:0; }
.mypage_view .cm_table_wrap.answer thead:nth-of-type(1) { border-top:2px solid #222; }

.mypage_view .cm_board_view .cm_badge { background:#f4f5fa; }
.mypage_view .cm_board_view .cm_badge.ready { background:#ddd; }

.mypage_view.qna_view .btn_list { float:right; width:64px; height:35px; margin-top:-20px; font-size:15px; line-height:35px; text-align:center; }


/*핀업책 QNA 작성하기*/
.chatqna_view { padding:30px; }
.chatqna_view .cm_table_wrap tbody td { padding:10px; }
.chatqna_view .cm_table_wrap .cm_form{ width:100%; height:45px; padding:0 20px; margin:0; font-size:15px; }
.chatqna_view .cm_table_wrap .cm_form.select { background-position:97% 18px; }
.chatqna_view .cm_table_wrap .cm_form.textarea{ width:100%; height:292px; padding:20px; margin-bottom:0; resize:vertical;}

.chatqna_view .cm_table_wrap .box_attached { padding-left:10px; }
.chatqna_view .cm_table_wrap .box_attached li { padding:2px 0; box-sizing:border-box; }
.chatqna_view .cm_table_wrap .box_attached li .im { margin:-2px 0 0 10px; color:#555; font-size:70%; vertical-align:middle; }
.chatqna_view .btn_submit { width:200px; height:40px; margin:0 auto 30px auto; font-size:15px; line-height:40px; text-align:center; }


/*펀딩 내역 상세*/
.participate_view { float:left; width:940px; }
.participate_view .contents01 { position:relative; width:100%; padding:0; overflow:hidden; }
.participate_view .contents01.cm_bg_cont { padding:30px; }
.participate_view .cm_thumb_wrap { float:left; position:relative; width:300px; height:173px; border:1px solid #ddd; overflow:hidden; }
.participate_view .cm_thumb_wrap img { display:block; position:absolute; top:0; width:100%; height:auto; }
.participate_view .box_info { float:left; position:relative; width:calc(100% - 350px); margin-left:50px; overflow:hidden; }
.participate_view .box_info .cm_badge { float:none; display:inline-block; }
.participate_view .box_info .tit { display:block; width:100%; margin:8px 0 0 0; font-size:18px; line-height:25px; cursor:pointer; }
.participate_view .box_info .subtit { display:block; width:600px; color:#777; font-size:15px; line-height:22px; }
.participate_view .box_info .cm_info_desc { float:none; width:100%; padding:0; margin:20px 0 0 0; }

.participate_view .box_info .cm_info_desc li { height:22px; margin-top:10px; }
.participate_view .box_info .cm_info_desc li:first-child { margin-top:0; }
.participate_view .box_info .cm_info_desc li a { display:inline-block; width:auto; height:100%; border-bottom:1px solid #222; }
.participate_view .box_info .cm_info_desc span { display:block; height:22px; font:500 15px/22px 'Noto Sans KR'; }
.participate_view .box_info .cm_info_desc span.tit { width:150px; padding-left:15px; margin:0; color:#777; }
.participate_view .box_info .cm_info_desc span.tit:before { background:#777; }
.participate_view .box_info .cm_info_desc span.txt { width:calc(100% - 150px); }
.participate_view .box_info button { width:190px; height:50px; font-size:18px; font-weight:700; }

.participate_view .box_info .cm_info_desc .cm_table_wrap { float:left; width:calc(100% - 165px); margin-left:15px; border:1px solid #ddd; }
.participate_view .box_info .cm_info_desc .cm_table_wrap thead { border:0; }
.participate_view .box_info .cm_info_desc .cm_table_wrap thead th { height:auto; padding:10px 5px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; background:#ededed; color:#999; font-size:15px; line-height:20px; }
.participate_view .box_info .cm_info_desc .cm_table_wrap thead th:last-child { border-right:0; }
.participate_view .box_info .cm_info_desc .cm_table_wrap tbody td { height:auto; padding:10px 5px; border-right:1px solid #ddd; font-size:15px; line-height:20px; }
.participate_view .box_info .cm_info_desc .cm_table_wrap tbody td:last-child { padding:5px; }
.participate_view .box_info .cm_info_desc .cm_table_wrap tbody td:last-child .cm_btn_bg { padding:5px; }

.participate_view  .btn_cancel { width:190px; height:50px; margin:30px auto 0 auto; font-size:18px; font-weight:700; }

.participate_view .cm_subtit { margin:50px 0 20px 0; font-weight:600; line-height:18px; }
.participate_view .cm_subtit + .box_info { float:none; width:100%; padding:30px; margin:0; border:1px solid #ddd; border-top:2px solid #222; }
.participate_view .cm_subtit + .box_info .cm_info_desc { float:left; width:calc(100% - 200px); margin:0; }
.participate_view .cm_subtit + .box_info button.cm_btn_line { float:right; font-weight:600; }
.participate_view .cm_subtit + .box_info button.cm_btn_line + .cm_btn_line { margin-top:15px; }

.participate_view .cm_subtit + .box_info.payment_info .cm_info_desc { width:100%;}
.participate_view .cm_subtit + .box_info.payment_info .cm_info_desc li:nth-child(2) { height:auto; }
.participate_view .cm_subtit + .box_info.payment_info .cm_info_desc li:nth-child(2) .cm_btn_bg { display:inline-block; width:69px; height:28px; font-size:13px; }

.participate_view .cm_btn_list { display:block; float:right; position:relative; bottom:auto; right:auto; margin:30px 0 0 0; text-align:center; }


/* 핀업크루 소개페이지*/
.character_view { overflow:hidden; }
.character_view .box_indicator { display:block; position:fixed; top:50%; right:5%; transform:translateY(-50%); width:23px; z-index:999; }
.character_view .box_indicator .btn_indicator { width:11px; height:11px; margin:0 auto 13px auto; background:#ada28a; border-radius:100px; }
.character_view .box_indicator .btn_indicator a{ display:block; width:100%; height:100%; cursor:pointer;}
.character_view .box_indicator .btn_indicator.on { width:23px; height:23px; border:4px solid #222; background-color:transparent; }
.character_view .box_indicator .btn_indicator:last-child { margin-bottom:0; }

.character_view .contents02 { position:relative; width:100%; height:100vh; padding:0; overflow:hidden; }
.character_view .contents02.scene01 { background:#ffebda; }
.character_view .contents02.scene02 { background:#b7e7f7; }
.character_view .contents02.scene03 { background:#d7ccfd; }
.character_view .contents02.scene04 { background:#ffc74d; }
.character_view .contents02.scene05 { background:#d4fad9; }
.character_view .contents02 .box_cont { position:relative; width:100%; max-width:1192px; height:100%; margin:0 auto;}
.character_view .contents02 .box_txt { display:block; position:absolute; }
.character_view .contents02 .box_character { display:block; position:absolute; background-position:center bottom; background-repeat:no-repeat; background-size:contain; }
.character_view .contents02 span { display:block; position:absolute; }
.character_view .contents02 img { display:block; width:auto; height:100%; margin:0 auto; }

.character_view .scene01 .btn_download { position:absolute; bottom:13.8%; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); border:1px solid #ddd; background:#fff; width:250px; height:50px; color:#222; font-size:20px; line-height:50px; text-align:center; z-index:4; }
.character_view .scene01 .btn_download:hover { background:#ff7500; border:0; color:#fff; cursor:pointer; }

.character_view .scene01 .box_txt { top:135px; width:100%; height:28.7%; overflow:hidden; z-index:3; }
.character_view .scene01 .box_txt img { display:block; width:auto; height:100%; margin:0 auto; }
.character_view .scene01 .box_txt .box_animate { position:absolute; top:27%; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); width:24%; min-width:300px; height:41.65%; }
.character_view .scene01 .box_txt .box_animate .big { width:4.75%; height:30.5%; background:url('/images/Subpage/img_character_animate01.png') no-repeat; background-size:contain; opacity:0; }
.character_view .scene01 .box_txt .box_animate .small { width:3.29%; height:19.84%; background:url('/images/Subpage/img_character_animate02.png') no-repeat; background-size:contain; opacity:0; }
.character_view .scene01 .box_txt .animate_01 { top:8%; left:10%; animation-delay:1s; -webkit-animation-delay:1s; }
.character_view .scene01 .box_txt .animate_02 { top:13%; right:8%; animation-delay:2.5s; -webkit-animation-delay:1.5s; }
.character_view .scene01 .box_txt .animate_03 { bottom:18%; left:25%; animation-delay:0; -webkit-animation-delay:0; }
.character_view .scene01 .box_txt .animate_04 { top:23%; left:40%; animation-delay:2s; -webkit-animation-delay:2s; }
.character_view .scene01 .box_txt .animate_05 { top:38%; right:27%; animation-delay:2.5s; -webkit-animation-delay:2.5s; }

.character_view .scene01 .box_character { left:0; bottom:0; width:100%; height:50%; background-image:url('/images/Subpage/img_character_bg01_02.png'); z-index:2; }
.character_view .scene01 .box_character .animate_01{ position:absolute; left:25vw; top:8vh; width:auto; height:5vh;  }

.character_view .scene01 .flower_l { position:absolute; top:25%; left:8.3%; width:22.6%; height:50.46%; background-repeat:no-repeat; background-size:cover; z-index:1; }
.character_view .scene01 .flower_l.animate_01 { background-image:url('/images/Subpage/img_character_animate08.png'); }
.character_view .scene01 .flower_l.animate_02 { background-image:url('/images/Subpage/img_character_animate09.png');}
.character_view .scene01 .flower_r { position:absolute; top:28%; right:11.19%; width:20.36%; height:45.3%; background-repeat:no-repeat; background-size:contain; z-index:1; }
.character_view .scene01 .flower_r.animate_01 { background-image:url('/images/Subpage/img_character_animate10.png'); }
.character_view .scene01 .flower_r.animate_02 { background-image:url('/images/Subpage/img_character_animate11.png'); }
.character_view .scene02 img {}
.character_view .scene02 { padding:0; }
.character_view .scene02 .box_txt { top:23.6%; left:19%; height:30.46%; z-index:2; }
.character_view .scene02 img { position:relative; width:auto; height:100%; margin:0; }
.character_view .scene02 .box_character { left:0; bottom:0; width:100%; height:100%; background-image:url('/images/Subpage/img_character_bg02_02.png');  background-size:100%; z-index:1; }
.character_view .scene02 .box_character .animate_01 { position:absolute; top:50.8%; right:38.43%; width:auto; height:4.81%; z-index:3; }
.character_view .scene02 .box_character .animate_02 { position:absolute; top:46.31%; right:23.48%; width:auto; height:7.03%; z-index:2; }
.character_view .scene02 .box_character .animate_03 { position:absolute; top:12.5%; right:10.93%; width:75.26%; height:44.16%; z-index:1; }

.character_view .scene03 img { position:relative; width:auto; height:auto; }
.character_view .scene03 .box_txt { top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto; height:52.5%; z-index:3; }
.character_view .scene03 .box_txt .btn_tooltip { display:inline-block; position:absolute; top:29.98%; left:46.52%; width:auto; border:1px solid #fff; border-radius:100px; background:#fff; font-size:110%; cursor:pointer; z-index:2; }
.character_view .scene03 .box_txt .cm_tooltip_desc { top:29.45%; left:48.8%; width:169px; padding:22px 30px; z-index:3; }
.character_view .scene03 .box_txt .cm_tooltip_desc span { display:block; position:relative; padding-left:10px; color:#fff; font-size:15px; line-height:22px; }
.character_view .scene03 .box_txt .cm_tooltip_desc span::before{ content:''; display:block; position:absolute; top:10px; left:0;  width:3px; height:3px; border-radius:50%; background-color:#fff;}

.character_view .scene03 .box_txt .btn_tooltip:nth-of-type(2) { top:47.26%; left:75.64%; width:auto; border-radius:100px; }
.character_view .scene03 .box_txt .btn_tooltip:nth-of-type(2) + .cm_tooltip_desc { top:46.73%; left:77.8%;  }
.character_view .scene03 .box_txt .btn_tooltip:nth-of-type(3) { top:57.3%; left:47.9%; }
.character_view .scene03 .box_txt .btn_tooltip:nth-of-type(3) + .cm_tooltip_desc{ top:56.3%; left:50.1%;  }

.character_view .scene03 .box_txt img { width:auto; height:100%; z-index:1; }

.character_view .scene03 .box_character { bottom:50%; left:50%; transform:translate(-50%,50%); -webkit-transform:translate(-50%,50%); width:auto; height:auto; max-height:100%; z-index:2; }
.character_view .scene03 .box_character img { max-height:100%; }
.character_view .scene03 .box_character span { z-index:3; }
.character_view .scene03 .box_character .animate_01 { top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); max-height:100%; }
.character_view .scene03 .box_character .animate_02 { top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); max-height:100%; opacity:0; }
.character_view .scene03 .box_character .star { background:url('/images/Subpage/img_character_animate15.png') no-repeat; background-size:100%; }
.character_view .scene03 .box_character .animate_03 { top:165px; left:20.3%; width:20px; height:21px; animation-delay:1s !important; -webkit-animation-delay:1s !important; }
.character_view .scene03 .box_character .animate_04 { top:835px; left:13.8%; width:28px; height:28px; animation-delay:0.5s !important; -webkit-animation-delay:0.5s !important; }
.character_view .scene03 .box_character .animate_05 { top:134px; right:24.84%; width:23px; height:24px; animation-delay:1.5s !important; -webkit-animation-delay:1.5s !important; }
.character_view .scene03 .box_character .animate_06 { top:267px; right:28.48%; width:24px; height:24px; animation-delay:0.5s !important; -webkit-animation-delay:0.5s !important; }
.character_view .scene03 .box_character .animate_07 { top:681px; right:12.65%; width:24px; height:24px;  animation-delay:1s !important; -webkit-animation-delay:2.5s !important;}

.character_view .scene04 .box_cont { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); height:52.40%; overflow:hidden; }
.character_view .scene04 .box_character { position:relative; width:40.68%; max-width:485px; max-height:488px; height:calc(100% - 84px); max-height:488px; margin-right:10.16%; overflow:hidden; }
.character_view .scene04 .box_character li { display:none; width:100%; height:100%; background:url('/images/Subpage/img_character_01.png') no-repeat center; background-size:contain; }
.character_view .scene04 .box_character li:nth-child(2) { background-image:url('/images/Subpage/img_character_02.png'); }
.character_view .scene04 .box_character li:nth-child(3) { background-image:url('/images/Subpage/img_character_03.png'); }
.character_view .scene04 .box_character li:nth-child(4) { background-image:url('/images/Subpage/img_character_04.png'); }
.character_view .scene04 .box_character li:nth-child(5) { background-image:url('/images/Subpage/img_character_05.png'); }
.character_view .scene04 .box_character li.on { display:block; }

.character_view .scene04 .box_txt { position:absolute; right:0; top:0; width:49.16%; max-width:586px; height:100%; box-sizing:border-box; overflow:hidden; }
.character_view .scene04 .box_txt .dsec_character { display:none; width:100%; height:100%; padding:36px 0 0 0; }
.character_view .scene04 .box_txt .dsec_character.on { display:block; }
.character_view .scene04 .box_txt .dsec_character .btn_detail { height:50px; overflow:hidden; }
.character_view .scene04 .box_txt .dsec_character .btn_detail li { display:inline-block; float:left; padding:14px 25px; margin-right:10px; border-radius:25px; background:#fff; font-size:15px; line-height:22px; overflow:hidden; cursor:pointer; }
.character_view .scene04 .box_txt .dsec_character .btn_detail li:last-child { margin-right:0; }
.character_view .scene04 .box_txt .dsec_character .btn_detail li.on { background:#ff7500; color:#fff; font-weight:700; }

.character_view .scene04 .box_txt .dsec_character .box_detail { height:calc(100% - 100px); margin:50px 0 0 0; }
.character_view .scene04 .box_txt .dsec_character .box_detail li { display:none; height:100%; overflow:hidden; overflow-y:auto; }
.character_view .scene04 .box_txt .dsec_character .box_detail li.on { display:block; }
.character_view .scene04 .box_txt .dsec_character .box_detail li .character_name { display:block; width:100%; height:86px; margin:0 0 20px 0; background:url('/images/Subpage/img_character_name.png') no-repeat; background-position:0 -4px; }
.character_view .scene04 .box_txt .dsec_character .box_detail li .tit { display:block; margin-bottom:10px; font-size:36px; line-height:54px; }
.character_view .scene04 .box_txt .dsec_character .box_detail li .tit strong { color:#ff7500; }
.character_view .scene04 .box_txt .dsec_character .box_detail li .txt { height:calc(100% - 170px); font-size:18px; line-height:30px; }
.character_view .scene04 .box_txt .dsec_character .box_detail li img { display:block; width:100%; height:auto; }

.character_view .scene04 .box_txt .dsec_character.character02 .btn_detail li.on { background:#00a2e0; }
.character_view .scene04 .box_txt .dsec_character.character02 .box_detail li .character_name { background-position:0 -106px; }
.character_view .scene04 .box_txt .dsec_character.character02 .box_detail li .tit strong { color:#00a2e0; }

.character_view .scene04 .box_txt .dsec_character.character03 .btn_detail li.on { background:#14b977; }
.character_view .scene04 .box_txt .dsec_character.character03 .box_detail li .character_name { background-position:0 -204px; }
.character_view .scene04 .box_txt .dsec_character.character03 .box_detail li .tit strong { color:#14b977; }

.character_view .scene04 .box_txt .dsec_character.character04 .btn_detail li.on { background:#0756c3; }
.character_view .scene04 .box_txt .dsec_character.character04 .box_detail li .character_name { background-position:0 -306px; }
.character_view .scene04 .box_txt .dsec_character.character04 .box_detail li .tit strong { color:#0756c3; }

.character_view .scene04 .box_txt .dsec_character.character05 .btn_detail li.on { background:#ee4049; }
.character_view .scene04 .box_txt .dsec_character.character05 .box_detail li .character_name { background-position:0 -404px; }
.character_view .scene04 .box_txt .dsec_character.character05 .box_detail li .tit strong { color:#ee4049; }

.character_view .scene04 .btn_character { width:auto; height:84px; overflow:hidden; }
.character_view .scene04 .btn_character li { float:left; width:78px; height:78px; margin:1px 12px 0 0; border:2px solid #999; border-radius:50%; box-sizing:content-box; background:url('/images/Subpage/btn_character.png') no-repeat; background-position:0 0; overflow:hidden; cursor:pointer; }
.character_view .scene04 .btn_character li.on { margin:0 10px 0 0; border:3px solid #ff7500; background-position-x:-78px; }
.character_view .scene04 .btn_character li:nth-child(2) { background-position-y:-78px; }
.character_view .scene04 .btn_character li:nth-child(3) { background-position-y:-156px; }
.character_view .scene04 .btn_character li:nth-child(4) { background-position-y:-234px; }
.character_view .scene04 .btn_character li:nth-child(5) { background-position-y:-312px; margin-right:0 !important; }

.character_view .scene05 { padding:0; }
.character_view .scene05 .box_txt { top:27.5%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:29.69%; height:22.22%; z-index:1; }
.character_view .scene05 .box_character { left:0; bottom:-2%; width:100%; height:100%; background:url('/images/Subpage/img_character_bg05.png') no-repeat center; background-size:100%; background-position:center bottom; z-index:2; }
.character_view .scene05 .box_btn { position:absolute; bottom:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); width:19%; height:13.5%; z-index :3; }
.character_view .scene05 .box_btn .btn_ogq01 { float:left; width:48%; height:100%; }
.character_view .scene05 .box_btn .btn_ogq02 { float:right; width:48%; height:100%; }

.character_view .effect01 { animation:character_eyes 0.6s 0s infinite linear; -webkit-animation:character_eyes 0.6s 0s infinite linear;  }
.character_view .effect02 { animation:character_updwon1 5s 1s infinite linear; -webkit-animation:character_updwon1 5s 1s infinite linear; }
.character_view .effect03 { animation:character_updwon1 3s 1s  infinite linear; -webkit-animation:character_updwon1 3s 1s infinite linear; animation-delay:2.5s; -webkit-animation-delay:2.5s; }
.character_view .effect04 { animation:character_rotate 3s 0s infinite linear; -webkit-animation:character_rotate 3s 0s infinite linear; }
.character_view .effect05 { animation:character_updwon2 3s 0s infinite linear; -webkit-animation:character_updwon2 3s 0s infinite linear; }
.character_view .effect06 { animation:character_updwon3 3s 0s infinite linear; -webkit-animation:character_updwon3 3s 0s infinite linear; }
.character_view .effect07 { animation:character_leftright 10s 0s infinite linear; -webkit-animation:character_leftright 10s 0s infinite linear; }
.character_view .effect08 { animation:character_opacity1 3s 0s infinite linear; -webkit-animation:character_opacity1 3s 0s infinite linear; }
.character_view .effect09 { animation:character_opacity2 3s 0s infinite linear; -webkit-animation:character_opacity2 3s 0s infinite linear; }
.character_view .effect10 { animation:character_updwon2 5s 0s infinite linear; -webkit-animation:character_updwon2 5s 0s infinite linear; }

@keyframes character_eyes {
    0% { background-image: url('/images/Subpage/img_character_bg01_02.png'); }
    10% { background-image: url('/images/Subpage/img_character_bg01_03.png'); }
    15% { background-image: url('/images/Subpage/img_character_bg01_02.png'); }
    100% {background-image: url('/images/Subpage/img_character_bg01_02.png'); }
}
@keyframes character_rotate {
    0% { transform:rotate(0);  -webkit-transform:rotate(0); }
    25% { transform:rotate(-45deg);  -webkit-transform:rotate(-45deg); }
    50% { transform:rotate(0deg); -webkit-transform:rotate(0deg); }
    75% { transform:rotate(45deg); -webkit-transform:rotate(45deg); }
}
@keyframes character_updwon1 {
    50% { top:30%; }
}
@keyframes character_updwon2 {
    50% { top:53.8%; }
}
@keyframes character_updwon3 {
    50% { top:49.31%; }
}
@keyframes character_leftright {
    0% { top:10.5%; right:12.93%; }
    20% { top:12.5%; right:13.93%; }
    40% { top:10.5%; right:15.93%; }
    60% { top:12.5%; right:14.93%; }
    80% { top:10.5%; right:13.93%; }
    100% { top:10.5%; right:12.93%; }
}
@keyframes character_opacity1 {
    50% { opacity:1; }
}
@keyframes character_opacity2 {
    50% { transform:scale(1.5); -webkit-transform:scale(1.5); opacity:1; }
}

/*-- E : 페이지 스타일 --*/