@charset "utf-8"; /* 지역사업 제안 */ #info-container .info .sub-gnb .subject .ico-area img { margin-top: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .no-instruction img { width: 100%; margin: 20px 0 40px 0; } /* 공모 테이블 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr th { line-height: 21px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr th:first-child { width: 20%!important; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content { border-right: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap { overflow: hidden; border-left: 1px solid #dcdcdc; border-right: 1px solid #dcdcdc; border-bottom: 1px solid #dcdcdc; border-top: 2px solid #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type { width: 50%; float: left; border-right: 1px solid #dcdcdc; height: 600px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .title { height: 45px; background: #f1f3f8; line-height: 45px; position: absolute; width: 100%; border-bottom: 1px solid #dcdcdc; z-index: 1; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont { padding-top: 45px; overflow: hidden; height: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .si .cont-wrap { padding-top: 45px; height: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .si .cont-wrap .cont { padding-top: 0; height: 25%; border-bottom: 1px solid #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .si .cont-wrap .cont:last-child { border-bottom: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .budget { height: 100%; float: left; width: 60px; position: relative; background: #f8f8f8; border-right: 1px solid #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .budget span { position: absolute; top: 50%; left: 0; margin-top: -17px; z-index: 1; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt { padding-left: 70px; padding-right: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt h5 { font-size: 1.4rem; color: #52a2e4; margin-bottom: 8px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt p { font-size: 1.4rem; font-weight: normal; line-height: 20px; color: #666; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .si { border-right: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .dong .cont .detail-txt { margin-top: 150px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .si .cont .detail-txt { margin-top: 25px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt .s-table { border: 1px solid #dcdcdc; width: 100%; margin-top: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt .s-table tbody tr th, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt .s-table tbody tr td { font-size: 1.2rem; padding: 5px; line-height: 18px; height: 30px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt .s-table tbody tr td { background: #fff; font-weight: normal; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt .s-table tbody tr td:last-child { border-right: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .process li { color: #737373; background: #eaeaea; margin-bottom: 15px; height: 30px; line-height: 30px; font-size: 1.3rem; border-radius: 5px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .process li:after { position: absolute; content: ''; width: 0; height: 0; border-top: 6px solid #eaeaea; border-left: 7.5px solid transparent; border-right: 7.5px solid transparent; top: 30px; left: 50%; margin-left: -7.5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .process li:last-child { background: url(../../img/sub/business/l_process_bg.png); background-size: cover; background-position: center; height: 40px; line-height: 40px; font-size: 1.5rem; color: #fff; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .process li:last-child:after { display: none; } @media all and (max-width:799px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content { padding: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type { float: none; width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .dong { height: 350px; border-bottom: 1px solid #dcdcdc; border-right: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .dong .cont .detail-txt { margin-top: 55px; } } @media all and (max-width:399px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .dong .cont .detail-txt { margin-top: 20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .detail-txt { padding-left: 55px; padding-right: 10px; } } @media all and (max-width:365px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content { padding: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .si .cont .detail-txt { margin-top: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .business-type-wrap .business-type .cont .budget { width: 45px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .instruction-table tbody tr .td-content .process { padding: 5px; } } /* 공모서 버튼 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area { height: 57px; margin-bottom: 20px; overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area a { float: left; height: 100%; border-style: none; width: calc(33.33% - 7px); margin-right: 10px; border-radius: 6px; font-size: 1.6rem; font-weight: bold; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area a:last-child { margin-right: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area a span { display: block; height: 50px; line-height: 50px; vertical-align: top; text-align: center; border-radius: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area .offline-btn { background: #199A81; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area .offline-btn span { color: #fff; background: #20bd9e; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area .online-btn { background: #1a7cce; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area .online-btn span { color: #fff; background: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area .immediate-btn { background: #2939a8; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area .immediate-btn span { color: #fff; background: #5162d3; } @media all and (max-width:860px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area a { width: calc(33.33% - 3px); margin-right: 4px; } } @media all and (max-width:450px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .btn-area { margin-top: 40px; } } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .no-instruction { width: 100%; height: auto; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .guidance-area { text-align: center; font-weight: bold; font-size: 1.6rem; line-height: 2.3rem; color: #e80000; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .download-area { overflow: hidden; margin-bottom: 20px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .download-area ul { text-align: center;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .download-area ul li { height: 40px; display: inline-block; margin: 2.5px 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .download-area ul li a { display: block; height: 100%; border: 1px solid #dcdcdc; border-radius: 20px; padding: 0 20px 0 40px; font-size: 1.4rem; line-height: 38px; position: relative; background: #fff; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .download-area ul li a:hover { font-weight: bold; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .instruction .download-area ul li a:before { position: absolute; content: ''; width: 16px; height: 16px; background: url(../../img/sub/business/hg_ico.png); background-size: 16px 16px; left: 16px; top: 10px; } /* 온라인 접수 폼 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form { border: 1px solid #dcdcdc; padding: 30px; border-radius: 3px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form h4 { font-size: 1.7rem; } @media all and (max-width:799px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form { border: none; padding: 0; } } /* 신청인 정보 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table { border-top: 2px solid #52a2e4; margin-top: 15px; border-bottom: 1px solid #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .row .head { height: 100%; font-size: 1.5rem; font-weight: bold; background: #f1f3f8; width: 120px; border-right: 1px solid #dcdcdc; text-align: center; line-height: 44px; float: left; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .row .cont { padding-left: 135px; font-size: 1.5rem; line-height: 44px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table { overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .left-area { width: 40%; float: left; border-bottom: 1px solid #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area { width: 60%; float: right; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .left-area .row { height: 45px; border-bottom: 1px solid #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .left-area .row:last-child { border-bottom: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area { height: 91px; border-left: 1px solid #dcdcdc; border-bottom: 1px solid #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row { height: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .head { line-height: 90px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont { height: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont input[type=text] { border: 1px solid #dcdcdc; height: 35px; border-radius: 2px; font-size: 1.5rem; font-weight: normal; padding-left: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .postal-code { overflow: hidden; padding-right: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .postal-code input[type=text] { float: left; margin-top: 6px; width: 230px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .postal-code .find-adress-btn { margin-top: 8px; float: right; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .detail { padding-right: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .detail input[type=text] { width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .email-area { clear: both; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .email-area .row .cont { padding-right: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .email-area .row .cont input[type=text] { width: 100%; border: 1px solid #dcdcdc; height: 35px; border-radius: 2px; font-size: 1.5rem; font-weight: normal; padding-left: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .imp { margin-top: 15px; display: inline-block; font-size: 1.4rem; color: #ff0000; } @media all and (max-width:899px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .left-area { float: none; width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area { width: 100%; float: none; border-left: none; border-top: 1px solid #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .postal-code input[type=text] { width: 80%; } } @media all and (max-width:650px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .postal-code input[type=text] { width: 70%; } } @media all and (max-width:555px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .row .head { width: 100px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .row .cont { padding-left: 110px; } } @media all and (max-width:465px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .postal-code input[type=text] { width: 60%; } } @media all and (max-width:390px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .personal-info .form-table .address-area .row .cont .postal-code input[type=text] { width: 50%; } } /* 사업정보입력 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info { margin-top: 30px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table { margin-top: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table { border-top: 2px solid #52a2e4; width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td { padding: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr .th-head, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr th { width: 120px; line-height: 21px; font-size: 1.5rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td input[type=text] { border: 1px solid #dcdcdc; height: 40px; padding-left: 10px; font-size: 1.5rem; border-radius: 2px; width: 100%; line-height: 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .imp { font-size: 1.3rem; font-weight: normal; color: #ff0000; margin-top: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .date-vali{display:none;} @media all and (max-width:555px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr th { width: 65px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td { padding: 5px; } } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td ul li { display: inline-block; margin-right: 10px; margin-top: 1px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td ul li input[type=checkbox], #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td ul li input[type=radio], #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-method-select input[type=radio] { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td ul li label, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-method-select label { font-size: 1.5rem; font-weight: bold; color: #2d2d2d; display: block; height: 30px; line-height: 30px; padding-left: 25px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td ul li label:before, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-method-select label:before { position: absolute; content: ''; width: 15px; height: 15px; background: url(../../img/subCommon/check.png) no-repeat; top: 7px; left: 5px; background-position: 0 0; background-size: 15px 30px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td ul li input[type=checkbox]:checked ~ label, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-method-select input[type=radio]:checked ~ label { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td ul li input[type=checkbox]:checked ~ label:before, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td ul li input[type=radio]:checked ~ label:before, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-method-select input[type=radio]:checked ~ label:before { background-position: 0 -15px; } .youtube-txt { margin: 5px 0; font-size: 1.3rem; font-weight: normal; opacity: 0.3; pointer-events: none; transition: opacity .25s ease; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-method-select input[type=radio]:checked ~ .youtube-txt { opacity: 1; pointer-events: all; } .youtube-txt p { color: #FF6E00; } .youtube-input { opacity: 0.3; pointer-events: none; transition: opacity .25s ease; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-method-select input[type=radio]:checked ~ .youtube-input { opacity: 1; pointer-events: all; } .youtube-input:after { clear: both; display: block; height: 0; content: ''; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-input input[type=text] { width: calc(100% - 150px); float: left; } .youtube-guide { display: inline-block; height: 30px; background: #393939; border-radius: 17.5px; padding: 0 18px; line-height: 30px; font-size: 1.2rem; color: #fff; font-weight: normal; float: right; margin-top: 5px; } .youtube-guide:hover { background: #4B4B4B; } .youtube-guide-pop { position: fixed; z-index: 10; background: rgba(0,0,0,0.3); top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; } .youtube-guide-pop .guide { position: fixed; z-index: 11; background: #fff; width: 600px; left: 50%; margin-left: -300px; height: calc(100% - 200px); top: 100px; border-radius: 10px; overflow: hidden; box-shadow: 0 10px 15px -5px rgba(0,0,0,0.2); } .youtube-guide-pop .guide .guide-head { height: 50px; background: rgba(46,46,46,1.00); padding: 15px 20px; color: #fff; font-size: 1.5rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td .youtube-guide-pop .guide .guide-head img { width: 30px; margin-right: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td .youtube-guide-pop .guide .guide-head .close-btn { float: right; width: 15px; height: 15px; background: none; border: none; outline: 0; margin-top: 3px; opacity: .7; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td .youtube-guide-pop .guide .guide-head .close-btn:hover { opacity: 1; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td .youtube-guide-pop .guide .guide-head .close-btn img { width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td .youtube-guide-pop .guide .guide-txt img { width: auto; max-width: 100%; margin-bottom: 20px; } .youtube-guide-pop .guide .guide-txt { padding: 15px 20px; height: calc(100% - 50px); overflow-y: auto; } .youtube-guide-pop .guide .guide-txt p { display: block; margin-bottom: 8px; font-size: 1.35rem; } .youtube-guide-pop .guide .guide-txt p .numb { background: #52a2e4; min-width: 20px; height: 20px; display: inline-block; vertical-align: top; padding: 0 6px; border-radius: 10px; font-size: 1.2rem; color: #fff; margin-right: 8px; } .youtube-guide-pop .guide.m-guide { display: none; } .youtube-method-select { padding-top: 10px; margin-top: 5px; border-top: 1px solid #dcdcdc; padding-bottom: 10px; } .youtube-method-select:first-child { border-top: none; margin-top: 0; padding-top: 0; } @media all and (max-width: 650px) { .youtube-guide-pop .guide.m-guide { display: block; } .youtube-guide-pop .guide.pc-guide { display: none; } .youtube-guide-pop .guide { width: calc(100% - 30px); margin-left: 0; left: 15px; } .youtube-method-select.source { display: none; } } @media all and (max-width: 380px) { .youtube-guide { width: 100%; text-align: center; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .youtube-input input[type=text] { width: 100%; } } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td .youtube-guide img { width: 20px; margin-top: 8px; margin-right: 3px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .period>div { display: inline-block; margin-right: 20px; width: 180px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .period>div:last-child { margin-right: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .period .unit { display: inline-block; font-size: 1.5rem; line-height: 27px; font-weight: normal; color: #999; margin-right: 20px; line-height: 40px; } @media all and (max-width:516px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .period>div:first-child { margin-bottom: 10px; } } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .selectbox { height: 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .selectbox label { line-height: 38px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .selectbox select { height: 40px; } .selectbox select option { font-size: 1.5rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .budget { position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .budget input[type=text] { padding-right: 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .budget .unit { position: absolute; top: 9px; right: 20px; color: #999; font-size: 1.5rem; font-weight: normal; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td textarea { width: 100%; border: 1px solid #dcdcdc; border-radius: 2px; resize: none; height: 150px; padding: 10px; font-size: 1.5rem; line-height: 21px; color: #2d2d2d; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .business-content p { margin-bottom: 10px; font-size: 1.5rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .business-content textarea { height: 250px; } /*파일인풋*/ .file-input { display: inline-block; text-align: left; width: 100%; position: relative; padding-left: 10px; color: #3a3a3a; font-size: 1.5rem; line-height: 40px; vertical-align: middle; background-color: #fff; cursor: pointer; border: 1px solid #dcdcdc; font-weight: 300; letter-spacing: -0.5px; height: 40px; border-radius: 2px; } .file-input > [type='file'] { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; z-index: 2; cursor: pointer; font-size: 0; } .file-input .input-ico { position: absolute; left: 20px; top: 22px; } .file-input label { cursor: pointer; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-row { overflow: hidden; margin-bottom: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-row:last-child { margin-bottom: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload .file-input { float: left; width: 72%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload .btn-wrap { float: right; margin-top: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload .btn-wrap .add-btn { margin-left: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload .btn-wrap .minus-btn { margin-left: 5px; } /*#info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload .btn-wrap .minus-btn { display: none; }*/ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload-past .file-input { float: left; width: 72%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload-past .btn-wrap { display: inline-block;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload-past .btn-wrap .add-btn { margin-left: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload-past .btn-wrap .minus-btn { margin-left: 5px; } .label-past{line-height: 30px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .img .file-input { width: 80%; } /* 온라인 접수 버튼 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area { height: 57px; margin-top: 60px; overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area a { height: 100%; border-style: none; width: 405px; border-radius: 6px; font-size: 1.6rem; font-weight: bold; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area a span { display: block; height: 50px; line-height: 50px; vertical-align: top; text-align: center; border-radius: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area .cancel-btn { float: left; background: #c1c1c1; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area .cancel-btn span { color: #878787; background: #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area .complete-btn { float: right; background: #0e9d81; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area .complete-btn span { color: #fff; background: #20bd9e; } @media all and (max-width:860px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area a { width: 48%; } } @media all and (max-width:700px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload .file-input { width: 100%; float: none; margin-bottom: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-form .business-info .form-table table tbody tr td .file-upload .btn-wrap { float: none; } } @media all and (max-width:450px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .application-btn-area { margin-top: 40px; } } /* 오프라인 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info { } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step { border: 1px solid #dcdcdc; border-radius: 5px; padding: 40px 30px; position: relative; overflow: hidden; text-align: center; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step:first-child { margin-bottom: 25px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step>.numb { position: absolute; top: 0; left: 0; width: 100px; height: 70px; font-size: 18px; font-weight: bold; border-top: 35px solid #52a2e4; border-left: 50px solid #52a2e4; border-bottom: 35px solid transparent; border-right: 50px solid transparent; z-index: 1; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step>.numb img { position: absolute; z-index: 2; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step:first-child .numb img { top: -18px; left: -30px; width: 18px; height: 14px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step:nth-child(2) .numb img { top: -18px; left: -30px; width: 20px; height: 14px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step>.head { font-size: 2rem; font-weight: bold; color: #52a2e4; margin-bottom: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step>.sub { font-size: 1.7rem; line-height: 21px; margin-bottom: 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .download-wrap { overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .download-wrap li { height: 40px; display: inline-block; margin: 0 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .download-wrap li a { display: block; height: 100%; border: 1px solid #dcdcdc; border-radius: 20px; padding: 0 20px 0 40px; font-size: 1.4rem; line-height: 38px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .download-wrap li a:hover { font-weight: bold; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .download-wrap li a:before { position: absolute; content: ''; width: 16px; height: 16px; background: url(../../img/sub/business/hg_ico.png); background-size: 16px 16px; left: 16px; top: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area { text-align: left; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .search-box { width: 390px; height: 35px; border: 1px solid #dcdcdc; border-radius: 2px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .search-box input[type=text] { border-style: none; height: 33px; font-size: 1.4rem; padding-left: 40px; line-height: 33px; width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .search-box:before { width: 14px; height: 14px; position: absolute; content: ''; background: url(../../img/sub/business/search_ico.png); background-size: 14px 14px; left: 12px; top: 9px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list { margin-top: 10px; border: 1px solid #dcdcdc; border-radius: 2px; padding: 0 40px; max-height: 340px; overflow: hidden; overflow-y: auto; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li { display: block; min-height: 66px; border-bottom: 1px solid #dcdcdc; overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li:last-child { border-bottom: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .numb { float: left; height: 100%; min-height: 65px; padding: 22px 0; width: 5%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .numb span { border: 2px solid #52a2e4; display: inline-block; height: 18px; min-width: 18px; text-align: center; font-size: 11px; font-weight: bold; color: #52a2e4; border-radius: 9px; padding: 2px 3px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info { float: right; width: 95%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info>.address { padding: 12px 0; padding-left: 25px; min-height: 65px; float: left; width: 70%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info>.address li { font-size: 1.3rem; font-weight: bold; line-height: 21px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info>.address li .head { color: #999; width: 75px; display: inline-block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info>.address li .sub { display: inline-block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info .postal-code { font-size: 1.3rem; font-weight: bold; text-align: center; float: right; min-height: 65px; padding: 16px 0; width: 13%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info .postal-code .head { display: block; margin-bottom: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info .detail-btn-area { float: right; width: 12%; min-height: 65px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info .detail-btn { width: 70px; height: 28px; border: 1px solid #dcdcdc; text-align: center; border-radius: 14px; line-height: 26px; font-weight: bold; color: #999; background: #fff; overflow: hidden; margin-top: 17px; display: inline-block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-btn:hover { color: #fff; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>.detail .detail-info { display: block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .map-area { width: 100%; height: 315px; overflow: hidden; border-top: 1px solid #dcdcdc; border-bottom: 1px solid #dcdcdc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area { background: #f8f8f8; padding: 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area .location-name { font-size: 1.8rem; font-weight: bold; display: block; margin-bottom: 20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area table { width: 100%; font-size: 1.4rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area table tbody tr { line-height: 25px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area table tbody tr th { width: 20%; font-weight: bold; } @media all and (max-width:999px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info>.address { width: 80%; padding-left: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info .detail-btn-area { width: 100%; min-height: 45px; float: left; text-align: center; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info .detail-btn-area .detail-btn { margin-top: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info { position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info .postal-code { min-height: 45px; position: absolute; top: 0; right: 0; } } @media all and (max-width:636px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .download-wrap li { margin: 5px; } } @media all and (max-width:599px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .numb { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list { padding: 0 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info { float: left; width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info>.address { padding-left: 0; min-height: 45px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info>.address li { line-height: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info>.address li .head { width: 65px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .location-info .postal-code { padding-top: 13px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .map-area { height: 250px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area { padding: 20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area .location-name { margin-bottom: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area table tbody tr th { width: 25%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area table tbody tr { line-height: 20px; } } @media all and (max-width:499px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .search-box { width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .map-area { height: 200px; } } @media all and (max-width:399px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .map-area { height: 170px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area { padding: 15px 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area .location-name { margin-bottom: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area table tbody tr th { width: 35%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .offline-info .step .search-location-area .location-list>ul>li .detail-info .txt-area table tbody tr { line-height: 20px; } } /* 리스트 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area { height: 60px; border-bottom: 1px solid #dcdcdc; overflow: hidden; margin-bottom: 20px; padding-right: 110px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-box { height: 45px; width: 100%; border: 1px solid #dcdcdc; border-radius: 2px; position: relative; float: left; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-box:before { width: 14px; height: 14px; content: ''; position: absolute; background: url(../../img/sub/business/search_ico.png); background-size: 14px 14px; left: 13px; top: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-box input[type=text] { width: 100%; height: 43px; border-style: none; font-size: 1.5rem; padding-left: 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-btn { background: #52a2e4; height: 35px; display: block; float: right; min-width: 90px; line-height: 35px; font-size: 1.4rem; color: #fff; border-radius: 17.5px; text-align: center; -webkit-transition: box-shadow 0.5s cubic-bezier(0.02, 0.01, 0.47, 1); transition: box-shadow 0.5s cubic-bezier(0.02, 0.01, 0.47, 1); -webkit-transition: background 0.5s cubic-bezier(0.02, 0.01, 0.47, 1); transition: background 0.5s cubic-bezier(0.02, 0.01, 0.47, 1); margin-top: 5px; position: absolute; top: 0; right: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-btn:hover { box-shadow: 0 1px 8px rgba(58,51,53,0.3); color: #fff; background: #6071E5; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area { margin-bottom: 20px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area:after { clear: both; height: 0; display: block; content: ''; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area #left_filter_toggle { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .toggle-btn { width: 34px; height: 34px; display: inline-block; cursor: pointer; border: 1px solid #52a2e4; border-radius: 50%; text-align: center; float: left; margin-right: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .toggle-btn img { width: 16px; margin-top: 8px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter { position: absolute; top: -100px; background: #fff; z-index: 2; border: 1px solid #dcdcdc; padding: 15px; border-radius: 4px; box-shadow: 0 5px 15px -5px rgba(0,0,0,0.3); left: 40px; opacity: 0; transition: opacity .8s ease, top .5s ease, z-index .8s ease; z-index: -1; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area #left_filter_toggle:checked ~ .left-filter { top: 0; opacity: 1; z-index: 2; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter .filter-name { font-weight: bold; color: #999; font-size: 1.2rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul { border-bottom: 1px solid #eee; margin-bottom: 10px; padding-bottom: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul:last-child { margin-bottom: 0; border-bottom: none; padding-bottom: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter .selectbox { margin-top: 8px; cursor: not-allowed; opacity: .3; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter .selectbox.active { cursor: pointer; opacity: 1; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter .selectbox label { left: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter .selectbox select { cursor: not-allowed; pointer-events: none; padding-left: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter .selectbox.active select { cursor: pointer; pointer-events: all; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .selected-filter { float: left; border: 1px solid #dee3eb; background: #fff; padding: 10px 10px; border-radius: 4px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .selected-filter p { display: inline-block; font-size: 1.3rem; margin-right: 10px; color: #666; cursor: default; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .selected-filter p .select { color: #52a2e4; margin-right: 2px; font-weight: bold; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .selected-filter p:after { position: absolute; width: 2px; height: 2px; content: ''; background: #dcdcdc; right: -8px; top: 4px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .selected-filter p:last-child { margin-right: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .selected-filter p:last-child:after { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter { float: right; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul li { display: inline-block; margin-right: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul li input[type=checkbox], #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul li input[type=radio] { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul li label { font-size: 1.4rem; font-weight: bold; color: #2d2d2d; display: block; height: 35px; line-height: 35px; padding-left: 28px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul li label:before { position: absolute; content: ''; width: 20px; height: 20px; background: url(../../img/subCommon/check.png) no-repeat; top: 7px; left: 0; background-position: 0 0; background-size: 20px 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul li input[type=checkbox]:checked ~ label:before, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter ul li input[type=radio]:checked ~ label:before { background-position: 0 -20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter { width: 255px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .my-business { display: inline-block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .my-business input[type=checkbox] { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .my-business label { font-size: 1.4rem; font-weight: bold; color: #2d2d2d; display: block; height: 35px; line-height: 35px; padding-left: 35px; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .my-business label:before { position: absolute; content: ''; width: 20px; height: 20px; background: url(../../img/subCommon/check.png) no-repeat; top: 7px; left: 5px; background-position: 0 0; background-size: 20px 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .my-business input[type=checkbox]:checked ~ label:before, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .my-business input[type=radio]:checked ~ label:before { background-position: 0 -20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .seggestion-btn { background: #20bd9e; height: 35px; display: block; float: right; width: 125px; line-height: 35px; font-size: 1.4rem; color: #fff; border-radius: 17.5px; text-align: center; -webkit-transition: box-shadow 0.5s cubic-bezier(0.02, 0.01, 0.47, 1); transition: box-shadow 0.5s cubic-bezier(0.02, 0.01, 0.47, 1); -webkit-transition: background 0.5s cubic-bezier(0.02, 0.01, 0.47, 1); transition: background 0.5s cubic-bezier(0.02, 0.01, 0.47, 1); } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .seggestion-btn:hover { background: #28CCAC; box-shadow: 0 1px 8px rgba(58,51,53,0.3); } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter { font-size: 1.4rem; font-weight: bold; margin-bottom: 30px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter:after { clear: both; height: 0; display: block; content: ''; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter a { color: #999; margin-right: 28px; position: relative; line-height: 35px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter a:after { height: 12px; width: 1px; background: #eaeaea; content: ''; position: absolute; right: -15px; top: 1px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter a:nth-child(2):after { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .select { color: #2d2d2d; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .list-type-select { float: right; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .list-type-select button { width: 35px; height: 35px; border-radius: 50%; border: 1px solid #dee3eb; background: #fff; margin-left: 3px; outline: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .list-type-select button.select { border-color: rgb(26,124,206,1); } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .list-type-select button.card-type { background: url(../../img/sub/business/card_off.svg); background-size: 15px 15px; background-repeat: no-repeat; background-position: center; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .list-type-select button.card-type.select { background: url(../../img/sub/business/card_on.svg); background-size: 15px 15px; background-repeat: no-repeat; background-position: center; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .list-type-select button.list-type { background: url(../../img/sub/business/list_off.svg); background-size: 15px 15px; background-repeat: no-repeat; background-position: center; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .list-type-select button.list-type.select { background: url(../../img/sub/business/list_on.svg); background-size: 15px 15px; background-repeat: no-repeat; background-position: center; } @media all and (max-width: 699px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter .list-type-select button { width: 31px; height: 31px; } } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li { height: 425px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress { height: 70px; border-bottom: 1px solid #dcdcdc; padding: 20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .header { font-size: 1.4rem; font-weight: bold; overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .header span { width: 25%; display: inline-block; text-align: center; float: left; color: #ccc; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .header .on { color: #2d2d2d; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .progress-bar { background: #f8f8f8; height: 8px; border-radius: 4px; margin-top: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .progress-bar span { display: block; height: 8px; background: #20bd9e; border-radius: 4px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .progress-bar .progress-01 { width: 25%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .progress-bar .progress-02 { width: 50%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .progress-bar .progress-03 { width: 75%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .progress-bar .progress-04 { width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .preview-img-area { border-radius: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .preview-img-area img { border-radius: 0; min-height: 180px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area { height: 174px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .etc { height: 26px; overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .etc .editor { height: 26px; border: 1px solid #dcdcdc; border-radius: 4px; display: inline-block; line-height: 24px; padding: 0 8px; color: #2d2d2d; font-weight: bold; float: left; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .etc .date { color: #999; float: right; line-height: 26px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .status-txt { margin-bottom: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .status-txt .status-label { height: 26px; border: 1px solid #dcdcdc; border-radius: 4px; display: inline-block; line-height: 24px; padding: 0 8px; color: #000; font-weight: bold; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .status-txt .status-label.red { background-color: #ff0000; color: #FFF; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .status-txt .status-label.green { background-color: #20bd9e; color: #FFF; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .status-txt .status-label.blue { background-color: #52a2e4; color: #FFF; } @media all and (min-width:900px) and (max-width:1199px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li { width: 31%; margin-right: 3.5%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li:nth-child(2n) { float: left; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li:nth-child(3n) { margin-right: 0; } } @media (max-width:1199px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li { height: 445px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area { height: 200px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .detail .budget { float: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .detail .date { padding-left: 0; } } @media all and (max-width:699px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter { float: left; width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .my-business { margin-top: 5px; } } @media all and (max-width:599px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area { height: 50px; margin-bottom: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-box { height: 35px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-box input[type=text] { height: 33px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-box:before { top: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-name-search-area .search-btn { height: 30px; line-height: 30px; margin-top: 2px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area { height: auto; overflow: hidden; margin-bottom: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .left-filter { float: left; position: relative; width: 100%; left: 0; top: 0; padding: 0; margin: 0; height: 0; overflow: hidden; transition: opacity 0s ease; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area #left_filter_toggle:checked ~ .left-filter { padding: 10px; margin: 10px 0; height: auto; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .right-filter .seggestion-btn { height: 30px; line-height: 30px; margin-top: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .array-filter { margin-bottom: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li { width: 100%; height: 355px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area { padding: 15px; height: 110px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .status { line-height: 20px; height: 20px; width: 55px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area h5 { margin: 10px 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .detail .budget { float: left; padding-right: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .txt-area .etc .date { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .preview-img-area { height: 150px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress { height: 50px; padding: 12px 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .progress-bar { margin-top: 5px; height: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .card-list ul li a .progress .progress-bar span { height: 5px; } } /* 사업 디테일 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .tab-area { height: 45px; border-bottom: 1px solid #52a2e4; margin-bottom: 30px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .tab-area ul { height: 100%; overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .tab-area ul li { height: 100%; float: left; width: 25%; text-align: center; font-size: 1.5rem; font-weight: bold; line-height: 44px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .tab-area ul li a { display: block; background: #f8f8f8; border-right: 1px solid #eaeaea; border-top: 1px solid #eaeaea; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .tab-area ul li.disabled a { background: #f1f1f1; color: #acacac; cursor: inherit; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .tab-area ul li:first-child a { border-left: 1px solid #eaeaea; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .tab-area ul .select a, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .tab-area ul .select:first-child a { background: #52a2e4; color: #fff; border-color: #52a2e4; border-left: 1px solid #52a2e4; } @media all and (max-width:399px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area .selected-filter { width: 100%; margin-top: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-detail .btn-area { margin-top: 30px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .business-detail .btn-area .list-btn { height: 30px; line-height: 28px; } } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area-wrap { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area-wrap.select { display: block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area { margin-bottom: 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area:last-child { margin-bottom: 0; } /* 투표 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area { overflow: hidden; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-rate-title { font-size: 1.7rem; font-weight: bold; margin-bottom: 10px; display: block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .result-area { width: 100%; height: 250px; border: 1px solid #dcdcdc; padding: 10px 20px; margin-bottom: 20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .result-area .area { width: 60px; height: 100%; display: inline-block; position: relative; margin-left: 25px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .participation-result { height: 50px; overflow: hidden; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .participation-result .total { font-size: 1.5rem; font-weight: bold; border: 1px solid #dcdcdc; padding: 10px 20px; display: inline-block; float: right; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting { margin-top: 35px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .head { font-size: 1.7rem; font-weight: bold; margin-bottom: 10px; display: block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .head .head-detail { float: right; font-size: 1.4rem; color: #7d7d7d; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .head .head-detail .emphasis-count { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .agree-btn { height: 55px; display: block; width: 100%; background: #52a2e4; border-radius: 4px; font-size: 1.6rem; color: #fff; border: none; font-weight: bold; letter-spacing: 0; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .agree-btn.disabled { background: #eaeaea; cursor: inherit; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .voting-condition { height: 50px; margin-top: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .voting-condition .my-voting-result { float: left; height: 40px; font-size: 1.4rem; font-weight: bold; color: #555; border: 2px solid #52a2e4; line-height: 36px; padding: 0 15px; cursor: default; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .voting-condition .my-voting-result span { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .voting-condition .my-voting-result img { width: 17px; margin-top: 12px; margin-right: 8px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .voting-condition .my-extra-vote { float: right; height: 40px; font-size: 1.4rem; font-weight: bold; color: #555; line-height: 36px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .voting-condition .my-extra-vote span { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .disable-mask { position: absolute; width: 100%; height: 100%; background: rgba(255,255,255,0.9); top: 0; left: 0; z-index: 2; padding: 100px; text-align: center; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .disable-mask p { font-size: 1.7rem; display: block; padding: 40px; border: 2px solid #dcdcdc; line-height: 25px; font-weight: bold; color: #555; background: rgba(255,255,255,0.9); margin-bottom: -30px; width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .disable-mask p span { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .disable-mask a { display: inline-block; font-size: 1.5rem; font-weight: bold; margin: 0 10px; color: #afafaf; position: relative; } @media all and (max-width:499px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .result-area { padding: 10px; white-space: nowrap; overflow-x: scroll; -webkit-overflow-scrolling:touch; -ms-overflow-style: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .result-area::-webkit-scrollbar { display:none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .result-area .area { margin-left: 5px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .result-area>div>.area { width: 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting { margin-top: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .voting-condition .my-voting-result { float: right; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .participation-area .voting .voting-condition .my-extra-vote { width: 100%; text-align: right; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .disable-mask p { margin-bottom: -30px; } } @media all and (max-width:439px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-area .disable-mask { padding: 100px 20px; } } /* 실행 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area-wrap .table-area .normal-table tbody tr td.result-content { background: #FFF; border-right: none; padding: 70px 0; font-size: 1.5rem; line-height: 25px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area-wrap .table-area .normal-table tbody tr td.result-content .td-b .emphasis { display: inline-block; background-color: #5f70e8; padding: 0px 12px; margin: 0 2px; border-radius: 3px; color: #fff; font-size: 1.4rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area-wrap .table-area .normal-table tbody tr td.result-content .td-b .red { display: inline-block; color: #c13f3f; } /* 일괄투표 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list { border-top: 2px solid #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area { border-bottom: 1px solid #dcdcdc; padding: 20px 35px 20px 50px; cursor: pointer; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area:hover { background: #f1f3f8; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul .select .title-area { background: #f1f3f8; border-bottom: 2px dashed#D4D9E9; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area:after { background: url(../../img/sub/business/voting_list_arrow.png); content: ''; position: absolute; width: 16px; height: 10px; background-size: 16px 10px; top: 50%; margin-top: -5px; right: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .custom-vote-list ul li .title-area:after { content:none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul .select .title-area:after { background: url(../../img/sub/business/voting_list_arrow_r.png); content: ''; position: absolute; width: 16px; height: 10px; background-size: 16px 10px; top: 50%; margin-top: -5px; right: 15px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area h3 { font-size: 1.8rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area input[type=checkbox], #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area input[type=radio] { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area label { height: 35px; line-height: 35px; width: 35px; position: relative; display: inline-block; width: 35px; height: 35px; position: absolute; top: 50%; margin-top: -17.5px; left: 10px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area label:before { position: absolute; content: ''; width: 20px; height: 20px; background: url(../../img/subCommon/check.png) no-repeat; top: 7px; left: 5px; background-position: 0 0; background-size: 20px 40px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area input[type=checkbox]:checked ~ label:before, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area input[type=radio]:checked ~ label:before { background-position: 0 -20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area input[type=radio]:checked ~ h3, #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .title-area input[type=checkbox]:checked ~ h3 { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul .my-vote .title-area label { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul .my-vote .title-area:before { width: 22px; height: 22px; background: url(../../img/sub/business/my_vote_ico.png); content: ''; position: absolute; background-size: 22px 22px; left: 15px; top: 50%; margin-top: -11px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul .my-vote .title-area h3 { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul li .content-area { font-size: 1.5rem; white-space: pre-wrap; padding: 20px; font-weight: bold; line-height: 21px; border-bottom: 1px solid #dcdcdc; display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list ul .select .content-area { display: block; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list .no-login li { display: none; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list .no-login .no-login-txt { display: block; text-align: center; font-size: 1.5rem; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list .no-login .no-login-txt p { font-size: 1.7rem; display: block; padding: 100px; line-height: 25px; font-weight: bold; color: #555; width: 100%; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list .no-login .no-login-txt p span { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .vote-list .no-login .no-login-txt a { display: inline-block; font-size: 1.5rem; font-weight: bold; margin: 0 10px; color: #afafaf; position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .voting-state-pop { position: fixed; z-index: 10; bottom: 50px; width: 300px; background: #fff; height: 125px; left: 50%; margin-left: 300px; border-radius: 5px; border: 1px solid #eaeaea; box-shadow: 0 3px 8px 2px rgba(0,0,0,0.1); text-align: center; padding: 20px; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .voting-state-pop .participation-result { font-size: 2rem; font-weight: bold; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .voting-state-pop .participation-result .count { color: #52a2e4; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .voting-state-pop .agree-btn { height: 45px; display: block; width: 100%; background: #52a2e4; border-radius: 4px; font-size: 1.6rem; color: #fff; border: none; font-weight: bold; letter-spacing: 0; margin-top: 15px; } /* 모바일 메뉴 */ #info-container .info .m-tab-gnb-wrap .m-tab-gnb ul li:nth-child(2) a, #info-container .info .m-tab-gnb-wrap .m-tab-gnb ul li:nth-child(3) a { line-height: 16px; padding-top: 9px; font-size: 1.5rem; } @media all and (max-width:1199px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .voting-state-pop { left: auto; right: 20px; margin-left: 0; } } @media all and (max-width:499px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .voting-state-pop { border: none; border-radius: 0; bottom: 0; right: 0; width: 100%; border-top: 1px solid #eaeaea; padding: 20px 10px 10px; height: 110px; } } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area #left_filter_toggle:checked ~ .left-filter .btn-wrap {float: right; margin-top: 15px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area #left_filter_toggle:checked ~ .left-filter .btn-wrap ul li a {min-width:90px; line-height:35px; text-align:center; display:block; font-size:1.4rem; border-radius:3px; font-weight:600; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area #left_filter_toggle:checked ~ .left-filter .btn-wrap ul li a:hover {box-shadow: 0 1px 8px rgba(58,51,53,0.3);} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area #left_filter_toggle:checked ~ .left-filter .btn-wrap ul li a.save {color:#fff; background:#52a2e4;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .filter-area #left_filter_toggle:checked ~ .left-filter .btn-wrap ul li a.cancel {color:#848484; border:1px solid #dcdcdc;} /* 부서 탭 */ .tab-reviewer ul {margin-bottom:20px;} .tab-reviewer ul li {display: inline-block; line-height:30px; font-size: 1.4rem; letter-spacing: -0.25px; margin: 5px 5px 10px 0; } .tab-reviewer ul li a {display: block; width:100%; height:100%;padding:0 20px; background: #eee; border-radius: 3px; } .tab-reviewer ul li:hover a {background:#e4e4e4;} .tab-reviewer ul li.select a { background: #52a2e4; color: #fff;} .tab-reviewer ul li.disabled a { background: #e2e2e2; color: #a9a9a9; cursor: not-allowed} @media all and (max-width:425px) { .tab-reviewer ul li {text-align: center; width:calc(33% - 4px);} .tab-reviewer ul li:nth-child(3n) {margin-right:0;} } /* 부서검토중 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block {position: relative; } #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block > img {width:100%;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block .block-text {position: absolute; top:50%; left:50%; width:45%; background:#fff; text-align: center; -webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%); border-radius: 10px; overflow: hidden; box-shadow:6px 5px 17px -5px rgba(0, 0, 0, 0.2);} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block .block-text .block .top { padding: 0 10px; background:#7586fa;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block .block-text .block .bottom { padding:60px 10px 40px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block .block-text .block .top img {width:65%; position: relative; top:35px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block .block-text .block .bottom p {font-size: 1.8rem; color:#424ca7; font-weight: 900; letter-spacing: -0.5px; word-break: keep-all;} @media all and (max-width:640px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block > img {width:150%} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block .block-text {width: 65%;} } @media all and (max-width:420px) { #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block .block-text .block .top img {width: 85%;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .content-block .block-text .block .bottom {padding:45px 10px 30px;} } /* 설문조사 */ .survey-wrap {width: 100%; position: relative; text-align: center;} .survey-wrap .title { margin:50px 0; padding:40px 0; font-size: 2.3rem; border-top: 1px solid #ddd; border-bottom:1px solid #ddd; color: #52a2e4; font-weight: 600; } .survey-wrap .txt {padding: 30px; background:#fff; border: 10px solid #f3f3f3} .survey-wrap .txt h4 { font-size: 1.7rem; margin-bottom: 20px; } .survey-wrap .txt p { font-size: 1.5rem; line-height: 23px; margin-bottom: 20px;} .survey-wrap .txt p span {font-weight: 600} .survey-wrap .txt .btn-wrap {} .survey-wrap .txt .btn-wrap button {border:0; padding:0 30px; height: 40px; font-size: 1.4rem; border-radius: 3px;} .survey-wrap .txt .btn-wrap button.btn-white {color: #333; border:1px solid #ccc; background: none; margin-right: 10px;} .survey-wrap .txt .btn-wrap button.btn-white:hover { background: #f8f8f8; } .survey-wrap .txt .btn-wrap button.btn-blue {color: #fff; background: #52a2e4} .survey-wrap .txt .btn-wrap button.btn-blue:hover {background: #52A2E4; } .survey-pop-wrap .vote-pop-area {width: 100%; float: none;} @media all and (max-width: 1200px) { #info-container .info {padding:20px;} } @media all and (max-width: 425px) { .survey-wrap .txt .btn-wrap button {padding:0 15px;} .survey-wrap .txt .btn-wrap button.btn-white {margin-right: 5px;} } /* 제외대상 - 민원신청 바로가기 버튼 */ #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td a.url-btn { display: inline-block; position: relative; background: #fff; padding: 2px 15px 2px 10px; border-radius: 3px; border: 1px solid #52a2e4; color: #52a2e4; font-size: 1.3rem; margin-top: 10px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td a.url-btn img { position: relative; top: 3px; width: 16px; height: 16px; margin-right: 5px;} #info-container .info .sub-info-content-wrap .sub-info-content .content-area .content-box .table-area .normal-table tbody tr td a.url-btn:hover { background: #F4F7F9; }