
/* 기본 공통사항*/
input, textarea, select {font: 400 15.5px 'Noto Sans KR', sans-serif;}
input {width: 50%; padding: 12.5px; border: 1px solid #ccc; color: #444; }
input::placeholder {color: #ccc;}
input:focus {border: 1px solid #888;}
input[type="checkbox"] {max-width: none; width: auto; padding: 0; border: 0;}
input[type="radio"] {max-width: none; width: auto; padding: 0; border: 0;}
input[type="file"] {padding: 0; border: 0;}
select {width: 50%; padding: 12.5px; border: 1px solid #ccc; color: #444; }
textarea {width: 100%; height: 200px; padding: 12.5px; border: 1px solid #ccc; color: #444; resize: none;}
textarea::placeholder {color: #ccc;}
textarea:focus {border: 1px solid #888;}
dt {display: inline-block; vertical-align: middle;}
dd {display: inline-block; vertical-align: middle;}
.wrap {max-width: 1048px; min-height: calc(100vh - 262px); padding: 24px; margin: 0 auto; font-size: 0; color: #444; letter-spacing: -0.5px; line-height: 24px;}
.positiveBtn {max-width: 300px; width: 100%; height: 50px; margin: 0 auto; padding: 12.5px; background-color: #586983; text-align: center; font-size: 17.5px; font-weight: 600; color: #fff;}
.denybtn {max-width: 300px; width: 100%; height: 50px; margin: 0 auto; padding: 12.5px; text-align: center; border: 1px solid #ccc; font-size: 17.5px; font-weight: 600; color: #f50057;}
.positiveBtn:hover {box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2), 0px 4px 5px 0px rgba(0,0,0,0.14), 0px 1px 10px 0px rgba(0,0,0,0.12); background-color: #4c5562;}
.denybtn:hover {background-color: buttonface;}
.btn:hover {background-color: buttonface;}
.textLine {font-size: 15.5px; text-align: justify; word-break: break-all;}
.textLine i {display: inline-block; width: 16px;}
.textLine span {display: inline-block; vertical-align: top; width: calc(100% - 16px);}
.important {color: #f50057;}
.pageTitle {padding: 48px 0; text-align: center; font-size: 32px; font-weight: 600;}
.card {padding: 30px 24px; background-color: #f7f7f7; border: 1px solid #ddd;}
.linkNavList {text-align: center; max-width: 640px; margin: 0 auto;}
.linkNav {display: inline-block; vertical-align: middle; width: 50%; min-width: 280px; padding: 24px 0 96px 0;}

/* jquery */
.ui-state-default {border: 0 !important;}
.ui-state-hover {border: 0 !important;}

/* 헤더 */
.header {border-bottom: 30px solid #282d4a;}
.headerBox {max-width: 1048px; margin: 0 auto; padding: 0 24px; font-size: 0;}
.headerBox:after {content: ""; display: inline-block; vertical-align: middle; min-height: 110px;}
.headerBox h1 {display: inline-block; vertical-align: middle; width: 400px;}
.headerBox h1 a {font-size: 32px; font-weight: 600; color: #263084;}
.headerBox nav {display: inline-block; vertical-align: middle; width: calc(100% - 400px); text-align: right;}
.headerBox nav .mainNavList {font-size: 0;}
.headerBox nav .mainNavList .mainNav {display: inline-block; padding: 0 16px; border-right: 1px solid #ccc;}
.headerBox nav .mainNavList .mainNav:last-child {border-right: 0;}
.headerBox nav .mainNavList .mainNav a {font-size: 17.5px; font-weight: 600; color: #444;}
.headerBox nav .mainNavList .mainNav a:hover {color: #263084;}

/* 풋터 */
.footer {border-top: 1px solid #ccc;  background-color: #EFEFEF}
.footerBox {max-width: 1048px;  margin: 0 auto; padding: 0 24px; font-size: 0;}
.footerBox:after {content: ""; display: inline-block; vertical-align: middle;}
.footerBox .company {display: inline-block; vertical-align: middle; width: 530px;}
.footerBox .company:after {content: ""; display: inline-block; vertical-align: middle; min-height: 96px;}
.footerBox .company .icon {display: inline-block; vertical-align: middle;}
.footerBox .company .icon img {width: 60px;}
.footerBox .company .address {display: inline-block; vertical-align: middle; padding-left: 24px;}
.footerBox .company .address address {font-size: 13px; color: #999;}
.footerBox .company .address .textLine {font-size: 13px; color: #999;}
.footerBox nav {display: inline-block; vertical-align: middle; width: calc(100% - 530px);}
.footerBox nav .optNavList {font-size: 0; text-align: right;}
.footerBox nav .optNavList .optNav {display: inline-block; padding: 0 8px; border-right: 1px solid #ccc; border-left: 1px solid #ccc;}
.footerBox nav .optNavList .optNav a {font-size: 13px; color: #999;}
.footerBox .copyright {text-align: center; font-size: 13px;color: #999; padding-bottom: 8px;}

/* policy */
.policyWrap .inforBox .card {margin-top: 24px; text-align: justify; white-space: pre-wrap; font-size: 14px;}

/* index.php */
.indexWrap {text-align: center;}
.indexWrap:after {content: ""; display: inline-block; vertical-align: middle; min-height: calc(100vh - 310px);}
.indexWrap .indexCard {display: inline-block; vertical-align: middle;}
.indexWrap .indexCard .bannerBox {padding: 24px 0;}
.indexWrap .indexCard .bannerBox .banner .icon {display: inline-block;}
.indexWrap .indexCard .bannerBox .banner .icon img {width: 100px;}
.indexWrap .indexCard .bannerBox .banner .bannerText {display: inline-block; vertical-align: middle; width: calc(100% - 100px); padding-left: 50px; text-align: left; line-height: 2; font-size: 22px; font-weight: 600;}
.indexWrap .indexCard .bannerBox .banner .bannerText b{font-size: 24px; color: #263084;}
.indexWrap .indexCard .inforBox {padding: 24px 0; text-align: left;}
.indexWrap .indexCard .inforBox > b {font-size: 18px;}
.indexWrap .indexCard .inforBox > b span {padding-left: 8px; padding-bottom: 16px;}
.indexWrap .indexCard .inforBox .card .textLine:first-child {padding-bottom: 8px;}
.indexWrap .indexCard .inforBox .card .textLine:last-child {padding-left: 16px;}
.indexWrap .linkNav {padding: 24px 0;}

/* infor */
.inforWrap .inforNavBox {padding: 24px 0;}
.inforWrap .inforNavBox .inforNavList {min-width: 350px; overflow: hidden;}
.inforWrap .inforNavBox .inforNavList .inforNav {display: inline-block; min-width: 116px; width: 33%; padding: 8px 0; border-bottom: 1px solid #888; text-align: center;}
.inforWrap .inforNavBox .inforNavList .inforNav a {border-right: 1px solid #888; font-size: 20px; font-weight: 600; color: #444;}
.inforWrap .inforNavBox .inforNavList .inforNav:last-child a {border-right: 0;}
.inforWrap .inforNavBox .inforNavList .inforNav.on {border-bottom: 2px solid #6b82cc;}
.inforWrap .inforNavBox .inforNavList .inforNav.on a {color: #6b82cc;}
.inforWrap .inforBox {padding: 24px 24px;}
.inforWrap .inforBox .inforList .infor {border-bottom: 1px solid #ddd; padding: 24px 16px;}
.inforWrap .inforBox .inforList .infor .icon {display: inline-block;}
.inforWrap .inforBox .inforList .infor .icon img {width: 60px;}
.inforWrap .inforBox .inforList .infor .inforText {display: inline-block; vertical-align: middle; width: calc(100% - 60px); padding-left: 50px;}
.inforWrap .inforBox .inforList .infor .inforText .textLine:first-child {color: #263083}
.inforWrap .inforBox .inforList .infor .inforText .textLine:last-child {padding-top: 8px; font-size: 14px;}
.inforWrap .inforBox > .textLine {display: block; padding-top: 24px; font-size: 18px;}
.inforWrap .inforBox > .textLine .important {font-size: 14px;}
.inforWrap .inforBox > .textLine span {padding-left: 8px; padding-bottom: 16px; font-weight: 600;}
.inforWrap .inforBox > .textLine:first-child {padding-top: 0; font-size: 15.5px;}
.inforWrap .inforBox .card .protectionList .protection {padding-bottom: 8px;}
.inforWrap .inforBox .card .protectionList .protection:last-child {padding-bottom: 0;}

/* report.php */
.reportWrap .personalBox {padding: 24px 0;}
.reportWrap .personalBox > .textLine{text-align: left; font-size: 18px;}
.reportWrap .personalBox > .textLine span {width: auto; padding-left: 8px; padding-bottom: 16px;}
.reportWrap .personalBox > .textLine span:last-child {color: red;}
.reportWrap .personalBox .card .textLine {padding-top: 8px;}
.reportWrap .personalBox .card .textLine:first-child {padding-top: 0;}
.reportWrap .personalBox .card .textLine:last-child {padding-top: 16px;}
.reportWrap .personalBox .personalConsent {text-align: right; padding-top: 16px;}
.reportWrap .personalBox .personalConsent span {display: inline-block; vertical-align: middle; padding-right: 24px;}
.reportWrap .reportBox {padding: 24px 0;}
.reportWrap .reportBox .reportList:first-child .report:first-child {padding-top: 0;}
.reportWrap .reportBox .reportList .report {padding: 24px; border-bottom: 1px solid #ccc;}
.reportWrap .reportBox .reportList .report:first-child {padding: 48px 24px 16px 24px; border-bottom: 2px solid #777;}
.reportWrap .reportBox .reportList .report:first-child .title {font-size: 20px; font-weight: 600;}
.reportWrap .reportBox .reportList .report:first-child .content {text-align: right; font-size: 14px;}
.reportWrap .reportBox .reportList .report .title {display: inline-block; width: 200px; vertical-align: middle; text-align: left; font-size: 15.5px; font-weight: 600;}
.reportWrap .reportBox .reportList .report .content {display: inline-block; width: calc(100% - 200px); vertical-align: middle;text-align: left; font-size: 15.5px;}
.reportWrap .reportBox .reportList .report .content.reportEmail {font-size: 0;}
.reportWrap .reportBox .reportList .report .content.reportEmail .arrayInput {width: 32.5%;}
.reportWrap .reportBox .reportList .report .content.reportEmail .arrayInput:last-child {width: 30%; margin-left: 2.5%;}
.reportWrap .reportBox .reportList .report .content.reportEmail .textLine {display: inline-block; width: 2.5%; text-align: center;}
.reportWrap .reportBox .reportList .report .content.reportEmail .textLine i {width: auto;}
.reportWrap .reportBox .reportList .report .content.reportEmail #emailText {display: none; width: 32.5%; padding: 12.5px; border: 1px solid rgb(204, 204, 204); color: #444; font: 400 15.5px "Noto Sans KR", sans-serif; vertical-align: middle;}
.reportWrap .reportBox .reportList .report .content.reportPhone {font-size: 0;}
.reportWrap .reportBox .reportList .report .content.reportPhone .arrayInput {width: 15%;}
.reportWrap .reportBox .reportList .report .content.reportPhone .textLine {display: inline-block; width: 2.5%; text-align: center;}
.reportWrap .reportBox .reportList .report .content.reportPhone .textLine i {width: auto;}
.reportWrap .reportBox .reportList .report .content.reportDate{font-size: 0;}
.reportWrap .reportBox .reportList .report .content.reportDate .arrayInput {width: 24%;}
.reportWrap .reportBox .reportList .report .content.reportDate .arrayInput:last-child {margin-left: 2%;}
.reportWrap .reportBox .reportList .report .content.reportTitle input {width: 100%;}
.reportWrap .reportBox .reportList .report .content.reportContexts {display: inline-block; vertical-align: middle;}
.reportWrap .reportBox .reportList .report .content.reportContexts .textLine {margin-top: 5px;color: #aaa; font-size: 14px;}
.reportWrap .reportBox .reportList .report .content.reportAttachment {font-size: 0;}
.reportWrap .reportBox .reportList .report .content.reportAttachment input:first-child {width: 50%}
.reportWrap .reportBox .reportList .report .content.reportAttachment label {display: inline-block; width: 24%; margin-left: 2%; padding: 11px 12.5px; border: 1px solid #ccc; text-align: center; font-size: 15.5px; color: #444;}
.reportWrap .reportBox .reportList .report .content.reportAttachment .textLine {color: #aaa; font-size: 14px;}
.reportWrap .reportBox .reportList .report .content.reportAttachment .attachmentList .attachment {padding: 5px 0;}
.reportWrap .reportBox .reportList .report .content.reportAttachment .attachmentList .attachment:first-child {padding: 0 0 12px; border-bottom: 1px solid #ddd; text-align: right;}
.reportWrap .reportBox .reportList .report .content.reportAttachment .attachmentList .attachment:nth-child(2) {padding-top: 12px;}
.reportWrap .reportBox .reportList .report .content.reportAttachment .attachmentList .attachment .attachmentAdd {display: inline-block; vertical-align: middle; width: 22%; background-color: transparent; color: #3f51b5;}
.reportWrap .reportBox .reportList .report .content.reportAttachment .attachmentList .attachment .attachmentDelete {display: inline-block; vertical-align: middle; width: 22%; margin-left: 2%; background-color: transparent; color: #f50057;}
.reportWrap .reportBox .considerations {padding-top: 24px;}

/* reportdone.php */
.doneWrap {text-align: center;}
.doneWrap:after {content: ""; display: inline-block; vertical-align: middle; min-height: calc(100vh - 310px);}
.doneWrap .doneCard {display: inline-block; vertical-align: middle;}
.doneWrap .doneCard h3 {padding-top: 0;}
.doneWrap .doneCard .textLine {padding-top: 24px;}
.doneWrap .doneCard .reportBox {padding: 24px 0; width: 755px;}
.doneWrap .doneCard .reportBox .textLine {padding: 24px 0;}
.doneWrap .doneCard .reportBox .icon {display: inline-block; vertical-align: middle;}
.doneWrap .doneCard .reportBox .icon img {width: 120px;}
.doneWrap .doneCard .reportBox .reportList {display: inline-block; vertical-align: middle; width: calc(100% - 120px); padding-left: 48px;}
.doneWrap .doneCard .reportBox .reportList .report {padding: 24px; border-bottom: 1px solid #ccc;}
.doneWrap .doneCard .reportBox .reportList .report .title {display: inline-block; vertical-align: middle; width: 200px; text-align: left; font-size: 16.5px; font-weight: 600;}
.doneWrap .doneCard .reportBox .reportList .report .content {display: inline-block; vertical-align: middle; width: calc(100% - 200px); text-align: left; font-size: 16.5px; word-break: break-all;}

/* certify.php */
.certifyWrap {text-align: center;}
.certifyWrap:after {content: ""; display: inline-block; vertical-align: middle; min-height: calc(100vh - 310px);}
.certifyWrap .certifyCard {display: inline-block; vertical-align: middle;}
.certifyWrap .certifyCard h3 {padding-top: 0;}
.certifyWrap .certifyCard .textLine {padding-top: 24px;}
.certifyWrap .certifyCard .certifyBox {padding: 24px 0; width: 755px;}
.certifyWrap .certifyCard .certifyBox .textLine {padding: 24px 0;}
.certifyWrap .certifyCard .certifyBox .card .textLine .span {padding: 2px 2px 2px 2px;}
.certifyWrap .certifyCard .certifyBox .icon {display: inline-block; vertical-align: middle;}
.certifyWrap .certifyCard .certifyBox .icon img {width: 120px;}
.certifyWrap .certifyCard .certifyBox .reportList {display: inline-block; vertical-align: middle; width: calc(100% - 120px); padding-left: 48px;}
.certifyWrap .certifyCard .certifyBox .reportList .report {padding: 24px; border-bottom: 1px solid #ccc;}
.certifyWrap .certifyCard .certifyBox .reportList .report .title {display: inline-block; vertical-align: middle; width: 200px; text-align: left; font-size: 16.5px; font-weight: 600;}
.certifyWrap .certifyCard .certifyBox .reportList .report .content {display: inline-block; vertical-align: middle; width: calc(100% - 200px); text-align: left; font-size: 16.5px;}
.certifyWrap .certifyCard .certifyBox .reportList .report .content input {width: 100%;}

/* result.php */
.resultWrap .progressBox {padding: 24px 0;}
.resultWrap .progressBox .progressList .progress {display: inline-block; width: 33%; padding: 8px; text-align: center;}
.resultWrap .progressBox .progressList .progress .icon {display: inline-block; vertical-align: middle; }
.resultWrap .progressBox .progressList .progress  .icon img {width: 60px;}
.resultWrap .progressBox .progressList .progress .textBox {display: inline-block; vertical-align: middle; padding-left: 24px;}
.resultWrap .progressBox .progressList .progress.on {border-bottom: 2px solid #6b82cc;}
.resultWrap .progressBox .progressList .progress.on p {color: #6b82cc; font-weight: 600;}
.resultWrap .resultBox .reportList .report {padding: 24px; border-bottom: 1px solid #ccc;}
.resultWrap .resultBox .reportList .report:first-child {padding: 48px 24px 16px 24px; border-bottom: 2px solid #777;}
.resultWrap .resultBox .reportList .report:first-child .title {font-size: 20px; font-weight: 600;}
.resultWrap .resultBox .reportList .report:first-child .content {text-align: right; font-size: 14px;}
.resultWrap .resultBox .reportList .report .title {display: inline-block; width: 200px; vertical-align: middle; text-align: left; font-size: 15.5px; font-weight: 600;}
.resultWrap .resultBox .reportList .report .content {display: inline-block; width: calc(100% - 200px); vertical-align: middle;text-align: left; font-size: 15.5px;}

/* adminCertify.php */
.adminCertifyWrap {height: 100vh; text-align: center;}
.adminCertifyWrap:after {content: ""; display: inline-block; vertical-align: middle; height: 100%;}
.adminCertifyWrap .certifyCard {display: inline-block; vertical-align: middle; padding: 80px; border: 1px solid #ddd;}
.adminCertifyWrap .certifyCard .icon {margin: 0 auto; padding-bottom: 24px;}
.adminCertifyWrap .certifyCard .icon img {width: 200px;}
.adminCertifyWrap .certifyCard .textLine {text-align: center; font-size: 23px; font-weight: 600;}
.adminCertifyWrap .certifyCard .certifyBox {padding: 24px 0;}
.adminCertifyWrap .certifyCard .certifyBox .textLine {padding: 24px 0;}
.adminCertifyWrap .certifyCard .certifyBox .certifyList .certify {padding: 4px 0; font-size: 16.5px;}
.adminCertifyWrap .certifyCard .certifyBox .certifyList .certify input {width: 360px;}
.adminCertifyWrap .certifyCard .linkNavBox input {max-width: none;}

/* dashboard.php */
.dashboardWrap .chartBox {padding: 24px 0;}
.dashboardWrap .chartBox .chartList {margin: 0 auto;}
.dashboardWrap .chartBox .chartList .chart {display: inline-block; width: 250px; height: 200px; padding: 24px; vertical-align: middle;}
.dashboardWrap .chartBox .chartList .chart {background-color: #a3a3a3;}
.dashboardWrap .chartBox .chartList .chart .icon {display: inline-block;}
.dashboardWrap .chartBox .chartList .chart .icon img {width: 60px;}
.dashboardWrap .chartBox .chartList .chart.wait {background-color: #F2230C;}
.dashboardWrap .chartBox .chartList .chart.ing {background-color: #2196F3;}
.dashboardWrap .chartBox .chartList .chart.type {background-color: #A6A007;}
.dashboardWrap .chartBox .chartList .chart .sum {display: inline-block; vertical-align: middle; width: calc(100% - 60px); text-align: right; font-size: 32px; color: #fff; font-weight: 600;}
.dashboardWrap .chartBox .chartList .chart .explain {height: calc(100% - 60px); font-size: 23px; color: #fff;}
.dashboardWrap .chartBox .chartList .chart .explain:after {content: ""; display: inline-block; vertical-align: text-bottom; text-align: left; height: 100%;}
.dashboardWrap .boardBox {padding: 24px 0; font-size: 14px;}
.dashboardWrap .boardBox table {width: 1000px; border-collapse: collapse;}
.dashboardWrap .boardBox table thead tr th {padding: 8px; border-bottom: 2px solid #777;}
.dashboardWrap .boardBox table tbody tr td {padding: 8px; border-bottom: 1px solid #ccc;}
.dashboardWrap .boardBox table .state {width: 80px; text-align: center;}
.dashboardWrap .boardBox table .state div {border-radius: 4px; color: #ffffff; font-weight: 600;}
.dashboardWrap .boardBox table .state .wait {background-color: #F2230C;}
.dashboardWrap .boardBox table .state .ing {background-color: #2196F3;}
.dashboardWrap .boardBox table .state .done {background-color: #a3a3a3;}
.dashboardWrap .boardBox table .num {width: 150px; text-align: center;}
.dashboardWrap .boardBox table .title {width: 480px;}
.dashboardWrap .boardBox table .title a {width: 480px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.dashboardWrap .boardBox table .type {width: 90px; text-align: center;}
.dashboardWrap .boardBox table .date {width: 100px; text-align: center;}
.dashboardWrap .boardBox table .result {width: 100px; text-align: center;}
.dashboardWrap .linkNavBox {font-size: 14px;}
.dashboardWrap .linkNavBox .pagination {text-align: center; padding: 24px 0;}
.dashboardWrap .linkNavBox .pagination .pagi {display: inline-block; width: 30px; height: 30px; padding: 2px; margin: 2px; border: 1px solid #ccc;}
.dashboardWrap .linkNavBox .pagination .prevPagi {width: 50px;}
.dashboardWrap .linkNavBox .pagination .nextPagi {width: 50px;}
.dashboardWrap .linkNavBox .pagination .pagi a{color: #333}
.dashboardWrap .linkNavBox .pagination .pagi .on{font-weight: 600;}
.dashboardWrap .linkNavBox .pagination .disabled a {color: #ccc;}
.dashboardWrap .linkNavBox .searchBox {text-align: center; font-size: 0;}
.dashboardWrap .linkNavBox .searchBox .searchBar {display: inline-block; width: 200px; height: 30px; padding: 4px; }
.dashboardWrap .linkNavBox .searchBox .searchSubmit {display: inline-block; width: 60px; height: 30px; padding: 4px; }

@media (max-width: 1048px) {
    .dashboardWrap .chartBox .chartList {max-width: 500px;}
    .dashboardWrap .boardBox {overflow-y: scroll;}
    .dashboardWrap .boardBox table {overflow: hidden;}
}

@media (max-width: 810px) {
    /* 기본 공통사항*/
    input {max-width: none;}
    textarea {max-width: none;}
    .wrap {min-height: calc(100vh - 293.5px);}
    .positiveBtn {max-width: none;}
    .denybtn {max-width: none;}
    .linkNav {width: 100%; padding: 24px 0 0 0;}

    /* 헤더 */
    .headerBox {padding-top: 16px;}
    .headerBox:after {display: none;}
    .headerBox h1 {display: block; width: auto;}
    .headerBox h1 a {margin: 0 auto; text-align: center; font-size: 24px;}
    .headerBox nav {display: block; width: auto; padding: 16px 0; text-align: center;}
    .headerBox nav .mainNavList .mainNav {padding: 0 8px;}
    
    /* 풋터 */
    .footerBox {padding: 0 8px;}
    .footerBox:after {display: none;}
    .footerBox .company {display: block; width: auto; text-align: center;}
    .footerBox .company:after {display: none;}
    .footerBox .company .icon {display: block; width: auto; padding: 16px;}
    .footerBox .company .address {display: block; padding-left: 0;}
    .footerBox .company .address address {display: block; width: auto; margin: 0;}
    .footerBox nav {display: block; width: auto; padding: 16px;}
    .footerBox nav .optNavList {text-align: center;}

    /* index.php */
    .indexWrap:after {display: none;}
    .indexWrap .indexCard .bannerBox .banner .bannerText {width: auto; padding-left: 0; text-align: center;}
    .indexWrap .linkNav {padding: 24px 0 0 0;}

    /* report.php */
    .reportWrap .reportBox .reportList .report .title {display: block; padding: 0; border: 0; font-size: 14px;}
    .reportWrap .reportBox .reportList .report .content {display: block; width: auto; padding: 0;}
    .reportWrap .reportBox .reportList .report .content input[type="text"] {width: 100%}
    .reportWrap .reportBox .reportList .report .content input[type="password"] {width: 100%}
    .reportWrap .reportBox .reportList .report .content.reportPhone .arrayInput {width: 30%;}
    .reportWrap .reportBox .reportList .report .content.reportPhone .textLine {width: 5%;}
    .reportWrap .reportBox .reportList .report .content.reportEmail .arrayInput {width: 47.5%;}
    .reportWrap .reportBox .reportList .report .content.reportEmail #emailText {width: 47.5%;}
    .reportWrap .reportBox .reportList .report .content.reportEmail .textLine {width: 5%;}
    .reportWrap .reportBox .reportList .report .content.reportEmail .arrayInput:last-child {width: 100%; margin: 0; margin-top: 4px;}
    .reportWrap .reportBox .reportList .report .content.reportDate .arrayInput {width: 47.5%;}
    .reportWrap .reportBox .reportList .report .content.reportDate .arrayInput:last-child {width: 47.5%; margin-left: 5%;}
    .reportWrap .reportBox .reportList .report .content.reportAttachment input:first-child {width: 100%;  margin-bottom: 4px;}
    .reportWrap .reportBox .reportList .report .content.reportAttachment label {width: 47.5%; margin: 0;}
    .reportWrap .reportBox .reportList .report .content.reportAttachment .attachmentList .attachment .attachmentAdd {width: 47.5%; margin-left: 5%;}
    .reportWrap .reportBox .reportList .report .content.reportAttachment .attachmentList .attachment .attachmentDelete {width: 47.5%; margin-left: 5%;}

    /* reportdone.php */
    .doneWrap:after {display: none;}
    .doneWrap .doneCard h3 {padding-top: 48px; line-height: 32px;}
    .doneWrap .doneCard .reportBox {width: auto;}
    .doneWrap .doneCard .reportBox .reportList {width: 100%; padding-left: 0}
    .doneWrap .doneCard .reportBox .reportList .report .title {display: block; padding: 0; border: 0; font-size: 14px;}
    .doneWrap .doneCard .reportBox .reportList .report .content {display: block; width: auto; padding: 0;}
    .doneWrap .doneCard .reportBox .reportList .report .content:after {display: none;}

    /* certify.php */
    .certifyWrap:after {display: none;}
    .certifyWrap .certifyCard h3 {padding-top: 48px; line-height: 32px;}
    .certifyWrap .certifyCard .certifyBox {width: auto;}
    .certifyWrap .certifyCard .certifyBox .reportList {width: 100%; padding-left: 0}
    .certifyWrap .certifyCard .certifyBox .reportList .report .title {display: block; padding: 0; border: 0; font-size: 14px;}
    .certifyWrap .certifyCard .certifyBox .reportList .report .content {display: block; width: auto; padding: 0;}
    .certifyWrap .certifyCard .certifyBox .reportList .report .content:after {display: none;}
    
    /* result.php */
    .resultWrap .progressBox .progressList .progress .textBox {padding: 0}
    .resultWrap .progressBox .progressList .progress .textBox .textLine {font-size: 13.5px;}
    .resultWrap .resultBox .reportList .report .title {display: block; padding: 0; border: 0; font-size: 14px;}
    .resultWrap .resultBox .reportList .report .content {display: block; width: auto; padding: 0;}

    /* adminCertify.php */
    .adminCertifyWrap .certifyCard {padding: 0; border: 0}
    .adminCertifyWrap .certifyCard .certifyBox .certifyList .certify input {width: 100%}
}

@media (max-width: 548px) {
    .dashboardWrap .chartBox .chartList {max-width: 250px;}
}

@media (max-width: 420px) {
    /* 기본 공통사항*/
    .wrap {padding: 16px;}
    .card {padding: 8px;}

    /* infor */
    .inforWrap .inforNavBox {overflow-x: scroll;}
}