최초 세팅
This commit is contained in:
bd091
901
src/main/resources/static/css/admin/common.css
Normal file
901
src/main/resources/static/css/admin/common.css
Normal file
@@ -0,0 +1,901 @@
|
||||
/*
|
||||
Ntsoft v1.0.2
|
||||
Copyright 2021.11 NTSOFT, Inc.
|
||||
*/
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box; text-shadow:none;
|
||||
/*color:rgba(49, 58, 70, .8);*/
|
||||
}
|
||||
svg , path {color:unset;}
|
||||
|
||||
/* .box-sizing(@box-model) {
|
||||
-webkit-box-sizing: @box-model; //사파리 <= 5
|
||||
-moz-box-sizing: @box-model; //파이어폭스 <= 19
|
||||
box-sizing: @box-model;
|
||||
} */
|
||||
|
||||
|
||||
body {font-family: 'Pretendard', sans-serif; padding:0; margin:0; font-size:13px;}
|
||||
|
||||
/*상단네비*/
|
||||
/* .navbar.navbar-default {border-radius:0; margin-bottom:0; z-index:2; position:fixed; width:100%; background-color:#2196F3; border-color:#2196F3; border:none; height:50px; min-width:590px;}
|
||||
.navbar.navbar-default .container-fluid {padding-left:0; padding-right:0;}
|
||||
.navbar.navbar-default .container-fluid .navbar-header {float:left; width:270px;}
|
||||
.navbar.navbar-default .container-fluid .navbar-header svg {display:none;}
|
||||
.navbar.navbar-default .container-fluid .navbar-header svg path {color:#fff;}
|
||||
.navbar.navbar-default .container-fluid .navbar-collapse{display:block; width:calc(100% - 270px); float:right; border:none; padding:0 10px;}
|
||||
.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {font-size:18px; font-weight:bold; line-height:50px; padding:0; width:200px; color:#fff; margin:0; padding-left:20px;}
|
||||
.nav.navbar-nav {float:right; padding:9px 0; margin:0;}
|
||||
.nav>li {float:left;}
|
||||
.navbar .nav > li > a {font-size:13px; color:#fff; width:120px; line-height:20px; text-align:center; padding:6px 0; background:#0E3F66; margin-left:10px; font-weight:700; border-radius:.267rem;}
|
||||
.navbar .nav > li > a.redBtn {background:#fc5083;}
|
||||
.navbar .nav > li > a.redBtn:hover {background:#eb4375;}
|
||||
.navbar .nav > li > a:hover {position:relative; z-index:1; display:inline-block; overflow:hidden; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-transition:.3s ease-out; transition:.3s ease-out; vertical-align:middle; background-color:#0a375a; color:#fff;}
|
||||
.navbar .nav > li > a:focus {background:#082e1c; color:#fff;}
|
||||
.navbar .nav > li > a.service {padding-left:24px;}
|
||||
.navbar .nav > li > a.member {padding-left:24px;}
|
||||
.navbar .nav > li > a.logout {padding-left:16px;}
|
||||
.navbar .nav > li > a.service svg {position:absolute; top:3px; left:22px; width:18px;}
|
||||
.navbar .nav > li > a.member svg {position:absolute; top:8px; left:22px; width:18px;}
|
||||
.navbar .nav > li > a.logout svg {position:absolute; top:7px; left:22px; width:18px; height:18px;}
|
||||
.far.fa-sun {margin-right:5px;}
|
||||
.nav-tabs > li {width:100%;}
|
||||
.nav.nav-tabs.left {width:200px; height:100vh; border:none; float:left; position:absolute; top:0; z-index:1; padding-top:52px;}
|
||||
.left .caret {display:none;}
|
||||
.fas.fa-school {margin-right:5px; width:20px; text-align:center;}
|
||||
.fas.fa-plus {float:right; padding:9px 0; font-size:11px;}
|
||||
.fas.fa-minus {float:right; padding:9px 0; font-size:11px;}
|
||||
.nav-tabs .dropdown-menu {width:100%; box-shadow:none; border-radius:0; border:none; padding:0; position:relative;}
|
||||
.left .dropdown-menu > li > a {padding-left:40px; height:40px; line-height:34px; font-size:13px;}
|
||||
.left .dropdown-menu > li > a.active {}
|
||||
.left li {width:100%; display:inline-block; visibility:visible; position:relative;}
|
||||
.fas.fa-book-reader {margin-right:5px; width:20px; text-align: center;}
|
||||
.fas.fa-chalkboard-teacher {margin-right:5px; width:20px; text-align:center;}
|
||||
.fas.fa-baby {margin-right:5px; width:20px; text-align:center;}
|
||||
.fas.fa-user-tie {margin-right:5px; width:20px; text-align:center;}
|
||||
.fas.fa-clipboard-list {margin-right:5px; width:20px; text-align:center;}
|
||||
.nav-tabs > li > a {height:50px; line-height:30px; font-size:14px; box-sizing:border-box; margin:0; border-radius:0; border-bottom:solid 1px #DFE3E7; font-weight:bold;}
|
||||
.far.fa-user {margin-right:10px;}
|
||||
.navbar-nav .open .dropdown-menu {width:250px; padding:0; border-radius:0; border:none; left:-150px;}
|
||||
.name p {padding-left:30px; font-size:14px;}
|
||||
.far.fa-star {margin-right:10px; color:#fff;}
|
||||
.navbar-default .navbar-nav .open .dropdown-menu > li.name > a {width:250px; padding:15px 15px;}
|
||||
.margin0 {margin:0;}
|
||||
.left-btn {width:50%; background:#f7f7f9; position:relative; bottom:0; left:0; text-align:center; border:1px solid #eee;}
|
||||
.right-btn {width:50%; background:#f7f7f9; position:absolute; bottom:0; right:0; text-align:center; border:1px solid #eee;}
|
||||
.dropdown-menu > li.left-btn > a {font-size:13px; line-height:32px;}
|
||||
.navbar-default .navbar-nav .open .dropdown-menu > li.name > a:hover {background:none; color:#333;}
|
||||
.dropdown-menu > li.right-btn > a {font-size:13px; line-height:32px;}
|
||||
.left .open > a, .left .open > a:hover, .left .open > a:focus {border:none; border-bottom:solid 2px; box-sizing:border-box;}
|
||||
.breadcrumb > li {font-size:13px;}
|
||||
.breadcrumb {padding-left:0; margin:0;}
|
||||
.right .col-md-12 {padding:0;}
|
||||
.right .col-md-12.box {background:#fff; border:solid 1px #DFE3E7; margin:20px 0 30px; padding:20px; border-radius:4px; clear:both; background:#fff;}
|
||||
|
||||
|
||||
@media only screen and (max-width:1200px) {
|
||||
.navbar.navbar-default .container-fluid .navbar-header svg#btn_mobileMenu {display:block; width:50px; height:50px; color:#fff; padding:11px; float:left;}
|
||||
.navbar.navbar-default .container-fluid .navbar-header svg#btn_mobileMenu2 {display:block; width:50px; height:50px; color:#fff; padding:7px; float:left;}
|
||||
.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {padding:0;}
|
||||
.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {margin-right:0;margin-left:0;}
|
||||
} */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 왼쪽메뉴 */
|
||||
.left-menu {overflow:auto; background:#151515; z-index:9; top:0px; left:0; width:200px; height:100%; box-sizing:border-box; vertical-align:top; position:fixed; padding-bottom:50px;}
|
||||
.left-menu::-webkit-scrollbar {width:6px; height:6px;}
|
||||
.left-menu::-webkit-scrollbar-thumb {border-radius:8px; background-color:#377ec1;}
|
||||
.left-menu::-webkit-scrollbar-corner {background:#151515;}
|
||||
|
||||
.left-menu .navbar-brand {line-height:50px; padding:0; display:table; width:100%; padding-left:15px;}
|
||||
/*
|
||||
.left-menu .navbar-brand .logo {width:30px; height:30px; position:relative; float:left; top:10px; margin-right:10px;}
|
||||
.left-menu .navbar-brand .logo img {width:100%; position:absolute; top:50%; left:50%; transform:translate3d(-50%, -50%, 0);}
|
||||
.left-menu .navbar-brand .logoSpan {color:#fff; font-weight:bold;}
|
||||
*/
|
||||
.left-menu .navbar-brand .imgBox {height:50px;}
|
||||
.left-menu .navbar-brand .imgBox img {width:130px;}
|
||||
|
||||
.left-menu #sidebar ul.components {background:#151515;}
|
||||
.left-menu .left-icon {width:20px; float:left; font-size:14px; position:relative; top:3px; margin-right:8px;}
|
||||
.left-menu #sidebar .components li a .right-icon {font-size:22px; position:absolute; right:10px; top:50%; transform:translateY(-50%);}
|
||||
.left-menu a, .left-menu a:hover, .left-menu a:focus {text-decoration:none;}
|
||||
.left-menu a[data-toggle="collapse"] {position:relative;}
|
||||
|
||||
.left-menu #sidebar .components li {display:table; width:100%;}
|
||||
.left-menu #sidebar .components li a {display:inline-block; padding:5px 10px; width:100%;}
|
||||
.left-menu #sidebar .components li a svg {fill:rgba(255, 255, 255, .6); float:left; /*background:rgb(131 212 217 / 50%);*/ padding:2px; border-radius:4px;}
|
||||
.left-menu #sidebar .components li a .tempSpan {color:rgba(255, 255, 255, .6); line-height:30px; font-size:14px; word-break:keep-all;}
|
||||
.left-menu #sidebar .components li.active a {background:#29292c;}
|
||||
.left-menu #sidebar .components li.active a svg {fill:#fff;}
|
||||
.left-menu #sidebar .components li.active a .tempSpan {color:#fff;}
|
||||
.left-menu #sidebar .components li:hover a svg {fill:#fff;}
|
||||
.left-menu #sidebar .components li:hover a .tempSpan {color:#fff;}
|
||||
|
||||
.left-menu #sidebar .collapse.in {display:block; color:#fff; background:#055b80;}
|
||||
.left-menu #sidebar .collapse.in li {background:#43485e;}
|
||||
.left-menu #sidebar .components li .list-unstyled > li a {background:#29292c; border-bottom:none; font-size:13px; font-weight:normal; padding:8px 20px 8px; padding-left:40px; color:rgba(255, 255, 255, .6);}
|
||||
.left-menu #sidebar .components li .list-unstyled > li a:hover {color:#fff;}
|
||||
.left-menu #sidebar .components li .list-unstyled > li.active a {color:#fff; background:#377ec1;}
|
||||
.left-menu #sidebar .categoryLeftMenu {background:#377ec1; padding:2px 0; padding-left:20px; color:#fff;}
|
||||
.left-menu .imgNon{display:none;}
|
||||
.dropdown-toggle::after {display:none;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*왼쪽메뉴 간략화(아이콘)*/
|
||||
.left-menu.summary {width:60px;}
|
||||
.tapNav.summary {left:60px; width:calc(100% - 60px);}
|
||||
.rightBoxNT.summary {left:60px; width:calc(100% - 60px);}
|
||||
|
||||
.left-menu.summary #sidebar .components li {position:relative; height:40px;}
|
||||
.left-menu.summary a[data-toggle="collapse"] {position:absolute;}
|
||||
.left-menu.summary #sidebar .components li a {width:60px;}
|
||||
.left-menu.summary #sidebar .components li a .right-icon, .left-menu.summary #sidebar .components li .list-unstyled {display:none;}
|
||||
.left-menu.summary #sidebar .components li a svg {display:block; float:unset; margin:0 auto;}
|
||||
|
||||
.left-menu.summary #sidebar .components li:hover a .tempSpan {display:inline-block !important; width:150px; height:40px; background:#151515; float:right; position:absolute; top:0; left:60px; line-height:40px; padding-left:10px;}
|
||||
.left-menu.summary #sidebar .components li.active:hover a .tempSpan {display:inline-block !important; width:150px; height:40px; background:#377ec1; float:right; position:absolute; top:0; left:60px; line-height:40px; padding-left:10px;}
|
||||
.left-menu.summary #sidebar .components li:hover .list-unstyled {display:inline-block !important; width:150px; height:40px; background:#151515; float:right; position:absolute; top:40px; left:60px; line-height:40px;}
|
||||
.left-menu.summary #sidebar .components li:hover .list-unstyled li a {display:inline-block !important; width:150px; padding:0; padding-left:10px;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.tapNav {margin:0; padding:0; background:#151515; position:fixed; top:0; left:200px; z-index:9; min-width:1000px; width:calc(100% - 200px); word-spacing:-1px;}
|
||||
/* .tapNav #btn_mobileMenu {display:none;} */
|
||||
.tapNav svg#btn_mobileMenu {display:block; float:left; margin:10px 5px 0; fill:#fff;}
|
||||
.tapNav svg#btn_mobileMenu2 {display:block; float:left; margin:10px 5px 0;}
|
||||
/* 경로 */
|
||||
.tapNav .breadcrumb {background:none; padding:0; line-height:50px; float:left; margin:0;}
|
||||
.tapNav .breadcrumb>li.active {color:#377ec1;}
|
||||
.rightBtnWrap {float:right; padding:10px 0; margin:0 10px 0 0; list-style:none;}
|
||||
.rightBtnWrap li {float:left;}
|
||||
.rightBtnWrap li > p {margin:0; margin-left:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:14px; display:block; text-align:center; color:#fff;}
|
||||
.rightBtnWrap li > a {background:#1e2362; width:100px; margin:0; margin-left:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:13px; display:block; text-align:center; color:#fff; text-decoration:none;}
|
||||
.rightBtnWrap li > a:hover {position:relative; z-index:1; display:inline-block; overflow:hidden; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-transition:.3s ease-out; transition:.3s ease-out; vertical-align:middle; background-color:#191e58; color:#fff;}
|
||||
|
||||
.rightBtnWrap li > a.logout {background:#c50000; color:#fff;}
|
||||
.rightBtnWrap li > a.logout:hover {background:#bf0000;}
|
||||
|
||||
/*탭네비*/
|
||||
.tapNav .tabWrap {background:#333; /*overflow:hidden;*/ width:100%; position:relative; height:40px; top: 50px;}
|
||||
.tapNav .tabWrap .tabList {margin:0; border-bottom:none; outline:none; transition:padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); position:absolute; height:40px; width:calc(100% - 40px);}
|
||||
.tapNav .tabWrap .tabList .tabContainer {position:relative; box-sizing:border-box; margin-bottom:-1px; /*overflow:hidden;*/ font-size:14px; line-height:1.5715; white-space:nowrap; transition:padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); zoom:1; padding:0 40px; height:auto;}
|
||||
.tapNav .tabWrap .tabList .tabContainer::before, .tapNav .tabWrap .tabList .tabContainer::after {display:table; content:'';}
|
||||
.tapNav .tabWrap .tabList .tabContainer .tabPrev {left:0;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .tabNext {right:2px;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .tabPrev, .tapNav .tabWrap .tabList .tabContainer .tabNext {position:absolute; z-index:2; width:40px; height:100%; text-align:center; background-color:transparent; border:0; cursor:pointer; opacity:.7; transition:color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); user-select:none; pointer-events:auto; line-height:1; color:#fff;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .tabPrev:hover , .tapNav .tabWrap .tabList .tabContainer .tabNext:hover {opacity:1;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .disabled {cursor:not-allowed;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .disabled, .tapNav .tabWrap .tabList .tabContainer .disabled:hover {opacity:.4;}
|
||||
|
||||
.tapNav .tabWrap .tabList .tabContainer .tabPrev .tabPrevTarget, .tabWrap .tabList .tabContainer .tabNext .tabNextTarget {font-size:14px; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); color:#fff;}
|
||||
|
||||
.tapNav .tabWrap .allClose {height:40px; position:absolute; right:0;}
|
||||
.tapNav .tabWrap .allClose svg {padding:8px; fill:rgba(255, 255, 255, .8);}
|
||||
.tapNav .tabWrap .allClose:hover svg {fill:#fff;}
|
||||
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap {overflow-x:scroll; white-space:nowrap;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap::-webkit-scrollbar {display:none;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox {position:relative; display:inline-block; box-sizing:border-box; margin:0; padding-left:0; list-style:none; transition:transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox::before, .tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox::after {display:table; content:' ';}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab {padding:0; background:none; height:40px; line-height:40px; transition:background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); border-radius:0; border:none; margin:0; position:relative; display:inline-block; box-sizing:border-box; text-decoration:none; cursor:pointer; font-size:13px;}
|
||||
/* .tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab .unclosable {color:#fff;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab .tabPadding {color:#fff;} */
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab.active {background:#fff;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab.dashboard {padding:0 16px;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab.dashboard .unclosable { color:rgba(255, 255, 255, .8);}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab.active .tabPadding {color:rgba(49, 58, 70, .8);}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab .tabPadding {padding:0 28px 0 16px; color:rgba(255, 255, 255, .8);}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab .tabPadding .closeIcon {display:inline-block; color:inherit; line-height:0; text-align:center; text-transform:none; vertical-align:-0.125em; text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; width:auto; height:auto; margin:-6px 0 0 0; position:absolute; right:10px; top:15px; font-size:12px;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab .tabPadding .closeIcon[tabindex] {cursor:pointer;}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab .tabPadding .closeIcon svg {fill:rgba(255, 255, 255, .8);}
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tab.active .tabPadding .closeIcon svg {fill:rgba(49, 58, 70, .8);}
|
||||
|
||||
.tapNav .tabWrap .tabList .tabContainer .scrollWrap .scrollBox .tabBar {position:absolute; bottom:1px; left:0; z-index:1; box-sizing:border-box; width:0; height:2px; background-color:#1890ff; transform-origin:0 0; visibility:hidden; display:none !important;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 전체외각 */
|
||||
.rightBoxNT {margin:0; padding:10px; padding-top:0; background:#fff; position:relative; top:50px; left:200px; /*z-index:1;*/ min-width:1000px; width:calc(100% - 200px); min-height:calc(100vh - 89px); word-spacing:-1px;}
|
||||
/* 상단라인 */
|
||||
.rightBoxNT .formLine {border-top:1px solid #dee2e6;}
|
||||
.rightBoxNT .form-horizontal {margin:0 0 20px; display:table; width:100%; background:#fff; position:relative;}
|
||||
.rightBoxNT .form-horizontal .form-group {display:table; width:100%; border-bottom:1px solid #dee2e6; border-left:none; border-right:none; margin:0; padding:0; background:#f5f7f7;}
|
||||
/* 폼그룹2분할_영역제어 */
|
||||
.rightBoxNT .form-horizontal .form-group50Wrap {margin-top:0; border-bottom:none; display:table; width:100%;}
|
||||
/* 폼그룹2분할 */
|
||||
.rightBoxNT .form-horizontal .form-group50 {width:50%; float:left; border-bottom:1px solid #dee2e6; background:#f5f7f7;}
|
||||
/* 폼그룹라벨제목 */
|
||||
.rightBoxNT .form-horizontal .control-label {float:left; margin:0; width:170px; text-align:left; line-height:30px; padding:5px 0 5px 15px; font-weight:unset;}
|
||||
.rightBoxNT .form-horizontal .control-label .requisite {color:#ff4545;}
|
||||
/* 폼그룹왼쪽정렬*/
|
||||
.rightBoxNT .form-horizontal .floatLeft {float:left;}
|
||||
/* 폼그룹라벨제목 제외한 영역 */
|
||||
.rightBoxNT .form-horizontal .rightWidth {width:calc(100% - 170px); background:#fff;}
|
||||
/*영역필요없는 기간[오늘,3일,7일,1개월], 인풋옆에버튼있을시[ex.파일업로드]*/
|
||||
.rightBoxNT .form-horizontal .rightWarp {padding:5px 0 5px 5px;}
|
||||
|
||||
|
||||
|
||||
|
||||
/* 검색조건_인풋 */
|
||||
.rightBoxNT .form-horizontal .searchWrapInput {width:200px; padding:5px 0 5px 5px;}
|
||||
/* 등록,수정페이지_인풋 */
|
||||
.rightBoxNT .form-horizontal .pageWrapInput {width:250px; padding:5px 0 5px 5px;}
|
||||
/* 등록,수정페이지_텍스트에어리어,에디터 */
|
||||
.rightBoxNT .form-horizontal .pageWrapTextarea {padding:5px; width:100%;}
|
||||
/* kevin 추가 */
|
||||
.rightBoxNT .form-horizontal .smallPageWrapInput {width:100px; padding:5px 0 5px 5px;}
|
||||
|
||||
|
||||
/* 분할영역패딩제거 */
|
||||
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {padding:0;}
|
||||
|
||||
|
||||
|
||||
|
||||
/* 경로 */
|
||||
.rightBoxNT .breadcrumb {background:none; padding:10px 0; margin:0; float:left; line-height:20px;}
|
||||
.rightBoxNT .breadcrumb>li.active {color:#377ec1;}
|
||||
.breadcrumb>li {color:rgba(49, 58, 70, .7);}
|
||||
/* .breadcrumb>li+li:before {color:rgba(49, 58, 70, .2);} */
|
||||
|
||||
|
||||
/* 버튼기본 */
|
||||
.rightBoxNT .btnCommon {width:100px; margin:0 3px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:13px;}
|
||||
/* 버튼기본오른쪽정렬 */
|
||||
.rightBoxNT .btnRightCommon {width:100px; margin:0; margin-left:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:13px;}
|
||||
|
||||
/* 검색화면 및 상세화면 버튼 박스 */
|
||||
.rightBoxNT .btnBox {padding:0; margin:24px auto 4px; min-width:10px; display:table; /*float:right;*/}
|
||||
/* 메인컬러_버튼 */
|
||||
.rightBoxNT .btnMain {background:#377ec1; color:#fff;} /*.rightBoxNT .btnMint*/
|
||||
.rightBoxNT .btnMain:hover {background:#7caad7;}
|
||||
/* 회색_버튼 */
|
||||
.rightBoxNT .btnGray {background:#8e949d; color:#fff;}
|
||||
.rightBoxNT .btnGray:hover {background:#878c95;}
|
||||
|
||||
|
||||
/*상세조회,아이콘버튼사용시*/
|
||||
/*
|
||||
!* 흰색라인_버튼 *!
|
||||
.rightBoxNT .btnWhite {background:#fff; color:#377ec1; border:solid 1px #377ec1;}
|
||||
.rightBoxNT .btnWhite:hover {color:#377ec1; border:solid 1px #377ec1;}
|
||||
.rightBoxNT .btnWhite svg {fill:#377ec1; height:30px; position:absolute;}
|
||||
.rightBoxNT .btnWhite:hover svg {fill:#377ec1;}
|
||||
|
||||
!* 버튼아이콘 *!
|
||||
.rightBoxNT .btnCommon svg {fill:#fff; float:left; padding:3px;}
|
||||
.rightBoxNT .btn-overlap svg {fill:#fff; float:left; padding:3px;}
|
||||
*/
|
||||
|
||||
|
||||
|
||||
/* 폼 공통 */
|
||||
.rightBoxNT .form-horizontal .form-control {border:1px solid #dee2e6; display:block; width:100%; padding:0; padding-left:5px; background-color:#FFF; border-radius:0.267rem; box-shadow:none; height:30px; line-height:30px; font-size:13px; color:rgba(49, 58, 70, .8);}
|
||||
.rightBoxNT .form-horizontal .form-control[disabled]{background:rgba(238, 242, 247, .6);}
|
||||
.rightBoxNT select.form-control:not([multiple=multiple]) {background-image:url(/image/web//image/web/arrow-down.png); background-position:95%; background-size:14px 14px,10px 10px; background-repeat:no-repeat; -webkit-appearance:none; -moz-appearance:none; padding-right:1.5rem; height:30px; color:rgba(49, 58, 70, .8);}
|
||||
.input-group.date .input-group-addon {background:none; border:1px solid #dee2e6; border-left:none; border-left:none;}
|
||||
.input-group.date .input-group-addon[disabled] {opacity:.5; background:#dee2e6;cursor:no-drop;}
|
||||
.rightBoxNT .input-group-addon:last-child {padding:5px 10px;}
|
||||
.glyphicon-calendar:before {color:rgba(49, 58, 70, .8);}
|
||||
.rightBoxNT .form-horizontal .dateInput {border-right:none;}
|
||||
.rightBoxNT .form-horizontal .password {font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;}
|
||||
.rightBoxNT textarea {font-size:13px; border:1px solid #dee2e6; outline:none; padding:.47rem .8rem; display:block; border-radius:0.267rem;}
|
||||
.rightBoxNT textarea.height107 {height: 107px;}
|
||||
.rightBoxNT textarea:focus {border:1px solid #377ec1;}
|
||||
.rightBoxNT textarea:disabled {background:rgba(238, 242, 247, .6);}
|
||||
.rightBoxNT input.form-control:focus {border:1px solid #377ec1;}
|
||||
.rightBoxNT select.form-control:not([multiple=multiple]):focus {border:1px solid #377ec1;}
|
||||
.rightBoxNT .form-horizontal .sideNumber {line-height:30px; color:#97989b; position:relative; left:5px; bottom:-5px;}
|
||||
|
||||
.rightBoxNT .form-horizontal .form-control.dateInput2 {border-radius:0.267rem 0 0 0.267rem;}
|
||||
|
||||
|
||||
/* 기간[오늘,3일,7일,1개월] */
|
||||
.rightBoxNT .form-horizontal .btn-choce {background:none; border-color:#dee2e6; color:rgba(49, 58, 70, .8); height:30px; padding:5px 12px; font-size:13px; font-weight:400; line-height:1.42857143; border-radius:4px;}
|
||||
.rightBoxNT .form-horizontal .btn-choce:hover, .rightBoxNT form .btn-choce:focus {background:#377ec1; color:#fff; outline:none;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 상세페이지 회색버튼 [ex.아이디조회,중복확인] */
|
||||
.rightBoxNT .form-horizontal .overlap {float:left;}
|
||||
.rightBoxNT .form-horizontal .overlap .btnGray {width:100px; background:#377ec1; color:#fff; text-shadow:none; border:none; padding:0; border-radius:.267rem; box-shadow:none; line-height:30px; font-size:13px;}
|
||||
.rightBoxNT .form-horizontal .overlap .btnGray:hover {background:#377ec1;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 리스트 왼쪽,오른쪽,마진제외 버튼 영역 */
|
||||
.rightBoxNT .form-horizontal .btnlistBox {padding:5px 0; display:table; width:100%; border-top:1px solid #a2a2a2;}
|
||||
|
||||
/* 리스트버튼기본 */
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnCommon {width:100px; margin:0 3px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:13px;}
|
||||
/* 리스트버튼기본왼쪽정렬 */
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnLeftCommon {width:100px; margin:0; margin-right:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:13px;}
|
||||
/* 리스트버튼기본오른쪽정렬 */
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnRightCommon {width:100px; margin:0; margin-left:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:13px; float:right;}
|
||||
|
||||
/* 메인컬러_버튼 */
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnMain {background:#377ec1; color:#fff;} /*.rightBoxNT .btnMint*/
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnMain:hover {background:#7caad7;}
|
||||
/* 회색_버튼 */
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnGray {background:#8e949d; color:#fff;}
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnGray:hover {background:#878c95;}
|
||||
/* 빨간색_버튼 */
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnRed {background:#c50049; color:#fff;}
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnRed:hover {background:#bb0045;}
|
||||
/* 엑셀_버튼 */
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnExcel {background:#0f743d; color:#fff;}
|
||||
.rightBoxNT .form-horizontal .btnlistBox .btnExcel:hover {background:#0e6e3a;}
|
||||
|
||||
|
||||
/* 리스트좌측검색갯수 */
|
||||
.rightBoxNT .listNav {display:inline-block; width:100%; height:30px; position:relative;}
|
||||
.rightBoxNT .listNav .numberBox {position: absolute;left: 0;}
|
||||
.rightBoxNT .listNav .numberBox .number {line-height:30px; margin:0; display:inline-block;}
|
||||
.rightBoxNT .listNav .numberBox .number .n-color {color:#377ec1; padding-left:3px;}
|
||||
.rightBoxNT .listNav .numberBox .slush {padding:0 5px; display:inline-block;}
|
||||
.rightBoxNT .listNav .text {color:#324767; text-decoration:none; padding:0px 10px; text-align:left; line-height:34px; margin:0; font-size:16px; font-weight:700; display:block; border-bottom:1px solid #dee2e6;}
|
||||
/* 리스트우측셀렉트3종 */
|
||||
.rightBoxNT .listNav .selectBox {position:absolute; top:0; right:0;}
|
||||
.rightBoxNT .listNav .selectBox .selectList {margin:0 0 0 7px; float:right; width:150px;}
|
||||
|
||||
|
||||
/* 참고문구 */
|
||||
.rightBoxNT .form-horizontal .textareaText {line-height:30px; color:#97989b; position:relative; left:5px; bottom:-105px;}
|
||||
.rightBoxNT .form-horizontal .inputnoneText {font-size:13px; line-height:30px;}
|
||||
.rightBoxNT .form-horizontal .commentText {margin:0 0 0 5px; font-weight:600; line-height:40px;}
|
||||
.rightBoxNT .form-horizontal .inputcomment {clear:both; color:#50c3ca; margin:0; font-size:12px; padding-top:0;}
|
||||
.rightBoxNT .form-horizontal .commentCheck {position:relative; bottom:-5px; font-weight:500; line-height:40px; margin-left:5px;}
|
||||
.rightBoxNT .form-horizontal .commentSide {line-height:30px; color:#97989b; position:relative; left:5px; bottom:-5px;}
|
||||
|
||||
|
||||
/* 체크,라디오 공통 */
|
||||
.rightBoxNT .checkbox, .radio {position:relative; display:inline-block;}
|
||||
.rightBoxNT .checkbox input[type=checkbox], .rightBoxNT .radio input[type=radio] {display:none;}
|
||||
.rightBoxNT input[type=radio], .rightBoxNT input[type=checkbox] {box-sizing:border-box; padding:0;}
|
||||
.rightBoxNT .form-horizontal .checkbox, .rightBoxNT .form-horizontal .radio {min-height:29px; padding:0 5px 0 15px;}
|
||||
|
||||
|
||||
/* 체크박스 */
|
||||
.rightBoxNT .checkbox label {font-size:13px; line-height:30px; margin-left:7px; padding:0;}
|
||||
.rightBoxNT .checkbox label:after, .checkbox label:before {height:18px; width:18px; top:6px; left:0; position:absolute;}
|
||||
.rightBoxNT .checkbox label:after {content:''; border:1px solid #dee2e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.rightBoxNT .checkbox label:before {content:''; border-radius:4px;}
|
||||
.rightBoxNT .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #dee2e6;}
|
||||
.rightBoxNT .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:5px; width:9px; border-color:#6A99F8; border-radius:0; border-width:2px; top:12px; left:5px;}
|
||||
|
||||
|
||||
/* 라디오박스 */
|
||||
.rightBoxNT .radioWrap {padding:5px 0 5px 5px; display:inline;}
|
||||
.rightBoxNT .radio label {font-size:13px; line-height:29px; margin-left:5px; padding:0;}
|
||||
.rightBoxNT .radio label::after, .radio label::before {content:'';}
|
||||
.rightBoxNT .radio label:after, .radio label:before {height:20px; width:20px; top:8px; left:0; position:absolute;}
|
||||
.rightBoxNT .radio label::before {border:1px solid #dee2e6; border-radius:50%; width:16px; height:16px; margin-right:.5rem;}
|
||||
.rightBoxNT .radio label::after {position:absolute; display:-webkit-inline-box; display:-webkit-inline-flex; display:-ms-inline-flexbox; display:inline-flex; height:6px; width:6px; background-color:#377ec1; border-radius:50%; top:13px; left:5px; opacity:0; -webkit-transform:scale(3.6); -ms-transform:scale(3.6); transform:scale(3.6); border:none;}
|
||||
.rightBoxNT .radio input[type=radio]:checked~label::after {opacity:1; -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); -webkit-transition:all .3s cubic-bezier(.35,.9,.4,.9); transition:all .3s cubic-bezier(.35,.9,.4,.9);}
|
||||
|
||||
|
||||
/* 주소 */
|
||||
.rightBoxNT .form-horizontal .addressBox {width:calc(100% - 170px); float:left; padding:5px;}
|
||||
.rightBoxNT .form-horizontal .addressBox .numberBox {margin-bottom:6px; width:245px;}
|
||||
.rightBoxNT .form-horizontal .addressBox .last {margin-bottom:0;}
|
||||
.rightBoxNT .form-horizontal .addressBox .numberBox .number { margin-right:5px; width:calc(245px - 105px);}
|
||||
.rightBoxNT .form-horizontal .btn-overlap {background:#377ec1; color:#fff; text-shadow:none; border:none; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:13px; padding:0; width:100px;}
|
||||
.rightBoxNT .form-horizontal .btn-overlap:hover {background:#377ec1;}
|
||||
/* 버튼아이콘 */
|
||||
.rightBoxNT .btn-overlap svg {fill:#fff; float:left; width:25px}
|
||||
.rightBoxNT .form-horizontal .addressBox .address1 {margin-bottom:5px;}
|
||||
|
||||
/* 주소찾기 */
|
||||
.rightBoxNT .form-horizontal .address {width:calc(100% - 200px); float:left; padding-left:10px;}
|
||||
.rightBoxNT .form-horizontal .address .roadBox {margin-bottom:5px;}
|
||||
.rightBoxNT .form-horizontal .address .roadBox .road {width:29.1%; float:left; margin-right:10px;}
|
||||
.rightBoxNT .form-horizontal .address .roadBox .btn-overlap {width:100px; background:#dee2e6; color:#333; text-shadow:none; border:none; padding:0; border-radius:.267rem; box-shadow:none; line-height:30px; font-size:13px;}
|
||||
.rightBoxNT .form-horizontal .address .roadBox .btn-overlap:hover {background:#dedede;}
|
||||
.rightBoxNT .form-horizontal .address .roadBox .subroad {width:39.6%;}
|
||||
|
||||
|
||||
|
||||
/* 날짜 선택 체크리스트 */
|
||||
.rightBoxNT .choiceDateBox {display:block; overflow-y:scroll; border:1px solid #dee2e6; outline:none; width:100%; height:130px; padding:5px;}
|
||||
|
||||
|
||||
|
||||
/* 파일업로드 */
|
||||
.rightBoxNT .input-file {min-height:37px; padding-right:0; padding-left:15px;}
|
||||
.rightBoxNT .input-file {display:inline-block;}
|
||||
.rightBoxNT .input-file [type="file"] {position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0, 0, 0, 0); border:0 none; }
|
||||
.rightBoxNT .input-file .file-label {background-color:#dee2e6; text-align:center; margin:0 0 0 7px; text-shadow:none; border:none; border-radius:.267rem; box-shadow:none; line-height:30px; font-weight:300; cursor:pointer; padding:0 12px 0 7px;}
|
||||
.rightBoxNT .input-file .btnFile {width:100px; background:#377ec1; text-shadow:none; color:#fff; border:none; padding:0.47rem 0.8rem; border-radius:0.267rem; box-shadow:none; height:35px; margin:0; text-align:center; font-weight:normal; line-height:25px;}
|
||||
/* 버튼아이콘 */
|
||||
.rightBoxNT .input-file .file-label svg {fill:rgba(49, 58, 70, .8); float:left; width:25px}
|
||||
.rightBoxNT .input-file .file-name {width:245px; border:1px solid #dee2e6; padding:.47rem .8rem; background-color:#FFF; border-radius:.267rem; box-shadow:none; height:30px; outline:none; float:left;}
|
||||
.rightBoxNT .input-file [type="file"]:focus {border:1px solid #50c3ca;}
|
||||
/* 첨부파일_파일문구 */
|
||||
.rightBoxNT .download-file {padding-left:15px; height:30px; line-height:24px; color:#dee2e6;}
|
||||
.rightBoxNT .download-file .fileDownloadTitle {color:#999; text-decoration:underline;}
|
||||
|
||||
|
||||
/* 이미지 */
|
||||
/* .rightBoxNT .form-horizontal .photoBox {width:calc(100% - 200px); float:left; padding:0 0 0 10px;} */
|
||||
.rightBoxNT .form-horizontal .photoSlash {width:300px; float:left; padding:0 0 0 10px;}
|
||||
.rightBoxNT .form-horizontal .title-name {margin:5px 0;}
|
||||
.rightBoxNT .form-horizontal .imgnumber {color:#97989b; position:relative; left:10px;}
|
||||
.rightBoxNT input[type="file"] {position:absolute; opacity:0; cursor:pointer; z-index:1;}
|
||||
.rightBoxNT .form-horizontal .photoList {display:table; position:relative;}
|
||||
.rightBoxNT .form-horizontal .videoList {display:table;}
|
||||
.rightBoxNT .form-horizontal .imgBox {width:100px; height:100px; padding:0; float:left; margin-right:10px;}
|
||||
.rightBoxNT .form-horizontal .img-100 {border:1px solid #dee2e6; width:100px; height:100px; background:none; color:#3e3f3a;}
|
||||
.rightBoxNT .form-horizontal .img-100:hover{background:none;border:1px solid #dee2e6;box-shadow:none;}
|
||||
.rightBoxNT .form-horizontal .photoBorder {width:calc(100% - 200px); border-bottom:1px solid #dee2e6; display:-webkit-box; float:right;}
|
||||
.rightBoxNT .form-horizontal .photoBorder.last {border:none;}
|
||||
.rightBoxNT .form-horizontal .sub-name {clear:both; color:#97989b; margin:5px 0 0; font-size:12px; position:relative;}
|
||||
.rightBoxNT .form-horizontal .sub-name:first-child {margin-top:10px;}
|
||||
.rightBoxNT .form-horizontal .sub-name .deleteSvg {width:20px; height:20px; fill:rgba(49, 58, 70, .8); position:absolute;}
|
||||
/* 여러개이미지 */
|
||||
.rightBoxNT .form-horizontal .photoSlashAdd {width:calc(100% - 300px); float:left; padding:0 0 0 10px; display:grid;}
|
||||
.rightBoxNT .form-horizontal .photoListAdd {display:table; position:relative; float:left;}
|
||||
/*사용안할시 제거*/
|
||||
.rightBoxNT .form-horizontal .img-250 {border:1px solid #dee2e6; width:288px; height:288px; background:#f7f7f7;}
|
||||
.rightBoxNT .form-horizontal .img-250 img {opacity:0; width:auto; height:auto; max-width:100%; max-height:100%;}
|
||||
.rightBoxNT .form-horizontal .miniphotoBox {width:calc(100% - 200px - 10px); float:left; padding-left:10px;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 해더고정스크롤 */
|
||||
.rightBoxNT .basicScroll {overflow:hidden; min-width:100%; margin-bottom:21px;}
|
||||
.rightBoxNT .basicScroll .grid-layout {margin:0 auto; width:100%; background:#fff; font-size:12px; color:#444; border:solid 1px #dddfe4; border-top:none; position:relative; box-sizing:border-box;}
|
||||
/*툴팁레이어가 grid-layout 위에 있을 경우 overflow:hidden 제거 필요 */
|
||||
/* 스크롤바 스타일 관련 */
|
||||
.rightBoxNT .basicScroll .grid-layout {scrollbar-highlight-color:#fff; scrollbar-shadow-color:#fff; scrollbar-arrow-color:#8a8a8a; scrollbar-face-color:#d9d9d9; scrollbar-3dlight-color:#fff; scrollbar-darkshadow-color:#fff; scrollbar-track-color:#fff;}
|
||||
.rightBoxNT .basicScroll .grid-layout ::-webkit-scrollbar {-webkit-appearance:none; width:17px; height:17px; background-color:#fff;}
|
||||
.rightBoxNT .basicScroll .grid-layout ::-webkit-scrollbar-thumb {background-color:#d9d9d9; border:5px solid transparent; border-radius:16px; background-clip:content-box;}
|
||||
.rightBoxNT .basicScroll .grid-layout ::-webkit-scrollbar-thumb:hover {background-color:#c1c1c1;}
|
||||
.rightBoxNT .basicScroll .grid-layout ::-webkit-scrollbar-corner {background-color:#f2f2f2;}
|
||||
/* 헤더 영역 */
|
||||
.rightBoxNT .basicScroll .grid-layout .header {position:relative; overflow:hidden;}
|
||||
.rightBoxNT .basicScroll .grid-layout .header .headerBox {overflow:hidden; left:-1px; border-top:1px solid #dee2e6; background:#f6f6f6;}
|
||||
.rightBoxNT .basicScroll .grid-layout .header .base {overflow-x:scroll; margin-right:-1px;}
|
||||
.rightBoxNT .basicScroll .grid-layout .header .config-button {display:none;}
|
||||
.rightBoxNT .basicScroll .grid-layout .header tbody {background-color:#f6f6f6;}
|
||||
.rightBoxNT .basicScroll .grid-layout .header .left {margin-right:16px;}
|
||||
/* 바디 영역 */
|
||||
.rightBoxNT .basicScroll .grid-layout .body {position:relative; overflow:hidden; margin-bottom:-1px;}
|
||||
.rightBoxNT .basicScroll .grid-layout .body .height-bar {display:none;}
|
||||
.rightBoxNT .basicScroll .grid-layout .body .base {margin-right:-1px;}
|
||||
.rightBoxNT .basicScroll .grid-layout .body .bodyBox {top:-1px; left:-1px; overflow:hidden;}
|
||||
.rightBoxNT .basicScroll .grid-layout .vertical-scrollbar-line {display:none;}
|
||||
.rightBoxNT .basicScroll .grid-layout .horizontal-scrollbar-line {display:none; position:absolute; width:100%; height:1px; left:0px; background-color:#dddfe4;}
|
||||
.rightBoxNT .basicScroll .grid-layout .container {position:relative;}
|
||||
.rightBoxNT .basicScroll .grid-layout .body .left {display:none; position:absolute; top:0; margin:0;}
|
||||
.rightBoxNT .basicScroll .grid-layout .right {display:none; position:absolute; top:0; right:-1px;}
|
||||
.rightBoxNT .basicScroll .grid-layout .clipboard {position:absolute; left:-999px; width:1px; height:1px; bottom:0;}
|
||||
/* 합계 영역 */
|
||||
.rightBoxNT .basicScroll .grid-layout .header .footerBox {overflow:hidden; left:-1px; border-top:1px solid #dee2e6; background:#f6f6f6;}
|
||||
/* 그리드 전체 비활성화 */
|
||||
.rightBoxNT .basicScroll .grid-layout .blocker-layer {display:none; position:absolute; background:rgba(0, 0, 0, 0.05); width:100%; height:100%; top:0;}
|
||||
.rightBoxNT .basicScroll .grid-layout.disabled, .basicScroll .grid-layout.disabled th, .basicScroll .grid-layout.disabled .content-holder {color:#e0e0e0 !important;}
|
||||
.rightBoxNT .basicScroll .grid-layout.disabled .blocker-layer {display:block;}
|
||||
/* 수평 스크롤 가능 영역 */
|
||||
.rightBoxNT .basicScroll .grid-layout .horizontal-scrollable {overscroll-behavior-x:none;}
|
||||
/* 수직 스크롤바를 사용하지 않는 경우 */
|
||||
.rightBoxNT .basicScroll .grid-layout .virtual-horizontal-scrollbar {display:none;}
|
||||
.rightBoxNT .basicScroll .grid-layout .virtual-horizontal-scrollbar .space {display:none;}
|
||||
/* 수직 스크롤바를 사용하는 경우 */
|
||||
.rightBoxNT .basicScroll .grid-layout.vertical-scrollbar .header .config-button {display:block; position:absolute; border:solid 1px #dddfe4; top:0; right:-1px; width:18px; background-color:#f6f6f6;}
|
||||
.rightBoxNT .basicScroll .grid-layout.vertical-scrollbar .body {overflow-y:scroll; margin-right:-1px;}
|
||||
.rightBoxNT .basicScroll .grid-layout.vertical-scrollbar .body .height-bar {display:block; position:absolute; width:1px; top:0; left:0; background:transparent;}
|
||||
.rightBoxNT .basicScroll .grid-layout.vertical-scrollbar .virtual-horizontal-scrollbar {margin-right:16px;}
|
||||
.rightBoxNT .basicScroll .grid-layout.vertical-scrollbar .vertical-scrollbar-line {display:block; position:absolute; width:1px; height:100%; top:0; right:16px; background-color:#dddfe4;}
|
||||
.rightBoxNT .basicScroll .grid-layout.vertical-scrollbar .vertical-scrollbar-line:after {position:absolute; right:-17px; top:0; width:1px; height:100%; background-color:#dddfe4; content:'';}
|
||||
/* grid-layout overflow:hidden 제거시 필요 */
|
||||
.rightBoxNT .basicScroll .grid-layout.vertical-scrollbar .header .container {margin-right:16px;}
|
||||
.rightBoxNT .basicScroll .grid-layout.vertical-scrollbar .horizontal-scrollbar-line {bottom:-1px;}
|
||||
/* 수평 스크롤바를 사용하는 경우 */
|
||||
.rightBoxNT .basicScroll .grid-layout.horizontal-scrollbar .container {overflow:hidden;}
|
||||
.rightBoxNT .basicScroll .grid-layout.horizontal-scrollbar .body .base {overflow-x:scroll;}
|
||||
.rightBoxNT .basicScroll .grid-layout.horizontal-scrollbar .virtual-horizontal-scrollbar {display:block; overflow-y:hidden; overflow-x:scroll; height:17px;}
|
||||
.rightBoxNT .basicScroll .grid-layout.horizontal-scrollbar .virtual-horizontal-scrollbar .width-bar {height:1px;}
|
||||
.rightBoxNT .basicScroll .grid-layout.horizontal-scrollbar .horizontal-scrollbar-line {bottom:16px;}
|
||||
/* 데이터 테이블 관련 */
|
||||
.rightBoxNT .basicScroll .grid-layout table {border:0; table-layout:fixed; border-collapse:collapse; border-spacing:1px; width:100%;}
|
||||
.rightBoxNT .basicScroll .grid-layout table.titleTable {position:relative; right:2px;}
|
||||
.rightBoxNT .basicScroll .grid-layout table col {background-color:#fff;}
|
||||
.rightBoxNT .basicScroll .grid-layout table th {font-weight:normal; font-size:12px; overflow:hidden; white-space:nowrap; text-align:center; position:relative; border:1px solid #dee2e6; border-top:none; border-left:none; height:35px;}
|
||||
.rightBoxNT .basicScroll .grid-layout table th.last {border-bottom:none;}
|
||||
.rightBoxNT .basicScroll .grid-layout table tr.hover {background-color:#fff;}
|
||||
.rightBoxNT .basicScroll .grid-layout table tr.checked {background-color:#fff;}
|
||||
.rightBoxNT .basicScroll .grid-layout table tr.focused {background-color:#fff;}
|
||||
.rightBoxNT .basicScroll .grid-layout table tr.disabled, .rightBoxNT .basicScroll .grid-layout table tr.disabled-row {color:#b0b0b0;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td {overflow:hidden; font-size:12px; border:1px solid #dee2e6; border-top:none; border-left:none; background:#fff; text-align:center; height:35px;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td div.productNameType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td div.productOptionType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td div.couponNameType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td div.contentType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td div.leftAlign {text-align:left;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td div.rightAlign {text-align:right;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td a {color:#5a86dd;}
|
||||
.rightBoxNT .basicScroll .grid-layout table td img {vertical-align:middle; margin:-1px;}
|
||||
/* 체크 박스 관련 스타일 */
|
||||
.rightBoxNT .basicScroll .grid-layout .checkbox label:after, .rightBoxNT .basicScroll .grid-layout .checkbox label:before {height:18px; width:18px; top:6px; left:8px; position:absolute;}
|
||||
.rightBoxNT .basicScroll .grid-layout .checkbox label:after {content:''; border:1px solid #dee2e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.rightBoxNT .basicScroll .grid-layout .checkbox label:before {content:''; border-radius:4px;}
|
||||
.rightBoxNT .basicScroll .grid-layout .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #dee2e6;}
|
||||
.rightBoxNT .basicScroll .grid-layout .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:.6rem; width:1rem; border-color:#50c3ca; border-radius:0; border-width:2px; top:11px; left:12px;}
|
||||
|
||||
.rightBoxNT .basicScroll .cui-grid-textbox {display:inline-block; width:100%; box-sizing:border-box;}
|
||||
/* 데이터 없을 때 */
|
||||
.rightBoxNT .basicScroll .grid-layout .empty-layer {display:none; width:100%; height:100%; position:absolute; top:0; background:#fff; width:calc(100% - 17px);}
|
||||
.rightBoxNT .basicScroll .grid-layout .empty-layer .content {display:table-cell; font-size:14px; height:100%; text-align:center; padding-top:100px; overflow-x:hidden; overscroll-behavior-x:none;}
|
||||
/* 열고정 라인 그라데이션 스타일 */
|
||||
.rightBoxNT .basicScroll .grid-layout .line-gradient:after {position:absolute; top:0; bottom:0; width:6px; height:100%; content:'';}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 왼쪽고정,해더고정 스크롤 */
|
||||
.rightBoxNT .fixedScroll {max-width:800px; overflow:hidden; min-width:100%; margin-bottom:21px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout {margin:0 auto; width:100%; background:#fff; font-size:12px; color:#444; border:solid 1px #dddfe4; border-top:none; position:relative; box-sizing:border-box;}
|
||||
/*툴팁레이어가 grid-layout 위에 있을 경우 overflow:hidden 제거 필요 */
|
||||
/* 스크롤바 스타일 관련 */
|
||||
.rightBoxNT .fixedScroll .grid-layout {scrollbar-highlight-color:#fff; scrollbar-shadow-color:#fff; scrollbar-arrow-color:#8a8a8a; scrollbar-face-color:#d9d9d9; scrollbar-3dlight-color:#fff; scrollbar-darkshadow-color:#fff; scrollbar-track-color:#fff;}
|
||||
.rightBoxNT .fixedScroll .grid-layout ::-webkit-scrollbar {-webkit-appearance:none; width:17px; height:17px; background-color:#fff;}
|
||||
.rightBoxNT .fixedScroll .grid-layout ::-webkit-scrollbar-thumb {background-color:#d9d9d9; border:5px solid transparent; border-radius:16px; background-clip:content-box;}
|
||||
.rightBoxNT .fixedScroll .grid-layout ::-webkit-scrollbar-thumb:hover {background-color:#c1c1c1;}
|
||||
.rightBoxNT .fixedScroll .grid-layout ::-webkit-scrollbar-corner {background-color:#f2f2f2;}
|
||||
/* 헤더 영역 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .header {position:relative; overflow:hidden; border-top:1px solid #dee2e6;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .header .headerBox {overflow:hidden; left:-1px; overflow-y:scroll; height:35px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .header .base {overflow-x:hidden; margin-right:-1px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .header .config-button {display:none;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .header tbody {background-color:#f6f6f6;}
|
||||
.rightBoxNT .fixedScroll .grid-layout #headerBox::-webkit-scrollbar-thumb {background-color:#f6f6f6;}
|
||||
.rightBoxNT .fixedScroll .grid-layout #headerBox::-webkit-scrollbar-track {background-color:#f6f6f6; border-bottom:1px solid #dee2e6;}
|
||||
/* 바디 영역 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .body {position:relative; overflow:hidden; margin-bottom:-1px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .body .height-bar {display:none;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .body .bodyBox {top:-1px; left:-1px; overflow:hidden;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .vertical-scrollbar-line {display:none;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .horizontal-scrollbar-line {display:none; position:absolute; width:100%; height:1px; left:0px; background-color:#dddfe4;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .container {position:relative;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .left {display:none; position:absolute; top:0;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .right {display:none; position:absolute; top:0; right:-1px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .clipboard {position:absolute; left:-999px; width:1px; height:1px; bottom:0;}
|
||||
/* 합계 영역 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .header .footerBox {overflow:hidden; left:-1px; border-top:1px solid #dee2e6; background:#f6f6f6; padding-right:17px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .header .footerBox table th {border-top:none; border-bottom:none;}
|
||||
/* 그리드 전체 비활성화 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .blocker-layer {display:none; position:absolute; background:rgba(0, 0, 0, 0.05); width:100%; height:100%; top:0;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.disabled, .fixedScroll .rightBoxNT .fixedScroll .grid-layout.disabled th, .fixedScroll .grid-layout.disabled .content-holder {color:#e0e0e0 !important;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.disabled .blocker-layer {display:block;}
|
||||
/* 수평 스크롤 가능 영역 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .horizontal-scrollable {overscroll-behavior-x:none;}
|
||||
/* 수직 스크롤바를 사용하지 않는 경우 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .virtual-horizontal-scrollbar {display:none;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .virtual-horizontal-scrollbar .space {display:none;}
|
||||
/* 수직 스크롤바를 사용하는 경우 */
|
||||
.rightBoxNT .fixedScroll .grid-layout.vertical-scrollbar .header .config-button {display:block; position:absolute; border:solid 1px #dddfe4; top:0; right:-1px; width:18px; background-color:#f6f6f6;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.vertical-scrollbar .body {overflow-y:scroll; min-height:255px; max-height:initial; height:601px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.vertical-scrollbar .body .height-bar {display:block; position:absolute; width:1px; top:0; left:0; background:transparent;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.vertical-scrollbar .virtual-horizontal-scrollbar {margin-right:16px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.vertical-scrollbar .vertical-scrollbar-line {display:block; position:absolute; width:1px; height:100%; top:0; right:16px; background-color:#dddfe4;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.vertical-scrollbar .vertical-scrollbar-line:after {position:absolute; right:-17px; top:0; width:1px; height:100%; background-color:#dddfe4; content:'';}
|
||||
/* grid-layout overflow:hidden 제거시 필요 */
|
||||
.rightBoxNT .fixedScroll .grid-layout.vertical-scrollbar .header .container {margin-right:16px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.vertical-scrollbar .horizontal-scrollbar-line {bottom:-1px;}
|
||||
/* 수평 스크롤바를 사용하는 경우 */
|
||||
.rightBoxNT .fixedScroll .grid-layout.horizontal-scrollbar .container {overflow:hidden;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.horizontal-scrollbar .virtual-horizontal-scrollbar {display:block; overflow-y:hidden; overflow-x:scroll; height:17px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.horizontal-scrollbar .virtual-horizontal-scrollbar .width-bar {height:1px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout.horizontal-scrollbar .horizontal-scrollbar-line {bottom:16px;}
|
||||
/* 데이터 테이블 관련 */
|
||||
.rightBoxNT .fixedScroll .grid-layout table {border:0; table-layout:fixed; border-collapse:collapse; border-spacing:1px; width:100%; height:35px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table.titleTable {position:relative; right:0;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table col {background-color:#fff;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table th {font-weight:normal; font-size:12px; overflow:hidden; white-space:nowrap; text-align:center; position:relative; border:1px solid #dee2e6; border-left:none; border-top:none;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table tr {height:30px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table tr.hover {background-color:#fff;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table tr.checked {background-color:#fff;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table tr.focused {background-color:#fff;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table tr.disabled, .fixedScroll .grid-layout table tr.disabled-row {color:#b0b0b0;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td {overflow:hidden; font-size:12px; border:1px solid #dee2e6; border-top:none; border-left:none; background:#fff; line-height:17px; text-align:center; height:35px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td div.productNameType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td div.productOptionType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td div.couponNameType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td div.contentType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td div.leftAlign {text-align:left;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td div.rightAlign {text-align:right;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td.focused {border:solid 1px #5a86dd; padding:7px 11px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td a {color:#5a86dd;}
|
||||
.rightBoxNT .fixedScroll .grid-layout table td img {vertical-align:middle; margin:-1px;}
|
||||
/* 체크 박스 관련 스타일 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .checkbox label:after, .rightBoxNT .fixedScroll .grid-layout .checkbox label:before {height:18px; width:18px; top:5px; left:5px; position:absolute;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .checkbox label:after {content:''; border:1px solid #dee2e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .checkbox label:before {content:''; border-radius:4px;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #dee2e6;}
|
||||
.rightBoxNT .fixedScroll .grid-layout .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:.6rem; width:1rem; border-color:#178754; border-radius:0; border-width:2px; top:10px; left:9px;}
|
||||
|
||||
.rightBoxNT .fixedScroll .cui-grid-textbox {display:inline-block; width:100%; box-sizing:border-box;}
|
||||
/* 데이터 없을 때 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .empty-layer {display:none; width:100%; height:100%; position:absolute; top:0; background:#fff; width:calc(100% - 17px);}
|
||||
.rightBoxNT .fixedScroll .grid-layout .empty-layer .content {display:table-cell; font-size:14px; height:100%; text-align:center; padding-top:100px; overflow-x:hidden; overscroll-behavior-x:none;}
|
||||
/* 열고정 라인 그라데이션 스타일 */
|
||||
.rightBoxNT .fixedScroll .grid-layout .line-gradient:after {position:absolute; top:0; bottom:0; width:6px; height:100%; content:'';}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 리스트 검색결과가 없습니다.*/
|
||||
.rightBoxNT .form-horizontal table .searchEmpty>td{cursor: default;}
|
||||
.rightBoxNT .form-horizontal table .searchEmpty>td .noData {height:200px; vertical-align:middle; display:block; text-align:center; padding:70px 0;}
|
||||
.rightBoxNT .form-horizontal table .searchEmpty>td .noData .noDataTitle {margin:0; font-size:18px; color:#777;}
|
||||
.rightBoxNT .form-horizontal table .searchEmpty>td .noData .noDataText {margin:0; line-height:14px; color:#999;}
|
||||
.rightBoxNT .form-horizontal table .searchEmpty>td .noData .noDataText span {color:#50c3ca;}
|
||||
|
||||
|
||||
|
||||
|
||||
/* 스크롤없는 일반표 */
|
||||
.rightBoxNT .basicTable {overflow:hidden; min-width:100%; margin-bottom:10px;}
|
||||
.rightBoxNT .basicTable table {border:0; table-layout:fixed; border-collapse:collapse; border-spacing:1px; border:1px solid #dee2e6; width:100%;}
|
||||
.rightBoxNT .basicTable table th {background-color:#f6f6f6; font-weight:normal; font-size:12px; overflow:hidden; white-space:nowrap; text-align:center; position:relative; border:1px solid #dee2e6; border-top:none; border-left:none; height:35px;}
|
||||
.rightBoxNT .basicTable table td {overflow:hidden; font-size:12px; border-top:none; border-left:none; background:#fff; border:1px solid #dee2e6; text-align:center; height:35px;}
|
||||
|
||||
|
||||
|
||||
|
||||
/* 탭 */
|
||||
.rightBoxNT .border {width:40px; height:3px; background:#00723e;}
|
||||
.rightBoxNT .listConbox {margin-bottom:1px;}
|
||||
.rightBoxNT .listConbox .tabList {list-style:none; padding:0; margin:1px; margin-bottom:-1px; width:100%; background:#fff;}
|
||||
.rightBoxNT .listConbox .tabList li {position:relative; display:table-cell; width:calc(100% / 12); border-left:0; text-align:center;}
|
||||
.rightBoxNT .listConbox .tabList .planActionLi{width:200px;}
|
||||
.rightBoxNT .listConbox .tabList li:after {content:''; position:absolute; top:0; bottom:0; left:-1px; right:0; border:1px solid #dedede;}
|
||||
.rightBoxNT .listConbox .tabList li a {position:relative; display:block; font-size:13px; line-height:38px; height:38px; z-index:1; margin:0; padding:0; border:0; background:#f5f7f7; border:1px solid #dee2e6; border-left:none; border-radius:0;}
|
||||
.rightBoxNT .listConbox .tabList li a:link {color:rgba(49, 58, 70, .8);}
|
||||
.rightBoxNT .listConbox .tabList li a:hover {background:#f5f7f7; color:rgba(49, 58, 70, .8);}
|
||||
.rightBoxNT .listConbox .tabList li.active a:after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border:0; z-index:2;}
|
||||
.rightBoxNT .listConbox .tabList li.active a:hover{background:none;}
|
||||
.rightBoxNT .listConbox .nav-tabs>li.active>a, .rightBoxNT .listConbox .nav-tabs>li.active>a:focus, .rightBoxNT .listConbox .nav-tabs>li.active>a:hover {color:#fff; background:#377ec1; border-radius:0; border:none;} /*선택시 배경 여기에 넣을것 */
|
||||
.rightBoxNT .formSubstance .tab-pane {display:none;}
|
||||
.rightBoxNT .formSubstance .tab-pane.active {display:block;} /*bradley 수정*/
|
||||
/* 탭내용*/
|
||||
.rightBoxNT .form-horizontal .conBox {border:1px solid #dee2e6; padding:10px;}
|
||||
.rightBoxNT .form-horizontal .conBox .title {color:#324767; text-decoration:none; padding:0px 10px; text-align:left; line-height:34px; margin:0; font-size:16px; font-weight:700;}
|
||||
.rightBoxNT .form-horizontal .conBox .title span {color:#97989b; font-size:13px; margin-left:10px;}
|
||||
.rightBoxNT .form-horizontal .conBox .marginBox {margin:30px;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 페이지게이션 */
|
||||
.pagination{margin:0;}
|
||||
.pagination>li {width:30px; height:30px; display:inline-block;}
|
||||
|
||||
.pagination>li>a {height:100%; width:100%; padding:0;}
|
||||
.pagination>li>a svg {width:14px; height:14px; position:absolute; top:50%; left:50%; transform:translate3d(-50%, -50%, 0);}
|
||||
.pagination>li>a.page-link {padding:5px 0;}
|
||||
.pagination>li>a.next {border-right:1px solid #ddd;}
|
||||
.pagination>li>a, .pagination>li>span {line-height:1.5; padding:5px 12px; border-right:none;}
|
||||
.pagination>li:last-child>a, .pagination>li:last-child>span {border-right:solid 1px #e6e6e6;}
|
||||
|
||||
|
||||
.pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover{border-color:#e6e6e6; /* color:#919191; */ width:30px; height:30px;}
|
||||
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {background-color:#377ec1; border-color:#377ec1; color:#fff; width:30px; height:30px; line-height:20px;}
|
||||
.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus {background:#377ec1; color:#fff; border:solid 1px #377ec1;}
|
||||
.pagination>li>a, .pagination>li>span {color:#333;}
|
||||
.pagination>.disabled>span svg {width:14px; height:14px; position:absolute; top:50%; left:50%; transform:translate3d(-50%, -50%, 0);}
|
||||
.pagination>.disabled>span.next {border-right:1px solid #ddd;}
|
||||
|
||||
|
||||
|
||||
/* 상세입력 */
|
||||
.rightBoxNT .detailsBox {margin-top:0; border-bottom:none; margin-bottom:20px; display:inline-block; width:100%;}
|
||||
.rightBoxNT .detailsBox .detailsTitle {color:rgba(49, 58, 70, .8); text-decoration:none; padding:0px 10px; text-align:left; line-height:34px; margin:0; font-size:16px; font-weight:700; display:block;}
|
||||
.rightBoxNT .detailsBox .left {padding:0;}
|
||||
.rightBoxNT .detailsBox .right {padding:0;}
|
||||
.rightBoxNT .detailsBox .group1 {padding-bottom:0;}
|
||||
.rightBoxNT .detailsBox .detailsPanel {}
|
||||
.rightBoxNT .detailsBox .detailsPanel .sideText {line-height:30px; color:#97989b; position:relative; left:5px; bottom:-5px;}
|
||||
|
||||
/* 상세입력+,-버튼 */
|
||||
.rightBoxNT .form-horizontal .tableBtn {}
|
||||
.rightBoxNT .form-horizontal .tableBtn .btn-Plus {height:30px; background:#50c3ca; padding:0; width:30px; border-radius:.267rem;}
|
||||
.rightBoxNT .form-horizontal .tableBtn .btn-Plus:hover {background:#63b3a6;}
|
||||
.rightBoxNT .form-horizontal .tableBtn .btn-Plus svg {color:#fff; width:25px; height:25px; position:relative; top:2px;}
|
||||
.rightBoxNT .form-horizontal .tableBtn .btn-Minus {height:30px; background:#fc5083; padding:0; width:30px; border-radius:.267rem;}
|
||||
.rightBoxNT .form-horizontal .tableBtn .btn-Minus:hover {background:#eb4375;}
|
||||
.rightBoxNT .form-horizontal .tableBtn .btn-Minus svg {color:#fff; width:25px; height:25px; position:relative; top:2px;}
|
||||
|
||||
.rightBoxNT .form-horizontal .tableBtn1 {width:40px; background:#fff; border:1px solid #dee2e6;}
|
||||
.rightBoxNT .form-horizontal .tableBtn1 .btn-Minus {height:34px; background:#fc5083; padding:0; width:35px; border-radius:.267rem;}
|
||||
.rightBoxNT .form-horizontal .tableBtn1 .btn-Minus:hover {background:#eb4375;}
|
||||
.rightBoxNT .form-horizontal .tableBtn1 .btn-Minus svg {color:#fff; width:25px; height:25px; position:relative; top:3px;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 질문관리_질문답변내용 */
|
||||
.rightBoxNT .form-horizontal .mainTitle {font-size:15px; line-height:40px; font-weight:700; padding:0 15px; border-bottom:1px solid #dee2e6;}
|
||||
.rightBoxNT .form-horizontal .openList {margin:0; padding:0; list-style:none; margin-bottom:30px;}
|
||||
.rightBoxNT .form-horizontal .openList li {padding:5px 0; border-bottom:1px solid #dee2e6;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox {background:#f7f7f7; height:40px; padding:0 15px; border:1px solid #dee2e6;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .user {font-size:13px; line-height:40px; font-weight:700;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .site {margin:0 2px 0 3px; padding:1px 6px; border-radius:1px; font-size:12px; color:#fff; background:#4684e9; font-style:normal; position:relative; top:0;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .site.type {background: #fc5083;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox {float:right;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox .time{margin:0; font-size:13px; line-height:40px; color:#999;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox .openBtn {width:60px; margin:0 7px; text-shadow:none; border:none; padding:0; border-radius:.267rem; box-shadow:none; line-height:25px; font-size:13px; position:relative; top:-2px;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox .open-revise {background:#50c3ca; color:#fff; margin-right:0;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox .open-revise:hover {background:#63b3a6;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox .open-delete {background:#fc5083; color:#fff; margin-right:0;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox .open-delete:hover {background:#eb4375;}
|
||||
/*질문내용*/
|
||||
.rightBoxNT .form-horizontal .openList li .questionTitle{background:rgb(112 192 179 / 20%); height:40px; padding:0 15px; border:1px solid #dee2e6;}
|
||||
.rightBoxNT .form-horizontal .openList li .answerBox .questionMainTitle {font-size:15px; font-weight:700; border-bottom:1px solid #dee2e6; padding-bottom:10px;}
|
||||
.rightBoxNT .form-horizontal .openList li .answerBox .questionAnswer {color:#888; letter-spacing:-.03em; padding:10px 0;}
|
||||
.rightBoxNT .form-horizontal .openList li .numberBox {border-top:1px solid #dee2e6; padding-top:10px;}
|
||||
/*질문답변*/
|
||||
.rightBoxNT .form-horizontal .openList li .answerBox {clear:both; position:relative; top:-2px; padding:10px 15px; border:1px solid #dee2e6; background-color:#fff;}
|
||||
.rightBoxNT .form-horizontal .openList li .answerBox .answer {color:#888; letter-spacing:-.03em;}
|
||||
.rightBoxNT .form-horizontal .openList li .answerBox .answer.memoTitle {font-weight:700;}
|
||||
.rightBoxNT .form-horizontal .openList li .answerBox .detail {margin-bottom:15px;display:inline-block;font-size:12px;color:#999;}
|
||||
|
||||
|
||||
|
||||
/* 권한 체크리스트 박스 */
|
||||
.rightBoxNT .checkListchoiceBox {border:1px solid #dee2e6; display:block; width:100%; padding:0.47rem 0.8rem; border-radius:0.267rem; width:calc(100% - 10px); display:table;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp {width:calc(100%/5); float:left;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .title {line-height:30px; color:#333; font-weight:500; background:#f7f7f7; border:1px solid #dee2e6; border-left:none; text-align:center;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .title.first {border-left:1px solid #dee2e6;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox {border-top:none; border-right:none; /*padding:10px 10px 10px 30px;*/ min-height:150px; padding:10px;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox {position:relative; display:block;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox input[type=checkbox] {display:none;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox input[type=checkbox] {box-sizing:border-box; padding:0;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox {min-height:26px; padding:0 18px;}
|
||||
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox label {font-size:13px; line-height:26px; margin-left:7px; padding:0;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox label:after, .rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox label:before {height:18px; width:18px; top:4px; left:0; position:absolute;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox label:after {content:''; border:1px solid #dee2e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox label:before {content:''; border-radius:4px;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #dee2e6;}
|
||||
.rightBoxNT .checkListchoiceBox .checkListWarp .checkListBox .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:5px; width:9px; border-color:#6A99F8; border-radius:0; border-width:2px; top:10px; left:5px;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 캘린더 */
|
||||
.rightBoxNT .form-horizontal .calendarBox{padding:5px 0;}
|
||||
/* 토요일 글자(요일,날짜) 색상 */
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-day-sat.fc-day-past div>a {color:#50c3ca;}
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-day.fc-day-sat div>a {color:#50c3ca;}
|
||||
/* 일요일 글자(요일,날짜) 색상 */
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-day-sun.fc-day-past div>a {color:#fc5083;}
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-day.fc-day-sun div>a {color:#fc5083;}
|
||||
/* 평일 글자(요일,날짜) 색상 */
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-daygrid-day-number {color:#333;}
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-day div>a{color:#333;}
|
||||
/* 캘린더 안 등록 버튼 */
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-insertButton-button{background-color:#63b3a6; color:#fff; border:0; line-height:23px;}
|
||||
/* 캘린더 안 다음달 버튼 */
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-next-button{margin:0;}
|
||||
/* 캘린더 안 제목(년월) */
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-toolbar-title{display:inline-block; vertical-align:middle; margin:0 30px;}
|
||||
/* 캘린더 안 이벤트 백그라운드 기본값 */
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-h-event{background:none;border:0;}
|
||||
/* 일정 커서 */
|
||||
.rightBoxNT .form-horizontal .calendarBox .fc-event-main-frame{cursor: pointer;}
|
||||
|
||||
|
||||
/* */
|
||||
.ag-header-cell-label {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-ltr .ag-cell{
|
||||
text-align: center;font-size: 12px;padding:0;line-height: 30px;
|
||||
}
|
||||
.ag-theme-balham .ag-ltr .ag-cell{
|
||||
text-align: center;font-size: 12px;padding:0;line-height: 30px;
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-header-cell{
|
||||
padding: 4px 18px;
|
||||
}
|
||||
|
||||
.ag-selection-checkbox{
|
||||
padding: 7px 17px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*반응형 View*/
|
||||
@media only screen and (max-width: 1577px) {
|
||||
.rightBoxNT .form-horizontal .pageDateInput{width:42%;}
|
||||
}
|
||||
@media only screen and (max-width: 1376px) {
|
||||
.left-menu {left:-200px;}
|
||||
.rightBoxNT {left:0; width:calc(1376px - 20px);}
|
||||
|
||||
/* 모바일 햄버거 메뉴 관련 joy추가 */
|
||||
html.open {overflow:hidden;}
|
||||
#leftMenu.open {left:0px;}
|
||||
.page_cover.open {display:block;}
|
||||
.page_cover {width:100%; height:100%; position:fixed; top:0px; left:0px; background-color:rgba(0,0,0,0.4); z-index:4; display:none; margin-top:50px;}
|
||||
|
||||
.tapNav {width:calc(1376px - 20px); left:0;}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width:1200px) {
|
||||
|
||||
.rightBoxNT {left:0; width:calc(1200px - 20px);}
|
||||
.tapNav {width:calc(1200px - 20px);}
|
||||
}
|
||||
|
||||
@media only screen and (max-width:1024px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:768px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:596px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:414px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:375px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:360px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
}
|
||||
91
src/main/resources/static/css/admin/common_styles.css
Normal file
91
src/main/resources/static/css/admin/common_styles.css
Normal file
@@ -0,0 +1,91 @@
|
||||
/* common.css 수정금지 */
|
||||
/* 새로 css 추가시 어느 페이지에 어디위치인지 표시할것 */
|
||||
/* 기존 css 수정시 여기다가 수정할것 */
|
||||
|
||||
|
||||
/* bradley 추가 시작 */
|
||||
.rightBoxNT {top:90px; min-height:calc(100vh - 90px);}
|
||||
.tapNav .tabWrap .tabList .tabContainer {height:40px;}
|
||||
/* 등록,수정페이지_인풋 width 125 */
|
||||
.rightBoxNT .form-horizontal .pageWrapInput.width125 {width:125px;}
|
||||
|
||||
/* 상세페이지 파일 다운로드 링크 display:none; 추가 */
|
||||
.rightBoxNT .download-file {display:none;}
|
||||
|
||||
/* 질문 상세 수정 삭제 버튼 위치 수정 후 margin 변경 */
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox .open-revise {margin: 0 7px 0 0;}
|
||||
.rightBoxNT .form-horizontal .openList li .titleBox .timeBox .open-delete {margin: 0 7px 0 0;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*상세검색*/
|
||||
.rightBoxNT .form-horizontal .btnWhite.open svg {transform:rotate(180deg);}
|
||||
|
||||
/*접속로그 기준일*/
|
||||
.rightBoxNT .listNav .numberBox .number.n-colorRed {color:red;font-size:12px;}
|
||||
.rightBoxNT .listNav .numberBox .number.n-colorRed span {color:red;}
|
||||
|
||||
|
||||
.page_cover {width:100%; height:100%; position:fixed; top:0; left:0; background-color:rgba(0,0,0,0.4); z-index:4; display:none;}
|
||||
.page_cover.open {display:block;}
|
||||
|
||||
/*첨부파일 확장자*/
|
||||
.rightBoxNT .input-file .fileExt {color:red; padding-left:10px;}
|
||||
|
||||
.rightBoxNT .form-horizontal .form-group .width50, .rightBoxNT .form-horizontal .form-group50 .width50 {width:42%; padding:5px;}
|
||||
.rightBoxNT .form-horizontal .form-group .width100, .rightBoxNT .form-horizontal .form-group50 .width100 {width:100%; padding:5px;}
|
||||
.rightBoxNT .detailsBox {display:table;}
|
||||
|
||||
/* 탭 상단 사용자 접속 정보 */
|
||||
.leftBtnWrap {float: left; padding:10px 0; margin:0 10px 0 0; list-style:none;}
|
||||
.leftBtnWrap li .tapUser {float: left; margin:0; margin-left:6px; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; display:block;}
|
||||
.leftBtnWrap li .tapUser p {text-shadow:none; line-height:30px; text-align:center; color:#fff;}
|
||||
.leftBtnWrap li .tapUser .tapUserName {float: right; font-size:13px; }
|
||||
.leftBtnWrap li .tapUser .tapSessionTime {width: 50px; float: left; font-size:15px; font-weight: 800;}
|
||||
.leftBtnWrap .btnSession {width:60px; margin:0 10px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; line-height:30px; font-size:13px;}
|
||||
/* 메인컬러_버튼 */
|
||||
.leftBtnWrap .btnMain {background:#377ec1; color:#fff;}
|
||||
|
||||
/* 검색버튼 */
|
||||
.rightBoxNT .form-horizontal .search_box {float:left; padding:5px 0 5px 5px;}
|
||||
.rightBoxNT .form-horizontal .search_box .search_btn {border-color:#e6e6e6; color:#333; height:30px; padding:0 10px; font-size:13px; font-weight:400; line-height:1.42857143; border-radius:4px; background:#377ec1; border:none;}
|
||||
.rightBoxNT .form-horizontal .search_box .search_btn:hover, .rightBoxNT .search_box .search_btn:focus {background:#7caad7;}
|
||||
.rightBoxNT .form-horizontal .search_box .search_btn img {position:relative; top:-1px;}
|
||||
.rightBoxNT .form-horizontal .search_box .search_delete_btn {border-color:#e6e6e6; color:#333; height:30px; padding:0 10px; font-size:13px; font-weight:400; line-height:1.42857143; border-radius:4px; background:#fc5083; border:none;display: none;}
|
||||
.rightBoxNT .form-horizontal .search_box .search_delete_btn:hover, .rightBoxNT .search_box .search_btn:focus {background:#fc5083;}
|
||||
.rightBoxNT .form-horizontal .search_box .search_delete_btn img {position:relative; top:-1px;}
|
||||
|
||||
/* 그래프 스타일 추가 */
|
||||
.rightBoxNT .basicScroll table td.graphBar {padding:0 5px;}
|
||||
.rightBoxNT .basicScroll table td.graphBar div {height:15px; background-color:#377ec1; opacity:0.4; position:relative; cursor:pointer;}
|
||||
/* bradley 추가 종료 */
|
||||
|
||||
/* emily 추가 시작 */
|
||||
/* 일괄등록 가이드박스 */
|
||||
.rightBoxNT .form-list .guideBox {padding:10px 15px; margin-bottom:15px; border:1px solid #e6e6e6;}
|
||||
.rightBoxNT .form-list .guideBox p {font-size:15px; font-weight:700;}
|
||||
.rightBoxNT .form-list .guideBox ul {padding:0; margin:0; list-style:none;}
|
||||
.rightBoxNT .form-list .guideBox ul li {list-style:inside;}
|
||||
.rightBoxNT .form-list .guideBox .txtBold {font-weight: 800;}
|
||||
.rightBoxNT .form-list .number {line-height:30px; margin:0; display:inline-block;}
|
||||
|
||||
|
||||
.rightBoxNT .listNav .numberBox .number .r-color {color:red; padding-left:3px;}
|
||||
|
||||
/* 로고 등록 이미지 박스 사이즈 조절*/
|
||||
.rightBoxNT .form-horizontal .imgBox2 {width:300px; height:60px; padding:0; float:left; margin-right:10px;}
|
||||
.rightBoxNT .form-horizontal .img-300 {border:1px solid #dee2e6; width:300px; height:60px; background:none; color:#3e3f3a;}
|
||||
.rightBoxNT .form-horizontal .img-300:hover{background:none;border:1px solid #dee2e6;box-shadow:none;}
|
||||
|
||||
/* 수정 권한 없을 때 summernote대신 */
|
||||
.rightBoxNT .form-horizontal .textarea_content {height: 200px; overflow-y: auto; background:rgba(238, 242, 247, .6);}
|
||||
|
||||
/* 빨간색 버튼 */
|
||||
.rightBoxNT .btnRed {background:#c50049; color:#fff;}
|
||||
.rightBoxNT .btnRed:hover {background:#bb0045;}
|
||||
|
||||
/* 등록,수정페이지 글자수 카운트 */
|
||||
.rightBoxNT .form-horizontal .sideText {line-height:30px; color:#97989b; position:relative; left:5px; bottom:-5px;}
|
||||
/* emily 추가 종료 */
|
||||
@@ -0,0 +1,101 @@
|
||||
/************* 기본영역 정의 *************/
|
||||
|
||||
* { margin: 0; font-family: "궁서체"; box-sizing: border-box; color:#333; }
|
||||
|
||||
/************* page *************/
|
||||
.page { width:250mm; height:353mm; padding:120px 120px; /*background:url('../../image/admin/print/bg2.png')no-repeat 50% 50%;*/ background-size:100%; }
|
||||
.page .content_wrap { width:685px; height:100%; text-align:center; position:relative; }
|
||||
.page .content_wrap p.top { font-size:30px; letter-spacing:-1px; position:absolute; top:70px; left:70px; }
|
||||
.page .content_wrap .top_box { padding-top:150px; }
|
||||
.page .content_wrap .top_box h1 { font-size:60px; text-align:center; letter-spacing:35px; }
|
||||
.page .content_wrap .top_box .info_box { margin-top:30px; padding:0 100px; text-align:left; position:relative; }
|
||||
.page .content_wrap .top_box .info_box ul { padding:0; margin-top:10px; display:inline-block; }
|
||||
.page .content_wrap .top_box .info_box ul li { margin-top:20px; display:flex; }
|
||||
.page .content_wrap .top_box .info_box ul li label { font-size:30px; letter-spacing:10px; }
|
||||
.page .content_wrap .top_box .info_box ul li p { font-size:30px; letter-spacing:10px; }
|
||||
.page .content_wrap .top_box .info_box .img_box { width:105px; height:135px; position:absolute; top:0; right:100px; }
|
||||
.page .content_wrap .top_box .info_box .img_box img { width:100%; }
|
||||
.page .content_wrap p.article { margin-top:100px; font-size:33px; letter-spacing:1px; line-height:55px; text-align:left; display:inline-block; }
|
||||
.page .content_wrap p.date { margin-top:70px; font-size:33px; letter-spacing:1px; }
|
||||
.page .content_wrap .btm_box { margin-top:110px; }
|
||||
.page .content_wrap .btm_box p { margin-left:170px; font-size:21px; display:inline-block; }
|
||||
.page .content_wrap .btm_box p span { letter-spacing:10px; }
|
||||
.page .content_wrap .btm_box p span.narrow { letter-spacing:-5px; }
|
||||
.page .content_wrap .btm_box p span.siz { font-size:35px; }
|
||||
.page .content_wrap .btm_box img { width:400px; margin-left:175px; }
|
||||
|
||||
@media print {
|
||||
@page {
|
||||
size:250mm 353mm;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
* {
|
||||
-webkit-print-color-adjust: exact !important;
|
||||
color-adjust: exact !important;
|
||||
print-color-adjust: exact !important;
|
||||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Black'), url(../../font/admin/Pretendard-Black.woff2) format('woff2'), url(../../font/admin/Pretendard-Black.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 800;
|
||||
font-display: swap;
|
||||
src: local('Pretendard ExtraBold'), url(../../font/admin/Pretendard-ExtraBold.woff2) format('woff2'), url(../../font/admin/Pretendard-ExtraBold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Bold'), url(../../font/admin/Pretendard-Bold.woff2) format('woff2'), url(../../font/admin/Pretendard-Bold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 600;
|
||||
font-display: swap;
|
||||
src: local('Pretendard SemiBold'), url(../../font/admin/Pretendard-SemiBold.woff2) format('woff2'), url(../../font/admin/Pretendard-SemiBold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Medium'), url(../../font/admin/Pretendard-Medium.woff2) format('woff2'), url(../../font/admin/Pretendard-Medium.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Regular'), url(../../font/admin/Pretendard-Regular.woff2) format('woff2'), url(../../font/admin/Pretendard-Regular.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Light'), url(../../font/admin/Pretendard-Light.woff2) format('woff2'), url(../../font/admin/Pretendard-Light.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 200;
|
||||
font-display: swap;
|
||||
src: local('Pretendard ExtraLight'), url(../../font/admin/Pretendard-ExtraLight.woff2) format('woff2'), url(../../font/admin/Pretendard-ExtraLight.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Thin'), url(../../font/admin/Pretendard-Thin.woff2) format('woff2'), url(../../font/admin/Pretendard-Thin.woff) format('woff');
|
||||
}
|
||||
104
src/main/resources/static/css/admin/curriculumCompletePrint.css
Normal file
104
src/main/resources/static/css/admin/curriculumCompletePrint.css
Normal file
@@ -0,0 +1,104 @@
|
||||
/************* 기본영역 정의 *************/
|
||||
|
||||
* { margin: 0; font-family: "궁서체"; box-sizing: border-box; color:#333; }
|
||||
|
||||
/************* page *************/
|
||||
.page { width:210mm; height:297mm; padding: 1.5cm 1.5cm 2cm 1.5cm;}
|
||||
.page .content_wrap { width:685px; height:100%; text-align:center; position:relative; }
|
||||
.page .content_wrap p.top { font-size:30px; letter-spacing:-1px; position:absolute; top:70px; left:70px; }
|
||||
.page .content_wrap .top_box { padding-top:150px; }
|
||||
.page .content_wrap .top_box h1 { font-size:60px; text-align:center; letter-spacing:35px; }
|
||||
.page .content_wrap .top_box .info_box { margin-top:30px; padding:0 100px; text-align:left; position:relative; }
|
||||
.page .content_wrap .top_box .info_box ul { padding:0; margin-top:10px; display:inline-block; }
|
||||
.page .content_wrap .top_box .info_box ul li { margin-top:20px; display:flex; }
|
||||
.page .content_wrap .top_box .info_box ul li label { font-size:30px; letter-spacing:10px; }
|
||||
.page .content_wrap .top_box .info_box ul li p { font-size:30px; letter-spacing:10px; }
|
||||
.page .content_wrap .top_box .info_box .img_box { width:105px; height:135px; position:absolute; top:0; right:100px; }
|
||||
.page .content_wrap .top_box .info_box .img_box img { width:100%; }
|
||||
.page .content_wrap p.article { margin-top:100px; font-size:33px; letter-spacing:1px; line-height:70px; text-align:left; display:inline-block; }
|
||||
.page .content_wrap p.date { margin-top:135px; font-size:33px; letter-spacing:1px; }
|
||||
.page .content_wrap .btm_box { margin-top:60px; }
|
||||
.page .content_wrap .btm_box p { margin-left:170px; font-size:21px; display:inline-block; }
|
||||
.page .content_wrap .btm_box p span { letter-spacing:10px; }
|
||||
.page .content_wrap .btm_box p span.narrow { letter-spacing:-5px; }
|
||||
.page .content_wrap .btm_box p span.siz { font-size:35px; }
|
||||
.page .content_wrap .btm_box img { width:400px; margin-left:175px; }
|
||||
|
||||
@page {
|
||||
size: A4;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
@media print {
|
||||
* {
|
||||
-webkit-print-color-adjust: exact !important;
|
||||
color-adjust: exact !important;
|
||||
print-color-adjust: exact !important;
|
||||
}
|
||||
|
||||
html, body { width:210mm; height:297mm; }
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Black'), url(../../font/admin/Pretendard-Black.woff2) format('woff2'), url(../../font/admin/Pretendard-Black.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 800;
|
||||
font-display: swap;
|
||||
src: local('Pretendard ExtraBold'), url(../../font/admin/Pretendard-ExtraBold.woff2) format('woff2'), url(../../font/admin/Pretendard-ExtraBold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Bold'), url(../../font/admin/Pretendard-Bold.woff2) format('woff2'), url(../../font/admin/Pretendard-Bold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 600;
|
||||
font-display: swap;
|
||||
src: local('Pretendard SemiBold'), url(../../font/admin/Pretendard-SemiBold.woff2) format('woff2'), url(../../font/admin/Pretendard-SemiBold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Medium'), url(../../font/admin/Pretendard-Medium.woff2) format('woff2'), url(../../font/admin/Pretendard-Medium.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Regular'), url(../../font/admin/Pretendard-Regular.woff2) format('woff2'), url(../../font/admin/Pretendard-Regular.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Light'), url(../../font/admin/Pretendard-Light.woff2) format('woff2'), url(../../font/admin/Pretendard-Light.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 200;
|
||||
font-display: swap;
|
||||
src: local('Pretendard ExtraLight'), url(../../font/admin/Pretendard-ExtraLight.woff2) format('woff2'), url(../../font/admin/Pretendard-ExtraLight.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Thin'), url(../../font/admin/Pretendard-Thin.woff2) format('woff2'), url(../../font/admin/Pretendard-Thin.woff) format('woff');
|
||||
}
|
||||
33
src/main/resources/static/css/admin/dashboard.css
Normal file
33
src/main/resources/static/css/admin/dashboard.css
Normal file
@@ -0,0 +1,33 @@
|
||||
|
||||
/* dashboard */
|
||||
.rightBoxNT {background:#e6efeb; min-height:calc(100vh - 50px); padding:10px;}
|
||||
.rightBoxNT .content_box {display:table; width:100%; padding:20px;}
|
||||
.rightBoxNT .content_box .content_top {list-style:none; padding:0; margin:0; margin-bottom:30px; display:table; width:100%;}
|
||||
.rightBoxNT .content_box .content_top li {float:left; width:calc((100% / 3) - 20px); border:solid 1px #e6e6e6; border-radius:4px; background:#fff;}
|
||||
.rightBoxNT .content_box .content_top li:nth-child(2) {margin:0 30px;}
|
||||
.rightBoxNT .content_box .content_top li .title {font-size:13px; font-weight:700; padding:0 20px; line-height:50px; border-bottom:solid 1px #e6e6e6; margin:0; color:#000; position:relative;}
|
||||
.rightBoxNT .content_box .content_top li .text_box {padding:0 20px; position:relative; height:100px;}
|
||||
.rightBoxNT .content_box .content_top li .text_box .user {font-size:28px; font-weight:700; margin:0; line-height: 150px;}
|
||||
.rightBoxNT .content_box .content_top li .text_box .money_box {position:absolute; top:50%; transform:translateY(-50%); width:calc(100% - 40px);}
|
||||
.rightBoxNT .content_box .content_top li .text_box .money_box .temp {float:left; width:calc(100% / 3); text-align:center;}
|
||||
.rightBoxNT .content_box .content_top li .text_box .money_box .money_title {font-size:15px; font-weight:700; margin:0; line-height:25px;}
|
||||
.rightBoxNT .content_box .content_top li .text_box .money_box .money_content {font-size:15px; font-weight:700; margin:0; line-height:25px; color:#377ec1;}
|
||||
.rightBoxNT .content_box .content_top li .text_box .money_box .money_content span {color:#377ec1;}
|
||||
|
||||
.rightBoxNT .content_box .content_top li .title svg {width:25px; height:25px; position:absolute; top:50%; right:25px; transform:translateY(-50%); color:#377ec1;}
|
||||
|
||||
|
||||
|
||||
.rightBoxNT .content_box .content_bottom {list-style:none; padding:0; margin:0; margin-bottom:30px; display:table; width:100%;}
|
||||
.rightBoxNT .content_box .content_bottom li {float:left; width:calc((100% / 3) - 20px); border:solid 1px #e6e6e6; border-radius:4px; background:#fff;}
|
||||
.rightBoxNT .content_box .content_bottom li:nth-child(2) {margin:0 30px;}
|
||||
.rightBoxNT .content_box .content_bottom li .notice_warp {}
|
||||
.rightBoxNT .content_box .content_bottom li .notice_warp .title {font-size:13px; font-weight:700; padding:0 20px; line-height:50px; border-bottom:solid 1px #e6e6e6; margin:0; color:#000;}
|
||||
.rightBoxNT .content_box .content_bottom li .notice_warp .title a {float:right; font-size:13px; color:#377ec1;}
|
||||
.rightBoxNT .content_box .content_bottom li .notice_warp .title a:hover {color:#27885f;}
|
||||
.rightBoxNT .content_box .content_bottom li .notice_warp .list_box {padding:0 10px;}
|
||||
|
||||
|
||||
.rightBoxNT .content_box .content_bottom li .notice_warp .list_box .list {display:table; width:100%; padding:0; margin:0; list-style:none; min-height:394px;}
|
||||
.rightBoxNT .content_box .content_bottom li .notice_warp .list_box .list li {width:100%; float:unset; border:none; border-top:solid 1px #e6e6e6; border-radius:0; background:unset; margin:0; padding:10px; font-size:13px; cursor:pointer;}
|
||||
.rightBoxNT .content_box .content_bottom li .notice_warp .list_box .list li:first-child {border-top:none;}
|
||||
83
src/main/resources/static/css/admin/error.css
Normal file
83
src/main/resources/static/css/admin/error.css
Normal file
@@ -0,0 +1,83 @@
|
||||
/*반응형 View*/
|
||||
@media (min-width: 768px){
|
||||
.carousel-caption {width:70%;}
|
||||
}
|
||||
|
||||
@media (min-width: 992px){
|
||||
.carousel-caption {width:70%;}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px){
|
||||
.carousel-caption {width:60%;}
|
||||
}
|
||||
|
||||
/*홈네비*/
|
||||
#header #menu a {color:#fff;}
|
||||
#header #menu a:hover {color:#6487c2;}
|
||||
.header {background:#00000021;}
|
||||
.header {background:none;}
|
||||
.header .logo {color:#333;}
|
||||
|
||||
/*error*/
|
||||
.error {/* margin-top:80px; */ height:889px; width:100%;}
|
||||
.error .normal {position:absolute; top:50%; transform:translatey(-50%); width:100%; left:0; right:0;}
|
||||
.error .normal .btn{background:#23527c; width:230px; position:relative; left:50%; margin-left:-115px; border-radius:4px; padding:5px; color:#fff; top:30px;}
|
||||
.error .normal .img {position:relative; left:50%; margin-left:-250px; margin-top:100px; width:500px;}
|
||||
.error .normal .img img {width:100%;}
|
||||
|
||||
|
||||
/*텍스트*/
|
||||
.font-title1 {font-size:60px;}
|
||||
.font-title2 {font-size:24px;}
|
||||
.font-title3 {font-size:22px;}
|
||||
.font-title4 {font-size:22px;}
|
||||
.font-title5 {font-size:16px;}
|
||||
|
||||
.wh {color:#fff;}
|
||||
.gy {color:#878890;}
|
||||
.bk {color:#333;}
|
||||
.main-title {color:#56585a;}
|
||||
.sub-title {color:#86939e;}
|
||||
.color-title {color:#6487c2;}
|
||||
.wh-subtitle {color:#cccccc;}
|
||||
|
||||
.tac {text-align:center;}
|
||||
.tal {text-align:left;}
|
||||
.tar {text-align:right;}
|
||||
.fl {float:left;}
|
||||
.fr {float:right;}
|
||||
.line-none1 {display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; word-break:break-all; -webkit-line-clamp:1;}
|
||||
.mg0 {margin:0;}
|
||||
.pd0 {padding:0;}
|
||||
.bd {font-weight:bold;}
|
||||
|
||||
|
||||
|
||||
/*반응형 View*/
|
||||
@media only screen and (max-width:1220px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1024px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width:768px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:596px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:516px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:414px) {
|
||||
.error .normal .img {margin-left:-150px; width:300px; margin-top:50px;}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 375px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 360px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 320px){
|
||||
}
|
||||
62
src/main/resources/static/css/admin/font.css
Normal file
62
src/main/resources/static/css/admin/font.css
Normal file
@@ -0,0 +1,62 @@
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Black'), url(/font/admin/Pretendard-Black.woff2) format('woff2'), url(/font/admin/Pretendard-Black.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 800;
|
||||
font-display: swap;
|
||||
src: local('Pretendard ExtraBold'), url(/font/admin/Pretendard-ExtraBold.woff2) format('woff2'), url(/font/admin/Pretendard-ExtraBold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Bold'), url(/font/admin/Pretendard-Bold.woff2) format('woff2'), url(/font/admin/Pretendard-Bold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 600;
|
||||
font-display: swap;
|
||||
src: local('Pretendard SemiBold'), url(/font/admin/Pretendard-SemiBold.woff2) format('woff2'), url(/font/admin/Pretendard-SemiBold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Medium'), url(/font/admin/Pretendard-Medium.woff2) format('woff2'), url(/font/admin/Pretendard-Medium.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Regular'), url(/font/admin/Pretendard-Regular.woff2) format('woff2'), url(/font/admin/Pretendard-Regular.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Light'), url(/font/admin/Pretendard-Light.woff2) format('woff2'), url(/font/admin/Pretendard-Light.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 200;
|
||||
font-display: swap;
|
||||
src: local('Pretendard ExtraLight'), url(/font/admin/Pretendard-ExtraLight.woff2) format('woff2'), url(/font/admin/Pretendard-ExtraLight.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Thin'), url(/font/admin/Pretendard-Thin.woff2) format('woff2'), url(/font/admin/Pretendard-Thin.woff) format('woff');
|
||||
}
|
||||
28
src/main/resources/static/css/admin/loadingAnimations2.css
Normal file
28
src/main/resources/static/css/admin/loadingAnimations2.css
Normal file
@@ -0,0 +1,28 @@
|
||||
.loading-image-layer{margin:0; padding:0; background:#fff;}
|
||||
|
||||
.loading-image-layer>ul {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); margin:0; padding:0; display:flex;}
|
||||
.loading-image-layer>ul li {list-style:none; width:20px; height:20px; background:#c1cbda; margin:0 5px; border-radius:50%; animation:animate 1.4s linear infinite;}
|
||||
@keyframes animate {
|
||||
0%{transform:translateY(0);}
|
||||
60%{transform:translateY(0);}
|
||||
80%{transform:translateY(-20px);}
|
||||
100%{transform:translateY(0);}
|
||||
}
|
||||
.loading-image-layer>ul li:nth-child(1) {animation-delay:0;}
|
||||
.loading-image-layer>ul li:nth-child(2) {animation-delay:-1.2s;}
|
||||
.loading-image-layer>ul li:nth-child(3) {animation-delay:-1s;}
|
||||
.loading-image-layer>ul li:nth-child(4) {animation-delay:-.8s;}
|
||||
.loading-image-layer>ul li:nth-child(5) {animation-delay:-.6s;}
|
||||
|
||||
|
||||
|
||||
|
||||
.loading-image-layer2{margin:0; padding:0; background:#fff;}
|
||||
|
||||
.loading-image-layer2>ul {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); margin:0; padding:0; display:flex;}
|
||||
.loading-image-layer2>ul li {list-style:none; width:20px; height:20px; background:#c1cbda; margin:0 5px; border-radius:50%; animation:animate 1.4s linear infinite;}
|
||||
.loading-image-layer2>ul li:nth-child(1) {animation-delay:0;}
|
||||
.loading-image-layer2>ul li:nth-child(2) {animation-delay:-1.2s;}
|
||||
.loading-image-layer2>ul li:nth-child(3) {animation-delay:-1s;}
|
||||
.loading-image-layer2>ul li:nth-child(4) {animation-delay:-.8s;}
|
||||
.loading-image-layer2>ul li:nth-child(5) {animation-delay:-.6s;}
|
||||
68
src/main/resources/static/css/admin/login.css
Normal file
68
src/main/resources/static/css/admin/login.css
Normal file
@@ -0,0 +1,68 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box; text-shadow:none;
|
||||
}
|
||||
|
||||
/* .box-sizing(@box-model) {
|
||||
-webkit-box-sizing: @box-model; //사파리 <= 5
|
||||
-moz-box-sizing: @box-model; //파이어폭스 <= 19
|
||||
box-sizing: @box-model;
|
||||
} */
|
||||
|
||||
|
||||
html,body {height:100%;}
|
||||
body {font-family: 'Pretendard', sans-serif; padding:0; margin:0; font-size:13px;display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; padding-top:40px; padding-bottom:40px; background-color:#f5f5f5;}
|
||||
|
||||
.text-center {background:rgb(21,21,21); background:linear-gradient(180deg, rgba(21,21,21,1) 0%, rgb(55 126 193) 100%);}
|
||||
.text-center .form-signin {padding:50px 50px; background:#f5f7f7; border-radius:4px; max-width:400px; width:100%; margin:auto;}
|
||||
.text-center .form-signin svg {width:60px; height:60px;}
|
||||
.pageName {font-size:26px; margin:40px 20px; margin-top:0;}
|
||||
|
||||
.form-signin .checkbox {font-weight:400;}
|
||||
.form-signin .form-control:focus {z-index:2; border:1px solid #00bbc5;}
|
||||
.form-signin .form-control {margin-bottom:10px; height:36px; border:1px solid #dee2e6; display:block; width:100%; padding:0; padding-left:5px; background-color:#FFF; border-radius:0.267rem; box-shadow:none; font-size:13px; color:rgba(49, 58, 70, .8);}
|
||||
input[type=text]:focus {border:1px solid #00bbc5;}
|
||||
input[type=password]:focus {border:1px solid #00bbc5;}
|
||||
|
||||
.form-signin .btn-primary {font-weight:400; line-height:36px; margin:0; margin-left:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; font-size:13px; float:right; background:#5e5f62; color:#fff;}
|
||||
.form-signin .btn-primary:hover, .form-signin .btn-primary:focus {outline:none; background:#848588;}
|
||||
.copy {color:#929292; font-size:12px; margin-top:20px; margin-bottom:0;}
|
||||
|
||||
.listBtn {overflow:hidden; display:inline-block; margin:auto; list-style:none; margin-top:20px; padding-inline-start:20px;}
|
||||
.listBtn li {float:left;}
|
||||
.listBtn li a {font-size:13px; color:#929292; cursor:pointer; text-decoration:none;}
|
||||
.listBtn li:before {content:'l'; color:#929292; font-size:10px; margin:0 12px;}
|
||||
.listBtn li:first-child:before {content:none;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*반응형 View*/
|
||||
@media only screen and (max-width:1220px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:1024px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:768px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:596px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:414px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:375px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:360px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
}
|
||||
111
src/main/resources/static/css/admin/member.css
Normal file
111
src/main/resources/static/css/admin/member.css
Normal file
@@ -0,0 +1,111 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans KR';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Noto Sans KR Regular'), local('Noto Sans CJK KR Regular'),
|
||||
url(/font/admin/NotoSansKR-Regular.woff2) format('woff2'),
|
||||
url(/font/admin/NotoSansKR-Regular.woff) format('woff'),
|
||||
url(/font/admin/NotoSansKR-Regular.otf) format('opentype');
|
||||
}
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box; text-shadow:none;
|
||||
}
|
||||
|
||||
/* .box-sizing(@box-model) {
|
||||
-webkit-box-sizing: @box-model; //사파리 <= 5
|
||||
-moz-box-sizing: @box-model; //파이어폭스 <= 19
|
||||
box-sizing: @box-model;
|
||||
} */
|
||||
|
||||
|
||||
html,body {height:100%;}
|
||||
body {font-family: "Noto Sans KR", "나눔고딕", "Dotum", "돋움", "Arial", "AppleSDGothicNeo", sans-serif; padding:0; margin:0; font-size:13px;display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; padding-top:40px; padding-bottom:40px; background-color:#f5f5f5;}
|
||||
|
||||
.text-center {background:rgb(21,21,21); background:linear-gradient(180deg, rgba(21,21,21,1) 0%, rgba(0,147,155,1) 100%);}
|
||||
.text-center .form-signin {padding:50px 50px; background:#f5f7f7; border-radius:4px; max-width:600px; width:100%; margin:auto;}
|
||||
.text-center .form-signin svg {width:60px; height:60px;}
|
||||
.pageName {font-size:26px; margin:40px 20px; margin-top:0;}
|
||||
.scroll {overflow-y:scroll; height:500px; margin-bottom:30px; padding:0 20px;}
|
||||
|
||||
.form-signin label {text-align:left; display:block; position:unset; width:unset; height:unset; margin:0; margin-bottom: 2px;}
|
||||
.scroll::-webkit-scrollbar {width:6px; height:6px;}
|
||||
.scroll::-webkit-scrollbar-thumb {border-radius:8px; background-color:#00bbc5;}
|
||||
.scroll::-webkit-scrollbar-corner {background:#151515;}
|
||||
.form-signin .form-control:focus {z-index:2; border:1px solid #00bbc5; outline:none;}
|
||||
.form-signin .form-control {margin-bottom:10px; height:36px; border:1px solid #dee2e6; display:block; width:100%; padding:0; padding-left:5px; background-color:#FFF; border-radius:0.267rem; box-shadow:none; font-size:13px; color:rgba(49, 58, 70, .8);}
|
||||
.form-signin .form-control.number, .form-signin .form-control.address1 {margin-bottom:5px;}
|
||||
.form-signin .form-control.Last {margin-bottom:10px;}
|
||||
.form-signin .form-control.disabled{background:#dee2e6;}
|
||||
input[type=text]:focus {border:1px solid #00bbc5;}
|
||||
input[type=password]:focus {border:1px solid #00bbc5;}
|
||||
.form-signin .zipCodeBox {display:table; width:100%;}
|
||||
.form-signin .zipCodeBox .form-control {width:calc(50% - 3px); float:left;}
|
||||
.form-signin .zipCodeBox button {width:calc(50% - 3px); float:right; margin-right:0}
|
||||
|
||||
.scroll textarea {border:1px solid #DFE3E7; border-radius:0.267rem; padding:10px; background:#fff; text-align:left; height:490px; color:#929292; width:100%;}
|
||||
|
||||
.form-signin .checkbox {padding:0; display:block; margin-bottom:0; display:table; width:100%;}
|
||||
.form-signin .checkbox.first {margin-bottom:20px; margin-top:30px;}
|
||||
.form-signin .checkbox input[type=checkbox] {display:none;}
|
||||
.form-signin input[type=checkbox] {box-sizing:border-box; padding:0;}
|
||||
.form-signin .checkbox label {padding-left:5px; float:left; margin:0;} /* bradley 수정 */
|
||||
.form-signin .checkbox label:after, .form-signin .checkbox label:before {height:18px; width:18px; top:0; left:0; position:absolute; background:#fff;} /* bradley 수정 */
|
||||
.form-signin .checkbox label:after {content:''; background:#fff; border:1px solid #e6e6e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.form-signin .checkbox label:before {content:''; border-radius:4px;}
|
||||
.form-signin .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #e6e6e6;}
|
||||
.form-signin .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:.6rem; width:1rem; border-color:#50c3ca; border-radius:0; border-width:2px; top:4px; left:4px;} /* bradley 수정 */
|
||||
.form-signin .checkbox span {padding-left:25px; float:left;} /* bradley 추가 */
|
||||
.form-signin .checkbox a {}
|
||||
.form-signin .checkbox a svg {width:18px; height:18px; float:right; color:#a4acb5;}
|
||||
|
||||
.form-signin .btn-primary {font-weight:400; line-height:36px; margin:0; margin-left:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; font-size:13px; float:right; background:#377ec1; color:#fff;}
|
||||
.form-signin .btn-primary:hover, .form-signin .btn-primary:focus {outline:none; background:#377ec1;}
|
||||
.copy {color:#929292; font-size:12px; margin-top:30px; margin-bottom:0;}
|
||||
|
||||
.listBtn {overflow:hidden; display:inline-block; margin:auto; list-style:none; margin-top:20px; padding-inline-start:20px;}
|
||||
.listBtn li {float:left;}
|
||||
.listBtn li a {font-size:13px; color:#929292; cursor:pointer; text-decoration:none;}
|
||||
.listBtn li:before {content:'l'; color:#929292; font-size:10px; margin:0 12px;}
|
||||
.listBtn li:first-child:before {content:none;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*bradley 추가 시작*/
|
||||
.form-signin .btnBox {display:table; width:calc(100% - 40px); margin:0 auto;}
|
||||
.form-signin .btnBox .btn-left {width:calc(50% - 3px); float:left; margin:0;}
|
||||
.form-signin .btnBox .btn-right {width:calc(50% - 3px); float:right; margin:0;}
|
||||
.form-signin .btnBox .btnGray {background:#8e949d; color:#fff;}
|
||||
.form-signin .btnBox .btnGray:hover {background:#878c95;}
|
||||
|
||||
/*bradley 추가 종료*/
|
||||
|
||||
/*반응형 View*/
|
||||
@media only screen and (max-width:1220px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:1024px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:768px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:596px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:414px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:375px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:360px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
}
|
||||
401
src/main/resources/static/css/admin/modal.css
Normal file
401
src/main/resources/static/css/admin/modal.css
Normal file
@@ -0,0 +1,401 @@
|
||||
/*
|
||||
Ntsoft v1.0.1
|
||||
Copyright 2021.11 NTSOFT, Inc.
|
||||
*/
|
||||
|
||||
|
||||
/* 팝업 */
|
||||
.modalNT.in .modal-dialog {width:407px; top:50%; transform:translateY(-50%); margin:0 auto;}/*인풋만있을시min-width:605px; 인풋사이 ~ 있을시min-width:620px; 최대min-width:1000px;*/
|
||||
.modalNT.fade .modal-dialog {width:407px; top:50%; transform:translateY(-50%); margin:0 auto;}/*인풋만있을시min-width:605px; 인풋사이 ~ 있을시min-width:620px; 최대min-width:1000px;*/
|
||||
.modalNT .modal-dialog .modal-content {position:relative; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; background-color:unset; background-clip:padding-box; border:none; border-radius:0.3rem; overflow:hidden; box-shadow:none;}
|
||||
.modalNT .modal-dialog .modal-content.overflowN {overflow:unset;}
|
||||
.modalNT .modal-dialog .modal-content .modal-header {display:-ms-flexbox; display:flex; -ms-flex-align:start; align-items:flex-start; border:none; padding:16px; background:#377ec1; border-radius:0; border:none; box-shadow:none; margin:0; position:relative; padding:10px 15px;}
|
||||
.modalNT .modal-dialog .modal-content .modal-header .modal-name {font-size:18px; margin:0; color:#fff;}
|
||||
.modalNT.fade .modal-dialog .modal-content .modal-header .close {padding:8px; -webkit-filter:invert(1) grayscale(100%) brightness(200%); filter:invert(1) grayscale(100%) brightness(200%); -webkit-box-sizing:content-box; box-sizing:content-box; color:#313a46; border:0; border-radius:0.25rem; opacity:1; text-shadow:none; position:absolute; top:50%; right:8px; transform:translateY(-50%); font-size:26px;}
|
||||
.modalNT .modal-body {padding:16px; /*max-height:600px;*/ overflow:scroll; overflow-x:unset; background:#fff;}
|
||||
.modalNT .modal-body.scrollN {overflow:unset;}
|
||||
|
||||
|
||||
.modalNT .modal-body .form-group {display:table; width:100%; border-bottom:1px solid #dee2e6; border-left:none; border-right:none; margin:0; padding:0; background:#f5f7f7;}
|
||||
/* 폼그룹2분할_영역제어 */
|
||||
.modalNT .modal-body .form-group50Wrap {margin-top:0; border-bottom:none; display:table; width:100%;}
|
||||
/* 폼그룹2분할 */
|
||||
.modalNT .modal-body .form-group50 {width:50%; float:left; border-bottom:1px solid #dee2e6; background:#f5f7f7;}
|
||||
|
||||
.modalNT .modal-body .formLine {border-top:1px solid #bdc3c7;}
|
||||
.modalNT .modal-body .control-label {float:left; margin:0; width:170px; text-align:left; line-height:30px; padding:5px 0 5px 15px; font-weight:unset;}
|
||||
.modalNT .modal-body .requisite {color:red; font-size:12px;}
|
||||
.modalNT .modal-body .floatLeft {float:left;}
|
||||
.modalNT .modal-body .rightWarp {padding:5px 0 5px 5px;}
|
||||
.modalNT .modal-body .rightWidth {width:calc(100% - 170px); background:#fff;}
|
||||
.modalNT .modal-body .rightWidthFull {width:100%; display:table;}
|
||||
|
||||
|
||||
|
||||
/* 등록,수정페이지_인풋 */
|
||||
.modalNT .modal-body .pageWrapInput {width:200px; padding:5px 0 5px 5px;}
|
||||
/* 등록,수정페이지_텍스트에어리어,에디터 */
|
||||
.modalNT .modal-body .pageWrapTextarea {padding:5px; width:100%;}
|
||||
|
||||
|
||||
|
||||
.modalNT .modal-body .checkText {position:relative; bottom:0; margin:0 5px; font-weight:600; line-height:30px; padding:5px 0; float:left;}
|
||||
.modalNT .modal-body .commentText {position:relative; bottom:-10px; margin:0 0 0 5px; font-weight:600;}
|
||||
.modalNT .modal-body .inputcomment {clear:both; color:#97989b; margin:0; font-size:12px;}
|
||||
.modalNT .modal-body .textareaText {line-height:30px; color:#97989b; position:relative; left:5px; bottom:-105px;}
|
||||
.modalNT .modal-body .detailsBox {margin-top:0; border-bottom:none; margin-bottom:20px; display:inline-block; width:100%;}
|
||||
.modalNT .modal-body .detailsBox .detailsTitle {color:#324767; text-decoration:none; padding:0px 10px; text-align:left; line-height:34px; margin:0; font-size:16px; font-weight:700; display:block;}
|
||||
.modalNT .modal-body .imgWidth {width:137px; height:137px; overflow:hidden; margin:5px 0 5px 10px; float:left;}
|
||||
.modalNT .modal-body .imgWidth img {width:100%;}
|
||||
.modalNT .modal-body select.form-control:not([multiple=multiple]) {background-image:url(../../image/arrow-down.png); background-position:95%; background-size:14px 14px,10px 10px; background-repeat:no-repeat; -webkit-appearance:none; -moz-appearance:none; padding-right:1.5rem; height:30px; color:rgba(49, 58, 70, .8);}
|
||||
.modalNT .modal-body .form-control {width:100%; border:1px solid #dee2e6; display:block; padding:.47rem .8rem; background-color:#FFF; border-radius:.267rem; box-shadow:none; height:30px; font-size:13px;}
|
||||
.modalNT .modal-body .form-control.dateInput2 {border-radius:.267rem 0 0 .267rem;}
|
||||
.modalNT .modal-body .form-control[disabled]{background:rgba(238, 242, 247, .6);}
|
||||
.modalNT .modal-body .checkbox label {font-size:13px; line-height:30px; margin-left:7px; padding:0;}
|
||||
.modalNT .modal-body textarea {font-size:13px; border:1px solid #dee2e6; outline:none; padding:.47rem .8rem; height:130px; display:block;}
|
||||
.modalNT .modal-body textarea:disabled {background:rgba(238, 242, 247, .6);}
|
||||
.modalNT .modal-body textarea:focus {border:1px solid #00bbc5;}
|
||||
.modalNT .modal-body input[type=text]:focus {border:1px solid #00bbc5;}
|
||||
.modalNT .modal-body select.form-control:not([multiple=multiple]):focus {border:1px solid #00bbc5;}
|
||||
|
||||
|
||||
|
||||
.modalNT .modal-footer {border-top:1px solid #dee2e6; background:#fff; padding:10px 15px;}
|
||||
|
||||
/* 버튼기본사이즈 (전체버튼공통) */
|
||||
.modalNT .btnCommon {width:100px; margin:0 3px; text-shadow:none; border:none; padding:0; border-radius:.267rem; box-shadow:none; line-height:30px; font-size:13px;}
|
||||
.modal-footer .btn+.btn {margin:0 3px;}
|
||||
/* 가운데 정렬 버튼 영역 */
|
||||
.modalNT .btnBox {padding: 10px 15px; margin:0 auto; float:none; min-width:10px; display:table; }
|
||||
/* 초록색_버튼 */
|
||||
.modalNT .btnMint {background:#377ec1; color:#fff;}
|
||||
.modalNT .btnMint:hover {background:#377ec1;}
|
||||
/* 회색_버튼 */
|
||||
.modalNT .btnGray {background:#8e949d; color:#fff;}
|
||||
.modalNT .btnGray:hover {background:#878c95;}
|
||||
/* 빨간색_버튼 */
|
||||
.modalNT .btnRed {background:#c50049; color:#fff;}
|
||||
.modalNT .btnRed:hover {background:#bb0045;}
|
||||
|
||||
/* 체크,라디오 공통 */
|
||||
.modalNT .modal-body .checkbox, .modalNT .modal-body .radio {position:relative; display:inline-block;}
|
||||
.modalNT .modal-body .checkbox input[type=checkbox], .modalNT .modal-body .radio input[type=radio] {display:none;}
|
||||
.modalNT .modal-body input[type=radio], .modalNT .modal-body input[type=checkbox] {box-sizing:border-box; padding:0;}
|
||||
.modalNT .modal-body .checkbox, .modalNT .modal-body .radio {min-height:29px; padding:0 5px 0 15px;}
|
||||
|
||||
|
||||
/* 체크박스 */
|
||||
.modalNT .modal-body .checkbox label {font-size:13px; line-height:30px; margin-left:7px; padding:0;}
|
||||
.modalNT .modal-body .checkbox label:after, .modalNT .modal-body .checkbox label:before {height:18px; width:18px; top:6px; left:0; position:absolute;}
|
||||
.modalNT .modal-body .checkbox label:after {content:''; border:1px solid #dee2e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.modalNT .modal-body .checkbox label:before {content:''; border-radius:4px;}
|
||||
.modalNT .modal-body .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #dee2e6;}
|
||||
.modalNT .modal-body .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:5px; width:9px; border-color:#6A99F8; border-radius:0; border-width:2px; top:12px; left:5px;}
|
||||
|
||||
|
||||
/* 라디오박스 */
|
||||
.modalNT .modal-body .radioWrap {padding:5px 0 5px 5px; display:inline;}
|
||||
.modalNT .modal-body .radio label {font-size:13px; line-height:29px; margin-left:5px; padding:0;}
|
||||
.modalNT .modal-body .radio label::after, .modalNT .modal-body .radio label::before {content:'';}
|
||||
.modalNT .modal-body .radio label:after, .modalNT .modal-body .radio label:before {height:20px; width:20px; top:8px; left:0; position:absolute;}
|
||||
.modalNT .modal-body .radio label::before {border:1px solid #e6e6e6; border-radius:50%; width:16px; height:16px; margin-right:.5rem;}
|
||||
.modalNT .modal-body .radio label::after {position:absolute; display:-webkit-inline-box; display:-webkit-inline-flex; display:-ms-inline-flexbox; display:inline-flex; height:6px; width:6px; background-color:#377ec1; border-radius:50%; top:13px; left:5px; opacity:0; -webkit-transform:scale(3.6); -ms-transform:scale(3.6); transform:scale(3.6); border:none;}
|
||||
.modalNT .modal-body .radio input[type=radio]:checked~label::after {opacity:1; -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); -webkit-transition:all .3s cubic-bezier(.35,.9,.4,.9); transition:all .3s cubic-bezier(.35,.9,.4,.9);}
|
||||
/* 라디오 컬러선택 */
|
||||
.modalNT .modal-body .radio .rangeColorArea1 {background-color:#377ec1;width:15px;height:15px;display:inline-block;position:relative;top:3px;box-shadow:inset 0 0 0 1px rgba(0, 0, 0, .15);border-radius:2px;}
|
||||
.modalNT .modal-body .radio .rangeColorArea2 {background-color:#fc5083;width:15px;height:15px;display:inline-block;position:relative;top:3px;box-shadow:inset 0 0 0 1px rgba(0, 0, 0, .15);border-radius:2px;}
|
||||
.modalNT .modal-body .radioColor {display:inline-block;}
|
||||
.modalNT .modal-body .radioColor .minicolors-swatch::after {box-shadow:inset 0 0 0 1px rgba(0, 0, 0, .15);}
|
||||
.modalNT .modal-body .radioColor .minicolors {display:inline-block; width:200px;}
|
||||
.modalNT .modal-body .radioColor .color-Control {padding-left:28px; width:100%;}
|
||||
.modalNT .modal-body .radioColor .minicolors-theme-bootstrap .minicolors-swatch {width:17px; height:17px; top:6px; left:6px;}
|
||||
|
||||
|
||||
|
||||
/* 리스트상단네비 */
|
||||
.modalNT .modal-body .listNav {display:inline-block; width:100%;}
|
||||
.modalNT .modal-body .listNav .number {line-height:30px; margin:0; display:inline-block; padding:5px 0;}
|
||||
.modalNT .modal-body .listNav .number .n-color {color:blue;}
|
||||
.modalNT .modal-body .listNav .selectBox {float:right; padding:5px 0;}
|
||||
.modalNT .modal-body .listNav .selectBox .selectList {width:150px; margin:0 7px; float:left;}
|
||||
.modalNT .modal-body .listNav .selectBox .last {margin-right:0;}
|
||||
.modalNT .modal-body .listNav .selectBox .selectList select.form-control:not([multiple=multiple]) {width:150px;}
|
||||
|
||||
/* 리스트 왼쪽,오른쪽,마진제외 버튼 영역 */
|
||||
.modalNT .modal-body .btnlistBox {padding:5px 0; display:table; width:100%; border-top:1px solid #dee2e6;}
|
||||
.modalNT .modal-body .btnlistLine {border-top:1px solid #a2a2a2;}
|
||||
/*빨간색_왼쪽정렬버튼*/
|
||||
.modalNT .modal-body .btnlistBox .btnRed {background:#c50049; color:#fff; margin-left:0;}
|
||||
.modalNT .modal-body .btnlistBox .btnRed:hover {background:#bb0045;}
|
||||
/* 초록색_우측정렬버튼 */
|
||||
.modalNT .modal-body .btnlistBox .btnMint {background:#377ec1; color:#fff; float:right;}
|
||||
.modalNT .modal-body .btnlistBox .btnMint:hover {background:#377ec1;}
|
||||
/* 초록색_우측정렬우측마진제거버튼*/
|
||||
.modalNT .modal-body .btnlistBox .btnMintNoMargin {background:#377ec1; color:#fff; float:right; margin-right:0;}
|
||||
.modalNT .modal-body .btnlistBox .btnMintNoMargin:hover {background:#377ec1;}
|
||||
/* 회색_좌측정렬버튼 */
|
||||
.modalNT .modal-body .btnlistBox .btnMintLeft {background:#377ec1; color:#fff; float:left;}
|
||||
.modalNT .modal-body .btnlistBox .btnMint:hover {background:#377ec1;}
|
||||
/* 회색_우측정렬버튼 */
|
||||
.modalNT .modal-body .btnlistBox .btnGrayRight {background:#8e949d; color:rgba(49, 58, 70, .8); float:right;}
|
||||
.modalNT .modal-body .btnlistBox .btnGrayRight:hover {background:#878c95;}
|
||||
/* 회색_왼쪽정렬좌측마진제거버튼(맨끝 첫번째) */
|
||||
.modalNT .modal-body .btnlistBox .btnGrayLeftMargin {background:#8e949d; color:rgba(49, 58, 70, .8); margin-left:0;}
|
||||
.modalNT .modal-body .btnlistBox .btnGrayLeft:hover {background:#878c95;}
|
||||
/* 회색_우측정렬우측마진제거버튼(맨끝 첫번째) */
|
||||
.modalNT .modal-body .btnlistBox .btnGrayRightMargin {background:#8e949d; color:rgba(49, 58, 70, .8); float:right; margin-right:0;}
|
||||
.modalNT .modal-body .btnlistBox .btnGrayRightMargin:hover {background:#878c95;}
|
||||
|
||||
|
||||
/* 리스트 검색결과가 없습니다.*/
|
||||
.modalNT table .searchEmpty>td{cursor: default;}
|
||||
.modalNT table .searchEmpty>td .noData {height:200px; vertical-align:middle; display:block; text-align:center; padding:70px 0;}
|
||||
.modalNT table .searchEmpty>td .noData .noDataTitle {margin:0; font-size:18px; color:#777;}
|
||||
.modalNT table .searchEmpty>td .noData .noDataText {margin:0; line-height:14px; color:#999;}
|
||||
.modalNT table .searchEmpty>td .noData .noDataText span {color:#377ec1;}
|
||||
|
||||
|
||||
|
||||
/* 해더고정스크롤 */
|
||||
.modalNT .modal-body .basicScroll {overflow:hidden; width:100%; min-width:100%; margin-bottom:21px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout {margin:0 auto; width:100%; background:#fff; font-size:12px; color:#444; border:solid 1px #dddfe4; border-top:none; position:relative; box-sizing:border-box;}
|
||||
/*툴팁레이어가 grid-layout 위에 있을 경우 overflow:hidden 제거 필요 */
|
||||
|
||||
/* 스크롤바 스타일 관련 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout {scrollbar-highlight-color:#fff; scrollbar-shadow-color:#fff; scrollbar-arrow-color:#8a8a8a; scrollbar-face-color:#d9d9d9; scrollbar-3dlight-color:#fff; scrollbar-darkshadow-color:#fff; scrollbar-track-color:#fff;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout ::-webkit-scrollbar {-webkit-appearance:none; width:17px; height:17px; background-color:#fff;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout ::-webkit-scrollbar-thumb {background-color:#d9d9d9; border:5px solid transparent; border-radius:16px; background-clip:content-box;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout ::-webkit-scrollbar-thumb:hover {background-color:#c1c1c1;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout ::-webkit-scrollbar-corner {background-color:#f2f2f2;}
|
||||
|
||||
/* 헤더 영역 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .header {position:relative; overflow:hidden;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .header .headerBox {overflow:hidden; left:-1px; border-top:1px solid #dee2e6; border-bottom:1px solid #dee2e6; background:#f6f6f6;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .header .base {overflow-x:scroll; margin-right:-1px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .header .config-button {display:none;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .header tbody {background-color:#f6f6f6;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .header .left {margin-right:16px;}
|
||||
|
||||
/* 바디 영역 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .body {position:relative; overflow:hidden; margin-bottom:-1px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .body .height-bar {display:none;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .body .base {margin-right:-1px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .body .bodyBox {top:-1px; left:-1px; overflow:hidden;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .vertical-scrollbar-line {display:none;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .horizontal-scrollbar-line {display:none; position:absolute; width:100%; height:1px; left:0px; background-color:#dddfe4;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .container {position:relative;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .body .left {display:none; position:absolute; top:0; margin:0;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .right {display:none; position:absolute; top:0; right:-1px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .clipboard {position:absolute; left:-999px; width:1px; height:1px; bottom:0;}
|
||||
|
||||
/* 데이터 없을 때 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .empty-layer {display:none; width:100%; height:100%; position:absolute; top:0; background:#fff;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .empty-layer .content {display:table-cell; font-size:14px; height:100%; text-align:center; padding-top:100px; overflow-x:hidden; overscroll-behavior-x:none;}
|
||||
|
||||
/* 그리드 전체 비활성화 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .blocker-layer {display:none; position:absolute; background:rgba(0, 0, 0, 0.05); width:100%; height:100%; top:0;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.disabled, .modalNT .modal-body .basicScroll .grid-layout.disabled th, .modalNT .modal-body .basicScroll .grid-layout.disabled .content-holder {color:#e0e0e0 !important;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.disabled .blocker-layer {display:block;}
|
||||
|
||||
/* 수평 스크롤 가능 영역 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .horizontal-scrollable {overscroll-behavior-x:none;}
|
||||
|
||||
/* 수직 스크롤바를 사용하지 않는 경우 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .virtual-horizontal-scrollbar {display:none;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .virtual-horizontal-scrollbar .space {display:none;}
|
||||
|
||||
/* 수직 스크롤바를 사용하는 경우 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout.vertical-scrollbar .header .config-button {display:block; position:absolute; border:solid 1px #dddfe4; top:0; right:-1px; width:18px; background-color:#f6f6f6;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.vertical-scrollbar .body {overflow-y:scroll; margin-right:-1px; min-height:255px; max-height:initial; height:301px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.vertical-scrollbar .body .height-bar {display:block; position:absolute; width:1px; top:0; left:0; background:transparent;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.vertical-scrollbar .virtual-horizontal-scrollbar {margin-right:16px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.vertical-scrollbar .vertical-scrollbar-line {display:block; position:absolute; width:1px; height:100%; top:0; right:16px; background-color:#dddfe4;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.vertical-scrollbar .vertical-scrollbar-line:after {position:absolute; right:-17px; top:0; width:1px; height:100%; background-color:#dddfe4; content:'';}
|
||||
|
||||
/* grid-layout overflow:hidden 제거시 필요 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout.vertical-scrollbar .header .container {margin-right:16px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.vertical-scrollbar .horizontal-scrollbar-line {bottom:-1px;}
|
||||
|
||||
/* 수평 스크롤바를 사용하는 경우 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout.horizontal-scrollbar .container {overflow:hidden;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.horizontal-scrollbar .body .base {overflow-x:scroll;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.horizontal-scrollbar .virtual-horizontal-scrollbar {display:block; overflow-y:hidden; overflow-x:scroll; height:17px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.horizontal-scrollbar .virtual-horizontal-scrollbar .width-bar {height:1px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout.horizontal-scrollbar .horizontal-scrollbar-line {bottom:16px;}
|
||||
|
||||
/* 데이터 테이블 관련 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout table {border:0; table-layout:fixed; border-collapse:collapse; border-spacing:1px; width:100%;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table.titleTable {position:relative; right:2px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table col {background-color:#fff;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table th {font-weight:normal; font-size:12px; overflow:hidden; white-space:nowrap; text-align:center; position:relative; border:1px solid #dee2e6; border-left:none; border-top:none;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table tr {height:30px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table tr.hover {background-color:#fff;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table tr.checked {background-color:#fff;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table tr.focused {background-color:#fff;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table tr.disabled, .modalNT .modal-body .basicScroll .grid-layout table tr.disabled-row {color:#b0b0b0;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td {overflow:hidden; font-size:12px; border:1px solid #dee2e6; border-top:none; border-left:none; background:#fff; text-align:center; height:35px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td .content-holder {white-space:nowrap; word-break:break-all;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .body.variable-row-height table td .content-holder {white-space:normal; white-space:initial;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td.no-padding {padding:0px !important;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td.multi-line .content-holder {white-space:normal !important;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td.ellipsis .content-holder {text-overflow:ellipsis; overflow:hidden;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td.focused {border:solid 1px #5a86dd; padding:7px 11px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td a {color:#5a86dd;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td img {vertical-align:middle; margin:-1px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td div.productNameType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td div.productOptionType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td div.couponNameType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout table td div.contentType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
|
||||
.modalNT .modal-body .basicScroll .checkbox, .modalNT .modal-body .basicScroll .radio {min-height:29px; padding:0 5px;}
|
||||
/* 체크 박스 관련 스타일 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .checkbox label:after, .modalNT .modal-body .basicScroll .grid-layout .checkbox label:before {height:18px; width:18px; top:6px; left:0; position:absolute;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .checkbox label:after {content:''; border:1px solid #dee2e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .checkbox label:before {content:''; border-radius:4px;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #dee2e6;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:.6rem; width:1rem; border-color:#377ec1; border-radius:0; border-width:2px; top:11px; left:4px;}
|
||||
|
||||
/* 라디오 박스 관련 스타일 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .radio label::after, .modalNT .modal-body .basicScroll .grid-layout .radio label::before {content:'';}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .radio label:after, .modalNT .modal-body .basicScroll .grid-layout .radio label:before {height:20px; width:20px; top:6px; left:-5px; position:absolute;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .radio label::before {border:1px solid #dee2e6; border-radius:50%; width:16px; height:16px; margin-right:.5rem;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .radio label::after {position:absolute; display:-webkit-inline-box; display:-webkit-inline-flex; display:-ms-inline-flexbox; display:inline-flex; height:6px; width:6px; background-color:#377ec1; border-radius:50%; top:11px; left:0; opacity:0; -webkit-transform:scale(3.6); -ms-transform:scale(3.6); transform:scale(3.6); border:none;}
|
||||
.modalNT .modal-body .basicScroll .grid-layout .radio input[type=radio]:checked~label::after {opacity:1; -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); -webkit-transition:all .3s cubic-bezier(.35,.9,.4,.9); transition:all .3s cubic-bezier(.35,.9,.4,.9);}
|
||||
|
||||
.modalNT .modal-body .basicScroll .cui-grid-textbox {display:inline-block; width:100%; box-sizing:border-box;}
|
||||
|
||||
/* 열고정 라인 그라데이션 스타일 */
|
||||
.modalNT .modal-body .basicScroll .grid-layout .line-gradient:after {position:absolute; top:0; bottom:0; width:6px; height:100%; content:'';}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 왼쪽고정,해더고정 스크롤 */
|
||||
.modalNT .modal-body .fixedScroll {overflow:hidden; width:961px; min-width:100%; margin-bottom:21px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout {margin:0 auto; width:100%; background:#fff; font-size:12px; color:#444; border:solid 1px #dddfe4; border-top:none; position:relative; box-sizing:border-box;}
|
||||
/*툴팁레이어가 grid-layout 위에 있을 경우 overflow:hidden 제거 필요 */
|
||||
|
||||
/* 스크롤바 스타일 관련 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout {scrollbar-highlight-color:#fff; scrollbar-shadow-color:#fff; scrollbar-arrow-color:#8a8a8a; scrollbar-face-color:#d9d9d9; scrollbar-3dlight-color:#fff; scrollbar-darkshadow-color:#fff; scrollbar-track-color:#fff;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout ::-webkit-scrollbar {-webkit-appearance:none; width:17px; height:17px; background-color:#fff;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout ::-webkit-scrollbar-thumb {background-color:#d9d9d9; border:5px solid transparent; border-radius:16px; background-clip:content-box;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout ::-webkit-scrollbar-thumb:hover {background-color:#c1c1c1;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout ::-webkit-scrollbar-corner {background-color:#f2f2f2;}
|
||||
|
||||
/* 헤더 영역 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .header {position:relative; overflow:hidden; border-top:1px solid #dee2e6;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .header .headerBox {overflow:hidden; left:-1px; overflow-y:scroll; height:35px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .header .base {overflow-x:hidden; margin-right:-1px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .header .config-button {display:none;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .header tbody {background-color:#f6f6f6;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout #headerBox::-webkit-scrollbar-thumb {background-color:#f6f6f6;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout #headerBox::-webkit-scrollbar-track {background-color:#f6f6f6; border-bottom:1px solid #dee2e6;}
|
||||
|
||||
/* 바디 영역 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .body {position:relative; overflow:hidden; margin-bottom:-1px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .body .height-bar {display:none;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .body .base {margin-right:-1px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .body .bodyBox {top:-1px; left:-1px; overflow:hidden;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .vertical-scrollbar-line {display:none;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .horizontal-scrollbar-line {display:none; position:absolute; width:100%; height:1px; left:0px; background-color:#dddfe4;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .container {position:relative;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .left {display:none; position:absolute; top:0;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .right {display:none; position:absolute; top:0; right:-1px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .clipboard {position:absolute; left:-999px; width:1px; height:1px; bottom:0;}
|
||||
|
||||
/* 그리드 전체 비활성화 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .blocker-layer {display:none; position:absolute; background:rgba(0, 0, 0, 0.05); width:100%; height:100%; top:0;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.disabled, .modalNT .modal-body .fixedScroll .grid-layout.disabled th, .modalNT .modal-body .fixedScroll .grid-layout.disabled .content-holder {color:#e0e0e0 !important;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.disabled .blocker-layer {display:block;}
|
||||
|
||||
/* 수평 스크롤 가능 영역 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .horizontal-scrollable {overscroll-behavior-x:none;}
|
||||
|
||||
/* 수직 스크롤바를 사용하지 않는 경우 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .virtual-horizontal-scrollbar {display:none;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .virtual-horizontal-scrollbar .space {display:none;}
|
||||
|
||||
/* 수직 스크롤바를 사용하는 경우 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.vertical-scrollbar .header .config-button {display:block; position:absolute; border:solid 1px #dddfe4; top:0; right:-1px; width:18px; background-color:#f6f6f6;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.vertical-scrollbar .body {overflow-y:scroll; margin-right:-1px; min-height:255px; max-height:initial; height:301px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.vertical-scrollbar .body .height-bar {display:block; position:absolute; width:1px; top:0; left:0; background:transparent;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.vertical-scrollbar .virtual-horizontal-scrollbar {margin-right:16px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.vertical-scrollbar .vertical-scrollbar-line {display:block; position:absolute; width:1px; height:100%; top:0; right:16px; background-color:#dddfe4;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.vertical-scrollbar .vertical-scrollbar-line:after {position:absolute; right:-17px; top:0; width:1px; height:100%; background-color:#dddfe4; content:'';}
|
||||
|
||||
/* grid-layout overflow:hidden 제거시 필요 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.vertical-scrollbar .header .container {margin-right:16px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.vertical-scrollbar .horizontal-scrollbar-line {bottom:-1px;}
|
||||
|
||||
/* 수평 스크롤바를 사용하는 경우 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.horizontal-scrollbar .container {overflow:hidden;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.horizontal-scrollbar .body .base {overflow-x:hidden;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.horizontal-scrollbar .virtual-horizontal-scrollbar {display:block; overflow-y:hidden; overflow-x:scroll; height:17px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.horizontal-scrollbar .virtual-horizontal-scrollbar .width-bar {height:1px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout.horizontal-scrollbar .horizontal-scrollbar-line {bottom:16px;}
|
||||
|
||||
/* 데이터 테이블 관련 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table {border:0; table-layout:fixed; border-collapse:collapse; border-spacing:1px; width:100%; height:35px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table.titleTable {position:relative; right:0;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table col {background-color:#fff;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table th {font-weight:normal; font-size:12px; overflow:hidden; white-space:nowrap; text-align:center; position:relative; border:1px solid #dee2e6; border-left:none; border-top:none;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table tr {height:30px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table tr.hover {background-color:#fff;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table tr.checked {background-color:#fff;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table tr.focused {background-color:#fff;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table tr.disabled, .modalNT .modal-body .fixedScroll .grid-layout table tr.disabled-row {color:#b0b0b0;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td {overflow:hidden; font-size:12px; border:1px solid #dee2e6; border-top:none; border-left:none; background:#fff; line-height:17px; text-align:center;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td div.productNameType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td div.productOptionType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td div.couponNameType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td div.contentType {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td div.leftAlign {text-align:left;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td div.rightAlign {text-align:right;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .body.variable-row-height table td .content-holder {white-space:normal; white-space:initial;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td.no-padding {padding:0px !important;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td.multi-line .content-holder {white-space:normal !important;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td.ellipsis .content-holder {text-overflow:ellipsis; overflow:hidden;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td.focused {border:solid 1px #5a86dd; padding:7px 11px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td a {color:#5a86dd;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout table td img {vertical-align:middle; margin:-1px;}
|
||||
|
||||
/* 체크 박스 관련 스타일 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .checkbox label:after, .grid-layout .checkbox label:before {height:18px; width:18px; top:4px; left:7px; position:absolute;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .checkbox label:after {content:''; border:1px solid #dee2e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .checkbox label:before {content:''; border-radius:4px;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #dee2e6;}
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:.6rem; width:1rem; border-color:#377ec1; border-radius:0; border-width:2px; top:10px; left:12px;}
|
||||
|
||||
.modalNT .modal-body .fixedScroll .cui-grid-textbox {display:inline-block; width:100%; box-sizing:border-box;}
|
||||
|
||||
/* 열고정 라인 그라데이션 스타일 */
|
||||
.modalNT .modal-body .fixedScroll .grid-layout .line-gradient:after {position:absolute; top:0; bottom:0; width:6px; height:100%; content:'';}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 파일업로드 */
|
||||
|
||||
/*.modalNT .modal-body .input-file {min-height:37px; padding-right:0; padding-left:15px;}*/
|
||||
.modalNT .modal-body .input-file {display:inline-block;}
|
||||
.modalNT .modal-body .input-file [type="file"] {position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0, 0, 0, 0); border:0 none; }
|
||||
.modalNT .modal-body .input-file .file-label {background-color:#dee2e6; text-align:center; margin:0 0 0 7px; text-shadow:none; border:none; border-radius:.267rem; box-shadow:none; line-height:30px; font-weight:300; cursor:pointer; padding:0 12px 0 7px;}
|
||||
.modalNT .modal-body .input-file .btnFile {width:100px; background:#377ec1; text-shadow:none; color:#fff; border:none; padding:0.47rem 0.8rem; border-radius:0.267rem; box-shadow:none; height:35px; margin:0; text-align:center; font-weight:normal; line-height:25px;}
|
||||
/* 버튼아이콘 */
|
||||
.modalNT .modal-body .input-file .file-label svg {fill:rgba(49, 58, 70, .8); float:left; width:25px}
|
||||
.modalNT .modal-body .input-file .file-name {width:245px; border:1px solid #dee2e6; padding:.47rem .8rem; background-color:#FFF; border-radius:.267rem; box-shadow:none; height:30px; outline:none; float:left;}
|
||||
.modalNT .modal-body .input-file [type="file"]:focus {border:1px solid #50c3ca;}
|
||||
/* 첨부파일_파일문구 */
|
||||
.modalNT .modal-body .download-file {padding-left:15px; height:30px; line-height:24px; color:#dee2e6;}
|
||||
.modalNT .modal-body .download-file .fileDownloadTitle {color:#999; text-decoration:underline;}
|
||||
|
||||
222
src/main/resources/static/css/admin/modal_styles.css
Normal file
222
src/main/resources/static/css/admin/modal_styles.css
Normal file
@@ -0,0 +1,222 @@
|
||||
/* modal.css 수정금지 */
|
||||
/* 새로 css 추가시 어느 페이지에 어디위치인지 표시할것 */
|
||||
/* 기존 css 수정시 여기다가 수정할것 */
|
||||
|
||||
|
||||
|
||||
/* joy 추가 시작 */
|
||||
|
||||
/* 연차관리 날짜 선택 리스트 */
|
||||
.modalNT .choiceDateBox{display:block;overflow-y:scroll;border:1px solid #e6e6e6;outline:none;width:700px;height:130px;padding:.47rem .8rem;}
|
||||
|
||||
/* 작은 모달 */
|
||||
.modalNT.fade .modal-dialog.modalSmall {min-width:800px;}
|
||||
|
||||
/* 왼쪽 정렬 */
|
||||
.modalNT .basicScroll .grid-layout table td div.leftAlign {text-align:left;padding:0 5px;}
|
||||
|
||||
/* 필수 표시 */
|
||||
.modalNT .modal-body .requisite {color:red; font-size:12px;}
|
||||
|
||||
|
||||
|
||||
/* 반복주기 가로사이즈 */
|
||||
.modalNT .modal-body .form-control.inputRepeaInterval {width:calc(100% - 60px);}
|
||||
|
||||
/* 팝업 반복 주기 글자 */
|
||||
.modalNT .modal-body .repeatCommentText {position:relative; bottom:-10px; margin:0 0 0 5px; font-weight:600;}
|
||||
|
||||
/* 알림 css 시작 */
|
||||
.success .modal.in {z-index: 9991;}
|
||||
.success .modal.in .modal-dialog{top:50%; transform:translateY(-50%); width:300px;}
|
||||
.success .modal-header {border-bottom:none;}
|
||||
.success .modal-name {text-align:center;}
|
||||
.success .modal-name svg {width:40px; height:40px; margin:10px 0; fill:#198754;}
|
||||
.success .modal-name .title {font-size:16px; word-break:keep-all; font-weight:700; margin-bottom:5px;}
|
||||
.success .modal-name .text {font-size:14px; margin:0; word-break:keep-all;}
|
||||
|
||||
.danger .modal.in {z-index: 9991;}
|
||||
.danger .modal.in .modal-dialog{top:50%; transform:translateY(-50%); width:300px;}
|
||||
.danger .modal-header {border-bottom:none;}
|
||||
.danger .modal-name {text-align:center;}
|
||||
.danger .modal-name svg {width:40px; height:40px; margin:10px 0; fill:#dc3545;}
|
||||
.danger .modal-name .title {font-size:16px; word-break:keep-all; font-weight:700; margin-bottom:5px;}
|
||||
.danger .modal-name .text {font-size:14px; margin:0; word-break:keep-all;}
|
||||
|
||||
.warning .modal.in {z-index: 9991;}
|
||||
.warning .modal.in .modal-dialog{top:50%; transform:translateY(-50%); width:300px;}
|
||||
.warning .modal-header {border-bottom:none;}
|
||||
.warning .modal-name {text-align:center;}
|
||||
.warning .modal-name svg {width:40px; height:40px; margin:10px 0; fill:#dc3545;}
|
||||
.warning .modal-name .title {font-size:16px; word-break:keep-all; font-weight:700; margin-bottom:5px;}
|
||||
.warning .modal-name .text {font-size:14px; margin:0; word-break:keep-all;}
|
||||
|
||||
.info .modal.in {z-index: 9991;}
|
||||
.info .modal.in .modal-dialog{top:50%; transform:translateY(-50%); width:300px;}
|
||||
.info .modal-header {border-bottom:none;}
|
||||
.info .modal-name {text-align:center;}
|
||||
.info .modal-name svg {width:40px; height:40px; margin:10px 0; fill:#0dcaf0;}
|
||||
.info .modal-name .title {font-size:16px; word-break:keep-all; font-weight:700; margin-bottom:5px;}
|
||||
.info .modal-name .text {font-size:14px; margin:0; word-break:keep-all;}
|
||||
|
||||
|
||||
.popupColored .modal-footer {padding:0;}
|
||||
/* 모달버튼 */
|
||||
.popupColored .modal .btn-box {padding:0; margin:10px auto; float:none; min-width:10px; display:table;}
|
||||
.popupColored .modal .btnCommon {width:100px; margin:0 7px; text-shadow:none; border:none; padding:0; border-radius:.267rem; box-shadow:none; line-height:32px;}
|
||||
/*취소*/
|
||||
.popupColored .modal .btn-cancel {background:#e6e6e6; color:#333;}
|
||||
.popupColored .modal .btn-cancel:hover {background:#dedede;}
|
||||
/*확인*/
|
||||
.popupColored .modal .btn-Success {background:#377ec1; color:#fff;}
|
||||
.popupColored .modal .btn-Success:hover {background:#7caad7;}
|
||||
|
||||
.modalNT .modal-body .form-group50 {width:50%; float:left; border-bottom:1px solid #e6e6e6; background:#f5f7f7;}
|
||||
|
||||
|
||||
|
||||
@media only screen and (max-width:1200px) {
|
||||
.success .modal.in .modal-dialog {margin:0 auto;}
|
||||
.danger .modal.in .modal-dialog {margin:0 auto;}
|
||||
.warning .modal.in .modal-dialog {margin:0 auto;}
|
||||
.info .modal.in .modal-dialog {margin:0 auto;}
|
||||
}
|
||||
/* 알림 css 종료 */
|
||||
|
||||
|
||||
/* 라디오리스트팝업 */
|
||||
.modalNT.fade .modal-dialog.modalRadioList {width:300px;min-width:300px;}
|
||||
.modalNT.fade .modal-dialog.modalRadioList .form-group {background:#fff;border-bottom:none;}
|
||||
.modalNT.fade .modal-dialog.modalRadioList .form-group .radio {display:block;}
|
||||
|
||||
|
||||
|
||||
/* joy 추가 종료 */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* bradley 추가 시작 */
|
||||
/* 등록,수정페이지_인풋 width 125 */
|
||||
.modalNT .modal-body .pageWrapInput.width125 {width:100px;}
|
||||
|
||||
/* 송장출력관리 > 우측버튼 팝업 _ 운송장출력내용부분 */
|
||||
.modalNT.in .modal-dialog.imgPrint {min-width:1000px; top:50%; transform:translateY(-50%); margin:0 auto;}
|
||||
.modalNT.fade .modal-dialog.imgPrint {min-width:1000px; top:50%; transform:translateY(-50%); margin:0 auto;}
|
||||
|
||||
.modalNT .modal-body .imageBoxL {width:190px;}
|
||||
.modalNT .modal-body .imageBoxL img {width:100%;}
|
||||
.modalNT .modal-body .imageBoxR {width:300px;}
|
||||
.modalNT .modal-body .imageBoxR img {width:100%;}
|
||||
.modalNT.modalVisitLog .modal-dialog {width:900px;}
|
||||
|
||||
.modalNT .modal-body .sub-name {width: 580px; clear:both; color:#97989b; margin:5px 0 0; font-size:12px; position:relative;}
|
||||
.modalNT .modal-body .sub-name:first-child {margin-top:10px;}
|
||||
.modalNT .modal-body .sub-name .deleteSvg {width:20px; height:20px; fill:rgba(49, 58, 70, .8); position:absolute;}
|
||||
|
||||
#popup_insertUserPlanner .modal-dialog {width:408px;}
|
||||
/* bradley 추가 종료 */
|
||||
|
||||
|
||||
/* kevin 추가 시작 */
|
||||
|
||||
/* 이미지 */
|
||||
/* .modalNT .modal-body form .photoBox {width:calc(100% - 200px); float:left; padding:0 0 0 10px;} */
|
||||
.modalNT .modal-content .photoSlash {width:300px; float:left; padding:0 0 0 10px;}
|
||||
.modalNT .modal-content .title-name {margin:5px 0;}
|
||||
.modalNT .modal-content .imgnumber {color:#97989b; position:relative; left:10px;}
|
||||
.modalNT .modal-content input[type="file"] {position:absolute; opacity:0; cursor:pointer; z-index:1;}
|
||||
.modalNT .modal-content .photoList {display:table; position:relative;}
|
||||
.modalNT .modal-content .videoList {display:table;}
|
||||
.modalNT .modal-content .imgBox {width:100px; height:100px; padding:0; float:left; margin-right:10px;}
|
||||
.modalNT .modal-content .img-100 {border:1px solid #e6e6e6; width:100px; height:100px; background:none; color:#3e3f3a;}
|
||||
.modalNT .modal-content .img-100:hover{background:none;border:1px solid #e6e6e6;box-shadow:none;}
|
||||
.modalNT .modal-content .photoBorder {width:calc(100% - 200px); border-bottom:1px solid #e6e6e6; display:-webkit-box; float:right;}
|
||||
.modalNT .modal-content .photoBorder.last {border:none;}
|
||||
|
||||
/* kevin 추가 종료 */
|
||||
|
||||
/* emily 추가 시작 */
|
||||
|
||||
/* 모달 input x 버튼 투명도 조절 button -> input 변경*/
|
||||
.modalNT.fade .modal-dialog .modal-content .modal-header .close {background: 0 0;}
|
||||
|
||||
/*사이즈 변경 pageWrap*/
|
||||
.modalNT .modal-body .form-group .width50, .modalNT .modal-body .form-group50 .width50 {width:42%; padding:5px;}
|
||||
.modalNT .modal-body .form-group .width100, .modalNT .modal-body .form-group50 .width100 {width:100%; padding:5px;}
|
||||
|
||||
/*첨부파일, URL 상세 조회(조회만) 파일 없을 때 height 사이즈 조절*/
|
||||
.modalNT .modal-body .rightWidth.minHeight {min-height: 40px;}
|
||||
/*첨부파일 확장자*/
|
||||
.modalNT .modal-body .input-file .fileExt {color:red; padding-left:10px;}
|
||||
|
||||
|
||||
/*탭이 있는 모달 위치 조정*/
|
||||
.modalNT.fade .modal-dialog.tapIn {top:0; margin:50px auto; transform: translate(0, 0);}
|
||||
|
||||
/* 탭 리스트*/
|
||||
.modalNT .modal-tap {padding:16px; /*max-height:600px;*/ /*overflow:scroll;*/ overflow-x:unset; background:#fff;}
|
||||
.modalNT .modal-tap .border {width:40px; height:3px; background:#00723e;}
|
||||
.modalNT .modal-tap .listConbox {margin-bottom:1px;}
|
||||
.modalNT .modal-tap .listConbox .tabList {list-style:none; padding:0; margin:1px; margin-bottom:-1px; width:100%; background:#fff;}
|
||||
.modalNT .modal-tap .listConbox .tabList li {position:relative; display:table-cell; width:calc(100% / 7); border-left:0; text-align:center;}
|
||||
.modalNT .modal-tap .listConbox .tabList li:after {content:''; position:absolute; top:0; bottom:0; left:-1px; right:0; border:1px solid #dedede;}
|
||||
.modalNT .modal-tap .listConbox .tabList li a {position:relative; display:block; font-size:13px; line-height:38px; height:38px; z-index:1; margin:0; padding:0; border:0; background:#f5f7f7; border:1px solid #dee2e6; border-left:none; border-radius:0;}
|
||||
.modalNT .modal-tap .listConbox .tabList li a:link {color:rgba(49, 58, 70, .8);}
|
||||
.modalNT .modal-tap .listConbox .tabList li a:hover {background:#f5f7f7; color:rgba(49, 58, 70, .8);}
|
||||
.modalNT .modal-tap .listConbox .tabList li.active a:after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border:0; z-index:2;}
|
||||
.modalNT .modal-tap .listConbox .tabList li.active a:hover{background:none;}
|
||||
.modalNT .modal-tap .listConbox .nav-tabs>li.active>a, .modalNT .modal-tap .listConbox .nav-tabs>li.active>a:focus, .modalNT .modal-tap .listConbox .nav-tabs>li.active>a:hover {color:#fff; background:#377ec1; border-radius:0; border:none;} /*선택시 배경 여기에 넣을것 */
|
||||
.modalNT .modal-tap .formSubstance .tab-pane {display:none;}
|
||||
.modalNT .modal-tap .formSubstance .tab-pane.active {display:block;} /*bradley 수정*/
|
||||
/* 탭내용*/
|
||||
.modalNT .modal-tap .form-horizontal .conBox {border:1px solid #dee2e6; padding:10px;}
|
||||
.modalNT .modal-tap .form-horizontal .conBox .title {color:#324767; text-decoration:none; padding:0px 10px; text-align:left; line-height:34px; margin:0; font-size:16px; font-weight:700;}
|
||||
.modalNT .modal-tap .form-horizontal .conBox .title span {color:#97989b; font-size:13px; margin-left:10px;}
|
||||
.modalNT .modal-tap .form-horizontal .conBox .marginBox {margin:30px;}
|
||||
|
||||
/* 리스트상단네비 */
|
||||
.modalNT .modal-tap .listNav {display:inline-block; width:100%; height:30px; position:relative;}
|
||||
.modalNT .modal-tap .listNav .numberBox {position: absolute;left: 0;}
|
||||
.modalNT .modal-tap .listNav .numberBox .number {line-height:30px; margin:0; display:inline-block;}
|
||||
.modalNT .modal-tap .listNav .numberBox .number .n-color {color:#377ec1; padding-left:3px;}
|
||||
.modalNT .modal-tap .listNav .numberBox .slush {padding:0 5px; display:inline-block;}
|
||||
.modalNT .modal-tap .listNav .text {color:#324767; text-decoration:none; padding:0px 10px; text-align:left; line-height:34px; margin:0; font-size:16px; font-weight:700; display:block; border-bottom:1px solid #dee2e6;}
|
||||
/* 리스트우측셀렉트3종 */
|
||||
.modalNT .modal-tap .listNav .selectBox {position:absolute; top:0; right:0;}
|
||||
.modalNT .modal-tap .listNav .selectBox .selectList {margin:0 0 0 7px; float:right; width:150px;}
|
||||
|
||||
|
||||
.modalNT .modal-tap .form-control {width:100%; border:1px solid #dee2e6; display:block; padding:.47rem .8rem; background-color:#FFF; border-radius:.267rem; box-shadow:none; height:30px; font-size:13px;}
|
||||
.modalNT .modal-tap select.form-control:not([multiple=multiple]) {background-image:url(../../image/arrow-down.png); background-position:95%; background-size:14px 14px,10px 10px; background-repeat:no-repeat; -webkit-appearance:none; -moz-appearance:none; padding-right:1.5rem; height:30px; color:rgba(49, 58, 70, .8);}
|
||||
.modalNT .modal-tap select.form-control:not([multiple=multiple]):focus {border:1px solid #00bbc5;}
|
||||
|
||||
/* 리스트 왼쪽,오른쪽,마진제외 버튼 영역 */
|
||||
.modalNT .modal-tap .btnlistBox {padding:5px 0; display:table; width:100%; border-top:1px solid #dee2e6;}
|
||||
.modalNT .modal-tap .btnlistLine {border-top:1px solid #a2a2a2;}
|
||||
/*빨간색_왼쪽정렬버튼*/
|
||||
.modalNT .modal-tap .btnlistBox .btnRed {background:#c50049; color:#fff; margin-left:0;}
|
||||
.modalNT .modal-tap .btnlistBox .btnRed:hover {background:#bb0045;}
|
||||
/* 초록색_우측정렬버튼 */
|
||||
.modalNT .modal-tap .btnlistBox .btnMint {background:#377ec1; color:#fff; float:right;}
|
||||
.modalNT .modal-tap .btnlistBox .btnMint:hover {background:#377ec1;}
|
||||
/* 초록색_우측정렬우측마진제거버튼*/
|
||||
.modalNT .modal-tap .btnlistBox .btnMintNoMargin {background:#377ec1; color:#fff; float:right; margin-right:0;}
|
||||
.modalNT .modal-tap .btnlistBox .btnMintNoMargin:hover {background:#377ec1;}
|
||||
/* 회색_좌측정렬버튼 */
|
||||
.modalNT .modal-tap .btnlistBox .btnMintLeft {background:#377ec1; color:#fff; float:left;}
|
||||
.modalNT .modal-tap .btnlistBox .btnMint:hover {background:#377ec1;}
|
||||
/* 회색_우측정렬버튼 */
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayRight {background:#8e949d; color:rgba(49, 58, 70, .8); float:right;}
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayRight:hover {background:#878c95;}
|
||||
/* 회색_왼쪽정렬좌측마진제거버튼(맨끝 첫번째) */
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayLeftMargin {background:#8e949d; color:rgba(49, 58, 70, .8); margin-left:0;}
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayLeft:hover {background:#878c95;}
|
||||
/* 회색_우측정렬우측마진제거버튼(맨끝 첫번째) */
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayRightMargin {background:#8e949d; color:rgba(49, 58, 70, .8); float:right; margin-right:0;}
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayRightMargin:hover {background:#878c95;}
|
||||
|
||||
.modalNT.in {overflow-y: auto;}
|
||||
/* emily 추가 종료 */
|
||||
110
src/main/resources/static/css/admin/password.css
Normal file
110
src/main/resources/static/css/admin/password.css
Normal file
@@ -0,0 +1,110 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans KR';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Noto Sans KR Regular'), local('Noto Sans CJK KR Regular'),
|
||||
url(/font/admin/NotoSansKR-Regular.woff2) format('woff2'),
|
||||
url(/font/admin/NotoSansKR-Regular.woff) format('woff'),
|
||||
url(/font/admin/NotoSansKR-Regular.otf) format('opentype');
|
||||
}
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box; text-shadow:none;
|
||||
}
|
||||
|
||||
/* .box-sizing(@box-model) {
|
||||
-webkit-box-sizing: @box-model; //사파리 <= 5
|
||||
-moz-box-sizing: @box-model; //파이어폭스 <= 19
|
||||
box-sizing: @box-model;
|
||||
} */
|
||||
|
||||
|
||||
html,body {height:100%;}
|
||||
body {font-family: "Noto Sans KR", "나눔고딕", "Dotum", "돋움", "Arial", "AppleSDGothicNeo", sans-serif; padding:0; margin:0; font-size:13px;display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; padding-top:40px; padding-bottom:40px; background-color:#f5f5f5;}
|
||||
|
||||
.text-center {background:url(/image/adminBg.png); background-position: center;}
|
||||
.text-center .form-signin {padding: 50px 80px; background:rgb(255 255 255 / 90%); border-radius:4px; max-width:600px; width:100%; margin:auto; height:500px;}
|
||||
.text-center .form-signin svg {width:80px; height:80px;}
|
||||
.pageName {font-size:26px; margin:20px; font-weight:500;}
|
||||
.scroll {overflow-y:scroll; height:220px; margin-bottom:50px; padding:0 5px;}
|
||||
|
||||
.form-signin label {text-align:left; display:block; position:unset; width:unset; height:unset; margin:0; margin-bottom: 2px;}
|
||||
.scroll::-webkit-scrollbar {width:6px; height:6px;}
|
||||
.scroll::-webkit-scrollbar-thumb {border-radius:8px; background-color:#00bbc5;}
|
||||
.scroll::-webkit-scrollbar-corner {background:#151515;}
|
||||
.form-signin .form-control:focus {z-index:2; border:1px solid #00bbc5; outline:none;}
|
||||
.form-signin .form-control {margin-bottom:10px; border:1px solid #dee2e6; display:block; width:100%; padding:0; padding-left:5px; background-color:#FFF; border-radius:0.267rem; box-shadow:none; height:40px; line-height:40px; font-size:14px; color:rgba(49, 58, 70, .8);}
|
||||
.form-signin .form-control.number, .form-signin .form-control.address1 {margin-bottom:5px;}
|
||||
.form-signin .form-control.Last {margin-bottom:10px;}
|
||||
.form-signin .form-control.disabled{background:#dee2e6;}
|
||||
input[type=text]:focus {border:1px solid #00bbc5;}
|
||||
input[type=password]:focus {border:1px solid #00bbc5;}
|
||||
.form-signin .zipCodeBox {display:table; width:100%;}
|
||||
.form-signin .zipCodeBox .form-control {width:calc(50% - 3px); float:left;}
|
||||
.form-signin .zipCodeBox button {width:calc(50% - 2px); float:right; margin-right:0}
|
||||
|
||||
.scroll textarea {border:1px solid #DFE3E7; border-radius:0.267rem; padding:10px; background:#fff; text-align:left; height:490px; color:#929292; width:100%;}
|
||||
|
||||
.form-signin .checkbox {padding:0; display:block; margin-bottom:0; display:table; width:100%;}
|
||||
.form-signin .checkbox.first {margin-bottom:20px; margin-top:30px;}
|
||||
.form-signin .checkbox input[type=checkbox] {display:none;}
|
||||
.form-signin input[type=checkbox] {box-sizing:border-box; padding:0;}
|
||||
.form-signin .checkbox label {padding-left:25px; float:left; margin:0;}
|
||||
.form-signin .checkbox label:after, .form-signin .checkbox label:before {height:18px; width:18px; top:0; left:0; position:absolute; background:#fff;} /* bradley 수정 */
|
||||
.form-signin .checkbox label:after {content:''; background:#fff; border:1px solid #e6e6e6; border-radius:4px; -webkit-transition:.1s ease-in-out; transition:.1s ease-in-out;}
|
||||
.form-signin .checkbox label:before {content:''; border-radius:4px;}
|
||||
.form-signin .checkbox input:checked~label:before {background-color:#FFF; border:1px solid #e6e6e6;}
|
||||
.form-signin .checkbox input:checked~label:after {border-top-style:none; border-right-style:none; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); height:.6rem; width:1rem; border-color:#50c3ca; border-radius:0; border-width:2px; top:4px; left:4px;} /* bradley 수정 */
|
||||
.form-signin .checkbox a {}
|
||||
.form-signin .checkbox a svg {width:18px; height:18px; float:right; color:#a4acb5;}
|
||||
|
||||
.form-signin .btn-primary {font-weight:700; background:#00bbc5; margin-right:15px; padding-right:15px; text-shadow:none; color:#fff; display:inline-block; padding:6px 12px; height:40px; margin-bottom:0; font-size:14px; font-weight:400; line-height:1.42857143; text-align:center; white-space:nowrap; vertical-align:middle; -ms-touch-action:manipulation; touch-action:manipulation; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; background-image:none; border:1px solid transparent; border-radius:4px;}
|
||||
.form-signin .btn-primary:hover, .form-signin .btn-primary:focus {outline:none; background:#00adb7;}
|
||||
.copy {color:#929292; font-size:12px; margin-top:20px;}
|
||||
|
||||
.listBtn {overflow:hidden; display:inline-block; margin:auto; list-style:none; margin-top:20px; padding-inline-start:20px;}
|
||||
.listBtn li {float:left;}
|
||||
.listBtn li a {font-size:13px; color:#929292; cursor:pointer; text-decoration:none;}
|
||||
.listBtn li:before {content:'l'; color:#929292; font-size:10px; margin:0 12px;}
|
||||
.listBtn li:first-child:before {content:none;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*bradley 추가 시작*/
|
||||
.form-signin .btnBox {display:table; width:100%;}
|
||||
.form-signin .btnBox .btn-left {width:calc(50% - 5px); float:left; margin:0;}
|
||||
.form-signin .btnBox .btn-right {width:calc(50% - 5px); float:right; margin:0;}
|
||||
.form-signin .btnBox .btnGray {background:#8e949d; color:#fff;}
|
||||
.form-signin .btnBox .btnGray:hover {background:#878c95;}
|
||||
|
||||
/*bradley 추가 종료*/
|
||||
|
||||
/*반응형 View*/
|
||||
@media only screen and (max-width:1220px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:1024px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:768px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:596px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:414px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:375px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:360px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
}
|
||||
86
src/main/resources/static/css/admin/password2.css
Normal file
86
src/main/resources/static/css/admin/password2.css
Normal file
@@ -0,0 +1,86 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans KR';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Noto Sans KR Regular'), local('Noto Sans CJK KR Regular'),
|
||||
url(/font/admin/NotoSansKR-Regular.woff2) format('woff2'),
|
||||
url(/font/admin/NotoSansKR-Regular.woff) format('woff'),
|
||||
url(/font/admin/NotoSansKR-Regular.otf) format('opentype');
|
||||
}
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box; text-shadow:none;
|
||||
}
|
||||
|
||||
/* .box-sizing(@box-model) {
|
||||
-webkit-box-sizing: @box-model; //사파리 <= 5
|
||||
-moz-box-sizing: @box-model; //파이어폭스 <= 19
|
||||
box-sizing: @box-model;
|
||||
} */
|
||||
|
||||
|
||||
html,body {height:100%;}
|
||||
body {font-family: "Noto Sans KR", "나눔고딕", "Dotum", "돋움", "Arial", "AppleSDGothicNeo", sans-serif; padding:0; margin:0; font-size:13px;display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; padding-top:40px; padding-bottom:40px; background-color:#f5f5f5;}
|
||||
|
||||
.text-center {background:rgb(21,21,21); background:linear-gradient(180deg, rgba(21,21,21,1) 0%, rgba(0,147,155,1) 100%);}
|
||||
.text-center .form-signin {padding:50px 50px; background:#f5f7f7; border-radius:4px; max-width:400px; width:100%; margin:auto;}
|
||||
.text-center .form-signin svg {width:60px; height:60px;}
|
||||
.pageName {font-size:26px; margin:40px 20px; margin-top:0;}
|
||||
|
||||
.form-signin .checkbox {font-weight:400;}
|
||||
.form-signin .form-control:focus {z-index:2; border:1px solid #00bbc5;}
|
||||
.form-signin .form-control {margin-bottom:10px; height:36px; border:1px solid #dee2e6; display:block; width:100%; padding:0; padding-left:5px; background-color:#FFF; border-radius:0.267rem; box-shadow:none; font-size:13px; color:rgba(49, 58, 70, .8);}
|
||||
input[type=text]:focus {border:1px solid #00bbc5;}
|
||||
input[type=password]:focus {border:1px solid #00bbc5;}
|
||||
|
||||
.form-signin .btn-primary {font-weight:400; line-height:36px; margin:0; margin-left:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; font-size:13px; float:right; background:#377ec1; color:#fff;}
|
||||
.form-signin .btn-primary:hover, .form-signin .btn-primary:focus {outline:none; background:#377ec1;}
|
||||
.copy {color:#929292; font-size:12px; margin-top:30px; margin-bottom:0;}
|
||||
|
||||
.listBtn {overflow:hidden; display:inline-block; margin:auto; list-style:none; margin-top:20px; padding-inline-start:20px;}
|
||||
.listBtn li {float:left;}
|
||||
.listBtn li a {font-size:13px; color:#929292; cursor:pointer; text-decoration:none;}
|
||||
.listBtn li:before {content:'l'; color:#929292; font-size:10px; margin:0 12px;}
|
||||
.listBtn li:first-child:before {content:none;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*bradley 추가 시작*/
|
||||
.form-signin .btnBox {display:table; width:100%;}
|
||||
.form-signin .btnBox .btn-left {width:calc(50% - 3px); float:left; margin:0;}
|
||||
.form-signin .btnBox .btn-right {width:calc(50% - 3px); float:right; margin:0;}
|
||||
.form-signin .btnBox .btnGray {background:#8e949d; color:#fff;}
|
||||
.form-signin .btnBox .btnGray:hover {background:#878c95;}
|
||||
|
||||
/*bradley 추가 종료*/
|
||||
|
||||
/*반응형 View*/
|
||||
@media only screen and (max-width:1220px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:1024px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:768px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:596px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:414px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:375px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:360px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
}
|
||||
97
src/main/resources/static/css/admin/passwordUpdate.css
Normal file
97
src/main/resources/static/css/admin/passwordUpdate.css
Normal file
@@ -0,0 +1,97 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans KR';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Noto Sans KR Regular'), local('Noto Sans CJK KR Regular'),
|
||||
url(/font/admin/NotoSansKR-Regular.woff2) format('woff2'),
|
||||
url(/font/admin/NotoSansKR-Regular.woff) format('woff'),
|
||||
url(/font/admin/NotoSansKR-Regular.otf) format('opentype');
|
||||
}
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box; text-shadow:none;
|
||||
}
|
||||
|
||||
/* .box-sizing(@box-model) {
|
||||
-webkit-box-sizing: @box-model; //사파리 <= 5
|
||||
-moz-box-sizing: @box-model; //파이어폭스 <= 19
|
||||
box-sizing: @box-model;
|
||||
} */
|
||||
|
||||
|
||||
html,body {height:100%;}
|
||||
body {font-family: "Noto Sans KR", "나눔고딕", "Dotum", "돋움", "Arial", "AppleSDGothicNeo", sans-serif; padding:0; margin:0; font-size:13px;display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; padding-top:40px; padding-bottom:40px; background-color:#f5f5f5;}
|
||||
|
||||
.text-center {background:rgb(21,21,21); background:linear-gradient(180deg, rgba(21,21,21,1) 0%, rgba(0,147,155,1) 100%);}
|
||||
.text-center .form-signin {padding:50px 50px; background:#f5f7f7; border-radius:4px; max-width:600px; width:100%; margin:auto;}
|
||||
.text-center .form-signin svg {width:60px; height:60px;}
|
||||
.pageName {font-size:26px; margin:40px 20px; margin-top:0;}
|
||||
.pageTxt {font-size:14px; margin:40px 20px; margin-top:0; word-break:keep-all; text-align:left; border:1px solid #dee2e6; padding:10px; color:rgba(49, 58, 70, .8);}
|
||||
.scroll {overflow-y:scroll; margin-bottom:30px; padding:0 20px;}
|
||||
div.inputBox {margin-bottom:10px;}
|
||||
|
||||
.form-signin label {text-align:left; display:block; position:unset; width:unset; height:unset; margin:0; margin-bottom: 2px;}
|
||||
.scroll::-webkit-scrollbar {width:6px; height:6px;}
|
||||
.scroll::-webkit-scrollbar-thumb {border-radius:8px; background-color:#00bbc5;}
|
||||
.scroll::-webkit-scrollbar-corner {background:#151515;}
|
||||
.form-signin .form-control:focus {z-index:2; border:1px solid #00bbc5; outline:none;}
|
||||
.form-signin .form-control {height:36px; border:1px solid #dee2e6; display:block; width:100%; padding:0; padding-left:5px; background-color:#FFF; border-radius:0.267rem; box-shadow:none; font-size:13px; color:rgba(49, 58, 70, .8);}
|
||||
.form-signin .form-control.number, .form-signin .form-control.address1 {margin-bottom:5px;}
|
||||
.form-signin .form-control.Last {margin-bottom:10px;}
|
||||
.form-signin .form-control.disabled{background:#dee2e6;}
|
||||
input[type=text]:focus {border:1px solid #00bbc5;}
|
||||
input[type=password]:focus {border:1px solid #00bbc5;}
|
||||
|
||||
.comment {margin:0; margin-bottom:10px; text-align:left; font-size:12px; opacity:.6;}
|
||||
|
||||
|
||||
.form-signin .btn-primary {font-weight:400; line-height:36px; margin:0; margin-left:6px; text-shadow:none; border:none; padding:0 5px; border-radius:0.267rem; box-shadow:none; font-size:13px; float:right; background:#377ec1; color:#fff;}
|
||||
.form-signin .btn-primary:hover, .form-signin .btn-primary:focus {outline:none; background:#377ec1;}
|
||||
.copy {color:#929292; font-size:12px; margin-top:30px; margin-bottom:0;}
|
||||
|
||||
.listBtn {overflow:hidden; display:inline-block; margin:auto; list-style:none; margin-top:20px; padding-inline-start:20px;}
|
||||
.listBtn li {float:left;}
|
||||
.listBtn li a {font-size:13px; color:#929292; cursor:pointer; text-decoration:none;}
|
||||
.listBtn li:before {content:'l'; color:#929292; font-size:10px; margin:0 12px;}
|
||||
.listBtn li:first-child:before {content:none;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*bradley 추가 시작*/
|
||||
.form-signin .btnBox {display:table; width:calc(100% - 40px); margin:0 auto;}
|
||||
.form-signin .btnBox .btn-left {width:calc(50% - 3px); float:left; margin:0;}
|
||||
.form-signin .btnBox .btn-right {width:calc(50% - 3px); float:right; margin:0;}
|
||||
.form-signin .btnBox .btnGray {background:#8e949d; color:#fff;}
|
||||
.form-signin .btnBox .btnGray:hover {background:#878c95;}
|
||||
|
||||
/*bradley 추가 종료*/
|
||||
|
||||
/*반응형 View*/
|
||||
@media only screen and (max-width:1220px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:1024px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:768px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:596px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:414px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:375px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:360px) {
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
}
|
||||
38
src/main/resources/static/css/admin/pricacy.css
Normal file
38
src/main/resources/static/css/admin/pricacy.css
Normal file
@@ -0,0 +1,38 @@
|
||||
body {background:#fff;}
|
||||
.title {font-size:30px; color:#212529; font-weight:700; margin:0; line-height:40px; padding:10px 10px 0;}
|
||||
textarea {width:100%; height:calc(100vh - 55px); border:none; color:#212529; padding:10px; font-size:16px; resize:none;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*반응형 View*/
|
||||
@media only screen and (max-width: 1440px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1220px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1024px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 540px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 414px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 375px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 360px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 320px){
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 280px){
|
||||
}
|
||||
3816
src/main/resources/static/css/index/xeicon.css
Normal file
3816
src/main/resources/static/css/index/xeicon.css
Normal file
File diff suppressed because it is too large
Load Diff
2
src/main/resources/static/css/normalize.min.css
vendored
Normal file
2
src/main/resources/static/css/normalize.min.css
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
|
||||
/*# sourceMappingURL=normalize.min.css.map */
|
||||
114
src/main/resources/static/css/web/accept/webAccept.css
Normal file
114
src/main/resources/static/css/web/accept/webAccept.css
Normal file
@@ -0,0 +1,114 @@
|
||||
/* 메이드유의원 개인정보처리방침 스타일 */
|
||||
|
||||
body {
|
||||
background: #f7f8fa;
|
||||
}
|
||||
|
||||
main {
|
||||
max-width: 1280px;
|
||||
margin: 40px auto 60px auto;
|
||||
background: #fff;
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 4px 24px rgba(0,0,0,0.07);
|
||||
padding: 48px 56px 56px 56px;
|
||||
font-family: 'Noto Sans KR', 'Apple SD Gothic Neo', Arial, sans-serif;
|
||||
color: #222;
|
||||
line-height: 1.8;
|
||||
font-size: 1.08rem;
|
||||
}
|
||||
|
||||
.privacy-policy header {
|
||||
margin-bottom: 2.5em;
|
||||
}
|
||||
|
||||
main h2, main h3, main h4 {
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
margin-top: 2.5em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
main h2 {
|
||||
font-size: 2rem;
|
||||
border-bottom: 2px solid #e5e7eb;
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
|
||||
main h3 {
|
||||
font-size: 1.3rem;
|
||||
border-left: 4px solid #4f8cff;
|
||||
padding-left: 0.7em;
|
||||
background: #f3f6fa;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
main h4 {
|
||||
font-size: 1.1rem;
|
||||
color: #4f8cff;
|
||||
}
|
||||
|
||||
main ul, main ol {
|
||||
margin-left: 1.5em;
|
||||
margin-bottom: 1.5em;
|
||||
}
|
||||
|
||||
main li {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
main strong {
|
||||
color: #2d5be3;
|
||||
}
|
||||
|
||||
main hr {
|
||||
border: none;
|
||||
border-top: 1px solid #e5e7eb;
|
||||
margin: 2.5em 0;
|
||||
}
|
||||
|
||||
main a {
|
||||
color: #2d5be3;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.info-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 1.5em 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.info-table th, .info-table td {
|
||||
border: 1px solid #e5e7eb;
|
||||
padding: 0.7em 1em;
|
||||
text-align: left;
|
||||
}
|
||||
.info-table th {
|
||||
background: #f3f6fa;
|
||||
color: #2d5be3;
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
.project_wrap section:not(.main_img) {
|
||||
padding-top: 0px;
|
||||
}
|
||||
|
||||
@media (max-width: 1400px) {
|
||||
main {
|
||||
max-width: 98vw;
|
||||
padding: 32px 16px 40px 16px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
main {
|
||||
max-width: 100vw;
|
||||
padding: 16px 4vw 24px 4vw;
|
||||
font-size: 0.98rem;
|
||||
}
|
||||
main h2 {
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
main h3 {
|
||||
font-size: 1.08rem;
|
||||
}
|
||||
}
|
||||
1
src/main/resources/static/css/web/aos.css
Normal file
1
src/main/resources/static/css/web/aos.css
Normal file
File diff suppressed because one or more lines are too long
191
src/main/resources/static/css/web/common.css
Normal file
191
src/main/resources/static/css/web/common.css
Normal file
@@ -0,0 +1,191 @@
|
||||
* {
|
||||
box-sizing:border-box;
|
||||
margin:0;
|
||||
padding:0;
|
||||
color:#1a1a1a;
|
||||
}
|
||||
|
||||
body, h1, h2, h3, h4, h5 { font-family:"Pretendard", sans-serif; margin:0; }
|
||||
a { cursor:pointer; color:#1a1a1a; text-decoration:none; }
|
||||
a:hover, a:active, a:focus { text-decoration:none; }
|
||||
|
||||
p { margin:0; }
|
||||
dl, dt, dd, ul, ol, li { list-style:none; margin:0; }
|
||||
img { border:none; vertical-align:top; }
|
||||
|
||||
input[type="text"], input[type="password"], input[type="tel"] { padding: 0 5px; }
|
||||
input[type="button"], input[type="submit"], button { cursor:pointer; -webkit-appearance:none; }
|
||||
input:focus, button:focus, textarea { outline:none; }
|
||||
|
||||
em, address { font-style:normal; }
|
||||
legend, caption { position:absolute; top:0; left:0; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0; }
|
||||
textarea { overflow:auto; resize:none; border:1px solid #dadbdc; border-radius:5px; }
|
||||
table { width:100%; border-collapse:collapse; border-spacing:0; }
|
||||
|
||||
/* Placeholder styles */
|
||||
::-webkit-input-placeholder { color:#999; }
|
||||
::-moz-placeholder { color:#999; }
|
||||
:-ms-input-placeholder { color:#999; }
|
||||
input:-moz-placeholder { color:#999; }
|
||||
|
||||
/* Layout */
|
||||
.elp { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
|
||||
.mlp { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
|
||||
|
||||
/* 서브페이지 */
|
||||
/* ========================================
|
||||
MAIN CONTENT CSS
|
||||
======================================== */
|
||||
.petit_center{width:100px;}
|
||||
.petit_center img{width:100px;}
|
||||
|
||||
/****************************************
|
||||
* 서브페이지 공통 css
|
||||
*****************************************/
|
||||
.project_wrap .same { display:flex; }
|
||||
.project_wrap .same section:not(.main_img) { padding-bottom:150px; }
|
||||
|
||||
/********** aside **********/
|
||||
.project_wrap .same aside { width:500px; background:url('/image/web/aside.jpg')repeat-y; }
|
||||
.project_wrap .same aside ul { position:fixed; top:180px; left:310px; }
|
||||
.project_wrap .same aside ul li { margin-top:20px; }
|
||||
.project_wrap .same aside ul li.first { margin-top:0; }
|
||||
.project_wrap .same aside ul li a { width:100%; height:50px; line-height:50px; font-size:18px; font-weight:300; color:#6D5E50; display:inline-block; }
|
||||
.project_wrap .same aside ul li a.active { font-weight:700; }
|
||||
|
||||
/********** main **********/
|
||||
.project_wrap .same main { width:calc(100% - 500px); }
|
||||
.project_wrap .same main .inner_wrap { width:90%; }
|
||||
.project_wrap .same main section h3 { font-size:34px; font-weight:300; text-align:center; }
|
||||
.project_wrap .same main section h3 span { font-weight:700; }
|
||||
|
||||
/* main_img */
|
||||
.project_wrap .same main .main_img { position:relative; }
|
||||
.project_wrap .same main .main_img img { width:100%; }
|
||||
.project_wrap .same main .main_img .text_box { width:100%; position:absolute; bottom:0; left:0; display:flex; }
|
||||
.project_wrap .same main .main_img .text_box p { margin-top:10px; color:#fff; }
|
||||
.project_wrap .same main .main_img .text_box p.sub_title { font-size:23px; }
|
||||
.project_wrap .same main .main_img .text_box p.sub_title span { font-weight:600; }
|
||||
.project_wrap .same main .main_img .text_box p.title { font-size:52px; font-weight:700; }
|
||||
.project_wrap .same main .main_img .text_box p.sub_text { font-size:15px; }
|
||||
.project_wrap .same main .main_img .text_box > div { padding:80px 50px; }
|
||||
.project_wrap .same main .main_img .text_box p span.black { color:black; }
|
||||
|
||||
/* content1 */
|
||||
.project_wrap .same main .content1 { background:#FAFAFA; }
|
||||
.project_wrap .same main .content1 .title { font-size:34px; font-weight:700; }
|
||||
.project_wrap .same main .content1 .sub_title { margin-top:50px; font-size:28px; font-weight:600; }
|
||||
.project_wrap .same main .content1 .sub_text { margin-top:10px; font-size:20px; word-break:keep-all; }
|
||||
|
||||
/* content2 */
|
||||
.project_wrap .same main .content2 ul { margin-top:80px; display:flex; justify-content:center; }
|
||||
.project_wrap .same main .content2 ul li { width:240px; height:240px; border-radius:50%; border:1px solid #000; margin-left:30px; display:flex; align-items:center; justify-content:center; }
|
||||
.project_wrap .same main .content2 ul li p { font-size:25px; text-align:center; }
|
||||
.project_wrap .same main .content2 ul li:first-child { margin-left:0; }
|
||||
.project_wrap .same main .content2 ul li:nth-child(odd) { background:#000; }
|
||||
.project_wrap .same main .content2 ul li:nth-child(odd) p { color:#fff; }
|
||||
|
||||
/* content3 */
|
||||
.project_wrap .same main .content3 { background:#F6F6F6; }
|
||||
.project_wrap .same main ul.box_list { margin-top:80px; }
|
||||
.project_wrap .same main ul.box_list li { padding:20px 0; margin-top:20px; border-radius:10px; border:2px solid #e6e6e6; display:flex; align-items:center; position:relative; background:#fff; }
|
||||
.project_wrap .same main ul.box_list li::after { content:''; display:block; width:2px; height:100%; background:#e6e6e6; position:absolute; top:0; left:80px; }
|
||||
.project_wrap .same main ul.box_list li div { width:80px; height:100%; position:relative; }
|
||||
.project_wrap .same main ul.box_list li div img { width:30px; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
|
||||
.project_wrap .same main ul.box_list li p { padding-left:20px; font-size:24px; word-break:keep-all; }
|
||||
.project_wrap .same main ul.box_list li p span { font-weight:700; }
|
||||
|
||||
/* content4 */
|
||||
.project_wrap .same main .content4 { padding-bottom:0; }
|
||||
.project_wrap .same main .content4 ul.box_list li div img { width:50px; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
|
||||
|
||||
/* content4_1 */
|
||||
.project_wrap .same main .content4_1 { padding-bottom:0; }
|
||||
.project_wrap .same main .content4_1 ul.box_list li div img { width:50px; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
|
||||
|
||||
/* content5 */
|
||||
.project_wrap .same main .content5 ul.box_list li p { line-height:45px; }
|
||||
.project_wrap .same main .content5 ul.box_list li div img { width:50px; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
|
||||
|
||||
/* content6 */
|
||||
.project_wrap .same main .content6 { padding-bottom:0; }
|
||||
.project_wrap .same main .img_cont { padding-top:30px; margin-top:120px; }
|
||||
.project_wrap .same main .img_cont .inner_wrap > p { font-size:34px; }
|
||||
.project_wrap .same main .img_cont .inner_wrap > p span { font-weight:700; }
|
||||
.project_wrap .same main .img_cont ul { margin-top:80px; display:flex; justify-content:center; flex-wrap:wrap; }
|
||||
.project_wrap .same main .img_cont ul li { width:530px; margin-left:20px; padding:50px; border-radius:30px; box-shadow:0 1px 5px #ddd; text-align:center; }
|
||||
.project_wrap .same main .img_cont ul li:nth-child(odd) { margin-left:0; }
|
||||
.project_wrap .same main .img_cont ul li:nth-child(n+3) { margin-top:20px; }
|
||||
.project_wrap .same main .img_cont ul li .text_box { margin-top:50px; }
|
||||
.project_wrap .same main .img_cont ul li .text_box p { text-align:center; }
|
||||
.project_wrap .same main .img_cont ul li .text_box p.sub_title { font-size:23px; color:#E74455; }
|
||||
.project_wrap .same main .img_cont ul li .text_box p.title { margin-top:10px; font-size:42px; font-weight:700; }
|
||||
.project_wrap .same main .img_cont ul li .text_box p.sub_text { margin-top:30px; font-size:29px; }
|
||||
|
||||
/* Main Content 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
.petit_center{display:none;}
|
||||
.project_wrap section:not(.main_img) { padding-top:50px; }
|
||||
|
||||
/****************************************
|
||||
* 서브페이지 공통 css
|
||||
*****************************************/
|
||||
.project_wrap .same aside { display:none; }
|
||||
.project_wrap .same main { width:100%; }
|
||||
.project_wrap .same section:not(.main_img) { padding-top:50px; }
|
||||
.project_wrap .same section:not(.main_img) { padding-bottom:50px; }
|
||||
.project_wrap .same main section h3 { font-size:14px; }
|
||||
|
||||
/* main_img */
|
||||
.project_wrap .same main .main_img .text_box { justify-content:center; text-align:center; bottom:40px; }
|
||||
.project_wrap .same main .main_img .text_box p { margin-top:5px; }
|
||||
.project_wrap .same main .main_img .text_box > div { padding:0; }
|
||||
.project_wrap .same main .main_img .text_box p.sub_title { font-size:12px; }
|
||||
.project_wrap .same main .main_img .text_box p.title { font-size:26px; }
|
||||
.project_wrap .same main .main_img .text_box p.sub_text { font-size:12px; }
|
||||
|
||||
/* content1 */
|
||||
.project_wrap .same main .content1 .title { font-size:22px; text-align:center; }
|
||||
.project_wrap .same main .content1 .sub_title { margin-top:10px; font-size:16px; text-align:center; }
|
||||
.project_wrap .same main .content1 .sub_text { margin-top:5px; font-size:14px; text-align:center; }
|
||||
.project_wrap .same main .content1 .sub_text br { display:none; }
|
||||
|
||||
/* content2 */
|
||||
.project_wrap .same main .content2 ul { margin-top:40px; flex-wrap:wrap; }
|
||||
.project_wrap .same main .content2 ul li { width:150px; height:150px; margin-left:10px; }
|
||||
.project_wrap .same main .content2 ul li:nth-child(odd) { margin-left:0; }
|
||||
.project_wrap .same main .content2 ul li:nth-child(n+3) { margin-top:10px; }
|
||||
.project_wrap .same main .content2 ul li:nth-child(3) { margin-left:10px; order:3; }
|
||||
.project_wrap .same main .content2 ul li:nth-child(4) { margin-left:0; }
|
||||
.project_wrap .same main .content2 ul li p { font-size:16px; }
|
||||
.project_wrap .same main .content4 { padding-bottom:0; }
|
||||
.project_wrap .same main .content4_1 { padding-bottom:0; }
|
||||
.project_wrap .same main .content6 { padding-bottom:0; }
|
||||
|
||||
/* box_list */
|
||||
.project_wrap .same main ul.box_list { margin-top:40px; }
|
||||
.project_wrap .same main ul.box_list li { padding:10px 5px; margin-top:10px; border:1px solid #e6e6e6 }
|
||||
.project_wrap .same main ul.box_list li::after { display:none; }
|
||||
.project_wrap .same main ul.box_list li p { padding-left:10px; font-size:14px; }
|
||||
.project_wrap .same main ul.box_list li div { width:auto; }
|
||||
.project_wrap .same main ul.box_list li div img { width:20px; position:static; transform:none; }
|
||||
.project_wrap .same main .content4 ul.box_list li div img { width:20px; position:static; transform:none; }
|
||||
.project_wrap .same main .content4_1 ul.box_list li div img { width:20px; position:static; transform:none; }
|
||||
.project_wrap .same main .content5 ul.box_list li div img { width:20px; position:static; transform:none; }
|
||||
.project_wrap .same main .content5 ul.box_list li p { line-height:22px; word-break:keep-all; }
|
||||
|
||||
/* img_cont */
|
||||
.project_wrap .same main .img_cont{ margin-top:0; padding-top:50px; }
|
||||
.project_wrap .same main .img_cont .inner_wrap > p { font-size:14px; text-align:center; }
|
||||
.project_wrap .same main .img_cont ul { margin-top:40px; }
|
||||
.project_wrap .same main .img_cont ul li { width:calc((100% - 10px) / 2); padding:15px; margin-left:10px; border-radius:10px; }
|
||||
.project_wrap .same main .img_cont ul li:nth-child(n+3) { margin-top:10px; }
|
||||
.project_wrap .same main .img_cont ul li img { width:100%; }
|
||||
.project_wrap .same main .img_cont ul li .text_box { margin-top:15px; }
|
||||
.project_wrap .same main .img_cont ul li .text_box p.sub_title { font-size:12px; line-height:13px; }
|
||||
.project_wrap .same main .img_cont ul li .text_box p.title { margin-top:5px; font-size:18px; }
|
||||
.project_wrap .same main .img_cont ul li .text_box p.sub_text { margin-top:5px; font-size:12px; word-break:keep-all; }
|
||||
.project_wrap .same main .img_cont ul li .text_box p.sub_text br { display:none; }
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
/* main_img */
|
||||
.project_wrap .same main .main_img .text_box > div { width:50%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p { font-size:52px; color:#000; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p span { font-weight:700; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p { color:#fff; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#fff; }
|
||||
/* content5 */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* main_img */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
.project_wrap .same main .main_img .text_box > div { width:100%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p br { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#000; }
|
||||
}
|
||||
11
src/main/resources/static/css/web/diet/dietLaserSelect.css
Normal file
11
src/main/resources/static/css/web/diet/dietLaserSelect.css
Normal file
@@ -0,0 +1,11 @@
|
||||
/* main_img */
|
||||
.project_wrap .same main #ulfit .main_img .text_box { top:0; }
|
||||
.project_wrap .same main .main_img .text_box p { color:#000; }
|
||||
.project_wrap .same main #tunebody .main_img .text_box > div { padding-bottom:50px; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
.project_wrap .same main #ulfit .main_img .text_box { top:auto; bottom:30px; }
|
||||
.project_wrap .same main #tunebody .main_img .text_box { text-align:left; justify-content:flex-start; bottom:20px; left:0; }
|
||||
.project_wrap .same main #tunebody .main_img .text_box > div { padding-bottom:0; padding-left:20px; }
|
||||
}
|
||||
97
src/main/resources/static/css/web/font.css
Normal file
97
src/main/resources/static/css/web/font.css
Normal file
@@ -0,0 +1,97 @@
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Black'), url(/font/web/Pretendard-Black.woff2) format('woff2'), url(/font/web/Pretendard-Black.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 800;
|
||||
font-display: swap;
|
||||
src: local('Pretendard ExtraBold'), url(/font/web/Pretendard-ExtraBold.woff2) format('woff2'), url(/font/web/Pretendard-ExtraBold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Bold'), url(/font/web/Pretendard-Bold.woff2) format('woff2'), url(/font/web/Pretendard-Bold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 600;
|
||||
font-display: swap;
|
||||
src: local('Pretendard SemiBold'), url(/font/web/Pretendard-SemiBold.woff2) format('woff2'), url(/font/web/Pretendard-SemiBold.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Medium'), url(/font/web/Pretendard-Medium.woff2) format('woff2'), url(/font/web/Pretendard-Medium.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Regular'), url(/font/web/Pretendard-Regular.woff2) format('woff2'), url(/font/web/Pretendard-Regular.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Light'), url(/font/web/Pretendard-Light.woff2) format('woff2'), url(/font/web/Pretendard-Light.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 200;
|
||||
font-display: swap;
|
||||
src: local('Pretendard ExtraLight'), url(/font/web/Pretendard-ExtraLight.woff2) format('woff2'), url(/font/web/Pretendard-ExtraLight.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Pretendard';
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: local('Pretendard Thin'), url(/font/web/Pretendard-Thin.woff2) format('woff2'), url(/font/web/Pretendard-Thin.woff) format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Jua';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
src: url(/font/web/Jua-Regular.ttf) format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Cafe24Classictype';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
src: url(/font/web/Cafe24Classictype-v1.1.otf) format('opentype'), url(/font/web/Cafe24Classictype-v1.1.ttf) format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'GyeonggiCheonnyeon';
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
src: url(/font/web/경기천년제목OTF_Light.otf) format('opentype'), url(/font/web/경기천년제목_Light.ttf) format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'GyeonggiCheonnyeon';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
src: url(/font/web/경기천년제목OTF_Bold.otf) format('opentype'), url(/font/web/경기천년제목_Bold.ttf) format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Jalnan';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
src: url(/font/web/Jalnan2.otf) format('opentype'), url(/font/web/Jalnan2.ttf) format('truetype');
|
||||
}
|
||||
80
src/main/resources/static/css/web/footer.css
Normal file
80
src/main/resources/static/css/web/footer.css
Normal file
@@ -0,0 +1,80 @@
|
||||
/* ========================================
|
||||
FOOTER CSS
|
||||
======================================== */
|
||||
/* footer */
|
||||
.project_wrap footer {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
min-height: 200px;
|
||||
background-color: #222222;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.project_wrap footer .inner_wrap {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
max-width: 1280px;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.project_wrap footer .inner_wrap .text_box ul {
|
||||
padding-top: 20px;
|
||||
margin-top: 20px;
|
||||
border-top: 1px solid #fff;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.project_wrap footer .inner_wrap .text_box ul li {
|
||||
font-size: 16px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.project_wrap footer .inner_wrap .text_box a {
|
||||
float: right;
|
||||
color: white;
|
||||
margin-right: 1%;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Footer 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* footer */
|
||||
.project_wrap footer {
|
||||
height: 120px;
|
||||
background-color: #222222;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.project_wrap footer .fLogo {
|
||||
width: 70px;
|
||||
}
|
||||
|
||||
.project_wrap footer .inner_wrap {
|
||||
top: 50%;
|
||||
left: 5%;
|
||||
transform: translateY(-50%);
|
||||
width: 90%;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.project_wrap footer .inner_wrap .text_box ul {
|
||||
padding-top: 5px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.project_wrap footer .inner_wrap .text_box ul li {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.project_wrap footer .inner_wrap .text_box a {
|
||||
font-size: 10px;
|
||||
float: right;
|
||||
color: white;
|
||||
margin-right: 1%;
|
||||
}
|
||||
}
|
||||
228
src/main/resources/static/css/web/header.css
Normal file
228
src/main/resources/static/css/web/header.css
Normal file
@@ -0,0 +1,228 @@
|
||||
/* ========================================
|
||||
HEADER CSS
|
||||
======================================== */
|
||||
|
||||
html { scroll-behavior:smooth; }
|
||||
|
||||
.inner_wrap { width:1280px; margin:0 auto; }
|
||||
|
||||
.mb { display:none; }
|
||||
|
||||
.project_wrap header nav ul.depth1 li a.open { font-weight:700; }
|
||||
|
||||
/* header */
|
||||
|
||||
.project_wrap header { height:85px; position:relative; }
|
||||
|
||||
.project_wrap header .inner_wrap { height:100%; display:flex; align-items:center; justify-content:space-between; }
|
||||
|
||||
.project_wrap header nav { height:100%; }
|
||||
|
||||
.project_wrap header nav ul { display:flex; height:100%; }
|
||||
|
||||
.project_wrap header nav ul.depth1 > li { width:fit-content; line-height:85px; text-align:right; margin-left:30px; position:relative; }
|
||||
|
||||
.project_wrap header nav ul.depth1 li a { display:block; width:100%; height:100%; font-size:17px; color:#6D5E50; }
|
||||
|
||||
.project_wrap header nav ul.depth1 li a.active { font-weight:700; }
|
||||
|
||||
/* 1depth 메뉴 hover 밑줄 효과 - PC만 */
|
||||
@media only screen and (min-width:769px) {
|
||||
.project_wrap header nav ul.depth1 > li > a {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 > li > a::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
top: 60px; /* 1depth 밑줄 위치 */
|
||||
left: 0;
|
||||
background-color: #C60B24;
|
||||
transform: scaleX(0);
|
||||
transform-origin: left;
|
||||
transition: transform 0.3s ease-out;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 > li > a:hover::after {
|
||||
transform: scaleX(1);
|
||||
}
|
||||
}
|
||||
|
||||
/* 세로형 드롭다운 메뉴 - 타이트한 박스, 보더 제거 */
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 {
|
||||
width: 160px;
|
||||
height: auto;
|
||||
padding: 8px 0;
|
||||
position: absolute;
|
||||
top: 85px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: #ffffff;
|
||||
z-index: 5;
|
||||
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
display:none;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2.active { display:block; }
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li {
|
||||
width: 100%;
|
||||
line-height: 36px;
|
||||
margin-left: 0;
|
||||
border-bottom: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li:first-child {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li:nth-child(2) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li a {
|
||||
padding: 0 8px;
|
||||
display: block;
|
||||
color: #6D5E50;
|
||||
transition: all 0.3s ease;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
font-size: 15px;
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
margin: 1px 4px;
|
||||
position: relative; /* 2depth 밑줄 효과를 위해 추가 */
|
||||
}
|
||||
|
||||
/* 2depth 메뉴 hover 밑줄 효과 - PC만 */
|
||||
@media only screen and (min-width:769px) {
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li a::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
bottom: -2px; /* 2depth 밑줄 위치 */
|
||||
left: 0;
|
||||
background-color: #C60B24;
|
||||
transform: scaleX(0);
|
||||
transform-origin: left;
|
||||
transition: transform 0.3s ease-out;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li a:hover::after {
|
||||
transform: scaleX(1);
|
||||
}
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li a:hover {
|
||||
font-weight: 700;
|
||||
background: #f8f8f8;
|
||||
color: #333;
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
/* 마지막 메뉴의 경우 화면을 벗어나지 않도록 조정 */
|
||||
.project_wrap header nav ul.depth1 li:last-child ul.depth2 {
|
||||
left: auto;
|
||||
right: 0;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
/* 첫번째 메뉴의 경우 화면을 벗어나지 않도록 조정 */
|
||||
.project_wrap header nav ul.depth1 li:first-child ul.depth2 {
|
||||
left: 0;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
/* Header 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
|
||||
.inner_wrap { width:90%; }
|
||||
|
||||
.mb { display:block; }
|
||||
|
||||
.pc { display:none; }
|
||||
|
||||
/* header */
|
||||
|
||||
.project_wrap header { height:60px; }
|
||||
|
||||
.project_wrap header .inner_wrap { justify-content:center; }
|
||||
|
||||
.project_wrap header .mbmenu { width:24px; height:24px; border:0; position:absolute; top:50%; left:5%; transform:translateY(-50%); background:url('/image/web/menu.svg')no-repeat 0 0; background-size:48px; }
|
||||
|
||||
.project_wrap header .mbmenu.active { background-position:-24px 0; }
|
||||
|
||||
.project_wrap header .logo img { width:100px; }
|
||||
|
||||
.project_wrap header nav.active { display:block; }
|
||||
|
||||
.project_wrap header nav { width:100%; height:calc(100vh - 60px); position:absolute; top:60px; left:0; z-index:5; display:none; }
|
||||
|
||||
.project_wrap header nav ul { height:auto; flex-direction:column; background:#fff; }
|
||||
|
||||
.project_wrap header nav ul.depth1 > li { width:100%; line-height:60px; text-align:left; border-bottom:1px solid #e3e3e3; margin:0;}
|
||||
|
||||
.project_wrap header nav ul.depth1 li a {
|
||||
padding-left:20px;
|
||||
position:relative;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li a.mmenu::after { content:''; display:block; width:20px; height:20px; position:absolute; top:50%; right:20px; transform:translateY(-50%) rotate(90deg); background:url('/image/web/arrow.svg')no-repeat; background-size:20px; }
|
||||
|
||||
.project_wrap header nav ul.depth1 li a.mmenu.active::after { transform:translateY(-50%) rotate(-90deg); }
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 {
|
||||
width:100%;
|
||||
height:auto;
|
||||
position:static;
|
||||
background:none;
|
||||
box-shadow:none;
|
||||
border:none;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
transform: none;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2.active { display:block; }
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li:first-child { display:none; }
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li {
|
||||
margin-left:0;
|
||||
line-height:50px;
|
||||
border-top:1px solid #eee;
|
||||
border-bottom:none;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li a {
|
||||
padding-left:40px;
|
||||
height:50px;
|
||||
line-height:50px;
|
||||
text-align: left;
|
||||
border-radius: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.project_wrap header nav ul.depth1 li ul.depth2 li a:hover {
|
||||
color:#fff;
|
||||
background:#000;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
}
|
||||
264
src/main/resources/static/css/web/index.css
Normal file
264
src/main/resources/static/css/web/index.css
Normal file
@@ -0,0 +1,264 @@
|
||||
/* banner */
|
||||
.project_wrap main .banner { padding-top:0; }
|
||||
.project_wrap main .banner .main_banner_pagination { width:1280px; margin-left:calc((100% - 1280px) / 2); bottom:60px; display:flex; }
|
||||
.project_wrap main .sub_banner .sub_banner_swiper .sub_banner_pagination { width:490px; margin-left:calc((100% - 1280px) / 2); bottom:60px; display:flex; }
|
||||
.project_wrap main .banner .swiper-pagination-bullet { height:3px; margin:0; border-radius:0; background:#000; opacity:1; }
|
||||
.project_wrap main .banner .swiper-pagination-bullet-active { background:#fff; }
|
||||
.project_wrap main .banner .swiper-wrapper .swiper-slide { position:relative; }
|
||||
.project_wrap main .banner .swiper-wrapper .swiper-slide img { cursor:pointer; width:100%;}
|
||||
.project_wrap main .banner .swiper-wrapper .swiper-slide .detail_btn { font-size:17px; font-weight:700; border:0; position:absolute; bottom:120px; left:calc((100% - 1280px) / 2); background:none; }
|
||||
/* cont */
|
||||
|
||||
.project_wrap main section:not(.banner) h3 { font-size:34px; line-height:40px; }
|
||||
.project_wrap main section:not(.banner) h3 span { font-weight:700; }
|
||||
.project_wrap main .cont .swiper { margin-top:60px; }
|
||||
.swiper-area{
|
||||
max-width:1280px;
|
||||
margin:0 auto;
|
||||
padding:45px 0;
|
||||
}
|
||||
.project_wrap main .cont .swiper-pagination {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
height: 70px;
|
||||
top: 0;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.project_wrap main .cont .swiper-pagination-bullet {
|
||||
width: auto;
|
||||
min-width: 40px;
|
||||
flex: 1 1 0;
|
||||
height: 3px;
|
||||
border-radius: 0;
|
||||
margin: 0 2px;
|
||||
background: #c3c3c3;
|
||||
opacity: 1;
|
||||
transition: width 0.2s;
|
||||
display: inline-block;
|
||||
}
|
||||
.project_wrap main .cont .swiper-pagination-bullet-active { background:#000; }
|
||||
.project_wrap main .cont .swiper-pagination-bullet span { width:100%; padding-top:15px; font-size:19px; color:#c3c3c3; display:inline-block; }
|
||||
.project_wrap main .cont .swiper-pagination-bullet-active span { font-weight:700; color:#000; }
|
||||
|
||||
.project_wrap main .cont .cont1_swiper .swiper-pagination-bullet {background: #fff;}
|
||||
.project_wrap main .cont .cont1_swiper .swiper-pagination-bullet-active { background:#ffcccc; }
|
||||
.project_wrap main .cont .cont1_swiper .swiper-pagination-bullet span { color:#fff;}
|
||||
.project_wrap main .cont .cont1_swiper .swiper-pagination-bullet-active span {color:#ffcccc; }
|
||||
|
||||
.project_wrap main .cont .cont2_swiper .swiper-pagination-bullet {background: #000;}
|
||||
.project_wrap main .cont .cont2_swiper .swiper-pagination-bullet-active { background:#fff; }
|
||||
.project_wrap main .cont .cont2_swiper .swiper-pagination-bullet span { color:#000;}
|
||||
.project_wrap main .cont .cont2_swiper .swiper-pagination-bullet-active span {color:#fff; }
|
||||
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide { margin-top:80px; position:relative; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide img { width:1280px;}
|
||||
|
||||
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide .text_box { position:absolute; top:60%; left:60px; transform:translateY(-50%); }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide .text_box P.cont_tit { font-size:37px; font-weight:700; color:#000; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide .text_box P { margin-top:10px; font-size:17px; font-weight:700; color:#9A9A9A; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide .text_box button { margin-top:10px; border:0; font-size:17px; font-weight:700; color:#F77474; background:none; }
|
||||
/* instagram */
|
||||
.project_wrap main .instagram .instagram_top { display:flex; align-items:flex-end; }
|
||||
.project_wrap main .instagram .instagram_top .more_btn { margin-left:120px; border:0; font-size:19px; font-weight:700; line-height:30px; background:none; }
|
||||
.project_wrap main .instagram .instagram_btm { margin-top:60px; }
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide .image { height:0; padding-top:56.25%; position:relative; border-radius:12px; overflow:hidden; }
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide .image iframe { width:100%; height:100%; position:absolute; top:0; left:0; }
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide p.title { font-size:18px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; }
|
||||
/* instagram feed style - pretty & responsive */
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide {
|
||||
position: relative;
|
||||
border-radius: 16px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,0.08);
|
||||
background: #fff;
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
aspect-ratio: 1/1;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
border-radius: 16px 16px 0 0;
|
||||
aspect-ratio: 1/1;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide .caption {
|
||||
padding: 10px 12px;
|
||||
font-size: 0.95em;
|
||||
color: #333;
|
||||
background: #fff;
|
||||
min-height: 40px;
|
||||
border-top: 1px solid #eee;
|
||||
box-sizing: border-box;
|
||||
word-break: break-all;
|
||||
}
|
||||
.popup .nav.nav-tabs {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.popup .nav.nav-tabs li[role="presentation"] {
|
||||
flex: 1 1 0;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.popup .nav.nav-tabs li[role="presentation"] a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
padding: 10px 0;
|
||||
border: none;
|
||||
background: none;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
border-radius: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.popup .nav.nav-tabs li.active a,
|
||||
.popup .nav.nav-tabs li[role="presentation"].active a {
|
||||
color: #F77474;
|
||||
border-bottom: 2px solid #F77474;
|
||||
background: #fff;
|
||||
}
|
||||
.popup .btm {
|
||||
background: #000;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 18px 28px 18px 28px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
}
|
||||
.popup .btm .left_box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.popup .btm .left_box label {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
margin-left: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.popup .btm .right_box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.popup .btm .close_btn_btm {
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.popup .btm .close_btn_btm img {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
filter: invert(1);
|
||||
}
|
||||
.content1{
|
||||
background-color:#cc3333;
|
||||
}
|
||||
.content2{
|
||||
background-color:#ced4d2;
|
||||
}
|
||||
|
||||
.tab-content .tab-pane { display:none; }
|
||||
.tab-content .tab-pane.active { display:block; }
|
||||
|
||||
@media only screen and (max-width:768px){
|
||||
/* banner */
|
||||
.project_wrap main .banner .main_banner_pagination { width:90%; margin-left:5%; bottom:25px; }
|
||||
.project_wrap main .sub_banner .sub_banner_swiper .sub_banner_pagination { width:90%; margin-left:5%; bottom:25px; }
|
||||
.project_wrap main .banner .swiper-wrapper .swiper-slide { height:100%; }
|
||||
.project_wrap main .banner .swiper-wrapper .swiper-slide .detail_btn { font-size:12px; bottom:40px; left:50%; transform:translateX(-50%); display:none; }
|
||||
.project_wrap main .banner .swiper-pagination-bullet { height:2px; display:inline-block; }
|
||||
/* cont */
|
||||
.project_wrap main section:not(.banner) { padding:70px 0 70px 5%; }
|
||||
.project_wrap main section:not(.banner) h3 { font-size:18px; line-height:20px; text-align:center; }
|
||||
.project_wrap main .cont .swiper { margin-top:20px; }
|
||||
.project_wrap main .cont .swiper-pagination { width:95%; height:40px; }
|
||||
.project_wrap main .cont .swiper-pagination-bullet { height:2px; }
|
||||
.project_wrap main .cont .swiper-pagination-bullet span { padding-top:10px; font-size:14px; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide { margin-top:50px; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide img { width:100%; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide .text_box { left:20px; bottom:10px; top:auto; transform:none; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide .text_box P.cont_tit { font-size:16px; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide .text_box P { font-size:12px; margin-top:5px; line-height:14px; }
|
||||
.project_wrap main .cont .swiper-wrapper .swiper-slide .text_box button { font-size:12px; margin-top:3px; }
|
||||
.project_wrap main .cont.content1 .swiper-pagination-bullet:nth-child(1) { width:25%; }
|
||||
.project_wrap main .cont.content1 .swiper-pagination-bullet:nth-child(2) { width:30%; }
|
||||
.project_wrap main .cont.content1 .swiper-pagination-bullet:nth-child(3) { width:20%; }
|
||||
.project_wrap main .cont.content1 .swiper-pagination-bullet:nth-child(4) { width:25%; }
|
||||
.project_wrap main .cont.content2 .swiper-pagination-bullet:nth-child(1) { width:35%; }
|
||||
.project_wrap main .cont.content2 .swiper-pagination-bullet:nth-child(2) { width:20%; }
|
||||
.project_wrap main .cont.content2 .swiper-pagination-bullet:nth-child(3) { width:20%; }
|
||||
.project_wrap main .cont.content2 .swiper-pagination-bullet:nth-child(4) { width:25%; }
|
||||
/* instagram */
|
||||
.project_wrap main section.instagram { padding-top:0; }
|
||||
.project_wrap main .instagram .instagram_top { position:relative; justify-content:center; }
|
||||
.project_wrap main .instagram .instagram_top .more_btn { margin-left:0; font-size:12px; line-height:15px; position:absolute; bottom:0; right:5%; }
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide .video { border-radius:5px; }
|
||||
.project_wrap main .instagram .instagram_btm .swiper .swiper-wrapper .swiper-slide p.title {font-size:14px;}
|
||||
.project_wrap main .instagram .instagram_btm { margin-top:30px; }
|
||||
}
|
||||
|
||||
.popup-background-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
backdrop-filter: blur(8px);
|
||||
-webkit-backdrop-filter: blur(8px);
|
||||
z-index: 9998;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: all 0.3s ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.popup-background-mask.active {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.popup {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
body.popup-open {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body.popup-open main {
|
||||
filter: blur(3px);
|
||||
transition: filter 0.3s ease;
|
||||
}
|
||||
|
||||
body.popup-open main * {
|
||||
pointer-events: none;
|
||||
}
|
||||
@@ -0,0 +1,67 @@
|
||||
/* Instagram Swiper Custom Footer Styles */
|
||||
.instagram-swiper-footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 24px;
|
||||
margin-top: 18px;
|
||||
}
|
||||
.custom-swiper-btn {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
position: relative;
|
||||
}
|
||||
.custom-swiper-btn.prev::before,
|
||||
.custom-swiper-btn.next::before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-top: 2px solid #222;
|
||||
border-right: 2px solid #222;
|
||||
position: absolute;
|
||||
}
|
||||
.custom-swiper-btn.prev::before {
|
||||
transform: rotate(-135deg);
|
||||
left: 13px;
|
||||
top: 13px;
|
||||
}
|
||||
.custom-swiper-btn.next::before {
|
||||
transform: rotate(45deg);
|
||||
left: 13px;
|
||||
top: 13px;
|
||||
}
|
||||
.custom-swiper-thumbs {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
.custom-swiper-thumb {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
background: #ddd;
|
||||
border: 2px solid transparent;
|
||||
cursor: pointer;
|
||||
transition: border 0.2s, background 0.2s;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.custom-swiper-thumb.active {
|
||||
border: 2px solid #ff6b6b;
|
||||
background: #fff0f0;
|
||||
box-shadow: 0 0 0 2px #ffeaea;
|
||||
}
|
||||
.custom-swiper-thumb img {
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,215 @@
|
||||
.project_wrap main p span.red { color:#B11246; }
|
||||
.project_wrap main .text_box p { margin-top:20px; }
|
||||
.project_wrap main .text_box .hashtag { margin-top:0; font-size:30px; color:#B11246; }
|
||||
.project_wrap main .text_box .sub_text { font-size:23px; line-height:30px; color:#707070; }
|
||||
.project_wrap main .text_box .sub_title { font-size:40px; line-height:47px; font-weight:300; }
|
||||
.project_wrap main .text_box .sub_title span { font-weight:700; }
|
||||
|
||||
/* main_img */
|
||||
.project_wrap main .main_img .inner_wrap { display:flex; }
|
||||
.project_wrap main .main_img { background:#F8F8F8; }
|
||||
.project_wrap main .main_img img { width:500px; }
|
||||
.project_wrap main .main_img .text_box { width:calc(100% - 500px); text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; }
|
||||
.project_wrap main .main_img .text_box .title { font-size:48px; line-height:55px; }
|
||||
.project_wrap main .main_img .text_box .title span { font-weight:700; }
|
||||
|
||||
/* content1 */
|
||||
.project_wrap main .content1 .inner_wrap { display:flex; }
|
||||
.project_wrap main .content1 .text_box { width:calc(100% - 618px); text-align:left; display:flex; flex-direction:column; justify-content:center; }
|
||||
.project_wrap main .content1 .text_box .title { font-size:50px; line-height:55px; font-weight:700; }
|
||||
|
||||
/* content2 */
|
||||
.project_wrap main .content2 ul { display:flex; justify-content:space-between; }
|
||||
.project_wrap main .content2 ul li { position:relative; }
|
||||
.project_wrap main .content2 ul li .text_box { position:absolute; top:50%; left:50px; transform:translateY(-50%); }
|
||||
.project_wrap main .content2 ul li .text_box p:first-child { font-size:18px; color:#B11246; }
|
||||
.project_wrap main .content2 ul li .text_box .sub_text { font-size:18px; line-height:22px; }
|
||||
|
||||
/* content3 - 의료장비 카탈로그 스타일 (여백 추가) */
|
||||
.project_wrap main .content3 {
|
||||
padding: 40px 0;
|
||||
}
|
||||
.project_wrap main .content3 .inner_wrap > p {
|
||||
font-size: 34px;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
margin-left: 0;
|
||||
}
|
||||
.project_wrap main .content3 .inner_wrap > p span {
|
||||
font-weight: 700;
|
||||
color: #B11246;
|
||||
}
|
||||
.project_wrap main .content3 .equipment-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 15px; /* 카드 간 간격 */
|
||||
margin-top: 40px;
|
||||
max-width: 1280px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.project_wrap main .content3 .equipment-card {
|
||||
background-color: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||
border: 1px solid #ccc;
|
||||
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
|
||||
overflow: hidden;
|
||||
border-radius: 8px; /* 모서리 둥글게 */
|
||||
}
|
||||
.project_wrap main .content3 .equipment-card:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
.project_wrap main .content3 .equipment-image {
|
||||
width: 100%;
|
||||
height: 292px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #f8f9fa;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
.project_wrap main .content3 .equipment-image img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
|
||||
}
|
||||
.project_wrap main .content3 .equipment-info {
|
||||
padding: 20px 15px;
|
||||
text-align: center;
|
||||
background-color: #cccccc;
|
||||
color: white;
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
min-height: 120px;
|
||||
}
|
||||
.project_wrap main .content3 .equipment-name {
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 8px;
|
||||
color: #cc3333;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
.project_wrap main .content3 .equipment-desc {
|
||||
font-size: 19px;
|
||||
color: #222;
|
||||
margin-bottom: 12px;
|
||||
opacity: 0.9;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.project_wrap main .content3 .equipment-price {
|
||||
font-size: 23px;
|
||||
font-weight: 700;
|
||||
color: #222;
|
||||
}
|
||||
.project_wrap main .content3 .equipment-price span {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
margin-left: 2px;
|
||||
}
|
||||
.project_wrap main .content3 ul {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* content4 */
|
||||
.project_wrap main .content4 { padding-bottom:150px; }
|
||||
.project_wrap main .content4 .inner_wrap > p { font-size:34px; text-align:center; }
|
||||
.project_wrap main .content4 .inner_wrap > p span { font-weight:45px; font-weight:700; }
|
||||
.project_wrap main .content4 .inner_wrap > p span.red { font-weight:34px; }
|
||||
.project_wrap main .content4 ul { margin-top:80px; }
|
||||
.project_wrap main .content4 ul li { display:flex; align-items:flex-end; }
|
||||
.project_wrap main .content4 ul li:not(.first) { margin-top:100px; }
|
||||
.project_wrap main .content4 ul li img { width:750px; }
|
||||
.project_wrap main .content4 ul li .text_box { width:calc(100% - 750px); }
|
||||
.project_wrap main .content4 ul li .text_box p:first-child { font-size:34px; line-height:45px; }
|
||||
.project_wrap main .content4 ul li .text_box p:last-child { margin-top:30px; font-size:20px; line-height:30px; }
|
||||
.project_wrap main .content4 ul li .text_box p span { font-weight:700; }
|
||||
.project_wrap main .content4 ul li.red_box .text_box p { color:#B11246; }
|
||||
.project_wrap main .content4 ul li.red_box .text_box p span { color:#B11246; }
|
||||
|
||||
.mt20 { margin-top: 20px !important; }
|
||||
.height_292 { height: 292.844px !important; background: #9EAAB9 !important;}
|
||||
|
||||
/* 반응형 디자인 */
|
||||
@media only screen and (max-width: 1280px) {
|
||||
.project_wrap main .content3 .equipment-grid {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 12px;
|
||||
padding: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
.project_wrap main .text_box p { margin-top:10px; }
|
||||
.project_wrap main .text_box .hashtag { font-size:12px; }
|
||||
.project_wrap main .text_box .sub_text { font-size:10px; line-height:15px; }
|
||||
.project_wrap main .text_box .sub_title { font-size:12px; line-height:15px; }
|
||||
|
||||
/* main_img */
|
||||
.project_wrap main .main_img .inner_wrap { width:100%; align-items:center; }
|
||||
.project_wrap main .main_img img { width:50%; }
|
||||
.project_wrap main .main_img .text_box { width:50%; }
|
||||
.project_wrap main .main_img .text_box .title { margin-top:5px; font-size:18px; line-height:22px; }
|
||||
|
||||
/* content1 */
|
||||
.project_wrap main .content1 .inner_wrap { width:100%; align-items:center; }
|
||||
.project_wrap main .content1 img { width:50%; }
|
||||
.project_wrap main .content1 .text_box { width:50%; padding-left:5%; }
|
||||
.project_wrap main .content1 .text_box .title { margin-top:5px; font-size:18px; line-height:22px; }
|
||||
|
||||
/* content2 */
|
||||
.project_wrap main .content2 .inner_wrap > p { font-size:14px; text-align:center; }
|
||||
.project_wrap main .content2 .inner_wrap > p span { font-weight:700; }
|
||||
.project_wrap main .content2 ul { margin-top:30px; flex-wrap:wrap; }
|
||||
.project_wrap main .content2 ul li img { width:100%; }
|
||||
.project_wrap main .content2 ul li .text_box { left:20px; }
|
||||
.project_wrap main .content2 ul li .text_box p:first-child { font-size:12px; }
|
||||
.project_wrap main .content2 ul li .text_box .sub_title { font-size:20px; line-height:24px; }
|
||||
.project_wrap main .content2 ul li .text_box .sub_text { font-size:12px; line-height:15px; }
|
||||
.project_wrap main .content2 ul li:last-child { margin-top:10px; }
|
||||
|
||||
/* content3 */
|
||||
.project_wrap main .content3 .equipment-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 10px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.project_wrap main .content3 .equipment-image {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.project_wrap main .content3 .inner_wrap > p {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
/* content4 */
|
||||
.project_wrap main .content4 { padding-bottom:50px; }
|
||||
.project_wrap main .content4 .inner_wrap { width:100%; }
|
||||
.project_wrap main .content4 .inner_wrap > p { font-size:14px; }
|
||||
.project_wrap main .content4 ul li:not(.first) { margin-top:30px; }
|
||||
.project_wrap main .content4 ul li img { width:50%; }
|
||||
.project_wrap main .content4 ul li .text_box { width:50%; padding-left:5%; }
|
||||
.project_wrap main .content4 ul li .text_box p { word-break:keep-all; }
|
||||
.project_wrap main .content4 ul li .text_box p:first-child { margin-top:0; font-size:14px; line-height:17px; }
|
||||
.project_wrap main .content4 ul li .text_box p:last-child { margin-top:10px; font-size:10px; line-height:14px; }
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.project_wrap main .content3 .equipment-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.project_wrap main .content3 .equipment-image {
|
||||
height: 250px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
/* content1 */
|
||||
.project_wrap main .content1 { padding-bottom:150px; }
|
||||
.project_wrap main .content1 .text_box p { margin-top:20px; text-align:center; }
|
||||
.project_wrap main .content1 .text_box .hashtag { margin-top:0; font-size:30px; color:#B11246; }
|
||||
.project_wrap main .content1 .text_box .title { font-size:48px; line-height:55px; }
|
||||
.project_wrap main .content1 .text_box .title span { font-weight:700; }
|
||||
.project_wrap main .content1 .text_box .sub_text { font-size:23px; line-height:30px; color:#707070; }
|
||||
.project_wrap main .content1 .table_box { margin-top:100px; }
|
||||
.project_wrap main .content1 .table_box table tr.thead { font-weight:700; font-size:16px; background:#EDEDED; }
|
||||
.project_wrap main .content1 .table_box table tr.sub_thead { font-weight:700; font-size:16px; background:#F8F8F8; }
|
||||
.project_wrap main .content1 .table_box table tr td { height:50px; padding:0 10px; border:1px solid #e5e5e5; text-align:center; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* content1 */
|
||||
.project_wrap main .content1 { padding-bottom:50px; }
|
||||
.project_wrap main .content1 .text_box p { margin-top:10px; }
|
||||
.project_wrap main .content1 .text_box .hashtag { font-size:14px; }
|
||||
.project_wrap main .content1 .text_box .title { font-size:24px; line-height:30px; }
|
||||
.project_wrap main .content1 .text_box .sub_text { font-size:14px; line-height:20px; }
|
||||
.project_wrap main .content1 .table_box { margin-top:50px; }
|
||||
.project_wrap main .content1 .table_box img { width:100%; }
|
||||
.project_wrap main .content1 .table_box table tr.thead { font-size:14px; }
|
||||
.project_wrap main .content1 .table_box table tr.sub_thead { font-size:12px; }
|
||||
.project_wrap main .content1 .table_box table tr td { font-size:10px }
|
||||
}
|
||||
@@ -0,0 +1,50 @@
|
||||
.project_wrap main p span { font-weight:700; }
|
||||
/* main_img */
|
||||
.project_wrap main .main_img img { width:100%; }
|
||||
/* content1 */
|
||||
.project_wrap main .content1 .captain_box { position:relative; }
|
||||
.project_wrap main .content1 .captain_box img { width:100%; }
|
||||
.project_wrap main .content1 .captain_box .text_box { position:absolute; top:50%; left:100px; transform:translateY(-50%); }
|
||||
.project_wrap main .content1 .captain_box .text_box .sub_title { margin-top:0; font-size:26px; }
|
||||
.project_wrap main .content1 .captain_box .text_box .title { margin-top:10px; font-size:70px; font-weight:700; }
|
||||
.project_wrap main .content1 .captain_box .text_box .sub_text { margin-top:20px; font-size:20px; }
|
||||
/* content2 */
|
||||
.project_wrap main .content2 { padding-bottom:150px; }
|
||||
.project_wrap main .content2 .inner_wrap { padding-left:100px; }
|
||||
.project_wrap main .content2 .inner_wrap > p { font-size:34px; }
|
||||
.project_wrap main .content2 ul { margin-top:50px; }
|
||||
.project_wrap main .content2 ul li { display:flex; margin-top:100px; }
|
||||
.project_wrap main .content2 ul li:first-child { margin-top:0; }
|
||||
.project_wrap main .content2 ul li .text_box { margin-left:100px; }
|
||||
.project_wrap main .content2 ul li .text_box p { margin-top:30px; color:#707070; }
|
||||
.project_wrap main .content2 ul li .text_box p span { color:#707070; }
|
||||
.project_wrap main .content2 ul li .text_box p.field { margin-top:0; font-size:18px; }
|
||||
.project_wrap main .content2 ul li .text_box p.field span { width:80px; height:36px; line-height:36px; font-weight:400; text-align:center; border-radius:50px; display:inline-block; background:#FBFBFB; }
|
||||
.project_wrap main .content2 ul li .text_box p.name { font-size:18px; }
|
||||
.project_wrap main .content2 ul li .text_box p.name span.name { margin-right:20px; font-size:25px; }
|
||||
.project_wrap main .content2 ul li .text_box p.last { font-size:20px; font-weight:300; line-height:35px; }
|
||||
.project_wrap main .content2 ul li .text_box p.last span { margin-bottom:10px; font-weight:600; display:inline-block; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* content1 */
|
||||
.project_wrap main .content1 .inner_wrap { width:100%; }
|
||||
.project_wrap main .content1 .captain_box .text_box { width:100%; text-align:center; top:auto; bottom:20px; left:50%; transform:translateY(0) translateX(-50%); }
|
||||
.project_wrap main .content1 .captain_box .text_box .sub_title { font-size:14px; }
|
||||
.project_wrap main .content1 .captain_box .text_box .title { margin-top:5px; font-size:22px; }
|
||||
.project_wrap main .content1 .captain_box .text_box .sub_text { margin-top:10px; font-size:14px; }
|
||||
/* content2 */
|
||||
.project_wrap main .content2 { padding-bottom:50px; }
|
||||
.project_wrap main .content2 .inner_wrap { padding-left:0; }
|
||||
.project_wrap main .content2 .inner_wrap > p { font-size:14px; text-align:center; }
|
||||
.project_wrap main .content2 ul { margin-top:30px; }
|
||||
.project_wrap main .content2 ul li { margin-top:50px; flex-direction:column; }
|
||||
.project_wrap main .content2 ul li img { width:70%; margin:0 auto; }
|
||||
.project_wrap main .content2 ul li .text_box { margin-left:0; margin-top:30px; }
|
||||
.project_wrap main .content2 ul li .text_box p { margin-top:20px; margin-left:5%; }
|
||||
.project_wrap main .content2 ul li .text_box p.field { margin-left:0; font-size:16px; text-align:center; }
|
||||
.project_wrap main .content2 ul li .text_box p.name { font-size:14px; }
|
||||
.project_wrap main .content2 ul li .text_box p.name span.name { margin-right:10px; font-size:20px; }
|
||||
.project_wrap main .content2 ul li .text_box p.last { font-size:14px; line-height:25px; }
|
||||
.project_wrap main .content2 ul li .text_box p.last span { margin-bottom:5px; font-size:16px; }
|
||||
}
|
||||
@@ -0,0 +1,91 @@
|
||||
/* main_img */
|
||||
.project_wrap main .main_img ul { display:flex; }
|
||||
.project_wrap main .main_img ul li { width:calc((100% - 40px) / 3); margin-left:20px; }
|
||||
.project_wrap main .main_img ul li:first-child { margin-left:0; }
|
||||
.project_wrap main .main_img ul li img { width:100%; }
|
||||
/* content1 */
|
||||
.project_wrap main .content1 .inner_wrap > p { font-size:34px; }
|
||||
.project_wrap main .content1 .inner_wrap > p span { font-weight:700; }
|
||||
.project_wrap main .content1 .top { margin-top:100px; display:flex; justify-content:space-between; position:relative; }
|
||||
.project_wrap main .content1 .top .text_box { text-align:center; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
|
||||
.project_wrap main .content1 .top .text_box p { font-size:38px; font-weight:700; position:relative; }
|
||||
.project_wrap main .content1 .top .text_box p::after { content:''; display:block; width:30px; height:50px; position:absolute; top:-70px; left:50%; transform:translateX(-50%); background:url('../image/pin.svg')no-repeat; background-size:30px; }
|
||||
.project_wrap main .content1 .top .text_box p span { color:#B70135; }
|
||||
.project_wrap main .content1 .top .img_box { position:relative; }
|
||||
.project_wrap main .content1 .top .img_box::after { content:''; display:block; width:150px; height:1px; border:1px dashed #B70135; position:absolute; top:50%; }
|
||||
.project_wrap main .content1 .top .img_box.img_left::after { right:-150px; }
|
||||
.project_wrap main .content1 .top .img_box.img_right::after { left:-150px; }
|
||||
.project_wrap main .content1 .btm { margin-top:50px; }
|
||||
.project_wrap main .content1 .btm ul { display:flex; }
|
||||
.project_wrap main .content1 .btm ul li { width:25%; height:100px; text-align:center; font-size:25px; font-weight:700; color:#D8D8D8; position:relative; }
|
||||
.project_wrap main .content1 .btm ul li.red { color:#B70135; }
|
||||
.project_wrap main .content1 .btm ul li::after { content:''; display:block; width:35px; height:35px; position:absolute; left:50%; bottom:0; transform:translateX(-50%); background:url('../image/pin2.svg')no-repeat -35px 0; }
|
||||
.project_wrap main .content1 .btm ul li.red::after { background-position:0 0; }
|
||||
.project_wrap main .content1 .btm ul li::before { content:''; display:block; width:100%; height:3px; position:absolute; bottom:16px; right:-50%; background:#D8D8D8; }
|
||||
.project_wrap main .content1 .btm ul li:last-child::before { display:none; }
|
||||
/* content3 */
|
||||
.project_wrap main .content3 ul { display:flex; justify-content:center; }
|
||||
.project_wrap main .content3 ul li { width:40%; text-align:center; display:flex; flex-direction:column; align-items:center; }
|
||||
.project_wrap main .content3 ul li div { width:86px; height:86px; background:url('../image/introduction_way_con3.png')no-repeat; }
|
||||
.project_wrap main .content3 ul li:last-child div { background-position:-86px 0; }
|
||||
.project_wrap main .content3 ul li p { margin-top:30px; font-size:33px; color:#707070; }
|
||||
.project_wrap main .content3 ul li p span { font-weight:700; }
|
||||
.project_wrap main .content3 ul li p span.red { color:#B70135; }
|
||||
/* content4 */
|
||||
.project_wrap main .content4 { padding-bottom:150px; }
|
||||
.project_wrap main .content4 ul { display:flex; }
|
||||
.project_wrap main .content4 ul li { width:calc(37.5% - 5px); height:282px; margin-right:5px; overflow:hidden; }
|
||||
.project_wrap main .content4 ul li:last-child { width:25%; margin-right:0; }
|
||||
.project_wrap main .content4 ul li img { width:100%; }
|
||||
.project_wrap main .content4 .inner_wrap > div { padding:30px 100px; display:flex; justify-content:space-between; background:#000; }
|
||||
.project_wrap main .content4 .inner_wrap > div p { margin-top:20px; color:#fff; font-size:18px; }
|
||||
.project_wrap main .content4 .inner_wrap > div p span { font-weight:700; }
|
||||
.project_wrap main .content4 .inner_wrap > div .left_box p:first-child { margin:0; font-size:37px; font-weight:700; }
|
||||
.project_wrap main .content4 .inner_wrap > div .left_box p:first-child span.red { color:#B70135; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box { text-align:right; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box p { margin:0; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box p span { font-size:34px; color:#fff; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box button { height:50px; margin-top:20px; padding:0 20px; border:0; border-radius:5px; font-size:20px; color:#fff; display:flex; align-items:center; background:#03CF5D; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box button span { margin-right:5px; color:#fff; font-weight:700; display:inline-block; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box button img { margin-left:30px; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box button img.naver_img { margin-left:0; margin-right:10px; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* main_img */
|
||||
.project_wrap main .main_img ul li { width:calc((100% - 5px) / 2); margin-left:10px; }
|
||||
.project_wrap main .main_img ul li:first-child { display:none; }
|
||||
.project_wrap main .main_img ul li:nth-child(2) { margin-left:0; }
|
||||
/* content1 */
|
||||
.project_wrap main .content1 .inner_wrap > p { font-size:14px; text-align:center; }
|
||||
.project_wrap main .content1 .top { margin-top:30px; }
|
||||
.project_wrap main .content1 .top .img_box img { width:100px; }
|
||||
.project_wrap main .content1 .top .text_box p { font-size:12px; }
|
||||
.project_wrap main .content1 .top .text_box p::after { width:10px; height:18px; top:-20px; background-size:10px; }
|
||||
.project_wrap main .content1 .top .img_box::after { width:40px; }
|
||||
.project_wrap main .content1 .top .img_box.img_right::after { left:-40px; }
|
||||
.project_wrap main .content1 .top .img_box.img_left::after { right:-40px; }
|
||||
.project_wrap main .content1 .btm { margin-top:30px; }
|
||||
.project_wrap main .content1 .btm ul li { height:50px; font-size:12px; line-height:14px; }
|
||||
.project_wrap main .content1 .btm ul li::after { width:13px; height:13px; background-size:26px; background-position:-13px 0; }
|
||||
.project_wrap main .content1 .btm ul li::before { height:2px; bottom:5px; }
|
||||
/* content3 */
|
||||
.project_wrap main .content3 ul li div { width:55px; height:55px; background-size:110px; }
|
||||
.project_wrap main .content3 ul li:last-child div { background-position:-55px 0; }
|
||||
.project_wrap main .content3 ul li p { margin-top:15px; font-size:12px; }
|
||||
/* content4 */
|
||||
.project_wrap main .content4 { padding-bottom:0; }
|
||||
.project_wrap main .content4 .inner_wrap { width:100%; }
|
||||
.project_wrap main .content4 .inner_wrap > div { padding:30px 20px; flex-direction:column; }
|
||||
.project_wrap main .content4 .inner_wrap > div p { margin-top:5px; font-size:12px; text-align:center; }
|
||||
.project_wrap main .content4 .inner_wrap > div .left_box p:first-child { font-size:20px; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box { text-align:center; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box p { margin-top:20px; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box p span { font-size:25px; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box button { height:35px; margin:20px auto 0 auto; font-size:13px; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box button img { width:14px; margin-left:10px; }
|
||||
.project_wrap main .content4 .inner_wrap > div .right_box button img.naver_img { width:18px; }
|
||||
.project_wrap main .content4 ul li { width:calc(50% - 2px); height:auto; margin-right:4px; }
|
||||
.project_wrap main .content4 ul li:nth-child(2) { margin-right:0; }
|
||||
|
||||
}
|
||||
1311
src/main/resources/static/css/web/jquery-ui.css
vendored
Normal file
1311
src/main/resources/static/css/web/jquery-ui.css
vendored
Normal file
File diff suppressed because it is too large
Load Diff
51
src/main/resources/static/css/web/modal.css
Normal file
51
src/main/resources/static/css/web/modal.css
Normal file
@@ -0,0 +1,51 @@
|
||||
.popup {
|
||||
width: 436px; /* 이미지 정확한 너비 */
|
||||
margin:0;
|
||||
position:absolute;
|
||||
top:50%;
|
||||
left:50%;
|
||||
transform:translate(-50%, -50%);
|
||||
z-index:5;
|
||||
display:none;
|
||||
}
|
||||
.popup.open { display:block; }
|
||||
.popup .top { height:100%; padding:0; background:#000; }
|
||||
.popup .top button { width:48px; height:48px; border:0; border-radius:5px; position:absolute; top:0; right:-53px; background:#fff; }
|
||||
.popup .top .nav-tabs { width:100%; }
|
||||
.popup .top .nav-tabs li { width:calc(100% / 5); height:48px; background:#fff; }
|
||||
.popup .top .nav-tabs li a { width:100%; height:100%; padding:0; text-align:center; line-height:48px; border:0; border-radius:0; display:inline-block; }
|
||||
.popup .top .nav-tabs li a:hover { color:#000; }
|
||||
.popup .top .nav-tabs li.active a:hover { color:#fff; }
|
||||
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover { color:#fff; font-weight:700; background:#000; }
|
||||
.popup .top .tab-pane {
|
||||
text-align:center;
|
||||
overflow:auto;
|
||||
}
|
||||
.popup .top .tab-pane img {
|
||||
width: 100%;
|
||||
object-fit: cover;
|
||||
cursor:pointer;
|
||||
}
|
||||
.popup .btm { position:absolute; right:0; }
|
||||
.popup .btm input { display:none; }
|
||||
.popup .btm label { margin:0; padding-left:25px; font-weight:400; position:relative; }
|
||||
.popup .btm label::after { content:''; display:block; width:15px; height:15px; border:2px solid #666; border-radius:3px; position:absolute; left:0; top:3px; }
|
||||
.popup .btm input:checked + label::before { content:''; display:block; width:4px; height:7px; border-bottom:2px solid #666; border-right:2px solid #666; position:absolute; left:5.5px; top:6px; transform:rotate(45deg); }
|
||||
.popup .btm button { border:0; background:none; }
|
||||
|
||||
.mb { display:none; }
|
||||
/* 반응형 */
|
||||
@media only screen and (max-width:768px){
|
||||
.popup {
|
||||
width:90vw;
|
||||
}
|
||||
.mb { display:block; }
|
||||
.popup .top .tab-content { height:100%; }
|
||||
.popup .top button { width:30px; height:30px; padding:5px; top:5px; right:5px; }
|
||||
.popup .top button img { width:100%; }
|
||||
.popup .top .nav-tabs li a { padding-top:10px; font-size:12px; line-height:15px; }
|
||||
.popup .top .tab-pane { height:100%; }
|
||||
.popup .btm label { padding-left:22px; font-size:12px; }
|
||||
.popup .btm label::after { top:0; }
|
||||
.popup .btm input:checked + label::before { top:3px; }
|
||||
}
|
||||
222
src/main/resources/static/css/web/modal_styles.css
Normal file
222
src/main/resources/static/css/web/modal_styles.css
Normal file
@@ -0,0 +1,222 @@
|
||||
/* modal.css 수정금지 */
|
||||
/* 새로 css 추가시 어느 페이지에 어디위치인지 표시할것 */
|
||||
/* 기존 css 수정시 여기다가 수정할것 */
|
||||
|
||||
|
||||
|
||||
/* joy 추가 시작 */
|
||||
|
||||
/* 연차관리 날짜 선택 리스트 */
|
||||
.modalNT .choiceDateBox{display:block;overflow-y:scroll;border:1px solid #e6e6e6;outline:none;width:700px;height:130px;padding:.47rem .8rem;}
|
||||
|
||||
/* 작은 모달 */
|
||||
.modalNT.fade .modal-dialog.modalSmall {min-width:800px;}
|
||||
|
||||
/* 왼쪽 정렬 */
|
||||
.modalNT .basicScroll .grid-layout table td div.leftAlign {text-align:left;padding:0 5px;}
|
||||
|
||||
/* 필수 표시 */
|
||||
.modalNT .modal-body .requisite {color:red; font-size:12px;}
|
||||
|
||||
|
||||
|
||||
/* 반복주기 가로사이즈 */
|
||||
.modalNT .modal-body .form-control.inputRepeaInterval {width:calc(100% - 60px);}
|
||||
|
||||
/* 팝업 반복 주기 글자 */
|
||||
.modalNT .modal-body .repeatCommentText {position:relative; bottom:-10px; margin:0 0 0 5px; font-weight:600;}
|
||||
|
||||
/* 알림 css 시작 */
|
||||
.success .modal.in {z-index: 9991;}
|
||||
.success .modal.in .modal-dialog{top:50%; transform:translateY(-50%); width:300px;}
|
||||
.success .modal-header {border-bottom:none;}
|
||||
.success .modal-name {text-align:center;}
|
||||
.success .modal-name svg {width:40px; height:40px; margin:10px 0; fill:#198754;}
|
||||
.success .modal-name .title {font-size:16px; word-break:keep-all; font-weight:700; margin-bottom:5px;}
|
||||
.success .modal-name .text {font-size:14px; margin:0; word-break:keep-all;}
|
||||
|
||||
.danger .modal.in {z-index: 9991;}
|
||||
.danger .modal.in .modal-dialog{top:50%; transform:translateY(-50%); width:300px;}
|
||||
.danger .modal-header {border-bottom:none;}
|
||||
.danger .modal-name {text-align:center;}
|
||||
.danger .modal-name svg {width:40px; height:40px; margin:10px 0; fill:#dc3545;}
|
||||
.danger .modal-name .title {font-size:16px; word-break:keep-all; font-weight:700; margin-bottom:5px;}
|
||||
.danger .modal-name .text {font-size:14px; margin:0; word-break:keep-all;}
|
||||
|
||||
.warning .modal.in {z-index: 9991;}
|
||||
.warning .modal.in .modal-dialog{top:50%; transform:translateY(-50%); width:300px;}
|
||||
.warning .modal-header {border-bottom:none;}
|
||||
.warning .modal-name {text-align:center;}
|
||||
.warning .modal-name svg {width:40px; height:40px; margin:10px 0; fill:#dc3545;}
|
||||
.warning .modal-name .title {font-size:16px; word-break:keep-all; font-weight:700; margin-bottom:5px;}
|
||||
.warning .modal-name .text {font-size:14px; margin:0; word-break:keep-all;}
|
||||
|
||||
.info .modal.in {z-index: 9991;}
|
||||
.info .modal.in .modal-dialog{top:50%; transform:translateY(-50%); width:300px;}
|
||||
.info .modal-header {border-bottom:none;}
|
||||
.info .modal-name {text-align:center;}
|
||||
.info .modal-name svg {width:40px; height:40px; margin:10px 0; fill:#0dcaf0;}
|
||||
.info .modal-name .title {font-size:16px; word-break:keep-all; font-weight:700; margin-bottom:5px;}
|
||||
.info .modal-name .text {font-size:14px; margin:0; word-break:keep-all;}
|
||||
|
||||
|
||||
.popupColored .modal-footer {padding:0;}
|
||||
/* 모달버튼 */
|
||||
.popupColored .modal .btn-box {padding:0; margin:10px auto; float:none; min-width:10px; display:table;}
|
||||
.popupColored .modal .btnCommon {width:100px; margin:0 7px; text-shadow:none; border:none; padding:0; border-radius:.267rem; box-shadow:none; line-height:32px;}
|
||||
/*취소*/
|
||||
.popupColored .modal .btn-cancel {background:#e6e6e6; color:#333;}
|
||||
.popupColored .modal .btn-cancel:hover {background:#dedede;}
|
||||
/*확인*/
|
||||
.popupColored .modal .btn-Success {background:#377ec1; color:#fff;}
|
||||
.popupColored .modal .btn-Success:hover {background:#7caad7;}
|
||||
|
||||
.modalNT .modal-body .form-group50 {width:50%; float:left; border-bottom:1px solid #e6e6e6; background:#f5f7f7;}
|
||||
|
||||
|
||||
|
||||
@media only screen and (max-width:1200px) {
|
||||
.success .modal.in .modal-dialog {margin:0 auto;}
|
||||
.danger .modal.in .modal-dialog {margin:0 auto;}
|
||||
.warning .modal.in .modal-dialog {margin:0 auto;}
|
||||
.info .modal.in .modal-dialog {margin:0 auto;}
|
||||
}
|
||||
/* 알림 css 종료 */
|
||||
|
||||
|
||||
/* 라디오리스트팝업 */
|
||||
.modalNT.fade .modal-dialog.modalRadioList {width:300px;min-width:300px;}
|
||||
.modalNT.fade .modal-dialog.modalRadioList .form-group {background:#fff;border-bottom:none;}
|
||||
.modalNT.fade .modal-dialog.modalRadioList .form-group .radio {display:block;}
|
||||
|
||||
|
||||
|
||||
/* joy 추가 종료 */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* bradley 추가 시작 */
|
||||
/* 등록,수정페이지_인풋 width 125 */
|
||||
.modalNT .modal-body .pageWrapInput.width125 {width:100px;}
|
||||
|
||||
/* 송장출력관리 > 우측버튼 팝업 _ 운송장출력내용부분 */
|
||||
.modalNT.in .modal-dialog.imgPrint {min-width:1000px; top:50%; transform:translateY(-50%); margin:0 auto;}
|
||||
.modalNT.fade .modal-dialog.imgPrint {min-width:1000px; top:50%; transform:translateY(-50%); margin:0 auto;}
|
||||
|
||||
.modalNT .modal-body .imageBoxL {width:190px;}
|
||||
.modalNT .modal-body .imageBoxL img {width:100%;}
|
||||
.modalNT .modal-body .imageBoxR {width:300px;}
|
||||
.modalNT .modal-body .imageBoxR img {width:100%;}
|
||||
.modalNT.modalVisitLog .modal-dialog {width:900px;}
|
||||
|
||||
.modalNT .modal-body .sub-name {width: 580px; clear:both; color:#97989b; margin:5px 0 0; font-size:12px; position:relative;}
|
||||
.modalNT .modal-body .sub-name:first-child {margin-top:10px;}
|
||||
.modalNT .modal-body .sub-name .deleteSvg {width:20px; height:20px; fill:rgba(49, 58, 70, .8); position:absolute;}
|
||||
|
||||
#popup_insertUserPlanner .modal-dialog {width:408px;}
|
||||
/* bradley 추가 종료 */
|
||||
|
||||
|
||||
/* kevin 추가 시작 */
|
||||
|
||||
/* 이미지 */
|
||||
/* .modalNT .modal-body form .photoBox {width:calc(100% - 200px); float:left; padding:0 0 0 10px;} */
|
||||
.modalNT .modal-content .photoSlash {width:300px; float:left; padding:0 0 0 10px;}
|
||||
.modalNT .modal-content .title-name {margin:5px 0;}
|
||||
.modalNT .modal-content .imgnumber {color:#97989b; position:relative; left:10px;}
|
||||
.modalNT .modal-content input[type="file"] {position:absolute; opacity:0; cursor:pointer; z-index:1;}
|
||||
.modalNT .modal-content .photoList {display:table; position:relative;}
|
||||
.modalNT .modal-content .videoList {display:table;}
|
||||
.modalNT .modal-content .imgBox {width:100px; height:100px; padding:0; float:left; margin-right:10px;}
|
||||
.modalNT .modal-content .img-100 {border:1px solid #e6e6e6; width:100px; height:100px; background:none; color:#3e3f3a;}
|
||||
.modalNT .modal-content .img-100:hover{background:none;border:1px solid #e6e6e6;box-shadow:none;}
|
||||
.modalNT .modal-content .photoBorder {width:calc(100% - 200px); border-bottom:1px solid #e6e6e6; display:-webkit-box; float:right;}
|
||||
.modalNT .modal-content .photoBorder.last {border:none;}
|
||||
|
||||
/* kevin 추가 종료 */
|
||||
|
||||
/* emily 추가 시작 */
|
||||
|
||||
/* 모달 input x 버튼 투명도 조절 button -> input 변경*/
|
||||
.modalNT.fade .modal-dialog .modal-content .modal-header .close {background: 0 0;}
|
||||
|
||||
/*사이즈 변경 pageWrap*/
|
||||
.modalNT .modal-body .form-group .width50, .modalNT .modal-body .form-group50 .width50 {width:42%; padding:5px;}
|
||||
.modalNT .modal-body .form-group .width100, .modalNT .modal-body .form-group50 .width100 {width:100%; padding:5px;}
|
||||
|
||||
/*첨부파일, URL 상세 조회(조회만) 파일 없을 때 height 사이즈 조절*/
|
||||
.modalNT .modal-body .rightWidth.minHeight {min-height: 40px;}
|
||||
/*첨부파일 확장자*/
|
||||
.modalNT .modal-body .input-file .fileExt {color:red; padding-left:10px;}
|
||||
|
||||
|
||||
/*탭이 있는 모달 위치 조정*/
|
||||
.modalNT.fade .modal-dialog.tapIn {top:0; margin:50px auto; transform: translate(0, 0);}
|
||||
|
||||
/* 탭 리스트*/
|
||||
.modalNT .modal-tap {padding:16px; /*max-height:600px;*/ /*overflow:scroll;*/ overflow-x:unset; background:#fff;}
|
||||
.modalNT .modal-tap .border {width:40px; height:3px; background:#00723e;}
|
||||
.modalNT .modal-tap .listConbox {margin-bottom:1px;}
|
||||
.modalNT .modal-tap .listConbox .tabList {list-style:none; padding:0; margin:1px; margin-bottom:-1px; width:100%; background:#fff;}
|
||||
.modalNT .modal-tap .listConbox .tabList li {position:relative; display:table-cell; width:calc(100% / 7); border-left:0; text-align:center;}
|
||||
.modalNT .modal-tap .listConbox .tabList li:after {content:''; position:absolute; top:0; bottom:0; left:-1px; right:0; border:1px solid #dedede;}
|
||||
.modalNT .modal-tap .listConbox .tabList li a {position:relative; display:block; font-size:13px; line-height:38px; height:38px; z-index:1; margin:0; padding:0; border:0; background:#f5f7f7; border:1px solid #dee2e6; border-left:none; border-radius:0;}
|
||||
.modalNT .modal-tap .listConbox .tabList li a:link {color:rgba(49, 58, 70, .8);}
|
||||
.modalNT .modal-tap .listConbox .tabList li a:hover {background:#f5f7f7; color:rgba(49, 58, 70, .8);}
|
||||
.modalNT .modal-tap .listConbox .tabList li.active a:after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border:0; z-index:2;}
|
||||
.modalNT .modal-tap .listConbox .tabList li.active a:hover{background:none;}
|
||||
.modalNT .modal-tap .listConbox .nav-tabs>li.active>a, .modalNT .modal-tap .listConbox .nav-tabs>li.active>a:focus, .modalNT .modal-tap .listConbox .nav-tabs>li.active>a:hover {color:#fff; background:#377ec1; border-radius:0; border:none;} /*선택시 배경 여기에 넣을것 */
|
||||
.modalNT .modal-tap .formSubstance .tab-pane {display:none;}
|
||||
.modalNT .modal-tap .formSubstance .tab-pane.active {display:block;} /*bradley 수정*/
|
||||
/* 탭내용*/
|
||||
.modalNT .modal-tap .form-horizontal .conBox {border:1px solid #dee2e6; padding:10px;}
|
||||
.modalNT .modal-tap .form-horizontal .conBox .title {color:#324767; text-decoration:none; padding:0px 10px; text-align:left; line-height:34px; margin:0; font-size:16px; font-weight:700;}
|
||||
.modalNT .modal-tap .form-horizontal .conBox .title span {color:#97989b; font-size:13px; margin-left:10px;}
|
||||
.modalNT .modal-tap .form-horizontal .conBox .marginBox {margin:30px;}
|
||||
|
||||
/* 리스트상단네비 */
|
||||
.modalNT .modal-tap .listNav {display:inline-block; width:100%; height:30px; position:relative;}
|
||||
.modalNT .modal-tap .listNav .numberBox {position: absolute;left: 0;}
|
||||
.modalNT .modal-tap .listNav .numberBox .number {line-height:30px; margin:0; display:inline-block;}
|
||||
.modalNT .modal-tap .listNav .numberBox .number .n-color {color:#377ec1; padding-left:3px;}
|
||||
.modalNT .modal-tap .listNav .numberBox .slush {padding:0 5px; display:inline-block;}
|
||||
.modalNT .modal-tap .listNav .text {color:#324767; text-decoration:none; padding:0px 10px; text-align:left; line-height:34px; margin:0; font-size:16px; font-weight:700; display:block; border-bottom:1px solid #dee2e6;}
|
||||
/* 리스트우측셀렉트3종 */
|
||||
.modalNT .modal-tap .listNav .selectBox {position:absolute; top:0; right:0;}
|
||||
.modalNT .modal-tap .listNav .selectBox .selectList {margin:0 0 0 7px; float:right; width:150px;}
|
||||
|
||||
|
||||
.modalNT .modal-tap .form-control {width:100%; border:1px solid #dee2e6; display:block; padding:.47rem .8rem; background-color:#FFF; border-radius:.267rem; box-shadow:none; height:30px; font-size:13px;}
|
||||
.modalNT .modal-tap select.form-control:not([multiple=multiple]) {background-image:url(../../image/arrow-down.png); background-position:95%; background-size:14px 14px,10px 10px; background-repeat:no-repeat; -webkit-appearance:none; -moz-appearance:none; padding-right:1.5rem; height:30px; color:rgba(49, 58, 70, .8);}
|
||||
.modalNT .modal-tap select.form-control:not([multiple=multiple]):focus {border:1px solid #00bbc5;}
|
||||
|
||||
/* 리스트 왼쪽,오른쪽,마진제외 버튼 영역 */
|
||||
.modalNT .modal-tap .btnlistBox {padding:5px 0; display:table; width:100%; border-top:1px solid #dee2e6;}
|
||||
.modalNT .modal-tap .btnlistLine {border-top:1px solid #a2a2a2;}
|
||||
/*빨간색_왼쪽정렬버튼*/
|
||||
.modalNT .modal-tap .btnlistBox .btnRed {background:#c50049; color:#fff; margin-left:0;}
|
||||
.modalNT .modal-tap .btnlistBox .btnRed:hover {background:#bb0045;}
|
||||
/* 초록색_우측정렬버튼 */
|
||||
.modalNT .modal-tap .btnlistBox .btnMint {background:#377ec1; color:#fff; float:right;}
|
||||
.modalNT .modal-tap .btnlistBox .btnMint:hover {background:#377ec1;}
|
||||
/* 초록색_우측정렬우측마진제거버튼*/
|
||||
.modalNT .modal-tap .btnlistBox .btnMintNoMargin {background:#377ec1; color:#fff; float:right; margin-right:0;}
|
||||
.modalNT .modal-tap .btnlistBox .btnMintNoMargin:hover {background:#377ec1;}
|
||||
/* 회색_좌측정렬버튼 */
|
||||
.modalNT .modal-tap .btnlistBox .btnMintLeft {background:#377ec1; color:#fff; float:left;}
|
||||
.modalNT .modal-tap .btnlistBox .btnMint:hover {background:#377ec1;}
|
||||
/* 회색_우측정렬버튼 */
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayRight {background:#8e949d; color:rgba(49, 58, 70, .8); float:right;}
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayRight:hover {background:#878c95;}
|
||||
/* 회색_왼쪽정렬좌측마진제거버튼(맨끝 첫번째) */
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayLeftMargin {background:#8e949d; color:rgba(49, 58, 70, .8); margin-left:0;}
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayLeft:hover {background:#878c95;}
|
||||
/* 회색_우측정렬우측마진제거버튼(맨끝 첫번째) */
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayRightMargin {background:#8e949d; color:rgba(49, 58, 70, .8); float:right; margin-right:0;}
|
||||
.modalNT .modal-tap .btnlistBox .btnGrayRightMargin:hover {background:#878c95;}
|
||||
|
||||
.modalNT.in {overflow-y: auto;}
|
||||
/* emily 추가 종료 */
|
||||
@@ -0,0 +1,5 @@
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
.project_wrap .same main .main_img .text_box { bottom:0; text-align:left; justify-content:flex-start; }
|
||||
.project_wrap .same main .main_img .text_box > div { padding:30px 20px; }
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
/* main_img */
|
||||
.project_wrap .same main .main_img .text_box { top:0; }
|
||||
.project_wrap .same main .main_img .text_box p { color:#000; }
|
||||
.project_wrap .same main .content1 .sub_text span { font-weight:700; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
.project_wrap .same main .main_img .text_box { height:100%; justify-content:flex-start; text-align:left; }
|
||||
.project_wrap .same main .main_img .text_box > div { padding:30px 20px; }
|
||||
.project_wrap .same main .main_img .text_box p.sub_text { margin-top:30px; }
|
||||
}
|
||||
11
src/main/resources/static/css/web/petit/petitLaserSelect.css
Normal file
11
src/main/resources/static/css/web/petit/petitLaserSelect.css
Normal file
@@ -0,0 +1,11 @@
|
||||
/* main_img */
|
||||
.project_wrap .same aside ul li a { line-height:normal; }
|
||||
.project_wrap .same main .main_img .text_box { top:0; }
|
||||
.project_wrap .same main .main_img .text_box p { color:#000; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
.project_wrap .same main .main_img .text_box { height:100%; justify-content:flex-start; text-align:left; }
|
||||
.project_wrap .same main .main_img .text_box > div { padding:30px 20px; }
|
||||
.project_wrap .same main .main_img .text_box p.sub_text { margin-top:30px; }
|
||||
}
|
||||
217
src/main/resources/static/css/web/quick_menu/quick_menu.css
Normal file
217
src/main/resources/static/css/web/quick_menu/quick_menu.css
Normal file
@@ -0,0 +1,217 @@
|
||||
/* 퀵메뉴 전체가 함께 둥실둥실하는 애니메이션 - 더 임팩트있게 */
|
||||
@keyframes groupFloat {
|
||||
0% { transform: translateY(0px) translateX(0px) rotate(0deg); }
|
||||
20% { transform: translateY(-25px) translateX(5px) rotate(1.5deg); }
|
||||
40% { transform: translateY(-35px) translateX(-3px) rotate(-1deg); }
|
||||
60% { transform: translateY(-20px) translateX(7px) rotate(2deg); }
|
||||
80% { transform: translateY(-15px) translateX(-4px) rotate(-0.5deg); }
|
||||
100% { transform: translateY(0px) translateX(0px) rotate(0deg); }
|
||||
}
|
||||
|
||||
/* 개별 아이템 미세 움직임 - 더 다이나믹하게 */
|
||||
@keyframes itemWiggle1 {
|
||||
0%, 100% { transform: rotate(0deg) scale(1); }
|
||||
25% { transform: rotate(2deg) scale(1.03); }
|
||||
50% { transform: rotate(0deg) scale(1.05); }
|
||||
75% { transform: rotate(-1.5deg) scale(1.02); }
|
||||
}
|
||||
|
||||
@keyframes itemWiggle2 {
|
||||
0%, 100% { transform: rotate(0deg) scale(1); }
|
||||
25% { transform: rotate(-2.5deg) scale(1.02); }
|
||||
50% { transform: rotate(0deg) scale(1.04); }
|
||||
75% { transform: rotate(1.8deg) scale(1.03); }
|
||||
}
|
||||
|
||||
/* 간단한 퀵메뉴 - 큰 이미지에 맞춘 위치 */
|
||||
.quick-menu-simple {
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
right: 20px;
|
||||
z-index: 2000;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 5px;
|
||||
animation: groupFloat 5.5s ease-in-out infinite;
|
||||
transform-origin: center center;
|
||||
}
|
||||
|
||||
/* 퀵메뉴 아이템 기본 스타일 - width만 지정, 높이는 자동 비율 조정 */
|
||||
.quick-item {
|
||||
width: 180px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
background: none;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.quick-item:hover {
|
||||
transform: scale(1.05);
|
||||
z-index: 2001;
|
||||
}
|
||||
|
||||
.quick-item img {
|
||||
width: 180px;
|
||||
object-fit: contain;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
/* 카카오톡 상담 - 미세한 추가 움직임 */
|
||||
.kakao-consult {
|
||||
animation: itemWiggle1 3.2s ease-in-out infinite;
|
||||
animation-delay: 0.3s;
|
||||
}
|
||||
|
||||
/* 전화 상담 - 슬라이드 효과 (높이 문제 해결) */
|
||||
.phone-consult {
|
||||
animation: itemWiggle2 3.8s ease-in-out infinite;
|
||||
animation-delay: 1s;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 기본 이미지는 relative로 높이를 만들어줌 */
|
||||
.phone-default {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: transform 0.3s ease;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.phone-default img {
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
/* 전화번호 이미지는 absolute로 오버레이 */
|
||||
.phone-number {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: transform 0.3s ease;
|
||||
transform: translateX(100%);
|
||||
}
|
||||
|
||||
.phone-number img {
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
/* 호버 시 슬라이드 효과 */
|
||||
.phone-consult:hover .phone-default {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.phone-consult:hover .phone-number {
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
/* 전화상담 호버시 애니메이션 일시정지 */
|
||||
.phone-consult:hover {
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
/* 추가 애니메이션 효과 - 페이드 인 */
|
||||
.quick-menu-simple {
|
||||
animation: fadeInUp 0.8s ease-out, groupFloat 5.5s ease-in-out infinite 0.8s;
|
||||
}
|
||||
|
||||
@keyframes fadeInUp {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
/* 모바일 반응형 */
|
||||
@media (max-width: 768px) {
|
||||
.quick-menu-simple {
|
||||
bottom: 100px;
|
||||
right: 10px;
|
||||
gap: 4px;
|
||||
animation: fadeInUp 0.8s ease-out, groupFloat 6s ease-in-out infinite 0.8s;
|
||||
}
|
||||
|
||||
.quick-item {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.quick-item img {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.phone-default img {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.phone-number img {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.kakao-consult {
|
||||
animation: itemWiggle1 4.2s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.phone-consult {
|
||||
animation: itemWiggle2 4.8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes groupFloat {
|
||||
0% { transform: translateY(0px) translateX(0px) rotate(0deg); }
|
||||
20% { transform: translateY(-18px) translateX(3px) rotate(1deg); }
|
||||
40% { transform: translateY(-25px) translateX(-2px) rotate(-0.8deg); }
|
||||
60% { transform: translateY(-12px) translateX(4px) rotate(1.2deg); }
|
||||
80% { transform: translateY(-8px) translateX(-2px) rotate(-0.5deg); }
|
||||
100% { transform: translateY(0px) translateX(0px) rotate(0deg); }
|
||||
}
|
||||
}
|
||||
|
||||
/* 작은 화면에서 더 축소 */
|
||||
@media (max-width: 480px) {
|
||||
.quick-menu-simple {
|
||||
bottom: 80px;
|
||||
gap: 3px;
|
||||
}
|
||||
|
||||
.quick-item {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.quick-item img {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.phone-default img {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.phone-number img {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
@keyframes groupFloat {
|
||||
0% { transform: translateY(0px) translateX(0px) rotate(0deg); }
|
||||
20% { transform: translateY(-15px) translateX(2px) rotate(0.8deg); }
|
||||
40% { transform: translateY(-22px) translateX(-1px) rotate(-0.6deg); }
|
||||
60% { transform: translateY(-10px) translateX(3px) rotate(1deg); }
|
||||
80% { transform: translateY(-6px) translateX(-1px) rotate(-0.4deg); }
|
||||
100% { transform: translateY(0px) translateX(0px) rotate(0deg); }
|
||||
}
|
||||
}
|
||||
616
src/main/resources/static/css/web/service/makeReservation.css
Normal file
616
src/main/resources/static/css/web/service/makeReservation.css
Normal file
@@ -0,0 +1,616 @@
|
||||
.fix_area {
|
||||
min-width: 1200px;
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
.contents_area{
|
||||
margin-top:50px;
|
||||
margin-bottom:30px;
|
||||
}
|
||||
|
||||
.reservation_ul{
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.reservation_ul>li{
|
||||
width: calc((100% - 40px) / 3);
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
box-shadow: 2px 2px 15px rgba(0, 0, 0, .05);
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
|
||||
}
|
||||
|
||||
.section_div{
|
||||
position: relative;
|
||||
height: 800px;
|
||||
background-color: #f5f5f5;
|
||||
border: 1px solid #ddd;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.section_div_wrap {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.tit-box_div{
|
||||
position: relative;
|
||||
padding: 1.6rem 2.8rem 0;
|
||||
display: flex;
|
||||
gap: 19px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.step_span{
|
||||
color: #A73439;
|
||||
font-size:2rem;
|
||||
}
|
||||
|
||||
.reservation-box_div {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.main-item-info{
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.w_top_select {
|
||||
height: calc(100% - 155px);
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.service-list-wrap {
|
||||
padding-top: .666rem;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.service-list-wrap li{
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.s_item{
|
||||
padding-bottom:20px;
|
||||
}
|
||||
|
||||
.w_top_select .selt_info_wrap:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.w_top_select .selt_info_wrap {
|
||||
padding: 20px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #ddd;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.selt_info_wrap {
|
||||
position: relative;
|
||||
min-height: 4.5rem;
|
||||
}
|
||||
|
||||
.w_top_select .selt_info_wrap .selt {
|
||||
padding-top: 0;
|
||||
padding-left: 10px;
|
||||
padding-right: 0.5em;
|
||||
width: 61%;
|
||||
}
|
||||
|
||||
.item_subprice {
|
||||
min-height: 42px;
|
||||
}
|
||||
|
||||
.item_subprice>span{
|
||||
font-size:1.8rem;
|
||||
}
|
||||
|
||||
|
||||
.w_top_select .selt_info_wrap .info {
|
||||
position: relative;
|
||||
padding-right: 30px;
|
||||
width: 45%;
|
||||
top: 0.7rem;
|
||||
width: 9em;
|
||||
}
|
||||
|
||||
.w_top_select .selt_info_wrap .info div{
|
||||
display:block;
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
.w_top_select .selt_info_wrap .info button {
|
||||
position: absolute;
|
||||
top: 1rem;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.bn{
|
||||
border:none;
|
||||
background-color:#fff;
|
||||
}
|
||||
|
||||
button > img {
|
||||
display: block;
|
||||
}
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
.d-block{
|
||||
display:block;
|
||||
}
|
||||
|
||||
.original_price {
|
||||
color: #757575;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.discount_price {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
font-size:2rem;
|
||||
color: #A73439;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.section-botton_div .total {
|
||||
background-color: #F5F5F5;
|
||||
border-top: 2px solid #A73439;
|
||||
}
|
||||
|
||||
.section-botton_div .total {
|
||||
position: relative;
|
||||
background-color: #e6e6e6;
|
||||
padding: 20px 20px 15px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.border-t.dk {
|
||||
border-color: #221e1f;
|
||||
}
|
||||
|
||||
.section-botton_div{
|
||||
position:absolute;
|
||||
bottom:0;
|
||||
left:0;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
|
||||
.section-botton_div .total .left {
|
||||
position: absolute;
|
||||
top: 2.5rem;
|
||||
left: 1.5rem;
|
||||
font-size:1.8rem;
|
||||
}
|
||||
|
||||
.section-botton_div .total .right {
|
||||
text-align: right;
|
||||
padding-left: 5em;
|
||||
padding-bottom: 1rem;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
|
||||
.section-botton_div .total .txt-small {
|
||||
font-size: 9pt;
|
||||
line-height: 1.5em;
|
||||
opacity: 0.7;
|
||||
font-weight: 400;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
|
||||
.total_price {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
|
||||
.calender_div{
|
||||
position:relative;
|
||||
padding:30px;
|
||||
height:460px;
|
||||
}
|
||||
|
||||
.tui-datepicker {
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.customer-info_div{
|
||||
padding:20px 30px;
|
||||
height:460px;
|
||||
}
|
||||
.customer-info_div .form-label{
|
||||
float: none;
|
||||
padding-top: 0;
|
||||
width: 100%;
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
color: #444;
|
||||
font-weight: 500;
|
||||
font-size: 2rem;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.form-box{
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.form-box > .right_sec {
|
||||
float: none;
|
||||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px 4px;
|
||||
}
|
||||
|
||||
.fm_ctrl {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 7px 5px !important;
|
||||
font-size: 1.7rem;
|
||||
line-height: 1;
|
||||
background-color: #fff;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius:3px;
|
||||
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
|
||||
}
|
||||
|
||||
.__counsl_wrap .wsnwp {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 1px solid #A73439;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.__counsl_wrap .wsnwp > label {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
margin-bottom:0px !important;
|
||||
}
|
||||
|
||||
._cs-radio input[type=radio]:not(old):checked + .r_visible > span {
|
||||
background-color: #A73439;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
._cs-radio input[type=radio] + .r_visible > span {
|
||||
background-color: #FFFFFF;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 7px 0;
|
||||
color: #A73439;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
._cs-radio input[type=radio]:not(old) {
|
||||
width: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
._cs-radio input[type="radio"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.request_memo{
|
||||
width:100%;
|
||||
font-size: 1.7rem;
|
||||
padding:3px;
|
||||
}
|
||||
|
||||
.section-bottom_div{
|
||||
position:relative;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.b-border{
|
||||
border-bottom:solid 1px #ddd;
|
||||
}
|
||||
|
||||
.time_div{
|
||||
margin:15px 0px;
|
||||
}
|
||||
.time-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 16px 12px; /* 세로, 가로 간격 */
|
||||
max-width: 350px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.time-btn {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
padding: 10px 0;
|
||||
border: 1px solid #bbb;
|
||||
border-radius: 20px;
|
||||
background: #fff;
|
||||
color: #444;
|
||||
font-size: 1.3rem;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s, color 0.2s, border 0.2s;
|
||||
}
|
||||
.time-btn.active {
|
||||
background: #007bff;
|
||||
color: #fff;
|
||||
border-color: #007bff;
|
||||
}
|
||||
|
||||
|
||||
.tui-calendar-date.tui-calendar-sun {
|
||||
color: #e74c3c !important;
|
||||
}
|
||||
|
||||
/* 토요일: 회색 */
|
||||
.tui-calendar-date.tui-calendar-sat {
|
||||
color: #0000ff !important;
|
||||
}
|
||||
|
||||
.tui-datepicker-type-date{
|
||||
width:100% !important;
|
||||
}
|
||||
|
||||
/* 달력 전체 폰트 크기 및 셀 크기 키우기 */
|
||||
.tui-datepicker {
|
||||
width:83%;
|
||||
font-size: 22px !important; /* 달력 전체 폰트 크기 */
|
||||
}
|
||||
|
||||
.tui-calendar {
|
||||
width:100% !important;
|
||||
font-size: 22px !important; /* 달력 내부 폰트 크기 */
|
||||
}
|
||||
|
||||
.tui-calendar-date {
|
||||
font-size: 22px !important; /* 날짜 숫자 크기 */
|
||||
min-width: 48px;
|
||||
min-height: 48px;
|
||||
line-height: 48px;
|
||||
}
|
||||
|
||||
/* 요일(일~토) 폰트 크기 */
|
||||
.tui-calendar-day {
|
||||
font-size: 20px !important;
|
||||
}
|
||||
|
||||
/* 달력 헤더(년/월) 폰트 크기 */
|
||||
.tui-calendar-header {
|
||||
font-size: 24px !important;
|
||||
}
|
||||
|
||||
/* 네비게이션(이전/다음) 버튼 크기 */
|
||||
.tui-calendar-btn {
|
||||
font-size: 24px !important;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.selected-time_div{
|
||||
padding:10px 30px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.selected-time_div>span{
|
||||
display:inline-block;
|
||||
|
||||
}
|
||||
|
||||
.selected-time_div .tit_span{
|
||||
color:#6a6a6a;
|
||||
font-size:1.5rem;
|
||||
width:20%;
|
||||
text-align:center;
|
||||
}
|
||||
.person-cnt_span{
|
||||
color:#0080ff;
|
||||
font-size:2rem;
|
||||
}
|
||||
.person-cnt_span>b{
|
||||
color:#6a6a6a;
|
||||
font-size:1.5rem;
|
||||
}
|
||||
|
||||
.checkbox-area_div{
|
||||
padding:30px;
|
||||
min-height:240px;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
border: 1px solid #a73439;
|
||||
background-color: #a73439;
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
height: 56px;
|
||||
}
|
||||
|
||||
.disabled-sunday {
|
||||
color: #e74c3c !important; /* 빨간색 */
|
||||
background: #f9d6d5 !important; /* 연한 빨간 배경 (선택) */
|
||||
cursor: not-allowed !important;
|
||||
}
|
||||
|
||||
.height850{
|
||||
height: 850px;
|
||||
}
|
||||
|
||||
/* ====== 반응형 웹 미디어 쿼리 추가 ====== */
|
||||
|
||||
/* 1. PC 기준(1200px 이상) */
|
||||
@media (min-width: 1200px) {
|
||||
.fix_area {
|
||||
min-width: 1200px;
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 0 16px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 2. 태블릿(1200px 미만 ~ 768px 이상) */
|
||||
@media (max-width: 1199px) and (min-width: 768px) {
|
||||
.fix_area {
|
||||
min-width: 100%;
|
||||
width: 100%;
|
||||
padding: 0 10px;
|
||||
}
|
||||
.reservation_ul {
|
||||
gap: 12px;
|
||||
}
|
||||
.reservation_ul > li {
|
||||
width: calc((100% - 24px) / 3);
|
||||
border-radius: 16px;
|
||||
}
|
||||
.section_div {
|
||||
height: 650px;
|
||||
}
|
||||
.calender_div,
|
||||
.customer-info_div,
|
||||
.checkbox-area_div {
|
||||
padding: 16px;
|
||||
height: 350px;
|
||||
}
|
||||
.selected-time_div {
|
||||
padding: 8px 10px;
|
||||
}
|
||||
.btn-primary {
|
||||
height: 48px;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
.time-grid {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
max-width: 270px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 3. 모바일(767px 이하) */
|
||||
@media (max-width: 767px) {
|
||||
.fix_area {
|
||||
min-width: 100%;
|
||||
width: 100%;
|
||||
padding: 0 4px;
|
||||
}
|
||||
.reservation_ul {
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
.reservation_ul > li {
|
||||
width: 100%;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.section_div {
|
||||
height: auto;
|
||||
min-height: 500px;
|
||||
padding: 0;
|
||||
}
|
||||
.section_div_wrap,
|
||||
.reservation-box_div,
|
||||
.main-item-info,
|
||||
.service-list-wrap,
|
||||
.customer-info_div,
|
||||
.calender_div,
|
||||
.checkbox-area_div {
|
||||
position: static;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 10px 4px;
|
||||
}
|
||||
.tit-box_div {
|
||||
padding: 1rem 1rem 0;
|
||||
gap: 10px;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.step_span,
|
||||
.form-label,
|
||||
.item_subprice > span,
|
||||
.discount_price,
|
||||
.total_price,
|
||||
.person-cnt_span {
|
||||
font-size: 1.2rem !important;
|
||||
}
|
||||
.w_top_select .selt_info_wrap {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 10px 0;
|
||||
}
|
||||
.w_top_select .selt_info_wrap .selt,
|
||||
.w_top_select .selt_info_wrap .info {
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
text-align: left;
|
||||
}
|
||||
.section-botton_div .total {
|
||||
padding: 10px 4px 10px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.section-botton_div .total .left,
|
||||
.section-botton_div .total .right {
|
||||
position: static;
|
||||
padding: 0;
|
||||
font-size: 1rem;
|
||||
text-align: left;
|
||||
}
|
||||
.selected-time_div {
|
||||
padding: 4px 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.selected-time_div .tit_span {
|
||||
font-size: 1rem;
|
||||
width: auto;
|
||||
}
|
||||
.btn-primary {
|
||||
height: 44px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.time-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
max-width: 180px;
|
||||
gap: 8px 6px;
|
||||
}
|
||||
.tui-datepicker,
|
||||
.tui-calendar {
|
||||
width: 100% !important;
|
||||
font-size: 1rem !important;
|
||||
}
|
||||
.tui-calendar-date,
|
||||
.tui-calendar-day,
|
||||
.tui-calendar-header,
|
||||
.tui-calendar-btn {
|
||||
font-size: 1rem !important;
|
||||
min-width: 32px;
|
||||
min-height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ====== 끝 ====== */
|
||||
|
||||
95
src/main/resources/static/css/web/service/serviceInfo.css
Normal file
95
src/main/resources/static/css/web/service/serviceInfo.css
Normal file
@@ -0,0 +1,95 @@
|
||||
/* main_img */
|
||||
.project_wrap .same{min-height:880px;}
|
||||
.project_wrap .same main .main_img .text_box > div { width:50%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p { font-size:52px; color:#000; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p span { font-weight:700; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p { color:#fff; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#fff; }
|
||||
/* content5 */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
|
||||
.project_wrap .same aside {background: white; width: 30%; top: 12%;}
|
||||
.project_wrap .same aside ul{position: fixed; left: 5%; width: 19%;}
|
||||
.project_wrap .same aside ul li{margin-bottom: 0.5rem; margin-top: 0px;}
|
||||
.project_wrap .same aside .first {padding-top: 1rem; padding-bottom: 1rem;}
|
||||
.project_wrap .same aside .nonactive {border: 1px solid #d8d8d8; background-color: #f9f9fb;}
|
||||
.project_wrap .same aside .active {border: 1px solid #d8d8d8; color: #a73439; background-color: rgba(118, 35, 47, 0); border-left: 2px solid #a73439;}
|
||||
.project_wrap .same aside ul a{padding-left: 10px;}
|
||||
.project_wrap .same main {width: 60%; padding-top: 7%;}
|
||||
.project_wrap .same main ul{padding-top: 2%; width:102%;}
|
||||
|
||||
.add-ticket-btn {
|
||||
font-size: 1.2rem;
|
||||
font-weight: 400;
|
||||
letter-spacing: -0.03em;
|
||||
padding: .35rem 1rem;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 50em;
|
||||
transition: 0.2s;
|
||||
background:white;
|
||||
}
|
||||
.right { float: right;}
|
||||
.left { float: left;}
|
||||
.card_otxt {
|
||||
position: relative;
|
||||
display: block;
|
||||
border-radius: 1rem;
|
||||
padding: 1rem;
|
||||
}
|
||||
.border {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
.__card_otxt {
|
||||
height: 95px;
|
||||
}
|
||||
.row>.col2 {
|
||||
width: 50%;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.row.row_padding>.col2, .row.row_padding>.col3, .row.row_padding>.col4, .row.row_padding>.col5 {
|
||||
padding-right: 1rem;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
.row.row_padding {
|
||||
margin-left: -1rem;
|
||||
margin-right: -1rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.border-b {
|
||||
border-bottom: 1px solid #ddd;
|
||||
height:5%;
|
||||
}
|
||||
.txt_num {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
.card_otxt .ab_cont {
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
top: 3.4rem;
|
||||
width: 8.5em;
|
||||
text-align: right;
|
||||
}
|
||||
.card_otxt .fix_cont {
|
||||
padding-right: 11.5rem;
|
||||
}
|
||||
.card_otxt .fix_cont p {
|
||||
margin-bottom: 0;
|
||||
word-break: keep-all;
|
||||
}
|
||||
.pagination li a{float: none;}
|
||||
.mb3{margin-bottom: 3rem;}
|
||||
.mt70{margin-top: 70%;}
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* main_img */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
.project_wrap .same main .main_img .text_box > div { width:100%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p br { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#000; }
|
||||
.project_wrap .same main {width: 100%;}
|
||||
}
|
||||
435
src/main/resources/static/css/web/service/webServiceDetail.css
Normal file
435
src/main/resources/static/css/web/service/webServiceDetail.css
Normal file
@@ -0,0 +1,435 @@
|
||||
/* main_img */
|
||||
.project_wrap .same main .main_img .text_box > div { width:50%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p { font-size:52px; color:#000; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p span { font-weight:700; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p { color:#fff; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#fff; }
|
||||
/* content5 */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* main_img */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
.project_wrap .same main .main_img .text_box > div { width:100%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p br { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#000; }
|
||||
}
|
||||
|
||||
|
||||
.fix_area {
|
||||
min-width: 1200px;
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
.btn-basic {
|
||||
width:120px;
|
||||
height:40px;
|
||||
border: 1px solid #a73439;
|
||||
border-radius:5px;
|
||||
background-color: white;
|
||||
color: #a73439;
|
||||
}
|
||||
|
||||
.clear:after {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
font-size: 0;
|
||||
clear: both;
|
||||
content: "";
|
||||
}
|
||||
|
||||
|
||||
.clear > .right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.clear > .left{
|
||||
float:left;
|
||||
}
|
||||
|
||||
.main-img-size {
|
||||
position: relative;
|
||||
width: 655px;
|
||||
height: 368px;
|
||||
overflow: hidden;
|
||||
border-radius: 0.25rem;
|
||||
text-align: center;
|
||||
}
|
||||
.img_center img {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
.thumbnail-bottom-txt {
|
||||
padding-top: 15px;
|
||||
}
|
||||
|
||||
.thumbnail-bottom-txt > span {
|
||||
display: block;
|
||||
color: #6c696a;
|
||||
font-size: 13.5px;
|
||||
}
|
||||
|
||||
.content>.wp60 {
|
||||
width: 60%;
|
||||
}
|
||||
.content>.wp40 {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.wp10{
|
||||
width:10%;
|
||||
}
|
||||
.wp90{
|
||||
width:90%;
|
||||
}
|
||||
|
||||
|
||||
.content>[class^=wp] {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.consultation-info h2{
|
||||
font-size: 4rem;
|
||||
}
|
||||
.consultation-info p{
|
||||
margin-top: 2rem;
|
||||
font-size:2rem;
|
||||
}
|
||||
|
||||
|
||||
.consultation-info .price {
|
||||
display: block;
|
||||
font-size: 3rem;
|
||||
margin-top: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.price-area .border-line {
|
||||
height: 1px;
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
|
||||
.hashtag_list{
|
||||
padding: 1rem 0 1.5rem;
|
||||
}
|
||||
|
||||
.hashtag_list span{
|
||||
font-size:1.6rem;
|
||||
color:#a94442;
|
||||
}
|
||||
|
||||
|
||||
.procedure-area>.procedure_select_txt{
|
||||
float: left;
|
||||
width: 7rem;
|
||||
line-height: 1.5;
|
||||
padding-top: 0.375rem;
|
||||
}
|
||||
|
||||
.procedure-area > .dropdown_area {
|
||||
float: right;
|
||||
width: calc(100% - 7rem);
|
||||
}
|
||||
|
||||
.select_procedure_div {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.select_procedure_div .default_item {
|
||||
padding-top: 0.5rem;
|
||||
padding-left: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.select_procedure_div .default_item {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-right: 2.5rem;
|
||||
background-color: #fff;
|
||||
border: 1px solid #cb9f76;
|
||||
text-align: left;
|
||||
border-radius: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
.option_scrl_wrap {
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
z-index:1;
|
||||
}
|
||||
|
||||
.select_procedure_div.active .option_scrl_wrap {
|
||||
border: 1px solid #76232f;
|
||||
}
|
||||
|
||||
.select_service_form.active .default_item:after {
|
||||
border-top-color: #333;
|
||||
}
|
||||
|
||||
.default_item:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 1.1em;
|
||||
margin-top: -0.2rem;
|
||||
border: 0.28571428em solid transparent;
|
||||
border-top-color: #999;
|
||||
}
|
||||
|
||||
|
||||
.optipon_item {
|
||||
padding: 0.4rem 0.5rem;
|
||||
}
|
||||
|
||||
.sepr_wrap {
|
||||
position: relative;
|
||||
min-height: 2.5rem;
|
||||
}
|
||||
|
||||
.item_subprice {
|
||||
min-height: 42px;
|
||||
}
|
||||
|
||||
.select_procedure_div.active .option_scrl_wrap {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: -1px;
|
||||
left: -1px;
|
||||
background-color: #fff;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.cs-checkbox > label.d-block {
|
||||
display: block;
|
||||
}
|
||||
.cs-checkbox > label {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
padding-left: 30px;
|
||||
margin: 0;
|
||||
line-height: 20px;
|
||||
transition: color .3s ease-out;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.oi-wrap {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: justify;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
/* .cs-checkbox input[type="checkbox"] { */
|
||||
/* visibility: hidden; */
|
||||
/* display: none; */
|
||||
/* } */
|
||||
|
||||
/* .cs-checkbox > label:before, .cs-radio > .r_visible { */
|
||||
/* border: 1px solid #ccc; */
|
||||
/* } */
|
||||
|
||||
input[type="checkbox"] {
|
||||
transform: scale(1.5); /* 크기를 1.5배로 확대 */
|
||||
}
|
||||
|
||||
.idxChk{
|
||||
position:absolute;
|
||||
}
|
||||
|
||||
.cs-checkbox > label:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: inline-block;
|
||||
margin-right: 0.8em;
|
||||
border-radius: 0;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.oi-wrap .oi-txt {
|
||||
flex: 0 0 65%;
|
||||
max-width: 65%;
|
||||
}
|
||||
|
||||
.option_list {
|
||||
display: block;
|
||||
background: #fff;
|
||||
max-height: 224px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
|
||||
.oi-wrap .oi-price {
|
||||
flex: 0 0 35%;
|
||||
max-width: 35%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.original_price {
|
||||
color: #757575;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.d-block {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.discount_price {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
|
||||
.procedure-area:after {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
font-size: 0;
|
||||
clear: both;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.selected-procedure{
|
||||
margin-top:20px;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
|
||||
.selected-procedure .selt_info_wrap .info {
|
||||
top: 0.7rem;
|
||||
width: 9.5em;
|
||||
padding-top: 0.3em;
|
||||
}
|
||||
|
||||
.selt_info_wrap .info {
|
||||
position: absolute;
|
||||
top: 0.2rem;
|
||||
right: 0.2rem;
|
||||
width: 8.5em;
|
||||
padding-right: 1rem;
|
||||
padding-top: 0.2em;
|
||||
text-align: right;
|
||||
}
|
||||
.selt_info_wrap .info button{
|
||||
border:none;
|
||||
background-color:#fff;
|
||||
}
|
||||
|
||||
|
||||
.real_price {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
|
||||
.selected-procedure .selt_info_wrap {
|
||||
padding: 0.8rem 0;
|
||||
z-index:0;
|
||||
}
|
||||
|
||||
.selt_info_wrap {
|
||||
position: relative;
|
||||
min-height: 2.5rem;
|
||||
background-color:#fff;
|
||||
border:1px solid #eee;
|
||||
}
|
||||
|
||||
.selected-procedure .selt_info_wrap .selt {
|
||||
padding-right: 9.5em;
|
||||
padding-left: 1rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.selt_info_wrap .selt {
|
||||
padding-top: 0.3em;
|
||||
padding-right: 8.5em;
|
||||
}
|
||||
|
||||
.total-price-area .total {
|
||||
position: relative;
|
||||
background-color: #e6e6e6;
|
||||
padding: 25px 25px 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.total-price-area .total .txt_sub {
|
||||
color: #222222;
|
||||
font-size: 2rem;
|
||||
opacity: 1;
|
||||
}
|
||||
.total-price-area .total .right strong {
|
||||
font-size: 22px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.total-price-area .total-price-txt {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
|
||||
.total-price-area .total .bs-txt {
|
||||
position: absolute;
|
||||
bottom: 17px;
|
||||
right: 25px;
|
||||
display: block;
|
||||
margin-top: 4px;
|
||||
font-size: 12px;
|
||||
color: #999999;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
|
||||
|
||||
.main_btn {
|
||||
text-align: right;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
.main_btn button {
|
||||
width: 180px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
|
||||
.fastrack-btn {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
border: 1px solid #a73439;
|
||||
background-color: #a73439;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.img-content{
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.img-area{
|
||||
padding-top: 70px;
|
||||
padding-bottom: 200px;
|
||||
text-align:center;
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
.project_wrap .same main .main_img .text_box { bottom:auto; top:50%; transform:translateY(-50%); }
|
||||
.project_wrap .same main .main_img .text_box p { color:#000; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
.project_wrap .same main .main_img .text_box { text-align:left; justify-content:flex-start; }
|
||||
.project_wrap .same main .main_img .text_box > div { padding:30px 20px; }
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
.project_wrap .same main .main_img .text_box { bottom:0; text-align:left; justify-content:flex-start; }
|
||||
.project_wrap .same main .main_img .text_box > div { padding:30px 20px; }
|
||||
}
|
||||
13
src/main/resources/static/css/web/swiper-bundle.min.css
vendored
Normal file
13
src/main/resources/static/css/web/swiper-bundle.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
61
src/main/resources/static/css/web/voc/webVOC.css
Normal file
61
src/main/resources/static/css/web/voc/webVOC.css
Normal file
@@ -0,0 +1,61 @@
|
||||
.project_wrap main { padding:100px; }
|
||||
.project_wrap main h3 { font-size:34px; font-weight:400; line-height:45px; }
|
||||
.project_wrap main h3 span { font-weight:700; }
|
||||
.project_wrap main ul { margin-top:50px; display:flex; flex-wrap:wrap; }
|
||||
.project_wrap main ul li { width:calc((100% - 40px) / 3); margin-left:20px; }
|
||||
.project_wrap main ul li:nth-child(3n-2) { margin-left:0; }
|
||||
.project_wrap main ul li:nth-child(n+4) { margin-top:50px; }
|
||||
.project_wrap main ul li a { display:block; }
|
||||
.project_wrap main ul li .img_box { width:100%; background:#f5f5f5; }
|
||||
.project_wrap main ul li .img_box img { width:100%; }
|
||||
.project_wrap main ul li .text_box { padding-top:30px; }
|
||||
.project_wrap main ul li .text_box p { color:#777; }
|
||||
.project_wrap main ul li .text_box p.title { font-size:30px; font-weight:700; }
|
||||
.project_wrap main ul li .text_box p.date { margin-top:5px; font-size:23px; }
|
||||
|
||||
|
||||
.hrtag {width: 60em; background-color: rgb(249,249,251); margin-top:1.5em; margin-bottom:1.5em;}
|
||||
.board_write {width: 60em; border:1px;}
|
||||
.board_write th{ margin-top:1%; height:3em; background-color: rgb(249,249,251);}
|
||||
.board_write td{ margin-top:1%; height:3em;}
|
||||
.board_write .teltd{margin: 0; padding-top: 0; padding-bottom: 0; padding-right: 0; text-align: right;}
|
||||
.board_write .input_select {height:3em; width: -webkit-fill-available; border:none;}
|
||||
.board_write .input_text { height:3em; width: -webkit-fill-available; border:none;}
|
||||
.board_write .input_text_area { width: -webkit-fill-available; border:none;}
|
||||
.board_write .input_button { height:4em; margin-left:1%; width: 38%; border:none; background-color: rgb(199, 0, 21); color: white;}
|
||||
.board_write .input_tel {width: 60%; height:4em; border:none;}
|
||||
.board_write .input_auth {width: 51%; height:4em; border:none;}
|
||||
.board_write .input_time {color: #3985EA; width: 10%; display: contents;}
|
||||
.board_write .input_radio {margin-left:1%; height:3em; vertical-align: super;}
|
||||
.board_write .label_radio {margin-left:1%; height:3em; margin-bottom:0; vertical-align: bottom;}
|
||||
.inner_wrap p {text-align:right; width: 60em; font-weight: bold;}
|
||||
.inner_wrap p .input_button { height:3em; width:50%; border:none; background-color: rgb(199, 0, 21); color: white; width: 20%; border-radius: 30px;}
|
||||
.inner_wrap .noactive{background-color: gray;}
|
||||
.bd-top{border-top: 1px solid #ddd;}
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
.project_wrap main { padding:50px 0; }
|
||||
.project_wrap main h3 { font-size:14px; text-align:center; line-height:20px; }
|
||||
.project_wrap main ul { margin-top:30px; }
|
||||
.project_wrap main ul li { width:calc((100% - 20px) / 2); margin-left:10px; }
|
||||
.project_wrap main ul li:nth-child(3n-2) { margin-left:10px; }
|
||||
.project_wrap main ul li:nth-child(odd) { margin-top:0; }
|
||||
.project_wrap main ul li:nth-child(n+3) { margin-top:20px; }
|
||||
.project_wrap main ul li .text_box { padding-top:10px; }
|
||||
.project_wrap main ul li .text_box p.title { font-size:14px; }
|
||||
.project_wrap main ul li .text_box p.date { margin-top:3px; font-size:12px; }
|
||||
|
||||
.hrtag {width: 40em; background-color: rgb(249,249,251);}
|
||||
.board_write {width: 40em; font-size:12px; border:1px;}
|
||||
.board_write td{ margin-top:1%; height:2.5em;}
|
||||
.board_write .input_select {height:2em; width: -webkit-fill-available}
|
||||
.board_write .input_text { height:2em; width: -webkit-fill-available}
|
||||
.board_write .input_text_area { width: -webkit-fill-available}
|
||||
.board_write .input_button { height:2.5em; margin-left:0.5%; width: 28%;}
|
||||
.board_write .input_tel {width: 70%; height:2.5em;}
|
||||
.board_write .input_radio {margin-left:1%; height:2em;}
|
||||
.board_write .label_radio {margin-left:1%; height:2em; margin-bottom:0; vertical-align: text-bottom;}
|
||||
.inner_wrap p {text-align:right; width: 40em; font-weight: bold;}
|
||||
.inner_wrap p .input_button { height:3em; width: 7em; background-color: rgb(199, 0, 21); color: white;}
|
||||
}
|
||||
435
src/main/resources/static/css/web/webevent/webEventSelect.css
Normal file
435
src/main/resources/static/css/web/webevent/webEventSelect.css
Normal file
@@ -0,0 +1,435 @@
|
||||
/* main_img */
|
||||
.project_wrap .same main .main_img .text_box > div { width:50%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p { font-size:52px; color:#000; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p span { font-weight:700; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p { color:#fff; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#fff; }
|
||||
/* content5 */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* main_img */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
.project_wrap .same main .main_img .text_box > div { width:100%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p br { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#000; }
|
||||
}
|
||||
|
||||
|
||||
.fix_area {
|
||||
min-width: 1200px;
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
.btn-basic {
|
||||
width:120px;
|
||||
height:40px;
|
||||
border: 1px solid #a73439;
|
||||
border-radius:5px;
|
||||
background-color: white;
|
||||
color: #a73439;
|
||||
}
|
||||
|
||||
.clear:after {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
font-size: 0;
|
||||
clear: both;
|
||||
content: "";
|
||||
}
|
||||
|
||||
|
||||
.clear > .right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.clear > .left{
|
||||
float:left;
|
||||
}
|
||||
|
||||
.main-img-size {
|
||||
position: relative;
|
||||
width: 655px;
|
||||
height: 368px;
|
||||
overflow: hidden;
|
||||
border-radius: 0.25rem;
|
||||
text-align: center;
|
||||
}
|
||||
.img_center img {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
.thumbnail-bottom-txt {
|
||||
padding-top: 15px;
|
||||
}
|
||||
|
||||
.thumbnail-bottom-txt > span {
|
||||
display: block;
|
||||
color: #6c696a;
|
||||
font-size: 13.5px;
|
||||
}
|
||||
|
||||
.content>.wp60 {
|
||||
width: 60%;
|
||||
}
|
||||
.content>.wp40 {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.wp10{
|
||||
width:10%;
|
||||
}
|
||||
.wp90{
|
||||
width:90%;
|
||||
}
|
||||
|
||||
|
||||
.content>[class^=wp] {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.consultation-info h2{
|
||||
font-size: 4rem;
|
||||
}
|
||||
.consultation-info p{
|
||||
margin-top: 2rem;
|
||||
font-size:2rem;
|
||||
}
|
||||
|
||||
|
||||
.consultation-info .price {
|
||||
display: block;
|
||||
font-size: 3rem;
|
||||
margin-top: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.price-area .border-line {
|
||||
height: 1px;
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
|
||||
.hashtag_list{
|
||||
padding: 1rem 0 1.5rem;
|
||||
}
|
||||
|
||||
.hashtag_list span{
|
||||
font-size:1.6rem;
|
||||
color:#a94442;
|
||||
}
|
||||
|
||||
|
||||
.procedure-area>.procedure_select_txt{
|
||||
float: left;
|
||||
width: 7rem;
|
||||
line-height: 1.5;
|
||||
padding-top: 0.375rem;
|
||||
}
|
||||
|
||||
.procedure-area > .dropdown_area {
|
||||
float: right;
|
||||
width: calc(100% - 7rem);
|
||||
}
|
||||
|
||||
.select_procedure_div {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.select_procedure_div .default_item {
|
||||
padding-top: 0.5rem;
|
||||
padding-left: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.select_procedure_div .default_item {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-right: 2.5rem;
|
||||
background-color: #fff;
|
||||
border: 1px solid #cb9f76;
|
||||
text-align: left;
|
||||
border-radius: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
.option_scrl_wrap {
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
z-index:1;
|
||||
}
|
||||
|
||||
.select_procedure_div.active .option_scrl_wrap {
|
||||
border: 1px solid #76232f;
|
||||
}
|
||||
|
||||
.select_service_form.active .default_item:after {
|
||||
border-top-color: #333;
|
||||
}
|
||||
|
||||
.default_item:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 1.1em;
|
||||
margin-top: -0.2rem;
|
||||
border: 0.28571428em solid transparent;
|
||||
border-top-color: #999;
|
||||
}
|
||||
|
||||
|
||||
.optipon_item {
|
||||
padding: 0.4rem 0.5rem;
|
||||
}
|
||||
|
||||
.sepr_wrap {
|
||||
position: relative;
|
||||
min-height: 2.5rem;
|
||||
}
|
||||
|
||||
.item_subprice {
|
||||
min-height: 42px;
|
||||
}
|
||||
|
||||
.select_procedure_div.active .option_scrl_wrap {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: -1px;
|
||||
left: -1px;
|
||||
background-color: #fff;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.cs-checkbox > label.d-block {
|
||||
display: block;
|
||||
}
|
||||
.cs-checkbox > label {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
padding-left: 30px;
|
||||
margin: 0;
|
||||
line-height: 20px;
|
||||
transition: color .3s ease-out;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.oi-wrap {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: justify;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
/* .cs-checkbox input[type="checkbox"] { */
|
||||
/* visibility: hidden; */
|
||||
/* display: none; */
|
||||
/* } */
|
||||
|
||||
/* .cs-checkbox > label:before, .cs-radio > .r_visible { */
|
||||
/* border: 1px solid #ccc; */
|
||||
/* } */
|
||||
|
||||
input[type="checkbox"] {
|
||||
transform: scale(1.5); /* 크기를 1.5배로 확대 */
|
||||
}
|
||||
|
||||
.idxChk{
|
||||
position:absolute;
|
||||
}
|
||||
|
||||
.cs-checkbox > label:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: inline-block;
|
||||
margin-right: 0.8em;
|
||||
border-radius: 0;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.oi-wrap .oi-txt {
|
||||
flex: 0 0 65%;
|
||||
max-width: 65%;
|
||||
}
|
||||
|
||||
.option_list {
|
||||
display: block;
|
||||
background: #fff;
|
||||
max-height: 224px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
|
||||
.oi-wrap .oi-price {
|
||||
flex: 0 0 35%;
|
||||
max-width: 35%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.original_price {
|
||||
color: #757575;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.d-block {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.discount_price {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
|
||||
.procedure-area:after {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
font-size: 0;
|
||||
clear: both;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.selected-procedure{
|
||||
margin-top:20px;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
|
||||
.selected-procedure .selt_info_wrap .info {
|
||||
top: 0.7rem;
|
||||
width: 9.5em;
|
||||
padding-top: 0.3em;
|
||||
}
|
||||
|
||||
.selt_info_wrap .info {
|
||||
position: absolute;
|
||||
top: 0.2rem;
|
||||
right: 0.2rem;
|
||||
width: 8.5em;
|
||||
padding-right: 1rem;
|
||||
padding-top: 0.2em;
|
||||
text-align: right;
|
||||
}
|
||||
.selt_info_wrap .info button{
|
||||
border:none;
|
||||
background-color:#fff;
|
||||
}
|
||||
|
||||
|
||||
.real_price {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
|
||||
.selected-procedure .selt_info_wrap {
|
||||
padding: 0.8rem 0;
|
||||
z-index:0;
|
||||
}
|
||||
|
||||
.selt_info_wrap {
|
||||
position: relative;
|
||||
min-height: 2.5rem;
|
||||
background-color:#fff;
|
||||
border:1px solid #eee;
|
||||
}
|
||||
|
||||
.selected-procedure .selt_info_wrap .selt {
|
||||
padding-right: 9.5em;
|
||||
padding-left: 1rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.selt_info_wrap .selt {
|
||||
padding-top: 0.3em;
|
||||
padding-right: 8.5em;
|
||||
}
|
||||
|
||||
.total-price-area .total {
|
||||
position: relative;
|
||||
background-color: #e6e6e6;
|
||||
padding: 25px 25px 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.total-price-area .total .txt_sub {
|
||||
color: #222222;
|
||||
font-size: 2rem;
|
||||
opacity: 1;
|
||||
}
|
||||
.total-price-area .total .right strong {
|
||||
font-size: 22px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.total-price-area .total-price-txt {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
|
||||
.total-price-area .total .bs-txt {
|
||||
position: absolute;
|
||||
bottom: 17px;
|
||||
right: 25px;
|
||||
display: block;
|
||||
margin-top: 4px;
|
||||
font-size: 12px;
|
||||
color: #999999;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
|
||||
|
||||
.main_btn {
|
||||
text-align: right;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
.main_btn button {
|
||||
width: 180px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
|
||||
.fastrack-btn {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
border: 1px solid #a73439;
|
||||
background-color: #a73439;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.img-content{
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.img-area{
|
||||
padding-top: 70px;
|
||||
padding-bottom: 200px;
|
||||
text-align:center;
|
||||
}
|
||||
@@ -0,0 +1,110 @@
|
||||
/* main_img */
|
||||
.project_wrap .same main .main_img .text_box > div { width:50%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p { font-size:52px; color:#000; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box p span { font-weight:700; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p { color:#fff; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#fff; }
|
||||
/* content5 */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
|
||||
.project_wrap .same aside {background: white; width: 30%; top: 12%;}
|
||||
.project_wrap .same aside ul{position: fixed; left: 5%; width: 19%;}
|
||||
.project_wrap .same aside ul li{margin-bottom: 0.5rem; margin-top: 0px;}
|
||||
.project_wrap .same aside .first {padding-top: 1rem; padding-bottom: 1rem;}
|
||||
.project_wrap .same aside .nonactive {border: 1px solid #d8d8d8; background-color: #f9f9fb;}
|
||||
.project_wrap .same aside .active {border: 1px solid #d8d8d8; color: #a73439; background-color: rgba(118, 35, 47, 0); border-left: 2px solid #a73439;}
|
||||
.project_wrap .same aside ul a{padding-left: 10px;}
|
||||
.project_wrap .same main {width: 60%; padding-top: 7%;}
|
||||
.project_wrap .same main ul{padding-top: 2%; width:102%;}
|
||||
.event-card-list > ul { display: block; list-style-type: disc; margin-block-start: 1em; margin-block-end: 1em; padding-inline-start: 40px; unicode-bidi: isolate; }
|
||||
.event-card-list > li { margin-bottom: 70px; opacity: 1;}
|
||||
.event-card-list .event-card { display: block; position: relative; width: 775px; height: 196px; padding-right: 10px; margin-left: auto; overflow: hidden;}
|
||||
.event-card .img_box { position: relative; width: 350px; height: 100%; background-color: black; float: left; overflow: hidden; }
|
||||
.event-card .img_box img { position: absolute; min-width: 100%; min-height: 100%; width: 100%; height: 100%; margin: auto; top: 0; bottom: 0; left: 0; right: 0; opacity: 1; transform: scale(1); transition: .4s ease-out;}
|
||||
.event-card .txt-box { position: relative; padding-top: 115px; width: 343px; height: 100%; float: right;}
|
||||
.event-card .txt-box .tit-txt { position: absolute; left: 0; bottom: 88px;}
|
||||
.txt-box .tit-txt > p { margin: 0; font-size: 22px; font-weight: 500; line-height: 1.3;}
|
||||
.event-card .txt-box > .sub-txt { font-size: 12px;}
|
||||
.one-ellip { position: relative;overflow: hidden; white-space: nowrap; text-overflow: ellipsis; left: 0%; width: 100%;-webkit-transition: left 3s, width 3s; -moz-transition: left 3s, width 3s; transition: left 3s, width 3s;}
|
||||
.event-card .txt-box .ab_cont { padding-top: 10px;}
|
||||
.ab_cont .cost { font-size: 13px; font-weight: 400; color: #7D7971;}
|
||||
del { text-decoration: line-through;}
|
||||
.ab_cont .discount { display: block; font-size: 1rem;}
|
||||
.ab_cont .discount .txt_num { font-size: 1.6em; font-weight: 600; color: #9F2A2A;}
|
||||
.event-card .txt-box .tit-txt:After { content: ''; position: absolute; top: -49px; left: 0; width: 18px; height: 35px; background: center / contain url(https://www.toxnfill2.com/imges/ico-toxnfill-g.png) no-repeat;}
|
||||
.event-card-list .event-card:after { content: ''; position: absolute; bottom: 9px; right: 0; width: 58px; height: 15px; background: center / contain url(https://www.toxnfill2.com/imges/long-arrow-right-g.png) no-repeat;}
|
||||
.add-ticket-btn {
|
||||
font-size: 1.2rem;
|
||||
font-weight: 400;
|
||||
letter-spacing: -0.03em;
|
||||
padding: .35rem 1rem;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 50em;
|
||||
transition: 0.2s;
|
||||
background:white;
|
||||
}
|
||||
.right { float: right;}
|
||||
.left { float: left;}
|
||||
.card_otxt {
|
||||
position: relative;
|
||||
display: block;
|
||||
border-radius: 1rem;
|
||||
padding: 1rem;
|
||||
}
|
||||
.border {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
.__card_otxt {
|
||||
height: 95px;
|
||||
}
|
||||
.row>.col2 {
|
||||
width: 50%;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.row.row_padding>.col2, .row.row_padding>.col3, .row.row_padding>.col4, .row.row_padding>.col5 {
|
||||
padding-right: 1rem;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
.row.row_padding {
|
||||
margin-left: -1rem;
|
||||
margin-right: -1rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.border-b {
|
||||
border-bottom: 1px solid #ddd;
|
||||
height:5%;
|
||||
}
|
||||
.txt_num {
|
||||
font-family: 'Campton', Sans-serif;
|
||||
font-weight: 600;
|
||||
color: #A73439;
|
||||
}
|
||||
.card_otxt .ab_cont {
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
top: 3.4rem;
|
||||
width: 8.5em;
|
||||
text-align: right;
|
||||
}
|
||||
.card_otxt .fix_cont {
|
||||
padding-right: 11.5rem;
|
||||
}
|
||||
.card_otxt .fix_cont p {
|
||||
margin-bottom: 0;
|
||||
word-break: keep-all;
|
||||
}
|
||||
.mb3{margin-bottom: 3rem;}
|
||||
.mt70{margin-top: 70%;}
|
||||
|
||||
|
||||
/* 반응형 - 모바일 */
|
||||
@media only screen and (max-width:768px){
|
||||
/* main_img */
|
||||
.project_wrap .same main .content5 { padding-bottom:0; }
|
||||
.project_wrap .same main .main_img .text_box > div { width:100%; }
|
||||
.project_wrap .same main .main_img .text_box .right_text_box { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p br { display:none; }
|
||||
.project_wrap .same main .main_img .text_box .left_text_box p span { color:#000; }
|
||||
.project_wrap .same main {width: 100%;}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
.project_wrap main ul li .img_box img { height:260px; }
|
||||
BIN
src/main/resources/static/font/admin/Pretendard-Black.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Black.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Black.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Black.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Black.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Black.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Bold.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Bold.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Bold.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Bold.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Bold.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Bold.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-ExtraBold.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-ExtraBold.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-ExtraBold.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-ExtraBold.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-ExtraBold.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-ExtraBold.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-ExtraLight.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-ExtraLight.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-ExtraLight.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-ExtraLight.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-ExtraLight.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-ExtraLight.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Light.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Light.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Light.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Light.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Light.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Light.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Medium.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Medium.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Medium.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Medium.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Medium.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Medium.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Regular.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Regular.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Regular.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Regular.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Regular.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Regular.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-SemiBold.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-SemiBold.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-SemiBold.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-SemiBold.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-SemiBold.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-SemiBold.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Thin.otf
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Thin.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Thin.woff
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Thin.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/admin/Pretendard-Thin.woff2
Normal file
BIN
src/main/resources/static/font/admin/Pretendard-Thin.woff2
Normal file
Binary file not shown.
Binary file not shown.
BIN
src/main/resources/static/font/index/SCDreamExtraBold.woff2
Normal file
BIN
src/main/resources/static/font/index/SCDreamExtraBold.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/index/SCDreamMedium.woff2
Normal file
BIN
src/main/resources/static/font/index/SCDreamMedium.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/index/SCDreamRegular.woff2
Normal file
BIN
src/main/resources/static/font/index/SCDreamRegular.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/index/gmarketsansmedium.woff
Normal file
BIN
src/main/resources/static/font/index/gmarketsansmedium.woff
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/index/xeicon.woff2
Normal file
BIN
src/main/resources/static/font/index/xeicon.woff2
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/11롯데마트드림Light.otf
Normal file
BIN
src/main/resources/static/font/web/11롯데마트드림Light.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/12롯데마트드림Bold.ttf
Normal file
BIN
src/main/resources/static/font/web/12롯데마트드림Bold.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/12롯데마트드림Light.ttf
Normal file
BIN
src/main/resources/static/font/web/12롯데마트드림Light.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/12롯데마트드림Medium.ttf
Normal file
BIN
src/main/resources/static/font/web/12롯데마트드림Medium.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/Cafe24Classictype-v1.1.otf
Normal file
BIN
src/main/resources/static/font/web/Cafe24Classictype-v1.1.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/Cafe24Classictype-v1.1.ttf
Normal file
BIN
src/main/resources/static/font/web/Cafe24Classictype-v1.1.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/Jalnan2.otf
Normal file
BIN
src/main/resources/static/font/web/Jalnan2.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/Jalnan2TTF.ttf
Normal file
BIN
src/main/resources/static/font/web/Jalnan2TTF.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/Jua-Regular.ttf
Normal file
BIN
src/main/resources/static/font/web/Jua-Regular.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeo-Bd.ttf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeo-Bd.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeo-Eb.ttf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeo-Eb.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeo-Hv.ttf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeo-Hv.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeo-Lt.ttf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeo-Lt.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeo-Rg.ttf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeo-Rg.ttf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeoOTF-Bd.otf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeoOTF-Bd.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeoOTF-Eb.otf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeoOTF-Eb.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeoOTF-Hv.otf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeoOTF-Hv.otf
Normal file
Binary file not shown.
BIN
src/main/resources/static/font/web/NanumSquareNeoOTF-Lt.otf
Normal file
BIN
src/main/resources/static/font/web/NanumSquareNeoOTF-Lt.otf
Normal file
Binary file not shown.
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user