@charset "utf-8";
/* CSS Document */
#page_description_area .description-container .description:after { width: 437px; height: 402px; background: url(../../img/sub/mypage/description.png); top: 10px; }

/* 주문현황 */
#container .content .content-area .content-content .order-info-wrap .order-process { margin-bottom: 35px; padding-bottom: 35px; border-bottom: 1px solid #dcdcdc; }
#container .content .content-area .content-content .order-info-wrap .credit-error-notice-wrap { border-top: 3px solid #5283e0; background: #fbfbfb; }
#container .content .content-area .content-content .order-info-wrap .credit-error-notice-wrap .credit-error-notice { border-left: 1px solid #e9e9e9; border-right: 1px solid #e9e9e9; border-bottom: 1px solid #e9e9e9; padding: 30px; }
#container .content .content-area .content-content .order-info-wrap .credit-error-notice-wrap .credit-error-notice .title-area { font-size: 18px; font-weight: bold; color: #555; padding-bottom: 25px; border-bottom: 1px solid #e8e8e8; }
#container .content .content-area .content-content .order-info-wrap .credit-error-notice-wrap .credit-error-notice .title-area img { vertical-align: top; margin-top: 6px; margin-right: 3px; }
#container .content .content-area .content-content .order-info-wrap .credit-error-notice-wrap .credit-error-notice .txt-area { margin-top: 25px; font-size: 14px; }
#container .content .content-area .content-content .order-info-wrap .credit-error-notice-wrap .credit-error-notice .input-area { height: 50px; background: #fff; border-radius: 3px; box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.15); border: 1px solid #dcdcdc; margin-top: 25px; position: relative; }
#container .content .content-area .content-content .order-info-wrap .credit-error-notice-wrap .credit-error-notice .input-area button { position: absolute; height: 27px; padding: 0 10px; background: #5283e0; border-radius: 3px; border: none; right: 10px; top: 10px; color: #fff; font-size: 13px; cursor: pointer; outline: 0; }
#container .content .content-area .content-content .order-info-wrap .credit-error-notice-wrap .credit-error-notice .input-area input { height: 100%; width: 100%; padding: 0 200px 0 15px; font-size: 14px; outline: 0; }
#container .content .content-area .content-content .counseling-wrap .input-area span.notice {font-size:13px; color:#5283e0; padding-left:10px; margin-bottom:10px; display: inline-block}
#container .content .content-area .content-content .counseling-wrap .input-area span.notice img {vertical-align: top; margin-top:3px; margin-right:5px;}


#container .content .content-area .content-content .mypage-list-wrap { margin-top: 50px; }
#container .content .content-area .content-content .mypage-list-wrap .title-area { font-size: 20px; color: #2d2d2d; margin-bottom: 10px; }
#container .content .content-area .content-content .mypage-list-wrap .list-table { border-top: 3px solid #5283e0; }
#container .content .content-area .content-content .mypage-list-wrap table { width: 100%; }
#container .content .content-area .content-content .mypage-list-wrap .list-table table thead { background: #f8f8f8; }
#container .content .content-area .content-content .mypage-list-wrap .list-table table thead tr th { height: 60px; font-weight: bold; font-size: 15px; color: #2d2d2d; text-align: center; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table thead tr th.numb { width: 10%; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table thead tr th.order-numb { width: 13%; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table thead tr th.date { width: 15%; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table thead tr th.service-name { width: 25%; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table thead tr th.price { width: 15%; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table thead tr th.order-status { width: 22%; }
#container .content .content-area .content-content .mypage-list-wrap .list-table table tr { border-bottom: 1px solid #dcdcdc; }
#container .content .content-area .content-content .mypage-list-wrap .list-table table tbody tr td { padding: 20px 5px; text-align: center; background: #fff; color: #434343; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tbody tr td .cancel-btn { color: #c83f3f; border: 1px solid #d37b7c; border-radius: 2px; height: 23px; background: #fff; font-size: 12px; cursor: pointer; padding: 0 5px; line-height: 21px; margin-left: 5px; outline: 0; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tbody tr td .cancel-btn:hover { background: #c83f3f; color: #fff; border-color: #c83f3f; }

#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-list { cursor: pointer; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-list:hover td { background: #f8f8f8; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail { display: none;}
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td { overflow: hidden; padding: 20px; background: #EAEDF3; position: relative; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 2; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer { width: 300px; height: 250px; background: #fff; position: absolute; z-index: 3; left: 50%; top: 50%; margin-left: -150px; margin-top: -125px; box-shadow: 0 5px 10px 0px rgba(0,0,0,0.1); padding: 40px 40px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer.load { height: 160px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer .ico { padding: 20px; border: 3px solid #5283E0; width: 75px; height: 75px; display: inline-block;  border-radius: 50%; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer .ico img { margin-top: 3px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer p { font-weight: bold; margin-top: 10px; color: #555; font-size: 14px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer .btn-wrap { margin-top: 20px; overflow: hidden; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer .btn-wrap button { width: 50%; float: left; border: none; height: 40px; font-size: 13px; cursor: pointer; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer .btn-wrap button.application-view { background: #0F203D; color: #fff; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer .btn-wrap button.credit-progress { background: #5283E0; color: #fff; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer .btn-wrap button.confirm-btn { width: 100%; background: #0F203D; color: #fff; }

#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer-order { width: 500px; background: #fff; position: absolute; z-index: 3; left: 50%; top: 50%; margin-left: -250px; margin-top: -165px; box-shadow: 0 5px 10px 0px rgba(0,0,0,0.1); padding: 40px 40px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer-order .subject { text-align: left; display: block; font-size: 15px; font-weight: bold; color: #5283E0; margin-bottom: 10px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer-order table { width: 100%; border-top: 1px solid #5283e0; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer-order table tr th { padding: 8px 10px; text-align: left; background: #F8F8F8; font-size: 13px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer-order table tr td { padding: 8px 10px; text-align: left; background: #fff; font-size: 13px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer-order .btn-wrap { margin-top: 20px; overflow: hidden; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer-order .btn-wrap button { width: 50%; border: none; height: 40px; font-size: 13px; cursor: pointer; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail>td .open-block .block-layer-order .btn-wrap button.application-view { background: #0F203D; color: #fff; }

#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .order-info { width: 50%; float: left; padding-right: 10px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-status { width: 50%; float: right; padding-left: 10px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .subject { text-align: left; display: block; font-size: 15px; font-weight: bold; color: #5283E0; margin-bottom: 10px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td table { width: 100%; border-top: 1px solid #5283e0; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td table tr th { padding: 8px 10px; text-align: left; background: #F8F8F8; font-size: 13px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td table tr td { padding: 8px 10px; text-align: left; background: #fff; font-size: 13px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-wrap { padding: 20px 0 30px; position: relative;}
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-wrap .progress-round { display: inline-block; width: 90px; height:90px; border: 3px solid #C0C8D5; border-radius: 50%; font-size: 14px; font-weight: bold; line-height: 84px; color: #AAB5C7; margin: 0 10px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-wrap .progress-round.on { color: #5283E0; border-color: #5283E0; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-wrap .review-complete { background: rgba(255,255,255,0.8); top: 60px; position: absolute; z-index: 1; width: 100%; padding: 30px 0; box-shadow: 0 5px 10px 5px rgba(0,0,0,0.05); border: 3px solid #5283E0; color: #5283E0; font-weight: bold; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-wrap .review-complete p { font-size: 15px; }

#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-status .comment { padding: 20px 10px; border-radius: 5px; background: #D6DCE7; font-weight: bold; font-size: 13px; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-status .btn-wrap { margin-top: 30px; overflow: hidden; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-status .btn-wrap button { width: 50%; float: left; height: 50px; border: none; font-size: 14px; font-weight: bold; cursor: pointer; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-status .btn-wrap button.application-view { background: #0F203D; color: #fff; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-status .btn-wrap button.receive { background: #5283E0; color: #fff; }
#container .content .content-area .content-content .mypage-list-wrap .order-list-table table tr.order-detail td .progress-status .btn-wrap button:disabled { opacity: 0.5; cursor: not-allowed; }

.application-preview-layer { display: none; position: fixed; z-index: 10; background: #fff; width: 700px; height: 800px; left: 50%; margin-left: -350px; top: 50%; margin-top: -450px; padding: 30px; overflow-y: auto; text-align: left; border-top: 3px solid #5283E0; box-shadow: 0 5px 10px 5px rgba(0,0,0,0.1); }

/* 신청서 작성 */
.application-preview-layer .application-form .application-title { font-size: 20px; color: #2d2d2d; margin-bottom: 30px; }
.application-preview-layer .application-form .input-area { margin-bottom: 25px; position: relative; }
.application-preview-layer .application-form .input-title { font-size: 17px; font-weight: bold; color: #2d2d2d; margin-bottom: 10px; }
.application-preview-layer .application-form .input-title .imp { color: #e60012; margin-left: 5px; }
.application-preview-layer .application-form  input[type=text] { width: 100%; height: 50px; font-size: 15px; border: 1px solid #dcdcdc; padding: 0 15px; }
.application-preview-layer .application-form .input-area .notice { margin-top: 7px; display: block; font-size: 14px; color: #555; }
.application-preview-layer .application-form .input-area .notice img { margin-top: 3px; margin-right: 5px; display: inline-block; vertical-align: top; }
.application-preview-layer .application-form .input-area .notice .imp { color: #5283e0; font-weight: bold; }
.application-preview-layer .application-form .input-area .paragraph-add-btn { height: 40px; width: 110px; background: #32cb97; color: #fff; border: none; border-radius: 20px; position: absolute; right: 0; bottom: 0; box-shadow: 0px 5px 10px 0px rgba(4, 0, 0, 0.15); outline: 0; cursor: pointer; }

.application-preview-layer .application-form .resume-input-area-wrap .resume-paragraph-select { height: 40px; border-bottom: 1px solid #5283e0; margin-bottom: 30px; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-paragraph-select ul {  display: inline-block; height: 100%; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-paragraph-select ul li { float: left; width: 70px; height: 100%; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-paragraph-select ul li a { display: block; height: 100%; background: #fff; border: 1px solid #dcdcdc; font-size: 15px; line-height: 38px; color: #9d9d9d; border-bottom: none; text-align: center;  }
.application-preview-layer .application-form .resume-input-area-wrap .resume-paragraph-select ul li.select a { border-color: #5283e0; color: #5283e0; font-weight: bold; position: relative; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-paragraph-select ul li.select a:after { position: absolute; z-index: 2; left: 0; bottom: -1px; content: ''; background: #fff; width: 100%; height: 1px; }

/* 셀렉트 커스텀 */
.selectbox { position: relative; border-style: none;  z-index: 1; display: inline-block; height: 50px; width: 100%; vertical-align: top; transition: background .25s ease; background: #fff; border: 1px solid #5283e0; border-radius: 3px; margin-bottom: 10px; }
.selectbox:hover { background: #f8f8f8; }
.selectbox:before { content: "";  position: absolute; top: 50%; margin-top: -10px; right: 8px; background: url(../../img/sub/common/down_b_ico.svg) no-repeat; width: 20px; height: 20px; opacity: 0.5; }
.selectbox label { position: absolute; top: 0; left: 0; color: #222;  z-index: -1;  /* IE8에서 label이 위치한 곳이 클릭되지 않는 것 해결 */ font-size: 15px; line-height: 48px; text-align: left; width: 90%; padding-left: 15px; cursor: pointer; font-weight: bold; color: #5283e0; }
.selectbox select { width: 100%; line-height: normal;  /* line-height 초기화 */ font-family: inherit; border: 0; opacity: 0;  /* 숨기기 */  filter:alpha(opacity=0);  /* IE8 숨기기 */ -webkit-appearance: none; /* 네이티브 외형 감추기 */  -moz-appearance: none; appearance: none; margin-left: 0; height: 48px; cursor: pointer; padding: 8px; }
.selectbox select option { padding-left: 10px; font-size: 14px; }

.application-preview-layer .application-form .resume-input-area-wrap .resume-input-area { margin-bottom: 25px; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-input-area .input-title { color: #5283e0; font-size: 15px; }
.application-preview-layer .application-form .input-title .custom-check { display: none; }
.application-preview-layer .application-form .input-title .custom-check-label { padding-left: 20px; position: relative; font-size: 13px; cursor: pointer; line-height: 20px; color: #666;  margin-left: 10px;}
.application-preview-layer .application-form .input-title .custom-check-label:before { width: 14px; height: 14px; position: absolute; content: ''; background: url(../../img/sub/common/check.png); background-size: 14px 28px; background-repeat: no-repeat; background-position: 0 0; left: 0; top: 50%; margin-top: -7px; }
.application-preview-layer .application-form .input-title .custom-check:checked + .custom-check-label:before { background: url(../../img/sub/common/check.png); background-size: 14px 28px; background-repeat: no-repeat; background-position: 0 -14px; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-input-area .input-title .text-limit-view { float: right; color: #555; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-input-area .text-limit-input { position: relative; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-input-area .text-limit-input input[type=text] { width: 200px; text-align: right; padding-right: 40px; }
.application-preview-layer .application-form .resume-input-area-wrap .resume-input-area .text-limit-input .unit { position: absolute; left: 170px; top: 15px; font-size: 15px; }
.application-preview-layer .application-form .input-area textarea { margin-top: 15px; }
.application-preview-layer .application-form  textarea { width: 100%; border: 1px solid #dcdcdc; font-size: 15px; padding: 15px; height: 420px; }
.application-preview-layer .application-form .input-area.request-content textarea { height: 270px; }

.application-preview-layer .application-form .input-area .point-input { margin-top: 15px; }
.application-preview-layer .application-form .input-area .point-input input[type=text] { width: 150px; text-align: right; }
.application-preview-layer .application-form .input-area .point-input span.point { font-size: 12px; vertical-align: bottom; margin-left: 10px; }
.application-preview-layer .application-form .input-area .coupon-input { margin-top: 15px; }
.application-preview-layer .application-form .input-area .coupon-input:after { clear: both; height: 0; content: ''; display: block; }
.application-preview-layer .application-form .input-area .coupon-input input[type=text] { width: 155px; float: left; }
.application-preview-layer .application-form .input-area .coupon-input .hypen { font-size: 25px; float: left; line-height: 50px; color: #CDCDCD; width: 40px; text-align: center; }
.application-preview-layer .application-form .input-area .coupon-reset-btn { height: 40px; width: 110px; background: #d85451; color: #fff; border: none; border-radius: 20px; position: absolute; right: 0; top: 75px; box-shadow: 0px 5px 10px 0px rgba(4, 0, 0, 0.15); outline: 0; cursor: pointer; }

.application-preview-layer .application-form .input-area .working-time-input-wrap { margin-top: 10px; }
.application-preview-layer .application-form .input-area .working-time-input-wrap .working-time-input { height: 50px; }
.application-preview-layer .application-form .input-area .working-time-input-wrap .working-time-input:after { clear: both; display: block; height: 0; content: ''; }
.application-preview-layer .application-form .input-area .working-time-input-wrap .working-time-input .input-title { color: #5283e0; font-size: 15px; float: left; width: 220px; line-height: 50px; margin-bottom: 0; }
.application-preview-layer .application-form .input-area .working-time-input-wrap .working-time-input .time-select { float: left; width: 520px; padding-top: 13px; }
.application-preview-layer .application-form .input-area .working-time-input-wrap .working-time-input .time-select ul li { display: inline-block; margin-right: 30px; }
.application-preview-layer .application-form .input-area .working-time-input-wrap .working-time-input input[type=text] { float: left; width: 520px; }

.application-preview-layer .application-form .cost-summary-table { margin-top: 80px; position: relative; border-top: 1px solid #c6cbdc; background: #f8f8f9; }
.application-preview-layer .application-form .cost-summary-table:before { position: absolute; content: ''; height: 1px; width: 100%; left: 0; top: -40px; border-top: 1px dashed #ccc; }
.application-preview-layer .application-form .cost-summary-table .row { padding: 2px 20px 2px 20px; font-size: 14px; color: #555; }
.application-preview-layer .application-form .cost-summary-table .row:after { clear: both; height: 0; content: ''; display: block; }
.application-preview-layer .application-form .cost-summary-table .row:first-child { padding-top: 15px; }
.application-preview-layer .application-form .cost-summary-table .row .head { float: left; }
.application-preview-layer .application-form .cost-summary-table .row .cost { float: right; }
.application-preview-layer .application-form .cost-summary-table .result-row { margin-top: 13px; border-top: 1px solid #c6cbdc; padding: 15px 20px; background: #e8eaf0; }
.application-preview-layer .application-form .cost-summary-table .result-row:after { clear: both; height: 0; content: ''; display: block; }
.application-preview-layer .application-form .cost-summary-table .result-row .head { font-size: 17px; font-weight: bold; color: #27457d; float: left; }
.application-preview-layer .application-form .cost-summary-table .result-row .cost { float: right; font-size: 17.7px; font-weight: bold; color: #27457d; }
.application-preview-layer .application-form .application-btn { width: 100%; border: none; height: 65px; background: #5283e0; font-size: 18px; color: #fff; cursor: pointer; }
.application-preview-layer .application-form .application-btn:hover { background: #4475D4; }

.application-preview-layer .application-form .credit-notice-wrap { margin-top: 40px; }
.application-preview-layer .application-form .credit-notice-wrap .notice { font-size: 14px; }
.application-preview-layer .application-form .credit-notice-wrap .notice img { vertical-align: top; margin-top: 3px; margin-right: 5px; }
.application-preview-layer .application-form .credit-notice-wrap .notice .imp { color: #5283e0; }
.application-preview-layer .application-form .credit-notice-wrap .notice .imp-02 { color: #e05252; }
.application-preview-layer .application-form .credit-notice-wrap .bank-account { margin-top: 20px; }
.application-preview-layer .application-form .credit-notice-wrap .bank-account img { width: 130px; margin-right: 10px; }
.application-preview-layer .application-form .credit-notice-wrap .bank-account span { vertical-align: top; margin-top: 8px; display: inline-block; color: #000; font-weight: bold; }

/* 결제내역 확인 */
.application-preview-layer .application-form .service-info-table { border-top: 3px solid #5283E0; }
.application-preview-layer .application-form .service-info-table table { width: 100%; border: 1px solid #e7e7e7; font-size: 14px; color: #555; }
.application-preview-layer .application-form .service-info-table table tbody tr { border-bottom: 1px solid #e7e7e7; }
.application-preview-layer .application-form .service-info-table table tbody tr th { width: 180px; background: #fbfbfb; border-right: 1px solid #e7e7e7; padding: 10px 20px; }
.application-preview-layer .application-form .service-info-table table tbody tr td { background: #fff; padding: 10px 20px; }
.application-preview-layer .application-form .service-info-table table tbody tr td input[type=text] { height: 35px; font-size: 14px; margin-bottom: 5px; }

#container .content .content-area .content-content .paging { margin-top:  40px; text-align: center; }
#container .content .content-area .content-content .paging ul li { display: inline-block; margin: 0 2px; }
#container .content .content-area .content-content .paging ul li.navi-arrow { border: 1px solid #dadada; border-radius: 17px; }
#container .content .content-area .content-content .paging ul li.navi-arrow a { display: block; width: 100%; height: 100%; }
#container .content .content-area .content-content .paging ul li.navi-arrow img { display: inline-block; vertical-align: top; margin-top: 11px; }
#container .content .content-area .content-content .paging ul li a { display: block; min-width: 34px; height: 34px; border-radius: 17px; line-height: 34px; }
#container .content .content-area .content-content .paging ul li a:hover { background: #DDDDDD; }
#container .content .content-area .content-content .paging ul li.select a { background: #5283e0; color: #fff; }

/* 포인트, 쿠폰 */
#container .content .content-area .content-content .point-coupon-info-wrap .top-area { background: #5283e0; padding: 30px; }
#container .content .content-area .content-content .point-coupon-info-wrap .top-area .title-area { border-bottom: 3px solid #a2bae8; padding-bottom: 10px; }
#container .content .content-area .content-content .point-coupon-info-wrap .top-area .title-area h3 { display: inline-block; font-size: 18px; color: #fff; }
#container .content .content-area .content-content .point-coupon-info-wrap .top-area .title-area p { display: inline-block; font-size: 14px; color: #cedefd; margin-left: 7px; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area { background: #fff; border: 1px solid #e0e0e0; border-top: none; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area:after { content: ''; clear: both; height: 0; display: block; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area .point-area { width: 50%; float: left; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area .coupon-area { width: 50%; float: left; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area>div { padding: 20px 30px; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area>div>div:after { content: ''; clear: both; height: 0; display: block; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area>div>div { border-bottom: 1px solid #e0e0e0; padding-bottom: 15px; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area>div>div .head { float: left; font-size: 15px; font-weight: bold; color: #2d2d2d; line-height: 25px; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area>div>div .value { float: right; line-height: 25px; font-weight: bold; color: #2d2d2d; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area>div>div .head img { vertical-align: top; margin-right: 5px; }
#container .content .content-area .content-content .point-coupon-info-wrap .bottom-area>div>div.coupon .head img { margin-top: 3px; }

/* 개인정보 변경 */
#container .content .content-area .content-content .user-info-wrap .subject-t { font-size: 20px; font-weight: bold; color: #2d2d2d; display: block; margin-bottom: 35px; padding-bottom: 15px; border-bottom: 3px solid #5283e0; }
#container .content .content-area .content-content .user-info-wrap .subject-s { font-size: 13px; font-weight: bold; color: #555; display: block; margin-bottom: 3px; }
#container .content .content-area .content-content .user-info-wrap input[type=text],
#container .content .content-area .content-content .user-info-wrap input[type=password] { border: 1px solid #dcdcdc; height: 50px; font-size: 13px; font-weight: bold; outline: 0; padding: 0 10px; }
#container .content .content-area .content-content .user-info-wrap input[type=text]:disabled { background: #f3f3f3; cursor: not-allowed; }
#container .content .content-area .content-content .user-info-wrap input[type=password] { width: 100%; }
#container .content .content-area .content-content .user-info-wrap .row { margin-bottom: 20px; }
#container .content .content-area .content-content .user-info-wrap .row:after { clear: both; height: 0; display: block; content: ''; }
#container .content .content-area .content-content .user-info-wrap .row .layer { width: 350px; }
#container .content .content-area .content-content .user-info-wrap .row .layer.user-id { float: left; }
#container .content .content-area .content-content .user-info-wrap .row .layer.user-name { float: right; }
#container .content .content-area .content-content .user-info-wrap .row .layer.platform { width: 100%; }
#container .content .content-area .content-content .user-info-wrap .row .layer input[type=text] { width: 100%; }

#container .content .content-area .content-content .user-info-wrap .row .phone:after { clear: both; height: 0; display: block; content: ''; }
#container .content .content-area .content-content .user-info-wrap .row .phone .selectbox { width: 220px; float: left; }
#container .content .content-area .content-content .user-info-wrap .row .phone .hypen { float: left; color: #999; margin: 0 5px; height: 50px; line-height: 50px; width: 20px; text-align: center; }
#container .content .content-area .content-content .user-info-wrap .row .phone input[type=text] { width: 230px; float: left; }

#container .content .content-area .content-content .user-info-wrap .basic-info-area,
#container .content .content-area .content-content .user-info-wrap .password-info-area { position: relative; }
#container .content .content-area .content-content .user-info-wrap .password-info-area { margin-top: 65px; }
#container .content .content-area .content-content .user-info-wrap .change-btn { position: absolute; top: -10px; right: 0; background: #d85451; height: 40px; border-radius: 20px; padding: 0 15px; border: none; color: #fff; font-size: 13px; line-height: 40px; outline: 0; cursor: pointer; box-shadow: 0px 5px 10px 0px rgba(4, 0, 0, 0.15); }

#container .content .content-area .content-content .user-info-wrap .row .platform-input { background: #F3F3F3; border: 1px solid #dcdcdc; height: 50px; padding: 11px 10px; cursor: not-allowed; line-height: 25px; }
#container .content .content-area .content-content .user-info-wrap .row .platform-input .logo { display: inline-block; width: 25px; height: 25px; vertical-align: top; margin-right: 5px; }
#container .content .content-area .content-content .user-info-wrap .row .platform-input .logo img { width: 100%; height: auto; }
#container .content .content-area .content-content .user-info-wrap .row .platform-input p { display: inline-block; color: #222; margin-top: 1px; font-size: 13px; }
#container .content .content-area .content-content .user-info-wrap .row .platform-input p .platform { font-weight: bold; }

/* 1:1 상담 */

/* 셀렉트 커스텀 */
#container .content .content-area .content-content .counseling-wrap .selectbox { position: relative; border-style: none;  z-index: 1; display: inline-block; height: 50px; width: 100%; vertical-align: top; transition: background .25s ease; background: #fff; border: 1px solid #5283e0; border-radius: 3px; margin-bottom: 10px; }
#container .content .content-area .content-content .counseling-wrap .selectbox:hover { background: #f8f8f8; }
#container .content .content-area .content-content .counseling-wrap .selectbox:before { content: "";  position: absolute; top: 50%; margin-top: -10px; right: 8px; background: url(../../img/sub/common/down_b_ico.svg) no-repeat; width: 20px; height: 20px; opacity: 0.5; }
#container .content .content-area .content-content .counseling-wrap .selectbox label { position: absolute; top: 0; left: 0; color: #222;  z-index: -1;  /* IE8에서 label이 위치한 곳이 클릭되지 않는 것 해결 */ font-size: 15px; line-height: 48px; text-align: left; width: 90%; padding-left: 15px; cursor: pointer; font-weight: bold; color: #5283e0; }
#container .content .content-area .content-content .counseling-wrap .selectbox select { width: 100%; line-height: normal;  /* line-height 초기화 */ font-family: inherit; border: 0; opacity: 0;  /* 숨기기 */  filter:alpha(opacity=0);  /* IE8 숨기기 */ -webkit-appearance: none; /* 네이티브 외형 감추기 */  -moz-appearance: none; appearance: none; margin-left: 0; height: 48px; cursor: pointer; padding: 8px; }
#container .content .content-area .content-content .counseling-wrap .selectbox select option { padding-left: 10px; font-size: 14px; }

#container .content .content-area .content-content .counseling-wrap .header { font-size: 20px; font-weight: bold; color: #2d2d2d; margin-bottom: 20px; border-bottom: 5px solid #5283e0; padding-bottom: 5px; }
#container .content .content-area .content-content .counseling-wrap input[type=text] { width: 100%; height: 52px; border: 1px solid #dcdcdc; padding: 0 15px; font-size: 15px; margin-bottom: 10px; }
#container .content .content-area .content-content .counseling-wrap input[type=text].call {margin-bottom:5px; }
#container .content .content-area .content-content .counseling-wrap textarea { width: 100%; height: 420px; padding: 15px; font-size: 15px; border: 1px solid #dcdcdc; }
#container .content .content-area .content-content .counseling-wrap .inquiry-btn { width: 100%; height: 50px; background: #5283e0; border: none; color: #fff; font-size: 15px; font-weight: bold; cursor: pointer; }

#container .content .content-area .content-content .counseling-wrap .history-area { margin-top: 70px; }
#container .content .content-area .content-content .counseling-wrap .history-area .header { margin-bottom: 0; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table { width: 100%;}
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .no { font-size: 15px; text-align: center; padding: 20px; border-bottom: 1px solid #dcdcdc; background-color: #fff; color: #434343;}
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row:after,
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .row-box:after { display: block; content: ''; height: 0; clear: both; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .row-box:hover { cursor: pointer; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row { border-bottom: 1px solid #dcdcdc; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .th { float: left; height: 60px; padding: 19px 5px; font-weight: bold; color: #2d2d2d; background: #f8f8f8; text-align: center; font-size: 15px; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .th.numb,
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .td.numb { width: 10%; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .th.inquiry-title,
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .td.inquiry-title { width: 60%; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .th.answer-status,
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .td.answer-status { width: 15%; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .td.answer-status.comp { color: #5283E0; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .date { width: 15%;}
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .td { background: #fff; float: left; padding: 19px 5px; text-align: center; color: #434343; font-size: 15px; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .td.inquiry-title { text-align: left; font-weight: bold; color: #2d2d2d; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .detail-wrap { border-top: 1px solid #dcdcdc; background: #f8f8f8; padding: 25px 25px; display: none; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row.select .detail-wrap { display: block; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .detail-wrap .inquiry-title { font-size: 15px; color: #2d2d2d; font-weight: bold; margin-bottom: 10px; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .detail-wrap .question { padding: 0 30px 25px; position: relative; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .detail-wrap .question:before { width: 13px; height: 18px; background: url(../../img/sub/customer-center/Q_ico_02.png); top: 3px; left: 0; position: absolute; content: ''; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .detail-wrap .answer { padding: 25px 30px 0; border-top: 1px dashed #c0c0c0; position: relative; }
#container .content .content-area .content-content .counseling-wrap .history-area .history-table .row .detail-wrap .answer:before { width: 14px; height: 16px; background: url(../../img/sub/customer-center/A_ico.png); top: 27px; left: 0; position: absolute; content: ''; }

/* 셀렉트 커스텀 */
.selectbox { position: relative; border-style: none;  z-index: 1; display: inline-block; height: 50px; width: 170px; vertical-align: top; transition: background .25s ease; background: #fff; border: 1px solid #dcdcdc; }
.selectbox:hover { background: #f8f8f8; }
.selectbox:before { content: "";  position: absolute; top: 50%; margin-top: -10px; right: 8px; background: url(../../img/sub/common/down_b_ico.svg) no-repeat; width: 20px; height: 20px; opacity: 0.5; }
.selectbox label { position: absolute; top: 0; left: 0; color: #222;  z-index: -1;  /* IE8에서 label이 위치한 곳이 클릭되지 않는 것 해결 */ font-size: 13px; line-height: 48px; text-align: left; width: 90%; padding-left: 10px; cursor: pointer; font-weight: bold; }
.selectbox select { width: 100%; line-height: normal;  /* line-height 초기화 */ font-family: inherit; border: 0; opacity: 0;  /* 숨기기 */  filter:alpha(opacity=0);  /* IE8 숨기기 */ -webkit-appearance: none; /* 네이티브 외형 감추기 */  -moz-appearance: none; appearance: none; margin-left: 0; height: 48px; cursor: pointer; padding: 8px; }
.selectbox select option { padding-left: 10px; font-size: 13px; }

/* 토글 버튼 */
#container .content .content-area .content-content .point-coupon-info-wrap .video-type-select { height: 50px; width: 320px; display: block; margin: 40px auto; }
#container .content .content-area .content-content .point-coupon-info-wrap .video-type-select ul { display: block; height: 100%; }
#container .content .content-area .content-content .point-coupon-info-wrap .video-type-select ul:after { content: ''; clear: both; height: 0; display: block; }
#container .content .content-area .content-content .point-coupon-info-wrap .video-type-select ul li { float: left; height: 100%; width: 50%; }
#container .content .content-area .content-content .point-coupon-info-wrap .video-type-select ul li a { font-size: 15px; text-align: center; display: block; height: 100%; background: #fff; border: 1px solid #dcdcdc; line-height: 48px; color: #9d9d9d; }
#container .content .content-area .content-content .point-coupon-info-wrap .video-type-select ul li.select a { background: #5283e0; color: #fff; border-color: #5283e0; }