/* 서브페이지 키비쥬얼 */
#FOOTER-MENU_CONTACT_US .gu_kv .kv_img_area {background-image: url('../../../img/footer-menu/contact-us/kv_contact-us.jpg')}

/* 공통 */
#FOOTER-MENU_CONTACT_US .gu_sort_area .gu_selectbox{max-height: 320px;}
#FOOTER-MENU_CONTACT_US .gu_line {margin:60px auto;}
#FOOTER-MENU_CONTACT_US .gu_btn_area.submit {margin-top:70px; text-align:center;}
#FOOTER-MENU_CONTACT_US .gu_btn_area .gu_btn {min-width: 160px;}

#FOOTER-MENU_CONTACT_US .contents_inner>.section{margin-top: 100px;}
#FOOTER-MENU_CONTACT_US .contents_inner .section .inner{border: 1px solid #ccc;width: 100%;height: 100%;position: relative;padding: 75px 112px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#FOOTER-MENU_CONTACT_US .user_list_area .user_list_area_info{position: absolute;right: 112px;top: 55px;font-size: 14px;color: #666}

/* popup */
#POP_SUBMIT.popup {position: fixed;left: 0;right: 0;top: 0;bottom: 0;overflow-y: auto;display: none;z-index: 9999;}
#POP_SUBMIT.popup.show {display: block;}
#POP_SUBMIT.popup .dim {position: fixed; width: 100%;height: 100vh;left: 0;top: 0;background: rgba(0, 0, 0, .8);}
#POP_SUBMIT.popup .pop_contents {position: relative;margin: 20px auto;background-color: #fff;text-align: left;width: 90%;max-width: 560px;min-height: 300px;padding: 60px 56px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; text-align:center;}
#POP_SUBMIT.popup .pop_inner {width: 100%;position: relative;left: 0;right: 0;top: 50%;}
#POP_SUBMIT.popup .pop_inner.active {opacity: 1}
#POP_SUBMIT.popup .pop_inner .popup_click_bg {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
#POP_SUBMIT.popup .pop_inner .pop_detail_box {position: relative}
#POP_SUBMIT.popup .pop_contents .pop_detail_box .pop_cnt_head {border-bottom: 1px solid #000;padding-bottom: 32px}
#POP_SUBMIT.popup .pop_contents .pop_detail_box .pop_cnt_head .cnt_head_tit {font-size: 32px}
#POP_SUBMIT.popup .pop_contents .pop_detail_box .pop_cnt_head .cnt_head_sub {font-size: 18px;color: #666;margin-top: 12px}

/* form */
#FOOTER-MENU_CONTACT_US form ul li {font-size:0;margin:40px 0;}
#FOOTER-MENU_CONTACT_US form ul li > div {display:inline-block; vertical-align:top;}
#FOOTER-MENU_CONTACT_US form ul li > div.input_tit {width:200px;line-height:50px; padding-top:6px; height:50px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
#FOOTER-MENU_CONTACT_US form ul li > div.input_tit span.required {color: #ff3333; font-size:18px; line-height:30px; margin-left:6px;}
#FOOTER-MENU_CONTACT_US form ul li > div.input_box {width:calc(100% - 200px);font-size:18px; font-size:0;}
#FOOTER-MENU_CONTACT_US form ul li > div.input_box input {font-size:18px;width:100%; height:50px;border-bottom:1px solid #ccc; vertical-align:bottom;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
#FOOTER-MENU_CONTACT_US form ul li > div.input_box .gu_selectbox {min-width:100%;}

/* mail */
#FOOTER-MENU_CONTACT_US form ul li.mail_area > div.input_box input.input_mail_id {width:200px;}
#FOOTER-MENU_CONTACT_US form ul li.mail_area > div.input_box input.input_mail_domain {width:calc(100% - 251px);}
#FOOTER-MENU_CONTACT_US form ul li.mail_area > div.input_box span.cform {padding:0 12px; margin-bottom:18px; color:#222;-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; display:inline-block;width:40px; font-size:16px;}

/* country */
#FOOTER-MENU_CONTACT_US form ul li.country_area > div.input_box .gu_sort_area {width:230px;}
#FOOTER-MENU_CONTACT_US form ul li.country_area > div.input_box .gu_sort_area .gu_sort_name {width:230px;}
#FOOTER-MENU_CONTACT_US form ul li.country_area > div.input_box .gu_sort_area .gu_sort_name a {width:230px;height: 50px;padding: 15px 20px 17px 0}
#FOOTER-MENU_CONTACT_US form ul li.country_area > div.input_box .gu_sort_area .gu_sort_name:before {top: 50%;transform: translateY(-50%)}
#FOOTER-MENU_CONTACT_US form ul li.contents_area textarea {width:100%; height:300px; line-height:28px; padding:40px 30px; font-size:16px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;background:#f7f7f7;resize: none}

/* category */
#FOOTER-MENU_CONTACT_US form ul li.category_area > div.input_box .gu_sort_area {width:320px;}
#FOOTER-MENU_CONTACT_US form ul li.category_area > div.input_box .gu_sort_area .gu_sort_name {width:320px;}
#FOOTER-MENU_CONTACT_US form ul li.category_area > div.input_box .gu_sort_area .gu_sort_name a {width:320px;height: 50px;padding: 15px 20px 17px 0}
#FOOTER-MENU_CONTACT_US form ul li.category_area > div.input_box .gu_sort_area .gu_sort_name:before {top: 50%;transform: translateY(-50%)}

/* contents */
#FOOTER-MENU_CONTACT_US form ul li.contents_area {margin:50px 0;}
#FOOTER-MENU_CONTACT_US form ul li.contents_area > div.input_tit {padding-top:0;}

/* file */
#FOOTER-MENU_CONTACT_US form ul li.file_area {position: relative;}
#FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area {position: relative; font-size:0;}
#FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area .input_file_name {width: calc(100% - 140px);background: #fff; margin-left:20px;border:none; height:50px; font-size:14px;}
#FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area label {display:inline-block; width: 90px; height: 40px; line-height: 40px; font-size: 14px; text-align: center;margin: 0 auto;border: 1px solid #bcbcbc;background-color: #fff;cursor:pointer;color:#222;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;}
#FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area #file {position: absolute;left: 0;top: 0;display: inline-block;width:90px;height:40px;cursor:pointer;-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity: 0;}
#FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area .btn_delete {position: absolute; right: 0; top: 50%; display: inline-block; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%); display:none;}
#FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area .btn_delete span {font-size:16px;color:#999;}
#FOOTER-MENU_CONTACT_US form ul li.file_area p.caption {color: #999; margin-top:25px; font-size:14px;}

/* agree */
#FOOTER-MENU_CONTACT_US .agree_area .gu_box_title {margin-bottom:30px;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner {padding:36px 25px 35px 40px;background:#f7f7f7;height:420px;-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea {height:368px;overflow-y:scroll; padding-right:25px;color:#555;overflow-x:hidden;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea::-webkit-scrollbar {width: 4px;height: 1px;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea::-webkit-scrollbar-track {background-color: #f7f7f7;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea::-webkit-scrollbar-track-piece {background-color: #f7f7f7;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea::-webkit-scrollbar-thumb {background-color: #a8a8a8;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea::-webkit-scrollbar-button:start {background-color: #f7f7f7;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea::-webkit-scrollbar-button:end {background-color: #f7f7f7;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea strong {display:block;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea [class*='type_bullet'] li {position:relative; padding-left:10px;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea [class*='type_bullet'] li:before {content:'-'; position:absolute;left:0;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea .gu_box_sub_title {margin:20px 0 15px;}

#FOOTER-MENU_CONTACT_US .agree_area .agree_desc {padding-top:30px;color:#222;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_desc.agree_all {padding-top:40px;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_desc > div {display:inline-block; vertical-align:middle;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_desc .btn_agree {position:relative;float:right;cursor:pointer;}
#FOOTER-MENU_CONTACT_US .agree_area .agree_desc .btn_agree:before {content:''; position:absolute; width:20px;height:20px;left:-30px;top:50%;border:1px solid #c8c8c8; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%);}
#FOOTER-MENU_CONTACT_US .agree_area .agree_desc .btn_agree.on:after {content:''; position:absolute; width:12px;height:12px;left:-25px;top:50%;background:#222; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%);}


.category_area.category2 {display:none;}
.category_area.category2.active {display:block;}
.category_area.category2.active .gu_selectbox .gu_selectbox_inner a {display:none;}
.category_area.category2.active .gu_selectbox .gu_selectbox_inner a.active,
.category_area.category2.active .gu_selectbox .gu_selectbox_inner a.on {display:block;}

.category_area.category3 {display:none;}
.category_area.category3.active {display:block;}
.category_area.category3.active .gu_selectbox .gu_selectbox_inner a {display:none;}
.category_area.category3.active .gu_selectbox .gu_selectbox_inner a.active,
.category_area.category3.active .gu_selectbox .gu_selectbox_inner a.on {display:block;}

/* ================================== Tablet css ================================== */
@media all and (max-width: 1080px) {

    #FOOTER-MENU_CONTACT_US .gu_btn_area .gu_btn {min-width: 140px; padding: 13px 38px;}

    #FOOTER-MENU_CONTACT_US .contents_inner>.section{margin-top: 30px;}
    #FOOTER-MENU_CONTACT_US .contents_inner .section .inner{padding: 55px}
    #FOOTER-MENU_CONTACT_US .user_list_area .user_list_area_info{right: 55px;top: 30px;font-size: 12px;}
    #FOOTER-MENU_CONTACT_US form ul li {margin:30px 0;}
    #FOOTER-MENU_CONTACT_US form ul li > div.input_tit {width:150px;}
    #FOOTER-MENU_CONTACT_US form ul li > div.input_box {width:calc(100% - 150px);}
    #FOOTER-MENU_CONTACT_US form ul li > div.input_box input {font-size:15px;}
    #FOOTER-MENU_CONTACT_US form ul li.contents_area textarea {font-size:13px;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area .input_file_name {font-size:14px;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area p.caption {font-size:12px;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area #file {width:80px; height:40px;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area label {font-size:12px;height:40px; line-height:40px;min-width:80px; padding:0 10px;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area .input_file_name {height:40px;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area p.caption {margin-top:15px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc { font-size:14px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc .btn_agree:before { width:18px; height:18px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc .btn_agree:after { width:10px; height:10px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc.agree_all { font-size:16px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc.agree_all > div { font-size:16px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner {padding:25px 20px 25px 30px;}
}

/* ================================== Mobile css ================================== */
@media all and (max-width: 766px) {
    .gu_kv .sec_inner .copy_area .sub_copy br{display: none;}
    #FOOTER-MENU_CONTACT_US .contents_inner .section .inner{padding: 70px 20px 60px}
    #FOOTER-MENU_CONTACT_US .user_list_area .user_list_area_info{right: 20px;top: 38px;}
    #FOOTER-MENU_CONTACT_US .gu_line {margin:50px auto;}
    #FOOTER-MENU_CONTACT_US form ul li {margin:20px 0;}
    #FOOTER-MENU_CONTACT_US form ul li.contents_area {margin:20px 0;}
    #FOOTER-MENU_CONTACT_US form ul li > div.input_tit {width:100%; padding-top:0; height:35px;}
    #FOOTER-MENU_CONTACT_US form ul li > div.input_tit span.required {margin-left:4px;}
    #FOOTER-MENU_CONTACT_US form ul li > div.input_box {width:100%;}
    #FOOTER-MENU_CONTACT_US form ul li > div.input_box input {font-size: 14px;}
    #FOOTER-MENU_CONTACT_US form ul li.mail_area > div.input_box input.input_mail_id {width:36%;}
    #FOOTER-MENU_CONTACT_US form ul li.mail_area > div.input_box input.input_mail_domain {width:calc(64% - 40px);}
    #FOOTER-MENU_CONTACT_US form ul li.contents_area textarea {margin-top:13px;}
    #FOOTER-MENU_CONTACT_US form ul li.country_area > div.input_box .gu_sort_area,
    #FOOTER-MENU_CONTACT_US form ul li.country_area > div.input_box .gu_sort_area .gu_sort_name,
    #FOOTER-MENU_CONTACT_US form ul li.country_area > div.input_box .gu_sort_area .gu_sort_name a,
    #FOOTER-MENU_CONTACT_US form ul li.category_area > div.input_box .gu_sort_area,
    #FOOTER-MENU_CONTACT_US form ul li.category_area > div.input_box .gu_sort_area .gu_sort_name,
    #FOOTER-MENU_CONTACT_US form ul li.category_area > div.input_box .gu_sort_area .gu_sort_name a {width:100%;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area {margin-top:15px;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area .upload_area .btn_delete span {font-size:13px;}
    #FOOTER-MENU_CONTACT_US form ul li.file_area p.caption {font-size:12px; line-height:18px;}
    #FOOTER-MENU_CONTACT_US .agree_area .gu_box_title {font-size:16px; margin-bottom:20px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner {padding:30px 10px 30px 20px; height:250px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner .textarea {height:188px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc {font-size:14px; line-height:24px; padding-top:12px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc .btn_agree:before {width:16px; height:16px;left:-26px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc .btn_agree.on:after {width:10px; height:10px;left:-22px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc {font-size: 13px; line-height: 23px; padding-top: 12px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc .btn_agree { font-size:14px; line-height:24px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_desc.agree_all > div { font-size:14px;line-height:24px;}
    #FOOTER-MENU_CONTACT_US .agree_area .agree_box_inner {padding:25px 20px 10px 20px;}

    .gu_content .gu_box_sub_title {font-size:14px; line-height:24px;}
    #FOOTER-MENU_CONTACT_US .gu_btn_area.submit {margin-top:50px;}
    #FOOTER-MENU_CONTACT_US .gu_btn_area .gu_btn {min-width: 125px; padding: 10px 38px;}


}