@charset "UTF-8";
/* 웹폰트 */
@font-face {
font-family: "NotoSansKR";
font-style: normal;
font-weight: 400;
src: url("../../_common/fonts/NotoSansCJKkr-Regular.eot");
src: url("../../_common/fonts/NotoSansCJKkr-Regular.eot?#iefix") format("embedded-opentype"), url("../../_common/fonts/NotoSansCJKkr-Regular.otf") format("opentype"), url("../../_common/fonts/NotoSansCJKkr-Regular.woff") format("woff");
}
@font-face {
font-family: "NotoSansKR";
font-style: normal;
font-weight: 500;
src: url("../../_common/fonts/NotoSansCJKkr-Medium.eot");
src: url("../../_common/fonts/NotoSansCJKkr-Medium.eot?#iefix") format("embedded-opentype"), url("../../_common/fonts/NotoSansCJKkr-Medium.otf") format("opentype"), url("../../_common/fonts/NotoSansCJKkr-Medium.woff") format("woff");
}
@font-face {
font-family: "NotoSansKR";
font-style: normal;
font-weight: 700;
src: url("../../_common/fonts/NotoSansCJKkr-Bold.eot");
src: url("../../_common/fonts/NotoSansCJKkr-Bold.eot?#iefix") format("embedded-opentype"), url("../../_common/fonts/NotoSansCJKkr-Bold.otf") format("opentype"), url("../../_common/fonts/NotoSansCJKkr-Bold.woff") format("woff");
}
@font-face {
font-family: "s-core-dream";
font-style: normal;
font-weight: 300;
src: url("../../_common/fonts/s-core-dream-light.woff2") format("woff2"), url("../../_common/fonts/s-core-dream-light.woff") format("woff");
}
@font-face {
font-family: "s-core-dream";
font-style: normal;
font-weight: 400;
src: url("../../_common/fonts/s-core-dream-regular.woff2") format("woff2"), url("../../_common/fonts/s-core-dream-regular.woff") format("woff");
}
@font-face {
font-family: "s-core-dream";
font-style: normal;
font-weight: 500;
src: url("../../_common/fonts/s-core-dream-medium.woff2") format("woff2"), url("../../_common/fonts/s-core-dream-medium.woff") format("woff");
}
@font-face {
font-family: "s-core-dream";
font-style: normal;
font-weight: 600;
src: url("../../_common/fonts/s-core-dream-bold.woff2") format("woff2"), url("../../_common/fonts/s-core-dream-bold.woff") format("woff");
}
/* default */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html {
height: 100%;
}
@media (max-width: 1024.98px) {
html {
-webkit-text-size-adjust: none;
overflow-y: auto;
}
}
body {
min-width: 360px;
color: #333;
font-size: 15px;
font-family: "Noto Sans KR", "Noto Sans CJK KR", "NotoSansKR", "malgun gothic", Arial, sans-serif;
letter-spacing: 0;
line-height: 1.4;
word-wrap: break-word;
}
@media (min-width: 1025px) {
body {
transform-origin: 50% 0%;
word-break: keep-all;
overflow-y: scroll;
}
}
@media (max-width: 1024.98px) {
body {
word-break: break-all;
}
}
header,
section,
article,
aside,
footer,
nav {
display: block;
}
fieldset {
display: block;
margin: 0;
border: 0;
padding: 0;
}
pre {
white-space: pre-wrap;
}
img {
max-width: 100%;
border: 0;
}
ul,
li,
ol {
list-style: none;
}
h1,
h2,
h3,
h4,
h5,
h6,
dd {
margin: 0;
}
a,
select,
button,
input,
textarea {
font-family: inherit;
}
a {
color: inherit;
text-decoration: none;
}
button,
input[type=submit] {
margin: 0;
padding: 0;
border: 0;
color: inherit;
cursor: pointer;
background: transparent;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
.sr-only {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;
margin: 0 !important;
font-size: 0;
line-height: 0;
overflow: hidden;
}
caption.sr-only {
position: static;
width: auto;
height: 0;
}
/* 간격 */
/* 주요 마진셋 */
.mt-lg {
margin-top: 55px !important;
}
.mb-lg {
margin-bottom: 55px !important;
}
.mt-md {
margin-top: 30px !important;
}
.mb-md {
margin-bottom: 30px !important;
}
.ml-md {
margin-left: 30px !important;
}
.mr-md {
margin-right: 30px !important;
}
.mt-sm {
margin-top: 10px !important;
}
.mb-sm {
margin-bottom: 10px !important;
}
.ml-sm {
margin-left: 10px !important;
}
.mr-sm {
margin-right: 10px !important;
}
/* 간격 Preset */
.m-0 {
margin: 0px !important;
}
.m-1 {
margin: 5px !important;
}
.m-2 {
margin: 10px !important;
}
.m-3 {
margin: 15px !important;
}
.m-4 {
margin: 20px !important;
}
.m-5 {
margin: 25px !important;
}
.m-6 {
margin: 30px !important;
}
.m-7 {
margin: 35px !important;
}
.m-8 {
margin: 40px !important;
}
.m-9 {
margin: 45px !important;
}
.m-10 {
margin: 50px !important;
}
.p-0 {
padding: 0px !important;
}
.p-1 {
padding: 5px !important;
}
.p-2 {
padding: 10px !important;
}
.p-3 {
padding: 15px !important;
}
.p-4 {
padding: 20px !important;
}
.p-5 {
padding: 25px !important;
}
.p-6 {
padding: 30px !important;
}
.p-7 {
padding: 35px !important;
}
.p-8 {
padding: 40px !important;
}
.p-9 {
padding: 45px !important;
}
.p-10 {
padding: 50px !important;
}
.mt-0 {
margin-top: 0px !important;
}
.mt-1 {
margin-top: 5px !important;
}
.mt-2 {
margin-top: 10px !important;
}
.mt-3 {
margin-top: 15px !important;
}
.mt-4 {
margin-top: 20px !important;
}
.mt-5 {
margin-top: 25px !important;
}
.mt-6 {
margin-top: 30px !important;
}
.mt-7 {
margin-top: 35px !important;
}
.mt-8 {
margin-top: 40px !important;
}
.mt-9 {
margin-top: 45px !important;
}
.mt-10 {
margin-top: 50px !important;
}
.ml-0 {
margin-left: 0px !important;
}
.ml-1 {
margin-left: 5px !important;
}
.ml-2 {
margin-left: 10px !important;
}
.ml-3 {
margin-left: 15px !important;
}
.ml-4 {
margin-left: 20px !important;
}
.ml-5 {
margin-left: 25px !important;
}
.ml-6 {
margin-left: 30px !important;
}
.ml-7 {
margin-left: 35px !important;
}
.ml-8 {
margin-left: 40px !important;
}
.ml-9 {
margin-left: 45px !important;
}
.ml-10 {
margin-left: 50px !important;
}
.mr-0 {
margin-right: 0px !important;
}
.mr-1 {
margin-right: 5px !important;
}
.mr-2 {
margin-right: 10px !important;
}
.mr-3 {
margin-right: 15px !important;
}
.mr-4 {
margin-right: 20px !important;
}
.mr-5 {
margin-right: 25px !important;
}
.mr-6 {
margin-right: 30px !important;
}
.mr-7 {
margin-right: 35px !important;
}
.mr-8 {
margin-right: 40px !important;
}
.mr-9 {
margin-right: 45px !important;
}
.mr-10 {
margin-right: 50px !important;
}
.mb-0 {
margin-bottom: 0px !important;
}
.mb-1 {
margin-bottom: 5px !important;
}
.mb-2 {
margin-bottom: 10px !important;
}
.mb-3 {
margin-bottom: 15px !important;
}
.mb-4 {
margin-bottom: 20px !important;
}
.mb-5 {
margin-bottom: 25px !important;
}
.mb-6 {
margin-bottom: 30px !important;
}
.mb-7 {
margin-bottom: 35px !important;
}
.mb-8 {
margin-bottom: 40px !important;
}
.mb-9 {
margin-bottom: 45px !important;
}
.mb-10 {
margin-bottom: 50px !important;
}
.pt-0 {
padding-top: 0px !important;
}
.pt-1 {
padding-top: 5px !important;
}
.pt-2 {
padding-top: 10px !important;
}
.pt-3 {
padding-top: 15px !important;
}
.pt-4 {
padding-top: 20px !important;
}
.pt-5 {
padding-top: 25px !important;
}
.pt-6 {
padding-top: 30px !important;
}
.pt-7 {
padding-top: 35px !important;
}
.pt-8 {
padding-top: 40px !important;
}
.pt-9 {
padding-top: 45px !important;
}
.pt-10 {
padding-top: 50px !important;
}
.pl-0 {
padding-left: 0px !important;
}
.pl-1 {
padding-left: 5px !important;
}
.pl-2 {
padding-left: 10px !important;
}
.pl-3 {
padding-left: 15px !important;
}
.pl-4 {
padding-left: 20px !important;
}
.pl-5 {
padding-left: 25px !important;
}
.pl-6 {
padding-left: 30px !important;
}
.pl-7 {
padding-left: 35px !important;
}
.pl-8 {
padding-left: 40px !important;
}
.pl-9 {
padding-left: 45px !important;
}
.pl-10 {
padding-left: 50px !important;
}
.pr-0 {
padding-right: 0px !important;
}
.pr-1 {
padding-right: 5px !important;
}
.pr-2 {
padding-right: 10px !important;
}
.pr-3 {
padding-right: 15px !important;
}
.pr-4 {
padding-right: 20px !important;
}
.pr-5 {
padding-right: 25px !important;
}
.pr-6 {
padding-right: 30px !important;
}
.pr-7 {
padding-right: 35px !important;
}
.pr-8 {
padding-right: 40px !important;
}
.pr-9 {
padding-right: 45px !important;
}
.pr-10 {
padding-right: 50px !important;
}
.pb-0 {
padding-bottom: 0px !important;
}
.pb-1 {
padding-bottom: 5px !important;
}
.pb-2 {
padding-bottom: 10px !important;
}
.pb-3 {
padding-bottom: 15px !important;
}
.pb-4 {
padding-bottom: 20px !important;
}
.pb-5 {
padding-bottom: 25px !important;
}
.pb-6 {
padding-bottom: 30px !important;
}
.pb-7 {
padding-bottom: 35px !important;
}
.pb-8 {
padding-bottom: 40px !important;
}
.pb-9 {
padding-bottom: 45px !important;
}
.pb-10 {
padding-bottom: 50px !important;
}
@media (min-width: 1025px) {
.m-lg-0 {
margin: 0px !important;
}
.m-lg-1 {
margin: 5px !important;
}
.m-lg-2 {
margin: 10px !important;
}
.m-lg-3 {
margin: 15px !important;
}
.m-lg-4 {
margin: 20px !important;
}
.m-lg-5 {
margin: 25px !important;
}
.m-lg-6 {
margin: 30px !important;
}
.m-lg-7 {
margin: 35px !important;
}
.m-lg-8 {
margin: 40px !important;
}
.m-lg-9 {
margin: 45px !important;
}
.m-lg-10 {
margin: 50px !important;
}
.p-lg-0 {
padding: 0px !important;
}
.p-lg-1 {
padding: 5px !important;
}
.p-lg-2 {
padding: 10px !important;
}
.p-lg-3 {
padding: 15px !important;
}
.p-lg-4 {
padding: 20px !important;
}
.p-lg-5 {
padding: 25px !important;
}
.p-lg-6 {
padding: 30px !important;
}
.p-lg-7 {
padding: 35px !important;
}
.p-lg-8 {
padding: 40px !important;
}
.p-lg-9 {
padding: 45px !important;
}
.p-lg-10 {
padding: 50px !important;
}
.mt-lg-0 {
margin-top: 0px !important;
}
.mt-lg-1 {
margin-top: 5px !important;
}
.mt-lg-2 {
margin-top: 10px !important;
}
.mt-lg-3 {
margin-top: 15px !important;
}
.mt-lg-4 {
margin-top: 20px !important;
}
.mt-lg-5 {
margin-top: 25px !important;
}
.mt-lg-6 {
margin-top: 30px !important;
}
.mt-lg-7 {
margin-top: 35px !important;
}
.mt-lg-8 {
margin-top: 40px !important;
}
.mt-lg-9 {
margin-top: 45px !important;
}
.mt-lg-10 {
margin-top: 50px !important;
}
.ml-lg-0 {
margin-left: 0px !important;
}
.ml-lg-1 {
margin-left: 5px !important;
}
.ml-lg-2 {
margin-left: 10px !important;
}
.ml-lg-3 {
margin-left: 15px !important;
}
.ml-lg-4 {
margin-left: 20px !important;
}
.ml-lg-5 {
margin-left: 25px !important;
}
.ml-lg-6 {
margin-left: 30px !important;
}
.ml-lg-7 {
margin-left: 35px !important;
}
.ml-lg-8 {
margin-left: 40px !important;
}
.ml-lg-9 {
margin-left: 45px !important;
}
.ml-lg-10 {
margin-left: 50px !important;
}
.mr-lg-0 {
margin-right: 0px !important;
}
.mr-lg-1 {
margin-right: 5px !important;
}
.mr-lg-2 {
margin-right: 10px !important;
}
.mr-lg-3 {
margin-right: 15px !important;
}
.mr-lg-4 {
margin-right: 20px !important;
}
.mr-lg-5 {
margin-right: 25px !important;
}
.mr-lg-6 {
margin-right: 30px !important;
}
.mr-lg-7 {
margin-right: 35px !important;
}
.mr-lg-8 {
margin-right: 40px !important;
}
.mr-lg-9 {
margin-right: 45px !important;
}
.mr-lg-10 {
margin-right: 50px !important;
}
.mb-lg-0 {
margin-bottom: 0px !important;
}
.mb-lg-1 {
margin-bottom: 5px !important;
}
.mb-lg-2 {
margin-bottom: 10px !important;
}
.mb-lg-3 {
margin-bottom: 15px !important;
}
.mb-lg-4 {
margin-bottom: 20px !important;
}
.mb-lg-5 {
margin-bottom: 25px !important;
}
.mb-lg-6 {
margin-bottom: 30px !important;
}
.mb-lg-7 {
margin-bottom: 35px !important;
}
.mb-lg-8 {
margin-bottom: 40px !important;
}
.mb-lg-9 {
margin-bottom: 45px !important;
}
.mb-lg-10 {
margin-bottom: 50px !important;
}
.pt-lg-0 {
padding-top: 0px !important;
}
.pt-lg-1 {
padding-top: 5px !important;
}
.pt-lg-2 {
padding-top: 10px !important;
}
.pt-lg-3 {
padding-top: 15px !important;
}
.pt-lg-4 {
padding-top: 20px !important;
}
.pt-lg-5 {
padding-top: 25px !important;
}
.pt-lg-6 {
padding-top: 30px !important;
}
.pt-lg-7 {
padding-top: 35px !important;
}
.pt-lg-8 {
padding-top: 40px !important;
}
.pt-lg-9 {
padding-top: 45px !important;
}
.pt-lg-10 {
padding-top: 50px !important;
}
.pl-lg-0 {
padding-left: 0px !important;
}
.pl-lg-1 {
padding-left: 5px !important;
}
.pl-lg-2 {
padding-left: 10px !important;
}
.pl-lg-3 {
padding-left: 15px !important;
}
.pl-lg-4 {
padding-left: 20px !important;
}
.pl-lg-5 {
padding-left: 25px !important;
}
.pl-lg-6 {
padding-left: 30px !important;
}
.pl-lg-7 {
padding-left: 35px !important;
}
.pl-lg-8 {
padding-left: 40px !important;
}
.pl-lg-9 {
padding-left: 45px !important;
}
.pl-lg-10 {
padding-left: 50px !important;
}
.pr-lg-0 {
padding-right: 0px !important;
}
.pr-lg-1 {
padding-right: 5px !important;
}
.pr-lg-2 {
padding-right: 10px !important;
}
.pr-lg-3 {
padding-right: 15px !important;
}
.pr-lg-4 {
padding-right: 20px !important;
}
.pr-lg-5 {
padding-right: 25px !important;
}
.pr-lg-6 {
padding-right: 30px !important;
}
.pr-lg-7 {
padding-right: 35px !important;
}
.pr-lg-8 {
padding-right: 40px !important;
}
.pr-lg-9 {
padding-right: 45px !important;
}
.pr-lg-10 {
padding-right: 50px !important;
}
.pb-lg-0 {
padding-bottom: 0px !important;
}
.pb-lg-1 {
padding-bottom: 5px !important;
}
.pb-lg-2 {
padding-bottom: 10px !important;
}
.pb-lg-3 {
padding-bottom: 15px !important;
}
.pb-lg-4 {
padding-bottom: 20px !important;
}
.pb-lg-5 {
padding-bottom: 25px !important;
}
.pb-lg-6 {
padding-bottom: 30px !important;
}
.pb-lg-7 {
padding-bottom: 35px !important;
}
.pb-lg-8 {
padding-bottom: 40px !important;
}
.pb-lg-9 {
padding-bottom: 45px !important;
}
.pb-lg-10 {
padding-bottom: 50px !important;
}
}
@media (max-width: 1024.98px) {
.m-md-0 {
margin: 0px !important;
}
.m-md-1 {
margin: 5px !important;
}
.m-md-2 {
margin: 10px !important;
}
.m-md-3 {
margin: 15px !important;
}
.m-md-4 {
margin: 20px !important;
}
.m-md-5 {
margin: 25px !important;
}
.m-md-6 {
margin: 30px !important;
}
.m-md-7 {
margin: 35px !important;
}
.m-md-8 {
margin: 40px !important;
}
.m-md-9 {
margin: 45px !important;
}
.m-md-10 {
margin: 50px !important;
}
.p-md-0 {
padding: 0px !important;
}
.p-md-1 {
padding: 5px !important;
}
.p-md-2 {
padding: 10px !important;
}
.p-md-3 {
padding: 15px !important;
}
.p-md-4 {
padding: 20px !important;
}
.p-md-5 {
padding: 25px !important;
}
.p-md-6 {
padding: 30px !important;
}
.p-md-7 {
padding: 35px !important;
}
.p-md-8 {
padding: 40px !important;
}
.p-md-9 {
padding: 45px !important;
}
.p-md-10 {
padding: 50px !important;
}
.mt-md-0 {
margin-top: 0px !important;
}
.mt-md-1 {
margin-top: 5px !important;
}
.mt-md-2 {
margin-top: 10px !important;
}
.mt-md-3 {
margin-top: 15px !important;
}
.mt-md-4 {
margin-top: 20px !important;
}
.mt-md-5 {
margin-top: 25px !important;
}
.mt-md-6 {
margin-top: 30px !important;
}
.mt-md-7 {
margin-top: 35px !important;
}
.mt-md-8 {
margin-top: 40px !important;
}
.mt-md-9 {
margin-top: 45px !important;
}
.mt-md-10 {
margin-top: 50px !important;
}
.ml-md-0 {
margin-left: 0px !important;
}
.ml-md-1 {
margin-left: 5px !important;
}
.ml-md-2 {
margin-left: 10px !important;
}
.ml-md-3 {
margin-left: 15px !important;
}
.ml-md-4 {
margin-left: 20px !important;
}
.ml-md-5 {
margin-left: 25px !important;
}
.ml-md-6 {
margin-left: 30px !important;
}
.ml-md-7 {
margin-left: 35px !important;
}
.ml-md-8 {
margin-left: 40px !important;
}
.ml-md-9 {
margin-left: 45px !important;
}
.ml-md-10 {
margin-left: 50px !important;
}
.mr-md-0 {
margin-right: 0px !important;
}
.mr-md-1 {
margin-right: 5px !important;
}
.mr-md-2 {
margin-right: 10px !important;
}
.mr-md-3 {
margin-right: 15px !important;
}
.mr-md-4 {
margin-right: 20px !important;
}
.mr-md-5 {
margin-right: 25px !important;
}
.mr-md-6 {
margin-right: 30px !important;
}
.mr-md-7 {
margin-right: 35px !important;
}
.mr-md-8 {
margin-right: 40px !important;
}
.mr-md-9 {
margin-right: 45px !important;
}
.mr-md-10 {
margin-right: 50px !important;
}
.mb-md-0 {
margin-bottom: 0px !important;
}
.mb-md-1 {
margin-bottom: 5px !important;
}
.mb-md-2 {
margin-bottom: 10px !important;
}
.mb-md-3 {
margin-bottom: 15px !important;
}
.mb-md-4 {
margin-bottom: 20px !important;
}
.mb-md-5 {
margin-bottom: 25px !important;
}
.mb-md-6 {
margin-bottom: 30px !important;
}
.mb-md-7 {
margin-bottom: 35px !important;
}
.mb-md-8 {
margin-bottom: 40px !important;
}
.mb-md-9 {
margin-bottom: 45px !important;
}
.mb-md-10 {
margin-bottom: 50px !important;
}
.pt-md-0 {
padding-top: 0px !important;
}
.pt-md-1 {
padding-top: 5px !important;
}
.pt-md-2 {
padding-top: 10px !important;
}
.pt-md-3 {
padding-top: 15px !important;
}
.pt-md-4 {
padding-top: 20px !important;
}
.pt-md-5 {
padding-top: 25px !important;
}
.pt-md-6 {
padding-top: 30px !important;
}
.pt-md-7 {
padding-top: 35px !important;
}
.pt-md-8 {
padding-top: 40px !important;
}
.pt-md-9 {
padding-top: 45px !important;
}
.pt-md-10 {
padding-top: 50px !important;
}
.pl-md-0 {
padding-left: 0px !important;
}
.pl-md-1 {
padding-left: 5px !important;
}
.pl-md-2 {
padding-left: 10px !important;
}
.pl-md-3 {
padding-left: 15px !important;
}
.pl-md-4 {
padding-left: 20px !important;
}
.pl-md-5 {
padding-left: 25px !important;
}
.pl-md-6 {
padding-left: 30px !important;
}
.pl-md-7 {
padding-left: 35px !important;
}
.pl-md-8 {
padding-left: 40px !important;
}
.pl-md-9 {
padding-left: 45px !important;
}
.pl-md-10 {
padding-left: 50px !important;
}
.pr-md-0 {
padding-right: 0px !important;
}
.pr-md-1 {
padding-right: 5px !important;
}
.pr-md-2 {
padding-right: 10px !important;
}
.pr-md-3 {
padding-right: 15px !important;
}
.pr-md-4 {
padding-right: 20px !important;
}
.pr-md-5 {
padding-right: 25px !important;
}
.pr-md-6 {
padding-right: 30px !important;
}
.pr-md-7 {
padding-right: 35px !important;
}
.pr-md-8 {
padding-right: 40px !important;
}
.pr-md-9 {
padding-right: 45px !important;
}
.pr-md-10 {
padding-right: 50px !important;
}
.pb-md-0 {
padding-bottom: 0px !important;
}
.pb-md-1 {
padding-bottom: 5px !important;
}
.pb-md-2 {
padding-bottom: 10px !important;
}
.pb-md-3 {
padding-bottom: 15px !important;
}
.pb-md-4 {
padding-bottom: 20px !important;
}
.pb-md-5 {
padding-bottom: 25px !important;
}
.pb-md-6 {
padding-bottom: 30px !important;
}
.pb-md-7 {
padding-bottom: 35px !important;
}
.pb-md-8 {
padding-bottom: 40px !important;
}
.pb-md-9 {
padding-bottom: 45px !important;
}
.pb-md-10 {
padding-bottom: 50px !important;
}
}
/* 불릿시스템 간격 */
.title1 {
margin-bottom: 23px;
}
.title1 + .title2 {
margin-top: 23px;
}
@media (min-width: 1025px) {
.title1 + .indent {
margin-left: 10px;
}
.title1 + .indent .indent-none {
margin-left: -10px;
}
.title1 + .indent .list1 .indent-none {
margin-left: -20px;
}
.title1 + .indent .list2 .indent-none {
margin-left: -29px;
}
}
.title2 {
margin: 34px 0 14px;
}
@media (min-width: 1025px) {
.title2 {
margin-left: 10px;
}
.title2 + .indent {
margin-left: 20px;
}
.title2 + .indent .indent-none {
margin-left: -20px;
}
.title2 + .indent .list1 .indent-none {
margin-left: -30px;
}
.title2 + .indent .list2 .indent-none {
margin-left: -39px;
}
}
.indent-none {
margin-top: 10px;
margin-bottom: 10px;
}
@media (max-width: 1024.98px) {
.indent .list .indent-none {
margin-left: -10px;
}
.indent .list .list .indent-none {
margin-left: -20px;
}
}
.list1 .list2 {
margin-top: 5px;
}
.list1 .list3 {
margin-top: 5px;
}
/* 탭메뉴 하단 간격 */
@media (min-width: 1025px) {
.tab-menu1 {
margin-bottom: 50px;
}
}
@media (max-width: 1024.98px) {
.tab-menu1 {
margin-bottom: 40px;
}
}
@media (min-width: 1025px) {
.tab-menu2 {
margin-bottom: 40px;
}
}
@media (max-width: 1024.98px) {
.tab-menu2 {
margin-bottom: 30px;
}
}
@media (min-width: 1025px) {
.tab-menu-box {
margin-bottom: 0;
}
}
@media (max-width: 1024.98px) {
.tab-menu-box {
margin-bottom: 0;
}
}
/* 체크박스 간격 */
.ckeck-item,
.ckeck-item-custom {
vertical-align: middle;
line-height: 20px;
}
.ckeck-item + .ckeck-item,
.ckeck-item + .ckeck-item-custom,
.ckeck-item-custom + .ckeck-item,
.ckeck-item-custom + .ckeck-item-custom {
margin-left: 26px;
}
@media (max-width: 1024.98px) {
.ckeck-item + .ckeck-item,
.ckeck-item + .ckeck-item-custom,
.ckeck-item-custom + .ckeck-item,
.ckeck-item-custom + .ckeck-item-custom {
margin-left: 11px;
}
}
.clearfix {
position: relative;
}
.clearfix:after {
display: block;
clear: both;
content: "";
}
.float-left {
float: left !important;
}
.float-right {
float: right !important;
}
.float-none {
float: none !important;
}
.text-left {
text-align: left !important;
}
.text-right {
text-align: right !important;
}
.text-center {
text-align: center !important;
}
@media (min-width: 1025px) {
.text-lg-left {
text-align: left !important;
}
.text-lg-right {
text-align: right !important;
}
.text-lg-center {
text-align: center !important;
}
}
@media (max-width: 1024.98px) {
.text-md-left {
text-align: left !important;
}
.text-md-right {
text-align: right !important;
}
.text-md-center {
text-align: center !important;
}
}
@media (max-width: 767.98px) {
.text-sm-left {
text-align: left !important;
}
.text-sm-right {
text-align: right !important;
}
.text-sm-center {
text-align: center !important;
}
}
.vertical-top {
vertical-align: top !important;
}
.vertical-middle {
vertical-align: middle !important;
}
.vertical-bottom {
vertical-align: bottom !important;
}
.vertical-sub {
vertical-align: sub !important;
}
.flex-container {
display: flex;
}
.flex-container .flex-item {
flex: 1 1 50%;
}
.flex-container .flex-item-fit {
flex: 0 0 auto;
}
.flex-justify-between {
justify-content: space-between;
}
.flex-justify-center {
justify-content: center;
}
.flex-align-stretch {
align-items: stretch;
}
.flex-align-center {
align-items: center;
}
@media (max-width: 1024.98px) {
.d-up-lg {
display: none !important;
}
}
@media (max-width: 767.98px) {
.d-up-md {
display: none !important;
}
}
@media (min-width: 1025px) {
.d-down-md {
display: none !important;
}
}
@media (min-width: 768px) {
.d-down-sm {
display: none !important;
}
}
.text-default {
color: #333 !important;
}
.text-white {
color: #fff !important;
}
.text-primary {
color: #1f76eb !important;
}
.text-darkprimary {
color: #2768bf !important;
}
.text-secondary {
color: #f26b19 !important;
}
.text-invalid {
color: #e13224 !important;
}
.text-valid {
color: #1C8EBF !important;
}
.text-red {
color: #e13224 !important;
}
.text-gray {
color: #666 !important;
}
.text-lightgray {
color: #999 !important;
}
.text-darkgray {
color: #666 !important;
}
.bg-default {
background-color: #333 !important;
color: #fff;
}
.bg-primary {
background-color: #428cf0 !important;
color: #fff;
}
.bg-darkprimary {
background-color: #004a85 !important;
color: #fff;
}
.bg-darkgray {
background-color: #7c7c7c !important;
color: #fff;
}
.bg-secondary {
background-color: #f26b19 !important;
color: #fff;
}
.bg-invalid {
background-color: #e13224 !important;
color: #fff;
}
.bg-valid {
background-color: #1C8EBF !important;
color: #fff;
}
.bg-lightgray {
background-color: #f9f9f9 !important;
}
.bg-gray {
background-color: #f3f3f3 !important;
}
.bg-lightprimary {
background-color: #dfedff !important;
}
.bg-grayblue {
background-color: #e5ecf6 !important;
}
.bg-whiteblue {
background-color: #f3f8ff !important;
}
.bg-white {
background-color: #fff !important;
}
.text-sm {
font-size: 14px !important;
}
.text-md {
font-size: 15px !important;
}
.text-lg {
font-size: 16px !important;
}
.text-xl {
font-family: "s-core-dream", "malgun gothic", Arial, sans-serif;
font-size: 18px !important;
font-weight: 500;
}
.text-xxl {
font-family: "s-core-dream", "malgun gothic", Arial, sans-serif;
font-size: 24px !important;
font-weight: bold;
}
.text-normal {
font-weight: normal !important;
}
.text-medium {
font-weight: 500 !important;
}
.text-bold {
font-weight: bold !important;
}
.link {
text-decoration: underline;
}
.link:focus, .link:hover {
color: #1f76eb;
}
.text-unit {
color: #666;
text-align: right;
margin-bottom: 5px;
font-size: 14px;
}
mark {
background-color: transparent;
box-shadow: inset 0px -10px #b7f5f3;
color: #333;
}
.container {
max-width: 1200px;
margin: auto;
}
.container:after {
display: block;
clear: both;
content: "";
}
@media (max-width: 1024.98px) {
.container {
width: auto;
}
}
@media (max-width: 1024.98px) {
.container {
padding: 0 15px;
}
}
.container-md {
max-width: 1200px;
margin: auto;
max-width: 780px;
}
.container-md:after {
display: block;
clear: both;
content: "";
}
@media (max-width: 1024.98px) {
.container-md {
width: auto;
}
}
/* Slider */
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
overflow: hidden;
display: block;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: -webkit-grab;
cursor: grab;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
left: 0;
top: 0;
display: block;
margin-left: auto;
margin-right: auto;
/*211110 추가 */
}
.slick-track:before, .slick-track:after {
content: "";
display: table;
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-track.slider-off {
transform: none !important;
display: flex;
justify-content: center;
}
.slick-track.slider-off .slick-slide {
width: 198px !important;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
display: none;
}
[dir=rtl] .slick-slide {
float: right;
}
.slick-slide img {
display: block;
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
cursor: default;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
.default-image-slider:not(.slick-slider) {
display: flex;
margin: -10px;
overflow: hidden;
}
.default-image-slider:not(.slick-slider) .item {
flex: 0 0 auto;
width: calc(33.33333% - 20px);
margin: 10px;
}
.default-image-slider .slick-list {
margin: 0 -10px;
}
.default-image-slider .slick-slide {
margin: 0 10px;
}
.default-image-slider .slick-arrow {
position: absolute;
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
vertical-align: middle;
overflow: hidden;
text-indent: -9999px;
overflow: hidden;
text-align: left;
z-index: 10;
top: 50%;
width: 50px;
height: 50px;
margin: -57px -25px 0;
box-shadow: 0 5px 9px rgba(0, 0, 0, 0.17);
transition-duration: 0.2s;
background-color: #949494;
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: auto 18px;
border-radius: 50%;
}
.default-image-slider .slick-arrow:hover, .default-image-slider .slick-arrow:focus {
background-color: #2768bf;
}
.default-image-slider .slick-prev {
left: 0;
background-image: url(../../_common/images/ico-chevron-left-sm-white.png);
}
.default-image-slider .slick-next {
right: 0;
background-image: url(../../_common/images/ico-chevron-right-sm-white.png);
}
.default-image-slider .slick-dots {
margin-top: 23px;
display: flex !important;
align-content: center;
justify-content: center;
}
.default-image-slider .slick-dots .slick-active button:before {
border-color: #1f76eb;
background-color: #1f76eb;
}
.default-image-slider .slick-dots button {
position: relative;
display: block;
text-indent: -9999px;
width: 20px;
height: 20px;
margin-top: -3px;
margin-bottom: -3px;
}
.default-image-slider .slick-dots button:before {
content: "";
display: block;
position: absolute;
left: 50%;
top: 50%;
width: 10px;
height: 10px;
border: 2px solid #c1c1c1;
border-radius: 5px;
border-radius: 50%;
background-color: #fff;
transform: translate3d(-50%, -50%, 0);
}
.default-image-slider .item {
vertical-align: top;
}
.default-image-slider .item a {
display: block;
}
.default-image-slider .item a:hover .subject, .default-image-slider .item a:focus .subject {
text-decoration: underline;
}
.default-image-slider .item img {
width: 100%;
height: auto;
vertical-align: top;
}
.default-image-slider .thumb {
display: block;
position: relative;
padding-top: 78.86178%;
border-radius: 10px;
overflow: hidden;
}
.default-image-slider .thumb img {
position: absolute;
top: 0;
left: 0;
max-width: none;
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.default-image-slider .subject {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal;
max-height: 36px;
line-height: 18px;
text-overflow: ellipsis;
overflow: hidden;
display: block;
margin-top: 13px;
padding: 0 10px;
font-size: 16px;
letter-spacing: -0.5px;
}
.default-image-slider.card-news-slider {
max-width: 600px;
margin: 30px auto;
}
@media (min-width: 1025px) {
.default-image-slider.slick-slider .slick-list {
margin: -10px;
}
.default-image-slider.slick-slider .slick-slide {
margin: 10px;
}
}
@media (max-width: 1024.98px) {
.default-image-slider .subject {
height: 36px;
}
}
.slick-slide .item a:focus {
border: 1px solid #000;
display: block;
}
.ico {
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
vertical-align: middle;
overflow: hidden;
text-indent: -9999px;
overflow: hidden;
text-align: left;
}
/* 범용 비규격 아이콘 */
.ico-times-white {
width: 18px;
height: 18px;
line-height: 18px;
background-image: url("../../_common/images/ico-times-white@2x.png");
}
.ico-chevron-down {
width: 13px;
height: 7px;
line-height: 7px;
background-image: url("../../_common/images/ico-chevron-down@2x.png");
}
.ico-chevron-down-lg {
width: 19px;
height: 10px;
line-height: 10px;
background-image: url("../../_common/images/ico-chevron-down-lg@2x.png");
}
.ico-chevron-down-sm-white {
width: 9px;
height: 5px;
line-height: 5px;
background-image: url("../../_common/images/ico-chevron-down-sm-white@2x.png");
}
.ico-chevron-up-white {
width: 18px;
height: 10px;
line-height: 10px;
background-image: url("../../_common/images/ico-chevron-up-white@2x.png");
}
.ico-download {
width: 12px;
height: 14px;
line-height: 14px;
background-image: url("../../_common/images/ico-download@2x.png");
}
.ico-download-primary {
width: 12px;
height: 14px;
line-height: 14px;
background-image: url("../../_common/images/ico-download-primary@2x.png");
}
@media (min-width: 1025px) {
.ico-snslist-snsx {
width: 25px;
height: 25px;
line-height: 25px;
background-image: url("/resources/user/_common/images/ico-sns-x@2x.png");
}
.ico-snslist-snsfacebook {
width: 25px;
height: 25px;
line-height: 25px;
background-image: url("/resources/user/_common/images/ico-sns-facebook@2x.png");
}
.ico-snslist-snsyutube {
width: 25px;
height: 25px;
line-height: 25px;
background-image: url("/resources/user/_common/images/ico-sns-yutube@2x.png");
}
.ico-snslist-snsblog {
width: 25px;
height: 25px;
line-height: 25px;
background-image: url("/resources/user/_common/images/ico-sns-blog@2x.png");
}
.ico-snslist-snsinstar {
width: 25px;
height: 25px;
line-height: 25px;
background-image: url("/resources/user/_common/images/ico-sns-insta@2x.png");
}
.ico-android {
width: 25px;
height: 25px;
line-height: 25px;
background-image: url("/resources/user/_common/images/ico-android.png");
}
.ico-ios {
width: 25px;
height: 25px;
line-height: 25px;
background-image: url("/resources/user/_common/images/ico-ios.png");
}
}
@media (max-width: 1024.98px) {
.ico-snslist-snsx {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("/resources/user/_common/images/ico-sns-x@2x.png");
}
.ico-snslist-snsfacebook {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("/resources/user/_common/images/ico-sns-facebook@2x.png");
}
.ico-snslist-snsyutube {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("/resources/user/_common/images/ico-sns-yutube@2x.png");
}
.ico-snslist-snsblog {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("/resources/user/_common/images/ico-sns-blog@2x.png");
}
.ico-snslist-snsinstar {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("/resources/user/_common/images/ico-sns-insta@2x.png");
}
.ico-android {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("/resources/user/_common/images/ico-android.png");
}
.ico-ios {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("/resources/user/_common/images/ico-ios.png");
}
}
.ico-external-link {
width: 16px;
height: 15px;
line-height: 15px;
background-image: url("../../_common/images/ico-external-link@2x.png");
}
.ico-popup {
width: 18px;
height: 14px;
line-height: 14px;
background-image: url("../../_common/images/ico-popup@2x.png");
}
.ico-search-primary {
width: 20px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-search-primary@2x.png");
}
.ico-close-primary {
width: 17px;
height: 17px;
line-height: 17px;
background-image: url("../../_common/images/ico-close-primary@2x.png");
}
.ico-search-white {
width: 14px;
height: 14px;
line-height: 14px;
background-image: url("../../_common/images/ico-search-white@2x.png");
}
.ico-notice-primary {
width: 22px;
height: 20px;
line-height: 20px;
background-image: url("../../_common/images/ico-notice-primary@2x.png");
}
.ico-datepicker-primary {
width: 22px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-datepicker-primary@2x.png");
}
.ico-file-gif {
width: 19px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-file-gif@2x.png");
}
.ico-file-hwp {
width: 19px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-file-hwp@2x.png");
}
.ico-file-jpg {
width: 19px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-file-jpg@2x.png");
}
.ico-file-pdf {
width: 19px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-file-pdf@2x.png");
}
.ico-file-png {
width: 19px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-file-png@2x.png");
}
.ico-file-word {
width: 19px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-file-word@2x.png");
}
.ico-file-xls {
width: 19px;
height: 22px;
line-height: 22px;
background-image: url("../../_common/images/ico-file-xls@2x.png");
}
.ico-file {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("../../_common/images/ico-file@2x.png");
}
.ico-nodata-gray {
width: 41px;
height: 36px;
line-height: 36px;
background-image: url("../../_common/images/ico-nodata-gray@2x.png");
}
.ico-reply-gray {
width: 14px;
height: 17px;
line-height: 17px;
background-image: url("../../_common/images/ico-reply-gray@2x.png");
}
.ico-lock-gray {
width: 16px;
height: 20px;
line-height: 20px;
background-image: url("../../_common/images/ico-lock-gray@2x.png");
}
.ico-play-black {
width: 44px;
height: 44px;
line-height: 44px;
background-image: url("../../_common/images/ico-play-black@2x.png");
}
.ico-play-circle-white {
width: 41px;
height: 41px;
line-height: 41px;
background-image: url("../../_common/images/ico-play-circle-white@2x.png");
}
.ico-view-gray {
width: 18px;
height: 10px;
line-height: 10px;
background-image: url("../../_common/images/ico-view-gray@2x.png");
}
.ico-plus-white {
width: 16px;
height: 16px;
line-height: 16px;
background-image: url("../../_common/images/ico-plus-white@2x.png");
}
.ico-minus-white {
width: 16px;
height: 16px;
line-height: 16px;
background-image: url("../../_common/images/ico-minus-white@2x.png");
}
.ico-chevron-up-gray {
width: 9px;
height: 5px;
line-height: 5px;
background-image: url("../../_common/images/ico-chevron-up-gray@2x.png");
}
.ico-chevron-down-gray {
width: 9px;
height: 5px;
line-height: 5px;
background-image: url("../../_common/images/ico-chevron-down-gray@2x.png");
}
.ico-chevron-right-sm-gray {
width: 5px;
height: 9px;
line-height: 9px;
background-image: url("../../_common/images/ico-chevron-right-sm-gray@2x.png");
}
.ico-chevron-left-sm-gray {
width: 5px;
height: 9px;
line-height: 9px;
background-image: url("../../_common/images/ico-chevron-left-sm-gray@2x.png");
}
.ico-times-sm-gray {
width: 12px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-times-sm-gray@2x.png");
}
.ico-like-white {
width: 19px;
height: 19px;
line-height: 19px;
background-image: url("../../_common/images/ico-like-white@2x.png");
}
.ico-print-gray {
width: 24px;
height: 19px;
line-height: 19px;
background-image: url("../../_common/images/ico-print-gray@2x.png");
}
.ico-sns-sm-facebook {
width: 16px;
height: 19px;
line-height: 19px;
background-image: url("../../_common/images/ico-sns-sm-facebook@2x.png");
}
.ico-sns-sm-twitter {
width: 16px;
height: 19px;
line-height: 19px;
background-image: url("../../_common/images/ico-sns-sm-twitter@2x.png");
}
.ico-sns-sm-twitter {
width: 16px;
height: 19px;
line-height: 19px;
background-image: url("../../_common/images/ico-sns-sm-twitter@2x.png");
}
.ico-rank-up {
width: 10px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-rank-up@2x.png");
}
.ico-rank-down {
width: 10px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-rank-down@2x.png");
}
.ico-chevron-right-md-gray {
width: 8px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-chevron-right-md-gray@2x.png");
}
.ico-chevron-left-md-gray {
width: 8px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-chevron-left-md-gray@2x.png");
}
.ico-download-white {
width: 12px;
height: 14px;
line-height: 14px;
background-image: url("../../_common/images/ico-download-white@2x.png");
}
.ico-download-blue {
width: 12px;
height: 14px;
line-height: 14px;
background-image: url("../../_common/images/ico-download-blue@2x.png");
}
.ico-ico-info {
width: 16px;
height: 16px;
line-height: 16px;
background-image: url("../../_common/images/ico-ico-info@2x.png");
}
.ico-download-sm {
width: 10px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-download-sm@2x.png");
}
.ico-tropy {
width: 14px;
height: 16px;
line-height: 16px;
background-image: url("../../_common/images/ico-tropy.png");
}
/* 범용 비규격 -xs 아이콘 */
.ico-chevron-down-xs {
width: 13px;
height: 7px;
line-height: 7px;
background-image: url("../../_common/images/ico-chevron-down-xs@2x.png");
}
.ico-chevron-down-xs-white {
width: 13px;
height: 7px;
line-height: 7px;
background-image: url("../../_common/images/ico-chevron-down-xs-white@2x.png");
}
.ico-chevron-up-white-xs {
width: 13px;
height: 7px;
line-height: 7px;
background-image: url("../../_common/images/ico-chevron-up-white-xs@2x.png");
}
.ico-download-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-download-xs@2x.png");
}
.ico-download-primary-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-download-primary-xs@2x.png");
}
.ico-external-link-xs {
width: 13px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-external-link-xs@2x.png");
}
.ico-like-white-xs {
width: 12px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-like-white-xs@2x.png");
}
.ico-chevron-right-xs-gray {
width: 8px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-chevron-right-xs-gray@2x.png");
}
.ico-chevron-left-xs-gray {
width: 8px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-chevron-left-xs-gray@2x.png");
}
.ico-download-white-xs {
width: 11px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-download-white-xs@2x.png");
}
.ico-download-blue-xs {
width: 11px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-download-blue-xs@2x.png");
}
.ico-ico-info-xs {
width: 12px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-ico-info-xs@2x.png");
}
.ico-download-xs {
width: 9px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-download-xs@2x.png");
}
.ico-file-gif-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-file-gif-xs@2x.png");
}
.ico-file-hwp-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-file-hwp-xs@2x.png");
}
.ico-file-jpg-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-file-jpg-xs@2x.png");
}
.ico-file-pdf-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-file-pdf-xs@2x.png");
}
.ico-file-png-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-file-png-xs@2x.png");
}
.ico-file-word-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-file-word-xs@2x.png");
}
.ico-file-xls-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-file-xls-xs@2x.png");
}
.ico-file-xs {
width: 10px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-file-xs@2x.png");
}
.ico-notice-primary-xs {
width: 16px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-notice-primary-xs@2x.png");
}
/* 레이아웃 공통 아이콘 */
.ico-allmenu {
width: 16px;
height: 14px;
line-height: 14px;
background-image: url("../../_common/images/ico-allmenu@2x.png");
}
.ico-login-white {
width: 19px;
height: 19px;
line-height: 19px;
background-image: url("../../_common/images/ico-login-white.png");
}
.ico-logout-white {
width: 22px;
height: 20px;
line-height: 20px;
background-image: url("../../_common/images/ico-logout-white.png");
}
.ico-join-white {
width: 20px;
height: 19px;
line-height: 19px;
background-image: url("../../_common/images/ico-join-white.png");
}
.ico-login-gray {
width: 17px;
height: 17px;
line-height: 17px;
background-image: url("../../_common/images/ico-login-gray@2x.png");
}
.ico-logout-gray {
width: 18px;
height: 17px;
line-height: 17px;
background-image: url("../../_common/images/ico-logout-gray@2x.png");
}
.ico-join-gray {
width: 18px;
height: 17px;
line-height: 17px;
background-image: url("../../_common/images/ico-join-gray@2x.png");
}
.ico-plus {
width: 13px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-plus@2x.png");
}
.ico-minus {
width: 13px;
height: 13px;
line-height: 13px;
background-image: url("../../_common/images/ico-minus@2x.png");
}
.ico-home {
width: 23px;
height: 19px;
line-height: 19px;
background-image: url("../../_common/images/ico-home.png");
}
.ico-new-window {
width: 15px;
height: 12px;
line-height: 12px;
background-image: url("../../_common/images/ico-new-window.png");
}
.ico-new-window-lg {
width: 18px;
height: 14px;
line-height: 14px;
background-image: url("../../_common/images/ico-new-window-lg.png");
}
.ico-satisfy1 {
width: 28px;
height: 28px;
line-height: 28px;
background-image: url("../../_common/images/ico-satisfy1@2x.png");
}
.ico-satisfy2 {
width: 28px;
height: 28px;
line-height: 28px;
background-image: url("../../_common/images/ico-satisfy2@2x.png");
}
.ico-satisfy3 {
width: 28px;
height: 28px;
line-height: 28px;
background-image: url("../../_common/images/ico-satisfy3@2x.png");
}
.ico-satisfy4 {
width: 28px;
height: 28px;
line-height: 28px;
background-image: url("../../_common/images/ico-satisfy4@2x.png");
}
.ico-satisfy5 {
width: 28px;
height: 28px;
line-height: 28px;
background-image: url("../../_common/images/ico-satisfy5@2x.png");
}
.ico-bag-gray {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("../../_common/images/ico-bag-gray@2x.png");
}
.ico-tel-gray {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("../../_common/images/ico-tel-gray@2x.png");
}
.ico-datepicker-gray {
width: 23px;
height: 24px;
line-height: 24px;
background-image: url("../../_common/images/ico-datepicker-gray@2x.png");
}
.ico-write-white {
width: 20px;
height: 20px;
line-height: 20px;
background-image: url("../../_common/images/ico-write-white@2x.png");
}
/* 불릿 시스템 */
.title1,
.title2 {
position: relative;
display: block;
align-items: center;
}
.title1:before,
.title2:before {
flex: 0 0 auto;
content: "";
}
.title1 .btn,
.title2 .btn {
vertical-align: initial;
flex: 0 0 auto;
}
.title1 {
font-weight: bold;
padding-left: 11px;
font-family: "s-core-dream", "malgun gothic", Arial, sans-serif;
font-size: 18px;
font-weight: 500;
}
.title1:before {
position: absolute;
left: 0;
width: 5px;
height: 18px;
background-color: #1f76eb;
border-radius: 3px;
top: 3px;
}
.title2 {
padding-left: 18px;
font-weight: 500;
font-size: 16px;
}
.title2:before {
content: "";
box-sizing: border-box;
position: absolute;
left: 0;
width: 11px;
height: 11px;
border: 3px solid #1f76eb;
border-radius: 50%;
top: 7px;
}
.title2 .btn-xs {
top: -1px;
}
.title3 {
padding-left: 18px;
font-size: 15px;
font-weight: normal;
position: relative;
}
.title3:before {
content: "";
box-sizing: border-box;
position: absolute;
left: 0;
width: 12px;
height: 12px;
border: 4px solid #1f76eb;
border-radius: 50%;
top: 5px;
}
.title3 .btn-xs {
top: -1px;
}
.title-check {
font-size: 18px;
font-weight: 500;
}
.title-check:before {
content: "";
display: inline-block;
vertical-align: middle;
margin-top: -2px;
margin-right: 5px;
width: 12px;
height: 12px;
background: url(../images/ico-check-lightprimary.png);
}
.list > li {
position: relative;
}
.list > li:after {
display: block;
clear: both;
content: "";
}
.list > li:before {
content: "";
position: absolute;
left: 0;
}
.list1 > li {
padding-left: 10px;
}
.list1 > li:before {
content: "";
display: block;
box-sizing: border-box;
position: absolute;
left: 0;
top: 7px;
width: 6px;
height: 6px;
border: 2px solid #2768bf;
}
.list1 > li + li {
margin-top: 8px;
}
.list2 {
font-size: 14px;
}
.list2 > li {
padding-left: 9px;
}
.list2 > li + li {
margin-top: 5px;
}
.list2 > li:before {
width: 5px;
height: 2px;
background-color: #647285;
top: 9px;
}
.list3 {
font-size: 14px;
}
.list3 > li {
padding-left: 9px;
}
.list3 > li + li {
margin-top: 5px;
}
.list3 > li:before {
width: 3px;
height: 3px;
background-color: #647285;
top: 9px;
}
.list-check > li {
padding-left: 15px;
}
.list-check > li + li {
margin-top: 5px;
}
.list-check > li:before {
top: 0.25em;
width: 12px;
height: 12px;
background: url(../images/ico-check-lightprimary.png);
}
.f11 {
font-size: 11px !important;
}
.f12 {
font-size: 12px !important;
}
.f13 {
font-size: 13px !important;
}
.f14 {
font-size: 14px !important;
}
.f15 {
font-size: 15px !important;
}
.f16 {
font-size: 16px !important;
}
.f17 {
font-size: 17px !important;
}
.f18 {
font-size: 18px !important;
}
.f20 {
font-size: 20px !important;
}
.f22 {
font-size: 22px !important;
}
.f24 {
font-size: 24px !important;
}
.f26 {
font-size: 26px !important;
}
.f28 {
font-size: 28px !important;
}
.f30 {
font-size: 30px !important;
}
.f36 {
font-size: 36px !important;
}
.underline {
text-decoration: underline;
}
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
vertical-align: middle;
white-space: nowrap;
overflow: hidden;
font-family: "Noto Sans KR", "Noto Sans CJK KR", "NotoSansKR", "malgun gothic", Arial, sans-serif;
font-weight: normal;
transition-duration: 0.2s;
transition-property: box-shadow, transform;
will-change: box-shadow, transform;
}
.btn .ico {
flex: 0 0 auto;
}
.btn .ico:first-child {
margin-right: 4px;
}
.btn .ico:only-child {
margin-left: 0;
margin-right: 0;
}
.btn * + .ico {
margin-left: 4px;
}
.btn:focus {
border: 1px solid #000 !important;
}
.btn-xs:focus,
.btn-sm:focus,
.btn-md:focus,
.btn-lg:focus,
.btn-icon:focus {
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
border: 1px solid #000;
}
@media (min-width: 1025px) {
.btn-xs:hover,
.btn-sm:hover,
.btn-md:hover,
.btn-lg:hover,
.btn-icon:hover {
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
}
.btn-xs,
.btn-sm,
.btn-md,
.btn-lg {
border-radius: 3px;
}
.btn-xs {
border: 1px solid transparent;
min-width: 50px;
height: 20px;
padding: 0 10px;
font-size: 12px;
}
.btn-sm {
border: 1px solid transparent;
min-width: 65px;
height: 30px;
padding: 0 14px;
font-size: 14px;
}
.btn-md {
border: 1px solid transparent;
min-width: 80px;
height: 40px;
font-size: 15px;
padding: 0 15px;
}
.btn-lg {
border: 1px solid transparent;
min-width: 90px;
height: 40px;
font-size: 16px;
padding: 0 20px;
}
@media (max-width: 767.98px) {
.btn-lg {
min-width: 75px;
}
}
@media (max-width: 767.98px) {
.m-w-100 {
width: 80%;
min-width: 150px;
}
}
.btn-icon {
min-width: auto;
}
.btn-icon .ico {
margin: 0 !important;
}
.btn-block {
display: flex;
width: 100%;
}
.btn-round {
border-radius: 25px;
}
.btn-default {
color: #fff;
background-color: #7b7b7b;
}
.btn-primary {
color: #fff;
background-color: #2768bf;
}
.btn-wait {
color: #fff;
background-color: #689f38;
}
/* 20221102 start */
.btn-secondary {
color: #fff;
background-color: #f26b19;
}
/* 20221102 end */
.btn-outline-default {
color: #333;
border-color: #959595;
background-color: #fff;
}
.btn-outline-primary {
color: #2768bf;
border-color: #2768bf;
background-color: #fff;
}
.bbs-search .btn-outline-primary {
color: #1f76eb;
border-color: #1f76eb;
}
.form-control + .btn-calendar {
margin-left: -5px;
}
.btn-more {
padding: 0 39px;
height: 50px;
font-size: 16px;
border-radius: 25px;
color: #333;
border: 1px solid #dadada;
background-color: #fff;
}
.btn-more .count {
font-style: normal;
margin: 0 5px;
}
.btn-more:after {
content: "";
margin-left: 6px;
width: 15px;
height: 9px;
background: url(../../_common/images/ico-chevron-down-sm@2x.png) no-repeat;
background-size: cover;
}
@media (max-width: 1024.98px) {
.btn-more {
height: 40px;
padding: 0 19px;
}
}
/* 버튼 그룹 */
.btn-group {
clear: both;
word-spacing: 6px;
text-align: center;
margin: 50px 0 -5px;
}
.btn-group-form {
text-align: center;
margin-top: 25px;
}
.btn-group-view {
text-align: right;
margin-top: 25px;
}
.btn-group .btn {
margin: 5px 0;
}
.btn-group * {
word-spacing: normal;
}
.form-control {
max-width: 100%;
height: 40px;
border: 1px solid #dadada;
border-radius: 0;
padding: 5px 15px;
line-height: 28px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
text-align: left;
background: #fff;
font-size: 15px;
vertical-align: middle;
transition-duration: 0.2s;
transition-property: color, border-color, box-shadow;
will-change: color, border-color, box-shadow;
}
.form-control::-ms-clear {
display: none;
}
.form-control.full {
width: 100%;
}
.form-control.inline {
width: auto !important;
}
.form-control:hover, .form-control:focus {
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
.form-control:focus {
position: relative;
border-color: #428cf0;
}
.form-control::-webkit-input-placeholder {
color: #555;
opacity: 1;
}
.form-control:-ms-input-placeholder {
color: #555 !important;
opacity: 1;
}
.form-control:disabled, .form-control[readonly=readonly], .form-control.readonly {
background-color: #f9f9f9;
opacity: 1;
}
.form-control:disabled::-ms-value, .form-control[readonly=readonly]::-ms-value, .form-control.readonly::-ms-value {
color: #c2c2c2 !important;
}
.form-control:disabled {
color: #c2c2c2;
}
.form-control:disabled:hover, .form-control:disabled:focus {
box-shadow: none;
}
.form-control:-moz-read-only:not(select):not(button) {
background-color: #f9f9f9;
opacity: 1;
}
.form-control:read-only:not(select):not(button) {
background-color: #f9f9f9;
opacity: 1;
}
@media (max-width: 1024.98px) {
.form-control {
font-size: 16px;
}
}
select.form-control {
max-width: 100%;
line-height: normal;
padding-right: 30px;
background: #fff url(../../_common/images/ico-chevron-down@2x.png) no-repeat right 10px center;
background-size: 13px auto;
}
select.form-control::-ms-expand {
display: none;
}
textarea.form-control {
height: auto;
padding-top: 12px;
padding-bottom: 12px;
overflow: auto;
line-height: inherit;
resize: none;
}
.ckeck-item input[type=checkbox], .ckeck-item input[type=radio],
.ckeck-item-custom input[type=checkbox],
.ckeck-item-custom input[type=radio] {
position: absolute;
width: 1px;
height: 1px;
opacity: 0;
}
.ckeck-item input[type=checkbox] + label, .ckeck-item input[type=radio] + label,
.ckeck-item-custom input[type=checkbox] + label,
.ckeck-item-custom input[type=radio] + label {
position: relative;
height: 20px;
}
.ckeck-item input[type=checkbox] + label .sr-only, .ckeck-item input[type=radio] + label .sr-only,
.ckeck-item-custom input[type=checkbox] + label .sr-only,
.ckeck-item-custom input[type=radio] + label .sr-only {
position: static;
margin-right: -6px !important;
}
.ckeck-item input[type=checkbox] + label:before, .ckeck-item input[type=radio] + label:before,
.ckeck-item-custom input[type=checkbox] + label:before,
.ckeck-item-custom input[type=radio] + label:before {
box-sizing: border-box;
display: inline-block;
width: 20px;
height: 20px;
border: 1px solid #aaa;
vertical-align: middle;
border-radius: 0;
margin: -2px 5px 0 0;
background-color: #fff;
content: "";
transition-duration: 0.2s;
transition-property: border-color, box-shadow, background-color;
will-change: border-color, box-shadow, background-color;
}
.ckeck-item input[type=checkbox]:hover + label:before, .ckeck-item input[type=checkbox]:focus + label:before, .ckeck-item input[type=radio]:hover + label:before, .ckeck-item input[type=radio]:focus + label:before,
.ckeck-item-custom input[type=checkbox]:hover + label:before,
.ckeck-item-custom input[type=checkbox]:focus + label:before,
.ckeck-item-custom input[type=radio]:hover + label:before,
.ckeck-item-custom input[type=radio]:focus + label:before {
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
.ckeck-item input[type=checkbox]:focus + label:before, .ckeck-item input[type=radio]:focus + label:before,
.ckeck-item-custom input[type=checkbox]:focus + label:before,
.ckeck-item-custom input[type=radio]:focus + label:before {
border-color: #428cf0;
}
.ckeck-item input[type=checkbox]:disabled + label, .ckeck-item input[type=radio]:disabled + label,
.ckeck-item-custom input[type=checkbox]:disabled + label,
.ckeck-item-custom input[type=radio]:disabled + label {
color: #959595;
}
.ckeck-item input[type=checkbox]:disabled + label:before, .ckeck-item input[type=radio]:disabled + label:before,
.ckeck-item-custom input[type=checkbox]:disabled + label:before,
.ckeck-item-custom input[type=radio]:disabled + label:before {
opacity: 0.3;
border-color: #959595;
box-shadow: none;
}
.ckeck-item input[type=radio] + label:before,
.ckeck-item-custom input[type=radio] + label:before {
border-radius: 50%;
}
.ckeck-item input[type=radio]:checked + label:before,
.ckeck-item-custom input[type=radio]:checked + label:before {
background: #fff url(../../_common/images/ico-radio-checked-gray@2x.png) no-repeat center center;
background-size: 10px 10px;
}
.ckeck-item input[type=checkbox]:checked + label:before {
background: #fff url(../../_common/images/ico-checkbox-checked-gray@2x.png) no-repeat 45% center;
background-size: 12px 10px;
}
.ckeck-item input[type=checkbox]:disabled + label:before {
background-color: #ccc;
}
.ckeck-item input[type=checkbox]:disabled:checked + label:before {
background-image: url(../../_common/images/ico-checkbox-checked-white@2x.png);
}
.ckeck-item-custom input[type=checkbox] + label:before {
border-color: #1f76eb;
border-radius: 3px;
}
.ckeck-item-custom input[type=checkbox]:checked + label:before {
background: #1f76eb url(../../_common/images/ico-checkbox-checked-white@2x.png) no-repeat 45% center;
background-size: 12px 10px;
}
.ckeck-item-custom input[type=checkbox]:disabled + label:before {
border-color: transparent;
background-color: #ccc;
}
.ckeck-item-custom input[type=radio] + label:before {
border-color: #1f76eb;
}
.ckeck-item-custom input[type=radio]:checked + label:before {
background-image: url(../../_common/images/ico-radio-checked-primary@2x.png);
}
.ckeck-item-custom input[type=radio]:checked:disabled + label:before {
background-image: url(../../_common/images/ico-radio-checked-gray@2x.png);
}
.input-group {
display: table;
width: 100%;
border-spacing: 0;
border-collapse: collapse;
}
.input-group .datepicker,
.input-group .form-control {
display: table-cell;
width: 100%;
}
.input-group .input-addon {
display: table-cell;
width: 1%;
padding-left: 10px;
vertical-align: middle;
}
.input-group .input-addon .unit {
white-space: nowrap;
}
.input-group .input-addon + .form-control {
margin-left: 9px;
border-right: 1px solid #e3e3e3;
}
@media (max-width: 1024.98px) {
.input-group {
max-width: none !important;
}
}
.form-row {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.form-row .text-item {
flex: 0 0 auto;
padding: 0 10px;
}
.form-row .input-item + .input-item {
margin-left: 10px;
}
.form-row .input-item .form-control {
width: 100%;
}
@media (min-width: 1025px) {
.form-row .input-item {
display: block;
flex: 0 0 auto;
}
}
@media (min-width: 768px) and (max-width: 1024.98px) {
.form-row {
max-width: none !important;
}
.form-row .text-item {
padding: 0 5px;
}
.form-row .input-item {
flex: 1 1 10%;
}
.form-row .input-item.md-full {
flex: 1 1 100%;
margin: 15px 0 0 !important;
flex-basis: 100%;
width: 100%;
}
.form-row .input-item .form-control {
width: 100%;
}
.form-row.form-row-number {
margin-top: -3px;
}
.form-row.form-row-number .input-item {
flex: 0 0 auto;
padding: 3px 0;
}
}
@media (max-width: 767.98px) {
.form-row {
max-width: none !important;
}
.form-row .text-item {
padding: 0 5px;
}
.form-row .input-item {
flex: 1 1 10%;
}
.form-row .input-item.md-full {
flex: 1 1 100%;
margin: 15px 0 0 !important;
flex-basis: 100%;
width: 100%;
}
.form-row .input-item .form-control {
width: 100% !important;
}
.form-row.form-row-number {
margin-top: -3px;
}
.form-row.form-row-number .input-item {
flex: 0 0 auto;
padding: 3px 0;
}
}
.input-group-file {
display: block;
max-width: 500px;
}
.input-group-file label {
display: inline-block;
}
.input-group-file .form-file {
display: none;
}
.input-group-file .form-control {
display: inline-block;
margin: 0 0.05rem;
max-width: calc(100% - 1.64rem);
}
.list-form > li {
display: flex;
align-items: center;
padding-left: 10px;
font-size: 15px;
}
.list-form > li:before {
top: 19px;
}
.list-form .title {
margin-right: 15px;
white-space: nowrap;
overflow: hidden;
}
.list-form .letter-number2 {
letter-spacing: 54px;
}
.list-form .letter-number3 {
letter-spacing: 20px;
}
@media (min-width: 1025px) {
.list-form .title {
width: 95px;
}
.list-form.list-form-col2 {
display: flex;
align-items: center;
}
.list-form.list-form-col2 > li + li {
margin-top: 0;
margin-left: 20px;
}
.list-form.list-form-col2 .title {
width: auto;
}
}
@media (max-width: 1024.98px) {
.list-form .title {
flex: 0 0 auto;
width: 83px;
}
.list-form .form-row {
flex: 1 1 50%;
}
.list-form .form-row .input-item {
width: 100% !important;
}
.list-form .input-group .input-addon {
white-space: nowrap;
}
.list-form.list-form-col2 .title {
width: auto;
}
}
.flex-container-address {
align-items: center;
}
@media (max-width: 1024.98px) {
.flex-container-address {
flex-direction: column;
align-items: flex-start;
}
.flex-container-address .flex-item {
display: block;
margin-top: 5px;
}
}
.text-guide,
p.text-guide {
color: #f26b19;
font-size: 14px;
margin: 10px 0 0;
}
@media (max-width: 1024.98px) {
.text-guide,
p.text-guide {
font-size: 15px;
}
}
.req {
color: #f26b19;
vertical-align: middle;
}
.form-move {
overflow: hidden;
transition-duration: 0.3s;
transition-property: color, border-color, box-shadow;
will-change: color, border-color, box-shadow;
display: block;
position: relative;
border: 1px solid #e3e3e3;
border-radius: 5px;
}
.form-move:hover {
color: #333;
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
.form-move .placeholder {
position: absolute;
z-index: 10;
}
.form-move.focus {
border-color: #428cf0;
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
.form-move.focus .placeholder {
color: #1f76eb;
}
.form-move.active .placeholder {
font-size: 14px;
transform: translateY(-14px);
}
.form-move.active .form-control {
padding-top: 30px;
padding-bottom: 10px;
}
.form-move.invalid {
border-color: #e13224;
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
.form-move.invalid + .invalid-message {
display: block;
color: #e13224;
}
.form-move .placeholder,
.form-move .form-control {
font-size: 18px;
outline: 0;
}
.form-move .placeholder {
padding: 20px;
line-height: 22px;
color: #555;
transition-duration: 0.2s;
transition-property: color, transform, font-size;
will-change: color, transform, font-size;
}
.form-move .form-control {
border: 0;
width: 100%;
height: 62px;
padding: 0 20px;
line-height: 20px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.form-move .form-control::-ms-clear {
display: none;
}
[data-toggle-content] {
display: none;
}
[data-toggle-content].show {
display: block;
}
/* faq 20210720*/
.faq {
font-size: 14px;
margin-top: 0px;
}
.faq > ul {
margin: 0;
padding: 0;
list-style: none;
border-top: 1px solid #666;
}
.faq > ul > li {
line-height: 33px;
color: #666;
border-bottom: 1px solid #c2c2c2;
clear: both;
}
.faq .q {
margin: 0;
display: block;
background: #fff;
font-weight: bold;
color: #333;
text-align: left;
text-decoration: none !important;
}
.faq .q a.trigger {
display: block;
padding: 10px 15px;
background: #fff;
font-weight: bold;
color: #333;
text-align: left;
text-decoration: none !important;
font-weight: normal;
font-weight: bold;
line-height: 24px;
}
.faq .q a.trigger strong {
text-indent: -23px;
padding-left: 23px;
display: block;
}
.faq .q a.trigger:hover {
background: #f9f9f9;
color: #000;
}
.faq .q a.trigger:active {
background: #f9f9f9;
color: #000;
}
.faq .q a.trigger:focus {
background: #f9f9f9;
color: #000;
}
.faq .a {
margin: 0;
padding: 10px 15px;
line-height: 1.5;
background-color: #f9f9f9;
border-top: 1px solid #e3e3e3;
}
.faq .qa-reply {
margin: 0 25px;
}
.faq .hgroup {
position: relative;
margin: 0 0 10px 0;
}
.faq .hgroup:after {
display: block;
clear: both;
content: "";
}
.faq .hgroup .trigger {
border: 1px solid transparent;
min-width: 65px;
height: 30px;
padding: 0 10px;
font-size: 14px;
border-radius: 3px;
color: #fff;
background-color: #2768bf;
float: right;
}
.faq .show .q {
background-color: #f9f9f9;
}
.faq .show .q .trigger {
background-color: #f9f9f9;
}
.faq .data-list li {
width: 100%;
overflow-x: auto;
}
.faq .data-table {
border-top: 2px solid #666;
min-width: 640px;
}
.faq .data-table caption {
width: 0;
height: 0;
font-size: 0;
line-height: 0;
text-indent: -9999px;
overflow: hidden;
}
.faq .data-table th {
background-color: #efefef;
font-size: 13px;
color: #555;
border-bottom: 1px solid #c2c2c2;
border-left: 1px solid #c2c2c2;
padding: 9px 15px 8px;
text-align: center;
}
.faq .data-table th:first-child {
border-left: 0;
}
.faq .data-table .first-th {
border-left: 1px solid #c2c2c2 !important;
}
.faq .data-table td {
background-color: #fff;
font-size: 13px;
color: #555;
padding: 9px 10px 8px;
border-bottom: 1px solid #c2c2c2;
border-left: 1px solid #c2c2c2;
}
.faq .board-table {
border-top: 2px solid #666;
}
.faq .board-table caption {
width: 0;
height: 0;
font-size: 0;
line-height: 0;
text-indent: -9999px;
overflow: hidden;
}
.faq .board-table th {
background-color: #efefef;
font-size: 13px;
color: #555;
border-bottom: 1px solid #c2c2c2;
border-left: 1px solid #c2c2c2;
padding: 9px 15px 8px;
text-align: center;
}
.faq .board-table th:first-child {
border-left: 0;
}
.faq .board-table .first-th {
border-left: 1px solid #c2c2c2 !important;
}
.faq .board-table td {
background-color: #fff;
font-size: 13px;
color: #555;
padding: 9px 10px 8px;
border-bottom: 1px solid #c2c2c2;
border-left: 1px solid #c2c2c2;
}
.faq .board-table td:last-child {
border-right: 0;
}
.faq article a {
display: none;
}
.txt_red_b {
color: #d12000 !important;
font-weight: bold;
}
/* 박스 */
.box,
.box-info,
.box-point {
position: relative;
border-radius: 10px;
}
.box dt,
.box-info dt,
.box-point dt {
display: flex;
align-items: center;
font-size: 16px;
font-weight: bold;
margin-bottom: 10px;
}
.box dd,
.box-info dd,
.box-point dd {
font-size: 14px;
}
/* 기본형 */
.box {
border: 1px solid #e3e3e3;
padding: 15px 19px;
}
/* 부가정보형 */
.box-info {
border: 1px solid transparent;
padding: 15px 19px;
background-color: #f9f9f9;
}
/* 강조형 */
.box-point {
padding: 20px 25px;
background: url(../images/bg-box-pattern.png);
}
.box-point:before {
content: "";
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
border-radius: 5px;
background-color: #fff;
}
.box-point > * {
position: relative;
}
/* 이미지 박스 */
.box-image {
display: flex;
align-items: center;
}
.box-image .image {
flex: 1 1 auto;
max-width: 240px;
margin-right: 20px;
padding: 5px 10px;
display: flex;
align-items: center;
justify-content: center;
}
.box-image .content {
flex: 1 1 auto;
}
@media (max-width: 767.98px) {
.box-image {
display: block;
}
.box-image .image {
max-width: none;
margin: 0 0 20px;
padding: 0;
}
}
/* 토글박스 */
.box-toggle {
border: 1px solid #e3e3e3;
border-radius: 10px;
overflow: hidden;
}
.box-toggle + .box-toggle {
margin-top: 5px;
}
.box-toggle .toggle-title {
display: flex;
align-items: stretch;
justify-content: space-between;
font-size: 16px;
background-color: #f9f9f9;
}
.box-toggle .toggle-title .title {
display: inline-flex;
align-items: center;
padding: 15px 0 15px 30px;
font-size: 16px;
font-weight: bold;
}
.box-toggle .toggle-title .btn {
flex: 0 0 auto;
margin: 10px;
padding: 10px;
transition-duration: 0.2s;
}
.box-toggle .toggle-title.on {
background-color: #dfedff;
border-bottom: 1px dashed #e3e3e3;
}
.box-toggle .toggle-title.on .btn {
transform: rotate(-180deg);
}
.box-toggle .toggle-content {
display: none;
padding: 15px 30px;
}
@media (max-width: 1024.98px) {
.box-toggle .toggle-title .title {
padding-left: 20px;
}
.box-toggle .toggle-title .btn {
padding: 10px 5px;
}
.box-toggle .toggle-content {
padding: 15px 20px;
}
}
/* 탭 하단 박스 */
.box-tab {
border-radius: 0;
border-top: 0;
}
/* 박스 쉐도우 추가 0819 */
.box-shadow {
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);
}
/*하단 라인 추가 211115*/
.hr-line {
border-bottom: 1px solid #e3e3e3;
}
.hr-dotted {
border-bottom: 1px dotted #e3e3e3;
}
.hr-dashed {
border-bottom: 1px dashed #e3e3e3;
}
/* 탭메뉴 */
.tab-menu:before, .tab-menu:after {
content: "";
display: table;
}
.tab-list {
display: flex;
justify-items: flex-start;
text-align: center;
line-height: 1.2;
/*.tab-menu2 & {
margin: -1.5px;
font-size: $font-size-base;
color: $gray;
li {
margin: 1.5px;
}
a {
height: 50px;
border: 1px solid $border-base;
background-color: $bg-lightgray;
padding: 1px 2px;
&:focus,
&:hover {
color: $default;
}
}
.on {
a {
padding-bottom: 0;
color: $darkprimary;
border-color: $border-base;
border-bottom: 2px solid $darkprimary;
}
}
} 기존 2차탭 모양*/
}
.tab-list a {
display: flex;
align-items: center;
justify-content: center;
transition-duration: 0.2s;
transition-property: color, border-color, transform;
}
.tab-list a[target=_blank] span:after {
content: "";
display: inline-block;
vertical-align: middle;
margin-left: 8px;
width: 16px;
height: 15px;
margin-top: -2px;
background: url(../images/ico-external-link@2x.png) no-repeat;
background-size: cover;
}
.tab-list li a span {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal;
max-height: 40px;
line-height: 20px;
text-overflow: ellipsis;
overflow: hidden;
}
@media (min-width: 1025px) {
.tab-list li {
flex: 1 1 auto;
width: calc(16.666666% - 3px);
}
.tab-list li:not(.on):hover a {
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
.tab-matrix-lg .tab-list {
flex-wrap: wrap;
}
.tab-matrix-lg .tab-list li {
max-width: calc(16.666666% - 3px);
}
}
@media (max-width: 1024.98px) {
.tab-list li {
flex: 1 1 auto;
width: calc(33.333333% - 3px);
}
.tab-matrix-md .tab-list {
flex-wrap: wrap;
}
.tab-matrix-md .tab-list li {
max-width: calc(33.333333% - 3px);
}
}
.tab-menu1 .tab-list {
margin: -1.5px;
font-size: 15px;
color: #666;
}
.tab-menu1 .tab-list li {
margin: 1.5px;
}
.tab-menu1 .tab-list a {
height: 50px;
border: 1px solid #e3e3e3;
background-color: #f9f9f9;
padding: 0 1px;
}
.tab-menu1 .tab-list a:focus, .tab-menu1 .tab-list a:hover {
color: #333;
}
.tab-menu1 .tab-list .on a {
color: #1f76eb;
border: 2px solid #1f76eb;
padding: 0 1px;
}
/* 2차탭 수정 210819 start*/
.tab-menu2 {
border-bottom: 1px solid #e3e3e3;
}
.tab-menu2 .tab-list li {
width: inherit;
flex: inherit;
position: relative;
padding: 0 24px;
margin-top: 21px;
}
.tab-menu2 .tab-list li:focus a, .tab-menu2 .tab-list li:hover a {
box-shadow: none !important;
color: #2768bf;
border-bottom: 3px solid #2768bf;
padding-bottom: 9px;
}
.tab-menu2 .tab-list li.on a {
color: #2768bf;
border-bottom: 3px solid #2768bf;
padding-bottom: 9px;
}
.tab-menu2 .tab-list li a {
font-size: 15px;
color: #333;
padding-bottom: 12px;
}
.tab-menu2 .tab-list li::before {
content: " ";
width: 1px;
height: 13px;
background-color: #dddddd;
position: absolute;
left: 0;
top: 1px;
}
.tab-menu2 .tab-list li:first-child::before {
width: 0;
}
.tab-menu2 .tab-list {
margin-top: -21px;
}
/* 2차탭 수정 210819 END*/
@media (min-width: 768px) and (max-width: 1024.98px) {
.tab-dropdown-sm.tab-matrix-md {
flex-wrap: wrap;
}
.tab-dropdown-sm.tab-matrix-md li {
max-width: calc(33.333333% - 3px);
}
}
@media (max-width: 767.98px) {
.tab-dropdown-sm {
margin-bottom: 30px;
}
.tab-dropdown-sm .tab-list {
position: relative;
height: 40px;
margin: 0 !important;
padding-top: 39px;
text-align: left;
font-size: 15px;
}
.tab-dropdown-sm .tab-list:after {
display: block;
position: absolute;
right: 10px;
top: 15px;
width: 13px;
height: 7px;
background: #fff url(../../_common/images/ico-chevron-down@2x.png) no-repeat;
background-size: 13px auto;
content: "";
}
.tab-dropdown-sm .tab-list li {
display: none;
float: none;
max-width: none;
width: 100%;
height: auto;
margin: -1px 0 0 0 !important;
border: 1px solid #dadada;
border-top-color: rgba(218, 218, 218, 0.4);
background-color: #fff;
}
.tab-dropdown-sm .tab-list li.on {
display: block;
position: absolute;
border-top: 1px solid #dadada;
top: 0;
}
.tab-dropdown-sm .tab-list li.on a {
border: 0;
}
.tab-dropdown-sm .tab-list li.on a span {
height: 38px;
line-height: 38px;
}
.tab-dropdown-sm .tab-list a {
display: block;
height: auto;
border: 0;
padding: 0;
background-color: transparent;
}
.tab-dropdown-sm .tab-list a span {
display: block;
width: auto;
height: 32px;
padding: 0 18px;
color: #333;
line-height: 32px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
background-color: #fff;
}
.tab-dropdown-sm .tab-list a br {
display: none;
}
.tab-dropdown-sm.opened .tab-list {
display: block;
position: relative;
z-index: 11;
}
.tab-dropdown-sm.opened .tab-list:after {
transform: rotate(180deg);
}
.tab-dropdown-sm.opened .tab-list li {
display: block;
}
.tab-dropdown-sm.opened .tab-list li.on {
border-color: #428cf0;
}
}
.tab-content {
display: none;
}
/* 점프 투 타입 */
.tab-menu-jumpto + .tab-content-jumpto .btn-jumpto-totop:not(:focus) {
display: block;
position: absolute;
top: 0;
border: 0;
margin-bottom: -1px;
width: 100%;
height: 1px;
text-align: center;
text-decoration: none;
font-size: 18px;
overflow: hidden;
z-index: 600;
}
.tab-menu-jumpto + .tab-content-jumpto .btn-jumpto-totop:not(:focus):focus, .tab-menu-jumpto + .tab-content-jumpto .btn-jumpto-totop:not(:focus):active {
height: 45px;
line-height: 45px;
color: #fff;
background: #666;
}
.tab-content-jumpto {
position: relative;
}
.tab-content-jumpto + .tab-content-jumpto {
margin-top: 55px;
}
.tab-content-jumpto .btn-jumpto-totop {
position: absolute;
right: 0;
top: 0;
z-index: 2;
}
/* 모달, 윈도우 팝업 공통 */
.popup-header {
display: flex;
align-items: center;
justify-content: center;
font-family: "s-core-dream", "malgun gothic", Arial, sans-serif;
height: 40px;
background-color: #0e3d6a;
text-align: center;
}
.popup-header .popup-title {
font-size: 18px;
line-height: 1;
font-weight: 500;
color: #fff;
}
@media (min-width: 1025px) {
.modal-popup .popup-header {
border-radius: 10px 10px 0 0;
}
}
@media (max-width: 1024.98px) {
.modal-popup .popup-header {
height: 50px;
justify-content: flex-start;
padding-left: 15px;
}
}
.popup-body {
overflow-y: auto;
-webkit-overflow-scrolling: touch;
padding: 30px 30px 0;
}
@media (max-width: 1024.98px) {
.popup-body {
padding: 15px 15px 0;
}
}
.popup-footer {
position: relative;
padding: 10px 20px;
text-align: center;
border-radius: 0 0 10px 10px;
}
.popup-footer.not-open-today {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #f9f9f9;
}
.popup-footer .btn-group {
margin-top: 10px;
}
.modal-popup .popup-footer .btn-group {
margin-bottom: 15px;
}
.btn-close-popup {
display: block;
position: absolute;
top: 0;
right: -9999px;
width: 1px;
height: 1px;
border: 0;
text-decoration: none;
overflow: hidden;
background: url(../../_common/images/ico-times-white@2x.png) no-repeat center center;
background-size: 18px 18px;
overflow: hidden;
}
.btn-close-popup:focus, .btn-close-popup:active {
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
vertical-align: middle;
overflow: hidden;
text-indent: -9999px;
overflow: hidden;
text-align: left;
top: 0;
right: 0;
width: auto;
height: auto;
width: 30px;
height: 30px;
background: #0e3d6a url(../../_common/images/ico-times-white@2x.png) no-repeat center center;
background-size: 18px 18px;
}
.popup-header ~ .btn-close-popup {
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
vertical-align: middle;
overflow: hidden;
text-indent: -9999px;
overflow: hidden;
text-align: left;
right: 0;
width: 40px;
height: 40px;
background: url(../../_common/images/ico-times-white@2x.png) no-repeat center center;
background-size: 18px 18px;
}
@media (min-width: 1025px) {
.popup-header ~ .btn-close-popup {
top: -2px;
right: -2px;
}
}
@media (max-width: 1024.98px) {
.modal-popup .popup-header ~ .btn-close-popup {
width: 48px;
height: 50px;
}
}
/* 모달 팝업 */
.modal-open {
overflow: hidden;
}
.modal-popup {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1100;
display: flex;
justify-content: center;
align-items: center;
}
.modal-popup .dimed {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.8);
}
.modal-popup .popup-inner {
position: relative;
z-index: 1100;
width: 500px;
transition-duration: 0.3s;
transition-property: transform;
background-color: #fff;
}
.modal-popup .popup-inner:focus {
outline: 0;
}
.modal-popup.hide .modal-popup .popup-inner {
transform: scale(0.9);
}
.modal-popup.show .modal-popup .popup-inner {
transform: scale(1);
}
.modal-popup.hide {
opacity: 0;
visibility: hidden;
}
.modal-popup.hide .popup-inner {
transform: translateY(-50px);
}
.modal-popup.show {
opacity: 1;
visibility: visible;
transition-duration: 0.3s;
}
.modal-popup.show .popup-inner {
transform: translateY(0);
}
.modal-popup.modal-sm .popup-inner {
width: 360px;
}
.modal-popup.modal-md .popup-inner {
width: 500px;
}
.modal-popup.modal-lg .popup-inner {
width: 920px;
}
.modal-popup.modal-xl .popup-inner {
width: 1200px;
}
.modal-popup.modal-full .popup-inner {
display: flex;
flex-direction: column;
width: calc(100% - 100px);
height: calc(100% - 100px);
}
.modal-popup.modal-full .popup-header,
.modal-popup.modal-full .popup-footer {
flex: 0 0 auto;
}
.modal-popup.modal-full .popup-body {
flex: 1 1 auto;
max-height: none;
padding-bottom: 30px;
}
@media (min-width: 1025px) {
.modal-popup .popup-inner {
border-radius: 10px;
border: 2px solid #0e3d6a;
}
.modal-popup .popup-header {
margin: -2px -2px 0;
}
.modal-popup .popup-body {
max-height: calc(100vh - 200px);
}
}
@media (max-width: 1024.98px) {
.modal-popup.modal-sm .popup-inner {
margin: 15px;
border-radius: 10px;
border: 2px solid #0e3d6a;
}
.modal-popup:not(.modal-sm) .popup-inner {
width: 100%;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
height: 100%;
}
.modal-popup:not(.modal-sm) .popup-header,
.modal-popup:not(.modal-sm) .popup-footer {
flex: 0 0 auto;
}
.modal-popup:not(.modal-sm) .popup-body {
flex: 1 1 auto;
max-height: 100%;
}
}
/* 윈도우 팝업 */
.popup {
height: 100%;
overflow: hidden;
}
.popup .popup-inner {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
height: 100%;
}
.popup .popup-header {
flex: 0 0 auto;
}
.popup .popup-body {
flex: 1 1 auto;
max-height: 100%;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
.popup .popup-title {
font-family: "s-core-dream", "malgun gothic", Arial, sans-serif;
}
.popup .popup-footer {
flex: 0 0 auto;
padding-bottom: 30px;
}
.layer-popup {
position: absolute;
z-index: 1000;
transition-duration: 0.3s;
transition-property: opacity;
}
.layer-popup.hide {
opacity: 0;
visibility: hidden;
}
.layer-popup.show {
opacity: 1;
visibility: visible;
}
.layer-popup .popup-inner {
position: relative;
z-index: 1100;
transition-duration: 0.3s;
transition-property: transform;
background-color: #fff;
border-radius: 10px;
border: 1px solid #428cf0;
box-shadow: 0 6px 9px rgba(0, 0, 0, 0.2);
overflow: hidden;
}
.layer-popup .popup-inner:focus {
outline: 0;
}
.modal-popup.hide .layer-popup .popup-inner {
transform: scale(0.9);
}
.modal-popup.show .layer-popup .popup-inner {
transform: scale(1);
}
.layer-popup .popup-header {
justify-content: flex-start;
height: 50px;
padding: 0 19px;
background-color: #f3f3f3;
}
.layer-popup .popup-header .popup-title {
display: flex;
align-items: center;
padding-top: 6px;
color: #333;
font-weight: 600;
}
.layer-popup .popup-header .popup-title .ico {
margin-top: -4px;
margin-right: 4px;
}
.layer-popup .popup-header ~ .btn-close-popup {
top: 0;
right: 0;
width: 50px;
height: 50px;
background-image: url(../../_common/images/ico-times-gray@2x.png);
background-size: 20px auto;
}
.layer-popup .popup-body {
padding: 16px 20px 20px;
}
.layer-popup .popup-body .btn-group {
margin-top: 12px;
}
@media (min-width: 1025px) {
.layer-popup .popup-inner {
width: 360px;
}
}
@media (max-width: 1024.98px) {
.layer-popup {
position: fixed;
top: 0 !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
display: flex;
align-items: center;
justify-content: center;
padding: 15px;
}
.layer-popup .popup-inner {
max-width: 500px;
width: 100% !important;
}
}
table {
width: 100%;
border-spacing: 0;
}
.table table {
table-layout: fixed;
border-top: 2px solid #004a85;
border-collapse: collapse;
border-bottom: 1px solid #85a3bb;
border-left: hidden;
border-right: hidden;
}
.table thead {
word-break: keep-all;
}
.table thead ~ tbody,
.table thead ~ tfoot {
text-align: center;
}
.table caption + tbody > tr:first-child > th,
.table colgroup + tbody > tr:first-child > th {
border-top: 1px solid #eee !important;
/* 1022 */
}
.table caption + tbody > tr:first-child > td,
.table colgroup + tbody > tr:first-child > td {
border-top: 0px solid #eee;
/* 1022 */
}
.table th,
.table td {
height: 45px;
padding: 10px 20px;
border-top: 1px solid #c9d2d9;
border-right: 1px solid #c9d2d9;
}
.table th {
background-color: #eef3f8;
font-weight: bold;
}
.table thead {
text-align: center;
}
.table thead tr:first-child th,
.table thead tr:first-child td {
border-top: 0;
}
.table thead th {
color: #003865;
}
.table.table-narrow th,
.table.table-narrow td {
padding-left: 10px;
padding-right: 10px;
}
.table.table-point table {
border-top: 2px solid #174b91;
border-bottom: 2px solid #779ccf;
}
.table.table-point th {
background-color: #5185cc;
font-family: "s-core-dream", "malgun gothic", Arial, sans-serif;
font-weight: 500;
font-size: 15px;
color: #fff;
}
.table.table-point th,
.table.table-point td {
border-color: #a4bddf;
}
@media (min-width: 1025px) {
.table-row colgroup {
display: none;
}
.table-row tbody th {
width: 180px;
text-align: left;
}
}
.table-form th {
text-align: left;
}
@media (max-width: 1024.98px) {
.table-form {
overflow: visible;
}
.table-form > table {
width: 100%;
margin-right: 0;
}
.table-form > table > colgroup,
.table-form > table > thead {
display: none;
}
.table-form > table > tbody,
.table-form > table > tfoot {
text-align: left !important;
}
.table-form > table > thead > tr,
.table-form > table > tbody > tr {
display: block;
}
.table-form > table > thead > tr:first-child > th,
.table-form > table > tbody > tr:first-child > th {
border: 0;
}
.table-form > table > thead > tr > th,
.table-form > table > thead > tr > td,
.table-form > table > tbody > tr > th,
.table-form > table > tbody > tr > td {
display: block;
height: auto;
border: 0;
}
.table-form > table > thead > tr > th,
.table-form > table > tbody > tr > th {
background-color: #fff;
border-top: 1px solid #eee;
padding: 12px 0 3px;
}
.table-form > table > thead > tr > td,
.table-form > table > tbody > tr > td {
padding: 3px 0 15px;
}
.table-form .form-control {
width: 100% !important;
}
}
.table-form-min,
.table-form-box {
border-top: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
}
.table-form-min table,
.table-form-box table {
border: 0;
}
.table-form-min th,
.table-form-min td,
.table-form-box th,
.table-form-box td {
border: 0;
height: auto;
}
@media (min-width: 1025px) {
.table-form-min,
.table-form-box {
padding: 20px 0;
}
.table-form-min table,
.table-form-box table {
width: 100%;
margin-right: 0;
}
.table-form-min th,
.table-form-box th {
background-color: transparent;
}
.table-form-min th,
.table-form-min td,
.table-form-box th,
.table-form-box td {
padding: 10px 0;
}
}
@media (max-width: 1024.98px) {
.table-form-min,
.table-form-box {
padding-bottom: 20px;
}
.table-form-min th,
.table-form-box th {
padding: 20px 0 10px;
line-height: 1;
}
.table-form-min td,
.table-form-box td {
padding: 0;
}
}
@media (min-width: 1025px) {
.table-form-box {
border: 1px solid #e6e6e6;
padding: 20px 30px;
}
}
.table-scroll .scroll-container {
border-bottom: 1px solid #85a3bb;
}
.table-scroll table {
border-bottom: none;
}
@media (min-width: 1025px) {
.table-scroll .scroll-container table {
min-width: auto !important;
}
}
@media (max-width: 1024.98px) {
.table-scroll {
position: relative;
overflow: hidden;
}
.table-scroll:before, .table-scroll:after {
content: "";
position: absolute;
z-index: 10;
top: 0;
bottom: 0;
width: 23px;
top: 0;
bottom: 0;
transition-duration: 0.1s;
}
.table-scroll:before {
opacity: 0;
visibility: hidden;
left: -23px;
box-shadow: 5px 0 15px rgba(0, 0, 0, 0.25);
}
.table-scroll:after {
right: -23px;
box-shadow: -5px 0 15px rgba(0, 0, 0, 0.25);
}
.table-scroll.scroll-ing:before {
opacity: 1;
visibility: visible;
}
.table-scroll.scroll-end:after {
opacity: 0;
visibility: hidden;
}
.table-scroll .scroll-container {
margin-right: -1px;
overflow-y: hidden;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-scroll .scroll-container table {
position: relative;
}
.table-scroll .scroll-container table:after {
position: absolute;
width: 1px;
top: 0;
bottom: 0;
right: 0;
background-color: #fff;
content: "";
}
}
/* 테이블 셀 강조효과 */
.table table .cell-accent-red,
.table table .cell-accent-blue {
border-left: 3px solid;
border-right: 3px solid;
}
.table table .cell-accent-red {
border-left-color: #e13224;
border-right-color: #e13224;
}
.table table .cell-accent-blue {
border-left-color: #004a85;
border-right-color: #004a85;
}
.table thead .cell-accent-red,
.table thead .cell-accent-blue {
border-top: 3px solid !important;
font-weight: bold;
}
.table thead .cell-accent-red {
border-top-color: #e13224 !important;
color: #e13224;
background-color: #ffe8e6;
}
.table thead .cell-accent-blue {
border-top-color: #004a85 !important;
color: #1775B4;
background-color: #eef3f8;
}
.table tbody tr:last-child .cell-accent-red,
.table tbody tr:last-child .cell-accent-blue {
border-bottom: 3px solid;
}
.table tbody tr:last-child .cell-accent-red {
border-bottom-color: #e13224;
}
.table tbody tr:last-child .cell-accent-blue {
border-bottom-color: #004a85;
}
.category-label {
font-size: 14px;
color: #fff;
font-weight: normal;
height: 25px;
line-height: 25px;
display: inline-block;
padding: 0 10px;
}
table.data-table.medium {
table-layout: fixed;
width: 100%;
border-width: 0;
border-spacing: 0;
border-top: 2px solid #666;
}
table.data-table.medium caption {
display: none;
}
table.data-table.medium th,
table.data-table.medium td {
border-bottom: 1px solid #ccc;
}
table.data-table.medium th {
padding: 5px 10px;
background: #efefef;
text-align: center;
}
table.data-table.medium td {
color: #666;
}
table.data-table.medium tbody th,
table.data-table.medium tbody td {
padding: 9px 10px 10px;
}
table.data-table.medium th + th,
table.data-table.medium th + td,
table.data-table.medium td + td,
table.data-table.medium td + th {
border-left: 1px solid #ccc;
}
table.data-table.medium td.first-td,
table.data-table.medium td.first-th {
border-left: 1px solid #ccc;
}
.content-row {
overflow: hidden;
}
@media (min-width: 768px) {
.content-row > .inner {
display: flex;
margin: -15px;
}
.content-row > .inner > .col-item {
flex: 1 1 50%;
margin: 15px;
}
.content-row > .inner > .col-item-fit {
flex: 0 0 auto;
margin: 15px;
}
.content-row.content-images {
margin-top: 30px;
margin-bottom: 30px;
}
.content-row.content-images > .inner {
flex-wrap: wrap;
}
.content-row.content-images > .inner > .col-item {
flex: 1 1 auto;
width: calc(33.3333% - 30px);
}
.content-row.content-images > .inner > .col-item img,
.content-row.content-images > .inner > .col-item-fit img {
width: 100%;
height: 180px;
-o-object-fit: cover;
object-fit: cover;
}
.content-row.content-images > .inner > .col-item img.vertical,
.content-row.content-images > .inner > .col-item-fit img.vertical {
width: 244px;
height: auto;
max-height: 300px;
}
.content-row.content-images > .inner figcaption {
padding-bottom: 0;
}
.content-row.content-images.col2 > .inner > .col-item {
width: calc(50% - 30px);
}
.content-row.content-images.col2 > .inner > .col-item img,
.content-row.content-images.col2 > .inner > .col-item-fit img {
width: auto;
height: 240px;
}
.content-row.content-images.col4 > .inner > .col-item {
width: calc(25% - 30px);
}
.content-row .image-sm {
margin-top: 2px;
max-width: 120px;
}
.content-row .image-md {
margin-top: 2px;
max-width: 240px;
}
.content-row .image-lg {
margin-top: 2px;
max-width: 360px;
}
}
@media (min-width: 768px) and (max-width: 1024.98px) {
.content-row > .inner {
margin: -10px;
}
.content-row > .inner > .col-item {
margin: 10px;
}
.content-row > .inner > .col-item-fit {
margin: 10px;
}
}
@media (max-width: 767.98px) {
.content-row > .inner > .col-item + .col-item,
.content-row > .inner > .col-item + .col-item-fit,
.content-row > .inner > .col-item-fit + .col-item,
.content-row > .inner > .col-item-fit + .col-item-fit {
margin-top: 30px;
}
}
.pagination {
clear: both;
margin-top: 50px;
text-align: center;
font-size: 0;
}
.pagination a,
.pagination strong {
display: inline-block;
min-width: 33px;
height: 31px;
border: 1px solid #eee;
border-radius: 2px;
line-height: 29px;
margin: 0 3px;
padding: 0 5px;
font-size: 14px;
font-weight: normal;
vertical-align: middle;
}
.pagination a {
color: #666;
transition-duration: 0.2s;
transition-property: box-shadow;
}
.pagination a:hover, .pagination a:focus {
box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2);
}
.pagination strong {
color: #fff;
border-color: transparent;
background: #2768bf;
}
.pagination .direction {
width: 30px;
line-height: 26px;
text-indent: 50px;
white-space: nowrap;
background: url(../images/ico-paging-first@2x.png) no-repeat center center;
background-size: auto 9px;
overflow: hidden;
}
.pagination .direction.first {
background-image: url(../images/ico-paging-first@2x.png);
border-radius: 17px 0 0 17px;
}
.pagination .direction.prev {
background-image: url(../images/ico-paging-prev@2x.png);
}
.pagination .direction.next {
background-image: url(../images/ico-paging-next@2x.png);
}
.pagination .direction.last {
background-image: url(../images/ico-paging-last@2x.png);
border-radius: 0 17px 17px 0;
}
.datepicker {
position: relative;
display: inline-block;
vertical-align: middle;
}
.datepicker .form-datepicker {
padding-right: 45px;
}
.datepicker .btn {
position: absolute;
right: 0;
top: 0;
bottom: 0;
padding: 0 10px;
}
@media (max-width: 767.98px) {
.datepicker {
display: block;
}
.datepicker .form-datepicker {
width: 100% !important;
}
}
#inseq-datepicker {
position: absolute;
width: 250px;
padding: 12px;
border: 1px solid #e6e6e6;
font-size: 13px;
background-color: #fff;
box-shadow: 0px 8px 15px rgba(66, 73, 80, 0.15);
z-index: 1500;
}
#inseq-datepicker caption {
height: 0;
font-size: 0;
line-height: 0;
overflow: hidden;
}
#inseq-datepicker table {
table-layout: auto;
margin-top: 0;
width: 100%;
text-align: center;
border: 0px solid #000;
color: #333;
line-height: 2;
}
#inseq-datepicker table a {
line-height: 2;
}
#inseq-datepicker table th {
height: auto;
background: none;
padding: 0 0 0.5em;
border: 0;
margin: 0;
text-align: center;
line-height: 20px;
font-weight: 500;
}
#inseq-datepicker table td {
padding: 0 !important;
margin: 0;
height: 28px;
text-align: center;
border: 0;
line-height: 1;
}
#inseq-datepicker table tbody td {
height: 28px;
color: #767676;
}
#inseq-datepicker table tbody td a {
width: 28px;
height: 28px;
line-height: 28px;
display: block;
color: #000;
text-decoration: none;
}
#inseq-datepicker table tbody td a.today {
border-radius: 50%;
color: #fff !important;
background-color: #1f76eb;
font-weight: bold;
}
#inseq-datepicker #tableCalendarTitle {
margin-bottom: 8px;
}
#inseq-datepicker #tableCalendarTitle td {
font-size: 16px;
}
#inseq-datepicker #tableCalendarTitle td a {
font-size: inherit;
}
#inseq-datepicker #tableMonthTitle td a {
font-size: 16px;
}
#inseq-datepicker #tableYearTitle {
margin-bottom: 5px;
}
#inseq-datepicker #tableYearTitle td {
font-size: 16px;
}
#inseq-datepicker #tableCalendarTitle a,
#inseq-datepicker #tableYear a,
#inseq-datepicker #tableMonthTitle a,
#inseq-datepicker #tableMonth a {
color: #000;
}
#inseq-datepicker #tableCalendar th:first-child,
#inseq-datepicker #tableCalendar td:first-child {
color: #cf2121;
}
#inseq-datepicker #tableCalendar th:first-child a,
#inseq-datepicker #tableCalendar td:first-child a {
color: inherit;
}
#inseq-datepicker #tableCalendar th:last-child,
#inseq-datepicker #tableCalendar td:last-child {
color: #0072cf;
}
#inseq-datepicker #tableCalendar th:last-child a,
#inseq-datepicker #tableCalendar td:last-child a {
color: inherit;
}
#inseq-datepicker .prev,
#inseq-datepicker .next {
width: 21px;
height: 21px;
border-radius: 11px;
line-height: 21px;
border: 0;
padding: 0;
background: url(../../_common/images/ico-chevron-left-gray@2x.png) no-repeat;
background-size: 20px auto;
text-indent: -9999px;
text-align: left;
overflow: hidden;
}
#inseq-datepicker .prev {
float: left;
margin-left: 30px;
background-position: right center;
}
#inseq-datepicker .next {
float: right;
margin-right: 30px;
background-image: url(../../_common/images/ico-chevron-right-gray@2x.png);
background-position: left center;
}
#inseq-datepicker .btn-cal-close {
position: absolute;
top: 0;
right: 0;
padding: 5px;
}
#inseq-datepicker .btn-cal-close a {
display: block;
width: 20px;
height: 20px;
color: transparent;
background: url(../../_common/images/ico-times-gray@2x.png) no-repeat center center;
background-size: 20px auto;
}
@media (max-width: 767.98px) {
#inseq-datepicker {
left: 50% !important;
margin-left: -125px !important;
}
}
.image {
text-align: center;
}
.image img {
max-width: 100%;
vertical-align: top;
}
@media (max-width: 767.98px) {
.infographic img,
.infographic-lg img {
width: 100%;
}
}
.infographic .image {
border: 1px solid #e3e3e3;
border-radius: 20px;
padding: 20px;
}
.infographic .image img {
border-radius: 10px;
}
@media (min-width: 768px) {
.infographic figcaption {
padding: 10px;
}
}
@media (max-width: 767.98px) {
.infographic figcaption {
margin-top: 10px;
}
}
.infographic-lg {
text-align: center;
}
@media (min-width: 768px) {
.infographic-lg img {
vertical-align: top;
}
.infographic-lg .image {
border: 1px solid #e3e3e3;
border-radius: 20px;
padding: 30px;
}
.infographic-lg .image img {
border-radius: 15px;
}
.infographic-lg.fit .image {
display: inline-block;
}
}
@media (min-width: 768px) and (max-width: 1024.98px) {
.infographic-lg .image {
padding: 20px;
}
}
@media (max-width: 1024.98px) {
.image-scroll {
width: 100%;
overflow-x: scroll;
overflow-y: auto;
}
.image-scroll img {
min-width: 600px;
}
}
.ir {
position: relative;
}
.ir .img-wrap {
background: #fff;
}
.ir .ir-desc {
position: absolute;
top: 0;
left: -9999px;
overflow: hidden;
width: 1px;
height: 1px;
}
/* 처리절차 */
.step:not(.step-detail) {
text-align: center;
}
.step > ul > li,
.step ol > li {
position: relative;
border: 1px solid #e3e3e3;
border-radius: 10px;
}
.step > ul > li:before, .step > ul > li:after,
.step ol > li:before,
.step ol > li:after {
content: "";
position: absolute;
top: 50%;
background-color: #e3e3e3;
width: 4px;
height: 17px;
right: -24px;
border-radius: 1px;
}
.step > ul > li:before,
.step ol > li:before {
margin-top: -15px;
transform: rotate(-45deg);
}
.step > ul > li:after,
.step ol > li:after {
margin-top: -5px;
transform: rotate(45deg);
}
.step .inner {
display: block;
}
.step .inner .number {
color: #1f76eb;
font-weight: bold;
}
.step .inner > .number {
position: relative;
display: block;
margin: 8px auto 0;
width: 28px;
border-radius: 3px 10px 3px 10px;
line-height: 25px;
background-color: #428cf0;
color: #fff;
}
.step .inner > .number:before {
content: "";
position: absolute;
height: 1px;
top: -9px;
left: 0;
right: 0;
background-color: #428cf0;
}
.step .title,
.step .content {
display: block;
}
.step .title {
padding: 9px 20px;
border-bottom: 1px solid #e3e3e3;
background-color: #f9f9f9;
border-radius: 10px 10px 0 0;
}
.step .content {
padding: 15px 20px;
}
@media (min-width: 768px) {
.step.step-drop {
overflow: hidden;
}
.step.step-drop > ul,
.step.step-drop ol {
display: flex;
flex-wrap: wrap;
margin: -15px 8px -15px -20px;
}
.step.step-drop > ul > li,
.step.step-drop ol > li {
flex: 0 0 auto;
width: calc(25% - 40px);
margin: 15px 20px;
}
.step.step-drop > ul > li:last-child:before, .step.step-drop > ul > li:last-child:after,
.step.step-drop ol > li:last-child:before,
.step.step-drop ol > li:last-child:after {
display: none;
}
.step.step-drop.step-detail > ul > li,
.step.step-drop.step-detail ol > li {
width: calc(50% - 40px);
}
.step:not(.step-drop) {
overflow: hidden;
}
.step:not(.step-drop) > ul,
.step:not(.step-drop) ol {
display: table;
table-layout: fixed;
border-collapse: separate;
margin: -40px;
width: calc(100% + 80px);
border-spacing: 40px;
}
.step:not(.step-drop) > ul > li,
.step:not(.step-drop) ol > li {
display: table-cell;
vertical-align: top;
}
}
@media (max-width: 767.98px) {
.step.step-sm-col2 > ul,
.step.step-sm-col2 ol {
display: flex;
flex-wrap: wrap;
margin: -15px 8px -15px -20px;
}
.step.step-sm-col2 > ul > li,
.step.step-sm-col2 ol > li {
flex: 0 0 auto;
width: calc(50% - 40px);
margin: 15px 20px;
}
.step.step-sm-col2 > ul > li:last-child:before, .step.step-sm-col2 > ul > li:last-child:after,
.step.step-sm-col2 ol > li:last-child:before,
.step.step-sm-col2 ol > li:last-child:after {
display: none;
}
.step:not(.step-sm-col2) > ul,
.step:not(.step-sm-col2) ol {
display: block;
margin: 0 !important;
width: auto !important;
}
.step:not(.step-sm-col2) > ul > li,
.step:not(.step-sm-col2) ol > li {
display: block;
padding: 0;
}
.step:not(.step-sm-col2) > ul > li:first-child:before, .step:not(.step-sm-col2) > ul > li:first-child:after,
.step:not(.step-sm-col2) ol > li:first-child:before,
.step:not(.step-sm-col2) ol > li:first-child:after {
display: none;
}
.step:not(.step-sm-col2) > ul > li + li,
.step:not(.step-sm-col2) ol > li + li {
margin-top: 50px;
}
.step:not(.step-sm-col2) > ul > li + li:before, .step:not(.step-sm-col2) > ul > li + li:after,
.step:not(.step-sm-col2) ol > li + li:before,
.step:not(.step-sm-col2) ol > li + li:after {
top: -35px;
left: 50% !important;
margin-top: 0 !important;
}
.step:not(.step-sm-col2) > ul > li + li:before,
.step:not(.step-sm-col2) ol > li + li:before {
margin-left: -7px;
}
.step:not(.step-sm-col2) > ul > li + li:after,
.step:not(.step-sm-col2) ol > li + li:after {
margin-right: -7px;
left: auto !important;
right: 50% !important;
}
.step:not(.step-sm-col2) .content {
padding: 15px;
}
}
.step-gap .gap-content {
position: relative;
font-size: 13px;
line-height: 1.2;
background-color: #f3f3f3;
border-radius: 3px;
padding: 5px 8px;
}
.step-gap .gap-content:after {
content: "";
position: absolute;
top: -6px;
left: 50%;
margin-left: -6px;
display: block;
width: 0px;
height: 0px;
border-bottom: 6px solid #f3f3f3;
border-top: 0;
border-right: 6px solid transparent;
border-left: 6px solid transparent;
}
@media (min-width: 768px) {
.step-gap > ul > li:before, .step-gap > ul > li:after,
.step-gap ol > li:before,
.step-gap ol > li:after {
top: 38%;
right: -34px;
}
.step-gap .gap-content {
position: absolute;
z-index: 1;
top: 38%;
right: -31px;
margin-top: 20px;
text-align: center;
transform: translateX(50%);
}
.step-gap.step-drop {
overflow: hidden;
}
.step-gap.step-drop > ul,
.step-gap.step-drop ol {
margin-right: 30px;
margin-left: -30px;
}
.step-gap.step-drop > ul > li,
.step-gap.step-drop ol > li {
width: calc(25% - 60px);
margin: 15px 30px;
}
.step-gap.step-drop.step-detail > ul > li,
.step-gap.step-drop.step-detail ol > li {
width: calc(50% - 60px);
}
.step-gap:not(.step-drop) {
overflow: hidden;
}
.step-gap:not(.step-drop) > ul,
.step-gap:not(.step-drop) ol {
width: calc(100% + 120px);
margin: -60px;
border-spacing: 60px;
}
}
@media (max-width: 767.98px) {
.step-gap .gap-content {
text-align: center;
position: absolute;
left: 50% !important;
transform: translateY(150%);
bottom: 0;
margin-left: 20px;
white-space: nowrap;
}
.step-gap .gap-content:after {
top: 50%;
left: -6px;
margin-top: -6px;
border-bottom: 6px solid transparent;
border-top: 6px solid transparent;
border-right: 6px solid #f3f3f3;
}
}
/* 게시판 */
/* 광고 배너 영역 */
.ad-banner {
margin-bottom: 30px;
border: 1px solid #e3e3e3;
text-align: center;
background-color: #f9f9f9;
}
.ad-banner .ad-banner-link {
display: flex;
align-items: center;
justify-content: center;
}
.ad-banner img {
vertical-align: middle;
}
@media (max-width: 767.98px) {
.ad-banner {
padding: 5px 0px;
}
}
/* 공지사항 박스 */
.box-notice dd {
font-size: 15px;
}
@media (min-width: 1025px) {
.box-notice {
margin-bottom: 20px;
padding: 18px 19px;
}
.box-notice dt {
margin-bottom: 7px;
padding-left: 2px;
}
}
@media (max-width: 1024.98px) {
.box-notice {
margin-bottom: 23px;
padding: 13px 15px 11px;
}
.box-notice dt {
margin-bottom: 6px;
}
}
/* 검색폼 */
.box-search {
background-color: #f9f9f9;
}
@media (min-width: 1025px) {
.box-search {
padding: 19px;
}
}
@media (max-width: 1024.98px) {
.box-search {
padding: 14px;
}
}
@media (max-width: 1024.98px) {
.form-row-datepicker .datepicker {
display: block;
}
.form-row-datepicker .form-datepicker {
width: 100% !important;
}
}
.search-form .datepicker .form-datepicker {
padding-right: 40px;
}
.search-form .datepicker .btn {
padding: 0 6px;
}
.search-form .btn-area .btn .ico {
margin-top: 1px;
}
.search-form table th {
padding: 10px 18px;
font-weight: 400;
text-align: left;
white-space: nowrap;
}
.search-form table th label {
max-width: 100%;
white-space: nowrap;
max-height: 22px;
line-height: 22px;
text-overflow: ellipsis;
overflow: hidden;
display: block;
max-width: 56px;
}
.search-form table td {
padding: 5px 0;
}
@media (min-width: 1025px) {
.search-form .search-form-group {
display: flex;
justify-content: center;
}
.search-form .form-row + .form-row {
margin-left: 25px;
}
.search-form .form-row-datepicker {
flex-wrap: nowrap;
}
.search-form .form-row-datepicker .text-item {
padding: 0 3px;
}
.search-form .form-row-keyword {
flex-wrap: nowrap;
}
.search-form .form-row-keyword .input-item + .input-item {
margin-left: 5px;
}
.search-form .form-row-toggle .input-item {
width: 255px;
text-align: right;
}
.search-form .btn-area .btn {
min-width: 74px;
padding: 0 10px;
}
.search-form .btn-area .btn + .btn {
margin-left: 1px;
}
.search-form table {
width: calc(100% + 35px);
margin: -5px -17px 0 -18px;
}
}
@media (max-width: 1024.98px) {
.search-form .form-control {
width: 100% !important;
}
.search-form .form-row + .form-row {
margin-top: 10px;
}
.search-form .form-row .input-item.md-full {
margin-top: 0 !important;
}
.search-form .form-row .input-item.md-full + .md-full {
margin-top: 10px !important;
}
.search-form .form-row .input-item.md-full.mt-md-1 {
margin-top: 5px !important;
}
.search-form .form-row-toggle .btn {
width: 100%;
}
.search-form .btn-area {
display: flex;
}
.search-form .btn-area .btn {
flex: 1;
}
.search-form table {
display: inline-block;
}
.search-form table tbody {
display: block;
}
.search-form table tr {
display: block;
}
.search-form table th,
.search-form table td {
display: block;
float: left;
}
.search-form table th {
width: 75px;
line-height: 30px;
padding: 14px 18px 14px 0;
}
.search-form table td {
width: calc(100% - 75px);
}
}
.sns-list-sm {
display: flex;
float: right;
margin-left: auto;
}
.sns-list-sm li {
margin-left: 6px;
}
.sns-list-sm li a {
display: block;
}
.sns-list-sm img {
height: 20px;
vertical-align: top;
}
/* 약관 동의 */
.terms-area .box-terms {
max-height: 108px;
padding: 18px 19px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
.terms-area .box-terms .list2 > li:before {
height: 1px;
background-color: #333;
}
.terms-area .box-terms .list2 > li + li {
margin-top: 2px;
}
.terms-area .box-terms .list3 > li:before {
background-color: #333;
}
.terms-area .box-terms .text-underline {
text-decoration: underline;
}
.terms-area .terms-agree {
overflow: visible;
}
.terms-area .ckeck-item-custom {
position: relative;
padding-right: 30px;
}
.terms-area input[type=checkbox] + label {
vertical-align: top;
}
.terms-area input[type=checkbox] + label:before {
position: absolute;
bottom: 0;
right: -30px;
margin: 0;
}
@media (max-width: 1024.98px) {
.terms-area .terms-agree > .inner {
flex-direction: column;
}
.terms-area .terms-agree > .inner > .col-item {
margin-top: 0;
}
}
@media (max-width: 767.98px) {
.terms-area .terms-agree > .inner > .col-item {
margin-top: 10px;
}
}
/* 게시판 상단 */
.list-info {
margin: 28px 0 8px;
}
@media (min-width: 1025px) {
.list-info {
overflow: hidden;
}
.list-info:after {
display: block;
clear: both;
content: "";
}
.list-info .left {
float: left;
}
.list-info .right {
float: right;
}
}
@media (max-width: 1024.98px) {
.list-info {
margin: 46px 0 13px;
}
.list-info .list_select {
float: right;
margin-top: -21px;
}
}
.list-info .list_select li {
float: left;
position: relative;
}
.list-info .list_select li a {
font-size: 15px;
color: #333333;
}
.list-info .list_select li:first-child {
padding-right: 12px;
margin-right: 10px;
}
.list-info .list_select li:first-child::before {
width: 2px;
height: 14px;
background-color: #dadada;
content: " ";
position: absolute;
right: 0;
top: 3px;
}
.list-info .list_select .list_s_on a {
font-weight: bold;
color: #2768bf;
}
.list-info .list_select:after {
display: block;
content: "";
clear: both;
}
.content-share {
display: flex;
justify-content: flex-end;
margin-bottom: 10px;
}
.content-share .btn {
height: 29px;
margin-left: 5px;
border: 1px solid #e3e3e3;
border-radius: 3px;
}
.content-share .sns-list {
display: flex;
}
.content-share .btn-like {
padding: 0 10px;
border-color: #004a85;
color: #fff;
background-color: #004a85;
}
.content-share .btn-like .ico {
margin-right: 5px;
}
.content-share .btn-share {
padding: 0 9px 0 5px;
}
.content-share .btn-print {
min-width: 38px;
padding: 0 5px;
}
.content-share .btn-print .ico {
margin-right: 0;
}
/* 게시판 게시물이 없을 경우 */
.nodata-area {
padding: 105px 0 108px;
border-top: 1px solid #e3e3e3;
border-bottom: 1px solid #e3e3e3;
border-radius: 0 !important;
color: rgba(0, 0, 0, 0.66) !important;
text-align: center !important;
width: 100% !important;
}
.nodata-area .ico {
margin-right: 4px;
}
@media (max-width: 1024.98px) {
.nodata-area {
padding: 55px 0 58px;
}
}
/* 게시판 일반형 목록 */
.ico-new {
display: inline-block;
width: 14px;
height: 13px;
line-height: 13px;
border-radius: 2px;
background-color: #ea401e;
color: #fff;
font-size: 11px;
text-align: center;
font-style: normal;
font-weight: normal;
}
.table-list table {
border-top: 1px solid #666;
border-bottom-color: #aaa;
}
@media (max-width: 1024.98px) {
.table-list table {
border: 0px;
}
.table-list table tbody .cell-first {
text-align: left;
display: inline-block;
}
.table-list table tbody .cell-left {
display: inline-block;
}
.table-list table tbody .cell-left:before {
content: "";
display: inline-block;
width: 1px;
height: 12px;
margin: -2px 10px 0 10px;
background-color: #aaa;
vertical-align: middle;
}
.table-list table tbody .cell-right {
display: inline-block;
}
.table-list table tbody .cell-right:after {
content: "";
display: inline-block;
width: 1px;
height: 12px;
margin: -2px 10px 0 10px;
background-color: #aaa;
vertical-align: middle;
}
.table-list table tbody .cell-none {
display: none;
}
.table-list table tbody .cell-block {
display: block;
margin-bottom: 7px;
color: #333;
width: 100%;
}
.table-list table tbody .cell-default:after {
content: "";
display: inline-block;
width: 1px;
height: 12px;
margin: -2px 10px 0 10px;
background-color: #aaa;
vertical-align: middle;
}
}
.table-list table th,
.table-list table td {
padding: 10px;
border-top-color: #e6e6e6;
border-right-color: #e6e6e6;
}
.table-list table thead th {
color: #333;
background-color: #f3f3f3;
}
.table-list table .cell-subject {
text-align: left;
}
.table-list table .cell-subject a {
display: inline-block;
position: relative;
}
.table-list table .cell-subject a:hover, .table-list table .cell-subject a:focus {
text-decoration: underline;
}
.table-list table .no-data {
line-height: 60px;
text-align: center;
}
.table-list table .label-notice {
display: flex;
align-items: center;
justify-content: center;
width: 37px;
height: 21px;
border-radius: 10px;
color: #fff;
font-size: 12px;
background-color: #428cf0;
}
.table-list table .ico-reply-gray {
margin: -8px 0 0 4px;
}
.table-list table .ico-lock-gray {
margin: 0 1px;
}
@media (min-width: 1025px) {
.table-list table .cell-subject {
white-space: nowrap;
}
.table-list table .cell-subject a {
max-width: 100%;
white-space: nowrap;
max-height: 22px;
line-height: 22px;
text-overflow: ellipsis;
overflow: hidden;
padding-right: 43px;
vertical-align: middle;
}
.table-list table .ico-new {
position: absolute;
top: 50%;
right: 29px;
transform: translateY(-50%);
}
.table-list table .comment-number {
position: absolute;
top: 50%;
right: 18px;
transform: translateY(-50%);
}
.table-list table .comment-number + .ico-new {
right: 0;
}
.table-list table .icon-addon + a {
max-width: calc(100% - 21px);
}
}
@media (max-width: 1024.98px) {
.table-list table {
border-top: 0;
}
.table-list table table {
width: 100%;
margin-right: 0;
border-top: 0;
border-bottom: 0;
}
.table-list table colgroup,
.table-list table thead {
display: none;
}
.table-list table tbody {
display: block;
text-align: left !important;
}
.table-list table tbody tr {
display: block;
border: 1px solid #e3e3e3;
border-radius: 10px;
padding: 10px 13px 11px;
}
.table-list table tbody tr + tr {
margin-top: 15px;
}
.table-list table tbody td {
display: inline-block;
vertical-align: middle;
padding: 0 !important;
border: 0 !important;
height: auto !important;
color: #666;
}
.table-list table tbody .cell-no,
.table-list table tbody .cell-file {
display: none;
}
.table-list table tbody .cell-subject {
display: block;
margin-bottom: 7px;
padding-left: 0;
color: #333;
}
.table-list table tbody .cell-subject:before {
display: none;
}
.table-list table tbody .cell-subject a:hover, .table-list table tbody .cell-subject a:focus {
text-decoration: underline;
}
.table-list table tbody .ico-new {
margin: -3px 0 0 5px;
vertical-align: middle;
}
.table-list table tbody .comment-number {
margin-left: 5px;
}
.table-list table tbody .cell-date:before,
.table-list table tbody .cell-hit:before {
content: "";
display: inline-block;
width: 1px;
height: 12px;
margin: -2px 10px 0 10px;
background-color: #aaa;
vertical-align: middle;
}
.table-list table tbody .icon-addon {
display: inline-block;
width: 18px;
margin-top: -2px;
vertical-align: top;
}
.table-list table tbody .icon-addon + a {
display: inline-block;
max-width: calc(100% - 22px);
}
.table-list table tbody .no-data {
display: block;
line-height: 77px;
}
.table-list table tbody .no-data .ico {
margin-right: 2px;
}
}
/* 게시판 일반형 상세 */
.article-view {
border-top: 1px solid #666;
}
.article-view .table {
border-top: 0;
}
.article-view .table table {
border-top: 0;
border-bottom-color: #aaa;
}
.article-view .table th,
.article-view .table td {
border-right-color: #e3e3e3;
}
.article-view .file-list li {
position: relative;
padding-left: 24px;
}
.article-view .file-list .ico {
position: absolute;
top: 0;
left: 0;
}
.article-view .file-list .btn {
margin: -2px 0 0 5px;
}
.article-view .file-attatch-desc {
margin-left: -24px;
padding-left: 100px;
text-indent: -100px;
}
@media (min-width: 1025px) {
.article-view .table th {
background-color: #f9f9f9;
}
}
@media (max-width: 1024.98px) {
.article-view table > tbody > tr:first-child > th + td + th {
border-top: 1px solid #eee;
}
.article-view .file-attatch-desc {
padding-left: 0;
text-indent: 0;
}
.article-view .file-attatch-desc .title,
.article-view .file-attatch-desc .content {
display: block;
}
}
.article-header .info-area {
padding: 14px 21px;
border-bottom: 1px solid #e3e3e3;
background-color: #f9f9f9;
position: relative;
}
.article-header .article-subject {
font-size: 18px;
}
.article-header .article-subject + .article-info {
margin-bottom: -6px;
}
.article-header .article-info {
margin-top: 14px;
}
.article-header a:focus {
border: 1px solid #000;
}
.article-header .download_btn {
display: inline-block;
border: 1px solid #959595;
padding: 5px 10px;
border-radius: 3px;
position: absolute;
right: 21px;
top: 50%;
margin-top: -17px;
}
@media (max-width: 1024.98px) {
.article-header .gallery-subject {
padding-right: 45px;
}
}
.article-header .info-list {
display: flex;
flex-wrap: wrap;
padding: 8px 19px 7px;
border-bottom: 1px solid #e3e3e3;
color: #666;
font-size: 14px;
}
.article-header .info-list li {
margin-right: 55px;
padding: 3px 0;
}
.article-header .info-list .title {
color: #333;
}
.article-header .info-list .title:after {
content: "";
display: inline-block;
width: 1px;
height: 14px;
margin: -2px 10px 0;
vertical-align: middle;
background-color: #e3e3e3;
}
.article-header .file-list {
padding: 10px 18px;
border-bottom: 1px solid #e3e3e3;
}
.article-header .file-list li {
position: relative;
padding-left: 24px;
font-size: 14px;
line-height: 22px;
}
.article-header .file-list li .ico {
position: absolute;
top: 0;
left: 0;
}
.article-header .file-list li a:not(.btn):hover, .article-header .file-list li a:not(.btn):focus {
text-decoration: underline;
}
.article-header .file-list li + li {
margin-top: 5px;
}
.article-header .file-shortcut {
padding: 0;
}
.article-header .file-shortcut li {
padding: 10px 19px 7px 43px;
}
.article-header .file-shortcut li .ico {
top: 10px;
left: 19px;
}
.article-header .file-shortcut li .btn {
margin: -2px 0 0 5px;
}
.article-header .file-shortcut li + li {
margin-top: 0;
border-top: 1px solid #e3e3e3;
}
.article-body {
border-bottom: 1px solid #aaa;
line-height: 24px;
}
.article-body .video-content {
padding: 40px 0;
}
.article-body .faq-content {
margin-top: -1px;
margin-bottom: -1px;
padding-top: 40px;
border-top: 1px solid #aaa;
}
.article-body + .article-tag {
margin-top: -1px;
}
@media (max-width: 1024.98px) {
.article-body .video-content {
padding: 30px 0;
}
}
.article-conetnt {
padding: 15px 20px 17px;
}
.article-nav {
display: table;
width: 100%;
table-layout: fixed;
margin-top: 40px;
border-collapse: collapse;
border-top: 1px solid #e3e3e3;
}
.article-nav li {
display: table-row;
}
.article-nav li > * {
display: table-cell;
border-bottom: 1px solid #e3e3e3;
padding: 14px 10px;
}
.article-nav li span {
width: 80px;
color: #666;
vertical-align: middle;
}
.article-nav li span .ico {
margin: -2px 0 0 5px;
}
.article-nav li a {
max-width: 100%;
white-space: nowrap;
max-height: 21px;
line-height: 21px;
text-overflow: ellipsis;
overflow: hidden;
}
.article-nav li a:hover, .article-nav li a:focus {
text-decoration: underline;
}
.article-nav + .article-tag {
margin-top: -1px;
}
.comment-area {
margin-top: 40px;
}
.comment-area .comment-info {
padding: 6px 15px;
}
.comment-area .comment-info .title {
font-size: 16px;
}
.comment-area .comment-info .total {
color: #1f76eb;
}
.comment-area .comment-list {
border-top: 1px solid #666;
}
.comment-area .comment-list li {
position: relative;
padding: 12px 44px 10px 15px;
border-bottom: 1px solid #e3e3e3;
line-height: 24px;
}
.comment-area .comment-list .writer,
.comment-area .comment-list .time {
color: #666;
}
.comment-area .comment-list .time {
margin-top: 4px;
}
.comment-area .comment-list .btn-delete {
position: absolute;
top: 41px;
right: 11px;
min-width: 21px;
height: 21px;
padding: 0;
border-color: #aaa;
}
.comment-area .comment-list .btn-delete .ico {
margin-right: 0;
}
.box-comment {
margin-top: 30px;
padding-top: 0;
overflow: hidden;
}
.box-comment legend {
padding: 9px 0 8px;
font-size: 16px;
}
.box-comment .comment-form {
margin: 0 -19px -15px;
padding: 19px 21px;
background-color: #f9f9f9;
}
.box-comment .form-control {
padding-top: 9px;
padding-bottom: 9px;
border-radius: 3px;
}
.box-comment .btn-md {
height: 62px;
}
/* 게시판 일반형 등록 */
.table-form .form-row .text-item {
padding: 0 9.5px;
}
.file-ctrl .item {
display: flex;
}
.file-ctrl .item + .item {
margin-top: 5px;
}
.file-ctrl .btn-delete {
min-width: 21px;
height: 21px;
padding: 0;
border-color: #aaa;
}
.file-ctrl .btn-delete .ico {
margin-right: 0;
}
.file-attatch-item + .file-attatch-item {
padding-top: 10px;
}
.file-attatch-item .col-item {
flex: 1 1 50%;
}
.file-attatch-item .col-item .form-control {
width: 100%;
}
.file-attatch-item .col-item-fit {
padding-left: 5px;
}
.file-attatch-item .form-file {
display: none;
}
.file-attatch-item .file-desc .btn {
min-width: 40px;
padding: 0;
}
.file-attatch-item .file-desc .btn .ico {
margin-right: 0;
}
@media (min-width: 1025px) {
.file-attatch-item {
display: flex;
}
.file-attatch-item > div {
flex: 1;
}
.file-attatch-item .file-desc {
padding-left: 20px;
line-height: 1;
}
}
@media (max-width: 1024.98px) {
.file-attatch-item + .file-attatch-item {
margin-top: 20px;
padding-top: 10px;
border-top: 1px solid #eee;
}
.file-attatch-item .file-desc {
display: block;
margin-top: 10px;
margin-bottom: -10px;
}
.file-attatch-item:last-child .file-desc {
margin-bottom: 0;
}
}
/* 게시판 답글형 상세 */
.reply-content {
padding: 14px 20px 27px;
border-top: 1px solid #e3e3e3;
background-color: #f9f9f9;
}
.reply-content .title {
font-weight: 700;
}
.reply-content .content {
margin: 12px 0 0 15px;
}
/* 게시판 요약형 목록 */
.article-info {
display: flex;
align-items: center;
font-size: 14px;
}
.article-info li .ico {
margin: -2px 1px 0 0;
}
.article-info li + li:before {
content: "";
display: inline-block;
width: 1px;
height: 14px;
margin: -2px 10px 0;
vertical-align: middle;
background-color: #e3e3e3;
}
.article-tag {
display: flex;
align-items: center;
height: 41px;
padding: 0 13px;
border-top: 1px solid #e3e3e3;
}
.article-tag .title {
width: 40px;
height: 20px;
margin-right: 10px;
padding-left: 7px;
color: #fff;
font-size: 13px;
line-height: 20px;
background: url(../../_common/images/bg-tag@2x.png) no-repeat 0 50%;
background-size: auto 20px;
}
.article-tag .list {
color: #666;
font-size: 14px;
}
.article-tag .list a {
margin-right: 6px;
}
.article-tag .list a:before {
content: "#";
}
.article-tag .list a:hover, .article-tag .list a:focus {
text-decoration: underline;
}
.summary-list .summary-header {
display: flex;
align-items: center;
justify-content: space-between;
height: 46px;
padding: 0 11px;
border-bottom: 1px solid #e3e3e3;
background-color: #f3f3f3;
}
.summary-list .summary-header .right {
margin-left: auto;
}
.summary-list .category-label {
display: flex;
align-items: center;
justify-content: center;
height: 25px;
padding: 0 10px;
color: #fff;
font-size: 14px;
}
.summary-list .article-info {
margin-right: 7px;
}
.summary-list .content-area a {
display: block;
}
.summary-list .content-area a:hover .subject,
.summary-list .content-area a:hover .content, .summary-list .content-area a:focus .subject,
.summary-list .content-area a:focus .content {
text-decoration: underline;
}
.summary-list .content-area .subject {
display: inline-block;
position: relative;
padding-right: 20px;
max-width: 100%;
white-space: nowrap;
max-height: 28px;
line-height: 28px;
text-overflow: ellipsis;
overflow: hidden;
font-size: 18px;
}
.summary-list .content-area .subject .ico-new {
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
}
.summary-list .content-area .content {
display: block;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
white-space: normal;
max-height: 72px;
line-height: 24px;
text-overflow: ellipsis;
overflow: hidden;
margin-top: 5px;
}
.summary-list:not(.thumbnail-type) > li {
border-top: 1px solid #666;
border-bottom: 1px solid #aaa;
}
.summary-list:not(.thumbnail-type) > li + li {
margin-top: 30px;
}
.summary-list:not(.thumbnail-type) .content-area {
padding: 15px 11px 20px;
}
.summary-list.thumbnail-type {
border-top: 1px solid #666;
border-bottom: 1px solid #aaa;
}
.summary-list.thumbnail-type > li {
position: relative;
height: 254px;
padding: 30px 30px 30px 268px;
}
.summary-list.thumbnail-type > li + li {
border-top: 1px solid #e3e3e3;
}
.summary-list.thumbnail-type .thumb {
display: block;
position: absolute;
top: 30px;
bottom: 30px;
left: 0;
width: 246px;
margin-right: 22px;
border-radius: 10px;
overflow: hidden;
background-color: #f3f3f3;
}
.summary-list.thumbnail-type .thumb:before {
content: "";
position: absolute;
top: calc(50% - 3px);
left: calc(50% + 4px);
width: 120px;
height: 70px;
transform: translate3d(-50%, -50%, 0);
background: url(../../_common/images/bg-noimage@2x.png) no-repeat 50% 50%;
background-size: auto 70px;
}
.summary-list.thumbnail-type .thumb img {
position: absolute;
top: 0;
left: 0;
max-width: none;
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
z-index: 10;
}
.summary-list.thumbnail-type .content-area {
position: relative;
height: 100%;
}
.summary-list.thumbnail-type .content-area .content {
display: -webkit-box;
-webkit-line-clamp: 6;
-webkit-box-orient: vertical;
white-space: normal;
max-height: 160px;
line-height: 24px;
text-overflow: ellipsis;
overflow: hidden;
}
.summary-list.thumbnail-type .article-info {
position: absolute;
bottom: 3px;
left: 4px;
}
.summary-list.thumbnail-type .article-info li + li:before {
margin-right: 15px;
margin-left: 15px;
}
@media (min-width: 1025px) {
.summary-list:not(.thumbnail-type) > li + li {
margin-top: 40px;
}
.summary-list:not(.thumbnail-type) .content-area .subject {
max-width: 898px;
}
.summary-list.thumbnail-type .content-area .subject {
max-width: 622px;
}
}
@media (max-width: 767.98px) {
.summary-list .category-label span {
max-width: 100%;
white-space: nowrap;
max-height: 19px;
line-height: 19px;
text-overflow: ellipsis;
overflow: hidden;
display: block;
max-width: 120px;
}
.summary-list.thumbnail-type > li {
height: auto;
padding: 25px 0;
}
.summary-list.thumbnail-type .thumb {
position: relative;
top: auto;
bottom: auto;
width: 100%;
height: auto;
margin-right: 0;
padding-top: 78.86178%;
}
.summary-list.thumbnail-type .content-area {
padding-top: 15px;
}
.summary-list.thumbnail-type .article-info {
position: static;
margin-top: 12px;
}
}
/* 게시판 갤러리형, 동영상형 목록 */
.thumbnail-list {
display: flex;
flex-wrap: wrap;
margin: -15px;
/* 게시판 갤러리형 라벨추가 */
}
.thumbnail-list > li {
width: calc(33.33333% - 30px);
margin: 15px;
padding: 19px 19px 16px;
border: 1px solid #e3e3e3;
border-radius: 20px;
}
.thumbnail-list > li > a {
display: block;
}
.thumbnail-list > li > a:hover .subject, .thumbnail-list > li > a:focus .subject {
text-decoration: underline;
}
.thumbnail-list .thumb {
position: relative;
border-radius: 10px;
overflow: hidden;
background-color: #f3f3f3;
}
.thumbnail-list .thumb-gallery {
padding-top: 78.86178%;
}
.thumbnail-list .thumb-video {
padding-top: 70.3252%;
}
.thumbnail-list .thumb-video .icon-wrap {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 20;
}
.thumbnail-list .thumb-video .ico-play-black {
position: absolute;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
}
.thumbnail-list .thumb .thumb-gallery-label {
background-color: rgba(0, 0, 0, 0.7);
font-size: 12px;
color: #fff;
position: absolute;
top: 0;
left: 0;
padding: 6px 12px 9px 9px;
z-index: 50;
}
.thumbnail-list .thumb:before {
content: "";
position: absolute;
top: calc(50% - 3px);
left: calc(50% + 4px);
width: 120px;
height: 70px;
transform: translate3d(-50%, -50%, 0);
background: url(../../_common/images/bg-noimage@2x.png) no-repeat 50% 50%;
background-size: auto 70px;
}
.thumbnail-list .thumb img {
position: absolute;
top: 0;
left: 0;
max-width: none;
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
z-index: 10;
}
.thumbnail-list .thumb .title {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 29px;
padding: 0 10px;
color: #fff;
font-size: 14px;
background-color: rgba(0, 0, 0, 0.6);
z-index: 10;
}
.thumbnail-list .thumb .title span {
max-width: 100%;
white-space: nowrap;
max-height: 29px;
line-height: 29px;
text-overflow: ellipsis;
overflow: hidden;
}
.thumbnail-list .subject {
display: inline-block;
position: relative;
max-width: 100%;
white-space: nowrap;
max-height: 22px;
line-height: 22px;
text-overflow: ellipsis;
overflow: hidden;
margin-top: 7px;
padding-right: 18px;
}
.thumbnail-list .subject .subject_label {
color: #2768bf;
}
.thumbnail-list .ico-new {
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
}
.thumbnail-list .info-area {
margin-top: 3px;
}
.thumbnail-list .info-area:after {
display: block;
clear: both;
content: "";
}
.thumbnail-list .date {
float: left;
color: #666;
}
.thumbnail-list .sns-list {
display: flex;
float: right;
margin-left: auto;
}
.thumbnail-list .sns-list li {
margin-left: 6px;
}
.thumbnail-list .sns-list li a {
display: block;
}
.thumbnail-list .sns-list img {
height: 20px;
vertical-align: top;
}
.thumbnail-list .label_num {
margin-top: 5px;
}
.thumbnail-list .label_num ul li {
float: left;
border-radius: 3px;
font-size: 11px;
color: #fff;
padding: 2px 6px 3px;
margin-right: 4px;
}
.thumbnail-list .label_num ul li:last-child {
margin-right: 0;
}
.thumbnail-list .label_num ul::after {
display: block;
content: "";
clear: both;
}
.thumbnail-list .label_num ul .label_gd_num {
background-color: #3ba919;
}
.thumbnail-list .label_num ul .label_sh_num {
background-color: #00a690;
}
.thumbnail-list .label_num ul .label_rp_num {
background-color: #2888d4;
}
.thumbnail-list .download-list {
display: flex;
float: right;
margin-top: -1px;
}
.thumbnail-list .download-list li + li {
margin-left: 5px;
}
.thumbnail-list .download-list .btn-down {
width: 24px;
height: 24px;
border: 1px solid #e3e3e3;
border-radius: 50%;
}
.thumbnail-list .download-list .btn-down .ico {
margin-right: 0;
}
@media (min-width: 1025px) {
.thumbnail-list {
max-width: 1200px;
}
}
@media (max-width: 1024.98px) {
.thumbnail-list {
margin: -10px;
}
.thumbnail-list > li {
width: calc(33.33333% - 20px);
margin: 10px;
}
}
@media (max-width: 767.98px) {
.thumbnail-list > li {
width: calc(100% - 20px);
}
}
/* 게시판 갤러리형 상세 */
.gallery-content {
padding: 30px 0;
}
.gallery-content + .article-conetnt {
padding-top: 25px;
border-top: 1px solid #e3e3e3;
}
@media (max-width: 1024.98px) {
.gallery-content {
padding: 20px 0;
}
}
.gallery-slider-for {
flex-wrap: nowrap;
padding-bottom: 30px;
border-bottom: 1px solid #e3e3e3;
position: relative;
}
.gallery-slider-for .item {
vertical-align: middle;
}
.gallery-slider-for .item img {
position: static;
width: 664px;
height: auto;
/*0730 440px 에서 변경*/
margin: 0 auto;
vertical-align: top;
}
.gallery-slider-for:not(.slick-slider) {
display: flex;
overflow: hidden;
}
.gallery-slider-for:not(.slick-slider) .item {
flex: 0 0 auto;
width: 100%;
text-align: center;
}
.gallery-slider-for .slick-arrow {
position: absolute;
top: 50%;
flex: 0 0 auto;
width: 60px;
height: 60px;
text-indent: -9999px;
text-align: left;
transform: translateY(-50%);
overflow: hidden;
background-repeat: no-repeat;
background-position: 50% 50%;
z-index: 89;
}
.gallery-slider-for .slick-prev {
left: 0;
background-image: url(../images/ico-chevron-lg-left-gray.png);
}
.gallery-slider-for .slick-next {
right: 0;
background-image: url(../images/ico-chevron-lg-right-gray.png);
}
@media (max-width: 1024.98px) {
.gallery-slider-for {
padding-bottom: 20px;
}
.gallery-slider-for .slick-arrow {
width: 30px;
height: 30px;
z-index: 99;
}
}
@media (max-width: 767.98px) {
.gallery-slider-for .item {
position: relative;
width: 100%;
padding-top: 67.62048%;
}
.gallery-slider-for .item img {
position: absolute;
top: 0;
left: 0;
max-width: none;
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
}
.box-gallery {
margin-top: 30px;
padding: 19px 83px;
background-color: #f3f3f3;
}
@media (max-width: 1024.98px) {
.box-gallery {
margin-top: 20px;
padding: 15px 35px;
}
}
.gallery-slider-nav {
position: relative;
}
.gallery-slider-nav .item {
position: relative;
vertical-align: middle;
overflow: hidden;
}
.gallery-slider-nav .item img {
position: absolute;
top: 0;
left: 0;
max-width: 100%;
/* 0923 none에서 변경*/
height: 100%;
width: 100%;
border: 1px solid #e3e3e3;
border-radius: 10px;
-o-object-fit: cover;
object-fit: cover;
}
.gallery-slider-nav.slick-slider .slick-track {
margin: 0;
}
.gallery-slider-nav.slick-slider .slick-arrow {
position: absolute;
top: 50%;
flex: 0 0 auto;
width: 60px;
height: 60px;
text-indent: -9999px;
text-align: left;
transform: translateY(-50%);
overflow: hidden;
background-repeat: no-repeat;
background-position: 50% 50%;
z-index: 89;
}
.gallery-slider-nav.slick-slider .slick-prev {
left: -73px;
background-image: url(../images/ico-chevron-lg-left-gray.png);
}
.gallery-slider-nav.slick-slider .slick-next {
right: -73px;
background-image: url(../images/ico-chevron-lg-right-gray.png);
}
.gallery-slider-nav.slick-slider .slick-slide {
cursor: pointer;
}
.gallery-slider-nav.slick-slider .slick-current {
position: relative;
}
.gallery-slider-nav.slick-slider .slick-current:after {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
border: 2px solid #428cf0;
border-radius: 10px;
}
.gallery-slider-nav.slick-slider .item {
padding-top: 78.36%;
}
.gallery-slider-nav:not(.slick-slider) {
display: flex;
margin: -15px;
overflow: hidden;
}
.gallery-slider-nav:not(.slick-slider) .item {
position: relative;
flex: 0 0 auto;
width: calc(33.33333% - 30px);
margin: 15px;
padding-top: 23.23%;
}
.gallery-slider-nav:not(.slick-slider) .item img {
position: absolute;
top: 0;
left: 0;
max-width: none;
height: 100%;
width: 100%;
border: 1px solid #e3e3e3;
border-radius: 10px;
-o-object-fit: cover;
object-fit: cover;
}
@media (min-width: 1025px) {
.gallery-slider-nav.slick-slider .slick-list {
margin: -15px;
}
.gallery-slider-nav.slick-slider .slick-slide {
margin: 15px;
}
}
@media (max-width: 1024.98px) {
.gallery-slider-nav.slick-slider .slick-arrow {
width: 35px;
height: 35px;
background-size: auto 25px;
z-index: 89;
}
.gallery-slider-nav.slick-slider .slick-prev {
left: -35px;
}
.gallery-slider-nav.slick-slider .slick-next {
right: -35px;
}
.gallery-slider-nav.slick-slider .slick-list {
margin: 0 -5px;
}
.gallery-slider-nav.slick-slider .slick-slide {
margin: 0 5px;
}
.gallery-slider-nav:not(.slick-slider) {
margin: -10px;
}
.gallery-slider-nav:not(.slick-slider) .item {
width: calc(33.33333% - 10px);
margin: 5px;
}
}
/* 게시판 동영상형 상세 */
.video-content .video-desc {
padding: 0;
overflow: hidden;
}
.video-content .video-desc-inner {
max-height: 350px;
/*0804 영상 높이 수정*/
padding: 15px 19px;
font-size: 14px;
line-height: 22px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
@media (min-width: 1025px) {
.video-content {
display: flex;
}
.video-content .video-area {
flex: 1 1 50%;
}
.video-content .video-area iframe {
width: 100% !important;
height: 350px !important;
/*0804 영상 높이 수정*/
}
.video-content .video-desc {
flex: 0 0 auto;
width: 408px;
margin-left: 30px;
}
}
@media (min-width: 768px) and (max-width: 1024.98px) {
.video-content .video-area {
position: relative;
padding-top: 56.07843%;
}
.video-content .video-area iframe {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100% !important;
height: 400px !important;
}
.video-content .video-desc {
margin-top: 20px;
}
.video-content .video-desc-inner {
max-height: 200px;
/*0804 영상 높이 수정*/
}
}
@media (max-width: 767.98px) {
.video-content .video-area {
position: relative;
padding-top: 56.07843%;
}
.video-content .video-area iframe {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100% !important;
height: 205px !important;
}
.video-content .video-desc {
margin-top: 50px;
}
.video-content .video-desc-inner {
max-height: 200px;
/*0804 영상 높이 수정*/
}
}
/* 게시판 웹진형 목록 */
.webzine-list {
display: flex;
flex-wrap: wrap;
margin: -15px;
}
.webzine-list > li {
width: calc(50% - 30px);
margin: 15px;
padding: 19px;
border: 1px solid #e3e3e3;
border-radius: 20px;
background-color: #f9f9f9;
}
.webzine-list .thumb {
display: block;
position: relative;
border: 1px solid #999;
}
.webzine-list .thumb:before {
content: "";
position: absolute;
top: calc(50% - 3px);
left: calc(50% + 4px);
width: 120px;
height: 70px;
transform: translate3d(-50%, -50%, 0);
background: url(../../_common/images/bg-noimage@2x.png) no-repeat 50% 50%;
background-size: auto 70px;
}
.webzine-list .thumb img {
position: absolute;
top: 0;
left: 0;
max-width: none;
height: 100%;
width: 100%;
}
.webzine-list .info-area .subject {
display: block;
line-height: 22px;
letter-spacing: -0.5px;
}
.webzine-list .info-area .date,
.webzine-list .info-area .part,
.webzine-list .info-area .count {
display: block;
line-height: 24px;
}
.webzine-list .info-area .award {
display: block;
margin-top: 3px;
color: #f26b19;
font-size: 13px;
}
.webzine-list .info-area .ico-tropy {
margin-top: -2px;
}
.webzine-list .info-area .btn-down {
padding: 0 10px;
}
@media (min-width: 1025px) {
.webzine-list {
max-width: 950px;
}
.webzine-list > li {
position: relative;
height: 320px;
padding-left: 239px;
}
.webzine-list .thumb {
position: absolute;
top: 19px;
left: 19px;
bottom: 19px;
width: 200px;
}
.webzine-list .info-area {
position: relative;
height: 100%;
padding-top: 8px;
}
.webzine-list .info-area .date {
margin-top: 16px;
}
.webzine-list .info-area .count {
margin-top: 24px;
}
.webzine-list .btn-down {
position: absolute;
bottom: 0;
left: 0;
max-width: 185px;
}
.webzine-list .btn-down-r {
position: absolute;
bottom: 0;
left: 80px;
max-width: 185px;
}
}
@media (max-width: 1024.98px) {
.webzine-list {
margin: -10px;
}
.webzine-list > li {
width: calc(33.33333% - 20px);
margin: 10px;
}
.webzine-list .thumb {
width: 100%;
padding-top: 140%;
}
.webzine-list .info-area {
padding-top: 15px;
}
.webzine-list .info-area .date {
margin-top: 7px;
}
.webzine-list .btn-down {
margin-top: 10px;
}
.webzine-list .btn-down-r {
margin-top: 10px;
}
}
@media (max-width: 767.98px) {
.webzine-list > li {
width: 100%;
}
}
/* 게시판 아코디언형 목록 */
.toggle-list {
position: relative;
border-top: 1px solid #666;
}
.toggle-list:after {
content: "";
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 1px;
background-color: #aaa;
}
.toggle-list .toggle-title .btn {
display: flex;
justify-content: flex-start;
position: relative;
width: 100%;
min-height: 50px;
padding: 10px 71px 10px 21px;
border-bottom: 1px solid #e3e3e3;
white-space: normal;
}
.toggle-list .toggle-title .btn .toggle-info {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
.toggle-list .toggle-title .btn:before, .toggle-list .toggle-title .btn:after {
content: "";
position: absolute;
top: 50%;
right: 20px;
width: 16px;
height: 2px;
margin-top: -1px;
transition-duration: 0.3s;
background-color: #666;
}
.toggle-list .toggle-title .btn:after {
transform: rotate(90deg);
}
.toggle-list .toggle-title.on {
background-color: #dfedff;
}
.toggle-list .toggle-title.on .btn:before, .toggle-list .toggle-title.on .btn:after {
transform: rotate(180deg);
}
.toggle-list .toggle-title .title {
display: inline-flex;
font-weight: 400;
font-size: 18px;
}
.toggle-list .toggle-title .date {
flex: 0 0 auto;
padding-left: 10px;
font-size: 14px;
}
.toggle-list .toggle-content {
display: none;
border-bottom: 1px solid #e3e3e3;
}
@media (max-width: 1024.98px) {
.toggle-list .toggle-title .btn {
height: auto;
}
.toggle-list .toggle-title .btn .toggle-info {
flex-direction: column;
align-items: flex-start;
}
.toggle-list .toggle-title .date {
margin-top: 5px;
margin-left: 0;
padding-left: 0;
}
}
.btn-toggle-all {
position: relative;
padding-right: 41px;
padding-left: 13px;
}
.btn-toggle-all:before, .btn-toggle-all:after {
content: "";
position: absolute;
top: 18px;
right: 14px;
width: 16px;
height: 2px;
transition-duration: 0.2s;
background-color: #2768bf;
}
.btn-toggle-all:after {
transform: rotate(90deg);
}
.btn-toggle-all .text-close {
display: none;
}
.btn-toggle-all.on:before, .btn-toggle-all.on:after {
transform: rotate(180deg);
}
.btn-toggle-all.on .text-close {
display: block;
}
.btn-toggle-all.on .text-open {
display: none;
}
.btn-toggle-content-all {
position: relative;
padding-right: 31px;
padding-left: 13px;
}
.btn-toggle-content-all:before, .btn-toggle-content-all:after {
content: "";
position: absolute;
top: 14px;
right: 10px;
width: 13px;
height: 2px;
transition-duration: 0.2s;
background-color: #999;
}
.btn-toggle-content-all:after {
transform: rotate(90deg);
}
.btn-toggle-content-all .text-close {
display: none;
}
.btn-toggle-content-all.on:before, .btn-toggle-content-all.on:after {
transform: rotate(180deg);
}
.btn-toggle-content-all.on .text-close {
display: block;
}
.btn-toggle-content-all.on .text-open {
display: none;
}
.corona-info {
padding: 22px;
text-align: center;
}
.corona-info img {
vertical-align: top;
}
@media (min-width: 1025px) {
.corona-info img {
max-width: 578px;
}
}
/* 게시판 아코디언형 상세 */
.faq-content .btn-toggle-all {
padding: 0 10px;
}
.faq-content .btn-toggle-all:before, .faq-content .btn-toggle-all:after {
display: none;
}
.faq-content .toggle-title .btn {
height: auto;
min-height: 50px;
padding-right: 58px;
}
.faq-content .toggle-title .btn:before {
display: none;
}
.faq-content .toggle-title .btn:after {
top: calc(50% - 5px);
width: 16px;
height: 10px;
transform: none;
background: url(../../_common/images/ico-chevron-lg-down-gray@2x.png) no-repeat 50% 50%;
background-size: auto 10px;
}
.faq-content .toggle-title.on {
background-color: #f9f9f9;
}
.faq-content .toggle-title.on + .toggle-content {
background-color: #f9f9f9;
}
.faq-content .toggle-content {
padding: 15px 51px;
}
.faq-content .question,
.faq-content .answer {
display: flex;
}
.faq-content .question dt,
.faq-content .answer dt {
display: flex;
flex: 0 0 auto;
align-items: center;
justify-content: center;
width: 26px;
height: 26px;
border-radius: 50%;
color: #fff;
font-size: 14px;
}
.faq-content .question dt {
margin-right: 4px;
background-color: #2768bf;
}
.faq-content .answer dt {
margin-top: 5px;
margin-right: 9px;
background-color: #428cf0;
}
.faq-content .answer dd {
max-width: calc(100% - 35px);
}
@media (max-width: 1024.98px) {
.faq-content .toggle-content {
padding: 15px 21px;
}
}
/* 강조구문 페이지 */
@media (max-width: 1024.98px) {
.consent-collection-area {
max-height: 400px;
margin: -15px -19px;
padding: 15px 19px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
}
/* 카테고리 라벨 색상 */
.category-label.color1002 {
background: #17ac17;
}
.category-label.color1003 {
background: #eb6e3d;
}
.category-label.color1004 {
background: #9087dc;
}
.category-label.color1005 {
background: #da5053;
}
.category-label.color1006 {
background: #0d8d83;
}
.category-label.color1007 {
background: #13a349;
}
.category-label.color1008 {
background: #2fa0c5;
}
.category-label.color1009 {
background: #e77119;
}
.category-label.color1010 {
background: #df326e;
}
.category-label.color1011 {
background: #2d2ba1;
}
.category-label.color1012 {
background: #8130ce;
}
.category-label.color1013 {
background: #9365e9;
}
.category-label.color1014 {
background: #c78004;
}
.category-label.color1015 {
background: #199baa;
}
.category-label.color1016 {
background: #1853b4;
}
.category-label.color1018 {
background: #6a4cff;
}
.category-label.color4062 {
background: #d57b06;
}
.category-label.color4063 {
background: #dc4e16;
}
.category-label.color4064 {
background: #1ea16e;
}
.category-label.color2001 {
background: #f14994;
}
.category-label.color1021 {
background: #de5dc7;
}
.category-label.color9007 {
background: #de5dc7;
}
.category-label.colorDefault {
background: #3c9d84;
}
.category-label.color1020 {
background: #3c3baf;
}
#header.header-global-search {
border-bottom: 0;
}
@media (min-width: 1025px) {
#header.header-global-search {
height: 133px !important;
}
#header.header-global-search #global-search {
overflow: visible;
}
#header.header-global-search #global-search .option {
position: absolute;
top: 10px;
left: 100%;
margin-left: 30px;
white-space: nowrap;
}
}
@media (max-width: 1024.98px) {
#header.header-global-search .util-container {
display: block;
padding: 0;
height: auto;
}
#header.header-global-search #logo {
position: static;
margin-left: 50%;
height: 50px;
}
#header.header-global-search .btn-search-open,
#header.header-global-search .btn-search-close {
display: none;
}
#header.header-global-search #global-search {
display: block;
position: static;
padding-bottom: 3em;
}
#header.header-global-search #global-search .option {
position: absolute;
padding-left: 10px;
bottom: -2em;
color: #fff;
}
}
.global-search-content .search-title {
font-family: "s-core-dream", "malgun gothic", Arial, sans-serif;
font-weight: 500;
font-size: 18px;
}
.global-search-content .search-title .count {
margin-left: 3px;
}
.global-search-content .btn-search-more {
display: flex;
align-items: center;
position: absolute;
top: 15px;
right: 24px;
}
.global-search-content .btn-search-more:after {
content: "";
display: inline-block;
width: 11px;
height: 11px;
margin-left: 9px;
transition-duration: 0.3s;
vertical-align: middle;
background: url(../images/ico-plus-gray@2x.png) no-repeat 50% 50%;
background-size: auto 11px;
}
.global-search-content .result-section {
position: relative;
border-top: 1px solid #666;
}
.global-search-content .result-section .search-title {
display: flex;
align-items: center;
height: 48px;
padding: 0 110px 0 20px;
background-color: #fafafa;
}
.global-search-content .result-section .summary-list.thumbnail-type {
border-top: 0;
}
.global-search-content .result-section .summary-list.thumbnail-type .date {
display: block;
position: absolute;
bottom: 8px;
left: 0;
color: #777;
}
.global-search-content .search-keyword {
position: relative;
z-index: 100;
}
.global-search-content .search-keyword .search-title {
margin: 0 0 16px 10px;
}
.global-search-content .box-keyword {
position: relative;
border: 1px solid #428cf0;
border-radius: 6px;
background-color: #fff;
}
.global-search-content .box-keyword .btn-toggle-keyword {
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
vertical-align: middle;
overflow: hidden;
text-indent: -9999px;
overflow: hidden;
text-align: left;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
background: url(../images/bg-toggle-down.png) no-repeat 50% 50%;
}
.global-search-content .box-keyword.on {
z-index: 100;
}
.global-search-content .box-keyword.on .btn-toggle-keyword {
background-image: url(../images/bg-toggle-up.png);
}
.global-search-content .popular-keyword .box-keyword {
padding: 17px 19px;
}
.global-search-content .popular-keyword .box-keyword.on {
padding: 18px 20px;
}
.global-search-content .popular-keyword .box-keyword.on .rank-area .item + .item {
margin-top: 10px;
}
.global-search-content .popular-keyword .box-keyword:not(.on) .rank-area {
height: 24px;
overflow: hidden;
}
.global-search-content .popular-keyword .rank-area .item {
display: flex !important;
align-items: center;
position: relative;
padding-right: 20px;
}
.global-search-content .popular-keyword .rank-area .top-rank .number {
background-color: #428cf0;
}
.global-search-content .popular-keyword .rank-area .number {
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
width: 24px;
height: 22px;
margin-right: 12px;
border-radius: 2px;
color: #fff;
background-color: #989898;
}
.global-search-content .popular-keyword .rank-area .keyword {
max-width: 100%;
white-space: nowrap;
max-height: 21px;
line-height: 21px;
text-overflow: ellipsis;
overflow: hidden;
flex: 1 1 50%;
}
.global-search-content .popular-keyword .rank-area .keyword:hover, .global-search-content .popular-keyword .rank-area .keyword:focus {
text-decoration: underline;
}
.global-search-content .popular-keyword .rank-area .ico {
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
}
.global-search-content .popular-keyword .rank-area .ico-rank-stay {
width: 9px;
height: 2px;
background-color: #afbdd0;
}
.global-search-content .popular-keyword .rank-area .slick-slide {
height: 24px;
}
.global-search-content .recent-keyword .box-keyword {
padding: 13px 20px;
}
.global-search-content .recent-keyword .box-keyword:not(.on) {
padding: 19px 20px;
}
.global-search-content .recent-keyword .box-keyword:not(.on) .keyword-list {
height: 20px;
overflow: hidden;
}
.global-search-content .recent-keyword .box-keyword:not(.on) .keyword-list li {
padding: 0;
}
.global-search-content .recent-keyword .keyword-list {
display: flex;
flex-wrap: wrap;
}
.global-search-content .recent-keyword .keyword-list li {
display: flex;
align-items: center;
margin-right: 30px;
padding: 6px 0;
}
.global-search-content .recent-keyword .keyword-list li a:hover, .global-search-content .recent-keyword .keyword-list li a:focus {
text-decoration: underline;
}
.global-search-content .recent-keyword .btn-delete {
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
vertical-align: middle;
overflow: hidden;
text-indent: -9999px;
overflow: hidden;
text-align: left;
width: 18px;
height: 18px;
margin-top: -2px;
margin-left: 5px;
border: 1px solid #e3e3e3;
border-radius: 3px;
background: #f8f8f8 url(../images/ico-times-xs-gray@2x.png) no-repeat 50% 50%;
background-size: auto 10px;
}
.global-search-content .box-search table th {
padding: 10px;
}
.global-search-content .box-search table td {
padding: 10px 0;
}
.global-search-content .box-search .check-list {
display: inline-flex;
background-color: #fff;
}
.global-search-content .box-search .check-list li:first-child input[type=radio] + label {
border-radius: 3px 0 0 3px;
}
.global-search-content .box-search .check-list li:last-child input[type=radio] + label {
border-radius: 0 3px 3px 0;
}
.global-search-content .box-search .check-list li + li {
margin-left: -1px;
}
.global-search-content .box-search .check-list input[type=radio] {
position: absolute;
width: 1px;
height: 1px;
opacity: 0;
}
.global-search-content .box-search .check-list input[type=radio] + label {
display: inline-flex;
align-items: center;
justify-content: center;
height: 30px;
padding: 0 13px;
border: 1px solid #e3e3e3;
color: #666;
}
.global-search-content .box-search .check-list input[type=radio] + label span {
max-width: 100%;
white-space: nowrap;
max-height: 30px;
line-height: 30px;
text-overflow: ellipsis;
overflow: hidden;
max-width: 42px;
}
.global-search-content .box-search .check-list input[type=radio] + label:before {
display: none;
}
.global-search-content .box-search .check-list input[type=radio]:checked + label {
border-color: #2768bf;
color: #fff;
background-color: #2768bf;
}
.global-search-content .period-wrap {
display: inline-flex;
align-items: center;
}
.global-search-content .period-wrap .btn-period-search {
margin-left: 7px;
}
.global-search-content .related-search {
position: relative;
margin-top: 40px;
}
.global-search-content .related-search .search-title {
margin: 0 0 8px 5px;
}
.global-search-content .related-search .btn-search-more {
top: 5px;
}
.global-search-content .summary-list.thumbnail-type {
border-bottom: 1px solid #e3e3e3;
}
.global-search-content .summary-list.thumbnail-type > li > a:hover .subject, .global-search-content .summary-list.thumbnail-type > li > a:focus .subject {
text-decoration: underline;
}
.global-search-content .summary-list.thumbnail-type .subject {
display: block;
}
.global-search-content .summary-list.thumbnail-type .content {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal;
max-height: 48px;
line-height: 24px;
text-overflow: ellipsis;
overflow: hidden;
color: #666;
}
.global-search-content .summary-list.thumbnail-type .location {
display: block;
color: #777;
font-size: 14px;
}
.global-search-content .result-count {
display: flex;
align-items: center;
justify-content: center;
height: 100px;
font-size: 20px;
}
.global-search-content .menu-list {
padding: 25px 20px;
border-bottom: 1px solid #e3e3e3;
}
.global-search-content .menu-list > li {
position: relative;
padding-left: 10px;
color: #666;
line-height: 24px;
}
.global-search-content .menu-list > li a:hover, .global-search-content .menu-list > li a:focus {
text-decoration: underline;
}
.global-search-content .menu-list > li + li {
margin-top: 3px;
}
.global-search-content .menu-list > li:before {
content: "";
position: absolute;
top: 11px;
left: 0;
width: 3px;
height: 3px;
background-color: #1f76eb;
}
.global-search-content .search-list > li {
padding: 26px 24px 30px 20px;
border-bottom: 1px solid #e3e3e3;
}
.global-search-content .search-list > li > a {
display: block;
}
.global-search-content .search-list > li > a:hover .subject, .global-search-content .search-list > li > a:focus .subject {
text-decoration: underline;
}
.global-search-content .search-list .info {
display: flex;
align-items: center;
justify-content: space-between;
}
.global-search-content .search-list .info .subject {
max-width: calc(100% - 100px);
}
.global-search-content .search-list .subject {
max-width: 100%;
white-space: nowrap;
max-height: 24px;
line-height: 24px;
text-overflow: ellipsis;
overflow: hidden;
font-size: 18px;
}
.global-search-content .search-list .date {
flex: 0 0 auto;
color: #777;
}
.global-search-content .search-list .content {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal;
max-height: 44px;
line-height: 22px;
text-overflow: ellipsis;
overflow: hidden;
margin-top: 13px;
color: #666;
}
.global-search-content .search-list .location {
display: block;
margin-top: 23px;
color: #777;
font-size: 14px;
}
.global-search-content .search-list .file-list {
margin-top: 17px;
}
.global-search-content .search-list .file-list li + li {
margin-top: 10px;
}
.global-search-content .search-list .file-list a {
color: #777;
font-size: 14px;
}
.global-search-content .search-list .file-list a:hover, .global-search-content .search-list .file-list a:focus {
text-decoration: underline;
}
.global-search-content .table {
margin-top: 30px;
}
.global-search-content .thumbnail-list {
margin: 0 -10px;
padding: 36px 0 25px;
border-bottom: 1px solid #e3e3e3;
}
.global-search-content .thumbnail-list > li {
width: calc(25% - 20px);
margin: 0 10px;
padding: 0;
border: 0;
}
.global-search-content .thumbnail-list .subject {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal;
max-height: 40px;
line-height: 20px;
text-overflow: ellipsis;
overflow: hidden;
margin-top: 11px;
padding-right: 0;
font-weight: 400;
}
.global-search-content .thumbnail-list .info-area {
margin-top: 13px;
}
.global-search-content .thumbnail-list .date {
color: #777;
}
.global-search-content .google-search-area {
border: 1px solid #e3e3e3;
border-radius: 10px;
overflow: hidden;
background-color: #fff;
}
.global-search-content .google-search-area .search-title {
display: flex;
align-items: center;
position: relative;
height: 38px;
padding: 0 90px 0 20px;
border-bottom: 1px solid #e3e3e3;
background-color: #f9f9f9;
}
.global-search-content .google-search-area .search-title:after {
content: "";
position: absolute;
top: 9px;
right: 14px;
width: 60px;
height: 19px;
background: url(../images/logo-google@2x.png) no-repeat 50% 50%;
background-size: auto 19px;
}
.global-search-content .google-search-area .search-content {
padding: 23px 20px 30px;
overflow-y: auto;
max-height: 730px;
}
.global-search-content .google-search-area .google-search-list li + li {
margin-top: 27px;
}
.global-search-content .google-search-area .google-search-list a {
display: block;
}
.global-search-content .google-search-area .google-search-list a:hover .subject, .global-search-content .google-search-area .google-search-list a:focus .subject {
text-decoration: underline;
}
.global-search-content .google-search-area .google-search-list .location {
display: block;
color: #666;
}
.global-search-content .google-search-area .google-search-list .subject {
max-width: 100%;
white-space: nowrap;
max-height: 25px;
line-height: 25px;
text-overflow: ellipsis;
overflow: hidden;
display: block;
margin-top: 5px;
color: #2768bf;
font-size: 18px;
}
.global-search-content .google-search-area .google-search-list .content {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal;
max-height: 40px;
line-height: 20px;
text-overflow: ellipsis;
overflow: hidden;
margin-top: 7px;
color: #666;
}
.global-search-content .google-search-area .pagination {
margin-top: 52px;
}
@media (min-width: 1025px) {
.global-search-content .global-search-wrap {
position: relative;
}
.global-search-content .paju-search-area {
width: 810px;
}
.global-search-content .btn-search-more:hover:after, .global-search-content .btn-search-more:focus:after {
transform: rotate(90deg);
}
.global-search-content .result-section {
margin-top: 60px;
}
.global-search-content .result-section .summary-list.thumbnail-type > li {
height: 198px;
padding: 30px 30px 30px 190px;
}
.global-search-content .result-section .summary-list.thumbnail-type .thumb {
top: 30px;
bottom: 33px;
}
.global-search-content .tab-menu-search .tab-list {
flex-wrap: nowrap;
border-bottom: 1px solid #428cf0;
}
.global-search-content .tab-menu-search .tab-list li {
width: auto;
max-width: none;
border: 1px solid #e3e3e3;
border-bottom: 0;
border-left: 0;
}
.global-search-content .tab-menu-search .tab-list li a {
height: 38px;
margin-bottom: -1px;
color: #222;
font-size: 16px;
background-color: #f8f8f8;
}
.global-search-content .tab-menu-search .tab-list li.on {
position: relative;
border-color: #428cf0;
border-top-width: 2px;
}
.global-search-content .tab-menu-search .tab-list li.on:before {
content: "";
position: absolute;
width: 1px;
top: -1px;
bottom: -1px;
left: -1px;
background-color: #428cf0;
}
.global-search-content .tab-menu-search .tab-list li.on a {
color: #1f76eb;
background-color: #fff;
}
.global-search-content .tab-menu-search .tab-list li.on a span {
margin-top: -2px;
}
.global-search-content .search-keyword {
display: flex;
height: 147px;
padding-top: 46px;
}
.global-search-content .box-keyword .btn-toggle-keyword {
width: 72px;
height: 22px;
}
.global-search-content .popular-keyword {
flex: 0 0 auto;
width: 220px;
}
.global-search-content .box-search {
margin-top: 65px;
padding: 9px 26px;
}
.global-search-content .box-search table {
width: auto;
margin: 0;
}
.global-search-content .box-search table td + th {
padding: 10px 10px 10px 79px;
}
.global-search-content .recent-keyword {
flex: 1 1 50%;
margin-left: 20px;
}
.global-search-content .summary-list.thumbnail-type > li {
height: 175px;
padding: 20px 20px 20px 190px;
}
.global-search-content .summary-list.thumbnail-type .thumb {
top: 20px;
bottom: 20px;
width: 170px;
}
.global-search-content .summary-list.thumbnail-type .subject {
margin-top: -2px;
}
.global-search-content .summary-list.thumbnail-type .location {
margin-top: 23px;
}
.global-search-content .google-search-area {
position: absolute;
top: 50px;
right: 0;
width: 360px;
z-index: 10;
}
.global-search-content .google-search-area.fixed {
position: fixed;
top: 98px;
right: auto;
left: 50%;
margin-left: 240px;
}
}
@media (min-width: 768px) and (max-width: 1024.98px) {
.global-search-content .tab-menu-search {
margin-bottom: 30px;
}
.global-search-content .tab-menu-search .tab-list {
flex-wrap: nowrap;
border-bottom: 1px solid #428cf0;
}
.global-search-content .tab-menu-search .tab-list li {
width: auto;
max-width: none;
border: 1px solid #e3e3e3;
border-bottom: 0;
border-left: 0;
}
.global-search-content .tab-menu-search .tab-list li a {
height: 38px;
margin-bottom: -1px;
color: #222;
font-size: 16px;
background-color: #f8f8f8;
}
.global-search-content .tab-menu-search .tab-list li.on {
position: relative;
border-color: #428cf0;
border-top-width: 2px;
}
.global-search-content .tab-menu-search .tab-list li.on:before {
content: "";
position: absolute;
width: 1px;
top: -1px;
bottom: -1px;
left: -1px;
background-color: #428cf0;
}
.global-search-content .tab-menu-search .tab-list li.on a {
color: #1f76eb;
background-color: #fff;
}
.global-search-content .tab-menu-search .tab-list li.on a span {
margin-top: -2px;
}
}
@media (max-width: 1024.98px) {
.global-search-content {
margin-top: 25px;
}
.global-search-content .search-title {
font-size: 16px;
}
.global-search-content .btn-search-more {
right: 10px;
}
.global-search-content .result-section {
margin-top: 40px;
}
.global-search-content .result-section .search-title {
padding: 0 90px 0 10px;
}
.global-search-content .result-section .summary-list.thumbnail-type .date {
position: static;
margin-top: 8px;
}
.global-search-content .tab-menu-search {
position: relative;
z-index: 200;
}
.global-search-content .search-keyword .search-title {
margin: 0 0 10px 5px;
}
.global-search-content .box-keyword .btn-toggle-keyword {
width: 58px;
height: 18px;
background-size: auto 18px;
}
.global-search-content .popular-keyword {
height: 95px;
}
.global-search-content .popular-keyword .box-keyword.on {
z-index: 200;
}
.global-search-content .recent-keyword {
height: 95px;
margin-top: 30px;
}
.global-search-content .box-search {
margin-top: 40px;
}
.global-search-content .box-search table td {
padding: 12px 0;
}
.global-search-content .related-search {
margin-top: 30px;
}
.global-search-content .related-search .btn-search-more {
top: 2px;
}
.global-search-content .result-count {
font-size: 18px;
}
.global-search-content .summary-list.thumbnail-type .content-area {
padding-top: 10px;
}
.global-search-content .summary-list.thumbnail-type .subject {
font-size: 16px;
}
.global-search-content .summary-list.thumbnail-type .location {
margin-top: 10px;
}
.global-search-content .menu-list {
padding: 15px 10px;
}
.global-search-content .search-list > li {
padding: 15px 10px;
}
.global-search-content .search-list .subject {
display: block;
font-size: 16px;
}
.global-search-content .search-list .location {
margin-top: 15px;
}
.global-search-content .search-list .file-list li + li {
margin-top: 5px;
}
.global-search-content .table {
margin-top: 20px;
}
.global-search-content .thumbnail-list {
padding: 0;
}
.global-search-content .thumbnail-list > li {
width: calc(50% - 20px);
padding: 25px 0 20px;
border-radius: 0;
}
.global-search-content .thumbnail-list > li + li {
border-top: 1px solid #e3e3e3;
}
.global-search-content .thumbnail-list .info-area {
margin-top: 8px;
}
.global-search-content .google-search-area {
margin-top: 40px;
}
.global-search-content .google-search-area .search-content {
padding: 15px 15px 25px;
}
.global-search-content .google-search-area .google-search-list li + li {
margin-top: 25px;
}
.global-search-content .google-search-area .google-search-list .subject {
font-size: 16px;
}
.global-search-content .google-search-area .pagination {
margin-top: 30px;
}
}
@media (max-width: 767.98px) {
.global-search-content .thumbnail-list > li {
width: 100%;
}
}
#layer-period-search .popup-inner {
width: 395px;
}
#layer-period-search .form-row {
flex-wrap: nowrap;
justify-content: center;
}
.error-page {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
@media (min-width: 768px) {
.error-page .wrapper-error {
max-width: 800px;
margin: 0 50px 50px;
}
.error-page .logo {
padding: 0 15px;
}
.error-page .box {
padding: 40px;
}
}
@media (max-width: 767.98px) {
.error-page .wrapper-error {
max-width: 500px;
padding: 15px;
word-break: keep-all;
text-align: center;
}
.error-page .col-item {
margin-top: 15px !important;
}
.error-page .artwork {
margin-top: 10px;
width: 100px;
}
}
/* 조직도 */
.org-chart:after {
display: block;
clear: both;
content: "";
}
.org-chart .item {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
width: 176px;
height: 60px;
border: 1px solid transparent;
border-radius: 6px;
padding: 0 15px;
margin: 5px;
font-size: 15px;
line-height: 1.3;
font-weight: normal;
word-wrap: break-word;
word-break: break-all;
}
.org-chart.type1 {
margin: 0 -5px;
}
.org-chart.type1 .item {
height: 55px;
}
.org-chart.type1 .item:not(span) {
position: relative;
padding-right: 30px;
}
.org-chart.type1 .item:not(span):after {
content: "";
position: absolute;
right: 9px;
top: 50%;
width: 19px;
height: 19px;
margin-top: -10px;
background-color: red;
background: url(../../_common/images/ico-arrow-right-white.png) no-repeat center center;
background-size: 17px 6px;
}
.org-chart.type1 > li > .item {
font-size: 16px !important;
color: #fff;
background-color: #004a85;
color: #fff;
}
.org-chart.type1 > li > ul > li {
margin-top: 10px;
}
.org-chart.type1 > li > ul > li:after {
display: block;
clear: both;
content: "";
}
.org-chart.type1 > li > ul > li > .item {
background-color: #428cf0;
color: #fff;
}
.org-chart.type1 > li > ul > li > ul > li {
float: left;
}
.org-chart.type1 > li > ul > li > ul .item {
border-color: #e3e3e3;
}
.org-chart.type1 > li > ul > li > ul .item:not(span) {
position: relative;
padding-right: 30px;
}
.org-chart.type1 > li > ul > li > ul .item:not(span):after {
right: 9px;
top: 50%;
margin-top: -10px;
background-color: red;
background: url(../../_common/images/ico-arrow-right-circle-gray@2x.png) no-repeat center center;
background-size: 19px auto;
}
@media (min-width: 1025px) {
.org-chart.type1 .item:not(span):hover, .org-chart.type1 .item:not(span):focus {
box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 768px) {
.org-chart.type1 > li > ul > li > .item {
float: left;
}
.org-chart.type1 > li > ul > li > ul {
float: left;
max-width: calc(100% - 186px);
}
}
@media (max-width: 767.98px) {
.org-chart.type1 .item {
width: calc(50% - 10px);
}
.org-chart.type1 > li > ul > li > ul > li {
width: calc(50% - 10px);
margin: 5px;
}
.org-chart.type1 > li > ul > li > ul > li .item {
width: 100%;
margin: 0;
}
}
.org-chart.type2 .row {
display: block;
margin: 0 -5px;
}
.org-chart.type2 .row:after {
display: block;
clear: both;
content: "";
}
.org-chart.type2 .row + .row {
margin-top: 10px;
}
.org-chart.type2 .row .item {
float: left;
}
.org-chart.type2 .row h1 {
font-size: 16px !important;
color: #fff;
background-color: #004a85;
color: #fff;
}
.org-chart.type2 .row h2 {
background-color: #428cf0;
color: #fff;
}
.org-chart.type2 .row h3 {
background-color: #dfedff;
}
.org-chart.type2 .row h3.item-point {
background-color: #259edc;
color: #fff;
}
.org-chart.type2 .row h4 {
background-color: #23a2ae;
color: #fff;
}
.org-chart.type2 .row dt,
.org-chart.type2 .row li {
background-color: #f6f6f6;
}
.org-chart.type2 dl + .row,
.org-chart.type2 ul + .row {
margin-top: 0 !important;
}
.org-chart.type2 dl .item,
.org-chart.type2 ul .item {
border-color: #e3e3e3;
}
@media (min-width: 768px) {
.org-chart.type2 dl {
position: relative;
padding-left: 186px;
}
.org-chart.type2 dl dt {
position: absolute;
left: 0;
}
}
@media (max-width: 767.98px) {
.org-chart.type2 .row + .row {
margin-top: 5px;
}
.org-chart.type2 .row .row {
clear: both;
}
.org-chart.type2 .item {
width: calc(50% - 10px);
}
.org-chart.type2 dt + dd {
clear: both;
}
}
/* 캘린더 */
.request-wrap .title {
display: flex;
align-items: center;
justify-content: center;
height: 40px;
border-radius: 3px;
color: #fff;
font-weight: 400;
font-size: 18px;
}
.request-wrap .request-calendar .title {
background-color: #428cf0;
}
.request-wrap .calendar-area {
font-family: "malgun gothic";
}
.request-wrap .calendar-header {
display: flex;
align-items: center;
justify-content: center;
position: relative;
height: 57px;
margin-top: 5px;
}
.request-wrap .calendar-header .btn-ctrl .btn {
position: absolute;
top: 50%;
width: 29px;
height: 27px;
border: 1px solid #ddd;
border-radius: 2px;
transform: translateY(-50%);
background-color: #fff;
}
.request-wrap .calendar-header .btn-ctrl .btn .ico:first-child {
margin-right: 0;
}
.request-wrap .calendar-header .btn-prev {
left: 50%;
margin-left: -87px;
}
.request-wrap .calendar-header .btn-next {
right: 50%;
margin-right: -87px;
}
.request-wrap .calendar-title {
font-weight: 700;
font-size: 21px;
}
.request-wrap .calendar-body table {
position: relative;
width: calc(100% + 6px);
margin: 0 -3px;
border-spacing: 3px;
}
.request-wrap .calendar-body table:before, .request-wrap .calendar-body table:after {
content: "";
position: absolute;
right: 3px;
left: 3px;
background-color: #666;
}
.request-wrap .calendar-body table:before {
top: 0;
height: 2px;
}
.request-wrap .calendar-body table:after {
top: 32px;
height: 1px;
}
.request-wrap .calendar-body table thead th {
height: 32px;
padding-bottom: 6px;
font-size: 13px;
}
.request-wrap .calendar-body table tbody td:first-child {
color: #d92424;
}
.request-wrap .calendar-body table td {
height: 47px;
border: 1px solid #e4e4e4;
border-radius: 3px;
font-size: 16px;
text-align: center;
}
.request-wrap .calendar-body table td a {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.request-wrap .calendar-body .close {
background: #ebebeb url(../images/pattern_3.png);
}
.request-wrap .calendar-body .possible {
border-color: #d5dff3;
background: #e4edfc url(../images/pattern_2.png);
}
.request-wrap .calendar-body .end {
background-color: #fff;
}
.request-wrap .calendar-body .culture {
border-color: #0f8f6f;
color: #fff;
font-weight: 700;
background-color: #1ba885;
}
.request-wrap .calendar-body .active {
border-color: #3a80df;
color: #fff;
font-weight: 700;
background: #428cf0 url(../images/pattern_1.png);
}
.request-wrap .calendar-info {
display: flex;
flex-wrap: wrap;
margin-top: 2px;
}
.request-wrap .calendar-info li {
display: flex;
align-items: center;
margin: 5px 0;
}
.request-wrap .calendar-info li:before {
content: "";
flex: 0 0 auto;
width: 12px;
height: 12px;
margin-right: 5px;
border: 1px solid #e4e4e4;
border-radius: 2px;
}
.request-wrap .calendar-info li.close:before {
background: #ebebeb url(../images/pattern_3.png);
}
.request-wrap .calendar-info li.possible:before {
border-color: #d5dff3;
background: #e4edfc url(../images/pattern_2.png);
}
.request-wrap .calendar-info li.end:before {
background-color: #fff;
}
.request-wrap .calendar-info li.culture:before {
border-color: #0f8f6f;
background-color: #1ba885;
}
.request-wrap .calendar-info li.active:before {
border-color: #3a80df;
background: #428cf0 url(../images/pattern_1.png);
}
.request-wrap .request-detail .title {
background-color: #345dbb;
}
.request-wrap .request-header {
display: flex;
align-items: center;
justify-content: space-between;
height: 60px;
padding: 0 10px 0 20px;
font-size: 18px;
overflow: hidden;
}
.request-wrap .request-date {
flex: 0 0 auto;
margin-left: 20px;
}
.request-wrap .request-list {
border-bottom: 1px solid #e3e3e3;
}
.request-wrap .request-list li {
display: flex;
align-items: center;
justify-content: space-between;
height: 40px;
padding: 0 10px 0 20px;
letter-spacing: -0.5px;
}
.request-wrap .request-list li:nth-child(odd) {
background-color: #f3f8ff;
}
.request-wrap .request-list .name {
position: relative;
flex: 1 1 50%;
padding-left: 9px;
}
.request-wrap .request-list .name:before {
content: "";
position: absolute;
top: 10px;
left: 0;
width: 2px;
height: 2px;
background-color: #333;
}
.request-wrap .request-list .info-area {
display: flex;
align-items: center;
flex: 0 0 auto;
}
.request-wrap .request-list .time,
.request-wrap .request-list .number {
font-size: 16px;
}
.request-wrap .request-list .time {
color: #2768bf;
}
.request-wrap .request-list .number {
color: #d92424;
}
.request-wrap .request-list .btn {
min-width: 45px;
height: 27px;
padding: 0 8px;
}
.request-wrap.type2 .request-note {
margin-top: 2px;
border-top: 2px solid #666;
padding: 10px 10px 10px 20px;
color: #e13224;
font-weight: 700;
}
.request-wrap.type2 .request-note .text {
position: relative;
padding-left: 23px;
}
.request-wrap.type2 .request-note .text:before {
content: "";
position: absolute;
top: 2px;
left: 0;
width: 16px;
height: 16px;
background: url(../images/ico-info@2x.png) no-repeat 50% 50%;
background-size: auto 16px;
}
.request-wrap.type2 .request-list .info-area {
margin-left: 0;
}
.request-wrap.type2 .request-list .info-area .name,
.request-wrap.type2 .request-list .info-area .price1 {
margin-right: 15px;
}
.request-wrap.type2 .request-list .info-area .time,
.request-wrap.type2 .request-list .info-area .price1,
.request-wrap.type2 .request-list .info-area .price2 {
flex: 0 0 auto;
}
.request-wrap.type2 .request-list .info-area .time {
margin-right: 30px;
}
.request-wrap.type2 .request-list .info-area .price1 {
position: relative;
color: #fd6059;
}
.request-wrap.type2 .request-list .info-area .price1:before {
content: "";
position: absolute;
top: 50%;
left: -15px;
width: 1px;
height: 16px;
transform: translateY(-50%);
background-color: #e3e3e3;
}
.request-wrap.type2 .request-list .info-area .price2 {
color: #666;
text-decoration: line-through;
}
.request-wrap.type2 .request-list .btn span {
max-width: 100%;
white-space: nowrap;
max-height: 20px;
line-height: 20px;
text-overflow: ellipsis;
overflow: hidden;
}
@media (min-width: 1025px) {
.request-wrap {
display: flex;
}
.request-wrap .request-calendar {
flex: 0 0 auto;
width: 365px;
margin-right: 30px;
}
.request-wrap .request-calendar table td a:hover, .request-wrap .request-calendar table td a:focus {
text-decoration: underline;
}
.request-wrap .calendar-info li {
margin-right: 20px;
}
.request-wrap .request-detail {
flex: 1 1 50%;
}
.request-wrap .request-list .info-area {
margin-left: 20px;
}
.request-wrap .request-list .info-area .time,
.request-wrap .request-list .info-area .number {
margin-right: 20px;
}
.request-wrap.type2 .request-list .btn {
max-width: 150px;
}
}
@media (max-width: 1024.98px) {
.request-wrap .calendar-info li {
margin-right: 15px;
}
.request-wrap .request-detail {
margin-top: 25px;
}
.request-wrap .request-header {
padding: 0 15px;
}
.request-wrap .request-list .info-area {
margin-left: 15px;
}
.request-wrap .request-list .info-area .time,
.request-wrap .request-list .info-area .number {
margin-right: 15px;
}
.request-wrap.type2 .request-list .btn {
max-width: 175px;
}
}
@media (max-width: 767.98px) {
.request-wrap .request-list li {
flex-direction: column;
align-items: flex-start;
height: auto;
padding: 10px 15px;
}
.request-wrap .request-list .info-area {
margin: 5px 0 0 9px;
}
.request-wrap .request-list .time,
.request-wrap .request-list .number {
font-size: 14px;
}
.request-wrap.type2 .request-list .info-area .name,
.request-wrap.type2 .request-list .info-area .price1 {
margin-right: 10px;
}
.request-wrap.type2 .request-list .info-area .time {
margin-right: 20px;
}
.request-wrap.type2 .request-list .info-area .price1:before {
left: -11px;
}
.request-wrap.type2 .request-list .btn {
margin: 5px 0 0 10px;
}
}
.box-login {
max-width: 450px;
margin: auto;
}
.box-login .login-header {
float: left;
width: calc(100% + 38px);
margin: -15px -19px 0;
padding: 10px 19px;
border-radius: 10px 10px 0 0;
font-family: "s-core-dream", "malgun gothic", Arial, sans-serif;
text-align: center;
font-weight: 500;
font-size: 18px;
}
.box-login .login-body {
clear: both;
padding: 15px 15px 5px;
}
.box-login .row {
margin-top: 10px;
min-height: 30px;
}
.box-login .row .label {
display: block;
padding: 6px 0 3px;
font-weight: 500;
}
@media (min-width: 576px) {
.box-login .row {
display: flex;
align-items: center;
}
.box-login .row .label {
flex: 0 0 auto;
padding: 0;
min-width: 100px;
margin-right: 10px;
}
.box-login .row.btn-area {
padding-left: 110px;
}
}
@media (max-width: 767.98px) {
.box-login .login-body {
padding: 15px 0 5px;
}
}/*# sourceMappingURL=common.css.map */
.table-list table td[class*=cell-res] > b { display: none; }
.table-list table td[class*=cell-res] > i { font-style: normal; }
@media (max-width: 1024px) {
.table-list table td.cell-num { display: none; }
.table-list table td.cell-res { display: flex; align-items: flex-start; gap: 12px; }
.table-list table td.cell-res + td.cell-res { margin-top: 2px; }
.table-list table td[class*=cell-res] > b { display: flex; align-items: center; justify-content: center; padding: 6px 12px; width: 80px; font-weight: 400; background: #e9e9e9; }
.table-list table td[class*=cell-res] > i { flex: 1; padding: 6px 0; }
.table-list table td.cell-res-2 { display: inline-flex; gap: 12px; margin: 2px 6px 2px 2px; }
.table-list table td.cell-res-2 > b { border-radius: 4px; }
}
/* 20240513 start */
.table-list table tbody .cell-default:last-child:after { display: none; }
.table-list table tbody .cell-tit b { display: none; font-weight: 400; }
.table-list table tbody .cell-tit i { font-style: normal; }
@media (max-width: 1024.98px) {
.table-list table tbody .cell-tit b { display: inline; }
}
/* 20240513 end */
/* 회원교육설문등록 */
.survey_wrap {
width: 100%;
height: auto;
border-top: 1px solid #aaaaaa;
}
.survey_wrap:last-child {
border-bottom: 1px solid #e3e3e3;
}
.survey_wrap h4 {
background-color: #f9f9f9;
border-bottom: 1px solid #e3e3e3;
padding: 13px 20px 14px;
}
.survey_wrap ul {
padding: 17px 20px 20px;
}
.survey_wrap ul li + li {
margin-top: 10px;
}
.survey_wrap .ckeck-item input:checked + label:before {
border-color: #1f76eb;
background-image: url(../../_common/images/ico-radio-checked-primary@2x.png);
}
.survey_wrap .ckeck-item-custom input[type=checkbox] + label:before {
border-color: #aaaaaa;
border-radius: 3px;
}
.survey_wrap .ckeck-item-custom input:checked + label:before {
background: #1f76eb url(../../_common/images/ico-checkbox-checked-white@2x.png) no-repeat 45% center;
background-size: 12px 10px;
border-color: #1f76eb;
}
.survey_wrap .form-control-etc {
height: 32px;
line-height: 32px;
background-color: #f9f9f9;
}
.survey_wrap .survey_view {
padding: 18px 20px 26px;
}
.survey_wrap .survey_view ul {
padding: 0;
margin-bottom: 11px;
}
.survey_wrap .survey_view ul:last-child {
margin-bottom: 0;
}
.survey_wrap .survey_view ul li {
float: left;
margin-top: 0;
}
.survey_wrap .survey_view ul li:first-child {
width: 190px;
font-size: 15px;
color: #333333;
}
.survey_wrap .survey_view ul li:last-child {
width: calc(100% - 190px);
}
.survey_wrap .survey_view ul li .survey_n {
font-size: 15px;
color: #1f76eb;
width: 51px;
display: block;
float: left;
}
.survey_wrap .survey_view ul li .survey_gh {
width: calc(100% - 51px);
display: block;
float: left;
}
.survey_wrap .survey_view ul li .survey_gh em {
height: 20px;
min-width: 2px;
border-radius: 4px;
background-color: #1f76eb;
display: block;
}
.survey_wrap .survey_view ul li::after {
display: block;
content: "";
clear: both;
}
.survey_wrap .survey_view ul::after {
display: block;
content: "";
clear: both;
}
@media (max-width: 767.98px) {
.survey_wrap .survey_view ul li {
float: none;
}
.survey_wrap .survey_view ul li:last-child {
width: 100%;
margin-top: 5px;
}
}
.border-none {
border-bottom: 0 !important;
}
@media (max-width: 1024.98px) {
.table-list-edu tbody tr {
position: relative;
}
.table-list-edu tbody .cell-reserve {
padding-bottom: 60px;
}
.edu_btn {
position: absolute;
bottom: 10px;
left: 50%;
margin-left: -160px;
max-width: 320px;
width: 94%;
font-size: 14px !important;
padding: 18px 0 !important;
border-radius: 3px;
}
}
/* 20241122 start */
.sports_list > li{padding: 0; position: relative; display: inline-flex; flex-direction: column; justify-content: space-between;}
.sports_list .thumb{border-radius: 20px 20px 0 0;}
.sports_list .place_name{font-size: 14px; color: #fff; background-color: #1f76eb; padding: 5px 10px; border-radius: 24px; position: absolute; top: 15px; left: 15px; z-index: 11;}
.sports_list .indent{padding: 20px;}
.sports_list .list1 > li{padding-left: 5px; display: inline-flex; gap: 3px;}
.sports_list .list1 > li:before{border: none; width: 2px; height: 2px; background-color: #333; top: 10px;}
.sports_list .list1 > li b{flex-shrink: 0;}
/* 20241129 수정 start */
.sports_list .btn_w{display: flex;}
.sports_list .btn_w > *{flex: 1;font-size: 14px; color: #666; background-color: #eee; display: flex; align-items: center; justify-content: center; height: 38px; gap: 8px; border-top: 1px solid #e3e3e3; transition: .2s;}
.sports_list .btn_w a:first-child{border-radius: 0 0 0 19px;}
.sports_list .btn_w a:last-child{border-radius: 0 0 19px 0;}
.sports_list .btn_w a:not(:last-child){border-right: 1px solid #e3e3e3;}
.sports_list .more .ico-plus-white{filter: brightness(0) saturate(100%) invert(38%) sepia(6%) saturate(15%) hue-rotate(328deg) brightness(101%) contrast(88%); display: inline-block; background-image: url(/resources/user/_common/images/ico-plus-white@2x.png); background-size: contain; width: 11px; height: 11px;}
.sports_list .link {text-decoration: none;}
.sports_list .link .ico-link{filter: brightness(0) saturate(100%) invert(38%) sepia(6%) saturate(15%) hue-rotate(328deg) brightness(101%) contrast(88%); display: inline-block; background: url(/resources/user/_common/images/ico-external-link@2x.png) no-repeat; background-size: contain; width: 11px; height: 11px;}
/* 20241129 수정 end */
ul.sports_list > li[onclick] .more:hover { background-color: #1f76eb; color: #fff;}
ul.sports_list > li[onclick] .more:hover .ico-plus-white{filter: unset;}
ul.sports_list > li .link:hover .ico-link{filter: unset;filter: brightness(0) invert(1);}
.sports_video_list{}
.sports_video_list .thumb {display: block;position: relative;}
.sports_video_list .thumb:before {content: "";position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);background-repeat: no-repeat;background-position: 50% 50%;width: 44px; height: 44px; background-image: url( https://www.paju.go.kr/resources/user/www/images/home/ico-play.png);}
#sportsMap .iw_inner.type2{max-width: 360px; box-shadow: 5px 5px 20px rgba(0, 0, 0, .25); position: relative;}
#sportsMap .type2.iw_inner::before{display: block; content: ''; width: 0; height: 0; border-style: solid; /* border-width: 10px 0px 10px 20px; */ border-color: transparent transparent transparent #fff; position: absolute; bottom: 25%; right: -19px;}
#sportsMap .type2.iw_inner .map_img{padding-bottom: 39%; position: relative;}
#sportsMap .type2.iw_inner .map_img > img{position: absolute; top: 0; left: 0; max-width: none; height: 100%; width: 100%; z-index: 10;}
#sportsMap .type2.iw_inner .cont{border: 1px solid #dadada; border-top: none; padding: 25px;}
#sportsMap .type2.iw_inner .title{font-weight: 600; color: #2768bf; font-size: 1rem;}
#sportsMap .type2.iw_inner .info{margin-top: 10px; color: #666;}
#sportsMap .type2.iw_inner .btn-default{margin-top: 10px; background-color: #666; width: 100%;}
/* @media (max-width: 767px){
#sportsMap .iw_inner::before{right: 50%; transform: translateX(-50%); bottom: -19px; border-width: 20px 10px 0px 13px; border-color: #fff transparent transparent transparent;}
} */
.request-space{width: 100%;}
.request-space .title{background-color: #004a85; width: 100%;}
.request-space .space-area{padding: 33px 20px; border-bottom: 1px solid #666; text-align: center; word-break: keep-all;}
.request-step.type2{display: flex;}
.request-step.type2 li{}
.request-step.type2 li label{padding-top: 15px; color: #787878; font-weight: 700;}
/* 20241122 end */
/* 20241204 start */
.sports_list > li { justify-content: unset; }
.sports_list .list > li:after { display: none; }
.sports_list .list1 > li { gap: 4px; width: 100%; }
.sports_list .list1 li b { width: 68px; height: 0; text-align: justify; }
.sports_list .list1 li b:after { content: ''; display: inline-block; width: 100%; }
.sports_list .list1 li span { flex: 1; position: relative; display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sports_list .btn_w { margin-top: auto; }
ul.sports_list > li a:hover { color: #fff; background: #1f76eb; }
.sports_list .more:hover .ico-plus-white { filter: unset; }
@media (max-width: 820px) {
.sports_list > li { width: calc(50% - 20px); }
}
@media (max-width: 600px) {
.sports_list > li { width: calc(100% - 20px); }
}
/* 20241204 end */
/* 20241204 start */
@media (max-width: 1024.98px) {
.container { padding: 0 20px; }
}
/* 20241204 end */
/* 20241204 start */
@media (max-width: 1024.98px) {
.container { padding: 0 20px; }
}
/* 20241204 end */
/* 20241211 start */
.sports_list > li { display: block; transition: box-shadow .4s; }
.sports_list > li:hover { box-shadow: 0px 0px 20px rgba(0, 0, 0, .2); /* border-color: #1f76eb; */ }
.sports_list > li .thumb img { transition: transform .4s; }
.sports_list > li:hover .thumb img { transform: scale(1.1); }
.sports_list .btn_w { gap: 10px; padding: 25px 20px 20px; }
.sports_list .btn_w a:first-child { color: #555; border: 1px solid #dadada; border-radius: 200px; }
.sports_list .btn_w a:last-child { color: #fff; background: #666; border-radius: 200px; }
.sports_list .btn_w .more:hover { color: #fff; background: #1f76eb; border-color: #1f76eb; }
.sports_list .btn_w .link:hover { background: #004a85; }
.sports_list .btn_w .link .ico-link { width: 14px; height: auto; aspect-ratio: 1; background: url(../../_common/images/ico-link-w.png) no-repeat center; filter: unset; }
/* 20241211 end */
/* 20241211 start */
.sports_list .list1 li span { color: #666; }
.sports_list .btn_w { padding: 0 20px 20px; }
/* 20241211 end */
/* 20241211 start */
.portraitBox { display: flex; align-items: center; gap: 30px; margin: 60px 0 50px; padding: 15px; background: #f4f4f4; border-radius: 13px; }
.portraitBox .img { display: flex; align-items: center; justify-content: center; width: 90px; aspect-ratio: 1; /*background: #fff;*/ border-radius: 13px; }
/*.portraitBox .img img { width: 60%; }*/
.portraitBox p { flex: 1; font-size: 16px; color: #333; font-weight: 600; font-family: "s-core-dream"; word-break: keep-all; }
.portraitBox p span { color: #ee3139; }
@media (max-width: 767.98px) {
.portraitBox { gap: 20px; }
.portraitBox .img { width: 75px; }
.portraitBox p { font-size: 15px; }
}
@media (max-width: 424.98px) {
.portraitBox { gap: 15px; }
.portraitBox .img { width: 60px; }
.portraitBox p { font-size: 14px; letter-spacing: -0.5px; }
}
/* 20241211 end */
/* 20250113 start */
.icon_list {display: flex; gap: 25px; padding-left: 10px;}
.icon_list>li {display: flex; align-items: center; gap: 8px;}
.icon_list .icon_img {width: 22px; height: 33px;}
.icon_list .icon_img>img {width: 100%;}
.sports_list .list_tag {display: flex; gap: 4px; position: absolute; top: 15px; left: 15px; z-index: 11;}
.sports_list .list_tag>span {font-size: 14px; color: #fff; padding: 5px 10px; border-radius: 24px;}
.sports_list .place_free {background-color: #1fa280;}
.sports_list .place_receipt {background-color: #FFA7A7;}
.sports_list .place_charged {background-color: #eb6485;}
.sports_list .place_direct {background-color: #2967cc;}
.sports_list .place_outsource {background-color: #6b34d5;}
.sports_list .list_direct:hover {border-color: #5b9bd5;}
.sports_list .list_outsource:hover {border-color: #6b34d5;}
/* #sportsMap .iw_inner.direct {border: 1px solid #5b9bd5;} */
#sportsMap .iw_inner.outsource {border: 1px solid #6b34d5;}
#sportsMap .type2.iw_inner .tag {position: absolute; top: 15px; left: 15px; font-size: 14px; color: #fff; padding: 5px 10px; border-radius: 24px;}
#sportsMap .type2.iw_inner .tag-direct {background-color: #2967cc;}
#sportsMap .type2.iw_inner .tag-outsource {background-color: #6b34d5;}
/* 20250113 end */
/* 20250115 start */
#sportsMap .iw_inner.type2 {max-width: none; width: 300px;}
#sportsMap .type2.iw_inner .map_img {padding-bottom: 50%;}
#sportsMap .type2.iw_inner .list3>li {overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
#sportsMap .type2.iw_inner .info .btn {height: 28px; font-size: 12px;}
/* 20250115 end */
/* 20250121 start */
.contract-info .box-point .image>img {width: 173px;}
.contract-info .box {padding: 30px 58px;}
.contract-info .card-list {display: flex; gap: 6px;}
.contract-info .card-list .box {display: flex; flex-direction: column; align-items: center; gap: 23px; width: 33.3%;}
.contract-info .card-list .box img {height: 97px;}
.contract-info .card-list .box b {font-size: 20px;}
.contract-info .card-list .box button { width: 200px; height: 46px; font-size:15px; border:1px solid #2768bf; color:#2768bf; border-radius: 30px; font-family: 's-core-dream'; font-weight: 500;}
@media (max-width:800px) {
.contract-info .card-list {flex-direction: column;}
.contract-info .card-list .box {width: 100%;}
}
/* 20250121 end */
/* 20250204 start */
.contract-info .card-list .box > button:hover {
background-color: #2768bf;
color: #fff;
transition: all .3s;
}
/* 20250204 end */
/* 20250218 start */
.c-select {
float: right;
width: 90px;
padding: 5px 16px;
line-height: 20px;
font-size: 14px;
border: 1px solid #e3e3e3;
border-radius: 20px;
background: #fff url(../../_common/images/ico-select-down.png) no-repeat right
12px center/ 12px;
appearance: none;
}
.list-info.list-info-flex {
display: flex;
justify-content: space-between;
}
.list-info.list-info-flex .left {
flex: 1 1 auto;
}
.list-info.list-info-flex .left .total {
flex: 1 1 auto;
margin-top: 10px;
}
@media (min-width: 1025px) {
.list-info > .left {
float: none;
}
}
/* 20250218 end */
/* 20250317 start */
.urban-plan1 .inner {
display: flex;
flex-direction: column;
gap: 30px;
position: relative;
}
.urban-plan1 .inner::before {
content: "";
position: absolute;
left: 133px;
top: 0;
width: 1px;
height: calc(100% - 50px);
background-color: #dddddd;
z-index: -1;
}
.urban-plan1 .inner .cont-wrap {
display: flex;
}
.urban-plan1 .inner .title {
display: inline-flex;
align-items: center;
justify-content: center;
width: 270px;
height: 60px;
text-align: center;
font-size: 15px;
font-weight: 700;
color: #1f76eb;
border-radius: 50px;
border: 2px solid #1f76eb;
background-color: #fff;
}
.urban-plan1 .inner .title.full {
font-size: 18px;
color: #fff;
background: #1f76eb;
}
.urban-plan1 .inner .arrow-wrap {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
width: 136px;
height: 60px;
padding: 5px 0;
}
.urban-plan1 .inner .arrow-wrap.arrow1 {
background: url(../../www/images/home/img-arrow-long.png) 13px center
no-repeat;
}
.urban-plan1 .inner .arrow-wrap.arrow2 {
background: url(../../www/images/home/img-arrow-short.png) left center
no-repeat;
}
.urban-plan1 .inner .arrow-wrap.arrow3 {
justify-content: center;
background: url(../../www/images/home/img-arrow-short.png) left center
no-repeat;
}
.urban-plan1 .inner .arrow-wrap > span {
font-weight: 500;
}
.urban-plan1 .inner .desc-wrap {
display: flex;
align-items: center;
width: calc(100% - 406px);
padding: 10px 20px;
border: 1px solid #ddd;
}
.urban-plan2 .title-wrap > .text-md {
letter-spacing: -1px;
color: #000;
}
.urban-plan2 .title-wrap > .text-md .text-bold {
color: #3b87ee;
}
.urban-plan2 .box-info {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
padding: 20px 15px;
border: 1px solid #ddd;
letter-spacing: -1px;
color: #000;
}
.urban-plan2 .box-info .line2 {
font-size: 24px;
}
.urban-plan2 .information1 .inner {
display: flex;
gap: 28px;
padding-top: 20px;
}
.urban-plan2 .information1 .box {
position: relative;
width: calc(25% - 14px);
padding: 50px 25px 19px;
}
.urban-plan2 .information1 .box::after {
content: "";
position: absolute;
left: 100%;
top: 50%;
transform: translateX(-17px);
width: 43px;
height: 20px;
background: url(../../www/images/home/img-info-arrow.png) no-repeat;
}
.urban-plan2 .information .box-title {
display: inline-flex;
align-items: center;
justify-content: center;
position: absolute;
top: -20px;
left: 50%;
transform: translateX(-50%);
width: 144px;
height: 40px;
border-radius: 50px;
font-size: 20px;
background-color: #666;
color: #fff;
}
.urban-plan2 .information1 .box-top {
padding-bottom: 30px;
border-bottom: 1px solid #ddd;
}
.urban-plan2 .information1 .box-top > p {
font-size: 18px;
line-height: 18px;
}
.urban-plan2 .information1 .box-bottom {
padding-top: 16px;
}
.urban-plan2 .information1 .box-bottom > p {
letter-spacing: -1px;
color: #000;
}
.urban-plan2 .information1 .box:last-child {
background-color: #f7faff;
border: 3px solid #428cf0;
}
.urban-plan2 .information1 .box:last-child:after {
display: none;
}
.urban-plan2 .information1 .box:last-child .box-top > p {
line-height: 27px;
}
.urban-plan2 .txt-red {
color: #ff0000;
}
.urban-plan2 .information1 .desc-txt {
display: flex;
justify-content: flex-end;
gap: 15px;
margin-top: 17px;
letter-spacing: -1px;
color: #000;
}
.urban-plan2 .information2 .arrow-wrap {
display: flex;
justify-content: center;
align-items: center;
}
.urban-plan2 .information2 .arrow-box {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 253px;
height: 98px;
padding-right: 30px;
text-align: center;
}
.urban-plan2 .information2 .arrow-box::before {
content: "";
position: absolute;
top: 0;
right: -1px;
width: 38px;
height: 98px;
z-index: -1;
}
.urban-plan2 .information2 .arrow-box1 {
width: 224px;
background: url(../../www/images/home/img-bg-arrow1.png) right center
no-repeat;
}
.urban-plan2 .information2 .arrow-box1::before {
background-color: #78adf4;
}
.urban-plan2 .information2 .arrow-box1 .arrow-top {
position: absolute;
top: -25px;
left: 0;
font-size: 13px;
letter-spacing: -1px;
}
.urban-plan2 .information2 .arrow-box2 {
background: url(../../www/images/home/img-bg-arrow2.png) right center
no-repeat;
}
.urban-plan2 .information2 .arrow-box2::before {
background-color: #428df0;
}
.urban-plan2 .information2 .arrow-box3 {
background: url(../../www/images/home/img-bg-arrow3.png) right center
no-repeat;
}
.urban-plan2 .information2 .arrow-box3::before {
background-color: #3664a2;
}
.urban-plan2 .information2 .arrow-box4 {
width: 274px;
height: 175px;
background: url(../../www/images/home/img-bg-arrow4.png) right -1px / auto 174px
no-repeat;
}
.urban-plan2 .information2 .arrow-box .arrow-txt {
font-size: 20px;
font-weight: 700;
color: #fff;
}
.urban-plan2 .information2 .arrow-box.arrow-box4 .arrow-txt {
color: #fffb00;
}
.urban-plan2 .information2 .arrow-box .arrow-txt > span {
font-size: 15px;
}
.urban-plan2 .information2 .arrow-box .arrow-desc {
position: absolute;
left: 0;
top: 100%;
padding-top: 31px;
letter-spacing: -1.5px;
}
.urban-plan2 .information2 .arrow-box.arrow-box1 .arrow-desc {
left: 40px;
}
.urban-plan2 .information2 .arrow-box.arrow-box2 .arrow-desc {
left: 44px;
}
.urban-plan2 .information2 .arrow-box.arrow-box3 .arrow-desc {
left: -24px;
width: 260px;
}
.urban-plan2 .information2 .arrow-box.arrow-box4 .arrow-desc {
top: 136px;
left: 50px;
}
.urban-plan2 .information2 .arrow-box.arrow-box4 .arrow-desc .desc {
color: #3b87ee;
}
.urban-plan2 .information2 .arrow-box .arrow-desc::before {
content: "";
position: absolute;
left: 50%;
top: 0;
transform: translateX(-3px);
width: 6px;
height: 27px;
}
.urban-plan2 .information2 .arrow-box.arrow-box1 .arrow-desc::before {
background: url(../../www/images/home/img-arrow-line1.png) no-repeat;
}
.urban-plan2 .information2 .arrow-box.arrow-box2 .arrow-desc::before {
background: url(../../www/images/home/img-arrow-line2.png) no-repeat;
}
.urban-plan2 .information2 .arrow-box.arrow-box3 .arrow-desc::before {
background: url(../../www/images/home/img-arrow-line3.png) no-repeat;
}
.urban-plan2 .information2 .arrow-box.arrow-box4 .arrow-desc::before {
background: url(../../www/images/home/img-arrow-line4.png) no-repeat;
}
.urban-plan2 .information2 .arrow-box .arrow-desc .desc {
padding-top: 12px;
}
.urban-plan2 .information2 .box-info {
flex-direction: row;
justify-content: center;
gap: 30px;
margin-top: 100px;
padding: 40px 30px 20px;
border-radius: 0;
}
.urban-plan2 .information2 .box {
background-color: #fff;
padding: 35px 14px 23px;
}
.urban-plan2 .information2 .box .box-title {
width: 240px;
}
.urban-plan2 .information2 .left-box .box {
height: 232px;
}
.urban-plan2 .information2 .box-top {
padding-bottom: 20px;
}
.urban-plan2 .information2 .box-top .desc-txt {
letter-spacing: -1.5px;
font-size: 18px;
}
.urban-plan2 .information2 .box-top > p + p {
padding-top: 10px;
}
.urban-plan2 .information2 .box-bottom {
display: flex;
justify-content: center;
border-top: 1px solid #ddd;
padding-top: 17px;
letter-spacing: -1px;
color: #000;
}
.urban-plan2 .information2 .btm-txt {
display: flex;
flex-direction: column;
}
.urban-plan2 .information2 .btm-txt li {
text-align: left;
}
.urban-plan2 .information2 .btm-txt li:last-child {
padding-left: 15px;
}
.urban-plan2 .information2 .right-box {
width: 480px;
}
.urban-plan2 .information2 .right-box .box {
width: 474px;
padding: 40px 14px 25px;
}
.urban-plan2 .information2 .right-box .title {
background-color: #3664a2;
}
.urban-plan2 .information2 .right-box .box-top {
padding-bottom: 0;
}
.urban-plan2 .information2 .right-box .text-highlight {
color: #3664a2;
}
.urban-plan2 .information2 .right-box .list {
margin-top: 10px;
}
.urban-plan2 .information2 .right-box .list li {
letter-spacing: -1px;
color: #000;
text-align: left;
}
.urban-plan2 .information2 .right-box .list li + li {
margin-top: 0;
}
.urban-plan2 .information2 .right-box p.text {
margin-top: 15px;
color: #000;
letter-spacing: -1px;
text-align: left;
}
.urban-plan3 .process-wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 55px;
margin-top: 60px;
}
.urban-plan3 .process-wrap .box {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 270px;
height: 312px;
}
.urban-plan3 .process-wrap .box::after {
content: "";
position: absolute;
left: 100%;
top: 50%;
transform: translate(15px, -50%);
width: 30px;
height: 20px;
background: url(../../www/images/home/ico-process-arrow.png) no-repeat;
}
.urban-plan3 .process-wrap .box:last-child::after {
display: none;
}
.urban-plan3 .process-wrap .box > p {
margin-top: 13px;
color: #000;
letter-spacing: -1px;
}
.urban-plan3 .process-wrap .title {
display: inline-flex;
flex-direction: column;
justify-content: center;
position: absolute;
top: -31px;
left: 50%;
transform: translateX(-50%);
width: 206px;
height: 62px;
text-align: center;
color: #fff;
border-radius: 100px;
}
.urban-plan3 .process-wrap .box1 .title {
background-color: #666;
}
.urban-plan3 .process-wrap .box2 .title {
background-color: #627fa8;
}
.urban-plan3 .process-wrap .box3 .title {
background-color: #428cf0;
}
.urban-plan3 .process-wrap .box .img {
position: relative;
}
.urban-plan3 .process-wrap .box .img::after {
content: "";
position: absolute;
right: -15px;
bottom: 0;
width: 30px;
height: 30px;
border-radius: 50%;
}
.urban-plan3 .process-wrap .box1 .img::after {
background: #ff5e4f url(../../www/images/home/ico-process-check.png) center
no-repeat;
}
.urban-plan3 .process-wrap .box2 .img::after {
background: #317e82 url(../../www/images/home/ico-process-x.png) center
no-repeat;
}
.urban-plan3 .process-wrap .box3 .img::after {
background: #87af2e url(../../www/images/home/ico-process-check.png) center
no-repeat;
}
@media (max-width: 1024.98px) {
.urban-plan2 .information2 .box-info {
flex-direction: column;
}
.urban-plan2 .box-info .line2 {
font-size: 20px;
}
.urban-plan2 .information1 .inner {
flex-wrap: wrap;
gap: 40px 28px;
}
.urban-plan2 .information1 .box {
width: calc(50% - 30px);
padding: 30px 25px 15px;
}
.urban-plan2 .information .box-title {
top: -15px;
height: 30px;
font-size: 18px;
}
.urban-plan2 .information1 .box-top {
padding-bottom: 15px;
}
.urban-plan2 .information2 .left-box {
width: 100%;
}
.urban-plan2 .information2 .right-box,
.urban-plan2 .information2 .right-box .box {
width: 100%;
}
.urban-plan2 .information2 {
margin-top: 40px;
}
.urban-plan2 .information2 .arrow-wrap {
flex-wrap: wrap;
gap: 80px 0;
}
.urban-plan2 .information2 .arrow-box {
width: 50%;
}
.urban-plan2 .information2 .arrow-box2::before {
display: none;
}
.urban-plan2 .information2 .arrow-box::after {
content: "";
position: absolute;
left: 0;
top: 0;
width: 80%;
height: 98px;
z-index: -1;
}
.urban-plan2 .information2 .arrow-box1::after {
background-color: #aacbf8;
}
.urban-plan2 .information2 .arrow-box2::after {
background-color: #78adf4;
}
.urban-plan2 .information2 .arrow-box3::after {
background-color: #428df0;
}
.urban-plan2 .information2 .arrow-box4::after {
top: 38.5px;
height: 98px;
background-color: #3664a2;
}
.urban-plan2 .information2 .arrow-box4 {
background-position: right 0px;
}
.urban-plan2 .information2 .arrow-box.arrow-box1 .arrow-desc,
.urban-plan2 .information2 .arrow-box.arrow-box2 .arrow-desc,
.urban-plan2 .information2 .arrow-box.arrow-box3 .arrow-desc,
.urban-plan2 .information2 .arrow-box.arrow-box4 .arrow-desc {
width: 100%;
left: calc(50% - 15px);
transform: translateX(-50%);
}
}
@media (max-width: 767.98px) {
.urban-plan1 .inner::before {
display: none;
}
.urban-plan1 .inner .cont-wrap {
flex-direction: column;
align-items: center;
}
.urban-plan1 .inner .title {
width: 230px;
height: 50px;
}
.urban-plan1 .inner .arrow-wrap {
flex-direction: row;
}
.urban-plan1 .inner .arrow-wrap::before {
content: "";
position: absolute;
left: 50%;
top: 15px;
width: 30px;
height: 30px;
background: url(../../www/images/home/img-arrow-short.png) 0 center
no-repeat;
transform: translateX(-50%) rotate(90deg);
}
.urban-plan1 .inner .arrow-wrap.arrow1,
.urban-plan1 .inner .arrow-wrap.arrow2,
.urban-plan1 .inner .arrow-wrap.arrow3 {
background: none;
}
.urban-plan1 .inner .arrow-wrap.arrow3 {
height: auto;
padding-top: 50px;
}
.urban-plan1 .inner .arrow-wrap.arrow3 + .desc-wrap {
margin-top: 10px;
}
.urban-plan1 .inner .desc-wrap {
width: 100%;
}
.urban-plan2 .information1 .inner {
gap: 65px;
}
.urban-plan2 .information1 .box {
width: 100%;
}
.urban-plan2 .information1 .box::after {
left: 50%;
top: 100%;
transform: rotate(90deg) translate(15px, 15px);
}
.urban-plan2 .information1 .desc-txt {
flex-direction: column;
align-items: flex-end;
gap: 0;
}
.urban-plan2 .information2 .arrow-wrap {
gap: 120px 0;
}
.urban-plan2 .information2 .arrow-box {
width: 100%;
height: 83px;
padding-right: 0;
}
.urban-plan2 .information2 .arrow-box.arrow-box1 .arrow-desc,
.urban-plan2 .information2 .arrow-box.arrow-box2 .arrow-desc,
.urban-plan2 .information2 .arrow-box.arrow-box3 .arrow-desc,
.urban-plan2 .information2 .arrow-box.arrow-box4 .arrow-desc {
left: 50%;
}
.urban-plan2 .information2 .arrow-box4 {
height: 146px;
background-size: contain;
background-position: right -0.7px;
}
.urban-plan2 .information2 .arrow-box::before {
display: none;
}
.urban-plan2 .information2 .arrow-box::after {
height: 83px;
}
.urban-plan2 .information2 .arrow-box4::after {
top: 32px;
height: 82px;
}
.urban-plan2 .information2 .arrow-box .arrow-txt {
font-size: 18px;
}
.urban-plan2 .information2 .arrow-box.arrow-box4 .arrow-desc {
top: 114px;
}
.urban-plan2 .information2 .box-info {
padding: 30px 15px 15px;
}
.urban-plan3 .process-wrap {
flex-direction: column;
gap: 75px;
}
.urban-plan3 .process-wrap .box {
width: 100%;
height: auto;
padding-top: 50px;
}
.urban-plan3 .process-wrap .box::after {
left: 50%;
top: 100%;
transform: rotate(90deg) translate(15px, 10px);
}
}
@media (max-width: 425.98px) {
.urban-plan2 .information1 .desc-txt {
font-size: 13px;
}
.urban-plan2 .information2 .box-top .desc-txt {
font-size: 16px;
}
}
/* 20250317 end */
.urban-plan3 .box-info {
display: flex;
align-items: center;
text-align: center;
padding: 20px 15px;
border: 1px solid #ddd;
letter-spacing: -1px;
color: #000;
}
.urban-plan3 .title-wrap > .text-md {
letter-spacing: -1px;
color: #000;
}
.urban-plan3 .title-wrap > .text-md .text-bold {
color: #3b87ee;
}
/* 20250425 start */
.table.tb-environment .scroll-container {
border: 1px solid #ddd;
border-radius: 10px 10px 0 0;
}
.table.tb-environment1 .scroll-container {
border-radius: 10px;
}
.table.tb-environment2 .scroll-container {
border: none;
}
.table.tb-environment table {
border: none;
}
.table.tb-environment2 table td {
border-right: none;
}
.table.tb-environment table thead th {
height: 70px;
font-size: 20px;
font-weight: 400;
color: #000;
background-color: #f9f9f9;
letter-spacing: -1px;
}
.table.tb-environment table thead th:first-child {
border-radius: 10px 0 0 10px;
}
.table.tb-environment table thead th:last-child {
border-radius: 0 10px 10px 0;
border-right: none;
}
.table.tb-environment table tbody .th-bg {
background-color: #f0f7ff;
}
.table.tb-environment table tbody .th-bg:first-child {
border-radius: 10px 0 0 0;
}
.table.tb-environment table tbody .th-bg:last-child {
border-radius: 0 10px 0 0;
}
.table.tb-environment table tbody th:last-child,
.table.tb-environment table tbody td:last-child {
border-right: none;
}
.table.tb-environment table tbody th {
padding: 10px;
background-color: #fff;
font-weight: 400;
color: #000;
letter-spacing: -1px;
}
.table.tb-environment table tbody td {
text-align: left;
letter-spacing: -1px;
}
.table.tb-environment table tbody .td-img-col {
position: relative;
height: 49px;
padding-left: 68px;
}
.table.tb-environment table tbody .td-img-col .td-img {
position: absolute;
left: 0;
top: 0;
}
/* 20250425 end */
/* 20250702 start */
.ico-accessible,
.ico-accessible-men,
.ico-accessible-women {
width: 30px;
height: 30px;
margin-top: -3px;
}
.ico.ico-accessible {
background: url(../../www/images/ico_accessible_toilet.png) center/contain
no-repeat;
}
.ico.ico-accessible-men {
background: url(../../www/images/ico_accessible_toilet_men.png) center/contain
no-repeat;
}
.ico.ico-accessible-women {
background: url(../../www/images/ico_accessible_toilet_women.png)
center/contain no-repeat;
}
/* 20250702 end */