@charset "utf-8";

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 공통 - UI 
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
#skip_navi {display:none;}
body {background-color:#fff;}
.page_bg_gray {background-color:#f4f5f9;}
#wrapper {background-repeat:no-repeat; background-position:center top; box-sizing: border-box;}

.base_width {margin:0 auto; width:1300px; position:relative;}

/* 데스크탑 */
@media all and (max-width:1300px){      
      .base_width {padding:0 10px; width:100%; box-sizing:border-box;}
}


/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 공통 헤더 
 //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.header_pos {width:100%; min-width:320px; text-align:center; border-bottom:solid 0px #a1a6a7; background-color:#fff; transition: all 0.5s;
      -webkit-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.20);
      -moz-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.20);
      box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.20);
}

.header {margin:0 auto; width:1300px; height:70px; position:relative;}
h1.logo {float:left; height:70px; line-height:70px;}
h1.logo img {}

/* 데스크탑 */
@media all and (max-width:1300px){
      .header {padding:0 10px; width:100%; box-sizing:border-box;}
}

/* 태블릿 */
@media all and (max-width:1024px){
}
@media all and (max-width:768px){
      h1.logo img {height:40px;}
}

/* 모바일 */
@media all and (max-width:414px){
      h1.logo img {height:40px;}
}

/* 대메뉴 //////////////////////////////////////////////////////////////////////////*/
.gnbarea {float:right;}
.gnbarea ul.gnb {height:70px;}
.gnbarea ul.gnb>li {float:left; display:block; position:relative;}
.gnbarea ul.gnb>li a.title {display:block; padding:0 20px; height:67px; line-height:67px; color:#000; font-size:18px; border-bottom:solid 3px #fff; background-color:#fff; transition: all 0.5s ease-out;}

.gnbarea ul.gnb>li .submenu {display:none; width:170px; position:absolute; top:70px; left:0; opacity:0; z-index:10;}
.gnbarea ul.gnb>li .submenu ul {margin-top:5px; background-color:#fff; box-shadow: 0px 10px 20px rgba(0,0,0,0.1); border-radius:5px;}
.gnbarea ul.gnb>li .submenu ul li a {display:block; padding:15px 20px; line-height:1.2; color:#333; font-size:14px; text-align:left; border-top:solid 1px #ddd;}
.gnbarea ul.gnb>li .submenu ul li:first-child a {border-top:none;}
.gnbarea ul.gnb>li .submenu ul li a:hover,
.gnbarea ul.gnb>li .submenu ul li a.active {color:#5757e7;}

.gnbarea ul.gnb>li a.title.active,
.gnbarea ul.gnb>li:hover a.title {color:#5757e7; border-bottom:solid 3px #5757e7;}
.gnbarea ul.gnb>li:hover .submenu {display:block;}



.gnbarea ul.gnb>li.func_box {padding:20px 0 20px 10px;}

.gnbarea ul.gnb>li.func_box>a.btn_login {display:inline-block; padding:0 15px; height:30px; line-height:30px; color:#fff; background-color:#959ffd; border-radius:30px;}

.gnbarea ul.gnb>li.func_box>a.btn_login_after {display:inline-block; margin-top:2px;}
.gnbarea ul.gnb>li.func_box>a.btn_login_after i {font-size:20px; color:#666; vertical-align:middle;}
.gnbarea ul.gnb>li.func_box>a.btn_login_after span {display:inline-block; vertical-align:middle;}

.user_info_pop {padding:15px; width:180px; text-align:left; position:absolute; top:75px; right:0; z-index:100;
      border-radius:10px; background-color:#fff; box-shadow:5px 5px 20px 0 #ccc;}
.user_info_pop ol {}
.user_info_pop ol li {padding:5px;}
.user_info_pop ol li a {color:#666;}
.user_info_pop ol li a:hover {color:#000;}
.user_info_pop ol li i {margin-right:5px; color:#999;}
.user_info_pop .authority_select {margin-top:5px; padding-top:5px; border-top:solid 1px #ddd;}
.user_info_pop .authority_select select {margin:3px 0; width:100%; border-radius:5px; box-sizing:border-box;}

.btn_sidemenu {display:none;}

/* 데스크탑 */
@media all and (max-width:1300px){
      .gnbarea ul.gnb>li a.title {padding:0 10px;}
}
/* 테블릿 */
@media all and (max-width:768px){
      .gnbarea {display:none;}
      
      a.btn_sidemenu {display:inline-block; width:50px; height:50px; line-height:55px; text-align:center; position:absolute; top:10px; right:5px;}
      a.btn_sidemenu i {font-size:22px;}
}


/* 모바일 사이드 메뉴 //////////////////////////////////////////////////*/
.gnbarea_mobile {position:absolute; top:0; right:-300px; width:300px; height:100vh; height:100%; background-color:#fff; z-index:300;}
.gnbarea_mobile .outline {height:100vh; height:calc(100% - 50px); overflow-y:auto; box-sizing:border-box;}
.gnbarea_mobile .self_info_area {position:relative; background-color:#f5f5f5;}
.gnbarea_mobile .self_info_area .btn_sidemenu_close {display:inline-block; width:50px; height:50px; line-height:50px; text-align:center; position:absolute; top:10px; right:0;}
.gnbarea_mobile .self_info_area .btn_sidemenu_close i {font-size:20px;}


/* 모바일 로그인 영역 */
.logo_mobile {padding:15px;}
.logo_mobile img {height:36px;}
.loginbox_mobile {padding:30px 15px; border-bottom:solid 3px #f2f2f2; background-color:#fff;}
.loginbox_mobile .btn_main_login {width:100%; height:42px; font-size:16px; color:#333; border:solid 2px #333; background-color:transparent; border-radius:50px; transition: all 0.3s; position:relative; top:0;}

.loginbox_mobile .before {}
.loginbox_mobile .before input[type="text"],
.loginbox_mobile .before input[type="password"] {padding-left:35px; margin-bottom:10px; width:100%; height:40px; color:#333; box-sizing:border-box; border:none; border-bottom:solid 1px #ccc; transition: all 0.5s;}
.loginbox_mobile .before input[type="text"]:focus,
.loginbox_mobile .before input[type="password"]:focus {border-bottom:solid 1px #333;}
.loginbox_mobile .before input::placeholder {color:#333;}
.loginbox_mobile .before .input_id {background:url('../images/login/icon_email.png') no-repeat 10px 9px;}
.loginbox_mobile .before .input_pw {background:url('../images/login/icon_key.png') no-repeat 10px 9px;}
.loginbox_mobile .before .func {padding-bottom:20px; text-align:right;} 
.loginbox_mobile .before .func input[type="checkbox"] {border:none;}


.loginbox_mobile .after .userinfo {padding:5px 0; border-bottom:solid 1px #f2f2f2; position:relative;}
.loginbox_mobile .after .userinfo .user_txbox {padding:5px 0 5px 35px; line-height:28px; text-align:center; color:#333;}
.loginbox_mobile .after .userinfo .user_txbox i {display:inline-block; font-size:28px; color:#999; vertical-align:middle;}
.loginbox_mobile .after .userinfo .user_txbox span {display:inline-block; font-size:14px; color:#333; vertical-align: middle;}
.loginbox_mobile .after .userinfo .user_txbox strong {font-size:18px;}

.loginbox_mobile .after .selectbox {padding:10px 5px; border-bottom:solid 1px #f2f2f2;}
.loginbox_mobile .after .selectbox select {width:100%; border-radius:5px;}

.loginbox_mobile .after .bottom {padding-top:10px}
.loginbox_mobile .after .bottom button.btn_main_login {width:100%; height:46px; font-size:16px; background-color:#ffb400; border-radius:50px; transition: all 0.5s;}
.loginbox_mobile .after .bottom button.btn_main_login:hover {color:#333; background-color:#f2f2f2;}

.loginbox_mobile .after .bottom button.btn_myclass {width:100%; height:42px; font-size:16px; color:#333; border:solid 2px #333; background-color:transparent; border-radius:50px; transition: all 0.3s; position:relative; top:0;}


/* 모바일 메뉴 */
ul.gnb_mobile {margin:0 10px 50px; border-top:solid 1px #fff;}
ul.gnb_mobile>li {border-bottom:solid 1px #f2f2f2; }
ul.gnb_mobile>li a.title {display:block; display:block; padding:10px 15px; color:#333; font-size:16px; position:relative;}
ul.gnb_mobile>li a.title i {font-size:12px; transition: all 0.3s ease-out; position:absolute; top:calc(50% - 6px); right:10px;}
ul.gnb_mobile>li a.title.active {color:#5757e7; font-weight:600;}
ul.gnb_mobile>li a.title.active i {transform: rotate(180deg);}
ul.gnb_mobile>li .submenu {padding:0 10px 10px; background-color:#fff;}
ul.gnb_mobile>li .submenu>ul {}
ul.gnb_mobile>li .submenu>ul>li>a {display:block; padding:0 20px 0 30px; height:35px; line-height:40px; color:#333; border-top:solid 1px #eee; position:relative;}
ul.gnb_mobile>li .submenu>ul>li>a:after {display:block; content:'-'; color:#333; position:absolute; left:15px; top:0;}
ul.gnb_mobile>li .submenu>ul>li:first-child>a {border-top:none;}
ul.gnb_mobile>li .submenu>ul>li>a:hover,
ul.gnb_mobile>li .submenu>ul>li>a.active {color:#5757e7;}
ul.gnb_mobile>li .submenu>ul>li>a.active:after {display:block; content:'-'; color:#5757e7; position:absolute; left:15px; top:0;}

.modal_screen_sidemenu {width:100%; height:100%; background-color:rgba(0,0,0,0.7); position:absolute; top:0; left:0; z-index:150;}

.gnbarea_mobile .bottom_func {padding:0; width:100%; height:50px; border-top:solid 1px #e2e2e2; background-color:#f5f5f5; position:absolute; bottom:0; left:0;}
.gnbarea_mobile .bottom_func ul {overflow:hidden;}
.gnbarea_mobile .bottom_func ul li {float:left; width:50%; text-align:center;}
.gnbarea_mobile .bottom_func ul li a {display:block; height:50px; line-height:50px; color:#555555; border-left:solid 1px #ebebeb; border-right:solid 1px #fff;}
.gnbarea_mobile .bottom_func ul li a span {display:inline-block; vertical-align:middle;}
.gnbarea_mobile .bottom_func ul li:first-child a {border-left:none;}
.gnbarea_mobile .bottom_func ul li:last-child a {border-right:none;}
.gnbarea_mobile .bottom_func ul li a i {vertical-align: middle;}


@media all and (max-width:1500px){
}

/* 테스크탑 */
@media all and (max-width:1024px){
}
/* 테블릿*/
@media all and (max-width:768px){
      .gnbarea {display:none;}
      
      a.btn_sidemenu {display:inline-block; width:50px; height:50px; line-height:55px; text-align:center; position:absolute; top:10px; right:5px;}
      a.btn_sidemenu i {font-size:22px;}
}
/* 모바일*/
@media all and (max-width:640px){
}

@media all and (max-width:414px){   
      
}


/*///////////////////////////////////////////////////////////////////////////////////////////////
 로그인
 ///////////////////////////////////////////////////////////////////////////////////////////////*/
.login_page {margin:0 auto; padding:10px; width:790px; box-sizing:border-box; background-color:#fff; border-radius:10px;
      position:absolute; top:calc(50% - 250px); left:50%; margin-left:-395px;}
.login_page .outline {display:table; width:100%; height:500px;}
.login_page .outline .thum {display:table-cell; width:335px; background:url('../images/login/thum.png') no-repeat center center #333; background-size:cover; border-radius:3px; box-sizing:border-box;}

.login_box {display:table-cell; padding:0 30px; text-align:center; vertical-align:middle; box-sizing:border-box;}
.login_box .inner_box {padding:40px 0; margin:0 auto; width:300px;}
.login_box h2 {padding:5px 0 20px; text-align:center; font-size:24px; color:#666666;}
.login_box h2 img {vertical-align:middle;}
.login_box h2 span {display:inline-block; margin-left:10px; padding-left:15px; vertical-align:middle; position:relative;}
.login_box h2 span:after {display:block; content:''; width:1px; height:18px; background-color:#ccc; clear:both; position:absolute; top:calc(50% - 9px); left:0;}

.login_ment {margin-bottom:5px; font-size:12px;}

.login_box button.btn_login {width:100%; height:38px; font-size:18px; color:#fff; background-color:#93a0ff; border-radius:30px;}
.login_box input[type="text"] {margin-bottom:13px; padding-left:40px; width:100%; height:38px; font-size:16px; color:#999999; border-radius:38px; color:#333; background:url('../images/login/icon_email.png') no-repeat 15px center #efefef; border:none; box-sizing:border-box;}
.login_box input[type="password"] {margin-bottom:13px; padding-left:40px; width:100%; height:38px; font-size:16px; color:#999999; border-radius:38px; color:#333; background:url('../images/login/icon_key.png') no-repeat 15px center #efefef; border:none; box-sizing:border-box;}

.login_box .func_area {display:flex; padding:20px 10px; justify-content:space-between;}
.login_box .func_area a {display:inline-block; padding:0 10px; line-height:1; font-weight:600; color:#666; letter-spacing:-1px;}
.login_box .func_area a:hover {color:#000;}


.sns_login_row {padding-top:20px; border-top:solid 1px #dfdfdf;}
.sns_login_row ul li {border-radius:5px;}
.sns_login_row ul li.kakao {background-color:#f9de38;}
.sns_login_row ul li .sns_icon {display:inline-block; width:45px; height:45px;}
.sns_login_row ul li .name {display:inline-block;}

.sns_login {padding:20px 25px 0; border-top:solid 1px #dfdfdf;}
.sns_login ul {display:flex; justify-content:space-between;}
.sns_login ul li {}
.sns_login ul li a {}
.sns_login ul li span.sns_icon {display:block; text-align:center; width:61px; height:61px; border-radius:60px;}
.sns_login ul li span.name {display:inline-block; margin-top:5px; line-height:1.1; color:#666666;}
.sns_login ul li.google span.sns_icon {border:solid 1px #ccc;}

/* 테블릿*/
@media all and (max-width:820px){
      .login_page {width:96%; left:2%; margin-left:0;}
      .login_page .outline .thum {width:335px;}      
}

@media all and (max-width:640px){
      .login_page .outline .thum {display:none;}
      .login_box {padding:0; box-sizing: border-box;}      
}
/* 모바일*/
@media all and (max-width:480px){   
      .login_page {width:90%; left:5%;}
      .login_page .outline {height:initial;}
      .login_box .inner_box {width:300px;}      

      .sns_login ul li span.sns_icon {width:45px; height:45px;}
}
@media all and (max-width:400px){   
      .login_box {padding:0;}
      .login_ment {letter-spacing:-1px;}
      .login_box .inner_box {padding:20px 0; width:280px; box-sizing: border-box;}
}

@media all and (max-width:360px){   
      .login_box .inner_box {padding:20px 10px; width:100%;}
}

/*///////////////////////////////////////////////////////////////////////////////////////////////
 아이디/비번찾기
 ///////////////////////////////////////////////////////////////////////////////////////////////*/
.idpw_find_box {width:430px; position:absolute; top:calc(50% - 300px); left:50%; margin-left:-215px;}
.idpw_find_box h2 {margin-bottom:30px; text-align:center;}
.idpw_find_box h2 img {height:40px; vertical-align:middle;}
.idpw_find_box h2 span {margin-left:5px; vertical-align:middle; color:#333; font-size:18px;}

 ul.idpw_tabmenu {margin:0 auto 30px; display:flex; justify-content:space-between; text-align:center; border-bottom:solid 1px #ccc; position:relative;}
  ul.idpw_tabmenu li {display:block; width:50%;}
 ul.idpw_tabmenu li a {display:block; padding:0 10px; height:46px; line-height:46px; color:#999; font-size:18px; text-align:center; position:relative; bottom:0px;}
 ul.idpw_tabmenu li a:hover {color:#333;}
 ul.idpw_tabmenu li a.active {color:#5757e7; font-weight:700;}
 ul.idpw_tabmenu li a.active:after {display:block; content:''; width:100%; height:3px; background-color:#5757e7; position:absolute; left:0; bottom:-1px; transition: all 0.5 ease-out;}

 .idpw_find_box .cont_id_find {margin:0 auto; padding:20px 0; width:380px;}
 .idpw_find_box .cont_pw_find {margin:0 auto; padding:20px 0; width:380px;}
 .idpw_find_box span.title {display:block; margin-top:15px; padding:0 0 5px 5px;}
 .idpw_find_box span.title:first-child {margin-top:0;}
 .idpw_find_box .error_msg {color:#ff0000;}
 .idpw_find_box button.btn_idfind {padding:0; margin-top:15px; width:100%; height:40px; font-size:16px; color:#fff; border-radius:5px; line-height:40px; box-sizing:border-box; background-color:#93a0ff;}
 .idpw_find_box button.btn_idfind:hover {opacity:0.9;}
 .idpw_find_box input[type="email"], 
 .idpw_find_box input[type="text"], 
 .idpw_find_box input[type="password"] {padding:0 15px; margin-bottom:5px; width:100%; height:40px; border-radius:5px; box-sizing:border-box;}
 .idpw_find_box select {padding:0 10px; height:38px; border:solid 1px #ddd; border-radius:5px; background-color:#fff; box-sizing:border-box;}

 .idpw_find_box .form_footer {display:flex; justify-content:space-between; padding:15px 0;}

 .bottom_func {padding:25px 0; margin-top:25px; text-align:center; border-top:dotted 1px #ccc;}
 .bottom_func button {width:100%; border-radius:5px;}
 
 /* 테스크탑 */
 @media all and (max-width:1200px){
 }
 /* 테블릿*/
 @media all and (max-width:768px){
        ul.idpw_tabmenu li a {height:40px; line-height:40px; font-size:14px;}
       
       .idpw_find_box {width:400px; margin-left:-200px;}

       .idpw_find_box .cont_id_find {display:block; padding:20px; width:initial; vertical-align:top;}
       .idpw_find_box .cont_pw_find {display:block; padding:20px; width:initial; vertical-align:top;}
 }
 /* 모바일*/
 @media all and (max-width:480px){
      .idpw_find_box {width:80%; margin-left:0; left:10%;}

      .idpw_find_box h2 img {height:30px;}
      .idpw_find_box h2 span {display:block; margin-left:0; margin-top:10px; font-size:22px;}

      .idpw_find_box .cont_id_find,
      .idpw_find_box .cont_pw_find {padding:0 10px;}

      .idpw_find_box input[type="email"], .idpw_find_box input[type="text"], .idpw_find_box input[type="password"] {width:100%;}
 }

/*///////////////////////////////////////////////////////////////////////////////////////////////
 회원가입
 ///////////////////////////////////////////////////////////////////////////////////////////////*/
.membership_page {margin:50px auto; width:460px;}
.membership_page h2 {margin-bottom:20px; text-align:center;}
.membership_page h2 img,
.membership_page h2 span {margin-left:5px; vertical-align:middle; color:#333;}
.membership_page .form_content {padding:30px 50px; background-color:#fff; border-radius:10px; border:solid 1px #ddd;}
.membership_page .form_footer {display:flex; justify-content:space-between; padding:15px 0;}

.membership_page .member_title {margin-top:20px; font-size:18px; color:#999;}
.membership_page .member_title:first-child {margin-top:0;}

.membership_page select {padding:0 15px; height:38px; border:solid 1px #ddd; border-radius:5px; background-color:#fff; box-sizing:border-box;}
.membership_page input[type="text"],
.membership_page input[type="email"],
.membership_page input[type="number"],
.membership_page input[type="password"] {padding:0 15px; width:100%; height:38px; border:solid 1px #ddd; border-radius:5px; background-color:#fff; box-sizing:border-box;}
.membership_page textarea {padding:15px; width:100%; border:solid 1px #ddd; border-radius:5px; background-color:#fff; box-sizing:border-box; resize: vertical;}

.membership_page .inner_btn {margin-bottom:5px; padding-right:105px; position:relative;}
.membership_page .inner_btn input {}
.membership_page .inner_btn button {width:100px; height:38px; background-color:#fff; border:solid 1px #999; border-radius:5px; position:absolute; top:0; right:0;}
.membership_page .inner_btn button:hover {color:#5757e7; border:solid 1px #5757e7;}

.membership_page .inner_full {margin-bottom:5px;}
.membership_page .inner_full label {vertical-align:middle;}

.membership_page .confirm_msg {color:#5757e7;}

/* 모바일*/
@media all and (max-width:480px){   
      .membership_page {width:94%;}
      .membership_page .form_content {padding:30px 20px;}
      .membership_page .inner_btn {padding-right:95px;}
      .membership_page .inner_btn button {width:90px;}
}

/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  button
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
 .btn {padding:10px; border-radius:30px;}
 .btn_md {padding:0 15px; height:35px; line-height:35px; font-size:14px;}
 .btn_mx {padding:0 20px; height:40px; line-height:40px; font-size:16px;}

 .bg_white {background-color:#fff; border:solid 1px #999999;}
 .bg_white:hover {border:solid 1px #333;}

 .bg_gray {background-color:#ededed; border:solid 1px #ededed;}
 .bg_gray:hover {border:solid 1px #ededed;}

 .bg_blue {color:#fff; background-color:#5757e7; border:solid 1px #5757e7;}
 .bg_blue:hover {opacity:0.9;}

 .bg_primary {color:#fff; background: linear-gradient(90deg, rgba(255,102,0,1) 0%, rgba(147,160,255,1) 100%); border:none;}
 .bg_primary:hover {background: linear-gradient(90deg, rgba(255,102,0,1) 0%, rgba(255,102,0,1) 100%);}

 
 /* 모바일*/
 @media all and (max-width:640px){
      .btn_md {padding:0 13px; height:32px; line-height:32px; font-size:14px;}
      .btn_mx {padding:0 16px; height:36px; line-height:36px; font-size:14px;}
 }

 /*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 공통 팝업
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* 공통 팝업 */
.modal_common_pop {width:640px; border-radius:10px; overflow:hidden; position:fixed; top:100px; left:50%; margin-left:-320px; z-index:160;}
.modal_common_pop.modal_large {width:1000px; margin-left:-500px;}
.modal_common_pop.modal_middle {width:768px; margin-left:-384px;}
.modal_common_pop.modal_small {width:480px; margin-left:-240px;}

.modal_common_pop .pop_header {padding:25px 30px; background-color:#5757e7; position:relative;}
.modal_common_pop .pop_header h3 {margin-right:30px; font-size:22px; color:#fff; line-height:1.2;}
.modal_common_pop .pop_header .btn_modal_close {font-size:18px; font-weight:normal; color:#fff; background-color:transparent; position:absolute; top:calc(50% - 12px); right:15px;}

.modal_common_pop .pop_body {padding:25px; background-color:#fff;}
.modal_common_pop .pop_footer {padding:20px; text-align:right; border-top:solid 1px #ddd; background-color:#fff;}
.modal_common_pop .pop_footer button {margin:0 2px; padding:0 25px; height:38px; border-radius:5px;}

 /* 테블릿 */
 @media all and (max-width:1024px){ 
      .modal_common_pop.modal_large {width:92%; left:4%; margin-left:0;}
}
 @media all and (max-width:768px){ 
      .modal_common_pop.modal_middle {width:92%; left:4%; margin-left:0;}
 }
 /* 모바일 */
 @media all and (max-width:480px){ 
      .modal_common_pop.modal_small {width:92%; left:4%; margin-left:0;}
      .modal_common_pop .pop_header {padding:20px 15px;}
      .modal_common_pop .pop_header h3 {font-size:18px;}
      .modal_common_pop .pop_body {padding:15px;}
      .modal_common_pop .pop_footer {padding:10px; text-align:center;}
 }

 /* 공통 팝업(안내) */
.modal_guide_pop {width:480px; border-radius:10px; overflow:hidden; position:absolute; top:100px; left:50%; margin-left:-240px; z-index:160;}
.modal_guide_pop .pop_header {padding:15px 20px; background-color:#fff; position:relative;}
.modal_guide_pop .pop_header h3 {margin-right:30px; font-size:20px; color:#333; line-height:1.2;}
.modal_guide_pop .pop_header .btn_modal_close {font-size:18px; font-weight:normal; color:#333; background-color:transparent; position:absolute; top:calc(50% - 12px); right:15px;}

.modal_guide_pop .pop_body {padding:20px; border-top:solid 1px #ddd; background-color:#fff;}
.modal_guide_pop .pop_footer {padding:10px; text-align:center; border-top:solid 1px #ddd; background-color:#fff;}
.modal_guide_pop .pop_footer button {margin:0 2px; padding:0 25px; height:38px; border-radius:5px;}

 /* 모바일 */
 @media all and (max-width:480px){ 
      .modal_guide_pop {width:92%; left:4%; margin-left:0;}
      .modal_guide_pop .pop_header {padding:10px 15px;}
      .modal_guide_pop .pop_header h3 {font-size:18px;}
      .modal_guide_pop .pop_body {padding:20px 15px;}
 }


/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 팝업
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.modal_screen {width:100%; height:100%; background-color:rgba(51,55,97,0.9); position:fixed; top:0; left:0; z-index:150; overflow:hidden;}

/* 리뷰 전용 팝업 */
.modal_pop_product {width:1000px; height:calc(100% - 100px); background-color:#fff; border-radius:10px; overflow:hidden; position:fixed; top:50px; left:50%; margin-left:-500px; z-index:160;}
.modal_pop_product .pop_header {padding:30px 30px 20px; position:relative;}
.modal_pop_product .btn_modal_close {font-size:20px; font-weight:normal; width:20px; height:20px; background-color:transparent; position:absolute; top:15px; right:15px;}
.modal_pop_product .pop_body {padding:0 30px 30px; height:calc(100% - 150px); overflow:scroll; box-sizing:border-box;}

.product_review {padding-left:146px; margin-right:20px; overflow:hidden;}

.product_review .thum {float:left; margin-left:-146px; width:126px; height:126px; border-radius:10px; overflow:hidden; position:relative;}
.product_review .detail_info {float:right; padding-top:10px; width:100%;}
.product_review .detail_info strong.title {display:block; margin-bottom:15px; font-size:30px; line-height:34px;
      max-height:68px; 
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical;
      overflow:hidden;
      text-overflow:ellipsis}

.product_review .detail_info.coupang {display:table; padding-top:0; width:100%; height:126px;}
.product_review .detail_info.coupang strong.title {display:table-cell; vertical-align:middle;}

.product_review .detail_info .add_info {color:#666;}
.product_review .detail_info .add_info span {margin-right:15px;}
.product_review .detail_info .add_info span:last-child {margin-right:0;}

.product_review .detail_info .add_info .review,
.product_review .detail_info .add_info .top_market,
.product_review .detail_info .add_info .product_market {display:inline-block;}

.product_review .detail_info .add_info .review  strong {color:#cc0000;}
.product_review .detail_info .add_info .top_market strong {color:#cc0000;}
.product_review .detail_info .add_info .product_market strong {color:#cc0000;}

/* 테스크탑 */
 @media all and (max-width:1024px){
      .modal_pop_product {width:96%; left:2%; margin-left:0;}
      .product_review .detail_info strong.title {font-size:26px; line-height:30px; max-height:60px; }
 }
 /* 테블릿*/
 @media all and (max-width:768px){   
      .product_review {padding-left:126px;}
      .product_review .thum {float:left; margin-left:-126px; width:106px; height:106px;}
      .product_review .detail_info.coupang {height:106px;}
      .product_review .detail_info strong.title {font-size:22px; line-height:26px; max-height:52px;}
 }
 /* 모바일*/
 @media all and (max-width:640px){
      .product_review {padding-left:90px;}
      .product_review .thum {float:left; margin-left:-90px; width:80px; height:80px;}
      .product_review .detail_info {padding-top:5px;}
      .product_review .detail_info.coupang {height:80px;}
      .product_review .detail_info strong.title {margin-bottom:10px; font-size:18px; line-height:22px; max-height:44px;}
 }
 @media all and (max-width:480px){
      .modal_pop_product .pop_header {padding:30px 20px 0;}
      .modal_pop_product .pop_body {padding:0 20px 30px;}
}


/* 평점 및 엑셀 다운로드 */
.review_top {display:flex; justify-content:space-between;  align-items:center; margin-top:10px; padding-bottom:10px; border-bottom:solid 1px #ccc;}
.rate_sort {position:relative;}

.rate_sort {}
.rate_sort ul {display:table;}
.rate_sort ul li {display:table-cell; text-align:center; vertical-align:middle;}
.rate_sort ul li a {display:block; padding:0 10px; line-height:1;}
.rate_sort ul li span.face {display:inline-block; height:30px; line-height:1.5;}
.rate_sort ul li span.face i {font-size:24px; transform: scale(1); color:#ccc;  vertical-align:middle; transition: all 0.4s cubic-bezier(.47,1.64,.41,.8);}
.rate_sort ul li span.num {display:inline-block; margin-left:3px; vertical-align:middle; color:#999; font-size:16px;}
.rate_sort ul li a.active span.face i {transform: scale(1.3); color:#ffd40b;}
.rate_sort ul li a.active span.num {color:#333; font-weight:600;}

.review_top .func {}
.review_top .func button span {color:#666666;}
.review_top .func button {color:#999;}

/* 테스크탑 */
@media all and (max-width:1300px){
}
 @media all and (max-width:1024px){
 }
 /* 테블릿*/
 @media all and (max-width:768px){   
 }
 /* 모바일*/
 @media all and (max-width:640px){
      .review_top {display:block; padding-top:10px;}
      .review_top .rate_sort {margin-bottom:10px; float:right;}      
      .rate_sort ul li a {padding:0 7px;}
      .review_top .func {clear:both; text-align:right;}
 }

/* 리뷰 리스트 */
.review_list {padding-top:15px;}
.review_list .review_sum {font-size:24px; color:#666666;}
.review_list .review_sum strong {color:#ff3300;}

.review_list ul {}
.review_list ul li {padding:15px 0; border-bottom:solid 1px #ccc;}
.review_list ul li .cont_txt {color:#666666;}
.review_list ul li .rate_result {padding-top:10px;}
.review_list ul li .rate_result i {color:#ffd40b; font-size:16px;}
.review_list ul li .rate_result i.not {color:#ccc;}
.review_list ul li .rate_result span {margin-left:10px; color:#666;}

/* 테스크탑 */
@media all and (max-width:1300px){
}
 @media all and (max-width:1024px){
 }
 /* 테블릿*/
 @media all and (max-width:768px){   
      .review_list .review_sum {font-size:20px;}
 }
 /* 모바일*/
 @media all and (max-width:640px){
      .review_list .review_sum {font-size:18px;}
 }

/* Go_top */
a.go_page_top {display:inline-block; width:50px; height:50px; line-height:50px; text-align:center; border-radius:50px; background-color:#94a0fd; overflow:hidden;
      position:fixed; bottom:100px; right:10px; z-index:1; box-shadow:0 0 10px rgba(0,0,0,0.2);}
a.go_page_top i {color:#fff; transition:0.3s;}
a.go_page_top:hover {background-color:#5757e7;}

/* 데이터 로딩 */
.modal_data_loading {width:240px; height:50px; position:fixed; top:calc(50% - 25px); left:50%; margin-left:-120px; z-index:160;}
.ani_box {margin:0 auto; width:200px; text-align:center;}
.ani_box strong.title {font-size:22px; color:#fff;}
.ani_box .data_track {display:inline-block; text-align:left; width:130px; height:15px; border-radius:10px; background-color:#1c213e; line-height:1;}
.ani_box .data_track .data_progress {display:inline-block; height:15px; border-radius:10px; background: linear-gradient(90deg, rgba(255,102,0,1) 0%, rgba(147,160,255,1) 100%);}


/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 Footer
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
#footer {padding-top:30px; padding-bottom:70px; color:#666666; background-color:#272e3f; position:relative;}

.footer_top {padding:10px 0 20px;}
.footer_top ul.footer_menu {overflow:hidden;}
.footer_top ul.footer_menu li {float:left; padding:0 20px; position:relative;}
.footer_top ul.footer_menu li:first-child {padding-left:0;}
.footer_top ul.footer_menu li:after {display:block; content:''; height:8px; width:1px; background-color:#787f92;
      position:absolute; top:7px; left:0px;}
.footer_top ul.footer_menu li:first-child:after {display:none;}
.footer_top ul.footer_menu li a {display:block; color:#82899c;}
.footer_top ul.footer_menu li a:hover {text-decoration:underline;}
.footer_top ul.footer_menu li a.btn_footer_policy {color:#5757e7;}

.footer_logo {color:#82899c;}
.footer_logo img {display:block; margin-bottom:5px;}

.footer_copy {padding-top:20px; color:#999999; font-weight:normal;
      word-break:keep-all; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;}
.footer_copy .adress {margin-bottom:10px; color:#82899c;}
.footer_copy .copyright {color:#cdd1d9;}


/* 데스크탑 */
@media all and (max-width:1500px){
}
/* 테블릿 */
@media all and (max-width:768px){
      .footer_logo {}
}
@media all and (max-width:640px){
      .footer_top ul.footer_menu li {padding:0 10px;}
      .footer_top ul.footer_menu li:after {display:block; content:'';}
}
/* 테블릿 */
@media all and (max-width:480px){ 
      .footer_copy .adress {font-size:12px;}
      .footer_copy .copyright {font-size:10px;}
}