@charset "utf-8"; @import url('html5_reset.css'); @import url('layout.css'); :root { --thead-height: 80px; /* thead height */ } 

/********** loading **********/
.loading-box { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: none; justify-content: center; align-items: center; z-index: 9999; background: rgba(0,0,0,0.3); } 
.loading-box.on { display: flex; } 
.loading-box .img { position: relative; } 
.loading-box .img span { position: absolute; top: 0; left: 0; height: 0; overflow: hidden; animation: loading 2s infinite; } 
@keyframes loading { 
 0% { height: 0; } 
50% { height: 100%; } 
100% { height: 0; } 
 }

/********** skip_nav **********/
.skip_nav { position: relative; z-index: 1000; display: block; overflow: hidden; height: 0; background:#000; text-align: center; } 
.skip_nav:focus { overflow: auto; height: auto; padding: 5px 0; color:#fff; outline: 2px dotted #fff; outline-offset: -2px; } 

/********** 숨김 **********/
.hide { overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); }

/********** overflow-hidden **********/
.overflow-hidden { overflow: hidden; } 

/********** height **********/
:root { --header-height: 80px; --header-scroll-height: 80px; } 
@media only screen and (max-width: 1023px){
 :root { --header-height: 60px; --header-scroll-height: 60px; } 
 }

/********** color **********/
:root { --main-color: #222;
--main-light: #fffde5; --point-color: #156A89; --point-light:#E8F1F4; --gray-33: #333333; --gray-44: #444444; --gray-55: #555555; --gray-66: #666666; --gray-dd: #dddddd; --gray-cc: #cccccc; --gray-e5: #e5e5e5; --gray-e9: #e9e9e9; --gray-fa: #fafafa; --gray-f5: #f5f5f5; --gray-f7: #f7f7f7; --gray-f9: #f9f9f9; --bd-color: #ccc; --red1: #d81313; --green: #459c00; --orange: #ef8a2d; --point-light:#E8F1F4; } 

/* background color */
.bg-point { background-color: var(--point-color); color: #fff; } 
.bg-green { background-color: var(--green); color: #fff; } 
.bg-point-light { background-color: var(--point-light); color: #444; } 
.bg-pink3 { background-color: var(--pink3); color: #fff; } 
.bg-pink4 { background-color: var(--pink4); color: #fff; } 
.bg-gray-33 { background-color: var(--gray-33); color: #fff; } 
.bg-gray-44 { background-color: var(--gray-44); color: #fff; } 
.bg-gray-55 { background-color: var(--gray-55); color: #fff; } 
.bg-gray-66 { background-color: var(--gray-66); color: #fff; } 
.bg-gray-dd { background-color: var(--gray-dd); color: #fff; } 
.bg-gray-e5 { background-color: var(--gray-e5); color: #666; } 
.bg-gray-e9 { background-color: var(--gray-e9); color: #666; } 
.bg-gray-f5 { background-color: var(--gray-f5); color: #666; } 
.bg-gray-f7 { background-color: var(--gray-f7); color: #666; } 
.bg-gray-f9 { background-color: var(--gray-f9); color: #666; } 
.bg-gray-fa { background-color: var(--gray-fa); color: #666; } 
.bg-white { background-color: #ffffff; color: var(--main-color); } 
.gy-bg { background: #4a4a4a; color: #fff; } 
.bg-main { background: #222222; color: #fff; } 

/* font color */
.fc-yellow1 { color: var(--yellow1); } 
.fc-main { color: var(--main-color); } 
.fc-pink2 { color: var(--pink2); } 
.fc-pink3 { color: var(--pink3); } 
.fc-pink4 { color: var(--pink4); } 
.fc-purple1 { color: var(--purple1); } 
.fc-gray-44 { color: var(--gray-44); } 
.fc-gray-55 { color: var(--gray-55); } 
.fc-gray-66 { color: var(--gray-66); } 
.fc-gray-dd { color: var(--gray-dd); } 
.fc-gray-cc { color: var(--gray-cc); } 
.fc-gray-e5 { color: var(--gray-e5); } 
.fc-gray-e9 { color: var(--gray-e9); } 
.fc-gray-f5 { color: var(--gray-f5); } 
.fc-gray-f9 { color: var(--gray-f9); } 
.fc-red { color: var(--red1) !important; } 
.fc-orange { color: var(--orange); } 
.fc-point {color: var(--point-color);}

/* border color */
.bd-yellow1 { border: 1px solid var(--yellow1); } 
.bd-pink1 { border: 1px solid var(--pink1); } 
.bd-pink2 { border: 1px solid var(--pink2); } 
.bd-pink3 { border: 1px solid var(--pink3); } 
.bd-pink4 { border: 1px solid var(--pink4); } 
.bd-gray-33 { border: 1px solid var(--gray-33); } 
.bd-gray-44 { border: 1px solid var(--gray-44); } 
.bd-gray-55 { border: 1px solid var(--gray-55); } 
.bd-gray-66 { border: 1px solid var(--gray-66); } 
.bd-gray-dd { border: 1px solid var(--gray-dd); } 
.bd-gray-cc { border: 1px solid var(--gray-cc); } 
.bd-gray-e5 { border: 1px solid var(--gray-e5); } 
.bd-gray-e9 { border: 1px solid var(--gray-e9); } 
.bd-gray-f5 { border: 1px solid var(--gray-f5); } 
.bd-gray-f9 { border: 1px solid var(--gray-f9); } 
.bd-main { border: 1px solid var(--bd-color); color: #444; } 

.bd { border: 1px solid var(--bd-color); } 
.bd-top { border-top:1px solid var(--bd-color); } 
.bd-bottom { border-bottom:1px solid var(--bd-color); } 

/* 스크롤 애니메이션 */
.trans-text { overflow: hidden; } 
.trans-text [data-aos=fade-up] { display: block; -webkit-transform: translate3d(0, 104%, 0); transform: translate3d(0, 104%, 0); }
.trans-img { overflow: hidden; } 
.trans-img img[data-aos=fade-right] { -webkit-transform: translate3d(-101%, 0, 0); transform: translate3d(-101%, 0, 0); }


/********** tab-btn **********/
.tab-st1 ul.tab-btn { display: flex; } 
.tab-st1 ul.tab-btn li { flex: 1; } 
.tab-st1 ul.tab-btn li a { display: block; height: 52px; line-height: 52px; font-weight: 500; font-size: 1.000em; text-align: center; background: #fff; border: 1px solid #dddddd; } 
.tab-st1 ul.tab-btn li.on a { color: #fff; background: var(--main-color); border-color: var(--main-color); } 
.tab-st1 .tab-cont { margin-top: 30px; } 
.tab-st1 .tab-cont .cont { display: none; } 
.tab-st1 .tab-cont .cont.on { display: block; } 

.tab-st2 ul.tab-btn { display: flex; flex-wrap: wrap; } 
.tab-st2 ul.tab-btn li { margin-right: 10px; margin-bottom: 10px; } 
.tab-st2 ul.tab-btn li:last-child { margin-right: 0; } 
.tab-st2 ul.tab-btn li a { display: block; height: 34px; line-height: 34px; padding: 0 15px; color: #666; border: 1px solid #ddd; border-radius: 50px; } 
.tab-st2 ul.tab-btn li.on a { font-weight: 600; color: #fff; background: var(--main-color); border-color: var(--main-color); } 
.tab-st2 .tab-cont .cont { display: none; } 
.tab-st2 .tab-cont .cont.on { display: block; } 

.tab-st3 ul.tab-btn { position: relative; display: flex; } 
.tab-st3 ul.tab-btn:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: var(--main-color); } 
.tab-st3 ul.tab-btn li { flex: 1; } 
.tab-st3 ul.tab-btn li a { display: block; height: 50px; line-height: 50px; font-size: 1.063em; font-weight: 600; color: var(--main-color); text-align: center; } 
/* .tab-st3 ul.tab-btn li.on { z-index: 10; } */
.tab-st3 ul.tab-btn li.on a { font-weight: 600; color: #fff; background: var(--main-color); } 
.tab-st3 .tab-cont .cont { display: none; } 
.tab-st3 .tab-cont .cont.on { display: block; } 


/* 메인 탭 컨텐츠와 버튼 같이 있도록 수정 */
.tab-st4 > ul { position: relative; display: flex; flex-wrap: wrap; width: 100%; } 
.tab-st4 > ul > li { float: left; } 
.tab-st4 > ul > li:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: var(--main-color); } 
.tab-st4 > ul > li .tab-btn { position: relative; z-index: 10; display: block; height: 45px; line-height: 45px; font-size: 1em; color: #777; text-align: center; padding: 0 25px; border-top-left-radius: 8px; border-top-right-radius: 8px; } 
.tab-st4 > ul > li:last-child .tab-btn { left: auto; right: 0; } 
.tab-st4 > ul > li.on .tab-btn { font-weight: 600; color: var(--main-color); border: 1px solid var(--main-color); border-bottom: 1px solid #fff; } 
.tab-st4 > ul > li .tab-cont { position: absolute; left:0; top: 60px; display: none; width: 100%; } 
.tab-st4 > ul > li.on .tab-cont { display: block; } 

/* 태블릿 */
@media only screen and (max-width: 1023px){
 .tab-st3 ul.tab-btn { flex-wrap: wrap; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; } 
.tab-st3 ul.tab-btn:after { display: none; } 
.tab-st3 ul.tab-btn li { flex: 1 1 40%; } 
.tab-st3 ul.tab-btn li a { height: 45px; line-height: 45px; background: #fdfdfd; border: 1px solid #e5e5e5; border-bottom: 0; border-right: 0; } 
.tab-st3 ul.tab-btn li.on a { color: #fff; background: var(--main-color); border-bottom-color: var(--main-color); } 


.tab-st4 > ul > li:after { display: none; } 
.tab-st4 > ul > li { width: 33.3%; } 
.tab-st4 > ul > li .tab-btn { width: 100%; height: 45px; line-height: 45px; background: #fdfdfd; border: 1px solid #e5e5e5; border-bottom: 0; border-right: 0; } 
.tab-st4 > ul > li:nth-child(3n) .tab-btn { border-right: 1px solid #e5e5e5; } 
.tab-st4 > ul > li:nth-child(n+4) .tab-btn { border-bottom: 1px solid #e5e5e5; } 
.tab-st4 > ul > li.on .tab-btn { color: #fff; background: var(--main-color); border-bottom-color: var(--main-color); } 
 }

/* 모바일 */
@media only screen and (max-width: 560px){
 .tab-st1 ul.tab-btn { display: block; } 
.tab-st1 ul.tab-btn li a { height: 45px; line-height: 45px; } 
 }
/********** input **********/
/* 인풋 기본 스타일 */
/* 폼 */
.esn { font-size: 14px; color: var(--red1); margin-left: 2px; } 
.inp-st1 { width: 100%; height: 45px; line-height: 45px; padding: 0 15px; font-size: 15px; background: #fff; border: 1px solid var(--gray-e5); } 
.max25 { max-width: 25rem; } 
.max35 { max-width: 35rem; } 
.inp-sht { max-width: 120px; } 
.inp-mid { max-width: 180px; } 
.inp-st1[type="date"] { width: unset; } 
select.inp-st1 { appearance: none; padding: 0 15px 0 15px; font-size: 15px; background: #fff url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 47.25 31.04'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23555; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cpolyline class='cls-1' points='44.25 3 23.62 28.04 3 3'/%3E%3C/svg%3E") no-repeat right 15px center / auto 6px; } 
.inp-st2 { height: 40px; line-height: 40px; padding: 0 10px; font-size: 15px; background: #fff; border: none; border-bottom: 1px solid var(--gray-e5); } 
select.inp-st2 { appearance: none; padding: 0 50px 0 10px; font-size: 15px; background: #fff url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 47.25 31.04'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23555; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cpolyline class='cls-1' points='44.25 3 23.62 28.04 3 3'/%3E%3C/svg%3E") no-repeat right 15px center / auto 6px; } 
.inp-st3 { width: 100%; height: 40px; line-height: 40px; padding: 0 10px; font-size: 15px; border: 1px solid var(--gray-e5); } 
.inp-flex { display: flex; align-items: center; gap: 5px; } 
.inp-flex button { flex-shrink: 0; } 
.inp-flex .inp-txtarea { width: 100%; border: 1px solid var(--gray-cc); } 
.inp-flex .inp-txtarea .txt-box { position: relative; width: 100%; padding: 7px; } 
.inp-flex .inp-txtarea .txt-box .textarea textarea { width: 100%; height: 35px; padding: 7px; resize: none; } 
.inp-flex .inp-txtarea .txt-box .textarea label { position: absolute; top: 50%; transform: translateY(-50%); left: 15px; z-index: 1; font-size: 15px; color: #999; } 
.inp-flex .inp-txtarea .txt-box .file-box2 { display: none; margin-top: 20px; } 
.inp-flex .inp-txtarea .txt-box .write-count { display: none; padding: 10px; font-size: 14px; color: #777; text-align: right; } 
.inp-flex .inp-txtarea .bottom { display: none; justify-content: space-between; align-items: center; padding: 8px 8px 8px 15px; border-top: 1px solid var(--gray-e5); } 
.inp-flex .inp-txtarea .bottom .lf { display: flex; align-items: center; gap: 20px; } 
.inp-flex .inp-txtarea .bottom .lf .secret-btn.on .inp-st3 { display: inline-block; } 
.inp-flex .inp-txtarea .bottom .rg { display: flex; gap: 5px; margin-left: auto; } 
.inp-flex .inp-txtarea.open .txt-box .write-count { display: block; } 
.inp-flex .inp-txtarea.open .txt-box textarea { height: 90px; } 
.inp-flex .inp-txtarea.open .txt-box label { display: none; } 
.inp-flex .inp-txtarea.open .txt-box .file-box2 { display: block; } 
.inp-flex .inp-txtarea.open .bottom { display: flex; } 
.inp-flex .inp-txtarea.open .bottom .write-count { display: block; } 


@media only screen and (max-width: 767px){
 .inp-st1 { height: 38px; line-height: 38px; padding: 0 10px; font-size: 14px; } 
select.inp-st1 { padding: 0 15px 0 15px; font-size: 14px; background-size: auto 6px; background-position: right 15px center; } 

.inp-flex .inp-txtarea.open .bottom { flex-direction: column; } 
.inp-flex .inp-txtarea .bottom .lf { width: 100%; } 
.inp-flex .inp-txtarea .txt-box textarea { height: 38px; padding: 10px; } 
.inp-flex .inp-txtarea .txt-box label { left: 10px; font-size: 14px; } 
 }
@media only screen and (max-width: 470px){
 .max25 { max-width: unset; } 
.max35 { max-width: unset; } 
.inp-sht { max-width: unset; } 
.inp-mid { max-width: unset; } 
.inp-st1[type="date"] { width: 100%; } 
.inp-flex.email { display: block; } 
/* .inp-flex.email > .hyp { display: none; } */
.inp-flex.email > select { width: 100%; margin-top: 5px; } 
.inp-flex .inp-txtarea .bottom { flex-direction: column; align-items: baseline; gap: 8px; padding: 8px; } 
.inp-flex .inp-txtarea .bottom .lf { flex-direction: column; align-items: baseline; gap: 5px; } 
.inp-flex .inp-txtarea .bottom .rg { width: 100%; } 
 }

/********** checkbox & radio **********/
/* inline */
.checkbox-list1 { display: flex; flex-wrap: wrap; gap: 5px 10px; align-items: center; } 
.checkbox-list1 li { position: relative; } 

/* block */
.checkbox-list2 li { display: block; position: relative; margin-bottom: 6px; } 
.checkbox-list2 li:last-child { margin-bottom: 0; } 

/*** checkbox ***/
.chk-st1-box { position: relative; } 
.chk-st1-box input { appearance:none; position: absolute; top: 3px; left: 0; width: 18px; height: 18px; border:none; background:transparent; } 
.chk-st1-box input + label { position: relative; padding-left: 25px; font-size: 1.6rem; color: #444; cursor: pointer; } 
.chk-st1-box input + label:before { content: ""; position: absolute; top: 0; left: 0; width: 18px; height: 18px; border: 1px solid #a6a6a6; border-radius: 2px; } 
.chk-st1-box input:checked + label { font-weight: 600; } 
.chk-st1-box input:checked + label:before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50.38 37.05' width='11'%3E%3Cg%3E%3Cpolygon fill='%23fff' points='16.53 37.05 0 20.53 6.61 13.91 16.91 24.2 44.17 0 50.38 7 16.53 37.05'/%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; background-color: var(--main-color); border-color: var(--main-color); } 

input[type='checkbox'].check-st2, input[type='radio'].check-st2 { appearance: none; -webkit-appearance: none; -moz-appearance: none; position: absolute; top: 3px; left: 0; width: 20px; height: 20px; margin: 0; padding: 0; border: 0; }
input[type='checkbox'].check-st2::-ms-check, input[type='radio'].check-st2::-ms-check { display:none }
input[type='checkbox'].check-st2 + label.check-st2, input[type='radio'].check-st2 + label.check-st2 { position: relative; z-index: 1; padding-left: 26px; font-weight: 400; font-size: 0.938em; color: #555; }
input[type='checkbox'].check-st2 + label.check-st2:before, input[type='radio'].check-st2 + label.check-st2:before { content: ""; position: absolute; top: 0; left: 0; width: 18px; height: 18px; border: 1px solid #e5e5e5; }
input[type='checkbox'].check-st2:checked + label.check-st2:before, input[type='radio'].check-st2:checked + label.check-st2:before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50.38 37.05' width='11'%3E%3Cg%3E%3Cpolygon fill='%23fff' points='16.53 37.05 0 20.53 6.61 13.91 16.91 24.2 44.17 0 50.38 7 16.53 37.05'/%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; background-color: var(--main-color); border-color: var(--main-color); }
input[type='checkbox'].check-st2:checked + label.check-st2, input[type='radio'].check-st2:checked + label.check-st2 { font-weight: 600; color: var(--main-color); }

input[type='checkbox'].check-st3, input[type='radio'].check-st3 { appearance: none; -webkit-appearance: none; -moz-appearance: none; position: absolute; top: 3px; left: 0; width: 100%; height: 45px; margin: 0; padding: 0; border: 0; }
input[type='checkbox'].check-st3::-ms-check, input[type='radio'].check-st3::-ms-check { display:none }
input[type='checkbox'].check-st3 + label.check-st3, input[type='radio'].check-st3 + label.check-st3 { display: block; width: 100%; line-height: 45px; font-weight: 400; font-size: 0.938em; color: #555; text-align: center; }
input[type='checkbox'].check-st3 + label.check-st3:before, input[type='radio'].check-st3 + label.check-st3:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 45px; border: 1px solid #e5e5e5; }
input[type='checkbox'].check-st3:checked + label.check-st3, input[type='radio'].check-st3:checked + label.check-st3 { font-weight: 600; color: var(--main-color); }
input[type='checkbox'].check-st3:checked + label.check-st3:before, input[type='radio'].check-st3:checked + label.check-st3:before { background: var(--main-color); z-index: -1; }
input[type='checkbox'].check-st3:checked + label.check-st3, input[type='radio'].check-st3:checked + label.check-st3 { color: #fff; }
/* 지원사업 필터 체크박스 */
input[type='checkbox'].check-st4, input[type='radio'].check-st4 { appearance: none; -webkit-appearance: none; -moz-appearance: none; position: absolute; top: 1px; left: 0; width: 100%; height: 30px; margin: 0; padding: 0; border: 0; }
input[type='checkbox'].check-st4::-ms-check, input[type='radio'].check-st4::-ms-check { display:none } 
input[type='checkbox'].check-st4 + label.check-st4, input[type='radio'].check-st4 + label.check-st4 { display: block; width: 100%; line-height: 30px; padding: 0 13px; font-weight: 500; font-size: 0.938em; color: #444; text-align: center; border: 1px solid var(--main-color); border-radius: 50px; cursor: pointer; } 
input[type='checkbox'].check-st4:checked + label.check-st4, input[type='radio'].check-st4:checked + label.check-st4 { font-weight: 600; color: #fff; background: var(--main-color); border-color: var(--main-color); } 


/* 체크박스 */
.checklist-st1 { display: flex; flex-wrap: wrap; gap: 15px 20px; } 
.checklist-st1 > li {position: relative;}
.checkbox { position: relative; } 
input.chk-st1 { position: absolute; top: 3px; left: 0; width: 18px; height: 18px; cursor: pointer; border: none; appearance: none; background: transparent; } 
input.chk-st1 + label.chk-st1 { position: relative; padding-left: 25px; font-size: 15px; color: #666; cursor: pointer; } 
input.chk-st1 + label.chk-st1::before { content: ""; position: absolute; top: 1px; left: 0; width: 18px; height: 18px; background: #fff; border: 1px solid var(--gray-e5); } 
input.chk-st1:checked + label.chk-st1 { font-weight: 500; color: #444; } 
input.chk-st1:checked + label.chk-st1::before { content: ""; position: absolute; top: 0px; left: 0; width: 18px; height: 18px; border: 1px solid #156A8982; } 
input.chk-st1:checked + label.chk-st1::after { content: ""; position: absolute; top: 0; left: 0; width: 18px; height: 18px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50.38 37.05' width='11'%3E%3Cg%3E%3Cpolygon fill='%23156A89' points='16.53 37.05 0 20.53 6.61 13.91 16.91 24.2 44.17 0 50.38 7 16.53 37.05'/%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; } 

/* 라디오 */
.radio { position: relative; } 
input.rdo-st1 { appearance: none; position: absolute; top: 1px; left: 0; width: 18px; height: 18px; margin: 0; border: none; background: transparent; } 
input.rdo-st1 + label.rdo-st1 { position: relative; padding-left: 25px; line-height: 18px; font-size: 15px; color: #555; cursor: pointer; } 
input.rdo-st1 + label.rdo-st1:before { content: ""; position: absolute; top: 1px; left: 0; width: 18px; height: 18px; background: #fff; border: 1px solid var(--gray-e5); border-radius: 100%; } 
input.rdo-st1:checked + label.rdo-st1 { font-weight: 600; } 
input.rdo-st1:checked + label.rdo-st1:before { content: ""; position: absolute; top: 1px; left: 0; width: 18px; height: 18px; background: #fff; border: 1px solid #156A8982; } 
input.rdo-st1:checked + label.rdo-st1:after { content: ""; position: absolute; top: 6px; left: 5px; width: 8px; height: 8px; background: var(--point-color); border-radius: 100%; } 

/******* 첨부파일 *******/
.file-box { padding: 30px; background: #f9f9f9; } 
.file-box .flex-wrap { display: flex; gap: 20px; align-items: center; flex-wrap: wrap;} 
.file-box .file-list li { display: flex; align-items: center; gap: 10px; margin-bottom: 0.5rem; } 
.file-box .file-list li span { display: flex; gap: 5px; color: #777; align-items: center; } 
.file-box .file-list li span::before { content:""; width: 18px; height: 18px; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 38.54 53.67'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23444; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M37.04,25.39l-10.33,19.63c-3.44,6.53-11.53,9.05-18.06,5.62h0c-6.54-3.44-9.06-11.52-5.61-18.07l.02-.04L16.91,6.19c2.24-4.28,7.54-5.93,11.82-3.68h0c4.28,2.25,5.92,7.56,3.67,11.83l-13.86,26.34-.03.05c-1.18,2.25-3.97,3.12-6.23,1.93h0c-2.26-1.19-3.12-3.98-1.93-6.23l12.28-23.34'/%3E%3C/svg%3E") no-repeat center / auto 14px; } 
.file-box .file-list li .delete-btn { } 
.file-box .file-list li .delete-btn .icn-close { display: block; width: 10px; height: 10px; background-size: auto 10px; font-size: 0; background-repeat: no-repeat; background-size: contain; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42.06 42.06' width='20px' height='20px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23666; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cg id='icon'%3E%3Cline class='cls-1' x1='3' y1='3' x2='39.06' y2='39.06'/%3E%3Cline class='cls-1' x1='39.06' y1='3' x2='3' y2='39.06'/%3E%3C/g%3E%3C/svg%3E"); } 

.file-box2 { } 
.file-box2 .file-list { } 
.file-box2 .file-list li { display: flex; justify-content: space-between; gap: 10px; padding: 12px; background: var(--gray-f9); } 
.file-box2 .file-list li .lf { flex-shrink: 0; display: flex; justify-content: space-between; align-items: center; gap: 10px; } 
.file-box2 .file-list li .lf .img-wrap { width: 30px; height: 30px; background: var(--gray-dd); } 
.file-box2 .file-list li .lf .txt strong { display: block; margin-bottom: 4px; font-weight: 600; font-size: 14px; color: #444; } 
.file-box2 .file-list li .lf .txt em { display: block; font-size: 11px; color: #888; } 
.file-box2 .file-list li .rg { display: flex; justify-content: end; align-items: center; gap: 15px; flex-grow: 1; } 
.file-box2 .file-list li .rg .progressbar { position: relative; width: 100%; max-width: 300px; height: 3px; background: var(--gray-cc); } 
.file-box2 .file-list li .rg .progressbar .active { position: absolute; top: 0; left: 0; width: 30%; height: 3px; background: var(--main-color); } 
.file-box2 .file-list li .rg .delete .icn-close { width: 16px; height: 16px; background-size: auto 10px; } 
.no-file {color: #666;}

.file-btn2 { } 
.file-btn2 input { } 
.file-btn2 label { display: inline-block; font-size: 12px; color: #555; white-space: nowrap; } 
.file-btn2 label::before { content:""; display: inline-block; margin-right: 2px; width: 16px; height: 16px; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 38.54 53.67'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23222; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M37.04,25.39l-10.33,19.63c-3.44,6.53-11.53,9.05-18.06,5.62h0c-6.54-3.44-9.06-11.52-5.61-18.07l.02-.04L16.91,6.19c2.24-4.28,7.54-5.93,11.82-3.68h0c4.28,2.25,5.92,7.56,3.67,11.83l-13.86,26.34-.03.05c-1.18,2.25-3.97,3.12-6.23,1.93h0c-2.26-1.19-3.12-3.98-1.93-6.23l12.28-23.34'/%3E%3C/svg%3E") no-repeat center / auto 14px; cursor: pointer; vertical-align: middle; } 



/********** list **********/
.list1 > li { position: relative; z-index: 1; line-height: normal; margin-bottom: 6px; padding-left: 10px; word-break: keep-all; } 
.list1 > li:last-child { margin-bottom: 0; } 
.list1 > li:after { content: ""; position: absolute; top: 7px; left: 0; width: 3px; height: 3px; background: var(--point-color); border-radius: 100%; opacity: 0.7;}
.list1 > li span { }
.list1 > li span{position: relative;}
.list1 > li span::after {content: ""; position: absolute; top: 5px; right: -12px; width: 1px; height: 10px; background: #ddd;}
.list1 > li span:last-child:after {display: none;}
.list2 > li { position: relative; line-height: 1.4; margin-bottom: 3px; padding-left: 8px; font-weight: 400; font-size: 15px; color: #666; } 
.list2 > li > strong { font-weight: 600; } 
.list2 > li:last-child { margin-bottom: 0; } 
.list2 > li:before { content: ""; position: absolute; top: 8px; left: 0; width: 3px; height: 3px; background: #999; border-radius: 100%; } 
.list3 > li { position: relative; line-height: 1.4; margin-bottom: 2px; padding-left: 12px; font-weight: 400; font-size: 14px; color: #555; } 
.list3 > li:last-child { margin-bottom: 0; } 
.list3 > li:before { content: ""; position: absolute; top: 10px; left: 0; width: 5px; height: 1px; background: #555; } 
.list4 > li { position: relative; line-height: 1.5; margin-bottom: 2px; padding-left: 18px; font-size: 1.5rem; color: #444; counter-increment: number-counter1; } 
.list4 > li:before { content: counter(number-counter1) "."; position: absolute; top: 0; left: 0; font-size: 1.4rem; color: #666; } 
.list5 > li { position: relative; line-height: 1.6; margin-bottom: 3px; padding-left: 12px; font-weight: 400; font-size: 16px; color: #666; } 
.list5 > li > strong { font-weight: 600; } 
.list5 > li:last-child { margin-bottom: 0; } 
.list5 > li:before { content: ""; position: absolute; top: 11px; left: 0; width: 3px; height: 3px; background: #666; border-radius: 100%; } 


/********** table **********/
.tableA { width: 100%; border-top: 2px solid var(--gray-44); border-collapse: collapse; } 
.tableA tr { border-bottom: 1px solid var(--gray-e5); } 
.tableA th { padding: 12px 15px; line-height: 1.4; font-weight: 600; font-size: 16px; color: #444; background: var(--gray-fa); border-right: 1px solid var(--gray-e5); text-align: center; } 
.tableA th:last-child { border-right: none; } 
.tableA td { padding: 12px 15px; line-height: 1.4; font-size: 16px; color: #555; text-align: center; word-break: keep-all; border-right: 1px solid var(--gray-e5); } 
.tableA td:last-child { border-right: none; } 
.tableA td.txt-lf { text-align: left; } 
.tableA .bg {background: #E8F1F4;}
.tableA tfoot td { font-weight: 600; background: var(--gray-fa); } 

.table-fixed-thead { border: none; border-collapse: separate; border-spacing: 0px; /* seui 수정*/ }
.table-fixed-thead thead { } 
.table-fixed-thead thead tr { } 
.table-fixed-thead thead tr th { position: sticky; top: 0; z-index: 1; border-top: 2px solid var(--gray-44); border-bottom: 1px solid var(--gray-e5); } 
.table-fixed-thead tbody tr td { border-bottom: 1px solid var(--gray-e5); } 

.tableA td.bd-diagonal { position: relative; background: linear-gradient(to top right, #fff calc(50% - 1px), var(--gray-e5) , #fff calc(50% + 1px) ) } 

.table-valign-t td { vertical-align: top; } 
@media only screen and (max-width: 1023px){
 .tableA th { padding: 10px; font-size: 14px; word-break: keep-all;} 
.tableA td { padding: 10px; font-size: 14px; } 
.tableA tfoot td { padding: 10px; font-size: 14px; } 
 }
@media only screen and (max-width: 767px){
 .table-responsive1 colgroup,
 .table-responsive1 thead { display: none; } 
 .table-responsive1 tbody tr { position: relative; display: block; min-height: auto; padding: 10px 10px 10px 45px; text-align: left; } 
 .table-responsive1 tbody tr td { padding: 0 10px 0 0; color: #555; } 
 .table-responsive1 tbody tr td::before { content: attr(data-content); display: inline-block; width: auto; margin-right: 5px; margin-bottom: 5px; font-weight: 500; font-size: 1.5rem; color: #333; text-align: left; } 
 .table-responsive1 tbody tr td[data-content="번호"] { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 40px; margin: -1px 0 0 0; padding-right: 0; text-align: center; } 
 .table-responsive1 tbody tr td[data-content="번호"]::before { display: none; } 
 .table-responsive1 tbody tr td[data-content="문의제목"] { padding: 0; text-align: left; } 
 }

.tableB { width: 100%; border-top: 2px solid var(--gray-44); border-collapse: collapse; } 
.tableB tr { border-bottom: 1px solid var(--gray-e5); } 
.tableB th { padding: 12px 15px; line-height: 1.4; font-weight: 600; font-size: 15px; color: #444; background: var(--gray-fa); border-right: 1px solid var(--gray-e5); text-align: center; } 
.tableB th:last-child { border-right: none; } 
.tableB td { padding: 12px 15px; line-height: 1.4; font-size: 15px; color: #555; text-align: center; word-break: keep-all; border-right: 1px solid var(--gray-e5); } 
.tableB td:last-child { border-right: none; } 
.tableB td.txt-lf { text-align: left; } 


@media only screen and (max-width: 1023px){
 .tableB th { padding: 10px; } 
.tableB td { padding: 10px; } 
 .table-scroll-wrap { position: relative; overflow-x: scroll; } 
.table-scroll-event { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; } 
.table-scroll-event .inner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.table-scroll-event .inner::before { content:""; display: block; position: absolute; top: -25px; left: 50%; transform: translateX(-50%); width: 30px; height: 30px; background-repeat: no-repeat; background-size: contain; background-position: center; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 61 64.28'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23000; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cpath class='cls-1' d='M26.24,52.94s-8.39-7.82-8.39-15.08v-8.7c0-2.32,1.88-4.2,4.2-4.2h0c2.32,0,4.2,1.88,4.2,4.2V6.25c0-2.45,2.11-4.42,4.61-4.18,2.18.21,3.79,2.17,3.79,4.36v12.24c0-2.45,2.11-4.42,4.61-4.18,2.18.21,3.79,2.17,3.79,4.36v3.74c0-2.32,1.88-4.2,4.2-4.2h0c2.32,0,4.2,1.88,4.2,4.2v3.12c0-2.59,2.35-4.64,5.04-4.11,1.99.39,3.35,2.26,3.35,4.3h0c0,5.83.45,10.07-.06,15.51-.12,1.25-.34,2.49-.67,3.7l-2.09,7.84h-30.76Z'/%3E%3Cline class='cls-1' x1='26.24' y1='29.16' x2='26.24' y2='35.78'/%3E%3Cline class='cls-1' x1='34.63' y1='18.67' x2='34.63' y2='29.16'/%3E%3Cline class='cls-1' x1='43.03' y1='20.59' x2='43.03' y2='29.16'/%3E%3Cline class='cls-1' x1='51.42' y1='25.71' x2='51.42' y2='29.16'/%3E%3Crect class='cls-1' x='26.24' y='52.94' width='30.76' height='10.34'/%3E%3C/g%3E%3Cline class='cls-1' x1='40.31' y1='7.05' x2='58.94' y2='7.05'/%3E%3Cpolyline class='cls-1' points='52.89 1 58.94 7.05 52.89 13.11'/%3E%3Cline class='cls-1' x1='19.63' y1='7.05' x2='1' y2='7.05'/%3E%3Cpolyline class='cls-1' points='7.05 1 1 7.05 7.05 13.11'/%3E%3C/svg%3E"); animation: leftRight 2.4s infinite linear; } 
@keyframes leftRight { 
 0% { transform: translateX(0px); } 
 50% { transform: translateX(-20px); } 
100% { transform: translateX(0px); } 
 }
.table-scroll-wrap table { width: 150%; } 
 }

@media only screen and (max-width: 600px){
 .tableA colgroup { display: none } 
/* .tableA td { min-width: 130px; }  */
 }

/********** btn **********/
/* 버튼 정렬 */
.btn-lf { display: flex; justify-content: flex-start; gap: 5px; } 
.btn-ce { display: flex; justify-content: center; gap: 5px; } 
.btn-rg { display: flex; justify-content: flex-end; gap: 5px; } 
@media only screen and (max-width: 560px){
 .btn-ce { flex-wrap: wrap; } 
.btn-ce > a, .btn-ce > button { flex: 1; min-width: fit-content; } 
 }


.btn-bace1 { display: inline-block; min-width: fit-content; height: 35px; line-height: 35px; padding: 0 15px; font-family: "Pretendard"; font-weight: 500; font-size: 15px; text-align: center; } 
.btn-bace2 { display: inline-block; min-width: 120px; height: 50px; line-height: 50px; padding: 0 30px; font-family: "Pretendard"; font-weight: 400; font-size: 16px; text-align: center; } 
.btn-bace3 { display: inline-block; min-width: fit-content; height: 40px; line-height: 40px; padding: 0 20px; font-family: "Pretendard"; font-weight: 500; font-size: 15px; text-align: center; overflow: hidden; } 
.btn-bace4 { display: inline-block; width: 100%; height: 50px; line-height: 50px; font-weight: 600; font-size: 1.7rem; text-align: center; } 
.btn-bace5 { display: block; padding: 9px 14px; line-height: normal; white-space: nowrap; font-weight: 600; } 
.btn-arr-st1 { display: inline-block; min-width: fit-content; padding: 0 15px; text-align: center; border: 1px solid var(--main-soft2); border-radius: 3px; white-space: nowrap; overflow: hidden; } 
.btn-arr-st1 span { display: inline-block; height: 30px; line-height: 30px; font-family: "Pretendard"; font-weight: 500; font-size: 14px; color: var(--main-color); } 
.btn-arr-st1 span::after { content: ""; display: inline-block; width: 7px; height: 11px; margin: -4px 0 0 6px; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7.5 13.5'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23052E86; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5px; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M.75,12.75l6-6L.75.75'/%3E%3C/svg%3E") no-repeat center center / contain; } 
.btn-arr-st2 { position: relative; display: inline-block; padding: 15px 50px 15px 25px; border: 1px solid var(--gray-e5); border-radius: 3px; white-space: nowrap; overflow: hidden; } 
.btn-arr-st2::after { content: ""; position: absolute; top: 50%; right: 25px; transform: translateY(-50%); display: inline-block; width: 12px; height: 12px; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44.24 44.24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23052e86; %7D .cls-1, .cls-2 %7B fill: none; stroke-linejoin: round; stroke-width: 4px; %7D .cls-2 %7B stroke: %236b6d72; %7D %3C/style%3E%3C/defs%3E%3Cpolyline class='cls-2' points='17.06 2 2 2 2 42.24 42.24 42.24 42.24 27.18'/%3E%3Cline class='cls-1' x1='17.06' y1='27.18' x2='42.24' y2='2'/%3E%3Cpolyline class='cls-1' points='42.24 16.67 42.24 2 27.57 2'/%3E%3C/svg%3E") no-repeat center center / contain; } 
.btn-arr-st2:hover { box-shadow: 0 0 0 1px inset var(--main-color); } 
.btn-sch-st1 { height: 40px; line-height: 40px; padding: 0 45px 0 20px; font-weight: 500; font-size: 16px; color: #fff; border-radius: 4px; background: var(--main-color) url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 72'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 8px; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M49.09,10.91c10.54,10.54,10.54,27.64,0,38.18-7.54,7.54-24.64,13.54-38.18,0C.36,38.55.36,21.45,10.91,10.91,21.45.36,38.55.36,49.09,10.91ZM69,69l-19.12-19.25'/%3E%3C/svg%3E") no-repeat right 15px center / auto 15px; } 
@media only screen and (max-width: 767px){
 .btn-bace3 { height: 42px; line-height: 42px; font-size: 14px; } 
 .btn-arr-st1 { padding: 0 10px; } 
.btn-arr-st1 span { font-size: 13px; } 
.btn-arr-st1 span::after { width: 5px; height: 8px; margin: -3px 0 0 5px; } 
.btn-sch-st1 { font-size: 15px; background: var(--main-color); } 
.btn-arr-st2 { padding: 10px 30px 10px 15px; } 
.btn-arr-st2::after { right: 15px; width: 9px; height: 9px; } 
 }


.underline { text-decoration: underline; } 

/********** 이미지 **********/
.img-wrap { display: block; overflow: hidden; } 
.img-wrap img { max-width: 100% !important; } 
.video-wrap video { max-width: 100%; } 
.video-wrap iframe { max-width: 100%; border: 0; } 


/********** 텍스트 ...처리 **********/
.txt-over1 { display: -webkit-box; display: -ms-flexbox; overflow: hidden; text-overflow: ellipsis; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp: 1; /*line-clamp: 1; seui 수정 */ } /* 1줄 */
.txt-over2 { display: -webkit-box; display: -ms-flexbox; overflow: hidden; text-overflow: ellipsis; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp: 2; /*line-clamp: 2; seui 수정 */ } /* 2줄 */
.txt-over3 { display: -webkit-box; display: -ms-flexbox; overflow: hidden; text-overflow: ellipsis; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp: 3; /*line-clamp: 3; seui 수정 */ } /* 3줄 */

/********** 오버플로우 스크롤 **********/
.ovf-x-scroll { overflow-x: scroll; } 
.ovf-y-scroll { overflow-y: scroll; } 


/********** 텍스트 정렬 **********/
.txt-lf { text-align: left; } 
.txt-ce { text-align: center; } 
.txt-rg { text-align: right !important; } 

/********** font-weight **********/
.fw-300 { font-weight: 300; } 
.fw-400 { font-weight: 400; } 
.fw-500 { font-weight: 500; } 
.fw-600 { font-weight: 600; } 
.fw-700 { font-weight: 700; } 

/********** font-size **********/
.fz-15 { font-size: 1.5rem; } 
.fz-14 { font-size: 1.4rem; } 
.fz-13 { font-size: 1.3rem; } 

/********** flex **********/
.flex { display: flex; } 
.flex-shrink { flex-shrink: 0; } 

/* 정렬 */
.flex-align-center { display: flex; align-items: center; } 
.flex-justify-between { display: flex; justify-content: space-between; } 
.flex-justify-between-center { display: flex; justify-content: space-between; align-items: center; } 

/* gap */
.gap5 { gap: 5px; } 
.gap10 { gap: 10px; } 
.gap15 { gap: 15px; } 
.gap20 { gap: 20px; } 
.gap25 { gap: 25px; } 
.gap30 { gap: 30px; } 

/********** width **********/
.wh100p { width: 100%; } 
.wh90p { width: 90%; } 
.wh80p { width: 80%; } 
.wh70p { width: 70%; } 
.wh60p { width: 60%; } 
.wh50p { width: 50%; } 
.wh40p { width: 40%; } 
.wh30p { width: 30%; } 
.wh20p { width: 20%; } 
.wh5p { width: 5%; } 

/********** margin **********/
.mg0 { margin:0; } 
/*** margin_top ***/
.mt0 { margin-top:0; } 
.mt3 { margin-top:3px; } 
.mt5 { margin-top:5px; } 
.mt10 { margin-top:10px; } 
.mt15 { margin-top:15px; } 
.mt20 { margin-top:20px; } 
.mt25 { margin-top:25px; } 
.mt30 { margin-top:30px; } 
.mt35 { margin-top:35px; } 
.mt40 { margin-top:40px; } 
.mt45 { margin-top:45px; } 
.mt50 { margin-top:50px; } 
.mt55 { margin-top:55px; } 
.mt60 { margin-top:60px; } 
.mt65 { margin-top:65px; } 
.mt70 { margin-top:70px; } 
.mt75 { margin-top:75px; } 
.mt80 { margin-top:80px; } 
.mt85 { margin-top:85px; } 
.mt90 { margin-top:90px; } 
.mt95 { margin-top:95px; } 
.mt100 { margin-top:100px; } 
.mt160 { margin-top:160px; } 
/*** margin_bottom ***/
.mb0 { margin-bottom:0; } 
.mb5 { margin-bottom:5px; } 
.mb10 { margin-bottom:10px; } 
.mb15 { margin-bottom:15px; } 
.mb20 { margin-bottom:20px; } 
.mb25 { margin-bottom:25px; } 
.mb30 { margin-bottom:30px; } 
.mb35 { margin-bottom:35px; } 
.mb40 { margin-bottom:40px; } 
.mb45 { margin-bottom:45px; } 
.mb50 { margin-bottom:50px; } 
.mb55 { margin-bottom:55px; } 
.mb60 { margin-bottom:60px; } 
.mb65 { margin-bottom:65px; } 
.mb70 { margin-bottom:70px; } 
.mb75 { margin-bottom:75px; } 
.mb80 { margin-bottom:80px; } 
.mb85 { margin-bottom:85px; } 
.mb90 { margin-bottom:90px; } 
.mb95 { margin-bottom:95px; } 
.mb100 { margin-bottom:100px; } 
/*** margin_left ***/
.ml0 { margin-left:0; } 
.ml5 { margin-left:5px; } 
.ml10 { margin-left:10px; } 
.ml15 { margin-left:15px; } 
.ml20 { margin-left:20px; } 
.ml25 { margin-left:25px; } 
.ml30 { margin-left:30px; } 
.ml35 { margin-left:35px; } 
.ml40 { margin-left:40px; } 
.ml45 { margin-left:45px; } 
.ml50 { margin-left:50px; } 
.ml55 { margin-left:55px; } 
.ml60 { margin-left:60px; } 
.ml65 { margin-left:65px; } 
.ml70 { margin-left:70px; } 
.ml75 { margin-left:75px; } 
.ml80 { margin-left:80px; } 
.ml85 { margin-left:85px; } 
.ml90 { margin-left:90px; } 
.ml95 { margin-left:95px; } 
.ml100 { margin-left:100px; } 
/*** margin_right ***/
.mr0 { margin-right:0; } 
.mr5 { margin-right:5px; } 
.mr10 { margin-right:10px; } 
.mr15 { margin-right:15px; } 
.mr20 { margin-right:20px; } 
.mr25 { margin-right:25px; } 
.mr30 { margin-right:30px; } 
.mr35 { margin-right:35px; } 
.mr40 { margin-right:40px; } 
.mr45 { margin-right:45px; } 
.mr50 { margin-right:50px; } 
.mr55 { margin-right:55px; } 
.mr60 { margin-right:60px; } 
.mr65 { margin-right:65px; } 
.mr70 { margin-right:70px; } 
.mr75 { margin-right:75px; } 
.mr80 { margin-right:80px; } 
.mr85 { margin-right:85px; } 
.mr90 { margin-right:90px; } 
.mr95 { margin-right:95px; } 
.mr100 { margin-right:100px; } 

@media only screen and (max-width: 560px){
 .mt60 { margin-top: 30px; } 
 }

/******************** padding ********************/
.pd0 { padding:0; } 
/*** padding_top ***/
.pt0 { padding-top:0; } 
.pt5 { padding-top:5px; } 
.pt10 { padding-top:10px; } 
.pt15 { padding-top:15px; } 
.pt20 { padding-top:20px; } 
.pt25 { padding-top:25px; } 
.pt30 { padding-top:30px; } 
.pt35 { padding-top:35px; } 
.pt40 { padding-top:40px; } 
.pt45 { padding-top:45px; } 
.pt50 { padding-top:50px; } 
.pt55 { padding-top:55px; } 
.pt60 { padding-top:60px; } 
.pt65 { padding-top:65px; } 
.pt70 { padding-top:70px; } 
.pt75 { padding-top:75px; } 
.pt80 { padding-top:80px; } 
.pt85 { padding-top:85px; } 
.pt90 { padding-top:90px; } 
.pt95 { padding-top:95px; } 
.pt100 { padding-top:100px; } 
/*** padding_bottom ***/
.pb0 { padding-bottom:0; } 
.pb5 { padding-bottom:5px; } 
.pb10 { padding-bottom:10px; } 
.pb15 { padding-bottom:15px; } 
.pb20 { padding-bottom:20px; } 
.pb25 { padding-bottom:25px; } 
.pb30 { padding-bottom:30px; } 
.pb35 { padding-bottom:35px; } 
.pb40 { padding-bottom:40px; } 
.pb45 { padding-bottom:45px; } 
.pb50 { padding-bottom:50px; } 
.pb55 { padding-bottom:55px; } 
.pb60 { padding-bottom:60px; } 
.pb65 { padding-bottom:65px; } 
.pb70 { padding-bottom:70px; } 
.pb75 { padding-bottom:75px; } 
.pb80 { padding-bottom:80px; } 
.pb85 { padding-bottom:85px; } 
.pb90 { padding-bottom:90px; } 
.pb95 { padding-bottom:95px; } 
.pb100 { padding-bottom:100px; } 
/*** padding_left ***/
.pl0 { padding-left:0; } 
.pl5 { padding-left:5px; } 
.pl10 { padding-left:10px; } 
.pl15 { padding-left:15px; } 
.pl17 { padding-left:17px; } 
.pl20 { padding-left:20px; } 
.pl25 { padding-left:25px; } 
.pl30 { padding-left:30px; } 
.pl35 { padding-left:35px; } 
.pl40 { padding-left:40px; } 
.pl45 { padding-left:45px; } 
.pl50 { padding-left:50px; } 
.pl55 { padding-left:55px; } 
.pl60 { padding-left:60px; } 
.pl65 { padding-left:65px; } 
.pl70 { padding-left:70px; } 
.pl75 { padding-left:75px; } 
.pl80 { padding-left:80px; } 
.pl85 { padding-left:85px; } 
.pl90 { padding-left:90px; } 
.pl95 { padding-left:95px; } 
.pl100 { padding-left:100px; } 
/*** padding_right ***/
.pr0 { padding-right:0; } 
.pr5 { padding-right:5px; } 
.pr10 { padding-right:10px; } 
.pr15 { padding-right:15px; } 
.pr17 { padding-right:17px; } 
.pr20 { padding-right:20px; } 
.pr25 { padding-right:25px; } 
.pr30 { padding-right:30px; } 
.pr35 { padding-right:35px; } 
.pr40 { padding-right:40px; } 
.pr45 { padding-right:45px; } 
.pr50 { padding-right:50px; } 
.pr55 { padding-right:55px; } 
.pr60 { padding-right:60px; } 
.pr65 { padding-right:65px; } 
.pr70 { padding-right:70px; } 
.pr75 { padding-right:75px; } 
.pr80 { padding-right:80px; } 
.pr85 { padding-right:85px; } 
.pr90 { padding-right:90px; } 
.pr95 { padding-right:95px; } 
.pr100 { padding-right:100px; } 
@media only screen and (max-width: 1023px){
	.pt80 { padding-top:70px; } 
}
@media only screen and (max-width: 767px) {
	.pt80 { padding-top:50px; } 
}