File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
/* 메인 CSS */
.main-page table {
width: 100%;
border-collapse: collapse;
padding: 0;
border: 0;
border-spacing: 0px;
}
.w1400 {
max-width: 1200px;
margin: 0 auto;
position: relative;
clear: both;
min-height: inherit;
}
/* 메인 */
.main-box {
width: 100%;
background: linear-gradient(#425fed, #5dadf6);
}
.main-box-wrap {
padding: 5rem 0;
display: grid;
grid-template-columns: 0.8fr 1fr;
}
.main-text {
color: white;
}
.main-text p {
width: 36rem;
font-family: SBaggroM;
font-weight: 300 !important;
text-shadow: 2px 2px 2px #33333382;
font-size: 2.6rem;
line-height: 200%;
}
.main-text span {
font-size: 5rem;
font-weight: 300 !important;
text-shadow: 2px 2px 2px #33333382;
}
.main-benner {
width: 100%;
}
.main-benner-img img {
width: 100%;
}
.main-notice {
grid-column: 1/3;
padding: 0 0 3rem;
}
.main-notice h2 {
font-size: 1.4rem;
color: white;
padding: 1rem;
}
.main-notice h2 i {
margin-right: 1rem;
}
.m-p-table table tr td p:nth-child(1) {
text-align: left;
}
.modal-content iframe {
height: 300px;
}
.modal-content-box {
text-align: left;
padding: 3rem 0;
}
.modal-content-box > p {
margin-bottom: 1.5rem;
}
.main-popup {
position: fixed;
top: 20%;
right: 40%;
width: 300px;
/* height: 200px; */
margin: 0 auto;
text-align: center;
z-index: 1;
border-radius: 2rem;
box-shadow: 1px 1px 20px #3a3a3a;
background-color: white;
}
.main-popup-div {
border-radius: 2rem;
}
.main-popup-div a{
display: block;
width: 100%;
height: auto;
}
.main-popup img {
width: 100%;
border-top-right-radius: 2rem;
border-top-left-radius: 2rem;
object-fit: cover;
}
.main-popup-input {
padding: 2rem 1.7rem;
display: flex;
justify-content: space-between;
text-align: center;
}
.main-popup-input p{
cursor: pointer;
}
.modal-news-title {
font-size: 2rem;
font-weight: 600;
color: #3f87f7;
}
.file-zone-title {
color: #3f87f7;
flex: 0 0 10%;
}
.modal-content-box > div > ul {
flex: 0 0 85%;
}
/* 퍼즐 */
.main-content-wrap {
width: 100%;
height: 100%;
padding: 60px;
}
.swiper-slide .modal-img img {
width: 100%;
}
.main-puzzle-container {
margin: 0 auto;
display: grid;
overflow: visible;
grid-template-columns: 1fr 1fr 1fr;
}
.main-puzzle-container > div:nth-child(4) {
position: relative;
}
.main-puzzle-container > div:nth-child(4)::after {
position: absolute;
content: "";
width: 90px;
height: 90px;
bottom: -45px;
left: 50%;
background-color: #009d46;
border-radius: 45px;
transform: translateX(-50%);
z-index: -1;
}
.main-grid-name {
width: 100%;
height: 6rem;
display: flex;
font-family: SBaggroM;
background: url(../jpg/notice-banner.png) no-repeat center center;
background-size: cover;
position: relative;
}
.main-grid-name::after {
position: absolute;
content: "";
width: 90px;
height: 90px;
top: -40px;
left: 50%;
background-color: #3f87f7;
border-radius: 45px;
transform: translateX(-50%);
}
.main-grid-name h3 {
width: 77%;
padding-left: 1rem;
line-height: 6rem;
font-size: 2rem;
color: white;
background-size: cover;
position: relative;
}
.main-grid-name button {
border: 0;
padding: 1rem;
font-family: "Pretendard-Regular";
font-size: 1.3rem;
font-weight: 800;
text-shadow: 2px 2px 2px #33333382;
color: white;
background-color: #009d4700;
}
.m-p-table tr {
width: 100%;
height: 10%;
border-top: 1px solid #333;
}
.m-p-table {
overflow: hidden;
}
.m-p-table td {
padding: 0.5rem;
font-size: 1.4rem;
text-align: left;
color: #333;
font-family: "Pretendard-Regular";
font-weight: 700;
}
.m-p-table td p {
font-size: 1.4rem;
padding-top: 1rem;
font-family: "Pretendard-Regular";
font-weight: 500;
text-align: right;
}
.main-wrap-grid {
grid-row: 1 / span 2;
border: 1px solid #3f87f7;
}
.main-wrap-grid-2 {
background: url(../jpg/main-pu.png) no-repeat;
background-size: cover;
z-index: 1;
}
.main-position {
min-height: 150px;
}
.main-position > a {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
height: 100%;
}
.main-wrap-grid-2 div,
.main-wrap-grid-3 div,
.main-wrap-grid-4 div,
.main-wrap-grid-5 div {
width: 100%;
height: 100%;
background-size: 123px 123px;
margin: 0 auto;
}
.main-wrap-grid-2 button,
.main-wrap-grid-3 button,
.main-wrap-grid-4 button,
.main-wrap-grid-5 button {
border: 0;
font-size: 2rem;
font-weight: 300;
color: white;
font-family: SBaggroM;
cursor: pointer;
text-shadow: 2px 2px 2px #3333335b;
background-color: #33333300;
text-align: center;
width: 100%;
padding-bottom: 1.5rem;
}
.main-wrap-grid-4 div img {
width: 110px !important;
text-align: center;
margin: 0 auto;
padding-top: 3rem;
padding-bottom: 2.5rem;
}
.main-wrap-grid-1 div img,
.main-wrap-grid-2 div img,
.main-wrap-grid-3 div img,
.main-wrap-grid-5 div img {
width: 68px !important;
text-align: center;
margin: 0 auto;
padding-top: 4rem;
padding-bottom: 1.5rem;
}
.main-wrap-grid-3 {
background: url(../jpg/m3-1.png) no-repeat center right;
background-size: cover;
}
.main-wrap-grid-3::after {
position: absolute;
content: "";
width: 90px;
height: 90px;
top: 60px;
right: -90px;
background-color: #ffffff;
border-radius: 45px;
transform: translateX(-50%);
}
.main-wrap-grid-4 {
background: url(../jpg/m4.png) no-repeat;
}
.main-wrap-grid-5 {
background: url(../jpg/main-pu2.png) no-repeat center center;
background-size: cover;
}
/* 메인 홍보/뉴스 */
.main-content-news {
width: 100%;
padding: 6rem 0;
background: url(../jpg/123.png) no-repeat center center;
background-size: cover;
}
.main-wrap-news {
width: 100%;
height: 100%;
}
.main-wrap-news-hidden {
width: 100%;
margin: 0 auto;
}
.main-wrap-news-hidden .swiper {
padding: 0 50px;
}
.main-wrap-news-hidden .swiper-button-prev,
.main-wrap-news-hidden .swiper-button-next {
top: 60%;
width: 15px;
height: 15px;
}
.main-wrap-news-hidden .swiper-button-prev:after,
.main-wrap-news-hidden .swiper-button-next:after {
font-size: 25px;
}
.main-wrap-news h3 {
width: 100%;
font-family: SBaggroM;
font-weight: 500;
padding: 0 1rem;
margin-bottom: 3rem;
font-size: 2.5rem;
color: white;
}
/* 히스토리 */
.main-history {
width: 100%;
padding: 3rem;
background-color: #ededed;
}
.main-history-wrap {
text-align: center;
}
.main-history-wrap h1 {
text-align: center;
font-size: 3rem;
padding: 5rem;
font-family: SBaggroM;
color: #3f87f7;
}
.main-history-box {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}
.main-history-box div {
height: 300px;
}
.main-history-box-1,
.main-history-box-2,
.main-history-box-3 {
width: 100%;
display: flex;
flex-wrap: wrap;
padding: 6rem;
justify-content: center;
}
.main-history-box-1 div,
.main-history-box-2 div,
.main-history-box-3 div {
width: 100%;
height: 100%;
}
.main-history-box-1 div span,
.main-history-box-2 div span,
.main-history-box-3 div span {
font-size: 1.8rem;
font-family: "Pretendard-Regular";
}
.main-history-box-1 p:nth-child(2) {
width: 10rem;
margin: 0 auto;
justify-content: center;
background: url(../jpg/m-h-g.png) no-repeat;
height: 10rem;
background-size: contain;
}
.main-history-box-2 p:nth-child(2) {
width: 10rem;
margin: 0 auto;
justify-content: center;
background: url(../jpg/m-h-g-1.png) no-repeat;
height: 10rem;
background-size: contain;
}
.main-history-box-3 p:nth-child(2) {
width: 10rem;
margin: 0 auto;
justify-content: center;
background: url(../jpg/m-h-g-3.png) no-repeat;
height: 10rem;
background-size: contain;
}
.main-history-box-1 h3,
.main-history-box-2 h3,
.main-history-box-3 h3 {
padding: 1rem;
font-size: 1.7rem;
font-family: "Pretendard-Regular";
}
.main-history-box-1 p:nth-child(3),
.main-history-box-2 p:nth-child(3),
.main-history-box-3 p:nth-child(3) {
padding: 1rem;
font-size: 3rem;
font-family: SBaggroM;
color: #09365e;
}
/* 메인 뉴스 팝업창 */
.mySwiper .modal {
width: 100%;
background-color: #000000;
}
/* 파트너사 */
.main-partner {
width: 100%;
height: 100%;
}
.main-partner-wrap {
width: 100%;
height: 400px;
padding-top: 60px;
margin: 0 auto;
text-align: center;
}
.main-partner-wrap h1 {
text-align: center;
font-size: 3rem;
font-family: SBaggroM;
color: #3f87f7;
}
.main-partner-logo {
width: 100%;
height: 90px;
padding: 2rem;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
flex-wrap: nowrap;
justify-content: space-between;
}
.main-partner-img {
width: 100%;
justify-content: center;
}
.lo1 {
background: url(../jpg/logo/ko-w.png) no-repeat;
background-size: 50%;
background-position: center;
}
.lo2 {
background: url(../jpg/logo/keris.gif) no-repeat;
background-size: 50%;
background-position: center;
}
.lo3 {
background: url(../jpg/logo/kefa.png) no-repeat;
background-size: 50%;
background-position: center;
}
.lo4 {
background: url(../jpg/logo/ko-go.jpg) no-repeat;
background-size: 50%;
background-position: center;
}
.lo5 {
background: url(../jpg/logo/edutech.png) no-repeat;
background-size: 50%;
background-position: center;
}
/* ------------------------------------------------------------------------------------------------------ */
/* matching css */
.matching-box-wrap {
width: 100%;
background: linear-gradient(#5dadf6, #2e87da, #5dadf6);
}
.matching-wrap {
padding: 30px 30px;
display: grid;
width: 100%;
justify-content: center;
grid-template-columns: 1fr 1fr 1fr;
}
.matching-wrap div {
width: 100%;
}
.matching-wrap img {
width: 100%;
margin: 0 auto;
justify-content: center;
}
.matching-text {
margin: 0 auto;
text-align: center;
font-size: 4.5rem;
font-family: SBaggroM;
margin-top: 25%;
color: white;
}
.matching-box-wrap-one {
width: 100%;
height: 100%;
padding: 3rem;
margin: 0 auto;
text-align: center;
color: #3f87f7;
background-color: #e2e2e2;
}
.matching-box-grid > h3 {
font-size: 2.6rem;
padding: 3rem;
font-family: SBaggroM;
}
.matching-box-bos {
width: 100%;
place-items: center;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 50px;
}
.matchingbox {
width: 100%;
padding: 3rem;
background-color: #ffffff;
box-shadow: 2px 2px 2px #33333332;
}
.matchingbox h3 {
font-size: 2rem;
color: #3f87f7;
font-family: "Pretendard-Regular";
margin-bottom: 1rem;
}
.matchingbox p:nth-child(3) {
text-align: left;
color: #333;
font-size: 1.5rem;
padding: 1rem;
}
.matchingbox p:nth-child(4) {
text-align: right;
font-size: 1.5rem;
color: #333;
padding: 1rem;
}
.matchingbox-img {
box-shadow: 2px 2px 2px rgba(51, 51, 51, 0) !important;
margin: 0 auto;
padding: 0 !important;
width: 100%;
height: 120px;
}
.matchingbox-img img {
width: 100% !important;
}
.matchingbox-1 {
display: flex;
box-shadow: 0px 0px 0px white !important;
flex-direction: row;
justify-content: flex-end;
}
.matching-box-1 p
.matchingbox-1 p {
text-align: right;
font-size: 1.5rem;
padding: 1rem;
color: rgb(6, 6, 6);
}
.matchingbox-text {
text-align: right;
font-size: 1.3rem;
padding: 1rem;
font-weight: 700;
color: rgb(6, 6, 6);
}
eObjectURL
.matchingbox-text span {
font-weight: 400;
}
.matching-box-main-two {
width: 100%;
margin: 0 auto;
}
.matching-box-grid-two {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
margin: 0 auto;
place-items: center;
/* padding: 3rem 0; */
gap: 50px;
}
.matching-grid-wrap{
padding: 3rem 0;
}
.matching-box-2 {
width: 100%;
padding: 2rem;
background-color: #f9f9f9;
box-shadow: 2px 2px 5px #33333332;
}
.matching-box-2 h5 {
width: 100%;
font-size: 1.5rem;
font-family: "Pretendard-Regular";
margin-bottom: 10px;
}
.matching-box-2 p {
width: 100%;
font-size: 1.2rem;
text-align: right;
justify-content: right;
font-family: "Pretendard-Regular";
}
.matchingbox-2 {
width: 100%;
display: flex;
flex-wrap: nowrap;
justify-content: flex-end;
flex-direction: row !important;
}
.matchingbox-2 p {
width: 19%;
}
.mat-bos img {
width: 50px !important;
z-index: -1;
}
.mat-bos h1 {
font-size: 2.7rem;
z-index: 100 !important;
font-family: SBaggroM;
}
.matDtail-sec {
width: 100%;
/* padding: 0rem 6rem 6rem 6rem; */
display: grid;
grid-template-columns: 1fr;
}
.mat-sec1 {
display: grid;
grid-template-columns: 80% 20%;
padding: 2rem 3rem 1rem 3rem;
background-color: #f4f4f4;
border-top: 1px solid rgb(199, 199, 199);
}
.mat-sec1 h2 {
font-size: 2rem;
color: #3f87f7;
}
.mat-sec1 h2 span {
color: #90baff;
font-size: 1.5rem;
}
.mat-sec1 div {
padding: 1rem 0.5rem;
border-radius: 0.5rem;
margin-top: 3rem;
text-align: center;
background-color: #3f87f7;
}
.mat-sec1 div label {
color: white;
font-size: 1.5rem;
margin-right: 1rem;
}
.mat-sec1 div i {
font-size: 1.5rem;
}
.mat-sec2 {
border-top: 1px solid rgb(199, 199, 199);
border-bottom: 1px solid rgb(199, 199, 199);
}
/* .mat-sec2 div {
padding: 2rem 0;
} */
.mat-sec2-end {
display: grid;
grid-template-columns: 1fr 1fr;
padding: 10px 0;
}
/* .mat-sec2 p {
font-size: 1.7rem;
} */
.mat-sec2-end p {
font-size: 1.5rem;
display: inline-block;
}
.mat-sec2-end > div > p {
cursor: pointer;
}
.mat-sec2-end > div > p > span {
color: #3f87f7;
margin-left: 0.5rem;
}
.mat-sec2-end p:nth-child(2) {
text-align: right;
}
.mat-sec2-bt {
text-align: right;
width: 100%;
padding: 2rem 0;
}
.mat-sec2-bt button {
width: 15%;
padding: 1rem;
background-color: #3f87f7;
color: white;
border-radius: 0.5rem;
font-family: "Pretendard-Regular";
}
.matching-modal2 {
position: fixed;
top: 50%;
left: 50%;
width: 500px;
height: 600px;
transform: translate(-50%, -50%);
background: white;
padding: 20px;
border: 1px solid #ccc;
border-radius: 10px;
z-index: 999;
}
.mat-scroll{
width: 100%;
max-height: 500px;
padding: 0 1.5rem;
overflow-y: scroll ;
}
/* 아래의 모든 코드는 영역::코드로 사용 */
.mat-scroll::-webkit-scrollbar {
width: 10px; /* 스크롤바의 너비 */
}
.mat-scroll::-webkit-scrollbar-thumb {
height: 30%; /* 스크롤바의 길이 */
background: #217af4; /* 스크롤바의 색상 */
border-radius: 10px;
}
.mat-scroll::-webkit-scrollbar-track {
background: rgba(33, 122, 244, .1); /*스크롤바 뒷 배경 색상*/
}
.matching-modal2 h2 {
padding: 1rem 0;
text-align: left;
}
.join-text-bt3 {
color: rgb(0, 0, 0);
border-radius: 0.5rem;
background-color: #3f86f700;
}
.mat-modal-img{
border-top: 0;
border-bottom: 0;
}
.mat-modal-img tr td{
text-align: left;
padding: 10px 0;
}
.mat-modal-img img{
max-width: 100%;
height: auto;
object-fit: cover;
}
.modal-img > p {
padding: 10px 0;
font-size: 1.6rem;
text-align: center;
color: #fff;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
width: 100%;
}
.mat-modal-img button {
width: 100%;
padding: 0.5rem 0;
border-radius: 1rem;
color: white;
background-color: #3f87f7;
}
/* ---------------------------------------------------------------------------------------------- */
/* Data css */
/* 231107수정 김하영 */
#data-app p {
padding: 1rem 0;
font-size: 1.5rem;
font-family: "Pretendard-Regular";
}
#data-app span {
font-weight: 700;
font-family: "Pretendard-Regular";
color: #007aff;
}
.data-wrap-search {
width: 100%;
float: right;
display: grid;
grid-template-columns: 30% 1fr;
}
.data-btn-wrap {
padding: 4rem 0 0 !important;
}
.data-b {
width: 100%;
}
.data-b-b {
width: 100%;
padding: 6rem 0;
font-size: 4rem;
color: #0e0077;
font-family: SBaggroM;
}
.data-bos {
width: 100%;
display: grid;
grid-template-columns: 70% 1fr;
}
.data-text img {
width: 80px;
}
.data-text p {
position: relative;
}
.data-text p::before {
content: "";
position: absolute;
top: -30px;
background-size: 60px 30px;
background-image: url("../jpg/tdata-img-text.png");
width: 60px;
height: 30px;
}
.data-b-main {
width: 100%;
}
.data-b-grid {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}
.data-table-tr {
width: 100%;
}
.input:focus,
.input:focus-visible {
border-color: #3898ec;
outline: none;
}
.dtail-navigation-in {
display: flex;
justify-content: end;
}
.dtail-navigation-in button {
padding: 0.5rem 2rem;
background-color: #007aff;
color: white;
border-radius: 0.5rem;
}
.data-banner button {
position: relative;
width: 80%;
height: 37rem;
border-radius: 2rem;
margin: 0 auto;
}
.data-bos-btn1::after {
height: 30rem;
position: absolute;
content: "";
width: 90px;
height: 90px;
right: -40px;
top: 40%;
border-radius: 45px;
z-index: 1;
background-color: var(--button-bg-color);
}
.data-bos-btn2::after {
height: 30rem;
position: absolute;
content: "";
width: 90px;
height: 90px;
left: 0;
top: 40%;
border-radius: 45px;
transform: translateX(-50%);
background-color: #ffffff;
}
.data-bos-btn2::before {
height: 30rem;
position: absolute;
content: "";
width: 90px;
height: 90px;
right: -40px;
top: 40%;
border-radius: 45px;
background-color: #ffffff;
}
.data-bos-btn3::after {
height: 30rem;
position: absolute;
content: "";
width: 90px;
height: 90px;
left: 0;
top: 40%;
border-radius: 45px;
transform: translateX(-50%);
z-index: 1;
background-color: var(--button-bg-color);
}
.data-banner {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}
.data-bos-btn1 {
padding: 3rem;
background: url(../jpg/data-1.png) no-repeat;
background-position: right bottom;
background-size: 180px;
transform: translateX(-31px);
}
.data-bos-btn2 {
padding: 2rem;
background: url(../jpg/data3.png) no-repeat;
background-position: center bottom;
background-size: 220px;
}
.data-bos-btn3 {
padding: 2rem;
background: url(../jpg/data-2.png) no-repeat;
background-position: left bottom;
transform: translateX(31px);
background-size: 150px;
}
.data-banner h2 {
font-size: 4rem;
display: flex;
flex-wrap: wrap;
transform: translateY(-90px);
font-family: SBaggroM;
font-weight: 500;
}
.data-bos-btn1 h2 {
text-align: left;
color: #014099;
}
.data-bos-btn1 span {
color: #0259c1;
}
.data-bos-btn2 h2 {
color: #0e5e2e;
justify-content: center;
}
.data-bos-btn2 span {
color: #1a8445;
}
.data-bos-btn3 h2 {
justify-content: end;
color: #c26400;
}
.data-bos-btn3 span {
color: #e07e27;
}
.data-bos-btn1 span,
.data-bos-btn2 span {
width: 100%;
}
.data-banner span {
font-weight: 400;
font-size: 1.7rem;
}
.data-banner button p {
width: 80%;
font-size: 1.5rem;
font-family: "Pretendard-Regular";
transform: translateY(-60px);
font-weight: 500;
}
.data-bos-btn1 p {
color: #014099;
text-align: left;
}
.data-bos-btn2 p {
margin: 0 auto;
text-align: center;
color: #0e5e2e;
}
/* --------------------------------------------------------------------------------------------------------- */
/* News css */
/* 모달 */
.modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 9998;
}
.modal-content {
top: 50%;
left: 50%;
position: fixed;
z-index: 9999;
padding: 4rem;
border-radius: 2rem;
background-color: #f9f9f9;
transform: translate(-50%, -50%);
box-shadow: 2px 2px 5px #86868644;
width: 50%;
margin: 0 auto;
}
.modal-content-wrap {
min-height: 250px;
max-height: 500px;
overflow-y: auto;
margin-bottom: 2rem;
}
.modal-content button {
position: relative;
transform: translate(-52%, 0);
top: 10%;
left: 50%;
padding: 2rem 6rem 2rem;
background-color: #007aff;
border-radius: 2rem;
color: white;
font-family: "Pretendard-Regular";
}
/* ----------------------------------- */
.news-bos {
width: 100%;
display: grid;
gap: 5rem;
grid-template-columns: 1fr 1fr 1fr;
}
.news-bos-box {
margin: 0 auto;
width: 100%;
padding: 3rem;
background-color: #f7f7f7;
box-shadow: 2px 2px 5px #8484847c;
}
.news-bos-box div h3 {
width: 240px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 1.7rem;
margin-bottom: 10px;
}
.news-bos-box img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 1rem;
box-shadow: 2px 2px 5px #8484847c;
}
.news-box-end {
display: grid;
grid-template-columns: 1fr 1fr;
}
.news-box-end p {
font-size: 1.5rem;
color: #3f87f7;
}
.news-box-end p span {
color: #333;
}
.news-box-end p:nth-child(2) {
text-align: right;
}
/* ---------------------------------------------------------------- */
/* Notice css */
.noti-bos {
width: 100%;
}
.noti-sec {
width: 100%;
}
/* ----------------------------------------------------------------------- */
/* Guide css */
.guide-bos {
width: 100%;
height: 100%;
}
.guide-logo {
width: 100%;
display: grid;
grid-template-columns: 80% 20%;
}
.guide-logo-bt i,
.guide-logo-bt a {
color: #ffffff;
text-align: center;
}
.guide-sec {
padding: 3rem;
}
.guide-sec img {
width: 100%;
}
.guide-logo-bt {
background-color: #00335a;
padding-right: 3rem;
font-family: SBaggroM;
text-align: right;
margin: 0 auto;
color: #ffffff;
padding: 1.5rem;
border-radius: 2rem;
cursor: pointer;
}
/* ------------------------------------------------------------------------------ */
/* Technology css */
.tech-bos {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 5rem;
text-align: center;
}
.tech-box-sec {
padding: 3rem;
background-color: #f9f9f9;
box-shadow: 2px 2px 5px rgba(191, 191, 191, 0.447);
}
.tech-box-sec-h3 {
margin-bottom: 1.5rem;
}
.tech-box-sec-h3 h3 {
width: 240px;
flex: 0 0 60%;
font-size: 1.9rem;
font-family: "Pretendard-Regular";
text-align: left;
color: #007aff;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
ul.tech-bos li div img {
box-shadow: 3px 3px 6px rgba(191, 191, 191, 0.447);
width: 100%;
height: 15rem;
margin-bottom: 1.5rem;
background-size: cover;
border-radius: 1rem;
}
.tech-box-sec .blue-btn {
width: 100%;
margin-left: 0px;
}
.tech-detail {
width: 100%;
}
.tech-report {
display: flex;
justify-content: space-between;
border-top: 1px solid #132331;
padding: 21px 10px;
background-color: #f9f9f9;
}
.tech-view {
padding: 21px 0 0;
border-bottom: 1px solid #132331;
}
.tech-report h2 {
font-size: 2.5rem;
color: #007aff;
}
.tech-report button {
padding: 1rem 2rem;
color: white;
background-color: #007aff;
border-radius: 0.5rem;
font-weight: 700;
}
.tech-info {
padding: 31px 0 31px;
border-top: 1px solid #132331;
display: flex;
align-items: center;
}
.tech-info-img {
width: 700px;
}
.tech-info-img img {
padding: 22px 28px;
background: #f2f4f6;
width: 100%;
height: auto;
text-align: center;
box-sizing: border-box;
}
.tech-txt-wrap {
width: 100%;
margin: 30px;
}
.tech-table {
border-top: 2px solid #e5e5e5 !important;
border-bottom: 2px solid #e5e5e5 !important;
}
.tech-table tr {
border-top: 1px solid #e5e5e5;
}
.tech-table td {
border-top: 0px solid #cbcbcb !important;
text-align: left;
}
.tech-table th {
background-color: #00000000;
color: #000000;
}
.tech-txt-wrap li > * {
display: inline-block;
font-weight: 400;
font-size: 2rem;
padding: 15px 0 15px;
}
.tech-table th p {
min-width: 152px;
max-width: 152px;
position: relative;
font-weight: 700;
}
.tech-table th p::after {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 3px;
height: 10px;
background: #a6a6a6;
content: "";
}
.tech-btn {
width: 100%;
padding: 21px 10px;
}
.tech-btn button {
float: right;
padding: 1rem 2rem;
color: white;
background-color: #007aff;
border-radius: 0.5rem;
font-weight: 700;
}
.date {
text-align: left;
padding: 1rem 0;
font-size: 1.3rem;
}
.keyword-zone {
text-align: left;
overflow: hidden;
height: 55px;
}
.keyword-zone span {
display: inline-block;
padding: 5px 10px;
border-radius: 3px;
margin-right: 5px;
background-color: #dddd;
margin-bottom: 5px;
}
/* 가리기 */
.tech-box-sec-img {
box-shadow: 3px 3px 6px rgba(191, 191, 191, 0.447);
width: 100%;
height: 15rem;
margin-bottom: 1.5rem;
background-color: white;
border-radius: 1rem;
}
.tech-box-fillter {
position: relative;
background-color: rgba(248, 248, 248, 0.5);
}
.overlay-text {
position: relative;
top: -50%;
font-family: SBaggroM;
font-weight: 400;
font-size: 2rem;
color: #848484;
}
.tech-search-box {
display: grid;
/* border: 1px solid red; */
justify-content: end;
grid-template-columns: 30%;
}
/* --------------------------------------------------------------------------- */
/* lnfo css */
.info-sec,
.info-sec-1 {
padding: 6rem 0;
margin: 0 auto;
border: 1px soli/d #333;
width: 60%;
}
.info-sec div,
.info-sec-1 > div {
display: grid;
border-bottom: 1px solid #333;
grid-template-columns: 30% 2fr;
}
.info-sec div p {
padding: 3rem;
font-size: 1.5rem;
color: #007aff;
}
.pwinfro span {
padding: 2rem !important;
}
.info-sec div span {
padding: 3rem;
font-size: 1.2rem;
}
.info-sec button {
padding: 1rem 0.5rem;
background-color: #007aff;
color: white;
border-radius: 0.5rem;
}
.info-sec-1 div a {
padding: 3rem;
}
.info-keword-far {
grid-row: 1 / span 3;
}
.info-sec-1 > div > p {
padding: 3rem 0;
font-size: 1.2rem;
color: #007aff;
}
.info-sec-1 span {
padding: 3rem 0;
font-size: 1.2rem;
}
.company-logo {
margin: 2rem 0;
}
.company-info .blue-btn {
width: 50%;
margin: 0 auto;
text-align: center;
}
.info-sec-1 section img {
width: 260px;
height: 120px;
border-radius: 1rem;
overflow: hidden;
margin: 0 auto;
box-shadow: 2px 2px 5px #33333345;
}
.info-pw {
display: grid;
grid-template-columns: 30% 1fr 1fr !important;
}
.info-pw button {
margin: 2rem;
border-radius: 0.5rem;
background-color: #3f87f7;
color: white;
}
.info-sec-bt {
width: 60%;
margin: 0 auto;
padding: 6rem 0;
text-align: right;
}
.info-box-button button {
padding: 3rem 2rem 3rem 2rem;
margin-right: 3rem;
color: white;
border-radius: 2rem;
}
.info-td input {
height: 100%;
width: 100%;
padding: 2rem;
border-radius: 0.5rem;
}
.info-sec p button {
padding: 0.5rem 0.5rem;
background-color: #007aff;
color: white;
border-radius: 0.5rem;
}
.info-pw-maill div {
display: flex;
border: 0px;
padding: 0 4rem;
}
.info-th-email {
grid-template-columns: 30% 1fr 20% !important;
}
.info-th-email > button {
margin: 3rem 0;
}
.info-th-file {
grid-template-columns: 20% 1fr 30% !important;
}
/* Introduction css */
.intro {
width: 100%;
padding: 6rem;
}
.intro-logo {
width: 100%;
padding: 6rem 2rem;
}
.intro-logo h1 {
font-size: 3rem;
font-family: SBaggroM;
font-weight: 500;
color: #2c407f;
}
.info-keword {
padding: 0 !important;
text-align: left !important;
padding: 3rem 0 !important;
font-size: 1.5rem;
color: #007aff;
}
.intro-text {
padding: 3rem;
}
.intro-text h3 {
padding: 1rem 1rem 3rem;
font-size: 2rem;
color: #00335a;
font-family: "Pretendard-Regular";
}
.intro-text i {
padding: 1rem;
color: #00335a;
font-family: "Pretendard-Regular";
}
.intro-text p {
padding: 1rem;
font-size: 1.5rem;
color: #00335a;
font-family: "Pretendard-Regular";
}
.intro-img {
width: 100%;
padding: 3rem;
display: grid;
gap: 0;
grid-template-columns: 1fr 1fr 1fr;
}
.intro-img img {
width: 100%;
}
.intro-img img:nth-child(2) {
transform: translateY(-3.5rem);
}
.intro-img img:nth-child(3) {
transform: translateY(-6.9rem);
}
/* .info-sec-summary p {
color: #000000;
} */
/* wg커뮤니티 전문가 협의체 페이지*/
.wg-wrap-h2 {
font-weight: 200px;
padding: 10px 5rem;
font-size: 1rem;
}
.wg-wrap {
width: 100%;
}
.wg-wrap-search {
width: 100%;
padding: 3rem 0;
}
.wg-wrap-search p {
font-size: 1.5rem;
}
.wg-table {
width: 100%;
}
.wg-table tr th {
background-color: #007aff;
color: white;
padding: 1rem;
}
.wg-search-bos {
width: 100%;
padding: 2rem 6rem;
justify-content: center;
box-shadow: 1px 1px 5px #cccccc41;
background-color: #f9f9f9;
margin-bottom: 30px;
}
.wg-grid-1 {
padding: 1rem;
display: grid;
grid-template-columns: 200px 200px 1fr 200px;
gap: 1rem;
align-items: end;
}
.wg-grid-1 .data-table-search {
width: 100%;
}
.wg-grid-1 select {
margin-left: 0;
}
.wg-title label {
font-size: 1.5rem;
}
#groupSelect {
width: 100%;
padding: 9px;
}
/* 매칭관리css */
.matching-box-button {
padding: 1.5rem 0;
display: flex;
}
.matching-box-button div {
display: inline-block;
cursor: pointer;
}
.matching-box-button div input[type="radio"] {
display: none;
}
.matching-box-button div label {
font-size: 16px;
width: 100%;
color: #000000;
padding: 1.5rem 9rem;
border: 1px solid rgb(180, 180, 180);
border-bottom: 0px;
border-top-right-radius: 1rem;
border-top-left-radius: 1rem;
background-color: #ffffff;
color: #666;
}
.matching-box-button div input[type="radio"]:checked + label {
color: #007aff;
border-bottom: 0px;
background: linear-gradient(#71aef0, rgb(255, 255, 255));
border-bottom: 1px solid #fff;
}
.matching-wrap-sub {
width: 100%;
margin: 0 auto;
border-bottom: 1px solid #aaa;
}
.macting-manage-h2 {
font-size: 4rem;
padding: 2rem 0;
}
.inbox {
display: grid;
grid-template-columns: 1fr;
}
.matching-section-box h2 {
font-size: 2rem;
}
.inbox-sub,
.outbox-sub {
padding: 6rem 0;
display: grid;
justify-content: center;
align-items: center;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 3rem;
}
.inbox-img {
text-align: center;
border-radius: 1rem;
background-color: #f9f9f9;
padding: 1.5rem 2.5rem;
box-shadow: 1px 1px 5px #33333344;
}
.img-wrap{
width: 100%;
height: 100px;
margin-bottom: 2rem;
}
.inbox-img h4 {
font-size: 1.5rem;
text-align: left;
margin-bottom: 10px;
}
.img-wrap img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 1rem;
}
.inbox-img-blur img {
filter: blur(1.5px);
box-shadow: 1px 1px 3px #33333337;
}
.inbox-button {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.inbox-img-2 img {
width: 90mm;
height: 50mm;
border-radius: 2rem;
}
.inbox-img-2 {
width: 100%;
display: grid;
place-items: center;
border-radius: 2rem;
background-color: #f9f9f9;
padding: 3rem 3rem 1rem 3rem;
box-shadow: 1px 1px 5px #33333344;
}
.inbox-img-2 div {
margin: 1rem;
}
.inbox-img-2 button {
width: 100%;
padding: 1rem 2rem;
border-radius: 1rem;
background-color: #007aff;
color: white;
font-weight: 700;
}
.inbox-img-box {
width: 260px;
height: 120px;
}
.matching-sec h1 {
font-size: 2rem;
padding: 2rem 0 1rem 0;
}
.matching-section-box {
padding: 6rem 0;
}
.downbtn-none {
display: none;
padding: 1rem !important;
}
.matching-box-bos .matchingbox-img {
width: 100%;
height: 175px;
overflow: hidden;
background-color: #f9f9f9;
border-radius: 1rem;
}
.introduce-title{
font-size: 2rem;
font-weight: 800;
color: #007aff;
text-align: left;
}
/* 모달css */
.matchingmodal {
width: 100%;
height: 100%;
background-color: #00000017;
position: fixed;
top: 0;
left: 0;
overflow: auto;
background-color: rgb(0, 0, 0);
background-color: rgba(0, 0, 0, 0.4);
}
.matching-modal-box {
background-color: #fefefe;
margin: 15% auto;
padding: 3rem;
border: 1px solid #888;
width: 30%;
border-radius: 2rem;
text-align: center;
position: relative;
}
.matching-modal-box h1 {
font-size: 2rem;
text-align: left;
}
.matching-modal-box img {
width: 100%;
height: 219px;
object-fit: cover;
margin-bottom: 30px;
}
.matching-modal-box button {
width: 100%;
background-color: #007aff;
color: white;
padding: 10px;
border-radius: 5px;
}
.matching-box-text {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
font-size: 2rem;
font-weight: 800;
color: #b1b1b1;
text-align: center;
}
/* 회원가입 */
/* 명함추가 */
.join-sec5-1 {
width: 100%;
height: 100%;
padding: 1rem 0;
display: grid;
grid-template-columns: 160px 2fr;
gap: 1rem;
}
.join-imgbox {
display: block;
width: 300px;
height: 175px;
line-height: 175px;
font-size: 2rem;
color: white;
text-align: center;
background-color: #cfcfcf;
box-shadow: 1px 1px 5px #f9f9f9;
overflow: hidden;
position: relative;
}
.join-imgbox > p {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
cursor: pointer;
}
.join-imgbox > img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.join-imgbox:hover {
background-color: #5a5a5a;
}
.join-imgbox a {
width: 100%;
height: 100%;
cursor: pointer;
}
.join-imgbox label {
display: block;
width: 300px;
height: 175px;
}
/* 모달 */
.joinmodal {
width: 100%;
height: 100%;
background-color: #33333324;
margin: 0 auto;
text-align: center;
padding: 3rem;
position: fixed;
top: 0;
left: 0;
}
.join-modal-a {
position: fixed;
top: 50%;
left: 50%;
padding: 4rem;
border-radius: 2rem;
background-color: #f9f9f9;
transform: translate(-50%, -50%);
box-shadow: 2px 2px 5px #86868644;
width: 25%;
}
.join-modal-a h1 {
font-size: 2rem;
padding: 3rem 0 0 0;
}
.join-modal-a p {
width: 85%;
margin: 0 auto;
font-size: 1.5rem;
padding: 3rem;
text-align: left;
}
.join-modal-a button {
width: 20%;
background-color: #3f87f7;
border-radius: 1.5rem;
color: white;
font-family: "Pretendard-Regular";
}
/* ----------------------------------- */
.join-b {
width: 75%;
margin: 0 auto;
}
/* 임시 css */
/* -------------- */
.login-info > div > p {
color: rgb(255, 0, 0);
padding: 0 1rem;
font-size: 1.5rem;
}
.join-b-button {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr;
margin: 0 auto;
gap: 10rem;
flex-direction: row;
}
.join-sec-sub span {
display: block;
padding: 1rem 0;
}
.join-text {
font-size: 1.2rem;
color: red;
padding: 2rem;
}
.join-b-button input[type="radio"] {
display: none;
}
.join-b-button button {
height: 20rem;
display: grid;
grid-template-columns: 1fr;
border-radius: 2rem;
text-align: center;
box-shadow: 2px 2px 5px #86868644;
}
.join-b-button button p {
padding: 3rem 0 0;
font-size: 3rem;
font-family: SBaggroM;
color: #014099;
}
.join-b-button button img {
width: 200px;
height: 100px;
text-align: center;
margin: 0 auto;
background-position: center;
}
.join-b-button button:nth-child(1).background {
background-color: #c91b1b;
}
.join-b-button button:nth-child(2) {
background-color: #e6fff1;
}
.join-b-button button:nth-child(2) img {
width: 100px;
}
.join-b-button button:nth-child(2) p {
color: #0e5e2e;
}
.radio-t {
padding: 3rem;
font-size: 3rem;
border-radius: 2rem;
font-family: SBaggroM;
margin: 0 auto;
box-shadow: 2px 2px 5px #33333330;
text-align: left;
display: flex;
justify-content: center;
flex-direction: column;
}
.t1 {
width: 100%;
padding: 6rem;
color: #014099;
background-color: #e2ecfc;
gap: 74px;
}
.t1 img {
width: 90%;
margin: 0 auto;
}
.t2 img {
width: 70%;
margin: 0 auto;
}
.t2 {
width: 100%;
padding: 6rem;
color: #0e5e2e;
background-color: #e6fff1;
}
.join-b span {
font-size: 1.5rem;
font-family: "Pretendard-Regular";
color: #3f87f7;
}
.join-sub-input input[type="file"] {
width: 100%;
padding: 1rem;
border: 1px solid #eee;
border-radius: 5px;
}
.btn-upload-join {
width: 100%;
background-color: #3f87f7;
font-size: 1.5rem;
padding: 1rem;
border-radius: 0.5rem;
text-align: center;
color: white;
cursor: pointer;
}
.login-info-grid-1 {
padding: 2rem 0;
}
#email_sel {
padding: 9px 62px;
}
.join-blue-btn {
width: 100% !important;
}
.login-info,
.login-info2 {
width: 100%;
margin: 0 auto;
padding: 50px 0;
}
.login-info2 {
display: block;
}
.login-info2.Chacked {
display: none;
}
.login-info h3,
.login-info2 h3 {
color: #0e0077;
font-size: 2rem;
font-family: "Pretendard-Regular";
padding: 3rem 1rem 1rem 1rem;
}
.joinsub0 {
padding: 1rem 0;
display: grid;
gap: 1rem;
grid-template-columns: 160px 1fr 0.5fr;
align-items: start;
}
.joinsub0 p {
color: red;
font-size: 1.4rem;
padding: 0.5rem;
}
.j-s-3 {
padding: 1rem;
display: grid;
grid-template-columns: 2fr;
}
.j-s-3 div {
padding: 1rem 0;
}
.j-s-3 input {
height: 100%;
}
.join-sec4 {
padding: 1rem;
}
.joinsub {
padding: 1rem 0;
display: grid;
grid-template-columns: 160px 2fr;
gap: 1rem;
align-items: start;
}
.joinsub p {
color: #007aff;
}
.join-sec6 {
padding: 1rem 0;
display: grid;
grid-template-columns: 160px 1fr;
gap: 1rem;
align-items: start;
}
.join-sec6 div:nth-child(3) {
font-size: 1.5rem;
font-family: "Pretendard-Regular";
}
.login-info-grid {
display: grid;
grid-template-columns: 180px 1fr;
gap: 5rem;
}
.info-th {
padding: 3rem 0 !important;
text-align: left !important;
}
.login-info-grid-3 {
width: 100%;
height: 100%;
padding: 1rem 0;
}
.info-sec-summary {
padding: 2rem 0;
grid-template-columns: 1fr !important;
}
/* .info-sec-summary div {
grid-template-columns: 1fr;
} */
.info-sec-summary textarea {
height: 200px;
}
.info-keword {
grid-template-columns: 1fr 1fr 1fr 1fr !important;
}
.info-keword span {
margin: 2rem 1rem !important;
padding: 1rem !important;
text-align: center;
border-radius: 0.5rem;
}
.file-input {
cursor: pointer;
}
#file-input {
display: none;
}
.matchingbox-img {
position: relative;
}
.matchingbox-img label {
position: absolute;
width: 100%;
height: 100%;
text-align: center;
line-height: 170px;
font-size: 2rem;
color: #929292;
}
.company-info p {
margin-bottom: 2rem;
}
.uploaded-box {
position: relative;
top: 0;
left: 0;
width: 95%;
margin: 0 auto;
}
.uploaded-box-radius {
width: 71%;
height: 122px;
background-color: #838383;
border-radius: 50%;
overflow: hidden;
margin: 0 auto;
margin-bottom: 2rem;
position: relative;
top: 0;
left: 0;
}
.uploaded-box-radius img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.join-sec0 div p {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
line-height: 118px;
border-radius: 50%;
text-align: center;
color: #ffffff;
font-size: 2.5rem;
font-family: "Pretendard-Regular";
box-shadow: 2px 2px 5px #33333328;
}
.joinsub0-1 {
padding: 1rem 0;
display: grid;
grid-template-columns: 170px 2fr;
align-items: start;
}
.joinsub0-1 p {
color: #007aff;
}
.join-email-bt {
font-size: 1.6rem;
}
.join-email-bt input[type="checkbox"] {
margin: 1rem;
transform: scale(1.5);
}
.join-email-bt span {
color: #898989;
font-family: "Pretendard-Regular";
}
.join-end-bt {
display: grid;
grid-template-columns: 25% 73%;
gap: 1rem;
padding: 1rem 0;
}
.join-end-bt button {
padding: 2rem;
cursor: pointer;
border-radius: 1.2rem;
font-size: 1.5rem;
font-family: "Pretendard-Regular";
}
.join-end-bt button:nth-child(2) {
background-color: #3f87f7;
color: white;
}
.email-sec {
display: grid;
grid-template-columns: 1fr 30px 1fr 1fr 1fr;
align-items: start;
}
.email-sec div {
font-size: 1.2rem;
font-family: "Pretendard-Regular";
text-align: center;
gap: 1rem;
}
.email-sec div:nth-child(2) {
padding: 1rem 0;
}
.address-sec > div {
margin-bottom: 10px;
}
.address-sec .add-search input {
flex: 0 0 79%;
}
.address-sec .add-search button {
flex: 0 0 20%;
}
.tell-sec {
display: grid;
grid-template-columns: 1fr 30px 1fr 30px 1fr;
align-items: center;
}
.tell-sec span {
text-align: center;
}
.select-keyword {
border: 1px solid #aaa;
border-radius: 0.5rem;
padding: 1rem;
width: 100%;
min-height: 286px;
margin-bottom: 1rem;
}
.keyword,
.selected-keyword {
display: block;
padding: 1rem;
border-radius: 3px;
background: #eee;
color: #333;
font-size: 1.4rem;
}
.keyword-label:checked + label {
background: #d6e6ff;
color: #007aff;
}
.keyword-wrap {
padding: 1rem;
}
.filtering{
margin-bottom: 30px;
}
.keyword-wrap ul {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 1rem;
}
.select-keyword ul {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
}
.selected-keyword {
background: #d6e6ff;
color: #007aff;
}
.selected-keyword span:nth-child(2) {
cursor: pointer;
}
/* 로그인 모달창 css */
.login-modal {
margin: 0 auto;
text-align: center;
}
.login-modal h1 {
padding: 1rem 0;
}
.login-modal > p {
padding: 1rem 0;
}
/* ----------------------------------- */
.login-sec {
width: 35%;
margin: 0 auto;
padding: 15rem 0;
}
.login-logo {
width: 100%;
}
.login-logo-d img {
width: 300px;
text-align: center;
margin: 0 auto;
padding: 3rem;
}
.login-logo-d h1 {
font-family: SBaggroM;
font-weight: 500;
color: #063a6d;
text-align: center;
padding: 3rem 0;
font-size: 2rem;
}
.login-input {
width: 100%;
display: flex;
flex-direction: column;
}
.login-input-d div {
width: 100%;
padding: 1rem 0;
}
.ID input,
.PW input {
height: 6rem;
border: 1px solid #9a9a9a;
border-radius: 1.2rem;
padding: 1rem;
color: #9a9a9a;
}
.login-checkbox {
width: 100%;
}
.login-checkbox-i {
text-align: left;
/* margin: 0 auto; */
}
.flex .login-checkbox-i input[type="checkbox"] {
text-align: left;
margin: 1rem;
transform: scale(1.5);
}
.login-checkbox-i span {
font-size: 1.5rem;
font-family: "Pretendard-Regular";
}
.login-checkbox-b {
padding: 2rem 0;
text-align: center;
}
.login-checkbox-b button {
padding: 1rem;
color: #333;
font-family: "Pretendard-Regular";
font-weight: 500;
font-size: 1.5rem;
cursor: pointer;
background-color: #06396d00;
}
.login-checkbox-b button:nth-child(1) {
position: relative;
}
.login-bu-after::after,
.login-bu-after::after {
content: "ㅣ";
float: right;
display: block;
margin-left: 20px;
}
.login-button {
width: 100%;
}
.login-button button {
width: 100%;
padding: 2rem;
background-color: #3f87f7;
color: white;
font-size: 1.7rem;
font-family: "Pretendard-Regular";
border-radius: 1.2rem;
cursor: pointer;
}
.logout {
border-left: 1px solid #fff;
color: #fff;
cursor: pointer;
}
/* 스와이퍼--------------------------------------- */
.swiper-button-prev:after,
.swiper-button-next:after {
color: aliceblue;
}
.swiper-button-next,
.swiper-button-prev {
margin-top: -50px !important;
color: aliceblue;
}
.main-benner .swiper {
width: 666px;
}
.swiper-2 {
height: 200px;
padding: 10rem;
border-bottom: 1px solid rgb(209, 209, 209);
}
.swiper-div p {
text-align: center;
padding: 1rem;
font-size: 1.7rem;
color: white;
}
.swiper-slide {
cursor: pointer;
}
.swiper-notice {
border-radius: 0.5rem;
border: 1px solid white;
background-color: #00000034;
padding: 0.5rem;
height: 40px;
}
.slide1 {
height: 32px;
width: 98%;
padding: 1.1rem 1rem;
color: white;
font-size: 1.3rem;
z-index: 100000;
white-space: nowrap;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.swiper-2 {
height: 100px;
transition-timing-function: linear;
}
/*--------------------------------------- */
/* 아이디 pw찾기 */
.IDsearch-logo {
padding: 0rem 1rem 3rem 1rem;
font-family: SBaggroM;
font-weight: 400;
color: #2c407f;
}
.userIDsearch-box-button {
display: flex;
justify-content: space-between;
}
.userIDsearch-box-button input {
display: none;
}
.userIDsearch-box-button div {
width: 50%;
padding: 2rem;
text-align: center;
border-top-right-radius: 1rem;
border-top-left-radius: 1rem;
border: 1px solid gainsboro;
border-bottom: 0px;
}
.IDsearch-content {
border: 1px solid gainsboro;
padding: 3rem 1rem;
}
.IDsearch-content div:nth-child(1) p,
.userpwsearch div:nth-child(1) p {
font-size: 1.5rem;
padding: 1rem 0;
}
.IDsearch-content details ul,
.IDsearch-content-two details ul,
.userpwsearch ul {
width: 80%;
margin: 0 auto;
margin-bottom: 10px;
}
.IDsearch-content details li,
.IDsearch-content-two details li,
.userpwsearch li {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.5rem 0;
}
.IDsearch-content details li input[type="text"],
.userpwsearch li input[type="text"] {
width: 60%;
}
.inbox-radio {
display: flex;
}
.inbox-radio div {
display: grid;
padding: 0 3rem;
grid-template-columns: 1fr 1fr;
}
.inbox-radio p {
font-size: 1.5rem;
padding: 3rem 0;
}
.IDsearch-content button,
.userpwsearch button,
.IDsearch-content-two button {
width: 100%;
margin-left: 0;
}
.userpwsearch {
padding: 1rem;
border: 1px solid gainsboro;
}
.userpwsearch ul {
margin-bottom: 2rem;
}
/* 비밀번호 변경 버튼 모달 */
.pwchange2 {
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
position: fixed;
top: 0;
left: 0;
z-index: 1000000;
}
.pwchange-div {
width: 500px;
height: auto;
background-color: #fff;
padding: 30px 60px;
position: fixed;
top: 50%;
left: 50%;
border-radius: 1rem;
transform: translate(-50%, -50%);
}
.pwchange-div p {
font-size: 2rem;
padding: 3rem 0;
font-weight: 700;
text-align: center;
}
.pwchange-div ul > li {
padding: 0.5rem 0;
}
.pwchang-div > div:nth-child(1) {
padding: 1rem 0;
}
.idsearch div span,
.idsearch div input {
margin-right: 2rem;
padding: 2rem 0;
}
.pwchange2-button {
display: flex;
flex-wrap: nowrap;
padding: 1rem 0;
}
.pwchange2-button .dark-gray-btn {
margin: 0px;
}
.notice-search {
width: 30%;
display: flex;
gap: 1rem;
}
.notice-search input:nth-child(2) {
width: 20%;
}
/* map */
.map-page .sec-bos div {
width: 100%;
}
.map-page img {
width: 90%;
padding: 2rem;
margin: 0 auto;
}
.map-page .map-img {
width: 100%;
}
.map-page .img2 {
display: none;
}
.map-page .sec-bos {
width: 100%;
padding-bottom: 6rem;
display: grid;
grid-template-columns: 1fr;
}
.map-page .map-header {
display: grid;
grid-template-columns: 10px 1fr;
}
.map-page .map-header h1 {
font-size: 2.5rem;
padding: 2rem;
}
.map-page .sec1 h2 {
padding: 0.5rem 3rem;
font-size: 2rem;
font-weight: 700;
color: #0b3a6e;
}
.map-page .sec1 p {
padding: 0.5rem 7rem;
font-size: 1.7rem;
font-weight: 600;
}
.map-page .sec-book {
display: grid;
padding: 1rem 2rem;
grid-template-columns: 10px 1fr;
}
.map-page .sec-book i {
font-size: 1.7rem;
padding: 1rem 3rem;
color: #0b3a6e;
}
.map-page .sec-book p {
padding: 0.5rem 4rem;
color: #0b3a6e;
}
.map-page span {
color: #2b6fa9;
}
.modal-img {
margin-bottom: 3rem;
}
.main-notice-top2 {
width: 975px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: left;
}
.tech-txt-wrap p {
width: 300px;
}
.modal-text{
text-align: center;
font-size: 1.6rem;
line-height: 180%;
}