/* 공통 */ a.pop-logo { display: none; font-weight: 400; font-size: 18px; line-height: 27px; color: #ffffff; align-items: center; } a.pop-logo img { margin-right: 10px; } .mo-ver { display: none; } .wrap header .inner h1 a span.title-1 { border-left: none; margin: 0; } .go_btn { display: none; } #mo_search_icon { display: none; margin-right: 24px; } .btn-go-top.mo-go-top { bottom: 86px; } #mo-member-btn { display: none; width: calc(100% - 32px); height: 50px; background: #376795; border-radius: 5px; position: absolute; right: 16px; top: -65px; z-index: 19; position: fixed; top: inherit; bottom: 20px; font-weight: 500; font-size: 14px; color: #ffffff; } .mo-nav-wrap { width: 0; height: 100vh; background: #fff; position: fixed; top: 0; right: 0; z-index: 100; transition: all 0.2s ease-in; display:none;} .mo-nav-wrap.show { width: 286px;display:inline-block;} .mo-nav-wrap .menu_bg { display: none; width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.6); z-index: -1; transition: all 0.2s ease-in; } .mo-nav-wrap.show .menu_bg { display: block; } .mo-nav-wrap .login_box { width: 100%; height: 267px; background: linear-gradient(90deg, #275f95 0%, #427cae 62.5%); padding: 135px 16px 18px; box-sizing: border-box; } .mo-nav-wrap .login_box h2 { font-weight: 500; font-size: 18px; line-height: 27px; color: #ffffff; } .mo-nav-wrap .login_box .btns_box { display: flex; margin-top: 20px; } .mo-nav-wrap .login_box .btns_box button { width: 50%; height: 40px; background: #374d64; border-radius: 3px; font-weight: 500; font-size: 12px; color: #ffffff; } .mo-nav-wrap .login_box .btns_box button.btn_login { margin-right: 16px; } .mo-nav-wrap .menu_box { height: calc(100vh - 267px); overflow: auto; background: #fff; } .mo-nav-wrap .menu_box .mo_menu { background: #fff; } .mo-nav-wrap .menu_box .mo_menu .wrap { width: 100%; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; color: #333333; } .mo-nav-wrap .menu_box .mo_menu.show > div { color: #376795; font-weight: 500; } .mo-nav-wrap .menu_box .mo_menu .drop_icon { width: 14px; height: 10px; background: url("/images/icon/icon-mo-show.png") no-repeat; background-position: center; } .mo-nav-wrap .menu_box .mo_menu.show .drop_icon { background: url("/images/icon/icon-mo-hide.png") no-repeat; background-position: center; } .mo-nav-wrap .menu_box .mo_menu a .drop_icon { visibility: hidden; } .mo-nav-wrap .menu_box .mo_menu .name, .mo-nav-wrap .menu_box .mo_menu .drop_icon { padding: 16px 16px; } .mo-nav-wrap .menu_box .sub-menu { display: none; background: #f0f0f0; } .mo-nav-wrap .menu_box .mo_menu.show .sub-menu { display: block; padding: 16px 26px; } .wrap .nav-wrap .inner .left { display: none; } .pop-login .inner .mo-pop-Title { display: none; font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; color: #222222; margin-bottom: 55px; } .pop-login .inner .mo-pop-Title span { font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; color: #376795; } .pop-login-connect .inner h3.row, .pop-login-password .inner h3.row { display: none; padding: 0; font-size: 22px; line-height: 33px; margin-bottom: 20px; } .pop-login-connect .inner h3.row span, .pop-login-password .inner h3.row span { color: #376795; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-chk span { margin-left: 10px; } /* 공지사항 */ .list-table-wrap li span.t-wrap { display: flex; align-items: center; } .list-table-wrap li.t-tit-line .t-tit { justify-content: center; } .list-table-wrap li .t-tit { width: 68%; align-items: center; } .list-table-wrap li span.t-info { flex: 1; display: flex; align-items: center; } .list-table-wrap li span.t-info > span { display: flex; align-items: center; justify-content: center; } /* .list-table-wrap li .t-writer { width: 36%; } .list-table-wrap li .t-date { width: 36%; } */ .list-table-wrap li .t-file { flex: 1; } /* 희망 방문일 */ .cart .inner .loan-confirm .tabs_item .visit-select-box { border-top: 1px solid #333; border-bottom: 1px solid #ddd; padding: 40px 0; margin-bottom: 20px; } .cart .inner .loan-confirm .tabs_item .visit-select-box h3 { border-bottom: none; } .cart .inner .loan-confirm .tabs_item .list-cart-wrap { margin-bottom: 20px; } .cart .inner .loan-confirm .visit-text { color: #666666; font-size: 14px; font-weight: 400; text-align: left; margin-bottom: 40px; } .cart .inner .loan-confirm .visit-select-box select { height: 36px; line-height: 36px; padding: 0px 2%; border: 1px solid #ddd; border-radius: 3px; margin: 0 6px;background:#fff; } .data.detail .inner .row-top .center .right .data-info .de-data ul li.detail-accordion > span { float: left; } .data.detail .inner .row-top .center .right .data-info .de-data ul li.detail-accordion .desc-wrap { display: flex; } .data.detail .inner .row-top .center .right .data-info .de-data ul li.detail-accordion .desc-wrap .desc { position: relative; flex: 1; height: 20px; word-break: unset; overflow: hidden; text-overflow: ellipsis; font-size: 14px; color: #fff; line-height: 24px; } .data.detail .inner .row-top .center .right .data-info .de-data ul li.detail-accordion button { width: 64px; height: 28px; margin-right: 10px; background: #3e414a; border-radius: 30px; font-size: 12px; line-height: 18px; color: #ffffff; margin-top: -2px; } .data.detail .inner .row-top .center .right .data-info .de-data ul li.detail-accordion .btn-hide { display: none; background: #909090; position: absolute; bottom: 0; right: 0; } .data.detail .inner .row-top .center .right .data-info .de-data ul li.detail-accordion.show .desc-wrap .desc { width: 100%; height: auto; word-break: break-all; padding-bottom: 30px; } .data.detail .inner .row-top .center .right .data-info .de-data ul li.detail-accordion.show .desc-wrap .btn-more { display: none; } .data.detail .inner .row-top .center .right .data-info .de-data ul li.detail-accordion.show .btn-hide { display: block; } .pop-advanced-search .conditions-wrap h3 { margin-bottom: 10px; } @media all and (max-width: 1400px){ .wrap header .inner {width:100%;} .wrap header .inner .search-wrap {width:40%;} .wrap header .inner .search-wrap .ark_query {width:120px;} .wrap .nav-wrap .inner {width:100%;} .mo-ver { display: block !important; } .mo_tabs_wrap { width: 100%; overflow-y: auto; } .wrap { position: relative; width: 100vw;} .wrap.sub { padding-top: 73px; } .wrap header { width: 100vw; padding: 0 16px; box-sizing: border-box; } .wrap header .inner { width: auto; margin: 0; } .wrap header .inner h1 { width: auto; } .wrap.sub .nav-wrap { box-shadow: none; } .wrap header .inner h1 a span.title-2 { display: none; } .wrap header .inner .search-wrap { display: none; position: fixed; top: 0; left: 0; width: 100%; background: linear-gradient(90deg, #275f95 0%, #427cae 62.5%); z-index: 110; padding: 0 16px; box-sizing: border-box; } .wrap header .inner .search-wrap h2.blind { display: block; font-weight: 500; font-size: 22px; line-height: 33px; color: #ffffff; text-align: left; margin: 16px 0; display: flex; align-items: center; justify-content: space-between; } .wrap header .inner .search-wrap .search-close { display:inline-block;position:absolute;right:5%;top:23px; } .wrap header .inner .search-wrap .search-close button {display:inline-block;width: 20px; height: 20px; background: url("/images/btn/btn-pop-close.png") no-repeat; background-size: 100%;} .wrap header .inner .search-wrap form .search-input { display: flex; flex-direction: column-reverse; margin-top: 58px; } .wrap header .inner .search-wrap form .condition_sear { width: 100%; height: 40px; left: 0; box-sizing: border-box; padding: 0; background: #ffffff; border-radius: 5px; } .wrap header .inner .search-wrap form .condition_sear select { width: 100%; height: 100%; padding: 0 20px 0 10px; } .wrap header .inner .search-wrap .search-input .btn-search { position: absolute; left: 0; background: none; } .wrap header .inner .search-wrap .search-input .btn-search span { width: 22px; height: 22px; background: url("/images/icon/icon-search-mo.png") no-repeat; background-size: 100%; } .wrap header .inner .search-wrap .ark_query { width: 100%; box-sizing: border-box; padding: 0px 63px 0px 44px; } .wrap header .inner .search-wrap .search-input .btn-search-detail { position: absolute; left: auto; right: 10px; top: 8px; width: 43px; height: 28px; background: #e6e7e9; border-radius: 30px; color: #666666; line-height: 18px; } .wrap header .inner .search-wrap .search-input .btn-search-detail span { display: none; } .wrap header .inner .log { display: none; } .wrap .nav-wrap { width: auto; top: 0; left: auto; right: 0; background: none !important; z-index: 999; } .wrap .nav-wrap.scroll_on { box-shadow: none; } .wrap .nav-wrap .inner { width: auto; height: 72px; display: flex; align-items: center; justify-content: flex-end; padding: 0 16px; box-sizing: border-box; } .wrap .nav-wrap .inner.mo_show { width: 286px; justify-content: space-between; } .wrap .nav-wrap .inner .left { display: none;z-index:999; } .wrap .nav-wrap .inner .left.is_login span { display: inline-block; width: 1px; height: 20px; background: rgba(255, 255, 255, 0.2); vertical-align: bottom; margin: 0 20px; } .wrap .nav-wrap .inner .left.is_login .member-btn { display: inline-flex; align-items: center; color: #fff; } .wrap .nav-wrap .inner .left .member-btn img { margin-right: 8px; } .wrap .nav-wrap .inner .left span, .wrap .nav-wrap .inner .left .member-btn { display: none; } .wrap .nav-wrap .inner .right { display: flex;z-index:999; } #mo_search_icon { display: block; } #primary-nav-button.mobile { position: relative; top: 0; } .wrap .nav-wrap .Btn i { background: #fff; } .wrap .nav-wrap .Btn i::before { background: #fff; } .wrap .nav-wrap .Btn.selected i::after { bottom: 0; border-bottom: none; } .wrap .nav-wrap .Btn i::after { content: ""; position: absolute; left: 0; width: 25px; height: 2px; border-radius: 10px; background: #fff; border-color: #fff; } .sec1 .inner .banner { height: 400px; background-position: -452px;overflow:hidden; } .sec1 .inner .banner h3 { font-size: 22px; line-height: 33px; top: 120px; padding:0% 5%;width:90%;} .sec1 .inner .banner p { font-size: 14px; line-height: 21px; top: 190px; padding:0% 5%;width:90%;} .sec1 .inner .banner p > span { display: block; } .sec1 .inner .banner p:nth-of-type(2) {top:260px;} .MainSwiper .swiper-slide {height:400px;} .MainSwiper .swiper-slide .img {height:400px;} .MainSwiper .pagination {position: absolute;bottom: 100px;left: calc(50% - -423px);} .sec1 .inner .color-box {width:100vw;padding:0px 50px;box-sizing: border-box;top:-70px;} .sec1 .inner .color-box .list {height:150px;} .sec1 .inner .color-box .list .title {font-size:18px;margin:20px 0px 10px;} .contents {width:96%;padding:0% 2%;} .sec2 {padding:0% 2% 100px;} .sec2 .keyword-box {width:100%;} .sec3 {padding:100px 2% 100px;} .sec3 .pickSwiper {padding:1% 10% 12%;} .sec3 .pickSwiper .swiper-slide .list-box .images a img {} .sec5 {padding:100px 2% 100px;} .sec5 .popularSwiper {padding:1% 0% 1%;} .sec5 .inner .tab_content {width:96%;padding:30px 1.9%;} .sec5 .inner {width:100%;} .sec6 {padding:100px 2% 100px;} .sec6 .onlineSwiper {padding:1% 10% 12%;width:80%;margin:0;} .sec6 .inner .more-btn {right: 0%;} .sec6 .onlineSwiper .swiper-slide {background:none;box-shadow:0 0 0;} .sec6 .onlineSwiper::before {width:7%;box-shadow:0 0 0;} .sec6 .onlineSwiper::after {right:-1px;width:7%;box-shadow:0 0 0;} .sec6 .swiper-button-next, .swiper-rtl .swiper-button-prev {right:15px;} .sec6 .swiper-button-prev, .swiper-rtl .swiper-button-next {left:15px;} .sec7 {vertical-align:top;width:96%;padding:100px 2% 100px;} .sec7 .inner {width:100%;} .sec7 .inner .Fl {width:100%;margin:0;margin-bottom:20px;} .sec7 .inner .Fl .con .list .text {width:auto;} .sec7 .inner .qna .con .list .text {width:auto;} .sec7 .inner .Fl .con .list .box {margin-right:2%;} footer {width:96%;padding: 40px 2% 60px;} footer .inner {width:100%;} footer .family_site {right:10px;} .map .inner .info-box {width: 96%;padding:0% 2%;} .data.detail .inner .row-top .center {width:100%;} .data.detail .inner .row-bottom .con-4 .top h3 {width:100%;} .data.detail .inner .row-bottom .con-4 .top h3::before {content: '';width:100%;} .data.detail .inner .row-bottom .DetailSwiper2 {max-width:auto;} .data.detail .inner .row-top .center .right .con-2 .de-data ul li {width:100%;} .faq .inner .tab {position: relative;width:100%;margin:0 auto;} .article-side {width:22%;margin-right:2%;} .culture-box {width:74%;} .data.detail .inner .row-top .center .left {width:40%;} .data.detail .inner .row-top .center .left .img img {width:100%;max-height: 430px;max-width: 300px;} .data.detail .inner .row-top .center .right {width:54%;} .greeting .inner .row-bottom .greeting-box .gree {width:90%;padding:70px 5%;} .guide .inner .row-bottom { padding: 0px 0px 80px; box-sizing: border-box; } .guide .inner .row-bottom .guide-box .banner { display: flex; flex-direction: column; height: auto; margin-bottom: 24px; } .guide .inner .row-bottom .guide-box .banner .left { display:inline-block;width: 100%; height: auto; padding: 24px 30px 40px; box-sizing: border-box; background: url("/images/img/img-guide-bg-mo.jpg") no-repeat;background-size: 100% 100%; } .guide .inner .row-bottom .guide-box .banner .left .top { margin-bottom: 24px; } .guide .inner .row-bottom .guide-box .banner .left .top p:nth-child(1) { font-size: 18px; margin-bottom: 16px; } .guide .inner .row-bottom .guide-box .banner .left .top p:nth-child(2) { font-size: 36px; } .guide .inner .row-bottom .guide-box .banner .left .top p:nth-child(2) span { top: -10px; } .guide .inner .row-bottom .guide-box .banner .left .top p:nth-child(3) { font-size: 14px; } .guide .inner .row-bottom .guide-box .banner .left .bottom p:nth-child(1) { font-size: 18px; margin-bottom: 8px; } .guide .inner .row-bottom .guide-box .banner .left .bottom p:nth-child(3) { font-size: 14px; } .guide .inner .row-bottom .guide-box .banner .right { width: 100%; height: auto; padding: 34px 30px 0; box-sizing: border-box; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li { display: flex; margin: 0 0 30px; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li .num { width: 67px; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li .num span { width: 50px; height: 50px; font-size: 24px; line-height: 50px; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li .text p:nth-of-type(1) { height: 50px; display: flex; align-items: center; font-size: 16px; margin-bottom: 16px; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li .text p:nth-of-type(2) { font-size: 12px; margin-left: -60px; } .myinfo .inner .row-bottom .myinfo-box .top-info {width:96%;padding:30px 2%;} .myinfo .inner .row-bottom .myinfo-box .top-info .left {padding-right:2%;} .myinfo .inner .row-bottom .myinfo-box .top-info .left {width:23%;} .myinfo .inner .row-bottom .myinfo-box .top-info .right {width:70%;} .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > .con-1 .list-box > div {width:18.8%;} .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > .con-2 .list-box > div {width:23.8%;} .myinfo .contents .loan-history .list-box .list > div.tit {width:20%;} .myinfo .contents .loan-history .list-box .list > div.con {width:70%;} .myinfo .contents .visit-history .list-box .list > div.tit {width:20%;} .myinfo .contents .visit-history .list-box .list > div.con {width:70%;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.img {margin-right:0;padding:0px 20px;} .privacy .top-bg {width:100%;} .privacy .con {width:100%;} .service .top-bg {width:100%;} .service .con {width:100%;} .filter-wrap {padding:5px;} .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.img {padding:0px 10px;} .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn button {width:60px;} .data .inner .tabs a {min-width:90px;} .pop-serge {width:700px;left:calc(50% - 350px);} .data.detail .inner .row-top {padding:45px 2%;width:96%;} .data.detail .inner .row-top .center .left {margin-right:6%;} .data.detail .inner .row-bottom .con-1 .list-box .list {width:24.5%;min-height:150px;} .list-table-wrap li .t-date {width:20%;} .list-table-wrap li .t-writer {width:25%;} .list-search .left {width:50%;} .list-search .right {width:350px;float:right;} .faq .list-accordion .answer {min-height:50px;} .faq .title .left {width:50%;} .faq .title .right {width:350px;float:right;} .qna .inner .tab_content {padding:0;} .qna .title .left {width:50%;} .qna .title .right {width:350px;float:right;} .qna .list-table-wrap li .t-writer {width:25%;} .qna .list-table-wrap li .t-date {width:10%;} .qna .list-table-wrap li .t-tit {width:30%;} .greeting .inner .row-bottom .greeting-box .gree .left {width:100%;margin:0;text-align:left;} .greeting .inner .row-bottom .greeting-box .gree .right {width:100%;} .qna-write-table .wt-title {width:84%;} .myinfo .inner .row-bottom .myinfo-box .top-info .left {padding-right:2%;} .cart .inner .loan-confirm .tabs_item .visit-select-box .select-box > div {display:inline;} .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.img {padding:0% 10px;} .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-chk {width:12%;} .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-chk {line-height:12px !important;} .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-cultural {width:25%;} .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-data {width:35%;} .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-cultural {width:25%;} .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-data {width:32%;} .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-state button {margin:0;float:none;text-align:center;} .join .inner .row-bottom {width:96%;padding:0% 2%;} .cart .inner .tabs_item .list-cart-wrap.confirm .list-cart div.list > div.t-visit {margin-top:0;} .data.detail .inner .row-top .center .right .con-2 .b-btn button {margin-right:0;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-visit.long {font-size:13px;padding:5px 0px;} .map .inner .row-bottom .map-box .info > div {min-height:240px;} .filter-wrap .filter .filter-list.year ul li input[type='text'] {width:23%;} .myinfo .contents .concern-data .list-box .list {width:32.3%;min-height:450px;margin-bottom:15px;} .myinfo .contents .concern-data .list-box .list:nth-of-type(3n+3) {margin-right:0;} .service .top-bg {width:100%;height:450px;background-color:#f9f9f9;background-position:0px 0px;} .service .con {width:100%;} .service .top-bg p:nth-child(1) {margin:300px 5% 20px;font-size:16px;color:#333;} .service .top-bg p:nth-child(2) {margin:0 5%;font-size:12px;color:#333;} .privacy .top-bg {width:100%;height:450px;background-color:#f9f9f9;background-position:0px 0px;} .privacy .con {width:100%;} .privacy .top-bg p:nth-child(1) {margin:300px 5% 20px;font-size:16px;color:#333;} .privacy .top-bg p:nth-child(2) {margin:0 5%;font-size:12px;color:#333;} .data.detail .inner .row-bottom .DetailSwiper2 .swiper-slide { height: auto;background:none;box-shadow:0 0 0; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div {font-size:14px;} .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-cultural {width:20%;} .wrap .nav-wrap #primary-nav {display:none !important;opacity:0 !important;} .data.detail .inner .row-top .center .title-box .tit-info {width:70%;} .sec5 .popularSwiper .pagination {visibility:visible !important;} /* .sec6 .swiper-button-next, .swiper-rtl .swiper-button-prev {visibility:visible !important;} .sec6 .swiper-button-prev, .swiper-rtl .swiper-button-next {visibility:visible !important;} */ .noti-data .list-accordion .question span:nth-of-type(2) {width:67%;} .noti-data .list-accordion .question span:last-child {padding-right:0;width:7%;} .popularSwiper .swiper-pagination { position: relative;top:45px; } .popularSwiper .swiper-pagination-bullet { background: #aaaaaa; border-radius: 30px; margin-right: 4px; opacity: unset !important; } .popularSwiper .swiper-pagination-bullet-active { background: #376795; width: 35px; height: 10px; } } /* 모바일 가로, 테블릿 세로 (해상도 ~ 768px)*/ @media all and (max-width: 768px){ .shortcuts {display:none;} .contents {padding:0;} button, select {color:#333;} .mo-ver { display: block !important; } .mo_tabs_wrap { width: 100%; overflow-y: auto; } .wrap { position: relative; width: 100vw; min-width: auto; } .wrap.sub { padding-top: 73px; } .wrap header { width: 100vw; padding: 0 16px; box-sizing: border-box; } .wrap header .inner { width: auto; margin: 0; } .wrap header .inner h1 { width: auto; } .wrap.sub .nav-wrap { box-shadow: none; } .wrap header .inner h1 a span.title-2 { display: none; } .wrap header .inner .search-wrap { display: none; position: fixed; top: 0; left: 0; width: 100%; background: linear-gradient(90deg, #275f95 0%, #427cae 62.5%); z-index: 110; padding: 0 16px; box-sizing: border-box; } .wrap header .inner .search-wrap h2.blind { display: block; font-weight: 500; font-size: 22px; line-height: 33px; color: #ffffff; text-align: left; margin: 16px 0; display: flex; align-items: center; justify-content: space-between; } .wrap header .inner .search-wrap .search-close { display:inline-block;position:absolute;right:5%;top:23px; } .wrap header .inner .search-wrap .search-close button {display:inline-block;width: 20px; height: 20px; background: url("/images/btn/btn-pop-close.png") no-repeat; background-size: 100%;} .wrap header .inner .search-wrap form .search-input { display: flex; flex-direction: column-reverse; margin-top: 58px; } /* 셀렉트 박스 */ .wrap header .inner .search-wrap form .condition_sear { width: 100%; height: 40px; left: 0; box-sizing: border-box; padding: 0; background: #ffffff; border-radius: 5px; } .wrap header .inner .search-wrap form .condition_sear select { width: 100%; height: 100%; padding: 0 20px 0 10px; } .wrap header .inner .search-wrap .search-input .btn-search { position: absolute; left: 0; background: none; } .wrap header .inner .search-wrap .search-input .btn-search span { width: 22px; height: 22px; background: url("/images/icon/icon-search-mo.png") no-repeat; background-size: 100%; } .wrap header .inner .search-wrap .ark_query { width: 100%; box-sizing: border-box; padding: 0px 63px 0px 44px; } .wrap header .inner .search-wrap .search-input .btn-search-detail { position: absolute; left: auto; right: 10px; top: 8px; width: 43px; height: 28px; background: #e6e7e9; border-radius: 30px; color: #666666; line-height: 18px; } .wrap header .inner .search-wrap .search-input .btn-search-detail span { display: none; } .wrap header .inner .log { display: none; } .wrap .nav-wrap { width: auto; top: 0; left: auto; right: 0; background: none !important; z-index: 999; } .wrap .nav-wrap.scroll_on { box-shadow: none; } .wrap .nav-wrap .inner { width: auto; height: 72px; display: flex; align-items: center; justify-content: flex-end; padding: 0 16px; box-sizing: border-box; } .wrap .nav-wrap .inner.mo_show { width: 286px; justify-content: space-between; } .wrap .nav-wrap .inner .left { display: none;z-index:999; } .wrap .nav-wrap .inner .left.is_login span { display: inline-block; width: 1px; height: 20px; background: rgba(255, 255, 255, 0.2); vertical-align: bottom; margin: 0 20px; } .wrap .nav-wrap .inner .left.is_login .member-btn { display: inline-flex; align-items: center; color: #fff; } .wrap .nav-wrap .inner .left .member-btn img { margin-right: 8px; } .wrap .nav-wrap .inner .left span, .wrap .nav-wrap .inner .left .member-btn { display: none; } .wrap .nav-wrap .inner .right { display: flex;z-index:999; } #mo_search_icon { display: block; } #primary-nav-button.mobile { position: relative; top: 0; } .wrap .nav-wrap .Btn i { background: #fff; } .wrap .nav-wrap .Btn i::before { background: #fff; } .wrap .nav-wrap .Btn.selected i::after { bottom: 0; border-bottom: none; } .wrap .nav-wrap .Btn i::after { content: ""; position: absolute; left: 0; width: 25px; height: 2px; border-radius: 10px; background: #fff; border-color: #fff; } .sec1 .inner .banner { height: 400px; background-position: -452px; } .sec1 .inner .banner h3 { font-size: 22px; line-height: 30px; top: 110px;max-height: 70px; } .sec1 .inner .banner p { font-size: 12px; line-height: 18px; top: 185px;max-height:103px;} .sec1 .inner .banner p > span { display: block; } .sec1 .inner .banner p:nth-of-type(2) {top:290px;} .MainSwiper .swiper-slide {height:400px;display: flex;flex-direction: column;justify-content: center;} .MainSwiper .swiper-slide .img {width:100%;height:100%;} .MainSwiper .swiper-slide .img img {object-fit:cover;width:100%;height:100%;} .MainSwiper .pagination {bottom: 55px;left: calc(50% - -135px);} .sec1 .inner .color-box { width: 100vw; padding: 0 16px; box-sizing: border-box; top: -45px; } .sec1 .inner .color-box .list { height: 85px; display: flex; align-items: center; flex-direction: column-reverse; } .sec1 .inner .color-box .list .title { font-size: 12px; line-height: 18px; margin: 8px 0px 9px; } .sec1 .inner .color-box .list .icon img { width: 32px; } .sec1 .inner .color-box .list .open { display: none; } .sec2 { padding: 0px 0px 60px; } .sec2 .keyword-box { width: 100vw; } section h3 { font-size: 22px; margin-bottom: 0px; } section .inner p.desc { font-size: 14px; margin-bottom: 16px; } section .inner ul.list-tag { height: 66px; overflow: hidden;padding:5px 0px 0px; } .sec3 { padding: 52px 0px 60px; } .sec3 .pickSwiper::before, .sec3 .pickSwiper::after { display: none; } .sec3 .pickSwiper .swiper-slide .list-box { height: 310px; } .sec3 .pickSwiper .swiper-slide .list-box .images { padding: 10px 0px; height: 185px; } .sec3 .pickSwiper .swiper-slide .list-box .images a img {width:140px;} .sec3 .pickSwiper .swiper-slide .list-box .subject { padding: 15px; } .sec3 .pickSwiper .swiper-slide .list-box .subject .block { margin-bottom: 6px; } .sec3 .pickSwiper .swiper-slide .list-box .subject .cla { padding: 5px 10px; border-radius: 85px; } .sec3 .pickSwiper .swiper-slide .list-box .subject .tit { font-size: 14px; } .swiper-button-next, .swiper-button-prev { display: none; } .sec4 .inner .middle-banner { background: url("/images/bg/bg-sec4-bg-mo.jpg") no-repeat; height: 200px;background-size:100%; } .sec4 .inner .middle-banner h3 { padding: 40px 0px 10px; font-size: 22px; line-height: 33px; } .sec4 .inner .middle-banner p { font-size: 14px; } .sec5 { padding: 52px 0px 60px 16px; } .sec5 .inner { width: 100%; } .sec5 .inner .tabs { width: max-content; } .sec5 .inner .tab_content { padding: 0 16px 0 0; margin-top: 30px; box-sizing: border-box; width: 100%; border: none; background: none; } .sec5 .inner .tabs_item { padding: 0; } .sec5 .inner .tabs_item ul li { background: #ffffff; border: 1px solid #dddddd; box-sizing: border-box; padding: 30px; } .sec5 .inner .tabs_item ul li .con-1 .cla { padding: 5px 10px; } .sec5 .inner .tabs_item ul li .con-1 .tit { font-size: 16px; } .sec5 .inner .tabs_item ul li .con-2 p { font-size: 12px; } .sec5 .popularSwiper .swiper-pagination-fraction {top:28px;} .sec5 .popularSwiper .pagination {visibility:visible !important;} .sec6 { padding: 52px 0px 60px; } .sec6 .inner .more-btn {top:5px;right: 1%;} .sec6 .inner .more-btn a {font-size:12px;padding:2px 10px 3px;} .sec6 .inner .more-btn a span > span {display:none;} .sec6 .inner .more-btn a span img {width:22px;} .popularSwiper .swiper-pagination { position: relative;top:10px; } .popularSwiper .swiper-pagination-bullet { background: #aaaaaa; border-radius: 30px; margin-right: 4px; opacity: unset !important; } .popularSwiper .swiper-pagination-bullet-active { background: #376795; width: 35px; height: 10px; } .sec6 .onlineSwiper::before, .sec6 .onlineSwiper::after { display: none; } .sec6 .onlineSwiper {padding:1% 20% 12%;width:60%;} .sec6 .onlineSwiper .items .List .inner div.thumbnail {width:100%;} .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover > a {margin-bottom: 16px; font-size: 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.3); } .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box { } .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box .view { width: 100%; } .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box .RIS { display: none; } .sec6 .onlineSwiper .items .List .inner div.thumbnail span.image-frame {width:100%;} .sec6 .onlineSwiper .items .List .inner div.thumbnail span.image-frame img {max-width:initial;} .sec7 { padding: 54px 16px 60px; width: 100%; height: auto; box-sizing: border-box; } .sec7 .inner { width: 100%; display: flex; flex-direction: column; } .sec7 .inner .Fl { float: none; width: 100%; margin: 0; } .sec7 .inner .Fl.notice { margin-bottom: 24px; } .sec7 .inner .Fl .ti { display: flex; align-items: center; justify-content: space-between; } .sec7 .inner .Fl .ti span { font-size: 18px; } .sec7 .inner .Fl .ti a span { height: auto; } .sec7 .inner .Fl .ti a span > span { display: none; } .sec7 .inner .Fl .ti a span img { width: 22px; margin: 0; } .sec7 .inner .Fl .con { padding: 0 20px; border: 1px solid #dddddd; border-radius: 5px; } .sec7 .inner .Fl .con .list a { display: flex; } .sec7 .inner .Fl .con .list .text { font-size: 16px; flex: 1;max-width: max-content; } .sec7 .inner .Fl .con .list .text p { align-items: center;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding-right:30px; } .sec7 .inner .Fl .con .list .text p img { margin: 0;margin-left:5px; } .sec7 .inner .Fl .con .list .answer { display: none; } .sec7 .inner .Fl .more {position:absolute;right:0%;top:5px;} .sec7 .inner .Fl .more a span img {width:22px;} .sec7 .inner .Fl .more a span > span {display:none;} footer { width:100%;padding: 20px 0px 16px; position: relative; height: auto; box-sizing: border-box; } footer .inner { width: 100%; box-sizing: border-box; } footer .row-top { display: flex; flex-direction: column; align-items: center; } footer .row-top .footer-logo img { width: 140px; } footer .family_site { position: relative; display: flex; align-items: center; width: 90%; padding: 0 5%; box-sizing: border-box;right:auto;margin-top:10px; } footer .family_site .site_name { width: 100%; margin: 0; flex: 1; } footer .family_site .go_btn { display: block; background: #1b1b1b; border-radius: 5px; width: 74px; height: 40px; color: rgba(255, 255, 255, 0.6); margin-left: 16px; } footer .fnb li { font-size: 12px; line-height: 18px; text-align: center; margin: 0 6px; } footer .row-bottom .left-side { float: unset; } footer .row-bottom .left-side ul { display: flex; align-items: center; justify-content: center; } footer .copy { font-size: 12px; line-height: 18px; width: 80%; text-align: center; margin: auto; } footer .copy span:first-child { display: block; } footer .copy br { display: none; } .btn-go-top span:nth-of-type(2) { display: none; } .btn-go-top img { width: 24px; } #mo-member-btn { display: block; } .wrap footer {padding-bottom:100px;} .wrap.sub footer {padding-bottom:16px;} /* 서브 공통 */ .location .inner .row-top .location-box .tit h2 { font-size: 22px; } .location .inner .row-top .location-box .tit h2 span {font-size:22px;} .location .inner .row-top { padding: 25px 0px; margin-bottom: 50px; } /* 회원가입 */ .join .inner .row-bottom { width: 100vw; min-height: 400px; padding: 0 16px; box-sizing: border-box; } .join .inner .row-bottom .join-box .login { margin-top: 60px; width: 100%; } .join .inner .row-bottom .join-box .step { padding-bottom: 24px; } .join .inner .row-bottom .join-box .step > div .icon, .join .inner .row-bottom .join-box .step > div .text p:nth-child(1) { display: none; } .join .inner .row-bottom .join-box .step > div { box-sizing: border-box; height: 45px; display: flex; align-items: center; justify-content: center; } .join .inner .row-bottom .join-box .privacy-box > div { position: relative; margin-bottom: 60px; } .join .inner .row-bottom .join-box .privacy-box > div > .con-1 .chk { position: absolute; bottom: -30px; } .join .inner .row-bottom .join-box .btn-box { display: flex; } .join .inner .row-bottom .join-box .btn-box .btn { width: 50%; margin-right: 16px; } .join .inner .row-bottom .join-box .btn-box .btn:last-child { margin-right: 0; } .join .inner .row-bottom .join-box { padding-bottom: 60px; } .join .inner .row-bottom .join-box .form-group { display: flex; flex-direction: column; border-bottom: none; padding-bottom: 0; } .join .inner .row-bottom .join-box .form-group .con, .join .inner .row-bottom .join-box .form-group .con .form-control { width: 100%; box-sizing: border-box; } .join .inner .row-bottom .join-box .form-group .con .cer::placeholder { font-size: 12px !important; } .join .inner .row-bottom .join-box .form-group .con select {width:32%;margin-left:0;} .join .inner .row-bottom .join-box .form-group .con select#birth_yy {width:90%;} .join .inner .row-bottom .join-box .form-group .con select#birth_mm {width:37%} .join .inner .row-bottom .join-box .form-group .con select#birth_dd {width:37%;} .join .inner .row-bottom .join-box .Usersex .con { display: flex; } .join .inner .row-bottom .join-box .Usersex .chk { margin-right: 0; width: 50%; } .join .inner .row-bottom .join-box .Userbirth .con { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; height: 86px; } .join .inner .row-bottom .join-box .Userbirth #year { width: 94%; } .join .inner .row-bottom .join-box .Userbirth #month { margin-left: 0; } .join .inner .row-bottom .join-box .Userbirth #month, .join .inner .row-bottom .join-box .Userbirth #day { width: 40.5%; } .join .inner .row-bottom .join-box .Usermobile .row input { width: 21.5% !important; } .join .inner .row-bottom .join-box .Usermobile .row input.cer, .join .inner .row-bottom .join-box .Useremail .row input, .join .inner .row-bottom .join-box .Useraddr .row input.addr1 { width: 72% !important; } .join .inner .row-bottom .join-box .form-group .con span.text, .join .inner .row-bottom .join-box .form-group.service p:nth-of-type(2) { width: 100%; text-indent: -6px; padding-left: 6px; } .join .inner .row-bottom .join-box .form-group .con span:nth-of-type(1) { width: 94%; vertical-align: top; margin-left: 6%; } .join .inner .row-bottom .join-box .form-group .con .row .chk-suc {top:2px;} .join .inner .row-bottom .join-box .form-group.service .right label { margin-left: 0; } .join .inner .row-bottom .join-box .form-group.service p.bg { text-indent: -6px; padding-left: 18px; } .join .inner .row-bottom .join-box .form-group .con span.fail {width:100%;margin-bottom:10px;} /* 가입 완료 */ .join.succ .inner .row-bottom .join-box .success .text p:nth-of-type(1) { font-size: 26px; } .join.succ .inner .row-bottom .join-box .success .text p:nth-of-type(2) { font-size: 15px; } .join.succ .inner .row-bottom .join-box .success .text p:nth-of-type(3) { font-size: 14px; } .join.succ .inner .row-bottom .join-box .success .text p:nth-of-type(4) span { display: block; } .join.succ .inner .row-bottom .join-box .success .box p:nth-of-type(1) { font-size: 16px; } .join.succ .inner .row-bottom .join-box .success .box p:nth-of-type(2) { font-size: 14px; } .join.succ .inner .row-bottom .join-box .success .btn { margin: 30px 0px; width: 100%; height: 45px; } .join.succ .inner .row-bottom .join-box .success .btn a { padding: 0; font-weight: normal; width: 100%; height: 100%; font-size: 14px; } /* 휴면 계정 */ .join.dormant .inner .row-bottom .join-box .success .text p:nth-of-type(1) { font-size: 18px; } .join.dormant .inner .row-bottom .join-box .success .text p:nth-of-type(2) br { display: none; } .join.dormant .inner .row-bottom .join-box .success .box p:nth-of-type(1) { font-size: 15px; } .join.dormant .inner .row-bottom .join-box .success .btn { display: flex; } .join.dormant .inner .row-bottom .join-box .success .btn a { width: 50%; margin-right: 10px; } .join.dormant .inner .row-bottom .join-box .success .btn a:last-child { margin-right: 0; } /* 알림 */ .noti-data .contents { width: 100%; padding: 0 16px; box-sizing: border-box; min-height: 400px; } .noti-data .inner .noti-box .title { margin: 0; } .noti-data .inner .noti-box .title .count { font-size: 14px; } .noti-data .inner .noti-box .title .text p { display: none; } .noti-data .list-accordion .question { background: transparent url("/images/btn/btn-arrow-open.png") no-repeat 10px center; display: flex; flex-direction: column; padding: 10px; } .noti-data .list-accordion .question .type, .noti-data .list-accordion .question span { padding-left: 50px; height: auto; font-size: 14px; line-height: 21px; } .list-accordion .question .type::before, .list-accordion .question.on .type::before { background: none; } .noti-data .list-accordion .question .date { position: absolute; top: 10px; right: 10px; padding-right: 0 !important; } .noti-data .list-accordion .question span:last-child {width:19%;} .noti-data .list-accordion .question.on { background: url("/images/btn/btn-arrow-close.png") no-repeat 10px center #556676; } .noti-data .list-accordion .question.on span { font-size: 14px; } .noti-data .list-accordion .answer { padding: 20px 10px 20px 64px; font-size: 14px; line-height: 21px; } .noti-data .list-accordion .answer::before { width: 2px; height: 36px; left: 50px; top: 24px; } /* 카트 */ .cart .contents { width: 100%; padding: 0 16px 100px; box-sizing: border-box; } .cart .inner .tabs { display: flex; } .cart .inner .tabs li { width: 50%; } .cart .inner .tabs a { min-width: auto; width: 100%; } .cart .inner .tabs_item .list-cart-wrap h3 { font-size: 16px; border-top: 2px solid #222222; padding: 10px 10px 0; } .cart .inner .loan-confirm .tabs_item .list-cart-wrap { margin-bottom: 10px; } .cart .inner .loan-confirm .tabs_item h3 { border-bottom: 1px solid #dddddd; padding: 10px; } .cart .inner .loan-confirm .tabs_item .visit-text { font-size: 12px; } .cart .inner .loan-confirm .tabs_item .visit-select-box { padding: 25px 0 15px; } .cart .inner .loan-confirm .tabs_item .visit-select-box h3 { padding-top: 0; font-size: 18px; line-height: 27px; } .cart .inner .loan-confirm .tabs_item .visit-select-box .select-box { display: flex; flex-direction: column; font-size: 14px; } .cart .inner .loan-confirm .tabs_item .visit-select-box .select-box > div { display: flex; align-items: center; margin-bottom: 10px; } .cart .inner .loan-confirm .tabs_item .visit-select-box .select-box > div select { flex: 1; } .cart .inner .tabs_item .list-cart-wrap .list-cart .list.t-tit-line { display: flex; align-items: center; justify-content: space-between; height: 45px; background: #fff; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd; padding: 0 10px 0; box-sizing: border-box; } .cart .inner .loan-confirm .tabs_item .list-cart-wrap .list-cart .list.t-tit-line { display: none; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div { color: #333333; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-mo { display: none; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-chk { width: auto; display: flex; align-items: center; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list { position: relative; padding: 10px 10px 20px; height: auto; box-sizing: border-box; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-data:not(.t-mo) { width: 100%; display: flex; flex-direction: column-reverse; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-chk { height: 35px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.type { display: flex; position: absolute; top: 14px; left: 32px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.type span { padding: 5px 12px 5px; margin-right: 6px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.title { padding: 5px 0 40px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.img { width: 189px; height: 144px; padding: 0; display: flex; align-items: center; justify-content: center; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.img a, .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.img img { width:100%;height: 100%;max-width:100px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-state { width: 100%; position: absolute; text-align: left; bottom: 184px; padding: 0; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-date, .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-loan, .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-visit { width: auto !important; display: flex; flex-direction: column; font-size: 12px; line-height: 18px; text-align: left; position: absolute; bottom: 20px; left: 220px; padding: 0; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-date::before { content: "반납예정일"; color: #333333; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-date { bottom: 130px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-loan::before { content: "대출"; color: #333333; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-loan { bottom: 76px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-visit::before { content: "방문열람"; color: #333333; } .cart .inner .tabs_item .btn-box.btn-cart-top { display: flex; margin-bottom: 0; } .btn-cart-top.go-cart-fix { position: fixed; bottom: 0; left: 0; padding: 16px; box-sizing: border-box; background: rgba(0, 0, 0, 0.35); margin: 0; z-index: 999; } .btn-cart-top.go-cart-hide { opacity: 0; z-index: -1; } .btn-cart-top.go-cart-hide { opacity: 0; z-index: -1; } .cart .inner .tabs_item .btn-box .btn-gray { display: none; } .cart .inner .tabs_item .btn-box .left, .cart .inner .tabs_item .btn-box .right { width: 50%; } .cart .inner .tabs_item .btn-box .left { margin-right: 16px; } .cart .inner .tabs_item .btn-box .btn { width: 100%; } .cart .inner .tab_content.loan-confirm.visit-confirm .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.title {width:100%;padding:38px 0px 40px;} .cart .inner .tab_content.loan-confirm.visit-confirm .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.type {left:10px;} /* .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.title { padding: 5px 0 40px; position:absolute;left:22px;top:50px;font-size:14px;width:270px;overflow:hideen;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list.t-tit-line > div.t-state {position:static;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-state {} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-date {position:absolute;top:133px;left:200px;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-chk {width:auto;line-height:90px;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list.t-tit-line > div.t-data {width:auto;display:none;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list.t-tit-line > div.t-state {width:auto;display:none;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list.t-tit-line > div.t-date {width:auto;display:none;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list.t-tit-line > div.t-loan {width:auto;display:none;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list.t-tit-line > div.t-reser {width:auto;display:none;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list.t-tit-line > div.t-visit {width:auto;display:none;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-chk {width:auto;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data {width:auto;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-state {width:auto;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-date {width:auto;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-loan {width:auto;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-reser {width:auto;} .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-visit {width:auto;} */ /* 대출신청/예약확인 */ .cart-confirm .inner .tabs_item .list-cart-wrap .list-cart div.list { padding: 10px 10px 44px; } .cart-confirm .inner .visit-confirm .tabs_item .list-cart-wrap .list-cart div.list { padding: 10px 10px 24px; } .cart-confirm .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.type { left: 10px; } .cart-confirm .inner .tabs_item .list-cart-wrap.confirm .list-cart div.list > div.t-state { width: 100%; } .cart .inner .visit-confirm .tabs_item .list-cart-wrap.confirm .list-cart div.list > div.t-state {width:50%;} .cart-confirm .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-data > div.title { padding: 38px 0 40px; } .cart-confirm .inner .visit-confirm .list-cart-wrap .list-cart div.list > div.t-data > div.title { width: 100%; } .cart-confirm .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-state { bottom: 208px; } .cart-confirm .inner .visit-confirm .list-cart-wrap .list-cart div.list-content > div.t-state { bottom: 188px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list-content > div.t-date { bottom: 130px; } .cart .inner .tabs_item .list-cart-wrap.confirm .list-cart div.list-content > div.t-date { bottom: 154px; } .cart .inner .visit-confirm .list-cart-wrap .list-cart div.list-content > div.t-date { bottom: 138px; } .cart-confirm .inner .tabs_item .list-cart-wrap.confirm .list-cart div.list > div.t-visit, .cart-confirm .inner .tabs_item .list-cart-wrap.complete .list-cart div.list > div.t-visit { bottom: 0; left: 10px; width: 100%; } .cart-confirm .inner .tabs_item .list-cart-wrap.confirm .list-cart div.list > div.t-visit::before, .cart-confirm .inner .tabs_item .list-cart-wrap.complete .list-cart div.list > div.t-visit::before { content: ""; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-reser { position: absolute; left: 220px; bottom: 50px; width: auto !important; padding: 0; display: flex; flex-direction: column; font-size: 12px; text-align: left; } .cart .inner .visit-confirm .list-cart-wrap .list-cart div.list > div.t-reser { bottom: 86px; } .cart .inner .tabs_item .list-cart-wrap .list-cart div.list > div.t-reser::before { content: "신청/예약정보"; color: #333333; } .cart .inner .visit-confirm .list-cart-wrap .list-cart div.list > div.t-reser::before { content: "신청정보"; color: #333333; } .cart .inner .tabs_item .text { font-size: 12px; line-height: 18px; text-indent: -7px; padding-left: 7px; box-sizing: border-box; } .cart .inner .loan-confirm .tabs_item .text { margin-bottom: 10px; } .cart .inner .tabs_item .list-cart-wrap { margin-bottom: 0; } .cart .inner .tabs_item .total-box { display: flex; justify-content: space-between; border-top: none; padding: 20px 0; } .cart .inner .tabs_item .total-box .row-top { display: flex; flex-direction: column; justify-content: space-between; width: 100px; height: auto; text-align: left; background: #fff; border-bottom: none; } .cart .inner .tabs_item .total-box .row-top > div { width: auto; height: auto; color: #666666; line-height: 27px; } .cart .inner .tabs_item .total-box .row-bottom { display: flex; align-items: flex-end; flex-direction: column; width: 200px; height: auto; padding: 0; line-height: 27px; } .cart .inner .tabs_item .total-box .row-bottom > div.plus, .cart .inner .tabs_item .total-box .row-bottom > div.result { display: none; } .cart .inner .tabs_item .total-box .row-bottom > div strong { font-size: 18px; } .cart .inner .tabs_item .btn-wrap { display: flex; } .cart .inner .tabs_item .btn-wrap .btn { width: 50%; margin-right: 16px; } .cart .inner .tabs_item .btn-wrap .btn:last-child { margin-right: 0; padding: 0 10px; } /* 신청완료 */ .cart .inner .tabs_item .compl-box { border-top: none; } .cart .inner .visit-confirm .tabs_item .compl-box { border-top: 1px solid #333; } .cart .inner .tabs_item .compl-box .compl-icon img { width: 48px; } .cart .inner .tabs_item .compl-box .compl-text { font-size: 18px; } .cart .inner .tabs_item .compl-box .sub-text { font-size: 14px; } /* 인사말 */ .greeting .inner .row-bottom { width: 100%; padding:0px 0% 60px; } .greeting .inner .row-bottom .greeting-box .top-banner { background-position: -300px; } .greeting .inner .row-bottom .greeting-box .top-banner p { font-size: 18px; } .greeting .inner .row-bottom .greeting-box .gree { width: 95%; padding: 50px 16px; display: flex; flex-direction: column; box-sizing: border-box; } .greeting .inner .row-bottom .greeting-box .gree .left { width: 100%; margin-right: 0; } .greeting .inner .row-bottom .greeting-box .gree .right { width: 100%; margin-top: 20px; } .greeting .inner .row-bottom .greeting-box .gree .left p.text { font-size: 14px; } .greeting .inner .row-bottom .greeting-box .gree .left p.text strong { font-size: 18px; } .greeting .inner .row-bottom .greeting-box .gree .right h3 { font-size: 20px; margin-bottom: 20px; } .greeting .inner .row-bottom .greeting-box .gree .right p { font-size: 14px; line-height: 20px; } .greeting .inner .row-bottom .greeting-box .gree .right p br {display:none;} /* 이용안내 */ .guide .inner .row-bottom { width: 100%; padding: 0px 16px 80px; box-sizing: border-box; } .guide .inner .row-bottom .guide-box .banner { display: flex; flex-direction: column; height: auto; margin-bottom: 24px; } .guide .inner .row-bottom .guide-box .banner .left { display:inline-block;width: 100%; height: auto; padding: 24px 30px 40px; box-sizing: border-box; background: url("/images/img/img-guide-bg-mo.jpg") no-repeat;background-size: 100% 100%; } .guide .inner .row-bottom .guide-box .banner .left .top { margin-bottom: 24px; } .guide .inner .row-bottom .guide-box .banner .left .top p:nth-child(1) { font-size: 18px; margin-bottom: 16px; } .guide .inner .row-bottom .guide-box .banner .left .top p:nth-child(2) { font-size: 36px; } .guide .inner .row-bottom .guide-box .banner .left .top p:nth-child(2) span { top: -10px; } .guide .inner .row-bottom .guide-box .banner .left .top p:nth-child(3) { font-size: 14px; } .guide .inner .row-bottom .guide-box .banner .left .bottom p:nth-child(1) { font-size: 18px; margin-bottom: 8px; } .guide .inner .row-bottom .guide-box .banner .left .bottom p:nth-child(3) { font-size: 14px; } .guide .inner .row-bottom .guide-box .banner .right { width: 100%; height: auto; padding: 34px 30px 0; box-sizing: border-box; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li { display: flex; margin: 0 0 30px; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li .num { width: 67px; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li .num span { width: 50px; height: 50px; font-size: 24px; line-height: 50px; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li .text p:nth-of-type(1) { height: 50px; display: flex; align-items: center; font-size: 16px; margin-bottom: 16px; } .guide .inner .row-bottom .guide-box .banner .right .list-box .li .text p:nth-of-type(2) { font-size: 12px; margin-left: -60px; } .guide .inner .row-bottom .guide-box .info-box .info-sec h3 { font-size: 18px; margin-bottom: 6px; } .guide .inner .row-bottom .guide-box .info-box .info-sec .text-box { padding: 20px 30px; } .guide .inner .row-bottom .guide-box .info-box .info-sec { margin-bottom: 30px; } .guide .inner .row-bottom .guide-box .info-box .info-sec:nth-child(3) .text-box p, .guide .inner .row-bottom .guide-box .info-box .info-sec:nth-child(4) .text-box p { display: flex; } /* 오시는 길 */ .map .contents { width: 100%; padding: 0 16px 80px; box-sizing: border-box; } .map .inner .row-bottom .map-box { margin-bottom: 24px; } .map .inner .row-bottom .map-box h2 { margin-bottom: 6px; font-size: 18px; } .map .inner .row-bottom .map-box .info { display: flex; flex-direction: column; } .map .inner .row-bottom .map-box .info .mapimg { height: 156px; } .map .inner .row-bottom .map-box .info > div { width: 100%; text-align: left; padding: 45px 28px; box-sizing: border-box; min-height: auto; border-bottom: 1px solid #ddd; border-right: none; } .map .inner .row-bottom .map-box .info > div:last-child { border-bottom: none; } .map .inner .row-bottom .map-box .info > div p:nth-of-type(1) { width: 28px; height: 28px; line-height: 28px; display: inline-flex; align-items: center; justify-content: center; } .map .inner .row-bottom .map-box .info > div p:nth-of-type(1) img { width: 70%; margin: 0; } .map .inner .row-bottom .map-box .info > div p:nth-of-type(2) { display: inline-block; font-size: 18px; margin-bottom: 10px; margin-left: 6px; line-height: 28px; vertical-align: bottom; } .map .inner .row-bottom .map-box .info > div p:nth-of-type(3) { font-size: 16px; } .map .inner .row-bottom .map-box .info > div p:nth-of-type(4) { font-size: 14px; } .map .inner .info-box {width: 100%;padding: 0 16px 80px;box-sizing: border-box;} .map .inner .info-box .info-sec h3 { font-size: 18px; } .map .inner .info-box .info-sec .text-box > div.box { width: 115%; margin-left: -20px; box-sizing: border-box; padding: 20px; } .map .inner .info-box .info-sec .text-box > div.box p { text-indent: 0; } .map .inner .info-box .info-sec .text-box > div.box span::before { display: none; } .map .inner .info-box .info-sec { margin-bottom: 24px; } .map .inner .map-box .info #map {height:155px !important;} /* 소장자료 */ .data .inner .row-bottom { width: 100%; padding: 0 0 100px 16px; box-sizing: border-box; } .article-side { display: none; background: #fff; width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; z-index: 101; } .article-side .Title.mo-ver { padding: 15px 16px; background: url("/images/bg/bg-login.jpg") no-repeat; background-size: cover; text-align: left; } .article-side .Title.mo-ver h3 { font-weight: 500; font-size: 22px; line-height: 33px; color: #ffffff; } .article-side .Title.mo-ver .filter-close { position: absolute; right: 20px; top: 20px; width: 26px; height: 26px; text-indent: 9999px; font-size: 0; overflow: hidden; background: url("/images/btn/btn_close_size_27x26_c9c9c7.png") no-repeat; background-size: 100%; } .article-side .filter-wrap { height: calc(100% - 125px); overflow: scroll; border: none; } .article-side .filter-wrap {display:inline-block;padding-top:100px;} .article-side .filter-wrap .Title {display:inline-block;background: #3670a3;width: 96%;padding: 0px 2%;height: 80px;line-height: 80px;padding: 0 16px;box-sizing: border-box;width: 100%;position:absolute;top:0px;left:0px;z-index:999;} .article-side .filter-wrap .Title span:nth-of-type(1) {font-size: 24px;font-weight: 500;margin-right: 10px;font-size: 22px;line-height: 33px;color:#fff;} .article-side .filter-wrap .Title span:nth-of-type(2) {position: absolute;right: 16px;top: 30px;} .article-side .filter-wrap .Title span:nth-of-type(2) .filter-close {display:inline-block;width:22px;height:22px;} .culture-box { width: 100%; } .data .mo_tabs_wrap { height: 50px; } .data .inner .tabs { /*width: max-content;*/ display: flex;white-space:nowrap;overflow-y:hidden;overflow-x:auto;text-align:center;height:50px; } .data .inner .tabs li.current::before {bottom: calc(0% - -5px);} .data .inner .tabs li a { border-radius: 0; border-right: none; } .data .inner .tabs li:first-child a { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .data .inner .tabs li:last-child a { border-right: 1px solid #ddd; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .data .inner .data-box .culture-box .tab > .title { display: flex; flex-direction: column-reverse; height: auto; padding-right: 16px; } .data .inner .data-box .culture-box .tab .title .count { display: flex; font-size: 14px; } .data .inner .data-box .culture-box .tab .title .list-search-wrap > div.re-search { margin-left: 0; width: 100%; text-align: left; } .data .inner .data-box .culture-box .tab .title .list-search-wrap > div.list-select, .data .inner .data-box .culture-box .tab .title .list-search-wrap > div.list-select select { margin-left: 0; width: 100%; } .data .inner .data-box .culture-box .tab .title .list-search-wrap > div.list-input { margin-left: 0; width: 100%; box-sizing: border-box; margin: 10px 0 26px; display: flex; padding: 0 0 0 36px; } .data .inner .data-box .culture-box .tab .title .list-search-wrap > div.list-input input { width: 100%; height: 100%; } .data .inner .data-box .culture-box .tab .title .list-search-wrap > div.list-input button[type="submit"] { background: url("/images/icon/icon-search-mo.png") no-repeat center; right: auto; left: 0; } .data .inner .data-box .culture-box .tab .title .list-search-wrap > div.list-input button.filter-btn {display:inline-block;position: absolute;left: auto;right: 10px;top: 4px;width: 43px;height: 26px;background:#e6e7e9;color:#666;border-radius:50px;text-indent:0;} .data .inner .tab_content { padding-right: 16px; box-sizing: border-box; } .data .inner .tabs_item { border-top: 1px solid #222222; padding: 0; } .data .inner .tabs_item .list-cart-wrap .list-data .list.t-tit-line { display: none; } .data .inner .tabs_item .list-cart-wrap .list-data div.list { box-sizing: border-box; display: flex; flex-direction: column; height: auto; padding: 0; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data { width: 100%; position: relative; display: flex; flex-direction: column; align-items: flex-start; border-bottom: 1px solid #dddddd; padding: 30px 10px 130px; box-sizing: border-box; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.img { position: absolute; width: 120px; height: 90px; padding: 0; bottom: 20px; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.type, .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.title, .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.code { width: 100%; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.img a img { width: auto; height: 100%; display: block; margin: auto; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.code { margin-bottom: 0; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.subject { position: absolute; left: 150px; bottom: 20px; width: auto; height: 90px; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.subject span { display: inline; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-data > div.subject em { display: none; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn { width: 100%; padding: 20px 0 !important; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn > div { display: inline-block; padding-left: 6px; margin-left: 6px; line-height: 1; border-left: 1px solid #3f8f4a; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn > div:nth-child(1) { margin: 0; padding: 0; border: none; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn button { width: 100%; height: 40px; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn button.btn-ris { display: none; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn.nomagin p br {display:none;} .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn.nomagin p span {display:inline-block;margin:0px 5px;height:10px;line-height:10px;} .data .inner .tabs_item .list-cart-wrap .list-data div.list > div.t-btn.nomagin p span:nth-of-type(1) {border-right:1px solid #3f8f4a;padding-right:10px;} /* 결과 없음 */ .data .inner .tabs_item .list-cart-wrap .list-data div.list > .no-result .text1 { font-size: 16px; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > .no-result .text1 { font-size: 16px; } .data .inner .tabs_item .list-cart-wrap .list-data div.list > .no-result .text2 { margin-bottom: 16px; font-size: 18px; } .paging { width: 100%; display: flex; justify-content: center; } .paging li { margin: 0 !important; padding: 0 !important; min-width: auto; width: 24px !important; background-position: center !important; } .paging .btn-prev a, .paging .btn-next a { display: none; } .paging li a { font-size: 14px; } .data .inner .data-box .culture-box .tab .title .list-search-wrap > div.list-input button.btn_filter { position: absolute; top: 3px; right: 10px; background: #e6e7e9; width: 43px; height: 28px; border-radius: 30px; font-weight: 500; font-size: 12px; line-height: 18px; color: #666666; text-indent: 0; } /* 소장 자료 상세 */ .data.detail .inner .row-top .center { width: 100%; display: flex; flex-direction: column; padding: 0 16px; box-sizing: border-box; } .data.detail .inner .row-top .center .title-box .cla-info { position: relative; } .data.detail .inner .row-top .center .title-box .cla-info .con-1 { width: 100%; display: block; } .data.detail .inner .row-top .center .title-box .cla-info .con-2 { position: relative; top: 5px; padding: 0; } .data.detail .inner .row-top .center .title-box .tit-info { font-size: 22px; margin-bottom: 30px;overflow:hidden;width:100%; } .data.detail .inner .row-top .center .title-box .btn-info {position:relative;} .data.detail .inner .row-top .center .title-box .btn-info { display: flex; height: auto; border: none; } .data.detail .inner .row-top .center .title-box .btn-info button { margin-bottom:10px;width: 36px; height: 36px; } .data.detail .inner .row-top .center .title-box .btn-info button.view { flex: 1; } .data.detail .inner .row-top .center .title-box .btn-info button.ris { display: none; } .data.detail .inner .row-top .center .title-box .btn-info button.favorit { margin: 0px 10px; } .data.detail .inner .row-top .center .title-box .btn-info button.original {width:200px;display:inline-block;} .data.detail .inner .row-top .center .left, .data.detail .inner .row-top .center .right, .data.detail .inner .row-bottom .con-4 .top h3, .data.detail .inner .row-bottom .con-4 .top h3::before, .data.detail .inner .row-top .center .left .img img { width: 100%; } .data.detail .inner .row-top .center .left .img {background:#fff;text-align:center;width:80%;padding:5% 10%;} .data.detail .inner .row-bottom { padding: 0; } .data.detail .inner .row-top .center .right .data-info .de-data { flex-direction: column;margin-top:20px;} .data.detail .inner .row-top .center .right .data-info .de-data ul { width: 100%; display: flex; flex-direction: column; } .data.detail .inner .row-top .center .right .data-info .de-data ul li { width: 100%; } .data.detail .inner .row-top .center .right .data-info .b-btn button { width: 100%; margin-bottom: 6px; } .data.detail .inner .row-top .center .right .data-info .keyword span.first, .data.detail .inner .row-top .center .right .data-info .keyword span { padding: 5px 14px 5px; border-radius: 30px; } .data.detail .inner .row-top .center .left .img img {width:100%;max-height: 430px;max-width: 300px;} .data.detail .inner .row-bottom.contents { padding: 0 16px; } .data.detail .inner .row-bottom .con-1 { margin-bottom: 30px; } .data.detail .inner .row-bottom .con-1 .list-box { padding: 15px 10px; box-sizing: border-box; } .data.detail .inner .row-bottom .con-1 .list-box .list { width: 50%; box-sizing: border-box; padding-bottom: 20px;height:155px; } .data.detail .inner .row-bottom .con-1 .list-box .list:nth-child(2) { border-right: none; } .data.detail .inner .row-bottom .con-1 .list-box .list:nth-child(n + 3) { padding: 20px 0 0; border-top: 1px solid #ddd; } .data.detail .inner .row-bottom .con-1 .list-box .list .icon img { width: 60px; height: 60px; } .data.detail .inner .row-bottom .con-1 .text-box { width: 100%; padding: 16px 20px; box-sizing: border-box; word-break: break-all; } .data.detail .inner .row-bottom .con-1 .text-box p { text-indent: -7px; padding-left: 7px; } .data.detail .inner .row-bottom .con-1 .list-box .list .con span {display:block;} .data.detail .inner .row-bottom .con-2 {position:relative;} .data.detail .inner .row-bottom .con-2 .top h3, .data.detail .inner .row-bottom .con-3 .top h3 { font-size: 18px;height:40px;line-height:40px;} .data.detail .DetailSwiper1 .swiper-button-next, .data.detail .DetailSwiper1 .swiper-button-prev { display: block; right: 10px !important; width: 15px; } .data.detail .DetailSwiper1 .swiper-button-prev { right: 20px !important; } .data.detail .swiper-button-next { text-align: right; } .data.detail .inner .row-bottom .con-2 { margin-bottom: 30px; } .data.detail .inner .row-bottom .con-2 .top .down-btn { background-position: center; width: 34px;height:40px; top:0px; } .data.detail .inner .row-bottom .con-2 .bottom { padding: 0px 0px 26px; } .data.detail .inner .row-bottom .con-2 .bottom p { font-size: 14px; } .data.detail .inner .row-bottom .con-3 { margin-bottom: 30px; } .data.detail .inner .row-bottom .con-4 .top { padding: 20px 0px; } .data.detail .inner .row-bottom .con-4 .top h3 { font-size: 18px; } .data.detail .inner .row-bottom .con-4 .top h3::before { top: 13px; width: 90%; left: 50%; transform: translate(-50%, 0%); } .data.detail .inner .row-bottom .con-4 .top h3::after { width: 162px; height: 27px; left: calc(50% - 81px); } .data.detail .inner .row-bottom .DetailSwiper1 {padding:1% 0% 12%;} .data.detail .inner .row-bottom .DetailSwiper2 {padding:1% 20% 12%;width:60%;} .data.detail .inner .row-bottom .DetailSwiper2 .swiper-slide { height: auto; } .data.detail .inner .row-bottom .DetailSwiper2 .items.cover .List, .data.detail .inner .row-bottom .DetailSwiper2 .swiper-slide .List .inner, .data.detail .inner .row-bottom .DetailSwiper2 .items.cover .List .inner div.thumbnail { height: 100%; } .data.detail .inner .row-bottom .DetailSwiper2 .items .List .inner div.thumbnail div.detail-cover strong { padding: 25px 0px 10px; font-size: 16px; margin-bottom: 10px; } .data.detail .inner .row-bottom .con-4 { padding: 0px 0px 30px; margin: 0px 0px 30px; } .data.detail .btn-box { padding: 0 16px; } .data.detail .btn-box .btn { width: 100%; } .data.detail .inner .row-top .center .right .de-data ul li.detail-accordion > span { float: left; } .data.detail .inner .row-top .center .right .de-data ul li.detail-accordion .desc-wrap { display: flex; } .data.detail .inner .row-top .center .right .de-data ul li.detail-accordion .desc-wrap .desc { position: relative; flex: 1; height: 20px; word-break: unset; overflow: hidden; text-overflow: ellipsis; font-size: 14px; color: #fff; line-height: 24px; } .data.detail .inner .row-top .center .right .de-data ul li.detail-accordion button { width: 64px; height: 28px; margin-left: 10px; background: #3e414a; border-radius: 30px; font-size: 12px; line-height: 18px; color: #ffffff; margin-top: -4px; } .data.detail .inner .row-top .center .right .de-data ul li.detail-accordion .btn-hide { display: none; background: #909090; position: absolute; bottom: 0; right: 0; } .data.detail .inner .row-top .center .right .de-data ul li.detail-accordion.show .desc-wrap .desc { width: 100%; height: auto; word-break: break-all; padding-bottom: 30px; } .data.detail .inner .row-top .center .right .de-data ul li.detail-accordion.show .desc-wrap .btn-more { display: none; } .data.detail .inner .row-top .center .right .de-data ul li.detail-accordion.show .btn-hide { display: block; } /* 공지사항 */ .list-header .list-search { position: relative; margin-bottom: 42px; } .list-search .left, .list-search .right, .list-search .list-input { width: 100%; } .list-search .left { position: absolute; bottom: -50px; } .list-search .list-input { margin: 10px 0 0; box-sizing: border-box; } .list-search .list-input button { height: 38px; background: url("/images/icon/icon-search-mo.png") no-repeat center center; } .list-select select { min-width: auto; width: 100%; } .list-table-wrap { border-top: 1px solid; } .list-table-wrap .t-tit-line { display: none; } /* .list-table-wrap table { display: flex; align-items: center; padding: 10px;flex-wrap:wrap;font-size:14px; } .list-table-wrap table .no-result { justify-content: center; } .list-table-wrap table td { height: auto; } .list-table-wrap table .t-num { font-size: 12px; } .list-table-wrap table .t-type { width: auto; font-size: 12px; padding: 0 16px 0 0; } .list-table-wrap table .t-type span { padding: 4px 10px; margin-left: 16px; } .list-table-wrap table .t-wrap { flex-direction: column; height: auto; flex: 1; align-items: flex-start; font-size: 14px; line-height: 21px; } .list-table-wrap table .t-tit { width: 100%; margin-bottom: 6px; } .list-table-wrap table .t-info > span { width: auto; padding-right: 10px; margin-right: 10px; border-right: 1px solid #ccc; line-height: 1; } .list-table-wrap table .t-info > span:last-child { padding: 0; margin: 0; border: none; } */ .list-table-wrap table .t-num { position: absolute;left:0px;top:22px; } .list-table-wrap table .t-type { position: absolute;left:40px; } .list-table-wrap table .t-tit { width: 100%; padding-left: 40px; box-sizing: border-box; } .list-table-wrap table .t-file {height:18px;line-height:18px;} .list-table-wrap table .t-writer, .list-table-wrap table .t-date, .list-table-wrap table .t-file, .list-table-wrap table .t-answer { width: auto;position:relative;left:40px; } .list-table-wrap table .t-file {left:50px} .list-table-wrap table .t-writer { margin-right: 10px; padding-right: 10px; border-right: 1px solid #ccc; line-height: 1; } .list-table-wrap table .t-tit {display:flex;} .list-table-wrap table tbody tr {position:relative;text-align:left;display:inline-block;padding:10px 0px;} .list-table-wrap table th, .list-table-wrap table td {display: inline-block;height: auto;} .list-table-wrap table .t-file img {padding-left: 10px;border-left: 1px solid #ccc;line-height: 1;} /* 공지사항 상세 */ .view-tit { position: relative; padding-left: 18px; box-sizing: border-box;display:inline-block;width:100%;} .qna-data .view-tit { padding-left: 15px; } .view-tit h2 {width:100%;} .view-tit h2, .view-tit .v-info { font-size: 14px; } .view-tit h2 span.type { position: relative;top: 2px; left: 0px; transform: translate(0%, -50%); } .file-box { padding: 8px 10px; } .file-box .file-list span:nth-of-type(3) button { display: none; } .file-box .file-list { display: flex; align-items: center; } .file-box .file-list:last-child { margin-bottom: 0; } .view-con { font-size: 12px; line-height: 18px; min-height: 180px;overflow:hidden; } .view-con .view-txt p {width:100%;} .view-con .view-txt img {width:100% !important;height:auto !important;} .view-con .view-txt p img {width:100% !important;height:auto !important;} /*.view-con .view-txt * {width:100% !important;height:auto !important;display:inline-block;}*/ .noti-data .btn-box a { width: 100%; box-sizing: border-box; font-size: 14px; font-weight: normal; } .list-table-wrap li .t-writer {width: auto !important;height: 15px !important;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;text-align:left;} .community-write fieldset {border-top:0;} /* faq */ .faq .contents, .faq .inner .tab { width: 100%;padding:0; } .faq .mo_tabs_wrap { padding-left: 16px; box-sizing: border-box; height: 56px; } .faq .inner .tab_content {margin-top:0px;} .faq .inner .tabs { /*width: max-content;*/ /*display: flex;*/white-space:nowrap;overflow-y:hidden;overflow-x:auto;text-align:center;height:50px;width:100%; } .faq .inner .tabs li { width: 130px; } .faq .inner .tabs li.current::before {bottom: calc(0% - 4px);} .faq .inner .tabs li a { border-radius: 0;font-size:13px; } .faq .inner .tabs li:first-child a { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .faq .inner .tabs li:last-child a { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .faq .title { height: auto; margin-bottom: 0; } .faq .title .right, .faq .title .left { width: 100%;display:flex; } .faq .title .left { font-size: 14px; } .faq .title .right {flex-direction: column;} .faq .list-search-wrap { display: flex; flex-direction: column-reverse; padding: 0 16px; box-sizing: border-box; } .faq .list-search-wrap form {display:flex;flex-direction:column-reverse;} .faq .title select { min-width: auto; width: 100%; } .faq .title .list-input { margin: 10px 0 0; width: 100%; box-sizing: border-box; } .faq .title .list-input input { width: 90%; } .faq .title .list-input button { background: url("/images/icon/icon-search-mo.png") no-repeat center center; } .faq .inner .tabs_item { padding: 0 16px; box-sizing: border-box; } .faq .list-accordion .question { display: flex; flex-direction: column; padding: 10px 0; } .faq .list-faq .no-result { padding: 10px 0; border-bottom: 1px solid #ddd; } .faq .list-accordion .question .type { padding: 0 10px; } .faq .list-accordion .question .type::before { display: none; } .faq .list-accordion .question span { height: auto; font-size: 14px; line-height: 21px; } .faq .list-accordion .answer { padding: 20px; font-size: 14px;min-height:60px; } .faq .list-accordion .answer img {width:100%;} .faq .list-accordion .answer::before { left: 10px; top: 26px; } .faq .list-accordion .answer table {width: 100% !important;display: inline-block !important;overflow-x: scroll !important;} /* qna */ .qna .contents { width: 100%; min-height: 200px; padding-bottom: 40px; } .qna .inner .tabs { width: 100%; padding: 0 16px; box-sizing: border-box; } .qna .inner .tab_content {margin-top:0px;margin-bottom:0;} .qna .title { height: auto; margin-bottom: 0; } .list-search-wrap { display: flex; flex-direction: column-reverse; } .data .list-search-wrap { flex-direction: column; } .qna .list-search-wrap form {display:flex;flex-direction:column-reverse;} .qna .title .right, .qna .title .left { width: 100%; padding: 0 16px; box-sizing: border-box;display:flex; } .qna .title .right {flex-direction: column;} .qna .title .total-count .count { font-size: 14px; margin-top: 10px; } .qna .title .list-input { margin: 10px 0 0; box-sizing: border-box; width: 100%; } .qna .title .list-input input { width: 90%; } .qna .title .list-input button { background: url("/images/icon/icon-search-mo.png") no-repeat center center; } .qna .inner .tabs_item { padding: 0 16px; box-sizing: border-box; } .qna .list-table-wrap .t-tit-line { display: none; } .qna .list-table-wrap table { position: relative; font-size: 14px; flex-wrap: wrap; align-items: center; } .qna .list-table-wrap table th, .qna .list-table-wrap table td { height: auto; } .qna .list-table-wrap table .t-num { position: absolute; } .qna .list-table-wrap table .t-tit { width: 100%; padding-left: 40px; box-sizing: border-box; } .qna .list-table-wrap table .t-writer { padding-left: 40px; } .qna .list-table-wrap table .t-writer, .qna .list-table-wrap table .t-date, .qna .list-table-wrap table .t-answer { width: auto; } .qna .list-table-wrap table .t-writer, .qna .list-table-wrap table .t-date { margin-right: 10px; padding-right: 10px; border-right: 1px solid #ccc; line-height: 1;text-align:left;width:auto !important;padding-left:0; } .qna .btn-box, .qna .btn-box .btn { width: 100%; } /* qna 작성 */ .qna-data .contents { min-height: auto; } .w-tit:not(.wt-secret .w-tit) { display: none; } .community-write .required-text { display: none; } .qna-write-table, .qna-write-table li { border: none; } .qna-write-table ul { position: relative; padding-bottom: 70px; } .qna-write-table .wt-title { width: 100%; height: 50px; } .wt-secret .w-tit { background: none; padding: 0; font-size: 14px; } .qna-write-table .wt-secret { width: 100%; position: absolute; bottom: 20px; } .qna-write-table .wt-mail { position: absolute; bottom: -20px; } .qna-write-table .wt-mail label span { font-size: 14px; color: #666; } .w-form { padding: 0; display: flex; } .community-write textarea { height: 186px; margin-bottom: 10px; } #dropzone {margin-top:20px;} #dropzone .dz-message label {margin-top:5px;font-size:14px;line-height:26px;display:none;} .qna-write-table .wt-attachments .attachments-btn { margin-right: 10px; } .qna-write-table .wt-attachments .file { display: flex; box-sizing: border-box; flex: 1; padding: 0% 30px 0px 4px; } .qna-write-table .wt-attachments .file span img { margin-bottom: 0; } .qna-write-table .wt-attachments .file span { font-size: 10px; overflow: hidden; } .qna-write-table .wt-attachments .file .close { top: 13px; } .qna-write-table .wt-attachments .file .close, .qna-write-table .wt-attachments .file .close img { height: 9px; } .community-write .btn-wrap { display: flex; } .community-write .btn-wrap .btn { width: 48%; margin: 0 1%; } .community-write .btn-wrap .btn[type="submit"] { margin-right: 16px; } /* qna 자세히 보기 */ .qna-data .community.qna { padding: 0 16px; box-sizing: border-box; } .view-body .answer { padding: 10px 0px; margin-top: 10px; } .view-body .answer .answer-top { font-size: 14px; padding: 0px 10px 10px; box-sizing: border-box;width:100%; } .view-body .answer .answer-con { padding: 20px 10px; font-size: 12px; } .qna-data .community.qna .btn-box { margin-bottom: 100px; } .qna-data .community.qna .btn-box .btn { margin: 0; } .qna-data .community.qna .btn-box .right { width: 100%; margin-top: 10px; } .qna-data .community.qna .btn-box .left { display: flex; width: 100%; } .qna-data .community.qna .btn-box .left button { width: 50%; } .qna-data .community.qna .btn-box .left button:first-child { margin-right: 10px; } .view-body .answer .answer-con img {width:100% !important;height:auto !important;} /* 내정보 */ .myinfo .contents { margin-bottom: 0;padding:0% 0%;padding-bottom: 50px; } .myinfo-box { padding: 0 16px; box-sizing: border-box; } .myinfo .inner .row-bottom .myinfo-box .top-info { width: 100%; box-sizing: border-box; padding: 22px 30px 30px; margin-bottom: 24px; } .myinfo .inner .row-bottom .myinfo-box .top-info .left { position: relative; border-right: none; border-bottom: 1px solid #999; padding-right: 0; width: 100%; } .myinfo .inner .row-bottom .myinfo-box .top-info .left h3 { font-size: 24px; line-height: 36px; margin-bottom: 10px; } .myinfo .inner .row-bottom .myinfo-box .top-info .left .sns-login { margin-bottom: 20px; } .myinfo .inner .row-bottom .myinfo-box .top-info .left .date-box { display: none; } .myinfo .inner .row-bottom .myinfo-box .top-info .left .myinfo-btn a { text-indent: -9999px; position: absolute; top: 0; right: 0; width: 24px; height: 24px; background: url("../images/icon/icon-myinfo.png"); } .myinfo .inner .row-bottom .myinfo-box .top-info .right { padding: 0; width: 100%; } .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box { display: flex; flex-direction: column; border-bottom: none; padding-bottom: 0; } .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > div { width: 100%; margin-top: 23px; } .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > div h3 { font-size: 14px; line-height: 21px; } .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > div .list-box { display: flex; justify-content: space-between; } .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > .con-1 .list-box > div, .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > .con-2 .list-box > div { border: none; width: auto; } .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > .con-1 .list-box > div p:nth-child(1), .myinfo .inner .row-bottom .myinfo-box .top-info .right .top-box > .con-2 .list-box > div p:nth-child(1) { font-size: 16px; } .myinfo .inner .row-bottom .myinfo-box .top-info .right .bottom-box .con-1 h3 { font-size: 14px; } .myinfo .inner .row-bottom .myinfo-box .top-info .right .bottom-box .con-1 .key-box span { margin-bottom: 4px; } .myinfo .contents > div .title-box .title h3 { font-size: 16px; } .myinfo .contents .concern-data .title-box .More { display: none; } .myinfo .contents > div .title-box .More { margin-top: 0; } .myinfo .contents > div .title-box .More span { display: none; } .myinfo .contents > div .title-box .More img { width: 22px; } .myinfo .contents > div .title-box { padding-bottom: 0; } .myinfo .contents .concern-data { margin-bottom: 24px; } .myinfo .contents .concern-data .list-box { width: 100%; display: flex; flex-wrap: wrap; } .myinfo .contents .concern-data .list-box .list { width: 47%; margin: 0 16px 16px 0; min-height:330px; } .myinfo .contents .concern-data .list-box .list:nth-child(2n) { margin-right: 0; } .myinfo .contents .concern-data .list-box .list:nth-child(3n) { margin-right: 16px; } .myinfo .contents .concern-data .list-box .list .thum { padding: 10px 0px; } .myinfo .contents .concern-data .list-box .list .thum img { max-height: 123px; } .myinfo .contents .concern-data .list-box .list .text { padding: 10px 15px; } .myinfo .contents .concern-data .list-box .list .text .ti { font-size: 14px; line-height: 21px; min-height: 42px; height: 42px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical; word-wrap: break-word; line-height: 21px; } .myinfo .contents .concern-data .list-box .list .text .cl { font-size: 10px; word-break: break-all; } .myinfo .contents .list-wrap .title-box { padding-bottom: 8px; margin-bottom: -6px; } .myinfo .contents .list-wrap .list-box .list { position: relative; display: flex; flex-direction: column; padding: 26px 10px 10px; box-sizing: border-box; } .myinfo .contents .list-wrap .list-box .list > div.state { width: 100%; text-align: left; } .myinfo .contents .list-wrap .list-box .list > div.state span { position: absolute; top: 10px; left: 10px; min-width: auto; margin-top: 0; } .myinfo .contents .concern-data .list-box .list .text .ti a {height:45px;} /* 내정보 */ .passwd .contents { min-height: auto; } .passwd .row-bottom .myinfo-passwd .text { padding: 0 32px; } .passwd .row-bottom .myinfo-passwd .box { padding: 0 16px; } .passwd .row-bottom .myinfo-passwd .box p input { width: 100%; box-sizing: border-box; } .passwd .inner .row-top { margin-bottom: 100px; } .passwd .row-bottom .myinfo-passwd .btn-box { padding: 0 16px; } .passwd .row-bottom .myinfo-passwd .btn-box a { width: 100%; box-sizing: border-box; } /* 내 정보 */ .join.modify .Userpassword .con p { text-indent: -8px; padding-left: 8px; } .join.modify .Usersns .con .list { display: flex; margin-bottom: 10px; } .join.modify .Usersns .con .list .sns-box { box-sizing: border-box; flex: 1; display: flex; align-items: center; padding: 10px 0; height: auto; } .join.modify .inner .row-bottom .join-box .form-group .con .sns-box span:nth-of-type(1) { width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; margin: 0 12px; } .join.modify .inner .row-bottom .join-box .form-group .con .sns-box span:nth-of-type(2) { display: flex; flex-direction: column; line-height: 1; flex: 1; } .join.modify .inner .row-bottom .join-box .form-group .con .sns-box span:nth-of-type(2) em { text-indent: -9999px; height: 4px; } .join .inner .row-bottom .join-box .form-group .con.sns button { height: 100%; padding: 10px 0; margin-bottom: 0; } .join .inner .row-bottom .join-box .form-group.service .right { width: 100%; display: flex; } .join .inner .row-bottom .join-box .form-group.service .right .chk { width: 50%; } .join.modify p.release { text-align: center; } /* 회원탈퇴 */ .secession .inner .row-bottom { width: 100%; padding: 0 16px; box-sizing: border-box; } .secession .inner .row-top.icon { padding: 40px 0; margin-bottom: 30px !important; } .secession .inner .row-bottom .sec-box .text p:nth-of-type(1) { font-size: 18px; } .secession .inner .row-bottom .sec-box .text .inner-box { padding: 26px 22px 23px 40px; margin-bottom: 10px; } .secession .inner .row-bottom .sec-box .box { padding: 38px 20px; } .secession .inner .row-bottom .sec-box .box p span.name { width: 70px; } .secession .inner .row-bottom .sec-box .text .inner-box p, .secession .inner .row-bottom .sec-box .box p { font-size: 14px; } .secession .inner .row-bottom .sec-box .box p:last-child { margin-bottom: 0; } .secession .btn-box { display: flex; } .secession .btn-box .btn { width: 50%; margin: 0; margin: 0px 0px 70px; } .secession .btn-box .btn:first-child { margin-right: 10px; } /* 관심자료 */ .interested-data .contents { padding: 0 16px; box-sizing: border-box; } .interested-data .inner .data-box .title { display: flex; flex-direction: column-reverse; height: auto; margin-bottom: 0; } .interested-data .inner .data-box .title .count { height: auto; font-size: 14px; line-height: 21px; text-align: left; margin: 16px 0 6px; } .interested-data .inner .data-box .list-data-wrap .list-data { border-top: 1px solid; } .interested-data .inner .data-box .list-data-wrap .list-data .list.t-tit-line { display: flex; flex-direction: row; align-items: center; justify-content: space-between; height: 45px; background: #fff; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd; box-sizing: border-box; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-mo { display: none !important; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-chk { width: auto; display: flex; height: 45px; align-items: center; line-height: 45px; color: #333333; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-chk span { margin-left: 10px; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-delete { color: #333333; } .interested-data .inner .data-box .list-data-wrap .list-data div.list { position: relative; box-sizing: border-box; display: flex; align-items: flex-start; flex-direction: column; height: auto; padding: 0; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-cultural { line-height: 22px; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-cultural { width: 100%; box-sizing: border-box; text-align: left; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data { width: 100%; position: relative; display: flex; flex-direction: column; align-items: flex-start; border-bottom: 1px solid #dddddd; padding: 0px 0px 130px; box-sizing: border-box; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.img { position: absolute; width: 120px; height: 90px; padding: 0; bottom: 20px; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.type { position: absolute; top: -56px; left: 20px; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.img a img { width: auto; height: 100%; display: block; margin: auto; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.type, .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.title { width: 100%;display:inline-block; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.code { margin-bottom: 0; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.subject { position: absolute; left: 150px; bottom: 20px; width: auto; height: 90px; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.subject span { display:inline-block;padding-right: 8px; margin-right: 8px; height: 12px; line-height: 12px; border-right: 1px solid #ccc; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.subject span:last-child { border-right: none; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-data > div.subject em { display: none; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-btn { width: 100%; padding: 20px 0 !important; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-btn > div { display: inline-block; padding-left: 6px; margin-left: 6px; line-height: 1; border-left: 1px solid #3f8f4a; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-btn > div:nth-child(1) { margin: 0; padding: 0; border: none; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-btn button { width: 100%; height: 40px; } .interested-data .inner .data-box .list-data-wrap .list-data div.list > div.t-btn button.btn-ris { display: none; } .interested-data .inner .data-box .list-data-wrap .btn-box { width: 100%; margin: 30px 0 100px; } .interested-data .inner .data-box .list-data-wrap .btn-box .left { width: 100%; display: flex; } .interested-data .inner .data-box .list-data-wrap .btn-box .left .btn { width: 50%; margin: 0; } .interested-data .inner .data-box .list-data-wrap .btn-box .left .btn:nth-child(1) { margin-right: 10px; } /* 방문열람 */ .visit-data .mo_tabs_wrap, .loan-data .mo_tabs_wrap { height: 55px; padding-left: 16px; box-sizing: border-box; } .visit-data .inner .tabs, .loan-data .inner .tabs { /*width: max-content;*//*display: flex;*/white-space: nowrap;overflow-y: hidden;overflow-x: auto;text-align: center;height: 50px;width:100%;} .loan-data .inner .tabs li {width:30%;} .loan-data .inner .tabs li.current::before {bottom: calc(0% - 4px);} .visit-data .mo_tabs_wrap .tabs li a, .loan-data .mo_tabs_wrap .tabs li a { border-radius: 0; } .visit-data .mo_tabs_wrap .tabs li:first-child a, .loan-data .mo_tabs_wrap .tabs li:first-child a { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .visit-data .mo_tabs_wrap .tabs li:last-child a, .loan-data .mo_tabs_wrap .tabs li:last-child a { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .visit-data .inner .visit-box .title, .loan-data .inner .loan-box .title { display: flex; flex-direction: column-reverse; padding: 0 16px; box-sizing: border-box; text-align: left; margin: 50px 0px 0px; } .visit-data .inner .visit-box .title .count, .loan-data .inner .loan-box .title .count { line-height: 1; margin-top: 16px; font-size: 14px; } .visit-data .inner .tab_content, .loan-data .inner .tab_content { padding: 0 16px; box-sizing: border-box; } .visit-data .inner .tabs_item .list-wrap .list-data, .loan-data .inner .tabs_item .list-wrap .list-data { border-top: 1px solid; } .visit-data .inner .tabs_item .list-wrap .list-data .list.t-tit-line, .loan-data .inner .tabs_item .list-wrap .list-data .list.t-tit-line { display: none; } .visit-data .inner .tabs_item .list-wrap .list-data div.list, .loan-data .inner .tabs_item .list-wrap .list-data div.list { display: flex; flex-direction: column; padding: 0; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div, .loan-data .inner .tabs_item .list-wrap .list-data div.list > div { width: 100% !important; text-align: left; padding: 0 10px; box-sizing: border-box; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-data { margin: 10px 0; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-subscription, .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-visit, .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-return { display: flex; font-size: 12px; line-height: 18px; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div .date { margin-right: 10px; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-state .ti { display: flex; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-state .ti .da { margin-left: 10px; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-state { border-top: 1px solid #dddddd; display: flex; align-items: center; justify-content: space-between; padding: 10px 0 10px 10px; margin-top: 10px; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-state button, .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-use button { margin: 0; width: 84px; height: 36px; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-subscription .date::before { content: "신청일: "; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-visit .date::before { content: "희망방문일: "; } .visit-data .inner .tabs_item .list-wrap .list-data div.list > div.n-return .date::before { content: "방문예정일: "; } .visit-data .inner .tabs li {width:30%;} /* 대출관리 */ .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-cultural { margin-top: 10px; } .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-return, .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-data { margin-bottom: 10px; } .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-reservation, .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-expiry, .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-return { font-size: 12px; } .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-use { display: flex; align-items: center; justify-content: space-between; padding: 10px 0 10px 10px; border-top: 1px solid #dddddd; } .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-reservation::before { content: "신청/예약일: "; } .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-expiry::before { content: "신청/예약 만료일: "; } .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-return::before { content: "반납예정일: "; } .loan-data .inner .tabs_item .list-wrap .list-data div.list > div.n-use span {margin-right:10px;} } /* 팝업 */ @media all and (max-width: 479px) { /* 공통 */ a.pop-logo { display: inline-flex; } .contents { width: 100%; min-height: 300px; padding-bottom: 90px !important; } /* 회원증 팝업 */ .pop-member { width: 343px; height: 549px; top: 9%; left: calc(50% - 171.5px); } .pop-member .inner { padding: 30px 0px 20px; } .pop-member .inner .card .title .name { font-size: 22px; } .pop-member .inner .card .title .date { font-size: 12px; } .pop-member .inner .card .qr p { font-size: 14px; margin: 17px 0px 15px; } .pop-member .inner .card .code .num .co { font-size: 14px; } .pop-member .inner .text { font-size: 12px; padding: 16px 0px 0px; } /* 로그인 팝업 */ .pop-login { top: 0; left: 0; width: 100vw; height: 100vh; border-radius: 0; display: flex; flex-direction: column; } .pop-login .Title { padding: 25px 16px; text-align: left; } .pop-login .Title p, .pop-login .Title h3 { } .pop-login .inner { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; padding: 60px 16px; box-sizing: border-box; } .pop-login .inner .First { padding: 0; width: 100%; } .pop-login .inner .First .Btn button { font-weight: normal; font-size: 15px; } .pop-login .inner .Text { width: 100%; padding: 56px 0 0; } .pop-login .inner .mo-pop-Title { display: block; } .pop-find .inner {height: calc(100% - -60px);} /* 상세검색 팝업 */ .popup.pop-advanced-search .pop-wrap { width: 100vw; height: 100vh; border-radius: 0; } .pop-advanced-search .pop-wrap .Title { padding: 0 16px; box-sizing: border-box; width: 100%; } .pop-advanced-search .pop-wrap .Title span:nth-of-type(3) { right: 16px; } .popup.pop-advanced-search .pop-wrap .Title span:nth-of-type(1) { font-size: 22px; line-height: 33px; } .popup.pop-advanced-search .pop-wrap .Title span:nth-of-type(2) { display: none; } .popup.pop-advanced-search .pop-wrap form { padding: 22px 8px 22px 8px;height: calc(100% - 140px); } .mCSB_inside > .mCSB_container { margin-right: 10px; } .advanced-form-table li { display: flex; flex-direction: column; border: none; width: 100% !important; } .advanced-form-table li:nth-child(1) label, .advanced-form-table li:nth-child(5) label, .advanced-form-table li:nth-child(6) .tit label { letter-spacing: -14px; } .advanced-form-table li:nth-child(7) .input-area { padding-bottom:20px; } .advanced-form-table .row-class .check {width:15%;} .advanced-form-table .row-class .check:nth-of-type(4) {position:relative;top:15px;} .advanced-form-table { border: none; border-bottom: none; border-radius: 0; } .advanced-form-table .tit { text-align: left !important; font-weight: 500; font-size: 16px; line-height: 24px; } .advanced-form-table .input-area { background: none; border: none; padding: 0; height: auto; } .advanced-form-table .input-area input { padding: 0 10px; } .pop-advanced-search .conditions-wrap .conditions-box { border: none; border-top: 1px solid #ddd; background: none; } .pop-advanced-search .depth1-check input[type="checkbox"] + label { visibility: hidden; } .pop-advanced-search .tab-name { font-size: 12px; } .pop-advanced-search .conditions-wrap .line { display: flex; flex-wrap: wrap; } .pop-advanced-search .conditions-wrap .depth1 { width: 33.3%; } .pop-advanced-search .conditions-wrap .depth1 .check { position: relative; } .pop-advanced-search .conditions-wrap .depth1:first-child { border-left: 1px solid #ddd; } .pop-advanced-search .conditions-wrap .depth1:last-child { border-right: 1px solid #ddd; } .pop-advanced-search .conditions-wrap.conditions-datype .depth1:last-child { width: 33.5%; } .pop-advanced-search .conditions-wrap .depth1 .depth2 { top: 50px; height: auto; border-left: 1px solid #ddd; padding: 20px 10px; } .pop-advanced-search .conditions-wrap .depth1 .depth2 li { width: auto; margin-right: 6px; } .conditions-wrap .selected-conditions {min-height:40px;} .conditions-wrap .selected-conditions .title p { display: none; } .pop-advanced-search button.btn-close-pop { display: none; } .pop-advanced-search .check input[type="checkbox"] + label:before { background-color: #fff; } .advanced-form-table .row-times .check { margin-right: 0; width: 25%; height: 40px; display: inline-flex; align-items: center; } .advanced-form-table .row-times .check:nth-child(4n) { width: auto; } .advanced-form-table .row-times .check:nth-child(8) { top: -8px; } .advanced-form-table .row-times .check label span { display: block; } .pop-advanced-search .check label[for="times-chk8"] { top: 9px; } .pop-advanced-search .check input[type="checkbox"] + label[for="times-chk8"]::before { top: 0px; } .pop-advanced-search .btn-wrap { margin: 0; display: flex; } .pop-advanced-search .btn-wrap .btn { width: 50%; } .check input[type="checkbox"]:checked + label:before {background: url(/images/icon/icon-checked.svg) no-repeat 2px;} .popup .btn-wrap {padding-top:59px;} .conditions-wrap .selected-conditions .conditions li button {text-align:left;} /* 알림 팝업 */ .pop-notice { width: 343px; height: 549px; left: calc(50% - 171.5px); } .pop-notice .Title p { display: none; } .pop-notice .Title h3 { font-size: 22px; line-height: 33px; } .pop-notice .inner .Text p { font-size: 16px; line-height: 24px; } .pop-notice .inner { padding: 50px 0px 0px; } .pop-notice .inner .row { padding: 0px 16px 0px; } .pop-notice .inner .btn-box .btn { width: 100%; margin-bottom: 6px; margin-right: 0; } /* 계정연결, 비밀번호 입력 팝업 */ .pop-login-connect, .pop-login-password { top: 0; left: 0; width: 100vw; height: 100vh; border-radius: 0; display: flex; flex-direction: column; } .pop-login-connect .Title, .pop-login-password .Title { padding: 12px 16px; text-align: left; } .pop-login-connect .Title p, .pop-login-connect .Title h3, .pop-login-password .Title p, .pop-login-password .Title h3 { } .pop-login-connect .inner, .pop-login-password .inner { height: calc(100% - 75px);display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; box-sizing: border-box; padding: 60px 16px; } .pop-login-connect .inner .row, .pop-login-password .inner .row { padding: 0; width: 100%; } .pop-login-connect .inner h3.row, .pop-login-password .inner h3.row { display: block; } .pop-login-connect .inner .Text p { padding: 0px 90px 0px; } .pop-login-connect .inner .First .Btn button span, .pop-login-connect .inner .btn p .cancel, .pop-login-password .inner .First .Btn button span, .pop-login-password .inner .btn p .cancel { font-size: 14px; } .pop-login-connect .inner .btn { margin: 30px 0 0; } .pop-login-password .inner .btn p { margin-top: 50px; } .pop-login-password .btn-box { margin: 100px 0 0; display: flex; } .pop-login-password .inner .btn-box .btn { width: 50%; padding: 0; } .pop-login-password .inner .btn-box .btn:last-child { margin-right: 0; } /* 계정 연결 */ .join.succ.connect .inner .row-bottom .join-box .success .text:nth-of-type(1) p { font-size: 20px; } .join.connect .inner .row-bottom .join-box .success .text p:nth-of-type(2) button { font-size: 13px; } .join.connect .inner .row-bottom .join-box .success .box { width: 100%; box-sizing: border-box; padding: 3% 16px; display: flex; justify-content: center; } /* 공유하기 팝업 */ .popup .pop-wrap { width: 343px; height: 549px; /* top: 9%; left: calc(50% - 171.5px); */} .pop-sharing p { font-size: 16px; } .pop-sharing .sns-list button img { display: inline-block; width: 24px; height: 24px; padding: 14px; } .pop-sharing .link-copy { display: flex; padding: 16px; align-items: center; } .pop-sharing .link-copy .btn { width: auto; min-width: auto; } .pop-sharing .pop-wrap .Qr .inner { border-radius: 10px; padding: 30px 0 0 0; text-align: center; } .pop-sharing .pop-wrap .Qr .inner .Qrimg { padding: 0; } .pop-sharing .pop-wrap .Qr .inner .Qrimg img { max-width: 130px; margin-bottom: 30px; } /* 비밀번호 변경, 찾기 */ .pop-change, .pop-find { top: 0; left: 0; width: 100vw; height: 100vh; border-radius: 0; display: flex; flex-direction: column; } .pop-change .Title, .pop-find .Title { padding: 12px 16px; text-align: left; } .pop-change .Title p, .pop-change .Title h3, .pop-find .Title p, .pop-find .Title h3 { } .pop-change .inner, .pop-find .inner { flex: 1; } .pop-change .inner .row, .pop-find .inner .row { padding: 0 16px; } .pop-change .inner .row.change h3, .pop-find .inner .row.Text h3 { font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; margin-bottom: 30px; } .pop-change .inner .change p.text { text-align: center; } .pop-find .inner .find p.text { text-indent: -7px; padding-left: 7px; } .pop-change .inner .row.btn-box, .pop-find .inner .row.btn-box { display: flex; } .pop-change .inner .row.btn-box .btn, .pop-find .inner .row.btn-box .btn { width: 50%; margin: 0; } .pop-change .inner .row.btn-box .btn:nth-child(1), .pop-find .inner .row.btn-box .btn:nth-child(1) { margin-right: 10px; } .pop-find .Title h3 {margin-top:5px;} /* 반려사유 팝업 */ .pop-return { top: 0; left: 0; width: 100vw; height: 100vh; border-radius: 0; display: flex; flex-direction: column; } .pop-return .Title { padding: 12px 16px; text-align: left; } .pop-return .Title p, .pop-return .Title h3 { } .pop-return .inner { flex: 1; } .pop-return .inner .Text h3 { font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; color: #222222; margin-bottom: 55px; } .pop-return .inner .Text .text-box { word-break: break-all; } .pop-return .inner .row { padding: 0 16px; text-align: center; } .pop-return .inner .btn-box .btn { width: 100%; } /* 서지정보 */ .pop-serge { top: 0; left: 0; width: 100vw; height: 100vh; border-radius: 0; display: flex; flex-direction: column; } .pop-serge .Title { padding: 12px 16px; text-align: left; } .pop-serge .Title h3 { display: none; } .pop-serge .inner .serge-close { right: 20px; top: 20px; } .pop-serge .inner { flex: 1; overflow: scroll; } .pop-serge .Text h3 { font-weight: 500; font-size: 22px; line-height: 33px; text-align: center; margin-bottom: 30px; } .pop-serge .inner .Text .con-1 > p, .pop-serge .inner .Text .con-2 > p { font-size: 16px; } .pop-serge .inner .Text .text-box { padding: 20px 20px 20px 30px; margin-bottom: 20px; } .pop-serge .inner .Text .text-box p:nth-of-type(1), .pop-serge .inner .Text .con-2 .text-box p:nth-of-type(1) { text-indent: 0; } .pop-serge .inner .Text .con-2 .text-box p:nth-of-type(2) { text-indent: -7px; } .pop-serge .inner .btn-box { display: flex; } .pop-serge .inner .btn-box .btn { width: 50%; margin: 0; } .pop-serge .inner .btn-box .btn:last-child { margin-left: 10px; } } /* 추가 작업 */ @media all and (max-width: 479px) { /* error */ .error { padding: 0 16px; box-sizing: border-box; } .error .text p:nth-of-type(1) { font-size: 24px; } .error .text p:nth-of-type(2) { font-size: 16px; } .error .box p:nth-of-type(1) { font-size: 14px; } .error .box .btn { display: flex; padding: 0 10px; box-sizing: border-box; } .error .box .btn a { padding: 0px 30px; width: 50%; } .error .box .btn a.btn-white { width: 100%; } .service .top-bg {width:100%;height:450px;background-color:#f9f9f9;background-position:0px 0px;} .service .con {width:100%;} .service .top-bg p:nth-child(1) {margin:300px 5% 20px;font-size:16px;color:#333;} .service .top-bg p:nth-child(2) {margin:0 5%;font-size:12px;color:#333;} .privacy .top-bg {width:100%;height:450px;background-color:#f9f9f9;background-position:0px 0px;} .privacy .con {width:100%;} .privacy .top-bg p:nth-child(1) {margin:300px 5% 20px;font-size:16px;color:#333;} .privacy .top-bg p:nth-child(2) {margin:0 5%;font-size:12px;color:#333;} /* 약관 */ .privacy-box { padding: 0 16px; box-sizing: border-box; } .provision .top-bg, .provision .con { width: 100%; } .provision .top-bg { height: 508px; background: url("/images/bg/bg-service-mo.jpg") no-repeat; box-sizing: border-box; padding: 0 30px 30px; margin: 0 auto 20px; display: flex; flex-direction: column; justify-content: flex-end; } .privacy.provision .top-bg { background: url("/images/bg/bg-privacy-mo.jpg") no-repeat; } .provision .top-bg p { width: 100%; } .provision .top-bg p:nth-child(1) { margin: 0; font-size: 18px; margin-bottom: 10px; word-break: break-all; } .provision .top-bg p:nth-child(2) { margin: 0; font-size: 14px; word-break: break-all; } .provision .top-bg p:nth-child(2) br { display: none; } .provision .con .sec { padding-bottom: 20px; margin-bottom: 20px; } .provision .con .sec h2 { margin-bottom: 6px; font-size: 16px; } .provision .con .sec p, .provision .con .sec ul li { font-size: 12px; line-height: 18px; } .provision .con .sec ul.d2 { padding-left: 10px; margin-bottom: 10px; } /* 관련사이트 */ footer .family_site .site_depth { width: 89%;margin:0% 5.5%; left: 0; top:auto;bottom: 40px; } footer .family_site .site_name:after {background: url(/images/icon/icon-up-arr.png) no-repeat right top;} footer .family_site.on .site_name:after {background: url(/images/icon/icon-down-arr.png) no-repeat right top;} .wrap .nav-wrap #primary-nav {display:none !important;opacity:0 !important;} } @media all and (max-width: 350px) { /* 공유하기 팝업 */ .popup .pop-wrap { width: 90%; margin:0% 5%; height: auto; top: 2%; left: auto;transform:none;} /* 알림 팝업 */ .pop-notice { width: 90%; margin:0% 5%; top: 2%; left: auto; } /* 회원증 팝업 */ .pop-member { width: 90%; margin:0% 5%; height: auto; top: 2%; left: auto; } }