@charset "utf-8"; 
/*
    at MAIN STYLE
    WRITER : Kim Cheonhyun
	Last Modify Date : 2024. 12. 05.
*/

/* popup */
#popupWrap { display:none; justify-content:center; align-items:center; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, .5); z-index:100; }
#popupWrap.on { display:flex; }
.layerPopInner { width:100%; padding:0 1.875em; box-sizing:border-box; }
.layerPopInner .layerPopSlideWrap { position:relative; max-width:1000px; margin:0 auto; }
.layerPopInner .layerPopSlideWrap.one { max-width:500px; }
.layerPopInner .layerPopSlideWrap.only { max-width:1000px; }
.layerPopInner .layerPopupSwiper { margin:0 -1px; }
.layerPopInner .layerPopupSwiper a { display:block; }
.layerPopInner .layerPopupSwiper .img { overflow:hidden; display:block; position:relative; width:100%; padding-top:140%; margin:0 auto; }
.layerPopInner .layerPopSlideWrap.only .img { padding-top:62%; }
.layerPopInner .layerPopupSwiper .img img { position:absolute; left:50%; top:50%; max-width:none; width:100%; height:100%; transform:translate(-50%, -50%); }
.layerPopInner .popupBtm { margin-top:1px; }
.layerPopInner .popupBtm .layerPopControl { display:flex; align-items:center; justify-content:space-between; background:#fff; }
.layerPopInner .popupBtm .layerPopControl p { padding-left:1.625em; }
.layerPopInner .popupBtm .layerPopControl p button { font-size:.9375em; line-height:1.4666em; letter-spacing:-.025em; }
.layerPopInner .popupBtm .layerPopControl ul { display:flex; align-items:center; }
.layerPopInner .popupBtm .layerPopControl ul li { border-left:1px solid #dadada; }
.layerPopInner .popupBtm .layerPopControl ul li button { position:relative; width:3.875em; height:3.375em; background:no-repeat center; background-size:.9375em; }
.layerPopInner .popupBtm .layerPopControl ul li button.swiper-button-disabled { opacity:.5; }
.layerPopInner .popupBtm .layerPopControl ul li button::after { color:#5d5d5d; font-size:2rem; font-family:swiper-icons; }
/*
.layerPopInner .popupBtm .layerPopControl ul li .prev::after { content:'prev'; }
.layerPopInner .popupBtm .layerPopControl ul li .next::after { content:'next'; }
*/
@media only screen and (max-width:960px) {
	.layerPopInner .layerPopSlideWrap { max-width:400px; }
	.layerPopInner .layerPopupSwiper { margin:0; }
	.layerPopInner .popupBtm .layerPopControl { padding:0 .5em 0 1em; }
	.layerPopInner .popupBtm .layerPopControl p { padding-left:0; }
	.layerPopInner .popupBtm .layerPopControl p button { font-size:1em; }
	.layerPopInner .popupBtm .layerPopControl ul li { border-left:none; }
	.layerPopInner .popupBtm .layerPopControl ul li button { width:1.8571em; height:3em; background-size:.8571em; }
	.layerPopInner .popupBtm .layerPopControl ul li .prev { background-image:url(../images/main/btn_layer_prev_mo.png); }
	.layerPopInner .popupBtm .layerPopControl ul li .next { background-image:url(../images/main/btn_layer_next_mo.png); }
	.layerPopInner .popupBtm .layerPopControl ul li .popupClose { background-image:url(../images/main/btn_layer_close_mo.png); }
}
/* mainSection */
.mainSection { background-color:#f4f4f7; padding:7.5em 2% 0; }
.mainSection .inner { display:flex; justify-content:space-between; max-width:1400px; margin:0 auto; padding:4.875em 0 7.875em; }
.mainSection .mainItems { flex-shrink:0; width:39.142857%; }
.mainSection .mainItems h3 { color:#1c2449; letter-spacing: -0.025em; line-height:1.4; font-weight: 400; font-size:4rem; }
.mainSection .mainItems h3 b { display:block; font-weight:900; }
.mainSection .searchBox { position:relative; margin-top:3rem; color:#1c2449; }
.mainSection .searchBox h4 { font-size:2rem; font-weight:600; }
.mainSection .searchBox .searchArea { margin-top:1rem; }
.mainSection .searchBox .searchArea ul,
.mainSection .searchBox .searchArea .btn button { border-radius:1.4rem; }
.mainSection .searchBox .searchArea ul { overflow:hidden; display:flex; justify-content:space-around; padding:.3rem 0; background:#fff; border:2px solid #5034de; box-sizing:border-box; }
.mainSection .searchBox .searchArea ul li { position:relative; flex:1; padding:0 1px; }
.mainSection .searchBox .searchArea ul li::before { content:''; position:absolute; left:0; top:50%; width:1px; height:2.1rem; background:#d9dfe4; transform:translateY(-50%); }
.mainSection .searchBox .searchArea ul li:first-child::before { display:none; }
.mainSection .searchBox .searchArea ul li::after { content:''; position:absolute; right:1rem; top:50%; width:1.7rem; height:1rem; background:url(../images/main/arrow_select.png) no-repeat center / contain; z-index:3; pointer-events:none; transform:translateY(-50%); }
.mainSection .searchBox .searchArea ul li.active::after { transform:translateY(-50%) rotate(180deg); }
.mainSection .searchBox .searchArea ul li select { width:100%; height:6rem; padding:0 3.8rem; background:transparent; border:none; font-size:var(--font-size18); }
.mainSection .searchBox .searchArea .btn { margin-top:1.3rem; }
.mainSection .searchBox .searchArea .btn button { width:100%; height:7rem; background:#5034de; color:#fff; font-size:var(--font-size22); font-weight:600; }
.mainSection .searchBox .searchArea .btn button i { display:inline-block; width:2rem; height:2rem; margin-right:1rem; background:url(../images/main/icon_search.png) no-repeat center / contain; vertical-align:middle; }
.mainSection .mainItems .linkItems { display:flex; justify-content:space-between; margin-top:2em; }
.mainSection .mainItems .linkItems li { flex:0 0 auto; width:10rem; }
.mainSection .mainItems .linkItems li a { display: block; text-align: center; line-height: 1.2; font-weight: 500; font-size: 1.125em; }
.mainSection .mainItems .linkItems li a span { display: block; position: relative; padding-top:11.4rem; }
.mainSection .mainItems .linkItems li a span::before { content:''; position: absolute; top: 0; left:50%; width:10rem; height:10rem; border-radius:1.625em; background:#fff no-repeat center / 5rem auto; transform:translateX(-50%); }
.mainSection .mainItems .linkItems li.i1 a span::before { background-image: url(../images/main/icon_main_link01.png); }
.mainSection .mainItems .linkItems li.i2 a span::before { background-image: url(../images/main/icon_main_link02.png); }
.mainSection .mainItems .linkItems li.i3 a span::before { background-image: url(../images/main/icon_main_link03.png); }
.mainSection .mainItems .linkItems li.i4 a span::before { background-image: url(../images/main/icon_main_link04.png); }
.mainSection .mainItems .linkItems li a:hover span::before,
.mainSection .mainItems .linkItems li a:focus span::before { transition:box-shadow 0.4s; border:1px solid #6958dd; box-shadow: 0px 0px 18px -4px rgba(96,159,150,0.39); }
.mainSection .reportArea { display:flex; flex-direction:column; justify-content:space-between; gap:3em; width:55%;/*770/1400*/ }
.mainSection .reportArea .tit { line-height:1; color:#212121; font-size:var(--font-size24); font-weight:600; }
.mainSection .reportArea .listBox { margin-top:2.2rem; }
.mainSection .reportArea .popularList { display:flex; justify-content:space-between; gap:3.2rem; }
.mainSection .reportArea .stateList,
.mainSection .reportArea .popularList .item { flex:1; background:#fff; border-radius:1.2rem; color:#1c2449; }
.mainSection .reportArea .stateList { padding:7.01298% 5.974%; }
.mainSection .reportArea .stateList ul { display:flex; justify-content:space-between; gap:1em; letter-spacing:-.03em; }
.mainSection .reportArea .stateList div { display:flex; flex-direction:column; justify-content:center; gap:1rem; height:6.8rem; padding-left:8.6rem; background:no-repeat left center / 6rem auto; }
.mainSection .reportArea .stateList .stateIcon1 div { background-image:url(../images/main/icon_state1.png); }
.mainSection .reportArea .stateList .stateIcon2 div { background-image:url(../images/main/icon_state2.png); }
.mainSection .reportArea .stateList .stateIcon3 div { background-image:url(../images/main/icon_state3.png); }
.mainSection .reportArea .stateList span { display:block; color:#333; }
.mainSection .reportArea .stateList strong { font-size:var(--font-size28); }
.mainSection .reportArea .popularList .item { padding:3.37662%; letter-spacing:-.025em; }
.mainSection .reportArea .popularList .item dt { text-align:center; font-size:var(--font-size28); font-weight:bold; }
.mainSection .reportArea .popularList .item dd { margin-top:1rem; border-top:1px solid #d9d8d8; }
.mainSection .reportArea .popularList .item dd li { display:flex; justify-content:space-between; align-items:center; margin-top:1.8rem; padding-left:3rem; background:no-repeat center left / 1.8rem auto; }
.mainSection .reportArea .popularList .item dd li.icon1 { background-image:url(../images/main/icon_popular1.png); }
.mainSection .reportArea .popularList .item dd li.icon2 { background-image:url(../images/main/icon_popular2.png); }
.mainSection .reportArea .popularList .item dd span { font-size:var(--font-size18); }
.mainSection .reportArea .popularList .item dd strong { color:#5034de; font-size:var(--font-size28); }
.mainSection .reportArea .popularList .item dd strong i { margin-left:.375em; color:#1c2449; font-size:var(--font-size16); font-weight:normal; }
.reportSlider .graphBoxWrap2 .graphBox { display:flex; justify-content:space-between; align-items:center; height:8.25em; margin-bottom: 0.375em; padding:1.75em 7.1875%; border-radius:1em; background-color: #fff; background-repeat: no-repeat; box-sizing:border-box; }
.reportSlider .graphBoxWrap2 .graphBox .boxTop { min-height:4.125em; padding-top:0.3125em; padding-left:14.5985%; background-repeat: no-repeat; background-position: 0 0; background-size:3.625em auto; }
.reportSlider .graphBoxWrap2 .graphBox .state사업체수 { background-image:url('../images/main_2024/icon_state1.png'); }
.reportSlider .graphBoxWrap2 .graphBox .state매출액,
.reportSlider .graphBoxWrap2 .graphBox .state출하액 { background-image:url('../images/main_2024/icon_state2.png'); }
.reportSlider .graphBoxWrap2 .graphBox .state종사자수 { background-image:url('../images/main_2024/icon_state3.png'); }
.reportSlider .graphBoxWrap2 .graphBox .state주요생산비,
.reportSlider .graphBoxWrap2 .graphBox .state영업비용,
.reportSlider .graphBoxWrap2 .graphBox .state부가가치 { background-image:url('../images/sub/icon_state2.png'); }
.reportSlider .graphBoxWrap2 .graphBox .state급여액 { background-image:url('../images/sub/icon_state2.png'); }
.reportSlider .graphBoxWrap2 .graphBox .boxTop h4 { font-size: 1.375em; }
.reportSlider .graphBoxWrap2 .graphBox .boxTop h4 span { display: inline-block; margin-left:0.5556em; color: #737373; font-weight: 400; font-size:0.818em; }
.reportSlider .graphBoxWrap2 .graphBox .boxTop p { font-weight: 700; font-size:1.625em; }
.reportSlider .graphBoxWrap2 .graphBox .boxTop p i { display: inline-block; margin-left: 0.4em; font-weight: 400; font-size:0.6923em; }
.reportSlider .graphBoxWrap2 .graphBox .stateLine ul li { display:flex; justify-content:space-between; letter-spacing:-.05em; font-size: 1.125em; }
.reportSlider .graphBoxWrap2 .graphBox .stateLine ul li:first-child { margin-bottom:0.5556em; }
.reportSlider .graphBoxWrap2 .graphBox .stateLine .tit { display:inline-block; margin-right:1.1112em; }
.reportSlider .graphBoxWrap2 .graphBox .stateLine .txt { display:inline-block; font-weight:bold; }
.arrowLine i { overflow:hidden; display:inline-block; position:relative; margin-top:0.2778em; margin-left: 0.3em; vertical-align: top; text-indent:-999px; width: 0; height: 0; border-style: solid; border-width: 0px 7px 12px 7px; border-color: transparent transparent #d30000 transparent; }
.arrowLine.up { color:#d30000; }
.arrowLine.down { color:#0005d3; }
.arrowLine.down i { margin-top:0.3889em; border-color: transparent transparent #0005d3 transparent; transform:rotate(180deg); }
.reportData .controls { display:flex; justify-content:center; align-items:center; margin-top: 0.625em; }
.reportData .controls .slick-arrow { overflow: hidden; display: inline-block; width: 2em; height: 22px; background-repeat: no-repeat; background-position: 50% 50%; background-size:2em auto; text-indent:-999px; }
.reportData .controls .slick-arrow.slick-hidden { display: none; }
.reportData .controls .slick-prev { background-image:url(../images/main_2024/btn_prev.svg); }
.reportData .controls .slick-next { background-image:url(../images/main_2024/btn_next.svg); }
.reportData .controls .dots .slick-dots { display:flex; margin:0 1em; }
.reportData .controls .dots .slick-dots li { margin:0 4px; }
.reportData .controls .dots .slick-dots li button { overflow: hidden; display: inline-block; width: 11px; height: 11px; border-radius:50%; border:2px solid #147774; text-indent:-999px; }
.reportData .controls .dots .slick-dots li.slick-active button { background: #147774; border-radius:0; }
@media screen and (max-width: 1200px) {
    .mainSection { padding-top:0; }
    .mainSection .inner { padding:2% 0; font-size:0.9375em; }
	#container { padding-top:5.6364em; }
}
@media screen and (max-width: 1200px) {
	.mainSection .inner { display: block; padding-top:4.818em; padding-bottom:4.5455em; font-size: 1em; }
	.mainSection .mainItems,
	.mainSection .reportArea { width: 100%; }
	.mainSection .mainItems { margin-bottom:4.7273em; }
	.mainSection .mainItems h3 { text-align: center; font-size: 2em; }
	.mainSection .mainItems h3 b { display: block; }
	.mainSection .mainItems .searchBox { margin-top:3em; }
	.mainSection .mainItems .searchBox .searchText { font-size: 1.273em; }
	.mainSection .mainItems .linkItems { justify-content:flex-start; margin-top:3.5455em; }
	.mainSection .mainItems .linkItems li { width: 25%; }
	.mainSection .mainItems .linkItems li a { font-size: 1.273em; }
	.mainSection .mainItems .linkItems li a span { padding-top: 5.5em; }
	.mainSection .reportArea { max-width:none; }
	.mainSection .reportArea .reportSlider { margin-top: 1.182em; }
}
@media screen and (max-width:640px) {
    .mainSection .reportArea .stateList ul { flex-direction:column; }
    .mainSection .reportArea .stateList div { flex-direction:row; justify-content:space-between; align-items:center; }
}
@media screen and (max-width:480px) {
    .mainSection .reportArea .popularList { flex-direction:column; }
}

/* contractWrap */
.contractWrap { max-width:1400px; margin:8% auto; padding:0 2%; }
.contractTitBox h3 { line-height:1; font-size:4.4rem; font-weight:800; }
.contractTitBox .txt { margin-top:1.8rem; color:#7a7a7a; font-size:var(--font-size20); font-weight:600; }
.contractArea { display:flex; justify-content:space-between; gap:1rem; margin-top:5.2rem; }
.contractArea>div { position:relative; flex-grow:0; flex-shrink:0; width:47%; }
.contractArea h4 { font-size:var(--font-size26); font-weight:800; }
.contractArea .btnMore { position:absolute; right:0; top:0; }
.contractArea .btnMore a { display:block; padding:.6rem 0; font-size:var(--font-size18); font-weight:500; }
.contractArea table { margin-top:2.6rem; }
.contractArea table,
.contractArea table thead,
.contractArea table tbody { display:block; }
.contractArea table tr { display:flex; justify-content:space-between; text-align:center; }
.contractArea table tbody tr { margin-top:2.4rem; border:1px solid transparent; box-sizing:border-box; }
.contractArea table tr th,
.contractArea table tr td { display:flex; justify-content:center; align-items:center; flex:1; }
.contractArea table thead th { padding:0 1rem; color:#808699; font-size:var(--font-size20); font-weight:500; letter-spacing:-.1rem; }
.contractArea table tbody tr { padding:1.9rem 1rem; background:#f4f4f4; border-radius:1.2rem; }
.contractArea table tbody tr th,
.contractArea table tbody tr td { font-size:var(--font-size19); font-weight:600; }
.contractArea table tbody tr th { line-height:1.15789; }
.contractArea table tbody tr td { line-height:1.26316; letter-spacing:-.038rem; }
.contractArea table tbody tr .certification { flex-direction:column; gap:1rem; }
.contractArea table tbody tr .certification span { display:inline-flex; width:8rem; height:2.2rem; padding:0.2rem 0.4rem; background:#fff; border:1px solid; border-radius:2rem; justify-content:center; align-items:center; color:#919191; font-size:1.6rem; font-weight:400; }
.contractArea table tbody tr .certification span.on { font-weight:600; }
.contractArea table tbody tr .certification span.eco.on { color:var(--color-eco); }
.contractArea table tbody tr .certification span.gap.on { color:var(--color-gap); }
.contractArea table tbody tr .certification span.other.on { color:var(--color-other); }
.contractArea table tbody tr:hover,
.contractArea table tbody tr:focus,
.contractArea table tbody tr.hover { background:#fff; border-color:#0546ff; }
.contractArea table tbody tr:hover .item,
.contractArea table tbody tr.hover .item,
.contractArea table tbody tr:hover .price,
.contractArea table tbody tr.hover .price { color:#0546ff; }
/* notice */
.noticeWrap { padding:10rem 2%; background:url(../images/main/bg_main1.jpg) no-repeat center / cover; }
.noticeWrap .inner { display:flex; position:relative; flex-direction:row-reverse; justify-content:space-between; max-width:1400px; margin:0 auto; }
.noticeWrap .noticeTitBox { flex-grow:0; flex-shrink:0; width:25rem; }
.noticeWrap .noticeTitBox h3 { text-align:right; color:#fff; }
.noticeWrap .noticeTitBox h3 span { display:block; font-size:2.734rem; }
.noticeWrap .noticeTitBox h3 strong { display:block; margin-top:1em; line-height:1.18; font-size:4.4rem; word-break:keep-all; }
.noticeWrap .noticeTitBox .noticeControl { display:flex; gap:.8rem; position:absolute; right:0; bottom:0; }
.noticeWrap .noticeTitBox .noticeControl button { position:relative; width:7rem; height:7rem; background:rgba(0,0,0,.5); border:1px solid #fff; border-radius:50%; color:transparent; }
.noticeWrap .noticeTitBox .noticeControl button::after { content:'prev'; position:absolute; left:0; top:50%; width:100%; margin-top:-.5em; text-align:center; color:#fff; font-size:1.6rem; font-family:swiper-icons; }
.noticeWrap .noticeTitBox .noticeControl button.notice-button-prev::after { content:'prev'; }
.noticeWrap .noticeTitBox .noticeControl button.notice-button-next::after { content:'next'; }
.noticeWrap .listBox { flex-grow:0; flex-shrink:0; position:relative; width:78.57142%; }
.noticeWrap .noticeList { overflow:hidden; position:relative; max-width:1100px;  width:100%; border-radius:1.2rem; }
.noticeList .swiper-slide { width:auto; }
.noticeList a { display:block; max-width:352px; padding:4rem; background:#fff; border-radius:1.2rem; }
.noticeList a .category { display:inline-block; min-width:9.4rem; margin-top:2.4rem; padding:.5rem; border:1px solid; border-radius:2rem; box-sizing:border-box; line-height:1.28571; text-align:center; color:#79a07d; font-size:var(--font-size14); font-weight:bold; font-style:normal; }
.noticeList a .txtBox { display:block; min-height:11.5em; }
.noticeList a .tit,
.noticeList a .txt { display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.noticeList a .tit { max-height:4.5em; margin-top:1em; line-height:1.5; font-size:var(--font-size20); }
.noticeList a .txt { max-height:3.999em; margin-top:1.8em; line-height:1.333; font-size:var(--font-size15); }
.noticeList a .date { display:block; margin-top:2em; line-height:1.333; font-size:var(--font-size15); }
.listBox .notice-pagination { position:relative; margin-top:3.8rem; padding-top:3rem; }
.listBox .notice-pagination .btnMore { position:absolute; right:0; top:0; }
.listBox .notice-pagination .btnMore a { color:#fff; font-size:var(--font-size20); font-weight:bold; }
.listBox .barBox { position:relative; width:100%; height:.5rem; background-color:rgba(255,255,255,.36); }
.listBox .pagination-indicator { position:absolute; left:0; height:100%; background-color:#fff; transition:all 0.3s ease; }
/* 서비스 & 자료실 */
.serviceWrap { display:flex; justify-content:space-between; max-width:1400px; margin:8% auto; padding:0 2%; }
.serviceWrap h3 { margin-bottom:1.6em; font-size:var(--font-size30); font-weight:800; }
.serviceArea { width:38.57142%; }
.serviceArea ul { overflow:hidden; display:grid; justify-content:space-between; column-gap:8%; grid-row-gap:4rem; max-width:50rem; }
.serviceArea .icon1 { grid-column:1; }
.serviceArea .icon2 { grid-column:2; }
.serviceArea .icon3 { grid-column:3; }
.serviceArea ul a { display:flex; flex-direction:column; width:100%; height:100%; text-align:center; }
.serviceArea ul a i { display:block; width:12.6rem; height:12.6rem; margin:0 auto; line-height:1; background:#f8f7fe no-repeat center / 6rem auto; border:1px solid #f9f9f9; border-radius:50%; }
.serviceArea .icon1 a i { background-image:url(../images/main/icon_service1.png); }
.serviceArea .icon2 a i { background-image:url(../images/main/icon_service2.png); }
.serviceArea .icon3 a i { background-image:url(../images/main/icon_service3.png); }
.serviceArea .icon4 a i { background-image:url(../images/main/icon_service4.png); }
.serviceArea .icon5 a i { background-image:url(../images/main/icon_service5.png); }
.serviceArea .icon6 a i { background-image:url(../images/main/icon_service6.png); }
.serviceArea ul a .txt { display:block; margin-top:1.4rem; font-size:var(--font-size18); }
.dataArea { position:relative; width:60%; }
.dataArea ul { display:flex; justify-content:space-around; gap:.8rem; }
.dataArea ul li { width:100%; }
.dataArea ul a { display:block; }
.dataArea ul a span { display:block; }
.dataArea ul a span.img { position:relative; height:31.6rem; background:no-repeat center / cover; border-radius:1.2rem; line-height:1.27; color:#fff; }
.dataArea ul a span.img b { position:absolute; left:3.6rem; bottom:3.6rem; max-width:10em; margin-right:3.6em; font-size:var(--font-size26); font-weight:900; word-break:keep-all; }
.dataArea ul a span.img i { position:absolute; right:2em; bottom:2em; border-bottom:1px solid; font-size:var(--font-size20); font-weight:500; }
.dataArea ul a span.txt { margin-top:1.6666em; text-align:center; font-size:var(--font-size18); letter-spacing:-.025em; }
.dataArea .btnMore { position:absolute; right:0; top:0; }
.dataArea .btnMore a { display:block; padding-top:1.2rem; line-height:1; font-size:var(--font-size19); font-weight:700;}
@keyframes slidein {
    0% { opacity:0; }
    10% { transform:translateY(0); opacity:1; }
    100% { transform:translateY(1rem); opacity:0; }
}
@media only screen and (max-width:960px) {
    .contractWrap { margin:6rem 4rem; padding:0; }
    .contractTitBox h3,
    .contractArea h4 { font-size:var(--font-size22); }
    .contractTitBox .txt { display:none; }
    .contractArea h4 { margin:3rem 0 2rem; }
    .contractArea table { border-top:1px solid #d4d4d4; }
    .contractArea table thead tr { margin-top:2.4rem; }
    .contractArea,
    .noticeWrap .inner,
    .serviceWrap { display:block; }
    .contractArea>div,
    .noticeWrap .listBox,
    .serviceArea,
    .dataArea { width:100%; }
    .noticeWrap { overflow:hidden; padding:0; background-position:right bottom; }
    .noticeWrap .inner { margin:5rem 0; }
    .noticeWrap .noticeTitBox h3 { margin:0 0 5rem 4rem; text-align:left; }
    .noticeWrap .noticeTitBox h3 strong { display:none; }
    .noticeWrap .noticeTitBox .noticeControl { bottom:auto; top:0; right:4rem; }
    .noticeWrap .noticeTitBox .noticeControl button { width:5rem; height:5rem; }
    .noticeWrap .noticeList { padding:0 4rem; border-radius:0; box-sizing:border-box; }
    .noticeList a { max-width:300px; padding:3rem; }
    .noticeList a .category { display:none; }
    .noticeList a .txtBox { height:10em; }
    .noticeList a .tit { margin:0; }
    .noticeList a .txt { margin-top:1em; }
    .listBox .notice-pagination { margin:3rem 4rem 0; }
    .serviceWrap { margin:6rem 4rem; padding:0; }
    .serviceWrap h3 { margin-bottom:4rem; font-size: var(--font-size22); }
    .serviceArea ul { max-width:none; column-gap:1rem; grid-row-gap:3rem; }
    .dataArea { margin-top:6rem; }
    .dataArea ul a span.txt { display:none; }
}
@media only screen and (max-width:720px) {
    .contractArea table .date { display:none;}
    .contractArea table .certification { flex-grow:0; flex-shrink:0; flex-basis:4.5em; }
    .contractArea table tbody tr .certification span { width:4.5em; }
}
@media only screen and (max-width:520px) {
    .noticeWrap .noticeList{ padding-left:2rem; padding-right:2rem; }
    .contractWrap,
    .listBox .notice-pagination,
    .serviceWrap { margin:9.375% 2rem; }
    .noticeWrap .noticeTitBox h3 { margin-left:2rem; }
    .contractArea table tbody tr { padding:2%; }
    .contractArea table thead th { padding:0 .5rem;}
    .contractArea table .price { display:none;}
    .noticeList a { max-width:220px; }
    .serviceArea ul a i { width:22vw; height:22vw; background-size:14vw auto; }
    .dataArea ul { flex-direction:column; }
}